hr.dashed {
 border-top: 1px dashed;
 border-bottom: none;
  color:#2d80d1;
  margin-top: 10px;
  margin: 10px;
}

hr.dotted {
 border-top: 2px dotted;
 border-bottom: none;
  margin-top: 10px;
  margin: 10px;
  color:#2d80d1;
}

hr.double {
 border-top: 3px double;
 border-bottom: none;
  color:#2d80d1;
  margin-top: 10px;
  margin: 10px;
}
hr.solid {
 border-top: 3px double;
 border-bottom: none;
   margin-bottom: 2px;
  color:#2d80d1;
  margin-top: 2px;
}
.poppins-regular {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.poppins-medium {
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-style: normal;
}

.poppins-semibold {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-style: normal;
}

.poppins-regular-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-style: italic;
}

.poppins-medium-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-style: italic;
}

.poppins-semibold-italic {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-style: italic;
}
body {
  background-image: url("images/lightbluecheck.png");
}

.container {
    position: absolute;
    width: 900px;
    max-width: 1200px;
    height: 1500px;
    left: 15%;
    margin-top:10px;
    margin: auto;
    column-gap: 10px;
    display: grid;
    grid-auto-columns: 1fr;
    grid-auto-rows: 1fr;
    grid-template-columns: 1fr 5fr 1fr;
    grid-template-rows: 0.5fr 1fr 1fr 0.3fr;
    grid-template-areas:
        "banner banner banner"
        "lsidebar main rsidebar"
        "lsidebar main rsidebar"
        "lsidebar stamps rsidebar";
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 5px;

}

#randomimages {
    position: relative;
    display: flex;
    z-index:10;
}

#banner {
    grid-area: banner;
        height:110px;
    z-index: 3;
    width: 900px;
    image-orientation: center;
    font-family: poppins;
    word-wrap: break-word;
    position: top;
    margin-top:10px;
    padding-top: 10px;
    padding-bottom: none;
    background-size: fill;
    overflow: clip;
}

#lsidebar {
    grid-area: lsidebar;
    text-align: center;
    image-orientation: center;
    width: 220px;
    font-family: poppins;
    word-wrap: break-word;
}
.navbuttons {
  position: relative;
  display: inline-block;
}
.navbuttons-content {
  display: none;
  position: absolute;
  min-width: 160px;

}
.desc {
  text-align: center;
    font-family: 'poppins';
}
.navbuttons:hover .navbuttons-content {
  display: block;
   a:link {
  color: midnightblue;
       text-decoration: none;
}
    a:hover {
  color: dodgerblue;
        text-decoration: none;
}
}

.imgside {
  position: relative;
  height: 20px;
  z-index: 3;
  width: 70%;
  top: 10px;
  overflow:hidden;
}

#navrandom {
padding: 8px;
margin-left:auto; 
margin-right: auto;
  height:100px;
  width: 200px;
text-align:left;
border: 2px solid #86c3ff;
background-color: rgba(255, 255, 255, 0.35);
display: block;
    overflow-x: hidden;
  overflow-y:scroll;
  font-family: 'poppins';
  direction: rtl;
  border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
  border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

#main {
    grid-area: main;
    border: #86c3ff 2px solid;
    border-top-left-radius: 8px;
    border-bottom-left-radius: 8px;
    text-align: left;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 10px;
    padding-top: 2px;
    image-orientation: center;
    font-family: 'poppins';
    background-color: rgba(255, 255, 255, 0.35);
    word-wrap: break-word;
    overflow-y: scroll;
}

 #main::-webkit-scrollbar {
      width: 0;
      /* remove scrollbar space */
      background: transparent;
      /* to make scrollbar invisible */
    }

    #container::-webkit-scrollbar-thumb {
      background: transparent;
    }

#mainrandom {
    position: relative;
    background-color: rgba(255, 255, 255, 0.39);
  border: solid 2px #86c3ff;
	border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
    padding: 10px;
  padding-top: 10px;
    font-size: 16px;
  font-family: 'poppins';
display: flex;
  height: 300px;
    flex-wrap: wrap;
    justify-content: left;
    margin-top: 10px;
margin-bottom: 10px;
overflow-y: scroll;
}
#mainrandom img {float: left;
padding-right: 5px;}



#mainrandom2 {
    position: relative;
    background-color: rgba(255, 255, 255, 0.39);
  border: solid 2px #86c3ff;
	border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
    padding: 10px;
  padding-top: 10px;
    font-size: 16px;
  font-family: 'poppins';
display: flex;
  height: 300px;
    flex-wrap: wrap;
    justify-content: left;
    margin-top: 10px;
margin-bottom: 10px;
overflow-y: scroll;
  direction: rtl;
}
#mainrandom2 img {float: right;
padding-left: 5px;}



#rsidebar {
    grid-area: rsidebar;
    border: #86c3ff 2px solid;
    background-color: rgba(255, 255, 255, 0.35);
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    text-align: center;
    padding: 5px;
    padding-top: 10px;
    font-family: 'poppins';
    word-wrap: break-word;
    width: 220px;
    height: 413px;
    overflow-y: scroll;
    overflow-x: hidden;
}

#linkcontainer {
      overflow: scroll;
      overflow-x: hidden;
  background-color: rgba(255, 255, 255, 0.35);
      height: 30px;;
      padding: 1px;
     border: 1px solid #86c3ff;
    }
#linkcontainer::-webkit-scrollbar {
      width: 0;
      /* remove scrollbar space */
      background: transparent;
      /* to make scrollbar invisible */
    }

    #linkcontainer::-webkit-scrollbar-thumb {
      background: transparent;
    }

.abtrandom {
      overflow: scroll;
      overflow-x: hidden;
      height: 10em;
    }

    #abtrandom::-webkit-scrollbar {
      width: 0;
      /* remove scrollbar space */
      background: transparent;
      /* to make scrollbar invisible */
    }

    #container::-webkit-scrollbar-thumb {
      background: transparent;
    }



#stamps {
    grid-area: stamps;
    text-align: center;
    display: relative;
    z-index: 1;
    image-orientation: center;
    word-wrap: break-word;
    margin-bottom: 20px;
    
}


