html, body{width: 100%;height: 100%;margin: 0px;}

*::placeholder {
  color: #4C52A1;
  opacity: 1; /* Firefox */
}
*::-webkit-input-placeholder {
  color: #4C52A1; /* Reemplaza 'blue' por el color que desees */
}
#pedido{text-decoration: none;display: block;border-radius: 5px;color: white;background-color: #FA8A12;padding: 5px;}
#OpcionesCompra{z-index: 100; display: none;flex-flow: column;align-items: center; justify-content: flex-start; width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.6);position: fixed;}
#cerrar{cursor: pointer; width: 100%;height: 9%;background-color: white;display: flex;flex-flow: row nowrap;justify-content: right;align-items: center;}
#cerrar a{display: block;margin: 3px; padding: 3px;font-family: Tahoma, Verdana, Segoe, sans-serif;background-color: #804104;color: white;border-radius: 5px;box-shadow: 3px 3px 5px;margin-right: 10%;}
#OpcionesPago {font-family: Tahoma, Verdana, Segoe, sans-serif; overflow-y: scroll; width: 100%;height:; display: flex;flex-flow: row wrap;justify-content: center;align-items: center;text-align: center;}
#OpcionesPago div{width: 250px;height: 450px; background-color: white;margin:5px;padding: 5px;}
#OpcionesPago div div{width:;height: auto;}
#OpcionesPago div img{width: 230px;height: auto;}
#OpcionesPago div div a img{width: 50px;height: auto; margin: 5px;padding: 4px; cursor: pointer;}
#tarjetaFrecuente{display: flex; flex-flow: column;justify-content: center;align-items: center; width: 100%;height: auto;}
#tarjetaFrecuente a{text-align: center; width: auto;height: auto;cursor: pointer;color:white;padding:3px;border-radius:5px; }
#tarjetaFrecuente a img{width: 40%;min-width: 300px; height: auto;border-radius: 5px 5px 5px;box-shadow: 3px 3px 5px black;margin: 10px;}


@keyframes aparecer {
          0% {opacity: 0%;transform: translate(-100%);}
          20% {opacity: 100%;transform: translate(10%);}
          
          25% {}
          45% {opacity: 100%;transform: translate(10%);}
          
          50% {}
          70% {}
          
          75% {opacity: 100%;transform: translate(10%);}
          100% {opacity: 0%;transform: translate(-100%);}
         }
@keyframes links {
          0% {opacity: 0%;transform: translate(-100%);}
          20% {}
          
          25% {}
          45% {}
          
          63% {opacity: 0%;transform: translate(-100%);}
          67% {opacity: 100%;transform: translate(-50%);}
          
          75% {}
          100% {opacity: 100%;transform: translate(-50%);}
         }
