/*
                 Site:    http://www.timmiley.com
   Designer+Developer:    Tim Miley	 
 
  -GLOBAL RESET
============================================================= */ 

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, font, img, ins, kbd, q, s, samp, small, tt, var, dd, dl, dt, li, ol, ul, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin:0; padding:0; border:0; font-weight:normal; font-style:inherit; font-size:100%; font-family:inherit; text-align:left; vertical-align:baseline }
a img, :link img, :visited img { border:0 }
table { border-collapse:collapse; border-spacing:0 }
ol, ul { list-style:none }
acronym { border-bottom: 1px dotted #000000; }
q:before, q:after, blockquote:before, blockquote:after { content:"" }
:focus { -moz-outline-style:none; }
 *::-moz-selection {
background: #83B7BB;
color:#000;
}
/* 
  -GLOBALS   
============================================================= */

body { background:#383531 url('../images/bck.gif'); }
input, textarea, select { border:2px solid #414042; color:#414042; background-color:#f4f4ed; padding:2px 3px; font:bold 16px Helvetica, Arial, sans-serif }
input:hover, textarea:hover, input:focus, textarea:focus, textarea:active, select:focus, select:active { border:2px solid #414042; color:#000; background-color:#f4f4ed }
/*  -TYPOGRAPHY

============================================================= */
body { font: 13px Arial, Helvetica, sans-serif; line-height: 1.5em; color: #fff; }
h1, h2, h3, h4, h5 { font-family: Arial, Helvetica, sans-serif; }
h1 { font-size: 100px; font-weight: bold; color: #000; letter-spacing: -5px; line-height: 100%; margin: 0; color: #83B7BB; }
h2 { font-size: 25px; }
ul { margin: 1.5em 0; }
#title_work { width: 530px; height: 220px; text-indent: -9999px; }
a, a:link { text-decoration: none; font-weight: normal; }
/*  BLOCK LEVEL ELEMENTS
================================================================== */
#wrapper { width: 980px; margin: 0 auto 30px auto; overflow: auto; }
#nav, #header, #content, #footer { clear: both; }
/*  MAIN NAV
================================================================== */
#nav { width: 100%; border-top: 5px solid #000000; background: url('../images/border.gif') repeat-x bottom; position: relative; height: 55px; }
#nav_container { width: 980px; margin: 0 auto; padding: 20px 0 10px 0; position: relative; }
#nav ul { width: 500px; float:right; font: 14px Arial, Helvetica, sans-serif; text-transform: uppercase; overflow: auto; text-align: right; margin: 8px 0 0 0; }
#nav ul li { margin-left: 35px; text-indent: -9999px; text-align: right; float: right }
#nav_work { width: 40px; }
#nav_home { width: 38px; }
#nav_services { width: 64px; }
#nav_about { width: 45px; }
#nav_recognition { width: 86px; }
#nav_journal { width: 58px; }
#nav_contact { width: 59px; }
#nav_work a { background-image: url('../images/nav_work.png'); }
#nav_home a { background-image: url('../images/nav_home.png'); }
#nav_services a { background-image: url('../images/nav_services.png'); }
#nav_about a { background-image: url('../images/nav_about.png'); }
#nav_recognition a { background-image: url('../images/nav_recognition.png'); }
#nav_journal a { background-image: url('../images/nav_journal.png'); }
#nav_contact a { background-image: url('../images/nav_contact.png'); }
#nav ul li a { height: 18px; padding: 3px; display: block; color: #fff; text-decoration: none; font-weight: bold; background-position: 50% 8px; background-repeat: no-repeat; }
#nav ul li a:hover, #nav .active { padding-top: 0px; background-position: 50% 5px; border-width: 3px 0 0 0; border-color: #fff; border-style: solid; }
#nav .active { cursor: default; }
#logo { text-indent: -9999px; width: 133px; height: 69px; top: -0px; left: 0; z-index: 100; position: absolute; }
#logo a { display: block; background: url('../images/tim_miley.png') no-repeat top left; width: 133px; height: 69px; }
/*  HEADER ELEMENTS
================================================================== */
#header { overflow: auto; border-bottom: 10px solid #000000; }
.header_title, .header_content { padding: 30px 0; }
.header_title { width: 550px; float: left; }
.header_content { float: right; margin-left: 10px; padding: 100px 0 0 0; width: 360px; }
.header_content .filter { padding: 0; margin: 0; }
.header_title p { margin: 0 0 0 5px; line-height: 1em; font-size: 20px; font-weight: bold; color: #EEECD4; }
#header span { font: 160px "palatino linotype", palatino, georgia, serif; float: left; width: 60px; position: relative; top: -10px; }
/*


/*  PORTFOLIO
================================================================== */
/*width: 980px */

.work fieldset { border-bottom: 10px solid #000; padding: 20px 0; margin: 0; position: relative; clear: both; overflow: auto; width: 980px; }
.number { color: #383531; font: bold 80px Georgia, "Times New Roman", Times, serif; background: url(../images/number_badge.png) no-repeat center center; letter-spacing: -.1em; position: absolute; bottom: 20px; right: 0px; z-index: 1; padding-right: 10px; cursor: default; margin: 0; padding-top: 25px; width: 155px; height: 131px; text-align: center; -moz-user-select: none; opacity: 0.3; filter: alpha(opacity = 30); }
/*  SLIDESHOW
================================================================== */
.s_c { width: 550px; float: left; margin: 0 20px 0 10px; position: relative; }
.s_t { /*background: #37332e url('../images/shadow_t.png') no-repeat top center;*/ }
.slide { overflow: visible; position: relative; z-index: 50; }
.img_wrap { background: url('../images/shadow_b.gif') no-repeat 50% 99%; padding-bottom: 23px; clear: both; overflow: visible; }
.img_wrap span { padding: 0px 10px; position: absolute; right: 0; bottom: 0px; text-align: center; font: italic 14px "palatino linotype", palatino, serif; }
.slide img { width: 540px; border: 5px solid #000; background: #2a2a2a; float: left; }
.pn_control { position: absolute; z-index: 51; top: 5%; width: 140px; height: 90%; display: block; cursor: pointer; opacity: 0; filter: alpha(opacity = 0); zoom: 1; }
.prev { left: 10px; background: url('../images/prev.gif') no-repeat 20px 50%; }
.next { right: 10px; background: url('../images/next.gif') no-repeat 50px 50%; }
/*  INFO
================================================================== */

.info { width: 380px; float: right; margin-right: 10px; position: relative; z-index: 2; }
.count { font-weight: bold; margin: 10px 0; font: 12px Georgia, "Times New Roman", Times, serif; }
.count a { margin: 0px 6px 0px 0; font-weight: normal; padding:  0 1px; color: #fff; }
.count a.activeSlide { cursor:default; border-top: 2px solid #000; }
.count a:hover { color: #fff; }
.count sup { margin-right: 5px; }
.info h3 { text-transform: uppercase; margin: 100px 0 0px 0; font-size: 12px; }
.info h2 { font-size: 40px; font-weight: bold; text-transform: uppercase; letter-spacing: -3px; line-height: 1.0em; margin: 0 0 30px 0; }
.info ul { margin-bottom: 10px; }
/*  AWARDS & RECOGNITION
================================================================== */

/*TOTAL = 980PX.  DATE=100, TITLE=500PX, DESC = 380PX   */
#awards {
	height: auto;
	}
#awards h2 { font: bold 24px/24px Arial, Helvetica, sans-serif; letter-spacing: -0.03em; }
#awards ul { margin-left: 45px; }
.awards_l li { border-bottom: 1px solid #2a2a2a; position: relative; z-index: 11; background: url('../images/bck_list.png') no-repeat 0px 38px; }
.awards_l * { padding: .15em 0; float: left; }
.awards_l br { clear: both; float: none; }
.awards_l img { border: 5px solid #000; position: absolute; top: -245px; right: 50px; z-index: 22; width: 280px; height: 190px; display: none; padding: 0; }
.awards_l em { width: 90px; display: block; margin-top: 8px; padding-left: 10px; letter-spacing: .05em; font-style: normal; }
.awards_l h2 { width: 400px; display:block; margin-top: 0px; display: block; }
.awards_l li p { width: 370px; padding-right: 10px; margin: 0; }
/*TOTAL = 980PX.  DATE=100, TITLE=500PX, DESC = 380PX   */


.awards_g li { list-style: none; border: 6px solid #000; width: 280px; margin: 5px; display:block; overflow: hidden; float: left; height: 190px; position: relative; }
.awards_g img { width: 290px; height: 190px; position: absolute; top: 0px; left: 0px; z-index: 10; }
.awards_g em { display: block; width: 30px; margin: 0 auto; padding-top: 10px; font-size: 11px; font-style: normal; }
.awards_g h2 { margin: 3px 0 5px 3px; text-align: center; clear: both; }
.awards_g span, .awards_g h2, .awards_g p { padding:0 20px; position: relative; z-index:11 }
/*  FOOTER
================================================================== */
#footer { border-top: 2px solid #000; padding: 10px 0 30px 0; font-family: "palatino linotype", palatino, georgia, serif; position: relative; overflow: visible; z-index: 1000; }
#footer .top { margin: 0; width: 400px; float: right; text-align: right; }
#footer ul { width: 400px; float: left; margin: 0px 0 50px 0; cursor: pointer; color: #ffc; }
#footer_cta { text-indent: -9999px; }
#footer_cta a { background: url('../images/lets_work.png') no-repeat top left; display: block; width: 226px; height: 18px; }
#footer_cta a:hover, #footer_cta .active { background: url('../images/lets_work.png') no-repeat bottom left; }
#footer_cta .active { cursor: default; }
#contact_box { width: 210px; position: absolute; top: -160px; left: 260px; z-index: 10000; }
#contact_box strong { font: 60px "palatino linotype", palatino, georgia, serif; width: 60px; top: -10px; position: absolute; top: 145px; left: -25px; }
#contact_box span { background: url('../images/box_quote.png') no-repeat top left; width: 86px; height: 43px; display: block; }
#box { background: #85bbbe; padding: 30px 15px 40px 15px; }
#box h2 { background: url('../images/get-in-touch.gif') no-repeat; width: 180px; height: 30px; text-indent: -9999px; margin: 0 auto; }
#box a { color: #2a2a2a; position: relative }
#box a:hover { color: #000; }
#close { width: 25px; height: 25px; text-indent: -9999px; left: 180px; top: 15px; position: relative; }
#close a { display: block; position:relative; background: url('../images/close.png') no-repeat; width: 25px; height: 25px; }
/*  CLASSES
============================================================= */

.date { font:italic 14px "palatino linotype", palatino, serif }
.btn { background:#414042; color:#fff; padding:1px 0px; cursor:pointer }
.btn:hover { background:#000; color:#fff; border-color:#000 }
.more { text-align:right; float:right; font-size:22px; font-weight:bold; padding:5px }
.filter { font: 15px "palatino linotype", Georgia, "Times New Roman", Times, serif; letter-spacing: .05em; margin: 20px auto; padding: 10px 0; }
.filter em { font-variant: normal; }
.filter a { padding: 1px 5px; color: #fff; }
.filter a:hover { color: #83B7BB; }
.filter .active { cursor: default; color: #fff; !important
}
.center { text-align: center; }
/*  COLORS
Pink:#c39;
Orange: #d65c00;
Red: #c03;
Blue: #09f;

Baby blue: #83B7BB;
Cream: #EEECD4;
============================================================= */


a, .filter .active, .color, .filter a:hover, .count a:hover, .info h3 { color: #83B7BB; }
/*.info ul a { padding: 1px 3px; color:#fff; background: #000; }*/
.count a.activeSlide { border-top: 2px solid #83B7BB; }
