﻿/* GENERAL - RESET */
.clear { clear: both; }
.inline {display:inline;}
.f-right {float: right;}
*{ margin: 0; }


/* Palette x

Blu primario: #1976D2
Blu secondario: #0A2E6F
Grigio testo: #5F6B7A
Grigio chiaro UI: #E9EEF5
Bianco: #FFFFFF

*/


/* Montserrat */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/css/Montserrat-regular-400.woff2') format('woff2');
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/css/Montserrat-semibold-600.woff2') format('woff2');
}

@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/css/Montserrat-bold-700.woff2') format('woff2');
}


/* Catamaran */
@font-face {
  font-family: 'Catamaran';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/css/Catamaran-Regular.woff2') format('woff2');
}

@font-face {
  font-family: 'Catamaran';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/css/Catamaran-500.woff2') format('woff2');
}

@font-face {
  font-family: 'Catamaran';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/css/Catamaran-Bold.woff2') format('woff2');
}



body{font-family:Catamaran !important; background-color: #FFF}

/* container */
.container-md {max-width: 1100px;}
.container-md.container-minh {min-height: 700px} /* per fissare minimo di altezza */
@media screen and (max-width: 576px) {
	.container-md.container-minh {min-height: 550px}
}


/*header*/
.bg-header{background:#FFF}
header .navbar .nav-link {color: #2B5973; font-weight: 500}
header .navbar .nav-link:hover {color: #2A6F97;text-decoration: none;}
header .navbar-toggler {color: white!important}
header .navbar-nav hr{background: #555!important}
header img.logo {max-width: 300px; width: 100%; height: auto;}
@media screen and (max-width: 576px) {
	header img.logo {max-width: 200px; width: 100%; height: auto;}
}

/*Footer*/
.bg-footer {background: #404040}





/* font */
.Mon {font-family:Catamaran !important;}



h1{font-size: 28px; font-weight: bold}
h2{font-size: 24px; line-height: 140%; font-weight: normal;}
h3{font-size: 20px; line-height: 140%; font-weight: bold;}
h4{font-size: 14px; font-weight: bold; text-transform: uppercase; line-height: 140%}
h5{font-size: 20px; line-height: 140%; font-weight: bold; margin-top:30px}

.font-10 {font-size: 10px; line-height: 130%} 
.font-11 {font-size: 11px; line-height: 130%} 
.font-12 {font-size: 12px; line-height: 130%} 
.font-13 {font-size: 13px; line-height: 130%} 
.font-14 {font-size: 14px}
.font-15 {font-size: 15px}
.font-16 {font-size: 16px}
.font-17 {font-size: 17px}
.font-18 {font-size: 18px} 
.font-20 {font-size: 20px} 
.font-25 {font-size: 25px} 
.truncate {text-overflow: ellipsis; overflow: hidden; width: 160px; height: 1.2em; white-space: nowrap;}
.NumberFont {font-family: 'Arial'!important;}
.fw-500{font-weight:500}

@media screen and (max-width: 576px) {
	h1{font-size: 20px;}
	h2{font-size: 20px;}
	p {font-size: 15px;}
}



/* Link */
a {color: #1976D2; text-decoration: none}
a:not(.btn):hover {color: #0A2E6F; text-decoration: underline;}



/* Icona */
.remix {
  stroke: currentColor;
  stroke-width: 0;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: currentColor;
  width: 1.2em;
  height: 1.2em;
}

.MyIcon {
  /*width: 20px;
  height: 20px;*/
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
  justify-content: center;  
  flex-shrink: 0;
}

.MyIcon.pulse {
  animation: pulse-once 1200ms ease-out 1;
  transform-origin: center;
}
@keyframes pulse-once {
  0% {transform: scale(0.8);}
  40% {transform: scale(1.8);}
  70% {transform: scale(0.8);}
  100% {transform: scale(1);}
}



/* Struttura */

.container-h {min-height:600px}


/*
Blu primario: #1976D2
Blu secondario: #0A2E6F
Grigio testo: #5F6B7A
Grigio chiaro UI: #E9EEF5
Bianco: #FFFFFF
*/


/* Primary */
.text-primary {color: #1976D2!important}
.text-primary-dark {color: #0A2E6F!important}
.border-primary {border-color: #1976D2!important}
.bg-primary{background-color: #1976D2!important}
.bg-primary-light{background-color: #DDECFB!important}
.bg-primary-very-light{background-color: #F8FBFE!important}

.bg-primary-dark{background-color: #0A2E6F!important}
.btn-primary {background-color: #1976D2; border: 0}
.btn-primary:hover {background-color: #0A2E6F; border: 0}
.btn-primary.active {background-color: #0A2E6F!important; border: 0 }
.btn-outline-primary {border-color: #1976D2; color: #1976D2}
.btn-outline-primary:hover {border-color: #0A2E6F; background-color: #0A2E6F; color: #fff}

/* Secondary */
.text-secondary {color: #5F6B7A!important}



/* White/Light */
.bg-white {background-color: #FFF !important}
.bg-light {background-color: #F1F4F4 !important}
.bg-very-light {background-color: #FBFBFB}

/* Yellow/Warning */
.yellow {color: #FFC900}
.bg-yellow {background-color: #FFFAC1 !important}
.bg-warning-light {background-color: #FFFBE5!important}

/* Gray */
.text-gray {color: #ccc !important}
.text-gray-dark {color: #444 !important}
.bg-gray  {background-color: #ccc !important}

/* Orange */
.text-orange {color: #E27222 !important}
.bg-orange {background-color: #FF9727!important}
.bg-orange-light {background-color: #FFE68B}
.btn-orange{background-color: #F5901A; color:#fff}
.btn-orange:hover{background-color: #E27222; color:#fff}

.btn-outline-orange{background-color: transparent; border:1px solid #FF9727; color:#fff}
.btn-outline-orange:hover{background-color: #FF9727; color:#fff}




/* Altri */

.text-nome {color: #057980 !important}
.btn-facebook {background-color: #4267b2; color: white}
.btn-facebook:hover {background-color: #365492; color: white}
.bg-soccer {background-image: url('../images/bg-tile.png');}
.bg-soccer-dark {background-image: url('../images/bg-tile-dark.png');}


.btn-circle {width: 60px; height: 60px; text-align: center; padding: 6px 0; font-size: 12px; line-height: 1.428571429; border-radius: 30px;}
.shadow-button {box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.4);}
.icon-toggle[aria-expanded=false] .text-expanded {display: none;}
.icon-toggle[aria-expanded=true] .text-collapsed {display: none;}


.btn-form  {background-color: #E9ECEF; border-top: 1px solid #DEE2E6; border-right: 1px solid #DEE2E6; border-bottom: 1px solid #DEE2E6; border-left: none; border-radius 0 5px 5px 0}
.btn-form:hover  {color: #A0A0A0; background-color: #E9ECEF; border-top: 1px solid #DEE2E6; border-right: 1px solid #DEE2E6; border-bottom: 1px solid #DEE2E6; border-left: none; border-radius 0 5px 5px 0}			

/* tables */
.hiddenRow {padding: 0 !important;}
    
/* effects */
.centered-and-cropped { object-fit: cover }
.shadow {box-shadow: 0 0 25px hsla(0, 0%, 0%, 0.60);}
.shadow-light {box-shadow: 0 0 15px hsla(0, 0%, 0%, 0.40);}
.blurr {opacity: 0.75; color: rgba(0, 0, 0, 0.75); -webkit-filter: blur(2px); -moz-filter: blur(2px); filter: blur(2px);}
.blurrMore {-webkit-filter: blur(3px); -moz-filter: blur(3px); filter: blur(3px);}
.blurrMax {-webkit-filter: blur(7px); -moz-filter: blur(7px); filter: blur(7px);}
.capitalize-first::first-letter {text-transform: uppercase;}
.clipped {}
@media (max-width: 768px)  {
	.clipped {height: 500px; clip-path: polygon(0% 0%, 100% 0, 100% 80%, 50% 90%, 0 80%);}
	}

.imgFade{
  opacity: 0;
  animation: fadeIn 2s forwards;
	}
	@keyframes fadeIn {
	    to {opacity: 1;}
	}
.clamp1 {display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden;text-overflow: ellipsis;}
.clamp3 {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;text-overflow: ellipsis;}
.clamp2 {
  overflow: hidden;
  display: block;
  line-height: 1.4em;
  max-height: 2.8em;   /* 2 righe */
  text-overflow: ellipsis;
}


/* form */
.form-control::placeholder {color: #aaa; opacity: 1;font-style: italic}
.form-control:-ms-input-placeholder {color: #aaa;font-style: italic}
.form-control::-ms-input-placeholder {color: #aaa;font-style: italic}
.bootstrap-select  {border: 1px solid #CED4DA !important;}
.border-form {color: #CED4DA !important}

input[readonly], textarea[readonly], select[readonly] {
    background-color: #e9ecef;
    cursor: not-allowed; 
    color: #495057;
    opacity: 1;
}


/* DEFAULT */

/*header*/



/* HomePage */

.HomePage li {font-size: 18px; line-height: 140%;}

.HomePage .hero-header img{max-height:500px;object-fit:cover;}
.hero-header p {font-size:22px}

@media (max-width: 767.98px){

	.HomePage .hero-header img{max-height:200px;}
	.hero-header h1 {font-size:26px}
	.hero-header p {font-size:18px}

}



/*


.HomePage .copsign{background: url('../images/default.webp') center center no-repeat;background-size: cover;min-height: 400px;}
.HomePage .copertina {background: url('../images/header.webp') bottom center no-repeat;background-size: cover;margin-top:-16px;min-height: 200px;}
.HomePage .copertina .darken {background: rgba(0, 0, 0, 0.4);}
.HomePage .copertina h3 {color: #eee}
.HomePage .cop-bottom .media {font-size: 14px}
.HomePage .cop-bottom .media_body {vertical-align: middle}
*/


/*In page*/


/* PAGE LISTING  */
.PageListing {} /* sul main */
.PageListing h1{font-size: 26px; color: #fff; font-weight:500}
.PageListing h2{font-size: 19px; color: #fff; font-weight:500; margin-top:10px}
.PageListing h3{font-size: 19px; color: #444; font-weight:500}
.PageListing .badge a {color:#444}
.PageListing .badge a:hover {text-decoration:none; color:#ddd!important}
@media screen and (max-width: 576px) {
	.PageListing h1{font-size: 22px;}
	.PageListing h2{font-size: 16px; margin-top:10px}
	.PageListing p {font-size: 14px;}
}

.ossBox .img-thumbnail, .calBox .img-thumbnail {width:120px;height:120px}



.PageListing .ossBox {}
.PageListing .calBox {}
.PageListing .txtRole {color:#555 ;font-size:13px; font-weight:500; text-transform: uppercase;}
.PageListing .txtSubRole {color:#888 ;font-size:13px;}


.PageListing .insBox {}
.PageListing .insBox p {color:#444; font-size:16px; line-height:110%}
@media screen and (max-width: 576px) {
	.PageListing .ossBox h3, .PageListing .calBox h3 {font-size: 17px;}
	.PageListing .ossBox .img-thumbnail, .PageListing .calBox .img-thumbnail {width:80px;height:80px}
	.PageListing .ossBox .txtRole, .PageListing .calBox .txtRole {font-size:10px}
	.PageListing .profBox-slider .img-thumbnail {width:120px;height:120px}
}







/* PAGINE BLOG  */
.PageArticle {} /* sul main */
.PageArticle h1 {font-size: 28px; color: #028B95;}
.PageArticle h2 {font-size: 24px; color: #028B95; line-height: 140%;}

.PageArticle .p-sopra {margin-bottom:0; color: #E27222;font-weight :500; font-size:16px; text-transform: uppercase;}
.PageArticle .p-sotto {font-style:italic; color:#444;line-height: 135%;}
.PageArticle .p-autore {font-size:15px;; color:#444}
/* faq */
.PageArticle .faq-list li {font-size: 16px; line-height: 140%}
.PageArticle .faq-list h3 {font-size: 18px}
/* destra */
.PageArticle .destra small{font-size: 14px;}
.PageArticle .destra h2 {font-size: 18px;}
.PageArticle .BoxDestra h3 {font-size: 14px; font-weight:bold}
.PageArticle .destra a {color:#444}
/* Record Articolo */
.PageArticle .RecordArticle h2{font-size:20px}

.BoxVetrina h3{font-size:18px}

@media screen and (max-width: 576px) {
	.PageArticle h1{font-size: 24px;}
	.PageArticle h2{font-size: 22px;}
	.PageArticle .p-sopra {font-size:15px;}
	.PageArticle .p-sotto {font-size:15px;}
	.PageArticle .faq-list li {font-size: 15px;}
	.PageArticle .faq-list h3 {font-size: 16px}
}

/* PAGINE STATICHE  */
.PageStatic {} /* sul main */
.PageStatic h1{font-size: 28px; color: #028B95;}
.PageStatic h2{font-size: 24px; color: #028B95; line-height: 140%; margin-top:30px}
.PageStatic .p-sopra {margin-bottom:0; color: #E27222;font-weight :500; font-size:16px; text-transform: uppercase;}
.PageStatic .p-sotto {font-style:italic; color:#444;line-height: 135%;}

@media screen and (max-width: 576px) {
	.PageStatic h1{font-size: 24px;}
	.PageStatic h2{font-size: 22px;}
	.PageStatic .p-sopra {font-size:15px;}
	.PageStatic .p-sotto {font-size:15px;}
	.PageStatic p {font-size:15px;}
}



/* Record video */
.VideoCell h5{margin: 7px 0 0 0; line-height: 100%}
.VideoCell small{line-height: 100%;}



/* DASHBOARD */
#navdash .active:not(.no-active) {background-color: white !important; color: #17A2B8 !important}
#navdash .nav-link {color: white; border-radius: 4px 4px 0 0 !important;}

.select2-container--Select2DropDown .select2-selection {
    height: auto;              
    padding: 0.30rem 0.10rem;  
    border: 1px solid #dee2e6;
    border-radius: 4px;
    background-color: white;
    font-size: 14px;
    position: relative; /* necessario per freccetta */
}

.select2-container--Select2DropDown .select2-selection__arrow {
    disoplay: block;
    height: 100%;  /* freccetta riempie verticalmente il box */
    top: 0;
    right: 0.75rem;
}

/* Dashbard templates */
.dash_premium p {font-size:16px}
.dash_premium .ulComp li{min-height: 55px}
.dash_premium .ulIntro li {line-height:18px}

@media screen and (max-width: 576px) {
	.dash_premium p {font-size:14px}
	.dash_premium ul {font-size:14px}
	.dash_premium li {font-size:14px}
	.dash_premium .ulComp li {min-height: 45px}

}



/* list */
ul {font-size: 16px; color: #333; line-height: 160%}
.list-group-item {border-color: #C6DBDC!important;}
.nobullet{list-style-type: none;}




/* campo general */
.IconPlayer{color: #16764A; border-radius:50%; border: 2px solid #16764A; padding:7px}
.IconPlayer:hover {border: 2px solid #1C985E; color:#1C985E ;padding:7px}
.IconPlayerChecked{color: white!important; border-radius:50%; background-color:#1C985E;border : 2px solid #fff; padding:7px}
.IconPlayerDisabled{color: #177F4F; border-radius:50%; ;border: 2px solid #177F4F; padding:7px}
.LabelDisabled{cursor: not-allowed; pointer-events: none;}
  


/* altro */
.breadcrumb{background-color: transparent!important;}
.breadcrumb-item + .breadcrumb-item::before {content: ">";color: #bbb;}
.max30 {max-width: 30rem;}
label {font-size: 13px; margin-bottom:5px}




