body {
       display: flex;
       min-height: 100vh;
       flex-direction: column;
   }
   
   main {
       flex: 1 0 auto;
   }
   
   .page-footer {
       padding-top: 20px;
       color: #e8eaf6;
       background-color: #8e24aa;
   }
   
   .copyright a {
       color: #c5cf31!important;
   }
   
   .img-center {
       display: block;
       margin-left: auto;
       margin-right: auto;
   }
   
   .link-sitio {
       padding-top: 10px;
   }
   
   .link-sitio>a {
       color: black;
   }
   
   .btn-redsocial {
       border-radius: 50%;
       width: 35px;
       padding: 0px;
   }
   
   .btn-whatsapp {
       background-color: rgb(0, 230, 118);
       border-color: rgb(0, 230, 118);
   }
   
   .btn-twitter {
       background-color: rgb(85, 172, 238);
       border-color: rgb(85, 172, 238);
   }
   
   .btn-facebook {
       background-color: rgb(59, 89, 152);
       border-color: rgb(59, 89, 152);
   }
   
   .btn-clone {
       color: grey;
       background-color: white;
       border-color: white;
   }
   
   .btn-clone:hover {
       background-color: white;
   }
   
   .btn-facebook:hover {
       background-color: rgb(59, 89, 152);
   }
   
   .btn-twitter:hover {
       background-color: rgb(85, 172, 238);
   }
   
   .btn-whatsapp:hover {
       background-color: rgb(0, 230, 118);
   }
   
   #toast-container {
       min-width: 10%;
       top: 50%;
       right: 50%;
       transform: translateX(50%) translateY(50%);
       bottom: 00px;
       ;
   }
   
   .toast {
       background-color: #c8e6c9 !important;
       color: black;
   }
   
   .cero-top {
       top: 0px!important;
   }
   
   .color {
       height: 34px;
       width: 100px;
       margin-top: 10px;
   }
   
   .text-bold {
       font-weight: BOLD;
   }
   
   .color-black {
       color: black!important;
   }
   
   .color-red {
       color: red!important;
   }
   
   .color-red.lighten-2 {
       color: #E57373 !important;
   }
   
   .color-white {
       color: white!important;
   }
   
   .btn-red {
       background-color: #ef5350;
   }
   
   #alerta {
       width: max-content!important;
       z-index: 10000;
   }
   
   #porciones {
       width: 80%;
       ;
   }
   
   .w-100 {
       width: 100%;
   }
   
   .text-right {
       text-align: right;
       ;
   }
   
   .mb-0 {
       margin-bottom: 0px!important;
   }
   
   .d-none {
       display: none;
   }
   
   .precios-porciones {
       font-size: 1.5rem!important;
   }
   
   .collection-item>a {
       color: black!important;
   }
   
   .collection .collection-item.avatar {
       min-height: 65px!important;
       ;
   }
   
   #listado-alergias {
       padding-left: 20px;
       padding-top: 15px;
   }
   
   #listado-alergias>img {
       margin: 5px;
   }
   
   nav .interno-1 {
       margin-left: 25%!important;
       width: 80%!important;
       font-size: 1.2rem!important;
   }
   
   .menu-texto {
       background: white;
       opacity: 0.7;
       padding-left: 10px;
       color: black;
   }
   
   #btn-sin-precio,
   #btn-precio-unico,
   #btn-precio-porcion {
       width: 100%;
       margin-bottom: 5px;
       padding: 0px!important;
   }
   
   nav {
       height: 70px;
   }
   
   #links nav {
       background-color: white;
       ;
   }
   
   .page-link {
       background-color: #E57373;
       border: 1px solid white;
       ;
   }
   
   .page-link .active {
       color: wheat;
       font-size: 1.1rem;
       ;
   }
   
   .pagination li.active {
       background-color: transparent;
   }
   
   .pagination li span {
       display: inline-block;
       font-size: 1.2rem;
       padding: 0 10px;
       line-height: 30px;
       color: wheat;
   }
   /*.pagination li.active {
       background-color: white;
       color: black;
   }*/
   
   .alerta {
       margin-top: 25px;
       text-align: left;
       width: 80%;
       /* background: red; */
       padding: 1rem 2rem 1rem 2rem;
       margin-left: auto;
       margin-right: auto;
       color: white;
       border-radius: 12px;
   }
   
   .backdrop {
       background-color: teal;
       padding: 2px!important;
       margin: 2px!important;
   }
   
   @media only screen and (max-width: 992px) {
       nav .brand-logo {
           left: 20%!important;
       }
   }
   
   @media(min-width:400px) {
       nav .interno-1 {
           margin-left: 25%!important;
           width: 80%!important;
           font-size: 1rem!important;
       }
   }
   
   @media(min-width:576px) {
       #porciones {
           width: 80%;
           ;
       }
       nav .interno-1 {
           margin-left: 25%!important;
           width: 80%!important;
           font-size: 1rem!important;
       }
       #btn-sin-precio,
       #btn-precio-unico,
       #btn-precio-porcion {
           width: 30%;
       }
   }
   
   @media(min-width:768px) {
       #porciones {
           width: 70%;
           ;
       }
   }
   
   @media(min-width:993px) {
       #porciones {
           width: 60%;
           ;
       }
       nav .interno-1 {
           margin-left: 3%!important;
           width: 80%!important;
           font-size: 1.2rem!important;
       }
   }
   
   @media(min-width:1200px) {
       #porciones {
           width: 50%;
           ;
       }
   }