@charset "UTF-8";
/* CSS Document */



/*----------------------------------------------------------------------------------------------*/
/* general */
/*----------------------------------------------------------------------------------------------*/
html {
}

#container {
margin-right:0px;
margin-left:0px;
background: none;
}

.grandecran {display:none}
.smartphone {display:block}

/*----------------------------------------------------------------------------------------------*/
/* header */
/*----------------------------------------------------------------------------------------------*/
header {
width:320px;
}

.official div,
.menu-item1,
.menu-item2,
.menu-item3,
.menu-item4,
.menu-item5
{background: url(../img/buttons/sprite.png) no-repeat;}


.official {position:absolute;width:100%;bottom:25px;}
.official span {
width:320px;
margin-right:auto;
margin-left:auto;
display:block;
font-family: 'retroville_ncregular';
font-weight:100;
font-size:12px;
color:#FFF;
text-align:center;
  -moz-text-shadow: 2px 2px 10px #000;
  -webkit-text-shadow: 2px 2px 10px #000;
  text-shadow: 2px 2px 10px #000;
}




.official div {display:none}


/*----------------------------------------------------------------------------------------------*/
/* navigation */
/*----------------------------------------------------------------------------------------------*/


.col1 {width:300px;padding:10px}

.col2 br {display:none}
.col2 {width:300px;}
.col2 div {margin-left:0px}
.col2 img {width:90px;margin-left:0px}


nav {}

#menu {
width:320px;
margin-right:auto;
margin-left:auto;

}

.menu-item1 {width:45px}
.menu-item2 {width:45px}
.menu-item3 {width:85px}
.menu-item4 {width:85px}
.menu-item5 {width:60px}


.menu-item1,
.menu-item2,
.menu-item3,
.menu-item4,
.menu-item5
{display:inline;float:left; height:25px;padding: 3px 0px 3px 0px;text-align:center;line-height:25px}

.menu-item3,
.menu-item4
{line-height:11px;}

.menu-item1 span,
.menu-item2 span,
.menu-item3 span,
.menu-item4 span,
.menu-item5 span
{display:inline;font-family: 'adore64regular';font-size:10px;letter-spacing:-1px;color:#55FF55}


.menu-item1,
.menu-item2,
.menu-item3,
.menu-item4,
.menu-item5
{background: url(../img/buttons/transp.png);}

.menu-item1:hover, .news .menu-item1, .news-page .menu-item1, .home .menu-item1{width:45px}
.menu-item2:hover, .news .menu-item2, .news-page .menu-item2, .home .menu-item2 {width:45px}
.menu-item3:hover, .world .menu-item3 {width:85px}
.menu-item4:hover, .more .menu-item4, .project-page .menu-item4 {width:85px}
.menu-item5:hover, .about .menu-item5 {width:60px}


#container {
width:320px;
float:none;
margin-left:auto;
margin-right:auto;
padding-top:0px;
margin-top:50px;
background: url(../img/buttons/transp.png) ;
}




.news #container {width:320px}
.news #container .col1 img {width:300px;margin: 0px 0px 5px 0px;}



.project-page #container {width:320px;background: url(../img/buttons/transp.png)}
.project-page #container img {width:300px;padding: 0px 0px 0px 0px;}


.about #container {width:320px}
.about #container img {width:300px;padding: 0px 0px 5px 0px}


.about .mur1
{position:fixed;bottom:0;left:-35px;width:60px;height:70%;background: url(../img/about/mur1.png) repeat-y;position:fixed}

.about .mur2
{position:fixed;bottom:0;right:-25px;width:60px;height:70%;background: url(../img/about/mur1.png) repeat-y;position:fixed}




.more #container {width:320px}

.more #container div {margin: 20px 15px 0px 40px}


.more #container .trame {background: url(../img/buttons/pixtrans.png) no-repeat}

.more #container {width:320px}
.more #container div a  {width:240px;height:240px;}
.more #container div span  {width:240px;font-size:14px}
.more #container img {width:240px;height:240px;}





