/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
* Modificato da Matteo Varisco il 18-07-2017
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/


/* GRIGLIA */

.container {
	position: relative;
	width: 100%;
	max-width: 960px;
	margin: 0 auto;
	padding: 0 20px;
	box-sizing: border-box;
}

.container-full-screen {
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding: 0 0;
	box-sizing: border-box;
}

.container-wide-screen {
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding: 0 2%;
	box-sizing: border-box;
}

.column,
.column-sm,
.columns,
.columns-sm {
	width: 100%;
	float: left;
	box-sizing: border-box;
}

/* Impostazioni per monitor desktop - default */
.column,
.column-sm,
.columns,
.columns-sm {
	margin-left: 4%;
}
.column:first-child,
.column-sm:first-child,
.columns:first-child,
.columns-sm:first-child {
	margin-left: 0;
}

/* Colonne della griglia */
.one.column,
.one.column-sm,
.one.columns,
.one.columns-sm              			   { width: 4.66666666667%; }
.two.columns, .two.columns-sm          { width: 13.3333333333%; }
.three.columns, .three.columns-sm      { width: 22%;            }
.four.columns, .four.columns-sm        { width: 30.6666666667%; }
.five.columns, .five.columns-sm        { width: 39.3333333333%; }
.six.columns, .six.columns-sm          { width: 48%;            }
.seven.columns, .seven.columns-sm      { width: 56.6666666667%; }
.eight.columns, .eight.columns-sm      { width: 65.3333333333%; }
.nine.columns, .nine.columns-sm        { width: 74.0%;          }
.ten.columns, .ten.columns-sm          { width: 82.6666666667%; }
.eleven.columns, .eleven.columns-sm    { width: 91.3333333333%; }
.twelve.columns, .twelve.columns-sm    { width: 100%; margin-left: 0; }

.one-third.column, .one-third.column-sm    	{ width: 30.6666666667%; }
.two-thirds.column, .two-thirds.column-sm		{ width: 65.3333333333%; }

.one-half.column, .one-half.column-sm        { width: 48%; }

/* Spostamento delle colonne */
.offset-by-one.column,
.offset-by-one.column-sm,
.offset-by-one.columns,
.offset-by-one.columns-sm      	  { margin-left: 8.66666666667%; }
.offset-by-two.column,
.offset-by-two.column-sm,
.offset-by-two.columns,
.offset-by-two.columns-sm          { margin-left: 17.3333333333%; }
.offset-by-three.column,
.offset-by-three.column-sm,
.offset-by-three.columns,
.offset-by-three.columns-sm        { margin-left: 26%;            }
.offset-by-four.column,
.offset-by-four.column-sm,
.offset-by-four.columns,
.offset-by-four.columns-sm         { margin-left: 34.6666666667%; }
.offset-by-five.column,
.offset-by-five.column-sm,
.offset-by-five.columns,
.offset-by-five.columns-sm         { margin-left: 43.3333333333%; }
.offset-by-six.column,
.offset-by-six.column-sm,
.offset-by-six.columns,
.offset-by-six.columns-sm          { margin-left: 52%;            }
.offset-by-seven.column,
.offset-by-seven.column-sm,
.offset-by-seven.columns,
.offset-by-seven.columns-sm        { margin-left: 60.6666666667%; }
.offset-by-eight.column,
.offset-by-eight.column-sm,
.offset-by-eight.columns,
.offset-by-eight.columns-sm        { margin-left: 69.3333333333%; }
.offset-by-nine.column,
.offset-by-nine.column-sm,
.offset-by-nine.columns,
.offset-by-nine.columns-sm         { margin-left: 78.0%;          }
.offset-by-ten.column,
.offset-by-ten.column-sm,
.offset-by-ten.columns,
.offset-by-ten.columns-sm          { margin-left: 86.6666666667%; }
.offset-by-eleven.column,
.offset-by-eleven.column-sm,
.offset-by-eleven.columns,
.offset-by-eleven.columns-sm       { margin-left: 95.3333333333%; }

