@media all and (max-width:400px){
	HTML {
		font-size: 7px;
	}
	
}
@media all and (max-width: 500px){
	HTML {
		font-size: 8px;
	}

}
@media all and (max-width:350px){
	HTML {
		font-size: 6px;
	}
}
@media all and (max-width:750px){
	HTML {
		font-size: 9px;
	}
	
}
@media all and (max-width:1250px){
	HTML {
		font-size: 10px;
	}
}
body {
	font-family: 'Montserrat', sans-serif;
	overflow-x: hidden;
}

.headerimage{
  object-fit: cover;
  min-width:100% ;
  height:100%;
}
.divImageOpacity
{
	background-color: rgba(20, 20, 20, 0.15);
	width: 100%;
	height: 100%;
	position: absolute;
}
.eros {
	position: relative;
    display: inline-block;
	height: 850px;
	width: 100%;
}
.nums{
    position: absolute;
    bottom: 25%;
    right: 25%;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	color: #FFFFFF;
}
.slogan{
	position: absolute;
    bottom: 8%;
    left: 15%;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700;
	color: #FFFFFF;
}
.tiles {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		postiion: relative;
		margin: -2.5em 0 0 -2.5em;
	}

		.tiles article {
			-moz-transition: -moz-transform 0.5s ease, opacity 0.5s ease;
			-webkit-transition: -webkit-transform 0.5s ease, opacity 0.5s ease;
			-ms-transition: -ms-transform 0.5s ease, opacity 0.5s ease;
			transition: transform 0.5s ease, opacity 0.5s ease;
			position: relative;
			width: 25rem;
			margin: 2.5em 0 0 2.5em;
		}

			.tiles article > .image {
				-moz-transition: -moz-transform 0.5s ease;
				-webkit-transition: -webkit-transform 0.5s ease;
				-ms-transition: -ms-transform 0.5s ease;
				transition: transform 0.5s ease;
				position: relative;
				display: block;
				width: 100%;
				border-radius: 4px;
				overflow: hidden;
			}

				.tiles article > .image img {
					display: block;
					width: 100%;
				}

				.tiles article > .image:before {
					pointer-events: none;
					-moz-transition: background-color 0.5s ease, opacity 0.5s ease;
					-webkit-transition: background-color 0.5s ease, opacity 0.5s ease;
					-ms-transition: background-color 0.5s ease, opacity 0.5s ease;
					transition: background-color 0.5s ease, opacity 0.5s ease;
					content: '';
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					opacity: 1.0;
					z-index: 1;
					opacity: 0;
				}

				.tiles article > .image:after {
					pointer-events: none;
					-moz-transition: opacity 0.5s ease;
					-webkit-transition: opacity 0.5s ease;
					-ms-transition: opacity 0.5s ease;
					transition: opacity 0.5s ease;
					content: '';
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cstyle%3Eline %7B stroke-width: 0.25px%3B stroke: %23ffffff%3B %7D%3C/style%3E%3Cline x1='0' y1='0' x2='100' y2='100' /%3E%3Cline x1='100' y1='0' x2='0' y2='100' /%3E%3C/svg%3E");
					background-position: center;
					background-repeat: no-repeat;
					background-size: 100% 100%;
					opacity: 0;
					z-index: 2;
				}

			.tiles article > .cardInfo {
				display: -moz-flex;
				display: -webkit-flex;
				display: -ms-flex;
				display: flex;
				-moz-flex-direction: column;
				-webkit-flex-direction: column;
				-ms-flex-direction: column;
				flex-direction: column;
				-moz-align-items: center;
				-webkit-align-items: center;
				-ms-align-items: center;
				align-items: center;
				-moz-justify-content: center;
				-webkit-justify-content: center;
				-ms-justify-content: center;
				justify-content: center;
				-moz-transition: background-color 0.5s ease, -moz-transform 0.5s ease;
				-webkit-transition: background-color 0.5s ease, -webkit-transform 0.5s ease;
				-ms-transition: background-color 0.5s ease, -ms-transform 0.5s ease;
				transition: background-color 0.5s ease, transform 0.5s ease;
				position: absolute;
				top: 14px;
				left: 0;
				width: 100%;
				height: 80%;
				padding: 1em;
				border-radius: 4px;
				border-bottom: 0;
				color: #4c441e;
				text-align: center;
				text-decoration: none;
				z-index: 3;
			}

				.tiles article > .cardInfo > :last-child {
					margin: 0;
				}

				.tiles article > .cardInfo:hover {
					color: #4c441e !important;
				}

				.tiles article > .cardInfo h2 {
					margin: 0;
				}

				.tiles article > .cardInfo .content {
					-moz-transition: max-height 0.5s ease, opacity 0.5s ease;
					-webkit-transition: max-height 0.5s ease, opacity 0.5s ease;
					-ms-transition: max-height 0.5s ease, opacity 0.5s ease;
					transition: max-height 0.5s ease, opacity 0.5s ease;
					width: 100%;
					max-height: 0;
					line-height: 1.5;
					margin-top: 0.35em;
					opacity: 0;
				}

				.tiles article > .cardInfo .content > p {
					padding: 0px 1em;
				}

				.tiles article > .cardInfo .content > :last-child {
					margin-bottom: 0;
				}

			.tiles article.style > .image:before {
				background-color: #E4E1C8;
				margin: 2%;
				border-radius: 5%;
				padding: 10%;
				width: 94%;
  				height: 91%;
				top: 0px;
			}

			body:not(.is-touch) .tiles article:hover > .image {
				-moz-transform: scale(1);
				-webkit-transform: scale(1);
				-ms-transform: scale(1);
				transform: scale(1);
			}

				body:not(.is-touch) .tiles article:hover > .image:before {
					background-color: #E4E1C8;
					opacity: 1;
				}

				body:not(.is-touch) .tiles article:hover > .image:after {
					opacity: 0;
				}

			body:not(.is-touch) .tiles article:hover .content {
				max-height: 15em;
				opacity: 1;
			}

		* + .tiles {
			margin-top: 2em;
		}

		body.is-preload .tiles article {
			-moz-transform: scale(0.9);
			-webkit-transform: scale(0.9);
			-ms-transform: scale(0.9);
			transform: scale(0.9);
			opacity: 0;
		}

		body.is-touch .tiles article .content {
			max-height: 15em;
			opacity: 1;
		}

		@media screen and (max-width: 1280px) {

			.tiles {
				margin: -1.25em 0 0 -1.25em;
			}

				.tiles article {
					width: calc(33.33333% - 1.25em);
					margin: 1.25em 0 0 1.25em;
				}

		}

		@media screen and (max-width: 980px) {

			.tiles {
				margin: -2.5em 0 0 -2.5em;
			}

				.tiles article {
					width: calc(50% - 2.5em);
					margin: 2.5em 0 0 2.5em;
				}

		}

		@media screen and (max-width: 736px) {

			.tiles {
				margin: -1.25em 0 0 -1.25em;
			}

				.tiles article {
					width: calc(50% - 1.25em);
					margin: 1.25em 0 0 1.25em;
				}

					.tiles article:hover > .image {
						-moz-transform: scale(1.0);
						-webkit-transform: scale(1.0);
						-ms-transform: scale(1.0);
						transform: scale(1.0);
					}

		}

		@media screen and (max-width: 480px) {

			.tiles {
				margin: 0;
			}

				.tiles article {
					width: 100%;
					margin: 1.25em 0 0 0;
				}

		}
