@import url('https://vuela.aeromexico.com/fonts/garnet/Garnett-Font.css');
body, html {
  font-family: 'Garnett-Regular', sans-serif ;
  color: #0b2343;
  margin: 0;
  min-width: 320px;
  background: #ffffff;
  overflow-x: hidden;
  /* scroll-behavior: smooth; */
}

a:focus, a:hover, button:hover {
  text-decoration: none;
  outline: 0;
}

p, h1, h2, h3, h4 {
  margin: 0;
}

.desActiveMenu {
  color: rgba(255, 255, 255, 0.2);
}

#menuES, #menuEN:hover {
  cursor: pointer;
}

.principal-banner {
  background: radial-gradient(64.31% 64.31% at 50% 50%, rgba(2, 12, 65, 0.09) 0%, rgba(2, 12, 65, 0.45) 100%), url(../img/principal-background.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  padding: 0 0 60px 0;
  text-align: center;
  position: relative;
  margin-top: 60px;
}

.breadcrumbs {
  padding: 30px 0;
}

.breadcrumbs img {
  padding: 0 10px;
}

.breadcrumbMenu {
  color: #ffffff;
  font-size: 12px;
}

.breadcrumbOption {
  color: #ffffff;
  opacity: 0.76;
  font-size: 12px;
  line-height: 18px;
}

.principal-banner h1 {
  font-size: 62px;
  line-height: 72px;
  color: #ffffff;
  margin: 0;
  padding-top: 20px;
  font-family: 'Garnett-Semibold', sans-serif;
}

.principal-banner .content-logos {
  display: flex;
  align-items: center;
  width: 300px;
  justify-content: space-around;
  margin: 0 auto;
  padding: 20px 0;
}

.principal-banner .content-logos span {
  border-right: 1px solid #e5e5e5;
  height: 52px;
}

.principal-banner .slogan {
  color: #ffffff;
  font-size: 20px;
  line-height: 24px;
  padding-bottom: 10px;
}

.principal-banner .slogan2 {
  color: #ffffff;
  font-size: 16px;
  line-height: 24px;
  max-width: 760px;
  margin: 0 auto;
  font-family: 'Garnett-Regular', sans-serif ;
}

.content-alert {
  height: 50px;
  align-items: center;
  display: flex;
  justify-content: center;
  background: rgba(255, 255, 255, 0.30);
}

.content-alert p {
  font-size: 12px;
  line-height: 18px;
  color: #ffffff;
}

.cta-alert {
  color: #007cc2;
  text-decoration: underline;
}

.container-menu {
  max-width: 1280px;
  margin: 0 auto;
  border-bottom: 1px solid #e5e5e5;
  padding-bottom: 60px;
}

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

.wrapper-menu .containerMenu {
  padding: 60px;
  margin: 0 auto;
  width: 1000px;
}

.borderE5 {
  border-top: 1px solid #e5e5e5;
  max-width: 1280px;
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  margin: 0 auto;
}

.contentTitleMenu {
  padding-bottom: 40px;
  background: #ffffff;
}

.blueTitleMenu {
  font-size: 24px;
  line-height: 30px;
  color: #020C41;
  font-family: 'Garnett-Semibold', sans-serif ;
}

.wrapperLeftMenu {
  display: flex;
  align-items: center;
  height: 60px;
  width: 256px;
  background-color: #ffffff;
}

.flex {
  display: flex;
  width: 100%;
}

.wrapperLeftMenuActive {
  background: #5215FC;
  border-radius: 4px;
}

.wrapperLeftMenu:hover {
  cursor: pointer;
}

.wrapperLeftMenu .optionMenu {
  color: #020C41;
  font-size: 14px;
  line-height: 20px;
}

/* .optionMenu:hover {
  color: #ffffff;
} */

.wrapperLeftMenuActive .optionMenu {
  color: #ffffff;
  font-family: 'Garnett-Semibold', sans-serif;
}

.icon {
  padding: 0 15px 0 20px;
  box-sizing: initial;
}

/*OPTIONS LEFT MENU*/

.icon-breakfast {
  content: url("../img/icon/breakfast.svg");
}

.wrapperLeftMenuActive .icon-breakfast {
  content: url("../img/icon/white-breakfast.svg");
}

.icon-lunch {
  content: url("../img/icon/lunch.svg");
}

.wrapperLeftMenuActive .icon-lunch {
  content: url("../img/icon/white-lunch.svg");
}

.icon-dinner {
  content: url("../img/icon/dinner.svg");
}

.wrapperLeftMenuActive .icon-dinner {
  content: url("../img/icon/white-dinner.svg");
}

.icon-vegetarian {
  content: url("../img/icon/vegetarian.svg");
}

.wrapperLeftMenuActive .icon-vegetarian {
  content: url("../img/icon/white-vegetarian.svg");
}

.icon-desserts{
  content: url("../img/icon/desserts.svg");
}

.wrapperLeftMenuActive .icon-desserts {
  content: url("../img/icon/white-desserts.svg");
}

.icon-childrensMenu {
  content: url("../img/icon/childrensFood.svg");
}

.wrapperLeftMenuActive .icon-childrensMenu {
  content: url("../img/icon/white-childrensFood.svg");
}

.icon-courtesyFood{
  content: url("../img/icon/courtesyFood.svg");
  width: 20px;
}

.wrapperLeftMenuActive .icon-courtesyFood {
  content: url("../img/icon/white-courtesyFood.svg");
}

.icon-drinks {
  content: url("../img/icon/drinksMenu.svg");
}

.wrapperLeftMenuActive .icon-drinks {
  content: url("../img/icon/white-drinksMenu.svg");
}

.icon-wines {
  content: url("../img/icon/wine.svg");
}

.wrapperLeftMenuActive .icon-wines {
  content: url("../img/icon/white-wine.svg");
}

.icon-courtesyDrinks {
  content: url("../img/icon/courtesyDrinks.svg");
}

.wrapperLeftMenuActive .icon-courtesyDrinks {
  content: url("../img/icon/white-courtesyDrinks.svg");
}

.icon-terraza {
  content: url("../img/icon/hamburguesa-icon.svg");
}

.wrapperLeftMenuActive .icon-terraza {
  content: url("../img/icon/white-hamburguesa-icon.svg");
}

/* .breakfastHover:hover p, .lunchHover:hover p, .dinnerHover:hover p, .vegetarianHover:hover p, .childrensMenuHover:hover p, .courtesyFoodHover:hover p, .drinksHover:hover p, .winesHover:hover p,  .courtesyDrinksHover:hover p  {
  color: #ffffff;
}

.breakfast:hover ~ div, .lunch:hover ~ div, .dinner:hover ~ div, .vegetarian:hover ~ div, .childrensMenu:hover ~ div, .courtesyFood:hover ~ div, .drinks:hover ~ div, .wines:hover ~ div, .courtesyDrinks:hover ~ div{
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #5A5095;
  align-self: center;
} */

.arrow {
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 10px solid #5a5095;
  align-self: center;
}

.blueSchedule {
  color: #035CF7;
  font-size: 14px;
  line-height: 20px;
  text-wrap-mode: nowrap;
}

.flexContainerMenu {
  display: flex;
  align-items: center;
  padding-bottom: 26px;
}

.flexContainerMenu .descMenu {
  padding-left: 26px;
}

.flexContainerMenu .line {
  border-right: 1px solid #E6E6E3;
  height: 40px;
}

.containerTitleMenu {
  display: flex;
  align-items: center;
}

.wrappImageMenu img {
  width: auto;
  height: 100px;
  margin-right: 10px;
}

.wrappContentTitle {
  width: auto;
  padding-right: 26px;
}

.containerMenu .schedule {
  display: flex;
  align-items: center;
}

.containerMenu .schedule img:first-of-type {
  padding-right: 5px;
}

.descMenu p:first-of-type {
  font-size: 12px;
  line-height: 18px;
  color: #020C41;
  font-family: 'Garnett-Semibold', sans-serif;
}

.descMenu p:last-of-type {
  font-size: 12px;
  line-height: 18px;
  color: #666665;
}

.headOptionMenu {
  display: flex;
  border-top: 1px solid #E6E6E3;
  padding: 25px 0;
  align-items: center;
  justify-content: space-between;
}

.headOptionMenu .flex img {
  width: 100px;
  height: 100px;
  margin-right: 10px;
  /*display: block;*/
}

.containerOptionMenu {
  width: 100%;
  padding-left: 0px;
  display: flex;
  justify-content: space-between;
  gap: 40px;
}

/* .containerOptionMenu div:first-of-type {
  width: 450px;
  max-width: 100%;
} */

.titleOptionMenu {
  width: 600px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 10px;
}

.containerOptionMenu .title {
  font-size: 16px;
  line-height: 24px;
  color: #020C41;
}

.description {
  font-size: 12px;
  line-height: 18px;
  color: #666665;
  width: 600px;
}

.foodSpecification {
  color: #020C41;
  opacity: 0.7;
  font-size: 10px;
  line-height: 16px;
  display: flex;
  gap: 5px;
  text-wrap-mode: nowrap;
}

.foodSpecification>.open {
  opacity: 1 !important;
}

.open {
  font-size: 10px;
  color: #035CF7;
  text-decoration: underline;
  padding: 0 5px;
  cursor: pointer;
}

.content-price{
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}

.sign {
  font-family: 'Garnett-Semibold', sans-serif;
  color: #020C41;
  font-size: 20px;
  line-height: 26px;
}

.price {
  font-family: 'Garnett-Semibold', sans-serif;
  color: #020C41;
  font-size: 20px;
  line-height: 26px;
}

.currency {
  font-family: 'Garnett-Regular', sans-serif;
  color: #020C41;
  font-size: 16px;
  line-height: 22px;
  margin-left: 2px;
}

.open {
  display: none;
}

#lunch, #dinner, #vegetarian, #childrens, #courtesyFood, #drinks, #wines, #courtesyDrinks, #desserts, #breakfast1, #terraza {
  display: none;
}

