*{
    box-sizing: border-box;
}
body{
    background: url(img/background.png) no-repeat center top #000;
    font-size: 14px;
    font-family: 'Roboto Slab', serif;
    font-size: 14px;
}
@media (max-width: 1264px) {
    body{
        background-attachment: fixed;
    }
}
a{
    text-decoration: none;
    color: #b58241;
    transition: color ease .1s;
}
a:hover{
    color: #e4a859;
}

.container{
    width: 1264px;
    margin: 0 auto 0 auto;
}
.col-small, .col-main{
    float: left;
}  
.col-small{
    width: 218px;
}
.col-main{
    width: 828px;
}
.fancybar{
    width: 826px;
    height: 86px;
    background: url(img/fancybar.png) no-repeat;
   
    line-height: 86px;
    font-family: 'Caudex', serif;
    color: #fdb029;
    text-shadow: 0 0 3px #0007;

    margin-top: 13px;
    padding: 0 30px;
}
.fancybar a{
    color: #fdb029;
}
.fancybar .fab{
    font-size: 18px;
    margin-right: 12px;
    padding-top: 33px;
    float: left;
    display: block;
}
.fancybar .pull-left{
    float: left;
    display: block;
    width: 15%;
    text-align: left;
}
.fancybar .pull-center{
    float: left;
    display: block; text-align: center;
    width: 70%;
}
.fancybar .pull-right{
    float: right;
    display: block;
    width: 15%;
    text-align: right;
    white-space: nowrap;
}
.bigbtn-login.account, .bigbtn-login.account p{
    background-image: url(img/accountbtn_sprite.png) !important;
}
.bigbtn-login, .bigbtn-login p{
    display: block;
    width: 218px;
    height: 114px;
    background-image: url(img/loginbtn_sprite.png);
    background-repeat: no-repeat;
    background-position: 0 0;
}
.bigbtn-login p{
    background-position: 0 -114px;
    visibility: hidden;
    opacity: 0;
    transition: opacity ease .2s, visibility ease .2s;
}
.bigbtn-login:hover p{
    opacity: 1;
    visibility: visible;
}

.bigbtn-download, .bigbtn-download p{
    display: block;
    width: 218px;
    height: 104px;
    background-image: url(img/downloadbtn_sprite.png);
    background-repeat: no-repeat;
    background-position: 0 0;
}
.bigbtn-download p{
    background-position: 0 -104px;
    visibility: hidden;
    opacity: 0;
    transition: opacity ease .2s, visibility ease .2s;
}
.bigbtn-download:hover p{
    opacity: 1;
    visibility: visible;
}

