@charset "utf-8";@font-face {
    font-family: 'korean';
    src: url(/static/presentation/font/1HoonGomusin.woff) format('woff')
}

* {
    margin: 0 auto
}

img {
    display: inline
}

div {
    display: grid
}

body {
    background: #1b1716;
    font-family: 'Onest',sans-serif;
    background-image: url(/static/presentation/img/bg.jpg);
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center
}

button {
    background: none;
    color: inherit;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
    outline: inherit
}

.language-dropdown {
    position: fixed;
    top: 30px;
    right: 30px
}

.language-dropdown .language-select {
    width: 73px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background-image: linear-gradient(to right,#4e3f2f,#5c4c3a);
    align-self: center;
    color: #c5ac90;
    text-transform: uppercase;
    font-size: 14px
}

.language-dropdown .texts {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 14px
}

.language-dropdown .languages {
    position: absolute;
    top: 100%;
    left: 0;
    width: 73px;
    background-color: #514231;
    border-radius: 4px;
    margin-top: 5px;
    display: none;
    z-index: 200
}

.language-dropdown .languages a {
    box-sizing: border-box;
    margin: 0 auto;
    line-height: 40px;
    float: left;
    color: #c5ac90;
    width: 100%;
    height: 40px;
    padding-left: 12px;
    font-size: 14px;
    text-decoration: none
}

.language-dropdown .languages a:hover {
    background-color: #695742
}

.language-dropdown .languages a i {
    margin-top: 9px
}

.language-dropdown .flags {
    display: block;
    float: left;
    width: 20px;
    height: 20px;
    margin-right: 5px
}

.language-dropdown .flag-en {
    background: url(/static/languages/en.png)
}

.sidebar-navigation {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    left: 0
}

.sidebar-navigation .nav-item {
    display: block;
    background-image: url(/static/presentation/img/nav_1.png);
    background-repeat: no-repeat;
    left: -16px;
    width: 67px;
    height: 50px;
    margin-bottom: 5px;
    position: relative;
    transition: all ease .3s
}

.sidebar-navigation .nav-item .korean {
    position: absolute;
    top: 19px;
    width: 32px;
    left: 13px;
    text-align: center;
    font-size: 14px;
    color: #846f57;
    font-family: 'korean'
}

.sidebar-navigation .nav-item:hover .korean,.sidebar-navigation .nav-item.active .korean {
    color: #b06432
}

.sidebar-navigation .nav-item:hover,.sidebar-navigation .nav-item.active {
    background-image: url(/static/presentation/img/nav_2.png);
    background-repeat: no-repeat;
    left: 0
}

.sidebar-navigation .nav-item span {
    display: none;
    position: absolute;
    left: 110%;
    top: 50%;
    transform: translateY(-50%);
    color: #b06432;
    font-size: 12px;
    white-space: nowrap
}

.sidebar-navigation .nav-item:hover span,.sidebar-navigation .nav-item.active span {
    display: block
}

.sidebar-navigation .chevron {
    display: block;
    color: #846f57;
    width: 16px;
    height: 8px;
    margin-left: 6px
}

.sidebar-navigation .chevron.up {
    background: url(/static/presentation/img/nav_arrow_u.png) no-repeat;
    margin-bottom: 10px
}

.sidebar-navigation .chevron.down {
    background: url(/static/presentation/img/nav_arrow_d.png) no-repeat;
    margin-top: 10px
}

.sidebar-navigation .chevron:hover {
    filter: brightness(120%)
}

.nav-group {
    display: none
}

.nav-group[data-set=1] {
    display: block
}

.sidebar-r-navigation {
    position: fixed;
    top: 50%;
    transform: translateY(-50%);
    right: 0
}

.sidebar-r-navigation .nav-item {
    display: block;
    right: -16px;
    width: 67px;
    height: 50px;
    margin-bottom: 5px;
    position: relative;
    transition: all ease .3s
}

.sidebar-r-navigation .nav-item.dc {
    background-image: url(/static/presentation/img/nav_1_dc.png);
    background-repeat: no-repeat
}

.sidebar-r-navigation .nav-item.web {
    background-image: url(/static/presentation/img/nav_1_web.png);
    background-repeat: no-repeat
}

.sidebar-r-navigation .nav-item.dc:hover,.sidebar-r-navigation .nav-item.dc.active {
    background-image: url(/static/presentation/img/nav_2_dc.png);
    background-repeat: no-repeat;
    right: 0
}

.sidebar-r-navigation .nav-item.web:hover,.sidebar-r-navigation .nav-item.web.active {
    background-image: url(/static/presentation/img/nav_2_web.png);
    background-repeat: no-repeat;
    right: 0
}

.sidebar-r-navigation .nav-item span {
    display: none;
    position: absolute;
    right: 110%;
    top: 50%;
    transform: translateY(-50%);
    color: #b06432;
    font-size: 12px;
    white-space: nowrap;
    display: block
}

.sidebar-navigation .nav-item:hover span,.sidebar-navigation .nav-item.active span {
    display: block
}

.presentation {
    width: 750px
}

.presentation .title {
    font-size: 20px;
    color: #dac0a3;
    text-align: center
}

.presentation .inner {
    color: #dac0a3
}

.introduction,.introduction.en {
    background: url(/static/presentation/img/introduction.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 1060px
}

.introduction.ro {
    background: url(/static/presentation/img/introduction-ro.jpg)
}

.introduction.de {
    background: url(/static/presentation/img/introduction-de.jpg)
}

.introduction.tr {
    background: url(/static/presentation/img/introduction-tr.jpg)
}

.introduction.pt {
    background: url(/static/presentation/img/introduction-pt.jpg)
}

.introduction.pl {
    background: url(/static/presentation/img/introduction-pl.jpg)
}

.introduction.it {
    background: url(/static/presentation/img/introduction-it.jpg)
}

.introduction.fr {
    background: url(/static/presentation/img/introduction-fr.jpg)
}

.introduction.gr {
    background: url(/static/presentation/img/introduction-gr.jpg)
}

.introduction.es {
    background: url(/static/presentation/img/introduction-es.jpg)
}

.introduction.hu {
    background: url(/static/presentation/img/introduction-hu.jpg)
}

.introduction .inner {
    margin-top: 400px
}

.introduction .text {
    width: 453px;
    text-align: center;
    margin-left: -240px;
    font-size: 16px
}

.graphic {
    position: relative
}

.graphic1 {
    background: url(/static/presentation/img/graphic1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 181px
}

.graphic1 .inner {
    margin-top: 17px
}

.graphic1 .text {
    width: 700px;
    text-align: center;
    font-size: 16px
}

.graphic .overlay {
    position: absolute;
    top: 20px;
    left: 0;
    z-index: 1;
    color: #dac0a3
}

.graphic .overlay .title1 {
    position: absolute;
    top: 207px;
    left: 14px;
    width: 278px;
    text-align: center;
    font-size: 16px
}

.graphic .overlay .title2 {
    position: absolute;
    top: 500px;
    left: 449px;
    width: 278px;
    text-align: center;
    font-size: 16px
}

.graphic2 {
    background: url(/static/presentation/img/graphic2.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 80px;
    margin-top: -20px
}

.qol {
    background: url(/static/presentation/img/qol.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 796px
}

.qol .inner {
    margin-top: 19px;
    display: block
}

.selector {
    width: 750px;
    height: 65px;
    margin-top: 55px;
    text-align: center;
    font-size: 16px;
    display: flex;
    align-items: center
}

.eq_changes .selector {
    margin-top: 160px
}

.common_drops .selector {
    margin-top: 141px
}

.selector.sm {
    color: #7a4f32;
    font-size: 12px;
    width: 290px;
    margin-top: -3px;
    position: absolute;
    bottom: 0
}

.selector .arrow {
    width: 34px;
    height: 50px;
    cursor: pointer;
    transition: all .3s ease
}

.selector .arrow.sm {
    width: 29px;
    height: 34px;
    cursor: pointer;
    transition: all .3s ease
}

.selector .arrow:hover,.selector .arrow.sm:hover {
    -webkit-filter: brightness(140%);
    filter: brightness(140%)
}

.selector .arrow.left {
    margin-left: 20px;
    background: url(/static/presentation/img/arrow-l.png) no-repeat
}

.selector .arrow.right {
    margin-right: 20px;
    background: url(/static/presentation/img/arrow-r.png) no-repeat
}

.selector .arrow.sm.left {
    margin-left: 20px;
    background: url(/static/presentation/img/arrow-sm-l.png) no-repeat
}

.selector .arrow.sm.right {
    margin-right: 20px;
    background: url(/static/presentation/img/arrow-sm-r.png) no-repeat
}

.selector .arrow.disabled,.selector .arrow.sm.disabled {
    opacity: .5;
    pointer-events: none;
    cursor: default
}

.list ul li {
    font-size: 16px;
    width: 357px;
    height: 69px;
    margin-bottom: 30px
}

.list {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 19px
}

.split-list {
    list-style-type: none;
    padding: 0;
    margin: 0;
    width: 50%
}

.split-list li {
    width: 357px;
    height: 69px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    justify-content: center
}

.split-list.right-align li {
    justify-content: flex-end;
    padding-right: 10px;
    text-align: right
}

.split-list.left-align li {
    justify-content: flex-start;
    padding-left: 10px;
    text-align: left
}

.split-list li:last-child:nth-child(odd) {
    width: 100%
}

.instructions {
    background: url(/static/presentation/img/instructions.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 2360px
}

.instructions .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.instructions .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 60px
}

.instructions .text2 {
    text-align: center;
    font-size: 16px;
    width: 340px;
    position: absolute;
    top: 1550px;
    margin-left: 360px
}

.instructions .text3 {
    text-align: center;
    font-size: 16px;
    width: 340px;
    position: absolute;
    top: 2050px
}

.beginning {
    background: url(/static/presentation/img/beginning.jpg) no-repeat;
    width: 750px;
    height: 2464px
}

.beginning .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.beginning .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 60px
}

.beginning .text2 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 268px;
    margin-left: 284px
}

.beginning .text3 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 385px;
    margin-left: 296px
}

.beginning .text4 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 753px;
    margin-left: -24px
}

.beginning .text5 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 753px;
    margin-left: 318px
}

