/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: #FFFACD;
  color: black;
  font-family: Helvetica;
  margin: 0;
  border: 0 none;
  padding: 0;
  scrollbar-color: #4682B4 #ffed91;
  scrollbar-width: auto;
}
/* The sidebar menu */
.sidenav {
  height: 100%; /* Full-height: remove this if you want "auto" height */
  width: 200px; /* Set the width of the sidebar */
  position: fixed; /* Fixed Sidebar (stay in place on scroll) */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #D9FFAB; /* Black */
  background-image: url("ezgif6.gif");
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 20px;
  scrollbar-color: #4682B4 #030026;
  scrollbar-width: auto;
}

/* The navigation menu links */
.sidenav a {
  padding: 6px 8px 6px 16px;
  text-decoration: none;
  font-size: 25px;
  color: #ABAFFF;
  display: block;
  
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #ffed91;
}

/* Style page content */
.main {
  margin-left: 200px; /* Same as the width of the sidebar */
  padding: 0px 10px;
  scrollbar-color: #4682B4 #ffed91;
  scrollbar-width: auto;
}

/* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}
/* Container holding the image and the text */
.welcome {
  position: relative;
  text-align: center;
  color: white;
}
/* Centered text */
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.gallery { /* this is the main div that wraps your gallery */
  display:flex;
  flex-wrap:wrap;
  width:100%; /* this can be modified to make the gallery wider */
  background-image:url('image4.gif');
      background-attachment: fixed;
}

.gallery img {
  width:400px; /* this sets the width for every image */
  height:400px; /* this sets the height for every image. Try setting it to 'auto' and see how it looks weird since every image has a slightly different height? */
  object-fit:cover; /* this crops the image so they are all the same size. This might be an issue if you have landscape AND portrait images. Feel free to take this property out temporarily to see exactly what it does! */
  
}

/* this is the div which CROPS every image */
.gallery > div {
  width:400px; /* this should match the image height */
  height:400px; /* this should match the image width */
  margin-right:10px; /* this controls the gaps between the images */
  margin-bottom:10px; /* this controls the gaps between the images */
}

/* this resizes the image on hover. note that objects in 'portrait'  */
.gallery img:hover {
  transform:scale(1.5); /* this scales up the image when you hover over it */
  object-fit:contain; /* this keeps the aspect ratio of the original images*/
}
td:hover {
  background-color: PEACHPUFF;
  color: #000000;
}
html, body {
         background:#FFFFEE;
         color:#800000;
}
a {
        color:#0000EE;
}
a:hover {
        color:#DD0000;
}
.adminbar {
        text-align:right;
        clear:both;
        float:right;
}
.logo {
        clear:both;
        text-align:center;
        font-size:2em;
        color:#800000;
        width:100%;
}
.theader {
        background:#E04000;
        text-align:center;
        padding:2px;
        color:#FFFFFF;
        width:100%;
}
.postarea {
}
.rules {
        font-size:0.7em;
}
.postblock {
        background:#EEAA88;
        color:#800000;
        font-weight:800;
}
.footer {
        text-align:center;
        font-size:12px;
        font-family:serif;
}
.passvalid {
	background:#EEAA88;
	text-align:center;
	width:100%;
	color:#ffffff;
}
.dellist {
	font-weight: bold;
	text-align:center;
}
.delbuttons {
	text-align:center;
	padding-bottom:4px;

}
.managehead {
	background:#AAAA66;
	color:#400000;
	padding:0px;
}
.postlists {
	background:#FFFFFF;
	width:100%;
	padding:0px;
	color:#800000;
}
.row1 {
	background:#EEEECC;
	color:#800000;
}
.row2 {
        background:#DDDDAA;
        color:#800000;
}
.unkfunc {
	background:inert;
	color:#789922;
}
.filesize {
	text-decoration:none;
}
.filetitle {
	background:inherit;
	font-size:1.2em;
	color:#CC1105;
	font-weight:800;
}
.postername {
	color:#117743;
	font-weight:bold;
}
.postertrip {
	color:#228854;
}
.oldpost {
        color:#CC1105;
        font-weight:800;
}
.omittedposts {
        color:#707070;
}
.reply {
	background:#F0E0D6;
	color:#800000;
}
.doubledash {
 	vertical-align:top;
	clear:both;
	float:left;
}
.replytitle {
	font-size: 1.2em;
        color:#CC1105;
        font-weight:800;
}
.commentpostername {
        color:#117743;
	font-weight:800;
}
.thumbnailmsg {
	font-size: small;
	color:#800000;
}



.abbrev {
        color:#707070;
}
.highlight {
	background:#F0E0D6;
	color:#800000;
	border: 2px dashed #EEAA88;
}
/* Container holding the image and the text */
.header {
  position: relative;
  text-align: center;
  color: black;
}
/* Centered text */
.center2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.disclaimer p {
  line-height: 5px;   /* within paragraph */
  margin-bottom: 5px; /* between paragraphs */
  }
.gifs2 {
  position: relative;
  text-align: center;
  background-image:url('bg_stars.gif');
  background-attachment: fixed;
}
.chat {
  position: relative;
  text-align: center;
}
h1 {
  line-height: 0px;
  font-size: 32px;
  font-family: "kiwisoda";
}
/* The sidebar menu */
.dispframe {
  height: 25%; /* Full-height: remove this if you want "auto" height */
  width: 200px; /* Set the width of the sidebar */
  position: fixed; /* Fixed Sidebar (stay in place on scroll) */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  left: 0;
  background-color: #D9FFAB; /* Black */
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 20px;
  
}
/* Style page content */
.userframe {
  height: 25%;
  margin-left: 200px; /* Same as the width of the sidebar */
  padding: 0px 10px;
  top: 0; /* Stay at the top */
  right: 0;
  position: fixed;
/* The sidebar menu */
}
.chatframe {
  height: 75%; /* Full-height: remove this if you want "auto" height */
  width: 100%; /* Set the width of the sidebar */
  z-index: 1; /* Stay on top */
  bottom: 0; /* Stay at the top */
  left: 0;
  background-color: #D9FFAB; /* Black */
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 20px;
  position: fixed;
}
@document regexp("*?666") {
  /* CSS rules here apply to:
     - The page "http://www.w3.org/"
     - Any page whose URL begins with "http://www.w3.org/Style/"
     - Any page whose URL's host is "mozilla.org"
       or ends with ".mozilla.org"
     - Any standalone video
     - Any page whose URL starts with "https:" */

  /* Make the above-mentioned pages really ugly */
  body {
    color: purple;
    background: yellow;
  }
}
}