/* Aangepaste kleuren

Oranje: #FF8200
Groen: #2F6F7A

   */

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400&display=swap');
body,h1, h2, h3, h4, h5, h6 { font-family: 'Roboto', sans-serif; }

#contact .contact-info i {
  color: #FF8200;
}
#contact .form button[type="submit"] {
  background: #FF8200;
}
#topbar .contact-info i {
    color: #FF8200;
}

a {                               color: #FF8200; }
a:hover, a:active, a:focus {      color: #2F6F7A; }

.btn-primary {
	background-color: #2F6F7A;
    border-color:  #2F6F7A;
}
.btn-primary:hover {
	background-color: #FF8200;
    border-color:  #FF8200;
}
.login .subscribe-forget p a {  color: #2F6F7A; }
.login .subscribe-forget p a:hover {  color: #FF8200; }
.login .form-group-submit .btn {
	border: 1px solid #2F6F7A;
	background: url(/img/login.png) no-repeat #2F6F7A;
    background-size: 20px 20px;
    background-position: center center;
}
/* #intro { height: 50vh; background-color: #FF8200}*/
#intro { background-color: #FF8200}
#intro .intro-content h2 {        color: #2F6F7A;  font-size: 30px; margin-top: 30px; margin-bottom: 30px;}
#intro .intro-content h2 span {   color: #FF8200; }
#intro .intro-content .btn-get-started {        background: #2F6F7A; border: 2px solid #2F6F7A; }
#intro .intro-content .btn-get-started:hover {  background: none;   color: #2F6F7A; }

.ulInterventies .bg { text-align: center; padding: 5px 8px 5px 8px; width: 100%; height: 80px; background-color: #C0C0C0; border: 1px solid #cccccc;}
.ulInterventies .bg {        background: #2F6F7A; border: 2px solid #2F6F7A; color:#ffffff;}
.ulInterventies .bg:hover {  background: none;   color: #2F6F7A; }
.ulInterventies .bg:hover a {  color: #2F6F7A; }
.ulInterventies .titel:hover {  color: #2F6F7A; }
.ulInterventies .titel { font-weight: bold; font-size:22px; display: block; padding-bottom: 5px; line-height: 28px;}
.ulInterventies .sub { font-weight: bold; font-size:13px; }
.ulInterventies .bg a { color: #ffffff; }
.ulInterventies .bg a:hover { color: #2F6F7A; }

li a { color: #2F6F7A; }

.section-header h2, #about .content h2{ color: #2F6F7A; font-size: 25px; text-transform: uppercase; font-weight: 700; position: relative; padding-bottom: 10px; }
.section-header h3 { color: #2F6F7A; }
.section-header h2::before {      background: #FF8200; }


li a { color: #2F6F7A; }
li a:hover { color: #FF8200; }

.nav-menu li:hover > a, .nav-menu > .menu-active > a {  color: #FF8200; }
.nav-menu ul li:hover > a {                             color: #FF8200; }
#mobile-nav ul .menu-has-children i.fa-chevron-up {     color: #FF8200; }
#mobile-nav ul .menu-item-active {                      color: #FF8200; }

#dak .row { margin-bottom:10px;}
#dak .col { padding:3px;}
#dak .imghalf { margin-bottom: 12px;}

@media only screen and (max-width: 480px) {
  #dak .row { margin-bottom:2px;}
  #dak .col { padding:2px;}
  #dak .imghalf { margin-bottom: 4px;}
}
@media only screen and (min-width: 480px) and (max-width: 768px) {
  #dak .row { margin-bottom:5px;}
  #dak .col { padding:3px;}
  #dak .imghalf { margin-bottom: 6px;}
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
  #dak .row { margin-bottom:5px;}
  #dak .col { padding:3px;}
  #dak .imghalf { margin-bottom: 7px;}
}

@media (max-width: 768px) {
  #intro .intro-content .btn-get-started {
      min-width: 130px;
  }
  .btn-get-started .main { font-size:20px; display: block;}
  .btn-get-started .sub { display: none; }
  #intro .intro-content .btn-get-started, #intro .intro-content .btn-projects {
    padding: 4px 10px;
    margin: 5px;
  }
  #intro .intro-content h2 { font-size: 18px; padding: 0px 20px 0px 20px;}

}
