/*
Theme Name: Shawn Cope
Theme URI: http://shawncope.com
Description: Version 3 theme for my site
Version: 3.3
Author: Shawn Cope
Author URI: http://shawncope.com
Tags: Shawn Cope, ShawnCope

This theme was designed and built by Shawn Cope,
whose blog you will find at http://shawncope.com/

*/

@import "style/reset.css";

/*Utility Styles**********************************/
.alignRight {
	float:right;
}
.alignLeft {
	float:left;
}
.alignCenter {
	display:block;
	margin:0 auto;
}

.clear{
	clear: both;
}


/*General Styles**********************************/
@font-face {font-family:"GeosansLight";
    src: url("fonts/GeosansLight.ttf");
}
@font-face {font-family:"GeosansLight Oblique";
    src: url("fonts/GeosansLight-Oblique.ttf");
}
@font-face {font-family:"Liberation Sans";
    src: url("fonts/LiberationSans-Regular.ttf");
}
@font-face {font-family:"Liberation Sans Bold";
    src: url("fonts/LiberationSans-Bold.ttf");
}
@font-face {font-family:"Liberation Sans Italic";
    src: url("fonts/LiberationSans-Italic.ttf");
}
@font-face {font-family:"Liberation Bolditalic";
    src: url("fonts/LiberationSans-Bolditalic.ttf");
}

body {
	background: #ece7d8 url(images/headerNavBG.jpg) no-repeat  top center;
	background-color: #ECE7D8;
	font-family: "Liberation Sans", "Avant Garde", Verdana, Arial, "MS Trebuchet", sans-serif;
	font-size: 65%;
}

#wrapper {
	width:960px;
	margin:0 auto;
}

#content{
	width:580px;
	padding:20px 10px 0 10px;
	float:left;
}

#sidebar{
	width:340px;
	padding:20px 10px 0 10px;
	float:right;
}

#innerBody{
	
	background: url(images/starburstBG.png) no-repeat center top;
	width:100%;
	height:1080px;
	position:absolute;
	top:280px;
	z-index:-1000;
	
}

#footer{
	height:220px;
	clear:both;
}

#innerFooter{
	width:980px;
	height:200px;
	margin:0 auto;
	padding:20px 10px 10px 10px;
}



/*Header Styles**********************************/
#header {
	height:220px;
}

#header a.homeLink{
	display:block;
	width:435px;
	height:100px;
	position:relative;
	top:102px;
	left:24px;
	text-decoration:none;
}

/*Navigation Styles**********************************/
#navigation{
	position:relative;
	height:40px;
	padding:10px 0;
}

#navigation ul{
	font-family:"GeosansLight", "Avant Garde", Verdana, Arial, "MS Trebuchet", sans-serif;
	width:960px;
	height:40px;
	border-left:solid 2px #CFBDA7;
}

#navigation li{
	width:182px;
	height:40px;
	display:block;
	overflow:hidden;
	float:left;
	border-right:solid 2px #CFBDA7;
	color:#CFBDA7;
	font-size: 24px;
	line-height:40px;
	margin-right: 5px;
}

#navigation li a{
	width:182px;
	height:40px;
	padding:0 0 0 30px;
	color:#CFBDA7;
	text-decoration:none;
}

#navigation li a:hover{
	color:#DEBD63;
}

#kwick_1 { 
	background: url(images/navIconAbout.png) no-repeat 190px 0;
	
}

#kwick_2 {
	background: url(images/navIconBlog.png) no-repeat 190px 0;	
}

#kwick_3 {
	background: url(images/navIconPhotos.png) no-repeat 190px 0;
}

#kwick_4 { 
	background: url(images/navIconVideo.png) no-repeat 190px 0;
}

#kwick_5 { 
	background: url(images/navIconContact.png) no-repeat 190px 0;
}

#navigation #kwick_5  a{ 
	padding: 0 0 0 0;

}



/*Content Styles**********************************/
#content{
	color:#30180A;
	
}

#content div.post{
	margin:0 0 40px 0;
}

#content h1{
	clear:left;
	font-size:36px;
	font-weight:normal;
	padding:0 0 15px 0;

}

