.sticky {
    transform: translateZ(0);
    -moz-transform: translatez(0);
    -ms-transform: translatez(0);
    -o-transform: translatez(0);
    -webkit-transform: translateZ(0);
}

:root {
    --gray_kerberos: #595959;
    --orange_kerberos: #ef7f1a;
    --orange-light: #FFE8E0;
    --gray-light: #F8F9FA;
    --text-primary: #2D3748;
    --border-gradient: linear-gradient(to right, #898989 0%, #898989 100%);
    --sphere-size: 0px;
    --sphere-opacity: 0;
    --sphere-position: 0%;
    --primary-color: #2563eb;
    --primary-color-darker: #001457;
    --secondary-color: #6b7280;
    --background-light: #f9fafb;
    --text-primary: #111827;
    --text-secondary: #6b7280;
    --accent-color: #ea580c;
    --accent-color-darker: #c2410c;
    --box-shadow-color: rgba(0, 0, 0, 0.08);
}

body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.nav > li > a {
    padding: 10px 10px;
}

div.container {
    position: relative;
}

.tab-content-container {
    min-height: 63.6px;
}

.home .tab-content-container {
    height: 130px;
}

.tab-content-filter {
    padding: 20px 0;
}

a:not(.btn):hover, a:not(.btn):visited {
    color: inherit;
}

.sticky-menu:not(.maggiordomo) a:hover, .sticky-menu:not(.maggiordomo) a:visited {
    color: #FFF;
}

div.home-section {
    padding: 30px 15px;
}

.top-bar .social-icons li {
    border: none !important;
    width: auto;
    margin: 5px;
    text-align: center;
    color: #7F8183;
}

.top-bar .social-icons li i {
    font-size: 17px;
    line-height: 22px;
    color: #7F8183;
}

.top-bar .social-icons li a i {
    -webkit-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out;
}
.top-bar .social-icons li a:hover i {
    -webkit-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out;
}

.top-bar .social-icons li a:hover i {
    color: var(--gray_kerberos);
}


.top-bar .social-icons li main:hover  {
    color: #7F8183;
}

.top-bar .social-icons li:first-child i {
    margin: 0px;
}


.breadcrumbs label.actual {
    color: var(--gray_kerberos);
}

/*#region FolderStyleTab*/

.w3-button {
    padding: 0;
}

.w3-container {
padding-left: 0;
}

.nav-tabs.tabs-home {
display: flex;
}

.nav-tabs.tabs-home > li > a, .nav-tabs.tabs-home > li > a:visited {
    text-decoration: none;
    outline: none;
}

.nav-tabs.tabs-home > li > a {
    border-top-left-radius: 0;
    border: none;
    border-bottom: none;
    display: flex;
    align-items: center;
}

.tab-content.tab-content-menu {
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.2);
    position: relative;
    display: inline-block;
}

#myTabContent::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--border-gradient);
}

/* Stile per la sfera */
#myTabContent::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: var(--sphere-position, -10px);
    width: var(--sphere-size, 0px);
    height: var(--sphere-size, 0px);
    background: var(--orange_kerberos);
    border-radius: 50%;
    transition: width 0.5s ease, height 0.5s ease, opacity 0.5s ease;
    opacity: var(--sphere-opacity, 0);
    z-index: 10;
    transform: translate(-50%, 40%);
}

.tab-content.maggiordomo, #maggiordomo.tab-pane {
    background-color: var(--gray_kerberos);
}

.sticky.tab-content.maggiordomo, .sticky #maggiordomo.tab-pane {
    background-color: var(--gray_kerberos);
}


.tab-content.kerberos, #kerberos.tab-pane {
    background-color: #ffffff;
}

.nav-tabs.tabs-home > .active {
    position: relative;
}

.nav-tabs.tabs-home > li.active > a {
    color: #777;
    border-color: var(--orange_kerberos);
}

.nav-tabs.tabs-home > li.active > a:before,
.nav-tabs.tabs-home > li.active > a:after {
    z-index: 1;
}

.nav-tabs.tabs-home > li > a.active, .nav-tabs.tabs-home > li.active > a, .nav-tabs.tabs-home > li.active > a:hover, .nav-tabs.tabs-home > li.active > a:focus {
    border: none;
    background-color: inherit;
}

.nav-tabs.tabs-home > li > a {
    height: 90px;
}

.nav-tabs.tabs-home > li:first-of-type ::after {
    content: "";
    border: 1px solid rgb(119,119,119);
    height: 60%;
    position: absolute;
    right: 0;
    top: 20%;
}

.nav-tabs > li {
    margin-top: auto;
    position: relative;
}

.nav-tabs.tabs-home > li:first-child {
    padding-left: 0;
    margin-left: -20px;
    padding-left:0;
}

#tabMenu .nav-tabs > li:first-child {
    margin-left: -20px;
}

    .tabs-home.nav-tabs > li.active:after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -16px;
    width: 0;
    height: 0;
    border-bottom: solid 16px var(--orange_kerberos);
    border-left: solid 16px transparent;
    border-right: solid 16px transparent;
}

.sticky .tabs-home.nav-tabs > li.active:after {
    content: '';
    position: absolute;
    left: 50%;
    margin-left: -11px;
    width: 0;
    height: 0;
    border-top: solid 11px var(--orange_kerberos);
    border-left: solid 11px transparent;
    border-right: solid 11px transparent;
    border-bottom: none;
    top: 0;
}

.login-menu ul {
    display: none;
    position: absolute;
    z-index: 9999;
    top: 40px;
    background: #F0F0F0;
    margin-left: 0;
}

.login-menu ul li {
    margin:0 !important;
}

.nav-tabs.tabs-left > li > a, .nav-tabs.tabs-left > li > a:visited {
    text-decoration: none;
    outline: none;
    color: inherit;
}

.tab-content:not(.sticky) .nav-tabs.tabs-home {
    display: none;
}

.tab-content.sticky .nav-tabs.tabs-home {
    display: block;
    position: absolute;
}

.nav.nav-tabs.tabs-home a {
    width: 250px;
    z-index: 2;
}

div:not(.sticky) .nav.nav-tabs.tabs-home a {
    background: url("/images/New/logo-kerberos.png") no-repeat center center;
    -webkit-background-size: 90%;
    -moz-background-size: 90%;
    -o-background-size: 90%;
    background-size: 90%;
    width: 380px;
}

.sticky .nav.nav-tabs.tabs-home a {
    width: 150px;
}

div.sticky .nav.nav-tabs.tabs-home a {
    width: 220px;
    background-image: url("/images/New/logo-kerberos-negativo.png");
}

.tab-content.sticky .nav-tabs.tabs-home a {
    width: 110px;
}

.tab-content.sticky .nav-tabs.tabs-home > li > a {
    height: 51px;
}

/*#endregion*/

/*#region VerticalTabs*/
.tabs-left-container {
    float: left;
}

.tabs-left {
    border-bottom: none;
    padding-top: 2px;
}

.tabs-left {
    border-right: 1px solid #cdcece;
    color: #555658
}

.tabs-left > li {
    float: none;
    margin-bottom: 2px;
}

.tabs-left > li {
    margin-right: -1px;
}


.tabs-left > li.active > a,
.tabs-left > li.active > a:hover,
.tabs-left > li.active > a:visited,
.tabs-left > li.active > a:focus {
    border-bottom-color: #FFF;
    border-bottom-width: 3px;
}

.tabs-left > li > a,
.tabs-left > li > a:hover,
.tabs-left > li > a:focus {
    border-color: #cdcece;
}

.tabs-left > li > a {
    border-radius: 4px 0 0 4px;
    margin-right: 0;
    display: block;
}

.vertical-text {
    margin-top: 28px;
    border: none;
    position: relative;
}

.vertical-text > li {
    height: 20px;
    width: 110px;
    margin-bottom: 100px;
    z-index: 2;
}

.vertical-text > li > a {
    border: 1px solid #cdcece;
    text-align: center;
    border-radius: 0;
}

.vertical-text > li > a {
    background-color: #F7F7F7;
}

.vertical-text > li.active > a {
    background-color: #FFF;
    z-index: 2;
}

.vertical-text > li.active > a {
    border-bottom-color: #FFF;
    border-bottom-width: 3px;
}


.vertical-text.tabs-left {
    left: -50px;
}

.vertical-text.tabs-left > li {
    -webkit-transform: rotate(-90deg);
    -moz-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -o-transform: rotate(-90deg);
    transform: rotate(-90deg);
    text-transform: uppercase;
    position: absolute;
    left: -35px;
    top: 30px;
}

.vertical-text.tabs-left > li:nth-of-type(2) {
    top: 145px;
}

.vertical-text.tabs-left > li:nth-of-type(3) {
    top: 260px;
}

.tab-content.vertical {
    min-height: 425px;
    border: 1px solid #cdcece;
    width: 100%;
    border-radius: 10px;
    position: relative;
}

.tab-news-left, .tab-news-right {
    float: left;
    width: 50%;
}

.tab-news-left {
    padding: 50px;
}

.tab-news-right {
    overflow: hidden;
    border-radius: 0 10px 10px 0;
    max-height: 425px;
}

.carousel-news .carousel-indicators {
    width: 100%;
    text-align: left;
    left: 0;
    margin-left: 50px;
    bottom: 10px;
}

/*#endregion*/

.img-icon {
    width: 60%;
    padding-left: 20%;
}

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

a:not(:first-of-type) .icon-header {
    border-right: 1px solid #FFF;
}

/*.sticky a:not(:first-of-type) .icon-header, .tab-pane.active.in .sticky-menu a:not(:first-of-type) .icon-header  {
    border-right: none;
}*/

/* ------------------------- contact ---------------------------------*/

.contact-header {
    position: absolute;
    right: 0;
    top: 30px;
    padding: 8px;
    line-height: normal;
}

.contact-header div:not(:last-of-type) {
    /*border-right: 1px solid #000*/
}

.contact-header div {
    float: left;
    padding: 0 20px;
    width: auto;
    position: relative;
    padding-left: 40px;
}

.contact-us .phone,
.contact-us .mail,
.contact-us .fax {
    position: relative;
    padding-left: 30px;
}

.contact-form .text-box {
    min-height: 45px;
}

.contact-header .phone:before, .contact-us .phone:before {
    content: "\F095";
    font-family: FontAwesome;
    left: 15px;
    position: absolute;
    top: -2px;
    font-size: 20px;
    line-height: normal;
}

.contact-header .mail:before, .contact-us .mail:before {
    content: "\f0e0";
    font-family: FontAwesome;
    left: 15px;
    position: absolute;
    top: -2px;
    font-size: 20px;
    line-height: normal;
}

.contact-us .fax:before {
    content: "\f1ac";
    font-family: FontAwesome;
    left: 15px;
    position: absolute;
    top: -2px;
    font-size: 20px;
    line-height: normal;
}

.contact-us .phone:before,
.contact-us .mail:before,
.contact-us .fax:before {
    left: 0;
    top: 0;
}

.contact-header a {
color: inherit;
}

.contact-header a:hover,
.contact-header a:focus {
    color: inherit;
    text-decoration: underline;
}

.contact-row > div {
    box-sizing: border-box;
}

tr, th {
    text-align: center !important;
}

.recapiti {
    font-size: 15px;
    padding: 20px;
    background: #f9f9f9;
    border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.map-container {
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    padding-left: 0;
    padding-right: 0;
}

#contact {
    padding-left: 0px;
    padding-right: 0px;
}

.map-container, .recapiti, #contact {
    width: 31% !important;
    margin-left: 5px;
    margin-right: 5px;
}

/* General Improvements */
.a-contactus {
    word-break: break-all;
}

.table {
    min-width: 280px;
}

#map_canvas {
    min-height: 300px;
}


/* ----------------------- menu ----------------------- */

.icon-header {
    width: 25%;
    padding-left: 5px;
    padding-right: 5px;
    box-sizing: border-box;
    float: right;
    text-transform: uppercase;
}

.sticky .icon-header, .icon-header:not(.home) {
    width: auto;
    padding: 10px 12px;
}

.icon-header figure {
    max-width: 150px;
    margin: auto;
    margin-bottom: 10px;
    position: relative;
}
.icon-header figure img {
    width: 100%;
    max-width: 90%;
    padding: 0px 35px 5px;
}

.icon-header figure figcaption {
    bottom: 0;
    left: 0;
    width: 100%;
    color: #FFF;
    text-align: center
}


.sticky.maggiordomo .icon-header figure figcaption {
    color: #555555;
}

.sticky .icon-header figure, .icon-header:not(.home) figure {
    max-width: unset;
}

.sticky .icon-header figure img, .icon-header:not(.home) figure img  {
    float: left;
    max-width: 38px;
    padding: unset;
    margin: 0 10px;
}

.sticky .icon-header figure figcaption, .icon-header:not(.home) figure figcaption {
    /*font-size: 15px;*/
    float: left;
    position: relative;
    width: unset;
    line-height: 38px;
    font-weight: 500;
}

.sticky a .icon-header {
    border: none;
    position: relative;
}


.top-bar .login-menu li {
    position: relative;
}


.top-bar .login-menu li ul {
    width: 100%;
}


.top-bar .login-menu li ul li{
    width: 100%;
    text-align:center;
}

ul li:hover ul {
    display: block;
}

/*#region StickyMaggiordomo*/

div.sticky.maggiordomo .nav.nav-tabs.tabs-home a#kerberos-tab,
div.sticky > #maggiordomo .nav.nav-tabs.tabs-home a#kerberos-tab {
    width: 220px;
    background-image: url("/images/New/logo-kerberos.png");
}


.sticky.maggiordomo .icon-header figure img,
.sticky > #maggiordomo .icon-header figure img {
    background-size: cover;
    position: relative;
    overflow: hidden;
    width: 38px;
    height: 38px;
    padding: 30px 30px 0 0;
    box-sizing: border-box;
}

.sticky.maggiordomo .icon-header#maggiordomo-app figure img,
.sticky > #maggiordomo .icon-header#maggiordomo-app figure img {
    background-image: url('/Images/Home/icon_app_neg.png');
}

