@font-face {
    font-family: googlesans;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local('GoogleSans-Regular'), local('GoogleSans-Regular'), url(../site-fonts/GoogleSans-Regular.woff2) format('woff2')
}

@font-face {
    font-family: googlesans;
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: local('GoogleSans-Medium'), local('GoogleSans-Medium'), url(../site-fonts/GoogleSans-Medium.woff2) format('woff2')
}

@font-face {
    font-family: googlesans;
    font-style: italic;
    font-weight: 600;
    font-display: swap;
    src: local('GoogleSans-MediumItalic'), local('GoogleSans-MediumItalic'), url(../site-fonts/GoogleSans-MediumItalic.woff2) format('woff2')
}

@font-face {
    font-family: googlesans;
    font-style: italic;
    font-weight: 400;
    font-display: swap;
    src: local('GoogleSans-Italic'), local('GoogleSans-Italic'), url(../site-fonts/GoogleSans-Italic.woff2) format('woff2')
}

@font-face {
    font-family: googlesans;
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: local('GoogleSans-Bold'), local('GoogleSans-Bold'), url(../site-fonts/GoogleSans-Bold.woff2) format('woff2')
}

@font-face {
    font-family: googlesans;
    font-style: italic;
    font-weight: 700;
    font-display: swap;
    src: local('GoogleSans-BoldItalic'), local('GoogleSans-BoldItalic'), url(../site-fonts/GoogleSans-BoldItalic.woff2) format('woff2')
}

.tabs-menu-wrapper-default-top,
.base-size {
    box-sizing: border-box;
    max-width: 1200px
}

.base-size {
    display: flex;
    width: 100%;
    flex-direction: column;
    margin: auto;
    margin-top: 0
}

#site-header {
    position: fixed;
    display: flex;
    z-index: 5;
    width: 100%;
    top: 0
}

#site-search {
    display: flex;
    flex: 1;
    position: relative;
    margin-left: 15px;
    margin-right: 10px
}

#site_search_input {
    flex: 1;
    outline: none;
    background-color: #fff;
    color: #2e3f57;
    border: 0;
    padding: 8px 30px 8px 12px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: 400;
    border: 1px solid #b1bdc9;
    box-sizing: border-box
}

#site_search_input:focus,
.btn-header-search:focus {
    -webkit-tap-highlight-color: transparent
}

#site_search_input:focus {
    background-color: #f2f5fc;
    border-color: #3146e1
}

#site_search_input::placeholder {
    color: #acb8c4
}

.form-header-search {
    display: flex;
    flex: 1
}

.form-header-search .autocomplete-holder-items {
    display: flex;
    flex: 1
}

.form-header-search .section-submit {
    position: absolute;
    display: flex;
    top: 0;
    right: 0;
    flex: none;
    width: auto
}

#submit-header-search {
    display: flex;
    padding: 10px 12px;
    text-indent: -99999px;
    background-color: transparent;
    border: 0
}

#submit-header-search>.text {
    cursor: pointer;
    background-color: transparent;
    border: 0;
    width: 16px;
    height: 16px;
    background-image: url(../images/up-sprite.svg);
    background-position: 0 -130px
}

#submit-header-search .loading {
    display: none
}

#header {
    font-family: googlesans, sans-serif;
    position: relative;
    z-index: 2;
    flex-direction: row;
    background-color: #fff;
    box-sizing: border-box;
    padding: 14px 0 14px 25px;
    margin: auto;
    align-self: center;
    border-bottom: 2px solid #f1f4fb
}

#header>.shadow {
    position: absolute;
    left: 0;
    bottom: 0
}

#header-actions {
    display: flex;
    flex: 1;
    justify-content: flex-end;
    align-self: center
}

#header-actions,
#menu-dispay {}

#header>.logo {
    flex: none;
    display: flex;
    position: relative;
    background-image: url(https://foro.daylilife.com/LogoDL.png?v=2);
    background-repeat: no-repeat;
    background-size: cover;
    width: 69px;
    height: 40px;
    background-position: 0 -15px;
}

