body{
  background: #fff;
  color: #020202;
  font-family: 'Poppins', sans-serif;
  /* -moz-font-feature-settings: "kern";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; */
}
p{
  font-size: .9rem;
  font-weight: 300;
}
a{
  text-decoration: none;
  /* cursor: pointer!important; */
}
.pr{
  position: relative;
}
section{
  padding: 5rem;
}
ul li{
  list-style: none;
}
.form-control:focus{
  box-shadow: none;
}
textarea:focus-visible {
  border: none;
  outline: none;
  border-bottom: 1px solid #000;
}
.form-control{
  display: inline-block;
  width: auto;
  border: none;
  border-radius: 0;
  border-bottom: 1px solid #dee2e6;
}
form .title-form{
  font-family: 'sandblastregular';
  display: block;
  margin: 2.5rem auto;
  font-size: 1.2rem;
  letter-spacing: .1rem;
}
form .button{
  margin-left: auto;
  display: block;
  margin-top: 2rem;
}
.form-label{
  text-transform: uppercase;
  font-weight: 300;
  font-size: .8rem;
}
.link-master{
  color: #879b75;
  display: inline-block;
  text-transform: uppercase;
  margin-left: 2rem;
}
section.amenidades .link-master{
  color: #fff;
  text-align: center;
  padding-left: 30%;
  margin-top: 2rem;
}
.link-master::after{
  content: "";
  display: block;
  height: 1px;
  background: #879b75;
  width: 100%;
}
section.amenidades .link-master::after{
  background: #fff;
}
/* NAVBAR */
nav{
  position: relative;
}
nav.navbar{
  position: relative;
  z-index: 999;
  background: transparent;
  padding: 2.5rem 0;
}
nav .navbar-brand{
  position: absolute;
  left: 10%;
}
nav .navbar-brand img{
  max-width: 18rem;
}
.nav-link{
  color: #020202;
  text-transform: uppercase;
  font-size: 1rem;
  letter-spacing: .2rem;
}
.sm-show{
  display: none;
}
nav.navbar .nav-item{
  display: inline-block;
  font-family: 'sandblastregular';
}
.navbar-nav{
  position: relative;
  display: block;
  width: 100%;
  text-align: right;
}
.navbar-nav .nav-link.active,.nav-link:focus, .nav-link:hover{
  text-decoration: underline;
}
.navbar-nav .nav-link.active::after,.nav-link:focus::after, .nav-link:hover::after{
  content: '';
  width: 100%;
  height: 2px;
  background: #fff;
  display: block;
}
/* BUTTON */
.button {
	pointer-events: auto;
	cursor: pointer;
	background: #fff;
	border: none;
  border-radius: .5rem;
	padding: 1.5rem 3rem;
	margin: 0;
	font-size: .8rem;
	position: relative;
	display: inline-block;
}

