/*
Theme Name: The Scarletz
Theme URI: http://thescarletz.com
Description: Wordpress theme for girl band The Scarletz.
Author: Nenad Petkovic
Author URI: http://creatifcode.com

*/

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


@font-face {
	font-family: 'Cooper Std Black';
	src: url('style/css/fonts/CooperBlackStd.eot');
	src: local('Cooper Std Black'), url('style/css/fonts/CooperBlackStd.otf') format('opentype');
}

/*-------------------- 0 --------------------*/
body {
	background: #cccccc url('style/images/messedup-bg.png') top left repeat; 
	url('style/images/messedup-bg2.png') top left repeat; 
	background-attachment: fixed;
	font-family: Georgia, "Times New Roman", Times, serif;
}

#bgTopDiv {
	background: url('style/images/messedup-bg2.png') top left no-repeat;
	background-repeat:repeat-x;
	background-attachment:fixed;
	background-position:top center; 
}

/*-------------------- 1 --------------------*/
/* Wrapper - element for wrapping all other elements on site */
/* Just basic properties */
#wrapper {
	width: 1004px;
	background: transparent url('style/images/wrapper_background.png') 50% top repeat-y;
	margin: 0 auto;
	padding: 0 9px;
	font-family: Georgia, "Times New Roman", Times, serif;
}

/*-------------------- 2 --------------------*/
/* Declaring a width is enough, since this only is container for all other elements*/
#container {
	height: 100%;
	width: 1004px;
	background: #fff url('style/images/container_top.png') left top no-repeat;
}
/*-------------------- 3 --------------------*/
/* Sidebar all elments inside sidebar are defined here */
/* Sidebar is diveded in more subsections. First element serves here as container for all containing elements */
/* Sidebar is not a site element of container. For simplier use in future */

#sidebar {
	float: left;
	margin-left: 14px;
	width: 266px;
}
#sidebar h1 {
	text-indent: -9999px;
}
#sidebar #logo {
	margin-top: 18px;
}
#sidebar #thumbs, #sidebar #tweets, #sidebar #agenda, #sidebar #musicplayer, #sidebar #scarletzlove {
	margin-left: 15px;
}
#sidebar #musicplayer #player-holder {
	margin-left: 5px;
}

#sidebar #thumbs h4, #sidebar #tweets h4, #sidebar #agenda h4, #sidebar #scarletzlove h4, #sidebar #musicplayer h4 {
	margin-left: 5px;
	font: 18px/21px "Cooper Std Black";
	color: #a8ac84;
}

#sidebar #thumbs {
	margin-top: 34px;
}

#sidebar #thumbs img {
	margin: 25px 12px 0 6px;
}

#sidebar #tweets {
	margin-top: 52px;
}
#sidebar #tweets h4 {
	background: transparent url('style/images/twitter_bird.png') right top no-repeat;
	margin-bottom: 13px;
}

#sidebar #tweets p {
	color: #858585;
	font-size: 12px;
	font-weight: normal;
	font-style: normal;
	line-height: 21px;
}

#sidebar #tweets a, #sidebar #tweets em {
	color: #cd0d16;
	font-weight: bold;
}
#sidebar #tweets a {
	text-decoration: underline;
}

#sidebar #tweets ul {
	display: block;
	width: 229px;
	height: 220px;
	margin-top: 12px;
	background: transparent url('style/images/twitter_background.png') left top no-repeat;
	padding: 16px 6px 0 16px;
}
#sidebar #tweets ul li {
	font-size: 11px;
	line-height: 15px;
	margin-bottom: 15px;
}

#sidebar #tweets .tweet-status {
	color: #959595;
}
#sidebar #tweets .tweet-details {
	color: #868b5e;
	font-weight: bold;
}

#sidebar #agenda {
	margin-top: 50px;
}
#sidebar #musicplayer #player-holder {
	margin-top: 25px;
}

#sidebar #agenda a {
	font-size: 12px;
	font-weight: normal;
} 
#sidebar #agenda h5 {
	margin-top: 18px;
	font-size: 14px;
	line-height: 21px;
	color: #cd0d16;
	font-weight: bold;
}
#sidebar #agenda em {
	color: #919191;
	line-height: 21px;
	margin-left: 15px;
}
#sidebar #agenda p, #sidebar #agenda p a {
	color: #919191;
	line-height: 21px;
}
#sidebar #agenda .location, #sidebar #agenda em, #sidebar #agenda p .location, #sidebar #agenda p em {
	font-size: 12px;
}


/*-------------------- 4 --------------------*/
/* Header contains navigation and nothing more */
/* #header element alone does not have any function */
/* all properties for navigation are inside #nav element and his subelements */
#header{
	width: 722px;
	float: left;
	margin-left: 2px;
}

#header #nav {
	margin-top: 48px;
	font-family: "Cooper Std Black", serif;
	font-size: 21px;
}

#header #nav ul li:first-child {
	margin-left: 0;
}

#header #nav ul li {
	display: block;
	margin-left: 35px;
	float: left;
}

#header #nav ul li a {
	color: #868b5e;
	line-height: 21px;
}
#header #nav ul li span {
	display: block;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 14px;
	color: #919191;
	font-weight: normal;
	margin-top: 10px;
}
#header #nav ul li a:hover,#header #nav ul li a:hover span {
	color: #cd0d16;
}

