/*
SECRET
#############################
GENERAL STYLES
#############################
*/
body{
color: #000;
background-color: #fff;
font-size: 62.5%;
}
#container{
font-size: 1.3em;
}
input, select, textarea{
font-size: 1em;
}
*{
font-family: arial, verdana, tahoma, helvetica, sans-serif;
}
p{
line-height: 1.4em;
}
img, a img{
border: 0;
}
input, select, textarea{
max-width: 100%;
}
h1,h2,h3,h4,h5,h6{
margin-top: 0;
padding-top: 0;
}
a:link,
a:visited{
color: #09c;
background-color: transparent;
}
a:hover,
a:active{
color: #c0f;
background-color: transparent;
}
/*
#############################
LAYOUT STYLES
#############################
*/
body{
text-align: center;
margin: 0;
padding: 0;
}
#container{
width: 760px;
margin: auto;
text-align: left;
}
/*** header ***/
.header{
background: #000 url(images/prelaunchsecretheader.jpg) ;
height: 154px;
}
/*** header extras - use this for adding extra elements to header like promos etc ***/
.header-extras{
position: absolute;
top: 0;
right: 0;
}
/*** header navigation ***/
#header-nav{
text-align: left;
}
#header-nav ul{
margin: 0;
padding: 0;
list-style-type: none;
list-style-image: none;
background-image: none;
display: list-item;
}
#header-nav li{
margin: 0;
padding: 0;
display: inline;
background-image: none;
list-style-type: none;
list-style-image: none;
background-image: none;
line-height: auto;
}
/*** content sections ***/
#content{
padding: 15px;
height: 1%;
}
*>#content{
height: auto;
}
#content:after{
content: ".";
display: block;
height: 0;
clear: both;
}
.content-section{
clear: both;
margin-bottom: 10px;
}
.wide{
clear: both;
}
.right,
.left,
.center{
width: 500px;
}
.right{
float: right;
}
.left{
float: left;
}
.center{
margin-left: 120px;
clear: both;
}
/*** sidebar ***/
.sidebar-left,
.sidebar-right{
width: 200px;
}
.sidebar-section{
margin-bottom: 20px;
}
.sidebar-left{
}
.sidebar-right{
margin-left: 517px;
}
*>.sidebar-right{
margin-left: 520px;
}
/*** footer navigation ***/
#footer-nav{
clear: both;
text-align: center;
}
/*** footer ***/
#footer,
#footer *{
clear: both;
text-align: center;
}
#footer *{
margin: 0;
}
/*
#############################
PRESENTATIONAL STYLES
#############################
*/
body{
background: #ddcbb3 url(images/container-bg.jpg) repeat-y top center fixed;
}
/*** header ***/
#header {
color: #fff;
background-color: #000;
border-top: 4px solid #f00;
padding-top: 1px;
}
* html #header{
height: 1%;
}
*>#header{
height: auto;
}
#header:after{
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#header h1{
margin: 10px 0;
padding: 0;
float: left;
width: 300px;
text-align: center;
}
.header-extras{
position: static;
line-height: 1.5em;
font-size: 13px;
margin: 0 0 0 300px;
padding: 10px;
}
/*** header navigation ***/
/*** content ***/
#content{
color: inherit;
background-color: #fff;
position: relative;
}
* html #content{
height: 1%;
}
*:first-child+html #content{
height: 1%;
}
/*** sidebar ***/
.sidebar-section{
color: inherit;
background: #ffd6ad url(images/sidebar-bg.png) no-repeat left bottom;
padding: 10px;
}
.sidebar-section-heading{
color: inherit;
background: #ffd6ad url(images/sidebar-bg.png) no-repeat;
position: relative;
margin: -10px -10px 0;
}
.sidebar-section-heading h3{
margin: 0;
padding: 10px 0 0;
color: #000;
background-color: transparent;
font-size: 20px;
text-align: center;
}
/*** footer navigation ***/
/*** footer ***/
#footer{
font-size: .9em;
color: #ccc;
background-color: #000;
padding: 5px 10px;
border-bottom: 4px solid #f00;
}
.footer-message{
font-size: 1.2em;
padding: 0 0 1em 0;
color: #ccc;
background-color: transparent;
}
.footer-copyright-text {
font-size: 0.8em;
padding: 0 0 1em 0;
color: #ccc;
background-color: transparent;
}
/*
#############################
CONTENT STYLES
#############################
*/
/*** form related elements ***/
.user-link{
text-align: right;
margin-right: 20px;
}
.user-link a{
color: #000;
background-color: #ffd6ad;
padding: 5px 10px;
font-weight: bold;
font-size: 11px;
text-decoration: none;
margin-left: .5em;
}
.user-link a:hover{
text-decoration: underline;
}
.status-message{
color: #fff;
background-color: #000;
padding: 3px 5px;
border-bottom: 4px solid #f00;
font-size: 10px;
}
label{
font-size: 12px;
color: #c60;
background-color: transparent;
}
.form-sidenotes{
color: #666;
background-color: transparent;
font-family: verdana, sans-serif;
font-size: 11px;
}
.form-attention{
font-size: 20px;
font-weight: normal;
color: #f00;
background-color: transparent;
}
.form-highlights{
font-style: normal;
color: #008000;
background-color: transparent;
}
.calculator{
color: inherit;
background: #f0d0a7 url(images/calculator-bg.png) left bottom no-repeat;
padding: 10px;
width: 440px;
}
.calculator h4{
background: transparent url(images/calculator-bg.png) no-repeat;
position: relative;
margin: -10px -10px 0;
padding: 10px 10px 0;
}
.calculator-secret-check{
position: relative;
}
#check-name, #check-date, #result, #result_text{
position: absolute;
color: #006;
background-color: transparent;
font-size: 12px;
}
#check-name{
top: 65px;
left: 44px;
line-height: 18px;
width: 220px;
}
#check-date{
top: 25px;
left: 290px;
line-height: 18px;
width: 220px;
}
#result{
top: 66px;
left: 284px;
line-height: 19px;
}
#result_text{
top: 92px;
left: 24px;
line-height: 22px;
text-indent: 85px;
width: 312px;
}
/*** image and captions ***/
.image{
display: block;
padding: 10px;
text-align: center;
}
.img-right{
float: right;
clear: right;
margin: 0 0 10px 10px;
}
.img-left{
float: left;
clear: left;
margin: 0 10px 10px 0;
}
.image-caption{
padding-top: 5px;
display: block;
color: #666;
text-align: center;
}
.img-right,
.img-left{
height: 1%;
}
*>.img-right,
*>.img-left{
height: auto;
}
.img-right:after,
.img-left:after{
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}