.beginning .text6 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 938px;
    margin-left: -24px
}

.beginning .text7 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 1014px;
    margin-left: 318px
}

.beginning .text8 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 1291px;
    margin-left: -24px
}

.beginning .text9 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 1366px;
    margin-left: 318px
}

.beginning .text10 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 1724px;
    margin-left: -24px
}

.beginning .text11 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 1643px;
    margin-left: 318px
}

.beginning .text12 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 2001px;
    margin-left: -24px
}

.beginning .text13 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 1917px;
    margin-left: 318px
}

.beginning .text14 {
    text-align: center;
    font-size: 16px;
    width: 415px;
    position: absolute;
    top: 2172px;
    margin-left: 318px
}

.maps {
    background: url(/static/presentation/img/maps.jpg) no-repeat;
    width: 750px;
    height: 794px
}

.maps .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.maps .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 60px
}

.maps .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 730px;
    margin-left: 18px
}

.maps_wrap {
    background-image: url(/static/presentation/img/maps_base.jpg);
    width: 750px;
    height: 1369px;
    position: relative
}

.maps_wrap .selector,.dungeons_wrap .selector {
    position: absolute;
    top: -40px;
    z-index: 100
}

.maps_display {
    width: 750px;
    height: 1369px
}

.maps_display.map1 {
    background: url(/static/presentation/img/maps_map1.jpg) no-repeat
}

.maps_display.map2 {
    background: url(/static/presentation/img/maps_map2.jpg) no-repeat
}

.maps_display.wonsung {
    background: url(/static/presentation/img/maps_wonsung.jpg) no-repeat
}

.maps_display.seungryong {
    background: url(/static/presentation/img/maps_seungryong.jpg) no-repeat
}

.maps_display.yongbi {
    background: url(/static/presentation/img/maps_yongbi.jpg) no-repeat
}

.maps_display.hwang {
    background: url(/static/presentation/img/maps_hwang.jpg) no-repeat
}

.maps_display.sohan {
    background: url(/static/presentation/img/maps_sohan.jpg) no-repeat
}

.maps_display.sd {
    background: url(/static/presentation/img/maps_sd.jpg) no-repeat
}

.maps_display.snake {
    background: url(/static/presentation/img/maps_snake.jpg) no-repeat
}

.maps_display.doyyumhwan {
    background: url(/static/presentation/img/maps_doyyumhwan.jpg) no-repeat
}

.maps_display.lungsam {
    background: url(/static/presentation/img/maps_lungsam.jpg) no-repeat
}

.maps_display.red_forest {
    background: url(/static/presentation/img/maps_red_forest.jpg) no-repeat
}

.maps_display.grotto {
    background: url(/static/presentation/img/maps_grotto.jpg) no-repeat
}

.maps_display.grotto2 {
    background: url(/static/presentation/img/maps_grotto2.jpg) no-repeat
}

.maps_display.beta {
    background: url(/static/presentation/img/maps_beta.jpg) no-repeat
}

.maps_display.enchanted {
    background: url(/static/presentation/img/maps_enchanted.jpg) no-repeat
}

.maps_display.ochao {
    background: url(/static/presentation/img/maps_ochao.jpg) no-repeat
}

.maps_display .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.maps_display .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 22px
}

.dungeons {
    background: url(/static/presentation/img/dungeons.jpg) no-repeat;
    width: 750px;
    height: 175px
}

.dungeons .inner {
    margin-top: 15px;
    display: block
}

.dungeons .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 73px
}

.dungeons_wrap {
    background-image: url(/static/presentation/img/dungeons_base.jpg);
    width: 750px;
    height: 859px;
    position: relative
}

.dungeons_drop {
    width: 750px;
    height: 859px
}

.dungeons_drop.dt {
    background: url(/static/presentation/img/dungeons_dt.jpg) no-repeat
}

.dungeons_drop.mystic {
    background: url(/static/presentation/img/dungeons_mystic.jpg) no-repeat
}

.dungeons_drop.spider {
    background: url(/static/presentation/img/dungeons_spider.jpg) no-repeat
}

.dungeons_drop.dc {
    background: url(/static/presentation/img/dungeons_dc.jpg) no-repeat
}

.dungeons_drop.beran {
    background: url(/static/presentation/img/dungeons_beran.jpg) no-repeat
}

.dungeons_drop.razador {
    background: url(/static/presentation/img/dungeons_razador.jpg) no-repeat
}

