*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
:root{
    scroll-behavior: smooth;
}

body {
    font-family:Arial, Helvetica, sans-serif;
}


.contenedor {

    width: 100%;
    max-width: 1200 px;
    overflow: hidden;
    margin: auto;
    padding: 60px 0;

}

header {
    height: 100vh;
    background-image: url(recursos/Fondo.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    background-position-x: center;
    background-position-y: center;
    object-fit: cover;
}

.head {
    padding: 350px 0 0 200px;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items:flex-start;
    

}
.head img{
  width: 35px;
}

.header .logo {
    text-align: right;
    padding-top: 3px;    
    padding-right: 40px;
    

}
.header a{
  color: #fff;
  text-decoration: none;
  font-size: 20px;
  font-family: Arial, Helvetica, sans-serif;
}

.header .menu-navegacion {
    color: #fff;
    position: fixed;
    padding: 20px;
    background-color: rgba(48, 47, 47, 0.548);
    box-sizing: border-box;
    left: 0px;
    top: 0px;
    width: 100%;
    text-decoration:none;
    text-align: center;
    
}

.menu-navegacion a{
  padding: 10px;

}

.titulo {
    font-family:Arial, Helvetica, sans-serif;
    font-size: 60px;
    color: white;
    text-shadow: #000 -3px 5px 3px;
}

.subtitulo {    
    font-family: 'Courier New', Courier, monospace;
    font-size: 45px;
    color: white;
    text-shadow: #000 -3px 5px 3px;

}

/*Portfolio*/

.portfolio {
    text-align: center;
}

.portfolio img {
  width: 300px;
}

.img-galeria {
    width: 30%;
    margin-bottom: 15px;
    padding: 3px;
    margin: 10px  ;
    cursor: pointer;
    transition: all 300ms;
    box-shadow: 0 0 6px rgba(0, 0, 0, .6);

}

#portfolio img:hover{
  transform: scale(1.15);
}

.imagen-ligth {
  position:fixed;
  background: rgba(0, 0, 0, .5);
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
  display: flex;
  justify-content:center;
  align-items: center;
  transform: translate(100%);
  transition: transform .2s ease-in-out;
  
}

.show {
  transform: translate(0);
}

.agregar-imagen{
  width: 60%;
  border-radius: 10px;
  transform: scale(0);
  transition: transform .3s .2s;
 
}

.close{
  position: absolute;
  top: 15px;
  right: 15px;
  width: 40px;
  cursor: pointer;
}

.showImage {
  transform: scale(1);
}




.portfolio h2{
    font-family:Arial, Helvetica, sans-serif;
    font-size: 40px;
    color: #000;
    text-shadow: rgb(128, 128, 128) -3px 5px 3px;
    text-align: center;
    padding: 40px;
}

.portfolio h3 {
    font-family: 'Courier New', Courier, monospace;
    font-size: 25px;
    color: #000;
    text-shadow: rgb(128, 128, 128) -3px 5px 3px;
    text-align: center;
    padding: 25px;
    

}



/*sobre mi*/

.sobre-mi {
    text-align: center;
    background: #a7a7a773;
    
    
}

.sobre-mi h2 {
    font-family:Arial, Helvetica, sans-serif;
    font-size: 40px;
    color: #000;
    text-shadow: rgb(128, 128, 128) -3px 5px 3px;
    text-align: center;
    padding: 40px;
}

.contenido {

    flex-direction: column;
    column-count: 2;
    justify-content: center;
    column-gap: 0px;
    text-align: center;
    box-sizing: content-box;
    
  
 
   
}
.contenido img{
    width: 500px;
    
    



}
.contenido p{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 18px;
    max-width: 400px;
    text-align: justify;
 
    
}

/*contacto*/

.form-tit {
    font-family:Arial, Helvetica, sans-serif;
    font-size: 35px;
    color: #000;
    text-shadow: rgb(128, 128, 128) -3px 5px 3px;
    text-align: center;
    padding: 40px
}


.formulario{

	text-align: center;
	font-family: raleway;
    padding: 20px;
}

.contact_form{  
  width: 460px; 
  height: auto;
  margin: 80px auto;
  border-radius: 10px;  
  padding-top: 30px;
  padding-bottom: 20px;  
  background-color: #fbfbfb; 
  padding-left: 30px; 
}


input{
  background-color: #fbfbfb; 
  width: 408px; 
  height: 40px; 
  border-radius: 5px;  
  border-style: solid; 
  border-width: 1px; 
  border-color: #ab4493; 
  margin-top: 10px;  
  padding-left: 10px;
  margin-bottom: 20px; 
}


textarea{
  background-color: #fbfbfb; 
  width: 405px; 
  height: 150px; 
  border-radius: 5px;  
  border-style: solid; 
  border-width: 1px; 
  border-color: #ab4493; 
  margin-top: 10px;  
  padding-left: 10px;
  margin-bottom: 20px; 
  padding-top: 15px; 
}


label{
  display: block; 
  float: center;  
}


button{
  height: 45px; 
  padding-left: 5px;
  padding-right: 5px;   
  margin-bottom: 20px; 
  margin-top: 10px;   
  text-transform: uppercase;
  background-color: #E1E1E1; 
  border-color: #E1E1E1; 
  border-style: solid; 
  border-radius: 10px;  
  width: 420px;   
  cursor: pointer;
}


button p{
  color: #fff; 
}


span{
  color: #ab4493; 
}


.aviso{
  font-size: 13px;  
  color: #0e0e0e;  
}
  



p{
  font-size: 14px; 
  color: #0e0e0e; 
}


::-webkit-input-placeholder {
 color: #a8a8a8;
}


::-webkit-textarea-placeholder {
 color: #a8a8a8;
}


.formulario input:focus{
  outline:0;
  border: 1px solid #97d848;
}


.formulario textarea:focus{
  outline:0;
  border: 1px solid #97d848;
}


/*footer*/

footer{

	position: relative;
	bottom: 0px;
	text-align: center;
}

.footer{

	background: #E1E1E1;
	opacity: 70%;
  	bottom: 0px;
  	padding: 10px;
  	background-position: center;
  	width: 100%


 }
 
 .Copyrigth {
font-family: arial;
color: #000; 
padding: 0px 0px 0px 50px;
font-size: 10px
 }

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

  .head {
   width: 50vh;
  }
  
}