/*
http://developer.yahoo.net/yui/license.txt
version: 2.3.1
*/
body{color:#000;background:#FFF;}body,div,dl,dt,dd,ul,ul li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ul li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup,sub{line-height:-1px;vertical-align:text-top;}sub{vertical-align:text-bottom;}input, textarea, select{font-family:inherit;font-size:inherit;font-weight:inherit;}

/*
Jeremy Reset. Give some life back to the Yahoo Reset
*/
h1, h2, h3, h4 { font-weight: bold; margin: 1.2em 0; }
h1 { font-size: 2em; }
h2 { font-size: 1.5em; }
h3 { font-size: 1.25em; }
strong, b { font-weight: bold; }
em, i { font-style: italic; }
p { margin: 1.2em 0; }
th { font-weight: bold; }

/*
Actual page stylesheet
*/

body { background-color: #262A2F; text-align: center; font-family: "Trebuchet MS", ariel, verdana, helvetica; background: #262A2F url(../images/body-bg.png) no-repeat top center; color: #333; line-height: 1.5em; font-size: 0.9em; }

h1 { font-size: 2em; line-height: 6em; margin: 0; }
h2 { line-height: 1.5em; margin: 0; font-weight: normal; }
p { margin: 1.3em 0; }
a { text-decoration: none; }

#articles ul li { }

#container { width: 50em; min-width: 760px; margin: 10px auto 0; text-align: left; position: relative; border: 1px solid #262A2F; }
/*-------------------------------------------------
LAYOUT ITEMS
-------------------------------------------------*/
#title { text-transform: lowercase; width: 10.9em; font-size: 3em; font-weight: bold; color: #f30; text-align: center; padding: 15px 0; float: left; margin: 0; line-height: 1.5em; }
#title { color: #6b2286; }
#title h1 { display: none; }
#title strong { color: #B80000; }
#title p { margin: 0; }
#title a { color: #f30; }
#call-to-action { text-transform: lowercase; float: right; padding: 10px; width: 18em; background-color: #f30; margin: 0; }
#call-to-action h2 { color: #fff; font-size: 1.8em; }
#call-top-action { background-color: #6b2286; }

#page-teaser { background: #fff url(../images/content-bg.jpg) no-repeat top right; padding: 10px 287px 10px 26px; }

#footer { background-color: #555; color: #999; font-size: 0.8em; text-transform: lowercase; clear: both; }
#footer a { color: #999; }

/*-------------------------------------------------
BOX
-------------------------------------------------*/
.box { position: relative; background-color: #fff; margin: 15px 0; padding: 10px 26px; }
.top-left, .top-right, .bottom-right, .bottom-left { background-repeat: no-repeat; width: 4px; height: 4px; position: absolute; }
.top-right { background-image: url(../images/box-top-right.png); top: 0; right: 0; }
.top-left { background-image: url(../images/box-top-left.png); top: 0; left: 0; }
.bottom-right { background-image: url(../images/box-bottom-right.png); bottom: 0; right: 0; }
.bottom-left { background-image: url(../images/box-bottom-left.png); bottom: 0; left: 0; }

/*------------------------------------------------- 
STYLE RULES
-------------------------------------------------*/
.box h2 { font-size: 1.5em; color: #f30; }

/*------------------------------------------------- 
TAGS
-------------------------------------------------*/

/** Support Rules **/
#header { margin-top: 35px; }

/** Tags **/
.tag { position: absolute; }
#container .tag { right: -140px; top: 0; width: 134px; height: 95px; background-image: url(../images/tag-container.png); }
#title .tag { top: -34px; left: 0; width: 349px; height: 31px; background-image: url(../images/tag-header.png); }
#page-teaser .tag { top: -32px; right: -30px; width: 135px; height: 65px; background-image: url(../images/tag-content.gif); }

/*------------------------------------------------- 
NAVIGATION
-------------------------------------------------*/
#nav { background: transparent url(../images/body-bg.png) repeat-y center center; padding: 0; position: relative; }
#nav ul { width: 50em; min-width: 760px; margin: 0 auto; background-color: #262A2F; background: #262A2F url(../images/tag-nav.png) no-repeat center right; }
#nav ul li { display: inline; float: left; border-right: 5px solid #fff; text-align: center; }
#nav a { display: block; height: 4em; line-height: 4em; padding: 0 2.1em; text-decoration: none; font-size: 0.9em; color: #000; letter-spacing: 1px; }

#nav ul li#nav-portfolio a { background-color: #f30; color: #fff; }
#nav ul li#nav-services a { background-color: #B1211C; color: #fff; }
#nav ul li#nav-about a { background-color: #8CC6D6; }
#nav ul li#nav-contact a { background-color: #FFDA8C; }
nav ul li#nav-contact { border-width: 0px; }

#nav { background: transparent url(../images/body-bg.png) repeat-y center center; padding: 0; position: relative; }
#nav ul { width: 50em; min-width: 760px; margin: 0 auto; background-color: #262A2F; background: #262A2F url(../images/tag-nav.png) no-repeat center center; }
#nav ul li { display: inline; float: left; border-right: 5px solid #fff; text-align: center; }
#nav a { display: block; height: 4em; line-height: 4em; padding: 0 2em; text-decoration: none; font-size: 0.9em; color: #000;  }
#nav #link-to-home { position: absolute; top: 0px; left: 42%; }
#nav #link-to-home a { color: #ccc; border: 0px solid #000; }

#nav ul li#nav-about { border-left: 5px solid #fff; float: right; }
#nav ul li#nav-contact { border-right: 0; float: right; }

/*------------------------------------------------- 
SUPPORT DEFINITIONS
-------------------------------------------------*/

/* ClearFix for boxes
-------------------------------------------------*/

.clearfix:after, 
.box:after,
#header:after,
#secondary-content:after,
#nav ul:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

#header,
#secondary-content,
.clearfix,
.box,
#nav ul {
  display: inline-block;
}

/* Holly Hack Targets IE Win only \*/
  * html .box, 
  * html #nav ul,
  * html #header,
  * html #secondary-content,
  * html .clearfix {height: 1%;}
  #header, #secondary-content, .box, #nav ul, .clearfix {display: block;}
/* End Holly Hack */

/*------------------------------------------------- 
HOME PAGE
-------------------------------------------------*/

/*------------------------------------------------- 
TESTING
-------------------------------------------------*/
#secondary-content div#articles { float: left; width: 29em; margin-right: 15px; margin: 0; }
#secondary-content div#photos, #secondary-content div#tumblr { float: right; width: 15.8em;  margin: 0 0 15px 0; }

#secondary-content div#articles ul li { border-bottom: 1px dotted #ccc; padding: 5px; padding-left: 20px; background: url(../images/icon_article.png) no-repeat center left; }
span a { padding-left: 20px; background: url(../images/icon_link.png) no-repeat center left; }

#index .flickr_badge_image { margin: 0px; width: 75px; height: 75px; float: left; }
#index #flickr_www {font-family: Arial, Helvetica, Sans serif !important; color:#3993ff !important;}
#index #flickr_badge_uber_wrapper a {text-decoration:none !important; background:inherit !important;color:#3993ff;}

pre { background-color: #444; color: #fff; padding: 5px 10px; line-height: 1.3em; font-size: 1.1em; }


#container { width: 838px; }
#title { width: 572px; font-size: 4em; padding: 0px; margin: 0px; line-height: 1em; text-align: left; }

#title p { padding: 0; margin: 20px; }
#call-to-action { width: 246px; padding: 0; margin: 0;}
#call-to-action h2 { margin: 31px 20px 28px; font-size: 1.4em; line-height: 0.99em; }

#page-teaser { padding: 20px 266px 20px 20px; background-image: url(http://jeremyhubert.com/templates/images/content-bg-20101110.jpg); }
.box { margin-top: 20px; }
