/*   
Theme Name: Bands
Theme URI: http://www.haleinteractive.com
Description: Modern HTML5 theme that divides the page into bands.
Author: Jason Hale
Author URI: http://haleinteractive.com
Template: H5
Version: 0.5
.
The is exclusive to Hale Interactive
.
*/


/* == RESET CSS -- */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }

body { line-height: 1; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
/* remember to define focus styles! */
:focus { outline: 0; }
/* remember to highlight inserts somehow! */
ins { text-decoration: none; }
del { text-decoration: line-through; }
/* tables still need 'cellspacing="0"' in the markup */
table { border-collapse: collapse; border-spacing: 0; }



/* == GLOBAL == */

header, footer, section, article, aside, nav { display: block; }
body { border-top: 11px solid #000; background: #f2f2ec; font: normal 13px/19px helvetica, arial, sans-serif; color: #161616; }

a:link, a:visited { text-decoration: underline; color: #476fa1; }
a:hover, a:active { text-decoration: underline; color: #ff8406; }

.clear { clear: both; height: 0; line-height: 0; overflow: none; }

body>header { height: 169px; }
body>header h1 { position: absolute; top: -11px; left: -15px; }
body>header h1 a:link, body>header h1 a:visited,
body>header h1 a:hover, body>header h1 a:active { display: block; width: 160px; height: 128px; background: url(images/hale-interactive.png) no-repeat; text-indent: -9999px; outline: none; }
body>header nav { position: absolute; top: 70px; left: 530px; font-size: 18px; text-transform: lowercase; line-height: 24px; }
body>header nav li { float: left; padding-right: 36px; }
body>header nav a:link, body>header nav a:visited { border-bottom: 4px solid #000; text-decoration: none; color: #000; }
body>header nav a:hover, body>header nav a:active, body>header nav li.current_page_item a { border-bottom: 4px solid #ff8406; text-decoration: none; color: #000; }


.band { position: relative; width: 960px; margin: 0 auto; }

#blogBand { background: #f2f2ec url(images/blogBand-bg.jpg) bottom repeat-x; }
#blogBand .band { width: 940px; padding: 0 10px 19px; }
.home article { float: left; width: 420px; }
#post-1 {  }
#post-2 { margin-left: 100px; }

.secondaryBand { background: #7098ca url(images/secondaryBand-bg.jpg) top repeat-x; color: #fff; }
.secondaryBand .band { padding: 28px 0 18px; }
.secondaryBand h2 { font-size: 26px; font-weight: 100; margin: 0 10px 23px; color: #fff; }

#workBand { height: 274px; }
#workBand #bestbuy a { background: url(images/work-bestbuy.jpg); }
#workBand #gucci a { background: url(images/work-gucci.jpg); }
#workBand #bud a { background: url(images/work-bud.jpg); }
#workBand #hyatt a { background: url(images/work-hyatt.jpg); }
#workBand li { float: left; width: 220px; height: 153px; padding: 10px; background: url(images/work-slide.png) no-repeat; }
#workBand a { display: block; width: 210px; height: 143px; border: 5px solid #fff; text-indent: -9999px; outline: none;  }
#workBand a:hover, #workBand a:active { border-color: #ccc;  }

#whoBand { min-height: 160px; background: #2d2d2d url(images/whoBand-bg.jpg) top repeat-x; color: #fff; }
#whoBand .band { width: 940px; padding: 28px 10px 18px; }
#whoBand h2 { font-size: 26px; font-weight: 100; margin: 0 0 23px; color: #fff; }
#whoBand section { float: left; }

#who { width: 600px; padding-right: 120px; }
#where ul { width: 200px; }
#where li { float: left; padding: 0 10px 10px 0; }
#where a { display: block; width: 32px; height: 32px; text-indent: -9999px; outline: none; }
#twitter a { background: url(images/socialmedia/twitter_32.png); }
#facebook a { background: url(images/socialmedia/facebook_32.png); }
#linkedin a { background: url(images/socialmedia/linkedin_32.png); }
#email a { background: url(images/socialmedia/email_32.png); }
#flickr a { background: url(images/socialmedia/flickr_32.png); }
#skype a { background: url(images/socialmedia/skype_32.png); }
#rss a { background: url(images/socialmedia/rss_32.png); }


/* == POSTS == */

article h1 { font-size: 36px; font-weight: normal; line-height: 46px; letter-spacing: -0.05em; }
article h1 a:link, article h1 a:visited { text-decoration: none; color: #161616; }
article h1 a:hover, article h1 a:active { text-decoration: none; color: #476fa1;  }
article header h2 { font-size: 21px; font-weight: normal; line-height: 24px; }
article header h2 a:link, article h2 a:visited { text-decoration: none; }
article header h2 a:hover, article h2 a:active { text-decoration: underline; }
article header { position: relative; margin-bottom: 25px; }
article header time { font-size: 11px; }
article header .comments { margin-left: 210px; padding-left: 17px; background: url(images/comment.gif) left no-repeat; font-size: 11px; text-decoration: none; color: #161616; }
article header .category { font-size: 11px; }
article section h2 {  }
article section h3 { margin-bottom: .5em; font-size: 15px; font-weight: bold; }
article section h4 {  }
article p { margin-bottom: 1.5em; }
article code { display: block; padding: 10px; border: 1px solid #ccc; background: #fff; color: #5d5d5d; }
article ol { margin-left: 24px; list-style: decimal; }
article ol li { margin-bottom: 3em; }
article section ul { margin: 0 24px 2em 24px; list-style: square; }
article section ul li { margin-bottom: 1em; }

.single #blogBand .band { width: 960px; }
.single #blogBand section { float: left; width: 640px; }
.single article header { margin-bottom: 21px; padding: 0 10px 21px; border-bottom: 1px solid #ccc; }
.single article header .time { line-height: 12px; color: #2d2d2d; }
.single article header .comments { margin-left: 60px; line-height: 12px; color: #2d2d2d; }
.single article header .category { display: block; line-height: 12px; color: #2d2d2d; }
.single article section { padding: 0 10px; }

article+nav { font-weight: bold; }
section>h1 { padding-top: 10px; }



/* == COMMENTS == */


#commentsBand .band { width: 940px; padding: 28px 0 18px; }
#commentsBand h2 { margin: 0 0 23px; }
#commentsBand article { margin: 15px 0; padding: 10px; border-bottom: 1px solid #b1c6dd; }
#commentsBand article header { float: left; width: 120px; margin: 0; padding: 0; border: none; }
#commentsBand article header img { display: block; margin: -12px 0 0 -12px; padding: 17px; background: url(images/user-frame.png) no-repeat; }
#commentsBand article header .author { display: block; font-weight: bold; }
#commentsBand article header time { display: block; }
#commentsBand article header a:link, #commentsBand article header a:visited { text-decoration: none; color: #fff; }
#commentsBand article header a:hover, #commentsBand article header a:active { text-decoration: none; color: #ff8406; }
#commentsBand article section { float: left; width: 480px; margin-left: 40px; }
#commentsBand form { padding-top: 28px; }
#commentsBand form label { display: block; margin-left: 180px; }
#commentsBand form label.required { font-weight: bold; }
#commentsBand form label.required { font-weight: normal; }
#commentsBand form p { margin: 0 0 1.5em 180px; }
#commentsBand form input { display: block; width: 284px; margin: 2px 0 12px 180px; padding: 2px 6px; border: 2px solid #ccc; font-size: 13px; color: #161616; }
#commentsBand form input[type=submit] { display: block; width: 60px; padding: 0 6px; margin: 2px 0 12px 180px; border: 2px solid #fff; background: #ccc; font-size: 15px; color: #fff; }
#commentsBand form input[type=hidden] { padding: 0; border: none; }
#commentsBand form textarea { display: block; margin: 2px 0 12px 180px; padding: 4px 6px; border: 2px solid #ccc; font-family: helvetica, arial, sans-serif; font-size: 13px; line-height: 19px; color: #161616; }



/* == ARCHIVE == */
.archive section h1 { font-size: 36px; font-weight: normal; line-height: 46px; letter-spacing: -0.05em; }
.archive section h1 a:link, article h1 a:visited { text-decoration: none; color: #161616; }
.archive section h1 a:hover, article h1 a:active { text-decoration: none; color: #476fa1;  }
.archive #blogBand header { margin-bottom: 21px; padding: 0 10px 21px; border-bottom: 1px solid #ccc; }
.archive #blogBand section { float: left; width: 640px; }
.archive #blogBand article { margin-bottom: 20px; padding: 0 10px; border-bottom: 1px solid #ccc; }
.archive #blogBand article header { margin-bottom: 25px; padding: 0; border: none; }
.archive #blogBand article section { float: none; width: auto; }


/* == SIDEBAR == */

aside {	float: right; overflow: hidden; width: 180px; }
aside h2 { margin: 0 0 8px; padding: 0 10px 8px; border-bottom: 1px solid #ccc; font-size: 13px; font-weight: bold; color: #476fa1; }
aside a:link, aside a:visited { text-decoration: none; color: #161616; }
aside a:hover, aside a:active { text-decoration: none; color: #ff8406; }
aside li { margin-bottom: 8px; padding: 0 0 10px;border-bottom: 1px solid #ccc; }
aside li li { margin: 0; padding: 0 10px; border-bottom: none; }
aside li.noborder { border-bottom: none; }

/* == FOOTER == */

body>footer { height: 29px; background: #000; line-height: 29px; color: #cedced; }
body>footer .band { width: 940px; padding: 0 10px; }
body>footer a:link, body>footer a:visited { text-decoration: none; color: #cedced; }

/* == SEARCH == */

label[for=s] {
	display: none;
	}

/* == ELEMENTS == */

/* a place for misc. styles */