/*@font-face {
    font-family: 'uni0553';
    src: url('fonts/uni0553/uni0553-webfont-webfont.eot');
    src: url('fonts/uni0553/uni0553-webfont-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/uni0553/uni0553-webfont-webfont.woff2') format('woff2'),
         url('fonts/uni0553/uni0553-webfont-webfont.woff') format('woff'),
         url('fonts/uni0553/uni0553-webfont-webfont.ttf') format('truetype'),
         url('fonts/uni0553/uni0553-webfont-webfont.svg#uni_05_53regular') format('svg');
    font-weight: normal;
    font-style: normal;
}
.pixel { 
    font-family: 'uni0553', Helvetica, Arial, sans-serif;
    font-weight: normal;
    font-style: normal;
    line-height: 1.2em;
}*/

body {
    font-family: 'Open Sans Condensed', Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight:300;
    font-size:16px;
    color:#FFF; background-color:#000;
    margin:0; padding:0;
    /*overflow:hidden;*/
    width:100%; height:100%;
}

/**/

.left { float:left; }
.right { float:right; }
.clear { clear:both; }
.pointer { cursor:pointer; }
.hidden, .onlymobile { display:none; }
.normal { font-style: normal; font-size:13px; font-weight:400; }
.txt-left { text-align:left; }
.txt-right { text-align:right; }
.maj { text-transform:uppercase; }
.big { font-size:1.7em; margin-bottom:6px; }
.medium { font-size:1.4em; margin-bottom:6px; }
.inblock { display:inline-block; }

a { text-decoration:none; color:#FF6600; }
a:hover { text-decoration: underline; }
a img { border:none; }

h1, h2, h3, h4, p { padding:0; margin:0; font-size:1em; font-weight:300; }

.orange { color:#F60; }
.blanc, a.blanc, .blanc a { color:#FFF; }

/**/

#menu { position:fixed; top:0; left:0; width:100%; z-index:10; }
#menu .container {}
#menu .container h3 { display:inline-block; padding:5px 20px; }
#menu .container h3 a { color:#FFF; }

#animation { position:fixed; top:0; left:0; z-index:1; }

#page { position:relative; z-index:10; 
    text-align:center; 
    /*overflow:auto; */
    width:100%; 
}

#page .section { position:relative; z-index:1; }
#page .section .content { position:relative; top:60px; }

.limited { width:95%; max-width:800px; margin:0 auto; }
.blackbg { background-color:#000; }

#page .section .half { width:50%; }
#page .section .texte { padding:15px; }
#page .section .texte p { margin-bottom:1em; }

#page .title { background:none; }

.spare { width:270px; padding:5px; display:inline-block; vertical-align:middle;
    margin:15px; }
.firsthalf { float:left; width:45%; }
.secondhalf { float:left; width:55%; }

#share { position:relative; top:30px; }
#share .share .icon { 
    background-image: url(img/share-icons.png); 
    background-position: left top;
    background-repeat: no-repeat;
    width:52px; height:52px; margin: 0 4px;
    display:inline-block; position:relative; cursor:pointer;
}
#share .share .icon .box { position:absolute; display:none; } /* le compteur */

#share .share .icon.facebook { background-position: left top; }
#share .share .icon.twitter { background-position: -60px top; }
#share .share .icon.mail { background-position: -122px top; }
#share .share .icon.pinterest { background-position: -183px top; }
#share .share .icon.googleplus { background-position: -244px top; }

.flottant { display:inline-block; padding:5px; margin:15px; }

#footer .part1, #footer .part2 { position:fixed; bottom:5px; z-index:11; }
#footer .part1 { left:10px; }
#footer .part2 { right:10px; }

#p5js { vertical-align:middle; margin-left:4px; position:relative; top:-2px; }

#titre { width:100%; max-width:400px; height:112px; margin:0 auto; cursor:pointer;
    background-image: url(img/gameLogo-def.png); 
    background-repeat: no-repeat;
    background-position: center top;
}
.style1 #titre { background-position: center top; }
.style2 #titre { background-position: center -112px; }
.style3 #titre { background-position: center -224px; }
.style4 #titre { background-position: center -336px; }
.style5 #titre { background-position: center -448px; }

#titre img { display:none; }

#showcase video { width:800px; height:468px; }

/* */

.pixel {
    font-family: 'Open Sans Condensed', Helvetica, Arial, sans-serif;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2em; 
}

@media screen and (max-width:800px){
    .notablet { display:none; }
    #showcase video { width:93%; height:auto; }
    #menu { position:static; transform:translate(0, 0) !important; padding-bottom:30px; }
    #menu .scrollLink.first, canvas, #footer { display:none; }
    #page .section { position:relative; z-index:1; }
    #page .section .content { position:static; padding:30px 0; }
    #footer .part1, #footer .part2 { position:static; }
    #titre { background:none; width:80%; max-width:none; height:auto; }
    #titre img { display:block; width:100%; }
    #features .spare { margin:0; }
    #features.section .texte { padding:5px 0; }
    #credits { padding:80px 0; }
    #credits .big { font-size:1.2em; }
    #credits .flottant { margin:0; }
}
@media screen and (max-width:600px){
    .onlymobile { display:block; }
    .nomobile { display:none; }
    .firsthalf, .secondhalf { float:none; width:90%; margin:0 auto; text-align:center; }
}