/*Estilos del contenido*/

body{

  margin: 0;

  font-family: 'Roboto', sans-serif;

  background-color: #EBEBEB;

}

.fondoPerfilPublico {

   background-image: url(../img/fondoPerfilPublico.jpg);

   background-repeat: no-repeat;

   background-size: cover;

   background-attachment: fixed;

}

.fondoPartidosMiniTorneo {

   background-image: url(../img/fondoMiniTorneoPartido1.jpg);

   background-repeat: no-repeat;

   background-size: cover;

   background-attachment: fixed;

}

.fondoInicio1 {

  background-image: url(../img/fondoInicio.jpg);

  background-repeat: no-repeat;

  background-size: cover;

  background-attachment: fixed;

}

.alerta{

  color: #f00;

    font-size: 22px;

    font-weight: 700;

    border: 2px solid;

    display: inline-block;

    padding: 5px;

}

footer {

  position: fixed;

  background-color: #565656;

  color: #fff;

  font-size: 18px;

  font-weight: 600;

  box-sizing: border-box;

  bottom: 0;

  left: 0;

  right: 0;

}


    footer nav ul {

      display: flex;

      justify-content: space-around;

      margin: 0;

      padding: 0;

    }

      footer nav ul li {

        list-style: none;

      }

        footer nav ul li a {

          display: block;

          padding: 10px;

          color: #fff;

          text-decoration: none;

          transition: padding 1s;

        }

          footer nav ul li a:hover {

            background-color: #2e69b6;

            padding: 10px 30px;

          }

.negrilla {

  font-weight: 600;

}

.separador {

  height: 30px;

}

header {

  background-color: #565656;

}

.logo img{

  height: 53px;

}

.logoMenu {

  border-bottom: 1px solid #464141;

  padding: 20px;

  text-align: center;

}

.logoMenu img {

height: 80px;

}

.logoHome{

  width:343px;

}

.logoErrorRegistro{

  width:143px;

  padding-bottom: 20px;

}

.contenedor {

  width: 1300px;

  margin: 0 auto;

  display: flex;

  justify-content: space-between;

  padding: 20px;



}

header > .contenedor {

  display: flex;

  align-items: center;

  justify-content: space-between;

  padding: 10px;

}



.col80 {

  width: 80%;

  box-sizing: border-box;

}



.col60 {

  width: 60%;

      background-color: #ffffffd9;

      padding: 20px 80px 80px;

      box-sizing: border-box;

}

.col100 {

  width: 100%;

  box-sizing: border-box;

  padding: 20px 20px 80px;

}





h1 {

  color:#565656;

  font-size: 26px;

  margin: 0;

  font-weight: 900;

}

h2 {

  color:#565656;

  font-size: 22px;

  margin: 0;

  font-weight: 900;

}

h2.blanco {

  color: #fff;

}

h4{

  color:#565656;

  font-size: 20px;

  margin: 0;

  font-family: 'Roboto', sans-serif;

}

p {

  margin: 5px 0 19px;

}

.nombreEquipo {

  color:#2E69B6;

  font-size: 26px;

  margin: 0;

  font-weight: 900;

}

.nombreEquipo.blanco {

  color:#fff;

}

.rankingEquipo {

  color: #2E69B6;

  font-size: 58px;

  margin: 0;

  font-weight: 900;

  text-align: center;

  padding: 18px 10px;

}



.progresoPerfil {

  position: relative;

  border: 1px solid #808080;

padding: 10px;

font-weight: 700;

color: #A5A5A5;

margin: 20px 0;

width: 329px;

}

.progresoPerfil .porcentajeVisual{

  position: absolute;

      height: 100%;

      width: 30%;

      top: 0;

      background-color: #D4D4D4;

      left: 0;

      z-index: -1;

}

.ciudadPaisPerfil {

  color:#2E69B6;

  font-size: 17px;

  font-weight: 700;

}

.ciudadPaisPerfil.blanco {

  color:#fff;

}

.marcoCuadrosA {

  display: flex;

  padding:  20px 20px 20px 0

}

