@charset "UTF-8";
/** solo tengo que cambiarlo en los dondicionales tengo que 
escribir el nombre de la variable que quiero usar  y se ejecutra 
el condicional segun a donde me quiero mover si estilo oscuro o mas claro
**/
.flexible, .grilla-contacto {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-areas: "a1 a2";
  gap: 0px;
  color: #fcf9ee;
  font-size: 33px;
}

**/
ol li {
  text-align: center;
  background-color: #cfc5af;
  list-style-type: none;
  padding-top: 10px;
  padding-bottom: 10px;
  border-top: solid 2px rgb(75, 73, 62);
  border-bottom: solid 5px rgba(56, 56, 39, 0.8431372549);
  border-left: solid 3px #3a3434;
  border-right: solid 3px #413d3d;
  border-radius: 8px;
}

footer {
  margin-top: 100px;
}
footer .footer-grid {
  background-color: rgba(187, 166, 125, 0.8980392157);
  padding-bottom: 2px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 0px;
  padding: 2px 0px;
}

footer .footer-grid .footer-box {
  display: flex;
  flex-direction: row;
  justify-content: center;
  border: solid 7px rgba(59, 56, 50, 0);
  padding: 12px 12px;
}
footer .footer-grid .footer-box .copyright p {
  font-size: 20px;
}
footer .footer-grid .footer-box ol {
  list-style: none;
  display: flex;
  flex-direction: row;
  padding: 0;
  margin: 0;
  gap: 30px;
}
footer li{
 text-align: center;
  background-color: #cfc5af;
  list-style-type: none;
  padding-top: 10px;
  padding-bottom: 10px;
  border-top: solid 2px rgb(75, 73, 62);
  border-bottom: solid 5px rgba(56, 56, 39, 0.8431372549);
  border-left: solid 3px #3a3434;
  border-right: solid 3px #413d3d;
  border-radius: 8px;
}
footer .footer-grid .footer-box li {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 5px 10px;
}

footer .footer-grid .footer-box .top-navigation {
  background-color: #cfc5af;
  border-radius: 8px;
  font-size: 15px;
}
footer .footer-grid .footer-box .top-navigation:hover {
  transform: scale(1.1);
  margin-left: 20px;
  transition: 0.4s;
}
footer a {
  color: rgb(155, 103, 5);
  font-size: 18px;
  text-decoration: none;
}
footer a:hover {
  color: #fcfaf4;
  padding: 6px 3px;
  transition: 0.3s;
  transform: scale(1.1);
}

/** NAV BAR INDEX **/
.navbarindex {
  display: flex;
  gap: 30px;
  background-color: rgba(207, 196, 166, 0.8274509804);
  align-items: center;
  border-radius: 3px;
  padding-left: 380px;
  padding-top: 30px;
  padding-bottom: 25px;
}
.navbarindex .navbarlinkindex {
  background-color: #cfc5af;
  text-decoration: none;
  margin-left: 0px;
  margin-right: 20px;
  border-top: solid 3px rgb(75, 73, 62);
  border-bottom: solid 10px #383827;
  border-left: solid 3px #3a3434;
  border-right: solid 3px #413d3d;
  border-radius: 8px;
  padding: 10px 20px 10px 20px;
  gap: 10px;
  color: rgb(155, 103, 5);
}
.navbarindex a:hover {
  font-size: 20px;
  transform: scale(1.01);
  transition: 0.5s;
  text-decoration: underline;
  border-top: solid 3px rgba(56, 56, 39, 0.7254901961);
  border-left: solid 3px rgba(56, 56, 39, 0.7254901961);
  border-right: solid 5px rgba(56, 56, 39, 0.7254901961);
  border-bottom: solid 8px rgba(56, 56, 39, 0.7254901961);
  color: #080808;
}

