html 
{
    height: 100%; 
    width: 100%;
}

body
{
    width: 100%;
    padding:0px;
    margin:0px;
    height: auto;
    background-color:Transparent;
    background: transparent url('/images/background-fleur_body.jpg') repeat 100% !important;
}

/* Début plus petit écran 320px à 440px*/
#cadreFenetre
{
    position:absolute;
    width: 100%;
    max-width: 440px;
    background-color: Transparent;
    display:block;
    padding:0px;
    margin:0px;
}

#cadreSite 
{
    margin:0px;
    padding:0px;
    position:absolute;
    z-index: 10;
    width:100%;
}
#sectionEntete
{
    margin:0px;
    padding:0px;
    height: 110px;
    width: 100%;
    background: transparent url("/images/header-top.jpg") no-repeat 50% !important;
}
.entete 
{
    width: 100%;
    height: 100%;
    margin: auto;
    display: block;
}
#logoGauche
{
    position:absolute;
    z-index:20;
    top: 5px;
    width: 70%;
    max-width: 240px;
    height: 100%;
    max-height: 100px;
}
#logoDroite
{
    position:absolute;
    z-index:15;
    width: 100%;
    height: 60px;
    top: 8px;
}
#divLogoTerapoMedik 
{
    position:absolute;
    z-index:20;
    width: 85%;
    top: 55px;
}
#logoTerapoMedik 
{
    width: 90px;
}
#sectionMenu 
{
    width: 100%;
    height: 25px;
    display:inline-block;
    background-color:#4a3e0f;
    vertical-align: middle;
}
#sousSectionMenu 
{
    width: 100%;
    text-align:center;
}
#sousSectionMenu ul
{
    list-style: none;
    vertical-align: middle;
    margin: 1px;
    margin: 0px;
    padding: 0px;
}
#sousSectionMenu li.separateurMenu
{
    cursor: text;
    border-right: 1px solid #9aac26;
    font-size: 12px;
    margin-right: 3px;
}
#sousSectionMenu li
{
    color: White;
    display: inline-block;
    font-size: 14px;
    margin-left: 0px;
    cursor: pointer;
}
#sousSectionMenu li a
{
   color: #ffffff; 
   text-decoration:none;
}
.textMenu
{
    position:absolute;
    display:inline;
    padding-top: 5px;
    text-align:center;
    width: 130px;
    color:#53711b;
}

.divBoutonMenu
{
    display:inline;
    cursor: pointer;
}

#sectionCentre 
{
    width: 100%;
    height: 100%;
    display: inline-block;
    margin:0px;
    padding: 0px;
    background-color: Transparent;
    background-repeat: no-repeat;
}

#sectionEnteteSousTitre1
{
	text-align: center;	
	width: 90%;
	font-size:22px;
	margin-bottom:10px;
	color:Green;
}
#sectionEnteteSousTitre2
{
	text-align: center;	
	width: 90%;
	font-size:18px;
	margin-bottom:10px;
	color:Green;
	font-weight:bold;
}

/* Fin plus petit écran*/

/* Début écran 441px à 580px*/
@media only screen and (min-width: 441px) and (max-width: 580px)
{
    #cadreFenetre
    {
        max-width: 580px;
    }
    #sectionEntete
    {
        height: 140px;
    }
    #logoGauche
    {
        top: 5px;
        width: 60%;
        max-width: 285px;
        height: 100%;
        max-height: 130px;
    }
    #logoDroite
    {
        width: 100%;
        height: 90px;
        
    }
    #divLogoTerapoMedik 
    {
        width: 80%;
        top: 60px;
    }
    #logoTerapoMedik 
    {
        width: 120px;
    }
    #sectionMenu 
    {
        height: 35px;
    }
    #sousSectionMenu 
    {
        width: 100%;
        text-align:center;
    }
    #sousSectionMenu ul
    {
        margin: 3px;
        padding: 0px;
    }
    #sousSectionMenu li.separateurMenu
    {
        font-size: 16px;
    }
    #sousSectionMenu li
    {
        font-size: 20px;
        margin-left: 0px;
        
    }
}
/*Fin  */

