html {
height : 100%;
}

html{font-size:100%;} 
@media(max-aspect-ratio : 1/1) { html{font-size : 180%; }}

body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-family : 'SegoeUILight';
  background-color : black;
}

.tab1_separateur {
	width  : 100%;
	height : 2px;
	background-image : url('img/tab1_separateur.jpg');
	
	margin-bottom : 0px;
}

a {text-decoration : none;}
bold {font-family : 'SegoeUIBold';font-weight : normal;}

/* ---------------------------------------------------------------------------------------------
------------------------------------------- MENU --------------------------------------------
----------------------------------------------------------------------------------------------*/

#menu_nav {
	z-index : 100;
	position:fixed;
	top:0;
        font-size : 1.2em;

	width:100%; 
	background-color: rgba(0,0,0,0.9);
	background-image: url('img/fond_menu.jpg');

	display : table-cell;
}

#separateur_menu {
	margin-bottom : 4px;
}
#menu_tableaux, #m_tab0 {

	display : inline-block;
	height : 100%;
}

#m_tab0 {
	vertical-align : bottom;
	width : 20%;
}
#menu_tableaux {
	width : 79%;
	text-align : right;
}

#logo_menu {
	height : 2.5em;
	position : relative ;
	left : 30px;
}

.div_menu {
	display : inline-block;
	height : 100%;
}


h1.light { font-family : 'CheapPotatoes'; margin-right : 20px;margin-left : 20px;}

h1.bold, h1.light {
	display : inline-block;

	font-size : 0.8em;
	font-weight : normal;
	color : #FFFFFF;
	text-decoration : none;
}

@media (max-aspect-ratio : 1/1) {
	#logo_menu { 
		height : 200px; 
	}
	#menu_tableaux {
		width : 100%;
	}
	h1.bold, h1.light {font-size : 2em;}
	.div_menu {
		width : 100%;
	}
}

#img_collapse {
	height : 140px;
}

#bouton_collapse {
	display : none;
}

@media (max-aspect-ratio : 1/1) {
	#bouton_collapse { 
		display : inline-block;
		position : absolute;
		top : 0;
		right : 0;
	}
	#menu_tableaux {
		display : none;
	}
}

/* ---------------------------------------------------------------------------------------------
------------------------------------------HEADER-------------------------------------------
----------------------------------------------------------------------------------------------*/

header {
	height : 100%;
	width : 100%;
	padding : 0;
}

#titre_du_haut_2 {
	font-family : 'ChaletComprimee';
	color : #FFFFFF;
	font-size : 1.3em;
	font-weight : normal;
}

#titre_du_haut_1{
    font-family : 'CheapPotatoes';
    color : #FFFFFF;
    font-size : 2.5em;
    font-weight : normal;
}
#titre_du_haut_2 .space {
    letter-spacing : 0.2em;
}
#titre_du_haut_1 .space {
    letter-spacing : 1.5em;
}

.vitesse {
	width : 100%;
	position : absolute;
	top:0;
	height : 100%;
	text-align : center;
}

#container_menu_h, #cercle, #logo{
	display : inline-block;
}
#container_menu_h {
        margin-bottom : 40px;
}

#vitesse_fond {
	position : absolute;
	z-index : -10;
	height : 100%;
	background-image: url('img/fond_0.jpg');
    background-repeat: no-repeat;
    background-size: cover;
	-webkit-background-size: cover;
    background-position: center;
}
#vitesse_triangle {
	height : 100%;
	width : 100%;
	position : relative;
	z-index : -8;
	background-image: url('img/fond_01.png');
    background-repeat: no-repeat;
    background-size: cover;
	-webkit-background-size: cover;
    background-position: center;
}

#vitesse_logo {
	z-index : 1;
}

#fond {
	width : 100%;
	min-height : 100%;
}	

#pre_logo{
	width : 100%;
	height : 15%;
}
#logo {
	height : 25%;
}

.lien_menu_h {
	display : inline-block;
	margin-top : 10px;
	margin-right : 40px;
	margin-left : 40px;
	position : relative;
	}

.lien_menu_h:hover, .lien_menu_h:focus, .lien_menu_h:active, h1.light:hover, h1.light:focus, h1.light:active{
   -webkit-stroke-width: 3px;
   -webkit-stroke-color: #FFFFFF;
   -webkit-fill-color: #FFFFFF;
   text-shadow: 1px 0px 5px white;
   
   -webkit-transition: width 0.8s; /*Safari & Chrome*/

   transition: width 0.8s;

   -moz-transition: width 0.8s; /* Firefox 4 */

   -o-transition: width 0.8s; /* Opera */

   }



