/*
Theme Name: Asteroid
Theme URI: http://ronangelo.com/asteroid/
Description: Asteroid is a simple, clean and responsive theme. It incorporates various widget areas that make management of banners and ads a lot easier, especially for ad-supported sites.
Author: ronangelo
Author URI: http://ronangelo.com/
Version: 1.0.2
Tags: black, white, gray, two-columns, right-sidebar, fixed-width, custom-header, custom-background, featured-images, custom-menu, custom-colors, theme-options, threaded-comments, sticky-post, editor-style, full-width-template, threaded-comments

License: GNU General Public License, Version 3 or later
License URI: http://www.gnu.org/licenses/gpl.html
--------------------------------------------- */

/* RESET */
html,body,h1,h2,h3,h4,h5,h6,p,img,ul,ol,li,form,fieldset {
	border: 0 none;
	margin: 0;
	padding: 0;
	list-style: none;
}

.left {float:left;}
.right {float:right;}
.clear {clear:both;}

body {
	color: #333;
	font: normal 13px/20px arial, sans-serif;
	position: relative;
	background-attachment: fixed;
}

h1 {font-size:28px;}
h2 {font-size:24px;}
h3 {font-size:20px;}
h4 {font-size:18px;}
h5 {font-size:16px;}
h6 {font-size:14px;}
h1,h2,h3,h4,h5,h6{clear: both;}

p {font: normal 13px/20px arial, sans-serif;}

a {
	color: #0E4D7A;
	text-decoration: none;
}
a:hover {color: #f00;}

a, textarea, input, button {
	-moz-transition: all 0.14s ease-out; 
	-webkit-transition: all 0.14s ease-out; 
	-o-transition: all 0.14s ease-out;
	transition: all 0.14s ease-out;
}


/*-------------------------------------
   Main Containers
--------------------------------------*/
#container {
	width:960px;
	background: #FFF; 
	border: 8px solid #000;
	margin: 20px auto 30px;
	max-width: 96%;
	box-shadow: 0 0 10px #000;
}

#header {
	min-height: 120px;
	overflow: hidden;
}
	#header-info-wrap {
		float: left;
		margin-bottom: 8px;
	}
		#header-info-wrap hgroup {
			margin-top: 18px;
			margin-left: 10px
		}
			#site-title {
				font-size:44px;  
				text-shadow: 0 2px 2px #000;
			}
			#site-title a {color: #FFA900; line-height: 1;}
			#site-title a:hover {color: #F00;}

			#site-description {
				font-size: 16px;
				font-weight: bold;
				margin-top: 6px;
			}

#main {
	background: #FFF; 
	overflow: hidden;
	width: 100%;
}
	#content {
		display: table-cell; 
		vertical-align: top;
		width: 620px;
		padding: 0 10px 20px;
		border-right: 1px solid #555;
	}
		#bottom-navi {
			border-top: 1px solid #AAA;
			padding-top: 16px;
			padding-bottom: 6px;
			margin-top: 16px;
		}

	#content-nosidebar {
		padding: 0 10px 20px;
	}

	#sidebar {
		display: table-cell; 
		vertical-align: top;
		width: 310px;
		padding: 0 5px 20px;
	}

#footer {
	background: url("images/bg-footer.png") #333;
	border-top: 1px solid #000;
}
	#footer-area {
		overflow: hidden;
		min-height: 20px; 
		box-shadow: 0 1px 2px #000 inset;
	}
	#footer-bottom {
		overflow: auto;
		background: #000; 
		min-height: 10px; 
		padding: 6px; 
	}
		#footer-links {
			float: left; 
			color: #CCC;
		}
		
		#theme-credit {
			color: #BBB;
			float: right;
			font: bold 12px verdana,sans-serif;
			margin-top: 4px;
		}

		
/*-------------------------------------
   The Main Menu
--------------------------------------*/
#nav {
	background-color: #333;
	border-top: 1px solid #000;
	border-bottom: 1px solid #000;
	float: left;
	width: 100%;
	z-index: 20;
}