.tiles2 {
		display: -moz-flex;
		display: -webkit-flex;
		display: -ms-flex;
		display: flex;
		-moz-flex-wrap: wrap;
		-webkit-flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		flex-wrap: wrap;
		position: relative;
		margin: 0;
	}

		.tiles2 article {
			-moz-transition: -moz-transform 0.5s ease, opacity 0.5s ease;
			-webkit-transition: -webkit-transform 0.5s ease, opacity 0.5s ease;
			-ms-transition: -ms-transform 0.5s ease, opacity 0.5s ease;
			transition: transform 0.5s ease, opacity 0.5s ease;
			position: relative;
			width: 100%;
			margin: auto;
		}

			.tiles2 article > .image {
				-moz-transition: -moz-transform 0.5s ease;
				-webkit-transition: -webkit-transform 0.5s ease;
				-ms-transition: -ms-transform 0.5s ease;
				transition: transform 0.5s ease;
				position: relative;
				display: block;
				width: 100%;
				border-radius: 4px;
				overflow: hidden;
			}

				.tiles2 article > .image img {
					display: block;
					width: 100%;
				}

				.tiles2 article > .image:before {
					pointer-events: none;
					-moz-transition: background-color 0.5s ease, opacity 0.5s ease;
					-webkit-transition: background-color 0.5s ease, opacity 0.5s ease;
					-ms-transition: background-color 0.5s ease, opacity 0.5s ease;
					transition: background-color 0.5s ease, opacity 0.5s ease;
					content: '';
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					opacity: 1.0;
					z-index: 1;
					opacity: 0;
				}

				.tiles2 article > .image:after {
					pointer-events: none;
					-moz-transition: opacity 0.5s ease;
					-webkit-transition: opacity 0.5s ease;
					-ms-transition: opacity 0.5s ease;
					transition: opacity 0.5s ease;
					content: '';
					display: block;
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					background-position: center;
					background-repeat: no-repeat;
					background-size: 100% 100%;
					opacity: 0;
					z-index: 2;
				}

			.tiles2 article > .showInfo {
				display: -moz-flex;
				display: -webkit-flex;
				display: -ms-flex;
				display: flex;
				-moz-flex-direction: column;
				-webkit-flex-direction: column;
				-ms-flex-direction: column;
				flex-direction: column;
				-moz-align-items: center;
				-webkit-align-items: center;
				-ms-align-items: center;
				align-items: center;
				-moz-justify-content: center;
				-webkit-justify-content: center;
				-ms-justify-content: center;
				justify-content: center;
				-moz-transition: background-color 0.5s ease, -moz-transform 0.5s ease;
				-webkit-transition: background-color 0.5s ease, -webkit-transform 0.5s ease;
				-ms-transition: background-color 0.5s ease, -ms-transform 0.5s ease;
				transition: background-color 0.5s ease, transform 0.5s ease;
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				padding: 1em;
				border-radius: 4px;
				border-bottom: 0;
				color: #4c441e;
				text-align: center;
				text-decoration: none;
				z-index: 3;
			}

				.tiles2 article > .showInfo > :last-child {
					margin: 0;
				}

				.tiles2 article > .showInfo:hover {
					color: #4c441e !important;
				}

				.tiles2 article > .showInfo h2 {
					margin: 0;
				}

				.tiles2 article > .showInfo .content {
					-moz-transition: max-height 0.5s ease, opacity 0.5s ease;
					-webkit-transition: max-height 0.5s ease, opacity 0.5s ease;
					-ms-transition: max-height 0.5s ease, opacity 0.5s ease;
					transition: max-height 0.5s ease, opacity 0.5s ease;
					width: 100%;
					max-height: 0;
					line-height: 1.5;
					margin-top: 0.35em;
					opacity: 0;
				}

					.tiles2 article > .showInfo .content > :last-child {
						margin-bottom: 0;
					}

				.tiles2 article.styleArticle > .image:before 
				{
					background-color: #fff;
				}

			body:not(.is-touch) .tiles2 article:hover > .image {
				-moz-transform: scale(1);
				-webkit-transform: scale(1);
				-ms-transform: scale(1);
				transform: scale(1);
			}

				body:not(.is-touch) .tiles2 article:hover > .image:before {
					background-color: #fff;
					opacity: 1;
				}

				body:not(.is-touch) .tiles2 article:hover > .image:after {
					opacity: 0;
				}

			body:not(.is-touch) .tiles2 article:hover .content {
				max-height: 15em;
				opacity: 1;
			}

		* + .tiles2 {
			margin-top: 2em;
		}

		body.is-preload .tiles2 article {
			-moz-transform: scale(0.9);
			-webkit-transform: scale(0.9);
			-ms-transform: scale(0.9);
			transform: scale(0.9);
			opacity: 0;
		}

		body.is-touch .tiles2 article .content {
			max-height: 15em;
			opacity: 1;
		}

		@media screen and (max-width: 1280px) {

			.tiles2 {
				margin: -1.25em 0 0 -1.25em;
			}

				.tiles2 article {
					width: calc(33.33333% - 1.25em);
					margin: 1.25em 0 0 1.25em;
				}

		}

		@media screen and (max-width: 980px) {

			.tiles2 {
				margin: -2.5em 0 0 -2.5em;
			}

				.tiles2 article {
					width: calc(50% - 2.5em);
					margin: 2.5em 0 0 2.5em;
				}

		}

		@media screen and (max-width: 736px) {

			.tiles2 {
				margin: -1.25em 0 0 -1.25em;
			}

				.tiles2 article {
					width: calc(50% - 1.25em);
					margin: 1.25em 0 0 1.25em;
				}

					.tiles2 article:hover > .image {
						-moz-transform: scale(1.0);
						-webkit-transform: scale(1.0);
						-ms-transform: scale(1.0);
						transform: scale(1.0);
					}

		}

		@media screen and (max-width: 480px) {

			.tiles2 {
				margin: 0;
			}

				.tiles2 article {
					width: 100%;
					margin: 1.25em 0 0 0;
				}

		}
