/* 
Theme Name: Shaken
Theme URI: http://lazily.org
Description: Adapted from http://melly.me's Clean theme
Version: 1.0
Author: Kalliste
Author URI: http://www.lazily.org
Tags: clean, custom,minimal, widgets

	Usage License: http://www.opensource.org/licenses/gpl-3.0.html
	Main Reference: http://www.w3schools.com/css/default.asp
	
	
*/

/* ---- GENERAL & TYPOGRAPHY ---- */

* { padding:0; margin:0; } /* Universal zeroing of margins/padding. Highly useful for serious CSS control!
Why keep the above line? See this article: http://leftjustified.net/journal/2004/10/19/global-ws-reset/
I recommend you keep it in your CSS, especially if you are still learning about stylesheets. But its also useful for seasoned coders as well.
Do NOT set these values to anything other than ZERO. Remember that the asterisk (*) means it will effect EVERYTHING on the website. */

body { 
background: #000; /* Page background color. */
font: 0.75em/1.5em Calibri, Verdana, Arial, Helvetica, sans-serif; 
/* Font size/Line Height ~ http://www.alistapart.com/articles/howtosizetextincss */
/* Font family specifiation ~ http://www.w3schools.com/CSS/pr_font_font-family.asp */
color: #2076CF; /* Overall font color. */
} 

em {color: #fff;
   }

hr {color: #fff;
    }

img { border: 0; }

a:link, a:visited { 
color:#fff; 
text-decoration:none;
} /* Site-wide link style. */

a:hover {
color:#2076CF;
text-decoration:none;
border-bottom:1px solid #fff;
} /* When mouse hovers over link. */

abbr, acronym { border-bottom: 1px dotted #902b3a; } 
/* For explaining abbreviations/acronyms. :: http://www.w3schools.com/TAGS/tag_abbr.asp & http://www.w3schools.com/tags/tag_acronym.asp*/

blockquote { 
margin:10px 20px;
padding:10px;
background:#000000; 
border-top: 1px solid #2076CF;
border-bottom: 1px solid #2076CF;
} /* For long quotes. :: http://www.w3schools.com/TAGS/tag_blockquote.asp */

	blockquote p { margin:0; padding:0; } /* Paragraph tags in blockquotes. Wordpress adds them by default in posts. Give them 0 to margin & padding if they appear weird. */

q {
font: italic normal normal 1.1em/1.7em Georgia, "Times New Roman", serif; 
color:#616161; 
} /* For short quotes. :: http://www.w3schools.com/TAGS/tag_q.asp */

q:before, q:after { content: ""; } /* Q-tag fix: http://alistapart.com/articles/qtag */

pre, code {
background:#e3eef5;
border-top: 1px solid #d6e6f0;
margin:10px 20px;
padding:10px;
overflow:auto 
} /* Control line breaks and spaces. :: http://www.w3schools.com/TAGS/tag_pre.asp */

small { color:#000; } /* Make text appear smaller. :: http://www.w3schools.com/TAGS/tag_font_style.asp */

#wrapper {
margin:15px auto;
clear:both;
width:675px;
background:#000;
} /* Overall container wrapper to hold all the elements (header, content, sidebar, footer, etc). */


/* ---- LEFT SIDEBAR ---- */

#left {
background-image: url('images/header.png');
background-repeat: repeat-x;
float:left;
width:75px;
height:600px;
padding: 0px;
font-size: 0.9em;
}

/* ---- HEADER ---- */

#header {
background: #000 no-repeat top left;
width:675px;
height:88px;
} /* The main wrapper for the header elements. */

	#header h1 { visibility:hidden; }
	/* Hide the title from view. Good for structure and SEO to keep your blog title on your page,
	so just hide it with this so it doesn't appear on top of any header imagery. 
	H1 tag :: http://www.w3schools.com/TAGS/tag_hn.asp */ 


/* ---- NAVIGATION ---- */
/* ---- Check out this site for great navigation list styles: http://css.maxdesign.com.au/listamatic/ ---- */

