/*Added IEv2 Dev START*/
.section-post-header{display:none;}

@media only screen and (max-width: 768px){
    .sections_group{background:transparent !important;}
    .the_content>.section_wrapper {
        padding: 0px 10px !important;
        background: #f5f8f8;
    }
    .the_content_wrapper>section {
        padding: 0px !important;
    }
}

/*Added IEv2 Dev END*/

.simplePullQuote {
    background: 0 0;
    border: none;
    box-shadow: none;
    float: none;
    margin: 30px 60px;
    padding: 0;
    text-indent: inherit;
    width: auto;
    position: relative
}

.simplePullQuote:after,
.simplePullQuote:before {
    position: absolute;
    width: 24px;
    height: 24px;
    content: ""
}

.simplePullQuote:before {
    top: 0;
    left: -30px;
    background: url(../images/quote-top.png) no-repeat
}

.simplePullQuote:after {
    bottom: 0;
    right: -30px;
    background: url(../images/quote-bot.png) no-repeat
}

.simplePullQuote p {
    font-size: 24px;
    line-height: 42px;
    font-family: GothamRoundedBook;
    text-align: center
}

.simplePullQuote p span {
    display: block;
    padding: 10px 15px!important
}

.readmoreLink:after{
    top: 0;
}

@media all and (max-width:767px) {
    .simplePullQuote:after,
    .simplePullQuote:before {
        content: "";
        position: absolute;
        width: 22px;
        height: 22px
    }
    .simplePullQuote p {
        font-size: 24px;
        line-height: 42px;
        font-family: GothamRoundedBook
    }
    .simplePullQuote {
        margin: 20px
    }
    .simplePullQuote p span {
        padding: 5px!important
    }
    .simplePullQuote:before {
        top: 0;
        left: -24px;
        background: url(../images/quote-top.png) no-repeat;
        background-size: 18px
    }
    .simplePullQuote:after {
        bottom: 0;
        right: -24px;
        background: url(../images/quote-bot.png) no-repeat;
        background-size: 18px
    }
}

#flow-chart h2,
#flow-chart h3 {
    font-family: GothamRoundedMedium;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: -1px;
    color: #fff
}

#flow-chart .flow-chart-item p,
#flow-chart h2,
#flow-chart h3 {
    line-height: normal;
    margin: 0;
    padding: 0
}

#flow-chart {
    width: 980px;
    margin: 80px auto 40px;
    text-align: center;
    min-height: 1770px;
    position: relative;
    padding: 50px
}

#flow-chart:before {
    border: 2px solid #000;
    position: absolute;
    top: -30px;
    left: -30px;
    right: -30px;
    bottom: -30px;
    content: ""
}

#flow-chart:after {
    border: 2px solid #000;
    position: absolute;
    top: -40px;
    left: -20px;
    right: -40px;
    bottom: -20px;
    content: ""
}

#flow-chart .flow-chart-item {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 1;
    z-index: 1
}

.blackSqurContent,
.yellowRoundBox {
    display: -webkit-flex;
    -webkit-justify-content: center
}

.blackSqurContent {
    background: #000;
    display: flex;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%
}

#flow-chart h2 {
    font-size: 28px
}

#flow-chart h3 {
    font-size: 18px
}

.blackRoundBox,
.yellowRoundBox {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    font-family: GothamRoundedMedium;
    font-weight: 400;
    line-height: 20px;
    letter-spacing: -.5px
}

#flow-chart h2 a {
    color: #fff
}

.yellowRoundBox {
    background: #f7da71;
    border: 3px solid #000;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    font-size: 15px;
    color: #000
}

.yellowRoundBox a {
    color: #000
}

.blackRoundBox {
    background: #000;
    border: 3px solid #000;
    border-radius: 100%;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    font-size: 17px;
    color: #fff
}

.blackRoundBox a {
    color: #fff
}

/* add new repeat css*/
.header-logo a svg {
    width: 186px;
    height: 89px;
}

header.sticky{
    top: -115px;
}

.readmoreLink{
    position: relative;
    padding: 0 20px 0 0;
}

.readmoreLink:after{
    content:"";
    background: url(../images/read-more-arrow.png) no-repeat right center;
    width: 11px;
    height: 16px;
    position: absolute;
    top: 1px;
    right:0;
    margin: 0;
}

.latest-icon{
    background: url(../images/sprite.png) no-repeat 0 -126px;
    width: 52px;
    height: 59px;
    display: inline-block;
    top: 6px;
    position: relative;
}

.trending-icon{
    background: url(../images/sprite.png) no-repeat 0 -63px;
    width: 56px;
    height: 63px;
    display: inline-block;
    top: 0px;
    left: 5px;
    position: relative;
}

.viewed-icon{
    background: url(../images/sprite.png) no-repeat 0 0;
    width: 56px;
    height: 63px;
    display: inline-block;
    top: 0px;
    left: 5px;
    position: relative;
}

@media all and (min-width: 768px){
.header header .main-header .header-search .search-field-container svg {
        width: 13px;
        height: 13px;
    }  
}


@media all and (max-width: 767px){
  .header-logo a svg {
        width: 114px;
        height: 55px;
        top: 2px;
        position: relative;
    }

    .latest-icon, .trending-icon, .viewed-icon{
        display: none;
    }
}

/**/

/*********************************************
NEW CSS THEME STYLE SHEET 04-DEC-2017
*********************************************/
.header header{
    background:#ffffff;
    border-bottom:1px solid rgba(0,0,0,0.15);
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

header .headContainer{
    width: 1300px;
    /*max-width: 1170px;*/
    max-width: 100%;
    margin: 0 auto;
}

header .flex-header{
    width: 100%;
    padding:0 20px;
    box-sizing: border-box;
    margin: 0 auto;
    position: relative;
    display: -webkit-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -moz-justify-content: space-between;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -moz-align-items: center;
    align-items: center;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .3s ease;
}

.header header .header-nav{
    background: no-repeat;;
    height: auto;
}

.header header .header-nav .primary-nav ul li{
    /*padding: 0 15px;
    padding: 0 10px;*/
    position: static;
    padding: 0 5px;
}


.header header .header-nav .primary-nav ul li a{
    padding: 22px 10px;
    position: relative;
    font-size: 14px;
    white-space: inherit;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.header header .header-nav .primary-nav ul li a:hover, .header header .header-nav .primary-nav ul li:hover > a{
    background: #ffffff;
    box-shadow: 0 2px 7px 2px rgba(212,212,212,0.50);
    position: relative;
    text-decoration: none;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    text-decoration: none;
}

.header header .header-nav .primary-nav ul li a:focus{
    text-decoration: none;
}

.header header .header-nav .primary-nav ul li a:after{
    position: absolute;
    bottom: 0;
    left: 50%;
    right: 50%;
    width: 0;
    background: #19BFCC;
    height: 4px;
    content: "";
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.header header .header-nav .primary-nav ul li a:hover:after, .header header .header-nav .primary-nav ul li:hover > a:after,
.header header .header-nav .primary-nav ul li.current_page_item > a:after{
    left: 10px;
    right: 10px;
    width: auto;
}

.header header .header-nav .dropDown{
    transform: scale(0);
    opacity:0;
    position: absolute;
    top: 60px;
    left: 0;
    width: 100%;
    background: #ffffff;
    box-shadow: 0 2px 7px 2px rgba(212,212,212,0.50);
    padding: 20px;
     -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.header header .header-nav .primary-nav ul li:hover .dropDown{
    opacity: 1;
    transform: scale(1);
}

.header header .header-nav .dropDown .col-sm-3{
    -ms-flex-preferred-size: 30%;
    flex-basis: 30%;
    max-width: 30%;
}

.header header .header-nav .dropDown .col-sm-9{
    -ms-flex-preferred-size: 69%;
    flex-basis: 69%;
    max-width: 69%;
}


/*DropDown*/
.header header .header-nav .dropDown .submenu{
    display: -webkit-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -moz-justify-content: space-between;
    justify-content:flex-start;
    -webkit-box-align: center;
    -ms-flex-align: flex-start;
    -moz-align-items: flex-start;
    align-items:flex-start;
}

.header header .header-nav .dropDown .submenu div{
    padding: 0 20px;
    width: 25%;
}

.header header .header-nav .dropDown .submenu h3{
    color: #47525D;
    font-weight: 900;
    margin: 0 0 10px;
    font-size: 15px;
    line-height: 15px;
}

.header header .header-nav .dropDown .submenu ul, .header header .header-nav .dropDown .submenu ul li{
    display: block;
    padding:2px 0;
    margin: 0;
    line-height: 24px;
    font-size: 12px;
    color: #002200;
    line-height: 14px;
}

.header header .header-nav .dropDown .submenu ul li a{
    padding:5px 0;
    margin-bottom: 5px;
    display: block;
    font-size: 13px;
    letter-spacing:0;
    line-height: normal;
}

.header header .header-nav .dropDown .submenu ul li a:hover, .header header .header-nav .dropDown .submenu a.readmore:hover, 
.header header .header-nav .dropDown .selectedImg .heading a.readmore:hover{
    background: none;
    box-shadow: none;
}

.header header .header-nav .dropDown .submenu ul li a:after, .header header .header-nav .dropDown .submenu a.readmore:after, 
.header header .header-nav .dropDown .selectedImg .heading a.readmore:after{
    display: none;
}

.header header .header-nav .dropDown .submenu a.readmore, .header header .header-nav .dropDown .selectedImg .heading a.readmore{
    padding:5px 0;
    margin-bottom: 5px;
    display: block;
    font-size: 13px;
    letter-spacing:0;
    font-weight: 700;
    color: #19BFCC;
}

.header header .header-nav .dropDown .selectedImg .heading a.readmore{
    font-size: 11px;
    font-weight: 900;
    color: #47525D;
    letter-spacing: 0.59px;
    margin: 0;
    padding:10px 0 0;
}


.header header .header-nav .dropDown .submenu a.readmore:hover{
    text-decoration: underline;
}

/**********/
/*body header{
    background: #ffffff;
    border: none;
}

body.post-template-contact-lenses header .header-nav .primary-nav ul li a, 
body.page-template-contact-landing header .header-nav .primary-nav ul li a,
body.page-template-quiz-template header .header-nav .primary-nav ul li a{
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: #47525D;
    letter-spacing: 0.88px;
    padding: 20px 10px;
}

body.post-template-contact-lenses .footer-component, body.page-template-contact-landing .footer-component, body.page-template-quiz-template .footer-component{background: #ffffff;}*/


/**********/

.selectedImg{
    position: relative;
}

.selectedImg img{
    width: 100%;
    height: 300px;
    object-fit: cover;
}

.selectedImg .heading{
    background: rgba(255,255,255,0.8);
    position: absolute;
    bottom: 20px;
    left: 20px;
    right: 20px;
    padding: 20px;
    text-align: center;
}

.selectedImg .heading h3{
    font-weight: 300;
    font-size: 24px;
    color: #47525D;
    line-height: 30px;
}

.selectedImg .heading h3 span{
    display: block;
}

.header header .header-nav .primary-nav ul li .selectedImg a, .header header .header-nav .primary-nav ul li .selectedImg a:hover{
    padding: 0;
    background:none;
    box-shadow: none;
    color: #47525D;
}

.header header .header-nav .primary-nav ul li .selectedImg a:after{
    display: none;
    left: 10px;
    right: 10px;
    width: auto;
}

/*DropDown*/

.wrapper{
    padding:55px 0 0 0;
    margin-bottom: -250px;
}

header .header-logo{
    width: 180px;
    height: 45px;
    overflow: hidden;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}


header .header-logo img{
    width: 100%;
    height: auto;
}

.right-flex-header{
    display: -webkit-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -moz-justify-content: space-between;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -moz-align-items: center;
    align-items: center;
}

.header-search{
    position: relative;
    margin:0 0 0 20px;
}


header  .search-field-container .article_search {
    border: 1px solid #5A5E60;
    height: 40px;
    padding:0 19px;
    border-radius: 50px;
    background-color: transparent;
    cursor: pointer;
    margin:0;
    position: relative;
    -webkit-transition: width 400ms ease, background 400ms ease;
    transition: width 400ms ease, background 400ms ease;
    width: 0;
    z-index: 1;
}

.search-field-container .article_search:focus {
    background-color: #fff;
    border: 1px solid #a4aeb8;
    cursor: text;
    outline: 0;
    width:250px;
    padding: 0 15px 0 35px;
    background-position: 10px center;
    z-index: 0;
    border-radius: 50px;
}

.search-field-container a.search-icon{
    position: absolute;
    left: 13px;
    top: 13px;
    line-height: 0;
}

.search-field-container .article_search:focus ~ a.search-icon{
    left:12px;
}


.search-field-container a.search-icon svg{
    width: 13px;
    height: 13px;
    color: #2B2D2F;
    fill: currentColor;
}


@media all and (min-width: 768px) and (max-width: 1024px){
.ui-widget.ui-widget-content{
    left:auto !important;
    right: 15px;
}
}

.header header .flex-header .mobile-nav {
    display: none;
}


/*MID Section*/
#newVer{padding: 20px 15px 0;}
#newVer .sideLeft{float: left; width: 60%; padding: 20px; background: #ffffff; margin-bottom: 30px;}
#newVer .sideRight{float: right; width: 30%; padding: 20px; background: #ffffff; margin-bottom: 30px;}

#newVer .the-latest-container, #newVer .most-viewed-container, #leftSide .most-viewed-container{padding:0;}

#newVer .the-latest-container h1, #newVer .most-viewed-container h1,
#newVer .the-latest-container h1 strong, #newVer .most-viewed-container h1 strong,
.bottomRight .the-latest-container h1, .bottomRight .the-latest-container h1 strong,
#leftSide .most-viewed-container h1, #leftSide .most-viewed-container h1 strong{
    padding:0; 
    margin:0; 
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #98A4AE;
    letter-spacing: 1.5px;
    text-align: center;
    text-transform: uppercase;
}

#newVer .the-latest-container h1, #newVer .most-viewed-container h1, .bottomRight .the-latest-container h1, #leftSide .most-viewed-container h1{
    position: relative;    
    padding:10px; 
    margin-bottom:10px; 
}

#newVer .the-latest-container h1 span:before, #newVer .most-viewed-container h1 span:before, .bottomRight .the-latest-container h1 span:before,
#leftSide .most-viewed-container h1 span:before{
    background: #19BFCC;
    width: 64px;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -32px;
    content: "";
}

#newVer .the-latest-container .trending{
    display: block;
    margin: 0;
    padding:15px 0;
}

.the-latest-container .trending .thumb {
    padding:0;
    margin: 0 0 20px;
    transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -webkit-transition: all 0.30s ease-in-out;
}

.sideLeft .the-latest-container .trending:hover .thumb {
    opacity: 0.5
}


.the-latest-container .trending .thumb img{
    width: 100%;
    max-height: 300px;
    object-fit: cover;
    display: block;
}

.the-latest-container .trending .desc{
    padding: 0;
    margin: 0;
    text-align: left;
}

.the-latest-container .trending .desc h3{
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    font-size: 24px;
    color: #2C2E30;
    letter-spacing: 0;
    line-height: 35px;
    padding: 0;
    margin: 0 0 10px;
    position: relative;
}

.the-latest-container .trending .desc h3 a{
    font-weight:900;
    color: #2C2E30;
    text-decoration: none;
    position: relative; 
}

.the-latest-container .trending .desc h3 a:after, .bottomRight .the-latest-container .trending a h5:after{
    background: #19BFCC;
    width: 0;
    height: 2px;
    content: "";
    position: absolute;
    left: 0;
    bottom:-5px;
    transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -webkit-transition: all 0.30s ease-in-out;
}

.the-latest-container .trending .desc h3 a:hover:after, .bottomRight .the-latest-container .trending a:hover h5:after{
    background: #19BFCC;
    width: 100%;
}

.the-latest-container .trending .desc p{
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: #596570;
    letter-spacing: 0;
    line-height: 22px;
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0;
    margin: 0 0 10px;
}

a.moreLink{
    font-family: 'Lato', sans-serif;
    font-weight: 400 !important;
    font-size: 13px;
    color: #19BFCC !important;
    letter-spacing: 0.97px;
}

#leftSide a.moreLink{
    display: inline-block;
    margin: 0px 0 20px 0;
}

.most-viewed-container .most-viewed{padding:0}
.most-viewed-container .most-viewed .list-view .list-row{display: block; margin-bottom: 15px;}
.most-viewed-container .most-viewed .list-view .list-row a,
.bottomRight .the-latest-container .trending a{text-decoration: none; transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -webkit-transition: all 0.30s ease-in-out;}
.most-viewed-container .most-viewed .list-view .list-row .thumb,
.bottomRight .the-latest-container .trending .thumb {width:100%; margin:0 0 8px; position: relative; display: block; transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -webkit-transition: all 0.30s ease-in-out;}
.most-viewed-container .most-viewed .list-view .list-row a:hover .thumb img,
#bctSction .the-latest-container .trending a:hover .thumb img, 
#leftSide .the-latest-container .trending  a:hover .thumb img{opacity: 0.5; transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -webkit-transition: all 0.30s ease-in-out;}
.most-viewed-container .most-viewed .list-view .list-row .thumb .num{
    position: absolute;
    bottom: 0;
    left: 0;
    font-family: 'Lato', sans-serif;
    font-weight: 600;
    font-size: 20px;
    color: #FFFFFF;
    letter-spacing: 1.5px;
    line-height: 30px;
    height: 30px;
    z-index: 1;
    background: #19BFCC;
    width: 30px;
    text-align: center;
}

.most-viewed-container .most-viewed .list-view .list-row .desc, .bottomRight .the-latest-container .trending .desc  {width:100%; margin:0; padding: 0; display: block;}
.most-viewed-container .most-viewed .thumb img {width: 100%; height: 85px; min-height: 85px; object-fit: cover; display: block;}
.most-viewed-container .most-viewed .list-view .list-row .desc h5,
.bottomRight .the-latest-container .trending .desc h5, #leftSide .the-latest-container .trending .desc h5{margin:0; font-weight: 900; font-size: 15px;
color: #2C2E30;
letter-spacing: 0;
line-height: 19px; position: relative;
display: inline-block;}

.bottomRight{width: 100%; padding: 20px; background: #ffffff; margin-bottom: 30px; position: relative;}
.bottomRight .the-latest-container .trending a:hover .thumb img{opacity: 0.5; transition: all 0.30s ease-in-out;
    -moz-transition: all 0.30s ease-in-out;
    -webkit-transition: all 0.30s ease-in-out;}
    .bottomRight .the-latest-container .trending .thumb img {width: 100%; height: 160px; min-height: 160px; object-fit: cover; display: block;}
.bottomRight .the-latest-container, .bottomRight .the-latest-container.side-pages, .bottomRight .the-latest-container.inner-pages{padding: 0; position:static !important;}

@media all and (min-width:990px){
    .bottomRight .owl-carousel .owl-stage-outer{
        overflow: visible;
    }

}

/*#newVer .the-latest-container, #newVer .most-viewed-container{padding: 0 0 40px;}

#newVer .the-latest-container h1, #newVer .the-latest-container h1 strong,
#newVer .most-viewed-container h1, #newVer .most-viewed-container h1 strong{font-size: 22px; text-align: center; text-transform: uppercase; font-family: 'Lato', sans-serif;
    font-weight: 700;}

#newVer .the-latest-container h1, #newVer .most-viewed-container h1{padding:0; margin-bottom:20px; font-family: 'Lato', sans-serif;
    font-weight: 400;}

#newVer .the-latest-container .trending, #newVer .most-viewed-container .most-viewed{margin: 0;  padding: 0;}

#newVer .the-latest-container .trending .thumb {padding: 0; width: 100%;}
#newVer .the-latest-container .trending .thumb  img{max-height: 300px; object-fit: cover;}

#newVer .the-latest-container.newImgLatest .trending .thumb  img, .the-latest-container.inner-pages .trending .thumb  img{max-height: 150px; height: 150px; object-fit: cover;}

#newVer .the-latest-container .trending .desc{text-align: left; padding: 10px 0;}
#newVer .the-latest-container .trending .desc h3 a{ font-size: 22px; line-height: normal; font-family: 'Lato', sans-serif;
    font-weight: 700; }

#newVer .the-latest-container .trending .desc p{font-size:16px; letter-spacing: 0px; color: #47525d; line-height: 24px; font-family: 'Lato', sans-serif;
    font-weight: 400;}

#newVer .most-viewed-container .most-viewed .list-view .list-row{display: block; margin-bottom: 30px;}
#newVer .most-viewed-container .most-viewed .list-view .list-row .thumb {width:100%; margin:0;}
#newVer .most-viewed-container .most-viewed .list-view .list-row .desc  {width:100%; margin:0;}

#newVer .the-latest-container .read-more{top: 10px; right: 20px!important;}

     .listing .box .bg .desc h3 a:hover, #newVer .most-viewed-container .most-viewed .desc a:hover, #newVer .the-latest-container .trending .desc a:hover {
    color: #19bfcc;
    transition: all 0.40s ease;
    -moz-transition: all 0.40s ease;
    -webkit-transition: all 0.40s ease;
    -o-transition: all 0.40s ease;
}
*/


#newVerFooter .by-envy{display: none;}
#newVerFooter .newsletter {float: right;}
#newVerFooter .newsletter h3 {
    margin: 0 0 10px;
    font-size: 20px;
    line-height: normal;
    text-align: left;
}

