*, :after, :before {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}
.container{
    max-width: 1260px;
    margin: auto;
}
.row {
    display: flex
}
[class*=col-] {
    float: left;
    padding: 10px;
    width: 100%;
}
.col-10 {
    width: 10%;
}
.col-20 {
    width: 20%;
}
.col-25 {
    width: 25%;
}
.col-30 {
    width: 30%;
}
.col-33 {
    width: 33.3333333%;
}
.col-40 {
    width: 40%;
}
.col-50 {
    width: 50%;
}
.col-60 {
    width: 60%;
}
.col-70 {
    width: 70%;
}
.col-80 {
    width: 80%;
}

@media only screen and (max-width:450px) {
.row {
    display: block
}
[class*=col-] {
    width: 100%
}
}
@font-face {
    font-family: icomoon;
    src: url(fonts/icomoon.eot?hupyko);
    src: url(fonts/icomoon.eot?hupyko#iefix) format('embedded-opentype'), url(fonts/icomoon.ttf?hupyko) format('truetype'), url(fonts/icomoon.woff?hupyko) format('woff'), url(fonts/icomoon.svg?hupyko#icomoon) format('svg');
    font-weight: 400;
    font-style: normal;
    font-display: block
}
[class*=" icon-"], [class^=icon-] {
    font-family: icomoon!important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}
.icon-search:before {
  content: "\e908";
}
.icon-calendar:before {
  content: "\e90a";
}
.icon-user:before {
  content: "\e906";
}
.icon-cart:before {
  content: "\e905";
}
.icon-load:before {
  content: "\e982";
}
.icon-facebook:before {
  content: "\ea91";
}
.icon-instagram:before {
  content: "\ea92";
}
.icon-whatsapp:before {
  content: "\ea93";
}
.icon-close:before {
  content: "\e904";
}
.icon-location:before {
  content: "\e909";
}
.icon-home:before {
  content: "\e900";
}
.icon-phone:before {
  content: "\e907";
}
.icon-menu:before {
  content: "\e903";
}
.icon-mail:before {
  content: "\e901";
}
.icon-youtube:before {
  content: "\e902";
}
body{font-size:16px;}
header{padding:16px 0;}
header #logo{float: left;width:250px;}#logo img{height:49px;display: block;}
header nav{float: left;width:calc(100% - 250px);}
header #logo .toggler{display: none;}
header #menu{float: left;}
header #menu2{float: right;}

.menu{display: flex;list-style: none;}
.menu li{margin:0 auto;border:1px solid #000;}
.menu li a{display: block;padding:1rem;color:#8593FF;text-decoration: none;}



@media only screen and (max-width:450px) {
    header #menu{ transform:translateX(100%);}
    header #logo{display: flex;}
    header #logo .toggler{display: block;font-size:2rem;padding:0 16px;cursor:pointer;}
    header.menu{position: fixed;background: #FFF;top:0;bottom:0;right:0;lef:0;width:100%;}
    header.menu #menu{display: block; transition: all 0.6s ease;transform: translateX(0);}
    header nav{overflow: hidden;height: 0;}
    header.menu nav{height: 100%}
}