/* @override 
	http://danielkoskinen.com/wp-content/themes/dani5/css/basic.css
*/

/*
 Dani in HTML5 CSS File

*/

body {
 	text-align:center;  
	background-color:#aaa;
}

#wrap, header
{ 
	text-align:left;
	position:relative;
 	width: 37.5em;
 	max-width: 95%;
	min-width: 550px;
	margin: 20px auto;
/*	background-color: #fff;
*/}

.group:after {
		visibility: hidden;
		display: block;
		font-size: 0;
		content: " ";
		clear: both;
		height: 0;
		}
* html .group { zoom: 1; } /* IE6 */
*:first-child+html .group { zoom: 1; } /* IE7 */

header, article, #sidebar, #content, #comments-box {
	display: block;
	position: relative;
	padding: 1.5em 0;
	margin-bottom: 1.5em;
}

header {
	background-color: #101823;
}

header #site-title, header #second-title {
 	font-size: 1.5em; line-height: 1; 
}

header #site-title {
	float: left;
	margin-left: -0.67em;
	text-transform: uppercase;
	background-color: #ccc;
}

header #second-title {
	display: block;
	float: right;
	text-align: left;
	width: 60%;
	padding: 0.75em 1em 0 0;
	color: #1A5E8D;
}

header #subscribe {
	display: block;
	float: right;
	text-align: left;
	width: 60%;
	color: #78848d;
	margin-bottom: 0;
	padding: 0 1.25em;
}

#subscribe a {
	color: #aaa;
}

header #page-title {
	display: block;
	float: right;
	text-align: left;
	width: 60%;
	color: #DADAD9;
	margin-bottom: 0;
	padding: 0.25em 0.75em 0.25em 0;
	font-size: 2em;
}

header #site-title a {
	color: white;
	display: block;
	padding: 0.75em;
	background-color: #1A5E8D;
	width: 7.2em;
	border: none;
}

header #site-title a:hover {
	color: white;
	text-shadow: 0px 0px 10px white;
	border: none;
}

header #site-title a span {
}

header .tweet {
	position: absolute;
	width: 11em;
	right: -12em;
	color: #888;
	top: 0;

}

header .tweet ul {
	list-style: none;
	margin: 0;
}

header .tweet li {

}

article, #content {
	background-color: #ccc;
/*	background-color: rgba(255, 255, 255, 0.5);
*/}

article:first-child {
	background-color: white;
}

article .entry-date {
	float: left;
	margin-left: -0.5em;
	padding: 0 0.5em 0.5em 0.5em;
	background-color: #666;
	max-width: 2.75em;
/* 	text-align: center; */
	color: white;
	font-size: 2em;
	line-height: 1.5;
	word-spacing: -0.2em;
}

h2#comments {
	float: left;
	top: 1.5em;
	margin-left: -1.25em;
	padding: 0.5em;
	background-color: #ccc;
	width: 8.5em;
	text-align: left;
	color: white;
}

#comments-box p {
	clear: both;
}

article .month {
		font-size: 0.75em;
        color: #ccc
}

article .day, article .month, article .year {
}

article .year {
		display: block;
        color: #666;
        clear: both;
        line-height: 0.25;
        font-size: 0.5em;
}

article section {
	margin: 0 1.5em 1.5em 7em;
}

.page article section, .attachment section {
	margin: 0 1.5em 1.5em 1.5em;
}

.gallery a, .promolink , .gallery a:hover, .promolink:hover {
	border: none;
}

img.attachment-thumbnail {
	margin-right: 1.5em;
}

.attachment section a {
	border: none;
}

#content ol {
	margin: 0 1.5em 1.5em 3em;	
}

#content ol li {
	clear: both;
	border-bottom: 1px solid #aaa;
	margin-bottom: 1.5em;
}

.archive-item-meta {
	text-align: right;
}

article aside.entry-meta {
	margin: 0 1.875em 1.875em 8.7em;
}

article .entry-title {
	margin: 0 0.75em 0.75em 3.5em;
}

aside.entry-meta {
	color: #999;
}

.content .read-more, article .read-more {
	display: block;
	text-align: right;
}

aside .retweet-link {
	display: block;
	float: right;
}

#sidebar-promo {
	position: absolute;
	width: 11em;
	right: -12em;
	color: #888;
	top: 1.5em;
}

#sidebar-promo h3 {
	color: #777;
}

#sidebar-promo a img,  .twitter-action a {
	opacity: 0.5;
	filter: alpha(opacity = 50);
}

#sidebar-promo a:hover img, .twitter-action a:hover {
	opacity: 1;
	filter: alpha(opacity = 100);
}

#sidebar-promo .twitter-action a {
	display: block;
	background: url(../img/twitter-32x32.png) no-repeat;
	height: 22px;
	padding: 5px 0 5px 42px;
	border: none;
}