/** NAV BAR FUERA DEL INDEX**/
.navbar {
  display: flex;
  gap: 30px;
  background-color: rgba(207, 196, 166, 0.8274509804);
  align-items: center;
  border-radius: 3px;
  padding-left: 20px;
  padding-top: 25px;
  padding-bottom: 25px;
  padding-top: 30px;
}
.navbar .navbarlink {
  background-color: #cfc5af;
  text-decoration: none;
  margin-right: 200px;
  border-top: solid 3px rgb(75, 73, 62);
  border-bottom: solid 10px #383827;
  border-left: solid 3px #3a3434;
  border-right: solid 3px #413d3d;
  border-radius: 5px;
  padding: 3px 10px;
  gap: 10px;
  display: flex;
  padding-left: 50px;
}
.navbar .navbarlink:hover {
  background-color: rgba(235, 217, 191, 0.4039215686);
  font-size: 25px;
  color: #252420;
  margin-top: 7px;
  font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
  transition: 0.7s;
}
.navbar .linkindex {
  background-color: #cfc5af;
  text-decoration: none;
  margin-bottom: 10px;
  margin-left: 0px;
  margin-right: 20px;
  border-top: solid 3px rgb(75, 73, 62);
  border-bottom: solid 10px #383827;
  border-left: solid 3px #3a3434;
  border-right: solid 3px #413d3d;
  border-radius: 8px;
  padding: 5px 10px;
}
.navbar .linkindex:hover {
  font-size: 29px;
  color: #252420;
  padding-left: 80px;
  padding-right: 80px;
  margin-top: 7px;
  font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
  transition: 0.8s;
}
.navbar .navbar-toggler:hover {
  font-size: 30px;
  border: solid 3px #e9d981;
  border-radius: 3%;
  transition: 0.3s;
  filter: contrast(65);
  font-size: 33px;
}
.navbar a {
  color: rgb(155, 103, 5);
  font-size: 25px;
  text-align: center;
}

/**ACA EMPIEZA QUE ES EL AIRSOFT **/
/** esta parte esta tambien en el html de mapa h3 texto-tipo **/
.texto-tipo {
  margin: 0;
  background-color: #F1D3B3;
  color: #0f0e0d;
  font-family: Georgia, Times, "Times New Roman", serif;
  font-size: 40px;
  padding-top: 0px;
  padding-left: 10px;
  padding-bottom: 30px;
  border-radius: 7px;
  text-align: center;
  margin-bottom: 0;
  /** con este condicional estoy dando modo oscuro a la mayoria de los textos principales de los html **/
  background-color: rgba(99, 81, 62, 0.7803921569);
  color: #ffffff;
  font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;
  font-size: 38px;
}
.texto-tipo p:hover {
  font-size: 45px;
  color: #ffffff; /**lo voy a cambiar a blanco por el modo oscuro **/
  border-radius: 3% solid;
  transition: 0.3s;
}
.texto-tipo h2 {
  background-color: #BBAB8C;
  box-sizing: border-box;
  color: rgb(155, 103, 5);
  font-size: 35px;
  padding: 10px 15px;
  text-decoration: none;
  margin-left: 30px;
  margin-right: 30px;
  border-top: solid 7px rgb(75, 73, 62);
  border-bottom: solid 10px #383827;
  border-left: solid 7px #3a3434;
  border-right: solid 7px #413d3d;
  border-radius: 8px;
  padding: 10px 10px 10px 10px;
}
.texto-tipo .titulo {
  margin-bottom: 25px;
  margin-top: 0px;
  font-size: 50px;
  text-align: center;
  color: #fcf9ee;
  background-color: #5D5241;
  box-shadow: 2px 10px 3px #928269;
  padding-top: 10px;
  padding-bottom: 10px;
}
.texto-tipo #textocomoseorigino {
  background-color: #F1D3B3;
  font-size: 33px;
  margin: 0px 0px;
  padding: 5px 15px;
  background-color: rgba(99, 81, 62, 0.7803921569);
  color: #ffffff;
  font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;
  font-size: 38px;
}

/**ACA EMPIEZA EL HTML DE CONTACTO **/
.grilla-contacto .contacto {
  display: flexbox;
  width: 100%;
  height: 100%;
  border: 7px solid rgba(71, 70, 12, 0.877);
}
.grilla-contacto .contacto:hover {
  box-shadow: 15px 14px 15px 15px #494444;
}
.grilla-contacto .contacto .input {
  max-width: 80%;
}
.grilla-contacto .contacto .c2 {
  text-decoration: none;
}
.grilla-contacto .contacto img {
  object-fit: cover;
  height: 100%;
  width: 100%;
  padding-right: 0px;
}

