/****************** SETUP ********************/
/*
@font-face {
    font-family: 'DaxReg';
    src: url('includes/fonts/DaxlinePro-Regular.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'DaxMed';
    src: url('includes/fonts/DaxlinePro-Medium.otf') format('opentype');
    font-weight: normal;
    font-style: normal;
}*/


* {
	border: 0; 
	margin: 0; 
	padding: 0;
	font-family: 'Maven Pro', sans-serif;
	font-weight: 400;
	box-sizing: border-box;
	text-decoration: none; 
}
	


body {     
	display: flex;
	flex-direction: column;
	justify-content: center;
	font-size: 14px;
	background: #fff;
	text-align: left;
	max-width: 100%;
	min-width: 320px;
	padding-top: 60px;
	/*opacity: 0;*/
}
a {	color: #1f1f1f}
strong {font-weight: 600;}
h1, h2, h3 {font-weight: 500;}

.content {
	width: calc(100% - 40px);
	max-width: 1300px;
	display: flex;
}
.mid {
	justify-content: center !important;
	align-items: center !important;
	display: flex !important;
}

.main-link {
	position: relative;
	text-decoration: underline;
}
.main-link::after {
	background: url(images/ico-link.gif) no-repeat center center;
	content: "";
	width: 19px;
	height: 17px;
	position: absolute;
	top: calc(50% - 9px);
	left: -22px;
}
/****************** HEADER ********************/
	#topbar {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 60px;
		background: #1f1f1f;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		z-index: 999;
		flex-wrap: wrap;
	}
		#topbar #topbar-social {
			float: left;
			display: flex;
			flex-direction: row;
			justify-content: flex-start;
			align-items: center;
			height: 100%;
			margin-left: 10px;
		}
			#topbar #topbar-social a{
				margin: 0 10px;
				height: 21px;
			}
		#topbar #topbar-contact {
			float: right;
			display: flex;
			flex-direction: row;
			justify-content: flex-end;
			align-items: center;
			height: 100%;
			margin-right: 20px;			
		}			
			#topbar #topbar-contact a{
				display: flex;
				flex-direction: row;
				align-items: center;
				color: #fff !important;		
				font-size: 14px;
			}
			#topbar #topbar-contact img {margin: 0 10px 0 25px;}
			#topbar #topbar-contact #topbar-lang {
				display: flex;
			}
			#topbar #topbar-contact #topbar-lang select{
				background-color: #1f1f1f;
				color: #fff;
				padding-top: 3px;
			}

	header {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		flex-wrap: no-wrap;
		width: 100%;
		align-items: center;
		background: #ffffff;
		border-bottom: 5px #106cb6 solid;
	}
		header .content {
			justify-content: space-between;
			align-items: center;
			height: 100%;
		}
			header .content nav {
				height: 100px;
				display: flex;
				flex-direction: row;
				justify-content: space-between;
			}
				header .content nav a {
					padding: 0 20px;
					height: 100%;
					font-size: 18px;
					line-height: 1px;
					text-transform: uppercase;
					display: flex;
					justify-content: center;
					align-items: center;
					position: relative;
					font-weight: 500;
				}
				header .content nav a span {
					margin-top: 10px;
					font-weight: 500;
				}
				header .content nav a:after {
					content: "";
					position: absolute;
					bottom: 0;
					left: 0;
					right: 0;
					height: 0px;
					background-color: #106cb6;
					transition: height 0.2s ease-in;
				}
				header .content nav a:hover:after {
					height: 7px;
					transition: height 0.2s ease-in;
				}
				#mB {display: none;}
				#main-logo{
					padding: 15px 0;
				}

/****************** SLIDER BOX ********************/
#slider-wrapper {
	width: 100%;
	overflow: hidden;
	border-bottom: 5px #106cb6 solid;
	display: flex;
	justify-content: center;
	align-items: center;
}
	#slider-wrapper video {
		width: 100%;
		height: auto;
	}
	#slider-wrapper .slider-container, #slider-wrapper .slider-container a {
		width: 100%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		overflow: hidden;
	}
		#slider-wrapper .slider-container img {
			min-height: 100%;
			height: 100%;
		}
	
