/*========================================================
	Main Style for Original New York Deli 2025
=========================================================*/
/* colors declaration */
:root {
    --ecru: #f4ede5;
    --bgcolor: #eee7d4;
    --yellow: #ffbe22;
    --red: #e9401f;
    --black: #000;
    --white: #fff;
    --txt: #1a1917;
    --bord: #bab5af;
    --lightecru: #f5f1e6;
    --green: #038658;
    --grSmBox: #F5F0E6;
    --cream: #f4f0e5;
    --foo: #1a1917;
}

/* fonts declaration */
@font-face {
    font-family: dmserifreg;
    src: url("../fonts/DMSerifText-Regular.ttf");
}
@font-face {
    font-family: latoregular;
    src: url("../fonts/Lato-Regular.ttf");
}
@font-face {
    font-family: latomedium;
    src: url("../fonts/Lato-Medium.ttf");
}
@font-face {
    font-family: latobold;
    src: url("../fonts/Lato-Bold.ttf");
}
@font-face {
    font-family: latoitalic;
    src: url("../fonts/Lato-Italic.ttf");
}
@font-face {
    font-family: nightfall;
    src: url("../fonts/Nightfall.ttf");
}


@font-face {
    font-family: gotham-regular;
    src: url("../fonts/Gotham-Book.ttf");
}
@font-face {
    font-family: gotham-medium;
    src: url("../fonts/Gotham-Medium.ttf");
}
@font-face {
    font-family: gotham-bold;
    src: url("../fonts/Gotham-Bold.ttf");
}
@font-face {
    font-family: expend;
    src: url("../fonts/expend.bold.ttf");
}
@font-face {
    font-family: barbershop;
    src: url("../fonts/Barbershop-in-Thailand.ttf");
}

/*========================================================
										RESET
=========================================================*/
html,
body,
div,
span,
h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
abbr,
address,
em,
img,
sub,
sup,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
caption,
article,
aside,
figcaption,
footer,
header,
hgroup,
menu,
nav,
section,
time,
mark,
audio,
video {
    margin: 0;
    padding: 0;
    border: 0;
    outline: 0;
    vertical-align: baseline;
}

ol,
ul {
    list-style: none;
}

a {
    text-decoration: none;
    color: inherit;
}

*:focus {
    outline: none;
}

* {
    box-sizing: border-box;
}

input[type='submit'] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
/* end reset */
/***********************************************************************************************/

