/* ~-~-~~-~-~ CSS Document -~-~-~-~-~ *\
|                                      |
|              Created for             |
|             CSSVideos.com            |
|           by Ashton Sanders          |
|         WebsitesinaFlash.com         |
|                                      |
\* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */


/* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~ GENERAL FORMATTING -~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */



/* ~-~-~~-~-~~-~-~~-~-~ RESET ~-~-~~-~-~-~-~-~-~-~*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol,  ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}



/* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~ LAYOUT FORMATTING -~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */

/* ~-~-~~-~-~~-~-~~-~-~ CONTAINING ELEMENTS ~-~-~~-~-~-~-~-~-~-~ */

html{ 
background: #33807B/*	 url('../images/layout/blue-stripes.jpg')  -150% 0;*/
}
body {
	line-height: 1;
	background: url('../images/layout/black-stripes.jpg') repeat-x  -150% 0;
	text-align:center;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
}

#container {
	margin: 0 auto;
	width: 86%;
	min-width:800px;
	position:relative;
}



/* ~-~-~~-~-~~-~-~~-~-~ MAIN NAVIGATION ~-~-~~-~-~-~-~-~-~-~ */


#mainnav {
	height:175px;
}

#mainnav li {
	float:right;
	width: 90px;
	margin-left:5%;
	height:175px;
}

#mainnav li a {
	display:block;
	background: #33807B;
	color:#FFF;
	text-decoration:none;
	text-transform:uppercase;
	letter-spacing:-2px;
	height:27px;
	margin-top:68px;
	padding-top:11px;
}

#mainnav li a:hover, #mainnav li.current_page_item a {
	height:73px;
	margin-top:0;
	padding-top:79px;
}

#headerrss {
	position:absolute;
	top:-15px;
	left:185px;
}

 
/* ~-~-~~-~-~ LOGO ~-~-~-~-~ */

#csslogobox {
	position:absolute;
	top:0;
	left:0;
	width:195px;
	height: 180px;
	border: solid #FFF;
	border-width: 0 5px;
	background:#A7A926;
}

#csslogobox img {
	padding-top:33px;
	border:none;
}


#cssauthor {
	position:absolute;
	top: 156px;
	left: 210px;
	font-size:14px;
	color:#FFF;
	text-transform:uppercase;
}
#cssauthor a {
	color:#FFF;
	text-decoration:none;
}
#tagline {
	position:absolute;
	top: 157px;
	right: 0;
	font-size:10px;
	color:#45ADA6;
	text-transform:uppercase;
}

/* ~-~-~~-~-~~-~-~~-~-~ ALL CONTENT ~-~-~~-~-~-~-~-~-~-~ */

#allcontent {
	text-align:left;
	overflow:hidden;
	border: 5px solid #FFF;
	background:#A7A926;
/*	background: url('../images/layout/yellow-bg.gif') repeat-y 0 0 #FFF; */
}

/* ~-~-~~-~-~ CONTENT ~-~-~-~-~ */

#content {
	float:right;
	width:65%;
	padding: 5px;
	background:#FFFFFF;
	margin:0;
}


/* ~-~-~~-~-~ INDEX OF POSTS ~-~-~-~-~ */

.postindexitem {
	position:relative;
	height: 130px;
	width: 85%;
	margin-left: -40px;
	margin-bottom: 30px;
	margin-top:40px;
	padding-top:15px;
	padding-right:120px
}

.leftbox, .rightbox {
	border: 5px solid #33807B;
	background: #231F20;
}

.postindexitem .rightbox {
	position:absolute;
	top:0;
	left: 47%;
	right:0;
	bottom:0;
	background-repeat:no-repeat;
	height: 145px;
}
.postindexitem .leftbox {
	position:absolute;
	top:0;
	left: 0;
	bottom:0;
	width:40%;
	padding: 10px 0 10px 10px;
	height: 125px;
}
.postindexitem .bgcolor {
	background:#A7A926;
	height: 125px;
}


.postindexitem h2, .postindexitem h2 a {
	font-size: 30px;
	color:#A7A926;
	text-align:left;
	text-decoration:none;
	padding:0;
}

.postindexitem h3, .postindexitem h3 a {
	font-size: 20px;
	color:  #33807B;
	margin-bottom: 5px;
	text-decoration:none;
}

.postindexitem .postindexstats {
	position: absolute;
	bottom: 0px;
	left:0px;
	right: 0px;
	padding:  10px;
	background: #333;
}

.rightbox a {
	text-decoration:none;
	color: #A7A926;
}
 
.postindexitem .rightbox span {
	color: #A7A926;
	font-weight:900;
	float:right;
	margin: 15px;
	width:80px;
	text-align:center;
}
.postindexitem .rightbox span big {
	background: #A7A926;
	color: #FFF;
	display:block;
	font-weight:100;
	padding:8px 0;
	margin:0 auto;
	width:35px;
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
}

