body { font-family: 'Poppins', sans-serif; }

blockquote {
    border-left: 4px solid #4a90e2;   /* Colore e spessore del bordo */
    padding: 0.85em 1.2em;
    margin: 1.2em 0;
    background: #f9f9f9;             /* Leggero sfondo (opzionale) */
    border-radius: 4px;              /* Angoli appena arrotondati */
    color: #333;
    font-size: 1rem;
    line-height: 1.55;
	margin-right: 10px;
}

blockquote.note {
    border-left: 4px solid #a8b3c7;
    background: #f4f6f9;
}

blockquote.tip {
    border-left: 4px solid #4a90e2;
    background: #eef6ff;
}

blockquote.warning {
    border-left: 4px solid #ffa000;
    background: #fff8e6;
}

blockquote.alert {
    border-left: 4px solid #d93025;
    background: #ffeceb;
}

blockquote.example {
    border-left: 4px solid #34a853;
    background: #e8f5e9;
}

.navbar-toggler{
	position: absolute;
    right: 7px;
    top: 20px;
}

.footer-link{
	color: white;
	text-decoration: none;
}

.footer-link:hover{
	text-decoration: underline;
}

.footer-link:visited{
	color: white;
}

#tidio-chat-iframe{
	inset: auto 9px -12px auto!important;
}

.colored{
	color: #0052CC;
}

.container { 
	max-width: 1560px; 
	margin:0 auto;
    padding-left: 10px;	
	padding-right: 10px;	
}

.row {
   --bs-gutter-x: 0;
   --bs-gutter-y: 0;
}

/*
nav.navbar.navbar-expand-lg.bg-light {
    background: #f6951e !important;
	background: #0052CC !important;
}
*/

.navbar-toggler{
	color: #FFFFFF;
	font-size: 26px;
}

.navbar-expand-lg .navbar-collapse {
    justify-content: flex-end !important;
}

.nav-link {
    color: #fff !important;
}

.bg-f5f5f5 {
    background: #f5f5f5;
    margin: 0px;
}
 
 .firstrow li {
    display: inline;
    float: left;
    padding: 10px;
}

ul.firstrow {
    margin: 0px;
    height: 43px;
    padding: 0px;
}

li.nav-item {
    padding-right: 20px;
    font-size: 18px;
    line-height: 30px;
}

.home-features{
	/*
	Rimettere dopo aver inserito tutti gli screenshots alle pagine
	min-height: 300px!important;
	*/
	padding: 20px!important;
}

.contact-form{
	border: 1px solid #ddd;
    padding: 40px 20px 40px 20px;
    box-shadow: 5px 5px 5px #ccc;
    margin-top: 40px;
}

.contact-form input{
	position: relative;
	display: block;
	width: 100%;
	font-size: 14px;
	line-height: 30px;
	font-weight: 500;
	height: 52px;
	letter-spacing: 0.5px;
	-webkit-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	transition: all 300ms ease;
	border-bottom: 1px solid #565656;
	border-top: 0px;
	border-left: 0px;
	border-right: 0px;
	border-radius: 0px;
	color: #000;
	padding: 0px;
	padding-left: 10px;			
}

.contact-form select{
	position: relative;
	display: block;
	width: 100%;
	font-size: 14px;
	line-height: 30px;
	font-weight: 500;
	height: 52px;
	letter-spacing: 0.5px;
	-webkit-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	transition: all 300ms ease;
	border-bottom: 1px solid #565656;
	border-top: 0px;
	border-left: 0px;
	border-right: 0px;
	border-radius: 0px;
	color: #000;
	padding: 0px;
	padding-left: 10px;			
}

.contact-form input:focus{
	background-color: azure;
}

.contact-form select:focus{
	background-color: azure;
}

.contact-form .form-group {
	position: relative;
	margin-bottom: 15px;
}

.contact-form input[type="checkbox"]{
	height: 20px;
}

.center-block{
	padding: 10px!important;
	max-width: 1200px;
	margin: auto;
}

.center-block h2{
	color: #0052CC;
	font-weight: bold;		
}

.center-block .btn {
	height: 42px;
	padding-left: 20px;
	padding-right: 20px;
	background-color: #0052CC;
	color: #ffffff;
	font-weight: 700;
	text-align: center;
	border: 2px solid #0052CC;
	font-size: 16px;
	line-height: 30px;
}

.btn-contact-whatsapp{
	height: 28px!important;
    font-size: 12px!important;
    line-height: 12px!important;
    background-color: #00a859!important;
    border-color: #009688!important;
}




#subdomain_demo{
	font-size: 14px;
	color:#0052CC;
	margin-top: 6px;	
}

