:root {
	--primary-color: #B6D5CA;
	/*--primary-color: #B3A7C3;*/
}

html, body {
	margin: 0;
	padding: 0;

	height: 100%;
	overflow-x: hidden;

	font-family: 'Open Sans', sans-serif;
}

.easyLink, .noLink {
	color: inherit;
	text-decoration: none;
}
	.easyLink:hover {
		text-decoration: underline;
	}
.smaller {
	font-size: .85rem;
	opacity: .8;
}


header {
	width: 100%;
	height: 95%;
	min-height: 880px;

	position: relative;
	background-color: var(--primary-color);
}

	#bgHeader {
		position: absolute;
		top: 0;
		right: 0;
		bottom: 0;
		margin: auto;
		pointer-events: none;
		background-color: #fff;
		overflow: hidden;

		-webkit-box-shadow: inset 0px 8px 45px -8px rgba(0, 0, 0, 0.5);
		-moz-box-shadow: inset 0px 8px 45px -8px rgba(0, 0, 0, 0.5);
		box-shadow: inset 0px 8px 45px -8px rgba(0, 0, 0, 0.5);

		/*left: -10%;
		width: 120%;
		-webkit-border-radius: 0px 0px 50% 50%;
		-moz-border-radius: 0px 0px 50% 50%;
		border-radius: 0px 0px 50% 50%;*/
		left: -300px;
		width: calc(100% + 600px);
		-webkit-border-radius: 0px 0px calc(100% + 200px) calc(100% + 200px);
		-moz-border-radius: 0px 0px calc(100% + 200px) calc(100% + 200px);
		border-radius: 0px 0px calc(100% + 200px) calc(100% + 200px);
	}
		#bgHeader > div {
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			margin: auto;

			/*background-image: url('../img/bg_2.jpeg');*/
			background-image: url('../img/bg_1_upscaled_c.jpeg');
			background-size: cover;
			background-position: center;
			background-repeat: no-repeat;
			/*opacity: .2;*/
			opacity: .5;
		}


	#logo {
		position: relative;
		width: 90%;
		max-width: 1180px;
		margin: 0px auto;
		padding-top: 80px;		
	}
		#logo img {
			width: 420px;
			height: auto;
		}


	#introContent {
		position: relative;
		width: 90%;
		max-width: 1180px;
		margin: 80px auto 0px auto;
	}
		h1 {
			padding: 0;
			font-weight: 400;
			font-size: 3.2rem;
			color: #202020;
			/*text-shadow: 0px 2px rgba(0,0,0, 0.5);*/

			line-height: 1.3;

			margin-bottom: 45px;

			/*-webkit-text-stroke: 1px #86a097;*/
			/*color: var(--primary-color);*/
		}
			h1 em {
				/*font-size: 3.2rem;*/
				font-style: normal;
				font-weight: 800;
				color: #202020;

				position: relative;

				/*-webkit-text-stroke: 0px #000;*/
			}

				h1 em:after {
					content: "";
					position: absolute;
					bottom: -3px;
					left: 0px;

					height: 5px;
					-webkit-border-radius: 50%;
					-moz-border-radius: 50%;
					border-radius: 50%;
					width: 100%;
					background-color: #202020;
				}

		#introContent p {
			font-size: 1.1rem;
			color: #404040;
			font-weight: 700;
		}

		.mainCtaContainer {
			display: inline-block;
			margin: 7px 0px 20px 0px;
			position: relative;
		}
			.mainCta {
				background-color: rgba(182, 213, 202, 1);  /* PRIMARY COLOR IN RGB */
				color: #50605a;
				border: 2px solid rgba(80, 96, 90, 0.2);
				text-decoration: none;

				font-size: .9rem;
				text-transform: uppercase;

				-webkit-box-shadow: 0px 1px 12px -4px rgba(0, 0, 0, 0.5);
				-moz-box-shadow: 0px 1px 12px -4px rgba(0, 0, 0, 0.5);
				box-shadow: 0px 1px 12px -4px rgba(0, 0, 0, 0.5);
				font-weight: 700;
				-webkit-border-radius: 8px;
				-moz-border-radius: 8px;
				border-radius: 8px;

				padding: 14px 16px;
				display: inline-block;
			}
				.mainCta .iconInBtn img {
					height: 1.2rem; right: 2px;
				}

			#textMeExamples {
				position: absolute;
				left: calc(100% + 15px);
				top: 50%;
				-webkit-transform: translateY(-50%);
				   -moz-transform: translateY(-50%);
				    -ms-transform: translateY(-50%);
				     -o-transform: translateY(-50%);
				        transform: translateY(-50%);

				padding: 12px 14px;
				background-color: #202020;
				-webkit-border-radius: 8px;
				-moz-border-radius: 8px;
				border-radius: 8px;

				white-space: nowrap;
				/*color: #efefef;*/
				color: rgba(255, 255, 255, 0.75);
				text-transform: none;
				font-weight: normal;
				font-style: normal;
				font-size: .8rem;
				cursor: default;

				background-color: #00000080;
				box-shadow: 0 10px 15px rgb(0 0 0 / 20%);
				color: #fff;
				backdrop-filter: blur(33px);
				background-blend-mode: overlay;


				display: none;
			}
				#textMeExamples:before {
					content: "";
					position: absolute;
					width: 0;
					height: 0;
					top: 0;
					bottom: 0;
					right: 100%;
					margin: auto;

					width: 0; 
					height: 0;
					border-top: 6px solid transparent;
					border-bottom: 6px solid transparent;   
					border-right: 8px solid #00000080; 
				}

				#textMeExamples span.loading {
					padding-top: 0px;
					padding-bottom: 0px;
				}
					#textMeExamples img {
						width: 23px;
						height: auto;
						position: relative;
						top: 1px;
					}

		.secondaryCta {
			text-decoration: none;
			/*background-color: rgba(255, 255, 255, 0.8);*/
			/*background-color: rgba(255, 255, 255, 1);*/
			/*color: #101010;*/
			background-color: #303030;
			color: #fff;
			-webkit-box-shadow: 0px 1px 12px -4px rgba(0, 0, 0, 0.5);
			-moz-box-shadow: 0px 1px 12px -4px rgba(0, 0, 0, 0.5);
			box-shadow: 0px 1px 12px -4px rgba(0, 0, 0, 0.5);
			/*border: 2px solid #101010;*/
			/*border: 2px solid rgba(0, 0, 0, 0.25);*/
			/*border: 2px solid rgba(0, 0, 0, 0.1);*/

			font-weight: 700;
			padding: 14px 16px;
			-webkit-border-radius: 8px;
			-moz-border-radius: 8px;
			border-radius: 8px;
			display: inline-block;
			margin: 7px 0px;


			font-size: .9rem;
			text-transform: uppercase;
		}

		.btnWithIcon {
			padding-right: 52px!important;
			position: relative;
		}

		.iconInBtn {
			position: absolute;
			top: 0;
			right: 16px;
			height: 100%;
			display: flex;
			align-items: center;
			justify-content: flex-start;
			padding: 0;
		}
			.iconInBtn img {
				position: relative;
				height: 1.5rem;
				width: auto;
				padding: 0;
				margin: 0;
				/*top: 1px;*/
			}

		.moveIconOnHover > .iconInBtn {
			-webkit-transition: transform .15s ease-in-out;
			   -moz-transition: transform .15s ease-in-out;
			    -ms-transition: transform .15s ease-in-out;
			     -o-transition: transform .15s ease-in-out;
			        transition: transform .15s ease-in-out;
		}
		.moveIconOnHover:hover > .iconInBtn {
			-webkit-transform: translateX(5px);
			   -moz-transform: translateX(5px);
			    -ms-transform: translateX(5px);
			     -o-transform: translateX(5px);
			        transform: translateX(5px);
		}

		.btnHelper {
			position: relative;
		}
		.btnHelper:after {
			content: attr(data-text-helper);

			position: absolute;
			top: calc(100% + 4px);

			width: auto;
			white-space: nowrap;
		}