/****************** MAIN PAGE - SERVICES ********************/
#services {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex-wrap: no-wrap;
	width: 100%;
	padding-bottom: 80px;
}
	#services .content {
		padding-top: 20px;							
		display: grid;
		grid-template-columns: repeat(3, calc(33.3% - 33.3px));
		grid-template-rows: auto;
		grid-gap: 50px;
		width: 100%;
		max-width: 1300px;
		position: relative;
	}
		#services .content .services-box {
			display: flex;
			flex-direction: column;
			justify-content: flex-start;
			align-items: center;
			padding: 40px;
			position: relative;
		}		
		#services .content .services-box img {
			max-width: 100%;
		}
			#services .content .services-box h2 {
				font-size: 24px;
				font-weight: 500;
				width: 100%;
				text-align: center;
				position: relative;
				margin: 10px 0;
			}
				#services .content .services-box h2::after {
					content: "";
					position: absolute;
					width: 80px;
					background-color: #106cb6;
					height: 5px;
					left: calc(50% - 40px);
					bottom: -10px;
				}
			#services .content .services-box .services-desc {
				font-size: 14px;
				line-height: 29px;
				text-align: center;
			}
			#services .content .services-box .services-link {
				font-size: 12px;
				font-weight: 600;
				text-align: center;
				text-decoration: underline;
				position: absolute;
				bottom: 0;
				left: 0;
				right: 0;
			}
			#services .main-link {
				margin-top: 30px;
			}


/****************** MAIN PAGE - CONTENT ********************/
#main-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex-wrap: no-wrap;
	width: 100%;
	padding: 40px 0 40px;
}
	#main-content .content {
		flex-direction: column;
	}
		#main-content .content .main-title {display: flex;}
			#main-content .content .main-title h1 {
				font-size: 28px;
				font-weight: normal;
				width: 100%;
				text-align: left;
				position: relative;
				margin: 10px 0;

			}
			#main-content .content .main-title h1::after {
				content: "";
				position: absolute;
				width: 80px;
				background-color: #106cb6;
				height: 5px;
				left: 0;
				bottom: -10px;
			}
		#main-content .content .main-desc {
			line-height: 32px;
			text-align: justify;
			padding: 10px 0;
		}
		#main-content .content .main-desc p{
			padding-bottom: 15px;
		}
		#main-content .content .main-desc img{
			max-width: 90%;
		}
	#main-goal {
		text-align: center;
		font-size: 26px;
		line-height: 48px;
		padding: 80px 0;
	}
	#main-goal p {
		padding-bottom: 15px;
	}
