/* General */

body {
	display: flex;
	align-items: center;
	flex-direction: column;
	

}


/* Navegador */

#navbar {
	background-image: url("../img/pexels-henry.jpg");
	background-size: 100%;
	margin-bottom: 30px;
}

.container {
	/* background: linear-gradient(to right, rgba(46, 96, 157,0.1), white, rgba(46, 96, 157,0.1));*/
	border-radius: 20px;
	margin-bottom: 20px;
}

.nav-item {
	padding: 0px 45px;
}

li a {
	/* background: white; */
	font-size: 22px;
	font-family: 'Nanum Myeongjo', serif;
}

li a:hover {
	text-decoration: underline;
	border-radius: 20px;
	transition:  2s ease-out;
}

 @media (max-width: 700px){
 	#navbar {
 		width: 80%;
 		background-size: 100% 100%;
 	}
 }


/* Footer */

footer {
	display: flex;
	align-items: center;
	flex-direction: column;
	width: 100%;
	background: linear-gradient(to left, rgba(46, 96, 157,0.7),  rgba(46, 96, 157,0.9), rgba(46, 96, 157,0.9), rgba(46, 96, 157,0.9), rgba(46, 96, 157,0.7));
	padding: 5px;
	margin-top: 50px;
}

footer div {
	width: 60%;
	display: flex;
	flex-direction: column;
	align-items: center;

}

footer div p{
	text-align: center;
	height: 90%;
	width: 60%;
	font-family: 'Nanum Myeongjo', serif;
	line-height: 2em;
	font-size: 18px;
	color: white;
	border-style: none none double none;
	border-color: white;
	
}

footer div a{
	font-size: 3em;
	cursor: pointer;
	color: white;
}

footer div a:hover{
	color: grey;
}

.bajada {
	width: 60%;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	font-family: 'Nanum Myeongjo', serif;

}

.bajada p {
	width: 120%;
	border-style: none;
	font-size: 16px;
}

.bajada p a {
	font-size: 16px;
	text-decoration: none;
	padding: 0px 5px;
}

@media (max-width: 700px) {

	footer {
		padding: 2px;
	}

	footer div {
		margin-top: 10px;
		width: 90%;
	}

	footer div p {
		line-height: 1.2em;
	}

	footer div a {

		margin-bottom: 6px;

	}

	.bajada {
		flex-direction: column;
	}


} 


/* Inicio */

#uno::before{
	font-family: 'Nanum Myeongjo', serif;
	content: "1. ";
	color: black;
}

#dos::before{
	font-family: 'Nanum Myeongjo', serif;
	content: "2. ";
	color: black;
}

#tres::before{
	font-family: 'Nanum Myeongjo', serif;
	content: "3. ";
	color: black;
}




.img-portada {
	display: flex;
	justify-content: center;
	align-self: center;
	width: 60%;
}

.About1 {

	width: 70%;
	font-family: 'Nanum Myeongjo', serif;
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 40px;
}

.About1 p {
	
	text-align: justify;
  	line-height: 1.5em;
  	font-size: 20px;
}


@media (max-width: 700px){
	.img-portada {
		width: 80%;
	}
	#img-portada {
		width: 100%;
	}

}

/* Biografía */

.card {
	margin-top: 40px;
	max-width: 15em;
	width: 105%;
}


#retrato {
	
	border-radius: 15px;
}

.historia {
	width: 75%;
	display: flex;
	flex-direction: row;
	justify-content: center;
	margin-top: 25px;
	margin-bottom: 20px;
	margin-left: 50px;
}

.sub-historia {
	width: 80%;
	margin-left: 50px;

	flex-direction: column;
	justify-content: center;
	align-items: center;

	font-family: 'Nanum Myeongjo', serif;
	font-size: 18px;


}

.sub-historia h1, h2{
	text-align: center;
	margin-top: 25px;
	margin-bottom: 20px;
	font-size: 1.5em;
}

.sub-historia p {
	width: 100%;
	padding: 20px 50px;

	line-height: 1.75em;
	background: rgb(254, 233, 229 );
	line-height: 2em;
	font-size: 16px;
	border-radius: 20px;
	text-align: justify;
}

