@import url('https://fonts.googleapis.com/css2?family=Work+Sans:wght@400;500;600;700&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.3/font/bootstrap-icons.css");



::-moz-selection {
   color: #fff;
   background: #063D49;
}


::selection {
   color: #fff;
   background: #063D49;
}


html {
   font-family: 'Work Sans', 'Verdana', 'Geneva', 'Tahoma', sans-serif !important;
   color: #063D49;
   scroll-behavior: smooth;
}

body {
   font-family: 'Work Sans', 'Verdana', 'Geneva', 'Tahoma', sans-serif !important;
   color: #063D49;
}

h1 {
   text-transform: uppercase;
   color: #00A1C4;
   font-weight: 700;
}

.product-gallery {
   display: flex;
   gap: 16px;
}

.gallery-section {
   margin-top: 3em;
}


.product-column {
   display: flex;
   flex-direction: column;
   gap: 16px;
}
 
.grid-image img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

#vol-3 {
   width: 720px!important;
}

/* .masonry {
   columns: 4;
   column-gap: 16px;
}

.masonry .grid-image {
   display: inline-block;
   margin-bottom: 16px;
   position: relative;
}

.masonry .grid-image img {
   width: 100%;
} */

.container-lg {
   margin-top: 3em !important;
   margin-bottom: 3em !important;
}

.footerRobertComanici {
   margin-bottom: 3em;
}

.navbar-nav {
   text-transform: uppercase;
   color: #063D49;

}

a {
   text-decoration: none;
}


.navbar-dark .navbar-nav .show>.nav-link,
.navbar-dark .navbar-nav .nav-link.active {
   font-weight: 700;
}


.footerRobertComanici {
   color: #063D49;
}

.footerRobertComanici a:hover {
   color: #00A1C4;
}

.dropdown-item {
   color: #063D49;
}

.dropdown-item:hover {
   background-color: #E4F8FD;
}


.resume-card {
   margin-bottom: 3em;
}

.resume-section h2 {

   padding-top: 0.5em;
   padding-bottom: 0.5em;
   margin-bottom: 1em;
   margin-top: 1.5em;
   font-weight: bold;
   border-bottom: solid 2px #f2f2f2;
}

.resume-title {
   font-weight: bold;
}

.resume-date {
   color: #999999;
   margin: 0;
   margin-bottom: 3em;
}

.resume-org {
   color: #999999;
   margin: 0;
}

.resume-item {
   font-weight: bold;
   margin: 0;
}

.resume-head {
   margin: 0;
}

.dropdown-menu {
   border: 1px solid #063d4934;
   border-radius: 0;
}

.navbar-light .navbar-nav .show>.nav-link,
.navbar-light .navbar-nav .nav-link.active {
   font-weight: 700;
   color: #00A1C4;
}


.btn-primary {
   color: #ffffff;
}

.btn-primary:hover {
   color: #ffff;
   background-color: #063D49;
   border: 1px solid #063D49;
}

.btn {
   border-radius: 0;
}

.card {
   border-radius: 0;
   border: 0;
   height: 100%;
}

.card img {
   width: 80px;
   height: 80px;
   margin-left: 1em;
   border: 0;
   border-radius: 0;
}

.imgProducts img {
   height: 160px;
   width: auto;
}

#introChassisRobert {
   background-image: url(./img/chassisrobert-header.png);
   padding-top: 5em;
}

#introRamen {
   background-image: url(../assets/img/raam-header.svg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   color: #ffffff;
}

#introRamen h1 {
   color: #fff;
}

#introDeuren {
   background-image: url(../assets/img/deur-header.svg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   color: #ffffff;
}

#introDeuren h1 {
   color: #fff;
}

#introVensterluiken {
   background-image: url(../assets/img/volet-header.svg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   color: #ffffff;

}

#introVensterluiken h1 {
   color: #fff;
}

#introContact {
   background-image: url(../assets/img/contact-header.svg);
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
   color: #ffffff;
}

#introContact h1 {
   color: #fff;
}

.btn-default {
   background-color: transparent;
   border-radius: 0;
   border: 1px solid #00A1C4;
   color: #00A1C4;
}


.btn-default:hover {
   background-color: #00A1C4;
   color: #ffffff;
   border: 1px solid #00A1C4;
}

#textIntro {
   padding-top: 5em;
}

footer p,
a {
   margin: 0;
   font-size: 14px;
   color: #063D49;
}

footer h6 {
   margin-top: 2em;
   color: #00A1C4;
   font-weight: 600;
   text-transform: uppercase;
}

#copyrightChassisRobert {
   margin-top: 2em;
   margin-bottom: 2em;
}

.breadcrumb-item.active {
   color: #00A1C4;
}

.card-img-top-k {
   width: 100%;
}

.contactSection,
.contactSection a {
   font-size: 16px;
   margin: 0;
}



@media screen and (max-width: 900px) {
   .resumePreview {
      height: 500px;
      margin-bottom: 2em;
   }

   .resume-card {
      margin-bottom: 3em;
   }

   .btn-lg {
      border-radius: 0;
      margin-bottom: 1em;
   }
}


@media screen and (max-width: 400px) {
   .resumePreview {
      height: 400px;
   }

   .resume-card {
      margin-bottom: 3em;
   }

   #introChassisRobert {
      padding-top: 0;
   }

   #introChassisRobert {
      padding-top: 0;
   }
}

@media screen and (max-width: 372px) {

   #introChassisRobert {
      padding-top: 3em;
   }
}

@media screen and (max-width: 766px) {
   .card {
      border-radius: 0;
      border: 0;
      height: auto;
   }

   #introRamen {
      background-color: #00A1C4 !important;
      background-image: none;
   }

   #introDeuren {
      background-color: #00A1C4 !important;
      background-image: none;
   }

   #introVensterluiken {
      background-color: #00A1C4 !important;
      background-image: none;
   }

   #introContact {
      background-color: #00A1C4 !important;
      background-image: none;
   }

   .product-gallery {
      flex-direction: column !important;
   }
}