/* @override 
	http://jimclarkart.com/wp-content/themes/defusion/custom.css
	http://ejclark.com/wp-content/themes/defusion/custom.css
*/

/*See Instructions at bottom
Use to override theme & other styles
use: .custom prefix to all elements you want to change*/

/*
###########
EJC for pwa
###########
*/

/*Only for table
Needed if images are displayed in table cells. currently this is not being used, but left in if decided to go back to tables.*/

.custom p.picasa img {
	border: 2px solid black;
}

.custom p.picasa img:hover {
	border: 1px outset silver;
}

/*Only for PWA albums in pages*/

/*This really doesn't do anything but left here for possible future use*/
.custom .picasa-web-album {
	display: inline-block;
}

.custom .picasa-pwa-wrap {
	width: 96px;
	height: 96px;
	padding: 0;
	/*margin-right: 4px;
	margin-bottom: 4px;*/
	text-align: center;
	float: left;
}

.custom .picasa-pwa-photos-img {
	/*border-style: none;*/
	border: 1px outset #a7a7a7;
	background-color: #fff;
	padding: 4px;
}

.custom .picasa-pwa-photos-img:hover {
	opacity: 0.75;
}

/*Only for picasa sidebar widget*/

.custom #picasa-web-albums.box-right {
	overflow: auto;
}

.custom .picasa-photos {
	text-align: center;
}

.custom .picasa-photos-wrap {
	width: 80px;
	height: 80px;
	float: left;
	padding: 0;
	margin-right: 6px;
	margin-bottom: 6px;
}

.custom .picasa-photos-img {
	border: 1px outset #a7a7a7;
	background-color: #fff;
	padding: 3px;
}

/*
###################
EJC for theme style
###################
*/

/*This is the body tag - body not needed after .custom*/
.custom {
	margin: 0px;
	padding: 0px;
	background: #a7a7a7;
	color: #555;
	font: 11px/18px  Helvetica, "Helvetica Neue",Verdana, Arial, sans-serif;
}

.custom a {
	color: #000;
	outline: none;
}

.custom a:hover {
	color: #333;
	outline: none;
}

/*	##################################
   	HEADINGS
	################################## */

.custom h1 {
	margin: 0px 28px 0px 0px;
	padding: 0px;
	line-height: 1;
	font-size: 22px;
	font-weight: bold;
	position: relative;
	top: 10px;
	text-align: right;
}

.custom h1 a {
	color: #000;
	text-decoration: none;
}

.custom h2 {
	margin: 0 0 20px 20px;
}

.custom h2#blog-description {
	margin: 0px 28px 0px 0px;
	padding: 0px;
	line-height: 1;
	font-size: 11px;
	position: relative;
	top: 15px;
	text-align: right;
}

.custom h4 {
	margin: 0 0 10px 0;
	font-size: 12px;
	color: #787878;
	font-style: italic;
}

 /*not needed because moved to footer*/
.custom #top-nav li#rss {
	
}

/*	##################################
   	CONTENT
	################################## */

/** box left */

.custom .box-left {
	margin: 0 20px 20px;
	padding-top: 20px;
}

/* EJC could use visibilty: hidden if we don't want this .meta element. Check theme files for changes*/

.custom .meta {
	clear: both;
	padding: 10px;
	background: #ccc;
	/*background: #ccc url(img/bg-meta.gif) repeat-x left top;*/
	color: #787878;
	border-bottom: 1px solid #a7a7a7;
}

.custom .meta-date {
	padding: 0 10px 0 15px;
	background: none;
	/*background: url(img/bg-meta-date.gif) no-repeat 0px 2px;*/
}

.custom .meta-categories {
	padding: 0 10px 0 15px;
	background: none;
	/*background: url(img/bg-meta-categories.gif) no-repeat 0px 2px;*/
}

.custom .meta-comments {
	padding: 0 10px 0 15px;
	background: none;
	/*background: url(img/bg-meta-comments.gif) no-repeat 0px 2px;*/
}

 /*EJC added text color for sidebar text and for sidebar photos.*/ 

.custom .textwidget {
	color: #666;
}

/** box right */

.custom .box-right {
	margin: 0 20px 20px 0;
	padding: 20px;
	/*background: #999 url(img/bg-box-right.gif) no-repeat left top;*/
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background: #dfdfdf;
	border-bottom: 1px solid #999;
	border-right: 1px solid #999;
	border-top: 1px solid #bdbdbd;
	border-left: 1px solid #bfbfbf;
}

.box-right ul {
	margin: 0 0 5px 0;
	padding: 0px;
	list-style: none;
}

.custom .box-right li {
	margin: 0px;
	padding: 5px;
	border-bottom: 1px dashed #bdbdbd;
}

.custom .box-right li:hover {
	margin: 0px;
	padding: 5px;
	border-bottom: 1px solid #bdbdbd;
}

.box-right li a {
	text-decoration: none;
}

/*	##################################
   	BASIC LAYOUT
	################################## */
	
.custom #page {
	width: 840px;
	margin: 0 auto;
}
	
.custom #header {
	height: 95px;
}

.custom #content {
	padding: 0;
	background: #ccc;
	/* was background: #fff;*/
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

