
/*GENERALS*/

@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

html{
 /*overflow-x:hidden;*/
 -webkit-user-select: none; /* Safari */
  -ms-user-select: none; /* IE 10 and IE 11 */
  user-select: none; /* Standard syntax */
}


::-webkit-scrollbar-track {
    background: #00000080;
}


::-webkit-scrollbar-thumb {
    background: #000;
    border-radius:10px;

}

::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 7px;
}


:focus-visible{
  outline: none; 
}


body {
    /* overflow-x:hidden; */
    background-color: var(--background-color);
    /*background-image:url('/media/disturbo-nero.jpg');*/
}

body.product_page{
    background-image: url(/media/disturbo-nero.jpg);
}



.body-t {
    /* overflow-x: hidden; */
    width: 100%;
    background-color: var(--background-color);
    background-position: top center;
    background-size: contain;
    background-repeat-y: repeat;
    height: 100vh;
    background-image: url(/assets/frontend/img/tp-natalizi-giuseppe_bg.jpg);
    background-size: cover;
}

section{
    padding: 0;
    position: relative;
}


a{
   text-decoration:none;
   color:inherit;
}

a:hover{
   color:inherit;
}

.mobile{
   display:none;
}



.close-menu{
   position: fixed;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   z-index: 999;
   transform: translateX(100%);
}


.close-menu.show{
   transform: translateX(0%);
}


.logo {
   width: 8rem;
   transition: 0.3s;
   position: relative;
   text-align: center;
   padding: 0;
}

.logo > img{
   height: 100%;
}

.logo > svg{
   height: 100%;
   fill:var(--secondary-color);
   transform-origin: left;
   transition: 0.2s transform;
}

.logo-footer svg{
    width: 6.4rem;
    fill:var(--secondary-color)
}


.menu-scroll .logo > svg{
   transform: scale(0.8);
   fill: #000;
}


.black-menu .logo > svg{
   transform: scale(0.8);
   fill: #000;
}

.show-menu .logo > svg {
    transform: scale(0.8);
    fill: #fff;
}


.black-menu .menu-item {
    color: #fff;
}

.black-menu .menu-item svg {
    stroke: #fff;
}


.black-menu .navigation-bar .menu-item .dropdown-menu {
    background: #000;
    
}


.black-menu .navigation-bar .menu-item .dropdown-menu .sub-menu .nav-item .nav-link.cms {
    color: #ffffff90;
    fill: #ffffff90;
}

.black-menu .navigation-bar .menu-item .dropdown-menu .sub-menu .nav-item .nav-link.cms:hover {
    color: #fff;
    fill: #fff;
}


.black-menu .mobile-menu:before {
    background-color: #ffffff;
}

.black-menu .mobile-menu:after {
    background-color: #ffffff;
}

.menu-scroll .navigation-bar {
}


input, textarea, checkbox, radio, select{
   border-radius:0 !Important;
}

.col-flex{
    display:flex;
}