/* #childrens .contentMenus:last-of-type {
  padding-top: 0;
} */

#courtesyFood .flexContainerMenu {
  width: 860px;
}

/* #drinksMenu .flexContainerMenu {
  width: 760px;
}
#wines .flexContainerMenu {
  width: 760px;
}
#courtesyDrinks .flexContainerMenu {
  width: 760px;
} */

.last-item {
  border-bottom: 1px solid #e5e5e5;
  margin-bottom: 40px;
}

.middle {
  padding: 20px 0;
  border-bottom: 1px solid #e5e5e5;
}

.container-pills {
  width: 100%;
  padding-bottom: 20px;
  overflow-x: auto;
}

.container-pills::-webkit-scrollbar{
  height: 5px;
}

.wrapper-pills {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  gap: 20px;
}

.pills {
  text-decoration: none;
  background-color: #ffffff;
  color: #5a5095;
  font-size: 12px;
  border-radius: 25px;
  border: 1px solid #e5e5e5;
  padding: 5px 14px;
  flex: 0 0 auto;
  cursor: pointer;
}

.pills-active {
  background-color: #5a5095;
  color: #ffffff;
  font-size: 12px;
}

#courtesyFood .containerOptionMenu {
  padding: 0;
  width: 100%;
}

#courtesyFood .containerOptionMenu .titleOptionMenu {
  width: 100%;
  padding: 20px 0;
  border-bottom: 1px solid #e5e5e5;
}

