/*FONTS*/
@font-face {
  font-family: AeroMatics;
  src: url("../fonts/AeroMatics-Regular.ttf") format("TrueType");
  font-weight: 300; }
@font-face {
  font-family: AeroMatics;
  src: url("../fonts/AeroMatics-Light.ttf") format("TrueType");
  font-weight: 100; }
@font-face {
  font-family: AeroMatics;
  src: url("../fonts/AeroMatics-Bold.ttf") format("TrueType");
  font-weight: 600; }
@font-face {
  font-family: AeroMatics-Display;
  src: url("../fonts/AeroMatics-Display-Regular.ttf") format("TrueType");
  font-weight: 300; }
@font-face {
  font-family: AeroMatics-Display;
  src: url("../fonts/AeroMatics-Display-Light.ttf") format("TrueType");
  font-weight: 100; }
@font-face {
  font-family: AeroMatics-Display;
  src: url("../fonts/AeroMatics-Display-Bold.ttf") format("TrueType");
  font-weight: 600; }
body {
  font-family: "AeroMatics";
  font-weight: 300; }

.accent {
  color: #FF9700; }

.f-light {
  font-weight: 100 !important; }

.f-bold {
  font-weight: 600 !important; }

.dark-bg {
  background-color: #2F383B; }

.lightorange-bg {
  background: rgba(255, 151, 0, 0.15); }

.orange-bg {
  background-color: #FF9700; }

.lightgrey-bg {
  background: #E5E5E5; }

.white-bg {
  background-color: white; }

.shadow {
  -webkit-box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.3); }

.tiny {
  font-size: 0.7rem; }

.hex-small {
  height: calc(350px * 0.8660254);
  width: 350px;
  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
  background-image: url("../assets/toonzaal.jpg");
  background-size: cover; }

.hex-large {
  height: calc(400px * 0.8660254);
  width: 400px;
  clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
  background-image: url("../assets/toonzaal.jpg");
  background-size: cover; }

.right {
  float: right; }

.float-out-wrapper {
  position: relative; }

.float-out {
  position: absolute;
  right: 0;
  top: -70px; }

.end {
  margin-left: auto;
  margin-right: 0; }

.align-end {
  position: relative; }
  .align-end .hex-large {
    position: absolute;
    right: 0;
    top: 0; }

/*END FONTS*/
/*HEADER*/
header {
  background: #2F383B;
  background-image: url("../assets/splash-filler-right.png");
  background-size: 40%;
  background-position: top right;
  background-repeat: no-repeat;
  z-index: 1;
  position: relative; }

.nav-item {
  padding-left: 7px;
  padding-right: 7px; }

.navbar-nav .nav-link {
  color: white;
  padding-left: 7px;
  padding-right: 7px; }

.nav-link:hover, .nav-link:focus {
  color: #FF9700; }

#header-logo {
  width: 250px; }

.nav-button {
  background-color: #FF9700;
  color: white; }

.nav-button:hover {
  background-color: #E88A03;
  color: white; }

.navbar-toggler {
  color: white; }

/**END HEADER/
/*FILTER*/
#aanbod-filter p {
  margin-bottom: 0;
  font-size: 1.2rem; }
#aanbod-filter .CTA {
  color: #fff; }
#aanbod-filter .form-outline {
  --mdb-form-outline-select-notch-border-color: #FF9700; }
#aanbod-filter .select-input.focused ~ .select-label, #aanbod-filter .form-outline .form-control.select-input:focus ~ .select-label {
  color: #222; }
#aanbod-filter .form-check-input[type=checkbox]:checked {
  background-color: #FF9700; }
#aanbod-filter .form-check-input:checked:focus, #aanbod-filter .form-check-input:checked {
  border-color: #FF9700; }

.input-group > .form-control:focus {
  border-color: #FF9700;
  box-shadow: none; }

.select-option.selected:hover:not(.disabled) {
  background-color: rgba(0, 0, 0, 0.1) !important; }

.select-option.selected.active {
  background-color: rgba(255, 151, 0, 0.1) !important; }

.form-outline .form-control:focus ~ .form-notch .form-notch-middle {
  border-bottom-color: #FF9700; }

.form-outline .select-label.active ~ .form-notch .form-notch-middle {
  border-left-width: 0;
  border-right-width: 0;
  border-left-color: red;
  border-right-color: red; }

/*END FILTER*/
/*CAR TILES*/
.car-tile-wrapper:hover .car-price {
  background-color: #E88A03; }

.thumb-wrapper {
  position: relative; }

.thumb-counter {
  position: absolute;
  right: 0;
  bottom: 0;
  background: rgba(0, 0, 0, 0.6);
  border-radius: 5px 0 0 0;
  padding: 5px 12px;
  color: #fff;
  font-size: 0.9rem; }

.car-title h4 {
  color: #757575; }
.car-title .manufacturer {
  font-weight: 100; }
.car-title .model {
  font-weight: 300;
  color: #333; }
.car-title p {
  font-size: 0.9rem;
  color: #333;
  margin-bottom: 0; }

.car-details p {
  font-size: 0.9rem;
  color: #333;
  margin-bottom: 0; }
.car-details i {
  font-size: 1.1rem;
  color: #757575; }

.car-price {
  transition: all ease-out .1s; }
  .car-price h5 {
    color: #fff;
    margin-bottom: 0;
    font-size: 1.6rem; }

/*END CAR TILES*/
/*DETAILPAGE*/
#hero-wrap {
  position: relative; }
  #hero-wrap img {
    width: 100%; }

#header-overlay-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 10; }

#view-gallery {
  position: absolute;
  right: 0;
  top: 40px;
  padding: 8px 8px 8px 50px;
  clip-path: polygon(2% 0%, 100% 0%, 100% 100%, 2% 100%, 0% 50%); }
  #view-gallery p {
    margin-bottom: 0;
    color: #fff;
    font-size: 1.4rem; }

.side-btn {
  padding: 8px;
  padding-right: 50px;
  width: 25%;
  clip-path: polygon(0% 0%, 98% 0%, 100% 50%, 98% 100%, 0% 100%); }
  .side-btn h2 {
    margin-bottom: 0;
    font-size: 1.7rem; }
  .side-btn h3 {
    margin-bottom: 0;
    font-size: 1.7rem; }
  .side-btn .VAT-mark {
    font-size: 1rem;
    font-weight: 100; }
  .side-btn .manufacturer {
    font-weight: 100; }

#enquire-btn {
  color: #fff;
  z-index: 10;
  position: relative;
  cursor: pointer;
  transition: all ease-out .1s; }
  #enquire-btn:hover {
    background-color: #E88A03;
    width: 26%; }

#bottom-technical {
  margin-bottom: -1px; }
  #bottom-technical .technical-label {
    clip-path: polygon(0% 20%, 50% 0%, 100% 20%, 100% 100%, 0% 100%);
    padding-bottom: 25px;
    padding-top: 25px; }
    #bottom-technical .technical-label p {
      margin-bottom: 0;
      line-height: 1.2rem;
      height: 5.6rem;
      font-size: 1.2rem; }
    #bottom-technical .technical-label i {
      font-size: 1.8rem;
      margin-bottom: 20px; }

