/* STYLESHEET */

/* FONTS ADDENDUM */

 @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;500;700&display=swap');

/* <style> ========================================================================================================== */
/* TYPO */
/* ================================================================================================================== */

@font-face {
    font-family: 'BodoniXT';
    src: url('../fonts/BodoniXT-webfont.eot');
    src: url('../fonts/BodoniXT-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/BodoniXT-webfont.woff') format('woff'),
         url('../fonts/BodoniXT-webfont.ttf') format('truetype'),
         url('../fonts/BodoniXT-webfont.svg#bodonixtregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

html, body { 
    min-height:100%;
    max-width:100%;
    height:100%;
    font-family: 'Roboto','Open Sans', Arial, sans-serif; 
    font-size: 16px;
    line-height: 1.3em; 
    font-weight: 300;
    color: #666666;
    background-color: #4c4c4c;
}

h1, .fontme { font-family: 'BodoniXT', 'Amble', 'Open sans', Arial, sans-serif; }
h1, h2, h3, h4, h5, h6 { font-weight: 500; }
p { font-weight: 200; }
p.lead, .lead p { font-weight: 300; }

/* ================================================================================================================== */
/* BOOTSTRAP OVERWRITES */
/* ================================================================================================================== */

a { color: #3aaa35;}
a:hover, a:focus { color: #006a00; }


/*===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A
            /*  PRIMARY COLOR OVERWRITES { overwrites bootstrap 3 primary color settings } 
            /*===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A===A*/

            .bs-primary-border { border-color: #3aaa35; }
            .bs-primary-background { background-color: #3aaa35; }
            .bs-primary-color { color: #3aaa35; }

            .text-primary { color: #3aaa35; }

            .bg-primary, .bg-brand  {
                color: #FFF;
                background-color: #3aaa35;
            }

            .progress-bar-primary {
                color: #FFF;
                background-color: #3aaa35;
            }

            a.bg-primary:hover,
            a.bg-primary:focus {
                background-color: #006a00;
            }

            .btn-primary, .btn-primary:link, .btn-primary:visited {
                color: #FFF;
                background-color: #3aaa35;
                border-color: #2d9d28;
            }

            .btn-primary:focus,
            .btn-primary.focus,
            .btn-primary:hover,
            .btn-primary:active,
            .btn-primary.active,
            .open > .dropdown-toggle.btn-primary {
                color: #FFF;
                background-color: #20901b;
                border-color: #14840f;
            }

            .btn-primary:active:hover,
            .btn-primary.active:hover,
            .open > .dropdown-toggle.btn-primary:hover,
            .btn-primary:active:focus,
            .btn-primary.active:focus,
            .open > .dropdown-toggle.btn-primary:focus,
            .btn-primary:active.focus,
            .btn-primary.active.focus,
            .open > .dropdown-toggle.btn-primary.focus {
                color: #FFF;
                background-color: #14840f;
                border-color: #077702;
            }

            .btn-primary:active,
            .btn-primary.active,
            .open > .dropdown-toggle.btn-primary {
                background-image: none;
            }

            .btn-primary.disabled:hover,
            .btn-primary[disabled]:hover,
            fieldset[disabled] .btn-primary:hover,
            .btn-primary.disabled:focus,
            .btn-primary[disabled]:focus,
            fieldset[disabled] .btn-primary:focus,
            .btn-primary.disabled.focus,
            .btn-primary[disabled].focus,
            fieldset[disabled] .btn-primary.focus {
                background-color: #3aaa35;
                border-color: #2d9d28;
            }

            .btn-primary:not(:disabled):not(.disabled):active {
                color: #FFF;
                background-color: #1a8a15;
                border-color: #14840f;
            }
            
            .btn-primary .badge {
                color: #3aaa35;
                background-color: #FFF;
            }

            .label-primary {
                background-color: #3aaa35;
            }

            .label-primary[href]:hover,
            .label-primary[href]:focus {
                background-color: #005d00;
            }

            .panel-primary {
                border-color: #3aaa35;
            }

            .panel-primary > .panel-heading {
                color: #FFF;
                background-color: #3aaa35;
                border-color: #3aaa35;
            }

            .panel-primary > .panel-heading + .panel-collapse > .panel-body {
                border-top-color: #3aaa35;
            }

            .panel-primary > .panel-heading .badge {
                color: #3aaa35;
                background-color: #FFF;
            }

            .panel-primary > .panel-footer + .panel-collapse > .panel-body {
                border-bottom-color: #3aaa35;
            }

            .pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover {
                background-color: #3aaa35;
                border-color: #3aaa35;
            }

            .pagination>li>a, .pagination>li>span {
                color: #3aaa35;
            }
            
            .page-link:hover {
                color: #20901b;
            }
            

.btn-xl {
    padding: 10px 20px 8px;
    font-size: 23px;
    line-height: 1.3333333;
    border-radius: 0;
    margin-top: 40px;
}

/* ================================================================================================================== */
/* BASIC BUILDING BLOX */
/* ================================================================================================================== */

/* =================================================================================== */
/* == TOPBAR == */

#topbar {
    color: #fff;
}

#topbar p {
    margin: 10px 0;
}

#topbar .btn {
    display: inline;
    padding: 8px 60px;
}

/* =================================================================================== */
/* == HEADER == */

#header {
    background-color: white;
}

.brandlogo { margin: 5px 0 5px 0; max-width: 50%; }

@media only screen and (min-width : 768px) {
    .brandlogo { margin: 20px 0 0; }
}

@media only screen and (min-width : 992px) {
    .brandlogo { max-width: 100%; }
}

/* =================================================================================== */
/* == HOMESLIDER == */

.homeslidewrapper { position: relative; }

#homeslide { 
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

#homeslide, #homeslidecar, #homeslide .carousel, #homeslide .carousel-inner {
    height: 100%;
    width: 100%;
} 

#homeslide .item {
    height: 100%;
    width: 100%;
    background-position: center left;
    background-repeat: no-repeat;
}


/* =================================================================================== */
/* == IMAGE == */

#image {
    background-color: #e6e6e6;
}

.imagewrapper { position: relative; }
.imagebackground {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 100%;
    background-image: url('../img/header.jpg');
    background-position: center left;
    background-repeat: no-repeat;
}

.accentbar { 
	position: absolute;
	top: 0;
	bottom: 0;
	left: -1px;
	right: -1px;
	width: calc(100% + 2px);
	height: 100%;
    background-image: url('../img/accent.png');
    background-position: center left;
    background-repeat: no-repeat;
}

/* =================================================================================== */
/* == CAROUSEL */

#GAL .carousel {
	margin-bottom: 15px;
}