.dungeons_drop.nemere {
    background: url(/static/presentation/img/dungeons_nemere.jpg) no-repeat
}

.dungeons_drop .inner {
    margin-top: 15px;
    display: block
}

.dungeons_drop .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 17px
}

.dungeons_drop .comparison-slider-wrapper {
    margin: 60px auto 0 auto
}

.comparison-slider-wrapper {
    position: relative;
    width: 645px;
    height: 330px;
    margin: 69px auto 0 auto;
    background-color: white;
.comparison-slider {
    position: relative;
    width: 100%;
    margin: 0;
    box-sizing: border-box;
>img {
    width: 100%;
    height: auto;
    display: block
}

.overlay {
    display: none;
    position: absolute;
    width: 250px;
    bottom: 20px;
    right: 20px;
    background-color: rgba(0,0,0,0.4);
    padding: 10px;
    box-sizing: border-box;
    color: #DDD;
    text-align: right;
@include media('tabletUpwards') {
    display: block
}
}

.resize {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 50%;
    overflow: hidden;
>img {
    display: block
}

.overlay {
    right: auto;
    left: 20px;
    text-align: left
}
}

.divider {
    position: absolute;
    width: 2px;
    height: 100%;
    background-color: #382418;
    left: 50%;
    top: 0;
    bottom: 0;
    margin-left: -1px;
    cursor: ew-resize;
&:before {
     content: "";
     position: absolute;
     width: 20px;
     height: 20px;
     left: -9px;
     top: 50%;
     margin-top: -10px;
     background-color: #382418;
     transform: rotate(45deg);
     transition: all .1s ease-in-out
 }

&:after {
     content: "";
     position: absolute;
     width: 12px;
     height: 12px;
     left: -5px;
     top: 50%;
     margin-top: -6px;
     background-color: #533724;
     transform: rotate(45deg);
     transition: all .1s ease-in-out
 }

&.draggable {
&:before {
     width: 30px;
     height: 30px;
     left: -14px;
     margin-top: -15px
 }

&:after {
     width: 20px;
     height: 20px;
     left: -9px;
     margin-top: -10px;
     background-color: #64432d
 }
}
}
}

.caption {
    position: relative;
    width: 100%;
    padding: 10px;
    box-sizing: border-box;
    font-size: 12px;
    font-style: italic
}
}

.comp-handle {
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 2;
    width: 5px;
    height: 100%;
    background: #fff;
    cursor: ew-resize
}

.multi_farm {
    background: url(/static/presentation/img/multifarm.jpg) no-repeat;
    width: 750px;
    height: 874px
}

.multi_farm .inner {
    margin-top: 15px;
    display: block
}

.multi_farm .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 62px
}

.hunting {
    position: relative
}

.hunting1 {
    background: url(/static/presentation/img/hunting1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 243px
}

.hunting1 .inner {
    margin-top: 17px
}

.hunting1 .text {
    width: 700px;
    text-align: center;
    font-size: 16px
}

.hunting2 {
    background: url(/static/presentation/img/hunting3.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 523px;
    margin-top: 0
}

.mount_system {
    background: url(/static/presentation/img/mounts.jpg) no-repeat;
    width: 750px;
    height: 1590px
}

.mount_system .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.mount_system .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 62px
}

.mount_system .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1063px;
    margin-left: 18px
}

.mount_system .text3 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1164px;
    margin-left: 328px
}

.mount_system .text4 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1203px;
    margin-left: 328px
}

.mount_system .text5 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1242px;
    margin-left: 328px
}

.mount_system .text6 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1279px;
    margin-left: 328px
}

.mount_system .text7 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1414px
}

.pet_system {
    background: url(/static/presentation/img/pets.jpg) no-repeat;
    width: 750px;
    height: 2275px
}

.pet_system .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.pet_system .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 46px
}

.pet_system .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 662px;
    margin-left: -90px
}

.pet_system .text3 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 712px;
    margin-left: 50px
}

.pet_system .text4 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 772px;
    margin-left: 33px
}

.pet_system .text5 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 772px;
    margin-left: 20px
}

.pet_system .text6 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 831px;
    margin-left: 33px
}

.pet_system .text7 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 831px;
    margin-left: 20px
}

.pet_system .text8 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 889px;
    margin-left: 33px
}

.pet_system .text9 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 889px;
    margin-left: 20px
}

.pet_system .text10 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 947px;
    margin-left: 33px
}

.pet_system .text11 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 947px;
    margin-left: 20px
}

.pet_system .text12 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1007px;
    margin-left: 33px
}

.pet_system .text13 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1007px;
    margin-left: 20px
}

.pet_system .text14 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1066px;
    margin-left: 33px
}

.pet_system .text15 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1066px;
    margin-left: 20px
}

.pet_system .text16 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1143px;
    margin-left: 97px
}

.pet_system .text17 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1219px;
    margin-left: 34px
}

.pet_system .text18 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1219px;
    margin-left: -34px
}

.pet_system .text19 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1290px;
    margin-left: -10px
}

.pet_system .text20 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1290px;
    margin-left: 10px
}

.pet_system .text21 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1349px;
    margin-left: 34px
}

.pet_system .text22 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1349px;
    margin-left: -34px
}

.pet_system .text23 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1418px;
    margin-left: -10px
}

.pet_system .text24 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1418px;
    margin-left: 10px
}

.pet_system .text25 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1477px;
    margin-left: 34px
}

.pet_system .text26 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1477px;
    margin-left: -34px
}

.pet_system .text27 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1545px;
    margin-left: -10px
}

.pet_system .text28 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1545px;
    margin-left: 10px
}

.pet_system .text29 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1608px;
    margin-left: 34px
}

.pet_system .text30 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1608px;
    margin-left: -34px
}

.pet_system .text31 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1675px;
    margin-left: -10px
}

.pet_system .text32 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1675px;
    margin-left: 10px
}

.pet_system .text33 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1736px;
    margin-left: 34px
}

.pet_system .text34 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1736px;
    margin-left: -34px
}

.pet_system .text35 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1804px;
    margin-left: -10px
}

.pet_system .text36 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1804px;
    margin-left: 10px
}

.pet_system .text37 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1866px;
    margin-left: 34px
}

.pet_system .text38 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1866px;
    margin-left: -34px
}

.pet_system .text39 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1934px;
    margin-left: -10px
}

.pet_system .text40 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1934px;
    margin-left: 10px
}

.pet_system .text41 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1995px;
    margin-left: 34px
}

.pet_system .text42 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1995px;
    margin-left: -34px
}

.pet_system .text43 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 2062px;
    margin-left: -10px
}

.pet_system .text44 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 2062px;
    margin-left: 10px
}

.pet_system .text45 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 2124px;
    margin-left: 34px
}

.pet_system .text46 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 2124px;
    margin-left: -34px
}

.pet_system .text47 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 2191px;
    margin-left: -10px
}

.pet_system .text48 {
    text-align: -webkit-right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 2191px;
    margin-left: 10px
}

.battle_pass {
    position: relative
}

.battle_pass1 {
    background: url(/static/presentation/img/battlepass1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 556px
}

.battle_pass1 .inner {
    margin-top: 17px
}

.battle_pass1 .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 119px;
    margin-left: -290px
}

.battle_pass1 .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 284px;
    margin-left: -290px
}

