body
{
margin: 10px 0 ;
padding: 0 ;
text-align: center ;
font: 17px helvetica, arial, Trebuchet MS, sans-serif ;
background : #100F17; #212321;#25333B; #0C2D3F; /*#610101; #7B070F; #580414; #383F44;*/
color:black;
}


button, input{
font:16px helvetica, arial, Trebuchet MS, sans-serif ;
border-radius : 5px 5px 5px 5px;
}

button:hover,input:hover{
color:blue;
background : white;
}

#enhaut{
top:250px;
left:87%;
left:calc(50% + 505px);
position : fixed;
}

#titre
{
-moz-border-radius : 25px 25px 25px 25px;
-webkit-border-radius : 25px 25px 25px 25px;
-khtml-border-radius : 25px 25px 25px 25px;
-ms-border-radius : 25px 25px 25px 25px;
border-radius : 25px 25px 25px 25px;
height: 200px ;
border : 1px solid black ;
background: url(images/bandeau.jpg) no-repeat center top ;
width : 990px;
margin: 5px auto;
}

#titre span
{
display : none;
}

#connexion
{
position: absolute;
top: 0px;
margin: 0 0 0 80px;
padding : 2px;
text-align: center ;
border: 1px solid navy ;
background: #4E504E ;
color: #FDBF75;
}

#connexion a
{
color: white;
}

#super
{
width : 1060px;
margin : auto ;
/*border: white 1px solid;*/
}

#conteneur
{
-moz-border-radius : 15px;
-webkit-border-radius : 15px;
-khtml-border-radius : 15px;
-ms-border-radius : 15px;
border-radius : 30px 30px 25px 25px; /*top right bottom left */
width : 1000px;
margin : 28px auto ;
border: 4px solid #BECFED; /*2px solid #0B1747;/*#76ABDF;*/
background : #100F17; /*#3C4556; /*#100F17; #F3E5E6/*#FBDDB1;*/
}

#contenu
{
background : #454C23; /*nécessaire pour ie8*/
-moz-border-radius : 15px;
-webkit-border-radius : 15px;
-khtml-border-radius : 15px;
-ms-border-radius : 15px;
border-radius : 15px;
border: 1px solid black ;
margin : 5px 10px 10px 10px;
padding : 15px;
/*background-image:-moz-linear-gradient(120deg, #3B74E5,#0A112B); */
background-image:-moz-linear-gradient(120deg, #3B74E5,#BECFED);
background-image:-webkit-linear-gradient(-60deg, #787280,#BECFED);
background-image:-o-linear-gradient(120deg, #3B74E5,#0A112B);
background-image:linear-gradient(120deg, #787280,#BECFED);
box-shadow: 3px 3px 5px black;
}

#contenu h2
{border-radius :  5px 5px 5px 5px;
margin : 0;
padding-left: 45px ;
line-height: 45px ;
font-size: 3em ;
/*background:url(images/lune2.gif) no-repeat left bottom;*/
background:url(images/starW2.gif) no-repeat left bottom;
color: #011933;
border-bottom: 1px dotted yellow ;
text-align:left;
width : 60%;
text-shadow: 1px 1px 1px pink;
}

.modif
{
margin : 0;
margin-top:50px;
margin-bottom:50px;
padding-left: 40px ;
line-height: 35px ;
font-size: 3em ;
color: #011933;
border-bottom: 1px dotted #9b2 ;
text-align:left;
width : 60%;
text-shadow: 1px 1px 1px #FCAF81;
}

#pied
{
margin: 0px 0px 0px 0px ;
padding-right: 50px ;
padding-bottom: 15px ;
line-height: 25px ;
text-align: right ;
/*color: #8a0 ;*/
color: #BECFED;
}

#pied a
{
color : #BECFED;
}

#menu
{
list-style-type: none ;
margin: 0 auto;;
padding : 0px;
}

#menu>ul {
margin: 0;
padding: 0;
list-style:none;
}

#menu>li {
border: 1px solid #100F17;
-moz-border-radius : 5px;
-webkit-border-radius : 5px;
-khtml-border-radius : 5px;
-ms-border-radius : 5px;
-o-border-radius : 5px;
border-radius : 5px;
position: relative;
display: inline-block;
vertical-align: top;
text-align: center;
background:#383F44;
color: #FDBF75;
height: 75px;
width: 84px;
margin: 0 2px 10px 6px;
padding: 0;
overflow: hidden;
/* a virer */
box-shadow: 2px 2px 2px #76ABDF;
-moz-box-shadow: 2px 2px 1px #76ABDF;
-webkit-box-shadow: 2px 2px 1px #76ABDF;
/* a virer */
}

#menu li a {
width: 100px ;
line-height: 35px ;
font-family: arial;
font-size: 0.9em ;
font-weight: normal;
color: white ;
text-decoration: none ;
border-bottom: 2px solid #FDBF75 ;

}

#menu>li>ul {
font-size: 0.7em;
margin: 0px 0px 0px 8px;
line-height: 1em;
text-align: left;
padding:0;
}

