#page { background-color: #FFFFFF; /*display: block; flex: none !important;*/ min-height: 100%; min-height:100vh; display: flex; flex-direction: column; align-items: stretch; }

#page .ui--hidden { display:none !important;}

#page .top.bar { padding: 2em 0em; width: 100%; box-shadow: 0px 0px 0px 0px transparent; border-bottom: 1px solid transparent; transition: padding 0.5s ease, background 0.5s ease, box-shadow 0.5s ease, border 0.5s ease; }
#page .top.bar.overlay { /*position: fixed;*/ position:absolute; top: 0px; z-index: 900; left: 0%;  }
#page .top.bar .button { border-radius:unset; background-color: #0d3b5c; color: #fff; margin-right:1px; }
#page .top.bar .button.ui--tight { font-size: 1.1em; padding: 0.4em 0.75em; }
#page .top.bar .ui.menu .item:hover {background:none; }

#page .ui.segment.ui--banner { position: relative; z-index: 3; margin: 0; padding: 0; min-height: 185px; overflow: hidden; text-align: center; color: rgba(0, 0, 0, 1); 
    background-color: #dddddd;  background-position: 50% 50%; -webkit-transform: translate3d(0, 0, 0);  transform: translate3d(0, 0, 0);  flex-shrink: 0; 
    border: none !important;  border-radius: initial;  box-shadow: none;
}

#page .ui.segment.ui--banner .container-uit { /*height: 55vh;*/ margin-left: auto !important; margin-right: auto !important; /*min-height: 600px;*/ -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }
#page .ui.segment.ui--banner .container { padding: 8rem 0 5rem 0; text-align:left; }
#page .ui.segment.ui--banner .ui--background { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; /*background-position-y: 15%;*/ background-position-x: center; background-size: cover; }
#page .ui.segment.ui--banner .ui--background.pos-center { background-position: center center;}
#page .ui.segment.ui--banner .ui--foreground { min-height:35rem; }
#page .ui.segment.ui--banner .ui--text { }
#page .ui.segment.ui--banner .ui--text.huge { font-size:3.5em; font-size: calc(1em + 1.8vw); }
#page .ui.segment.ui--banner .ui--text.massive { font-size:5em; font-size: calc(1em + 3.0vw); }

#page .ui.header.massive { font-size: 3.5em; }

#page section.ui--intro .ui.segment p { font-size: 1.1em;}

#page > .ui.segment.ui--brands { border: none; box-shadow: none; flex-grow: 1; margin-top:0; margin-bottom: 0; }
#page > .ui.segment.ui--brands.padded { padding-top: 4rem;padding-bottom: 2rem; }
#page > .ui.segment.ui--brands .cards { justify-content:center;}
#page > .ui.segment.ui--brands .cards.five > .card { width:200px; }
#page > .ui.segment.ui--brands .card { border: none; box-shadow: none; width: 20%; margin-left: 1em; margin-right: 1em; }
#page > .ui.segment.ui--brands .card.a {  }
#page > .ui.segment.ui--brands .card .image { background-color: initial; color: #000; margin:2rem 0; align-self:center; height: 7rem; padding: 0 2rem; pointer-events: none; }
#page > .ui.segment.ui--brands .card .image > img { height: inherit; width: initial; max-width: 100%; }
#page > .ui.segment.ui--brands .card .content { color: #000; border: 2px solid #eee; border-radius:0.4em !important; margin-bottom:1em; font-size: 1.1em; /*border-radius: .28571429rem !important;*/ /*-webkit-box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5; box-shadow: 0 1px 3px 0 #d4d4d5, 0 0 0 1px #d4d4d5;*/ }
#page > .ui.segment.ui--brands .card a.content {display: block; z-index:10; }

/* footer */
#page > .ui.segment.ui--footer { background-color: #0d3b5c; flex-shrink: 0; }
#page > .ui.segment.ui--footer .item { color: #ccc; }
#page > .ui.segment.ui--footer .ui--offset { min-height:4rem; }
#page > .ui.divider.ui--footer-offset { display: flex;flex-grow: 1;}

#page .ui--action-form {}
#page .ui--action-form .ui.header.tiny { font-size: 0.9em; }