.c1 {
  background-image: url(https://images.unsplash.com/photo-1665065769045-159f8ecf5016?q=80&w=1933&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D);
  background-size: 120%;
  height: 100%;
  width: 98%;
  padding-left: 55px;
}
.c1 form {
  display: flex;
  flex-direction: column;
  justify-self: center;
  font-size: 10px;
  grid-area: form;
  gap: 10px;
}
.c1 label {
  font-size: 25px;
  padding-bottom: 30px;
}
.c1 input, .c1 textarea {
  width: 400px;
  color: #080808;
  font-size: 15px;
  background-color: #e4ddcf;
  padding: 3px 5px;
}

/**ACA TERMINA EL HTML DE CONTACTO **/
.container-index .img-carrousel {
  max-width: 100%;
  max-height: 100%;
  margin: 0px;
  padding: 0px;
  object-fit: fill;
}
.container-index button:hover {
  background-color: rgba(173, 173, 164, 0.4509803922);
  border: solid 5px rgba(196, 183, 113, 0.3882352941);
}

/** imagenes index pistolas , run , equipamiento **/
.card-body {
  background-color: #e0d9cd;
  border: solid 3px rgba(65, 65, 48, 0.8901960784);
  border-radius: 3px;
}
.card-body .card-title {
  padding-left: 0px;
  text-shadow: #5a4423;
  border: solid 1px rgba(43, 42, 41, 0.5254901961);
  margin-right: 300px;
  padding: 3px 10px;
  padding-left: 35px;
  border-radius: 5px;
  justify-content: center;
}
.card-body a:hover {
  font-size: 20px;
  margin-left: 50px;
  transition: 0.5s;
  box-shadow: #3a3434 3px 2px 1px 3px;
}

/** termino index **/
/** ACA EMPIEZA EL HTML DE MAPA DONDE JUGAR **/
.grilla-mapa {
  padding-bottom: 30px;
  padding-left: 30px;
  padding-right: 30px;
  margin-top: 0px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr;
  gap: 25px;
  grid-template-areas: "mapa1 mapa2 mapa3 " "mapa5 mapa6  mapa7";
}
.grilla-mapa .mapa {
  text-align: center;
  border: solid 5px #4e3919;
  display: flexbox;
  padding: 0px;
  background-color: rgba(222, 208, 182, 0.2196078431);
}
.grilla-mapa .mapa iframe {
  margin-top: 35px;
  margin-left: 5px;
  margin-right: 5px;
  margin-bottom: 0px;
}
.grilla-mapa .mapa:hover {
  background-color: rgba(240, 225, 191, 0.4392156863);
  border-radius: 3%;
  box-shadow: 5px 5px 9px 10px;
}
.grilla-mapa .mapa .m1 {
  grid-area: mapa1;
}
.grilla-mapa .mapa h2 {
  background-color: rgba(136, 113, 79, 0.8980392157);
  box-sizing: border-box;
  color: rgb(29, 22, 10);
  font-size: 31px;
  padding: 10px 15px;
  text-decoration: none;
  margin-left: 20px;
  margin-right: 20px;
  border-top: solid 7px rgb(75, 73, 62);
  border-bottom: solid 10px #383827;
  border-left: solid 7px #3a3434;
  border-right: solid 7px #413d3d;
  border-radius: 8px;
  padding: 10px 10px 10px 10px;
  color: #fcfaf4;
  font-family: "Times New Roman", Times, serif;
  text-align: center;
  max-width: 100%;
}
.grilla-mapa .mapa h2:hover {
  background-color: rgb(122, 89, 44);
}
.grilla-mapa .mapa .mapa-link {
  justify-content: center;
}
.grilla-mapa .mapa .mapa-link #linkmapa {
  margin-top: 5px;
  box-shadow: 5px 5px 6px 5px #3a3434;
  box-sizing: border-box;
  color: rgb(155, 103, 5);
  font-size: 19px;
  padding: 10px 15px;
  background-color: #BBAB8C;
  text-decoration: none;
  border-top: solid 7px rgb(110, 110, 105);
  border-bottom: solid 10px #35352c;
  border-left: solid 7px #3a3737;
  border-right: solid 7px #35342d;
  border-radius: 8px;
  padding: 10px 10px 10px 10px;
}
.grilla-mapa .mapa .mapa-link #linkmapa:hover {
  background-color: rgba(122, 89, 44, 0.767);
  color: aliceblue;
  box-shadow: 5px 5px 10px 10px #3a3434;
  text-decoration: none;
  box-sizing: border-box;
  font-size: 19px;
  padding: 10px 15px;
  box-sizing: border-box;
  border-top: solid 3px rgb(75, 73, 62);
  border-bottom: solid 10px #383827;
  border-left: solid 3px #3a3434;
  border-right: solid 3px #413d3d;
  border-radius: 8px;
  padding: 10px 10px 10px 10px;
  text-decoration: underline;
}

