@CHARSET "UTF-8";

/* SEULEMENT MOBILE TYPE IPHONE	*/
@media screen and (max-device-width: 480px)
,screen and (max-width: 480px)
{
	
	img, object, embed, video, iframe, table, object, iframe, frame, video { 
		max-width: 100% !important;
		width:95% !important;
		height:auto !important;
	}
	/*
	table, table tr, table th{
		width:100%;
	}
	*/

	/*
	body, #maindiv, #title, #menu, #content, .clientarea, .clientmain, div#usercreateform, .clientleftmenu, .clientrightmenu
	{
		width:100% !important;
		margin:0px !important;
		padding:0px !important;
		min-width: 100% !important;
		
	}
	*/	
	
	/* CART TABLE HACK */
	/*
	table.cartable,
	table.cartable tbody,
	table.cartable tr, 
	table.cartable td, 
	table.cartable th
	{
		display:block !important;
		
	}
	*/
	
		
	.products,.quantities,.amounts,.cartsubtotal
	, .products div,.quantities div,.amounts div,.cartsubtotal div
	, .products span,.quantities span,.amounts span,.cartsubtotal span
	{
		padding-left:0px !important;
		padding-right:0px !important;
		margin-left:0px !important;
		background-color: transparent !important;
		
	}
	
	.helpbutton{
		width:20px !important;
		margin:5px !important;
		height:20px !important;
	}
	
	/*
	.products{	clear:both !important;}		
	.amounts,.quantities,.cartsubtotal{	text-align:right !important;}
	*/
	table.cartable, table.ordertable{
		min-width:10px !important;
		width:100% !important;
	}
	
	.cartselect div.offer
	,.cartselect div.offerSmall{
		width:100%;
		
		margin-left:0px;
		margin-right:0px;
		padding-bottom:20px;
	}
	
	.cartselect div.offer div,
	.cartselect div.offer p button{
		clear:both !important;
		float:left !important;
		display: block;
		
		
	}
	
		
	.cartselect div img{
	width:25.25% !important;
	}
	
	.cartinfoscontainer div.contentdiv div
	,.cartinfoscontainer div.contentdiv p
	,.cartinfoscontainer div.contentdiv ul
	,.cartinfoscontainer div.contentdiv li
	,.cartinfoscontainer div.contentdiv span
	,.cartinfoscontainer div.contentdiv h2
	,.cartinfoscontainer div.contentdiv h1
	,.cartinfoscontainer div.contentdiv select
	{
		padding-left:0px !important;
		
		width:100% !important;
		min-width:100% !important;
		/*border:1px solid #cccccc;*/
		
		padding-right:0px !important;
		 
	}
	
	.clientmain .contentdiv .contentdiv{
		display:none !important;
		
	}	
	
	/* barre de suivi de commande et etat non actif*/
	.statediv{display:none;}
	.statelifediv{background-image: none;}
	
	
	.menuline div{
		display: none;
	}
	
	
	
	#responsive_menuline_menu{
		display:block;
		width:100%;
		margin-bottom:20px;
	}
	
	div.contentdiv div{
		clear:both !important;
		float:left !important;
		height:auto !important;
	}
	div.contentdiv div.homeblank
	,div.contentdiv div#slogan
	,div.contentdiv div.homeimage
	{
		display:none;
	}
	
	#title #title_left
	,#title #title_right
	{
		float:left;
		width:100%;
		
	}
	
	.infos{
	width:100%;
	}
	
	.clientarea .leftmenu img{
	margin:0px;
	}
	
	.userformulaire
	,.userformulaire div
	,.userformulaire p{
		width:100% !important;
		padding:0px;
		clear:both !important;
		float:left;
		display:block;
	}

}

