body, html {
    font-size: 16px
}

.divide40 {
    height: 70px
}

.header-banner {
    display: none
}

.displaypage {
    font-size: .875rem;
    display: flex;
    align-items: center;
    justify-content: flex-end
}

    .displaypage .marked i, .displaypage .maxpage {
        color: #4a90e2
    }

    .displaypage .prev {
        border-right: unset;
        font-family: Helvetica
    }

        .displaypage .prev i, .displaypage .prev1 i {
            transform: rotate(180deg)
        }

    .displaypage button {
        border-radius: 4px;
        border: solid .5px #bbb;
        background-color: #f9f9f9;
        height: 36px;
        width: 36px
    }

        .displaypage button i {
            color: #bbb
        }

    .displaypage button, .displaypage input {
        display: inline-flex;
        justify-content: center;
        align-items: center
    }

    .displaypage .page {
        box-shadow: 0 1px 1px 0 rgba(221,221,221,.5),inset 0 1px 3px 0 rgba(153,153,153,.5);
        border: solid 1px #bbb;
        background-color: #fff;
        width: 56px;
        height: 36px;
        border-radius: unset;
        color: #333740
    }

    .displaypage > span:first-child {
        margin-right: 1em
    }

    .displaypage > span:not(:first-child) {
        margin: 0 1em
    }

.pagenumbers {
    display: none !important
}

.mobile_video_picker {
    font-size: .875rem;
    line-height: 2.4;
    vertical-align: middle;
    border-radius: 2px;
    border: solid 1px #979797;
    margin: 3em auto
}

    .mobile_video_picker p {
        border-radius: 2px;
        border: solid 1px #979797;
        margin-bottom: 0;
        padding: 1em 0 1em 1em;
        cursor: pointer
    }

.glyphicon-search {
    position: absolute;
    top: .5em;
    left: .5em;
    color: #00679a;
    font-size: 1.4em
}

.help-decide {
    max-width: 800px;
    margin-bottom: 4em
}

    .help-decide h2 {
        font-size: 1.5rem;
        line-height: 1.5em;
        margin-bottom: .75em
    }

    .help-decide p {
        margin: 1.5em 0
    }

    .help-decide .help-info {
        padding-top: 5em
    }

@media(max-width: 767px) {
    .help-decide {
        display: flex;
        flex-direction: column;
        margin-bottom: 6em
    }

        .help-decide .help-info {
            order: 1;
            padding-top: 0
        }

        .help-decide :not(.help-info) {
            order: 2
        }
}

.ellipsis {
    font-size: 1.25rem;
    line-height: 1.6em;
    width: calc(100% - 1em);
    white-space: nowrap;
    overflow: hidden !important;
    text-overflow: ellipsis
}

.pagination {
    display: block
}

.video_picker.desktop {
    display: flex;
    justify-content: space-between;
    margin-top: 4em
}

    .video_picker.desktop .video_categories {
        width: 250px;
        text-align: right
    }

        .video_picker.desktop .video_categories > :not(:first-child) {
            color: #bababa;
            font-size: 1.125rem;
            height: 3rem;
            display: flex;
            justify-content: flex-end;
            align-items: center;
            padding-right: 10px
        }

            .video_picker.desktop .video_categories > :not(:first-child):hover {
                cursor: pointer
            }

        .video_picker.desktop .video_categories > :first-child {
            font-size: 1.375rem;
            line-height: 2em;
            padding-bottom: .75em;
            border-bottom: solid 1px #979797;
            margin-bottom: .875em
        }

        .video_picker.desktop .video_categories .selected {
            color: #fff;
            background-color: #36852e
        }

    .video_picker.desktop .pagination {
        width: 70%
    }

        .video_picker.desktop .pagination #list {
            display: flex;
            justify-content: space-between;
            flex-wrap: wrap
        }

            .video_picker.desktop .pagination #list .item {
                margin-bottom: 3em;
                width: 47%
            }

                .video_picker.desktop .pagination #list .item .video-img {
                    height: 205px;
                    width: 365px;
                    margin-bottom: 1em;
                    background-size: cover
                }

                .video_picker.desktop .pagination #list .item .playbutton {
                    top: 63.5px;
                    left: 146.5px
                }

                .video_picker.desktop .pagination #list .item .video-details p {
                    font-size: 1.125rem;
                    line-height: 1.875em
                }

                    .video_picker.desktop .pagination #list .item .video-details p:nth-child(2) {
                        display: flex;
                        align-items: center
                    }

                .video_picker.desktop .pagination #list .item .video-details .vhline {
                    display: inline-block;
                    height: 2rem;
                    width: 1px;
                    background-color: #979797;
                    margin: 0 1em 0
                }

.video-img {
    height: 210px;
    width: 310px;
    background-size: contain;
    background-repeat: no-repeat;
    transition: opacity 1s ease-in-out
}

    .video-img::before {
        display: block;
        content: "";
        width: 100%;
        height: 100%;
        top: 0;
        right: 0;
        left: 0;
        bottom: 0;
        background-color: rgba(0,0,0,.5)
    }

    .video-img:hover::before {
        content: unset
    }

.mfp-youtube:hover .video-img::before {
    content: unset
}

.playbutton {
    top: 66px;
    left: 116px
}

.playbutton {
    background-image: url("/cmscontent/tspro/svgs/play-button.svg");
    width: 78px;
    height: 78px;
    display: inline-block;
    background-repeat: no-repeat;
    position: absolute
}

hr {
    margin: 5em 0
}

@media(min-width: 768px) {
    hr {
        margin: 7em 0
    }
}

input[type=text] {
    height: 3em;
    border-radius: 45.5px;
    border: solid 1px #021c29;
    background-color: #fff;
    width: 460px;
    font-size: 1rem;
    padding-left: 3em;
    max-width: 100%
}

    input[type=text]::placeholder {
        color: #c4c4c4;
        font-weight: bold
    }

#video_hero {
    background-color: #00679a;
    color: #fff
}

    #video_hero a {
        color: #fff
    }

    #video_hero h1 {
        font-size: 1.875rem;
        line-height: 1.33
    }

    #video_hero h3 {
        font-size: 1rem;
        line-height: 1.6
    }

    #video_hero .hero-breadcrumb {
        font-size: .5rem
    }

    #video_hero .hero-info {
        max-width: 600px;
        margin-bottom: 3em
    }

@media(min-width: 601px) {
    #video_hero .hero-info {
        margin: 2em auto 4em;
        text-align: center
    }
}

@media(min-width: 768px) {
    #video_hero {
        background-image: linear-gradient(97deg, #c7cfd4 -31%, #3392c1 0%, #00679a 98%)
    }

        #video_hero h1 {
            font-size: 2.375rem
        }

        #video_hero .hero-breadcrumb {
            font-size: 10px
        }
}

@media(max-width: 767px) {
    .hero-info h1 {
        margin-top: 40px;
        width: 80%
    }
}