#newVerFooter img.footerLogo{
    width: 230px;
    height: auto;
}

/*MID Section*/


/*Inner Pages*/

#rightSide{
    float: left;
    width: 65%;
}


#leftSide{
    float:right;
    width: 30%;
}


#leftSide .the-latest-container.side-pages {
    padding: 50px 0 0;
}

#leftSide .header-social-media {
    margin: 10px auto 0;
}

.header-social-media{
    display: flex;
    justify-content: center;
    align-items: center;
}

.header-social-media a{
    width: 40px;
    height: 40px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 100%;
    border: 1px solid #00A2AE;
    overflow: hidden;
    margin: 0 8px 0 0;
}

.header-social-media a svg{
    width: 100%;
    height: auto;
}

/* Inner Pages*/


@media all and (max-width: 990px){
    .sideLeft{float: left; width: 60%}
    .sideRight{float: right; width: 35%}
    .wrapper {padding:58px 0 0 0;}
    body.fixed .wrapper {padding:65px 0 0 0;}
    body header .flex-header{padding: 5px 15px;}
    body.fixed header .flex-header {padding: 5px 15px;}
    body header .header-logo, body.fixed header .header-logo{width: 174px; height: auto; position: relative; top: 2px;}
    .header header .flex-header .mobile-nav {display:block; position: relative; left: 0; min-width: 20px; top: 2px;}
    .right-flex-header{min-width: 20px;}
    .header-search {position: relative; margin: 0;}

    .header header .header-nav .primary-nav ul{display: none;}
    .header header .header-nav.active .primary-nav ul {
    list-style: none;
    display: -webkit-box;
    display: -moz-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal;
    -webkit-box-orient: vertical;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    -moz-justify-content: flex-start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -moz-align-items: center;
    align-items: center;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}


.header header .header-nav{
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

.header header .header-nav.active{
    background: rgba(0,0,0,0.6);
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
}


.header header .header-nav .primary-nav {
    overflow: hidden;
}

.header header .header-nav.active .primary-nav {
    position: fixed;
    top: 0;
    max-width: 460px;
    width: 90%;
    height:auto;
    left: 0;
    bottom: 0;
    background-color: #ffffff;
    padding:60px 20px;
    margin:0;
    z-index: 3;
    overflow: hidden;
    overflow-y: auto;
    -khtml-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
    box-sizing: border-box;
}

.header header .header-nav .primary-nav .close-menu {
    display: none;
    position: absolute;
    z-index: 4;
    border-radius: 50%;
    border:none;
    left: auto;
    right: 20px;
    top: 20px;
    color: #5A5E60;
    width: 24px;
    height: 24px;
    padding: 1px 0 0;
    box-sizing: border-box;
    text-align: center;
    vertical-align: middle;
    font-size: 26px;
}

.header header .header-nav.active .primary-nav .close-menu{
    display: block;
    line-height: 18px;
    text-align: center;
}

.right-flex-header .search-field-container {
    position: absolute;
    right: 0;
    top: -20px;
}

#newVerFooter img.footerLogo{
    width: 280px;
    height: auto;
    margin:0 auto 10px;
    display: table; 
}

#newVerFooter .footer-wrapper .footer-nav {
    margin-top: 5px;
}

#newVer .the-latest-container .trending .thumb  img{max-height: 190px; object-fit: cover;}
#newVer .the-latest-container.newImgLatest .trending .thumb  img, .the-latest-container.inner-pages .trending .thumb  img{max-height: 100px; height: 100px; object-fit: cover;}

#newVer .the-latest-container .trending .desc p {
    font-size: .875rem;
    letter-spacing: -.73px;
    color: #47525d;
    line-height: 20px;
}

#newVer .the-latest-container .trending .desc {padding: 0;} 

}


@media all and (max-width: 767px){
    #newVer {padding: 30px 10px;}
    #newVer .sideLeft, #newVer .sideRight{float: none; width: 100%; padding:20px 0;}
    #newVer .the-latest-container .trending .desc {padding: 0 15px;}
    .bottomRight .the-latest-container .trending .desc {padding: 0 15px;}
    .sideRight a.moreLink{margin: 0 15px;}
    .header header .header-nav.active .primary-nav {
        padding: 60px 15px 15px;
    }
    /*footer{display: none;}*/
    #newVerFooter img.footerLogo{
        width: 230px;
        height: auto;
        margin:15px auto;
    }

    .wrapper.new-ver{
        margin: 0;
    }

    .search-field-container .article_search{
        display: none;
    }

    .search-field-container a.search-icon {
        position: absolute;
        left: auto;
        top: 10px;
        right: 15px;
    }


    .search-panel .article_search{width:86%; min-width:86%; height: 58px;}

    #newVerFooter.footer-component, .wrapper.new-ver .push {
        height: auto;
        padding:20px 0;
        margin: 0;
    }

    #newVerFooter .newsletter {
        float: none;
        margin: 0 -15px;
    }

    #newVerFooter .newsletter h3 {
        margin: 0 15px 10px;
        font-size: 18px;
        line-height: normal;
        text-align: center;
    }

    .wrapper.new-ver .push{
        display: none;
    }

    #newVer .most-viewed-container{margin:0; padding:0;}

    #newVer .most-viewed-container .most-viewed .list-view .list-row .thumb{
        padding: 0;
    }

    #newVer .most-viewed-container .most-viewed .list-view .list-row .desc{
        padding:0 15px 10px;
    }

    .bottomRight{padding: 20px 0 0;}
    #newVer .bottomRight .the-latest-container .trending .thumb img{
        max-height: 140px;
        object-fit: cover;
        height: 140px;
        min-height: 140px;
    }
    .most-viewed-container .most-viewed .list-view .list-row .desc h5, .bottomRight .the-latest-container .trending .desc h5{
        font-size: 20px;
        line-height: normal;
    }
    .most-viewed-container .most-viewed .list-view .list-row .thumb .num{
        left: 15px;
    }

    #newVer .the-latest-container .trending .desc h3{
        font-size: 1rem;
        line-height: 18px;
    }

    #newVer .the-latest-container .trending .desc h3 a{ font-size: 20px; line-height: normal; }

    #newVer .the-latest-container .trending .desc p{
        font-size: 1rem;
        line-height: 20px;
    }

    .bottomRight .the-latest-container .read-more {
        text-align: left;
        top: 0;
        right: auto !important;
        left: 0;
        padding: 0 0 20px;
    }

    .bottomRight .the-latest-container .read-more h4{
        padding: 0 15px;
    }

    .ui-widget.ui-widget-content {
        left: auto !important;
        right: 0;
    }

    .mc4wp-response p, #bctSction #rightSide .mc4wp-response p{
        margin: 0 auto 10px;
        max-width: 260px;
    }

    #bctSction #rightSide .mc4wp-response .mc4wp-success p{
        color: #090;
    }

    #bctSction #rightSide .mc4wp-response .mc4wp-error p{
        color: #ff0000;
    }


}

@media all and (max-width: 360px){
    #newVerFooter .newsletter h3 {
        margin: 0 15px 10px;
    }

    #newVerFooter .nl-search{
        height: auto;
    }

    #newVerFooter.footer-component, .wrapper.new-ver .push{
        padding: 20px 0;
    }
}

/*@media only screen and (min-width: 768px) and (-webkit-device-pixel-ratio: 2) and (orientation:portrait){
#newVerFooter .col-sm-7 {
    flex-basis: 57.3333333333%;
    max-width: 57.3333333333%;
    }*/
@media all and (min-width: 1170px){
    #newVerFooter .col-md-7 {
        flex-basis: 58.3333333333%;
        max-width: 58.3333333333%;
    }

    #newVerFooter .col-md-6{
        flex-basis: 49.8%;
        max-width: 49.8%;
    }

    #newVerFooter .col-md-5 {
        -ms-flex-preferred-size: 40.6666666667%;
        flex-basis: 40.6666666667%;
        max-width: 40.6666666667%;
    }
}

@media all and (min-width: 768px) and (max-width: 1024px) and (orientation:portrait) and (-webkit-device-pixel-ratio: 2){
    #newVerFooter .col-sm-7 {
        flex-basis: 57.3333333333%;
        max-width: 57.3333333333%;
    }

    .readmoreLink:after{
        content:"";
        background: url(../images/read-more-arrow.png) no-repeat right center;
        top: 0;
    }
}

@media all and (min-width: 768px) and (max-width: 1024px) and (orientation:landscape) and (-webkit-device-pixel-ratio: 2){
     #newVerFooter .col-md-7 {
        flex-basis: 58.3333333333%;
        max-width: 58.3333333333%;
    }

    #newVerFooter .col-md-6{
        flex-basis: 49.8%;
        max-width: 49.8%;
    }

    #newVerFooter .col-md-5 {
        -ms-flex-preferred-size: 40.6666666667%;
        flex-basis: 40.6666666667%;
        max-width: 40.6666666667%;
    }

    .readmoreLink:after{
        content:"";
        background: url(../images/read-more-arrow.png) no-repeat right center;
        top: 0;
    }
}




/*********************************************
NEW CSS THEME STYLE SHEET 04-DEC-2017
*********************************************/

/**/
.headingH1{
    padding: 30px 0;
    background: #ffffff;
    margin: 0 0 20px;
}

.headingH1 h1{
    margin: 0;
    padding:0;
    font-weight:600;
    font-size: 25px;
    color: #2C2E30;
    letter-spacing: 1.88px;
    text-transform: uppercase;
    text-align: center;
}

.headingH1 h1 span{
    position: relative;
    display: table;
    margin: 10px auto 0;
    padding: 10px 0 0 0;
    font-weight:300;
    letter-spacing: 0;
    line-height: 23px;
    font-style: italic;
    text-transform: none;
}

.headingH1 h1 span:before{
    background: #19BFCC;
    width: 78px;
    height: 1px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -39px;
    content: "";
}

.footer-component, .push {
    height: 250px;
}

.footComponent.footer-component{
    background: #ffffff;
    margin: 0;
    height:250px;
    padding:30px 0;
}




.footer-component .footRow{
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-justify-content:space-between;
    justify-content:space-between;
}

.footer-component .footRow img.footerLogo {
    width: 180px;
    height: 45px;
    overflow: hidden;
}

.footDesc{
    margin: 0 0 10px 0;
    font-size: 14px;
    color: #5a5e60;;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    line-height: 22px;
}

.footDesc a{
    text-decoration: none
}

.footDesc h3{
    margin: 0 0 10px 0;
    font-size: 14px;
    line-height: normal;
    color: #19bfcb;
    text-transform: uppercase;
    font-family: 'Lato', sans-serif;
    font-weight: 700;
}

.CategoryList{
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-justify-content:space-between;
    justify-content:space-between;
    min-width: 250px;
    max-width: 250px;
    line-height: 32px;
}

.CategoryList li a{
    color: #5A5E60;
    line-height: 20px;
    font-family: 'Lato', sans-serif;
    font-weight: 700;
}

.CategoryList li a:hover{
    color: #19bfcb;
}

.colmid{
    min-width: 220px;
    max-width: 220px;
}

.copyRight{
    display: -webkit-flex;
    display: block;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-justify-content:space-between;
    justify-content:space-between;
    margin: 15px 0; 
    padding: 15px 0;
    border-top: 1px solid rgba(0,0,0,0.15)
}

.copyRight .footer-copy{
    float: left;
}

.copyRight .footer-nav{
    float: right;
}

.copyRight .footer-copy, .copyRight  .footer-nav , .copyRight  .footer-nav  a{
   font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 14px;
    font-size: .875rem;
    color: #A3A5A8;
    letter-spacing: 0;
    line-height: 24px;
    padding:0;
}

.copyRight  .footer-nav  a{
    margin: 0;
    color: #A3A5A8;
}

.copyRight  .footer-nav  span{
    margin: 0 10px;
}



@media all and (max-width: 1024px){
    .headingH1 {
        padding-bottom: 20px;
        padding-top: 20px;
    }
    .headingH1 h1{
        font-size: 26px;
        line-height: 26px;
        padding: 0 0 10px 0;
    }
}


@media all and (max-width: 990px){
    .headingH1 {
        padding-bottom: 20px;
        padding-top: 20px;
    }
    .headingH1 h1{
        font-size: 20px;
        line-height: 20px;
        padding: 0 0 10px 0;
    }

    .footer-component .footRow{
        display: flex;  
  flex-flow: row wrap;
    }

    .footer-component .footRow .footDesc:first-child{
        display:block;
        width: 100%;
        text-align: center;
        padding-bottom: 10px;
    }

    .footComponent.footer-component {
        margin: 0;
        height: 250px;
        padding: 20px 0;
    }

    .footer-component .footRow img.footerLogo {
        width: 150px;
        height: 50px;
        overflow: hidden;
    }

}


@media all and (max-width: 767px){
    .headingH1 {
        padding-bottom: 15px;
        padding-top: 15px;
        margin: 0;  
    }
    .headingH1 h1{
        font-size: 18px;
        line-height: 22px;
        padding:10px 0 0;
        letter-spacing: 1.5px;
        font-weight: 900;
    }

    .headingH1 h1 span{
        font-size: 18px;
        margin: 0 auto;
        padding:5px 0;
    }

    .headingH1 h1 span:before{
        display: none;
    }

    .footer-component .footRow{
        display: block;  
  flex-flow: row wrap;
  text-align: center;
    }

    .footer-component .footRow .footDesc{
        display:block;
        width: 100%;
        text-align: left;
        padding-bottom: 10px;
    }

    .footer-component .footRow .footDesc .header-social-media {
        display: flex;
        justify-content:flex-start;
        align-items: center;
    }

    .footComponent.footer-component {
        margin: 0;
        height: auto;
        padding: 20px 0;
    }

    .newsletter_v2 .newsletter .nl-search .form-control {
        width: 200px;
        max-width: 100%;
    }

    .colmid, .CategoryList {
        min-width: inherit;
        max-width: inherit;
        padding: 0;
    }

    .CategoryList ul{
        width: 50%;
        min-width: 150px;
    }

    .CategoryList ul li{
        text-align: left;
        padding: 3px 10px 0 0;
    }

    .copyRight{
        display: block;
        text-align: center;
        margin: 0;
        padding-bottom: 20px;
    }

    .copyRight .footer-copy, .copyRight .footer-nav{
        float: none;
    }
}

@media all and (max-width: 360px){
    .nl-search, .nl-search form div.mc4wp-form-fields {
        max-width: 280px;
    }

    .newsletter_v2 .newsletter .nl-search .form-control{
        width: 150px;
    }
}

/**/

/***************
BRAND COMPARISIONS CSS STYLE SHEET START
****************/

#bctSction{
    padding: 30px 0;
}

.breadcrumb{
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 12.5px;
    color: #5A5E60;
    letter-spacing: 0;
    background: none;
    border-radius: 0;
}

.breadcrumb a{
    margin: 0 8px;
    color: #19BFCC;
    font-weight: 700;
}

#bctSction #rightSide{
    background: #ffffff;
    width: 65%;
}

#bctSction #leftSide{
    background: #ffffff;
    width: 30%;
    padding:0;
    padding-bottom: 0;
}

#bctSction #leftSide .the-latest-container.side-pages{
    margin: 0;
}


#bctSction #rightSide .custom_page{
    padding:20px;
}

#bctSction #rightSide h1{
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    font-size: 40px;
    color: #000000;
    letter-spacing: -1.02px;
    line-height: 35px;
    margin: 0 0 20px 0;
    padding: 0;
}

#bctSction #rightSide p{
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #2B2D2F;
    letter-spacing: 0;
    line-height: 32px;
    margin: 0 0 20px 0;
    padding: 0;
}

#bctSction #rightSide p.first-pera{
    font-size: 18px;
    font-style: oblique;
    line-height: 29px;
    font-weight: 300;
}


#bctSction .simplePullQuote{
    background: #F5F8F8;
    max-width: 520px;
    margin: 0 auto 30px;
    padding: 20px 30px;
    position: relative;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 17px;
    color: #2B2D2F;
    letter-spacing: 0;
    line-height: 32px;
}

#bctSction .simplePullQuote:before{
    background: none;
    position: absolute;
    top: 35px;
    left: -10px;
    content: '“';
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 80px;
    color: #47525D;
    z-index: 1;
}

#bctSction .simplePullQuote:after{
    background: none;
    position: absolute;
    bottom: 0;
    right: -10px;
    content: '“';
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 80px;
    color: #47525D;
    transform: rotateY(180deg);
    z-index: 1;
}

.bigImg{
    margin: 0 -30px 20px;
}

#bctSction #rightSide img{
    width: 100%;
}

#bctSction #rightSide img.size-medium {
    width: auto;
    height: auto;
    max-width: 100%;
    display: table;
    margin: 0 auto;
}

.bigImg span{
    display: block;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 12px;
    color: #5A5E60;
    letter-spacing: 0;
    line-height: 32px;
    text-decoration: underline;
    text-align: center;
}

/**/

.cc-box{
    margin:0 0 30px;
}

.cc-box h2{
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    font-size: 30px;
    color: #000000;
    letter-spacing: -0.76px;
    line-height: 35px;
    margin: 0 0 20px 0;
    padding: 0;
}

.col-th{
    display: -webkit-flex;
    display: flex;
    align-items:stretch;
    vertical-align: middle;
    justify-content: flex-start;
}

.col-th:nth-of-type(3),
.col-th:nth-of-type(5),
.col-th:nth-of-type(7),
.col-th:nth-of-type(9),
.col-th:nth-of-type(11),
.col-th:nth-of-type(13),
.col-th:nth-of-type(15){
    background: #F5F8F8
}

 table tr:nth-of-type(3),
 table tr:nth-of-type(5),
 table tr:nth-of-type(7),
 table tr:nth-of-type(9),
 table tr:nth-of-type(11),
 table tr:nth-of-type(13),
 table tr:nth-of-type(15){
    background: #F5F8F8
}

.col-th .col-td{
    border: 1px solid #DEDEDE;
    width: 50%;
    display: flex;
    align-items: center;
    padding: 10px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #2B2D2F;
    letter-spacing: 0;
} 

 table tr td{
    border: 1px solid #DEDEDE;
    width: auto;
    align-items: center;
    padding: 10px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #2B2D2F;
    letter-spacing: 0;
    vertical-align: middle;
} 

 table tr td img{
    max-width: 100%;
    height: auto;
    display: table;
    margin: 0 auto;
}

.col-th:nth-child(1) .col-td,  table tr:nth-child(1) td{
    border: none;
}

.col-th:nth-child(2) .col-td,  table tr:nth-child(2) td{
    border-top: none;
}


.col-th .col-td:first-child,  table tr td:first-child{
    /*width: 15%;*/
    border-left: none;
}

.col-th .col-td:last-child, table tr td:last-child{
   border-right: none;
}


/*.col-th .col-td strong{
    font-size: 18px;
    font-weight: 900;
    padding: 15px 0;
}*/

.col-th .col-td strong, table tr td strong {
   font-size: 17px;
   font-weight: 900;
   padding: 15px 0;
}

#bctSction .col-th .col-td h3,  table tr td h3{
    font-family: 'Lato', sans-serif;
    font-size: 18px!important;
    font-weight: 900!important;
    color: #2B2D2F;
    padding: 10px !important;
    margin: 0 !important;
    text-align: center;
    width: 100%;
    font-style: normal !important;
    letter-spacing: 0 !important;
}

#bctSction .shareThis, #bctSction .compListing{
    padding:20px;
}

#bctSction .shareThis hr, #bctSction .compListing hr{
    margin-bottom: 0;
}

#bctSction .shareThis h3{
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: #47525D;
    text-align: center;
    letter-spacing: 0;
}

#bctSction .compListing h3{
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: #2B2D2F;
    text-align: left;
    letter-spacing: 0;
}

#bctSction .compListing ul{
    list-style: disc;
    padding:10px 15px;
    margin: 0 15px;
}

#bctSction .compListing ul li{
    padding:5px 0;
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    font-weight: 400;
    color: #47525D;
}

#bctSction .compListing ul li a{
    color: #47525D;
}

#bctSction .compListing ul li a:hover{
    color: #19BFCC;
}


#bctSction .compListing a.readmore{
    padding:5px 0;
    display: block;
    font-size: 16px;
    letter-spacing:0;
    font-weight: 700;
    color: #19BFCC;
}

#bctSction .the-latest-container.side-pages{
    padding: 30px 0 0;
}

#leftSide .the-latest-container.side-pages {
    background: #ffffff;
    padding:20px;
    margin-top: 50px;
    margin-bottom: 20px;
    
}

.whiteBgColumn{
    background: #ffffff;
    padding:20px;
    margin-top: 50px;
    margin-bottom: 20px;
}


#bctSction .the-latest-container.side-pages .trending .desc, #leftSide .the-latest-container.side-pages .trending .desc{
    line-height: 19px;
    padding: 10px 0;
    margin: 0 0 10px;
    display: block;
}