.cardtelefono{
	font-family: Montserrat, sans-serif;
	color: #9b8f59;
}

/* Movil */
@media only screen and (max-width: 500px) 
{
	body:not(.is-touch) .tiles article:hover > .image:before 
	{
		background-color: #E4E1C8;
		opacity: 0;
	}

	.tiles article
	{
		margin: 0px 0px 20rem 0px;
	}

	.tiles article > .cardInfo
	{
		display: inline-block;
		background-color: #E4E1C8;
		width: 93%;
		margin: 25rem 1rem 1rem 1rem;
		border-radius: 0px 0px 10px 10px;
		height: auto;
		box-shadow: 6px 12px 6px 0 rgba(20, 20, 20, 0.4);
	}

    .tiles article > .cardInfo .content 
	{
		opacity: 1;
		max-height: none;
		min-height: 180px;
	}

	body:not(.is-touch) .tiles2 article:hover > .image:before 
	{
		opacity: 0;
	}

	.tiles2 article > .showInfo .content 
	{
		display: none;
	}

	.movileBtn
	{
		display: block !important;
		text-align: center;
		background-color: white;
		width: 94.8%;
		margin: 0px 7px;
		border-radius: 0px 0px 10px 10px;
		box-shadow: 2px 3px 4px 0 rgba(20, 20, 20, 0.5);
		margin-top: -25px;
		z-index: 999 !important;
		position: relative;
		padding: 8px;
	}

}