#assistant {
	position: fixed;
	bottom: 40px;
	width: calc(100% - 150px);
	margin: auto;

	z-index: 9999!important;

	opacity: 0;
	pointer-events: none;
	bottom: -100px;
	-webkit-transition: all .2s ease-in-out;
	   -moz-transition: all .2s ease-in-out;
	    -ms-transition: all .2s ease-in-out;
	     -o-transition: all .2s ease-in-out;
	        transition: all .2s ease-in-out;
}
	#assistant.visible {
		pointer-events: auto;
		opacity: 1;
		bottom: 40px;
	}

	#assistantContent {
		position: absolute;
		width: 95px;
		height: 95px;
		bottom: 0px;
		right: 0px;
	}

		#assistantFace {
			position: absolute;
			top: 0;
			left: 0;
			margin: auto;

			height: 100%;
			width: 100%;
			

			cursor: pointer;
		}
			#assistantFace > span {
				width: 100%;
				height: 100%;
				position: absolute;
				overflow: hidden;

				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
				border-radius: 50%;

				-webkit-box-shadow: 0px 1px 16px -2px rgba(0, 0, 0, 0.5);
				-moz-box-shadow: 0px 1px 16px -2px rgba(0, 0, 0, 0.5);
				box-shadow: 0px 1px 16px -2px rgba(0, 0, 0, 0.5);
			}
				#assistantFace > span > img {
					width: 100%;
					height: auto;
					-webkit-user-select: none;
					-moz-user-select: none;
					user-select: none;
				}

			#assistantFace > i {
				position: absolute;
				text-align: center;
				bottom: 0px;
				right: 0px;

				display: block;
				text-align: center;
				width: 36px;
				height: 36px;
			}
				#assistantFace > i > img {
					width: 100%;
					height: auto;
				}

		#assistantDialog {
			position: absolute;

			-webkit-box-shadow: 0px 1px 16px -8px rgba(0, 0, 0, 0.5);
			-moz-box-shadow: 0px 1px 16px -8px rgba(0, 0, 0, 0.5);
			box-shadow: 0px 1px 16px -8px rgba(0, 0, 0, 0.5);

			bottom: calc(100% + 15px);
			left: 50%;
			-webkit-transform: translateX(-50%);
			   -moz-transform: translateX(-50%);
			    -ms-transform: translateX(-50%);
			     -o-transform: translateX(-50%);
			        transform: translateX(-50%);
			margin: auto;
			width: 260px;
			-webkit-box-sizing: border-box;
			   -moz-box-sizing: border-box;
					box-sizing: border-box;
			background-color: #fff;
			-webkit-border-radius: 8px;
			-moz-border-radius: 8px;
			border-radius: 8px;

			display: flex;
			flex-direction: column;
			justify-content: space-between;
			font-size: .8rem;
			min-height: 320px;		

			opacity: 0;
			pointer-events: none;
			bottom: calc(100% + 5px);

			-webkit-transition: all .15s ease-in-out;
			   -moz-transition: all .15s ease-in-out;
			    -ms-transition: all .15s ease-in-out;
			     -o-transition: all .15s ease-in-out;
			        transition: all .15s ease-in-out;
		}
		#assistantDialog.visible {
			opacity: 1;
			pointer-events: auto;
			bottom: calc(100% + 15px);
		}

			.whatsappLink {
				text-decoration: none;
				color: #075E54;
				font-weight: 700;
			}
				.whatsappLink:hover {
					text-decoration: underline;
				}

			#assistantDialog:before {
				content: "";
				position: absolute;
				left: 0;
				right: 0;
				top: calc(100% - 1px);
				margin: auto;
				width: 0; 
				height: 0; 
				border-left: 6px solid transparent;
				border-right: 6px solid transparent;
				border-top: 8px solid #fff;

				-webkit-box-shadow: 0px 1px 16px -8px rgba(0, 0, 0, 0.5);
			-moz-box-shadow: 0px 1px 16px -8px rgba(0, 0, 0, 0.5);
			box-shadow: 0px 1px 16px -8px rgba(0, 0, 0, 0.5);
			}

			#assistantDialog > span:first-of-type {
				padding: 16px 20px;
				color: #404040;
			}

			#assistantDialog > span:last-of-type {
				-webkit-border-radius: 0px 0px 8px 8px;
				-moz-border-radius: 0px 0px 8px 8px;
				border-radius: 0px 0px 8px 8px;
				overflow: hidden;
			}

			#assistantForm {
				position: relative;
				background-color: orange;
			}
				#assistantForm input[type="text"] {
					border: none;
					padding: 16px 12px;
					padding-right: 50px;
					-webkit-box-sizing: border-box;
					   -moz-box-sizing: border-box;
							box-sizing: border-box;
					
					width: 100%;
					outline: none;
					border-top: 1px solid #dadada;
				}

				#assistantForm a {
					cursor: pointer;
					position: absolute;
					top: 1px;
					right: 7px;
					bottom: 0;
					margin: auto;

					width: 35px;
					height: 35px;


					-webkit-border-radius: 6px;
					-moz-border-radius: 6px;
					border-radius: 6px;

					background-color: #25D366;
					/*background-color: #075E54;*/

					display: flex;
					justify-content: center;
					align-items: center;
				}
					#assistantForm a:hover {
						background-color: #22b759;
					}

					#assistantForm a img {
						width: 18px;
						height: auto;
					}


