@font-face {
    font-family: phitradesignHandwrittenThin;
    src: url(fonts/phitradesignHandwrittenThin.ttf);
}
@font-face {
    font-family: makerfelt;
    src: url(fonts/markerfelt.ttf);
}
.phitra{
    font-family:phitradesignHandwrittenThin;
}
.makerfelt{
    font-family:makerfelt;
}
.gras{
    font-weight:bold;
}

body {
    background-color: #ffffff;
	color: #323e48;
    text-align: center;
	font-family: Times New Roman;
    margin:0;
    padding:0;
    height:100%;
    overflow-y: scroll;
}
.centre {
    max-width: 1100px;
    width:100%;
    margin-left: auto;
    margin-right: auto;
    text-align: left;
    padding: 0px 0px 0px 0px;
}


.contentform{
  text-align: justify;
  font-size: 10pt;
  font-size:10pt;
  margin-top:20px;
  padding: 20px 20px 20px 20px;
  width:670px;
  min-height:500px;
}

.clear{clear:both;}
#adminlogin{
  padding-top:13px;
}
#logout {
    position: absolute;
    right: 0px;
    top: 0px;
    height: 130px;
    background-color: #ED1C24;
    border: 5px solid #000;
    z-index: 999;
}

#plogout{
	font-weight: bold;
	color: #ffffff;
	height: 130px;
	margin-top: 5px;
	text-align: center;
	width: 170px;

}
#plogout a:link {color:white; text-decoration: none;}      /* unvisited link */
#plogout a:visited {color:white;text-decoration: none;}
#plogout a:hover{color:black;text-decoration: none;}
#plogout a:active{color:black;text-decoration: none;}
#adminlogin{
  margin-top: 55px;
  padding-left: 10px;
  padding-right: 10px;
  width:250px;
  margin-left:auto;
  margin-right:auto;
  height: 100%;
  border: 1px solid #000000;
  background-color: #808080;
  font-size: 10pt;
  color: #000000;
}

.moduleseditions{
  margin-top: 15px;
  padding-left: 10px;
  padding-right: 10px;
  margin-left:auto;
  margin-right:auto;
  width:1000px;
  min-height: 350px;
  height: 100%;
  border: 1px solid #000000;
  background-color: #808080;
  font-size: 10pt;
  color: #000000;
}
.messagesucces{
  margin-top: 15px;
  padding: 10px 10px 10px 10px;
  width:365px;
  min-height: 30px;
  border: 1px solid #000000;
  background-color: #008000;
  font-size: 10pt;
  font-weight: bold;
  color: #ffffff;
  text-align: center;
}
.messageerreur{
  margin-top: 15px;
  padding: 10px 10px 10px 10px;
  width:340px;
  min-height: 30px;
  border: 1px solid #000000;
  background-color: #CC0000;
  font-size: 10pt;
  font-weight: bold;
  color: #ffffff;
  text-align: left;
}
.alertde {
    
    padding: 10px 10px 10px 10px;
    min-height: 30px;
    border: 1px solid #000000;
    background-color: #CC0000;
    font-size: 10pt;
    font-weight: bold;
    color: #ffffff;
    text-align: center;
}
a:link {color:#323e48; text-decoration: none;}      /* unvisited link */
a:visited {color:#323e48;text-decoration: none;}
a:hover{color:#eb2338;text-decoration: none;}
a:active{color:#eb2338;text-decoration: none;}.alertde a:link {color:#ffffff; text-decoration: none;}      /* unvisited link */.alertde a:visited {color:#ffffff;text-decoration: none;}.alertde a:hover{color:#eb2338;text-decoration: none;}.alertde a:active{color:#eb2338;text-decoration: none;}
a:focus{
  outline: none;
}
/* Feuille de style pour Calendrier */
table.cal { border-collapse: collapse; font-size:12px; background:#ffffff; border: 1px groove #0026A7; }
/* la case contenant le nom du mois */
.cal td.cal_titre { font-weight:bold; }
/* les cases des jours de la semaine */
.cal th { text-align:center; background:#5f7d01; color:#DAE2FF; border: 1px solid #000000; }
/* les autres cases */
.cal td { text-align:center; background:#ffffff; margin:0px; padding:5px; border:1px solid #000000; }
/* la case correspondant à aujourd'hui */
.cal td.today { border: 2px solid #EBB61B; margin:0; padding:-2px; }

.calendar{
    background-color:#f7f6f3;
    position:absolute;
    font-family:Arial, Helvetica, sans-serif;
    font-size:11px;
    border:1px solid #0099cc;

}
.calendar a{
    text-decoration:none;
    color:#ffffff;
    font-weight:bold;
}
.calendar span{
    float:left;
    display:block;
    width:25px;
    cursor:pointer;
    text-align:center;
}
.titleMonth{
    width:100%;
    background-color:#08a1d4;
    color:#FFFFFF;
    text-align:center;
    border-bottom:1px solid #666;
    margin:none;
    padding:none;
    padding-bottom:2px;
    margin-top:0px;
    margin-bottom:0px;
    font-weight:bold;
}
.separator{
    float:left;
    display:block;
    width:25px;
}
.currentDay{
    font-weight:bold;
}
.droite{
    text-align:right;
}
.aligncentre{
    text-align:center;
}
#header{
    background-color:#149546;
    color:white;
    height:50px;
    line-height:50px;
}

#menu {
    margin-top:30px;
    margin-bottom:30px;
    text-align:right;
    font-size:1.5em;
}
#menu a, #menu span{
    margin-right:20px;
}

#menu span{
    color:#eb2338;
}
#accueil{

}
#grande-image img{
    width:100%;
}
#grande-image{
    position:relative;
    z-index:1;
}
    #grande-image div.centre {
        position: absolute;
        max-width: 1100px;
        width: 100%;
        top: 15%;
        right: 0;
        left: 0;
        display: inline-block;
        margin-left: auto;
        margin-right: auto;
        text-align: left;
        font-size: 1.5em;
        font-family: AvenirMedium;
    }