#bctSction .the-latest-container .trending .thumb, #leftSide .the-latest-container .trending .thumb {
    padding: 2px;
    margin: 0 -20px;
    display: block;
}

#leftSide .subsCribe {
    background: #f5f8f8;
    padding: 15px 10px;
    margin: 0 -20px;
}

#leftSide .subsCribe .newsletter_v2{
    background: none;
    margin:20px;
}

#leftSide .subsCribe .newsletter_v2  .newsletter {
    padding: 0;
    position: relative;
}

#leftSide .subsCribe .newsletter_v2 .newsletter .newsletter-icon{
    display: none;
}

#leftSide .subsCribe h3{
    background: url(../images/email.png) no-repeat 0 50%;
    background-size: 35px;
    display: table;
    margin: 0 auto 10px;
    padding: 0 80px 0 45px;
    font-size: 17px;
    color: #47525D;
    letter-spacing: 0;
    line-height: normal;
    font-weight: 900;
    text-transform: none;
}

#leftSide .subsCribe h3 span{
    font-style: oblique;
    font-weight: 700;
    color: #002200;
    opacity: 0.8
}

#leftSide .subsCribe h3 br {
    display: block;
}

#leftSide .subsCribe .btn{
    padding: 0;
    position: relative;
    margin-left: -5px;
}

#leftSide .subsCribe .container .newsletter .nl-search .form-control{
    background: #FFFFFF;
    border: 1px solid #B7BBC0;
    border-right: none;
    border-radius: 3px;
    width: 75%;
    max-width: 75%;
}

#bctSction #rightSide .mobileView, #bctSction #rightSide .mobView{display: none;}
#bctSction #rightSide .desktopView{display: block;}

@media all and (max-width:990px){
    /*#bctSction #rightSide{width: 100%;}
    #bctSction #leftSide{width: 100%;}
    #bctSction #rightSide .mobileView{display: block;}*/
    #bctSction #rightSide .subsCribe{background: #ffffff; padding: 0; margin: 0}
    #bctSction #rightSide .subsCribe h3{background-position: 50% 0; padding: 45px 0 0; text-align: center;}
    #bctSction #rightSide .subsCribe form div.mc4wp-form-fields{max-width: 300px;}
    #bctSction #rightSide .subsCribe .container .newsletter .subscribe, 
    #bctSction #rightSide .subsCribe .container .newsletter .subscribe:hover, 
    #bctSction #rightSide .subsCribe .container .newsletter .subscribe:focus {font-size: 14px; width: 120px;}
    
    
    #leftSide .subsCribe {background: #f5f8f8; padding: 15px 0; margin: 0;}
    #leftSide .subsCribe h3{padding: 0 0 0 40px;}
    #leftSide .subsCribe .newsletter_v2{margin: 0;}
    #bctSction .shareThis, #bctSction .compListing {padding: 20px 10px;}
}

@media all and (max-width:767px){
    .breadcrumb{padding: 8px 15px;}
#rightSide, #leftSide {
    float: none !important;
    width: 100%;
}

#bctSction #leftSide .shareThis, #bctSction #leftSide .subsCribe{display: none;}

#bctSction #rightSide{width: 100%;}
    #bctSction #leftSide{width: 100%;}
    #bctSction #rightSide .mobileView{display: block;}

    /*body.post-template-contact-lenses, body.page-template-contact-landing, body.page-template-quiz-template{background: #ffffff;}*/
    #bctSction {padding:10px 0;}
    #bctSction .container{padding: 0;}
    #bctSction #rightSide .custom_page {padding:15px;}
    #bctSction #rightSide .bigImg {margin: 0 -20px 20px;}
    #bctSction #rightSide h1{font-size: 30px; margin: 0 0 15px !important;}
    #bctSction #rightSide p{font-size: 16px; line-height: 24px;}
    #bctSction #rightSide p.first-pera{font-size: 16px; line-height: 24px;}
    .cc-box h2{font-size: 20px; line-height: 22px;}
    /*#bctSction #leftSide .the-latest-container.side-pages .trending .cols {float: left; width: 50%; padding: 0 10px;}*/

    .right-flex-header .search-field-container{right: 20px; top: -10px;}
    header .search-field-container a.search-icon {position: absolute; left: 0; top: 0; line-height: 0;}
    header .search-field-container a.search-icon svg {width: 19px; height: 19px; color: #2B2D2F; fill: currentColor;} 
    #bctSction #rightSide .mobView{display: block;}   
    #bctSction #rightSide .desktopView{display: none;}
    .col-th .col-td {width: 65%;}
    .col-th .col-td:first-child {width: 35%;}
    .mobView .col-th:nth-child(1) .col-td:first-child,
    .mobView .col-th:nth-child(2) .col-td:first-child{display: none;}
    .mobView .col-th:nth-child(1) .col-td,
    .mobView .col-th:nth-child(2) .col-td{width: 100%; border-left:  none; border-right:  none; text-align: center;}
    #bctSction .col-th .col-td h3{font-size: 20px;}
    #bctSction #rightSide .cc-box img {width: 100%; max-width: 260px; margin: 0 auto}
    #bctSction #rightSide .mobileView .newsletter{padding: 10px 0;}
    #bctSction #rightSide .mobileView .newsletter_v2 {padding: 0 15px; background: no-repeat; margin: 0;}
    #bctSction #rightSide .mobileView .newsletter .newsletter-icon{display: none;}


    #leftSide .subsCribe h3{
        background: url(../images/email.png) no-repeat 50% 0;
        background-size: 35px;
        padding: 45px 45px 0;
    }

     #bctSction #rightSide  .subsCribe.mobileView h3{
            background: url(../images/email.png) no-repeat 50% 0;
            background-size: 35px;
            padding: 45px 60px 0;
    display: table;
    margin: 0 auto 10px;
    font-size: 17px;
    color: #47525D;
    letter-spacing: 0;
    line-height: normal;
    font-weight: 900;
    text-transform: none;
        }

        #bctSction #rightSide  .subsCribe.mobileView h3 span {
    font-style: oblique;
    font-weight: 700;
    color: #002200;
    opacity: 0.8;
}

    #leftSide .subsCribe .container .newsletter .nl-search .form-control{width: 60%; max-width: 60%;}

    /*Fact & Fiction*/
    .mob-btn{
        background: #eaf4f6;
        position: fixed;
        padding: 10px;
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0;
        z-index: 100;
    }
    #bctSction #rightSide .factnfictions p{
        font-size: 14px;line-height: 20px !important;
    }
    .factnfictions .quizQuestion ul{
        display: flex;
    }
    .factnfictions .quizAnswer {
        width: 100% !important;
        padding: 0 5px !important;
        margin:10px 0!important
    }
    .factnfictions #quizThanks .quizBg{
        padding: 0px 0;
    }
}

/***************
BRAND COMPARISIONS CSS STYLE SHEET END
****************/


/*New menu set*/

.menuMobileHeader {
        position: fixed;
        top: 0;
        width: 85%;
        height: 60px;
        background: #ffffff;
        z-index: 1;
        left: 0;
        max-width: 460px;
        display: none;
    }

@media all and (max-width: 1140px){
    header .flex-header{padding: 5px 15px;}
    header .header-logo{width: 140px; height: 40px; margin-top: 5px;}
    .header header .header-nav .primary-nav ul li a{font-size: 12px; padding: 17px 2px;}
    body.post-template-contact-lenses header .header-nav .primary-nav ul li a, 
    body.page-template-contact-landing header .header-nav .primary-nav ul li a,
    body.page-template-quiz-template header .header-nav .primary-nav ul li a{font-size: 14px; padding: 20px 5px 19px;}
    .header-search .article_search:focus{width: 230px;}
    .header header .header-nav .dropDown{top: 58px;}
}

.menuDesktop{display: block;}
.menuMobile{display: none;}


@media all and (max-width:990px){
    .menuDesktop{display: none;}
    .menuMobile{display: block;} 

    .header header .header-nav.active .primary-nav ul{
        border-top: 2px solid #DEDEDE
    }
    .header header .header-nav.active .primary-nav ul li, 
    body.post-template-contact-lenses header .header-nav .primary-nav ul li, 
    body.page-template-contact-landing header .header-nav .primary-nav ul li,
    body.page-template-quiz-template header .header-nav .primary-nav ul li{
            padding: 5px;
            list-style: none;
            margin: 0;
            display: block;
            position: relative;
            width: 100%;
            text-align: left;
            border-bottom: 2px solid #DEDEDE;
            font-size: 16px;
            color: #47525d;
    }

    .header header .header-nav.active .primary-nav ul li a, 
    body.post-template-contact-lenses header .header-nav .primary-nav ul li a, 
    body.page-template-contact-landing header .header-nav .primary-nav ul li a,
    body.page-template-quiz-template header .header-nav .primary-nav ul li a{
        font-size: 16px;
        padding: 15px 0;
        line-height: normal;
        position: relative;
        box-shadow: none;
    }

    .header header .header-nav.active .primary-nav ul li a:after{
        content:"";
        background: url(../images/gry-arrow.png) no-repeat right center;
        width: 11px;
        height: 16px;
        position: absolute;
        top: 50%;
        left: auto;
        right:0;
        margin: 0;
        margin-top: -8px;
        opacity: 0.5;
    }

    .header header .header-nav .menuMobile ul.menu{
        transform: translate(0);
         -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    }

    .header header .header-nav .menuMobile.open ul.menu{
        transform: translate(-100%);
        opacity: 0;
    }

    .header header .header-nav .menuMobile .dropDown{
        transform: scale(1);
        transform: translate(-110%);
        opacity: 1;
        padding: 0;
        background: none;
        box-shadow: none;
    }

    .header header .header-nav .menuMobile.open .dropDown.submenuOpen{
        transform: translate(0);
        transform: scale(1);
        opacity: 1;
        padding: 0;
    }

    .gotoMain{
        background: #19BFCC;
        font-weight: 700;
        text-transform: uppercase;
        font-size: 14px;
        color: #FFFFFF;
        letter-spacing: 0.82px;
        line-height: 50px;
        height: 50px;
        position:relative;
        padding: 0 30px 0 50px;
    }

    .gotoMain:after{
        content:"";
        background: url(../images/white-arrow.png) no-repeat right center;
        width: 14px;
        height: 22px;
        position: absolute;
        top: 50%;
        left: 26px;
        margin-top: -12px;
    }

    .header header .header-nav .dropDown .row, .header header .header-nav .dropDown .submenu{
        display: block;
    }

    .header header .header-nav .dropDown .submenu div.collps {
        background: #F5F8F8;
        padding:10px 30px;
        display: none;
    }

    .header header .header-nav .dropDown .submenu div.collps ul,
    .header header .header-nav .dropDown .submenu div.collps ul li,
    .header header .header-nav .dropDown .submenu div.collps ul li a{
        border: none;
        padding: 0;
        margin: 0 0 10px;
    }

    .selectedImg{
        margin:  0 30px;
    }

    .selectedImg a{
        color: #47525D;
    }

    .selectedImg .heading{
        left: 15%;
        right: 15%;
        padding: 15px;
    }
    .selectedImg .heading h3 span {
        display: initial;
    }

    .menuHeading{
        font-size: 20px;
        color: #5A5E60;
        letter-spacing: 1.18px;
        margin:10px 30px;
        display: block;
    }

    .header header .header-nav .dropDown .submenu{
        padding: 15px 0;
    }

    .header header .header-nav .dropDown .submenu div {
        padding: 0;
        width: auto;
    }

    .header header .header-nav .dropDown .submenu h3{
        margin: 0;
        line-height:50px;
        border-bottom: 2px solid #DEDEDE;
        position: relative;
        margin: 0 30px;
    }

    .header header .header-nav .dropDown .submenu h3.upDown{
        border: none;
    }

    .header header .header-nav .dropDown .submenu h3:after{
        content:"";
        background: url(../images/gry-arrow.png) no-repeat right center;
        width: 14px;
        height: 22px;
        position: absolute;
        top: 50%;
        left: auto;
        right:0;
        margin: 0;
        margin-top: -8px;
        opacity: 0.5;
        transform: rotate(90deg);
        -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
    }

    .header header .header-nav .dropDown .submenu h3.upDown:after{
        transform: rotate(-90deg);
    }

    .header header .header-nav.active .menuMobileHeader {
        display: block;
    }

    .header header .header-nav.active .menuMobileHeader .header-logo{
        float: left;
        margin: 10px 15px;
    }

}


@media all and (max-width:767px) {
    .header header .header-nav.active .primary-nav{width: 85%;}
    .header header .header-nav .primary-nav .close-menu{right: 15px;}
    .gotoMain{padding:0 30px;}
    .gotoMain:after{left: 10px;}
    .selectedImg {margin: 0 15px;}
    .selectedImg img{width: 100%; height: auto;}
    .selectedImg .heading {left: 10%; right: 10%; padding: 10px 10px;}
    .selectedImg .heading h3{font-size: 20px; line-height: normal;}
    .menuHeading, .header header .header-nav .dropDown .submenu h3{margin: 0 15px;}
    .header header .header-nav .dropDown .submenu { padding: 0;}
    .header header .header-nav .dropDown .submenu div.collps{padding: 10px 15px;}
    .header header .header-nav .dropDown .submenu div.collps ul, .header header .header-nav .dropDown .submenu div.collps ul li, .header header .header-nav .dropDown .submenu div.collps ul li a{margin: 0 0 8px;}
}
/*New Menu Set*/


/*Category listing Page css*/

.sliderList, .category-hero{
    padding: 0 20px;
    margin: 0 0 30px;
    position: relative;
}

#bctSction #rightSide .sliderList h2{
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    font-size: 30px;
    color: #2B2D2F;
    letter-spacing: -0.76px;
    line-height: 35px;
    font-style: normal;
    margin: 0 0 30px;
    text-align: center;
}

.category-item .category-img img{
    width: 100%;
    max-width: 100%;
    height: auto;
    height: 130px;
}

#rightSide .category-desc{
    padding: 10px 0;
}

#rightSide .category-desc h3 {
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #47525D;
    letter-spacing: -0.61px;
    line-height: 19px;
    font-style: normal;
    margin: 0 0 12px;
}

#rightSide .category-desc h3 a{
    color: #47525D;
    text-decoration: none;
}

#rightSide .category-desc h3 a:hover{
    color: #19BFCC;
}

#bctSction #rightSide .category-desc p {
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: #47525D;
    letter-spacing: -0.61px;
    line-height: 19px;
    font-style: normal;
    margin: 0 0 15px;
}

.sliderList .owl-nav{
    position: absolute;
    top: 60px;
    left:-30px;
    right: -30px;
    overflow: hidden;
}

.sliderList .owl-prev{
    float: left;
    background: url(../images/gry-arrow.png) center center no-repeat;
    width: 11px;
    height: 16px;
    text-indent: -9999px;
    transform: rotateY(180deg);
}


.sliderList .owl-next{
    float: right;
    background: url(../images/gry-arrow.png) center center no-repeat;
    width: 11px;
    height: 16px;
    text-indent: -9999px;
}

.sliderList .owl-prev.disabled, .sliderList .owl-next.disabled{
    opacity: 0.5
}


#bctSction.categoryList .compListing h3 {
    font-family: 'Lato', sans-serif;
    font-size: 15px;
    font-weight: 900;
    color: #47525D;
    text-align: left;
    letter-spacing: 0.88px;
    line-height: 14px;
}

#bctSction.categoryList .compListing ul {
    list-style: none;
    padding: 10px 0;
    margin: 0 0;
}

#bctSction.categoryList .compListing ul li {
    padding: 5px 0;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 13px;
    color: #002200;
    letter-spacing: 0.88px;
    line-height: 18px;
}

#bctSction .compListing a.readmore {
    padding: 5px 0;
    display: block;
    font-size: 15px;
    letter-spacing: 0;
    font-weight: 900;
    color: #19BFCC;
}

/*Category Mobile css*/
@media all and (max-width: 767px){
.category-hero {
    padding: 0;
    margin: 0 -15px 15px;
    position: relative;
}

.sliderList{
    padding: 0;
    margin: 0 0 15px;
    position: relative;
}

.sliderList:last-child{
    margin: 0;
}

.sliderList .owl-stage, .bottomRight .owl-stage{
    padding-left: 0 !important;
}

.category-item .category-img img {
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: inherit;
    height: 120px;
}

#bctSction #rightSide .sliderList h2 {
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    font-size: 25px;
    color: #2B2D2F;
    letter-spacing: -0.76px;
    line-height: normal;
    font-style: normal;
    margin: 0 0 15px;
    text-align: left;
}

#bctSction.categoryList #leftSide {
    display: none;
}

#bctSction #rightSide .category-desc p{
    margin: 0;
}

}

/*Category Mobile css*/


/*QUIZ TEMPLATE*/
#quizTemp{}
#rightSide #quizTemp .head h1{
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    font-size: 40px;
    color: #000000;
    letter-spacing: -1.02px;
    line-height: 35px;
    margin: 0 0 20px 0;
    padding: 0;
}

#rightSide #quizTemp .head p{
    font-family: 'Lato', sans-serif;
    font-size: 20px;
    font-style: oblique;
    line-height: 29px;
    font-weight: 300;
    color: #2B2D2F;
    letter-spacing: 0;
    margin: 0 0 20px 0;
    padding: 0;
}

#quizTemp .quiz {
    padding: 20px 0;
    max-width: 645px;
    margin: 0 auto 30px;
}

#quizTemp .quiz h2{
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    font-size: 30px;
    color: #000000;
    letter-spacing: -1.02px;
    line-height: 35px;
    margin: 0 0 20px 0;
    padding: 0;
}

#quizTemp input[type=radio]:not(old) + label{
  display      : block;
    background: #F7F7F7;
    border: 1px solid #DFDFDF;
    border-radius: 3px;
    height: 46px;
    line-height: 46px;
    font-size: 20px;
    color: #000000;
    letter-spacing: -0.51px;
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    margin:20px 0 0 0;
    padding: 0 50px;
    position: relative;
     -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}



#quizTemp input[type=radio]:not(old):checked + label{
  background: rgba(25,191,204,0.50);
    border: 1px solid #19BFCC;
}


#quizTemp input[type=radio]:not(old) + label:after{
    content: "";
    font-family: FontAwesome;
    position: absolute;
    top: 50%;
    left: 15px;
    width: 20px;
    height: 20px;
    background: #FFFFFF;
    border: 1px solid #B7BBC0;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -10px;
    font-size: 0;
    color: #19BFCC;
     -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    -o-transition: all .5s ease;
    transition: all .5s ease;
}

#quizTemp input[type=radio]:not(old):checked + label:after{
    content: "\f00c";
    font-family: FontAwesome;
    position: absolute;
    top: 50%;
    left: 15px;
    width: 20px;
    height: 20px;
    background: #FFFFFF;
    border: 1px solid #19BFCC;
    border-radius: 3px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -10px;
    font-size: 15px;
    color: #19BFCC;
}


#quizTemp .quizBox{
    background: #19BFCC;
    border-radius: 3px;
    width: 645px;
    margin: 0 auto;
    padding: 10px 35px 15px;
}

#quizTemp .quizBoxMid{
    background: #FFFFFF;
    border-radius: 5px;
    padding: 20px;
}

#quizTemp .quizBox .quizBoxMid h4{
    font-family: 'Lato', sans-serif;
    font-weight: 900;
    font-size: 25px;
    color: #2B2D2F;
    letter-spacing: 0;
    margin: 0 0 20px;
}

#quizTemp .quizBox .quizBoxMid p{
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 17px !important;
    color: #000000 !important;
    letter-spacing: 0;
    line-height: 32px;
    margin: 0;
}

.quizBox .quizBoxMid img{
    float: right;
    margin: 0 0 0 20px;
    width: 200px !important;
    height: auto;
}

.quizBoxFlex{
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 10px;
}

.quizHeading{
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 15px;
    /*color: #FFFFFF;*/
    letter-spacing: 0;
    display: flex;
    align-items: center;
}

#quizTemp .quizBox .quizHeading img{
    width: 30px !important;
    height: auto;
    margin: 0 10px 0;
}

#quizTemp .quizBox a.quizRetake{
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #FFFFFF;
    letter-spacing: 0;
    display: flex;
    align-items: center;
    text-decoration: none;
}

#quizTemp .quizBox a.quizRetake:hover{
    color: #ffffff;
}

#quizTemp .quizBoxMid a.quizRetake .fa{
    font-size: 18px;
    margin: 0 10px 0 0;
}

/*QUIZ TEMPLATE*/
.wp-video, .mejs-container{width: 100% !important;}

/*ADVT BANNER*/
.advtBanner{
    background: #ffffff;
    margin: 0;
    position: relative;
}

.advtBanner .colFlex{
    background: #19bfcb;
    overflow: hidden;
    margin: 0 auto;
    width: 1280px;
    padding: 0;
    max-width: 100%;
    min-height: 127px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content:space-between;
    position: relative;
}

.advtBanner .colFlex h2{
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 36px;
    line-height: 40px;
    /*color: #006e79;*/
    color: #ffffff;
    margin: 0 0 0 -100px;
    padding: 0;
    text-transform: uppercase;
    text-align: center;
    letter-spacing: 1px;
}