#courtesyFood .containerOptionMenu .title {
  width: 500px;
}

#courtesyFood .containerOptionMenu .last {
  border-bottom: 0;
  width: 100%;
  padding: 20px 0;
}

#terrazaEnsaladas, #terrazaSopas, #terrazaPlatosFuertes, #terrazaPostres,
#courtesy2, #courtesy3, #courtesy4 {
  display: none;
}

.subMenu .containerOptionMenu {
  padding: 0;
  width: 100%;
  border-bottom: 1px solid #e5e5e5;
}

.subMenu .containerOptionMenu .titleOptionMenu {
  width: 100%;
  padding: 20px 0;  
}

.subMenu .containerOptionMenu .title {
  width: 500px;
}

.subMenu .containerOptionMenu .last {
  border-bottom: 0;
  width: 100%;
  padding: 20px 0;
}

.contentDrinks {
  display: flex;
  align-items: center;
  /* border-bottom: 1px solid #E5E5E5; */
  width: 100%;
}

.bBottom {
  border-bottom: 1px solid #e5e5e5;
}

.wrapperCategoryDrinks {
  padding: 20px 0;
  width: 100%;
}

.wrapperCategoryDrinks ul {
  padding: 0 0 0 20px;
  margin: 10px 0;
}

.mySlides {
  display: none;
}