#technical-wrap {
  min-height: 350px;
  background-image: url(../assets/gears-bg.jpg);
  background-repeat: no-repeat;
  background-position: bottom right; }

#options-wrap {
  min-height: 350px;
  background-image: url(../assets/list-bg.jpg);
  background-repeat: no-repeat;
  background-position: bottom right; }

#notes-wrap {
  min-height: 350px;
  background-image: url(../assets/notes-bg.jpg);
  background-repeat: no-repeat;
  background-position: bottom right; }

.detail-title-wrap {
  background-color: #efefef;
  display: inline-block;
  padding: 10px 40px 10px 10px;
  clip-path: polygon(0% 0%, 95% 0%, 100% 50%, 95% 100%, 0% 100%);
  margin-bottom: 20px; }
  .detail-title-wrap h4 {
    margin-bottom: 0; }

#carpasslink {
  background-color: #FF9700;
  color: #fff;
  padding: 8px 30px 8px 10px;
  display: inline-block;
  clip-path: polygon(0% 0%, 95% 0%, 100% 50%, 95% 100%, 0% 100%);
  transition: all ease-out .15s; }
  #carpasslink p {
    margin-bottom: 0; }
  #carpasslink:hover {
    background-color: #E88A03;
    padding-right: 40px; }

.data-group {
  margin-bottom: 20px; }
  .data-group .data-label {
    font-size: 0.8rem;
    color: #757575; }
  .data-group p {
    margin-bottom: 0; }

#options-wrap .data-group {
  margin-bottom: 10px; }

