/**
Theme Name: Derekj
Author URI: http://wpjunction.com
Theme URI: http://wpjunction.com
Version: 1.0
Author: hpa
Description: Derekj Theme Premium WP
*/

@import url('css/reset.css');
@import url('css/default.css');
@import url('css/lavalamp.css');
@import url('css/jquery.tabs.css');
@import url('css/widgets.css');
@import url('css/comments.css');

body {
	background:#FFFFFF url('./images/background.gif') repeat-x 0 100%;
	font:normal 12px/16px Arial, Verdana, Tahoma;
	color:#505050;
}

a {
	text-decoration:none;
	color:#98a006;
}

a:hover { color:#c2cb08; }

#body-in {
	background:transparent url('./images/body-in-bg.gif') repeat-x 0 0;
}

#wrapper {
	width:960px;
	margin:0 auto;
}

.icon {
	background:transparent url('./images/all-icons.gif') no-repeat;
	padding-left:20px;
	display:block;
	float:left;
	height:15px;
	line-height:15px;
	margin-right:5px;
}

/* header */
#header { margin-bottom:10px; }

#page-menu { height:38px; }

#right-now, #subcribe-form, .input-text {
	text-transform:uppercase;
	font-size:11px;
	color:#4E4E4E;
}

/* branding */
#branding {
	overflow:hidden;
	height:105px;
}

#blog-title {
	margin-top:27px;
	font:normal 30px Georgia,'Times New Roman','Bitstream Charter',Times,serif;
	font-style:italic;
	display:block;
}

#blog-title a { color:#000000; }

#blog-title a:hover { color:#BAC300; }

#blog-description {
	background:transparent url('./images/tagline-bg.gif') no-repeat 0 0;
	font:normal 12px/16px 'Lucida Grande',Verdana,Arial,'Bitstream Vera Sans',sans-serif;
	color:#c2cb08;
}

#right-now {
	background-position:0 9px;
	height:36px;
	padding-left:23px;
	line-height:36px;
}

#header-tools {
	float:right;
	width:370px;
	height:36px;
}

#rss-icon {
	background-position:0 -21px;
	height:36px;
	padding:0;
	width:22px;
	margin-right:5px;
}

#subcribe-form {
	margin:0;
	padding:0;
	background:transparent url('./images/subscribe-email-form-bg.gif') no-repeat 0 0;
	float:left;
	width:230px;
	height:23px;
	position:relative;
	top:7px;
	left:110px;
}

#subcribe-form .input-text, #subcribe-form .input-submit, #subcribe-form label {
	border:medium none;
	background:transparent;
	position:absolute;
}

#subcribe-form label {
	left:-107px;
	top:5px;
}

.input-text {
	left:6px;
	top:4px;
	width:192px;
	font-size:11px;
}

.input-submit {
	width:21px;
	height:22px;
	padding:0;
	right:0;
	top:0;
	cursor:pointer;
}

#cat-menu {
	height:37px;
	overflow:hidden;
	font-size:10px;
}

#cat-menu li {
	display:inline;
	margin-right:17px;
}

#cat-menu li a {
	color:#FFFFFF;
	display:block;
	float:left;
	height:37px;
	line-height:35px;
	padding:0 16px;
	text-transform:uppercase;
}

#cat-menu li a:hover, #cat-menu li.current-cat a {
	background:#C9D20E url('./images/cat-menu-hover-bg.gif') repeat-x 0 0;
}

/* container */
#container { margin-bottom:10px; }

/* content */
#content {
	float:left;
	width:628px;
}

#featured { margin-bottom:10px; }

/* post */
.pagetitle {
	font:normal 25px 'Trebuchet MS', Tahoma, Verdana;
	color:#CDD612;
}

.post-header {
	text-align:right;
	margin-bottom:8px;
}

.post {
	background:#FFFFFF url('./images/post-bg.gif') no-repeat 50% 24px;
	margin-bottom:10px;
}

.single { background:none !important;}

.title {
	font:normal 16px 'Trebuchet MS', Tahoma, Verdana;
	color:#222222;
	float:left;
	width:460px;
	text-align:left;
}