#content h2{
	clear:left;
	font-size:30px;
	font-weight:normal;
	padding:0 0 15px 0;
	line-height:36px;

}

#content h2 a{
	color:#30180A;
	text-decoration:none;
}

#content h2 a:hover{
	color:#26476F;
}

#content h3{
	clear:left;
	font-size:28px;
	font-weight:normal;
	padding:0 0 15px 0;

}

#content h4, h5, h6{
	clear:left;
	font-size:20px;
	font-weight:normal;
	padding:0 0 10px 0;

}

#content p{
	font-size:16px;
	line-height:20px;
	padding:0 0 10px 0;
}

#content a{
	color:#008DAE;
	text-decoration:none;
}

#content a:hover{
	color:#26476F;
}

#content ul{
	font-size:16px;
	line-height:20px;
	padding:0 0 10px 10px;
	margin:0 0 0 20px;
	list-style-type: disc;
}

#content ul li{
	padding:0 0 5px 0;
}

#content ol li{
	padding:0 0 5px 0;
}

#content ul.postmetadata{
	width:570px;
	float:left;
	padding:8px 0 8px 10px;
	margin:0 0 0 0;
	border-top:solid 1px #30180A;
	border-bottom:solid 1px #30180A;
	font-size:12px;
}

#content ul.postmetadata li{
	display:block;
	float:left;
	padding:0 20px 0 0;
}

#content ol{
	font-size:16px;
	line-height:18px;
	padding:0 0 10px 10px;
	margin:0 0 0 20px;
	list-style-type: decimal;
}

#content ul.children{
	font-size:100%;
	list-style:none;
}

#content pre{
	font-size:16px;
	padding:0 0 0 20px;
}
p#breadcrumbs{
		width:560px;
		background:#AA9985;
		border:solid 1px #443B2D;
		margin:0 0 20px 0;
		padding:5px 10px;
}
#content p#breadcrumbs a{
	color:#30180A;
}
/*Home Page Styles**********************************/
#content.homeContent{
	width:960px;
}

#homeIntroBlock{
	overflow:auto;
	margin: 10px 0 25px 0;
}

#homeInfo{
	width:660px;
	height:240px;
	padding:25px 15px 0 25px;
	background:url(images/helloBG.jpg) no-repeat;
	float:left;
	color:#fff;
}

#content.homeContent #homeInfo h2{
	display:block;
	width:360px;
	float:left;
	color:#fff;
}

#homeInfo p{
	width:390px;
	font-size:16px;
	line-height:20px;
	float:left;
}

#homeInfo img.selfPortrait{
	float:right;
	padding:2px 0 0 0;
}

#introCallToAction{
	width:260px;
	float:left;
}

#introCallToAction ul.callToAction{
	list-style-type: none;
	margin:0;
	padding:0;
}

#introCallToAction ul.callToAction li{
	width:240px;
	height:88px;
	padding:0;
}

#introCallToAction ul.callToAction li.ctaHireMe{
	background: url(images/ctaHireMe.png) no-repeat right top;

}

#introCallToAction ul.callToAction li.ctaSubscribe{
	background: url(images/ctaSubscribe.png) no-repeat top right;
}

#introCallToAction ul.callToAction li.ctaFollowMe{
	background: url(images/ctaFollowMe.png) no-repeat top right;
}

#homeMoreInformation{
	clear:left;
	font-size:12px;
	overflow:auto;
	margin:0 0 25px 0;
}

#homeMoreInformation div.fourColumn ul{
	margin:0;
	padding:0 0 0 15px;
	font-size:16px;
}

div.fourColumn{
	width:220px;
	float:left;
	margin:0 20px 0 0;
}

#homeMoreInformation h2{
	color: rgb(51,102,102);
	font-size: 24px;
	font-weight:normal;
	border-bottom:1px solid rgb(51,102,102);
	padding:0 0 5px 0;
	margin:0 0 10px 0;
}

#homeBlogTeaser{
	clear:left;
	overflow:auto;
	margin:0 0 25px 0;
	
}