/*CONTACTFORM*/
#contactform {
  position: fixed;
  width: 400px;
  background-color: #fff;
  top: 50%;
  transform: translateY(-50%);
  left: -400px;
  padding: 30px;
  z-index: 100;
  transition: all ease-out .5s; }
  #contactform .CTA {
    background-color: #FF9700;
    color: #fff;
    border: none;
    font-size: 1.4rem;
    text-transform: uppercase;
    padding: 8px 15px;
    clip-path: polygon(5% 0%, 95% 0%, 100% 50%, 95% 100%, 5% 100%, 0% 50%); }
  #contactform #close-popup {
    position: absolute;
    right: 30px;
    top: 30px;
    font-size: 1.4rem;
    cursor: pointer; }

.contact-open {
  left: 0px !important; }

.form-control:focus {
  box-shadow: none;
  border-color: #FF9700; }

/*END CONTACTFORM*/
/*END DETAILPAGE*/
/*ATELIER*/
#page-intro a {
  display: inline-block; }
#page-intro p {
  font-weight: 100;
  line-height: 1.4rem; }
.default-btn {
  padding: 10px 30px;
  color: #fff;
  text-transform: uppercase;
  font-weight: 400; }
  .default-btn p {
    margin-bottom: 0;
    font-size: 1.2rem; }

#no-results a {
  display: inline-block; }
#no-results p {
  font-weight: 100; }

#page-intro .usp-callout {
  background: rgba(255, 151, 0, 0.15);
  border-left: solid 4px #FF9700; }
  #page-intro .usp-callout i {
    color: #FF9700;
    font-size: 1.8rem; }
  #page-intro .usp-callout p {
    margin-bottom: 0; }

#showroom-hex {
  background-image: url("../assets/toonzaal.jpg"); }

#onderhoud-hex {
  background-image: url("../assets/onderhoud.jpg"); }

#remmen-hex {
  background-image: url("../assets/remmen-service.jpg"); }

#banden-hex {
  background-image: url("../assets/banden-service.jpg"); }

#airco-hex {
  background-image: url("../assets/airco-service.jpg"); }

#schouwing-hex {
  background-image: url("../assets/schouwing-service.jpg"); }

#totalrepair-hex {
  background-image: url("../assets/totalrepair-service.jpg"); }

#onedayrepair-hex {
  background-image: url("../assets/smartrepai-service.jpg"); }

#aluminium-hex {
  background-image: url("../assets/aluminium-service.jpg"); }

#autoruiten-hex {
  background-image: url("../assets/autoruiten-service.jpg"); }

#van-hex {
  background-image: url("../assets/van-service.jpg"); }

#DGC-hex {
  background-image: url("../assets/DGC-hex.jpg"); }

/*END ATELIER*/
/*CONTACTPAGE*/
#contact-data a {
  color: #FF9700; }
  #contact-data a ::hover {
    color: #E88A03; }