.bgd-nav{
   padding-top: 1rem;
   transition: 0.2s;
   position: fixed;
   right: 0;
   padding: 0rem 5rem;
   z-index: 100;
   display: block;
   top: 0;
   padding-top: 0;
   width: 100%;
   background: linear-gradient(to top, #b2b7c300 50%, #000000 50%);
   background-size: 100% 200%;
   background-position: right bottom;
}

.navbar-cont{
   display: flex;
   width: 100%;
   transition: 0.1s;
   justify-content: space-between;
   align-items: flex-start;
   padding: 1.5rem 0 0 0;
}

.menu-scroll .navbar-cont{padding: 1.5rem 0 1.5rem 0;}

.bgd-primary{
   
   background-color: var( --secondary-color );
}

.bgd-secondary{
   
   background-color: var( --third-color );
}


.topbar {
   padding: 3px 0px;
}

.share-link {
   position: absolute;
   display: flex;
   height: 100vh;
   top: -3rem;
   right: 20.4vw;
}

.social-link {
   list-style: none;
   padding: 0;
   margin: 0;
   display: flex;
   flex-direction: column;
   position: sticky;
   top: 8rem;
   align-self: flex-start;
}



.social-link > li:not(:last-child){
   margin-bottom: 4rem;
}


.lang-item{
   cursor:pointer;
   text-transform:uppercase;
   padding: 0;
   font-family: "Montserrat", sans-serif;
   font-size: 14px;
   font-weight: 300;
   line-height: 1.5em;
   letter-spacing: 1px;
   font-style: italic;
   color: #FFFFFF78;
   fill: #FFFFFF78;
   transition: 0.2s;
}

.social-link  > a {
    color: #ffffff !important;
    background: linear-gradient(to bottom, #b2b7c300 50%, #ffffff 50%);
    background-size: 100% 200%;
    background-position: right top;
    padding: 30px 4px;
    font-size: 1.5rem;
    transition: 0.3s;
    text-align: center;
    margin-bottom: 1rem;
}

.social-link > a:hover{
       background-position: left bottom;
       color: #3a3a3a !important;
}

.social-link  > a:last-child{

    margin-bottom: 0rem;
}



.social-link  > span {
    color: #ffffff !important;
    background: linear-gradient(to bottom, #b2b7c300 50%, #ffffff 50%);
    background-size: 100% 200%;
    background-position: right top;
    padding: 30px 4px;
    font-size: 1.5rem;
    transition: 0.3s;
    text-align: center;
    margin-bottom: 1rem;
    cursor:pointer;
}

.social-link > span:hover{
       background-position: left bottom;
       color: #3a3a3a !important;
}

.social-link  > span:last-child{

    margin-bottom: 0rem;
}



.social-link > li > span{
       color: #ffffff !important;
       background: var(--secondary-color);
       padding: 10px 16px;
       font-size: 2rem;
       cursor:pointer;
       transition: 0.3s;
}

.social-link > li > span:hover{
       background-color: var(--primary-color);
       color: #fff !important;
}


.nav-item{
   position:relative;
}


.nav-item:not(:last-child){
   margin-right: 1rem;
}

.nav-link.cms{
   padding: 0;
   font-size: 15px;
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   line-height: 1.5em;
   padding: 2rem;
   padding-right: 0;
   padding-left: 0;
   margin: 0 1rem;
   letter-spacing: 2px;
   display: flex;
   color: var(--secondary-color);
   fill: var(--secondary-color);
   transition: 0.2s;
   cursor:pointer;
   align-items: center;
   text-transform: uppercase;
   white-space: pre;
}

.nav-link.cms > svg{
   transition: 0.2s;
   width: 10px;
   height: 10px;
   margin-left: 10px;
   margin-bottom: 4px;
}

.nav-link.cms.open > svg{
transform: rotate(-90deg);
}



.nav-link.cms.active, .nav-link.cms:hover{
   color: var(--secondary-color);
   fill: var(--secondary-color);
}


/*.nav-item:after{*/
/*   content: '';*/
/*   margin-top: -4px;*/
/*   width:0;*/
/*   height: 3px;*/
/*   left: 0;*/
/*   background-color: var(--default-color);*/
/*   z-index: 1;*/
/*   display: block;*/
/*   transition:0.2s;*/
/*}*/



.nav-item:hover:after, .nav-item.active:after{
   
    width:100%;
}



.temporary{
    height: 100%;
    display: flex;
    align-content: center;
    align-items: center;
    flex-direction: row;
    justify-content: center;
    background: #0000001f;
}

.hero {
    z-index: 2;
}

.hero .container{
    position:relative;
    z-index:10;
    margin-top: 5rem;
}


.hero.page .container{
    display:flex;
    gap:3rem;
    flex-direction: column;
}




.hero canvas{
    top: -5rem;
    position: absolute;
    left: 0;
}


.hero.default canvas{
    top: 0;
}


.footer canvas{
    top: 0;
    position: absolute;
    left: 0;
}

.footer .container-fluid{
    z-index:4;
}

.hero .overlay{
    width: 100%;
    position: relative;
    background-size: cover;
    background-repeat: no-repeat;
    height: 70vh;
}

.bg-points{
    transition:3s;
}

.bg-points.hover-top {
    transform: scale(0.95) translateY(-2rem);
}

.bg-points.hover-bottom {
    transform: scale(0.95) translateY(2rem);
}


.bg-line-points{
    width: 100%;
    position: absolute;
    top: 0;
    z-index:8;
    left: 0;
}


.square-star{
    width: 9px;
    position: absolute;
    height: 9px;
    z-index:9;
    background: var(--default-color);
    transition: 0.3s;
}


.position-1{
    left: 0px;
    bottom: 14.5vh;
}

.position-2{
    bottom: 0;
    left: 15vw;
}
.position-3{
    top: 38vh;
    left: 26.5vw;
}
.position-4{
    bottom: 7vh;
    left: 34.4vw;
}
.position-5{
    left: 45.5vw;
}
.position-6{
    left: 53.5vw;
    bottom: 18vh;
}
.position-7{
    left: 53.5vw;
    top: 14.5vh;
}
.position-8{
    right: 19.5vw;
    top: 0.75vh;
}
.position-9{
    right: 9.5vw;
    top: 21vh;
}
.position-10{
    right: 0px;
}







.hero.page{
    width: 100vw;
    padding: 8rem 3rem 0rem 3rem;
    z-index: 2;
}

.hero.certificate{
    padding-bottom: 5rem;
}


.default-button{
    display: flex;
    align-items: center;
    position:relative;
    justify-content: flex-start;
    flex-direction: row;
    border-bottom-left-radius: 3rem;
    border-top-left-radius: 3rem;
    margin-top: 3rem;
}

.bg-button-default{
    background: linear-gradient(90deg, rgb(77 77 77) 75%, rgba(255,255,255,0) 100%);
    position:absolute;
    left: 1.5rem;
    bottom:0;
    height:100%;
    z-index: 1;
    width:0;
    transition: 0.2s;
    border-bottom-left-radius: 2rem;
    border-top-left-radius: 2rem;
}

.default-button:hover .bg-button-default{
    width:100%;
}



.default-button:after{
    content: '';
    width: calc(100% - 2.4rem);
    height: 2px;
    position: absolute;
    bottom: 0;
    left: 2.4rem;
    background: linear-gradient(90deg, rgba(255,255,255,1) 75%, rgba(255,255,255,0) 100%);
    z-index: 5;
}

.default-button:before{
    content: '';
    width: 50%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background: transparent;
    z-index: 5;
    border-left: 2px solid #fff;
    border-bottom: 2px solid #fff;
    border-top: 2px solid #fff;
    border-bottom-left-radius: 40px;
    border-top-left-radius: 40px;
}


.default-button svg{
    width: 5rem;
    height: 5rem;
    position: relative;
    z-index: 4;
}

.default-button span:before{
    content: '';
    z-index: 0;
    bottom: 0;
    width: calc(100% - 2.4rem);
    height: 2px;
    position: absolute;
    top: 0;
    left: 2.4rem;
    background: linear-gradient(90deg, rgba(255,255,255,1) 75%, rgba(255,255,255,0) 100%);
    z-index: 2;
}

.default-button span{
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    color: var(--default-color);
    margin-left: 2rem;
    letter-spacing: 2px;
    z-index: 3;
    font-size: 14px;
}













.default-button-reverse{
    display: flex;
    align-items: center;
    position:relative;
    justify-content: flex-end;
    flex-direction: row;
    border-bottom-left-radius: 3rem;
    border-top-left-radius: 3rem;
    margin-top: 3rem;
}

.bg-button-default-reverse{
    background: linear-gradient(270deg, rgb(77 77 77) 75%, rgba(255,255,255,0) 100%);
    position:absolute;
    right: 1.5rem;
    bottom:0;
    height:100%;
    z-index: 1;
    width:0;
    transition: 0.2s;
    border-bottom-right-radius: 2rem;
    border-top-right-radius: 2rem;
}

.default-button-reverse:hover .bg-button-default-reverse{
    width:100%;
}



.default-button-reverse:after{
    content: '';
    width: calc(100% - 2.4rem);
    height: 2px;
    position: absolute;
    bottom: 0;
    right: 2.4rem;
    z-index: 5;
    background: linear-gradient(270deg, rgba(255,255,255,1) 75%, rgba(255,255,255,0) 100%);
}

.default-button-reverse:before{
    content: '';
    width: 50%;
    height: 100%;
    position: absolute;
    bottom: 0;
    right: 0;
    background: transparent;
    z-index: 5;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    border-top: 2px solid #fff;
    border-bottom-right-radius: 40px;
    border-top-right-radius: 40px;
}


.default-button-reverse svg{
    width: 5rem;
    height: 5rem;
    position: relative;
    z-index: 4;
}

.default-button-reverse span:before{
    content: '';
    z-index: 0;
    bottom: 0;
    width: calc(100% - 2.4rem);
    height: 2px;
    position: absolute;
    top: 0;
    right: 2.4rem;
    background: linear-gradient(270deg, rgba(255,255,255,1) 75%, rgba(255,255,255,0) 100%);
    z-index: 2;
}

.default-button-reverse span{
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    color: var(--default-color);
    margin-right: 2rem;
    letter-spacing: 2px;
    z-index: 3;
    font-size: 14px;
}



.down svg{
    transform: rotate(90deg);
}
































.nextegy-button{
    display: flex;
    align-items: center;
    position:relative;
    justify-content: flex-start;
    flex-direction: row;
    border-bottom-left-radius: 3rem;
    border-top-left-radius: 3rem;
    margin-top: 3rem;
}

.bg-button-nextegy{
    background: linear-gradient(90deg, #53b21b 75%, rgba(255,255,255,0) 100%);
    position:absolute;
    left: 1.5rem;
    bottom:0;
    height:100%;
    z-index: 1;
    width:0;
    transition: 0.2s;
    border-bottom-left-radius: 2rem;
    border-top-left-radius: 2rem;
}

.nextegy-button:hover .bg-button-nextegy{
    width:100%;
}


.nextegy-button:after{
    content: '';
    width: calc(100% - 2.4rem);
    height: 2px;
    position: absolute;
    bottom: 0;
    left: 2.4rem;
    background: linear-gradient(90deg, var(--primary-color-nextegy) 75%, rgba(255,255,255,0) 100%);
    z-index: 5;
}

.nextegy-button:before{
    content: '';
    width: 50%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    background: transparent;
    z-index: 5;
    border-left: 2px solid var(--primary-color-nextegy);
    border-bottom: 2px solid var(--primary-color-nextegy);
    border-top: 2px solid var(--primary-color-nextegy);
    border-bottom-left-radius: 40px;
    border-top-left-radius: 40px;
}


.nextegy-button svg{
    width: 5rem;
    height: 5rem;
    position: relative;
    z-index: 4;
}

.nextegy-button span:before{
    content: '';
    z-index: 0;
    bottom: 0;
    width: calc(100% - 2.4rem);
    height: 2px;
    position: absolute;
    top: 0;
    left: 2.4rem;
    background: linear-gradient(90deg, var(--primary-color-nextegy) 75%, rgba(255,255,255,0) 100%);
    z-index: 2;
}

.nextegy-button span{
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    color: var(--default-color);
    margin-left: 2rem;
    letter-spacing: 2px;
    z-index: 3;
    font-size: 14px;
}










































/*SLIDER*/



.rw-slider{
   position:relative;
}

.cl-slider{
   position:
   relative;
   z-index: 6;
   min-height: 38rem;
}

.title-slide > h1{
   font-family: "Montserrat", sans-serif;
   z-index: 9;
   height: auto;
   width: auto;
   color: rgb(255, 255, 255);
   text-decoration: none;
   min-height: 0px;
   min-width: 0px;
   max-height: none;
   max-width: none;
   text-align: left;
   line-height: 100px;
   letter-spacing: 0px;
   font-weight: 400;
   font-size: 100px;
   transform-origin: 50% 50%;
   opacity: 1;
   transform: translate(0px, 0px);
   visibility: visible;
}




.h1-c {
    color: var(--secondary-color);
    font-size: 5rem;
    font-family: "Montserrat", sans-serif;
    letter-spacing: 0px;
    line-height: 5.5rem;
}


.h1-c > span{
   font-family: "Montserrat", sans-serif;
   font-size: 4rem;
   letter-spacing: 0px;
   text-transform: uppercase;
}


.h1-tab{
   font-family: "Montserrat", sans-serif;
   font-size: 5rem;
   line-height: 5rem;
   color: #898989a3;
   letter-spacing: 0;
}

.h1-tab span{
   opacity:0.5;
   color:var(--default-color);
   cursor:pointer;
}


.h1-tab span.active{
   opacity:1;
}

.button-slide{
   position: relative;
   top: 4rem;
   left: 0;
   opacity: 1;
   visibility: visible;
}

.navigation-slide {
   width: 100px;
   position: relative;
   top: 1rem;
   left: 25rem;
   opacity: 1;
   visibility: visible;
}


.navigation-slide>div:first-child{
   margin-bottom: 1rem;
}
.navigation-slide>div{
   animation-duration:0.5s;
}

.prev-slide{
   animation-delay: 0.5s;
   cursor:pointer;
}

.next-slide{
   cursor:pointer;
   
}

.button-slide>a{
   z-index: 11;
   background: url(../../../media/bottone-bianco@4x.png) center center / contain no-repeat;
   font-family: "Montserrat", sans-serif;
   height: auto;
   width: auto;
   color: rgb(113, 94, 81);
   text-decoration: none;
   white-space: nowrap;
   min-height: 0px;
   min-width: 0px;
   max-height: none;
   max-width: none;
   text-align: left;
   line-height: 16px;
   letter-spacing: 1px;
   font-weight: 400;
   font-size: 16px;
   padding: 30px;
   transform-origin: 50% 50%;
   opacity: 1;
   transform: translate(0px, 0px);
   visibility: visible;
}

.c-ellipse{
   text-align: left;
   width: 53.267%;
   max-width: 56.267%;
   top: -137px;
   left: -68px;
   position: absolute;
   z-index:-1;
}


.c-ellipse-page{
   text-align: left;
   width: 53.267%;
   max-width: 56.267%;
   top: -137px;
   left: -68px;
   position: absolute;
   z-index:-1;
}




.ellipse{
   -webkit-transition: background .3s,border .3s,border-radius .3s,-webkit-box-shadow .3s;
   transition: background .3s,border .3s,border-radius .3s,-webkit-box-shadow .3s;
   -o-transition: background .3s,border .3s,border-radius .3s,box-shadow .3s;
   transition: background .3s,border .3s,border-radius .3s,box-shadow .3s;
   transition: background .3s,border .3s,border-radius .3s,box-shadow .3s,-webkit-box-shadow .3s;
}

.ellipse > img{
   height: auto;
   max-width: 80%;
   border: none;
   border-radius: 0;
   -webkit-box-shadow: none;
   box-shadow: none;
   vertical-align: middle;
   display: inline-block;

}



.shape-text {
   margin: 0;
   display: block;
   text-indent: 60px;
   width:750px;
   animation: reveal 1s forwards;
}

@keyframes reveal {

 
 0% {
   clip-path: inset(0 0 0 100%);
 }

 100% {
   clip-path: inset(0 0 0 0);
 }

}

.shape-text-2 {
   display: block;
   overflow: hidden;
   animation: openclose 1s ease-in-out;
   /*animation-delay: 0.5s;*/
}





@keyframes openclose {
 0% {
   left:5rem;
   width: 0;
 }
 50% {
   left:2.5rem;
   width: 0;
 }
 100% {
   left:0rem;
   width: 750px;
 }
 
}



.slider-composition {
   position: absolute;
   height: 38rem;
   top: 0rem;
   z-index: 5;
}


.first-image {
   height: 100%;
   position: absolute;
   right: -27rem;
   animation-duration:0.5s;
}


.first-image > img{
   height: 100%;

}

.second-image {
   height: 100%;
   position: absolute;
   right: -27rem;
   animation-duration:0.5s;
   animation-delay: 0.5s;
}


.second-image > img{
   height: 100%;

}

.overlay-image {
   height: 100%;
   position: absolute;
   right: -27rem;
   animation-duration:0.5s;
   animation-delay: 0.7s;
}


.overlay-image > img{
   height: 100%;

}



.item-slider{
   display:none;

}

.item-slider.show{
   display: block;

}


.description-slider {
   position: relative;
   top: 5rem;
   animation-duration:0.5s;
   /*animation-delay: 0.7s;*/
}




.description-slider > p {
   color: #fff;
   font-family: "Montserrat", sans-serif;
   height: auto;
   text-decoration: none;
   white-space: normal;
   text-align: left;
   line-height: 24px;
   letter-spacing: 0px;
   font-weight: 200;
   font-style: italic;
   font-size: 18px;
}


.navigation-slider{
   position: relative;
   display: flex;
   z-index: 9;
}

.nav-slider{
   cursor:pointer;
   height: 4px;
   width: 30px;
   background: #fff;
   opacity: 0.5;
   transition: 0.2s;
}

.nav-slider:not(:first-child){
   margin-left: 1rem;
}

.nav-slider.active{
   opacity: 1;
}





.footer-slide{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-end;
}


.titles-slide-p{
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-weight: 300;
    letter-spacing: 2px;
    text-transform: uppercase;
    position: relative;
    width: 100%;
}


.title-slide-p::before{
    content:'';
    width: 7rem;
    height: 2px;
    background: #fff;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    transition:0.2s;
}

.title-slide-p:hover::before{
    
    width: 14rem;
    
}


.title-slide-p{
    visibility:hidden;
    opacity:0;
    display: flex;
    position: absolute;
    align-items: center;
    gap: 1rem;
    transition:0.5s;
    height: 100%;
    font-size: 16px;
    letter-spacing: 3px;
    bottom: 1.5rem;
}


.title-slide-p.active{
    visibility:visible;
    opacity:1;
}


/*.counter-slide{*/
/*    color: #fff;*/
/*    display: flex;*/
/*    flex-direction: row;*/
/*    gap: 10px;*/
/*    font-family: "Montserrat", sans-serif;*/
/*    font-size: 70px;*/
/*    align-items: flex-end;*/
/*    line-height: 70px;*/
/*    left: 0.2rem;*/
/*    position: relative;*/
/*}*/


/*.items-counter{*/
/*    display: flex;*/
/*    position: relative;*/
/*    flex-direction: column;*/
/*    width: 1rem;*/
/*    align-items: flex-end;*/
/*}*/


/*.items-counter span{font-weight: 300;position: absolute;}*/


/*.items-counter span.active{*/
/*}*/

/*.total-counter{*/
/*    font-weight: 100;*/
/*    font-family: "Montserrat", sans-serif;*/
/*    opacity: 0.5;*/
/*}*/




/*.counter, .counter span {*/
/*    position:relative;*/
/*    width: 2rem;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: flex-end;*/
/*    align-items: flex-end;*/
/*    font-weight: 300;*/
/*}*/
/*.counter .next, .counter .count {*/
/*    position:absolute;*/
/*}*/
/*.counter .next {*/
/*    transform:translateY(-12px);*/
/*    left:0;*/
/*}*/


/*.counter .prev, .counter .count {*/
/*    position:absolute;*/
/*}*/
/*.counter .prev {*/
/*    transform:translateY(12px);*/
/*    left:0;*/
/*}*/

.f-slide-nav{
    display: flex;
    align-items: flex-start;
    gap: 0;
    flex-direction: column;
}

.navs-slide{
    gap: 1rem;
    display: flex;
    align-items: center;
    flex-direction: row;
}

.navs-slide span{
    font-family: "Montserrat", sans-serif;
    color: #fff;
    letter-spacing: 0px;
    cursor: pointer;
    font-weight: 300;
    opacity: 0.5;
    transition:0.2s;
    font-size: 40px;
}

.navs-slide span:hover{
    opacity: 1;
}



/*menu*/

.logo-scroll{
   visibility:hidden;
   opacity:0;
   position: absolute;
   transition:0.2s;
   top: 2rem;
   width: 2rem !important;
   height: auto !important;
}

.logo-menu{
   visibility:hidden;
   opacity:0;
   position: absolute;
   transition: 0.2s;
   left: 0;
   top: 0;
}

.logo-fixed{
   visibility:visible;
   opacity:1;
   transition:0.2s;
}

.menu-scroll{
   width:100%;
   background-position: left top;
   border-radius: 0rem 0rem 3rem 3rem;
}



.menu-scroll .logo {
}



.menu-scroll .logo .logo-fixed{
   transform: scale(0.7);
   transform-origin: center;
}


.menu-scroll .logo .logo-scroll{
   visibility:visible;
   opacity:1;
}

.show-menu .container .logo .logo-fixed{
   /* visibility:hidden; */
   /* opacity:0; */
}









.box-menu{
   width: 100%;
   transition:0.5s;
   opacity:1;
}

.box-menu.hide{
   opacity:0;
}

.menu-list{
   list-style: none;
   padding: 0;
   margin: 0;
}

.menu-item{
   cursor: pointer;
   color: var(--secondary-color);
   font-family: "Montserrat", sans-serif;
   text-transform: capitalize;
   font-size: 12px;
   letter-spacing: 3px;
   position: relative;
   font-weight: 500;
   transition: 0.2s padding;
   display: flex;
   align-items: flex-start;
   gap: 0.5rem;
   position: relative;
   padding-top: 0.6rem;
   opacity: 0.5;
}


.menu-item:hover{
   font-weight: 600;
   opacity:1;
}

.menu-item:not(:last-child){
   margin-right: 0.5rem;
}

/*.menu-item:after{*/
/*  content:'';*/
/*  width: 0;*/
/*  height: 2px;*/
/*  position: absolute;*/
/*  bottom: 0;*/
/*  background: currentColor;*/
/*  transition:0.2s;*/
/*  left: 0;*/
/*}*/

.menu-item.active{
   font-weight: 600;
   opacity: 1;
}



/*.menu-item.active:after{*/
/*  width: 100%;*/
/*}*/


/*.menu-item:hover:after{*/
/*  width: 100%;*/
/*}*/


.menu-item.selected{
   font-weight: 600;
   opacity:1;
}



/*.menu-item.selected:after{*/
/*  width: 100%;*/
/*}*/





.sub-menu{
   width: 100%;
   height: 100%;
   position: relative;
   overflow-y: hidden;
}


.sub-menu-list{
   list-style: none;
   padding: 0;
   margin: 0;
   position: absolute;
   top: 0;
   width: 100%;
   transform: translateX(-10%);
   opacity: 0;
   visibility: hidden;
   transition: 0.2s;
}

.sub-menu-list.show{
   opacity: 1;
   transform: translateX(0);
   visibility: visible;
}

.sub-menu-list .menu-item{
   font-family: "Montserrat", sans-serif;
   font-size: 1.5rem;
   line-height: 1.5rem;
   position: relative;
   text-transform: capitalize;
   letter-spacing: 3px;
   padding-bottom: 1rem;
   cursor: pointer;
   color: var(--secondary-color);
}

.sub-menu-list .menu-item:not(:last-child){
   margin-bottom: 1rem;
}

.sub-menu-list .menu-item:after{
  content:'';
  width: 0;
  height: 2px;
  position: absolute;
  bottom: 0;
  background: #00eeff78;
  transition:0.2s;
}

.sub-menu-list .menu-item.active{
   font-weight: 700;
   color:var(--default-color);
}



.sub-menu-list .menu-item.active:after{
  width: 100%;
}


.sub-menu-list .menu-item:hover:after{
  width: 100%;
}


.top-head{
    float: right;
}

.top-head-menu{
    display: flex;
    justify-content: flex-end;
}

.item-top-head{
    color: var(--default-color);
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    font-size: 11px;
    letter-spacing: 2px;
    padding: 0.5rem 3rem;
    position: relative;
    transition:0.2s;
}


.item-top-head:hover{
    color: var(--default-color);
    background:#fff3;
}

.item-top-head.active{
    color: var(--default-color);
    background:#fff3;
}


.item-top-head:not(:last-child):after{
    content:'|';
    position: absolute;
    right: -5px;
}






.item-top-head span {
    position:relative;
    z-index:3;
}

.item-top-head:before {
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 1;
    background-color:#fff;
    transition:0.2s;
}


.item-top-head:hover{
    color: var(--default-color);
}




.item-top-head:hover:before {
    opacity:0.3;
}

.item-top-head.active:before {
    opacity:0.3;
}






.item-menu{
    color: var(--secondary-color);
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: 2px;
    padding: 0 2rem;
    position:relative;
    font-weight: 500;
    transition: 0.2s;
}

.item-menu span {
    position:relative;
    z-index:3;
}

/*.item-menu:after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    top: 0;*/
/*    left: 0;*/
/*    opacity: 0;*/
/*    z-index: 1;*/
/*    background-color:#fff;*/
/*    transition:0.2s;*/
/*}*/


.item-menu:hover{
 color: var(--secondary-color);
}



/*.item-menu:hover:after {*/
/*    opacity:0.3;*/
/*}*/

.item-menu.active:after {
    opacity:0.3;
}

.menu-scroll .navigation-bar .item-menu{color: var(--primary-color);}
.menu-scroll .navigation-bar .menu-item{color: #fff;padding-top: .6rem;}


.dropdown-menu {
    /* background: #ffffff; */
    background: #000;
    border-radius: 0;
    display: block;
    width: fit-content;
    border: none;
    max-height: 0%;
    left: 0;
    border-radius: 1rem;
    top: 2.75rem;
    padding: 0;
    overflow-y: hidden;
    transition: max-height 0.3s ease-out;
}

.dropdown-menu.show {
    max-height: 400px;
    transition: max-height 0.3s ease-in;
}

.dropdown-menu .sub-menu {
    position:relative;
    padding: 0;
}


.dropdown-menu .sub-menu .nav-item{
    margin:0;
}

.dropdown-menu .sub-menu .nav-item .nav-link.cms{
    color: #ffffff90;
    fill: #ffffff90;
    margin: 0;
    border: 0;
    padding: 1rem 1rem 0 1rem;
    transition: 0.1s all;
}



.dropdown-menu .sub-menu .nav-item .nav-link.cms:last-child{
    padding: 0.5rem 1rem;
    font-size:12px;
}

.dropdown-menu .sub-menu .nav-item:last-child .nav-link.cms{
    padding-bottom:1rem;
}

.dropdown-menu .sub-menu .nav-item:first-child .nav-link.cms{
    padding-top:1rem;
}

.dropdown-menu .sub-menu  .nav-item .nav-link.cms:hover{
    color: #fff;
    fill: #fff;
}



/*form*/


.form-footer{
   position:relative;
}

label {
   display: inline-block;
   line-height: 1;
}


.label-newsletter{
   font-family: "Montserrat", sans-serif;
   font-size: 15px;
   font-weight: 600;
   color: var( --default-color );
   letter-spacing: 1px;
   padding-bottom:15px;
}

.input-newsletter{
   color: #FFFFFF6B;
   border-color: #FFFFFF4D;
   border-radius: 30px 0px 0px 30px;
   font-family: "Montserrat", sans-serif;
   font-size: 13px;
   font-weight: 600;
   width: 80%;
   letter-spacing: 1px;
   background-color: var( --third-color );
   min-height: 47px;
   border: 1px solid;
   border-width: 1px 0px 1px 1px;
   padding: 6px 16px;
}

.input-newsletter::placeholder{
   color: #FFFFFF6B;
}
input:focus, input:focus-visible{
   outline: none;
}


.btn-newsletter {
   background-image: url(../img/bottone-traccia-bianco@4x.png);
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
   position: absolute;
   bottom: -1.1rem;
   right: 0;
   color: #fff;
   border:0px;
   padding: 30px;
   font-family: "Montserrat", sans-serif;
}

.btn-newsletter:hover {

   color: #fff;
   border:0px;
   background-image: url(../img/bottone-traccia-bianco@4x.png);
   background-size: contain;
   background-repeat: no-repeat;

}


.small-text{
   font-family: "Montserrat", sans-serif;
   font-size: 11px;
   font-weight: 300;
   line-height: 1em;
   letter-spacing: 0px;
   color: #FFFFFFAD;
   margin-top: 3rem;
   padding-left: 0px;
}

.title-footer{
   font-family: "Montserrat", sans-serif;
   font-size: 16px;
   font-weight: 500;
   letter-spacing: 1px;
   margin-bottom: 2px;
   color: var(--secondary-color);
}


.title-footer-2{
   font-family: "Montserrat", sans-serif;
   font-size: 16px;
   font-weight: 600;
   text-transform:uppercase;
   margin-bottom: 2px;
   /*margin-top:1rem;*/
   color:var(--secondary-color);
}





.description-footer{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 12px;
   font-weight: 600;
   letter-spacing: 0.5px;
}

.description-footer > a{
   color: var(--default-color);
   font-style:none;
}


.social-link.footer > li > a{
   
   color: var(--default-color) !important;
   font-family: "Montserrat", sans-serif;
   font-size: 15px;
   font-weight: 300;
   line-height: 1em;
   letter-spacing: 0px;
   
}

.social-link.footer > li{
  margin:0;
}

.social-link.footer > li:not(:last-child):after{
   content:'//';
   margin:0px 10px;
   color: var(--default-color) !important;
   font-family: "Montserrat", sans-serif;
   font-size: 15px;
}








/*carousel*/


.carousel-section{
   background-image: url(../../../media/sfumatura_bianca.png);
   background-position: center center;
   background-color:#fff;
   background-repeat: no-repeat;
   background-size: cover;
   transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
   margin-top: 0px;
   margin-bottom: -20px;
   z-index: 1;
   position: relative;
   padding: 100px 0px 0px 0px;
}

.blockquote{
   margin: 0px 250px 50px -80px;
   padding: 20px 0px 0px 80px;
   background-image: url(../../../media/virgolette_marroni.png);
   background-position: top left;
   background-repeat: no-repeat;
   background-size: 6% auto;
}

.title-carousel{
   color:var(--third-color);
   font-family: "Montserrat", sans-serif;
   font-size: 45px;
   font-style: italic;
   line-height: 1.1em;
}

.subtitle-carousel{
   color:var(--third-color);
   font-family: "Montserrat", sans-serif;
   font-size: 30px;
   font-weight: 300;
}


.ellipse-right {
   position: absolute;
   width: 400px;
   height: 480px;
   right: 0;
   top: -5rem;
}


.ellipse-right > img{
   width:100%;
}




.bullet-c {
   border-radius: 0;
   background: #ffffff;
   width: 0.75rem;
   margin: 0 0.5rem 0 0 !important;
   height: 0.5rem;
}

.swiper-horizontal>.swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
   bottom: 0rem;
   left: 51.7rem;
   width: 100px;
   text-align: left;
}


.swiper-slide > img{
  width: 100%;
}


.nav-carousel{
   display: flex;
   height: 100%;
   position: relative;
   flex-direction: row;
}


.swiper-button-next, .swiper-button-prev {
   position: relative;
   margin-top: calc(0px - (var(--swiper-navigation-size)/ 2));
   z-index: 10;
   cursor: pointer;
   display: flex;
   height: 100%;
   width: 100%;
   align-items: center;
   color: var(--swiper-navigation-color,var(--swiper-theme-color));
   justify-content: flex-end;
}




.swiper-button-next > img, .swiper-button-prev > img {
   width: 3rem;
   height: auto;
   opacity: 0.5;
   transition:0.2s;
}

.swiper-button-next > img:hover, .swiper-button-prev > img:hover {
   opacity: 1;
}

.swiper-button-prev > img {
    transform: rotate(180deg); 
}

.swiper-button-next {
}

.swiper-button-next > svg, .swiper-button-prev > svg {
   width:100%;
}

.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
   content: '';
}

.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
   content: '';
}



/*banner*/


.banner{
   transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
   z-index: 3;
   position: relative;
   margin-top: 0px;
   margin-bottom: 0px;
   padding: 10px 10px 10px 10px;
   background-color: var( --fourth-color );
   
}


.title-banner{
   text-align: left;
   color: var(--third-color);
   font-family: "Montserrat", sans-serif;
   font-size: 22px;
   font-weight: 600;
   font-style: italic;
   line-height: 1.2em;
   letter-spacing: 1px;
   padding:10px;
}

.descrpition-banner{
   text-align: left;
   color: var(--third-color);
   font-family: "Montserrat", sans-serif;
   font-size: 16px;
   font-weight: 300;
   font-style: italic;
   line-height: 1.1em;
   letter-spacing: 0px;
   padding:10px;
}

.link-banner{
   text-decoration: none;
}

.text-link-banner{
       font-size: 16px;
   font-weight: 600;
   letter-spacing: 2px;
   color: var(--third-color);
   font-family: "Montserrat", sans-serif;
   
}

.icon-link-banner{
   margin-left: 1rem;
}

.icon-link-banner > svg {
   font-size: 70px;
   line-height: 70px;
   height: 70px;
   width: 70px;
}


/*double banner*/

.img-banner-bg{
   background-color: #242424;
   background-position: center center;
   background-repeat: no-repeat;
   background-size: cover;
}

.content-d-banner{
   padding: 50px 50px 50px 50px;
   background: #24242475;
}


.title-double-banner{
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 70px;
   font-weight: 500;
   letter-spacing: 1px;
   margin-bottom: -20px;
}

.description-double-banner{
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 24px;
   font-weight: 200;
   text-transform: uppercase;
   font-style: italic;
   letter-spacing: 3px;
}

.divider{
   width: 100%;
   margin: 0 auto;
   margin-left: 0;
   border-top:1px solid;
   border-color:#ffffff5c;
}

.content-link-banner {
   min-height: 180px;
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.img-banner-bg > a{
   text-decoration:none;
}


.content-link-banner > div > svg {
   width: 100px;
   transition: 0.2s;
}

.img-banner-bg > a:hover .content-link-banner > div > svg{
   transform: translateX(-10px);
}




.banner-project{
   padding: 9rem 15rem;
   padding-left: 35vw;
   padding-bottom: 5rem;
   position: relative;
   background-image:url(/media/paolorossifoundation_img_bg.jpg);
   background-repeat: no-repeat;
   background-size:cover;
   background-position:center;
}


.banner-img {
   width: 30%;
   height: 90%;
   position: absolute;
   top: 0;
   background-size: cover;
   left: 0;
   background-repeat: no-repeat;
   background-position: top;
}


.p-banner {
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 100;
   letter-spacing: 0.5px;
   font-size: 22px;
   line-height: 28px;
   font-style: italic;
   margin-bottom: 1rem;
}

.marks{
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   font-style: italic;
   font-weight: 100;
   position: absolute;
   top: -3rem;
   width: 3rem;
   left: -2rem;
   height: 3rem;
   background-image: url(/media/virgolette.png);
   background-size: 100%;
   background-repeat: no-repeat;
}

/*generic page*/


.page-project .content-page{
   padding-top:5rem;
}

.sec-heading-page{
   margin-top: 0px;
   margin-bottom: 0px;
   padding: 80px 0px 30px 0px;
}

.breadcrumb-page{
   margin-bottom:20px;
   margin-top: 20px;
}

.breadcrumbs{
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   list-style: none;
   margin: 0;
   padding: 0;
   /*margin-left: -10px;*/
}

.breadcrumbs > li > a{
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 12px;
   font-weight: 300;
   letter-spacing: 2px;
   border-radius: 0px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   text-transform: uppercase;
   text-decoration:none;
}

.breadcrumbs > li:not(:last-child):after{
   content: '|';
   margin: 0px 15px;
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 12px;
}


.breadcrumbs > li > a.active{
   color: #fff;
   font-weight: bold;
}


.breadcrumbs > li.black > a{
   color: #3a3a3a78;
}

.breadcrumbs > li.black:not(:last-child):after{
   color: #3a3a3a78;
}


.breadcrumbs > li.black > a.active{
   color:#3a3a3a;
}



.title-page{
   font-family: "Montserrat", sans-serif;
   font-size: 99px;
   font-weight: 300;
   line-height: 1em;
   border-radius: 0px 0px 0px 0px;
   padding: 0px 0px 0px 50px;
   color:#fff;
}

.title-page-2{
   font-family: "Montserrat", sans-serif;
   font-size: 55px;
   font-weight: 300;
   line-height: 1em;
   border-radius: 0px 0px 0px 0px;
   color:#fff;
}



.pre-title-page{
   color: var( --fourth-color );
   font-family: "Montserrat", sans-serif;
   font-size: 16px;
   font-weight: 300;
   text-transform: uppercase;
   font-style: italic;    
}

.sub-title-page{
   color: var( --default-color );
   font-family: "Montserrat", sans-serif;
   font-size: 25px;
   font-weight: 300;
   text-transform: uppercase;
   font-style: italic;
   letter-spacing: 3px;
}

.description-page{
   text-align: left;
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 300;
   font-style: italic;
}

.empty-space-des{
   height: 100px;
   margin-bottom: 20px;
}



.sec-grid-product{

   margin:0 120px;margin-top: 30px;margin-bottom: 6rem;}

.img-grid{
   position:relative;
   cursor:pointer;
   margin-bottom: 20px;
}

.img-grid > img{
   width:100%;
}


.content-grid{
   margin-top: 0.5rem;
}

.pre-title-grid{
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 14px;
   font-weight: 400;
   text-transform: uppercase;
   line-height: 1em;
   letter-spacing: 2px;
   border-radius: 0px 0px 0px 0px;
   padding: 0px 0px 0px 10px;
   margin:0px;
}

.title-grid{
   display: block;
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 38px;
   font-weight: 600;
   font-style: italic;
   border-radius: 0px 0px 0px 0px;
   padding: 0px 0px 0px 5px;
   margin:0px;
}

.t-features {
   color: var( --fourth-color );
   font-family: "Montserrat", sans-serif;
   font-size: 13px;
   font-weight: 400;
   font-style: italic;
   letter-spacing: 1px;
   margin-top: -10px;
   margin: 0;
   padding: 0 0 0 5px;
}

.features{
   list-style: none;
   margin: 0;
   padding: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
   padding: 0 0 0 5px;
}


.features > li .text{
   color: var( --fourth-color );
   font-family: "Montserrat", sans-serif;
   font-size: 12px;
   font-weight: 400;
   text-transform: uppercase;
   font-style: italic;
   letter-spacing: 1px;
}

.features > li .text.white{
   color:#fff;
}

.features > li > span > img{
   width: 14px;
   margin-right: 5px;
}



.features > li:not(:last-child){
   margin-right:5px;
}


.btn-request {
   background-image: url(../img/bottone-bianco-collez@4x.png);
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
   color: #fff;
   margin: 10px 0px;
   border:0px;
   background-color: #FFFFFF00;
   padding: 25px 25px 25px 25px;
   font-size: 14px;
   font-weight: 500;
   letter-spacing: 1px;
   font-family: "Montserrat", sans-serif;
   transition:0.2s;
}

.btn-request:hover, .btn-request:focus, .btn-request:active, .btn-request:focus-visible {

   color: var( --third-color );
   border:0px;
   background-image: url(../img/bottone-bianco-collez-hover@4x.png);
   background-size: contain;
   background-repeat: no-repeat;

}






/*attributes*/

.sec-attributes{
   background-image: url(../../../media/sfumatura_bianca.png);
   background-position: bottom;
   background-color: #fff;
   background-repeat: no-repeat;
   background-size: contain;
   position: relative;
   padding: 100px 0px 100px 0px;
}

.title-attributes{
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 55px;
   font-weight: 600;
   font-style: italic;
   letter-spacing: 0px;
}

.subtitle-attributes{
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 16px;
   font-weight: 300;
   text-transform: uppercase;
   font-style: italic;
   margin-bottom: 0;
   letter-spacing: 1px;
}

.sec-attributes .container .row .col-md-6{
   padding: 10px 10px 10px 50px;
}
.sec-attributes .container .row .col-md-6:first-child{
   padding: 10px 50px 10px 10px;
}


.attribute-img{
   width: 100%;
}

.attribute-name {
   margin-top: 5px;
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 16px;
   font-weight: 600;
   line-height: 20px;
   text-align: left;
   font-style: italic;
   letter-spacing: 0.5px;
   text-transform: lowercase;
}

.posa-name{
    margin-top: 5px;
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 600;
   line-height: 20px;
   font-style: italic;
   letter-spacing: 0.5px;
}


   


.sec-attributes .container .row .col-md-6:first-child{
   border-right:1px solid #B4ADA47A;
}


.item-download {
   border-bottom: 1px solid #B4ADA47A;
   display: flex;
   padding: 30px 0px;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
}

.item-download > svg {
   width: 150px;
   transition:0.2s;
}

.item-download > p {
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 600;
   text-transform: uppercase;
   font-style: italic;
   text-decoration: underline;
   letter-spacing: 1px;
}

.item-download > div > p {
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   margin: 0;
   font-weight: 600;
   text-transform: uppercase;
   font-style: italic;
   text-decoration: underline;
   letter-spacing: 1px;
}



.item-tutorial {
   border-bottom: 1px solid #B4ADA47A;
   display: flex;
   margin: 30px 0px;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
}

.item-tutorial > svg {
   width: 150px;
   transition:0.2s;
}

.item-tutorial > p {
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 600;
   text-transform: uppercase;
   font-style: italic;
   text-decoration: underline;
   letter-spacing: 1px;
}

.item-tutorial > div > p {
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   margin: 0;
   font-weight: 600;
   text-transform: uppercase;
   font-style: italic;
   text-decoration: underline;
   letter-spacing: 1px;
}


a[onclick]{
   
   cursor:pointer;
   
}


.box-downloads > a:hover .item-tutorial > svg {
   transform: skew(-10deg);
}



.box-downloads > a{
   text-decoration:none;
}

.box-downloads > a:hover .item-download > svg{
   transform: skew(-10deg);
}


.popup{
   position: fixed;
   top: 0;
   z-index: 9999;
   width: 100%;
   left: 0;
   background: #020202a3;
   display: flex;
   height: 100%;
   align-content: center;
   justify-content: center;
   align-items: center;
   transition:0.5s;
   opacity:0;
   visibility:hidden;
}

.popup.show{
   opacity:1;
   visibility:visible;
}


/*.video {*/
/*    height: 0;*/
/*    overflow: hidden;*/
/*    padding-bottom: 56.25%;*/
/*    padding-top: 30px;*/
/*    position: relative;*/
/*}*/
/*.video iframe,*/
/*.video object,*/
/*.video embed {*/
/*    height: 100%;*/
/*    left: 0;*/
/*    position: absolute;*/
/*    top: 0;*/
/*    width: 100%;*/
/*}*/
   
   
/*reseller*/

.sec-reseller .container .row .col-md-6:first-child{
   padding: 100px 70px 100px 10px;

}



.input-cms-2{
   background-color: #715E5100;
   border-color: var( --third-color );
   border-width: 0px 0px 1px 0px;
   border-radius: 0px 0px 0px 0px;
   font-family: "Montserrat", sans-serif;
   font-size: 13px;
   font-weight: 600;
   letter-spacing: 1px;
   color: var( --third-color );
   min-height: 47px;
   padding: 6px 16px;
   width:100%;
   margin-bottom: 10px;
}

.input-cms-2::placeholder{
   color: var( --third-color );
}


/*form*/



.form-cms{
   position: relative;
   margin: -160px 0px 0px 0px;
   padding: 60px 50px 60px 50px;
   border-style: solid;
   border-width: 1px 1px 1px 1px;
   border-color: #fff;
   border-radius: 0px 0px 0px 0px;
   box-shadow: 10px -10px 0px 0px rgb(255 255 255 / 16%);
}

.input-cms{
   background-color: #715E5100;
   border-color: #fff;
   border-width: 0px 0px 1px 0px;
   border-radius: 0px 0px 0px 0px;
   font-family: "Montserrat", sans-serif;
   font-size: 13px;
   font-weight: 600;
   letter-spacing: 1px;
   color: #fff;
   min-height: 47px;
   padding: 6px 16px;
   width:100%;
       margin-bottom: 10px;
}

.input-cms::placeholder{
   color: #FFFFFF6B;
}

select.input-cms > option{
   color: var( --secondary-color );
   
}

.label-check{
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 300;
   letter-spacing: 0px;
}

.label-check > a{
   text-decoration: none;
   font-weight: bold;
}

.btn-cms {
   background-image: url(../img/bottone-traccia-marrone@4x.png);
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 15px;
   font-weight: 600;
   border: 0;
   background-color: transparent;
   letter-spacing: 1px;
   border-radius: 0px 0px 0px 0px;
   padding: 30px 30px 30px 30px;
}



/*contact*/

.section-contact{
   margin-bottom: 6rem;
   margin-top: 2rem;
}

.subtitle-contact{
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 22px;
   font-weight: 600;
   font-style: italic;
   text-decoration: underline;
   line-height: 1.2em;
   letter-spacing: 0.6px;
   margin-top: 2px;
   margin-bottom: 20px;
   
}

.info-contact{
       margin-bottom: 50px;
}

.info-address-title{
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 600;
   margin-bottom: 2px;
}

.info-contact-description{
   
   color:#fff;
   font-family: "Montserrat", sans-serif;
   font-size: 15px;
   font-weight: 600;
   letter-spacing: 0.5px;
}


.info-contact-title{
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 600;
   margin-bottom: 2px;
   text-transform:uppercase;
   
}



/*tabs products*/


.tabs-products {
   margin: 5rem 0rem;
}

.tabs-menu {
   display: flex;
   position: relative;
   flex-direction: row;
   justify-content: flex-start;
   align-content: center;
   align-items: center;
   position: absolute;
   width: 100%;
   bottom: 0;
}

.tab-item {
   color: var( --default-color );
   cursor:pointer;
   font-family: "Montserrat", sans-serif;
   padding: 0.5rem 6rem;
   font-size: 2rem;
   font-weight: 100;
   text-transform: uppercase;
   z-index: 5;
   letter-spacing: 2px;
   position: relative;
   background-color: #fff3;
   text-decoration: underline;
   transition:0.3s;
}

.tab-item.active{
   color: var(--secondary-color);
}

.tab-item:before{
   content: '';
   height: 0px;
   width: 100%;
   position: absolute;
   bottom: 0;
   right: 0;
   z-index: -1;
   transition: 0.2s;
}


.tab-item.active:before{
   background:#fff;
   height: 100%;
}


.tab-content{
   padding:2rem 0;
   display:none;
}

.tab-content.show{
   display:flex;
}

.item-content > a > img{
   width:100%;
   margin-bottom:1rem;
}

.item-content-inverse > a > img{
   width:100%;
   margin-top:1rem;
}


.title-item{
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 34px;
   font-weight: 600;
   line-height: 34px;margin:0;
   font-style: italic;
}

.description-item{
   text-align: left;
   color: var( --fourth-color );
   font-family: "Montserrat", sans-serif;
   font-size: 12px;
   font-weight: 600;
   text-transform: uppercase;
   line-height: 1.2em;
   letter-spacing: 1px;
}


.btn-tab-item {
   background-image: url(../img/bottone-traccia-bianco@4x.png);
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
   color: #fff;
   
   border:0px;
   background-color: #FFFFFF00;
   padding: 25px 40px 25px 40px;
   font-size: 14px;
   font-weight: 500;
   letter-spacing: 1px;
   font-family: "Montserrat", sans-serif;
   transition:0.2s;
}


.btn-tab-item:hover {
   color: #fff;
}



/*maps*/

.map-sec {
   margin: 5rem 0rem;
}

.map-col{
   position: absolute;
   right: 0;
}
.map{
   height:670px;
   width:100%;
}


/*pointer*/
.sec-pointer {
   margin: 5rem 0rem;
}

.title-sec-pointer{
   color:#fff;
   font-family: "Montserrat", sans-serif;
   font-size: 55px;
   font-weight: 600;
   font-style: italic;
}

.desc-sec-pointer{
   text-align: left;
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 300;
}


.link-pointer{
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-size: 16px;
   font-weight: 600;
   text-transform: uppercase;
   font-style: italic;
   letter-spacing: 1.5px;    
}


.img-pointer{
   position:relative;
   box-shadow: 10px 10px 0px 0px rgb(113 94 81 / 17%);
}

.img-pointer > img{
   width:100%;
}

.pointer{
   position:absolute;
   width:33px;
   height:33px;
   background-color: var( --third-color );
   color:#fff;
   font-family: "Montserrat", sans-serif;
   font-size: 15px;
   border-radius:50%;
   text-align:center;
   font-weight: 600;
   padding:5px;
       box-shadow: 0px 0px 20px 0px rgb(0 0 0 / 50%);
}
.no-border{
   border:none;
}

.pp-info-sub-title{
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 300;
   font-style: italic;
   letter-spacing: 1px;
   text-decoration:none;
}

.close-popup {
   position: absolute;
   z-index: 999;
   color: #fff;
   top: 1.5rem;
   height: 1.5rem;
   right: 1.5rem;
   width: 1.5rem;
   mix-blend-mode: difference;
   cursor: pointer;
}

.close-popup > svg{
   width:100%;
   height:100%;
}



/*REQUEST*/


.title-request{
   font-family: "Montserrat", sans-serif;
   color: var( --default-color );
   font-size: 55px;
   font-weight: 600;
   font-style: italic;
   letter-spacing: 0px;
}

.subtitle-request{
   text-align: left;
   color: var( --default-color );
   font-family: "Montserrat", sans-serif;
   font-size: 14px;
   font-weight: 400;
   text-transform: uppercase;
   letter-spacing: 1px;
}

.popup_request {
   position: fixed;
   bottom: 0;
   width: 100%;
   height: 100%;
   padding: 50px 0;
   z-index: 99999;
   background-color: #000000ad;
   transition:0.2s;
   opacity:0;
   visibility:hidden;
}

.pop-contain {
   position: fixed;
   bottom: -100%;
   width: 100%;
   transition: 0.5s;
   height: 75vh;
   padding: 50px 0;
   z-index: 999;
   background-color: var( --third-color );
}



.popup_request.show{
   opacity:1;
   visibility:visible;
}

.popup_request.show .pop-contain{
   bottom: 0;
}


.btn-request-form {
   background-image: url(../img/bottone-traccia-bianco@4x.png);
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
   float: right;
   color: var( --default-color );
   font-family: "Montserrat", sans-serif;
   font-size: 15px;
   font-weight: 600;
   border: 0;
   background-color: transparent;
   letter-spacing: 1px;
   border-radius: 0px 0px 0px 0px;
   padding: 30px 30px 30px 30px;
}


.ml-3{
   margin-left:1rem;
}








/*Gallery*/

.gallery-pattern {
   background: #000000ad;
   position: fixed;
   top: 0;
   width: 100%;
   display: flex;
   height: 100%;
   left: 0;
   z-index: 9999;
   align-content: center;
   align-items: center;
   transition:0.5s;
   opacity:0;
   visibility:
   hidden;
   justify-content: center;
}

.gallery-pattern.show{
   opacity:1;
   visibility:visible; 
}


.images-gallery{
   top: 0;
   position: fixed;
   width: 100%;
   z-index: 10;
   height: 100%;
   display: flex;
   flex-direction: row;
   flex-wrap: nowrap;
   align-content: center;
   justify-content: center;
   align-items: center;
}


.box-image-gallery {
   width: 80%;
   top: 0rem;
   display: flex;
   height: 90vh;
   position: relative;
   flex-wrap: nowrap;
   flex-direction: row;
   align-content: center;
   justify-content: center;
}

.item-gallery{
   width: 100%;
   display: none;
   text-align:center;
}

.item-gallery.show{
   display:block;
}

.item-gallery > img{
   height:100%;
   max-width: 100%;
}


/*.box-image-gallery > img{*/
/*    height:100%;*/
/*    max-width: 100%;*/
/*    position: absolute;*/
/*    display:none;*/
/*}*/

/*.box-image-gallery > img.show{*/
/*    display:block;*/
/*}*/

.controls{
   display: flex;
   align-content: center;
   flex-direction: row;
   flex-wrap: nowrap;
   justify-content: space-between;
   position: relative;
   align-items: center;
   width: 100%;
   z-index: 11;
   margin: auto 6rem;
}
.button-c {
   text-align: center;
   display: block;
   width: fit-content;
   transition: 0.5s all;
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   letter-spacing: 3px;
   margin: 0;
   font-weight: 400;
   padding: 1rem;
   font-size: 1rem;
   text-transform: uppercase;
   background-color: #1f1f1f;
   cursor: pointer;
}

.button-c > svg {
   width: 100%;
   height: 100%;

}

.swiper_gallery {
   right: 0;
   margin-right: auto;
   position: relative;
   overflow: hidden;
   list-style: none;
   padding: 0;
   z-index: 1;
}

.swiper-slide-gallery{
   height: 100%;
   width: auto !important;
}


.swiper-slide-gallery > img{
   width:100%;
   height:100%;
}

.close-gallery{
       position: absolute;
   z-index: 999;
   color: #fff;
   top: 1.5rem;
   height: 1.5rem;
   right: 1.5rem;
   width: 1.5rem;
   cursor: pointer;
}

.close-gallery > svg{
   width:100%;
   height:100%;
}


/*LOADER*/


.loaderGif {
   display: flex;
   margin-left: auto;
   margin-right: auto;
   width: 8rem;
   height: auto;
}

#PageLoad{
   background-color: var(--background-color);
   z-index: 9999999999;
   position: fixed;
   display: flex;
   width: 100%;
   top: 0;
   height: 100%;
   align-content: space-between;
   justify-content: space-around;
   align-items: center;
}




.unload{
opacity: 0;
visibility: hidden;
transition: 0.5s linear;
}



/*EFFECTS*/

.item-gallery.animate__animated{
   animation-duration: 0.3s;
   --animate-delay: 0.3s;
}
.item-vertical-slider.animate__animated{
   animation-duration: 0.6s;
   --animate-delay: 0.6s;
}
.input-donation.animate__animated{
   animation-duration: 0.2s;
   --animate-delay: 0.2s;
}
.sel-recurrence.animate__animated{
   animation-duration: 0.2s;
   --animate-delay: 0.2s;
}

.method.animate__animated{
   animation-duration: 0.2s;
   --animate-delay: 0.2s;
}


@-webkit-keyframes fadeOutUpCustom {
   0% {
       opacity: 1;
   }
   to {
       opacity: 0;
       -webkit-transform: translate3d(0, -5%, 0);
       transform: translate3d(0, -5%, 0);
   }
}
@keyframes fadeOutUpCustom {
   0% {
       opacity: 1;
   }
   to {
       opacity: 0;
       -webkit-transform: translate3d(0, -5%, 0);
       transform: translate3d(0, -5%, 0);
   }
}
.item-vertical-slider.animate__fadeOutUp {
   -webkit-animation-name: fadeOutUpCustom;
   animation-name: fadeOutUpCustom;
}




@-webkit-keyframes fadeInUpCustom {
   0% {
       opacity: 0;
       -webkit-transform: translate3d(0, 5%, 0);
       transform: translate3d(0, 5%, 0);
   }
   to {
       opacity: 1;
       -webkit-transform: translateZ(0);
       transform: translateZ(0);
   }
}
@keyframes fadeInUpCustom {
   0% {
       opacity: 0;
       -webkit-transform: translate3d(0, 5%, 0);
       transform: translate3d(0, 5%, 0);
   }
   to {
       opacity: 1;
       -webkit-transform: translateZ(0);
       transform: translateZ(0);
   }
}
.item-vertical-slider.animate__fadeInUp {
   -webkit-animation-name: fadeInUpCustom;
   animation-name: fadeInUpCustom;
}









@-webkit-keyframes slideOutUpCustom {
   0% {
       -webkit-transform: translateZ(0);
       transform: translateZ(0);
   }
   to {
       visibility: hidden;
       -webkit-transform: translate3d(0, -5%, 0);
       transform: translate3d(0, -5%, 0);
   }
}

@keyframes slideOutUpCustom {
   0% {
       -webkit-transform: translateZ(0);
       transform: translateZ(0);
   }
   to {
       visibility: hidden;
       -webkit-transform: translate3d(0, -5%, 0);
       transform: translate3d(0, -5%, 0);
   }
}
.item-vertical-slider.animate__slideOutUp {
   -webkit-animation-name: slideOutUpCustom;
   animation-name: slideOutUpCustom;
}



@-webkit-keyframes slideInUpCustom {
   0% {
       -webkit-transform: translate3d(0, 5%, 0);
       transform: translate3d(0, 5%, 0);
       visibility: visible;
   }
   to {
       -webkit-transform: translateZ(0);
       transform: translateZ(0);
   }
}
@keyframes slideInUpCustom {
   0% {
       -webkit-transform: translate3d(0, 5%, 0);
       transform: translate3d(0, 5%, 0);
       visibility: visible;
   }
   to {
       -webkit-transform: translateZ(0);
       transform: translateZ(0);
   }
}
.item-vertical-slider.animate__slideInUp {
   -webkit-animation-name: slideInUpCustom;
   animation-name: slideInUpCustom;
}




@-webkit-keyframes fadeInDownCustom {
   0% {
       opacity: 0;
       -webkit-transform: translate3d(0, -5%, 0);
       transform: translate3d(0, -5%, 0);
   }
   to {
       opacity: 1;
       -webkit-transform: translateZ(0);
       transform: translateZ(0);
   }
}
@keyframes fadeInDownCustom {
   0% {
       opacity: 0;
       -webkit-transform: translate3d(0, -5%, 0);
       transform: translate3d(0, -5%, 0);
   }
   to {
       opacity: 1;
       -webkit-transform: translateZ(0);
       transform: translateZ(0);
   }
}
.item-vertical-slider.animate__fadeInDown {
   -webkit-animation-name: fadeInDownCustom;
   animation-name: fadeInDownCustom;
}




@-webkit-keyframes fadeOutDownCustom {
   0% {
       opacity: 1;
   }
   to {
       opacity: 0;
       -webkit-transform: translate3d(0, 5%, 0);
       transform: translate3d(0, 5%, 0);
   }
}
@keyframes fadeOutDownCustom {
   0% {
       opacity: 1;
   }
   to {
       opacity: 0;
       -webkit-transform: translate3d(0, 5%, 0);
       transform: translate3d(0, 5%, 0);
   }
}
.item-vertical-slider.animate__fadeOutDown {
   -webkit-animation-name: fadeOutDownCustom;
   animation-name: fadeOutDownCustom;
}






/*ABOUT PAGE*/


.blockquote.white{
   margin: 0;
   padding: 60px 0px 0px 60px;
   background-image: url(../../../media/virgolette@2x.png);
   background-position: top left;
   background-repeat: no-repeat;
   background-size: 30% auto;
}

.title-about{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 35px;
   font-style: italic;
   line-height: 1.1em;
}

.img-100{
   width:100%;
   height:auto;
}

.img-spec{
    width:80%;
    height:auto;
    transition: 0.5s;
    opacity: 0;
    -webkit-transform: translate3d(0,100%,0);
    transform: translate3d(0,100%,0);
}


.img-spec.show{
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.vertical-center{
   display: flex;
   align-items: center;
}


.vertical-bottom{
    align-items: flex-end;
}

.vertical-center .nav-projects{
   margin:0;
}

.sec-grid-about {
   margin: 0 120px;
   margin-top: 30px;
   margin-bottom: 5rem;
}



.p-about{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 300;
   
   font-style: italic;

}

.box-text {
   padding: 3rem 4rem;
   height: 100%;
   display: flex;
   align-items: flex-start;
   flex-direction: column;
   justify-content: center;
   background-color:var(--third-color);
}

.box-text>p{
   font-family: "Montserrat", sans-serif;
   letter-spacing: 1px;
   font-size: 16px;
   font-weight: 100;
   color: var(--primary-color);
}

.t-upper{
    text-transform:uppercase;
}

.link-follow{
    text-transform: uppercase;
    display: grid;
    align-items: center;
    gap: 1rem;
    grid-template-columns: 40% 20%;
}

.link-follow svg{
    width: 1rem;
}

.title-note{
   font-weight: 200;
   font-size: 13px !important;
}

.note{
   font-style: italic;
}

.box-text.inverse-p{
   padding-right:0;
   padding-left: 3rem;
}

.box-image {
   height: 100%;
   width: 100%;
   background-position: center bottom;
   display: flex;
   background-size: cover;
   flex-direction: column;
   justify-content: flex-end;
   align-items: flex-start;
   padding: 6rem 8rem;
}

.signature{
   width: 10rem;
   margin-top: 3rem;
}

.box-image-2 {
   width: auto;
   height: 100%;
   background-position: center;
   background-size: cover;
   display: flex;
   justify-content: center;
   align-items: center;
}



.banner-about{
   margin-top: 5rem;
   background-image: url(../../../media/chisiamo_banner.png);
   background-position: center;
   background-repeat: no-repeat;
   background-size:cover;
   padding: 80px 0px 80px 0px;
}


.donation-banner{
   width: 100%;
   position: absolute;
   display: flex;
   justify-content: center;
   bottom: -2rem;
   padding: 0rem 3rem;
}

.box-donation{
    background-position: center;
    background-repeat: no-repeat;
    background-size:cover;
    width: 100%;
    padding: 4rem;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
}


.box-donation > h3{
   color: var(--default-color);
   text-transform: uppercase;
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
   letter-spacing: 1px;
   font-size: 3.5rem;
}






.donation-banner .box-input-donation{
   width: 100%;
}


.donation-banner .box-input-donation .donation-button-home{
   width: 20rem;
}



b{
   font-weight: bold;
}

.button-contact{
   background: url(../../../media/bottone-bianco@4x.png) center center / contain no-repeat;
   font-family: "Montserrat", sans-serif;
   height: auto;
   width: auto;
   color: rgb(113, 94, 81);
   text-decoration: none;
   white-space: nowrap;
   min-height: 0px;
   min-width: 0px;
   max-height: none;
   max-width: none;
   text-align: left;
   line-height: 16px;
   letter-spacing: 1px;
   font-weight: bold;
   font-size: 16px;
   padding: 35px;
}

.p-about-2 {
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 200;
   font-style: italic;
   margin-bottom: 2.5rem;
}



/*carousel product*/

.carousel-product{
   margin-top: 3rem;
   background-image: url(../../../media/sfumatura_marrone.png);
   background-position: bottom;
   background-repeat: no-repeat;
   background-size: 100%;
   padding: 3rem 0;
}



.pre-title-section{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 24px;
   font-weight: 200;
   font-style: italic;
   letter-spacing: 1px;
}

.title-section{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 70px;
   font-weight: 500;
   letter-spacing: 1px; 
}


.arrow-collection > img{
   width:5rem;
}

.vertical-slider-home{
    position: relative;
}

.vertical-slider-home-multiple{
   position: relative;
}

.item-vertical-slider{
   display:none;
   margin:3rem 0;
   position:absolute;
   top:0;
   padding-right: calc(var(--bs-gutter-x) * .5);
   padding-left: calc(var(--bs-gutter-x) * .5);
}

.item-vertical-slider.show{
   display:block;
}

.item-vertical-slider > a > img{
   width:100%;
   height:auto;
   margin-bottom: 1rem;
}

.box-products-vertical > img{
   width: 110px !important;
}
.box-products-vertical{
   display: flex;
   flex-direction: row;
   justify-content: flex-start;
   align-content: center;
   align-items: flex-start;
   margin-bottom: 1rem;
}


.inverse .item-vertical-slider > a > img{
   width:100%;
   height:auto;
   margin-top: 1rem;
   margin-bottom:0;
}

.box-text-vertical{
   margin-left: 1rem;
}

.box-text-vertical .btn-tab-item {
   background-image: url(../img/bottone-traccia-bianco@4x.png);
   background-size: contain;
   background-position: center;
   background-repeat: no-repeat;
   color: #fff;
   border: 0px;
   background-color: #FFFFFF00;
   padding: 25px 40px 25px 40px;
   font-size: 15px;
   font-weight: 500;
   letter-spacing: 1px;
   font-family: "Montserrat", sans-serif;
   transition: 0.2s;
}



/*video*/

.box-video{
   cursor:pointer;
   position:relative;
   right: 0;
}

.box-video:hover > .overlay-video{
   background-color: #02010100;    
}



.overlay-video {
   mix-blend-mode: normal;
   background-color: #24242436;
   top: 0px;
   height: 100%;
   width: 100%;
   bottom: 0px;
   position: absolute;
   left: 0px;
   right: 0px;
   z-index: 9;
   transition: 0.5s;
   -webkit-mask-image: url(/media/zdv_screen_video_mobile.png);
   mask-image: url(/media/zdv_screen_video_mobile.png);
   -webkit-mask-size: 100%;
   mask-size: 100%;
   -webkit-mask-repeat: no-repeat;
   mask-repeat: no-repeat;
}

.video-player{
   position:relative;
   text-align: right;
}


.video-player > img{
   width: 90%;
}


.play-video{
   position: absolute;
   width: 100%;
   height: 100%;
   z-index: 10;
   top: 0;
   color: #fff;
   display: flex;
   left: 0;
   justify-content: center;
   align-items: center;
}

.play-video > svg {
   width: 4.5rem;
   height: 4.5rem;
}


.sec-video{
   
   margin:5rem 0;
}

.video-frame{
   position:absolute;
   width:100%;
   height:100%;
   z-index:12;
   top:0;
   left:0;
}

.video-frame > iframe{
   width: 100%;
   height: 100%;

}

.video-text{
   margin-top:1.5rem;
}

.video-title{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 24px;
   font-weight: 500;
   font-style: italic;
   line-height: 1.1em;
   letter-spacing: 0px;
   margin-bottom: 0px;
}

.video-p{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 15px;
   font-weight: 300;
   font-style:
   italic;
   line-height: 1.2em;
}


.posa-page{
     background-image: url(../../../media/posa_installazione_2.jpg);
   background-position: center right;
   background-repeat: no-repeat;
   background-size: contain; 
}



.sec-assistance {
   padding: 100px 0px 100px 0px;
   background-image: url(../../../media/antico_mattone_grigio_fumo_preview.jpg);
   background-position: bottom center;
   background-repeat: repeat;
   position: relative;
   background-size: contain;
   transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s;
}

.sec-assistance .container{
   position:relative;
}

.background-overlay{
   background-image: url(../../../media/sfumatura_marrone.png);
   background-position: bottom center;
   background-repeat: repeat;
   background-size: cover;
   opacity: 1;
   position: absolute;
   mix-blend-mode: multiply;
   transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
   width: 100%;
   height: 100%;
   bottom: 0;
   z-index: 0;
}


.tit-banner-posa{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 55px;
   font-weight: 600;
   font-style: italic;
}

.sub-title-banner-posa{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 300;
}

.t-center{
   text-align:center
}



/*warranty*/


.warranty-sec {
   margin: 2rem 0rem;
}





/*accordion*/

.cms-accordion{
   margin-top: 0;
}

.cms-item-accordion{
   margin-bottom: 0;
}

.cms-header-accordion{
   cursor: pointer;
   gap: 2rem;
   color: #ffffff;
   font-family: "Montserrat", sans-serif;
   font-size: 20px;
   letter-spacing: 2px;
   padding-bottom: 0.5rem;
   border-radius: 0px 0px 0px 0px;
   padding: 1rem 0;
   display: grid;
   border-bottom: 2px dotted #ffffff50;
   align-content: center;
   align-items: center;
   text-transform: uppercase;
   cursor:pointer;
   grid-template-columns: auto auto;
   justify-content: space-between;
   line-height: normal;
}


.fake-header-accordion{
      cursor: pointer;
   gap: 2rem;
   color: #ffffff;
   font-family: "Montserrat", sans-serif;
   font-size: 20px;
   letter-spacing: 2px;
   padding-bottom: 0.5rem;
   border-radius: 0px 0px 0px 0px;
   padding: 1rem 0;
   display: grid;
   border-bottom: 2px dotted #ffffff50;
   align-content: center;
   align-items: center;
   text-transform: uppercase;
   cursor:pointer;
   grid-template-columns: auto auto;
   justify-content: space-between;
   line-height: normal; 
}


.cms-header-accordion.form{
    
font-family: "Montserrat", sans-serif;
    
font-weight: 400;
    
font-size: 2rem;
}


.change-accordion {
   width: 3rem;
   height: 3rem;
   padding: 0.6rem 0;
   display: flex;
   cursor: pointer;
   flex-direction: column;
   justify-content: center;
}

.change-accordion > svg{
   stroke: currentColor;
   width: auto;
   stroke-width: 100px;
   height: 1rem;
   fill: transparent;
   transition: 0.2s transform;
}


.change-accordion.default > svg{
   fill: var(--default-color);
}

.change-accordion.open > svg{
   transition:0.2s;
   transform: perspective(none) rotate(-90deg);
}

.change-accordion  > .bar-1{
   width:100%;
   background: var(--secondary-color);
   height: 4px;
}

.change-accordion  > .bar-2{
   width:100%;
   background: var(--secondary-color);
   height: 4px;
   margin-top: -4px;
   transition: 0.1s;
   transform:rotate(90deg);
}

.change-accordion.open > .bar-2{
   transform: rotate(180deg);
}


.cms-body-accordion{
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 400;
   padding: 1rem 0 0 0;
   position: relative;
   overflow-y: scroll;
   overflow-x:hidden;
   transition: 0.35s;
} 


.cms-body-accordion.form{
   padding: 2rem;
}  

.accordion-number-list{
   list-style: auto;
   margin-top: 2rem;
   margin-bottom: 0;
}

.accordion-number-list > li > p{
   margin: 0;
   text-transform: uppercase;
}

.cms-body-accordion.hide {
    height: 0 !important;
    padding-top: 0;
    margin: 0;
}


.cms-body-accordion::-webkit-scrollbar {
   -webkit-appearance: none;
   width: 0px;
   background-color: var(--secondary-color);
   
}



/*privacy*/


.privacy-sec {
   margin: 0;
}


.cms-table {
   border: 1px solid var(--default-color);
   margin: 2rem 0;
}


.cms-table > thead{
   
   background-color: #FFFFFF17;
}



th{
   border: 1px solid var(--default-color);
   padding: 0.5em 0.7em !important;
   letter-spacing: 2px;
   font-size: 18px;
   font-weight: 300;
   font-style:italic;
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
}

td{
   border: 1px solid var(--default-color);
   padding: 0.5em 0.7em !important;
   letter-spacing: 2px;
   font-size: 18px;
   font-weight: 300;
   font-style:italic;
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
}

.cms-table > thead > tr > th{
   
   text-transform: uppercase;
   letter-spacing: 2px;
   vertical-align:top;
   font-size: 18px;
   font-weight: 300;
   font-style:italic;
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
}




/*download*/

.download-sec{
   margin:5rem 0;
   margin-bottom: 8rem;
}

.item-download-2 {
   border-bottom: 1px solid #B4ADA47A;
   display: flex;
   padding: 30px 0px 10px 0;
   flex-direction: row;
   align-items: center;
   justify-content: space-between;
}

.border-bottom{
   border-bottom:1px solid;
}
.arrow-download{
   
   width:50px;
}
.arrow-download > img{
   width:100%;
}

.capitalize{
   text-transform:capitalize;
}



/*systems*/


.sec-white {

   padding: 5rem 0;
   background-color:var(--default-color);
}

.invert-color{
  color: var(--third-color); 
}

.box-text-system{
   padding: 1rem 0;
   padding-bottom: 0;
}

.box-text-system > p{
   color: #242424;
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 200;
   font-style: italic;
}


.box-text-system > h5{
   color: #242424;
   font-weight: 500;
   line-height: 1.2;
   font-style: italic;

}

.box-colors{
   display: flex;
   flex-wrap: wrap;
   flex-direction: row;
   align-content: center;
   align-items: flex-start;
}

.item-colors{
   width: 50px;
   margin-right:1rem;
}

.item-colors > p{
   text-align: left;
   color: var( --third-color );
   margin-top: 4px;
   font-family: "Montserrat", sans-serif;
   font-size: 12px;
   font-weight: 600;
   text-transform: uppercase;
   font-style: italic;
   letter-spacing: 0px;
}

.unit{
   color: #242424;
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   font-weight: 600;
   font-style: italic;
}

.item-catalog {
   display: flex;
   margin: 15px 0px;
   flex-direction: row;
   align-items: center;
   justify-content: flex-start;
}

.item-catalog > svg {
   width: 80px;
   transition: 0.2s;
   margin-left: 3rem;
}


.item-catalog > div > p {
   color: var( --third-color );
   font-family: "Montserrat", sans-serif;
   font-size: 18px;
   margin: 0;
   font-weight: 600;
   text-transform: uppercase;
   font-style: italic;
   text-decoration: underline;
   letter-spacing: 1px;
}

.img-45{
   width:45%;
}

.empty-space-23 {
   height: 23px;
}

.subtitle-system-item{
   font-style: normal !important;
   font-weight: bold !important;
}

.box-text-system > h3{
   font-size:40px !important;
}


.col-md-4 .item-catalog > svg {
   margin-left: 1.5rem;
}


.list-two-columns {
 columns: 2;
 -webkit-columns: 2;
 -moz-columns: 2;
}

.p-list {
   color: var( --default-color );
   font-family: "Montserrat", sans-serif;
   font-size: 15px;
   font-weight: 300;
   font-style: italic;
   letter-spacing: 1px;
   margin-top: 1rem;
   line-height: 30px;
}

.box-text-system > p.white{
   color: var( --default-color );

}

.min-carousel-p {
   min-height: 110vh;
}

.video > video{
   width: 100%;
   height: auto;
}

.img-65{
   width:65%;
}

.p-0-image{
   padding:0!Important;
}
.uppercase{
   text-transform:uppercase !important;
}

.message-box {
   position: absolute;
   top: 0;
   width: 100%;
   height: 100%;
   display: flex;
   background: #f2f0e091;
   left: 0;
   align-content: center;
   justify-content: center;
   align-items: center;
   display:none;
}

.message-box.show{
   display:flex;
}

.message{
   font-size: 22px;
   padding: 60px;
   font-family: "Montserrat", sans-serif;
   text-align: center;
   font-weight: 600;
   letter-spacing: 1px;
   color: var(--primary-color);
}

.message-box.animate__animated{
   animation-duration: 0.6s;
   --animate-delay: 0.6s;
}

.invert-message-b{
       background: #715e519e;
}

.access-bim {
   position: fixed;
   width: 100%;
   height: 100%;
   display: flex;
   background: var(--third-color);
   top: 0;
   left: 0;
   z-index: 9;
   align-content: center;
   align-items: center;
   justify-content: center;
   flex-direction: column;
}

.access-bim.hide{
   display:none;
}

.form_access-bim{
   
}

.top-page-bim{
   z-index: 1020;
   position: relative;
}

.nav-page-bim{
   background-color: var(--secondary-color);
   
}

.nav-button {
   display: flex;
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   text-transform: uppercase;
   font-style: normal;
   letter-spacing: 3px;
   box-shadow: inset 0 0 100px 100px var(--secondary-color);
   font-size: 2rem;
   padding: 10px 8.95rem;
   height: 100%;
   text-decoration: underline;
   line-height: 2rem;
   transition: 0.2s;
   color: var(--default-color);
   align-items: center;
}

.nav-button:hover {
  color: var(--default-color);
}




.button-hero{
   display: flex;
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   text-transform: uppercase;
   font-style: normal;
   letter-spacing: 3px;
   box-shadow: inset 0 0 100px 100px var(--secondary-color);
   font-size: 2rem;
   height: 5rem;
   line-height: 2rem;
   position: absolute;
   text-align: center;
   bottom: -2.5rem;
   width: 20rem;
   text-decoration: underline;
   color: var(--default-color);
   align-items: center;
   justify-content: center;
}

.button-hero:hover {
  color: var(--default-color);
}




.nav-arrow {
   display: flex;
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   text-transform: uppercase;
   font-style: normal;
   letter-spacing: 3px;
   width: 100%;
   height: 100px;
   font-size: 2rem;
   text-decoration: underline;
   line-height: 2rem;
   transition: 0.2s;
   color: var(--default-color);
   align-items: center;
   cursor:pointer;
}

.nav-arrow > svg {
   width: 3rem;
   margin-right: 2rem;
   transition: 0.3s;
}


.nav-arrow:hover {
  color: var(--default-color);
}

.nav-arrow:hover > svg{
   transform: rotate(-45deg);
}


.align-nav-top{
       align-items: flex-end !important;
       height: 90px;
}

.navigation-bar{
   display: flex;
   align-items: flex-start;
   justify-content: flex-start;
}

/*.video-content{*/
/*    position: relative;*/
/*    top: -8.5rem;*/
/*    display: flex;*/
/*    margin-bottom: -14rem;*/
/*    justify-content: flex-end;*/
/*}*/

/*.video-content > video{*/
/*        width: 85vw;*/
/*        -webkit-mask-image: url(/media/zdv_screen_video.png);*/
/*        mask-image: url(/media/zdv_screen_video.png);*/
/*        -webkit-mask-size: 100%;*/
/*        mask-size: 100%;*/
/*        -webkit-mask-repeat: no-repeat;*/
/*        mask-repeat: no-repeat;*/
/*}*/

.video-content .container{
   display: flex;
   flex-direction: row;
   align-items: flex-end;
   justify-content: flex-end;
   padding-bottom: 3rem;
   padding-right: 3.5rem;
}

.scroll-bottom{
   width: 2rem;
}


.project{
   background-image:url('/media/zdv_pattern.jpg');
   background-position: top right;
   background-repeat: repeat-y;
   background-size: 60%;
   padding-top: 10rem;
}

.revolution{
   background-image:url('/media/zdv_partecipa_alla_rivoluzione_banner.png');
   background-position: top center;
   background-repeat: no-repeat;
   background-size: cover;
   padding-top: 14rem;
   padding-bottom: 12rem;
}


.input-donation-home {
   border: 0;
   width: 75%;
   color: var(--primary-color);
   padding: 1rem;
   box-shadow: 0 0 20px 2px #1d1d1d2b;
   -webkit-appearance: none;
   background-image: url(/media/prf_euro.svg);
   background-repeat: no-repeat;
   background-position: 1rem;
   background-size: 20px;
   font-size: 20px;
   position: relative;
   text-align: right;
   z-index: 11;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 1px;
   text-transform: uppercase;
}

.input-donation-home::placeholder{
   color: #00498d9c;
   font-family: "Montserrat", sans-serif;
}

.box-input-donation{
   position:relative;
   width: 85%;
}

.donation-button-home {
   text-align: center;
   width: 9rem;
   position: absolute;
   border: none;
   color: var(--default-color);
   height: 100%;
   font-size: 2rem;
   letter-spacing: 3px;
   text-decoration: underline;
   text-transform: uppercase;
   font-family: "Montserrat", sans-serif;
   line-height: 2rem;
   box-shadow: inset 0 0 100px 100px var(--secondary-color);
   right: 0;
   background-color:var(--default-color);
   top: 0;
   transition:0.2s;
   z-index: 11;
}

/*.donation-button-home:hover {*/
/*   box-shadow: inset 0 0 0px 2px var(--primary-color);*/
/*   background: transparent;*/
/*   transform: translate(-1rem, -1rem);*/
/*}*/

/*.donation-button-home.open {*/
/*    box-shadow: inset 0 0 0px 2px var(--primary-color);*/
/*    background: transparent;*/
/*    transform: translate(-1rem, -1rem);*/
/*}*/

.donation-button-home > svg{
   fill:#fff;
   transition:0.2s;
   width: 3rem;
}

.donation-button-home:hover > svg{
   fill:var(--primary-color);
}
.search-button-home.open > svg{
   fill:var(--primary-color);
}


.sel-donation{
   display: flex;
   flex-direction: row;
   margin-top: 1rem;
}

.item-donation{
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   padding: 5px 20px 2px 20px;
   font-size: 18px;
   margin-right: 1rem;
   letter-spacing:2px;
   cursor: pointer;
   background-color: #0b4076;
}


.news{
   padding: 5rem 0;
   padding-top: 8rem;
}

.h2-b {
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 4rem;
   font-weight:400;
   letter-spacing: 4px;
   text-transform: uppercase;
   opacity:0.6;
}


.h2-c {
    font-family: "Montserrat", sans-serif;
    font-size: 3.5rem;
    line-height: 3.5rem;
    color: #fff;
    letter-spacing: 0;
    margin-bottom: 2rem;
}


.h3-c {
    font-family: "Montserrat", sans-serif;
    font-size: 2rem;
    line-height: 2rem;
    color: var(--default-color);
    letter-spacing: 0;
}


.h5-c {
    font-family: "Montserrat", sans-serif;
    color: var(--primary-color);
    letter-spacing: 1px;
    font-size: 18px;
    margin-top:2rem;
}



.h3-c.page {
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
   font-size: 5rem;
   line-height: 4.5rem;
   letter-spacing: 1px;
   text-transform: uppercase;
}




.h4-c{
   color: var(--primary-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 600;
   font-size: 18px;
   letter-spacing: 1px;
   text-transform: uppercase;
}

.sub-text{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   letter-spacing: 1px;
   font-size: 16px;
   font-style: italic;
   font-weight: 100;
}

.news-box {
   padding: 2rem;
   position: relative;
   padding-bottom: 3rem;
   box-shadow: inset 0 0 200px 200px var(--secondary-color);
   border: 0;
   transition:0.3s;
}

.news-box:hover {
   box-shadow: inset 0 0 0px 9px var(--secondary-color);
   background: #fff;
}

.date {
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   font-size: 18px;
   text-transform: uppercase;
   color: var(--primary-color);
   letter-spacing: 2px;
}

.title-news{
  font-family: "Montserrat", sans-serif;
  font-weight: 500;
  font-size: 2.5rem;
  text-transform: uppercase;
  color: var(--primary-color);
  letter-spacing: 1px;
  line-height: 2.5rem;
}


.description-news{
   font-family: "Montserrat", sans-serif;
   color: var(--primary-color);
   font-size: 1.5rem;
}


.img-news {
   width: 3rem;
   position: absolute;
   bottom: -.7rem;
   left: 2rem;
   transition: 0.2s;
}

.news-box:hover .img-news{
   left: 20rem;
}

/*.footer {*/
/*    display: flex;*/
/*    background-color: var(--primary-color);*/
/*    flex-direction: row;*/
/*    align-items: flex-start;*/
/*    flex-wrap: nowrap;*/
/*    padding-top: 2rem;*/
/*    align-content: flex-end;*/
/*}*/

/*.footer > div:not(:last-child){*/
/*    border: none;*/
/*}*/

/*.footer > div:first-child {*/
/*    display: flex;*/
/*    flex-direction: row;*/
/*    align-items: flex-start;*/
/*    padding: 0;*/
/*}*/





.footer > div > .col-50 {
   padding: 4rem;
   padding-top: 4.5rem;
   padding-bottom: 0;
   display: flex;
   flex-direction: column;
   justify-content: space-between;
}

.footer > div > .col-50:first-child {
display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: flex-start;
}

.footer > div > .col-md-20:first-child {
   border-right: none;
}

/*.footer > div:last-child {*/
/*    padding-bottom: 0;*/
/*    padding-right: 8rem;*/
/*}*/

/*.footer > div{*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: space-between;*/
/*}*/

/*.footer > div {*/
/*    padding: 4rem;*/
/*    padding-top: 4.5rem;*/
/*}*/

.logo-footer{
   width: 100%;
   display: block;
   padding: 2rem 0;
   padding-left: 8rem;
   border-bottom: 1px solid #ffffff50;
}


.col-md-25{
   width: 100%;
}

.col-md-20{
   width: 75%;
}

.col-md-55{
   width:55%;
}
.col-md-45{
   width:45%;
}

.links .h3-c{
   margin-bottom: 2rem;
}


.links-footer {
   list-style: none;
   padding: 0;
   margin-top: 1rem;
   margin-bottom: 2rem;
}

.links-footer > li {
   margin-bottom: 0.5rem;
}

.links-footer > li > a {
   font-size: 14px;
   font-weight: 200;
   color: var(--secondary-color);
   font-family: "Montserrat", sans-serif;
   letter-spacing: 1px;
}

.links-footer > li > span {
   font-size: 11px;
   font-weight: 200;
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   letter-spacing: 1px;
}



.links-footer > li > p {
    font-size: 14px;
    color: var(--secondary-color);
    font-family: "Montserrat", sans-serif;
    letter-spacing: 1px;
    margin: 0;
    font-weight: 200;
}

.links-footer > li > p > a{
    font-size: 11px;
   font-weight: 200;
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   letter-spacing: 1px;
   text-transform: initial;
}

.copyright{position: absolute;bottom: 1rem;width: fit-content;left: 8rem;}

.copyright > p{
   font-family: "Montserrat", sans-serif;
   font-size: 10px;
   color: #ffffffd6;
   font-weight: 100;
   margin: 0;
   text-transform: uppercase;
   letter-spacing: 3px;
}

.input-c {
    font-family: "Montserrat", sans-serif;
    color: #ffffff;
    border: none;
    background: transparent;
    border: 1px solid #ffffff4f;
    border-radius: 5px !important;
    width: 100%;
    line-height: 1rem;
    padding-bottom: .5rem;
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 1rem;
    margin-bottom:2rem;
}

.input-c::placeholder{
   color: #ffffff6b;
}


.input-c.assistance{
   padding:0 1rem;
   padding-bottom: 1rem;
}

.input-c.assistance::placeholder{
   color: #fff;
}



.input-c.error {
       border-color: red;
       color:red;
}

.input-c.error option{
       color:red;
}

.input-c.error::placeholder{
   color: red;
}


select:invalid,
select option[value=""] {
  color: #000;
}


.choice-sel {
   display: grid;
   flex-direction: row;
   align-items: start;
   margin-top: 0;
   gap: 1rem;
   grid-template-columns: 1.5rem auto;
   margin-top: 0;
   gap: 1rem;
}


.checkbox-c[type=checkbox] {
   background: transparent;
   appearance: none;
   color: #ffffff;
   border-radius: 5px !important;!i;!;
   height: 1.5rem;
   border: 2px solid currentColor;
   width: 1.5rem;
   cursor: pointer;
   transition: 0.2s;
}

.checkbox-c:checked[type=checkbox] {
   background-size: 15px 15px;
   background-position: center;
   background-repeat: no-repeat;
   box-shadow: inset 0 0 0px 4px #141414;
   background: #fff;
}

.label-check {
   font-family: "Montserrat", sans-serif;
   color: #ffffff;
   letter-spacing: 2px;
   line-height: 24px;
   font-size: 18px;
}


.button-footer{
   width: 90px;
   border: none;
   height: 72px;
   padding: 1rem 1.5rem;
   box-shadow: inset 0 0 100px 100px var(--primary-color);
   background-color:var(--default-color);
   transition:0.2s;
}

.button-footer:hover {
  box-shadow: inset 0 0 0px 2px var(--primary-color);
}
.button-footer > svg{
   fill:var(--default-color);
}
.button-footer:hover > svg{
   fill:var(--primary-color);
}

.col-button-form{
   margin-top: 2rem;
   text-align: left;
   position: relative;
}

.col-button-form > .nav-arrow{
   border: none;
   background: transparent;
   height: 70px;
   
}


.banner{
   display: flex;
   padding:2rem 0;
   background-image: url(/media/zdv_pattern_rosso.jpg);
   background-position: center;
   background-repeat: repeat-x;
   background-size: 40%;
   position:relative;
   flex-direction: row;
   align-items: center;
   cursor:pointer;
}



.text-banner{
   
}

.pre-title{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 3px;
    font-size: 14px;
    margin: 0;
    font-weight: 100;
    margin-bottom: 1rem;
    text-transform: uppercase;
}

.banner-title{
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   margin: 0;
   font-size: 3rem;
   letter-spacing: 2px;
}

.banner-title > span{
   font-family: "Montserrat", sans-serif;
   letter-spacing: 2px;
}

.row-end{
   justify-content: flex-end;
   align-items: center;
}

.row-center{
   align-items: center;
}

.arrow-banner{
   width: 3rem;
}

.banner-logo{
   position: absolute;
   width: 7rem;
   left: 6rem;
}


.filter{
   padding: 6.5rem 0;
   padding-bottom: 5rem;
}



.hero-page{
   position: relative;
   display: flex;
   padding-top: 5.5rem;
   padding-bottom: 3rem;
   margin-bottom: 0;
   top: 0;
   background-position: bottom center;
   flex-direction: column;
   justify-content: flex-end;
   background-size: 100%;
   background-repeat: no-repeat;
}

.content-page {
   padding: 10rem 0 5rem 0;
   position:relative;
   margin-top: -6rem;
}



.first-content{
    padding-top: 10rem;
}

.p-content{
   font-family: "Montserrat", sans-serif;
   color: #fff;
   letter-spacing: 1px;
   font-size: 18px;
   margin: 0;
   font-weight: 300;
   margin-bottom: 1rem;
}
.p-content >a {
   color: var(--primary-color);
   text-decoration: none;
}



.data-news{
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   letter-spacing: 1px;
   font-size: 14px;
   margin: 0;
   font-weight: 100;
   margin-bottom: 0;
}





.breadcrumb > p{
   font-family: "Montserrat", sans-serif;
   color: var(--primary-color);
   font-size: 20px;
   font-weight: lighter;
   margin: 0;
   text-transform: uppercase;
   letter-spacing: 1px;
}

.breadcrumb > img{
   width: 20px;
   margin-right: 1rem;
}


.hero-restaurant{
   position: relative;
   display: flex;
   padding-top: 17.5rem;
   top: -8.5rem;
   padding-bottom: 4rem;
   z-index: 9;
   margin-bottom: -14rem;
   background-image:url(/media/zdv_dett_proffessionista_hero.png);
   flex-direction: column;
   justify-content: flex-end;
   background-size: 100%;
   background-position: 0px -2.5vw;
   background-repeat: no-repeat;
}

.go-back{
}

.go-back > img{
   width: 3rem;
   transform: rotate(180deg);
   margin-bottom: 3rem;
}

.primary-img {
   width: 30%;
   height: calc(100% - 5rem);
   position: absolute;
   bottom: 0;
   background-size: cover;
   right: 0;
   background-repeat: no-repeat;
   background-position: center;
}

.primary-img > img{
   width:100%;
}

.professionist{
   padding: 3rem 0 10rem 0;
}

.box-professionist{
   background-color: var(--secondary-color);
   padding: 3rem;
   display: flex;
   flex-direction: row;
   align-items: flex-start;
   flex-wrap: nowrap;
   padding-right:10rem;
}

.img-professionist{
   width: 350px;
   height:auto;
}

.description-professionist {
   margin-left: 7rem;
}

.title-prof{
   color:var(--primary-color);
   font-family: "Montserrat", sans-serif;
   font-size: 7rem;
   letter-spacing: 3px;
   text-transform: uppercase;
}

.description-professionist > p{
   font-family: "Montserrat", sans-serif;
   color: var(--primary-color);
   font-size:20px;
   margin-bottom: 0rem;
   font-style: normal; 
}

/*.desc-prof{*/
/*    font-family: "Montserrat", sans-serif;*/
/*    color: var(--primary-color);*/
/*    font-size:20px;*/
/*    margin-bottom: 0rem;*/
/*    font-style: normal;*/
/*}*/

.description-professionist .cms-item-accordion .cms-body-accordion .row > p{
   font-family: "Montserrat", sans-serif;
   color: var(--primary-color);
   font-size:20px;
   margin-bottom: 0rem;
   font-style: normal; 
}

.address{
   font-family: "Montserrat", sans-serif;
   color: var(--primary-color);
}

.info{
  font-family: "Montserrat", sans-serif;
  color: var(--primary-color);
  margin-bottom:0.5rem;
}

.info-box{
   
}


.info-box>div:first-child{
   border-right: 3px dotted var(--primary-color);
   padding-right: 4rem;
}

.info-box>div:last-child{
   padding-left: 5rem;
}

.relative{
   position:relative;
}

.index-10{
   z-index:10;
}

.no-x-scroll{
    overflow-x:hidden;
}

.no-x-scroll-desktop{
    overflow-x:hidden;
}

.play-button {
   position: fixed;
   bottom: 0;
   z-index: 100;
   text-align: center;
   width: 100%;
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   text-transform: uppercase;
   font-style: normal;
   letter-spacing: 3px;
   box-shadow: inset 0 0 100px 100px var(--primary-color);
   font-size: 1.5rem;
   line-height: 1.5rem;
   padding: 25px;
   transition: 0.2s all;
   color: var(--default-color);
   align-content: center;
   flex-direction: row;
   align-items: center;
   visibility:visible;
   opacity:1;
}

.none{
   visibility:hidden;
   opacity:0;
}



.professionist {
   padding: 3rem 0 4rem 0;
   z-index: 10;
   position: relative;
}

.play-button > i{margin-right: 0.5rem;}


.play-button:hover {
  color: var(--primary-color);
  box-shadow: inset 0 0 0px 2px var(--primary-color);
}

.audio {
   height: 3rem;
   width: 3rem;
   display: flex;
   flex-direction: row;
   justify-content: center;
   align-items: center;
   cursor:pointer;
   /*border:2px solid var(--primary-color);*/
   /*box-shadow: inset 0 0 0px 0px var(--primary-color);*/
   margin-left:1rem;
   transition:0.2s;
}


/*.audio:hover {*/
/*    box-shadow: inset 0 0 25px 25px var(--primary-color);*/
/*}*/


.audio > i {
   font-size: 2rem;
   color: var(--primary-color);
   transition:0.2s;
}

/*.audio:hover > i {*/
/*    color: var(--default-color);*/
/*}*/


.right-menu {
   display: flex;
   height: 100%;
   align-items: center;
   flex-direction: column;
}


.box-filter{
   background-size: cover;
   background-position: center;
   min-height: 25rem;
   display: flex;
   position: relative;
   z-index: 8;
   margin-bottom: 2rem;
   flex-direction: column;
   justify-content: flex-end;
}





.content-box{
   padding: 3rem 2rem;
   padding-top: 1rem;
   display: flex;
   background-color: #f1eddf;
}

.content-box > p{
   margin:0;
   position:relative;
   font-size: 3.5rem;
   line-height: 3rem;
}

.content-box {
   position:relative;
}

.content-box:before {
   content:'';
   width:100%;
   position: absolute;
   height: 2.5rem;
   left: 0;
   top: -1.54rem;
   background-image:url(/media/zdv_professionisti_strappo.png);
   z-index: 11;
   background-size: 100%;
   background-repeat: no-repeat;
}

.content-box > p:after{
   content:'';
   width: 0;
   height:3px;
   /*border-bottom:3px dotted var(--primary-color);*/
   background:var(--primary-color);
   position: absolute;
   transition:0.2s;
   bottom: -.5rem;
   left: 0;
}

.box-filter:hover .content-box > p:after{
   width:100%;
}





.float-right-col{
   justify-content: flex-end;
   display: flex;
}


.reseaching{
   position:absolute;
   max-height: 177px;
   width: 100%;
   margin-top: 0rem;
   z-index: 10;
   overflow-y: scroll;
}

.item-search{
   width: 100%;
   display: flex;
   background: #fff;
   padding: 1rem 1.5rem;
   font-weight: bold;
   border-bottom: 1px solid #d7d7d76e;
   cursor: pointer;
   justify-content: flex-start;
   align-items: center;
}

.item-search > svg{
   width: 15px;
   height: 15px;
   margin-right: 0.5rem;
}

.item-search > p{
  margin:0;
  font-size: 25px;
  color:var(--primary-color);
 font-family: "Montserrat", sans-serif;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-weight: lighter;
}

.breadcrumb{
   cursor: pointer;
}









/*Loader search*/


.img-loading-search {
   display: flex;
   margin-left: auto;
   margin-right: auto;
   width: 13rem;
   height: 13rem;
}

.loader-search{
   background-color: #ffffff82;
   z-index: 9;
   position: absolute;
   display: flex;
   width: 100%;
   top: 0;
   left:0;
   height: 100%;
   align-content: space-between;
   justify-content: space-around;
   align-items: center;
   opacity: 0;
   visibility: hidden;
   transition: 0.5s linear;
}


.loader-search.show{
  opacity: 1;
   visibility: visible; 
}



.loader {
 position: relative;
 width: 125px;
 height: 125px;
}

.loader:before , .loader:after{
 content: '';
 border-radius: 50%;
 position: absolute;
 inset: 0;
}
.loader:after {
 animation: rotate 2s linear infinite;
 border: 4px dotted #364b99;
}

::after {}

@keyframes rotate {
 0% {  transform: rotate(0)}
 100% { transform: rotate(360deg)}
}





.box-reseach-page{
   position:relative;
   margin-top:2rem;
   width: 80%;
}

.search-button-page {
   text-align: right;
   width: 90px;
   position: absolute;
   border: none;
   height: 100%;
   padding: 1rem 1.5rem;
   box-shadow: inset 0 0 100px 25px var(--primary-color);
   right: -1rem;
   background-color:var(--default-color);
   top: 1rem;
   transition: 0.1s;
   z-index: 11;
}

.search-button-page:hover {
  box-shadow: inset 0 0 0px 2px var(--primary-color);
  background: transparent;
  transform: translate(-1rem, -1rem);
}

.search-button-page.open {
   box-shadow: inset 0 0 0px 2px var(--primary-color);
   background: transparent;
   transform: translate(-1rem, -1rem);
}

.search-button-page > svg{
   fill:#fff;
   transition: 0.2s;
   width: 3rem;
}

.search-button-page:hover > svg{
   fill:var(--primary-color);
}
.search-button-page.open > svg{
   fill:var(--primary-color);
}


.input-search-page {
   font-family: "Montserrat", sans-serif;
   border: 0;
   width: 100%;
   color:var(--primary-color);
   padding: 1.5rem 3rem;
   box-shadow: 0 0 20px 2px #1d1d1d2b;
   background-image: url(/media/icon_search_grey.svg);
   background-repeat: no-repeat;
   background-size: 15px 15px;
   background-position: 1.5rem;
   font-size: 25px;
   position: relative;
   z-index: 11;
   letter-spacing: 1px;
   text-transform: uppercase;
}



.input-search-page::placeholder{
   color: #1d1d1d66;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 1px;
   text-transform: uppercase;
   font-size: 25px;
}


.no-result > span{
   font-family: "Montserrat", sans-serif;
   font-size: 9rem;
   letter-spacing: 3px;
   color:var(--secondary-color);
   text-transform: uppercase;
   line-height: 7rem;
}


.box-green{
   padding: 3rem 4rem;
   height: 100%;
   display: flex;
   align-items: center;
   flex-direction: column;
   justify-content: center;
   background-color: var(--secondary-color);
}

.box-blue{
   padding: 3rem 4rem;
   height: 100%;
   display: flex;
   align-items: center;
   flex-direction: column;
   justify-content: center;
   background-color: var(--primary-color);
}

.box-blue > p{
   margin: 0;
   font-family: "Montserrat", sans-serif;
   font-weight: 100;
   text-transform: uppercase;
   color: var(--default-color);
   font-size: 1.5rem;
   text-align: center;
   line-height: 2rem;
   letter-spacing: 1px;
}


.box-blue > p.sub-circle{
   margin: 0;
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
   text-transform: uppercase;
   color: var(--default-color);
   font-size: 2rem;
   text-align: center;
   line-height: 2rem;
   letter-spacing: 1px;
}


.sub-circle{
   margin: 0;
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
   text-transform: uppercase;
   color: var(--default-color);
   font-size: 2rem;
   text-align: center;
   line-height: 2rem;
   letter-spacing: 1px;
}



.grid-arms{
   display: flex;
   margin: 2rem 0;
   padding: 0 2rem;
   justify-items: stretch;
   width: 100%;
   height: 100%;
   flex-wrap: wrap;
   justify-content: space-evenly;
}

.item-arm{
   width: 20%;
   height: 20%;
   opacity: 0.5;
   position: relative;
}

.item-arm > img{
   width: 100%;
   height: 100%;
}


/*PROGRESS*/
.circle-wrap{
   width: 15rem;
   height: 15rem;
   display: flex;
   align-content: center;
   justify-content: center;
   align-items: center;
   border-radius: 50%;
   border: 2px solid #ffffff75;
   position:relative;
   background-size: 0;
   margin-bottom: 2rem;
}


.circle-wrap:after{
   content:'';
   width: calc(100% - 0.25rem);
   position: absolute;
   height: calc(100% - 0.25rem);
   border-radius: 50%;
   background-color: var(--secondary-color);
}

.text-circle{
   font-family: "Montserrat", sans-serif;
   color:var(--default-color);
   margin: 0;
   font-size: 6rem;
   z-index: 1;
   padding-top: 1.5rem;
   font-weight: bold;
}

.circle-wrap .progress{
   position: absolute;
   width: 15.25rem;
   height: 15.25rem;
   border-radius: 50%;
   background: conic-gradient(#fff 0deg, #fff0 0deg);
   transition: 0.2s all;
}





.box-white{
    width: 100%;
    height: auto;
    padding: 4rem;
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    background-color: var(--third-color);
}


.box-white > h3{
   text-transform: uppercase;
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
   letter-spacing: 1px;
   font-size: 4rem;
   line-height: 3.5rem;
}

.green{
   color: var(--secondary-color);
}

.blue{
   color: var(--primary-color);
}

.silver{
   color: #7e7679;
}


.gold{
   color: #827653;
}

.platinum{
   color: #8c9091;
}



.green:hover{
   color: var(--secondary-color);
}

.blue:hover{
   color: var(--primary-color);
}

.white:hover{
   color: var(--default-color);
}

.box-white > p{
   font-family: "Montserrat", sans-serif;
   font-weight: 100;
   color: #000;
   letter-spacing: 0.5px;
   font-size: 18px;
   margin: 0;
   font-style: italic;
}

/*NEWS*/



.content-news {
   background-color: var(--primary-color);
   padding:5rem 0;
}



.content > img, .content > figure > img{
   width:100%;
   height:auto;
}


.data {
   font-family: "Montserrat", sans-serif;
   color: var(--primary-color);
   font-size: 2rem;
   letter-spacing: 1px;
}



/*.grid-news {*/
/*    background-color: var(--secondary-color);*/
/*    padding: 6rem 0;*/
/*    margin-top: 0rem;*/
/*    color: var(--primary-color);*/
/*    font-family: "Montserrat", sans-serif;*/
/*}*/

.news-box-page {
   padding: 2rem;
   position: relative;
   padding-bottom: 3rem;
       margin-bottom: 2rem;
   box-shadow: inset 0 0 200px 200px #ffffff;
   border: 0;
   transition: 0.3s;
}

.news-box-page:hover {
   box-shadow: inset 0 0 0px 9px #ffffff;
   background: var(--secondary-color);
}


.hero-page-news{
   background-image:none !important;
   background-color: var(--secondary-color) !important;
}







/*projects*/

.projects{
   background-image:url(/media/paolorossifoundation_img_agenda.jpg);
   padding: 3rem;
   padding-right:0;
   background-position: center;
   background-size: cover;
}


.other-nws{
   background-image:url(/media/paolorossifoundation_img_agenda_2.jpg);
   padding: 3rem;
   padding-right:0;
   background-position: center;
   background-size: cover;   
}

.nav-projects{
    gap: 1rem;
    display: flex;
    flex-direction: row;
}



.swiper-news {
   position: relative;
   overflow: hidden;
   list-style: none;
   margin-top: 3vh;
   z-index: 1;
   margin-right: -15rem;
}


.swiper-slide.slide-news{
  height: min-content;
}

/*.detail-news{*/
/*    background-image:url('/media/card_news.svg');*/
/*    height: 100%;*/
/*    background-size: contain;*/
/*    background-repeat: no-repeat;*/
/*    padding: 5rem;*/
/*    background-position: center;*/
/*    position: relative;*/
/*    gap: 1rem;*/
/*    display: flex;*/
/*    min-height: 445px;*/
/*    flex-direction: column;*/
/*    justify-content: flex-start;*/
/*}*/


.title-det-news{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 0px;
    font-size: 24px;
    font-weight: 400;
    line-height: 28px;
    margin: 0;
}


.link-det-news{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    position: absolute;
    bottom: 1px;
    width: calc(100% - 4.6rem);
    left: 2.8rem;
    padding: 1rem;
    color: var(--default-color);
    padding-left: 2.5rem;
    transition:0.2s;
}



.link-det-news:hover{
    color: var(--secondary-background-color);
    background-position: left bottom;
    
}

.link-det-news span{
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    color: currentColor;
    margin-left: 2rem;
    letter-spacing: 2px;
    font-size: 14px;
}

.link-det-news svg{
    width: 2rem;
    height: 2rem;
}













.swiper-works {
   position: relative;
   overflow: hidden;
   list-style: none;
   margin-top: 0;
   z-index: 1;
   margin-right: 0;
}


.swiper-slide.slide-works{
  height: min-content;
}

.detail-works{
    background-image: url('/media/card_lavora_con_noi.svg');
    height: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    padding: 6rem 4rem 3rem 4rem;
    background-position: center;
    position: relative;
    gap: 1rem;
    display: flex;
    min-height: 390px;
    flex-direction: column;
    justify-content: flex-start;
}

.detail-works .p-content{
    margin:0;
    text-transform: uppercase;
}


.title-det-works{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 24px;
    font-weight: 400;
}


.link-det-works{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    position: absolute;
    bottom: 5px;
    width: calc(100% - 1.4rem);
    cursor: pointer;
    left: 1.2rem;
    padding: 1.2rem;
    color: var(--default-color);
    padding-left: 2.5rem;
    background: linear-gradient(to right, var(--default-color) 50%, #b2b7c300 50%);
    background-size: 200% 100%;
    background-position: right bottom;
    transition:0.2s;
}



.link-det-works:hover{
    color: var(--secondary-background-color);
    background-position: left bottom;
    
}

.link-det-works span{
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    color: currentColor;
    margin-left: 2rem;
    letter-spacing: 2px;
    font-size: 14px;
}

.link-det-works svg{
    width: 2rem;
    height: 2rem;
}



.application-works{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    position: absolute;
    bottom: 2.45rem;
    cursor: pointer;
    width: calc(100% - 1.4rem);
    left: 1.2rem;
    padding: 1.15rem;
    color: var(--default-color);
    padding-left: 2.5rem;
    background: linear-gradient(to right, var(--default-color) 50%, #b2b7c300 50%);
    background-size: 200% 100%;
    background-position: right bottom;
    transition:0.2s;
}



.application-works:hover{
    color: var(--secondary-background-color);
    background-position: left bottom;
    
}

.application-works span{
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    color: currentColor;
    margin-left: 2rem;
    letter-spacing: 2px;
    font-size: 14px;
}

.application-works svg{
    width: 2rem;
    height: 2rem;
}










.swiper-cases {
   position: relative;
   overflow: hidden;
   list-style: none;
   margin-top: 3vh;
   z-index: 1;
   margin-right: -40rem;
   margin-bottom: 5rem;
}


.swiper-slide.slide-cases{
  height: min-content;
}

.detail-cases{
    height: 100%;
    padding: 0.95rem 2.7rem 5rem 1.75rem;
    position: relative;
    gap: 1rem;
    display: flex;
    min-height: 445px;
    text-transform: uppercase;
    flex-direction: column;
    justify-content: flex-start;
    position:relative;
    cursor:pointer;
}




.title-det-cases{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 16px;
    font-weight: 400;
}


.link-det-cases{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: row;
    position: absolute;
    bottom: 1px;
    width: calc(100% - 3.8rem);
    left: 2.37rem;
    padding: 0.97rem;
    color: var(--default-color);
    padding-left: 2.5rem;
    transition:0.2s;
    z-index: 2;
}



.detail-cases:before {
    content: '';
    width: calc(100% - 4.5rem);
    left: 2.75rem;
    z-index: 0;
    transition: 0.2s;
    position: absolute;
    height: 4rem;
    bottom: 0;
}





.detail-cases.hover:before {
    background-position: left bottom;
}


.title-det-case {
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 2px;
    font-size: 16px;
    font-weight: bold;
    margin: 0;
    padding: 1rem 2rem 1rem 4rem;
}








/*.detail-cases:has(.link-det-cases:hover) :before{*/
/*    ackground-position: left bottom;*/
/*}*/


.link-det-cases span{
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    color: currentColor;
    margin-left: 2rem;
    letter-spacing: 2px;
    font-size: 14px;
    z-index:3;
}

.link-det-cases svg{
    width: 2rem;
    height: 2rem;
    z-index:3;
}

.box-case{
    padding: 2rem;
    background-size: cover;
    border-bottom: 2px solid #fff;
    display: flex;
    border-top: 2px solid #fff;
    align-items: center;
    justify-content: center;
}


.logo-case-det{
    width: auto;
    height: 9.3rem;
}





















.box-project{
}


.detail-project{

}

.data-project{
   padding: 2rem;
   border-left: 0.5rem solid #fff;
   padding-bottom: 1rem;
}

.data-1{
   margin:0;
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 6rem;
   line-height: 6rem;
   font-weight: 300;
   letter-spacing: 2px;
}

.data-2{
   margin: 0;
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-size: 1.2rem;
   font-weight: 600;
   line-height: 1rem;
   letter-spacing: 2px;
}

.content-project{
   padding: 0rem 2.6rem;
}


.content-project .title{
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   font-size: 2rem;
   line-height: 2rem;
   font-weight: 700;
}

.content-project .description{
   color: var(--default-color);
   font-size: 16px;
   line-height: 18px;
   font-family: "Montserrat", sans-serif;
   font-style: italic;
   font-weight: 100;
}



.box-project .overlay {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   opacity:1;
   transition:0.5s;
   background: #ffffff;
}


.box-project .overlay:hover {
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   opacity:0;
   background: #c7c7c7;
   z-index: 1;
}


.box-project .overlay .detail-project .title{
   font-family: "Montserrat", sans-serif;
   color: var(--primary-color);
}






.box-project .overlay .data-project{
   padding: 2rem;
   border-left: 0.5rem solid #00498d82;
   padding-bottom: 1rem;
}

.box-project .overlay .data-project .data-1{
   margin:0;
   color: #00498d82;
   font-family: "Montserrat", sans-serif;
   font-size: 6rem;
   line-height: 6rem;
   font-weight: 300;
   letter-spacing: 2px;
}

.box-project .overlay .data-project .data-2{
   margin: 0;
   color: #00498d82;
   font-family: "Montserrat", sans-serif;
   font-size: 1.2rem;
   font-weight: 600;
   line-height: 1rem;
   letter-spacing: 2px;
}

.box-project .overlay .content-project .title{
   font-family: "Montserrat", sans-serif;
   color: #00498d82;
   font-size: 2rem;
   line-height: 2rem;
   font-weight: 700;
}

.box-project .overlay .content-project .description{
   color: #00498d82;
   font-size: 16px;
   line-height: 18px;
   font-family: "Montserrat", sans-serif;
   font-style: italic;
   font-weight: 100;
}




.h1-page{
   font-family: "Montserrat", sans-serif;
   font-size: 6rem;
   line-height: 5.5rem;
   font-weight: 700;
   letter-spacing: 1px;
   color: var(--default-color);
   text-transform: uppercase;
}

.h1-news-page{
     font-family: "Montserrat", sans-serif;
   font-size: 5rem;
   line-height: 4.5rem;
   font-weight: bold;
   letter-spacing: 1px;
   color: var(--secondary-color);  
}

.h1-news {
   font-family: "Montserrat", sans-serif;
   font-size: 5rem;
   line-height: 4.5rem;
   font-weight: bold;
   letter-spacing: 1px;
   color: var(--secondary-color);
}


.mb-box{
   margin-bottom: 1.5rem;
}



/*MENU PAGE*/


.page.bgd-nav {
   background-color: transparent;
   padding-top: 1rem;
   transition: 0.2s;
   border-bottom: 1px solid #ffffff2e;
}

.page.bgd-nav.menu-scroll {
   background-color: var(--primary-color);
   border-bottom: 0px;
}
.page > .nav-button{
   box-shadow: inset 0 0 100px 100px #ffffff2e;
}

.page > .nav-item > .nav-link.cms {
   color: var(--default-color);
   fill: var(--default-color);
}

.page > .nav-item:after {
   background-color: var(--default-color);
}


.menu-scroll > .container-fluid > .navigation-bar > .page > .nav-button{
   box-shadow: inset 0 0 100px 100px var(--secondary-color);
}


   .mobile-menu {
       width: 2rem;
       height: 2rem;
       top: 0;
       display: flex;
       right: 0;
       cursor: pointer;
       flex-direction: column;
       flex-wrap: wrap;
       grid-template-columns: auto auto;
       justify-items: center;
       transition:0.2s;
       position:relative;
       align-items: center;
       gap: 2px;
       justify-content: center;
   }
   
   /* .mobile-menu:after{*/
   /*    content:'';*/
   /*    position:absolute;*/
   /*    width: 2px;*/
   /*    height:100%;*/
   /*    background-color: #fff;*/
   /*}*/
   
   /*.mobile-menu:before{*/
   /*    content:'';*/
   /*    position:absolute;*/
   /*    width: 99%;*/
   /*    height: 2px;*/
   /*    top: 49%;*/
   /*    background-color:#fff;*/
   /*}*/
   
    .menu-scroll .mobile-menu:after, .menu-scroll .mobile-menu:before{
       background-color: #ffffff;
   }
   

   .mobile-menu.change:after, .change.mobile-menu:before{
       background-color:#fff;
   }
   

   
   
   .left-menu {
       width: 60%;
       top: 0;
       height: 100%;
       background-image: url(/media/background_blu_dissolvenza.jpg);
       background-size: auto;
       background-repeat: repeat;
       transform: translateY(-100%);
       transition: 0.2s;
       transition-duration: 0.2s;
       transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
       transition-delay: 0s;
       transition-property: all;
       position:fixed;
       left:0;
       z-index: 99;
       display: flex;
       align-items: flex-start;
       justify-content: flex-start;
       padding: 5rem;
       padding-top: 8rem;
       padding-right: 4rem;
       flex-direction: column;
   }
   
   .left-menu.step-1{
       transform: translateY(0%);
   }
   
   .left-menu.step-2{
       transform: translateY(100%);
   }
   

   
   .right-menu.step-1{
       transform: translateY(0%);
   }
   
   .right-menu.step-2{
       transform: translateY(-100%);
   }
   

   .no-index{
       display:none;
   }
   

   
   
   .bgd-nav.show-menu{
       width:100%
   }
   .show-menu .navbar-cont{
       padding-left: 0;
   }
   
   

 .bar-1{
       height: 0.1rem;
       background: var(--default-color);
       width: 100%;
       transition: 0.5s;
   }
   
   
   .bar-2{
       height: 0.1rem;
       background: var(--default-color);
       margin: 0.3rem 0;
       width: 100%;
       transition: 0.5s;
   }
   
   
   .bar-3{
       height: 0.1rem;
       background: var(--default-color);
       width: 100%;
       transition: 0.5s;
   }
   


  
  
   .reverse .bar-1 {
       background: var(--primary-color);
   }
   
   .reverse .bar-2 {
       background: var(--primary-color);
   }
   
   .reverse .bar-3 {
       background: var(--primary-color);
   }
  


   
   .menu-scroll  .bar-1, .menu-scroll  .bar-2, .menu-scroll  .bar-3{
       background: #ffffff;
   }


   .change .bar-1 {
     -webkit-transform: rotate(45deg) translate(1px, 5px);
     transform: rotate(45deg) translate(0px, 5px);
     width: 90%;
     transition: 0.5s;
     background: var(--default-color);
   }
   
   .change .bar-2 {
       
       opacity: 0;
       transition: 0.5s;
       background: var( --secondary-color);
       
       
   }
   
   .change .bar-3 {
     -webkit-transform: rotate(-45deg) translate(7px, -11px);
     transform: rotate(-45deg) translate(7px, -11px);
     width: 90%;
     transition: 0.5s;
     background: var(--default-color);
   }



























.carousel-right {

}


#filters-events .box-project{
   box-shadow: inset 0 0 2000px 2000px #00000080;
}

.mb-box.hide{
   display:none;
}


.subtitle{font-family: "Montserrat", sans-serif;font-weight: 100;color: #fff;letter-spacing: 0.5px;font-size: 3rem;margin: 0;}


.sec-donation{
   z-index: 2;
   position: relative;
   display: flex;
   justify-content: center;
   align-items: center;
}

.row-donation{
   padding-left: 6rem;
   padding-bottom: 3rem;
   display: flex;
   flex-direction: row;
   position: absolute;
   justify-content: flex-start;
   transition: 0.3s;
   top: -6rem;
   transform: translateX(0);
}



.col-donation{
   padding: 0rem 6rem;
   padding-bottom: 2rem;
   gap: 1rem;
   display: grid;
   grid-template-columns: auto 30vw;
   margin-top: -6rem;
}

.card-donation{
   width: 100%;
   margin: 2vw 2vw 2vw 0;
   display: flex;
   padding: 4rem;
   position: relative;
   background: #fff;
   box-shadow: 0 0 2rem 5px #8b8b8b8a;
   flex-direction: column;
}

.card-donation.checkout{
   width: 100%;
   position: -webkit-sticky;
   position: sticky;
   top: 6.5rem;
}


.card-donation .overlay-donation{
   position: absolute;
   width: 100%;
   height: 100%;
   background: #ffffff99;
   top:0;
   left:0;
   transition: 0.2s;
   opacity: 0;
   z-index: 1;
   visibility: hidden;
}


.card-donation.disable .overlay-donation{
   opacity: 1;
   visibility: visible;
}

.card-donation.inactive .overlay-donation{
   opacity: 1;
   cursor: pointer;
   visibility: visible;
}


.card-donation.disable > .prev, .card-donation.disable > .next, .card-donation.disable > .end{
   cursor:default;
}

.page-donation .hero-page{
   padding-bottom:5rem;
}

.page-donation{
   background: #dbdbdb4f;
}

/*.next {*/
/*   background: var(--secondary-color);*/
/*   color: var(--default-color);*/
/*   padding: 1rem;*/
/*   font-family: "Montserrat", sans-serif;*/
/*   letter-spacing: 3px;*/
/*   position: absolute;*/
/*   left: 59%;*/
/*   top: 25%;*/
/*   z-index: 2;*/
/*   cursor: pointer;*/
/*   font-size: 2rem;*/
/*   text-decoration: underline;*/
/*   text-transform: uppercase;*/
/*   box-shadow: 0px 13px 2rem 2px #8b8b8b8a;*/
/*   display: flex;*/
/*   align-items: center;*/
/*   flex-direction: column;*/
/*}*/
/*.next > svg{*/
/*   width: 2rem;*/
/*   color:#fff;*/
/*   fill: #fff;*/
/*   transform: rotate(-45deg);*/
/*}*/




.prev {
   background: var(--secondary-color);
   color:
   var(--default-color);
   padding: 1rem;
   font-family:
   'Borg';
   letter-spacing: 3px;
   position: absolute;
   left: 59%;
   top: 40%;
   z-index: 2;
   cursor: pointer;
   font-size: 2rem;
   text-decoration: underline;
   text-transform: uppercase;
   box-shadow: 0px 13px 2rem 2px #8b8b8b8a;
   display: flex;
   align-items: center;
   flex-direction: column;
}
.prev > svg{
   width: 2rem;
   fill: var(--default-color);
   transform: rotate(-225deg);
}

.next.hide, .prev.hide{
   display:none;
}

.card-donation.disable > .next:after, .card-donation.disable > .prev:after, .card-donation.disable > .end:after{
   content:'';
   position: absolute;
   width: 100%;
   height: 100%;
   left: 0;
   background: #ffffff99;
   top: 0;
}


.card-donation > label{
   color: var(--primary-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 600;
   font-size: 2.5rem;
   line-height: 2.3rem;
   letter-spacing: 1px;
   text-transform: uppercase;
}

/*.personal-data {*/
/*   display: flex;*/
/*   flex-direction: row;*/
/*   flex-wrap: wrap;*/
/*   justify-content: space-between;*/
/*}*/

.payment-data{
   display: flex;
   flex-direction: row;
   flex-wrap: wrap;
   justify-content: space-between;
}


.input-donation {
   border: 0;
   background-color:#dbdbdb4f;
   width: 100%;
   color: var(--primary-color);
   padding: 1rem;
   font-size: 20px;
   position: relative;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   margin-bottom: 1rem;
   transition:0.2s;
   text-transform: uppercase;
   -webkit-appearance: none;
}

.input-donation.sel {
   background-image: url(/media/prf_freccia_giu_blu.svg);
   background-repeat: no-repeat;
   background-position: calc(100% - 1rem) center;
   background-size: 11px;
   margin-top: 0.5rem;
}

.input-donation.hide{
   display:none;
}

/*.personal-data .input-donation:not(:last-child){*/
/*    margin-bottom:1rem;*/
/*}*/
/*.personal-data .input-donation:last-child{*/
/*    margin-bottom:0;*/
/*}*/

.personal-data .grid-50{
   margin:0;
}


.half{
   width: 48%;
}

.input-donation.import {
   text-align: right;
   -webkit-appearance: none;
   background-image: url(/media/prf_euro.svg);
   background-repeat: no-repeat;
   background-position: 1rem;
   background-size: 20px;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
 -webkit-appearance: none;
}


input[type=number] {
 -moz-appearance: textfield;
 -webkit-appearance: none;
}


.input-donation::placeholder{
   color: #00498dd6;
}


.input-donation.error {
   box-shadow: 0 0 0px 2px red;
}

.input-donation.error::placeholder{
   color: red;
}

.euro-symbol:before {
   content: "";
   top: 1.5rem;
   left: 1rem;
   position: absolute;
   background-image: url(/media/prf_euro.svg);
   z-index: 2;
   width: 1.5rem;
   height: 1.5rem;
   background-size: contain;
   background-repeat: no-repeat;
}




.grid-import {
   gap: 1rem;
   width: 100%;
   display: grid;
   grid-template-columns: auto auto auto auto auto;
   margin-bottom: 1rem;
   margin-top: 0.5rem;
}

.sel-donation-time{
   border: 0;
   background-color:#dbdbdb4f;
   width: 100%;
   color: var(--primary-color);
   padding: 1rem;
   font-size: 20px;
   position: relative;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   transition: 0.5s;
   text-transform: uppercase;
}

.sel-donation-time.active{
   background-color:var(--primary-color);
   color: var(--default-color);
}



.sel-donation-type{
   border: 0;
   background-color:#dbdbdb4f;
   width: 100%;
   color: var(--primary-color);
   padding: 1rem;
   font-size: 20px;
   position: relative;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   text-transform: uppercase;
   transition: 0.5s;
}



.card-donation.order button:not(.update-data):after{
   content: '';
   height: 2px;
   width: 0;
   position: absolute;
   background-color: var(--primary-color);
   bottom: 0;
   left: 0;
   transition: 0.2s;
}

.card-donation.order button:hover:after {
   width: 100%;
}



.sel-donation-type.active{
   background-color:var(--primary-color);
   color: var(--default-color);
}


.sel-donation-user{
   border: 0;
   background-color:#dbdbdb4f;
   width: 100%;
   color: var(--primary-color);
   padding: 1rem;
   font-size: 20px;
   position: relative;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   text-transform: uppercase;
   transition: 0.5s;
}

.sel-donation-user.active{
   background-color:var(--primary-color);
   color: var(--default-color);
}


.sel-donation-import{
   border: 0;
   background-color:#dbdbdb4f;
   color: var(--primary-color);
   padding: 1rem;
   font-size: 20px;
   position: relative;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   text-transform: uppercase;
   transition: 0.5s;
}

.sel-donation-import.active{
   background-color:var(--primary-color);
   color: var(--default-color);
}




.sel-recurrence {
   display: grid;
   grid-template-columns: auto auto auto;
   gap: 1rem;
}

.sel-recurrence.hide {
   display:none;
}

.sel-donation-rec{
   border: 0;
   background-color:#dbdbdb4f;
   width: 100%;
   color: var(--primary-color);
   padding: 1rem;
   font-size: 20px;
   margin: 0;
   position: relative;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   transition: 0.5s;
   margin-bottom: 0;
   text-transform: uppercase;
}

.sel-donation-rec:first-child {
   margin: 0;
}

.sel-donation-rec:last-child {
       margin: 0;
}


.sel-donation-rec.active{
   background-color:var(--primary-color);
   color: var(--default-color);
}



.grid-50{
   gap: 1rem;
   width: 100%;
   display: grid;
   grid-template-columns: 50% auto;
   margin-bottom:1rem;
   margin-top: 0.5rem;
}



.sel-donation-pay{
   border: 0;
   background-color:#dbdbdb4f;
   width: 100%;
   color: var(--primary-color);
   padding: 1rem;
   font-size: 20px;
   position: relative;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   text-transform: uppercase;
}

.sel-donation-pay.active{
   background-color:var(--primary-color);
   color: var(--default-color);
}









.tabs-payment{
   display: flex;
   flex-direction: row;
   align-items: center;
   border-bottom: 2px solid #00498d94;
}

.item-tab-payment{
   width: 50%;
   position:relative;
   color: #00498d94;
   font-family: "Montserrat", sans-serif;
   font-weight: 600;
   font-size: 2rem;
   letter-spacing: 1px;
   text-transform: uppercase;
   transition:0.2s;
   cursor:pointer;
}


.item-tab-payment:after{
   content:'';
   width:0%;
   height:5px;
   background-color:var(--primary-color);
   position:absolute;
   bottom: -5px;
   left: 0;
   transition:0.2s;
}

.item-tab-payment.active{
   color: var(--primary-color);
}

.item-tab-payment.active:after{
   width:100%;
}

.method.hide{
   display:none;
}

.copy-data{
   border: 0;
   background-color: #dbdbdb4f;
   width: 100%;
   color: var(--primary-color);
   padding: 1rem;
   font-size: 20px;
   position: relative;
   display: flex;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   margin-bottom: 1rem;
   transition: 0.2s;
   text-transform: uppercase;
   justify-content: space-between;
   flex-direction: row;
}

.copy-data > i{
   cursor:pointer;
}

.content-partner{
   padding: 0 6rem;
}

.card-partner{
   padding: 4rem;
   margin-bottom: 4rem;
   box-shadow: 0 0 2rem 5px #8b8b8b8a;
   display: flex;
   flex-direction: row;
   background: #fff;
   z-index: 2;
   justify-content: space-between;
   position: relative;
}

.card-partner > img{
   width: 40%;
   margin-right: 4rem;
   filter: drop-shadow(0 10px 1rem #8b8b8b8a);
}

.box-text-partner > h3{
   text-transform: uppercase;
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
   letter-spacing: 1px;
   font-size: 4rem;
   line-height: 3.5rem;
   margin-bottom: 2rem;
}



.box-text-partner > p{
   font-family: "Montserrat", sans-serif;
   font-weight: 100;
   letter-spacing: 0.5px;
   font-size: 18px;
   margin: 0;
   font-style: italic;
}

.box-text-partner > p.pre-title{
   text-transform: uppercase;
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   letter-spacing: 1px;
   color:currentColor;
   font-size: 1.5rem;
   line-height: 2.5rem;
   font-style: normal;
}


.box-text-partner > .nav-arrow {
   color: currentColor;
}

.partners{
   margin-top: -10rem;
   z-index: 5;
   position: relative;
}

.page-partner .hero-page{
   padding-bottom:5rem;
}


#filters-events .box-project .detail-project .data-project {
   padding: 2.6rem;
   border-left: 0rem solid #fff;
   padding-bottom: 1rem;
}


#filters-events .box-project .content-project {
   padding: 0rem 2.6rem;
   padding-bottom: 2.6rem;
}

#filters-events .box-project .content-project .description{
margin: 0;
}


.video-content {
   width: 100%;
   -webkit-mask-image: url(/media/paolorossi_hero_home_v2.jpg);
   -webkit-mask-size: 100%;
   mask-size: 100%;
   -webkit-mask-repeat: no-repeat;
   mask-repeat: no-repeat;
}

.box-image-video{
   height: 100%;
   width: 100%;
   background-position: center bottom;
   display: flex;
   background-size: cover;
   flex-direction: column;
   justify-content: center;
   align-items: flex-start;
   padding: 0;
}



/*MODAL*/


.modal_section{
   position: fixed;
   bottom: 0;
   width: 100%;
   height: 100%;
   padding: 50px 0;
   z-index: 99999;
   background-color: #000000ad;
   transition: 0.2s;
   opacity: 0;
   visibility: hidden;
   align-items: center;
}


.modal_section.show {
   opacity: 1;
   visibility: visible;
}

.modal_contain{
   position: fixed;
   top: -100%;
   width: 60vw;
   transition: 0.5s;
   left: 20vw;
   padding: 50px 0;
   z-index: 999;
   background-color: var(--default-color );
}

.modal_section.show  .modal_contain {
   top: 5vh;
}

.header-modal {
   position: absolute;
   width: 100%;
   background-color: transparent;
   height: 4rem;
   z-index: 99;
   top: 0;
   left: 0;
}

.close_modal{
   position: absolute;
   right: 0;
   top: 0;
   cursor: pointer;
   width: 4rem;
   background-color: var(--third-color);
   height: 4rem;
}

.close_modal > svg{
   padding: 1.2rem;
   fill:var(--primary-color)
}



.body_modal{
   padding: 0 4rem;
}

.body_modal h3 {
   text-transform: uppercase;
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
   letter-spacing: 1px;
   font-size: 4rem;
   line-height: 3.5rem;
}


.body_modal .grid-50{
   margin-top: 2rem;
}

.body_modal .grid-50 .input-donation{
   margin-bottom:0;
}



.button-modal{

   display: flex;
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   text-transform: uppercase;
   font-style: normal;
   letter-spacing: 3px;
   box-shadow: inset 0 0 100px 100px var(--secondary-color);
   font-size: 2rem;
   height: 5rem;
   line-height: 2rem;
   position: absolute;
   text-align: center;
   width: 20rem;
   text-decoration: underline;
   color: var(--default-color);
   align-items: center;
   justify-content: center;
   border:none;
   bottom:0;
   right:0;
}

.button-modal:hover {
  color: var(--default-color);
}


.checkbox-c.blue[type=checkbox] {

   border: 2px solid var(--primary-color);
}

.checkbox-c.blue:checked[type=checkbox] {
   background-image: url(/media/check_blue.svg);
}


.body_modal .choice-sel{
   margin-bottom:-.5rem;
}

.summary{
   display: grid;
   grid-template-columns: auto;
   width: 100%;
   position: relative;
   column-gap: 1rem;
   margin: 1rem 0;
}

.row-summary {
   display: flex;
   align-items: center;
   justify-content: space-between;
   border-bottom: 1px solid #e1e1e1;
   margin-top: 0.5rem;
   padding-bottom: 0.2rem;
}

.label-summary {
   font-family: "Montserrat", sans-serif;
   font-size: 16px;
   opacity: 0.5;
   letter-spacing: 1px;
}

.info-summary {
   font-family: "Montserrat", sans-serif;
   font-size: 16px;
   font-weight: 500;
}


.summary.donation{
   grid-template-columns: auto;
}


.row-import{
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
   margin-top: 1rem;
}



.label-import{
      font-family: "Montserrat", sans-serif;
      font-size: 18px;
      opacity: 0.5;
      letter-spacing: 1px;
}

.total-import{
     font-family: "Montserrat", sans-serif;
     font-size: 40px;
     font-weight: bold;
     line-height: 35px;
}

.now-donation {
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   text-transform: uppercase;
   border: none;
   margin-top: 2rem;
   font-style: normal;
   text-decoration: underline;
   padding: 1rem;
   width: 100%;
   letter-spacing: 3px;
   box-shadow: inset 0 0 100px 100px var(--secondary-color);
   font-size: 2rem;
   color: var(--default-color);
}

.update-data {
   border: none;
   margin: 1rem 0;
   width: 20%;
   padding: 1rem;
   font-size: 2rem;
   position: relative;
   letter-spacing: 0.5px;
   text-transform: uppercase;
   background-color: var(--secondary-color);
   transition: 0.5s;
   color: #fff;
   font-family: "Montserrat", sans-serif;
   font-weight: 500;
   text-decoration: underline;
}

.update-data:hover {
   box-shadow: 0 0 20px 2px #8b8b8b8a;
}

/*.update-data.show{*/
/*    display: block;*/
/*}*/

.divider-card {
   height: 10vh;
}


.card-donation > label.donation-label{
   font-size: 20px;
   line-height: 1rem;
   margin-top: 1rem;
   font-weight: 400;
}

.play-video-box {
   width: 3rem;
   height: 3rem;
   cursor: pointer;
   opacity: 0;
   transition: 0.2s;
   z-index: 2;
}

.box-image-2:hover .play-video-box {
   opacity: 1;
}
.overlay-box{
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   background: #00000087;
   z-index: 1;
   opacity:0;
   transition: 0.2s;
}
.box-image-2:hover .overlay-box {
   opacity: 1;
}

.box-image-hero{
   height: 100%;
   width: 100%;
   background-position: center bottom;
   display: flex;
   background-size: cover;
   flex-direction: column;
   justify-content: flex-end;
   align-items: flex-start;
   padding: 3rem 6rem;
}

.button-video-home {
   display: flex;
   align-items: center;
   flex-direction: row;
   height: 4rem;
   padding-right: 1rem;
   padding-left: 0;
   border: none;
   font-size: 1.5rem;
   letter-spacing: 2px;
   text-decoration: underline;
   text-transform: uppercase;
   font-family: "Montserrat", sans-serif;
   color: #fff;
   background:transparent;
   justify-content: flex-start;
   transition: 0.2s;
   background-size: 200% 100%;
   background-position: right bottom;
}

.button-video-home > svg{
   height: 1.5rem;
   margin-right: 1rem;
   padding: 0;
}

.button-video-home:hover{
   background-position: left bottom;
}

.input-custom {
   border: 0;
   background-color: #003b72;
   width: 100%;
   color: var(--default-color);
   padding: 1rem;
   font-size: 20px;
   position: relative;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   margin-bottom: 1rem;
   transition: 0.2s;
   text-transform: uppercase;
   -webkit-appearance: none;
}

.input-custom::placeholder {
   
   color: #000;

}







/*slide*/ 

.hero-slide{
   background-size:contain;
   position: relative;
   background-repeat: repeat;
   z-index: 10;
}







/*barre*/

.cont-bar-horizontal{
   position:absolute;
   display:flex;
   flex-direction: column;
   bottom: 0;
   right: 0;
   align-items: flex-end;
   z-index: 5;
}

.horizontal-bar{
   height: 2rem;
   background: linear-gradient(to right, #b2b7c300 50%, #00eeff 50%);
   background-size: 200% 100%;
   width: 7vw;
   transition: 0.2s;
   background-position: right bottom;
}

.horizontal-bar.animate{

   animation: animatehorizontalbar 6s;
   animation-iteration-count: infinite;
}


@keyframes animatehorizontalbar {
   
   0% {
   background-position: right bottom;
 }
 50% {
   background-position: left bottom;
 }
 100% {
   background-position: right bottom;
 }

}


.horizontal-bar:not(:last-child){
   margin-bottom:2rem;
}

.horizontal-bar.half{
   width: 3.5vw;
   transition-delay: 0.2s;
}

.horizontal-bar.hide{
   background-position: left bottom;
}


.cont-bar-vertical{
   position:absolute;
   display:flex;
   flex-direction: column;
   top: -1.4rem;
   z-index: 5;
   right: 80%;
}


.cont-bar-vertical-left {
   display: flex;
   justify-content: flex-end;
   flex-direction: row;
}

.cont-bar-vertical-right {
   display: flex;
   justify-content: flex-start;
   flex-direction: row;
}

.vertical-bar{
   width: 2rem;
   height: 7vw;
   transition: 0.2s;
}


.cont-bar-vertical-right .vertical-bar{
   margin-right: 2rem;
   background: linear-gradient(to right, #b2b7c300 50%, #00eeff 50%);
   background-size: 200% 100%;
   background-position: right bottom;
}

.cont-bar-vertical-left .vertical-bar{
   margin-left: 2rem;
   background: linear-gradient(to right, #00eeff 50%, #b2b7c300 50%);
   background-size: 200% 100%;
   background-position: left bottom;
}

.vertical-bar.half{
   height: 2vw;
}



.cont-bar-vertical-right .vertical-bar.hide{
   background-position: left bottom;
}

.cont-bar-vertical-left .vertical-bar.hide{
   background-position: right bottom;
}



.cont-bar-vertical-right .vertical-bar.animate{

   animation: animateverticalbar1 6s;
   animation-iteration-count: infinite;
}

.cont-bar-vertical-left .vertical-bar.animate{

   animation: animateverticalbar2 6s;
   animation-iteration-count: infinite;
}

@keyframes animateverticalbar1 {
   
   0% {
   background-position: right bottom;
 }
 50% {
   background-position: left bottom;
 }
 100% {
   background-position: right bottom;
 }

}

@keyframes animateverticalbar2 {
   
   0% {
   background-position: left bottom;
 }
 50% {
   background-position: right bottom;
 }
 100% {
   background-position: left bottom;
 }

}






.menu-bar-vertical{
   position:absolute;
   display:flex;
   flex-direction: column;
   bottom: 0;
   left: 0;
}

.menu-bar-vertical.v2{
   left: 14rem;
}

.menu-bar-left {
   display: flex;
   justify-content: flex-start;
   flex-direction: row;
}

.menu-bar-right {
   display: flex;
   justify-content: flex-start;
   flex-direction: row;
}

.menu-bar{
   width: 2rem;
   height: 7vw;
   transition: 3s;
}

.menu-bar{
   width: 2rem;
   height: 7vw;
   transition: 3s;
}

.menu-bar.no-show{
   opacity:0;
}



.menu-bar-right .menu-bar{
   margin-right: 2rem;

}

.menu-bar-left .menu-bar{
  margin-left: 2rem;

}



.menu-bar.half{
   height: 3.5vw;
}

.menu-bar.min{
   height: 2vw;
}


.down .menu-bar{
   background: linear-gradient(to bottom, #b2b7c300 50%, #00eeff 50%);
   background-size: 100% 200%;
   background-position: left bottom;
}

.down .menu-bar.hide{
   background-position: right top;
}



.up .menu-bar{
   background: linear-gradient(to top, #b2b7c300 50%, #00eeff 50%);
   background-size: 100% 200%;
   background-position: left top;
}


.up .menu-bar.hide{
   background-position: right bottom;
}




.down .menu-bar.black{
   background: linear-gradient(to bottom, #b2b7c300 50%, #3a3a3a 50%);
   background-size: 100% 200%;
   background-position: left bottom;
}
.up .menu-bar.black{
   background: linear-gradient(to top, #b2b7c300 50%, #3a3a3a 50%);
   background-size: 100% 200%;
   background-position: left top;
}


.down .menu-bar.animate{

   animation: downbar 6s;
   animation-iteration-count: infinite;
}

.up .menu-bar.animate{

   animation: upbar 6s;
   animation-iteration-count: infinite;
}
@keyframes downbar {
   
   0% {
   background-position: left bottom;
 }
 50% {
   background-position: right top;
 }
 100% {
   background-position: left bottom;
 }

}

@keyframes upbar {
   
   0% {
   background-position: left top;
 }
 50% {
   background-position: right bottom;
 }
 100% {
   background-position: left top;
 }

}




/*slider*/

.slider{
   position: relative;
   width: 100vw;
   height: 100vh;
}

.item-slide {
   z-index: 3;
   width: 100vw;
   height: 100%;
   background-size: 100%;
   background-position: bottom;
   position: absolute;
   background-repeat: no-repeat;
   display: flex;
   flex-direction: column;
   justify-content: center;
   padding: 0 5rem;
   background: #0000002b;
}

.item-slide.active {
   z-index:4;
}

.composition-slide{
   display: flex;
   flex-direction: row;
   align-items: flex-end;
}

.vertical-img{
   width: 17.9vw;
   height: 100vh;
   background-size: cover;
   background-repeat: no-repeat;
   background-position: right;
   transform: translateY(-100%);
   transition: 0.5s;
}

.square-img{
   background-size: cover;
   width: 35.3vw;
   background-repeat: no-repeat;
   height: 88.1vh;
   background-position: left;
   transform: translateY(100%);
   transition: 0.5s;
}



.block-text-slide {
   position: absolute;
   top: 29vh;
   width: 50vw;
   left: 26vw;
   transition:0.2s;
   opacity:0;
   visibility:hidden;
}

.block-text-slide .pre-title {
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   font-size: 1rem;
   margin: 0;
   letter-spacing: 4px;
   text-transform: uppercase;
}

.block-text-slide .title-slide{
   font-family: "Montserrat", sans-serif;
   font-size: 7rem;
   line-height: 7rem;
   color: var(--secondary-color);
   letter-spacing: 2px;
   font-weight: 600;
   margin:0;
}

.block-text-slide .sub-title{
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   margin: 0;
   font-size: 4.5rem;
   line-height: 4.5rem;
   font-weight: 100;
}

.item-slide.active .block-text-slide{
   opacity:1;
   visibility:visible;
}

.link-slide{
   position: absolute;
   bottom: 10vh;
   right: 29vw;
   transition:0.2s;
   opacity:0;
   width: 16rem;
   text-transform: uppercase;
   font-size: 1rem;
   letter-spacing: 4px;
   font-weight: bold;
   display: flex;
   color: var(--secondary-color);
   visibility:hidden;
   flex-direction: row;
   justify-content: space-between;
   background: linear-gradient(to right, #00eeff 50%, #b2b7c300 50%);
   background-size: 200% 100%;
   background-position: right bottom;
   padding: 0.5rem 1rem;
   align-items: center;
}

.link-slide:hover{
   color: var(--primary-color);
   background-position: left bottom;
}


.link-slide > svg{
   fill:currentColor;
   width: 2rem;
   height: 2rem;
}

.item-slide.active .link-slide{
   opacity:1;
   visibility:visible;
}




.content-slide{
    
}

.title-slide{
    color: var(--secondary-color);
    font-size: 5rem;
    font-family: "Montserrat", sans-serif;
    letter-spacing: 0px;
    line-height: 5.5rem;
}


.foot-slide{
    position: absolute;
    bottom: 0;
    padding: 1rem 5rem;
    width: 100%;
    left: 0;
}



.home-sec-2{
   background-color: var(--primary-color);
   z-index: 5;
   position: relative;
   padding: 5rem 0;
}


.home-sec-2 .cont-bar-vertical {
   position: absolute;
   display: flex;
   flex-direction: column;
   top: -1.9rem;
   z-index: 5;
   left: 8.8rem;
   align-items: flex-start;
}



.cont-bar-vertical-left {
   display: flex;
   justify-content: flex-end;
   flex-direction: row;
}

.cont-bar-vertical-right {
   display: flex;
   justify-content: flex-start;
   flex-direction: row;
}

.vertical-bar-v2{
   width: 2rem;
   height: 12vw;
   transition: 0.2s;
}


.cont-bar-vertical-right .vertical-bar-v2{
   margin-right: 2rem;
   background: linear-gradient(to right, #b2b7c300 50%, #00eeff 50%);
   background-size: 200% 100%;
   background-position: right bottom;
}

.cont-bar-vertical-left .vertical-bar-v2{
   margin-left: 2rem;
   background: linear-gradient(to right, #00eeff 50%, #b2b7c300 50%);
   background-size: 200% 100%;
   background-position: left bottom;
}

.vertical-bar-v2.half{
   height: 2vw;
}

.vertical-bar-v2.medium{
   height: 5vw;
}



.vertical-bar-v2.medium.opacity{
   opacity:0;
}

.cont-bar-vertical-right .vertical-bar-v2.hide{
   background-position: left bottom;
}

.cont-bar-vertical-left .vertical-bar-v2.hide{
   background-position: right bottom;
}



.cont-bar-vertical-right .vertical-bar-v2.animate{

   animation: animateverticalbar1 6s;
   animation-iteration-count: infinite;
}

.cont-bar-vertical-left .vertical-bar-v2.animate{

   animation: animateverticalbar2 6s;
   animation-iteration-count: infinite;
}






/*swipers*/

.cont-solustions{margin-top: 8rem;}


.arrow-carousel{
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
   height: 100px;
   width: 70%;
}

.arrow-next, .arrow-prev {
    width: 7rem;
    padding: 0.75rem 0.25rem;
    border: 2px solid #000000;
    gap: 2rem;
    border-radius: 10px;
    display: flex;
    color:#000;
    align-items: center;
    justify-content: center;
}


.arrow-next:hover, .arrow-prev:hover {
    background-color:#000;
}

.arrow-next:hover > svg, .arrow-prev:hover > svg{
    color:#fff;
}

.arrow-next > svg, .arrow-prev > svg {
    stroke: currentColor;
    width: auto;
    stroke-width: 100px;
    height: 15px;
    fill: transparent;
    transition: 0.2s transform;
    transform: rotate(-45deg);
}

.arrow-prev > svg {
    
    transform: rotate(135deg);
}


.arrow-next > svg:hover, .arrow-prev > svg:hover {
    opacity: 1;
}






.swiper-slide {
   flex-shrink: 0;
   width: 100%;
   height: 100%;
   position: relative;
   background-size: cover;
   transition-property: transform;
}


.swiper-solutions {
   right: 0;
   margin-right: auto;
   width: 101%;
   position: relative;
   overflow: hidden;
   list-style: none;
   padding: 0;
   z-index: 1;
}

.box-solution{
   gap: 4rem;
   height: 100%;
   width: 100%;
   display: grid;
   grid-template-columns: 65% auto;
}

.img-solution{
   background-size: cover;
   height: 500px;
}

.text-solution{
   padding: 0;
   display: flex;
   flex-direction: column;
   justify-content: space-around;
}

.text-solution > p{
   color:var(--default-color);
   font-family: "Montserrat", sans-serif;
   margin:0;
   font-size: 20px;
   letter-spacing: 2px;
   font-weight: 100;
}


.link-sol{
   display: flex;
   color: var(--secondary-color);
   flex-direction: row;
   font-weight: bold;
   width: 16rem;
   letter-spacing: 4px;
   font-size: 1rem;
   text-transform: uppercase;
   justify-content: space-between;
   background: linear-gradient(to right, #00eeff 50%, #b2b7c300 50%);
   background-size: 200% 100%;
   background-position: right bottom;
   transition:0.2s;
   padding: 0.5rem 1rem;
   align-items: center;
}

.link-sol:hover{
   color: var(--primary-color);
   background-position: left bottom;
}
.link-sol:hover > svg{
   fill:currentColor;
}

.link-sol> svg{
   fill:currentColor;
   width: 2rem;
   height: 2rem;
   margin-right: 0.5rem;
}



.link-sol.black{
   color: var(--primary-color);
   background: linear-gradient(to right, #3a3a3a 50%, #b2b7c300 50%);
   background-size: 200% 100%;
   background-position: right bottom;

}

.link-sol.black:hover{
   color: var(--secondary-color);
   background-position: left bottom;
}





.m-link{
   margin-top:3rem;
}


/*text*/


.p-mc > p{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   margin: 0;
   font-size: 18px;
   letter-spacing: 1px;
   line-height: 1.5rem;
   font-weight: 100;
}

.p-mc{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   margin: 0;
   font-size: 18px;
   letter-spacing: 1px;
   line-height: 1.5rem;
   font-weight: 100;
}




.blu-section{
   padding-top: 8rem;
   background-image: url(/media/background_blu_dissolvenza.jpg);
   background-size: auto;
   background-repeat: repeat;
   z-index: 5;
   position: relative;
}

.blu-section .container{
   padding-bottom: 5rem;
   position:relative;
}


.brand-banner{
   background:#fff;
   padding:3rem 0;
}


.blu-section .menu-bar-vertical {
   left: 12px;
}
.blu-section .menu-bar-vertical.v2 {
   left: 14.7rem;
}





/*footer*/


.footer{
   position: relative;
   background-image:url('/media/disturbo-nero.jpg');
   z-index: 5;
   padding-top: 6rem;
   margin-top: -3rem;
   padding-bottom: 2rem;
}


.footer_2{
    z-index: 9;
    background: #000;
    border-top-left-radius: 50px;
    border-top-right-radius: 50px;
}





.footer .container{
   z-index:3;
   position: relative;
}


.cont-bar-footer{
   position: absolute;
   width: 51.5vw;
   height: 100%;
   top: 0;
   right: 0;
   z-index: 2;
   display: flex;
   justify-content: flex-end;
   flex-direction: row;
}

.vertical-bar-down-menu{
   background: linear-gradient(to top, #b2b7c300 50%, #00eeff 50%);
   background-size: 100% 200%;
   background-position: left top;
   width: 10rem;
   height: 100%;
   margin-left: 2rem;
   transition: 3s;
}

.vertical-bar-down-menu.half{
   height: 13vh;
}


.vertical-bar-down-menu.hide{

   background-position: right bottom;

}








.contact-page{
   padding:5rem 0;
   margin-top: 5rem;
   position:relative;
   min-height: 115vh;
}

.page-404{
   position:relative;
}


.h1-404 {
    font-family: "Montserrat", sans-serif;
    font-size: 10rem;
    letter-spacing: 1px;
    color: #ffffff;
    font-weight: bold;
}


.h2-404 {
    font-size: 2rem;
    letter-spacing: 1px;
    color: #ffffff;
    font-weight: 100;
}

.button-error-page{
   background-color:var(--primary-color);
   color:#fff;
   border:none;
   padding: 1rem;
   width: 46%;
   display: flex;
   margin-top: 2rem;
   font-family: "Montserrat", sans-serif;
   flex-direction: row;
   align-items: center;
   line-height: 1rem;
   justify-content: flex-end;
   transition:0.2s;
   text-transform: uppercase;
   font-size: 1.2rem;
   letter-spacing: 3px;
   padding-right: 2rem;
   font-weight: bold;
   position:relative;
}

.button-error-page > svg{
       fill: currentColor;
       width: 2rem;
       height: 2rem;
       margin-right: 2rem;
}
.button-error-page:hover{
       color:#fff;
}


.page-404 .side-left {
   position:absolute;
   display:flex;
   flex-direction: row;
   top: 10vh;
   left: 0;
}


.page-404 .side-left.v2 {
   top: 36.9vh;
}


.content-error{
    height: 100vh;
    display: flex;
    padding: 0 20rem;
    align-items: center;
}


.contact-page .side-left {
   position:absolute;
   display:flex;
   flex-direction: row;
   top: 40vh;
   left: 0;
}


.contact-page .side-left.v2 {
   top: 66.9vh;
}




.contact-bar-left {
   display: flex;
   justify-content: flex-start;
   flex-direction: column;
}

.contact-bar-right {
   display: flex;
   justify-content: flex-start;
   flex-direction: column;
}


.contact-bar{
   height: 2rem;
   width: 7vw;
}

.contact-bar.no-show{
   opacity:0;
}



.contact-bar-right .contact-bar{
   margin-bottom: 2rem;
}

.contact-bar-left .contact-bar{
  margin-top: 2rem;
}



.contact-bar.half{
   height: 3.5vw;
}

.contact-bar.min{
   width: 2vw;
}

.contact-bar.plus{
   width: 12vw;
}



.down .contact-bar.black{
   background: linear-gradient(to right, #b2b7c300 50%, #3a3a3a  50%);
   background-size: 200% 100%;
   background-position: right bottom;
}
.up .contact-bar.black{
   background: linear-gradient(to right, #3a3a3a 50%, #b2b7c300  50%);
   background-size: 200% 100%;
   background-position: left bottom;
}


.down .contact-bar.animate{

   animation: sideLeftDown 6s;
   animation-iteration-count: infinite;
}

.up .contact-bar.animate{

   animation: sideLeftUp 6s;
   animation-iteration-count: infinite;
}


@keyframes sideLeftDown {
   
   0% {
   background-position: left bottom;
 }
 50% {
   background-position: right top;
 }
 100% {
   background-position: left bottom;
 }

}

@keyframes sideLeftUp {
   
   0% {
   background-position: right bottom;
 }
 50% {
   background-position: left bottom;
 }
 100% {
   background-position: right bottom;
 }

}




.contact-page .side-right {
   position:absolute;
   display:flex;
   flex-direction: row;
   bottom: 31.4vh;
   right: 0;
}


.contact-page .side-right.v2 {
   bottom: -4.5vh;
}



.page-404 .side-right {
   position:absolute;
   display:flex;
   flex-direction: row;
   bottom: 31.4vh;
   right: 0;
}


.page-404 .side-right.v2 {
   bottom: -4.5vh;
}




.side-right .down .contact-bar.black{
   background: linear-gradient(to left, #b2b7c300 50%, #3a3a3a  50%);
   background-size: 200% 100%;
   background-position: left bottom;
}
.side-right .up .contact-bar.black{
   background: linear-gradient(to left, #3a3a3a 50%, #b2b7c300  50%);
   background-size: 200% 100%;
   background-position: right bottom;
}


.side-right .down .contact-bar.animate{

   animation: sideRightDown 6s;
   animation-iteration-count: infinite;
}

.side-right .up .contact-bar.animate{

   animation: sideRightUp 6s;
   animation-iteration-count: infinite;
}


@keyframes sideRightDown {
   
   0% {
   background-position: right bottom;
 }
 50% {
   background-position: left top;
 }
 100% {
   background-position: right bottom;
 }

}

@keyframes sideRightUp {
   
   0% {
   background-position: left bottom;
 }
 50% {
   background-position: right bottom;
 }
 100% {
   background-position: left bottom;
 }

}





/*contact*/

.hero-contact{
   margin-bottom: 10vh;
}


.tabs-hero{
   gap: 1.5rem;
   height: 100%;
   width: 100%;
   display: grid;
   grid-template-columns: 40% 3% 40%;
}


.text-tab-hero{
   color: #3a3a3a;
}


.after-tab{
   color:var(--primary-color);
   font-family: "Montserrat", sans-serif;
   font-size: 6rem;
   line-height: 8rem;
}


/*.h1-tab{*/
/*  font-family: "Montserrat", sans-serif;*/
/*  font-size: 6rem;*/
/*  letter-spacing: 1px;*/
/*  font-weight: 100;*/
/*  transition:0.2s;*/
/*  cursor: pointer;*/
/*}*/

/*.text-tab-hero.active .h1-tab{*/
/*   font-weight:bold;*/
/*}*/


.h1-cont {
    font-family: "Montserrat", sans-serif;
    font-size: 3rem;
    letter-spacing: 1px;
    font-weight: bold;
    color: #3a3a3a;
}

.form-contact{
   padding: 0 15vw;
}




.form-mc{
   width:100%;
   margin-top:2rem;
}

.input-mc{
   border: 2px solid;
   background-color: transparent;
   width: 100%;
   color: var(--primary-color);
   padding: 1rem;
   font-size: 20px;
   font-family: "Montserrat", sans-serif;
   letter-spacing: 0.5px;
   position: relative;
   margin-bottom: 1rem;
   z-index: 1;
}



.input-mc::placeholder{
   color: var(--primary-color);
   font-family: "Montserrat", sans-serif;
}


.send-form{
   width: 25%;
   background-color:var(--primary-color);
   color:#fff;
   border:none;
   padding: 1rem;
   display: flex;
   margin-top: 2rem;
   font-family: "Montserrat", sans-serif;
   flex-direction: row;
   align-items: center;
   line-height: 1rem;
   justify-content: flex-end;
   transition:0.2s;
   text-transform: uppercase;
   font-size: 1.2rem;
   letter-spacing: 3px;
   padding-right: 2rem;
   font-weight: bold;
   position:relative;
}




/*.send-form:hover{*/
/*   width: 100%;*/
/*}*/





.send-form.open {
    width: 100%;
}

.send-form > svg{
       fill: currentColor;
       width: 2rem;
       height: 2rem;
       margin-right: 2rem;
}


.send-form.open > svg{
    opacity:0;
}

.send-form.open .text-button{
    opacity:0;
}

.message-form{
   opacity:0;
   visibility:hidden;
   position:absolute;
   width: 30vw;
   left: 0;
   transition:0.2s;
}

.send-form.open .message-form{
    opacity:1;
    visibility:visible;
    left: 20vw;
}


.help-desk{
   padding: 0 15vw;
}


.help-desk > p{
       font-weight: 300;
}


.help-desk .p-mc > p{
       font-weight: 300;
}



.locations{
   margin-top: 5rem;
   gap: 1.5rem;
   width: 100%;
   display: grid;
   grid-template-columns: auto auto;
}


.loaction{
   padding-left: 2rem;
   border-left: 1px solid #00000045;
}

.title-loc{
   color: var(--primary-color);
   font-family: "Montserrat", sans-serif;
   margin: 0;
   font-weight: bold;
   font-size: 1.5rem;
   letter-spacing: 1px;
}

.number-loc{
   color: var(--primary-color);
   font-family: "Montserrat", sans-serif;
   font-size: 1.5rem;
   letter-spacing: 1px;
   font-weight: 200;
}

.loaction .p-mc{
   font-weight:200;
}






/*subpage*/

.page {
   padding-top: 10rem;
   position: relative;
}

.hero-page{
   padding-bottom: 0;
   position: relative;
   padding-left: 20vw;
}


.h1-subpage{
   font-family: "Montserrat", sans-serif;
   font-size: 5rem;
   line-height: 5.5rem;
   font-weight: 100;
   letter-spacing: 2px;
   color: var(--secondary-color);
   text-transform: capitalize;
   margin-bottom: -1rem;
   position: relative;
   z-index: 6;
}


.h1-subpage > span{
   color: var(--default-color);
   font-weight: bold;
}



.page .vertical-img{
   position: absolute;
   transform: translateY(0);
   left: 0;
   top: 0;
   z-index: 2;
   height: 80vh;
}








/*news*/



.news-page {
   padding-top: 15rem;
   position: relative;
}

.hero-news{
   padding-bottom: 5rem;
   position: relative;
}



.grid-news{
   gap: 2rem;
   display: grid;
   grid-template-columns: auto auto auto;
}

.box-new{
   width:100%;
   height:auto;
}

.data-new{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   text-transform:uppercase;
   font-weight: 100;
   letter-spacing: 3px;
}

.title-new{
   color: var(--secondary-color);
   font-family: "Montserrat", sans-serif;
   font-size:1.5rem;
   font-weight: bold;
   letter-spacing: 1px;
   line-height: 1.8rem;
}

/*.desc-new{*/
/*    color: var(--default-color);*/
/*    font-family: "Montserrat", sans-serif;*/
/*    font-weight:200;*/
/*    font-size:;*/
/*}*/

.link-new{
   display: flex;
   color: var(--secondary-color);
   flex-direction: row;
   font-weight: bold;
   width: 100%;
   letter-spacing: 4px;
   font-size: 1rem;
   text-transform: uppercase;
   justify-content: space-between;
   background: linear-gradient(to right, #00eeff 58%, #b2b7c300 50%);
   background-size: 200% 100%;
   background-position: right bottom;
   transition: 0.2s;
   padding: 0.5rem 1rem;
   margin-top: 2rem;
   align-items: center;
}

.link-new:hover{
   color: var(--primary-color);
   background-position: left bottom;
}
.link-new:hover > svg{
   fill:currentColor;
}

.link-new> svg{
   fill: var(--primary-color);
   width: 2rem;
   height: 2rem;
   margin-right: 0.5rem;
}



.b-bottom{
   border-bottom: 2px solid var(--default-color);
}


.not-show{
   display:none;
}





.sec-page{
   background-color: var(--primary-color);
   padding: 4rem;
   position: relative;
   padding-left: 20vw;
   padding-right: 15rem;
   padding-bottom: 12rem;
}


.sec-page .cont-bar-vertical {
   position: absolute;
   display: flex;
   flex-direction: column;
   top: 2.65rem;
   z-index: 5;
   left: 5.2rem;
   align-items: flex-start;
}

.sec-page .menu-bar-vertical {
   position: absolute;
   display: flex;
   flex-direction: column;
   bottom: 0;
   left:unset;
   right: 5rem;
}
.sec-page .menu-bar-vertical.v2 {
   right: 21rem;
}


.img-rfid{
   width: 18rem;
   height: 18rem;
   position: absolute;
   bottom: -10rem;
   right: 10rem;
   z-index: 6;
}


.img-rfid > img{
   width: 100%;
}

.spell-bar {
    transform: rotate(180deg) translateX(6.31rem) translateY(8rem);
}

.h4-m{
   color: var(--secondary-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 200;
   letter-spacing: 4px;
   margin-bottom: 2rem;
}

.desc-page > p{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 200;
   letter-spacing: 1px;
   font-size: 16px;
}


.desc-page{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 200;
   letter-spacing: 1px;
   font-size: 18px;
}

.img-ab{
   position: absolute;
   width: 28vw;
   left: 8vw;
   z-index: 5;
   top: 35vh;
}

.img-ab > img{
   width:100%;
}


.list-mc{
   list-style:none;
}
.list-mc > li{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 200;
   letter-spacing: 1px;
   margin-bottom: 1rem;
   font-size: 18px;
   position: relative;
   transition:0.5s;
}

.list-mc > li > a{
   text-decoration:underline;
}

.list-mc > li > a:hover{
   color: var(--secondary-color);
}



.list-mc > li::before {
   content:'';
   width: 10px;
   position: absolute;
   height: 10px;
   background: #0ef;
   top: 0.5rem;
   left: -2rem;
}


.list-black{
   list-style:none;
}
.list-black > li{
   color: var(--primary-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
   margin-bottom: 1rem;
   font-size: 18px;
   position: relative;
}

/*.t-list{*/
/*  color: var(--primary-color);*/
/*   font-family: "Montserrat", sans-serif;*/
/*   font-weight: 500;*/
/*   letter-spacing: 1px;*/
/*   margin-bottom: 0rem;*/
/*   font-size: 18px; */
/*   text-transform:uppercase;*/
/*}*/

.list-black > li::before {
   content:'';
   top: 0.3rem;
   left: -2rem;
   background-image:url('/media/freccia_grigia_dx.svg');
   position: absolute;
   width: 2rem;
   height: 1rem;
   background-repeat: no-repeat;
}



.list-blue{
   list-style:none;
   margin-bottom: 2rem;
}
.list-blue > li{
   margin-top:2rem;
   color: var(--default-color);
   position: relative;
}

.list-blue .t-list{
  color: var(--secondary-color);
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
   letter-spacing: 1px;
   margin-bottom: 0rem;
   font-size: 18px; 
   text-transform:uppercase;
}

.list-blue > li::before {
   content:'';
   top: 0.3rem;
   left: -2rem;
   background-image:url('/media/freccia_blu_dx.svg');
   position: absolute;
   width: 2rem;
   height: 1rem;
   background-repeat: no-repeat;
}





.icon-list{
   list-style:none;
   margin-top: 2rem;
   margin-bottom: 2rem;
   padding: 0;
}


.icon-list > li{
   color: var(--default-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 200;
   letter-spacing: 1px;
   margin-bottom: 2rem;
   font-size: 18px;
   position: relative;
   display: flex;
   gap: 2rem;
   align-items: center;
}

.icon-list > li > p{
   margin-bottom: 0;
}

.icon-list > li > img{
   width: 5rem;
}

.mb-t{
   margin-bottom: 4.5rem;
}


.min-sec{
   min-height: 135vh;
}


.brand-banner-page{
   background:#fff;
   padding: 5rem 0;
   z-index:5;
   position: relative;
}

.box-news{
    display: grid;
    grid-template-columns: auto auto auto;
    gap: 1.5rem;
}

.content-single-news{
    background-color: var(--primary-color);
}

.container-news{
    gap: 6rem !important;
    display: grid !important;
    grid-template-columns: auto auto;
}

.hero-news-0{
    
    position: relative;
    padding:0;
}

.sing-news-t{
    margin-bottom: -0.5rem;
    position: relative;
    z-index: 9;
}

.h4-m.white {
    color: var(--default-color);

}

.link-fonte{
    color: var(--default-color);
    font-family: "Montserrat", sans-serif;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 18px;
}
.link-fonte:hover{
    color: var(--default-color);
}

.social-col{
    position: sticky;
}

.social-link  > a > i{
    width:2rem;
}

.social-fix{
    position: fixed;
    top: 7rem;
}


.content-p-news{
    padding: 0;
}


.tabs-hero-partners{
    gap: 1rem;
    display: grid;
    grid-template-columns: auto auto auto;
    align-items: center;
    justify-content: start;
}


.h2-tab{
     color: var(--primary-color);
   font-family: "Montserrat", sans-serif;
   line-height: 3rem;
   font-size: 3rem;
   font-weight: 200;
   letter-spacing: 3px; 
   cursor:pointer;
}

.h2-part {
    color: var(--primary-color);
    font-family: "Montserrat", sans-serif;
    line-height: 3rem;
    font-size: 3rem;
    font-weight: bold;
    letter-spacing: 3px;
}

.after-tab-partners {
    color: var(--primary-color);
    font-family: "Montserrat", sans-serif;
    font-size: 3rem;
    line-height: 3rem;
}

.text-tab-hero.active .h2-tab {
    font-weight: bold;
}

.swiper-partners{
    right: 0;
    margin-right: auto;
    width: 101%;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    bottom: 0;
    z-index: 1;
}


.swiper-customers{
    right: 0;
    margin-right: auto;
    width: 101%;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    bottom: 0;
    z-index: 1;
}


.grid-customers, .grid-partners{
    display: grid;
    grid-template-columns: 18% 18% 18% 18% 18%;
    gap: 2rem;
}

.partner-box{
    border: 1px solid #fff;
    transition:0.2s;
    opacity:0.5;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3rem;
    margin-bottom: 3rem;
    cursor: pointer;
    position:relative;
}

.partner-box  > img{
    width: 100%;
    height: auto;
    
}

.partner-box:hover{
    opacity:1;
}



.square-partner-box{
    position: absolute;
    width: 100%;
    border-right: 1px solid #fff;
    border-bottom: 1px solid #fff;
    height: 10.6rem;
    bottom: -3.2rem;
    right: -1rem;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}


.numbers-cert{
    padding: 1rem;
    text-align: center;
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 12px;
    margin: 0;
    width: 100%;
    font-weight: 100;
    text-transform: uppercase;
    border-left: 1px solid;
}





.partner-box:before{
    content:'';
    width:1rem;
    height:1px;
    background-color:var(--default-color);
    position:absolute;
    top: 2.8rem;
    right:-1rem;
}











.grid-partners.hide{
    display:none;
}


.grid-customers.hide{
    display:none;
}


.nav-partners {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding-left: 4rem;
    justify-content: flex-end;
}


.nav-partners .arrow-next, .nav-partners .arrow-prev{
   cursor:pointer;
   background: linear-gradient(to bottom, #b2b7c300 50%, #3a3a3a 50%);
   background-size: 100% 200%;
   background-position: right top;
   transition:0.5s;
}


.nav-partners .arrow-next > svg, .nav-partners .arrow-prev > svg{
   fill: #3a3a3a;
   width: 1rem;
}

.nav-partners .arrow-next:hover, .nav-partners .arrow-prev:hover{
   background-position: left bottom;
}

.nav-partners .arrow-next:hover > svg, .nav-partners .arrow-prev:hover > svg{
   fill:#fff;
}


.nav-partners .arrow-next, .nav-partners .arrow-prev{
   width: 100%;
   display: flex;
   height: 100px;
   align-items: center;
   padding: 0 0.6rem;
   justify-content: center;
}

.text-carousel{
    position: absolute;
    bottom: -0.9rem;
    font-size: 7rem;
    text-transform: uppercase;
    color: #ffffffa6;
    font-family: "Montserrat", sans-serif;
    font-weight: bold;
    letter-spacing: -3px;
    line-height:7rem;
    left: 0rem;
}


.load-body{
   animation: removeBlur 0.5s ease-in-out;
   overflow-y:hidden;
}





@keyframes removeBlur {
 0% {
   filter: blur(15px);
 }
 50% {
   filter: blur(7px);
 }
 100% {
   filter: blur(0px);
 }
 
}

.no-capitalize{
    text-transform: unset;
}


.error-input {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 0;
}

.require-error::after {
    content: 'Campo richiesto';
    position: absolute;
    font-size: 14px;
    right: 50%;
    opacity: 0;
    letter-spacing: 1px;
    font-family: "Montserrat", sans-serif;
    transition: 0.2s;
    color: #fff;
    text-transform: uppercase;
    top: 1.4rem;
}

.require-error.show-error::after {
    right: 1rem;
    opacity: 1;
}

.error{
    color:#fff;
}

.sec-input{
    position:relative;
}








/*COLLAPSE*/

.nav-link .change-collapse {
    width: 9px;
    height: 9px;
    margin: 0;
    display: flex;
    cursor: pointer;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.nav-link .change-collapse  > .bar-1{
    width:100%;
    background: #3a3a3a;
    height: 2px;
    margin-left: 0;
}

.nav-link .change-collapse  > .bar-2{
    width:100%;
    background: #3a3a3a;
    height: 2px;
    margin-top: -2px;
    transition: 0.1s;
    transform:rotate(90deg);
}

.nav-link .change-collapse.open > .bar-2{
    transform: rotate(180deg);
}

b, strong {
    font-weight: bold;
}

.desc-page ul {
    list-style: none;
}

.desc-page ul > li {
    color: var(--default-color);
    font-family: "Montserrat", sans-serif;
    font-weight: 200;
    letter-spacing: 1px;
    margin-bottom: 1rem;
    font-size: 18px;
    position: relative;
    transition: 0.5s;
}

.desc-page ul > li::before {
    content: '';
    background-image: url(/media/freccia.svg);
    position: absolute;
    left: -2rem;
    top: 0.4rem;
    width: 1rem;
    height: 1rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.desc-page ul > li > a {
    text-decoration: underline;
}

.desc-page ul > li > a:hover {
    color: var(--secondary-color);
}

.h1-subpage p{
    margin:0;
}





.list-black ul{
   list-style:none;
}
.list-black ul > li{
   color: var(--primary-color);
   font-family: "Montserrat", sans-serif;
   font-weight: 400;
   letter-spacing: 1px;
   margin-bottom: 1rem;
   font-size: 18px;
   position: relative;
}

.list-black ul > li > p{
  color: var(--primary-color);
   font-family: "Montserrat", sans-serif;
   font-weight: bold;
   letter-spacing: 1px;
   margin-bottom: 0rem;
   font-size: 18px; 
   text-transform:uppercase;
}

.list-black ul > li::before {
   content:'';
   top: 0.3rem;
   left: -2rem;
   background-image:url('/media/freccia_grigia_dx.svg');
   position: absolute;
   width: 2rem;
   height: 1rem;
   background-repeat: no-repeat;
}



/*circles*/


.circles{
    position: absolute;
    height: 50rem;
    width: 50rem;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
    right: 2.5rem;
    top: -26.15rem;
    background: transparent;
    z-index: 0;
}








.item-infographic{
    display: flex;
    flex-direction: row;
    width: 100%;
    justify-content: space-between;
    align-items: flex-end;
    gap: 3rem;
    position:relative;
    z-index: 1;
}


.item-infographic:first-child{
    margin-top: 2rem;
}



.item-infographic:after{
    content:'';
    width: 9px;
    position: absolute;
    height: 9px;
    z-index: 9;
    background: var(--default-color);
    top: 0;
    right: 0;
    top: 0.75rem;
}

.img-item-infographic{
    width: 8rem;
}

.img-item-infographic img{width: 100%;}

.cert-item-infographic{
    width: 100%;
    margin-bottom: 1rem;
    display: flex;
    /*gap: 2rem;*/
    flex-direction: column;
}




.cert-item-infographic p{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 11px;
    margin: 0;
    font-weight: 100;
    margin-bottom: -1rem;
}

.cert-item-infographic img{width: auto;}







.regular{
    font-weight:400;
}







/*COLORS*/

.bg-1{
   background-color:var(--background-color); 
}

.bg-2{
   background-color:var(--secondary-background-color);
}

.bg-img{
    background-image:url('/media/gruppo_sfondo_aree_icone.png');
    background-size: calc(100% - 4rem);
    background-position: center bottom;
    background-repeat: no-repeat;
    padding-top: 12rem;
    margin-top: -10rem;
    margin-bottom: -3rem;
}



.black{
    color:#000;
}

.default{
    color:var(--default-color);
}

.cls-1 {
    fill: none;
    stroke: #fff;
    stroke-width: 5px;
}












/*LIST*/

.custom-list-horizontal{
    list-style: none;
    margin: 0;
    height: min-content;
    margin-top: 2rem;
    display: grid;
    padding: 0;
    grid-template-columns: 50% 50%;
}

.custom-list-horizontal li{
    position: relative;
    padding-left: 2.5rem;
    padding-right: 3rem;
}


.custom-list-vertical{
    list-style: none;
    margin: 0;
    margin-top: 2rem;
    padding: 0;
}

.custom-list-vertical li{
    position: relative;
    padding-left: 2.5rem;
    padding-right: 3rem;
}





ul.default li:before{
    content:'';
    background-image:url(/media/freccia.svg);
    position: absolute;
    left: 0;
    top: 0;
    width: 1.5rem;
    height: 1.5rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.title-li{
    font-family: "Montserrat", sans-serif;
    letter-spacing: 1px;
    font-size: 16px;
    margin: 0;
    margin-bottom: 1rem;
    font-weight: bold;
    text-transform: uppercase;
}



.default li .title-li{
    color: var(--default-color);
    text-transform: none;
    font-weight: 100;
}

/*PATTERNS*/

.intermade{
    padding:0 3rem;
}


.title-underline{
    font-family: "Montserrat", sans-serif;
    letter-spacing: 2px;
    font-size: 20px;
    color:var(--default-color);
    text-decoration:underline;
    margin-bottom: 1rem;
    font-weight: 600;
    text-transform: uppercase;
}



.grid-single{
    display: grid;
    align-items: start;
    grid-template-columns: 70% 15%;
    justify-content: space-between;
    margin-top: 4rem;
}



.list-logos{
  list-style: none;
  padding: 0;
}


.list-logos li{
  margin-bottom: 1rem;
  font-family: "Montserrat", sans-serif;
  color: var(--default-color);
  letter-spacing: 1px;
  font-size: 14px;
  font-weight: 500;
  line-height: 15px;
}

.list-logos li img{
  width: 8rem;
}





/*APPLICATIONS*/


.check-select-area{
    margin: 2rem 0;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.choice-application {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-top: 0;
   gap: 1rem;
}

.checkbox-application[type=checkbox] {
   background: transparent;
   appearance: none;
   color: var(--default-color);
   height: 1.5rem;
   border: 2px solid currentColor;
   width: 1.5rem;
   cursor: pointer;
}

.checkbox-application:checked[type=checkbox] {
   background-image: url(/media/check.svg);
   background-size: 15px 15px;
   background-position: center;
   background-repeat: no-repeat;
}

.label-application {
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   text-transform: uppercase;
   letter-spacing: 2px;
   font-size: 22px;
}

.select-locations{
    margin-left: 3rem;
    position: relative;
}

.select-locations.none{
    display:none;
}


.header-select{
    border-bottom: 1px solid #fff;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    height: min-content;
    z-index: 0;
    position: relative;
}

.header-select span{
    margin-bottom: 0;
}

.select-locations svg{
    width:3rem;
    padding: 1rem;
    transition: 0.2s;
}


.header-select.open svg {
    transition: 0.2s;
    transform: perspective(none) rotate(180deg);
}

.body-select{
    padding: 1rem;
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 400;
    height: 100%;
    position: relative;
    overflow-y: scroll;
    overflow-x: hidden;
    transition: 0.35s all;
    background: #505050;
}


.body-select.hide{
    height: 0%;
    max-height: 0;
    display: block;
    padding-bottom: 0;
    padding-top: 0;
}


.item-select-locations:not(:last-child) {
    margin-bottom: 1rem;
}


.choice-location {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-top: 0;
   gap: 1rem;
}

.checkbox-location[type=checkbox] {
   background: transparent;
   appearance: none;
   color: var(--default-color);
   height: 1.5rem;
   border: 2px solid currentColor;
   width: 1.5rem;
   cursor: pointer;
}

.checkbox-location:checked[type=checkbox] {
   background-image: url(/media/check.svg);
   background-size: 15px 15px;
   background-position: center;
   background-repeat: no-repeat;
}

.label-location {
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   text-transform: uppercase;
   letter-spacing: 2px;
   font-size: 18px;
}

.selected-locate{
    position:relative;
}

.locations-sel{
    display: flex;
    gap: 1rem;
    position: absolute;
    top: 0;
    z-index: 1;
}

.sel-l{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 16px;
    font-weight: 100;
    padding: 0.2rem 0.5rem;
    text-transform: uppercase;
    cursor: pointer;
    display: flex;
    border: 1px solid;
    z-index: 3;
    gap: 0.5rem;
    position: relative;
    align-items: center;
    align-content: center;
}

.sel-l svg {
    padding: 0;
    width: 1rem;
}

option{
    background:#fff;
}



.title-form{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 3px;
    font-size: 18px;
    margin: 0;
    font-weight: 400;
    margin-top: 4rem;
    text-transform: uppercase;
}





.disponabilities{
     display: flex;
     flex-direction: row;
     gap: 3rem;
     margin-top: 2rem;
}


.choice-disponibility {
   display: flex;
   flex-direction: row;
   align-items: center;
   margin-top: 0;
   gap: 0.5rem;
}

.checkbox-disponibility[type=checkbox] {
   background: transparent;
   appearance: none;
   color: var(--default-color);
   height: 2rem;
   border: 2px solid currentColor;
   width: 1rem;
   height: 1rem;
   cursor: pointer;
}

.checkbox-disponibility:checked[type=checkbox] {
   background-image: url(/media/check.svg);
   background-size: 10px 10px;
   background-position: center;
   background-repeat: no-repeat;
}

.label-disponibility {
   font-family: "Montserrat", sans-serif;
   color: var(--default-color);
   text-transform: uppercase;
   letter-spacing: 2px;
   font-size: 16px;
}

.label-c {
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 3px;
    font-size: 16px;
    margin: 0;
    font-weight: 400;
    margin-bottom: 0;
    margin-top: 1.5rem;
    text-transform: uppercase;
}


.radio-c{
    background: transparent;
   appearance: none;
   color: var(--default-color);
   border: 2px solid currentColor;
   width: 1rem;
   height: 1rem;
   cursor: pointer;
   border-radius:50% !important;
}

.form-check-input:checked[type=radio] {
    background-image: url('/media/circle.svg');
}
.form-check-input:checked {
    background-color: #ffffff;
    border-color: #ffffff;
}

.form-check-input:focus {
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgb(13 110 253 / 0%);
}





.esperienze{
    display: flex;
    margin-top: 3rem;
    flex-direction: column;
    gap:2rem;
}

.eperienza{
}

.head-esperienza{
    cursor: pointer;
    color: #fff;
    letter-spacing: 2px;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid currentColor;
    border-radius: 0px 0px 0px 0px;
    padding: 10px 0px 1rem 0px;
    display: flex;
    align-content: center;
    align-items: center;
    cursor: pointer;
    justify-content: space-between;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
    font-size: 1.5rem;
}



.open-close-esperienza > svg {
    fill: #000;
    transition: 0.2s;
    transform: rotateY(180deg) rotateZ(90deg);
    width: 2rem;
}

.open-close-esperienza > svg {
    fill: var(--default-color);
}


.open-close-esperienza.open > svg {
    transition: 0.2s;
    transform: perspective(none) rotate(-90deg);
}

.body-esperienza{
    font-family: "Montserrat", sans-serif;
    padding: 2rem 0;
    height: 100%;
    position: relative;
    overflow-y: scroll;
    overflow-x: hidden;
    transition: 0.35s all;
}

.body-esperienza.hide {
    height: 0%;
    max-height: 0;
    display: block;
    padding-bottom: 0;
    padding-top: 0;
}












.formazioni{
    display: flex;
    margin-top: 3rem;
    flex-direction: column;
    gap:2rem;
}

.formazione{
}

.head-formazione{
    cursor: pointer;
    color: #fff;
    letter-spacing: 2px;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid currentColor;
    border-radius: 0px 0px 0px 0px;
    padding: 10px 0px 1rem 0px;
    display: flex;
    align-content: center;
    align-items: center;
    cursor: pointer;
    justify-content: space-between;
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
    font-size: 1.5rem;
}



.open-close-formazione > svg {
    fill: #000;
    transition: 0.2s;
    transform: rotateY(180deg) rotateZ(90deg);
    width: 2rem;
}

.open-close-formazione > svg {
    fill: var(--default-color);
}


.open-close-formazione.open > svg {
    transition: 0.2s;
    transform: perspective(none) rotate(-90deg);
}

.body-formazione{
    font-family: "Montserrat", sans-serif;
    padding: 2rem 0;
    height: 100%;
    position: relative;
    overflow-y: scroll;
    overflow-x: hidden;
    transition: 0.35s all;
}

.body-formazione.hide {
    height: 0%;
    max-height: 0;
    display: block;
    padding-bottom: 0;
    padding-top: 0;
}


.send-button{
    background-color:#fff;
    margin-top: 3rem;
    width: 100%;
    display: flex;
    flex-direction: row;
    gap: 2rem;
    padding: 2rem 0;
    border: none;
    border-radius: 3rem;
    align-items: center;
    justify-content: center;
}


.send-button.assistance{
    width: fit-content;
    padding: 2rem 5rem;
}

.send-button svg{
    width: 1.5rem;
    height: 1.5rem;
}

.send-button span{
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 2px;
    font-size: 14px;
    color: #000;
}


.pseudo-accordion{
    margin-bottom: 30px; 
    font-family: "Montserrat", sans-serif;
    font-weight: 400;
    font-size: 2rem;
    line-height: 30px;
    letter-spacing: 2px;
    border-bottom: 2px solid currentColor;
    border-radius: 0px 0px 0px 0px;
    padding: 10px 0px 2rem 0px;
    display: flex;
    align-content: center;
    align-items: center;
    justify-content: space-between;
}




.button-add-attachment{
    padding:1rem;
    font-size:1rem;
    text-transform:uppercase;
    background-color:#1f1f1f;
    cursor:pointer;
}



/*MARGINS*/

.pb-0{
    padding-bottom:0;
}

.bb-1{
    border-bottom:1px solid #fff;
}

.pt-0{
    padding-top:0;
}



.pb-5{
    padding-bottom:5rem !important;
}




/*datepicker*/
.ui-widget.ui-widget-content {
    border: 1px solid #c5c5c5;
    background: #ffffff;
    padding: 0;
    width: min-content;
    border: 0;
    color: #000;
    border-radius: 0;
    z-index: 10 !important;
}






.ui-datepicker .ui-datepicker-title {
    margin: 0 2.3em;
    line-height: 1.8em;
    font-weight: 500;
    text-align: center;
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    color: #000000;
}


.ui-datepicker table {
    width: 100%;
    font-size: .9em;
    border-collapse: collapse;
    margin: 0 0 0.4em;
    padding: 2rem;
    display: block;
}



.ui-datepicker .ui-datepicker-header {
    position: relative;
    padding: 0;
    border: 0;
    padding: 1rem 0;
    background: #f6f6f6;
    border-radius: 0;
}


.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    position: absolute;
    top: 0;
    width: 4rem;
    height: 100%;
    cursor:pointer;
    padding: 1rem;
}


.ui-datepicker th {
    padding: 0.7em 0.3em;
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    border: 0;
    text-transform: uppercase;
    color: #000;
}


.ui-datepicker .ui-datepicker-prev.ui-state-hover, .ui-datepicker .ui-datepicker-next.ui-state-hover{
    border: 0;
    background: #ededed00;
    font-weight: normal;
    color: #2b2b2b;
}

.ui-datepicker .ui-datepicker-prev {
    left:0;
    transform: rotateY(180deg);
}

.ui-datepicker .ui-datepicker-next {
    right:0;
}

.ui-widget-header .ui-icon {
    background-image: url(/media/freccia_nera.svg);
    background-size: 100%;
    background-position: center center;
}

.ui-datepicker td {
    border: 0;
    padding: 5px !important;
}

.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
    display: block;
    left: 0;
    margin-left: 0;
    top: 0;
    width: 100%;
    margin-top: 0;
    height: 100%;
        position: relative;
}



/*BRAIN*/

.brain{
    position: relative;
    display: flex;
    right: 0;
    width: 100%;
    justify-content: flex-end;
    align-items: flex-start;
}

.brain img{
    width: 85%;
    opacity: 0.5;
    filter: blur(0px);
    transition: 0.2s;
}

.brain.blur img{
    filter: blur(10px);
}


.item-brain{
    position:absolute;
    width: 18rem;
    display:flex;
    color: var(--default-color);
    flex-direction: column;
}



.left{
    text-align:left;
}

.center{
    text-align:center;
}

.right{
    text-align:right;
}


.title-item-brain{
    font-family: "Montserrat", sans-serif;
    letter-spacing: 1px;
    font-size: 30px;
    position: relative;
    border-bottom: 1px solid;
    padding: 0 0 0.5rem 0;
}


.left .title-item-brain:before{
    content:'';
    position: absolute;
    background-image: url(/media/angolo.svg);
    width: 1rem;
    height: 1rem;
    bottom: -1rem;
    left: 0;
    background-size: cover;
    background-repeat: no-repeat;
}


.right .title-item-brain:before{
    content:'';
    position: absolute;
    background-image: url(/media/angolo.svg);
    right: 0;
    transform: rotateY(180deg);
    background-size: cover;
    background-repeat: no-repeat;
    width: 1rem;
    height: 1rem;
    bottom: -1rem;
}


.desc-item-brain{
    font-family: "Montserrat", sans-serif;
    text-transform:uppercase;
    letter-spacing: 2px;
    font-size: 12px;
    line-height: 22px;
    font-weight: 100;
    padding: 0.5rem 1rem 0 1rem;
}


.item-brain.pos-1{
    left: 2rem;
    top: 17rem;
}


.item-brain.pos-2{
    left: 5rem;
    top: 29rem;
}


.item-brain.pos-3{
    left: 21rem;
    bottom: -2rem;
}


.item-brain.pos-4{
    right: 7rem;
    top: 11rem;
}


.item-brain.pos-5{
    right: 10rem;
    top: 23rem;
}

.item-brain.pos-6{
    right: 20rem;
    bottom: 6rem;
}




/*CONTACT PAGE*/


.grid-address{
    display: flex;
    flex-direction: column;
}

.map-img{
    border: 1px solid;
}

.map-img img{
    width: 100%;
}

.item-address{
    border-top: 1px solid;
    border-left: 1px solid;
    padding: 4.92rem 2rem;
    padding-right: 20rem;
}

.item-address .title{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 18px;
    margin: 0;
    font-weight: 100;
    margin-bottom: 1rem;
    text-transform:uppercase;
}

.item-address .description{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 1.5rem;
    font-weight: 400;
    display: block;
    margin-bottom: 1rem;
}

.item-address .sub{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 16px;
    margin: 0;
    font-weight: 100;
    margin-bottom: 1rem;
    text-transform:uppercase;
}


.item-address:last-child{
    border-bottom: 1px solid;
}



.item-contact .sub{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 16px;
    margin: 0;
    font-weight: 100;
    margin-bottom: 1rem;
}


.item-contact .title{
    font-family: "Montserrat", sans-serif;
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 3px;
    color: var(--default-color);
    text-transform: uppercase;
}





/*ASSISTANCE*/


.grid-assistance{
    border: 1px solid;
    position:relative;
    margin-left: 3rem;
    margin-top: 3rem;
    transition:0.2s;
}

.flex-contact{
    display: flex;
    flex-direction: column;
}

.form-assistance{
    padding: 3rem 4rem;
    border: 1px solid;
    position: absolute;
    z-index: 10;
    width: 55vw;
    top: -3rem;
    left: -3rem;
    transition: 0.2s;
}

.contact-assistance{
    padding: 3rem 10rem;
    display: flex;
    position:relative;
    justify-content: flex-end;
    align-items: center;
    
        background: linear-gradient(to right, #4d4d4d7d 50%, #b2b7c300 50%);
    background-size: 200% 100%;
    background-position: right bottom;
    transition: 0.2s;
}

.contact-assistance:hover{
    background-position: left bottom;
}

.contact-assistance:not(:last-child){
    border-bottom: 1px solid;
}


.contact-assistance span {
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    color: var(--default-color);
    margin-left: 2.75rem;
    letter-spacing: 2px;
    z-index: 3;
    font-size: 14px;
    font-weight: 100;
}

.contact-assistance svg {
    width: 5rem;
    height: 5rem;
    background-color: #4d4d4d7d;
    border-radius: 50%;
    padding: 1rem;
}

.contact-assistance:after{
    width: 5rem;
    height: 5rem;
    position: absolute;
    background-color:#4d4d4d7d;
    top: 3rem;
    border-radius: 50%;
    transition: 0.1s;
    right: 15rem;
}

.contact-assistance:hover:after{
    width: 100%;
    height: 100%;
    border-radius:0;
    top:0;
    right:0;
   
}






/*CERTIFICATIONS*/




.officials-partner{
    padding: 1rem  0;
    position:relative;
    border:1px solid;
    display: flex;
    flex-direction: column;
    align-items: center;
    top: 4rem;
}


.officials-partner:before{
    content:'';
    width:3rem;
    height:1px;
    background-color:var(--default-color);
    position:absolute;
    bottom:3rem;
    left:-3rem;
}


.official-p{
    width: 10rem;
}



.square-official {
    position: absolute;
    border-left: 1px solid;
    border-top: 1px solid;
    height: 12.4rem;
    top: -3.4rem;
    left: -3rem;
}

.title-official {
    padding: 1rem 3rem;
    text-align: left;
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 14px;
    margin: 0;
    font-weight: 100;
    text-transform: uppercase;
    border-right: 1px solid;
}








/*LISTS*/

.rec-list{
    padding: 3rem;
    position: relative;
    border: 1px solid #fff;
    margin-left: 2rem;
    z-index: 2;
    margin-top: 4rem;
    background: var(--secondary-background-color);
}

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

.rec-list li{
    font-family: "Montserrat", sans-serif;
    letter-spacing: 1px;
    font-size: 16px;
    margin: 0;
    margin-bottom: 2rem;
    font-weight: 100;
    padding-left: 2.5rem;
    position: relative;
    text-transform: uppercase;
    color: var(--default-color);
}

.rec-list li:last-child{
    margin-bottom: 0rem;
}

.rec-list li:before{
    content: '';
    background-image: url(/media/freccia.svg);
    position: absolute;
    left: 0;
    top: 0;
    width: 1.5rem;
    height: 1.5rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}


.rec-vert-ab{
    position: absolute;
    width: 23.4rem;
    border-left: 1px solid #fff;
    border-top: 1px solid #fff;
    height: 17rem;
    top: 0;
    left: 13px;
    background: var(--secondary-background-color);
    z-index: 1;
}

.rec-vert-ab:before{
    content:'';
    position: absolute;
    width: 2rem;
    height:1px;
    bottom: 0;
    left: 0;
    background: #fff;
}


.title-list-rec {
    padding: 1.2rem 2rem;
    text-align: left;
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 16px;
    margin: 0;
    font-weight: 100;
    text-transform: uppercase;
    border-right: 1px solid;
}


.grid-icons{
    display:flex;
    flex-direction: column;
    margin-bottom: 3rem;
}

.grid-4{
    display:grid;
    grid-template-columns: 20% 20% 20% 20%;
    justify-content: center;
}

.grid-5{
    display:grid;
    grid-template-columns: 20% 20% 20% 20% 20%;
}

.icon-text{
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 2rem;
    opacity: 0.5;
    transition: 0.2s;
}

.icon-text:hover{
    opacity: 1;
}

.icon-text img{
    width: 100%;
    height: auto;
    
}

.icon-text span{
    text-align: center;
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 16px;
    font-weight: 100;
    text-transform: uppercase;
}






/*NEWS*/



.default .detail-news {
    padding: 4rem 3rem;
}


.default .detail-news .link-det-news {

    bottom: 1px;
    width: calc(100% - 1.3rem);
    left: 1.1rem;
}


.articles .row .col-12:nth-child(odd){
    
}

.articles .row .col-12:nth-child(even){
        justify-content: flex-end;
}


.grid-articles{
    display: grid;
    grid-template-columns: 28% 28% 28%;
    gap: 2rem;
}

.grid-articles:not(:last-child){
    margin-bottom:3rem;
}

.articles .detail-news{
    /* padding: 3rem 4rem 6rem 4rem; */
    /* min-height: 405px; */
}


.articles .detail-news .link-det-news{
    left: 1.4rem;
    bottom: 0;
    width: calc(100% - 1.9rem);
    padding: 0.85rem;
    padding-left: 2.5rem;
}


.articles{
    display:none !important;
}

.articles.show{
    display:flex !important;
}

/*.articles.hide{*/
/*    display:none !important;*/
/*}*/


.certs{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 2rem;
    margin-top: 2rem;
}

.certs img{
    width: 7rem;
    height: auto;
}



.menu-star{
    width: 100%;
    height: 100%;
    background-image: url(/media/angolo.svg);
    background-size: 100%;
    transition:0.2s;
}

.pos-star-1{
    transform: rotate(180deg);
}
.pos-star-2{transform: rotate(270deg);}

.pos-star-3{
    transform: rotate(90deg);
}

.pos-star-4{
    
}

/*..change{*/
/*    transform:rotate(45deg);*/
/*}*/

.change .pos-star-1, .change .pos-star-4{
    opacity:0;
}


.menu-mobile-sec{
display:none; 
}

.mobile-menu{
   display:none;
}



   
   .burger-menu {display: block;position: fixed;background: #000;top: 0;box-shadow: 0 0px 20px 3px #3232326b;right: 0;transition: 0.4s;z-index: -1;transform: translateY(-100%);width: 100%;height: 100%;}
   
   .open-menu {
       transform: translateY(0);
       z-index: 1000;
   }

   
  .menu-mobile{
      padding: 0;
      width: 100%;
      overflow-y: scroll;
      display: flex;
      grid-template-columns: auto;
      height: 100%;
      padding-bottom: 6rem;
      list-style:none;
      gap: 0;
      align-items: start;
      flex-direction: column;
      gap: 0;
  }
  
  .menu-mobile-sec {
      position: fixed;
      z-index: 1001;
      top: 6rem;
      height: 100%;
      left: 0;
      overflow-x: hidden;
      width: 100%;
      overflow-y: hidden;
      display: none;
      transform: translateX(0);
  }
  .menu-mobile-sec.show{
      display: block;
  }
  
  .show-menu .container .logo{
      z-index: 100001;
  }
  
  .change{
      z-index:10001;
  }
  
  .bgd-primary.show-menu{
      position: relative;
      z-index: 10001;
  }
  /*.bgd-nav.show-menu{*/
  /*    position: relative;*/
  /*}*/
  


  
    .cms-mobile:last-child{

      /*border-bottom: 1px solid #ffffff50;*/
  }
  
  
/*.cms-mobile:before {*/
/*    position: absolute;*/
/*    background-size: 100%;*/
/*    top: 1.5rem;*/
/*    opacity: 0;*/
/*    left: 1rem;*/
/*}*/
  
  
 .nav-item.active > a{
     color: #fff;
     /* padding-left: 4rem; */
     font-style: italic;
 }
 
  .nav-item.active > a:before{

     opacity: 1;
 }
 

 /*.nav-item.active > span, .nav-item:hover > span, .nav-item:focus > span{*/
 /*    border-left: 1rem solid;*/
 /*    color: #fff;*/
 /*    padding-left: 1.5rem;*/
 /*}*/

.nav-item:hover:after, .nav-item.active:after{
  
   width:0%;
}
  
  /*.cms-mobile.version-2{*/
  /*   height: 11rem;*/
  /*}*/
  
  
  /*.cms-mobile:after{*/
  /*}*/
  
  .menu-mobile .nav-item{
      margin-right: 0;
      overflow: hidden;
      position: relative;
      width: 100%;
  }
  
  .cms-mobile.animate__animated{
      animation-duration: 0.4s;
      --animate-delay: 0.1s;
  }

  
  .cms-mobile:hover{
      color: #ffffff;
  }
  
  /*.cms-mobile.active{*/
  /*    background-position: left bottom;*/
  /*    color: var( --primary-color);*/
  /*    border-color:var( --primary-color);*/
  /*}*/
  
   
    
    



.grid-single .col-12:not(:first-child){
    margin-top:3rem;
}

    
.m-t-2{
    margin-top:2rem !important;
}


.img-desktop{
    
}

.img-mobile{
    display:none;
}

.show-tablet{
    display:none;
}

.show-landscape{
    display:none;
}

.show-landscape-mini{
    display:none;
}

.nav-pr-tablet {
    justify-content: flex-end;
    margin-top: -6rem;
    flex-direction: row;
}



.open-assistance{
   border:0;
   margin: 0;
}


.open-assistance .form-assistance {
    width: 100%;
    position: relative;
    top: 0;
    left: 0;
    background: transparent;
    padding: 3.5rem 4rem;
}


.open-assistance .flex-contact {
    display: none;
}


.contact-asssitance{
    position:absolute;
    top:0;
    display: flex;
    right:0;
    width: 55%;
}

.contact-asssitance a{
       color: var(--default-color);
       font-family: "Montserrat", sans-serif;
       text-transform: uppercase;
       font-size: 11px;
       letter-spacing: 2px;
       padding: 1rem 2rem;
       transition: 0.2s;
       display: block;
       border-bottom: 1px solid;
       border-left: 1px solid;
       width: 100%;
       text-align: center;
}


.contact-asssitance a:hover{
       color: #000;
       background-color:var(--default-color);
      
}



.download-asssitance{
    position:absolute;
    bottom:0;
    left:0;
    background-color:var(--default-color);
    display: flex;
    flex-direction: row;
    gap: 2rem;
    padding: 1.5rem 0;
    border: none;
    width: 45%;
    align-items: center;
    justify-content: center;
}





.folders-assistance{
    display: grid;
    grid-template-columns: calc(25% - 3rem) calc(25% - 3rem) calc(25% - 3rem) calc(25% - 3rem);
    gap: 4rem;
    margin: 4rem 0rem;
    
}



.folder-assistance{
    cursor: pointer;
    position:relative;
    transition:0.2s;
    opacity: 0.5;
}

.folder-assistance:hover{
    opacity: 1;
}

.folder-assistance img{
    width: 100%;
}


.name-folder{
    font-size: 15px;
    margin: 0;
    font-weight: 500;
    color: var(--default-color);
    font-family: "Montserrat", sans-serif;
    letter-spacing: 1px;
    margin-top: 1rem;
    word-break: break-word;
}

.img-extension{
    position: absolute;
    bottom: 5rem;
    right: 1rem;
    width: 5rem;
}

.img-extension img{
    
}

.download-asssitance svg {
    width: 1.5rem;
    height: 1.5rem;
}

.download-asssitance span {
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 2px;
    font-size: 14px;
    color: #000;
}


.downloaded{
    transform:scale(1.15);
}


.info-certificate{
    background-color: #fff;
    margin-top: 0;
    width: fit-content;
    display: flex;
    flex-direction: row;
    gap: 2rem;
    padding: 2rem 3rem;
    border: none;
    border-radius: 3rem;
    align-items: center;
    justify-content: center;
}

.info-certificate svg {
    width: 1.5rem;
    height: 1.5rem;
}


.info-certificate span {
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 2px;
    font-size: 14px;
    color: #000;
}

.icon-empty{
    width:2rem !important;
}



.p-content ul{
    list-style: none;
    margin: 0;
    padding: 0;
    margin-top: 2rem;
}


.p-content li{
    font-family: "Montserrat", sans-serif;
    letter-spacing: 1px;
    font-size: 16px;
    margin: 0;
    margin-bottom: 1rem;
    font-weight: 100;
    padding-left: 2.5rem;
    position: relative;
    text-transform: uppercase;
    color: var(--default-color);
}

.p-content li:last-child{
    margin-bottom: 0rem;
}

.p-content li:before{
    content: '';
    background-image: url(/media/freccia.svg);
    position: absolute;
    left: 0;
    top: 0;
    width: 1.5rem;
    height: 1.5rem;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}


.grid-gallery{
	display: grid;
	grid-gap: 1rem;
	grid-template-columns: auto auto auto auto;
	grid-auto-rows: auto;
	grid-auto-flow: dense;
	margin-top:3rem;
}

.item-gallery-event{
    width:100%;
    height: 168px;
    cursor: pointer;
}
.item-gallery-event img{
    width: 100%;
	height: 100%;
	object-fit: cover;
}

.img-news-page{
    margin: 2rem 0;
    width: 50%;
    
}

.img-project-page{
    margin-bottom: 0;
    width: 100%;
    border-radius: 1rem;
    border: 1px solid #c2c2c2;
}

.title-image {
    text-transform: uppercase;
    font-family: "Montserrat", sans-serif;
    color: var(--primary-color);
    letter-spacing: 1px;
    font-size: 20px;
    font-weight: 300;
}


.title-image:not(:first-child){
    margin-top: 4rem;
}

.prev-case{
    transform: rotate(-225deg);
}

.next-case{
    transform: rotate(-45deg);
}

.detail-news{
    height: 100%;
    padding: 5rem;
    position: relative;
    gap: 1rem;
    display: flex;
    min-height: 445px;
    flex-direction: column;
    justify-content: flex-start;
    position:relative;
    cursor:pointer;
}

.detail-news:after{
    content:'';
    background-image: url(/media/card_news.svg);
    position: absolute;
    top: 0;
    left: 0;
    background-size: contain;
    width: 100%;
    height: 100%;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 1;
}

.detail-news:before {
    content: '';
    width: calc(100% - 4.5rem);
    left: 2.75rem;
    z-index: 0;
    transition: 0.2s;
    position: absolute;
    height: 4rem;
    bottom: 0;
    background: linear-gradient(to right, var(--default-color) 50%, #b2b7c300 50%);
    background-size: 200% 100%;
    background-position: right bottom;
}


.default .detail-news:before {
    content: '';
    width: calc(100% - 1.4rem);
    left: 1.2rem;
    bottom: 1px;
    height: 4rem;
}


.articles .detail-news .link-det-news {
    left: 1.4rem;
    bottom: 1rem;
    padding: 0.85rem;
    padding-left: 2.5rem;
}


.articles .detail-news:before {
    content: '';
    width: calc(100% - 1.3rem);
    left: 1.1rem;
    bottom: 1px;
    bottom: 0.9rem;
    height: 3.8rem;
    
}


.detail-news:hover:before {
    background-position: left bottom;
}

.detail-news:hover .link-det-news {
    color:#000;
}


.no-scroll-y-desktop{
        overflow-y: hidden;
}


.hero.work .container {
    gap: 1rem;
}

.page-404  canvas {
    top: 0;
    position: absolute;
    left: 0;
}

.black-v{
   background: linear-gradient(90deg, rgb(6 6 6) 75%, rgba(255,255,255,0) 100%); 
}

.send-message {
    width: 100%;
    height: 100%;
    background: #000000cc;
    position: fixed;
    top: 0;
    z-index: 999;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 2rem;
    opacity:0;
    visibility:hidden;
    transition:0.2s;
}

.show-message{
    opacity:1;
    visibility:visible;
}

.send-message p{
    font-family: "Montserrat", sans-serif;
    color: var(--default-color);
    letter-spacing: 1px;
    font-size: 2rem;
    margin: 0;
    font-weight: 400;
}

.link-more {
    display: flex;
    margin-top: 3rem;
    width: fit-content;
    position:relative;
    justify-content: flex-end;
    align-items: center;
}



.link-more .line{
   height: 2px;
   background-color: black;
   width: 5rem;
   transition:0.5s;
}

a.link-more:hover .line {
    width: 10rem;
}


.link-more img{
    height: 3rem;
    
    margin-left: -1.2rem;
}

.bottom-center {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: flex-end;
    margin-top: 5rem;
}

.grid-social{
    display: grid;
    align-items: center;
    grid-template-columns: auto auto auto;
}

.item-social {
    padding: 2rem;
    display: inline-flex;
    color: var(--secondary-color);
    font-family: "Montserrat", sans-serif;
    letter-spacing: 1px;
    justify-content: center;
    font-weight: 200;
    font-size: 18px;
    transition: 0.5s;
}

.item-social:not(:last-child) {

    border-right: 1px solid #ffffff50;
}


.item-social:hover {
    background-color:#fff;
    color:var(--primary-color);
}

.grid-footer{
    display: grid;
    grid-template-columns: 60% 40%;
    padding: 0;
    position: relative;
    border-bottom: 1px solid #ffffff50;
}

.grid-logos{
    display: grid;
    grid-template-columns: auto auto;
    border-top: 1px solid #ffffff50;
}

.grid-logos a{
    padding: 4rem;
    display: inline-flex;
}

.grid-logos a img{
    width: 100%;
}







.logo-grid{
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(5, calc(20% - 0.8rem));
    border-top: 1px solid #ffffff50;
}


.logo-grid a img{
    width: 100%;
}




.grid-brands{
    margin: 0 0rem;
    padding: 2rem 0;
}

.grid-brands a{
    padding: 0rem;
    display: inline-flex;
}

.grid-brands a img{
    width: 100%;
}

.box-project{
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    cursor: pointer;
}



.box-project:hover .box-img-project img {
    
    filter: grayscale(0);
    
}

.desc-project{width: 100%;padding: 0 1rem;}

.line-proect{
    height: 2px;
    background-color: var(--primary-color);
    width: 10%;
    top: 0.5rem;
    position: relative;
    transition: 0.2s;
}


.box-img-project{
    width: 100%;
    height: 450px;
    overflow: hidden;
}


.box-img-project img {
    object-position: center;
    width: calc(100% - 2rem);
    object-fit: cover;
    height: calc(100% - 2rem);
    border-radius: 20px;
    filter: grayscale(1);
    position: absolute;
    top: 1rem;
    left: 1rem;
    transition: 0.2s;
}




.box-img .swiper {
    object-position: center;
    width: calc(100% - 2rem);
    object-fit: cover;
    height: calc(100% - 2rem);
    border-radius: 20px;
    filter: grayscale(1);
    position: absolute;
    top: 1rem;
    left: 1rem;
    transition: 0.2s;
}


.box-img .swiper img {
    width: calc(100% - 2rem);
    height: calc(100% - 2rem);
    border-radius: 20px;
    top: 1rem;
    left: 1rem;
}


.slide-cases:hover .box-img-project img {
    
    filter: grayscale(0);
    
}










.quadri-element-slide {
    display: grid;
    grid-template-columns: 50% 50%;
    height: 100%;
    position: relative;
    padding: 0;
}



.quadri-element-slide div {
    /* border: 1px solid #fff; */
    /* border-radius: 20px; */
    transition:0.2s;
}

.quadri-element-slide .sq-1 {
    clip-path: polygon(0 30%, 0 0, 30% 0);
    border-top: 2px solid currentColor;
    border-left: 2px solid currentColor;
    border-top-left-radius: 20px;
}



.quadri-element-slide .sq-2 {
    clip-path: polygon(100% 30%, 100% 0, 70% 0);
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
    border-top-right-radius: 20px;
}



.quadri-element-slide .sq-3{
    clip-path: polygon(0 70%, 0% 100%, 30% 100%);
    border-bottom: 2px solid currentColor;
    border-left: 2px solid currentColor;
    border-bottom-left-radius: 20px;
}




.quadri-element-slide .sq-4 {
    clip-path: polygon(100% 70%, 100% 100%, 70% 100%);
    border-bottom: 2px solid currentColor;
    border-right: 2px solid currentColor;
    border-bottom-right-radius: 20px;
}











.img-project{
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 100%;
    transition: 0.2s;
}

.box-project:hover .box-img-project .img-project{
    transform:scale(1.2);
}


.title-project{
    margin: 0;
    font-family: "Montserrat", sans-serif;
    font-weight: bold;
    font-size: 20px;
    line-height: 20px;
    letter-spacing: 1px;
    margin-bottom: 0.5rem;
}


.address-project{
    font-size: 18px;
    line-height: 18px;
    margin-bottom: 0.5rem;
    font-family: "Montserrat", sans-serif;
    font-weight: 300;
    letter-spacing: 0px;
}


.year-project{
    font-size: 18px;
    line-height: 18px;
    font-family: "Montserrat", sans-serif;
    font-weight: 300;
    margin: 0;
}



.box-project:hover .desc-project .line-proect{
    width: 20%;
}

.nav-link{
   font-size: 12px;
   line-height: 12px;
   padding: 0px 2rem 2rem 2rem;
   transition:0.2s;
   padding-bottom: 1.5rem;
   display: flex;
   letter-spacing: 1px;
   gap: 1rem;
   align-items: flex-start;
}

.menu-item svg{
   stroke:#fff;
   width: auto;
   stroke-width: 100px;
   height: 10px;
   transition:0.2s transform;
}


.menu-item:hover svg{
    stroke-width: 100px;
}

.menu-item svg.open{
   transform: rotate(-90deg);
}

.menu-scroll .navigation-bar .menu-item svg{
   stroke: #fff;
}

.menu-scroll .navigation-bar .menu-item .dropdown-menu{
   top: 2.85rem;
   background: #000;
}

    
    
    
.menu-scroll .navigation-bar .menu-item .dropdown-menu  .sub-menu .nav-item .nav-link.cms {
    color: #ffffff90;
    fill: #ffffff90;
}

.menu-scroll .navigation-bar .menu-item .dropdown-menu .sub-menu .nav-item .nav-link.cms:hover{
    color: #fff;
    fill: #fff;
}

.right-footer{
        border-left: 1px solid #ffffff50;
}

.grid-contact{
    
}



.slides {
	width: 100%;
	height: 100vh;
	overflow: hidden;
	display: grid;
	grid-template-rows: 100%;
	grid-template-columns: 100%;
	place-items: center;
}

.slide {
	width: 100%;
	height: 100%;
	grid-area: 1 / 1 / -1 / -1;
	pointer-events: none;
	opacity: 0;
	overflow: hidden;
	position: relative;
	display: grid;
	place-items: center;
	will-change: transform, opacity;
}

.slide--current {
	pointer-events: auto;
	opacity: 1;
}

.slide__img {
	width: 100%;
	height: 100%;
	background-size: cover;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	will-change: transform, opacity, filter;
}


.mobile-content {

}

.b-t{
    border-top:2px solid #000;
}

.pt-7{
    padding-top: 7rem;
}


span.link-more {
    transform: translateX(-120%);
    transition: 0.2s;
    opacity: 0;
}

span.link-more.show {
    transform: translateX(0%);
    opacity: 1;
}

.link-more  .h2-c{
    margin-bottom:0;
    margin-left:3rem;
}

.menu-scroll .navigation-bar .menu-item .nav-link {
    padding-bottom: 1.5rem;
}
.black-menu .navigation-bar .menu-item .nav-link {
    padding-bottom: 1.5rem;
}

.black-menu .navigation-bar .menu-item{padding-top: .6rem;}


.black-menu{
    transition:0.2s;
}

.black-menu.menu-scroll{
    border-bottom: 1px solid #00000020;
}


.box-team{
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    cursor: pointer;
    transition: 0.5s ease-in-out;
    transform: translateY(0%);
    opacity: 1;
}


.box-team.hide-box{
    
     transform: translateY(100%);
    opacity: 0;
}



.desc-team{display: flex;gap: 0;align-items: flex-start;margin-bottom: 2rem;flex-direction: column;}

.img-team{
    background-size: cover;
    background-position: center;
    width: 100%;
    height: 500px;
}

.title-team{
    margin: 0;
    font-family: "Montserrat", sans-serif;
    font-weight: 500;
    font-size: 20px;
    line-height: 20px;
    letter-spacing: 1px;
    margin-bottom: 0.5rem;
    font-style: italic;
}


.address-team{
    font-size: 18px;
    line-height: 18px;
    margin-bottom: 0.5rem;
    font-family: "Montserrat", sans-serif;
    font-weight: 300;
    letter-spacing: 0px;
    font-style: italic;
}

.black-menu .navigation-bar .menu-item .dropdown-menu .sub-menu .nav-item.active .nav-link.cms {
    color: #fff;
    fill: #fff;
}









.send-request {
    font-size: 14px;
    color: var(--secondary-color);
    font-family: "Montserrat", sans-serif;
    letter-spacing: 0px;
    margin: 0;
    font-weight: 700;
    padding: 0.75rem 1rem;
    border: 2px solid #fff;
    background: transparent;
    gap: 2rem;
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: 0.2s;
    margin-top: 2rem;
}

.send-request:hover {
    background: #fff;
    color: #000;
}




.send-request:hover svg {
    transform: rotate(-90deg);
}
.send-request svg {
    stroke: currentColor;
    width: auto;
    stroke-width: 100px;
    height: 15px;
    fill: transparent;
    transition: 0.2s transform;
}



.send-request .line{
   height: 2px;
   background-color: black;
   width: 5rem;
   transition:0.5s;
}

.send-request:hover .line {
    width: 10rem;
}


.send-request img{
    height: 2rem;
    margin-left: -0.75rem;
}



.send-request span{
    margin-left: 0;
    font-style:italic;
}

select.input-c {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url(/media/giu.svg);
    background-repeat: no-repeat;
    background-position: right;
    background-size: 20px;
}

/*.cms-body-accordion .h5-c{*/
/*    margin-top:2rem;*/
/*}*/


.title-form-careers{
    line-height: 4rem;
    color: #000;
    font-family: "Montserrat", sans-serif;
    font-size: 4rem;
    letter-spacing: 2px;
    font-weight: 400;
}

.send-request.candidatura{
    font-size:2rem;
}

.send-request.candidatura img {
    height: 2rem;
    margin-left: -0.75rem;
}

.send-request .line {
    height: 1.5px;
}

.pt-5 {
    padding-top: 5rem;
}

.grid-text{
    display: grid;
    grid-template-columns: auto auto;
    gap: 4rem;
}

.menu-item.active svg {
    stroke-width: 60px;
}


.hero-project{
    /* height: 70vh; */
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 10rem 0px 3rem 0px;
    background-image: url(/media/disturbo-nero.jpg);
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
}

.hero-project .h1-c{
    color: #fff;
    font-weight: normal;
}

.date-project{
    font-family: "Montserrat", sans-serif;
    font-weight: 100;
    color: #fff;
    letter-spacing: 0.5px;
    font-size: 2rem;
    margin: 0;
}

.grid-feature{
    display: grid;
    grid-template-columns: 59% auto;
    gap: 10rem;
}


.features-project{
    display: grid;
    grid-template-columns: auto auto auto auto auto;
    gap: 2rem;
    margin-top: 3rem;
}

.item-feature{
    padding: 0;
    padding-left: 2rem;
    border-left: 2px dotted #ffffff51;
}


.item-feature:last-child{
    border-bottom: 1px solid #0000001c;
}


.title-feature{
    margin:0;
    font-family: "Montserrat", sans-serif;
    color: var(--primary-color);
    letter-spacing: 1px;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.desc-feature{
    margin:0;
    font-family: "Montserrat", sans-serif;
    color: var(--primary-color);
    letter-spacing: 1px;
    font-size: 16px;
    font-weight: 300;
}


.mansory-grid-image{
    display: grid;
    grid-gap: 2rem;
    grid-template-columns: repeat(auto-fit, minmax(195px, 1fr));
    grid-auto-rows: 350px;
    grid-auto-flow: dense;
}


.mansory-grid-image .tall {
	grid-row: span 2;
	grid-column: span 2;
}
.mansory-grid-image .big {
	grid-column: span 4;
	grid-row: span 2;
}

.mansory-grid-image img{
    cursor:pointer;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 1rem;
    object-position: center;
}

.arrow-prev {
}

.slide-cases:hover .desc-project .line-proect{
    width: 10%;
}


.nav-gallery {
    text-align: center;
    display: block;
    width: fit-content;
    transition: 0.5s all;
    font-family: "Montserrat", sans-serif;
    color: #fff;
    letter-spacing: 3px;
    margin: 0;
    font-weight: 400;
    padding: 0;
    text-transform: uppercase;
    background-color: transparent;
    cursor: pointer;
    width: 1.5rem;
}


.nav-gallery > svg {
   width: 20px;
   stroke: currentColor;
   stroke-width: 100px;
   height: 20px;
   fill: transparent;
   transition: 0.2s transform;
   color: currentColor;
}

.subtitle {
    font-size: 1.5rem;
    line-height: 1.5rem;
}

.date-project {
    font-size: 1.5rem;
    line-height: 1.5rem;
}

  .cms-mobile{
      font-size: 2.5rem;
      color: rgb(255 255 255 / 35%);
      margin-bottom: 0;
      letter-spacing: 1px;
      padding: 1rem 2rem;
      position:relative;
      font-weight: 400;
      flex-direction: row;
      align-items: center;
      line-height: 2.5rem;
      font-family: "Montserrat", sans-serif;
      text-transform: capitalize;
      transition: 0.1s;
      border:0;
      /*border-top: 1px solid #ffffff50;*/
      display: block;
      position: relative;
      white-space: nowrap;
      width: 100%;
      font-family: "Montserrat", sans-serif;
      font-weight: 500;
  }
  
.cms-mobile:after {
    content: '';
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    background: #000;
    z-index: 99;
    height: 0;
    transition: 0.5s;
}
  .cms-mobile.hide:after{
      height: 100%;
  }
  
  .has-sub span{
      display: flex;
    justify-content: space-between;
    align-items: center;
  }
  
  .has-sub svg{
      width: auto;
      height: 2rem;
      opacity: .35;
      transform: rotate(0deg);
      transition:0.2s;
      stroke: #fff;
      stroke-width: 100px;
  }
  
.has-sub.change svg{
    opacity: 1;
    transform: rotate(-90deg);
  }
  
  
  .dropdown-menu-mobile  {
    height: 0%;
    max-height: 0;
    display: block;
    padding-bottom: 0;
    padding-top: 0;
    padding: 0 2.5rem 0;
}


.has-sub.change .dropdown-menu-mobile {
    height: 100%;
    position: relative;
    overflow-y: scroll;
    padding: 0  2.5rem 2.5rem;
    overflow-x: hidden;
    transition: 0.2s all;
    max-height: fit-content;
    
}
    
    


.dropdown-menu-mobile .sub-menu {
    position:relative;
    padding: 0;
}


.dropdown-menu-mobile .sub-menu .nav-item{
    margin:0;
}

.dropdown-menu-mobile .sub-menu .nav-item .nav-link.cms{
    color: #fff7;
    fill: #fff7;
    margin: 0;
    border: 0;
    padding: .5rem 0;
    transition: 0.1s all;
}

.dropdown-menu-mobile .sub-menu  .nav-item .nav-link.cms:hover{
    color: #fff;
    fill: #fff;
    /* border-left: 3px solid; */
}

.slide-video{
    height: 95vh;
    background-image:url('/media/disturbo-nero.jpg');
    display: flex;
    padding: 7rem 0;
    align-items: flex-end;
    position:relative;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    /*background: linear-gradient(0deg, rgb(0 0 0 / 70%), rgb(0 0 0 / 70%)), url(/media/basilica_inferiore_sfrancesco_assisi_cappella_s_martino_cover.jpg);*/
}
.hero-video{
        position: absolute;
    top: 0;
    z-index: 8;
    width: 100%;
    height: 100%;
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    object-fit: cover;
    filter: brightness(0.7);
}

.slide-video .container{
    z-index:9;
}
.white-content{
    background-image:url('/media/disturbo-bianco-sporco.jpg');
    border-radius: 50px;
    z-index: 9;
}

.black-content{
    background-image:url('/media/disturbo-nero.jpg');
    z-index: 8;
    padding: 12rem 0;
}

.grid-counter{
    display: grid;
    grid-template-columns: repeat(4, 25%);
    justify-content: space-around;
}

.item-counter{
    text-align: center;
}

.item-counter p{
    margin:0;
    
}

.number-counter{
    font-family: "Montserrat", sans-serif;
    font-size: 6rem;
    font-weight: 700;
    line-height: 6rem;
}

.number-counter sup {
    top: -1em;
    left: 0.5rem;
    font-size: 3rem;
    font-weight: 100;
}

.desc-counter{
    font-family: "Montserrat", sans-serif;
    text-transform: uppercase;
    font-weight: 300;
    letter-spacing: 2px;
}

.white-color-content{
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    background-color:#fff;
    z-index: 7;
}



.black-color-content{
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    background-color:#000;
    z-index: 6;
}





.box-footer{
    
}



.text-copyright{
    font-size: 12px;
    color: var(--secondary-color);
    font-family: "Montserrat", sans-serif;
    letter-spacing: 2px;
    margin: 0;
    font-weight: 200;
}

.box-slide{
    
}


.text-slide{
    font-size: 16px;
    color: var(--secondary-color);
    font-family: "Montserrat", sans-serif;
    letter-spacing: 2px;
    margin: 0;
    font-weight: 200;
    text-transform:uppercase;
    margin-bottom: 2rem;
}


.buttons-slide{
    display: flex;
    gap: 1rem;
}

.buttons-slide a{font-size: 14px;color: var(--secondary-color);font-family: "Montserrat", sans-serif;letter-spacing: 0px;margin: 0;font-weight: 700;padding: 0.75rem 1rem;border: 2px solid #fff;gap: 2rem;border-radius: 10px;display: flex;justify-content: space-between;align-items: center;transition:0.2s;}

.buttons-slide a svg {
    stroke: currentColor;
    width: auto;
    stroke-width: 100px;
    height: 15px;
    fill: transparent;
    transition:0.2s transform;
}

.white-button{
    
}

.buttons-slide a:hover{
    background:#fff;
    color:#000;
}

.buttons-slide a:hover svg{
    transform:rotate(-90deg);
}

.box-img {
    height: 600px;
    width: 100%;
    scale: min(calc(var(--progress) + 0.5), 0.8);
}




.quadri-element {
    display: grid;
    grid-template-columns: 50% 50%;
    height: 100%;
    position: relative;
    padding: 1rem;
}



.quadri-element div {
    /* border: 1px solid #fff; */
    /* border-radius: 20px; */
    transition:0.2s;
}

.quadri-element .sq-1 {
    clip-path: polygon(0 30%, 0 0, 30% 0);
    border-top: 2px solid #fff;
    border-left: 2px solid #fff;
    border-top-left-radius: 20px;
}



.quadri-element .sq-2 {
    clip-path: polygon(100% 30%, 100% 0, 70% 0);
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    border-top-right-radius: 20px;
}



.quadri-element .sq-3{
    clip-path: polygon(0 70%, 0% 100%, 30% 100%);
    border-bottom: 2px solid #fff;
    border-left: 2px solid #fff;
    border-bottom-left-radius: 20px;
}




.quadri-element .sq-4 {
    clip-path: polygon(100% 70%, 100% 100%, 70% 100%);
    border-bottom: 2px solid #fff;
    border-right: 2px solid #fff;
    border-bottom-right-radius: 20px;
}










.quadri-element:hover .sq-1 {
    /*clip-path: polygon(0 100%, 0 0, 30% 0);*/
    /*border-top-left-radius: 50px;*/
}

.quadri-element:hover .sq-2 {
    /*clip-path: polygon(100% 100%, 100% 0, 70% 0);*/
    /*border-top-right-radius: 50px;*/
    
}

.quadri-element:hover .sq-3{
    /*clip-path: polygon(0 70%, 0% 100%, 100% 100%);*/
    /*border-bottom-left-radius: 50px;*/
}


.quadri-element:hover .sq-4 {
    /*clip-path: polygon(100% 70%, 100% 100%, 100% 100%);*/
    /*border-bottom-right-radius: 50px;*/
}





.box-img img{
    object-position: center;
    width: calc(100% - 4rem);
    object-fit: cover;
    height: calc(100% - 4rem);
    border-radius: 20px;
    filter: grayscale(1);
    position: absolute;
    top: 2rem;
    left: 2rem;
    transition:0.2s;
}   




/*.quadri-element:hover img{*/
/*    border-radius: 50px;*/
/*}*/














/*image comparisation*/


.comparison-slider-wrapper {
  position: relative;
  width: 100%;
  margin: 20px 0;
  background-color: white;
}
.comparison-slider-wrapper .comparison-slider {
  position: relative;
  width: 100%;
  margin: 0;
  border: 5px white solid;
  box-sizing: border-box;
}
.comparison-slider-wrapper .comparison-slider > img {
  width: 100%;
  height: auto;
  display: block;
}
.comparison-slider-wrapper .comparison-slider .overlay {
  display: none;
  position: absolute;
  width: 250px;
  bottom: 20px;
  right: 20px;
  background-color: rgba(0, 0, 0, 0.4);
  padding: 10px;
  box-sizing: border-box;
  color: #DDD;
  text-align: right;
}

.comparison-slider-wrapper .comparison-slider .resize {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 50%;
  overflow: hidden;
}
.comparison-slider-wrapper .comparison-slider .resize > img {
  display: block;
}
.comparison-slider-wrapper .comparison-slider .resize .overlay {
  right: auto;
  left: 20px;
  text-align: left;
}
.comparison-slider-wrapper .comparison-slider .divider {
  position: absolute;
  width: 2px;
  height: 100%;
  background-color: rgb(0 0 0);
  left: 50%;
  top: 0;
  bottom: 0;
  margin-left: -1px;
  cursor: ew-resize;
}
.comparison-slider-wrapper .comparison-slider .divider:before {
  content: "";
  position: absolute;
  width: 20px;
  height: 20px;
  left: -9px;
  top: 50%;
  margin-top: -10px;
  background-color: black;
  /* transform: rotate(45deg); */
  transition: all 0.1s ease-in-out;
  border-radius: 50%;
}
.comparison-slider-wrapper .comparison-slider .divider:after {
  /* content: ""; */
  position: absolute;
  width: 12px;
  height: 12px;
  left: -5px;
  top: 50%;
  margin-top: -6px;
  background-color: white;
  transform: rotate(45deg);
  transition: all 0.1s ease-in-out;
}
.comparison-slider-wrapper .comparison-slider .divider.draggable:before {
  width: 30px;
  height: 30px;
  left: -14px;
  margin-top: -15px;
}
.comparison-slider-wrapper .comparison-slider .divider.draggable:after {
  width: 20px;
  height: 20px;
  left: -9px;
  margin-top: -10px;
  background-color: #555;
}
.comparison-slider-wrapper .caption {
  position: relative;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
  font-size: 12px;
  font-style: italic;
}

.mega-button{
    position: relative;
    width: 100%;
    display: block;
    padding: 0.5rem;
    transition: 0.3s;
    font-family: "Montserrat", sans-serif;
    letter-spacing: 0px;
    font-weight: 700;
        font-size: 14px;
    color:#000;
}

.mega-button.v_2{
    display: block;
    position: absolute;
    width: calc(100% - calc(var(--bs-gutter-x)* 1));
    left: 0;
    top: 0;
    margin: 0 calc(var(--bs-gutter-x)* .5);
}

.h_65{
    height:65px;
}


.content-mega-button svg {
    stroke: currentColor;
    width: auto;
    stroke-width: 100px;
    height: 15px;
    fill: transparent;
    transition: 0.2s transform;
}

.mega-button:hover{padding: 1rem;}


.mega-button:hover .content-mega-button svg{
    transform: rotate(-45deg);
}

.mega-button:after{
    content:'';
    width: 100%;
    position: absolute;
    display: block;
    border-bottom: 2px solid;
    border-left: 2px solid;
    border-right: 2px solid;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    height: 1rem;
    border-color: currentColor;
    bottom: 0;
    left: 0;
    z-index: 9;
}


.mega-button:before{
    content:'';
    width: 100%;
    position: absolute;
    display: block;
    border-top: 2px solid;
    border-left: 2px solid;
    border-right: 2px solid;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    height: 1rem;
    border-color: currentColor;
    top: 0;
    left: 0;
    z-index: 9;
}

.content-mega-button{background: #b5b5b557;text-align: center;height: 100%;min-height: 3rem;display: flex;justify-content: center;border-radius: 10px;align-items: center;box-shadow: inset 0 0 0px 10px #00000000; gap:1rem;}

.content-mega-button span{
    
}

.align-external{
    display: flex;
    justify-content: space-between;
}

.bar-progress-swipers{
    position:relative;
    background:#00000080;
    width:40rem;
    height:5px;
    border-radius:10px;
}

.progress-status{
    position:absolute;
    background:#000;
    top:0;
    left:0;
    height:5px;
    border-radius:10px;
    transition:0.2s;
    width: 0;
}

.mx-h-160{
    padding-bottom: 8rem;
}

.grid-projects{
    display:grid;
    gap: 2.5rem;
    /*grid-template-columns: auto auto;*/
    margin-bottom:5rem;
    grid-template-columns: repeat(auto-fit, minmax(195px, 1fr));
    grid-auto-rows: auto;
    grid-auto-flow: dense;
}

.grid-projects .tall {
	grid-row: span 2;
	grid-column: span 2;
}
.grid-projects .big {
	grid-column: span 3;
	grid-row: span 2;
}





body.product_page .p-content{
    color:#000;
}

.product_page .footer_2{
    background:transparent;
}

.page-post{
    border-radius: 50px;
    background-color: #fff;
    z-index: 10;
    position:relative;
    padding-bottom: 10rem;
}

.page-post .content-page {
    padding: 3rem 0 0 0;
    position: relative;
    margin-top: 0;
}

body.product_page .p-content.white{
   color: #fff;
}

.item-feature .p-content p{
    margin:0;
    font-size: 14px;
}

.white{
   color: #fff;
}

.last-content {
   padding-bottom: 8rem;
}

.aling-ver-center{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.grid-about {
    display: grid;
    grid-template-columns: 50% auto;
    gap:5rem;
}

.grid-about.reverse {
    grid-template-columns: auto 50%;
    margin-bottom: 6rem;
}

.first-content {
    padding-top: 17rem;
}

.black-content.v_2{
    border-bottom-left-radius: 50px;
    border-bottom-right-radius: 50px;
    z-index:10;
}


.grid-contacts{
    display: flex;
    gap: 2rem;
    justify-content: space-between;
}

.item-contact {
    padding: 0;
    padding-left: 0;
}



.title-contact{
    margin:0;
    font-family: "Montserrat", sans-serif;
    color: var(--primary-color);
    letter-spacing: 1px;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    margin-bottom: 1rem;
}

.desc-contact{
    margin:0;
    font-family: "Montserrat", sans-serif;
    color: var(--primary-color);
    letter-spacing: 1px;
    font-size: 16px;
    font-weight: 300;
}

.divider-contact{
    width: 2px;
    border-right: 2px dotted #000;
}

.message-contact {
    position: absolute;
    padding: 1rem;
    text-align: center;
    width: fit-content;
    color: #000;
    font-family: "Montserrat", sans-serif;
    letter-spacing: 0;
    font-size: 16px;
    font-weight: 400;
    bottom: -3rem;
    background: #fff;
    right: 12px;
    line-height: normal;
    z-index: 9;
    display: flex;
    gap: 0.5rem;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    border-radius:5px !important;
}

.message-contact.show-message{
    opacity:1;
    visibility:visible;
    -webkit-animation-duration: 0.5s;
     animation-duration: 0.5s;
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
     -webkit-animation-name: pulse;
     animation-name: pulse;
     -webkit-animation-timing-function: ease-in-out;
     animation-timing-function: ease-in-out;
}

.message-contact.close-message{
    -webkit-animation-duration: 0.5s;
     animation-duration: 0.5s;
     -webkit-animation-fill-mode: both;
     animation-fill-mode: both;
     -webkit-animation-name: rightExit;
     animation-name: rightExit;
     -webkit-animation-timing-function: ease-in-out;
     animation-timing-function: ease-in-out;
}


.list-arrow {
    list-style: none;
    margin-top: 1rem;
    margin-bottom: 0;
    gap: 2rem;
    display: flex;
    flex-direction: column;
}

.list-arrow > li {
    position: relative;
}

.list-arrow > li::before {
    content: '';
    top: 0.8rem;
    left: -2rem;
    transform:rotate(45deg);
    background-image: url(/media/arrow_up_neg.svg);
    position: absolute;
    width: 2rem;
    height: 1rem;
    background-repeat: no-repeat;
}

.list-arrow .t-list {
    color: #fff;
    font-family: "Montserrat", sans-serif;
    font-weight: 500;
    letter-spacing: 1px;
    margin-left: 1rem;
    font-size: 18px;
    text-transform: uppercase;
}

.grid-team{display: flex;flex-wrap: wrap;justify-content: center;gap: 3rem;padding: 20px;color: #fff;}

.grid-item {
  flex: 0 0 auto;
  width: calc(33.333% - 2rem);
  border-radius: 10px;
  overflow: hidden;
}

.label-image{
        text-align: left;
        margin-top: 1rem;
        font-weight: 500;
}

.swiper-pagination{
    bottom: 2rem !important;
    left: 0rem !important;
    width: 100% !important;
    text-align: center !important;
    
    
    
    
    !i;
    !;
    
    
    
    
    !I;
    !;
}


.swiper-pagination-bullet{
    opacity:0.5;
    background:#fff;
    width: 13px;
    height: 13px;
    border: 1px solid #000;
    cursor: pointer;
}

.swiper-pagination-bullet.swiper-pagination-bullet-active{
    opacity:1;
    background:#fff;
}

.p-content iframe{
    width:100% !important;
    height:500px !important;
    border-radius: 1rem !important;
}

.p-content .sketchfab-embed-wrapper p{
    text-align: left !Important;
    margin-top: 1rem !Important;
    font-weight: 500 !Important;
    color:#000 !Important;
    font-size: 16px !important;
    text-transform: uppercase;

}

.p-content .sketchfab-embed-wrapper a{
    text-align: left !Important;
    margin-top: 1rem !Important;
    font-weight: 500 !Important;
    color:#000 !Important;
    font-size: 16px;
    text-transform: uppercase;
}

.grid-certificate{
        margin-top: 1rem;
    margin-bottom: 2rem;
    display: grid;
    grid-template-columns: auto auto;
    gap: 1rem;
}

.grid-certificate img{
    width: 100%;
    filter: grayscale(1);
}