body {
  /*  background-color: #EED; */
    font-family: "Comic Sans Ms";
    font-size: 12px;
    color: #448;
    
}



*, img {
       -moz-user-select: -moz-none;
   -khtml-user-select: none;
   -webkit-user-select: none;

   /*
     Introduced in IE 10.
     See http://ie.microsoft.com/testdrive/HTML5/msUserSelect/
   */
   -ms-user-select: none;
   user-select: none;
   
   user-drag: none; 
    -moz-user-select: none;
    -webkit-user-drag: none;
}

.photo {

   -moz-box-shadow: 2px 2px 6px gray;
   -webkit-box-shadow: 2px 2px 6px gray;
   box-shadow: 2px 2px 6px gray;

border: solid 6px #FFF;  
margin: 6px;

}



h1 {
                position: fixed;
                left: 0;    /* astuce pour centrer malgré le position:fixed */
                right: 0;  
                
                top:14px;
                
                color:#E8E8E8;

            font-size:28px;                 
                
                margin: auto;

                z-index: 10;

                font-family:fantasy;
                text-align: center;

                text-shadow: 1px 2px 3px rgba(0,0,0, 0.5);
                padding: 4px 20px 4px 20px;
            }
            
h2 {
    font-size:16px;
}


li {
    margin-bottom: 1.3em;
    list-style-type:square;
}

.questions li:before {
    content: "→  "; /* caractère UTF-8 */
    font-size: 20px;
}
.questions li {
    list-style-type:none;
}

.menu {

    float: left;
    width: 20%;
    text-align: center;
}            
            
.enonce {
    /*
    	background-image:linear-gradient(
			top
		,	rgba(255,255,255,.24) 0%
		,	rgba(255,255,255,.34) 12%
		,	rgba(255,255,255,.40) 25%
		,	rgba(255,255,255,.27) 39%
		,	rgba(255,255,255,.17) 50%
		,	rgba(255,255,255,.00) 51%
		,	rgba(255,255,255,.06) 60%
		,	rgba(255,255,255,.16) 76%
		,	rgba(255,255,255,.10) 91%
		,	rgba(255,255,255,.07) 100%
	);*/
    
    
    
                position: fixed;
               overflow: auto;

                top: 100px; 
                bottom: 40px; 
 
               
                left: 20%;    /* astuce pour centrer malgré le position:fixed */
                right: 6%;  

             
                color:#658;
                font-size:12px;    
                
                background-size: 100%;
                
                         
                
                margin: auto;
                background-color: rgba(250,252,254,0.75);
                border: solid rgba(230,236,220,0.95);
                border-radius: 20px;
                z-index: 20;

                font-family:"Comic Sans Ms";
                text-align: left;
                box-shadow: 8px 8px 12px #aaa;

                padding: 20px;

            }
            
            .enonce > * {
                margin-top: auto;
                margin-bottom: auto;
                 
            }   
            
            
            .rouge {
                background-color: rgba(250,52,54,0.35);
                transition:all 0.2s;
            }
            
            .vert {
                background-color: rgba(50,252,54,0.35);
            }            
            .bleu {
                background-color: rgba(50,152,254,0.25);
                
            }
            
            .erreur {
                font-family:verdana;
                font-size: 14px;
                font-weight: bold;
                color: #D11;
            }
            .noms {
                font-family:verdana;
                font-size: 14px;
                font-weight: bold;
                color: #DAC;
            }


            form {
                display: inline-block;
            }
input {
    background-color: #EED;
    text-align: center;
    font-family: arial;
    
        -moz-user-select: text;
           -khtml-user-select: text;
   -webkit-user-select: text;
    
}
input[type="checkbox"] {
    margin-left: 10px;
}



button, .bouton {
    background-color: #453;
    color : #FFF;
    border-radius: 6px;
    box-shadow: 8px 8px 12px #aaa;
    text-shadow: 1px 2px 3px rgba(0,0,0, 0.5);
    font-family:verdana;
    font-size: 10px;   
    padding: 4px;
    opacity: 0.6;
    cursor: pointer;
}




button:hover , .bouton:hover  {
    opacity: 1.0;
}

button:disabled , button:disabled:hover {
    opacity:0.1;
}


  .fraction , .noyau {
	display: inline-block;
	position: relative;
	vertical-align: middle; 
	letter-spacing: 0.01em;
	text-align: center;
	}
.fraction .num , fraction .denom , .noyau > * { 
	display: block; 
	padding: 0.2em; 
	}
.fraction .denom {border-top: thin solid black;}


.deplacable {
    border: thin solid;
    background-color: rgba(200,230,210,0.3);
    display: inline-block;
    padding: 6px;
    box-shadow: 8px 8px 12px #aaa;

    
    -moz-user-select: element;
    -webkit-user-drag: element;
    user-drag: element; 
}
.cadre {
    border: medium solid;
    background-color: rgba(200,230,210,0.1);

    padding: 6px;
    margin: 6px;
    text-align: center;
}

.cadre input, .petit input {
    width:40px;
}

.grand input {
    width:300px;
}

.cadre_ {
    border: medium solid;
    background-color: rgba(200,230,210,0.1);

    padding: 6px;
    margin: 6px;
    text-align: center;
    
    display: inline-block;
    
}

.moyen input {
    width:100px;
}







.definition {
    color:#822;
    background-color: rgba(200,50,50,0.1);
    font-style: italic;
    font-weight: bold;
}


table {
    text-align: center;
    border-collapse: collapse;
}
th , td {
    border: medium solid #77A;
    color : #77A;
    padding: 4px;
}


em {
    font-weight: bold;
    color:#844;
}


@font-face{
             font-family : 'Calligraffitti';
                  src : url('/p/Calligraffitti.ttf') ,
                        url('/p/Calligraffitti.woff') ;
         }

.citation {
    font-family: 'Calligraffitti';
    font-size: larger;
}


.sel {
            -moz-user-select: -moz-text;
        -khtml-user-select:text;
         -webkit-user-select: text; 
        -ms-user-select: text;
        user-select: text;
}


.exclamation {
    font-family: "Comic sans Ms";
    font-size: 20px;
    font-weight: bold;
    color:#F84;
}

.texte_encadre {
    font-family: verdana;
    border:solid rgba(200,160,80,0.4);
    border-radius:4px;
    background-color: rgba(200,160,80,0.07);
    padding: 8px;
    color: rgba(200,160,80,1.0);
    font-size: 12px;
}

.source {
    font-size:smaller;
    color:#AAC;
}


/* pour SVG */
fleche path {
	stroke:#F8F;
	fill:none;
	marker-end:url(#endmarker);
}

circle {
 	stroke:#F8F;
	fill:none;
	stroke-width:3px;        
}

#endmarker{
	fill:#F8F;
}



#path2{
	stroke-width:3px;
}

#fleche,#entoure {
    position:absolute;
  /*  background-color: yellow; */
}


#dessins_SVG {
    opacity: 0.7;
}


textarea {
    width:100%;
}