#nav .menu {
	float: left;
	border-right: 1px solid #555;
}

#nav .menu > li:first-child {
	border-left: none;
}

#nav .menu li {
	float:left;
	position: relative;
}

#nav .menu > li {
	border-right: 1px solid #000;
	border-left: 1px solid #555;
}

#nav .menu > li > a {
	min-width: 70px; 
	text-align: center;
}

#nav .menu  li  a {
	display: block;
	padding: 8px 14px;
	font: bold 16px arial, sans-serif;
	color: #FFF;
	text-shadow: 0 2px 2px #000;
}
#nav .menu  li  a:hover {
	background-color: #FFF;
	color: #000;
	text-shadow:  none;
}

#nav .menu > .parent-menu-item > a:after {
    content: url("images/arrow-down-w.png");
	padding-left: 6px;
}
#nav .menu > .parent-menu-item > a:hover:after {
    content: url("images/arrow-down-b.png");
}

#nav .sub-menu {
	width: 170px;
	background-color: #292929;
	border: 1px solid #000;
	position: absolute;
	z-index: 30;
	display: none;	/* initial hide */
	box-shadow: 0 1px 4px #000;
}

#nav .sub-menu li {
	border-top: 1px solid #3C3C3C;
	border-bottom: 1px solid #000; 
}
#nav .sub-menu li:first-child {border-top: none;}
#nav .sub-menu li:last-child {border-bottom: none;}

#nav .sub-menu li a {
	float: left;
	width: 142px;
	padding: 10px 14px;
	font: 13px arial, sans-serif;
	text-shadow: 0 1px 1px #000;
	color: #FFF;
}

#nav .sub-menu li a:hover {
	background-color: #FFF;
	color: #000;
	text-shadow:  none;
}

#nav .sub-menu li .sub-menu {margin-top: -1px;}

#nav .sub-menu > .parent-menu-item > a {
    background-image: url("images/arrow-right-w.png");
	background-repeat: no-repeat;
	background-position: 98% center;
}
#nav .sub-menu > .parent-menu-item > a:hover {
    background-image: url("images/arrow-right-b.png");
}

/* Display Sub-Menus */
#nav li:hover > ul { display: inline;}	

/* Highlight Selected Items */
#nav .current-menu-item > a,
#nav .current-menu-ancestor > a,
#nav .current_page_ancestor > a,
#nav .current_page_item  > a {
	background: #FF1818;
    color: #FFF;
    text-shadow: 0 2px 2px #000;	
}

/* Default WP Menu - Pages */
#nav li > ul > li:hover .children {top: -1px;}
#nav .menu > ul > .page_item {
	border-top: 1px solid #222;
	border-bottom: 1px solid #000;
	border-right: 1px solid #000;
	border-left: 1px solid #555;
}
#nav .children {
	width: 160px;
	background: #333;
	position: absolute;
	z-index: 30;
	display: none;
	border-bottom: 1px solid #000;
	border-left: 1px solid #000;
	border-right: 1px solid #000;
}
#nav .children li {border-top: 1px solid #000;}
#nav .children li a {
	float: left;
	width: 140px;
	padding: 9px 10px;
}


/* menu search form */
#nav-search {
	display: inline-block;
	float: right;
	margin: 6px 20px 4px 10px;
}
#nav .ast-search{
	background: none;
    margin: 0;
    padding: 0;
    width: auto;
	box-shadow: none;
	overflow: hidden;
}
#nav .ast-search-input{
	color: #666;
	border: 1px solid #222;
	width: 150px;
	padding: 2px;
	margin-top: 1px;
}
#nav .ast-search-submit {
    background: url("images/find.png") no-repeat transparent;
	height: 22px;
	width: 22px;
    border: none; 
	cursor: pointer;
	margin: 0 2px;
	color: transparent;
}