.offset-by-one-third.column,
.offset-by-one-third.column-sm,
.offset-by-one-third.columns,
.offset-by-one-third.columns-sm    { margin-left: 34.6666666667%; }
.offset-by-two-thirds.column,
.offset-by-two-thirds.column-sm,
.offset-by-two-thirds.columns,
.offset-by-two-thirds.columns-sm   { margin-left: 69.3333333333%; }

.offset-by-one-half.column,
.offset-by-one-half.column-sm,
.offset-by-one-half.columns,
.offset-by-one-half.columns-sm     { margin-left: 52%; }


.offset-centered.column,
.offset-centered.column-sm,
.offset-centered.columns,
.offset-centered.columns-sm {
	margin-left: auto;
	margin-right: auto;
	float: none;
}



/* Per smartpone fino a 480px */
@media (max-width: 480px) {

.container {
	width: 100%;
	margin: 0 auto;
	padding: 0 20px;
}

.column,
.columns {
	width: 100%;
	float: left;
	box-sizing: border-box;
}

.column,
.columns {
	margin-left: 0%;
}
.column:first-child,
.columns:first-child {
	margin-left: 0;
}

.one.column,
.one.columns                    { width: 100%; }
.two.columns                    { width: 100%; }
.three.columns                  { width: 100%; }
.four.columns                   { width: 100%; }
.five.columns                   { width: 100%; }
.six.columns                    { width: 100%; }
.seven.columns                  { width: 100%; }
.eight.columns                  { width: 100%; }
.nine.columns                   { width: 100%; }
.ten.columns                    { width: 100%; }
.eleven.columns                 { width: 100%; }
.twelve.columns                 { width: 100%; margin-left: 0; }

.one-third.column               { width: 100%; }
.two-thirds.column              { width: 100%; }

.one-half.column                { width: 100%; }

}

/* Per tablet fino a 767px */
@media (min-width: 480px) and (max-width: 767px) {
.container {
	width: 100%;
	margin: 0 auto;
	padding: 0 20px;
}

.column,
.column-sm,
.columns,
.columns-sm {
	width: 100%;
	float: left;
	box-sizing: border-box;
}

.one.column,
.one.column-sm,
.one.columns,
.one.columns-sm                   					 { width: 4.66666666667%; }
.two.columns, .two.columns-sm                    { width: 13.3333333333%; }
.three.columns, .three.columns-sm                { width: 22%;            }
.four.columns, .four.columns-sm                  { width: 30.6666666667%; }
.five.columns, .five.columns-sm                  { width: 39.3333333333%; }
.six.columns, .six.columns-sm                    { width: 48%;            }
.seven.columns, .seven.columns-sm                { width: 56.6666666667%; }
.eight.columns, .eight.columns-sm                { width: 65.3333333333%; }
.nine.columns, .nine.columns-sm                  { width: 74.0%;          }
.ten.columns, .ten.columns-sm                    { width: 82.6666666667%; }
.eleven.columns, .eleven.columns-sm              { width: 91.3333333333%; }
.twelve.columns, .twelve.columns-sm              { width: 100%; margin-left: 0; }

.one-third.column, .one-third.column-sm          { width: 30.6666666667%; }
.two-thirds.column, .two-thirds.column-sm        { width: 65.3333333333%; }

.one-half.column, .one-half.column-sm            { width: 48%; }

}


/* STILI DI BASE */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
	font-size: 62.5%;
}
body {
	font-size: 1.25em;
	font-family: 'Raleway', Verdana, Helvetica, Arial, sans-serif;
}


/* TIPOGRAFIA */
h1, h2, h3, h4, h5, h6 {
	margin-top: 0;
	margin-bottom: 2rem;
	font-weight: bold;
}
h1 { font-size: 5.0rem; line-height: 1.2;  letter-spacing: -.1rem;}
h2 { font-size: 4.2rem; line-height: 1.25; letter-spacing: -.1rem; }
h3 { font-size: 3.6rem; line-height: 1.3;  letter-spacing: -.1rem; }
h4 { font-size: 3.0rem; line-height: 1.35; letter-spacing: -.08rem; }
h5 { font-size: 2.4rem; line-height: 1.5;  letter-spacing: -.05rem; }
h6 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }

p {
	margin-top: 0;
}


/* Links */
a {
	background-color: transparent;
	color: #F60;
}
a:link {
	color: #F60;
	text-decoration: none;
}
a:visited {
	color: #F60;
	text-decoration: none;
}
a:hover {
	color: #F00;
	text-decoration: underline;
	outline: 0;
}
a:active {
	color: #F00;
	text-decoration: underline;
	outline: 0;
}


/* BUTTON */
.button,
a.button,
.button a:link,
.button a:visited,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
	display: inline-block;
	height: 38px;
	color: #000;
	text-align: center;
	font-weight: 600;
	line-height: 36px;
	letter-spacing: .1rem;
	text-transform: uppercase;
	text-decoration: none;
	white-space: nowrap;
	background-color: transparent;
	border-radius: 8px;
	border: 1px solid #bbb;
	cursor: pointer;
	box-sizing: border-box;
	padding-top: 0px;
	padding-right: 30px;
	padding-bottom: 0px;
	padding-left: 30px;
	transition: background-color 0.3s, border-color 0.3s;
}

input[type="submit"] {
	border: solid 3px #000;
}

.button:hover,
.button a:hover,
.button a:active,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
	color: #000;
	border-color: #F60;
	outline: 0;
	text-decoration: none;
}


.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
	color: #000;
	background-color: #FFF;
	border: solid 3px #000;
}

.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
	color: #000;
	background-color: #FFF;
	border-color: #F60;
}


/* FORM */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
	height: 38px; /* The 6px vertically centers text on FF, ignored by Webkit */
	background-color: #FFF;
	border: 1px solid #D1D1D1;
	border-radius: 4px;
	box-shadow: none;
	box-sizing: border-box;
	padding-top: 6px;
	padding-right: 10px;
	padding-bottom: 6px;
	padding-left: 10px;
}

/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

textarea {
	min-height: 65px;
	padding-top: 6px;
	padding-bottom: 6px;
}

input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
	border: 1px solid #F60;
	outline: 0;
}

label,
legend {
	display: block;
	margin-bottom: .5rem;
	font-weight: 600;
}

fieldset {
	padding: 10px;
	border: 1 dotted #CCC;
}

input[type="checkbox"],
input[type="radio"] {
	display: inline;
}

label > .label-body {
	display: inline-block;
	margin-left: .5rem;
	font-weight: normal;
}


/* CODE */
code {
	padding: .2rem .5rem;
	margin: 0 .2rem;
	font-size: 90%;
	white-space: nowrap;
	background: #F1F1F1;
	border: 1px solid #E1E1E1;
	border-radius: 4px;
}
pre > code {
	display: block;
	padding: 1rem 1.5rem;
	white-space: pre;
}


/* TABLES */

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0
}

.tableWithSeparator th,
.tableWithSeparator td {
	padding: 12px 15px;
	text-align: left;
	border-bottom: 1px solid #E1E1E1;
}

.tableWithSeparator th:first-child,
.tableWithSeparator td:first-child {
	padding-left: 0;
}

.tableWithSeparator th:last-child,
.tableWithSeparator td:last-child {
	padding-right: 0;
}


.tableWithSpaces th,
.tableWithSpaces td {
	padding: 12px 15px;
	text-align: left;
}

.tableWithSpaces th:first-child,
.tableWithSpaces td:first-child {
	padding-left: 0;
}

.tableWithSpaces th:last-child,
.tableWithSpaces td:last-child {
	padding-right: 0;
}

.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #f9f9f9;
}


/* SPACING */
button,
.button {
	margin-bottom: 1rem;
}

input,
textarea,
select,
fieldset {
	margin-bottom: 1.5rem;
}

pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
	margin-bottom: 2.5rem;
}


/* UTILITIES */
.u-full-width {
	width: 100%;
	box-sizing: border-box;
}
.u-max-full-width {
	max-width: 100%;
	box-sizing: border-box;
}

.u-pull-right {
	float: right;
}

.u-pull-left {
	float: left;
}