.advtBanner .colFlex h2 span{
    font-weight: 500;
}

.advtBanner .colFlex .bannerImg {
    float: left;
    height: 127px;
}

.advtBanner .colFlex img{
    position: relative;
    top: 0;
    height: 127px;
}

.advtBanner .colFlex .container{
    width: auto;
    margin: 0;
}

.advtBanner .newsletter_v2{
    background: none;
    padding: 0;
    margin: 0;
}

.advtBanner .newsletter .newsletter-icon{
    display: none;
}

.advtBanner .newsletter .input-group.nl-search{
    width: auto;
    height: auto;
}

.advtBanner .colFlex .submitForm{
    min-width: 310px;
    background: #ffffff;
    border: 1px solid #bebebe;
    border-radius: 12px;
    height: 50px;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 16px;
    color: #333333;
    position: relative;
    overflow: hidden;
}

.advtBanner .colFlex .submitForm input[type=text]{
    width:  calc(100% - 115px);
    height: 48px;
    line-height: 48px;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 16px;
    color: #333333;
    padding: 0 15px;
    background: none;
    border:none;
    display: inline-block;
    vertical-align: top;
    margin: 0;
}

.advtBanner .colFlex .submitForm input[type=button]{
    width: 115px;
    height: 48px;
    line-height: 48px;
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 16px;
    color: #ffffff;
    padding: 0 10px;
    background: #f6a800;
    border:none;
    display: inline-block;
    vertical-align: top;
    float: right;
    border-radius: 12px;
}

.advtBanner .colFlex .nl-search div.mc4wp-form-fields{
    background: #ffffff;
    border-radius: 12px;
    height: 45px;
    overflow: hidden;
     border: 1px solid #B7BCC0;
     width: auto;
}

.advtBanner .colFlex .nl-search .form-control{
        width: 200px;
        max-width: 200px;
        margin: 0;
        border-radius: 12px;
        background: none;
        border:none;
        box-shadow: none;
    }
    .advtBanner .colFlex .nl-search .subscribe{
        padding: 0 15px;
        width: auto;        
        border-radius: 12px;
        border: none;
        font-size: 14px;
        height: 45px;
    }

@media all and (min-width: 768px) and (max-width: 1024px){
    .advtBanner .colFlex img {
        position: relative;
        top: 2px;
    }

    .advtBanner .colFlex .nl-search .form-control{
        width: 150px;
        max-width: 150px;
        margin: 0;
    }
    .advtBanner .colFlex .nl-search .subscribe{
        padding: 0 15px;
        width: auto;
    }
    .advtBanner .colFlex h2{
        font-size: 28px;
        line-height: normal;
        letter-spacing: 2px;
        margin: 0;
    }
}

.banerDesk{display: block;}
.banerMob{display: none;}

@media all and (max-width: 767px){

.banerDesk{display: none !important;}
.banerMob{display: block !important;}

.advtBanner .colFlex {
    display: block;
    padding:0 10px;
    min-height: inherit;
    margin:0;
}

.advtBanner .colFlex .bannerImg {
    text-align: left;
    display: block;
    /*margin: -10px auto 10px;
    max-width: 200px;*/
    margin: 0px -20px 0;
    float: left;
}
.advtBanner .colFlex .bannerImg img{
    max-width: 100%;
    object-fit: cover;
}


/*.advtBanner .colFlex .bannerImg{
    width: 100px;
    height: 100px;
    margin: 0 auto 10px;
    display: flex;
    border:2px solid #ffffff;
    border-radius: 100%;
    overflow: hidden;
    align-items: center;
    justify-content: center;
    display: none;
}

.advtBanner .colFlex .bannerImg img{
    width: 100%;
    object-fit: cover;
    display: flex;
}*/

.advtBanner .colFlex h2{
    font-size: 18px;
    line-height: normal;
    margin: 0 0 5px 0;
    padding:15px 20px 10px;
}

.advtBanner .colFlex h2 span{
    display: block;
}

.advtBanner .colFlex .nl-search .form-control {
    width: 165px;
    max-width: 165px;
    line-height: 32px;
    height: 32px;
    }

.advtBanner .colFlex .nl-search .subscribe, .advtBanner .colFlex .nl-search div.mc4wp-form-fields{
        height: 40px;
}


}

.advtBanner .mc4wp-error, .advtBanner .mc4wp-success{
    position: absolute;
    font-size: 13px;
}

@media all and (max-width:767px){
    .advtBanner .newsletter{padding:0;}
    .advtBanner .mc4wp-error, .advtBanner .mc4wp-success{
    position: relative;
    font-size: 13px;
    margin: 10px 0 0;
}

.advtBanner .input-group-btn{
    position: relative;
    z-index: 5;
}

}

.closeBanner{
    position: absolute;
    top: 10px;
    right: 10px;
    z-index:3;
}

.closeBanner a{
    color: #ffffff;
    width: 24px;
    height: 24px;
    padding: 1px 0 0;
    box-sizing: border-box;
    text-align: center;
    vertical-align: middle;
    font-size: 24px;
    display: block;
    text-decoration: none;
    font-weight: 400;
}

@media all and (max-width:767px){
    .closeBanner{
        top: 15px;
    right: 8px;
    }
    .closeBanner a{
        font-size: 18px;
    }
}

@media all and (max-width: 360px){
    .advtBanner .colFlex h2{
        position: relative;
        z-index: 1;
    }
    .advtBanner .colFlex .nl-search .form-control {
    width: 120px;
    max-width: 120px;
    font-size: 13px;
    }
}

.wpdiscuz-loading-bar-unauth{
    display: none !important;
}



/***CONTACT LENSES VIDEOS********************/

#bctSction #rightSide .videoDesc{
    padding: 20px 30px;
}
#bctSction #rightSide .videoDesc h1{
    font-size: 40px;
    font-weight: 600;
    font-style: italic;
}

#bctSction #rightSide .videoDesc p {
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    color: #596570;
    letter-spacing: 0;
    line-height: 22px;
    margin: 0 0 20px 0;
    padding: 0;
}

#bctSction #rightSide .videoDesc p.first-pera {
    font-size: 18px;
    color: #2B2D2F;
    font-weight: 300;
}

#bctSction #rightSide .videoDesc .createBy{
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 15px;
    color: #596570;
    letter-spacing: 0;
    text-align: center;
    line-height: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
}

#bctSction #rightSide .videoDesc .createBy span, #bctSction #rightSide .videoDesc .createBy div{
    padding: 0 15px;
}


#bctSction #rightSide .videoDesc .vidInfo{
    margin: 20px 0;
}

#bctSction #rightSide .videoDesc .vidInfo video{
    width: 100%;
    height: auto;
}

/*#bctSction #rightSide .videoDesc a.freeLink{
    display: table;
    margin: 0 auto 30px;
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #19BFCC;
    text-decoration: underline;
}*/

#bctSction #rightSide .videoDesc a.freeLink{
    background: #F6A800;
    border-radius: 3px;
    font-family: 'Lato', sans-serif;
    font-size: 17px;
    font-weight: bold;
    color: #FFFFFF;
    text-align: center;
    display: table;
    margin:0 auto;
    width: 280px;
    height: 50px;
    line-height: 50px;
    text-decoration: none;
    position: relative;
}

#bctSction #rightSide .videoDesc .freeLinkBtn{
    margin:20px auto;
}

/*#bctSction #rightSide .videoDesc a.freeLink{
    position: fixed;
    bottom: 10px;
    left:50%;
    margin-left: -140px;
}

#bctSction #rightSide .videoDesc a.freeLink:before{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: #000000;
    content: "";
}*/

#bctSction #rightSide .videoDesc h4{
    font-family: 'Lato', sans-serif;
    font-weight: 600;
    font-size: 16px;
    color: #47525D;
    padding: 0;
    margin: 0 0 20px 0;
}


#bctSction #rightSide .videoDesc .imgBlock{
    display: block;
    margin: 30px auto 20px;
    width: 75%;
}

#bctSction #rightSide .videoDesc .simplePullQuote {
    background: #F5F8F8;
    border: none;
    box-shadow: none;
    float: none;
    display: block;
    margin: 0 auto 20px;
    padding:15px;
    text-indent: inherit;
    width: 85%;
    position: relative;
    font-size: 20px;
    color: #2C2E30;
    text-align: center;
    line-height: 22px;
    font-style: italic;
}

#bctSction #rightSide .videoDesc .simplePullQuote:before{
    left: -25px !important;
}

#bctSction #rightSide .videoDesc .simplePullQuote:after{
    right: -25px !important;
}

#bctSction #leftSide .videoDesc .most-viewed-container {
    padding: 0 20px;
}

#bctSction #leftSide .videoDesc h4 a.moreLink {
    display: inline-block;
    margin: 0px 0 20px 20px;
}

#bctSction #leftSide .videoDesc .compListing h3 {
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    font-weight: 300;
    color: #2B2D2F;
    text-align: left;
    letter-spacing: 0;
}

#bctSction #leftSide .videoDesc .compListing ul li{
    line-height: 24px;
}

#bctSction #leftSide .videoDesc .imgBlock{
    background: #f5f8f8;
    padding:10px 20px;
    text-align: center;
}

#bctSction #leftSide .videoDesc .imgBlock img{
    max-width: 200px;
    height: auto;
}

#bctSction #rightSide .videoDesc a.btn-org-hubble{
    background: #F6A800;
    border-radius: 3px;
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #FFFFFF;
    text-align: center;
    display: table;
    margin:10px auto 0;
    width: 190px;
    height: 40px;
    line-height: 40px;
    text-decoration: none;
}

#bctSction #rightSide .videoDesc .vidInfo .mejs-overlay-button {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    background: url(../images/play-btn.png) no-repeat;
    background-size: cover;
}

#bctSction #rightSide .videoDesc .vidInfo .mejs-poster {
    background-size: cover;
}

#bctSction #rightSide .videoDesc .vidInfo .mejs-container {
    background: none !important;
}

.imgmobBlock{
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-style: italic;
    font-size: 18px;
    color: #47525D;
    letter-spacing: 0;
    text-align: center;
    margin: 0 0 30px 0
}

.imgmobBlock img{
    display: table;
    margin: 0 auto 10px;
    width: 94px !important;
    height: auto;
}


@media all and (max-width: 1024px){
    #bctSction #rightSide .videoDesc .vidInfo .mejs-overlay-button {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 100px;
    margin: -50px 0 0 -50px;
    background: url(../images/play-btn.png) no-repeat;
    background-size: cover;
}
}

@media all and (max-width: 767px){

#bctSction #rightSide .videoDesc{
    padding: 15px;
}

#bctSction #rightSide .videoDesc h1 {
    font-size: 25px;
    line-height: 31px;
}

#bctSction #rightSide .videoDesc p.first-pera, #bctSction #rightSide .videoDesc p{
    font-size: 17px;
    line-height: 27px;
}

#bctSction #rightSide .videoDesc .createBy{
    display: none;
}

#bctSction #rightSide .videoDesc .vidInfo {
    margin: 20px -15px;
}

#bctSction #rightSide .videoDesc .imgBlock {
    display: block;
    margin: 20px -15px;
    width: auto;
}

#bctSction #rightSide .videoDesc .simplePullQuote {
    width: 94%;
    font-size: 20px;
    line-height: 22px;
}

#bctSction #leftSide .videoDesc .most-viewed-container{
    margin: 0;
    padding: 0;
}

#bctSction #leftSide .videoDesc .most-viewed-container .most-viewed .list-view .list-row .desc{
    padding: 0 15px 10px;
}

#bctSction #rightSide .videoDesc .vidInfo .mejs-overlay-button {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 70px;
    height: 70px;
    margin: -35px 0 0 -35px;
    background: url(../images/play-btn.png) no-repeat;
    background-size: cover;
}

#bctSction #rightSide .videoDesc .freeLinkBtn.fixed{
    background: #eaf4f6;
    position: fixed;
    padding: 10px;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0;
    z-index: 100;
}

}

/***CONTACT LENSES VIDEOS********************/

/******visual-quiz***********************************/
#visualQuiz{
    padding:10px !important;
    border-bottom: 1px solid #c5c5c5;
    position: relative;
    min-height: 350px;
    overflow: hidden;
}

.quizHead{
    background: #F5F8F8;
    padding: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    font-size: 14px;
    font-weight: 400;
}

#visualQuiz a.back-btn  {
    font-weight: bold;
    font-size: 24px;
    line-height: 20px;
    color: #5A5E60;
    text-decoration: none;
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 2
}

.quizHead .close_quiz a {
    font-weight: normal;
    font-size: 20px;
    line-height: 20px;
    color: #5A5E60;
    text-decoration: none;
}

.loaderStrip{
    display: flex;
    position: absolute;
    bottom: -6px;
    left: 0;
    width: 100%;
    background: #eaf4f6
}

.loaderStrip span{
    position: relative;
    height: 5px;
    background: #19BFCC;
}

.quizBg{
    background: #eaf4f6;
    padding: 15px;
    margin: 10px 0;
     border-radius: 5px;
     text-align: center;
}

.quizBg img{
    border-radius: 5px;
}

.quizHome .quizBg img{
    width: 70% !important;
    margin: 0 auto
}

.quizFrame{
    padding: 20px;
    padding-bottom: 0;
}

.quizFrame h2{
    font-family: 'Lato', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: #2C2E30;
    letter-spacing: 1px;
    text-align: center;
    padding:10px;
    margin: 0;
    position: relative;
}

.quizFrame h3{
    font-family: 'Lato', sans-serif;
    font-size: 18px;
    font-weight: 300;
    text-align: center;
    padding:10px;
    margin: 0;
    font-style: italic;
    position: relative;
}

.quizFrame h2:after {
    background: #19BFCC;
    width: 100px;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -50px;
    content: "";
}


.quizFrame a.quiz-btn{
    background: #F6A800;
    border-radius: 3px;
    font-family: 'Lato', sans-serif;
    font-size: 14px;
    font-weight: bold;
    color: #FFFFFF;
    text-align: center;
    display: table;
    margin:15px auto;
    width: 190px;
    height: 40px;
    line-height: 40px;
    text-decoration: none;
}

.quizQuestion ul{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.quizQuestion ul li{
    display: flex;
    width: 33.33%;
    text-align: center;
}

#quizStep4 .quizQuestion ul li{
    display: flex;
    width: 50%;
    text-align: center;
}

#quizStep5 .quizQuestion ul li{
    width: 30%;
}


#quizStep5 .quizQuestion ul li:last-child{
    width: 50%;
}

.quizQuestion.mobDesk ul li{
    display: flex;
    width: 25%;
    text-align: center;
}

.quizQuestion ul li label{
    background: #19bfcb;
    padding:0 10px;
    margin: 5px;
    display: block;
    color: #ffffff;
    font-size: 14px;
    border-radius: 4px;
    letter-spacing: 1px;
    font-weight: 400;
    height: 50px;
    line-height: 50px;
    width: 100%;
    transition: all ease-in-out .25s;
    -moz-transition: all ease-in-out .25s;
    -webkit-transition: all ease-in-out .25s;
    -o-transition: all ease-in-out .25s;
}

.quizQuestion ul li label .ansLabel{
    display: table;
    margin: 0 auto;
    padding:0 30px;
    position: relative;
}

.quizQuestion ul li label:hover{
    background: #F6A800;
    box-shadow: 0 2px 2px 1px rgba(0,0,0,0.2);
    transition: all ease-in-out .25s;
    -moz-transition: all ease-in-out .25s;
    -webkit-transition: all ease-in-out .25s;
    -o-transition: all ease-in-out .25s;
}

.quizQuestion ul li input[type=radio]:not(old):checked + label{
    background:#F6A800;
    background-image: none;
}

.quizQuestion ul li input[type=radio]:not(old):checked + label .ansLabel{
        background: url(../images/tick-white.png) no-repeat 5px 50%;
}


#quizThanks, #quizThanks p{
    text-align: center;
}

#quizThanks .quizBg{
    padding: 20px 50px;
}

#quizThanks .quizBg img{
    width: 300px !important;
    height: auto;
}

#quizThanks  .quizFrame h2:after{
    display: none;
}

#quizThanks .quizFrame {
    padding: 10px;
    padding-bottom: 0;
}


/**/
@media all and (max-width: 768px){

    .quizQuestion ul{
        display: block; 
    }

    .quizQuestion ul li, #quizStep5 .quizQuestion ul li, #quizStep5 .quizQuestion ul li:last-child{
        display:block;
        width: 100%;
    }

    .quizQuestion.mobDesk ul li{
        float: left;
        width: 50%;
    }

    .quizQuestion ul:after, .quizQuestion ul:before{
        display: block;
        clear: both;
        content: "";
        visibility: hidden;
    }

    #quizStep4 .quizQuestion ul, .factnfictions .quizQuestion ul,  .factnfictions #quizStep5 .quizQuestion ul li{
        display: flex;
    }
    
    .factnfictions .quizAnswer{
        margin: 20px auto !important
    }

}
/**/

@media all and (max-width: 767px) and (orientation:portrait){

#visualQuiz{
    margin-top: -10px;
}

.quizFrame {
    padding: 0;
    padding-bottom: 0;
}

.quizFrame h2{
    font-size:20px;
    letter-spacing:normal;
    padding-top: 15px;
}

.quizFrame h3{
    font-size: 16px;
    padding: 5px 0 0;
}

.quizBg{
    padding: 10px;
}

.quizHome .quizBg img{
    width: 100% !important;
    margin: 0 auto
}

#quizThanks .quizBg img{
    max-width: 100% !important;
}

}

@media all and (max-width: 350px) and (orientation:portrait){
    .quizQuestion ul li label{
        padding: 0;
        font-size: 12px;
    }

    .quizFrame h2{
        font-size: 18px;
        padding: 15px 5px 10px;
    }

}



/**/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated2 {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}


.animated3 {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}


.animated4 {
  -webkit-animation-duration: 2.5s;
  animation-duration: 2.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}