/**ACA TERMINA EL HTML DE DONDE JUGAR MAPA  **/
/**ACA EMPIEZA TIPO MARCADORAS **/
.grilla-tipoMarcadoras {
  padding: 10px 100px;
  margin: 100px 0px;
  display: grid;
  font-family: "Franklin Gothic Medium", "Arial Narrow", Arial, sans-serif;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 200px;
  gap: 15px 5px;
  grid-template-areas: " a1 a2 a3 a4 " "a5 a6 a7 a8";
}
.grilla-tipoMarcadoras .box-tipoMarcadoras {
  width: 400px;
  height: 400px;
  border: 5px solid rgb(122, 89, 44);
  justify-content: center;
  align-items: center;
  display: flexbox;
  border-radius: 10px;
  margin: 0px;
}
.grilla-tipoMarcadoras .box-tipoMarcadoras:hover {
  background-color: rgba(172, 169, 164, 0.7529411765);
  border: 5px solid rgba(34, 25, 12, 0.937254902);
  box-shadow: 10px 10px 10px 8px #5D5241;
}
.grilla-tipoMarcadoras .box-tipoMarcadoras img {
  height: 100%;
  width: 100%;
  object-fit: fill;
}
.grilla-tipoMarcadoras .box-tipoMarcadoras img:hover {
  width: 105%;
  height: 105%;
  border: 5px solid rgba(138, 100, 39, 0.6980392157);
  box-shadow: 8px 7px 8px 7px rgba(61, 54, 43, 0.8823529412);
  transition: 0.3s;
}
.grilla-tipoMarcadoras .titulobox-tipoMarcadoras {
  text-align: center;
  padding: 3px 2px;
  font-size: 25px;
  background-color: #464242;
  color: #fcf9ee;
  text-decoration: 3px overline;
  align-self: start;
}
.grilla-tipoMarcadoras .titulobox-tipoMarcadoras.titulobox-tipoMarcadoras:hover {
  background-color: rgba(73, 68, 57, 0.9176470588);
  filter: hue-rotate(26);
}
.grilla-tipoMarcadoras .textometros {
  background-color: #928269;
  color: #DED0B6;
  align-self: end;
  padding: 8px 4px;
}
.grilla-tipoMarcadoras .textometros.textometros:hover {
  background-color: #5a4423;
  font-size: 25px;
  padding-left: 10px;
}
.grilla-tipoMarcadoras .textobox-tipoMarcadoras {
  padding: 10px 30px;
  height: 180px;
  background-color: #BBAB8C;
  color: #fcf9ee;
  overflow: auto;
}
.grilla-tipoMarcadoras .textobox-tipoMarcadoras.textobox-tipoMarcadoras:hover {
  background-color: rgba(219, 175, 107, 0.6431372549);
  font-size: 25px;
  text-align: center;
  overflow: auto;
}
.grilla-tipoMarcadoras .b1 {
  order: 0;
}
.grilla-tipoMarcadoras .b5 .circulo {
  margin-top: 5px;
  margin-left: 10px;
  width: 35Px;
  height: 35px;
  background-color: rgb(255, 255, 255);
  border-radius: 3px black;
  border-radius: 50%;
  align-self: start;
  align-items: center;
  position: absolute;
  order: 5;
}
.grilla-tipoMarcadoras .b6 .circulo {
  margin-top: 5px;
  margin-left: 10px;
  width: 35Px;
  height: 35px;
  background-color: green;
  border-radius: 3px black;
  border-radius: 50%;
  align-self: start;
  align-items: center;
  position: absolute;
}
.grilla-tipoMarcadoras .b7 .circulo {
  margin-top: 5px;
  margin-left: 10px;
  width: 35Px;
  height: 35px;
  background-color: yellow;
  border-radius: 3px black;
  border-radius: 50%;
  align-self: self-start;
  align-items: center;
  position: absolute;
}
.grilla-tipoMarcadoras .b8 .circulo {
  margin-top: 5px;
  margin-left: 10px;
  width: 35Px;
  height: 35px;
  background-color: red;
  border-radius: 3px black;
  border-radius: 50%;
  align-self: self-start;
  align-items: center;
  position: absolute;
}

