/*
Pour le bouton de demande de devis : voir button.css
Pour le menu de navigation : voir menu.css - main.js($(window).scroll)
Pour le menu mobile : voir menu-mobile.css - main.js(#menu-wrapper)
*/

.conteneurTelHautPage{
    position:relative;
    display: block;
    height: 80px;
}

.conteneurTelHautPage .boutonSimple{
    float: right;
    right: 35px;
    top:8px;
    padding: 15px 30px;
    font-size: 17px;
    background-color: rgb(0, 153, 51);
}

.conteneurTelHautPage .boutonSimple:hover {
    background-color: rgb(9,54,35);
}

.fondHautPageSite,.fondHautPageSiteAutrePage,.fondHautPageSiteScroll{
    position: relative;
    width: 100%;
    top:0px;
    height: 140px;
    z-index: 1000000;
    background-color : white; /*rgb(244,244,242);*/ /*rgb(238,238,233);*/
    /*border-bottom: 2px solid rgb(229,231,235);*/
    background-repeat: repeat-x;
    transition: top 0.35s ease, background-color 0.5s ease;
    -moz-transition: top 0.35s ease, background-color 0.5s ease;
    -webkit-transition:top 0.35s ease, background-color 0.5s ease;
    -o-transition:top 0.35s ease, background-color 0.5s ease;
}

.fondHautPageSiteAutrePage{
    background: rgb(252,252,252);
}

.fondHautPageSiteScroll{
    top:0px;
    position: fixed;
    z-index: 1000000;
    /*background: rgb(0,40,58);*/
    background-color : white; /*rgb(244,244,242);*//*rgb(238,238,233);*/
    -webkit-box-shadow:-2px 13px 29px -8px rgba(0,0,0,0.4);
    box-shadow:-2px 13px 29px -8px rgba(0,0,0,0.4);
}

/***********************************/

.imageLogoGypek{
    position: absolute;
    left:15px;
    top:10px;
    width: 430px;
}

.contact-email, .contact-telephone{
    position: absolute;
    top:12px;
    right: 550px;
}

.contact-email{
    right: 290px;
}

.contact-link {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-decoration: none;
    padding: 0px;
    max-width: 250px; /* Ajuste si besoin */
    border:0px solid red;
}

.phone-icon {
    width: 40px;
    height: 40px;
    margin-right: 10px;
    background: url('../images/site/telephone-kinesitherapeute-yvelines.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-transition: background-image 0.3s ease-in-out;
    -o-transition: background-image 0.3s ease-in-out;
    transition: background-image 0.3s ease-in-out;
}

html.no-webp .phone-icon {
    background-image: url('../images/site/telephone-kinesitherapeute-yvelines.png');
}

.mail-icon {
    width: 40px;
    height: 40px;
    margin-right: 10px;
    background: url('../images/site/mail-kinesitherapeute-yvelines.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    -webkit-transition: background-image 0.3s ease-in-out;
    -o-transition: background-image 0.3s ease-in-out;
    transition: background-image 0.3s ease-in-out;
}

html.no-webp .mail-icon {
    background-image: url('../images/site/mail-kinesitherapeute-yvelines.png');
}

/*.contact-link:hover .phone-icon {
    background-image: url('../images/site/telephone-avocat-divorce-hover.png');
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

}

html.no-webp .contact-link:hover .phone-icon {
    background-image: url('../images/site/telephone-avocat-divorce-hover.png');
}*/

.contact-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.contact-info-coordonnees {
    /*font-weight: bold;*/
    color: black;
    font-size: 17px;
    padding-bottom: 0px;
    -webkit-transition: background-color 0.3s, color 0.3s;
    -o-transition: background-color 0.3s, color 0.3s;
    transition: background-color 0.3s, color 0.3s;
}

/*.contact-link:hover .contact-info-coordonnees{
    color: white;
}*/
/**********************************************/
@media only screen and (max-width: 1350px){
    .imageLogoGypek{
        width: 350px;
    }
}
@media only screen and (max-width: 1200px){
    .imageLogoGypek{
        width: 330px;
    }
}

/*********************************************/

@media only screen and (max-width: 1100px){
    .fondHautPageSite,.fondHautPageSiteAutrePage,.fondHautPageSiteScroll{
        position: relative;
        display: block;
        border:0px solid red;
    }

    .imageLogoGypek{
        top: 50px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 250px;
    }

    .phone-icon, .mail-icon {
        width: 35px;
        height: 35px;
    }

    .contact-link{
        border:0px solid green;
        width: 350px;
        max-width: none;
    }
    .contact-info {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .contact-email{
        top:50px;
        left:15px;
    }

    .contact-telephone{
        top:10px;
        left:15px;
    }

    .contact-info-coordonnees{
        font-size: 16px;
    }
}

@media only screen and (max-width: 750px){

    .fondHautPageSite,.fondHautPageSiteAutrePage,.fondHautPageSiteScroll{
        border:0px solid red;
    }

    .conteneurTelHautPage .boutonSimple{
        float: right;
        right: 5px;
        top:5px;
        padding: 10px 20px;
    }

    .imageLogoGypek{
        top: 70px;
        left: 45%;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        transform: translateX(-50%);
        width: 250px;
    }

    .contact-link{
        width: 180px;
        max-width: none;
        border:0px solid red;
    }

    .contact-email{
        display: none;
    }

    .contact-info {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .phone-icon {
        width: 30px;
        height: 30px;
    }

    .contact-info-coordonnees{
        font-size: 15px;
    }
}

@media only screen and (max-width: 400px){
    .conteneurTelHautPage .nav-button{
        top:13px;
        right: 5px;
        padding: 15px 25px;
        font-size: 13px;
    }
}