/* MOBILE & DESKTOP AVEC LARGEUR ARRIVANT A 900px */
@media screen and (max-device-width: 480px)
       ,screen and (max-width: 900px)
{
	

	
	/* disparition des legendes plateformes du haut */ 
	#title .legende {display:none;}
	
	
	
	.cartinfoscontainer{
		min-height: 500px; 
		margin:0px;	
	}	
		
	
		
	.clientarea div{
		/*border:1px solid #cccccc;*/
	}
	
	.clientleftmenu, .clientleftmenu div.leftmenu{
		width:100%;
		border:none;
	    /** OMBRAGE **/
	    -moz-box-shadow: none;/*2px 2px 6px #444;*/
	    -webkit-box-shadow: none;/*2px 2px 6px #444;*/
		box-shadow: none;/*2px 2px 6px #444;*/		
	}
	.clientleftmenu li{
		float:left;
	}
	.clientleftmenu ul.subMenu li{
		clear:both;
	}	
	
	.clientmain{
		float:left;
	}
	
	
	/*.clientmain */div#usercreateform table
	{
		
		width:99%;
	}	
	
	/*.clientmain */div#usercreateform table tr
	,/*.clientmain */div#usercreateform table tr td
	,/*.clientmain */div#usercreateform table tr th{
		display: block !important;
		
		width:96% !important;
		padding-left:0px !important;
		padding-top:5px !important;
	}
	
	./*clientmain */div#usercreateform table tr td input
	,/*.clientmain */div#usercreateform table tr th input{
		width:96% !important;
	}	
	

}


/* MOBILE & DESKTOP AVEC LARGEUR ARRIVANT A 1280 */
@media screen and (max-device-width: 480px)
       ,screen and (max-width: 1280px)
{

}


/* MOBILE & DESKTOP AVEC LARGEUR ARRIVANT A 640px */

@media screen and (max-device-width:480px)
 ,screen and (max-width: 640px)
{
	
	#maindiv{
		border-radius:0px !important;
	}
	
	body, .contentdiv,
	#maindiv, 
	#title, 
	#menu, 
	#content, 
	.clientarea, 
	.clientmain,
	/*.clientmain */div#usercreateform, 
	.clientleftmenu, 
	.clientrightmenu,
	.cartsselection
	
	{
		width:100% !important;
		margin:0px !important;
		padding:0px !important;
		min-width: 100% !important;
		
	}
	
	
	#menu, #customerselectbartoolbar{
		clear:both !important;
		height:100% !important;
	}
	

	.menubar{
		height:100% !important;
	}
	
	/* Petit trick pour que la hauteur de la classe .menubar s'adapte au niveau de sa couleur de fond car elle a des float comme enfants */
	/*	en gros , ca rajoute un block apres les enfants flotants de la class .menubar	*/ 
	.menubar:after {
		display: block;
		clear: both;
		content: "";
	}	

	/*	div barre d'etapes du panier */
	.cartStep {
		
		float:left !important; 
		margin-right:0px !important;
		margin-top:20px;
		margin-bottom:20px;
	}
	
	.cartStep table
	,.cartStep table tbody
	,.cartStep table thead
	,.cartStep table tfoot
	,.cartStep table tr
	,.cartStep table td
	,.cartStep table th
	{
		display: inline-block !important;
		
	}

	.step{
		min-width:none !important;
		
	}
	.clientarea .clientmain1{
		display:none !important;
	}	

	/*.clientarea */.clientrightmenu{
		clear:both !important;
		float:left !important;
		min-height:300px;
		
	}		
	
	.infos
	, .infoheader
	, #usercreateform
	, #usercreateform table th
	, #usercreateform table tr	
	{
		border: none !important;
		padding:0px !important;
		border-radius:0px !important;
		
	}
	
	.infoheader{
		padding:5px !important;
		border-bottom: 1px solid !important;		
	}
	
	.infos{
		width:100% !important;
		float:left !important;
	}	

	.marketcontainer{
		padding-left:0px !important;
		padding-right:0px !important;
	}

	.marketcontainer div{
		clear:both !important;
		margin:0px !important;
		
	}
	
	.marketcontainer div#marketvideo{
		display:none !important;
	}	

	.clientmain{
		clear:both !important;
		float:left !important;
	}
	
	.clientleftmenu{
	float:left !important;
	}	
	/*
	.clientrightmenu{
		
		clear:both !important;
		width:100% !important;
		min-width:100% !important;
	}
	*/

		
}


/* MOBILE & DESKTOP AVEC LARGEUR ARRIVANT A 480px */
/*
@media screen and (max-device-width:480px)
 ,screen and (max-width: 320px)
{
	

}*/