*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
* {
	margin: 0 ;
	padding: 0 ;
}
html {
	height: 100% ;
}
body {
	font-family: Verdana, Arial, Helvetica, sans-serif ;
	background: #000 ;
	font-size: 12px ;
	color : #fff ;
	width: 100% ;
	height: 100% ;
}
img { 
	border: 0 ;
	vertical-align:middle ;
}
#super_global {
	position: relative ;
	height: 100% ;
}
#global {
	position: fixed ;
	background: #000 url( ../images/fond-page.jpg ) center center no-repeat ;
	background-size: cover ;
	height: 100% ;
	width: 100% ;
	opacity: 0 ;
}
#diapohide {
	display: none ;
}
#main-accueil {
	position: absolute ;
	width: 100% ;
	padding: 15px ;
	margin: 0 0 30px 0 ;
}
#logo-accueil {
	position: relative ;
	height: auto ;
	display: inline-block;
}
#logo-accueil img {
	width: 100% ;
	height: auto ;
}
#content-accueil {
	font-size: 1.5em ;
}
#logo-accueil,
#content-accueil {
	overflow:hidden;
}
#content-accueil-gauche,
#content-accueil-droite {
	position: relative ;
	display: inline-table ;
	width: 100% ;
	max-width: 370px ;
	background: rgba( 0,0,0,.5) ;
	padding: 10px ;
	margin: 0 0 10px 0 ;
	border-radius: 20px ;
}
#content-accueil-center a,
#content-accueil-center a:link,
#content-accueil-center a:visited {
	color: inherit ;
	text-decoration: none ;
}
#content-accueil-gauche:hover,
#content-accueil-droite:hover {
	background: rgba( 0,0,0,1) ;
	cursor: pointer ;
}
.divarticle {
	color: white ;
	text-shadow: 0.1em 0.1em 0.2em #000 ;
}
.divarticle a,
.divarticle a:link,
.divarticle a:visited {
	color: inherit ;
	text-decoration: none ;
}
.divarticle a:hover {
	color: inherit ;
	text-decoration: none ;
}
.divarticle img {
    max-width: 100%;
    height: auto;
}
.divarticle h6 {
	font-size: 160% ;
	color: orange ;
	padding: 0 ;
	margin: 0 0 15px 0 ;
}
@media screen and (min-width: 800px) {
	#logo-accueil {
		margin: 0 0 20px 0 ;
	}
	#content-accueil {
		position: fixed ;
		bottom: 50px ;
		width: 100% ;
		margin: 0 auto ;
		font-size: 1.5em ;
	}
	#content-accueil-center {
		position: relative ;
		width: 400px ;
		margin: 0 auto ;
	}
	#content-accueil-gauche {
		margin: 0 50px 0 0 ;
	}
	#innerfooter {
		max-width: 100% ;
	}
}
@media screen and (max-width: 450px) {
	#logo-accueil {
		margin: 0 auto 10px auto ;
		text-align: center ;
	}
	#logo-accueil img {
		width: 80% ;
	}
	#content-accueil {
		position: relative ;
		width: 100% ;
		margin: 0 auto ;
		font-size: 1em ;
	}
	#content-accueil-gauche {
		margin: 0 0 10px 0 ;	
	}	
	#content-accueil-droite {
		margin: 0 0 10px 0 ;
	}
	#innerfooter {
		max-width: 100% ;
	}
}
@media screen and (min-device-width: 320px) {
}
@media screen and (min-device-width: 360px) {
}
@media screen and (min-device-width: 375px) {
}
@media screen and (min-device-width: 412px) {
}
@media screen and (min-device-width: 414px) {
}
@media screen and (min-device-width: 800px) {
}
#footer {
	position: fixed ;
	bottom: 0px;
	width: 100% ;
	background: black ;
	opacity: .5 ;
}
#innerfooter {
	position: relative ;
	color: #fff ;
	font-size: .8em ;
	padding: 3px ;
	text-align: center ;
	max-width: 100% ;
}
#footer a:link, #footer a:visited, #footer a:hover {
	text-decoration: none ;
	color: #F0F0F0 ;
	border-bottom: 1px dotted #f0f0f0 ;
}
.fontSize1 {
	font-size: 8px;
}
.fontSize2 {
	font-size: 12px;
}
.fontSize3 {
	font-size: 16px;
}
.fontSize4 {
	font-size: 18px;
}
.fontSize5 {
	font-size: 24px;
}
.fontSize6 {
	font-size: 36px;
}
.fontSize7 {
	font-size: 48px;
}