.sticky.maggiordomo .icon-header#maggiordomo-product figure img,
.sticky > #maggiordomo .icon-header#maggiordomo-product figure img {
    background-image: url('/Images/Home/icon_prodotti_major_neg.png');
}

.sticky.maggiordomo .icon-header#maggiordomo-vantaggi figure img,
.sticky > #maggiordomo .icon-header#maggiordomo-vantaggi figure img {
    background-image: url('/Images/Home/icon_vantaggi_neg.png');
}

.sticky.maggiordomo .icon-header#maggiordomo-come figure img,
.sticky > #maggiordomo .icon-header#maggiordomo-come figure img {
    background-image: url('/Images/Home/icon_come_neg.png');
}

.sticky.maggiordomo a:not(:first-of-type) .icon-header::after,
.sticky > #maggiordomo a:not(:first-of-type) .icon-header::after {
    color: #555555;
}

/*#endregion*/

.icon-header:hover,
.icon-header:focus,
.icon-header figcaption:hover,
.icon-header figcaption:focus {
    color: inherit;
    /*text-decoration: underline;*/
}

.carousel-partner.carousel-control {
    background-image: none;
    width: 50px;
    height: 50px;
    /*background-color: #F7F7F7;*/
    margin-top: 69px;
}

.carousel-partner.carousel-control.left:before {
    content: "\F104"; /* this is your text. You can also use UTF-8 character codes as I do here */
    font-family: FontAwesome;
    left: 21px;
    position: absolute;
    top: 0;
    color: #9A9A9A;
    font-size: 50px;
}

.carousel-partner.carousel-control.right:before {
    content: "\F105"; /* this is your text. You can also use UTF-8 character codes as I do here */
    font-family: FontAwesome;
    left: 21px;
    position: absolute;
    top: 0;
    color: #9A9A9A;
    font-size: 50px;
}

.owl-partner .owl-item a,
.owl-partner .owl-item > div {
    width: 185px;
    height: 185px;
    background-color: #F0F0F0;
    border: none;
    margin: auto;
    padding: 20px 0;
    display: block;
}

.grigio .owl-partner .owl-item a,
.grigio .owl-partner .owl-item > div {
    background-color: #FFF;
}

.owl-partner .partner-carousel img {
    margin: auto;
}

hr {
    /*border-color: rgb(85, 85, 85);*/
    border-color: var(--gray_kerberos);
}

.btn {
    text-transform: uppercase;
    background-color: var(--gray_kerberos);
    color: #fff;
    -webkit-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: background-color 0.2s ease-in-out;
}

    .btn:hover {
        transform: scale(1.05);
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
        transition: transform 0.5s, box-shadow 0.5s;
    }
 
kerberos .btn {
    background-color: var(--gray_kerberos);
}


.footer-centers .btn {
    background: var(--orange_kerberos) !important;
}

    .footer-centers .btn:hover {
        background: #fa9133 !important;
    }

.cta-container {
    background-color: var(--orange_kerberos);
    padding: 3rem 2rem;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

.cta-content {
    text-align: center;
    margin: 0 auto;
}

.cta-content h3 {
    color: #fafafa;
    font-size: 25px;
}

.cta-content p {
    color: #fafafa;
    font-size: 1.5rem;
    line-height: 1.6;
}

.gruppo-section {
    background: #FFF;
}
.gruppo-section > div {
    /*min-height: 440px;
    display: flex;
    align-items: center;
    justify-content: center;*/
}

.gruppo-section p {
    font-size: 15px;
    margin: 0;
}

.gruppo-left {
    text-align: right;
}



.gruppo-section ul li {
    font-size: 12px;
    border: 1px solid;
    margin: 3px 0;
    padding: 0 5px;
}

.gruppo-right ul li {
    max-width: 80%;
}

.gruppo-section .btn {
    /*width: 100%;
    text-align: center;*/
}

.btn-orange {
    background: var(--orange_kerberos) none;
}

.btn.btn-orange:hover,
.btn.btn-orange:focus{
    background: #d76909 none;
}

.carousel-control.right, .carousel-control.left {
    background-image: none;
}

.carousel-control i {
    top: 50%;
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    left: 50%;
}

/*#region ProdottoEvidenza*/
.prodotto-evidenza {
    padding: 0 30px;
}

.prodotto-evidenza .img-product {
    float: left;
    width: 200px;
    /*height: 200px;*/
    /*height: 100%;*/
    overflow: hidden;
    margin: auto;
    padding: 1px;
    border: 1px solid #c0c0c0;
    text-align: right;
}

.prodotto-evidenza .img-product img {
    /*height: 100%;
    max-width: unset;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);*/
}

.prodotto-evidenza .product-detail {
    float: left;
    width: calc(100% - 200px);
    padding: 0px 0 0 20px;
    position: relative;
    line-height: normal;
    overflow: hidden;
}

.prodotto-evidenza .btn {
    width: 100%;
    background-color: #174a8b;
    border-radius: 0;
    position: absolute;
    left: 0;
    bottom: 0;
}

.prodotto-evidenza.maggiordomo .btn {
    background-color: var(--orange_kerberos);
}

.prodotto-evidenza .btn:hover, 
.prodotto-evidenza .btn:focus {
    background-color: #008ec2
}

.prodotto-evidenza.maggiordomo .btn:hover, 
.prodotto-evidenza.maggiordomo .btn:focus {
    background-color: #d76909
}

.prodotto-evidenza hr {
    border-color: #174a8b;
    margin-top:5px;
    margin-bottom: 15px;
}

.prodotto-evidenza.maggiordomo hr {
    border-color: var(--orange_kerberos);
}

.prodotto-evidenza .titolo {
    /*font-weight: bold;*/
    color: #868686;
    padding-right: 4px;
    line-height:24px;
}

.prodotto-evidenza .descrizione {
    font-size: 17px;
    line-height: normal;
    margin-bottom: 10px;
    min-height: 34px;
}

.prodotto-evidenza .descrizione {
    color: var(--orange_kerberos);
    text-transform: uppercase;
}

.product-detail ul li {
    list-style-position: outside;
    /*-webkit-column-count: 2;
    -webkit-column-gap: 5px;
    -moz-column-count: 2;
    -moz-column-gap: 5px;
    -o-column-count: 2;
    -o-column-gap: 5px;
    column-count: 2;
    column-gap: 5px;*/
    font-size: 15px;
    max-height: 80px;
    list-style: square;
    color: #8f8f8f;
}


.carousel-showtwomoveone.carousel-product .carousel-control.left {
    margin-left: 0;
}

.carousel-showtwomoveone.carousel-product .carousel-control.right {
    margin-right: 0;
}

.carousel.carousel-product .carousel-control.left i {
    left: 0;
    color: rgb(85, 85, 85);
}

.carousel.carousel-product .carousel-control.right i {
    right: 0;
    color: rgb(85, 85, 85);
}

.owl-product .carousel-control {
    font-size: 50px;
}

.owl-product .carousel-control.left {
    left: 0;
    width: 100%;
}

.owl-product .carousel-control.right {
    right: 0;
    width: 100%;
}

.owl-product .owl-nav, 
#carousel-soluzioni .owl-nav{
    top: 0;
    width: 100%;
}

.owl-partner .owl-nav .owl-prev,
.owl-partner .owl-nav .owl-next,
.owl-product .owl-nav .owl-prev,
.owl-product .owl-nav .owl-next,
#carousel-soluzioni .owl-nav .owl-prev,
#carousel-soluzioni .owl-nav .owl-next{
    height: 100%;
    border: none;
    background: transparent;
    top: 0;
}

.owl-product .owl-nav .carousel-control,
#carousel-soluzioni .owl-nav .carousel-control {
    color: #b8b8b8;
}

.owl-product .owl-nav .carousel-control:hover,
#carousel-soluzioni .owl-nav .carousel-control {
    color: var(--orange_kerberos);
}

.owl-partner .owl-nav .owl-prev {
    left: -50px;
    position: absolute;
    width: 50px;
}

.owl-product .owl-nav .owl-prev {
    position: absolute;
    left: -80px;
    width: 80px;
}

#carousel-soluzioni .owl-nav .owl-prev {
    position: absolute;
    left: 0;
}

.owl-partner .owl-nav .owl-next{
    right: -50px;
    position: absolute;
    width: 50px;
}

.owl-product .owl-nav .owl-next {
    position: absolute;
    right: -80px;
    width: 80px;
}

#carousel-soluzioni .owl-nav .owl-next {
    position: absolute;
    right: 0;
}

/*#endregion*/

/*#region Soluzioni*/

#soluzioni .div-solution-container {
    position:relative;
    z-index:1;
}

#soluzioni .container.row-solution {
    padding-top:80px;
}

#soluzioni .div-solution-container .wrap-icon {
    position: absolute;
    z-index: 1;
    top: 10px;
    left: 50%;
    transform: translate(-50%, -50%);
    padding: 12px;
}

#soluzioni .div-solution-container:hover .wrap-icon {
    background:#fff;
    border-radius:100%;
}

#soluzioni .div-solution-container img {
    width:94%;
    
}

.div-solution-container {
    margin: 40px 10px 0;
    border-bottom: 1px solid #174a8b;
    height: 100%;
    min-height: 300px;
    text-align: center;
    padding:0 10px;
}

.div-solution-container p {
    line-height:1.8;
}
    .div-solution-container:hover {
    /*background: url("/Images/home/soluzione-sfondo.png") no-repeat top center;*/
    background-size: contain;
    background:#fff;
}

/*.div-solution-container:hover img {
    background:#fff;
    border-radius:100%;
}*/
.div-solution-container img {
    max-width: 60px;
    /*margin-top: 20px;*/
}

.row-solution a  {
    width: 90%;
    float: left;
    margin-left: 5%;
}

.div-solution-container label {
    color: #174a8b;
    text-transform: uppercase;
    width: 100%;
    text-align: center;
    min-height: 70px;
    font-size: 18px;
    margin-top: 70px;
    word-wrap: break-word;
    cursor: pointer;
}


.soluzione-desc-img {
    display: inline;
    width: 15%;
}

.soluzione-left {
    font-size: 18px;
    border-left: 3px solid var(--orange_kerberos);
}


.soluzione-left span {
    display: block;
    padding: 10px;
}

.soluzione-left .description-detail span {
    padding: 0;
}

.soluzione-left span:not(:first-of-type) {
    margin-top: 3px;
}

.descrizione-estesa-soluzione {
    margin-top: 30px;
}

.descrizione-soluzione p,
.descrizione-estesa-soluzione p,
.descrizione-estesa-soluzione p span {
    font-size: 18px !important;
    line-height:1.8;
    /*color: #3e3e3e !important;*/
}

.popover-img {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background: none;
}

.popover-img[aria-expanded="true"] {
    opacity:0.5;
}

.popover-img img {
    max-width: 70px;
    border-radius: 50%;
}

.icon-popover {
}

.popover {
    border: 1px solid var(--orange_kerberos);
    border-radius: unset;
    padding: 6px;
    font-family: inherit;
}

.popover.bottom > .arrow,
.popover.bottom > arrow:after {
    border-bottom-color: var(--orange_kerberos);
}

.popover.bottom > .arrow:after {
    content: " ";
    top: 1px;
    margin-left: -10px;
    border-top-width: 0;
    border-bottom-color: var(--orange_kerberos);
}

.popover-title {
    border-radius: unset;
    border-bottom: none;
    background-color: #FFF;
    text-align: left;
    color: var(--orange_kerberos);
    font-size: 22px;
    text-transform: uppercase;
}

.popover-inner {
    width: 450px;
    max-width: 450px;
}

.popover {
    width: 450px;
    max-width: 450px;
}

.panel-default > .panel-heading {
    background-color: #fafafa;
    border: none;
    text-align: center;
}

#accordion-md .panel-default > .panel-heading {
    padding:0;
    text-align:left;
}
 
.panel-default {
    border: none;
}

.panel {
    box-shadow: none;
}

/*#endregion*/
/*#region ProgettiXmonitor*/
#portfolio .div-progetti {
    max-height: 342px;
    overflow: hidden;
}

.div-progetti {
    max-width: 275px;
    margin: auto;
    line-height: 26px;
}

.div-progetti figure figcaption {
    /*color: #FFF;
    background-color: #174a8b;*/
    text-align: center;
    line-height: 24px;
    text-transform: uppercase;
    font-size: 18px;
}

#portfolio .div-progetti figure figcaption {
    text-align:left;
    margin-top:10px;
}

.div-progetti figure {
    margin-bottom: 10px;
}

#portfolio .div-progetti p {
    max-height: 80px;
}

/*#endregion*/

/*#region VantaggiMaggiordomo*/

.vantaggi-maggiordomo {
    margin: auto;
    max-width: 250px;
    line-height: normal;
    text-align: center;
    margin-bottom:30px;
}
#vantaggi .wrapbtn {
    margin-top:15px;
}
.vantaggi-maggiordomo figure {
    margin-bottom: 20px;
}

.vantaggi-maggiordomo p {
    text-align: center !important;
}

/*#endregion*/

/*#region News*/

.img-news {
    width: 443px;
    height: 443px;
    display: block;
    background-size: auto 100%;
    background-position: center center;
    background-repeat: no-repeat;
}

.tab-news .btn {
    position: absolute;
    bottom: 50px;
    left: 50px;
}

.tab-news a {
    color: unset;
}

.news-lista .img-news-lista {
    border: 1px solid #c0c0c0;
    padding: 2px;
    display: flex;
    align-items: center;
    height: 100%;
}

.news-lista .descrizione p {
    color: #8f8f8f !important;
    font-family: inherit !important;
    line-height: 1.8 !important;
    font-size: 14px !important;
}

.img-details-news {
    border: 1px solid #c0c0c0;
    padding: 6px;
    position: -webkit-sticky;
    position: sticky;
    top: 68px;
    left: 0;
}

#ricerca_news {
    text-align: right;
    border-bottom: 1px solid #dbdbdb;
    padding-bottom: 30px;
    padding-top: 10px;
}

#ricerca_news label {
    display: inline-block;
    font-weight: bold;
    font-size: 15px;
    width: 100%;
    text-align: center;
    margin-top: 4px;
}

#ricerca_news select {
    display: inline-block;
    text-transform: uppercase;
}