#navigation { 
margin: 44px 75px 75px 48px;

}

	#navigation ul {
	text-align:left;
        width: 100%;
	}

	#navigation ul li {
	display: inline;
	list-style-type: none;
	font: 1.2em/1.5em Georgia, Garamond, "Times New Roman", serif; 
	}
	
	#navigation ul li a:link, #navigation ul li a:visited { 

	color: #2076CF;
	text-decoration:none; 
	padding: 4px 6px 6px 4px;
	}
	
	#navigation ul li a:hover { 
	color:#000; 
        background-color:#2076CF;
	padding: 4px 6px 6px 4px;
border-bottom:1px solid #2076CF;
	text-decoration:none; 
	}


	
/* ---- CONTENT ---- */	
/* ---- How posts & elements will appear on pages like index.php, single.php, etc. ---- */

#content {
float:left;
width:400px;
border:1px solid #2076CF;
} /* Main container wrapper to hold blog entries & page content. */

	.paging, .entry-paging, .page-paging { text-align:center; } /* Paging navigation for index.php, archive,php, etc. (previous/next) */
	
	.paging a {
		display: block;
		width: 80px;
		padding: 1px;
		margin: 0 auto 10px;
		background:#000;
		border-right:1px solid #2076CF;
		border-bottom:1px solid #2076CF;
		font-size:0.9em;
		color:#2076CF;
		}
		
		.paging a:hover {
		background:#000;
		color:#fff;
		border-right:1px solid #fff;
		border-bottom:1px solid #fff;
		}
	
	.img-left {
	float:left;
	clear:left;
	margin:10px 10px 10px 0;
	background:#e3eef5;
	display:inline;
	} /* Wrap an image in a post/page with <div class="img-left">IMAGE</div> to have this style applied. */
	
		.img-left:hover { background:#fff; }
	
		.img-left img { padding:5px; } /* Style the image itself. */
		
		.img-left a:hover { border:0; }
	
	.img-right {
	float:right;
	clear:right;
	margin:10px 10px 10px 0;
	background:#e3eef5;
	display:inline;
	} /* Same as above only aligned right. */
	
		.img-right:hover { background:#fff; }
	
		.img-right img { padding:5px; } /* Style the image itself. */
		
		.img-right a:hover { border:0; }
	
	ul {
	padding-left:1em;
	margin:5px 0;
	} /* Bulleted (unordered) lists. */

		ul li {
		list-style: url("images/bullet.gif");
		margin: 0 0 0 15px;
		} /* Bulleted list elements. */

	ol {
	padding-left:1em;
	margin:5px 0;
	} /* Numbered (ordered) lists. */

		ol li { margin: 0 0 0 20px; } /* Numbered list elements. */

	dl { margin:5px 0; } /* Definition lists. http://www.w3schools.com/tags/tag_dl.asp */

		dt { 
		font-weight:bold;
		color:#000;
		font: italic normal normal 1.1em/1.7em Georgia, "Times New Roman", serif; 
		} /* Definition list title. */

		dd { } /* Definition list description. */

	p { padding: 8px 0 0 0; } /* Paragraphs :: http://www.w3schools.com/TAGS/tag_p.asp */

	
	/* POSTS & PAGES & IMAGES*/
	.entry, .page, .image { margin:10px 5px 15px 15px; }  /* Individual entry wrapper. */

		h3.entry-title, h2.page-title, h3.image-title {
		font: italic normal normal 1.3em/1.7em Georgia, Garamond, "Times New Roman", serif; 
		color:#fff; 
		} /* Titles wrapped in H2 tags. :: http://www.w3schools.com/TAGS/tag_hn.asp */

		.entry-date, .image-date { 
		font: 0.9em/1.5em Verdana, Arial, Helvetica, sans-serif; 
		color:#b5b5b5;
		} /* Dates for each individual entry. */
		
		.entry-text , .page-text, .image-text { } /* Content text for each individual entry. */
		
		.entry-meta, .image-meta { 
		margin: 10px 0 0 0;
		text-align:center;
		color:#758795;
		} /* Meta information for each individual entry. */
		
		.image-attachment { 
		margin:10px 0;
		text-align:center;
		} /* Wrapper for the actual image being viewed. */
		
			.image-attachment img {
			padding:5px;
			background:#e3e3e3;
			border-right:1px solid #758795;
			border-bottom:1px solid #758795;
			} /* Styling for the image itself. (Size, border, etc) */
			
		.image-caption {
		text-align:center;
		font-style:italic;
		} /* Caption for the image. */


/* ---- PAGE :: SEARCH RESULTS & 404 & ARCHIVES ---- */
/* The pages a visitor sees after submitting a search query or receiving a 404 (not found) error page. */

span.searchquery {
font-size:110%;
font-style:italic;
padding:2px;
background:#b4ca9a; 
} /* Highlight the query the visitor searched for or page/link that was 404 (not found). */

.result , .archive {
margin:10px 0;
padding:10px;
background:#000000; 
border-top: 1px solid #d6e6f0;
border-bottom: 1px solid #d6e6f0;
} /* Individiual search result wrapper. */
	
	h3.result-title, h3.archive-title { } /* Titles wrapped in h2 tags. :: http://www.w3schools.com/TAGS/tag_hn.asp */

	.result-date, .archive-date {
	font: 0.9em/1.5em Verdana, Arial, Helvetica, sans-serif; 
	color:#b5b5b5;
	} /* Dates for each individual entry. */
	
	.result-text, .archive-text  { } /* Content for each individual entry. */
	
	.result-meta, .archive-meta { 
	margin: 5px 0 0;
	font: 0.9em/1.5em Verdana, Arial, Helvetica, sans-serif; 
	color:#758795;
	} /* Meta information for each individual entry. */
	
#tagcloud { } /* Tag cloud wrapper for the Archives page, if enabled. */

	
/* ---- COMMENTS ---- */
/* The pages a visitor sees when viewing an archive page (category, month, year, etc). */

.comments-wrap { margin:10px 20px; 
background: #000;
} /* The main wrapper that contains all comment markup. */

	h4.comments-title {
	font: italic normal normal 1.3em/1.7em Georgia, Garamond, "Times New Roman", serif; 
	color:#000; 
	} /* Titles of comment sections (Comments, Post Comment, ect). Wrapped in H3 tags. */
	
	p.approval { 
	margin: 5px auto;
	width:80%;
	background:#000;
	font: italic normal bold 1.1em/1.5em Verdana, Arial, Helvetica, sans-serif; 
	padding:2px;
	text-align:center;
	border-bottom: 1px solid #e3eef5; 
	border-right: 1px solid #e3eef5; 
	} /* Text the user sees when their comment is in moderation. */

	.comment-author {
	margin: 10px 0;
	padding:10px;
	background:#000000; 
	border-top: 1px solid #ffd0d7;
	border-bottom: 1px solid #ffd0d7;
	} /* Wrapper for the entry author's comment. */

	.at-reply { 
	margin: 10px 0 0 0;
	text-align: right;
	color:#758795;
        }


		.comment-author .gravatar, .comment-visitor .gravatar  { 
		float:right;
		margin: 0 5px 0 10px;
		padding:0;
		}  /* Author's & visitor's gravatar wrapper. */
		
			.comment-author .gravatar img, .comment-visitor .gravatar  img { 
			border: 1px solid; border-bottom: 1px solid #2076CF;
			} /* Author's & visitor's gravatar image. (Size, border, etc) */
		
		.comment-author .comment-name, .comment-visitor .comment-name {
		font-size:1.3em;
		font-weight:bold;
		} /* Author's name. */
		
			.comment-author .comment-name a {
			color:#902b3a;
			text-decoration:none;
			} 
			
			.comment-author .comment-name a:hover {
			color:#000;
			text-decoration:none;
			border-bottom:1px solid #902b3a;
			}
			
.comment-author .comment-text {
 }	/* Author's comment text. */
		
		.comment-author .comment-meta, .comment-visitor .comment-meta { 
		font: 0.9em/1.5em Verdana, Arial, Helvetica, sans-serif; 
		color:#758795;
		} /* Author's comment's meta info. */

	.comment-visitor {
	margin: 10px 0;
	padding:10px;
	background:#000; 
	border-top: 1px solid #2076CF;
	border-bottom: 1px solid #2076CF;
	} /* Wrapper for visitor's comment. */

		.comment-visitor .comment-text {
background: #000; 
} /* Visitor's comment text. */
	
	#commentform { } /* Comment form. */
	
		#commentform label { 
		color:#b5b5b5;
		} /* Label text for each comment field. */
			
		#commentform input, #commentform textarea, #commentform #submit { 
		font: 1.0em/1.5em Verdana, Arial, Helvetica, sans-serif;
		border:1px solid #d6e6f0;
		background:#000;
		color:#758795;
		padding:3px;
		} /* Comment form input boxes. */

			#commentform input:focus { 
			border:1px solid #758795;
			} /* When the "focus" is on a certain input box. Highlighting the border, for example. */

		#commentform textarea { 
		width:100%;
		} /* The textarea (comment box) part of the form. */

			#commentform textarea:focus {
			border:1px solid #758795;
			} /* When the "focus" is on the textarea. */

		#commentform #submit { } /* Comment form submit button. */

		p.allowed-tags {
		font-size:0.8em;
		color:#b5b5b5;
		} /* Allowed tags for comments. */
		

