
.slim-topbar .container {margin: 0 auto; font-size: 16px; max-width: 940px;}

.guide-items {clear: left;}
.guide-item {display: block; clear: left; padding: 0.75em 0 0.25em; border-top: 1px solid #eee;}
.guide-item i.icon-chevron-right {font-size: 42px; float: right; margin-left: 0.5em; color: #eee; line-height: 1;}
.guide-item:hover {text-decoration: none;}
.guide-item div {font-family: "PT Serif", "Helvetica Neue", Helvetica, Arial, sans-serif;}
.guide-item div[style^="font-size"] {font-style: italic;}

.guide-item h3, .guide-item p {line-height: 1.4; padding-left: 48px; margin-bottom: 0.33em;}
.guide-item h6 {font-size: 12px; margin-bottom: 0;}
.guide-item h3 {font-size: 16px;}
.guide-item i.icon-chevron-right {font-size: 38px; margin-left: 0.5em;}
.icon-badge {margin: 2px 0.5em 0.33em 0; font-size: 24px; padding: 6px 0; width: 36px; float: left; display: inline-block; background-color: #eee; color: #aaa; line-height: 1; text-align: center; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
.icon-badge > .icon-map-marker {margin-bottom: -2px;}
.badge-number {font-weight: bold;}
.guide-item:hover i.icon-chevron-right, .guide-item:active i.icon-chevron-right {color: #aaa;}
.guide-item:hover .icon-badge, .guide-item:active .icon-badge {color: #888; background-color: #e3e3e3;}
#guide-item-directions .guide-item:hover .icon-badge {color: #aaa; background-color: #eee;}

p .list-little-meta {float: right; font-size: 12px; font-weight: normal; line-height: 26px;}
p .button-inline.small {margin-top: -4px;}

.truncated-text {display: none;}
.stop-map-icon, .next-stop-map-icon {
    height: 28px; width: 28px; line-height: 1; display: block;
    font-size: 12px; font-family: "PT Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-weight: bold; text-align: center; background-color: #fff; border: 5px solid #0F1B25;
    -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.33); -moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.33); box-shadow: 0 0 8px rgba(0, 0, 0, 0.33);
}
.stop-map-icon span, .next-stop-map-icon span {
    vertical-align: text-bottom;
}
.toggle-map > .button {padding-right: 1em;}

@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fadein {
    opacity:0; -webkit-animation:fadeIn ease-in 1; -moz-animation:fadeIn ease-in 1; animation:fadeIn ease-in 1;
    -webkit-animation-fill-mode:forwards; -moz-animation-fill-mode:forwards; animation-fill-mode:forwards;
    -webkit-animation-duration: 1s; -moz-animation-duration: 1s; animation-duration: 1s;
}
.fadein.fadein1 {-webkit-animation-delay: 0s; -moz-animation-delay: 0s; animation-delay: 0s;}
.fadein.fadein2 {-webkit-animation-delay: 1s; -moz-animation-delay: 1s; animation-delay: 1s;}
.fadein.fadein3 {-webkit-animation-delay: 2s; -moz-animation-delay: 2s; animation-delay: 2s;}

/* SoundManager audio */
/* Default + hover state, "click to play" */
a.sm2_link {display: block; color: #888; line-height: 1; font-weight: normal;}
a.sm2_link b {color: #111;}
a.sm2_link i {color: #111; font-size: 14px; width: 14px;}
a.sm2_link i.hidden {display: none;}
a.sm2_link:hover {}
/* Playing + hover state, "click to pause" */
a.sm2_playing {}
a.sm2_playing i.icon-play {display: none;}
a.sm2_playing i.icon-pause {display: inline-block;}
a.sm2_playing:hover {}
/* Paused + hover state, "click to resume" */
a.sm2_paused {}
a.sm2_paused:hover {}
    
.gallery-package .galleria-stage {background-color: #fff;}
.gallery-package .galleria-info-description {padding-left: 9px; display: inline-block;}

/* responsive elements */
#guide-detail-photo-block {
    float: left;
    width: 60%;
    margin-right: 3%;
}
#guide-detail-stop-list {
    float: left;
    width: 37%;
}
#guide-item-primary-photo, #photos-below-guide-item-description {
    display: none;
}
#guide-item-description {
    margin-right: 300px;
    margin-bottom: 1em;
}
.guide-item-photo-block {
    float: none;
    max-width: 800px;
    margin: 1.5em auto 1em;
}
.gallery-package {
    width: 100%;
    margin: 0 auto;
}
#guide-item-directions-block {
    clear: both;
    margin-top: 3em;
}
#guide-item-directions div#direction-steps {
    margin-right: 300px;
}
#guide-item-directions-block [class^="gridsplit-"] {
    clear: none;
}
#next-stop-map {
    float: right;
    width: 270px;
    height: 150px;
    margin-top: .33em;
}
#guide-item-map-toggle {
    float: right;
    width: 270px;
    font-size: 16px;
    margin-bottom: 1em;
}
#guide-item-map-toggle p {
    font-size: .85em;
}
#stop-map {z-index: 99;}


.offline #next-stop-map,
.offline #map-toggle-button,
.offline .audio-link {display: none;}
.offline #guide-item-directions div#direction-steps {margin-right: 0;}



@media screen and (max-width: 800px) {
    #guide-item-description, .guide-item-photo-block, #guide-item-map-toggle {
        width: auto;
        float: none;
        margin-right: 0;
        display: block;
    }
    #guide-item-map-toggle p {
        font-size: inherit;
    }
    #guide-item-directions-block {
        margin-top: 2em;
    }
    #guide-item-directions-block [class^="gridsplit-"] {
        width: 100%;
        margin-right: 0;
        display: block;
    }
}

/* just below iPad 1 resolution */
@media screen and (max-width: 760px) {
    .guide-item i.icon-chevron-right {
        display: none;
    }
}

@media screen and (max-width: 640px) {
    .responsive .grid-teaser h2 {
        font-size: 18px;
    }
    .responsive .grid-teaser {
        width: 45%;
        margin: 0 2% 2em;
    }
    #photos-above-guide-item-description {
        display: none;
    }
    #guide-item-primary-photo, #photos-below-guide-item-description {
        display: block;
    }
}

/* targeting 7" tablets */
@media screen and (max-width: 600px) {
    .truncated-text, .mobile-only {
        display: inherit;
    }
    .full-text, #next-stop-map, .gallery-package {
        display: none;
    }
    #guide-primary-photo {
        width: auto;
    }
    #guide-detail-photo-block, #guide-detail-stop-list, #guide-item-directions {
        width: auto;
        float: none;
        margin-right: 0;
        display: block;
    }
    #guide-item-directions div#direction-steps {
        margin-right: 0;
    }
    .guide-item {padding: 0.75em 0 0.25em;}
    .guide-item h6 {font-size: 13px; margin-bottom: 0.1em;}
    .guide-item h3 {font-size: 18px;}
    .guide-item h3, .guide-item p {padding-left: 60px; margin-bottom: 0.33em; line-height: 1.5;}
    .guide-item i.icon-chevron-right {display: block; font-size: 42px; margin-left: 0.5em;}
    .icon-badge {margin: 0 0.5em 0.33em 0; font-size: 30px; padding: 8px 0; width: 45px;}
    .icon-badge > .icon-map-marker {margin-bottom: -4px;}
}

@media screen and (max-width: 480px) {
    .responsive .grid-teaser {
        width: auto;
        display: block;
        margin: 0 0 2em;
    }
}

@media screen and (max-width: 320px) {
    .responsive .grid-teaser {
        width: auto;
        display: block;
        margin: 0 0 2em;
    }
}