/*$Id: global.css,v 1.127 2010/07/04 03:21:54 nick Exp $*/
/* global styles */

/* HTML elements */
body {background-color: white; margin:0; padding:0; font-size: 13px}
body, .gm-style div, .gm-style span, .gm-style label, .gm-style a {font-family: arial, helvetica, sans-serif;}
a {text-decoration:none;}
a:link{color:#039;}
a:visited{color:#039;}
a:hover{color:#039;text-decoration:underline;}
a:hover.noDecorate{text-decoration:none;}
.textWhite, .textWhite a:link, .textWhite a:visited, .textWhite a:hover, .textWhite a:active {color:#fff !important;}
form {padding: 0; margin:0; }
p {padding: 0; margin:0;}
iframe {border:0;}
h1,h2,h3,h4,h5{padding: 0; margin:0; display:inline;}
h1 {font-size:2.0em;}
h2 {font-size:1.5em;}
h3 {font-size:1.2em;}
h4 {font-size:0.8em;}
h5 {font-size:0.6em;}
img {border:0;}
li {margin-left:15px; padding: 0;}
ul {margin: 3px 0; padding:0;}

/* general text stuff */

.dkorange { color: #cc6602 !important; }
.dkgreen { color:#53755d !important; }

.bold {font-weight:bold;}
.normal {font-weight:normal;}
.small {font-size:.8em;}
.smallMedium {font-size:.9em;}
.medium {font-size:1.0em;}
.mediumlarge {font-size:1.1em;}
.large {font-size:1.5em;}
.verylarge {font-size:2.0em;}

.textLight {color:#999;}
.italic {font-style: italic;}

.floatRight {float:right;}
.textIndent10 {text-indent:-10px;margin-left:10px;}
.textIndent20 {text-indent:-20px;margin-left:20px;}
.textIndent30 {text-indent:-30px;margin-left:30px;}
.textIndent35 {text-indent:-35px;margin-left:35px;}
.textIndent40 {text-indent:-40px;margin-left:40px;}

table.topAlign td {vertical-align: top;}

table.altRows tr:nth-child(odd) {background-color:#e8e8e8;}
table.altRows tr:nth-child(even) {background-color:#f2f2f2;}
table.altRows {border: 1px solid #999;}

/* "hr" rules */
.hrline { margin-bottom: 6px; border: 1px dashed; color: #cccccc }

/* quoted text in forum classes */
.quotedtext { margin:0px 30px; }
.quoteduser { font-weight:bold; font-size:0.9em; }
.quotedbody { display:inline-block; border:1px solid #888888; padding:2px 4px; background-color:white; font-size:0.9em; color:#555555}


/* specific thingys */
.iconNoticeNum, .iconForumNum
{
    position:relative; bottom:10px; left:-6px; padding:2px; background-color:#dd0000;
    color:#fff; font-size:10px; font-weight:bold; border-radius:2px;
    box-shadow: 0 0 4px 1px #999;
}
.iconSpan img {height:16px; width:17px; margin-right:8px;}
#headerIcons {display:inline-block; position:relative; bottom:-3px;}
#hiUser {}
#hiUser img {height:8px; margin-left:8px;}
.iconSpan {display:inline-block;}
.noAlerts {padding:15px; background-color: #ddd; margin: 8px 0; font-style: italic;}
#rspNav img, #fullHeaderNav img {height:13px;}

.rounded {padding:1px; border-radius:4px; border:1px;}
.roundedBottom {border-bottom-right-radius:4px; border-bottom-left-radius:4px;}
.roundedTop {border-top-right-radius:4px; border-top-left-radius:4px;}
.roundedLeft {border-bottom-left-radius:4px; border-top-left-radius:4px;}

.mptextHighlight { background-color: #ffffcc; padding:0 2px; }
.dashedTitleBlock { font-size:1.5em; padding-bottom:1px; margin-bottom: 2px; width:100%; color:#53755d;
	border-bottom:1px dashed #888888;}
.favoriteSubheading {font-weight: bold; color: #555;}
.starSelected { border: 1px solid #ff0000; }
.starUnselected { padding: 1px 1px; }
.editHref { font-size:.7em; color:red !important;}
.imageBlock {padding: 0 3px;}
.searchHighlightText{background-color: #BA55D3; color:white;}
.signupBox{padding: 5px 0; background-color: #D4DDFF; width:720px;}
.whySignupBox{padding: 5px 0; background-color: white; width:190px;}
.routeFinderFormOuter,div.searchFormOuter{padding: 5px 0; background-color: #D4DDFF; text-align:left}
.routeFinderFormOuter{width:430px;}
.searchFormOuter{width:380px;}
.searchFormInner{padding: 5px; margin:0 5px; background-color: white;}
.underlined{border-bottom:1px solid black;}
.pointer {cursor:pointer;}
.nowrap {white-space:nowrap; overflow: hidden; text-overflow: ellipsis;}
.strike {text-decoration: line-through;}

.rateYDS {}
.rateFrench, .rateEwbanks, .rateFont, .rateUIAA, .rateZA, .rateBritish {display:none;}

#ObjectPickerGuts {padding:4px; height:350px;}
#ObjectPickerAreaList {text-indent:-50px; padding-left:53px; margin:3px; overflow:auto; height:310px; border:1px solid #ddd}
#ObjectPickerSelectedObjectList {text-indent:-30px; padding-left:33px; margin:3px; overflow:auto; height:220px; border:1px solid #ddd}
.footerBlock { margin-top:20px; clear:both; background-color:#eee; padding:8px;}
.titleBar { text-align:left; width: 100%; background: #333333; padding:0 0; margin-bottom:0}
.sectionBar { text-align: left; font-size:.7em; width: 100%; background: #EEEEFF; margin-bottom: 0; margin-top: 0; padding: 4px 0 }
.topNavBar { text-align:left; width: 100%; background: #FFFF99; padding:0 0; margin-bottom:4px}
.mainBody { text-align:left; width: 100%; background: white; padding:0 0;}
.objectListColumnHeader {font-weight:bold; white-space:nowrap; padding:2px 4px; color:white; text-align:center; background-color:#666666}
.objectListColumnHeaderForViewer {font-weight:bold; white-space:nowrap; padding:2px 0; color:black; text-align:center; background-color:#d0d0d0}

.weather {}
.weather .taC {text-align:center; padding-left: 6px;}
.weather .condIcon {border: 1px solid #172c6c; height: 30px; width: 30px;}
.weather .nobr {white-space:nowrap;}

img.nws {width: 40px; height: 40px; border: 1px solid #666;}
img.forecastio {width: 50px; height: 50px;}

.objectList { background-color:white;}

#dlgModal {}

/* some generally useful stuff*/
.clear { clear: both; }
.centerElement {margin-left: auto; margin-right: auto;}
.centerContent {text-align:center;}
.textLeft {text-align: left;}
.textRight {text-align: right;}

.comhid  { display: none; visibility: hidden;}
.comvis { }

img.img-shadow {
    border: 1px solid #666;
    box-shadow: 3px 3px 3px #999;
    -webkit-box-shadow: 3px 3px 3px #999;
    -moz-box-shadow: 3px 3px 3px #999;
}

.slideshowPopup {background-color:#222 !important;}

div.carouselSlide {
    display:none; position:absolute; width:100%; background-color:#222; background-repeat:no-repeat;
    background-position:center center;
}

div.abTestB {display:none;}

div.tipHTML{margin:0; padding:0 5px; border-left:1px solid #666; border-right:1px solid #666; overflow: hidden;}
div#tipDiv {
  position:absolute; visibility:hidden; left:0; top:0; z-index:1000;
  background-color:transparent; color:#333333;
}

.sort-labels {position:absolute; right:272px; }
.connectedSort {width: 260px; min-height:160px; border: 1px solid grey; padding: 6px 4px;}
.sort-disabled, .sort-highlight, .sort-default {text-align:left; width: 250px; padding: 2px; margin: 3px; overflow:hidden; height:15px;}
.sort-highlight, .sort-default { cursor:move; }
.sort-highlight {border: 1px solid #fcefa1; background-color:#fbf9ee;}
.sort-default {border: 1px solid #aaa; background-color:#f0f0f0;}
.sort-disabled {border: 1px solid #ccc; background-color:#fff; color: grey; }

/* open layers */
.fullPage {position:fixed !important; top:0; left:0; z-index:2; width:100% !important;}
#map {height: 100%; position:relative;}
#mapLoading { position:absolute; top:50px; z-index:100000; padding:5px 10px;  left: 50%; margin-left:-70px;
    background-color:#fff; opacity: .6; filter:Alpha(Opacity=60); text-align:center;}
#mapFSToggle {position:absolute; left:8px; bottom:40px;}
.favoriteTrail {margin-bottom:4px; padding:3px; border:1px solid #c1c9b0; background-color: #e4e4d5;}

#map img { max-width:none; }
.olPopupContent {padding: 0 !important;}
.dataLbl, .dataLayersDiv {}
.baseLbl, .dataLbl {font-weight: bold !important;}
.olControlLayerSwitcher {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-weight: normal !important;
    font-size: 11px !important;
    color: #222 !important;
    width:auto !important;
    left: 3px !important;
    right: auto !important;
}
.olControlLayerSwitcher .maximizeDiv,
.olControlLayerSwitcher .minimizeDiv { display:none; }
.olControlLayerSwitcher .layersDiv {
    background-color: rgba(255,255,255,.9) !important;
    padding:5px !important;
}
.olControlLayerSwitcher input[type="radio"] {margin: 5px 5px 0 0 !important}
.olControlLayerSwitcher input[type="checkbox"] {margin: 3px 5px 3px 0 !important}

.featuredRoute {margin-bottom:4px; padding:3px; border:1px solid #c1c9b0; cursor:pointer; background-color: #e4e4d5;}
#featuredRoutes {width:165px; position:absolute; right:8px; bottom:20px; overflow-y:auto;
    background-color:rgba(210,214,197,.85); padding:7px; text-align:left;
}

/* end open layers */

div.menu {display:none;}
div.menu > ul {border:0; background:transparent; text-align:left; display:inline-block;}
/* jqueryui overrides */
.ui-menu {padding:0 !important;}
.ui-menu li.indent a {padding-left:20px !important;}
.ui-widget-content a {color:#039 !important;}
.ui-dialog {box-shadow: 0 0 90px 5px #000;	-webkit-box-shadow: 0 0 90px 5px #000; position:fixed !important;}
.ui-widget-overlay, .ui-widget-shadow {
    background: #222 !important;
    opacity: .8 !important; filter: Alpha(Opacity=80) !important;
}

/* the following is for Safari in OS 10.6 */
.ui-button
{
    line-height: normal !important;
    display: inline !important;
}
.ui-button-text {display:none !important;}
/* end Safari OS 10.6 */

/* end jqueryui */

/* start buttons http://webdesignerwall.com/tutorials/css3-gradient-buttons */
.button {
    cursor: pointer;
    margin:0; border:0;
    display: inline-block;
    outline: none;
    text-align: center;
    text-decoration: none;
    padding:7px 19px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2);
    box-shadow: 0 1px 2px rgba(0,0,0,.2);
}
.buttonRoundRightOnly {
    -webkit-border-bottom-left-radius: 0 !important;-webkit-border-top-left-radius: 0 !important;
    -moz-border-radius-topleft: 0 !important; -moz-border-radius-bottomleft: 0 !important;
    border-top-left-radius:0 !important; border-bottom-left-radius: 0 !important;
}
.buttonSmall {
    padding:4px 10px !important;
}
.button:hover {
    text-decoration: none;
}
.button:active {
    position: relative;
    top: 1px;
}
.buttonBlue {
    border: 1px solid #333;
    color: #f0f0f0 !important;
    background: #30669B;
    background: -webkit-gradient(linear, left top, left bottom, from(#30669B), to(#1E416C));
    background: -moz-linear-gradient(top,  #30669B,  #1E416C);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#30669B', endColorstr='#1E416C');
}
.buttonBlue:hover {
    color: #fff !important;
    background: #a00000;
    background: -webkit-gradient(linear, left top, left bottom, from(#2F64A4), to(#30669B));
    background: -moz-linear-gradient(top,  #2F64A4,  #30669B);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#2F64A4', endColorstr='#30669B');
}
.buttonDisabled,  .buttonDisabled:hover{
    cursor: default !important;
    color: #f0f0f0 !important;
    background: #666;
}
/* end buttons */

a.facebookButton {
    font-size:14px;
    text-align:left;
    padding: 12px 12px 12px 45px;
    background: #3b5998 url(/img/fbLogin.png) no-repeat 7px center;
    background-size: 28px 28px;
}

.photoArrowNext, .photoArrowPrev {
    height:100%; width:40%; opacity:.2; filter: alpha(opacity=.2); cursor:pointer;
    position:absolute; background-size:auto; background-repeat:no-repeat;
}
.photoArrowNext {right:0px; background-position:95% 50%; background-image:url(/img/arrowRight.png);}
.photoArrowPrev {left:0px; background-position:5% 50%; background-image:url(/img/arrowLeft.png);}

.imgInBlock {width:190px; height:190px; margin:auto 10px; float:left; overflow:hidden;}
.video-sizeLimiter {max-width: 500px;}
.video-container {position: relative; padding-bottom: 56.25%; max-width:100%; height: 0; overflow: hidden;}
.video-container iframe {position: absolute; top:0; left: 0; width: 100%; height: 100%;}
.destArea {font-size:1.4em; font-weight:bold;}
.routeRatingInList {white-space: nowrap;}

/* responsive stuff - default first */
.rspPage {font-size:50px; width:0; height:0;}
#rspBodyContainer, #bodyContainer {min-width:1040px; margin:auto; padding:5px;}
.rspContainer {text-align:center;}
.rspCol {display:inline-block; vertical-align:top;}
#rspLayoutToggle, #headerMenu, .hiddenDivHeader {display:none;}
#rspNav {display:none; position:absolute; left:0; padding:15px; z-index:1000; background-color:#336799;}
#rspNav div {padding:10px 0;}

#rspCol220 {width:220px;}
#rspCol800 {width:800px;}

#rspCol300 {width:300px;}
#rspCol720 {width:720px;}

#rspCol320 {width:320px;}
#rspCol700 {width:700px;}

/* photo page */
#photoCol {width:720px; margin-right:15px;}

/* viewer pages */
#firstPhotoDiv {max-width:282px; text-align:right; float:right; margin-right:5px;}

/* header footer */
#headerLogo {width:241px; height:61px;}

@media only screen and (max-width:560px)
{
    .rspPage {font-size:20px;}
    #rspBodyContainer, #photoCol, #firstPhotoDiv, .rspCol
        {min-width:480px; max-width:480px; width:480px; overflow-x:hidden;}
    .routeRatingInList {white-space: normal;}

    /* destinations */
    .destArea {font-size:1.2em;}

    /* forum page */
    td.userRight {display:none;}

    /* photo page */
    #photoPrimaryNextPrev {display:none;}
    .photoArrowNext, .photoArrowPrev {opacity:.6; filter: alpha(opacity=.6);}

    /* viewer pages */
    #firstPhotoDiv {text-align:center; float:none;}
    #firstPhotoDivDetails, #leftNavDD, .rspCollapsedContent, #contentLeftNavPR, #whatsNewPR,
        .forumPR, .searchPR {display:none;}
    #rspLayoutToggle, .hiddenDivHeader {display:block;}

    /* header footer */
    #reiLogoTd {display:none;}
    #headerSearch {display:none !important;}
    #footerSocial {float:none !important;}
    #APSites .tagline {display:none;}
    #rspBodyContainer #headerLogo {width:158px; height:40px;}
    #rspBodyContainer #fullHeaderNav {display:none;}
    #rspBodyContainer #headerMenu {display:inline;}
    .dfpBannerContainer {height:60px; width:470px; overflow:hidden; text-align: left;}
    .dfpBanner {
        transform-origin:0 0;
        -moz-transform-origin:0 0;
        -ms-transform-origin:0 0;
        -webkit-transform-origin:0 0;
        -o-transform-origin:0 0;

        transform:scale(.64,.64);
        -moz-transform:scale(.64,.64);
        -ms-transform:scale(.64,.64);
        -webkit-transform:scale(.64,.64);
        -o-transform:scale(.64,.64);
    }
}

@media only screen and (min-width:1050px)
{
    #rspCol700 {width:700px;}
    #rspCol720 {width:720px;}
    #rspCol800 {width:800px;}
    #rspBodyContainer, #bodyContainer {width: 1040px;}
}
@media only screen and (min-width:1100px)
{
    #rspCol700 {width:750px;}
    #rspCol720 {width:770px;}
    #rspCol800 {width:850px;}
    #rspBodyContainer, #bodyContainer {width: 1090px;}
}
@media only screen and (min-width:1150px)
{
    #rspCol700 {width:800px;}
    #rspCol720 {width:820px;}
    #rspCol800 {width:900px;}
    #rspBodyContainer, #bodyContainer {width: 1140px;}
}
@media only screen and (min-width:1250px)
{
    #rspCol700 {width:900px;}
    #rspCol720 {width:920px;}
    #rspCol800 {width:1000px;}
    #rspBodyContainer, #bodyContainer {width: 1240px;}
}
@media only screen and (min-width:1350px)
{
    #rspCol700 {width:1000px;}
    #rspCol720 {width:1020px;}
    #rspCol800 {width:1100px;}
    #rspBodyContainer, #bodyContainer {width: 1340px;}
}
@media only screen and (min-width:1450px)
{
    #rspCol700 {width:1100px;}
    #rspCol720 {width:1120px;}
    #rspCol800 {width:1200px;}
    #rspBodyContainer, #bodyContainer {width: 1440px;}
}



/*
example below. don't put whitespace between divs!
<div class="centerContent">
    <div class="rspCol" style="margin-right:15px;">
        ...
    </div><div class="rspCol">
    </div>
</div>
end responsive stuff
*/