/*

Theme Name: Amber
Theme URI: http://jose-mota.net
Description: The Amber series of blogger José Mota.
Version: 0.2
Author: José Mota
Author URI: http://jose-mota.net
Tags: yellow, brown, fixed width, three columns, widgets

*/

body,h1,h2,h3,h4,h5,h6,p,li,ol,ul,table,td,tr,th,dd,dl,dt,blockquote,form,fieldset { margin: 0; padding: 0; font-size: 13px; font-family: "Georgia", FreeSerif, serif; }

body { background: url('i/b.jpg'); }

a { color: #8f6830; text-decoration: none; -webkit-transition-duration: .25s; }
a:hover { color: #A77C44; }
a img { border: none; }
a:active { border: none; outline: none; }
a:focus { -moz-outline-style: none; }

h1,h2,h3,.contact-form fieldset legend { font-family: "Trajan Pro", "Lucida Bright", "Georgia", "FreeSerif", serif; font-weight: bold; text-shadow: 1px 1px 3px rgba(0,0,0,.1); -webkit-text-stroke: 1px transparent;}
h1 { font-size: 24px; letter-spacing: -1px; color: #332e24; margin-bottom: .9em; }
h2 { font-size: 18px; letter-spacing: -1px; color: #524c3e; margin-bottom: .8em;}
h2 a { color: inherit; }
h3,.contact-form fieldset legend { color: #7c7057; font-size: 14px; margin-bottom: 1em; }
h4 { margin-bottom: 1em; }

p,li { line-height: 1.5; color: #555; /*text-shadow: 1px 1px 3px rgba(0,0,0,.1);*/ }
p,ol,ul { margin-bottom: 1em; }

acronym,abbr { border-bottom: 1px dotted #8f6830; cursor: help; color: #655;}

header, nav, section, article, footer, aside { display: block; }

header { background: url('i/h.jpg') repeat-x top; display: block; height: 270px; }
header > div { width: 960px; margin: 0 auto; position: relative; background: url('i/hg.jpg') no-repeat 420px top;}
header h1 { background: url('i/logo.png') no-repeat center; display: block; width: 186px; height: 67px; text-indent: -9999px; position: absolute; right: 150px; top: 90px; -webkit-transition-duration: .25s;}
header h1:hover { opacity: .7; }
header h1 a { display: block; height: 67px; }

nav { padding-top: 8px; }
nav ul { width: 350px; }
nav ul:hover li { opacity: .5; }
nav li { line-height: 55px; list-style: none; color: #908267; font-style: italic; font-size: 14px; text-shadow: 1px 1px 3px rgba(0,0,0,.3); -webkit-transition-duration: .25s; }
nav ul li:hover { opacity: 1; }
nav li a { font-style: normal; font-weight: bold; color: #ffebb9; padding-left: 50px; padding-right: 7px; display: block; float: left; background: url('i/n.jpg') no-repeat left 7px; }
nav li#n-portfolio a { background-position: left -45px; }
nav li#n-contact a { background-position: left -99px; }
nav li#n-rss a { background-position: left -152px; }

article { padding-bottom: 30px; margin-bottom: 2em; background: url("i/clover.jpg") no-repeat bottom; }

aside { float: left; width: 225px; margin-left: 15px; }
aside li { list-style: none; border-bottom: 1px solid #ded9cc; padding: 3px 0;}
aside li:hover { background: #ded9cc; }

footer { clear: both; background: url("i/leaf.jpg") no-repeat center bottom; padding-top: 60px; }
#copyright { float: right; }

form p { text-indent: 0; }

.widget { margin-bottom: 30px; }

.blog-nav { border-top: 1px solid #a59c8a; padding-top: 15px;}
.blog-nav p { background: url("i/nav-sprite.jpg") no-repeat; }
p.older { background-position: left top; padding-left: 40px; }
p.newer { background-position: right bottom; padding-right: 54px; float: right; }

.button { background: #332e24 url('i/grad.png') repeat-x bottom; height: 30px; -webkit-border-radius: 15px; -moz-border-radius: 15px; -webkit-box-shadow: rgba(0,0,0,1) 1px 1px 4px; -moz-box-shadow: rgba(0,0,0,1) 1px 1px 4px; border: none; color: #fff; font-size: 12px; padding: 0 15px; }
.button:hover { background-color: #624c2e; }
.button:active,.button:focus { position: relative; top: 1px; left: 1px; outline: 0; -moz-outline-style: 0; border: none; }

form input.button { float: right; }

img.alignleft { float: left; margin: 0 1em 10px 0; }
img.shadowed { -webkit-box-shadow: 3px 3px 3px rgba(101,41,0,.5); -moz-box-shadow: 3px 3px 3px rgba(101,41,0,.5); }

#main p.meta { color: #a59c8a; text-align: center; margin-top: 2em; text-indent: 0;}
#main p img, #main p object { margin-left: -15px; }
#main p img.alignleft, #main p img.wp-smiley { margin-left: 0; }

#content { margin: 0 auto; width: 960px; }
.half, #main { float: left; width: 465px; margin-right: 15px; }
.half.mirrored { margin-right: 0; margin-left: 15px; }
#main p { text-indent: 15px; }
#main blockquote { padding: 15px 15px 5px 70px; background: rgba(0,0,0,.1) url("i/quote.png") no-repeat 15px 15px; font-style: italic; -webkit-box-shadow: 1px 1px 4px rgba(0,0,0,.4); -moz-box-shadow: 1px 1px 4px rgba(0,0,0,.4); margin-bottom: 1em;}
#main blockquote p { text-indent: 0; }
#main h3 { margin-top: 1.3em; }

#content.page #main { float: none; width: auto; margin: auto; }

#aboutpic { -webkit-box-shadow: 3px 3px 3px rgba(111,41,0,.3); -moz-box-shadow: 3px 3px 3px rgba(111,41,0,.3); }

.contact-form fieldset { border: none; }
.contact-form fieldset legend { display: block; padding: 1em 0; }
.contact-form label { float: left; width: 150px; text-align: right; margin-right: 15px; line-height: 30px;}

#commentform { clear: both; }
#commentform label { display: block; }
#commentform span.required, .wpcf7-form span.required, .contact-form span.required { font-weight: bold; color: #ff3830; }
#commentform input[type='text'], #commentform textarea, .contact-form input[type='text'], .contact-form textarea { padding: 7px; font-size: 13px; font-family: "Georgia", "FreeSerif", serif; background: rgba(51,46,36,.15); border: none; -webkit-border-radius: 3px; -moz-border-radius: 3px; color: #777; }
#commentform textarea { width: 94%; }
.contact-form .form-submit { clear: left; }

#commentform textarea.error, #commentform input[type='text'].error, .contact-form textarea.error, .contact-form input[type='text'].error, .error, .information { border: 1px solid rgba(103,64,48,.25); background: rgba(103,64,48,.1); -webkit-border-radius: 2px; -moz-border-radius: 2px; }
.error, .information { padding: 15px 0; }
.error,.contact-form input[type='text'].error,.contact-form textarea.error { border-color: rgba(192,30,30,.25); background: rgba(192,30,30,.1); }

.form-input { margin-bottom: 3px; }

#comments { list-style: none; }
#comments > li { border-bottom: 1px solid rgba(0,0,0,.1); margin-bottom: 1em; padding-bottom: 1em; min-height: 60px;}
#comments .avatarwrapper { float: left; background: url("i/avatar.jpg") no-repeat; width: 70px; height: 70px; text-indent: 0; text-align: center; margin-top: -6px; margin-right: 15px; }
/*#comments > li.odd .avatarwrapper { float: right; }*/
#comments p { text-indent: 0; }
#comments .comment-meta { text-indent: 0; margin-bottom: .5em;}
#comments .comment-meta span { margin-top: 10px; font-weight: bold; }
#comments .comment-meta span.date { color: #a59c8a; font-size: 12px; font-weight: normal; margin: 0; }
#comments .avatarwrapper .avatar { margin-left: 9px; margin-top: 9px; -webkit-border-radius: 3px; display: block; }
#comments .the-comment { margin-left: 15px; }
#comments .the-comment p { font-size: 13px; color: #666;}

#respond { clear: both; }

.portfolio-image { padding: 15px; background: rgba(0,0,0,.2); -webkit-box-shadow: 3px 3px 3px rgba(111,41,0,.4); -moz-box-shadow: 3px 3px 3px rgba(111,41,0,.4); margin-bottom: 1em;}
.portfolio-image:hover { background: rgba(0,0,0,.1); }
#main p.detail { text-indent: 0; }
.detail a { margin-right: 25px; display: inline-block; }
.detail .portfolio-image { padding: 7px; vertical-align: top;}

.clear { clear: both; }