/*
	960 Grid System ~ Core CSS.
	Learn more ~ http://960.gs/

	Licensed under GPL and MIT.

	COLORS
	verd: #97bf0d
	blau: #0c3183
	vermell: #BC0F0F
	verd gimp: #97c00e
*/

html {-webkit-text-size-adjust: none;}

/* =Containers
--------------------------------------------------------------------------------*/
	.container_16{position:absolute; z-index:-2; width:100%; background:#fff;overflow:hidden; margin-bottom:25px}
	
	.container_16 .grid_16{width: 98%;}
	.container_16 .grid_14{width: 85.5%;}
	.container_16 .grid_11 {width:98%;}
	.container_16 .grid_10 {width:98%;}
	.container_16 .grid_9 {width:98%;}
	.container_16 .grid_7 {width:98%;}
	.container_16 .grid_6 {width:98%;}
	.container_16 .grid_5 {width:98%;}
	.container_16 .grid_4 {width:98%;}
	.container_16 .grid_3 {width:98%;}
	.container_16 .grid_2 {width:98%;}

/* =Grid >> Global
--------------------------------------------------------------------------------*/

.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16, 
.grid_3_into_9, .grid_6_into_9, .grid_5_3{display: inline; float: left; margin-left: 1%; margin-right: 1%;}

/* =Clear Floated Elements
--------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

html body * span.clear,
html body * div.clear,
html body * li.clear,
html body * dd.clear {background: none;border: 0;clear: both;display: block;float: none;font-size: 0;list-style: none;
	margin: 0;padding: 0;overflow: hidden;visibility: hidden;width: 0;height: 0;}

/* http://www.positioniseverything.net/easyclearing.html */
.clearfix:after{clear: both;content: '.';display: block;visibility: hidden;height: 0;}
.clearfix{display: inline-block;}
* html .clearfix{height: 1%;}
.clearfix{display: block;}

/* -------------------------------------------------------------------
PERSONNALISATION
------------------------------------------------------------------- */

@media screen and (min-width: 321px){
	.container_16 .grid_4  {width: 48%;}
	#menu_bar span.bt-title {padding-left:18px;}
}

@media screen and (min-width: 650px){
	.container_16 .grid_2  {width: 30%;}
	.container_16 .grid_3  {width: 30.666666667%;}
	.container_16 .grid_4  {width: 48%;}
	.container_16 .grid_5  {width: 36%;}
	.container_16 .grid_9  {width: 66%;}
	.container_16 .grid_11 {width: 60%;}
	
	#menu_bar, #phone_bar{display:none}
	#banner  {display:block;}

	#logo_bar {display:block; position:relative}
	#logo_bar .phones{position:absolute; top:8%; right:1%; text-align:right;}
	#logo_bar .city{color: #BC0F0F;font-size: 1.8em;font-weight:bold;}
	#logo_bar .phone{color:#000;font-weight:bold;font-size: 1.2em;margin-bottom:10px;display:block;}
	
	#logo_bar h1 {padding:0; margin:0}

	#menu {display:block; background:#fff; position:relative; top:0; left:0}
	
	#banner .nav-top {background-color:#41403b; height:25px; width:100%; overflow:hidden; margin-bottom:3px}
	#banner .nav-top a {display: block; float:left; color:#e5c882; text-decoration: none; letter-spacing:0.6px; 
		line-height:27px; font-size:11px; font-weight:bold; padding:0 15px; margin-right:5px;}
	#banner .nav-top a:hover{color:#ccc}
}

@media screen and (min-width: 960px){
	.container_16 .grid_4  {width: 23%;}
	.container_16 .grid_5  {width: 29.25%;}
	.container_16 .grid_11 {width: 66.75%;}
	
	/* Picker */
	#container {display:block}
	
	#logo_bar .phones{position:absolute; top:18%; right:1%; text-align:right;}
	#logo_bar .city{color: #BC0F0F;font-size: 1.8em;font-weight:bold;}
	#logo_bar .phone{color:#000;font-weight:bold;font-size: 1.4em;margin-bottom:14px;display:block;}
}

@media screen and (min-width: 1100px){

	#logo_bar .phones{position:absolute; top:20%; right:1%; text-align:right;}
	#logo_bar .city{color: #BC0F0F;font-size: 2.4em;font-weight:bold;}
	#logo_bar .phone{color:#000;font-weight:bold;font-size: 1.6em;margin-bottom:18px;display:block;}
}

@media screen and (min-width: 1281px){
	.container_16{position:absolute; z-index:-2; width:88%; margin-left:10%; margin-right:10%; background:#fff;
			overflow:hidden;  margin-bottom:25px}
	/* #logo_bar .city,#logo_bar .phone{position:absolute; top:60%;left:2%;font-size: 1.8em;color: #fff;font-weight: bold;} */

}