* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    margin: 0px;
    padding: 0px;
    font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
    background: #343021 url('../img/homepage01.jpg') repeat-x center top;
    color: #B0AEA3;
    min-height: 100vh;
    text-align: center;
}

body, th, td, input, textarea, select {
    font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
    font-size: 11px;
    color: #B0AEA3;
}

p, blockquote, ul, ol, dl {
    margin-top: 0px;
    margin-bottom: 1em;
    text-align: justify;
    line-height: 16px;
}

h1, h2, h3, h4, h5, h6 {
    margin: 0px;
}

a {
    color: #E1E1C6;
}

a:hover {
    text-decoration: none;
}

img {
    border: none;
}

.bg0 { background: url('../img/homepage02.jpg') repeat-y left top; }
.bg1 { background: url('../img/homepage03.jpg') no-repeat left top; }
.bg2 { background: url('../img/homepage04.jpg') no-repeat left top; }
.bg3 { background: url('../img/homepage05.jpg') repeat-y left top; }

.text1 {
    height: 32px;
    padding: 8px 0px 0px 20px;
    background: url('../img/homepage07.jpg') repeat-x left top;
    font-size: 11px;
    font-weight: bold;
    color: #F2E8C9;
}

.text2 {
    height: 38px;
    padding: 12px 0px 0px 20px;
    background: url('../img/homepage10.jpg') no-repeat left top;
    font-size: 13px;
    font-weight: bold;
    color: #F2E8C9;
}

.text3 {
    font-size: 16px;
    font-weight: bold;
    color: #F5EED0;
    margin: 10px 0;
}

.text4 {
    font-size: 11px;
    font-weight: normal;
    color: #B0AEA3;
    margin: 5px 0;
}

.text5 {
    margin-bottom: 10px;
    font-size: 11px;
    font-weight: bold;
    color: #F6F6EB;
}

.text6 {
    font-size: 10px;
    color: #B0AEA3;
}

.text7 {
    font-size: 10px;
    color: #CCCCC9;
    margin: 5px 0;
}

.text8 {
    text-align: center;
    color: #676459;
    font-size: 11px;
    padding: 20px;
}

.text9 {
    height: 27px;
    padding: 12px 0px 0px 0px;
    background: url('../img/homepage16.jpg') repeat-x left top;
    font-size: 13px;
    font-weight: bold;
    color: #F2E8C9;
    text-align: center;
}

.list1 {
    width: 137px;
    margin-left: 0px;
    padding-left: 20px;
    list-style: none;
}

.list1 li {
    padding: 3px 0px;
    background: url('../img/homepage08.gif') repeat-x left top;
}

.list1 li.first {
    background: none;
}

.list1 a {
    text-decoration: none;
    color: #CCCCC9;
}

.list1 a:hover {
    text-decoration: underline;
    color: #D8D8BA;
}

.list2 {
    margin-left: 0px;
    padding-left: 0px;
    list-style: none;
}

.list2 li {
    display: inline;
}

.list2 a {
    display: block;
    float: left;
    height: 20px;
    padding: 3px 25px 0px 15px;
    background: url('../img/homepage12.gif') no-repeat left center;
}

.link1 {
    text-decoration: none;
    font-weight: bold;
    color: #E5DABE;
}

.link1:hover {
    color: #ffda8a;
    text-decoration: underline;
}

.input1 {
    padding: 4px;
    background-color: #241F15;
    border-top: 1px solid #15120D;
    border-right: 1px solid #221E14;
    border-bottom: 1px solid #6E6B66;
    border-left: 1px solid #241F15;
    color: #B0AEA3;
    font-size: 11px;
}

.input1:focus {
    outline: none;
}

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 4px;
    text-decoration: none;
}

.btn-success {
    color: #fff;
    background-color: #621d0a;
    border-color: #4cae4c;
}

.btn-success:hover {
    background-color: #7a240c;
    color: #fff;
}

.btn-register {
    display: block;
    width: 100%;
    background-color: #621d0a;
    color: #fff;
    text-align: center;
    padding: 8px 12px;
    text-decoration: none;
    border-radius: 4px;
    margin-top: 5px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1.4;
    box-sizing: border-box;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.btn-register:hover {
    background-color: #7a240c;
    color: #fff;
}

#main-wrapper {
    max-width: 982px;
    margin: 0 auto;
    width: 982px;
}