/*-------------------- 5 --------------------*/
/* This is element where all post and pages are displayed and as such it has most importance */
/* This element contains more subsubelements */
#main{
	width: 687px;
	float: left;
	margin-top: 17px;
	margin-left: 18px;
}

#content_top {
	background: transparent 
url('http://www.thescarletz.com/wp-content/themes/scarletz/style/images/content_top/content_top.php') 50% top no-repeat;
	height: 275px;
}

#content {
	background: transparent url('style/images/content_background.png') 50% top repeat-y;
	min-height: 651px;
	padding: 13px 36px 0 0;
}

#content_bottom {
	height: 14px;
	background: transparent url('style/images/content_bottom.png') 50% top no-repeat;
}

#content .img {
	position: absolute;
	margin-top: -27px;
	margin-left: 0px;
}

#content .more {
	color: #c52827;
	font-size: 14px;
	float: right;
	margin: 30px 5px 10px 0;
}
#content .more a span {
	text-decoration: underline;
}

/* If anything is not right with post or archive content displaying change here */
.post, .archive {
	font-size: 14px;
	color: #949494;
	line-height: 21px;
	margin-left: 84px;
}

.post h2 {
	margin-bottom: 40px;
	font-size: 21px;
	color: #474747;
	font-weight: bold;
	line-height: 42px;
}

.post h2 a, .archive h3 a {
	text-decoration: none;
	color: #474747;
}
.post h2 a:hover, .archive h3 a:hover {
	text-decoration: underline;
	color: #c52827;
}

.post h2 span, .archive h3 span {
	display: block;
	font-size: 13px;
	line-height: 21px;
	font-weight: normal;
	color: #949494;
}

.post h2 span .cat, .archive h3 span .cat {
	color: #bf453b;
	font-weight: bold;
	display: inline;

}

.post h2 span .cat a, .archive h3 span .cat a {
	text-decoration: none;
	color: #bf453b;
}

.post p {
	margin-top: 24px;
}

.post a {
	margin-top: 20px;
	text-decoration: underline;
}

.post .details {
	font-size: 10px;
	line-height: normal;
}

.archive .a-excerpt {
	margin-bottom: 20px;
}

.archive h2 {
	margin:-50px 0 50px 0;
	font-size: 21px;
	color: #474747;
}

.archive h3 {
	margin-bottom: 10px;
	font-size: 18px;
}

/* Here are defined styles for last two post on post preview pages */
.excerpt {
	background: transparent url('style/images/excerpt_bottom.png') bottom left repeat-x;
	margin: 25px 14px 0 32px;
	padding: 0 15px 20px;
	width: 263px;
	border: 1px #e0e0e0 solid;
	border-bottom: none;
	border-top: none;
	float: left;
}

.excerpt h3 {
	font-size: 14px;
	color: #474747;
	background: transparent url('style/images/excerpt_button.png') left 50% no-repeat;
	padding-left: 20px;
}

.excerpt h3 a {
	color: #474747;
	text-decoration: none;
}

.excerpt p {
	font-family: Georgia, "Times New Roman", Times, serif;
	margin-top: 15px;
	font-size: 11px;
	color: #959595;
	line-height: 21px;
}

.excerpt a {
	display:block;
	font-size: 12px;
	text-decoration: underline;
	margin-top: 20px;
}

.last {
	margin-right: 0;
	margin-left: 15px;
}
/* short post excerpts ending here */

/*-------------------- 6 --------------------*/
/* These are styles for footer area */
#footer {
	width: 990px;
	color: #8a8a8a;
	font-size: 13px;
	line-height: 21px;
	height: 119px;
	padding-bottom: 10px;
}

#footer p {
	padding-left: 34px;
	margin-top: 53px;
	float: left;
}

#footer #links {
	margin-top: 33px;
	float: right;
	margin-right: -40px;
}

#footer #links img, #footer #links a:hover img.nolink {
	margin-right: 11px;
	vertical-align: middle;
	padding-bottom: 5px;
	border-bottom: 1px solid transparent;
}
#footer #links a:hover img {
	border-bottom: 1px solid #cd030d;
	text-decoration: underline;
	color: #cd030d;
}
#footer p a {
	color: #cd030d;
	font-size: 15px;
	text-decoration: underline;
	font-weight: bold;
}

/*-------------------- 7 --------------------*/
/* This is list of styles applied
to comments and comment form */
#respond, #comments, ol.commentlist {
	margin: 0 0 5px 84px;
	color: #949494;
	font-size: 12px;
	line-height: 100%;
	font-weight: normal;
}
#respond p {
	margin-bottom: 10px;
}
#respond small {
	font-size: 9px;
	color: #cd030d;
}
#respond #comment {
	margin-bottom: 10px;
}
ol.commentlist li { margin-bottom: 15px;}
.comment-meta {
	font-size: 10px;
	color: #949494;
	margin-left: 40px;
}

ol.commentlist li p {
	margin-top: 5px;
	line-height: 18px;
}
/*-------------------- 8 --------------------*/
/* Sitewide classes */
.clear {
	clear: both;
}