/*
Theme Name: Lyrical Media
Theme URI: http://lyricalmedia.com/
Description: Custom theme for and by Lyrical Media
Version: 2.1
Author: John O'Nolan
Author URI: http://john.onolan.org/
*/

/*--- Table of Contents ---

0 - CSS Reset
1 - Common
2 - Layout
3 - Header
4 - Footer
5 - Home
6 - About
7 - Portfolio
8 - Services
8a -- Services left
8b -- Services right
8c -- Services page2
9 - Blog
10 - Blog Sidebar
11 - Blog Sinlge
12 - Blog Comments
13 - Blog Threaded Comments
14 - Contact

--------------------------*/


/*--- 0 CSS Reset ---*/
html, body, form, fieldset {padding:0; margin:0}

    h1, h2, h3, h4, h5, h6, p, pre, blockquote, label, ul, ol, dl, fieldset, address {margin:1em 0}
    li, dd { margin-left:5%}
    fieldset { padding: .5em}
    select option{ padding:0 5px}

    .hide, .print-logo, .close-button{ display:none}
    .left{float:left}
    .right{float:right}
	a {outline:none}
    a img{ border:none}
	
	.clearfix:after {
	content: ".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
	}
	* html .clearfix {height: 1%;}
	.clearfix {display: block;}


/*--- 1 Common ---*/

html {background:#dfdfdf}

body {
	font-family: Helvetica, Helvetica Neue, Arial, sans-serif;
}

h1 {
	margin:20px 0;
	letter-spacing:-5px;
	color:#444;
	font-size:58px;
}

.description {margin:-20px 20px 40px 60px; color:#444; font-size:18px;}

h2, h3, h4, h5, h6 {letter-spacing:-1px;color:#444}

a {color:#ffa800}
a:hover {color:#078ce0 !important}

.o {color:#ffa800}
.b {color:#078ce0}

.mid {vertical-align:top;}

#ie6warning {display:none}


/*--- 2 Layout ---*/

#wrapper {}

#header {
	width:100%;
	height:110px;
	border-top:#000 5px solid;
	border-bottom:#1c1c1c 1px solid;
	background:#1f1f1f;
}

#flowers {
	width:346px;
	height:253px;
	background:url(img/flowers-black.png);
	position:absolute;
	top:0px;
	left:614px;
	z-index:90;
}

#content {
	border-top:#fff 1px solid;
	border-bottom:#fff 1px solid;
	background:#dfdfdf;
}
	#content .inner {border-left:#fff 1px solid;}

#contenthome {
	min-height:970px;
	border-top:#292929 1px solid;
	border-bottom:#292929 1px solid;
	background:#262626;
}

#footer {
	width:100%;
	height:150px;
	border-top:#1c1c1c 1px solid;
	background:#1f1f1f;
}

#verticalwords {
	width:14px;
	height:966px;
	background:url(img/verticalwords.png);
	position:absolute;
	top:36px;
	left:20px;
	z-index:500;
}

#verticalwordsmain {
	width:14px;
	height:966px;
	background:url(img/verticalwords-main.png);
	position:absolute;
	top:36px;
	left:20px;
	z-index:100;
}

.inner {
	width:900px;
	padding:0 0 0 60px;
	position:relative;
	z-index:80;
}
#content .inner {background:#dfdfdf;}

/*--- 3 Header ---*/

#nav {
	list-style:none;
	margin:30px 0 0 0;
	padding:0;
	color:#ffa800;
	font-size:25px;
	letter-spacing:-1px;
	position:relative;
	z-index:50;
}

#nav li {
	float:left;
	margin:0 0 0 3px;
}

#nav li a {
	color:#fff;
	text-decoration:none;
}

#nav li a:hover, #nav .current a {
	color:#078ce0;
}

#nav #first {margin-left:0}

#header p {
	width:600px;
	margin:5px 0 0 1px;
	float:left;
	color:#fff;
	font-size:12px;
}

#headlogo {
	position:absolute;
	top:35px;
	left:665px;
	z-index:120;
}


/*--- 4 Footer ---*/

.footbox {
	width:320px;
	float:left;
	margin:27px 30px 0 0px;
	color:#fff;
}
	.footbox img {float:left}
	.footbox img {border:#fff 3px solid}
	.footbox h4 {margin:0 0 0 100px}
	.footbox h4 a, #address h4 a {
		text-decoration:none;
		color:#fff;
		font-weight:normal;
		font-size:20px;
		letter-spacing:-1px;
	}
	.footbox p {
		margin:5px 0 0 100px;
		font-size:14px;
		line-height:16px
	}