.cuadroA {

  width: 114px;

      height: 130px;

      border: 1px solid #808080;

      position: relative;

      margin: 0 10px 0 0;

}

  .cuadroA .contenidoA{

    background-color: #ffffffd1;

  }

  .cuadroA .etiquetaA{

    position: absolute;

        background-color: #565656;

        bottom: 0;

        padding: 6px;

        color: #fff;

        font-size: 13px;

        width: 100%;

        box-sizing: border-box;

        font-weight: 600;

  }

.datosRegi {

  display: flex;

}

  .datosRegi .cuadro{

    padding:10px;

    border: 1px solid #808080;

    position: relative;

    font-size: 13px;

  }

  .marcoBotones {

    margin: 10px 20px 20px 0;

  }

  .hamburguerMenu {
    cursor: pointer;
    padding: 11px;
    border-radius: 0px;
    transition: all 0.3s;
  }
  .hamburguerMenu:hover {
    background-color: #909090;
    border-radius: 5px;
    box-shadow: 0 0 5px 0 #000;
  }

.botonTipo1 {

    padding: 7px 23px;

    border: 1px solid #00CCFF;

    position: relative;

    font-size: 18px;

    background-color: #2E69B6;

    display: inline-block;

    color: #fff;

    text-decoration: none;

    font-weight: 600;

    cursor: pointer;

    font-family: 'Roboto', sans-serif;

}

  .botonTipo1:hover {

    background-color: #2d5282;

  }



.botonTipo3 {

    padding: 4px 23px;

    border: 1px solid #9D344F;

    position: relative;

    font-size: 18px;

    background-color: #9D344F;

    display: inline-block;

    color: #fff;

    text-decoration: none;

    font-weight: 600;

    cursor: pointer;

    display: block;

    text-align: center;

    font-family: 'Roboto', sans-serif;

}

  .botonTipo3:hover {

    background-color: #bf0535;

  }

.botonTipo4 {

    padding: 4px 23px;

    border: 1px solid #FFA700;

    position: relative;

    font-size: 18px;

    background-color: #B6652E;

    display: inline-block;

    color: #fff;

    text-decoration: none;

    font-weight: 600;

    cursor: pointer;

    display: block;

    text-align: center;

    font-family: 'Roboto', sans-serif;

}



.botonfiltrar2{

  color: white;

  background-color: #2E69B6;

  padding: 5px 15px 5px 15px;

  border: 1px solid #00CCFF;

  cursor:pointer;

}

.botonfiltrar3{

  color: white;

  background-color: #9D344F;

  padding: 5px 15px 5px 15px;

  border: 1px solid #FF004D;

  cursor:pointer;

}



  .botonTipo4:hover {

    background-color: #ff4100;

  }

.botonTipo5 {

    padding: 4px 23px;

    border: 1px solid #00CCFF;

    position: relative;

    font-size: 18px;

    background-color: #2E69B6;

    display: inline-block;

    color: #fff;

    text-decoration: none;

    font-weight: 600;

    cursor: pointer;

    display: block;

    text-align: center;

}

  .botonTipo5:hover {

    background-color: #2d5282;

  }

.botonTipo6 {

  padding: 12px 34px;

      border: 1px solid #00CCFF;

      position: relative;

      font-size: 31px;

      background-color: #2E69B6;

      display: inline-block;

      color: #fff;

      text-decoration: none;

      font-weight: 600;

      cursor: pointer;

}

  .botonTipo6:hover {

    background-color: #2d5282;

  }

.botonTipo7 {

  padding: 15px 23px;

      border: 1px solid #00CCFF;

      position: relative;

      font-size: 29px;

      background-color: #2E69B6;

      display: inline-block;

      color: #fff;

      text-decoration: none;

      font-weight: 700;

      cursor: pointer;

      width: 555px;

      border-radius: 0 0 27px 27px;

  }

    .botonTipo7:hover {

      background-color: #2d5282;

    }

.botonTipo8 {

  padding: 15px 0;

  font-size: 19px;

  display: inline-block;

  color: #7b7474;

  text-decoration: none;

  font-weight: 700;

  cursor: pointer;

  transition: all 0.3s;

}

    .botonTipo8:hover {

      background-color: #757575;

      color: #fff;

      padding: 15px 20px;

      margin: 10px 0;

    }