/*#endregion*/
div.grigio {
    background-color: var(--gray-light);
}

div.bianco {
    background-color: #FFF;
}

div.light-gray {
    background-color: #fafafa
}

.grigio div.container, .bianco div.container, .app-section div.container {
    background-color: unset;
}

.number-wrapper {
    text-align: center;
}

.number {
    font-size: 64px;
}

.number-title {
    display: block;
    text-align: center;
    font-weight: bold;
}


.ul-servizi li {
    padding-left: 90px;
    min-height: 90px;
    position: relative;
    margin: 20px 0;
    line-height: normal;
    /* older webkit */
    display: -webkit-box;
    -webkit-box-align: center;
    -webkit-justify-content: center;
    /* older firefox */
    display: -moz-box;
    -moz-box-align: center;
    -moz-box-pack: center;
    /* IE10*/
    display: -ms-flexbox;
    -ms-flex-align: center;
    -ms-flex-pack: center;
    /* newer webkit */
    display: -webkit-flex;
    -webkit-align-items: center;
    -webkit-box-pack: center;
    /* Standard Form - IE 11+, FF 22+, Chrome 29+, Opera 17+ */
    display: flex;
    align-items: center;
    justify-content: center;
}

.ul-servizi li::before {
    content: '';
    background: url("/Images/nodata.jpg") no-repeat center center;
    -webkit-background-size: 120px;
    -moz-background-size: 120px;
    -o-background-size: 120px;
    background-size: 120px;
    position: absolute;
    height: 80px;
    width: 80px;
    top: 5px;
    left: 0;
    border-radius: 50%;
}

footer div.container {
    background-color: inherit;
}

footer, footer h2, footer p, footer spen {
    color: #FFF !important
}

.copyrights {
    color: #fff;
    background: #303030;
    padding:0;
}

.copyrights .container .border-copyrights {
    border-top: 1px solid #3b3a3a;
    padding-top: 30px;
    padding-bottom: 30px;
}

footer hr {
    border-color: #FFF;
}

hr {
    margin-top: 0;
    margin-bottom: 30px;
}

#sectionfooter, #footer-all {
    background-color: #303030 !important;
}

h2 {
    text-transform: none;
    line-height:46px;
    font-size:40px;
}

#to-top span:hover {
    color: var(--orange_kerberos) !important;
}

#to-top:hover {
    background-color: unset;
}

#to-top {
    background-color: unset;
}

p {
    font-size: 15px;
}

.carousel-slide .item {
    overflow: auto;
}

.carousel-slide .carousel-indicators li {
    border-color: rgb(85, 85, 85);
}

.carousel-indicators.kerberos .active {
    background-color: var(--gray_kerberos);
}

.row-eq-height {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
}

.responsive-nav {
    background: var(--gray_kerberos);
    /*padding-top: 80px;*/
}

.responsive-nav  .icon-header {
    width: 100%;
    float: none;
}

.responsive-nav .nav-link {
    width: 100%;
    height: 80px;
    display: block;
}



/*#region Footer*/

.footer-box {
    min-height: 350px;
    margin-top: 40px;
    padding-bottom: 40px;
    border-left: 1px solid #3b3a3a;
}

.footer-left {
    border-right: 1px solid #3b3a3a;
    /*margin-top: 30px;*/
    /*padding-bottom: 30px;*/
}

.footer-centers {
    border-left: 1px solid #3b3a3a;
    text-align: left;
    /*padding-bottom: 30px;*/
    /*margin-top: 30px;*/
    padding-left: 35px;
    /*padding-right: 35px;*/
    border-right: 1px solid #3b3a3a;
}

.footer-centers .certificato {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-content: center;
    align-items: center;
}

.footer-centers .certificato img {
    display:block;
    float:left;
}

.footer-centers .certificato span {
    display:block;
    float:left;
    margin-left:10px;
    font-size:18px;
}
 
.footer-centers p {
    margin-bottom: 25px;
}

.footer-centers {
    /*text-align: center;*/
    /*margin-top: 30px;*/
    padding-left: 35px;
    /*padding-bottom:30px;*/
}

.footer-left .contact {
    font-size:14px;
    margin-bottom:15px;
}

.footer-left .contact i {
    font-size: 18px;
    vertical-align: top;
}

.footer-left .contact span {
    display: inline-block;
    margin-left: 10px;
}

.footer-left .contact span {
}


.footer-left .social {
    margin-top: 20px;
}

.footer-left .social li {
    float: left;
    margin-right: 15px;
}

.footer-left .social li a {
    font-size: 18px;
    padding: 10px;
    width: 40px;
    height: 40px;
    border-radius: 100%;
    background: #fff;
    display: inline-block;
    text-align: center;
    color: #303030;
}

#footer-all .footer-centers .social li a:hover {
    background: #c6c6c6;
    color: #303030 !important;
}

.btn-align-right {
    text-align: right;
}

.footer-left p {
    text-align: left;
    margin-top: 20px;
}

.img-footer {
    margin-left: -14px;
}

footer h2 {
    font-weight: 300;
    font-size: 25px;
    margin-top: 30px;
    margin-bottom: 30px;
    line-height: normal;
    text-transform: uppercase;
}

footer p {
    font-size: 14px;
}

/*#endregion */

.input-group{
    width: 100%
}

.input-group-addon {
    background-color: #F68423;
    color: #FFF;
    border-color: #F68423;
    font-size: 19px;
}

#gruppo .btn {
    /*width: 100%;*/
}

#tabSticky {
    border-bottom: none;
}

/*#region ListaProdotti*/
.grid-list .col-ms-6 {
    padding: 0;
}

.title-category {
    text-transform: uppercase;
    font-size: 22px;
    line-height: normal;
    font-weight: bold;
    margin-bottom: 30px;
}

.title-category {
    color: var(--orange_kerberos);
}

.title-list {
    text-transform: uppercase;
    font-weight:bold;
    font-size: 30px;
    line-height: normal;
    /*font-weight: 300;*/
    margin: 40px 0;

}

.title-list {
    color: var(--gray_kerberos);
}

.container-menu-list {
    border-bottom: 2px solid;
    margin-bottom: 20px;
    padding-bottom: 30px !important;
}

#risorse-download .container-menu-list {
    padding-bottom:5px !important;
}

.container-menu-list {
    border-color: var(--gray_kerberos);
}

.list-category li, .list-solution li {
    margin-bottom: 10px;
    width: 25%;
    float: left;
    display: flex;
}

.list-category input[type="checkbox"], .list-category input[type="radio"],
.list-solution input[type="checkbox"], .list-solution input[type="radio"] {
    display: none;
}

.list-category label, .list-solution label {
    text-transform: uppercase;
    cursor: pointer;
}

.list-category label:not(.labelCheckbox), .list-solution label:not(.labelCheckbox) {
    width: 90%;
}

input[type="checkbox"] ~ .labelCheckbox {
    margin-right: 5px;
    margin-top: -4px;
}

input[type="checkbox"]:checked ~ .labelCheckbox {
    padding: 0px;
    background-clip: content-box;
}


input[type="checkbox"]:checked ~ .labelCheckbox {
    background: var(--gray_kerberos);
    border-color: var(--gray_kerberos);
    color: var(--gray_kerberos);
}

input[type="checkbox"]:checked ~ label {
    color: var(--gray_kerberos);
}

.labelCheckbox {
    border: 1px solid;
    -webkit-transform: translateY(50%);
    -ms-transform: translateY(50%);
    transform: translateY(50%);
    height: 15px;
    width: 15px;
    cursor: pointer;
    padding-left: 5px;
    line-height: unset;
}

.prodotto-lista {
    /*height: 180px;*/
}

.prodotto-griglia {
    padding: 0 20px;
}

.prodotto-lista .img-product {
    text-align: center;
    position: relative;
    border: 1px solid #dbdbdb;
    padding: 2px 5px 29px;
    display: flex;
    align-items: center;
    /*height: 100%;*/
    min-height: 180px;
}

.prodotto-griglia .img-product,
.prodotto-evidenza .img-product {
    text-align: center;
    position: relative;
    border-bottom: 1px solid #dbdbdb;
    padding: 10px 10px 29px 10px;
}

.prodotto-lista .img-product img,
.prodotto-griglia .img-product img,
.news-lista .img-news-lista img{
    width: 100%;
    max-width: 100%;
}


.prodotto-griglia .img-product .codice-articolo {
    position: absolute;
    bottom: 0;
    right: 0;
    color: #868686;
    background-image: -webkit-linear-gradient(bottom,rgba(0,0,0,.0001) 20%,rgba(0,0,0,.05) 100%);
    background-image: -o-linear-gradient(bottom,rgba(0,0,0,.0001) 20%,rgba(0,0,0,.05) 100%);
    background-image: -webkit-gradient(linear,bottom top,right top,from(rgba(0,0,0,.0001)),to(rgba(0,0,0,.05)));
    background-image: linear-gradient(to bottom,rgba(0,0,0,.0001) 20%,rgba(0,0,0,.05) 100%);
    width: 100%;
    height: 100%;
}

.prodotto-lista .img-product .codice-articolo > span, 
.prodotto-griglia .img-product .codice-articolo > span,
.prodotto-evidenza .img-product .codice-articolo > span{
    position: absolute;
    bottom: 0;
    right: 0;
    line-height: normal;
    /*font-weight: bold;*/
    font-size: 14px;
    color: #FFF;
    width: 100%;
    text-align:center;
    padding:5px 0;
}


.prodotto-lista .img-product .codice-articolo > span,
.prodotto-griglia .img-product .codice-articolo > span,
.prodotto-evidenza .img-product .codice-articolo > span {
    background-color: var(--gray_kerberos);
}

.prodotto-lista .titolo,
.prodotto-griglia .titolo,
.prodotto-evidenza .titolo,
.news-lista .titolo,
.risorsa-lista .titolo {
    text-transform: uppercase;
    max-height: 68px;
    overflow: hidden;
    font-size: 18px;
    line-height: 24px;
    text-align: left;
    margin-top: 0;
    font-weight: 400;
}

.prodotto-griglia .titolo {
    height: 68px;
}

.prodotto-lista.maggiordomo .titolo,
.prodotto-griglia.maggiordomo .titolo,
.prodotto-evidenza.maggiordomo .titolo,
.maggiordomo .news-lista .titolo,
.risorsa-lista.maggiordomo .titolo {
    color: var(--orange_kerberos);
}

.prodotto-lista.kerberos .titolo,
.prodotto-griglia.kerberos .titolo,
.prodotto-evidenza.kerberos .titolo,
.kerberos .news-lista .titolo,
.risorsa-lista.kerberos .titolo {
    color: var(--gray_kerberos);
}

.prodotto-lista .product-detail {
}

.prodotto-lista .product-detail ul {
    margin-left:5px;
}

.prodotto-lista .descrizione p:not(:first-of-type){
    display: none;
}

.prodotto-lista .descrizione,
.news-lista .descrizione,
.risorsa-lista .descrizione {
    font-family: inherit !important;
    margin-bottom: 18px;
    max-height: 75px;
    overflow: hidden;
}

.prodotto-lista .descrizione p, .prodotto-lista .descrizione p span,
.risorsa-lista .descrizione p {
    color: #8f8f8f !important;
    font-family: inherit !important;
    line-height: 1.8 !important;
    font-size: 14px !important;
}

ul.ul-pdf li {
    margin: 5px 0;
}

ul.ul-pdf li {
    list-style: square;
    margin-left: 12px;
    color: #787777;
    font-size: 13px;
    line-height: 18px;
}

.btn-product {
    color: #174a8b;
    padding-right: 30px;
    font-weight: bold;
    text-transform: uppercase;
}

.btn-product::after {
    content: '>';
    color: #174a8b;
    position: absolute;
    right: 25px;
}

#showMore {
    text-align:center;
}

.carousel-related a.left.carousel-control {
    position: absolute;
    left: -40px;
    font-size: 50px;
}

.carousel-related a.right.carousel-control {
    position: absolute;
    right: -50px;
    font-size: 50px;
}

h3.available-models {
    text-align: left;
    border-bottom: 1px solid #c0c0c0;
    font-size: 32px;
    padding-bottom: 20px;
    color: #555555;
}

h3.available-models {
    color: var(--gray_kerberos);
}



/*#endregion*/

/*#region svg*/
.wrapper-svg {
    height: 4500px;
    position: relative;
    background-color: white;
}

.wrapper-svg>div {
    position:absolute;
}

/*svg {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
}*/
/*#endregion*/

/*#region ProductDetail*/
.title_detail {
    background-color: transparent;
    text-transform: uppercase;
    text-align: left;
}

.title_detail {
    color: var(--gray_kerberos);
}

.list-bookmark li::before {
    content: "";
    color: red;
    top: 0;
    padding: 20px;
    background: url('/Images/new/ico_pdf.jpg') no-repeat;
}

.ambiti-applicativi .description-detail {
    padding-bottom: 30px;
}

.description-detail, .description-detail p, .description-detail p span, .description-detail p a, .description-detail ul li, .description-detail ul li p, .description-detail ul li span, .description-detail ul li p span {
    font-family: inherit !important;
    color: #8f8f8f !important;
    line-height: 1.8;
    font-size: 14px !important;
}

.description-detail ul {
    margin-left:30px !important;
    margin-top:10px !important;
    margin-bottom:10px !important;
}

.img-details {
    position: -webkit-sticky;
    position: sticky;
    top: 68px;
    left: 0;
}

.spec-title {
    font-size: 18px;
    line-height: 18px;
    text-transform: uppercase;
    border-color: #dbdbdb;
}

#caratteristiche-section .spec-title {
    font-size: 15px;
}
 
.grid-list .spec-title {
    font-size: 18px;
}

.grid-list .spec-title:first-child {
    margin-top:40px;
}

.spec-title {
    /*border-color: var(--gray_kerberos);*/
    color: var(--gray_kerberos);
}

/*.spec-title::after {
    content: "\f068";
    font-family: FontAwesome;
    right: 10px;
    position: absolute;
    top: 10px;
    line-height: normal;
}

.spec-title.collapsed::after {
    content: "\f067";
    font-family: FontAwesome;
    right: 10px;
    position: absolute;
    top: 10px;
    line-height: normal;
}*/