.postindexitem .post-ratings { float:right; font-size:10px; color:#999999; width:inherit; text-align:center; width:120px;}
.postindexitem .post-ratings span  { display:none;}
.postindexitem .post-ratings-loading { position: absolute; bottom: 8px; right: 40px; }
.post-ratings img  {padding-left:5px !important;}

/* ~-~-~~-~-~ SINGLE POST ~-~-~-~-~ */

#postfooter { font-size: 12px; margin: 20px 10px}
.tweetmeme { float:right; margin-top:-35px;}

/* ~-~-~~-~-~ COMMENTS ~-~-~-~-~ */

#content .commentlist { padding:0;margin: 0 20px 20px 40px; clear: both; padding-top: 1em; line-height:20px; }
#content .commentlist ul { padding:0;margin: 0 0 20px 20px;  }
#content .commentlist li {list-style:none;}
#content .commentlist li.comment { background: #e7e7da; padding: 20px; margin: 20px 0; border: 1px solid #999;  }
.commentlist .comment p { color: #55554e; margin-top:5px; }
#content .commentlist li.comment-author-admin {background: #9AC2BF !important;}
.commentlist .commentmetadata, .commentlist .commentmetadata a { color: #55554e; font-size:12px; }
/*.commentlist .comment p.rss { float: right; font-size: .95em; text-transform: none; }
.commentlist .comment p.rss a { color: #ec7e2d; padding-left: 22px; background: url("img/rss_small.gif") no-repeat; display: block; height: 16px; line-height: 16px; } */
.commentlist .comment p strong { color: #33334e; }
.commentlist .avatar { float:right}

.commentlist ul.children, .commentlist ul.children li { margin-bottom: 0; }



/* ~-~-~~-~-~ LEFT NAVIGATION ~-~-~-~-~ */

#subnav {
	float:left;
	background:#A7A926;
	width:30%;
	margin: 0;
}

#subnav h3 {
	padding: 10px 20px;
	clear:left;
}

#subnav ul {
	color:#FFFFFF;
	font-weight:900;
/*	float:left;
	width: 130px; */
	font-size:14px;
}

#subnav ul ul {
	float:none;
}

#subnav li.cat-item {
	background: 0 13px no-repeat  url('../images/layout/blue-arrow.gif');
}

#subnav li {
	padding: 10px 0 10px 20px;
	margin-left:20px;
}
#subnav li a {
	color: #FFF;
}

#subnav li.nobullet {background:none; padding-left:0}

#subnav li li {
	margin:0;
	background:none;
	padding:0;
}

#subnav li li a {
	display:block;
	padding: 13px 0 2px 20px;
	background: 0 13px no-repeat  url('../images/layout/checkbox-white.gif');
}

#subnav li li a:visited {
	background: 0 9px no-repeat  url('../images/layout/checkbox-white-checked.gif');
}

.clear, .cclear { 
	clear:both; 
	font-size:0; 
	height:0;
}

.cclear {
	width:800px;
}

#submitrss {
	background: none;
	color:#FFFFFF;
	font-weight: 900;
	border: 2px solid #FFF;
	cursor:pointer;
}


ul#bookmark_home { margin-left: 20px;}
ul#bookmark_home li {
	float:left; width: 48px;
	margin: 0 10px 10px 0; padding:0; list-style:none;
}

/* ~-~-~~-~-~~-~-~~-~-~ FOOTER ~-~-~~-~-~-~-~-~-~-~ */

#exit { 
	position:absolute;
	left:0;
	bottom:0;
	height: 181px;
	width: 195px;
	border: solid #FFF;	border-width: 0 5px;
	background:#A7A926;
	margin-bottom: -175px;
}

#footer {
	background: url('../images/layout/black-stripes-btm.jpg') repeat-x -150% 0 #231F20;
	height:175px;
	color:#FFFFFF;
	text-align:right;
}
#footer p {padding-top:50px; }


/* ~-~-~~-~-~-~-~-~-~-~-~-~-~-~-~ STYLES -~-~-~-~-~-~-~-~-~-~-~-~-~-~-~ */

a, a:link {color:#33807A;}
a:visited {color:#1A403D;}
a:hover {color:#61C0B9;}


.navigation { height: 14px; overflow:hidden}
.navigation a { font-size:12px;}
.alignright { float:right;}
.alignleft  { text-align:left;}

#mainnav, h1, h3 {
	font-family: "Arial Black", Arial, Helvetica, sans-serif;
/*	font-weight:900;*/
}


#content h1 {
	padding: 10px 10px 5px;
}

#content h2 {
	padding: 0 10px 10px;
}

.post, #respond { margin: 0 10px;}
.post #CSS_Video {margin: 20px 0;}


h1, h1 a {
	font-size: 30px;
	color:#33807A;
	text-align: left;
	text-decoration:none;
}


h2, h2 a {
	font-size: 25px;
	color:#A7A926;
	font-weight:900;
	text-align: left;
	text-decoration:none;
}

h3, h3 a {
	font-size: 20px;
	color:  #33807B;
}

p {padding: 0 20px 15px; }

textarea {width: 80%;}


b, strong {font-weight:bold;}

blockquote { 
	margin: 7px 40px 15px; 
	padding:10px ;
	border: solid #33807A;
	border-width: 1px 1px 1px 5px;
	font-family:"Courier New", Courier, monospace;
}
blockquote p { 
	padding: 5px;
}


#content ul, #content ol {  margin: 15px 10px 10px 60px;}
#content ol { list-style-type:decimal}
#content ul li{	background: 0 8px no-repeat  url('../images/layout/checkbox-blue.gif'); padding: 5px 0 5px 20px }
div.sociable { padding-left: 25px !important;}
#content .sociable_tagline { margin: 10px 2px; }
#content .sociable ul li { background: none; margin: 10px 0; padding:0 4% 0 0 }

.ratingbar { background:#333; text-align:center; padding:3px;  margin-bottom:20px; border: 5px solid #33807B;color:#CCC; font-size:10px;}
.ratingbar span {color:#CCC; font-size:14px }