img {
  vertical-align: middle;
}

.slide-container {
  padding: 40px;
}

/* Slideshow container */

.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */

.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: 50px;
  height: 50px;
  margin-top: -22px;
  border-radius: 50%;
  user-select: none;
  background-color: #5a5095;
  align-items: center;
  display: flex;
  justify-content: center;
}

.icon-prev {
  background-image: url("../img/left-arrow.svg");
  background-position: center;
  background-repeat: no-repeat;
}

.prev {
  left: -20px;
}

.icon-next {
  background-image: url("../img/right-arrow.svg");
  background-position: center;
  background-repeat: no-repeat;
}

/* Position the "next button" to the right */

.next {
  right: 0px;
}

/* The dots/bullets/indicators */

.dot {
  cursor: pointer;
  height: 10px;
  width: 10px;
  margin: 0 2px;
  background-color: #e5e5e5;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #007cc2;
}

/* Fading animation */

.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 2s;
  animation-name: fade;
  animation-duration: 2s;
}

@-webkit-keyframes fade {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}

@keyframes fade {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}

.content-slide {
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 40px 0;
  gap: 40px;
}

.wrapper-slideImage {
  background-color: #efecf7;
  border-radius: 50%;
  width: 340px;
  height: 340px;
  display: flex;
  align-items: center;
}

.wrapper-slideImage .slideImage {
  width: 340px;
  height: auto;
}

.wrapper-slideContent {
  width: 560px;
}

.wrapper-slideContent .headerSlide {
  font-family: 'Garnett-Semibold', sans-serif ;
  font-size: 14px;
  line-height: 20px;
  color: #0b2343;
}

.wrapper-slideContent .titleSlide {
  font-family: 'Garnett-Semibold', sans-serif ;
  font-size: 60px;
  line-height: 60px;
  color: #0b2343;
  padding: 5px 0 20px 0;
  width: 540px;
}

#slide2 .wrapper-slideContent .titleSlide {
  font-size: 32px;
  line-height: 38px;
}

.wrapper-slideContent .descSlide {
  color: #666666;
  font-size: 18px;
  line-height: 28px;
  width: 460px;
}

.wrapper-cost {
  display: flex;
  align-items: center;
  padding: 10px 0;
  margin-bottom: 20px;
}

.fromSlide {
  font-family: 'Garnett-Regular', sans-serif ;
  font-size: 14px;
  color: #0b2343;
  line-height: 28px;
}

.priceSlide {
  font-family: 'Garnett-Regular', sans-serif ;
  font-size: 60px;
  color: #0b2343;
  line-height: 60px;
}

.currencySlide {
  font-family: 'Garnett-Regular', sans-serif ;
  font-size: 22px;
  color: #0b2343;
  line-height: 14px;
}

.ctaSlide {
  border: 1px solid #e5e5e5;
  border-radius: 25px;
  color: #007cc2;
  text-transform: uppercase;
  padding: 10px 24px;
  text-decoration: none;
  font-size: 12px;
  line-height: 16px;
}

/* .scrolling-wrapper {
  width: 1600px; height:auto; overflow:visible;
} */

#card_slider {
  padding: 60px 0 20px 60px;
  border-right: 1px solid #E6E6E3;
  z-index: 10;
  width: 256px;
  background-color: #ffffff;
  box-sizing: initial;
}

