:root{
    scroll-behavior:smooth
}
body{
    font-family:Lato,sans-serif;
    color:#393a35
}
a{
    color:#393a35;
    text-decoration:none
}
a:hover{
    color:#717ff5;
    text-decoration:none
}
h1,h2,h3,h4,h5,h6{
    font-family:Maven-ProBold,sans-serif
}
section{
    padding:200px 0 200px 0;
    overflow:hidden
}
.section-header{
    text-align:center;
    padding-bottom:40px
}
.section-header h2{
    margin:10px 0 0 0;
    padding:0;
    font-size:38px;
    line-height:42px;
    font-weight:700;
    color:#031a31
}
.section-header p{
    margin:10px 0 0 0;
    padding:0;
    font-size:38px;
    line-height:42px;
    font-weight:700;
    color:#031a31;
    font-family:Maven-ProBold,sans-serif
}
@media (max-width:768px){
    .section-header p{
        font-size:28px;
        line-height:32px
    }
}
.breadcrumbs{
    padding:15px 0;
    background:#012970;
    min-height:40px;
    margin-top:82px;
    color:#fff
}
@media (max-width:992px){
    .breadcrumbs{
        margin-top:57px
    }
}
.breadcrumbs h2{
    font-size:28px;
    font-weight:500
}
.breadcrumbs ol{
    display:flex;
    flex-wrap:wrap;
    list-style:none;
    padding:0 0 10px 0;
    margin:0;
    font-size:14px
}
.breadcrumbs ol a{
    color:#fff;
    transition:.3s
}
.breadcrumbs ol a:hover{
    text-decoration:underline
}
.breadcrumbs ol li+li{
    padding-left:10px
}
.breadcrumbs ol li+li::before{
    display:inline-block;
    padding-right:10px;
    color:#8894f6;
    content:"/"
}
.back-to-top{
    position:fixed;
    visibility:hidden;
    opacity:0;
    right:15px;
    bottom: 107px;
    z-index:99999;
    background:#012970;
    width:40px;
    height:40px;
    border-radius:4px;
    transition:all .4s
}
.back-to-top i{
    font-size:24px;
    color:#fff;
    line-height:0
}
.back-to-top:hover{
    background:#8b181a;
    color:#fff
}
.back-to-top.active{
    visibility:visible;
    opacity:1
}
@media screen and (max-width:768px){
    [data-aos-delay]{
        transition-delay:0!important
    }
}
.header{
    transition:all .5s;
    z-index:997;
    padding:20px 0
}
.header.header-scrolled{
    background:#fff;
    padding:15px 0;
    box-shadow:0 2px 20px rgba(1,41,112,.1)
}
.header .logo{
    line-height:0
}
.header .logo img{
    max-height:40px;
    margin-right:6px
}
.header .logo span{
    font-size:30px;
    font-weight:700;
    letter-spacing:1px;
    color:#012970;
    font-family:Maven-ProBold,sans-serif;
    margin-top:3px
}
.navbar{
    padding:0
}
.navbar ul{
    margin:0;
    padding:0;
    display:flex;
    list-style:none;
    align-items:center
}
.navbar li{
    position:relative
}
.navbar a,.navbar a:focus{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:10px 0 10px 30px;
    font-family:Maven-ProBold,sans-serif;
    font-size:16px;
    font-weight:700;
    color: #393a35;
    white-space:nowrap;
    transition:.3s
}
.navbar a i,.navbar a:focus i{
    font-size:12px;
    line-height:0;
    margin-left:5px
}
.navbar .active,.navbar .active:focus,.navbar a:hover,.navbar li:hover>a{
    color:#de1f1c
}
.navbar .getstarted,.navbar .getstarted:focus{
    background:#de1f1c;
    padding:8px 20px;
    margin-left:30px;
    border-radius:4px;
    color:#fff
}
.navbar .getstarted:focus:hover,.navbar .getstarted:hover{
    color:#fff;
    background:#8b181a
}
.navbar .dropdown ul{
    display:block;
    position:absolute;
    left:14px;
    top:calc(100% + 30px);
    margin:0;
    padding:10px 0;
    z-index:99;
    opacity:0;
    visibility:hidden;
    background:#fff;
    box-shadow:0 0 30px rgba(127,137,161,.25);
    transition:.3s;
    border-radius:4px
}
.navbar .dropdown ul li{
    min-width:200px
}
.navbar .dropdown ul a{
    padding:10px 20px;
    font-size:15px;
    text-transform:none;
    font-weight:600
}
.navbar .dropdown ul a i{
    font-size:12px
}
.navbar .dropdown ul .active:hover,.navbar .dropdown ul a:hover,.navbar .dropdown ul li:hover>a{
    color:#4154f1
}
.navbar .dropdown:hover>ul{
    opacity:1;
    top:100%;
    visibility:visible
}
.navbar .dropdown .dropdown ul{
    top:0;
    left:calc(100% - 30px);
    visibility:hidden
}
.navbar .dropdown .dropdown:hover>ul{
    opacity:1;
    top:0;
    left:100%;
    visibility:visible
}
@media (max-width:1366px){
    .navbar .dropdown .dropdown ul{
        left:-90%
    }
    .navbar .dropdown .dropdown:hover>ul{
        left:-100%
    }
}
.mobile-nav-toggle{
    color:#031a31;
    font-size:28px;
    cursor:pointer;
    display:none;
    line-height:0;
    transition:.5s
}
.mobile-nav-toggle.bi-x{
    color:#fff
}
@media (max-width:991px){
    .mobile-nav-toggle{
        display:block
    }
    .navbar ul{
        display:none
    }
}
.navbar-mobile{
    position:fixed;
    overflow:hidden;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background:rgba(1,14,28,.9);
    transition:.3s
}
.navbar-mobile .mobile-nav-toggle{
    position:absolute;
    top:15px;
    right:15px
}
.navbar-mobile ul{
    display:block;
    position:absolute;
    top:55px;
    right:15px;
    bottom:15px;
    left:15px;
    padding:10px 0;
    border-radius:10px;
    background-color:#fff;
    overflow-y:auto;
    transition:.3s
}
.navbar-mobile a,.navbar-mobile a:focus{
    padding:10px 20px;
    font-size:15px;
    color:#031a31
}
.navbar-mobile .getstarted,.navbar-mobile .getstarted:focus{
    margin:15px
}
.navbar-mobile .dropdown ul{
    position:static;
    display:none;
    margin:10px 20px;
    padding:10px 0;
    z-index:99;
    opacity:1;
    visibility:visible;
    background:#fff;
    box-shadow:0 0 30px rgba(127,137,161,.25)
}
.navbar-mobile .dropdown ul li{
    min-width:200px
}
.navbar-mobile .dropdown ul a{
    padding:10px 20px
}
.navbar-mobile .dropdown ul a i{
    font-size:12px
}
.navbar-mobile .dropdown ul .active:hover,.navbar-mobile .dropdown ul a:hover,.navbar-mobile .dropdown ul li:hover>a{
    color:#de1f1c
}
.navbar-mobile .dropdown>.dropdown-active{
    display:block
}
.hero{
    width:100%;
    height:100vh;
    background:url(../img/webp/demo/hero-bg.webp) top center no-repeat;
    background-size:cover
}
.hero h1{
    margin:0;
    font-size:48px;
    font-weight:700;
    color:#012970
}
.hero h2{
    color:#fff;
    margin:15px 0 0 0;
    font-size:26px
}
.hero .btn-get-started{
    margin-top:30px;
    line-height:0;
    padding:15px 40px;
    border-radius:4px;
    transition:.5s;
    color:#fff;
    background:#fff;
    box-shadow:0 5px 30px rgba(139,24,26,.4)
}
.hero .btn-get-started span{
    font-family:Maven-ProBold,sans-serif;
    font-weight:600;
    font-size:16px;
    letter-spacing:1px
}
.hero .btn-get-started i{
    margin-left:5px;
    font-size:18px;
    transition:.3s
}
.hero .btn-get-started:hover i{
    transform:translateX(5px)
}
.hero .hero-img{
    text-align:right
}
@media (min-width:1024px){
    .hero{
        background-attachment:fixed
    }
}
@media (max-width:991px){
    .hero{
        height:auto;
        padding:155px 0 60px 0
    }
    .hero .hero-img{
        text-align:center;
        margin-top:80px
    }
    .hero .hero-img img{
        width:80%
    }
}
@media (max-width:768px){
    .hero{
        text-align:center
    }
    .hero h1{
        font-size:32px
    }
    .hero h2{
        font-size:24px
    }
    .hero .hero-img img{
        width:100%
    }
}

