* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
@font-face { font-family: "Gotham_Condensed_Book_Regular"; src: url(../img/Gotham_Condensed_Book_Regular.otf); }
@font-face { font-family: "Gotham-Book"; src: url(../img/Gotham-Book.otf); }
@font-face { font-family: "Gotham-Bold"; src: url(../img/Gotham-Bold.otf); }
@font-face { font-family: "GOTHAM-LIGHT"; src: url(../img/GOTHAM-LIGHT.TTF); }
@font-face { font-family: "Gotham-Black"; src: url(../img/Gotham-Black.otf); }
@font-face { font-family: "Gotham-Medium"; src: url(../img/Gotham-Medium.otf); }
table { font-family: "Arial", sans-serif; }
body { padding: 0; margin: 0; font-family: "Arial", sans-serif; font-size: 12px; color: #555555; background: url(../img/bgFooter.png) center bottom no-repeat, url(../img/bg.jpg) center top no-repeat; }
a, a:hover, .action a, .action span.anchor, #pagemenu a:hover, #pagemenu a, .block-link, .toggler a, .sortable:hover, .sortable { color: #363636; -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } 
a:hover { color: #053b84; border: 0; text-decoration: none; }
input[type=text], input[type=password], input[type=file], textarea { font-family: "Arial", sans-serif; outline: 0; border: 0; }
h1, h2, h3 { font-family: "Gotham-Bold"; font-size: 14px; color: #000000; text-transform: uppercase; letter-spacing: 0; margin: 10px 0 5px; font-weight: normal; border: 0; }
.container { width: 947px; margin: 0 auto; }
#top { width: 100%; height: 40px; background: url(../img/bgTop.jpg) center top repeat-x; }


.navBlock::after, .accountBanner::after, .welcomeBlock::after, .indexBlock2::after, .indexBlock3::after, .news::after, .indexBlock4::after, .footerNav::after, .footerBottom::after { clear: both; content: ''; display: block; }
.navBlock { background: #f1f1f1; border-radius: 0 0 8px 8px; border-left: 1px solid #FFF; border-right: 1px solid #FFF; border-bottom: 1px solid #FFF; }
.roBlock { width: 230px; height: 67px; float: left; }
.roBlock a { display: block; padding-top: 4px; }
.roBlock a img { display: block; margin: 0 auto; }

.navigation { position: relative; z-index: 100; }
.navigation ul, .navigation li { padding: 0; margin: 0; list-style: none; }
.navigation { width: 714px; height: 67px; float: left; }
.navigation li { width: 119px; float: left; }
.navigation li a { font-family: "Gotham_Condensed_Book_Regular"; line-height: 1; font-size: 18px; display: block; text-align: center; border-right: 1px solid #d8d8d8; }
.navigation li:last-child { border-right: 0; }
.navigation ul li { position: relative; padding: 25px 0; }
.navigation ul ul { width: 277px; height: 27px; position: absolute; bottom: -16px; left: 50%; background: url(../img/subMenuInner.png) center top repeat-x; z-index: 10; display: none; white-space: nowrap; }
.navigation ul li ul li { float: left; padding: 8px 0; border: 0; }
.navigation ul li ul li a { font-size: 10px; font-family: "Gotham-Medium"; color: #FFF; display: block; border-right: 1px solid #397fc7; padding: 0 13px; text-transform: uppercase; }
.navigation ul li li { width: auto; }
.navigation ul ul::before { position: absolute; top: 0; left: -8px; width: 8px; height: 27px; content: ''; background: url(../img/subMenuLeft.png) center left no-repeat; }
.navigation ul ul::after { position: absolute; top: 0; right: -8px; width: 8px; height: 27px; content: ''; background: url(../img/subMenuRight.png) center left no-repeat; }
.navigation ul li li:last-child a { border: 0; }
.navigation ul li:hover > ul { display: block; }
.navigation ul li:last-child ul { left: auto; right: 50%; }
.navigation ul li { cursor: pointer; }

.registerBtn { height: 140px; }
.registerBtn a { position: relative; top: 25px; }
.registerBtn a, .registerBtn a img { display: block; margin: 0 auto; }

.accountBtns { height: 196px; }
.accountBtns ul, .accountBtns li { list-style: none; padding: 0; margin: 0; }
.accountBtns li { width: 204px; height: 23px; overflow: hidden; margin: 0 auto; margin-bottom: 2px; }
.accountBtns li:first-child { height: 76px; margin: 24px auto 15px; }
.accountBtns li:last-child a img { position: relative; top: -25px; left: 0; }
.accountBtns a { opacity: 0.8; }
.accountBtns a:hover { opacity: 1; }


.statusBox { width: 1125px; margin: 0 auto; height: 40px; background: url(../img/statusBg.jpg) center top no-repeat; position: relative; }
.statusBox div { position: absolute; top: 0; left: 0; }
.status { width: 319px; height: 40px; position: relative; }
.status img { position: absolute; top: 11px; left: 101px; }
.status img:nth-child(2) { left: 174px; }
.status img:nth-child(3) { left: 241px; }
.playerOnline, .population, .serverTime, .registeredId { width: 55px; height: 18px; color: #898989; text-align: center; line-height: 18px; font-family: "Gotham-Medium"; font-size: 9px; }
.statusBox .playerOnline { top: 11px; left: 440px; }
.statusBox .population { top: 11px; left: 631px; }
.statusBox .serverTime { top: 11px; left: 830px; }
.statusBox .serverTime iframe { position: relative; top: 3px; }
.statusBox .registeredId { top: 11px; left: 1055px; }

.logoArea { position: relative; height: 154px; }
.logoArea a { width: 370px; position: absolute; top: -35px; left: 50%; -webkit-transform: translate(-37%, 0); -moz-transform: translate(-37%, 0); -ms-transform: translate(-37%, 0); -o-transform: translate(-37%, 0); transform: translate(-37%, 0); -webkit-transition: all 200ms ease-in-out; -moz-transition: all 200ms ease-in-out; -ms-transition: all 200ms ease-in-out; -o-transition: all 200ms ease-in-out; transition: all 200ms ease-in-out; } 
.logoArea a:hover { top: -31px; }

.content { background: #f1f1f1; min-height: 1438px; padding: 18px; border-radius: 8px; margin-bottom: 40px; }
.contentBody { min-height: 954px; }

.accountBanner { width: 908px; margin-bottom: 10px; }
.accountBanner.mainindex { margin-bottom: 0; }
.accountBlock { width: 246px; height: 337px; float: left; background: url(../img/registerBg.png) center top no-repeat; }

.bannerBlock { width: 662px; height: 337px; float: left; position: relative; }
.bannerBlock #prev, .bannerBlock #next, .bannerBlock #per-slide-template { position: absolute; bottom: 0; left: 0; }
#per-slide-template { width: 574px; height: 44px; left: 44px !important; border-top: 1px solid #0e1930; border-bottom: 1px solid #0e1930; }
#per-slide-template a { display: block; width: 33.33%; height: 42px; float: left; background: #262f43; border-top: 1px solid #313a4d; border-bottom: 1px solid #313a4d; line-height: 42px; font-family: "Gotham-Book"; color: #FFF; border-right: 1px solid #3a4254; }

#per-slide-template a.cycle-pager-active { background: #131721; border-top: 1px solid #181d26; border-bottom: 1px solid #181d26; }
#per-slide-template a:last-child { border-right: 0; }
#prev, #next { width: 44px; height: 44px; cursor: pointer; }
#next { right: 0 !important; left: auto !important; }


.downloadLink { width: 246px; height: 219px; float: left; }
.downloadLink a { display: block; position: relative; top: 35px; }
.welcome { width: 662px; height: 223px; float: left; background: url(../img/welcomeBg.png) center top no-repeat; }
.welcome .header { height: 57px; line-height: 65px; padding-left: 15px; font-family: "Gotham-Bold"; font-size: 18px; }
.welcome .header span { font-family: "Gotham-Book"; color: #053b84; }
.welcome p { padding: 12px 20px; line-height: 22px; text-indent: 90px; }

.indexBlock2 { width: 908px; }
.indexBlock2>div { margin-top: -20px; }
.episode { width: 488px; height: 111px; background: url(../img/episodeBg.png) center top no-repeat; float: left; position: relative; }
.episode div span { font-family: "GOTHAM-LIGHT"; display: block; font-size: 14px; }
.episode a, .episode div { position: absolute; top: 0; left: 0; }
.episode div { font-family: "Gotham-Black"; font-size: 24px; top: 52px; left: 164px; }
.episode a { display: block; width: 114px; height: 30px; background: #155eb6; border: 1px solid #1354a3; font-family: "GOTHAM-LIGHT"; color: #FFF; text-align: center; line-height: 26px; top: 58px; left: 336px; }
.episode a:hover { background: #135099; }

.searchDb { width: 408px; height: 111px; background: url(../img/searchBg.png) center bottom no-repeat; float: left; margin-left: 12px; }

.tab ul, .tab li { padding: 0; margin: 0; list-style: none; }
.tab ul::after { clear: both; display: block; content: ""; }
.tab-links { text-align: left; }
.tab-links li a span { color: #898989 !important; }
.tab li { float: left; text-align: center; }
.tab li:last-child { border: 0; }
.tab li a { display: block; font-size: 10px; padding: 4px 0; color: #959595; text-transform: uppercase; line-height: 1; }
.tab li a.active { color: #f7941d; }
.tab-content { font-size: 11px; font-family: "Arial", sans-serif; background: #646392; border: 1px solid #5a5983; padding: 4px 4px 3px 4px; }
.tab-content table { width: 100%; border-collapse: collapse; }
.tab-content table tr td { height: 30px; background: url(../img/tdBg.png) center top no-repeat; vertical-align: middle; font-size: 11px; }
.tab-content table tr td a { display: block; line-height: 1; }
.tab-content table tr td:nth-child(1) { padding-left: 10px; }
.tab-content table tr td:nth-child(2) { text-align: left; }
.tab-content table tr td:last-child { padding-right: 10px; text-align: right; color: #959595; }
.woe .tab ul li { height: 23px; background: rgba(0,0,0,0.5); }
.news .tab-links ul { width: auto; }
.tab-content input[type="text"] { width: 194px; height: 20px; border: 1px solid #d8d8d8; }
.tab-content input[type="submit"] { width: 79px; height: 20px; border: 0; padding: 0; background: none; font-size: 10px; color: #ffffff; position: relative; top: -1px; cursor: pointer; }

.searchDb .tab { width: 286px; height: 55px; position: relative; top: 43px; left: 92px; }

.indexBlock3 { width: 908px; margin: 6px 0; }
.facebook { width: 198px; height: 277px; border: 1px solid #d8d8d8; float: left; }
.facebook iframe { position: relative; top: 8px; left: 7px; }
.news { width: 703px; height: 277px; border: 1px solid #d8d8d8; float: left; margin-left: 7px; padding: 8px 8px; }
.news table { font-family: "Arial", sans-serif; width: 100%; }
.news table a { font-weight: bold; }
.news table tr td { padding: 6px 0; }
.news table tr td:last-child { text-align: right; }

.newsnAnnouncements, .latestEvents { width: 252px; float: left; }
.newsnAnnouncements { width: 260px; border-right: 1px solid #d7d7d7; padding-right: 8px; }
.latestEvents { width: 270px; padding: 0 8px; }
.latestEvents img { margin-top: -7px; }
.kafraShop { width: 155px; float: left; }

.kafraShop { width: 155px; height: 265px; float: left; background: url(../img/kafraShopBg.png) center top no-repeat; margin-top: -6px; padding: 54px 5px 0; }
.kafraShop table { border-collapse: collapse; width: 100%; }
.kafraShop table tr td { vertical-align: middle; text-align: center !important; font-family: "Arial", sans-serif; font-size: 12px; color: #363636; }
.kafraShop table tr td span { font-size: 21px; color: #ffb923; line-height: 35px; }
.kafraShop table tr td { padding: 1px 0; }

.indexBlock4 { width: 908px; margin: 15px 0; }
.quickLinks { width: 198px; float: left; }
.quickLinks ul, .quickLinks li, .otherBtns, .otherBtns li, .footerBLeft ul, .footerBLeft li { padding: 0; margin: 0; list-style: none; }
.quickLinks li a { font-family: "Gotham-Bold"; text-transform: uppercase; font-size: 12px; line-height: 1; display: block; padding: 15px 0; padding-left: 60px; position: relative; }
.quickLinks li a span { display: block; font-family: "Gotham-Book"; font-size: 10px; text-transform: initial; color: #959595; }
.quickLinks li a::before { width: 34px; height: 34px; background: url(../img/quickLinksImg.png) center top no-repeat; content: ''; position: absolute; top: 5px; left: 14px; }
.quickLinks li:nth-child(2) a::before { background-position: 0 -48px; }
.quickLinks li:nth-child(3) a::before { background-position: 0 -98px; }
.quickLinks li:nth-child(4) a::before { background-position: 0 -147px; }

.otherBtns li a::before { width: 0; height: 0; }
.otherBtns li a { padding: 0; }
.otherBtns li:first-child a { width: 198px; height: 75px; overflow: hidden; margin-bottom: 10px; }
.otherBtns li:last-child a { width: 198px; height: 57px; overflow: hidden; }
.otherBtns li a img { position: relative; }
.otherBtns li:last-child a img { top: -81px; left: 0; }
.posts { width: 703px; float: left; margin-left: 7px; }

h2.heading { height: 61px; background: url(../img/latestImg.png) center right no-repeat; font-family: "Gotham-Bold"; text-transform: uppercase; font-size: 12px; border-bottom: 1px solid #d8d8d8; padding-top: 40px; margin: 0; }
.blue { color: #155eb6; }
.posts h2 { margin-top: -24px; }
.posts table { width: 100%; border-collapse: collapse; display: block; padding-top: 10px; }
.posts table tr td { padding: 8px 0; }
.posts table tr td:first-child { width: 530px; }
.posts table tr td a { font-weight: bold; line-height: 1; }
.posts table tr td:last-child { text-align: right; color: #898989; width: 100px; }
.posts table tr td:nth-child(2) { text-align: center; color: #898989; width: 73px; }

#footer { border-top: 1px solid #d8d8d8; padding-top: 11px; }
.footerNav ul, .footerNav li { padding: 0; margin: 0; list-style: none; }
.footerNav li { float: left; }
.footerNav li a { display: block; padding: 0 5px; line-height: 1; font-family: "Gotham-Medium"; font-size: 10px; text-transform: uppercase; border-right: 1px solid #363636; border-left: 1px solid #bfbfbf; }
.footerNav li:first-child a { border-left: 0; padding-left: 0; }
.footerNav li:last-child a { border-right: 0; }

.footerBLeft { width: 50%; float: left; }
.footerBRight { width: 50%; float: left; }
.footerBLeft li { float: left; padding: 10px 10px 10px 0; }

.footerBLeft table { width: 187px; height: 44px; font-family: "Gotham-Medium"; font-size: 8px; text-transform: uppercase; border-collapse: collapse; }
.footerBLeft table tr td { background: #5697cd; border: 1px solid #FFF; }
.footerBLeft table tr td a { color: #ffffff; text-align: center; display: block; line-height: 1; padding: 2px; }
.footerBLeft li img { display: block; padding-top: 2px; }

.footerBRight { text-align: right; }
.footerBRight p { color: #898989; font-family: "Arial", sans-serif; line-height: 18px; }
.footerBRight p span { font-weight: bold; }

.orange { color: #f7941d; }

#adminmenu, #submenu, #pagemenu { background: #2075c3; padding: 4px; border-radius: 2px; margin-bottom: 2px; color: #FFF; border: 1px solid #3f88cc; margin-top: 0; }
#adminmenu a, #submenu a, #pagemenu a { color: #FFF; }
.vertical-table, .horizontal-table { width: 100%; border-collapse: collapse; }
.search-form, .vertical-table tr th, .horizontal-table tr th { background: #dedede; border: 1px solid #b8b8b8; }
.vertical-table tr td, .horizontal-table tr td { background: #eaeaea; border: 1px solid #b8b8b8; }
.generic-form, .info-text, .generic-form-div { background: #dedede; color: #000; border: 1px solid #b8b8b8; }
.search-form label, .search-form2 label { color: #000; }
.search-form p, .search-form2 p { border-bottom: 1px solid #b8b8b8; }
.pages .current-page, .generic-form-table td p, .toggler a, .sortable, .sortable:hover, .pages .page-prev, .pages .page-next, .action a, .action span.anchor { color: #000; }
.adjust { width: 581px; overflow: auto; }


/* Push */
@-webkit-keyframes hvr-push {
  50% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes hvr-push {
  50% {
    -webkit-transform: scale(0.95);
    transform: scale(0.95);
  }

  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

.hvr-push {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
}
.hvr-push:hover, .hvr-push:focus, .hvr-push:active {
  -webkit-animation-name: hvr-push;
  animation-name: hvr-push;
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* Shrink */
.hvr-shrink {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
.hvr-shrink:hover, .hvr-shrink:focus, .hvr-shrink:active {
  -webkit-transform: scale(0.9);
  transform: scale(0.9);
}

/* Buzz Out */
@-webkit-keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }

  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }

  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }

  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }

  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }

  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }

  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }

  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}

@keyframes hvr-buzz-out {
  10% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  20% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }

  30% {
    -webkit-transform: translateX(3px) rotate(2deg);
    transform: translateX(3px) rotate(2deg);
  }

  40% {
    -webkit-transform: translateX(-3px) rotate(-2deg);
    transform: translateX(-3px) rotate(-2deg);
  }

  50% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }

  60% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }

  70% {
    -webkit-transform: translateX(2px) rotate(1deg);
    transform: translateX(2px) rotate(1deg);
  }

  80% {
    -webkit-transform: translateX(-2px) rotate(-1deg);
    transform: translateX(-2px) rotate(-1deg);
  }

  90% {
    -webkit-transform: translateX(1px) rotate(0);
    transform: translateX(1px) rotate(0);
  }

  100% {
    -webkit-transform: translateX(-1px) rotate(0);
    transform: translateX(-1px) rotate(0);
  }
}

.quickLinks li a::before {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
}
.quickLinks li a:hover::before {
  -webkit-animation-name: hvr-buzz-out;
  animation-name: hvr-buzz-out;
  -webkit-animation-duration: 0.75s;
  animation-duration: 0.75s;
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

.generic-form input[type="submit"], .generic-form button[type="submit"] { background: #589f48; padding: 6px 15px; border-radius: 2px; border: 1px solid #58a048; color: #FFF; font-family: "Gotham-Bold"; font-weight: normal; text-transform: uppercase; font-size: 12px; cursor: pointer; -webkit-transition: all 200ms ease-in; -moz-transition: all 200ms ease-in; -ms-transition: all 200ms ease-in; -o-transition: all 200ms ease-in; transition: all 200ms ease-in; }
.generic-form input[type="submit"]:hover, .generic-form button[type="submit"]:hover { background: #457e39; }