/** aca termina HTML TIPO MARCADORAS  **/
/**ACA EMPIEZA EL HTML DE DISTINTOS TIPOS DE PARTIDAS**/
body {
  margin:  0px 0px;
  padding: 0px 0px;
  background-image: url("https://wallpapers.com/images/featured/camo-b4jyfziypywrtbbz.jpg");
  background-size: 110%;
}

main .titulo {
  margin-bottom: 25px;
  margin-top: 0px;
  font-size: 50px;
  text-align: center;
  color: #fcf9ee;
  background-color: #5D5241;
  box-shadow: 2px 10px 3px #928269;
  padding-top: 10px;
  padding-bottom: 10px;
}

.tipos-partidas {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr 100%;
  gap: 10px;
}
.tipos-partidas .box-tipopartidas {
  border: solid 5px rgba(233, 194, 137, 0.4588235294);
  display: flexbox;
  padding: 0px 0px;
  border-radius: 5px;
  background-color: rgba(161, 154, 146, 0.8352941176);
}
.tipos-partidas .box-tipopartidas .h2 {
  background-color: #F1D3B3;
  font-size: 33px;
  padding: 10px 5px;
  text-align: center;
  color: rgba(17, 16, 15, 0.4588235294);
}
.tipos-partidas .box-tipopartidas:hover {
  border: solid 10px rgba(252, 208, 142, 0.6862745098);
  display: flex;
  box-shadow: inset 5px 1px 20px 5px;
  border-radius: 5px;
  background-color: rgba(177, 171, 117, 0.8352941176);
  transition: 0.6s;
  transform: scale(1, 1.1);
  font-family: "Trebuchet MS", "Lucida Sans Unicode", "Lucida Grande", "Lucida Sans", Arial, sans-serif;
}
.tipos-partidas .box-tipopartidas .textopartidas {
  color: #252420;
  background-color: #FAEED1;
  box-shadow: 5px 10px 1px #8a7968;
}
.tipos-partidas .box-tipopartidas .textopartidas p:hover {
  margin: 10px;
  background-color: #cfc5af;
  font-family: "Gill Sans", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
  transform: scale(2, 0, 1);
  transition: 0.6s;
  border-radius: 3px;
}
.tipos-partidas .box-tipopartidas .textopartidas p {
  margin: 0px;
  max-width: 100%;
  padding: 5px 15px;
}

@media (max-width: 950px) {
  .tipos-partidas {
    display: flex;
    flex-wrap: row;
    flex-wrap: wrap;
    margin: 0px;
  }
  .texto-tipo img {
    width: 400px;
    height: 200px;
  }
}
@media (max-width: 1250px) {
  .card-group {
    display: grid;
    grid-template-columns: 1fr;
  }
}
/** ACA TERMINA EL HTML TIPO DE PARTIDAS **/
/** MEDIA DE NAVBARINDEX **/
@media (max-width: 1450px) {
  .navbarindex {
    background-color: rgba(153, 141, 89, 0.8156862745);
    display: flexbox;
    flex-direction: row;
    margin: 0px 0px;
    padding: 10px 30px;
    font-size: 10px;
    gap: 3px;
  }
  .navbarlinkindex {
    padding: 5px 5px;
    margin: 0px 25px;
    font-size: 15px;
    color: #5a4423;
  }
  .navbarlinkindex:hover {
    font-size: 20px;
    padding: 8px 10px;
    transition: 0.3s;
    text-decoration: underline;
    border-top: solid 3px rgba(56, 56, 39, 0.7254901961);
    border-left: solid 3px rgba(56, 56, 39, 0.7254901961);
    border-right: solid 5px rgba(56, 56, 39, 0.7254901961);
    border-bottom: solid 8px rgba(56, 56, 39, 0.7254901961);
    color: #0f0e0d;
  }
}
@media (max-width: 900px) {
  .navbarindex {
    background-color: rgba(104, 99, 78, 0.8156862745);
    display: flexbox;
    flex-direction: column;
    margin: 0px 0px;
    padding: 10px 2px;
    font-size: 10px;
    align-items: stretch;
  }
  .navbarlinkindex {
    padding: 5px 15px;
    margin: 0px 15px;
    font-size: 15px;
    color: #5a4423;
  }
}
/**MEDIA DE NAVBAR HTMLS ¿ porque no me lo toma?**/
@media (max-width: 1300px) {
  .navbar {
    display: flex;
    margin: 0px 0px;
    padding: 10px 2px;
  }
  .navbarlink {
    display: flex;
    margin: 0px 0px;
    padding: 10px 5px;
  }
}
@media (max-width: 900px) {
  .navbarlink {
    width: 70%;
    font-size: 15px;
    padding-left: 5px;
    padding-right: 5px;
  }
  .navbarlink:hover {
    font-size: 10px;
    padding-left: 50px;
    padding-right: 15px;
    width: 70%;
    transition: 0.4s;
  }
  .linkindex:hover {
    font-size: 20px;
    transition: 0.3s;
  }
}

       
  

