/* Minification failed. Returning unminified contents.
(3774,31): run-time error CSS1030: Expected identifier, found '.'
(3774,53): run-time error CSS1031: Expected selector, found ')'
(3774,53): run-time error CSS1025: Expected comma or open brace, found ')'
 */
@font-face {
    font-family: 'Stag Sans Web';
    src: url('css/fonts/StagSans-Light-Web.eot');
    src: url('css/fonts/StagSans-Light-Web.eot?#iefix') format('embedded-opentype'), url('css/fonts/StagSans-Light-Web.ttf') format('truetype'), url('css/fonts/StagSans-Light-Web.svg#Stag Sans Web') format('svg');
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: 'Stag Sans Web';
    src: url('css/fonts/StagSans-Book-Web.eot');
    src: url('css/fonts/StagSans-Book-Web.eot?#iefix') format('embedded-opentype'), url('css/fonts/StagSans-Book-Web.ttf') format('truetype'), url('css/fonts/StagSans-Book-Web.svg#Stag Sans Web') format('svg');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
}

@font-face {
    font-family: 'Stag Sans Web';
    src: url('css/fonts/StagSans-Semibold-Web.eot');
    src: url('css/fonts/StagSans-Semibold-Web.eot?#iefix') format('embedded-opentype'), url('css/fonts/StagSans-Semibold-Web.ttf') format('truetype'), url('css/fonts/StagSans-Semibold-Web.svg#Stag Sans Web') format('svg');
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
}

body,
html {
    min-height: 100%;
    height: auto !important; /* This line and the next line are not necessary unless you need IE6 support */
    height: 100%;
}

html {
    position: relative;
}

body {
    background-color: white;
}

.svg1 {
    width: 140.167px;
    height: 78.167px;
}

.svg2 {
    width: 372.667px;
    height: 78.167px;
    margin-left: 30px;
}

.footerWrapper {
    position: absolute;
    bottom: 0px;
    width: 100%;
}

a:visited {
    text-decoration: none;
}

.StagSans-Light-Web {
    font-family: 'Stag Sans Web';
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
}

.StagSans-Book-Web {
    font-family: 'Stag Sans Web';
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
}

.StagSans-Semibold-Web {
    font-family: 'Stag Sans Web';
    font-weight: 600;
    font-style: normal;
    font-stretch: normal;
}

.siteRedSemibold {
    color: #ff3333;
    font-size: 15px;
    font-weight: 700;
}

    .siteRedSemibold a {
        color: #ff3333;
    }

        .siteRedSemibold a:hover {
            color: #333333;
        }

.container { /* background-color:white; */
    position: relative; /* overflow-x: hidden; */
    min-width: 300px;
}

/*---------------------------------------------Header-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.header {
    height: 155px;
}

.logo {
    position: relative;
    margin-top: 40px;
}

.logoimg {
    float: left;
}

.banner {
    float: right;
}

.search {
    font-size: 13px;
    position: absolute;
    height: 80px;
    top: 40px;
    right: 0px;
    letter-spacing: 0.5px;
}

.sign-in, .sign-inMobile {
    display: none;
}

    .sign-in a, .sign-inMobile a {
        color: #333333;
    }

        .sign-in a:hover, .sign-inMobile a:hover {
            color: #ff3333;
            cursor: pointer;
            text-decoration: none;
        }

    .sign-in span, .sign-inMobile span {
        color: #ff3333;
        font-size: 15px;
    }

.sign-inMobile {
    position: absolute;
    right: 0px;
    bottom: 10px;
    font-size: 13px;
}

.searchBar {
    position: absolute;
    bottom: 0px;
    right: 0px;
}

    .searchBar input {
        color: #333333;
        height: 30px;
        width: 0px;
        position: absolute;
        bottom: 0px;
        right: 30px;
        -webkit-transition: width 0.5s ease-in-out,padding-left 0.5s ease-in-out;
        -moz-transition: width 0.5s ease-in-out,padding-left 0.5s ease-in-out;
        -o-transition: width 0.5s ease-in-out,padding-left 0.5s ease-in-out;
        transition: width 0.5s ease-in-out,padding-left 0.5s ease-in-out;
        background-color: #eaeaea;
        border: 0px;
        padding-left: 0px;
    }

        .searchBar input[type="text"] {
            color: #333333;
            font-family: 'Stag Sans Web';
            font-weight: 400;
            font-style: normal;
            font-stretch: normal;
        }

.searchButton {
    cursor: pointer;
}

.searchButtonMobile {
    margin-top: -3px;
    cursor: pointer;
}

.searchBarMobile {
    float: left;
    position: relative;
}

    .searchBarMobile input {
        height: 30px;
        width: 0px;
        -webkit-transition: width 1s ease-in-out;
        -moz-transition: width 1s ease-in-out;
        -o-transition: width 1s ease-in-out;
        transition: width 1s ease-in-out;
        background-color: #cccccc;
        border: 0px;
    }

.searchBar img {
    z-index: 2;
}

    .searchBar img:hover {
        cursor: pointer;
    }

.bLightyellow {
    background: #fff100;
    min-height: 40px;
    line-height: 40px;
    font-size: 21px;
    color: #333333;
    text-align: center;
}

    .bLightyellow a {
        color: #ff3333;
    }

/*---------------------------------------------Menubar-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

.bLightblack {
    background: #333333;
}

.menubar {
    height: 40px;
    background-color: #333333;
    position: relative;
}

#menubar {
    height: 40px;
    background-color: #333333;
    position: relative;
}

#menuFirst {
    position: absolute;
    left: 171px;
    letter-spacing: 1px;
}

#menuSecond {
    position: absolute;
    left: 261px;
    width: 875px;
}

    #menuSecond span {
        margin-left: 3.39%;
        position: relative;
        letter-spacing: 1px;
    }

.active a, .active {
    color: #ff3333 !important;
}

#menubar span {
    font-size: 24px;
    color: #ffffff;
    float: left;
    padding-left: 15px;
    padding-right: 15px;
    line-height: 40px;
    height: 40px;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

    #menubar span a {
        color: #ffffff;
    }

    #menubar span:hover {
        background-color: #ff3333;
        cursor: pointer;
        -webkit-transition: background-color 200ms linear;
        -moz-transition: background-color 200ms linear;
        -o-transition: background-color 200ms linear;
        -ms-transition: background-color 200ms linear;
        transition: background-color 200ms linear;
        color: white !important;
    }

        #menubar span:hover a {
            color: white !important;
        }

#menuMobileHeader {
    background: rgba(51, 51, 51, 0.95);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f2333333,endColorstr=#f2333333);
    text-align: center;
}

    #menuMobileHeader > span {
        display: block;
        line-height: 30px;
        height: 30px;
        cursor: pointer;
    }

#dropdownMenu {
    top: 30px;
    position: absolute;
    width: 100%;
    z-index: 100;
    text-align: left;
    background: rgba(51, 51, 51, 0.95);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f2333333,endColorstr=#f2333333);
    display: none;
}

    #dropdownMenu > ul {
        color: white;
        font-size: 26px;
        list-style-position: inside;
        list-style-type: none;
    }

        #dropdownMenu > ul > li {
            line-height: 50px;
            letter-spacing: 1px;
        }

    #dropdownMenu ul > li > a {
        padding-left: 50px;
        color: #ffffff;
    }

    #dropdownMenu a {
        text-decoration: none;
        display: block;
    }

    #dropdownMenu > ul > li > a:hover {
        background-color: #ff3333;
        cursor: pointer;
    }

.dropFirstActive {
    background-color: #ff3333;
}

#dropdownMenu > ul > li > ul {
    line-height: 50px;
    letter-spacing: 1px;
    background: rgba(102,102,102,0.70);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#b2666666,endColorstr=#b2666666);
    display: none;
}

    #dropdownMenu > ul > li > ul > li {
        font-size: 23px;
        list-style-position: inside;
        list-style-type: none;
    }

#dropdownMenu ul > li > ul > li > a {
    padding-left: 70px;
    color: #ffffff;
}

#dropdownMenu > ul > li > ul > li > a:hover {
    background-color: #333333;
    cursor: pointer;
}

.dropSecActive {
    background-color: #333333;
}

#dropdownMenu > ul > li > ul > li > ul {
    line-height: 50px;
    padding-left: 20px;
    display: none;
}

    #dropdownMenu > ul > li > ul > li > ul > li {
        font-size: 18px;
        list-style-position: inside;
        list-style-type: none;
    }

        #dropdownMenu > ul > li > ul > li > ul > li:hover {
            color: #ff3333;
            cursor: pointer;
        }

            #dropdownMenu > ul > li > ul > li > ul > li:hover a {
                color: #ff3333;
                cursor: pointer;
            }

.divider {
    height: 1px;
    background-color: white;
}

    .divider:hover {
        cursor: default;
    }

#overlay {
    position: absolute;
    left: -0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(51, 51, 51, 0.75);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#d9333333', endColorstr='#d9333333'); /* IE */
    z-index: 10;
    opacity: 0;
    -webkit-transition: opacity 0.6s ease-in-out;
    -moz-transition: opacity 0.6s ease-in-out;
    -o-transition: opacity 0.6s ease-in-out;
    -ms-transition: opacity 0.6s ease-in-out;
    transition: opacity 0.6s ease-in-out;
}

.latestOverlay {
    position: absolute;
    left: -0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: rgba(51, 51, 51, 0.75);
    z-index: 10;
    opacity: 0;
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    -ms-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}

#catalogue:hover > span {
    background-color: #ff3333;
    cursor: pointer;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

#catalogueAbove {
    position: absolute;
    color: white;
    left: 0px;
    top: 40px;
    width: 870px;
    font-size: 32px;
    z-index: 20;
    background: rgb(255,51,51); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(255,51,51,1) 0%, rgba(102,0,0,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,51,51,1)), color-stop(100%,rgba(102,0,0,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3333', endColorstr='#660000',GradientType=0 ); /* IE6-9 */
    -webkit-box-shadow: -10px 0px 10px 0px rgba(51,51,51,0.50),0px 10px 10px 0px rgba(51,51,51,0.50);
    -moz-box-shadow: -10px 0px 10px 0px rgba(51,51,51,0.50),0px 10px 10px 0px rgba(51,51,51,0.50);
    box-shadow: -10px 0px 10px 0px rgba(51,51,51,0.50),0px 10px 10px 0px rgba(51,51,51,0.50);
    padding-top: 20px;
    margin-left: 3.39%;
    display: none;
}

    #catalogueAbove div {
        float: left;
    }

.catalogueList {
    padding-left: 0px;
    list-style: none;
}

    .catalogueList a {
        color: white;
    }

#resources:hover > span {
    background-color: #ff3333;
    cursor: pointer;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

#resourcesAbove {
    position: absolute;
    color: white;
    left: 168px;
    top: 40px;
    width: 702px;
    font-size: 32px;
    z-index: 20;
    background: rgb(255,51,51); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(255,51,51,1) 0%, rgba(102,0,0,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,51,51,1)), color-stop(100%,rgba(102,0,0,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3333', endColorstr='#660000',GradientType=0 ); /* IE6-9 */
    -webkit-box-shadow: -10px 0px 10px 0px rgba(51,51,51,0.50),0px 10px 10px 0px rgba(51,51,51,0.50);
    -moz-box-shadow: -10px 0px 10px 0px rgba(51,51,51,0.50),0px 10px 10px 0px rgba(51,51,51,0.50);
    box-shadow: -10px 0px 10px 0px rgba(51,51,51,0.50),0px 10px 10px 0px rgba(51,51,51,0.50);
    padding-top: 20px;
    margin-left: 3.39%;
    display: none;
}

    #resourcesAbove div {
        float: left;
    }

.resourcesContent {
    padding-bottom: 50px;
    padding-top: 20px;
}

    .resourcesContent p {
        padding-left: 15px;
    }

    .resourcesContent .cPanelSmHeader:first-of-type {
        margin-top: 0px;
    }

    .resourcesContent .cPanelSmHeader:not(.resourceSong):before {
        /*content: url('../css/images/download-icon.png');
    /*position: relative;
    top: 10px;
    margin-right: 10px;*/
        content: '';
        width: 45px;
        height: 45px;
        display: inline-block;
        background-image: url(css/images/download-icon.png);
        background-repeat: no-repeat;
    }

    .resourcesContent .cPanelSmHeader.resourceSong:before {
        content: '';
        display: inline-block;
        width: 90px;
        height: 45px;
        background-image: url(css/images/download-icon.png), url(css/images/audio-icon.png);
        background-position: 46px 0, 0 0;
        background-repeat: no-repeat, repeat;
    }


    .resourcesContent img {
        float: left;
        position: relative;
        top: 10px;
    }

