/*
* Theme Name: Fin360
* Template Theme URI: https://www.fin360.mx/
* Author: Integra IT Soluciones
* Description: Plantilla corporativa de Fin360® Créditos.
* Version: 1.0.0
*/

/* ICONOS //////////////////////////////////// */
.icon::before {
  width: 2rem;
  height: 2rem;
}

.icon-cel::before {
  content: url('imgs/svg/icos/icon-cel.svg');
}
.icon-credito::before {
  content: url('imgs/svg/icos/icon-credito.svg');
}
.icon-escribir::before {
  content: url('imgs/svg/icos/icon-escribir.svg');
}
.icon-flecha::before {
  content: url('imgs/svg/icos/icon-flecha.svg');
}
.icon-flechas::before {
  content: url('imgs/svg/icos/icon-flechas.svg');
}
.icon-idea::before {
  content: url('imgs/svg/icos/icon-idea.svg');
}
.icon-inversionista::before {
  content: url('imgs/svg/icos/icon-inversionista.svg');
}
.icon-invierte::before {
  content: url('imgs/svg/icos/icon-invierte.svg');
}
.icon-laptop::before {
  content: url('imgs/svg/icos/icon-laptop.svg');
}
.icon-lista::before {
  content: url('imgs/svg/icos/icon-lista.svg');
}
.icon-megafono::before {
  content: url('imgs/svg/icos/icon-megafono.svg');
}
.icon-pc::before {
  content: url('imgs/svg/icos/icon-pc.svg');
}
.icon-perfil::before {
  content: url('imgs/svg/icos/icon-perfil.svg');
}
.icon-portafolio::before {
  content: url('imgs/svg/icos/icon-portafolio.svg');
}
.icon-premio::before {
  content: url('imgs/svg/icos/icon-premio.svg');
}
.icon-rendimiento::before {
  content: url('imgs/svg/icos/icon-rendimiento.svg');
}
.icon-roi::before {
  content: url('imgs/svg/icos/icon-roi.svg');
}
.icon-solicitante::before {
  content: url('imgs/svg/icos/icon-solicitante.svg');
}
.icon-solicita::before {
  content: url('imgs/svg/icos/icon-solicita.svg');
}
.icon-stats::before {
  content: url('imgs/svg/icos/icon-stats.svg');
}
.icon-tasas::before {
  content: url('imgs/svg/icos/icon-tasas.svg');
}
.icon-respuesta::before {
  content: url('imgs/svg/icos/icon-respuesta.svg');
}
.icon-aval::before {
  content: url('imgs/svg/icos/icon-aval.svg');
}
.icon-aprobado::before {
  content: url('imgs/svg/icos/icon-aprobado.svg');
}
.icon-interes::before {
  content: url('imgs/svg/icos/icon-interes.svg');
}
.icon-domicilio::before {
  content: url('imgs/svg/icos/icon-domicilio.svg');
}


