@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Unna:wght@700&display=swap');

:root {
    --black: #000000;
    --black1: #191919CC;
    --black2: #0A0A0A;
    --white: #ffffff;
    --blue: #EFFFF9;
    --gray: #333333;
    --gray1: #4D4D4D;
    --gray2: #292929;
    --gray3: #707070;
    --gray4: #E3E3E3;
    --gray5: #00000066;
    --gray6: #BABABA;
    --brown: #5F2D0C;
    --brown1: #652900;
    --orange: #C3AB9D;
    --pink: #EFDCD5;
    --pink1: #F9F1EC;
    --cyan: #07F5FF;
}

/*== common ==*/
* { margin: 0px; padding: 0px; text-decoration: none; border: none; box-sizing: border-box; list-style: none; border: none; transition: all 0.2s;}
.mcSpendsWrapper {font-family: 'IBM Plex Sans', sans-serif; font-size: 18px; font-weight: 400; color: var(--darkgray); background-color: var(--pink1);}
.mcSpendsWrapper a {font-family: 'IBM Plex Sans', sans-serif;}
.mcSpendsContainer {width: 1250px; margin: auto;}
a {text-decoration:none; outline:none;}
a:hover {text-decoration: underline; outline:none;}
input:focus, select:focus {outline:none;}
h1, .h1, h2, .h2, h3, .h3 {margin:0px;}
section {padding-bottom: 35px;}
.sectionTitle {font: 700 28px/33px 'Unna', serif; color: var(--brown); margin-bottom: 15px;}
.titleView {position: relative;}
.viewAll {font-size: 16px; line-height: 30px; font-weight: 700; color: var(--gray); position: absolute; right: 0; top: 0;}
.viewAll span {margin-left: 5px;}
.divider {font-size: 14px; font-weight: 700; color: var(--brown); margin-left: 3px; padding-left: 3px; margin-right: 8px;}
.margin10 {margin: 10px 0;}
.marginTop10 {margin-top: 10px;}
.MB25 {margin-bottom: 25px;}
.videoIcon {position: absolute; bottom: 30px; left: 30px;}
.showMobile {display: none;}
.exploreBtn {background-color: var(--cyan); border-radius: 30px; font-size: 18px; line-height: 23px; font-weight: 700; width: 130px; height: 45px;}
.loadmore, .loadmore:hover {width: 130px; height: 40px; border-radius: 30px; border: 2px solid var(--orange); font-size: 16px; line-height: 36px; color: var(--gray3); display: block; text-decoration: none; margin: 30px auto;}
.cust_scroll  { max-height:475px; overflow-y:auto; scrollbar-color: var(--brown) transparent; scrollbar-width: thin; scrollbar-height: thin;}
.cust_scroll::-webkit-scrollbar {height:6px; width:6px; background-color: transparent; border-radius:5px;} 
.cust_scroll::-webkit-scrollbar-thumb {background-color: var(--brown); border-radius:5px;}
footer {margin-top: 0;}
.adBlock {text-align: center; padding-bottom: 60px;}
/*== common ==*/