#subdomain_choosen{
	font-weight: bold;
}

.subdomain_ok{
	color: green;
	font-size: 11px;
	margin-left: 20px;
}

.subdomain_ko{
	color: red;
	font-size: 11px;
	margin-left: 20px;
}

.subdomain_at_least_3_chars{
	color: darkorange;
	font-size: 11px;
	margin-left: 20px;
}

#demo_form h5{
	color: #0052CC;
	font-size: 16px;
}

.span_checkbox{
	margin-left: 6px;
	font-size: 16px;
}



#privacy_container H1{
	color: #0052CC;
	font-size: 19px;
	line-height: 23px;
}

#privacy_container H2{
	color: #0052CC;
	font-size: 17px;
	
}

#privacy_container H3{
	color: #0052CC;
	font-size: 13px;
	font-weight: bold;
}

#privacy_container p{
	font-size: 13px;
	line-height: 19px;
}

#privacy_container li{
	font-size: 13px;
	line-height: 19px;
}

#privacy_container a{
	color: #0052cc;
    text-decoration: none;
}

.privacy-block{
	border-bottom: 1px dotted #DFDFDF;
	margin-top: 20px;
}

.external-container{
	padding: 15px; 
	border: 1px solid #DFDFDF;
	border-radius:5px; 
	margin-bottom: 10px;
}

.external{
 	padding: 15px;
	border: 1px dotted #DFDFDF;
	border-radius:5px;
	margin-top: 5px;
	background-color: aliceblue;
}

#cookie_modal{
	z-index: 2147483645;
    top: 10%;
    position: fixed;
    right: 0;
    background-color: aliceblue;
    width: 90%;
    max-width: 650px;
    border-radius: 10px;
    left: 1em;
    margin: 0 auto;
    font-size: 14px;
    max-height: 90%;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 20px;
    border: 1px solid #0052CC;
}

#cookie_modal .btn {
    height: 42px;
    padding-left: 20px;
    padding-right: 20px;
	background-color: #0052CC;
    color: #ffffff;
    font-weight: 700;
    text-align: center;        
    border: 2px solid #0052CC;	
	font-size: 16px;
	line-height: 30px;
}

#cookie_modal .btn:hover {
	background-color: #FFF;
	color: #0052CC;
	border: 2px solid #0052CC;
}

#cookie_modal a{
	color: #0052cc;
    text-decoration: none;
}

.clear { clear: both; }


.bold{ font-weight: bold; }

.col-lg-1 { float: left; }
.col-lg-2 { float: left; }
.col-lg-3 { float: left; }
.col-lg-4 { float: left; }
.col-lg-5 { float: left; }
.col-lg-6 { float: left; }
.col-lg-7 { float: left; }
.col-lg-8 { float: left; }
.col-lg-9 { float: left; }
.col-lg-10 { float: left; }
.col-lg-11 { float: left; }
.col-lg-12 { float: left; }


.col-md-1 { float: left; }
.col-md-2 { float: left; }
.col-md-3 { float: left; }
.col-md-4 { float: left; }
.col-md-5 { float: left; }
.col-md-6 { float: left; }
.col-md-7 { float: left; }
.col-md-8 { float: left; }
.col-md-9 { float: left; }
.col-md-10 { float: left; }
.col-md-11 { float: left; }
.col-md-12 { float: left; }

.col-sm-1 { float: left; }
.col-sm-2 { float: left; }
.col-sm-3 { float: left; }
.col-sm-4 { float: left; }
.col-sm-5 { float: left; }
.col-sm-6 { float: left; }
.col-sm-7 { float: left; }
.col-sm-8 { float: left; }
.col-sm-9 { float: left; }
.col-sm-10 { float: left; }
.col-sm-11 { float: left; }
.col-sm-12 { float: left; }

.col-xs-1 { float: left; }
.col-xs-2 { float: left; }
.col-xs-3 { float: left; }
.col-xs-4 { float: left; }
.col-xs-5 { float: left; }
.col-xs-6 { float: left; }
.col-xs-7 { float: left; }
.col-xs-8 { float: left; }
.col-xs-9 { float: left; }
.col-xs-10 { float: left; }
.col-xs-11 { float: left; }
.col-xs-12 { float: left; }

.m-t-5{ 	margin-top: 5px; }
.m-t-10{ 	margin-top: 10px; }
.m-t-15{ 	margin-top: 15px; }
.m-t-20{ 	margin-top: 20px; }
.m-t-25{ 	margin-top: 25px; }
.m-t-30{ 	margin-top: 30px; }
.m-t-35{ 	margin-top: 35px; }
.m-t-40{ 	margin-top: 40px; }
.m-t-45{ 	margin-top: 45px; }
.m-t-50{ 	margin-top: 50px; }