.titre_h_ho {
	z-index : 1;
	
	font-family : 'CheapPotatoes';
	font-size : 0.8em;
	font-weight : normal;
	color : white;
}

#masque_menu {
	width : 100%;
	height : 100%;
	background-color : rgba(0, 0, 0, 0.6);
	
	position : absolute;
	z-index : -1;
}

/* ---------------------------------------------------------------------------------------------
--------------------------------------- TABLEAUX ------------------------------------------
----------------------------------------------------------------------------------------------*/



.texte_tab h1{
	display : inline-block;
	margin-right : 10px;
	margin-bottom : 0;
	margin-top : 0;
	
	font-family : 'CheapPotatoes';
	font-size : 2em;
	font-weight : normal;
}
.texte_tab h2 {
	display : inline-block;
	margin-bottom : 0;
	margin-top : 0;
	
	font-family : 'CheapPotatoes';
	font-size : 2em;
	font-weight : normal;
}

.texte_tab, .image_tab {
	display : inline-block;
	text-align : justify;
	position : relative;
        font-size : 1.2em;
	
	margin : 0;
	margin-bottom : 30px;
	width : 95%;
}

.texte_tab table {
    width : 100%;
}

.texte_tab table .alt {
    color : #98de9f;
}

.texte_tab table .haut_tab {
	font-family : 'SegoeUIBold';
}

.bouton_suivant {
        padding-bottom : 20px;
        width : 100%;
        text-align : center;
}

.bouton_suivant img {
        width : 80px;
        transition : text-shadow 0.8s;
}


/* ---------------------------------------------------------------------------------------------
--------------------------------------- TABLEAU1 ------------------------------------------
----------------------------------------------------------------------------------------------*/

#tableau_1 {
	z-index : 1;
	
	background-color : #000000;
	position : relative;
	padding : 0;
	padding-bottom : 10px;
	text-align : center;
	vertical-align : top;
	
	color : #FFFFFF;
	
	background-image: url('img/fond_tab1.jpg');
}


#separateur_1 {

	margin-bottom : 50px;
	position : relative;
        top : 10px;
	z-index : -6;
	
}
#separateur_2 {
	position : absolute;
	bottom : 10px;
}


#image_tab1 {
	max-width : 500px;
	margin-left : 50px;
	margin-top : 50px;
}
#texte_tab1 {margin-bottom : 20px; margin-right : 20px; bottom : 50px;}

@media(max-width: 1070px) {
	#texte_tab1 {bottom : 0;}
	#image_tab1 {top : 0;}
	}
@media(max-width: 1020px) {
	#image_tab1 {margin-left : 0;}
	}

@media(min-aspect-ratio : 1/1) {
	#texte_tab1 { max-width : 500px; margin-right : 0;}
}

@media(min-width: 1250px) {
	#tableau_1 {min-height : 80%;}
}
@media(max-aspect-ratio : 1/1){#image_tab1 {width : 95%;max-width : 5000px;padding-bottom : 70px;}}	


/* ---------------------------------------------------------------------------------------------
--------------------  INTERTABLEAUX 1 - 2 -----------------------
----------------------------------------------------------------------------------------------*/


#intertableaux_12 {
	position : relative;
	width : 100%;
	height : 80%;
} 	

#fond_intertab_12 {
	width : 100%;
	height : 100%;

	position : absolute;
	bottom: 0;

	z-index : -10;
	
	background-image: url('img/inter_12.jpg');
        background-repeat: no-repeat;
       -webkit-background-size: cover;
        background-size: cover;
        background-position: center center;
}
#vitesse_rond_12 {
	width : 100%;
	height : 100%;

	position : absolute;
	bottom: 0;

	z-index : -5;
	
	background-image: url('img/fond_12.png');
        background-repeat: no-repeat;
       -webkit-background-size: cover;
        background-size: cover;
        background-position: center center;
}

/* ---------------------------------------------------------------------------------------------
--------------------------------------- TABLEAU 2 -----------------------------------------
----------------------------------------------------------------------------------------------*/

#tableau_2 {
	position : relative;
	width : 100%;	

	z-index : 0;
	
	text-align : center;
	color : white;

    background-color : black;
	background-image: url('img/fond_tab2.jpg');

} 
		