#menu img {
position: absolute;
left: 0;
top: 35px;
border: none;
/* Already working on webkit */
-webkit-transition-property: padding-left;
-webkit-transition-duration: .5s;
-webkit-transition-timing-function: ease-out;

/* When being supported by FF */
-moz-transition-property: padding-left;
-moz-transition-duration: .5s;
-moz-transition-timing-function: ease-out;

/* … and if it s standardised one day (#optimism) */
transition-property: padding-left;
transition-duration: .5s;
transition-timing-function: ease-out;
}

#menu img:hover, img:focus {
padding-left:140px;
}

#menu a
{
color:white;
font-size: 1.2em ;
}


.article
{
margin-top: 5px;
padding-bottom: 5px;
padding-left: 10px ;
padding-right: 10px ;
text-align: left ;
border: 1px solid #002233 ;
background: #C7C4C3; /*#DACCC4;*/
font-size: 1.05em ;
color: black;
border-radius : 10px 10px 10px 10px ;
box-shadow: 2px 2px 5px black;
}

.article ul,ol
{
list-style-type: circle;
margin-left: 0px;
margin-top: 10px;
margin-bottom: 10px;
}

.article li
{
text-decoration: none ;
background: none;
}


.article h3
{
margin : 0;
margin-top: 10px ;
margin-left: 10px ;
margin-bottom : 10px;
color:  #1B2A41; /* #FBDDB1;*/
text-shadow: 1px 1px 1px white;
border-bottom: 2px dashed #025BB5 ;
width : 52%;
}

.article a
{
color: blue ;
text-decoration:none ;
}

.article a:hover
{
color: red;
background : yellow;
}

.article form
{
display:inline;
}


.info form
{
display:inline;
}


/*liste des infos en bas d un article */
.info
{
text-align: right ;
color: #000000 ;
font-size: 0.9em ;
}

.commentaire
{
margin-top: 5px;
padding: 10px ;
border-radius : 10px 10px 10px 10px ;
text-align: left ;
border: 1px solid #828799 ;
background: #A6B7F9; /*#DDEEAA ;*/
font-size: 0.95em ;
}

/* commentaire en attente de publication */
.attente
{
margin-top: 5px;
padding: 10px ;
border-radius : 10px 10px 10px 10px ;
text-align: left ;
border: 1px solid #828799 ;
background: lightgray;
font-size: 0.95em ;
}

.suppression
{
margin-top: 50px;
margin-bottom: 50px;
padding-bottom: 10px;
padding-left: 10px ;
padding-right: 10px ;
text-align: left ;
border: 1px solid #002233 ;
background: white ;
font-size: 1.05em ;
color: blue;
border-radius : 10px 10px 10px 10px ;
}

