﻿/*body.trip-collections #page-banner {
        background-color: #000;
}*/

body.trip-collections #logo-strapline {
    display: none;    
}

    body.trip-collections #page-wrapper {
        width: 100%;
        margin-top: 0px;
        background-color: #fff;
    }
    
    body.search-page #slideshow,
    body.trip #slideshow,
    body.trip #page-content #mobile-message {
        display: none;
    }



body.trip #map-placeholder {
    height: 100vh;
}

    body.trip #map-placeholder.map-placeholder {
        height: 100%;
        position: relative;
    }
    
    body.trip #map-placeholder .map-wrapper {
        height: 100%;
    }

body.trip #page-content {
    margin-top: 0;
    position: relative;
}

body.trip #page-banner {
    background-color: rgba(0, 0, 0, 1.0);
}

body.trip #logo-strapline {
    display: none;
}


body.trip #page-title {
    z-index: 1100;
    width: 100%;
    height: 72px;
    margin-top: -72px;
    background-color: rgba(65, 65, 65, 1.0);
}

body.trip .page-title .main-title {
    width: 100%;
    height: auto;
    border-bottom: 0;
    position: relative;
}

body.trip #content-footer-wrapper {
    margin-top: 0px;
    /*border-top: 1px solid #8a8a8a;*/
}

.page-title.trip .main-title .trip-nav-wrapper {
    position: absolute;
    top: 0;
    background-repeat: no-repeat;
    width: 136px;
    height: 72px;
}

    /*.page-title.trip .main-title .trip-nav-wrapper.left {
        left: 116px;
        background-image: url(http://images.africatravelresource.com/cdn/images/chevron-trip-left.png);
        background-position: 0 11px;
    }

    .page-title.trip .main-title .trip-nav-wrapper.right {
        right: 36px;
        background-image: url(http://images.africatravelresource.com/cdn/images/chevron-trip-right.png);
        background-position: 112px 11px;
    }*/
    
    .page-title.trip .main-title a#back-to-previous.trip-nav-wrapper.left {
        left: 36px;
        background: none;
        text-decoration: none;
        padding-top: 0;
    }

        .page-title.trip .main-title a#back-to-previous.trip-nav-wrapper.left span.back-to-previous-icon {
            display: inline-block;
            background: url(http://images.africatravelresource.com/cdn/images/sprites.png) no-repeat -507px -33px;
            width: 24px;
            height: 26px;
            bottom: 16px;
            left: 3px;
            transform: rotate(90deg);
            -moz-transform: rotate(90deg);
            -webkit-transform: rotate(90deg);
        }

        .page-title.trip .main-title a#back-to-previous.trip-nav-wrapper.left span.back-to-previous-text {
            bottom: 44px;
            left: 0;
            text-align: left;
            font-size: 1.2rem;
            font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
            letter-spacing: 0.25em;
            line-height: 150%;
            text-transform: uppercase;
        }

    .page-title.trip .main-title a.trip-nav-wrapper  {
        padding-top: 20px;
        line-height: 18px;
        color: #ffffff;
        text-transform: uppercase;
        font-size: 1.2rem;
        letter-spacing: 0.25em;
        text-decoration: none;
    }

        .page-title.trip .main-title a.trip-nav-wrapper span {
            position: inherit;
            bottom: auto;
            width: inherit;
            font-family: inherit;
            font-size: inherit;
            letter-spacing: inherit;
            text-decoration: inherit;
            text-transform: inherit;
            line-height: inherit;
        }

        .page-title.trip .main-title a.trip-nav-wrapper.right  {
            right: 36px;
            text-align: right;
            /*background-image: url(http://images.africatravelresource.com/cdn/images/chevron-trip-right.png);
            background-position: 112px 11px;*/
            padding-right: 0;
        }

            .page-title.trip .main-title a.trip-nav-wrapper.right img {
                height: 36px;
            }
            
            .page-title.trip .main-title a.trip-nav-wrapper.right span {
                display: inline-block;
                left: -36px;
            }

        .page-title.trip .main-title a.trip-nav-wrapper.left  {
            left: 116px;
            text-align: left;
            /*background-image: url(http://images.africatravelresource.com/cdn/images/chevron-trip-left.png);
            background-position: 0 11px;*/
            padding-left: 0px;
        }

            .page-title.trip .main-title a.trip-nav-wrapper.left span.nav-description {
                padding-left: 16px;
            }

            .page-title.trip .main-title a.trip-nav-wrapper.left img {
                height: 36px;
            }

    .page-title.trip .main-title .trip-summary {
        position: relative;
        margin: 0 auto;
        height: 72px;
        padding-top: 11px;
    }

        .page-title.trip .main-title .trip-summary .trip-summary-element {
            display: inline-block;
            vertical-align: top;
            margin: 0 24px;
        }
        
            .page-title.trip .main-title .trip-summary .trip-summary-element span {
                position: relative;
                bottom: auto;
                font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
            }

            .page-title.trip .main-title .trip-summary .trip-summary-element .trip-summary-element-value {
                display: block;
                font-size: 2.4rem;
                line-height: 150%;
                letter-spacing: 0.25em;
            }

            .page-title.trip .main-title .trip-summary .trip-summary-element .trip-summary-element-value.rating {
                display: none;
            }
            
                .page-title.trip .main-title .trip-summary .trip-summary-element .trip-summary-element-value.rating.selected {
                    display: block;
                }

            .page-title.trip .main-title .trip-summary .trip-summary-element .trip-summary-element-name {
                display: block;
                font-size: 1.2rem;
                line-height: 150%;
                letter-spacing: 0.25em;
                text-transform: uppercase;
            }