.battle_pass2 {
    background: url(/static/presentation/img/battlepass3.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 94px;
    margin-top: 0
}

.challenges {
    position: relative
}

.challenges1 {
    background: url(/static/presentation/img/challenges1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 798px
}

.challenges1 .inner {
    margin-top: 17px;
    display: block;
    width: 750px;
    position: relative
}

.challenges1 .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 71px;
    margin-left: 24px
}

.challenges1 .text2 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 649px;
    margin-left: 118px
}

.challenges1 .text3 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1184px;
    margin-left: 30px
}

.challenges2 {
    background: url(/static/presentation/img/challenges3.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 293px;
    margin-top: 0
}

.costumes {
    position: relative
}

.costumes1 {
    background: url(/static/presentation/img/costume1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 1992px
}

.costumes1 .inner {
    margin-top: 17px;
    width: 749px
}

.costumes1 .text {
    text-align: center;
    font-size: 16px;
    width: 470px;
    position: absolute;
    top: 198px;
    margin-left: 12px
}

.costumes1 .text2 {
    text-align: center;
    font-size: 16px;
    width: 612px;
    position: absolute;
    top: 384px;
    margin-left: 110px
}

.costumes1 .text3 {
    text-align: center;
    font-size: 16px;
    width: 613px;
    position: absolute;
    top: 528px;
    margin-left: 120px
}

.costumes1 .text4 {
    text-align: center;
    font-size: 16px;
    width: 452px;
    position: absolute;
    top: 728px;
    margin-left: 15px
}

.costumes1 .text5 {
    text-align: center;
    font-size: 16px;
    width: 452px;
    position: absolute;
    top: 1044px;
    margin-left: 34px
}

.costumes1 .text6 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1666px;
    margin-left: 123px
}

.costumes1 .text7 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1756px;
    margin-left: 21px
}

.costumes3 {
    background: url(/static/presentation/img/costume3.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 56px;
    margin-top: 0
}

.ranking {
    background: url(/static/presentation/img/ranking.jpg) no-repeat;
    width: 750px;
    height: 2158px
}

.ranking .inner {
    margin-top: 15px;
    display: block;
    width: 750px;
    position: relative
}

.ranking .text {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 111px;
    margin-left: 176px
}

.ranking .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 632px;
    margin-left: 29px
}

.ranking .text3 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 781px;
    margin-left: 176px
}

.ranking .text4 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1302px;
    margin-left: 22px
}

.ranking .text5 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1467px;
    margin-left: 176px
}

.ranking .text6 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1986px;
    margin-left: 22px
}

.daily_quests {
    background: url(/static/presentation/img/quests1.jpg) no-repeat;
    width: 750px;
    height: 869px
}

.daily_quests .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.daily_quests .text {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 105px;
    margin-left: -238px
}

.daily_quests .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 160px;
    margin-left: -315px
}

.daily_quests .text3 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 250px;
    margin-left: -281px
}

.daily_quests .text4 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 288px;
    margin-left: -281px
}

.daily_quests .text5 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 326px;
    margin-left: -281px
}

.daily_quests .text6 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 364px;
    margin-left: -281px
}

.daily_quests .text7 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 402px;
    margin-left: -281px
}

.daily_quests .text8 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 440px;
    margin-left: -281px
}

.daily_quests .text9 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 478px;
    margin-left: -281px
}

.daily_quests .text10 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 516px;
    margin-left: -281px
}

.daily_quests .text11 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 554px;
    margin-left: -281px
}

.daily_quests .text12 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 775px;
    margin-left: -305px
}

.missionbook {
    background: url(/static/presentation/img/quests2.jpg) no-repeat;
    width: 750px;
    height: 945px
}

.missionbook .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.missionbook .text {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 0;
    margin-left: -271px
}

.missionbook .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 70px;
    margin-left: -344px
}

.biologist_quests {
    background: url(/static/presentation/img/quests3.jpg) no-repeat;
    width: 750px;
    height: 2333px
}

.biologist_quests .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.biologist_quests .text {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 0;
    margin-left: -271px
}

.biologist_quests .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 80px;
    margin-left: -349px
}

.biologist_quests .text3 {
    text-align: left;
    font-size: 16px;
    width: 610px;
    position: absolute;
    top: 225px;
    margin-left: -256px
}

.biologist_quests .text4 {
    text-align: left;
    font-size: 16px;
    width: 610px;
    position: absolute;
    top: 343px;
    margin-left: -256px
}

.biologist_quests .text5 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 520px;
    margin-left: -149px
}

.biologist_quests .text6 {
    text-align: center;
    font-size: 16px;
    width: 101px;
    position: absolute;
    top: 573px;
    margin-left: -334px
}

.biologist_quests .text7 {
    text-align: center;
    font-size: 16px;
    width: 101px;
    position: absolute;
    top: 573px;
    margin-left: -234px
}

.biologist_quests .text8 {
    text-align: center;
    font-size: 16px;
    width: 154px;
    position: absolute;
    top: 573px;
    margin-left: -133px
}

.biologist_quests .text9 {
    text-align: center;
    font-size: 16px;
    width: 310px;
    position: absolute;
    top: 573px;
    margin-left: 27px
}

.biologist_quests .text10 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 653px;
    margin-left: -234px
}

.biologist_quests .text11 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 653px;
    margin-left: -133px
}

.biologist_quests .text12 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 644px;
    margin-left: 27px
}

.biologist_quests .text13 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 725px;
    margin-left: -234px
}

.biologist_quests .text14 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 725px;
    margin-left: -133px
}

.biologist_quests .text15 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 714px;
    margin-left: 27px
}

.biologist_quests .text16 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 792px;
    margin-left: -234px
}

.biologist_quests .text17 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 792px;
    margin-left: -133px
}

.biologist_quests .text18 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 792px;
    margin-left: 27px
}

.biologist_quests .text19 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 862px;
    margin-left: -234px
}

.biologist_quests .text20 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 862px;
    margin-left: -133px
}

.biologist_quests .text21 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 862px;
    margin-left: 27px
}

.biologist_quests .text22 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 930px;
    margin-left: -234px
}

.biologist_quests .text23 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 930px;
    margin-left: -133px
}

.biologist_quests .text24 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 930px;
    margin-left: 27px
}

.biologist_quests .text25 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 999px;
    margin-left: -234px
}

.biologist_quests .text26 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 999px;
    margin-left: -133px
}

.biologist_quests .text27 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 999px;
    margin-left: 27px
}

.biologist_quests .text28 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 1069px;
    margin-left: -234px
}

.biologist_quests .text29 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 1069px;
    margin-left: -133px
}

.biologist_quests .text30 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 1069px;
    margin-left: 27px
}

.biologist_quests .text31 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 1139px;
    margin-left: -234px
}

.biologist_quests .text32 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 1139px;
    margin-left: -133px
}

.biologist_quests .text33 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 1139px;
    margin-left: 27px
}

.biologist_quests .text34 {
    text-align: left;
    font-size: 16px;
    width: 310px;
    position: absolute;
    top: 1299px;
    margin-left: -134px
}

.biologist_quests .text35 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 1374px;
    margin-left: -234px
}

.biologist_quests .text36 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 1374px;
    margin-left: -133px
}

.biologist_quests .text37 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 1354px;
    margin-left: 27px
}