/* Début écran 581px à 725px*/
@media only screen and (min-width: 581px) and (max-width: 725px)
{
    #cadreFenetre
    {
        max-width: 725px;
    }
    #sectionEntete
    {
        height: 180px;
    }
    #logoGauche
    {
        width: 60%;
        max-width: 390px;
        height: 100%;
        max-height: 170px;
    }
    #logoDroite
    {
        width: 100%;
        height: 100px;
    }
    #divLogoTerapoMedik 
    {
        width: 80%;
        top: 80px;
    }
    #logoTerapoMedik 
    {
        width: 130px;
    }
    #sectionMenu 
    {
        height: 35px;
    }
    #sousSectionMenu 
    {
        width: 100%;
        text-align:center;
    }
    #sousSectionMenu ul
    {
        margin: 3px;
        padding: 0px;
    }
    #sousSectionMenu li.separateurMenu
    {
        font-size: 16px;
    }
    #sousSectionMenu li
    {
        font-size: 20px;
        margin-left: 0px;
    }
    .textMenu
    {
        display:block;
        width: 30%;
    }
    #sectionCentre 
    {
        width: 100%;
        vertical-align: top;
    }
}
/*Fin */

 /* Début écran 726px à 990px*/
@media only screen and (min-width: 726px) and (max-width: 990px) {
   
    #cadreFenetre
    {
        max-width: 990px;
    }
    #sectionEntete
    {
        height: 180px;
    }
    .entete 
    {
        width: 95%;
        margin: auto;
        display: block;
    }
    #logoGauche
    {
        width: 60%;
        max-width: 390px;
        height: 100%;
        max-height: 170px;
    }
    #logoDroite
    {
        width: 90%;
        height: 120px;
    }
    #divLogoTerapoMedik 
    {
        width: 75%;
        top: 80px;
    }
    #logoTerapoMedik 
    {
        width: 130px;
    }
    #sectionMenu 
    {
        height: 35px;
    }
    #sousSectionMenu 
    {
        width: 100%;
        text-align:center;
    }
    #sousSectionMenu ul
    {
        margin: 3px;
        padding: 0px;
    }
    #sousSectionMenu li.separateurMenu
    {
        font-size: 16px;
    }
    #sousSectionMenu li
    {
        font-size: 20px;
        margin-left: 0px;
    }
    .textMenu
    {
        display:block;
        width: 30%;
    }
    #sectionCentre 
    {
        width: 100%;
        display: inline-block;
        margin:0px;
        padding: 0px;
        text-align: center;
    }
}
/*
 * Début plus grand écran (991px et plus).
 */
@media only screen and (min-width: 991px)
{
    #cadreFenetre
    {
        max-width: 100%;
    }
    #sectionEntete
    {
       height: 178px;
    }
    .entete 
    {
        width: 800px;
        margin: auto;
        display: block;
    }
    #logoGauche
    {
        width: 60%;
        max-width: 390px;
        height: 100%;
        max-height: 170px;
    }
    #logoDroite
    {
        width: 800px;
        height: 160px;
    }
    #divLogoTerapoMedik 
    {
        width: 580px;
        top: 95px;
    }
    #logoTerapoMedik 
    {
        width: 150px;
    }
    #sectionMenu 
    {
        width: 100%;
        height: 35px;
        display:inline-block;
        background-color:#4a3e0f;
        vertical-align: middle;
    }

    #sousSectionMenu 
    {
        width: 90%;
        text-align:center;
    }

    #sousSectionMenu ul
    {
        margin:2px;
    }
    #sousSectionMenu li.separateurMenu
    {
        font-size: 18px;
    }
    #sousSectionMenu li
    {
        font-size: 24px;
        margin-left: 10px;
    }
    #sectionCentre 
    {
        width:100%;
        display: block;
        margin:0px;
        padding: 0px;
        text-align: center;
        height: 400px;
    }
}