.subject_card {
  border-radius: 8px;
  height: 215px;
  width: 178px;
  background-color: #fff;
  color: #5d646c;
  float: left;
  margin-right: 20px;
  display: inline;
  box-shadow: 0px 2px 4px 0px rgb(82, 82, 88);
}

.subject_card>img {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  width: 178px;
  height: 135px;
  display: block;
}

.subject_card>p {
  padding-left: 5px;
  padding-right: 5px;
  margin-top: 5px;
  overflow: hidden;
  max-height: 60px;
}

@media (max-width: 1280px) {
  .wrapper-menu .leftMenu {
    padding: 35px 0 20px 35px;
  }
  .wrapper-menu .containerMenu {
    padding: 30px;
  }
  #card_slider {
    padding: 30px 0 30px 30px;
  }
}

@media (max-width: 1200px) {
  .wrapper-menu {
    flex-direction: column;
  }
  .wrapper-menu .leftMenu {
    padding: 35px 0 20px 35px;
    width: 1200px;
    height: min-content;
    margin-bottom: 60px;
    clear: both;
    overflow-y: hidden;
    overflow-x: scroll;
    height: 235px;
    margin-top: 20px;
    position: relative;
  }
  .wrapper-menu .containerMenu {
    padding: 60px;
    margin: 0 auto;
    max-width: -webkit-fill-available;
  }
  .containerOptions {
    display: flex;
    position: absolute;
    width: 2000px;
  }
  #card_slider {
    clear: both;
    overflow-y: hidden;
    overflow-x: scroll;
    position: relative;
    height: 70px;
    width: auto;
    margin: 0 0 0 40px;
    padding: 0;
    border: 0;
    top: -20px;
    background-color: transparent;
  }
  #card_slider::-webkit-scrollbar {
    height: 5px;
  }
  #card_track {
    position: absolute;
    display: inline-flex;
    gap: 15px;
    padding-right: 20px;
  }
  .wrapperLeftMenu {
    width: max-content;
    height: 50px;
    padding: 0 20px;
    gap: 10px;
    box-shadow: 0px 3px 2px 0px rgba(0, 0, 0, 0.03);
    border-radius: 4px;
  }
  .arrow {
    display: none;
  }
  .contentTitleMenu {
    display: none;
  }
  .icon {
    padding: 0;
  }
  .wrapper-menu .containerMenu {
    padding: 0 40px 20px 40px;
  }
}

@media (max-width: 1024px) {
  .flexContainerMenu {
    width: auto;
  }
  .wrapper-menu .containerMenu {
    padding: 20px 40px;
    margin: 0 auto;
  }
  #card_slider {
    margin: 0 0 0 40px;
  }
  .wrapper-slideContent {
    width: 440px;
  }
  .wrapper-slideContent .titleSlide {
    font-size: 48px;
    line-height: 48px;
    width: 360px;
  }
  .wrapper-slideContent .descSlide {
    width: 360px;
  }
  .wrapper-slideImage {
    width: 300px;
    height: 300px;
  }
  .wrapper-slideImage .slideImage {
    width: 300px;
    height: auto;
  }
}

@media (max-width: 860px) {
  #lunch, #dinner, #vegetarian, #childrens, #courtesyFood, #drinksMenu, #wines, #breakfast {
    position: relative;
    top: -20px;
  }
  #courtesyDrinks #card_slider {
    margin: 0 0 0 30px;
  }
  .wrapper-menu .containerMenu {
    padding: 30px;
    margin: 0 auto;
  }
  /* .content-price {
    padding-left: 0px;
  } */
  .containerOptionMenu .title {
    font-size: 16px;
    line-height: 22px;
  }
  #courtesyFood .containerOptionMenu .title {
    width: 600px;
  }
  .headOptionMenu .flex img {
    width: 80px;
    height: 80px;
  }
  .headOptionMenu {
    padding: 15px 0;
  }
  .wrapper-slideContent .titleSlide {
    font-size: 40px;
    line-height: 40px;
    width: 340px;
  }
  .wrapper-slideContent .descSlide {
    width: 340px;
  }
  .wrapper-slideImage {
    width: 260px;
    height: 260px;
  }
  .wrapper-slideImage .slideImage {
    width: 260px;
    height: auto;
  }
  .priceSlide {
    font-size: 50px;
    line-height: 50px;
  }
  .titleOptionMenu{
    width: 540px;
  }
  .description {
    width: 540px;
  }
  .wrappImageMenu img {
    width: auto;
    height: 80px;
  }
}