.nav-cnt{
    width: 218px;
}
.nav-cnt-top{
    width: 218px;
    height: 39px;
    background: url(img/navcnt_top.png) no-repeat;
    margin-bottom: -5px;
}
.nav-cnt-bot{
    width: 218px;
    height: 39px;
    background: url(img/navcnt_bot.png) no-repeat;

}
.nav-cnt-mid{
    width: 218px;
    background: url(img/navcnt_mid.png) repeat-y;
    padding: 0 17px;
}
.navbtn{
    width: 180px;
    height: 44px;
    background: url(img/navbtn_sprite.png) no-repeat left top;
    line-height: 44px;
    font-size: 17px;
    font-family: 'Caudex', serif;
    color: #fdb029;
    display: block;
    text-align: center;
    text-decoration: none;
    position: relative;
    padding: 0;
    margin: 0 2px;
    transition: filter ease .2s;
}
.navbtn.active{
    background: url(img/navbtn_sprite.png) no-repeat 0 -44px;
}
.navbtn .icon{
    position: absolute;
    left: 10px;
    top: 5px;
}
.navbtn:hover{
    filter: brightness(1.2);
}
.navbtn:active{
    filter: brightness(0.9);
}
.linklist{  
    margin: 0;
    width: 164px;
    padding: 0;
    transform: scaleY(0);    
    opacity: 0;
    transform-origin: top;
    
    max-height: 0px;
}
.linklist a{
    display: block;
    padding: 2px 0;
    font-size: 13px;
    padding-left: 12px;
    color: #7d5c1b;
    width: 100%;
    transition: color .2s ease, padding .2s ease;
}
.linklist a:hover{
    color: #cf8b08;
}
.linklist.visible{
    opacity: 1;
    padding: 6px 0;
    transform: scaleY(1);
    max-height: 900px;
}
.content-container{
    width: 828px;
    float: left;
}
.content-container-top{
    width: 828px;
    height: 59px;
    background: url(img/midcnt_top.png) no-repeat;
    float: left;
}
.content-container-mid{
    width: 828px;
    background: url(img/midcnt_mid.png) repeat-y;
    padding: 0 30px;
   position: relative;
   float: left;
}
.content-container-bot{
    width: 828px;
    height: 63px;
    background: url(img/midcnt_bot.png) no-repeat;
    float: left;
}
.main-content-holder{
    float: left;
    margin: -20px 0 -20px 0;
    width: 772px;
    color: #b9b9b9;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
}
.footer{
    width: 100%;
    padding: 2px 8px 0 8px;
    color: #535252;
    font-size: 12px;
    float: left;
    text-align: center;
}
.footer a{
    color: #706959;
}
.footer small{
    opacity: 0.3;
    font-style: italic;
}
.register-banner, .register-banner p{
    width: 218px;
    height: 129px;
    background: url(img/register_banner.png) no-repeat 0 0;
    display: block;
    margin-top: 5px;
    transition: opacity ease .2s, visibility ease .2s;
    z-index: 1;
}
.register-banner:hover p{
    visibility: visible;
    opacity: 1;
}
.register-banner p{
    background-position: 0 -129px;
    opacity: 0;
    visibility: hidden;
}
.monster-pedestal{
    width: 218px;
    height: 81px;
    background: url(img/monster_pedestal.png) no-repeat 66px 0;
    margin-bottom: -30px;
    margin-top: -51px;
    pointer-events: none;
    z-index: 10;
    position: relative;
}
.monster-pedestal img{
    margin: -11px 0 0 59px;
}
.widget-cnt{
    width: 218px;
}
.widget-cnt-top{
    width: 218px;
    height: 52px;
    background: url(img/widgetcnt_top.png) no-repeat 0 0;
    float: left;
}
.widget-cnt-top img{
    margin: 17px 0 0 15px;
}
.widget-cnt-bot{
    width: 218px;
    height: 42px;
    background: url(img/widgetcnt_bot.png) no-repeat 0 0;
    float: left;
}
.widget-cnt-mid{
    width: 218px;
    background: url(img/widgetcnt_mid.png) repeat-y;
    position: relative;
    float: left;
}
.widget-content-holder{

    margin: 5px 0 -12px 0;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    padding: 0 23px;
    font-size: 12px;
    color: #7e7466;
}
.image-slide-container{
    width: 787px;
    height: 171px;
    background: url(img/gallery_box.png) no-repeat 0 0;
    margin: -16px 0 10px -9px;
    padding: 20px 14px;
}
ul.topplayers{
    display: block;
    width: 172px;
    margin: 0;
    padding: 0;
}
ul.topplayers li{
    display: block;
    width: 100%;
    padding: 4px 0;
    border-top: 1px solid #fff1;
    position: relative;
}
ul.topplayers a.topplayerslink{
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 99px;
    vertical-align: bottom;
}
ul.topplayers .number{
    margin-left: 20px;
    display: inline-block;
}
ul.topplayers li .lvl{
    position: absolute;
    right: 0;
    top: 3px;
    padding: 1px 2px;
    font-size: 11px;
    background: #ffb28e22;
    border: 1px solid #ffe94e44;
    border-radius: 3px;
    color: #ffcfa5b5;
}

ul.latestnews{
    display: block;
    width: 172px;
    margin: 0;
    padding: 0;
}
ul.latestnews li{
    display: block;
    width: 100%;
    padding: 4px 0;
    border-top: 1px solid #fff1;
    position: relative;
}
ul.latestnews a.newslink{
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 90px;
    vertical-align: bottom;
    font-size: 15px;
}
ul.latestnews li .date{
    position: absolute;
    right: 0;
    top: 3px;
    padding: 1px 2px;
    font-size: 11px;
    background: #ffb28e22;
    border: 1px solid #ffe94e44;
    border-radius: 3px;
    color: #ffcfa5b5;
}
.col-main table{
    border-spacing: 0;
    border-collapse: separate;
    text-shadow: 0 0 2px #0005;
}
.col-main table td, .col-main table th{

}
.col-main table td.white{
    font-family: 'Caudex', serif;
    text-shadow: 0 1px 1px #0005;
    color: #cd9853;
    padding: 5px;
    font-size: 15px;
}
/* my-aac content specific styles, mainly tables and buttons */
.col-main table.tastytable{
    width: 100%;
    border-spacing: 0;
    border-collapse: separate;
    color: #aba292;
    font-size: 13px;
    text-shadow: 0 0 2px #0005;

    border: 2px solid #4e3f2c;
    box-shadow: 2px 0 5px #000;

}
.col-main table.tastytable td, .col-main table.tastytable th{
    padding: 8px 10px;
    border-top: 1px solid #fff1;
    border-bottom: 1px solid #0001;
}
.tastybtn{
    display: inline-block;
    padding: 9px 15px !important;
    border-radius: 3px;
    box-shadow: 0 0 10px #000, 0 2px 0 #3c2d18;
    background: url(img/button_texture.png) bottom center #9d7b49;
    color: #ffec8c;
    font-weight: bold;
    font-size: 13px;
    /* text-transform: capitalize; */
    margin: 5px;
    font-family: 'Raleway', sans-serif;
    transition: background-color ease .2s, color ease .2s;
    border: 0 none;
    font-family: 'Caudex', serif;
    text-shadow: 0 1px 2px #000;
}
.tastybtn:hover{
    background-color: #cf9d51;
    color: #ffdf3c;
    cursor: pointer;
}
.tastytabletitle{
    font-family: 'Caudex', serif;
    text-shadow: 0 1px 2px #000;
    color: #cd9853;
    width: 100%;
    margin-bottom: 5px;
    padding: 3px 0;
    text-align: center;
    border-bottom: 1px solid #fff2;
}