.animated5 {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated6 {
  -webkit-animation-duration: 3.5s;
  animation-duration: 3.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated2.infinite, .animated3.infinite, .animated4.infinite, .animated5.infinite, .animated6.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}

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

  to {
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}


@-webkit-keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

@keyframes zoomIn {
  from {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  50% {
    opacity: 1;
  }
}

.zoomIn {
  -webkit-animation-name: zoomIn;
  animation-name: zoomIn;
}


@-webkit-keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes bounceIn {
  from, 20%, 40%, 60%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
    animation-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
  }

  0% {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3);
    transform: scale3d(.3, .3, .3);
  }

  20% {
    -webkit-transform: scale3d(1.1, 1.1, 1.1);
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    -webkit-transform: scale3d(.9, .9, .9);
    transform: scale3d(.9, .9, .9);
  }

  60% {
    opacity: 1;
    -webkit-transform: scale3d(1.03, 1.03, 1.03);
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    -webkit-transform: scale3d(.97, .97, .97);
    transform: scale3d(.97, .97, .97);
  }

  to {
    opacity: 1;
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
}

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInLeft {
  from {
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInLeft {
  -webkit-animation-name: slideInLeft;
  animation-name: slideInLeft;
}

@-webkit-keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInRight {
  from {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInRight {
  -webkit-animation-name: slideInRight;
  animation-name: slideInRight;
}

@-webkit-keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes slideInUp {
  from {
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

.slideInUp {
  -webkit-animation-name: slideInUp;
  animation-name: slideInUp;
}


@-webkit-keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

@keyframes pulse {
  from {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }

  50% {
    -webkit-transform: scale3d(1.05, 1.05, 1.05);
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

@-webkit-keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

@-webkit-keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

@keyframes slideOutRight {
  from {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0);
  }
}

.slideOutRight {
  -webkit-animation-name: slideOutRight;
  animation-name: slideOutRight;
}

@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }
}

.flipInX {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInX;
  animation-name: flipInX;
}


@-webkit-keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

@keyframes flipOutX {
  from {
    -webkit-transform: perspective(400px);
    transform: perspective(400px);
  }

  30% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.flipOutX {
  -webkit-animation-name: flipOutX;
  animation-name: flipOutX;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}




/*******visual-quiz**********************************/

/*******factnfictions**********************************/
.factnfictions .quizHome .quizBg img{
    width: 100% !important;
}
#bctSction #rightSide .factnfictions p{
    line-height: 25px;
    text-align: center;
}
.factnfictions .quizBg{
    background: transparent;
    padding: 0 0;
}
.factnfictions .quizQuestion ul li {
    display: flex;
    width: 50%;
    text-align: center;
}
.factnfictions .quizAnswer {
    display: block;
    padding: 0;
    overflow: hidden;
    margin: 30px auto 30px;
    max-width: 600px;
}
.factnfictions .quizAnswer .answer.answerRight {
    background: #edfef1;
    border: 1px solid #008803;
}
.factnfictions .quizAnswer .answer.answerWrong {
    background: #feeded;
    border: 1px solid #b00000;
}
.factnfictions .quizAnswer .answer{
    padding: 20px;
    border-radius: 5px;
}
.factnfictions .quizAnswer .answer button{
    background: #DF7D20;
    border-radius: 4px;
    /*font-family: 'Work Sans';*/
    font-weight: 500;
    font-size: 14px;
    color: #FFFFFF;
    letter-spacing: 0.5px;
    height: 45px;
    line-height: 45px;
    text-decoration: none;
    padding: 0 20px;
    display: table;
    margin: 30px auto 10px;
    text-align: center;
    min-width: 150px;
    border: none;
    outline: none;
}
.factnfictions .quizAnswer .answer button span {
    background: url(../images/arrow.png) no-repeat 80% center;
    padding: 0 30px 0 10px;
    opacity: 1;
    transition: all .3s cubic-bezier(0.4,0,0.2,1);
    -moz-transition: all .3s cubic-bezier(0.4,0,0.2,1);
    -webkit-transition: all .3s cubic-bezier(0.4,0,0.2,1);
    -o-transition: all .3s cubic-bezier(0.4,0,0.2,1);
}
.factnfictions .quizAnswer .answer button:hover span {
    background: url(../images/arrow.png) no-repeat 100% center;
    padding: 0 30px 0 10px;
}
.factnfictions  #quizThanks .quizBg img{
    width: 100% !important;
    margin: 30px 0;
}
.factnfictions #quizStep5 .quizQuestion ul li:last-child, .factnfictions #quizStep5 .quizQuestion ul li {
    width: 50%;
}
/*******factnfictions**********************************/

/**/
header .headContainer.posiRel{
    position: relative;
}



.discloserTxt{
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-style: italic;
    font-size: 17px;
    color: #2C2E30;
    letter-spacing: 0;
    line-height: 26px;
    max-width: 900px;
    width: 95%;
    margin: 0 auto 20px;
    text-align: center;
    padding: 0 15px;
}

.discloserTxt.topText, .discloserTxt.bottomText{
    background: #F5F8F8;
    font-style: normal;
    padding: 10px;
    font-size: 16px;
    color: rgba(44,46,48,0.9);
}

.discloserTxt.bottomText{
    margin: 30px auto 10px;
}

.sponsBy{
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 13px;
    color: #777;
    letter-spacing:0.5px;
    z-index: 1;
    text-align: center;
    border-radius:3px;
    padding:4px 0;
    display: table;
    margin: -15px 0 20px;
}

#quiz .sponsBy{
     margin:5px 0 15px;
}

.wrapper2 .advtBanner {
    background: #ffffff;
    margin: 0 0 -20px;
    position: relative;
    padding-top: 50px;
}

.wrapper2 #bctSction {
        padding-top:40px;
    }

@media all and (max-width: 990px){
    
    .wrapper2 header .header-logo, body.fixed .wrapper2 header .header-logo {
    width: 160px;
    height: auto;
    position: relative;
    top: 4px;
}

    .wrapper2 .headingH1 {
            padding-top:50px;
            margin: 0;
    }
}

@media all and (max-width: 767px){
    .wrapper2 .headingH1 {
            padding-top:35px;
            margin: 0;
    }

    .discloserTxt{
        font-size: 15px;
        line-height: 20px;
    }
    .wrapper2 .advtBanner {
        padding-top: 40px;
        margin-bottom: -25px;
    }

    body.post-template-fact_fiction_quiz .wrapper2 .advtBanner, body.post-template-visual_quiz .wrapper2 .advtBanner{
        margin-bottom: 0;
    }
    .sponsBy{
        padding: 5px;
    }

    .wrapper2 .whiteBgColumn{
        padding: 10px;
    }

    .discloserTxt.topText, .discloserTxt.bottomText{
        font-size: 14px;
        color: rgba(44,46,48,0.9);
    }

    .wrapper2 .breadcrumb {
        padding-top:35px;
        padding-bottom: 5px;
        margin-bottom: 10px;
        line-height: normal;
    }

    .wrapper2 #bctSction {
        padding-top: 10px;
    }

    body.post-template-fact_fiction_quiz .wrapper2 #bctSction,
    body.post-template-visual_quiz .wrapper2 #bctSction{
        padding-top: 25px;
    }

     body.post-template-food-debates .wrapper2 #bctSction{
        padding-top: 15px;
    }
}
/**/

/**scatter_chart**/

#chartForm{margin-top: 50px;}

#chartForm .form-group label{
    display: block;
    margin: 0 0 10px;
    font-size: 16px;
    font-weight: 600;
}

 #chartForm .form-group select{
    background: #FFFFFF;
    border: 1px solid #B7BBC0;
    border-radius: 3px;
    height: 40px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 15px;
    padding:0 8px;
}

#chart_div{
    border: 1px solid rgba(0,0,0,0.15);
    width: 100%;
    height: 800px;
    justify-content: center;
    align-items: center;
    display: flex;
    font-size: 35px;
    font-weight: 300;
    color: rgba(0,0,0,0.20);
    padding-left: 30px;
}

#chart_div.nochart {    
    /*height: 200px;*/
    font-size: 35px;
    font-weight: 300;
    color: rgba(0,0,0,0.20);
}
@media all and (max-width:767px){
    #chartForm .row{
        display: block;
    }
    #chart_div{height: 400px;padding-left: 10px;}
    #chartForm{margin-top: 30px;}
}


.chart_loader {
    background: url(../images/loader.gif) center center no-repeat;
    height: 15px;
    text-align: center;
    text-indent: -9999px;
    justify-content: center;
    align-items: center;
    display: flex;

}

.chartCheckbox label{
    position: relative;
    margin-bottom: 15px;
    padding: 0 0 0 30px;
    cursor: pointer;
}


.chartCheckbox label:before{
    content: "";
    border: 1px solid #c5c5c5;
    border-radius: 3px;
    height: 20px;
    width: 20px;
    position: absolute;
    left: 0;
}

.chartCheckbox input[type=checkbox]:checked ~ label:before{
    content: "";
    background: url(../images/tickmark.png) no-repeat center center;
    background-size: 13px;
    border: 1px solid #c5c5c5;
    border-radius: 3px;
    height: 20px;
    width: 20px;
    position: absolute;
    left: 0;
}

.chartLegend{
    display: flex;
    justify-content:flex-end;
    align-items: center;
    font-size: 14px;
    padding-top: 5px;
    line-height: 15px;
}

.chartLegend div{
    margin-left: 10px;
    margin-right: 5px;
}

.chartLegend span{
    width: 25px;
    height: 12px;
    display: inline-block;
    margin: 0 5px 0 0;
    vertical-align: middle;
}

@media all and (max-width:767px){
.chartLegend{
    font-size: 12px;
    margin: 5px -10px;
    line-height: normal;
    padding: 0;
    flex-wrap: wrap;
    flex-flow: nowrap;
    justify-content: center;
}

.chartLegend div {
    margin-left: 2px;
    margin-right: 2px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    width: 20%;
    text-align: center;
    line-height: normal;
}

.chartLegend span {
    width: 20px;
    height: 10px;
    display: table;
    margin: 0 auto;
    vertical-align: middle;
}

}

/**scatter_chart**/

/* Cookeis set*/

.InsiderCokiees{
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    position: fixed;
    left: 0;
    bottom: 0;
    right: 0;
    /*padding:13px 20px;*/
    padding:13px 20px;
    /*background: rgba(0,0,0,0.9);*/
    background: #2fbcca;
    display: flex;
    text-align: left;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-flex-align: center;
    align-items: center;
    /*color: #aaa;*/
    color: #ffffff;
    text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    z-index: 1001;
    /*box-shadow: 0 0 8px 1px rgba(0,0,0,0.4);*/
}





.InsiderCokiees .cc-message a, .InsiderOtherCookies .cc-message a{
    font-weight: 700;
    color: #fff;
    text-decoration: underline;
    font-size: 17px;
}

.InsiderCokiees .cc-message a:hover, .InsiderOtherCookies .cc-message a{
    text-decoration: none;
}

.InsiderCokiees .cc-compliance, .InsiderOtherCookies .cc-compliance{
   /* padding: 10px 10px 20px;*/
    padding: 0 5px;
    align-items: flex-end;
}

.InsiderCokiees .cc-compliance a, .InsiderOtherCookies .cc-compliance a{
    display: inline-block;
    font-size: 15px;
    font-weight: 700;
    text-align: center;
    white-space: nowrap;
    border-radius: 5px;
    width:101px;
    height: 45px;
    line-height: 45px;
    text-transform: uppercase;
     background: #f6a800;
    /*background-color: #19BFCC;*/
    color: #fff;
    border-color: #19BFCC;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    text-transform: uppercase;
    outline: none;
}

.InsiderCokiees .cc-compliance a:hover, .InsiderCokiees .cc-compliance a:focus, .InsiderOtherCookies .cc-compliance a:hover, .InsiderOtherCookies .cc-compliance a:focus{
    background: #f6a800;
    text-decoration: none;
    outline: none;
}

.InsiderOtherCookies{
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    position: fixed;
    left: 0;
    bottom: 0;
    right: 0;
    top: 0;
    /*padding:13px 20px;*/
    background: rgba(0,0,0,0.8);
    display: flex;
    text-align: center;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    /*color: #aaa;*/
    color: #ffffff;
    text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content:center;
    z-index: 1001;
    /*box-shadow: 0 0 8px 1px rgba(0,0,0,0.4);*/
}


.InsiderOtherCookies .dialogBox{
    width: 480px;
    margin: 0 auto;
    background: #ffffff;
    text-align: center;
    padding: 20px 20px 30px;
    border-radius: 4px;
    box-shadow:0 0 15px 5px rgba(0,0,0,0.4);
    color: #2C2E30;
}

.InsiderOtherCookies .dialogBox .header-logo {
    border-bottom: 1px solid rgba(0,0,0,0.15);
    padding: 0 0 5px;
    margin: 0 -20px 15px;
}

.InsiderOtherCookies .dialogBox .cc-compliance{
    padding: 15px 0;
}


.InsiderOtherCookies .dialogBox .cc-message a{
    color: #19bfcb;
}

@media all and (max-width:767px){
.InsiderCokiees{
    font-size: 13px;
    padding:10px 0;
}

.InsiderCokiees .cc-message, .InsiderCokiees .cc-compliance{
   /* padding:10px;*/
    padding:0 2px;
}

.InsiderCokiees .cc-compliance{
    flex-basis: 24%;
    max-width: 24%;
}

.InsiderCokiees .cc-compliance a{
    width: 65px;
    font-size: 12px;
    margin-top: 5px;
}

.InsiderCokiees .cc-message a{
    font-size: 13px;
    margin: 0 3px;
}

.InsiderCokiees .cc-message div:first-child{
    margin-bottom: 5px;
}

.InsiderOtherCookies .dialogBox {
    width: auto;
    margin: 0 15px;
}

}

/**/

.chartListing{
    padding: 0 0;
}

.chartListing ul{
    list-style: disc;
    padding:0 25px;
}

.chartListing ul li{
    padding: 10px 0;
    font-size: 15px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    color: #47525D;
    letter-spacing: 0.88px;
    line-height: normal;
}

.priceDesc{
    padding: 10px;
    font-size: 15px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    color: #5a5e60;
    letter-spacing: 0.88px;
    line-height: 24px;
}

/*Food Debates new css style 26June2018*/

#foodQuiz{
    padding:20px 10px;
    max-width: 100%;
    margin: 0 auto;
    display:block;
    border-bottom: 1px solid #c5c5c5;
}

#foodQuiz .whiteBgColumn {
    background: #ffffff;
    padding: 10px;
    margin: 0;
}

#foodQuiz .heading{
    padding:0 20px;
    text-align: center;
}

#bctSction #foodQuiz .heading h1{
        margin: 0;
    padding: 0;
    font-weight: 600;
    font-size: 35px;
    color: #2C2E30;
    letter-spacing: 1.88px;
    text-transform: uppercase;
    text-align: center;
}

#bctSction #foodQuiz .heading  p {
    font-size: 22px;
    position: relative;
    display: table;
    margin: 10px auto 0;
    padding: 10px 0 0 0;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 32px;
    font-style: italic;
    text-transform: none;
}

#foodQuiz .heading  p:before {
    background: #19BFCC;
    width: 78px;
    height: 1px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -39px;
    content: "";
}

.foodQuizQues{
    padding: 30px 0 0;
    overflow: hidden;
}

/*.foodQuizQues .items{
    padding:0;
    display: none;
}*/

.foodQuizQues .items{
    padding:0 0 30px;
    display:block !important;
}

.foodQuizQues .items h2{
    font-size: 24px;
    font-weight: 900;
    color: #19BFCC;    
    font-family: 'Lato', sans-serif;
    padding: 0;
    margin: 0 0 15px;
}

.foodQuizQues .items .select-item{
    display: flex;
    justify-content:flex-start;
    align-items:stretch;
}

.foodQuizQues .items .select-item div{
    border: 1px solid #c0c0c0;
    position: relative;
    margin: 3px;
    display: flex;
}


.foodQuizQues .items .select-item div img{
    height: 340px;
    object-fit: cover;
    display: block;
    width: 100%;
}

.foodQuizQues .items .select-item div input[type=radio]:not(old)+label{
    background:none;
    padding: 0;
    margin: 0;
}   

.foodQuizQues .items .select-item div label:hover img{
    opacity: 0.5;
    transition: all ease-in-out .30s;
    -moz-transition: all ease-in-out .30s;
    -webkit-transition: all ease-in-out .30s;
    -o-transition: all ease-in-out .30s;
}

.foodQuizQues .items .select-item div h3{
    background: rgba(255,255,255,0.9);
    padding:15px 10px;
    line-height: normal;
    text-align: center;
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    font-size: 18px;
    font-weight: 600;
    color: #2C2E30;    
    font-family: 'Lato', sans-serif;
}

.select-item-answer div.row{
    position: relative;
    margin: 10px 0;
    padding: 0;
}

#bctSction #rightSide .select-item-answer img{
    float: left;
    border: 1px solid #c0c0c0;
    height: 150px;
    width: 150px;
    object-fit: cover;
    margin: 3px;
    position: absolute;
    left: 0;
    top: 0;
}

.select-item-answer .table{
    position: relative;
    padding-left: 170px;
    display: block;
    margin: 0 0 10px;
}

.select-item-answer .table h3{
    font-size: 18px;
    font-weight: 700;
    color: #2C2E30;    
    font-family: 'Lato', sans-serif;
    margin:10px 0 30px;
}

.select-item-answer .table .progressBar{
    font-size: 35px;
    font-weight: 900;
    color: #2C2E30;    
    font-family: 'Lato', sans-serif;
    width: 100%;
    float: none;
    text-align: left;
    line-height: normal;
    border: none;
    background: none;
    margin: 0;
}

.select-item-answer .table .progressBar .bar{
    height: 40px;
    border: 1px solid #19BFCC;
    position: relative;
    display: block;
    margin:10px 0  0;
}

.select-item-answer .table .progressBar .bar span{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: auto;
    background: #19BFCC;
    transition: all ease-in-out 1s;
    -moz-transition: all ease-in-out 1s;
    -webkit-transition: all ease-in-out 1s;
    -o-transition: all ease-in-out 1s;
}

#final{
    text-align: center;
    border-top: 1px solid #cacaca;
}

#final .desc{
    font-size: 24px;
    font-weight: 300;
    line-height: 32px;
    padding: 20px 50px;
}

#final .desc span, #final .desc a{
    color: #19BFCC;
    font-weight: 900;
    display: block;
    padding: 10px;
}

a.button, button.nextstepbutton, button.submitquiz {
    border: 1px solid #f49600 !important;
    color: #ffffff !important;
    text-decoration: none  !important;
    line-height: 60px ;
    height: 60px;
    display: table !important;
    font-family: 'Lato', sans-serif;
    font-weight: 600;
    font-size: 18px;
    color: #FFFFFF !important;
    letter-spacing: 0.5px;
    z-index: 1;
    background: #f6a800 !important;
    text-align: center;
    border-radius: 6px !important;
    padding: 0 40px !important;
    margin: 20px auto !important;
    cursor: pointer !important;
    box-shadow: 0px 1px 2px rgba(0,0,0,0.3) !important;
}

button.nextstepbutton, button.submitquiz{
    line-height: 50px;
    height: 50px;
    padding: 0;
    width: 100px;
    font-size: 18px;
    font-weight: 600;
    text-transform: uppercase;
}

@media all and (max-width: 767px){

#foodQuiz{
    padding: 0;
    width: 100%;
}

#foodQuiz .whiteBgColumn{
    padding: 20px 10px;
}

#foodQuiz .heading {
    padding: 10px;
    text-align: center;
}

#bctSction #foodQuiz .heading h1{
    font-size: 22px !important;
    letter-spacing: 0.88px !important;
    margin: 0 0 10px !important;
}

#bctSction #foodQuiz .heading p{
    font-size: 18px;
    line-height: normal;
}

#foodQuiz .heading p br{
    display: none;
}

.foodQuizQues {
    padding: 10px 0 0;
    overflow: hidden;
}

.foodQuizQues .items h2 {
    font-size: 20px;
}

.foodQuizQues .items .select-item div img {
    height: 240px;
}

.foodQuizQues .items .select-item div h3{
    font-size: 14px;
    padding: 10px 0;
}

#bctSction #rightSide .select-item-answer img{
    width: 100px;
    height: 100px;
}

.select-item-answer .table{
    padding-left: 115px;
    margin-bottom: 10px;
}

.select-item-answer .table h3{
    font-size: 16px;
    margin: 0px 0 10px;
}

.select-item-answer .table .progressBar{
    font-size: 30px;
}

.select-item-answer .table .progressBar .bar{
    height: 25px;
    margin: 15px 0 0;
}

#final .desc {
    font-size: 17px;
    font-weight: 300;
    line-height: 27px;
    padding: 15px 10px;
}

#final a.button{
    font-size: 16px;
    margin: 0 auto;
}

}

@media all and (max-width: 340px){
    #final a.button{
        font-size: 15px;
        margin: 0 auto;
        padding: 0 18px;
    }
}



/*Food Debates new css style 26June2018*/

#steakQuiz .whiteBgColumn {
    background: #ffffff;
    padding: 15px;
    margin: 0;
}

#steakQuiz .discloserTxt.topText{
    display: none;
}

#steakQuiz .sponsBy{
    padding: 0;
    margin: 0 0 10px 0;
}

#steakQuiz .quizHome .quizHero img{
    width: 100%;
    height: 350px;
    object-fit: cover;
}

.quiz-splash .section-header__text{
    background-color: #e4e6eb;
    text-align: center;
    padding: 30px;
}

.quiz-splash .section-header__text h1 {
    margin: 0;
    padding: 0;
    font-weight: 600;
    font-size: 35px;
    color: #2C2E30;
    letter-spacing: 1.88px;
    text-transform: uppercase;
    text-align: center;
}

.quiz-splash .section-header__text h4 {
    margin: 0 0 30px 0;
    padding: 0;
    font-weight: 600;
    font-size: 20px;
    color: #2C2E30;
    letter-spacing: 1.88px;
    text-align: center;
}

.quiz-splash .section-header__text p {
    font-size: 22px;
    position: relative;
    display: table;
    margin: 10px auto 0;
    padding: 10px 0 0 0;
    font-weight: 300;
    letter-spacing: 0;
    line-height: 32px;
    font-style: italic;
    text-transform: none;
}

.quiz-splash .section-header__text p:before {
    background: #19BFCC;
    width: 78px;
    height: 1px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -39px;
    content: "";
}

.quiz-splash  .section-header__text-second{
    text-align: center;
    padding: 30px;
}

.quiz-splash  .section-header__text-second .desc {
    font-size: 24px;
    font-weight: 300;
    line-height: 32px;
    padding:10px;
}

.quiz-splash  .section-header__text-second .desc span {
    color: #19BFCC;
    font-weight: 900;
    display: block;
    padding: 0;
}

.quiz-splash  .section-header__text-second h5{
    font-size: 14px;
    color: #5a5e60;
}

#quiz-{}

#quiz-scroll .quiz{
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: row;
    /*align-items: flex-start;*/
    align-items: stretch;
    position: relative;
    overflow: hidden;
}

#quiz-scroll .hide {
    display: none !important;
    transition: all .3s ease-in-out;
}

#quiz-scroll .show {
    display: flex !important;
    transition: all .3s ease-in-out;
}

#quiz-scroll .quiz .question-image {
    width: 60%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding-right: 15px;
}

#quiz-scroll .quiz .question-image  h2 {
    font-size: 24px;
    font-weight: 900;
    color: #19BFCC;
    font-family: 'Lato', sans-serif;
    padding:15px;
    text-align: center;
    margin: 0 0 20px;
}

#quiz-scroll .quiz .question-image img{
    width: 100%;
    height: auto;
    object-fit: cover;
}

#quiz-scroll .quiz .question-options {
    width: 40%;
    height: calc(100% - 20px);
    max-width: none;
    display: flex;
    position: relative;
    top: 0;
    flex-flow: column;
    transition: all .5s ease-in-out;
    z-index: 1;
    padding-left: 15px;
    align-items: flex-start;
}


#quiz-scroll .quiz .question-options .choice {
    width: calc(100% - 10px);
    background-color: #f5f8f8;
    height: calc(25% - 14px);
    /*margin: 7px auto;*/
    margin: 11px auto 0;
    outline: 1px solid rgba(246,168,0, 0.5);
    border: 10px solid #ffffff;
    box-sizing: border-box;
    transition: all .5s ease-in-out;
}