.m-b-5{ 	margin-bottom: 5px; }
.m-b-10{ 	margin-bottom: 10px; }
.m-b-15{ 	margin-bottom: 15px; }
.m-b-20{ 	margin-bottom: 20px; }
.m-b-25{ 	margin-bottom: 25px; }
.m-b-30{ 	margin-bottom: 30px; }
.m-b-35{ 	margin-bottom: 35px; }
.m-b-40{ 	margin-bottom: 40px; }
.m-b-45{ 	margin-bottom: 45px; }
.m-b-50{ 	margin-bottom: 50px; }

.m-r-5{ 	margin-right: 5px; }
.m-r-10{ 	margin-right: 10px; }
.m-r-15{ 	margin-right: 15px; }
.m-r-20{ 	margin-right: 20px; }
.m-r-25{ 	margin-right: 25px; }
.m-r-30{ 	margin-right: 30px; }
.m-r-35{ 	margin-right: 35px; }
.m-r-40{ 	margin-right: 40px; }
.m-r-45{ 	margin-right: 45px; }
.m-r-50{ 	margin-right: 50px; }

.m-l-5{ 	margin-left: 5px; }
.m-l-10{ 	margin-left: 10px; }
.m-l-15{ 	margin-left: 15px; }
.m-l-20{ 	margin-left: 20px; }
.m-l-25{ 	margin-left: 25px; }
.m-l-30{ 	margin-left: 30px; }
.m-l-35{ 	margin-left: 35px; }
.m-l-40{ 	margin-left: 40px; }
.m-l-45{ 	margin-left: 45px; }
.m-l-50{ 	margin-left: 50px; }

.p-t-5{ 	padding-top: 5px; }
.p-t-10{ 	padding-top: 10px; }
.p-t-15{ 	padding-top: 15px; }
.p-t-20{ 	padding-top: 20px; }
.p-t-25{ 	padding-top: 25px; }
.p-t-30{ 	padding-top: 30px; }
.p-t-35{ 	padding-top: 35px; }
.p-t-40{ 	padding-top: 40px; }
.p-t-45{ 	padding-top: 45px; }
.p-t-50{ 	padding-top: 50px; }

.p-b-5{ 	padding-bottom: 5px; }
.p-b-10{ 	padding-bottom: 10px; }
.p-b-15{ 	padding-bottom: 15px; }
.p-b-20{ 	padding-bottom: 20px; }
.p-b-25{ 	padding-bottom: 25px; }
.p-b-30{ 	padding-bottom: 30px; }
.p-b-35{ 	padding-bottom: 35px; }
.p-b-40{ 	padding-bottom: 40px; }
.p-b-45{ 	padding-bottom: 45px; }
.p-b-50{ 	padding-bottom: 50px; }

.p-r-5{ 	padding-right: 5px; }
.p-r-10{ 	padding-right: 10px; }
.p-r-15{ 	padding-right: 15px; }
.p-r-20{ 	padding-right: 20px; }
.p-r-25{ 	padding-right: 25px; }
.p-r-30{ 	padding-right: 30px; }
.p-r-35{ 	padding-right: 35px; }
.p-r-40{ 	padding-right: 40px; }
.p-r-45{ 	padding-right: 45px; }
.p-r-50{ 	padding-right: 50px; }

.p-l-5{ 	padding-left: 5px; }
.p-l-10{ 	padding-left: 10px; }
.p-l-15{ 	padding-left: 15px; }
.p-l-20{ 	padding-left: 20px; }
.p-l-25{ 	padding-left: 25px; }
.p-l-30{ 	padding-left: 30px; }
.p-l-35{ 	padding-left: 35px; }
.p-l-40{ 	padding-left: 40px; }
.p-l-45{ 	padding-left: 45px; }
.p-l-50{ 	padding-left: 50px; }

.fs-8{ 		font-size: 8px; }
.fs-9{ 		font-size: 9px; }
.fs-10{ 	font-size: 10px; }
.fs-11{ 	font-size: 11px; }
.fs-12{ 	font-size: 12px; }
.fs-13{ 	font-size: 13px; }
.fs-14{ 	font-size: 14px; }
.fs-15{ 	font-size: 15px; }
.fs-16{ 	font-size: 16px; }
.fs-17{ 	font-size: 17px; }
.fs-18{ 	font-size: 18px; }
.fs-19{ 	font-size: 19px; }
.fs-20{ 	font-size: 20px; }
.fs-22{ 	font-size: 22px; }
.fs-24{ 	font-size: 24px; }
.fs-26{ 	font-size: 26px; }
.fs-28{ 	font-size: 28px; }
.fs-30{ 	font-size: 30px; }
.fs-32{ 	font-size: 32px; }


