/* RESET */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

a, img { border: none;
		text-decoration: none;
		outline: none; }
a, li { cursor: pointer; }

.clear { clear: both; }
/* * * * * * FONT FACE * * * * * */

@import url(http://fonts.googleapis.com/css?family=Rokkitt:400,700);

h1 { font-size: 28px; color: #393939; }

* {
    color: #535353;
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    outline: none;
    padding: 0;
}

html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    text-align: center;
    width: 100%;
    
   background-color: #fff; 
   background: url(../img/header_back.png) top center no-repeat; 
}

.wrap {  position: relative; width: 100%; margin: 0 auto;	min-height: 100%;  }

#fr { background: url(../img/back.png) no-repeat top center ; }
#it { background: url(../img/back_it.png) no-repeat top center ; }
#es { background: url(../img/back_es.png) no-repeat top center ; }
#en { background: url(../img/back_en.png) no-repeat top center ; }
#de { background: url(../img/back_de.png) no-repeat top center ; }

/* * * * HEADER * * * */
div#header { width: 100%; height: 70px; }
div#header div#sous_menu { height: 0px; width: 100%; background: url(../img/sous_menu_back.png) repeat-x top ;  }
div#header div#header_bandeau { background: url(../img/header_repeat.png) repeat-x top ; width: 100%; height: 100px; }
div#header div#header_content { width: 1020px; margin-left: auto; margin-right: auto; position: relative; height: 40px; }
div#header_back { position: absolute; top: 0; left: 0; right: 0; z-index: 100; }
div#header div#header_content div#header_front { z-index: 9000; position: absolute; text-align: center; float: left; }
div#header div#header_content div#header_front img { float: left; }
div#header div#header_content div#logo { z-index: 9999; position: absolute; left: 35px; }

div#bloc_menu { width: 940px;  margin-left: auto; margin-right: auto; position: relative; margin-bottom: 50px; margin-top: -10px;}
div#bloc_menu ul { float: right; }
div#bloc_menu ul li { display: inline; margin-left: 40px; }
div#bloc_menu ul li span { font-size: 20px; text-transform: uppercase; color: #b4b4b4; font-weight: 100; }

div#bloc_menu ul a#news:hover li span { color: #A90408; }
div#bloc_menu ul a#geek:hover li span { color: #CBED03; }
div#bloc_menu ul a#glam:hover li span { color: #BD6796; }
div#bloc_menu ul a#sport:hover li span { color: #02CE57; }
div#bloc_menu ul a#gamer:hover li span { color: #00537D; }

/* * * * SECTION * * * */


div#section { position: relative;	margin:auto; width: 940px; height: auto; }
div#section div#mise_en_avant { width: 940px;  margin-left: auto; margin-right: auto; position: relative;  height: 120px; }
div#section div#content {  width: 100%; height: 100%; float: left; margin-top: 0px;  }
div#section div#content div.article { width: 940px;  margin-left: auto; margin-right: auto; position: relative; margin-top: 30px; z-index: 9999; }

div#section div#content div.article div.article_content { margin: 20px 20px 0 20px; height: 100%;text-align: justify;  }
div#section div#content div.article div.article_content  div.article_titre { float: left; width: 435px; }
div#section div#content div.article div.article_content  div.article_infos { float: left; width: 435px; color: #535353; font-size: 14px; font-weight: bold; margin-top: 20px; margin-bottom: 20px; }
div#section div#content div.article div.article_content  div.article_infos img { padding: 0; margin: 0 10px 0 0 ;float: left; width: 24px; height: 24px; }
div#section div#content div.article div.article_content  div.article_infos span { float: left; margin-top: -4px;}
div#section div#content div.article div.article_content  div.article_infos span.name { margin-top: 5px;}

div#section div#content div.article div.article_content  div.article_image { float: right; position: relative; width: 405px; margin:0 0 20px 20px;}
div#section div#content div.article div.article_content  div.article_image ul.share { float: right; margin-bottom: 20px; }
div#section div#content div.article div.article_content  div.article_image ul.share li { display: inline; float: right; margin-left: 10px;}
div#section div#content div.article div.article_content  div.article_image img { float: right; }
div#section div#content div.article div.article_content span.texte {color: #535353; font-size: 14px;  line-height: 18px; margin-top: 20px; text-align: justify;  }
div#section div#content div.article div.article_content span.texte strong { font-weight: bold;color: #535353; }

.padd { margin-bottom: 0; padding-bottom: 218px; }

/* * * * FOOTER * * * */

div#footer { position: absolute;	bottom: 0; left: 0;	width: 100%; background-color:#0F0F0F; height:218px;  }
div#footer div#footer_repeat {    width: 100%;  float: left; height: 218px; }

div#footer div#footer_back { float: left; width: 100%; height: 218px; background: url(../img/footer.jpg) no-repeat center bottom; z-index: 19; }

div#footer div#footer_back div#footer_content { width: 940px;  margin-left: auto; margin-right: auto; position: relative;  }
div#footer div#footer_back div#footer_content img#telechargement { float: left; margin-top: 60px; }
div#footer div#footer_back div#footer_content div#bloc_btn { float: left; height: 68px; width: 437px; margin: 60px 0 0 10px; }
div#footer div#footer_back div#footer_content div#bloc_btn div#colonne_android { float: left; width: 161px; margin-right: 6px; }
div#footer div#footer_back div#footer_content div#bloc_btn div#colonne_apple { float: left; width: 130px; margin-right: 6px; }
div#footer div#footer_back div#footer_content div#bloc_btn div#colonne_apple img#first { margin-bottom: 2px; }

div#footer div#footer_back div#footer_content div#bloc_btn div#colonne_windows {  float: left; width: 130px; }
div#footer div#footer_back div#footer_content div#bloc_btn div#colonne_windows img#first { margin-bottom: 2px; }
div#footer div#footer_back div#footer_content div#logofooter { float: right; margin-top: 70px; }
div#footer div#footer_back div#footer_content div#logofooter img { float: right; }