/*This stuff controls the image gallery*/
                    
          .row {
            display: -ms-flexbox; /* IE 10 */
            display: flex;
            -ms-flex-wrap: wrap; /* IE 10 */
            flex-wrap: wrap;
            padding: 0 4px;
          }
          
          /* Create two equal columns that sits next to each other */
          .column {
            -ms-flex: 25%; /* IE 10 */
            flex: 25%;
            padding: 0 4px;
          }
          
          .column img {
            margin-top: 8px;
            vertical-align: middle;
          }
          
          /* Style the buttons */
          .btn {
			  color: black;
			  padding: 12px 16px;
			  text-decoration: none;
			  display: block;
          }
          
          .btn:hover {
            background-color: #;
          }
          
          .btn.active {
            background-color: #666;
            color: white;  
          }
            
/* section for the title and controls of the gallery page */
.gallery_header {
    border: 1px solid var(--tertiary);
	background-color: rgba(255, 237, 235, 0.5);
    height: 50px;
    width: 60%;
	padding-top: 15px;
    line-height: 20px;
	position: relative;	
	margin-left: 19%;
	margin-top: 15px;
}



#gallery_thumbnails {
	overflow-y: auto;
	scrollbar: hidden;
    height: 360px;
    background-color: #FFAEE966;
    width: 19%;
	margin-top: 10px;
	margin-left: 3%;	
    border-style: double;
    border-width: 5px;
    border-color: var(--tertiary);	
	float: left;
	padding: 4px;
	-ms-overflow-style: none;  /* no scroll bar- IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

#gallery_thumbnails img {
	width: 45%;
	aspect-ratio: 1 / 1;
	margin-left: 0%;
	margin-top: 2%;
	border: dashed;
	border-width: 1px;
	border-color: var(--tertiary);
}	

#gallery_thumbnails h3 {
	text-align:center;
}

#gallery_display {
    background-color: var(--primary_light);
    width: 68%;
	height: 360px;;
	margin-top: 10px;
    border-style: double;
    border-width: 5px;
    border-color: var(--tertiary);
	margin-right: 3%;
	float: right;
	padding: 5px;
}




	
/* for the raio between gallery_thumbnail and gallery_display, I initially  had it as 30% and 58 % which looked good but wasn't ideal for usabillity. */