#main {
	min-height: 600px;

	background-color: var(--primary-color);

	padding-top: 60px;
	padding-bottom: 200px;
}
	#aboutMe {
		width: 80%;
		max-width: 520px;
		margin: 0px auto 180px auto;
	}
		#aboutMe > div {
			display: flex;
			flex-direction: column;
			align-items: center;
			padding-bottom: 20px;

			/*border-bottom: 1px solid #9cbcb0;*/
			/*border-bottom: 2px solid #d3e2dd;*/
			color: #383838;
			position: relative;
		}
			/*#aboutMe > div:after {
				content: "";
				position: absolute;
				bottom: 0px;
				height: 6px;
				width: 100%;
				background-color: #d3e2dd;
				-webkit-border-radius: 50%;
				-moz-border-radius: 50%;
				border-radius: 50%;
			}*/

			#aboutMe > div > span:first-of-type {
				width: 105px;
				height: 105px;
				margin-bottom: 25px;

				position: relative;
			}
				#aboutMe > div > span:first-of-type > i {
					position: absolute;
					top: 0;
					left: 0;
					right: 0;
					bottom: 0;
					margin: auto;
					width: 100%;
					height: 100%;

					text-align: center;
					font-style: normal;
					overflow: hidden;

					-webkit-border-radius: 50%;
					-moz-border-radius: 50%;
					border-radius: 50%;

					-webkit-box-shadow: 0px 1px 8px -2px rgba(0, 0, 0, 0.5);
					-moz-box-shadow: 0px 1px 8px -2px rgba(0, 0, 0, 0.5);
					box-shadow: 0px 1px 8px -2px rgba(0, 0, 0, 0.5);

					z-index: 100;
				}
					#aboutMe > div > span:first-of-type > i > img {
						width: 100%;
						height: auto;
					}

				#aboutMe > div > span:first-of-type:before, #aboutMe > div > span:first-of-type:after {
					content: "";
					position: absolute;
					width: 42px;
					height: 42px;

					-webkit-border-radius: 50%;
					-moz-border-radius: 50%;
					border-radius: 50%;

					-webkit-box-shadow: 0px 1px 6px -2px rgba(0, 0, 0, 0.5);
					-moz-box-shadow: 0px 1px 6px -2px rgba(0, 0, 0, 0.5);
					box-shadow: 0px 1px 6px -2px rgba(0, 0, 0, 0.5);

					z-index: 1;
				}

					@keyframes bubble-profile-image {
						0% {
							 -webkit-transform: rotate(0deg) translateX(10px) rotate(0deg);
							    -moz-transform: rotate(0deg) translateX(10px) rotate(0deg);
							     -ms-transform: rotate(0deg) translateX(10px) rotate(0deg);
							      -o-transform: rotate(0deg) translateX(10px) rotate(0deg);
							         transform: rotate(0deg) translateX(10px) rotate(0deg);
						}
						100% {
							 -webkit-transform: rotate(360deg) translateX(10px) rotate(-360deg);
							    -moz-transform: rotate(360deg) translateX(10px) rotate(-360deg);
							     -ms-transform: rotate(360deg) translateX(10px) rotate(-360deg);
							      -o-transform: rotate(360deg) translateX(10px) rotate(-360deg);
							         transform: rotate(360deg) translateX(10px) rotate(-360deg);
						}
					}

					@keyframes bubble-profile-image-counter {
						0% {
							 -webkit-transform: rotate(0deg) translateX(10px) rotate(0deg);
							    -moz-transform: rotate(0deg) translateX(10px) rotate(0deg);
							     -ms-transform: rotate(0deg) translateX(10px) rotate(0deg);
							      -o-transform: rotate(0deg) translateX(10px) rotate(0deg);
							         transform: rotate(0deg) translateX(10px) rotate(0deg);
						}
						100% {
							 -webkit-transform: rotate(-360deg) translateX(10px) rotate(360deg);
							    -moz-transform: rotate(-360deg) translateX(10px) rotate(360deg);
							     -ms-transform: rotate(-360deg) translateX(10px) rotate(360deg);
							      -o-transform: rotate(-360deg) translateX(10px) rotate(360deg);
							         transform: rotate(-360deg) translateX(10px) rotate(360deg);
						}
					}

					#aboutMe > div > span:first-of-type:before {
						top: -4px;
						right: -4px;
						/*background-color: #B1F2E7;*/
						background-image: linear-gradient(120deg, #f6d365 0%, #fda085 100%);

						-webkit-animation: bubble-profile-image 8s ease-in-out 0s infinite;
						   -moz-animation: bubble-profile-image 8s ease-in-out 0s infinite;
						    -ms-animation: bubble-profile-image 8s ease-in-out 0s infinite;
						     -o-animation: bubble-profile-image 8s ease-in-out 0s infinite;
						        animation: bubble-profile-image 8s ease-in-out 0s infinite;
					}

					#aboutMe > div > span:first-of-type:after {
						bottom: -4px;
						left: -4px;
						/*background-color: #B1F2E7;*/
						background-image: linear-gradient(120deg, #84fab0 0%, #8fd3f4 100%);

						-webkit-animation: bubble-profile-image-counter 8s ease-in-out 0s infinite;
						   -moz-animation: bubble-profile-image-counter 8s ease-in-out 0s infinite;
						    -ms-animation: bubble-profile-image-counter 8s ease-in-out 0s infinite;
						     -o-animation: bubble-profile-image-counter 8s ease-in-out 0s infinite;
						        animation: bubble-profile-image-counter 8s ease-in-out 0s infinite;
					}

				#aboutMe > div > span:last-of-type {
					position: relative;

					display: inline-block;
					background-color: #d3e2dd;
					padding: 20px 26px;
					-webkit-box-sizing: border-box;
					   -moz-box-sizing: border-box;
							box-sizing: border-box;

					-webkit-border-radius: 8px;
					-moz-border-radius: 8px;
					border-radius: 8px;

					font-size: .9rem;

					-webkit-box-shadow: 0px 1px 12px -6px rgba(0, 0, 0, 0.5);
					-moz-box-shadow: 0px 1px 12px -6px rgba(0, 0, 0, 0.5);
					box-shadow: 0px 1px 12px -6px rgba(0, 0, 0, 0.5);

					z-index: 1;
				}
					#aboutMe > div > span:last-of-type:before {
						content: "";
						position: absolute;
						bottom: 100%;
						left: 0;
						right: 0;
						margin: auto;

						width: 0;
						height: 0;
						border-left: 8px solid transparent;
						border-right: 8px solid transparent;
						border-bottom: 8px solid #d3e2dd;
					}

					#aboutMe em {
						font-weight: 700;
						/*color: #e58d34;*/
						color: #075E54;
						font-style: normal;
					}

				.bgIconGift {
					position: absolute;
					/*top: 0;*/
					/*bottom: 0;*/
					/*left: 0;*/
					margin: auto;
					width: 80px;

					z-index: 1;
				}
					.bgIconGift > img {
						width: 100%;
						height: auto;
					}

				#bgIconGiftLeft {
					top: 60%;
					left: -40px;
					transform: rotate(313deg) translateY(-1px);
				}
				


	#servizi {
		width: 90%;
		max-width: 780px;
		margin: 0px auto;

		position: relative;
	}
		#servizi:before {
			content: "Come posso aiutarti?";

			position: absolute;
			left: -70%;
			top: 350px;

			-webkit-transform: rotate(-90deg);
			   -moz-transform: rotate(-90deg);
			    -ms-transform: rotate(-90deg);
			     -o-transform: rotate(-90deg);
			        transform: rotate(-90deg);

			font-size: 4rem;
			font-weight: 800;

			color: #9cbcb0;
		}

		#servizi > div {
			display: flex;

			margin-bottom: 220px;
			align-items: baseline;
		}
			#servizi > div:last-of-type {
				margin-bottom: 0px;
			}

			#servizi > div > span:first-of-type {
				flex-grow: 0;
				width: 20%;

				/*font-size: 8.4rem;*/
				font-size: 7.4rem;
				font-weight: 800;

				display: flex;
				align-items: center;
				/*background-color: lightgreen;*/

				margin-right: 20px;
				position: relative;
			}
				#servizi > div > span:first-of-type > span {
					z-index: 100;
					text-shadow: 0px 1px 2px rgba(0,0,0, 0.5);
				}

				#servizi > div > span:first-of-type > i {
					position: absolute;
					font-style: normal;

					left: -50%;
					top: 50%;
					width: 100%;

					z-index: 1;
				}
					#servizi > div > span:first-of-type > i > img {
						width:  120px;
						height: auto;

						position: relative;
					}


				#servizi > div > span:first-of-type:after {
					content: "";
					position: absolute;
					bottom: 20px;
					left: 0px;

					height: 5px;
					-webkit-border-radius: 50%;
					-moz-border-radius: 50%;
					border-radius: 50%;
					width: 100%;
					background-color: #202020;

					z-index: 100;
				}

				#servizi > div > span:last-of-type {
					color: #383838;

					/*padding-bottom: 40px;
					border-bottom: 2px solid #00000020;*/
				}
					#servizi > div > span:last-of-type p em {
						font-weight: 700;
						/*color: #e58d34;*/
						color: #075E54;
						font-style: normal;
					}

					#servizi h2 {
						font-weight: 800;
						font-size: 3.4rem;
						color: #000;
						text-shadow: 5px -5px 0px #9cbcb0;
						padding: 0;
						margin: 0px 0px 20px 0px;
					}

				.locationConstraint {
					display: block;
				}
					.locationConstraint > i {
						font-style: normal;
						padding: 8px 12px;
						background-color: #fff;
						-webkit-border-radius: 8px;
						-moz-border-radius: 8px;
						border-radius: 8px;

						font-size: .8rem;
						font-weight: 700;
						-webkit-box-shadow: 0px 1px 6px -3px rgba(0, 0, 0, 0.5);
						-moz-box-shadow: 0px 1px 6px -3px rgba(0, 0, 0, 0.5);
						box-shadow: 0px 1px 6px -3px rgba(0, 0, 0, 0.5);
					}
						.locationConstraint > i > img {
							height: 1.2rem;
							position: relative;
							top: 4px;
							margin-right: 4px;
						}

				.servizioCta {
					display: inline-block;
					margin-top: 16px;

					text-decoration: none;
					padding: 14px 22px;
					color: #eaeaea;
					background-color: #303030;
					font-weight: 700;
					text-transform: uppercase;
					font-size: .9rem;
					-webkit-box-shadow: 0px 1px 18px -6px rgba(0, 0, 0, 0.5);
					-moz-box-shadow: 0px 1px 18px -6px rgba(0, 0, 0, 0.5);
					box-shadow: 0px 1px 18px -6px rgba(0, 0, 0, 0.5);

					-webkit-border-radius: 8px;
					-moz-border-radius: 8px;
					border-radius: 8px;
				}
				
				#whatsappServizioCta {
					background-color: #fff;
					/*color: #101010;*/
					color: #103928;
					-webkit-box-shadow: 0px 1px 8px -4px rgba(0, 0, 0, 0.5);
					-moz-box-shadow: 0px 1px 8px -4px rgba(0, 0, 0, 0.5);
					box-shadow: 0px 1px 8px -4px rgba(0, 0, 0, 0.5);
				}
					#whatsappServizioCta .iconInBtn img {
						height: 1.2rem; right: 3px;
					}

				.pipelineContainer {
					display: flex;
					margin: 20px 0px;
				}
					.pipelineContainer > span {
						flex-grow: 0;
						margin-right: 18px;
						position: relative;
					}

						.pipelineContainer > span > i:first-of-type {
							width: 180px;
							height: 180px;
							-webkit-box-shadow: 0px 1px 16px -6px rgba(0, 0, 0, 0.5);
							-moz-box-shadow: 0px 1px 16px -6px rgba(0, 0, 0, 0.5);
							box-shadow: 0px 1px 16px -6px rgba(0, 0, 0, 0.5);

							display: flex;
							justify-content: center;
							text-align: center;
							overflow: hidden;

							-webkit-border-radius: 8px;
							-moz-border-radius: 8px;
							border-radius: 8px;
						}
							.pipelineContainer > span > i:first-of-type > img {
								width: 100%;
								height: 100%;
							}

							.pipelineContainer > span.disabled {
								-webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
								filter: grayscale(100%);

								opacity: .5;

								-webkit-transform: scale(0.85, 0.85);
								   -moz-transform: scale(0.85, 0.85);
								    -ms-transform: scale(0.85, 0.85);
								     -o-transform: scale(0.85, 0.85);
								        transform: scale(0.85, 0.85);
								
							}
								.pipelineContainer > span.disabled > i:first-of-type {
									-webkit-box-shadow: 0px 1px 16px -6px rgba(0, 0, 0, 0.25);
									-moz-box-shadow: 0px 1px 16px -6px rgba(0, 0, 0, 0.25);
									box-shadow: 0px 1px 16px -6px rgba(0, 0, 0, 0.25);
								}

						.pipelineContainer > span > i:last-of-type {
							display: block;
							font-style: normal;
							font-weight: 700;
							margin-top: 15px;
							text-align: center;
						}

						.tickStatus {
							position: absolute;
							top: 4px;
							left: 4px;

							width: 28px;
						}



