/*
Theme Name: Buitenruimte.nu
Theme URI: https://buitenruimte.nu
Author: Bas Martens
Author URI: https://basmartens.com
Description: Custom wordPress Theme t.b.v. www.buitenruimte.nu
Version: 1.0
Text Domain: buitenruimte
*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Ubuntu+Condensed&display=swap');
a {
    text-decoration:none;
}
body {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: normal;
  background: #F8F8F8;
  line-height: 34px;
}
#pageContent {
  overflow-x: hidden; 
}
.navbar-brand img {
  max-width: 162px;
  width: 100%;
  display: inline-block;
}
.navbar-nav {
  margin-top: 30px;
}
.navbar-nav li {
  margin: 0 15px;
  padding: 0;
}
.navbar-nav .current-menu-item {
  border-bottom: 5px solid #98B966;
}
.navbar-nav .nav-link {
  font-family: "Ubuntu Condensed", sans-serif;
  font-weight: 400;
  color: #FFFFFF !important;
  font-size: 20px;
}
.navbar-nav a:hover {
  color: #98B966 !important;
}
.offcanvas-header {
  background-color: #007bff;
  color: white;
}

.offcanvas-body {
  padding: 0 20px 20px;
}
.offcanvas-header {
    background-color:white;
}
.mobile-menu {
    text-align: center; /* Centreert de container van de ul */
}
.mobile-menu .nav-link {
  font-family: "Ubuntu Condensed", sans-serif;
  font-weight: 400;
  font-size: 20px;
}
.mobile-menu  a:hover {
  color: #98B966 !important;
}
.mobile-menu ul {
    list-style-type: none; /* Verwijdert de bullets */
    padding: 0; /* Verwijdert padding rond de ul */
    margin: 0; /* Verwijdert margin rond de ul */
    
}

.mobile-menu li {
    margin-bottom: 15px; /* Geeft wat ruimte tussen de items, aanpasbaar naar wens */
}


.mobile-menu a {
    text-decoration: none; /* Optioneel: verwijdert onderstreping van links */
    color: inherit; /* Optioneel: ervoor zorgen dat de links dezelfde kleur als de tekst hebben */
}
.offcanvas-body img {max-width:200px; width:100%; margin:0 0 30px 65px;}

.mobile-button {
  font-family: "Ubuntu Condensed", sans-serif;
  font-weight: 400;
  color: #FFFFFF !important;
  font-size: 20px;
        margin-top: 40px;
}
.mobile-button:hover {
      color: #19452C!important;
}
.mobile-button:hover i {
    color:#FFF!important;
}
.mobile-button {
            display: none;
        }

        @media (max-width: 992px) {
            .mobile-button {
                display: block;
            }
        }

.section-intro {
  padding-top: 220px;
  min-height: 850px;
  height: 100%;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover;
}
.section-heading {
  padding-top: 370px;
  min-height: 460px;
  height: 100%;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover;
}
.section-heading-single {
  padding-top: 220px;
  min-height: 850px;
  height: 100%;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover;
}
.section-projects {
  padding: 50px 0 0 0;
}
.section-projects .introduction {
  margin-bottom: 40px;
}
.project .visual img {
  z-index: 999;
}
.project h2 a {
  text-decoration: none;
  display: block;
  width: auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
font-size:30px;
}
.project h2 a:hover {
  color: #FFA500;
}
.project p {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}
.project .bg-white {
  padding-top: 130px !important;
  margin-top: -100px !important;
}
.project .button {
  margin-top: -19px;
}
.section-single-project {
  margin-top: -510px !important;
}
.section-single-project .werkzaamheden li{
  font-family: "Ubuntu Condensed", sans-serif;
  font-weight: 400;
    font-size:20px;
}
.section-single-project .list a {
  color: inherit;
  text-decoration: none;
}
.section-single-project .list a:hover {
  text-decoration: underline;
}
strong {
    font-weight:500;
}
.section-single-project .gallery-img {
    margin-bottom:30px;
}
.section-cta {
  margin: 0;
  padding-bottom: 30px;
}
.section-cta h2 {
  width: 100%;
}
.section-cta .content {
  padding: 50px 0;
}
.section-cta .list li {
  font-family: "Ubuntu Condensed", sans-serif;
  font-weight: 400;
  font-size: 18px;
}
.section-cta img {
  margin-top: -50px;
}
.section-bottom {
  padding: 50px 0 100px 0;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover;
}
.section-bottom .content {
  padding: 50px 0;
}
.section-bottom .content a {
  color: #FFF;
  text-decoration: none;
}
.section-bottom .content a:hover {
  color: #FFF;
  text-decoration: underline;
}
footer a {
    color:#FFF;
}
footer a:hover {
    color:#FFF;
    text-decoration:underline;
}
@media (min-width: 769px) {
  .section-projects .introduction {
    margin-bottom: 80px;
  }
  .section-projects {
    padding: 100px 0 100px 0;
  }
  .section-cta {
    margin: 100px 0 0 0;
    padding-bottom: 0px;
  }
  .section-cta h2 {
    width: 80%;
  }
  .section-cta .content {
    padding: 140px 0 140px 120px;
  }
  .section-bottom .content {
    padding: 100px 0 0 30px
  }
  .section-bottom {
    padding: 110px 0 250px 0;
  }
}
.bg-dark-green {
  background: #19452C;
}
.section-projects .bg-dark-green:hover {
  background: #19452C!important;
}
.dark-green {
  color: #19452C;
}
.bg-light-green {
  background: #2B6E2E;
}
.light-green {
  color: #2B6E2E;
}
.bg-lighter-green {
  background: #7EBD64;
}
.bg-light-green:hover,
.bg-light-green:active,
.bg-light-green:focus {
  background: #19452C!important;
}
.lighter-green {
  color: #7EBD64;
}
.bg-orange {
  background: #FFA500;
}
.bg-orange:hover {
  background: #f08200;
}
.orange {
  color: #FFA500;
}
.roboto-thin {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: normal;
}
.roboto-light {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: normal;
}
.roboto-regular {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.roboto-medium {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: normal;
}
.roboto-bold {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: normal;
}
.roboto-black {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: normal;
}
.roboto-thin-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 100;
  font-style: italic;
}
.roboto-light-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-style: italic;
}
.roboto-regular-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
  font-style: italic;
}
.roboto-medium-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 500;
  font-style: italic;
}
.roboto-bold-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  font-style: italic;
}
.roboto-black-italic {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-style: italic;
}
.ubuntu-condensed-regular {
  font-family: "Ubuntu Condensed", sans-serif;
  font-weight: 400;
  font-style: normal;
}
h1, h2, h3, h4, h5 {
  font-family: "Ubuntu Condensed", sans-serif;
  font-weight: 400;
  font-style: normal;
}
.btn,
.wp-element-button {
  font-family: "Ubuntu Condensed", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 17px;
  padding: 5px 20px;
}
.wp-element-button {
    background: #FFA500;
    color:#FFF;
}
.wp-element-button:hover {
    background: #f08200;
    color:#FFF;
}

.checkmark {
  list-style-type: none; /* Verwijdert de standaard bullets */
  position: relative;
  padding-left: 30px; /* Ruimte voor het icoon */
}
.checkmark:before {
  content: "\f00c"; /* Unicode voor FontAwesome's vinkje */
  font-family: "Font Awesome Kit"; /* Zorg dat dit overeenkomt met de geladen versie */
  position: absolute;
  left: 0; /* Positie van het icoon */
  top: 0;
  font-size: 16px; /* Grootte van het icoon */
  color: green; /* Kleur van het vinkje */
}