@import "colores.css";

.btn-principal{
  background-color: var(--azul2);
  display: inline-block;
  padding: 8px 30px;
  color: #fff;
  cursor: pointer;
  font-size: 14px !important;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 2px solid #B2BABB !important;
}

.btn-verde{
  background-color: var(--verde);
  display: inline-block;
  padding: 8px 30px;
  color: #fff;
  cursor: pointer;
  font-size: 14px !important;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 2px solid #B2BABB !important;
}

.btn-rojo{
  background-color: var(--rojo-pastel);
  display: inline-block;
  padding: 8px 30px;
  color: #fff;
  cursor: pointer;
  font-size: 14px !important;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 2px solid #B2BABB !important;
}

.btn-gris{
  background-color: #B2BABB;
  display: inline-block;
  padding: 8px 30px;
  color: #fff;
  cursor: pointer;
  font-size: 14px !important;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 2px solid #B2BABB !important;
}

.btn-secundario{
  background-color: var(--azul-claro);
  display: inline-block;
  padding: 8px 30px;
  color: #fff;
  cursor: pointer;
  font-size: 14px !important;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 2px solid #B2BABB !important;
}

.btn-secundario:hover{
  background-color: var(--azul2);
}

.btn-tercero{
  background: var(--encabezado);
  display: inline-block;
  padding: 8px 30px;
  color: #fff;
  cursor: pointer;
  font-size: 14px !important;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 2px solid #B2BABB !important;
}

.btn-tercero:hover{
  background: var(--azul2);
}

.btn-secundario-small{
  background-color: var(--azul-claro);
  display: inline-block;
  padding: 4px 10px;
  color: #fff;
  cursor: pointer;
  font-size: 14px; !important;
  font-family: 'Open Sans', sans-serif !important;
  right: 10px;
  bottom: 20px;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
}

.btn-secundario-small:hover{
  background: var(--azul2);
}

.btn-buscar{
  background: var(--encabezado);
  display: inline-block;
  padding: 8px 30px;
  color: #fff;
  cursor: pointer;
  font-size: 14px !important;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border: 2px solid #B2BABB !important;
}

.btn-buscar:hover{
  background: var(--azul2);
}

.btn-verde-small{
  background-color: #27AE60;
  display: inline-block;
  padding: 4px 10px;
  color: #fff;
  cursor: pointer;
  font-size: 14px; !important;
  font-family: 'Open Sans', sans-serif !important;
  right: 10px;
  bottom: 20px;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.btn-verde-small:hover{
  background: #196F3D;
  border: #196F3D;
}

.btn-gris-small{
  background-color: #767675;
  display: inline-block;
  padding: 4px 10px;
  color: #fff;
  cursor: pointer;
  font-size: 14px; !important;
  font-family: 'Open Sans', sans-serif !important;
  right: 10px;
  bottom: 20px;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.btn-gris-small:hover{
  background: #5a5a59;
  border: #5a5a59;
}

.btn-rojo-quemado-small{
  background-color: #8b0937;
  display: inline-block;
  padding: 4px 10px;
  color: #fff;
  cursor: pointer;
  font-size: 14px; !important;
  font-family: 'Open Sans', sans-serif !important;
  right: 10px;
  bottom: 20px;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.btn-rojo-quemado-small:hover{
  background: #4d021c;
  border: #4d021c;
}

.btn-azul-small{
  background-color: var(--encabezado);
  display: inline-block;
  padding: 4px 10px;
  color: #fff;
  cursor: pointer;
  font-size: 14px; !important;
  font-family: 'Open Sans', sans-serif !important;
  right: 10px;
  bottom: 20px;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.btn-azul-small:hover{
  background: var(--azul2);
  border: var(--azul2);
}

/*boton rojo pequeño*/
.btn-rojo-small{
  background-color: #E74C3C;
  display: inline-block;
  padding: 4px 10px;
  color: #fff;
  cursor: pointer;
  font-size: 14px; !important;
  font-family: 'Open Sans', sans-serif !important;
  right: 10px;
  bottom: 20px;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.btn-rojo-small:hover{
  background: #A93226;
  border: #A93226;
}

/*boton amarillo pequeño*/
.btn-amarillo-small{
  background-color: #F1C40F;
  display: inline-block;
  padding: 4px 10px;
  color: #fff;
  cursor: pointer;
  font-size: 14px; !important;
  font-family: 'Open Sans', sans-serif !important;
  right: 10px;
  bottom: 20px;
  -webkit-border-radius: 5px ;
  -moz-border-radius: 5px;
  border-radius: 5px;
}
.btn-amarillo-small:hover{
  background: #7D6608;
  border: #7D6608;
}

.btn-wspp{
  background: transparent;
}

.btn-wspp:hover{
  background: #5c636a;
  border-radius: 5px 5px 5px 5px;
  cursor: pointer;
  color: #FFFFFF;
}

@media screen and (max-width: 620px){
    .btn-tercero{
      width: 10%;
    }
}