footer {
	background-color: var(--primary-color);

	position: relative;
	width: 100%;
	min-height: 300px;
}

	#bgFooter {
		background-color: #101010;

		position: absolute;
		top: 0;
		bottom: 0;
		left: -10%;
		margin: auto;
		width: 120%;

		-webkit-border-radius: 50% 50% 0px 0px;
		-moz-border-radius: 50% 50% 0px 0px;
		border-radius: 50% 50% 0px 0px;

		-webkit-box-shadow: 0px -8px 45px -8px rgba(0, 0, 0, 0.5);
		-moz-box-shadow: 0px -8px 45px -8px rgba(0, 0, 0, 0.5);
		box-shadow: 0px -8px 45px -8px rgba(0, 0, 0, 0.5);
	}

	#footerContent {
		position: relative;
		color: #efefef;

		width: 90%;
		max-width: 740px;
		margin: 0px auto;
		padding-top: 120px;

		display: flex;
		justify-content: space-between;
		align-items: center;
		/*flex-direction: column;*/

		font-size: .8rem;
	}
		#footerContent > span {
			/*margin-bottom: 40px;*/
		}
		
		#footerContent > span:last-of-type {
			display: flex;
			flex-direction: column;
		}

		#footerContent i {
			font-style: normal;
			margin-bottom: 15px;
		}

		#footerContent i:last-of-type {
			margin-top: 30px;
			margin-bottom: 0px;
		}

			#footerContent i img {
				height: .8rem;
				position: relative;
				top: 2px;
				margin-left: 2px;
			}

