/**********************************************************************************************

	CSS on Sails
	Title: X-Team
	Author: XHTMLized (http://www.xhtmlized.com/)
	Date: December 2009

***********************************************************************************************

	1. BASE
			1.1 Reset
			1.2 Accessibility Navigation & Hide
			1.3 Clearfix
			1.4 Default Styles

	2. LAYOUT
			2.1 Structure
			2.2 Content
			2.3 Footer

***********************************************************************************************/


/* 1. BASE
-----------------------------------------------------------------------------------------------
===============================================================================================*/


/* 1.1 Reset
-----------------------------------------------------------------------------------------------*/

html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, samp, small, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
a, ins, del { text-decoration: none; }
table { border-collapse: collapse; border-spacing: 0; }
th, td { vertical-align: top; }
th { text-align: left; }

/* 1.2 Accessibility Navigation & Hide
-----------------------------------------------------------------------------------------------*/

.hide,
body.home section h1,
.home form label { position: absolute; top: -999em; left: -999em; height: 1px; width: 1px; }


/* 1.3 Clearfix
-----------------------------------------------------------------------------------------------*/

form ol:after,
#content form li:after,
.container:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }


/* 1.4 Default Styles
-----------------------------------------------------------------------------------------------*/

body { background: #fff; color: #000; font: 62.5%/1.3 "Helvetica", Arial, sans-serif; text-align: center; }
hr { display: none; }
strong { font-weight: bold; }
em { font-style: italic; }
del { text-decoration: line-through; }
th { font-weight: normal; }
address, cite, dfn { font-style: normal; }
li { list-style: none; }
abbr, acronym { border-bottom: 1px dotted #999; cursor: help; }
input, textarea, select { font-family: "Helvetica", Arial, sans-serif; }
a, a:visited { color: #000; text-decoration: none; }
a:hover, a:active { color: #000; text-decoration: underline; }
article, aside, dialog, figure, footer, header, hgroup, menu, nav, section { display: block; }


/* 2. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/


/* 2.1 Structure
-----------------------------------------------------------------------------------------------*/

.container { width: 960px; margin: 0 auto; font-size: 1em; text-align: left; }
section { font-size: 5em; }
 

/* 2.2 Content
-----------------------------------------------------------------------------------------------*/

blockquote { text-transform: uppercase; padding: 10px 0 31px; line-height: 1.1; letter-spacing: -3px; text-align: center; }
blockquote strong { color: #df3d3c; }
blockquote .cite { font-style: normal; font-weight: normal; text-align: center; font-size: .5em; letter-spacing: 0; line-height: 1; margin-top: -10px; }
blockquote .cite a { font-weight: bold; }

#biz-stone { font-size: 1.4em; padding-bottom: 39px; padding-top: 13px; }
#biz-stone strong { font-size: 1.7em; }
#biz-stone .cite { font-size: .3em; }

#harper-reed { font-size: 2.05em; line-height: 1.3; padding: 10px 0 31px; }
#harper-reed strong { font-size: .65em; }
#harper-reed .cite { font-size: .22em; margin-top: -20px; }

#evan-williams { font-size: 1.5em; }
#evan-williams strong { font-size: 1.75em; }
#evan-williams .cite { font-size: .32em; }

#fox-broadcasting { font-size: 2.2em; padding: 10px 20px 84px; line-height: 1.3; }
#fox-broadcasting strong { font-size: .6em; }
#fox-broadcasting .cite { font-size: .25em; margin-top: -15px; }

#cachefly { font-size: .8em; padding: 0 0 94px; }
#cachefly strong { font-size: 2.6em; vertical-align: middle; }
#cachefly .cite { font-size: .6em; }

body.home form { padding: 0 0 0 67px; width: 540px; margin: 0 auto; position: relative; }
body.home form ol { width: 481px; padding: 0 67px 0 0; overflow: hidden; }
body.home form li { float: left; }
form textarea, 
form input.text { color: #333; text-transform: none; padding: 6px 9px 4px; margin: 0; font-size: .45em; float: left; }
form textarea { border: 1px solid #c9cfcf; border-bottom: 0; width: 455px; height: 153px; padding-top: 10px; overflow: auto; }
form input.text { border: 1px solid #c9cfcf; width: 218px; }
form input.first { border-right: 0; }
form input:focus, 
form textarea:focus { color: #333; text-transform: none; }
form input.error,
form textarea.error { border-color: red; }
form input.hint-text,
form textarea.hint-text { color: #c9cfcf; text-transform: uppercase; } 

button.join { display: inline; clear: both; width: 320px; height: 1%; padding: 34px 0 15px 22px; border: none; font-family: Helvetica, Arial, sans-serif; cursor: pointer; color: #dc3e38; background: url(../images/bg-submit.png) no-repeat; font-size: .41em; text-transform: uppercase; font-weight: bold; text-align: left; line-height: 1.15; float: right; margin: 7px 77px 100px 0; }
button.join br { display: none; }
button.join em { display: block; font-size: .6em; line-height: normal; font-style: normal; color: #fff; }
.order button.join { font-size: 1.55em; margin-bottom: 0; float: none; }

.thanks { background: #fff; position: absolute; top: 0; left: 0; width: 540px; margin: 0 auto; padding: 29px 0 210px 47px; font-size: 1.1em; line-height: 72px; font-weight: normal; text-align: left; text-transform: uppercase; color: #c9cfcf; display: none; }
.loading { background: #fff url(../images/ajax-loader.gif) no-repeat center center; position: absolute; top: 0; left: 0; height: 300px; width: 475px; margin: 0 0 0 67px; display: none; }

/* order page */
#content { border: 1px solid #ddd; font-size: 1.3em; float: left; width: 620px; margin-top: 67px; padding-bottom: 50px; margin-bottom: 50px; }
#content h1 { padding: 15px 25px; font-size: 1.7em; background: #000; color: #fff; font-weight: bold; line-height: 1; }
#content h2 { color: #df3d3c; text-transform: uppercase; font-size: 1.4em; font-weight: bold; padding-bottom: 15px; }
#content label { width: 125px; display: block; float: left; cursor: pointer; padding: 5px 0; }
#content input.text { float: left; width: 425px; font-size: 1em; }
#content textarea { font-size: 1em; }
#content input.text, 
#content textarea { padding: 5px 9px; text-transform: none; }
#content textarea { padding-top: 10px; border-bottom: 1px solid #c9cfcf; height: 60px; width: 550px; }
#content input.small { width: 66px; margin-right: 10px; }
#content .due-date select { width: 162px; }
#content form { padding: 20px 25px; }
#content form li { margin-bottom: 15px; } 
#content form .desc label,
#content form .desc textarea,
#content form .attach label,
#content form .attach input { float: none; color: #333; }
#content form .attach input { font-size: 1em; }
#content form .attach { background: url(../images/ico-clip.png) no-repeat center left; padding: 5px 0 5px 30px; }
#content form select { margin-top: 2px; font-size: 1em; padding: 2px; }
#content .email input { width: 143px; }
#content .email em { display: block; width: 47px; font-size: 1.2em; line-height: 1.8; font-style: normal; text-align: center; float: left; }
#content .email .button { float: left; margin-top: -9px; }

.button { display: block; width: 219px; height: 37px; background: url(../images/bg-button.png) no-repeat bottom left; overflow: hidden; text-align: center; line-height: 1.2; padding: 5px 8px 0; }
.calc { background-position: top left; text-align: left; width: 173px; float: none; clear: left; margin-left: 125px; margin-top: 20px; margin-bottom: 10px; padding: 5px 30px 0 32px; }

#secondary-content { width: 300px; float: right; font-size: 1.4em; padding-top: 67px; }
#secondary-content h2 { font-size: 1.5em; font-weight: bold; padding-bottom: 15px; }
#secondary-content li { background: url(../images/ico-arrow.png) no-repeat 3px 7px; margin-bottom: 15px; text-indent: 15px; padding: 2px 2px 0; }
#secondary-content li.highlight { background-color: #ff9; }
#secondary-content .guarantee { font: italic bold 1.8em Palatino Linotype, Book Antiqua, Palatino, serif; }
#secondary-content .guarantee a { text-transform: uppercase; }
#secondary-content a, #secondary-content a:visited, #secondary-content a:hover, #secondary-content a:active { color: #09f; text-decoration: underline; }
#secondary-content a:hover { text-decoration: none; }


/* 2.3 Footer
-----------------------------------------------------------------------------------------------*/

footer { background: #dc3e38; color: #fff; font-weight: bold; text-transform: uppercase; text-align: center; padding: 20px; position: relative; font-size: .9em; clear: both; }
footer address,
footer address span { position: relative; width: 143px; height: 50px; margin: 0 auto; display: block; overflow: hidden; }
footer address span { background: url(../images/logo-footer.png) no-repeat; position: absolute; top: 0; left: 0; cursor: pointer; }
footer p { position: absolute; left: 50%; top: 64px; text-align: left; width: 200px; margin-left: -15px; }