/************************************** INTENDENTE **************************************/

#intendente {
	background: #17A9BA;
	height: 470px;
	width: 100%;
	margin: auto;
	padding: 37px;
	margin-top: 20px !important;
	box-sizing: border-box;
	display: flex;
}

	#intendente .left {
		position: relative;
		display: flex;
		width: 60%;
	}

		#intendente .left .icons {
			position: relative;
			display: flex;
		}

			#intendente .left .icons .logo {
				width: auto;
				height: 320px;
			}

			#intendente .left .icons p {
				letter-spacing: 1.5px;
				position: absolute;
				bottom: 33px;
				background: #2b4378;
				color: #fff;
				padding: 7px 10px;
				width: 300px;
				text-align: center;
				text-transform: uppercase;
				font-family: 'Platform-Medium';
				font-size: 15.5px;
			}

			#intendente .left .icons ul {
				justify-content: center;
				position: absolute;
				bottom: -18px;
				background: #fff;
				list-style: none;
				padding: 9px 20px;
				width: 280px;
				display: flex;
				justify-content: space-around;
			}

				#intendente .left .icons ul li a {
					text-decoration: none;
				}

					#intendente .left .icons ul li a i {
						font-size: 20px;
						border-radius: 100%;
						background: #2b4378;
						color: #fff;
						padding: 8px;
						width: 22px;
						display: flex;
						justify-content: center;
						text-decoration: none !important;
					}

		#intendente .left .gestion {
			position: relative;
			margin-left: 30px;
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: space-around;
			margin: auto;
		}

			#intendente .left .gestion p {
				font-size: 30px;
				color: #fff;
				letter-spacing: 1.5px;
				font-family: 'Platform-Medium';
				margin: auto;
			}

			#intendente .left .gestion i.fas.fa-chevron-down {
				font-size: 20px;
				color: #fff;
				padding: 30px 0px 80px 0px;
			}

			#intendente .left .gestion i.fas.fa-chevron-right {
				display: none;
			}

			#intendente .left .gestion .button.gestion {
				background: #fff;
				padding: 13px 20px;
				margin-left: 0px;
				border: 4px double #17a9ba;
			}

				#intendente .left .gestion .button.gestion a {
					text-decoration: none;
				}

			#intendente .left .gestion p.top-text {
				font-size: 20px;
				color: #17a9ba;
				letter-spacing: 1px;
				font-family: 'Platform-Regular';
				margin: auto;
			}

			#intendente .left .gestion p.bottom-text {
				font-size: 20px;
				color: #2b4378;
				letter-spacing: 1px;
				font-family: 'Platform-Medium';
				text-transform: uppercase;
				margin: auto;
			}

	#intendente .right {
		position: relative;
		display: flex;
		width: 40%;
	}

	#intendente .video {
		display: table;
		width: 100%;
		height: 400px;
		margin: 0;
	}

		#intendente .video .container {
			display: table-cell;
			vertical-align: middle;
		}

			#intendente .video .container .inner {
				margin-left: auto;
				margin-right: auto;
				width: 100%;
			}

		#intendente .video .inner .img-container {
			width: 100%;
		}

			#intendente .video .inner .img-container img {
				width: 100%;
			}

		#intendente .video .inner .video-container {
			width: 100%;
			display: none;
		}

			#intendente .video .inner .video-container video {
				width: 100%;
			}

		#intendente .video .img-container .button {
			content: '';
			position: absolute;
			left: 50%;
			top: 50%;
			z-index: 10;
			width: 100px;
			height: 100px;
			margin-top: -50px;
			margin-left: -50px;
			background: url(/assets/images/bt-video.png) no-repeat center center;
			background-size: 100px auto;
			z-index: 50;
			padding: 0px;
			border: none;
			box-shadow: none;
		}

		#intendente .video a.start {
			width: 100%;
			left: 0;
			top: 0;
			z-index: 60;
			display: block;
		}


@media screen and (max-width: 1090px) {
	#intendente {
		height: auto;
		padding-left: 6px;
		margin-top:20px;
	}

		#intendente .left {
			position: relative;
			display: flex;
			width: 45%;
			flex-direction: column-reverse;
			align-items: center;
		}

			#intendente .left .gestion i.fas.fa-chevron-down {
				display: none;
			}

			#intendente .left .gestion p {
				font-size: 23px;
				letter-spacing: 1px;
				width: 100px;
			}

				#intendente .left .gestion p b {
					font-size: 28px;
					line-height: 0px;
					letter-spacing: 2px;
				}

		#intendente .right {
			width: 55%;
			align-items: center;
		}

		#intendente .left .icons {
			margin-top: 15px;
		}

			#intendente .left .icons .logo {
				width: auto;
				height: 300px;
			}

			#intendente .left .icons ul {
				width: 260px;
			}

			#intendente .left .icons p {
				width: 280px;
			}

		#intendente .left .gestion {
			flex-direction: row;
			margin: 0px;
		}

			#intendente .left .gestion .button.gestion {
				padding: 7px 5px;
				margin-left: 48px;
				width: 135px;
			}

			#intendente .left .gestion p.top-text {
				font-size: 16px;
				letter-spacing: 0.5px;
				width: 140px !important;
				padding-left: 8px;
			}

			#intendente .left .gestion p.bottom-text {
				font-size: 18px;
				letter-spacing: 0.5px;
				text-align: center;
			}

		#intendente .video {
			display: flex;
			width: 100%;
			height: 400px;
			margin: auto;
			justify-content: center;
		}
}

@media screen and (max-width: 860px) {
	#intendente {
		display: flex;
		flex-direction: column;
		align-items: center;
		padding-left: 37px;
		margin-top:20px;
	}

		#intendente .left {
			width: 70%;
		}

		#intendente .right {
			width: 100%;
			margin-top: 30px;
		}

		#intendente .left .gestion {
			width: 100%;
		}

			#intendente .left .gestion p {
				width: 100%;
			}

				#intendente .left .gestion p b {
					font-size: 26px;
				}

			#intendente .left .gestion .button.gestion {
				margin-left: 10px;
				width: 50%;
			}

		#intendente .left .icons {
			margin-top: 25px;
		}

		#intendente .left .gestion i.fas.fa-chevron-right {
			display: block !important;
			color: #fff;
		}
}

@media screen and (max-width: 680px) {
	#intendente .left {
		width: 90%;
	}
}