body {
    background-image: url(background/gingham-background.jpg);
    background-attachment: fixed ;
    background-size:20%;
    display:grid;
    grid-template-columns: 6% 20% 46% 22% 6%;
    grid-template-rows: repeat(20%); 
    margin:0px;
  }
  a:link{color: rgb(40,70,97)}
  a:visited{color:rgb(40,70,97)}

  .link{
  grid-area:1/2/2/3;
  height:159px;
  margin-top: 40px;
  margin-left:10px;
  margin-right:auto;
  margin-bottom:0px;
  margin-right: auto;
  padding:5px;
  }
    .link img{
      max-height:150px;
      transform: rotate(-9deg);
    }

  header{  grid-area:1/3/2/5;
  width: 97%;
  height:165px;
  background-image: url(background/flower-background4.webp);
  background-size:25%;
  margin-top: 30px;
  margin-left: auto;
  margin-right: auto;
  opacity:85%;
  background-color:white;
  border-width:10px;
  border-style:solid;
  border-color:#7785a0;
  border-radius: 100px;
  padding-top: 20px;
  padding-left:20px;
  padding-right:none;
  padding-bottom: none;
  }
    #pagetitle{
      text-align:center;
      font-family: "Sour Gummy", sans-serif;
      color: #617393;
      font-size: 60px;
      display:inline;
    }
  header img{
    max-height:140px;
    max-width:auto;
  }

#navbar{
  grid-area:2/2/5/3;
  margin-top: 40px;
  margin-right:auto;
  margin-bottom:30px;
  background-image: url(background/flower-background4.webp);
  background-size:200%;
  border-radius: 10px;
  width:200px;
  height:750px;
  outline-width: 2px;
  outline-style: dashed;
  outline-offset: 4px;
  outline-color: #414c60;
  border-width:3px;
  border-radius: 10px;
  border-style: solid;
  border-color:#414c60;
  padding:5px;
  font-family: "DynaPuff", "DM Sans", sans-serif;
  text-align: center;
  font-weight:normal;
  font-size:15px;
  color:rgb(40,70,97);
}
        h2{
        text-align:center;
        font-family: "DynaPuff", "DM Sans", sans-serif;
        font-size:25px;
        color:rgb(40,70,97);
        font-weight:bold;

 }
        h3{
          font-size:17px;
        }
        
.box2middle{
  grid-area:2/3/4/4;
  margin-top: 75px;
  margin-left:auto;
  margin-right:auto;
  margin-bottom: auto;
  width:575px;
  height:280px;
  outline-width: 3px;
  outline-style: dashed;
  outline-offset:7px;
  outline-color: #414c60;
  border-width: 8px;
  border-radius: 10px;
  border-style: solid;
  border-color:#6c7b96;
  padding:11px;
  background: white;
  font-family: "Solitreo","DM Sans", sans-serif; 
  text-align: center;
  font-weight:normal;
  font-size:medium;}
.box2middle img{
  max-height:75px;
  vertical-align: bottom;
}



#box3{
  grid-area:2/4/3/5;
  margin-top: 40px;
  margin-left:auto;
  margin-bottom:none;
  background-image: url(background/flower-background4.webp);
  background-size:200%;
  border-radius: 10px;
  width:200px;
  height:75px;
  outline-width: 2px;
  outline-style: dashed;
  outline-offset: 4px;
  outline-color: #414c60;
  border-width:3px;
  border-radius: 10px;
  border-style: solid;
  border-color:#414c60;
  padding:5px;
  padding-top:20px;
  font-family: "Dynapuff", "DM Sans", sans-serif;
  text-align: center;
  font-weight:lighter;
  font-size:15px;
  color:rgb(40,70,97);
}
      .clock {
    color: rgb(64, 102, 135);
}
      #divider{
      font-size:medium;
      text-align: center;
}
      .flower3{
        max-height:190px;
      }

.updates{
  grid-area:4/4/5/5;
  margin-left:auto;
  background-image: url(background/flower-background4.webp);
  background-size:200%;
  border-radius: 10px;
  width:200px;
  height:320px;
  outline-width: 2px;
  outline-style: dashed;
  outline-offset: 4px;
  outline-color: #414c60;
  border-width:3px;
  border-radius: 10px;
  border-style: solid;
  border-color:#414c60;
  padding:5px;
  padding-top:25px;
  font-family: "DM Sans", sans-serif;
  text-align: left;
  font-weight:bold;
  font-size:13px;
  color:rgb(40,70,97);
  overflow:auto;
}

.pingu{
  grid-area:3/4/4/5;
  margin-left:auto;
  margin-right:2px;
  border-radius: 10px;
  width:171px;
  height:171px;
  border-width:15px;
  border-radius: 10px;
  border-style: solid;
  border-color:#414c60;
  padding:5px;
} 
.pingu img{
  max-width: 171px;
  max-height:auto;
  object-fit: fill;
}

#flower{
  grid-area:4/4/5/5;
  width:200px;
  height:auto;
  margin-top:-105px;
  margin-left:-50px;
}

#duckstamp{grid-area:4/3/5/4;
width:350px;
height:auto;
margin-left: auto;
margin-right:auto;
outline:#414c60;
outline-width: 5px;
outline-style: solid;}

#footer{
  grid-area:5/1/6/6;
  width: 100%;
  margin-top: 40px;
  margin-left: auto;
  margin-right: auto; 
  padding-top: 20px;
  padding-bottom:10px;
  background:white;
  text-align:center;
  font-family: "DM Sans", sans-serif;
  font-size: x-small;
}