/*== common font sizes ==*/
.caption {font-size: 14px; font-weight: 400; color: var(--brown);}
.paragraph {font-size: 18px; line-height: 28px; font-weight: 400; color: var(--gray2); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
.by {font-size: 14px; font-weight: 400; color: var(--brown);}
.headline, .headline a {font: 700 22px/25px 'Unna', serif; color: var(--gray2); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.form16 {font-size: 16px;}
/*== common font sizes ==*/


/*== common font color ==*/
.gray {color: var(--gray1);}
.brown {color: var(--brown);}
/*== common font color ==*/

/*== common font weight ==*/
.semibold {font-weight: 600;}
/*== common font weight ==*/

/*== header ==*/
.headerSection {padding-bottom: 0px; margin-bottom: 20px;}
.pageMenuSection {padding: 17px 0;}
/*== header ==*/

.menuBlock {background-color: #F9F1EC; position: sticky; position: -webkit-sticky; top: 0; z-index: 1;}
.menu_container {position: relative; z-index: 2;}


/*== main menu ==*/
.mainMenuBlock {background-color: var(--pink1); border-top: 1px solid var(--orange); border-bottom: 1px solid var(--orange);}
.mainMenuBlock ul {display: flex; justify-content: space-between; margin-bottom: 0;}
.mainMenuBlock ul li {padding: 13px 10px 13px 10px;}
.mainMenuBlock ul li a {font-size: 18px; line-height: 23px; font-weight: 400; color: var(--black2); text-decoration: none;  padding: 10px;}
.mainMenuBlock ul li.active a {font-weight: 700; color: var(--brown1); border-bottom: 4px solid var(--brown); padding: 13px 10px 13px 10px;}
.mainMenuBlock ul li:hover a {border-bottom: 4px solid var(--brown); padding: 13px 10px 13px 10px;}
/*== main menu ==*/



/*== logo hamburger menu ==*/
.logoMenuBlock {display: flex; justify-content: space-between; align-items: end; height: 115px; position: relative; padding-bottom: 5px;}
.loginBlock {position: absolute; bottom: 10px; right: 80px;}
.loginBlock a {font-size: 18px; line-height: 22px; font-weight: 700; color: var(--brown); text-decoration: none;}
.loginBlock span {position: relative; top: -5px; left: 5px;}
.loginBlock img {position: relative; top: -7px;}
/*== logo hamburger menu ==*/


/*== hamburger menu ==*/
.pancake.pancake_close {background: url("http://stgwww.moneycontrol.com/news/images/mc_spends/hamburger.png") no-repeat; width: 29px; height: 24px; z-index: 99; position: absolute; cursor: pointer;}
.pancake {background: url("http://stgwww.moneycontrol.com/news/images/mc_spends/hamburger.png") no-repeat; width: 29px; height: 24px; display: inline-block; margin: 20px 0 0 0px; position: absolute; z-index: 99;  right: 0; bottom: 17px; cursor: pointer;}
#menus {opacity:0; right: 345px; position: absolute; z-index: 1; transition: 0.7s all; pointer-events: none;}
#menus.activemenu {right: 382px; opacity:1; transition: 0.7s all; pointer-events: all;}
.menus {position: fixed; width: 395px; transition: 0.7s all; background-color: #fff; top: 55px; height: 100%; padding: 60px 30px 0 30px; border-radius: 10px; box-shadow: 1px 6px 7px #00000029;}
.top_links li {margin-bottom: 10px; padding-bottom: 10px; position: relative;}
.top_links li a {font-size: 18px; line-height: 23px; color: var(--black2); text-decoration: none; display: block;}
.top_sublinks {display: none;}
.top_sublinks_active:before {content: ""; width: 4px; height: 35px; background-color: var(--brown); display: block; position: absolute; left: -30px; top: -8px;}
.top_sublinks li {border-bottom: 0; margin-bottom: 7px; background-color: #EFDCD5; border-radius: 20px; padding: 9px 20px;}
.top_sublinks li.active {background-color: var(--brown1);}
.top_sublinks li.active a {font-weight: 700; color: var(--white);}
.top_links li.sublinks {border-bottom: 0;}
.top_sublinks {margin-top: 10px;}
.top_sublinks li a {font-size: 16px; line-height: 23px; color: var(--black2);}
.top_sublinks_active {font-weight: 700; color: var(--brown);}
/*== hamburger menu ==*/


/*== bredcrum ==*/
.breadcrumb_wrapper {margin-bottom: 20px;}
.upc {text-transform: uppercase; color: var(--gray2); font-size: 12px; font-weight: 500; margin-right: 5px;}
.bred_list {padding: 0; display: inline; font-weight: 700;}
.bred_list li {font-size: 12px; color: var(--gray2); padding-right: 0; font-weight: 700; display: inline;}
.bred_list li a {color: var(--gray2); font-weight: 400;}
.graysp {margin-right: 2px;}
.col_gray {font-size: 13px; margin: 0 2px; padding: 0 0 0 2px;}
/*== bredcrum ==*/


/*== format 1 ==*/
.format1 .topBlock {display: flex; justify-content: space-between; gap: 45px;}
.format1 .imageBlock {width: 720px; height: 405px;}
.format1 .contentBlock {width: calc(100% - 720px);}
.format1 .caption {font-size: 16px;}
.format1 .headline, .format1 .headline a {font: 30px/34px 'Unna', serif; margin: 9px 0; color: var(--gray2); display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.format1 .paragraph {margin-bottom: 30px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
/*== format 1 ==*/


/*== format 2 ==*/
.format2 {margin-top: 15px;}
.list4 ul {display: flex; justify-content: space-between; gap: 20px;}
.format2 .headline, .format2 .headline a {margin: 10px 0; color: var(--gray2);}
.format2 .imageBlock {width: 297px; height: 180px; margin-bottom: 10px;}
.format2 .imageBlock img {height: 100%;}
/*== format 2 ==*/


/*== format 3 ==*/
.format3 .topBlock {display: flex; justify-content: space-between; gap: 20px;}
.format3 .leftBlock .imageBlock {width: 828px; height: 465px; margin-bottom: 20px; position: relative;}
.format3 .leftBlock .headline, .format3 .leftBlock .headline a {font: 700 32px/34px 'Unna', serif; margin: 18px 0 15px;}
.format3 .content {margin-bottom: 20px;}
.format3 .rightBlock {width: calc(100% - 404px);}
.format3 .rightBlock .imageBlock {height: 227px; margin-bottom: 20px;}
.format3 .rightBlock .imageBlock img {width: 100%; height: 100%;}
.format3 .rightBlock li {margin-bottom: 20px;}
.format3 .rightBlock li .headline a {color: var(--gray2);}
.format3 .bottomBlock .format2 li .imageBlock {width: 404px; height: 227px; margin-bottom: 20px;}
.format3 .bottomBlock .format2 li .imageBlock img {width: 100%; height: 100%;}
/*== format 3 ==*/

.featuredSection {margin-bottom: 30px;}


/*== editors pick ==*/
.editorsPic {position: relative;}
.editorsPic:after {position: absolute; content: ""; left: -6px; top: 28px; background: url("http://stgwww.moneycontrol.com/news/images/mc_spends/gray_patch.png") no-repeat; width: 7px; height: 7px;}
.editorsPic:before {content: ""; position: absolute; bottom: 0; width: 100%; height: 120px; display: block; background: linear-gradient(0deg, rgb(0 0 0) 0%, rgb(30 30 30 / 22%) 65%); pointer-events: none;}
.piclabel {position: absolute; top: 35px; left: -5px; font-size: 20px; line-height: 45px; font-weight: 500; color: var(--gray2); width: 165px; height: 45px; background-color: var(--white); text-align: center;}
.editorsPic .videoIcon {width: 56px; height: 56px;}
.messageBox {background-color: var(--black1); width: 515px; height: 410px; position: absolute; right: 60px; top: 0; bottom: 0; margin: auto; padding: 45px 40px;}
.messageBox .caption {font-size: 16px; color: var(--white);}
.messageBox .by.grayE3 {color: var(--gray4);}
.messageBox .divider {color: var(--white);}
.messageBox .headline {font-size: 30px; line-height: 38px; color: var(--white); margin: 15px 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.messageBox .paragraph {font-size: 18px; line-height: 28px; color: var(--gray4); margin-bottom: 35px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden;}
.profilepic {display: inline-block; vertical-align: middle; margin-right: 20px;}
.profilepic img {border-radius: 100%;}
.association {font-size: 14px; color: var(--white); position: absolute; right: 75px; bottom: 30px;}
.association span {position: relative; top: 10px; left: 20px;}
/*== editors pick ==*/


/*== page menu ==*/
.pageMenu ul {display: flex; justify-content: center; gap: 10px; padding: 10px 0;}
.pageMenu ul li a {font-size: 16px; line-height: 20px; color: var(--gray2); text-decoration: none; background-color: var(--pink); border-radius: 20px; padding: 5px 15px;}
.pageMenu ul li a.active {background-color: var(--brown1); color: var(--white);}
/*== page menu ==*/


/*== explore ==*/
.exploreSection {position: relative; margin-bottom: 10px;}
.exploreSection .mcSpendsContainer {height: 400px; position: relative;}
.exploreSection .mcSpendsContainer:before {content: ""; background-color: var(--gray5); width: 100%; height: 100%; position: absolute;}
.exploreSection img {width: 100%; height: 100%;}
.exploreSection .contentBlock {padding: 50px; position: absolute; top: 0;}
.exploreSection .contentBlock .caption {font: 400 35px/40px 'Unna', serif; color: var(--white);}
.exploreSection .contentBlock .headline {font: 700 50px/57px 'Unna', serif; color: var(--white); margin: 5px 0; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
.exploreSection .contentBlock .paragraph {font-size: 18px; line-height: 26px; color: var(--white); font-weight: 400;   margin-bottom: 30px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}
/*== explore ==*/


/*== hotels ==*/
.resortReviewsSection {margin-bottom: 10px;}
.hotelsList ul {display: flex; justify-content: space-between; gap: 20px;}
.hotelsList ul li {position: relative;}
.hotelsList .imageBlock, .hotelsList .imageBlock img {width: 300px; height: 445px;}
.hotelsList .imageBlock:before {content: ""; position: absolute; background: linear-gradient(0deg, rgb(0 0 0) 0%, rgb(30 30 30 / 22%) 75%); bottom: 0; width: 100%; height: 120px; display: block; pointer-events: none;}
.hotelsList ul li .contentBlock {position: absolute; padding: 20px; bottom: 0;}
.hotelsList .contentBlock .caption {font-size: 18px; color: var(--white); font-weight: 400;}
.hotelsList .contentBlock .headline {font: 700 32px/32px 'Unna', serif; color: var(--white); margin: 10px 0;}
.hotelsList .contentBlock .by {font-size: 14px; color: var(--white); font-weight: 400;}
/*== hotels ==*/


/*== the lust ==*/
.theLustSection .format2 .imageBlock {width: 405px; height: 225px;}
.theLustSection .format2 .imageBlock img {width: 100%; height: 100%;}
.theLustSection .format2 .headline {font-size: 24px; line-height: 27px;}
.theLustSection .format2 .paragraph {font-size: 16px; line-height: 24px; margin-bottom: 20px;}
/*== the lust ==*/


/*== so expensive ==*/
.soExpensiveSection .expensiveContainer {display: flex; justify-content: space-between; gap: 20px;}
.soExpensiveSection .leftBlock {position: relative;}
.soExpensiveSection .leftBlock .imageBlock {width: 615px; height: 345px;}
.soExpensiveSection .leftBlock .contentBlock {position: absolute; bottom: 20px; padding: 0 55px 25px 30px;}
.soExpensiveSection .leftBlock .contentBlock .caption {color: var(--white);}
.soExpensiveSection .leftBlock .contentBlock .headline {color: var(--white); font-size: 24px; line-height: 30px; margin: 10px 0;}
.soExpensiveSection .leftBlock .contentBlock .by {color: var(--white);}
.soExpensiveSection .rightBlock .imageBlock {height: 165px;}
.soExpensiveSection .rightBlock .format2 {margin-top: 0;}
.soExpensiveSection .rightBlock .headline {font-size: 20px; line-height: 24px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin-bottom: 5px;}
.soExpensiveSection .rightBlock .paragraph {font-size: 16px; line-height: 22px; margin-bottom: 15px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
/*== so expensive ==*/


/*== more in spends ==*/
.moreinspendList ul {display: flex; justify-content: space-between; flex-wrap: wrap;}
.moreinspendList ul li {width: 400px; display: flex; gap: 15px; margin-bottom: 30px;}
.moreinspendList ul li .imageBlock {width: 180px; height: 110px;}
.moreinspendList ul li .contentBlock {width: calc(100% - 180px);}
.moreinspendList ul li .imageBlock img {width: 100%; height: 100%;}
.moreinspendList ul li .headline, .moreinspendList ul li .headline a {font-size: 20px; line-height: 20px; margin: 10px 0;}
/*== more in spends ==*/


/*== consumption ==*/
.pageConsumption .mcSpendsContainer {display: flex; gap: 50px;}
.pageConsumption .mcSpendsContainer .pageRight {width: calc(100% - 60px);}
.pageConsumption .mcSpendsContainer .pageLeft .article_image img {width: 900px; height: 505px;}
.pageHeadline, .pageHeadline a {font: 700 50px/60px 'Unna', serif; color: var(--gray2);}
.pageConsumption .mcSpendsContainer .pageLeft p, .pagePara {font-size: 18px; line-height: 32px; color: var(--gray1); margin-bottom: 35px;}
.pageConsumption .by {font-size: 18px; font-weight: 500; margin: 20px 0 15px 0;}
.videoBlock {margin-top: 30px;}
.dash {background-color: var(--brown); width: 45px; height: 2px; display: inline-block; vertical-align: super;  margin-right: 10px;}
.pageConsumption .caption {font-size: 14px; padding-left: 55px;}
.pageConsumption .mcSpendsContainer .pageLeft .article_text, .videoheading {font-size: 16px; line-height: 34px; color: var(--gray1); border-bottom: 3px solid var(--brown); padding: 8px 0 15px 0; display: block; margin-bottom: 30px;}
.pageConsumption .list4 .contentBlock {font-size: 16px; line-height: 34px; margin-top: 5px;}
.pageConsumption .sectionTitle {font: 700 26px/30px 'Unna', serif; color: var(--brown);}
.format4 ul li {display: flex; gap: 10px; margin-bottom: 30px;} 
.format4 ul li:last-child {margin-bottom: 0;}
.format4 ul li .contentBlock, .format4 ul li .contentBlock a {font-size: 16px; line-height: 22px; color: var(--gray1); width: 160px; margin-top: -6px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
.format5 ul li {border-bottom: 1px solid var(--gray6); margin-bottom: 15px; padding-bottom: 15px;}
.format5 ul li:last-child {border-bottom: 0; margin-bottom: 0; padding-bottom: 0;}
.format5 .imageBlock {margin-bottom: 10px;}
.format5 .contentBlock .headline {font: 700 20px/24px 'Unna', serif; color: var(--gray2); margin-bottom: 5px;}
.format5 .contentBlock .headline a {font-size: 20px;}
.format5 .contentBlock .paragraph {font-size: 16px; line-height: 24px; color: var(--gray1);}
.listing {margin-bottom: 30px;}
.listing ul {display: flex; gap: 40px;}
.listing ul li .imageBlock {margin-bottom: 12px;}
.listing ul li .contentBlock {font-size: 16px; color: var(--gray1);}
.pageRight .format4, .pageRight .format5 {border-bottom: 3px solid var(--brown1); padding-bottom: 25px; margin-bottom: 15px;}
.pageRight .format5+.format5+.format5 {border-bottom: 0;}
/*== consumption ==*/

.you_can_gift a {font: 500 16px/19px 'Lato', sans-serif; color: #FF8D45; background-color: #F4F4F4; border-radius: 20px; padding: 10px 20px; display: inline-block; margin-bottom: 15px; text-decoration: none; margin-top: 15px;}
.pageLeft .related_stories_left_block {width: 42%; margin-right: 24px; float: left; margin-bottom: 11px; margin-top: 15px;}
.pageLeft ul.stories_list {border-bottom: 3px solid #000000;}
.pageLeft ul.stories_list li a {font: 700 18px/24px 'Josefin Sans', sans-serif; color: #525252;}
.pageLeft ul.stories_list li {margin-bottom: 20px;}
.pageLeft ul.stories_list li .image_block {display: inline-table; vertical-align: top; margin-right: 15px;}
.pageLeft ul.stories_list li .content_block {display: inline-table; vertical-align: top; width: 190px;}
.pageLeft .related_stories_left_block .section_title span {display: inline-block; background-color: #F9F1EC; padding: 4px 7px 0 0; float: left;}
.pageLeft .related_stories_left_block .section_title {background: url("https://images.moneycontrol.com/mcnews/images/related_story_bar.png") repeat-x; width: 100%; height: 14px; font: 700 18px/12px 'Josefin Sans', sans-serif; color: #525252; text-transform: uppercase; margin-bottom: 25px;}
.pageLeft .author_wrapper {border-top: 1px solid #707070; border-bottom: 1px solid #707070; padding: 15px 0;}
.pageLeft .author_wrapper .image_block {display: inline-block; vertical-align: middle;}
.pageLeft .author_wrapper .content_block {display: inline-block; vertical-align: middle; width: 84%; margin-left: 15px; font: 400 16px/22px 'Lora', sans-serif; color: #000000; font-style: italic;}
.pageLeft .author_wrapper .content_block span {font: 700 16px/22px 'Josefin Sans', sans-serif; color: #652900; text-transform: uppercase;}
.pageLeft .tags_wrapper {padding: 20px 0; border-bottom: 5px solid #652900; margin-bottom: 35px;}
.pageLeft .tags_first_line, .tags_first_line a {font: 400 16px/16px 'Josefin Sans', sans-serif; color: #ffffff; margin-bottom: 20px;}
.pageLeft .tags_first_line a {background-color: #292929; border-radius: 5px; display: inline-block; padding: 17px; text-decoration: none; margin-bottom: 10px; margin-right: 4px;}
.pageLeft .tags_first_line a:hover {text-decoration: none; color: #ffffff;}
.pageLeft .tags_first_line span {display: block; margin-bottom: 15px; font: 700 30px/39px 'IBM Plex Sans', sans-serif; color: #652900; text-transform: none;}
.pageLeft .tags_last_line {font: 700 16px/14px 'Josefin Sans', sans-serif; color: #525252; text-transform: uppercase;}
.pageLeft .tags_first_line, .pageLeft .tags_first_line a {font-size: 18px; line-height: 23px; font-family: 'IBM Plex Sans', sans-serif; font-weight: bold;}
.social_icons_wrapper {position: sticky; position: -webkit-sticky; margin-left: -55px; top: 70px; height: 0px;
    display: block; width: 37px;}


@media screen and (max-width: 1440px){
    .social_icons_wrapper {
        margin-left: -65px;
    }
}

@media screen and (max-width: 1366px){
    .social_icons_wrapper {
        margin-left: -43px;
    }
}

@media only screen and (max-width: 1279px) {
    .mcSpendsContainer {width: 100%; padding: 0 15px;}
    .viewAll {right: 15px;}
    .list4 ul {overflow-x: auto; white-space: normal; justify-content: start;}
    .format3 .rightBlock {width: calc(100% - 225px);}
    .mainMenuBlock ul {overflow-x: auto; overflow-y: hidden; white-space: nowrap; scrollbar-width: none; -webkit-scroll-snap-type: x mandatory; -ms-scroll-snap-type: x mandatory; scroll-snap-type: x mandatory;
    scrollbar-width: none;}
    .mainMenuBlock ul::-webkit-scrollbar {display: none;}
    .mainMenuBlock ul li {scroll-snap-align: center; scroll-snap-stop:always;}
    .newLaunchesSection .mcSpendsContainer, 
    .recommendsSection .mcSpendsContainer, 
    .travelSection .mcSpendsContainer, 
    .carbikesSection .mcSpendsContainer, 
    .watchesSection .mcSpendsContainer, 
    .fooddrinksSection .mcSpendsContainer, 
    .gadgetsSection .mcSpendsContainer, 
    .homeinteriorsSection .mcSpendsContainer, 
    .fashionfragranceSection .mcSpendsContainer, .theLustSection .mcSpendsContainer {padding-right: 0;}
    .list4 ul {scrollbar-width: none;}
    .list4 ul::-webkit-scrollbar {display: none;}
    .list4 ul li:last-child {margin-right: 15px;}
    .format1 .imageBlock {width: 500px; height: 281px;}
    .format1 .contentBlock {width: calc(100% - 500px);}
    .format3 .leftBlock .imageBlock {width: 100%; height: 390px;}
    .pageMenuSection .mcSpendsContainer {padding: 0 0 0 15px;}
    .pageMenu ul {overflow-x: auto; white-space: nowrap; scrollbar-width: none; display: block;}
    .pageMenu ul li {display: inline-block;}
    .pageMenu ul li:last-child {margin-right: 15px;}
    .pageMenu ul::-webkit-scrollbar {display: none;}
    .soExpensiveSection .leftBlock .imageBlock {width: 500px;}
    .soExpensiveSection .leftBlock .contentBlock .headline {line-height: 25px;}
    .soExpensiveSection .rightBlock .format2.list4 ul li:last-child {margin-right: 0;}
    .soExpensiveSection .leftBlock .imageBlock img {height: 350px;}
    .moreinspendList ul li {width: 460px;}
    .pageConsumption .mcSpendsContainer .pageRight {width: 300px;}
    .pageHeadline {font-size: 40px; line-height: 50px;}
    .videoBlock iframe {width: 100%; height: 400px;}
    .hotelsList ul {overflow-x: auto; margin-right: -15px;}
    .hotelsList ul li:last-child {margin-right: 15px;}
    .soExpensiveSection .format2 .imageBlock {width: 100%;}
    /* .soExpensiveSection .format2 .imageBlock {width: 225px;} */
    .moreinspendList ul {scrollbar-width: none;}
    .moreinspendList ul::-webkit-scrollbar {display: none;}
    .pageMenuSection {padding: 15px 0 7px 15px;}
    .newLaunchesSection .format1 .imageBlock {height: 235px;}
    .newLaunchesSection .format1 .imageBlock img {height: 100%;}
}


@media only screen and (max-width: 980px) {
    section {padding-bottom: 25px;}
    .mcSpendsContainer {padding: 0;}
    .format1 .contentBlock, .sectionTitle {padding: 0 15px;}
    .format1 .topBlock {display: block;}
    .format1 .imageBlock {width: 100%; height: auto;}
    .format1 .contentBlock {width: 100%; margin-top: 20px;}
    .format2 {padding-left: 15px;}
    .format1 .imageBlock img {width: 100%;}
    .list4 ul li:last-child {margin-right: 20px;}
    .format3 .topBlock {display: block;}
    .format3 .leftBlock .imageBlock {width: 100%; height: 100%;}
    .format3 .leftBlock .contentBlock {padding: 0 15px;}
    .format3 .leftBlock {margin-bottom: 20px;}
    .format3 .rightBlock {padding: 0 15px; width: 100%;}
    .format3 .rightBlock ul {display: flex; justify-content: space-between; gap: 20px;}
    .messageBox {position: static; background-color: transparent; width: 100%; height: unset; padding: 15px;}
    .editorsPic::before {content: none;}
    .showDesk {display: none;}
    .showMobile {display: block;}
    .messageBox .caption {color: var(--brown); font-size: 12px;}
    .messageBox .divider {color: var(--brown);}
    .messageBox .paragraph {font-size: 20px; line-height: 24px; color: var(--gray2);}
    .messageBox .caption:nth-of-type(2) {font-weight: 700;}
    .profilepic {width: 32px; height: 32px; margin-right: 10px;}
    .editorsPic .videoIcon {bottom: 20px; left: 12px; width: 32px; height: 32px;}
    .association {font-size: 12px; color: var(--gray1); right: 20px; bottom: 2px;}
    .association div {margin-top: 5px;}
    .editorsPic .imageBlock {position: relative;}
    .editorsPic:after {display: none;}
    .pageMenu ul li a {font-size: 12px; padding: 8px 10px;}
    .format1 .headline, .format1 .headline a {margin: 10px 0;}
    .hotelsList ul {margin: 30px;}
    .soExpensiveSection .expensiveContainer {display: block;}
    .soExpensiveSection .leftBlock .imageBlock, .soExpensiveSection .leftBlock .imageBlock img {width: 100%;}
    .soExpensiveSection .leftBlock .contentBlock {position: relative; bottom: 0; padding: 25px 15px 25px 15px;}
    .soExpensiveSection .leftBlock .contentBlock .caption {color: var(--brown1); font-weight: 600;}
    .soExpensiveSection .leftBlock .contentBlock .headline {color: var(--gray2); font-weight: 700;}
    .soExpensiveSection .leftBlock .contentBlock .by {color: var(--gray1);}
    .moreinspendList {padding: 0 0 0 15px;}
    .moreinspendList ul {flex-wrap: unset; gap: 10px; overflow-x: auto;}
    .moreinspendList ul li .imageBlock {width: 185px; height: 85px; margin-bottom: 15px;}
    .moreinspendList ul li {display: block;}
    .moreinspendList ul li .contentBlock {width: 100%;}
    .soExpensiveSection .rightBlock .imageBlock img {width: 100%;}
    .soExpensiveSection .rightBlock .format2 {padding-right: 15px;}
    .pageConsumption .mcSpendsContainer {display: block;}
    .pageConsumption .mcSpendsContainer .pageLeft, .pageConsumption .mcSpendsContainer .pageRight {padding: 0 15px; width: 100%; padding-bottom: 20px;}
    .pageMenuSection .mcSpendsContainer {padding: 0;}
    .pageMenuSection .pageMenu {text-align: center;}
    .videoBlock {margin-left: -15px; margin-right: -15px;}
    .format5 .imageBlock img {width: 100%;}
    .pageConsumption .sectionTitle {padding: 0; margin-bottom: 20px;}
    .videoheading {padding: 8px 0 15px 16px;}
    .logoMenuBlock {padding: 10px;}
    .loginBlock {right: 20px;}
}


@media only screen and (max-width: 480px) {
    .viewAll {font-size: 12px; line-height: 15px; top: 6px;}
    .viewAll span {margin-top: 5px;}
    .viewAll svg {width: 10px;}
    .sectionTitle {font-size: 22px; line-height: 25px;}
    .format2 .imageBlock {width: 148px; height: 83px; margin-bottom: 10px;}
    .format2 .caption {font-size: 12px; line-height: 15px;}
    .format1 .caption, .format2 .caption {font-size: 12px; font-weight: 600;}
    .format1 .caption {font-size: 13px; line-height: 17px;}
    .format1 .headline, .format1 .headline a {font-size: 20px; line-height: 24px; margin: 10px 0;}
    .format1 .contentBlock {margin-top: 10px;}
    .format1 .content {font-size: 14px; line-height: 20px; margin-bottom: 10px;}    
    .caption {font-size: 13px; line-height: 17px;}
    .format3 .leftBlock .headline, .format3 .leftBlock .headline a {font-size: 20px; line-height: 24px; margin: 8px 0 8px;}
    .paragraph {font-size: 14px; line-height: 20px;}
    .format3 .rightBlock .imageBlock {height: 105px; margin-bottom: 10px;}
    .format3 .rightBlock .contentBlock .caption {font-size: 12px; line-height: 15px;}
    .headline, .headline a {font-size: 16px; line-height: 18px;}
    .format3 .rightBlock li {margin-bottom: 10px; width: 185px;}
    .videoIcon {width: 32px; height: 32px; bottom: 15px; left: 15px;}
    .videoIcon svg {width: 32px; height: 32px;}
    .messageBox .headline, .messageBox .headline a {font-size: 20px; line-height: 24px; margin: 6px 0;}
    .messageBox .paragraph {font-size: 14px; line-height: 20px;}
    .exploreSection .contentBlock {padding: 25px;}
    .exploreSection .contentBlock .caption {font-size: 20px; line-height: 23px;}
    .exploreSection .contentBlock .headline {font-size: 30px; line-height: 34px; margin: 5px 0;}
    .exploreSection .contentBlock .paragraph {font-size: 14px; line-height: 18px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden;}
    .exploreBtn {width: 98px; height: 32px; font-size: 14px; line-height: 18px;}
    .exploreSection .mcSpendsContainer {height: 295px;}
    .newLaunchesSection .format2 .imageBlock {width: 150px; height: 85px;}
    .list4 ul {gap: 15px;}
    .hotelsList ul {flex-wrap: wrap; margin: 15px; gap: 10px;}
    .hotelsList ul li {width: 48%; margin-bottom: 5px; height: 255px;}
    .hotelsList .imageBlock, .hotelsList .imageBlock img {width: 100%; height: 255px;}
    .hotelsList ul li:last-child {margin-right: 0;}
    .hotelsList .contentBlock .caption {font-size: 12px;}
    .hotelsList .contentBlock .headline {font-size: 18px; line-height: 18px;}
    .hotelsList .contentBlock .by {font-size: 12px;}
    .theLustSection .format2 .imageBlock {width: 150px; height: 85px;}
    .theLustSection .format2 .headline {font-size: 16px; line-height: 18px;}
    .theLustSection .format2 .by {font-size: 12px;}
    .soExpensiveSection .leftBlock .imageBlock, .soExpensiveSection .leftBlock .imageBlock img {height: 235px;}
    .soExpensiveSection .leftBlock .contentBlock {padding: 15px 15px 25px 15px;}
    .soExpensiveSection .leftBlock .contentBlock .headline {font-size: 20px; line-height: 24px;}
    .soExpensiveSection .leftBlock .contentBlock .by {font-size: 12px;}
    .soExpensiveSection .rightBlock .imageBlock {width: 100%; height: 85px;}
    .moreinspendList ul li .caption {font-size: 12px;}
    .moreinspendList ul li .headline, .moreinspendList ul li .headline a {font-size: 16px; line-height: 18px;}
    .by {font-size: 12px;}
    .moreinspendList ul li .imageBlock {width: 150px;}
    .moreinspendList ul li:last-child {margin-right: 15px;}
    .soExpensiveSection .rightBlock .headline, .soExpensiveSection .rightBlock .paragraph {font-size: 16px; line-height: 18px;}
    .pageHeadline {font-size: 30px; line-height: 34px;}
    .pagePara {font-size: 14px; line-height: 24px; margin-bottom: 10px;}
    .pageConsumption .by {font-size: 14px; margin: 20px 0 10px 0;}
    .dash {width: 30px; vertical-align: middle; margin-right: 7px;}
    .pageConsumption .caption {font-size: 12px; padding-left: 37px;}
    .videoBlock iframe {height: 235px;}
    .videoheading {font-size: 12px; padding: 0 15px;}
    .format5 .contentBlock .headline, .format5 .contentBlock .headline a {font-size: 18px;}
    .format5 .contentBlock .paragraph {font-size: 14px;}
    .pageConsumption .format2 {padding-left: 0;}
    .listing .contentBlock {font-size: 12px; line-height: 15px;}
    .listing {margin-bottom: 20px;}
    .listing ul {gap: 15px;}
    .listing ul li .imageBlock {width: 170px;}
    .format4 ul li .contentBlock, .format4 ul li .contentBlock a {font-size: 14px; line-height: 20px;}
    .mainMenuBlock ul li a {font-size: 13px; line-height: 17px;}
    .mainMenuBlock ul li.active a {padding: 4px 10px;}
    .mainMenuBlock ul li:hover a {border-bottom: 0;}
    .format3 .leftBlock .imageBlock, .format3 .leftBlock .imageBlock img {height: 234px;}
    .editorsPic .imageBlock, .editorsPic .imageBlock img {height: 220px; width: 100%;}
    .format3 .bottomBlock .format2 li .imageBlock {width: 150px; height: 85px;}
    .mainMenuBlock ul li {padding: 3px 3px 6px;}
    .format1 .paragraph {margin-bottom: 15px;}
    .pageRight .format4 {border-top: 0;}
    .headerSection .mcSpendsContainer {padding: 0 15px;}
    .logoMenuBlock {height: 70px; padding: 0 0 5px 0;}
    .loginBlock {right: 0; bottom: 0;}
    .loginBlock span {display: none;}
    .list4.format2 ul li {width: 185px;}
    .adBlock {padding-bottom: 45px;}
}


@media only screen and (max-width: 360px) {
    .listing ul li .imageBlock {width: 158px;}
}