html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

body {
	background-color: #e1e2e3;
	font-family:Helvetica, Arial, sans-serif;
	font-size:1em;
	margin:0;
	padding:0;
}
#page {
	margin: 0 auto;
	background-color:#FFF;
	max-width: 1200px;
    padding: 0px;
    width: 100%; 
    position: relative;

    -webkit-box-sizing: border-box; 
    -moz-box-sizing:    border-box;
    box-sizing:         border-box;   
}

h1 {
	color:#474747;
	font-size:1.8em;
	font-weight: bold;
	text-align: left;	
	padding: 10px;
}

h2 {

	color:#00BDE8;
	font-size:1.1em;	
}

h3 {

	color:#474747;
	font-size:1.3em;
	font-weight:normal;
	text-align:left;
	padding: 10px 0px;
}

.instruction {

	color:#666;
	font-size:10px;
	margin:15px;
}

table {
	
	width:100%;
	margin:0;
	border-collapse:collapse;
}
table a {
	text-decoration:none;
	cursor:default;
}
.level1 a {
	text-transform:uppercase;
	color:#000;
	font-size:16px;	
	padding:5px 0 5px 25px;
	background: #fff;
	display:block;
}
.level2 a {
	display:block;	
	color:#58595b;
	font-size:13px;
	padding:5px 0;
	margin-left:25px;
}
table a:hover, table .active a {
	background:#0096de;
	color:#3c3c3e;
	font-weight:bold;
	cursor:pointer;
}
table .level1.active {
	background-image:none;
}
table .active {
	background:url('../images/active.png') no-repeat 0 5px #0096de;
	padding:3px;
}

.croix {

	background:url('../images/croix.png') no-repeat 0 0;
	position:absolute;
	width:32px;
	height:31px;
	top:427px;
	left:0px;
}

.scroller {
	height:250px;
	overflow-y:auto;	
	margin:0 20px;
	width: 97%;	
}

.player_container {
	border:5px solid #808080;	
	max-height: 360px !important;
	max-width: 640px !important;

	margin: 0 auto;
}


.player_content {
	width: 100%;
	background-color:#e1e2e3;
	margin: 0;	
	padding: 20px;

	-webkit-box-sizing: border-box; 
    -moz-box-sizing:    border-box;
    box-sizing:         border-box; 
}

.head{
 	max-width: 1200px;
    width: 100%;
	margin: 0 auto;
}

.footer{
   max-width: 1200px;
    width: 100%;
    margin: 5px auto;
    display: block;
    height: 25px;
    background: #fff;
    text-align: center;
    padding-top: 20px;
}

.footer a{
    text-decoration: underline;
    color: #58595B;
    font-size: 14px;
    font-weight: bold;
}

.logo{    
	background-color: #fff;
}

.logo img{
	width: 100%;
	height: 100%;
}

.social {	
	float:right;	
	/*width: 100%;*/
	padding: 10px;
	text-align: right;

	-webkit-box-sizing: border-box; 
    -moz-box-sizing:    border-box;
    box-sizing:         border-box;
}

.social li {
	display:inline;
}

.clearer {
    height:1px;
    display:block;
    overflow:hidden;
    clear:both;
}
.odj {

	color:#404040;
	font-size:13px;
	/*font-weight:bold;*/
	text-align:left;
}

.buttonshare{
	float: right;
    margin: 1em 5px 0 0;
    position: relative;
}

.nolink {

	background: none repeat scroll 0 0 #fff;
    color: #474747;
    display: block;    
    font-weight: bold;
    padding: 5px 0 5px 5px;
    text-transform: uppercase;
}

.search_form {
	padding: 5px 0px;
    position: relative;    
}

.search_btn {  
	background: url("../images/loupe.png") no-repeat scroll 13px 9px #f8fafb;
    border: 3px solid #666;
    border-radius: 16px;
    padding: 7px;
    width: 45px;
}

.result_label {
    float: left;
    padding: 0px 5px 5px 5px;
    width: 45%; 
}

.search_right {
    float: left;
    padding: 10px 5px 5px 5px; 
    width: 50%;   
}

.clear {
  clear: both;
 }

 .video_collector a {
    text-decoration: none;
    color: black;
}

.element_video{
	padding: 10px; 
	line-height: 20px;
}

.titre_video{
	padding: 10px 0; 
	font-size:18px
}

.vignette_video{
	float: left; 
	position: relative; 
	width: 24%;
}

.cuepoints_video{
	overflow-y: auto; 
	float: right; 
	position: relative; 
	height: 80px; 
	font-size: 14px; 
	width: 74%;
}

.thumb{
	border: 1px solid #808080;
    width: 100%;
}

.pagination {
    float: right;
    padding: 10px;
}

 /*
 	sliding
 */
#sliding_frise {   
    float: left;
    height: 150px;
    width: 80%;
}


.element_frise_22 {
    float: left;
    height: 115px;
    margin: 9px 3px;
    padding: 3px;
    width: 115px;
}


.vignette_frise {
    height: 68px;
    text-align: center;
    width: 113px;
}

.vignette_frise img {
	border: 1px solid #808080;
    height: 68px;
    width: 113px;
}

