@import url("base.css");

html {
    overflow-x: hidden;
    overflow-y: auto;
}
body {
    text-align: center;
    width: 100%;
    height: 100%;
    background: #FAFAFA;
}
h1, h2, h3, label {
    color: #193557;
    font-family: "museo-sans-1" , "museo-sans-2" , "Museo Sans" , "Segoe UI" , "Helvetica Neue" , Arial, Sans-Serif;
    font-weight: 500;
}
h1 {
    font-size: 2.2em;
}
h2 {
    font-size: 1.8em;
}
h3 {
    color: #3C6700;
    font-size: 1.6em;
}
p {
    font-size: 1.1em;
    line-height: 1.4em;
}
input, textarea {
    font-family: "Segoe UI" , "Helvetica Neue" , Arial, Sans-Serif;
    font-size: 1.2em;
}
span.optional {
    color: #73829d;
}
label {
    font-size: 1.2em;
}
label span.optional {
    font-size: .8em;
    padding: 0 0 0 1em;
}
a {
    color: #3C6700;
}
a.btn, a.btn-arrow {
    float: left;
    display: block;
    background: url(/media/img/home/btn-arrow.png) no-repeat left top;
}
a.btn span, a.btn-arrow span {
    display: block;
    color: #FFF;
    font-family: "museo-sans-1" , "museo-sans-2" , "Museo Sans" , "Segoe UI" , "Helvetica Neue" , Arial, Sans-Serif;
    font-size: 1.3em;
    font-weight: bold;
    padding: 4px 50px 10px 5px;
    position: relative;
    right: -30px;
    background: url(/media/img/home/btn-arrow.png) no-repeat right top;
}
a.btn:hover, a.btn-arrow:hover {
    background-position: left -60px;
}
a.btn:hover span, a.btn-arrow:hover span {
    background-position: right -60px;
}
a.btn-arrow span {
    font-size: 1.1em;
    padding: 7px 40px 10px 5px;
}
.shell {
    position: relative;
    width: 960px;
    text-align: left;
    margin: 0 auto;
}
/*----------------------------------------------------------------*/
#top {
    position: relative;
    height: 400px;
    font-family: "museo-sans-1" , "museo-sans-2" , "Museo Sans" , "Segoe UI" , "Helvetica Neue" , Arial, Sans-Serif;
    font-weight: 500;
    background: #3A6697;
    border-top: solid 3px #F76400;
}
#top a.flipto {
    display: block;
    width: 90px;
    height: 70px;
    background: url(/media/img/home/flipto-white.png) no-repeat;
    z-index: 15;
}
#top.home a.flipto {
    position: absolute;
    top: 12px;
    left: 4px;
}
#top ul.nav {
    position: absolute;
    right: 0;
    z-index: 15;
}
#top ul.nav li {
    float: left;
    display: inline;
}
#top ul.nav li a {
    font-size: 1.1em;
    display: block;
}
#top ul.nav li a.signin {
    color: #EEE;
    text-align: center;
    height: 24px;
    width: 104px;
    padding: 6px 0 0 0;
    background: url(/media/img/home/signin.png) no-repeat center bottom;
}
#top ul.nav li a.signin:hover {
    color: #FFF;
}
#top h1 {
    color: #FFF;
    padding: 0 0 4px 0;
}
#top p {
    color: #B6D5F0;
    font-size: 1.3em;
}
#top #intro {
    position: absolute;
    top: 70px;
    width: 100%;
    text-align: center;
    z-index: 15;
}
#top #intro p {
    margin: 0 180px;
}
#top #map-glow {
    position: absolute;
    width: 960px;
    height: 533px;
    background: url(/media/img/home/map-bg-glow.png) no-repeat center bottom;
}
/*----------------------------------------------------------------*/
#top #map {
    position: absolute;
    width: 1501px;
    height: 839px;
    top: -100px;
    left: -300px;
    background: url(/media/img/home/map.png) no-repeat;
    z-index: 10;
}
#top #map .point {
    display: none;
    overflow: visible;
    position: absolute;
    width: 400px;
}
#top #map .point .post {
    position: relative;
    top: 4px;
    left: -20px;
    color: #193557;
    padding: 4px;
    background: url(/media/img/home/bg-light-primary.png) repeat;
    -moz-border-radius: 4px;
    border-radius: 4px;
    z-index: 5;
}
#top #map .point .post .profile {
    float: left;
    width: 50px;
    height: 50px;
    background: no-repeat center;
}
#top #map .point .post .message, #top #map .point .post .time {
    margin: 0 0 0 60px;
}
#top #map .point .post .message {
    font-size: 1.2em;
    line-height: 1.4em;
    padding: 0 10px 2px 0;
    font-family: "museo-sans-1" , "museo-sans-2" , "Museo Sans" , "Segoe UI" , "Helvetica Neue" , Arial, Sans-Serif;
}
#top #map .point .post .message a {
    color: #3C6700;
}
#top #map .point .post .time {
    color: #73829D;
}
#top #map .point .marker {
    position: relative;
    width: 40px;
    height: 32px;
    background: url(/media/img/home/map-marker.png) no-repeat;
    z-index: 10;
}
/*----------------------------------------------------------------*/
#top #map.Chicago {
    top: -60px;
    left: -320px;
}
#top #map.Chicago .point {
    top: 290px;
    left: 380px;
}
#top #map.Mesquite {
    top: -100px;
    left: -200px;
}
#top #map.Mesquite .point {
    top: 290px;
    left: 250px;
}
#top #map.Oahu, #top #map.Maui, #top #map.Kauai {
    top: -200px;
    left: 300px;
}
#top #map.Oahu .point, #top #map.Maui .point, #top #map.Kauai .point {
    top: 380px;
    left: 130px;
}
#top #map.London {
    top: -40px;
    left: -160px;
}
#top #map.London .point {
    top: 215px;
    left: 725px;
}
#top #map.CapeTown {
    top: -360px;
    left: -400px;
}
#top #map.CapeTown .point {
    top: 615px;
    left: 810px;
}
#top #map.KualaLumpur, #top #map.KotaDamansara, #top #map.KotaKinablu {
    top: -200px;
    left: -600px;
}
#top #map.KualaLumpur .point, #top #map.KotaDamansara .point, #top #map.KotaKinablu .point {
    top: 455px;
    left: 1178px;
}
#top #map.Kuching {
    top: -240px;
    left: -645px;
}
#top #map.Kuching .point {
    top: 456px;
    left: 1215px;
}
#top #map.Bintulu {
    top: -245px;
    left: -650px;
}
#top #map.Bintulu .point {
    top: 449px;
    left: 1224px;
}
#top #map.Penang {
    top: -210px;
    left: -610px;
}
#top #map.Penang .point {
    top: 442px;
    left: 1172px;
}
#top #map.Bali {
    top: -230px;
    left: -680px;
}
#top #map.Bali .point {
    top: 497px;
    left: 1227px;
}
#top #map.DangaBay {
    top: -220px;
    left: -640px;
}
#top #map.DangaBay .point {
    top: 453px;
    left: 1183px;
}
#top #map.KotaBharu {
    top: -215px;
    left: -635px;
}
#top #map.KotaBharu .point {
    top: 433px;
    left: 1176px;
}
/*----------------------------------------------------------------*/
#top .tour li {
    position: absolute;
    display: none;
    height: 400px;
    width: 100%;
}
#top .tour li.active {
    display: block;
}
#top .tour li h1 {
    color: #3C6700;
}
#top .tour-nav {
    position: absolute;
    bottom: 0;
    height: 50px;
    width: 100%;
    text-align: left;
    background: url(/media/img/home/bg-dark-secondary.png) repeat;
    overflow: hidden;
}
#top .tour-nav .text a {
    font-family: "museo-sans-1" , "museo-sans-2" , "Museo Sans" , "Segoe UI" , "Helvetica Neue" , Arial, Sans-Serif;
    display: block;
    position: absolute;
    top: 80px;
    margin: -.6em 0 0 0;
    color: #EEE;
    font-size: 1.2em;
}
#top .tour-nav .text a .arrow {
    display: block;
    float: right;
    width: 21px;
    height: 20px;
    margin: 2px 0 0 8px;
    background: url(/media/img/home/arrow-next.png) no-repeat left top;
}
#top .tour-nav .text a:hover {
    color: #FFF;
}
#top .tour-nav .text a:hover .arrow {
    background-position: 0 -26px;
}
#top .tour-nav .text a.active {
    top: 25px;
}
#top .tour-nav .boxes {
    float: right;
    margin: 19px 20px 0 0;
}
#top .tour-nav .boxes a {
    display: block;
    float: left;
    height: 10px;
    width: 10px;
    margin: 0 4px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: url(/media/img/home/bg-dark-secondary.png) repeat;
}
#top .tour-nav .boxes a:hover {
    background: #CCC;
}
#top .tour-nav .boxes a.active {
    background: #EEE;
}
/*----------------------------------------------------------------*/
#top.vertical {
    position: relative;
    height: 320px;
}
#top.vertical .shell {
    position: relative;
    height: 100%;
}
#top.vertical a.flipto {
    position: relative;
    top: 12px;
    padding: 0 0 12px 0;
    background: url(/media/img/home/flipto-white.png) no-repeat;
}
#top.vertical .lead {
    color: #FFF;
}
#top.vertical .placemarker {
    color: #FFF;
    font-size: 1.1em;
    position: absolute;
    bottom: 4px;
    padding: 8px 0 10px 32px;
    background: url(/media/img/home/mini-marker.png) no-repeat left center;
}
#top.vertical .placemarker span.location {
    color: #B6D5F0;
}
#top.firefly .shell {
    background: url(/media/img/home/restaurants/top-firefly.jpg) no-repeat right bottom;
}
#top.firefly .lead {
    padding: 12px 0 0 0;
}
#top.firefly .lead p {
    width: 430px;
}
#top.james .shell {
    background: url(/media/img/home/hotels/top-james.jpg) no-repeat left bottom;
}
#top.james .lead {
    padding: 0 0 0 300px;
}
#top.james .placemarker {
    left: 300px;
}
#top.pluna .shell {
    background: url(/media/img/home/airlines/top-pluna.jpg) no-repeat right bottom;
}
#top.pluna .lead {
    padding: 20px 0 0 0;
}
#top.pluna .lead p {
    width: 380px;
}
/*----------------------------------------------------------------*/
#verticals {
    position: relative;
    overflow: hidden;
    color: #DDD;
    border-top: solid 4px #213345;
    background: url(/media/img/home/bg-dark-primary.png) repeat;
    z-index: 20;
}
#verticals li {
    float: left;
    display: inline;
    width: 290px;
    padding: 26px 0;
    text-align: center;
}
#verticals li h2 {
    color: #DDD;
    font-size: 2em;
    padding: 0 0 4px 0;
}
#verticals li .action {
    margin: 20px 0 10px 0;
    float: right;
    position: relative;
    left: -50%;
}
#verticals li .action a {
    float: left;
    position: relative;
    left: 50%;
    margin: 0 0 0 -20px;
}
#verticals li.middle {
    margin: 0 40px;
}
#verticals li.active {
    color: #FFF;
    background: url(/media/img/home/vertical-glow.png) center center;
}
#verticals li.active h2 {
    color: #FFF;
}
#verticals li.active p {
    color: #B6D5F0;
}
/*----------------------------------------------------------------*/
#main {
    position: relative;
    overflow: hidden;
    padding: 30px 0 0 0;
    border-top: solid 4px #CCC;
    background: #FAFAFA;
    z-index: 30;
}
#main .news {
    float: left;
    width: 500px;
}
#main .news h3 {
    font-size: 1.2em;
}
#main .news h3 a {
    line-height: 1.5em;
    padding: 0 0 1px 0;
    border-bottom: dotted 1px #CCC;
}
#main .news h3 a:hover {
    color: #333;
    border-bottom: dotted 1px #333;
}
#main .news li {
    padding: 20px 0 0 0;
    clear: both;
}
#main .news .date {
    float: left;
    font-family: "museo-sans-1" , "museo-sans-2" , "Museo Sans" , "Segoe UI" , "Helvetica Neue" , Arial, Sans-Serif;
    font-weight: 500;
    background: #EEE;
    text-align: center;
    margin: 2px 0 0 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