.specification-detail {
    margin-bottom: 20px;
    font-size: 13px;
    line-height:16px;
}

.specification-detail table {
    border: none;
}

.specification-detail table td {
    background-color: inherit !important;
}

.specification-detail table td:last-of-type {
    border-right: none !important;
}

.width250 {
    width: 250px;
}

#left-to-fix {
    padding-right: 15px;
}

.navigation {
    position: relative;
}

/*.navigation > .navigation_link:first-child {
    display: block;
    border-top: 2px solid #c0c0c0;
    padding: 5px 0;
}*/

.navigation > .navigation_link {
    display: block;
    border-bottom: 1px solid #c0c0c0;
    padding: 7px 0;
    text-transform: uppercase;
}

.navigation > a.navigation_link {
    color: #908e8f;
    text-decoration:none;
}

.navigation > .navigation_link::after {
    content: '\f105';
    position: absolute;
    right: 0;
    font-family: FontAwesome;
    font-size: 18px;
    line-height: 22px;
    font-weight: bold;
}

/*.navigation > .navigation_link.active {
    margin-top: -2px;
    border-top: 2px solid;
}*/


.navigation > .navigation_link.active {
    border-color: var(--gray_kerberos);
    color: var(--gray_kerberos);
}

.product-list-container {
    height: 100%;
}

.title-section {
    width: 100%;
    border-bottom: 1px solid;
    font-size: 19px;
    line-height: 2;
    text-transform: uppercase;
}


.title-section {
    border-color: var(--gray_kerberos);
    color: var(--gray_kerberos);
}

.resources span {
    text-transform: uppercase;
    display: block;
    padding: 15px 0;
}
.product-solution span {
    text-transform: uppercase;
    display: block;
    padding: 10px 0;
}

.product-solution span a {
    color: #868686;
    display: flex;
    align-items: center;
    -webkit-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out;
}


.product-solution span a:hover {
    color: var(--gray_kerberos);
    -webkit-transition: color 0.2s ease-in-out;
    -o-transition: color 0.2s ease-in-out;
    transition: color 0.2s ease-in-out;
}

.product-solution img {
    max-height: 43px;
    flex: 0 0 auto;
}

.resources img, .product-solution img {
    margin-right: 10px;
}


.resources span:not(:first-of-type), .product-solution span:not(:first-of-type) {
    /*border-top: 1px solid;*/
}

.resources span {
    color: var(--gray_kerberos);
}

/*#endregion*/

/*#region Progetti */

.imgProgettiContainer,
.imgApplicazioniContainer {
    border: 1px solid #e5e5e5;
    padding: 5px;
}

.progetti-destro::after,
.applicazioni-destro::after {
    content: '';
    border-bottom: 1px solid #dbdbdb;
    width: calc(100% - 30px);
    position: absolute;
    bottom: 0;
    padding-right: 15px;
    left: 15px;
}

a.btn-text {
    position: absolute;
    bottom: 30px;
    right: 0;
    text-transform: uppercase;
    font-size: 16px;
}


a.btn-text {
    color: var(--gray_kerberos);
}

.pregetti-destro h4 {
    color: #7f7f7f;
    font-size: 19px;
}

.description-project-news,
.description-applicazione {
    border-left: 1px solid #c0c0c0;
}

/*.description-project-news .title_detail {
    border-bottom:2px solid;
}*/

.description-project-news h4,
.description-applicazione h4 {
    color: #8f8f8f;
    font-size: 18px;
    text-transform: none;
    font-weight: 400;
    line-height: 1.8;
    margin-bottom: 25px;
}

.description-project-news .text-from-db p span {
    
}

#thumbs div > .owl-item > div.item {
    opacity: .75;
    padding: 2px;
    border: 1px solid #c0c0c0;
    margin: 3px;
    background-color: white;
}

#thumbs div > .owl-item.current > div.item {
    opacity: 1;
    padding: 2px;
    border: 1px solid #c0c0c0;
    margin: 3px;
    background-color: white;
}

#big div > .owl-item > div.item {
    padding: 6px;
    border: 1px solid #c0c0c0;
    margin: 3px;
    background-color: white;
}

#thumbs div > .owl-item {
    
}

#thumbs div > .owl-stage {
    
}

.img-search {
    width: 15%;
    height: 15%;
    position: absolute;
    bottom: 0;
    right: 0;
    border-radius: 50%;
    background-image: radial-gradient(at center, rgba(0,0,0,0.8), rgba(0,0,0,0.4), rgba(0,0,0,0));
}

    .img-search:before {
        font-family: "FontAwesome";
        content: "\f002";
        color: #FFF;
        font-size: 22px;
        bottom: 10px;
        right: 14px;
        position: absolute;
    }

/*#endregion */

/*#region Servizi*/
.owl-item > div.image-servizi {
    cursor: pointer;
    transition: margin 0.6s ease;
    margin: auto;
    background-color: #174a8b;
    border-radius: 50%;
    height: 100px;
    width: 100px;
    display: flex;
    align-items: center;
    opacity: .5;
    padding: 15px;
}

.owl-item.medium > div.image-servizi {
    height: 120px;
    width: 120px;
    opacity: .75;
}

.owl-item.big > div.image-servizi {
    cursor: auto;
    height: 140px;
    width: 140px;
    opacity: 1;
}

.image-servizi > img {
    margin: auto;
}

.owl-stage {
    display: flex;
    align-items: center;
}

h2.title-servizi {
    text-transform: uppercase;
    text-align: center;
    font-size: 18px;
    line-height: 30px;
    color: #174a8b;
    font-weight:400;
}

.text-servizi {
    text-align: center;
    font-size: 14px;
    color: #8f8f8f;
    line-height: 1.8;
    /*min-height: 70px;*/
}

.wrap-text-servizi {
    max-width:500px;
    margin:0 auto;
    height:72px;
    overflow:hidden;
}

.owl-dots {
    display: none;
}

.owlCustomPreviousBtn, .owlCustomNextBtn,
.owlSolutionPreviousBtn, .owlSolutionNextBtn
{
    font-size: 50px;
    color: #b8b8b8;
    cursor: pointer;
    padding-top:40px;
}

.owlCustomPreviousBtn,
.owlSolutionPreviousBtn {
    text-align: right;
}

.owlSolutionPreviousBtn, .owlSolutionNextBtn {
    top: 80px;
}
/*#endregion*/

/*#region Pagine Generali - Lista */

.row-title-page {
    background-color: var(--gray-light);
    /*    margin-top: -27px;*/
    padding: 10px 0;
    font-size: 26px;
    color: #3e3e3e;
}

.row-title-page h1 {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 30px;
    margin: 0;
    /* line-height: normal; */
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    display: -webkit-box;
    color: var(--gray_kerberos);
}

/*.back_icon {
    font-size: 45px;
    vertical-align: bottom;
}*/

.row-title-page img.x-monitor-ready {
    margin-top: -26px;
    margin-bottom: -32px;
    margin-left: -17px;
}

.kerberos .title_detail {
    color: var(--gray_kerberos);
}

.title_list {
    font-weight: bold;
    text-transform: uppercase;
    text-align: left;
    font-size: 26px;
    margin-top: 0;
    line-height: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}


.title_list {
    color: #ffffff;
    margin-bottom: 10px;
    text-align: center;
    color: #555;
}

.text_list {
    text-align: left;
    font-size: 14px;
    color: #7f7f7f;
    line-height: 1.8;
    text-transform: none;
    font-weight:400;
}

/*#endregion */

/*#region Partner */
.grid-list.list {
    margin: 0 -10px;
}

.partners-item-box {
    color: #b4b4b4;
    margin-bottom:30px;
}

.partners-item-img {
    border: 1px solid #e7e8ea;
    padding: 5px;
}

.partners-item-cart {
    background-color: #e7e8ea;
    text-align: left;
    min-height: 70px;
    display: flex;
    align-items: center;
    color: var(--gray_kerberos);
    font-weight: bold;
    font-size: 16px;
}

.partners-item-cart img {
    max-width: 70px;
    float: left;
    margin-right: 20px;
}

.partner-title {
    text-transform: uppercase;
    color: var(--gray_kerberos);
    font-size: 18px;
    text-align: left;
    line-height: 1.2;
    min-height: 40px;
}

.partners-address {
    text-transform: capitalize;
    min-height: 40px;
}

.partners-site {
    text-transform: lowercase;
}

.partners-site, .partners-address {
    padding-left: 30px;
    position: relative;
    color: #9c9c9c;
}

.partners-site::before {
    content: "\f0ac";
    font-family: FontAwesome;
    left: 0;
    position: absolute;
    top: 0;
    font-size: 20px;
    line-height: normal;
}

.partners-address::before {
    content: "\f041";
    font-family: FontAwesome;
    left: 0;
    position: absolute;
    top: 0;
    font-size: 18px;
    /*line-height: 40px;*/
}


.partners-item-details {
    border-bottom: 1px solid #e7e8ea;
    min-height: 145px;
}

.area-title {
    background-color: #e7e8ea;
    color: var(--gray_kerberos);
    text-align: left;
    font-size: 26px;
    line-height: 1.8;
    padding-left: 20px;
    font-weight: normal;
}

/*#endregion */

h3.block-head-contacts {
    width: 100%;
    font-size: 35px;
    color: #868686;
    text-transform: capitalize;
    padding: 10px;
    padding-left: 0;
    text-align: left;
}

.row-description-contacts {
    font-size: 26px;
    color: #3e3e3e;
}

select::placeholder,
textarea::placeholder,
input[type="text"]::placeholder,
input[type="password"]::placeholder,
input[type="datetime"]::placeholder,
input[type="datetime-local"]::placeholder,
input[type="date"]::placeholder,
input[type="month"]::placeholder,
input[type="time"]::placeholder,
input[type="week"]::placeholder,
input[type="number"]::placeholder,
input[type="email"]::placeholder,
input[type="url"]::placeholder,
input[type="search"]::placeholder,
input[type="tel"]::placeholder,
input[type="color"]::placeholder {
    color: var(--gray_kerberos);
    opacity: 1;
}

input[type="text"]::-ms-input-placeholder, input[type="number"]::-ms-input-placeholder {
    color: var(--gray_kerberos);
}

input::-ms-input-placeholder {
    color: var(--gray_kerberos);
}

 textarea::-ms-input-placeholder {
     color: var(--gray_kerberos);
 }

.contact-form input[type="text"], .contact-form textarea {
    font-size: 16px;
    line-height: 2;
    color: #000
}

.contact-form {
    padding-right: 50px;
}

.contact-us {
    padding-left: 50px;
}

.contact-us h5 {
    color: #868686;
    font-weight: bold;
    font-size: 18px;
    margin-top: 20px;
    margin-bottom: 0;
}

.contact-us, .contact-form, .contact-us p, .row-description-contacts p, .contact-us-direction p, .group-section p, .preventivo-form {
    font-size: 16px;
    line-height: 1.8;
    color: #868686;
}

.contact-us.recapiti .orari p span,
.inviato p span{
    font-size:18px !important;
}

.contact-us.recapiti h5 {
    margin-bottom: 5px;
}

.contact-us.recapiti p {
    /*font-size:14px !important;*/
}

.contact-us.recapiti p a {
    font-size:14px;
}

.contact-us.recapiti p span {
    font-size: 14px !important;
    display: inline-block;
    margin-bottom: 5px;
}

.row-description-contacts p span, .contact-us p span {
    font-size: 18px !important;
    line-height: 1.8 !important;
    color: #868686 !important;
    font-family: inherit !important;
}

.contact-us a {
    font-size: 20px;
    line-height: 1.8;
    /*color: #5d5d5d !important;*/
    /*text-decoration: underline;*/
}

label.lbl-contactus {
    color: #5d5d5d !important;
    display: inline;
}

.inviato h5 {
    margin-top: 0;
    margin-bottom: 5px;
    color: #868686;
    font-weight: bold;
    font-size: 18px;
}

/*#region AboutUs */

div.group-page {
    padding: 60px 0;
}

.about div.group-page {
    padding:0;
}

.grey-text {
    color: #5d5d5d;
}

.div-background {
    min-height: 20vw;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    margin-top: -20px;
}

.background-blue {
    background-color: #104967;
    padding: 30px 0;
}

.background-blue img {
    margin: auto;
}

.group-page-first p span, .group-page-second p span,
.about-page-first p span, .about-page-second p span,
.about-page-fourth p span {
    color: #868686 !important;
    font-size: 18px !important;
    line-height: 1.8 !important;
}

.group-page-third p,
.group-page-first p,
.about-page-first p,
.about-page-fourth p{
    text-align: center !important;
}

    .group-page-third p span {
        font-size: 18px !important;
        color: #868686 !important;
    }

.group-page-first p span,
.group-page-second p span,
.group-page-third p span,
.about-page-first p span,
.about-page-second p span,
.about-page-fourth p span {
    font-family: inherit !important;
}

.about-page-fourth img {
    width: 30%;
    margin-bottom: 40px;
    margin-left: auto;
    margin-right: auto;
}

/*#endregion */

.carousel-home {
    overflow: hidden;
}

.carousel-home .carousel-caption h3, .carousel-home .carousel-caption h5 {
    /*background-color: rgba(255, 255, 255, 0.6);*/
    text-align: left;
    width: 30%;
    line-height: 1.8;
    padding:0;
    font-weight:bold;
}

    .carousel-home .carousel-caption h3 {
        font-size: 36px;
        color: var(--gray_kerberos);
        /*font-size: 1.979vw;*/
        line-height: 48px;
        margin-bottom: 20px;
        line-height: 2.5vw;
    }

    .carousel-home .carousel-caption h5 {
        font-size: 18px;
        margin-bottom: 42px;
        margin-bottom: 2.18vw;
        color: #6F6F6F;
        /*font-size: 1.25vw;*/
        line-height: 30px;
        text-transform:none;
        line-height: 1.5625vw;
    }

.carousel-home .carousel-caption {
    text-shadow: none;
    text-align: left;
    height: 100%;
    width: 100%;
    position: absolute;
    left: 0;
    padding-top: 110px;
    padding-top: 3.75vw;
}

.carousel-home .carousel-control.right {
    right: -25px;
}