/******************************* SUBPAGE COMMON **************************/
.page-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex-wrap: no-wrap;
	width: 100%;
	padding: 40px 0 40px;
	border-bottom: 1px #ececec solid;
}
	.page-content .content {
		flex-direction: column;
	}
		.page-title {display: flex;}
			.page-title h1 {
				font-size: 28px;
				font-weight: normal;
				width: 100%;
				text-align: left;
				position: relative;
				margin: 10px 0;

			}
			.page-title h1::after {
					content: "";
					position: absolute;
					width: 80px;
					background-color: #106cb6;
					height: 5px;
					left: 0;
					bottom: -10px;
				}
		.page-desc {
			line-height: 32px;
			text-align: justify;
			padding: 10px 0;
		}
			.page-desc p{
				padding-bottom: 15px;
			}
			.page-desc img{
				max-width: 90%;
			}

		#page-pageNumbers{
			display: flex;
			justify-content: center;
			align-items: baseline;
			padding: 20px;
			font-size: 22px;
			font-weight: 500;
			color: #106cb6;
		}
			#page-pageNumbers a{
				font-size: 28px;
				color: #919191;
				font-weight: 400;
			}


		/************************************ SERVICES ****************************/
		.page-list {
			padding-top: 20px;							
			display: grid;
			grid-template-columns: repeat(3, calc(33.3% - 33.3px));
			grid-template-rows: auto;
			grid-gap: 50px;
			width: 100%;
			max-width: 100%;
			position: relative;
		}
				.page-list .services-box {
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;
					position: relative;
					width: 100%;
					height: 100%;
				}
					.page-list .services-box h2 {
						font-size: 24px;
						font-weight: 500;
						width: 100%;
						text-align: center;
						position: relative;
						margin: 10px 0;
					}
					.page-list .services-box img {
						max-width: 100%;
						height: auto;
					}
						.page-list .services-box h2::after {
							content: "";
							position: absolute;
							width: 80px;
							background-color: #106cb6;
							height: 5px;
							left: calc(50% - 40px);
							bottom: -10px;
						}
					.page-list .services-box .services-desc {
						font-size: 14px;
						line-height: 29px;
						text-align: center;
						margin-bottom: 30px;
					}
					.page-list .services-box .services-link {
						font-size: 12px;
						font-weight: 600;
						text-align: center;
						text-decoration: underline;
						position: absolute;
						bottom: 0;
						left: 0;
						right: 0;

					}


					/************************************ PROJECTS ****************************/
						.page-projects-list {
							padding-top: 20px;							
							display: grid;
							grid-template-columns: repeat(3, calc(33.3% - 33.3px));
							grid-template-rows: auto;
							grid-gap: 50px;
							width: 100%;
							max-width: 100%;
							position: relative;
						}
						 	.page-projects-list .projects-box {
								width: 100%;
								display: flex;
								flex-direction: column;
								justify-content: flex-start;
								align-items: center;
								position: relative;
								padding-bottom: 10px;
								border-bottom: 1px #ececec solid;
							}
							.page-projects-list .projects-box::after {
								content: "Scopri di piu >";
								position: absolute;
								top: 0;
								left: 0;
								right: 0;
								bottom: 0;
								z-index: 5;
								display: flex;
								justify-content: center;
								padding-top: 130px;
								background: rgba(255,255,255,0.7);
								color: #106cb6;
								font-size: 18px;
								font-weight: bold;
								opacity: 0;
							}

							.projects-box:hover::after {
								opacity: 1;
								transition: opacity 0.2s;
								transition-timing-function: ease-in-out
							}
								.projects-box .projects-img-wrapper, .news-img-wrapper {
									width: 100%;
									height: 250px;
								}
								.projects-box .projects-img-wrapper img, .news-img-wrapper img {
									width: 100% !important;
									height: 100% !important;
									object-fit: cover !important;
								}
						
							.projects-box h2 {
								font-size: 20px;
								font-weight: 400;
								width: 100%;
								text-align: center;
								position: relative;
								margin: 10px 0;
							}

							#page-projects {
								padding-top: 0 !important;
							}
							#page-projects-mainShow {
								width: 100%;
								height: auto;
								overflow: hidden;
								padding: 0;
								border-bottom: 3px #106cb6 solid;
							}							
								#page-projects-mainShow img {
									width: 100%;
									height: 100%;
									object-fit: cover;
								}			
								#page-projects-mainShow video {
									float: left;
								}
							
								#page-projects .page-projects-list, .page-content .page-projects-list {
									width: 1300px;
								}
					/***************************************************************************/	

		/************************************ news ****************************/
		.news-list {
			padding-top: 20px;							
			display: grid;
			grid-template-columns: repeat(2, calc(50% - 25px));
			grid-template-rows: auto;
			grid-gap: 50px;
			width: 100%;
			max-width: 100%;
			position: relative;
		}
				.news-list .news-box {
					display: flex;
					flex-direction: column;
					justify-content: center;
					align-items: center;
					position: relative;
					width: 100%;
					height: 100%;
					border-bottom: 1px #ececec solid;
				}
					.news-list .news-box h2 {
						font-size: 24px;
						font-weight: normal;
						width: 100%;
						text-align: center;
						position: relative;
						margin: 10px 0;
					}
						.news-list .news-box h2::after {
							content: "";
							position: absolute;
							width: 80px;
							background-color: #106cb6;
							height: 5px;
							left: calc(50% - 40px);
							bottom: -10px;
						}
					.news-list .news-box .news-desc {
						font-size: 14px;
						line-height: 29px;
						text-align: center;
						margin-bottom: 30px;
					}
					.news-list .news-box .news-link {
						font-size: 12px;
						font-weight: 600;
						text-align: center;
						text-decoration: underline;
						position: absolute;
						bottom: 15px;
						left: 0;
						right: 0;

					}
			#page-news {
				padding-top: 0 !important;
			}
			#page-news-mainShow {
				width: 100%;
				height: 300px;
				overflow: hidden;
				padding: 0;
				border-bottom: 3px #106cb6 solid;
				display: flex;
				justify-content: center;
				align-items: center;
			}							
				#page-news-mainShow img {
					width: 100%;
					height: 100%;
					object-fit: cover;
				}
				#page-news .page-title {
					display: flex;
					align-items: baseline;
					justify-content: flex-start;
				}
					#page-news .page-title h1 {
						float: left;
						width: auto !important;
						padding-right: 10px;
					}


	#page-map {
		width: 100%;
		height: 450px;
		overflow: hidden;
	}
	#page-map iframe {width: 100% !important;height: 100% !important;}