/*#header>.logo {
    flex: none;
    display: flex;
    position: relative;
    background-image: url(../images/up-sprite.svg);
    width: 69px;
    height: 40px;
    background-position: 0 -1px
}*/

#header>.logo>.site {
    flex: 1;
    height: 100%
}

#authorized-ip {
    background-color: #000;
    position: absolute;
    display: inline-block;
    font-size: 12px;
    font-weight: 700;
    height: 17px;
    line-height: 18px;
    text-align: center;
    border-radius: 8px;
    color: #fff;
    padding: 0 5px;
    left: 30px;
    top: 32px;
    text-transform: uppercase
}

#authorized-ip:hover {
    text-decoration: none;
    background-color: #696969
}

#warning-sign {
    background-color: #ff617b;
    position: absolute;
    display: inline-block;
    font-size: 17px;
    font-weight: 700;
    width: 20px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    border-radius: 20px;
    color: #fff;
    left: 56px;
    top: 27px
}

#warning-sign:hover {
    text-decoration: none;
    background-color: #fb8a9d
}

.warning-cool {
    background-color: #000 !important
}

#header-actions>.name {
    font-size: 15px;
    color: #9ca2b3;
    margin-left: 10px;
    align-items: center;
    display: inline-block;
    margin-top: auto;
    max-width: 120px;
    width: 100%;
    margin-bottom: auto;
    justify-content: flex-end;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: right;
    overflow: hidden
}

#header-actions>.btn-header:first-child {
    margin-left: 0
}

.btn-header {
    white-space: nowrap;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    line-height: normal;
    height: 100%;
    min-width: 120px;
    border-radius: 4px;
    margin: 0 0 0 15px;
    font-size: 14px
}

.btn-header:hover,
.btn-header:active {
    text-decoration: none;
    cursor: pointer
}

.btn-header>.icon {
    flex: none;
    width: 19px;
    height: 24px;
    background-image: url(../images/up-sprite.svg)
}

.btn-header-solid {
    font-weight: 600;
    padding: 11px 10px;
    color: #2e3f57
}

.btn-header-solid:hover,
.btn-header-solid:active {
    color: #fff;
    background-color: #425ce4
}

.btn-header-solid.active {
    color: #fff;
    background-color: #425ce4
}

.btn-header-solid.active:hover {
    background-color: #4242e4
}

.btn-header-green {
    font-weight: 600;
    padding: 11px 10px;
    color: #2e3f57
}

.btn-header.register {
    margin-right: 30px
}

.btn-header-green:hover,
.btn-header-green:active {
    color: #fff;
    background-color: #0ecd75
}

.btn-header-green.active {
    color: #fff;
    background-color: #0ecd75
}

.btn-header-green.active:hover {
    background-color: #0abb69
}

.btn-header.btn-notifications {
    align-self: center;
    min-width: auto;
    margin-right: 5px;
    padding: 6px 5px
}

.btn-header.btn-notifications>.icon {
    width: 24px;
    height: 26px;
    background-position: 0 -84px;
    opacity: .7
}

.btn-header.btn-notifications.active>.icon {
    opacity: .85
}

.btn-header.btn-notifications:hover>.icon {
    opacity: 1
}

.btn-header.btn-notifications.active>.icon {
    background-position: -24px -84px
}

.btn-header-light {
    padding: 7px 10px;
    color: #2e3f57
}

.btn-header-light:hover,
.btn-header-light:active {
    background-color: #f7f9fd
}

.btn-header-light.transactions>.icon {
    background-position: -69px -85px
}

.btn-header-light.in-progress.transactions>.icon {
    background-position: -89px -85px
}

.btn-header-light.wallet {
    min-width: auto
}

.btn-header-light.wallet>.icon {
    background-position: -49px -85px
}

.btn-header-light>.info {
    display: flex;
    flex-wrap: wrap;
    margin-left: 10px
}

