/*


	Theme Name: 	Grobben Bouwmanagement Child
	Template: 		grobben
	Version: 		1.0


    Oranje:         #F39200
    Donkerblauw:    #1A3354
    Blauwtint:      #E5EBF8


*/ 

/* !! Typografie !! */
@import url('https://fonts.googleapis.com/css?family=Caveat:700');

@font-face {
	font-family: 'santral-bold';
    src: url('https://grobbenbouwmanagement.nl/wp-content/themes/grobben-child/assets/fonts/santral-bold-webfont.woff2') format('woff2'),
         url('https://grobbenbouwmanagement.nl/wp-content/themes/grobben-child/assets/fonts/santral-bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'santral-semibold';
    src: url('https://grobbenbouwmanagement.nl/wp-content/themes/grobben-child/assets/fonts/santral-semibold-webfont.woff2') format('woff2'),
         url('https://grobbenbouwmanagement.nl/wp-content/themes/grobben-child/assets/fonts/santral-semibold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'santral-regular';
    src: url('https://grobbenbouwmanagement.nl/wp-content/themes/grobben-child/assets/fonts/santral-regular-webfont.woff2') format('woff2'),
         url('https://grobbenbouwmanagement.nl/wp-content/themes/grobben-child/assets/fonts/santral-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

h1, .h1,
h2, .h2,
h3, .h3 {
    font-family: 'santral-semibold' !important;
}

h1 em, .h1 em {
    color: #1A3354;
    font-size: 140%;
    font-family: 'Caveat', cursive !important;
}

p em {
    color: #F39200;
    min-width: 55px;
    font-style: normal;
    font-weight: normal;
    display: inline-block;
    font-family: 'santral-bold' !important;
}

p strong {
    font-weight: normal;
    font-family: 'santral-bold' !important;
}

body {
    font-family: 'santral-regular' !important;
}


/* !! Paddings !! */
.padding-medium {
    padding-top: 75px;
    padding-bottom: 25px;
}

.padding-medium.footerr {
    padding-top: 75px;
    padding-bottom: 25px;
}

.padding-large {
    padding-top: 75px;
    padding-bottom: 55px;
}

.padding-extra-large {
    padding-top: 75px;
    padding-bottom: 400px;
}

.larger-bg .vc_column-inner{
    background-size: 60% !important;
}

.footerr .wpex-vc-column-spacing-60 .vc_column-inner {
    margin-bottom: 10px;
}


/* !! Header !! */
#site-logo img {
    width: 225px;
    height: auto;
}


/* !! Slider !! */
.tp-dottedoverlay {
    opacity: 0.2;
}

.tp-bullet {
    width: 16px;
    height: 16px;
    background: #FFF;
    border-radius: 99px;
    border: 2px solid #FFF;
}

.tp-bullet.selected,
.tp-bullet:hover {
    background: #F39200;
}

.achtergrond-slider {
    position: relative !important;
}

.achtergrond-slider-wrapper {
    left: 0 !important;
    position: absolute !important;
}

.achtergrond-slider-overlay {
    overflow: hidden;
    max-height: 800px !important;
}

.achtergrond-slider-overlay h1 {
	color: #F39200 !important;
}


/* !! Contact (formulier !! */
form.wpcf7-form {
    margin-top: 30px;
}

form.wpcf7-form br {
    display: none;
}

.wpcf7-form input,
.wpcf7-form textarea,
.wpcf7-form .wpex-select-wrap {
    margin: 0;
}

.wpcf7-form textarea,
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"] {
    border: none;
    color: #1A3354;
    font-size: 16px;
    background: #E5EBF8;
    padding: 12px 16px 12px 13px;
    border-left: 2px solid #E5EBF8;
}

.wpcf7-form textarea {
    width: 100%;
    margin: 0 0 15px 0;
}

.wpcf7-form input[type="tel"],
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"] {
    margin: 0 15px 15px 0;
    width: calc(33.333% - 10px);
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus {
    color: #F39200;
    border-left: 2px solid #1A3354;
}

    /* !! Placeholder CSS !! */
    ::-webkit-input-placeholder {
        opacity: 1;
    }

    :-moz-placeholder {
        opacity: 1;
    }
    ::-moz-placeholder {
        opacity: 1;
    }
    :-ms-input-placeholder {
        opacity: 1;
    }

.last-item {
    margin-right: 0 !important;
}


/* AVG */
.akkoord {
    width: 25px;
    float: left;
    display: inline-block;
}

.akkoord span.wpcf7-list-item {
    margin-left: 0;
    position: relative;
}

.info {
    float: right;
    font-size: 13px;
    line-height: 150%;
    display: inline-block;
    width: calc(100% - 25px);
    margin: 5px 0 20px 0;
}

.info a {
    text-decoration: underline;
}

.cookie-notice-container {
    padding: 20px;
}

.cookie-notice-container .button {
    color: #FFF;
    font-size: 11px;
    padding: 8px 12px;
    background: #1A3354;
}

.cookie-notice-container .button:hover {
    background: #F39200;
    text-decoration: none;
}

.grecaptcha-badge {
	visibility: hidden;
}


/* !! Google Maps !! */
#google-maps {
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    opacity: 0.667;
    position: absolute;
    height: calc(100% + 50px);
}

#maps-wrapper {
    overflow: hidden;
}

