/*
CSS: theCoderie.com
for TheCoderie, www.thecoderie.com
21 Sept 2009
Author: Alia Rose Connor, www.aliglia.com
*/

/*---------->>> GLOBAL <<<-----------*/

* {
	margin:0;
	padding:0;
}
body {
	font-family:Helvetica, Arial, sans-serif;
	font-size:.8em;
	color:#777777;
}
h2, h3 {
    font-family:Georgia, serif;
}
#wrapper {
	width:870px;
	margin:32px auto;
}
.container {
    min-height:420px;
}
li {
	list-style:none;
} 
a {
	text-decoration:none;
	color:#ff6600;
}
a img {
	border:none;
}
.clear {
	clear:both;
}

/*---------->>> HEADER <<<-----------*/
#header {
	margin:25px 0;
	background:url(/images/border.gif) bottom left repeat-x;
}
#header .tagline {
    text-indent:-9999px;
    width:143px;
    height:13px;
    background:url(/images/tagline.jpg) no-repeat;
    margin-bottom:5px;
    margin-left:3px;
}
h1 a {
	display:block;
	text-indent:-9999px;
	width:177px;
	height:27px;
	background:url(/images/logo.jpg) no-repeat;
	float:left;
	clear:both;
	margin-bottom:14px;
}
#nav {
    float:left;
    margin-top:11px;
    margin-left:100px;
}
#nav li {
    float:left;
    margin-left:30px;
}
#nav li a {
    text-indent:-9999px;
    display:block;
    height:16px;
    padding-bottom:2px;
}
#nav li a:hover,
#nav li a.selected {
    border-bottom:2px solid #666666;
}
#nav li.about a {
    width:67px;
    background:url(/images/nav_about.jpg) 0 0 no-repeat;
}
#nav li.about a:hover,
#nav li.about a.selected {
    background-position: -68px 0;
}
#nav li.contact a {
    width:87px;
    background:url(/images/nav_contact.jpg) 0 0 no-repeat;
}
#nav li.contact a:hover,
#nav li.contact a.selected {
    background-position: -89px 0;
}
#nav li.portfolio a {
    width:97px;
    background:url(/images/nav_portfolio.jpg) 0 0 no-repeat;
}
#nav li.portfolio a:hover,
#nav li.portfolio a.selected {
    background-position: -99px 0;
}
#nav li.links a {
    width:59px;
    background:url(/images/nav_links.jpg) 0 0 no-repeat;
}
#nav li.links a:hover,
#nav li.links a.selected {
    background-position: -61px 0;
}
#nav li.blog a {
    width:50px;
    height:17px;
    background:url(/images/nav_blog.jpg) 0 0 no-repeat;
}
#nav li.blog a:hover,
#nav li.blog a.selected {
    background-position: -53px 0;
}
#nav li.team a {
    width:57px;
    background:url(/images/nav_team.jpg) 0 0 no-repeat;
}
#nav li.team a:hover,
#nav li.team a.selected {
    background-position: -59px 0;
}
#nav li.breadbox a {
    width:131px;
    background:url(/images/nav_breadbox.jpg) 0 0 no-repeat;
}
#nav li.breadbox a:hover,
#nav li.breadbox a.selected {
    background-position: -131px 0;
}

