/*variables generales*/
/*variables navbarr*/
/*variables estados*/
/*variables footer*/
/*carouseles*/
* {
  /*reset*/
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

/*terminareset*/
/*ajustes generales*/
body {
  font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;
  font-size: 1.25rem;
  background: #055882;
  background: linear-gradient(180deg, #055882 9%, #067751 23%, #460253 64%, #0b000d 92%); }

/*terminan ajustes generales*/
/* inicia barra de navegacion*/
.navbar {
  z-index: 3;
  background: #0b0b0b;
  background: linear-gradient(180deg, #2e28e3 11%, #454e73 45%, #1b181b 100%); }
  .navbar a {
    color: aliceblue; }
  .navbar-logo {
    font-size: 175%; }
    @media screen and (max-width: 360px) {
      .navbar-logo {
        font-size: 115%; } }

.boton_coll {
  color: #3d5d5d;
  background-color: rgba(152, 161, 167, 0.789); }

/*termina barra nav*/
/*index*/
.grilla_index {
  display: grid;
  grid-template-columns: 33% 34% 32%;
  grid-template-rows: repeat 6, auto;
  grid-template-areas: "artbienvenida artbienvenida artbienvenida"
 "imgsprincipales imgsprincipales imgsprincipales"
 "video video columna"
 "carta1 carta2 columna"
 "animacion carta2 columna"
 "carta3 carta3 columna";
  row-gap: 3px;
  column-gap: 7px;
  justify-content: center;
  justify-items: center;
  align-items: center; }
  @media screen and (max-width: 992px) {
    .grilla_index {
      grid-template-columns: 50% 50%;
      grid-template-areas: "artbienvenida artbienvenida"
 "imgsprincipales imgsprincipales "
 "video video"
 "carta1 columna"
 "carta2 columna"
 "carta3 carta3"; } }
  @media screen and (max-width: 576px) {
    .grilla_index {
      grid-template-columns: 100%;
      grid-template-areas: "artbienvenida"
 "imgsprincipales"
 "video"
 "carta1"
 "carta2"
 "columna"
 "carta3"; } }
  @media screen and (max-width: 360px) {
    .grilla_index {
      grid-template-columns: 100%;
      grid-template-areas: "artbienvenida"
 "imgsprincipales"
 "video"
 "carta1"
 "carta2"
 "columna"
 "carta3"; } }

.artbienvenidaindex {
  grid-area: artbienvenida;
  padding: 1.5rem;
  font-size: 1.25rem;
  width: 97%;
  color: black; }
  @media screen and (max-width: 360px) {
    .artbienvenidaindex {
      padding: 1rem;
      padding-top: .5rem;
      font-size: 1rem;
      width: 99%; } }
  .artbienvenidaindex h1 {
    font-size: 2.25rem;
    text-align: center;
    padding: .45rem; }
  .artbienvenidaindex p {
    padding: .50rem; }

.imgs_principales_cont {
  filter: drop-shadow(9px 9px 9px black);
  grid-area: imgsprincipales;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center; }
  .imgs_principales_cont img {
    width: 30%;
    height: 21rem;
    transition: 1s ease-out;
    object-fit: cover; }
    @media screen and (max-width: 992px) {
      .imgs_principales_cont img {
        width: 31%;
        height: 17rem; } }
    @media screen and (max-width: 576px) {
      .imgs_principales_cont img {
        width: 30%;
        height: 7rem; } }
  .imgs_principales_cont :hover {
    transform: scale(1.2); }

.video_1 {
  grid-area: video;
  padding: 1rem;
  width: 70%;
  height: 25rem; }
  @media screen and (max-width: 360px) {
    .video_1 {
      padding: .25rem;
      height: 8rem; } }

.articulo_1index {
  grid-area: carta1;
  background-color: rgba(154, 134, 134, 0.485);
  align-self: start;
  color: black;
  border-radius: 5%; }

.articulo_2index {
  grid-area: carta2;
  background-color: rgba(154, 134, 134, 0.485);
  align-self: start;
  color: black;
  border-radius: 3%; }
  .articulo_2index a:visited {
    color: rgba(138, 130, 55, 0.892); }
  .articulo_2index img {
    width: 23rem;
    padding: .5rem;
    width: 100%; }
    @media screen and (max-width: 576px) {
      .articulo_2index img {
        padding: 1.5rem; } }

.articulo_1index h2, .articulo_2index h2 {
  padding: .7rem;
  font-size: 1.80rem; }

.articulo_3index {
  grid-area: carta3;
  background-color: rgba(154, 134, 134, 0.485);
  align-self: flex-start;
  color: black;
  border-radius: 3%; }

.columna {
  grid-area: columna;
  justify-self: end;
  align-self: stretch;
  padding: 1.6rem; }
  .columna ol {
    padding: 0rem; }
  .columna h2 {
    color: #c7daec;
    font-size: 2rem;
    margin: 2rem 1px 3rem 1px; }
  .columna li {
    background: rgba(241, 186, 124, 0.941);
    padding: 2rem 1rem;
    list-style: none;
    color: black; }
    @media screen and (max-width: 576px) {
      .columna li {
        padding: 1rem .5rem;
        margin: .5rem 1px .5rem 1px; } }

.post1, .post3, .post5, .post7, .post9 {
  transform: rotate(3deg);
  border-radius: 2%;
  filter: drop-shadow(7px 7px 9px black); }
  .post1 img, .post3 img, .post5 img, .post7 img, .post9 img {
    top: -50px;
    position: relative;
    left: 50%;
    width: 2rem;
    filter: drop-shadow(5px 5px 6px black); }

.post2, .post4, .post6, .post8 {
  border-radius: 2%;
  transform: rotate(-3deg);
  filter: drop-shadow(7px 7px 9px black); }
  .post2 img, .post4 img, .post6 img, .post8 img {
    top: -50px;
    position: relative;
    left: 50%;
    width: 2rem;
    filter: drop-shadow(5px 5px 6px black); }

.carousel_index img {
  height: 25rem; }
  @media screen and (max-width: 576px) {
    .carousel_index img {
      height: 20rem; } }
  @media screen and (max-width: 360px) {
    .carousel_index img {
      height: 14rem; } }

.animacion_index {
  grid-area: animacion;
  width: 20rem;
  padding-bottom: 17rem;
  animation-name: angel;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
  animation-duration: 7s;
  animation-delay: 0.5s; }
  @media screen and (max-width: 1250px) {
    .animacion_index {
      display: none; } }
  @media screen and (max-width: 992px) {
    .animacion_index {
      display: none; } }
  @media screen and (max-width: 576px) {
    .animacion_index {
      display: none; } }
  @media screen and (max-width: 360px) {
    .animacion_index {
      display: none; } }

@keyframes angel {
  0% {
    transform: rotatey(0deg); }
  50% {
    transform: rotatey(180deg); }
  100% {
    transform: rotatey(360deg); } }

/*termina index*/
/*ecosistemas*/
.contenedor_carousel img {
  padding-top: 5.5rem;
  height: 27rem; }
  @media screen and (max-width: 992px) {
    .contenedor_carousel img {
      height: 19rem; } }
  @media screen and (max-width: 576px) {
    .contenedor_carousel img {
      height: 14rem; } }
  @media screen and (max-width: 360px) {
    .contenedor_carousel img {
      padding-top: 4.4rem;
      height: 10rem; } }

.titulo--color1 {
  color: #8840a9; }

.titulo--color2 {
  color: #7a53b4; }

.titulo--color3 {
  color: #535fb4; }

.titulo--color4 {
  color: #5386b4; }

.titulo--color5 {
  color: #53b4a2; }

/*termina ecosistemas*/
/*main lugares*/
.carousel_lugares img {
  padding-top: 5.5rem;
  height: 27rem; }
  @media screen and (max-width: 992px) {
    .carousel_lugares img {
      height: 19rem; } }
  @media screen and (max-width: 576px) {
    .carousel_lugares img {
      height: 14rem; } }
  @media screen and (max-width: 360px) {
    .carousel_lugares img {
      padding-top: 4.4rem;
      height: 10rem; } }

.tarjetas_lugares article {
  background-color: rgba(197, 224, 247, 0.332);
  border-radius: 2%; }
  @media screen and (max-width: 576px) {
    .tarjetas_lugares article {
      padding-bottom: .11rem; } }

.tarjetas_lugares img {
  filter: drop-shadow(7px 7px 9px black);
  height: 25rem;
  width: 95%;
  border-radius: 1%; }
  @media screen and (max-width: 576px) {
    .tarjetas_lugares img {
      height: 15rem;
      width: 90%; } }

.tarjetas_lugares p {
  margin-top: 1rem;
  padding: .75rem;
  text-align: left;
  color: black; }

.color--nuevoh1 {
  color: rgba(252, 200, 104, 0.807); }

.color--nuevoh2 {
  color: rgba(233, 147, 147, 0.807); }

.color--nuevoh3 {
  color: rgba(148, 242, 101, 0.807); }

.color--nuevoh4 {
  color: rgba(244, 145, 196, 0.807); }

.color--nuevoh5 {
  color: rgba(104, 252, 213, 0.807); }

.color--nuevoh6 {
  color: rgba(71, 195, 237, 0.807); }

/*termina main lugares*/
/*estados main*/
.carousel_estados img {
  padding-top: 5.5rem;
  height: 27rem; }
  @media screen and (max-width: 992px) {
    .carousel_estados img {
      height: 19rem; } }
  @media screen and (max-width: 576px) {
    .carousel_estados img {
      height: 14rem; } }
  @media screen and (max-width: 360px) {
    .carousel_estados img {
      padding-top: 4.4rem;
      height: 10rem; } }

.titulo--font1 {
  font-size: font1; }

.titulo--font2 {
  font-size: font2; }

.contenedor_estado {
  background-color: rgba(197, 224, 247, 0.332);
  height: 32rem;
  border-radius: 1%; }
  @media screen and (max-width: 576px) {
    .contenedor_estado {
      height: 25rem; } }
  .contenedor_estado img {
    border-radius: 1%;
    filter: drop-shadow(7px 7px 7px black);
    width: 95%;
    height: 25rem;
    transition: opacity 1.5s ease-in-out; }
    @media screen and (max-width: 576px) {
      .contenedor_estado img {
        height: 18rem; } }
  .contenedor_estado h2 {
    color: black;
    font-size: 175%; }

.contenedor_estado img.cambio {
  position: relative;
  top: -25rem; }
  @media screen and (max-width: 576px) {
    .contenedor_estado img.cambio {
      top: -18rem; } }

.contenedor_estado img.cambio:hover {
  opacity: 0; }

/*termina main estados*/
/*tradiciones y cultura*/
.carousel_tradiciones img {
  padding-top: 5.5rem;
  height: 27rem; }
  @media screen and (max-width: 992px) {
    .carousel_tradiciones img {
      height: 19rem; } }
  @media screen and (max-width: 576px) {
    .carousel_tradiciones img {
      height: 14rem; } }
  @media screen and (max-width: 360px) {
    .carousel_tradiciones img {
      padding-top: 4.4rem;
      height: 10rem; } }

.img_dia_muertos, .img_posadas {
  width: 49%;
  height: 22rem; }
  @media screen and (max-width: 992px) {
    .img_dia_muertos, .img_posadas {
      height: 16rem; } }
  @media screen and (max-width: 576px) {
    .img_dia_muertos, .img_posadas {
      height: 12rem; } }
  @media screen and (max-width: 360px) {
    .img_dia_muertos, .img_posadas {
      height: 6rem; } }

.dia_muertos, .posadas, .dia_independencia {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  margin: 1px;
  padding: 1px; }

.dia_muertos h2, .posadas h2, .dia_independencia h2 {
  font-size: 2.5rem;
  width: 100%;
  text-align: center; }

/*/termmina tradiciones y cultura*/
/*comunidad*/
.boton {
  background-color: #6595be;
  font-size: 1.7rem;
  padding: .4rem;
  display: block;
  margin: 5%auto 1%;
  border-radius: 10%; }

.animacion_tierra {
  display: flex;
  width: 100%; }
  .animacion_tierra img {
    z-index: 2;
    width: 10%;
    animation-name: prueba;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in;
    animation-duration: 7s;
    animation-delay: 2s; }
  .animacion_tierra p {
    align-self: center;
    z-index: 1;
    color: #b0dcf7;
    font-size: 3rem;
    animation-name: prueba2;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in;
    animation-duration: 7s;
    animation-delay: 2.5s;
    opacity: 0;
    margin-left: 21rem; }
  @media screen and (max-width: 1250px) {
    .animacion_tierra {
      display: none; } }
  @media screen and (max-width: 992px) {
    .animacion_tierra {
      display: none; } }
  @media screen and (max-width: 576px) {
    .animacion_tierra {
      display: none; } }
  @media screen and (max-width: 360px) {
    .animacion_tierra {
      display: none; } }

@keyframes prueba {
  0% {
    transform: translatex(0rem); }
  50% {
    transform: translatex(81rem) rotate(250deg); }
  75% {
    transform: rotate(-250deg); }
  100% {
    transform: translateX(0rem); } }

@keyframes prueba2 {
  0% {
    opacity: 0; }
  50% {
    opacity: 0; }
  80% {
    opacity: .5; }
  96% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/*termina comunidad*/
/*paginas enproceso*/
.animacion_datos h2 {
  color: #f9e84c;
  font-size: 4rem;
  animation-name: mar;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
  animation-duration: 10s;
  z-index: 1;
  position: relative;
  bottom: 20rem; }
  @media screen and (max-width: 992px) {
    .animacion_datos h2 {
      font-size: 2rem; } }
  @media screen and (max-width: 576px) {
    .animacion_datos h2 {
      font-size: 1.2rem; } }
  @media screen and (max-width: 360px) {
    .animacion_datos h2 {
      font-size: .75rem; } }

.animacion_datos img {
  position: relative;
  top: -12rem;
  width: 100%;
  height: 70rem;
  z-index: 2;
  opacity: 0.5; }

@keyframes mar {
  0% {
    transform: rotate(0deg) translatex(0rem) translateY(0rem); }
  10% {
    transform: rotate(3deg) translatex(-4rem) translateY(-6rem); }
  20% {
    transform: rotate(-3deg) translatex(4rem) translateY(-13rem); }
  30% {
    transform: rotate(3deg) translatex(-4rem) translateY(-24rem); }
  40% {
    transform: rotate(-3deg) translatex(5rem) translateY(-33rem); }
  50% {
    transform: rotate(3deg) translatex(-5rem) translateY(-45rem); }
  60% {
    transform: rotate(-3deg) translatex(4rem) translateY(-33rem); }
  70% {
    transform: rotate(3deg) translatex(-5rem) translateY(-24rem); }
  80% {
    transform: rotate(-3deg) translatex(4rem) translateY(-13rem); }
  90% {
    transform: rotate(3deg) translatex(-4rem) translateY(-6rem); }
  100% {
    transform: rotate(0deg) translateX(0rem) translateY(0rem); } }

/* termina paginas enproceso*/
/*footer*/
.linkredes img {
  width: 10%; }

.priv_seg a {
  text-decoration: none;
  color: aliceblue; }