div.httpreffer {
    width: 100%;
    height: auto;
    text-align: left;
    padding: 10px;
}

#tableiposteng {
    width: 100%;
}

.data-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
}

.data-table th {
    background: linear-gradient(to bottom, #d4af37, #b8941f);
    color: #000;
    padding: 10px;
    border: 1px solid #000;
    text-align: left;
    font-weight: bold;
}

.data-table td {
    padding: 10px;
    border: 1px solid #d4af37;
    background: rgba(0, 0, 0, 0.5);
    color: #d4af37;
}

.data-table tr:hover td {
    background: rgba(212, 175, 55, 0.2);
}

.form-group {
    margin-bottom: 15px;
}

.form-group label {
    display: block;
    margin-bottom: 5px;
    color: #d4af37;
    font-weight: bold;
}

.form-group input,
.form-group textarea {
    width: 100%;
    padding: 10px;
    background: rgba(0, 0, 0, 0.5);
    border: 1px solid #d4af37;
    color: #d4af37;
}

.form-group textarea {
    min-height: 150px;
}

.error {
    background: rgba(231, 76, 60, 0.8);
    color: #fff;
    padding: 12px;
    margin-bottom: 15px;
    border: 2px solid #c0392b;
}

.success {
    background: rgba(39, 174, 96, 0.8);
    color: #fff;
    padding: 12px;
    margin-bottom: 15px;
    border: 2px solid #27ae60;
}

.admin-container {
    display: flex;
    min-height: 100vh;
    gap: 20px;
    padding: 20px;
}

.admin-sidebar {
    width: 250px;
    background: rgba(0, 0, 0, 0.9);
    border: 3px solid #d4af37;
    padding: 20px;
}

.admin-sidebar h2 {
    color: #d4af37;
    margin-bottom: 20px;
    text-align: center;
    border-bottom: 2px solid #d4af37;
    padding-bottom: 10px;
}

.admin-menu {
    list-style: none;
}

.admin-menu li {
    margin-bottom: 10px;
}

.admin-menu a {
    color: #d4af37;
    text-decoration: none;
    display: block;
    padding: 12px;
    border: 1px solid #d4af37;
    background: rgba(0, 0, 0, 0.5);
    transition: all 0.3s;
}

.admin-menu a:hover,
.admin-menu a.active {
    background: rgba(212, 175, 55, 0.3);
    box-shadow: 0 0 8px rgba(212, 175, 55, 0.5);
}

.admin-content {
    flex: 1;
    padding: 20px;
    background: rgba(0, 0, 0, 0.7);
    border: 3px solid #d4af37;
}

.stats {
    display: flex;
    gap: 20px;
    margin-top: 20px;
}

.stat-box {
    flex: 1;
    background: rgba(0, 0, 0, 0.6);
    padding: 20px;
    border: 2px solid #d4af37;
    text-align: center;
}

.stat-box h3 {
    color: #d4af37;
    margin-bottom: 10px;
    font-size: 14px;
}

.stat-box p {
    font-size: 32px;
    color: #d4af37;
    font-weight: bold;
    text-shadow: 0 0 10px rgba(212, 175, 55, 0.8);
}

.usercp-content {
    background: rgba(0, 0, 0, 0.6);
    padding: 20px;
    border: 1px solid #d4af37;
}

.usercp-menu {
    background: rgba(0, 0, 0, 0.6);
    padding: 15px;
    border: 1px solid #d4af37;
}

.usercp-menu ul {
    list-style: none;
}

.usercp-menu ul li {
    margin-bottom: 8px;
}

.usercp-menu ul li a {
    color: #d4af37;
    text-decoration: none;
    display: block;
    padding: 10px;
    border: 1px solid #d4af37;
    background: rgba(0, 0, 0, 0.3);
    transition: all 0.3s;
}

.usercp-menu ul li a:hover,
.usercp-menu ul li a.active {
    background: rgba(212, 175, 55, 0.3);
    box-shadow: 0 0 8px rgba(212, 175, 55, 0.5);
}