.carousel-home .carousel-control.left {
    left: -25px;
}

.carousel-home .carousel-control.right i,
.carousel-home .carousel-control.left i {
    font-size: 50px;
    background-color: rgba(255,255,255,.05);
    color: #C4C4C4;
}

.btn-white-text {
    color: #fff !important;
    text-decoration: none !important;
}

/*#region RicercaProdotti */

.tabs-filter.nav-tabs {
    text-transform: uppercase;
    border-width: 2px;
}




.tabs-filter.nav-tabs {
    color: var(--gray_kerberos);
    border-color: var(--gray_kerberos);
}

.tabs-filter.nav-tabs > li {
    margin-bottom: -2px;
}


.tabs-filter.nav-tabs > li.active > a,
.tabs-filter.nav-tabs > li.active > a:hover,
.tabs-filter.nav-tabs > li.active > a:focus {
    border-color: var(--gray_kerberos);
    border-bottom-color: transparent;
    border-width: 2px;
}

/*#endregion */
/*#region App */
.app-logo {
    width: 70%;
}

div.app-page {
    padding: 50px 0;
}

.app-page p,
.come-funziona p {
    text-align: center!important;
}

.app-page p span,
.come-funziona p span {
    font-size: 18px!important;
}


.app-page .app-p p {
    text-align: left!important;
}

.app-page p,
.come-funziona p {
    color: #868686 !important;
    text-align: center;
    line-height: 1.8 !important;
    font-size: 18px !important;
    margin-top: 20px;
}

.app-description p:first-of-type span {
    font-size: 26px!important;
    text-transform: uppercase;
    line-height: normal;
}

p.dark-bold {
    text-transform: uppercase;
    color: #444;
    font-size: 30px;
    text-align: left;
    margin: unset;
    line-height: 1.8;
}

p.dark-small {
    font-size: 20px;
    color: #444;
    line-height: 1.8;
}

/*#endregion*/

/*#region Vantaggi*/

.span-vantaggi {
    text-transform: uppercase;
    font-size: 24px;
    color: var(--orange_kerberos);
}

.span-vantaggi.title-vantaggi {
    font-weight: bold;
}

.maggiordomo .vantaggi p {
    margin: 0;
    line-height: 1.7;
    font-size: 18px;
    color: #3e3e3e;
}

.vantaggi-details, .servizi-details {
    position: -webkit-sticky;
    position: sticky;
    top: 64px;
    left: 0;
}

.preventivo-form input[type="text"],
.preventivo-form textarea,
.preventivo-form input[type="number"],
.modal-installatore input[type="text"],
.modal-installatore textarea {
    background-color: inherit;
    color: #777777;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    font-size: 16px;
}

.preventivo-form input[type="text"], .preventivo-form input[type="number"] {
    height: 40px;
}

.preventivo-form textarea {
    height: 160px;
}

#richiedi-preventivo {
    text-align: center;
    padding: 5% 15%;
}

#richiedi-preventivo span {
    color: var(--orange_kerberos);
    text-transform: uppercase;
    font-size: 30px;
    font-weight:300;
    font-weight: bold;
}

.preventivo-form {
    margin-top: 50px;
    text-align: left;
}

    .preventivo-form span.red,
    span.field-validation-error {
        text-transform: none !important;
        font-size: 17px !important;
        color: #f00 !important;
    }

.field-validation-valid {
    display: none;
}

.lbl-dati {
    display: inline !important;
    font-size: 12px;
    color: #777;
    text-align: left;
    line-height:18px;
    margin-top:-2px !important;
}

.vantaggi-specifiche {
    height: 100%;
}

.vantaggi-specifiche span, .dropdown-btn {
    text-transform: uppercase;
    border: none;
    width: 100%;
    text-align: left;
    cursor: pointer;
    outline: none;
    background-color: #FFF;
    font-size: 14px;
    display: block;
    padding-left: 20px;
    position: relative;
}

.vantaggi-specifiche span.collapsed {
    color: #8f8f8f;
}

.vantaggi-specifiche span {
    color: var(--orange_kerberos)
}

.vantaggi-specifiche .border-bottom-grey {
    border-color: #ededed;
    padding:7px 0;
}

.vantaggi-specifiche span.collapsed:before {
    content: '\f107';
}

.vantaggi-specifiche span:before {
    content: '\f106';
    position: absolute;
    left: 0;
    font-family: FontAwesome;
    font-size: 18px;
    line-height: 26px;
    font-weight: bold;
}

.vantaggi-specifiche span {
}

.dropdown-container {
    display: none;
}

.dropdown-container p {
    font-size: 14px !important;
}

.activeOrange {
    background: var(--orange_kerberos);
}

.border-bottom-grey {
    border-bottom: 1px solid #c0c0c0;
    padding:4px 0;
}

.border-bottom-grey-right {
    padding: 10px 0;
    border-bottom: 2px solid #c0c0c0;
    right: 10px;
}

.border-bottom-grey-left {
    padding: 10px 0;
    border-bottom: 2px solid #c0c0c0;
    left: 10px;
}

.form-installatore {
    text-align: center;
    margin-top: 40px;
    padding: 30px 0;
}

.form-installatore-titolo {
    color: var(--orange_kerberos) !important;
    text-transform: uppercase;
}

.margin-details {
    margin-top: 30px;
}

.no-spin::-webkit-inner-spin-button, .no-spin::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
    -moz-appearance: textfield !important;
}

.modal-installatore {
    padding: 25px;
}

    .modal-installatore p {
        text-transform: uppercase;
        color: var(--orange_kerberos);
        text-align: center;
        font-size: 19px;
    }

.modal-installatore-header {
    padding: 15px;
}

.modal-installatore-footer {
    padding: 0 15px 15px 15px;
    text-align: right;
}
/*#endregion*/

/*#region Servizi*/

.servizi span.title-servizi,
.vantaggi span.title-vantaggi,
.ambiti-applicativi span.title-servizi {
    text-transform: uppercase;
    font-size: 18px;
    color: #174a8b;
}

.servizi p {
    margin-bottom: 18px;
    line-height: 1.8;
}

.dark-p {
    margin-top: 18px;
    font-size: 14px;
    color: #8f8f8f;
}

div.dark-p span {
    font-size: 14px !important;
    color: #8f8f8f !important;
}

.light-p {
    font-size: 14px;
    color: #8f8f8f;
}

div.light-p span {
    font-size: 14px !important;
    color: #8f8f8f !important;
}

.margin-details-servizi > div,
.margin-details-vantaggi > div {
    margin-bottom: 30px;
}

.title-servizi img {
    vertical-align: baseline;
    margin-right: 20px;
    height: 55px;
    margin-bottom: -4px;
}

.margin-details-servizi#formazione img,
.margin-details-servizi#training img {
    height: 100px;
    margin-bottom: -29px;
}

.servizi-details,
.vantaggi-details {
    margin-bottom: 30px;
}

/*#endregion*/

/*#region ComeFunziona*/

div.come-funziona {
    padding: 30px 0;
}

.come-funziona h3 {
    text-transform: uppercase;
    color: var(--orange_kerberos);
    font-size: 18px;
    text-align: left;
    margin-bottom: 0;
}

.come-funziona h3 p span{
    text-transform: uppercase;
    color: var(--orange_kerberos)!important;
    font-size: 18px!important;
    font-weight: unset!important;
}

.come-funziona .paragrafo p {
    text-align: left !important;
    display: inline;
}

.p-small {
    font-size: 17px !important;
    text-align: left !important;
}

.come-funziona .border-bottom-grey {
    padding-bottom: 30px;
    padding-top: 0;
}

.img-small {
    vertical-align: text-bottom;
    margin-right: 12px;
}

.come-funziona i {
    font-size: 35px;
    margin-right: 15px;
}

.margin-come-funziona {
    margin: 15px 0 50px 50px;
}
/*#endregion*/

/*#region CookiePolicy */
#iubenda-cs-banner {
    bottom: 0px !important;
    left: 0px !important;
    position: fixed !important;
    width: 100% !important;
    z-index: 99999998 !important;
    background-color: black;
}

.iubenda-cs-content {
    display: block;
    margin: 0 auto;
    padding: 20px;
    width: auto;
    font-family: Helvetica,Arial,FreeSans,sans-serif;
    font-size: 14px;
}

.iubenda-banner-content {
    color: #FFFFFF;
}

.iubenda-cs-content {
    background: var(--gray_kerberos);
}





.iubenda-cs-rationale {
    max-width: 900px;
    position: relative;
    margin: 0 auto;
}

.iubenda-banner-content > p {
    font-family: Helvetica,Arial,FreeSans,sans-serif;
    line-height: 1.8;
}

.iubenda-cs-close-btn {
    margin: 0;
    color: #fff;
    text-decoration: none;
    font-size: 20px;
    position: absolute;
    top: 0;
    right: 0;
    border: none;
    background-color: inherit;
}

.iubenda-cs-cookie-policy-lnk {
    text-decoration: underline;
    color: #fff;
    font-size: 14px;
    font-weight: 900;
}


/*#endregion */
/*#region About */

.about-page-second-title p span,
.about-page-third-title p span {
    font-size: 30px!important;
    font-weight:bold!important;
}

.about-page-small p span{
    font-size: 14px!important;
}
/*#endregion */

/*#region Risorse */

.risorsa-detail p {
    font-size: 15px;
    max-height: 80px;
    color: #8f8f8f;
    margin-bottom:0;
}

#risorse-download .risorsa-detail p, #risorse-download .risorsa-lista .descrizione {
    max-height: none;
}
#risorse-download .risorsa-lista .risorsa-detail.descrizione {
    margin-top:0;
}

.risorsa-lista .img-risorsa {
    text-align: center;
    position: relative;
    border: 1px solid #dbdbdb;
    font-size: 30px;
    padding: 35px 0;
}

    .risorsa-lista .img-risorsa .fa-download {
        position: absolute;
        z-index: 1;
        right: 5px;
        bottom: 5px;
        font-size: 22px;
    }



.risorsa-lista .img-risorsa {
    color: var(--gray_kerberos);
}

.download-button {
    text-align: center;
    text-transform: uppercase;
    color: white;
    font-weight: lighter;
    /*position: absolute;
    bottom: 8px;*/
}

.download-button {
    background: #174a8b;
}

.download-button {
    background-color: var(--orange_kerberos);
}

.risorsa-lista {
    margin-bottom:20px;
}

.risorsa-lista .risorsa-detail.descrizione {
    margin-top: 18px;
}

.risorsa-lista .img-risorsa img {
    width: 45%;
    margin: auto;
}

/*#endregion */


#iubenda_policy .iub_content {
    padding: 25px 0 !important;
}

.menu-toggle {
    display: none;
}

.menu_central {
    flex: 1;
    display: flex;
    justify-content: center;
    flex-direction: row;
    position: absolute;
}

.container-menu {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60px;
}

.contatti_mobile {
    display: none;
}

.filtro_prodotti {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    flex-wrap: nowrap;
}

.filtro_prodotti div {
    padding: 10px;
    width: 100%;
}

/* Box Content */
.box-content {
    padding: 0;
}

/* CTA Image */
.cta-image {
    max-width: 100%;
}

/* Box Image */
.box-image {
    display: flex;
    position: relative;
    bottom: 0;
    right: 20%;
}

/* Content Box */
.content-box {
    padding: 30px 35px 30px 30px;
    width: 500px;
    background-color: white;
    flex: 1;
    border-radius: 8px;
    position: relative;
    top: 70px;
    box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.2);
}

/* Content Title */
.content-title {
    margin-top: 0;
    font-weight: 400;
    font-size: 4.5rem;
    line-height: 1.1;
}

/* Content Description */
.content-description {
    margin: 15px 0 30px;
    font-size: 1.7rem;
}

.sottotitolo_home_page {
    text-align: center;
    padding-bottom: 20px;
    
}

/*---------------------- inizio home page ----------------------*/
.inizio_home {
    /* Stili CSS comuni (min-height, background-attachment, etc.) */
    position: relative;
    width: 100%;
    height: calc(100svh - 60px);
    overflow: hidden;
}

    .inizio_home video,
    .inizio_home img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        max-width: 100%;
    }

.inizio_home_h1 {
    will-change: transform;
    text-align: left;
    display: table;
    text-align: center;
    width: -webkit-fit-content;
    width: fit-content;
    font-family: Roboto, sans-serif;
    color: inherit;
    font-size: 6.5vw;
    height: 3.5vw;
    filter: drop-shadow(0px 0px 10px black);
}

.inizio_home_h2 {
    will-change: transform, opacity;
    pointer-events: initial;
    font-size: 3vw;
    letter-spacing: 0px;
    text-transform: none;
    font-weight: 700;
    padding: 0;
    word-wrap: break-word;
    position: relative;
    color: #ffffff !important;
    flex-shrink: 0;
    margin: 0VW;
    filter: drop-shadow(0px 0px 10px black);
}

/* Correzione posizione e dimensioni */
.circle-arrow {
    width: 50px;
    height: 50px;
    background: rgba(255, 255, 255, 0.5);
    border-radius: 50%;
    position: relative;
    bottom: 80px;
    left: 50%;
    transform: translate(-50%);
}

    /* Freccia rivolta verso il basso corretta */
    .circle-arrow::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        width: 0;
        height: 0;
        border-top: 8px solid #000; /* Colore della freccia */
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        transform: translate(-50%, -50%);
    }

/*.home-page-card-hover {
    position: relative;*/ /* Importante per posizionare la descrizione in modo assoluto */
/*overflow: hidden;*/ /* Nasconde la descrizione fuori dalla card inizialmente */
/*transition: all 0.3s ease;*/ /* Transizione fluida per tutti gli elementi */
/*}*/

.home-page-content-hover {
    width: 100%;
    height: 100%;
    text-align: center;
    box-sizing: border-box;
}


.home-page-titolo-hover {
    transition: transform 0.5s ease; /* Transizione per lo spostamento del titolo */
    transform: translateY(0); /* Posizione iniziale del titolo */
    margin-bottom: 0; /* Rimuovi margine inferiore per avvicinare alla descrizione */
}

