/* -------------------------------------------------------------- MAIN CSS HOPENHAGEN -------------------------------------------------------------- */ body, html { height: 100%; width: 100%; margin: 0; padding: 0; text-align: center; background-color: #0F0F0F; } body { min-width: 1000px; min-height: 890px;} /* TYPOGRAPHY -------------------------------------------------------------- */ body { color: #969696; font-size: 75%; font-family: helvetica, Arial,Verdana,sans-serif; font-weight:300; } h1 { color: #FFFFFF; font-size: 2.5em; font-weight: normal;} h2 { color: #FE7E01; font-size: 2em; font-weight: bold;} h3 { color: #73DF02; font-size: 1.5em; font-weight:bold; } h4 { color: #0865FF; font-size: 1.5em; font-weight:bold; } h5 { color: #FFFFFF; font-size: 1.5em; font-weight:bold; } h3, h4, h5 { margin: 0; padding: 0; } a, a:active, a:visited { color:#FE7E01; cursor:pointer; font-weight:bold; text-decoration:none; outline: none; } a img { border: none; } a:hover { color: #FFFFFF; } .white-text { color: #FFFFFF; } .large-text { font-size: 1.2em; line-height: 1.4em; } #reportDetail p { color: #FFFFFF; font-size: 1.3em; line-height: 1.5em; height: 7em;} #whatsRoambi p, #emailReports p { margin-top: .5em; } /* BRANDING -------------------------------------------------------------- */ #branding { margin: 0 auto; margin-top: 15px; background: transparent url(http://assets.roambi.com/img/cdp/branding-bar-middle.png) repeat-x; height: 62px; width: 1050px; } #branding .left { background: transparent url(http://assets.roambi.com/img/cdp/branding-bar-left.png) no-repeat; height: 62px; width: 30px; float: left; } #branding .right { background: transparent url(http://assets.roambi.com/img/cdp/branding-bar-right.png) no-repeat; height: 62px; width: 30px; float: right; } #branding .logo { background: transparent url(http://assets.roambi.com/img/cdp/roambi-logo.gif) no-repeat; height: 44px; width: 130px; float: left; position: relative; top: 7px; left: -10px; } #branding .logo a { display: block; width: 100%; height: 100%; } #branding .title { background: transparent url(http://assets.roambi.com/img/cdp/branding-title-2.gif) no-repeat; height: 40px; width: 300px; float: left; position: relative; top: 10px; } #branding .shareIt { float: right; position: relative; top: 18px; } /* LAYOUT -------------------------------------------------------------- */ #content { margin: 0 auto; width: 1000px; position: relative; top: 25px; right: 10px; } #content .left { float: left; width: 375px; } #content .right { float: right; width: 620px; } #contentBody { text-align: left; } #iphone { background: transparent url(http://assets.roambi.com/img/cdp/iphone-frame.jpg) no-repeat; width: 360px; height: 625px; text-align: left; } #roambiSWF{ width: 268px; height: 402px; position: relative; top: 107px; left: 41px; } #SWFObjectExprInst { width: 268px; height: 402px; position: relative; top: 107px; left: 41px; } #downloadRoambi { text-align: left; width: 270px; position: relative; left: 40px; } .widget-box-row { height: 20em; } #reportDetail { padding: 10px; margin-top: 60px;} #emailReports { float: left; width: 290px; } #emailReports form ul { margin: 0; padding: 0; list-style: none; } #emailReports form li { line-height: 2em; vertical-align: middle; } #emailReports form .align-right { text-align: right; } #emailReports form input[type=text]{ width: 97%; } #emailReports form input[type=button]{ position: relative; top: 15px; right: 0px;} #whatsRoambi { float: right; width: 290px; } #emailReports, #whatsRoambi { height: 100%; } #moreSamples { position: relative; top: 25px; } #moreSamples .content { padding: 10px; } /* NAVIGATION -------------------------------------------------------------- */ #menu ul { margin: 0; padding: 0; } #menu li { display: block; float: left; text-indent:-300em; } #menu li a { display: block; height: 46px; } #menu-1 { background: url(http://assets.roambi.com/img/cdp/menu-1.png) no-repeat; width: 156px; } #menu-1.selected { background: url(http://assets.roambi.com/img/cdp/menu-1-selected.png) no-repeat; } #menu-2 { background: url(http://assets.roambi.com/img/cdp/menu-2.png) no-repeat; width: 148px; } #menu-2.selected { background: url(http://assets.roambi.com/img/cdp/menu-2-selected.png) no-repeat; } #menu-3 { background: url(http://assets.roambi.com/img/cdp/menu-3.png) no-repeat; width: 167px; } #menu-3.selected { background: url(http://assets.roambi.com/img/cdp/menu-3-selected.png) no-repeat; } #menu-4 { background: url(http://assets.roambi.com/img/cdp/menu-4.png) no-repeat; width: 142px; } #menu-4.selected { background: url(http://assets.roambi.com/img/cdp/menu-4-selected.png) no-repeat; } /* FOOTER -------------------------------------------------------------- */ #footer { margin: 0 auto; width: 100%; clear: both; position: relative; top: 60px; padding-bottom: 20px;} #footer ul { list-style: none; margin: 0; padding: 0; } #footer li { display: inline; padding: 0px 10px; text-align: center; color: #404040; border-right:1px solid #646464; } #footer li.no-border { border-style: none; } #footer a { color: #969696; font-weight: bold; } #footer p { line-height: 1.5em; } #footer img { margin-top: 10px; } /* FORM ELEMENTS -------------------------------------------------------------- */ input[type=button], button { font-size: 1em; font-weight: bold; color: #222222; padding: .5em 20px; border-style: none; cursor: pointer; background: #464646 url(http://assets.roambi.com/img/cdp/buttonMidGray.png) repeat-x; text-shadow: 1px 1px 1px #949494; -moz-border-radius: 15px; -webkit-border-radius: 15px; } input[type=text] { background-color:#191919; color: #FFFFFF; font-weight: bold; border:1px solid #474747; padding: .7em 0px .7em .5em; -moz-border-radius: 2px; -webkit-border-radius: 2px; } /* COMPONENTS -------------------------------------------------------------- */ .widget-box { border: solid 1px #333333; background-color: #070707; } .widget-box-content { margin: 20px; } /* EFFECTS -------------------------------------------------------------- */ .drop-shadow-dark { -webkit-box-shadow: 0px 4px 4px #0B0B0B; -moz-box-shadow: 0px 4px 4px #0B0B0B; } .drop-shadow-light { -webkit-box-shadow: 0px 3px 3px #292929; -moz-box-shadow: 0px 3px 3px #292929; } .rounded-corners-small { -moz-border-radius: 2px; -webkit-border-radius: 2px; } .rounded-corners-medium { -moz-border-radius: 12px; -webkit-border-radius: 12px; } .rounded-corners-thick { -moz-border-radius: 15px; -webkit-border-radius: 15px; } .rounded-corners-top-medium { -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; -webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; }