/*
Theme Name:		Business/Blog
Theme URI:		n/a
Description: 	A sleek, clean, modern design for a business, product, or personal website or blog.
Version: 		1
Author: 		Jason LaRose
Author URI: 	http://jasonlarosedesign.com

Name v1
This site was designed and built by Jason LaRose, whose website you will find at jasonlarosedesign.com
*/


/* ========================================================================= */
/* UNIVERSAL STYLES                                                          */
/* ========================================================================= */

	* { margin: 0; padding: 0; font-family: Helvetica, Arial, sans-serif; }
	html, body { font-size: 12px; line-height: 150%; background: #353535 url(../images/bg.jpg) repeat-x 0 0; color: #555; }



/* ========================================================================= */
/* LAYOUT STYLES                                                             */
/* ========================================================================= */

	#wrapper { width: 960px; margin: 0 auto 20px auto; }
	#wrapper-inner { background: #FFF; border: 1px solid #333; overflow: hidden; clear: both; }
	#content { margin: 20px; padding-top: 1px; overflow: hidden; clear: both; border-top: 1px solid #fff; }
	#content-sub { float: right; width: 320px; }
	#content-main { float: left; width: 580px; }
	#footer { clear: both; overflow: hidden; background: #353535; margin: 10px 20px 20px 20px; border: 1px solid #484a47; color: #a4a4a4; font-size: 10px; }
	#footer-inner { border: 1px solid #555; overflow: hidden;  }




/* ========================================================================= */
/* ELEMENT STYLES                                                            */
/* ========================================================================= */

	h1 { font-size: 18px; margin: 20px 0; color: #405a4b; }
	h2 { font-size: 16px; margin: 20px 0; color: #405a4b; }
	h3 { font-size: 14px; margin: 20px 0; color: #405a4b; }
	h4 { font-size: 14px; margin: 20px 0; color: #0000FF; }
	h1 span, h2 span, h3 span, h4 span { display: block; font-size: 10px; font-weight: normal; line-height: 125%; color: #555; }
	hr { border: none; background: #ccc; height: 1px; margin: 20px 0; }
	p { margin: 20px 0; }
	ul { margin: 20px; }
	ol { margin: 20px 20px 20px 25px; }
	a { text-decoration: none; color: blue; }
	a:hover { text-decoration: underline; }
	/*a:focus { -moz-outline-style: none; }  activate this style if you do not want the dotted border appearing on click of anchor tags in Firefox. However, it will render the css invalid. */
	blockquote { margin: 20px 20px 0 20px; }
	cite { margin: 5px 20px 20px 20px; text-align: right; display: block;}
	img { border: 0px solid #808080; }
	img.float-left { float: left; display: inline; margin: 0 20px 0 0; }
	

/* = ELEMENT STYLES: Classes and ID's ====================================== */

	h1#logo { float: left; height: 91px; width: 923px; text-indent: -9000px; background: url(../images/logo.jpg) no-repeat 0 50%; margin: 0 5px 0 5px; }

	#feature { clear: both; height: 270px; background: url(../images/bg_feature.jpg) repeat-x 0 100%; border-bottom: 1px solid #808080; overflow: hidden; }
	#feature span { color: #555; }
	#feature p { color: #555; margin: 10px 0; }
	#feature h3 { margin: 0; }
	.feature-content { height: 170px; overflow: hidden; padding: 20px; }
	#tab2 { background: url(../images/image-sample_feature-full.jpg) no-repeat 0 0; }
	#feature p.caption { width: 450px; }
	#menu { margin: 0; }
	#menu li { list-style: none; float: left; width: 239px; }
	#menu li.first { width: 241px; margin-left: -1px; }
	#menu li.last { width: 240px; }
	#menu li a { padding: 7px 10px; font-size: 10px; font-weight: normal; line-height: 125%; color: #555; height: 50px; display: block; background: #b5b5b5 url(../images/bg_feature-option.jpg) repeat-x 0 0; border-left: 1px solid #808080; border-top: 1px solid #808080; }
	#menu li a:hover { background: none; text-decoration: none; border-top: 1px solid transparent; }
	#menu li a.selected { background: none; border-top: 1px solid transparent; }
	#menu li.first a { padding-left: 20px; }
	#menu li.last a { padding-right: 10px; }
	#menu li a span { font-weight: bold; display: block; line-height: 150%; font-size: 12px;  color: #000; }


	.block { background: #ddd; border: 1px solid #ccc; margin-bottom: 20px; }
	.block-inner { border: 1px solid #fff; padding-bottom: 20px; }
	.block-inner blockquote { margin: 5px 20px; }
	.block-inner cite { margin-bottom: 0; }
	.block-inner p { margin: 0 20px 0 20px; }
	.block-inner a.more { display: block; text-align: right; margin: 0 20px; font-size: 10px; background: url(../images/icon_arrow-more.gif) no-repeat 100% 50%; padding-right: 8px; }
	.block-inner h4 { color: #353535; margin: 20px 20px 0 20px; }
	.block-inner ul { list-style: none; margin: 5px 20px 0 20px; }
	.block-inner ul a { padding-left: 0px;  }
	.block-inner ul a:hover { color: #000; }
	.block-inner ul.news li { border-bottom: 1px solid #bbb; padding: 5px 10px 5px 12px; font-size: 10px; background: url(../images/icon_article.gif) no-repeat 0 9px; }
	.block-inner ul.news li a { display: block; background: none; padding: 0; font-size: 12px; font-weight: bold;}
	
	#footer h4 { color: #fff; font-size: 12px; }
	#footer a { color: #fff; }
	#footer p { margin: 0 0 10px 0; }
	.footer-left { height: 75px; float: left; width: 416px; border-right: 1px solid #555; margin: 00px 0 20px 20px; padding-right: 20px; }
	.footer-right { height: 75px; float: left; width: 406px; border-left: 1px solid #222; margin: 20px 20px 20px 0; padding-left: 20px; }
	
	.clear { clear: both; }



/* ========================================================================= */
/* NAV STYLES                                                                */
/* ========================================================================= */

	/* = NAV STYLES: Visual Style ====================================== */	

	#nav { float: left; width: 768px; padding-left: 1px; }
	
	ul.dropdown { border-right: 1px solid #2c4239; border-left: 1px solid #718d82; }
	ul.dropdown a { padding: 12px 10px 8px 10px; text-transform: uppercase; color: #fff; text-decoration: none; }
	ul.dropdown li { border-right: 1px solid #718d82; border-left: 1px solid #2c4239; }
	ul.dropdown li.hover { background: url(../images/bg_nav-hover.jpg) repeat-x 0 0; cursor: pointer; }
	ul.dropdown li:hover { background: url(../images/bg_nav-hover.jpg) repeat-x 0 0; cursor: pointer; }
	ul.dropdown *.parent { padding-right: 20px; background: url(../images/bg_nav-dropdown.gif) no-repeat 100% 0; }
	ul.dropdown *.parent:hover { background: url(../images/bg_nav-dropdown.gif) no-repeat 100% -200px; }
	ul.dropdown ul { width: 150px;  }
	ul.dropdown ul *.parent { padding-right: 15px; background: #405a4b url(../images/bg_nav-flyout-arrow.gif) no-repeat 95% 50%; }
	ul.dropdown ul *.parent:hover { background: #496957 url(../images/bg_nav-flyout-arrow_hover.gif) no-repeat 95% 50%; }
	ul.dropdown ul li { background: #405a4b; background-image: none; border-top: 1px solid #738a84; border-bottom: 1px solid #2c4239; }
	ul.dropdown ul li.hover { border-top: 1px solid #718d82; background: #496957; }
	ul.dropdown ul li:hover { border-top: 1px solid #718d82; background: #496957; }
	
	
	/* = NAV STYLES: Functionality - no need to touch ================== */	
	
	ul.dropdown { list-style: none; position: relative; z-index: 597; float: left; margin: 0; }
	ul.dropdown a { display: block; }
	ul.dropdown li { float: left; padding: 0; zoom: 1; }
	ul.dropdown li.hover { position: relative; z-index: 599; }
	ul.dropdown li:hover { position: relative; z-index: 599; }
	ul.dropdown ul { list-style: none; visibility: hidden; position: absolute; top: 100%; left: -1px; z-index: 598; margin: 0 0 0 0; }
	ul.dropdown ul li { float: none; }
	ul.dropdown ul ul { top: -2px; left: 149px; margin: 1px 0 0 0; }
	ul.dropdown li:hover > ul { visibility: visible; }
	ul.dropdown li.hover > ul { visibility: visible; }



/* ========================================================================= */
/* FORM STYLES                                                               */
/* ========================================================================= */

	form li { list-style: none; margin: 20px 0; }
	form li ul { margin-left: 220px; }
	form li ul li { margin: 0; }
	label.description { display: block; font-weight: bold; float: left; width: 150px; text-align: right; margin: 0 20px 0 0; }
	label.choice { padding-left: 5px; }
	input.text { width: 290px; font-size: 12px; background: #e6e6e6; border: 1px solid #aaa; color: #555; padding: 5px; margin-top: -5px;  }
	input.submit { margin-left: 400px; }
	textarea { width: 290px; height: 100px; font-size: 12px; background: #e6e6e6; border: 1px solid #aaa; color: #555; padding: 5px; margin-top: -4px; }
	select { width: 300px; }