.home-page-descrizione-contenitor {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*background: linear-gradient(to bottom, #000000b8 0%, #ffffff00 100%);*/
    color: #ffffff;
    padding: 10px 20px 0 20px;
    box-sizing: border-box;
    /*opacity: 0;*/
    /*transform: translateY(-100%);*/
    z-index: 1;
    transition: opacity 0.5s ease, transform 0.5s ease;
    overflow: hidden;
}

.home-page-descrition-hover {
    height: 100%;
    overflow: hidden;
}

.home-page-immagine-hover {
    height: 300%;
}

/* Effetto Hover */
/*.home-page-card-hover:hover .home-page-immagine-hover {
    filter: blur(5px);*/ /* Aumenta il blur al passaggio del mouse */
/*}

.home-page-card-hover:hover .home-page-descrizione-contenitor {
    opacity: 1;*/ /* Rendi la descrizione visibile al passaggio del mouse */
    /*transform: translateY(0);*/ /* Porta la descrizione nella vista dal basso */
/*}

.home-page-card-hover:hover .home-page-content-hover {
    justify-content: flex-start;*/ /* Sposta il contenuto (titolo) verso l'alto per fare spazio alla descrizione */
    /*align-items: flex-start;*/ /* Allinea il titolo a sinistra */
/*}*/


.laNostraEsperienza{
    padding: 50px 100px; background: #fafafa;
}
/*---------------------- cosa facciamo ----------------------*/
.even_image {
    position: relative;
    background: linear-gradient(to right, #0D284F 30%, white 100%);
}

.odd_image {
    position: relative;
    background: linear-gradient(to right, white 0%, #0D284F 60%);
}

.wrapper_image {
    height: 100%;
}

.cosa_facciamo_image {
    width: 100%;
    max-width: 445px;
    border-radius: 8px;
    /*box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);*/
    transition: transform 0.3s ease;
}
.odd {
    flex-direction: row-reverse;
}

.chi_siamo_content-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
}



.text-container_h2 {
    font-size: 3.5rem; /* Scegli una dimensione del font grande per un buon effetto */
    font-weight: bold; /* I font spessi funzionano meglio */
    /* Imposta l'immagine come sfondo */
    background-image: url('/Images/newHome/webp/cosa_facciamo_mask.webp');
    background-size: cover; /* o 'contain', o dimensioni specifiche */
    background-position: center;
    /* La magia avviene qui: */
    -webkit-background-clip: text; /* Per browser basati su WebKit (Chrome, Safari, Edge) */
    background-clip: text; /* Standard (Firefox) */
    /* Rendi il colore del testo trasparente per mostrare lo sfondo */

    background-position: top;
    color: transparent;
    line-height: 50px;
    height: 80px;
    width: 100%
}
    

    .text-container_p {
        font-size: 1.1vw;
        line-height: 23px;
    }

.cosa-facciamo {
    display: grid;
    grid-template-columns: repeat(3, calc(33.3333% - 17.3333px)); /* Tre colonne di default */
    grid-gap: 26px;
    text-align: center;
    padding: 20px; /* Opzionale, per migliorare il layout */
}

.cosa-faccimao-container {
    padding: 100px 0% 50px 0%
}

.cosa-facciamo-item {
    text-align: left;
    display: flex;
    position: relative;
    box-sizing: border-box;
}

.content {
    padding: 30px 0;
    position: relative;
    flex: 1;
    max-width: 100%;
    transition-duration: inherit;
    text-align: left;
}

.image_cf {
    height: 55px;
    width: 55px;
    text-shadow: -2px 0 0 rgba(0, 0, 0, 0);
    margin: 2px auto 0 0;
    padding: 0;
    color: #174a8b !important;
    display: block;
    line-height: 0;
    border-width: 0px;
    text-align: left;
}

.title_cf {
    font-weight: 400;
    font-size: 2.25rem;
    margin: -55px 0 0 85px;
    word-wrap: break-word;
    position: relative;
    text-align: left;
}

.description_cf {
    font-size: 1.5rem !important;
    font-style: normal;
    margin: 13px 1px 0 85px;
    line-height: 1.6;
    text-align: left;
}

.section-title {
    font-size: 2.5rem;
    margin-bottom: 20px;
    text-align: center;
}


/*I NOSTRI PROGETTI (HOME)*/
.home_project_container {
    margin-bottom: 0;
    grid-gap: 17px;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
}

.home_project_gallery {
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 17px;
    display: grid;
    flex: 1 1 auto;
    box-sizing: border-box;
}

.home_project_gallery_container {
    cursor: pointer;
    position: relative;
    overflow: hidden;
    height: 200px;
    box-shadow: 3px 3px 10px 0px rgb(0 0 0);
}

.home_project_gallery_container_image {
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    transition: transform 0.5s ease, filter 0.5s ease;
}

.home_project_gallery_container_image img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
    position: absolute !important;
    left: 0;
    top: 0;
    overflow-clip-margin: content-box;
    overflow: clip;
    transition: transform 0.5s ease, filter 0.5s ease; /* Aggiunto per animare immagine */
}

.home_project_gallery_container_text {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(180deg, rgb(0 0 0 / 13%), rgb(0 0 0 / 95%));
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    color: white;
    transition: 0.5s ease;
    text-align: left;
    padding: 20px;
    box-sizing: border-box;
}

.title_list {
    margin-bottom: 0;
    transition: 0.5s ease;
    width: 100%;
    max-width: 100%;
    text-overflow: ellipsis;
    font-size: 18px;
}

.text_list {
    font-size: 0.9em !important;
    margin-top: 5px;
    margin-bottom: 0;
    transform: translateY(100%);
    opacity: 0;
    transition: 0.5s ease;
    width: 100%;
    height: 0px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Effetto al passaggio del mouse */
    .home_project_gallery_container:hover .home_project_gallery_container_image img {
    transform: scale(1.1); /* Ingrandisce leggermente l'immagine */
}

.home_project_gallery_container:hover .home_project_gallery_container_text {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.4));
}

.home_project_gallery_container:hover .text_list {
    height: 100%;
    transform: translateY(0);
    opacity: 1;
}

.home_project_gallery_container:hover .title_list {
    transform: translateY(0);
    opacity: 1;
}

.home_project_gallery_container.active .home_project_gallery_container_text {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.4)); /* Mantiene lo stesso effetto "active" se necessario */
}

.home_project_gallery_container.active .home_project_gallery_container_image img {
    transform: scale(1.1); /* Ingrandisce leggermente l'immagine */
}

.contattaci_home {
    /* Stili CSS comuni (min-height, background-attachment, etc.) */
    min-height: 500px;
    background-attachment: fixed;
    background-position: 50% 0px;
    background-size: cover;
    /* Immagine WebP come predefinita (per browser che supportano WebP) */
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45)), url("/images/newHome/webp/parallax_home.webp");
}

/* Fallback per browser che NON supportano WebP (JPG o PNG) */
.no-webp .contattaci_home {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0.45)), url("/images/newHome/JPGorPNG/parallax_home.jpg");
}

.contattaci_home_container {
    min-height: calc(100svh - 60px);
    display: flex;
    position: relative;
    box-sizing: border-box;
    margin: 0 auto;
    color: #ffffff;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    /*background-image: url("/images/TESTimg/grana1_blurrr.webp");*/
    /*background: rgb(0 0 0 / 35%);*/
}

.contattaci_home_h2 {
    will-change: transform;
    animation-duration: 2000ms;
    text-align: left;
    display: table;
    /* align-self: flex-start; */
    width: -webkit-fit-content;
    width: fit-content;
    font-family: Roboto, sans-serif;
    color: inherit;
    font-size: 4.5vw;
    height: 3.5vw;
}

.contattaci_home_h3 {
    will-change: transform, opacity;
    animation-duration: 1500ms;
    pointer-events: initial;
    font-size: 2vw;
    letter-spacing: 0px;
    text-transform: none;
    line-height: 1.4;
    font-weight: 700;
    padding: 0;
    word-wrap: break-word;
    position: relative;
    color: #ffffff !important;
    /* text-align: left; */
    /* text-align: left; */
    flex-shrink: 0;
    max-width: 1200px
}

.contattaci_home_a {
    pointer-events: auto;
    text-transform: uppercase;
    background-color: var(--gray_kerberos);
    color: #fff !important;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    user-select: none;
}

.contattaci_home_a:hover {
    background-color: #7b7b7b;
}


/*.section-title {
    font-weight: bold;*/ /* Titolo in grassetto */
    /*color: var(--orange_kerberos);*/ /* Colore arancione */
    /*text-align: center;
    font-size: 24px;*/ /* Puoi adattare la dimensione se necessario */
    /*margin-bottom: 20px;
}*/

.cdic-wrapper {
    position: relative;
    overflow: hidden;
    width: 100%;
}

.cdic {
    display: flex;
    gap: 20px;
    will-change: transform;
}