/* TIPOGRAFÍA //////////////////////////////////// */
@font-face {
    font-family: 'catamaranextrabold';
    src: url('fonts/catamaran-extrabold-webfont.woff2') format('woff2'),
         url('fonts/catamaran-extrabold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'catamaranlight';
    src: url('fonts/catamaran-light-webfont.woff2') format('woff2'),
         url('fonts/catamaran-light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'catamaranregular';
    src: url('fonts/catamaran-regular-webfont.woff2') format('woff2'),
         url('fonts/catamaran-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


/* GENERAL /////////////////////////////////////////////////////////////// */
html body {
  font-family: 'Catamaran', sans-serif;
	font-size: 1rem;
  font-weight: 400;
  color: #666;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: inherit;
}

a {
  color: #00b056;
}
a:hover {
  color: #00b056;
}


label {
  font-weight: 700;
}

/* CLASES /////////////////////////////////////////////////////////////// */
.bg-fin {
  background: url('imgs/jpg/fin360_banner-index.png') bottom center no-repeat;
  background-size: cover;
}
.bg-beneficios {
  background: url('imgs/jpg/fin360_pleca-home.png') bottom center no-repeat;
  background-size: cover;
}
.bg-contacto {
  background: url('imgs/jpg/fin360_bkg-contacto.jpg') top center no-repeat;
  background-size: cover;
}
.bg-plecat {
  background: url('imgs/svg/bkg/fin360-plecat.svg') bottom center no-repeat;
  background-size: cover;
  width: 100%;
  height: 175px;
  top: 0;
  left: 0;
}
.bg-faq {
  background: url('imgs/jpg/fin360_bkg-faq.jpg') top center no-repeat;
  background-size: cover;
}
.bg-credito {
  background: url('imgs/jpg/fin360_banner-inversion.png') bottom center no-repeat;
  background-size: cover;
}

.bg-gradient {
  background: linear-gradient(to right, #005baa, #00b057);
  background-size: cover;
}

.bg-plecab {
  background: url('imgs/svg/bkg/fin360-plecab.svg') bottom center no-repeat;
  background-size: cover;
  width: 100%;
  height: 50px;
  top: 0;
  left: 0;
}
.bg-story {
  background: url('imgs/jpg/fin360_pleca-bottom.png') bottom center no-repeat;
  background-size: 100%;
}


.bg-gris {
  background-color: #eee;
}
.bg-azul {
  background-color: #005baa;
}
.bg-verde {
  background-color: #00b056
}

.pt-30 {
  padding-top: 30px;
}
.pb-30 {
  padding-bottom: 30px;
}

.pt-50 {
  padding-top: 50px;
}
.pb-50 {
  padding-bottom: 50px;
}

.pt-100 {
  padding-top: 100px;
}
.pb-100 {
  padding-bottom: 100px;
}

.pt-150 {
  padding-top: 150px;
}
.pb-150 {
  padding-bottom: 150px;
}

.pl-15 {
  padding-left: 15px;
}
.pr-15 {
  padding-right: 15px;
}
.px-15 {
  padding: 15px;
}
.pt-15 {
  padding-top: 15px;
}
.pb-15 {
  padding-bottom: 15px;
}

.mt-50 {
  margin-top: 50px;
}
.mt-100 {
  margin-top: 100px;
}

.card {
  border: 0;
}

.nav .active {
	font-style: italic;
}

.txt-green {
  color: #00b057
}

.txt-shadow {
  text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

.box {
  width: 290px;
  height: 107px;
}
.box-1 {
  top: 67px;
  right: -145px;
}
.box-2 {
  top: 67px;
  left: -145px;
}

.widget {
  margin-bottom: 50px;
}


/* BOTONES /////////////////////////////////////////////////////////////// */
.btn-primary {
  background-color: #00b056;
  border-color: #00b056;
  color: #fff !important;
}

.btn-secondary {
  background-color: #fff;
  border-color: #005baa;
  color: #005baa !important;
}
.btn-secondary:hover{
  background-color: #005baa !important;
  border-color: #005baa !important;
  color: #fff !important;
}
.text-green {
  color: #00b056 !important;
}

.btn-success, .btn-danger,
.btn-warning, .btn-info,
.btn-light, .btn-dark, .btn-default {
  background-color: #fff;
  border: 1px solid #00b057;
  text-decoration: none;
  color: #00b057;
}

.btn-primary:hover, .btn-success:hover,
.btn-danger:hover, .btn-warning:hover, .btn-info:hover,
.btn-link:hover, .btn-light:hover, .btn-dark:hover, .btn-default:hover{
  background-color: #00b056;
  border-color: #00b056;
  text-decoration: none;
  color: #fff;
}


/* LISTAS /////////////////////////////////////////////////////////////// */
#plus ul li, #plus-2 ul li {
  padding-left: 80px;
  font-size: 1.125rem;
}

#plus .ico, #plus-2 .ico {
  width: 70px;
  height: 70px;
  top: 0;
  left: 0;
}

/* AJUSTES /////////////////////////////////////////////////////////////// */
.dropdown-menu form {
  width: 300px
}

.toggle-nav, .toggle-nav-mob {
  display: none;
  width: 200px;
  right: 0;
  z-index: 9999;
}
.toggle-nav-mob {
  top: 54px;
}
.toggle-nav ul, .toggle-nav-mob ul {
  padding: 15px;
}
.toggle-nav li, .toggle-nav-mob li {
  list-style: none;
}
#mob-menu {
  display: none;
}

#index a {
  color: #fff;
}
#index a.btn {
  color: #00b057;
}
#index a.btn:hover {
  color: #fff !important;
}
#solicitante a.btn:hover {
  background-color: #005baa;
  border-color: #005baa;
}