.botonTipo2 {
  display: block;
  padding: 10px;
  border: 1px solid #00CCFF;
  position: relative;
  font-size: 18px;
  background-color: #2E69B6;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
  height: 130px;
  margin-right: 10px;
  width: 140px;
  transition: all 0.3s;
}

  .botonTipo2:hover {

    transform: scale(1.07) translateY(-10px);

    box-shadow:3px 7px 9px 1px #00000059;

  }

  .botonTipo2 .numeroNotificacion{

    position: absolute;

    top: 10px;

    right: 10px;

    font-size: 29px;

    color: #A3D534;

  }

  .botonTipo2 .nombreBoton{

    position: absolute;

    bottom: 10px;

    left: 10px;

    right: 10px;

    text-align: center;

  }

.marcoCuadroB {

  display: flex;

  padding: 20px 0;

}

  .marcoCuadroB .cuadroB {

    width: 91px;

    height: 109px;

    border: 1px solid #808080;

    position: relative;

    margin: 0 10px 0 0;

    background-color: #ffffffd1;

  }

    .marcoCuadroB .cuadroB .contenidoB {

      font-size: 58px;

    font-weight: 900;

    text-align: center;

    padding-top: 3px;

    color: #565656;

    }

    .marcoCuadroB .cuadroB .etiquetaB {

      position: absolute;

          background-color: #565656;

          bottom: 0;

          padding: 6px;

          color: #fff;

          font-size: 16px;

          width: 100%;

          box-sizing: border-box;

          font-weight: 600;

          text-align: center;

    }

    .marcoCuadroB .cuadroB.flagJugados {

      background-image: url(../img/flag-partidos-jugados.png);

      background-position: top left;

      background-repeat: no-repeat;

    }

    .marcoCuadroB .cuadroB.flagGanados {

      background-image: url(../img/flag-partidos-ganados.png);

      background-position: top left;

      background-repeat: no-repeat;

    }

    .marcoCuadroB .cuadroB.flagEmpatados {

      background-image: url(../img/flag-partidos-empatados.png);

      background-position: top left;

      background-repeat: no-repeat;

    }

    .marcoCuadroB .cuadroB.flagPerdidos {

      background-image: url(../img/flag-partidos-perdidos.png);

      background-position: top left;

      background-repeat: no-repeat;

    }

  .tips {

    display: block;

        padding: 10px;

        border: 1px solid #00CCFF;

        position: relative;

        font-size: 16px;

        background-color: #2E69B6;

        color: #fff;

        text-decoration: none;

        font-weight: 400;

        width: 402px;

        box-sizing: border-box;

        animation: fadeIn 1s;

  }

  .notificacionesTop {

    background-color: #565656;



    padding: 15px;

    color: #fff;

    font-size: 18px;

    width: 402px;

    box-sizing: border-box;

    font-weight: 600;

    margin: 20px 0 3px;



  }

  .notificacionesInfo {

    padding: 8px;

    color: #565656;

    border: 1px solid #808080;

    width: 402px;

    box-sizing: border-box;

    font-size: 14px;



  }

  .marcoInputs {

    width: 900px;

    position: relative;

    display: flex;

    flex-wrap: wrap;

    margin-top: 20px;

  }

    .campoincompleto {

      background-color: #fff8cf !important;

    }

    .marcoInputs .labelInputs{

      width: 25%;

      border: 1px solid #808080;

      box-sizing: border-box;

      padding: 20px;

      font-weight: 600;

      background-color: #565656;

      font-size: 17px;

      color: #fff;

    }

    .marcoInputs .contenidoInputs75{

      width: 75%;

      border: 1px solid #808080;

      box-sizing: border-box;

      padding: 10px;

      background-color: #ebebeb;

    }

    .marcoInputs .contenidoInputs25{

      width: 25%;

      border: 1px solid #808080;

      box-sizing: border-box;

      padding: 10px;

      background-color: #ebebeb;

    }

    .contenidoInputsMiniTorneos  {

      box-sizing: border-box;

      padding: 20px;

      background-color: #ebebeb;

      height: 100%;

      border: 0;

      color: #808080;

      font-size: 16px;

      width: 170px;

    }

    /*----Inicio del módulo selector---*/

    .moduloSelector {

      display: flex;

      user-select: none;



    }

      .moduloSelector .botonDerecho, .moduloSelector .botonIzquierdo {

        display: block;

        width:50px;

        background-color: #808080;

        background-repeat: no-repeat;

        background-position: center center;

        cursor: pointer;

      }

      .moduloSelector .botonIzquierdo {

        background-image: url("../img/flechaSelector.png");

        border-radius: 12px 0 0 12px;

      }

      .moduloSelector .seleccion {

        border-top: 2px solid #808080;



        border-bottom: 2px solid #808080;

      }

      .moduloSelector .botonDerecho {

        background-image: url("../img/flechaSelectorDerecha.png");

        border-radius: 0 12px 12px 0;



      }

      .moduloSelector .botonDerecho:hover, .moduloSelector .botonIzquierdo:hover {

        background-color: #2E69B6;

      }

      .moduloSelector .seleccion .numero {

        width: 114px;

        font-size: 55px;

        font-weight: 900;

        padding: 20px 0;







      }

    /*----fin del módulo selector---*/



    /*----Inicio del módulo radioButtonsRBD---*/

    .radioButtonsRBD {

      display: flex;

    }

      .radioButtonsRBD .selector{

        border-radius: 12px;

        border: 2px solid #808080;

        font-weight: 900;

        font-size: 42px;

        padding: 10px 20px;

        margin-right: 8px;

        color: grey;

        cursor:pointer;

      }

      .radioButtonsRBD .selector.activo{

        background-color: #B7E79F;

        color: #565656;

      }

    /*----Fin del módulo radioButtonsRBD---*/



    /*----Inicio de las tablas ---*/

    .marcoTablasFlex {

      display: flex;

      flex-wrap: wrap;

      margin: 10px 0;

    }

    table.tabla1 {

          border-collapse: collapse;

    }

      table.tabla1 img.ancho80 {

        width: 80px;

      }

      table.tabla1 th.col130px, table.tabla1 td.col130px{

          width: 130px;

      }

      table.tabla1 tr:nth-child(even) {

        background-color: #dce8f9;

      }

      table.tabla1 td {

        border: 1px solid #808080;

        color:  #808080;

        padding: 10px 20px;



      }

      table.tabla1 td.sinPadding {



        padding: 0;



      }

      table.tabla1 .col10 {

        width: 10px;

      }



      table.tabla1 th {

        border: 1px solid #808080;

        font-weight: 600;

        background-color: #565656;

        font-size: 15px;

        color: #fff;

        padding: 10px 20px;

      }

      table.tabla1 tr.seleccionado {

        background-color: #B7E79F;

      }

      table.tabla1 tr.tipoBoton {

        cursor: pointer;

        user-select: none;

      }



    /*----fin de las tablas ---*/



    /*----Inicio de marcador de goles ---*/

    .marcoMarcadoGoles {

      background-color: #fff;

      padding: 30px;

      width: 495px;

      margin-top: 30px;

    }

      .marcoMarcadoGoles h1 {

        font-size: 32px;

        margin-bottom: 20px;

      }

      .marcoMarcadoGoles .flexGoles{

        display: flex;

      }

      .marcoMarcadoGoles .flexGoles .equipo{

        padding: 13px;

        border: 1px solid #808080;

        position: relative;

        margin: 0 10px 0 0;

        text-align: center;

        background-image: url(../img/fondo-marcadores.jpg);

        background-repeat: repeat-x;

      }

        .marcoMarcadoGoles .flexGoles .equipo .nombreEquipo{

          color: #fff;

          font-size: 17px;

        }

        

    /*----fin de marcador de goles ---*/



      /*----Inicio de páginas externas ---*/


        .fondoInicio1 .marcoInicio {

          width: 1300px;

          margin: 0 auto;

          box-sizing: border-box;

        }

        .fondoAcerca .marcoInicio {

          width: 1300px;

          margin: 0 auto;

          box-sizing: border-box;

        }

      /*----fin de páginas externas ---*/



    /*----Inicio de formularios ---*/

    .registro {

        border: 1px solid #565656;

        width: 600px;

        position: relative;

        margin-top: 20px;

        padding: 20px;

        box-sizing: border-box;

    }

    .labelreg {

      display: inline-block;

      font-size: 15px;

      width: 170px;

    }


    .inputreg {

      width: 200px;

      background-color: #C4C4C4;

      border: 1px solid #808080;

      padding: 5px;

      box-sizing: border-box;

    }

    .inputBuscar {

      background-color: #C4C4C4;

      border-width: 0px;

      border: 1px solid #808080;

  }



    .inputregcod {

      background-color: #C2D69F;

    }

    .lineaInfoFormulario {

      padding: 3px 0;

    }

    .filtros{

      border: 1px solid #565656;

      position: relative;

      margin-top: 20px;

      padding: 10px 20px 5px 20px;

      box-sizing: border-box;

      margin-bottom: 10px;

    }

    #advertenciaInferior {

      background-color: #ea6700;

      padding: 20px;

      display: inline-block;

      color: #fff;

      border: 1px solid #808080;

      font-size: 16px;

      font-weight: 500;

      animation: fadeIn 1s;

    }

    #advertenciaInferiorMiniTorneo {

      background-color: #ea6700;

      padding: 20px;

      display: inline-block;

      color: #fff;

      border: 1px solid #808080;

      font-size: 16px;

      font-weight: 500;

      animation: fadeIn 1s;

      width: 514px;

    }



    /*----fin de formularios ---*/

    /*----Inicio Tabla minitorneos ---*/

    .tablaCompletaMiniTorneo {

      display: flex;

      margin: 20px 20px;

    }

      .tablaCompletaMiniTorneo .ganadorEtapas {

        padding: 10px;

        border: 1px solid #808080;

        position: relative;

        font-size: 18px;

        margin-bottom: 5px;

        background-color: #d8dcd9;

      }

      .tablaCompletaMiniTorneo .col2miniTorneo {

        padding: 25px;

      }

      .tablaCompletaMiniTorneo .col2miniTorneo .ganadorEtapas{

        margin-bottom: 73px;

        background-color: #a6dce2;

      }

      .tablaCompletaMiniTorneo .col2miniTorneo .ganadorEtapas:last-child{

        margin-bottom: 0;

      }

      .tablaCompletaMiniTorneo .col3miniTorneo {

        padding: 85px 0px;

      }

      .tablaCompletaMiniTorneo .col3miniTorneo .ganadorEtapas {

        margin-bottom: 192px;

        background-color: #2e99b6;

        color: white;

      }

      .tablaCompletaMiniTorneo .col3miniTorneo .ganadorEtapas:last-child{

        margin-bottom: 0;

      }

      .tablaCompletaMiniTorneo .col4miniTorneo {

        padding: 186px 25px 0;

      }

      .tablaCompletaMiniTorneo .col4miniTorneo .ganadorEtapas{

        min-height: 22px;

        border: 1px solid #00CCFF;

        position: relative;

        font-size: 18px;

        background-color: #2E69B6;

        color: #fff;

        padding: 10px 40px 10px 10px;



      }

      .tablaCompletaMiniTorneo .col4miniTorneo .ganadorEtapas img {

        vertical-align: middle;

        width: 60px;

      }

      .tablaCompletaMiniTorneo .ParPartido {

        padding-bottom: 20px;



      }



      .ProximoPartidoTabla {

        background-image: url(../img/fondoProximoPartido.jpg);

        border: 1px solid #808080;

        border-left: 18px solid #808080;

        padding: 12px;

        width: 460px;

        box-sizing: border-box;

      }

      .ProximoPartidoTabla h2 {

        color: #fff;

        margin-bottom: 20px;

        font-size: 28px;

        text-shadow: 0 0 4px black;

      }

      .ProximoPartidoTabla .CapeonMiniTorneo {

        font-size: 37px;

        font-weight: 700;

        color: #ffffff;

      }

      .ProximoPartidoTabla .CapeonMiniTorneo img {

          vertical-align: middle;

      }



      .ProximoPartidoTabla .vs {

        display: flex;

      }

      .ProximoPartidoTabla .vs div {

        border: 1px solid #808080;

        padding: 10px;

        background-color: #565656;

        color: #fff;

      }

      .ProximoPartidoTabla .vs .vsTxt {

        font-weight: 700;

        font-size: 29px;

        background-color: #2e69b6;

        color: #fff;

      }



       input.botonJugarSiguientePartido {

         padding: 12px 34px;

         border: 1px solid #00CCFF;

         position: relative;

         font-size: 31px;

         background-color: #2E69B6;

         display: inline-block;

         color: #fff;

         text-decoration: none;

         font-weight: 600;

         cursor: pointer;

         width: 460px;

         box-sizing: border-box;

         border-radius: 0 0 20px 20px;

         margin-bottom: 40px;

      }

      input.botonJugarSiguientePartido:hover {

        background-color: #99ce29;

        text-shadow: 0 0 3px black;

      }



    /*----fin Tabla minitorneos ---*/

    /*----Inicio Menu lateral ---*/

    .pefilJ {

      position: fixed;

      top:0;

      right: -320px;

      background-color: #565656;

      bottom: 0;

      box-shadow: 0 0 9px 2px black;

      z-index: 100;

      width: 300px;

      transition: all 1s;

    }

    .pefilJ.abierto {

      right: 0;

    }

      .pefilJ ul{



        padding: 0;

        margin: 0;

      }

        .pefilJ ul li{

          list-style: none;



        }

          .pefilJ ul li a{

            text-decoration: none;

            color: #ebebeb;

            padding: 20px 10px;

            display: block;

            border-bottom: 1px solid #464141;



          }

            .pefilJ ul li a:hover{

              background-color: #2e69b6;

            }

    /*----fin  Menu lateral ---*/

    /*----Inicio Información adicional ---*/

    .fondoAcerca h1{

      text-align: center;

      margin: 30px 0;

    }

    .flexInfo {

      display: flex;

      justify-content: space-between;

      flex-wrap: wrap;

    }

    .flexInfo .flexBox50{

      width: 600px;

    background-color: #fff;

    border-radius: 10px;

    padding: 13px;

    box-sizing: border-box;

        margin: 10px;



    box-shadow: 0 0 5px 0px #0000002e;

    }

    

    .flexInfo .flexBox50 img{

          width: 100%;



    }

    .flexInfo .flexBox50 h2{

      margin: 19px 0;

    }

    /*----fin Información adicional ---*/
    /*--- inicio - imagenes en perfil equipo--*/