.biologist_quests .text38 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 1440px;
    margin-left: -234px
}

.biologist_quests .text39 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 1440px;
    margin-left: -133px
}

.biologist_quests .text40 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 1422px;
    margin-left: 27px
}

.biologist_quests .text41 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 1510px;
    margin-left: -234px
}

.biologist_quests .text42 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 1510px;
    margin-left: -133px
}

.biologist_quests .text43 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 1490px;
    margin-left: 27px
}

.biologist_quests .text44 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1564px;
    margin-left: -353px
}

.biologist_quests .text45 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1780px;
    margin-left: -143px
}

.biologist_quests .text46 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 1855px;
    margin-left: -234px
}

.biologist_quests .text47 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 1855px;
    margin-left: -133px
}

.biologist_quests .text48 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 1855px;
    margin-left: 27px
}

.biologist_quests .text49 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 1925px;
    margin-left: -234px
}

.biologist_quests .text50 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 1925px;
    margin-left: -133px
}

.biologist_quests .text51 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 1925px;
    margin-left: 27px
}

.biologist_quests .text52 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 1995px;
    margin-left: -234px
}

.biologist_quests .text53 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 1995px;
    margin-left: -133px
}

.biologist_quests .text54 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 1995px;
    margin-left: 27px
}

.biologist_quests .text55 {
    text-align: center;
    font-size: 14px;
    width: 101px;
    position: absolute;
    top: 2063px;
    margin-left: -234px
}

.biologist_quests .text56 {
    text-align: center;
    font-size: 14px;
    width: 154px;
    position: absolute;
    top: 2063px;
    margin-left: -133px
}

.biologist_quests .text57 {
    text-align: center;
    font-size: 14px;
    width: 310px;
    position: absolute;
    top: 2063px;
    margin-left: 27px
}

.biologist_quests .text58 {
    text-align: left;
    font-size: 16px;
    width: 310px;
    position: absolute;
    top: 2150px;
    margin-left: -270px
}

.biologist_quests .text59 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 2220px;
    margin-left: -350px
}

.story_quests {
    background: url(/static/presentation/img/quests4.jpg) no-repeat;
    width: 750px;
    height: 971px
}

.story_quests .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.story_quests .inner .quests {
    width: 290px
}

.story_quests .inner .quests .title {
    font-size: 16px;
    text-align: center;
    line-height: 44px;
    height: 44px
}

.story_quests .inner .quests .list-wrap {
    padding: 27px 7px 7px 7px
}

.story_quests .inner .quests .list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: block
}

.story_quests .inner .quests .list li {
    background: url(/static/presentation/img/list_decoration.png) no-repeat left center;
    padding-left: 30px;
    min-height: 23px;
    display: flex;
    align-items: center;
    margin-bottom: 16px;
    font-size: 14px
}

.story_quests .inner .quests.guard {
    position: absolute;
    right: 4px;
    top: -15px;
    height: 282px;
    display: block;
    text-align: left
}

.story_quests .inner .quests.uriel {
    position: absolute;
    left: 78px;
    top: -15px;
    height: 488px;
    display: block
}

.story_quests .inner .quests.angmur {
    position: absolute;
    right: 4px;
    top: 277px;
    height: 488px;
    display: block
}

.story_quests .inner .quests.leechung {
    position: absolute;
    left: 78px;
    top: 483px;
    height: 395px;
    display: block
}

.dark_shrines {
    background: url(/static/presentation/img/dark_shrines.jpg) no-repeat;
    width: 750px;
    height: 824px
}

.dark_shrines .inner {
    margin-top: 15px;
    display: block
}

.dark_shrines .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 62px
}

.cursed_rocks {
    position: relative
}

.cursed_rocks1 {
    background: url(/static/presentation/img/cursed_rocks1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 306px
}

.cursed_rocks1 .inner {
    margin-top: 17px
}

.cursed_rocks1 .text {
    width: 700px;
    text-align: center;
    font-size: 16px
}

.cursed_rocks1 .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 738px;
    margin-left: 8px
}

.cursed_rocks2 {
    background: url(/static/presentation/img/cursed_rocks3.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 180px;
    margin-top: 0
}

.personal_shop {
    background: url(/static/presentation/img/personal_shop.jpg) no-repeat;
    width: 750px;
    height: 1795px
}

.personal_shop .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.personal_shop .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 62px
}

.personal_shop .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 274px;
    margin-left: 8px
}

.personal_shop .text3 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 401px;
    margin-left: 48px
}

.personal_shop .text4 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 439px;
    margin-left: 48px
}

.personal_shop .text5 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 477px;
    margin-left: 48px
}

.personal_shop .text6 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 515px;
    margin-left: 48px
}

.personal_shop .text7 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 553px;
    margin-left: 48px
}

.personal_shop .text8 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 591px;
    margin-left: 48px
}

.personal_shop .text9 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 629px;
    margin-left: 48px
}

.personal_shop .text10 {
    text-align: center;
    font-size: 16px;
    width: 517px;
    position: absolute;
    top: 710px;
    margin-left: -4px
}

.personal_shop .text11 {
    text-align: center;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 1010px;
    margin-left: 9px
}

.personal_shop .text12 {
    text-align: center;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 1320px;
    margin-left: 250px
}

.shop_search {
    background: url(/static/presentation/img/shopsearch.jpg) no-repeat;
    width: 750px;
    height: 1151px
}

.shop_search .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.shop_search .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 62px
}

.shop_search .text2 {
    text-align: left;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 272px;
    margin-left: 54px
}

.shop_search .text3 {
    text-align: left;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 300px;
    margin-left: 54px
}

.shop_search .text4 {
    text-align: left;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 328px;
    margin-left: 54px
}

.shop_search .text5 {
    text-align: left;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 356px;
    margin-left: 54px
}

.shop_search .text6 {
    text-align: left;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 384px;
    margin-left: 54px
}

.shop_search .text7 {
    text-align: left;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 412px;
    margin-left: 54px
}

.shop_search .text8 {
    text-align: left;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 440px;
    margin-left: 54px
}

.shop_search .text9 {
    text-align: left;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 468px;
    margin-left: 54px
}

.shoulder_sash {
    background: url(/static/presentation/img/sashes.jpg) no-repeat;
    width: 750px;
    height: 1070px
}

.shoulder_sash .inner {
    margin-top: 15px;
    display: block
}

.shoulder_sash .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 62px
}

.alchemy {
    background: url(/static/presentation/img/alchemy.jpg) no-repeat;
    width: 750px;
    height: 1597px
}

.alchemy .inner {
    margin-top: 15px;
    display: block;
    width: 749px;
    position: relative
}

.alchemy .text {
    text-align: left;
    font-size: 16px;
    width: 417px;
    position: absolute;
    top: 108px;
    margin-left: 103px
}

.alchemy .text2 {
    text-align: left;
    font-size: 16px;
    width: 499px;
    position: absolute;
    top: 176px;
    margin-left: 32px
}

.alchemy .text3 {
    text-align: center;
    font-size: 12px;
    width: 380px;
    position: absolute;
    top: 583px;
    margin-left: -3px
}

.alchemy .text4 {
    text-align: center;
    font-size: 12px;
    width: 344px;
    position: absolute;
    top: 583px;
    margin-left: 394px
}