/*---------->>> HOME <<<-----------*/
#home #info, 
#home #splash {
    font-size:2.5em;
    font-family:Georgia, serif;
}
#home #info {
    line-height:.75em;
    margin-top:10px;
    margin-bottom:20px;
}
#home #info em {
    font-style:italic;
    color:#ff6600;
}
#home #info a {
    color:#666666;
    text-decoration:underline;
    font-size:.35em;
    font-family:Helvetica, sans-serif;
    margin-left:6px;
}
#home #splash {
    line-height:2.15em;
    background:url(/images/border.gif) repeat-x;
    padding-top:25px;
}
#home #splash em {
    font-style:italic;
}
.em1,
.em1 a {
    color:#79b70c;
}
.em2,
.em2 a {
    color:#333399;
}
.em3,
.em3 a {
    color:#0cadb7;
}
.em4,
.em4 a {
    color:#ff6600;
}
.em5,
.em5 a {
    color:#993399;
}
.em1 a:hover,
.em2 a:hover,
.em3 a:hover,
.em4 a:hover,
.em5 a:hover {
    text-decoration:underline;
}
/*---------->>> STATIC PAGES <<<-----------*/
#page {
    padding-top:15px;
}
#page h2 {
    width:120px;
    text-align:right;
    float:left;  
    font-size:2.5em;
    font-weight:normal;
    color:#666666;
}
#page .content {
    width:590px;
    margin-left:25px;
    float:left;
    margin-top:8px;
    margin-bottom:100px;
}
#page .content h3 {
    font-size:2.5em;
    color:#ff6600;
    font-weight:normal;
    line-height:1.5em;
}
#page .content p,
#page .content ul {
    font-size:.95em;
    line-height:1.35em;
    margin-bottom:9px;
}
#page .content li {
    list-style:disc outside;
    margin-left:18px;
    list-style-image:url(/images/li.jpg);
    margin-bottom:3px;
}
/*---------->>> PORTFOLIO <<<-----------*/
#portfolio {
    padding-top:15px;
    padding-left:50px;
}
#portfolio h2 {
    color:#666666;
    font-size:2.5em;
    font-weight:normal;
    margin-bottom:10px;
    margin-left:-10px;
}
#portfolio h4 a {
    color:#ff6600;
    font-size:.9em;
    margin-bottom:2px;
    display:block;
}
#portfolio #portfolio_items li {
    width:350px;
    float:left;
    margin-right:60px;
    margin-bottom:35px;
}
#portfolio #portfolio_items .image {
    float:left;
    width:130px;
}
#portfolio #portfolio_items .image img {
    width:130px;
    height:114px;
    display:block;
}
#portfolio #portfolio_items .info {
    margin-left:16px;
    width:200px;
    float:left;
}
#portfolio #portfolio_items p {
    font-size:.95em;
    line-height:1.3em;
}
#portfolio #portfolio_items p.link a {
    color:#3399cc;
    text-decoration:underline;
}
#portfolio_detail {
    padding-top:15px;
    padding-left:50px;
}
#portfolio_detail h2 a {
    color:#666666;
    font-size:1.67em;
    font-weight:normal;
    margin-bottom:10px;
    display:block;
}
#portfolio_detail h4 {
    color:#ff6600;
    font-size:.9em;
    margin-bottom:3px;
}
#portfolio_detail .info {
    width:170px;
    float:left; 
    margin-left:-10px; 
}
#portfolio_detail .info p.link a {
    color:#3399cc;
    text-decoration:underline;
    font-size:.9em;
}
#portfolio_detail .description {
    width:448px;
    margin-left:12px;
    float:left;
    font-size:.95em;
    line-height:1.35em;
}
#portfolio_detail .description p {
    margin-bottom:20px;
}
#portfolio_detail img {
    margin-bottom:12px;
}
#portfolio_detail .previous {
    color:#ff6600;
    font-size:1.3em;
    background:url(/images/previous.jpg) no-repeat left center;
    padding-left:14px;
    margin-top:135px;
    display:block;
    margin-left:65px;
}
#portfolio_detail .next {
    color:#ff6600;
    font-size:1.3em;
    background:url(/images/next.jpg) no-repeat right center;
    padding-right:14px;
    margin-top:210px;
    display:block;
    width:30px;
    float:left;
    margin-left:45px;
}
/*---------->>> FOOTER <<<-----------*/
#footer {
    background:url(/images/border.gif) repeat-x;
    margin-top:20px;
    padding-top:20px;
    padding-left:2px;
    font-size:.95em;
}
#footer p span {
    margin-right:20px;
}
