/*
 Theme Name: Child theme for Twenty Fourteen
 Theme URI: 
 Author: SoWWW webdesign
 Author URI: http://www.sowww.nl
 Template: twentytwentyfour
 Description: Child theme for Twenty Fourteen.
 Version: 0.1
 License: GNU General Public License v2 or later
 License URI: http://www.gnu.org/licenses/gpl-2.0.html
 Tags:
 Text Domain: twentytwentyfour-child
 */

 /* --- KLEUREN --- */
/*
Donkergroen:#2d5727 45,87,39
Lichtgroen:#96bc32 150,188,50
Middelgroen:#45733f 69,115,63  
Grijs(tekst): #555555 
*/


/** -- STYLING -- **/

/* Foto's mobiel portrait orientatie niet omlijnen met tekst */
@media (max-width: 480px) and (orientation: portrait) {
    body.page-template-default figure.alignleft, body.page-template-default figure.alignright {
        display: block;
        float: none!important;
        margin: 0 auto!important;
        margin-inline-start: 0!important;
        margin-inline-end: 0!important;
        text-align: center;
    }
    .content { 
        clear: both; 
    }
}

 /* Tarieflijst lijntje */
 h3.wp-block-heading::before{
    background-color: #96bc32;
 }

 /* Logo in footer */
 footer .wp-block-site-logo { padding: 10px; }
 .logo-footer {padding: 10px!important; background-color: #fff; }

 /*Witruimte bij laatste blok weghalen */
 :where(.wp-site-blocks) > * {
    margin-block-start: 0!important;
 }

 /* Contactformulier */
 .contact-form{
    display: inline-block;
    flex-direction: column;
    /*width: 24rem;*/
    gap: 1rem;
    margin-left: auto;
    margin-right: auto;
 }

 .afspraak-form{
    /*width: 35rem;*/
    
 }

 
*.contact-form .form-group {
     margin-bottom: 5px;
    
}

.contact-form .form-group input,
.contact-form .form-group textarea,
.contact-form .form-group select {
    width: 100%;
    min-width: none!important;  
    padding: 8px;
    border: none;
    border-bottom: 1px dashed #584f4f;
    background-color: transparent;
    font-size: 16px;
    box-sizing: border-box; 
    font-family: Roboto Slab;
    text-align: center;
    margin-top: 20px;
}
    .contact-form .form-group select{
        color: #6c6c6c!important;
    }

.contact-form .form-group input:focus,
.contact-form .form-group textarea:focus{
    outline: none!important;
    box-shadow: none!important;
    border: none!important;
    border-bottom: 2px dashed #584f4f!important ;
}

.contact-form .form-group textarea {
    height: 200px;
    resize: vertical;
}

.contact-form .form-group [type="submit"] {
    width: 100%;
    margin: 0 auto;
    padding: 10px 20px;
    background-color: #96bc32;
    color: #fff;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 16px;
    transition: background-color 0.3s;
    text-align: center;
}

.contact-form .form-group [type="submit"]:hover {
    background-color: #45733f;
    
}

/* icons contactformulier */
.page-id-295 .contact-icon{
    line-height: 25px;
}

.page-id-295 .contact-icon svg {
    font-size: 25px!important;
    padding-right: 10px;
}

.page-id-295 .contact-icon a {
    line-height: 25px!important;
    
}

/* Reviews */
/* aanhalingsteken */
.tss-wrapper .tss-layout3 .item-content-wrapper::before, .tss-wrapper .tss-isotope1 .item-content-wrapper::before, .tss-wrapper .tss-video1 .item-content-wrapper::before, .tss-wrapper .tss-carousel3 .item-content-wrapper::before{
    content: "\F10D";
    color: #eaeaea;
    position: absolute;
    left: -10px!important;
    top: -35px!important;
    font-family: "tss-font", serif;
    font-size: 50px;
    margin-bottom: 10px;
    /*color: #2d5727;*/
}

.reviews-homepage .single-item-wrapper{border-radius: 25px!important;}

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    background-color: #2d5727!important ;
}

/** -- NAVIGATIE -- **/

@media screen and (min-device-width: 1024px) and (hover: hover) { 
    header div.site-logo img.custom-logo {
        position: absolute;
        background-color: #fff;
        border-radius: 180px;
        top: -5px;
        padding: 3px;
    }

    
    header div.site-logo{
        padding-top: 0px;
        z-index: 999;
    }
}

header ul.header-menu li a { font-weight: 300;}

/* Afspraak maken button */
li.afspraak-maken-menu a span{
    background-color: #96bc32!important;
    color: #fff;
    border-radius: 20px;
    padding: 5px 10px 5px 10px!important;
}


/** -- OUDE CODE -- **/
/* menu header in het midden logo */
/*    header div.site-logo img.custom-logo {
    position: absolute;
    /*left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);*/
	/*margin-top: 0px;
    padding: 0px 10px 10px 10px;
    border-radius: 180px;
    /*border: 1px solid red;*/
    /*background-color: #fff;
} */