.pricing1{
    background-color: #EFEFEF;
    background-size:cover
}

.heroD{
    width:100%;
    height:100vh;
    background:url(../img/home/new/hero-bg.svg) top center no-repeat;
    background-size:cover
}
.heroD h1{
    margin:0;
    font-size:48px;
    font-weight:700;
    color:#012970
}
.heroD h2{
    color:#fff;
    margin:15px 0 0 0;
    font-size:26px
}
.heroD .btn-get-started{
    margin-top:30px;
    line-height:0;
    padding:15px 40px;
    border-radius:4px;
    transition:.5s;
    color:#fff;
    background:#fff;
    box-shadow:0 5px 30px rgba(139,24,26,.4)
}
.heroD .btn-get-started span{
    font-family:Maven-ProBold,sans-serif;
    font-weight:600;
    font-size:16px;
    letter-spacing:1px
}
.heroD .btn-get-started i{
    margin-left:5px;
    font-size:18px;
    transition:.3s
}
.heroD .btn-get-started:hover i{
    transform:translateX(5px)
}
.heroD .heroD-img{
    text-align:right
}
@media (min-width:1024px){
    .heroD{
        /* background-attachment:fixed */
    }
}
@media (max-width:991px){
    .heroD{
        height:auto;
        padding:120px 0 60px 0
    }
    .heroD .heroD-img{
        text-align:center;
        margin-top:80px
    }
    .heroD .heroD-img img{
        width:80%
    }
}
@media (max-width:768px){
    .heroD{
        text-align:center
    }
    .heroD h1{
        font-size:32px
    }
    .heroD h2{
        font-size:24px
    }
    .heroD .heroD-img img{
        width:100%
    }
}

@keyframes changeicon {
    from {
        transform:translateX(15px);
    }
  
    to {
        transform:translateX(0px);
    }
    
  }
  