@media (max-width: 700px){
	.historia {
		width: 95%;
		flex-direction: column-reverse;
		align-items: center;
	}

	.sub-historia {
		width: 95%;
		padding: 10px 10px;
		margin-left: 0px;
	}

	.card img{
		max-width: 180px;
		
	}
}


/* Portafolio */

#proyectos {
	display: flex;
	flex-direction: row;
	font-family: 'Nanum Myeongjo', serif;
	margin-bottom: 20px;
}

#proyectos img {
	padding: 0px 10px;
	margin-bottom: 20px;
}

.accordion {
	width: 70%;
	font-family: 'Nanum Myeongjo', serif;
	margin-bottom: 40px;
 
}

.accordion-body {
	display: flex;
	flex-direction: column;
	align-items: center;
	background: rgba(0,0,0,0.1);
	border-radius: 20px;
}

.accordion-body img{
	width: 80%;
	max-height: 400px;
	margin-bottom: 20px;
	border-radius: 20px;
	border-style: solid;
	border-color: rgba(46, 96, 157,0.9);
}

.accordion-header {
	border: 1px solid black;
	border-radius: 5px;
} 

#Otros, #Articulos {
	font-family: 'Nanum Myeongjo', serif;
	padding-top: 10px;
	padding-bottom: 20px;
}

.otros-proyectos {
	width: 70%;
	font-family: 'Nanum Myeongjo', serif;
	padding-bottom: 15px;
}

.otros-proyectos {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	
	padding: 30px 30px;
	
}




.accordion-body p{
	padding: 20px;
	font-size: 1em;
	color: rgba(46, 96, 157,1);
	
}

.articulos {
	width: 70%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	padding: 30px 30px;
	margin-bottom: 50px;
	font-family: 'Nanum Myeongjo', serif;
}

.articulos h2{
	font-size: 1.5em;
	color: black;
	margin-bottom: 20px;

}

.articulos p{
	padding: 20px;
	font-size: 1em;
	color: rgba(46, 96, 157,1);
	background: rgba(0,0,0,0.1);
	border-radius: 20px;

}

@media (max-width: 700px){
	.accordion {
		width: 90%;
	}
}

/* Galeria */

#carouselExampleControls {
	width: 65%;
}

@media (max-width: 700px){
	#carouselExampleControls {
		width: 95%;
	}
}


/* Contacto */

section {
	font-family: 'Nanum Myeongjo', serif;
	background: aliceblue;
	display: flex;
	justify-content: center;
	align-items: center;
	background-image: url(../img/paisaje.jpg);
	background-size: 100% 100%;

	box-shadow: 5px 5px 10px rgba(0,0,0,0.5);
	width: 60%;


	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;

	padding: 20px 20px;
	margin-bottom: 40px;
}


.contenedor {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;

}

.form-group {
	margin-bottom: 10px;
	font-size: 18px;
}

.form-group label {
	padding-right: 5px;
}

.form-group input {
	border-style: solid;
  	border-width: 0px 0px 0.7px 0px;
  	border-color: grey;
  	width: 80%;
 }

 .form-group textarea {
 	width: 100%;
 	resize: vertical;
 	margin-top: 20px;
 }

 button[type="submit"] {
 	padding: 3px 20px;
 	border-radius: 10px;
 	font-family: 'Nanum Myeongjo', serif;
 }

 button[type="submit"]:hover {
 	background: rgba(0,0,0,0.2);
 	transition: background 1s;
 }

 
 #email {
 	margin-left: 10px;
 }

 #mensaje {
 	display: flex;
 	flex-direction: column;
 }

 #status {
 	text-align: center;
 	padding: 10px;
 	margin: 0 auto;
 	border-radius: 8px;
 }

 #status.success{
 	background: rgb(211,250,153);
 	animation: status 4s ease forwards;
 }


 #status.error {
 	background: rgb(250,129,92);
 	color: white;
 	animation: status 4s ease forwards;
 }

 @keyframes {
 	0%{
 		opacity: 1;
 		pointer-events: all;
 	}

 	90%{
 		opacity: 1;
 		pointer-events: all;
 	}

 	100% {
 		opacity: 0;
 		pointer-events: none;
 	}
 }

 @media (max-width: 700px){
 	section {
 		width: 95%;
 		background-size: 200% 100%;
 	}
 }