*{
	margin:0;
	padding:0;
	border:0;
	box-sizing: border-box;
}

ul{
	list-style-type: none;
}

body{
	color: black;
	 	font-family: "Alegreya", Arial, serif;
		background-color: white;
}

h2{
	font-size: 2em;
	text-align: center;
}

iframe{
	min-height: 300px;
	max-height: 30vh;
}

header{
	z-index: 2;
	background-color: #1a1a1a;
	padding: 5px 0 5px 0;
	position: fixed;
	width: 100%;
	height: 60px;
	top:0;
	border-bottom: 1px solid #595959;
}

.limiter{
	display: flex;
	flex-flow: row nowrap;
	max-width: 1200px;
	margin: auto;
}

.limiter > .logo{
	margin-top: 3px;
	width: 30%;
	display: flex;
	justify-content: center;
}

.limiter > .logo a{
	margin: auto;
}

.limiter > .logo img{
	margin: auto;
	max-height: 45px;
}

.openmenu{
	display: none;
	margin-top: 2px;
}

#openmenu{
	display: none;
	width: 0;
}

nav{
	width: 70%;
}

nav a{
	color: white;
	font-size: 1.3em;
	text-transform: uppercase;
	text-decoration: none;
}

nav a:hover{
	color: grey;
}

nav > ul{
	display: flex;
	flex-flow: row nowrap;
	white-space: nowrap;
	width: 100%;
}

nav > ul > li{
	display: inline;
	margin: auto;
	margin-top: 12px;
}

.preview{
	margin: auto;
	margin-top: 60px;
	height: 67vh;
	max-height: 720px; /*rivedere da ipad*/
	display: flex;
	flex-direction: column-reverse;
}

.preview > .pback{
	top: 60px;
	height: 67vh;
	max-height: 721px;
	width: 100%;
	position: absolute;
	overflow: hidden
}

.preview > .pback >.pinner {
		display: inline-block; 
		position:relative;
		min-width: 100%;
		min-height: 100%;
		right:-50%;
		top: -30%;
}

@-webkit-keyframes fade {
	from {opacity: .4} 
	to {opacity: 1}
}

@keyframes fade {
	from {opacity: .4} 
	to {opacity: 1}
}

.preview > .pback >.pinner > img{
	min-width: 100%;
	height: 100%;
	position: relative; 
		left:-50%;
		bottom: -70%;
		opacity: 1;
		-webkit-animation-name: fade;
		-webkit-animation-duration: 2s;
		animation: fade;
		animation-duration: 2s;
}

.preview > .textlimit{
	z-index: 1;
	width: 100%;
	margin: auto;
	margin-bottom: 1px;
	background-color:rgba(0, 0, 0, 0.6);
}

.preview > .textlimit:hover{
	background-color:rgba(0, 0, 0, 0.85);
}

.preview > .textlimit > .text{
	max-width: 1200px;
	margin: auto;
	margin-bottom: 12px;
	padding: 0 5px 0 5px;
	color: white;	
}

.container{
	display: flex;
	flex-flow: row nowrap;
	max-width: 1200px;
	margin: auto;
}

.gallerie{
	width: 100%;
	background-color: #1a1a1a;
	padding: 10px 0 27px 0;
}

.gallerie > h2{
	color: white;
}

.gallery{
	padding: 15px 0 5px 0;
	width: 100%;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
}

.gallery > li{
	height: 330px;
	text-align: center;
	display: inline;
	margin: auto;
	width: 33.333%;
	background-color: #1a1a1a;
}

.gallery > li > a{
	color: white;
	text-decoration: none;
	font-size: 1.5em;
}

.gallery > li .imglimiter{
	margin: auto;
	margin-bottom: 10px;
	height: 300px;
	width: 300px;
	border: 2px dashed white;
	border-radius: 100%; 
	overflow:hidden;
}

.gallery > li .imglimiter:hover{
	border: 3px solid white;
}

.gallery > li img{
	height: 100%;
	min-height: 100%;
	min-width: 100%;
	max-height: 150%;
	max-width: 150%;
}

.contatti{
	width:100%;
	font-size: 1.3em;
}

.contatti > .container div{
	width: 49.5%;
	text-align: center;
	margin-bottom: 20px;
}

.contatti > .container div > p, .contatti > .container div > ul{
	font-family: "Open Sans", Arial, sans-serif;
}

.iframe-googlemaps{
	width: 100%; 
	height: 600px; 
	border: 0;
	margin-bottom: -6px;
}

footer{
	font-family: "Open Sans", Arial, sans-serif;
	padding: 15px 0 100px 0;
	background-color: #1a1a1a;
	z-index: 2;
}

footer a{
	color: grey;
}

footer li{
	margin-top: 5px;
}

footer > .container div{
	color: white;
	width: 25%;
}

footer > .container div{
	padding-left: 10px
}

.about > p{
	color: grey;
}

.gcontent{
	margin-top: 60px;
	margin-bottom: 15px; 
	text-align: center;
	min-height: 75vh;
}

.column{
	flex-flow: column;
}

.gcontent > .container > .g_row{
	display: flex;
	flex-flow: row wrap;
	justify-content: flex-start;
	width: 100%;
}

.gcontent > .container > .g_row p{
	font-size: 1.7em;
	font-weight: bold;
	text-shadow: 2px 2px #000000;
}

.gimg{
	position: relative;
	margin-right: 0.25%;
	margin-left: 0.25%;
	margin-top: 10px;
	width: 24.5%;
	height: 250px;
	overflow: hidden;
}

.gimg > div{
	top: 0;
	left: 0;
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
	color: white;
	display: flex;
	flex-flow: column;
	align-items: center;
		justify-content: center;
}

.gimg img{
	top: 0;
	left: 0;
	position: absolute;
	max-width: 100%;
	min-height: 250px;
}

.page_numbers{
	margin-top: 15px;
	margin-bottom: 15px;
}

.page_numbers > h3{
	font-size: 1.7em;
}

.page_numbers a{
	font-family: "Open Sans", Arial, sans-serif;
	display: inline-block;
	margin: 7px 2px 7px 2px;
	text-decoration: none;
	color: grey;
	font-size: 1.6em;
	width: 1.4em;
	padding: 2px;
	border: 1px solid grey;
	border-radius: 100%;
	background-color: #E5E4E2;
}

.page_numbers .thispage{
	color: black;
	border: 1px solid black;
	background-color:#98AFC7;
}

.modal {    
	display: none;
	position: fixed;
	z-index: 3;
	left: 0;
	top: 0;
	width: 100%;
	height: 100vh;
	overflow: auto;
	background-color: black;
	flex-flow: row wrap;
}

/* Modal Content */
.clickzone{
	position: relative;
	min-height: 87vh;
	width: 100%;
}

.clickzone > .leftclick{
	top: 0;
	position: absolute;
	height: 100%;
	width: 50%;
	display: flex;
	align-items: center;
}

.clickzone > .rightclick{
	top: 0;
	right: 0;
	position: absolute;
	height: 100%;
	width: 50%;
	display: flex;
	align-items: center;
}

.modal-content {
	background-color: black;
	margin: auto;
	padding: 0;
	max-height: 100vh;
	max-width: 95vw;
	overflow: hidden;
}

.modal-content img {
	display: block;
	margin: auto;
	max-height: 90vh;
	max-width: 100%;
}

/* The Close Button */
.cursor {
	width: 33%;
	display: block;
	text-align: center;
	color: white;
	top: 10px;
	right: 25px;
	font-size: 70px;
	font-weight: bold;
	cursor: pointer;
}