.dabi{
    background:linear-gradient(0deg,#031a31 35%,#09294d 75%,#1b3f68 100%);
    text-align:center;
    color:#fff;
    background-attachment:fixed
}
.dabi h3{
    color:#fff;
    font-weight:500;
    font-size:25px;
    margin-bottom:20px;
    text-align:center
}
.dabi .btn-get-dabi{
    margin-top:30px;
    line-height:0;
    padding:15px 40px;
    border-radius:24px;
    transition:.5s;
    color:#fff;
    background:#de1f1c;
    box-shadow:0 5px 30px rgba(139,24,26,.4);
    cursor: pointer;
}
.dabi .btn-get-dabi span{
    font-family:Maven-ProBold,sans-serif;
    font-weight:600;
    font-size:20px;
    letter-spacing:1px;
    line-height: 19px;
    cursor: pointer;
}
.dabi .btn-get-dabi i{
    margin-left:5px;
    font-size:18px;
    transition:.3s;
    animation-duration: 0.5s;
    animation-name: changeicon;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}
.dabi .btn-get-dabi:hover{
    margin-top:30px;
    line-height:0;
    padding:15px 40px;
    border-radius:4px;
    transition:.5s;
    color:#fff;
    background:#a51513;
    box-shadow:0 5px 30px rgba(139,24,26,.4)
}
/* .dabi .btn-get-dabi:hover i{
    transform:translateX(5px)
} */
.dabi .background{
    background-color:#031a31;
    background:url(../img/webp/inicio/background-dabi.webp) top center no-repeat;
    padding:40px;
    border-radius:20px;
    box-shadow:0 0 30px rgba(0,0,0,.2)
}
.dabi .dabi-icons{
    margin-top:50px
}
.dabi .dabi-icons h3{
    color:#031a31;
    font-weight:700;
    font-size:32px;
    margin-bottom:20px;
    text-align:center
}
.dabi .dabi-icons h2{
    text-align:center;
    font-size:35px
}
.bannerDabii{
    background:url(../img/webp/inicio/banner-call-to-action.webp);
    background-repeat:no-repeat;
    background-position:center;
    height:500px
}
.bannerDabii h4{
    font-size:50px;
    margin-top:30px
}
.bannerDabii p{
    font-size:32px
}
.bannerDabii img{
    margin-top:-45px
}
@media (max-width:768px){
    .dabi .dabi-icons h3{
        font-size:28px
    }
    .bannerDabii{
        background:url(../img/webp/inicio/banner-call-to-action.webp);
        background-repeat:no-repeat;
        background-position:center
    }
    .bannerDabii h4{
        font-size:35px;
        margin-top:-49px;
        margin-left:20px
    }
    .bannerDabii p{
        font-size:25px;
        margin-left:20px
    }
    .bannerDabii img{
        margin-top:23px;
        max-width:22vh
    }
}
.dabi .dabi-icons .content .icon-box h4{
    font-size:20px;
    font-weight:700;
    margin:0 0 10px 0;
    color:#012970
}
.dabi .dabi-icons .content .icon-box i{
    font-size:50px;
    line-height:80px;
    color:#de1f1c;
    margin-right:15px
}
.dabi .dabi-icons .content .icon-box p{
    font-size:20px;
    color:#fff;
    margin-top:8px
}
.hero-about{
    width:100%;
    height:75vh;
    background:url(../img/about-bg.webp) top center no-repeat;
    background-size:cover;
    padding-bottom:0
}
@media (max-width:991px){
    .hero-about{
        height:auto;
        padding:120px 0 20px 0;
        text-align:center
    }
    .about .hero-img{
        text-align:center;
        margin-top:80px
    }
    .about .hero-img img{
        width:80%
    }
}
@media (max-width:768px){
    .hero-about{
        text-align:center
    }
    .about h1{
        font-size:32px
    }
    .about h2{
        font-size:24px
    }
    .about .hero-img img{
        width:100%
    }
}
.about .content{
    padding:40px
}
.about-intro{
    font-size:20px;
    font-weight:500;
    color:#393a38;
    text-align:center;
    font-family:Maven-ProBold
}
.about h1{
    font-size:23px;
    font-weight:700;
    color:#de1f1c
}
.about h2{
    font-size:20px;
    font-weight:700;
    color:#1b3f68
}
.about p{
    margin:15px 0 30px 0;
    line-height:24px;
    padding:30px
}
.btn-about{
    line-height:0;
    padding:15px 40px;
    border-radius:4px;
    transition:.5s;
    color:#fff;
    background:#de1f1c;
    box-shadow:0 5px 25px rgba(139,24,26,.3)
}
.btn-about span{
    font-family:Maven-ProBold,sans-serif;
    font-weight:600;
    font-size:16px;
    letter-spacing:1px;
    color:#fff
}
.btn-about i{
    margin-left:5px;
    font-size:18px;
    transition:.3s
}
.btn-about:hover i{
    transform:translateX(5px);
    color:#fff
}
.about-banner{
    background:linear-gradient(0deg,#757f9a 0,#bcc3d2 69%);
    color:#393a38;
    padding-top:10px
}
.hero-Blog{
    width:100%;
    height:85vh;
    background:url(../img/banner-blog.jpg) top center no-repeat;
    background-size:cover;
    padding-bottom:0
}
@media (max-width:991px){
    .hero-Blog{
        height:auto;
        padding:120px 0 20px 0;
        text-align:center
    }
    .about .hero-img{
        text-align:center;
        margin-top:80px
    }
    .about .hero-img img{
        width:80%
    }
}
@media (max-width:768px){
    .hero-Blog{
        text-align:center
    }
    .about h1{
        font-size:32px
    }
    .about h2{
        font-size:24px
    }
    .about .hero-img img{
        width:100%
    }
}
.about .content{
    padding:25px
}
.about-intro{
    font-size:20px;
    font-weight:500;
    color:#393a38;
    text-align:center;
    font-family:Maven-ProBold
}
.about h1{
    font-size:23px;
    font-weight:700;
    color:#de1f1c
}
.about h2{
    font-size:20px;
    font-weight:700;
    color:#1b3f68
}
.about p{
    margin:15px 0 30px 0;
    line-height:24px;
    padding:30px;
    font-family:Lato-Regular,sans-serif;
    font-style:italic
}
.btn-about{
    line-height:0;
    padding:15px 40px;
    border-radius:4px;
    transition:.5s;
    color:#fff;
    background:#de1f1c;
    box-shadow:0 5px 25px rgba(139,24,26,.3)
}
.btn-about span{
    font-family:Maven-ProBold,sans-serif;
    font-weight:600;
    font-size:16px;
    letter-spacing:1px;
    color:#fff
}
.btn-about i{
    margin-left:5px;
    font-size:18px;
    transition:.3s
}
.btn-about:hover i{
    transform:translateX(5px);
    color:#fff
}
.about-banner{
    background:linear-gradient(0deg,#757f9a 0,#bcc3d2 69%);
    color:#393a38;
    padding-top:10px
}
.values .box{
    padding:30px;
    box-shadow:0 0 5px rgba(1,41,112,.08);
    border-bottom: 3px solid #fff;
    text-align:center;
    transition:.3s;
    height:100%;
    border-radius:5%
}
.values .box img{
    padding:30px 50px;
    transition:.5s;
    transform:scale(1.1)
}
.values .box h3{
    font-size:24px;
    color:#031a31;
    font-weight:700;
    margin-bottom:18px
}
.values .box:hover{
    box-shadow:0 0 30px rgba(1,41,112,.08);
    border-bottom: 3px solid #DE1F1C;
}
.values .box:hover img{
    transform:scale(1)
}
.counts{
    padding:70px 0 60px
}
.counts .count-box{
    display: flex;
    padding: 26px;
    width: 100%;
    background: #fff;
    box-shadow: 0 0 30px rgba(1,41,112,.08);
    border-radius: 5%;
    flex-direction: column;
    flex-wrap: wrap;
}
.counts .count-box i{
    font-size:42px;
    line-height:1;
    margin-right:2px;
    color:#4154f1
}
.counts .count-box span{
    font-size:34px;
    display:block;
    font-weight:600;
    color:#031a31;
    margin-top: 12px;
}
.counts .count-box p{
    padding:0;
    margin:0;
    font-family:Nunito,sans-serif;
    font-size:18px
}
.feature-background{
    background:linear-gradient(0deg,#031a31 35%,#09294d 75%,#1b3f68 100%)
}
.features-title{
    margin:10px 0 0 0;
    padding:0;
    font-size:38px;
    line-height:42px;
    font-weight:700;
    color:#fff;
    text-align:center
}
.features .feature-box{
    background:#fff;
    padding:2px 2px;
    /* box-shadow:0 0 30px rgba(1,41,112,.08); */
    transition:.3s;
    height:100%;
    border-radius:5%
}
.features .feature-box h3{
    font-size:18px;
    color:#000;
    font-weight:100;
    margin:0;
    text-align:initial
}
.features .feature-box i{
    line-height:0;
    background:#DE1F1C;
    color: #fff;
    padding:4px;
    margin-right:10px;
    font-size:24px;
    border-radius:3px;
    transition:.3s
}

.features .feature-box img{
    line-height:0;
    color: #fff;
    margin-right:10px;
}

.features .feature-box:hover i{
    background:#de1f1c;
    color:#fff
}
.features .feture-tabs{
    margin-top:40px
}
.features .feture-tabs h3{
    color:#031a31;
    font-weight:700;
    font-size:32px;
    margin-bottom:10px
}
@media (max-width:768px){
    .features .feture-tabs h3{
        font-size:28px
    }
}
.features .feture-tabs .nav-pills{
    border-bottom:1px solid #eee
}
.features .feture-tabs .nav-link{
    background:0 0;
    text-transform:uppercase;
    font-size:15px;
    font-weight:600;
    color:#393a35;
    padding:12px 0;
    margin-right:25px;
    margin-bottom:-2px;
    border-radius:0
}
.features .feture-tabs .nav-link.active{
    color:#de1f1c;
    border-bottom:3px solid #de1f1c
}
.features .feture-tabs .tab-content h4{
    font-size:18px;
    margin:0;
    font-weight:700;
    color: #393a35
}
.features .feture-tabs .tab-content i{
    font-size:24px;
    line-height:0;
    margin-right:8px;
    color:#4154f1
}
.features .feature-icons{
    margin-top:250px
}
.features .feature-icons h3{
    color: #393a35;
    font-weight:700;
    font-size:32px;
    margin-bottom:20px;
    text-align:center
}
.features .feature-icons h2{
    text-align:center;
    font-size:20px
}
@media (max-width:768px){
    .features .feature-icons h3{
        font-size:28px
    }
}
.features .feature-icons .content .icon-box{
    display:flex
}
.features .feature-icons .content .icon-box h4{
    font-size:20px;
    font-weight:700;
    margin:0 0 10px 0;
    color:#012970
}
.features .feature-icons .content .icon-box i{
    font-size:44px;
    line-height:44px;
    color:#de1f1c;
    margin-right:15px
}
.features .feature-icons .content .icon-box p{
    font-size:15px;
    color:#848484
}
.features .feature-img{
    width:500px;
    margin:0 auto;
    display:block
}
.hero-industrias{
    width:100%;
    height:89vh;
    background:url(../img/webp/industrias/industrias-bg.webp) top center no-repeat;
    background-size:cover;
    padding-bottom:0;
    padding-top:0
}
@media (max-width:991px){
    .hero-industrias{
        height:auto;
        padding:0 0 20px 0;
        text-align:center
    }
    .industrias .hero-img{
        text-align:center;
        margin-top:50px
    }
    .industrias .hero-img img{
        width:80%
    }
}
@media (max-width:768px){
    .hero-industrias{
        text-align:center
    }
    .industrias h1{
        font-size:32px
    }
    .industrias h2{
        font-size:24px
    }
    .industrias .hero-img img{
        width:100%
    }
}
.industrias h1{
    font-size:23px;
    font-weight:700;
    color:#de1f1c
}
.industrias h2{
    font-size:20px;
    font-weight:700;
    color:#1b3f68
}
.services .service-box{
    box-shadow:0 0 30px rgba(1,41,112,.08);
    height:100%;
    padding:60px 30px;
    text-align:center;
    transition:.3s;
    border-radius:20px
}
.services .service-box .icon{
    font-size:36px;
    padding:40px 20px;
    border-radius:4px;
    position:relative;
    margin-bottom:25px;
    display:inline-block;
    line-height:0;
    transition:.3s
}
.services .service-box h3{
    color:#fff;
    font-weight:700
}
.services .service-box .read-more{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:600;
    font-size:16px;
    padding:8px 20px
}
.services .service-box .read-more i{
    line-height:0;
    margin-left:5px;
    font-size:18px
}
.services .service-box.one{
    background-image:url("../img/webp/industrias/telecom.webp");
    background-repeat:no-repeat;
    background-size:cover
}

.services .service-box.two{
    background-image:url("../img/webp/industrias/seguridad.webp");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.three{
    background-image:url("../img/webp/industrias/energetica.webp");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.four{
    background-image:url("../img/webp/industrias/facility.webp");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.five{
    background-image:url("../img/webp/industrias/hvacc.png");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.six{
    background-image:url("../img/webp/industrias/otros.webp");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.seven{
    background-image:url("../img/webp/industrias/field.webp");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.eight{
    background-image:url("../img/webp/industrias/control.webp");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.nine{
    background-image:url("../img/webp/industrias/provv.png");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.ten{
    background-image:url("../img/webp/industrias/actividades-comerciales.webp");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.eleven{
    background-image:url("../img/webp/industrias/produccion.webp");
    background-repeat:no-repeat;
    background-size:cover
}
.services .service-box.twelve{
    background-image:url("../img/webp/industrias/administracion-recursoshumanos.webp");
    background-repeat:no-repeat;
    background-size:cover
}

/* demo ingles */
.services .service-box.plumbing{
    background-image:url("../img/appdemo/Plumbling.webp"); 
    background-repeat:no-repeat;
    background-size:cover
}

.services .service-box.electrician{
    background-image:url("../img/appdemo/Electrician.webp");
    background-repeat:no-repeat;
    background-size:cover
}

.services .service-box.hvac{
    background-image:url("../img/appdemo/HVAC.webp");
    background-repeat:no-repeat;
    background-size:cover
}

.services .service-box.pestcontrol{
    background-image:url("../img/appdemo/Pest_control.webp");
    background-repeat:no-repeat;
    background-size:cover
}

.services .service-box.electronic{
    background-image:url("../img/appdemo/Electronic.webp");
    background-repeat:no-repeat;
    background-size:cover
}

.services .service-box.chimney{
    background-image:url("../img/appdemo/Chimney_repair.webp");
    background-repeat:no-repeat;
    background-size:cover;
    opacity: .9;
}
/* demo ingles */


.services .service-box.red{
    border-bottom:3px solid #de1f1c
}
.services .service-box.red .icon{
    color:#de1f1c;
    background:#fef7f8
}
.services .service-box.red .read-more{
    color:#de1f1c
}
.services .service-box.red:hover{
    background:#8b181a;
    background:-webkit-linear-gradient(to left,#de1f1c,#8b181a);
    background:linear-gradient(to left,#de1f1c,#8b181a)
}
/* #textluis{
    display:none;
    font-family:Lato-Regular,sans-serif
} */
.btnAction{
    color:#fff;
    font-size:21px;
    -webkit-text-decoration-line:underline;
    text-decoration-line:none;
    cursor:pointer;
    font-style: italic;
}

.btnAction:hover{
    display:initial;
    color:#fff;
    font-size:21px;
    -webkit-text-decoration-line:none;
    text-decoration-line:none;
    cursor:pointer
}

.btnAction .callActionDD{
    margin-left:5px;
    font-size: 16px;
    color: red;
    transition:.3s;
    animation-duration: 0.5s;
    animation-name: changeicon;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}


/* .services .service-box.red:hover>i{
    display:none
} */
/* .services .service-box.red:hover>#textluis{
    display:block;
    font-family:Lato-Regular,sans-serif
} */
/* .services .service-box.red:hover>.btnAction{
    display:initial;
    color:#fff;
    font-size:15px;
    -webkit-text-decoration-line:underline;
    text-decoration-line:underline;
    cursor:pointer
}
.services .service-box:hover .read-more,.services .service-box:hover h3,.services .service-box:hover p{
    color:#fff
}
.services .service-box:hover .icon{
    background:#fff
} */
.pricing .box{
    padding:40px 30px;
    background:#fff;
    text-align:center;
    box-shadow:0 0 30px rgba(1,41,112,.08);
    border-radius:20px;
    position:relative;
    overflow:hidden;
    transition:.3s
}
.pricing .box:hover{
    transform:scale(1);
    box-shadow:10px 10px 5px 0 rgba(1,41,112,.1)
}
.pricing h3{
    font-weight:700;
    font-size:22px;/*18px antes*/
    margin-bottom:15px
}
.pricing .price{
    font-size:36px;
    color:#444;
    font-weight:600;
    font-family:Poppins,sans-serif
}
.pricing .price sup{
    font-size:20px;
    top:-15px;
    left:-3px
}
.pricing .price span{
    color:#bababa;
    font-size:16px;
    font-weight:300
}
.pricing img{
    padding-bottom:25px
}
.pricing ul{
    padding:0;
    list-style:none;
    color:#444;
    text-align:center;
    line-height:26px;
    font-size:16px;
    margin-bottom:25px
}
.pricing ul li{
    padding-bottom:10px
}
.pricing ul .na{
    color:#ccc;
    text-decoration:line-through
}
.pricing .btn-buy{
    display:inline-block;
    padding:8px 40px 10px 40px;
    border-radius:50px;
    color:#de1f1c;
    transition:none;
    font-size:16px;
    font-weight:400;
    font-family:Nunito,sans-serif;
    font-weight:600;
    transition:.3s;
    border:1px solid #de1f1c
}
.pricing .btn-buy:hover{
    background:#de1f1c;
    color:#fff
}
.pricing .featured{
    width:200px;
    position:absolute;
    top:18px;
    right:-68px;
    transform:rotate(45deg);
    z-index:1;
    font-size:14px;
    padding:1px 0 3px 0;
    background:#4154f1;
    color:#fff
}
.faq .accordion-collapse{
    border:0
}
.faq .accordion-button{
    padding:15px 15px 20px 0;
    font-weight:600;
    border:0;
    font-size:18px;
    color:#444;
    text-align:left
}
.faq .accordion-button:focus{
    box-shadow:none
}
.faq .accordion-button:not(.collapsed){
    background:0 0;
    color:#de1f1c;
    border-bottom:0
}
.faq .accordion-body{
    padding:0 0 25px 0;
    border:0;
    font-family:Lato-Regular,sean-serif
}
.portfolio #portfolio-flters{
    padding:0;
    margin:0 auto 25px auto;
    list-style:none;
    text-align:center;
    background:#fff;
    border-radius:50px;
    padding:2px 15px
}
.portfolio #portfolio-flters li{
    cursor:pointer;
    display:inline-block;
    padding:8px 20px 10px 20px;
    font-size:15px;
    font-weight:600;
    line-height:1;
    color:#444;
    margin:0 4px 8px 4px;
    transition:.3s;
    border-radius:50px;
    border:1px solid #fff
}
.portfolio #portfolio-flters li.filter-active,.portfolio #portfolio-flters li:hover{
    color:#4154f1;
    border-color:#4154f1
}
.portfolio #portfolio-flters li:last-child{
    margin-right:0
}
.portfolio .portfolio-wrap{
    transition:.3s;
    position:relative;
    overflow:hidden;
    z-index:1;
    background:rgba(255,255,255,.75)
}
.portfolio .portfolio-wrap::before{
    content:"";
    background:rgba(255,255,255,.75);
    position:absolute;
    left:30px;
    right:30px;
    top:30px;
    bottom:30px;
    transition:all ease-in-out .3s;
    z-index:2;
    opacity:0
}
.portfolio .portfolio-wrap img{
    transition:1s
}
.portfolio .portfolio-wrap .portfolio-info{
    opacity:0;
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    text-align:center;
    z-index:3;
    transition:all ease-in-out .3s;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center
}
.portfolio .portfolio-wrap .portfolio-info::before{
    display:block;
    content:"";
    width:48px;
    height:48px;
    position:absolute;
    top:35px;
    left:35px;
    border-top:3px solid rgba(1,41,112,.2);
    border-left:3px solid rgba(1,41,112,.2);
    transition:all .5s ease 0s;
    z-index:9994
}
.portfolio .portfolio-wrap .portfolio-info::after{
    display:block;
    content:"";
    width:48px;
    height:48px;
    position:absolute;
    bottom:35px;
    right:35px;
    border-bottom:3px solid rgba(1,41,112,.2);
    border-right:3px solid rgba(1,41,112,.2);
    transition:all .5s ease 0s;
    z-index:9994
}
.portfolio .portfolio-wrap .portfolio-info h4{
    font-size:20px;
    color:#012970;
    font-weight:700
}
.portfolio .portfolio-wrap .portfolio-info p{
    color:#012970;
    font-weight:600;
    font-size:14px;
    text-transform:uppercase;
    padding:0;
    margin:0
}
.portfolio .portfolio-wrap .portfolio-links{
    text-align:center;
    z-index:4
}
.portfolio .portfolio-wrap .portfolio-links a{
    color:#fff;
    background:#4154f1;
    margin:10px 2px;
    width:36px;
    height:36px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    transition:.3s
}
.portfolio .portfolio-wrap .portfolio-links a i{
    font-size:24px;
    line-height:0
}
.portfolio .portfolio-wrap .portfolio-links a:hover{
    background:#5969f3
}
.portfolio .portfolio-wrap:hover img{
    transform:scale(1.1)
}
.portfolio .portfolio-wrap:hover::before{
    top:0;
    left:0;
    right:0;
    bottom:0;
    opacity:1
}
.portfolio .portfolio-wrap:hover .portfolio-info{
    opacity:1
}
.portfolio .portfolio-wrap:hover .portfolio-info::before{
    top:15px;
    left:15px
}
.portfolio .portfolio-wrap:hover .portfolio-info::after{
    bottom:15px;
    right:15px
}
@media (min-width:1025px) and (max-width:1280px){
    .gallery-slider .swiper-pagination .swiper-pagination-bullet-active{
        background-color:#5777ba
    }
    .gallery-slider .swiper-slide p{
        Color:#012970;
        font-weight:800
    }
    .gallery-slider .swiper-slide img{
        margin:0 0
    }
    .gallery-slider .swiper-slide-active{
        text-align:center
    }
    .gallery-slider .swiper-slide-active{
        border-radius:25px;
        border:3px solid #de1f1c;
        background:#fff
    }
    .gallery-slider .swiper-slide-active p{
        Color:#fff;
        font-weight:800;
        background:#de1f1c;
        margin-top:-1px;
        width:265px!important;
        text-align:center!important;
        margin-left:15px;
        border-bottom-left-radius:50% 20%;
        border-bottom-right-radius:50% 20%
    }
    .gallery-slider .swiper-slide-active img{
        margin:10px 0
    }
}
@media (min-width:1300px) and (max-width:1600px){
    .gallery-slider .swiper-pagination .swiper-pagination-bullet-active{
        background-color:#5777ba
    }
    .gallery-slider .swiper-slide p{
        Color:#012970;
        font-weight:800
    }
    .gallery-slider .swiper-slide img{
        margin:0 0
    }
    .gallery-slider .swiper-slide-active{
        text-align:center
    }
    .gallery-slider .swiper-slide-active{
        border-radius:25px;
        border:3px solid #de1f1c;
        background:#fff
    }
    .gallery-slider .swiper-slide-active p{
        Color:#fff;
        font-weight:800;
        background:#de1f1c;
        margin-top:-1px;
        width:265px!important;
        text-align:center!important;
        margin-left:46px;
        border-bottom-left-radius:50% 20%;
        border-bottom-right-radius:50% 20%
    }
    .gallery-slider .swiper-slide-active img{
        margin:10px 0
    }
}
@media (min-width:1320px) and (max-width:1900px){
    .gallery-slider .swiper-pagination .swiper-pagination-bullet-active{
        background-color:#5777ba
    }
    .gallery-slider .swiper-slide p{
        Color:#012970;
        font-weight:800
    }
    .gallery-slider .swiper-slide img{
        margin:0 0
    }
    .gallery-slider .swiper-slide-active{
        text-align:center
    }
    .gallery-slider .swiper-slide-active{
        border-radius:25px;
        border:3px solid #de1f1c;
        background:#fff
    }
    .gallery-slider .swiper-slide-active p{
        Color:#fff;
        font-weight:800;
        background:#de1f1c;
        margin-top:-1px;
        width:265px!important;
        text-align:center!important;
        margin-left:25px;
        border-bottom-left-radius:50% 20%;
        border-bottom-right-radius:50% 20%
    }
    .gallery-slider .swiper-slide-active img{
        margin:10px 0
    }
}
@media (min-width:1920px){
    .gallery-slider .swiper-pagination .swiper-pagination-bullet-active{
        background-color:#5777ba
    }
    .gallery-slider .swiper-slide p{
        Color:#012970;
        font-weight:800
    }
    .gallery-slider .swiper-slide img{
        margin:0 0
    }
    .gallery-slider .swiper-slide-active{
        text-align:center
    }
    .gallery-slider .swiper-slide-active{
        border-radius:25px;
        border:3px solid #de1f1c;
        background:#fff
    }
    .gallery-slider .swiper-slide-active p{
        Color:#fff;
        font-weight:800;
        background:#de1f1c;
        margin-top:-1px;
        width:265px!important;
        text-align:center!important;
        margin-left:90px;
        border-bottom-left-radius:50% 20%;
        border-bottom-right-radius:50% 20%
    }
    .gallery-slider .swiper-slide-active img{
        margin:10px 0
    }
}
.portfolio-details{
    padding-top:40px
}
.portfolio-details .portfolio-details-slider img{
    width:100%
}
.portfolio-details .portfolio-details-slider .swiper-pagination{
    margin-top:20px;
    position:relative
}
.portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet{
    width:12px;
    height:12px;
    background-color:#fff;
    opacity:1;
    border:1px solid #4154f1
}
.portfolio-details .portfolio-details-slider .swiper-pagination .swiper-pagination-bullet-active{
    background-color:#4154f1
}
.portfolio-details .portfolio-info{
    padding:30px;
    box-shadow:0 0 30px rgba(1,41,112,.08)
}
.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:30px
}
.portfolio-details .portfolio-description h2{
    font-size:26px;
    font-weight:700;
    margin-bottom:20px
}
.portfolio-details .portfolio-description p{
    padding:0
}
.testimonials .testimonial-item{
    box-sizing:content-box;
    padding:30px;
    margin:40px 30px;
    box-shadow:0 0 20px rgba(1,41,112,.1);
    background:#fff;
    min-height:320px;
    display:flex;
    flex-direction:column;
    text-align:center;
    transition:.3s
}
.testimonials .testimonial-item .stars{
    margin-bottom:15px
}
.testimonials .testimonial-item .stars i{
    color:#ffc107;
    margin:0 1px
}
.testimonials .testimonial-item .testimonial-img{
    width:90px;
    border-radius:50%;
    border:4px solid #fff;
    margin:0 auto
}
.testimonials .testimonial-item h3{
    font-size:18px;
    font-weight:700;
    margin:10px 0 5px 0;
    color:#012970
}
.testimonials .testimonial-item h4{
    font-size:14px;
    color:#de1f1c;
    margin:0
}
.testimonials .testimonial-item p{
    font-style:italic;
    margin:0 auto 15px auto;
    font-family:Lato-Regular,sean-serif
}
.testimonials .swiper-pagination{
    margin-top:20px;
    position:relative
}
.testimonials .swiper-pagination .swiper-pagination-bullet{
    width:12px;
    height:12px;
    background-color:#fff;
    opacity:1;
    border:1px solid #031a31
}
.testimonials .swiper-pagination .swiper-pagination-bullet-active{
    background-color:#031a31
}
.testimonials .swiper-slide{
    opacity:.3
}
@media (max-width:1199px){
    .testimonials .swiper-slide-active{
        opacity:1
    }
    .testimonials .swiper-pagination{
        margin-top:0
    }
}
@media (min-width:1200px){
    .testimonials .swiper-slide-next{
        opacity:1;
        transform:scale(1.12)
    }
}
.team{
    background:#fff
}
.team .member{
    overflow:hidden;
    text-align:center;
    border-radius:20px;
    background:#fff;
    box-shadow:0 0 30px rgba(1,41,112,.08);
    transition:.3s
}
.team .member .member-img{
    position:relative;
    overflow:hidden
}
.team .member .member-img:after{
    top:9px;
    position:absolute;
    content:"";
    left:0;
    bottom:0;
    height:100%;
    width:100%;
    background:url(../img/team-shape.svg) no-repeat center bottom;
    background-size:contain;
    z-index:1
}
.team .member .social{
    position:absolute;
    right:-100%;
    top:30px;
    opacity:0;
    border-radius:4px;
    transition:.5s;
    background:rgba(255,255,255,.3);
    z-index:2
}
.team .member .social a{
    transition:color .3s;
    color:rgba(1,41,112,.5);
    margin:15px 12px;
    display:block;
    line-height:0;
    text-align:center
}
.team .member .social a:hover{
    color:rgba(1,41,112,.8)
}
.team .member .social i{
    font-size:18px
}
.team .member .member-info{
    padding:10px 15px 20px 15px
}
.team .member .member-info h4{
    font-weight:700;
    margin-bottom:5px;
    font-size:20px;
    color:#012970
}
.team .member .member-info span{
    display:block;
    font-size:14px;
    font-weight:400;
    color:#aaa
}
.team .member .member-info p{
    font-style:italic;
    font-size:14px;
    padding-top:15px;
    line-height:26px;
    color:#5e5e5e
}
.team .member:hover{
    transform:scale(1.08);
    box-shadow:0 0 30px rgba(1,41,112,.1)
}
.team .member:hover .social{
    right:8px;
    opacity:1
}
.clients .clients-slider .swiper-slide img{
    opacity:.5;
    transition:.3s
}
.clients .clients-slider .swiper-slide img:hover{
    opacity:1
}
.clients .clients-slider .swiper-pagination{
    margin-top:20px;
    position:relative
}
.clients .clients-slider .swiper-pagination .swiper-pagination-bullet{
    width:12px;
    height:12px;
    background-color:#fff;
    opacity:1;
    border:1px solid #031a31
}
.clients .clients-slider .swiper-pagination .swiper-pagination-bullet-active{
    background-color:#031a31
}
.recent-blog-posts .post-box{
    box-shadow:0 0 30px rgba(1,41,112,.08);
    transition:.3s;
    height:100%;
    overflow:hidden;
    padding:30px;
    border-radius:20px;
    position:relative;
    display:flex;
    flex-direction:column
}
.recent-blog-posts .post-box .post-img{
    overflow:hidden;
    margin:-30px -30px 15px -30px;
    position:relative
}
.recent-blog-posts .post-box .post-img img{
    transition:.5s
}
.recent-blog-posts .post-box .post-date{
    font-size:16px;
    font-weight:600;
    color:rgba(1,41,112,.6);
    display:block;
    margin-bottom:10px
}
.recent-blog-posts .post-box .post-title{
    font-size:24px;
    color:#012970;
    font-weight:700;
    margin-bottom:18px;
    position:relative;
    transition:.3s
}
.recent-blog-posts .post-box .readmore{
    display:flex;
    align-items:center;
    font-weight:600;
    line-height:1;
    transition:.3s
}
.recent-blog-posts .post-box .readmore i{
    line-height:0;
    margin-left:4px;
    font-size:18px
}
.recent-blog-posts .post-box:hover .post-title{
    color:#4154f1
}
.recent-blog-posts .post-box:hover .post-img img{
    transform:rotate(6deg) scale(1.2)
}
.hero-contacto{
    width:100%;
    height:100vh;
    background:url(../img/contacto-bg.webp) top center no-repeat;
    background-size:cover;
    padding-bottom:0;
    padding-top:0
}


.imgMovill:hover{
    animation-duration: 0.5s;
    animation-name: pulse;
}

@media (max-width:991px){
    .hero-contacto{
        height:auto;
        padding:0 0 20px 0;
        text-align:center
    }
    .contacto .hero-img{
        text-align:center;
        margin-top:50px
    }
    .contacto .hero-img img{
        width:80%
    }
}
@media (max-width:768px){
    .hero-contacto{
        text-align:center
    }
    .contacto h1{
        font-size:32px
    }
    .contacto h2{
        font-size:24px
    }
    .contacto .hero-img img{
        width:100%
    }
}
.contacto h1{
    font-size:23px;
    font-weight:700;
    color:#de1f1c
}
.contacto h2{
    font-size:20px;
    font-weight:700;
    color:#1b3f68
}
.contact .info-box{
    color:#444;
    background:#fafbff;
    padding:30px;
    border-radius:10%
}
.contact .info-box i{
    font-size:38px;
    line-height:0;
    color:#de1f1c
}
.contact .info-box h3{
    font-size:20px;
    color:#012970;
    font-weight:700;
    margin:20px 0 10px 0
}
.contact .info-box p{
    padding:0;
    line-height:24px;
    font-size:14px;
    margin-bottom:0
}
.contact .php-email-form{
    background:#fafbff;
    padding:30px;
    height:100%;
    border-radius:20px
}
.contact .php-email-form .error-message{
    display:none;
    color:#fff;
    background:#ed3c0d;
    text-align:left;
    padding:15px;
    margin-bottom:24px;
    font-weight:600
}
.contact .php-email-form .sent-message{
    display:none;
    color:#fff;
    background:#18d26e;
    text-align:center;
    padding:15px;
    margin-bottom:24px;
    font-weight:600
}
.contact .php-email-form .loading{
    display:none;
    background:#fff;
    text-align:center;
    padding:15px;
    margin-bottom:24px
}
.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:0
}
.contact .php-email-form input:focus,.contact .php-email-form textarea:focus{
    border-color:#4154f1
}
.contact .php-email-form input{
    padding:10px 15px
}
.contact .php-email-form textarea{
    padding:12px 15px
}
.contact .php-email-form button[type=submit]{
    background:#de1f1c;
    border:0;
    padding:10px 30px;
    color:#fff;
    transition:.4s;
    border-radius:4px
}
.contact .php-email-form button[type=submit]:hover{
    background:#5969f3
}
@-webkit-keyframes animate-loading{
    0%{
        transform:rotate(0)
    }
    100%{
        transform:rotate(360deg)
    }
}
@keyframes animate-loading{
    0%{
        transform:rotate(0)
    }
    100%{
        transform:rotate(360deg)
    }
}
.blog{
    padding:40px 0 20px 0
}
.blog .entry{
    padding:30px;
    margin-bottom:60px;
    box-shadow:0 4px 16px rgba(0,0,0,.1)
}
.blog .entry .entry-img{
    max-height:440px;
    margin:-30px -30px 20px -30px;
    overflow:hidden
}
.blog .entry .entry-title{
    font-size:28px;
    font-weight:700;
    padding:0;
    margin:0 0 20px 0
}
.blog .entry .entry-title a{
    color:#012970;
    transition:.3s
}
.blog .entry .entry-title a:hover{
    color:#4154f1
}
.blog .entry .entry-meta{
    margin-bottom:15px;
    color:#4084fd
}
.blog .entry .entry-meta ul{
    display:flex;
    flex-wrap:wrap;
    list-style:none;
    align-items:center;
    padding:0;
    margin:0
}
.blog .entry .entry-meta ul li+li{
    padding-left:20px
}
.blog .entry .entry-meta i{
    font-size:16px;
    margin-right:8px;
    line-height:0
}
.blog .entry .entry-meta a{
    color:#777;
    font-size:14px;
    display:inline-block;
    line-height:1
}
.blog .entry .entry-content p{
    line-height:24px
}
.blog .entry .entry-content .read-more{
    -moz-text-align-last:right;
    text-align-last:right
}
.blog .entry .entry-content .read-more a{
    display:inline-block;
    background:#4154f1;
    color:#fff;
    padding:6px 20px;
    transition:.3s;
    font-size:14px;
    border-radius:4px
}
.blog .entry .entry-content .read-more a:hover{
    background:#5969f3
}
.blog .entry .entry-content h3{
    font-size:22px;
    margin-top:30px;
    font-weight:700
}
.blog .entry .entry-content blockquote{
    overflow:hidden;
    background-color:#fafafa;
    padding:60px;
    position:relative;
    text-align:center;
    margin:20px 0
}
.blog .entry .entry-content blockquote p{
    color:#444;
    line-height:1.6;
    margin-bottom:0;
    font-style:italic;
    font-weight:500;
    font-size:22px
}
.blog .entry .entry-content blockquote::after{
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:3px;
    background-color:#012970;
    margin-top:20px;
    margin-bottom:20px
}
.blog .entry .entry-footer{
    padding-top:10px;
    border-top:1px solid #e6e6e6
}
.blog .entry .entry-footer i{
    color:#0d64fd;
    display:inline
}
.blog .entry .entry-footer a{
    color:#013289;
    transition:.3s
}
.blog .entry .entry-footer a:hover{
    color:#4154f1
}
.blog .entry .entry-footer .cats{
    list-style:none;
    display:inline;
    padding:0 20px 0 0;
    font-size:14px
}
.blog .entry .entry-footer .cats li{
    display:inline-block
}
.blog .entry .entry-footer .tags{
    list-style:none;
    display:inline;
    padding:0;
    font-size:14px
}
.blog .entry .entry-footer .tags li{
    display:inline-block
}
.blog .entry .entry-footer .tags li+li::before{
    padding-right:6px;
    color:#6c757d;
    content:","
}
.blog .entry .entry-footer .share{
    font-size:16px
}
.blog .entry .entry-footer .share i{
    padding-left:5px
}
.blog .entry-single{
    margin-bottom:30px
}
.blog .blog-author{
    padding:20px;
    margin-bottom:30px;
    box-shadow:0 4px 16px rgba(0,0,0,.1)
}
.blog .blog-author img{
    width:120px;
    margin-right:20px
}
.blog .blog-author h4{
    font-weight:600;
    font-size:22px;
    margin-bottom:0;
    padding:0;
    color:#012970
}
.blog .blog-author .social-links{
    margin:0 10px 10px 0
}
.blog .blog-author .social-links a{
    color:rgba(1,41,112,.5);
    margin-right:5px
}
.blog .blog-author p{
    font-style:italic;
    color:#b7b7b7
}
.blog .blog-comments{
    margin-bottom:30px
}
.blog .blog-comments .comments-count{
    font-weight:700
}
.blog .blog-comments .comment{
    margin-top:30px;
    position:relative
}
.blog .blog-comments .comment .comment-img{
    margin-right:14px
}
.blog .blog-comments .comment .comment-img img{
    width:60px
}
.blog .blog-comments .comment h5{
    font-size:16px;
    margin-bottom:2px
}
.blog .blog-comments .comment h5 a{
    font-weight:700;
    color:#444;
    transition:.3s
}
.blog .blog-comments .comment h5 a:hover{
    color:#4154f1
}
.blog .blog-comments .comment h5 .reply{
    padding-left:10px;
    color:#012970
}
.blog .blog-comments .comment h5 .reply i{
    font-size:20px
}
.blog .blog-comments .comment time{
    display:block;
    font-size:14px;
    color:#013ca3;
    margin-bottom:5px
}
.blog .blog-comments .comment.comment-reply{
    padding-left:40px
}
.blog .blog-comments .reply-form{
    margin-top:30px;
    padding:30px;
    box-shadow:0 4px 16px rgba(0,0,0,.1)
}
.blog .blog-comments .reply-form h4{
    font-weight:700;
    font-size:22px
}
.blog .blog-comments .reply-form p{
    font-size:14px
}
.blog .blog-comments .reply-form input{
    border-radius:4px;
    padding:10px 10px;
    font-size:14px
}
.blog .blog-comments .reply-form input:focus{
    box-shadow:none;
    border-color:#a0aaf8
}
.blog .blog-comments .reply-form textarea{
    border-radius:4px;
    padding:10px 10px;
    font-size:14px
}
.blog .blog-comments .reply-form textarea:focus{
    box-shadow:none;
    border-color:#a0aaf8
}
.blog .blog-comments .reply-form .form-group{
    margin-bottom:25px
}
.blog .blog-comments .reply-form .btn-primary{
    border-radius:4px;
    padding:10px 20px;
    border:0;
    background-color:#012970
}
.blog .blog-comments .reply-form .btn-primary:hover{
    background-color:#013289
}
.blog .blog-pagination{
    color:#024ed5
}
.blog .blog-pagination ul{
    display:flex;
    padding:0;
    margin:0;
    list-style:none
}
.blog .blog-pagination li{
    margin:0 5px;
    transition:.3s
}
.blog .blog-pagination li a{
    color:#012970;
    padding:7px 16px;
    display:flex;
    align-items:center;
    justify-content:center
}
.blog .blog-pagination li.active,.blog .blog-pagination li:hover{
    background:#4154f1
}
.blog .blog-pagination li.active a,.blog .blog-pagination li:hover a{
    color:#fff
}
.blog .sidebar{
    padding:30px;
    margin:0 0 60px 20px;
    box-shadow:0 4px 16px rgba(0,0,0,.1)
}
.blog .sidebar .sidebar-title{
    font-size:20px;
    font-weight:700;
    padding:0;
    margin:0 0 15px 0;
    color:#012970;
    position:relative
}
.blog .sidebar .sidebar-item{
    margin-bottom:30px
}
.blog .sidebar .search-form form{
    background:#fff;
    border:1px solid #ddd;
    padding:3px 10px;
    position:relative
}
.blog .sidebar .search-form form input[type=text]{
    border:0;
    padding:4px;
    border-radius:4px;
    width:calc(100% - 40px)
}
.blog .sidebar .search-form form button{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    border:0;
    background:0 0;
    font-size:16px;
    padding:0 15px;
    margin:-1px;
    background:#4154f1;
    color:#fff;
    transition:.3s;
    border-radius:0 4px 4px 0;
    line-height:0
}
.blog .sidebar .search-form form button i{
    line-height:0
}
.blog .sidebar .search-form form button:hover{
    background:#5465f2
}
.blog .sidebar .categories ul{
    list-style:none;
    padding:0
}
.blog .sidebar .categories ul li+li{
    padding-top:10px
}
.blog .sidebar .categories ul a{
    color:#012970;
    transition:.3s
}
.blog .sidebar .categories ul a:hover{
    color:#4154f1
}
.blog .sidebar .categories ul a span{
    padding-left:5px;
    color:#aaa;
    font-size:14px
}
.blog .sidebar .recent-posts .post-item+.post-item{
    margin-top:15px
}
.blog .sidebar .recent-posts img{
    width:80px;
    float:left
}
.blog .sidebar .recent-posts h4{
    font-size:15px;
    margin-left:95px;
    font-weight:700
}
.blog .sidebar .recent-posts h4 a{
    color:#012970;
    transition:.3s
}
.blog .sidebar .recent-posts h4 a:hover{
    color:#4154f1
}
.blog .sidebar .recent-posts time{
    display:block;
    margin-left:95px;
    font-style:italic;
    font-size:14px;
    color:#aaa
}
.blog .sidebar .tags{
    margin-bottom:-10px
}
.blog .sidebar .tags ul{
    list-style:none;
    padding:0
}
.blog .sidebar .tags ul li{
    display:inline-block
}
.blog .sidebar .tags ul a{
    color:#0257ee;
    font-size:14px;
    padding:6px 14px;
    margin:0 6px 8px 0;
    border:1px solid #d7e6ff;
    display:inline-block;
    transition:.3s
}
.blog .sidebar .tags ul a:hover{
    color:#fff;
    border:1px solid #4154f1;
    background:#4154f1
}
.blog .sidebar .tags ul a span{
    padding-left:5px;
    color:#a5c5fe;
    font-size:14px
}
.footer{
    background:#393a38;
    padding:0px 0 30px 0;
    font-size:14px;
    color:#fff
}
.footer a{
    color:#fff
}
.footer a:hover{
    color:#de1f1c
}
.footer .footer-newsletter{
    padding:50px 0;
    background:#1b3f68;
    border-top:1px solid #e1ecff
}
.footer .footer-newsletter h4{
    font-size:24px;
    margin:0 0 10px 0;
    padding:0;
    line-height:1;
    font-weight:700;
    color:#fff
}
.footer .footer-newsletter p{
    color:#fff
}
.footer .btn-buy{
    display:inline-block;
    padding:8px 40px 10px 40px;
    border-radius:50px;
    color:#de1f1c;
    transition:none;
    font-size:16px;
    font-weight:400;
    font-family:Maven-ProBold,sans-serif;
    font-weight:600;
    transition:.3s;
    border:1px solid #de1f1c
}
.footer .btn-buy:hover{
    background:#de1f1c;
    color:#fff;
    background:#fff;
    padding:6px 10px;
    position:relative;
    border-radius:4px;
    border:1px solid #e1ecff
}
.footer .footer-newsletter form input[type=email]{
    border:0;
    padding:8px;
    width:calc(100% - 140px)
}
.footer .footer-newsletter form input[type=submit]{
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    border:0;
    background:0 0;
    font-size:16px;
    padding:0 30px;
    margin:3px;
    background:#4154f1;
    color:#fff;
    transition:.3s;
    border-radius:4px
}
.footer .footer-newsletter form input[type=submit]:hover{
    background:#5969f3
}
.footer .footer-top{
    padding-top:60px
}
@media (max-width:992px){
    .footer .footer-top{
        background-position:center bottom
    }
}
.footer .footer-top .footer-info{
    margin-bottom:30px
}
.footer .footer-top .footer-info .logo{
    line-height:0;
    margin-bottom:15px
}
.footer .footer-top .footer-info .logo img{
    max-height:40px;
    margin-right:6px
}
.footer .footer-top .footer-info .logo span{
    font-size:30px;
    font-weight:700;
    letter-spacing:1px;
    color:#012970;
    font-family:Lato,sans-serif;
    margin-top:3px
}
.footer .footer-top .footer-info p{
    font-size:14px;
    line-height:24px;
    margin-bottom:0;
    font-family:Lato,sans-serif
}
.footer .footer-top .social-links a{
    font-size:32px;
    display:inline-block;
    color:#fff;
    line-height:0;
    margin-right:10px;
    transition:.3s
}
.footer .footer-top .social-links a:hover{
    color:#012970
}
.footer .footer-top h4{
    font-size:22px;
    font-weight:700;
    color:#fff;
    text-transform:uppercase;
    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;
    padding-left: 2rem;
}
.footer .footer-top .footer-links ul i{
    padding-right:2px;
    color:#d0d4fc;
    font-size:12px;
    line-height:0
}
.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 li::marker{
    color:red!important
}
.footer .footer-top .footer-links ul a{
    color:#fff;
    transition:.3s;
    display:inline-block;
    line-height:1
}
.footer .footer-top .footer-links ul a:hover{
    color:#DE1F1C
}
.footer .footer-top .footer-contact p{
    line-height:26px
}
.footer .copyright{
    text-align:center;
    padding-top:30px;
    color:#fff
}
.footer .credits{
    padding-top:10px;
    text-align:center;
    font-size:13px;
    color:#fff
}
::marker{
    color:red!important
}


.btnCalendly{
    background: #de1f1c;
    padding: 8px 20px;
    margin-left: 30px;
    border-radius: 4px;
    color: #fff;
}


.btnCalendly:hover{
    background: #a51513;
    padding: 8px 20px;
    margin-left: 30px;
    border-radius: 4px;
    color: #fff;
}



.mandatory:has(input:required) label:after {
    content: " *";
    color: red;
}

.mandatory:has(select:required) label:after {
    content: " *";
    color: red;
}

.mandatory:has(textarea:required) label:after {
    content: " *";
    color: red;
}

/* video dabi */
.about_bg{
    background-image: url(https://www.dabi.io/assets/img/miniatura.png);
    background-size: cover;
    height: 330px;
}

.about_bg a {
    width: 70px;
    height: 70px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    border-radius: 50%;
    position: absolute;
    background: linear-gradient(230deg, rgba(1,41,112,1) 0%, rgba(66,59,170,0.2) 100%);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    z-index: 3;
    top: 50%;
    left: 50%;
    margin: -35px 0 0 -35px;
}

@media (max-width: 768px){
    .about_bg{
        background-image: url(https://www.dabi.io/assets/img/Miniaturamovil.png);
        background-size: cover;
        height: 360px;
        width: 367px;
    }

    .about_bg a {
        width: 70px;
        height: 70px;
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
        overflow: hidden;
        border-radius: 50%;
        position: absolute;
        background: linear-gradient(230deg, rgba(1,41,112,1) 0%, rgba(66,59,170,0.2) 100%);
        -webkit-backdrop-filter: blur(6px);
        backdrop-filter: blur(6px);
        z-index: 3;
        top: 42%;
        left: 56%;
        margin: -35px 0 0 -35px;
    }
}



.about_bg a:after {
    content: '';
    position: absolute;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    height: 60px;
    width: 60px;
    border: 2px solid rgba(255,255,255,0.1);
    z-index: 2;
    pointer-events: none;
    border-radius: 50%;
    transition: border-color 0.5s ease;
}

.about_bg a svg {
    position: relative;
    z-index: 3;
    width: 28px;
    height: 28px;
    fill: #fff;
    margin-left: 2px;
}

.titleVideoDB {
    font-weight: 700;
    background: linear-gradient(-90deg, #393A35, #e30d19);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 35px;
    font-family: "Maven-regular", ;
}


.imgLogoo{
    max-width: 11%;
    margin-top: -5px;
}

@media (max-width: 767px){
    .imgLogoo {
        max-width: 33%;
        margin-top: -5px;
    }
}

.bgCalendlyBreak{
    padding-top: 47px;
    padding-bottom: 0px;
    background: rgb(101,11,9);
    background: linear-gradient(90deg, rgba(101,11,9,1) 0%, rgba(222, 31, 28) 62%, rgba(222, 31, 28) 98%);
}

.imgBreakCalendly{
    max-width: 55%;
}


.btn-calendlyBreak {
    line-height: 0;
    padding: 15px 40px;
    border-radius: 6px;
    transition: .5s;
    color: #de1f1c;
    background: #fff;
    box-shadow: 0 5px 30px rgba(139,24,26,.4);
    cursor: pointer;
}
.btn-calendlyBreak:hover{
    line-height:0;
    padding:15px 40px;
    border-radius:4px;
    transition:.5s;
    color:#fff;
    background:#de1f1c;
    box-shadow:0 5px 30px rgba(139,24,26,.4)
}

.btn-calendlyBreak i {
    margin-left: 5px;
    font-size: 18px;
    transition: .3s;
    animation-duration: 0.5s;
    animation-name: changeicon;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

.titleCalendlyBreak{
    font-family:Maven-ProBold;
    font-size: 30px;
    color: #fff;
    text-align: justify;
}

.parrCalendlyBreak{
    font-family:Maven-Regular;
    font-size: 22px;
    color: #fff;
    text-align: justify;
}
.parrBtnCalendlyBreak{
    text-align: justify;
}

/* movil */
@media (max-width: 767px){
    .bgCalendlyBreak{
        padding-top: 47px;
        padding-bottom: 0px;
        background: rgb(101,11,9);
        background: linear-gradient(353deg, #650b09 0%, #de1f1c 62%, rgba(222, 31, 28) 98%);
    }
    .btn-calendlyBreak {
        line-height: 0;
        padding: 15px 40px;
        border-radius: 6px;
        transition: .5s;
        color: #de1f1c;
        background: #fff;
        box-shadow: 0 5px 30px rgba(139,24,26,.4);
        cursor: pointer;
        font-size: 22px;
    }
    .imgBreakCalendly{
        max-width: 88%;
    }
    .titleCalendlyBreak{
        margin-top: 34px;
        font-family:Maven-ProBold;
        font-size: 34px;
        color: #fff;
        text-align: center;
    }
    
    .parrCalendlyBreak{
        font-family:Maven-Regular;
        font-size: 22px;
        color: #fff;
        text-align: center;
    }
    .parrBtnCalendlyBreak{
        text-align: center;
    }
}

@property --rotate {
    syntax: "<angle>";
    initial-value: 10deg;
    inherits: false;
  }

  .btn-calendlyBreak2{
        line-height: 0;
        padding: 15px 40px;
        border-radius: 6px;
        transition: .5s;
        color: #de1f1c;
        background: #fff;
        box-shadow: 0 5px 30px rgba(139,24,26,.4);
        cursor: pointer;
        width: 98%;
  }
  .btn-calendlyBreak2:hover{
    line-height:0;
    padding:15px 40px;
    border-radius:4px;
    transition:.5s;
    color:#fff;
    background:#de1f1c;
    box-shadow:0 5px 30px rgba(139,24,26,.4)
}
  .btn-calendlyBreak2::before {
    content: "";
    width: 100%;
    height: 121%;
    border-radius: 8px;
    background-image: linear-gradient( var(--rotate) , #e5b1b0, #650b09 43%, #de1f1c);
    position: absolute;
    z-index: -1;
    top: -10%;
    left: -1%;
    animation: spin .9s infinite;
  }


  .btn-calendlyBreak2 i {
    margin-left: 5px;
    font-size: 18px;
    transition: .3s;
    animation-duration: 0.5s;
    animation-name: changeicon;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

  
  @keyframes spin {
    0% {
      --rotate: 0deg;
    }

    50% {
        --rotate: 180deg;
    }

    100% {
      --rotate: 360deg;
    }
  }