:root {
                --body-bg-image: url('img/blank.png');
            }

            @font-face {
                font-family: "Averia Sans Libre";
                src: url('font/AveriaSansLibre-Regular.ttf');
            }

            @font-face {
                font-family: "Averia Sans Libre";
                src: url('font/AveriaSansLibre-Bold.ttf');
                font-weight: bold;
            }

            @font-face {
                font-family: "Averia Sans Libre";
                src: url('font/AveriaSansLibre-Italic.ttf');
                font-style: italic;
            }

            @font-face {
                font-family: "Averia Sans Libre";
                src: url('font/AveriaSansLibre-Italic.ttf');
                font-style: italic;
                font-weight: bold;
            }

            body {
                background-color: #08031A; /* scrollbar color */
                background-size: 100% 100%;
                background-attachment: fixed; 
                background-image: var(--body-bg-image);
                text-align: center;
            }

            * {
                box-sizing: border-box;
                
            }

.navbar { grid-area: header; }
.leftSidebar { grid-area: left; }
.mainChat { grid-area: mainchat; }
.rightSidebar { grid-area: right; }
.mainWip { grid-area: mainwip; }
footer { grid-area: footer;}

.parent {
display: grid;
  grid-template:
    'header header header header header'
    'left mainchat mainchat mainchat right'
    'left mainwip mainwip mainwip right'
    'footer footer footer footer footer';
  grid-gap: 10px;
  max-width: 1500px;
  margin: 0 auto;  
}
    
.navbar {
    height: 75px;
    background-color: #293b33;
    border-radius: 10px;
    align-content: center;
}

            .navbar ul {
                display: flex;
                list-style-type: none;
            }

            .navbar li a {
                color: #0E1411;
                font-weight: 800;
                text-decoration: none;
                font-size: 18px;
                font-family: "Averia Sans Libre";
            }

            .leftSidebar li a {
                color: #0E1411;
                font-weight: 800;
                text-decoration: none;
                font-size: 18px;
                font-family: "Averia Sans Libre";
            }
            
            button {
               background-color: #8ABFA6;
                border: none;
                border-radius: 10px;
                height: 40px;
            }
            
            #buttonsleft {
              margin-bottom: 18px;
              padding: 0px 87px;
            }
            
            #buttonsnav {
              margin-top: 1px;
              margin-left: 15px;
              width: 150px;
            }
            
            button:hover {
              background-color: #658C7A;
            }

.mainChat {
    background-color: #293b33;
    padding: 20px;
    border-radius: 10px;
    width: 800px;
    height: 590px;
    margin-left: 10px;
    margin-right: 10px;
}

.leftSidebar {
    background-color: #293b33;
    padding: 20px;
    width: 340px;
    border-radius: 10px;
}

.rightSidebar {
    grid-row-start: 2;
    background-color: #293b33;
    padding: 20px;
    border-radius: 10px;
    width: 340px;
}

.mainWip {
    grid-column-start: 2;
    background-color: #293b33;
    padding: 20px;
    border-radius: 10px;
    margin-left: 10px;
    margin-right: 10px;
	text-align: justify;
}

            .leftSidebar ul {
                padding: 0;
                list-style-type: none;
            }
            
            .rightSidebar ul {
                padding: 0;
                list-style-type: none;
                margin-bottom: 15px;
                margin-top: 0px;
            }
            
            hr {
                background-color: #8ABFA6;
                border: none;
                height: 1px;
                width: 290px;
            }

            h1,
            h2,
            h3 {
                color: #8ABFA6;
                font-family: "Averia Sans Libre";
            }

            h1 {
                font-size: 25px;
                margin-top: 0px;
                margin-bottom: 10px;
				text-align: center;
            }
            
            p {
              color: #8ABFA6;
              font-size: 18px;
              font-family: "Averia Sans Libre";
              line-height: 25px;
              margin-top: 10px;
              margin-bottom: 10px;
            }
            
            img {
                width: 90%;
            }
            
            #logohome {
              width: 8%;
              margin-right: 12px;
              margin-top: -3px;
              margin-left: -6px;
              
            }
            
            #logoright {
              margin-bottom: -1px;
              margin-top: -12px;
              width: 100%;
}
            
            #rules {
                margin-top: 10px;
                margin-bottom: 10px;
            }
            
            .stamp {
              margin: 3px 4px 7px 4px;
              width: 35%;
            }
            
            .gifs {
              margin: 0px 5px 0px 5px;
              width: 20%;
            }
            
.scrollbox {
height: 489px;
  width: 100%;
  padding: 20px;
  border: 2px solid;
  border-color: #8ABFA6;
  overflow: auto;
  margin-top: 18px;
  scrollbar-color: #8ABFA6 #293b33;
  text-align: justify;
}
			
			table {
			width: 100%;
			border-collapse: collapse;
			margin-top: 20px;
			}
			
			th {
			height: 50px;
			background-color: #8ABFA6;
			color: #0E1411;
			font-size: 18px;
			text-align: center;
			border-bottom: 2px solid #293b33;
				}
				
			td {
			height: 40px;
			color: #8ABFA6;
			font-size: 18px;
			text-align: justify;
			border-bottom: 2px solid #8ABFA6;
			padding: 3px 18px 8px 18px;
				}
			
			table, th, td {
			font-family: "Averia Sans Libre";
			table-layout: fixed;
			}
                
            footer {
                background-color: #293b33;
                height: 30px;
                padding: 4px;
                color: #8ABFA6;
                border-radius: 10px;
                font-family: "Averia Sans Libre";
            }