/* common classes */

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

a {
	text-decoration: none;
}

div.page {
	position: relative;
	min-height: 100vh;
	width: 100vw;
	height: auto;
}

/* ----- page 1 ----- */
/* classes */

/* ides */
div#page1 {
	background-image: url(../img/SfondoSlider.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	height: auto;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

/* ----- page 2 ----- */
/* classes */
div.page div.TxtPag2 {
	position: relative;
	width: 60vw;
	padding-right: 5vw;
	padding-left: 10vw;
	padding-top: 15vh;
	/*left: 55vw;
	top: 10vw;*/
	/*min-height: 100%;*/
	height: auto;
	text-align: left;
	padding-bottom: 20%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

div.page div.TxtPag2 p {
	font-family: 'GBlack';
	font-size: 23px;
	line-height: 31px;
	color: #6B108B;
	margin-bottom: 10%;
}

div.page div.TxtPag2 p a {
	color: var(--rosa);
}

div.page div.TxtPag2 p a:hover {
	color: var(--viola);
}

div.page div.TxtPag2 h1 {
	text-align: left;
	font-family: 'GBlack';
	font-size: 49px;
	line-height: 59px;
	color: var(--rosa);
}

div.page div.TxtPag2 h3 {
	font-family: 'GBlack';
	font-size: 23px;
	line-height: 31px;
	color: var(--rosa);
	margin-top: 10%;
	margin-bottom: 5%;
}

div.page div.TxtPag2 a {
	text-decoration: none;
}

div.page div.TxtPag2 div.dona {
	width: 220px;
	height: 60px;
	background-color: #E83A8E;
	font-size: 27px;
	text-align: center;
	color: white;
	line-height: 60px;
	font-family: 'GBold';
	border-radius: 10px;
}

div.page div.TxtPag2 div.dona:hover {
	background-color: #6B108B;
}

/* ides */
div#page2 {
	background-image: url(../img/salvadanaio.png);
	background-size: contain;
	background-position: top;
	background-repeat: no-repeat;
	background-color: #E1E1E1;
	display: flex;
	flex-direction: row;
	justify-content: end;
	align-items: center;
}

/* ----- page 3 ----- */
/* classes */
div.page div.TxtPag3 {
	position: relative;
	width: 80%;
	left: 10%;
	text-align: center;
	padding-bottom: 20%;
	padding-top: 15%;
}

div.page div.TxtPag3 h2 {
	position: relative;
	text-align: center;
	margin-bottom: 10%;
	line-height: 0;
	font-family: 'GBlack';
	font-size: 49px;
	line-height: 59px;
	color: var(--rosa);
}

div.page div.TxtPag3 p {
	font-size: 23px;
	line-height: 31px;
	font-family: 'GMedium';
	color: #6B108B;
}

div.page div.TxtPag3 p a {
	color: var(--rosa);
}

div.page div.TxtPag3 p a:hover {
	color: var(--viola);
}

/* ides */
div.page img#DecDona1 {
	position: absolute;
	bottom: 0%;
	left: 0;
	width: 25%;
	z-index: -1;
}

div.page img#DecDona2 {
	position: absolute;
	bottom: 0%;
	right: 0;
	width: 25%;
	z-index: -1;
}

/* ----- page 4 ----- */
/* classes */
div.page div.TxtPag4 {
	position: relative;
	width: 90%;
	left: 5%;
	top: 10vw;
	padding-bottom: 10%;
	text-align: center;
}

div.page div.TxtPag4 h2 {
	text-align: center;
	padding-bottom: 10%;
	font-family: 'GBlack';
	font-size: 49px;
	line-height: 59px;
	color: var(--rosa);
}

div.page div.TxtPag4 div.gallery {
	width: 90vw;
	left: 5vw;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-content: center;
	align-items: center;
}

div.page div.TxtPag4 div.gallery div.sub-gallery {
	width: 680px;
	height: 680px;
	display: flex;
	flex-direction: column;
}

div.page div.TxtPag4 div.gallery div.sub-gallery div.col-gallery {
	display: flex;
	flex-direction: row;
}

div.page div.TxtPag4 div.gallery div.sub-gallery div.col-gallery div.row-gallery {
	width: 300px;
	height: 300px;
	border-radius: 10px;
	margin: 20px;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}

/* ides */
div#page4 {
	background-color: #E7E7E7;
	min-height: 100vh;
	padding-bottom: 10%;
}

div#f1 {
	background-image: url(../img/home/01.png);
}

div#f2 {
	background-image: url(../img/home/02.png);
}

div#f3 {
	background-image: url(../img/home/05.png);
}

div#f4 {
	background-image: url(../img/home/06.png);
}

div#f5 {
	background-image: url(../img/home/03.png);
}

div#f6 {
	background-image: url(../img/home/04.png);
}

div#f7 {
	background-image: url(../img/home/07.png);
}

div#f8 {
	background-image: url(../img/home/08.png);
}

/* ----- Media queeries ----- */

@media (max-width: 1440px) {
	/* ----- page 4 ----- */
	/* classes */
	div.page div.TxtPag4 div.gallery div.sub-gallery div.col-gallery div.row-gallery {
		width: 250px;
		height: 250px;
	}
}

@media (max-width: 1200px) {
	/* ----- page 4 ----- */
	/* classes */
	div.page div.TxtPag4 div.gallery {
		flex-direction: column;
	}

	div.page div.TxtPag4 div.gallery div.sub-gallery div.col-gallery div.row-gallery {
		width: 300px;
		height: 300px;
	}
}

