/**modal (gcyrillus)*/
/**http://dabblet.com/gist/4694413*/
#modal {outline:none;}
#modal > div  {
/*border:solid;*/
/*position:absolute;*/
top:50%;
width:50%;
margin-left:21%;
margin-top:-120px;
transform:scale(0);
transition:transform 1s;
background:rgba(255,255,255,0.9);
}
#modal:before {content:url('/maths/images/explications.png');padding-left:40%;}
/*#modal:before, #modal #close {display:inline-block;z-index:1;border:solid;padding:0 5px;background:yellow;}*/
#modal #close {display:inline-block;z-index:1;border:solid;padding:0 5px;background-color:rgb(233,243,165);}
#modal:focus > div {transform:scale(1);transition: ease-in transform 1s;left:50%;top:50%;}
#modal:focus:before , #modal #close{opacity:0;}
#modal:focus #close {opacity:1;position:absolute;top:0;right:0;}
#modal > div > article {
height:230px;
display:table-cell;
vertical-align:middle;
text-align:center;
/*http://www.debray-jerome.fr/outils/Generateur-de-box-shadow-css3.html*/
-moz-box-shadow: 10px 10px 5px 0px #656565;
-webkit-box-shadow: 10px 10px 5px 0px #656565;
-o-box-shadow: 10px 10px 5px 0px #656565;
box-shadow: 10px 10px 5px 0px #656565;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=5);
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
}