/**************************************** Project Move Media Kit Author Monica Christopher Version Last Change TOC 1. Core Styles 2. Header Styles 3. Nav Styles 4. Content Styles 5. Footer Styles Colors Base Text #6a6a6a Red #f43b47 Blue #0865a8 Grey #f5f5f5 /***************************************/ /* 1. Core Styles */ * { margin: 0; padding: 0; border: none; list-style: none; outline: none; } body { background: #fff; color: #6a6a6a; font-size: 12px; font-family: Geneva, "Helvetica Neue", Helvetica, Arial, sans-serif; outline: none; } img { border: none; } p { font-size: 1em; line-height: 1.5em; margin: 0 0 1em 0; } h1 { font-size: 2em; line-height: 1.5em; margin-top: 0.75em; margin-bottom: 0em; } h2 { font-size: 1.8333em; line-height: 1.6364em; margin-top: 0.8182em; margin-bottom: 0em; } h3 { font-size: 1.6667em; line-height: 1.8em; margin-top: 0.9em; margin-bottom: 0em; } h4 { font-size: 1.5em; line-height: 1em; margin-top: 1em; margin-bottom: 0em; } h5 { font-size: 1.3333em; line-height: 1.125em; margin-top: 1.125em; margin-bottom: 0em; } h6 { font-size: 1.1667em; line-height: 1.2857em; margin-top: 1.2857em; margin-bottom: 0em; } a:link, a:visited { color: #0865a8; text-decoration: underline; } a:hover { color: #f43b47; } #wrapper { width: 930px; margin: 0 auto; } #header-wrap { } #content-wrap { overflow: auto; zoom: 1; } #footer-wrap { clear: both; } /* 2. Header Styles */ #header { overflow: auto; zoom: 1; } #header h1 { float: left; padding-left: 20px; } /* 3. Nav Styles */ #topnav { float: right; width: 701px; height: 119px; background: url(../_images/bg-nav.png) top left no-repeat; } #topnav ul { margin: 60px 0 0 17px; } #topnav ul li { display: inline; } #topnav ul li a:link, #topnav ul li a:visited { float: left; text-align: left; font-size: 1.2em; color: #fff; text-decoration: none; padding: 0 10px 0 16px; } #topnav ul li a:hover { background: url(../_images/arrow.png) 0 2px no-repeat; } .home { } .reach { } .adspecs { } .psycho { } .contact { } /* 4. Content Styles */ #contentwide { background: url(../_images/bg-content-large.png) bottom left no-repeat; padding-bottom: 20px; overflow: auto; zoom: 1; } #contentwide h2 { margin-left: 15px; margin-right: 18px; padding: 0 0 7px 7px; border-bottom: 1px solid #ccc; } #contentwide address { float: left; padding: 0 10px 20px 0; width: 235px; height: 110px; font-size: 1.2em; } #contentwide address strong { font-style: normal; } #contentwide address span { font-style: normal; color: #0865a8; } #contentwide #addresses h4 { padding-bottom: 10px; } form { float: left; margin: 20px; width: 355px; height: 500px; border-right: 1px solid #efefef; } fieldset { width: 350px; } form legend { font-size: 1.3em; padding: 0 0 20px 0; font-weight: bold; } form legend span { font-size: 0.75em; display: block; } form li { overflow: auto; zoom: 1; margin-bottom: 7px; } form label { width: 100px; float: left; text-align: right; padding-right: 5px; } form input { width: 200px; border: 1px solid #ccc; color: #6a6a6a; } form input.button { width: auto; border: none; color: #6a6a6a; } form select { width: 202px; border: 1px solid #ccc; color: #6a6a6a; } form textarea { width: 200px; border: 1px solid #ccc; color: #6a6a6a; } #leftnav { float: left; width: 206px; height: 376px; margin: 18px 0 0 0; background: url(../_images/leftnav.png) top left no-repeat; } #leftnav ul { margin: 10px 0 0 2px; } #leftnav ul li { margin-top: 10px; padding-bottom: 5px; } #leftnav ul li a { padding: 3px 0 4px 38px; font-size: 1.2em; color: #6a6a6a; text-decoration: none; background-position: 3px -26px; background-repeat: no-repeat; } #leftnav ul li a:hover { color: #0865a8; background-position: 3px 0px; } #leftnav ul li a.key { background-image: url(../_images/navicons/key-measures.png); background-repeat: no-repeat; } #leftnav ul li a.demograph { background-image: url(../_images/navicons/demographics.png); background-repeat: no-repeat; } #leftnav ul li a.finance { background-image: url(../_images/navicons/finance.png); background-repeat: no-repeat; } #leftnav ul li a.engagement { background-image: url(../_images/navicons/local_targeting2.png); background-repeat: no-repeat; } #leftnav ul li a.lifecycle { background-image: url(../_images/navicons/audience_life_cycle.png); background-repeat: no-repeat; } #leftnav ul li a.realestate { float: left; background: url(../_images/navicons/The-Real-Estate-Category.png) 3px -34px no-repeat; } #leftnav ul li a.realestate:hover { background-position: 3px 2px; } #leftnav ul li a.psychographics { background-image: url(../_images/navicons/key-measures.png); background-repeat: no-repeat; } #leftnav ul li a.triggers { background-image: url(../_images/navicons/lifetriggers.png); background-repeat: no-repeat; } #leftnav ul li a.prizm { background-image: url(../_images/navicons/prizm-data.png); background-repeat: no-repeat; } #leftnav ul li ul { clear: left; margin: 4px 0 0 56px; } #leftnav ul li ul li { padding: 0 0 0 0; margin-top: 3px; list-style: circle outside; } #leftnav ul li ul li a { padding: 0; } table { width: 650px; border-collapse: collapse; margin: 2em; } table th { font-size: 1.1em; padding: 4px; background: #074b7c; color: #fff; } table th.empty { } table td { padding: 3px; text-align: center; } table td:first-child { text-align: left; padding-left: 10px; } table tr.subhead td { border-bottom: 1px solid #ccc; } table tr.highlight td { background: #ececec; } table tr.move td { background: url(../_images/move-tdbg.png) bottom left repeat-x; font-weight: bold; color: #fff; font-size: 1.15em; } p.footnote { font-size: 0.75em; text-align: right; } span.footnote { font-size: 0.75em; text-align: right; float: right; padding-right: 40px; font-weight: normal; } #shortcontent { margin: 0 0 0 220px; padding-bottom: 20px; width: 706px; background: url(../_images/bg-content.png) bottom left no-repeat; border-top: 1px solid #fff; position: relative;} #shortcontent h2 { font-size: 18px; font-weight: normal; margin-left: 15px; margin-right: 18px; padding: 7px 0 7px 7px; border-bottom: 1px solid #ccc; } #shortcontent h2.png { padding: 7px 0 7px 35px; background: url(../_images/reach.png) 0 6px no-repeat; } #shortcontent h5 { font-size: 16px; font-weight: bold; margin-left: 1.5em; } #shortcontent h6 { font-weight: bold; margin-left: 1.5em; } #shortcontent p { padding: 10px 21px 0; } #shortcontent ul { padding: 10px 50px; } #shortcontent ul li { list-style: disc outside; margin-bottom: 7px; } #shortcontent dl.graph { margin: 10px 0 0 21px; overflow: hidden; zoom: 1;} #shortcontent dl.graph#engagement { background: url(../_images/graph-310pxwide.png) 204px 0 no-repeat; padding-top: 3em; } #shortcontent dl.graph dt { display: block; float: left; width: 150px; text-align: right; font-size: 1.2em; line-height: 1.2em; padding-right: 7px; } #shortcontent dl.graph#engagement dt { width: 200px; } #shortcontent dl.graph dd { margin: 0 0 7px 0; width: 450px; background: url(../_images/graph-end.png) left center no-repeat; padding-left: 3px; overflow: auto; zoom: 1; } #shortcontent dl.graph#engagement dd { width: 320px; } #shortcontent dl.graph dd span { float: left; background: url(../_images/graph-bar-blue.png) right center no-repeat; } #shortcontent dl.graph dd span.move { background: url(../_images/graph-bar.png) right center no-repeat; } #shortcontent dl.graph dd span em { visibility: hidden; } #shortcontent dl.graph dd span.w5 { width: 5%; } #shortcontent dl.graph dd span.w6 { width: 6%; } #shortcontent dl.graph dd span.w7 { width: 7%; } #shortcontent dl.graph dd span.w10 { width: 10%; } #shortcontent dl.graph dd span.w11 { width: 11%; } #shortcontent dl.graph dd span.w12 { width: 12%; } #shortcontent dl.graph dd span.w13 { width: 13%; } #shortcontent dl.graph dd span.w15 { width: 15%; } #shortcontent dl.graph dd span.w17 { width: 17%; } #shortcontent dl.graph dd span.w20 { width: 20%; } #shortcontent dl.graph dd span.w22 { width: 22%; } #shortcontent dl.graph dd span.w23 { width: 23%; } #shortcontent dl.graph dd span.w24 { width: 24%; } #shortcontent dl.graph dd span.w25 { width: 25%; } #shortcontent dl.graph dd span.w26 { width: 26%; } #shortcontent dl.graph dd span.w27 { width: 27%; } #shortcontent dl.graph dd span.w30 { width: 30%; } #shortcontent dl.graph dd span.w31 { width: 31%; } #shortcontent dl.graph dd span.w34 { width: 34%; } #shortcontent dl.graph dd span.w35 { width: 35%; } #shortcontent dl.graph dd span.w39 { width: 39%; } #shortcontent dl.graph dd span.w40 { width: 40%; } #shortcontent dl.graph dd span.w43 { width: 43%; } #shortcontent dl.graph dd span.w44 { width: 44%; } #shortcontent dl.graph dd span.w45 { width: 45%; } #shortcontent dl.graph dd span.w49 { width: 49%; } #shortcontent dl.graph dd span.w50 { width: 50%; } #shortcontent dl.graph dd span.w51 { width: 51%; } #shortcontent dl.graph dd span.w52 { width: 52%; } #shortcontent dl.graph dd span.w53 { width: 53%; } #shortcontent dl.graph dd span.w55 { width: 55%; } #shortcontent dl.graph dd span.w60 { width: 60%; } #shortcontent dl.graph dd span.w65 { width: 65%; } #shortcontent dl.graph dd span.w67 { width: 67%; } #shortcontent dl.graph dd span.w70 { width: 70%; } #shortcontent dl.graph dd span.w72 { width: 72%; } #shortcontent dl.graph dd span.w75 { width: 75%; } #shortcontent dl.graph dd span.w80 { width: 80%; } #shortcontent dl.graph dd span.w85 { width: 85%; } #shortcontent dl.graph dd span.w90 { width: 90%; } #shortcontent dl.graph dd span.w95 { width: 95%; } #shortcontent dl.graph dd span.w100 { width: 99%; } #shortcontent dl.chart { margin: 20px 30px 0; overflow: auto; zoom: 1;} #shortcontent dl.chart dt { display: none; } #shortcontent dl.chart dd { float: left; margin-right: 10px; width: 13px; height: 250px; background: url(../_images/chart-end.png) bottom center no-repeat; padding-bottom: 3px; position: relative; } #shortcontent dl.chart dd span { display: block; width: 13px; position: absolute; bottom: 3px; background: url(../_images/chart-bar-blue.png) top center no-repeat; } #shortcontent dl.chart dd span.move { background: url(../_images/chart-bar.png) top center no-repeat; } #shortcontent dl.chart dd span em { visibility: hidden; float: left; font-style: normal; font-size: 1px; font-weight: bold; writing-mode: tb-rl; filter: flipv fliph; color: #000; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); } #shortcontent dl.chart dd span.w5 { height: 5%; } #shortcontent dl.chart dd span.w10 { height: 10%; } #shortcontent dl.chart dd span.w15 { height: 15%; } #shortcontent dl.chart dd span.w20 { height: 20%; } #shortcontent dl.chart dd span.w25 { height: 25%; } #shortcontent dl.chart dd span.w30 { height: 30%; } #shortcontent dl.chart dd span.w35 { height: 35%; } #shortcontent dl.chart dd span.w40 { height: 40%; } #shortcontent dl.chart dd span.w45 { height: 45%; } #shortcontent dl.chart dd span.w50 { height: 50%; } #shortcontent dl.chart dd span.w55 { height: 55%; } #shortcontent dl.chart dd span.w60 { height: 60%; } #shortcontent dl.chart dd span.w65 { height: 65%; } #shortcontent dl.chart dd span.w70 { height: 70%; } #shortcontent dl.chart dd span.w75 { height: 75%; } #shortcontent dl.chart dd span.w80 { height: 80%; } #shortcontent dl.chart dd span.w85 { height: 85%; } #shortcontent dl.chart dd span.w90 { height: 90%; } #shortcontent dl.chart dd span.w95 { height: 95%; } #shortcontent dl.chart dd span.w100{ height: 99%; } #shortcontent dl.chart dd span.w42 { height: 42%; } #shortcontent dl.chart dd span.w37 { height: 37%; } #shortcontent dl.chart dd span.w28 { height: 28%; } div#callout { position: absolute; top: 550px; left: 350px; padding: 15px 40px 20px; background: url(../ouraudience/engagement/callout.png) top center no-repeat; color: #fff; font-weight: bold; } /* 5. Footer Styles */ #footer { padding: 20px 0; text-align: center; overflow: auto; zoom: 1; } #footer p { font-size: 0.9em; margin: 0; } #footer p a { text-decoration: none; }