/*========================================================
                      Main Styles
=========================================================*/
body {
    background: #e3e3e3;
    font-family: gotham-regular, arial, sans-serif;
    color: var(--txt);
    font-size: 21px;
}
li {
    list-style-type: none;
}
a {
    text-decoration: none;
}
.clear {
    clear: both;
}
.inline-text {
    font-weight: 700;
}
h1, h2, h3 {
  font-family: dmserifreg, arial, sans-serif;
  text-transform: capitalize;
}
h1, h2{
  font-size: 56px;
}
h3 {
  font-size: 38px;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
    body {
        font-size: 18px;
    }
    h1, h2{
      font-size: 48px;
    }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
    body {
        font-size: 18px;
    }
    h1, h2{
      font-size: 46px;
    }
    h3{
      font-size: 30px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
    body {
        font-size: 18px;
    }
    h1, h2{
      font-size: 38px;
    }
    h3{
      font-size: 30px;
    }
}
@media only screen and (max-width: 767px) {
    body {
        font-size: 18px;
    }
    h1, h2{
      font-size: 36px;
    }
    h3{
      font-size: 24px;
    }
}
/*=======================================================
                       Main Layout
=========================================================*/
.bodyFrame {
    max-width: 100%;
    margin: 0 auto;
}
.pageFull {
    width: 100%;
}
.pageSize {
    width: 75%;
    max-width: 1310px;
    margin: 0 auto;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
  .pageSize {
      width: 90%;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .pageSize {
      width: 94%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .pageSize {
      width: 90%;
  }
}
@media only screen and (max-width: 767px) {
  .pageSize {
      width: 90%;
  }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {}
@media only screen and (max-width: 479px) {}

/*========================================================
									TOP & NAVIGATION
=========================================================*/
/* not display on large screen */
.smobitrigger,
.mnuclose,
.menu ul li.mlogo,
.menu ul li.mphone,
.menu ul li.mhours,
.menu ul li.msocial,
.menu ul li.mmlinks,
.menu ul li.maddress,
.menu ul li.mline,
.menu ul li.mphoneLocations,
.menu ul li.mname,
.menu ul li.maddSpaceMobMenu,
.menu ul li.mbtnPlaceMob,
.telMob,
.logoMob,
.hoursNav {
    display: none;
}
/* top section  */
.top {
    width: 100%;
    display: block;
    position: static;
    background: var(--white);
    box-shadow: 0px 8px 24px -20px rgba(165, 165, 173, 1);
}
.boxesWrap {
    width: 75%;
    max-width: 1500px;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 100px;
}
.boxes {
    height: 100px;
}
.one {
    width: 15%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
}
.one img {
  display: block;
  width: 115px;
}
.two {
    width: 62%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.three {
    width: 23%;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.topPhone {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    width: 100%;
}
.topTel {
  font-family: gotham-medium, arial, sans-serif;
  font-size: 24px;
  display: flex;
  align-items: center;
  padding-left: 60px;
  min-height: 50px;
}
.menu ul li.dlink {
    font-family: gotham-medium, arial, sans-serif;
    font-size: 21px;
    display: inline-block;
    text-transform: capitalize;
    line-height: 1.5;
    padding: 0 20px;
}
.menu ul li.dlink a:hover {
    color: var(--red);
}
/*.menu ul > li:nth-child(2 of .dlink) {
    margin-right: 60px;
}*/
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
  .boxesWrap {
  	width: 90%;
    height: 80px;
  }
  .menu ul li.dlink {
  	font-size: 21px;
  }
  .topTel {
    font-size: 22px;
  	background-size: 45px 45px;
  }
    .one img {
        width: 92px;
    }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .boxesWrap {
  	width: 94%;
    height: 80px;
  }
  .one img {
  	width: 90px;
  }
  .two {
  	width: 66%;
  }
  .three {
  	width: 19%;
  }
  .menu ul li.dlink {
  	font-size: 18px;
    padding: 0 10px;
  }
  .topTel {
  	background-size: 42px 42px;
  	font-size: 18px;
  	padding-left: 35px;
  	min-height: 50px;
  }

}
@media only screen and (max-width: 1023px) {
}
/*========================================================
									Buttons
=========================================================*/
.orderBtn {
  background: var(--green);
  border-radius: 35px;
  color: var(--white);
  cursor: pointer;
  display: inline-block;
  font-family: latoregular, arial, sans-serif;
  font-size: 17px;
  text-align: center;
  text-transform: capitalize;
  padding: 15px 30px;
}
.deliBtn {
  background: var(--white);
  border-radius: 35px;
  color: var(--black);
  cursor: pointer;
  display: inline-block;
  font-family: gotham-medium, arial, sans-serif;
  font-size: 19px;
  text-align: center;
  text-transform: capitalize;
  padding: 15px 45px;
}
.ordSectBtn {
  background: var(--green);
  border-radius: 35px;
  color: var(--white);
  cursor: pointer;
  display: inline-block;
  font-family: gotham-medium, arial, sans-serif;
  font-size: 19px;
  text-align: center;
  text-transform: capitalize;
  padding: 15px 45px;
}
.orderTopBtn {
  background: var(--green);
  border-radius: 35px;
  color: var(--white);
  cursor: pointer;
  display: inline-block;
  font-family: latoregular, arial, sans-serif;
  font-size: 20px;
  text-align: center;
  text-transform: capitalize;
  padding: 6px 30px;
}
.orderTopBtn:hover{
  color: var(--black)!important;
}
.menuBtn {
  background: transparent;
  border: 1px solid var(--txt);
  border-radius: 35px;
  color: var(--txt);
  cursor: pointer;
  display: inline-block;
  font-family: latoregular, arial, sans-serif;
  font-size: 17px;
  text-align: center;
  text-transform: capitalize;
  padding: 15px 30px;
}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
    .orderBtn,
    .menuBtn {
        font-size: 16px;
    }
    .deliBtn,
    .ordSectBtn{
      font-size: 17px;
    }
    .orderTopBtn{
        font-size: 20px;
    }

}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
    .orderBtn,
    .menuBtn {
        font-size: 16px;
        padding: 10px 20px;
    }
    .deliBtn,
    .ordSectBtn{
      font-size: 17px;
      padding: 10px 35px;
    }
    .orderTopBtn{
        font-size: 17px;
        padding: 6px 20px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .orderBtn,
    .menuBtn {
        font-size: 16px;
        padding: 10px 20px;
    }
    .deliBtn,
    .ordSectBtn{
      font-size: 17px;
      padding: 10px 35px;
    }
    .orderTopBtn{
        font-size: 16px;
        padding: 10px 20px;
    }
}
@media only screen and (max-width: 767px) {}
@media only screen and (max-width: 479px) {
    .orderBtn,
    .menuBtn {
        font-size: 16px;
        padding: 10px 15px;
    }
    .deliBtn,
    .ordSectBtn{
      font-size: 17px;
      padding: 10px 35px;
    }
    .orderTopBtn{
        font-size: 16px;
        padding: 10px 15px;
    }
}

/*========================================================
		Index Explore Menu Section
=========================================================*/
.mDrinksMob {
   display: none;
}
.mainTit {
    padding: 90px 0 50px;
    text-align: center;
}
.mainTit h2 {
    font-size: 68px;
    font-weight: 400;
}
.mainTit h2 span {
    display: block;
    font-family: latoregular, arial, sans-serif;
    font-size: 18px;
}
.browseMenuSec {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
}
.browseMenuCol1,
.browseMenuCol2 {
    width: 49%;
}
.menuPlatesWrap {
    background: var(--white);
    padding: 20px;
    border-radius: 25px;
    margin-bottom: 35px;
}
.menuPlatesWrap img {
    width: 100%;
    display: block;
    border-radius: 15px;
}
.mPlatesDescWrap {
    padding: 10px 0;
    width: 100%;
    display: flex;
    align-items: center;
    border-bottom: 1px solid var(--bord);
}
.mPlatesDescLeft {
    width: 40%;
}
.mPlatesDescRight {
    width: 60%;
    border-left: 1px solid var(--txt);
}
.mPlatesDescLeft p {
    font-size: 56px;
    font-family: dmserifreg, arial, sans-serif;
    text-align: left;
    text-transform: capitalize;
}
.mPlatesDescRight p {
    font-size: 19px;
    font-family: latoitalic, arial, sans-serif;
    line-height: 1.3;
    text-align: left;
    padding-left: 20px;
}
.mMenuPosWrap {
    width: 100%;
    display: flex;
    padding: 15px 0;
    border-bottom: 1px solid var(--bord);
}
.mMenuPosDesc {
    width: 80%;
}
.mMenuPosPrice {
    width: 20%;
    display: flex;
    justify-content: flex-end;
}
.mMenuPosDesc p,
.mMenuPos2Desc p {
    font-size: 22px;
    font-family: latobold, arial, sans-serif;
}
.mMenuPosDesc p span,
.mMenuPos2Desc p span {
    padding-top: 10px;
    font-size: 19px;
    line-height: 1.3;
    display: block;
    font-family: latoregular, arial, sans-serif;
}
.mMenuPosPrice p {
    font-family: dmserifreg, arial, sans-serif;
    font-size: 22px;
}
.mMenuPosLast {
    border-bottom: none;
}
.mMenuBtnsWrap {
    margin: 25px 0 10px;
    text-align: left;
}
.explmenu {
    margin-left: 20px;
}
.mMenuPos2Desc,
.mMenuPos2Price {
    width: 50%;
}
.mMenuPos2Price {
    display: flex;
}
.mMenuPos2Half p,
.mMenuPos2Half2 p .mMenuspec1 {
   font-family: latoregular, arial, sans-serif;
    font-size: 18px;
    text-align: right;
    text-transform: capitalize;
}
.mMenuPos2Half p span,
.mMenuPos2Half2 p .mMenuspec2 {
    font-family: dmserifreg, arial, sans-serif;
    font-size: 22px;
    margin-left: 10px;
}
.mMenuPos2Half {
    width: 49%;
    display: flex;
    justify-content: flex-end;
}
.menuPlates2Wrap {
    background: var(--red);
    border-radius: 25px;
    margin-bottom: 35px;
    position: relative;
    width: 100%;
}
.mSidesWrap {
    padding: 20px;
}
.mSidesPos {
    width: 45%;
    position: relative;
}
.mSidesPos h3 {
    font-size: 56px;
    font-family: dmserifreg, arial, sans-serif;
    text-align: left;
    text-transform: capitalize;
    color: var(--ecru);
    border-bottom: 1px solid var(--ecru);
}
.mSidesPosWrap {
    display: flex;
    padding: 10px 0;
    border-bottom: 1px solid var(--ecru);
}
.mSidePosDesc {
    width: 45%;
}
.mSidesPosPrice {
    width: 55%;
}
.mSidePosDesc p {
    text-transform: capitalize;
    color: var(--ecru);
    font-size: 22px;
    font-family: latobold, arial, sans-serif;
    text-align: left;
}
.mSidesPosPrice p {
    color: var(--ecru);
    font-family: latoregular, arial, sans-serif;
    font-size: 19px;
    text-align: right;
}
.mSidesPosPrice p span {
    font-family: dmserifreg, arial, sans-serif;
    font-size: 22px;
    margin-left: 10px;
}
.mSidesSauce {
    position: absolute;
    bottom: 0;
    right: -185px;
    width: 163px;
}
.mSideBtns {
    margin: 50px 0 10px;
}
.mSideOrder {
    background: var(--yellow);
    border: 1px solid var(--yellow);
    color: var(--txt);
}
.mSideMenu {
    border: 1px solid var(--white);
    color: var(--white);
}
.mDrinksPos h3 {
    color: var(--txt);
    font-weight: 400;
}
.mDrinksPos {
    width: 60%;
}
.mDrinksPosDesc {
    width: 70%;
}
.mDrinksPosPrice {
    width: 30%;
}
.mDrinksPosDesc p,
.mDrinksPosPrice p {
    color: var(--txt);
}
.mDrinksPosDesc p span {
    padding-top: 10px;
    font-size: 18px;
    line-height: 1.3;
    display: block;
    font-family: latoregular, arial, sans-serif;
}
.mDrinksOrder {
    background: var(--red);
    border: 1px solid var(--red);
}
.menusmall {
    text-align: center;
    font-size: 18px;
    font-family: latoregular, arial, sans-serif;
    padding: 50px 0;
}
.menuTitSec {
    margin-top: 90px;
}
.mMenuPos2PriceSpecial2 {
    display: flex;
    flex-direction: column;
}
.mMenuPos2Half2 p {
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
.mMenuPos2Half2 p .mMenuspec1 {
    width: 70%;
    text-align: right;
}
.mMenuPos2Half2 p .mMenuspec2 {
    width: 30%;
    text-align: right;
}
.nMenuPosWrapNone {
    border-bottom: none;
}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
    .mainTit h2,
    .mPlatesDescLeft p{
        font-size: 52px;
    }
    .mMenuPosPriceAmount {
        font-size: 19px!important;
    }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
    .mainTit h2,
    .mPlatesDescLeft p{
        font-size: 52px;
    }
    .mainTit {
        padding: 60px 0 50px;
    }
    .mPlatesDescRight p,
    .mMenuPosDesc p span, .mMenuPos2Desc p span,
    .mSidesPosPrice p,
    .mSidesPosPrice p span,
    .mDrinksPosDesc p span {
        font-size: 16px;
    }
    .mMenuPosDesc p, .mMenuPos2Desc p,
    .mMenuPosPrice p,
    .mSidePosDesc p,
    .mMenuPos2Half2 p .mMenuspec2 {
        font-size: 18px;
    }
    .mMenuPos2Half p span {
        font-size: 18px;
    }
    .mMenuPos2Half p,
    .menusmall  {
        font-size: 16px;
    }
    .mMenuPosPriceAmount {
        font-size: 16px!important;
    }
    .mMenuPos2Half2 p .mMenuspec1 {
        font-size: 16px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .mainTit h2 {
        font-size: 42px;
    }
    .mPlatesDescLeft p,
    .mSidesPos h3 {
        font-size: 38px;
    }
    .mainTit {
        padding: 60px 0 50px;
    }
    .mPlatesDescRight p,
    .mMenuPosDesc p span, .mMenuPos2Desc p span,
    .mSidesPosPrice p,
    .mSidesPosPrice p span,
    .mDrinksPosDesc p span,
    .menusmall {
        font-size: 16px;
    }
    .mMenuPosDesc p, .mMenuPos2Desc p,
    .mMenuPosPrice p,
    .mSidePosDesc p,
    .mMenuPos2Half2 p .mMenuspec2 {
        font-size: 19px;
    }
    .mSidesSauce {
        width: 140px;
        right: -160px;
    }
    .menuPlatesWrap {
        margin-bottom: 20px;
    }
    .mMenuPos2Half p span {
      display: block;
        font-size: 19px;
    }

    .mMenuPos2PriceSpecial .mMenuPos2Half {
      width: 100%;
      display: flex;
      justify-content: flex-end;
      margin-bottom: 10px;
    }
    .mMenuPos2PriceSpecial .mMenuPos2Half p{
      display: block;
      width: 100%;
    }
    .mMenuPos2PriceSpecial{
      width: 50%!important;
      display: block;
    }
    .mMenuPosDesc {
        width: 70%;
    }
    .mMenuPosPrice {
        width: 30%;
    }
    .mMenuPosPriceAmount {
        font-size: 16px!important;
    }
    .mMenuPos2Half2 p .mMenuspec1 {
        font-size: 17px;
    }
}
@media only screen and (max-width: 767px) {
  .mainTit {
        padding: 35px 0;
    }
    .mainTit h2 {
        font-size: 48px;
    }
    .mainTit h2 span {
        line-height: 1.2;
        max-width: 360px;
        margin: 0 auto;
    }
    .browseMenuSec {
        flex-direction: column;
    }
    .browseMenuCol1, .browseMenuCol2 {
        width: 100%;
    }
    .mPlatesDescLeft p {
        font-size: 48px;
    }
    .mPlatesDescRight p {
        font-size: 16px;
    }
    .mMenuPosDesc p span, .mMenuPos2Desc p span {
        font-size: 18px;
    }
    .mMenuPosPrice p,
    .mMenuPos2Half2 p .mMenuspec2  {
        font-size: 21px;
    }
    .mSidesPos h3 {
        font-size: 48px;
    }
    .mPlatesDescLeft {
        width: 39%;
    }
    .mPlatesDescRight {
        width: 61%;
    }
    .mDrinksMob {
        position: absolute;
        top: 0;
        right: 0;
        width: 190px;
        display: block;
    }
    .menuPlates2Wrap {
        margin-bottom: 0;
    }
    .mMenuPos2Half p {
    	display: flex;
    	flex-direction: column;
    }
    .mMenuPos2Half p span {
        font-size: 21px;
    }

    .mMenuPos2PriceSpecial .mMenuPos2Half {
      width: 100%;
      display: flex;
      justify-content: flex-end;
      margin-bottom: 10px;
    }
    .mMenuPos2PriceSpecial .mMenuPos2Half p{
      display: block;
      width: 100%;
    }
    .mMenuPos2PriceSpecial .mMenuPos2Half p br{
      display: none;
    }
    .mMenuPos2PriceSpecial{
      width: 50%!important;
      display: block;
    }
    .mMenuPosDesc {
        width: 70%;
    }
    .mMenuPosPrice {
        width: 30%;
    }
    .mMenuPosPriceAmount {
        font-size: 17px!important;
    }
    .mMenuPos2PriceSpecial .mMenuPos2Half2 p {
        display: flex;
        width: 100%;
    }
    .mMenuPos2PriceSpecial .mMenuPos2Half2 .mMenuspec1 {
        width: 49%;
        display: flex;
        justify-content: flex-end;
    }

}
@media only screen and (max-width: 479px) {
    .mainTit {
        padding: 20px 0;
    }
    .mainTit h2 {
        font-size: 40px;
    }
    .mPlatesDescWrap {
        flex-direction: column;
    }
    .mPlatesDescLeft,
    .mPlatesDescRight {
        width: 100%;
    }
    .mPlatesDescLeft p,
    .mSidesPos h3,
    .mSidesPos h3 {
        font-size: 36px;
    }
    .mPlatesDescRight p {
        padding-left: 0;
    }
    .mPlatesDescRight {
        border-left: 0;
    }
    .menuPlatesWrap {
        padding: 10px;
    }
    .explmenu {
        margin-left: 5px;
    }
    .mMenuPosDesc p, .mMenuPos2Desc p {
        font-size: 21px;
    }
    .menuPlatesWrap {
        margin-bottom: 20px;
    }
    .mSidesSauce {
        width: 120px;
        right: -150px;
        bottom: 15px;
    }
    .mSidesWrap {
        padding: 15px;
    }
    .mDrinksMob {
        width: 150px;
        bottom: 70px;
        top: inherit;
    }
    .mMenuPos2Half2 p .mMenuspec2 {
        font-size: 18px;
    }
    .mMenuPos2Half2 p .mMenuspec1 {
        font-size: 16px;
    }
}

/*========================================================
		Index Catering Menu Section
=========================================================*/
.catMenuImg {
    width: 100%;
    display: block;
}
.catMenuSec {
    width: 100%;
    display: flex;
    margin-top: 25px;
}
.catMenuSecLeft {
    width: 60%;
}
.catMenuSecRight {
    width: 40%;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
.catMenuSecLeft h3 {
    font-size: 44px;
    font-family: dmserifreg, arial, sans-serif;
    text-align: left;
    text-transform: capitalize;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--bord);
    margin-bottom: 20px;
    font-weight: 400;
}
.catMenuSecLeft ul {
    display: inline-block;
}
.catMenuSecLeft ul li {
    font-family: latobold, arial, sans-serif;
    font-size: 22px;
    text-transform: capitalize;
    display: inline-block;
}
.lib {
    color: var(--red);
    margin: 0 25px;
}
.catMenuPrice {
    font-family: dmserifreg, arial, sans-serif;
    margin-left: 22px;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
    .catMenuSecLeft h3 {
        font-size: 34px;
    }
    .catMenuSecLeft ul li {
        font-size: 19px;
    }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
    .catMenuSecLeft h3 {
        font-size: 34px;
    }
    .catMenuSecLeft ul li {
        font-size: 19px;
    }
    .catMenuPrice {
        margin-left: 15px;
    }
    .lib {
        margin: 0 10px;
    }
    .catMenuSecLeft {
        width: 65%;
    }
    .catMenuSecRight {
        width: 35%;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .catMenuSecLeft h3 {
        font-size: 34px;
    }
    .catMenuSecLeft ul li {
        font-size: 16px;
    }
    .catMenuPrice {
        margin-left: 15px;
    }
    .lib {
        margin: 0 10px;
    }
    .catMenuSecLeft {
        width: 65%;
    }
    .catMenuSecRight {
        width: 35%;
    }
    .catMenuSec {
        flex-direction: column;
    }
    .catMenuSecLeft,
    .catMenuSecRight {
        width: 100%;
    }
    .catMenuSecRight {
        margin-top: 35px;
        justify-content: flex-start;
    }
}
@media only screen and (max-width: 767px) {
  .catMenuSec {
        flex-direction: column;
    }
    .catMenuSecLeft,
    .catMenuSecRight {
        width: 100%;
    }
    .catMenuSecLeft h3 {
        font-size: 36px;
        text-align: center;
    }
    .catMenuSecLeft ul li {
        font-size: 18px;
    }
    .catMenuPrice {
        display: block;
        margin-left: 0;
    }
    .lib {
        display: none;
    }
    .catMenuSecLeft ul {
        text-align: center;
        width: 100%;
        margin: 0 auto 30px;
    }
    .catListct {
        margin: 0 20px;
    }
    .catMenuWrapLast {
        margin-bottom: 0;
    }
}
@media only screen and (max-width: 479px) {
    .catMenuSecLeft h3 {
        font-size: 26px;
    }
    .catMenuSecLeft ul li {
        display: block;
        padding-bottom: 10px;
    }
    .catMenuWrapLast {
        padding-bottom: 20px;
    }
}

/*========================================================
		Index Find Us Section
=========================================================*/
.findWrap {
    background: var(--lightecru);
    padding: 20px;
    border-radius: 25px;
    margin-bottom: 35px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center;
}
.findMap,
.findData {
    width: 48%;
}
.findMap iframe {
    width: 100%;
    display: block;
    border-radius: 20px;
    height: 550px;
}
.findData {
    padding: 50px 0;
}
.findData h3 {
    font-size: 40px;
    font-family: expend, arial, sans-serif;
    text-align: left;
    text-transform: capitalize;
    padding-bottom: 35px;
    font-weight: 400;
}
.findData p {
    font-family: latobold, arial, sans-serif;
    font-size: 22px;
    text-transform: capitalize;
    padding: 10px 0;
}
.findData ul {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--bord);
}
.findData ul li {
    font-size: 18px;
    padding: 2px 0;
}
ul.adr li span {
    display: block;
}
ul.tel {
    border-bottom: none;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
    .findData h3 {
        font-size: 36px;
    }
    .findData p {
        font-size: 21px;
    }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
    .findData h3 {
        font-size: 34px;
    }
    .findData ul li {
        font-size: 16px;
    }
    .findData p {
        font-size: 19px;
    }
    .findMap iframe {
        height: 450px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .findData h3 {
        font-size: 27px;
    }
    .findData ul li {
        font-size: 16px;
    }
    .findData p {
        font-size: 19px;
    }
    .findMap iframe {
        height: 450px;
    }
}
@media only screen and (max-width: 767px) {
    .findWrap {
        flex-direction: column;
        border-radius: 0;
        padding: 0;
        margin-bottom: 30px;
    }
    .findMap, .findData {
        width: 100%;
    }
    .findMap iframe {
      height: 250px;
        border-radius: 0;
    }
    .findData {
        padding: 20px;
    }
    .findData h3 {
        font-size: 26px;
        padding-bottom: 15px;
    }
}

/*========================================================
		FOOTER section
=========================================================*/
.onlyContactFooter .footerBg{
  margin: 0 0 0;
}
.footerBg{
  background: var(--foo);
  color: var(--white);
  padding-top: 90px;
}
.footerWrap{
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  padding: 0 35px 40px;
}
.fooLogo a img {
    width: 140px;
    display: block;
}
.fooMenu ul li.mlogo,
.fooMenu ul li.mphone,
.fooMenu ul li.maddress,
.fooMenu ul li.mline,
.fooMenu ul li.mphoneLocations,
.fooMenu ul li.mname,
.fooMenu ul li.maddSpaceMobMenu,
.fooMenu ul li.mbtnPlaceMob,
.fooMenu ul li.hoursNav,
.fooMenu ul li.msocial,
.fooMenu ul li.dlink .orderTopBtn{
  display: none;
}
.fooMenu ul li.dlink{
  display: inline-block;
  font-family: gotham-medium, arial, sans-serif;
  font-size: 21px;
  margin: 0 20px 0;
  text-transform: capitalize;
  color: var(--white);
}
.fooOne{
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-items: center;
}
.fooOne p{
  font-size: 21px;
    line-height: 1.3;
    color: var(--white);
    width: 420px;
}
.fooOne p{
  width: 40%;
  margin-left: 30px;
}
.fooOne p span{
  font-weight: 700;
}
.fooSocial{
  margin: 38px 0 0;
}
.fooSocial img{
  margin-right: 10px;
}

.fooHours .hoursNav{
  display: flex;
  justify-content: space-between;
  font-size: 20px;
  line-height: 1.1;
  font-weight: 400;
  color: var(--ecru);
  max-width: 300px;
  margin: 15px 0 10px;
}
.fooHours{
  margin-bottom: 30px;
}
.fooHours ul li {
    color: var(--ecru);
}
.fooHours .hoursNav span{
  display: block;
}
.fooHours .hoursNav strong{
  min-width: 120px;
}
.fooHours .hoursNav .hourCell{
  min-width: 170px;
  text-align: left;
}
.fooHours p span {
    display: block;
}
.fooThree .fooAdr {
    line-height: 1.4;
    margin-bottom: 20px;
    color: var(--ecru);
}
.fooAdr span {
  display: block;
}
.fooPhone {
    margin: 0 0 20px;
    color: var(--ecru);
}


.fooWrap2{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  border-top: 1px solid var(--white);
  padding: 50px 35px;
}
.fooBox{
  width: 33%;
}
.fooBox h5,
.hoursTitle{
  font-family: expend, arial, sans-serif;
  font-size: 22px;
  margin: 0 0 20px;
}
.phoneFoo{
  font-family: gotham-medium, arial, sans-serif;
  margin: 0 0 10px;
}
.adrFoo{
  margin: 0 0 20px;
}
.adrFoo span{
  display: block;
}
.ordOnlFooBtn{
  margin: 20px 0 0;
}

.fcopy {
  border-top: 1px solid var(--white);
  padding: 30px 0 60px;
  font-size: 18px;
  text-align: center;
    color: var(--ecru);
}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
  .fooHours .hoursNav {
    font-size: 18px;
  }
  .fooOne p,
  .fooMenu ul li.dlink {
    font-size: 18px;
  }
  .fooBox h5,
  .hoursTitle {
    font-size: 20px;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .footerBg {
  	margin: 0 0 0;
      padding-top: 60px;
  }
  .footerWrap{
    padding: 0 20px 40px;
  }
  .fooWrap2 {
  	padding: 50px 20px;
  }
  .fooOne{
    width: 40%;
  }
  .fooLogo a img {
  	width: 100px;
  	display: block;
  }
  .fooHours .hoursNav {
  	font-size: 18px;
  }
  .fcopy {
  	font-size: 16px;
  }
    .fooOne p,
    .fooMenu ul li.dlink {
        font-size: 18px;
    }
    .fooMenu ul li.dlink{
      margin: 0 10px 0;
    }
    .fooBox h5, .hoursTitle {
    	font-size: 19px;
    }
    .fooSocial {
        margin-top: 40px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .footerBg {
  	margin: 0 0 0;
      padding-top: 50px;
  }
  .footerWrap{
    padding: 0 10px 40px;
  }
  .fooWrap2 {
  	padding: 50px 10px;
  }
  .fooLogo a img {
  	width: 100px;
  	display: block;
  }
  .fooOne{
    margin: 0 0 20px;
  }
  .fooOne p,
  .fooMenu ul li.dlink,
  .fooHours .hoursNav{
  	font-size: 16px;
  }
  .fooBox h5, .hoursTitle {
  	font-size: 17px;
  }
  .fooHours .hoursNav strong {
  	min-width: 100px;
  }
  .fcopy {
  	font-size: 16px;
  }
    .fooPhone,
    .fooThree .fooAdr,
    .fooHours ul li {
        font-size: 16px;
    }
     .fooSocial {
        margin-top: 40px;
    }
}
@media only screen and (max-width: 767px) {
  .footerBg {
  	  margin: 0;
      padding-top: 35px;
  }

  .footerWrap{
    flex-direction: column;
    padding: 0 10px 0;
    align-items: flex-start;
  }
  .fooWrap2{
    padding: 50px 10px;
  }
  .fooLogo a img {
  	width: 110px;
  }
  .fooTwo{
    margin: 30px 0;
    padding: 10px 0 0;
  }
  .fooOne p,
  .fooMenu ul li.dlink,
  .fooHours .hoursNav{
  	font-size: 18px;
    text-align: center;
  }
  .fooMenu ul li.dlink .orderTopBtn{
    margin: 20px 0 0;
  }
  .fooOne p {
  	width: 54%;
  	margin-left: 20px;
    text-align: left;
  }
  .fooMenu ul li.dlink{
    display: block;
    font-size: 19px;
    text-align: left;
    margin: 0 0 15px;
  }

    .fooSocial {
        margin: 35px auto 0;
        display: flex;
        justify-content: center;
    }
  .fooHours .hoursNav strong {
  	min-width: 100px;
  }
  .fooHours .hoursNav {
  	max-width: 275px;
  }
  .fcopy {
  	font-size: 16px;
    line-height: 1.5;
    padding: 40px 0 30px;
  }
  .fcopy p span{
    display: block;
  }
    .fooThree {
        display: flex;
        align-items: center;
        flex-direction: column;
    }
    .fooThree .fooAdr {
        text-align: center;
    }
    .fooHours {
        text-align: center;
    }
    .fooMenu ul li.dlink .orderTopBtn{
      display: inline-block;
    }
    .fooOrder{
      display: none;
    }
    .fooBox{
      width: 100%;
      margin: 0 0 40px;
      border-bottom: 1px solid var(--white);
      padding: 0 0 40px;
    }
    .fooBox:nth-child(3){
      margin: 0 0 0;
      border-bottom: none;
      padding: 0 0 0;
    }
    .fooBox h5,
    .hoursTitle {
    	font-size: 19px;
      margin: 0 0 12px;
    }
}
@media only screen and (max-width: 479px) {

}
/*========================================================
     Menu Page
=========================================================*/
.browseMenuSecMobile,
.browseMenuSecCaterMobile {
    display: none!important;
}
.menubg {
    padding: 50px 0 60px;
}
.subMainTit h1 {
  font-family: expend, arial, sans-serif;
    padding: 35px 0;
    font-size: 54px;
    font-weight: 400;
    text-align: center;
}
.menuTitWrap {
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
}
.menuTitLeft p {
    font-size: 46px;
}
.menuTitLeft,
.menuTitRight {
    width: 100%;
}
.menuTitRight {
    border-left: 0;
}
.menuTitRight p {
    padding-left: 0;
}
.browseMenuSecDesktop {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.browseMenuSecCaterDesktop {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    max-height: 1920px;
}
.menuSiteBox {
    width: 49%;
}
.caterTit {
    text-align: center;
}
.caterTit p {
    text-transform: uppercase;
    margin-bottom: 75px;
}
.caterTit p span {
    display: block;
    font-weight: 900;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
   .menubg {
        padding: 20px 0;
    }
    .subMainTit h1 {
        font-size: 48px;
    }
    .menuTitLeft p {
        font-size: 38px;
    }
    .mPlatesDescRight p {
        font-size: 18px;
    }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
    .menubg {
        padding: 20px 0;
    }
    .subMainTit h1 {
        font-size: 48px;
    }
    .menuTitLeft p {
        font-size: 38px;
    }
    .mPlatesDescRight p {
        font-size: 18px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .menubg {
        padding: 0;
    }
    .subMainTit h1 {
        font-size: 48px;
    }
    .menuTitLeft p {
        font-size: 38px;
    }
    .mPlatesDescRight p {
        font-size: 18px;
    }
}
@media only screen and (max-width: 767px) {
   .menubg {
        padding: 0;
    }
    .subMainTit h1 {
        font-size: 48px;
    }
    .menuTitLeft p {
        font-size: 38px;
    }
    .mPlatesDescRight p {
        font-size: 18px;
    }
    .browseMenuSecDesktop,
    .browseMenuSecCaterDesktop{
        display: none!important;
    }
    .browseMenuSecMobile {
        display: flex!important;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        width: 100%;
        padding-bottom: 35px;
    }
    .browseMenuSecCaterMobile {
        display: flex!important;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
        width: 100%;
        padding-bottom: 35px;
    }
    .menuSiteBox {
        width: 100%;
    }
    .caterTit p {
        margin-bottom: 50px;
    }
}
@media only screen and (max-width: 479px) {
    .subMainTit h1 {
        font-size: 32px;
    }
    .menuTitLeft p {
        font-size: 30px;
    }
    .mPlatesDescRight p {
        font-size: 16px;
    }
    .menuSiteBox {
        padding: 10px 10px 20px 10px;
    }
    .mMenuPosPrice p,
    .mMenuPos2Half p span,
    .mMenuPos2Half2 p span {
        font-size: 18px;
    }
}

/*========================================================
    CONTACT page
=========================================================*/
.contactbg {
    padding: 80px 0;
}

.contnWrap {
    width: 90%;
    margin: 200px auto 90px;
    display: flex;
}

.contnWrap-center{
    max-width: 750px;
    margin: 0 auto;
    width: 100%;
}
.mt-50{margin-top: 50px !important;}
.pb-0{padding-bottom: 0 !important;}

.contnLeft,
.contnRight {
    width: 50%;
}

.contnLeft {
    padding-top: 90px;
}

.contnH2 {
    font-size: 48px;
    font-family: futuram, arial, sans-serif;
    text-align: center;
    text-transform: capitalize;
    color: var(--black);
    padding-bottom: 35px;
}

.contactWrap {
    text-align: center;
}

.contactWrap h1 {
    font-family: barlowextrabold, arial, sans-serif;
    font-size: 48px;
    text-transform: uppercase;
    color: var(--mainblue);
}

.contactWrap h1 span {
    font-size: 123px;
    line-height: 1;
    display: block;
}

.contTel {
    font-size: 48px;
    color: var(--orange);
    text-align: center;
    padding: 5px 0 25px;
    font-family: poppins-semi, arial, sans-serif;
}

.contAdr,
.contHours {
    font-size: 28px;
    line-height: 1.2;
    padding-bottom: 15px;
    font-family: poppins-reg, arial, sans-serif;
}
.contHours{
  margin-top: 30px;
  max-width: 320px;
  margin: 30px auto 0;
  font-weight: 400;
}
.contHours li{
  max-width: 320px;
  font-size: 28px;
  text-align: left;
  display: flex;
  justify-content: space-between;
  margin-top: 15px;
}
.contHours li strong{
  min-width: 175px;
  text-align: left;
}
.contHours li span {
    display: block;
}
.contHours li .hourCell{
  text-align: left;
  min-width: 140px;
}

.contAdr span {
    display: block;
}

.contForm {
    text-align: center;
    margin-bottom: 80px;
}

.contPar p {
    font-size: 36px;
    color: var(--blue);
}

.formHalfWrapper {
    display: flex;
    justify-content: space-between;
}

.sectionMap {
    width: 100%;
    margin: 0 auto;
    overflow: hidden;
}

.sectionMap iframe {
    width: 100%;
    height: 400px;
    border: 0;
    display: block;
}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
    .contnWrap {
        width: 100%;
        margin: 90px auto 35px;
    }

    .contactWrap h1 {
        font-size: 36px;
    }

    .contactWrap h1 span {
        font-size: 100px;
    }

    .contTel {
        font-size: 36px;
    }

    .contAdr,
    .contHours {
        font-size: 24px;
    }
    .contHours{
      max-width: 270px;
    }
    .contHours li{
      max-width: 270px;
      font-size: 22px;
    }
    .contHours li strong,
    .hourCell {
    	width: 50%;
    }
    .contHours li strong {
    	min-width: 140px;
    }
    .contnH2 {
        font-size: 38px;
    }
}

@media only screen and (min-width: 1024px) and (max-width: 1300px) {
    .contnWrap {
        width: 100%;
        margin: 60px auto 50px;
    }

    .contForm {
        width: 90%;
        margin: 0 auto;
    }

    .contactWrap h1 {
        font-size: 36px;
    }

    .contactWrap h1 span {
        font-size: 100px;
    }

    .contTel {
        font-size: 34px;
    }
    .contnH2 {
        font-size: 38px;
    }

    .contactbg {
        padding: 50px 0;
    }

    .contactWrap h1 span {
        font-size: 90px;
    }

    .contactWrap h1 {
        font-size: 32px;
    }

    .contAdr,
    .contHours {
        font-size: 21px;
    }
    .contHours {
        font-size: 21px;
    }
    .contHours{
      max-width: 260px;
    }
    .contHours li{
      max-width: 260px;
      font-size: 22px;
    }
    .contHours li strong,
    .hourCell {
    	width: 50%;
    }
    .contHours li strong {
    	min-width: 140px;
    }

}

@media only screen and (min-width: 768px) and (max-width: 1023px) {
    .contnWrap {
        width: 100%;
        margin: 60px auto 50px;
        flex-direction: column;
    }

    .contnLeft,
    .contnRight {
        width: 100%;
    }

    .contnLeft {
        padding-top: 0;
        padding-bottom: 50px;
    }

    .contForm {
        width: 90%;
        margin: 0 auto;
    }

    .contactWrap h1 {
        font-size: 36px;
    }

    .contactWrap h1 span {
        font-size: 100px;
    }

    .contTel {
        font-size: 34px;
    }

    .contnH2 {
        font-size: 38px;
    }

    .contactbg {
        padding: 35px 0;
    }

    .contactWrap h1 span {
        font-size: 80px;
    }

    .contactWrap h1 {
        font-size: 29px;
    }

    .contAdr,
    .contHours {
        font-size: 21px;
    }
    .contHours{
      max-width: 260px;
    }
    .contHours li{
      max-width: 260px;
      font-size: 22px;
    }
    .contHours li strong,
    .hourCell {
    	width: 50%;
    }
    .contHours li strong {
    	min-width: 140px;
    }
    .sectionMap iframe {
        height: 300px;
    }
}

@media only screen and (max-width: 767px) {
    .contnWrap {
        width: 100%;
        margin: 35px auto 50px;
        flex-direction: column;
    }

    .contnLeft,
    .contnRight {
        width: 100%;
    }

    .contnLeft {
        padding-top: 0;
        padding-bottom: 50px;
    }

    .contactbg {
        padding: 50px 0 35px;
    }

    .contactWrap h1 span {
        font-size: 80px;
    }

    .contactWrap h1 {
        font-size: 30px;
    }

    .contTel {
        font-size: 28px;
    }

    .contAdr,
    .contHours {
        font-size: 21px;
    }
    .contHours{
      max-width: 260px;
    }
    .contHours li{
      max-width: 260px;
      font-size: 22px;
    }
    .contHours li strong,
    .hourCell {
    	width: 50%;
    }
    .contHours li strong {
    	min-width: 140px;
    }
    .contnH2 {
        font-size: 36px;
    }

    .sectionMap iframe {
        height: 300px;
    }
    .contForm {
        margin-bottom: 0;
    }
}

@media only screen and (max-width: 479px) {
    .contactWrap h1 span {
        font-size: 70px;
    }

    .contactWrap h1 {
        font-size: 30px;
    }

    .contTel {
        font-size: 28px;
    }

    .contPar p {
        font-size: 30px;
    }

    .contForm {
        margin-bottom: 35px;
    }

    .contnWrap {
        margin-bottom: 0;
    }

    .contnWrap-mb-25 { margin-bottom: 25px;}
}

/*========================================================
    Deli index
=========================================================*/
.deliBanner{
  background: url('../images/index/deli-banner-2560.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  padding: 120px 0;
}
.deliSize{
  width: 75%;
  max-width: 1500px;
  margin: 0 auto;
}
.deliBannerMob{
  display: none;
}
.deliRect{
  background: var(--green);
  color: var(--white);
  max-width: 600px;
  padding: 40px 50px;
  border-radius: 16px;
}
.deliRect h1{
  font-family: expend, arial, sans-serif;
  font-size: 66px;
  line-height: 1.1;
}
.deliRect h1 span{
  font-family: barbershop, arial, sans-serif;
}
.deliRect p{
  font-family: gotham-regular, arial, sans-serif;
  line-height: 1.3;
  margin: 25px 0 0;
}
.deliBtnPlace{
  margin: 25px 0 0;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
  .deliSize {
  	width: 88%;
  }
  .deliRect h1 {
  	font-size: 56px;
  }
  .deliRect {
  	max-width: 545px;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .deliSize {
  	width: 94%;
  }
  .deliRect h1 {
  	font-size: 50px;
  }
  .deliRect {
  	max-width: 515px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .deliSize {
  	width: 90%;
  }
  .deliRect h1 {
  	font-size: 50px;
  }
  .deliRect {
  	max-width: 515px;
  }
}
@media only screen and (max-width: 767px) {
  .deliBanner{
    background: none;
    padding: 0 0;
  }
  .deliBannerMob{
    display: block;
    width: 100%;
    height: auto;
  }
  .deliSize{
    width: 100%;
  }
  .deliRect h1 {
  	font-size: 42px;
  }
  .deliRect {
  	max-width: 100%;
  	padding: 30px 25px;
  	border-radius: 0;
  }
}

/*========================================================
    Order Online section index
=========================================================*/
.ordSect{
  background: url('../images/index/new-york-bg.jpg');
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: var(--white);
  padding: 50px 0;
  text-align: center;
}
.ordSectSize{
  width: 75%;
  max-width: 1330px;
  margin: 0 auto;
}
.ordSectTitle h3{
  font-family: expend, arial, sans-serif;
  font-size: 60px;
}
.ordSectTitle p{
  width: 45%;
  line-height: 1.4;
  margin: 10px auto 0;
}
.ordSecBtnsWrap{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 70%;
  margin: 50px auto 0;
}
.ordSecBtnRect{
  min-width: 240px;
  max-width: 240px;
  margin: 0 10px;
}
.ordSecBtnRect p{
  font-size: 18px;
  text-transform: capitalize;
  width: 70%;
  margin: 10px auto 0;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
  .ordSecBtnRect p{
    font-size: 16px;
    width: 70%;
  }
  .ordSectTitle h3{
    font-size: 56px;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .ordSecBtnRect p{
    font-size: 16px;
    width: 70%;
  }
  .ordSectSize {
  	width: 94%;
  }
  .ordSectTitle h3{
    font-size: 50px;
  }
  .ordSectTitle p {
  	width: 50%;
  }
  .ordSecBtnsWrap {
  	width: 100%;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .ordSecBtnRect p{
    font-size: 16px;
    width: 70%;
  }
  .ordSectSize {
  	width: 90%;
  }
  .ordSectTitle h3{
    font-size: 50px;
  }
  .ordSectTitle p {
  	width: 70%;
  }
  .ordSecBtnsWrap {
  	width: 100%;
  }
  .ordSecBtnRect{
    min-width: 220px;
    max-width: 220px;
    margin: 0 5px;
  }
}
@media only screen and (max-width: 767px) {
  .ordSecBtnRect p{
    font-size: 16px;
    width: 70%;
  }
  .ordSectSize {
  	width: 90%;
  }
  .ordSectTitle h3{
    font-size: 42px;
  }
  .ordSectTitle p {
  	width: 100%;
  }
  .ordSecBtnsWrap {
  	width: 100%;
    flex-direction: column;
    align-items: center;
  }
  .ordSecBtnRect{
    min-width: 220px;
    max-width: 220px;
    margin: 0 0 20px;
  }
  .ordSecBtnRect:nth-child(3){
    margin: 0 0 0;
  }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {
  .ordSectTitle p {
  	width: 80%;
    max-width: 346px;
  }
}

/*========================================================
    Great Food section index
=========================================================*/
.grFood{
  background: var(--white);
  padding: 100px 0;
}
.grFoodSize{
  width: 75%;
  max-width: 1500px;
  margin: 0 auto;
}
.grFoodMainTitle h2{
  font-family: expend, arial, sans-serif;
  font-size: 60px;
  text-align: center;
  margin: 0 0 80px;
}
.grFoodMainTitle h2 br{
  display: none;
}
.grFoodWrap{
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  flex-wrap: wrap;
}
.grFoodWrapRev{
  flex-direction: row-reverse;
}
.grMargTop{
  margin: 50px 0 0;
}
.grBigImg{
  width: 60%;
}
.grBigImg img{
  width: 100%;
  height: auto;
  border-radius: 16px;
}
.grFoodSmBox{
  background: var(--grSmBox);
  border-radius: 16px;
  width: 38%;
  padding: 40px 45px 45px;
}
.grTopTitle{
  font-size: 16px;
  text-transform: uppercase;
}
.grFoodSmBox h3{
  font-family: expend, arial, sans-serif;
  font-size: 30px;
  margin: 10px 0 0;
}
.grFoodSmBox p{
  line-height: 1.4;
  margin: 10px 0 0;
}
.grFoodSmBoxBtnPlace{
  margin: 20px 0 0;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
  .grFoodSize{
    width: 88%;
  }
  .grFoodSmBox h3 {
  	font-size: 26px;
  }
  .grFoodMainTitle h2 {
  	font-size: 56px;
  }

}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .grFood {
  	padding: 80px 0;
  }
  .grFoodSize{
    width: 94%;
  }
  .grFoodMainTitle h2 {
  	font-size: 50px;
  	margin: 0 0 60px;
  }
  .grFoodWrap{
    flex-direction: column;
  }
  .grBigImg,
  .grFoodSmBox{
    width: 100%;
  }
  .grFoodSmBox{
    margin: 10px 0 0;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .grFood {
  	padding: 80px 0;
  }
  .grFoodSize{
    width: 94%;
  }
  .grFoodMainTitle h2 {
  	font-size: 50px;
  	margin: 0 0 60px;
  }
  .grFoodWrap{
    flex-direction: column;
  }
  .grBigImg,
  .grFoodSmBox{
    width: 100%;
  }
  .grFoodSmBox{
    margin: 10px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .grFood {
  	padding: 80px 0;
  }
  .grFoodSize{
    width: 94%;
  }
  .grFoodMainTitle h2 {
  	font-size: 42px;
  	margin: 0 0 60px;
  }
  .grFoodMainTitle h2 br{
    display: block;
  }
  .grTopTitle {
  	font-size: 14px;
  }
  .grFoodWrap{
    flex-direction: column;
  }
  .grBigImg,
  .grFoodSmBox{
    width: 100%;
  }
  .grFoodSmBox h3 {
  	font-size: 25px;
  }
  .grFoodSmBox{
    margin: 10px 0 0;
    padding: 25px 20px 35px;
  }
}

/*========================================================
    Green Restaurant section index
=========================================================*/
.greenSect{
  background: #038758;
  color: var(--white);
  padding: 65px 0;
}
.footerSize,
.greenSectSize{
  width: 75%;
  max-width: 1500px;
  margin: 0 auto;
}
.greenSectWrap{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.greenImg{
  width: 40%;
  position: relative;
}
.greenImg img{
  width: 100%;
  height: auto;
  border-radius: 16px;
}
.greenImgTxt{
  background: var(--cream);
  color: var(--green);
  font-family: expend, arial, sans-serif;
  font-size: 25px;
  text-transform: uppercase;
  position: absolute;
  top: 50px;
  left: -45px;
  right: -35px;
  padding: 15px 35px;
  text-align: center;
  transform: rotate(4deg);
}
.greenText{
  width: 54%;
}
.greenSect h3{
  font-family: expend, arial, sans-serif;
  font-size: 56px;
  line-height: 1.2;
  margin: 0 0 20px;
}
.greenSect h3 span{
  font-family: barbershop, arial, sans-serif;
}
.greenSect p{
  margin: 10px 0 0;
}
.greenTextBtns{
  display: flex;
  justify-content: flex-start;

  margin: 30px 0 0;
}
.greenTextBtns p{
  margin-left: 20px;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {
  .greenSect h3 {
  	font-size: 53px;
  }
}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
  .greenSectSize{
    width: 88%;
  }
  .footerSize{
    width: 90%;
  }
  .greenImgTxt {
  	font-size: 22px;
    left: -35px;
    right: -35px;
  }
  .greenSect h3 {
  	font-size: 52px;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .greenSectSize,
  .footerSize{
    width: 94%;
  }
  .greenSect h3 {
  	font-size: 45px;
  }
  .greenImgTxt {
  	font-size: 17px;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .greenSect {
  	padding: 55px 0;
  }
  .footerSize,
  .greenSectSize{
    width: 94%;
  }
  .greenImgTxt {
    font-size: 30px;
  }
  .greenSect h3 {
  	font-size: 45px;
  }
  .greenSectWrap{
    flex-direction: column;
  }
  .greenImg,
  .greenText{
    width: 100%;
  }
  .greenText{
    margin: 30px 0 0;
  }
}
@media only screen and (max-width: 767px) {
  .greenSect {
  	padding: 55px 0;
  }
  .footerSize,
  .greenSectSize{
    width: 90%;
  }
  .greenImgTxt {
    font-size: 19px;
  }
  .greenSect h3 {
  	font-size: 40px;
  }
  .greenSectWrap{
    flex-direction: column;
  }
  .greenImg,
  .greenText{
    width: 100%;
  }
  .greenText p{
    line-height: 1.4;
  }
  .greenText{
    margin: 30px 0 0;
  }
  .greenTextBtns .deliBtn{
    padding: 10px 15px;
  }

}
@media only screen and (max-width: 479px) {
  .greenImgTxt {
    font-size: 14px;
    top: 10px;
  }
  .greenSect h3 {
  	font-size: 34px;
  }
  .greenTextBtns p{
    font-size: 16px;
  }
  .greenTextBtns p {
    font-size: 14px;
  	margin-left: 12px;
  }
}

/*========================================================
    Reviews section index
=========================================================*/
.reviSect{
  background: var(--white);
  padding: 100px 0;
}
.reviSect h4{
  font-family: expend, arial, sans-serif;
  font-size: 60px;
  text-align: center;
}
.reviSectWrap{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 65px 0 0;
}
.reviSectBox{
  width: 32%;
  background: var(--cream);
  border-radius: 16px;
  padding: 30px 30px 40px;
  position: relative;
}
.reviSectTitle p{
  font-family: gotham-bold, arial, sans-serif;
  font-size: 22px;
}
.quoteMarks{
  position: absolute;
  top: 35px;
  right: 30px;
  width: 28px!important;
}
.stars{
  margin: 14px 0 0;
  width: 107px!important;
}
.reviSectTxt p{
  line-height: 1.4;
  margin: 20px 0 0;
}
.reviSectImgPlace{
  margin: 60px 0 0;
  text-align: center;
}
.reviSectImgPlace img{
  width: 176px!important;
}
.reviSectWrapMob{
  display: none!important;
}
@media only screen and (min-width: 1920px) and (max-width: 2559px) {}
@media only screen and (min-width: 1301px) and (max-width: 1919px) {
  .reviSect {
  	padding: 80px 0;
  }
  .reviSectTitle p {
  	font-size: 20px;
  }
  .reviSect h4 {
  	font-size: 56px;
  }
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .reviSectWrapMob{
    display: block!important;
  }
  .reviSect h4{
    font-size: 50px;
  }
  .reviSectBox{
    width: 90%;
  }
  .reviSectWrapDesktop{
    display: none;
  }
}
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  .reviSectWrapMob{
    display: block!important;
    max-width: 337px;
    margin: 55px auto 20px;
  }
  .reviSect h4{
    font-size: 50px;
  }
  .reviSectBox{
    width: 100%;
  }
  .reviSectWrapDesktop{
    display: none;
  }
}
@media only screen and (max-width: 767px) {
  .reviSect {
  	padding: 60px 0;
  }
  .reviSectWrapMob{
    display: block!important;
    max-width: 337px;
    margin: 45px auto 0;
  }
  .reviSect h4 {
  	font-size: 42px;
  }
  .reviSectBox{
    width: 100%;
  }
  .reviSectWrapDesktop{
    display: none;
  }
}
@media only screen and (min-width: 480px) and (max-width: 767px) {}
@media only screen and (max-width: 479px) {}

/*========================================================
    Changing Menu
=========================================================*/
@media only screen and (min-width: 1024px) {
  .orderTopBtn {
  	color: var(--white)!important;
  }
}
/*========================================================
    Mobile Menu
=========================================================*/
@media only screen and (max-width: 1023px) {
  .logoMob,
  .telMob {
    display: inline-block;
  }
  .logoMob img {
    width: 90px;
  }
  .boxesWrap {
    width: 90%;
    height: 80px;
  }
  .boxes {
    height: 80px;
  }
  .three,
  .one {
    display: none;
  }
  .two {
    width: 100%;
    flex-direction: row;
  }
  .logoInMob {
    width: 80%;
  }
  nav {
    width: 20%;
    display: flex;
    align-items: center;
  }
  .telMob,
  .menu {
    width: 50%;
    text-align: right;
  }
  .smobitrigger,
  .mnuclose {
    display: inline-block;
  }
  .smobitrigger {
    color: transparent;
    width: 30%;
    margin: 0 auto;
  }
  .smobitrigger {
    background: url("../images/menuopen.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 50px 50px;
    width: 50px;
    height: 50px;
  }
  .mnuclose {
    background: url("../images/menuclose.png");
    background-position: right top;
    background-repeat: no-repeat;
    background-size: 45px 45px;
    color: transparent;
    height: 45px;
    margin: 0 0 10px 0;
    width: 100%;
    text-align: right;
    display: inline-block;
  }
  .menu ul {
    padding: 0 15px 20px;
    overflow-y: auto;
    margin: 0 auto;
    text-align: left;
  }
  .menu ul li.dlink {
    display: block;
    text-align: left;
    padding: 0;
  }
  .menu li {
    line-height: inherit;
  }
  .menu ul li a {
    font-size: 18px;
  }
  .menu ul li.dlink .orderTopBtn{
    color: var(--white)!important;
    margin-top: 10px;
    padding: 6px 17px;
  }
  .menu ul li.mlogo {
    margin: 20px 0 0;
    display: inline-block;
    text-align: left;
  }
  .menu ul li.mlogo img {
    width: 195px;
    margin: 0 0 30px;
    text-align: left;
  }
  .menu ul li.mphone {
    display: block;
    margin-bottom: 10px;
    text-align: left;
  }
  .menu ul li.mphone span {
    display: block;
    font-size: 16px;
    font-weight: 300;
    color: #777;
  }
  .menu ul li.mphone a {
    font-size: 26px;
    color: var(--yellow-main) !important;
  }
  .directionsCla {
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
  }
  .menu ul li.mline{
    display: block;
    width: 90%;
    border-top: 1px solid var(--bord);
    margin: 20px 0 0;
  }
  .menu ul li.mphoneLocations{
    display: block;
    font-family: gotham-medium, arial, sans-serif;
    font-size: 19px;
    margin: 0 0 20px;
  }
  .menu ul li.mname{
    display: block;
    font-family: gotham-medium, arial, sans-serif;
    font-size: 21px;
    margin: 20px 0 0;
  }
  .menu ul li.maddSpaceMobMenu{
    padding:: 0 0 60px;
  }
  .menu ul li.mbtnPlaceMob{
    display: block;
    margin: 20px 0 0;
  }
  .menu ul li.mbtnPlaceMob .orderTopBtn{
    color: var(--white)!important;
  }

  .menu ul li.maddress {
    display: block;
    font-size: 16px;
    line-height: 1.5;
    text-transform: capitalize;
    margin: 25px auto 15px;
    color: #777;
    text-align: left;
  }
  .menu ul li.maddress span {
    display: block;
  }
  .menu ul li.mhours {
    display: block;
    font-size: 16px;
    line-height: inherit;
    margin: 30px 15px;
    color: #fff;
    font-family: barlowmedium, arial, sans-serif;
  }
  .menu ul li.mhours span {
    display: block;
  }
  .menu ul li.hoursNav{
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    font-size: 18px;
  }
  .menu ul li.hoursNav strong{
    width: 35%;
  }
  .menu ul li.hoursNav .hourCell{
    width: 65%;
  }
  .menu ul li.msocial {
  	display: flex;
  	margin: 35px 0 60px;
  }
  .menu ul li.msocial img {
  	margin: 0 10px 0 0;
  }
  .mobimenu {
    padding: 0;
    margin: 0px;
    width: 16.9375em;
    position: fixed;
    height: 100% !important;
    top: 0px;
    left: -24.625em;
  }
  .mnuopn {
    left: 0px !important;
  }
  .ovrActv {
    position: fixed;
    background: rgba(0, 0, 0, 0.79);
    width: 100%;
    height: 100%;
    z-index: 9998;
    -webkit-transition: 0.5s;
    -moz-transition: 0.5s;
    -ms-transition: 0.5s;
    -o-transition: 0.5s;
    transition: 0.5s;
  }

}
@media only screen and (max-width: 767px) {
    .logoInMob {
        width: 70%;
    }
    nav {
        width: 30%;
    }
}
@media only screen and (max-width: 479px) {
    .logoInMob {
        width: 60%;
    }
    nav {
        width: 40%;
    }
}