/*
 adopted from: Smashing HTML5
	Date: July 2009
	Description: Sample layout for HTML5 and CSS3 goodness.
	Version: 1.0
 Author: Enrique Ramírez
 Autor URI: http://enrique-ramirez.com
*/



/* Imports */

@import url("reset.css");

@import url("global-forms.css");



/***** Global *****/

/* HTML5 tags*/
header, section, footer, aside, nav, article, figure { display: block; }

/* Body */

body {
 background: #AAAAAA; color: #000305; font-size: 87.5%; /* Base font size: 14px */
 font-family: 'Trebuchet MS', Trebuchet, 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; line-height: 1.429; margin: 1; padding: 0; text-align: left;
 }
.bold { font-weight: bold; }

.bldit { font-style: italic; font-weight: bold; }
.bldun { font-weight: bold; text-decoration: underline; }
.italic { font-style: italic; }
.italu { font-style: italic; text-decoration: underline; }
.biu { font-style: italic; font-weight: bold; text-decoration: underline; }
.under { text-decoration: underline; }
.center { text-align: center; }
.cenbol { text-align: center; font-weight: bold; }



/* Headings */

h1.mid { text-align: center }
h2 { font-size: 1.429em } /* 20px */

h2.mid { text-align: center; font-size: 1.429em } /* 20px */

h3 { font-size: 1.286em } /* 18px */

h4 { font-size: 1.143em } /* 16px */

h5 { font-size: 1em } /* 14px */

h6 { font-size: 0.857em} /* 12px */


h2, h3, h4, h5, h6 { font-weight: 400; line-height: 1.1; margin-bottom: .8em;
}


/***** Layout *****/

.body { clear: both;margin: 0 auto; width: 90%; }

img.right figure.right { float: right; margin: 0 0 2em 2em; }

img#fly figure#fly { float: right; }
img.left, figure.left {float: right; margin: 0 0 2em 2em; }



#mast { border: 5; margin: 28%; }

/* Borders */

.dotted { border-width: 2px; border-style: dotted; }
.dashed { border-width: 2px; border-style: dashed; }
.solid { border-width: 2px; border-style: solid; }
.double { border-width: 2px; border-style: double; }
.groove { border-width: 2px; border-style: groove; }
.ridge { border-width: 2px; border-style: ridge; }
.inset { background: #cccccc; border-width: 4px; border-color: #99cc33; border-style: inset; }
.outset { background: #dddddd; border-width: 6px; border-color: #666666; border-style: outset; padding: 2px }

/* Anchors */

a { outline: 1; }

a img { border: 0px; text-decoration: none; }

a:link, a:visited {
 color: #C74350;
 padding: 0 1px;
 text-decoration: underline;
 }

a:hover, a:active {
 background-color: #ffcc00;
 color: #fff;
 text-decoration: none;
 text-shadow: 1px 7px 3px #333;
 }



/* Paragraphs */

p { margin-bottom: 1.143em; }

* p:last-child { margin-bottom: 0; }


strong, b { font-weight: bold; }

em, i { font-style: italic; }


::-moz-selection { background: #6FFC47; color: #fff; }

::selection { background: #F6CF74; color: #fff; }



/*
	Header
*****************/

#banner { margin: 1 auto; padding: 0.25em 0 0 0; 
}


/* Banner */

#banner h1 { font-size: 2.214em; line-height: 1; }

#banner h1 a:link, #banner h1 a:visited {
 color: #000305;
 display: block;
 font-weight: bold;
 margin: 0 0 .6em .2em;
 text-decoration: none;
 width: 427px;
 }

#banner h1 a:hover, #banner h1 a:active {
 background: none;
 color: #C74350;
 text-shadow: none;
 }


#banner h1 strong { font-size: 0.36em; font-weight: normal; }


/* Main Nav */

#banner nav {
 background: #000305;
 font-size: 1em;
 height: 40px;
 line-height: 30px;
 margin: 0 auto 2em auto;
 padding: 0;
 text-align: center;
 width: 100%;

 border-radius: 5px;
 -moz-border-radius: 5px;
	-webkit-border-radius: 5px; 
}


#banner nav ul { list-style: none; margin: 0 auto; width: 100%; }

#banner nav li { float: left; display: inline; margin: 0; }


#banner nav a:link, #banner nav a:visited {
 color: #fff;
 display: inline-block;
	height: 30px;
 padding: 2px 1.125em;
 text-decoration: none; 
}

#banner nav a:hover, #banner nav a:active,
#banner nav .active a:link, #banner nav .active a:visited {
 background: #Cc33ff;
 color: #fff;
 text-shadow: none !important; 
}


#banner nav li:first-child a {
	border-top-left-radius: 5px;
 -moz-border-radius-topleft: 5px;
 -webkit-border-top-left-radius: 5px;

 border-bottom-left-radius: 5px;
 -moz-border-radius-bottomleft: 5px;
	-webkit-border-bottom-left-radius: 5px;
 }


/*
	Featured
*****************/

