.above {
  margin-left: 50px;
  display: grid;
  grid-template-columns: 20% 20% 60%;
}

.below {
  height:70px;
   display: grid;
  grid-template-columns: 33% 33% 33%;
  margin:5px;

}

.pblackshadow {
  color:black;
   text-shadow: black 0 0 10px;
   text-align: center;
}

.pblackshadowleft {
  color:black;
   text-shadow: black 0 0 10px;
   text-align: left;
}

.plain {
   background: linear-gradient(to left, #2E2D85, #33FF69);
     border-radius: 10px;
     margin: 10px;
     padding: 10px;
}

scrollboxhuge {
   overflow:scroll;
  overflow-x: hidden;
   background-color: white;
  border-radius: 10px;
  padding: 20px;
}

.wholenav {
  background: linear-gradient(to left, #2E2D85, #33FF69);
    border-radius: 10px;
}

.navheader {
  background-image: linear-gradient( to bottom #AB7CDE 10% #4682B4 75%);
  border-radius: 10px;
}


.navbox {
 background: linear-gradient(to top #EDEDED 10%, white 75%);
 color: white;
 margin: 10px;
 padding:5px;
 border-radius: 10px;
 }
 
 .hugedivcontainer {
   display: flex;
   flex-direction: row;
   width:100%;
 }
 
 .bigpagediv {
   display: flex;
   flex-direction: Column;
   background-color: #fff;
    background-color: rgba(255,255,255,0.5);
   border-radius: 10px;
   width: 80%;
 }

.grid-container-1 {
  display: grid;
  grid-template-columns: 20% 40% 40%;
  background-color: #fff;
  background-color: rgba(255,255,255,0.5);
  border-radius: 15px;
  margin:5px;
}

.divmain {
  border-radius: 15px;
  background-image: url(https://cloudoflove.neocities.org/allimages/whiteplain501.png);
  background-size: cover;
  border: 3px solid rgba(225,225,225,0.5);
  margin: 20px;
  padding:20px;
}

.divleftside {
  border-radius: 25px;
  border: 5px solid rgba(225,225,225,0.5);
   background-color: #fff;
    background-color: rgba(255,255,255,0.5);
  background-size: cover;
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom:20px;
  margin: 10px;
}

.divrightside {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding:10px;
  margin: 20px;
}

/* window-like boxes from about me section */

.box-1-full {
  background-color: white;
  border-radius: 10px;
  width:100%;
  margin:5px;
}


.box-type1-noscroll {
 background-color: white;
  width: 100%;
  border-radius: 10px;
}
  
.box-type1-scroll {
  background-color: white;
  border-radius: 10px;
  height:500px;
  width: 100%;
  overflow:scroll;
  overflow-x: hidden;
}

.box-header-1 {
  background-color: #A6A6A6;
  width: 100%;
  height: 5%;
  border-top-right-radius: 10px;
  border-top-left-radius: 10px;
}

.box-1-header-text {
  color: white;
  font-family: "Helvetica", sans-serif;
  font-size: 10px;
  text-align: left;
  margin-left:5px;
}


/* scrollbox */

.scrollcontainer {
  border-radius: 10px;
  overflow:scroll;
  overflow-x:hidden;
  background-color: #F2F2F2;
  height: 100px;
  width:100%;
}
  ::-webkit-scrollbar {
width: 14px
}

::-webkit-scrollbar:horizontal {
height: 14px
}
::-webkit-scrollbar-corner {
background: #eee
}

::-webkit-scrollbar-track:vertical {
background: linear-gradient(90deg, #e5e5e5, #f0f0f0 20%);
border-radius: 5px; 
}

::-webkit-scrollbar-track:horizontal {
background: linear-gradient(180deg, #e5e5e5, #f0f0f0 20%);
border-radius: 5px; 
}

::-webkit-scrollbar-thumb {
border: 1.5px solid #888;
border-radius: 5px;
box-shadow: inset 0 -1px 1px #fff, inset 0 1px 1px #fff;
}

::-webkit-scrollbar-thumb:vertical {
background: linear-gradient(90deg, #eee 45%, #ddd 0, #bbb);
}

::-webkit-scrollbar-thumb:horizontal {
background: linear-gradient(180deg, #eee 45%, #ddd 0, #bbb);
}