/*
Theme Name:		WP Framework
Theme URI: 		http://wpframework.com/
Version: 		0.2.4.10
Description: 	A <em>blank</em> WordPress Theme Framework <strong>that's everything you need, and nothing you don't.</strong> With features like <em>microformats, a traditional template structure, convention over configuration, clean semantic code, documenation, and it's atomic templating system</em>, WP Framework is <em>completely extensible, flexible</em> and <strong><em>the</em></strong> starting point for theme authoring and customization. To learn more, visit <a href="http://wpframework.com">http://wpframework.com</a>.
Author: 		Ptah Dunbar
Author URI:		http://ptahdunbar.com
Tags:			one-column, two-columns, three-columns, fixed-width, sticky-post, threaded-comments, microformats

Copyright 2008 Ptah Dunbar <http://ptahdunbar.com> All rights reserved.
WP Framework is licensed under the terms of the GNU General Public License version 2.

If you have any questions, comments, or concerns, 
visit <http://wpframework.com> for more information!
*/

/* Reset Browser Defaults */
@import url( 'library/media/css/reset.css' );


/**Layout**/
body {
background: #B0B1AF url(/images/bckgrnd.jpg) repeat-y top center;
}

#wrapper {
width: 990px;
margin-left: auto;
margin-right: auto;
}

#container {
width: 990px;
}

.clearfix {
clear: both;
}


/**Header**/

#header {
width: 100%;
margin: 10px auto 10px auto;
}

#logo {
width: 212px;
height: 111px;
text-indent: -9999px;
float: left;
background: url(/images/bwlogo.png) no-repeat;
}

#page-menu {
height: 111px;
width: 778px;
float: right;
text-align: right;
}

#page-menu ul li {
list-style-type: none;
display: inline;
margin-left: 50px;
font-weight: bold;
font-size: 22px;
}

#page-menu ul li a {
color: #777777;
text-decoration: none;
}

#page-menu ul li a:hover,  #page-menu ul li a:active {
color: #000000;
}

#home #home-link, #about #about-link, #portfolio #portfolio-link, #contact #contact-link {
color: #000000;
}

/***General Typography **/

body {
font-family: "Century Gothic", Arial, sans;
font-size: 16px;
line-height: 22px;
}

p {
margin-bottom: 22px;
}

h1 {
font-size: 24px;
line-height: 22px;
margin-bottom: 22px;
}

h2 {
font-size: 20px;
line-height: 22px;
margin-bottom: 22px;
}

h3 {
font-size: 18px;
line-height: 22px;
margin-bottom: 22px;
}

h4, h5 {
font-size: 16px;
line-height: 22px;
margin-bottom: 22px;
}

a {
color: #12b1d6;
font-weight: bold;
text-decoration: underlined;
}

a:active, a:hover {
color: #b6462b;
}

.reverse-anchor {
color: #b6462b;
}

.reverse-anchor:active, .reverse-anchor:hover {
color: #12b1d6;
}

ul, ol {
margin: 0 0 22px 50px;
}

img.alignright {
float: right;
margin: 0 0 10px 10px;
}

img.alignleft {
float: left;
margin: 0 10px 10px 0;
}



/**Recent Projects Bar **/


#project-bar {
clear: both;
width: 990px;
height: 174px;
background: #d7d8d5;
border-top: solid 1px black;
border-bottom: solid 1px black;
text-align: center;
}

#project-bar-headline {
display: inline-block;
text-align: right;
font-size: 27px;
text-transform: uppercase;
} 


#project-bar ul {
display: inline;
margin: 0;
}

#recent-projects li {
list-style-type: none;
display: inline;
margin: 0;
}

#recent-projects li img {
height: 162px;
}

#recent-projects li a {
display: inline-block;
margin: 5px 2px;
border: solid 1px #777777;
}

#recent-projects li a:hover {
border: solid 1px #000000;
}

#see-more {
display: inline-block;
text-align: left;
font-weight: bold;
font-size: 22px;
color: #12b1d6;
border: none;
}

#see-more a {
color: #12b1d6;
border: none;
}

#see-more a:hover, #see-more a:active {
color: #b6462b;
border: none;
}

/** Lower Front Content **/

#front-content {
margin-top: 30px;
width: 990px;
}

#front-main {
width: 434px;
padding: 0 30px 0 30px;
float: left;
border-right: solid 1px #777777;
}

#front-welcome-headline {
font-size: 30px;
font-weight: normal;
}

#front-the-content {
margin: 0 0 20px 0;
}


/** Front Social Buttons **/

#social-header {
font-size: 30px;
font-weight: normal;
display: inline;
line-height: 32px;
}