audio {
    margin: 10px 0px;
}

ul, li, img {
    margin: 0;
    padding: 0;
}

img {
    border: 0;
}

.siteRedSemibold {
    color: #ff3333;
    font-size: 15px;
    font-weight: 700;
}

    .siteRedSemibold a {
        color: #ff3333;
    }

        .siteRedSemibold a:hover {
            color: #333333;
        }

.catalogueList li {
    display: list-item;
    clear: both;
    font-size: 21px;
    list-style-position: inside;
    margin-top: 15px !important;
    padding-left: 30px !important;
    line-height: 29px;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

    .catalogueList li:hover {
        background-color: #333333;
        -webkit-transition: background-color 200ms linear;
        -moz-transition: background-color 200ms linear;
        -o-transition: background-color 200ms linear;
        -ms-transition: background-color 200ms linear;
        transition: background-color 200ms linear;
        cursor: pointer;
    }

#slideshow {
    position: relative;
    /*height: 500px;*/ /*redesigned it for small screens within newMMlooks css - marina 11-10-18*/
}

.slide {
    /*height: 500px;*/ /*redesigned it for small screens within newMMlooks css - marina 11-10-18*/
    width: 100%;
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    text-align: center;
    z-index: 2;
}

    /*.slide4:hover {
    opacity: 0.7;
    filter: alpha(opacity=70);
}*/ /*no more a link - marina 10-10-18*/

    .slide img {
        vertical-align: middle;
    }

/*.sl-btn-wrapper {
    position: absolute;
    bottom: 20px;
    margin-left: auto;
    margin-right: auto;
    left: 0;
    right: 0;
    z-index: 3;
}

.sl-btn {
    width: 15px;
    height: 15px;
    background: #ff3333;
    display: inline-block;
    cursor: pointer;
    border-radius: 8px;
    border: 2px solid white;
    margin: 0 2px;
}*/ /*transfered within media quieries in newMMlooks css - marina 15-10-18*/
@media (pointer: fine) {
    .sl-btn:hover {
        background: white;
        border: 2px solid #ff3333;
    }
}

#slideshow video {
    width: 100%;
}

.slideRelated {
    height: 500px;
}

#quickLinks {
    position: absolute;
    right: 0px;
    bottom: 0px;
    width: 25%;
    height: 270px;
    background: rgba(51, 51, 51, 0.85);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#d9333333', endColorstr='#d9333333'); /* IE */
    border-top: 12px solid #ff3333;
    transition: opacity 0.5s ease-in-out,z-index 0.5s ease-in-out,border 0.5s ease-in-out;
    -webkit-transition: opacity 0.5s ease-in-out,z-index 0.5s ease-in-out,border 0.5s ease-in-out;
    z-index: 2;
}

#quickLinksHeader {
    margin-left: 30px;
    margin-top: 22px;
    font-size: 28px;
    color: #ffffff;
    line-height: 28px;
}

#quickLinksBody {
    margin-left: 40px;
    margin-top: 30px;
    font-size: 15px;
}

    #quickLinksBody a {
        color: #ffffff;
    }

    #quickLinksBody ul {
        list-style: none;
        padding-left: 0px;
    }

        #quickLinksBody ul li {
            margin-top: 20px;
            padding-left: 20px;
            padding-bottom: 20px;
            width: 205px;
            border-bottom: 2px solid #999999;
            background: url('css/images/arrow.png') no-repeat 0px 3px;
        }

            #quickLinksBody ul li:hover {
                cursor: pointer;
                background: url('css/images/arrow-hover.png') no-repeat 0px 3px;
            }

                #quickLinksBody ul li:hover a {
                    color: #ff3333;
                }

    #quickLinksBody span {
        margin-left: 10px;
        display: block;
    }

#quickMobileHeader > span {
    text-align: center;
    display: block;
    height: 20px;
    background-color: #ff3333;
    line-height: 16px;
    position: relative;
}

#quickMobile {
    padding-top: 20px;
    padding-bottom: 10px;
    width: 100%;
    z-index: 100;
    text-align: left;
    background: rgba(51, 51, 51, 0.95);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#f2333333,endColorstr=#f2333333);
    display: none;
}

.quickMobilePanelSpan {
    color: #ffffff;
    font-size: 15px;
    width: 46%;
    padding-bottom: 20px;
    padding-top: 20px;
    float: none;
    margin-left: 10px;
    width: auto;
}

    .quickMobilePanelSpan a:hover {
        color: #ff3333;
        text-decoration: none;
        background: url('css/images/arrow-hover.png') no-repeat 0px 3px;
        cursor: pointer;
    }

#quickMobileHeader > span {
    cursor: pointer;
}

.quickMobilePanelSpan a {
    color: #ffffff;
    display: list-item;
    list-style-position: inside;
    list-style: none;
    background: url('css/images/arrow.png') no-repeat 0px 3px;
    padding-left: 20px;
}

#quickMobilePanelHeader {
    color: white;
    font-size: 26px;
}

.courses {
    border-top: 12px solid #ff3333;
    min-height: 400px;
    position: relative;
    margin-top: 40px;
}

.comboBanner {
    margin-left: 0px !important;
    margin-right: 0px !important;
    /*margin-left: 4.23%;
    margin-right: 4.23%;*/
    height: 400px;
    line-height: 400px;
    /*background: #769ead;
    background: -moz-linear-gradient(left, #769ead 0%, #97ccde 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#769ead), color-stop(100%,#97ccde));
    background: -webkit-linear-gradient(left, #769ead 0%,#97ccde 100%);
    background: -o-linear-gradient(left, #769ead 0%,#97ccde 100%);
    background: -ms-linear-gradient(left, #769ead 0%,#97ccde 100%);
    background: linear-gradient(to right, #769ead 0%,#97ccde 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#769ead', endColorstr='#97ccde',GradientType=1 );*/
    text-align: center;
    position: relative;
    /*cursor: pointer;*/ /*not needed - marina 7-8-18*/
}

.coursesWrapper {
    margin-top: 20px;
    margin-left: 16.92%;
    width: 69.49%;
    position: relative;
}

.coursesHeader {
    font-size: 28px;
    color: #ff3333;
}

    .coursesHeader a {
        color: #ff3333;
    }

.coursesBody {
    margin-top: 20px;
    font-size: 15px;
    color: #333333;
    position: relative;
}

.coursesLinks {
    margin-top: 40px;
    font-size: 18px;
    list-style-position: inside;
    color: #666666;
}

    .coursesLinks a {
        color: #666666;
    }

        .coursesLinks a:hover {
            color: #ff3333;
        }

    .coursesLinks ul {
        padding-left: 0px;
    }

        .coursesLinks ul li:hover {
            color: #ff3333;
            cursor: pointer;
        }

.coursesMore {
    position: absolute;
    left: 16.92%;
    bottom: 0px;
    font-size: 13px;
    color: #ff3333;
}

    .coursesMore a {
        color: #ff3333;
    }

#breadcrumbs {
    text-transform: uppercase;
    margin-bottom: 40px;
    margin-top: 20px;
}

.coursesMore a:hover {
    color: #666666;
}

.coursesMore:hover {
    cursor: pointer;
    color: #666666;
}

#teaching {
    margin-left: 4.23%;
    margin-right: 4.23%;
    height: 400px;
    line-height: 400px;
    background: #769ead;
    background: -moz-linear-gradient(left, #769ead 0%, #97ccde 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,#769ead), color-stop(100%,#97ccde));
    background: -webkit-linear-gradient(left, #769ead 0%,#97ccde 100%);
    background: -o-linear-gradient(left, #769ead 0%,#97ccde 100%);
    background: -ms-linear-gradient(left, #769ead 0%,#97ccde 100%);
    background: linear-gradient(to right, #769ead 0%,#97ccde 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#769ead', endColorstr='#97ccde',GradientType=1 );
    text-align: center;
    position: relative;
    cursor: pointer;
}

    #teaching:hover {
        background: #13494d !important;
        background: -moz-linear-gradient(left, #13494d 0%, #30747a 100%) !important;
        background: -webkit-gradient(linear, left top, right top, color-stop(0%,#13494d), color-stop(100%,#30747a)) !important;
        background: -webkit-linear-gradient(left, #13494d 0%,#30747a 100%) !important;
        background: -o-linear-gradient(left, #13494d 0%,#30747a 100%) !important;
        background: -ms-linear-gradient(left, #13494d 0%,#30747a 100%) !important;
        background: linear-gradient(to right, #13494d 0%,#30747a 100%) !important;
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#13494d', endColorstr='#30747a',GradientType=1 ) !important;
    }

    #teaching img {
        max-height: 90%;
        max-width: 90%;
        vertical-align: middle;
        margin: auto;
    }

.errorMsg {
    line-height: 20px;
    font-size: 16px;
    color: #ff3333;
}

#mailError {
    visibility: hidden;
}

#emptyError {
    visibility: hidden;
}

#fileError {
    display: none;
}


.infos {
    height: 660px;
    position: relative;
    background-color: #666666;
}

.infosWrapper {
    margin-top: 32px;
    margin-left: 16.92%;
    width: 70%;
    position: relative;
}

.infosHeader {
    font-size: 28px;
    color: #ffffff;
}

.infosBody {
    margin-top: 20px;
    font-size: 15px;
    color: #ffffff;
}

.infosImg {
    margin-top: 20px;
    padding-bottom: 30px;
    border-bottom: 2px solid #999999;
}

.infosExtra {
    margin-top: 20px;
    font-size: 15px;
    color: #ffffff;
    position: relative;
    line-height: 1.3;
    padding-bottom: 30px;
    overflow: hidden;
}

#infosExtraFirst {
    width: 25%;
    float: left;
}

#infosExtraSec {
    width: 65%;
    float: left;
    padding-left: 9.75%;
    padding-bottom: 20px;
}

#latestAbove {
}

#presenceHeader {
    font-size: 28px;
    color: #ffffff;
    margin-top: 32px;
    margin-left: 16.92%;
    width: 69.49%;
}

#presenceImg {
    width: 100%;
    margin-top: 20px;
}

#presenceBody {
    margin-left: 16.92%;
    margin-top: 30px;
    width: 69.49%;
    font-size: 15px;
    color: #ffffff;
    line-height: 1.3;
}

#footer {
    min-height: 60px;
    background-color: #ff3333;
}

#copyright {
    font-size: 13px;
    color: #ffffff;
    padding-top: 15px;
}

#latest {
    margin-top: 40px;
    border-top: 12px solid #ff3333;
    margin-right: 4.23%;
    margin-left: 4.23%;
    position: relative;
}

#latestHeader {
    font-size: 28px;
    color: #ff3333;
    margin-top: 20px;
    margin-left: 5.88%;
}

#latestH2 {
    font-size: 20px;
    color: #ff3333;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 5.88%;
}

#latestFooter {
    font-size: 16px;
    color: #333;
    margin-top: 20px;
    margin-bottom: 20px;
    margin-left: 5.88%;
    margin-right: 5.88%;
}

.latestPanel {
    font-size: 28px;
    color: #ff3333;
    overflow-y: scroll;
    height: 588px;
    padding: 0px 0px;
    overflow-x: hidden;
    position: relative;
    margin-left: 5.88%;
}

#arrowup {
    position: absolute;
    width: 20px;
    height: 30px;
    right: 0px;
    top: 79px;
    background: #ff3333;
    z-index: 3;
}

#arrowdown {
    position: absolute;
    width: 20px;
    height: 30px;
    right: 0px;
    bottom: 0px;
    background: #ff3333;
    z-index: 3;
}

.news {
    margin-left: 3.93%;
    margin-top: 20px;
    position: relative;
    height: 20%;
}

.newsImage {
    height: auto;
    width: 26.6%;
    float: left;
}

    .newsImage img {
        border: 5px solid white;
    }

.newsBody {
    width: 63%;
    float: left;
    margin-left: 3.93%;
    position: relative;
    height: 100%;
}

.newsHeader {
    font-size: 18px;
    height: 25%;
    line-height: 1.2;
}

