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

/*body {
margin: 0;
padding: 0;
background-image:url(../images/background.jpg);
background-repeat: repeat-x;
background-color: #000000;
}*/

sup {
font-size: 6px;
}

img.logo {
position: absolute;
top: 0;
left: 10%;
}

#container {
width: 810px;
margin: 0 auto; 
padding: 0;
}

a img {
border: 0;
}

a {
text-decoration: none;
}

#header {
/*position: relative;*/
clear:both;
margin-top: 72px;
width: 810px;
height: 49px;
background-image: url(../images/probs/headBack.jpg); 
background-repeat: no-repeat;
}

img.heading {
margin-left: 20px;
margin-top: 17px;
}

#main {
position: relative;
width: 809px;
height: 371px;
background-image: url(../images/probs/mainBack.jpg);
}

img.dudes {
margin-left: 20px;
margin-top: 1px;
}

/*--------- solutions ---------------*/

#solution {
position: absolute;
top: 5px;
left: 20px;
width: 370px;
height: 240px;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
overflow: auto;
}

#solution p {
margin-right: 5px;
color: #999999;
}

#solution p.top {
font-weight: bold;
/*font-style: italic;*/
color: #FFFFFF;
margin-top: 0px;
}

#image {
position: absolute;
top: 5px;
left: 405px;
width: 385px;
height: 240px;
}

#fact {
background-image: url(../images/probs/factBack.jpg);
background-repeat: no-repeat;
width: 385px;
height: 59px;
margin-top: 5px;
position: relative;
}

p.fact {
position: absolute;
left: 70px;
top: 17px;
margin: 0;
color:#FFFFFF;
font-size: 10px;
font-family:Arial, Helvetica, sans-serif;
}

img.gfact {
margin-top: 12px;
margin-left: 10px;
}

#sol1 ,#sol2 ,#sol3 , #sol4 ,#sol5 ,#sol6 {
background-image: url(../images/probs/sol4_back.jpg);
background-repeat: no-repeat;
width:768px;
height:262px;
position: absolute;
top:1px;
left:21px;
}

#4on {
display: inline;
}

img.doYou {
float: left;
display: inline;
margin-left: 43px;
margin-top: 76px;
}

#right {
float: right;
width: 490px;
height: 262px;
position: relative;
}

p.headingSM {
margin: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
color: #FFFFFF;
position: absolute;
top: 85px;
left: 237px;
width: 220px;
}

#right ul {
color: #FFFFFF;
font-family: Arial, Helvetica, sans-serif;
font-size: 11px;
margin: 0;
padding: 0;
position: absolute;
top: 100px;
left: 250px;
}


img.problem {
position: absolute;
bottom: 0;
left: 0;
}

/*--------- end solutions ---------------*/

#badges {
position: absolute;
text-align: center;
top: 280px;
left: 20px;
width: 770px;
height: 80px;
}

#badges ul {
list-style-type: none;
margin: 0;
padding: 0;
}

#badges ul li {
display: inline;
margin-right: 1px;
}

.hidden {
display: none;
}
.unhidden {
display: block;
}

#cta {
width: 810px;
height: 66px;
background-image: url(../images/footerBack.jpg);
background-repeat: repeat-y;
}

img.cta {
margin: 5px 0px 0px 0px;
}

#roundBottom {
width: 810px;
height:5px;
background-image: url(../images/roundBottom.jpg);
background-repeat: no-repeat;
}

#footer {
position: relative;
float: left;
margin-top: 20px;
width: 810px;
}

#footer p {
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color:#FFFFFF;
}

#footer ul {
position: absolute;
top: 0px;
right: 0px;
list-style-type: none;
font-size: 10px;
font-family: Arial, Helvetica, sans-serif;
color: #FFFFFF;
}

#footer ul li {
display: inline;
}

#footer ul li a {
color:#0033FF;
}