@media (max-width: 759px) {
  .content-alert {
    padding: 0 20px;
  }
  .content-alert p{
    font-size: 10px;
    line-height: 16px;
  }
  .breadcrumbs {
    padding: 20px 0 0;
  }
  .principal-banner h1 {
    font-size: 36px;
    line-height: 42px;
  }
  .principal-banner .slogan{
    font-size: 18px;
    line-height: 24px;
  }
  .principal-banner .slogan2{
    padding: 0 20px;
  }
  #card_slider {
    margin: 0 0 0 30px;
  }
  .wrapper-menu .containerMenu {
    padding: 0 30px 30px;
  }
  .flexContainerMenu {
    flex-direction: column;
    align-items: flex-start;
    padding-bottom: 10px;
    width: 100%;
  }
  .flexContainerMenu .line {
    display: none;
  }
  .flexContainerMenu .descMenu {
    padding-left: 0px;
  }
  .blueTitleMenu {
    font-size: 24px;
    line-height: 40px;
  }
  .descMenu {
    padding: 5px 0;
  }
  .showpanel, .showpanel2 {
    display: none;
  }
  .panelDrinks {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 2px 0;
  }
  .titleOptionMenu {
    width: 100%;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    padding-bottom: 0;
  }
  .containerOptionMenu {
    flex-direction: column;
    gap: 0;
  }
  .headOptionMenu {
    flex-direction: column;
    align-items: flex-start;
    padding: 20px 0;
  }
  #courtesyFood .containerOptionMenu .title {
    width: 500px;
  }
  .description {
    font-size: 12px;
    line-height: 18px;
    width: auto;
  }
  .content-price {
    padding-top: 5px;
  }
  .open {
    display: block;
    padding: 0;
  }
  .foodSpecification {
    display: flex;
    padding: 5px 0;
    flex-wrap: wrap;
    gap: 2px;
  }
  .content-price .sign, .price {
    font-size: 16px;
    font-family: 'Garnett-Semibold', sans-serif ;
    line-height: 24px;
  }
  .currency{
    font-size: 14px;
    line-height: 20px;
  }
  #courtesyFood .titleOptionMenu {
    flex-direction: row;
  }
  #courtesyFood .flexContainerMenu {
    width: 100%;
  }
  #drinksMenu .flexContainerMenu {
    width: 100%;
  }
  #wines .flexContainerMenu {
    width: 100%;
  }
  #courtesyDrinks .flexContainerMenu {
    width: 100%;
  }
  ul li .description {
    display: block;
  }
  .wrapperCategoryDrinks {
    padding: 15px 0;
  }
  .slide-container {
    padding: 30px;
  }
  .content-slide {
    gap: 20px;
  }
  .wrapper-slideContent .descSlide {
    width: 260px;
    font-size: 16px;
    line-height: 24px;
  }
  .wrapper-slideContent .titleSlide {
    font-size: 34px;
    line-height: 34px;
    width: 320px;
  }
  #slide2 .wrapper-slideContent .titleSlide {
    font-size: 24px;
    line-height: 32px;
  }
  .currencySlide {
    font-size: 18px;
  }
}

@media (max-width: 679px) {
  .slide-container {
    padding: 20px 30px 80px;
  }
  .content-slide {
    flex-direction: column;
    justify-content: center;
    text-align: center;
  }
  .wrapper-slideContent {
    width: 100%;
  }
  .wrapper-slideContent .titleSlide {
    width: 400px;
    margin: 0 auto;
  }
  .wrapper-slideContent .descSlide {
    width: 400px;
    margin: 0 auto;
  }
  .wrapper-cost {
    justify-content: center;
  }
  .prev, .next {
    top: auto;
    background-color: transparent;
    width: 10%;
    height: 12%;
  }
  .prev {
    left: 0;
  }
  .icon-prev {
    background-image: url("../img/leftP-arrow.svg");
    background-position: center;
    background-repeat: no-repeat;
  }
  .icon-next {
    background-image: url("../img/rightP-arrow.svg");
    background-position: center;
    background-repeat: no-repeat;
  }
  .containerTitleMenu {
    width: 100%;
  }
  .flexContainerMenu div:first-of-type {
    padding: 5px 0;
  }
}

