body {margin: 0;
    background-color: rgb(15, 118, 192);
    min-height: 100%;
}


 html {
     min-height: 100%;
 }

* {
    box-sizing: border-box;
}


.row::after {
    content: "";
    clear: both;
    display: block;
}


[class*="col-"] {
    float: left;
    padding: 15px;
}

#page{

    margin: auto;
    width:80%;
    text-align: center;
}



.header {
    background-color: rgb(0,0,127);
    color: #ffffff;
    padding: 5px;
}

.imgheader {
    margin :  auto ;
    display:block ;
    border-radius:30%;
    opacity: 0.9;
    width : 30%;
}

.menu ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;

}
.menu li {
    margin-bottom: 7px;
    background-color: rgb(15,15,129);
    color: #ffffff;
    /*box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); */
}




.aside {

    padding: 15px;
    color: #fff;
    text-align: center;
    font-size: 15px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
    background: -webkit-linear-gradient(left, rgb(15, 118, 192), rgb(15,118,255)); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(to right, rgb(15, 118, 192), rgb(15,118,255)); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(to right, rgb(15, 118, 192), rgb(15,118,255)); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, rgb(15, 118, 192), rgb(15,118,255)); /* Standard syntax (must be last) */

}
.footer {
    background-color: rgba(15, 118, 192, 0.68);
    color: #ffffff;
    text-align: center;
    font-size: 12px;
    padding: 15px;

}

.menu li a {
    display: block;
    color: white;
    text-align: center;
    text-decoration: none;
}


.menu li a:hover:not(.active) {
    background-color: rgba(68, 11, 222, 0.94);
}

.menu li a.actif {
    background-color: #1247af;
}


/* For desktop: */
.col-1 {width: 8.33%;}
.col-2 {width: 16.66%;}
.col-3 {width: 15%;}
.col-4 {width: 33.33%;}
.col-5 {width: 41.66%;}
.col-6 {width: 70%;
background-color: rgb(15, 118, 192);}
.col-7 {width: 58.33%;}
.col-8 {width: 66.66%;}
.col-9 {width: 75%;}
.col-10 {width: 83.33%;}
.col-11 {width: 91.66%;}
.col-12 {width: 100%;}






#homeSlideShow{
    margin: auto  ;
    display : block  ;
    height:300px ;
}


ul.bottomnav{
    list-style-type: none;
    margin: 0 auto;
    display : table ;
    width:80% ;
    padding :0 ;
    overflow: hidden;
    top:  0 ;
}

ul.bottomnav li {
    width : auto ;
    display: table-cell
}



ul.bottomnav li a {
    display: block;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    color: #ffffff;
}



ul.topnav li {
    width : auto ;
    border-right: 1px solid #111;
    display: table-cell

}









ul.topnav li.right {float: right;}

@media screen and (max-width: 600px){
    ul.topnav li.right,
    ul.topnav li {float: none;}
}


.mySlides img {
    display : block ;
    margin : auto ;
    width : inherit ;
}

div.w3-content img{
    margin : auto ;
    margin-top: 40px ;
    max-width: 100%;
    max-height: 100% ;
}



#content{

    margin: 0 auto;
    width : 80% ;
}


#contentContact{
    height : auto ;
    margin: 0 auto;
    width : 80% ;
}


#contactUs{
    width : 100% ;
    margin : auto;
    height : auto;
    text-align: center;
}



#contactDetails{
    float:right ;
    width:49%;
    margin-left: 10px;
    border-style: solid;
    border-width: 2px ;
    margin-bottom: 10px;
    height:800px;
}


#formContact{
    max-width:100%;
    margin-rigth: 10px;
    border-style: solid;
    border-width: 2px ;
    margin-bottom: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

#contactLocation{
    float:left ;
    width:49%;
    margin-left: 10px;
    border-style: solid;
    border-width: 2px ;
    margin-bottom: 10px;

}

.imgs{
    width:30px;
    height:30px;

}
.error {color: #FF0000;}

.folderSlides {display:none;}


.bordure {
    margin : auto ;
    width : 80% ;
    border-bottom:1px solid black;
    margin-top: 10px;
}


#contentImport{

    margin:  auto;
    width : 100% ;
    margin-top: 20px ;
}


#photoLink{
    max-width:100%;
    margin: 5px;
    float:left ;
    text-align: center;
}


@media only screen and (max-width: 768px) {
    /* For mobile phones: */
    [class*="col-"] {
        width: 100%;
    }

    #imgMySlides {
        border-radius:30%;
        max-width : 100% ;
    }

    #contactUs{
        max-width : 100% ;f
    }



    #photoLink{
        margin: 5px ;
        max-width : 100% ;
        display: block ;


    }
    #formContact{
        max-width: 100%;
    }

}


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



    #photoLink{
        float:inherit;


    }

}