/**FOOTER  **/
@media (max-width: 600px) {
  footer .footer-grid {
    flex-direction: column;
    align-items: center;
    padding: 10px;
    gap: 20px;
  }


  footer .footer-grid .footer-box {
    flex-direction: column; /* 🔁 CAMBIA de row a column */
    align-items:stretch ; /* quiero a la izquierda */
    margin: 0px 0px;
    padding: 10px 2px;
  }

  footer .footer-grid .footer-box ol {
    flex-direction: column; /* 🔁 CAMBIA de row a column */
    align-items: stretch;
    margin: 0px 0px;
    padding: 10px 2px;
    gap: 10px;
  }

  footer li {
    width: 100%;
    text-align: center;
    font-size: 16px;
  }

  footer .copyright p {
    text-align: center;
    font-size: 14px;
  }
}

/** INDEX **/
@media (max-width: 2050px) {
  .card-title {
    padding: 3px 2px;
    width: 400px;
  }
}
@media (max-width: 850px) {
  .card-title {
    padding: 3px 2px;
    width: 250px;
  }
}
/** MEDIA DE QUE ES EL AIRSOFT 1 HTML **/
/** MEDIA DE TIPOS DE MARCADORAS **/
@media (max-width: 1750px) {
  .grilla-tipoMarcadoras {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: flex-start;
  }
  .b1 {
    order: 1;
  }
  .b5 {
    order: 2;
  }
  .b2 {
    order: 3;
  }
  .b6 {
    order: 4;
  }
  .b3 {
    order: 5;
  }
  .b7 {
    order: 6;
  }
  .b4 {
    order: 7;
  }
  .b8 {
    order: 8;
  }
}
@media (max-width: 950px) {
  .grilla-tipoMarcadoras {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: flex-start;
  }
  .b1 {
    order: 1;
  }
  .b5 {
    order: 2;
  }
  .b2 {
    order: 3;
  }
  .b6 {
    order: 4;
  }
  .b3 {
    order: 5;
  }
  .b7 {
    order: 6;
  }
  .b4 {
    order: 7;
  }
  .b8 {
    order: 8;
  }
}
/**MEDIA TIPO PARTIDAS 3ER HTML **/
@media (max-width: 950px) {
  .tipos-partidas {
    display: flex;
    flex-wrap: row;
    flex-wrap: wrap;
    margin: 0px;
  }
  .texto-tipo img {
    width: 400px;
    height: 200px;
  }
}
@media (max-width: 1250px) {
  .card-group {
    display: grid;
    grid-template-columns: 1fr;
  }
}
/** MEDIA LUGARES DONDE JUGAR MAPA  4TO HTML   **/
@media (max-width: 1850px) {
  .grilla-mapa {
    display: flex;
    flex-direction: column;
    gap: 15px;
  }
  iframe {
    max-width: 90%;
    min-height: 90%;
  }
}
@media (max-width: 850px) {
  #linkmapa {
    text-decoration: none;
  }
  a {
    font-size: 5px;
  }
  iframe {
    max-width: 90%;
    min-height: 90%;
  }
}
/** MEDIA CONTACTO HTML 5 **/
@media (max-width: 950px) {
  .grilla-contacto {
    display: flex;
    flex-direction: column;
    padding-bottom: 20px;
    gap: 3px;
    object-fit: cover;
  }
  .form {
    max-width: 90%;
  }
  .input {
    max-width: 60%;
  }
  .textarea {
    margin-left: 0px;
    max-width: 90%;
    height: 300px;
  }
  .c1 {
    height: 20px;
  }
}
/**aca tengo que mover el bottom  **/

/*# sourceMappingURL=style.css.map */