@media (max-width: 600px) {
  #courtesyFood .containerOptionMenu .title {
    width: 360px;
  }
  .wrapper-pills {
    gap: 10px;
    text-align: center;
  }
  .description {
    width: 340px;
  }
  .wrapperCategoryDrinks {
    width: 200px;
  }
  .contentDrinks {
    justify-content: space-between;
  }
  .blueTitleMenu {
    font-size: 20px;
    line-height: 26px;
  }
}

@media (max-width: 480px) {
  .containerOptionMenu {
    padding: 0;
  }
  .principal-banner h1{
    font-size: 28px;
    line-height: 34px;
  }
  .principal-banner .slogan{
    font-size: 16px;
    line-height: 22px;
  }
  .principal-banner .slogan2{
    font-size: 12px;
    line-height: 18px;
    padding: 0 20px;    
  }
  .wrapper-slideContent .titleSlide {
    width: 340px;
    margin: 0 auto;
  }
  .wrapper-slideContent .descSlide {
    width: 320px;
  }
  .wrapperLeftMenu {
    padding: 0 15px;
  }
  .containerOptionMenu .title {
    width: auto;
    font-size: 12px;
    line-height: 18px;
  }
  #courtesyFood .containerOptionMenu .title {
    width: 320px;
  }
  .description {
    width: auto;
    font-size: 10px;
    line-height: 16px;
  }
}

@media (max-width: 420px) {
  .headOptionMenu .flex img {
    width: 80px;
    height: 80px;
  }
  .containerOptionMenu .title {
    width: auto;
  }
  .blueTitleMenu {
    font-size: 18px;
    line-height: 24px;
  }
  #courtesyFood .containerOptionMenu .title {
    width: 260px;
  }
  .description {
    width: auto;
  }
  .wrapperLeftMenu .optionMenu {
    font-size: 14px;
  }
  .priceSlide {
    font-size: 48px;
    line-height: 48px;
  }
  .wrapper-slideContent .titleSlide {
    width: 240px;
    font-size: 24px;
    line-height: 30px;
  }
  .currencySlide {
    font-size: 20px;
    line-height: 26px;
  }
  .currencySlide {
    font-size: 16px;
    line-height: 8px;
  }
  .wrappImageMenu img {
    width: auto;
    height: 70px;
  }
}

@media (max-width: 380px) {
  .containerOptionMenu .title {
    width: auto;
  }
  .description {
    width: auto;
  }
}

@media (max-width: 340px) {
  #card_slider {
    margin: 0 0 0 20px;
  }
  .wrapper-menu .containerMenu {
    padding: 0 20px 20px;
  }
  .wrapperLeftMenu {
    padding: 0 10px;
    height: 46px;
    gap: 5px;
  }
  .wrapperLeftMenu .optionMenu {
    font-size: 14px;
  }
  .icon {
    padding: 0;
    max-width: 20px;
  }
  #courtesyFood .containerOptionMenu .title {
    width: 200px;
  }
  .description {
    width: 200px;
  }
  .principal-banner .content-logos span {
    height: 40px;
  }
  .breadcrumbs {
    padding: 20px 0 0px 0;
  }
  .wrapper-slideContent .titleSlide {
    width: 240px;
    font-size: 26px;
    line-height: 32px;
    margin: 0 auto;
  }
  .currencySlide {
    font-size: 18px;
    line-height: 24px;
  }
  .wrapper-slideContent .descSlide {
    width: 240px;
  }
}


@media (max-width: 1200px) {
  .card_menuCategory {
      width: auto;
  }
}