@import"skeleton.min.css";
@import"reset.css";
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@200;300;400;500;600;700;800;900&display=swap');

html {
  scroll-behavior: smooth; }

body { 
	position:relative;
	font-family: 'Nunito', sans-serif;
	font-weight:300;
	font-size:20px;
	line-height:26px;
	color:#000;
	background-color:#FFF;
	margin:0px; }

.smallText { font-size:18px; }
.textBig { font-size:24px; line-height: 34px; }

b { font-weight:700; }
.bold { font-weight:800; }

.errore { color: red; font-weight: 400; }
.bordered { border: 1px solid #dddddd; box-sizing:content-box; }

.p0 {padding:0px;}
p, 
.p1	{padding-bottom:5px;}
.p2	{padding-bottom:10px;}
.p3	{padding-bottom:15px;}
.p4	{padding-bottom:20px;}
.p5	{padding-bottom:25px;}

.m1	{margin-bottom:5px;}
.m2	{margin-bottom:10px;}
.m3	{margin-bottom:15px;}
.m4	{margin-bottom:20px;}
.m5	{margin-bottom:25px;}

a {color:#000; text-decoration: underline;}
a:hover {color:#5aaae7; text-decoration: underline;}
a.current {color:#5aaae7;}

a.link, a.link:hover { text-decoration:none; cursor:pointer;}

.aleft		{text-align:left;}
.acenter	{text-align:center;}
.ajustify	{text-align:justify;}
.aright		{text-align:right;}
.pleft		{float:left;}
.pright		{float:right;}

h1 {
	font-size:65px;
	color: #000;
	line-height:67px;
	font-weight:700;
	padding-bottom:6px;}
h1.small { font-size:55px; line-height:57px;}
h2, .h2 {
	font-size:30px;
	color: #000;
	line-height:39px;
	font-weight:500;
	padding-bottom:6px;}
h3 {
	font-size:45px;
	color: #000;
	line-height:53px;
	font-weight:700;
	padding-bottom:3px;}
h4 {
	font-size:30px;
	color: #000;
	line-height:34px;
	font-weight:700;
	padding-bottom:6px;}
h5 {
	font-size:32px;
	color: #000;
	line-height:40px;
	font-weight:400;
	text-transform: uppercase;
	padding-bottom:9px;}

.container_12 img {
	max-width:100%; }

span.anchor {
	display: inline-block;
	position: relative;
	top: -70px; }


/* Header */

#bar { 
	position: fixed;
	width: 100%;
	z-index: 10000;
	background-color: #5aaae7;
	color: #fff;
	height: 28px;
	padding: 12px 0px; }
#bar a {
	color: #fff;
	padding-left: 20px;
	font-size: 19px;
	text-decoration:none; }
#bar a:hover {
	color: #000;
	text-decoration:none; }	
#bar a.current { color: black; }
#smallLogo { display: none; }
#smallLogo img { float: left; height: 30px; }

#header { 
	padding: 100px 0px 30px 0px; 
	background-color: white; 
	position:relative; 
	width: 100%; 
	z-index: 1000; }

#logo img { width: 200px; }

#menuSmall {
	display:none;}

#menu {
	margin-top:15px;
	text-align:right;
	text-transform: uppercase;}
#menu div {
	display:inline-block; }
#mainMenu li {
	display:inline-block;
	list-style: none;
	padding:0px 20px 0px 20px;}
#mainMenu li:last-child, #mainMenu a:last-child  {
	padding-right: 0;}
#mainMenu a {
	display:inline-block;
	color:#000;
	font-weight:700;
	font-size:17px;
	line-height:16px; 
	text-decoration:none;
  padding: 4px 7px 4px 7px; }
#mainMenu a.current {
	color: #5aaae7;}
#mainMenu a:hover {
	color: #5aaae7;}

.submenu {
	text-align:right;
	position: sticky;
	top: 50px;
	display:block;
	height:30px;
	z-index:1000;
	background-color: #ffffff;
	padding: 10px 0px; }


/* Content */

.btn {
	background-color: #5aaae7;
	color: #fff;
	padding: 15px 40px;
	font-size: 25px;
	font-weight: 800;
	text-transform: uppercase;
	text-decoration: none;
	border-radius: 50px; }

.btn:hover {
	background-color: #000;
	text-decoration: none;
	color: #fff; }

#prezziAbbonamenti span {
	display:inline-block;
	width:225px;}
#prezziAbbonamenti span.v2 {
	width:219px;}

/* Back to top button */
#back-top {
	z-index:100;
	position: fixed;
	bottom: 100px;
	right: 10px;}
#back-top a {
	width: 40px;
	height: 40px;
	display: block;
	opacity:0.6;}
#back-top a:hover {
	opacity:1;}
/* Scroll down button */
#scroll-down {
	height:40px;}



/* Form */