/****************** MAIN PAGE - PROJECTS ********************/
#projects {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	height: 450px;
	position: relative;
	padding: 20px;
}		
#projects::after {
	content: "";
	position: absolute;
	top: 80px;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #106cb6;
	z-index: -1;
}
	.projects-project {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
		flex-direction: row;
		min-width: 320px;
		position: absolute;
		height: 410px;
		width: 100%;
		top: 100%;
		left: 0;
		right: 0;
	}
		.projects-img {
			flex: 3 1 60%;	
			float: left;
			overflow: hidden;
			min-width: 320px;
			display: flex;
			justify-content: center;
			align-items: center;
			height: 400px;
			object-fit: cover;
		}
		.projects-img img {max-width: 100%;}

		.projects-desc {			
			flex: 1 1 40%;	
			display: flex;
			flex-direction: column;
			justify-content: flex-start;
			text-align: right;
			padding: 100px 0 0 40px;
			color: #fff;
			min-width: 320px;
			
		}
		.projects-desc h3 {
			font-size: 24px;
			font-weight: normal;
			margin-bottom: 10px;
		}
		.projects-desc section:nth-child(2) p {
			line-height: 26px;
			margin-bottom: 10px;
			height: 180px;
			overflow: hidden;
		}
		.projects-desc section:nth-child(3) {
			line-height: 26px;
			margin-bottom: 10px;
			font-weight: 500;
		}
		.projects-desc section:nth-child(4) a {
			line-height: 26px;
			color: #ffffff;
			text-decoration: underline;
			font-size: 12px;
		}
	#projects-wrapper {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		max-width: 1300px;
		position: relative;
		height: 100%;
		overflow: hidden;
	}
	#projects-arrowLeft {
		position: absolute;
		left: 50px;
		top: 250px;
		height: 30px;
		width: 30px;
		border-radius: 15px;
		background: #1382dd;
		cursor: pointer;
		display: none;
	}
	#projects-arrowRight {
		position: absolute;
		right: 50px;
		top: 250px;
		height: 30px;
		width: 30px;
		border-radius: 15px;
		background: #1382dd;
		cursor: pointer;
		display: none;
	}

	
/****************** FOOTER ********************/
footer {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex-wrap: no-wrap;
	width: 100%;
	padding: 40px 0 20px;
}
	footer .content {
		justify-content: space-between;
		align-items: flex-start;
		position: relative;
	}
	footer .content h3 {
		font-weight: 500;
	}
	#footer-logo {
		position: absolute;
		top: 40px;
		left: calc(50% - 62px);

	}

	#footer-contact-fr {text-align: right;}



	footer nav {
		display: flex;
		justify-content: flex-end;
		padding: 20px 0;
	}
		footer nav a{
			text-align: right;
			padding: 3px 0;
			margin: 0 10px;
		}

	#footer-copyright {color: #919191;}

/****************** RESPONISIVE RULES ********************/

	@media all and (max-width:1100px) { 
	}
	@media all and (max-width:1000px) { 
		/****************** PROJECT SLIDER ********************/
		#projects {
			height: 650px;
		  }
		.projects-project {
			flex-direction: column;
			justify-content: flex-start;
			align-items: center;
			height: 100%;
			flex-wrap: unset;
		}		
		.projects-img {
			height: 500px;
			max-height: 500px;
			clear: both;	
			flex: 1 1 100%;	
		}
		.projects-desc {			
			flex: 1 1 100%;	
			padding: 20px 0 0 0;
			width: 100%;			
		}
		/******************  ********************/
		header .content nav a {
			padding: 0 15px;
			font-size: 14px;
		}
	}
	@media (min-width:800px) and (max-width:1000px) { 
	}
	@media all and (max-width:800px) { 
		#services .content {grid-template-columns: repeat(1, 100%);	}
		#services .content .services-box .services-desc {max-width: 500px;}
		#topbar-mail, #topbar-tel {display: none !important;}
		header .content {
			flex-direction: column;
			justify-content: flex-start;
			align-items: center;
			height: 100%;
		  }
	}
	@media all and (max-width:600px) { 
		footer .content {
			flex-direction: column;
			justify-content: flex-start;
			align-items: center;
		  }
		  #footer-logo {
			position: relative;
			top: unset;
			left: unset;
		  }
		  footer .content section{
			text-align: center !important;
			line-height: 28px;
			padding: 10px 0;
		  }
		  footer nav {
			flex-direction: column;
			align-items: center;
		  }
			footer nav a {
				text-align: center;
				padding: 10px 0;
			}
		
			header .content nav {
				flex-direction: column;
				justify-content: flex-start;
				align-items: center;
			}
			header .content nav a{
				padding: 20px 0;
			}
	}
	@media all and (max-width:400px) { 
		#topbar {flex-direction: column;}
	}