.newsPanel {
    font-size: 14px;
    color: #ffffff;
    height: 75%;
}

    .newsPanel p {
        vertical-align: middle;
    }

    .newsPanel span {
        font-size: 14px;
        color: #ff3333;
    }

        .newsPanel span:hover,
        .newsHeader:hover,
        .newsImage img:hover {
            cursor: pointer;
        }

#sub {
    background: rgb(255,51,51); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(255,51,51,1) 0%, rgba(102,0,0,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,51,51,1)), color-stop(100%,rgba(102,0,0,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3333', endColorstr='#660000',GradientType=0 ); /* IE6-9 */
    zoom: 1;
}

#eltSub {
    background: #62c9dd; /* Old browsers */
    background: -moz-linear-gradient(top,#62c9dd 0%, #377d87 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#62c9dd), color-stop(100%,#377d87)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,#62c9dd 0%,#377d87 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #62c9dd 0%,#377d87 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #62c9dd 0%,#377d87 100%); /* IE10+ */
    background: linear-gradient(to bottom,#62c9dd 0%,#377d87 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#62c9dd', endColorstr='#377d87',GradientType=0 ); /* IE6-9 */
    zoom: 1;
}

#subHeader {
    color: #ffffff;
    font-size: 48px;
}

#subHeaderSmall {
    padding-top: 35px;
    letter-spacing: 1px;
    font-size: 19px;
    height: 60px;
}

#subHeaderBig {
    margin-top: -8px;
    padding-bottom: 15px;
}

#subNode {
    padding-top: 45px;
    padding-bottom: 15px;
    color: #ffffff;
    font-size: 48px;
    padding-left: 4.24%;
}

#about {
    margin-top: 20px;
    padding: 0px 0px;
}

.aboutNode:first-child {
    margin-top: 0px;
}

.aboutNode {
    margin-bottom: 60px;
    /* max-width: 800px; */ margin-right: 40px;
}

.aboutNodeHeader {
    background-color: #ff3333;
    line-height: 40px;
    font-size: 24px;
    color: #ffffff;
    padding-left: 10px;
}

.aboutNodeSubheader {
    background-color: #333333;
    line-height: 50px;
    font-size: 24px;
    color: #ffffff;
    padding-left: 30px;
    padding-right: 15px;
}

    .aboutNodeSubheader img {
        margin-top: -15px;
        padding-right: 5px;
    }

    .aboutNodeSubheader span img {
        padding-left: 5px;
    }

.aboutNodeBody {
    min-height: 1px;
    padding-left: 3.84%;
    padding-top: 20px;
    padding-bottom: 20px;
    font-size: 15px;
    color: #333333;
    padding-right: 5.13%;
    background: rgb(204,204,204); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(204,204,204,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(204,204,204,1)), color-stop(100%,rgba(255,255,255,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(204,204,204,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(204,204,204,1) 0%,rgba(255,255,255,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(204,204,204,1) 0%,rgba(255,255,255,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(204,204,204,1) 0%,rgba(255,255,255,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cccccc', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */
    overflow: hidden;
}

    .aboutNodeBody ul {
        padding-left: 0px;
        list-style-position: inside;
    }

#breadcrumbs a {
    color: #999999;
    font-size: 13px;
    text-decoration: none;
    cursor: pointer;
}

    #breadcrumbs a:hover {
        color: #333333;
    }

    #breadcrumbs a:last-child {
        color: #ff3333 !important;
        cursor: auto;
    }

#breadcrumbs span {
    color: #ff3333;
    font-family: 'Stag Sans Web';
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
}

#contact {
    background: rgb(88,88,91); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(88,88,91,1) 0%, rgba(109,110,112,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(88,88,91,1)), color-stop(100%,rgba(109,110,112,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(88,88,91,1) 0%,rgba(109,110,112,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(88,88,91,1) 0%,rgba(109,110,112,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(88,88,91,1) 0%,rgba(109,110,112,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(88,88,91,1) 0%,rgba(109,110,112,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58585b', endColorstr='#6d6e70',GradientType=0 ); /* IE6-9 */
    padding-bottom: 50px;
}

#contactWrapper {
    margin-left: 13.55%;
    padding-top: 30px;
    width: 72%;
}

#copiesWrapper {
    padding: 30px 50px 0px 40px;
    background: rgb(88,88,91); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(88,88,91,1) 0%, rgba(109,110,112,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(88,88,91,1)), color-stop(100%,rgba(109,110,112,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(88,88,91,1) 0%,rgba(109,110,112,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(88,88,91,1) 0%,rgba(109,110,112,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(88,88,91,1) 0%,rgba(109,110,112,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(88,88,91,1) 0%,rgba(109,110,112,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#58585b', endColorstr='#6d6e70',GradientType=0 ); /* IE6-9 */
    padding-bottom: 50px;
}

#contactHeader {
    color: #ffffff;
    font-size: 24px;
}

#contactMore {
    color: #ffffff;
    font-size: 15px;
    margin-top: 20px;
}

.contactBody {
    color: #ffffff;
    margin-top: 30px;
    font-size: 18px;
}

.contactInput {
    margin-top: 10px;
    position: relative;
}

    .contactInput input,
    .contactInput textarea,
    .contactInput select {
        width: 100%;
    }

    .contactInput textarea {
        height: 210px;
    }

#contactSubmit {
    margin-top: 40px;
    color: #ffffff;
    font-size: 18px;
}

    #contactSubmit:hover {
        cursor: pointer;
    }

#catalHeader {
    margin-bottom: 30px;
}

#catalHeaderMobile {
    margin-top: 30px;
}

#catalHeaderImg {
    float: left;
    padding-right: 4.24%;
    position: relative;
    overflow: hidden;
    max-width: 100%;
}

    #catalHeaderImg img {
        max-width: 100%;
    }

#catalHeaderSlideshow {
    position: relative;
    height: 305px;
    width: 218px;
}

    #catalHeaderSlideshow img {
        position: absolute;
        top: 0px;
        left: 0px;
        opacity: 0;
        transition: opacity 0.5s ease-in-out;
        -webkit-transition: opacity 0.5s ease-in-out;
        height: 100%;
        width: 100%;
    }

.catalHeaderActive {
    opacity: 1 !important;
}

#catalHeaderImg:hover > a > #catalHeaderOverlay,
#catalHeaderImg:hover > #catalHeaderOverlay,
#catalHeaderImgM:hover > #catalHeaderOverlay {
    bottom: 0px;
}

#catalHeaderOverlay {
    position: absolute;
    bottom: -30px;
    height: 30px;
    left: 0px;
    background-color: black;
    color: #ffffff;
    width: 218px;
    line-height: 30px;
    text-align: center;
    font-size: 15px;
    background: rgba(51, 51, 51, 0.85);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#d9333333', endColorstr='#d9333333'); /* IE */
    -webkit-transition: bottom 0.4s ease-in-out;
    -moz-transition: bottom 0.4s ease-in-out;
    -o-transition: bottom 0.4s ease-in-out;
    transition: bottom 0.4s ease-in-out;
}

#catalHeaderImgMobile:hover > a > #catalHeaderOverlayMobile, #catalHeaderImgMobile:hover > #catalHeaderOverlayMobile {
    bottom: 0px;
}

#catalHeaderImgMobile {
    width: 218px;
    height: 305px;
    position: relative;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    margin-top: 20px;
}

#catalHeaderOverlayMobile {
    position: absolute;
    height: 30px;
    bottom: -30px;
    background-color: black;
    color: #ffffff;
    width: 215px;
    line-height: 30px;
    text-align: center;
    font-size: 15px;
    background: rgba(51, 51, 51, 0.85);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#d9333333', endColorstr='#d9333333'); /* IE */
    -webkit-transition: bottom 0.4s ease-in-out;
    -moz-transition: bottom 0.4s ease-in-out;
    -o-transition: bottom 0.4s ease-in-out;
    transition: bottom 0.4s ease-in-out;
}

#catalHeaderBody {
    margin-left: 263px;
}

#catalHeaderBodyMobile {
}

#catalHeaderBodyTitle, .elearnTitle {
    color: #ff3333;
    font-size: 36px;
    border-bottom: 6px solid #666666;
    padding-bottom: 5px;
    line-height: 45px;
}

.cefr img {
    margin-right: 5px !important;
}

#catalHeaderBodySubtitle > img {
    margin-right: 10px;
}

.cefr img {
}

#catalHeaderBodyTitle img, #catalHeaderBodyTitleMobile img {
    margin-left: 10px;
}

#catalHeaderBodyTitleMobile {
    color: #ff3333;
    font-size: 36px;
    border-bottom: 6px solid #666666;
    padding-bottom: 5px;
    line-height: 45px;
}

#catalHeaderBodySubtitle {
    color: #ff3333;
    font-size: 24px;
    font-family: Rockwell;
    margin-top: 10px;
    overflow: hidden;
}

#catalHeaderBodyPanel {
    font-size: 15px;
    color: #333333;
    max-width: 590px;
    margin-top: 35px;
    padding-right: 20px;
}

#catalHeaderBodyPanelMobile {
    font-size: 15px;
    color: #333333;
    margin-top: 25px;
    padding-right: 20px;
}

#catalHeaderBodyLinks {
    font-size: 15px;
    color: #333333;
    margin-top: 12px;
    float: left;
}

    #catalHeaderBodyLinks img {
        padding-left: 10px;
    }

.cPanelHeader img:not(.notCollapseArrow), #cMethodologyHeader img, #whHeader img {
    height: 25px;
    width: auto;
    position: absolute;
    right: 20px;
    top: 20px;
}

.notCollapseArrow {
    display: none;
}

#wtcc { /* padding-top: 30px; */
    position: relative;
}







.seeMore {
    font-size: 15px;
    color: #ff3333;
    white-space: nowrap;
    cursor: pointer;
}

.seeMoreDiv {
    -webkit-transition: max-height 1s ease-in-out;
    -moz-transition: max-height 1s ease-in-out;
    -o-transition: max-height 1s ease-in-out;
    transition: max-height 1s ease-in-out;
    max-height: 0px;
    overflow: hidden;
}

#cMenu {
    position: relative;
    height: 40px;
    font-size: 21px;
    z-index: 1000;
}

    #cMenu span:first-child {
        margin-left: 0px;
    }

    #cMenu span a {
        color: #ff3333;
        -webkit-transition: background-color 200ms linear;
        -moz-transition: background-color 200ms linear;
        -o-transition: background-color 200ms linear;
        -ms-transition: background-color 200ms linear;
        transition: background-color 200ms linear;
    }

    #cMenu span {
        padding-left: 15px;
        padding-right: 15px;
        margin-left: 30px;
        line-height: 40px;
        display: inline-block;
        -webkit-transition: background-color 200ms linear;
        -moz-transition: background-color 200ms linear;
        -o-transition: background-color 200ms linear;
        -ms-transition: background-color 200ms linear;
        transition: background-color 200ms linear;
    }

        #cMenu span:hover {
            color: #ffffff;
            background-color: #ff3333;
            cursor: pointer;
            -webkit-transition: background-color 200ms linear;
            -moz-transition: background-color 200ms linear;
            -o-transition: background-color 200ms linear;
            -ms-transition: background-color 200ms linear;
            transition: background-color 200ms linear;
        }

            #cMenu span:hover a {
                color: white;
            }

.cMenuActive {
    color: #ffffff;
    background-color: #ff3333;
    cursor: pointer;
    -webkit-transition: background-color 200ms linear;
    -moz-transition: background-color 200ms linear;
    -o-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

#cMenu img {
    height: 24px;
    position: absolute;
    right: 0px;
    top: 6px;
}

    #cMenu img:hover {
        cursor: pointer;
    }

#menuFixed {
    border: 2px solid #ff3333;
    background: rgba(255,255,255,.95);
    color: #ff3333;
}

.f-navMobile {
    position: fixed;
    top: 0px;
    background-color: #eaeaea;
    width: 100%;
    left: 0px;
    padding-left: 20px;
    z-index: 999;
    height: 60px;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
    -moz-box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
    box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
}

.f-navMobileW {
    position: fixed;
    top: 0px;
    background-color: #666666;
    width: 100%;
    left: 0px;
    padding-left: 20px;
    z-index: 999;
    height: 60px;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
    -moz-box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
    box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
}