#quiz-scroll .quiz .question-options .choice:hover{    
    outline: 1px solid rgba(25,190,203, 0.5);
    background: rgba(25,190,203, 0.1)
}

#quiz-scroll .quiz .question-options .choice input[type=radio] {
    position: absolute;
    top: 0;
    left: unset;
    opacity: 0;
}

#quiz-scroll .quiz .question-options .choice label{
    text-align: center;
    background: none;
    font-size: 18px;
    font-weight: 600;
    color: #47525D;
    padding: 27px;
    margin: 0;
    transition: all .25s ease-in-out;
}

#quiz-scroll .quiz .question-options.ansDone .choice label{
    padding: 20px;
    transition: all .25s ease-in-out;
}

#quiz-scroll .quiz .question-options .choice input[type=radio]:checked ~ label{
    transition: all .5s ease-in-out;
    background: #e58989;
    color: #ffffff;
}

#quiz-scroll .quiz .question-options .choice input[type=radio]:checked ~ label.correct{
    background: #fff;
    transition: all .5s ease-in-out;
    background: #b5dea4;
    color: #ffffff;
}

#quiz-scroll .quiz .question-options .heightAuto{
    height: 70px;
    overflow: hidden;
    transition: all .25s ease-in-out;
}

#quiz-scroll .quiz .question-options.ansDone .heightAuto{
    height: 120px;
    overflow: hidden;
    transition: all .25s ease-in-out;
}

#quiz-scroll .quiz .question-options .answer-options{
    width: calc(100% - 10px);
    order: 0;
    background: #fff;
    font-weight: 300;
    line-height: 1.5rem;
    padding:10px;
    margin: 0 auto 0;
    box-sizing: border-box;
    border: 2px solid rgba(0,0,0,0.15);
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    transition: all .25s ease-in-out;
    height: 0px;
    opacity: 0;
}

#quiz-scroll .quiz .question-options.ansDone .answer-options{
    transition: all .25s ease-in-out;
    height: 120px;
    opacity: 1;
}


#quiz-scroll .quiz .question-options .answer-options strong,
#quiz-scroll .quiz .question-options .answer-options span, span.gotoNext{
    font-weight: 700;
}

#quiz-scroll .quiz .question-options .answer-options span.green{
    background: url(https://static.insiderenvy.com/images/2020/01/06093459/green-x.png) 0 no-repeat;
    background-size: contain;
    display: inline-block;
    width: 25px;
    height: 22px;
    position: relative;
    top: 5px;
}

#quiz-scroll .quiz .question-options .answer-options span.red{
    background: url(https://static.insiderenvy.com/images/2020/01/06093500/red-x.png) 0 no-repeat;
    background-size: contain;
    display: inline-block;
    width: 25px;
    height: 22px;
    position: relative;
    top: 5px;
}

#quiz-scroll .quiz .question-options .answer-options a.gotoNext{
    width: auto;
    height: auto;
    top: 0;
    cursor: pointer;
    padding-left: 3px;
    display: inline-block;
    animation-delay: 2.5s;
    animation-iteration-count: 3;
    -webkit-animation-delay: 2.5s;
    -webkit-animation-iteration-count: 3;
    font-weight: 700;
    color: #0f346c;
    text-decoration: none;
}


#final-quiz{}

#final-quiz .quizHero{
    position: relative;
    background: #000000;
}

#final-quiz .quizHero img{
    width: 100%;
    height: 350px;
    object-fit: cover;
    opacity: 0.8;
}

#final-quiz .finalDesc{
    padding: 30px 15px;
    text-align: center;
}

#final-quiz .finalDesc h1, .correctQuiz h2{
    font-size: 24px;
    color: #19BFCC;
    font-weight: 900;
    display: block;
    padding: 10px;
}

#final-quiz .finalDesc p{
    font-size: 20px;
    font-weight: 300;
    line-height: 32px;
    padding: 20px 50px;
}


.correctQuiz {
    position: absolute;
    text-align: center;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.correctQuiz h2{
    color: #ffffff;
    margin: 0;
    padding: 0;
    line-height: 32px;
    font-size: 30px;
}

.correctQuiz p{
    color: #ffffff;
    font-size: 20px;
    font-weight: 400;
    line-height: 32px;
}

.stepOf{
    background-color: #f5f8f8;
    text-align: center;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: 1px;
    padding: 10px;
    margin: 0 0 10px
}

.shortTxt {
    font-size: 13px;
    text-align: center;
    opacity: 0.7;
    margin:-10px 0 20px;
}

@media all and (max-width: 990px){

#steakQuiz .quizHome .quizHero img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.quiz-splash .section-header__text{
    padding: 15px;
}

.quiz-splash .section-header__text h4{
    font-size: 18px;
    margin: 0 0 15px;
}

.quiz-splash .section-header__text h1{
    font-size: 25px;
}

.quiz-splash .section-header__text p{
    font-size: 16px;
}

.quiz-splash .section-header__text-second {
    text-align: center;
    padding: 15px;
}

.quiz-splash .section-header__text-second .desc {
    font-size: 18px;
    font-weight: 300;
    line-height: 32px;
    padding: 0;
}

#quiz-scroll .quiz .question-image h2{
    padding: 0;
}

#quiz-scroll .quiz .question-options .choice{
    border: 5px solid #ffffff;
    width: calc(100% - 2px)
}

#quiz-scroll .quiz .question-options .choice label, #quiz-scroll .quiz .question-options.ansDone .choice label{
    padding:10px 15px;
    font-size: 17px;
}

#quiz-scroll .quiz .question-options .heightAuto{
    height: 0;
}

#quiz-scroll .quiz .question-options.ansDone .heightAuto, #quiz-scroll .quiz .question-options.ansDone .answer-options{
    font-size: 14px;
    width: 100%;
}

#quiz-scroll .quiz{
    flex-direction: column;
}

#quiz-scroll .quiz .question-image, #quiz-scroll .quiz .question-options{
    width: 100%;
    margin: 0 0 15px;
    padding: 0;
}

#final-quiz .quizHero img{
    height: auto;
    max-height: 250px;
}

.correctQuiz h2{
    font-size: 24px;
}

.correctQuiz p{
    font-size: 16px;
}

#final-quiz .finalDesc{
    padding: 15px 0;
}

#final-quiz .finalDesc p {
    font-size: 16px;
    font-weight: 300;
    line-height: 25px;
    padding: 10px;
}

#steakQuiz a.button, a.button{
    font-size: 16px;
    padding: 0 22px;
}


}

/*steakQuiz Css*/

/*Ingredients Quiz Css*/

#ingredientsQuiz .whiteBgColumn {
    background: #ffffff;
    padding: 15px;
    margin: 0;
}


#ingredientsQuiz .whiteBgColumn .sponsBy{
    margin: 0;
}

#ingredientsQuiz .whiteBgColumn .discloserTxt.topText{
    display: none;
}

#ingredientsQuiz .quizHome{
    position: relative;
}

#ingredientsQuiz .quizHome img{
    width: 100%
}

#ingredientsQuiz .quizHome .quizFrame{
    flex-direction: column;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

#ingredientsQuiz .quizHome .quizFrame h1{
    font-family: 'Lato', sans-serif;
    font-size: 32px;
    line-height: normal;
    font-weight: 600;
    color: #2C2E30;
    letter-spacing: 1px;
    text-align:left;
    padding:0;
    margin: 0 0 30px;
    position: relative;
}


#ingredientsQuiz .quizHome .quizFrame h3{
    color: #19BFCC;
    font-weight: 900;
    display: block;
    padding: 0;
    margin: 0 0 30px;
    font-family: 'Lato', sans-serif;
    font-size: 24px;
    text-align: left;
    font-style: normal;
}

#ingredientsQuiz .quizHome .quizFrame p{
    font-size: 18px;
    font-weight: 600;
    line-height: 24px;
    margin: 0 0 30px;
    max-width: 90%;
}


#ingredientsQuiz .quiz-ver3 .quizHome .quizFrame h1, #ingredientsQuiz .quiz-ver3 .quizHome .quizFrame p{
    color: #ffffff;
}

#ingredientsQuiz .quizHome .quizFrame a.button{
    margin:0;
    width: 200px;
}

#ingredientsQuiz #quiz-scroll{
    overflow: hidden;
    width: 100%;
}

.ingredientsDesc {
    min-height: 100%;
    width: 100%;
    position: relative;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    padding: 20px 0;
}

.ingredientsDesc .card-option {
    position: relative;
    /*max-width: 35vh;
    max-height: 35vh;*/
    max-width: 31.33%;
    max-height: inherit;
    border-radius: 10px;
    margin: 10px;
    box-sizing: content-box;
    box-shadow: 0 0 6px 1px #c7c7c7;
}

.ingredientsDesc .card-option .card-image {
    width: 100%;
    height: 100%;
    position: relative;
    display: inline-block;
    border-radius: 10px;
}

.ingredientsDesc .card-option .card-image img {
    width: 100%;
    height: 100%;
    border-radius: 10px;
}

.ingredientsDesc .card-option .card-image p, .ingredientsDesc .card-option .card-image div.qdesc {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    padding:30px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    font-size: 26px;
    line-height: 32px;
    font-weight:700;
    background: hsla(0,0%,100%,.8);
    display: none;
}

.ingredientsDesc .card-option .card-image:hover p, .ingredientsDesc .card-option .card-image:hover div.qdesc{display:flex;cursor:pointer}

.ingredientsDesc .card-option .text {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    position: absolute;
}

.ingredientsDesc .card-option .text h4 {
    color: #19BFCC;
    font-size: 20px;
    text-align: center;
    padding: 0 6px;
    font-weight: 700;
    margin: 0 0 10px;
}

.ingredientsDesc .card-option .text p {
    font-size: 16px;
    margin: 0 20px 20px;
    color: #2C2E30;
    text-align: center;
    line-height: 24px;
}

.ingredientsDesc .card-option .text h2 {
    font-size: 24px;
    color: #2C2E30;
    font-weight: 700 !important
}


.ingredientsDesc .card-option .winner {
    position: absolute;
    bottom: 0;
}

.ingredientsDesc .card-option .winner h3 {
    color: #00a682;
}

.ingredientsDesc .card-option .winner h4 {
    margin: 5px 0 0;
}

.ingredientsDesc .card-option .winner h5 {
    font-size: 16px;
    margin: 0 20px;
    color: #2C2E30;
    text-align: center;
    line-height: 24px;
}

.ingredientsDesc .card-option .winner a.button{
    opacity: 0;
     transition: all ease-in-out 2s;
    -moz-transition: all ease-in-out 2s;
    -webkit-transition: all ease-in-out 2s;
    -o-transition: all ease-in-out 2s;
}

.ingredientsDesc .card-option .winner.show a.button{
    opacity: 1;
     transition: all ease-in-out 2s;
    -moz-transition: all ease-in-out 2s;
    -webkit-transition: all ease-in-out 2s;
    -o-transition: all ease-in-out 2s;
}


.quiz-ver3 .ingredientsDesc .card-option .winner h2{
    margin: 0 0 5px;
}

.quiz-ver3 .ingredientsDesc .card-option .winner h4{
    margin: 5px 10px;
    line-height: normal;
}

.quiz-ver3 .ingredientsDesc .card-option .winner h5{
    line-height: 20px;
}

.quiz-ver3 .ingredientsDesc .card-option .winner a.button{
    letter-spacing: 2px;
    padding: 0 20px;
    height: 54px;
    line-height: 54px;
    margin: 10px 0;

}

@media all and (max-width:990px){

.ingredientsDesc .card-option{
    max-width: 46%;
}    

}

@media all and (max-width:767px){
#ingredientsQuiz .whiteBgColumn{
    padding: 0;
}

#ingredientsQuiz .quizHome{
    background:url(https://static.insiderenvy.com/store/images/ingredients-quiz/tomatillo.gif)  90% 220%/260% no-repeat;
    min-height: 75vh;
}

#ingredientsQuiz .quiz-ver3 .quizHome{
    background:url(https://static.insiderenvy.com/store/images/ingredients-quiz/quiz-3/main-img.jpg) no-repeat center center;
    background-size: auto 100%;
    min-height: 75vh;
}


#ingredientsQuiz .quiz-ver2 .quizHome{
    background:url(https://static.insiderenvy.com/store/images/ingredients-quiz/quiz-v2/main-img.jpg)  87% 220%/320% no-repeat;
    min-height: 75vh;
}


#ingredientsQuiz .quizHome img{
    display: none;
}

#ingredientsQuiz .quizHome .quizFrame{
    position: relative;
    padding:60px 15px 40px;
}

#ingredientsQuiz .quizHome .quizFrame h1{
    font-size: 25px;
    line-height: 35px;
}

#ingredientsQuiz .quizHome .quizFrame h3{
    font-size: 20px;
    line-height: normal;
}

.ingredientsDesc{
    padding: 5px;
}

.ingredientsDesc .card-option{
    max-width: 46.50%;
    margin:10px 5px;
}
 
.ingredientsDesc .card-option .card-image p, .ingredientsDesc .card-option .card-image div.qdesc{
    position: absolute;
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    padding: 5px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    font-size: 14px;
    line-height: normal;
    font-weight: 700;
    background: hsla(0,0%,100%,.8);
        height: 50px;
}

.ingredientsDesc .card-option .text h4{
    font-size: 13px;
    margin-bottom: 5px;
}

.ingredientsDesc .card-option .text p, .ingredientsDesc .card-option .winner h5{
    font-size: 11px;
    line-height: normal;
    margin:0 5px 5px;
    max-height: 80px;
    overflow: hidden;
    letter-spacing: 0.5px;
}

.ingredientsDesc .card-option .text h2{
    font-size: 12px;
    margin: 0;
    line-height: normal;
}

.ingredientsDesc .card-option .winner h5{
    max-height: 52px;
    overflow: hidden;
    margin:0 5px 10px;
}

.ingredientsDesc .card-option .text.winner a.button{
    padding: 0 10px;
    font-size: 12px;
    height: 30px;
    line-height: 30px;
    margin: 0;
    letter-spacing: 0.5px;
}

#ingredientsQuiz .whiteBgColumn .sponsBy{
    margin: 0;
    padding: 15px 0 12px 15px;
}


.quiz-ver3 .ingredientsDesc .card-option .winner h2{
    margin: 0;
}

.quiz-ver3 .ingredientsDesc .card-option .winner h4{
    margin: 5px;
    line-height: normal;
}

.quiz-ver3 .ingredientsDesc .card-option .winner h5{
    line-height: normal;
}

.quiz-ver3 .ingredientsDesc .card-option .winner a.button{
    padding: 0 10px;
    font-size: 12px;
    height: 30px;
    line-height: 30px;
    margin: 0;
    letter-spacing: 0.5px;
}


}

@media all and (max-width:375px){

#ingredientsQuiz .quizHome{
    background:url(https://static.insiderenvy.com/store/images/ingredients-quiz/tomatillo.gif)  90% 220%/250% no-repeat;
    min-height: 75vh;
}

#ingredientsQuiz .quizHome .quizFrame{
    position: relative;
    padding:30px 5px 40px;
}

}

/*Ingredients Quiz Css*/

.debatesPopup, .quizSpotPopup{
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(220,220,220,0.7);
    left: 0;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
}

.quizSpotPopup{
    z-index: 5;
}


.popupBox, .quizSpotBox{
    background: #ffffff;
    box-shadow: 0 0 8px rgba(0,0,0,0.5);
    width: 700px;
    padding: 30px;
    text-align: center;
}

.quizSpotBox{
    padding: 40px 50px 30px;
    border-radius:4px;
    width: 780px;
}

.popupBox h2, .quizSpotBox h2 {
    font-size: 24px;
    font-weight: 900;
    color: #19BFCC;
    font-family: 'Lato', sans-serif;
    padding: 0;
    margin:0px 0 5px;
}

.quizSpotBox h2{
    font-size: 30px;
    font-weight: 700;
    margin:0px 0 30px;
}

.popupBox h3, .quizSpotBox h3{
    line-height: normal;
    text-align: center;
    font-size: 17px;
    letter-spacing: 1.2px;
    opacity: 0.7;
    font-weight: 500;
    color: #2C2E30;
    font-family: 'Lato', sans-serif;
    margin: 0 0 20px;
    line-height: 30px
}


.quizSpotBox h3{
    font-size: 30px;
    font-weight: 700;
    color: #2d2e30;
    opacity: 1;
}

.quizSpotBox h3 span{
    display: block;
    text-transform: uppercase;
    margin-bottom: 15px;
}

.popupBox p, .quizSpotBox p{
    line-height: normal;
    text-align: center;
    font-size: 19px;
    font-weight: 500;
    color: #2C2E30;
    font-family: 'Lato', sans-serif;
    margin: 0 0 20px;
    padding: 0 30px;
    line-height: 30px
}

.quizSpotBox p{
    padding: 0;
    line-height: 38px;
    opacity: 0.7;
}

.popupBox p strong{
    display: block;
    color: #19BFCC;
     font-weight: 500;
}

.debatesloader, .quizSpotLoader{
    min-height: 352px;
    display: flex;
    justify-content: center;
    align-items: center;
}


@media all and (max-width: 767px){

.popupBox{
    width: 90%;
    padding: 20px 15px;
}

.popupBox h2{
    line-height: 30px;
    font-size: 22px;
    margin-bottom: 10px;
}

.popupBox h3{
    font-size: 15px;
    line-height: normal;
}

.popupBox p {
    font-size: 15px;
    padding: 0 0px;
    line-height: 24px;
}

.quizSpotBox{
    width: 90%;
    padding: 30px 15px 20px;
}

.quizSpotBox h2{
    font-size: 26px;
}

.quizSpotBox p{
    font-size: 16px;
    line-height: 26px;
}


}

@media all and (max-width: 350px){
.popupBox{
    width: 90%;
    padding: 15px;
}

.popupBox a.button {
    font-size: 16px;
        padding: 0 16px;
}

.popupBox h2 {
    line-height: 24px;
    font-size: 18px;
}

.popupBox p, .popupBox h3 {
    font-size: 14px;
        margin: 0 0 15px;
}

}

/***EYEs BALL JAR CSS************/

#rightSide .article-header .eyeballsContest h1{
    margin: 10px 0 0;
    padding: 0;
    font-size: 30px;
    line-height: normal;
}

.eyeballsContest #final{
    border: none;
    padding-top: 0;
}

.eyeballsContest .contestImg{
    text-align: center;
    margin: 0 0 20px;
    padding: 10px;
}

.contestDesc{
    font-size: 24px;
    font-weight: 300;
    line-height: 32px;
    padding: 20px 20px;
}

.contestDesc strong{
    font-weight: 400;
    display: block;
}

.contestForm{
        padding-bottom: 15px;
        margin-bottom: 15px;
        text-align: center;
}

.contestForm label{
    font-size: 20px;
    color: #19BFCC;
    font-weight: 600;
    display: inline-block;
    padding: 10px;
}

.contestForm input.form-control{
    display: inline-block;
    height: 40px;
    line-height: 40px;
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 16px;
    border: 1px solid #B7BBC0;
    max-width: 90px;
    width: 100%;
    margin: 0 auto;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

#final .contestForm a.button{
    width: auto;
    padding: 0 30px;
    text-transform: uppercase;
}


@media all and (max-width: 767px){

#rightSide .article-header .eyeballsContest h1{
    font-size: 20px;
    margin: 10px 0 20px !important;
}

.eyeballsContest .contestImg img{
    max-width: 100%;
    height: 260px;
}

.contestDesc{
    font-size: 17px;
    font-weight: 300;
    line-height: 27px;
    padding: 15px 10px;
}

.contestForm label {
    font-size: 16px;
    padding: 10px 5px;
}


#final .contestForm a.button{
    margin: 10px auto;
    padding: 0 25px;
}

.eyeballsContest .contestImg{
    padding: 0 10px;
}

}

/***EYEs BALL JAR CSS************/


/*****Keratitis Quiz ****************************/

#kQuiz .ingredientsDesc{ overflow: hidden; }

#kQuiz .ingredientsDesc .card-option{
    max-width: 47.5%;
    width: 47.5%;
    box-shadow: none;
    margin: 5px;
}

#kQuiz .ingredientsDesc .card-option .card-image{
    height: 165px;
}

#kQuiz .ingredientsDesc .card-option .card-image div.qdesc{
    display: flex;
    color: #ffffff;
    letter-spacing: 2px;
    background: #19bfcb;
    border-radius: 5px;  
    border: 1px solid #19bfcb;
}

#kQuiz .ingredientsDesc .card-option .text{
    background: #f5f8f8;
    width: 100%;
    border-radius: 5px;
    border:1px solid rgba(0,0,0,0.15);
}

#kQuiz .ingredientsDesc .card-option .text.show{
    display: flex !important;
}

#kQuiz .ingredientsDesc .card-option .text h2{
    font-size: 20px;
    text-align: center;
    margin: 0;
}

#kQuiz .ingredientsDesc .card-option .text h4{
    font-size: 16px;
    font-weight: 500;
    line-height: normal;
    margin: 0;
    padding:8px 10px;
}