#solicitante .rounded-circle,
#inversor .rounded-circle {
  top: -50px;
  left: 0;
  right: 0;
  width: 100px;
  height: inherit;
}

#testimonio a {
  color: #005baa;
  font-weight: 700;
  font-size: 1.12rem;
}

#nav nav a:hover {
  font-weight: 700;
}

#proceso .ico,
#recursos .ico {
  width: 70px;
  height: auto;
}

#sm ul {
  padding-left: 30px;
}
#sm ul li {
  list-style: none;
}
#sm ul li .icon {
  top: -5px;
  left: -35px;
}

#rec-cont p, #rec-faq  p,
#address p:nth-child(2) {
  margin-bottom: 0;
}

#address p a {
  font-weight: 700;
}

footer .ico-flechas {
  bottom: 0;
  right: 15px;
  height: 200px;
  width: auto;
}

.block-dsk ul,
#pg-seguridad ul {
  padding-left: 22px;
}
.block-dsk ul li {
  list-style: url('imgs/svg/icos/ico-check.svg');
}
.block-dsk {
  position: absolute;
  top: 20px;
  right: 0;
}
.block-dsk .ico {
  position: absolute;
  width: auto;
  height: 130px;
  top: 40px;
  right: 10px;
}
.block-dsk p {
  margin-bottom: 0;
}

#pg-seguridad h3 {
  font-weight: 700;
}
#pg-seguridad ul li {
  list-style: url('imgs/svg/icos/ico-checkw.svg');
}

#pg-credito ul li {
  list-style: url('imgs/svg/icos/li_verde.svg');
}

#val-img .ico {
  width: 70px;
  height: auto;
}

#valores ul li {
  list-style: url('imgs/svg/icos/ico-ok-list.svg');
  margin-bottom: 15px;
}

#afiliados hr {
  width: 100px;
  height: 6px;
  background-color: #ddd;
}

#proceso .card {
  min-height: 244px;
}

#inversiones .card {
  height: 310px;
}
#inversiones .icon-flecha {
  right: 15px;
}

#pg-post img {
  width: 100%;
}
.post-data {
  bottom: 0;
  left: 0;
  background-color: rgba(255,255,255,0.9);
}
.post-data p { color: gray; }

/* MEDIA QUERIES /////////////////////////////////////////////////////////////// */
@media screen and (min-width: 320px) and (max-width: 991px){
  #mob-menu {
    display: block;
  }
  #desk-menu {
    display: none;
  }
  .toggle-nav-mob {
    display: none;
  }

  .bg-fin, .bg-credito, .bg-contacto, .bg-faq {
    background-size: cover;
  }
  .bg-credito {
    height: 100%;
  }
  .box-1, .box-2 {
    position: relative !important;
    top: 0;
    left: 0;
    width: 100%;
    font-size: 1.25rem;
  }

  .block-dsk {
    position: relative;
    top: 20px;
  }
  .block-dsk .ico {
    position: relative;
    width: auto;
    height: 130px;
    top: 0;
    right: 0;
  }

  #blog .mt-100 {
    margin-top: 10px;
  }
  #blog img {
    display: none;
  }
  
  #testimonio {
    text-align: center;
  }
  #testimonio img {
    margin: 0 auto;
    height: 100px;
  }

  .btn {
    width: 100%;
  }

  #inversiones .icon-flecha {
    transform: rotate(90deg);
  }
  #inversiones .card {
  	height: auto !important;
  }
}

@media screen and (max-width: 575px) {
  #mob-menu {
    position: absolute;
    top: -55px;
    right: 0;
  }

  #solicitante img, #inversor img {
  	display: none;
  }

  #index h1 {
  	font-size: 1.9rem;
  	margin-bottom: 1rem;
  }
  #index h4 {
  	font-size: 1.12rem;
  }

  #index div.mt-5 {
  	margin-top: 0 !important;
  }
  #index .pt-50 {
  	padding-top: 25px;
  }
  #index div.px-15 {
  	padding: 0 !important;
  }

  .post-data {
    position: relative !important;
    margin: 0;
  }
  .post-data p { display: none; }
}