body {
     background:
      radial-gradient(50% 50% at 100% 0,#530024 0%  5% ,rgba(0, 66, 10, 0.87) 6%  15%,#530024 16% 25%,rgba(0, 66, 10, 0.87) 26% 35%,#530024 36% 45%,
       rgba(0, 66, 10, 0.87) 46% 55%,#530024 56% 65%,rgba(0, 66, 10, 0.87) 66% 75%,#530024 76% 85%,rgba(0, 66, 10, 0.87) 86% 95%,
       #0000 96%),
      radial-gradient(50% 50% at 0 100%,#530024 0%  5% ,rgba(0, 66, 10, 0.87) 6%  15%,#530024 16% 25%,rgba(0, 66, 10, 0.87) 26% 35%,#530024 36% 45%,
       rgba(0, 66, 10, 0.87) 46% 55%,#530024 56% 65%,rgba(0, 66, 10, 0.87) 66% 75%,#530024 76% 85%,rgba(0, 66, 10, 0.87) 86% 95%,
       #0000 96%),
      radial-gradient(50% 50%,#530024 0%  5% ,rgba(0, 66, 10, 0.87) 6%  15%,#530024 16% 25%,rgba(0, 66, 10, 0.87) 26% 35%,#530024 36% 45%,
       rgba(0, 66, 10, 0.87) 46% 55%,#530024 56% 65%,rgba(0, 66, 10, 0.87) 66% 75%,#530024 76% 85%,rgba(0, 66, 10, 0.87) 86% 95%,
       #0000 96%),
      radial-gradient(50% 50%,#530024 0%  5% ,rgba(0, 66, 10, 0.87) 6%  15%,#530024 16% 25%,rgba(0, 66, 10, 0.87) 26% 35%,#530024 36% 45%,
       rgba(0, 66, 10, 0.87) 46% 55%,#530024 56% 65%,rgba(0, 66, 10, 0.87) 66% 75%,#530024 76% 85%,rgba(0, 66, 10, 0.87) 86% 95%,
       #0000 96%) 16px 16px;
     background-size: 32px 32px;
     background-color: #530024;
        }
    #headcontainer {
      position: absolute;
      left: 445px;
      top: 25px;
      height:150px;
      width: 500px;
    }
    #dabody {
      position: absolute;
    }
    #bodyleft {
      position: absolute;
    background-color: rgb(0 0 0 / 80%);
      height: 990px;
      width: 150px;
      left: 300px;
      top: 150px;
      color: black;
      border: 2px solid black;
    }
    #bodyright {
      background:
      radial-gradient(50% 50% at 100% 0,#6c0043 0%  5% ,rgba(0, 105, 40, 0.89) 6%  15%,#6c0043 16% 25%,rgba(0, 105, 40, 0.89) 26% 35%,#6c0043 36% 45%,
       rgba(0, 105, 40, 0.89) 46% 55%,#6c0043 56% 65%,rgba(0, 105, 40, 0.89) 66% 75%,#6c0043 76% 85%,rgba(0, 105, 40, 0.89) 86% 95%,
       #0000 96%),
      radial-gradient(50% 50% at 0 100%,#6c0043 0%  5% ,rgba(0, 105, 40, 0.89) 6%  15%,#6c0043 16% 25%,rgba(0, 105, 40, 0.89) 26% 35%,#6c0043 36% 45%,
       rgba(0, 105, 40, 0.89) 46% 55%,#6c0043 56% 65%,rgba(0, 105, 40, 0.89) 66% 75%,#6c0043 76% 85%,rgba(0, 105, 40, 0.89) 86% 95%,
       #0000 96%),
      radial-gradient(50% 50%,#6c0043 0%  5% ,rgba(0, 105, 40, 0.89) 6%  15%,#6c0043 16% 25%,rgba(0, 105, 40, 0.89) 26% 35%,#6c0043 36% 45%,
       rgba(0, 105, 40, 0.89) 46% 55%,#6c0043 56% 65%,rgba(0, 105, 40, 0.89) 66% 75%,#6c0043 76% 85%,rgba(0, 105, 40, 0.89) 86% 95%,
       #0000 96%),
      radial-gradient(50% 50%,#6c0043 0%  5% ,rgba(0, 105, 40, 0.89) 6%  15%,#6c0043 16% 25%,rgba(0, 105, 40, 0.89) 26% 35%,#6c0043 36% 45%,
       rgba(0, 105, 40, 0.89) 46% 55%,#6c0043 56% 65%,rgba(0, 105, 40, 0.89) 66% 75%,#6c0043 76% 85%,rgba(0, 105, 40, 0.89) 86% 95%,
       #0000 96%) 10px 10px;
background-size: 20px 20px;
background-color: #6c0043;
      position: relative;
      padding: 5px;
      width: 550px;
      height: 980px;
      top: 150px;
      left: 450px;
      color: white;
      border: 2px solid black;
    }

    

    #galleryphoto {
      
    }
    #gallerycaption {
    }
   
    #galleryleft {
      position: absolute;
      background-color: black;
      color: white;
      height: 880px;
      width: 300px;
      top: 100px;
      border: 2px solid purple;
      overflow-x: hidden;
      overflow-y: auto;
    }
    #galleryright {
      position: absolute;
      background-color: black;
      color: white;
      height: 880px;
      width: 270px;
      top: 100px;
      left: 280px;
      border: 2px solid purple;
       overflow-x: hidden;
      overflow-y: auto;
    }
    #yearbox {
     position: relative;
     background-color: black;
     border: 2px solid white; 
     color: white;
     height: 50px;
     width: 145px;
    }
    #mediabox {
     position: relative;
     background-color: black;
     border: 2px solid white; 
     color: white;
     height: 20px;
     width: 145px;
    }
    .yearbutton {
      position: relative;
      margin: 2px;
      padding-left: 15px;
      background-color: black;
      border: 1px solid grey;
      color: white;
      height: 30px;
      width: 125px;
    }
        .commbutton {
      position: relative;
      margin: 2px;
      padding-left: 15px;
      background-color: black;
      border: 1px solid purple;
      color: white;
      height: 37px;
      width: 125px;
    }
    
    .photo {
      position: relative;
      border: 1px solid maroon;
      width: 240px;
      height: 160px;


    }
    .photoCONTAIN {
      position: relative;
      max-width: 100%;
      max-height: 100%;
      display: block;
      image-rendering: pixelated;
    }
    .captionbox {
      height: 15px;
      margin: auto;
      padding: auto;
      color: white;
      width: 225px;
      position: relative;
      background-color: grey;
      border: 2px solid purple;
    }
    .photoandcaption {
      height: 200px;
      padding: 5px;
      width: 240px;
     position: relative;
     border: 1px solid white;
     margin: 5px;
     left: 0px;
    }
    .THISHOLDSTHEPHOTOSTOO {
  border: 1px solid black;
  height: 875px;
  width:275px;
  direction: rtl;
  overflow-y: scroll;
  overflow-x: hidden;
}
.THISHOLDSTHEPHOTOSTOO2 {
  border: 1px solid black;
  height: 875px;
  width:275px;
  overflow-y: scroll;
  overflow-x: hidden;
}
  #backbutton {
  position: absolute;
  height: 80px;
  width: 170px;
  left: 300px;
  top: 990px;
  }