#login{

}
#barreoutils{
    background-color:#f2f4f4;
}
#barreoutils div.col1,#barreoutils div.col2,#barreoutils div.col3,#barreoutils div.col4{
    width:20%;
    float:left;
    margin:8px;
    padding:8px;
    font-size:1.1em;
}
#barreoutils img{
    width:75px;
    vertical-align:middle;
    padding-right:5px;
}
#creativite h1{
    padding-top:40px;
    text-align:center;
    color:#8b6cca;
}
#creativite {
    text-align:justify;
    font-size:1em;

}
.creativcols{
        display: -webkit-flex;
    display: flex;
}
#creativite div.col1,#creativite div.col2,#creativite div.col3,#creativite div.col4{
    width:20%;
    float:left;
    border:1px solid;
    margin:10px;
    padding:10px;
    position:relative;
}

#creativite img{
    width:95%;
    height:206px;
}
#creativite div.col1 h2{
    color: #ef4e95;
    text-align:center;
}
#creativite div.col1 button{
    background-color: #ef4e95;
    color:white;
    border-radius: 10px;
    border:0px;
    padding:5px 10px 5px 10px;
    
}
.bouton{
    position:absolute;
    bottom:20px;
    left:0;
    right:0;
    margin-right:auto;
    margin-left:auto;
}
#creativite div.col2 h2{
    color: #8fd02f;
    text-align:center;
}
#creativite div.col2 button{
    background-color: #8fd02f;
    color:white;
    border-radius: 10px;
    border:0px;
    padding:5px 10px 5px 10px;
    
}

#creativite div.col3 h2{
    color: #1daee9;
    text-align:center;
}
#creativite div.col3 button{
    background-color: #1daee9;
    color:white;
    border-radius: 10px;
    border:0px;
    padding:5px 10px 5px 10px;
}

#creativite div.col4 h2{
    color: #fd9f2d;
    text-align:center;
}
#creativite div.col4 button{
    background-color: #fd9f2d;
    color:white;
    border-radius: 10px;
    border:0px;
    padding:5px 10px 5px 10px;
}
#coordonnees{
    clear:both;
    background-color: #f2f4f4;
    font-size:1em;
}
#coordonnees div.col1,#coordonnees div.col2,#coordonnees div.col3,#coordonnees div.col4{
    width:20%;
    float:left;
    margin:10px;
    padding:10px;
}
#coordonnees img{
    width:100%;
}
#coordonnees div.col1 h2{
    color:#fd9d2d; 
}

#coordonnees div.col1 ul{
		list-style: none;
        padding-left:0;
}

#coordonnees div.col1 ul li:before {
		content: "\2665 \0020";
        color:#fd9d2d; 
	     }
       

#coordonnees div.col2 h3{
color: #8b6cca;

}

#coordonnees div.col3 h3{
color: #8fd02f;
}
#coordonnees div.col4 h3{
color: #eb2338;
}

#login{
    width:30%;
    float:right;
    padding:2%;
    background-color:#149546;
    color:white;
    border-radius: 10px;
    border:0px;
}
#login input{
    width:40%;
    background-color: #89939c !important;
    padding:10px;
    border-radius: 10px;
    border:0px;
    -webkit-appearance: none;
}
#login span{
    font-size:0.75em;
    display:inline-block;
    width:40%;
}
#login a{
    background-color: #89939c;
    padding:10px;
    border-radius: 10px;
    border:0px;
    width:90%;
    display:inline-block;
    font-size:14pt;
    text-align:center;
}
#login a:link {color:white; text-decoration: none;}      /* unvisited link */
#login a:visited {color:white;text-decoration: none;}
#login a:hover{color:red;text-decoration: none;}
#login a:active{color:red;text-decoration: none;}