.radial-stat-container{
    position:relative;
    width: 1264px;
    height: 415px;
}
.radial-stat.left{
    left: 125px;
    top: 120px;
}
.radial-stat.right{
    right: 125px;
    top: 120px;
}
.radial-stat {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    background: rgb(255 153 0 / 18%);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
    border: 1px solid #ffdfc9;
    box-shadow: 0 0 20px #ffe0b8, 0 0 15px #ffe6b8 inset,  0 0 10px #ffdab8, 0 0 10px #ffe0b8 inset;
    width: 153px;
    height: 153px;
    border-radius: 50%;
    color: #fff;

    text-shadow: 0 1px 4px #0007;
}
/* server*/
.radial{
  display: flex;
  padding-left: 18px;
}
.circle-online, .circle-players{ 
text-align: center;
    position: relative;
    display: inline-block;
    z-index: 2;
    background: linear-gradient(#00000069, #ffffff47);
    border-radius: 50%;
    /* box-shadow: 0 3px 10px #00000073 inset; */
    border-top: 1px solid #ffd6c5cc;
    border-bottom: 1px solid #ffd6c5cc;
}

.circle-online:after, .circle-players:after{
  content: "";
  position: absolute;
  top: -54px;
  left: -50px;
  height: 178px;
  width: 221px;
  background: url(img/radial-stat-fon.png) no-repeat;
}
.serverInfo {
    position: absolute;
    width: 124px;
    height: 124px;
    padding-top: 29px;
}
.serverInfo span {
    display: block;
    width: 100%;
    text-align: center;
    position: relative;
}
.serverInfo__name {
    font-size: 14px;
    color: #fff;
    margin-bottom: 3px;
}
.news{
    background: #ffd0951f;
    margin: 5px 0;
    padding: 10px;
    border: 1px solid #000;
    /* box-shadow: 0 1px 0 #fff inset; */
    box-shadow: 0 2px 10px #0005, 0 1px 0 #ffc28447 inset, 0 0 10px #ffc28447 inset;
    border-radius: 3px;
}
.news h2{
    font-size: 20px;
    font-family: 'Caudex', serif;
    color: #c0a551;
    margin: 2px 0;
    text-align: center;
    width: 100%;
}
.news .dateauthor{
    border-bottom: 1px solid #ffb27022;
    font-size: 14px;
    text-transform: uppercase;
    font-family: 'Caudex', serif;
    color: #836d49;
    text-align: center;
    width: 100%;
}
.news p{
    padding: 0;
    margin: 5px;
}

.buttondownload {
  background-color: #15390f; /* Green */
  border: 2px solid #4CAF50; /* Green */
  color: #fff;
  padding: 15px 52px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 16px;
  box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
  transition-duration: 0.4s;
}
#newsticker ul
{
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 11px;
}

#newsticker ul li a {
    text-shadow: none !important;
    color: #fec700;
    text-decoration: none;
}
#newsticker ul li
{
    display: block;
    background-color: #771504;
    min-height: 25px;
    line-height: 25px;
    border-top:  1px solid black;
    font-weight: bold;
}
#newsticker span
{
    color: white !important;
    font-weight: normal !important;
}
.buttonmaydel {
    background-color: #347508; /* Green */
    border: 4px solid #4CAF50; /* Green */
    color: white;
    padding: 15px 52px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
  }
  .buttondownload {
    background-color: #144b75;; /* Green */
    border: 2px solid #4CAF50; /* Green */
    color: #fff;
    padding: 15px 52px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    box-shadow: 0 12px 16px 0 rgba(0,0,0,0.24), 0 17px 50px 0 rgba(0,0,0,0.19);
    transition-duration: 0.4s;
  }
  .flex-content-center, .well-container{
    text-align: center;
  }
  .well-header{
    font-size: 130%;
    margin: 10px 0;
  }