html, body{width:100%; height:100%; margin: 0; padding: 0;  /*overflow-x: hidden;*/ font-family:'Montserrat', san serif;  color: #3a475b;-webkit-text-size-adjust:100%;backface-visibility: hidden; will-change: contents;  }
html { overflow: overlay; overflow-x: hidden; height: 100%;  -webkit-text-size-adjust: 100%;}
 
html.html-noscroll {overflow: hidden;}

@media all and (max-width: 480px) {
	 
}

a,a:hover {text-decoration: none;transition: .4s all; color: inherit;}
a:hover { opacity: .7;}

/* custom fomt, colors*/
.font-smoothing-antialiased {-webkit-font-smoothing: antialiased;}
  

.font-weight-100 {font-weight: 100!important;}
.font-weight-200 {font-weight: 200!important;}
.font-weight-300 {font-weight: 300!important;}
.font-weight-400 {font-weight: 400!important;}
.font-weight-500 {font-weight: 500!important}
.font-weight-600 {font-weight: 600!important;}
.font-weight-700 {font-weight: 700!important;}
.font-weight-800 {font-weight: 800!important;}

.font-size-xsmall {   font-size:clamp(0.6rem, 0.4vw, 0.8rem);}
.font-size-small {    font-size:clamp(0.8rem, 0.6vw, 1.0rem);}
.font-size-normal {   font-size:clamp(1.0rem, 0.8vw, 1.2rem);}
.font-size-medium {   font-size:clamp(1.4rem, 1.3vw, 1.7rem);}
.font-size-large {    font-size:clamp(1.7rem, 2.0vw, 3.0rem);}
.font-size-xlarge {   font-size:clamp(1.9rem, 2.4vw, 3.4rem);}
.font-size-xxlarge {  font-size:clamp(2.1rem, 3.4vw, 4.4rem);}
.font-size-xxxlarge { font-size:clamp(2.3rem, 5.4vw, 6.4rem);}
.font-size-huge {     font-size:clamp(2.7rem, 6.4vw, 7.4rem);}
.font-size-20 {     font-size:20px;}


.line-height-normal { line-height: normal;}
.line-height-100 { line-height: 100%;}
.line-height-110 { line-height: 110%;}
.line-height-120 { line-height: 120%;}
.line-height-130 { line-height: 130%;}
.line-height-140 { line-height: 140%;}
.line-height-150 { line-height: 150%;}
.line-height-200 { line-height: 200%;}

.letter-spacing-2 {letter-spacing: 2px;}
.letter-spacing-3 {letter-spacing: 3px;}
.letter-spacing-4 {letter-spacing: 4px;}
.letter-spacing-10 {letter-spacing: 10px;}
.letter-spacing-14 {letter-spacing: 14px;}

  
@media all and (max-width: 480px) {	
 }


.colore-primario { color: #29abe2;}
.colore-primario-light { color: #7a7a7a;}

.colore-secondario { color: #222d3f}
.colore-secondario-light { color: #7a818c;}

.colore-fondo-primario { background-color:  rgba(41,171,226,1);}
.colore-fondo-primario-light {  background-color: rgba(132,149,179,1);}

.colore-fondo-secondario { background-color: #222d3f;}
.colore-fondo-secondario-light {  background-color:#414F66;}
   
.border-bottom-primario { border-bottom:1px solid #29abe2;}

/*SIDE NAV HELP*/
#mySidenav{position:fixed;top:20%; left: -200px; width: 200px; height: auto; background-color: #fff; padding: 10px 20px; transition:.3s; z-index:999;box-shadow: -6px 0px 20px rgba(0,0,0,0.2);}
#mySidenav:hover{left:0}
#mySidenav .btnOpen{ position: absolute; top: 0px; right: -40px; height: 40px; width: 40px; line-height: 40px; text-align: center; background-color: #fff;color: #333;box-shadow: 6px 2px 8px rgba(0,0,0,0.2); }
#mySidenav a{ display: block; transition:.3s;padding:5px 0; width: 100%;text-decoration:none;font-size:14px;color:#333 ;white-space: nowrap; }
#mySidenav a:hover { opacity: .6}
#mySidenav a.divider { height: 0; margin: .5rem 0 0 0; overflow: hidden; border-top: 1px solid #e9ecef;} 
 
@media all and (max-width: 667px) { 	
	#mySidenav a{ text-decoration:none;font-size:16px;}
}
 
.no-header {position: relative; margin-top: 80px;  }	

/* Tablet in modalit&agrave; orizzontale */
@media only screen and (width: 820px) and (height: 1106px)  { 			
}

@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {	
}

/* Tablet in modalit&agrave; verticale */
@media all and (min-width: 481px) and (max-width: 768px) { 			
}

@media all and (max-width: 667px) { 			
}

@media all and (min-width: 737px) and (max-width: 1279px) {  	
}
 
@media all and (min-width: 481px) and (max-width: 820px) {		 
}

@media (max-width:736px){	
    .no-header {  margin-top: 80px;  }	
} 	
 
@media all and (max-width: 480px) {
	
}
	 
 
/*MAIN*/
 .main { position: relative; display: block; width: 100%; overflow-x: hidden; overflow-y: scroll; }
 
.header-img {position: relative; width: 100%; height: 40vh; overflow: hidden; margin-bottom: 50px;} 	
.header-img img { object-fit: cover; object-position: center; width: 100%; height: 100%;}
  


/* COVER */
.cover-pagina { position: relative;}
.cover-pagina .c-top-gradiente { position: absolute;z-index: 1; top: 0; left: 0; width: 100%; height: 30vh; background: linear-gradient(to bottom,  rgba(1,73,142,.3) 0%,rgba(1,73,142,0) 100%); }
.cover-pagina .c-bottom-gradiente { position: absolute;z-index: 1; bottom: 0; left: 0;  width: 100%; height: 20vh; background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%, rgba(0,0,0,.3) 100%); }
 
/* mobile vertical */ 
@media all and (max-width: 812px) {   
    .cover-pagina .c-top-gradiente {  height: 30vh;  }
    .cover-pagina .c-bottom-gradiente {  height: 40vh;  }
} 
        
.cover-content-wrapper { position: relative; }
.cover-pagina .cp-caption { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 50%; z-index: 9;}
.cover-pagina .cp-titolo { position: absolute; right: 70px; bottom: 150px; z-index: 9;}

/* VIDEO / IMAGE */

.cover-content-wrapper .wrapper-content-button { position: fixed; bottom:165px; left: 50%; transform: translateX(-50%);text-align: center; overflow: hidden; z-index: 1;}
 
.cover-content-wrapper .video-button-wrapper{  width: 45px; height: 45px; z-index: 2; transition: opacity .5s;/*mix-blend-mode: difference;*/ }
.cover-content-wrapper .video-button-wrapper > .button-audio{ position: relative; background-color: transparent; border: none; cursor: pointer; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.cover-content-wrapper .video-button-wrapper > .button-audio i {position: absolute; font-size: 20px; color: #fff;}
 
body.scroll-page .cover-content-wrapper .video-button-wrapper { opacity: 0; transition: opacity .1s }
 
/* mobile vertical */ 
@media all and (max-width: 812px) {   
    .cover-pagina .cp-caption { width: 80%;}
    .cover-pagina .cp-titolo { left: 20px; right: 20px; bottom: 100px; }   
}
  
/*sezioni*/

.sezione {position: relative; width: 100%; display: inline-block;}
 
.heading { position: relative;}
.heading:before { content: ''; position: absolute; top: -25px; left: 50%; transform: translateX(-50%); width: 40px; height: 6px; background-color: #3a475b;}

.divisore {position: absolute; top: 0; right: 0; width: 2px; background-color: #fff; height: 100px;}
.divisore .d-punto {position: absolute; top: 50%; transform: translateY(-50%); right: -4px; width: 10px; border-radius: 5px; background-color: #fff; height: 20px;}
.divisore.d-dark {background-color: #002a3f;} 
.divisore.d-dark .d-punto {background-color: #002a3f;} 

.divisore-orizzontale {position: relative; width: 130px; background-color: #fff; height: 2px; margin: 20px auto;}
.divisore-orizzontale .d-punto {position: absolute; top: 50%; transform: translate(-50%,-50%); left: 50%; width: 10px; border-radius: 5px; background-color: #fff; height: 20px;}
.divisore-orizzontale.d-dark {background-color: #002a3f;} 
.divisore-orizzontale.d-dark .d-punto {background-color: #002a3f;} 



/* lista orizzontale*/

.menu-h {list-style: none; margin: 0; padding: 0;}
.menu-h li {position: relative; display: inline-block;}
.menu-h li a { padding: 10px 30px; font-weight: 300; font-size: 14px; color: #333;}
.menu-h li a:after { content: ''; position: absolute; top: 50%; transform: translateY(-50%); right: 0; height: 60%; width: 1px; background-color: #ccc;}
.menu-h li:last-child a:after {display: none;}
.menu-h li a:hover { opacity: .6;}
 
@media all and (max-width: 480px) {
	.menu-h { }
	.menu-h li { width: 100%; margin: 10px 0px;  }	
	.menu-h li a { font-size: 16px; }
	.menu-h li a:after {display: none;} 	
}

/* lista verticale*/

.menu-v .bootstrap-select .dropdown-toggle { border-radius: 0;}
.menu-v .bootstrap-select .dropdown-menu { border-radius: 0;}
.menu-v .bootstrap-select .dropdown-item {white-space: inherit;padding: 10px 20px;border-bottom: 1px solid #ccc;}

.menu-v .bootstrap-select .dropdown-item.active, .dropdown-item:active { background-color: #333333;}

.menu-v .bootstrap-select .dropdown-toggle:focus, .bootstrap-select>select.mobile-device:focus+.dropdown-toggle { border: none!important; outline: none!important;  border-radius: 0!important;}
.menu-v .bootstrap-select .dropdown-toggle .filter-option-inner-inner { overflow: hidden; font-weight: 600;}

.menu-v.sel-white .bootstrap-select .dropdown-toggle {background-color: #ffffff; border: none;}
.menu-v.sel-white .bootstrap-select .dropdown-menu {background-color: #ffffff; border: none;}
.menu-v.sel-white .bootstrap-select .dropdown-toggle .filter-option-inner-inner { color: #333; }

	

/* FOOTER */  

.footer {position: relative; display: inline-block; width: 100%; padding:0; -webkit-font-smoothing: antialiased; background-color:rgba(9,55,80,1); color: #fff;}
.footer a { color: #fff;}
.footer a:hover { color: #29abe2}
.footer .f-top {position: relative; display: inline-block; width: 100%; }
.footer .f-body {position: relative; display: inline-block; width: 100%;  }
.footer .f-bottom {position: relative; display: inline-block; width: 100%;  }  
.footer .f-credits {position: relative; display: inline-block; width: 100%; border: 0px solid #ccc;   }
  
/* Smartphone o piccoli Tablet */
@media all and (max-width: 480px) { 
 }

@media all and (min-height: 1100px) { 	 
}

/* Smartphone o piccoli Tablet */
@media all and (max-width: 480px) { 	  
} 	

@media all and (min-width: 1280px) { 
}
  
@media all and (max-width: 480px) {   
}
 
/* CALENDARIO */

.calendario {}
.calendario.c-inverse table {color: #fff;}
.calendario.c-inverse .datepicker table tr td, .calendario.c-inverse .datepicker table tr th { width: auto; padding: .15rem;}
.calendario.c-inverse .datepicker table tr td.active.active {background: rgba(41,171,226,1);}
.calendario.c-inverse .datepicker table tr td.today,
.calendario.c-inverse .datepicker table tr td.today.disabled,
.calendario.c-inverse .datepicker table tr td.today:hover,.calendario.c-inverse .datepicker table tr td.today.disabled:hover { background-color:  rgba(41,171,226,.5); color: #fff;}


.calendario.c-inverse .datepicker table tr td:hover { background-color:  rgba(255,255,255,1)!important; color: #333!important;}
.calendario.c-inverse .datepicker table tr td.day:hover, .calendario.c-inverse .datepicker table tr td.day.focused {background-color: rgba(255,255,255,.8); color: #333}
.input-group.date .btn {padding: .375rem .75rem;}


/* DROPPDOWN*/

.dropdown.dd-custom .dropdown-item{white-space: normal;}
.dropdown.dd-custom .dropdown-menu { max-height: 300px; overflow: hidden; overflow-y: scroll;}