#homeBlogTeaser h2{
	color: rgb(51,102,102);
	font-size: 24px;
	font-weight:normal;
	border-bottom:1px solid rgb(51,102,102);
	padding:0 0 5px 0;
	margin:0 0 10px 0;
}

#homeBlogTeaser h3 a{
	color: rgb(51,102,102);
	font-size: 20px;
	font-weight:normal;
	padding:0 0 5px 0;
}

div.twoColumn{
	width:460px;
	float:left;
	margin:0 20px 0 0;
}

/* tooltip styling. by default the element to be styled is .tooltip  */
.tooltip {
	display:none;
	background:transparent url(images/black_arrow.png);
	font-size:12px;
	line-height:14px;
	height:95px;
	width:170px;
	padding:20px 20px 0 20px;
	color:#fff;	
}

/* style the trigger elements */
li.showTitleToolTip {
	cursor:pointer;
}


/*Comments Styles**********************************/
#respond{
	margin:0 0 20px 0;
}

#respond p{
	font-size:12px;
}

#commentform input{
	width:280px;
	margin:0 10px 0 0;
}

#commentform textarea#comment{
	width:580px;
}

#commentform input#submit{
	width:160px;
}

#content ol.commentlist{
	font-size:100%;
}

#content ol.commentlist li{
	margin:0 0 10px 0;
}

#content ol.commentlist .comment-author{
	font-size:18px;
	line-height:24px;
}

#content ol.commentlist .comment-meta{
	font-size:14px;
	padding:10px 0;

}


/*Sidebar Styles**********************************/

#search {
	background:#AA9985;
	border:solid 1px #443B2D;
	height:30px;
	width:338px;
	margin:0 0 20px 0;
}

#search input#searchsubmit {
	margin:2px 0px 0px;
}

#search input#s {
	background:transparent none repeat scroll 0%;
	display:inline;
	padding:5px;
	width:300px;
}

#search input {
	border:0pt none;
	color:#443B2D;
	float:left;
	font-size:16px;
}

#recentTweet{
	margin:0 0 5px 0;
}

#recentTweet h4{
	width:270px;
	height:25px;
	padding:10px 0 0 20px;
	background: transparent url(images/tweetTopBG.png) no-repeat;
	font-size:16px;
}


#tweet{
	width:270px;
	padding:0px 10px 0 10px;
	background: transparent url(images/tweetCenterBG.png) repeat-y;
	font-size:16px;
	line-height:20px;
}

#tweet a{
	color:#26476F;
	text-decoration:none;
}

#tweet a:hover{
	color:#000;
}

#tweet a.tweetTime{
	width:150px;
	display:block;
	float:right;
	font-size:12px;
}

#twitterContact{
	width:340px;
	height:119px;
	margin:-7px 0 0 0;
	background: transparent url(images/tweetBottomBG.png) no-repeat;
	
}
#twitterContact p{
	padding:60px 0 0 20px;
	font-size:18px;
	font-weight:bold;
}
#twitterContact p a{
	color:#000;
	text-decoration:none;
}

#twitterContact p a:hover{
	color:#26476F;
}

/**Start Tab Styles*********************************/

#tabContainer{
	width:338px;
	margin:0 0 20px 0;
	background:#AA9985;
	border:solid 1px #443B2D;
}

ul.tabs { 
  
}  

ul.tabs li {
	list-style:none;  
	display:inline;  
}

ul.tabs li a{
	display:block;
	float:left;
	padding:0 0 0 10px;
	margin:0 0 5px 0;
	width:102px;
	border-bottom:solid 1px #443b2d;
	height:32px;
	background: #DDD url(images/tabBG.jpg) repeat-x;
	font-size:14px;
	line-height:32px;
	color:#000;
	text-decoration:none;
}

ul.tabs li a#tab1{
	border-right:solid 1px #443b2d;
}

ul.tabs li a#tab2{
	border-right:solid 1px #443b2d;
}

ul.tabs li a:hover{
	background:#AA9985;
	//border-bottom:none;
}

.tabContent{
	padding:10px;
	font-size:14px;
}