/* MISCELLANEOUS */
hr {
	margin-top: 3rem;
	margin-bottom: 3.5rem;
	border-width: 0;
	border-top: 1px solid #E1E1E1;
}


/* CLEARING */

/* Self Clearing Goodness */
.container:after,
.row:after,
.u-cf {
	content: "";
	display: table;
	clear: both;
}


/* Wrap responsive */
.googlemap_wrap,
.youtube_wrap {
	position: relative;
	padding-bottom: 75%;
	height: 0;
	overflow: hidden;
}

/* iframe posizionato in maniera assoluta */
.googlemap_wrap iframe,
.youtube_wrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100% !important;
}



/* callout */
.callout {
	position: relative;
	padding: 2%;
	margin: 2% 0%;
	border: 1px solid #c1c1c1;
	border-radius: 4px;
}
.callout.half-width {
	width: 50%;
	margin-right: auto;
	margin-left: auto;
}
.callout.auto-width {
	width: auto;
}


/* tooltip only css */
.tooltip {
	position: relative;
	display: inline-block;
	cursor: pointer;
	margin: 0 5px;
}

.tooltip .content {
	position: absolute;
	font-size: 1rem;
	z-index: 1;
	visibility: hidden;
	left: 50%;
	top: 0;
	-webkit-transform: translateX(-50%) translateY(-100%);
	transform: translateX(-50%) translateY(-100%);
	background-color: #ededed;
	padding: 5px 20px;
	border-radius: 3px;
	transition: opacity 0.3s;
	opacity: 0;
	width: 120px;
}

.tooltip .content, .tooltip .content * {
	color: #000;
}

.tooltip .content:after {
	content: " ";
	position: absolute;
	top: 100%;
	/* At the bottom of the tooltip */
	left: 50%;
	margin-left: -5px;
	border-width: 5px;
	border-style: solid;
	border-color: #ededed transparent transparent transparent;
}

.tooltip:hover .content {
	visibility: visible;
	opacity: 0.9;
}


/* css breadcrumbs */
.breadcrumbs {
	padding: 8px 15px;
	margin-bottom: 20px;
	list-style: none;
	background-color: #F3F3F3;
	border-radius: 4px;
}
.breadcrumbs > li {
	display: inline-block;
}
.breadcrumbs > li > a {
	color: #000;
	text-decoration: none;
}
.breadcrumbs > li + li:before {
	padding: 0 5px;
	color: #CCC;
	content: "/\00a0";
}
.breadcrumbs > .disabled {
	color: #CCC;
	cursor: not-allowed;
}
.breadcrumbs > .active {
	color: #777;
}


