/*---------------------------------------------------------- Main CSS Main styles for all the website Project: PSG Passion Author: e-TF1 Web Agency ----------------------------------------------------------*/ /* ================================ * !Reset styles * ================================*/ 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, font, 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 { background:transparent; border:0; font-size:100%; margin:0; outline:0; padding:0; vertical-align:baseline; } ol, ul { list-style:none; } blockquote, q { quotes:none; } blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; } /* remember to highlight inserts somehow! */ ins { text-decoration:none; } del { text-decoration:line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse:collapse; border-spacing:0; } html { background:#0E2549; font-family:Arial, Helvetica, sans-serif; } body { color:#FFF; font:10px Arial, Helvetica, sans-serif; } /* ================================ * !Layout * ================================*/ a, a:visited { color:#FFF; vertical-align:middle; } a:hover, a:active, a:focus { text-decoration:none; } #msgRetour { color:#ec1d25; } /* * !General layout */ html { background:#0E2549 url(../images/back.jpg) no-repeat 50% 40px; } body { margin:0 auto; padding-top:40px; position:relative; width:960px; } /* * !Commons layout components */ /* !Branding */ #branding { background:url(../images/branding.png) no-repeat; float:left; height:447px; width:240px; } .IE6 #branding { background-image:url(../images/branding-ie.jpg); } #branding * { left:-9999em; position:absolute; } /* !Main navigation */ #nav-main { background:url(../images/title.png) no-repeat; left:36px; list-style:none; overflow:hidden; padding-left:197px; position:absolute; top:14px; } #nav-main li { float:left; } #nav-main a { background:url(../images/nav.png) no-repeat; display:block; height:14px; margin-left:49px; text-indent:-9999em; } #nav-main .home a { background-position:0 0; width:50px; } #nav-main .presentation a { background-position:-101px 0; width:124px; } #nav-main .contest a { background-position:-271px 0; width:129px; } #nav-main .goodies a { background-position:-450px 0; width:77px; } #nav-main .contact a { background-position:-577px 0; width:78px; } #nav-main .home a:hover, #nav-main .home a.active { background-position:0 -14px; } #nav-main .presentation a:hover, #nav-main .presentation a.active { background-position:-101px -14px; } #nav-main .contest a:hover, #nav-main .contest a.active { background-position:-271px -14px; } #nav-main .goodies a:hover, #nav-main .goodies a.active { background-position:-450px -14px; } #nav-main .contact a:hover, #nav-main .contact a.active { background-position:-577px -14px; } /* !Content */ #content { margin-left:260px; } .IE6 #content { margin-left:257px; } #subcontent { height:400px; width:700px; } #content a.buy { background:url(../images/buy-card.png) no-repeat; display:inline-block; height:38px; left:77px; position:absolute; text-indent:-9999em; top:404px; width:110px; } /* !Footer */ #footer { clear:both; padding:27px 0 0 551px; } .IE7 #footer { zoom:1; } #footer hr, #js #footer label { left:-9999em; position:absolute; } #footer #mail { background:#4B5771; border:1px solid #838383; color:#FFF; font:11px Verdana, Geneva, Arial, Helvetica, sans-serif; height:14px; margin-right:5px; padding:1px 2px; vertical-align:middle; width:353px; } #footer button { background:url(http://s.psg.fr/psg/file/200909/passion-psg-ok.png) no-repeat; border:0; cursor:pointer; height:18px; text-indent:-9999em; width:37px; vertical-align:middle; } #footer p { color:#4F5B75; float:left; font-size:1.1em; padding:15px 5px; vertical-align:middle; } #footer a, #footer a:visited { color:#FFF; text-decoration:none; } #footer a:hover, #footer a:active { text-decoration:underline; } #footer .psg { background:url(../images/psg.png) no-repeat; float:left; height:24px; margin:9px 0 0 18px; text-indent:-9999em; width:81px; vertical-align:middle; } .IE6 #footer .psg { background-image:url(../images/psg-ie.png); } /* ================================ * !Main page layout components * ================================*/ /* * !Content for home page */ #content .home { background:url(../images/home.png) no-repeat; } .IE6 #content .home { background-image:url(../images/home-ie.jpg); } #content .home * { left:-9999em; position:absolute; } /* * !Content for presentation page */ #content .presentation { background:url(../images/presentation.png) no-repeat; } .IE6 #content .presentation { background-image:url(../images/presentation-ie.jpg); } #content .presentation * { left:-9999em; position:absolute; } /* * !Content for contest page */ #content .contest { background:url(../images/contest.png) no-repeat 405px 42px; } .IE6 #content .contest { background-image:url(../images/contest-ie.png); } #content .contest h2 { background:url(../images/contest-title.png) no-repeat 20px 45px; height:28px; padding:45px 20px 0; text-indent:-9999em; width:246px; } #content .contest .questions { padding:10px 28px 0; } #content .contest .questions label { background:no-repeat; display:block; text-indent:-9999em; width:381px; } #content .contest #q1-label { background-image:url(../images/contest-q1.png); height:32px; } #content .contest #q2-label { background-image:url(../images/contest-q2.png); height:21px; } #content .contest #q3-label { background-image:url(../images/contest-q3.png); height:20px; } #content .contest .questions span { margin:4px 28px 9px; } #content .contest .questions input { width:300px; } #content .contest .coords { background:#E81C25 url(../images/contest-coords-back.png) repeat-y 100% 0; border:1px solid #FF000A; margin:0 341px 0 56px; padding:1px 0 2px; width:301px; } #content .contest .coords div { margin:2px 0; } #content .contest .coords label { color:#FFF; display:inline-block; font-size:1.2em; margin-left:5px; width:62px; } #content .contest .coords span { } #content .contest .coords input { width:227px; } #content .contest span { border:1px solid #FF000A; display:inline-block; } #content .contest input { border:solid #6C6C6C; border-width:1px 0 0 1px; margin:0; padding:2px 0; vertical-align:middle; } #content .contest button { background:url(../images/send.png) no-repeat; border:0; cursor:pointer; display:inline-block; height:32px; margin:6px 10px 0 55px; text-indent:-9999em; vertical-align:middle; width:116px; } #content .contest a { vertical-align:middle; } /* * !Content for goodies page */ #content .goodies { } #content .goodies h2 { background:url(../images/goodies-title.png) no-repeat 20px 45px; height:28px; padding:45px 20px 8px; text-indent:-9999em; width:246px; } #content .goodies #player { border:1px solid #FA1F27; position:absolute; right:22px; top:156px; } #content .goodies h3.wallpapers { background:url(../images/goodies-wallpapers.png) no-repeat; height:23px; margin-left:24px; text-indent:-9999em; width:156px; } #content .goodies ul.wallpapers { margin:11px 0 0 69px; overflow:hidden; width:272px; } #content .goodies ul.wallpapers li { color:#FFF; float:left; margin-bottom:7px; text-align:center; width:136px; } #content .goodies ul.wallpapers img { border:1px solid #FA1F27; display:block; margin:0 auto 3px; vertical-align:middle; } #content .goodies h3.gallery { background:url(../images/goodies-gallery.png) no-repeat; height:23px; margin:16px 0 7px 24px; text-indent:-9999em; width:217px; } #content .goodies ul.gallery { margin-left:81px; } #content .goodies ul.gallery li { float:left; margin:0 8px; } #content .goodies ul.gallery img { border:1px solid #FA1F27; display:block; vertical-align:middle; } /* * !Content for contact page */ #content .contact { background:url(../images/contact.png) no-repeat 0 -2px; margin-bottom:-57px; height:457px; } .IE6 #content .contact { background:url(../images/contact-ie.jpg) no-repeat; } #content .contact h2 { background:url(../images/contact-title.png) no-repeat 20px 45px; height:28px; padding:45px 20px 0; text-indent:-9999em; width:246px; } #content .contact p { color:#FFF; font-size:1.1em; line-height:1.6em; margin:21px 0 0 22px; width:300px; } #content .contact .button { background:url(../images/contact-mail.png) no-repeat; display:block; height:32px; margin:19px 10px 0 23px; text-indent:-9999em; vertical-align:middle; width:206px; } #content .contact ul { font-size:1.1em; line-height:1.4em; margin:20px 22px 0; } /* !Legal page */ .legal { background:#0E2549; font-size:12px; padding:0 10px; width:auto; } .legal h1 { font-size:1.6em; margin:20px 0; } .legal h2 { font-size:1.4em; margin:10px 0; } .legal h3 { font-size:1.2em; margin:10px 0; } .legal p { padding:10px 0; }