#address {
	width:200px;
	float:right;
	margin:27px 0 0 0;
	text-align:right;
	color:#fff;
}
	#address h4 {margin:0}
	#address p {margin:5px 0;line-height:22px;}
	

/*--- 5 Home Page ---*/

#homelogo {
	width:888px;
	height:106px;
	float:left;
	margin:-10px 0 0 53px;
	background:url(img/logo-white.png);
	position:relative;
	z-index:100;
}

#twitter {
	width:170px;
	margin:0 0 0 0;
	color:#fff;
	float:left;
	position:relative;
	z-index:30;
}
	#twitter h3 {
		color:#fff;
		letter-spacing:-1px;
		font-weight:normal;
		margin:20px 0 5px 0;
	}
	#twitter_update_list, #twitter_update_list li {
		list-style:none;
		margin:0;
		padding:0;
		font-size:13px;
		line-height:16px;
	}

#button-home {
	float:right;
	margin:25px 0 0 0;
	position:relative;
	z-index:40;
}
	
#featuredimg {
	position:absolute;
	top:85px;
	left:16px;
	z-index:1;
}

#featuredtxt {
	width:500px;
	position:absolute;
	top:719px;
	left:60px;
	z-index:30;
}
	#featuredtxt h1 {margin:0;}
	#featuredtxt h1 a {
		color:#fff;
		text-decoration:none;
		font-size:60px;
		line-height:50px;
		letter-spacing:-2px;
	}
	#featuredtxt p {
		color:#fff;
		margin:0;
		line-height:19px;
		font-size: 15px;
	}

#blogfeed {
	width:410px;
	text-align:right;
	position:absolute;
	top:506px;
	right:-1px;
	z-index:30;
}
    #blogfeed ul {list-style:none}
	#blogfeed ul li {margin-bottom:15px}
    #blogfeed h2 a, #blogfeed ul li a {
		margin:0px 0;        
		padding:5px 10px;
        color:#000;
        font-weight:bold;
		text-decoration:none;
		background:#fff;
	}
	#blogfeed h2 a {letter-spacing:-1px}
    #blogfeed ul li a:hover, #blogfeed h2 a:hover {color:#fff!important;background:#078ce0}


/*--- 6 About ---*/

#aboutleft {
	width:280px;
	height:950px;
	float:left;
	padding:20px 25px 0 60px;
	margin:0px 0 0 0;
	font-size:17px;
	background:#d0d0d0;
	position:relative;
	z-index:1;
}

#aboutright {
	height:950px;
	float:left;
	position:relative;
	background:#dfdfdf;
	z-index:2;
}

#aboutgraphic {
	width:587px;
	height:820px;
	margin:0 0 0 10px;
	float:left;
	font-size:17px;
	background:url(img/about-me.png) top left no-repeat;
}
	#aboutgraphic p {width:380px;margin:560px 0 0 25px}

.name {
	float:left;
	margin:50px 20px 20px 20px;
	font-size:22px;
	color:#444;
	letter-spacing:-2px;
	font-weight:bold;
	text-align:right;
	position:relative;
	z-index:100;
}
	.name p {margin:0;}
	.name a {color:#444;text-decoration:none;}

.dept {
	font-size:16px;
	color:#444;
	font-weight:normal;
	letter-spacing:0;
}

#aboutpage2 {
	width:284px;
	padding:20px 0;
	position:absolute;
	top:117px;
	left:60px;
	z-index:0;
}

#aboutpage2 ul {list-style:none;padding:0;margin:0 0 20px 0;}
#aboutpage2 ul li {margin:0;padding:10px 0 10px 5px;border-bottom:#d0d0d0 1px solid}

/*--- 7 Portfolio ---*/

.leftside {width:205px;float:left;text-align:right;}
.rightside {width:680px;float:right}