.f-navMobileC {
    position: fixed;
    top: 0px;
    background-color: white;
    width: 100%;
    left: 0px;
    padding-left: 20px;
    z-index: 999;
    height: 60px;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
    -moz-box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
    box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
    border-top: 1px solid #ff3333 !important;
}

.f-nav {
    z-index: 1;
    position: fixed;
    top: 0px;
    right: auto;
    padding-top: 0px !important;
    margin-top: 0px !important;
    width: 100% !important;
    -webkit-box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
    -moz-box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
    box-shadow: 0px 5px 5px 0px rgba(51,51,51,0.50);
}

.f-menu {
    height: 60px !important;
    font-size: 24px !important;
}

.f-span {
    line-height: 60px !important;
}

#cPanel {
    padding-top: 35px;
    padding-bottom: 30px;
    background-color: #eaeaea;
    /* margin-left:4.24%; */
    /* margin-right:4.24%; */
    overflow: hidden;
    position: relative;
}

.cPanelHeader, .fbHeader {
    font-size: 30px;
    color: #ff3333;
}

#cPanelBody {
    margin-top: 20px;
    font-size: 15px;
    color: #333333;
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
    -webkit-column-gap: 40px; /* Chrome, Safari, Opera */
    -moz-column-gap: 40px; /* Firefox */
    column-gap: 40px;
    margin-bottom: 30px;
}

.cPanelSmHeader {
    font-size: 36px;
    color: #ff3333;
    margin-top: 40px;
    padding-bottom: 8px;
    border-bottom: 1px solid #ff3333;
}

/*.resourceSong>div {
    display: flex;
    align-items: baseline;
}*/ /*rodopi 5-11-18*/

.resourceSong > div > div {
    display: flex;
}

.cPanelSmHeader > span {
    color: #666666;
}

.cPanelSmPanel {
    font-size: 15px;
    color: #333333;
    margin-top: 12px;
}

    .cPanelSmPanel li {
        margin-top: 12px;
        list-style-position: inside;
    }

        .cPanelSmPanel li a {
            font-size: 15px;
            color: #333333;
        }

            .cPanelSmPanel li a:hover {
                color: #ff3333;
                cursor: pointer;
            }

#cPanelLevelsImages {
    position: relative;
    margin-top: 15px;
    margin-bottom: 35px;
    overflow: hidden;
    text-align: center;
}

.cPNode {
    width: 124px;
    height: auto;
    /* float:left; */
    /* margin-right: 20px; */
    position: relative;
    margin-bottom: 35px;
    display: inline-block;
    margin-right: 10px;
    margin-left: 10px;
    position: relative;
}

.cPNodeLevel {
    display: block;
    position: absolute;
    bottom: -25px;
    left: 0px;
    font: 15px Stag Sans Web;
    color: #ff3333;
    width: 124px;
}

    .cPNodeLevel:hover {
        color: #333;
    }

#cPanelLevelsImages div img {
    width: 100%;
    height: auto;
    min-width: 124px;
    cursor: auto !important;
}

.cPNode:hover > .cPanelLevelsImagesOverlay {
    opacity: 1;
}

.cPNode:hover {
    cursor: pointer;
}

.cPanelLevelsImagesOverlay {
    position: absolute;
    text-align: left;
    height: 100%;
    width: 100%;
    top: 0px;
    left: 0px;
    color: #ffffff;
    font-size: 15px;
    background: rgba(51, 51, 51, 0.85);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#d9333333', endColorstr='#d9333333'); /* IE */
    -webkit-transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
    opacity: 0;
}

    .cPanelLevelsImagesOverlay ul {
        font-size: 13px;
        color: #ffffff;
        list-style-position: outside;
        margin-left: 25px;
        margin-top: 15px;
    }

    .cPanelLevelsImagesOverlay > p {
        margin-top: 10px;
        margin-left: 11px;
        font-size: 15px;
    }

    .cPanelLevelsImagesOverlay > span {
        position: absolute;
        right: 15px;
        bottom: 15px;
        font-size: 13px;
    }

#cComponents {
    text-align: center;
    letter-spacing: 0.3px;
    color: #898685;
}

    #cComponents a {
        color: #898685;
    }

.cNode {
    display: inline-block;
    padding-bottom: 35px;
    text-align: center;
    width: 260px;
}

#cComponents {
    text-align: center !important;
    margin: 25px auto;
}

.cNodePanel {
    width: 260px;
    height: 220px;
    line-height: 220px;
    background-color: white;
    border-radius: 10px;
    overflow: hidden;
    margin-top: 10px;
    text-align: center;
    vertical-align: middle;
    position: relative;
}

    .cNodePanel img {
        max-height: 100%;
        width: auto;
        margin-top: -4px;
        margin: auto;
    }

#wh {
    padding: 15px 0px 40px 0px;
    background-color: #333333;
}

#whHeader {
    color: #ffffff;
    font-size: 30px;
}

#whBody, #wh2Body {
    color: #ffffff;
    font-size: 15px;
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
    -webkit-column-gap: 40px; /* Chrome, Safari, Opera */
    -moz-column-gap: 40px; /* Firefox */
    column-gap: 40px;
    margin-top: 20px;
    line-height: 25px;
}

    #wh2Body ul {
        margin-left: 20px;
    }

.wtcc2 {
    padding: 20px 0px 30px 0px;
}

.fbWHy {
    color: #333333;
    font-size: 15px;
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
    -webkit-column-gap: 40px; /* Chrome, Safari, Opera */
    -moz-column-gap: 40px; /* Firefox */
    column-gap: 40px;
    margin-top: 10px;
    line-height: 25px;
    margin-bottom: 50px;
}

    .fbWHy li {
        margin-left: 20px;
    }

#cMethodologyAbove {
    zoom: 1;
    position: relative;
}

#cMethodology {
    padding-right: 7.06%;
    background-color: white;
    padding-top: 20px;
    margin-bottom: 20px;
}

#cHow {
    font-size: 15px;
    padding-top: 20px;
    padding-left: 25px;
    padding-right: 50px;
    padding-bottom: 20px;
    background-color: #eaeaea;
}

.cHowfl {
    float: left;
}

#cMethodologyHeader, #cMethodologyHeaderM {
    font-size: 30px;
    color: #ff3333;
    padding-bottom: 20px;
}

#cMethodologyBody {
    font-size: 15px;
    color: #333333;
}

    #cMethodologyBody span {
        font-size: 15px;
        color: #333333;
    }

    #cMethodologyBody p, #chow p {
        margin: 0 !important;
    }

#cHow div {
    width: 50%;
    height: 100%;
}

#chow p {
    margin-bottom: 10px;
}

#micro {
    margin-top: 40px;
    margin-left: 50px;
}

.microLeft {
    padding-right: 50px;
    margin-top: 15px;
}

.microRight {
    padding-right: 0px;
    margin-bottom: 30px;
}

#microTitle {
    color: #ff3333;
    font-size: 36px;
    border-bottom: 6px solid #666666;
    margin-right: 6.03%;
    padding-bottom: 5px;
    width: 100%;
}

    #microTitle span {
        color: #666666;
        white-space: nowrap;
    }

.cNodeM {
    display: inline-block;
    padding-bottom: 35px;
    text-align: center;
    width: 260px;
}

.cNodeMPanel {
    width: 260px;
    height: 220px;
    line-height: 217px;
    background-color: #eaeaea;
    border-radius: 10px;
    margin-top: 10px;
    text-align: center;
    vertical-align: middle;
    position: relative;
    overflow: hidden;
}

    .cNodeMPanel img {
        max-height: 100%;
        width: auto;
        margin-top: -4px;
        margin: auto;
    }

#cComponentsM {
    margin-top: 25px;
    text-align: center;
    letter-spacing: 0.3px;
    color: #898685;
}

.cNodePanelOvrl {
    height: 50%;
    width: 100%;
    background: rgba(51, 51, 51, 0.75);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#bf333333,endColorstr=#bf333333);
    position: absolute;
    bottom: -50%;
    font-size: 13px;
    color: white;
    text-align: left;
    line-height: normal;
    padding: 15px;
    -webkit-transition: bottom 0.4s ease-in-out;
    -moz-transition: bottom 0.4s ease-in-out;
    -o-transition: bottom 0.4s ease-in-out;
    transition: bottom 0.4s ease-in-out;
}

.cNodeMPanel:hover > .cNodePanelOvrl,
.cNodePanel:hover > .cNodePanelOvrl {
    bottom: 0px;
}

.cPanelSmHeaderGray {
    color: #666666;
    margin-top: 35px;
    padding-bottom: 5px;
    border-bottom: 1px solid #666666;
    font-size: 30px;
    margin-bottom: 5px;
}

.cNodePanelOvrl-sMore {
    height: 14%;
    width: 100%;
    background: rgba(51, 51, 51, 0.75);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#bf333333,endColorstr=#bf333333);
    position: absolute;
    bottom: -50%;
    font-size: 13px;
    color: white;
    text-align: center;
    line-height: normal;
    padding: 10px;
    -webkit-transition: bottom 0.4s ease-in-out;
    -moz-transition: bottom 0.4s ease-in-out;
    -o-transition: bottom 0.4s ease-in-out;
    transition: bottom 0.4s ease-in-out;
}

.cNodeMPanel:hover > .cNodePanelOvrl-sMore,
.cNodePanel:hover > .cNodePanelOvrl-sMore {
    bottom: 0px;
}

#cPanelList {
    margin-top: 20px;
    font-size: 21px;
    color: #ff3333;
}

    #cPanelList ul {
        padding-left: 20px;
    }

    #cPanelList li {
        list-style-position: outside;
        display: list-item;
    }

    #cPanelList a {
        color: #ff3333;
    }

        #cPanelList a:hover {
            color: #666666;
        }

#isbn, .isbn {
    color: #999999;
}

    #isbn div, .isbn div {
        width: 100%;
        padding-bottom: 5px;
        padding-top: 5px;
        border-bottom: 1px solid #cccccc;
    }

        #isbn div:first-child, .isbn div:first-child {
            margin-top: 20px;
        }

        #isbn div:last-child, .isbn div:last-child {
            border: 0px;
        }

    #isbn span, .isbn span {
        color: #666666;
        font-size: 15px;
    }

        #isbn span:nth-child(even), .isbn span:nth-child(even) {
            position: absolute;
            left: 450px;
        }

#catalHeaderImgM {
    position: relative;
    margin-top: 20px;
    overflow: hidden;
    display: inline-block;
    width: 100%;
}

    #catalHeaderImgM img {
        margin-left: auto;
        margin-right: auto;
        display: block;
    }

#catalHeaderOverlayM {
    position: absolute;
    bottom: -30px;
    height: 30px;
    margin-left: auto;
    margin-right: auto;
    left: 0px;
    right: 0px;
    background-color: black;
    color: #ffffff;
    width: 215px;
    line-height: 30px;
    text-align: center;
    font-size: 15px;
    background: rgba(51, 51, 51, 0.85);
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#d9333333', endColorstr='#d9333333'); /* IE */
    -webkit-transition: bottom 0.4s ease-in-out;
    -moz-transition: bottom 0.4s ease-in-out;
    -o-transition: bottom 0.4s ease-in-out;
    transition: bottom 0.4s ease-in-out;
}

#catalHeaderImgM:hover > #catalHeaderOverlayM {
    bottom: 0px;
}

.catal-nav {
    position: fixed !important;
    top: 80px;
}

#titleSelect {
    width: 100%;
    height: 140px;
    overflow: hidden;
}

    #titleSelect > img {
        position: absolute;
        -webkit-transition: left 0.5s ease-in-out,right 0.5s ease-in-out;
        -moz-transition: left 0.5s ease-in-out,right 0.5s ease-in-out;
        -o-transition: left 0.5s ease-in-out,right 0.5s ease-in-out;
        transition: left 0.5s ease-in-out,right 0.5s ease-in-out;
        cursor: pointer;
    }

        #titleSelect > img:first-child:hover {
            left: 0px !important;
        }

        #titleSelect > img:nth-child(2):hover {
            right: 0px !important;
        }

.titleSelectBr {
    left: 0px !important;
}

.titleSelectAm {
    right: 0px !important;
}

#titleSelectBody {
    width: 840px;
    height: 115px;
    margin-left: auto;
    margin-right: auto;
    background: #ffffff;
    padding: 16px 40px 0px 40px;
    text-align: center;
    font-size: 17px;
    color: #333333;
    margin-top: 11px;
}

    #titleSelectBody span, #titleSelectBodyM span {
        color: #ff3333;
        cursor: pointer;
    }