/* ---- SIDEBAR ---- */
/* The sidebar that will appear on every page if specified. */
/* See "functions.php" for other customization. */
	
#sidebar {
float:left;
width:170px;
padding: 0px;
font-size: 0.9em;
} /* The main wrapper for the sidebar elements. */

	#sidebar #searchform { } /* Search form in the sidebar. */
	
	#sidebar #searchform input {
	float:left;
	border: 1px solid #bebebd;
	background: #000000;
	color: #333;
	padding: 2px;
	font: 1.2em/1.5em Verdana, Arial, Helvetica, sans-serif; 
	margin:0 0 0 10px;
	} /* Search form input buttons (query & submit). */

	.widget {
	margin: 0 0 0px 0;
	} /* Wrapper for each individual sidebar widget. */
	
	h5.widget-title { 
	font: normal normal normal 1.2em/1.5em Georgia, Garamond, "Times New Roman", serif; 
	color:#000;
        background-color: #2076CF;
	padding: 6px 6px 6px 6px;
	} /* Title for each individual sidebar widget. */

	.widget ul {
	padding: 4px 6px 4px 6px;
	} /* Sidebar bulleted (unordered) lists. */
	
	.widget ul li { } /* Sidebar bulleted list elements. */
	
	/* Optional Widget Styles */
	#calendar_wrap { } /* Overall wrapper for calendar widget. */
	
		table#wp-calendar { } /* Table style for calendar widget. */
		
			table#wp-calendar caption { } /* Calendar caption, usually Month Year (January 2008) */

			table#wp-calendar thead { } /* Wrapper holding the calendar header titles. (M T W T F S S) */
			
				table#wp-calendar th { } /* Each individual day header title. */
			
			table#wp-calendar tbody { } /* Wrapper holding the calendar individual days. */
			
				table#wp-calendar tbody td { } /* Individual days. */
			
				table#wp-calendar td#today { } /* Today on the calendar. */

			table#wp-calendar tfoot { } /* Wrapper holding the calendar footer elements. */
			
				table#wp-calendar tfoot td#prev { } /* Previous month. */
				
				table#wp-calendar tfoot td#next { } /* Next month. */

	
/* ---- FOOTER ---- */
/* The footer that will appear on every page if specified. */

#footer {
background: #000;
width:400px;
margin: 0 0 0 70px;
}

	#footer p {
	width:100%;
	text-align:center;
	padding:8px 0;
	font-size:0.9em;
	}
	
	#footer a { color:#fff; }
	#footer a:hover { color:#2076CF 1px solid #fff; }