#maps-overlay {
    z-index: 2;
    position: relative;
}

/* !! Footer (portret) !! */
.portret-overlay {
    z-index: 9;
    position: relative;
}

.portret-footer {
    z-index: 8;
    left: 50px;
    top: -160px;
    position: absolute;
}

#footer-bottom {
	margin-top: -15px;
	padding: 0 15px 20px 15px;
}

@media only screen and (max-width: 1140px) {
    
    
    h1, .h1 {
        font-size: 64px !important;
    }
    
    h2, .h2 {
        font-size: 56px !important;
    }
    
    #cn-notice-text {
        display: block;
        margin-bottom: 15px;
    }
    
}

@media only screen and (max-width: 959px) {
    
    /* !! Typografie !! */
    .entry p {
        font-size: 15px !important;
    }
    
    h1, .h1 {
        font-size: 56px !important;
    }
    
    h2, .h2 {
        font-size: 44px !important;
    }
    
    .tp-bullets {
        left: 40px !important;
    }    
    
    
    /* !! Paddings !! */
    .padding-medium {
        padding-top: 50px;
        padding-bottom: 10px;
    }

    .padding-large {
        padding-top: 75px;
        padding-bottom: 55px;
    }

    .padding-extra-large {
        padding-top: 50px;
        padding-bottom: 300px;
    }
    
    .portret-footer {
        top: 50px;
        left: 50px;
    }
    
    .larger-bg .vc_column-inner {
        background-size: 90% !important;
    }
    
    p em {
        width: auto !important;
        min-width: 25px !important;
    }
    
}

@media only screen and (max-width: 767px) {
 
    /* !! Typografie !! */
    .entry p {
        font-size: 15px !important;
    }
    
    h1, .h1 {
        font-size: 32px !important;
    }
    
    /* !! Paddings !! */
    .padding-medium {
        padding-top: 40px;
        padding-bottom: 0;
    }

    .padding-large {
        padding-top: 40px;
        padding-bottom: 0;
    }
    
    .padding-large .vc_column-inner {
        margin-bottom: 20px;
    }

    .padding-extra-large {
        padding-top: 30px;
        padding-bottom: 100px;
    }
    
    .padding-medium .vc_column-inner {
        min-height: 250px;
    }
    
    .padding-medium.footerr .vc_column-inner {
        min-height: auto;
    }
    
    .tp-bullets {
        left: 20px !important;
    } 
    
    .portret-footer {
        display: none;
    }
    
    #footer-bottom-inner {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    
    #menu-footermenu {
        font-size: 11px;
        text-align: center;
    }
    
}

@media only screen and (max-width: 620px) {
    
    p em {
        width: auto !important;
        min-width: 5px !important;
    }
        
    .wpcf7-form textarea,
    .wpcf7-form input[type="tel"],
    .wpcf7-form input[type="text"],
    .wpcf7-form input[type="email"] {
        width: 100%;
        margin: 0 0 15px 0;
    }    
    
}