/*  
Theme Name: Ultra Clean
Theme URI: http://violetbrain.com
Description: Clean Layout
Version: 1.0
Author: Joseph Rosenblatt
Author URI: http://violetbrain.com

*/

/* meyer reset v1.0 | 20080212 */

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,
b, u, i, center,
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-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* ---------------------END RESET-------------------------------------- */


/* Violet Brain Standard Typography */

body {
	font-size: 100%; 
	font-family: Georgia, Verdana, Arial, sans-serif;
	color: #333333;
}

html>body {
	font-size: 16px; /* 16px x 1.5em Linehight = 24px for total line - 16px for font =  8 px of spacing */
}

p {
	line-height: 1.5em; 
}

/* formatting for spacing to keep line flow */

p {
	font-size: 1em;  /* 1.0em x16=16px */
	margin-top: 1.0em; /*1.5em x 16 = 24px of line space. which matches our above line space */
	margin-bottom: 1em;
}

p.small {
	font-size: 0.875em; /* 14px = 14/16= .875em */
	line-height: 1.714em; /* 24/14 = 1.714 em */
	margin-top: 2.571em;
	margin-bottom: 0.857em;
	}

/* formatting for headings to keep line flow */

h1 {
	font-size: 2.25em; /* want 36px text for heading 1 which is 36/16 = 2.25em */
	line-height: 0.6667em; /* 24/36= .6667em */
	margin-top: 0.1em; 
	margin-bottom: 0.33335em; /* half the size of our line height for a-symlines */
	color: #597A89;
	}
	
h2 {
	font-size: 1.375em; /* want 22px text for heading 2 which is 22/16 = 1.375em */
	line-height: 1.0909em; /* 24px(our set height) divided by our wanted text size 22(1.375em) for h1 = 1.0909EM's */
	}
	
h3 {
	font-size: 1.25em; /* want 20px text for heading 3 which is 20/16 = 1.25em */
	line-height: 1.2em; /* 24px/20= 1.2em */
	margin-top: 1.8em;
	margin-bottom: 0.6em;
	}
	
h4 {
	font-size: 1.125em; /* want 18px text for heading 4 which is 18/16 = 1.125em */
	line-height: 1.3333em; /*24px/18(fontsize) = 1.3333em */
	margin-top: 1.9833em;
	margin-bottom: 0.65em;
	}
	
ul {
	margin-bottom: 1.5em;
	margin-left: 20px;
	}


	
/* LINK FORMATTING */

a {
	color: #41448c;
	text-decoration: none;
	border-bottom: 1px dotted #41448c;
	line-height: 1.2em;
	}
a:hover {
	background: #F2F2F2;
	}
a:visited {
	color: #701e65;
	text-decoration: none;
	border-bottom: 1px dotted #701e65;
	}
	
/* HTML */

html {
	background: #fff url(images/htmlbg.jpg) repeat top left;
	}

/* BODY */

body {
	width: 940px;
	position: relative;
	margin-left: auto;
	margin-right: auto;
	}
	
/* -------------------HEADER------------------------ */
#header a {
	border-bottom: none;
 }
/* LOGO */
#logo {
	margin-top: 10px;
	}
#logo h1 {
	width: 700px;
	height: 134px;
	float: left;
	}
#logo h1 a {
	width: 700px;
	height: 134px;
	background: url(images/vblogo.png) no-repeat top left;
	display: block;
	}
#logo h1 span {
	display: none;
	}	
#logo #slogo {
	width: 210px;
	height: 188px;
	background: url(images/slogo.png) no-repeat top left;
	float: left;
	margin-left: 10px;
	border-bottom: none;
	}
#logo #slogo span {
	display: none;
	}


/* NAV BAR */

#navigation { /* ##NAVIGATION BAR START## */
	position: relative;
	top: -30px;
	margin-left: 0px;
	}
#navigation li {
	position: relative;
	display: block;
	float: left;
	}
#navigation li a {
	height: 26px;
	display: block;
	background: url(images/navtabbg.jpg) repeat-x top left;
	border: 1px solid #C7B299;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	margin-right: 7px;
	color: #333;
	position: relative;
	top: 1px;

	}
#navigation li a:hover {
	background: #fff;
	}
#home #navigation li#homeLink a {
	border-bottom: 1px solid #fff;
	background: #fff;
	}
