/* css */


/* Page */
html {
    font-size: 100%;  /* normalement inutile : mais contre bug dans I.E.*/
}
body {
    background-image:url('img/logoFond.png') ;
    background-repeat: repeat;
    margin: 0;
    padding: 10px 20px;
    font-family: Verdana, Tahoma, sans-serif;
    font-size: .8em;
    line-height: 1.25;
    color : black;
}

#global {
    width: 1180px;
    margin-left: 10%;
    margin-right: 10%;

}
.menuhoriz {
    width : 1180px;
    height: 50px;
    text-align: right;
    background-color: #d4f2fa;
    font: 1.1em sans-serif;
    color: #000066
}

.menuhoriz ul{
    display: table;
    width: 1200px;
    margin: 3px auto;
    padding: 0;
    background: dodgerblue;
    background: linear-gradient(deepskyblue, dodgerblue);
    background: -webkit-linear-gradient(deepskyblue, dodgerblue);
    background:    -moz-linear-gradient(deepskyblue, dodgerblue);
    background:     -ms-linear-gradient(deepskyblue, dodgerblue);
    background:      -o-linear-gradient(deepskyblue, dodgerblue);
    background:         linear-gradient(deepskyblue, dodgerblue);
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3),
    0 3px 5px rgba(0, 0, 0, .2),
    0 5px 10px rgba(0, 0, 0, .2),
    0 20px 20px rgba(0, 0, 0, .15);
}
.menuhoriz ul li{
    display: table-cell;
}

.menuhoriz ul li a{
    display: block;
    text-align: center;
    color: rgba(0, 0, 0, .7);
    text-decoration: none;
    padding: 8px 8px 17px 8px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .4);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset,
    0 -1px 0 hsl(210, 100%, 32%) inset,
    0 -2px 0 hsl(210, 100%, 38%) inset,
    0 -3px 0 hsl(210, 100%, 44%) inset,
    0 -4px 0 hsl(210, 100%, 50%) inset,
    0 -5px 0 hsl(210, 100%, 60%) inset;
    transition: all .3s .1s;
    position: relative;
}


.menuhoriz ul li a::before{
    content: '';
    position: absolute;
    left: 50%;
    bottom: 9px;
    margin-left: -2px;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(0, 0, 0, .5);
}

.menuhoriz ul li:first-child a{
    border-radius: 3px 0 0 3px;
}
.menuhoriz ul li:last-child a{
    border-radius: 0 3px 3px 0;
}

.menuhoriz ul li a:hover, ul li a:focus{
    background: rgba(255,255,255,.2);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .7) inset,
    0 -1px 0 hsl(210, 100%, 42%) inset,
    0 -2px 0 hsl(210, 100%, 48%) inset,
    0 -3px 0 hsl(210, 100%, 54%) inset,
    0 -4px 0 hsl(210, 100%, 60%) inset,
    0 -5px 0 hsl(210, 100%, 70%) inset;
    padding: 8px 25px 17px 25px;
    transition: all .3s .0s;
}

.menuhoriz ul li a:hover::before, ul li a:focus::before{
    background: white;
    box-shadow: 0 0 2px white,
    0 -1px 0 rgba(0, 0, 0, .4);
}

#entete img{
    /*float: left;
    margin: 0 auto;*/
    /*border: 5px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px; */
    marge-bottom:15px;
}

/* Bloc central */

#centre {

    width: 100%;
    overflow: hidden;
}

.infox {
    width: 1100px;
    height: 30px;
    font-size: 20px;
    font-weight: bold;
    text-shadow: 2px 2px 4px black;
    /* height: 1600px; */
    background-color: #E7E7E7;
    color: #000066
}


/* Contenu principal  */
#principal {
    float: left;
    width: 1100px;
    padding: 10px 20px;
    background: #eeeeee;
    border: 5px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    font-size: 15px;
}



#principal.first-child{
    margin-top: 10px;
}

#principal p, #principal li {
    line-height: 1.5;
}


