.hori-scroll-wrap {
  overflow-x: hidden;
  position: relative;
}
 
.sc-container {
  display: flex;
  width: 220vw; 
  overflow:hidden;
  padding-top:7vw;
 
}
 
 
.sc-container section {
 width: 35vw;
 padding: 0;
 display: flex;
 /* justify-content: center; */
 /* border-left: 1px solid var(--black); */
 margin: 0 8px;
}
 
.sc-container section:after{ position: absolute; content: ''; width: 100%; height: 0; left: 0px; top:0px; z-index: 0; -webkit-transition: all 300ms ease-in-out;-moz-transition: all 300ms ease-in-out;transition: all 300ms ease-in-out;
background: linear-gradient(to bottom,  rgba(75,29,40,0.65) 0%,rgba(75,29,40,0) 100%); 
}
.sc-container section:hover:after{ height: 100%;}
.sc-container section {
height:70vh;
}
 
 .merid-marker-scroller-start, .merid-marker-scroller-end, .merid-marker-start, .merid-marker-end{
 display:none !important;
 text-indent:-999999999px  !important;
 font-size:0  !important;
 }

.folio-wrap{display: flex;padding: 2vw;flex-direction: column;justify-content: space-between;width: 100%; position: relative; z-index: 1;}
.folio-wrap h2{color: var(--white);font-family: var(--heading-font);font-size: 71px;line-height: 60px; position: relative; padding-bottom: 15px; }
.folio-wrap h2:after{ position: absolute; content: ''; width: 0; height: 2px; left: 0px; bottom: 0px; background-color: var(--secondary-color);  -webkit-transition: all 300ms ease-in-out;-moz-transition: all 300ms ease-in-out;transition: all 300ms ease-in-out;}
.folio-wrap:hover h2:after{ width: 100%;  -webkit-transition: all 600ms ease-in-out;-moz-transition: all 600ms ease-in-out;transition: all 600ms ease-in-out;;}
.folio-wrap h2 span{
    font-size: 31px;
    display: block;
    text-transform: uppercase;
}
.folio-wrap p{margin-bottom: 0;color: var(--white);border-top: 2px solid var(--white);padding-top: 30px;}

.scroll-bg-1, .scroll-bg-2, .scroll-bg-3, .scroll-bg-4, .scroll-bg-5, .scroll-bg-6, .scroll-bg-7, .scroll-bg-8, .scroll-bg-9, .scroll-bg-10, .scroll-bg-11, .scroll-bg-12, .scroll-bg-13,
.scroll-bg-14, .scroll-bg-15, .scroll-bg-16, .scroll-bg-17, .scroll-bg-18, .scroll-bg-19, .scroll-bg-20{ background-repeat: no-repeat; background-position: center; background-size: cover;}
.scroll-bg-1{ background-image: url(../images/menu-1.jpg);}
.scroll-bg-2{ background-image: url(../images/menu-2.jpg);}
.scroll-bg-3{ background-image: url(../images/menu-3.jpg);}
.scroll-bg-4{ background-image: url(../images/menu-4.jpg);}
.scroll-bg-5{ background-image: url(../images/menu-5.jpg);}
.scroll-bg-6{ background-image: url(../images/menu-6.jpg);}
.scroll-bg-7{ background-image: url(../images/menu-7.jpg);}
 

@media only screen and (max-width: 1180px) {
.folio-wrap h2 { font-size: 42px;line-height: 42px;}
.folio-wrap h2 span {
    font-size: 20px;}
}

 @media only screen and (max-width: 767px) {
.sc-container section {
    width: 48vw;}
 }

 @media only screen and (max-width: 640px) {
 .sc-container section {
  width: 70vw; 
}
 }

@media only screen and (max-width: 575px) {
.sc-container section {
    height: 500px;
}
    .sc-container section {
        width: 220vw;
    }
    .sc-container {

  width: 340vw;}
}