/******************************************************************
    Itinerary styles
    OBSOLETE
*******************************************************************/
.itinerary-wrapper {
    width: 80%;
    max-width: 1000px;
    margin: 0 auto;
    background-color: #ffffff;
    position: relative;
    padding-top: 36px;
}

    body.trip .itinerary-wrapper h1 {
        font-family: 'Nothing You Could Do', cursive;
        font-size: 2.8rem !important;
        text-decoration: none;
        text-transform: capitalize;
        padding-bottom: 24px;
        color: rgb(130, 130, 130);
    }

    .itinerary-wrapper .itinerary-item {
        clear: both;
        width: 100%;
    }

    .itinerary-wrapper .itinerary-item .itinerary-item-slideshow {
        position: relative;
        display: inline-block;
        width: 80%;
        padding-top: 45%; /* 16:9 aspect ratio for a 80% width */
        float: right;
        overflow: hidden;
        margin-bottom: 48px;
    }

    .itinerary-wrapper .itinerary-item .itinerary-item-description {
        position: relative;
        display: inline-block;
        width: 20%;
        padding-top: 11.25%; /* 16:9 aspect ratio for a 20% width */
        float: left;
    }

        .itinerary-wrapper .itinerary-item.image-first .itinerary-item-slideshow {
            float: left;
        }

        .itinerary-wrapper .itinerary-item.image-first .itinerary-item-description {
            float: right;
        }
        
            /*.itinerary-wrapper .itinerary-item .itinerary-item-slideshow:after,
            .itinerary-wrapper .itinerary-item .itinerary-item-description:after {
                padding-top: 56.25%; 
                display: block;
                content: '';
            }*/

            .itinerary-slideshow-wrapper {
                position: absolute;
                top: 0;
                bottom: 0;
                left: 0;
                right: 0;
                width: 100%;
                height: 100%;
            }

            .itinerary-wrapper .itinerary-item .itinerary-item-slideshow .itinerary-item-slideshow-item, /* TODO: Deprecate*/
            .itinerary-slideshow-wrapper .itinerary-slideshow-image {
                position: absolute;
                top: 0;
                bottom: 0;
                right: 0;
                left: 0;
                width: 100%;
                background-color: #555555;
                background-size: cover;
                -webkit-transition: opacity 1s ease-in-out;
                -moz-transition: opacity 1s ease-in-out;
                transition: opacity 1s ease-in-out;
            }

                /*.itinerary-slideshow-wrapper .itinerary-slideshow-image.active:after {
                    padding-top: 56.25%; 
                    display: block;
                    content: '';
                }*/

                .itinerary-slideshow-wrapper .itinerary-slideshow-image.active {
                    opacity: 1.0;
                    -moz-opacity: 1.0;
                }

                .itinerary-slideshow-wrapper .itinerary-slideshow-image.inactive {
                    opacity: 0.0;
                    -moz-opacity: 0.0;
                }

                .itinerary-slideshow-wrapper .itinerary-slideshow-image-info {
                    display: none;
                }

                .itinerary-slideshow-wrapper .itinerary-slideshow-nav-wrapper {
                    z-index: 50;
                    position: absolute;
                    display: block;
                    height: 100%;
                    width: 24px;
                }

                    .itinerary-slideshow-wrapper .itinerary-slideshow-nav-wrapper.nav-previous {
                        left: 24px;
                    }

                    .itinerary-slideshow-wrapper .itinerary-slideshow-nav-wrapper.nav-next {
                        right: 24px;
                    }

                         .itinerary-slideshow-wrapper .itinerary-slideshow-nav-wrapper a.itinerary-slideshow-nav {
                            position: absolute;
                            height: 49px;
                            width: 24px;
                            background-repeat: no-repeat;
                            top: 50%;
                        }

                            .itinerary-slideshow-wrapper .itinerary-slideshow-nav-wrapper.nav-previous a {
                                background-image: url(http://images.africatravelresource.com/cdn/images/chevron-trip-left.png);    
                            }

                            .itinerary-slideshow-wrapper .itinerary-slideshow-nav-wrapper.nav-next a {
                                right: 24px;
                                background-image: url(http://images.africatravelresource.com/cdn/images/chevron-trip-right.png);    
                            }

                .itinerary-slideshow-wrapper .itinerary-slideshow-slide-info-panel {
                    position: absolute;
                    bottom: 16px;
                    width: 100%;
                    z-index: 100;
                    /*background-color: yellow;*/
                }

                    .itinerary-slideshow-wrapper .itinerary-slideshow-slide-info-panel > span {
                        font-size: 1.2rem;
                        color: #ffffff;
                        text-transform: uppercase;
                        letter-spacing: 0.25em;
                    }

                    .itinerary-slideshow-wrapper .itinerary-slideshow-slide-info-panel span.itinerary-slideshow-slide-album-name {
                        float: left;
                        width: 240px;
                        text-align: left;
                        padding-left: 24px;
                    }

                    .itinerary-slideshow-wrapper .itinerary-slideshow-slide-info-panel span.itinerary-slideshow-slide-counter {
                        float: right;
                        width: 120px;
                        text-align: right;
                        padding-right: 24px;
                    }

            .itinerary-wrapper .itinerary-item .itinerary-item-description .itinerary-item-description-content {
                position: absolute;
                top: 0;
                bottom: 0;
                right: 0;
                left: 0;
                background-color: #ffffff;
                color: rgb(130, 130, 130);
                padding: 0 0 0 32px;
                text-transform: initial;
                font-size: 1.2rem;
                letter-spacing: 0.25em;
                line-height: 200%;
            }

                .itinerary-wrapper .itinerary-item .itinerary-item-description .itinerary-item-description-content a {
                    color: rgb(130, 130, 130);
                    text-decoration: none;
                    letter-spacing: 2px;
                    font-weight: bold;
                }

                .itinerary-wrapper .itinerary-item .itinerary-item-description .itinerary-item-description-content .nights {
                    margin-bottom: 18px;
                }

                /* http://hackingui.com/front-end/a-pure-css-solution-for-multiline-text-truncation/ */
                .itinerary-wrapper .itinerary-item .itinerary-item-description .itinerary-item-description-content .itinerary-lodge-description {
                    overflow: hidden;
                    letter-spacing: 2px;
                    color: rgb(130, 130, 130) !important;
                    /*position: relative;*/
                    /*line-height: 2em;*/
                    /*text-align: justify;*/
                    /*margin-right: -1em;*/
                    /*padding-right: 1em;*/
                }

                    /*.itinerary-wrapper .itinerary-item .itinerary-item-description .itinerary-item-description-content .itinerary-lodge-description:before {
                        content: '...';
                        position: absolute;
                        right: 0;
                        bottom: 0;    
                    }

                    .itinerary-wrapper .itinerary-item .itinerary-item-description .itinerary-item-description-content .itinerary-lodge-description:after {
                        content: '';
                        position: absolute;
                        right: 0;
                        width: 1em;
                        height: 1em;
                        margin-top: 1em;
                        background-color: #606060;
                    }*/

                .itinerary-wrapper .itinerary-item .itinerary-item-description .itinerary-item-description-content .itinerary-lodge-name {
                    text-transform: uppercase;
                    margin-bottom: 18px;
                }

                .itinerary-wrapper .itinerary-item .itinerary-item-description .itinerary-item-description-content .itinerary-lodge-link {
                    margin-top: 24px;
                    /*position: absolute;
                    bottom: 32px;*/
                }

        /*.itinerary-wrapper .itinerary-item .itinerary-item-slideshow img {
            width: 100%;
            height: 100%;
            display: none;
        }

            .itinerary-wrapper .itinerary-item .itinerary-item-slideshow img:first-of-type {
                display: block;
            }*/
            
/******************************************************************
    Alternative trips widget
*******************************************************************/
.alt-trips-widget {
    position: relative;
    margin-top: 36px;
    width: calc(100% - 48px);
    padding: 24px;
    background-color: #606060;
}

    .alt-trips-widget .alt-trips-header {
        width: 100%;
        margin-bottom: 24px;
        text-align: center;
        text-transform: uppercase;
        color: #ffffff;
        font-size: 1.8rem;
        letter-spacing: 0.25em;
    }

    .alt-trips-widget a.similar-trips {
        display: block;
        width: 600px;
        height: 50px;
        margin: 36px auto 0 auto;
        border: 1px solid #fff;
        font-size: 1.8rem;
        line-height: 250%;
        color: #ffffff;
        letter-spacing: 0.25em;
        text-transform: uppercase;
        text-decoration: none;
        text-align: center;
    }

        .alt-trips-widget a.similar-trips:hover {
            color: #46bc68;
            border: 1px solid #46bc68;
        }
    
    .alt-trips-widget .trips-slider {
        position: relative;
        margin-top: 16px;
        width: 1504px; /* 1400px + 2 x 48px + 8px */
        margin: 0 auto;
    }

        .alt-trips-widget .trips-slider .trips-slider-nav {
            position: relative;
            display: inline-block;
            width: 48px;
            vertical-align: top;
        }
    
            .alt-trips-widget .trips-slider .trips-slider-nav a {
                background: url(http://images.africatravelresource.com/cdn/images/sprites.png) no-repeat 0 -118px;
                height: 19px;
                width: 34px;
                position: absolute;
                top: calc(50% - 39px);
            }

                .alt-trips-widget .trips-slider .trips-slider-nav.nav-previous-set a {
                    -ms-transform: rotate(90deg);
                    -webkit-transform: rotate(90deg);
                    transform: rotate(90deg);
                    right: 16px;
                    cursor: pointer;
                }
            
                .alt-trips-widget .trips-slider .trips-slider-nav.nav-next-set a {
                    -ms-transform: rotate(-90deg);
                    -webkit-transform: rotate(-90deg);
                    transform: rotate(-90deg);
                    left: 16px;
                    cursor: pointer;
                }
                

        .alt-trips-widget .trips-slider .trips-slider-items {
            position: relative;
            display: inline-block;
            width: 1400px; /* 4 x 360px - 40px*/
            overflow: hidden;
        }

    .alt-trips-widget .trips-slider ul {
        position: relative;
        display: block;
        padding: 0;
        margin: 0;
        width: 11520px; /* 32 x 360px */
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        list-style-type: none;
        text-align: center;
        pointer-events: auto;
        left: 0; /* need to set an intital value to the left property se the transition works first time */
        -moz-transition: left 1s ease-in-out;
        -webkit-transition: left 1s ease-in-out;
        transition: left 1s ease-in-out;
    }

        .alt-trips-widget .trips-slider ul.trip-search-results.no-transition {
            -moz-transition: none;
            -webkit-transition: none;
            transition: none;
        }
        
        .alt-trips-widget .trips-slider ul.trip-search-results li {
            display: block;
            float: left;
            width: 350px;
        }

        .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item {
            position: relative;
            display: inline-block;
            width: 314px;
            margin-left: 18px;
            margin-right: 18px;
            margin-bottom: 90px;
            vertical-align: top;
            color: #ffffff;
            text-decoration: none;
        }

            .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item span {
                color: #ccc;
                font-size: 1.2rem;
                text-transform: uppercase;
                letter-spacing: 0.1em;
                white-space: nowrap;
            }

            .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-area {
                float: left;    
                padding-bottom: 12px;
            }

            .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-rating {
                float: right;    
                padding-bottom: 12px;
            }

            .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item a.image-wrapper {
                clear: both;
                position: relative;
            }

                .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item a.image-wrapper img {
                    width: 312px;
                    height: auto;
                    border: 1px solid #454545;
                }

                .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item:hover a.image-wrapper img {
                    border: 1px solid #808080 !important;
                }

            .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item span.search-result-item-details {
                position: relative;
                display: block;
                width: 100%;
                padding-top: 12px;
                text-align: left;
            }

                .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item span.search-result-item-details span {
                    color: #fff;
                    line-height: 18px;
                    text-transform: uppercase;
                }

                .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item span.search-result-item-details span.search-result-item-price {
                    /*display: block;
                    color: #cccccc;*/
                    position: absolute;
                    display: block;
                    top: 10px;
                    right: 0;
                    text-align: right;
                }

            .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-itinerary {
                position: relative;
                display: block;
                width: 100%;
                margin-top: 16px;
                margin-bottom: 16px;
                border-top: 1px solid #ccc;
                border-bottom: 1px solid #ccc;
                padding-top: 16px;
                padding-bottom: 16px;
                text-align: left;
            }

                .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-itinerary span {
                    line-height: 20px;
                    position: relative;
                    display: block;
                }

                    .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-itinerary span a {
                        color: #fff;
                        font-size: 1.1rem;
                        letter-spacing: 0.1em;
                        text-transform: uppercase;
                        text-decoration: none;
                    }

                        .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-itinerary span a:hover {
                            color: #46bc68;
                            text-decoration: none;
                        }

            .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-tools {
                position: relative;
                display: block;
                width: 100%;
            }

                .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-tools > span a {
                    color: #ffffff;
                    text-decoration: none;
                }

                    .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-tools > span a:hover {
                            color: #46bc68;
                    }

                .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-tools > span:first-of-type {
                    float: left;
                }
                
                    .alt-trips-widget .trips-slider ul.trip-search-results li div.search-result-item .search-result-item-tools > span:last-of-type {
                        float: right;
                    }

            
/******************************************************************
    Trip pricing styles
*******************************************************************/
body.trip .content-text {
    clear: both;
    position: relative;
    width: 80%;
    max-width: 1000px;
    margin: 0 auto;
    padding-top: 0;
    /*padding-bottom: 24px;*/
    font-family: arial;
    font-size: 1.6rem;
    line-height: 150%;
    color: rgb(130, 130, 130);
    /*min-height: 300px;*/
}

    #page-content.trips-content #content-wrapper > .content-text {
        padding-top: 72px;
    }

        #page-content.trips-content #content-wrapper > .content-text ~ .content-text {
            padding-top: 24px;
        }


@media screen and (max-width: 480px) and (orientation: portrait) {
    
    #page-content.trips-content #content-wrapper > .content-text {
        padding-top: 16px;
    }
}

    body.trip .content-text h1 {
        padding-bottom: 24px;
        /*font-family: 'Nothing You Could Do', cursive;*/
        font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
        font-size: 2.4rem !important;
        text-decoration: none;
        line-height: 200%;
        text-transform: uppercase;
        letter-spacing: 0.25em;
        color: rgb(130, 130, 130);
    }

    body.trip .content-text p:not(.content-section-header) {
        padding-bottom: 24px;
        letter-spacing: 0.5px;
    }

        body.trip .content-text .trip-intro > span,
        body.trip .content-text .trip-summary > span,
        body.trip .content-text .trip-prices > span {
            display: none;
        }

            body.trip .content-text .trip-intro > span.selected,
            body.trip .content-text .trip-summary > span.selected,
            body.trip .content-text .trip-prices > span.selected {
                display: block;
            }

        body.trip .content-text p:last-of-type {
            /*padding-bottom: 0;*/
        }

        /*body.trip .trips-content .content-text .trip-intro span p:before {
            content: '... ';
        }*/

        body.trip .content-text p.content-section-header {
            font-family: "Century Gothic", CenturyGothic, AppleGothic, sans-serif;
            font-size: 1.8rem;
            letter-spacing: 0.25em;
            line-height: 150%;
            text-transform: uppercase;
            text-decoration: none;
            margin-bottom: 24px;
            color: #828282;
        }

    body.trip .what-next-wrapper {
        width: 100%;
        /*border-top: 1px solid #e0e0e0;*/
    }

        body.trip .what-next-wrapper .inner-wrapper {
            width: 600px;
            margin: 0 auto;
        }

        body.trip .what-next-wrapper .inner-wrapper .content-text {
            padding-bottom: 24px;
        }
        
            /*body.trip .what-next-wrapper .content-text p a {
                text-decoration: none;
                font-size: inherit;
                color: inherit;
                letter-spacing: inherit;
                font-weight: bold;
            }*/
            