/* responsive */
/* Mobile - below 768px*/
@media only screen and (max-width: 767px) {
    #page .ui.header.massive { font-size: 2em; }
    #page .ui.segment.ui--banner .ui--foreground { min-height:10rem; padding-top: 5rem; }
    #page > .ui.segment.ui--brands .card .image > img { width:inherit; margin-left:auto;margin-right:auto; }
    
    #page .ui.menu.stackable .menu.unstackable > .item { width: initial !important; }
    #page > .ui.segment.ui--footer .ui--offset { display: none;}
}
/* Tablet - 768px - 991px*/
@media only screen and (min-width: 768px) and (max-width: 991px) {
    #page .ui.header.massive { font-size: 2.5em; }
    #page .ui.segment.ui--banner .ui--foreground { min-height:15rem; padding-top: 5rem  }
    #page .ui.card>.content>.header { font-size:1em;}
}
/* Small Monitor > - 992px */
@media only screen and (min-width: 992px){
    #page .ui.segment.ui--banner .ui--text.huge { }
}
/* Small Monitor - 992px - 1200px */
@media only screen and (min-width: 992px) and (max-width: 1199px) {
    #page .ui.segment.ui--banner .ui--foreground { padding-top: 10rem; }
}
/* Large Monitor - above 1200px */
@media only screen and (min-width: 1200px) {
}

/* bandenactie */
.ui--tire-brands .card { height:7rem; }
.ui--tire-brands.ui.cards > .card > .content { display:flex;align-items:center; justify-content:center; padding:0;}
.ui--tire-brands .card > .content > .pos { /*ie fix*/ width:calc(100% - 1rem);}
.ui--tire-brands .card > .content .image { max-height:7rem; }
.ui--tire-brands .card > .content .image > img { max-height:2.5rem; height: inherit; width: initial; max-width: 100%; }

.ui--tire-brand-banner { background-size:cover; background-repeat: no-repeat; background-position: center bottom; 
    height: 25rem; display: flex; align-items: center; justify-content:center; }
.ui--tire-brand-banner .pos { width:100%; text-align:center;}
.ui--tire-brand-banner .pos > .image{ /*max-width:50%;*/ max-width:23rem; }

/* brands */ 
#page > .ui.segment.ui--brands .card .content.inverted { -webkit-box-shadow: 0 0 1px 1px rgb(0 0 0 / 30%); box-shadow: 0 0 1px 1px rgb(0 0 0 / 30%); }
#page > .ui.segment.ui--brands .card .content.inverted > * { color:#fff;; }
#page > .ui.segment.ui--brands .card.ui--brand-vw .content.inverted { border-color: rgb(0, 30, 80); background-color: rgb(0, 30, 80); color:#fff; }
#page > .ui.segment.ui--brands .card.ui--brand-cvi .content.inverted { border-color: rgb(0, 30, 80); background-color: rgb(0, 30, 80); color:#fff; }
#page > .ui.segment.ui--brands .card.ui--brand-audi .content.inverted { border-color: rgb(0, 0, 0); background-color: rgb(0, 0, 0); color:#fff; }
#page > .ui.segment.ui--brands .card.ui--brand-seat .content.inverted { border-color: #ea5d1a; background-color: #ea5d1a; color:#fff; }
#page > .ui.segment.ui--brands .card.ui--brand-skoda .content.inverted { border-color: #4ba82e; background-color: #4ba82e; color:#fff; }

/* image fix */
#page > .ui.segment.ui--brands .card.ui--brand-cvi .image { transform: scale(3);}

/* fonts */

/* normal: Menu / Refproduit / Plus d’infos / Langues /  Footer */
/* default, refproduit, Plus d’infos */
html,body,
#page .ui.text.container,
#page .ui.form input,
#page .ui.form .ui.button,
/* menu, language */
#page .top.bar .ui.menu .item,
#page .top.bar .ui.menu a.item,
#page .top.bar .ui.menu a.button,
/*footer */
#page .ui--footer .ui.menu .item,
#page .ui--footer .ui.menu a.item { font-family: font1,'Helvetica Neue',Arial,Helvetica,sans-serif; }

/* semi-bold: Textes descriptifs / Nom de produit / CTA  */
#page h2.ui.header,
/* Textes descriptifs */
#page .ui.card>.content>.header,
#page .ui.cards>.card>.content>.header,
/* Nom de produit */
/* CTA */
#page .ui--cta .content > .header { font-family: font2,'Helvetica Neue',Arial,Helvetica,sans-serif; }

/* bold: Menu wizzard/ Titre page / Boxe Offres / Prix  */
/* Menu wizzard */
/* Titre page */
#page b,
#page strong,
#page h1.ui.header,
/*  Boxe Offres */
#page .ui--banner .ui.header,
#page .ui--banner .ui.label
/* Prix */
{ font-family: font3,'Helvetica Neue',Arial,Helvetica,sans-serif; }