/**
 * nav interne
 */

body, html {
    padding: 0 0 0 0;
}

#fondrectangle{
    height:90px;
    background-image:url("../images/FondRectangle.svg");
    background-position: top;
    background-size:cover;
    position:relative;
    z-index:0;
    
}

#fondnav2,
#fondnav2 path {
    width: 100%;
    margin-top: -0.4px;
}

#navtest {
    top: 0;
    width: 100%;
    position: absolute;
    margin-top: 90px;
    z-index: 1;
}

#navtest li {
    padding-top: 3%;
    float: right;
    list-style: none;
    text-transform: uppercase;
    margin-right: 3%;
}

#navtest li:first-of-type {
    margin-right: 13%;
}

#navtest a {
    font-size: 18px;
    text-transform: uppercase;

    color: rgb(var(--coconut));
    text-decoration: none;

    border-bottom: 5px solid rgba(var(--coconut), 0);
    transition-duration: 0.1s;
    font-family: "JosefinSans-SemiBold";

}

#navtest a:hover {
    /* text-decoration: underline; */
    border-bottom: 4px solid rgb(var(--coconut));
}

#navtest a:visited {
    color: rgb(var(--coconut));
}

/**
 * fond
 */
div#fond {
    position: absolute;
    width:100%;
    right: 0;
    z-index:0;
}

div#fond img{
    width:50%;
    position:absolute;
    right:0;
}

/* ----------------------------------------------------------- */

div#content {
    position:relative;
    z-index:10;
    margin: 0 95px 0 5%;
}



div#disciplines {
    width: 100%;
    
}

div#article {
    width: 70%;
    margin-left:5%;
    
}

div#disciplines div#article {
    display: flex;
    flex-wrap: wrap;
}

div#disciplines article {
    flex: 0 0 calc(50% - 30px);
    padding: 30px;
    border-radius: 45px;
    box-shadow: 15px 15px 25px 0px rgba(0, 0, 0, 0.25);
    background-color:rgba(255,255,255,0.93);
    margin: 0 30px 30px 0;
    z-index: 1;
}
div#disciplines article > a {
    display: block;
}
div#disciplines article > a[target="_blank"]::after {
    font-family: "";
    content: " \E895";
    font-family: "Material Icons";
    font-size: 1rem;
}

div#disciplines article h3.h2V1 {
    font-size: 0.8rem;
    text-decoration: underline 2px rgb(var(--relaxationGreen));
}

div#contacter {
    display: flex;
    margin: 100px 0 100px 0;
}

div#contacter article:nth-child(1) {
    display: flex;
    flex-direction: column;

    padding: 0 100px 0 0;
}

div#contacter article:nth-child(1) span{
    line-height: 30px;
}

div#contacter article:nth-child(1) span::before {
    font-family: "Material Icons";
}

div#contacter article:nth-child(1) span#num::before {
    content: "\e0cd  ";
}

div#contacter article:nth-child(1) span#mail::before {
    content: "\e0be  ";
}
div#contacter article:nth-child(1) span#location::before {
    content: "\e55f  ";
}

div#contacter article span {
    margin-left:5%;
}

div#contacter article:nth-child(2) {
    flex: 1 1 auto;
    padding:10px;
    border:solid 5px #96BFDB;
}

div#contacter article:nth-child(2) iframe {
    width: 100%;
    height: 450px;
}

@media only screen AND (max-width: 1030px) {

    #navtest li:first-of-type {
        margin-right: 18%;
    }

    div#content{
        width:90%;
        margin:auto;
    }
    div#disciplines{
        width:100%;
        margin:auto;
    }
    div#article{
        margin-left:0;
        margin:auto;
        margin-top:10%;
        width:100%;
        
    }
    div#disciplines article {
        flex: 0 0 calc(50% - 30px);
        padding: 30px;
        border-radius: 45px;
        box-shadow: 15px 15px 25px 0px rgba(0, 0, 0, 0.25);
        background-color:rgba(255,255,255,0.93);
        
        
        z-index: 1;
    }

    div#contacter {
        flex-direction:column;
    }

    div#contacter {
        display: flex;
        margin-top:10%;
    }

    div#contacter article:nth-child(2) {
        margin-top:10%;
    }
    #fondrectangle{
        height:70px;
    }


    #navtest{
        margin-top:50px;
    }
    #navtest ul li:nth-child(2){
        display: none;
    }
}

@media only screen AND (max-width: 700px) {

    div#disciplines{
        width:100%;
        margin:auto;
    }
    div#article{
        width:95%;
    }
    div#disciplines article {
        flex: 0 0 calc(100%);
        padding: 30px;
        border-radius: 45px;
        box-shadow: 15px 15px 25px 0px rgba(0, 0, 0, 0.25);
        background-color:rgba(255,255,255,0.93);
        margin: 0 30px 30px 0;
        z-index: 1;
    }
}


@media only screen AND (max-width: 700px) {

    div#disciplines{
        width:100%;
        margin:auto;
    }
    div#article{
        width:95%;
    }
    div#disciplines article {
        flex: 0 0 calc(100%);
        padding: 30px;
        border-radius: 45px;
        box-shadow: 15px 15px 25px 0px rgba(0, 0, 0, 0.25);
        background-color:rgba(255,255,255,0.93);
        margin: 0 30px 30px 0;
        z-index: 1;
    }
}

@media only screen AND (max-width: 500px) {

    #navtest li:first-of-type {
        margin-right: 13%;
    }

}