/* css pagination */
.pagination {
	display: inline-block;
	padding-left: 0;
	margin: 20px 0;
	border-radius: 4px;
}
.pagination > li {
	display: inline;
}
.pagination > li > a {
	position: relative;
	float: left;
	padding: 6px 12px;
	margin-left: -1px;
	line-height: 1.42857143;
	color: #337AB7;
	text-decoration: none;
	background-color: #FFF;
	border: 1px solid #DDD;
}
.pagination > li:first-child > a {
	margin-left: 0;
	border-top-left-radius: 4px;
	border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a {
	border-top-right-radius: 4px;
	border-bottom-right-radius: 4px;
}
.pagination > li > a:hover,
.pagination > li > a:focus {
	z-index: 2;
	color: #23527C;
	background-color: #EEE;
	border-color: #DDD;
}
.pagination > li > a.active,
.pagination > li > a.active:hover,
.pagination > li > a.active:focus {
	z-index: 3;
	color: #FFF;
	cursor: default;
	background-color: #337AB7;
	border-color: #337AB7;
}
.pagination > li > a.disabled,
.pagination > li > a.disabled:hover,
.pagination > li > a.disabled:focus {
	color: #777;
	cursor: not-allowed;
	background-color: #FFF;
	border-color: #DDD;
}


/* css accordion */

.accordion {
	width: 99.9%;
}

.accordion .transition, .accordion p, .accordion ul li i:before, .accordion ul li i:after {
	transition: all 0.25s ease-in-out;
}

.accordion .flipIn, .accordion h1, .accordion ul li {
	-webkit-animation: flipdown 0.5s ease both;
	animation: flipdown 0.5s ease both;
}

.accordion .no-select, .accordion h2 {
	-webkit-tap-highlight-color: transparent;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.accordion h2 {
	font-size: 16px;
	line-height: 32px;
	display: block;
	background-color: #fff;
	margin: 0;
	cursor: pointer;
}

.accordion p {
	position: relative;
	overflow: hidden;
	opacity: 1;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
	z-index: 2;
	margin: 10px 0px 25px 0px;
}

.accordion ul {
	list-style: none;
	padding: 0;
	margin: 0;
}
.accordion ul li {
	position: relative;
	margin: 0;
	border-top: 1px solid #ddd;
}
.accordion ul li i {
	position: absolute;
	-webkit-transform: translate(-6px, 0);
	transform: translate(-6px, 0);
	margin-top: 16px;
	right: 0;
}
.accordion ul li i:before, .accordion ul li i:after {
	content: "";
	position: absolute;
	background-color: #000;
	width: 3px;
	height: 9px;
}
.accordion ul li i:before {
	-webkit-transform: translate(-2px, 0) rotate(45deg);
	transform: translate(-2px, 0) rotate(45deg);
}
.accordion ul li i:after {
	-webkit-transform: translate(2px, 0) rotate(-45deg);
	transform: translate(2px, 0) rotate(-45deg);
}
.accordion ul li input[type=checkbox] {
	position: absolute;
	cursor: pointer;
	width: 100%;
	height: 100%;
	z-index: 1;
	opacity: 0;
}
.accordion ul li input[type=checkbox]:checked ~ p {
	margin: 0;
	max-height: 0;
	opacity: 0;
	-webkit-transform: translate(0, 50%);
	transform: translate(0, 50%);
}
.accordion ul li input[type=checkbox]:checked ~ i:before {
	-webkit-transform: translate(2px, 0) rotate(45deg);
	transform: translate(2px, 0) rotate(45deg);
}
.accordion ul li input[type=checkbox]:checked ~ i:after {
	-webkit-transform: translate(-2px, 0) rotate(-45deg);
	transform: translate(-2px, 0) rotate(-45deg);
}

@-webkit-keyframes flipdown {
	0% {
		opacity: 0;
		-webkit-transform-origin: top center;
		transform-origin: top center;
		-webkit-transform: rotateX(-90deg);
		transform: rotateX(-90deg);
	}
	5% {
		opacity: 1;
	}
	80% {
		-webkit-transform: rotateX(8deg);
		transform: rotateX(8deg);
	}
	83% {
		-webkit-transform: rotateX(6deg);
		transform: rotateX(6deg);
	}
	92% {
		-webkit-transform: rotateX(-3deg);
		transform: rotateX(-3deg);
	}
	100% {
		-webkit-transform-origin: top center;
		transform-origin: top center;
		-webkit-transform: rotateX(0deg);
		transform: rotateX(0deg);
	}
}

@keyframes flipdown {
	0% {
		opacity: 0;
		-webkit-transform-origin: top center;
		transform-origin: top center;
		-webkit-transform: rotateX(-90deg);
		transform: rotateX(-90deg);
	}
	5% {
		opacity: 1;
	}
	80% {
		-webkit-transform: rotateX(8deg);
		transform: rotateX(8deg);
	}
	83% {
		-webkit-transform: rotateX(6deg);
		transform: rotateX(6deg);
	}
	92% {
		-webkit-transform: rotateX(-3deg);
		transform: rotateX(-3deg);
	}
	100% {
		-webkit-transform-origin: top center;
		transform-origin: top center;
		-webkit-transform: rotateX(0deg);
		transform: rotateX(0deg);
	}
}


/* MEDIA QUERIES */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/


/* Larger than mobile */
@media (min-width: 400px) {}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {}

/* Larger than tablet */
@media (min-width: 750px) {}

/* Larger than desktop */
@media (min-width: 1000px) {}

/* Larger than Desktop HD */
@media (min-width: 1200px) {}