input[type="checkbox"]:disabled:checked:before {
    display: table-cell;
    background: #0075ff;
    color: white;
	content: "\2713";
    text-align: center;
    vertical-align: middle;
	width: 20px;
	line-height: 20px;
	border-radius: 4px;
	font-weight: bold;
}


.spacer {
	margin-top: 20px;
}

.row {
    max-width: 100% !important;
}


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



@keyframes cambiaColore {
    0%   { background-color: #008DD2; color: #FFF; }
    15%  { background-color: #009846; color: #FFF; }
	40%  { background-color: #E31E24; color: #FFF; }
    65%  { background-color: #EF7f1A; color: #FFF; }
    90% { background-color: #FECC00; color: #FFF; }	
	100% { background-color: #008DD2; color: #FFF; }
}

#header_container {
    animation-name: cambiaColore;
    animation-duration: 30s; /* Durata totale dell'animazione */
    animation-iteration-count: infinite; /* Ripete l'animazione all'infinito */
    -webkit-animation-timing-function: ease-in-out; /* Effetto fade in e out */
    animation-timing-function: ease-in-out; /* Effetto fade in e out */
}

.header-logo{
	max-height: 70px;
}

#slogan_container{
	padding-left: 20px;
}

#slogan_container h1.slogan-title{
	animation-name: cambiaColore;
    animation-duration: 30s; /* Durata totale dell'animazione */
    animation-iteration-count: infinite; /* Ripete l'animazione all'infinito */
    -webkit-animation-timing-function: ease-in-out; /* Effetto fade in e out */
    animation-timing-function: ease-in-out; /* Effetto fade in e out */	
	
	margin-top: 64px;
	font-size: 3.2rem;
}

#slogan_container h4.slogan-title{
	animation-name: cambiaColore;
    animation-duration: 30s; /* Durata totale dell'animazione */
    animation-iteration-count: infinite; /* Ripete l'animazione all'infinito */
    -webkit-animation-timing-function: ease-in-out; /* Effetto fade in e out */
    animation-timing-function: ease-in-out; /* Effetto fade in e out */		
	margin-top: 12px;
}

#slogan_container span.slogan-text{
	animation-name: cambiaColore;
    animation-duration: 30s; /* Durata totale dell'animazione */
    animation-iteration-count: infinite; /* Ripete l'animazione all'infinito */
    -webkit-animation-timing-function: ease-in-out; /* Effetto fade in e out */
    animation-timing-function: ease-in-out; /* Effetto fade in e out */	
	margin-top: 20px;
	font-size-adjust: 20px;
}

#slogan_container span.slogan-text-note{
	color: #FFFFFF;
	font-size: 14px;
}

.container_slogan_text_note{
	margin-top: 5px;
}



#header_container{
	width: 100%; 
	min-height: 600px;
	opacity: 1; 
	visibility: inherit;
}

#header_container_short{
	animation-name: cambiaColore;
    animation-duration: 30s; /* Durata totale dell'animazione */
    animation-iteration-count: infinite; /* Ripete l'animazione all'infinito */
    -webkit-animation-timing-function: ease-in-out; /* Effetto fade in e out */
    animation-timing-function: ease-in-out; /* Effetto fade in e out */	
	
	width: 100%; 
	min-height: 100px;
	opacity: 1; 
	visibility: inherit;
}


.navbar{
	background-color: transparent!important;
}

.btn-style-filled{   
    background-color: #FFF;
	color: #0052CC;	
    font-weight: 700;
    text-align: center;    
    text-transform: uppercase;
    border: 2px solid #FFF;
	padding-right: 20px;
	padding-left: 20px;
}

.btn-style-filled:hover{   
	color: #FFF;	
	border: 2px solid #FFF;
	background-color: #0052CC;
}

.btn-style-not-filled{   
    color: #ffffff;
    font-weight: 700;
    text-align: center;    
    text-transform: uppercase;
    border: 2px solid #ffffff;
}

.btn-style-not-filled:hover{   
	background-color: #FFF;
	color: #00aeef;
	border: 2px solid #ffffff;
}


ul.dropdown-menu.show {
    /* background: #f6951e; */
	background: #0052CC;
    border: 0px;
}

a.dropdown-item {
    color: #fff;
    border-bottom: 1px solid rgba(255, 255, 255, .2);
}

ul.dropdown-menu.show {
    padding: 10px;
}

.dropdown-item.active, .dropdown-item:active {
    color: #41464b;
    text-decoration: none;
    background-color: transparent !important;
}