span.label { font-size: 15px; color: #333; }

form { font-family: 'Nunito', sans-serif;}

::placeholder { 
  font-weight:500;
  color: #9c9b9b;
  opacity: 1;
}

input[type="email"],
input[type="search"],
input[type="text"],
input[type="password"],
textarea,
select {
	border: 1px solid #CCC;
	border-radius: 10px;
	background-color: white;
	padding: 12px 10px 12px 10px;
	width:100%;
	margin-bottom: 15px;}

input:read-only {
	background-color: #EEE;}
input[type="button"],
input[type="submit"] {
	font-size: 25px;
	font-weight: 800;
	text-transform: uppercase;
	border: none;
	border-radius: 50px;
	padding: 15px 30px;
	color: white;
	background-color: #5aaae7;}
		
input[type="submit"]:hover,
input[type="button"]:hover { background-color: #000; }

input[type="checkbox"],
input[type="radio"] {
  display: inline;
  margin:5px;
  width:25px;
  height:25px; }

 input:focus, textarea:focus{
  outline: none;
  border-color: #5aaae7; }


/* Tables */

table {
  width: 100%;
  text-align: center;
  border-collapse: separate; /* Don't collapse */
  border-spacing: 0; }

table td, table th {
  text-align: left;
  padding: 8px; }

table th {
  /* Apply both top and bottom borders to the <th> */
  border-top: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
  border-right: 1px solid #dddddd; }

table td {
  /* For cells, apply the border to one of each side only (right but not left, bottom but not top) */
  border-bottom: 1px solid #dddddd;
  border-right: 1px solid #dddddd; }

table th:first-child,
table td:first-child {
  /* Apply a left border on the first <td> or <th> in a row */
  border-left: 1px solid #dddddd; }

table a {
  text-decoration:none; }
table a:hover {
  text-decoration:none; }


/****** Style Star Rating Widget *****/

#fiveStars img {
	width:50px; }

.rating { 
  border: none;
  float: left;
}

.rating > input { display: none; } 
.rating > label:before { 
  font-size: 30px;
  display: inline-block;
  content: "\2605";
  padding-right: 5px;
}

.rating > label { 
  color: #ddd; 
  float: right; 
}

#rVoti { padding-top: 2px; display:inline-block; }

/***** CSS Magic to Highlight Stars on Hover *****/

.rating > input:checked ~ label, /* show gold star when clicked */
.rating:not(:checked) > label:hover, /* hover current star */
.rating:not(:checked) > label:hover ~ label { color: #f3a000; cursor: pointer;  } /* hover previous stars in list */

.rating > input:checked + label:hover, /* hover current star when changing rating */
.rating > input:checked ~ label:hover,
.rating > label:hover ~ input:checked ~ label, /* lighten current selection */
.rating > input:checked ~ label:hover ~ label { color: #f8cf7f;  }


.boxElencoListini {
	padding: 10px;
	margin-bottom: 25px;
	border: 2px solid #5aaae7;
	border-radius: 8px;
	box-sizing: border-box;
	text-decoration: none;
}
.boxElencoListini:hover{
	text-decoration: none;
	color: black;
	border: 2px solid #000;
}


.pdf { text-decoration: none; }
.pdf:hover { color: black; }

/* Footer */
#footer {
	font-size: 18px;
	line-height:22px;
	padding-top:50px;
	padding-bottom:40px;
	background-color:#5aaae7;
	color:#FFF;}
#footer a {
	text-decoration:none;
	color:#FFF; }
#footer a:hover {
	text-decoration:underline; }
	

@media only screen and (max-width: 1199px) {
	h1, h3 {
		font-size:35px;
		line-height: 45px; }
	h2 {
		font-size:25px;
		line-height: 32px;}
	h4 {
		font-size:25px;}
	#logo img { width: 250px; }
	#menu {
		margin-top:0px;}
	#mainMenu li {
		padding:16px 0px 0px 5px; }
	#mainMenu a {
		font-size:15px;
		line-height:14px;
		font-weight: 700;
		padding: 0px 20px 5px 20px; }
	#footer img { width: 250px; }
}

@media only screen and (min-width: 768px) and (max-width: 995px) {
	body{ font-size: 18px; }
	.smallText { font-size:16px; }
	h1{
		font-size:35px;
		line-height: 38px; }
	h2{
		font-size:23px;}
	#logo img { width: 200px; }
	#mainMenu { margin-top: 5px; }
	#mainMenu li {
		padding:0px 10px 0px 10px; }
	#mainMenu a {
		font-size:14px;
		line-height:14px;
		padding: 5px 3px 5px 3px; }
	#prezziAbbonamenti span {
		width:204px;}
	#prezziAbbonamenti span.v2 {
		width:198px;}
	#footer { font-size:16px; }
}

@media only screen and (max-width: 767px) {
	body { font-size: 18px; }
	.smallText { font-size:16px; }
	h1 { font-size:40px; line-height: 50px; }
	h2 { font-size:25px; }
	p { line-height: 30px; }
	#menu { display: none; }
	#logo img { width: 320px; padding-top: 5px; }
	#hero { margin-top: -30px; }
	input[type="submit"], button {
		width: 100%;
		padding: 15px 5px;}
	.spacer{ padding-bottom: 100px; }
	.btn{ display: block; max-width: 100%; text-align: center; margin: 0 auto; }
	.mobileHidden { display:none; }
	#prezziAbbonamenti span {
		width:204px;}
	#prezziAbbonamenti span.v2 {
		width:198px;}
	.bordered { border: 0px; padding-bottom:40px; margin-bottom:25px; border-bottom: 1px solid #dddddd; }
}

@media only screen and (max-width: 479px) {
	.submenu {text-align:center; letter-spacing:-1px;}
	.submenu a {padding:2px;}
	input[type="button"],
	input[type="submit"] {
		font-size: 20px; }
	.rating > label:before { 
	  padding-right: 2px; }

}

