﻿/* CSS Reset */
* {margin: 0px; padding: 0px; border: none;}
/* Body and site wide Declarations */
body {
color: #fff;
background-image: url(/images/tshirtTextureBG.jpg);
font-family: Arial, sans-serif;
font-size: 12px;
}
/* Global Clases */
.cleary {
clear: both;
height: 1px;
}
.hideIt {visibility: hidden;}
/* Burn Classes */
#burnTop {
background-image:url(/images/burn_t.png);
height:244px;
position:fixed;
top:0;
width:100%;
z-index: -1;
_display: none;
}
#burnLeft {
background-image:url(/images/burn_l.png);
height:100%;
left:0;
top:0;
position:fixed;
width:256px;
z-index: -1;
_display: none;
}
#burnRight {
background-image:url(/images/burn_r.png);
height:100%;
position:fixed;
right:0;
top:0;
width:264px;
z-index: -1;
_display: none;
}
#burnBottom {
background-image:url(/images/burn_b.png);
bottom:0;
height:247px;
position:fixed;
width:100%;
z-index: -1;
_display: none;
}
/* classes and IDs */
#container {
width: 750px;
margin: 0px auto;
padding: 30px 0 0 0;
z-index: 10;
}
#header {
border-bottom:1px solid #99ADBC;
border-top:1px solid #99ADBC;
font-size:130%;
padding:15px 0 10px;
width:100%;
}
#mainPageBurst {
margin: 25px -10px;
}
/* Link styling */
a {
color: #7cbee6;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
/* standard element styling */
h1 {
background-image: url(/images/logoGildan.png);
background-repeat: no-repeat;
height: 37px;
width: 178px;
float: left;
}
h2 {
display: none;
}
#header a {
display:block;
}
#header a:hover {
text-decoration: none;
}
h2#navBar {
background-image:url(/images/fr/wheresYourGildan.png);
background-position:40px 3px;
background-repeat:no-repeat;
display:block;
float:left;
margin:0;
padding:15px 0 0;
width:377px;
}
ul#navBar li {
display:block;
float:left;
margin: 8px 9px 0 0 ;
}
ul#navBar li#home {
background-image:url(/images/fr/nav-home.png);
background-position:0 2px;
background-repeat:no-repeat;
height:11px;
width:46px;
}
ul#navBar li#home:hover {
background-image: url(/images/fr/nav-home_ovr.png);
}
ul#navBar li#about {
background-image:url(/images/fr/nav-about-gildan.png);
background-repeat:no-repeat;
height:11px;
width:108px;
}
ul#navBar li#about:hover {
background-image: url(/images/fr/nav-about-gildan_ovr.png);
}
ul#navBar li#rAndR {
background-image: url(/images/navBarRandR.png);
background-repeat: no-repeat;
margin-right:0;
width:135px;
height: 10px;
}
ul#navBar li#rAndR:hover {
background-image: url(/images/navBarRandROn.png);
}
ul#navBar li#quiz {
background-image:url(/images/fr/nav-takeQuiz.png);
background-repeat:no-repeat;
background-position:0 1px;
height:13px;
margin-right:0;
width:122px;
}
ul#navBar li#quiz:hover {
background-image: url(/images/fr/nav-takeQuiz_ovr.png);
}
ul#shareBox  {
background-image:url(/images/shareBoxBG.png);
background-position:10px 5px;
background-repeat:no-repeat;
border-left:1px solid #99ADBC;
float:left;
font-size:80%;
list-style-type:none;
margin:-4px 0 0 10px;
padding:0 0 0 49px;
}
ul#shareBox li#friend {
background-image:url(/images/fr/nav-refer.gif);
background-position:0 6px;
background-repeat:no-repeat;
height:26px;
width:134px;
}
ul#shareBox li#facebook {
background-image:url(/images/fr/nav-facebook.gif);
background-position:0 5px;
background-repeat:no-repeat;
border-top:1px solid #99ADBC;
height:19px;
width:134px;
}
#questionWrapper img, .submitButton {
display: block;
margin: 20px auto;
cursor: pointer;
}
.question {
border-top: 1px solid #99adbc;
}
.responseWrapper {
border-bottom: 1px solid #99adbc;
padding: 10px 0px 10px 0px;
}
.responseWrapper p {
height: 30px;
color: #ffffff;
}
.checkBox {
width: 28px;
height: 28px;
background-color: #ffffff;
border:1px solid #EFEFEF;
float: left;
cursor: pointer;
}
.checkBox img {
margin: 6px;
}
/* Sticky Footer */
html, body, form {height: 100%;}

body > form {height: auto; min-height: 100%;}

#container {padding-bottom: 120px;}  /* must be same height as the footer */