.body_mensaje{display: flex;width: 100%;height: 100%;justify-content: center;align-items: center;text-align: center;background-color:#2D87E4;}
.body_mensaje .titulomensaje{display: flex;flex-flow: column;justify-content: center;align-items: center; width: 50%;min-width: 200px; height: auto;min-height: 400px;font-family: TimesNewRoman, "Times New Roman", Times, Baskerville, Georgia, serif;color: white;background-color: #3F87FF;border-radius: 5px;box-shadow: 3px 3px 5px black;padding: 5px;}
.body_mensaje .titulomensaje div{display: flex;flex-flow: column; justify-content: center;align-items: center;}
.body_mensaje .titulomensaje div img{}
.body_mensaje .titulomensaje div p{font-size: 1.5rem;}
.body_mensaje .titulomensaje div a{text-align: center; text-decoration: none;display: flex;justify-content: center;align-items: center; color: white;font-weight: bold;background-color: #B201A3;border-radius: 3px;box-shadow: 3px 3px 3px black;margin: 5px;width: 90px;height: 40px;}

.cont-pag{display: flex;flex-flow: column;justify-content: flex-start; width: 100%;height: 100%;}
.cont-pag .menu{ display: flex;flex-flow: row nowrap;width: 100%;height: 12%;background-color: #CA8624;justify-content: center;align-items: center;}
.cont-pag .menu .logo{width: 60px;height: 60px;margin: 5px; padding: 5px;}
.cont-pag .menu .logo img{width: 65px;height: 65px;border-radius: 50%; }
.cont-pag .menu .links{display: flex;flex-flow: row nowrap;width: 50%;height: 100%;justify-content:center;align-items: center;: }
.cont-pag .menu .links .hipervinculo{ text-decoration: none;color: white;font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;font-weight: bold;font-size: 1.3rem; display: flex;justify-content: center;align-items: center;min-width: 140px;min-height: 30px; width: 30%;height: 55%;background-color: #5B482B;margin-right: 2%;border-radius: 5px;}


.cont-pag .menu .redes{max-height: 70px;min-height: 50px; display: flex;flex-flow: row nowrap;width: 50%;height: 100%;justify-content: flex-end;align-items: center;margin-right: 6%;}
.cont-pag .menu .redes .face a img{display: flex;justify-content: center;align-items: center; width: 50px;height: 70%;margin: 5px; }
.cont-pag .menu .redes .whasshap a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu .redes .instagran a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu .redes .didi{border-radius: 15%;background-color: white;height: 50px;display: flex;align-items: center;}
.cont-pag .menu .redes .didi a img{display: flex;justify-content: center;align-items: center;width: 50px;height:auto;margin: 5px;}
.cont-pag .menu .redes .uber a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu .redes .youtube a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu .redes .tictok a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu .redes div img{width: auto;height:100%;margin: 4px;}


.cont-pag .menu-postres{ display: flex;flex-flow: row nowrap;width: 100%;height:20%;background-color: #97FDF9;justify-content: center;align-items: center;}
.cont-pag .menu-postres .logo{width: 60px;height: 60px;margin: 5px; padding: 5px;}
.cont-pag .menu-postres .logo img{width: 65px;height: 65px;border-radius: 50%; }
.cont-pag .menu-postres .links{display: flex;flex-flow: row nowrap;width: 50%;height: 100%;justify-content:center;align-items: center;: }
.cont-pag .menu-postres .links .hipervinculo{ text-decoration: none;color: #D3FAF8;font-family: "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;font-weight: bold;font-size: 1.3rem; display: flex;justify-content: center;align-items: center;min-width: 140px;min-height: 30px; width: 30%;height: 55%;background-color: #44A2F2;margin-right: 2%;border-radius: 5px;}


.cont-pag .menu-postres .redes{max-height: 70px;min-height: 50px; display: flex;flex-flow: row nowrap;width: 50%;height: 100%;justify-content: flex-end;align-items: center;margin-right: 6%;}
.cont-pag .menu-postres .redes .face a img{display: flex;justify-content: center;align-items: center; width: 50px;height: 70%;margin: 5px; }
.cont-pag .menu-postres .redes .whasshap a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu-postres .redes .instagran a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu-postres .redes .didi{border-radius: 15%;background-color: white;height: 50px;display: flex;align-items: center;}
.cont-pag .menu-postres .redes .didi a img{display: flex;justify-content: center;align-items: center;width: 50px;height:auto;margin: 5px;}
.cont-pag .menu-postres .redes .uber a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu-postres .redes .youtube a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu-postres .redes .tictok a img{display: flex;justify-content: center;align-items: center;width: 50px;height: 70%;margin: 5px;}
.cont-pag .menu-postres .redes div img{width: auto;height:100%;margin: 4px;}








.cont-pag .contenido{display: flex;flex-flow: row nowrap;width: 100%;height: 88%;background-color: white;}



.cont-pag .contenido .conocenos{width: 100%;height: 150%; background-image: url(../img/html/fondoMV.jpeg);background-size: cover; display: flex;flex-flow: column;justify-content: flex-start;justify-items: center;align-items: center;}
.cont-pag .contenido .conocenos video{margin: 5px;border-radius: 5px;}
.cont-pag .contenido .conocenos .imgVideo{display: flex;flex-flow: row wrap;margin: 5%;justify-content: center;align-items: center;width: 100%;}
.cont-pag .contenido .conocenos h2{color: #EABB17;display: block;text-shadow: 3px 3px 5px black;}
.cont-pag .contenido .conocenos img{margin: 5px;border-radius: 5px;box-shadow: 3px 3px 5px; width: 350px;height: auto;}
.cont-pag .contenido .conocenos .mision_vision{ margin: 2px;border-radius:10px;width: 550px; height: auto; display: flex;flex-flow: column;justify-content: center;align-items: center;}
.cont-pag .contenido .conocenos .mision_vision p{display: flex;justify-content: center;align-items: center; text-align: center; min-height: 150px; color: white; font-family: Tahoma, Verdana, Segoe, sans-serif;font-size: 0.9rem;background-color: rgba(0, 0, 0, 0.6); margin: 5px;padding: 5px;border-radius: 5px; width: auto;height: auto;}





.cont-pag .conten-videos {border-radius: 10% 10% 0px 0px; display: flex;flex-flow: column; margin-top: 2%; background-color:#FDC352; width: 100%;height: auto;justify-content: center;align-items: center;}
.cont-pag .conten-videos h2{font-family: Tahoma, Verdana, Segoe, sans-serif;color: white;text-shadow: 3px 3px 3px black;}
.cont-pag .conten-videos .videos{display: flex;flex-flow: row wrap;width: 100%;justify-content: center;align-items: center;}
.cont-pag .conten-videos .videos img{height: 450px;width: 300px; border-radius: 10px; margin: 5px; box-shadow: 3px 3px 3px;}
.cont-pag .conten-videos .videos video{width: auto;height: 450px; margin: 5px;border-radius: 5px;}


.cont-pag .contenido .promociones{display: flex;flex-flow: row wrap;width: 100%;height: 100%;justify-content: center;align-items: center;}
.cont-pag .contenido .promociones div {display: flex;flex-flow: column-reverse;text-align: center;background-color: #804104;margin: 5px;padding: 5px;border-radius: 10px;}
.cont-pag .contenido .promociones .imgPromo_uno{display: flex;justify-content: center;align-items: center; width: 80%;}
.cont-pag .contenido .promociones .imgPromo_uno img{width: 350px;height: auto;}
.cont-pag .contenido .promociones div h4{display: block; text-align: center;font-family: Tahoma, Verdana, Segoe, sans-serif;background-color: #F6B672;border-radius: 5px;box-shadow: 3px 3px 5px;padding: 5px;}
.cont-pag .contenido .promociones div img{height: 200px;width: 260px;margin: 5px;border-radius: 5px;box-shadow: 3px 3px 3px;}
.cont-pag .contenido .promociones{}


.cont-pag .contenido-postres{display: flex;flex-flow: column;width: 100%;height: auto;background-color: #FFF4C0;}
.cont-pag .contenido-postres .postres{display: flex;flex-flow: row wrap;width: 100%;height: 100%;justify-content: center;align-items: center;}
.cont-pag .contenido-postres .postres div {display: flex;flex-flow: column-reverse;text-align: center;background-color:none;margin: 5px;padding: 5px;border-radius: 10px;}
.cont-pag .contenido-postres .postres .imgPromo_uno{display: flex;justify-content: center;align-items: center; width: 80%;}
.cont-pag .contenido-postres .postres .imgPromo_uno img{width: 350px;height: auto;}
.cont-pag .contenido-postres .postres div h4{display: block; text-align: center;font-family: Tahoma, Verdana, Segoe, sans-serif;background-color: #F6B672;border-radius: 5px;box-shadow: 3px 3px 5px;padding: 5px;}
.cont-pag .contenido-postres .postres div img{height: 200px;width: 260px;margin: 5px;border-radius: 5px;box-shadow: 3px 3px 3px;}
.cont-pag .contenido-postres .postres{}

.cont-pag .contenido-postres .conocenos-postres{justify-content: center;align-items: center;align-items: center; display: flex;flex-flow: row wrap;width: 100%;height: auto;min-height: 500px;background-image: url(../img/html/fondoPostres.jpeg);background-size: hidden; background-position: center;}
.cont-pag .contenido-postres .conocenos-postres img{width: 350px;height: auto;margin: 10px;}




.cont-pag .contenido .areaA{background-image: url(../img/html/imgPc/portadapc.jpeg);background-size: auto 100%;background-position: center;background-repeat: no-repeat; display: flex;flex-flow: column;width: 50%;height: auto;justify-content: flex-end; align-items: center;}

.cont-pag .contenido .areaA .elemetoA .boton a img{width: 50px;height: auto;transform: scale(3);}


.cont-pag .contenido .areaA .elemetoA{width: 90px;height: 50px;margin: 5px;position: relative;bottom: 15%;left: 30%;}
.cont-pag .contenido .areaA .elemetoA .boton{display: flex;justify-content: center;align-items: center;}

.cont-pag .contenido .areaB{display: flex;flex-flow: column;width: 50%;height:auto; }

.cont-pag .contenido .areaB .seccionA{display: flex;justify-content: center;align-items: center; width: 100%;height: 45%;background-image: url(../img/html/imgPc/formulario.jpeg);background-size: 100%; background-position: center; min-height: 320px;}
.cont-pag .contenido .areaB .seccionA .formulario{ display: flex;flex-flow: column ; justify-content: center;align-items: center;text-align: center;text-align: center;}
.cont-pag .contenido .areaB .seccionA .formulario h2{color: white;font-family: Tahoma, Verdana, Segoe, sans-serif;}
.cont-pag .contenido .areaB .seccionA .formulario form {display: flex;flex-flow: column; justify-content: center;align-items: center;}
.cont-pag .contenido .areaB .seccionA .formulario form label{color: #4C52A1;}
.cont-pag .contenido .areaB .seccionA .formulario form textarea{font-weight: bold;width: 250px;height: 30px;border: none; margin: 5px;border-radius: 5px;color: #4C52A1;color: #4C52A1;}
.cont-pag .contenido .areaB .seccionA .formulario form select{border: none;}
.cont-pag .contenido .areaB .seccionA .formulario form input{font-weight: bold;width: 200px;height: 30px;border: none; margin: 5px;border-radius: 5px;color: #4C52A1;}
.cont-pag .contenido .areaB .seccionA .formulario form select{font-weight: bold;width: 200px;height: 30px;border: none; margin: 5px;border-radius: 5px;color: #4C52A1;}
#enviar{cursor: pointer;width: 130px;background-color: #25E4B9;color: white;}
#enviar:hover{background-color: red;color: white;transition: background-color 2s;}


.cont-pag .contenido .areaB .seccionB{ display: flex;flex-flow: column-reverse;justify-content: center;align-items: center; width: 100%;height: auto;background-color: #804104; border-radius: 0px 0px 5px 5px;}
.cont-pag .contenido .areaB .seccionB .googleMaps{display: flex; width: 50%;height: 100%;}
.cont-pag .contenido .areaB .seccionB .textoG{display: flex;justify-content: center;align-items: center;}
.cont-pag .contenido .areaB .seccionB .textoG a{color: white;text-shadow: 3px 3px 3px black; font-family: Tahoma, Verdana, Segoe, sans-serif;font-weight: bold; font-size: 0.9rem;text-align: center;text-decoration: none; margin: 10px;}
.cont-pag .contenido .areaB .seccionB .googleMaps iframe{width: 100%;height: 90%;border-radius: 0px; margin: 10px;border-radius: 10px; box-shadow: 3px 3px 5px;}

.cont-pag .contenido .imgConoceme {display: flex;justify-content: flex-start;align-items: center;}
.cont-pag .contenido .imgConoceme img{width: 100%;height: 100%;display: none;}
.cont-pag .contenido .imgServicios {display: flex;justify-content: center;align-items: center;}
.cont-pag .contenido .imgServicios img{width: 100%;height: 100%;display: none;}
#conocemepc{display: block;}
#conocemetablet{}
#conocememovila{}
#conocememovilb{}
#serviciospc{display: block;}
#serviciostable{}
#serviciosmovila{}
#serviciosmovilb{}

.cont-pag .contenido_menu .barras{display: flex; flex-flow: column;width: 100%;align-items: center;}
.cont-pag .contenido_menu .barras div{display: flex;flex-flow: column;text-align: center;overflow-y:hidden; width:90%;height: 550px;margin: 5px;padding: 5px;}
.cont-pag .contenido_menu .barras h2{color: #845B39;font-family: Tahoma, Verdana, Segoe, sans-serif;}
.cont-pag .contenido_menu .barras div div{display: flex;flex-flow: row nowrap; width:95%; height: 550px;min-width: 460px;}
.cont-pag .contenido_menu .barras div div div{ display: flex;flex-flow: column;align-items: center;justify-content: center; min-width: 450px;height:550px;overflow-x: hidden;}
.cont-pag .contenido_menu .barras div div div div{ display: flex;flex-flow: row nowrap;}
.cont-pag .contenido_menu .barras div div div div div{background-color: white; display: flex;flex-flow: column;} 
.cont-pag .contenido_menu .barras div div div div div img{width: auto;height: 240px;}
.cont-pag .contenido_menu .barras div div div div div a{text-decoration: none;width: 80px; display: block;margin: 5px; padding: 5px; color: white;background-color: #FF8D13;border-radius: 5px;box-shadow: 5px 5px 3px;}

.cont-pag .contenido_menu .fooder{display: none;}

@media only screen and (max-width: 900px){
.cont-pag{height: auto;}
#conocemepc{display: none;}
#conocemetablet{display: block;}
#conocememovila{}
#conocememovilb{}
#serviciospc{display: none;}
#serviciostablet{display: none;}
#serviciosmovila{display: block;width: 100%;height: auto;}
#serviciosmovilb{}
.cont-pag .contenido .areaA{width: 100%;min-height: 500px;background-image: url(../img/html/imgPc/portadapc.jpeg);background-size:contain ;background-position: center;background-repeat: no-repeat; }
.cont-pag .contenido{flex-flow: column;}
.cont-pag .contenido .areaA .elemetoA .boton img{width: 50px;height: 50px;}

.cont-pag .contenido .areaB{width: 100%;min-height: 400px;}

.cont-pag .contenido_menu .barras div div div div{transform: translate(-5%, -4%);}
.cont-pag .contenido_menu .barras div div div h3{transform: translate(-70%, 8%);}



}

@media only screen and (max-width: 700px){


#conocemepc{display: none;}
#conocemetablet{display: none;}
#conocememovila{display: block;}
#conocememovilb{}
#serviciospc{display: none;}
#serviciostablet{display: none;}
#serviciosmovila{display: none;}
#serviciosmovilb{display: block;}

.cont-pag .contenido .imgConoceme{ width: 100%;height: auto;}
.cont-pag .contenido .imgServicios{width: 100%;height: auto;}


.cont-pag .contenido{min-height: 80%;display: flex;justify-content: flex-start;align-items: center;}
.cont-pag .contenido .areaA{width: 100%;min-height: 550px;background-image: url(../img/html/imgMovil/portadamovila.jpeg);background-size:contain ;background-position: center;background-repeat: no-repeat; }

.cont-pag .menu{flex-flow: column;height: 15%;width: 100%;justify-content: center;align-items: center;padding: 5px; margin: 0px;}
.cont-pag .menu .redes{width: 100%;justify-content: center;align-items: center; padding: 5px;}
.cont-pag .contenido .fooder{display: flex;width: 100%;height: 25px;justify-content: center;align-items: center;text-align: center;color: white;background-color: #A50808;}

.cont-pag .contenido .areaB .seccionB{min-height: 300px; display: flex;flex-flow: column-reverse;justify-content: center;align-items: center; width: 100%;height: 55%;background-color: white;}
.cont-pag .contenido .areaB .seccionB .googleMaps{display: flex; width: 90%;height: auto;border-radius: 10px;margin: 5px;}
.cont-pag .contenido .areaB .seccionB .textoG{margin: 5px; display: flex;align-items: center; width: 100%; color: white;font-family: Tahoma, Verdana, Segoe, sans-serif;font-size: 1rem;text-align: center;}

.cont-pag .menu{min-height: 20%;}
.cont-pag .menu .links{display: flex;flex-flow: row nowrap;}
.cont-pag .menu .links .hipervinculo{ font-size: 0.9rem;min-width: 110px; margin: 5px;}
.cont-pag .contenido .conocenos .mision_vision{ width: 100%;}
.cont-pag .contenido .conocenos .mision_vision p{font-size: 0.9rem;}
.cont-pag .contenido .promociones .imgPromo_uno{display: flex;justify-content: center;align-items: center; width: 90%;}
.cont-pag .contenido .promociones .imgPromo_uno img{width: 300px;height: auto;}

.cont-pag .menu-postres{flex-flow: column;height: 15%;width: 100%;justify-content: center;align-items: center;padding: 5px; margin: 0px;}
.cont-pag .menu-postres .redes{width: 100%;justify-content: center;align-items: center; padding: 5px;}
.cont-pag .menu-postres{min-height: 20%;}
.cont-pag .menu-postres .links{display: flex;flex-flow: row nowrap;}
.cont-pag .menu-postres .links .hipervinculo{ font-size: 0.9rem;min-width: 110px; margin: 5px;}




}


@media only screen and (max-width: 500px){
.cont-pag .contenido .areaA{background-image: url(../img/html/imgMovil/portadamovila.jpeg);}
#conocemepc{display: none;}
#conocemetablet{display: none;}
#conocememovila{display: none;}
#conocememovilb{display: block;}
#serviciospc{display: none;}
#serviciostablet{display: none;}
#serviciosmovila{display: none;}
#serviciosmovilb{display: block;}

.cont-pag .contenido .areaB .seccionB .textoG{width: 90%;}
.cont-pag .contenido .areaB .seccionB .textoG a{color: #804104;text-shadow: none;}

.cont-pag .contenido .areaB .seccionA .formulario form{display: flex; flex-flow: column;justify-content: center;align-items: center;text-align: center;}
.cont-pag .contenido .areaB .seccionA .formulario form textarea{font-weight: bold;width: 200px;height: 30px;border: none; margin: 5px;border-radius: 5px;color: #4C52A1;color: #4C52A1;}

.cont-pag .contenido .imgConoceme img{width: 100%;height: auto;}
.cont-pag .contenido .imgServicios img{width: 100%;height: auto;}

}

@media only screen and (max-width: 400px){



}

  
  