/******************************************************************
    Trip Itinerary styles
*******************************************************************/
.trip-itinerary-wrapper {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 0;
    background-color: #ffffff;
}

    .trip-itinerary-wrapper .trip-itinerary-header {
        width: 100%;
        text-align: left;
    }

    .trip-itinerary-wrapper .trip-itinerary-cards-wrapper {
        width: 100%;
        display: flex;
        display: -webkit-flex;
        display: -moz-flex;
        -webkit-flex-flow: row wrap;
           -moz-flex-flow: row wrap;
                flex-flow: row wrap;
        -webkit-align-content: flex-start;
                align-content: flex-start;
        -webkit-justify-content: flex-start;
                justify-content: flex-start;
    }

    .trip-itinerary-wrapper .trip-itinerary-card {
        display: inline-block;
        width: 300px;
        /*height: 248px;*/ /* 80px + 168px*/
        height: auto;
        margin-right: 24px;
        margin-bottom: 36px;
    }

        /*.trip-itinerary-wrapper .trip-itinerary-card.end-row {
            margin-right: 0px;
        }*/

        .trip-itinerary-wrapper .trip-itinerary-card > a {
            display: inline-block;
            width: 100%;
        }

        .trip-itinerary-wrapper .trip-itinerary-card img {
            position: relative;
            width: calc(100% - 2px);
            height: 100%;
            border: 1px solid #454545;
        }

            .trip-itinerary-wrapper .trip-itinerary-card > a:hover img {
                border: 1px solid #a0a0a0;
            }

        .trip-itinerary-wrapper .trip-itinerary-card .trip-itinerary-card-pre-details {
            position: relative;
            width: 100%;
            padding: 6px 0 0 0;
            margin-bottom: 8px;
            overflow: hidden;
            font-size: 1.2rem;
            color: rgb(130, 130, 130);
            line-height: 200%;
        }

            .trip-itinerary-wrapper .trip-itinerary-card .trip-itinerary-card-pre-details span {
                display: block;
                text-transform: uppercase;
                letter-spacing: 2px;
            }

        .trip-itinerary-wrapper .trip-itinerary-card .trip-itinerary-card-post-details {
            position: relative;
            width: 100%;
            padding: 6px 0 0 0;
            overflow: hidden;
            color: rgb(130, 130, 130);
        }

            .trip-itinerary-wrapper .trip-itinerary-card .trip-itinerary-card-post-details a.view-itinerary-item {
                float: left;
                color: inherit;
                text-decoration: none;
            }

            .trip-itinerary-wrapper .trip-itinerary-card .trip-itinerary-card-post-details span.itinerary-item-rating {
                float: right;
                letter-spacing: 2px;
                display: none;
            }

                .trip-itinerary-wrapper .trip-itinerary-card .trip-itinerary-card-post-details span.itinerary-item-rating.selected {
                    display: block;
                }



