/**
* PROJET   : PAGE SITE WEB : STYLE PAGE
* AUTEUR   : Anne Potier
* DATE     : 2026
*/


body
{
    max-width: 1300px;
    margin: 0 20px;
    /*margin-top: 180px;
    border: blue 1px solid;*/
}

footer
{
    font-size: 11px;
    text-align: center;
    padding: 2px;
    margin-top: 15px;
    border-top: 2px solid #03669F;
}
 
header
{
    background-color:#fff; /**/
    border-bottom: 2px  #03669F solid;
    width:  98%;
    margin: 0 auto; 
    top: 0;  
    left: 0px;  
    right: 0px;  
    position: fixed; 
    height: 115px;
    z-index: 100;
}

main
{
   margin-top:150px;
}

#et-secondary-nav
{
    position: fixed;
    top: 0px;
    right: 2%;
}

#et-top-navigation 
{
    position: fixed;
    top: 30px;
    right: 2%;
}

#et-secondary-nav nav,
#et-top-navigation li
{
    display: inline-block; 
    border: 2px solid  #03669F;
    border-radius: 10px;
    padding: 3px; ;
} 

.logo
{
    position: fixed;
    top: 2px ;
}


.module_titre
{
    background-color: white; 
    border-bottom: 3px  #03669F solid;
    border-radius: 25px ;
    width: auto;
    top: 70px;
     
    left: 180px;
    position: fixed; 
     
    z-index: 520;
    padding:  2px 15px; 
    text-transform: uppercase;
    
}
 
.retour_haut :after
{
    content: '\219F'; /* fleche  219F 21DE 2259 */
    background-color: #03669F  ;
    border-radius: 50%;
    width: auto;
    top: 80%;
    right: 2%;
    position: fixed; 
    height: auto;
    z-index: 520;
    padding: 10px;
    color:#fff;
    font-size: 30px;
} 

#top-header
{
    /*border:3px solid orange;  
    height: 30px;*/
    padding: 0;
    padding-right: 10%;
}


.menu-up {
    display: block;
    animation: animate-menu 0.5s ease-in-out forwards;
}

a 
{
    /*padding:1% ;
    font-size: 12px;*/
    text-transform: uppercase;
    text-decoration: none; 
}

nav ul li
{
    display: inline-block; 
    font-size: 11px;
    text-transform: uppercase;
    text-decoration: none;
    padding-right: 11px;
}



.page-contenu
{
    border: solid 2px  #03669F ;  /*-right*/
    width: 600px;
    position: relative;
    float: left; 
    padding: 5px;
}

.page-logo
{
    width: 250px;
    position: relative;
    float: left; 
    padding: 5px;
    top: 20px;
}

.page-titre
{
    /*border-bottom: solid 2px blue ; */
    max-width: 500px;
    position: relative;  
    float: left; 
    padding: 25px;
}



 /* ACCORDEON */

#accordeon
{ 
    /*border: 5px solid blue ;*/
    width: 80%;
    margin: 5px;
}

.accordeon {
    margin: 0px;
    background-color: #eee;
    color: #444;
    cursor: row-resize ; /* fleche+taille */
    padding: 18px;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}


.accordeoncontenu {
    padding: 0 18px;
    background-color: #ccc;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.2s ease-out;
}

.active, .accordeon:hover {
    background-color: #ccc;
}

.accordeon:after { 
    content: '\25BC'; /* fleche bas */
    float: right;
    color: #03669F;
    font-weight: 900;
    margin-left: 5px;
    font-size: 18px;
}

.active:after {
    content: '\25B2'; /* fleche haut */
}