*{
	padding: 0;
	margin: 0;
}


#responsive{
	display: none;
}

.menu{
	height: 80px;
	width: 100%;
	display: grid;
	grid-template: 72px 6px / 30% 70%;
	z-index: 10000;
	top: 0;
	position: sticky;
	background-color: white;
}

.links-responsive{
	display: none;
}

/*botón para responsive*/
.boton-menu{
	grid-area: 1 / 2;
	height: 40px;
	width: 40px;
	display: none;
	grid-template: repeat(7, 1fr) / 2px 1fr 2px;
	align-self: center;
	justify-self: end;
	margin-right: 20px;
}

.boton-menu span{
	background: #b23f2d;
}

.uno{
	grid-area: 2 / 2;
}

.dos{
	grid-area: 4 / 2;
}

.tres{
	grid-area: 6 / 2;
}
/*botón para responsive FIN*/

/*barra de Menú normal*/
.menu img{
	grid-area: 1 / 1;
	height: 90%;
	align-self: center;
}

.links{
	grid-area: 1 / 2;
	display: flex;
	flex-direction: row;
	align-self: center;
	justify-self: end;
	margin-right: 20px;
}

.links a{
	margin: 0px 10px;
	color: black;
	text-decoration: none;
	font-family: 'Questrial';
}

.links a:hover{
	color: #b23f2d;
	font-weight: bold;
	text-decoration: none;
}

.degradado{
	grid-area: 2 / span 2;
	background: linear-gradient(to right, #e19a57, #b23f2d);
	box-shadow: 0px 2px 5px rgba(0,0,0,.7);
	z-index: 10000;
}
/*barra de Menú normal FIN*/


/*menú Responsive*/
@media screen and (min-width: 807px){
	.links{
		color: black;
	}
}

@media screen and (max-width: 806px){
	.links a{
		font-size: 10pt;
		color: black;
	}
}

@media screen and (max-width: 700px){
	.menu{
		grid-template: 72px 6px 200px / 30% 70%;
	}
	
	.menu div{
		display: none;
	}

	.links{
		display: none;
	}

	.links-responsive{	
		grid-area: 3 / span 2;
		align-self: start;
		justify-self: center;
		display: flex;
		flex-direction: column;
		background-color: #b23f2d;
		align-items: center;
		justify-content: center;
		z-index: 9000;
		width: 100%;
		padding: 10px 0px;
		margin-right: 0;
	}


	.boton-menu{
		display: grid;
	}


	.links-responsive a{
		text-align: center;
		display: block;
		color: white;
		padding: 10px 0px;
	}

	.links-responsive a:hover{
		color:white;
	}
}
/*menú Responsive FIN*/


/*cambio del carrusel*/
@media screen and (max-width: 425px){
	#responsive{
		display: block;
		margin-top: 0px;
	}

		#normal{
		display: none;
	}
}
/*cambio del carrusel FIN*/