#footer {
position: relative;
margin: -60px auto; /* negative value of footer height */
height: 60px;
clear:both;
width: 750px;
border-top: 1px solid #99adbc;
padding: 15px 0 0 0;
font-size: 80%;
}
#footer ul#footShare {
float: left;
width: 260px;
}
#footer ul#footShare li {
display: inline;
list-style: none;
padding: 5px 7px 3px 20px;
}
#footer ul#footShare li#footerFacebookShare {
background-image: url(/images/shareIconFacebook.png);
background-position: left center;
background-repeat: no-repeat;
height: 19px;
}
#footer ul#footShare li#footerTwitterShare {
background-image: url(/images/shareIconTwitter.png);
background-position: left center;
background-repeat: no-repeat;
height: 19px;
}
#footer p {
float: right;
width: 490px;
text-align: right;
}
#footer a {
color: #ffffff;
}
#footer a.gildanLink {
color: #7CBEE6;
}
/* Registration Form */
#regForm {
width: 400px;
margin: 20px auto;
}
#regForm .leftCol {
width: 200px;
float: left;
}
#regForm .rightCol {
width: 197px;
float: right;
}
#regForm label.inputLabel {
width: 175px;
margin:7px 0 0;
font-weight: bold;
font-size: 120%;
display: block;
}
#regForm label.checkLabel {
clear:right;
float:right;
font-size:100%;
font-weight: bold;
margin:8px 0 0;
width:375px;
}
#regForm input.textInput {
height:17px;
margin:7px 25px 16px 0;
padding:4px 2px;
width:175px;
font-weight: bold;
color: #666666;
}
#regForm select.selectInput{
color:#666666;
font-weight:bold;
height:25px;
margin:7px 25px 16px 0;
padding:4px 2px;
width:179px;
}
#regForm span.checkBoxInput {
clear:left;
float:left;
margin:8px 5px 0 0;
margin:8px 5px 3px 0;
}
#regForm p {
clear: both;
width:100%;
margin:10px 0 -7px;
}
#regForm #recaptcha_widget_div {
margin: 10px auto;
}
/* Main Page Stuff */
h3#mainPageHeader {
background-image: url(/images/fr/mainPageHeader.png);
background-repeat: no-repeat;
height:149px;
margin: 25px 0;
}
div#mainPageMiddleBurst {
background-image:url(/images/fr/middleBurst_FR.png);
background-repeat:no-repeat;
height:135px;
margin:25px 0;
position:relative;
width:750px;
}
div#mainPageMiddleBurst a {
background-image:url(/images/fr/btn-take-the-quiz-burst.png);
background-repeat:no-repeat;
display:block;
height:193px;
left:233px;
position:absolute;
top:-19px;
width:273px;
}
div#mainPageMiddleBurst a:hover {
text-decoration:none;
background-image:url(/images/fr/btn-take-the-quiz-burst_ovr.png);
}
div#mainPageMiddleBurst a#gildanColorLink {
background-image:none;
display:block;
height:12px;
left:610px;
position:absolute;
top:109px;
width:83px;
}
div#mainPageMiddleBurst a#gildanColorLink:hover {
text-decoration:underline;
}
ul#mainPageRotatingList {
background-image: url(/images/fr/didyouknow_fr.png);
background-repeat: no-repeat;
padding:32px 0 0 0;
margin: 25px 0;
list-style: none;
position: relative;
}
ul#mainPageRotatingList li {
background-image: url(/images/fr/FR-Sprite-Did-You-Know.png);
background-repeat: no-repeat;
height: 80px;
width: 750px;
}
ul#mainPageRotatingList li#fact1 {
background-position: 0px 0px;
}
ul#mainPageRotatingList li#fact2 {
background-position: 0px -80px;
}
ul#mainPageRotatingList li#fact3 {
background-position: 0px -160px;
}
ul#mainPageRotatingList li#fact4 {
background-position: 0px -240px;
}
ul#mainPageRotatingList li#fact5 {
background-position: 0px -320px;
}
div#rotateNext {
background-image:url(/images/fr/btn-read-more.png);
background-repeat:no-repeat;
height:27px;
width:150px;
margin: -30px 0 0 0;
}
div#rotateNext:hover {
cursor: pointer;
}
.bodyWrap {
margin: 25px 0;
}
.bodyWrap ol {
margin: 7px 19px;
}
.bodyWrap ol li {
margin: 4px 0px;
}
.bodyWrap ol li ol {
list-style-type: upper-alpha;
}
.bodyWrap ol li ol li ol {
list-style-type: lower-roman;
}
h3#tafHeader{
background-image:url(/images/fr/regTellAFriendHeading.png);
background-repeat:no-repeat;
width: 750px;
height: 153px;
}
/* question sprite map (actually just separate images) */
.description h3 {
margin:-1px auto 0;
}
#q_1 .description h3 {
background-image:url(/images/fr/FR-Question-01.png);
background-repeat:no-repeat;
height:104px;
width:750px;
}
#q_2 .description h3 {
background-image:url(/images/fr/FR-Question-02.png);
background-repeat:no-repeat;
height:104px;
width:750px;
}
#q_3 .description h3 {
background-image:url(/images/fr/FR-Question-03.png);
background-repeat:no-repeat;
height:104px;
width:750px;
}
#q_4 .description h3 {
background-image:url(/images/fr/FR-Question-04.png);
background-repeat:no-repeat;
height:134px;
width:750px;
}
#q_5 .description h3 {
background-image:url(/images/fr/FR-Question-05.png);
background-repeat:no-repeat;
height:104px;
width:750px;
}
#q_6 .description h3 {
background-image:url(/images/fr/FR-Question-06.png);
background-repeat:no-repeat;
height:134px;
width:750px;
}
#q_1 .description h3.chopped {
background-position:0 -8px;
}
#q_2 .description h3.chopped {
background-position:0 -8px;
}
#q_3 .description h3.chopped {
background-position:0 -8px;
}
#q_4 .description h3.chopped {
background-position:0 -8px;
}
#q_5 .description h3.chopped {
background-position:0 -8px;
}
#q_6 .description h3.chopped {
background-position:0 -8px;
}
/* response sprite map */
.responseWrapper p {
background-image: url(/images/fr/FR-Gildan-Sprite.png);
background-repeat: no-repeat;
/*cursor: pointer;*/
}
.responseWrapper p#q_1_a_1 {
background-position:30px 0px;
}
.responseWrapper p#q_1_a_2 {
background-position:30px -30px;
}
.responseWrapper p#q_1_a_3 {
background-position:30px -60px;
}
.responseWrapper p#q_1_a_4 {
background-position:30px -90px;
}
.responseWrapper p#q_1_a_5 {
background-position:30px -120px;
}
.responseWrapper p#q_2_a_1 {
background-position:30px -150px;
}
.responseWrapper p#q_2_a_2 {
background-position:30px -180px;
}
.responseWrapper p#q_2_a_3 {
background-position:30px -210px;
}
.responseWrapper p#q_2_a_4 {
background-position:30px -240px;
}
.responseWrapper p#q_2_a_5 {
background-position:30px -270px;
}
.responseWrapper p#q_3_a_1 {
background-position:30px -300px;
}
.responseWrapper p#q_3_a_2 {
background-position:30px -330px;
}
.responseWrapper p#q_3_a_3 {
background-position:30px -360px;
}
.responseWrapper p#q_3_a_4 {
background-position:30px -390px;
}
.responseWrapper p#q_3_a_5 {
background-position:30px -420px;
}
.responseWrapper p#q_4_a_1 {
background-position:30px -450px;
}
.responseWrapper p#q_4_a_2 {
background-position:30px -480px;
}
.responseWrapper p#q_4_a_3 {
background-position:30px -510px;
}
.responseWrapper p#q_4_a_4 {
background-position:30px -540px;
}
.responseWrapper p#q_4_a_5 {
background-position:30px -570px;
}
.responseWrapper p#q_5_a_1 {
background-position:30px -600px;
}
.responseWrapper p#q_5_a_2 {
background-position:30px -630px;
}
.responseWrapper p#q_5_a_3 {
background-position:30px -660px;
}
.responseWrapper p#q_5_a_4 {
background-position:30px -690px;
}
.responseWrapper p#q_5_a_5 {
background-position:30px -720px;
}
.responseWrapper p#q_6_a_1 {
background-position:30px -750px;
}
.responseWrapper p#q_6_a_2 {
background-position:30px -780px;
}
.responseWrapper p#q_6_a_3 {
background-position:30px -810px;
}
.responseWrapper p#q_6_a_4 {
background-position:30px -840px;
}
.responseWrapper p#q_6_a_5 {
background-position:30px -870px;
}
.finalSubmitButton {
background-image: url(/images/fr/btn-submit.png);
background-repeat: no-repeat;
width: 276px;
height: 85px;
background-color: transparent;
}
.finalSubmitButton:hover 
{
background-image: url(/images/fr/btn-submit_ovr.png);
background-repeat: no-repeat;
cursor: pointer;
}
.referAfriendButton {
background-image: url(/images/fr/btn-send.png);
background-repeat: no-repeat;
width: 216px;
height: 85px;
background-color: transparent;
margin: 40px auto 0;
display: block;
}
.referAfriendButton:hover 
{
background-image: url(/images/fr/btn-send_ovr.png);
background-repeat: no-repeat;
cursor: pointer;
text-decoration: none;
}
.addFriendButton {
clear:left;
float:left;
width: 50;
}
.removeFriendButton {
clear:right;
float:right;
width: 50;
}