@charset "utf-8";
/* CSS Document */

/*reset*/
*{margin:0; padding:0; outline:none; box-sizing:border-box;}
img,fieldset{border:0px; display:block;}
br.clear, div.clear{clear:both; font-size:0px;}
ul, ol{list-style:none;}
textarea, input.text, input[type="text"], input[type="button"], input[type="submit"], .input-checkbox, button{-webkit-appearance:none; border-radius:0;}

header, nav, article, aside, section, footer{display:block; overflow:hidden;}
header, section, footer{width:100%; height:auto; position:relative;}

/*template*/
html{width:100%; height:100%; font-size:62.5%;}
body{width:100%; height:100%; background-color:#f1f1f2; font-family:'Roboto', sans-serif; font-size:1.6rem; line-height:1.628571; color:#222222; overflow-x:hidden; overflow-y:scroll; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;}

/*text*/
h1, h2, h3, h4, h5, h6{width:100%; height:auto; line-height:1.2; font-weight:normal; font-family:'Roboto', sans-serif; color:#E5192C;}
h1{font-size:5.0rem; margin-bottom:24px; color:#ffffff; text-decoration:underline;}
h2{font-size:3.0rem; margin-bottom:32px; font-weight:500;}
h3{font-size:2.6rem; margin-bottom:32px; font-weight:700;}
h4{font-size:3.0rem; font-weight:400; margin-bottom:32px; text-align:center; text-decoration:underline;}
h1.nomargin, h2.nomargin, h3.nomargin{margin:0px;}
h2.bigger{font-size:5.0rem;}
article ul{list-style:disc; list-style-position:inside;}
p{margin:0px 0px 32px 0px;}
a, a *{color:#E5192C; text-decoration:none;}
article a:hover{color:#17a2b8;}
.center{text-align:center;}

/*forms*/
.offer-grid{display:grid; grid-template-columns:1fr 1fr; grid-gap:32px;}
form.form-grid{accent-color:#D83179;}
form.form-grid{display:grid; grid-template-columns:200px auto; gap:16px;}
form.form-grid.smaller{width:80%; margin:0px auto;}
form.form-grid .wide{grid-column-end:span 2;}
form.form-grid h2{margin-top:35px; margin-bottom:0px; font-size:2.4rem;}
form.form-grid h3{margin-top:35px; margin-bottom:0px; font-size:2.0rem;}
form.form-grid h3.nomargin{margin-top:0px;}
form.form-grid div{padding:8px 0px;}
form.form-grid div.hide{display:none;}
form.form-grid div.row{border-bottom:1px dotted #eae9e9;}
form.form-grid div.noborder{border-bottom:none !important;}
form.form-grid div.label{color:#2a2620;}
form.form-grid div.row label.red{color:#e2001a;}
form.form-grid div.row label{margin-left:4px;}
form.form-grid div span{display:block; height:32px; line-height:32px; color:#a3a3a3; font-size:1.2rem;}
form.form-grid div input[type="datetime-local" i],
form.form-grid div input[type="time" i],
form.form-grid div input[type="date" i]{color:#2a2620;}
form.form-grid div input[type="text"],
form.form-grid div input[type="number"],
form.form-grid div input[type="date"],
form.form-grid div input[type="time"],
form.form-grid div input[type="datetime-local"]{width:100%; height:30px; line-height:30px; font-size:1.4rem; font-family:'Roboto', sans-serif; padding:16px; border-radius:8px; border:1px solid #eae9e9; color:#444444; background:#ffffff;}
form.form-grid div select{width:100%; height:24px; line-height:30px; font-size:1.4rem; padding:16px; border-radius:8px; color:#444444; background:#ffffff; border:1px solid #eae9e9; font-family:'Roboto', sans-serif; }
form.form-grid div select{height:unset; line-height:unset; padding:8px 16px;}
form.form-grid div select option{color:#555555;}
form.form-grid div input[type="radio"]{}
form.form-grid div input[type="text"].red,
form.form-grid div input[type="number"].red,
form.form-grid div input[type="date"].red,
form.form-grid div input[type="time"].red,
form.form-grid div select.red,
form.form-grid div input[type="datetime-local"].red{border:1px solid #e2001a;}
form.form-grid div input[type="text"]:focus,
form.form-grid div input[type="number"]:focus,
form.form-grid div input[type="date"]:focus,
form.form-grid div input[type="time"]:focus,
form.form-grid div input[type="datetime-local"]:focus{border:1px solid #2a2620;}
form.form-grid div textarea{width:100%; height:300px; line-height:30px; padding:16px; border-radius:8px; background:#ffffff; color:#2a2620; border:1px solid #eae9e9; font-size:1.4rem; font-family:'Roboto', sans-serif; color:#444444;} 
form.form-grid div textarea:focus{border:1px solid #2a2620;}
form.form-grid div.productprice span{color:#26c983; height:unset; font-family:'Roboto', sans-serif; font-size:3.3rem; display:flex; justify-content:center; margin:5px 0px; font-weight:500; line-height:65px;}
form.form-grid div.productprice span strike{color:#58889c; font-size:24px; font-size:2.4rem; line-height:84px; margin-right:35px;}
form.form-grid div.radio-image{display:grid; grid-template-columns:repeat(6,1fr); grid-gap:12px;}
form.form-grid div.radio-image label{font-weight:500; font-size:1.4rem; text-align:center;}
form.form-grid div.radio-image input[type="radio"]{position:absolute; opacity:0; width:0;height:0;}
form.form-grid div.radio-image .headlabel{position:absolute; top:-25px; opacity:1; left:0; font-size:11px; color:#8b8f96; padding:0px 1%; transition:all 0.1s linear; font-weight:bold;}
form.form-grid div.radio-image input[type="radio"]{position:absolute; opacity:0; width:0; height:0;}
form.form-grid div.radio-image input[type="radio"] + img{cursor:pointer; width:100%; margin-bottom:12px;}
form.form-grid div.radio-image input[type="radio"]:checked + img{outline:1px solid #E5192C; outline-width: 2px; outline-offset:2px;}
form.form-grid div.radio-image input[type="radio"]:not(:checked), 
form.form-grid div.radio-image [type="radio"]:checked{position: absolute; left:-9999px;}
form.form-grid div.radio-image input[type="radio"]:not(:checked) + label, 
form.form-grid div.radio-image [type="radio"]:checked + label{position:relative; color:#8b8f96; padding-left:25px; padding-right:25px; cursor:pointer; font-size:15px; font-size:1.5rem;}
form.form-grid div.radio-image input[type="radio"]:not(:checked) + label.red, 
form.form-grid div.radio-image [type="radio"]:checked + label.red{color:#c72230;}
form.form-grid div.radio-image input[type="radio"]:not(:checked) + label:before,
form.form-grid div.radio-image [type="radio"]:checked + label:before,
form.form-grid div.radio-image [type="radio"]:not(:checked) + label:after,
form.form-grid div.radio-image [type="radio"]:checked + label:after{content: ''; position:absolute;}
form.form-grid div.radio-image input[type="radio"]:not(:checked) + label:before, 
form.form-grid div.radio-image [type="radio"]:checked + label:before{left:0; top:0; width:18px; height:18px; background:#ffffff; overflow:hidden; border-radius:15px; transition:background-color .2s;}
form.form-grid div.radio-image input[type="radio"]:not(:checked) + label:after,
form.form-grid div.radio-image [type="radio"]:checked + label:after {width:16px; height:16px; transition:all .2s; border-radius:50%; background:#ffffff; top:0; left:0; border:1px solid #cdd0d6;}
form.form-grid div.radio-image input[type="radio"]:checked + label:before {background:#542f7b;}
form.form-grid div.radio-image input[type="radio"]:checked + label:after {display:none;}
form.form-grid div.checkbox-image{display:grid; grid-template-columns:repeat(6,1fr); grid-gap:12px;}
form.form-grid div.checkbox-image label{font-weight:500; font-size:1.4rem; text-align:center;}
form.form-grid div.checkbox-image input[type="checkbox"]{position:absolute; opacity:0; width:0;height:0;}
form.form-grid div.checkbox-image .headlabel{position:absolute; top:-25px; opacity:1; left:0; font-size:11px; color:#8b8f96; padding:0px 1%; transition:all 0.1s linear; font-weight:bold;}
form.form-grid div.checkbox-image input[type="checkbox"]{position:absolute; opacity:0; width:0; height:0;}
form.form-grid div.checkbox-image input[type="checkbox"] + img{cursor:pointer; width:100%; margin-bottom:12px;}
form.form-grid div.checkbox-image input[type="checkbox"]:checked + img{outline:1px solid #E5192C; outline-width: 2px; outline-offset:2px;}
form.form-grid div.checkbox-image input[type="checkbox"]:not(:checked), 
form.form-grid div.checkbox-image [type="checkbox"]:checked{position: absolute; left:-9999px;}
form.form-grid div.checkbox-image input[type="checkbox"]:not(:checked) + label, 
form.form-grid div.checkbox-image [type="checkbox"]:checked + label{position:relative; color:#8b8f96; padding-left:25px; padding-right:25px; cursor:pointer; font-size:15px; font-size:1.5rem;}
form.form-grid div.checkbox-image input[type="checkbox"]:not(:checked) + label.red, 
form.form-grid div.checkbox-image [type="checkbox"]:checked + label.red{color:#c72230;}
form.form-grid div.checkbox-image input[type="checkbox"]:not(:checked) + label:before,
form.form-grid div.checkbox-image [type="checkbox"]:checked + label:before,
form.form-grid div.checkbox-image [type="checkbox"]:not(:checked) + label:after,
form.form-grid div.checkbox-image [type="checkbox"]:checked + label:after{content: ''; position:absolute;}
form.form-grid div.checkbox-image input[type="checkbox"]:not(:checked) + label:before, 
form.form-grid div.checkbox-image [type="checkbox"]:checked + label:before{left:0; top:0; width:18px; height:18px; background:#ffffff; overflow:hidden; border-radius:15px; transition:background-color .2s;}
form.form-grid div.checkbox-image input[type="checkbox"]:not(:checked) + label:after,
form.form-grid div.checkbox-image [type="checkbox"]:checked + label:after {width:16px; height:16px; transition:all .2s; border-radius:50%; background:#ffffff; top:0; left:0; border:1px solid #cdd0d6;}
form.form-grid div.checkbox-image input[type="checkbox"]:checked + label:before {background:#542f7b;}
form.form-grid div.checkbox-image input[type="checkbox"]:checked + label:after {display:none;}
form.form-grid .submit{display:grid; grid-template-columns:1fr 1fr; grid-column-end:span 2;}
form.form-grid .submit div{padding:unset;}
form.form-grid .submit .button-left input[type=button],
form.form-grid .submit .button-left input[type=submit]{padding:8px 24px; color:#555555; background:#eae9e9; font-weight:500; border: none; border-radius:4px; float:left; cursor:pointer;}
form.form-grid .submit .button-right input[type=button],
form.form-grid .submit .button-right input[type=submit]{padding:8px 24px; color:#ffffff; background:#13b8b5; font-weight:500; border: none; border-radius:4px; float:right; cursor:pointer;}
form.form-grid .submit .button-right input[type=submit].grey{color:#f1f1f1; background-color:#444444; float:right;}
form.form-grid .submit .button-add{grid-column-end: span 2; }
form.form-grid .submit h3 span{font-size:1.6rem; font-weight:500;}
form.form-grid .submit.config{background:#ececec; padding:24px;}
form.form-grid .submit.config .left input[type=button],
form.form-grid .submit.config .left input[type=submit]{width:100%; background:#D83179;}

/*categorie filter*/
.categorie-grid{display:grid; grid-template-columns:260px auto; width: 100%; gap:12px;}
.categorie-grid.brands{grid-template-columns:1fr;}
.filter{padding:24px; background:#E5192C; height:fit-content; accent-color:#e5192c; border-radius:10px;}
.filter-grid{display:grid; gap:8px;}
.filter h2{color:white; margin-bottom:20px;}
.filter form .panel{display:grid; grid-template-columns:1fr; gap:8px;}
.filter form .panel h3{color:white;}
.filter form .panel h3:after{content:""; width:100%; height:2px; display:block; margin:10px 0; background-color:#ffffff;}
.filter form .panel .group .filters{display:grid; grid-template-columns:1fr; gap:8px; margin-bottom:15px;}
.filter form .panel .group .filters .row *{color:white;}
.filter form .panel .group .filters .row{margin-right:15px;}
.button.mobile-filter{display:none;}


/*floats*/
.left{float:left;}
.right{float:right;}

/*main-container*/
main{width:100%; max-width:1920px; min-height:100vh; margin:0px auto;}
.container{max-width:1260px; margin:0px auto; padding:0px 24px; position:relative;}

/*generals*/
section{padding:32px 0;}
.grid{display:grid;}
.bg-white{background-color:#ffffff;}
.bg-red{background-color:#e5192c;}
.bg-whitetransparant{background-color: rgba(255,255,255,0.9);}
.bg-greentransparant{background-color: rgba(28,175,146,0.9);}
.bg-green{background-color:#17a2b8;}
.title-blue{color:#E5192C;}
.title-white{color:#ffffff;}
.bg-gradient{background: rgb(229,25,44); background: linear-gradient(90deg,rgba(229,25,44,1) 0%, rgba(255,255,255,1) 100%);}
.shadow{-webkit-box-shadow: 6px 6px 15px 0px rgba(34,34,34,0.22); box-shadow: 6px 6px 15px 0px rgba(34,34,34,0.22);}
.gradientb{background: rgb(51,126,184);background: linear-gradient(90deg, rgba(229,25,44,1) 0%, rgba(160,17,31,1) 100%);}
.gradientg{background: rgb(35,185,138);background: linear-gradient(90deg, rgba(35,185,138,1) 0%, rgba(32,169,126,1) 100%);}
.button{min-width:fit-content; display:inline-block; background:#E5192C; color:#ffffff; padding:8px 16px; text-align:center; font-size:1.8rem; border-radius:10px; text-decoration:none !important;} 
.button.black:hover,
.button:hover{background:#17a2b8; color:#ffffff;} 
.button.white{background:#ffffff; color:#E5192C;}
.button.black{background:#1d1d1d; color:#ffffff;}
.button.white:hover{color:#17a2b8;}
.button.border{border:2px solid #E5192C;}
.button.border:hover{border:2px solid #17a2b8;}
.button.margin-top{margin-top:32px;}
/*.outline{padding:5px 16px; border: 3px solid #E5192C; color:#E5192C;}
.outline.blue{padding:5px 16px; border: 3px solid #17a2b8; color:#17a2b8;}
.outline:hover{background:#fff1f1; color:#222222;}*/
.buttonfull{width:100%; height:75px; display:inline-block; text-align:center; line-height:75px; font-size:2.0rem; border-radius:0 0 8px 8px; text-decoration:none !important;} 
.buttonfull:hover{background:#fff1f1; color:#222222;} 
.button.gradient{background: rgb(229,25,44); background: linear-gradient(90deg,rgba(229,25,44,1) 0%, rgba(255,255,255,1) 100%);}
.button.gradient:hover{background:#fff1f1;}
.sticker{display:block; padding:8px; line-height:24px; filter: drop-shadow(5px 5px 10px #000);}
.sticker span{display:inline-block; vertical-align:middle; line-height:normal; font-weight:700; font-family:'roboto',sans-serif; font-size:1.4rem; color:white;}
.video-container{position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden;}
.video-container iframe, .video-container object, .video-container embed {position:absolute; top:0; left:0; width:100%; height:100%;}

/*breadcrumbs*/
.breadcrumbs{width:100%; height:28px; background: rgb(229,25,44); background: linear-gradient(90deg,rgba(229,25,44,1) 0%, rgba(255,255,255,1) 100%); margin-bottom:24px;}
.breadcrumbs.no-bg{background:unset;}
.breadcrumbs.no-bg ol,
.breadcrumbs.no-bg a span{color:#E5192C !important;}
.breadcrumbs ol{display:flex; justify-content:flex-start; color:white;}
.breadcrumbs li{font-size:1.4rem; line-height:28px;}
.breadcrumbs a span{color:white !important;}

/*header*/
header{height:120px;}
header .container{padding:10px 24px; height:inherit;}
header .grid{grid-template-columns: 200px auto;  grid-template-rows: 35px 65px;grid-gap:32px;row-gap:0px;}
header .grid .logo{width:200px; aspect-ratio:200/61; grid-row:span 2; margin:auto 0;}
header .grid .logo img{width:100%; height:100%;  object-fit:cover;}
header .grid #submenu{text-align:right;}
header .grid #submenu a{font-size:1.6rem; font-weight:normal; line-height:52px; color:#222222;}
header .grid #submenu a:hover{color:#E5192C;}
header .grid nav ul{display:flex; justify-content:flex-end;}
header .grid nav ul.mobilesub{display:none;}
header .grid nav ul li{margin-left:32px;}
header .grid nav ul li a{font-size: 1.8rem; font-weight:500; line-height:65px; color:#E5192C;}
header .grid nav ul li a:hover{color:#17a2b8;}
header .grid .menu{display:none;}
header.scroll{position:fixed; top:0; background:rgba(255,255,255,0.8); z-index:9000; -webkit-box-shadow:0px 8px 5px 0px rgba(34,34,34,0.1); -moz-box-shadow:0px 8px 5px 0px rgba(34,34,34,0.1); box-shadow:0px 8px 5px 0px rgba(34,34,34,0.1);}

/*sections*/
section.slide{width:100%; height:650px; padding:unset;}
section.slide .image{width:100%; height:inherit; position:relative}
section.slide .image img{width:100%; height:100%; object-fit:cover;}
section.slide .gradient-bg{width:100%; height:100%; position:absolute; top:0; left:0; background: rgb(18,81,141); background:linear-gradient(90deg,rgba(229,25,44,1) 0%, rgba(255,255,255,0) 60%); z-index:100;}
section.slide .grey-bg{width:100%; height:100%; position:absolute; top:0; left:0; background:rgb(0,0,0,0.6); z-index:100;}
section.slide .hero{width:100%; height:100%; position:absolute; top:0; left:0; z-index:200;}
section.slide .hero .container{height:325px; margin-top:325px;}
section.slide .hero .container h1{text-decoration:none; font-size:8.0rem;}
section.slide .hero .container h2{color:#ffffff;}
section.slide .hero .container .button:first-of-type{margin-right:16px;}
section.slide.product{height:410px;}
section.slide.product .image{height:inherit;}
section.slide.product .hero .container{height:310px; margin-top:100px;}
section.slide.product .hero .container h1{text-decoration:none; font-size:6.0rem; font-weight:700;}

section.assortment{padding-bottom:16px;}
section.assortment .grid{grid-template-columns: repeat(1,1fr); grid-gap:48px;}
section.assortment .grid.splash{grid-template-columns: repeat(3,1fr);}
.product-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; height:fit-content;}
section.assortment .grid .highlight{border-radius:10px; height:fit-content;}
section.assortment .grid .highlight.top{display:grid; grid-template-columns: 1fr 1fr; grid-gap:32px; padding:32px; }
section.assortment .grid .highlight.top .image{width:577px; height:389px;}
section.assortment .grid .highlight.top .image img{border-radius:8px;}
section.assortment .grid .highlight h1{font-size:3.0rem; margin-bottom:32px; font-weight:500; text-decoration:none;}
section.assortment .grid .highlight .image{aspect-ratio:577/389;width:100%;}
section.assortment .grid .highlight .image img{width:100%; height:100%; object-fit:cover;}
section.assortment .grid .highlight .image a img{width:100%; height:100%; border-radius: 10px 10px 0 0; object-fit:cover;}
section.assortment .grid .highlight a.buttonfull{color:#ffffff;}
section.assortment .grid .highlight a.buttonfull:hover{color:#E5192C;}

section.description{padding-top:0px;}
section.description .bar{height:80px; width:100%;}
section.description .bar .container{padding: 0 24px;}
section.description .bar ul{display:flex; justify-content:flex-start;}
section.description .bar ul li{height:80px;}
section.description .bar ul li a{font-size:1.8rem; font-weight:700; margin-left:32px; line-height:80px; color:#ffffff;}
section.description .bar ul li:first-child a{margin-left:0px;}
section.description .bar ul li a:hover{color:#f1f1f2;}
section.description .grid{grid-template-columns:0.65fr 0.35fr; grid-gap:32px; position:relative; margin-bottom:64px;align-items:start;}
section.description .price div span{display:block; font-size:3.0rem; font-weight:700;}
section.description .productgroup{background: rgb(229,25,44); background: linear-gradient(90deg,rgba(229,25,44,1) 0%, rgba(255,255,255,1) 100%); border-radius:8px; padding:16px; cursor:pointer;}
section.description .productgroup h2{margin-top:0px; color:white; font-size:2.2rem;}
section.description .open h3{margin:16px 0px;}
section.description .grid .pricebox{display:inline-block; width:100%; padding:32px; text-align:center; border-radius:10px; margin-top:-64px; margin-right:-56px;align-self:start;}
section.description .grid .pricebox.stick-park{position:fixed; width:unset; margin-top:0; top:24px; bottom:24px; max-height:calc(100vh - 48px); overflow-y:scroll;}
section.description .grid .pricebox .button{min-width:unset; width:98%; margin-bottom:32px; color:#ffffff;}
section.description .grid .pricebox .button:last-of-type{margin-bottom: 0px;}
section.description .grid .pricebox .productprice em{font-size:2.0rem; line-height:32px; font-style:normal;}
section.description .grid .pricebox .productprice span{color:#E5192C; height:unset; font-family:'Roboto', sans-serif; font-size:3.3rem; display:flex; justify-content:center; margin:5px 0px; font-weight:500; line-height:65px;}
section.description .grid a.title-blue{text-decoration:underline; margin-left:32px;}
section.description .container .photo-grid{display:grid; grid-template-columns:1fr 1fr 1fr; grid-gap:32px;}
section.description .container .photo-grid .image:first-of-type{grid-area:1/1/span 3/span 3;}
section.description .image{width:100%; height:100%;}
section.description .image img{width:100%; height:100%; object-fit:cover; border-radius:8px;}
section.description .alinea ul{margin-bottom:32px;}
section.description .alinea ul li{list-style:disc; list-style-position:inside;}
section.description .alinea a:hover{color:#17a2b8;}
section.description #expand{display:none;}
section.description #expand + .smalldesc{max-height:350px; overflow:hidden; transition:all .3 ease; }
section.description #expand + .smalldesc:after{ content: ""; position: absolute; z-index: 1; bottom: 250px; left: 0; pointer-events: none; background-image: linear-gradient(to bottom, rgba(255,255,255,0), rgba(241,241,242, 1) 90%); width: 65%; height:150px;}
section.description #expand:checked + .smalldesc{max-height:fit-content;}
section.description #expand:checked + .smalldesc:after{content:none;}
section.description #morel{color:black; cursor:pointer; grid-column-end:span 2; grid-row-start:2;}
section.description .price{grid-column-end:span 2; grid-row-start:3;}
section.description .lease{margin-top:24px;}
section.description.about h1{text-decoration:none;}
section.description.about .grid{grid-template-columns: 1fr 1fr; margin-bottom:64px; margin-top:32px;}
section.description .overlay-mob{display:none;}

section.plugin article iframe{min-height:1000px; border:0px; border-radius:10px;}

section.logos .logos-wrapper{width:100%; height:auto;}
section.logos .logos-wrapper .logo{margin:0px 8px;}
section.logos .logos-wrapper .logo img{width:100%; max-width:224px; margin:0px auto;}

section.steps .grid{grid-template-columns: repeat(3,1fr); grid-gap:48px; row-gap:0px;}
section.steps .grid h3{grid-area:1/1/1/span 3;}
section.steps .grid .step{padding:32px; border-radius:8px; text-align:center;}

section.content.bg-picture{background-size:cover; background-repeat:no-repeat; background-position:bottom 50% right 50%;}
section.content .alinea{padding:32px; margin:24px 0; border-radius:8px;}
section.content .alinea table td{text-align:left; padding:4px 0px; border-bottom:1px dotted #E5192C;}
section.content .alinea table td:first-child{font-weight:700;}
section.content .alinea table tr:hover{background:#efefef;}
section.content .alinea .text-left{text-align:left;}
section.content .alinea .text-left span{font-weight:700; color:#13b8b5;}
section.content .alinea .text-left span:first-of-type{display:block;}
section.content:nth-of-type(odd){background-color:#ffffff;}
section.content:nth-of-type(even) .alinea{grid-area:1/2/1/2;}
section.content .alinea ul{margin-bottom:32px;}
section.content .alinea ul li{list-style:disc; list-style-position:inside;}
section.content .text-left{text-align:left;}
section.content.general .grid{grid-template-columns:1fr 1fr; grid-gap:32px;}
section.content.general .grid .image{width:550px; height:320px;}
section.content.general .grid .image img{width:100%; height:100%; object-fit:cover;}
section.content.general .grid .alinea{margin-top:0px; padding:0; text-align:left;}
section.content.general .grid .alinea div *{color:#222222;}
section.content.general .grid .alinea .contact{display:flex; margin-bottom:16px;}
section.content.general .grid .alinea .contact img{width:30px; height:30px; object-fit:cover; margin-right:24px;}
section.content.general .grid .alinea p:last-of-type{margin-bottom:0px;}
section.content.general .grid .alinea p span{display:block;}

section.faq .questions{display:block; margin-bottom:48px;}
section.faq .questions div a{width:unset; min-height:unset; display:unset; border:none; margin-bottom:unset;}
section.faq .questions div a:hover{border:none;}
section.faq .questions .accordion{width:100%; min-height:35px; display:block; padding:0px 8px; line-height:35px; cursor:pointer; text-align:left; border:none; outline:none; font-size:1.6rem; line-height:1.628571; color:#E5192C; margin-top:12px; border-bottom:1px solid #E5192C; transition:0.6s; background:#ffffff;}
section.faq .questions .accordion:hover,
section.faq .questions .accordion.active{color:#17a2b8; border-bottom:1px solid #17a2b8; text-decoration:none;}
section.faq .questions .panel{padding:8px; font-size:1.4rem; text-align:left; background:#fefefe; display:none; overflow:hidden; }

section.banner .grid{grid-template-columns:1fr 1fr; grid-gap:32px;}
section.banner .grid h2{margin-bottom:0px; font-size:4.0rem; font-weight:700; color:#ffffff; line-height:50px; text-align:right;}
section.banner .grid .contact{display:flex; height:50px; font-size:4.0rem; font-weight:700; color:#ffffff; line-height:50px;}
section.banner .grid .contact img{width:50px; height:50px; object-fit:contain; margin-right:16px;}
section.banner .grid .contact a{color:#ffffff;}
section.banner.action{overflow:visible;}
section.banner.action .grid{grid-template-columns:auto 132px;}
section.banner.action .grid article{max-width:calc(100% - 250px);}
section.banner .grid article *{color:white; text-align:left;}
section.banner .grid .sticker{width: 228px; height: 228px; line-height:228px; position: relative; transform:rotate(2deg); overflow:hidden; text-align:center; font-size:2.4rem; font-weight:bold;  color:#E5192C; position:absolute; top:-64px; right:5%; z-index:1500;}
section.banner .grid .sticker .image{ width: 100%; height: 100%; position:absolute; top:0; left:0; z-index:-1;}
section.banner .grid .sticker img{width: 100%; height: 100%; object-fit:cover;}

section.options .grid{grid-template-columns:1fr; gap:48px;}
section.options .grid h1,
section.options .grid h2{text-decoration:none;}
section.options .grid .option{width:100%; text-align:center; border-radius:10px;  position: relative;}
section.options .grid .option .image{width:100%; aspect-ratio:305/204; display:block}
section.options .grid .option .image img{width:100%; height:100%; object-fit:cover; border-radius:10px 10px 0 0;}
section.options .grid .option .sticker{position:absolute; left:0; top:0;}
section.options .grid .option .alinea{padding:32px;}
section.options .grid .option .alinea h3{font-size:2.4rem; min-height:8rem;}
section.options .grid .option .alinea p{ color:#222222; min-height:100px;}
section.options .grid .option .alinea .button{width:100%; margin-bottom:24px; font-size:1.6rem;}

footer{padding:32px 0px 12px 0px;}
footer *{color:#ffffff;}
footer * a:hover{color:#17a2b8;}
footer .whatsapp{height:72px; width:72px; position:fixed; z-index:100000; left:18px; bottom:18px; background:#25d366; border-radius:50%; text-align:center;-webkit-box-shadow: 4px 4px 8px 0px rgba(34,34,34,0.21);
    -moz-box-shadow: 4px 4px 8px 0px rgba(34,34,34,0.21);
    box-shadow: 4px 4px 8px 0px rgba(34,34,34,0.21);}
footer .whatsapp i{color:White; line-height:72px; font-size:3.8rem;}
footer .whatsapp:hover{cursor:pointer;}
footer .whatsapp:hover{background:#075E54;}
footer .whatsapp:hover i{ color:white;}
footer .grid{grid-template-columns:1fr 1fr 1fr; grid-gap:32px; row-gap:0px;}
footer .grid .title:first-of-type{grid-column-end:span 2;}
footer .grid .title h3{text-align:left;}
footer .grid .block b{display:block;}
footer .grid .block b:not(:first-of-type){margin-top:16px;}
footer .grid .block small{font-size:1.4rem;}
footer .grid .social li{float:left; margin-right:12px; padding-top:8px;}
footer .grid .social li a i{font-size:2.4rem;}
footer .grid .social li a:hover i{color:#17a2b8;}
footer .grid .copyright{grid-column-end:span 3; display:grid; grid-template-columns:1fr 1fr; margin-top:32px; padding-top:8px; border-top:1px solid #ffffff;}
footer .grid .copyright *{font-size:1.2rem; color:#ffffff;}
footer .grid .copyright a{margin-left:12px;}
footer .grid .copyright a:hover{color:#f1f1f2;}
footer .grid .copyright div:nth-of-type(2){text-align:right;}


/*tablet: 768-1023*/
@media only screen and (max-width:1024px) 
{
    h1{font-size:2.8rem;}
    h2{font-size:2.6rem; margin-bottom:24px;}
    h3{font-size:2.4rem; margin-bottom:24px;}
    h4{font-size:2.0rem; margin-bottom:24px;}      

    .tablet-hide{display:none}



    section.slide{height:450px;}
    section.slide .hero{width:100%; height:100%; position:absolute; top:0; left:0; z-index:200;}
    section.slide .hero .container{height:225px; margin-top:225px;}
    section.slide .image{height:450px;}
    section.slide.product{height:300px;}
    section.slide.product .hero .container{height:210px; margin-top:100px;}
    section.slide.product .hero .container h1{font-size:3.0rem;}

    section.description .bar{height:60px;}
    section.description .bar ul li{height:60px;}
    section.description .bar ul li a{line-height:60px;}
    section.description .container{padding-bottom:0px;}
    section.description .grid{grid-template-columns:1fr 1fr;grid-gap:24px;}
    section.description #expand + .smalldesc:after{width:50%;}
    section.description.configurator .grid{grid-template-columns:1fr;}
    section.description .grid .pricebox{padding:48px 24px; text-align:center; border-radius:10px;align-self: start;}
    section.description.configurator .grid .pricebox{margin-top:0px; margin-bottom:0px;}
    section.description .grid .pricebox div {margin-bottom:16px;}
    section.description .grid .pricebox div span{display:block; font-size:2.5rem; font-weight:700;}
    section.description .grid a.title-blue{display:block; margin-left:0px; margin-top:24px;}
    section.description.about .grid{margin-bottom:32px;}
    section.description #morel{color:black; cursor:pointer; grid-column-end:unset; grid-row-start:2;}
    section.description .price{grid-column-end:unset; grid-row-start:3;}

    section.assortment{padding-bottom:48px;}
    section.assortment .grid{grid-gap:32px;}
    section.assortment .grid .highlight.top{grid-gap:24px; padding:24px;}
    section.assortment .grid .highlight.top .image{width:355px; height:229px}

    section.brands .grid{grid-template-columns:1fr 1fr 1fr 1fr;}
    section.brands .grid .image{width:150px; height:150px;}

    section.steps .grid{grid-template-columns: repeat(3,1fr); grid-gap:24px; row-gap:0px;}
    section.steps .grid h3{grid-area:1/1/1/span 3;}
    section.steps .grid .step{padding:12px; border-radius:10px;}
    section.steps .grid .step .number{font-size:4.0rem; text-align:right; margin:0px;}

    section.content ul{font-size:1.8rem; margin-bottom:24px;}
    section.content ul li{margin-bottom:unset;}
    section.content.general .grid .image{width:350px; height:220px;}
    section.content.general .grid .alinea .contact img{margin-right:12px;}

    section.banner .grid .contact{font-size:2.6rem;}
    section.banner .grid .contact img{width:30px; height:30px; margin: auto 16px auto 0;}
    
    section.options .container{padding: 0 24px;}
    section.options .grid h1,
    section.options .grid .option.mobile-oh{display:none;}
    section.options .grid .option .alinea h3{min-height:62px;}
    section.options .grid .option .alinea .button{width:80%; margin:0px auto 12px auto;}

    footer .grid{grid-gap:24px;}
    footer .grid .block{font-size:1.4rem;}
    footer .grid .block div:first-of-type{margin-bottom:24px;}
    footer .grid .copyright{font-size:1.2rem;}
}

/*mobile l: 427-767*/
@media only screen and (max-width:768px) 
{
    h1{font-size:2.4rem;}
    h2{font-size:2.4rem; margin-bottom:24px;}
    h3{font-size:2.0rem; margin-bottom:24px;}
    h4{font-size:1.8rem; margin-bottom:24px;}  
    section{padding:24px 0;}
    .container{padding:0 12px;}
    p{margin:0 0 24px 0;}
    .alinea{margin-top:12px;}
    .button{padding:8px 16px; font-size:1.6rem;} 
    .buttonfull{width:100%; height:60px; display:inline-block; text-align:center; line-height:60px; font-size:1.6rem; border-radius:0 0 10px 10px; text-decoration:none !important;}

    .offer-grid{display:grid; grid-template-columns:1fr; grid-gap:32px;}
    form.form-grid{grid-template-columns:1fr; gap:0px; width:100%;}
    form.form-grid.order{gap:16px;}
    form.form-grid .wide{grid-column-end:unset;}   
    form.form-grid div.radio-image,
    form.form-grid div.checkbox-image{grid-template-columns:repeat(3,1fr);}

    .button.mobile-filter{display:block;}
       #filter-panel{display:none;}

    

    header{height:104px; overflow:visible;}
    header .grid{grid-gap:16px; row-gap:0px; grid-template-rows:1fr; padding:0 24px;}
    header .grid .logo{margin: auto 0;}
    header .grid #submenu{display:none;}
    header .grid #nav{grid-area:unset;}
    header .grid nav{width:100%; height:auto; display:block; float:none; left:0; top:-800px; position:absolute; -webkit-transform:translateY(-140%); transform:translateY(-140%); -webkit-transition:-webkit-transform 0.5s, visibility 0s 0.5s; transition:transform 0.5s, visibility 0s 0.5s;}
    header .grid .menu{display:unset; display:block; text-align:right;}
    header .grid .menu a{height:104px;}
    header .grid .menu a i{font-size:2.0rem; color:#48494d; line-height:104px;}    
    header .grid nav ul{width:100%; height:auto; display:block; position:relative; float:left; padding:0 12px; background:#E5192C;}
    header .grid nav ul:first-of-type{padding-top:12px;}
    header .grid nav ul.mobilesub{display:block; padding-bottom:12px;}
    header .grid nav ul li{width:100%; height:auto; min-height:48px; display:block; float:left; margin:0px; text-align:right;}
    header .grid nav ul li a{color:#ffffff; height:48px; font-size:1.4rem; line-height:48px; margin:unset;}
    header .grid nav.open{width:100%; height:100vh; display:block; float:none; left:0px; top:104px; z-index:300; position:absolute; margin:0px !important; -webkit-transform:translateY(0%); transform:translateY(0%); -webkit-transition:-webkit-transform 0.5s; transition:transform 0.5s;}

    section.slide{height:350px;}
    section.slide .hero{width:100%; height:100%; position:absolute; top:0; left:0; z-index:200;}
    section.slide .hero .container h1{font-size:4.0rem;}
    section.slide .hero .container{height:200px; margin-top:150px;}
    section.slide .image{height:350px;}
    section.slide .grid{grid-template-columns: 1fr; grid-gap: 12px; bottom:25%; margin-left:80px;}
    section.slide .alinea{text-align:center; }
    section.slide .alinea div{font-size:2.0rem; margin-bottom:24px;}
    section.slide .alinea .button:first-of-type{margin-right:8px;}
    section.slide.product .grid .alinea h1{font-size:3.0rem;}
    section.slide.product{height:200px;}
    section.slide.product .hero .container{height:110px; margin-top:100px;}
    section.slide.product .hero .container h1{font-size:2.6rem;}

    section.description .bar{height:60px;}
    section.description .bar .container{padding: 0 12px;}
    section.description .bar ul{justify-content:left;}
    section.description .bar ul li{height:60px;}
    section.description .bar ul li a{font-size:1.6rem; font-weight:700; margin-left:24px; line-height:60px;}
    section.description .grid{grid-template-columns: 1fr; grid-gap:0px; position:relative;}
    section.description .grid .pricebox{padding:48px 32px; margin-top:32px;}
    section.description .grid .pricebox div {margin-bottom:12px;}
    section.description .grid .pricebox div span{ font-size:2.2rem;}
    section.description .container .photo-grid{display:grid; grid-template-columns:1fr; grid-gap:24px;}
    section.description .container .photo-grid .image:first-of-type{grid-area:unset;}
    section.description.about .grid{grid-template-columns:1fr; margin-bottom:0px; margin-top:0px; padding-bottom:0px;}
    section.description #expand + .smalldesc{max-height:150px;}
    section.description #expand + .smalldesc:after{display:none;}
    section.description #morel{ height:60px; padding-top:20px;}
    section.description .overlay-mob{display:block; width:100%; height:30px; position:absolute; top:200px; background-image:linear-gradient(to bottom, rgba(255,255,255,0), rgba(241,241,242, 1) 90%);}
    section.banner .grid{grid-template-columns:1fr; grid-gap:0px;}
    section.banner .grid h2,
    section.banner .grid .contact{font-size:2.4rem; text-align:left;}
    section.banner.action{overflow:visible;}
    section.banner.action .grid{grid-template-columns:auto 132px;}
    section.banner.action .grid article{max-width:unset;}
    section.banner .grid article *{color:white; text-align:left;}
   
    
    section.assortment{padding-bottom:24px;}
    section.assortment .grid.splash,
    section.assortment .grid{grid-template-columns: 1fr; grid-gap:32px;}
    section.assortment .grid .highlight{border-radius:10px;}
    section.assortment .grid .highlight.top{grid-area:1/1/1/1; display:grid; grid-template-columns: 1fr; grid-gap:12px; }
    section.assortment .grid .highlight.top .image{grid-area:1/1/1/1; width:100%; height:100%; margin: 12px auto 0px auto;}
    section.assortment .grid .highlight .alinea{padding:12px;}
    .product-grid{grid-template-columns:repeat(2,1fr);}
    .categorie-grid{grid-template-columns:200px auto;}

    section.brands .grid {grid-template-columns:1fr 1fr;}
    section.brands .grid .image{width:100px; height:100px;}
    section.brands .grid .mobile-hide{display:none;}

    section.steps .grid{grid-template-columns: 1fr; grid-gap:24px;}
    section.steps .grid h3{grid-area:1/1/1/1;}
    section.steps .grid .step{padding:24px; border-radius:10px;}
    section.steps .grid .step .number{font-size:3.0rem; text-align:right; margin:0px;}

    section.content.bg-picture{background-image:url('../images/vvm-section-bg-01.webp'); background-size:114%; background-repeat:no-repeat; background-position:bottom 50% right 50%;}
    section.content .alinea{padding:12px; margin:0;}
    section.content:nth-of-type(even) .alinea{grid-area:unset;}
    section.content ul{font-size:1.6rem;}
    section.content ul li{height:unset; line-height:unset;}
    section.content.general .grid{grid-template-columns:1fr;}
    section.content.general .grid .image{width:100%}

    section.options .container{padding: 0 12px;}
    section.options .grid h1,
    section.options .grid .option .alinea{padding:16px;}
    section.options .grid .option .alinea h3{font-size:2.0rem;}

    footer{padding:8px 0;}
    footer .grid{grid-template-columns:1fr; grid-gap:32px; row-gap:24px;}
    footer .grid .title:first-of-type{grid-column-end:unset;}
    footer .grid .title:nth-of-type(2){grid-area:4/1/4/2;}
    footer .grid .title h3{margin-bottom:0px;}
    footer .grid .copyright{grid-area:unset;  margin-top:unset; grid-template-columns: 1fr;}
    footer .grid .copyright div:nth-of-type(2){text-align:left;}
    footer .grid .copyright a{margin-left:0px;} 
}

/*mobile s: 320-426*/
@media only screen and (max-width:426px)
{
    .breadcrumbs{display:none;}

    .categorie-grid{grid-template-columns:1fr;}
 .product-grid{grid-template-columns:1fr;}

    section.slide .hero .container{margin-top:48px;}

    section.description #expand + .smalldesc{max-height:200px; margin-top:12px;}
    section.description.about .grid{margin-top:24px;}

    section.banner.action .grid{grid-template-columns:auto 132px;}
    section.banner .grid article *{color:white; text-align:left;}


    section.options .grid{grid-template-columns:1fr; row-gap:12px;}
    section.options .grid h1,
    section.options .grid h2{grid-column-end:span 1; font-size:2.4rem;}
    section.options .grid .option .alinea h3{min-height:unset;}
}