#sidebar {
	background-color: #333;
	padding: 1.5em 1em;
}

#sidebar a, #subscribe a {
	color: #aaa;
}

#primary-sidebar, #secondary-sidebar {
	float: left;
	width: 16em;
}

#primary-sidebar {
	margin-right: 2.8em;
}

#sidebar ul, #sidebar ol, #comments-box ul, #comments-box ol{
	clear: both;
	list-style: none;
}

#sidebar h2 {
font-size: 1.5em; line-height: 1; margin-bottom: 1em;
}

nav {
	display: block;
}

#comments-box {
	background-color: #ddd;
	padding: 1.5em;
}

.pagination {
	margin-bottom: 1.5em;
	padding: 1.5em;
	background-color: #ddd;
}

.pagination .next, .pagination .previous {
	
}

.pagination .next {
	float: right;
}

.pagination .previous {
	float: left;
}

#respond {
	clear: both;
}

.li-comment, #respond {
	padding: 1.5em 0 0 0;
	border-top: 1px solid #bbb;
}

.li-comment {
	clear: both;
	position: relative;
	padding-right: 70px;
}

.avatar {
	position: absolute;
	right: 0;
}

.comment-author-name {
	font-weight: bold;
}

/* Sidebar */

.widget-title {
	color: #eee;
}

#sidebar a:hover, #subscribe a:hover {
	color: white;
	border-color: #b8e7ff;
}

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

   forms.css
   * Sets up some default styling for forms
   * Gives you classes to enhance your forms

   Usage:
   * For text fields, use class .title or .text
   * For inline forms, use .inline (even when using columns)

-------------------------------------------------------------- */

label       { font-weight: bold; }
fieldset    { padding:1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
legend      { font-weight: bold; font-size:1.2em; }


/* Form fields
-------------------------------------------------------------- */

input[type=text], input[type=password],
input.text, input.title,
textarea, select {
  background-color:#fff;
  border:1px solid #bbb;
}
input[type=text]:focus, input[type=password]:focus,
input.text:focus, input.title:focus,
textarea:focus, select:focus {
  border-color:#666;
}

input[type=text], input[type=password],
input.text, input.title,
textarea, select {
  margin:0.5em 0;
}

input[type=text],
input.title   { width: 20em; padding:0.75em; }
input.title   { font-size:1.5em; }
textarea      { width: 40em; height: 15em; padding:5px;   margin-bottom: 1.5em;
}

input[type=checkbox], input[type=radio],
input.checkbox, input.radio {
  position:relative; top:.25em;
}

form.inline { line-height:3; }
form.inline p { margin-bottom:0; }


/* Cool weird stuff */

body {
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eee), to(#aaa));
	background-image: -moz-linear-gradient(#eee, #aaa);
	background-size: 100% 400px, 0px 0px;
	background-repeat: repeat-x;
	-o-background-size: 1000px 700px, 0 0;
	-moz-background-size: 1000px 700px, 0px, 0px;
	-webkit-background-size: 1000px 700px, 0px 0px;
	min-height: 100%;	
}

header {
	
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#1A344F), to(#101823));
	background-image: -moz-radial-gradient(#1A344F, #101823);
	background-size: 100% 400px, 0px 0px;
	background-repeat: repeat-x;
	-o-background-size: 100% 400px;
	-moz-background-size: 100% 400px, 0px, 0px;
	-webkit-background-size: 1000px 200px, 0px 0px;	
}

article .entry-date {
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#444), to(#222));
	background-image: -moz-linear-gradient(#444, #222);
}

h2#comments {
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#888), to(#666));
	background-image: -moz-linear-gradient(#888, #666);
}


header #site-title a {
	background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0F354D), to(#1A5E8D));
	background-image: -moz-linear-gradient(#0F354D, #1A5E8D);
}
header #site-title a:hover {
	opacity: 0.9;
}
article .entry-date, header #site-title a {
	background-size: cover, 0px 0px;
	-o-background-size: cover;
	-moz-background-size: cover, 0px, 0px;
	-webkit-background-size: cover, 0px 0px;
}

article .entry-date {
/*	opacity: 0.8;
	filter:alpha(opacity=80);*/ /* For our beloved IE */
}

article, header, #sidebar, .pagination, #content, #comments-box {
	-webkit-box-shadow: 1px 1px 4px #333;
	-moz-box-shadow: 1px 1px 4px #333;
	-o-box-shadow: 1px 1px 4px #333;
	box-shadow: 1px 1px 4px #333;
}

article .entry-date, header #site-title,  h2#comments {
	-webkit-box-shadow: 2px 2px 5px #000;
	-moz-box-shadow: 2px 2px 5px #000;
	-o-box-shadow: 2px 2px 5px #000;
	box-shadow: 2px 2px 5px #000;
}

.syntaxhighlighter, pre {
	font-size: 0.8em !important;
}