.expandAmerican:after {
    content: "\000A";
    white-space: pre;
}

#titleSelectBody span:hover {
    color: #333333;
}

#titleSelectM {
    margin-left: -20px;
    margin-right: -20px;
}

#titleSelectBodyM {
    background: white;
    padding: 20px;
    margin: 0px 20px;
}

#titleBritish {
    height: 0px;
    overflow: hidden;
}

#titleAmerican {
    height: 0px;
    overflow: hidden;
}

.titleActive {
    height: 100% !important;
}

.video {
    cursor: pointer;
}

video {
    display: block;
    width: 100%;
    /* cursor:pointer; */
    margin: 0px auto;
}

.videoholder {
    position: relative;
    overflow: hidden;
    height: 340px;
}

.videoPlay, .videoStop, .eltVideo {
    margin: auto;
    position: absolute;
    top: -140px;
    left: 550px;
    bottom: 0;
    right: 0;
    width: 140px;
    height: 140px;
    border-radius: 100%;
    cursor: pointer;
    z-index: 2;
}

.videoPlay, .eltVideo {
    background: rgba(82, 82, 82, 0.8) url(css/images/play.png) center center no-repeat;
}

    .videoPlay:hover, .eltVideo:hover {
        background: rgba(82, 82, 82, 0.5) url(css/images/play.png) center center no-repeat;
    }

.videoPlay, .videoStop, .homeVideo {
    margin: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    width: 140px;
    height: 140px;
    border-radius: 100%;
    cursor: pointer;
    z-index: 2;
}

.videoPlay, .homeVideo {
    background: rgba(82, 82, 82, 0.8) center center no-repeat;
    background-image: url(css/images/play.png);
}

    .videoPlay:hover, .homeVideo:hover {
        background: rgba(82, 82, 82, 0.5) url(css/images/play.png) center center no-repeat;
    }

.videoStop {
    background: rgba(82, 82, 82, 0.8) url(css/images/pause.svg) center center no-repeat;
    display: none;
}

    .videoStop:hover {
        background: rgba(82, 82, 82, 0.5) url(css/images/pause.svg) center center no-repeat;
    }

.videoActive {
    display: block;
}

#titleSelectImages {
    width: 280px;
    margin: 10px auto;
    overflow: hidden;
    height: 103px;
}

    #titleSelectImages > img:first-child {
        margin-right: 30px;
    }

    #titleSelectImages > img {
        cursor: pointer;
        margin-top: -15px;
        transition: margin 0.5s ease-in-out;
        -webkit-transition: margin 0.5s ease-in-out;
        display: block;
        float: left;
    }

        #titleSelectImages > img:hover, .TitleSelectActive {
            margin-top: 0px !important;
        }

.bWhite {
    background: white;
}

.bRed {
    background: #ff3333;
}

.bRedBorder {
    border-top: 12px solid #ff3333;
}

.bRedGradient {
    background: rgb(255,51,51); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(255,51,51,1) 0%, rgba(102,0,0,1) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,51,51,1)), color-stop(100%,rgba(102,0,0,1))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* IE10+ */
    background: linear-gradient(to bottom, rgba(255,51,51,1) 0%,rgba(102,0,0,1) 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3333', endColorstr='#660000',GradientType=0 ); /* IE6-9 */
    zoom: 1;
}

.bPioneer {
    background: url('css/images/pioneer.jpg') center center;
}

.bFull {
    background: url('css/images/Full-Blast-Video-Background.jpg') center center;
}

.bLightGray {
    background: #eaeaea;
}

.bDarkGray {
    background: #666666;
}

.cefr {
    font-size: 15px;
    color: #333333;
    display: inline-block;
}

.cefrSpace {
    letter-spacing: -6px;
    margin-right: 20px;
    font-size: 28px;
    color: #999999;
}

.cefrSpan {
    color: #999999;
    font-size: 17px;
    display: inline;
    margin-left: 5px;
}

.bBook {
    margin-bottom: 40px;
}

.courseFeatures {
    margin-left: 20px;
}

    .courseFeatures li {
        -webkit-column-break-inside: avoid; /* Chrome, Safari */
        page-break-inside: avoid; /* Theoretically FF 20+ */
        break-inside: avoid-column;
    }

.featuredNode {
    border-bottom: 1px solid #999999;
    overflow: hidden;
    padding-bottom: 25px;
    padding-top: 25px;
}

    .featuredNode:first-child {
        padding-top: 0px;
    }

    .featuredNode:last-child {
        border: none;
    }

.bredBorderBottom {
    border-bottom: 6px solid #ff3333;
    margin-bottom: 25px;
}

.featHeader {
    margin-bottom: 10px;
    color: #ff3333;
    font-size: 15px;
}

    .featHeader a {
        color: #ff3333;
    }

        .featHeader a:hover {
            color: #333333;
        }

.featuredBox {
    width: 180px;
    height: 180px;
    border: 1px solid #999999;
    border-radius: 10px;
    text-align: center;
    float: left;
    margin-right: 25px;
}

    .featuredBox img {
        max-width: 150px;
        max-height: 150px;
        cursor: pointer;
        border: 1px solid #cccccc;
    }

.featuredImageWrapper:hover .featuredSeemore {
    opacity: 1 !important;
}

.featuredSeemore {
    width: 100%;
    height: 100%;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
    left: 0px;
    color: #ffffff;
    font-size: 15px;
    background: rgba(51, 51, 51, 0.85);
    -webkit-transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
    opacity: 0;
    cursor: pointer;
}

    .featuredSeemore span {
        position: absolute;
        right: 10px;
        bottom: 10px;
        font-size: 13px;
    }

.featuredImageWrapper {
    display: inline-block;
    margin-top: 15px;
    position: relative;
}

.featuredBooks {
    height: 180px;
    position: relative;
    overflow: hidden;
}

.featureBookLevelDPpl {
    color: #333333;
    font-size: 15px;
    position: absolute;
    bottom: 0px;
    margin-left: 205px;
    margin-bottom: 200px;
}

.featuredBooksTitle a {
    font-size: 28px;
    color: #ff3333;
    text-decoration: none;
}

    .featuredBooksTitle a:hover {
        color: #333333;
    }

.featuredBooksSubTitle {
    font-size: 15px;
    color: #333333;
    margin-bottom: 5px;
}

.featuredBooksInfo {
    font-size: 15px;
    color: #333333;
}

.featuredBooksLevel {
    color: #333333;
    font-size: 15px;
    position: absolute;
    bottom: 0px;
}

    .featuredBooksLevel a {
        margin: 0px 3px;
        text-decoration: none;
        color: #333;
    }


        .featuredBooksLevel a:hover {
            color: #ff3333;
        }

    .featuredBooksLevel .featuredUrl:hover {
        color: #ff3333;
        cursor: pointer;
    }

    .featuredBooksLevel span {
        color: #ff3333;
    }

.featuredLeft, .featuredRight {
    float: left;
    width: 50%;
}

.featuredLeft {
    padding-right: 2.5%;
    border-right: 2px dotted #999999;
}

.featuredRight {
    padding-left: 2.5%;
}

.privacyTitle, .eLearnS {
    font-size: 24px;
    color: #ff3333;
    font-family: Stag Sans Web;
    font-weight: 300;
    display: block;
    margin-bottom: 15px;
    margin-top: 20px !important;
}

.privacy p {
    margin-bottom: 15px;
}

.privacy ul {
    list-style-position: inside;
    margin-bottom: 15px;
}

.privacy {
    width: 100%;
    margin-bottom: 60px;
}

.privacyBold {
    font-weight: 600;
}

.newsletter {
    margin-bottom: 20px;
    overflow: hidden;
}

#nohover {
    color: inherit !important;
    cursor: auto !important;
}

.addInp:hover {
    color: #ff3333 !important;
}

.newsletterNode {
    margin: 00px 30px 30px 0px;
    width: 130px;
    height: 110px;
    border-radius: 10px;
    float: left;
    text-align: center;
    position: relative;
}

.newsBlack {
    background: #333333;
    color: white;
}

.newsGray {
    background: #cccccc;
    color: black;
}

.newsRed {
    background: #ff3333;
    color: white;
}

.newsBlank {
    border: 1px solid #cccccc;
}

.newsletterMonth {
    font-size: 17px;
    display: block;
    margin-top: 21px;
}

.newsletterYear {
    font-size: 45px;
    display: block;
    letter-spacing: -4px;
    margin-top: -5px;
    position: absolute;
    bottom: -3px;
    left: 18px;
    z-index: 0;
}

.newsletterOverlay {
    width: 100%;
    height: 100%;
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0px;
    left: 0px;
    color: #ffffff;
    font-size: 15px;
    background: rgba(51, 51, 51, 0.75);
    -webkit-transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
    opacity: 0;
    cursor: pointer;
    border-radius: 10px;
    z-index: 10;
}

    .newsletterOverlay:hover {
        opacity: 1 !important;
    }



.careers {
    width: 100%;
    font-size: 19px;
    color: #333333;
}

input[type='file'] {
    color: transparent;
    width: 100%;
}

.careersRight {
    height: auto !important;
    padding-bottom: 30px !important;
    background: -moz-linear-gradient(left, rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.6) 100%) !important;
    background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.5)), color-stop(100%,rgba(0,0,0,0.6))) !important;
    background: -webkit-linear-gradient(left, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.6) 100%) !important;
    background: -o-linear-gradient(left, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.6) 100%) !important;
    background: -ms-linear-gradient(left, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.6) 100%) !important;
    background: linear-gradient(to right, rgba(0,0,0,0.5) 0%,rgba(0,0,0,0.6) 100%) !important;
}

    .careersRight #contactHeader {
        border-bottom: 1px solid rgba(255,255,255,0.5);
        padding-bottom: 20px;
    }

.littleBooksNode {
    margin-top: 40px;
    width: 100%;
    overflow: hidden;
}

    .littleBooksNode .aboutNodeHeader,
    .gradedReadersNode .aboutNodeHeader {
        padding-left: 20px !important;
    }

    .littleBooksNode .aboutNodeSubheader,
    .gradedReadersNode .aboutNodeSubheader {
        font-size: 17px !important;
        padding-left: 20px !important;
    }

.readersNode {
    width: 180px;
    height: 165px;
    border: 1px solid #cccccc;
    margin-right: 10px;
    margin-left: 10px;
    margin-top: 20px;
    border-radius: 10px;
    text-align: center;
    line-height: 160px;
    background: white;
    position: relative;
    display: inline-block;
}

    .readersNode img {
        max-width: 115px;
        max-height: 145px;
    }

.littleBooksNode .isbn,
.gradedReadersNode .isbn {
    display: none;
    overflow: hidden;
}

.littleBooksNode .cPanelSmHeaderGray:hover,
.gradedReadersNode .cPanelSmHeaderGray:hover {
    color: #ff3333;
    cursor: pointer;
}

.littleDes {
    margin-top: 15px;
    font-size: 15px;
    color: #333333;
    width: 100%;
}

.ReaderDes {
    margin-top: 30px;
    font-size: 15px;
    color: #333333;
    width: 100%;
    margin-bottom: 40px;
}

.littleBooksNode .aboutNodeBody,
.gradedReadersNode .aboutNodeBody {
    text-align: center;
}

.gradedReadersNode .aboutNodeBody,
.littleBooksNode .aboutNodeBody {
    padding-bottom: 0px !important;
    padding-top: 0px !important;
}

.gradedReadersNode .aboutNodeSubheader,
.littleBooksNode .aboutNodeSubheader {
    line-height: 32px !important;
}

.gradedReadersNode {
    width: 100%;
    margin-top: 20px;
    margin-bottom: 55px;
}

.gradedReadersLeft {
    width: 50%;
    float: left;
    position: relative;
    padding-right: 50px;
    border-right: 2px dotted #999999;
    margin-top: 40px;
}

.gradedReadersRight {
    width: 50%;
    float: left;
    position: relative;
    padding-left: 50px;
    margin-top: 40px;
}

.gradedTitle,
.gradedReadersMore {
    font-size: 24px;
    color: #ff3333;
    margin-bottom: 20px;
}

.gradedReadersLeft .readersNode,
.gradedReadersRight .readersNode {
    width: 170px !Important;
}

