*, *:before, *:after {
    box-sizing: inherit;
}

body {
    width: 100%;
    overflow-x: hidden;
}

body.menu_open {
  overflow: hidden;
  height: 100%;
  position: fixed;
}

html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    box-sizing: border-box;
	font-family: "NeueHaasUnica";
    color: #282829;
    font-size: 14px;
    line-height: 1.7em;
}

@media only screen and (max-width: 500px) {
.wrapper {
    width: 100%;
    max-width: 100%;
    padding: 0 4%;
}}
@media only screen and (max-width: 1160px){
.wrapper {
    width: 100%;
    max-width: 100%;
    padding: 0 2%;
}}

.wrapper {
    width: 100%;
    max-width: 1100px;
    position: relative;
    margin: 0 auto;
}

.wrapper.narrow {
    max-width: 800px;
}

.visually_hidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    white-space: nowrap;
}

.cf:before, .cf:after {
    content: " ";
    display: table;
}

.cf:after {
    clear: both;
}

.wrapper:before, .wrapper:after {
    content: " ";
    display: table;
}