#contactform-wrapper {
  border: solid 2px #efefef;
  background-color: white;
  padding: 30px; }
  #contactform-wrapper .CTA {
    background-color: #FF9700;
    border: none;
    color: #fff;
    font-size: 1.2rem;
    padding: 10px 20px;
    clip-path: polygon(5% 0%, 95% 0%, 100% 50%, 95% 100%, 5% 100%, 0% 50%);
    transition: all ease-out .2s; }
  #contactform-wrapper .CTA:hover {
    background-color: #E88A03; }

/*END CONTACTPAGE*/
/*SEO INSERT*/
#SEO-insert .seo-text p {
  font-weight: 100;
  line-height: 1.4rem; }
#SEO-insert ul {
  list-style-type: "- ";
  font-weight: 100;
  padding-left: 15px; }
#SEO-insert .SEO-btn {
  border: solid 2px #FF9700;
  padding: 10px; }
  #SEO-insert .SEO-btn p {
    margin-bottom: 0; }
#SEO-insert a {
  color: #2F383B; }

/*END SEO INSERT*/
/*FOOTER*/
footer {
  background-color: #2F383B;
  color: white; }

#masthead {
  font-weight: 100; }

footer a {
  color: #fff;
  transition: all ease-out .1s; }

footer a:hover {
  color: #FF9700; }

/*END FOOTER*/
/*GENERAL CONDITIONS*/
#conditions-wrap {
  column-count: 2;
  column-gap: 50px; }
  #conditions-wrap h3 {
    font-size: 1.4rem;
    font-weight: 300; }
  #conditions-wrap p {
    font-weight: 100; }

/*END GENERAL CONDITIONS*/
@media only screen and (max-width: 1200px) {
  .hex-large {
    height: calc(350px * 0.8660254);
    width: 350px; } }
@media only screen and (max-width: 990px) {
  .hex-large {
    margin-left: auto;
    margin-right: auto; }

  .right {
    float: none; }

  .float-out {
    position: relative;
    top: 0;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px; } }
@media only screen and (max-width: 767.88px) {
  #header-logo {
    width: 200px; }

  #header-overlay-wrap {
    position: relative;
    z-index: 10; }
    #header-overlay-wrap .side-btn {
      padding: 8px;
      padding-right: 50px;
      width: 100%;
      clip-path: polygon(0% 0%, 98% 0%, 100% 50%, 98% 100%, 0% 100%); }
      #header-overlay-wrap .side-btn h2 {
        margin-bottom: 0;
        font-size: 1.7rem; }
      #header-overlay-wrap .side-btn h3 {
        margin-bottom: 0;
        font-size: 1.7rem; }
      #header-overlay-wrap .side-btn .VAT-mark {
        font-size: 1rem;
        font-weight: 100; }
      #header-overlay-wrap .side-btn .manufacturer {
        font-weight: 100; }
    #header-overlay-wrap #enquire-btn {
      color: #fff;
      z-index: 10;
      position: relative;
      cursor: pointer;
      transition: all ease-out .1s;
      margin-bottom: 15px; }
      #header-overlay-wrap #enquire-btn:hover {
        background-color: #E88A03;
        width: 100%; }
    #header-overlay-wrap #enquire-btn-sm {
      clip-path: polygon(2% 0%, 98% 0%, 100% 50%, 98% 100%, 2% 100%, 0% 50%);
      margin-bottom: 20px;
      color: #fff; }

  /*CONTACTFORM*/
  #contactform {
    position: relative;
    width: auto;
    background-color: #fff;
    padding: 0px;
    left: 0 !important;
    transform: translateY(0); }

  /*END CONTACTFORM*/
  /*END DETAILPAGINA*/
  #conditions-wrap {
    column-count: 1;
    column-gap: 0px; } }

/*# sourceMappingURL=style.css.map */