.gradedReadersMore {
    margin-top: -30px;
    cursor: pointer;
    display: none;
}

    .gradedReadersMore:hover {
        color: #333333;
    }

.featHeader {
}

    .featHeader ul li {
        display: inline-block;
        padding-left: 20px;
        background: url('css/images/arrow-hover.png') no-repeat 0px 3px;
        margin-right: 50px;
        cursor: pointer;
        margin-bottom: 10px;
    }

        .featHeader ul li:hover {
            color: #333333;
            background: url('css/images/arrow-black.png') no-repeat 0px 3px;
        }

.featuredBooksTitleSm {
    margin-bottom: 10px;
}

.featuredBooksTitle {
    line-height: 28px;
}

.whatMore {
    display: block;
    margin-top: 10px;
    color: #ff3333;
    cursor: pointer;
}

    .whatMore:hover {
        color: #666666;
    }

.whatExpand {
    display: none;
}

.bWho {
    background: rgb(102,102,102);
    background: -moz-radial-gradient(center, ellipse cover, rgba(102,102,102,1) 0%, rgba(50,50,50,1) 100%);
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,rgba(102,102,102,1)), color-stop(100%,rgba(50,50,50,1)));
    background: -webkit-radial-gradient(center, ellipse cover, rgba(102,102,102,1) 0%,rgba(50,50,50,1) 100%);
    background: -o-radial-gradient(center, ellipse cover, rgba(102,102,102,1) 0%,rgba(50,50,50,1) 100%);
    background: -ms-radial-gradient(center, ellipse cover, rgba(102,102,102,1) 0%,rgba(50,50,50,1) 100%);
    background: radial-gradient(ellipse at center, rgba(102,102,102,1) 0%,rgba(50,50,50,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#323232',GradientType=1 );
    margin-bottom: 0px;
}

.videoN {
    height: 100%;
}

.cont {
    margin-top: 20px;
}

.takeTest {
    margin: 30px 0px;
    width: 300px;
    height: 30px;
    line-height: 30px;
    background: #ff3333;
    padding-left: 10px;
    cursor: pointer;
}

    .takeTest:hover {
        background: #333333 !important;
    }

    .takeTest span {
        color: white;
        font-size: 20px;
    }

    .takeTest img {
        float: right;
        margin-right: 5px;
        margin-top: 7px;
    }

.bBlue {
    background: rgb(164,220,237);
    padding-bottom: 40px;
    padding-top: 0px;
    margin-top: 140px;
    margin-bottom: 40px;
}

.elt {
    font-size: 17px;
    color: #333333;
    float: left;
    padding-right: 40px;
    margin-bottom: 50px;
    margin-top: -25px;
}

.eltGradient {
    background: #62c9dd; /* Old browsers */
    background: -moz-linear-gradient(top,#62c9dd 0%, #377d87 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#62c9dd), color-stop(100%,#377d87)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,#62c9dd 0%,#377d87 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #62c9dd 0%,#377d87 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #62c9dd 0%,#377d87 100%); /* IE10+ */
    background: linear-gradient(to bottom,#62c9dd 0%,#377d87 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#62c9dd', endColorstr='#377d87',GradientType=0 ); /* IE6-9 */
    zoom: 1;
}

.elt div {
}



.eltWrapper {
    float: right;
}

.elt h2 {
    font-size: 28px;
    color: #377d87;
}

.eltGr {
    color: #377d87;
}

.eltLinkage {
    color: #377d87;
    background: rgba(98,201,221,0.5);
}

.elt p {
    font-size: 16px;
    width: 550px;
}



.resources {
    text-align: center;
    margin: 0px auto 30px auto;
    width: 900px;
}

.resourcesNode {
    width: 180px;
    display: inline-block;
    margin-left: 12.5px;
    margin-right: 12.5px;
    margin-bottom: 30px;
}

    .resourcesNode > div {
        width: 180px;
        height: 180px;
        line-height: 180px;
        border: 1px solid #999999;
        border-radius: 10px;
        text-align: center;
        float: left;
        margin-right: 25px;
        position: relative;
    }

        .resourcesNode > div div {
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0px;
            left: 0px;
            background: rgba(51, 51, 51, 0.85);
            border-radius: 10px;
            opacity: 0;
            -webkit-transition: opacity 0.4s ease-in-out;
            -moz-transition: opacity 0.4s ease-in-out;
            -o-transition: opacity 0.4s ease-in-out;
            transition: opacity 0.4s ease-in-out;
            cursor: pointer;
        }

            .resourcesNode > div div:hover {
                opacity: 1 !important;
            }

    .resourcesNode div img {
        max-width: 150px;
        max-height: 150px;
    }

.resourcesHeader {
    display: block;
    font-size: 15px;
    color: #333333;
    text-align: center;
}

.resourcesSubHeader {
    display: block;
    font-size: 12px;
    color: #999999;
    text-align: center;
    margin-bottom: 5px;
}

.overlayReaders {
    max-width: 360px;
    background: rgba(234,234,234,0.9);
    margin: 0px auto;
    padding: 30px;
    text-align: center;
    border-radius: 10px;
    display: none;
    position: relative;
}

    .overlayReaders > img {
        position: absolute;
        right: -30px;
        top: -25px;
        cursor: pointer;
    }

.overlayReadersTitle {
    font-size: 19px;
    color: #ff3333;
    margin-bottom: 20px;
    display: block;
}

.overlayReadersText {
    font-size: 15px;
    color: #666666;
    margin-top: 20px;
    display: block;
}

.readersNode > div {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    background: rgba(51, 51, 51, 0.85);
    border-radius: 10px;
    opacity: 0;
    -webkit-transition: opacity 0.4s ease-in-out;
    -moz-transition: opacity 0.4s ease-in-out;
    -o-transition: opacity 0.4s ease-in-out;
    transition: opacity 0.4s ease-in-out;
    cursor: pointer;
}

.readersNode:hover div {
    opacity: 1 !important;
}

.littleBooksNode .cPanelSmHeaderGray,
.gradedReadersNode .cPanelSmHeaderGray {
    background: url('css/images/isbn_down.png') no-repeat right 10px center;
}

[data-isbnactive="1"] {
    background: url('css/images/isbn_up.png') no-repeat right 10px center !important;
}

#pioneerVideo {
    height: 100%;
}

.fb1 {
    float: left;
    width: 600px;
}

.fb2 {
    width: 250px;
    float: right;
    margin-top: -60px;
}

    .fb2 img {
        width: 100%;
    }

.successNode {
    padding: 20px 30px 15px 30px;
    font-size: 15px;
    color: #333333;
    margin-top: 10px;
    width: 700px;
    overflow: hidden;
}

.successAp {
    font-size: 20px;
    color: #ff3333;
    display: inline-block;
}

    .successAp:first-child {
        margin-left: -5px;
        margin-right: 2px;
    }

.successRight {
    color: #ff3333;
    float: right;
    margin-top: 10px;
}

.successNode:nth-child(even) {
    background: #cccccc;
}

.successNode:nth-child(odd) {
    background: #eaeaea;
}

.sitemap a, .sitemap span {
    display: block;
}

.sitemapTitle {
    color: #ff3333;
    font-size: 28px;
    font-family: 'Stag Sans Web';
    font-weight: 300;
}

    .sitemapTitle:not(:first-child) {
        margin-top: 40px;
    }

.sitemapBook {
    color: #666666;
    font-size: 13px;
    font-family: 'Stag Sans Web';
    font-weight: 400;
    margin: 4px 0px;
}

    .sitemapSemibold:hover, .sitemapBook:hover {
        color: #ff3333;
    }

.sitemapSemibold {
    color: #333333;
    font-size: 15px;
    font-family: 'Stag Sans Web';
    font-weight: 400;
    margin: 4px 0px;
}

.nFound {
    width: 100%;
    padding-left: 190px;
    padding-top: 200px;
}

.nFoundTitle {
    color: #ff3333;
    border-bottom: 2px solid #ff3333;
    font-size: 48px;
    position: relative;
    display: block;
    line-height: 65px;
}

    .nFoundTitle img {
        position: absolute;
        left: -60px;
        top: 10px;
    }

.nFoundText {
    margin-top: 30px;
    color: #333333;
    font-size: 15px;
    display: block;
}

.nFoundReturn {
    color: #ff3333;
    font-size: 15px;
    background: url('css/images/arrow-hover.png') no-repeat 0px 4px;
    padding-left: 20px;
    display: block;
    margin-top: 30px;
    cursor: pointer;
}

    .nFoundReturn a {
        color: #ff3333;
    }

        .nFoundReturn a:hover {
            color: #333333;
        }

    .nFoundReturn:hover {
        background: url('css/images/arrow-black.png') no-repeat 0px 4px;
    }

.rec, .recMobile {
    max-height: 160px;
    width: 230px;
    border-left: 1px solid #ff3333;
    border-right: 1px solid #ff3333;
    border-top: 1px solid #ff3333;
    position: absolute;
    right: 0px;
    top: 30px;
    z-index: 20;
    background: white;
    display: none;
    overflow-y: auto;
    text-transform: uppercase;
    overflow-x: hidden;
}

    .rec span, .recMobile span {
        display: block;
        line-height: 20px;
        width: 100%;
        padding-left: 37px;
        cursor: pointer;
        background: url('css/images/Browser-Icon.png') 5px 3px no-repeat;
        white-space: pre;
    }

.noresults {
    background: inherit !important;
    cursor: auto !important;
    padding-top: 10px;
    padding-bottom: 10px;
    font-weight: 500;
    padding-left: 10px !important;
}

.rec span a, .recMobile span a {
    color: #333333;
    margin-left: -10px;
}

.rec span:hover, .recMobile span:hover {
    background: url('css/images/Browser-Icon.png') 5px 3px no-repeat,#eaeaea;
}

.noresults:hover {
    background: none !important;
}

.rec span:last-child, .recMobile span:last-child {
    border-bottom: 1px solid #ff3333;
}

.resp {
    margin-top: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid white;
}

.aboutNodeContact {
    padding: 0px 30px 30px 20px;
    overflow: hidden;
}

.aboutNodeContactCols {
    float: left;
    width: 50%;
    font-size: 15px;
    color: #333333;
}

    .aboutNodeContactCols span {
        display: block;
    }

.aboutNodeContactColsHeader {
    font-weight: 600;
    margin-top: 30px;
}

.distributorsTitle {
    padding: 0px 30px 0px 20px;
    height: 30px;
    line-height: 30px;
    background: #cccccc;
    color: #333333;
    font-size: 17px;
    font-family: 'Stag Sans Web';
    font-weight: 600;
}

.distributors {
    -webkit-column-count: 4; /* Chrome, Safari, Opera */
    -moz-column-count: 4; /* Firefox */
    column-count: 4;
    padding: 20px 30px 40px 20px;
}

    .distributors span {
        display: block;
    }

.dvdPlay {
    cursor: pointer;
}

#sample {
    max-width: 400px;
}

#sample_copies {
    position: relative;
}

.inp {
    display: inline-block;
    width: 45%;
    color: white;
    line-height: 20px;
    margin-bottom: 3px;
}

    .inp input[type="checkbox"] {
        width: 20px;
        height: 20px;
        vertical-align: bottom;
    }

.bWhats {
    background: url('css/images/World-Watch-Video-Background.jpg') center center;
}

.elearnGray {
    padding-top: 30px;
    padding-bottom: 30px;
}

.elearnNode {
    margin-top: 20px;
    color: #333333;
    max-width: 1000px;
    line-height: 23px;
}

    .elearnNode div {
        float: left;
        margin-right: 30px;
    }

    .elearnNode li, .eLearnList li {
        margin-bottom: 5px;
        margin-left: 20px;
    }

.eLearnS {
    border-bottom: 1px solid #ff3333;
    margin-top: 10px;
}

.eLearnList {
    -webkit-column-count: 2; /* Chrome, Safari, Opera */
    -moz-column-count: 2; /* Firefox */
    column-count: 2;
}

.el0 div:first-child {
    max-width: 300px;
}

.el0 div:nth-child(2) {
    max-width: 600px;
}

.el1 div:first-child {
    max-width: 515px;
}

.el1 div:nth-child(2) {
    max-width: 385px;
}

.el2 div:first-child {
    max-width: 300px;
}

.el2 div:nth-child(2) {
    max-width: 600px;
}