/* article de classe information */
.information
{
background : #92CAFE; /*nécessaire pour ie8*/
margin-top: 5px;
padding-top: 5px;
padding-bottom: 5px;
padding-left: 10px ;
padding-right: 10px ;
text-align: left ;
border: 1px solid #002233 ;
background-image:-webkit-linear-gradient(-60deg, #92CAFE,#025BB5);
background-image:linear-gradient(60deg, #92CAFE,#025BB5);
font-size: 1.05em ;
color: blue;
border-radius : 10px 10px 10px 10px ;
}

.message
{
width: 600px ;
text-align: left ;
border-radius : 10px 10px 10px 10px ;
border: 2px solid YELLOW ;
background: #EEEEEE ;
padding: 10px 10px 10px 10px;
margin: auto;
box-shadow: 6px 6px 5px black;
}

.message a
{
color: blue ;
}

.message a:hover
{
color: red ;
font-size: 1.2em ;
}

.code{
text-align:left;
background:lightgray;
border:1px black dotted;
border-radius : 15px 15px 15px ; /*top right bottom left */
width:700px;
margin:auto;
padding:15px
}

/* utilise pour l ajout un article par exemple */
.adm{
border:1px white solid;
background-image:-webkit-linear-gradient(-60deg, #92CAFE,#025BB5);
background-image:linear-gradient(60deg, #92CAFE,#025BB5);
}


/* tentative de div a ouverture progressive */
.pourcss{
border-radius : 10px 10px 10px 10px ;
font-size: 1em ;
height:10px;
width:90px;
overflow: hidden;
margin:0 0 0 0;
padding:10px;
transition: 2s ease;
background:darkgrey;
border:1px solid white;opacity:0.3;
}
.pourcss:hover {
width:800px;
height:auto;
padding:10px;
background:white;
border:1px solid black;opacity:1;
}

.gnu{
border-radius : 10px 10px 10px 10px;
font-size: 1.05em ;
height:25px;
width:100px;
overflow: hidden;
margin:0 0 0 0;
padding:0px;
transition: 2s ease;
-webkit-transition:  2s ease;
background:#DACCC4;
border:1px solid black;
opacity:1;
color:  #1B2A41; /* #FBDDB1;*/
text-shadow: 1px 1px 1px white;
}
.gnu:hover {
text-align:left;
font-size: 1em ;
width:95%;
height:100px;
padding:10px;
background:white;
border:1px solid black;opacity:1;
}

.sommaire{
text-align:left;
border-radius : 10px 10px 10px 10px;
font-size: 1.05em ;
height:20px;
overflow-y:hidden;
width:100px;
overflow: hidden;
margin:-30px 0 0 0;
padding:5px;
transition: 2s ease;
background:#DACCC4;
border:1px solid black;
opacity:1;
color:  #1B2A41; /* #FBDDB1;*/
text-shadow: 1px 1px 1px white;
}

.sommaire a{
color:green;
text-decoration:none ;
}

.sommaire:hover {
text-align:left;
font-size: 1.05em ;
width:400px;
/*overflow-y: auto;*/
height:100%;
padding:10px;
background:white;
border:1px solid black;opacity:1;
}

/*
.cor
{
border : 1px red solid;
background: #ccc;
padding: 15px 15px 15px 15px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 10px 10px 10px black;
-moz-box-shadow: 10px 10px 10px black;
-webkit-box-shadow: 10px 10px 10px black;
}
*/



.rotate {
position : fixed;
top:750px;
left:3%;
left:calc(50% - 590px);
z-index:-500;
color: grey;/*#383F44;*/
text-shadow: 1px 1px 5px white;/*#011933; #C8309D;/*#1C2022;*/
letter-spacing:5px;
margin: 0;
padding: 0;
height:0;
font-size:5em;
-webkit-transform-origin: 0 0;
-moz-transform-origin: 0 0;
-ms-transform-origin: 0 0;
-o-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
transform: rotate(-90deg);
}

.vote table{
/*border:1px white solid;
border-radius: 10px;*/
margin:auto;
}

.vote th{
border:2px white solid;
border-radius: 5px;
padding-bottom:10px;
padding-top:10px;
}

.vote td {
padding : 0px;
border:1px black dotted;
border-radius: 5px;
text-align:center;
padding:5px;
color:blue;
}

/* partie pour les articles de type 4, c est à  dire les exercices */
.enonce
{
position : relative;
-moz-border-radius : 15px;
-webkit-border-radius : 15px;
-khtml-border-radius : 15px;
-ms-border-radius : 15px;
border-radius : 15px;
border: 1px solid black ;
margin : 10px;
padding : 25px;
background : url(exercices/fond3.png);
text-align: left;
}

.cor
{
border : 1px red solid;
background: #ccc;
padding: 15px 15px 15px 15px;
border-radius: 5px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
box-shadow: 10px 10px 10px black;
-moz-box-shadow: 10px 10px 10px black;
-webkit-box-shadow: 10px 10px 10px black;
}

/* partie pour écrire du code en ligne */
.special{
padding : 5px 5px 5px 5px;
margin : 10px 10px 10px 10px; /*tout autour */
background: #FFFFFF ;
border: 1px black solid;
color: navy ;
font-size: 1em ;
display: inline-block;