/**
*
*		Media queries
**/


/* Portrait tablets to landscapes and desktops */
@media only screen and (max-width:61.188em), only screen and (max-width: 979px), all and (max-width:1025px) and (orientation:landscape) {
html { font-size: 90%; padding: 0; margin: 0; }	
body { font-size: 90%; padding: 0; margin: 0; }
        .bg-violences{ 
        -webkit-background-size: 100%;
	-moz-background-size: 100%;
	-o-background-size: 100%;
	background-size: 100%;
	}
	.md-modal {
	left:50%;
	}
	.sidebar{
	margin-top:0px !important;
	}
        
}


/* Phones and little tablets */
@media only screen and (max-width:47.938em) and (orientation:portrait), only  screen and (max-width: 767px) and (orientation:portrait),only screen and (max-width:47.938em) and (orientation:landscape), only  screen and (max-width: 767px) and (orientation:landscape) {
  
html { font-size: 80%; padding: 0; margin: 0; }
body { font-size: 80%; padding: 0; margin: 0; }

	.column {
	width: 100%;
	min-width: auto;
	min-height: auto;
	padding: 1em;
	display:block ;
	clear:both;
	}
	.column p {
	text-align: left;
	font-size: 1.5em;
	}
	.column:nth-child(2) {
	box-shadow: 0 -1px 0 rgba(0,0,0,0.1);
	}
	img, embed, object, video, .scale {
	/* IE7-8 need help adjusting responsive images */
	width: auto;
	}	
	.sidebar {
	margin-top:0;
	width:auto;
	padding:1em;
	}
	
}


/* Smart Phones */
@media handheld, only screen and (max-device-width: 31.250em), only screen and (max-device-width: 641px), only screen and (max-width: 641px) and (orientation:landscape), only screen and (min-width: 321px) and (max-width: 500px), only screen and (max-width:321px) and (orientation:portrait) {

	.acor-icon span {
	display: none;
	}
	.container > header h1 {
	font-size: 2.625rem;
	line-height: 1.3;
	}
	.container > header h2 {
	font-size: 1.8rem;
	}

	.container > header h3 {
	font-size: 1.1rem;
	}
	.container > header span {
	display: block;
	font-size: 50%;
	opacity: 0.7;
	padding: 0 0 0.6rem 0.1rem;
}
	.md-modal{
	width:auto;
	display:block;
	clear:both;
	top:30%;
	}
        .sidebar {
        width:auto;
        max-width:100%;
        display:block;
        clear:both;
	top:0;
	padding:1em;	
	}
	button {
	padding: 0 1.2em !important;
	}
	.md-content > div > figure {
   	 width : 100%;
  	 margin : 0;  
	}
	.md-content > div > figure  figcaption {
 	  font-size : 1.6rem;
  	 padding :1rem;
  	 background :transparent; 
 	  display :block;
 	  text-align :justify;
 	  font-family : 'PT sans narrow';
 	  font-style : normal;
  	 border-radius : 0 0 7px 7px ;
  	 -moz-border-radius : 0 0 7px 7px ;
  	 -webkit-border-radius : 0 0 7px 7px ;
	}
	.credit-photo {
	font-size:1.5em ! important;
	}
	.md-content-color-book-mecanic > figure  figcaption {
	font-size:0.8em;
	}
	.sidebar .sidebar-bg-video {
	width:50%;
	margin:10px auto auto;
	}
	.sidebar .credit-photo-mecanic {
	opacity:0;
	}

	
}
	




/* Smart Phones */
@media handheld,  media all and (max-width: 640px), media all and (max-width:321px) and (orientation:portrait)  {
.md-content-color-roles {
background: -moz-linear-gradient(top, rgba(0,0,0,0.9) 45%, rgba(0,0,0,0) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(45%,rgba(0,0,0,0.9)), color-stop(100%,rgba(0,0,0,0))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, rgba(0,0,0,0.9) 45%,rgba(0,0,0,0) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, rgba(0,0,0,0.9) 45%,rgba(0,0,0,0) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, rgba(0,0,0,0.9) 45%,rgba(0,0,0,0) 100%); /* IE10+ */
background: linear-gradient(to bottom, rgba(0,0,0,0.9) 45%,rgba(0,0,0,0) 100%); /* W3C */!important; 
	}
	

/* 321 portrait uniquement*/
@media all and (max-width:321px) and (orientation:portrait)  {

	
.bg-prejuge{ 
		background: url(http://www.lacor.info/editions_de_lacor/images/livre/prejuge_de_la_rampe.jpg) no-repeat 50% top fixed;
		background-color:#000;
		z-index:2;
		-webkit-background-size: 200%;
		-moz-background-size: 200%;
		-o-background-size:200%;
		background-size: 200%;
		}

}

@media all (max-width: 40.000em), media all (max-width: 640px) {

}

@media all (max-width: 37.500em), media all (max-width: 600px) {

	

}


@media all (max-width: 28.125em), media all (max-width: 450px) {

	

}

@media all (max-width: 21.875em), media all (max-width: 350px) {

	

}