@media screen {html {background-color : #999999}

body {min-width : 1000px;
      max-width : 95%;
      background-color : #FFFFFF;
	  box-sizing : border-box;
      margin : auto;
	  padding : 5px;
box-shadow : 10px 10px 20px #111;}

.video_container {min-width : 1000px;
                  max-width : 95%;
                  display : block;}	
				  
.video_container .playbtn {display : block;
                           width : 32px;
						   height : 32px;
						   box-sizing : border-box;
                           transform : translate(150px,-100px);}
.video {transition : 0.5s;
        box-shadow : 10px 10px 20px #123123}


}

@media print {html {background-color : #FFFFFF}

body {min-width : 1000px;
      max-width : 95%;
      background-color : #FFFFFF;
	  box-sizing : border-box;
      margin : auto;
	  padding : 5px;
}
.video_container {min-width : 1000px;
                  max-width : 95%;
                  display : none;}	
				  
.video_container .playbtn {display : block;
                           width : 32px;
						   height : 32px;
						   box-sizing : border-box;
                           transform : translate(150px,-100px);}
.video {transition : 0.5s;
        box-shadow : 10px 10px 20px #123123}

}

	  a {text-decoration : none}
	  
h1 {color : orange;
    text-shadow : 1px 1px 2px #222;
	text-align : center;
	border-top : 2px solid orange;
	border-bottom : 2px solid orange;
	}
	
h2 {color : maroon;
    text-shadow : 1px 1px 2px #222;
	border-bottom : 2px solid maroon;
	border-left : 2px solid maroon;
	padding-left : 10px; }
	
h3 {color : black;
    border-bottom : 2px solid black;}
	
h4 {color : black;
     display:inline-block;
    border-bottom : 2px dashed black;
	margin-bottom : 0;}
	
h5 {font-size : 1em;
    margin-bottom : 2px;}
	
#next {
	position: relative;
	background: #88b7d5;
	display : block;
        float : right;
		width : 150px;
		height : 30px;
		font-size : 0.8em;
		margin-top : 4px;
		text-shadow : 0 0 0 #000;
		color : orange;
}


#next:hover{
	position: relative;
	background: #88b7d5;
	display : block;
        float : right;
		width : 150px;
		height : 30px;
		font-size : 0.8em;
		margin-top : 4px;
		text-shadow : 1px 1px 2px #222;
		color : orange;
}


#next:after, #next:before {
	left: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

#next:after {
	border-color: rgba(136, 183, 213, 0);
	border-left-color: #88b7d5;
	border-width: 15px;
	margin-top: -15px;
}

#previous {
	position: relative;
	background: #88b7d5;
	display : block;
        float : left;
		width : 150px;
		height : 30px;
		font-size : 0.8em;
		margin-top : 4px;
		text-shadow : 0 0 0 #000;
		color : orange;
}

#previous:hover{
	position: relative;
	background: #88b7d5;
	display : block;
        float : left;
		width : 150px;
		height : 30px;
		font-size : 0.8em;
		margin-top : 4px;
		text-shadow : 1px 1px 2px #222;
		color : orange;
}

#previous:after {
	right: 100%;
	top: 50%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-color: rgba(136, 183, 213, 0);
	border-right-color: #88b7d5;
	border-width: 15px;
	margin-top: -15px;
}


form {padding : 0}
.checkimg{width: 16px;
          height : 16px;
		  display : inline-block;
		  margin : 0;
		   border : 0px solid #FFFFFF;}
input {width : 60px;
       height : 32px;
	   display : inline-block;
	  
	   margin-right : 5px;}

.question {font-weight : bold;
           color : #6D74FF}

		   
#projettbl {width : 70%;
            border-collapse : collapse;
			font-weight : bold;
			text-align : center}
#projettbl td {width : 33%;
               height : 25px;
               border-top : 1px solid white;
			   border-bottom : 1px solid white;
			   color : black;
}

#projettbl tr:nth-child(2n)	{background-color : #B8CCE4;}
#projettbl tr:nth-child(2n+1)	{background-color : #DBE5F1;}	   
#projettbl .c1{background-color : #4F81BD;
                              border-top : 1px solid white;
			   border-bottom : 1px solid white;
			   color : white;}		
#projettbl #premier td{background-color : #4F81BD;
                          border-top : 1px solid white;
			          border-bottom : 1px solid white;
					  text-align : center;
					  color : white;}
					  
.img-rev {display : none;}
.titre-rev {z-index : 3;
            cursor: pointer;}

.reveal {z-index : 1;}

.prj {width : 486px;
      height : 450px;
      display : inline-block;
     

     }
.prj .auteur:before{content : "Programmé par ";}

.prj .auteur{display:block;
             width : 485px; 
             margin : auto;
             text-align : center;}

footer {position : fixed;
        min-width : 1000px;
        max-width : 95%;
        bottom : 0px;
		width : 300px;
		height : 35px;
		display : block;
		background : rgba(255,255,255,0.5);
		opacity : 0;
		transition : 0.5s;
}



footer:hover{opacity : 1;}

footer #vol_icon {display : inline-block;
                  }
				  
footer #gen_volume{width : 200px;
                   margin : 0;
				   margin-left : 5px;
				   }