/*
Theme Name: Euforia
Description: Dark background theme with transparent blocks that encapsulates articles/posts/pages for mobile.
Author: Jayvin Duong
Author URI: http://mobile.sheridanc.on.ca/~duongja/
Version: 1.0
Tags: black, blue, white, light, one-column, flexible-width, custom-menu, featured-images, microformats, sticky-post, threaded-comments, translation-ready
License: GNU General Public License
License URI: https://www.gnu.org/licenses/gpl.html

*/


/* =Reset
-------------------------------------------------------------- */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{font-size:100%;font:inherit;padding:0;border:0;margin:0;vertical-align:baseline}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}.clear{clear:both}.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}


/* =Structure
-------------------------------------------------------------- */

body {
	background: #121212;
	color: #ABABAB;
	font-family: "Segoe UI Light", "Segoe UI", "Arial", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-weight: lighter;
	line-height: 1.25rem;
}

a:hover 					{ color: #F3E761; }
i, em, abbr, cite, q 		{ font-style: italic; }
code, kbd, tt, var 			{ color: #BBB; }
del, strike 				{ text-decoration: line-through; }
acronym 					{ text-transform: uppercase; }
sup 						{ bottom: 1ex; }
sub 						{ top: .5ex; }
ins 						{ text-decoration: none; }

b, strong {
	font-weight: bold;
	color: #CCCCCC;
}

sup,
sub {
	height: 0;
	line-height: 1;
	vertical-align: baseline;
	position: relative;
	font-size: 0.7rem;
}

a {
	color: #F07830;
	text-decoration: none;	
}

#wrapper {
	width: 100%;
	margin: 0 auto;
}


/* =Links
-------------------------------------------------------------- */

a {
	color: #F07830;
	text-decoration: none;	
}

a:hover 								{ color: #F3E761; }


/* =Videos
-------------------------------------------------------------- */

video									{ height: auto; }

iframe, 
video {
	display: block;
	width: 100%;
	margin: 0;
	padding: 0;		
}


/* =Headings
-------------------------------------------------------------- */

h1, h2, h3, h4, h5, h6 					{ color: #FFFFFF; }
h1 										{ font-size: 1.5rem; }
h2 										{ font-size: 1.5rem; }
h3 										{ font-size: 1.4rem; }
h1.page-title 							{ font-size: 1.5rem; margin-bottom: 20px; }


/* =Forms
-------------------------------------------------------------- */

input {
	background: url(../images/bg_forms.png);
	border: none;
	padding: 5px;
	color: #B6B6B6;
	outline: none;
}

label 									{ display: none; }


/* =Wpadminbar
-------------------------------------------------------------- */

#wpadminbar 							{ display: none; }


/* =Header
-------------------------------------------------------------- */

header {
	background-image: linear-gradient(bottom, #000000 0%, #444 100%);
	background-image: -o-linear-gradient(bottom, #000000 0%, #444 100%);
	background-image: -moz-linear-gradient(bottom, #000000 0%, #444 100%);
	background-image: -webkit-linear-gradient(bottom, #000000 0%, #444 100%);
	background-image: -ms-linear-gradient(bottom, #000000 0%, #444 100%);
	padding: 10px 0;
	text-align: center;
	width: 100%;
}

#site-title								{ font-size: 1.5rem; }
#branding #site-description 			{ display: none; }


/* =Navigation
-------------------------------------------------------------- */

nav {
	background: #111;
	padding: 10px 10px 10px 5px;
	position: fixed;
	bottom: 0px;
	width: 100%;
}

nav div.menu li {
	border-bottom: 1px #555 solid;
	font-size: 1.2rem;
	display: block;
	padding: 10px 0;
}

#nav {
	display: none;
	padding: 0;
	top: 0;
}

#nav ul.children {
	margin: 10px 0 0 0;
	padding: 0;
}

#nav ul.children li {
	border-top: 2px #444 dotted;
	border-bottom: none;
	font-size: 1.2rem;
	display: block;
	margin-bottom: -10px;
}

#mobile-nav {
	background-image: linear-gradient(bottom, #000000 0%, #444 100%);
	background-image: -o-linear-gradient(bottom, #000000 0%, #444 100%);
	background-image: -moz-linear-gradient(bottom, #000000 0%, #444 100%);
	background-image: -webkit-linear-gradient(bottom, #000000 0%, #444 100%);
	background-image: -ms-linear-gradient(bottom, #000000 0%, #444 100%);
	border-top: 1px solid #111;
	display: block;
}

#mobile-nav button {
	background: none;
	border: none;
	color: #F07830;
	font-family: "Segoe UI Light", "Segoe UI", "Arial", "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	font-weight: lighter;
	font-size: 1.2rem;
	text-decoration: none;		
	width: 100%;
	height: 100%;
}


/* =Content
-------------------------------------------------------------- */

#content 								{ margin-bottom: 70px; }
#content #nav-above 					{ display: none; }
div.entry-content img 					{ margin: 10px 0 10px 0; }
div.entry-content p 					{ margin: 15px 0 15px 0; }
div.entry-content span.subtitle 		{ font-size: 0.8rem; }

#content ul li 							{ list-style: square; }
#content ol li 							{ list-style: decimal; }

#content ul,
#content ol	{ 
	margin: 10px 0 10px 20px;
}

#content {
	float: left;
	height: inherit;
	margin-top: 20px;
	margin-bottom: 70px;
	overflow: hidden;
	width: 100%;
}

#content #nav-below {
	display: block;
	padding-top: 15px;
	text-align: center;
}

#content div.entry-footer, .edit-link {
	margin: 20px 0 10px 0;
	font-size: 0.8rem;	
}


/* =Post/Pages
-------------------------------------------------------------- */

div.entry-content p 									{ margin: 15px 0 15px 0; }
div.entry-content span.subtitle 						{ font-size: 0.8rem; }
div.entry-content img 									{ margin: 10px 6px 10px 0; }
div.entry-content h1 									{ font-size: 1.5rem; }
div.entry-content h2 									{ font-size: 1.3rem; }
div.entry-content h3 									{ font-size: 1.2rem; }
div.entry-content h4 									{ font-size: 1.1rem; }
div.entry-content h5 									{ font-size: 1.05rem; }
div.entry-content h6 									{ font-size: 1.0rem; }
div.entry-content th 									{ text-align: left; }
div.entry-content dd 									{ margin-bottom: 10px; }

#content div.post,
#content div.page {
	border-bottom: 1px #555 solid;
	padding: 10px;
}

#content .entry-title {
	font-size: 1.5rem;	
	padding-bottom: 10px;
}

#content div.entry-meta {
	margin: 10px 0 10px 0;
	font-size: 0.75rem;
}

div.entry-content h1,
div.entry-content h2,
div.entry-content h3,
div.entry-content h4,
div.entry-content h5,
div.entry-content h6 {
	margin-bottom: 5px;
}

div.entry-content iframe, 
div.entry-content video {
	width: 100%;
}

div.entry-content img {
	width: 70%;
	display: block;
	height: auto;
	margin: 10px 0;
}

div.entry-content table,
div.entry-content dl {
	margin: 10px 0;
}

div.entry-content th,
div.entry-content td {
	padding: 2px;
}


/* =Comments
-------------------------------------------------------------- */

#comments {
	background: #1F1F1F;
	padding: 20px 15px;
}

