@font-face { font-family:League Gothic; src:url('type/League_Gothic.otf') format("opentype"); }


/* ----------------- Reset -----------------
----------------------------------------- */
* { margin:0; padding:0; }
a { color:#870707; text-decoration:none; }
a:hover { text-decoration:underline; }
a img { border:none; }
.clear { height:1px; line-height:1px; overflow:hidden; clear:both; }
p { margin-bottom:20px; }

::selection, ::-moz-selection { background-color:#fff666; }

/* ----------------- Typography -----------------
---------------------------------------------- */
h1, h2 { font-family: 'Open Sans', sans-serif; font-weight:700; color:#230f06; text-transform:none; }
h1 { font-size:24px; line-height:36px; }
h2 { font-size:18px; line-height:24px; }

/* ----------------- General Styles -----------------
-------------------------------------------------- */
.col-full { width:950px; margin:0 auto; }
.col-left {  }
.col-right { float:right; width:250px; }

.last-row { margin-bottom:0; }
.last-col { margin-right:0; }

/* ----------------- Main Elements -----------------
------------------------------------------------- */
body { font-family:Arial, Helvetica, sans serif; color:#555; background:#111 url(images/body-bg.jpg); }

#wrapper {  }

/* Header */
#header-wrapper {  }
#header-wrapper:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }
#header-wrapper { *zoom: 1; }

#header { position:relative; padding:20px 0; text-align:center; }
#header #logo { display:inline; font-family:League Gothic, sans-serif; font-weight:400;
	color:#eee; text-transform:uppercase; font-size:40px; text-shadow:-4px 4px 8px black;
	text-indent:-9999px; background:url(images/logo.png) no-repeat; height:50px; width:250px; display:block;
	margin:0 auto; }
	
#header .homepage { position:absolute; bottom:5px; right:5px; }

/* Nav Bar */
#nav-bar-wrapper { background-color:#111; width:100%; }
#nav-bar-wrapper:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }
#nav-bar-wrapper { *zoom: 1; }

#nav-bar-wrapper.fixed { position:fixed; top:0; left:0; z-index:9999; }

#nav-bar { position:relative; }

#nav-bar a { color:#aaa; font-size:14px; height:40px; padding:0 10px; font-weight:bold; text-transform:uppercase; text-decoration:none;
	height:40px; line-height:40px; }
#nav-bar a:hover { background-color:#000; color:#fff; }

#nav-bar .mobile { display:none; }
#nav-bar .homepage { position:absolute; right:5px; top:0; }

#nav { list-style-type:none; text-align:center; margin:0 auto; }
#nav li { position:relative; display:inline; }

#nav ul { display:none; position:absolute; top:28px; z-index:9999; background-color:#111; width:300px; }
#nav ul li { display:block; text-align:left; }


#social-icons { position:absolute; top:10px; right:0; display:none; }
#social-icons a { float:left; display:block; height:20px; width:20px; margin-left:4px;
	 }
#social-icons .facebook { background:url(images/social-facebook.png); }
#social-icons .twitter { background:url(images/social-twitter.png); }
#social-icons .rss { background:url(images/social-rss.png); }

/* Content */
#content-wrapper { background:white; padding:20px 0; border-bottom:5px solid #111; }
#content-wrapper:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }
#content-wrapper { *zoom: 1; }

#content { position:relative; font-size:16px; line-height:24px; text-align:center; }

/* Main */
#main { margin:0 auto; visibility: hidden; }

/* Sidebar */
#sidebar { margin:0px 0px 0 0; padding:0px; font-size:13px; }
#sidebar:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }
#sidebar { *zoom: 1; }

.sidebar-box { margin-bottom:20px; padding-bottom:20px; float:left; width:100%; }
.sidebar-box:last-child { margin-bottom:0; }

#sidebar ul { list-style-type:none; padding-left:0px; }
#sidebar li { padding:6px 8px; border-bottom:1px dotted #ccc; }

#sidebar h3 { font-size:16px; text-transform:uppercase; padding-bottom:5px; border-bottom:0px solid #CBD1D2; }

/* Footer */
#footer { padding:20px 20px 20px; text-align:center; font-size:12px; color:#ccc; }
#footer:after { content: "."; display:block; height:0; clear:both; visibility:hidden; }
#footer { *zoom: 1; }

#footer a { color:#eee; font-weight:bold; }

/* Infinite Scroll */
#infscr-loading { 
	text-align: center;
	z-index: 100;
	position: fixed;
	left: 45%;
	bottom: 120px;
	width: 200px;
	padding: 10px;
	background: #000; 
	opacity: 0.8;
	color: #FFF;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}

/* Category & Tag Info Bar */
.archive-info { margin:0 20px 10px; padding-bottom:10px; border-bottom:1px solid #ccc; text-align: center; }
.archive-info p { margin:0; padding:0; }

/* ----------------- Page Specific -----------------
------------------------------------------------- */

/* Artwork Thumbs */
.art-thumb { float:left; margin-bottom:0px; margin:10px; border:1px solid #ccc; position:relative; height:250px; overflow:hidden; }
.art-thumb .share { position:absolute; bottom:20px; left:5px; display:none; text-align:left; }

.art-info-wrapper { position:absolute; bottom:0; width:100%; background-color:#111; }
.art-info { font-size:11px; text-align:left; color:#aaa; padding:0 5px; }
.art-info a { color:#ddd; }

.post-meta { padding:10px 0; font-size:14px; }

.post-nav .next { float:right; }
.post-nav .previous { float:left; }

/* Mobile */
@media only screen and (max-width:500px)
{
	h1 { font-size:36px; }
	
	#header-wrapper { margin-top:40px; }
	
	#nav-bar-wrapper { position:fixed; top:0; }
	
	#content-wrapper { padding:10px 0; }
	
	#content { padding:0 0px; }
	.col-full { width:auto; }
	.col-left { width:auto; float:none; }
	.col-right { width:auto; float:none; }
	
	#main img { max-width:300px; height:auto; }
	
	#nav-bar { height:auto; }
	#nav-bar .mobile { display:inline-block; float:left; }
	
	#nav { display:none; clear:left; }
	#nav li { width:100%; border-top:1px solid #333; display:block; text-align:left; }

}
@media screen and (min-width:321px) and (max-width:768px)
{
	
	.col-full { width:auto; }
	.col-left { width:auto; float:none; }
	.col-right { width:auto; float:none; }
}
@media screen and (min-width:769px)
{

}

