/*
Theme Name: GTN
Theme URI: http://greaterthannothing.com
Description: A theme designed for the Greater than Nothing website
Version: 1
Author: Tom Lawton
Author URI: http://greaterthannothing.com
Tags: GTN, Greater than Nothing
*/

@import "style/css/reset.css";
@import "style/css/typography.css";
@import "style/css/layout.css";

/*-------------------------------------Page Styles----------------------------------------*/
body {
background: #EAEAEA;
font-family: "Lucida Grande", "Luxi Sans", "Bitstream Vera Sans", "Trebuchet MS", helvetica, verdana, arial, sans-serif;
}

#container {
position: relative;
}

h2 {
padding: 5px 0px 10px 0px;
}

h3, h4, p {
padding: 5px 0px 10px 0px;
line-height:1.8;
}
h2 {
font-size: 1.6em;
}

h3 {
font-size: 1.3em;
}

h4 {
font-size: 1.2em;
}

p {
font-size: 0.9em;
}

/*-------------------------------------Branding Area Styles----------------------------------------*/

#brandingArea {
height: 150px;
background: #000 url(style/graphics/branding-bg.png) repeat-x;
text-align: center;
}

#brandingContent {
width: 900px;
height: 150px;
margin: auto;
background: url(style/graphics/greater-than-nothing-logo.png) no-repeat;
text-align: left;
}

#brandingContent h1 {
text-indent: -9999px;
}

/*-------------------------------------Navigation Area Styles----------------------------------------*/

#navArea {
width: 900px;
margin: auto;
margin-top: -36px; /*Brings the navigation up onto the branding area just the same height as the tabs*/
}

#navArea ul {
width: 715px;
height: 36px;
position: relative;  /*Sets the positioning context for the tabs*/
background: url(style/graphics/nav-tabs.png) no-repeat;
}

.nav li {
display: inline;
}

.nav a:link, .nav a:visited {
position: absolute;
top: 0px;
height: 36px;
width: 102px;
text-indent: -9000px;
overflow: hidden;
z-index: 10;
outline: none;
}

/*Home Tab Styles*/
.nav .home a:link, .nav .home a:visited {
left: 0px;
}

.nav .home a:hover, .nav .home a:focus {
background: url(style/graphics/nav-tabs.png) no-repeat 0px -80px;
}

.nav .home a:active {
background: url(style/graphics/nav-tabs.png) no-repeat 0px -40px;
}

.current-home .home a:link, .current-home .home a:visited {
background: url(style/graphics/nav-tabs.png) no-repeat 0px -40px;
cursor: default;
}

/*Portfolio Tab Styles*/
.nav .portfolio a:link, .nav .portfolio a:visited {
left: 102px;
}

.nav .portfolio a:hover, .nav .portfolio a:focus {
background: url(style/graphics/nav-tabs.png) no-repeat -102px -80px;
}

.nav .portfolio a:active {
background: url(style/graphics/nav-tabs.png) no-repeat -102px -40px;
}

.current-portfolio .portfolio a:link, .current-portfolio .portfolio a:visited {
background: url(style/graphics/nav-tabs.png) no-repeat -102px -40px;
cursor: default;
}

/*Tutorials Tab Styles*/
.nav .tutorials a:link, .nav .tutorials a:visited {
left: 204px;
}

.nav .tutorials a:hover, .nav .tutorials a:focus {
background: url(style/graphics/nav-tabs.png) no-repeat -204px -80px;
}

.nav .tutorials a:active {
background: url(style/graphics/nav-tabs.png) no-repeat -204px -40px;
}

.current-tutorials .tutorials a:link, .current-tutorials .tutorials a:visited {
background: url(style/graphics/nav-tabs.png) no-repeat -204px -40px;
cursor: default;
}

/*Photography Tab Styles*/
.nav .training a:link, .nav .training a:visited {
left: 306px;
}

.nav .training a:hover, .nav .training a:focus {
background: url(style/graphics/nav-tabs.png) no-repeat -306px -80px;
}

.nav .training a:active {
background: url(style/graphics/nav-tabs.png) no-repeat -306px -40px;
}

.current-training .training a:link, .current-training .training a:visited {
background: url(style/graphics/nav-tabs.png) no-repeat -306px -40px;
cursor: default;
}

/*Contact Tab Styles*/
.nav .contact a:link, .nav .contact a:visited {
left: 408px;
}

.nav .contact a:hover, .contact a:focus {
background: url(style/graphics/nav-tabs.png) no-repeat -408px -80px;
}

.nav .contact a:active {
background: url(style/graphics/nav-tabs.png) no-repeat -408px -40px;
}

.current-contact .contact a:link, .current-contact .contact a:visited {
background: url(style/graphics/nav-tabs.png) no-repeat -408px -40px;
cursor: default;
}

/*About Tab Styles*/
.nav .about a:link, .nav .about a:visited {
left: 510px;
}

.nav .about a:hover, .nav .about a:focus {
background: url(style/graphics/nav-tabs.png) no-repeat -510px -80px;
}

.nav .about a:active {
background: url(style/graphics/nav-tabs.png) no-repeat -510px -40px;
}

