/* 
Title: GravityGiant.com
Author: team A design 
www.GoTeamA.com
*/


/* reset
------------------------------------------------------------------*/

* { margin:0; padding:0; list-style:none; text-decoration:none; border:0; outline:none; }

.clearfix:after { content:"."; display:block; height:0; line-height:0; clear:both; visibility:hidden; }
.clearfix { display:inline-block; }
/* Hide from IE Mac \*/
 .clearfix { display:block; }
/* End hide from IE Mac */
* html .clearfix { height:1%; }

.hidden { display:none; }
.clear { clear:both; }

/* general structure
------------------------------------------------------------------*/

html, body, #page { height:100%; }

body { background:#fff; color:#000; } 

#page { width:960px; position:relative; margin:0 auto; background:url(img/bg.gif) repeat-y; }

#header { background:url(img/header-sun.jpg) 30px 0 no-repeat; width:960px; height:230px; }

#nav { margin:10px; height:1em; }

#content { width:910px; margin:40px 40px 20px 10px; }

#footer { margin:30px 10px; clear:both; text-align:center; padding-bottom:30px; }

.col {  }
.left { float:left; }
.right { float:right; }

.two-thirds { width:580px; }
.one-third { width:300px; }


/* general typography
------------------------------------------------------------------*/
body { font-size:100%; font-family: 'Droid Sans', Geneva, Helvetica, Arial, Verdana, sans-serif; }

#page { font-size:.875em; line-height:1.285em; } /* 14px base font size with a 18px line height */

h1, h2, h3, h4, h5, h6 { text-transform:uppercase; color:#000; }

h1 { font-size:2em; line-height:1em; }
h2 { font-size:1.185em; line-height:1.5em; }
h3, h4, h5, h6 { font-size:1em; line-height:1.285em; }

p { margin:1em 0; }

h2 span { color:#ffdf00; }


/* links
------------------------------------------------------------------*/

a:link { color:#000; }
a:visited { color:#000; }
a:hover, a:focus { color:#000; }
a:active { color:#000; }

p a:hover, p a:focus { color:#000; background:#ffdf00; }


/* header
------------------------------------------------------------------*/

#header h1 { position:absolute; top:50px; left:10px; background:url(img/gravity-giant-logo.png) no-repeat; width:215px; height:141px; }
#header h1 a { display:block; width:215px; height:141px; text-indent:-9999em; }

/* nav
------------------------------------------------------------------*/

#nav ul li { padding:0 30px; float:left; text-transform:uppercase; }

#nav a { padding:2px; }

#nav a:link, #nav a:visited  { color:#999; border-bottom:3px solid #fff; }
#nav a:hover, #nav a:focus, #nav a:active { color:#000; background:#ffdf00; }

#nav li.current a { color:#000; border-bottom:3px solid #ffdf00; }

/* form
------------------------------------------------------------------*/

.form-container { }

.form-container .error { }
.form-container .success { }

ul.form { }
ul.form-sidebar { margin:20px 0; }

ul.form li, ul.form-sidebar li { margin-bottom:30px; }

ul.form label { padding-right:20px; font-weight:bold; width:140px; text-align:right; display:inline-block; display:-moz-inline-block; vertical-align:top; }
ul.form label em { display:block; font-size:10px; font-weight:normal; font-style:normal; }

ul.form-sidebar label { font-weight:bold; text-transform:uppercase; }

ul.form label.error { display:block; margin-left:160px; width:300px; background:#ffdf00; text-align:left; padding:2px 4px; }

ul.form input, ul.form textarea { width:300px; padding:4px; font-size:16px; line-height:18px; color:#000; font-family: 'Droid Sans', Geneva, Helvetica, Arial, Verdana, sans-serif; }
ul.form input { border-bottom:3px solid #ccc; }
ul.form textarea { border:3px solid #ccc; height:80px; }

ul.form-sidebar input.text { width:80px; padding:4px; font-size:16px; line-height:18px; color:#000; font-family: 'Droid Sans', Geneva, Helvetica, Arial, Verdana, sans-serif; border-bottom:3px solid #ccc; }

.form-container #submit { background:#ffdf00; border:3px solid #ccc; padding:8px 16px; margin-left:160px; font:bold 14px 'Droid Sans', Geneva, Helvetica, Arial, Verdana, sans-serif; text-transform:uppercase; }

p.error { background:#ffdf00; padding:2px 4px; }
div.success strong { text-transform:uppercase; border-bottom:3px solid #ffdf00; }

/* equipment
------------------------------------------------------------------*/

#equipment h2 { margin:8px 0; clear:both; }
#equipment h2 a { color:#999; }
#equipment h2 a:hover { cursor:pointer; color:#000; background:#ffdf00; }
#equipment h2.ui-state-active a { color:#666; }

#accordion { margin:20px 0;  }

.sub-section { padding:0 1em; }
.sub-section h3, .sub-section h4 { clear:both; margin:4px 0; }
.sub-section h3 span, .sub-section h4 span { float:right; color:#666; }
.sub-section h3 em, .sub-section h4 em { display:block; color:#999; font-weight:normal; text-transform:none; font-style:normal; background:#f9f9f9; margin:2px 0; padding:1px; }
.sub-section img { border:4px solid #ffdf00; float:left; margin:0 10px 10px 0; }

div.listing { clear:both; margin-bottom:10px; }

.sub-section h3 a, .sub-section h4 a { color:#000; }
.sub-section h3 a:hover, .sub-section h4 a:hover { cursor:pointer; color:#000; background:#ffdf00; }

#accordion h2 { background:url(img/h2-plus.png) no-repeat left top; padding-left:18px; }
#accordion h2.open { background:url(img/h2-minus.png) no-repeat left top; padding-left:18px; }

.sub-accordion .ui-state-default { background:url(img/h3-plus.png) no-repeat left top; padding-left:16px; }
.sub-accordion .ui-state-active { background:url(img/h3-minus.png) no-repeat left top; padding-left:16px; }

#payment { margin:40px 0; }