/*-------------------------------------
   Widgets
--------------------------------------*/
#widgets-wrap-sidebar  a {color: #0E4D7A;}
#widgets-wrap-sidebar  a:hover {color: #FF0000;}
.widget-sidebar {margin-top: 20px; margin-bottom: 20px; position: relative;}
.widget-sidebar ul {padding: 0 14px; list-style: none;}
.widget-sidebar li {border-bottom: 1px solid #CFCFCF;padding: 4px 0 2px;}
.widget-sidebar h4 {background:#CCC; padding: 3px 0 3px 8px; margin-bottom: 4px; font-size: 16px; border:1px solid #999;}
.widget-sidebar img {
    display: block;
    margin: 10px auto !important;
}
#widgets-wrap-footer {
	overflow: hidden;
	padding-bottom: 10px;
	color: #FFF;
}
.widget-footer {	
    float: left;
    margin-top: 10px;
	margin-left: 8px;
	margin-bottom: 6px;
	width: 230px;
}
.widget-footer h4 {	
	background: #222;
    border: 1px solid #000;
    border-radius: 6px;
    color: #FFF;
    font-size: 16px;
    padding: 3px 6px 3px 8px;
    text-shadow: 2px 2px 2px #000;
}
.widget-footer ul {padding: 4px 8px 6px;}
.widget-footer li {padding: 2px 0 2px;}
.widget-footer a {color: #FC9A08; text-shadow: 2px 2px 2px #000;}


/*-------------------------------------
   Custom Widgets
--------------------------------------*/
#widgets-wrap-header {
	float: right; 
	margin-top: 10px; 
	margin-right: 10px;
}

#widgets-wrap-below-menu {
	background: url("images/bg-footer.png");
	padding: 4px 4px 0;
	clear: both;
	box-shadow: 0 -1px 2px #000 inset;
	overflow: hidden;
}
.widget-below-menu {display: inline-block;}

#widgets-wrap-before-post, #widgets-wrap-before-page {
	overflow: hidden;
	border-top: 1px solid #999;
	margin: 10px auto 0;
    padding-top: 10px;
}
#widgets-wrap-before-post-content, #widgets-wrap-before-page-content {
	overflow: hidden;
	margin: 0 6px 6px;
}
#widgets-wrap-after-post-content, #widgets-wrap-after-page-content {
	overflow: hidden;
	margin: 6px;
}
#widgets-wrap-after-post, #widgets-wrap-after-page {
	overflow: hidden;
	border-top: 1px solid #999;
    padding-top: 10px;
}


/*-------------------------------------
   Specific Widget Stylings
--------------------------------------*/
#wp-calendar {
    border-collapse: collapse;
	text-align: center;
	width: 90%;
	margin: 0 auto;
}
#wp-calendar caption {padding: 6px;}
#wp-calendar th {
	background: #DDD;
    border: 1px solid #666;
    padding: 4px;
}
#wp-calendar tr {background: #FFF;}
#wp-calendar td {
	border: 1px solid #666;
    padding: 4px;
}
#footer #wp-calendar a {
	color: #0E4D7A;
	text-shadow: none;
}
#footer #wp-calendar caption {
	color: #fff;
}

.tagcloud {padding: 0 14px;}

.widget_pages .children li {border-bottom: none;}


/*-------------------------------------
   Looped
--------------------------------------*/

.loop-post-wrap {
	background: #DDD;
    border: 1px solid #666;
	box-shadow: 0 0 3px #333;
    margin-top: 20px;
    padding: 8px;
}

.sticky .loop-post-wrap {
	background: #FCFF82;
    border: 1px solid #101010;
}