#choixenfant{
    width:30%;
    float:right;
    padding:20px;
    background-color:#149546;
    color:white;
    border-radius: 10px;
    border:0px;

}
#choixenfant a{
    background-color: #89939c;
    padding:10px;
    border-radius: 10px;
    border:0px;
    width:90%;
    display:inline-block;
    font-size:14pt;
}

#choixenfant a:link {color:white; text-decoration: none;}      /* unvisited link */
#choixenfant a:visited {color:white;text-decoration: none;}
#choixenfant a:hover{color:red;text-decoration: none;}
#choixenfant a:active{color:red;text-decoration: none;}

#profilenfant{
    width:30%;
    float:right;
    color: #fd9f2d;
    padding:20px;
    text-align:center;
    background-color:#89939c;
    border-radius: 10px;
    border:0px;

}
#profilenfant div{
    background-color: #fd9f2d;
    padding:10px;
    color:white;
    text-align:center;
    font-size:14pt;
    border-radius: 10px;
    border:0px;
    width:90%;
}

#profilenfant a:link {color:white; text-decoration: none;}      /* unvisited link */
#profilenfant a:visited {color:white;text-decoration: none;}
#profilenfant a:hover{color:red;text-decoration: none;}
#profilenfant a:active{color:red;text-decoration: none;}


.vgris{
    border:2px solid black;
    background-color:#a3abaf;
    padding:1em;
    -webkit-appearance: none;
}
    .vgris:checked {
        background: url(images/onebit_34.png);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: 30px 30px;
        border: 2px solid red;
    }

.vrouge{
    border:2px solid black;
    background-color:#eb2338;
    padding:1em;
    -webkit-appearance: none;
}
    .vrouge:checked {
        background: url(images/onebit_34.png);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: 30px 30px;
        border: 2px solid red;
    }

.vvertforet{
    border:2px solid black;
    background-color:#096033;
    padding:1em;
    -webkit-appearance: none;
}
    .vvertforet:checked {
        background: url(images/onebit_34.png);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: 30px 30px;
        border: 2px solid red;
    }

.vvertlime{
    border:2px solid black;
    background-color:#66b936;
    padding:1em;
    -webkit-appearance: none;
}
    .vvertlime:checked {
        background: url(images/onebit_34.png);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: 30px 30px;
        border: 2px solid red;
    }

.vvert{
    border:2px solid black;
    background-color:#8fd02f;
    padding:1em;
    -webkit-appearance: none;
}
.vvert:checked {
        background: url(images/onebit_34.png);
        background-repeat: no-repeat;
        background-position: center center;
        background-size: 30px 30px;
        border: 2px solid red;
    }

.vvertpale{
    border:2px solid black;
    background-color:#c3e479;
    padding:1em;
    -webkit-appearance: none;
}
.vvertpale:checked {
    background: url(images/onebit_34.png);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 30px 30px;
    border: 2px solid red;
    }
input[type="radio"] {
  margin-top: -1px;
  vertical-align: middle;
}

.crochetbouton{
    border:2px solid black;
    padding:1em;
    display:inline-block;
    width:1em;
    -webkit-appearance: none;
}
.crochetbouton:checked{
    background: url(images/onebit_34.png);
    background-repeat: no-repeat;
    background-position:center center;
    background-size:30px 30px;
    border:2px solid red;
}

#vlematin,#vlapresmidi{
    padding-top:20px;
}

#valaccueil p,#vlematin p,#vlapresmidi p{
    float:left;
    padding-right:20px;
}
#valaccueil span,#vlematin span, #vlapresmidi span{
    font-weight:bold;
}


#vecus h1{
    font-size:3em;
}
#alaccueil div.col1,#alaccueil div.col2,#alaccueil div.col3,#alaccueil div.col4{
    width:20%;
    float:left;
    margin:10px;
    padding:10px;
}
#alaccueil img{
    width:100%;
}
#alaccueil figcaption{
    color: #66b936;
    font-size: 14pt;
    text-align:center;
    font-weight:bold;
}
#alaccueil div.col1 div{
    padding:10px;
    background-color:#c3e479;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}

#alaccueil div.col2 div{
    padding:10px;
    background-color:#8fd02f;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}
#alaccueil div.col3 div{
    padding:10px;
    background-color:#6e9020;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}
#alaccueil div.col4 div{
    padding:10px;
    background-color:#149546;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}
.orange{
    color:#fd9f2d;
}
.vertforet{
    color:#149546;
}