@media screen and (max-width:480px) {
    .trip-itinerary-wrapper .trip-itinerary-card {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }
}


/******************************************************************
    Trip experiences styles
*******************************************************************/
.trip-experiences-wrapper {
    position: relative;
    width: 80%;
    max-width: 1000px;
    margin: 0 auto;
    padding-top: 36px;
    padding-bottom: 24px;
    padding-left: 0;
    padding-right: 0;
    background-color: #ffffff;
    /*border-bottom: 1px solid #e0e0e0;*/
}

    .trip-experiences-wrapper .trip-experiences-header {
        width: 100%;
        margin-bottom: 24px;
        text-align: left;
    }

    .trip-experiences-wrapper .trip-experience-cards-wrapper {
        width: 100%;
        display: none;
    }

        .trip-experiences-wrapper .trip-experience-cards-wrapper.selected {
            display: flex;
            display: -webkit-flex;
            display: -moz-flex;
            -webkit-flex-flow: row wrap;
               -moz-flex-flow: row wrap;
                    flex-flow: row wrap;
            -webkit-align-content: flex-start;
                    align-content: flex-start;
            -webkit-justify-content: flex-start;
                    justify-content: flex-start;
        }

    .trip-experiences-wrapper .trip-experience-card {
        display: inline-block;
        width: 300px;
        height: 248px; /* 80px + 168px*/
        margin-right: 24px;
        margin-bottom: 36px;
    }

        .trip-experiences-wrapper .trip-experience-card > a {
            display: inline-block;
            width: 100%;
        }

        /*.trip-experiences-wrapper .trip-experience-card.end-row {
            margin-right: 0px;
        }*/

        .trip-experiences-wrapper .trip-experience-card img {
            position: relative;
            width: calc(100% - 2px);
            height: 100%;
            border: 1px solid #454545;
        }

            .trip-experiences-wrapper .trip-experience-card > a:hover img {
                border: 1px solid #a0a0a0;
            }

        .trip-experiences-wrapper .trip-experience-card .trip-experience-card-details {
            position: relative;
            width: 100%;
            padding: 6px 0 0 0;
            margin-bottom: 36px;
            overflow: hidden;
            color: rgb(130, 130, 130);
        }

            .trip-experiences-wrapper .trip-experience-card .trip-experience-card-details span.experience-name {
                float: left;
            }

            .trip-experiences-wrapper .trip-experience-card .trip-experience-card-details span.experience-rating {
                float: right;
            }