#comments #comments-list ul,
#comments #comments-list li {
	height: auto;
	list-style: none; 
	margin: 10px 0;
}

#comments #comments-list ul.children #comment-post {
	background: #333;
	margin: 10px 15px;
	padding: 5px;
}

/* Comments form */
#comments .logged-in-as,
#comments .comment-notes,
#comments .form-allowed-tags 							{ font-size: 0.75rem; }
#comments #respond label 								{ display: block; }

#comments #respond #respond {
	border-top: 1px #555 solid;
	padding-top: 15px;
}

#comments #respond textarea {
	background: #555;
	border: none;
	color: #B6B6B6;
	outline: none;
	padding: 5px;
}


/* =Sidebar
-------------------------------------------------------------- */

#sidebar												{ display: none; }


/* =Search Bar
-------------------------------------------------------------- */

#searchform {
	background: url(../images/bg_forms.png);
}

#search-inputs input[type=text] {
	margin: 2px;
	background: none;
}

#search-inputs input[type=submit],
#searchsubmit {
	background: url(../images/search.png) no-repeat;
	float: right;
	width: 26px;
	height: 26px;
	margin: 1px 12px 1px 0;
	text-indent: -999em;
}


/* =Footer
-------------------------------------------------------------- */

footer 								{ display: none; }