
/*Section 1*/

.img1-wraper{background-image: url(/sites/default/files/images/home/home-img1.jpg);background-position: left top;width:100%;background-size: cover;background-repeat: no-repeat;}
.accordion-wrapper {max-width: 100%;z-index: 2;}
/*Section 2*/
.page-node-type-about-project .box-1{background-color: var(--primary-color);}
.page-node-type-about-project #obj-section h3,
.page-node-type-about-project #obj-section .box-2 span,
.page-node-type-about-project #obj-section .box-3 span{font-family: 'Montserrat SemiBold', sans-serif;font-size: var(--font-size-heading) !important;color: #FFF !important;line-height: normal;}
.page-node-type-about-project .white,
.page-node-type-about-project #obj-section .box-2 p,.page-node-type-about-project #obj-section .box-3 p{color:#FFFFFF;}
.page-node-type-about-project .box-2{background-color: var(--secondary-color);}
.page-node-type-about-project .box-3{background-color: #243b58;}
.page-node-type-about-project p.lead{font-size: var(--font-size-txt-lead); color:#000000;font-weight: bold;font-family: 'Montserrat SemiBold', sans-serif;line-height: normal;}
.mb-11{margin-bottom: 11rem;}

/*Section3 */
section.container-fluid.services {display: flex;flex-direction: column;align-items: center;}
.boxi{position: relative;display: flex;flex-direction: column;align-items: center;justify-content: flex-start;background-color: #ffffff00;overflow: hidden;}
.boxi:hover {transform: scale(1);background-color: #ffffff91; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);transition: transform 0.5s cubic-bezier(0.25, 1.25, 0.5, 1);}
.boxi .grid-container {position: absolute;display: flex;bottom: 0;left: 0;width: 100%;height: 15px;transition: height 0.5s ease-in-out;}
.services .caja {text-align: center;color: #fff;display: flex;flex-direction: column;align-items: center;justify-content: center;margin: 10px;box-sizing: border-box;background-position: center;}
.services .caja p,.services .caja h4{color:var(--tit-section)!important;}
.icon-box {position: relative;verflow: hidden;}
.boxi::before {overflow: hidden;content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: url(/sites/default/files/images/bg-fondo.svg) no-repeat center;background-size: cover;opacity: 0;transform: scale(5);transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;}
.boxi:hover::before {opacity: 0.3;transform: scale(1);}
.boxi:hover .icn-counter img{transform: scale(1.2);  transition: transform 0.5s cubic-bezier(0.25, 1.25, 0.5, 1); }
.caja .grid-container {height: 15px; transition: height 0.5s ease-in-out;}
.boxi:hover .grid-container {height: 30px;transition: height 0.5s ease-in-out;}
.services .icon-box h3{color:var(--tit-section)!important;}
.services .caja:hover h3,.services .caja:hover p{color:var(--primary-color);}
.icn-counter img[class^="ico"] {width: 87px;height: 87px!important;}
.icn-counter img {filter: invert(23%) sepia(16%) saturate(1686%) hue-rotate(174deg) brightness(94%) contrast(91%);}
.services .caja:hover .icn-counter img {filter: invert(100%) sepia(0%) saturate(7493%) hue-rotate(77deg) brightness(107%) contrast(99%);}
.contenedor {display: flex;justify-content: space-around;align-items: center;width: 100%;padding: 20px;flex-wrap: wrap;}
.caja img {width: 80%;}
.boxi[data-src]::after {pointer-events: auto; /* Permite que se detecte el clic */}
.boxi {position: relative;cursor: auto; /* Cambia el cursor para indicar que es clickeable */}
.boxi::after {content: "";position: absolute;inset: 0;width: 100%;height: 100%;z-index: 1; /* Se asegura de que el área completa sea clickeable */}
/*section 4*/
#section4 .icn-counter img,
#section4 .icn-section1 img[class^="ico"] {height: 67px!important;width: 67px}

#section4 .iba:hover,
#section4 .ibb:hover,
#section4 .ibc:hover,
#section4 .ibd:hover,
#section4 .ibe:hover,
#section4 .ibf:hover,
#section4 .ibg:hover{border-right: 2px solid #e6e1d0;transform: scale(1.1);background-color: #e6e1d04d;}
#section4 .iba,
#section4 .ibb,
#section4 .ibc,
#section4 .ibd,
#section4 .ibe,
#section4 .ibf,
#section4 .ibg{transition: transform 0.3s ease-in-out}

#section4 .iba:hover .icn-counter img,
#section4 .ibb:hover .icn-counter img,
#section4 .ibc:hover .icn-counter img,
#section4 .ibd:hover .icn-counter img,
#section4 .ibe:hover .icn-counter img,
#section4 .ibf:hover .icn-counter img,
#section4 .ibg:hover .icn-counter img{filter: invert(23%) sepia(16%) saturate(1686%) hue-rotate(174deg) brightness(94%) contrast(91%);;transform: scale(1.5);}
#section4 .iba .icn-counter img,
#section4 .ibb .icn-counter img,
#section4 .ibc .icn-counter img,
#section4 .ibd .icn-counter img,
#section4 .ibe .icn-counter img,
#section4 .ibf .icn-counter img,
#section4 .ibg .icn-counter img{transition: transform 0.3s ease-in-out;}
#section4 .icn-counter .box-i img{height: 67px!important;width: 67px;filter: invert(49%) sepia(50%) saturate(572%) hue-rotate(37deg) brightness(90%) contrast(87%)!important;}
#section4 .icn-counter .box-i {background-color: #e6e1d0;display: flex;justify-content: center;align-items: center;width: 100%;}

/*

.img-bg{transition: transform 0.3s ease-in-out}
.img-bg:hover{transform: scale(1.4);}*/
/*COUNTER*/
#counter .mask-bg {border:0px solid var(--primary-color);position: relative;overflow: hidden;background-color: aliceblue;width: 100%;height: 100%;}
.img-bg-number{transition: transform 0.3s ease-in-out}
.img-bg-number:hover{transform: scale(1.2);}
#counter .counter-block {overflow: hidden;flex-wrap: wrap;}
#counter .block {display: flex;align-items: normal;height: 320px;width: 100%;flex:1; background-color: var(--primary-color);}
#counter span.countfect {font-size: 3rem;font-weight: bold;color: #FFFFFF;}
#counter span.counter-description {font-size: 1rem;text-transform: uppercase;color:#FFFFFF;font-weight: 800;}
#counter div[class*="mn-"] {font-size: 3rem;}
.icn-counter img,.icn-section1 img[class^="ico"] {height: 100px!important;width: 100px}
.icn-counter.number img{height: 77px!important;width: 77px;}
.icn-counter .box-i img{height: 47px!important;width: 47px;}
.icn-counter .box-i {padding: 68px;background-color: var(--secondary-color);display: flex;justify-content: center;align-items: center;height: 100%;width: 100%;}
.img-bg-number .icn-counter img {filter: invert(99%) sepia(10%) saturate(698%) hue-rotate(203deg) brightness(113%) contrast(100%);}
.img-bg-number .icn-counter img.color-invert{filter: invert(42%) sepia(83%) saturate(1289%) hue-rotate(147deg) brightness(91%) contrast(100%)!important;}

/*Partners*/
.slick-list{margin-bottom: 50px;}
.slick-slide {padding: 0px 20px;}
.slick-slide img{width: 220px;}

/*Project*/
.p1 ,.p2 ,.p3 ,.p4 ,.p5 ,.p6 ,.p7 ,.p8,.p9, .p10, .p11, .p12,.p13{padding-right: 12px;}
.p14 {width: 14%;}.p15 {width: 15%;}.p16 {width: 16%;}.p17 {width: 17%;}.p18 {width: 18%;}.p19 {width: 19%;}.p20 {width: 20%;}.p21 {width: 21%;}.p22 {width: 22%;}.p23 {width: 23%;}.p24 {width: 24%;}.p25 {width: 25%;}.p26 {width: 26%;}.p27 {width: 27%;}.p28 {width: 28%;}.p29 {width: 29%;}.p30 {width: 30%;}.p31 {width: 31%;}.p32 {width: 32%;}.p33 {width: 33%;}.p34 {width: 34%;}.p35 {width: 35%;}.p36 {width: 36%;}.p37 {width: 37%;}.p38 {width: 38%;}.p39 {width: 39%;}.p40 {width: 40%;}.p41 {width: 41%;}.p42 {width: 42%;}.p43 {width: 43%;}.p44 {width: 44%;}.p45 {width: 45%;}.p46 {width: 46%;}.p47 {width: 47%;}.p48 {width: 48%;}.p49 {width: 49%;}.p50 {width: 50%;}.p51 {width: 51%;}.p52 {width: 52%;}.p53 {width: 53%;}.p54 {width: 54%;}.p55 {width: 55%;}.p56 {width: 56%;}.p57 {width: 57%;}.p58 {width: 58%;}.p59 {width: 59%;}.p60 {width: 60%;}.p61 {width: 61%;}.p62 {width: 62%;}.p63 {width: 63%;}.p64 {width: 64%;}.p65 {width: 65%;}.p66 {width: 66%;}.p67 {width: 67%;}.p68 {width: 68%;}.p69 {width: 69%;}.p70 {width: 70%;}.p71 {width: 71%;}.p72 {width: 72%;}.p73 {width: 73%;}.p74 {width: 74%;}.p75 {width: 75%;}.p76 {width: 76%;}.p77 {width: 77%;}.p78 {width: 78%;}.p79 {width: 79%;}.p80 {width: 80%;}.p81 {width: 81%;}.p82 {width: 82%;}.p83 {width: 83%;}.p84 {width: 84%;}.p85 {width: 85%;}.p86 {width: 86%;}.p87 {width: 87%;}.p88 {width: 88%;}.p89 {width: 89%;}.p90 {width: 90%;}.p91 {width: 91%;}.p92 {width: 92%;}.p93 {width: 93%;}.p94 {width: 94%;}.p95 {width: 95%;}.p96 {width: 96%;}.p97 {width: 97%;}.p98 {width: 98%;}.p99 {width: 99%;}.p100 {width: 100%}
.progress-block .title {font-weight: bold;text-transform: uppercase;color: var(--primary-color) !important;font-size: 2rem;}
.bg-black {background-color: var(--primary-color)!important;align-self: start;border-radius: 4px;font-size: 15px;color: #fff;padding: 0 5px;font-weight: bold;}
.progress-block .body-text{height: 60px;border-bottom:0px solid #f1f1f133;}
.progress-block .body-text p{text-align: center;color: var(--primary-color);line-height: normal;font-size: 15px;}
.progress {justify-items: self-end;display: flex;align-content: end;border-radius: 30;justify-content: start;width: 350px;height: 350px;background: none;position: relative;}
.progress::after {content: "";width: 100%;height: 100%;border-radius: 50%;border: 6px solid var(--secondary-color);position: absolute;top: 0;left: 0;}
.progress>span {width: 50%;height: 100%;overflow: hidden;position: absolute;top: 0;z-index: 2;}
.progress .progress-left {left: 0;}
.progress .progress-bar {width: 100%;height: 100%;background: none;border-width: 20px;border-style: solid;position: absolute;top: 0;}
.progress p.leader {color: var(--color-primary);font-size: 16px;font-weight: 600;}
.barra-progress, .bg-black{	height: 50px;}
.barra-progress{ background-color: var(--secondary-color);justify-items: self-end;justify-content: start;}
.progress .porcentaje {font-size: 2.5rem;font-weight: bolder; color: var(--primary-color);}
.progress .progress-left .progress-bar {left: 100%;border-top-right-radius: 173px;border-bottom-right-radius: 173px;border-left: 0;-webkit-transform-origin: center left;transform-origin: center left;}
.progress .progress-right {right: 0;}
.progress .progress-right .progress-bar {left: -100%;border-top-left-radius: 173px;border-bottom-left-radius: 173px;border-right: 0;-webkit-transform-origin: center right;transform-origin: center right;}
.progress .progress-value {position: absolute;padding: 45px;top: 0;left: 0;}
.progress .border-primary {border-color:var(--primary-color) !important;}
/*Fin Project*/

/*Arrow progress partners*/
button.slick-prev.slick-arrow:before,
button.slick-next.slick-arrow:before{width: 81px;height: 81px;color: var(--primary-color); font-size: 4rem!important;opacity: 1;}


@media (min-width: 320px) and (max-width: 374px) {
    .progress { width: 295px!important; height: 295px!important; }
    .slick-slide { padding: 0px 2px; }
}

@media (min-width: 375px) and (max-width: 424px) {
    .progress { width: 300px!important; height: 300px!important; }
    .slick-slide { padding: 0px 20px; }
}

@media (max-width: 425px) {
    .icn-counter .box-i { height: 50px; width: 50px; }
    .accordion-button { min-height: 150px; }
}

@media (min-width: 425px) and (max-width: 500px) {
    .progress { width: 300px!important; height: 300px!important; }
    .slick-slide { padding: 0px 45px; }
}

@media (min-width: 501px) and (max-width: 768px) {
    .progress { width: 320px!important; height: 320px!important; }
    .slick-slide { padding: 0px 15px; }
}

@media (max-width: 768px) {
    .box-area-container { flex-direction: column; align-items: center; margin-top: 0rem!important; }
    .box-area { width: 98%!important; max-width: none; height: auto; }
    .box-area1 { top: 0!important; }
    .gallery { flex-direction: column; height: auto; }
    .gallery .image-container { width: 100%; height: 100px; }
    .gallery .image-container:hover { height: 300px; }
    .accordion-button{height: auto;}
    .accordion-button::after{margin-left: auto;}
    .bg-section-2{background-color:  var(--background-color);}
}

@media (min-width: 769px) {
    .slick-slide { padding: 0px 45px; }
    .page-node-type-about-project .slick-slider .views-row {width: 410px;}
    #section-2 .accordion-button{height: 120px;}
    #section-2 .accordion-button::after{margin-left: 1.5rem}
}
@media (min-width: 2016px) {
  .accordion-wrapper,.cta {position: absolute;top: 0;right: 0;transform: translate(-22%,-2%);}
  .cta {transform: translate(-22%,14%);}
  .cta-izq {transform: translate(17%,14%);}
  .image-wrapper {height: 100%;}
}