 /**
* Template Name: Gp - v2.0.0
* Template URL: https://bootstrapmade.com/gp-free-multipurpose-html-bootstrap-template/
* Author: BootstrapMade.com
* License: https://bootstrapmade.com/license/
*/

 /*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
 body {
   font-family: "Open Sans", sans-serif;
   color      : #444444;
 }

 a {
   color: #8d8d8d;
 }

 a:hover {
   color          : #ff0707;
   text-decoration: none;
   cursor         : pointer;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
   font-family: "Raleway", sans-serif;
 }

 .text-centrado {
   text-align: center !important;
   color     : #dbdddf;
 }

 .texto-justificado {
   margin-bottom: 30px;
   text-align   : justify;
 }

 .texto-justificado2 {
   line-height: 1.3;
   text-align : justify;
 }

 /*--------------------------------------------------------------
# Back to top button
--------------------------------------------------------------*/
 .back-to-top {
   position: fixed;
   display : none;
   right   : 15px;
   bottom  : 15px;
   z-index : 99999;
 }

 .back-to-top i {
   display        : flex;
   align-items    : center;
   justify-content: center;
   font-size      : 24px;
   width          : 40px;
   height         : 40px;
   border-radius  : 4px;
   background     : #c0c0c0;
   color          : #ffffff;
   transition     : all 0.4s;
 }

 .back-to-top i:hover {
   background: #c0c0c0;
   color     : #ffffff;
 }

 /*--------------------------------------------------------------
# Preloader
--------------------------------------------------------------*/
 #preloader {
   position  : fixed;
   top       : 0;
   left      : 0;
   right     : 0;
   bottom    : 0;
   z-index   : 9999;
   overflow  : hidden;
   background: #151515;
 }

 #preloader:before {
   content            : "";
   position           : fixed;
   top                : calc(50% - 0px);
   left               : calc(50% - 30px);
   border             : 6px solid #8d8d8d;
   border-top-color   : #151515;
   border-bottom-color: #151515;
   border-radius      : 50%;
   width              : 60px;
   height             : 60px;
   -webkit-animation  : animate-preloader 1s linear infinite;
   animation          : animate-preloader 1s linear infinite;
 }

 @-webkit-keyframes animate-preloader {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 @keyframes animate-preloader {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 /*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
 @media screen and (max-width: 768px) {
   [data-aos-delay] {
     transition-delay: 0 !important;
   }
 }

 /*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
 #header {
   transition: all 0.5s;
   z-index   : 997;
   padding   : 15px 0;
   background: #eaeaea;
 }

 #header.header-scrolled,
 #header.header-inner-pages {
   background: #000000;
 }

 #header .logo {
   font-size     : 32px;
   margin        : 0;
   padding       : 0;
   line-height   : 1;
   font-weight   : 700;
   letter-spacing: 2px;
   text-transform: uppercase;
 }

 #header .logo a {
   color: #fff;
 }

 #header .logo a span {
   color: #8d8d8d;
 }

 #header .logo img {
   max-height: 50px;
 }

 #header p {
   color      : #ff7777;
   font-family: "Open Sans", sans-serif;
   padding-top: 10px;
   font-weight: 600;
   font-size  : 16px;
 }

 #header span {
   color    : #ca0000;
   font-size: 18px;
 }

 /*--------------------------------------------------------------
# Navigation Menu
--------------------------------------------------------------*/
 /* Desktop Navigation */
 .nav-menu ul {
   margin    : 0;
   padding   : 0;
   list-style: none;
 }

 .nav-menu>ul {
   display: flex;
 }

 .nav-menu>ul>li {
   position   : relative;
   white-space: nowrap;
   padding    : 10px 0 10px 28px;
 }

 .nav-menu a {
   display    : block;
   position   : relative;
   color      : #f2e2e2;
   transition : 0.3s;
   font-size  : 15px;
   font-family: "Open Sans", sans-serif;
   font-weight: 600;
 }

 .nav-menu a:hover,
 .nav-menu .active>a,
 .nav-menu li:hover>a {
   color: #bfbfbf;
 }

 .nav-menu .drop-down ul {
   display   : block;
   position  : absolute;
   left      : 14px;
   top       : calc(100% + 30px);
   z-index   : 99;
   opacity   : 0;
   visibility: hidden;
   padding   : 0;
   background: #fff;
   box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
   transition: 0.3s;
 }

 .nav-menu .drop-down:hover>ul {
   opacity   : 1;
   top       : 100%;
   visibility: visible;
 }

 .nav-menu .drop-down li {
   min-width: 180px;
   position : relative;
 }

 .nav-menu .drop-down ul a {
   padding       : 10px 20px;
   font-size     : 14px;
   font-weight   : 500;
   text-transform: none;
   color         : #151515;
 }

 .nav-menu .drop-down ul a:hover,
 .nav-menu .drop-down ul .active>a,
 .nav-menu .drop-down ul li:hover>a {
   color     : #400000;
   background: #8d8d8d;
 }

 .nav-menu .drop-down>a:after {
   content     : "\ea99";
   font-family : IcoFont;
   padding-left: 5px;
 }

 .nav-menu .drop-down .drop-down ul {
   top : 0;
   left: calc(100% - 30px);
 }

 .nav-menu .drop-down .drop-down:hover>ul {
   opacity: 1;
   top    : 0;
   left   : 100%;
 }

 .nav-menu .drop-down .drop-down>a {
   padding-right: 35px;
 }

 .nav-menu .drop-down .drop-down>a:after {
   content    : "\eaa0";
   font-family: IcoFont;
   position   : absolute;
   right      : 15px;
 }

 @media (max-width: 1366px) {
   .nav-menu .drop-down .drop-down ul {
     left: -90%;
   }

   .nav-menu .drop-down .drop-down:hover>ul {
     left: -100%;
   }

   .nav-menu .drop-down .drop-down>a:after {
     content: "\ea9d";
   }
 }

 /* Get Startet Button */
 .get-started-btn {
   color        : #000000;
   border-radius: 4px;
   padding      : 7px 25px 8px 25px;
   white-space  : nowrap;
   transition   : 0.3s;
   font-size    : 14px;
   display      : inline-block;
   background   : #c0c0c0;
   border       : 2px solid #8d8d8d;
 }

 .get-started-btn:hover {
   background: #c5c5c5;
   color     : #343a40;
 }

 @media (max-width: 768px) {
   .get-started-btn {
     margin : 0 48px 0 0;
     padding: 7px 20px 8px 20px;
   }
 }

 /* Mobile Navigation */
 .mobile-nav-toggle {
   position   : fixed;
   top        : 20px;
   right      : 15px;
   z-index    : 9998;
   border     : 0;
   background : none;
   font-size  : 24px;
   transition : all 0.4s;
   outline    : none !important;
   line-height: 1;
   cursor     : pointer;
   text-align : right;
 }

 .mobile-nav-toggle i {
   color: #fff;
 }

 .mobile-nav {
   position     : fixed;
   top          : 55px;
   right        : 15px;
   bottom       : 15px;
   left         : 15px;
   z-index      : 9999;
   overflow-y   : auto;
   background   : #fff;
   transition   : ease-in-out 0.2s;
   opacity      : 0;
   visibility   : hidden;
   border-radius: 10px;
   padding      : 10px 0;
 }

 .mobile-nav * {
   margin    : 0;
   padding   : 0;
   list-style: none;
 }

 .mobile-nav a {
   display    : block;
   position   : relative;
   color      : #151515;
   padding    : 10px 20px;
   font-weight: 500;
   outline    : none;
 }

 .mobile-nav a:hover,
 .mobile-nav .active>a,
 .mobile-nav li:hover>a {
   color          : #151515;
   text-decoration: none;
   background     : #8d8d8d;
 }

 .mobile-nav .drop-down>a:after {
   content     : "\ea99";
   font-family : IcoFont;
   padding-left: 10px;
   position    : absolute;
   right       : 15px;
 }

 .mobile-nav .active.drop-down>a:after {
   content: "\eaa1";
 }

 .mobile-nav .drop-down>a {
   padding-right: 35px;
 }

 .mobile-nav .drop-down ul {
   display : none;
   overflow: hidden;
 }

 .mobile-nav .drop-down li {
   padding-left: 20px;
 }

 .mobile-nav-overly {
   width     : 100%;
   height    : 100%;
   z-index   : 9997;
   top       : 0;
   left      : 0;
   position  : fixed;
   background: rgba(0, 0, 0, 0.6);
   overflow  : hidden;
   display   : none;
   transition: ease-in-out 0.2s;
 }

 .mobile-nav-active {
   overflow: hidden;
 }

 .mobile-nav-active .mobile-nav {
   opacity   : 1;
   visibility: visible;
 }

 .mobile-nav-active .mobile-nav-toggle i {
   color: #fff;
 }

 /*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
 #hero {
   width          : 100%;
   height         : 100vh;
   background     : url("../img/hero-bg.jpg") top center;
   background-size: cover;
   position       : relative;
 }

 #hero:before {
   content   : "";
   background: rgba(0, 0, 0, 0.3);
   position  : absolute;
   bottom    : 0;
   top       : 0;
   left      : 0;
   right     : 0;
 }

 #hero .container {
   position   : relative;
   padding-top: 24px;
   text-align : center;
 }

 #hero h1 {
   margin     : 0;
   font-size  : 40px;
   font-weight: 700;
   line-height: 60px;
   color      : #fff;
   font-family: "Poppins", sans-serif;
 }

 #hero h1 span {
   color: #8d8d8d;
 }

 #hero h2 {
   color    : rgba(255, 255, 255, 0.9);
   margin   : -20px 5px 0 0;
   font-size: 35px;
 }

 #hero .icon-box {
   padding   : 30px 20px;
   transition: ease-in-out 0.3s;
   border    : 1px solid rgba(255, 255, 255, 0.3);
   height    : 100%;
   text-align: center;
 }

 #hero .icon-box i {
   font-size  : 32px;
   line-height: 1;
   color      : #c0c0c0;
 }

 #hero .icon-box h3 {
   font-weight: 700;
   margin     : 10px 0 0 0;
   padding    : 0;
   line-height: 1;
   font-size  : 20px;
   line-height: 26px;
 }

 #hero .icon-box h3 a {
   color     : #fff;
   transition: ease-in-out 0.3s;
 }

 #hero .icon-box h3 a:hover {
   color: #c0c0c0;
 }

 #hero .icon-box:hover {
   border-color: #c0c0c0;
 }

 @media (min-width: 1024px) {
   #hero {
     background-attachment: fixed;
   }
 }

 @media (max-width: 768px) {
   #hero {
     height: auto;
   }

   #hero h1 {
     font-size  : 28px;
     line-height: 36px;
   }

   #hero h2 {
     font-size  : 20px;
     line-height: 24px;
   }
 }

 /*--------------------------------------------------------------
# Sections General
--------------------------------------------------------------*/
 section {
   padding : 60px 0;
   overflow: hidden;
 }

 .section-title {
   padding-bottom: 40px;
 }

 .section-title h2 {
   font-size     : 18px;
   font-weight   : 500;
   padding       : 0;
   line-height   : 1px;
   margin        : 0 0 5px 0;
   letter-spacing: 2px;
   text-transform: uppercase;
   color         : #aaaaaa;
   font-family   : "Poppins", sans-serif;
 }

 .section-title h2::after {
   content   : "";
   width     : 120px;
   height    : 1px;
   display   : inline-block;
   background: #d70000;
   margin    : 4px 10px;
 }

 .section-title p {
   margin        : 0;
   margin        : 0;
   font-size     : 26px;
   font-weight   : 700;
   text-transform: uppercase;
   font-family   : "Poppins", sans-serif;
   color         : #151515;
 }

 /*--------------------------------------------------------------
# About
--------------------------------------------------------------*/
 .about .content h3 {
   font-weight: 700;
   font-size  : 28px;
   font-family: "Poppins", sans-serif;
 }

 .about .content ul {
   list-style: none;
   padding   : 0;
 }

 .about .content ul li {
   padding : 0 0 8px 26px;
   position: relative;
 }

 .about .content ul i {
   position : absolute;
   font-size: 20px;
   left     : 0;
   top      : -3px;
   color    : #8d8d8d;
 }

 .about .content p:last-child {
   margin-bottom: 0;
 }

 /*--------------------------------------------------------------
# Clients
--------------------------------------------------------------*/
 .clients {
   padding-top: 20px;
 }

 .clients .owl-item {
   display        : flex;
   justify-content: center;
   align-items    : center;
   padding        : 0 20px;
 }

 .clients .owl-item img {
   width         : 70%;
   opacity       : 0.5;
   transition    : 0.3s;
   -webkit-filter: grayscale(100);
   filter        : grayscale(100);
 }

 .clients .owl-item img:hover {
   -webkit-filter: none;
   filter        : none;
   opacity       : 1;
 }

 .clients .owl-nav,
 .clients .owl-dots {
   margin-top: 5px;
   text-align: center;
 }

 .clients .owl-dot {
   display         : inline-block;
   margin          : 0 5px;
   width           : 12px;
   height          : 12px;
   border-radius   : 50%;
   background-color: #ddd !important;
 }

 .clients .owl-dot.active {
   background-color: #ec0000 !important;
 }

 /*--------------------------------------------------------------
# Features
--------------------------------------------------------------*/
 .features {
   padding-top: 20px;
 }

 .features .icon-box {
   padding-left: 15px;
 }

 .features .icon-box h4 {
   font-size  : 20px;
   font-weight: 700;
   margin     : 5px 0 10px 60px;
 }

 .features .icon-box i {
   font-size: 48px;
   float    : left;
   color    : #8d8d8d;
 }

 .features .icon-box p {
   font-size  : 15px;
   color      : #848484;
   margin-left: 60px;
 }

 .features .image {
   background-position: center center;
   background-repeat  : no-repeat;
   background-size    : cover;
   min-height         : 400px;
 }

 /*--------------------------------------------------------------
# Services
--------------------------------------------------------------*/
 .services .icon-box {
   text-align: center;
   border    : 1px solid #ebebeb;
   padding   : 20px 20px;
   transition: all ease-in-out 0.3s;
   background: #fff;
   width: 100%;
 }

 .services .icon-box .icon {
   margin         : 0 auto;
   width          : 64px;
   height         : 64px;
   background     : #7b7a84;
   border-radius  : 4px;
   display        : flex;
   align-items    : center;
   justify-content: center;
   margin-bottom  : 20px;
   transition     : 0.3s;
 }

 .margen-top {
   padding-top: 15px;
 }

 .services .icon-box .icon i {
   color     : #cacaca;
   font-size : 28px;
   transition: ease-in-out 0.3s;
 }

 .services .icon-box h4 {
   font-weight  : 700;
   margin-bottom: 15px;
   font-size    : 24px;
 }

 .services .icon-box h4 a {
   color     : #151515;
   transition: ease-in-out 0.3s;
 }

 .services .icon-box h4 a:hover {
   color: #8d8d8d;
 }

 .services .icon-box p {
   line-height  : 24px;
   font-size    : 14px;
   margin-bottom: 0;
 }

 .services .icon-box:hover {
   border-color: #fff;
   box-shadow  : 0px 0 25px 0 rgba(0, 0, 0, 0.1);
   transform   : translateY(-10px);
 }

 /*--------------------------------------------------------------
# Cta
--------------------------------------------------------------*/
 .cta {
   background     : linear-gradient(rgba(2, 2, 2, 0.5), rgba(0, 0, 0, 0.5)), url("../img/cta-bg.jpg") fixed center center;
   background-size: cover;
   padding        : 60px 0;
 }

 .cta h3 {
   color      : #fff;
   font-size  : 28px;
   font-weight: 700;
 }

 .cta p {
   color: #fff;
 }

 .cta .cta-btn {
   font-family   : "Raleway", sans-serif;
   font-weight   : 600;
   font-size     : 16px;
   letter-spacing: 1px;
   display       : inline-block;
   padding       : 8px 28px;
   border-radius : 4px;
   transition    : 0.5s;
   margin-top    : 10px;
   border        : 2px solid #fff;
   color         : #fff;
 }

 .cta .cta-btn:hover {
   background  : #8d8d8d;
   border-color: #8d8d8d;
   color       : #151515;
 }

 /*--------------------------------------------------------------
# Portfolio
--------------------------------------------------------------*/
 .portfolio .portfolio-item {
   margin-bottom: 30px;
 }

 .portfolio #portfolio-flters {
   padding   : 0;
   margin    : 0 auto 20px auto;
   list-style: none;
   text-align: center;
 }

 .portfolio #portfolio-flters li {
   cursor        : pointer;
   display       : inline-block;
   padding       : 8px 15px 10px 15px;
   font-size     : 14px;
   font-weight   : 600;
   line-height   : 1;
   text-transform: uppercase;
   color         : #444444;
   margin-bottom : 5px;
   transition    : all 0.3s ease-in-out;
   border-radius : 3px;
   border        : 1px solid #8d8d8d;
   background    : white;
 }

 .portfolio #portfolio-flters li:hover,
 .portfolio #portfolio-flters li.filter-active {
   color     : #151515;
   background: #dfdfdf;
 }

 .portfolio #portfolio-flters li:last-child {
   margin-right: 0;
 }

 .portfolio .portfolio-wrap {
   transition: 0.3s;
   position  : relative;
   overflow  : hidden;
   z-index   : 1;
   background: rgba(21, 21, 21, 0.6);
 }

 .portfolio .portfolio-wrap::before {
   content   : "";
   background: rgba(21, 21, 21, 0.6);
   position  : absolute;
   left      : 0;
   right     : 0;
   top       : 0;
   bottom    : 0;
   transition: all ease-in-out 0.3s;
   z-index   : 2;
   opacity   : 0;
 }

 .portfolio .portfolio-wrap img {
   transition: all ease-in-out 0.3s;
 }

 .portfolio .portfolio-wrap .portfolio-info {
   opacity        : 0;
   position       : absolute;
   top            : 0;
   left           : 0;
   right          : 0;
   bottom         : 0;
   z-index        : 3;
   transition     : all ease-in-out 0.3s;
   display        : flex;
   flex-direction : column;
   justify-content: flex-end;
   align-items    : flex-start;
   padding        : 20px;
 }

 .portfolio .portfolio-wrap .portfolio-info h4 {
   font-size  : 20px;
   color      : #fff;
   font-weight: 600;
 }

 .portfolio .portfolio-wrap .portfolio-info p {
   color         : rgba(255, 255, 255, 0.7);
   font-size     : 14px;
   text-transform: uppercase;
   padding       : 0;
   margin        : 0;
   font-style    : italic;
 }

 .portfolio .portfolio-wrap .portfolio-links {
   text-align: center;
   z-index   : 4;
 }

 .portfolio .portfolio-wrap .portfolio-links a {
   color     : #fff;
   margin    : 0 5px 0 0;
   font-size : 28px;
   display   : inline-block;
   transition: 0.3s;
 }

 .portfolio .portfolio-wrap .portfolio-links a:hover {
   color: #8d8d8d;
 }

 .portfolio .portfolio-wrap:hover::before {
   opacity: 1;
 }

 .portfolio .portfolio-wrap:hover img {
   transform: scale(1.2);
 }

 .portfolio .portfolio-wrap:hover .portfolio-info {
   opacity: 1;
 }

 /*--------------------------------------------------------------
# Counts
--------------------------------------------------------------*/
 .counts .content {
   padding: 30px 0;
 }

 .counts .content h3 {
   font-weight: 700;
   font-size  : 34px;
   color      : #151515;
 }

 .counts .content p {
   margin-bottom: 0;
 }

 .counts .content .count-box {
   padding: 20px 0;
   width  : 100%;
 }

 .counts .content .count-box i {
   display  : block;
   font-size: 36px;
   color    : #8d8d8d;
   float    : left;
 }

 .counts .content .count-box span {
   font-size  : 36px;
   line-height: 30px;
   display    : block;
   font-weight: 700;
   color      : #151515;
   margin-left: 50px;
 }

 .counts .content .count-box p {
   padding    : 15px 0 0 0;
   margin     : 0 0 0 50px;
   font-family: "Raleway", sans-serif;
   font-size  : 14px;
   color      : #3b3b3b;
 }

 .counts .content .count-box a {
   font-weight: 600;
   display    : block;
   margin-top : 20px;
   color      : #3b3b3b;
   font-size  : 15px;
   font-family: "Poppins", sans-serif;
   transition : ease-in-out 0.3s;
 }

 .counts .content .count-box a:hover {
   color: #626262;
 }

 .counts .image {
   background     : url("../img/conocenos.jpg") center center no-repeat;
   background-size: cover;
   min-height     : 400px;
 }

 @media (max-width: 991px) {
   .counts .image {
     text-align: center;
   }

   .counts .image img {
     max-width: 80%;
   }
 }

 @media (max-width: 667px) {
   .counts .image img {
     max-width: 100%;
   }
 }

 /*--------------------------------------------------------------
# Testimonials
--------------------------------------------------------------*/
 .testimonials {
   padding            : 80px 0;
   background         : url("../img/testimonials-bg.jpg") no-repeat;
   background-position: center center;
   background-size    : cover;
   position           : relative;
 }

 .testimonials::before {
   content   : "";
   position  : absolute;
   left      : 0;
   right     : 0;
   top       : 0;
   bottom    : 0;
   background: rgba(0, 0, 0, 0.7);
 }

 .testimonials .section-header {
   margin-bottom: 40px;
 }

 .testimonials .testimonial-item {
   text-align: center;
   color     : #fff;
 }

 .testimonials .testimonial-item .testimonial-img {
   width        : 100px;
   border-radius: 50%;
   border       : 6px solid rgba(255, 255, 255, 0.15);
   margin       : 0 auto;
 }

 .testimonials .testimonial-item h3 {
   font-size  : 20px;
   font-weight: bold;
   margin     : 10px 0 5px 0;
   color      : #fff;
 }

 .testimonials .testimonial-item h4 {
   font-size: 14px;
   color    : #ddd;
   margin   : 0 0 15px 0;
 }

 .testimonials .testimonial-item .quote-icon-left,
 .testimonials .testimonial-item .quote-icon-right {
   color    : rgba(255, 255, 255, 0.6);
   font-size: 26px;
 }

 .testimonials .testimonial-item .quote-icon-left {
   display : inline-block;
   left    : -5px;
   position: relative;
 }

 .testimonials .testimonial-item .quote-icon-right {
   display : inline-block;
   right   : -5px;
   position: relative;
   top     : 10px;
 }

 .testimonials .testimonial-item p {
   font-style: italic;
   margin    : 0 auto 15px auto;
   color     : #eee;
 }

 .testimonials .owl-nav,
 .testimonials .owl-dots {
   margin-top: 5px;
   text-align: center;
 }

 .testimonials .owl-dot {
   display         : inline-block;
   margin          : 0 5px;
   width           : 12px;
   height          : 12px;
   border-radius   : 50%;
   background-color: rgba(255, 255, 255, 0.4) !important;
 }

 .testimonials .owl-dot.active {
   background-color: #ec0000 !important;
 }

 @media (min-width: 1024px) {
   .testimonials {
     background-attachment: fixed;
   }
 }

 @media (min-width: 992px) {
   .testimonials .testimonial-item p {
     width: 80%;
   }
 }

 /*--------------------------------------------------------------
# Team
--------------------------------------------------------------*/
 .team {
   background: #fff;
   padding   : 60px 0;
 }

 .team .member {
   margin-bottom: 20px;
   overflow     : hidden;
   border-radius: 5px;
   background   : #fff;
   box-shadow   : 0px 2px 15px rgba(0, 0, 0, 0.1);
 }

 .team .member .member-img {
   position: relative;
   overflow: hidden;
 }

 .team .member .social {
   position  : absolute;
   left      : 0;
   bottom    : 30px;
   right     : 0;
   opacity   : 0;
   transition: ease-in-out 0.3s;
   text-align: center;
 }

 .team .member .social a {
   transition   : color 0.3s;
   color        : #151515;
   margin       : 0 3px;
   padding-top  : 7px;
   border-radius: 4px;
   width        : 36px;
   height       : 36px;
   background   : rgba(255, 255, 255, 0.8);
   display      : inline-block;
   transition   : ease-in-out 0.3s;
   color        : #8d8d8d;
 }

 .team .member .social a:hover {
   color     : #fff;
   background: #8d8d8d;
 }

 .team .member .social i {
   font-size: 18px;
 }

 .team .member .member-info {
   padding: 25px 15px;
 }

 .team .member .member-info h4 {
   font-weight  : 700;
   margin-bottom: 5px;
   font-size    : 18px;
   color        : #151515;
 }

 .team .member .member-info span {
   display    : block;
   font-size  : 13px;
   font-weight: 400;
   color      : #aaaaaa;
 }

 .team .member .member-info p {
   font-style : italic;
   font-size  : 14px;
   line-height: 26px;
   color      : #777777;
 }

 .team .member:hover .social {
   opacity: 1;
   bottom : 15px;
 }

 /*--------------------------------------------------------------
# Contact
--------------------------------------------------------------*/
 .contact .info {
   width     : 100%;
   background: #fff;
 }

 .contact .info i {
   font-size      : 20px;
   background     : #e8e5e5;
   color          : #a69393;
   float          : left;
   width          : 44px;
   height         : 44px;
   display        : flex;
   justify-content: center;
   align-items    : center;
   border-radius  : 4px;
   transition     : all 0.3s ease-in-out;
 }

 .contact .info h4 {
   padding      : 0 0 0 60px;
   font-size    : 22px;
   font-weight  : 600;
   margin-bottom: 5px;
   color        : #151515;
 }

 .contact .info p {
   padding      : 0 0 0 60px;
   margin-bottom: 0;
   font-size    : 14px;
   color        : #484848;
 }

 .contact .info .email,
 .contact .info .phone {
   margin-top: 40px;
 }

 .contact .php-email-form {
   width     : 100%;
   background: #fff;
 }

 .contact .php-email-form .form-group {
   padding-bottom: 8px;
 }

 .contact .php-email-form .validate {
   display    : none;
   color      : red;
   margin     : 0 0 15px 0;
   font-weight: 400;
   font-size  : 13px;
 }

 .contact .php-email-form .error-message {
   display    : none;
   color      : #fff;
   background : #ed3c0d;
   text-align : center;
   padding    : 15px;
   font-weight: 600;
 }

 .contact .php-email-form .sent-message {
   display    : none;
   color      : #fff;
   background : #18d26e;
   text-align : center;
   padding    : 15px;
   font-weight: 600;
 }

 .contact .php-email-form .loading {
   display   : none;
   background: #fff;
   text-align: center;
   padding   : 15px;
 }

 .contact .php-email-form .loading:before {
   content          : "";
   display          : inline-block;
   border-radius    : 50%;
   width            : 24px;
   height           : 24px;
   margin           : 0 10px -6px 0;
   border           : 3px solid #18d26e;
   border-top-color : #eee;
   -webkit-animation: animate-loading 1s linear infinite;
   animation        : animate-loading 1s linear infinite;
 }

 .contact .php-email-form input,
 .contact .php-email-form textarea {
   border-radius: 0;
   box-shadow   : none;
   font-size    : 14px;
   border-radius: 4px;
 }

 .contact .php-email-form input:focus,
 .contact .php-email-form textarea:focus {
   border-color: #8d8d8d;
 }

 .contact .php-email-form input {
   height: 44px;
 }

 .contact .php-email-form textarea {
   padding: 10px 12px;
 }

 .contact .php-email-form button[type="submit"] {
   background   : #dbdbdb;
   border       : 0;
   padding      : 10px 24px;
   color        : #151515;
   transition   : 0.4s;
   border-radius: 4px;
 }

 .contact .php-email-form button[type="submit"]:hover {
   background: #fe9b96;
 }

 @-webkit-keyframes animate-loading {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 @keyframes animate-loading {
   0% {
     transform: rotate(0deg);
   }

   100% {
     transform: rotate(360deg);
   }
 }

 /*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
 .breadcrumbs {
   padding   : 15px 0;
   background: #d0d1d7;
   min-height: 40px;
   margin-top: 74px;
 }

 .breadcrumbs h2 {
   font-size  : 28px;
   font-weight: 400;
   color      : 0f0f0f0;
   padding-top: 10px;
 }

 .breadcrumbs ol {
   display   : flex;
   flex-wrap : wrap;
   list-style: none;
   padding   : 0;
   margin    : 0;
 }

 .breadcrumbs a {
   color: #cbb798;
 }

 .breadcrumbs li {
   color: #f2f2f2;
 }

 .breadcrumbs a:hover {
   color          : #ffd584;
   text-decoration: none;
 }

 .breadcrumbs ol li+li {
   padding-left: 10px;
 }

 .breadcrumbs ol li+li::before {
   display      : inline-block;
   padding-right: 10px;
   color        : #e4e3de;
   content      : "/";
 }

 @media (max-width: 992px) {
   .breadcrumbs {
     margin-top: 68px;
   }

   .breadcrumbs .d-flex {
     display: block !important;
   }

   .breadcrumbs ol {
     display: block;
   }

   .breadcrumbs ol li {
     display: inline-block;
   }
 }

 /*--------------------------------------------------------------
# Portfolio Details
--------------------------------------------------------------*/
 .portfolio-details {
   padding-top: 40px;
 }

 .portfolio-details .portfolio-details-container {
   position: relative;
 }

 .portfolio-details .portfolio-details-carousel {
   position: relative;
   z-index : 1;
 }

 .portfolio-details .portfolio-details-carousel .owl-nav,
 .portfolio-details .portfolio-details-carousel .owl-dots {
   margin-top: 5px;
   text-align: left;
 }

 .portfolio-details .portfolio-details-carousel .owl-dot {
   display         : inline-block;
   margin          : 0 10px 0 0;
   width           : 12px;
   height          : 12px;
   border-radius   : 50%;
   background-color: #ddd !important;
 }

 .portfolio-details .portfolio-details-carousel .owl-dot.active {
   background-color: #ec0000 !important;
 }

 .portfolio-details .portfolio-info {
   padding   : 30px;
   position  : absolute;
   right     : 0;
   bottom    : 40px;
   background: #fff;
   box-shadow: 0px 2px 15px rgba(0, 0, 0, 0.1);
   z-index   : 2;
 }

 .portfolio-details .portfolio-info h3 {
   font-size     : 22px;
   font-weight   : 700;
   margin-bottom : 20px;
   padding-bottom: 20px;
   border-bottom : 1px solid #eee;
 }

 .portfolio-details .portfolio-info ul {
   list-style: none;
   padding   : 0;
   font-size : 15px;
 }

 .portfolio-details .portfolio-info ul li+li {
   margin-top: 10px;
 }

 .portfolio-details .portfolio-description {
   padding-top: 50px;
 }

 .portfolio-details .portfolio-description h2 {
   width        : 50%;
   font-size    : 26px;
   font-weight  : 700;
   margin-bottom: 20px;
 }

 .portfolio-details .portfolio-description p {
   padding: 0 0 0 0;
 }

 @media (max-width: 992px) {
   .portfolio-details .portfolio-description h2 {
     width: 100%;
   }

   .portfolio-details .portfolio-info {
     position  : static;
     margin-top: 30px;
   }
 }

 /*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
 #footer {
   background: black;
   padding   : 0 0 2px 0;
   color     : #fff;
   font-size : 14px;
 }

 #footer .footer-top {
   background   : #151515;
   border-bottom: 1px solid #222222;
   padding      : 20px 0 0 0;
 }

 #footer .footer-top .footer-info {
   margin-bottom: 30px;
 }

 #footer .footer-top .footer-info h3 {
   font-size     : 28px;
   margin        : 0 0 20px 0;
   padding       : 2px 0 2px 0;
   line-height   : 1;
   font-weight   : 700;
   text-transform: uppercase;
 }

 #footer .footer-top .footer-info h3 span {
   color: #a69393;
 }

 #footer .footer-top .footer-info p {
   font-size    : 14px;
   line-height  : 24px;
   margin-bottom: 0;
   font-family  : "Raleway", sans-serif;
   color        : #fff;
 }

 #footer .footer-top .social-links a {
   font-size    : 18px;
   display      : inline-block;
   background   : #292929;
   color        : #fff;
   line-height  : 1;
   padding      : 8px 0;
   margin-right : 4px;
   border-radius: 4px;
   text-align   : center;
   width        : 36px;
   height       : 36px;
   transition   : 0.3s;
 }

 #footer .footer-top .social-links a:hover {
   background     : #8d8d8d;
   color          : #151515;
   text-decoration: none;
 }

 #footer .footer-top h4 {
   font-size     : 16px;
   font-weight   : 600;
   color         : #fff;
   position      : relative;
   padding-bottom: 12px;
 }

 #footer .footer-top .footer-links {
   margin-bottom: 30px;
 }

 #footer .footer-top .footer-links ul {
   list-style: none;
   padding   : 0;
   margin    : 0;
 }

 #footer .footer-top .footer-links ul i {
   padding-right: 2px;
   color        : #8d8d8d;
   font-size    : 18px;
   line-height  : 1;
 }

 #footer .footer-top .footer-links ul li {
   padding    : 10px 0;
   display    : flex;
   align-items: center;
 }

 #footer .footer-top .footer-links ul li:first-child {
   padding-top: 0;
 }

 #footer .footer-top .footer-links ul a {
   color      : #fff;
   transition : 0.3s;
   display    : inline-block;
   line-height: 1;
 }

 #footer .footer-top .footer-links ul a:hover {
   color: #8d8d8d;
 }

 #footer .footer-top .footer-newsletter form {
   margin-top   : 30px;
   background   : #fff;
   padding      : 6px 10px;
   position     : relative;
   border-radius: 4px;
 }

 #footer .footer-top .footer-newsletter form input[type="email"] {
   border : 0;
   padding: 4px;
   width  : calc(100% - 110px);
 }

 #footer .footer-top .footer-newsletter form input[type="submit"] {
   position     : absolute;
   top          : 0;
   right        : -2px;
   bottom       : 0;
   border       : 0;
   background   : none;
   font-size    : 16px;
   padding      : 0 20px;
   background   : #d2d2d2;
   color        : #151515;
   transition   : 0.3s;
   border-radius: 0 4px 4px 0;
 }

 #footer .footer-top .footer-newsletter form input[type="submit"]:hover {
   background: #fe9b96;
 }

 #footer .copyright {
   text-align: center;
   padding   : 5px 0 0 0;
 }

 #footer .credits {
   padding-top: 2px;
   text-align : center;
   font-size  : 13px;
   color      : #fff;
 }

 .owl-carousel .owl-item img {
   max-height: 75vh;
   width     : auto;
 }


 #divAviso {
   box-shadow      : 0px 0px 15px 5px #f40000;
   background-color: #2d2d2d;
   color           : #c0c0c0;
   padding         : 20px;
   margin-bottom   : 0px;
   position        : fixed;
   bottom          : 0px;
   width           : 100%;
 }

 .btnAviso {

   right   : 10px;
 }

 .project-wrap {
   margin-bottom: 30px;
 }

 .project-wrap .img {
   display : block;
   width   : 100%;
   height  : 300px;
   position: relative;
   z-index : 0;
 }

 .project-wrap .img .price {
   position          : absolute;
   top               : -8px;
   left              : 20px;
   display           : inline-block;
   background        : #f40000;
   color             : #fff;
   padding           : 8px;
   font-size         : 16px;
   font-weight       : 500;
   -moz-transition   : all 0.3s ease;
   -o-transition     : all 0.3s ease;
   -webkit-transition: all 0.3s ease;
   -ms-transition    : all 0.3s ease;
   transition        : all 0.3s ease;
 }

 .project-wrap .img .price:after,
 .project-wrap .img .price:before {
   position: absolute;
   top     : 0;
   content : '';
 }

 .project-wrap .img .price:after {
   left        : -8px;
   width       : 0;
   height      : 0;
   border-style: solid;
   border-width: 0 0 8px 8px;
   border-color: transparent transparent #c7390d transparent;
 }

 .project-wrap .img .price:before {
   width       : 0;
   right       : -8px;
   height      : 0;
   border-style: solid;
   border-width: 8px 0 0 8px;
   border-color: transparent transparent transparent #c7390d;
 }

 .project-wrap.hotel .img {
   height: 320px;
 }

 .project-wrap .text {
   margin            : 0 auto;
   width             : 90%;
   position          : relative;
   border-top        : none;
   margin-top        : -40px;
   background        : #fff;
   -webkit-box-shadow: 0px 10px 23px -8px rgba(0, 0, 0, 0.11);
   -moz-box-shadow   : 0px 10px 23px -8px rgba(0, 0, 0, 0.11);
   box-shadow        : 0px 10px 23px -8px rgba(0, 0, 0, 0.11);
 }

 .project-wrap .text span {
   font-size: 13px;
 }

 .project-wrap .text .days {
   font-size     : 12px;
   color         : #f40000;
   text-transform: uppercase;
   font-weight   : 700;
 }

 .project-wrap .text h3 {
   font-size    : 24px;
   margin-bottom: 0;
   font-weight  : 500;
 }

 .project-wrap .text h3 a {
   color: #000000;
 }

 .project-wrap .text ul {
   margin : 0;
   padding: 0;
 }

 .project-wrap .text ul li {
   display     : inline-block;
   margin-right: 10px;
   color       : #b3b3b3;
 }

 .project-wrap .text ul li span {
   color       : #f40000;
   margin-right: 10px;
   font-size   : 20px;
 }

 .project-wrap:hover .text .price {
   padding-left : 15px;
   padding-right: 15px;
   background   : #33313b;
 }
 .ftco-section {
  padding : 7em 0;
  position: relative;
  width   : 100%;
}
.text-gray{
  color: #b4b4b4;
}
.text-rojo{
  color  : #f40000b9;
}

.img,
.blog-img,
.user-img {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center; }
@media (max-width: 767.98px) {
  .ftco-section {
    padding: 6em 0;
  }
}

   .social-media {
     position: fixed;
     bottom: 110px;
     right: 30px;
     z-index: 9999;
     width: 20px;
     display: flow-root;
     justify-content: center;
     align-items: center;
     animation: breathe 2s ease-in-out infinite; /* Efecto de respiración */
   }

   .social-media a {
     text-decoration: none;
   }

   .social-media img {
     width: 30px;
     height: 40px;
     border-radius: 10%;
     animation: beat 2s ease-in-out infinite; /* Efecto de latido */
     padding-bottom: 10px;
   }

   /* Animaciones */
   @keyframes breathe {
     0% {
       transform: scale(1);
     }
     50% {
       transform: scale(1.05);
     }
     100% {
       transform: scale(1);
     }
   }

   @keyframes beat {
     0% {
       transform: scale(1);
     }
     50% {
       transform: scale(1.1);
     }
     100% {
       transform: scale(1);
     }
   }