ul.dropdown-menu.show {
    line-height: 24px;
}




#header_banner_1{
	/* margin-top: 45px;*/
	margin-bottom: 20px;
	padding: 20px 40px 20px 40px;
    max-height: 450px;	
}

.img-main-feature{
	max-height: 300px;
}

.main-feature-title{
	font-size: 24px;
	color: #0052CC;
}


.home-features h2{
	color: #0052CC;
	font-weight: bold;
}

.home-features h4{
	color: #0052CC;
	font-size: 20px;
}

.home-features .btn {
    height: 42px;
    padding-left: 20px;
    padding-right: 20px;
	background-color: #0052CC;
    color: #ffffff;
    font-weight: 700;
    text-align: center;        
    border: 2px solid #0052CC;	
	font-size: 16px;
	line-height: 30px;
}

.home-features .btn:hover {
	background-color: #FFF;
	color: #0052CC;
	border: 2px solid #0052CC;
}

.home-features-screenshot{
	border: 1px solid #DDD;
	padding: 10px 50px 10px 50px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
}






.image-gallery{
	cursor: pointer;
	padding: 10px;
}

.image-gallery-caption{
	text-align: center;	
}

.image-gallery-modal{
	position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    padding: 60px 20px 20px 20px;
    background-color: rgba(0, 0, 0, 0.80);
}

.image-gallery-modal .image-gallery-container{
	text-align: center;
}

.image-gallery-modal .image-gallery-caption-container{    
    text-align: center;    
    margin-top: 8px;
}

.image-gallery-modal .image-gallery-caption{
	border: 1px solid rgb(255,255,255,0.5);
	background-color: rgb(0,0,0,0.8);
    padding: 2px 14px 2px 14px;
    border-radius: 6px;
    color: white;
    font-size: 20px;
}


div.close-modal-button-container{
	text-align: right;
}

button.close-modal-button{
	cursor: pointer;
    color: #fff;
    border: 1px solid #AEAEAE;
    border-radius: 30px;
    background: #0150cf;
    font-size: 24px;
    line-height: 10px;    
    margin-bottom: 10px;     
	height: 40px;
	width: 40px;
}

button.close-modal-button:before {
    content: "x";
}


/* 
Icone funzioni principali -- Landing page -- 
{
*/
.icon-box{	
	padding: 5px;
}

.icon-box-border{
	border: 1px solid #dddddd59;
	border-radius: 15px;	
	margin: 5px;
	padding: 5px;
}

.icon-box .icon{

}

.icon-box .title{
	margin-top: 10px;
}

.icon-box .description{
	margin-top: 10px;	
}

.icon-box .description p{
	min-height: 170px;
}

.icon-box .button{
	margin-bottom: 10px;
}

.icon-box .btn {
    height: 42px;
    padding-left: 20px;
    padding-right: 20px;
	background-color: #0052CC;
    color: #ffffff;
    font-weight: 700;
    text-align: center;        
    border: 2px solid #0052CC;	
	font-size: 16px;
	line-height: 30px;
}

.icon-box .btn:hover {
	background-color: #FFF;
	color: #0052CC;
	border: 2px solid #0052CC;
}

.icon-box-border:hover{
	background-color: #0055CC;
	color: white;
}

.icon-box-border:hover .description{

}

.icon-box-border:hover .btn{
    background-color: #FFF;
	color: #0052CC;	
    font-weight: 700;
    text-align: center;    
    border: 2px solid #FFF;
	padding-right: 20px;
	padding-left: 20px;
}

.icon-box-border:hover .btn:hover{
	color: #FFF;	
	border: 2px solid #FFF;
	background-color: #0052CC;	
}

.icon-box-border:hover .icon-inventario-prodotti{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/gestionale-magazzino-inventario-prodotti-white.png");
}

.icon-box-border:hover .icon-movimenti-di-magazzino{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/gestionale-magazzino-movimenti-di-magazzino-white.png");
}

.icon-box-border:hover .icon-clienti-fornitori{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/gestionale-magazzino-clienti-fornitori-white.png");
}

.icon-box-border:hover .icon-ordini-preventivi-ddt-documenti{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/gestionale-magazzino-ordini-preventivi-ddt-documenti-white.png");
}

.icon-box-border:hover .icon-gestione-documentale{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/gestione-documentale-white.png");
}

.icon-box-border:hover .icon-ticket-system{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/ticket-system-white.png");
}

.icon-box-border:hover .icon-task-manager{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/task-manager-white.png");
}

.icon-box-border:hover .icon-gestione-pratiche{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/gestione-pratiche-white.png");
}

.icon-box-border:hover .icon-gestione-magazzino{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/gestione-magazzino-white.png");
}

