/*Global CSS Declarations, Version 2011, Copyright (c) Analogue Web Design, LLC. All rights reserved.*/ /*GLOBAL RESET*/ html, body, address, blockquote, div, h1, h2, h3, h4, h5, h6, hr, noscript, p, pre, dl, dt, dd, ol, ul, li, table, caption, thead, tfoot, tbody, tr, td, th, form, fieldset, legend, label, a, img, object, q, span, abbr, acronym, del, dfn, em, ins, strong { background:transparent; border:none; font-size:100%; margin:0; outline:none; padding:0; vertical-align:baseline; } a { outline:none; text-decoration:none; } abbr:hover, acronym:hover { border-bottom:1px dotted #9e9e9c; cursor:help; } address { font-style:normal; } blockquote, q { quotes:none; } h1, h2, h3, h4, h5, h6 { font-size:1em; font-family:"Trebuchet MS",Arial,Helvetica,sans-serif; font-weight:normal; } html { height:101%; } fieldset, img { border:medium none; } input, button, select, textarea { font-family:Verdana,Geneva,sans-serif; font-size:1em; } label { cursor:pointer; } ol, ul { list-style:none; } :focus { outline:none; } /*LAYOUT*/ body { background:#FFF url(/assets/img/body.jpg) repeat-x; color:#4E4B4A; font:10px/1.5 Verdana,Geneva,sans-serif; height:100%; margin:0 auto; min-width:980px; } #container { background:url(/assets/img/container.jpg) repeat-y; margin:0 auto; position:relative; width:960px; } /*HEADER*/ #header { background:#FFF; border-top:12px solid #FAF6F0; color:#808080; overflow:hidden; padding:48px 0 24px; width:960px; } #header h1 { background:url(/assets/img/logo.jpg) no-repeat; border-right:2px solid #C4DEDF; float:left; height:63px; overflow:hidden; text-indent:-999em; width:268px; } #header h2 { float:right; font:normal 400 17px/63px "Trebuchet MS",Arial,Helvetica,sans-serif; letter-spacing:2px; padding:0 24px; text-transform:uppercase; width:642px; } #header p { float:right; font:normal 400 11px/2.0 "Trebuchet MS",Arial,Helvetica,sans-serif; letter-spacing:2px; padding:0 24px; text-transform:uppercase; width:642px; } /*NAV*/ #nav { background:#C4DEDF url(/assets/img/nav.jpg) no-repeat; height:41px; overflow:hidden; padding:0 0 0 42px; width:918px; } #nav a { color:#000; display:block; font:normal 400 17px/41px "Trebuchet MS",Arial,Helvetica,sans-serif; letter-spacing:2px; padding:0 18px; } #nav a b { color:#F8792C; } #nav a:hover { color:#F8792C; } #nav a:hover b { color:#000; } #nav li { float:left; } #nav li.home a:hover, #home #nav li.home a { background:url(/assets/img/nav.jpg) no-repeat -42px 100%; } #nav li.services a:hover, #services #nav li.services a { background:url(/assets/img/nav.jpg) no-repeat -129px 100%; } #nav li.experience a:hover, #experience #nav li.experience a { background:url(/assets/img/nav.jpg) no-repeat -244px 100%; } #nav li.reviews a:hover, #reviews #nav li.reviews a { background:url(/assets/img/nav.jpg) no-repeat -383px 100%; } #nav li.addenda a:hover, #addenda #nav li.addenda a { background:url(/assets/img/nav.jpg) no-repeat -496px 100%; } #nav li.contact { float:right; } #nav li.contact a { color:#F8792C; text-align:center; padding:0; width:144px; } #nav li.contact a:hover { background:url(/assets/img/nav.jpg) no-repeat -816px 100%; color:#FFF; } /*CONTENT*/ #content { overflow:hidden; position:relative; width:960px; } /*CONTENT-INTRO*/ #content-intro { background:url(/assets/img/intro.jpg) no-repeat; height:42px; position:relative; } #content-intro blockquote { font:normal 400 17px/1.2 "Trebuchet MS",Arial,Helvetica,sans-serif; left:300px; letter-spacing:1px; position:absolute; top:267px; width:600px; } #content-intro blockquote cite { color:#000; display:block; float:right; font-size:18px; font-style:normal; } #content-intro p.attribution { bottom:3px; color:#808080; font:normal 400 11px/1.5 Arial, Helvetica, sans-serif; position:absolute; right:258px; } #content-intro p.attribution a { color:#808080; } #content-intro p.attribution a:hover { text-decoration:underline; } /*CONTENT-MAIN*/ #content-main { float:left; padding:30px 60px; width:588px; } #content-main a { color:#3E8FBC; } #content-main a:hover { color:#F8792C; text-decoration:underline; } #content-main blockquote { padding:0 0 15px; } #content-main blockquote cite { display:block; text-align:right; } #content-main li { margin:0 0 0 30px; } #content-main h3 { font-size:18px; font-weight:700; letter-spacing:1px; margin:0 0 15px; } #content-main h3.addenda { font-size:24px; } #content-main h3:target { color:#3E8FBC; } #content-main h4 { font-size:15px; font-weight:700; letter-spacing:1px; } #content-main p, #content-main ul { font-size:12px; margin:0 0 15px; } #content-main ul { list-style:disc; } #content-main ul ul { list-style:circle; } /*CONTENT-SIDEBAR*/ #content-sidebar { float:right; padding:0 0 9px; position:relative; width: 252px; z-index:100; } #content-sidebar a { color:#F8792C; } #content-sidebar a:hover { color:#3E8FBC; text-decoration:underline; } #content-sidebar h3 { background:#FFF; height:106px; font:normal 700 18px/2.0 "Trebuchet MS",Arial,Helvetica,sans-serif; padding:72px 24px; text-align:center; } #content-sidebar h4 { background:#F8792C; color:#FFF; font-size:24px; line-height:1.2; margin:0 0 9px; overflow:hidden; padding:24px; width:204px; } #content-sidebar h4.news { padding:24px 24px 12px; font-size:12px; } #content-sidebar h4.news big { float:left; font-size:24px; padding:0 6px 24px 0; margin:-12px 0 0; } #content-sidebar h4.news strong { color:#000; font:normal 400 13px/1.2 "Trebuchet MS",Arial,Helvetica,sans-serif; display:block; } #content-sidebar h4.news em { font-size:18px; font-style:normal; } #content-sidebar h5 { font-size:18px; line-height:2.0; padding:9px 21px; } #content-sidebar p { font-size:11px; padding:9px 21px; } #content-sidebar ul { font-size:11px; list-style:disc; padding:9px 21px; } #content-sidebar ul ul { font-size:11px; list-style:circle; padding:0; } #content-sidebar li { margin:0 0 0 18px; } /*FOOTER*/ #footer address { background: url(/assets/img/footer.jpg) no-repeat 50% 0; color:#000; font:normal 400 12px/1.5 "Trebuchet MS",Arial,Helvetica,sans-serif; padding:24px 0 24px 300px; width:660px; } #footer address b { color:#FFF; } #footer address big { font-size:15px; font-weight:700; text-transform:lowercase; } #footer address i { color:#808080; } #footer ul { background:#FFF; text-align:center; padding:9px 0 18px; } #footer ul a { color:#000; } #footer ul a:hover { color:#F8792C; text-decoration:underline; } #footer ul li { border-left:1px solid #808080; display:inline; padding:0 9px; } #footer ul li:first-child { border:none; } /*HOME*/ #home #content-intro { background:url(/assets/img/intro.jpg) no-repeat; height:389px; } #home #content-main, #addenda #content-main { padding-bottom:90px; } #home #content-main h3, #content-main h3.tagline { background:url(/assets/img/escape.jpg) repeat-y; bottom:0; color:#000; font:normal 400 17px/66px "Trebuchet MS",Arial,Helvetica,sans-serif; left:0; letter-spacing:2px; margin:0; position:absolute; text-indent:60px; width: 708px; } /*SERVICES*/ #services #content-intro { background:url(/assets/img/services.jpg) no-repeat; height:250px; } #services #content-intro a, #services #content-intro p { color:#FFF; } #services #content-sidebar { margin-top:-250px; } /*EXPERIENCE*/ #experience #content-intro { background: url(/assets/img/experience.jpg) no-repeat; height:250px; } #experience #content-intro a, #experience #content-intro p { color:#FFF; } #experience #content-sidebar { margin-top:-250px; } /*REFERENCES*/ #references #content-intro { background:url(/assets/img/references.jpg) no-repeat; height:250px; } #references #content-intro a, #references #content-intro p { color:#FFF; } #references #content-sidebar { margin-top:-250px; } /*ADDENDA*/ #addenda #content-intro { background:url(/assets/img/addenda.jpg) no-repeat; height:250px; } #addenda #content-intro a, #addenda #content-intro p { color:#FFF; } #addenda #content-sidebar { margin-top:-250px; } /*CONTACT*/ #contact #content-intro { background:url(/assets/img/contact.jpg) no-repeat; height:250px; width:708px; } #contact #content-intro p.attribution { right:6px; } #contact #content-intro a, #contact #content-intro p { color:#F8792C; } #contact #content-sidebar { margin-top:-250px; } #gdirections, #gform { padding:9px 21px; } #gform button { background:url(/assets/img/route.jpg) no-repeat 50% 0; border:none; color:#FFF; font:normal 700 12px/20px "Trebuchet MS",Arial,Helvetica,sans-serif; height:20px; letter-spacing:1px; text-align:center; width:51px } #gform button:hover { background-position:50% 100%; } #gform input { border:1px solid #C4DEDF; margin:0 0 9px 0; padding:3px 2px; } #gform input:focus { border-color:#3E8FBC; } #inquiry { font-size:12px; margin:0 0 15px; } #inquiry button { background:url(/assets/img/button.jpg) no-repeat; border:none; color:#FFF; font:normal 700 15px/32px "Trebuchet MS",Arial,Helvetica,sans-serif; float:right; height:32px; letter-spacing:2px; text-align:center; width:111px } #inquiry button:hover { background-position:0 100%; } #inquiry em { color:#F8792C; font-style:normal; font-weight:bold; } #inquiry label.error { color: red; font-size:10px; padding-left: 6px; vertical-align:middle; } #inquiry input, #inquiry textarea { border:1px solid #C4DEDF; margin:0 0 9px 0; padding:3px 2px; } #inquiry input:focus, #inquiry textarea:focus { border-color:#3E8FBC; } #inquiry textarea { height:90px; width:582px; } /*TERMS/ERROR*/ #terms #content-intro, #error #content-intro { background:url(/assets/img/terms.jpg) no-repeat; height:250px; } #terms #content-intro a, #terms #content-intro p, #error #content-intro a, #error #content-intro p { color:#FFF; } #terms #content-sidebar, #error #content-sidebar { margin-top:-250px; } /*TOMBSTONES*/ #content-main ul.tombstones { overflow:hidden; font-size:10px; list-style:none; margin:0 0 15px -24px; text-align:center; width:627px; } #content-main ul.tombstones li { border:1px solid #C4DEDF; float:left; height:158px; margin:0 9px 9px 0; position:relative; width:198px; } #content-main ul.tombstones li:hover { border-color:#3E8FBC; } #content-main ul.tombstones li em { bottom:3px; position:absolute; left:3px; width:192px; z-index:50; } #content-main ul.tombstones li big { color:#3E8FBC; display:block; font:normal 700 18px/158px "Trebuchet MS", Arial, Helvetica, sans-serif; left:0; overflow:hidden; position:absolute; top:0; width:198px; z-index:25; } #content-main ul.tombstones li:hover big { color:#F8792C; } #content-main ul.tombstones li strong { font-size:11px; left:3px; position:absolute; top:3px; width:192px; z-index:50; } big.adaptix { background:url(/experience/logos/adaptix.jpg) no-repeat 50% 50%; text-indent:-999em; } big.athandgear { background: url(/experience/logos/athandgear.jpg) no-repeat 50% 50%; text-indent:-999em; } big.bigscreenlive { background:url(/experience/logos/bigscreen.jpg) no-repeat 50% 50%; text-indent:-999em; } big.centerspace { background:url(/experience/logos/centerspace.jpg) no-repeat 50% 50%; text-indent:-999em; } big.digitalscirocco { background: url(/experience/logos/digitalscirocco.jpg) no-repeat 50% 50%; text-indent:-999em; } big.genelex { background:url(/experience/logos/genelex.jpg) no-repeat 50% 50%; text-indent:-999em; } big.glacierbay { background:url(/experience/logos/glacierbay.jpg) no-repeat 50% 50%; text-indent:-999em; } big.intelepeer { background:url(/experience/logos/intelepeer.jpg) no-repeat 50% 50%; text-indent:-999em; } big.mindmatters { background:url(/experience/logos/mindmatters.jpg) no-repeat 50% 50%; text-indent:-999em; } big.nearlyweds { background:url(/experience/logos/nearlyweds.jpg) no-repeat 50% 50%; text-indent:-999em; } big.sorea { background:url(/experience/logos/sorea.jpg) no-repeat 50% 50%; text-indent:-999em; } big.wpx { background: url(/experience/logos/wpx.jpg) no-repeat 50% 60%; text-indent:-999em; } big.zipper { background:url(/experience/logos/zipper-interactive.jpg) no-repeat 50% 50%; text-indent:-999em; } /*DigitalScirocco*/ #content-sidebar .ds-slot { padding:9px 21px; } #content-sidebar .ds-title { font-size:11px; font-weight:700; } #content-sidebar .ds-byline { font-style:italic; } #content-sidebar .ds-body { text-align:justify; } #content-main .ds-title { font-size:15px; font-weight:700; letter-spacing:1px; margin:0 0 15px; } #content-main .ds-byline { font-style:italic; } #content-main .ds-body img{ margin:5px; max-width:588px; height: auto; } /*CLASSES*/ .left { float:left; margin:0 1em 1em 0; } .right { float:right; margin:0 0 1em 1em; }