/*Textos Iniciales*/
.intro{
	margin-top: 50px;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.intro h1{
	font-family: 'the_second_choiceregular';
	color: #b23f2d;
	margin-top: 25px;
}

.subrayado{
	display: flex;
	flex-direction: row;
}

.underline{
	height: 3.5px;
	margin-top: -15px;
	background: linear-gradient(to right, #e19a57, #b23f2d);
}

.subrayado :nth-child(1){
		width: 210px;
		margin-left: -7px;
		margin-right: 20px;
}

.subrayado :nth-child(2){
		width: 180px;
}

.texto p{
	grid-area: 1 / 2;
	font-size: 23px;
	margin: 40px 0px;
	line-height: 30px;
	text-align: justify;
	text-align-last: center;
	font-family: 'Questrial';
}

.texto{
	display: grid;
	grid-template: 100% / 25% 50% 25%;
}

.texto div{
	background: #e19a57;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	align-self: center;
	justify-self: center;
}

.texto:nth-child(1){
	grid-area: 1 / 1;
	align-self: center;
	justify-self: center;
}

.texto:nth-child(3){
	grid-area: 1 / 3;
	align-self: center;
	justify-self: center;
}
/*Textos Iniciales FIN*/

/*Textos Iniciales Responsive*/
@media screen and (max-width: 860px){
	.intro h1{
		font-family: 'the_second_choiceregular';
		color: #b23f2d;
		margin-top: 25px;
		font-size: 20pt;
	}

	.subrayado{
		display: flex;
		flex-direction: row;
	}

	.underline{
		height: 3.5px;
		margin-top: -9px;
		background: linear-gradient(to right, #e19a57, #b23f2d);
	}

	.subrayado :nth-child(1){
			width: 150px;
			margin-left: -10px;
			margin-right: 20px;
	}

	.subrayado :nth-child(2){
			width: 120px;
	}

	.texto p{
		font-size: 12pt;
		line-height: 20px;
	}
}
/*Textos Iniciales Responsive FIN*/

/*Facebook*/
.facebook{
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	/*padding-bottom: 7%;*/
	padding-top: 7%;
	transition: 0.5s;
}


.marco-fb{
    border-color: #b23f2d;
    border-width: 5px;
    border-style: solid;
    height: 300px;
}

.facebook h2{
	font-family:'the_second_choiceregular';
	color: #b23f2d;
}

.carousel-item div{
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;

}

.facebook img{
	width: 370px;
	margin: 20px 20px;
}



.facebook > .linea-1{
	margin-bottom: 50px;
}

.facebook iframe{
	margin: 20px 20px;
}

@media screen and (max-width: 1200px){
	.facebook img{
		width: 300px;
	}
}

@media screen and (max-width: 1059px){
	.facebook{
		padding-top: 14%
	}

	.marco-fb{
		width: 620px;
		height: 800px;

	}	

	.carousel-item div{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	}
}


@media screen and (max-width: 768px){
	.facebook > #normal{
		display: flex;
		width: 300px;
	}

	.facebook{
		padding-top: 20%;
	}

	.facebook h2{
		text-align:center;
	}

	.carousel-item div{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	}

	.marco-fb{
	    width: 315px;
	    height: 640px;
	}

	.facebook img{
	width: 300px;
	margin: 20px 20px;
}


}
/*facebook FIN*/

/*Videos*/

.videos{

	display: flex;
	flex-flow: wrap;
	align-items: space-around;
	justify-content: space-around;
}
	.videos iframe{
		margin: 10px 10px;
		border: solid #e19a57 4px ;
	}

@media screen and (max-width: 1200px){
	.videos{
		height: 300px;
	}
}

@media screen and (max-width: 600px){
	.videos{
		width: 300px;
	}
	.videos video{
		width: 300px;
	}
}

@media screen and (max-width: 320px){
	.videos{
		width: 300px;
	}
}
/*Videos FIN*/

/*Contactos*/
.contacto{
	padding-top: 5.5%;
    display: grid;
    grid-template: 600px/ 1fr 1fr;
    grid-row-gap: 25px;
    min-height: 100vh;
}

.email{
	grid-area: 1 / 1;
	background: linear-gradient(to right, #e19a57, #b23f2d);
	padding: 6% 0% 0% 6%;
	color: white;
	display: flex;
	flex-direction: column;
	justify-content: start;
}

.mark{
	height: 2px;
	width: 50%;
	background: white;
	margin-left: -6%;
	border-color: transparent;
}

.email input{
	width: 80%;
	border-radius: 3px;
	border-color: transparent;
}

.email :nth-child(12){
	padding-bottom: 10%;
}

.email h2, .email h5{
	font-family: 'the_second_choiceregular';
	line-height: 80%;
}

.email h4{
	font-family: 'Questrial';
	margin-top: 10px;
	font-size: 12pt;
}

.email h2{
	margin-top: 5%;
}

.email button{
	width: 15%;
	margin-top: 20px;
	border-radius: 5px;
	background-color: white;
	font-family: 'the_second_choiceregular';
	font-weight: bold;
	color: #b23f2d;
	border-color: transparent;

}

.info{
	grid-area: 1 / 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center; 
}

.info h2{
	font-family: 'bensonoldstyleoptiregular';
	font-style: italic;
	color: #b23f2d;
	margin-top: -10px;
}

.info p{
	text-align-last: center;
	font-family: 'Questrial'; 
}

.linea-1{
	width: 300px;
	height: 3.5px;
	background: linear-gradient(to right, #e19a57, #b23f2d);
}

.maps{
	margin-top: 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.normal{
	margin: 30px 0px;
	border-color: #e19a57;
	border-width: 5px;
}


.maps h2{
	font-family: 'the_second_choiceregular';
	color: #b23f2d;
}

.linea-2{
	width: 300px;
	height: 3.5px;
	background: linear-gradient(to right, #e19a57, #b23f2d);
}

.resp, .med{
	display: none;
}

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

	.med{
		display: block;
		margin: 30px 0px;
		border-color: #e19a57;
		border-width: 5px;
	}

	.normal{
		display: none;
	}
}

@media screen and (max-width: 739px){
	.contacto{
	display: flex;
	flex-direction: column;
	height: 1200px;
	padding-top: 120px;
        margin-top: 40vh
	}

	.email{
		order: 2;
		height: 650px;
	}

	.info{
	margin-bottom: 30px
	}

	.med, .normal{
		display: none;
	}

	.resp{
		display: block;
		margin: 30px 0px;
		border-color: #e19a57;
		border-width: 5px;
	}
}
/*Contactos FIN*/


footer{
	background-color: #b23f2d;
	color: white;
	font-family: 'Questrial';
	height: 40px;
	display: flex;
	flex-direction: row;
	justify-content: space-around;
}

footer p{
	justify-self: flex-start;
		padding-top: 12px; 
		padding-left: 20px;
		font-size: 8pt;
}

footer div{
	justify-self: flex-end;
	align-self: center;
}

@media screen and (max-width: 623px){
	footer{
		height: 90px;
		flex-direction: column;
		justify-content: center;
	}


footer p{
	align-self: center;
		font-size: 8pt;
		text-align: center;
		padding:5px 0px 0px 0px;
		order: 2;
}

footer div{
	align-self: center;
}

}


/*ESTILOS ABOUT US*/

*{
	padding:0;
	margin:0;
}

.grand{
	display: grid;
	grid-template: 100% / 100%;
}

.fondo{
	height: 100%;
	width: 100%;
	grid-area: 1 / 1;
	z-index: 1;
	display: grid;
	grid-template: 400px 1fr 300px / 300px 1fr 400px;
	overflow: hidden;
}

.circulo-1{
	grid-area: 1 / 3;
	height: 400px;
	width: 400px;
	border-radius: 100%;
	margin-top: -170px;
	margin-left: 100px;
	background: #b23f2d;
	opacity: .5;
}

.circulo-2{
	grid-area: 3 / 1;
	height: 300px;
	width: 300px;
	border-top-left-radius: 100%;
	border-top-right-radius: 100%;
	border-bottom-right-radius: 100%;
	margin-top: 100px;
	margin-left: -100px;
	background: #e19a57;
	opacity: .5;
	z-index: 2;

}

.circulo-3{
	grid-area: 3 / 1;
	height: 200px;
	width: 200px;
	border-radius: 100%;
	margin-top: 150px;
	margin-left: 100px;
	background: #b23f2d;
	opacity: .5;
	z-index: 1;

}
.about{
	margin-top: 50px;
	margin-left: 60px;
	grid-area: 1 / 1;
	z-index: 2;
	display: grid;
	grid-template: 100% / 60% 40%;
	align-items: space-around;
}

.escrito{
	grid-area: 1 / 1;
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
}

.escrito h1{
	font-family: 'the_second_choiceregular';
	color: #b23f2d;
}

.imagen-1{
	grid-area: 1 / 2;
	margin-left: 50px;
	margin-bottom: 40px;

}

.about span{
	width: 600px;
	margin-top: -10px;
}

.about p{
	font-family: 'Questrial';
	text-align: justify;
}

.escrito p{
	margin-top: 40px;
}


.imagen-2{
	display: none;
}

.escrito > .linea-1{
	margin-left: -60px;
}

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

	.about{
		margin-top: 50px;
		margin-left: 60px;
		grid-area: 1 / 1;
		z-index: 2;
		display: grid;
		grid-template: 40% 60% / 100% ;
		align-items: space-around;
                padding-bottom: 50px
	}

	.escrito{
		grid-area: 2 / 1;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		margin-bottom: 150px;
	}

	.escrito h1{
		font-family: 'the_second_choiceregular';
		color: #b23f2d;
		margin-top: 20px;
	}

	.imagen-1{
		display: none;
	}

	.imagen-2{
		display: block;
		grid-area: 1 / 1;
	    align-self: center;
	    justify-self: center;
	}

	.about span{
		width: 600px;
		margin-top: -10px;
	}

	.about p{
		font-family: 'Questrial';
		text-align: justify;
		margin-right: 50px;
	}


	.escrito > .linea-1{
		margin-left: -60px;
		display: block;
	}

}

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

	.escrito > .linea-1{
		width: 400px;
		margin-left: -60px;
		display: block;
	}

	.imagen-2{
		width: 90%;
		display: block;
		grid-area: 1 / 1;
	    align-self: center;
	    justify-self: center;
	    margin-right: 20px;
	}
}

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

	.escrito > .linea-1{
		width: 300px;
		margin-left: -60px;
		display: block;
	}

	.imagen-2{
		width: 90%;
		display: block;
		grid-area: 1 / 1;
	    align-self: center;
	    justify-self: center;
	    margin-right: 20px;
	}
}
/*ESTILOS ABOUT US FIN*/


/*ESTILOS SERVICES*/

.title{
	grid-area: 1 / 2;
	height: 150px;
	align-items: center;
	justify-content: center;
	font-family: 'the_second_choiceregular' !important;
	text-align:center;
	color:#b23f2d;
}

.title > .linea-1{
	width: 500px;
	z-index: 3;
}

.servicios{
	grid-area: 1 / 1;
	display: grid;
	grid-template: 200px repeat(2,1fr) / repeat(3,33.3%);
	height: 70%;
	z-index: 3;
}

.serv{
	display: flex;
	flex-direction: column;
	align-content: center;
	justify-content: center;
	font-family: 'Questrial';
	font-size: 14pt;

}

.serv h3{
	text-align: center;
}


.d h3{
	width: 200px;
}


.servicios div{
	display: flex;
	flex-direction: column;
	font-family: 'Questrial';
}

.boton{
	height: 200px;
	width: 200px;
	background-color: #be5c4c;
	border-radius: 100%;
	transition: .5s;
}


.boton:hover{
	box-shadow: 3px 3px 6px black;
	transition: .5s;
}


.a{
	grid-area: 2 / 1;
	align-self: center;
	justify-self:center;
}

.b{
	grid-area: 2 / 2;
	align-self: center;
	justify-self:center;
}

.c{
	grid-area: 2 / 3;
	align-self: center;
	justify-self:center;
}

.d{
	grid-area: 3 / 1;
	align-self: center;
	justify-self:end;
	margin-top: 40px;
	text-align:center;
}

.e{
	grid-area: 3 / 3;
	align-self: center;
	justify-self:start;

}

.acordeon{
	background: linear-gradient(to right, #ebbb8e, #be5c4c);
	height: 600px;
	box-shadow: inset 0px 8px 10px rgba(0,0,0,.7);

}

.microblading, .skin-care, .body-care, .fat-freeze, .eyes{
	display: grid;
	grid-template: 100% / repeat(2, 50%);
	height: 100%;
}

.informacion{
	grid-area: 1 / 1;
	overflow-y: scroll;
	overflow-x:hidden;
	margin: 25px 25px;
	height: 85%;
	width: 80%;
	color: white;
	align-self: center;
	justify-self:center;
}
	.informacion::-webkit-scrollbar {
    width: 3px;
	}
	/* Track */
	.informacion::-webkit-scrollbar-track {
	    background: transparent; 
	}
	/* Handle */
	.informacion::-webkit-scrollbar-thumb {
	    background: white;
	    border-radius: 50px; 
	}
	/* Handle on hover */
	.informacion::-webkit-scrollbar:hover {
	    width: 7px; 
	}


.informacion p{
	text-align: left;
	font-size: 16pt;
}

.microblading > .imagenes{
	grid-area: 1 / 2;
	height: 500px;
	width: 400px;
}

.skin-care > .informacion{
	align-content: center;
	justify-content: center;
	text-align: center;
}

.skin-care > .informacion :nth-child(5){
	margin:0;
}

.informacion table, th, td {
    border-left: 20px solid transparent;
    text-align:left;
    margin-left: 0;
    font-size: 14pt;
}

.body-care h4{
	align-self: center;
	justify-self: center;
	margin-left: -100px;
}


.superior{
	grid-row-start: 3;
	grid-row-end:5;
	grid-column-start: 1;
	grid-column-end: 4;
}

.intermedio{
	grid-row-start: 3;
	grid-row-end:5;
	grid-column-start: 1;
	grid-column-end: 4;
}

.inferior{
	grid-row-start: 5;
	grid-row-end:7;
	grid-column-start: 1;
	grid-column-end:4;
}

.inferior-2{
	grid-row-start: 5;
	grid-row-end:7;
	grid-column-start: 1;
	grid-column-end:4;
}


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

	.boton{
		height: 150px;
		width: 150px;
	}
	.d h3{
		width: 150px;
	}
}


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

	.informacion p{
		font-size: 11pt;
		margin: 10px 10px;
	}

	.informacion h3{
		font-size: 14pt;
		margin: 0px 10px;
	}

.microblading, .skin-care, .body-care, .fat-freeze, .eyes{
	display: grid;
	grid-template:  repeat(2, 50%) / 100%;
}

.acordeon{
	height: 1000px;
}

	.servicios{
	grid-area: 1 / 1;
	display: grid;
	grid-template: 200px repeat(3,1fr) / repeat(2,50%);
	height: 1200px;
	z-index: 3;
	}

	.a{
		grid-area: 2 / 1;
	}

	.b{
		grid-area: 2 / 2;
	}

	.c{
		grid-area: 3 / 1;
	}

	.d{
		grid-area: 3 / 2;
		margin-top: 40px;
		text-align:center;
	}

	.e{
		grid-column-start: 1;
		grid-column-end: 3;
		grid-row: 4;
		align-self: center;
		justify-self: center;
	}

	.a, .b, .c, .d{
		align-self: center;
		justify-self:center;
	}

	.microblading, .skin-care, .body-care, .fat-freeze, .eyes{
	display: grid;
	grid-template:  repeat(2, 50%) / 100%;
	height: 800px;
	width: 100%;
	}

	.superior{
	grid-row-start: 3;
	grid-row-end:7;
	grid-column-start: 1;
	grid-column-end: 3;
	}

	.intermedio{
	grid-row-start: 4;
	grid-row-end:7;
	grid-column-start: 1;
	grid-column-end: 4;
	}

	.inferior{
	grid-row-start: 5;
	grid-row-end:7;
	grid-column-start: 1;
	grid-column-end:4;
	}

	.inferior-2{
	grid-row-start: 4;
	grid-row-end:7;
	grid-column-start: 1;
	grid-column-end: 4;
	}

	.informacion{
	grid-area: 2 / 1;
	overflow-y: scroll;
	overflow-x:hidden;
	align-self:end;
	height: 400px;
	width: 100%;
	margin:5px 5px;
	color: white;
	}

	.title{
	grid-column-start: 1;
	grid-column-end: 3;
	grid-row: 1;
	}

	.title > .linea-1{
	width: 300px;

	}
}

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

	.boton{
		height: 95px;
		width: 95px;
	}

	.d h3{
		width: 95px;
	}

	.serv h3{
		font-size: 14pt;
	}

	.servicios{
		height: 800px;
	}

	.title h1{
		font-size: 24pt;

	}
}