.cdic-item {
    background-color: #f7f7f7;
    border-radius: 8px;
    padding: 20px;
    min-width: 400px;
    flex: 0 0 30%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.quote {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    color: #333;
    position: relative;
}

.quote-icon {
    font-size: 40px;
    color: #174a8b;
    font-weight: bold;
}

.quote-icon:first-of-type {
    position: absolute;
    left: -20px;
    top: 0;
}

.quote-icon:last-of-type {
    position: absolute;
    right: -20px;
    bottom: 0;
}

.cdic-container {
    text-align: center;
    font-size: 18px;
    line-height: 1.6;
    color: #333;
    padding: 10px 0;
}

.author {
    text-align: right;
    font-size: 14px;
    font-weight: bold;
    color: var(--orange_kerberos);
    margin-top: 15px;
}

.team-container {
    padding: 20px;
    background-color: #f7f7f7;
    text-align: center;
}

.section-title {
    font-size: 24px;
    margin-bottom: 20px;
    color: #333;
}

.team {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px;
}

.team-member {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    padding: 20px;
    width: 250px;
    text-align: center;
}

.team-image {
    margin-bottom: 15px;
}

.team-name {
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 5px;
    color: #333;
}

.team-role {
    font-size: 14px;
    color: #777;
    margin-bottom: 15px;
}

.team-social a {
    display: inline-block;
    margin: 0 5px;
    color: #555;
    font-size: 18px;
}

    .team-social a:hover {
        color: #007bff;
    }

.no-select {
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}


/*------------- landing page --------------------*/
.background_lp {
    display: flex;
    justify-content: flex-end;
    background-image: /*url(https://www.varya.it/wp-content/uploads/2021/08/purificazione-sanificazione-aria-scaled.jpg);*/ url(/Images/LP/air_1.webp);
    background-size: cover;
    background-position: center;
}

.container_page_lp {
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
}

.container_lp {
    width: 100%;
    max-width: 800px;
    margin: 3rem;
    padding: 2rem;
    background: white;
    border-radius: 15px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* MODIFICA - Rendi sempre visibili i form-step */
.form-step {
    /* display: none;  Rimosso display none */
    margin-bottom: 2rem; /* Aggiunto un margine bottom per separare gli step */
}

.form-group {
    margin-bottom: 20px;
}

.step-header {
    display: flex;
    align-items: center;
    /*margin-bottom: 1rem;*/
}

.step-number h3 {
    width: 100%
}

.step-number {
    width: 32px;
    height: 32px;
    background: var(--orange_kerberos);
    color: white;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 1rem;
    font-weight: bold;
}

.card-group {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.card-option {
    position: relative;
    cursor: pointer;
    text-align: center;
}

.card-option input {
    position: absolute;
    opacity: 0;
}

.card-option .card-content {
    background: var(--gray-light);
    border-radius: 10px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.card-option input:checked + .card-content {
    border-color: var(--orange_kerberos);
    background: var(--orange-light);
}

.card-option:hover .card-content {
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

.button-group {
    margin-top: 2rem;
    display: flex;
    justify-content: center; /* Modificato da flex-end a center per centrare il pulsante Calcola */
    gap: 1rem;
}

.btn {
    padding: 0.8rem 1.5rem;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    transition: all 0.5s ease;
    cursor: pointer; /* Aggiunto cursor pointer per chiarezza */
}

/* NUOVO - Stile per il pulsante "Calcola" (btn-primary) */
.btn-primary {
    background: var(--orange_kerberos); /* Usa il colore arancione come next-step */
    color: white;
}

    .btn-primary:hover {
        background: #E55A2B; /* Usa l'hover di next-step */
        transform: translateY(-1px);
    }

/* MODIFICA - Stile per il pulsante "prova un'altra combinazione" (prev-step-button - riutilizzato) */
.btn.prev-step-button { /* Applica lo stile solo se ha sia classe btn che prev-step-button */
    background: white;
    color: var(--orange_kerberos);
    border: 2px solid var(--orange_kerberos);
}


.risultato-calcolo {
    margin-top: 2rem;
    padding: 2rem;
    background: gainsboro;
    border-radius: 8px;
    animation: fadeIn 0.5s ease;
    text-align: center; /* Centra il testo nella sezione risultato */
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Stili generali per il corpo del testo e i contenitori */
.motivazioni-container {
    max-width: 1200px;
    margin: 3rem auto;
    padding: 0 15px;
}

.motivazione-item {
    margin-bottom: 20px;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.motivazione-header {
    background: var(--gray-light);
    color: white;
    padding: 15px 20px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.motivazione-header h3 {
    margin: 0;
    font-size: 1.5rem;
    border-bottom: none !important;
    padding-bottom: 0 !important;
    color: var(--gray_kerberos);
}

.toggle-icon {
    font-size: 24px;
    transition: transform 0.3s ease;
    color: var(--gray_kerberos);
}

.motivazione-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s ease;
    background-color: white;
}

.content-wrapper {
    display: flex;
    /*flex-direction: row;*/
    padding: 20px;
    gap: 50px;
}

.text-container {
    width: 50%;
    display: flex;
    flex-wrap: wrap;
    padding: 20px;
    gap: 10px;
    flex-direction: column;
}

.motivazione-image:hover {
    transform: scale(1.02);
}

.text-content {
    flex: 1;
}

.image-content {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.motivazione-image {
    width: 100%;
    max-width: 500px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    transition: transform 0.3s ease;
}

    .motivazione-image:hover {
        transform: scale(1.02);
    }

.active .motivazione-content {
    max-height: 2000px; /* Un valore alto per contenere qualsiasi contenuto */
}

.active .toggle-icon {
    transform: rotate(45deg);
}

.motivazione-item:hover {
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}


/*--------------- blog ------------------*/

.blog-list-container {
    display: flex;
    padding: 0 20px;
    justify-content: center;
}

.blog-sidebar-left {
    width: auto;
    margin-right: 30px;
    flex-shrink: 0;
    padding-top: 20px;
    position: sticky;
    top: 60px;
    align-self: flex-start;
    grid-column: 1 / 2;
    position: sticky;
    height: calc(100vh - 80px);
    overflow-y: auto;
    background-color: #fff;
    border-radius: 5px;
    scrollbar-width: none;
    z-index: 1;
}

.blog-sidebar-top-mobile {
    display: block;
}

.blog-mobile-dropdown {
    position: relative;
    width: 100%;
}

.blog-mobile-dropdown-button {
    padding: 10px 15px;
    padding: 5px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background-color: #fff;
    cursor: pointer;
    display: none;
    width: 100%;
}

.blog-mobile-category-list {
    list-style: none;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 100%;
    left: 0;
    background-color: #fff;
    border: 1px solid #ddd;
    border-top: none;
    border-radius: 0 0 5px 5px;
    width: 200px;
    z-index: 10;
    display: none;
}

    .blog-mobile-category-list.show {
        display: block;
    }

    .blog-mobile-category-list li a {
        display: block;
        padding: 8px 12px;
        color: #444;
        text-decoration: none;
        transition: background-color 0.2s ease;
    }

        .blog-mobile-category-list li a:hover {
            background-color: #f5f5f5;
        }

.blog-search-input {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 5px;
    box-sizing: border-box;
}

.blog-sidebar-categories-desktop {
    display: block;
}

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


.blog-category-list li a {
    display: block;
    color: #444;
    text-decoration: none;
    border-radius: 5px;
    transition: background-color 0.2s ease;
    padding: 5px
}

.blog-category-list li a:hover {
    background-color: #f5f5f5;
}

.blog-post-contenitor {
    display: flex;
    flex-wrap: wrap;
    row-gap: 20px;
    max-width: 100%;
    padding-bottom: 5.625rem;
    padding-top: 5.625rem;
    flex-grow: 1;
}

.blog-post {
    width: 33%;
    box-sizing: border-box;
    padding-left: 20px;
}

.blog-post-card {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    background-color: #fff;
    box-shadow: 0 0 2px rgba(0, 0, 0, .1), 0 12px 24px rgba(0, 0, 0, .1);
    height: auto;
    transition: transform 0.5s ease, box-shadow 0.5s ease;
    display: flex;
    flex-direction: column;
}

.share-icons {
    display: flex;
    gap: 10px;
    padding: 10px;
}

.condvidiBlogIcon {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: white !important;
    cursor: pointer;
    transition: transform 0.2s !important;
}

.linkedin {
    background-color: #0077B5;
}

.facebook {
    background-color: #1877F2;
}

.whatsapp {
    background-color: #25D366;
}

.share {
    background-color: #555;
}

.condvidiBlogIcon:hover {
    transform: scale(1.1);
}

.prodottoEvidenziato {
    width: 66%;
}

/* Classe per il link principale */
.prodottoEvidenziato-link {
    /* Se necessario, aggiungi stili specifici per il link */
    text-decoration: none;
    color: inherit;
}

/* Contenitore principale del prodotto */
.prodottoEvidenziato-card {
    height: auto;
    background: linear-gradient(to bottom right, var(--primary-color-darker) 30%, #00bfcc 75%, var(--primary-color-darker) 100%);
}

/* Titolo con codice del prodotto (h2) */
.prodottoEvidenziato-codice {
    color: white !important;
    text-align: center;
    padding: 10px;
    border-bottom: 1px solid white;
    z-index:1
}

/* Contenitore flex per immagine e testo */
.prodottoEvidenziato-flex-container {
    display: flex;
    flex-direction: row-reverse;
    height: 268px;
}

/* Immagine del prodotto */
.prodottoEvidenziato-image {
    padding: 10px;
    /*width: 100%;*/
}

/* Stile specifico per l'elemento img */
.prodottoEvidenziato-image-tag {
    width: auto;
    max-height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
    max-width: 100%;
}

/* Contenitore del testo e del CTA */
.prodottoEvidenziato-content {
    height: 100%;
    width: 100%;
    position: relative;
    text-align: start;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 20px;
}

/* Sottotitolo (h4) con la descrizione */
.prodottoEvidenziato-subtitle {
    color: white;
    text-transform: capitalize;
}

/* Testo del CTA (chiedi info) */
.prodottoEvidenziato-cta {
    color: white;
    text-decoration: underline;
    font-size: 20px;
}

.blog-post-card:hover {
    transform: scale(1.05);
    box-shadow: 0 0 8px rgba(0, 0, 0, .2), 0 16px 32px rgba(0, 0, 0, .2);
}

.blog-post-image {
    /* padding: 100px;  rimosso padding che serviva probabilmente per dare aspect ratio al div con background image */
    overflow: hidden; /* importante per far funzionare object-fit: cover correttamente */
    height: 100%; /* altezza fissa desiderata per l'immagine, puoi modificarla */
    /*min-height:204px*/
}

.blog-post-image-tag {
    width: 100%;
    height: 100%;
    object-fit: cover; 
    object-position: center top; 
    display: block; 
    max-width: 100%;
}


.blog-post-content {
    padding: 20px;
    padding-bottom: 0;
    height: 75px;
}

.blog-post-description {
    color: #444;
    font-size: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog-post-title {
    font-size: 22px;
}

.blog-post-meta {
    font-size: 13px;
    color: #888;
    margin-top: auto;
    padding: 10px;
    padding-left: 20px;
    padding-top: 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

    .blog-post-meta span {
        margin-right: 15px;
    }

.blog-post-category-label {
    position: absolute;
    bottom: 10px;
    right: 10px;
    font-size: 0.8em;
    color: #777;
    padding: 5px 8px;
    background-color: #f0f0f0;
    border-radius: 3px;
}

.blog-post-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

.blog-sidebar-search {
    padding: 0px 0 10px 10px;
}


.blog-read-main-title {
    font-size: 2.5em;
    margin-bottom: 10px;
    color: #2c3e50; /* Colore titolo principale */
}


.blog-read-header-section {
    background-color: #fff; /* Sfondo header */
    padding: 20px;
    text-align: center;
    margin-bottom: 20px;
    position: relative;
}

.blog-read-progress-bar-container {
    height: 10px;
    background-color: #e0e0e0;
    top: 75px;
    z-index: 1000;
    width: 90%;
    transform: translateX(5%);
    position: sticky;
    transition: width 0.3s ease-out, transform 0.3s ease-out; /* Transizione per il container */
}

.blog-read-progress-bar-container.is-sticky {
    width: 100%;
    transform: translateX(0%);
}

.blog-read-progress-bar {
    height: 100%;
    width: 0%; /* Aggiornata da JS */
    background-color: #2980b9;
    transition: width 0.4s ease; /* Transizione per la barra di progresso (Mantenuta) */
}

.blog-read-container {
    display: grid;
    grid-template-columns: 300px 1fr 300px;
    gap: 20px;
    margin: 20px auto;
}


.blog-read-sidebar-left {
    grid-column: 1 / 2;
    position: sticky;
    top: 60px;
    height: calc(100vh - 80px);
    overflow-y: auto;
    padding: 20px;
    background-color: #fff;
    border-radius: 5px;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

.blog-read-sidebar-left::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Edge */
}

.blog-read-sidebar-right {
    grid-column: 3 / 4; /* Sidebar destra nella terza colonna */
    /* Sidebar sticky */
    position: sticky;
    top: 60px; /* Spostata più in basso, regolabile */
    height: calc(100vh - 80px); /* Altezza viewport meno spazio per top e bottom (aumentato per il nuovo top) */
    overflow-y: auto; /* Scroll interno se il contenuto è troppo lungo */
    padding: 20px;
    background-color: #fff; /* Sfondo sidebar */
    border-radius: 5px; /* Bordi arrotondati sidebar */
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer 10+ */
}

.blog-read-sidebar-right::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Edge */
}

.blog-read-sidebar-title {
    font-size: 1.4em;
    margin-bottom: 15px;
    color: #34495e; /* Colore titolo sidebar */
    border-bottom: 2px solid #e0e0e0; /* Linea sotto il titolo */
    padding-bottom: 5px;
}

.blog-read-category-list {
    list-style: none; /* Rimuove i puntini dalla lista */
}


.blog-read-category-list li a {
    display: block; /* Rende il link cliccabile su tutta la larghezza */
    color: #333;
    text-decoration: none;
    border-radius: 3px;
    transition: background-color 0.3s ease;
    padding: 5px;
}

.blog-read-category-list li a:hover {
    background-color: #f0f0f0; /* Leggero sfondo al hover */
}

.blog-read-content {
    grid-column: 2 / 3; /* Contenuto principale nella seconda colonna */
    background-color: #fff; /* Sfondo contenuto principale */
    padding: 20px;
    border-radius: 5px; /* Bordi arrotondati contenuto */
    overflow-x: auto;
}

.blog-read-main-image {
    margin-bottom: 20px;
    overflow: hidden;
    border-radius: 5px;
    display: flex;
    justify-content: center;
}

.blog-read-img-responsive {
    display: block;
    height: auto;
    min-width: 100%;
    object-fit: cover;
    object-fit: contain;
    max-height: 500px;
}

.blog-read-title {
    margin-bottom: 30px;
    color: #2c3e50;
    font-size: 40px;
    font-weight: bold;
    margin-top: 0;
    line-height: 38px;
    text-align: center;
}

.blog-read-subtitle {
    margin-bottom: 15px;
    color: #2c3e50; /* Colore sottotitolo */
    line-height: 42px;
    text-transform: uppercase;
}

.blog-read-text-content {
    margin-bottom: 30px;
    color: #555; /* Colore testo contenuto */
    /* Puoi aggiungere stili specifici per paragrafi, liste, etc. qui */
}

.blog-read-text-content a{
    color: var(--orange_kerberos)
}

.blog-read-text-content p {
    margin-bottom: 15px;
    font-size: 16px;
    color: #34495e;
}
.blog-read-text-content h2 {
    font: 600 1.42857em / 1.2 ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
}

.blog-read-text-content h3 {
    font: 600 1.14286em / 1.25 ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Ubuntu, system-ui, "Helvetica Neue", sans-serif;
    margin-bottom: 10px;
    text-align: start;
}

.blog-read-section-title {
    font-size: 1.6em;
    margin-bottom: 20px;
    color: #34495e; /* Colore titolo sezione */
    border-bottom: 2px solid #e0e0e0; /* Linea sotto il titolo sezione */
    padding-bottom: 5px;
}

.blog-read-latest-news {
    margin-top: 20px;
}

.blog-read-latest-news-item {
    display: flex; /* Layout flessibile per immagine e testo */
    align-items: flex-start; /* Allinea gli elementi in alto */
    margin-bottom: 15px;
    padding: 10px;
    border-radius: 5px;
    background-color: #f9f9f9; /* Leggero sfondo per item news */
    text-decoration: none; /* Rimuove sottolineatura link */
    color: inherit; /* Eredita colore testo */
    transition: background-color 0.3s ease;
}

    .blog-read-latest-news-item:hover {
        background-color: #f0f0f0; /* Leggero sfondo al hover */
    }

.blog-read-latest-news-image {
    width: 100px; /* Larghezza immagine latest news */
    height: 70px; /* Altezza immagine latest news */
    margin-right: 15px;
    overflow: hidden; /* Assicura che l'immagine non esca dal contenitore */
    border-radius: 5px;
}

.blog-read-latest-news-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Riempi il contenitore mantenendo le proporzioni */
    display: block;
}

.blog-read-latest-news-text {
    flex-grow: 1; /* Permette al testo di espandersi */
}

.blog-read-latest-news-title {
    font-size: 1.1em;
    font-weight: bold;
    margin-bottom: 5px;
    color: #333;
}

.blog-read-latest-news-description {
    font-size: 0.9em;
    color: #777;
}

.blog-read-related-products {
    /* Stili specifici per prodotti correlati se necessario */
}

.blog-read-product-item {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
    padding: 10px;
    border-radius: 5px;
    background-color: #f9f9f9;
}

.blog-read-product-image {
    width: 100px;
    height: 70px;
    margin-right: 10px;
    object-fit: cover;
    border-radius: 5px;
}

.blog-read-product-title {
    font-size: 0.95em;
    color: #333;
}

/* Stili per la lente di ingrandimento */
.search-icon {
    cursor: pointer;
}

/* Stili per lo sfondo sfocato */
.blurred-background {
    filter: blur(5px);
    pointer-events: none; /* Impedisce interazioni con gli elementi sfocati */
    overflow: hidden; /* Blocca lo scrolling */
}

/* Stili per la barra di ricerca */
.search-container {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: white;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    z-index: 9999999;
    display: none;
    align-items: center;
    width: 90vw;
}

.search-input {
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 3px;
    margin-right: 10px;
    width: 300px;
}

.search-button {
    padding: 10px 15px;
    background-color: var(--orange_kerberos);
    color: white;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

.search-results-container {
    margin: 2rem auto;
    padding: 1.5rem;
    color: var(--text-primary);
}

.search-results-title {
    color: var(--secondary-color);
    border-bottom: 2px solid var(--background-light);
    padding-bottom: 0.75rem;
    margin-bottom: 1.5rem;
    font-size: 2rem;
    font-weight: 700;
}

.category-section {
    margin-bottom: 2rem;
}

.category-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem 1.5rem;
    background-color: var(--background-light);
    border-radius: 0.5rem;
    margin-bottom: 0.75rem;
    cursor: pointer;
    font-weight: 600;
    color: var(--secondary-color);
    transition: background-color 0.2s ease-in-out;
}

    .category-header:hover {
        background-color: #f2f4f7;
    }

.category-title {
    margin: 0;
    font-size: 1.25rem;
}

.category-arrow {
    transition: transform 0.2s ease-in-out;
    font-size: 1rem;
    color: var(--secondary-color);
}

    .category-arrow.collapsed {
        transform: rotate(-90deg);
    }

.category-content {
    padding: 0 1.5rem 1.5rem;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.3s ease-out, opacity 0.3s ease-out, transform 0.3s ease-out;
    opacity: 0;
    transform: translateY(-10px);
}

    .category-content.expanded {
        max-height: 10000px;
        opacity: 1;
        transform: translateY(0);
    }

.articles-list, .resources-list, .blogs-list {
    list-style: none;
    padding: 0;
}

/* Disposizione orizzontale per articoli */
.articles-list {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 20px;
}

.article-item {
    background-color: white;
    border-radius: 0.5rem;
    box-shadow: 0 0.25rem 0.5rem var(--box-shadow-color);
    margin-bottom: 1rem;
    transition: box-shadow 0.3s ease;
    border: 1px solid var(--background-light);
    padding: 1.5rem;
    display: flex;
    align-items: flex-start;
    width: calc(33% - 20px); /* Regola la larghezza per la disposizione orizzontale desiderata */
    flex-direction: row; /* Forza la direzione orizzontale */
    opacity: 0; /* Inizialmente opaco a 0 per l'animazione */
    transform: translateY(20px); /* Inizia leggermente spostato verso il basso */
    transition: opacity 0.5s ease-out, transform 0.5s ease-out; /* Standard animation duration */
}

/* Disposizione verticale per risorse e blog */
.resource-item, .blog-item {
    background-color: white;
    border-radius: 0.5rem;
    box-shadow: 0 0.25rem 0.5rem var(--box-shadow-color);
    margin-bottom: 1rem;
    transition: box-shadow 0.3s ease;
    border: 1px solid var(--background-light);
    padding: 1.5rem;
    opacity: 0; /* Inizialmente opaco a 0 per l'animazione */
    transform: translateY(20px); /* Inizia leggermente spostato verso il basso */
    transition: opacity 0.5s ease-out, transform 0.5s ease-out; /* Standard animation duration */
    flex-direction: column; /* Assicurati che sia verticale */
}


    .article-item:hover, .resource-item:hover, .blog-item:hover {
        box-shadow: 0 0.5rem 1rem var(--box-shadow-color);
    }

    .article-item h3, .resource-item h3, .blog-item h3 {
        margin-top: 0;
        color: var(--accent-color);
        margin-bottom: 0.75rem;
        font-size: 1.5rem;
        line-height: 1.3;
    }

        .article-item h3 a, .resource-item h3 a, .blog-item h3 a {
            text-decoration: none;
            color: inherit;
        }

            .article-item h3 a:hover, .resource-item h3 a:hover, .blog-item h3 a:hover {
                text-decoration: underline;
                color: var(--accent-color-darker);
            }

.category-name {
    font-size: 0.875rem;
    color: var(--text-secondary);
    margin-bottom: 0.75rem;
    font-weight: 500;
}

.article-content-preview {
    color: var(--text-primary);
    margin-bottom: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 1.6;
}

.article-full-contents {
    margin-top: 1rem;
}

.article-content {
    color: var(--text-primary);
    margin-bottom: 1rem;
    line-height: 1.6;
}

.read-more-link {
    display: inline-block;
    color: var(--accent-color);
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
    transition: color 0.2s ease-in-out;
}

    .read-more-link:hover {
        color: var(--accent-color-darker);
        text-decoration: underline;
    }

.resource-description, .blog-subtitle {
    color: var(--text-secondary);
    line-height: 1.6;
    margin-bottom: 0.75rem;
}


.blog-date {
    font-size: 0.8rem;
    color: var(--text-secondary);
    margin-top: 0.5rem;
    font-style: italic;
}

.no-results {
    font-style: italic;
    color: var(--text-secondary);
    padding: 1rem;
    text-align: center;
}

.article-image {
    max-width: 100%;
    height: 100px;
    width: 100px;
    object-fit: cover;
    border-radius: 0.5rem;
    margin-right: 1.5rem;
    margin-bottom: 0;
}

.article-item-content {
    flex-grow: 1;
}

/* Classe per item visibile */
.item-visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 0.5s ease-out, transform 0.5s ease-out; /* Standard animation duration here too for consistency */
}













/*----------------------- swal -----------------------------*/
/* Hide scrollbar for Chrome, Safari and Opera */
#swal-category-list-container::-webkit-scrollbar {
    display: none;
}

/* Hide scrollbar for IE, Edge and Firefox */
#swal-category-list-container {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
}


.swal2-popup {
    background-color: #f9f9f9;
    color: #333;
    border-radius: 15px;
    font-size: 1.2em;
    height: 90vh !important;
}

.swal2-title {
    color: #333;
    font-size: 1.6em;
}

.swal2-close-button {
    color: #777;
    font-size: 2em;
}

#swal-category-list li a {
    transition: transform 0.15s, opacity 0.15s, z-index: 0.15s;
    font-size: 1.4em;
    padding: 15px 20px;
    display: block;
}

.swal2-html-container {
    padding: 0
}

#clearFiltersLink {
    text-decoration: underline;
}


.profdotti-post-container {
    display: flex;
    flex-wrap: wrap;
    row-gap: 30px;
    max-width: 100%;
    padding-top: 30px;
    flex-grow: 1;
    flex-direction: column;
    align-content: center;
    justify-content: flex-start;
}

.category-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    width: 100%;
}

.children.collapsed {
    max-height: 0; /* Usa max-height: 0 per nascondere */
    overflow: hidden; /* Importante per nascondere il contenuto che eccede max-height: 0 */
    padding: 0
}

.children {
    padding: 0 0 0 25px;
    overflow: hidden; /* Importante per nascondere il contenuto durante la transizione */
    transition-property: max-height, padding; /* Anima la proprietà max-height */
    transition-duration: 1s;
    transition-timing-function: ease;
    max-height: 1000px;
    border-left: 1px solid;
}



/*----------------------- store -----------------------------*/
/* Classe per la freccetta utilizzando un pseudo-elemento */
.category-arrow {
    position: relative;
    display: inline-block;
    margin-right: 5px;
    font-size: 14px;
    color: #333;
}

    .category-arrow::before {
        content: '';
        will-change: transform;
    }

    .category-arrow.rotated {
        transform: rotate(90deg);
    }

.category-container {
    width: 100%;
}

#librery_buttons .btn .active {
    background-color: var(--orange_kerberos);
    color: white;
}

#librery_buttons {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    grid: 10px;
    gap: 5px;
}
/*Applica lo sfondo trasparente agli elementi dispari (primo, terzo, quinto, etc.)*/
/*.category-container:nth-child(odd) {
        background-color: transparent;
    }*/
/*Applica uno sfondo leggermente opaco agli elementi pari (secondo, quarto, sesto, etc.)*/
/*.category-container:nth-child(even) {
        background-color: rgba(240, 240, 240, 0.5); 
}*/
.title-category-container {
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0 auto;
    border-bottom: solid;
    margin-bottom: 20px;
}

.accessory-star {
    position: relative;
    bottom: 24px;
    right: 0;
    color: var(--orange_kerberos);
    font-size: 15px;
    display: flex;
    width: 100%;
    flex-direction: row-reverse;
}


/*.title-category-container::before,
.title-category-container::after {
    content: "";*/ /* Crea i pseudo-elementi */
/*flex: 1;*/ /* Espande le linee fino all'estremità */
/*height: 3px;*/ /* Spessore della linea */
/*background: var(--gray_kerberos);*/ /* Colore della linea */
/*margin: 0 15px;*/ /* Spazio tra linea e titolo */
/*}*/
.title-category-container h3 {
    font-size: 30px;
    text-transform: uppercase;
    color: var(--gray_kerberos);
    margin: 0; /* Resetta i margini per evitare problemi */
}

.librery_table_scroll_wrapper {
    display: block; /* Assicura che sia un blocco */
    width: 100%; /* Occupa la larghezza disponibile del suo contenitore */
    max-width: 100%; /* Non superare la larghezza del contenitore */
    overflow-x:auto;
}

/* Stili generali per le tabelle della libreria */
.librery_table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    text-align: center;
}