.alchemy .text5 {
    text-align: center;
    font-size: 12px;
    width: 344px;
    position: absolute;
    top: 924px;
    margin-left: -3px
}

.alchemy .text6 {
    text-align: center;
    font-size: 12px;
    width: 344px;
    position: absolute;
    top: 924px;
    margin-left: 394px
}

.alchemy .text7 {
    text-align: center;
    font-size: 12px;
    width: 344px;
    position: absolute;
    top: 1265px;
    margin-left: -3px
}

.alchemy .text8 {
    text-align: center;
    font-size: 12px;
    width: 344px;
    position: absolute;
    top: 1265px;
    margin-left: 394px
}

.gaya {
    background: url(/static/presentation/img/gaya.jpg) no-repeat;
    width: 750px;
    height: 824px
}

.gaya .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.gaya .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 81px;
    margin-left: -283px
}

.buffi {
    background: url(/static/presentation/img/buffi.jpg) no-repeat;
    width: 750px;
    height: 652px
}

.buffi .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.buffi .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 100px;
    margin-left: -288px
}

.buffi .text2 {
    text-align: center;
    font-size: 16px;
    width: 400px;
    position: absolute;
    top: 270px;
    margin-left: -267px
}

.common_drops {
    position: relative
}

.common_drops1 {
    background: url(/static/presentation/img/common_drops1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 244px
}

.common_drops1 .inner {
    margin-top: 17px
}

.common_drops1 .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 100px;
    margin-left: 25px
}

.common_drops1 .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 201px;
    margin-left: -267px
}

.drop-wrap {
    background: url(/static/presentation/img/common_drops_base.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 579px;
    margin-top: 0
}

.common_drops2 {
    width: 750px;
    height: 579px;
    margin-top: 0
}

.common_drops2.p1 {
    background: url(/static/presentation/img/common_drops_p1.jpg);
    background-repeat: no-repeat
}

.common_drops2.p2 {
    background: url(/static/presentation/img/common_drops_p2.jpg);
    background-repeat: no-repeat
}

.common_drops2.p3 {
    background: url(/static/presentation/img/common_drops_p3.jpg);
    background-repeat: no-repeat
}

.common_drops3 {
    background: url(/static/presentation/img/common_drops2.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 427px;
    margin-top: 0
}

.common_drops3 .inner {
    margin-top: 17px
}

.common_drops3 .text {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 885px;
    margin-left: -182px
}

.common_drops3 .text2 {
    text-align: center;
    font-size: 16px;
    width: 435px;
    position: absolute;
    top: 962px;
    margin-left: -346px
}

.belts {
    background: url(/static/presentation/img/belts.jpg) no-repeat;
    width: 750px;
    height: 1398px
}

.belts .inner {
    margin-top: 15px;
    display: block;
    width: 749px;
    position: relative
}

.belts .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 85px;
    margin-left: 27px
}

.belts .text2 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 255px;
    margin-left: 107px
}

.belts .text3 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 363px;
    margin-left: 110px
}

.belts .text4 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 456px;
    margin-left: 110px
}

.belts .text5 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 558px;
    margin-left: 110px
}

.belts .text6 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 652px;
    margin-left: 110px
}

.belts .text7 {
    text-align: right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 750px;
    margin-left: -30px
}

.belts .text8 {
    text-align: right;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 865px;
    margin-left: -60px
}

.belts .text9 {
    text-align: right;
    font-size: 16px;
    width: 200px;
    position: absolute;
    top: 960px;
    margin-left: 440px
}

.belts .text10 {
    text-align: right;
    font-size: 16px;
    width: 200px;
    position: absolute;
    top: 1055px;
    margin-left: 440px
}

.belts .text11 {
    text-align: right;
    font-size: 16px;
    width: 200px;
    position: absolute;
    top: 1150px;
    margin-left: 440px
}

.belts .text12 {
    text-align: right;
    font-size: 16px;
    width: 200px;
    position: absolute;
    top: 1245px;
    margin-left: 440px
}

.eq_changes {
    position: relative
}

.eq_changes1 {
    background: url(/static/presentation/img/eq_changes.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 264px
}

.eq_changes1 .inner {
    margin-top: 17px
}

.eq_changes1 .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 102px;
    margin-left: 25px
}

.eq_changes1 .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 222px;
    margin-left: -267px
}

.eq-wrap {
    background: url(/static/presentation/img/eq_changes_base.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 482px;
    margin-top: 0
}

.eq_changes2 {
    width: 750px;
    height: 482px;
    margin-top: 0
}

.eq_changes2.p1 {
    background: url(/static/presentation/img/eq_changes_p1.jpg);
    background-repeat: no-repeat
}

.eq_changes2.p2 {
    background: url(/static/presentation/img/eq_changes_p2.jpg);
    background-repeat: no-repeat
}

.eq_changes2.p3 {
    background: url(/static/presentation/img/eq_changes_p3.jpg);
    background-repeat: no-repeat
}

.eq_changes2.p4 {
    background: url(/static/presentation/img/eq_changes_p4.jpg);
    background-repeat: no-repeat
}

.eq_changes .row-base {
    display: block
}

.eq_changes .row1 {
    margin-top: 94px;
    display: flex
}

.eq_changes .row2 {
    margin-top: 63px;
    display: flex
}

.eq_changes .bonus-text {
    width: 247px;
    text-align: center;
    font-size: 14px;
    color: #dac0a3;
    height: 65px
}

.upgrade_system {
    background: url(/static/presentation/img/upgrade_system.jpg) no-repeat;
    width: 750px;
    height: 686px
}

.upgrade_system .inner {
    margin-top: 15px;
    display: block
}

.worldboss {
    background: url(/static/presentation/img/worldboss.jpg) no-repeat;
    width: 750px;
    height: 1210px
}

.worldboss .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.worldboss .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 95px;
    margin-left: -300px
}

.spirit_stones {
    background: url(/static/presentation/img/spirit_stones.jpg) no-repeat;
    width: 750px;
    height: 823px
}

.spirit_stones .inner {
    margin-top: 15px;
    display: block;
    width: 749px;
    position: relative
}

.spirit_stones .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 95px;
    margin-left: 29px
}

.bonus_system {
    background: url(/static/presentation/img/bonus_system.jpg) no-repeat;
    width: 750px;
    height: 860px
}

.bonus_system .inner {
    margin-top: 15px;
    display: block;
    width: 749px;
    position: relative
}

.bonus_system .text {
    text-align: center;
    font-size: 16px;
    line-height: 17px;
    height: 35px;
    margin-top: 70px;
    width: 100%
}

.bonus_system .text2 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    margin-top: 37px;
    margin-left: 107px;
    height: 53px;
    width: 623px;
    display: flex;
    justify-content: center;
    align-items: center
}

.bonus_system .text3 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    margin-top: 27px;
    margin-left: 107px;
    height: 53px;
    width: 623px;
    display: flex;
    justify-content: center;
    align-items: center
}

.bonus_system .text4 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    height: 35px;
    margin-top: 24px;
    margin-left: 49px;
    height: 53px;
    width: 277px;
    display: flex;
    justify-content: center;
    align-items: center
}

.bonus_system .text5 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    margin-top: -53px;
    margin-left: 407px;
    height: 53px;
    width: 277px;
    display: grid;
    justify-content: center;
    align-items: center
}