.icon-box-border:hover .icon-condivisione-documenti{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/condivisione-documenti-white.png");
}

.icon-box-border:hover .icon-gestione-clienti{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/gestione-clienti-white.png");
}

.icon-box-border:hover .icon-sicurezza{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/sicurezza-white.png");
}

.icon-box-border:hover .icon-smart-working{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/smart-working-white.png");
}

.icon-box-border:hover .icon-assistenza{
	content: url("https://helpdeskincloud.it/website/assets/img/icons/assistenza-white.png");
}
/*
}
*/



.call-to-action{
    animation-name: cambiaColore;
    animation-duration: 30s; /* Durata totale dell'animazione */
    animation-iteration-count: infinite; /* Ripete l'animazione all'infinito */
    -webkit-animation-timing-function: ease-in-out; /* Effetto fade in e out */
    animation-timing-function: ease-in-out; /* Effetto fade in e out */
	
	padding: 20px;
}

.call-to-action H3{
	color: #FFFFFF;
}

.call-to-action P{
	color: #FFFFFF;
}

.call-to-action-btn{
	text-align: center;
	line-height: 70px;
}

.call-to-action-btn a{
    background-color: #FFF;
	color: #0052CC;	
    font-weight: 700;
    text-align: center;    
    border: 2px solid #FFF;
	padding-right: 20px;
	padding-left: 20px;
}

.call-to-action-btn a:hover{
	color: #FFF;	
	border: 2px solid #FFF;
	background-color: #0052CC;	
}



.testimonials h2{
	color: #0052CC;
	font-weight: bold;		
	font-size: 20px;
	text-align: center;
	margin-bottom: 30px;
}

.testimonials img{
	filter: grayscale(100%);
	opacity: 0.7;
}

.testimonials img:hover{
	filter: grayscale(0);
	opacity: 1;
	cursor: pointer;
}









.price-box{	
	padding: 5px;
}

.price-box-module{

}

.price-box-custom{
	background-color: whitesmoke;
}

.price-box-border{
	border: 1px solid #dddddd59;
	border-radius: 15px;	
	margin: 5px;
	padding: 5px;
}

.price-box .icon{

}

.price-box-border div.title strong{
	font-size: 20px;
}

.price-box .valuta{
	font-size: 26px;
    vertical-align: top;
    line-height: 50px;
}

.price-box .amount{
	font-size: 60px;
	line-height: 64px;
	font-weight: 400;
}

.price-box .period{
	font-size: 16px;
}

.price-box .title{
	margin-top: 10px;
}

.price-box .description{
	margin-top: 10px;
	text-align: left;
	font-size: 14px;
}

.price-box .description div{
	margin-top: 2px;
}

.price-box .description div.sep{
    border-bottom: 1px solid #ddd;
    margin-top: 6px;
    margin-bottom: 6px
}

.price-box .button{
	margin-top: 15px;
	margin-bottom: 10px;
}

.price-box .btn {
    height: 42px;
    padding-left: 20px;
    padding-right: 20px;
	background-color: #0052CC;
    color: #ffffff;
    font-weight: 700;
    text-align: center;        
    border: 2px solid #0052CC;	
	font-size: 16px;
	line-height: 30px;
}

.price-box .btn:hover {
	background-color: #FFF;
	color: #0052CC;
	border: 2px solid #0052CC;
}

.price-box-border:hover{
	background-color: #0055CC;
	color: white;
}

.price-box-border:hover .description{

}

.price-box-border:hover .btn{
    background-color: #FFF;
	color: #0052CC;	
    font-weight: 700;
    text-align: center;    
    border: 2px solid #FFF;
	padding-right: 20px;
	padding-left: 20px;
}

.price-box-border:hover .btn:hover{
	color: #FFF;	
	border: 2px solid #FFF;
	background-color: #0052CC;	
}


.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;    
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;    
    border-radius: 10px;		
    text-shadow: none;        
    background-color: #e6e6e6;  
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 5px;
    padding-bottom: 5px;	
    color: #626262;	
}

.badge-success {
    background-color: #10cfbd;
    color: #ffffff;
}

.badge-important {
    background-color: lightgrey;
    color: #ffffff;
}





.table-striped th{
	font-size: 12px!important;
}

.table-striped td{
	font-size: 12px!important;
}




.reveal{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: 1s all ease;
}

.reveal-left{
  position: relative;
  transform: translateX(150px);
  opacity: 0;
  transition: 1s all ease;
}

.reveal-right{
  position: relative;
  transform: translateX(-150px);
  opacity: 0;
  transition: 1s all ease;
}


.reveal-load{
  position: relative;
  transform: translateY(150px);
  opacity: 0;
  transition: 1s all ease;
}