#GAL .carousel-inner
{
    overflow: visible;
}

#GAL .carousel-inner > .item
{
    text-align: center;
}

#GAL .carousel-inner > .item > img, 
#GAL .carousel-inner > .item > a > img
{
    display: inline-block;
    width: 100%;
}

#GAL .carousel-indicators {
    bottom: -40px;
}

/* =================================================================================== */
/* == MENU/NAVBAR */

#menublok { background-color: #fff; }

#menublok .navbar {
    margin-bottom: 0;
}

.navbar-default {
    background-color: #fff;
    margin-bottom: 0;
    border: 0;
}

.navbar-header {
    float: none;
}

.navbar.navbar-special {
	margin-bottom: 0;
}

@media only screen and (min-width : 768px) 
{
	.nav.navbar-center {
		float: none;
		margin: 10px auto 0;
		display: block;
		text-align: center;
	}

	.nav.navbar-center > li {
		float: none;
		display: inline-block;
	}
}

.navbar-special .navbar-nav > li > a {
    font-family: 'BodoniXT', 'Amble', 'Open sans', Arial, sans-serif;
    font-size: 16px;
    letter-spacing: 2px;
    color: #000;
}

.navbar-special .navbar-nav > .active > a {
    font-family: 'BodoniXT', 'Amble', 'Open sans', Arial, sans-serif;
    color: #3aaa35;
}

.navbar-special .navbar-nav > .active > a:hover,
.navbar-special .navbar-nav > li > a:hover {

}

