@import "./colors.css";
@import "./fonts.css";

*{
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  color: var(--colortexto-dark);
  font-family: "NunitoSans-Bold", Arial, Helvetica, sans-serif;
}
.portada {
  display: block;
  max-width: 100%;
  height: auto;
}

/* ================================================================
Estilos del body
===================================================================
*/
.body{
  background-color: var(--primary-color);
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: calc( 100vh - (  140px ));
}
/* fin de estilos del body */

/* ================================================================
Estilos del header
===================================================================
*/
.logo_tipo {
  height: 48px;
  margin-top: 8px;
  margin-right: 10px;
}

.header {
  top: 0;
  padding-top: 0px;
  height: 60px;
  background-color: var(--primary-color-dark);
}

.navbar-brand:hover{
  color: var(--colortexto-dark);
}

.pull-right {
  margin-left: auto;
}
/* fin de estilos del header */

/* ================================================================
Estilos del footer
===================================================================
*/
footer {
  background-color: var(--primary-color-dark);
  height: 140px;
  margin: 0;
  padding: 0;
  width: 100%;
  bottom: 0;
}

footer ul > li{
  color: white;
}

footer dev a{
  text-decoration: none;
  color: white;
}

footer dev a:hover{
  color: var(--colortexto-dark);;
}
.liga {
  text-decoration: none;
  color: var(--gray-color);
}
/* fin de estilos del footer

/* ================================================================
Estilos varios y demas estilos
===================================================================
*/
.card{
  box-shadow: 0px 1px 10px rgb(0,0,0,0.2);
  cursor: default;
  transition: all 400ms ease;
}
.card:hover{
  box-shadow: 5px 5px 20px rgb(0,0,0,0.4); 
}
ul li {
  list-style-type: none;
}
.h5, .h4 {
  color: var(--colortexto);
  text-decoration: none;
}
.cabeza-tit {
  background-color: var(--primary-color-dark);
  color: var(--gray-color);
  font-size: 20px;
}
.contenedor {
  height: 300px;
}
.nv {
  color: white;
  text-decoration: none;
}

.nv:hover {
  color: var(--gray-color);
  text-decoration: none;
}
.mibtn {
  color: var(--colortexto);
  padding: 2;
  background-color: var(--primary-color-dark);
}
.mibtn:hover {
  background-color: var(--btn-selected-color);
  color: darkgrey;
}
.mimarquito {
  color: var(--colortexto);
  padding: 2;
  background-color: var(--primary-color-dark);
}
.mimarquito:hover {
  color: var(--colortexto-dark);
  padding: 2;
  background-color: var(--primary-color-dark);
}
.fondo-claro {
  background-color: var(--primary-color);
}