#whatsapp{
    position: fixed;
    left: 40px;
    bottom: 40px;
    z-index: 999999;
}

.btn-whatsapp {
  position: relative;
  width: 60px;
  height: 60px;
  text-align: center;
  display: inline-block;
  vertical-align: middle;
  border-radius: 50%;
  -moz-transition: ease all 0.55s;
  -o-transition: ease all 0.55s;
  -webkit-transition: ease all 0.55s;
  transition: ease all 0.55s;
  z-index: 1;
  border: none;
}

@keyframes pulse-border {
  0% {
    -moz-transform: scale(0.8);
    -o-transform: scale(0.8);
    -ms-transform: scale(0.8);
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    opacity: 1;
  }
  100% {
    -moz-transform: scale(2);
    -o-transform: scale(2);
    -ms-transform: scale(2);
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0;
  }
}
.btn-whatsapp:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  border-radius: 50%;
  animation: pulse-border 1500ms ease-out infinite;
  pointer-events: none;
  z-index: -1;
}

.btn-whatsapp.whatsapp {
   background: linear-gradient(120deg, #54c7b5 0%, #4b9739 100%) !important;
}
.btn-whatsapp.whatsapp:after {
   background: linear-gradient(120deg, #54c7b5 0%, #4b9739 100%) !important;
}

#whatsapp a i{
  color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 30px;
}

.color-coporative{
  background-color: #bb007a !important;
  border-radius: 5px;
}

.color-coporative:hover{
  background-color: #2e2e2e !important
}

/* Card Style Services*/

.card-style-limp {
    transition: 0.3s;
    box-shadow: 0px 3px 10px 0px rgba(41, 45, 194, 0.08);
    position: relative;
    height: 100%
}
.card-style-limp.bg-hover-color:after {
    content: '';
    background: rgba(0, 82, 158, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1
}
.card-style-limp.bg-hover-color:hover:after {
    opacity: 0
}
.card-style-limp:before {
    content: '';
    background: rgba(46, 46, 46, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0
}
.card-style-limp:hover:before {
    opacity: 1
}
.card-style-limp .service-body {
    background-color: #fff
}
.card-style-limp:hover .card-body {
    background-color: transparent
}
.card-style-limp:hover h3,
.card-style-limp:hover p,
.card-style-limp:hover a,
.card-style-limp:hover .card-footer i {
    color: #fff
}
.card-style-limp .card-body {
    width: 100%;
    height: 100%;
    transition: all 0.5s;
    padding: 197px 40px 40px 60px
}
.card-style-limp:hover .card-icon {
    -webkit-transform: translateY(-10px) translate3d(0, -10px, 0);
    -moz-transform: translateY(-10px) translate3d(0, -10px, 0);
    -ms-transform: translateY(-10px) translate3d(0, -10px, 0);
    transform: translateY(-10px) translate3d(0, -10px, 0);
    background: rgba(0, 82, 158, 1);
}
.card-style-limp .card-icon {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    background: #2e2e2e;
    display: flex;
    justify-content: center;
    margin-bottom: 21px;
    align-items: center;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -moz-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -ms-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -o-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18)
}
.card-style-limp .card-border::before {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    top: 10%;
    transition: 0.3s
}
.card-style-limp .card-border::after {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    transition: 0.3s;
    bottom: 30px;
    opacity: 0;
    transition: 0.3s
}
.card-style-limp:hover .card-border::after {
    background: #1388d7;
    opacity: 1;
    bottom: -45px;
    transition: 0.3s
}

.card-style-mant {
    transition: 0.3s;
    box-shadow: 0px 3px 10px 0px rgba(41, 45, 194, 0.08);
    position: relative;
    height: 100%
}
.card-style-mant.bg-hover-color:after {
    content: '';
    background: rgba(255, 153, 51, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1
}
.card-style-mant.bg-hover-color:hover:after {
    opacity: 0
}
.card-style-mant:before {
    content: '';
    background: rgba(46, 46, 46, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0
}
.card-style-mant:hover:before {
    opacity: 1
}
.card-style-mant .service-body {
    background-color: #fff
}
.card-style-mant:hover .card-body {
    background-color: transparent
}
.card-style-mant:hover h3,
.card-style-mant:hover p,
.card-style-mant:hover a,
.card-style-mant:hover .card-footer i {
    color: #fff
}
.card-style-mant .card-body {
    width: 100%;
    height: 100%;
    transition: all 0.5s;
    padding: 197px 40px 40px 60px
}
.card-style-mant:hover .card-icon {
    -webkit-transform: translateY(-10px) translate3d(0, -10px, 0);
    -moz-transform: translateY(-10px) translate3d(0, -10px, 0);
    -ms-transform: translateY(-10px) translate3d(0, -10px, 0);
    transform: translateY(-10px) translate3d(0, -10px, 0);
    background: rgba(255, 153, 51, 1);
}
.card-style-mant .card-icon {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    background: #2e2e2e;
    display: flex;
    justify-content: center;
    margin-bottom: 21px;
    align-items: center;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -moz-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -ms-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -o-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18)
}
.card-style-mant .card-border::before {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    top: 10%;
    transition: 0.3s
}
.card-style-mant .card-border::after {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    transition: 0.3s;
    bottom: 30px;
    opacity: 0;
    transition: 0.3s
}
.card-style-mant:hover .card-border::after {
    background: #1388d7;
    opacity: 1;
    bottom: -45px;
    transition: 0.3s
}

.card-style-ser-aux {
    transition: 0.3s;
    box-shadow: 0px 3px 10px 0px rgba(41, 45, 194, 0.08);
    position: relative;
    height: 100%
}
.card-style-ser-aux.bg-hover-color:after {
    content: '';
    background: rgba(217, 1, 128, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1
}
.card-style-ser-aux.bg-hover-color:hover:after {
    opacity: 0
}
.card-style-ser-aux:before {
    content: '';
    background: rgba(46, 46, 46, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0
}
.card-style-ser-aux:hover:before {
    opacity: 1
}
.card-style-ser-aux .service-body {
    background-color: #fff
}
.card-style-ser-aux:hover .card-body {
    background-color: transparent
}
.card-style-ser-aux:hover h3,
.card-style-ser-aux:hover p,
.card-style-ser-aux:hover a,
.card-style-ser-aux:hover .card-footer i {
    color: #fff
}
.card-style-ser-aux .card-body {
    width: 100%;
    height: 100%;
    transition: all 0.5s;
    padding: 197px 40px 40px 60px
}
.card-style-ser-aux:hover .card-icon {
    -webkit-transform: translateY(-10px) translate3d(0, -10px, 0);
    -moz-transform: translateY(-10px) translate3d(0, -10px, 0);
    -ms-transform: translateY(-10px) translate3d(0, -10px, 0);
    transform: translateY(-10px) translate3d(0, -10px, 0);
    background: rgba(217, 1, 128, 1);
}
.card-style-ser-aux .card-icon {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    background: #2e2e2e;
    display: flex;
    justify-content: center;
    margin-bottom: 21px;
    align-items: center;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -moz-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -ms-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -o-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18)
}
.card-style-ser-aux .card-border::before {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    top: 10%;
    transition: 0.3s
}
.card-style-ser-aux .card-border::after {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    transition: 0.3s;
    bottom: 30px;
    opacity: 0;
    transition: 0.3s
}
.card-style-ser-aux:hover .card-border::after {
    background: #1388d7;
    opacity: 1;
    bottom: -45px;
    transition: 0.3s
}

.card-style-jar {
    transition: 0.3s;
    box-shadow: 0px 3px 10px 0px rgba(41, 45, 194, 0.08);
    position: relative;
    height: 100%
}
.card-style-jar.bg-hover-color:after {
    content: '';
    background: rgba(109, 169, 69, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1
}
.card-style-jar.bg-hover-color:hover:after {
    opacity: 0
}
.card-style-jar:before {
    content: '';
    background: rgba(46, 46, 46, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0
}
.card-style-jar:hover:before {
    opacity: 1
}
.card-style-jar .service-body {
    background-color: #fff
}
.card-style-jar:hover .card-body {
    background-color: transparent
}
.card-style-jar:hover h3,
.card-style-jar:hover p,
.card-style-jar:hover a,
.card-style-jar:hover .card-footer i {
    color: #fff
}
.card-style-jar .card-body {
    width: 100%;
    height: 100%;
    transition: all 0.5s;
    padding: 197px 40px 40px 60px
}
.card-style-jar:hover .card-icon {
    -webkit-transform: translateY(-10px) translate3d(0, -10px, 0);
    -moz-transform: translateY(-10px) translate3d(0, -10px, 0);
    -ms-transform: translateY(-10px) translate3d(0, -10px, 0);
    transform: translateY(-10px) translate3d(0, -10px, 0);
    background: rgba(109, 169, 69, 1);
}
.card-style-jar .card-icon {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    background: #2e2e2e;
    display: flex;
    justify-content: center;
    margin-bottom: 21px;
    align-items: center;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -moz-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -ms-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -o-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18)
}
.card-style-jar .card-border::before {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    top: 10%;
    transition: 0.3s
}
.card-style-jar .card-border::after {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    transition: 0.3s;
    bottom: 30px;
    opacity: 0;
    transition: 0.3s
}
.card-style-jar:hover .card-border::after {
    background: #1388d7;
    opacity: 1;
    bottom: -45px;
    transition: 0.3s
}

.card-style-pisc {
    transition: 0.3s;
    box-shadow: 0px 3px 10px 0px rgba(41, 45, 194, 0.08);
    position: relative;
    height: 100%
}
.card-style-pisc.bg-hover-color:after {
    content: '';
    background: rgba(46, 117, 182, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1
}
.card-style-pisc.bg-hover-color:hover:after {
    opacity: 0
}
.card-style-pisc:before {
    content: '';
    background: rgba(46, 46, 46, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0
}
.card-style-pisc:hover:before {
    opacity: 1
}
.card-style-pisc .service-body {
    background-color: #fff
}
.card-style-pisc:hover .card-body {
    background-color: transparent
}
.card-style-pisc:hover h3,
.card-style-pisc:hover p,
.card-style-pisc:hover a,
.card-style-pisc:hover .card-footer i {
    color: #fff
}
.card-style-pisc .card-body {
    width: 100%;
    height: 100%;
    transition: all 0.5s;
    padding: 197px 40px 40px 60px
}
.card-style-pisc:hover .card-icon {
    -webkit-transform: translateY(-10px) translate3d(0, -10px, 0);
    -moz-transform: translateY(-10px) translate3d(0, -10px, 0);
    -ms-transform: translateY(-10px) translate3d(0, -10px, 0);
    transform: translateY(-10px) translate3d(0, -10px, 0);
    background: rgba(46, 117, 182, 1);
}
.card-style-pisc .card-icon {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    background: #2e2e2e;
    display: flex;
    justify-content: center;
    margin-bottom: 21px;
    align-items: center;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -moz-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -ms-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -o-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18)
}
.card-style-pisc .card-border::before {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    top: 10%;
    transition: 0.3s
}
.card-style-pisc .card-border::after {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    transition: 0.3s;
    bottom: 30px;
    opacity: 0;
    transition: 0.3s
}
.card-style-pisc:hover .card-border::after {
    background: #1388d7;
    opacity: 1;
    bottom: -45px;
    transition: 0.3s
}

.card-style-obras {
    transition: 0.3s;
    box-shadow: 0px 3px 10px 0px rgba(41, 45, 194, 0.08);
    position: relative;
    height: 100%
}
.card-style-obras.bg-hover-color:after {
    content: '';
    background: rgba(164, 164, 164, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 1
}
.card-style-obras.bg-hover-color:hover:after {
    opacity: 0
}
.card-style-obras:before {
    content: '';
    background: rgba(46, 46, 46, 0.8);
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0
}
.card-style-obras:hover:before {
    opacity: 1
}
.card-style-obras .service-body {
    background-color: #fff
}
.card-style-obras:hover .card-body {
    background-color: transparent
}
.card-style-obras:hover h3,
.card-style-obras:hover p,
.card-style-obras:hover a,
.card-style-obras:hover .card-footer i {
    color: #fff
}
.card-style-obras .card-body {
    width: 100%;
    height: 100%;
    transition: all 0.5s;
    padding: 197px 40px 40px 60px
}
.card-style-obras:hover .card-icon {
    -webkit-transform: translateY(-10px) translate3d(0, -10px, 0);
    -moz-transform: translateY(-10px) translate3d(0, -10px, 0);
    -ms-transform: translateY(-10px) translate3d(0, -10px, 0);
    transform: translateY(-10px) translate3d(0, -10px, 0);
    background: rgba(164, 164, 164, 1);
}
.card-style-obras .card-icon {
    width: 80px;
    height: 80px;
    border-radius: 10px;
    background: #2e2e2e;
    display: flex;
    justify-content: center;
    margin-bottom: 21px;
    align-items: center;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -moz-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -ms-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    -o-transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18);
    transition: transform 0.3s cubic-bezier(0.21, 0.6, 0.44, 2.18)
}
.card-style-obras .card-border::before {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    top: 10%;
    transition: 0.3s
}
.card-style-obras .card-border::after {
    position: absolute;
    content: "";
    background: #eee;
    width: 1px;
    height: 45px;
    transition: 0.3s;
    bottom: 30px;
    opacity: 0;
    transition: 0.3s
}
.card-style-obras:hover .card-border::after {
    background: #1388d7;
    opacity: 1;
    bottom: -45px;
    transition: 0.3s
}



@media screen and (max-width: 1399px) {
    .card-style-limp .card-body {
        padding: 197px 30px 30px 40px
    }
    .card-style-mant .card-body {
        padding: 197px 30px 30px 40px
    }
    .card-style-ser-aux .card-body {
        padding: 197px 30px 30px 40px
    }
    .card-style-jar .card-body {
        padding: 197px 30px 30px 40px
    }
    .card-style-pisc .card-body {
        padding: 197px 30px 30px 40px
    }
    .card-style-obras .card-body {
        padding: 197px 30px 30px 40px
    }
}

.margen-footer{
    margin-right: 10px;
}