.loop-title {margin-bottom: 2px; line-height: 1; display: inline;}
.loop-title a {color: #222; text-shadow: 0 1px 1px #666; font: bold 24px arial, sans-serif;}
.loop-title a:hover {color: #F00;}

.loop-date {
    background: rgba(0, 0, 0, 0.15);
    border: 1px solid #999;
    float: right;
    margin-top: 2px;
    padding: 0 8px;
}

.loop-categories {margin: 6px auto;}
.loop-categories a {
	background: rgba(0, 0, 0, 0.15);
	border: 1px solid #999;
	padding: 1px 4px;
	border-radius: 4px;
	color: #444;
}
.loop-categories a:hover {color: #F00;}

.loop-entry {
	overflow: hidden; 
	margin-top: 6px; 
}

.post-thumbnail { 
	overflow: hidden; 
	float: left; 
	border: 1px solid #666; 
	margin-right: 8px;
	width: 120px;
	height: 120px;
}
.post-thumbnail img { float: left; }

.excerpt-text p {
	margin-bottom: 0 !important;
	margin-top: 0 !important;
}

.read-more {overflow: hidden;}
.read-more-button {	
	background: #444;
    border: 1px solid #111;
    border-radius: 4px;
    box-shadow: 0 0 2px #000;
    color: #FFF;
    float: right;
    font-weight: bold;
    padding: 2px 12px;
	margin: 0 4px 4px 0;
}
.read-more-button:hover {
	background: #2572ED; 
	color: #FFF; 
	box-shadow: 0px 0px 3px #000; 
	text-shadow: 0 1px 1px #333;
}

.loop-tags {margin: 4px 0;}


/*-------------------------------------
   Single
--------------------------------------*/

.post-edit-link {   
    background: #F9F972;
    border: 1px solid #111;
    color: #222;
    float: right;
    padding: 2px 6px;
}

.single-wrap {
	margin-top: 10px; 
	padding: 6px 0; 
	border-bottom: 1px solid #999;
}

.single-title {display: inline; font-weight: normal;}
.single-title a {text-shadow: 0 1px 1px #000; color: #333; line-height: 1.2;}
.single-title a:hover {color: #F00;}

.single-top-meta {
	overflow: hidden; 
	font-size: 13px; 
	margin-bottom: 10px;
}
.single-date {
	background: #DDD;
    border: 1px solid #999;
    float: right;
	padding: 0 6px;
	margin-left: 6px;
}
.single-author {    
	background: #DDD;
    border: 1px solid #999;
    float: right;
    padding: 0 6px;
	margin-left: 6px;
}

.single-entry {
	margin: 6px 0 10px; 
	padding-left: 6px; 
	padding-top:8px; 
	border-top: 1px solid #999;
	overflow: hidden; 
}

.page-links {
	margin-top: 6px;
	text-align: center; 
	font-weight: bold; 
	padding: 2px;
}
.page-links  > div > * {
	border: 1px solid #666; 
	padding: 2px 6px; 
	margin-left: 2px;
	background: #FFF;
}
.single-wrap .updated {color: #666; font-size: 11px;}

.next-previous-attachment {
	overflow: hidden;
}

.next-previous-post {
	overflow: hidden;
	margin: 14px 0;
	padding: 0 10px;
}

.single-tags {margin: 4px 0;}

.sitemap-template {padding-left: 30px; padding-bottom: 30px;}


/*-------------------------------------
   Post, Page and Comment Elements
--------------------------------------*/
.loop-entry p, .single-entry p, .comment-body p { 
	margin-top: 4px; 
	margin-bottom: 14px; 
}

.loop-entry h1, .loop-entry h2, .loop-entry h3, 
.loop-entry h4, .loop-entry h5, .loop-entry h6, 
.single-wrap h1, .single-wrap h2, .single-wrap h3, 
.single-wrap h4, .single-wrap h5, .single-wrap h6, 
.comment-body h1, .comment-body h2, .comment-body h3, 
.comment-body h4, .comment-body h5, .comment-body h6 {
	line-height: 1.2; 
	color: #333;
	text-shadow: 0 1px 1px #999;
	font-weight: normal;
	margin-bottom: 4px;
    margin-top: 16px;
}

.single-entry, .single-entry p {
	font-family: arial, sans-serif;
	font-size: 14px;
	line-height: 21px;
}

blockquote {
	background: #E0E0E0;
    border-left: 6px solid #666;
	clear: both;
    margin: 10px;
    padding: 8px 12px;
	overflow: hidden;
}
blockquote p {
	font-style: italic;
	margin: 0 !important;
}
blockquote cite {float: right; margin: 6px auto 2px;}

blockquote cite:before {
    content: "- ";
}

.single-wrap table, .comment-body table {
    border: 1px solid #333;
    border-collapse: collapse;
	margin: 10px;
}
.single-wrap table th, .comment-body table th {border: 1px solid #666; padding: 4px; background: #DDD;}
.single-wrap table td, .comment-body table td {border: 1px solid #666; padding: 4px;}

.single-wrap p img { margin: 8px; }

.alignleft {display:inline; float:left; margin: 4px 10px 12px 0 !important;}
.alignright {display:inline; float:right; margin: 4px 0 12px 10px !important;}
.aligncenter {display:block; margin:8px auto !important;}
.alignnone {margin-top: 8px; margin-bottom: 8px;}

.single-entry dl, .comment-body dl {margin-left: 20px;}
.single-entry dt, .comment-body dt {margin-top: 10px; font-weight: bold;} 
.single-entry dd, .comment-body dd {margin-top: 2px; margin-bottom: 6px;}

.wp-caption {
	text-align:center; 
	padding: 4px 0; 
	background: #EEE;
	border: 1px solid #CCC;
}

.wp-caption-text, .gallery-caption {
	font-size: 12px !important; 
	margin: 0 !important;
	color: #555;
}

.gallery .gallery-item {
	margin-left: 0;
	margin-right: 0;
	margin-bottom: 0;
}
.gallery img {
    border: 1px solid #CCC !important;
    padding: 4px;
}
.gallery img:hover {
	border: 1px solid #AAA !important;
	background: #DDD;
}

.single-wrap ul, .comment-body ul {margin:8px 0px 8px 28px;}
.single-wrap ul li, .comment-body ul li {list-style-type: disc; list-style-position: inside; margin: 4px 0;}

.single-wrap ol, .comment-body ol {margin:8px 0px 8px 28px;}
.single-wrap ol li, .comment-body ol li {list-style-type: decimal; list-style-position: inside;}
.single-wrap ol li ol li, .comment-body ol li ol li {list-style-type: lower-alpha;}
.single-wrap ol li ol li ol li, .comment-body ol li ol li ol li{list-style-type: lower-roman;}

.wp-smiley {border: none !important; margin: 0 !important;}


/*-------------------------------------
   Comments
--------------------------------------*/
#comments-wrap {margin-top: 20px; margin-bottom:20px; padding-top: 10px;}

#comments-wrap .bypostauthor .comment-body, #comments-wrap .comment-author-admin .comment-body {
	border-color: #034196 #666 #666;
    border-style: solid;
    border-width: 6px 1px 1px;
}
#comments-wrap .comment-body {
	background: #FEFDAD;
	margin: 8px 0;
	padding: 8px; 
	border-top: 6px solid #555;
	box-shadow: 0 1px 3px #111;
}
#comments-wrap .comment-body .says {margin-left: 8px;}
#comments-wrap .comment-body p {clear: both;}

#comments-wrap .avatar {vertical-align:middle; margin-right:2px; padding:2px; border:1px solid #ddd;}
#comments-wrap .comment-author {margin-bottom: 10px; float: left;}
#comments-wrap .comment-author cite {font-size: 14px; font-weight:bold; font-style:normal;}
#comments-wrap .comment-meta {margin-bottom:6px; float: right;}
#comments-wrap .reply {margin: 12px auto 0; overflow: hidden;}
#comments-wrap .reply a {
	background: #FFF;
    border: 1px solid #333;
    font-size: 12px;
    font-weight: bold;
	padding: 0 10px;
	float: right;
	margin-bottom: 2px;
	margin-right: 2px;
	box-shadow: 1px 1px 2px #333;
}
#comments-wrap .children {margin: 8px 0 0 30px;}

#comments-wrap .pagination {text-align: center; margin: 20px auto;}
#comments-wrap .pagination > * {padding: 3px 8px; border: 1px solid #AAA;}

#respond {
	background: #C5C5C5;
    border: 1px solid #333;
    margin: 4px 0;
    padding: 16px 20px 14px;
}
#respond h3 {
	margin-bottom:10px;
	font-size: 14px;
	text-transform: uppercase;
}
#respond label {display:block;}
#respond .required {display:none;}
#respond #closed {font-style:italic;}

#cancel-comment-reply-link {
	margin-left: 20px;
	background: #DDD;
	padding: 2px 6px;
	box-shadow: 0 0 2px #000;
	float: right;
	font: normal 11px arial, sans-serif !important;
	text-transform: uppercase;
}
#cancel-comment-reply-link:hover {box-shadow: 0 0 3px #000;}
#commentform textarea {
    padding: 10px;
    width: 96%;
}
#commentform #submit {
	font-size: 14px;
	padding: 6px 10px;
	margin-top: 6px;
}

