a {
    text-decoration: none;
    color: cornflowerblue;
    font-family: Arial, Helvetica, sans-serif;
}

p, h1 {
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
}

img {
    max-width: 100%;
    height: auto;
    position: relative;
    object-fit: contain;
    overflow: hidden;
    background-position: center;
   
}

header {
    background-image:url(bg/pplstar.gif);
    border-radius: 20px;
    color: white;
    height: 140px;
    margin-top: 0px;
    display: flex;
    text-align: center;
    justify-content: center;
}

section div {

    margin: 10px;
    width: 100%;
    display: inline-block;

}

section.home {
    display: flex;
   
}

.rtside, .lftside {
    background-image:url(bg/rainbowstr.gif);
    border-radius: 20px;
    color: white;
    width: 50vh;
    
}

.lftmarquee, .rtmarquee {
  --s: 100px; /* size of the logo */
  --d: 10s; /* animation duration*/
  --n: 1; /* number of visible logos */
  
  padding-right: 200px;
  overflow: hidden;
  margin: ;

}
.lftmarquee img, .rtmarquee img {
  width: var(--s);
  offset: shape(from calc(var(--s)/-2) 50%,hline by calc(sibling-count()*max(100%/var(--n),var(--s))));
  animation: x var(--d) linear infinite calc(-1*sibling-index()*var(--d)/sibling-count());
} 
@keyframes x { 
  to { offset-distance: 25%; }
}


.middle {
    color: antiquewhite;
     border-radius: 20px;
}

section.linkmain {
    display: flex;
}

body {
    background-image: url(bg/cloudystars.gif);

}
ul {
    list-style-type: none;
}

footer {
    color: white;
    width:100%;
    text-align: center;
    display: flex;
    justify-content: center;

}

footer img {
    display: block;
    height:100px;
    width: 100px;

}