.leftside h2 {
	margin:0;
	padding:2px 5px;
	color:#fff;
	font-size:16px;
	font-weight:normal;
	background:#ffa800
}
.leftside p {margin:5px;color:#444;font-size:17px;}

.rightside .portfolioitem {margin:0 0 50px 0;background:url(img/portfolio-bracket.png) 620px 4px no-repeat;}
.rightside img {border:#ffa800 5px solid}
.rightside img:hover {border:#078ce0 5px solid}
.rightside .portfoliometa {font-style:italic;}
.rightside .portfoliometa span {padding:2px 5px 0px 5px;color:#fff;background:#078ce0}
.rightside p {width:600px}


/*--- 8 Services --- */

.button {position:absolute;top:125px;left:790px;z-index:100}
.button2 {position:absolute;top:125px;left:790px;z-index:95;display:none;}

#page2 {
	width:880px;
	padding-right:20px;
	padding-top:20px;
	background:#dfdfdf;
	position:absolute;
	top:117px;
	left:60px;
	z-index:0;
}

#content .inner {padding:20px 20px 20px 60px}

/*8a left*/
.svcrow {height:335px;margin-bottom:40px;position:relative}
.svcrow h2 {margin:0 0 10px 96px}
.svcrow .outline {position:absolute;top:0;left:0;}
.svcbox {
	width:500px;
	padding:1px 15px;
	font-size:14px;
	background:#fff;
	position:absolute;
	left:96px
}
.svcstep {color:#bababa;position:absolute;left:650px;top:0}
.svcstepno {font-size:100px;font-weight:bold;letter-spacing:-10px}
.svcsteptxt {font-size:25px}
.svcperson {
	padding:1px 10px 6px 10px;
	color:#fff;
	font-size:30px;
	letter-spacing:-1px;
	background:#078ce0;
	position:absolute;
	bottom:37px;
	left:0;
}
.svcdesc {
	float:left;
	padding:5px 10px;
	color:#fff;
	background:#078ce0;
	position:absolute;
	bottom:0;
	left:0;
}
.svcarrow {position:absolute;bottom:0;right:150px;}

/*8b right*/
.svcrowrt {
	height:340px;
	margin-bottom:40px;
	text-align:right;
	position:relative
}
.svcrowrt h2 {margin:0 0 10px 272px;text-align:left}
.svcrowrt .outline {position:absolute;top:0;right:0;}
.svcboxrt {
	width:500px;
	padding:1px 15px;
	font-size:14px;
	text-align:left;
	background:#fff;
	position:absolute;
	right:96px
}
.svcsteprt {color:#bababa;position:absolute;right:650px;top:0}
.svcstepnort {font-size:100px;font-weight:bold;letter-spacing:-10px}
.svcsteptxtrt {font-size:25px}
.svcpersonrt {
	padding:1px 15px 6px 15px;
	color:#fff;font-size:30px;
	letter-spacing:-1px;
	background:#078ce0;
	position:absolute;
	bottom:37px;
	right:7px;
}
.svcdescrt {
	float:left;
	padding:5px 10px;
	color:#fff;
	background:#078ce0;
	position:absolute;
	bottom:0;
	right:7px;
}
.svcarrowrt {position:absolute;bottom:0;left:150px;}

/*8c svcs page2*/

.svcbox2wrap {width:225px;float:left;margin:0 0 0 40px}
.svcbox2wrap h3 {margin:0 0 -10px 0;font-size:38px;color:#078ce0}
	
.svcbox2 {padding:15px;background:#fff}
.svcbox2 ul {list-style:none;padding:0;margin:0;}
.svcbox2 ul li {margin:0;font-weight:bold;}

/*--- 9 Blog ---*/

#posts {width:620px;margin:50px 0 0 0}

.post {
	width:610px;
	margin:0 0 25px 0;
	padding:0 0 15px 0;
	float:left;
	border-bottom:#fff 1px solid
}
	.post h2 {margin:0 0 2px 0;font-size:30px;}
	.post h2 a {color:#444;text-decoration:none;}

.postmeta {
	margin:0 5px 0px 0;
	padding:2px;
	color:#444;
	font-size:12px;
	background:#fff;
}
.postimgwrap {
	width:610px;
	height:210px;
	margin:8px 0 0 0;
	position:relative
}
	.postimg {border:#ffa800 5px solid}
	.commentcount {
		width:54px;
		height:46px;
		color:#fff;
		text-align:center;
		background:#ffa800;
		position:absolute;
		top:5px;
		right:2px;
	}
		.commentcountno a {font-size:30px;letter-spacing:-2px;color:#fff;text-decoration:none}
		.commentcount p {margin:0;font-size:10px}
		
	.postcat {
		height:20px;
		padding:7px;
		color:#fff;
		font-size:22px;
		text-decoration:none;
		background:#ffa800;
		position:absolute;
		bottom:5px;
		left:2px;
	}
		.postcat a {color:#fff;text-decoration:none;}



/*--- 10 Blog Sidebar ---*/
#sidebar li {list-style:none;margin:0;}

#s {width:190px;background:#fff;border:#444 2px solid;color:#444;font-weight:bold}
#s:hover, #s:focus {border:#078ce0 2px solid}
#searchsubmit {width:70px;height:20px;background:#078ce0;border:none;color:#fff;font-weight:bold}

.widget {font-size:14px;padding:0 0 20px 0;border-bottom:#fff 1px solid}
.widget h3 a {color:#078ce0;text-decoration:none}
.widget ul {list-style:none;margin:0;padding:0}
.widget ul li {padding:5px;margin:2px 0!important;background:#fff;}
.widget h3 {color:#078ce0;font-size:28px;margin:20px 0 5px 0;}

.wp-polls-form p, .wp-polls p {text-align:left!important}
		
#sidebar {
	width:270px;
	position:absolute;
    top:150px;
    left:690px
}

.pullquotewrap {margin:0 0 0 0}
.pullquote {
	padding:3px;
	color:#fff;
	font-size:30px;
	line-height:36px;
	background:#078ce0;
}
#sidebar img {margin:25px 0 0 0;border:#ffa800 3px solid}


/*--- 11 Blog Single ---*/

h1.single {font-size:45px;}
h1.single img {width:40px;height:40px;}

.leftcolumn {width:290px;float:left}
.rightcolumn {width:290px;float:right}

.post img {border:#ffa800 5px solid}


/*--- 12 Blog Comments ---*/

.commentlist {list-style:none;padding:0;}
.commentlist li {margin:0;}

.commentwrap {width:626px;padding:12px;position:relative;}
.commentauthor {
	width:90px;
	font-size:12px;
	color:#444;
	position:absolute;
	left:0;
	top:12px;
}
.commentauthor a {font-size:14px;line-height:22px;text-decoration:none;}
.commentauthor img {border:#fff 1px solid;margin:0 0 2px 0}
.comment {
	width:467px;
	min-height:103px;
	padding:5px 20px;
	color:#444;
	background:#f0f0f0;
	border:#fff 1px solid;
	margin-left:90px;
}
	.authorcomment .comment {color:#fff;background:#444;border:#F4A934 1px solid}

#respond {margin: 25px 0;}
#respond form {position: relative;}
#comments_template .children #respond {margin-left: 25px}
#respond textarea {
	background:#fff;
	border:1px solid #ddd;
	font-size:14px;
	margin-bottom:5px;
	padding:20px 0;
	text-indent:20px;
	width:610px;
}

/*--- 13 Threaded Comments ---*/

.reply {margin:0 0 20px 0}
.comment-reply-link {
	padding:5px;
	font-size:12px;
	background:#ffa800;
	color:#fff;
	text-decoration:none
}
.comment-reply-link:hover {color:#fff!important;background:#078ce0}

.commentlist .children {
	border-left:#bfbfbf 1px solid;
	list-style:none;
}
.commentlist .children .comment {width:427px}
.commentlist .children .children .comment {width:387px}


/*--- 14 Contact ---*/

#contactform {width:590px;float:left;}
#contactsidebar {
	width:300px;
	font-size:24px;
	letter-spacing:-1px;
	color:#444;
	position:absolute;
	top:120px;
	left:670px;
}
#contactsidebar a {color:#444;text-decoration:none}
#contactsidebar span {color:#078ce0;font-size:28px;font-weight:bold}
.contactcol {width:290px;float:left;margin:0 15px 20px 0}
#lastcol {margin:0}

.contactright textarea {width:450px}
.contactright textarea, #wpcf_your_name, #wpcf_email, #wpcf_website {border:#444 2px solid}
.contactright textarea:hover, #wpcf_your_name:hover, #wpcf_email:hover, #wpcf_website:hover {border:#078ce0 2px solid}
.contactright textarea:focus, #wpcf_your_name:focus, #wpcf_email:focus, #wpcf_website:focus {border:#078ce0 2px solid}

/* Begin Contact Form CSS */
.contactform {
	position: static;
	overflow: hidden;
	width: 95%;
}

.contactleft {
	width: 25%;
	white-space: pre;
	text-align: right;
	clear: both;
	float: left;
	display: inline;
	padding: 4px;
	margin: 5px 0;
}

.contactright {
	width: 70%;
	text-align: left;
	float: right;
	display: inline;
	padding: 4px;
	margin: 5px 0;
}

.contacterror {
	border: 1px solid #ff0000;
}

.contactsubmit {
}
/* End Contact Form CSS */

.contactform {width:590px!important}
.contactleft {width: 105px!important;}
.contactright {width: 460px !important;}