.btn-header-light>.info {}

.btn-header-light>.info>.name {
    white-space: nowrap;
    width: 100%;
    color: #9ba2b3;
    text-transform: uppercase;
    font-size: 9px;
    font-weight: 500;
    line-height: 10px
}

.btn-header-light>.info>.amount {
    width: 100%;
    color: #2e3f57;
    font-weight: 700;
    font-size: 14px;
    line-height: 10px;
    margin-top: 3px
}

.btn-header-light.in-progress>.info>.amount,
.btn-header-light.in-progress>.info>.name {
    color: #425ce3
}

#menu-display {
    display: flex
}

#menu-display>a {
    cursor: pointer;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding-left: 20px;
    padding-right: 25px
}

#menu-display>a>.icon {
    background-image: url(../images/up-sprite.svg);
    width: 20px;
    height: 20px;
    background-position: 0 -110px
}

#menu-display:hover>a>.icon,
#menu-display.active>a>.icon {
    background-position: -20px -110px
}

#sub-menu {
    z-index: 2;
    display: none;
    position: absolute;
    top: 54px;
    left: 0;
    right: 0;
    width: 100%;
    width: auto;
    align-items: flex-end
}

#sub-menu.base-size {
    background-color: transparent
}

#sub-menu.active {
    display: flex
}

#sub-menu>.menu-container {
    position: relative;
    width: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    background-color: #fff;
    padding: 15px;
    box-shadow: 0 10px 10px 0 rgba(26, 37, 70, .1);
    background-color: #fff
}

#sub-menu>.menu-container>.menu {
    display: flex;
    flex-direction: column;
    margin-right: 15px;
    border-right: 2px solid #f4f6fd;
    box-sizing: border-box
}

#sub-menu>.menu-container>.menu:last-child {
    margin-right: 0;
    border-right: 0
}

#sub-menu>.menu-container>.menu>h4 {
    color: #223257;
    text-transform: uppercase;
    font-size: 11px;
    margin: 0;
    padding: 0;
    margin-bottom: 20px;
    font-weight: 700;
    line-height: normal
}

#sub-menu>.menu-container>.menu>div {
    display: flex;
    flex-direction: column;
    min-width: 180px
}

#sub-menu>.menu-container>.menu>div>a {
    font-size: 15px;
    color: #949bad;
    line-height: normal;
    padding: 10px 0
}

#sub-menu>.menu-container>.menu>div>a:first-child {
    padding-top: 0
}

#sub-menu>.menu-container>.menu>div>a:last-child {
    padding-bottom: 0
}

#sub-menu>.menu-container>.menu>div>a:hover,
#sub-menu>.menu-container>.menu>div>a:active {
    text-decoration: none;
    color: #425ce4
}

#site-header>#loading-bar {
    height: 2px;
    display: inline-block;
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    background-color: transparent;
    z-index: 99
}

#site-header>#loading-bar>span {
    position: absolute;
    left: 0;
    top: 0;
    height: 4px;
    display: inline-block;
    background-color: #425ce4
}

#header-top-notifications {
    display: flex;
    position: relative;
    margin-right: 10px;
    cursor: pointer;
    user-select: none;
    align-items: center;
    margin-left: 10px
}

#header-top-notifications-button {
    height: 24px;
    min-width: 14px;
    background-color: #ff617b;
    border-radius: 4px;
    color: #fff;
    text-align: center;
    line-height: 24px;
    font-size: 14px;
    padding: 0 5px;
    font-weight: 400
}

#header-top-notifications .menu-holder {
    position: absolute;
    width: 160px;
    text-align: left;
    z-index: 998;
    top: 40px;
    right: -5px;
    padding-top: 2px;
    visibility: hidden;
    display: inline-block
}

#header-top-notifications.dynamic-focus .menu-holder {
    visibility: visible;
    top: 47px;
    right: 1px;
    transition: top .2s
}