#main .news .date .month {
    display: block;
    padding: 4px 6px 0 6px;
}
#main .news .date .day {
    font-size: 2em;
}
#main .news .content {
    margin: 2px 0 0 80px;
}
#main .news .content p {
    font-size: .9em;
    padding: 5px 0 0 0;
}
#main .clients {
    float: right;
    width: 400px;
    text-align: left;
    margin: 0 0 0 40px;
}
#main .clients .logos {
    background: #FFF;
    width: 100%;
    margin: 16px 0 0 0;
    border: solid 1px #CCC;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
#main .clients table {
    width: 100%;
}
#main .clients td {
    width: 50%;
    vertical-align: middle;
    text-align: center;
    padding: 10px 0;
}
#main .clients img {
    width: 100px;
}
/*----------------------------------------------------------------*/
#main .section {
    overflow: visible;
    clear: both;
    padding: 20px 0;
    border-top: solid 1px #CCC;
}
#main .section.first {
    padding: 0 0 20px 0;
    border: none;
}
#main .section h2 {
    padding: 0 0 20px 0;
}
#main .section h3 {
    padding: 0 0 10px 0;
}
#main .section p {
    font-size: 1.2em;
    padding: 0 0 10px 0;
}
#main .section .cols-1, #main .section .cols-2 {
    overflow: visible;
    clear: both;
    padding: 0 0 30px 0;
}
#main .section .cols-2 .col {
    float: left;
    width: 420px;
    padding: 0 10px;
}
#main .section .cols-2 .col.left {
    margin: 0 80px 0 0;
}
#main .section .cols-2 .col.wide {
    width: 500px;
    padding: 40px 10px 0 10px;
}
#main .section .cols-2 .col.left.narrow, #main .section .cols-2 .col.left.wide {
    margin: 0 20px 0 0;
}
#main .section .cols-2 .col.narrow {
    width: 400px;
}
#main .section .cols-2 .col.narrower {
    width: 340px;
    padding: 20px 0 0 0;
}
#main .section .cols-2 .col.wider {
    width: 500px;
    padding: 10px 0 0 0;
}
#main .section .col.tall {
    padding-top: 80px !important;
}
#main .section .subsection {
    margin: 0 0 15px 0;
}
#main .section .col.tall .subsection {
    margin: 0 0 25px 0 !important;
}
#main .section .caption {
    font-size: .8em;
    color: #888;
}
/*----------------------------------------------------------------*/
#main .section .tabs {
    float: left;
    clear: both;
    width: 100%;
    margin: 20px 0 0 0;
    border-bottom: solid 1px #CCC;
}
#main .section .tabs h2 {
    float: left;
    padding: 0;
}
#main .section .tabs ul {
    float: left;
    margin: 0 0 0 40px;
}
#main .section .tabs li {
    float: left;
    margin: 0 20px 0 0;
}
#main .section .tabs a {
    position: relative;
    top: 2px;
    padding: 6px 12px;
    float: left;
    display: block;
    color: #193557;
    font-size: 1.4em;
    font-family: "museo-sans-1" , "museo-sans-2" , "Museo Sans" , "Segoe UI" , "Helvetica Neue" , Arial, Sans-Serif;
    font-weight: 500;
    z-index: 10;
}
#main .section .tabs a:hover {
    color: #000;
}
#main .section .tabs a.active {
    border: 1px solid #CCC;
    border-bottom: 2px solid #FAFAFA;
    -moz-border-radius-topleft: 6px;
    -moz-border-radius-topright: 6px;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
