/*
Theme Name: Symetry
Text Domain: symetry-child
Template: Divi
Description:  Custom Wordpress theme based on Divi.
Author:       Symetry
Version: 1.0.0
Author URI:   https://symetry.lu
*/

  @import url("https://use.typekit.net/rur0lao.css");

* {

font-family: "bonnie", sans-serif;
font-weight: 400;
font-style: normal;
}

h1, h2, h3, h4, h5, h6, .et_pb_blurb_container h4 span, body #page-container .et_pb_section .et_pb_button_0 { 
    font-family: "degular", sans-serif !important;
    font-weight: 600 !important;
    font-style: normal !important;
}


.degular-font {
    font-family: "degular", sans-serif !important;
}

/* mise en forme navbar*/

.et_mobile_menu li a, .et-menu li a {
font-family: "degular", sans-serif !important;
}

/* .et_pb_menu .et_pb_menu__menu>nav>ul>li>ul {
    top: calc(100% - -8px);
}
*/

.nav li li {
    padding: 0 5px !important;
} 

.nav li:nth-child(4) ul {
    width:180px !important;

}

.nav li:nth-child(3) ul {
    width:200px !important;

}

/*end*/

/*mise en forme colonnes*/

@media only screen and (min-width: 981px) {
    .tight_section {
    padding-left: 14%  !important;
}

    .straight_section {
        padding: 5% 14% !important;
}
/*end*/

/*mise en forme services page accueil*/

.accueil_link {
    font-family: "degular", sans-serif !important;
    font-weight: 600 !important;

}

.accueil_link i {
    transition: all .3s ease !important;
}

.accueil_link:hover i {
    transform: translateX(8px) !important;
}

#home_services .et_pb_column_3, #home_services .et_pb_column_4, #home_services .et_pb_column_5, #home_services .et_pb_column_6, .service_section span, .service_section p { 
    transition: all .3s ease !important;

}

    #home_services .et_pb_column_3:hover, #home_services .et_pb_column_4:hover, #home_services .et_pb_column_5:hover, #home_services .et_pb_column_6:hover {
        background-image: initial;
        background-color: #E20613;
    }


    .service_section:hover span, .service_section:hover p {
        color: #ffffff !important;
    }

    .service_section:hover img {
        filter: brightness(0%) invert(100%) !important;
    }

}
/*end*/


/*hover fleches boutons généraux*/
.et_pb_button:hover:after, .et_pb_button_0:hover:after {
    transform: translateX(5px);
}
/***end***/

/* .other_services {
    display:flex; 
    align-items:center; 
    gap: 20px;
}

.other_services img {
    width: 40px; 
}

.other_services img:hover {
    transform: scale(1.03);
} */


/*button icones fixed left bottom*/

.soco_services {
    position: fixed;
    bottom: 3%;
    left:1.5%;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.soco_services img {
    width: 30px; 
}

.soco_services img:hover {
     transform: scale(0.95);
}

.soco_services .active img {
    filter: brightness(0) invert(10%);
}

.soco_services .active {
    pointer-events: none;
}
/*end/
/*galerie nos réalisations overlay*/
.et_overlay:before {
    content: url("https://socofa.symetry.ovh/wp-content/uploads/2023/06/icon_overlay_socofa.png") !important;
   }

/*mise en forme bouton formulaire de contact*/

div.wpforms-container-full .wpforms-form input[type="submit"],
div.wpforms-container-full .wpforms-form button[type="submit"],
div.wpforms-container-full .wpforms-form .wpforms-page-button {
    background: transparent !important;
    border: 1px solid #E20613 !important;
    color: #E20613 !important;
    font-family: "degular", sans-serif !important;
    font-weight: 600;
    font-size: 18px !important;
    border-radius: 100px !important;
    padding: 10px 30px !important;
    transition: all .3s ease;
}
div.wpforms-container-full .wpforms-form input[type="submit"]:hover,
div.wpforms-container-full .wpforms-form button[type="submit"]:hover,
div.wpforms-container-full .wpforms-form .wpforms-page-button:hover {
    background: #E20613 !important;
    color: white !important;
}



  /* THREE COLUMN PORTFOLIO GRID LAYOUT */

@media only screen and ( min-width: 768px ) {

    .three-column-grid .et_pb_grid_item {
    width: 28.333% !important;
    margin: 0 7.5% 7.5% 0 !important;
    }
     
    .three-column-grid .et_pb_grid_item:nth-child(3n) {
    margin-right: 0 !important;
    }
    
    .three-column-grid .et_pb_grid_item:nth-child(3n+1) {
    clear: left;
    }
    
    .three-column-grid .et_pb_grid_item:nth-child(4n+1) {
    clear: unset !important;
    }
    
    }