#featured {
 background: #dddddd;
 margin-bottom: 1em;
 overflow: hidden;
 position: absolute; right: 2%; padding: 10px;
 width: 30%;

 border-radius: 3px;
 -moz-border-radius: 3px;
 -webkit-border-radius: 3px;
 }


#featured figure {
 border: 3px solid #eee;
 float: right;
 margin: 0.786em 2em 0 5em;
 width: 27%; 
}

#featured figure img { display: block; float: right; }


#featured h2 { color: #000000; font-size: 1.714em; margin-bottom: 0.25em; }

#featured h3 { font-size: 1.429em; margin-bottom: .5em; }


#featured h3 a:link, #featured h3 a:visited { color: #000305; text-decoration: none; }

#featured h3 a:hover, #featured h3 a:active { color: #fff; }



/*
	Body
*****************/

.content {
 background: #fff;
 margin-bottom: 0.5em;
 overflow: hidden;
 padding: 4px 12px;
 width: 64%; border-radius: 10px;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px; 
}


/*
	Extras
*****************/

#extras { margin: 0 auto 0.25em auto; overflow: hidden; }


#extras ul {list-style: none; margin: 0; }

#extras li { border-bottom: 1px solid #fff; }

#extras h2 {
 color: #C74350;
 font-size: 1.429em;
 margin-bottom: .25em;
 padding: 0 3px;
 }


#extras a:link, #extras a:visited {
 color: #444;
 display: block;
 border-bottom: 1px solid #F4E3E3;
 text-decoration: none;
 padding: .3em .25em;
 }


#extras li:last-child, /* last <li>*/
 #extras li:last-child a /* <a> of last <li> */
{ border: 0 }

#extras .blogroll li:nth-last-child(2),
#extras .blogroll li:nth-last-child(3),
#extras .blogroll li:nth-last-child(2) a,
#extras .blogroll li:nth-last-child(3) a { border: 0; }


/* Blogroll */

#extras .blogroll {
 float: left;
 width: 615px;
 }
#extras .blogroll li { float: left; margin: 0 20px 0 0; width: 185px; }

	

/* Social */

#extras .social {
 float: right;
 width: 165px;
 }

#extras div[class='social'] a {
	background-repeat: no-repeat;
	background-position: 3px 6px;
	padding-left: 25px; 
}



/* Icons */


.social a[href*='facebook.com'] { background-color: #ffcc33; }


.social a[href*='/feed/'] { background-image: url('images/icons/rss.png'); }


/* Lists */

ul { list-style: outside disc; margin: 0.5em 0 0.5em 0.5em;
 }


ol {
 list-style: outside decimal;
 margin: 0.5em 0 0.5em 0.5em;
 }


dl { margin: 0 0 1.5em 0; }

dt { font-weight: bold; }

dd { margin-left: 1.5em; }



/* Quotes */

blockquote { font-style: italic; }

cite { font-weight: bold; }


q { font-style: italic; }
q.sm { font-style: italic; font-size: smaller; }



/* Tables */

table { margin: .5em auto 1.5em auto; width: 98%; }

/* Thead */

thead th { padding: .5em .4em; text-align: left; }

thead td {}



/* Tbody */

tbody td {padding: .5em .4em;}

tbody th {}


tbody .alt td {}

tbody .alt th {}



/* Tfoot */

tfoot th {}

tfoot td {}



/* Blog */

.hentry {
 background: #eeeeee; border-width: 3px solid #efefef;
 padding: 0.5em;
 }

li:last-child .hentry, #content > .hentry { border: 0; margin: 0; }

#content > .hentry { padding: 0.5em; }


.entry-title {font-size: 1.429em; margin-bottom: 0; }

.entry-title a:link, .entry-title a:visited { text-decoration: none; }


.hentry .post-info * { font-style: normal; }


/* Content */
.hentry footer { margin-bottom: 4px; }
.hentry footer address { display: inline; }

#posts-list footer address { display: block; }


#posts-list .hentry:hover {
 background: #C64350;
 color: #fff;
 }

#posts-list .hentry:hover a:link, #posts-list .hentry:hover a:visited {
 color: #F6CF74;
 text-shadow: 1px 1px 1px #333;
 }


/* Blog Index */

#posts-list { list-style: none; margin: 0; }

#posts-list .hentry { padding-left: 200px; position: relative; }

#posts-list footer {
 left: 10px;
 position: absolute;
 top: 1.5em;
 width: 190px;
 }


/*
	About
*****************/

#about {
 background: #fff;
 font-style: normal;
 margin-bottom: 1em;
 overflow: hidden;
 padding: 2px;
text-align: left;
 width: 90%;

 border-radius: 10px;
 -moz-border-radius: 10px;
 -webkit-border-radius: 10px; 
}


#about .primary { float: left; width: 50%; }

#about .primary strong {color: #C64350; display: block; font-size: 1.286em; }

#about .photo { float: left; margin: 5px 10px; }


#about .url:link, #about .url:visited { text-decoration: none; }


#about .bio { float: right; }



/*
	Footer
*****************/

#contentinfo { padding-bottom: 5px; text-align: right; }