.bonus_system .text6 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    margin-top: 52px;
    margin-left: 33px;
    height: 53px;
    width: 607px;
    display: grid;
    justify-content: center;
    align-items: center
}

.bonus_system .text7 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    margin-top: 96px;
    margin-left: 30px;
    width: 706px;
    display: block
}

.bonus_system .text8 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    margin-top: 25px;
    margin-left: 58px;
    height: 30px;
    width: 300px;
    display: block
}

.bonus_system .text9 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    margin-top: 20px;
    margin-left: 25px;
    width: 706px;
    display: block
}

.bonus_system .text10 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    margin-top: 30px;
    margin-left: 58px;
    height: 30px;
    width: 300px;
    display: block
}

.bonus_system .text11 {
    text-align: left;
    font-size: 16px;
    line-height: 17px;
    margin-top: 20px;
    margin-left: 25px;
    width: 706px;
    display: block
}

.passive_skills {
    background: url(/static/presentation/img/passive_skills.jpg) no-repeat;
    width: 750px;
    height: 2362px
}

.passive_skills .inner {
    margin-top: 15px;
    display: block;
    width: 749px;
    position: relative
}

.passive_skills .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 90px;
    margin-left: 20px
}

.passive_skills .text2 {
    text-align: center;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 152px;
    margin-left: -160px
}

.passive_skills .text3 {
    text-align: center;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 152px;
    margin-left: 200px
}

.passive_skills .text4 {
    text-align: center;
    font-size: 14px;
    width: 300px;
    position: absolute;
    top: 370px;
    margin-left: 40px
}

.passive_skills .text5 {
    text-align: center;
    font-size: 14px;
    width: 254px;
    position: absolute;
    top: 370px;
    margin-left: 415px
}

.passive_skills .text6 {
    text-align: left;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 505px;
    margin-left: 210px
}

.passive_skills .text7 {
    text-align: left;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 535px;
    margin-left: 210px
}

.passive_skills .text8 {
    text-align: left;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 695px;
    margin-left: 210px
}

.passive_skills .text9 {
    text-align: left;
    font-size: 14px;
    width: 523px;
    position: absolute;
    top: 730px;
    margin-left: 210px
}

.passive_skills .text10 {
    text-align: left;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 885px;
    margin-left: 210px
}

.passive_skills .text11 {
    text-align: left;
    font-size: 14px;
    width: 523px;
    position: absolute;
    top: 920px;
    margin-left: 210px
}

.passive_skills .text12 {
    text-align: left;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 1080px;
    margin-left: 210px
}

.passive_skills .text13 {
    text-align: left;
    font-size: 14px;
    width: 523px;
    position: absolute;
    top: 1115px;
    margin-left: 210px
}

.passive_skills .text14 {
    text-align: left;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 1265px;
    margin-left: 210px
}

.passive_skills .text15 {
    text-align: left;
    font-size: 14px;
    width: 523px;
    position: absolute;
    top: 1305px;
    margin-left: 210px
}

.passive_skills .text16 {
    text-align: left;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 1460px;
    margin-left: 210px
}

.passive_skills .text17 {
    text-align: left;
    font-size: 14px;
    width: 523px;
    position: absolute;
    top: 1500px;
    margin-left: 210px
}

.passive_skills .text18 {
    text-align: left;
    font-size: 14px;
    width: 700px;
    position: absolute;
    top: 1650px;
    margin-left: 210px
}

.passive_skills .text19 {
    text-align: left;
    font-size: 14px;
    width: 523px;
    position: absolute;
    top: 1695px;
    margin-left: 210px
}

.passive_skills .text20 {
    text-align: left;
    font-size: 16px;
    width: 523px;
    position: absolute;
    top: 1826px;
    margin-left: 123px
}

.passive_skills .text21 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1890px;
    margin-left: 24px
}

.passive_skills .text22 {
    text-align: left;
    font-size: 16px;
    width: 434px;
    position: absolute;
    top: 1973px;
    margin-left: 120px
}

.mining {
    position: relative
}

.mining1 {
    background: url(/static/presentation/img/mining1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 737px
}

.mining1 .inner {
    margin-top: 17px
}

.mining1 .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 100px;
    margin-left: -312px
}

.mining1 .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 223px;
    margin-left: -312px
}

.mining1 .text3 {
    text-align: left;
    font-size: 14px;
    width: 636px;
    position: absolute;
    top: 304px;
    margin-left: -230px
}

.mining1 .text4 {
    text-align: left;
    font-size: 14px;
    width: 631px;
    position: absolute;
    top: 346px;
    margin-left: -230px
}

.mining1 .text5 {
    text-align: left;
    font-size: 14px;
    width: 637px;
    position: absolute;
    top: 385px;
    margin-left: -230px
}

.mining2 {
    background: url(/static/presentation/img/mining3.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 64px;
    margin-top: 0
}

.fishing {
    position: relative
}

.fishing1 {
    background: url(/static/presentation/img/fishing1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 606px
}

.fishing1 .inner {
    margin-top: 17px
}

.fishing1 .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 95px;
    margin-left: -312px
}

.fishing1 .text2 {
    text-align: left;
    font-size: 16px;
    width: 588px;
    position: absolute;
    top: 276px;
    margin-left: -237px
}

.fishing2 {
    background: url(/static/presentation/img/fishing3.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 78px;
    margin-top: 0
}

.inventories {
    background: url(/static/presentation/img/inventories.jpg) no-repeat;
    width: 750px;
    height: 923px
}

.inventories .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.inventories .text {
    text-align: left;
    font-size: 16px;
    width: 471px;
    position: absolute;
    top: 80px;
    margin-left: -214px
}

.inventories .text2 {
    text-align: left;
    font-size: 16px;
    width: 471px;
    position: absolute;
    top: 161px;
    margin-left: -165px
}

.inventories .text3 {
    text-align: left;
    font-size: 16px;
    width: 471px;
    position: absolute;
    top: 199px;
    margin-left: -165px
}

.inventories .text4 {
    text-align: left;
    font-size: 16px;
    width: 471px;
    position: absolute;
    top: 237px;
    margin-left: -165px
}

.inventories .text5 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 815px;
    margin-left: -213px
}

.guild_system {
    background: url(/static/presentation/img/guild_system.jpg) no-repeat;
    width: 750px;
    height: 999px
}

.guild_system .inner {
    margin-top: 15px;
    display: block;
    position: relative
}

.guild_system .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 90px;
    margin-left: -288px
}

.event_calendar {
    position: relative
}

.event_calendar1 {
    background: url(/static/presentation/img/event_calendar1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 824px
}

.event_calendar1 .inner {
    margin-top: 17px;
    width: 749px
}

.event_calendar1 .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 110px;
    margin-left: 26px
}