#contact #navigation li#contactLink a {
	border-bottom: 1px solid #fff;
	background: #fff;
	}
#web-design-development #navigation li#webdesignLink a {
	border-bottom: 1px solid #fff;
	background: #fff;
	}
#portfolio #navigation li#portfolioLink a {
	border-bottom: 1px solid #fff;
	background: #fff;
	}
#blog-customization #navigation li#blogcustomLink a {
	border-bottom: 1px solid #fff;
	background: #fff;
	}
#articles #navigation li#articlesLink a {
	border-bottom: 1px solid #fff;
	background: #fff;
	}
#search-engine-optimization #navigation li#seoLink a {
	border-bottom: 1px solid #fff;
	background: #fff;
	}

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


#content {
	width: 700px;
	float: left;
	background: #fff;
	padding-top: 25px;
	border: 1px solid #c7b299;
	margin-top: -30px;
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 20px;
	}
	
#contentworks {
	width: 930px;
	float: left;
	background: #fff;
	padding-top: 25px;
	border: 1px solid #c7b299;
	margin-top: -30px;
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 20px;
	}
#contentpage {
	background: #fff;
	padding-top: 25px;
	border: 1px solid #c7b299;
	margin-top: -30px;
	padding-left: 10px;
	padding-right: 10px;
}
	
#content ul {
	list-style-type: circle;
	}
#content li {
	padding-bottom: 3px;
	}
#content ol {
	list-style-type: decimal;
	}
#content ul.postinfo {
	list-style-type: none;
	margin-left: 0px;
	}
#content h2#intro {
	margin-top: 0px;
	font-size: 1.25em;
	line-height: 1.3em;
	color: #597A89;
	}

/* ------------------- NEWS PAGE INDEX -------------------*/

#news h1#newsheading {
	padding-bottom: 20px;
	font-style: italic;
	}
#news h2 {
	border-bottom: 2px dashed #ccc;
	padding-bottom: 5px;
	}
#news h2 a {
	border-bottom: none;
	width: 520px;
	display:block;
	}

#news .postcontent {
	margin-bottom: 30px;
	width: 520px;
	display: block;
	float: left;
	}

#news ul.postinfo {
	width: 160px;
	float: left;
	margin-left: 0px;
	}
#news ul.postinfo li {
	margin-bottom: 3px;
	list-style-type: none;
	}
#news ul.postinfo li.time {
	font-style: italic;
	}
#news .postcontainer li.post {
	}

/* -----------------------WORKS.php PAGE----------------------- */

#workslist {
	margin-left: 0px;
	}
h1#wdesignportfolio {
	padding-bottom: 25px;
	font-style: italic;
	}
li.worksthumb {
	border-bottom: 1px solid #ccc;
	padding-bottom: 0px;
	margin-bottom: 50px;
	overflow: hidden;
	}
li.worksthumb:last-child {
	border-bottom: none;
	}
li.worksthumb .image a {
	display: block;
	border: 1px solid #e6e6e6;
	padding: 9px;
	width: 500px;
	height: 315px;
	float: left;
	}
.workslisting {
	width: 380px;
	margin-left: 540px;
	}
h2.workstitle {
	display:block;
	margin-bottom: 15px;
	border-bottom: 2px dashed #ccc;
	padding-bottom: 5px;
	}
h2.workstitle a {
	border-bottom: none;
	}
h2.workstitle span.newtab {
	padding-left: 20px;
	font-size: 14px;
	color: #de2916;
	font-weight: normal;
	}
.workslisting h4 {
	margin-top: 10px;
	margin-bottom: 5px;
	}
.workslisting p {
	margin-top: 5px;
	}
	
	
/*-------------------- PAGE.php ---------------------- */	
#contentpage {
	width: 700px;
	float: left;
	margin-bottom: 20px;
	}
#contentpage h1 {
	margin-bottom: 40px;
	font-style: italic;
	}


#contentpage ul {
	list-style-type: circle;
	margin-top: 20px;
	}
#contentpage ul p {
	margin-left: 0px;
	}
#contentpage ul.postinfo {
	list-style-type: none;
	margin-left: 0px;
	}
#contentpage li {
	line-height: 1.3em;
	padding-bottom: 7px;
	}
