.seccion_portfolio{
  position: relative;
  top: 0;
  z-index: 100;

  width: 100%;
  max-width: 100vw;

  padding:  1.5rem 0;
  margin:  5px auto;
  border-radius: 5px;
  background: linear-gradient(180deg, #071227, #071a2b);
  display: flex;
  align-items: center;
  flex-direction: column;

  overflow: hidden;
  transition: all 0.3s ease-in-out;

}
 .portfolio {
   position: relative;
   max-width: 1000px;
   margin: 40px auto;
   min-height: 200px;
   padding: 20px;
 }

 .portfolio h2 {
   position: relative;
   text-align: center;
   margin-bottom: 40px;
   font-size: 32px;
   color: #fafafa;
 }

 .proyecto {
   position: relative;
   display: flex;
   flex-wrap: wrap;
   background: #FAFAF5;
   border-radius: 5px;
   margin-bottom: 30px;
   padding: 5px;
   box-shadow: 0 0 10px rgba(0,0,0,0.1);
   overflow: hidden;
 }

 .proyecto-img {
   position: relative;
   flex: 1 1 300px;
   min-height: 200px;
   background-color: #ddd;
   background-size: cover;
   background-position: center;
   background-position: top;
   border-radius: 5px;
 }
 .proyecto-info {
   position: relative;
   flex: 2 1 400px;
   padding: 20px;
   text-align: left;
 }

 .proyecto-info h3 {
   position: relative;
   margin-top: 0;
   font-size: 24px;
   color: #4e342e;
 }

 .proyecto-info p {
   position: relative;
   font-size: 16px;
   text-align: left !important;
   margin: 10px 0;
   color: black;

 }

 /**********Boton************/

 .seccion_portfolio a {
   position: relative;
   display: inline-block;
   margin-top: 10px;
   text-decoration: none;
   color: #ffffff;
   background: #4e342e;
   padding: 10px 15px;
   border-radius: 5px;
   transition: background 0.3s ease;
   word-wrap: break-word;
 }
 .seccion_portfolio a:hover{
   cursor: pointer;
 }
 .seccion_portfolio p{
   position: relative;
   text-align: center;
   margin: auto;
   width: 100%;
 }
 .seccion_portfolio a:hover{
   background: #4b0082;
   color: white;
   cursor: pointer;
 }