/*
Theme Name: Jorge Villalobos
Theme URI: http://jorgevillalobos.com/
Description: A modernist/minimalist theme inspired by the beautiful <a href="http://www.thingsmagazine.net/projects/1960s/index.htm">'60s Pelican books' covers</a>.
Version: 1
Author: Jorge Villalobos
Author URI: http://jorgevillalobos.com/
Tags: blue, modern, minimalist, pelican, grey, cream, arial

	Jorge Villalobos v1
	http://jorgevillalobos.com/

	This theme was designed and built by Jorge Villalobos,
	whose blog you will find at http://jorgevillalobos.com/blog
	
	All Rights Reserved. Use of this theme without authorization is strictly prohibited.

*/

body, div, p, ul, ol, dl, li, blockquote, table, br, hr {
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
}

body {
  background: #45d1f5 url('images/bg.jpg');
  font: 10px Arial, sans-serif;
  color: #444;
}

.clear {
  display: block !important;
  width: 100% !important;
  height: 1px !important;
  border: 0 !important;
  margin: -1px 0 0 !important;
  padding: 0 !important;
  background: none !important;
  clear: both !important;
  float: none !important;
}

a { text-decoration: none; }
a:link, a:visited { color: #ffc; }
a:hover, a:active { color: #fff; }

#header {
  height: 310px;
  border-bottom: 1px solid #46c3e6;
  min-width: 1000px;
}
#main_navigation {
  position: absolute;
  bottom: -1px;
  left: 0;
  list-style: none;
  text-transform: uppercase;
  padding-left: 170px;
  font-size: 1.3em;
}
#main_navigation li {
  display: inline-block;
  margin-right: 20px;
}
li#skip_to_content {
  display: none;
}
#main_navigation li a {
  display: block;
  padding-bottom: 10px;
}
#main_navigation li a:hover, #main_navigation li a:active {
  padding-bottom: 8px;
  border-bottom: 2px solid #fff;
}
#main_navigation li.current_page_item a:link, #main_navigation li.current_page_item a:visited,
#main_navigation li.current_page_item a:hover, #main_navigation li.current_page_item a:active {
  padding-bottom: 8px;
  border-bottom: 2px solid #0d2931;
  color: #444;
}
#logo {
  display: block;
  float: left;
  width: 130px;
  height: 240px;
  padding: 70px 10px 0;
  border-right: 1px solid #46c3e6;
  text-align: right;
  background: url('images/bg_yellow.jpg') 200% 200% no-repeat;
}
#logo:hover, #logo:active {
  background-repeat: repeat;
}
#logo img {
  background: url('images/sprite.png') top left no-repeat;
}
#logo:hover img, #logo:active img {
  background-position: 0 -90px;
}
#site_name {
  float: left;
  width: 390px;
  padding: 90px 0 0 450px;
}
h1 {
  font-size: 2.4em;
  font-weight: normal;
  line-height: 1em;
  text-transform: uppercase;
  margin: 0 0 5px;
}
#description {
  font-size: 3.5em;
  line-height: 1.1em;
}

#content {
  background: #0d2931 url('images/bg_darker.jpg');
  padding: 65px 20px 10px 170px;
  font-size: 14px;
  color: #3e8a9f;
  min-width: 810px;
}
#content a:link, #content a:visited {
  color: #cfd4ad;
}
#content a:hover, #content a:active {
  color: #fff;
}
#content .post {
  width: 800px;
  padding-bottom: 50px;
}
#content h2 {
  font-size: 36px;
  line-height: 1em;
  margin: 0 0 20px;
  text-transform: uppercase;
  color: #57aac1;
}
#content .post .date {
  position: absolute;
  top: 3px;
  left: -170px;
  width: 130px;
  padding: 6px 10px;
  background: #0b3845 url('images/bg_dark.jpg');
  color: #287186;
  text-align: right;
  letter-spacing: 0.1em;
}
#content .post .date a:link, #content .post .date a:visited {
  color: #9daf96;
}
#content .post .date a:hover, #content .post .date a:active {
  color: #fff;
}
#content .post .entry {
  width: 410px;
}
#content p {
  line-height: 1.5em;
  margin-bottom: 1.5em;
  font-family: Georgia, serif;
}
#content strong { color: #419bb5; }

#footer {
  text-transform: uppercase;
  color: #33b6d7;
  padding: 10px;
  text-align: right;
}