#kQuiz .ingredientsDesc .card-option .text h5{
    margin: 0 0 10px;
    font-weight: 700;
}

#kQuiz .ingredientsDesc .card-option .text a.button{
    line-height: 48px;
    height: 48px;
    margin: 0;
    font-size: 16px;
    text-transform: uppercase;
}

@media all and (max-width: 767px){
    #kQuiz .ingredientsDesc .card-option .card-image div.qdesc{
        height: 100%;
        font-size: 20px;
    }

    #kQuiz .ingredientsDesc .card-option .text h4 {
        font-size: 16px;
        margin: 0;
        padding: 10px 10px;
    }

    #kQuiz .ingredientsDesc .card-option .winner.show a.button {
        line-height: 42px;
        height: 42px;
        margin: 0;
        padding: 0 20px;
        font-size: 16px;
    }
}

@media all and (max-width: 767px) and (orientation: portrait){

#kQuiz .ingredientsDesc {
    overflow: hidden;
    padding: 0;
}

#kQuiz .ingredientsDesc .card-option {
    max-width: 100%;
    width: 100%;
    box-shadow: none;
    margin: 3px;
}

#kQuiz .ingredientsDesc .card-option .card-image {
    height: 130px;
}


#kQuiz .ingredientsDesc .card-option .text h4 {
    font-size: 14px;
    margin: 0;
    padding: 5px 20px;
}

#kQuiz .ingredientsDesc .card-option .text a.button {
    line-height: 40px;
    height: 40px;
    padding: 0 15px;
    font-size: 14px;
}

#kQuiz .ingredientsDesc .card-option .text h2 {
    font-size: 18px;
}

}

/*****Keratitis Quiz **************************/

/***Buzz Feed Quiz **************************/

#buzzfeedQuiz{}

#buzzfeedQuiz .buzz-img{
    width: 100%;
    margin: 0 0 20px;

}

#buzzfeedQuiz .buzz-img img {
    max-width: 100%;
    height: 260px;
    width: 100%;
    object-fit: cover;
}

.buzz-quiz .buzzList{
    border: 1px solid rgba(0,0,0,.1);
    cursor: pointer;
    margin: 0 0 10px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding:0;
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.25s ease-in-out;
}

.buzz-quiz .buzzList:hover{
    transition: all 0.25s ease-in-out;
    box-shadow: 0 0 3px 3px rgba(173, 168, 168, .1);
}

.buzz-quiz .buzzList input{
    display: none;
}

.buzz-quiz .buzzList label{
    position: relative;
    line-height: 22px;
    cursor: pointer;
    font-size: 18px;
    transition: all 0.25s ease-in-out;
    width: 100%;
    padding:15px 10px;
}

.buzz-quiz .buzzList:hover label{
    font-size: 18.5px;
    transition: all 0.25s ease-in-out;
}

.buzz-quiz .buzzList input[type=checkbox]:checked ~ label{
    color: #19BFCC;
    transition: all 0.25s ease-in-out;
}

.buzz-quiz .buzzList label:before{
    border: 2px solid #ccc;
    border-radius: 3px;
    width: 24px;
    height: 24px;
    position: relative;
    content: "";
    float: left;
    margin: 0 10px 0 0;
     transition: all 0.25s ease-in-out;
}

.buzz-quiz .buzzList input[type=checkbox]:checked ~ label:before{
    background: #19BFCC url(../images/tick-white.png) no-repeat center center;
    background-size: 80%;
    border: 2px solid #19BFCC;
     transition: all 0.25s ease-in-out;
}

.buzzInfo{
    font-size: 16px;
    font-weight: 500;
    line-height: 25px;
    color: #5A5E60;
    text-align: center;
}

.buzzInfo strong{
    font-weight: 700;
}

#buzzfeedQuiz p a.button{
    color: #ffffff;
}

#buzzfeedQuiz #quizTemp .quizBox {
    width: auto;
    margin: 20px auto;
}

#buzzfeedQuiz .quizHeading {
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #FFFFFF;
    letter-spacing: 0;
    display: flex;
    align-items: center;
}

#quizTemp .quizBox a.quizRetake {
    font-family: 'Lato', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #FFFFFF;
    letter-spacing: 0;
    display: flex;
    align-items: center;
    text-decoration: none;
}

#quizTemp .quizRetake .fa {
    font-size: 18px;
    margin: 0 10px 0 0;
}

#quizTemp .quizBox a.btn-nSeg, #quizTemp a.btn-nSeg.btnWatch {
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    font-weight: inherit;
    padding: 0 20px;
    width: auto;
    margin: 15px 0;
}

@media all and (max-width: 768px){
    #quizTemp .quizBox {
        width: auto!important;
        margin: 0 -20px 30px!important;
        padding: 10px 15px 15px!important;
    }
    #quizTemp .quizBox .quizBoxMid img {
        float: right;
        margin: 20px 0;
        width: 100% !important;
        height: auto;
        max-height: 200px;
        object-fit: cover;
    }
    #quizTemp .quizBox .quizBoxMid h4{
        margin: 0 !important;
    }
}

@media all and (max-width: 767px){
    #quizTemp .quizBox a.quizRetake.visible-xs {
        display: table !important;
        margin: 10px auto 0;
    }
}


/***Buzz Feed Quiz **************************/


/*** SPOT QUIZ******************************************/

#spotQuiz .quizHome{
    position: relative;
}

/*#spotQuiz .quizHome .quizFrame{
    flex-direction: column;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 130px;
    left: 50%;
    margin-left: -330px;
    width: 660px;
    height: 220px;
    background: #f2f2f2;
    text-align: center;
    padding: 30px;
}
*/

#spotQuiz .quizHome .quizFrame{
    flex-direction: column;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: 0;
}

#spotQuiz .quizHome .quizFrame .cFrame{
    width: 660px;
    height: 220px;
    background: #f2f2f2;
    text-align: center;
    padding: 30px;
    position: relative;
    margin-top: 130px;
    margin-bottom: 30px;
    display: block;
}

#spotQuiz .quizHome .quizFrame .cFrame:after{
    position: absolute;
    top: -12px;
    left: -12px;
    right: -12px;
    bottom: -12px;
    border: 1px solid #18c0cd;
    content: "";
}



#spotQuiz .quizHome .quizFrame h1{
    font-size: 28px;
    font-weight: 700;
    line-height: 48px;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 0;
    margin: 0 0 30px 0;
}

#spotQuiz .quizHome .quizFrame h3{
    color: #18c0cd;
    font-style: normal;
    font-size: 18px;
    font-weight: 700;
    line-height: normal;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 0;
    margin: 0;
}

#spotQuiz .quizHome .quizFrame a.button, .quizSpotPopup .quizSpotContent a.button{
    border: 1px solid #18c0cd;
    background: #18c0cd;
    min-width: 300px;
}

.quizSpotPopup .quizSpotContent a.button{
    text-transform: uppercase;
    letter-spacing: 1px;
}

#spotQuiz .spotDesc h2{
    text-align: center;
    font-size: 24px;
    font-weight: 500;
    line-height: 48px;
    padding:40px 0;
    margin:0;
}

.quizColumn{
    margin: 0 0 40px;
}

.quizColumn .tabing{
    position: relative;
    margin: 0 10px;
}


.quizColumn .tabing .circleSpot{
    width: 67px;
    height: 67px;
    position: absolute;
    left: 0;
    top: 0;
    border: 3px solid transparent;
    border-radius: 100%;
    opacity: 0;
    cursor: pointer;
    transition: all 0.30s ease-in-out;
}

.quizColumn .tabing .circleSpot.selected{
    opacity: 1;
}

.quizColumn .tabing .circleSpot.right{
    border: 3px solid #41df00;
}


/*.quizColumn .tabing .circleSpot.wrong{
    border: 3px solid #df0000;
}*/


.quizColumn .tabing .circleSpot.wrong{

}

.quizColumn .tabing .circleSpot.wrong:after{
    background: #df0000;
    width: 32px;
    height: 4px;
    position: absolute;
    left: -3px;
    top: 7px;
    content: "";
    transform: rotate(45deg) scale(1);
    transition: all 0.30s ease-in-out;
}

.quizColumn .tabing .circleSpot.wrong:before{
    background: #df0000;
    width: 32px;
    height: 4px;
    position: absolute;
    left: -3px;
    top: 7px;
    content: "";
    transform: rotate(-45deg) scale(1);
    transition: all 0.30s ease-in-out;
}


.quizColumn .tabing .circleSpot.tab1{left: 75px; top: 12px}
.quizColumn .tabing .circleSpot.tab2{left: 148px; top: 92px}
.quizColumn .tabing .circleSpot.tab3{left: 0; top: 268px}
.quizColumn .tabing .circleSpot.tab4{left: auto; right: 0; top: 135px}

.quizColumn .tabing .circleSpot.tab5{left: 250px; top: 35px}
.quizColumn .tabing .circleSpot.tab6{left: 75px; top: 140px}
.quizColumn .tabing .circleSpot.tab7{left: 170px; top: 155px}
.quizColumn .tabing .circleSpot.tab8{left: auto; right: 45px; top: 35px}

.spotResult{
    position: fixed;
    bottom: 0;
    padding: 25px 0;
    background: #f6f7f9;
    box-shadow: 0 0 5px rgba(0,0,0,0.2);
    left: 0;
    width: 100%;
    z-index: 3;
}

body.us_zone .spotResult{
    bottom: 70px;
}

@media all and (max-width: 990px){
    body.us_zone .spotResult {
        bottom: 90px;
    }
}

@media all and (max-width: 767px){
    body.us_zone .spotResult {
        bottom: 75px;
    }
}

.spotResult .container{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.spotResult .container .col{
     display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 0 15px;
}

.spotResult .container .col label{
    color: #18c0cd;
    font-style: normal;
    font-size: 20px;
    font-weight: 900;
    line-height: normal;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 0 5px;
    margin: 0;
}

.spotResult .container .col .timer, .spotResult .container .col .score{
    color: #f8a906;
    font-style: normal;
    font-size: 20px;
    font-weight: bold;
    line-height: normal;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 0;
    margin: 0;
}

.spotResult .container .col .checked{
    width: 18px;
    height: 18px;
    text-align: center;
    border: 1px solid #2d2e30;
    margin: 0 5px;
    position: relative;
}

.spotResult .container .col .checked:after{
    background: #fca500;
    width: 22px;
    height: 2px;
    position: absolute;
    left: -3px;
    top: 7px;
    content: "";
    transform: rotate(45deg) scale(0);
    transition: all 0.30s ease-in-out;
}

.spotResult .container .col .checked:before{
    background: #fca500;
    width: 22px;
    height: 2px;
    position: absolute;
    left: -3px;
    top: 7px;
    content: "";
    transform: rotate(-45deg) scale(0);
    transition: all 0.30s ease-in-out;
}

.spotResult .container .col .checked.selected:after{
    transform: rotate(45deg) scale(1);
    transition: all 0.30s ease-in-out;
}

.spotResult .container .col .checked.selected:before{
    transform: rotate(-45deg) scale(1);
    transition: all 0.30s ease-in-out;
}

#spotQuiz .quizSpotBox h3{
    font-size: 28px;
    line-height: 36px;
}

#spotQuiz .quizSpotBox h3 span.resultPractice{
    font-size: 28px;
    line-height: 36px;
    font-weight: 500;
    text-transform: initial;
}

#spotQuiz .quizSpotBox h3 strong{
    font-weight: 900;
}

#spotQuiz a.try_again {
    font-style: italic;
    color: #2d2e30;
    text-decoration: underline;
}
#spotQuiz a.try_again:hover{
    color: #23527c;
}

#spotQuiz .topText{display: none;}
#spotQuiz .sponsBy{margin-top: 5px}
#spotQuiz .spotDesc h2{padding-top:0px; }

@media all and (max-width: 1024px){
    #spotQuiz .quizColumn .tabing .circleSpot {
        width: 50px;
        height: 50px;
    }
    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 68px;
        top: 15px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 130px;
        top: 84px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 230px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 115px;
    }
}

@media all and (max-width: 900px){
    #spotQuiz .quizColumn .tabing .circleSpot {
        width: 40px;
        height: 40px;
    }
    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 51px;
        top: 11px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 96px;
        top: 62px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 175px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 90px;
    }

    #spotQuiz .quizSpotPopup .quizSpotContent a.button{
        height: 40px;
        line-height: 40px;
        margin: 10px auto;
    }
    .quizColumn .tabing .circleSpot.wrong:after, .quizColumn .tabing .circleSpot.wrong:before{
        width: 28px;
    }

    #spotQuiz .quizHome .quizFrame .cFrame {
        margin-top: 50px;
    }
}

@media all and (max-width: 900px) and (orientation:landscape){
    #spotQuiz .quizSpotBox h2 {
        font-size: 20px;
        line-height: 26px;
        margin-bottom: 5px;
    }

    #spotQuiz .quizSpotBox h3 span.resultPractice, #spotQuiz .quizSpotBox h3 {
        font-size: 18px;
        line-height: 24px;
        margin-bottom: 5px;
    }

    #spotQuiz .quizSpotBox h3 span {
        margin-bottom: 5px;
    }

    #spotQuiz .quizSpotBox p {
        font-size: 14px;
        line-height: 24px;
        margin-bottom: 5px;
    }
}

@media all and (max-width: 667px) and (orientation:landscape){
    #spotQuiz .quizSpotBox h2 {
        font-size: 18px;
        line-height: 22px;
        margin-bottom: 5px;
    }

    #spotQuiz .quizSpotBox h3 span.resultPractice, #spotQuiz .quizSpotBox h3 {
        font-size: 16px;
        line-height: 20px;
        margin-bottom: 5px;
    }

    #spotQuiz .quizSpotBox h3 span {
        margin-bottom: 5px;
    }

    #spotQuiz .quizSpotBox p {
        font-size: 12px;
        line-height: 16px;
        margin-bottom: 5px;
    }
    #spotQuiz .quizSpotPopup .quizSpotContent a.button {
        height: 30px;
        line-height: 30px;
        margin: 10px auto;
    }
    #spotQuiz .quizSpotBox {
        margin-top: 35px;
    }
}

@media all and (max-width: 413px) and (orientation:portrait){
    #spotQuiz .quizSpotBox h2 {
        font-size: 20px;
        line-height: 26px;
        margin-bottom: 5px;
    }

    #spotQuiz .quizSpotBox h3 span.resultPractice, #spotQuiz .quizSpotBox h3 {
        font-size: 18px;
        line-height: 24px;
        margin-bottom: 5px;
    }

    #spotQuiz .quizSpotBox h3 span {
        margin-bottom: 5px;
    }

    #spotQuiz .quizSpotBox p {
        font-size: 14px;
        line-height: 24px;
        margin-bottom: 5px;
    }
}

@media all and (max-width: 768px){
    #spotQuiz .quizSpotBox {
        padding: 20px 15px 10px;
        width: 95%;
    }

    #spotQuiz .quizColumn .tabing .circleSpot {
        width: 40px;
        height: 40px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 46px;
        top: 7px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 90px;
        top: 58px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 160px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 85px;
    }
}

@media all and (max-width: 767px){
    #spotQuiz .quizHome img{
        min-height: 380px;
        object-fit: cover;
    }

    #spotQuiz .quizHome .quizFrame{
        width: auto;
        top: 30px;
        bottom: 20px;
        left: 10px;
        right: 10px;
    }

    #spotQuiz .quizHome .quizFrame .cFrame{
        width: 90%;
        margin: 0;
        height: auto;
        padding:20px 15px;
    }

    #spotQuiz .quizHome .quizFrame .cFrame:after {
        position: absolute;
        top: -5px;
        left: -5px;
        right: -5px;
        bottom: -5px;
        border: 1px solid #18c0cd;
        content: "";
    }

    #spotQuiz .quizHome .quizFrame h1{
        font-size: 20px;
        line-height: 30px;
        margin: 0 0 10px;
    }

    #spotQuiz{
        background: #ffffff;
    }

    #spotQuiz .whiteBgColumn{
        padding: 0px;
    }

    #spotQuiz .spotDesc h2{
        font-size: 18px;
        line-height: 24px;
        padding: 20px 0px;
    }

    #spotQuiz .spotResult .container .col{
        padding: 0 5px;
    }

    #spotQuiz .spotResult .container .col label{
        font-size: 14px;
        padding: 0 5px;
    }

    #spotQuiz .spotResult .container .col .timer, .spotResult .container .col .score{
        font-size: 14px;
    }

    #spotQuiz .spotResult .container .col .checked {
        width: 16px;
        height: 16px;
    }

    #spotQuiz .spotResult .container .col .checked:before {
        background: #fca500;
        width: 16px;
        height: 2px;
        left: -1px;
        top: 6px;
    }

    #spotQuiz .spotResult .container .col .checked:after {
        background: #fca500;
        width: 16px;
        height: 2px;
        left: -1px;
        top: 6px;
    }

    #spotQuiz .quizColumn {
        margin: 0 0 20px;
    }

    #spotQuiz .quizColumn .tabing {
        position: relative;
        margin: 10px 0px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot {
        width: 74px;
        height: 74px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 108px;
        top: 25px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 205px;
        top: 130px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 350px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 185px;
    }
}

@media all and (max-width: 667px){
    #spotQuiz .spotDesc h2{
        font-size: 14px;
        line-height: 20px;
        padding: 20px 0px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot {
        width: 70px;
        height: 70px;
    }
    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 96px;
        top: 20px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 182px;
        top: 115px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 325px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 165px;
    }
}

@media all and (max-width: 568px){
    #spotQuiz .quizColumn .tabing .circleSpot {
        width: 60px;
        height: 60px;
    }
    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 80px;
        top: 16px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 152px;
        top: 100px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 270px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 135px;
    }
}

@media all and (max-width: 414px){
    #spotQuiz .quizColumn .tabing .circleSpot {
        width: 40px;
        height: 40px;
    }
    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 58px;
        top: 15px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 110px;
        top: 70px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 190px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 100px;
    }
}

@media all and (max-width: 375px){
    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 50px;
        top: 9px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 95px;
        top: 60px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 170px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 85px;
    }
}

@media all and (max-width: 360px){
    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 47px;
        top: 9px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 91px;
        top: 57px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 160px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 80px;
    }
}

@media all and (max-width: 350px){
    #spotQuiz .quizHome .quizFrame h1{
        font-size: 17px;
        line-height: 28px;
        margin: 0 0 10px;
    }

    #spotQuiz .quizHome .quizFrame a.button, .quizSpotPopup .quizSpotContent a.button{
        min-width: 200px;
    }

    #spotQuiz .spotResult .container .col{
        padding: 0px;
    }

    #spotQuiz .spotResult .container .col label{
        font-size: 12px;
        padding: 0 5px;
    }

    #spotQuiz .spotResult .container .col .timer, .spotResult .container .col .score{
        font-size: 12px;
    }

    #spotQuiz .spotResult .container .col .checked {
        width: 14px;
        height: 14px;
    }

    #spotQuiz .spotResult .container .col .checked:before {
        background: #fca500;
        width: 14px;
        height: 2px;
        left: -1px;
        top: 5px;
    }

    #spotQuiz .spotResult .container .col .checked:after {
        background: #fca500;
        width: 14px;
        height: 2px;
        left: -1px;
        top: 5px;
    }
}

@media all and (max-width: 320px){
    #spotQuiz .quizColumn .tabing .circleSpot.tab1 {
        left: 38px;
        top: 4px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab2 {
        left: 77px;
        top: 48px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab3 {
        left: 0;
        top: 140px;
    }

    #spotQuiz .quizColumn .tabing .circleSpot.tab4 {
        top: 70px;
    }
}

/*** SPOT QUIZ******************************************/


/*** BLUE APRON HQ QUIZ******************************************/

.cooking-quiz {
    text-align: center;
    margin: 0;
    padding:0 15px;
}

.cooking-quiz .quiz-page {
    border-radius: 10px;
    background-color: #fff;
    background-size: cover;
    display: flex;
    margin: 0 auto;
    flex-direction: column;
    /*max-width: 350px;*/
}

.cooking-quiz .background-image {
    background: url(../images/hq-quiz/tittle-hero.jpg);
    max-width: 100%;
    background-size: cover;
    height: 580px;
    background-position: 50% 22%;
    display: flex;
    justify-content: center;
}

.cooking-quiz .quiz-page .pre-question {
    margin: 0;
}

#rightSide .article-header .cooking-quiz .quiz-page .pre-question h3 {
    margin:100px 0 0 0;
    display: block;
    font-size: 25px;
    letter-spacing: 1px;
}

#rightSide .article-header .cooking-quiz .quiz-page .pre-question h1 {
    margin: 0;
    padding: 15px;
    font-size: 35px;
    line-height: normal;
}


.questions-section .question img, .questions-section .answer img{
    width: 100%;
    max-height: 280px;
    object-fit: cover;
}

.questions-section .question h2, .questions-section .answer .wrong, .questions-section .answer .right{
    text-align: left;
    font-size: 18px;
    font-weight: 600;
    color: #19BFCC;
    line-height: normal;
    padding:10px 10px 0;
    margin:0 0 15px;
}

