*
{
    box-sizing: border-box;
}


.button-style{
    background-color: gray;
    color: white;
    width: 60px;
    height: 40px;
    padding: 10px 15px; 
    font-size: 15px;
    border-radius: 20px;
}

h1{
    text-shadow: 5px 5px 5px brown;
    color: black;
    text-align: center;
}
.side{
    width: 40%;
    height: 100vh;
}
.cointainer{
    width: 10%;
    max-width: 110px;
    margin: 0 auto;
}
.girlimg{
    width: 10%;
    height: 10%;
    border-radius: 100%;
}
.boyimg{
    width: 10%;
    height: 10%;
    border-radius: 100%;
}
.girl2img{
    width: 10%;
    height: 10%;
    border-radius: 100%;
}
.imgwrapper{
    position: relative;
    display: inline-block;
    width: 10%;
}
.blurb{
    text-align: left;
    color: white;
}

img{
    border-radius: 10px;
    
}
.buttons{
    text-align: center;
}

body {
  background-image: url(../images/Nature/Nature_3.jpg);
  background-color: burlywood;
  background-repeat: no-repeat;
  background-size:cover;
}
a{
    color: black;
    text-decoration: double;
}
p{
    color: white;
    font-size: x-large;
    text-align: left;
    
}
.nav{
    text-align: center;
   
}
.mycointainer{
    display: flex;
}
.mycointainer>div{
    width: 33%;
}
.scrolling-gallery {
  display: flex;
  overflow: hidden;
  white-space: nowrap;
  animation: scroll 20s linear infinite;
}
.scrolling-gallery img {
  width: 100%;
  height: 80%;
  margin-right: 10px;
}
@keyframes scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}