@charset "UTF-8";
/*---------------------------------
// PATRONES DE COLORES
//---------------------------------*/
/*------------------------------
1. TIPOGRAFIA DEL SITIO
--------------------------------*/
html {
  scroll-behavior: smooth;
}


html {
  font-size: 13px; }

body {
  font-family: 'Rubik', sans-serif;
  color: #696969; }


/*---------------------------------
FLECHA TOP
-------------------------*/
.scroll-to-top {
  position: fixed;
  right: 15px;
  bottom: 15px;
  display: none;
  width: 50px;
  height: 50px;
  text-align: center;
  color: #fff;
  background: rgba(52, 58, 64, 0.5);
  line-height: 46px;
}

.scroll-to-top:focus, .scroll-to-top:hover {
  color: white;
}

.scroll-to-top:hover {
  background: #343a40;
}

.scroll-to-top i {
  font-weight: 800;
}



/*-------------------------------------------
2. COLOR DE FONDO PRINCIPAL
---------------------------------------------*/
.bg-primary {
  background-color: #d40d15 !important; }

/*-------------------------------------------
3. COLOR DEL TEXTO PRINCIPAL
---------------------------------------------*/
.text-primary {
  color: #d40d15 !important; }

/*-------------------------------------------
3. navbar
---------------------------------------------*/
.navbar a {
  color: white; }

.text-shadow {
  text-shadow: 2px 2px #333; }

.zoom-in, .zoom-out {
  transition: all .5s ease-in-out;
  -webkit-transform: scale(1);
  transform: scale(1); }

.zoom-in:hover {
  transition: all .5s ease-in-out;
  -webkit-transform: scale(0.8);
  transform: scale(0.8);
  background-color: skyblue; }

.zoom-out:hover {
  transition: all .5s ease-in-out;
  -webkit-transform: scale(1.2);
  transform: scale(1.2); }

/*---- color de la hamburguesa -----*/
button.navbar-toggler {
  background-color: white; }

span.navbar-toggler-icon {
  background-color: gray; }

/*----------------------------*/
/*------------------------------------------
4. ESTILOS GENERALES DE BOTONES
-------------------------------------------*/
.btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border-radius: 3rem;
  padding: 1rem 2rem; }

.btn:hover {
  box-shadow: 0 6px 10px rgba(0, 0, 0, 0.31); }

/*.btn:after{
	content: '\f0a9';
	font-family: 'FontAwesome';
	position: relative;
	left: .5rem;
	transition: all .2s ease;
}
.btn:hover:after{
	left: 1rem;
	transform: rotateZ(-360deg);
}*/
/*--------------------------------------------
5. ESTILOS BOTON PRINCIPAL ".btn-primary"
--------------------------------------------*/
.btn-primary {
  background-color: #d40d15 !important;
  border-color: #a40a10 !important; }

.btn-primary:hover, .btn-primary:focus {
  background-color: #a40a10 !important; }

.btn-primary:active {
  background-color: #74070b !important;
  border-color: #440407 !important; }

.btn-primary:focus {
  box-shadow: 0 0 0 0.2rem rgba(212, 13, 21, 0.5) !important; }

/*-----------------------------------------
6. SECCION BARRA DE NAVEGACIÓN ".navbar"
------------------------------------------*/
.btn-buscar {
  padding: .6rem 1rem;
  font-size: 1.25rem;
  line-height: 1;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: .25rem;
  color: rgba(0, 0, 0, 0.5);
  border-color: rgba(0, 0, 0, 0.1);
  cursor: pointer; }

/*Estilo Dropdown*/
.dropdown-menu {
  border: 1px solid #d40d15;
  border-top-width: 5px;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.25); }

.dropdown-menu a i {
  font-size: .85rem;
  margin-right: .5rem; }

/*--------------------------------------------
7. SECCION CAJA DE BUSQUEDA "#buscador-modal"
---------------------------------------------*/
#buscador-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: auto;
  background: rgba(255, 255, 255, 0.86);
  z-index: 1000;
  display: none; }

.btn-cerrar {
  position: absolute;
  top: 1rem;
  right: 1rem;
  color: #d40d15;
  font-size: 3rem; }

#nombre_no {
  height: auto;
  border-radius: 3rem 0 0 3rem;
  font-size: 1.5rem;
  padding: 1rem; }

#buscar:after {
  content: ''; }

#buscar {
  border-radius: 0 3rem 3rem 0;
  font-size: 1.5rem; }

/*---------------------------------------------
8. ESTILOS PRESENTACIÓN "#presentacion"
----------------------------------------------*/
#presentacion {
  display: flex;
  flex-direction: column;
  min-height: 100vh; }

.bienvenidos {
  flex-grow: 1; }

/*ESTILOS PARA INTERNET EXPLORER 11+*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  body {
    display: flex;
    flex-direction: column; }

  .navbar {
    min-height: 1px; } }
/*---------------------------------------------
9. ESTILOS BIENVENIDOS ".bienvenidos"
----------------------------------------------*/
.bienvenidos {
  background: url("../images/fondo-bienvenidos.png") no-repeat center center/cover;
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  text-align: center; }

.bienvenidos:before {
  content: "";
  background: rgba(0, 0, 0, 0.41);
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0; }

