@font-face{font-display:swap;font-family:mto;font-style:normal;font-weight:400;src:url(../fonts/mto-regular.woff) format("woff");src:url(../fonts/mto-regular.woff2) format("woff2")}@font-face{font-display:swap;font-family:mto;font-style:normal;font-weight:700;src:url(../fonts/mto-medium.woff) format("woff");src:url(../fonts/mto-medium.woff2) format("woff2")}@font-face{font-display:swap;font-family:mto;font-style:italic;font-weight:400;src:url(../fonts/mto-italic.woff) format("woff");src:url(../fonts/mto-italic.woff2) format("woff2")}:root{--blue:#86b4c8;--dark-blue:#283344;--green:#79c53b;--dark-green:#009959;--grey:#b5b8bd;--light-blue:#eaf1f4;--light-grey:#f9f9f9;--medium-blue:#69707c;--medium-grey:#f6f7f8;--orange-gradient:linear-gradient(90deg,#f13d3d 1.02%,#ff8342);--text-gradient:linear-gradient(90deg,#f13d3d,#ff8342 13%);--red:#f13d3d;--solid-orange:#f75b3f;--yellow:#f3d1a7;--container-width:1400px}*{box-sizing:border-box}body,html{font-size:16px;height:100vh;margin:0}body{background-color:#fff;color:var(--dark-blue);font-family:mto,sans-serif;margin:0;padding:0;position:relative;&.noscroll{overflow:hidden}}.layout-wrapper{display:flex;flex-direction:column;min-height:100vh;>*{flex:1}}main{margin:auto;max-width:var(--container-width);width:100%;:not(header,.banner) p,li{line-height:1.6}}button,dd,fieldset,figure,h1,h2,h3,h4,h5,h6,hgroup,hr,img,ol,p,pre,table,ul{margin-bottom:1.5rem;margin-top:0;&.margin-sm{margin-bottom:.5rem}&.no-margin{margin-bottom:0}}li>p{margin-bottom:0}.inline-error{color:var(--red)}fieldset{border:0;margin:0;padding:0;.inline-error{font-size:14px}}a{color:var(--dark-blue);text-underline-offset:3px}button,input,select,textarea{font-family:inherit;font-size:inherit}.link-btn,button{&.large{font-size:18px;padding:14px 30px}&.fullwidth{width:100%}&:disabled{cursor:default;opacity:.4}&.simple{background:var(--dark-blue);border:1px solid var(--dark-blue);transition:background .15s,color .15s;&:hover:not(:disabled){background-color:#fff;color:var(--dark-blue)}}}select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:#fff;background-image:none;border:none;border-radius:0;color:inherit;display:block;font-size:inherit;height:40px;outline:none;width:100%}input:not([type=checkbox],[type=radio]),select,textarea{border:1px solid color-mix(in srgb,var(--dark-blue),transparent 65%);border-radius:5px;display:inline-block;height:40px;padding-left:10px;transition:box-shadow .2s;width:100%}input:not([type=search],[type=number]),textarea{border:1px solid rgba(40,51,68,.5);box-shadow:none;outline:none;&:focus{box-shadow:0 0 4px 1px #1f73fa}&.valid,&:valid:not(:empty){box-shadow:0 0 4px 1px #60c530}&.invalid,&:invalid:not(:empty){box-shadow:0 0 4px 1px red}}input[type=search]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}input::-webkit-search-cancel-button,input::-webkit-search-decoration{display:none}table{width:100%;tr:nth-child(2n){background-color:var(--light-grey)}td,th{padding:10px;text-align:left}th{color:var(--dark-blue)}p{margin-bottom:0}}.block-message{border-radius:2px;color:#fff;list-style-type:none;padding:6px 20px;&.note{background-color:#f9f9f9;border-radius:4px;color:#777;font-size:15px;margin-top:5px;padding:10px}&.success{background-color:var(--green)}&.error{background-color:var(--red)}a{color:#fff!important}}.search-results{background-color:#fff;border:1px solid var(--dark-blue);border-radius:4px;box-shadow:0 1px 3px var(--dark-blue);list-style-type:none;margin-top:-4px;padding:0;position:absolute;text-align:left;width:100%;z-index:1;li{margin:0!important;position:relative;transition:background-color .2s;&.no-match{padding:10px}a{display:block;height:100%;padding:17px 30px;text-decoration:none;width:100%;&:hover{color:inherit}}&:before{background-color:var(--dark-blue);content:"";display:block;height:1px;margin:auto;width:calc(100% - 60px)}&:first-of-type:before{display:none}&:after{content:url(../img/icons/search-arrow.svg);position:absolute;right:32px;top:20px}&:hover{background-color:var(--light-blue)}&.no-result{padding:17px 30px;&:after{display:none}&:hover{background-color:transparent}}}}.customer-form{align-items:flex-start;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;position:relative;input,select,textarea{background-color:var(--light-grey);display:block;height:50px;margin-top:5px}p{margin:0}.col-6{flex-basis:calc(50% - 10px)}.col-12{flex-basis:100%}}.overlay{background-color:var(--dark-blue);height:100%;left:0;opacity:0;position:fixed;top:0;transition:opacity .2s;width:100%;z-index:50;&.visible{opacity:.4}&.menu{background-color:#fff;display:block;height:100vh;position:absolute;width:100vw}}.header-menu{align-items:center;display:flex;gap:50px;height:54px;margin-bottom:30px;padding:0;@media(width<=991px){gap:5px;justify-content:space-between}@media(width>=769px){padding:0 20px}@media(width>=1400px){padding:0}a{text-decoration:none}ul{display:flex;flex-basis:70%;flex-grow:1;justify-content:space-between;list-style-type:none;padding:0;@media(width<=768px){.menu-item-has-children:before{background-image:url(../img/icons/breadcrumb-chevron.svg);background-repeat:no-repeat;background-size:contain;content:"";height:12px;margin-top:6px;position:absolute;right:20px;transition:opacity .1s;width:10px}}li.active{&.menu-item-has-children:before{display:none;opacity:0}@media(width<=769px){&.active>a{color:var(--dark-blue);height:auto;margin-left:-200px;position:absolute;top:25px;transform:translate(225px);transition:transform .2s .2s;z-index:120;&:before{background-image:url(../img/icons/breadcrumb-chevron.svg);background-repeat:no-repeat;background-size:contain;content:"";height:12px;left:-30px;margin-top:6px;position:absolute;transform:rotate(180deg);width:10px}}}.children{display:flex;@media(width<=768px){display:block;height:100vh;transform:translate(0)}@media(width>=769px){transform:scale(1)}&:before,li{opacity:1}li{transition:opacity .2s .2s}}}.children{background-color:#fff;gap:10px;justify-content:space-between;left:0;margin-top:20px;padding:60px 0 90px;position:absolute;transform:scaleY(0);transform-origin:top;transition:transform .2s;width:100%;z-index:100;@media(width<=768px){border-bottom-color:currentcolor;border-bottom-style:none;border-bottom-width:medium;border-left-color:currentcolor;border-left-style:none;border-left-width:medium;border-right-color:currentcolor;border-right-style:none;border-right-width:medium;border-top-color:currentcolor;border-top-style:none;border-top-width:medium;display:block;gap:0;justify-content:unset;padding-left:40px;top:0;transform:scale(1);transform:translate(-100vw);transform-origin:left;&:before{background-color:var(--medium-blue);content:"";display:block;height:1px;margin:-5px 0 40px;opacity:0;transition:opacity .9s;width:calc(100% - 40px)}}@media(width>=769px){--width: calc(50vw - 550px) ;padding-left:max(15px,var(--width));padding-right:max(15px,var(--width))}li{opacity:0;transition:opacity .2s;@media(width<=768px){margin-bottom:10px}a.router-link-active{text-decoration:underline;text-decoration-color:var(--solid-orange)}a.heading.router-link-active{background:var(--orange-gradient);-webkit-background-clip:text;background-clip:text;color:transparent;position:relative;text-decoration:none;&:after{background:var(--orange-gradient);bottom:-2px;content:"";height:3px;left:0;padding:0 4px;position:absolute;transform:translate(-4px);width:100%}}}a{font-weight:400}.heading{background:var(--orange-gradient);-webkit-background-clip:text;background-clip:text;color:transparent;position:relative}}.menu-item-has-grandchildren>.children{gap:100px;justify-content:flex-start}&.grandchildren{flex-direction:column;margin-top:13px;li{margin-bottom:10px}a{text-transform:none}}img{margin:0}}>ul{gap:30px;margin:15px 15px 10px 0;@media(width<=768px){background-color:#fff;bottom:0;flex-direction:column;gap:15px;height:100vh;justify-content:flex-start;margin:0;overflow:auto;padding:100px 0 0 40px;position:absolute;top:0;transform:translate(-2000px);transition:transform .3s ease-in-out;width:100%;z-index:100;li{opacity:0;transition:opacity .2s .4s}}&.active{transform:translate(0);li{opacity:1}}>li{>a{display:block;font-size:12px;font-weight:700;height:100%;margin-bottom:10px;position:relative;text-transform:uppercase;@media(width<=768px){font-size:18px;font-weight:400;text-transform:none}@media(width>=1200px){font-size:14px;&:after{background:var(--orange-gradient);bottom:-10px;content:"";height:3px;left:0;opacity:0;padding:0 4px;position:absolute;transform:translate(-4px);transition:opacity .2s;width:100%}}}@media(width>=1200px){&.has-active-child>a:after,a.router-link-active:after,a:hover:after{opacity:1}}@media(width<=768px){&:last-of-type{a{margin-bottom:20px}&:after{background-color:var(--medium-blue);content:"";display:block;height:1px;width:calc(100% - 40px)}}}}>li.has-active-child>a,>li>a.router-link-active{@media(width<=768px){background:var(--orange-gradient);-webkit-background-clip:text;background-clip:text;color:transparent}}}.searchbar{position:relative;@media(width<=768px){width:65%}@media(width>=769px){margin-right:15px;top:-5px}@media(width>=1200px){width:350px}input{background-color:#fff;background-image:url(../img/icons/search.svg);background-position:left 10px center;background-repeat:no-repeat;background-size:16px;border:none;border-bottom:1px solid var(--medium-blue);border-radius:0;box-shadow:none;font-size:16px;height:30px;outline:none;padding-left:50px;position:relative;width:100%;z-index:10;&::-moz-placeholder{color:var(--dark-blue);opacity:1}&::placeholder{color:var(--dark-blue);opacity:1}@media(width>=769px)and (width<=991px){padding-left:40px}}.search-results{display:block;font-size:13px;z-index:10;li{&:before{width:calc(100% - 30px)}&:after{display:none}a{padding:17px 15px}}}}.mini-cart{display:block;height:23px;position:relative;width:23px;@media(width<=768px){margin-right:15px}@media(width>=769px){top:-5px}.item-count{align-items:center;background:#fff;background:var(--orange-gradient);border-radius:10px;color:#fff;display:flex;font-size:11px;height:18px;justify-content:center;position:absolute;right:-10px;top:-7px;width:18px}}&:after{background-color:#28334433;content:"";height:1px;left:0;margin-bottom:-54px;position:absolute;right:0}}.menu-toggle{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:none;cursor:pointer;display:none;left:10px;margin:15px 0 10px;outline:none;padding:0;position:relative;transition:transform .2s;transition-timing-function:ease-out;z-index:120;@media(width<=768px){display:block}span{background-color:var(--dark-blue);display:block;height:2px;margin-bottom:5px;position:relative;transform-origin:0 100%;transition:transform .5s cubic-bezier(.77,.2,.05,1),background .5s cubic-bezier(.77,.2,.05,1),opacity .55s ease;width:26px;z-index:1;&:nth-child(2){transform-origin:0 0}&:last-child{transform-origin:4px 0}}&.active{transform:translate(calc(100vw - 60px),-90px);transition:transform .2s .3s;span{background-color:var(--dark-blue);opacity:1;transform:rotate(-45deg) translate(-6px,16px);&:nth-child(2){opacity:0;transform:rotate(0) scale(.2)}&:last-child{opacity:1;transform:rotate(45deg) translate(-5px,-14px)}}}}.main-header{margin:auto;max-width:var(--container-width);.message:before,.topbar:before{content:"";display:block;left:0;position:absolute;width:100%;z-index:-1}.message{align-items:center;color:#fff;display:flex;font-size:13px;height:35px;justify-content:start;padding:0 20px;width:100%;&:before{background-color:var(--dark-blue);height:35px}@media(width>=992px){font-size:medium;justify-content:center}strong{font-weight:400;text-transform:uppercase}p{margin:0;@media(width<=768px){display:none}}a{color:#fff;transition:text-decoration-color .2s;&:hover{text-decoration-color:var(--red)}}}.quick-nav{display:flex;float:right;gap:25px;left:-10px;list-style-type:none;margin-bottom:10px;position:relative;top:-28px;@media(width>=1400px){left:0}a{color:#fff;font-size:15px;font-weight:700;text-decoration:none;text-transform:uppercase}}.mto-bros-logo{align-items:center;display:flex;height:50%;justify-content:center;text-align:center;width:100%;img{margin-bottom:5px;max-width:90%;width:490px}}&:after{backdrop-filter:blur(10px);content:"";display:block;height:100%;left:0;opacity:0;position:absolute;transform:scaleY(0);transition:opacity .2s;width:100%;z-index:50}&.unfolded:after{opacity:1;transform:scaleY(1)}}.footer{background-color:var(--dark-blue);color:#d0d2d6;margin:auto;position:relative;width:100%;p,ul{margin:0}ul{list-style-type:none;padding:0}a{color:#d0d2d6;text-decoration-color:transparent;text-underline-offset:4px;transition:text-decoration-color .2s;&:hover{text-decoration-color:#fff}}.customer-care{border-bottom:1px solid #535c69;display:flex;font-size:15px;font-weight:700;justify-content:space-between;margin:auto;padding:30px 0;width:1400px;@media(width<=1400px){padding:30px 10px;width:auto}@media(width<=768px){flex-wrap:wrap;padding:30px 20px;row-gap:50px}.block{padding-left:40px;position:relative;text-decoration:underline;text-underline-offset:5px;&:before{left:0;position:absolute}@media(width<=992px){align-items:center;display:flex;flex-basis:45%;flex-direction:column;padding:40px 0 0;text-align:center;text-decoration:none;&:before{left:auto;top:0}}&.fidelity-program:before{content:url(../img/icons/loyalty-program-circle.svg)}&.fast-delivery:before{content:url(../img/icons/lightning-circle.svg)}&.money-back:before{content:url(../img/icons/happy-customer.svg)}&.payment-options:before{content:url(../img/icons/3-installments-circle.svg)}}small{display:inline-block;font-size:14px;font-weight:400;margin-top:17px;text-decoration:none;@media(width<=992px){margin-top:7px}}}.site-nav{display:flex;justify-content:space-between;margin-bottom:20px;padding:30px calc(50% - 700px);@media(width<=1400px){padding:30px 10px}@media(width<=768px){flex-wrap:wrap;gap:30px;justify-content:space-around;padding:30px 20px;text-align:center;&:after{content:""}&:after,nav{flex-basis:40%}}h3{color:#fff;font-size:15px;margin-bottom:15px}li{font-size:12px;line-height:2}.networks{display:flex;gap:10px;img{transition:transform .3s;width:25px;&:hover{transform:rotate(20deg)}}}}.legal{align-items:center;background-color:#434e61;bottom:0;display:flex;height:40px;justify-content:center;position:absolute;width:100%;li{float:left;font-size:12px;margin-right:10px;padding-right:10px}}.language-select{background-color:#fff;border:1px solid var(--light-grey);border-radius:4px;bottom:60px;box-shadow:0 0 15px 10px var(--dark-blue);color:var(--dark-blue);left:40px;padding:50px;position:fixed;transform:translate(-500px);transition:transform .2s .2s;z-index:100;&.active{transform:translate(0)}@media(width<=768px){left:0;margin:auto;padding:10px;right:0;width:90%}h1{font-size:17px;margin-top:30px;span:not(.active){display:none}}li{margin-bottom:30px;a:before{background-size:contain;border-radius:15px;display:inline-block;margin-right:40px;position:relative;top:12px}&.lang-item-en a:before{content:url(../img/icons/uk-flag.svg)}&.lang-item-es a:before{content:url(../img/icons/es-flag.svg)}&.lang-item-fr a:before{content:url(../img/icons/fr-flag.svg)}}a{color:var(--dark-blue);font-size:15px;font-weight:700}}}.error-page{background-image:url(../img/rider-abducted.svg);background-position:100%;background-repeat:no-repeat;background-size:contain;font-size:17px;margin:80px auto;padding:70px;width:100%;p{max-width:400px;&:last-of-type{margin-bottom:12px}}ul{list-style-type:none;padding:0}a{display:inline-flex;transition:color .2s;&:after{content:url(../img/icons/link-arrow-dark.svg);margin-left:10px;margin-top:2px;transition:filter .2s}&:hover{color:var(--red);&:after{filter:invert(34%) sepia(65%) saturate(1391%) hue-rotate(330deg) brightness(98%) contrast(101%)}}}}