.event_calendar_wrap {
    background: url(/static/presentation/img/event_calendar_base.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 210px;
    position: relative
}

.event_calendar2 {
    width: 750px;
    height: 210px
}

.event_calendar2.p1 {
    background: url(/static/presentation/img/event_calendar_p1.jpg)
}

.event_calendar2.p2 {
    background: url(/static/presentation/img/event_calendar_p2.jpg)
}

.event_calendar2.p3 {
    background: url(/static/presentation/img/event_calendar_p3.jpg)
}

.event_calendar2.p4 {
    background: url(/static/presentation/img/event_calendar_p4.jpg)
}

.event_calendar2.p5 {
    background: url(/static/presentation/img/event_calendar_p5.jpg)
}

.event_calendar2.p6 {
    background: url(/static/presentation/img/event_calendar_p6.jpg)
}

.event_calendar2.p7 {
    background: url(/static/presentation/img/event_calendar_p7.jpg)
}

.event_calendar2.p8 {
    background: url(/static/presentation/img/event_calendar_p8.jpg)
}

.event_calendar2.p9 {
    background: url(/static/presentation/img/event_calendar_p9.jpg)
}

.event_calendar2.p10 {
    background: url(/static/presentation/img/event_calendar_p10.jpg)
}

.event_calendar2 .event_list {
    height: 194px;
    display: flex;
    margin-left: 68px;
    margin-top: 7px
}

.event_calendar2 .event {
    color: #dac0a3;
    font-size: 12px;
    text-align: center;
    margin-bottom: 0;
    width: 144px;
    height: 194px;
    margin-right: 12px;
    position: relative
}

.event_calendar2 .event span {
    font-size: 12px;
    position: absolute;
    bottom: 10px;
    right: 0;
    left: 0
}

.event_calendar_wrap .selector {
    position: absolute;
    margin-top: 77px;
    z-index: 40
}

.event_calendar_wrap .selector .arrow.left {
    margin-left: 10px
}

.event_calendar_wrap .selector .arrow.right {
    margin-right: 11px
}

.event_calendar3 {
    background: url(/static/presentation/img/event_calendar2.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 79px;
    margin-top: 0
}

.game_options {
    position: relative
}

.game_options1 {
    background: url(/static/presentation/img/game_options1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 702px
}

.game_options1 .inner {
    margin-top: 17px
}

.game_options1 .text {
    text-align: center;
    font-size: 16px;
    width: 300px;
    position: absolute;
    top: 228px;
    margin-left: -281px
}

.game_options1 .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 492px;
    margin-left: -289px
}

.game_options1 .text3 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 597px;
    margin-left: -289px
}

.game_options2 {
    background: url(/static/presentation/img/game_options3.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 323px
}

.game_options2 .inner {
    margin-top: 17px
}

.game_options2 .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1146px;
    margin-left: -360px
}

.game_options2 .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1254px;
    margin-left: -347px
}

.game_options3 {
    background: url(/static/presentation/img/game_options5.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 318px
}

.game_options3 .inner {
    margin-top: 17px
}

.game_options3 .text {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1793px;
    margin-left: -360px
}

.game_options3 .text2 {
    text-align: center;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 1900px;
    margin-left: -347px
}

.game_options4 {
    background: url(/static/presentation/img/game_options7.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 84px
}

.vote4buff {
    background: url(/static/presentation/img/vote4buff.jpg) no-repeat;
    width: 750px;
    height: 536px
}

.vote4buff .inner {
    margin-top: 15px;
    display: block
}

.vote4buff .text {
    width: 700px;
    text-align: center;
    font-size: 16px;
    margin-top: 62px
}

.premium {
    position: relative
}

.premium1 {
    background: url(/static/presentation/img/premium1.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 169px
}

.premium1 .inner {
    margin-top: 17px
}

.premium1 .text {
    width: 700px;
    text-align: center;
    font-size: 16px
}

.premium1 .text2 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 190px;
    margin-left: 56px
}

.premium1 .text3 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 228px;
    margin-left: 56px
}

.premium1 .text4 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 266px;
    margin-left: 56px
}

.premium1 .text5 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 304px;
    margin-left: 56px
}

.premium1 .text6 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 342px;
    margin-left: 56px
}

.premium1 .text7 {
    text-align: left;
    font-size: 16px;
    width: 700px;
    position: absolute;
    top: 380px;
    margin-left: 56px
}

.premium1 .text8 {
    text-align: center;
    font-size: 16px;
    width: 400px;
    position: absolute;
    top: 645px;
    margin-left: -3px
}

.premium2 {
    background: url(/static/presentation/img/premium3.jpg);
    background-repeat: no-repeat;
    width: 750px;
    height: 686px
}

@media (max-width: 850px) {
    .sidebar-navigation,.sidebar-r-navigation {
        display:none
    }
}

.hidden {
    display: none !important
}

.footer {
    text-align: center;
    font-size: 12px;
    left: 20px;
    position: absolute;
    bottom: 10px;
    color: #dac0a3
}

.title,.text,.text2,.text3,.text4,.text5,.text6,.text7,.text8,.text9,.text10,.text11,.text12,.text13,.text14,.text15,.text16,.text17,.text18,.text19,.text20,.text21,.text22,.text23,.text24,.text25,.text26,.text27,.text28,.text29,.text30,.text31,.text32,.text33,.text34,.text35,.text36,.text37,.text38,.text39,.text40,.text41,.text42,.text43,.text44,.text45,.text46,.text47,.text48,.text49,.text50,.text51,.text52,.text53,.text54,.text55,.text56,.text57,.text58,.text59 {
    transition: all .3s
}

.title:hover {
    transform: scale(1.1)
}

.title:hover,.text:hover,.text2:hover,.text3:hover,.text4:hover,.text5:hover,.text6:hover,.text7:hover,.text8:hover,.text9:hover,.text10:hover,.text11:hover,.text12:hover,.text13:hover,.text14:hover,.text15:hover,.text16:hover,.text17:hover,.text18:hover,.text19:hover,.text20:hover,.text21:hover,.text22:hover,.text23:hover,.text24:hover,.text25:hover,.text26:hover,.text27:hover,.text28:hover,.text29:hover,.text30:hover,.text31:hover,.text32:hover,.text33:hover,.text34:hover,.text35:hover,.text36:hover,.text37:hover,.text38:hover,.text39:hover,.text40:hover,.text41:hover,.text42:hover,.text43:hover,.text44:hover,.text45:hover,.text46:hover,.text47:hover,.text48:hover,.text49:hover,.text50:hover,.text51:hover,.text52:hover,.text53:hover,.text54:hover,.text55:hover,.text56:hover,.text57:hover,.text58:hover,.text59:hover {
    color: #fff8f0
}

.modal {
    display: block;
    position: fixed;
    z-index: 1050;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.5);
    padding-top: 160px;
    transition: all .5s ease
}

.modal-content {
    background-color: #57412f;
    border: 1px solid #745740;
    margin: auto;
    padding: 0;
    border-radius: 5px;
    width: 40%;
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: opacity .2s ease,transform .2s ease;
    opacity: 1;
    transform: scale(1)
}

.close {
    color: #dac0a3;
    float: right;
    font-size: 20px;
    font-weight: bold;
    cursor: pointer
}

.close:hover,.close:focus {
    color: #f6dabb;
    text-decoration: none;
    cursor: pointer
}

.modal-header {
    padding: 10px 16px;
    border-radius: 5px;
    background-color: #4a3626;
    color: #dac0a3;
    border-bottom: 1px solid #745740;
    display: block !important;
    margin: initial
}

.modal-body {
    padding: 15px;
    font-size: 14px;
    color: #dac0a3
}

.modal-body a {
    color: #dac0a3;
    text-decoration: none
}

.modal-body a:hover {
    color: #f6dabb;
    text-decoration: none
}

.modal-body img {
    display: block;
    margin-left: auto;
    margin-right: auto;
    max-width: 100%
}