.current-about .about a:link, .current-about .about a:visited {
background: url(style/graphics/nav-tabs.png) no-repeat -510px -40px;
cursor: default;
}

/*Links Tab Styles*/
.nav .links a:link, .nav .links a:visited {
left: 612px;
}

.nav .links a:hover, .nav .links a:focus {
background: url(style/graphics/nav-tabs.png) no-repeat -612px -80px;
}

.nav .links a:active {
background: url(style/graphics/nav-tabs.png) no-repeat -612px -40px;
}

.current-links .links a:link, .current-links .links a:visited {
background: url(style/graphics/nav-tabs.png) no-repeat -612px -40px;
cursor: default;
}

/*Styles for the jQuery Rollover*/

.nav-home {
position: absolute;
top: 0px;
left: 0px;
height: 36px;
width: 102px;
background: url(style/graphics/nav-tabs.png) no-repeat 0px -80px;
}

.nav-portfolio {
position: absolute;
top: 0px;
left: 102px;
height: 36px;
width: 102px;
background: url(style/graphics/nav-tabs.png) no-repeat -102px -80px;
}

.nav-tutorials {
position: absolute;
top: 0px;
left: 204px;
height: 36px;
width: 102px;
background: url(style/graphics/nav-tabs.png) no-repeat -204px -80px;
}

.nav-training {
position: absolute;
top: 0px;
left: 306px;
height: 36px;
width: 102px;
background: url(style/graphics/nav-tabs.png) no-repeat -306px -80px;
}

.nav-contact {
position: absolute;
top: 0px;
left: 408px;
height: 36px;
width: 102px;
background: url(style/graphics/nav-tabs.png) no-repeat -408px -80px;
}

.nav-about {
position: absolute;
top: 0px;
left: 510px;
height: 36px;
width: 102px;
background: url(style/graphics/nav-tabs.png) no-repeat -510px -80px;
}

.nav-links {
position: absolute;
top: 0px;
left: 612px;
height: 36px;
width: 102px;
background: url(style/graphics/nav-tabs.png) no-repeat -612px -80px;
}

/*-------------------------------------Post List Styles----------------------------------------*/

.postListHeading  a {
text-decoration: none;
font-size: 1.8em;
color: #34588F;
}

.post {
padding: 5px;
margin: 0 0 10px 0;
background: #F2F2F2 url(style/graphics/post-bg.png) repeat-x;
border: #ffffff 2px solid;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
border-radius: 8px;
}
/*-------------------------------------Content Area Styles----------------------------------------*/

#content {
width: 900px;
margin: auto;
margin-top: 40px;
text-align: center;
}

#mainContent {
width: 580px;
float: left;
text-align: left;
}

#secondaryContent {
width: 300px;
float: right;
text-align: left;
}

#secondaryContent li {
margin-bottom: 10px;
background: url(style/graphics/secondary-middle.png) repeat-y;
}

#secondaryContent h2, #secondaryContent p, #secondaryContent input{
padding-right: 10px;
}

#secondaryContent p, #secondaryContent input, .widget li {
margin: 5px 10px 5px 10px;
}

#secondaryContent div.RSSWidget h2 {
padding-top: 15px;
background: url(style/graphics/rss-logo.png) no-repeat top;
}

#secondaryContent div.searchWidget h2 {
padding-top: 15px;
background: url(style/graphics/search-logo.png) no-repeat top;
}

#secondaryContent div.categoriesWidget h2 {
padding-top: 15px;
background: url(style/graphics/categories-logo.png) no-repeat top;
}

#secondaryContent div.siteStuffWidget h2 {
padding-top: 15px;
background: url(style/graphics/site-stuff-logo.png) no-repeat top;
}

#secondaryContent div.widget {
padding-bottom: 15px;
background: url(style/graphics/secondary-bottom.png) no-repeat bottom;
}

.clientList li {
width: 260px;
min-height: 400px;
padding: 7px;
border: 1px solid #000;
/*Add rounded corners where supported*/
-moz-border-radius: 7px;
-webkit-border-radius: 10px;
border-radius: 10px;
margin: 7px;
float: left;
background: #252525;
color: #fff;
}
/*-------------------------------------Site Info Area Styles----------------------------------------*/

#siteInfo {
clear: both;
position: relative;
top: 25px;
background: #000 url(style/graphics/footer-wrapper-bg.png) repeat-x bottom;
text-align: left;
color: #fff;
text-align: center;
}

#siteInfoContent {
width: 900px;
position: relative;
margin: auto;
padding-top: 15px;
padding-bottom: 10px;
background: url(style/graphics/footer-top.png) no-repeat top;
text-align: left;
}

#siteInfo #contactInfo, #siteInfo #recomendedLinks, #siteInfo #styleSwitcher {
float: left;
margin-right: 5px;
width: 295px;
}

#siteInfo #styleSwitcher ul{
position: absolute;
right: 20px;
top: -11px;
}

#siteInfo #styleSwitcher li{
float: left;
margin-right: 10px;
}

#footer {
clear: both;
overflow: hidden;
}

#copyright {
float: left;
}

#validation {
float: right;
}

#validation p {
float: left;
}