/*
Theme Name: Silox
Theme URI:
Author: Oh! médias
Description: Thème pour le nouveau site de Silox Belgium
Version: 1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/glp-2.0.html
Tags:  web development, web design, communication, responsive
Text Domain: ohmedias
 */

body {
    font-family: 'Montserrat', sans-serif;
    overflow-x: hidden;
}

#page-innovation section.chiffres .grid .number {
    font-size: 3rem;
    font-weight: 600;
}

#page-innovation section.chiffres .grid .title {
    font-size: 1.3rem;
    color: #008674;
}

#page-innovation section.chiffres .grid {
    display: grid;
    grid-template-columns: repeat(4, auto);
    grid-gap: 2rem;
}

.presentation-center{
    display: flex;
    align-items: center;
    flex-direction: column;
}
/* .presentation-center p{
    text-align: center;
} */
.presentation-center h2 span{
    color: #008674;
    font-weight: 600;
}
.presentation-same{
    display: flex;
    flex-direction: row;
}
.presentation-same h3{
    padding-bottom: 10px;
}
.presentation-same p{
    width: 500px;
}
.element{
    width: 215px;
    height: 215px;
    z-index: 9;
    background-color: #008674;
    color: white;
    box-shadow: 5px 5px 8px #88888852;
}
.elem{
    font-size: 88px;

}
.abs{
    position: absolute;
}
.nombre{
    font-size: 14px;
    top: 15px;
    left: 15px;
}
.produit{
    font-size: 19px;
    bottom: 25px;
}
.presentation-center-wrapper{
    display: flex;
    padding-bottom: 45px;
    align-items: center;
}
.presentation-content{
    max-width: 90%;
}
.zinc-wrapper{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.zinc-content{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.zinc-element-three{
    display: flex;
    flex-direction: row;
}
.presentation-left .presentation-content{
    padding-left:10px;
}
.presentation-right .presentation-content{
    padding-right:10px;
}
.end-contact div{
    margin: 20px;
}
.title-end-contact h3{
    transform: rotate(-90deg);
    right: 130px;
    top: 40px;
}
.title-end-contact h3 span::after{
    bottom: 0rem;
}
.first_contact_section{
    display: flex;
    flex-direction: row;
    padding-top: 10rem;
}
.first_contact_section_ask textarea{
    border: none;
    border-bottom: 2px solid lightgray;
    padding: 20px 20px 10px 0px;
    height: 100px;
    margin-bottom: 50px;
    margin-right: 10px;
}
.first_contact_section label{
    display: flex;
    flex-direction: column;
}
.first_contact_section_ask div{
    display: flex;
    flex-direction: row;
}
#first_contact_section{
    margin-bottom: 15rem;
}
#bannerAll{
    margin-bottom: 2rem;
}
.first_contact_section_submit{
    color: white;
    background-color: #008674;
    padding: 7px!important;
}
.maps iframe{
    width: 90%;
    height: 100%;
}
/*.maps{*/
/*    margin-left: 70px;*/
/*}*/
.ask h3 span{
    color: #008674;
    font-weight: 600;
}
.ask h3{
    margin-bottom: 30px;
}

#first_contact_section input {
    border: none;
    border-bottom: 1px solid lightgray;
    padding: 20px 20px 10px 0px;
    margin-right: 10px;
}
.ask input{
    border: none;
    border-bottom: 1px solid lightgray;
    margin-bottom: 20px;
    margin-right: 10px;
    width: 100%;
}
.ask label{
    padding-right: 10px;
}
.ask textarea{
    width: 100%;
}
#wpcf7-f363-o1 > form > div.first_contact_section_ask > input,
#wpcf7-f854-o1 > form > div.first_contact_section_ask > input{
    color: white;
    background-color: #008674;
    padding: 7px!important;
}
#page-oxyde > section.oxyde > div > div > div.presentation-center-wrapper > img{
    height: 400px;
    margin-right: 60px;
}
.zinc-content-second{
    padding-left: 100px;
}
.zinc-content-first{
    padding-right: 100px;
}


@media (max-width: 970px){

    #first_contact_section input {
        padding: 10px 20px 5px 0px;
         margin-right: 0;
    }

    .first_contact_section_ask div {
        flex-direction: column;
    }

    .first_contact_section {
        padding-top: 3rem;
    }

    .ask label {
        width: 100% !important;
    }

    .first_contact_section{
          flex-direction: column!important;
          align-items: center;
      }
    .first_contact_section div{
        width: 100%;
    }
    .first_contact_section div.maps{
        height: 400px;
    }
    .maps{
        margin-left: 0px;
    }
    .maps iframe{
        width: 100%;
    }
    .banner-type .wrapper h1{
        font-size: 80px;
    }
    .banner .wrapper h1{
        font-size: 80px;
    }
    #page-about > section.valeurs > div > div.grid.mt-5{
        grid-gap: 1rem;
    }
}
@media (max-width: 690px){
    .banner-type .wrapper h1{
        font-size: 55px;
    }
    .banner .wrapper h1{
        font-size: 55px;
    }
    #page-about > section.chiffres > div > div.grid.mt-5{
        display: flex;
        flex-direction: column;
    }
    #page-innovation > section.chiffres > div > div.grid.mt-5{
         display: flex;
         flex-direction: column;
     }
}
@media (max-width: 470px){
    .ask label{
        width: 100%!important;
    }
    .ask h3{
        font-size: 30px;
    }
    .first_contact_section_ask div{
        flex-direction: column;
    }
    .maps{
        margin-left: 0px;
    }
    .maps iframe{
        width: 100%;
    }
    .banner-type .wrapper h1{
        font-size: 45px;
    }
    .banner .wrapper h1{
        font-size: 45px;
    }
    .zinc-content-first{
        padding-right: 50px;
    }
    .zinc-content-second{
        padding-left: 50px;
    }

}
@media (max-width: 770px) {
   footer > div.container > div{
       flex-direction: column;
   }
    footer > div.container > div > div{
        padding: 20px;
    }
    footer .address{
        text-align: center;
    }
}
@media (max-width: 310px) {
    .banner-type .wrapper h1{
        font-size: 25px;
    }
    .banner .wrapper h1{
        font-size: 25px;
    }
    .banner-type .wrapper h1::before{
        bottom: 5px;
    }

}
@media (max-width: 350px) {
    .zinc-content-first{
        padding-right: 20px;
    }
    .zinc-content-second{
        padding-left: 20px;
    }


}