/* =============================================================================
   CONTENT
   ========================================================================== */
#guide {	
  float: left;
  width:100%;
  position:relative;
  padding:15px;
  overflow:hidden;  
}

#guide_content {
	position: relative;	
	float:left;
	display:inline-block;
	width:76%;
	font-size:18px;
	margin:15px 0px;
	line-height:20px;
	min-height:900px;
}

#guide_content .mobile-content {
	display: none;
}

#guide_aside {
	position: relative;
	float:left;
	display:inline-block;
	width:24%;
	height:100%;
	z-index:0;
	padding:25px 0px 0px 20px;
}

#guide_footer {
	position: relative;
	display:none;
	float:left;
	width:100%;	
	z-index:0;
	padding-left:10px;
}

#guide_footer img {
	width:100%;
} 




/* =============================================================================
   MENU ASIDE
   ========================================================================== */

ul#nav_guide {
	position: relative;
	width:100%;
	margin-left:5%;
	background: rgba(255,255,255,0.1);
	border-radius: 3px;
	padding-left:30px;
	box-shadow: 0px 1px 5px #000;
	box-shadow: 0px 1px 5px #000;
	text-align:left;
}
ul#nav_guide ol, #nav_guide li, ul#nav_guide, ul#nav_guide ul {
	list-style: none;
	margin: 0;
	padding: 0;
	border: 0;
}
ul#nav_guide h2 {	
	font-size:14px;
	font-weight:normal;
	color: rgba(255, 255, 255, 0.8);
	text-shadow: -1px 1px 8px #7aff61, 1px -1px 8px #43df26;
	text-transform:uppercase;
	margin:0;
	padding:10px;
}
ul#nav_guide a h3 {
	font-size:18px;
	line-height: 12px;
	font-weight:normal;
	text-transform:uppercase;		
	color: #cdcdcd;
	margin:6px;
	padding:0;
	padding-left:5px;		
	margin:8px;	
}
ul#nav_guide a h3 i {
	float:right;
	color: #cdcdcd;
	font-size: 17px;
}
ul#nav_guide a:hover h3 {
  color: #fff;
}
ul#nav_guide_arrow {	
	position:absolute;
	left:-7px;
	top:7px;
	z-index:211;
}
ul#nav_guide li ul { 
	width:100%;
}
ul#nav_guide li ul a {
	text-decoration: none;
	font-size:16px;
	color: #cdcdcd;
}
ul#nav_guide li ul li {
	width:100%;
	padding:6px 40px;
	border-bottom: 1px solid #1e1f1f;	
}
ul#nav_guide li {
	border: none;
}
ul#nav_guide li:last-child {
	border-bottom: none;
}

/* MENU ASIDE HOVER */
ul#nav_guide a.heading { 
	display: block;
	padding:4px;
	text-decoration: none;
}
ul#nav_guide a.heading:hover, 
ul#nav_guide li.ui-accordion-selected a.heading, 
ul#nav_guide li.current a.heading, 
ul#nav_guide li ul li:hover, 
ul#nav_guide li ul a.current li { 
	background: transparent url(../img/pattern/pattern_bluelight.gif) repeat;
	color: #fff;
}




/* =============================================================================
   MENU BLOCS
   ========================================================================== */
.nav_blocs {
	position: relative;
	float: left;
	list-style: none;
	width: 100%;
	text-align:left;
	height: auto;	
	margin:0;
	padding:0;
}
.nav_blocs ul {
	list-style: none;
	position: relative;
	display: inline-table;
}
.nav_blocs li {
	position:relative;
	float:left;
	display:inline-block;	
	width:25%;	
	padding:10px;
}
.nav_blocs li a {
	position:relative;
	display:block;
	width:100%;
	opacity:0.8;
	transition:all 0.3s ease;
	border: rgb(23,101,137) 1px solid;
}
.nav_blocs li a:hover, 
.nav_blocs li a.current {
	opacity:1;
	border: #cdcdcd 1px solid;
}
.nav_blocs li a img {
	width:100%;
}
.nav_blocs .nav_rub {	
	position: absolute;
	bottom:0;
	left:0;	
	width:100%;	
	height:30px;
	background: rgba(0,0,0,0.8);
	padding:5px 8px 8px 10px;
	font-family: 'helioscondbold', Arial, "Helvetica CY", Helvetica, sans-serif;
	font-size:18px;
	color:#FFF;
	text-transform: uppercase;
	font-weight: normal;
	text-shadow: 0 0 4px #000;
}


/* =============================================================================
   HOME
   ========================================================================== */
#guide_home {	
	position: relative;
	float:left;
	display:inline-block;
	width:100%;
	padding:20px 10px 10px 0px;
}
#home_header {
	float:left;
	position: relative;
	width:100%;
	margin-bottom:15px;
	padding-left:5px;
}
#home_texte {
	display:inline-block;
	float:left;
	position: relative;
	width:50%;
	padding:5px 35px 0px 0px;
	color:#eee;	
	float:left;
	text-align: justify;	
}
#home_img {	
	position: relative;
	float:right;
	display:inline-block;
	width:50%;	
}
#home_img img {	
	width:100%;
	border: 1px solid #4978BD;
}