.custom #content-left {
	width: 520px;
	float: left;
}

#content-right {
	float: right;
	width: 320px;
	padding-top: 20px;
}

.custom #footer {
	width: 840px;
	margin: 0 auto;
	padding: 20px 0;
}

/*	##################################
   	FOOTER
	################################## */

/*None of footer elements have changed so no custom prefix. shown here in case want to change*/

#footer p {
	margin: 0 0 10px 0;
}

/* overflow: hidden causes the login link to be hidden because it is outside of the height 20px dimensions */

.custom #legal {
	float: left;
	width: 400px;
	margin-left: 20px;
	height: 20px;
	overflow: hidden;
}

#webdemar {
	float: right;
	width: 400px;
	text-align: right;
}

#meta-nav {
	margin: 0px;
	padding: 0px;
	list-style: none;
}

#meta-nav li {
	float: right;
	margin: 0 0 0 10px;
}

#meta-nav li#rss {
	background: url(img/rss-icon.gif) no-repeat left center;
	margin-right: 20px;
	padding: 0 0 0 15px;
}

/*From nav.css*/

/*Main Navbar */

.custom #nav {
	position: absolute;
	bottom: 0px;
	left: 0px;
	margin: 0px;
	padding: 0px;
	background: #a7a7a7;
	border-bottom: 8px solid #a7a7a7;
}

.custom #nav, .custom #nav ul {
	width: 840px;
	list-style: none;
	line-height: 25px;
	}
	
.custom #nav a {
	display: block;
	color: #000;
	font-weight: bold;
	text-decoration: none;
	padding: 0 20px;
	background-image: none;
	border-right: 1px solid #787878;
}
	
.custom #nav a:hover {
	border: none;
	color: #666;
	background-image: none;
	border-right: 1px solid #787878;
}

.custom #nav li {
	list-style: none;
	float: left;
}

.custom #nav a, .custom #nav a:visited {
	display: block;
	color: #000;
	padding: 0 20px;
}

.custom #nav a:active, .custom.current_page_item a, .custom #home .on {
	text-decoration: none;
	}	
	
	
/* Dropdown Menus */		
.custom #nav li ul {
	position: absolute;
	left: -999em;
	margin: 0px;
	padding: 0px;
	height: auto;
	/*border-bottom: 1px solid #6e7073;*/
	line-height: 30px;
	width: inherit;
	border-bottom: none;
}

.custom #nav li li {
	border-top: none;
	border-right: none;
	border-left: none;
	border-bottom: none;
	background: rgba(167,167,167,0.3);
	width: inherit;
}

.custom #nav li li a, .custom #nav li li a:visited {
	font-weight: bold;
	font-size: 0.9em;
	color: #000;
	background: rgba(167,167,167,0.5);
	border-top: none;
	border-right: none;
	border-left: none;
	border-bottom: none;
	/*background: #a7a7a7;*/
	}

.custom #nav li li a:hover, .custom #nav li li a:active {
	background: #a7a7a7;
	border-top: none;
	border-right: none;
	border-left: none;
	border-bottom: none;
	color: #fff;
	font-weight: bold;
}	
		
.custom #nav li:hover ul, .custom #nav li li:hover ul, .custom #nav li li li:hover ul, .custom #nav li.sfhover ul, .custom #nav li li.sfhover ul, .custom #nav li li li.sfhover ul {
	left: auto;
	}

.custom a.main:hover
{	background:none;
	}


/*##########################
	custom.css  custom styles for any WordPress theme that YOU define
	------------------------------------------------------------------
	
	This stylesheet will allow you to futureproof your CSS changes
	against future releases and upgrades on ANY WordPress theme. I 
	know you work hard on your modified styles, and I don't want you 
	to feel like every theme upgrade is a total drag!
	
	Also, if you're a designer who makes use of GPL themes in your
	work, you'll find this incredibly handy! You can come up with a
	set of core modifications for any WordPress theme, and by
	isolating these mods in a separate stylesheet, you'll be better
	able to track the changes that you make and their associated
	effects. Best of all, when the theme's designer releases a new
	version, you won't have to go back through and make all your
	changes anew. Plus, this is *definitely* the smartest way to scale
	out sites if you find yourself using one or two theme frameworks
	consistently.
	
	Instructions:
	
	Modifying existing theme styles to your liking is a breeze with
	this handy stylesheet. In order to turn on the CSS styles that you
	define here, you'll need to append the <body> tag (usually found
	within the header.php file) with a CSS class called "custom".
	Thanks to this, you now have the ability to override ANY style
	that's declared in the theme's original stylesheet.
	
	In practice, you simply need to copy the CSS for the element that
	you want to change (from style.css) and then paste it here. Prefix
	the new CSS declaration with .custom, and then make your tweaks as
	necessary.
	
	Here's an example:
	
	To change the default color of the <a> tag (let's say you want to 
	make them a cherry red [#c00]) and to remove the default
	underline, this is what you would do:
	
	.custom a { color: #c00; text-decoration: none; }
	
	Oh, but remember, none of these changes will work unless you call
	custom.css from wihtin your header file!
	
	Cool? Now get to hackin!
*/