#contentpage ol {
	list-style-type: decimal;
	margin-left: 20px;
	margin-top: 20px;
	}
#contentpage #contactform {
	float: left;
	width: 380px;
	margin-right: 20px;
	}
#contentpage #aboutme {
	float: left;
	width: 300px;
	}
	
	
/* -------------------ARTICLES.php---------------------*/

#articles h2 {
	border-bottom: 2px dashed #ccc;
	padding-bottom: 5px;
	}
#articles h2 a {
	border-bottom: none;
	width: 520px;
	display:block;
	}

#articles .postcontent {
	margin-bottom: 30px;
	width: 520px;
	display: block;
	float: left;
	}

#articles ul.postinfo {
	width: 160px;
	float: left;
	}
#articles ul.postinfo li {
	margin-bottom: 3px;
	}
#articles ul.postinfo li.time {
	font-style: italic;
	}
#articles .postcontainer li.post {
	}
	

/* ------------------- SIDEBAR ------------------------ */
#sidebar {
	width: 200px;
	float: right;
	padding-left: 10px;
	padding-bottom: 20px;
	}
	
#sidebar h6#serving {
	width: 200px;
	height: 37px;
	background: url(images/nga.png) no-repeat top left;
	}
#sidebar h6#serving span {
	display: none;
	}
	
#sidebar #featuredwork h6#featuredworktitle {
	width: 182px;
	height: 24px;
	background: url(images/featuredwork.png) no-repeat top left;
	margin-top: 25px;
	border-bottom: 2px dashed #e6e6e6;
	padding-bottom: 5px;
	}
#sidebar #featuredwork h6#featuredworktitle span {
	display: none;
	}
	
#sidebar #featuredwork li {
	list-style: none;
	}
#sidebar #featuredwork li a {
	border: 1px solid #e6e6e6;
	padding: 9px;
	display: block;
	width: 180px;
	height: 180px;
	margin-top: 10px;
	}
#sidebar #featuredwork li a:hover {
	border: 2px solid #808080;
	padding: 8px;
	}
	
#sidebar #featuredarticle h6#featuredarticletitle {
	width: 181px;
	height: 24px;
	background: url(images/featuredarticle.png) no-repeat top left;
	margin-top: 25px;
	border-bottom: 2px dashed #e6e6e6;
	padding-bottom: 5px;
	}
#sidebar #featuredarticle h6#featuredarticletitle span {
	display: none;
	}
	
#sidebar #featuredarticle h4 {
	margin-top: 10px;
	}
#sidebar #featuredarticle a {
	
	}
#sidebar #featuredarticle p {
	margin-top: 0px;
	}
#sidebar #featuredarticle a#readmore {
	background: url(images/continuereading.png) no-repeat 135px 4px;
	width: 165px;
	height: 21px;
	padding-top: 10px;
	display: block;
	}
#sidebar #featuredarticle a:hover#readmore {
	background: #F2F2F2 url(images/continuereading.png) no-repeat 135px 4px;
	}
	
#sidebar #articlecategories li {
	list-style-type: circle;
	padding-bottom: 7px;
	}

#sidebar h3#articlecategoriesheading {
	margin-top: 0px;
	color: #333;
	}
#sidebar h3#articlecategoriesheading {
	background: url(images/articlecategories.png) no-repeat top left;
	height: 21px;
	width: 202px;
	border-bottom: 2px dashed #e6e6e6;
	padding-bottom: 5px;
	}
#sidebar h3#articlecategoriesheading span {
	display: none;
	}

/* ------------------ FOOTER -------------------------- */
#footer {
	clear: both;
	border-top: 1px solid #ccc;
	width: 954px;
	}
#footer ul#contactinfo {
	width: 275px;
	padding-top: 5px;
	border-right: 1px solid #ccc;
	float: left;
	margin-left: 0px;
	}
#footer ul li {
	padding-bottom: 3px;
	}
	
#footer ul#businesspartners {
	padding-top: 5px;
	width: 155px;
	float: left;
	padding-left: 15px;
	border-right: 1px solid #ccc;
	margin-left: 0px;
	}

#footer #future {
	width: 465px;
	padding-left: 15px;
	float: left;
	padding-top: 5px;
	}
#footer .footertitle {
	font-style: italic;
	}
#footer ul#future {
	margin-left: 0px;
	}