/*







	MOBILE







*/
@media screen and (max-width: 980px) {
	
	header {
		height: auto;
		min-height: auto;
		padding-bottom: 60px;
	}	
		#logo {
			padding-top: 25px;
		}
			#logo img {
				max-width: 100%;
			}

	#bgHeader {
		/*left: -100px;
		width: calc(100% + 200px);
		-webkit-border-radius: 0px 0px 250px 250px;
		-moz-border-radius: 0px 0px 250px 250px;
		border-radius: 0px 0px 250px 250px;*/
		left: -300px;
		width: calc(100% + 600px);
		-webkit-border-radius: 0px 0px calc(100% + 200px) calc(100% + 200px);
		-moz-border-radius: 0px 0px calc(100% + 200px) calc(100% + 200px);
		border-radius: 0px 0px calc(100% + 200px) calc(100% + 200px);

		-webkit-box-shadow: inset 0px 5px 45px -8px rgba(0, 0, 0, 0.5);
		-moz-box-shadow: inset 0px 5px 45px -8px rgba(0, 0, 0, 0.5);
		box-shadow: inset 0px 5px 45px -8px rgba(0, 0, 0, 0.5);
	}

	#bgFooter {
		left: -100px;
		width: calc(100% + 200px);
		-webkit-border-radius: calc(100% + 100px) calc(100% + 100px) 0px 0px;
		-moz-border-radius: calc(100% + 100px) calc(100% + 100px) 0px 0px;
		border-radius: calc(100% + 100px) calc(100% + 100px) 0px 0px;
	}

	h1 {
		font-size: 1.8rem;
	}
		h1 em:after {
			bottom: -2px;
			height: 3px;
		}

	#introContent p {
		font-size: .95rem;
	}


	.mainCtaContainer {
		margin-bottom: 75px;
		width: 100%;
	}
		#textMeExamples {
			left: 0px;
			width: auto;
			max-width: 100%;
			top: calc(100% + 12px);
			-webkit-transform: translateY(0px);
			   -moz-transform: translateY(0px);
			    -ms-transform: translateY(0px);
			     -o-transform: translateY(0px);
			        transform: translateY(0px);

			-webkit-box-sizing: border-box;
			   -moz-box-sizing: border-box;
					box-sizing: border-box;
			white-space: normal;
		}
			#textMeExamples:before {
				left: 20px;
				top: auto;
				bottom: 100%;
				right: auto;
				border-left: 6px solid transparent;
				border-right: 6px solid transparent;
				border-bottom: 8px solid #00000080;
			}

	#secondaryCtaSeparator {
		display: none;
	}
		.secondaryCta {
			-webkit-box-sizing: border-box;
			   -moz-box-sizing: border-box;
					box-sizing: border-box;
			min-width: 183px;
		}


	#assistant {
		bottom: 20px;
		width: calc(100% - 20px);
	}
		#assistantContent {
		    width: 80px;
		    height: 80px;
		}

		#assistantDialog {
			-webkit-transform: translateX(0px);
			   -moz-transform: translateX(0px);
			    -ms-transform: translateX(0px);
			     -o-transform: translateX(0px);
			        transform: translateX(0px);

			left: auto;
			right: 0px;
		}
			#assistantDialog:before {
				left: auto;
				right: 35px;
			}

	#aboutMe {
		margin-bottom: 60px;
	}
		#servizi:before {
			position: static;
			line-height: 1.0;
		}

		#servizi > div:first-of-type {
			margin-top: 60px;
		}

		#servizi h2 {
			font-size: 2.5rem;
		}

		#servizi > div {
			flex-direction: column;
			margin-bottom: 90px;
		}

			#servizi > div > span:first-of-type {
				font-size: 3.4rem;
				margin-bottom: 6px;
			}

				#servizi > div > span:first-of-type:after {
				    /*bottom: 4px;
				    height: 4px;*/
				    display: none;
				}

				#servizi > div > span:first-of-type > span {
					display: none;
				}

				#servizi > div > span:first-of-type > i {
					left: 0px;
					right: 0px;
					top: -100%;
					margin: auto;

					display: flex;
					justify-content: flex-start;

					position: relative;
				}
					#servizi > div > span:first-of-type > i > img {
						width: 50px;
					}	

				#servizi > div > span:last-of-type {
					width: 100%;
					border-bottom: 1px solid #00000030;
					padding-bottom: 20px;
				}



			.servizioCta {
				margin-top: 0px;
			}
}				