#social-list {
display: inline;
list-style: none;
line-height: 32px;
}

#social-list li {
display: inline-block;
list-style: none;
margin: 0 0 0 20px;
}

#social-list li a {
display: inline-block;
width: 32px;
height: 32px;
text-indent: -9999px;
}

#linkedin {
background: url(/images/linkedin.png) center no-repeat;
}

#twitter {
background: url(/images/twitter.png) center no-repeat;
}

#facebook {
background: url(/images/facebook.png) center no-repeat;
}

/** Front News **/

#front-recent {
width: 435px;
padding: 0 30px;
float: left;
}

#frontnews-header {
font-size: 30px;
font-weight: normal;
}

.twitter-message {
margin-bottom: 20px;
}

#front-recent a {
color: #b6462b;
}

#front-recent a:active, #front-recent a:hover {
color: #12b1d6;
}

/** Portfolio **/

#portfolio-content {
width: 770px;
margin-right: 30px;
float: left;
}

.portfolio-row {
width: 790px;
height: 185px;
margin-bottom: 20px;
}

.portfolio-box {
width: 248px;
height: 183px;
float: left;
border: solid 1px #000000;
background: #d7d8d5;
overflow: hidden;
font-size: 14px;
}

.box-left {
margin-right: 20px;
}

.box-center {
margin-right: 20px;
}

#portfolio-sidebar {
width: 150px;
height: 575px;
}

img.vertical {
float: left;
margin-right: 5px;
border-right: solid 1px black;
height: 183px;
}

img.horizontal {
width: 248px;
border-bottom: solid 1px black;
}

img.full {
height: 183px;
width: 248px;
}

.portfolio-text {
padding: 5px;
}

.portfolio-text a {
color: #b6462b;
font-weight: bold;
text-decoration: underlined;
}

.portfolio-text a:hover, .portfolio-text a:active {
color: #12b1d6;
}

#box-contact {
text-align: center;
}

#box-contact a {
color: #b6462b;
display: block;
font-weight: bold;
text-decoration: underlined;
font-size: 24px;
align: center;
margin: 48px 5px 5px 5px;
}

#box-contact a:hover, #box-contact a:active {
color: #12b1d6;
}

/***All Sidebars***/

.sidebar {
padding: 10px;
background: #777777;
float: right;
color: #d7d8d5;
font-size: 14px;
}

.sidebar h3 {
font-size: 18px;
line-height: 22px;
margin-bottom: 22px;
}

#sidebar-social-list {
display: block;
list-style: none;
line-height: 32px;
text-align: center;
width: 100%;
margin: 0;
}

#sidebar-social-list li {
display: inline-block;
list-style: none;
margin: 0 5px 0 5px;
}

#sidebar-social-list li a {
display: inline-block;
width: 32px;
height: 32px;
text-indent: -9999px;
}


/** Page-Page Layout **/

#page-content {
float: left;
width: 604px;
margin: 0 44px 0 30px;
padding: 10px 10px 10px 10px;
background: #d7d8d5;
border: solid 1px black;
text-align: justify;
}

#page-sidebar {
float: left;
width: 270px;
}

img#about-pic {
width: 100%;
border: solid 1px black;
margin-bottom: 22px;
}

/** Footer **/

.footer {
color: #777777;
font-size: 16px;
width: 100%;
text-align: center;
margin: 100px 0 10px 0;
}

.footer p {
margin: 0;
}

.footer a {
color: #777777;
font-weight: bold;
text-decoration: none;
}

.footer a:hover, .footer a:active {
color: #b6462b;
}

/** Internet Explorer SUCKS **/

.ie5 #project-bar-headline, .ie6 #project-bar-headline, .ie7 #project-bar-headline {
display: inline-block;
text-align: right;
font-size: 27px;
text-transform: uppercase;
padding-bottom: 5px;
} 

.ie5 #social-list, .ie6 #social-list, .ie6 #social-list {
display: block;
list-style: none;
line-height: 32px;
}

.ie5 #sidebar-social-list, .ie6 #sidebar-social-list, .ie7 #sidebar-social-list {
text-align: left;
}

.ie5 #social-list li, .ie6 #social-list li,.ie7 #social-list li, .ie5 #sidebar-social-list li, .ie6 #sidebar-social-list li, .ie7 #sidebar-social-list li  {
display: block;
list-style: none;
}

.ie5 #social-list li a, .ie6 #social-list li a, .ie7 #social-list li a, .ie5 #sidebar-social-list li a, .ie6 #sidebar-social-list li a, .ie7 #sidebar-social-list li a {
display: block;
width: 32px;
height: 32px;
text-indent: 50px;
margin-top: 20px;
}