body{background-color: #deece2;
    margin: 0;
    padding: 0;
  }  
  .container{
    width: 95%;
    max-width: 1270px;
    height: auto;
    margin: 0 auto;
    padding: 10px;    
  }
  .logo{
    width: auto;
    height: auto;
    display: flex;
  }
  .logo img{    
    position: top; 
    width: 1270px;
    height: 130px;
    border-radius: 15px;      
    align-items: center;
    border: 1px solid;   
    box-shadow: 2px 2px 2px 2px #c29797;
  }  
  nav{
    padding: 8px;
    display: flex;
    justify-content: center;    
  } 
  .nav-item{    
    text-decoration: none;
    list-style: none;            
    display: inline-block;   
  }
  .nav-link{
    margin: 0 10px;  
    text-decoration: none;      
  }
  h1{
   text-align: center;
  }
  main{
    margin: 0;
    padding: 0;
    width: auto;
    height: auto;
  }     
  .img-gallery-1{
    max-width: 100%;
    height: auto;
    
    margin-top: 30px;
    float: right;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
  } 
  main article{
    width: 60%;    
    float: left;  
  }
  main summary:hover{ 
    background: #c9b5ca;
  }
   @media (max-width:900px){
    nav ul{
        display:block;
        padding: 5px;
    }
    main .img-gallery-1{
      width: 95%;
      align-content: center;
    }
}
 @media (max-width:768px){
    nav ul{
        display:block;
        padding: 5px;
    }
    main .img-gallery-1{
      width: 95%;
      align-content: center;
    }
}
 @media (max-width:500px){
    nav ul{
        display:block;
        padding: 5px;
    }
    main .img-gallery-1{
      width: 95%;
      align-content: center;
    }
}
 @media (max-width:375px){
    nav ul{
        display:block;
        padding: 5px;
    }
    main .img-gallery-1{
      width: 95%;
      align-content: center;
    }
}