.cooking-quiz .questions-section .question .quiz-options .choice {
    font-size: 17px;
    font-weight: 600;
    line-height: 50px;
    height: 50px;
    border: 1px solid #d3d6dc;
    border-radius: 40px;
    text-align: left;
    padding:0 20px;
    margin-bottom: 10px;
    color:#47525D;
    white-space: nowrap;
    transition: background 0.25s linear;
    text-transform: capitalize;
    cursor: pointer;
    display: block;
    position: relative;
    overflow: hidden;
}

.cooking-quiz .questions-section .question .quiz-options .choice span{
    position: absolute;
    top: 0;
    height: 100%;
    left: 0;
    width: 20%;
    background: #ffffff;
    z-index: -1;
    transition: all 0.35s linear;
}

.cooking-quiz .questions-section .question .quiz-options .choice.selected span{
    background: #e0e0e0;
}

.cooking-quiz .questions-section .question .quiz-options .choice.selected.wrong span{
    background: #f09e9e;
}

.cooking-quiz .questions-section .question .quiz-options .choice.selected.right span{
    background: #5fc448;
}

.cooking-quiz .disabled-button {
    background: #d3d6dc;
    padding:10px 20px;
    font-size: 16px;
    font-weight: 600;
    width: 280px;
    display: table;
    margin: 15px auto 0;
    border-radius: 4px;
    color: #ffffff;
    line-height: 20px;
}


.questions-section .answer .wrong, .questions-section .answer .right{
    text-align: center;
    font-size: 20px;
    line-height: normal;
    padding: 20px 0 0;
    margin: 0;
}

.questions-section .answer .right{
    color: #5fc448;
}

.questions-section .answer .wrong{
    color: #f09e9e;
}

.questions-section .answer .answer-details{
    font-size: 18px;
    line-height: 28px;
    text-align: center;
    font-weight: 300;
    color: #5a5e60;
    padding: 10px 0;
}


.cooking-quiz .questions-section .answer a.button{
    min-width: 280px;
}

.background-image .timer{
    display: none;
}

.timer{
    position: relative;
    margin: -40px 0 0;
}

.progress-circle{
    position: relative;
    display: inline-block;
    margin: 0;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #fff
}


.progress-circle:before {
    content: "";
    position: absolute;
    top: 5px;
    left: 5px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #fff;
    border: 1px solid #0f346c
}

.progress-circle:after {
    content: "";
    display: inline-block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background-color: #0f346c;
    border: 1px solid #0f346c
}

.progress-circle svg {
    height: 20px;
    width: 20px;
    position: absolute;
    top: 15px;
    left: 15px
}

.timer.stepOf1 .progress-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 0, transparent), linear-gradient(90deg, #0f346c 50%, #fff 0, #fff)
}

.timer.stepOf1 .progress-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 0, transparent), linear-gradient(150deg, #0f346c 50%, #fff 0, #fff)
}

.timer.stepOf2 .progress-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 0, transparent), linear-gradient(210deg, #0f346c 50%, #fff 0, #fff)
}

.timer.stepOf3 .progress-circle:after {
    background-image: linear-gradient(-90deg, #0f346c 50%, transparent 0, transparent), linear-gradient(270deg, #0f346c 50%, #fff 0, #fff)
}

.timer.stepOf4 .progress-circle:after {
    background-image: linear-gradient(-30deg, #0f346c 50%, transparent 0, transparent), linear-gradient(270deg, #0f346c 50%, #fff 0, #fff)
}

.timer.stepOf5 .progress-circle:after {
    background-image: linear-gradient(30deg, #0f346c 50%, transparent 0, transparent), linear-gradient(270deg, #0f346c 50%, #fff 0, #fff)
}

.timer.stepOf6 .progress-circle:after {
    background-image: linear-gradient(90deg, #0f346c 50%, transparent 0, transparent), linear-gradient(270deg, #0f346c 50%, #fff 0, #fff)
}

.timer .stepOf {
    background:none;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 0;
    line-height: normal;
    margin: 0 0 10px;
    color: #47525D;
}

.cooking-quiz .questions-section .answer .timer p {
    margin: 0;
    font-weight: 600;
    line-height: 1;
    color: #3a3a3a;
    margin-bottom: 10px;
    font-size: 12px;
}

.cooking-quiz .score-question {
    padding: 20px;
}

#rightSide .article-header .cooking-quiz .score-question h1 {
    color: green;
    font-weight: 700;
    margin: 0 0 20px;
    letter-spacing: 0;
}

.cooking-quiz .score-question h4 {
    color: #444;
    font-size: 24px;
    margin: 0 0 15px;
}

.cooking-quiz .score-question p {
    font-weight: 300;
    line-height: 28px;
    font-size: 16px;
    margin: 0 auto;
}


@media all and (max-width: 767px){
    .cooking-quiz{
        padding: 0;
        max-width: 330px;
        margin: 0 auto;
    }

.cooking-quiz .quiz-page .pre-question {
    margin: 0;
    padding: 40px;
}

#rightSide .article-header .cooking-quiz .quiz-page .pre-question h3{
    line-height: normal;
    font-size: 20px;
}

.cooking-quiz .background-image{
    height: 460px;
    background-position: 50% 10%;
}

#rightSide .article-header .cooking-quiz .quiz-page .pre-question h1{
    margin: 0 auto!important;
    font-size: 27px;
    padding: 10px;
    max-width: 230px;
    display: table;
    text-align: center;
}

#rightSide .article-header .cooking-quiz .quiz-page .pre-question h1 br{display: block;}

.questions-section .question img, .questions-section .answer img {
    width: 100%;
    max-height: 180px;
    object-fit: cover;
    min-height: 180px;
}

#rightSide .article-header .cooking-quiz .score-question h1 {
    margin: 0 0 20px !important;
}

.cooking-quiz .score-question h4 {
    font-size: 20px;
    margin: 0 0 15px;
    font-weight: 700;
    line-height: 30px;
}

.questions-section .question h2, .questions-section .answer .wrong, .questions-section .answer .right{
    font-size: 16px;
}

.cooking-quiz .questions-section .question .quiz-options .choice{
    font-size: 15px;
    line-height: 40px;
    height: 40px;
}

}

/*.cooking-quiz .questions-section .question .quiz-options .choice:hover{
    background: #597fb9;
}

.cooking-quiz .questions-section .question .quiz-options .choice.selected{
    background: rgba(224, 224, 224,1) 18%, 
}*/

/*.cooking-quiz .questions-section .question .quiz-options .choice.selected{
    background: #e0e0e0;
}*/

/*** BLUE APRON HQ QUIZ******************************************/

/*******assessment-quiz**********************************/

#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-image h2{
    margin: 0;
    min-height: 80px;
}

#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .answer-options a.gotoNext{
    float: right;
}

#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .answer-options a.gotoNext:after,
#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .answer-options h5:before, 
#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .answer-options h5:after{
    content: "";
    display: block;
    clear: both;
    visibility: hidden;
}

#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .answer-options h5{
    text-align: right;
}

#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options.ansDone .answer-options, 
#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options.ansDone .heightAuto{
    height: auto;
    width: 100%;
}

#steakQuiz.assessment-quiz .heightAuto span{
    float: left;
    margin-right: 5px;
}

#steakQuiz.assessment-quiz #quiz-scroll{
    overflow: hidden;
}

#steakQuiz.assessment-quiz #quiz-scroll .quiz{
    overflow: visible;
}

#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .answer-options{
    line-height: 1.5;
    padding: 8px;
    font-size: 15px;
}

#quiz-scroll .quiz .question-options .choice{
    border: 7px solid #ffffff;
}

#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .answer-options span.green,
#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .answer-options span.red{
    top: 2px;
}

#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .choice label {
    text-align: left;
    font-size: 16px;
    font-weight: 500;
    padding: 8px;
    margin: 0;
    transition: all .25s ease-in-out;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    line-height: normal;
}

#steakQuiz.assessment-quiz #quiz-scroll .quiz .question-options .choice label img {
    width: 54px;
    margin: 0 10px 0 0;
}

/*******assessment-quiz**********************************/
#final a.button{
    margin-bottom: 8px;
}
#final small{
    font-size: 85%;
    opacity: 0.7;
}

/* quiz concept */
#quizConcept{
  padding: 60px 0;
}

#quizConcept .heading{
  max-width: 700px;
  padding: 40px 0;
  margin: 0 auto
}

#quizConcept .heading h2{
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 1.2px;
    line-height: 38px;
}

.itemBox{
  background: #ffffff;
  box-shadow: 5px 5px 5px rgba(0,0,0,0.1);
  padding: 40px 50px;
  max-width: 700px;
  margin: 0 auto 30px;
}

#quizConceptSlider .num{
    font-size: 22px;
    font-weight: 700;
    letter-spacing: 1.2px;
    margin: 0 0 20px;
    color: #19bfcb;
}

#quizConceptSlider .quizQues {
    font-size: 22px;
    font-weight: 300;
    line-height: 32px;
    letter-spacing: 1.2px;
    margin: 0 0 30px;
    min-height: 65px;
}

.quizAnswer{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  font-weight: 700;
  font-size: 15px;
  color: #2C2E30;
  letter-spacing: 0;
  line-height: 19px;
}

.quizAnswer input[type=radio]:not(old)+label{
  background: none;
}

.quizAnswer div{
  padding: 20px 30px;
}

.quizAnswer div label{
  padding: 0 !important;
}

.quizAnswer .sad span,  #quizConceptFinal .iconFinal.sad{
  background: url(../images/quiz-concept/sad-icon.png) no-repeat center center;
  background-size: cover;
  width: 85px;
  height: 85px;
  display: table;
  margin: 0 auto 20px;
}

.quizAnswer .meh span,  #quizConceptFinal .iconFinal.meh{
  background: url(../images/quiz-concept/meh-icon.png) no-repeat center center;
  background-size: cover;
  width: 85px;
  height: 85px;
  display: table;
  margin: 0 auto 20px;
}

.quizAnswer .happy span,  #quizConceptFinal .iconFinal.happy{
  background: url(../images/quiz-concept/happy-icon.png) no-repeat center center;
  background-size: cover;
  width: 85px;
  height: 85px;
  display: table;
  margin: 0 auto 20px;
}

#quizConceptFinal{
  max-width: 700px;
  padding: 40px 20px;
  margin: 0 auto
}

 #quizConceptFinal h2{
    font-size: 25px;
    font-weight: 500;
    letter-spacing: 1.2px;
    line-height: 38px;
    text-align: center;
    color: #323336;
}

 #quizConceptFinal p {
    font-size: 22px;
    line-height: 38px;
    font-weight: 300;
    letter-spacing: 1.2px;
    margin: 0 0 30px;
    text-align: center;
}

 #quizConceptFinal p span{
  font-weight: 500;
 }

 #quizConceptFinal a.button{
  background: #ffffff;
  border-radius: 0;
  border: none;
  box-shadow: 3px 3px 5px rgba(0,0,0,0.1);
  width: 320px;
  color: #19BFCC;
  text-decoration: underline;
  text-transform: uppercase;
  font-weight: 900;
  letter-spacing: 1px;
 }

 #quizConceptFinal a.button:hover{
    color: #f6a800;
}

 #quizConceptFinal .iconFinal{
  width: 85px;
  height: 85px;
  display: table;
  margin:30px auto !important;
}

.quizAnswer .sad span, .quizAnswer .meh span, .quizAnswer .happy span{
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.quizAnswer .sad.active span, .quizAnswer .meh.active span, .quizAnswer .happy.active span{
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
  -webkit-filter: grayscale(100%);
         filter: gray;
}

@media all and (max-width: 1024px){
  #quizConcept .heading, #quizConceptFinal, .itemBox{
    max-width: 600px;
  }

}

@media all and (max-width: 990px){
  #quizConcept .heading, #quizConceptFinal, .itemBox{
    max-width: 500px;
  }
  .itemBox{
    padding: 30px;
  }
  .quizAnswer div {
      padding: 20px;
  }

}

@media all and (max-width: 767px){
  #quizConcept .heading{
    padding: 30px 0 10px;
  }

#quizConceptSlider .quizQues{
  margin: 0;
}

}

@media all and (max-width: 450px){
   #quizConcept .heading, #quizConceptFinal, .itemBox{
    max-width: 500px;
    width: 90%;
  }

  #quizConcept .heading{
    padding: 30px 0 10px;
  }
  #quizConcept .heading h2 {
    font-size: 20px;
    line-height: 30px;
    letter-spacing: 0;
}
.itemBox {
    padding: 15px;
    width: 97%;
}

#quizConceptSlider .quizQues{
  margin: 0 0 20px;
  font-size: 20px;
  line-height: 30px;
  min-height: 120px;
}

.quizAnswer div {
    padding: 10px;
}

.quizAnswer .sad span,  #quizConceptFinal .iconFinal.sad,
.quizAnswer .meh span,  #quizConceptFinal .iconFinal.meh,
.quizAnswer .happy span,  #quizConceptFinal .iconFinal.happy{
  width: 70px;
  height: 70px;
}

}
/* quiz concept */


table.xe-warning{display: none !important;}


#rightSide .imgBtnCenter img.size-full {
    margin: 0;
}

.imgBtnCenter{
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #000;
}



.imgBtnCenter .caption{
    background: #ffffff;
    background: rgba(255,255,255,0.85);
    padding: 15px 20px;
    text-align: center;
    font-size: 30px;
    font-weight: 700;
    color: #000000;
    position: absolute;
    border-radius: 10px;
    cursor: pointer;
}

.imgBtnCenter .caption span{
    display: block;
    font-weight: 400;
}

#quizTemp.starzQuiz .quizHeading{
    color: #ffffff;
}

#quizTemp.starzQuiz .quiz{
    max-width: inherit;
    padding: 15px 0;
    margin: 0 auto 15px;
}

#quizTemp.starzQuiz .quizBox {
    width: auto;
    padding: 10px 15px 15px;
}

#quizTemp.starzQuiz .quizBox .quizBoxMid .row{
    display: flex;
    align-items: stretch;
}

#quizTemp.starzQuiz .quizBox .quizBoxMid img{
    width: 100% !important;
    height: 100%;
    float: none;
    margin: 0;
    object-fit: cover;
}

#quizTemp.starzQuiz .quizBoxMid{
    padding: 15px;
}

#quizTemp.starzQuiz .pR{
    padding-right: 10px;
}

#quizTemp.starzQuiz .quizBox .quizBoxMid h4{
    text-align: center;
    margin: 0 0 10px;
        font-size: 22px;
}



#quizTemp.starzQuiz .quizBox .quizBoxMid h4 span{
    font-weight: 300;
    display: block;
    margin: 0 0 8px;
}

#quizTemp.starzQuiz .quizBox a.btn-nSeg{
    line-height: 40px;
    padding: 0 15px;
    margin: 10px auto;
    font-size: 16px;
}


#quizTemp.starzQuiz a.btn-nSeg.btnWatch{
    margin: 15px auto;
}

#quizTemp.starzQuiz .quizBox .quizBoxMid p {
    line-height: 26px;
}


.socialSprite{
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin-top: 10px;
}

.socialSprite a.fbShare{
    width: 75px;
    height: 28px;
    display:block;
    background:url(../images/social-icon-sprite.png) no-repeat 0 0;
    margin-right: 5px;
    transition: none;
}

.socialSprite a.fbShare:hover{
    background-position: 0 -29px;
}

.socialSprite a.tweetShare{
    width: 74px;
    height: 28px;
    display:block;
    background:url(../images/social-icon-sprite.png) no-repeat -79px 0;
    margin-right: 5px;
    transition: none;
}

.socialSprite a.tweetShare:hover{
    background-position: -79px -29px;
}

.socialSprite a.linkShare{
    width: 79px;
    height: 28px;
    display:block;
    background:url(../images/social-icon-sprite.png) no-repeat -157px 0;
    margin-right: 5px;
    transition: none;
    position: relative;
}

.socialSprite a.linkShare span.linkCopy{
    width: 100px;
    background:#555;
    position: absolute;
    left: 50%;
    margin-left: -50px;
    top: -30px;
    border-radius: 5px;
    color: #ffffff;
    line-height: 20px;
    height: 20px;
    font-size: 11px;
    text-align: center;
}

.socialSprite a.linkShare span.linkCopy:after{
    content: "";
    width: 0;
    height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-top: 6px solid #555;
    position: absolute;
    bottom: -6px;
    left: 50%;
    margin-left: -3px;
}


.socialSprite a.linkShare:hover{
    background-position: -157px -29px;
}


@media all and (max-width: 1140px){
    #quizTemp.starzQuiz .quizBox .quizBoxMid h4 {
    font-size: 20px;
}

#quizTemp.starzQuiz .quizBox .quizBoxMid p {
    line-height: 22px;
    font-size: 15px !important;
}

#quizTemp.starzQuiz .quizBox a.btn-nSeg{
    font-size: 14px;
}

}


@media all and (max-width: 1000px){
    #quizTemp.starzQuiz .quizBox .quizBoxMid h4 {
    font-size: 18px;
}

#quizTemp.starzQuiz .quizBox .quizBoxMid p {
    line-height: 20px;
    font-size: 14px !important;
}

#quizTemp.starzQuiz .quizBox a.btn-nSeg {
    padding: 0 5px;
    font-size: 12px;
    margin: 10px auto;;
}

#quizTemp.starzQuiz .pR {
    padding-right: 0;
}


}

@media all and (max-width: 767px){

#quizTemp.starzQuiz .quiz h2 {
    font-size: 25px;
    line-height: 30px;
    margin: 0 0 15px 0;
    padding: 0;
}

#quizTemp.starzQuiz .quizBox .quizBoxMid .row {
    display: block;
    align-items: stretch;
}

#quizTemp.starzQuiz .pR {
    padding: 0 0 15px;
}

#quizTemp.starzQuiz .quizBox .quizBoxMid img {
    height: auto;
    object-fit: inherit;
    max-height: inherit;
}

#quizTemp.starzQuiz input[type=radio]:not(old) + label{
    font-size: 16px;
    padding: 0 0 0 35px;
    margin: 15px 0 0 0;
}

#quizTemp.starzQuiz input[type=radio]:not(old):checked + label:after,
#quizTemp.starzQuiz input[type=radio]:not(old) + label:after{
    left: 10px;
}

#quizTemp.starzQuiz .quizBox {
    margin: 0 !important;
}


#rightSide .imgBtnCenter img.size-full {
    min-height: 250px;
    margin: 0;
    height: 250px;
    object-fit: cover;
}

.imgBtnCenter .caption {
    background: #ffffff;
    background: rgba(255,255,255,0.85);
    padding: 15px 20px;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    color: #000000;
    position: absolute;
    border-radius: 10px;
    margin: 0 0;
    line-height: 30px;
}

#quizTemp.starzQuiz .quizBox a.btn-nSeg{
    padding:0 12px;
}

}


@media all and (max-width: 420px){

.imgBtnCenter .caption{
    left: 15px;
    right: 15px;
    margin: 0;
}
   

}

/* Adding style for Banner Candid */

.banner{
	background: #ffffff;
    margin: 0 0 -20px;
    position: relative;
    padding-top: 50px;
}
.col-flex{
	background: #19bfcb;
    overflow: hidden;
    margin: 0 auto;
    width: 100%;
    padding: 0;
    max-width: 100%;
    min-height: 50px;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: space-between;
    justify-content: space-between;
    position: relative;
}
.banclose{
	position: absolute;
    top: 5px;
    right: 10px;
    z-index: 3;
}
.boxclose{
	color: #ffffff;
    width: 24px;
    height: 24px;
    padding: 1px 0 0;
    box-sizing: border-box;
    text-align: center;
    vertical-align: middle;
    font-size: 24px;
    display: block;
    text-decoration: none;
    font-weight: 400;
}
.offer-link{
	
	font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size: 20px;
    line-height: 40px;
    color: #ffffff;
    margin: 0px auto;
    padding: 0;
    text-align: center;
    letter-spacing: 1px;
    text-decoration: underline;
}
.offer-link:hover{
	color: #fff;
	
}
.offer-link:visited{
	color: #fff;
}
#close{
	float:right;
    display:inline-block;
    padding:2px 5px;
	color: #fff;
    font-size: 30px;
    cursor: pointer;
	
}
#close:hover{
	 text-shadow: 2px 2px 4px #fff;
}
.off{
	margin: 0px auto;
}
.sticky{
    position: sticky;
    top: 10px;
    width: 100% !important;
    border-bottom: 1px solid #cccccc;	
	z-index: 9;
}
.hide{
	display: none;
}
@media all and (max-width: 768px){
	.banner{
		padding-top: 50px;
		margin-bottom: -25px;
	}
	.col-flex{
		display: block;
		padding: 0 10px;
		min-height: 70px;
		margin: 0;
		}
	#close{
		font-size:20px;	
	}
	
	.banclose{
		top: 0px;
		right: 5px;
	}
	.boxclose {
		font-size: 18px;
	}

	.off{
		padding-top: 30px;
		margin: 0px auto;
		text-align: center;
}
	.offer-link{
    font-size: 17px;
    line-height: normal;
    margin: 0px auto;
	}
	
	
}

/* end */