.reveal-load-left{
  position: relative;
  transform: translateX(150px);
  opacity: 0;
  transition: 1s all ease;
}

.reveal-load-right{
  position: relative;
  transform: translateX(-150px);
  opacity: 0;
  transition: 1s all ease;
}



.reveal.active{
  transform: translateY(0);
  opacity: 1;
}

.reveal-left.active{
  transform: translateY(0);
  opacity: 1;
}

.reveal-right.active{
  transform: translateY(0);
  opacity: 1;
}

.reveal-load.active{
  transform: translateY(0);
  opacity: 1;
}

.reveal-load-left.active{
  transform: translateY(0);
  opacity: 1;
}

.reveal-load-right.active{
  transform: translateY(0);
  opacity: 1;
}



.print-order-container a{
	color: #7c7c7c;
}

.print-order-container a:hover{
	color: #ea5440;
}


footer{
	background-color: #0052CC;
	color: #FFFFFF;
}

footer ul{
	list-style: none;
	padding-left: 0px;
}

footer ul li{
	font-size: 13px;
}

footer ul li a{
	color: white;
	text-decoration: none;
	
}

footer ul li a:hover{
	color: white;
	text-decoration: underline;
}

.footer-logo{
	padding-left: 30px;
}

.footer-logo img{
    height: 74px;
    padding: 0px 0 10px 0px;
}


#aco-notification-list{
	width: 600px!important;
}





.lds-ellipsis {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-ellipsis div {
  position: absolute;
  top: 33px;
  width: 13px;
  height: 13px;
  border-radius: 50%;
  background: #cef;
  animation-timing-function: cubic-bezier(0, 1, 1, 0);
}
.lds-ellipsis div:nth-child(1) {
  left: 8px;
  animation: lds-ellipsis1 0.6s infinite;
}
.lds-ellipsis div:nth-child(2) {
  left: 8px;
  animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(3) {
  left: 32px;
  animation: lds-ellipsis2 0.6s infinite;
}
.lds-ellipsis div:nth-child(4) {
  left: 56px;
  animation: lds-ellipsis3 0.6s infinite;
}
@keyframes lds-ellipsis1 {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
@keyframes lds-ellipsis3 {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(0);
  }
}
@keyframes lds-ellipsis2 {
  0% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(24px, 0);
  }
}


@media (max-width: 980px) {
	#slogan_container h1.slogan-title{	
		font-size: 2.8rem;
		margin-top: 24px;
	}
}

@media (max-width: 768px) {
	.order-sm-1{ order: 1!important; }
	.order-sm-2{ order: 2!important; }
	.order-sm-3{ order: 3!important; }
	.order-sm-4{ order: 4!important; }
	.order-sm-5{ order: 5!important; }
	.order-sm-6{ order: 6!important; }
	.order-sm-7{ order: 7!important; }
	.order-sm-8{ order: 8!important; }
	.order-sm-9{ order: 9!important; }
	.order-sm-10{ order: 10!important; }
	.order-sm-11{ order: 11!important; }
	.order-sm-12{ order: 12!important; }
}

@media (max-width: 480px){
	#slogan_container h1.slogan-title{
		font-size: 2.6rem;
		margin-top: 24px;
	}
	
	.order-xs-1{ order: 1!important; }
	.order-xs-2{ order: 2!important; }
	.order-xs-3{ order: 3!important; }
	.order-xs-4{ order: 4!important; }
	.order-xs-5{ order: 5!important; }
	.order-xs-6{ order: 6!important; }
	.order-xs-7{ order: 7!important; }
	.order-xs-8{ order: 8!important; }
	.order-xs-9{ order: 9!important; }
	.order-xs-10{ order: 10!important; }
	.order-xs-11{ order: 11!important; }
	.order-xs-12{ order: 12!important; }	
}

/* Stile per rendere l'indice della guida fisso durante lo scroll */
.help-index {
	position: sticky;
	top: 15px;
	z-index: 100;
	background-color: #ffffff;
	max-height: calc(100vh - 30px);
	overflow-y: auto;
}

/* Su tablet e mobile rimuove il posizionamento sticky dall'indice */
@media (max-width: 991px) {
	.help-index {
		position: relative;
		top: 0;
		max-height: none;
		margin-bottom: 30px;
	}
}

/* Nasconde tutti i contenitori della guida */
.help-group-container {
	display: none;
}

.help-group-container.active {
	display: block;
}

.index-root.active {
	display: block;
}