/* Stile per la riga dell'header della tabella */
.librery_table_header_row {
    background-color: #f0f0f0;
    font-weight: bold;
}

/* Stile per le celle dell'header (th) */
.librery_table_header_cell {
    vertical-align: middle;
    color: #f5f5f5;
    background-color: #787777;
    padding: 10px; /* Aggiunto padding per coerenza con le celle td, se necessario */
}

.clickable-row:hover {
    cursor: pointer;
    background-color: #d4d4d4;
}

/* Stile per le celle del corpo (td) */
.librery_table_cell {
    padding: 10px;
    vertical-align: middle;
    white-space: nowrap;
}

/* Contenitore per l'immagine nella cella */
.librery_image_container {
    display: flex;
    justify-content: center;
    width: 84px; 
    margin-left: auto;
    margin-right: auto; 
}

/* Stile per l'immagine responsive all'interno del contenitore */
.librery_image_responsive {
    width: auto;
    max-width: 100%;
    height: auto;
    display: block; /* Rimuove spazi extra sotto l'immagine */
}

/* Stile per il paragrafo della descrizione */
.librery_description_paragraph {
    margin: 0;
    display: inline-block; /* Modificato da flex a inline-block per un migliore allineamento del testo */
    text-align: left; /* O 'center' se preferisci, ma 'left' è più comune per le descrizioni */
    width: 100%; /* Assicura che occupi lo spazio disponibile nella cella */
}

/* Opzionale: Classe per nascondere le sezioni inizialmente */
.librery_section_hidden {
    display: none;
}


.image-wrapper {
    position: relative;
    display: inline-block;
}

.overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* background-color: rgba(0, 0, 0, 0.6); */
    display: flex;
    justify-content: flex-start;
    pointer-events: none;
    align-items: flex-start;
    padding: 10px;
    font-size: 19px;
}

.alert-container {
    display: flex;
    padding: 10px;
    margin: 1rem auto;
    border-radius: 0.375rem;
    background-color: #fff3cd;
    border-left: 4px solid #ffeeba;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
    font-family: Arial, sans-serif;
    line-height: 1.5;
    align-items: flex-end;
}

.alert-icon {
    font-size: 5rem;
    margin-right: 1rem;
    color: #db141d;
    flex-shrink: 0;
    margin-right: 3vw;
}

.alert-content {
    display: flex;
    flex-direction: column;
}

.alert-title {
    margin: 0;
    font-weight: bold;
    text-transform: uppercase;
}

.alert-message {
    margin: 0;
    font-size: 2rem;
    hyphens: auto;
    word-break: break-word;
}

/*------------------- CTA -------------------------*/
.container {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    gap: 10px;
}

.subscribe-button, .email-input-wrapper, .email-input, .submit-button {
    border: none;
    padding: 10px 0px;
    border-radius: 7px;
    font-size: 16px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.subscribe-button {
    background-color: var(--orange_kerberos);
    color: white;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 10px;
}

    .subscribe-button:hover {
        background-color: var(--orange_kerberos);
        transform: scale(1.05) translateY(-2px);
        box-shadow: 0 6px 8px rgba(0, 0, 0, 0.15);
    }

.email-input-wrapper {
    display: flex;
    gap: 8px;
    max-width: 0;
    border-radius: 30px;
    transition: max-width 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55), margin-left 0.5s;
    justify-content: center;
    flex-direction: column;
    min-width: 100%;
    border-radius: 10px;
}

.email-input {
    padding: 15px;
    flex-grow: 1;
    background-color: #f8f8f8;
    border: none;
    outline: none;
}

    .email-input:focus {
        box-shadow: inset 0 0 5px rgba(0,0,0,0.1);
    }

.submit-button {
    /*color: var(--orange_kerberos);*/
    color: #797979;
    transition: transform 0.2s, box-shadow 0.2s;
}

    .submit-button:hover {
        transform: scale(1.05);
        box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
    }

    .submit-button:active {
        transform: scale(1.0);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    }

.hidden {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0s 0.3s;
}

.visible {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s, visibility 0s;
}

.button-to-input {
    border-radius: 30px 0 0 30px;
    padding: 15px 0;
    width: 0;
    overflow: hidden;
    display: inline-block;
    transition: width 0.5s cubic-bezier(0.68, -0.55, 0.27, 1.55), border-radius 0.3s, padding 0.5s;
    text-indent: -9999px;
    white-space: nowrap;
}

    .button-to-input.active {
        width: 150px;
        padding: 15px 0;
        border-radius: 0;
        text-indent: 0;
        transform: scale(1.05);
        box-shadow: 0 2px 5px rgba(0,0,0,0.2);
    }

.button-text {
    display: inline-block;
    margin-left: 5px;
}

.button-to-input .button-text {
    display: none;
}

.CTA {
    display: flex;
    justify-content: center;
}


/*------------ downloa ----------------*/
/* Stile base del contenitore */
.download_card {
    background-color: var(--gray-light);
    border-radius: 0.25rem;
    margin-bottom: 1rem;
    padding: 1rem;
}

/* Spaziatura verticale */
.download_mb-3 {
    margin-bottom: 1rem !important;
}

/* Sfondo grigio chiaro */
.download_bg-light {
    background-color: var(--gray-light) !important;
}

/* Bordo arrotondato */
.download_rounded {
    border-radius: 8px !important;
}

/* Layout flessibile */
.download_d-flex {
    display: flex !important;
    justify-content: space-evenly;
    width: 100%;
}

/* Allineamento degli elementi */
.download_justify-content-between {
    justify-content: space-between !important;
}

/* Spaziatura interna */
.download_p-3 {
    padding: 1rem !important;
}

/* Testo secondario */
.download_text-muted {
    color: #6c757d !important;
}

/* Dimensione testo ridotta */
.download_small {
    font-size: 80% !important;
}

/* Rimozione sottolineatura */
.download_text-decoration-none {
    text-decoration: none !important;
}

/* Spaziatura laterale icone */
.download_mx-2 {
    margin-left: 0.5rem !important;
    margin-right: 0.5rem !important;
}

/* Stile specifico per i link PDF */
.download_pdf-link {
    color: inherit;
    transition: color 0.3s ease;
    display: flex;
    align-content: center;
    align-items: center;
}