/*
Theme Name: The Best Theme That Ever Existed
Theme URI: http://frumph.net
Template: comicpress
Description: I looked up into the sky and dreamed of the perfect theme. Thank god, Kevin answered my prayers.
Author: Kevin the Dangerously Handsome
Author URI: http://thekevinwilson.com
Version: 1.0
.
The CSS, XHTML and design is released under GPL v3:
http://www.opensource.org/licenses/gpl-3.0.html
.

NOTE: When writing CSS in the Child Theme, you put the CHANGES only, not the entire CSS.  
*/

@import url("../comicpress/style.css");

/* STYLES FOR MILES  */

	a,
	a:link,
	#wp-calendar a {
		color: #48abca;
		text-decoration: underline;
	}



	/* TYPOGRAPHY */

	.menu ul li a:link, .menu ul li a:visited {
		color: #fff;
	}

	.menu ul li a:hover {
		background: #414141 none repeat scroll 0 0;
		color: #86d2e9;
	}

	body {
		color: #333333;
		font-family: Century Gothic,sans-serif;
		font-size: 15px;
	}

	.sidebar h2, .sidebar h2 a, #sidebar-comicleft h2 {
		display: block;
		font-size: 18px;
		margin: 0;
		padding: 0;
	}

	h2, h2 a {
		font-size: 24px;
		letter-spacing: -1px;
		line-height: 24px;
		margin: 0;
		padding: 0 0 2px;
	}

	.copyright-info {
		font-size: 12px;
		padding-top: 1.3%;
		margin-right: 0;
	}
	
	.menu ul li.current-menu-item a {
		color: #86d2e9;
	}
	

	h2.pagetitle, h2.pagetitle a, h2.page-title, h2.page-title a {
		clear: both;
		font-size: 28px;
		letter-spacing: -2px;
		margin-top: 10px;
		padding: 0 0 5px;
		text-transform: capitalize;
	}


	/* Desktop */

	@media (min-width: 784px)
	{

	
		#header {
			background: rgba(0, 0, 0, 0) url("http://ohumanstar.com/wordpress/wp-content/uploads/2014/04/SMALL-NEW-header-AL.jpg") no-repeat scroll center top;
			height: 23.6vw;
			overflow: hidden;
			width: 1000px;
			background-size: 100% auto;
			margin: 0 auto;
		}

		#content-wrapper {
			background: #ffffff none repeat scroll 0 0;
			margin: 0 auto;
			width: 100%;
		}

		#header h1 a {
			display: none;
		}

		#header .description {
			display: none;
		}
		
		body {
			background-attachment: scroll;
			background-color: #86d2e9;
			background-image: url("http://ohumanstar.com/wordpress/wp-content/uploads/2014/04/repeatx.png");
			background-position: center -6em;
			background-repeat: repeat-x;
			background-size: 1em 31em;
		}

		#sidebar-left {
			float: left;
			text-align: center;
			width: 22%;
		}

		body.layout-2clw #content-column, 
		body.layout-2crw #content-column {
			width: 75%;
		}

		#content {
			width: 91%;
		}

		.sidebar, #sidebar-left-of-comic {
			font-size: 12px;
			overflow: hidden;
			padding: 5px;
		}

		div#sidebar-left-of-comic {
			text-align: center;
			width: 220px;
		}

		#menubar-wrapper {
			background: #333333 none repeat scroll 0 0;
			clear: both;
			display: block;
			margin: 0 auto;
			text-transform: uppercase;
			width: 100%;
			font-size: 14px;
		}

		#page {
			margin: 0 auto;
			width: 80%;
		}

		.page-template-cast .entry p {
			padding-bottom: 1.1em;
		}

		#page-wrap {
			padding: 0;
		}

		/* NAV */

		.menu ul li a {
			display: block;
			padding: 5px 10px;
			text-decoration: none;
		}
		
		.menunav {
			float: none;
			padding: 5px 0;
		}
		
		a.menunav-rss {
			margin: 0;
			color: #fff;
		}
		
		.comment-link {
		font-size: 1em;
		}

	}

	
	/* Mobile - General */

	@media (max-width: 783px) {	
	
			#menubar-wrapper {
				background-color: #414141;
			}
			
			#sidebar-right .sidebar, 
			#sidebar-left .sidebar {
				display: none;
			}
			
			#page {
				width: 90%;
			}
			
			#content,
			body.layout-2clw #content-column, 
			body.layout-2crw #content-column {
				width: 100%;
				margin: 0 auto;
			}
			
			#content-wrapper {
				background: #ffffff none repeat scroll 0 0;
			}
			
			.copyright-info {
				width: 70%;
				margin: 0 auto;
			}
			
			body {
				background-color: #86d2e9;
				font-size: 13px;
			}

			#sidebar-left-of-comic {
				float: left;
				clear: both;
				width: 100%;
			}
			
			.header-info a {
				color: #414141;
				font-size: 13vw;
			}
		
			#header .description {
				margin-left: 0;
				padding-top: 3%;
			}
			
			#header {
				text-align: center;
				background-size: 100% 100%;
			}
		
	}