#header-top-notifications .menu {
    margin: 0;
    padding: 10px 0;
    border-radius: 4px;
    background-color: #fff;
    border: 1px solid #ebebeb;
    box-shadow: #e4e4e4 0 2px 0 0;
    width: 100%;
    display: inline-block;
    padding: 5px 0
}

#header-top-notifications .menu-holder>span.arrow {
    top: -4px;
    right: 3%;
    width: 10px;
    height: 10px;
    display: inline-block;
    position: absolute;
    z-index: 999;
    background-color: #fff;
    border-top: 1px solid #ebebeb;
    border-right: 1px solid #ebebeb;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

#header-top-notifications .menu>li {
    float: left;
    position: relative;
    display: inline-block;
    left: 0;
    width: 100%;
    line-height: 32px;
    padding-left: 20px;
    box-sizing: border-box
}

#header-top-notifications .menu>li:hover,
#header-top-notifications .menu>li.active {
    background-color: #fbfbfb;
    box-shadow: none
}

#header-top-notifications .menu>li>a {
    text-decoration: none;
    display: inline-block;
    width: 100%;
    color: #b4b4b4;
    font-size: 14px;
    line-height: 16px;
    padding-top: 8px;
    padding-bottom: 8px
}

#header-top-notifications .menu>li:hover>a,
#header-top-notifications .menu>li.active>a {
    color: #3495df
}

#header-top-notifications .menu>li>a>i {
    left: 10px;
    top: 8px;
    position: absolute;
    display: inline-block;
    background-image: url(<?php echo image( '1.1/sprite.svg' );
    ?>);
    width: 14px;
    height: 15px
}

body.user-admin #site-footer {
    margin-bottom: 24px
}

body {
    background-color: #171d28;
    background-image: url(../images/bg-repeat.png);
    background-size: contain;
    background-repeat: repeat
}

.page {
    flex: 1;
    border-top: 11px solid #f5f7fc;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    background-color: #fff;
    margin-bottom: 20px
}

.header-games {
    display: flex
}

.header-avatar-a {
    margin-left: 10px;
    display: flex;
    justify-content: center;
    align-self: center
}

.header-avatar-a:hover .header-avatar {
    border: 2px solid #223d51
}

.header-avatar {
    vertical-align: top;
    height: 32px;
    width: 32px;
    border-radius: 100%;
    border: 2px solid #f1f1f1;
    box-sizing: border-box
}

#site-footer {
    align-self: flex-end;
    display: flex;
    width: 100%
}

#footer {
    font-family: googlesans, sans-serif;
    display: flex;
    flex-wrap: wrap;
    background-color: #292b3c;
    box-sizing: border-box;
    padding: 15px 25px;
    color: #fff
}

#footer>div {
    width: 100%
}

#footer>.footer-samp {
    padding-top: 10px;
    padding-bottom: 30px;
    display: flex;
    font-size: 20px;
    flex-direction: column
}

#footer>.footer-samp>.server {
    width: 100%
}

#footer>.footer-samp>.server>.status {
    text-align: center;
    width: 100%;
    margin-bottom: 20px;
    font-size: 20px;
    line-height: 22px
}

#footer>.footer-samp>.server>.offline {
    width: 100%;
    text-align: center;
    color: #ff617b
}

#footer>.footer-samp>.players {
    background-color: #242635;
    max-height: 200px;
    overflow: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box;
    padding: 10px
}

#footer>.footer-samp>.players::-webkit-scrollbar {
    width: 10px
}

#footer>.footer-samp>.players::-webkit-scrollbar-track {
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3)
}

#footer>.footer-samp>.players::-webkit-scrollbar-thumb {
    background-color: #83a2c1;
    outline: 1px solid slategrey;
    border-radius: 4px
}

#footer>.footer-samp>.players>ul {
    display: flex;
    flex-wrap: wrap
}

#footer>.footer-samp>.players>ul>li {
    display: flex;
    width: 25%;
    line-height: normal
}

#footer>.footer-samp>.players>ul>li>.player {
    display: flex;
    margin-bottom: 5px
}