.bienvenidos .btn {
  width: 70%;
  margin-bottom: .5rem;
  text-transform: uppercase; }

/*-----------------------------------------------
10. ESTILOS SEPARADOR ".separador-titulos"
-------------------------------------------------*/
.separador-titulos {
  display: inline-block;
  margin-top: 2rem;
  height: 4px;
  width: 80px;
  background: #d40d15; }

/*-----------------------------------------------
11. ESTILOS PROYECTOS "#proyectos"
-------------------------------------------------*/
.proyecto {
  display: block;
  position: relative;
  overflow: hidden;
  margin-bottom: 2rem; }

.proyecto .mascara {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(31, 29, 86, 0.73);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #fff;
  opacity: 0;
  transition: all .4s ease;
  z-index: 10; }

.proyecto .mascara h3,
.proyecto .mascara p {
  position: relative;
  top: -2rem;
  transition: all .3s ease;
  /*Correción para IE11+*/
  width: 100%; }

.proyecto .mascara .btn {
  position: relative;
  top: 2rem;
  transition: all .3s ease; }

.proyecto img {
  width: 100%;
  transition: all .3s ease; }

/*Estado HOVER de cada proyecto*/
.proyecto:hover .mascara {
  opacity: 1; }

.proyecto:hover .mascara h3,
.proyecto:hover .mascara p,
.proyecto:hover .mascara .btn {
  top: 0; }

.proyecto:hover img {
  transform: scale(1.3); }

/*--------------------------------------------
12. EMPIEZAN LAS MEDIAS QUERIES
----------------------------------------------*/
@media (min-width: 768px) {
  .btn-buscar {
    padding: 0;
    font-size: 1.4rem;
    border-color: transparent; }

  /*Estilos MegaMenu*/
  .navbar .container {
    position: relative; }

  .mega-menu {
    position: static; }

  .mega-menu .dropdown-menu {
    position: absolute;
    width: 100%;
    left: 0;
    top: auto; }

  .bienvenidos {
    background: url("../images/fondo-bienvenidos-md.jpg") no-repeat center center/cover;
    text-align: left; }

  .bienvenidos .btn {
    width: auto;
    margin-bottom: 0;
    margin-right: 1rem;
    font-size: 1.5rem; } }
@media (min-width: 990px) {
  html {
    font-size: 16px; } }
/* ---- inicio-fichas--- */
/* ---- inicio-fichas--- */
/* ---- inicio-fichas--- */
.row.heading h2 {
  color: #fff;
  font-size: 52.52px;
  line-height: 95px;
  font-weight: 400;
  text-align: center;
  margin: 0 0 40px;
  padding-bottom: 20px;
  text-transform: uppercase; }

ul {
  margin: 0;
  padding: 0;
  list-style: none; }

.heading.heading-icon {
  display: block; }

.padding-lg {
  display: block;
  padding-top: 60px;
  padding-bottom: 60px; }

.practice-area.padding-lg {
  padding-bottom: 55px;
  padding-top: 55px; }

.practice-area .inner {
  border: 1px solid #999999;
  text-align: center;
  margin-bottom: 28px;
  padding: 40px 25px; }

.our-webcoder .cnt-block:hover {
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
  border: 0; }

.practice-area .inner h3 {
  color: #3c3c3c;
  font-size: 24px;
  font-weight: 500;
  font-family: 'Poppins', sans-serif;
  padding: 10px 0; }

.practice-area .inner p {
  font-size: 14px;
  line-height: 22px;
  font-weight: 400; }

.practice-area .inner img {
  display: inline-block; }

.our-webcoder {
  background: url("../img/lab2.jpg") no-repeat center top/cover; }

.our-webcoder .cnt-block {
  float: left;
  width: 100%;
  background: #fff;
  padding: 30px 20px;
  text-align: center;
  border: 2px solid #d5d5d5;
  margin: 0 0 28px; }

.our-webcoder .cnt-block figure {
  width: 148px;
  height: 148px;
  border-radius: 100%;
  display: inline-block;
  margin-bottom: 15px; }

.our-webcoder .cnt-block img {
  width: 148px;
  height: 148px;
  border-radius: 100%; }

.our-webcoder .cnt-block h3 {
  color: #2a2a2a;
  font-size: 20px;
  font-weight: 500;
  padding: 6px 0;
  text-transform: uppercase; }

.our-webcoder .cnt-block h3 a {
  text-decoration: none;
  color: #2a2a2a; }

.our-webcoder .cnt-block h3 a:hover {
  color: #337ab7; }

.our-webcoder .cnt-block p {
  color: #2a2a2a;
  font-size: 13px;
  line-height: 20px;
  font-weight: 400; }

.our-webcoder .cnt-block .follow-us {
  margin: 20px 0 0; }

.our-webcoder .cnt-block .follow-us li {
  display: inline-block;
  width: auto;
  margin: 0 5px; }

.our-webcoder .cnt-block .follow-us li .fa {
  font-size: 24px;
  color: #767676; }

.our-webcoder .cnt-block .follow-us li .fa:hover {
  color: #025a8e; }

.card {
  /*	cursor: pointer;*/ }

.text-muted {
  color: #ced4da !important; }

/*# sourceMappingURL=estilo.css.map */