.title a { color:#222222; }

.title a:hover { color:#98a006; }

.meta {
	clear:left;
	font:normal 11px Tahoma, Verdana;
	color:#A0A0A0;
	margin-bottom:5px;
}

.meta a { color:#A0A0A0; }

.meta a:hover { color:#98a006; }

.post-date {
	font:normal 11px Tahoma, Verdana;
	color:#98a006;
	line-height:25px;
}

.post-author { background-position:0 -60px; }

.post-categories { background-position:0 -85px; }

.post-comment { background-position:0 -109px; }

#sidebar {
	float:left;
	width:315px;
	padding-left:7px;
}

.widget {
	background:#FFFFFF url('./images/widget-bg.gif') no-repeat 50% 24px;
	margin-bottom:10px;
}

.widget ul li {
	font:normal 11px Tahoma, Verdana;
	line-height:27px;
	border-bottom:1px solid #E2E2E2;
	color:#8D8D8D;
}

.widget ul li a { color:#8D8D8D; }

.widget ul li a:hover { color:#5FA9DF; }

/* sidebar */
#sidebar {
	float:left;
	width:315px;
	padding-left:12px;
}

.widget { margin-bottom:10px; }

.widget ul li {
	font:normal 11px/16px Tahoma, Verdana;
	line-height:27px;
	border-bottom:1px solid #E2E2E2;
	color:#8D8D8D;
	padding:0 5px;
}

.widget ul li a { color:#393939; }

.widget ul li a:hover { color:#98a006; }

.widget ul li li { border:none; }

/* footer */
#footer {
	height:39px;
	font:normal 12px/16px Tahoma, Verdana;
	line-height:39px;
	overflow:hidden;
	text-transform:uppercase;
	color:#FFFFFF;
}

#blog-name, #blog-name span {
	background:#FFFFFF url('./images/blog-name-bg.gif') no-repeat;
	background-position:0 0;
	display:block;
	float:left;
	height:24px;
	padding-left:8px;
}

#blog-name { margin:8px 9px 0 9px; }

#blog-name span {
	background-position:100% 0;
	display:block;
	float:left;
	height:24px;
	line-height:24px;
	padding:0 8px 0 0;
	color:#000000;
	text-transform:capitalize;
}
.menu1 {font:12px Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	background:#343434;
	text-align:left;height:37px;}

/* remove all the bullets, borders and padding from the default list styling */
.menu1 ul {padding:0;margin:0;list-style-type:none; background:#343434;
}

/* style the sub-level lists */
.menu1 ul ul {width:120px; margin-top:18px; height:auto }

/* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu1 ul li {float:left;background:#343434;
height:17px;padding:10px;
}

/* style the sub level list items */
.menu1 ul ul li {display:block;height:auto;position:relative; padding:3px 0 3px 0;}

/* style the links for the top level */
.menu1 a, .menu1 a:visited {display:block;float:left;height:100%;font-size:1em;text-decoration:none;color:#ffffff;padding:0 12px 0 12px;background-color:#343434;}

/* style the sub level links */
.menu1 ul ul a, .menu1 ul ul a:visited {display:block;background-color:#343434; color:#fffff;width:150px; margin-bottom:1px; margin-left:1px; margin-right:1px}
.menu1 ul table ul a, .menu1 ul table ul a:visited  {width:120px; w\idth:120px;}


/* style the table so that it takes no part in the layout - required for IE to work */
.menu1 table {position:absolute; left:0; top:0; font-size:1em; z-index:-1;}
.menu1 ul ul table {lef\t:-1px;}
.menu1 ul ul table ul.left {margin-lef\t:2px;}

.menu1 li:hover {position:relative; background-color:#c6cf0b;}
* html .menu1 a:hover {position:relative; background-color:#c6cf0b;}

/* style the third level background */
.menu1 ul ul ul a, .menu1 ul ul ul a:visited {background:#343434;padding:0 12px 0 12px;}
/* style the fourth level background */
.menu1 ul ul ul ul a, .menu1 ul ul ul ul a:visited {background-color:#343434;}
/* style the sub level 1 background */
.menu1 ul :hover a.sub1 {background:#c6cf0b;}
/* style the sub level 2 background */


/* style the level hovers */
/* first */
.menu1 a:hover {color:#000000;background-color:#c6cf0b;}
.menu1 :hover > a {color:#000000;background-color:#c6cf0b;}
/* second */
.menu1 ul ul a:hover{color:#000000;background-color:#c6cf0b;}
.menu1 ul ul :hover > a {color:#000000;background-color:#c6cf0b;}
/* third */
.menu1 ul ul ul a:hover {background:#c6cf0b;}
.menu1 ul ul ul :hover > a {background:#c6cf0b;}
/* fourth */
.menu1 ul ul ul ul a:hover {background:#c6cf0b;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu1 ul ul {visibility:hidden;position:absolute;height:0;top:17px;left:0;width:250px}

/* position the third level flyout menu */
.menu1 ul ul ul{left:14em;top:0;width:120px;}

/* position the third level flyout menu for a left flyout */
.menu1 ul ul ul.left {left:-14em;}


/* make the second level visible when hover on first level list OR link */
.menu1 ul li:hover ul, .menu1 ul a:hover ul {visibility:visible; height:auto; padding-bottom:3em; background:transparent url(images/trans.gif);}
/* keep the third level hidden when you hover on first level list OR link */
.menu1 ul :hover ul ul{visibility:hidden;}
/* keep the fourth level hidden when you hover on second level list OR link */
.menu1 ul :hover ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu1 ul :hover ul :hover ul{visibility:visible;}
/* make the fourth level visible when you hover over third level list OR link */
.menu1 ul :hover ul :hover ul :hover ul {visibility:visible;}