.resultat{
    margin-top:-5px;
}
.rgris{
    border:1px solid black;
    background-color:#a3abaf;
    padding:1em 1em 1em 1em;
    float:left;
    
}

.rrouge{
    border:1px solid black;
    background-color:#eb2338;
    padding:1em;
    float:right;
}
.rouge{
    color:red;
}
#cematin{
    padding-top:40px;
}
#cematin div.col1,#cematin div.col2,#cematin div.col3{
    width:29%;
    float:left;
    margin:10px;
    padding:10px;
}
#cematin img{
    width:100%;
}
#cematin figcaption{
    color: #fd9f2d;
    font-size: 14pt;
    text-align:center;
    font-weight:bold;
}
#cematin div.col1 div{
    padding:10px;
    background-color:#f4cc56;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}

#cematin div.col2 div{
    padding:10px;
    background-color:#fd9f2d;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}
#cematin div.col3 div{
    padding:10px;
    background-color:#fd7a28;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}

.resul5{
    border:1px solid black;
    background-color:#eb2338;
    padding:0.5em 1em;
    -webkit-appearance: none;
}


.resul1{
    border:1px solid black;
    background-color:#096033;
    padding:0.5em 1em;
    -webkit-appearance: none;
}


.resul2{
    border:1px solid black;
    background-color:#66b936;
    padding:0.5em 1em;
    -webkit-appearance: none;
}


.resul3{
    border:1px solid black;
    background-color:#8fd02f;
    padding:0.5em 1em;
    -webkit-appearance: none;
}


.resul4 {
    border: 1px solid black;
    background-color: #c3e479;
    padding: 0.5em 1em;
    -webkit-appearance: none;
}

.resulblanc {
    border: 1px solid black;
    background-color: white;
    padding: 0.5em 1em;
    -webkit-appearance: none;
}

.mauve{
    color:#8b6cca;
}
#cetapresmidi{
    padding-top:40px;
}
#cetapresmidi div.col1,#cetapresmidi div.col2,#cetapresmidi div.col3{
    width:29%;
    float:left;
    margin:10px;
    padding:10px;
}
#cetapresmidi img{
    width:100%;
}
#cetapresmidi figcaption{
    color: #ef4e95;
    font-size: 14pt;
    text-align:center;
    font-weight:bold;
}
#cetapresmidi div.col1 div{
    padding:10px;
    background-color:#f7a6ca;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}

#cetapresmidi div.col2 div{
    padding:10px;
    background-color:#ef4e95;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}
#cetapresmidi div.col3 div{
    padding:10px;
    background-color:#8b6cca;
    border-radius: 10px;
    border:0px;
    color:white;
    text-align:center;
    font-weight:bold;
    font-size:14pt;
}

#cetapresmidi p.resultat,#cematin p.resultat{
    margin-top:0px;
    text-align:center;
}
#cetapresmidi p.resultat span, #cematin p.resultat span{
    margin-right:10px;
}
#commentaires,#notes,#activitesortie{
    padding-left:50px;
}
#adminactivitesquotidiennes select{
    width: 27%;
}
#accueil li{
    margin-bottom:10px;
}
#chkrestant a:link {
    color: black;
    text-decoration: none;
}
/* unvisited link */
#chkrestant a:visited {
    color: black;
    text-decoration: none;
}

#chkrestant a:hover {
    color: red;
    text-decoration: none;
}

#chkrestant a:active {
    color: red;
    text-decoration: none;
}

/*conic gradient*/

.chart {
    border-radius: 50%;
    width: 50%;
    height: 0;
    float:left;
    padding-top: 50%;
    padding-right: 20px;
}

.key {
    width: 50%;
    float:right;
    list-style: none;
    display: table;
    border-collapse: separate;
}

    .key > li {
        display: table-row;
    }

        .key > li > * {
            display: table-cell;
            border-bottom: 12px solid #fff;
        }

.percent {
    color: #fff;
    padding: 10px 2px;
    text-shadow: 0 0 1px #000;
    text-align: center;
}

.choice {
    padding-left: 5px;
    font-size:10pt;
}


* {
    box-sizing: border-box;
}
#adminstatistiques h1, #adminstatistiques h3 {
    text-align: center;
}
.column {
    width: 33%;
    float: left;
}
.columntest {
    width: 55%;
    float: left;
}
#adminstatistiques table{
    width:50%;
    margin-left:auto;
    margin-right:auto;
}
#adminstatistiques td, #adminstatistiques th {
    width: 50%;
    padding:10px;
}
#showorder{
    display:inline-block;
    width:65px;
}
#imprimerrapport table{
    margin-left:auto;
    margin-right:auto;
}
#sautdepage{
    page-break-after:always;
}