/* Pulsante per tornare in cima alla pagina */
.btn-back-to-top {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: 30px;
	padding: 12px 24px;
	background-color: #0052cc;
	color: #ffffff;
	border: none;
	border-radius: 8px;
	font-size: 0.95rem;
	font-weight: 500;
	cursor: pointer;
	transition: all 0.2s ease;
	text-decoration: none;
}

.btn-back-to-top:hover {
	background-color: #003d99;
	color: #ffffff;
	transform: translateY(-2px);
	box-shadow: 0 4px 12px rgba(0, 82, 204, 0.3);
}

.btn-back-to-top i {
	font-size: 1.1rem;
}




.guide-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.guide-nav li {
    margin-bottom: 8px;
}

.guide-nav a {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 10px;
    border-radius: 6px;
    text-decoration: none;
    color: #1B2A34;
    transition: background 0.15s ease, color 0.15s ease;
    font-size: 0.95rem;
}

.guide-nav a:hover {
    background: #eef4ff;
    color: #0052cc;
}

.guide-nav .step {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 999px;
    background: #e5edff;
    color: #0052cc;
    font-size: 0.85rem;
    font-weight: 600;
}

/* voce attiva (puoi aggiornarla via JS) */
.guide-nav a.active {
    background: #0052cc !important;
    color: #fff !important;
    font-weight: 600;
}

.guide-nav a.active .step {
    background: #fff;
    color: #0052cc;
}




.section-toc {
    background: #f5f7fb;
    border-radius: 10px;
    padding: 20px 24px;
    margin-bottom: 28px;
    border: 1px solid #e0e6f5;
    font-size: 0.95rem;
}

.section-toc-header {
    display: flex;
    align-items: center;
    margin-bottom: 14px;
}

.section-toc-icon {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e4ebff;
    color: #0052cc;
    font-weight: 700;
    margin-right: 12px;
    font-size: 1rem;
}

/* pillola col numero (8.1, 8.2, …) */
.section-toc-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    padding: 2px 8px;
    border-radius: 999px;
    background: #e4ebff;
    color: #1248a5;
    font-weight: 600;
    font-size: 0.8rem;
    border: 1px solid #c5d4ff;
}

/* rimuovi il vecchio pallino • */
.section-toc-list li::before {
    content: none;
}

.section-toc-title strong {
    font-size: 1.05rem;
}

.section-toc-title span {
    font-size: 0.85rem;
    color: #6b7280;
}

/* Lista migliorata */
.section-toc-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: 18px;
    row-gap: 6px;
}

.section-toc-list li {
    padding-left: 16px;
    position: relative;
}

.section-toc-list li::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 2px;
    color: #0052cc;
    font-weight: 700;
}

.section-toc-list a {
    color: #0052cc;
    text-decoration: none;
}

.section-toc-list a:hover {
    text-decoration: underline;
}

.section-toc-list a:hover .section-toc-num {
    background: #dce8ff;
    border-color: #b0c7ff;
}

@media (max-width: 768px) {
    .section-toc-list {
        grid-template-columns: 1fr;
    }
}




.breadcrumb {
    display: flex;
    align-items: center;
    font-size: 0.95rem;
    gap: 6px;
    margin-bottom: 20px;
}

.breadcrumb a,
.breadcrumb .current {
    display: inline-block;
    padding: 6px 12px;
    background: #f5f7fa;
    border-radius: 20px;
    color: #1f3b57;
    text-decoration: none;
    border: 1px solid #e1e4e8;
    transition: background 0.2s, color 0.2s;
    white-space: nowrap;
}

.breadcrumb a:hover {
    background: #e9edf2;
}

.breadcrumb .current {
    font-weight: 600;
    background: #e8f0ff;
    border-color: #c5d8ff;
    color: #1248a5;
    cursor: default;
}

.breadcrumb .separator {
    color: #8292a5;
    font-size: 1rem;
    user-select: none;
}




.nav-argomenti {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin: 35px auto 20px;
    flex-wrap: wrap;
}

.nav-btn {
    display: inline-block;
    padding: 10px 18px;
    border-radius: 8px;
    background: #e8f0ff;
    border: 1px solid #c5d8ff;
    color: #1248a5;
    font-weight: 600;
    text-decoration: none;
    transition: all 0.2s;
    min-width: 200px;
    text-align: center;
}

.nav-btn:hover {
    background: #dce7ff;
    border-color: #b8cfff;
}

.nav-btn.prev {
    background: #f0f4ff;
}

.nav-btn.next {
    background: #eef7ff;
}

.nav-btn.up {
    background: #0052cc;
    color: white;
    border-color: #0045a8;
}

.nav-btn.up:hover {
    background: #003f94;
}

@media (max-width: 768px) {
    .nav-argomenti {
        gap: 10px;
        margin-bottom: 30px;
    }
}