/* BOUTONS DISCOVER */
#btn-discover {
	position: relative;
	float: left;	
	display: inline-block;
	font-family: 'helioscondregular', Arial, "Helvetica CY", Helvetica, sans-serif;
	font-size: 18px;
	width:386px;
	height:34px;
	vertical-align: top;
	text-align:left;
	padding: 8px 0px 5px 8px;
	margin: 15px 0px 0px 0px;
	background: transparent url(../img/home/discover_back.png) no-repeat;
	background-position:0px 0px;	
	color:#fff;
	transition:none;
}
#btn-discover:hover {
	color:#fff;
	background-position:0px -40px;
}
#btn-discover span {
	width:100%;
}
#discover_icon {
	position: absolute;
	width:30px;
	height:30px;
	top:2px;
	left:5px;
}
#txt_discover {
	float: left;
	margin-left:35px;
	width:auto;
}

	
/* =============================================================================
   GENERAL
   ========================================================================== */
.guide_title, .guide_subtitle {
	background: transparent url(../img/pattern/pattern_bluelight.gif) repeat;	
	color: #fff;
	font-family: 'helioscondbold', Arial, "Helvetica CY", Helvetica, sans-serif;
	font-size: 26px;
	line-height:24px;
	text-align:left;
	text-transform: uppercase;
	padding: 10px 10px 8px 10px;
	margin: 10px 10px 10px 0px;
}
.guide_title {
	padding: 10px 10px 8px 43px;
}
.guide_icon {
	position: absolute;
	width:30px;
	height:30px;
	top:15px;
	left:5px;
}

#guide_header {
	width:100%;
	padding-right:10px;	
}
#guide_header img {
	width:100%;
}
.guide_header_margin {
	margin: -24px 0px 0px 0px;
}

/* TEXTES ET SCREENS */
.guide_txt {
	/*float:left;*/
	width:100%;
	padding:10px 15px 10px 10px;
	text-align: left;
}
.guide_txt b, .guide_txt a {
	color:#4978BD;
}
.guide_txt b.bigger{
	text-transform: uppercase;
	font-size: 24px
}
.guide_txt_only {
	float:left;
	width:100%;
	padding:10px;
	text-align: left;
}

/* SCREENS */
.guide_screen {
	position: relative;
	display:inline-block;
	width:50%;
	padding:15px 10px 10px 10px;
}
.guide_screen img {
	border: #ac0000 1px solid;
	width: 100%;
}
.guide_screen .zoom {
	position: absolute;
	z-index:4;
	bottom:14px;
	right:10px;
	width:39px;
	height:39px;
	padding:0;
	margin:0;
	background: url(../img/screen_zoom.gif) top center no-repeat;
}
.guide_screen .hover {	
	position: absolute;
	z-index:3;
	opacity:0.7;
	top:15px;
	left:10px;
	width: 100%;
	display: none;
	cursor: pointer;
	border:none;
	padding-right:20px;
	overflow:hidden;
	transition: all 200ms linear;
}
.guide_screen .hover img {
	width: 100%;
	border: #4978BD 1px solid;
}


.guide_separateur {
	float:left;
	width:100%;
	padding:0;
}

.real_table, .real_table td{
	border: 1px solid grey;
}


/* =============================================================================
   BOUTONS DE NAVIGATION EN BAS DE PAGE
   ========================================================================== */
.guide_btn_left,
.guide_btn_right {
	display: inline-block;
	position: relative;	
	font-family: 'helioscondregular', Arial, "Helvetica CY", Helvetica, sans-serif;
	background-color: rgba(255,255,255,0.1);
	color:#fff;
	font-size: 16px;
	text-transform:uppercase;			
	height:34px;
	text-align:left;
	padding: 9px;
	margin-top:30px;	
}
.guide_btn_left {z
	float: left;
	padding-left: 5px;
	padding-right: 12px;
}
.guide_btn_right {
	float: right;
	padding-right: 10px;
	padding-left: 12px;
	margin-right:10px;
}
.guide_btn_left:hover,
.guide_btn_right:hover {
	background: #af8554;
	color:#000;
}
.guide_btn_left i,
.guide_btn_right i  {
	margin-left:4px;
	margin-top:-4px;
	display: inline-block;
	position: relative;
	font-size: 14px;
}







/* =============================================================================
   MEDIAQUERIES DESKTOP
   ========================================================================== */	
@media only screen and (max-width:1040px) {	

	/* GENERAL */
	#guide_content {
		width:100%;
	}
	#guide_aside {
		display:none;
	}
	#guide_footer {
		display:block;
	}
	.nav_blocs li {
		width:33.33%;
	}
	#guide_header {
		padding-right:0px;
	}

	/* TEXTES ET SCREENS */
	#guide_content {
		padding-left:0px;
	}
	.guide_subtitle {
		margin-right:0px;
	}
	
	
}	  



/* =============================================================================
   MEDIAQUERIES TABLET
   ========================================================================== */	

@media only screen and (max-width:768px) {	

	/* HOME JEU */
	#home {	
		padding:0;
	}
	/* NAV BLOCS */
	.nav_blocs .nav_rub {	
		font-size:16px;
	}
	#home_blocs {	
		font-size:14px;
		padding:8px;
	}
	
	
}

@media only screen and (max-width:700px) {	
	/* NAV BLOCS */
	.nav_blocs li {	
		width:33%;	
		padding:4px;
	}
	/* HOME JEU */
	#home {	
		padding:0;
	}	
	#home_texte {
		width:100%;
		padding:15px 0px 0px 0px;
	}
	#home_img {	
		width:100%;
	}		
}	



/* =============================================================================
   MEDIAQUERIES MOBILE
   ========================================================================== */	
@media only screen and (max-width:500px) {	
	/* NAV BLOCS */
	.nav_blocs li {	
		width:50%;	
		padding:4px;
	}		
	.nav_blocs .nav_rub {	
		height:45px;
	}
		
	
}