#principal h1.titre0 {
    display: inline;
    padding:  2px 10px 2px 5px;
    margin-left: 10px;
    border-left: 5px solid #458eff;
    border-bottom:  2px dotted #458eff;
    font-variant: small-caps;
    background: #ffffff none;
    color: #006699;
    letter-spacing: 0.3em;
}
#principal h2.titre1{
    display: inline;
    padding:  2px 10px 2px 5px;
    margin-left: 10px;
    border-left: 5px solid #458eff;
    border-bottom:  2px dotted #458eff;
    font-variant: small-caps;
    background: #ffffff none;
    color: #006699;
}
#principal h3.titre2 {
    display: inline;
    padding:  2px 10px 2px 5px;
    margin-left: 10px;
    border-left: 5px solid #458eff;
    border-bottom:  2px dotted #458eff;
    /*font-variant: small-caps;*/
    background: #ffffff none;
    color: #006699;
}
#principal h4.titre3 {
    display: inline;
    padding:  2px 10px 2px 5px;
    margin-left: 10px;
    border-left: 5px solid #458eff;
    border-bottom:  2px dotted #458eff;
    /*font-variant: small-caps;*/
    background: #ffffff none;
    color: #006699;
}

#principal h5.titre4 {
    display: inline;
    padding:  15px 10px 2px 5px;
    margin-left: 10px;
    border-left: 5px solid #458eff;
    border-bottom:  2px dotted #458eff;
    /*font-variant: small-caps;*/
    background: #ffffff none;
    color: #006699;
}
/* ----- Ligne de séparation horizontale ----- */


#orthoFle {
    width: 630px;
    margin-right: 1px;
    padding: 0 10px 10px 10px;
    text-align:left;
    background: rgba(255, 253, 164, 0.51);
    border: 5px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    font-size: 1.4em;
}

#orthoFle h1{
    color: #FFFFFF;
    background-color: #ff030f;
    font-size: 1em;
    text-transform:uppercase;
    text-align: center;
}


hr{
    border:  none;
    background-color: #006699;
    height: 1px;
    width: 70%;
    text-align: center;
}
#principal p.image {
    float: left;margin: 0 6px 6px 0;
    border:  none;
}
#principal .zone_exo{
    line-height: 5px;
}

div.tableCenter {
    border: none;
    text-align: center;
}
/* Affichage du copyright */


#copyright {

    width:1180px;
    margin-left: 10%;
    margin-right: 10%;
    height: 30px;
    padding-top: 9px;
    text-align: center;
    font-size: 15px;
    font-weight: bold;
    text-shadow: 1px 1px 2px black;
    background: #eeeeee;
    border: 5px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color:#eeeeee;
    color: #000066;
}
#login {
    margin-left: 720px;
    margin-right: 1px;
    padding: 0 10px 10px 10px;
    background: #eeeeee;
    border: 5px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    font-size: .85em;
}


/* ************************ échauffement ********************** */

#oral h1, #oralEcrit h1, #principes h1, #exoFinal h1 {
    color: #FFFFFF;
    background-color:#1D6893;
    font-size: 1em;
    text-transform:uppercase;
    text-align: center;
}
#oral{
    width: 1050px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: rgba(247, 255, 152, 0.5);

}
#oralEcrit{
    width: 1050px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: rgba(209, 255, 253, 0.5);

}

#principes {
    width: 1050px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: rgba(209, 255, 253, 0.5);

}


#exoFinal {
    width: 1050px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: rgba(147, 37, 14, 0.22);


}


/*               */



/* ************************ exemple ********************** */
.exp{
    padding-left: 50px;
    color: #93250e;
    font-style: italic;
    font-weight: bold;
}
.exemple {
    width: 1000px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #cccccc;
    font-style: italic;
    font-color:#1D6893;
}



.cours {
    width: 1000px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: rgba(247, 255, 152, 0.5);

}
.important {
    width: 1000px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: rgba(250, 126, 122, 0.2);
}

.regle {
    width: 1000px;
    padding: 0 10px 10px 10px;
    border: 4px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #e0bbac;
}
.analysons {
    width: 1200px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #e0fae6;
}
.attention {
    width: 1000px;
    padding: 0 10px 10px 10px;
    border: 4px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #b5dcf0;
}

.histoire {
    width: 1000px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #ffd6a9;
}



.informe {
    width: 1000px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #abffb5;
}

.sono{
    width: 350px;
    padding: 0 10px 10px 10px;
    border: 4px solid #1d5d93;
    position: relative; /* on positionne le conteneur */
    margin-left: auto;
    margin-right: auto;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: rgba(250, 255, 187, 0.69);
    text-align: center;
}

.sonoExo{
    width: 400px;
    padding: 0 10px 10px 10px;
    border: 4px solid #1d5d93;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #f8ffbe;
    text-align: center;
}

.reflechissons {
    width: 500px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: #b7fafa;
}
.notons {
    width: 500px;
    padding: 0 10px 10px 10px;
    border: 2px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: rgba(134, 235, 170, 0.38);
}



