#white {
	color:white;
}

body{
    align: center;
	text-align:center;
}

#left {
	text-align: left;
}

#right {
	text-align: right;
}


div {
	color:white;
	text-align:center;
}
ul {
	text-align:center;
}
body {
	background-image: url('images/bg.png');
    max-width: 100%;
    height: auto;
}

#rainbow  {
   animation-duration: .8s;
   animation-name: rainbow;
   animation-iteration-count: infinite;
   transition: none;
}

@keyframes rainbow {
	0% {color:#ff8e00;}
	10% {color:#ff0000;}
	20% {color:#ffe800;}
	30% {color:#88ff00;}
	40% {color:#00ff99;}
	50% {color:#00fdff;}
	60% {color:#0036ff;}
	70% {color:#5400ff;}
	80% {color:#e700ff;}
	90% {color:#ff004c;}
	100% {color:#ff0034;}
}

#bordure {
    border: 4px solid #5932c0;
    margin-left: 5%;
    margin-right: 5%;
    margin-top: 10px;
    margin-bottom: 10px;
}

nav ul ul {
	display: none;
}

nav ul:after {
	content: "";
	clear: both;
	display: block;
}

nav ul li {
float: left;
position: relative;
list-style-type: none;
}

nav ul li a {
	display: block;
	padding: 20px 30px;
	color: #ffffff;
	text-decoration: none;
	background-color: rgba(36, 35, 44, 0.8);
	font-family: sans-serif;
}

#bd-left {
    border: 4px solid #5932c0;
    margin-left: 5%;
    margin-right: 1%;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 380px;
    height: 250px;
}
#bd-right {
    border: 4px solid #5932c0;
    margin-left: 1%;
    margin-right: 5%;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 380px;
    height: 250px;
}
#bd-mid {
    border: 4px solid #5932c0;
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 950px;
    min-height: 250px;
    height: auto;
}

#auth-page {
    display: flex;
    justify-content: center;
    gap: 40px;
    flex-wrap: wrap;
    margin: 24px auto;
}

#auth-page form {
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 260px;
    border: 4px solid #5932c0;
    padding: 20px;
}

#auth-page input[type=text],
#auth-page input[type=password] {
    border: 4px solid #5932c0;
    border-radius: 4px;
    font-size: 14px;
    color: white;
    background-color: #2b2e36;
    padding: 8px 10px;
}

a {
    color: #b99cff;
}

#message-board {
    max-height: 360px;
    overflow-y: auto;
    text-align: left;
}

.message-post {
    text-align: left;
    margin: 10px 20px;
}

#message_content {
    width: 80%;
    min-height: 80px;
    box-sizing: border-box;
    border: 4px solid #5932c0;
    border-radius: 4px;
    font-size: 16px;
    color: white;
    background-color: #2b2e36;
    padding: 8px;
}
#main-container {
    align: center;
    display: block;
    max-width: 1525px;
    margin: 0 auto;

}
.flex {
    display: flex;
    margin-bottom: 10px
}
input[type=searx] {
    border: none;
    width: 60%;
    height: 5%;
    box-sizing: border-box;
    border: 4px solid #5932c0;
    border-radius: 4px;
    font-size: 16px;
    color: white;
    background-color: #2b2e36;
    background-image: url('images/searchicon.png');
    background-position: 10px;
    background-repeat: no-repeat;
    padding: 12px 20px 12px 40px;
}