@media screen and (max-width:767px) {

    .trip-experiences-wrapper .trip-experience-card {
        height: auto;
    }

    .trip-experiences-wrapper .trip-experience-card .trip-experience-card-details {
        margin-bottom: 16px;
    }
}


@media screen and (max-width:480px) {
    .trip-experiences-wrapper .trip-experience-card {
        width: 100%;
        margin-right: 0;
        margin-left: 0;
    }
}



    #trip-experiences-slider.experiences-slider {
        position: relative;
        display: block;
        width: calc(50% + 96px);
        max-width: 1096px;
        /*height: auto;*/
        margin: 0 auto;
    }
    
    .trip-experiences-slider-nav {
        display: inline-block;
        width: 42px;
        /*height: 562.25px;*/
    }

        .trip-experiences-slider-nav.nav-previous-set {
            /*background-color: red;*/
        }

        .trip-experiences-slider-nav.nav-next-set {
            /*background-color: green;*/
        }

        .trip-experiences-slider-nav a {
            position: relative;
            display: block;
            background: url(http://images.africatravelresource.com/cdn/images/sprites.png) no-repeat 0 -118px;
            height: 19px;
            width: 34px;
            top: calc(50% - 10px);
        }

            .trip-experiences-slider-nav.nav-previous-set a {
                -ms-transform: rotate(90deg);
                -webkit-transform: rotate(90deg);
                transform: rotate(90deg);
                right: 16px;
                cursor: pointer;
            }
            
            .trip-experiences-slider-nav.nav-next-set a {
                -ms-transform: rotate(-90deg);
                -webkit-transform: rotate(-90deg);
                transform: rotate(-90deg);
                left: 16px;
                cursor: pointer;
            }

    .trip-experiences-slider-items {
        position: relative;
        display: inline-block;
        width: calc(100% - 96px);
        /*background-color: blueviolet;*/
    }

        .trip-experiences-quadrant {
            position: relative;
            width: 50%;
            display: inline-block;
            float: left;
            overflow: hidden;
        }
                .trip-experiences-quadrant:after {
                    padding-top: 56.25%; /* 16:9 aspect ratio */
                    display: block;
                    content: '';
                }

                .trip-experiences-quadrant .trip-experiences-quadrant-item {
                    position: absolute;
                    top: 0;
                    left: 0;
                    bottom: 0;
                    right: 0;
                    width: 100%;
                    height: 100%;
                    display: inline-block;
                    opacity: 0;
                    -moz-opacity: 0;
                    transition: all 1s ease-in-out;
                    -webkit-transition: all 1s ease-in-out;
                    -moz-transition: all 1s ease-in-out;
                    z-index: 50;
                }
                
                    .trip-experiences-quadrant .trip-experiences-quadrant-item.active {
                        opacity: 1.0;
                        -moz-opacity: 1.0;
                        z-index: 100;
                    }

                    .trip-experiences-quadrant.quadrant1 .trip-experiences-quadrant-item {
                        transition-delay: 0.6s;
                        -webkit-transition-delay: 0.6s;
                        -moz-transition-delay: 0.6s;
                    }
                    
                    .trip-experiences-quadrant.quadrant2 .trip-experiences-quadrant-item {
                        transition-delay: 1.2s;
                        -webkit-transition-delay: 1.2s;
                        -moz-transition-delay: 1.2s;
                    }
                    
                    .trip-experiences-quadrant.quadrant3 .trip-experiences-quadrant-item {
                        transition-delay: 1.8s;
                        -webkit-transition-delay: 1.8s;
                        -moz-transition-delay: 1.8s;
                    }

                    .trip-experiences-quadrant .trip-experiences-quadrant-item img {
                        position: absolute;
                        top: 0;
                        left: 0;
                        bottom: 0;
                        right: 0;
                        width: 100%;
                        height: 100%;
                        border: 0;
                    }

                    .trip-experiences-quadrant .trip-experiences-quadrant-item span {
                        position: absolute;
                        bottom: 16px;
                        left: 16px;
                        color: #ffffff;
                        font-size: 1.8rem;
                        text-transform: uppercase;
                        letter-spacing: 0.25em;
                    }

                        .trip-experiences-quadrant .trip-experiences-quadrant-item span.experience-rating {
                            font-size: 3.6rem;
                        }

                            .trip-experiences-quadrant.quadrant1 .trip-experiences-quadrant-item span.experience-rating,
                            .trip-experiences-quadrant.quadrant3 .trip-experiences-quadrant-item span.experience-rating {
                                right: 16px;
                                left: auto;
                            }

                            .trip-experiences-quadrant.quadrant0 .trip-experiences-quadrant-item span.experience-name,
                            .trip-experiences-quadrant.quadrant2 .trip-experiences-quadrant-item span.experience-name {
                                right: 16px;
                                left: auto;
                            }

body.trip .content-action-button-wrapper {
    margin-bottom: 48px;
}

    /*body.trip .content-action-button-wrapper span.add-to-wishlist-text {
        display: block;
        padding-top: 18px;
        font-size: 12px;
        color: #a0a0a0;
        text-transform: uppercase;
        letter-spacing: 3px;
    }*/

        .content-action-button-wrapper span.hidden {
            display: none !important;
        }


body.trip .atr-component-section.custom-trip .atr-text-42 {
    font-size: 3.6rem;
}

@media screen and (max-width: 767px) and (orientation: portrait) {
    body.trip .atr-component-section.custom-trip .atr-m-text-32 {
        font-size: 2.8rem;
    }
}

