@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%;
}


/* ----------/////----------/////----------/////----------/////----------/////----------/////--------- */
/* -------------------------------------------------------------------------------------------------- */
/* ---  -----  ---  MEDIA QUERIES   O N L Y   FROM HERE ON   -  marina 7-9-18 ---  -----  --- */
@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;
        }
    }