.titre_vignette_frise {
    margin: 5px 0;
    width: 113px;
    height: 25px;
}

#fl_gauche, #fl_droite {
    float: left;    
    position: relative;
    text-align: center;
    top: 25px;
    width: 10%;
}

.archive {
    width: 96%;
    background-color: #e1e2e3;
    margin: 20px;
    padding: 5px;

   	-moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;   
}

.archive a {
    text-decoration: none;
    color: #58595B;
    font-size: 14px;
    font-weight: bold;
}

.slide{
	left: 35px;
	width: 90%;
}

.slide a {
    text-decoration: none;
    color: black;
    font-size: 11px;
    font-weight: bold;
}

.cuepoints_title h2{
	padding: 10px 0;
    color: black;
}

.desctription{	
	width: 640px;
    max-height: 250px;
   	padding: 10px 0;
    overflow-y: auto;
    color: #58595b;    
    font-size: 13px !important; 
    font: inherit;    
}

.desctription ul {
    padding: 0px 20px;
}
.desctription p {
    padding: 10px 0;
}

.plusinfos{
	width: 639px;
	max-height: 250px;
    padding: 10px 0;
    overflow-y: auto;    
}

.plusinfos a{

	color: #d13447;    
    font-size: 13px !important; 
    font: inherit; 

}
.boite_ensavoirplus span.titre {
	padding-top: 4px;
}

.boite_ensavoirplus span.titre {
	background: url("../images/ae0376f418dd5dfd6d9605bbcbf3f47b.png") no-repeat scroll left center rgba(0, 0, 0, 0);
	display: block;
	height: 22px;
	padding-left: 28px;
}

.univers {
	border-color: #c61529;
	color: #c61529;
}

.boite_contenu_titre {
	background: url("../images/boite_contenu_debut_large.jpg") no-repeat scroll left bottom #e5e5e5;	
	margin-bottom: 0;
	min-height: 38px;
	padding: 0 0 0 8px;
	text-transform: uppercase;
}

.boite_contenu {
	background: url("../images/boite_contenu_fin.jpg") no-repeat scroll left bottom #d6d6d6;
	margin: 0 0 1em;
	min-height: 20px;
	padding: 0px 5px 10px 50px;
}

.boite_contenu li {
    color: #58595b;
    font-size: 12px;
}

.ensavoir{
	width : 640px;
}
			
.boite_ensavoirplus span.titre {
	color: #d13447;
	font-size: 14px;
	font-weight: bold;
	text-align: left;
}

.univers {
	color: #c61529;
}

.rapporteur {
    font-weight: bold;
}

.search {
	margin: 5px;
	width: 99%;
	text-align: right;	
}

.search_btn{
	background: url("../images/loupe.png") no-repeat scroll 13px 9px #f8fafb;
    border: 2px solid #666;
    border-radius: 16px;
    padding: 8px;
    width: 45px;
    height: 36px;
	position: relative;	
}

.search_input{
	border: 2px solid #666;
    border-radius: 16px;
    padding: 8px;    
	width: 35%;	
}

.form {	
	padding: 20px;
}

.form span{
	color:#000;
	font-size:1.2em;
	font-weight:normal;	
}

.form *{
	display: inline;
}

.back_btn {  	
    border: 2px solid #666;
    border-radius: 16px;
    padding: 7px;
    width: 45px;
    
    color: #636363;
   	opacity:  1;
   	text-decoration: none;   
}

.infos{
	display:none;
	padding: 20px;
}

.infos p{
	font-size: 14px;
	color:#474747;
}

.archive_title span{
	margin:5px 10px;
  	position:absolute;
}

.chap_titles, .chap_search{
	float: left;
	width: 50%;
	padding: 10px 20px 0px 20px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;	

}

.jw-icon-cc{
	display : none !important;
}

/* max-width 640px, mobile-only styles, use when QAing mobile issues */
@media only screen and (max-width: 40em) {	

	#page {	
		-moz-box-sizing: border-box;
	    -webkit-box-sizing: border-box;
	    box-sizing: border-box;	
	    padding: 5px 2px 40px;	
	}

	.player_container {
		border:none;				
	}

	.social, .scroller {
		display: none;		
	}

	h1 {	    
	    font-size: 1em;	    
	    padding: 10px 5px;
	    text-align: left;
	}
	
	h3 {
		
		font-size:1em;		
		padding: 10px 0;
	}

	.search {
		width: 100%;
	}	

	.archive {
		-moz-box-sizing: border-box;
	    -webkit-box-sizing: border-box;
	    box-sizing: border-box;
	    padding: 4px;
	    width: 314px;
	}		

	.result_label {	    	       
    	width: 40%;	
	}

	.search_right {
	    float: left;
	    padding: 5px;
	    position: relative;	    
	}

	.search_right .search_btn{
		display: none;
	}

	.search_right .search_input{
		width: 80%;
	}
	
	.video_collector{
		padding: 0px;
    	margin: 0px;
	}	

    .element_video{
		line-height: 16px;
    	padding: 5px;
	}

	.element_video .titre_video{
		font-size: 14px;
	    font-weight: bold;
	    padding: 5px 0;
	}
}