.tabContent ul li{
	background: url(images/tabbedListDivider.png) no-repeat bottom center;
	padding:8px 0 10px 0;
	text-align:center;
}

.tabContent ul li:last-child {
	background:none;
	//padding:8px 0 10px 0;
}

.tabContent ul li a{
	color:#000;
	text-decoration:none;
}

.tabContent ul li a:hover{
	color:#26476F;
}

.ui-tabs-hide {  
	display: none;  
}

ul.tabs li.ui-tabs-selected a{
	background:#AA9985;
	border-bottom:none;
}

#randomPhotoThumbs{
	//padding:0 0 0 10px;
}

#randomPhotoThumbs ul li{
	width:100px;
	height:100px;
	display:block;
	float:left;
	padding:0 20px 20px 0;
}

#randomPhotoThumbs ul li a, img{
	margin:0;
	padding:0;
}

/*Footer Styles**********************************/
#footer{
	background: url(images/footerTexture.png) no-repeat top center;
	color:rgb(204,204,204);
	font-size:18px;
	line-height:20px;
}

#footer a{
	color:#DEBD63;
	text-decoration:none;
}

#footer a:hover{
	color:#DEBD63;
	text-decoration:underline;
}
#footer h3{
	font-size:20px;
	padding:0 0 5px 0;
	margin:0 0 5px 0;
	color:rgb(204,204,204);
	border-bottom:solid 1px rgb(204,204,204);
	font-weight:normal;
	
}
#footer1{
	width:460px;
	float:left;
	margin:0 20px 0 0;
}
#footer1 p{
	margin:0 0 25px 0;
}

#footer2{
	width:220px;
	margin:0 20px 0 0;
	float:left;
}
#footer2 ul li{
	margin:0 0 5px 0;
}
#footer2 ul li a{
	color:rgb(204,204,204);
}
#footer2 ul li a:hover{
	color:#DEBD63;
}
#footer3{
	width:220px;
	float:left;

}

#footer3 ul{
	list-style:none;
	margin:0;
	padding:5px 0 0 0;
	clear:both;
}

#footer3 ul li{
	display:block;
	float:left;
	width:40px;
	height:40px;
	margin:0 10px 20px 0;
}
#footer3 ul li.endline{
	margin:0 0 20px 0;
}

/*contact form styling */

#contact_form {
	width:580px;
	margin:auto;
	height:300px;
}
#contact_form label{
	position:relative;
	padding-top:4px;
	display:block;
	width:200px;
} 
#contact_form input {
	width:350px;
	position:absolute;
	left:200px;
}
#contact_form textarea {
	width:350px;
	position:absolute;
	margin-bottom:10px;
	left:200px;
	
}
#contact_form #submit{
	margin-top:10px;
	width:125px;
	position:absolute;
	left:200px;
	top:75px;
}

ul#portfolioLinks{
	width:580px;
	height:20px;
	list-style:none;
	background:#AA9985;
	border:solid 1px #443B2D;
	margin:0 0 20px 0;
	padding:10px 0;
}

ul#portfolioLinks li{
	display:block;
	float:left;
	padding:0 10px 0 10px;
	border-right:solid 1px #000;
}

ul#portfolioLinks li.last{
	border-right:none;
}

ul#portfolioLinks li a{
	color:#000;
}

ul#portfolioLinks li a:hover{
	color:#26476F;
}
div.port_sample{
	clear:left;
	margin:0 0 40px 0;
	overflow:auto;
}
#content div.port_sample h3{
	display:block;
	width:340px;
	clear:none;
	float:right;
	font-size:20px;
}
div.port_sample p{
	width:340px;
	float:right;
	
}

div.port_sample img.port_image{
	float:left;
	clear:left;
}

#slideShow{
	visibility: visible;
}

#placesToFindMe{
	padding:20px 0;
}

#placesToFindMe ul{
	list-style:none;
	margin:0;
	padding:0;
	float:left;
	clear:both;
}

#placesToFindMe li{
	display:block;
	float:left;
	width:40px;
	height:40px;
	margin:0 10px 0 0;
}