.el3 div:first-child {
    max-width: 300px;
}

.el3 div:nth-child(2) {
    max-width: 600px;
}

.el4 div:first-child {
    max-width: 429px;
}

.el4 div:nth-child(2) {
    max-width: 470px;
}

.elearnNode div img {
    max-width: 100%;
}

.latestNode {
    margin-top: 18px;
    overflow: hidden;
    padding-bottom: 18px;
    border-bottom: 2px dotted #999999;
    margin-right: 30px;
}

.latestPanel a:first-child .latestNode {
    border-top: 2px dotted #999999;
    padding-top: 18px;
}

.latestPanel a:hover .latestTxt {
    color: #ff3333;
    -webkit-transition: color 0.3s ease-in-out;
    -moz-transition: color 0.3s ease-in-out;
    -o-transition: color 0.3s ease-in-out;
    -ms-transition: color 0.3s ease-in-out;
    transition: color 0.3s ease-in-out;
}

.latestPanel a:hover .latestOverlay {
    opacity: 1 !important;
}

.latestVd {
    float: left;
    margin-right: 30px;
    position: relative;
}

.latestTxt {
    font-size: 15px;
    color: #333333;
    display: table;
    height: 100px;
}

    .latestTxt div {
        display: table-cell;
        vertical-align: middle;
    }

.bDarkPioneer {
    background: #333333;
}

#whBody li {
    margin-left: 20px;
}

.addInp:hover {
    color: #ff3333;
}

#contactSubmit:hover {
    color: #ff3333;
}

.catala:hover {
    color: #999999 !important;
    cursor: auto !important;
}

.fixedImg {
    position: absolute;
    left: 0px;
    top: 10px;
    display: none;
}

.quickLinksWhite {
    border-top: 12px solid white !important;
}

.fbwhythis {
    color: #333333 !important;
    border-bottom: 1px solid #333333 !important;
    font-size: 21px !important;
    padding-bottom: 0px !important;
}

.fancybox-lock .menuWrapper {
    margin-right: 0px !important;
    right: 8.5px;
}

.homeContact {
    font-weight: 600;
    color: white;
}

    .homeContact:hover {
        color: #ff3333;
    }

.embedded iframe {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

#catalHeaderImg img {
    border: 1px solid #cccccc;
}

section {
    margin-bottom: 60px;
}

.menuReplace {
    width: 100%;
    height: 0px;
}

#accordion-1 > .StagSans-Semibold-Web,
#accordion-2 > .StagSans-Semibold-Web,
#accordion-3 > .StagSans-Semibold-Web,
#accordion-4 > .StagSans-Semibold-Web {
    font-size: 24px;
    padding: 2px 0px;
    color: #fff;
    cursor: pointer;
    margin: 5px 0px 0px 0px;
}

.preLoad-vidScreen {
    width: 94%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 3%;
}

.blackOp {
    background-color: rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 101;
}

.vidPic,
.justPic {
    /*position: absolute;
	top: 0;*/
    /*width: 100%;*/
    /*width: 95%;*/ /*changed it, but not here, within media - marina - 2-8-18*/
    /*left: 2.5%; /*added it, but not here, within media - marina - 2-8-18*/
    height: 100%;
    margin: 0 auto;
    /*z-index: 100;*/ /*not needed - marina 7-8-18*/
}

    .justPic img {
        width: 100%;
        vertical-align: top;
    }
/*added it - marina - 2-8-18*/

/*.justPic img {
		max-height: 400px;
		margin-right: auto;
		vertical-align: top;
		margin-left: auto;
		display: block;
	}*/ /*testing change (ii) - marina - 2-8-18*/

.playSVGicon {
    position: relative;
    z-index: 103;
    width: 150px;
    height: 150px;
    margin: 58px auto 0;
}

    .playSVGicon svg {
        width: 100%;
        height: 100%;
    }


/*new partners area --START*/

.MPList-unit-title {
    font-family: "Stag Sans Web";
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    font-size: 36px; /*25px; VECTOR*/
    color: #f33;
    margin-top: 20px;
    border-bottom: 2px solid #f33;
    padding-bottom: 7px;
    margin-bottom: 14px;
    list-style: none;
}

.MPList-comp-title {
    font-family: 'StagSans-Semibold-Web';
    font-size: 15px; /* 19px VECTOR */
    color: #333;
    margin-top: 6px;
    width: max-content;
    cursor: pointer;
    /* margin-bottom: 12px;*/
}

.MPList-subcomp-title {
    font-family: 'StagSans-Light-Web';
    font-size: 17px;
    width: max-content;
    cursor: pointer;
}

    .MPList-comp-title:hover,
    .MPList-comp-title a:hover,
    .MPList-subcomp-title:hover,
    .MPList-subcomp-title a:hover,
    .MPList-subcomp-title:has(.flippyTriangleReverse) {
        color: #f33;
    }


    .MPList-comp-title span,
    .MPList-subcomp-title span {
        display: inline-block !important;
        cursor: pointer;
    }

    .MPList-comp-title > span.flippyTriangleReverse,
    .MPList-subcomp-title > span.flippyTriangleReverse {
        -webkit-transform: scaleY(-1);
        -moz-transform: scaleY(-1);
        -ms-transform: scaleY(-1);
        transform: scaleY(-1);
        -webkit-transition: transform .4s;
        -moz-transition: transform .4s;
        transition: transform .4s;
    }

    .MPList-comp-title > span.flippyTriangleNormal,
    .MPList-subcomp-title > span.flippyTriangleNormal {
        -webkit-transform: scaleY(1);
        -moz-transform: scaleY(1);
        -ms-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transition: transform .4s;
        -moz-transition: transform .4s;
        transition: transform .4s;
    }

.MPList-comp-listIcons {
    display: flex;
    flex-wrap: wrap;
}



.MPList a {
    color: inherit;
}

.MPList-listFiles {
    margin-left: 30px;
}

.MPList-listFile {
    line-height: 2;
}

    .MPList-listFile a {
        font-family: 'StagSans-Book-Web';
        font-size: 15px;
        color: #666;
    }

        .MPList-listFile a:hover {
            text-decoration: underline;
        }

.MPList-listFiles.MPList-listFiles-hor {
    display: flex;
}

    .MPList-listFiles.MPList-listFiles-hor .MPList-listFile:not(:last-child):after {
        content: "|";
        color: #5a5a5a;
        padding: 5px;
    }

.MPList-comp-cont {
    margin-left: 50px;
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
}

.MPList-comp-img-cont {
    width: 120px;
    margin-right: 15px;
    margin-bottom: 20px;
}

.MPList-comp-img {
    /*width: 120px;*/
    box-sizing: content-box;
    width: 100%;
    height: auto;
    border: 1px solid #cac9c9;
    border-radius: 10px;
    margin-bottom: 10px;
    cursor: pointer;
    position: relative;
    background: #cac9c9;
}

    .MPList-comp-img img {
        vertical-align: middle;
        border-radius: 10px;
    }

.img-label {
    font-family: 'StagSans-Book-Web';
    font-size: 15px;
    color: #666;
    line-height: 15px;
    text-align: center;
    overflow-wrap: anywhere;
}

    .img-label[data-addlabel="False"] {
        display: none;
    }

.MP-col-cont {
    padding-left: 30px;
}

.MPList-subcomp-cont {
    margin-left: 30px;
}

.DownloadHoverBg {
    background-color: #cac9c9;
    position: absolute;
    left: 0;
    top: 0;
    border-radius: 10px;
    opacity: .65;
    height: 100%;
    width: 100%;
}

.DownloadHoverIcon {
    position: absolute;
    top: 70%;
    left: 70%;
    -webkit-transform: translate(5%, 5%);
    -ms-transform: translate(5%,5%);
    transform: translate(5%, 5%);
}
/*new partners area --END*/
/* ----------/////----------/////----------/////----------/////----------/////----------/////--------- */
/* -------------------------------------------------------------------------------------------------- */
/* ---  -----  ---  MEDIA QUERIES   O N L Y   FROM HERE ON   -  marina 7-9-18 ---  -----  --- */

@media (max-width: 575px) {
    .MPList {
        padding-inline: 15px;
    }
}

@media screen and (max-width: 320px) {
    .quickMobilePanelSpan {
        font-size: 14px;
    }
}

@media screen and (max-width: 450px) {
    .latestPanel {
        overflow-y: scroll;
        margin-left: 20px !important;
        padding: 15px 20px 15px 20px;
    }

    #latestHeader {
        margin-left: 20px !important;
    }
}

@media screen and (max-width: 535px) {
    section {
        margin-bottom: 116px !important;
    }
}

@media screen and (min-width: 536px) and (max-width: 768px) {
    section {
        margin-bottom: 93px !important;
    }
}

@media screen and (max-width: 550px) {
    .infosWrapper {
        width: 90% !important;
    }

    #presenceHeader, #presenceBody {
        margin-left: 20px !important;
        width: 90% !important;
    }

    .coursesWrapper {
        margin-left: 20px !important;
    }

    .infosWrapper {
        margin-left: 20px !important;
    }

    .wrapperM {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .Pre-Primary-and-Primary-page .wrapperM {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    /*overwriting previous css - marina 5-10-18*/

    #quickMobile {
        padding-left: 40px;
        padding-right: 30px;
    }
}

@media screen and (min-width: 550px) and (max-width: 768px) {
    .coursesWrapper, .infosWrapper, #presenceHeader, #presenceBody {
        margin-left: 40px !important;
        margin-right: 40px !important;
    }

    .wrapperM {
        padding-left: 40px !important;
        padding-right: 40px !important;
    }

    .Pre-Primary-and-Primary-page .wrapperM {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    /*overwriting previous css - marina 5-10-18*/

    #quickMobile {
        padding-left: 50px;
        padding-right: 50px;
    }
}

/*@media (min-width: 606px) and (max-width: 992px) {*/
@media (min-width: 606px) and (max-width: 991px) { /*marina 7-9-18*/
    .cNode:nth-child(odd) {
        margin-right: 25px !important;
    }
}