@media (max-width: 1000px) {
	/* ----- page 2 ----- */
	/* classes */
	div.page div.TxtPag2 {
		position: relative;
		width: 80%;
		margin: auto;
		margin-top: 100vh;
		flex-direction: column;
		justify-content: center;
		text-align: center;
	}

	div.page div.TxtPag2 p {
		font-size: 30px;
		line-height: 35px;
		text-align: justify;
		left: 0;
	}

	div.page div.TxtPag2 h1 {
		text-align: center;
		font-size: 40px;
		line-height: 45px;
	}

	div.page div.TxtPag2 h3 {
		font-size: 30px;
		line-height: 35px;
	}

	div.page div.dona {
		position: relative;
		height: 90px;
		border-radius: 20px;
		left: 50%;
		margin-left: -110px;
		margin-top: 100px;
		font-size: 40px;
		line-height: 90px;
	}

	/* ides */
	div#page2 {
		background-image: url(../img/salvadanaio_mobile.png);
		min-height: 150vh;
		height: auto;
		background-image: cover;
		justify-content: center;
	}
}

@media (max-width: 820px){
	/* common classes */
	h1 {
		text-align: center;
		font-size: 40px;
		line-height: 50px;
	}

	h2 {
		text-align: center;
		font-size: 40px;
		line-height: 50px;
	}

	h3 {
		font-size: 30px;
		line-height: 40px;
	}

	/* ----- page 2 ----- */
	/* classes */
	div.page div.TxtPag2 {
		width: 90%;
	}

	/* ----- page 3 ----- */
	/* classes */
	div.page div.TxtPag3 {
		position: relative;
		width: 80%;
		left: 10%;
		min-height: 60vw;
		text-align: center;
		margin: 0;
		margin-top: 200px;
		padding: 0;
		padding-bottom: 50%;
	}

	div.page div.TxtPag3 p {
		font-size: 40px;
		line-height: 45px;
		text-align: justify;
	}

	/* ides */
	img#DecDona1 {
		width: 100%;
	}

	img#DecDona2 {
		display: none;
	}

	/* ----- page 4 ----- */
	/* classes */
	div.page div.TxtPag4 {
		left: 0;
		margin-left: 0;
	}
}

@media (max-width: 700px){
	/* ----- page 2 ----- */
	/* classes */
	div.page div.TxtPag2 {
		margin-top: 80vh;
	}

	div.page div.TxtPag4 div.gallery div.sub-gallery {
		width: 580px;
		height: 580px;
	}

	div.page div.TxtPag4 div.gallery div.sub-gallery div.col-gallery div.row-gallery {
		width: 250px;
		height: 250px;
	}
}

@media (max-device-width: 600px) and (orientation: portrait) {

}
/* Per iPhone portrait*/
@media only screen
	and (max-device-width: 800px)
	and (min-device-height:  480px)
	and (orientation:portrait) {
		/* common classes */
		h1 {
			text-align: center;
			font-size: 40px;
			line-height: 45px;
			word-wrap: break-word;
		}

		h2 {
			text-align: center;
			font-size: 40px;
			line-height: 45px;
			word-wrap: break-word;
		}

		h3 {
			font-size: 35px;
			line-height: 40px;
			word-wrap: break-word;
		}

		/* ----- page 2 ----- */
		/* classes */
		div.page div.TxtPag2 {
			margin-top: 50vh;
			width: 90%;

		}

		div.page div.TxtPag3 p {
			font-size: 30px;
			line-height: 35px;
			text-align: justify;
		}

		/* ides */
		img#DecDona1 {
			width: 100%;
			z-index: -1;
		}

		img#DecDona2 {
			display: none;
		}

		/* ----- page 3 ----- */
		/* ides */
		div#page4 h2 {
			position: relative;
			padding-top: 20%;
			padding-bottom: 20%;
		}

		/* ----- page 4 ----- */
		/* common rules */
		div.page div.TxtPag4 {
			margin: auto;
		}

		div.page div.TxtPag4 div.gallery {
			align-items: center;
			justify-content: center;
		}

		div.page div.TxtPag4 div.gallery div.sub-gallery {
			width: 100%;
			margin: auto;
			height: 400px;
			justify-content: space-around;
			align-items: center;
		}

		div.page div.TxtPag4 div.gallery div.sub-gallery div.col-gallery div.row-gallery {
			width: 150px;
			height: 150px;
			margin: 10px;
		}
	}

/* Per iPhone landscape*/
@media screen
	and (max-height:  580px)
	and (orientation:landscape) {
		/* common classes */
		h1 {
			text-align: left;
			font-family: 'GBlack';
			font-size: 49px;
			line-height: 59px;
			color: #E84592;
		}

		h2 {
			text-align: left;
			font-family: 'GBlack';
			font-size: 49px;
			line-height: 59px;
			color: #E84592;
		}

		h3 {
			font-family: 'GBlack';
			font-size: 23px;
			line-height: 31px;
			color: #E83A8E;
			margin-top: 10%;
			margin-bottom: 5%;
		}

		/* ----- page 1 ----- */
		/* ides */
		div#page1 {
			height: 150vh;
		}
		/* ----- page 2 ----- */
		/* classes */
		div.page div.TxtPag2 {
			margin-top: 150vh;
		}
		
		/* ----- page 4 ----- */
		/* ides */
		div#page4 {
			height: 300vh;
		}
	}