#main .section .mobile {
    text-align: center;
    background: #FFF;
    border: solid 1px #CCC;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
#main .section .mobile img {
    margin: 0 auto;
}
/*----------------------------------------------------------------*/
#main .signup {
    color: #193557;
    background: #D4D4D4;
    padding: 10px 20px;
    margin: 0 -20px;
    -moz-border-radius: 6px;
    border-radius: 6px;
}
#main .signup p {
    padding: 5px 0 40px 0;
}
#main .signup label {
    display: block;
    padding: 0 0 2px 0;
}
#main .signup input {
    width: 100%;
    padding: 5px;
}
#main .signup .info {
    overflow: auto;
}
#main .signup .info .fields {
    float: left;
    width: 300px;
}
#main .signup .info .field {
    padding: 0 0 20px 0;
}
#main .signup .info .desc {
    float: left;
    margin: 0 0 0 40px;
}
#main .signup .info .desc textarea {
    height: 240px;
    width: 580px;
    padding: 5px;
}
#main .signup .action {
    position: relative;
    overflow: visible;
    margin: 0 30px 40px 0;
}
#main .signup .action .optional {
    display: block;
    text-align: right;
    padding: 0 0 10px 0;
}
#main .signup .action a {
    float: right;
    margin: 0 20px 0 0;
}
/*----------------------------------------------------------------*/
#footer {
    overflow: auto;
    padding: 40px 0 0 0;
    color: #888;
}
#footer .shell {
    border-top: solid 1px #CCC;
    padding: 8px 4px 30px 4px;
}
#footer a {
    padding: 0 0 2px 0;
    border-bottom: dotted 1px #CCC;
}
#footer a:hover {
    color: #333;
    border-bottom-color: #333;
}
#footer li {
    float: left;
    margin: 0 1.5em 0 0;
}
#footer .copyright {
    color: #BBB;
}
#footer .team {
    float: right;
    margin: -2px 0 0 0;
    padding: 2px 0 20px 46px;
    background: url(/media/img/home/mini-marker-gray.png) no-repeat top left;
}