/* 
  _____ _  _ ___ ___   ___   ___  _   _   ___  ___  ___  __  __ ___ 
 |_   _| || | __|   \ /_\ \ / / || | /_\ / __|/ __|/ _ \|  \/  | __|
   | | | __ | _|| |) / _ \ V /| __ |/ _ \\__ \ (__| (_) | |\/| | _| 
   |_| |_||_|___|___/_/ \_\_| |_||_/_/ \_\___/\___|\___/|_|  |_|___|
                                                                    
										because I'm cool like that.
*/

/*
standards: copyright + credits {
	thedayhascome: spring version;
	release: february 2010;
	copyright-josh-hopkins: all rights reserved;
	email: joshua.d.hopkins[at]gmail[dot].com;
	you-may: take and use elements of this css. however, the unique combination of layout, font styles, colors etc. is copyrighted;
	you-may-not: use any of the graphical elements on this site !important;
	green: #9ed236;
	silver: #dedede;
	light-grey: #aaaaaa;
	medium-grey: #595959;
	dark-grey: #101010;
*/
	
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
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}
ins{text-decoration:none}
del{text-decoration:line-through}
table{border-collapse:collapse; border-spacing:0}

body *{margin:0; padding:0}
body{font:.9em Arial,Verdana,sans-serif; text-align:center; font-size:85%; color:#dedede; background:url(http://thedayhasco.me/images/body_bg.gif) repeat-x}
a{color:#9ed236; text-decoration:none}
acronym{color:#dedede; border-bottom:1px dotted #dedede; text-decoration:none; cursor:help}

/* GLOBAL WRAPPER */
.wrapper { padding: 0 20px; margin: 0 auto; overflow: hidden; max-width: 750px; }

/* CONTAINER */
#container{padding:0; margin:0 auto; text-align:left; overflow:hidden; width:100%}
/* HEADER */
#container #header{position:relative; overflow:hidden; height:85px; width:100%; background:url(http://thedayhasco.me/images/header_bg.png) repeat-x}
#container #header h1{float:left; margin:0; padding:0}
#container #header h1 a{display:block; overflow:hidden; text-indent:-1000em; margin:15px 0 0 0; background:url(http://thedayhasco.me/images/logo.png) no-repeat 0 0; width:213px; height:47px}
#container #header h2{display:none; float:left; margin:21px 0 0 -30px; padding:3px 0 0 10px; height:20px; color:#aaa; font-weight:normal; font-size:1em; letter-spacing:-0.07em; border-left:1px solid #aaa}

/* SEARCH */
#container #header form{margin:0}
#container #header #search{float:right; margin:15px 0 0 0; width:173px; height:27px; background:url(http://thedayhasco.me/images/bg_search_box.gif)}
#container #header #search:hover{background:url(http://thedayhasco.me/images/bg_search_box_hover.gif)}
#container #header #search #q{float:left; padding:0; margin:6px 0 0 6px; border:0; width:140px; background:none; color:#999; font-size:0.7em}
#container #header #search #go{float:right; margin:1px 1px 0 0; width:25px; height:25px}

/* CONTENT */
#container #content{position:relative; width:100%; margin:0; padding:5px 0 0 0}
#container #content h3{font-family:Georgia,serif; color:#fff; font-weight:normal; font-size:3.1em; letter-spacing:-0.04em; line-height:1.2em}
#container #content h3 em{font-style:italic}
#container #content p{margin:0 0 1em 0; line-height:1.5em; font-size:.9em; text-align:justify}

/* JQUERY */
#container #content p.subContent_head{color:#9ed236; cursor:pointer; margin:1em 0; padding:0}
#container #content .subContent{display:none; margin-bottom:20px}
#container #content .subContent p{margin:0; padding:0; line-height:1.5em; font-size:1.2em; letter-spacing:-0.01em; text-align:justify}

/* FOOTER */
#container #footer{position:relative; clear:both; display:block; height:165px; margin:0; padding:0; font:.8em "Trebuchet MS",Helvetica,sans-serif; color:#aaa; width:100%; text-align:center; background:url(http://thedayhasco.me/images/footer_bg.png) repeat-x}

/* COLOPHON */
#container #colophon{padding:20px 0 0 0; text-align:left}

/* GLOBAL */
#container #colophon a:link, 
#container #colophon a:visited{color:#aaa}
#container #colophon a:hover, 
#container #colophon a:active{color:#9ed236}

/* social */
#container #colophon .social{position:relative; width:100%; height:70px; margin:20px 0 0 0; background:url(http://thedayhasco.me/images/social_bg.png) no-repeat}
#container #colophon .social a{display:block; overflow:hidden; text-indent:-1000em}

#container #colophon dl.logos{display:inline; list-style:none}
#container #colophon dl.logos dd{float:left; padding:15px 0 0 0}

/* twitter */
#container #colophon a#twitter{background:url(http://thedayhasco.me/images/logo-twitter.png) no-repeat; width:106px; height:25px; margin:0 66px 0 0}
#container #colophon a#twitter:hover, 
#container #colophon a#twitter:active{background:url(http://thedayhasco.me/images/logo-twitter-hover.png) no-repeat}
/* flickr */
#container #colophon a#flickr{background:url(http://thedayhasco.me/images/logo-flickr.png) no-repeat; width:83px; height:25px; margin:0 66px 0 0}
#container #colophon a#flickr:hover, 
#container #colophon a#flickr:active{background:url(http://thedayhasco.me/images/logo-flickr-hover.png) no-repeat}
/* vimeo */
#container #colophon a#vimeo{background:url(http://thedayhasco.me/images/logo-vimeo.png) no-repeat; width:86px; height:25px; margin:0 66px 0 0}
#container #colophon a#vimeo:hover, 
#container #colophon a#vimeo:active{background:url(http://thedayhasco.me/images/logo-vimeo-hover.png) no-repeat}
/* facebook */
#container #colophon a#facebook{background:url(http://thedayhasco.me/images/logo-facebook.png) no-repeat; width:116px; height:25px; margin:0 66px 0 0}
#container #colophon a#facebook:hover, 
#container #colophon a#facebook:active{background:url(http://thedayhasco.me/images/logo-facebook-hover.png) no-repeat}
/* tumblr */
#container #colophon a#tumblr{background:url(http://thedayhasco.me/images/logo-tumblr.png) no-repeat; width:95px; height:25px}
#container #colophon a#tumblr:hover, 
#container #colophon a#tumblr:active{background:url(http://thedayhasco.me/images/logo-tumblr-hover.png) no-repeat}

/* copyright */
#container #footer a.creative-commons-license{display:inline-block; width:15px; height:20px; margin:0; padding:0; background:url(http://thedayhasco.me/images/cc.gif) no-repeat 0 11px}
#container #footer a.creative-commons-license span{display:none}
 
/* ABOUT */
#container #footer a.about{margin:0; padding:0; border-bottom-style:none; text-decoration:none}
#container #footer a.about:link, #footer a.about:visited{color:#aaa}
#container #footer a.about:hover, #footer a.about:active{color:#9ed236}
/* COLOPHON */
#container #footer a.colophon:link, #footer a.colophon:visited{margin:0 1px; color:#aaa; border-bottom:1px dotted #aaa; text-decoration:none}
#container #footer a.colophon:hover, #footer a.colophon:active{margin:0 1px; color:#9ed236; border-bottom:1px dotted #9ed236}
/* mobile */
#container #footer a.mobile{padding:0 10px 0 0; background:url(http://thedayhasco.me/images/mobile.png) no-repeat center right}

#container #contact{background:transparent url(http://thedayhasco.me/images/contact_bg.png) no-repeat scroll 0 0; margin:0 auto; padding:40px 20px 18px 0px; position:absolute; top:65px; width:750px; height:225px; z-index:1000; display:none; font-size:16px; font-style:italic; color:#999}
#container #contact p{text-align:center}
#container #contact a#close{background:transparent url(http://thedayhasco.me/images/btn-contact-close.png) no-repeat scroll 0 0; display:block; height:24px; position:absolute; right:15px; text-indent:-99999px; top:25px; width:24px}
#container #contact span.tel{color:#666; display:block; font-size:110px; font-style:normal; font-weight:bold; padding-bottom:8px}
#container #contact span.tel span{color:#999; font-family:georgia; font-size:22px; padding:0 8px}

@media (max-width: 750px) {
	#container #content h3{font-family:Georgia,serif; color:#fff; font-weight:normal; font-size:2.7em; letter-spacing:-0.03em; line-height:1.1em}
}
@media (max-width: 480px) {
	#container #content h3{font-family:Georgia,serif; color:#fff; font-weight:normal; font-size:2.1em; letter-spacing:-0.02em; line-height:0.8em}
}