.button::before,
.button::after {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.button--hyperion {
  border-radius: 20px;
  padding: 0.5rem 2rem;
	border: 2px solid #020202;
	overflow: hidden;
  color: #fff;
}

.button--hyperion span {
	display: block;
	position: relative;
  /* color: #fff; */
}

.button--hyperion > span {
	overflow: hidden;
}

.button--hyperion > span > span {
	overflow: hidden;
	mix-blend-mode: difference;
}
.button--hyperion:hover span{
  color: #000;
}
.button--hyperion:hover{
  border: 1px solid #000;
}
.button--hyperion:hover > span > span {
	animation: MoveUpInitial 0.2s forwards, MoveUpEnd 0.2s forwards 0.2s;
}

@keyframes MoveUpInitial {
	to {
		transform: translate3d(0,-105%,0);
	}
}

@keyframes MoveUpEnd {
	from {
		transform: translate3d(0,100%,0);
	}
	to {
		transform: translate3d(0,0,0);
	}
}
.button--hyperion::before {
	content: '';
	background: #020202;
	transition: transform 0.3s cubic-bezier(0.7, 0, 0.2, 1);
	transform-origin: 100% 50%;
}
.button--hyperion:hover::before {
	transform: scale3d(0,1,1);
	transform-origin: 0% 50%;
}
/* HEADER HOME */
main{
  overflow: hidden;
}
main h1{
  font-family: 'emilearegular';
  margin-bottom: 1rem;
}
main h1::after{
  content: 'desde $8,850,000 mxn';
  font-family: 'sandblastregular';
  display: inline-block;
  text-transform: uppercase;
  font-size: 1.2rem;
  margin-left: 1rem;
  margin-top: .5rem;
}
main .info-main{
  max-width: 68%;
  text-align: justify;
  margin-left: 20%;
}
main video{
  max-width: 100%;
}
section.frase{
  padding: 0;
  overflow: hidden;
}
section.frase .flor{
  max-width: 80%;
  margin-right: auto;
}
section.frase .cont-frase{
  max-width: 80%;
  position: relative;
}
section.frase .cont-frase::before{
  content: ' " ';
  position: absolute;
  top: 0;
  left: -20%;
  font-size: 32rem;
  line-height: 90%;
  font-family: 'emilearegular';
  color: #b4b1b1;
}
section.frase .cont-frase span{
  font-family: 'emilearegular';
  color: #b4b1b1;
  font-size: 40rem;
  position: absolute;
}
section.frase .cont-frase p{
  display: inline-block;
  max-width: 80%;
  position: relative;
}
section.informacion .cont-title h3{
  font-family: 'emilearegular';
  font-size: 6rem;
  text-transform: uppercase;
  position: relative;
  display: inline-block;
  margin-bottom: 3rem;
}
section.informacion .cont-title h3::after{
  content: 'Un proyecto único';
  font-family: 'sandblastregular';
  display: inline-block;
  text-transform: uppercase;
  font-size: 1.2rem;
  position: absolute;
  bottom: -1rem;
  right: 0;
}
section.informacion .cont-title{
  margin-top: -2rem;
  margin-left: -20%;
}
section.informacion .cont-title span{
  display: block;
  text-align: right;
}
section.informacion .cont-btn-mapa{
  text-align: center;
  margin-top: 5rem;
}
section.informacion p{
  padding-left: 20%;
}
section.informacion .cont-mapa{
  position: relative;
}
section.informacion .cont-mapa .cont-btn-mapa{
  position: absolute;
  left: 0;
  bottom: 0;
}
section.informacion .mapa{
  display: block;
  max-width: 80%;
  margin-left: auto;
}
section.informacion .txt-lotes{
  margin: 2rem auto 0 auto;
}
section.informacion .txt-lotes span,section.informacion .txt-lotes-2 span{
  font-family: 'emilearegular';
  text-transform: uppercase;
  font-size: 7rem;
  display: inline-block;
  position: relative;
}
section.informacion .txt-lotes-2 span{
  font-size: 9rem;
}
section.informacion .txt-lotes span::after{
  content: 'En San Miguel de Allende';
  font-family: 'sandblastregular';
  letter-spacing: .1rem;
  display: inline-block;
  text-transform: uppercase;
  font-size: 1.2rem;
  position: absolute;
  bottom: 40%;
  right: -80%;
}
section.informacion .txt-lotes-2 span::after{
  content: 'Lotes privados EN SAN MIGUEL DE ALLENDE';
  font-family: 'sandblastregular';
  letter-spacing: .1rem;
  display: inline-block;
  text-transform: uppercase;
  font-size: 1.2rem;
  position: absolute;
  bottom: 30%;
  max-width: 100%;
  right: -110%;
}
section.informacion .cont-tamano .texto{
  display: block;
  font-size: .8rem;
  font-weight: 300;
}
section.informacion .cont-tamano .numero span{
  font-weight: 300;
  font-size: 2.5rem;
}
section.galeria{
  padding: 0;
  overflow: hidden;
}
section.amenidades{
  background-color: #879b75;
}
section.amenidades .cont-btn{
  text-align: center;
  display: block;
  margin: 4rem auto;
}
section.amenidades .title{
  font-family: 'emilearegular';
  font-size: 7rem;
  line-height: 4.5rem;
  text-align: center;
  display: block;
  text-transform: uppercase;
  position: relative;
}
section.amenidades .title::after{
  content: 'VIVE UN ESTILO DE VIDA ÚNICO EN SAN MIGUEL DE ALLENDE';
  font-family: 'sandblastregular';
  letter-spacing: .1rem;
  display: block;
  text-transform: uppercase;
  font-size: 1.2rem;
}
section.amenidades p{
  max-width: 60%;
  margin: 2rem auto 4rem auto;
}
section.amenidades ul{
  padding-left: 30%;
}
section.amenidades ul li{
  font-family: 'sandblastregular';
  font-size: 1.6rem;
  letter-spacing: .1rem;
  text-transform: uppercase;
}
section.amenidades ul li span{
  font-size: .7rem;
}
section.masterplan{
  padding: 0;
  overflow: hidden;
  background-image: url('../img/masterplan.webp');
  background-repeat: no-repeat;
  background-size: contain;
  transition: all .5s ease;
}
section.masterplan:hover{
  background-image: url('../img/masterplan-h.webp');
}
section.masterplan img{
  opacity: 0;
}
section.contacto{
  padding-right: 0;
  overflow: hidden;
}
section.contacto .title-sma{
  position: relative;
}
section.contacto .sma{
  display: block;
  padding-left: 10%;
  font-size: 6.8rem;
  line-height: 7rem;
  font-family: 'emilearegular';
  text-transform: uppercase;
}
section.contacto .title-sma .flores-2{
  position: absolute;
  right: 0;
  top: 0;
  max-width: 30%;
  display: block;
}
section.contacto video{
  max-width: 100%;
  margin-top: 5rem;
  padding-left: 20%;
  padding-right: 15%;
}
section.contacto .cont-info-contacto{
  max-width: 80%;
}
section.contacto .cont-info-contacto p{
  max-width: 80%;
  text-align: justify;
}
footer{
  padding: 5rem;
  background: #d6d5d4;
}
footer span{
  display: block;
  text-align: center;
  font-weight:300;
  font-size: .8rem;
}
footer span a{
  color: #020202;
  font-family: 'sandblastregular';
  text-decoration: underline;
  letter-spacing: .1rem;
  font-size: 1.1rem;
}
footer img{
  max-width: 15rem;
  display: block;
  margin: auto;
}
main.gracias{
  height: 80vh;
}
.h-100{
  height: 100%;
}