.dragomaps-container {
    position: relative;
    z-index: 10;
}

.map-overlay {
    position: relative;
    z-index: 5;
}
.map-image {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
    opacity: 1;
    transition: opacity .25s;
}
.map-image.hiding {
    z-index: -1;
    opacity: 0;
}
.map-overlay {
    width: 100%;
    height: auto;
}




#location {
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 60px;
}
.map-header {
    font-size: 36px;
    line-height: 36px;
    letter-spacing: 2px;
    font-weight: bold;
    position: absolute;
    top: 50px;
    right: 0px;
}
.map-headers {
    text-align: right;
    width: 100%;
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    z-index: 6;
}
.map-subheader {
    position: absolute;
    top: 90px;
    right: 0px;
    font-size: 19px;
    line-height: 19px;
    letter-spacing: 2px;
}
.map-button {
    position: absolute;
    top: 129px;
    right: 0px;
}
.backtoworldmap {
    display: inline-block;
    color: #FFF !important;
    font-size: 16px;
    line-height: 16px;
    padding: 5px 10px;
    cursor: pointer;
    font-weight: bold;
    text-decoration: none !important;
    background: #001522;
}
.backtoworldmap:hover {
    color: #FFF !important;
}
.backtoworldmap.hiding {
    display: none;   
}

.dragomaps-container .map-image, .route-maps img, .top-map-layer, .full-width-image, .americas-labels img, .africa-labels img, .asia-labels img {
    width: 100%;
    height: auto;
}
map, area {
    position: relative;
    z-index: 900;
    cursor: pointer;
}
.map-image {
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    will-change: opacity;
}
.americas-labels, .africa-labels, .asia-labels {
    opacity: 1;
}
.world-map .map-image, .americas .map-image, .asia .map-image, .africa .map-image {
    opacity: 1;
    transition: opacity .5s;
}
.world-map.hiding, .americas-map.hiding, .asia-map.hiding, .africa-map.hiding, .americas-labels.hiding , .africa-labels.hiding, .asia-labels.hiding, .americas-labels.hiding img, .africa-labels.hiding img, .asia-labels.hiding img {
    opacity: 0;
    z-index: -1;
}
.americas-labels img, .africa-labels img, .asia-labels img {
    opacity: 1;
    z-index: 3;
}
.americas-labels img.deactivated, .asia-labels img.deactivated, .africa-labels img.deactivated {
    opacity: .35;
}
area.deactivated {
    cursor: not-allowed;   
}
.start-marker, .stop-marker {
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    transition: opacity .25s, transform .90s, margin .90s;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 5;
    will-change: opacity, transform;
    transform: rotate(-20deg);
    margin-top: -10px;
}
.start-marker.active, .stop-marker.active {
    opacity: 1 !important;
    transform: rotate(0deg);
    margin-top: 0px;
}
.start-marker.same {
    transform: rotate(-20deg) !important;
    margin-left: -8px !important;
}
.stop-marker.same {
    transform: rotate(20deg) !important;
    margin-left: 8px !important;
}
.route-box-container {
    max-width: 1300px;
    margin-left: auto;
    margin-right: auto;
    position: relative;
    top: 0px;
    left: 0px;
}
.route-box {
    transition: opacity 1s;
    opacity: 1;
    width: 300px;
    position: absolute;
    top: 160px;
    right: 0px;
    background: rgba(255, 255, 255, .5);
    padding: 20px;
    z-index: 300;
    box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
    transform: translate3d(0, 0, 0);
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    will-change: opacity;
}
.start-label, .end-label {
    font-size: 18px;
    line-height: 18px;
    letter-spacing: 2px;
    font-weight: 700;
}
.tour-button {
    padding: 10px 15px;
    display: inline-block;
    margin-top: 10px;
    margin-bottom: 20px;
    letter-spacing: 2px;
    color: #FFF !important;
    font-size: 16px;
    line-height: 16px;
    transition: color .5s, background .5s;
    text-decoration: none !important;
    background: #001522;
}
.tour-button:hover {
    color: #FFF !important;
}
.tours {
    overflow-y: auto;
}
.start-label {
    color: #598527;
}
.end-label {
    color: #9e0b0f;
}
.colour-strip {
    height: 5px;
    min-width: 20px;
    display: inline-block;
}
.start-location, .end-location {
    font-size: 18px;
    line-height: 18px;
    text-transform: uppercase;
}
.tours-header, .continent {
    margin-top: 20px;
    font-weight: bold;
    font-size: 20px;
    line-height: 20px;
    border-bottom: 1px solid #001522;
    padding-bottom: 5px;
    letter-spacing: 2px;
    margin-bottom: 20px;
    text-transform: uppercase;
}
.continent {
    margin-top: 0px;
}
.route-box.hiding {
    opacity: 0; 
    z-index: -1;
}
.mobile-homepage-regions::before, .mobile-homepage-special-offers::before {
    content: " ";
    display: block;
    height: 20px;
    width: 100vw;
    background-position: center;
    background: url('../images/template/orange-crackle-up.png');
    position: absolute;
    top: -19px;
}
.mobile-homepage-regions::after, .mobile-homepage-special-offers::after {
    content: " ";
    display: block;
    height: 52px;
    width: 100vw;
    background-position: center;
    background: url('../images/template/orange-crackle-down.png');
    position: absolute;
    bottom: -51px;
}
.mobile-homepage-regions {
    background: #F89A3E;
    color: #FFF;
    font-family: BellRG;
    text-align: center;
    position: relative;
}
.mobile-homepage-regions-header {
    font-size: 1.8rem;
    line-height: 1.8rem;
}
.mobile-homepage-regions-subheader {
    margin-bottom: 20px;   
}
.mobile-homepage-region {
    width: 56vw;
    height: 56vw;
    display: flex;
    align-items: center;
    justify-content: center;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
    font-size: 2.4rem;
    margin-left: 20px;
    background-size: cover;
    background-position: center;
    float: left;
}
.mobile-homepage-region:first-of-type {
    margin-left: 0px;   
}
.mobile-homepage-region-scroll {
    width: calc((60vw * 3) + 40px);
}
.mobile-homepage-region-scroll-container {
    overflow-x: scroll;
    position: relative;
}
.mobile-homepage-inner-padding {
    padding: 20px;
    padding-bottom: 80px;
}
.mobile-homepage-offers-scroll, .mobile-homepage-region-scroll {
    position: relative;
    transition: left .25s;
}
.mobile-homepage-region-scroll.step-0 {
    left: 0px;
}
.mobile-homepage-region-scroll.step-1 {
    left: calc(-56vw + -20px);
}
.mobile-homepage-region-scroll.step-2 {
    left: calc((-56vw * 2) + -40px);
}
.homepage-offer-left.inactive, .homepage-offer-right.inactive, .homepage-region-left.inactive, .homepage-region-right.inactive {
    opacity: 0.25;   
}
.homepage-region-right, .homepage-region-left {
    padding: 5px 9px;
    background: #FFF;
    color: #000 !important;
    border-radius: 100%;
}
.map-header, .map-subheader {
    font-family: BellRG;
    background: #FFF;
    padding: .5rem 1rem;
}
.map-header {
    margin-top: -2px;
}