/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 8 oct. 2018, 08:15:16
    Author     : serge
*/

@media screen and (max-width: 1400px) {
    
    .nav-link {
        font-size: 1.05em;
        line-height: 1.05em;
    }
    
    /**
     *  Page prestations
     */

    #captchaPrestations {
        padding: 0;
        width: 70%;
        margin-bottom: 1em;
    }

}    


/* + Écrans avec une largeur de fenêtre maximum de 1024px + */

@media screen and (max-width: 1024px){
    
    .head {
        justify-content: space-between;
        margin-right: 1em;
        height: 4em;
    }
    
    nav.navigation {
        width: initial;
    }
    
    #logoMenu {
        height: 3.3em;
        width: auto;
    }

    .burger-menu {
        display: block;
    }
    
    .input-burger {
        display: block;
    }
    
    /* Menu affiché sous l'entête lorsque le bouton burger est activé */
    .nav {
        position: fixed;
        background-color: #fff;
        width: 96%;
        top: 3em;
        line-height: 1em;
        height: 2em;
        right: -96%;
        border: 1px solid black;
        border-radius: 1em;
        /*transition*/
        -webkit-transition: -webkit-transform 0.5s cubic-bezier(0.770, 0.000, 0.175, 1.000);
        transition: -webkit-transform 0.5s cubic-bezier(0.770, 0.000, 0.175, 1.000);
        -o-transition: transform 0.5s cubic-bezier(0.770, 0.000, 0.175, 1.000);
        transition: transform 0.5s cubic-bezier(0.770, 0.000, 0.175, 1.000);
        transition: transform 0.5s cubic-bezier(0.770, 0.000, 0.175, 1.000), -webkit-transform 0.5s cubic-bezier(0.770, 0.000, 0.175, 1.000);
        transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1), cubic-bezier(0.77, 0, 0.175, 1);
        -webkit-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
        -o-transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
        transition-timing-function: cubic-bezier(0.770, 0.000, 0.175, 1.000);
    }
    
    .nav-link {
        font-size: 1em;
        line-height: 1em;
    }

    .nav li {
        height: 99%;
    }
    
    .nav li:first-child {
        border-radius: 1em 0 0 1em;
    }
    
    .nav li:last-child {
        border-radius: 0 1em 1em 0;
        line-height: 0.5em;
    }

    .active {
        background-color: #eeb;
    }
    
    .burger-menu {
        position: relative;
    }
    
    .input-burger {
        display: none;
    }
    
    .label-burger {
        margin: 0;
        display: block;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        position: absolute;
        cursor: pointer;
        opacity: 0;
        z-index: 2;
    }
    
    .burger-icon {
        display: block;
        width: 35px;
        height: 5px;
        margin: 5px 0;
        z-index: 1;
        /*transformation du bouton*/
        -webkit-transform-origin: 4px 0px;
        -ms-transform-origin: 4px 0px;
        transform-origin: 4px 0px;
        -webkit-transition: background 0.2s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.2s ease, -webkit-transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0);
        transition: background 0.2s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.2s ease, -webkit-transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0);
        -o-transition: transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0), background 0.2s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.2s ease;
        transition: transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0), background 0.2s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.2s ease;
        transition: transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0), background 0.2s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.2s ease, -webkit-transform 0.2s cubic-bezier(0.77,0.2,0.05,1.0);
    }
    
    .burger-icon:last-child{
        transform-origin: 0% 100%;
        -webkit-transform-origin: 0% 100%;
        -ms-transform-origin: 0% 100%;

    }
    
    .burger-icon1 {
        background-color: red;
    }

    .burger-icon2 {
        background-color: #0080ff;
    }    
    
    .burger-icon3 {
        background-color: #2ecb21;
    }
    
    .input-burger:checked ~ .burger-menu > .burger-icon {
        opacity: 1;
        transform: rotate(45deg);
        -webkit-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
    }
    
    .input-burger:checked ~ .burger-menu > .burger-icon:nth-last-child(2) {
        opacity: 0;
    }
    
    .input-burger:checked ~ .burger-menu > .burger-icon:last-child {
        opacity: 1;
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
    }
    
    .input-burger:checked ~ .nav {
        transform-origin: 0% 0%;
        -webkit-transform-origin: 0% 0%;
        -ms-transform-origin: 0% 0%;
        transform: translateX(-102%);
        -webkit-transform: translateX(-102%);
        -ms-transform: translateX(-102%);
    }
 
    /**
     * Page home
     */
    
    #logoHome {
        max-width: 90%;
        margin-top: -2em;
    }
    
    h1.titre {
        font-size: 1.5em;
    }
    
    #accueil {
        top: 25%;
    }
 
    #accueil p {
        margin-left: 5%;
        margin-right: 5%;
    }
    
    /**
     *  Page prestations
     */

    ul.theme {
        font-size: 1.5em;
    }
    
    span.info {
        border-radius: 40%;
    }
    
    #info {
        width: 80%;
        left: 10%;
        top: 10%;
        padding: 0;
        height: 85%;
        border-radius: 1em;
    }
    
    #info h1.titre {
        margin-top: 1em;
    }

    #texteInfo {
        font-size: 0.8em;
        height: 250px;
        width: 95%;
        margin: auto;
    }
    
    #texteInfo h1 {
        font-size: 2em;
    }
    
    #texteInfo p {
        font-size: 1.5em;
    }
    
    .sortable {
        width: 100%;
    }

    .sortable li {
    /* width: 45px; */
    }
    
    #captchaPrestations {
        padding: 0;
        width: 70%;
        margin-bottom: 1em;
    }
    
    #prestationsform {
        width: 90%;
        font-size: 0.9em;
    }
    
    #prestationsform p {
        font-size: 1.2em;
    }
    
    #formDemandeInfos {
    }
    
/*    #formDemandeInfos p {
        width: 100%;
        text-align: right;
    }
    
    #formDemandeInfos input[type=text], #formDemandeInfos input[type=email] {
        width: 50%;
    }
*/
    #formDemandeInfos button {
        font-size: 1.5em;
    }
    
    /**
     *  Page contact
    */

    #formContact {
        width: 68%
    }
    
    #formContact p {
        display: grid;
    }

    #formContact > p:last-child {
        display: block;
    }

    #message {
        width: 100%;
    }

    #captchaContact {
        width: 30%;
    }

    #formContact > div:first-child {
         width: 100%; 
         display: block; 
    }

    #formContact button {
        border-radius: 0.5em;
        font-size: 1em;
        margin-left: 2em;
    }

}

/*             Page Soutenance OC                 */

.soutenanceoc {
    color: #7451eb;
}

p.soutenanceoc {
    color: black;
    font-size: 1.5em;
}

#listeDates p, ul {
    font-size: 1.5em;
}

#listeDates li {
    margin-left: 2em;
}

#listeDates a {
    font-size: 1em;
    text-decoration: none;
    cursor: pointer;
}