.exercice {
    position: relative; /* on positionne le conteneur */
    margin-left: auto;
    margin-right: auto;
    width: 400px;
    text-align: center;
    padding: 20px 10px 10px 10px;
    border: 6px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    background-color: rgba(107, 199, 255, 0.27);
}
/* Contenu secondaire */
#secondaire {
    margin-left: 720px;
    margin-right: 1px;
    padding: 0 10px 10px 10px;
    background: #eeeeee;
    border: 5px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
}
/* Contenu secondaire */

#feuilleter {
    margin-left: 720px;
    margin-right: 1px;
    padding: 0 10px 10px 10px;
    text-align:center;
    background: #eeeeee;
    border: 5px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    font-size: .85em;
}

#info {
    margin-left: 720px;
    margin-right: 1px;
    padding: 0 10px 10px 10px;
    text-align:center;
    background: #eeeeee;
    border: 5px solid #1D6893;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    font-size: .85em;
}


#feuilleter h1, #secondaire h1, #info h1, #dateRDV h1 {
    color: #FFFFFF;
    background-color:#1D6893;
    font-size: 1em;
    text-transform:uppercase;
    text-align: center;
}

/* base.css */
/* Style de base pour le texte et les principaux éléments*/
em {

    font-weight: bold;
    color: #1D6893;
}

b {
    font-style: italic;
    color: #540a0c;
}
/* Pour cacher au lecteur d'écran*/
.cache {
    visibility: hidden;
}

.cacheLectAn {
    display : none;
}

.cacheLectAus {
    aria-hidden :"false";
}

.verbergen {
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
}
/* Pour cacher sauf au lecteur d'écran*/
i {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

strong {
    font-style: italic;
    font-weight: bold;
    color: #d1191d;
}


/* Listes */
ul, ol {
    margin: .75em   0 .75em 24px;
    padding: 0;
}
ul {
    list-style: square;
}
li { margin: 0;
    padding: 0;
}


/* Paragraphes */
p{
    margin: .75em 0;
}
li p, blockquote p {
    margin: .5em 0;
}
/* Citations */
blockquote, q {
    font-size: 1.1em;
    font-style: italic;
    font-family: Georgia, "Bitstream Vera Serif", Norasi, serif;
}

blockquote {
    margin: .75em 0 .75em 24px;
}

cite {
    font-style: italic;
}

/* Liens */
a {
    color: #0000cc;
    text-decoration: underline;
}

a:hover, a:focus {
    color: #93250e;

}
/* --- STYLES POUR IMAGES et PHOTOS --- */
a img {
    border: none; /* Pour éviter les bordures d'office disgracieuses*/
}
.photo {
    background-color:#fafbfc;
    border:1px solid #b0b0b0;
    margin: 0 0 10px 10px;
    padding: 5px;
}
.photoadroite {
    border:  5px solid #b0b0b0;
    margin:  5px 6px 15px 6px;
}

.photoagauche {
    border: 5px solid #b0b0b0;
    float : left;
    margin: 5px 15px 6px 15px;
}
/* ---- photo à gauche, encadrée par texte à droite----*/
.imageflottante{
    float: left;
    margin: 10px 10px 10px 10px;
}
.imageflottanteDte{
    float: right;
    margin: 10px 10px 10px 10px;
}
.dessous
{
    clear: both;
}
div#photoflot p{
    margin: 0;
    padding: 0;
    text-align: justify;
}
div#photoflot img{
    float:left;
    background-color:#fafbfc;
    border: 1px solid #b0b0b0;
    margin: 10px 10px 10px 10px;
    padding: 5px;
}
/* ---- photo à droite, encadrée par texte à gauche----*/
div#centrer{
    text-align: center;
}

.rightimg {float:right;
    background-color: #E9E9E9;
    margin: 10px 10px 10px 10px;
}
.leftimg {float:left;
    background-color: #E9E9E9;
    margin: 10px 10px 10px 10px;}

.centreimg {
    background-color: #E9E9E9;
    margin: 10px 10px 10px 10px;}

.clear {
    clear: both;
}
/* ============================================================
                    boutons
   ============================================================ */


.a_btn {
    background-color: #3bb3e0;

    padding:10px;
    position:relative;
    font-family: 'Open Sans', sans-serif;
    font-size:12px;
    text-decoration:none;
    color: #FFFFFF;
    background-image: linear-gradient(bottom, rgb(44,160,202) 0%, rgb(44,160,202) 0%);
    box-shadow: inset 0px 1px 0px #2ab7ec, 0px 6px 0px #090869;
    border-radius: 5px;
}