.botonTipo2 > img {
  margin: auto;
  display: block;
}

    
    /*--- fin - imagenes en perfil equipo--*/






    /*--- inicio - buscar cancha--*/

    .canchasazules{
      display: flex;
      gap: 15px;
    }

    .Cuadrocanchasazul{
      gap: 10px;
      background-color: #2E69B6;
      width: min(620px, 100%);
      color: white;
      padding: 20px;
      border: 2px solid #00CCFF;
      border-radius: 5px;
      box-shadow: 0 0px 5px #000;
    }

    .Ccblo2>h1{
      color: white;
      font-size: 23px;
    }

    .Ccblo2>h2{
      color: white;
      margin: 10px 0 10px 0;
      font-size: 18px;  
    }

    .Ccblo2>p{
      margin: 0px;
      font-size: 12px;
    }
    .Ccblo1>div>img{
      margin: 0px 0 10px 0;
    }

    .Ccblo1>img{
      border-radius: 5px;
    }

    .Ccblo2>.cuadroA{
      width: 78px;
      height: 88px;
      border: 1px solid #808080;
      position: relative;
      margin: 10px 10px 0 0;
    }

    .Ccblo2>.cuadroA>.contenidoA>img{
      width: 78px;
    }

    .Ccblo2>.cuadroA>.etiquetaA{
      position: absolute;
      background-color: #565656;
      bottom: 0;
      padding: 6px;
      color: #fff;
      font-size: 10px;
      width: 100%;
      box-sizing: border-box;
      font-weight: 600;
    }

    .Cccol1{
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 20px;
    }

    .Cccol2{
      display: flex;
      justify-content: flex-end;
    }

    .Cccol2>a{
      border: 2px solid #00CCFF;
      padding: 5px 30px;
      display: flex;
      color: white;
      text-decoration: none;
      font-weight: 600;
      width: 60px;
    }

    .puntuacionestrellas{
      display: flex;
    }

    .puntuacionnumeros{
      background-color: #9E9E9D;
      padding: 1px 4px;
      border: 1px solid #fff;
      border-radius: 5px;
      font-size: 13px;
    }

    .puntuaciones{
      display: flex;
      padding: 0 0 10px 0;
      gap: 10px;
    }

    .Cuadrocanchasblancas{
      width: min(287px, 100%);
      background-color: #ffffff;
      border-radius: 5px;
      box-shadow: 1px 0px 10px #464646;
      padding: 10px;
      position: relative;
    }

    .Cuadrocanchasblancas>img{
      width: 100%;
      box-sizing: border-box;
    }

    .Cuadrocanchasblancas>h2{
      font-size: 18px;
    }

    .Cuadrocanchasblancas>h1{
      font-size: 23px;
    }

    .Cuadrocanchasblancas>p{
      font-size: 13px;
    }

    .Cuadrocanchasblancas>a{
      border: 2px solid #00CCFF;
      padding: 5px 25px;
      display: flex;
      color: white;
      text-decoration: none;
      font-weight: 600;
      width: 60px;
      background-color: #2e69b6;
      margin: auto;
      font-size: 14px;
      justify-content: center;
    }

    .Cuadrocanchasblancas>.cuadroA>.contenidoA>img {
      width: 78px;
    }

    .Cuadrocanchasblancas>.cuadroA>.contenidoA {
      background-color: #ffffff;
    }

    .Cuadrocanchasblancas>.cuadroA {
      width: 78px;
      height: 88px;
      border: 1px solid #808080;
      position: absolute;
      top: 145px;
      right: 15px;
    }

    .Cuadrocanchasblancas>.puntuaciones {
      display: flex;
      padding: 0 0 10px 0;
      gap: 10px;
      position: absolute;
      bottom: 130px;
      left: 15px;
    }

    .Cuadrocanchasblancas>.cuadroA>.etiquetaA {
      position: absolute;
      background-color: #565656;
      bottom: 0;
      padding: 6px;
      color: #fff;
      font-size: 10px;
      width: 100%;
      box-sizing: border-box;
      font-weight: 600;
    }

    .canchasblancas{
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin: 20px 0;
    }
    /*--- fin - buscar cancha--*/

    /*--- inicio - perfil cancha--*/

    .canchaperfil{
      display: flex;
    gap: 20px;
    }

    .canchablo2-1{
      display: flex;
      flex-direction: column;
      gap: 20px;
    }

    .canchablo2-1>div{
      display: flex;
      align-items: center;
      gap: 15px;
    }

    .canchablo2-1>div>p{
      margin: 0px;
    }

    .canchablo2{
      display: flex;
      flex-direction: column;
      gap: 45px;
    }

    .canchablo2 p{
      font-size: 15px;
    }

    .canchablo2-3>ul{
      list-style: none;
      padding: 0px;
    }

    .canchablo2-3>ul>li{
      font-size: 15px;
    }

    .canchablo1{
      position: relative;
    }

    .canchablo1>.cuadroA{
      border: 1px solid #808080;
      margin: 0 10px 0 0;
      position: absolute;
      top: 15px;
      left: 15px;
      width: 78px;
      height: 88px;
    }

    .canchablo1>.cuadroA>.contenidoA{
      background-color: #ffffff;
    }

    .canchablo1>.cuadroA>.contenidoA>img {
      width: 78px;
    }

    .canchablo1>.cuadroA>.etiquetaA {
      position: absolute;
      background-color: #565656;
      bottom: 0;
      padding: 6px;
      color: #fff;
      font-size: 10px;
      width: 100%;
      box-sizing: border-box;
      font-weight: 600;
    }

    .canchaperfilinfo>h1{
      color: #2E69B6;
    }

    .canchaperfilinfo>h2{
      font-size: 18px;
    }

    .canchaperfilinfo{
      padding: 15px 0;
      position: relative;
    }

    .canchaperfilinfo>.puntuaciones{
      position: absolute;
      top: 21px;
      left: 200px;
      padding: 0px;
    }

    .canchaperfilinfo>.puntuaciones>.puntuacionnumeros{
      color: white;
    }
    

    /*--- fin - perfil cancha--*/