#photos {
  /* Prevent vertical gaps */
  line-height: 0;
   
  -webkit-column-count: 5;
  -webkit-column-gap:   0px;
  -moz-column-count:    5;
  -moz-column-gap:      0px;
  column-count:         5;
  column-gap:           0px;  
}

#photos img {
  /* Just in case there are inline attributes */
  width: 100% !important;
  height: auto !important;
}

@media (max-width: 1200px) {
  #photos {
  -moz-column-count:    4;
  -webkit-column-count: 4;
  column-count:         4;
  }
}
@media (max-width: 1000px) {
  #photos {
  -moz-column-count:    3;
  -webkit-column-count: 3;
  column-count:         3;
  }
}
@media (max-width: 800px) {
  #photos {
  -moz-column-count:    2;
  -webkit-column-count: 2;
  column-count:         2;
  }
}
@media (max-width: 400px) {
  #photos {
  -moz-column-count:    1;
  -webkit-column-count: 1;
  column-count:         1;
  }
}

/* CSS Document */




/* Dropdown Button */
.dropbtn3 {
      background-color:transparent;
    cursor: pointer;
    position: fixed;
  left: 8px;
  top:8px;
  width: auto;
  height: 66px;
  
  text-align:left;
   font-family: Georgia;
  font-size:calc(10px + 1vw); 
  color:#E2E2E2;
  text-decoration:none;
  border:none;
  
  
}

/* Dropdown button on hover & focus */
.dropbtn3:hover, .dropbtn3:focus {
    background-color: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown3 {
    position: relative;
    display: inline-block;
    background-color:#fff;
    text-align: center;
}

/* Dropdown Content (Hidden by Default) */
.dropdown3-content {
font-family: Georgia;
      display: none;
  
      position: fixed;
  left:8px;
  margin-left:-10%;
  top:12%;
  background:#a6a6a6;
       text-align: center;
       color:#fff;
    min-width: 116%;
    height:100%;
    max-height:600px;
    z-index: 9;
    overflow-y: scroll;
    
     opacity: 0.8;
  
  z-index: 9;
}
}

/* Links inside the dropdown */
.dropdown3-content a {
    color: #a6a6a6;

    text-decoration: none;
    display: block;
    
}

/* Change color of dropdown links on hover */
.dropdown3-content a:hover {background-color: #000;}

/* Show the dropdown menu (use JS to add this class to the .dropdown-content container when the user clicks on the dropdown button) */
.show {display:block;text-align: center;} 

   
        .dropbtn4 {
      
    cursor: pointer;
    position: fixed;
  right: 10px;
  bottom:8px;
  width: auto;
  height: 66px;
  line-height:64px;
  text-align:center;
  font-family: Georgia;
  font-size:calc(3px + 1vw); 
  
  border: none;
  
}

  #about {               
  position: fixed;
  left: 10px;
  bottom:8px;
  width: auto;
  height: 64px;
  text-align:center;
 
}

#container
    {  height: 36em;              
  position:relative;
 
 
}
.about1  {

    height: 60%;
    width: 56%;
    color: #a6a6a6;
  
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%);
    font-family: Georgia;
font-size:calc(8px + 1vw);


}