.news-page #container {width:320px}
.news-page .col1 .article {padding: 25px 0px 20px 0px;border-bottom:1px solid #444;}
.news-page #container p {margin: 0px 0px 10px 0px} /** modif 3/10/14 **/
.news-page #container .col1 img {width:300px;margin: 20px 0px -10px 0px;} /** modif 3/10/14 **/
.news-page #container .col1 .principale img {margin: 0px 0px 10px 0px;} /** modif 3/10/14 **/




/*----------------------------------------------------------------------------------------------*/
/* CORPS DES TYPOS */
/*----------------------------------------------------------------------------------------------*/

html {font-size:13px}

.col1 h2 {font-size:16px;line-height:24px}
.col1 h3 {font-size:12px;line-height:18px}
.col1 h4 {font-size:11px;line-height:17px}
.col1 h5 {font-size:10px;line-height:15px}

.col1 p.sign {font-size:12px;line-height:16px}

.col2 h2 {font-size:14px}

.worldpage .titre {
position :absolute;
top:20px;
left:20px
}

.worldpage .titre h2 {
font-size: 60px;line-height:60px;
}

.worldpage .titre h3 {
display:inline-block;
margin: -10px 20px 0px 0px;
font-size: 20px;
}

.worldpage .titre p {width:240px;
margin: 20px 0px 0px 0px;
font-size: 13px;color:#FFFFFF;
font-family: 'roboto', sans-serif;font-weight: 300
}

.worldpage .back {
position:absolute;
bottom:0px;
left:15px;
z-index:100
}

.worldpage .left {
left:0px;
}
.worldpage .right {
right:0px;
}

.worldpage .cartel {
top:20px;
right:20px;
width:auto;
text-align:right;
border:1px solid #DDD;
background: url(../img/world//fondcartel.png)
}


.score span
{font-size:11px}

.tooltip{font-size:11px}


.errorpage,
.errorpage i,
.errorpage a,
.errorpage b,
.errorpage h2,
.errorpage h2 span
{font-family:font-size:14px;line-height:22px}

.errorpage h2, .errorpage h2 b, .errorpage h2 i {font-size:60px;line-height:32px;}
.errorpage h2 span {font-size:40px;}






/*----------------------------------------------------------------------------------------------*/
/* flash-invader */
/*----------------------------------------------------------------------------------------------*/

.flash
{background: url(../img/flash/etoiles2.png) repeat-x top fixed #000}

.flash2
{background: url(../img/flash/etoiles2.png) repeat-x top fixed #000;}

.flash header {z-index:999;
position:relative;
left:0px;top:0px;
width:320px;
margin-left:auto;
margin-right:auto;
}

.flash #container {
width:320px;
float:none;
margin-left:auto;
margin-right:auto;
padding-top:0px;
margin-top:20px;
background: url(../img/buttons/transp.png) ;
}

.flash #container .bas {width:320px}

.flash .col1 {width: 320px}


.flash #container h4  {width:320px;margin: 0px 0px 20px 0px}

.flash .col1 .article:first-child div {margin: 0px 40px 0px 0px}

.flash #container .images div {width:140px;float:left;margin: 0px 10px 19px 10px;font-size:12px}
.flash #container .images div img {width:140px;height:140px;}


.flash header,
.flash #container .download span,
.flash #container .bas
{background: url(../img/flash/sprite2-320.png) no-repeat}


.flash header {height:300px;background-position: -0px -0px;padding:0}
.flash header #menu, .flash header .flag {margin-top:-60px}

.flash #container h2 {background-position: -130px -430px}

.flash #container .chapo {display:block;font-weight:bold}
.flash #container p {padding: 0px 10px 0px 10px}

.flash #container h2,
.flash #container h3,
.flash #container h4
{display:block;width:300px;height:30px;margin-top:20px;margin-left:10px;background: url(../img/flash/sprite2-320.png) no-repeat}
.flash #container h2 {background-position: 0px -430px}
.flash #container h3 {background-position: 0px -460px}
.flash #container h4 {background-position: 0px -490px;height:40px;margin-top:0;padding-top:35px}

.flash #container .download span {background-position: -0px -325px;margin-right:20px}

.flash #container .stores {margin-top:0px}
.flash #container .stores div {
width:300px;margin: 0px 10px 10px 0px;padding: 4px 10px 4px 10px;border:0
}

.flash #container .stores img {margin: 0px 5px 0px 10px;}




.flash #container .bas {width:320px;height:270px;background-position: -0px -550px;float:left}


.errorpage {width:320px;margin:auto;margin-top:150px}
.errorpage h2 {display:inline-block;}


.errorpage h2, .errorpage h2 b, .errorpage h2 span, .errorpage h2 i {font-size:40px;line-height:32px;}
.errorpage h2 span {font-size:40px;}


.cartel-position-0 {
  left: 10px;
  top: 60px;
}

.cartel-position-1 {
  right: 10px;
  top: 70px;
}

.cartel-position-2 {
  left: 10px;
  bottom: 10px;
}

.cartel-position-3 {
  right: 10px;
  bottom: 10px;
}



