*{
    margin: 0;
    padding: 0;
}

body{
    color: #166273;
    /* background-color: rgb(247,247,247); */
    background-color: white;
    font-family: 'Montserrat', sans-serif  !important;
}





#mainNav {
  background-color: #f4f3f4;

}

#mainNav .navbar-brand {
  color: #166273;
}

#mainNav .navbar-nav .nav-item .nav-link {
  color: #166273;
  font-weight: 800;
}

#mainNav .navbar-nav .nav-item.active .nav-link {
  color: #166273;
  text-decoration: underline;
}

@media (min-width: 992px) {
  #mainNav .navbar-nav .nav-item .nav-link {
    font-size: 0.9rem;
  }
  #mainNav .navbar-nav .nav-item .nav-link:hover {
    color: #166273;
    text-decoration: underline;
  }
  #mainNav .navbar-nav .nav-item.active .nav-link:hover {
    color: #166273;
    text-decoration: underline;
  }
}






a:link, a:visited, a:active {
    text-decoration:none;
}

.navMobile{
    display: none;
}

a{
    color: #166273;
    font-size: 1.1em;
    font-weight: bold;
}

h1{
    font-size: 2.8em;
}

#cajaTitulo{
    margin-top: 1rem;
}
#cajaTextos{
    margin-top: 3rem;
}

.divJuego{
    height: 30vh;
    border-radius: 25px;
    /* line-height:25vh;
    text-align:center; */
}

/* .divJuego img{
    vertical-align:middle;

} */

.divJuego span{
    /* position: relative;
    top: 80px;
    right: 70px; */
    color: white;
    font-weight: bold;
    font-size: 1.2em;

}

.navegacionMobile{
    display: none;
    background-color: rgb(226,226,226);

}

#carouselJuegos{
    display: none;
}

.contenedorScroll{
    height: 80vh;
    overflow-y: scroll;
}

.contenedorScroll2{
    height: 70vh;
    overflow-y: scroll;
}

.recursosScroll{
    height: auto;
}

.recursosScroll .card{
    height: auto;
    /* border-radius: 50px; */
    border: 2px solid #cbcbcb;
    box-shadow: 5px 5px 5px #89c38c;
    font-weight: bold;
    margin-top: 1rem;
}

/* ESTILO DE SABIAS QUE */

#flip-container{
  -webkit-perspective: 1000px;
  perspective: 1000px;
  padding: 5px;
  position: relative;
  margin: 10px auto;
  width: 500px;
}

#flip-container .card {
  position: relative;
  width: 500px;
  height: 500px;
  transition: 0.6s;
  transform-style: preserve-3d;
  transform-origin: 100% 230px;
  /* margin: 5px; */
  border: 2px solid #cbcbcb;
  box-shadow: 5px 5px 5px #89c38c;
}
#flip-container .card:hover, .card.flip{
  transform: rotateX(180deg);
}

.front, .back{
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  text-align: center;
}
.front{
  transform: rotateX(0deg);
  z-index: 2;
  background-color: white;
  color: #166273;
  /* font: 1em/1.8em Arial; */
  /* display: flex; */
  align-items: center;
  justify-content: center;
}
.front img{
    padding-top: 20px;
}
.front p{
    margin-top: 1em;
    font-size: 1em;
    font-weight: bold;
    margin-bottom: 20px;
}
.back{
  transform: rotateX(180deg);
  background: repeating-linear-gradient(
    -45deg,
    #ececec,
    #ececec 10px,
    #dedede 10px,
    #dedede 20px
  );
}

.back p{
    font-size: 1.1em;
    font-weight: bold;
    text-align: center;
    margin: 50px 30px;

}

footer img {
  width: 6%;
}

#banner{
  height: 20vh;
  background-color: white;
  border: 2px solid #166273;
  z-index: 3;
  position: absolute;
  top: 80vh;

}


@media (min-width: 576px){
  .modal-dialog {
      max-width: 1200px;
  }
}


@media (max-width: 991.98px) {

    .navegacionDesktop{
        display: none;
    }

    .navMobile{
        display: contents;
    }

    #cajaTitulo{
        margin-top: 0.3rem;
    }

    #cajaTextos{
        margin-top: 1rem;
    }

    .imagenGrooming{
        text-align: center !important;
    }

    .contenedorJuegos{
        display: none;
    }

    #carouselJuegos{
        display: contents;
        color: white;
    }

    .carousel-item div{
        /* height: 30vh; */
        border-radius:30px;
        padding: 5px;
    }

    h1{
        font-size: 1.3em;
    }

    h3{
        font-size: 1em;
    }

    .navegacionMobile{
        display: contents;
    }

    .navegacionMobile .row .col{
        padding: 0;
    }

    footer img {
      width: 18%;
    }

}