
/*
*
* TABLETTES
*
*/

/* iPads (portrait and landscape) */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) {
	

	
/* Styles */
.bleu, a, a:hover{
	color:#df2d52;
}
.bordure2, .bordure3{
	border:none;
}

	body{
		background:#000;
		color:#fff;
	}
	#box1 { 
		/*float:none;width: 100%;*/
		background-color:#002b4b;
		padding: 0;
		}		
	#pvisu1{
		float:left;
		width:40%;
	}
	#ptxt{
		height:auto;
		margin-left:40%;
	
	}
		#ptxt .inner{
			padding:5px;
			
			font-size:1.2em;
			line-height:1.2em;
		}	
			#ptxt .inner.nbli1{
				padding-top:18%;
			}
			#ptxt .inner.nbli2{
				padding-top:15%;
			}

	#ticket{
		color:#000;
		background-color:#fff;
		padding:5px;
		margin:0 5px;
		border:1px solid #fff;
		border-radius: 5px;
		-moz-border-radius:  5px;
		-webkit-border-radius: 5px ;
		font-size:17px;
		
	}
		#codes{
			width:260px;
		}
	.logo{
		font-size:0.8em;
		width:150px;
		padding-left:260px;
		padding-top:25px;
		line-height:1em;
		text-align:center;
	}
		.valable{
			width:auto;
		}
		.utilisable{
			margin-left:0;
			float:right;
		}
		
		.nbplaces {
			width:auto;
		}
		
		#imprimer{
			margin-left:0;
			float:right;
		}
			#imprimer .btn-bleu,
			#imprimer .btn-bleu:hover
			{
				margin:1em 0;
				width:180px;
				padding:5px 2px;
				background-image:none;
			}
		
	#condition{
		height:auto;
		font-size:0.80em;
		line-height:1.2em;
	}
}
/* iPads (landscape) */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
/* Styles */
}

/* iPads (portrait) */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
/* Styles */
}


/*
*
* SMARTPHONES
*
*/
/* Smartphones (portrait and landscape) */
/*@media only screen and (min-device-width : 320px) and (max-device-width : 767px) {*/
@media only screen and (max-device-width : 767px) {
/* Styles */
	.nodesktop{display:block;}
	.nomobile{display:none;}

	.bordure4{
		border:none;
	}
	.orange{
		color:#df2d52;
		font-weight:bold;
	}	
	#ticket.haserreur .inner{
		padding:8% 0;
	}
		#ticket.haserreur .code1{
			height:auto;
		}
	/*
	.erreur{
		margin:10em 0;
	}
*/
	body{
		background:#000;
		color:#fff;
		font-family: 'Open Sans', sans-serif;
	}
	#box1 { 
		background-color:#002b4b;
		background-color:#FFFFFF;
		padding: 0 3%;
		padding:0;
	}	
		#haut, #bas{
			 height:40px;
			 width:80px;
			 background:#000;
			 margin:auto;
		}
		#haut{
			 border-radius: 0 0 80px 80px;
			 -moz-border-radius: 0 0 80px 80px;
			 -webkit-border-radius: 0 0 80px 80px;
			 margin-bottom:5px;
			 margin-bottom:3%;
		}
		#bas{
			 border-radius: 80px 80px 0 0;
			 -moz-border-radius: 80px 80px 0 0;
			 -webkit-border-radius: 80px 80px 0 0;
			 margin-top:5px;
			 margin-top:3%;
		}
		
	#wrapper { 
		margin: 0; 		
		}
		#wrapper .nomobile{
			display:none;
		}

	#logomobile{
		background: url("../images/logov2.png") no-repeat scroll top center;		
		height:104px;			
	}
	#ticket{
		height:auto;
		
		color:#000;
		background-color:#002b4b;
	}
		#ticket .inner{
			padding:0;
		}
		#codes{
			float:none;
			padding-top:3%;
			text-align:center;
			width:auto;			
			background:#fff;
			padding:5px;
			margin:0 3%;
			border:1px solid #fff;
			border-radius:5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px ;
		}		
	#nbplace{
		padding: 0 3%;
		padding-top:10px;
		padding-bottom:10px;
		border-top:3px solid #5588C2;
		text-align:center;
		text-transform:uppercase;
		/*height:210px;*/
		font-size:17px;
		font-weight:bold;
		background-color:#002b4b;
	}
		#nbplace span{padding:0;}
	.code1{
		float:none;
		margin:auto;
		width:auto;
		height:auto;
		padding:0;
		height:50px;
		overflow:hidden;		
	}
	.code2{
		float:none;
		margin:auto;
		width:auto;
		padding:20px 0;
		text-align:center;	
		height:120px;		
padding:0;		
	}
	
	#infos{
		width:auto;
		background-color:#fff;
		
	}
	#localisation{
		margin-top:10px;
		margin-bottom:10px;
		border-top:3px solid #5588C2;
	}
		#localisation a{
			margin:10px 30px;
			text-transform:uppercase;
			font-weight:normal;
		}
			.btn-orange {
				display:block;
				text-align:center;
				background-color: #df2d52;
				color:#fff;
				padding:3px;
				border-radius: 5px;
				-moz-border-radius:  5px;
				-webkit-border-radius: 5px;	
			}	
	#imprimer{
		float:none;
		height:32px;
		width:auto;
		margin:auto;
	}
	#condition{
		height:auto;
		border:none;
	}
	#condition .inner{
		color: #333333;
		padding:10px;
	}
	
}

/* Smartphones (landscape) */
@media only screen and (min-width : 321px) {
/* Styles */
}

/* Smartphones (portrait) */
@media only screen and (max-width : 320px) {
/* Styles */
}
/* Smartphones (portrait) */
@media only screen and (max-width : 319px) {
/* Styles */
	.code1{
		display:none;
	}
	#ticket.haserreur .code1{
		display:block;
	}
	/*
	#alerttaille{
		display:block;
	}*/
}

@media only screen and (min-device-width: 400px) and (max-device-width: 767px) and (orientation : portrait) {
	#wrapper{
		margin:2% 0;
	}
	/*#nbplace,*/
	 #localisation{
		margin:8% 0;
	}
}
/*
*
* SPEC IPHONE
*/

/* iPhone 4. Comma can be used to apply same rules to multiple media queries. */
@media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

/*iPhone 6 Portrait*/
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : portrait) {

}

/*iPhone 6 landscape*/
@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (orientation : landscape) {

}

/*iPhone 6+ Portrait*/
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : portrait) {

}

/*iPhone 6+ landscape*/
@media only screen and (min-device-width: 414px) and (max-device-width: 736px) and (orientation : landscape) {

}

/*iPhone 6 and iPhone 6+ portrait and landscape*/
@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px){
}

/*iPhone 6 and iPhone 6+ portrait*/
@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px) and (orientation : portrait){

}

/*iPhone 6 and iPhone 6+ landscape*/
@media only screen and (max-device-width: 640px), only screen and (max-device-width: 667px), only screen and (max-width: 480px) and (orientation : landscape){

}