.a_btn:active {
    top:7px;
    background-image: linear-gradient(bottom, rgb(44,160,202) 100%, rgb(44,160,202) 0%);
    box-shadow: inset 0px 1px 0px #2ab7ec, inset 0px -1px 0px #032b3a;
    color: #156785;
    text-shadow: 0px 1px 1px rgba(255,255,255,0.3);
    background: rgb(44,160,202);
}

.a_btn::before {
    background-color:#072239;
    content:"";
    display:block;
    position:absolute;
    width:100%;
    height:100%;
    padding-left:2px;
    padding-right:2px;
    padding-bottom:4px;
    left:-2px;
    top:5px;
    z-index:-1;
    border-radius: 6px;
    box-shadow: 0px 1px 0px #fff;
}

.a_btn:active::before {
    top:-2px;
}


.a_btn2 {
    background-color: #e00614;

    padding:10px;
    position:relative;
    font-family: 'Open Sans', sans-serif;
    font-size:12px;
    text-decoration:none;
    color: #FFFFFF;
    background-image: linear-gradient(bottom, rgb(231, 51, 82) 0%, rgb(202, 23, 33) 0%);
    box-shadow: inset 0px 1px 0px #e74761, 0px 6px 0px #090869;
    border-radius: 5px;
}

.a_btn2:active {
    top:7px;
    background-image: linear-gradient(bottom, rgb(231, 51, 82) 100%, rgb(202, 23, 33) 0%);
    box-shadow: inset 0px 1px 0px #e74761, inset 0px -1px 0px #090869;
    color: #fdff10;
    text-shadow: 0px 1px 1px rgba(208, 250, 221, 0.02);
    background: rgb(202, 23, 33);
}

.a_btn2::before {
    background-color: #fffda4;
    content:"";
    display:block;
    position:absolute;
    width:100%;
    height:100%;
    padding-left:2px;
    padding-right:2px;
    padding-bottom:4px;
    left:-2px;
    top:5px;
    z-index:-1;
    border-radius: 6px;
    box-shadow: 0px 1px 0px #fff;
}

.a_btn2:active::before {
    top:-2px;
}


.boutonDr {
    float: right;
    /* width: 300px;*/
    margin: 0;
}

/* ============================================================
                    Tableau :
   ============================================================ */
.montableau {

    width: 70%;
    margin: 0 auto;
    font: bold 1.4em 'trebuchet MS','Lucida Sans', Arial;
    border-collapse: separate;
    border-spacing: 0;
    text-shadow: 0 1px 0 #fff;
    color: #2a2a2a;
    background: #fafafa;
    background-image: -moz-linear-gradient(top, #fff, #eaeaea, #fff);
    /*background-image: -webkit-gradient(linear,center bottom, center top,from(#fff),color-stop(0.5, #eaeaea),to(#fff));*/

}
.montableau td {
    height:50px;
    line-height: 50px;
    padding: 0 20px;
    border-bottom: 1px solid #cdcdcd;
    box-shadow: 0 1px 0 white;
    -moz-box-shadow: 0 1px 0 white;
    -webkit-box-shadow: 0 1px 0 white;
    white-space: nowrap;
    text-align: center;
}



/* Body */
.montableau tbody td {
    text-align: center;
    font: normal 14px Verdana, Arial, Helvetica, sans-serif;
    width: 150px;
}

.montableau tbody td:first-child {
    width: auto;
    text-align: left;
}

.montableau tbody td:last-child {
    width: auto;
    text-align: center;
    background: #e7f3d4;
    background: rgba(13, 129, 243, 0.30);
}
.montableau td:nth-child(2), .montableau td:nth-child(3){
    background: #efefef;
    background: rgba(144,144,144,0.15);
    border-right: 1px solid white;
}
.montableau td:nth-child(6){
    background: #e7f3d4;
    background: rgba(184,243,85,0.3);
}

/* Header */
.montableau thead td {
    font: bold 0.8em 'trebuchet MS','Lucida Sans', Arial;
    -moz-border-radius-topright: 10px;
    -moz-border-radius-topleft: 10px;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-top:1px solid #eaeaea;
}

.montableau thead td:first-child {
    border-top: none;
}

/* Footer */

.montableau tfoot td {
    font: bold 0.9em Georgia;
    -moz-border-radius-bottomright: 10px;
    -moz-border-radius-bottomleft: 10px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    border-bottom:1px solid #dadada;
}

.montableau tfoot td:first-child {
    border-bottom: none;
}
