/* Barre fixe */

.barreordi{
	position: fixed;
    bottom: -0.2rem;
    right: 0;
    width: 100%;    
}
.barreordi:hover{
	background-color: rgba(0,0,0,0.2);
}
.barrebotte{
	position: fixed;
    bottom: -0.2rem;
    right: 0;
    width: 14.25%;    
}
.barreordibotte{
	position: fixed;
    bottom: -0.2rem;
    right: 14.25%;
    width: 100%;   
}
.barreordibotte:hover{
	background-color: rgba(0,0,0,0.2); 
}

.boitebarre{
	position: relative;
	width:14.25%;
	margin:0;
	float:right;
}
.boitebarre img{
	width:100%;
	margin:0;
}
.boitebarre h4{
	position: absolute;
	top: 0;
	width: 100%;
	text-align: center;
}
.boitebarre:hover h4{
	color:#B69731;
	text-shadow: none;
}

.boitebotte{
	position: relative;
	width:100%;
	margin:0;
	float:right;
	text-align: center;
}
.boitebotte img{
	width:100%;
	margin:0;
}
.boitebotte h4{
	position: absolute;
	top: 0;
	width: 100%;
	text-align: center;
}
.boitebotte:hover h4{
	color:#B69731;
	text-shadow: none;
}

.border img{
	width:99.5%;
	/*border:1px solid rgba(121,121,121,1);*/
	border-left:1px solid rgba(121,121,121,1);
	border-top:1px solid rgba(121,121,121,1);
}


@media all and (max-width:367px) {

	/* Iphone 3 4 5 portrait 320px */
	.barreordi{
		display:none;
	}
	.barrebotte{
		display:none;
	}
	.barreordibotte{
		display:none;
	}

}

@media all and (min-width:368px) and (max-width:467px){

	/* Iphone 6 portrait 375px */
	.barreordi{
		display:none;
	}
	.barrebotte{
		display:none;
	}
	.barreordibotte{
		display:none;
	}
		
}

@media all and (min-width:468px) and (max-width:567px){

	/* iphone 3 4 paysage 480px */
	.barreordi{
		display:none;
	}
	.barrebotte{
		display:none;
	}
	.barreordibotte{
		display:none;
	}

}

@media all and (min-width:568px) and (max-width:667px) {

	/* iphone 5 paysage 568px */
	.barreordi{
		display:none;
	}
	.barrebotte{
		display:none;
	}
	.barreordibotte{
		display:none;
	}

}

@media all and (min-width:668px) and (max-width:767px) {

	/* Samsung galaxy paysage 640px iphone 6 paysage 667 */
	.barreordi{
		display:none;
	}
	.barrebotte{
		display:none;
	}
	.barreordibotte{
		display:none;
	}
}

/* Tablettes */		

@media all and (min-width:768px) and (max-width:899px) {

	/* ipad portrait 768px Samsung Tab 800px */
	
	/* Matières */	
	.boitebarre h4, .boitebotte h4{
		font-size: 0.9rem;
	}
	
	.talonvide{
		width:40%;
		margin:0;
		float:right;
	}
	.talonvide h4{
		font-size: 1rem;
	}
	.versiontalonvide{
		width:20%;
		right:40%;
		margin:0;
		float:right;
	}
	.versiontalonvide h4{
		position: relative;
		top: 1.5rem;
		font-size: 1rem;
	}

}

@media all and (min-width:900px) and (max-width:999px) {

	/* Asus LG  paysage 960px */
	.boitebarre h4, .boitebotte h4{
		font-size: 0.9rem;
	}

	.talonvide{
		width:40%;
		margin:0;
		float:right;
	}
	.talonvide h4{
		font-size: 1.1rem;
	}
	.versiontalonvide{
		width:20%;
		right:40%;
		margin:0;
		float:right;
	}
	.versiontalonvide h4{
		position: relative;
		top: 1.5rem;
		font-size: 1rem;
	}
	
}

@media all and (min-width:1000px) and (max-width:1099px) {

	/* ipad paysage 1024 px */
	.boitebarre h4, .boitebotte h4{
		font-size: 0.9rem;
	}	
	
}

/* Ordinateurs */

@media all and (min-width:1100px) and (max-width:1199px) {
	

	.boitebarre h4, .boitebotte h4{
		font-size: 1rem;
	}

}

@media all and (min-width:1200px) and (max-width:1299px) {
	
	.boitebarre h4, .boitebotte h4{
		font-size: 1rem;
	}
	
}

@media all and (min-width:1300px) and (max-width:1399px) {

	.boitebarre h4, .boitebotte h4{
		font-size: 1rem;
	}

}

@media all and (min-width:1400px) and (max-width:1499px) {

}

@media all and (min-width:1500px) and (max-width:1599px) {
	
}

@media all and (min-width:1600px) and (max-width:1699px) {

}

@media all and (min-width:1700px) and (max-width:1799px) {
	
}

@media all and (min-width:1800px) {
	
}


