body{

    font-family: 'Poppins', sans-serif;

}


/* navigation */

h3{

    color: #fff;
    margin: 10px;

}

nav { 
    width: 100%;
    display: flex;
    justify-content:space-between;

    /* add a background color */
    background-image: linear-gradient(to right, lightseagreen, teal );

}

nav ul {
    display: flex;
    
}

nav ul li {
    margin: 10px 24px;
    list-style: none;
    
    
}

nav ul li a {
    color: #ccc;
    text-decoration: none;
    

}

nav ul li a:hover{
    color: #fff;
    text-decoration: none;
    

}

.gallery{
    width: 100%;
    height: 100%;
    
}

.row {
    display: flex;
    width: 100%;
    height: 250px;
    padding-top: 1rem;
   
}

.thumbnail {
    width: 100%;
    height: 100%;

    /* background */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;


}

/*.gallery img{
    width: 100%;

}*/

#img1 {
    background-image: url('../resize_images/img1.jpg');
    background-size: cover;
    background-position: center center;
    padding: 10px;
    background-clip: content-box; 
}

#img2 {
    background-image: url('../resize_images/img2.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

#img3 {
    background-image: url('../resize_images/img3.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

#img4 {
    background-image: url('../resize_images/img4.jpg');
    background-size: cover;
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

#img5 {
    background-image: url('../resize_images/img5.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

#img6 {
    background-image: url('../resize_images/img6.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box;
}

#img7 {
    background-image: url('../resize_images/img7.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

#img8 {
    background-image: url('../resize_images/img8.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

#img9 {
    background-image: url('../resize_images/img9.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

#img10 {
    background-image: url('../resize_images/img10.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

#img11 {
    background-image: url('../resize_images/img11.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

#img12 {
    background-image: url('../resize_images/img12.jpg');
    background-size: cover; 
    background-position: center center; 
    padding: 10px; 
    background-clip: content-box; 
}

/* Reset some default styles */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

/* Basic styling for footer */
.footer {
    background-color:lightseagreen;
    color: #fff;
    padding: 30px 0;
    text-align: center;
}

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

.footer-left, .footer-center, .footer-right {
    flex: 1;
    padding: 0 20px;
}

.footer h3 {
    color: #fff;
    font-size: 1.5em;
}

.footer p {
    color: #ccc;
    font-size: 0.9em;
}

.footer ul {
    list-style-type: none;
    padding: 0;
}

.footer ul li {
    margin-bottom: 10px;
}

.footer ul li a {
    color: #ccc;
    text-decoration: none;
    font-size: 0.9em;
}

.footer ul li a:hover {
    color: #fff;
}

.footer-bottom {
    margin-top: 20px;
    background-color:teal;
    padding: 10px 0;
}

.footer-bottom p {
    font-size: 0.8em;
    color: #ccc;
}