#texte_tab2 {
        margin-top : 20px;
        margin-bottom : 20px;
        width : 70%;
}
@media(max-aspect-ratio : 1/1){#texte_tab2 {width : 95%;}}

.video_youtube {
	display : inline-block;
	width : 49%;
	margin : 0.2%;
	max-width : 560px;
	height : 315px;
}
@media(max-aspect-ratio : 1/1){.video_youtube {width : 100%}}

.galerie_photo {
        width : 70%;
        margin-left : 15%;
        text-align : center;
        padding-bottom : 40px;
}
.galerie_miniature {
        display : inline-block;
        margin-right : 20px;
        margin-left : 20px;
        margin-bottom : 20px;
}
/* ---------------------------------------------------------------------------------------------
------------------------------ INTER TABLEAUX 2 - 3 --------------------------------
----------------------------------------------------------------------------------------------*/


#intertableaux_23 {
	position : relative;
	width : 100%;
	height : 80%;

} 	

#fond_intertab_23 {
	position : absolute;
	z-index : -10;
	bottom : 0;
	
	height : 100%;
	width : 100%;

        background-image : url('img/inter_23.jpg');
       -webkit-background-size: cover;
        background-size: cover;
        background-position: center center;
}

#vitesse_rond_23 {
	width : 100%;
	height : 100%;

	position : absolute;
	bottom: 0;

	z-index : -5;
	
	background-image: url('img/fond_23.png');
        background-repeat: no-repeat;
       -webkit-background-size: cover;
        background-size: cover;
        background-position: center center;
}

/* ---------------------------------------------------------------------------------------------
--------------------------------------- TABLEAU 3 -----------------------------------------
----------------------------------------------------------------------------------------------*/

#tableau_3 {
	position : relative;
	width : 100%;	

	z-index : 0;
	
	text-align : center;
	color : white;

    background-color : black;
	background-image: url('img/fond_tab3.jpg');

} 
		


#texte_tab3 {
        margin-top : 20px;
        margin-bottom : 20px;
        width : 70%;
}
@media(max-aspect-ratio : 1/1){#texte_tab3 {width : 95%;}}
/* ---------------------------------------------------------------------------------------------
--------------------  INTERTABLEAUX 3 - 4 -----------------------
----------------------------------------------------------------------------------------------*/


#intertableaux_34 {
	position : relative;
	width : 100%;
	height : 80%;
} 	

#fond_intertab_34 {

	width : 100%;
	position : absolute;
	bottom: 0;

	z-index : -10;
	height : 100%;
	
	background-image: url('img/inter_34.jpg');
        background-repeat: no-repeat;
       -webkit-background-size: cover;
        background-size: cover;
        background-position: center center;
}

#vitesse_rond_34 {
	width : 100%;
	height : 100%;

	position : absolute;
	bottom: 0;

	z-index : -5;
	
	background-image: url('img/fond_34.png');
        background-repeat: no-repeat;
       -webkit-background-size: cover;
        background-size: cover;
        background-position: center center;
}

/* ---------------------------------------------------------------------------------------------
--------------------------------------- TABLEAU 4 -----------------------------------------
----------------------------------------------------------------------------------------------*/

#tableau_4 {
	position : relative;
	width : 100%;	

	z-index : 0;
	
	text-align : center;  
	color : white;

    background-color : black;
	background-image: url('img/fond_tab4.jpg');

} 		

#texte_tab4 {
    width : 70%;
	bottom : 70px;
}
@media(max-aspect-ratio : 1/1){#texte_tab4 {width : 95%;}}

#image_tab4 {
	top : 30px;
	max-width : 500px;
	margin-right : 50px;
}

@media(max-width: 1250px) {
	#texte_tab4 {bottom : 0;}
	#image_tab4 {margin-right : 0;}
	}

@media(min-aspect-ratio : 1/1) {
	#texte_tab4 { max-width : 500px;}
	#image_tab4{}
}
@media(max-aspect-ratio : 1/1){#image_tab4 {width : 95%;max-width : 5000px;padding-bottom : 50px;}}	
/* ---------------------------------------------------------------------------------------------
--------------------  INTERTABLEAUX 4 - 5 -----------------------
----------------------------------------------------------------------------------------------*/


#intertableaux_45 {
	position : relative;
	width : 100%;
	height : 100%;
} 	

#vitesse_rond_45 {
	width : 100%;
	height : 100%;

	position : absolute;
	bottom: 0;

	z-index : -5;
	
	background-image: url('img/fond_12.png');
        background-repeat: no-repeat;
       -webkit-background-size: cover;
        background-size: cover;
        background-position: center center;
}

#fond_intertab_45 {

	width : 100%;
	position : absolute;
	bottom: 0;

	z-index : -10;
	height : 100%;
	
	background-image: url('img/inter_45.jpg');
        background-repeat: no-repeat;
       -webkit-background-size: cover;
        background-size: cover;
        background-position: center center;
}


/*@media(min-width: 1250px) {*/
/*	#tableau_4 {height : 80%;}*/
/*}*/