/*@media screen and (min-width: 767px) and (max-width:992px) {*/
@media screen and (min-width: 767px) and (max-width:991px) { /*marina 7-9-18*/
    .cNode {
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
}



@media screen and (max-width: 768px) {
    .rowMobile {
        margin: 0px -15px;
    }

    .vidPic, .justPic {
        width: 69% !important;
        left: 15.5% !important;
        min-width: unset !important;
    }
        /*added it here too, sooo many "max-width:768px" media queries OMG! - marina 2-8-18*/

        .justPic img {
            vertical-align: middle !important;
        }

    .comboBanner {
        top: -10px;
        background: #666666;
    }
    /*added it - marina 2-8-18*/

    /*#slideshow, .slide, .slideRelated {
		height: 200px !important;
	}

	.slide {
		background-size: auto 200px !important;
	}*/ /*redesigned it for small screens within newMMlooks css - marina 11-10-18*/

    #popular {
        margin-top: 40px !important;
    }

    .coursesMore {
        right: 20px !important;
        left: auto !important;
        bottom: 0px !important;
        margin-top: 30px !important;
        font-size: 15px !important;
    }

    .courses {
        min-height: initial !important;
    }

    .coursesLinks {
        font-size: 19px !important;
    }

        .coursesLinks li {
            margin-top: 20px !important;
        }

    .coursesBody {
        font-size: 17px !important;
    }

    .infosWrapper, #presenceHeader {
        margin-top: 20px !important;
    }

    .courses {
        margin-top: 20px !important;
    }

    #infosExtraFirst {
        width: auto !important;
    }

    .courses {
        margin-top: 20px !important;
    }

    .infos {
        height: auto !important;
        padding-bottom: 30px;
    }

    #copyright {
        float: none !important;
    }

    #subHeader { /* padding-left:20px !important; */
    }

    #subHeaderBig {
        font-size: 36px !important;
        line-height: 40px; /*added to decrease vspace between lines - marina 3-10-18*/
    }

    #subHeaderSmall {
        font-size: 15px !important;
    }

    #microTitle {
        font-size: 33px !important;
    }

    .cNode img {
        max-width: 90% !important;
        height: auto !important;
        max-height: 95% !important;
    }

    #cPanel, #wh, #cMethodology, #cHow {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }

    #cMethodology {
        padding-top: 0px !important;
        margin-bottom: 0px !important;
    }

    #wh {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
        margin-top: 0px !important;
    }

    .cphParent {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }

    #what_is {
        margin-bottom: 10px;
    }

    #whBody, .cPanelSmPanel {
        padding-bottom: 30px !important;
    }

    #cMethodologyAbove {
        /* margin-left:-15px !important; */
    }

    .cPNode {
        width: 125px !important;
    }

    #cComponents {
        text-align: center !important;
    }

    #cPanelM:not(.notCollapse), #whBody, #cHow, #cMethodologyBody {
        display: none;
    }

    #cHow {
        display: none;
        margin-top: 20px !important;
    }

    #chow {
        margin-top: 20px !important;
    }

    .cPanelHeader, #whHeader, #cMethodologyHeader {
        height: 60px;
        line-height: 60px;
        cursor: pointer;
    }

    .bRedBorder {
        border-top: 2px solid #ff3333 !important;
        border-bottom: 2px solid #ff3333 !important;
        margin-top: 10px;
        margin-bottom: 40px;
    }

    #isbn span:nth-child(even) {
        position: initial !important;
        left: initial !important;
        display: block;
        margin-left: 10px;
        margin-top: 5px;
    }

    #isbn {
        padding-right: 20px;
    }

    .bDarkGray {
        margin-top: 10px !important;
    }

    #what_is {
        margin-top: 30px;
    }

    #pioneerVideo {
        width: 100% !important;
    }

    .containerTitle {
        width: 90%;
        margin: 0px auto;
    }

    #teaching .comboBanner {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }

    #findus {
        margin-top: 0px !important;
    }

    .gm {
        border-bottom: 2px solid #999999 !important;
    }

    .featuredBooksInfo {
        margin-top: 20px !important;
    }

    .featuredBooks {
        height: auto !important;
    }

    .featuredBooksLevel {
        position: relative !important;
        height: auto !important;
        margin-top: 30px;
    }

    .featuredBox {
        float: none !important;
        margin: 0px 0px;
    }

    .featuredBooksSubTitle {
        margin-top: 10px !important;
    }

    .featuredBooksTitle {
        margin-top: 10px;
    }

    .eltWrapperM {
        max-width: 600px;
        position: relative;
    }

        .eltWrapperM img {
            width: 100%;
        }

    .fb1 {
        float: none !important;
        width: 100% !important;
    }

    .fb2 {
        float: none !important;
        margin-top: 20px !important;
        text-align: center;
        margin-bottom: 20px;
    }

    .successNode {
        width: 100% !important;
    }

    .aboutNodeContactCols {
        float: none !important;
        width: 100% !important;
    }

    .distributors {
        -webkit-column-count: 2 !important; /* Chrome, Safari, Opera */
        -moz-column-count: 2 !important; /* Firefox */
        column-count: 2 !important;
    }

    .aboutNode {
        margin-right: 0px !important;
    }

    .embedded iframe {
        width: 100% !important;
    }
}

@media screen and (width: 768px) {
    .featuredNode > .featuredBooks > .featuredBooksTitle {
        display: none !important;
    }

    .featuredNode > .featuredBooksTitle {
        display: block !important;
    }

    .cPanelHeader img:not(.notCollapseArrow), #cMethodologyHeader img, #whHeader img {
        display: block !important;
    }
}

@media screen and (min-width: 768px) {
    .homeResp {
        margin-top: 40px;
    }

    .comboBanner {
        top: 0;
        background: transparent;
    }
    /*added it - marina 2-8-18*/
}

/*@media screen and (min-width: 768px) and (max-width: 992px) {*/
@media screen and (min-width: 768px) and (max-width: 991px) { /*marina 7-9-18*/
    .courses {
        width: 46% !important;
        float: none !important;
        display: inline-block !important;
    }

    #popular {
        margin-left: 7%;
    }

    #teaching .comboBanner {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }

    .infos {
        width: 46% !important;
        height: 660px !important;
    }

    #latestAbove {
        width: 99.9% !important;
    }

    #presence {
        margin-left: 8%;
    }

    /*#slideshow, .slide, .slideRelated {
		height: 350px !important;
	}

	.slide {
		background-size: auto 350px !important;
	}*/ /*redesigned it for small screens within newMMlooks css - marina 11-10-18*/

    #catalHeaderBodyPanel {
        margin-top: 35px !Important;
    }

    .cPNode {
        width: 150px !important;
        /* margin-right:25px !important; */
    }
}

/*@media screen and (max-width: 992px) {*/
@media screen and (max-width: 991px) { /*marina 7-9-18*/
    .svg1 {
        height: 62px !important;
    }

    .svg2 { /* height:62px !important; */
    }

    .logo {
        margin-right: 20px;
        margin-top: 20px !important;
    }

    .header {
        height: auto !important;
        padding-bottom: 10px !important;
    }

    .vidPic, .justPic {
        width: 79%;
        left: 10.5%;
        min-width: 545px;
    }
    /*added it here too - marina 2-8-18*/

    .cont {
        /* width:93.42% !important; */
        margin-top: 40px;
    }

    .aboutNodeSubheader {
        line-height: 40px !important;
        padding-left: 20px !important;
    }

    #cPanelBody, #whBody, #cHow, .fbWHy {
        -webkit-column-count: auto !important; /* Chrome, Safari, Opera */
        -moz-column-count: auto !important; /* Firefox */
        column-count: auto !important;
        -webkit-column-gap: auto !important; /* Chrome, Safari, Opera */
        -moz-column-gap: auto !important; /* Firefox */
        column-gap: auto !important;
    }

    #cPanel { /* margin-top:30px; */
    }

    .cHowfl {
        float: none !important;
    }

    #cHow div {
        width: 100% !important;
        padding-left: 0px !important;
    }

    #cMethodology {
        /* padding-top:20px !important; */
    }

    .cPNode {
        /* margin-right:15px !important; */
        width: 150px !important;
    }

    .featuredLeft .featuredNode:last-child {
        border-bottom: 1px solid #999999 !important;
    }

    .featuredLeft, .featuredRight {
        width: 100% !important;
        border: none !important;
        padding: 0px !important;
    }

    .featuredRight {
        margin-top: 30px;
    }

    .gradedReadersLeft, .gradedReadersRight {
        width: 100% !important;
        float: none !important;
        border: none !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    .gradedReadersNode, .gradedTitle {
        display: none;
    }

    .gradedReadersMore {
        display: block !important;
    }

    .elt div {
        width: initial;
    }

    .resources {
        width: auto !important;
    }

    .nFound {
        padding-left: 60px !important;
        padding-top: 100px !important;
    }

    .eLearnList {
        -webkit-column-count: auto !important; /* Chrome, Safari, Opera */
        -moz-column-count: auto !important; /* Firefox */
        column-count: auto !important;
    }

    .elearnNode div:first-child {
        text-align: center;
        margin-bottom: 30px;
    }

    .elearnNode div {
        float: none !important;
        max-width: none !important;
    }

    #latest {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
}

@media (min-width:992px) {
    #latest {
        margin-top: 0px !important;
    }

    .vidPic, .justPic {
        width: 95%;
        left: 2.5%;
        min-width: unset;
    }
    /*added it here too - marina 2-8-18*/

    #catalHeaderBodySubtitle, #catalHeaderBodyTitle {
        width: 80%;
        min-width: 530px;
    }

    #cHow {
        padding-top: 30px !important;
    }

    #cComponents {
        width: 1000px !important;
    }
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
    #catalogueAbove {
        width: 643px !important;
    }

    #resourcesAbove {
        width: 481px !important;
    }

    #quickLinksHeader {
        margin-left: 20px !important;
    }

    #quickLinksBody {
        margin-left: 30px !important;
    }

        #quickLinksBody ul li {
            width: 190px !important;
        }

    .coursesBody {
        margin-top: 15px !important;
    }

    #menuSecond {
        left: 270px;
        width: 665px;
    }

    .coursesLinks {
        margin-top: 30px;
    }

    .cPNode {
        width: 124px !important;
        margin-right: 5px !important;
        margin-left: 5px !important;
    }

    .cNode:nth-child(3n-1) {
        margin-left: 25px !important;
        margin-right: 25px !important;
    }

    .cNodePanel {
        width: 250px !important;
        height: 212px !important;
        line-height: 207px !important;
    }

        .cNodePanel img {
            max-width: 95%;
            max-height: 95%;
        }

    #catalHeaderImg {
        width: 207.5px;
    }

    .cNodeM:nth-child(even) {
        margin-left: 30px !important;
    }

    .microLeft {
        padding-right: 20px !important;
        /* width:300px !important; */
    }

    .microRight { /* width:662px !important; */
        padding-right: 40px !important;
    }

    video {
        width: 80%;
        /* cursor:pointer; 
			}
		}

		@media screen and (max-width: 992px) and (min-width:650px) {
			.cNodeM:nth-child(even) {
				margin-left: 30px !important;
			}

			.microLeft {
				display: none;
			}

			.microRight {
				width: 100% !important;
			}

			#isbn span:nth-child(even) {
				left: 550px !important;
			}
		}

		@media screen and (max-width: 768px) {
			.microLeft {
				display: none;
			}

			.microRight {
				width: 100% !important;
				padding-right: 0px !important;
				padding-left: 0px !important;
			}

			#microTitle, .cPanelSmHeader, .cPanelSmHeaderGray, #cPanelList, #isbn { /* padding-left:20px !important; */
    }

    #titleSelectBody {
        width: 640px !important;
        font-size: 15px !important;
        padding: 10px 40px 0px 40px !important;
    }
}

@media screen and (max-width: 1200px) {
    .catalogueList li {
        font-size: 17px !important;
        background: url(css/images/bullet.png) no-repeat 10px 12px;
    }

    #cMenu {
        font-size: 20px !important;
    }

    #triangle {
        right: 10px !important;
    }
}

@media screen and (min-width: 1200px) {
    .cNode:nth-child(3n-1) {
        margin-left: 25px !important;
        margin-right: 25px !important;
    }

    .cNodeM:nth-child(3n-1) {
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
}

@media screen and (min-width: 1201px) {
    .catalogueList li {
        background: url(css/images/bullet.png) no-repeat 10px 11px;
    }
}









@media screen and (max-width: 992px) and (min-width: 768px) {
    #titleSelectBody {
        width: 490px !important;
        font-size: 15px !important;
        padding: 10px 20px 0px 20px !important;
    }

    .expandAmerican:after {
        content: "" !important;
        white-space: normal !important;
    }
}







@media screen and (min-width: 992px) {
    .privacy {
        width: 750px;
    }


    .littleDes, .littleBooksNode {
        width: 880px !important;
    }

    .gradedReadersLeft .isbn span:nth-child(even), .gradedReadersRight .isbn span:nth-child(even) {
        position: initial !important;
        left: initial !important;
        display: block;
        margin-left: 10px;
        margin-top: 5px;
    }

    .gradedReadersLeft .isbn, .gradedReadersRight .isbn {
        padding-right: 20px;
    }
}



@media screen and (min-width: 992px) and (max-width: 1200px) {
    .popularBooks {
        min-height: 250px;
    }
}

@media screen and (min-width: 992px) and (max-width: 1200px) {
    .elt div {
        width: 300px;
    }

    .eltWrapper {
        width: 550px;
    }
}



@media screen and (max-width: 992px) and (min-width: 768px) {
    .fb1 {
        width: 400px !important;
    }
}


@media screen and (min-width: 992px) and (max-width: 1200px) {
    .el0 div:nth-child(2) {
        max-width: 500px !important;
    }

    .el1 div:nth-child(2) {
        max-width: 280px !important;
    }

    .el2 div:nth-child(2) {
        max-width: 500px !important;
    }

    .el3 div:nth-child(2) {
        max-width: 500px !important;
    }

    .el4 div:nth-child(2) {
        max-width: 370px !important;
    }
}



@media screen and (min-width: 992px) {
    .menuWrapper {
        position: fixed;
        top: 0px;
        width: 100%;
        z-index: 100;
    }

        .menuWrapper #menubar {
            height: 50px;
        }

        .menuWrapper span {
            line-height: 50px !important;
            height: 50px !important;
        }

        .menuWrapper #catalogueAbove {
            top: 50px;
        }

        .menuWrapper .fixedImg {
            display: block !important;
        }
}




@media screen and (min-width: 992px) {
    .menuReplaceActive {
        height: 40px !important;
    }
}