/*
Theme Name: Blocksy Child
Template: Blocksy

*/

@import url('https://fonts.googleapis.com/css2?family=Protest+Riot&display=swap');

/*VARIABLES DE COLORES*/
:root {
  --cerulean-blue-50: rgba(236, 249, 255, 1);
  --cerulean-blue-100: rgba(212, 239, 255, 1);
  --cerulean-blue-200: rgba(179, 229, 255, 1);
  --cerulean-blue-300: rgba(127, 215, 255, 1);
  --cerulean-blue-400: rgba(67, 190, 255, 1);
  --cerulean-blue-500: rgba(24, 157, 255, 1);
  --cerulean-blue-600: rgba(0, 123, 255, 1);
  --cerulean-blue-700: rgba(0, 99, 251, 1);
  --cerulean-blue-800: rgba(3, 83, 211, 1);
  --cerulean-blue-900: rgba(10, 70, 158, 1);
  --cerulean-blue-950: rgba(12, 43, 95, 0);

  --color-claro: rgb(255, 255, 255, .9);
  --color-oscuro: rgb(33, 33, 33, .8);
}


html {
    scroll-behavior: smooth;
  }

body {
  /* user-select: none; */
}
* {
  color: var(--color-oscuro) !important;
  font-family: 'Protest Riot', sans-serif !important;
}

p {
  
}

h2 {
  
}

.btnNormal{
  text-align: center;
  margin: 10px;
  -webkit-border-radius: 7;
  -moz-border-radius: 7;
  border-radius: 7px;
  -webkit-box-shadow: 2px 2px 3px #000000;
  -moz-box-shadow: 2px 2px 3px #000000;
  box-shadow: 2px 2px 3px #000000;
  font-size: 20px;
  padding: 10px 20px 10px 20px;
  text-decoration: none;
  transition: 100ms;
  cursor: pointer;
  background: linear-gradient(to right, var(--cerulean-blue-400), var(--cerulean-blue-600)) !important;
  color: var(--color-claro) !important;
  
}

.btnNormal:hover {
  background: linear-gradient(to right, var(--cerulean-blue-500), var(--cerulean-blue-700)) !important;

}

.btnNormal:active {
  transform: translate(2px, 2px);
  -webkit-box-shadow: 4px 5px 2px #000000;
  -moz-box-shadow: 4px 5px 2px #000000;
  box-shadow: 0px 0px 2px #000000;
}


  /*--------------------------ESTILOS DE LA PAGINA HOME-----------------------------*/


  /* ESTILOS HEADER */
  #header {
    display: none;
  }


/* ESTILOS MAIN */

/*Elimina el titulo de la pagina*/
.page-title {
    display: none;
}

  #main {
    background: linear-gradient(to bottom right, var(--cerulean-blue-100), var(--cerulean-blue-400)); 
  }

/*ESTILOS DE LAS SECCIONES DE LA HOME*/
section {
  display: flex;
  justify-content: center;
}

#main-container {
  
}


/*ESTILOS DEL FOOTER*/

#footer {
 display: none;
}






/*-----------------ESTILOS PAGINA REVIEWS-----------------*/
#tituloPagReviews {
  text-align: start !important;
}



/*-----------------------------------ESTILOS DE LAS ENTRADAS--------------------------------*/
.hero-section {
    display: none;
}

/*CARDS DE SOLICITUD DE RESEÑAS*/
  .contenedorCard {
      width: 300px !important;
      height: 900px;
      display: flex;
      flex-direction: column;
      justify-content: flex-start;
      align-items: center;
      border: 4px solid black;
      border-radius: 20px;
      -webkit-box-shadow: 1px 7px 3px #000000;
      -moz-box-shadow: 1px 7px 3px #000000;
      box-shadow: 1px 7px 3px #000000;
      background-color: var(--cerulean-blue-950);
      
  }

  .imgReseña {
      width: 85%;
      margin: 30px 0;
      border-radius: 10px;
      -webkit-box-shadow: 3px 3px 6px #000000;
      -moz-box-shadow: 3px 3px 6px #000000;
      box-shadow: 3px 3px 6px #000000;
  }

  .contenedorDerecha {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .parrafoReseña {
      font-size: 25px;
      font-weight: bold;
      margin-bottom: 20px;
      text-align: center;
  }

  .contenedorBtns {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: repeat(6, 1fr);
      gap: 25px;
  }

  .btnReseña {
      text-align: center;
      width: 90px;
      height: 50px;
      -webkit-border-radius: 7;
      -moz-border-radius: 7;
      border-radius: 7px;
      -webkit-box-shadow: 2px 2px 3px #000000;
      -moz-box-shadow: 2px 2px 3px #000000;
      box-shadow: 2px 2px 3px #000000;
      font-size: 18px;
      padding: 10px 20px 10px 20px;
      
      text-decoration: none;
      transition: 100ms;
      background: linear-gradient(to right, var(--cerulean-blue-400), var(--cerulean-blue-600)) !important;
      color: var(--color-claro) !important;
  }
  
  

  .btnReseña:hover {
    background: linear-gradient(to right, var(--cerulean-blue-500), var(--cerulean-blue-700)) !important;

    }

  .btnReseña:active {
      transform: translate(2px, 2px);
      -webkit-box-shadow: 4px 5px 2px #000000;
      -moz-box-shadow: 4px 5px 2px #000000;
      box-shadow: 0px 0px 2px #000000;
    }


/* MEDIA QUERYS */

@media (max-width: 320px) {
    
}

/* Tablet */
@media (min-width: 768px) {

  .contenedorCard {
    width: 750px !important;
    height: 400px;
    display: flex;
    flex-direction: row;
    justify-content: space-evenly;
    align-items: center;
}

.imgReseña {
    width: 30%;  
}

.contenedorDerecha {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  height: 80%;
}

.parrafoReseña {
    font-size: 30px;
    text-align: center;
}

.contenedorBtns {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
}


}
  
/* Escritorio */
@media (min-width: 1024px) {

}