/*-------------------------------------
   Searchform
--------------------------------------*/
.ast-search{
	background: #D0C776;
    margin: 20px auto;
    padding: 10px;
    width: 220px;
	box-shadow: 0 0 2px #000;
	overflow: hidden;
}
.ast-search-input {
	display: inline-block;
	float: left;
	width: 148px;
}
.ast-search-submit {
	display: inline-block;
	float: left;
	width: 60px;
	margin-left: 6px;
}

/*-------------------------------------
   404 Page
--------------------------------------*/
.not-found-wrap {
	background: #FFFE74;
	margin: 40px auto; 
	width: 420px;
	height: 200px;
	border: 1px solid #222;
	box-shadow: 0 0 2px #000;
	text-align: center;
}
.not-found-wrap h2 {
    background: #222;
    color: #FFF;
    padding: 16px;  
}
.not-found-wrap p {
	margin: 20px auto 24px;
	color: #333;
	font-size: 14px;
}


/*-------------------------------------
   Responsive Properties
--------------------------------------*/
@media screen and (max-width:900px){	
	#nav-search { float: left !important;}
	.menu > li {border-bottom: 1px solid #222 !important;}
}

@media screen and (max-width:800px){
	#content { border-right: none !important; width: 84% !important; }	
	#sidebar { float: left !important; width: 98% !important; }
}

@media screen and (max-width:768px){
	#header-info-wrap img {max-width: 96% !important; height: auto !important;}
	.single-entry img {max-width: 96% !important; height: auto !important;}
	.wp-caption {max-width: 96% !important; width: auto !important;}
	.aligncenter {display: table !important;}
}

@media screen and (max-width:480px){
	#header { height: auto !important; }
	#header-info-wrap {
		float: none !important;
		position: relative !important;
		margin-left: auto !important; 
		margin-right: auto!important;
		text-align: center !important;
	}
	/* Make menu width 100% */
	.menu {float: none !important; border: none !important;}
	.menu > li {
		float: none !important;
		border-top: 1px solid #222 !important;
		border-bottom: 1px solid #000 !important;
		border-left: none !important;
		border-right: none !important;
	}
	#nav-search {width: 96% !important;}
	#nav .ast-search-input {width: 84% !important;}
	#nav .ast-search-submit {float: left !important;}
	.loop-date {float: none !important;}
	#comments-wrap {max-width: 98% !important;}
	.not-found-wrap {width: auto !important; max-width: 96% !important;}
}

@media screen and (max-width:320px){
	.post-thumbnail {display: none !important;}
}