html, body {
  padding: 0;
  margin: 0;
}

.content, .page-title, .footer {
  font-family: sans-serif;
}

body {
    background-color: #c9b79c;
    padding:0;
    display: flex;
    flex-direction: column;
}

.header-container {
  margin-bottom: 50px;
  display: flex;
  flex: 1;
}

.header {
    
    display: flex;
    justify-content: space-around;
    flex: 1;
    box-sizing: border-box;
    width: 100%;
}

.logo {
  overflow: hidden;
}

.logo-img {
  height: 80px;
  
}

.page-title {
    font-size: 75px;
    padding: 5px;
   flex: 1;
   align-self: center;
   
}



.paragraphHeader {
  padding-left: 20px;
}

.linksPages {
    display: flex;
    flex-wrap: wrap;
    
    
    margin: 10px;
}


  .droptext, #about {
   
    color: black;
    padding: 6px;
    font-size: 16px;
    margin: 15px;
    border: none;
    font-family: sans-serif;
  }

  .dropdown, #about {
    margin-bottom: 10px;;
  }
  
  .droptext:hover, #about:hover {

    color:#71816d;
  }

  
   .dropdown  {
    position: relative;
    display: inline-block;
  }
  
  
  .dropdown-content {
    display: none;
    position: absolute;
    background-color: white;
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
  }
  
  
  .dropdown-content a {
    color: black;
    padding: 12px 16px;
    text-decoration: none;
    display: block;
  }
  
  
  .dropdown-content a:hover {background-color: #ddd;}
  
  
  .dropdown:hover .dropdown-content {display: block;}
  
 
 
 .content {
    display: flex;
  justify-content: center;
    
    min-height: calc(100vh - 241.94px); 
    flex-grow:1;
    
 }
.text-content {
  width: 75%;
  padding: 10px;
}
.imgs-content {
  width: 25%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex: 1;
  flex-wrap: wrap;
}
.images-responsive {
  width: 100%;
  height: auto;
}

.footer-container {
    display: flex;
    flex: 1;
    flex-direction: column;
}

 .footer {
background-color: #71816d;
display: flex;

justify-content: space-around;

text-align: center;
margin-top: 0;
padding: 0;
min-height: 100px;
width: 100%;
position:relative;





 }






 .footer-nav, .contact {
  margin-top: 30px;
 }

 .footer-nav {
    align-self: center;
    
    
 }


  .contact {
    align-self: center;
  }

  .foot-link {
    text-decoration: none;
    margin: 4px;
  }
  .foot {
    margin:4px;
  }

#about {
  
  
  text-decoration: none;
  flex-wrap: nowrap;
  
}

.image-index {
  height: 45%;
}

@media screen and (max-width: 515px) {
  .header {
    flex-direction: column;
    flex-wrap: wrap;
  }

  .linksPages {
    display: flex;
    justify-content: space-around;
    
  }

  .logo{
    height:auto;
    display : inline-block;
  }
  .logo-img {
    height: auto;
    max-width: 30%;
  
  }
  div.logo-img {
    overflow: hidden;
  }
}

@media screen and (max-width: 360px) {
  .page-title {
    font-size: 10vw;
  }

   

  .droptext, #about {
    font-size: 5vw;
  }
  

  .footer-nav, .contact {
    font-size: 5vw;
  }

  .content {
    flex-direction: column;
  } 

}

.element {
  max-height: 100px;
  width:auto;
}