*{
    margin: 0;
    padding: 0;
}

img{
    width: 100%;
}

#gallery{
    background-color:rgb(195, 106, 106);
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 1.44rem;
    grid-template-columns: repeat(auto-fit,minmax(480px,1fr));
}
@media screen and (min-width: 380px) {
    #gallery {
        grid-template-columns: 1fr 1fr;
}
}

@media screen and (min-width: 900px) {
    #gallery {
        grid-template-columns: 1fr 1fr 1fr 1fr;
}
}
header {
    background-color: rgb(111, 44, 44);
}
body{
    background-color: rgb(205, 146, 146);
}
h1 {
    color: rgb(140, 71, 81); 
    font-family: Verdana, Geneva, Tahoma, sans-serif; 
    letter-spacing: 5px; 
    word-spacing: 20px; 
    text-shadow: 5px 5px 5px rgb(46, 11, 19); 
    font-size: 100px;
}
h2{
    background-color: rgb(208, 121, 121);
}
h3{
    color: antiquewhite;
}

.fancy-button { 
    background-color: rgb(101, 56, 56);
    padding: 10px 40px;
    border-radius: 10px;
    box-shadow: 2px 4px 10px pink;
    color: white;
}
.fancy-button:hover{ 
    background-color: indianred;
    color: white;
}
p{
    color: rgb(43, 39, 40);
    font-family: Arial, Helvetica, sans-serif;
    padding: 20px;
}
figcaption{
    font-family: Arial, Helvetica, sans-serif;
}