.navbar-special .navbar-toggle { border-color: #3aaa35; margin-top: 20px; }
.navbar-special .icon-bar { background-color: #3aaa35; }

@media only screen and (max-width : 768px) {
    .navbar-nav .open .dropdown-menu { background-color: #3aaa35; }
    .navbar-header { border-bottom: 1px solid #3aaa35; }
}

.navbar-nav .dropdown-menu { padding: 0; font-weight: 300; }
.dropdown-menu > li > a { font-weight: 300; }

.dropdown-menu {
    background-color: #3aaa35;
    color: #fff;
}

.dropdown-menu > li > a {
    color: #fff;
}

.dropdown-menu > .active > a, 
.dropdown-menu > .active > a:hover, 
.dropdown-menu > .active > a:focus {
    background-color: #046c34;
}

/* ================================================================================================================== */
/* CONTENT */
/* ================================================================================================================== */

#content {
    padding: 0;
    background-color: white;
}

.contentwrapper {
    padding: 3em 0 4em;
    background-color: white;
}

#topbox {
    background-color: #26282a;
    color: #ffffff;
    margin: 20px 0;
    padding: 20px;
}

#bottombox {
    background-color: #0a8a36;
    color: #ffffff;
    padding: 20px;
    display: block;
    overflow: hidden;
    margin-bottom: 25px;
}

@media only screen and (min-width : 992px) 
{
    #topbox {
        background-color: transparent;
        background-image: url('../img/topbox-small.png');
        background-position: top center;
        background-repeat: no-repeat;
        /* padding: 100px 40px 20px 40px; */
        padding: 60px 40px 20px 40px;
        color: #ffffff;
        margin: 40px 0 0 0;
    }

    #bottombox {
        background-color: #0a8a36;
        background-image: url('../img/bottombox-small.png');
        background-position: bottom center;
        background-repeat: no-repeat;
        /* padding: 20px 40px 100px 40px; */
        padding: 20px 40px 70px 40px;
        color: #ffffff;
    }
}

@media only screen and (min-width : 992px) {
    #topbox { padding: 65px 50px 20px 50px; }
    #bottombox { padding: 20px 50px 80px 50px; }
}

@media only screen and (min-width : 1200px) {
    #topbox { padding: 75px 50px 20px 50px; }
    #bottombox { padding: 20px 50px 80px 50px; }
}


#topbox.uitz {
    padding-top: 0;
} 

.openlist, .openlist li {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.openlist li { 
    border-bottom: 1px solid white;
    padding: 5px 0;
}

.openlist .openlist-dag { 
    display: inline-block;
    width: 40px;
}

.fagg{
    margin-top: 40px;
    text-align: center;
}

.fagg p{
    margin: 15px 0; 
}

.fagg img{
    margin: 0 auto;
}

@media only screen and (min-width : 992px) {
    .fagg{ margin-top: 70px; }
}

@media only screen and (min-width : 1200px) {
    .fagg{ margin-top: 50px; }
}

/* ================================================================================================================== */
/* SUBMENU */
/* ================================================================================================================== */

.nav.nav-pills {
    margin-bottom: 20px;
}

.nav-pills > li {
    margin: 0;
    padding: 0;
}

.nav-pills > li > a {
    color: #acacac;
    background-color: transparent;
    border-radius: 0;
    padding: 0.6em 5px;
    margin: 0;
    overflow: hidden;
    border: 0;
    border-bottom: 1px solid #dadada;
    line-height: 1.2em;
    text-transform: uppercase;
    text-decoration: none !important;
}

.nav-pills > li.active > a {
    color: #3aaa35;
    font-weight: 500;
    background-color: transparent;
}

.nav-pills > li > a:focus, 
.nav-pills > li > a:hover,
.nav-pills > li.active > a:focus, 
.nav-pills > li.active > a:hover {
    color: #000;
    background-color: transparent;
}


/* =================================================================================== */
/* == GOOGLE MAP == */

#map, #map iframe {
    position: relative;
    background-color: white;
    border: 0;
    margin: 0;
    padding: 0;
}

/* =================================================================================== */
/* == FOOTER */

#footer {
    padding: 15px 0;
    background-color: #4c4c4c;
    color: white;
    overflow: hidden;
    font-size: 0.8em;
    margin-top: -3px;
}

#footer p { margin: 0; }

.footer-left, .footer-right { text-align: center; }
    
@media only screen and (min-width : 768px) 
{
    .footer-left { text-align: left; }
    .footer-right { text-align: right; }
}