/*



	MOBILE ONLY



*/
@media screen and (max-width: 700px) {


	/*TODO: CHANGE FOOTER TO COLUMN DIRECTION*/
	#footerContent {
		flex-direction: column;
		padding-top: 60px;
	}

		#footerContent > span {
			margin-bottom: 50px;
		}


	.pipelineContainer.withDisables {
		height: 210px;
	}
		.pipelineContainer.withDisables > span {
			margin-right: 0px;
			position: absolute;
			z-index: 100;
		}

		.pipelineContainer.withDisables > span.disabled {
			opacity: 1;
		}

		.pipelineContainer.withDisables > span.disabled > i:last-of-type {
			display: none;
		}
		.pipelineContainer > span > i:last-of-type {
			margin-top: 10px;
		}

			.pipelineContainer.withDisables > span.disabled > i:first-of-type {
				background-color: var(--primary-color);
			}

				.pipelineContainer.withDisables > span.disabled > i:first-of-type > img {
					opacity: .3;
				}

		.pipelineContainer.withDisables .middleDisabled {
			z-index: 5;
			left: 95px;
			-webkit-transform: scale(0.85, 0.85);
			   -moz-transform: scale(0.85, 0.85);
			    -ms-transform: scale(0.85, 0.85);
			     -o-transform: scale(0.85, 0.85);
			        transform: scale(0.85, 0.85);
		}
		.pipelineContainer.withDisables .lastDisabled {
			z-index: 1;
			left: 180px;
			-webkit-transform: scale(0.7, 0.7);
			   -moz-transform: scale(0.7, 0.7);
			    -ms-transform: scale(0.7, 0.7);
			     -o-transform: scale(0.7, 0.7);
			        transform: scale(0.7, 0.7);
		}
			.pipelineContainer.withDisables.reversed > span {
				left: 180px;
				translate: -40px 0px;
			}
			.pipelineContainer.withDisables.reversed .middleDisabled {
				left: 95px;
			}
			.pipelineContainer.withDisables.reversed .lastDisabled {
				left: 0px;
			}

			.pipelineContainer.withDisables.reversed {
				position: relative;
				left: -26px;
			}

			.pipelineContainer.withDisables:not(.reversed) .tickStatus {
				left: auto;
				right: 4px;
			}

			.pipelineContainer.scrollable {
				width: 100%;
				overflow: scroll;
				padding-bottom: 20px;
				/*scroll-snap-align: center;*/
				scroll-snap-type: x mandatory;
			}
				.pipelineContainer.scrollable > span {
					scroll-snap-align: center;
					scroll-snap-stop: normal;
				}




}