body{ background-color: #000; color: #fff; font-family: Arial; font-size: 12px; background: url(fc3-fond-repeat-01.gif) repeat; } body.body-shop{ background: url(shop-background.jpg) repeat; } #main-wrapper{ position: relative; display: block; margin: 0 auto; /*background:transparent url(main-background.jpg) repeat-y center top;*/ width: 1280px; z-index: 1; } #main-content{ position: relative; display: block; width: 100%; min-height: 2450px; overflow: hidden; margin: 0 auto; background: transparent url(grille.png) no-repeat center top; } #header{ width: 988px; height: 358px; /*background-color: rgba(0, 0, 0, .8);*/ margin: 49px auto 0 auto; } #header h1{ width: 988px; height: 358px; position: absolute; z-index: 0; } #header h1 img{ position: relative; } ul#nav{ width: auto; height: 58px; margin: 2px 0 0 146px; display: block; } ul#nav li{ height: 52px; display: block; float: left; background-color: #0000ff; border:#0000ff 3px solid; overflow: hidden; font-family: 'minecraftiaregular'; font-size: 15px; color: #000; text-align: center; text-transform: uppercase; } ul#nav li.movie{ width: 503px; margin-right: 2px; } ul#nav li.shop{ width: 473px; } ul#nav li.active{ background-color: #ff00ff; } ul#nav li a{ color: #ff00ff; text-decoration: underline; } ul#nav li span{ line-height: 52px; display: block; } ul#nav li.movie span:before{ content: 'icon'; background: url(nav-movie-left-arrow.png) no-repeat left center; display: inline-block; text-indent: -9999px; margin-right: 14px; width: 17px; height: 52px; } ul#nav li.movie span:after{ content: 'icon'; background: url(nav-movie-right-arrow.png) no-repeat right center; display: inline-block; text-indent: -9999px; margin-left: 14px; width: 17px; height: 52px; } ul#nav li.shop span:before{ content: 'icon'; background: url(open.gif) no-repeat left center; background-size: 33px 17px; display: inline-block; text-indent: -999px; margin-right: 14px; width: 33px; height: 52px; } ul#nav li.shop span:after{ content: 'icon'; background: url(open.gif) no-repeat right center; background-size: 33px 17px; display: inline-block; text-indent: -999px; margin-left: 14px; width: 33px; height: 52px; } #main-content .just-scroll{ display: block; width: 100%; height: 32px; overflow: hidden; margin: 0 auto; text-align: center; } #main-content .just-scroll span{ display: block; line-height: 32px; text-align: center; } #main-content .just-scroll span img{ vertical-align: middle; } #main-content .just-scroll span:before{ content: 'icon'; background: url(scroll-down-arrow.png) no-repeat left center; display: inline-block; text-indent: -9999px; margin-right: 6px; width: 10px; height: 33px; } #main-content .just-scroll span:after{ content: 'icon'; background: url(scroll-down-arrow.png) no-repeat right center; display: inline-block; text-indent: -9999px; margin-left: 6px; width: 10px; height: 33px; } /* TRAILER */ #main-content .trailer-wrapper{ display: block; height: 448px; margin-left: 208px; } #main-content .trailer-wrapper .trailer{ display: block; width: 688px; height: 448px; float: left; background-color: rgba(0, 0, 0, .6); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80000000', endColorstr='#80000000',GradientType=0 ); /* IE6-9 */ } #main-content .trailer-wrapper .trailer{ } #main-content .trailer-wrapper .trailer h2{ width: 100%; height: 43px; line-height: 43px; overflow: hidden; text-align: center; } #main-content .trailer-wrapper .trailer h2 span{ display: block; line-height: 43px; text-align: center; } #main-content .trailer-wrapper .trailer h2 span img{ vertical-align: middle; } #main-content .trailer-wrapper .trailer h2 span:before{ content: 'icon'; background: url(whatsnew.gif) no-repeat left center; display: inline-block; text-indent: -9999px; margin-right: 14px; width: 48px; height: 43px; } #main-content .trailer-wrapper .trailer h2 span:after{ content: 'icon'; background: url(whatsnew.gif) no-repeat right center; display: inline-block; text-indent: -9999px; margin-left: 14px; width: 48px; height: 43px; } #main-content .trailer-wrapper .trailer .trailer-youtube{ margin-left: 22px; } #main-content .trailer-wrapper .col-right{ float: left; margin-left: 31px; } #main-content .trailer-wrapper .col-right:after{ content: ''; display: block; clear: both; } #main-content .trailer-wrapper .col-right .trailer-top{ margin: 28px 0 32px 0; } #main-content .trailer-wrapper .col-right .trailer-bottom{ width: 207px; height: 149px; } /* STORY */ #main-content .story-wrapper{ margin-top: 32px; } #main-content .story-wrapper .video{ width: 177px; height: 118px; margin-left: 237px; float: left; } #main-content .story-wrapper .story{ display: block; float: right; width: 628px; height: 118px; overflow: hidden; margin-right: 146px; background-color: rgba(0, 0, 255, .6); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#800000ff', endColorstr='#800000ff',GradientType=0 ); /* IE6-9 */ } #main-content .story-wrapper .story h2{ width: 100%; height: 53px; overflow: hidden; } #main-content .story-wrapper .story h2 span{ display: block; height: 53px; line-height: 53px; } #main-content .story-wrapper .story h2 span img{ vertical-align: middle; } #main-content .story-wrapper .story h2 span:before{ content: 'icon'; background: url(story-star.png) no-repeat center center; display: inline-block; text-indent: -9999px; margin-left: 4px; width: 29px; height: 53px; } #main-content .story-wrapper .story p{ width: 606px; margin-left: 8px; line-height: 20px; color: #fff; } #main-content .story-wrapper .story p span{ color: #fff; } /* INTERVIEW */ #main-content .interview-wrapper{ margin: 32px 0 0 147px; clear: both; } #main-content .interview-wrapper div.interview{ width: 628px; height: 478px; float: left; background-color: rgba(0, 255, 0, .6); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8000ff00', endColorstr='#8000ff00',GradientType=0 ); /* IE6-9 */ text-align: center; } #main-content .interview-wrapper .interview h2{ width: 100%; height: 59px; overflow: hidden; text-align: left; } #main-content .interview-wrapper .interview h2 span{ display: block; height: 59px; line-height: 53px; } #main-content .interview-wrapper .interview h2 span img{ vertical-align: middle; } #main-content .interview-wrapper .interview h2 span:before{ content: 'icon'; background: url(interview-star.png) no-repeat center center; display: inline-block; text-indent: -9999px; margin-left: 10px; width: 29px; height: 53px; } #main-content .interview-wrapper .interview h2 span:after{ content: 'icon'; background: url(hot.gif) repeat-x left 25px; display: inline-block; text-indent: -9999px; width: 281px; height: 53px; } #main-content .interview-wrapper .interview img.interview{ margin-bottom: 25px; -webkit-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.75); -moz-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.75); box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.75); } #main-content .interview-wrapper .interview a.bt-interview{ font-family: Courier; font-size: 15px; color: #000; height: 28px; line-height: 28px; vertical-align: top; margin: 0 auto; } #main-content .interview-wrapper .interview a.bt-interview span{ display: inline-block; vertical-align: top; width: auto; height: 28px; line-height: 24px; background: url(bt-background.png) repeat-x; padding: 0 9px; } #main-content .interview-wrapper .interview a.bt-interview:before{ content: 'icon'; vertical-align: top; background: url(bt-border-left.png) no-repeat right center; display: inline-block; text-indent: -9999px; width: 8px; height: 28px; } #main-content .interview-wrapper .interview a.bt-interview:after{ content: 'icon'; vertical-align: top; background: url(bt-border-right.png) no-repeat left center; display: inline-block; text-indent: -9999px; width: 8px; height: 28px; } #main-content .interview-wrapper .col-right{ width: 360px; float: left; margin: 30px 0 0 32px; } #main-content .interview-wrapper .col-right .row-1{ margin: 0 0 32px 0; } #main-content .interview-wrapper .col-right .player-mp3{ float: left; margin: 0 32px 0 0; } #main-content .interview-wrapper .col-right .row-2{ margin: 0 0 32px 0; text-align: center; } #main-content .interview-wrapper .col-right .screen-1{ width: 117px; height: 88px; } #main-content .interview-wrapper .col-right .screen-2{ width: 298px; height: 178px; } #main-content .interview-wrapper .col-right .screen-3{ width: 238px; height: 118px; } #main-content .interview-wrapper .col-right .screen-4{ width: 88px; height: 87px; vertical-align: top; margin-left: 30px; } /* CAST & CREW */ #main-content .cast-wrapper{ margin-left: 177px; } #main-content .cast-wrapper .col-left{ margin-top: 29px; width: 300px; float: left; } #main-content .cast-wrapper .col-left .revolvermaps{ width: 208px; height: 208px; } #main-content .cast-wrapper .col-left .screen-1{ width: 238px; height: 148px; margin: 31px 0 0 30px; } #main-content .cast-wrapper .cast{ width: 628px; height: 419px; float: left; margin: 29px 0 0 0; background-color: rgba( 255, 0, 255, .6); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80ff00ff', endColorstr='#80ff00ff',GradientType=0 ); /* IE6-9 */ } #main-content .cast-wrapper .cast h2{ margin: -20px 0 0 7px; } #main-content .cast-wrapper .cast .perso{ width: 570px; height: 242px; display: table; margin: 39px 0 0 42px; } #main-content .cast-wrapper .cast .perso .photo{ display: block; width: 257px; margin: 0; float: left; } #main-content .cast-wrapper .cast .perso .details{ display: table-cell; height: 242px; margin: 0; padding-left: 28px; vertical-align: middle; } #main-content .cast-wrapper .cast .perso .details .name{ font-size: 24px; display: block; line-height: 34px; } #main-content .cast-wrapper .cast .perso .details .subtitle{ font-size: 16px; display: block; } #main-content .cast-wrapper .cast .perso .details .citation{ font-size: 14px; font-weight: bold; color: #ffff00; display: block; margin-top: 28px; } #main-content .cast-wrapper .cast .more{ font-family: Courier; font-size: 24px; color: #000; text-align: center; display: block; margin-top: 37px; } /* VINYL / SHOP */ #main-content .visitshop-wrapper{ margin: 59px 0 0 327px; position: relative; } #main-content .visitshop-wrapper .vinyl{ float: left; width: 298px; height: 268px; margin: 32px 36px 0 0; } #main-content .visitshop-wrapper .col-right{ float: left; } #main-content .visitshop-wrapper .col-right strong.legende{ color: #ffff00; display: block; height: 32px; line-height: 32px; text-indent: 120px; font-weight: bold; } #main-content .visitshop-wrapper .col-right h2{ height: 58px; } #main-content .visitshop-wrapper .col-right h2 a{ display: block; height: 58px; line-height: 58px; } #main-content .visitshop-wrapper .col-right h2 a img{ vertical-align: middle; } #main-content .visitshop-wrapper .col-right h2 a:before{ content: 'icon'; background: url(fleche-gauche.gif) no-repeat left center; display: inline-block; text-indent: -9999px; width: 115px; height: 58px; } #main-content .visitshop-wrapper .col-right h2 a:after{ content: 'icon'; background: url(fleche-droite.gif) no-repeat right center; display: inline-block; text-indent: -9999px; width: 115px; height: 58px; } #main-content .visitshop-wrapper .col-right img.open{ margin: 0 0 11px 120px; } #main-content .visitshop-wrapper .col-right img.commodore{ margin: 0 30px 0 116px; float: left; } #main-content .visitshop-wrapper .col-right .flagcounter{ display: block; width: 150px; height: 127px; float: left; background-color: #000; border: #52C4CC 1px solid; } /* */ #thunders .thunder-1, #thunders .thunder-2, #thunders .thunder-3, #thunders .thunder-4, #thunders .thunder-5, #thunders .thunder-6{ display: block; position: absolute; z-index: 0; } #thunders .thunder-1 div, #thunders .thunder-2 div, #thunders .thunder-3 div, #thunders .thunder-4 div, #thunders .thunder-5 div, #thunders .thunder-6 div{ width: 100%; height: 100%; } #thunders .thunder-1{ width: 78px; height: 46px; top: 99px; left: 37px; } #thunders .thunder-1 div{ background: url(thunder-1.png) no-repeat center top; } #thunders .thunder-2{ width: 126px; height: 62px; top: 478px; right: 17px; } #thunders .thunder-2 div{ background: url(thunder-2.png) no-repeat center top; } #thunders .thunder-3{ width: 145px; height: 85px; top: 917px; left: 31px; } #thunders .thunder-3 div{ background: url(thunder-3.png) no-repeat center top; } #thunders .thunder-4{ width: 109px; height: 64px; top: 1370px; right: 5px; } #thunders .thunder-4 div{ background: url(thunder-4.png) no-repeat center top; } #thunders .thunder-5{ width: 188px; height: 110px; top: 1874px; left: 19px; } #thunders .thunder-5 div{ background: url(thunder-5.png) no-repeat center top; } #thunders .thunder-6{ width: 116px; height: 69px; top: 2080px; right: 58px; } #thunders .thunder-6 div{ background: url(thunder-6.png) no-repeat center top; } #bottom-content{} /* STATS */ #bottom-content .stats{ margin-top: 22px; text-align: center; } #bottom-content .stats img{ vertical-align: middle; } #bottom-content .stats .xiti{ margin-left: 20px; } #bottom-content .hidesocial{ cursor: pointer; } #bottom-content .modem{ height: 117px; text-align: center; margin: 14px 0 96px 0; } #bottom-content .minitel{ text-align: center; margin: 20px 0 150px 0; } #bottom-content .minitel img{ vertical-align: middle; } #bottom-content .minitel .envoi{ margin-left: 2px; } #bottom-content .socials{ display: none; height: 117px; line-height: 117px; text-align: center; margin: 14px 0 96px 0; } #bottom-content .socials img{ vertical-align: middle; } #bottom-content .socials ul { display: block; margin: 16px 0; text-align: center; } #bottom-content .socials ul, #bottom-content .socials ul li { list-style-type: none; margin: 0; padding: 0; } #bottom-content .socials ul li { display: inline; margin: 0 8px; padding: 0; } /* FOOTER */ #footer{ width:100%; position: absolute; background-color: #000; z-index: 0; text-align: center; } #footer .footer{ width:1280px; position: relative; margin: 0 auto; } #footer h2{ margin-top: -116px; text-align: center; } #footer .credits{ margin-bottom: 32px; } #footer .logos{ margin-bottom: 32px; } #footer .logos img{ margin: 0 13px; vertical-align: middle;} #footer .flags{ margin-bottom: 40px; /*border-top: #4b4b4b 1px solid; border-bottom: #4b4b4b 1px solid; padding: 14px 0;*/ } #footer .flags ul { display: block; margin: 16px 0; text-align: center; } #footer .flags ul, #footer .flags ul li { list-style-type: none; margin: 0; padding: 0; } #footer .flags ul li { display: inline; margin: 0 8px; padding: 0; } #footer .rights{ font-size: 9px; color: #4b4b4b; margin-bottom: 40px; } /* SHOP */ #main-content.shop-content{ min-height: 2509px; background: transparent url(grille-shop.png) no-repeat center top; } #main-content .shop-welcome{ display: block; width: 100%; height: 62px; overflow: hidden; margin: 0 auto; text-align: center; } #main-content .shop-welcome span{ display: block; line-height: 62px; text-align: center; } #main-content .shop-welcome span img{ vertical-align: middle; *margin-top: 10px; } #main-content .shop-welcome span:before{ content: 'icon'; background: url(shop-title-left-arrow.png) no-repeat left center; display: inline-block; text-indent: -9999px; margin-right: 17px; width: 17px; height: 62px; } #main-content .shop-welcome span:after{ content: 'icon'; background: url(shop-title-right-arrow.png) no-repeat right center; display: inline-block; text-indent: -9999px; margin-left: 17px; width: 17px; height: 62px; } #main-content #shop-list{ width: 958px; height: 1949px; position: relative; display: table; margin: 0 0 0 177px; background-color: #fff; z-index: 1; } #main-content #shop-list .row{ width: 100%; display: block; } #main-content #shop-list .item{ position: relative; width: 25%; *width: 24%; height: 100%; float: left; font-size: 11px; font-weight: bold; } #main-content #shop-list .row-1{ height: 292px; } #main-content #shop-list .row-2{ height: 392px; } #main-content #shop-list .row-3{ height: 339px; } #main-content #shop-list .row-4{ height: 333px; } #main-content #shop-list .row-5{ height: 325px; } #main-content #shop-list .item .visu{ width: 239px; height: 218px; text-align: center; display: table-cell; vertical-align: middle; } #main-content #shop-list .item .visu img{ vertical-align: middle; *margin-top: 20px; } #main-content #shop-list .item .visu .price{ position: absolute; bottom: 70px; left: 150px; display: block; font-size: 15px; color: #ff0000; background: url(price.png) no-repeat; width: 88px; height: 70px; text-align: center; line-height: 120%; padding-top: 20px; } #main-content #shop-list .item .visu .new{ position: absolute; width: 48px; height: 37px; top: 26px; left: 30px; display: block; background: url(whatsnew.gif) no-repeat; } #main-content #shop-list .item .visu .hot{ position: absolute; width: 47px; height: 14px; top: 20px; right: 14px; display: block; background: url(hot.gif) no-repeat; } #main-content #shop-list .item .name{ width: 210px; color: #000; text-align: center; margin: 0 auto; } #main-content #shop-list .item .buy{ display: block; position: absolute; width: 100%; height: 29px; bottom: 5px; text-align: center; } #main-content #shop-list .item .bt-buy, #main-content #shop-list .item .bt-commodore{ line-height: 100%; text-transform: uppercase; background-color: #f6000e; padding: 8px 38px; text-align: center; cursor: pointer; font-weight: bold; text-decoration: none; color: #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } #main-content #shop-list .row-2 .item .visu{ height: 315px; } #main-content #shop-list .row-3 .item .visu{ height: 264px; } #main-content #shop-list .row-4 .item .visu{ height: 258px; } #main-content #shop-list .row-5 .item .visu{ height: 250px; } #main-content #shop-list .row-bottom{ margin-top: 36px; } #main-content #shop-list .row-bottom li{ float:left; height: 140px; } #main-content #shop-list .row-bottom .open{ margin: 0 35px 0 31px;} #main-content #shop-list .row-bottom .counter{ margin-right: 23px; } #main-content #shop-list .row-bottom .counter div{ height: 140px; position: relative; display: table-cell; vertical-align: middle; text-align: center; } #main-content #shop-list .row-bottom .counter img{ margin: 3px auto; } #main-content #shop-list .row-bottom .worldwide-shipping{ margin-right: 43px; } #main-content #shop-list .row-bottom .worldwide-shipping div{ height: 140px; position: relative; color: #000; font-size: 11px; display: table-cell; vertical-align: middle; text-align: center; } #main-content #shop-list .row-bottom .worldwide-shipping span{ display: block; text-transform: uppercase; line-height: 30px; } #main-content #shop-list .row-bottom .contact{ font-size: 25px; line-height: 140px; } #main-content #shop-list .row-bottom .contact .comic{ font-family: Comic sans ms; color: #0001ff;} #main-content #shop-list .row-bottom .contact a, #main-content #shop-list .row-bottom .contact strong{ color: #f6000e; text-decoration: underline; text-transform: uppercase; } #main-content #shop-list .row-bottom .contact span{ color: #000; } #main-content #shop-list .row-bottom .contact img{ vertical-align: middle; } .shad{ position: fixed; display: none; width: 100%; height: 100%; z-index: 10; background-color: rgba(0, 0, 0, .6); cursor: pointer; filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80000000', endColorstr='#80000000',GradientType=0 ); /* IE6-9 */ } .popup{ position: fixed; display: none; width: 500px; height: 375px; z-index: 11; top: 200px; left: 50%; margin-left: -250px; z-index: 11; } .popup .close{ width: 500px; height: 14px; background: url(popup-close.jpg) no-repeat; cursor: pointer; } .popup .content{ width: 500px; height: 361px; background: url(popup.jpg) no-repeat; text-align: center; overflow: hidden; } .popup .content .thanks{ display: block; color: #d5009b; font-size: 26px; text-transform: uppercase; line-height: 44px; margin-top: 208px; font-family: Impact; } .popup .content .recieve{ display: block; color: #0000ff; font-size: 20px; line-height: 28px; } #konami{ display: block; position: absolute; z-index: 1; top: 161px; right: 4px; } .explose{ width: 142px; height: 200px; display: block; position: absolute; z-index: 20; } .exclusive{ position: fixed; display: none; width: 259px; height: 282px; z-index: 11; top: 300px; left: 50%; top: 50%; margin:-141px 0 0 -130px; z-index: 11; cursor: pointer; } .exclusive img{ width: 249px; height: auto; cursor: pointer; border: #00ffff 5px solid; } .shoot * { cursor: url(viseur.png), pointer !important; } .shoot .kill{ cursor: url(viseur.png), pointer !important; } .clearer{ clear: both; } .tcenter{ text-align: center; } /* ajustement */ #main-content .story-wrapper{ height: 148px; } #main-content .story-wrapper .story{ height: 148px; } #main-content .visitshop-wrapper{ margin: 29px 0 0 327px; } /* Age gate */ body.agegate{ background: #000; } #agegate{ width: 932px; height: 724px; margin: 0 auto; background: url(age-background.png) no-repeat; overflow: hidden; } #agegate .content{ width: 868px; margin: 49px auto; background: url(age-logo.jpg) no-repeat; padding-top: 286px; text-align: center; } #agegate .content .intro{ display: block; margin-bottom: 16px; font-size: 15px; line-height: 120%; } #agegate .content #inputfields{ text-align: center; margin-bottom: 40px; } #agegate .content #inputfields input[type=text]{ width: 103px; height: 31px; margin: 0 3px; border: none; background: #464f57; font-size: 18px; color: #00ffff; font-weight: bold; text-align: center; } #agegate .content .error{ display: block; margin-bottom: 16px; font-size: 13px; line-height: 120%; } /* FONTS */ @font-face { font-family: 'minecraftiaregular'; src: url('minecraftia-webfont.eot'); src: url('minecraftia-webfont.eot?#iefix') format('embedded-opentype'), url('minecraftia-webfont.woff') format('woff'), url('minecraftia-webfont.ttf') format('truetype'), url('minecraftia-webfont.svg#minecraftiaregular') format('svg'); font-weight: normal; font-style: normal; }