#footer>.footer-samp>.players>ul>li>.player>img {
    flex: none;
    margin: auto;
    margin-right: 5px;
    width: 16px;
    height: 11px;
    overflow: hidden
}

#footer>.footer-samp>.players>ul>li>.player>.name {
    flex: 1;
    font-size: 14px
}

#footer>.footer-samp>.players>ul>li>.player>.level {
    font-size: 14px;
    margin-left: 5px
}

#footer>.footer-content {
    display: flex;
    line-height: normal
}

#footer>.footer-content>div {
    flex: 1
}

#footer>.footer-content>.copyright {
    font-size: 14px
}

#footer>.footer-content>.legal {
    display: flex;
    justify-content: flex-end
}

#footer>.footer-content>.legal>a {
    font-size: 14px;
    margin-left: 40px;
    color: #fff
}

#footer>.footer-content>.legal>a:hover,
#footer>.footer-content>.legal>a:active {
    text-decoration: underline;
    color: #fff
}

.autocomplete-default .autocomplete-list.market-list {
    display: flex;
    float: none;
    box-shadow: 0 0 18px rgba(66, 92, 227, .15);
    bottom: auto;
    top: 32px !important
}

.autocomplete-default .autocomplete-list.market-list.market-list-search {
    top: 56px !important
}

.autocomplete-default .autocomplete-list.market-list .autocomplete-items {
    display: flex;
    flex-direction: column;
    border: 1px solid transparent;
    border-top: 0;
    background-color: #fff
}

.autocomplete-default .autocomplete-list.market-list .autocomplete-items>.autocomplete-item {
    display: flex;
    float: none;
    color: #223257
}

.autocomplete-default .autocomplete-list.market-list .autocomplete-items>.autocomplete-item>.text {
    padding: 10px;
    box-sizing: border-box;
    line-height: normal;
    display: inline-block;
    font-size: 15px;
    max-width: 100%;
    width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap
}

.autocomplete-default .autocomplete-list.market-list .autocomplete-items>.autocomplete-item:hover,
.autocomplete-default .autocomplete-list.market-list .autocomplete-items>.autocomplete-item.active {
    color: #425ce4;
    background-color: transparent
}

#social-footer {
    display: flex;
    margin-bottom: 10px;
    justify-content: center
}

#social-footer>.icons {
    display: flex
}

#social-footer>.icons>a {
    display: flex;
    margin: 10px
}

#social-footer>.icons>a>span {
    text-indent: -9999px
}

#social-footer>.icons>a::after {
    content: '';
    height: 32px;
    width: 32px;
    background-image: url(../images/social-f.svg)
}

#social-footer>.icons>a.youtube::after {
    background-position: 0 -32px
}

#social-footer>.icons>a.youtube:hover::after {
    background-position: 0 0
}

#social-footer>.icons>a.facebook::after {
    background-position: -64px -32px
}

#social-footer>.icons>a.facebook:hover::after {
    background-position: -64px 0
}

#social-footer>.icons>a.twitter::after {
    background-position: -160px -32px
}

#social-footer>.icons>a.twitter:hover::after {
    background-position: -160px 0
}

#social-footer>.icons>a.instagram::after {
    background-position: -128px -32px
}

#social-footer>.icons>a.instagram:hover::after {
    background-position: -128px 0
}

#social-footer>.icons>a.discord::after {
    background-position: -32px -32px
}

#social-footer>.icons>a.discord:hover::after {
    background-position: -32px 0
}

#social-footer>.icons>a.teamspeak::after {
    background-position: -96px -32px
}

#social-footer>.icons>a.teamspeak:hover::after {
    background-position: -96px 0
}

#social-footer>.icons>a.twitch::after {
    background-position: -192px -32px
}

#social-footer>.icons>a.twitch:hover::after {
    background-position: -192px 0
}

@media screen and (max-width:1024px) {
    body.device-desktop .btn-header {
        min-width: auto
    }
}