@keyframes tilt-shaking {
  0% { transform: rotate(0deg); }
  25% { transform: rotate(5deg); }
  50% { transform: rotate(0deg); }
  75% { transform: rotate(-5deg); }
  100% { transform: rotate(0deg); }
}
@keyframes blink { 50% { border-color: #ff0000; } }
html, body, .page-wrapper{ overflow-x: hidden; }
#homeTit > h2{ text-align: center; font-size: 32px; }
#menu{ margin-top: -19px; }
.hoverDelay.only-click{ cursor: pointer; }
.hoverDelay:not(.only-click):NOT(.hover):NOT(.empty):hover,
.hoverDelay:not(.hover):NOT(.empty):hover > label{ cursor: wait !important; }
.window_content .dataTables_wrapper{ min-width: unset; }
#menu > div{ min-width: 483px; }
#partiEdit_wrapper{ min-width: unset; }
#partiEdit_wrapper table td{ width: 33%; text-align: center; }
#discBlock { position: relative; height: 500px; }
#discBlock iframe{ position: absolute; width: 350px; left: 50%; margin-left: -175px; }
.lngChanger{ margin-top: 4px !important; }

/* dark mode */
html.dark #allyAdmin > .allyinfo span,
html.dark #memberArmy label > b,
html.dark #joinOr,
html.dark #brtit,
html.dark #pvptfTypeWrapper > div:last-child,
html.dark .allyinfo,
html.dark #allymenu,
html.dark #allymenu > *{ background: #181818; color: #fff; }

html.dark .dataTable tfoot th,
html.dark .patiRewLi > li:first-child{ background: #3c3c3c !important; color: #fff; }

html.dark #partiReview, html.dark #partiReview > div:first-child,
html.dark .dataTable tr:NOT(:hover),
html.dark .dataTable th:NOT(:hover){ background: #181818; color: #fff !important; }

html.dark .or,
html.dark fieldset label,
html.dark .timerSet span{ color: #fff; }

html.dark .fg-toolbar{ background: #000 !important; color: #fff; }

/*
html.dark #timerPartiLi > div > div:nth-child(odd),
html.dark tbody tr:hover > td,
html.dark tbody tr:hover > td a{ color: #000 !important; }
html.dark tbody tr:hover > td a:hover{ color: #a8cf20 !important; }
*/

html.dark .showPings > div,
html.dark #showMorePings,
html.dark #showMorePings > div:last-child,
html.dark #NotFoundListWrapper{ background: #181818; }

html.dark .ui-dropdown ul > li > a,
html.dark .dataTables_scrollHead th:hover,
html.dark .dataTable_,
html.dark .dataTable_ a{ color: #000 !important; }

html.dark #rightMenu li:hover,
html.dark .patiRewLi > li:hover,
html.dark .delAcc{ color: #000; }

html.dark .goal > div:after{ border-top-color: #262626; }
html.dark .goal > div:before{ border-top-color: #454545; }

html.dark #showPings,
html.dark #pvptfTypeWrapper:NOT(:hover),
html.dark .chooseApp > a:NOT(:hover){ opacity: .7; }
html.dark .captionWrap{ opacity: .8; }

/* solo items */
.joinTokenInput{ width: 195px !important; }
th.htmltipenter{ position: relative; }
.menuhelper{ position: absolute; top: -3px; left: 50%; margin-left: -8px; }
#mydiscordid > .error{ margin-bottom: 0; }
#mydiscordid:NOT(.ui-state-error) > .error{ display: none; }

#grpMultiLng > div{ float: left; }
#grpMultiLng > div:first-child{ padding-top: 28px; padding-right: 10px; }
#grpMultiLng label{ width: 105px; }
.grpMultiLng:NOT(:checked) + a{ display: none; }
#grpMultiLng a{ margin-top: -2px !important; }

.hoftimer{ font-size: 20px; }
.editParti{ min-width: 120px; position: relative; }
.partiPercent{ display: inline-block; position: absolute; margin-left: 5px; width: 60px; height: 31px; padding: 2px 5px; border-radius: 50%; background: #ccc; color: #000; }

/* multi lingual discord allianz hooks */
#allyDHt1:checked ~ #allyDHs1, #allyDHt2:checked ~ #allyDHs2, #allyDHt3:checked ~ #allyDHs3{ display: block; }


/* unsubscribe */
#memberUnsubscribe > div:NOT(.culi):NOT(.preloader){ width: 50%; float: left; margin-top: 15px; padding: 0 10px; }
#memberUnsubscribe h2{ font-size: 16px; margin-bottom: 5px; text-decoration: underline; }
#memberUnsubscribe p{ font-size: 14px; line-height: 14px; }
#memberUnsubscribe menu{ margin-bottom: 0; }
#memberUnsubscribe label{ width: 50px }
#memberUnsubscribe input{ width: 88px }
#memberUnsubscribe .culi{ float: right; margin-top: 20px; padding: 10px; }

#eveUnsuLi, #eveUnsuLi ul{ margin: 0; padding: 0; list-style: none; }
#eveUnsuLi ul{ margin-bottom: 5px; }
#eveUnsuLi ul > li{ display: inline-block; padding: 3px 5px 3px 10px; color: #000; height: 32px; line-height: 28px; }
#eveUnsuLi ul > li:first-child{ background: #cccccc; font-weight: bold; border-radius: 5px 0 0 5px; }
#eveUnsuLi ul > li:NOT(:first-child){ background: #f1f1f1;}
#eveUnsuLi ul > li:last-child{ border-radius: 0 5px 5px 0; }
#eveUnsuLi i{ margin-left: 4px; padding: 4px 5px; border: 1px solid #cccccc; border-radius: 5px; }
#eveUnsuLi i:hover{ color: red; cursor: pointer; background: #cccccc; -webkit-box-shadow: 1px 1px 1px 1px #181616; box-shadow: 1px 1px 1px 1px #181616; }
#eveUnsuLi i:active{ background: #cccccc; -webkit-box-shadow:inset 1px 1px 1px 1px #181616; box-shadow:inset 1px 1px 1px 1px #181616; }

#parti tbody tr td{ padding: 0 6px; }


/** Twitch */
#twitchBlock > h2{ margin-bottom: 5px; }
#twitchBlock > h2 > span{ color: #ac63ff; }
#twitchTit{ font-weight: normal; text-transform: none; float: right; }
#twitchContent > div, #twitchWrapper > div{ border-top: 1px solid #fff; margin-top: 15px; padding-top: 10px; }
#twitchContent:NOT(.open){ display: none; }
#twitch{ padding: 0 10px; }
#twitchWrapper iframe{ width: 100%; border-radius: 10px; }

/** timer */
@keyframes timer-alert {
  50% {
    background: orange;
  }
  100% {
    background: #181818;
  }
}
#timerwrapper:NOT(.hover) .opener.alert{ animation: timer-alert 1s infinite; }
.timer360{ position: absolute; z-index: 1; top: 0; left: 0; width: 200px; height: 200px; }
.timer360 pie{
    position: absolute;
    display: block;
    border-radius: 50%;
    background-color: transparent;
}
.timer360 > pie:first-child{ z-index: 1; width: 194px; height: 194px; top: 3px; left: 3px; background-color: #ccc; }
.timer360 > div:NOT(.caption){ position: absolute; z-index: 2; width: 194px; height: 194px; top: 3px; left: 3px; border-radius: 50%; background-repeat: no-repeat; background-size: 50% 50%; }
.timer360 > pie:last-child{ z-index: 3; width: 184px; height: 184px; top: 8px; left: 8px; background-color: #fff; }
#addTimer div.l{ background: linear-gradient(270deg, #ea3df3 50%, transparent 50%) 0 0; }
#addTimer div.r{ background: linear-gradient(90deg, #ea3df3 50%, transparent 50%) 0 0; }
.timer360 > .caption{ position: absolute; z-index: 10; left: 0; right: 4px; top: 43%; font-size: 22px; color: #000; text-transform: uppercase; text-align: center; }

.timer360 > .caption > span:first-child{ position: absolute; top: -15px; left: 5px; right: 0; font-size: 18px; text-transform: none; }
.timer360 > .caption > span:last-child{ position: absolute; top: 15px; left: 5px; right: 0; }

#timerwrapper:NOT(.hover) .opener.alert{ animation: timer-alert 1s infinite; }
#timerwrapper{ position: fixed; z-index: 100; top: 50%; left: 0; margin-top: -70px; background-color: rgba(0,0,0,0.9); }
#timerwrapper.hover{ width: 100%; height: 380px; margin-top: -185px; padding-bottom: 100px; -webkit-box-shadow: 2px 2px 2px 2px #998080; box-shadow: 1px 1px 8px 1px #998080; }
#timerwrapper > .opener{ position: absolute; display: inline-block; width: 26px; line-height: 24px; padding: 10px 2px 35px 0;  background-color: rgba(0,0,0,0.6); color: #fff; cursor:pointer; writing-mode: vertical-rl; text-orientation: upright; border-radius: 0 15px; letter-spacing: -1px; }
#timerwrapper > .opener i{ position: absolute; right: 4px; bottom: 12px; color: red; }
#timerwrapper > .opener:hover{  cursor: pointer; background-color: #998080e6; -webkit-box-shadow: 2px 2px 2px 2px #998080; box-shadow: 1px 1px 8px 1px #998080; }
#timerwrapper:NOT(.hover):hover{ background-color: #998080e6; -webkit-box-shadow: 2px 2px 2px 2px #998080; box-shadow: 1px 1px 8px 1px #998080; }
#timerwrapper:NOT(.hover) > #timerBlock,
.timer:NOT(.showDisSendOpt) .postDisWrap{ display: none; }
#timerwrapper:NOT(.hover){ border-radius: 0 15px; }
#timerwrapper.hover > .opener{ margin-top: 115px; }
.timer .ui-dropdown > ul{ width: 170px; }

#tsett{ position: absolute; width: 150px; left: 50%; margin-left: -100px; top: 5px; }
#tsett:NOT(:hover) > div:last-child{ display: none; }


#tbw{ position: absolute; top: 0; left: 26px; right: 0; height: 380px; white-space: nowrap; overflow-x: auto; }
#timerBlock{ min-width: 200px; margin-top: 15px; }
#timerBlock .timer{ position: relative; float: left; width: 200px; margin: 20px 5px 0 4px; white-space: nowrap; }
#timerBlock .timer:NOT(#addTimer) div.name:NOT(:empty){ text-align: center; margin: 2px 0 10px 0; min-height: 24px; color: #fff; border-radius: 10px;-webkit-box-shadow: 2px 2px 2px 2px #998080; box-shadow: 1px 1px 8px 1px #998080; }
#timerBlock .timer:NOT(#addTimer) div.name:empty{ min-height: 36px; }
#timerBlock .timer > div:last-child{ margin: 10px 0 0 0; text-align: center; }
#timerBlock .timer .memDesc { padding: 10px 5px; color: #fff; }
#timerBlock .timer .btnRow{ margin-top: 10px; text-align: center; }
#timerBlock .timer button:NOT(.timerSettBtn) span{ padding: 0 5px; }
#timerBlock .timer .wrp > menu{ padding: 0 3px; background: #292a2de3; position: absolute; z-index: 10; top: -20px; right: -5px; left: -5px; height: 242px; border-radius: 10px; white-space: normal; border-bottom-right-radius: 0; -moz-opacity: 0.94; -khtml-opacity: 0.94; opacity: 0.94; }
#timerBlock .timer > section{ white-space: normal; }
#timerBlock .timer .heightWrapper{ height: 242px; overflow-y: auto; width: 217px; padding-bottom: 5px; }
#timerBlock .timer .heightWrapper > div{ width: 200px; }
#timerBlock .timer menu div.txt{ margin-top: 5px; margin-bottom: 25px; }
#timerBlock .timer menu div.txt > input{ -webkit-border-radius: 10px 10px 0 0; border-radius: 10px 10px 0 0; }
#timerBlock .timer menu div.txt textarea{ width: 199px; height: 34px; resize: none; -webkit-transition: all 1s; -o-transition: all 1s; transition: all 1s; }
#timerBlock .timer menu div.txt textarea:focus{ height: 158px; }
#timerBlock .timer menu div.txt button{ height: 50px; width: 199px; -webkit-border-radius: 0 0 0 10px; border-radius: 0 0 0 10px; }
#timerBlock .timer menu div.txt textarea:NOT(:focus) + button{ display: none; }
#timerBlock .timer menu div.timeRow{ padding-left: 10px; margin-bottom: 30px; }
#timerBlock .timer menu div.or{ width: 100%; height: 23px; margin-bottom: 2px;; }
#timerBlock .timer menu div.or:before{ left: 70px; right: 70px; text-align: center; background-color: #292a2d; }
#timerBlock .timer menu div.or:after{ border-color: #fff; }
#timerBlock .timer menu div.or > span{ width: 50px; }
#timerBlock .timer menu input.name{ width: 199px; }
#timerBlock .timer menu input.date{ width: 82px; }
#timerBlock .timer menu input.time{ width: 65px; }
#timerBlock .timer menu .seriesbtn{ padding: 0 5px; }
#timerBlock .timer menu .seriesbtn.del{ color: #ff5858; }
#timerBlock .timer menu .seriesbtn.del:hover{ color: #f00000 !important; }
#timerBlock .timer menu .seriesbtn.add{ color: #5fa25f; }
#timerBlock .timer menu .seriesbtn.add:hover{ color: #088908 !important; }
#timerBlock .timer menu .seriesbtn > i{ padding: 0; }
#timerBlock .timer menu .ui-dropdown{ width: 172px; max-width: 172px; }
#timerBlock .timer.hasSeries .disc{ margin-top: 20px; }
#timerBlock .timerSet > input{ width: 45px !important; margin-left: 7px; margin-right: 1px; }
#timerBlock .timerSet > input:first-child{ margin-left: 0; padding-left: 3px; padding-right: 3px; }
#timerBlock .ui-dropdown{ margin-top: 0; margin-bottom: 5px; }
#timerBlock legend{ color: #fff; }
#timerBlock fieldset > label{ cursor: pointer; }


#timerBlock .tabSys{ margin-top: -5px !important; margin-left: -1px; border-top: 2px solid #181818; }
#timerBlock .tabSys > label{ padding: 15px 15px !important; }
#timerBlock .tabSys > section{ padding: 0; margin-top: -1px !important; min-height: auto; }

#timerBlock .wrp:hover div.name{ opacity: 0; }

#timerBlock .timer > .wrp:NOT(:hover) > menu,
#timerBlock .series > div:first-child .seriesbtn.del,
#timerBlock .series > div:NOT(:last-child) .seriesbtn.add,
#timerBlock .timer:NOT(.changed) .seriesSaveWrap,
#timerBlock .timer.hasSeries .cdt,
#timerBlock .timer.done .partiRow,
#timerBlock .timer.running .onstopmenu{ display: none; }
#timerBlock .timer:NOT(.event) > div > menu .ui-dropdown{ display: none !important; } /* need to be a single row */
#timerBlock .timer:NOT(.event) div.onstopmenu{ opacity: 0; }

/* keep the menu open if we enter date picker */
#timerBlock .timer.open menu{ display: inline-block !important; }

#timerBlock div.onstopmenu{ color: #fff; }
#timerBlock div.onstopmenu .timerBtn{ margin-left: 5px; }
#timerBlock .timer .btnRow > div{ min-height: 31.5px; }
#timerBlock .timer:NOT(.event) .btnRow > div:first-child button{ display: none; }

#timerBlock .timerBtn.s:hover i, #timerBlock .timerBtn.j.active i, #timerBlock .timerBtn.j:hover i, #timerBlock .timerBtn.j span, .hoftimer.green{ color: green; }
#timerBlock .timerBtn.c:hover i, #timerBlock .timerBtn.u.active i, #timerBlock .timerBtn.u:hover i, #timerBlock .timerBtn.u span, .hoftimer.red{ color: red; }
#timerBlock .timerBtn:hover.v i, .hoftimer.blue{ color: blue; }

#addTimer{ -webkit-transition: all .5s; -o-transition: all .5s; transition: all .5s; }
#addTimer > div:first-child{ min-height: 32px; }

#addTimer:hover{ cursor: pointer; }
#addTimer:NOT(:hover){ opacity: 0.4; }

.captionWrap{ position: relative; display: block; width: 200px; height: 200px; background-color: #fff; border-radius: 50%; }
.captionWrap > div{ position: absolute; z-index: 5; top: 0; right: 0; width: 100%; height: 100%; text-align: center; display: table; }
.captionWrap > .sett{ background: #fff; border-radius: 50%; top: 15px; height: 170px; left: 15px; width: 170px; }
.timer:NOT(.done) .sett, /* show settings button only a timer is done and alert is done too */
.timer.alert .sett, /* hide settings button if timer is still in alert mdoe */
.timer:NOT(.alert) .alert, /* hide the alert-bell if timer not done */
.timer:NOT(.running) .timer360 > div, /* hide colored circle if timer not running */
.timer.alert .timer360 .caption /* hide caption is alert mode active */
{ display: none; }

.captionWrap > .sett button{ margin-top: 42%; }
.captionWrap > .sett i{ margin-left: 10px; }
.captionWrap  > div > span{ display: table-cell; vertical-align: middle; font-size: 22px; font-weight: bold; color: #000; }
.captionWrap .fa-bell{ font-size: 72px; color: red; animation: tilt-shaking 0.10s infinite; cursor: pointer; }

#timerBlock .timer .remTimerCircle{ position: absolute; z-index: 50; top: -15px; right: -16px; font-size: 22px; background: #292a2d; padding: 4px 8px; border-radius: 50%; }
#timerBlock .timer .remTimerCircle:hover{ cursor: pointer; color: red; }


#timerPartiLiWrap{ position: absolute; z-index: 1; top: 34px; left: 0; bottom: 0; width: 100%; overflow-y: auto; }
#timerPartiLi > div{ position: relative; z-index: 1; float: left; height: 100%; width: 50%; max-width: 50%; padding-top: 36px; }
#timerPartiLi > div:first-child{ border-right: 1px solid #ccc; }
#timerPartiLi > div:last-child{ border-left: 1px solid #ccc; margin-left: -1px; }
#timerPartiLi > div > div:first-child{ position: fixed; margin-top: -36px; width: 140px; font-weight: bold; text-align: center; padding: 5px 0; border-bottom: 1px solid #ccc; background: #b2b2b2 !important; }
#timerPartiLi > div > div:NOT(:first-child){ padding: 0 5px; white-space: nowrap; overflow-x: hidden; }
#timerPartiLi > div > div:nth-child(odd){ background: #c7c7cd; }
html.dark #timerPartiLi > div > div:nth-child(odd){ background: #858585 !important; }


/* jq-tables search input */
input[type="search"]{ width: 150px; padding-right: 19px; }
.dataTables_scrollBody{ overflow: visible !important; }
.clearSearchBtn{ font-size: 22px; position: absolute; margin-top: 4px; margin-left: -19px; color: #000; cursor: pointer; }
.clearSearchBtn:hover{ color: red; }
#memberHorse label{ width: 100%; }
#memberHorse > .formRow{ padding: 0 7px; margin-top: 10px; }
.editHorse, .memberNote{ font-size: 20px; padding: 3px 5px !important; }
.memberNote.active{ background: #96e196; }
.memberNote.active:hover{ background: #68bc68; }
.editHorse.rookie{ background: #f7a575; }
.editHorse.rookie:hover{ background: #f98540; }
.editHorse.ok{ background: #96e196; }
.editHorse.ok:hover{ background: #68bc68; }
.editHorse.top{ background: #f2f38a; }
.editHorse.top:hover{ background: #edef27; }
.cio{ width: 41px; }

/* app section */
.chooseApp{ margin: 0; padding: 0; }
.chooseApp > a{
    display: inline-block; height: 50px; line-height: 49px; min-width: 195px; padding: 0 15px; margin: 20px 10px; text-align: center; font-weight: bold; border-radius: 3px; background: #88888e; color: #fff; text-decoration: none;
    -webkit-transition: all 1s; -o-transition: all 1s; transition: all 1s;
    -webkit-box-shadow: 1px 0 4px 1px #0F0F0F; box-shadow: 1px 0 4px 1px #0F0F0F;
    text-shadow: 3px 0 2px #000;
}
.chooseApp > a:empty{ display: none;  }
.chooseApp > a:hover{ background: #ccc; color: #000 !important; cursor: pointer; text-shadow: 3px 0 2px #fff; cursor: pointer; }
.chooseApp > a.comingsoon:hover{ cursor: not-allowed !important; }
.chooseApp > a.comingsoon:after{
    content: 'coming soon';
    position: absolute;
    top: -10px;
    left: 122px;
    height: 22px;
    width: 90px;
    line-height: 20px;
    font-size: 14px;
    background: #60f59b;
    color: #000;
    border-radius: 8px;
    -webkit-box-shadow: 1px 0 4px 1px #0F0F0F;
    box-shadow: 1px 0 4px 1px #0F0F0F;
    text-shadow: none;
}

/** buttons **/
.ui-button, .ui-button i { outline: none !important; margin: 0; }
.ui-button.outer-l, .css-selectmenu.outer-l{ border-top-right-radius: 0; border-bottom-right-radius: 0; }
.ui-button.inner, .css-selectmenu.inner{ border-radius: 0; }
.ui-button.outer-r, .css-selectmenu.outer-r{ border-top-left-radius: 0; border-bottom-left-radius: 0; }

/** dropdown */
.ui-dropdown{ display: inline-block; width: 200px; height: 35px; position: relative; z-index: 100; padding: 0; list-style: none; margin-top: 5px; border: 1px solid #ccc; border-bottom: none; border-radius: 5px; -webkit-box-shadow: 1px 1px 3px 1px #ccc; box-shadow: 1px 1px 3px 1px #ccc; }
html.dark .ui-dropdown:NOT(:hover):NOT(.hover){ opacity: 0.7; }
.ui-dropdown.hover{ z-index: 105; }
.ui-dropdown select, .ui-dropdown li.selected:NOT(:first-child){ display: none !important; }
.ui-dropdown.guest{ margin-top: 10px; padding-left: 5px; border-bottom: 1px solid #ccc; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; }
.ui-dropdown .menuIcon{ position: absolute; z-index: 10; top: 0; right: 0; height: 33px; padding: 8px 6px 0 4px; background: #f1f1f1; color: #808080 !important; border-left: 1px solid #ccc; border-bottom-right-radius: 5px; border-top-right-radius: 5px; }
.ui-dropdown.hover .menuIcon{ border-bottom-right-radius: 0; }
.ui-dropdown:hover li:NOT(.add) a, .ui-dropdown .menuIcon{ cursor: pointer !important; }
.ui-dropdown.hover .menuIcon{ color: #000 !important; }

.ui-dropdown:NOT(.hover) > ul > li:NOT(:first-child){ display: none; }
.ui-dropdown:NOT(.hover) > ul > li:first-child{ border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }
.ui-dropdown.hover > ul, .ui-dropdown.hover > ul > ul:last-child,
.ui-dropdown.hover > ul > li:last-child{ -webkit-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; }
.ui-dropdown.hover > ul > ul:last-child > li:last-child{ -webkit-border-radius: 0 0 5px 0; border-radius: 0 0 5px 0; }

.ui-dropdown ul{ margin: 0; padding: 0; list-style: none; background: #fff; }
.ui-dropdown > ul{ border-radius: 5px; position: absolute; width: 198px; /* max-height: 250px; overflow-y: auto; overflow-x: hidden; */ }
.ui-dropdown.hover > ul{ -webkit-box-shadow: 1px 1px 3px 1px #ccc; box-shadow: 1px 1px 3px 1px #ccc; }
.ui-dropdown.fixed.hover > ul{ position: fixed; }
/*.ui-dropdown.hover ul > li:first-child{ position: fixed; margin-top: -33px; }*/

.ui-dropdown li{ background: #fff; }
.ui-dropdown ul > li:NOT(.add){ padding: 2px 5px 0; border-bottom: 1px solid #ccc; }
.ui-dropdown ul > li:first-child{ height: 34px; padding: 2px 21px 0 5px; }
.ui-dropdown ul > li.default{ background: #f1f1f1; }
.ui-dropdown ul > li > i{ display: inline-block; margin-right: 5px; }
html:NOT(.dark) .ui-dropdown ul > li:hover > i{ color: #fff; }
.ui-dropdown ul > li > i:hover{ color: red; cursor: pointer; }
.ui-dropdown ul li:NOT(.add):first-child > i{ display: none; }

.ui-dropdown a{ display: inline-block; width: 169px; height: 32px; line-height: 29px; }
.ui-dropdown ul > li.add > a{ line-height: 30px; width: 100%; }
.ui-dropdown > ul > li:NOT(.add):first-child a{ text-decoration: none; color: #000 !important; cursor: default; }
.ui-dropdown > ul > li:hover:NOT(:first-child), .ui-dropdown > ul > ul > li:hover{ background: #88888e; }

/* optiongroup as UL on ui-dropdown */
.ui-dropdown:NOT(.hover) ul > ul{ display: none; }
.ui-dropdown ul > ul:NOT(:first-child){ padding-left: 12px; background: #f1f1f1; border-top: 2px solid #ccc; }
.ui-dropdown ul > ul:nth-child(2){ border-top: 1px solid #ccc;; }
.ui-dropdown ul > ul > li:first-child{ border-top: 1px solid #ccc; }
.ui-dropdown ul > ul:before { display: inline-block; height: 32px; line-height: 34px; width: 100%; content: attr(label)":"; color: #000; font-weight: bold; margin-left: -10px; }


/* player menu */
#accBlock, #alertBox{ margin: 0 !important; }
#accBlock{ position: relative; height: 118px; }
#playerAccMenu{ position: absolute; width: 200px; }
#playerAccMenu.guest{ width: 100%; padding-right: 17px; }
#playerAccMenu ul > li:last-child{ text-align: center; padding-left: 0; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; }

.accinfo{ color: red; }
.accinfo.add{ position: absolute; top: 19px; left: 219px; }
.accinfo.reg{ margin-left: 5px; }

#playermenu{ position: absolute; left: 220px; top: 10px; }
#newAccName{ margin-left: 10px; }

#hr01{ margin-top: 53px; }

/* ally menü */
#editAllyWrapper{ margin-left: 200px; }
#editAlly{ position: absolute; top: 13px; left: 0; width: 200px; height: 32px; box-shadow: none; }
#editAlly ul > li:first-child{ padding: 0px 21px 0 5px; height: 31px; line-height: 28px; }
#editAlly .menuIcon{ height: 30px; padding: 7px 6px 0 4px; }
#editAlly, #editAlly ul > li:first-child, #editAlly .menuIcon{ border-bottom-right-radius: 0; border-top-right-radius: 0; }
#allyIsAdmin{ margin-left: -4px; }

#allyHooks{ width: 50%; }
#allyMenuWrapper{ position: relative; padding: 4px 0 1px 0; }
#allyMenuWrapper h2{ margin: 0; padding: 0; }
#allyMenuWrapper:NOT(.hover) > #allymenu{ display: none; }
.allyMenIcon{ position: relative; margin-left: 10px; padding: 3px 6px !important; font-size: 20px; top: -4px; border: 1px solid #7d5e5e; -webkit-box-shadow: 1px 1px 5px 0px #ccc; box-shadow: 1px 1px 5px 0px #ccc; }
.allyMenIcon:hover{ cursor: wait; }
.allyMenIcon.fa-bars, .allyMenIcon.fa-caret-up{ right: 10px; }
#allyMenuWrapper.hover .allyMenIcon.fa-bars,
#allyMenuWrapper:NOT(.hover) .allyMenIcon.fa-caret-up{ display: none; }
#allymenu{ position: absolute; height: 115px; left: -4px; top: -74px; right: 0; padding: 18px 0 15px 6px; background: #fff; z-index: 9999; }
.allyinfo{ margin-top: 27px; background: #fff; }
.allyinfo b{ margin: 0 10px 0 15px; }
#allymenu button{ outline: none; }
html.dark .alliBtn.mem.inner.mid{ margin-left: -2px; }
#allyUpdateBtn{ padding-left: 10px !important; padding-right: 10px !important; }
.alliBtn.mid{
    border-radius: 0px !important;
    margin-left: -5px;
}
.alliBtn.chart{
    margin-left: -5px;
    padding-left: 8px !important;
    padding-right: 10px !important;
    margin-right: 50px;
}
#newAllyTokRow{ position: relative; margin-right: 50px; }
#newAllyToken{ position: absolute; height: 30px; width: 30px; left: 328px; top: 7px; border-radius: 0; outline: none; padding-left: 6px !important; }
#allyAdmin{ margin-top: -9px; }
#allyAdmin > .allyinfo{ margin-top: 24px; }
#allyAdmin > .allyinfo span{ margin: 0 10px; color: #000; }
#playermenu{ display: inline-block; }

#allyUpdate{ position: relative; }
#allyRightsWrapper{ display: inline-block; width: 550px; margin-top: -49px; }
#allyRightsWrapper.plc > .preloader{ opacity: 1; top: 45px; bottom: 0; height: auto; padding-top: 35%; }
html:NOT(.dark) #editorContent .preloader { background: #ffffff !important; }
#rightMenu{ margin: 0; padding: 0; list-style: none; }
#rightMenu > li{ margin: 3px 0; padding: 0 5px;  border-radius: 5px; }
#rightMenu > li:hover{ background: #f1f1f1; }
#rightMenu > li > span:first-child{ display: inline-block; min-width: 280px; float: left; }
#rightMenu > li > span:NOT(:first-child){ display: inline-block; width: 33px; text-align: center; float: right; }

/* Master/Slave lists */
#slaveSetup{ margin: 0; padding: 0; list-style: none; margin-top: -3px; }
#slaveSetup > li.head{ margin-bottom: 10px; border-bottom: 1px solid #000000; }
#slaveSetup > li > *:first-child{ float: left; }
#slaveSetup > li > *:last-child{ float: right; }

/* DONATION */
@keyframes blink-white-orange {
  50% {
    color: orange;
  }
  100% {
    color: white;
  }
}
@keyframes blink-black-orange {
  50% {
    color: orange;
  }
  100% {
    color: #181818;
  }
}
.donationBlock .fa-exclamation-triangle{ color: white; animation: blink-white-orange 5s infinite; }
html.dark .donationBlock .fa-exclamation-triangle{ color: #181818; animation: blink-black-orange 5s infinite; }
.donationBlock:not(.show):not(.hover) > h2{ margin-bottom: 3px; }
.donationBlock:not(.show):not(.hover) > *:NOT(h2) { display: none; }
.Timeline{
    display: flex;
    align-items: center;
    height: 190px;
    width: 902px;
    margin-left: auto;
    margin-right: auto;
}
.TimelineWrapper{ overflow-x: auto; }
.Timeline line{ stroke-width: 5; stroke: rgba(162, 164, 163, 0.37); }
.Timeline svg.active > line{ stroke: #004165 !important; }
.Timeline circle{ fill: rgba(162, 164, 163, 0.37); }
.Timeline .goal.active circle{ fill: rgb(0, 65, 101) !important; }
.Timeline .donateionEnd > line{ stroke-width: 2; }
.event1, .event2, .event3{ position: relative; }

.event1Bubble{
  position: absolute;
  background-color: rgba(158, 158, 158, 0.1);
  width: 149px;
  height: 60px;
  top: -70px;
  left: -15px;
  border-radius: 5px;
  box-shadow: inset 0 0 5px rgba(158, 158, 158, 0.64)
}
.event2Bubble{
  position: absolute;
  background-color: rgba(158, 158, 158, 0.1);
  width: 149px;
  height: 60px;
  left: -105px;
  top: 33px;
  border-radius: 5px;
  box-shadow: inset 0 0 5px rgba(158, 158, 158, 0.64)
}

.event1Bubble:after,
.event1Bubble:before,
.event2Bubble:after,
.event2Bubble:before{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  border-style: solid;
  border-color: transparent;
  border-bottom: 0;
}

.event1Bubble:before{
  bottom: -10px;
  left: 13px;
  border-top-color: rgba(222, 222, 222, 0.66);
  border-width: 12px;
}
.event1Bubble:after{
  bottom: -8px;
  left: 13px;
  border-top-color: #F6F6F6;
  border-width: 12px;
}
.event2Bubble:before{
  bottom: 59px;
  left: 103px;
  border-top-color: rgba(222, 222, 222, 0.66);
  border-width: 12px;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}
.event2Bubble:after{
  bottom: 57px;
  left: 103px;
  border-top-color: #F6F6F6;
  border-width: 12px;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.eventTime{
  display: flex;
}
.DayDigit{
  font-size: 27px;
  font-family: "Arial Black", Gadget, sans-serif;
  margin-left: 10px;
  color: #4C4A4A;
}
.Day{
  font-size: 11px;
  margin-left: 5px;
  font-weight: bold;
  margin-top: 7px;
  font-family: Arial, Helvetica, sans-serif;
  color: #4C4A4A;
}

.MonthYear{
  font-weight: 600;
  line-height: 10px;
  color: #9E9E9E;
  font-size: 9px;
}
.eventTitle{
  font-family: "Arial Black", Gadget, sans-serif;
  font-size: 11px;
  text-transform: uppercase;
  display: flex;
  flex: 1;
  align-items: center;
  margin-left: 12px;
  margin-top: -2px;
}
.now{
     background-color: #004165;
    color: white;
    border-radius: 7px;
    margin: 0 5px;
    margin-top: -2px;
    padding: 4px;
    font-size: 10px;
    font-family: Arial, Helvetica, sans-serif;
    border: 2px solid white;
    font-weight: bold;
    box-shadow: 0 0 0 2px #004165;
    width: 40px;
    text-align: center;
}

.goal:NOT(.active) *:NOT(.eventTitle){ filter: grayscale(1); -webkit-filter: grayscale(1); }
.goal:NOT(.active) > .event1Bubble, .goal:NOT(.active) > .event2Bubble{ -webkit-filter: opacity(.3); filter: opacity(.3); }
.goal.active .eventTitle{ color: green; }
.goal .eventTitle{ color: #a71930; }

/* step based settings */
.event1.active .notDone, .event1:NOT(.active) .done{ display: none; }
.event1 .notDone{ margin-bottom: 5px; }
.event1 .event1Bubble{ height: 70px; top: -80px; }
.event1 .Day{ min-height: 37px; }

.donateBtn{ letter-spacing: 3px; font-size: 20px; margin-top: -3px; margin-right: 10px; }
.donateBtn:hover{ text-decoration: underline !important; }
.donateBtn:NOT(:hover){
    text-decoration: none;
    background: linear-gradient(to right, #6666ff, #0099ff , #00ff00, #ff3399, #6666ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation: rainbow_animation 12s ease-in-out infinite;
    background-size: 400% 100%;
}
@keyframes rainbow_animation {
    0%,100% {
        background-position: 0 0;
    }

    50% {
        background-position: 100% 0;
    }
}

/* allyJoin */
#allyJoinWrap{ width: 600px; position: relative; }
#allyJoinWrap > div{ display: inline-block; width: 50%; float: left; }
#allyJoinRight{ position: absolute; top: 0; bottom: 0; border-left: 1px solid #cccccc; padding-left: 20px; }
.fm4sf.l{ padding: 7px 0; }
.fm4sf{ line-height: 19px; }
#joinOr{ position: absolute; left: -13px; writing-mode: vertical-rl; text-orientation: upright; background: #ffffff; font-weight: bold; padding: 4px 0; }
#joinOr{ top: calc(50% - 22px); }
#joinOr.de{ top: calc(50% - 43px); }

/* PVP-Task force */
#pvptf{ width: 298px; position: relative; top: -6px; }
#pvptf > div{ display: inline-block; float: right; }
#pvptf .ui-button{ margin: 0 !important; }
#pvptfTypeWrapper{ width: 198px; height: 34px; display: inline-block; border: 1px solid #ccc; text-align: center; padding: 0 !important;  }
#pvptfTypeWrapper label{ height: 32px; line-height: 32px; width: 50%; display: inline-block; float: left; margin: 0 !important; vertical-align: unset !important; cursor: pointer; -webkit-transition: all 1s; -o-transition: all 1s; transition: all 1s; }
#pvptf.on #pvptfTypeWrapper input:checked + label{ font-weight: bold; background: #6ae15c; cursor: default; color: #000; }

#pvptfWrapper{ height: 36px; margin-top: -2px; margin-bottom: 2px; }
#pvptfWrapper + hr{ margin-bottom: 6px; }
.pvptfStatus{ color: red; font-size: 24px; padding: 3px 10px !important; border-top-right-radius: 0px !important; border-bottom-right-radius: 0px !important; }
.pvptfStatus:NOT(.on):hover{ color: red; }
.pvptfStatus.on{ color: #23f10a; }
.pvptfStatus.on:hover{ color: #23f10a; }
#pvptfAlert{ font-size: 24px; border-top-left-radius: 0px !important; border-bottom-left-radius: 0px !important; }
#pvptfAlert.fa-bell{ padding: 3px 14.5px !important; }
#pvptfAlert.fa-bell-slash{ padding: 3px 10px !important; }
#pvptfAlert.fa-bell:hover, #haSendPingsWrapper:hover a{ color: gold !important; animation: tilt-shaking 0.15s infinite; }
#haEnablePingsWrapper:hover a{ color: #a8cf20 !important; }
#pvptfAlert.fa-bell-slash, #pvptfAlert.fa-bell-slash:hover{ color: red !important; cursor: not-allowed; }
#pvptfTypeWrapper > div:last-child{ position: relative; z-index: 9999; background: #fff; margin-top: 32px; border: 1px solid #ccc; border-radius: 6px; border-top-left-radius: 0; border-top-right-radius: 0; }
#pvptfTypeWrapper:NOT(.hover) > div:last-child{ display: none; }
#pvptfMember:empty{ margin: 0; padding: 0; list-style: none; }
#pvptfMember:NOT(:empty){ list-style: decimal; }

#alertProgressWrapper{ width: 298px; position: relative; top: 0; height: 3px; }
#alertProgress{ display: inline-block; position: absolute; top: 0; left: 0; height: 3px; width: 0; background: red; }

/* Hot Alert */
#haWrapper{ position: relative; width: 444px; border: 2px solid #ccc; border-radius: 4px; }
#haWrapper > div:NOT(.preloader), .showPings > div, #haMenu > div{ display: inline-block; float: left; position: relative; }
.haBbridge{ position: absolute; top: -49px; right: 0; width: 100px; height: 49px; border: none !important; }
#pingTip{ position: absolute !important; top: -54px; left: 8px; }
#haServerBtn{ position: absolute; right: 6px; }

#haWrapper:NOT(:hover) #pingTip,
#blockSendPing.plc #sendPingBtn,
#haSendWrapper.addText:NOT(:hover) textarea,
#haMenu .hoverDelay:NOT(.hover) > div{ display: none; }

#activateInfoWrapper{ position: absolute; top: -123px; left: 0; width: 100%; height: 170px; z-index: 999; }
#activateInfoWrapper + div{ height: 46px; }
#activateInfoWrapper div{ width: 100%; height: 138px; overflow-y: auto; }

#haSendWrapper{ height: 48px; }
#haSendWrapper.addText:hover{ position: absolute; top: 0px; left: 0; width: 100%; height: 200px; z-index: 999; }
#haSendWrapper.addText:hover + div{ height: 50px; }
#haAddText{ margin-top: 15px; height: 132px; }

.showPings{ width: 380px; }
.showPings > div:first-child > div:first-child, .showPings > div:nth-child(2) > div:first-child{ border-bottom: 1px solid #ccc; }
.showPings > div:first-child{ width: 80px; background: #f1f1f1; text-align: right; }
.showPings > div:first-child > div{ padding-right: 5px; }
.showPings > div:nth-child(2){ width: 300px; }
.showPings > div:nth-child(2) > div{ padding: 0 5px; white-space: nowrap; }
#showPings .hinfo{ padding: 0 5px 0 0 !important; margin-left: 0 !important; }
#dailyPing > span{ float: left; background: #eee; margin: 2px 5px; border: 1px solid #8b8b8b; border-radius: 5px; color: #000; padding: 0 5px; }

#haMenu{ width: 60px; }
#haMenu > .wrapper{ float: left; max-width: 30px; }
#haMenu a{ font-size: 20px; height: 49px; line-height: 49px; margin: 0; }
.haMenBtn.fa-cog{ padding: 0 4px !important; border-radius: 0; }
.haMenBtn.fa-bell{ padding: 0 5.25px !important; border-top-left-radius: 0; border-bottom-left-radius: 0; }

#haMenu .hoverDelay > div{ position: absolute; top: 49px; right: 0; z-index: 9999; }
#haMenu .hoverDelay > div > div{ border: 1px solid #ccc; border-radius: 4px; }
#haWrapper.blink:NOT(.hover){
    animation: blink .5s step-end infinite alternate;
}

#showMorePings{ position: absolute; z-index: 100; width: 384px; top: 49px; right: -2px; background: #f1f1f1; border: 2px solid #ccc; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px; }
#showMorePings > div:last-child{ background: #fff; }

.haBtn, .haSendBtn, .haSendCodeBtn{ margin: 2px 2px !important; padding: 4px 10px !important; border: 1px solid #ccc; }
/*#showMorePings > div:last-child > div:last-child span, .haSendBtn{ background: #f1f1f1; margin: 2px 5px !important; padding: 3px 10px !important; border: 1px solid #ccc; border-radius: 3px; white-space: inherit; display: inline-block; }*/
#showPings:not(.hover) > #showMorePings{ display: none !important; }


.haGrp{ position: relative; width: 474px; color: #000; padding: 5px; }
.haGrp > div:first-child{ width: 25px; margin-right: 5px; writing-mode: vertical-rl; text-orientation: upright; }
.haGrp > div:last-child{ position: relative; width: 432px; border-bottom: 2px solid #ccc; }
.haGrp > div, .haGrpItems div:not(.row){ display: inline-block; float: left; }
.haGrpItems{ text-align: center; }
.haGrpItems > div:NOT(:last-child){ border-bottom: 2px solid #ccc; }
.haGrpItems.events > div > div:last-child{ width: 342px; }
.haGrpItems:NOT(.events) > div > div:last-child{ width: 400px; }
.haGrpItems > .row{ background: #f1f1f1; }
.haGrp.events{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#b4e391+0,61c419+50,b4e391+100;Green+3D */
background: #b4e391; /* Old browsers */
background: -moz-linear-gradient(top,  #b4e391 0%, #61c419 50%, #b4e391 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #b4e391 0%,#61c419 50%,#b4e391 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b4e391', endColorstr='#b4e391',GradientType=0 ); /* IE6-9 */
}

.secTit{ min-width: 90px; text-align: center; }
.secTit, .haGrp > div:first-child{ font-weight: bold; font-size: 16px; }
.secTit, .haGrp.events > div:first-child{ padding-top: 4px; }
.haGrp.events .secTit{ height: 60px; line-height: 54px; }

.haBtn:NOT(.active){ background: #f79494; }
.haBtn.active{ background: #8cd556; }
.haSendBtn, .haSendCodeBtn{ background: #ccc; }

.haGrp.codes > div:first-child i{ font-size: 20px; margin-top: 6px; }
.fa-gift.enter{ margin-top: 20px !important; }
.haGrp.codes .row{ text-align: center; }
.haGrp.codes .haBtn{ width: 200px; }
.haGrp.codes{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e5e696+0,d1d360+100;Wax+3D */
background: #e5e696; /* Old browsers */
background: -moz-linear-gradient(top,  #e5e696 0%, #d1d360 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #e5e696 0%,#d1d360 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #e5e696 0%,#d1d360 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5e696', endColorstr='#d1d360',GradientType=0 ); /* IE6-9 */

}

.haGrp.ally .haGrpItems{ padding-top: 8px; }
.haGrp.ally{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d0e4f7+0,73b1e7+24,0a77d5+50,539fe1+79,87bcea+100;Blue+Pipe+%231 */
background: #d0e4f7; /* Old browsers */
background: -moz-linear-gradient(top,  #d0e4f7 0%, #73b1e7 24%, #0a77d5 50%, #539fe1 79%, #87bcea 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #d0e4f7 0%,#73b1e7 24%,#0a77d5 50%,#539fe1 79%,#87bcea 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d0e4f7', endColorstr='#87bcea',GradientType=0 ); /* IE6-9 */
}

.haGrp.shop{
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fcecfc+0,fba6e1+50,fd89d7+51,ff7cd8+100;Pink+Gloss+%232 */
background: #fcecfc; /* Old browsers */
background: -moz-linear-gradient(top,  #fcecfc 0%, #fba6e1 50%, #fd89d7 51%, #ff7cd8 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #fcecfc 0%,#fba6e1 50%,#fd89d7 51%,#ff7cd8 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #fcecfc 0%,#fba6e1 50%,#fd89d7 51%,#ff7cd8 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcecfc', endColorstr='#ff7cd8',GradientType=0 ); /* IE6-9 */
}

.haGrp.send{
text-align: center;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d8e0de+0,aebfbc+22,99afab+33,8ea6a2+50,829d98+67,4e5c5a+82,0e0e0e+100;Grey+3D */
background: rgb(216,224,222); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(216,224,222,1) 0%, rgba(174,191,188,1) 22%, rgba(153,175,171,1) 33%, rgba(142,166,162,1) 50%, rgba(130,157,152,1) 67%, rgba(78,92,90,1) 82%, rgba(14,14,14,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(216,224,222,1) 0%,rgba(174,191,188,1) 22%,rgba(153,175,171,1) 33%,rgba(142,166,162,1) 50%,rgba(130,157,152,1) 67%,rgba(78,92,90,1) 82%,rgba(14,14,14,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(216,224,222,1) 0%,rgba(174,191,188,1) 22%,rgba(153,175,171,1) 33%,rgba(142,166,162,1) 50%,rgba(130,157,152,1) 67%,rgba(78,92,90,1) 82%,rgba(14,14,14,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d8e0de', endColorstr='#0e0e0e',GradientType=0 ); /* IE6-9 */
}
#sendPingBtn{ line-height: 19px; margin-top: -1px; }
#sendPingBtn.plc{ min-height: 32px !important; }
#sendPingBtn .preloader{ padding-top: 3px !important; }
.haSendBtn.active{ background: gold !important; }
#haGiftcode{ caret-color: #000 !important; }
#haServerMenu{ display: inline-block; position: absolute; left: 50%; margin-top: -51px; margin-left: -105px; }
#haNamePopup{ padding: 15px; }
#hotalertServer label{ position: relative; width: 33%; min-height: 34px; }
#hotalertServer label > span{ display: inline-block; max-width: 86px; word-wrap: break-word; }
#hotalertServer label > input{ position: absolute; left: 100px; }
.haHookUpdate{ float: left; width: 50% !important; }
.haHookUpdate input{ width: 75% !important; }

.opacity-05, #sendPingBtn:NOT(.active), .opacity-05 input{
  cursor: not-allowed;
  
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

  /* IE 5-7 */
  filter: alpha(opacity=50);

  /* Netscape */
  -moz-opacity: 0.5;

  /* Safari 1.x */
  -khtml-opacity: 0.5;

  /* Good browsers */
  opacity: 0.5;
}

input[type="text"]{ width: 175px; }
#allyHooks input[type="text"]{ width: 300px; }
#allyHooks .formRow.oneline > label { width: 150px; }
input[type="number"]{ width: 60px; }
.hinfoWrapper{ width: 32px; height: 1px; display: inline-block; position: relative; }
.hinfoWrapper > .hinfo, .hinfoWrapper > .hinfoBtn{ font-size: 22px; position: absolute; bottom: -10px; left: -5px; }
input:read-only{ background-color: #f7f7f7e6 !important; }
.no-upper{ text-transform: none; }
.addListBtn{ margin-left: 10px; color: var(--link-color); background: #f1f1f1; border: 1px solid #ccc; border-radius: 6px; cursor: pointer; padding: 4px;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+70 */
background: -moz-linear-gradient(top,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 70%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 70%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 70%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}
.addListBtn:hover{ color: var(--link-color-hover);
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0.65+0,0+100 */
background: -moz-linear-gradient(top,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=0 ); /* IE6-9 */
}

#partiEdit{ border-bottom: none; }
#saveParti{ margin-left: 75px; }

.met, .ac, .sow, .am, .strikeWin{ cursor: pointer; }
.strikeList{ list-style: none; padding-left: 15px; }
.strikeList .sep{ font-weight: bold; margin-right: 15px; }
#strikeText{ margin-top: 10px; resize: vertical; height: 85px; }
.deleteStrike{ margin-left: 10px; }
#strikeCat{ margin-top: 2px; }

.formRow.oneline > label{ display: inline-block; width: 150px; }
.taTit{ width: 150px !important; }
.pointer{ cursor: pointer; }
.checkbox-group{ padding-left: 25px; }

/* member list */
.dataTables_scrollHeadInner, .dataTable{ width: 100% !important; min-width: 800px; }
#memberListSec{ position: relative; }
@media (max-width: 750px){ #memberListSec{ margin-top: 75px; } }
#memberlist .rankWrapper{ display: inline-block; }
#memberlist tbody > tr > td:NOT(:nth-child(2)){ text-align: center; }

.nameCol{ width: 190px; max-width: 190px; }
.rankCol{ width: 71px; }
.linkCol{ width: 140px; }
.littleCol1{ width: 21px; position: relative; }
.littleCol2{ width: 40px; position: relative; }

.cio{ margin-top: 2px; }
#memberListSec tfoot th{ text-align: left; }
.acrCol button{ height: 29px; width: 40px; padding: 1px 7px !important; min-height: 29px; outline: none; }
.acrCol .fas{ color: #cecece; font-size: 24px; }
.acrCol[data-order="1"] .fas{ color: #27f527; }
.acrCol .preloader + i{ display: none; }
.acrCol .preloader{ height: 27px; padding-top: 1px; border-radius: 3px; }
.rlh{ float: left; width: 30.5px !important; height: 30.5px; }

.sizeRow{ padding-left: 30px; display: inline-block; padding-right: 50px; }
.sizeRow > span{ display: inline-block; min-width: 170px; }
.armyTierWrapper > div{ float: left; width: 110px; text-align: center; }
/*.armyTierWrapper > div > input{ width: 110px; }*/
.armyTierWrapper.header > div:first-child{ line-height: 73px; height: 50px; font-weight: bold; }
#br{ margin-left: 5px; }

.typeBoniList{ background: rgb(33, 37, 41); color: #ccc; border-radius: 10px; }
.typeBoniList > div:first-child{ font-weight: bold; border-bottom: 1px solid #ccc; }
.typeBoniList span{ float: left; text-align: center; display: inline-block; width: 75px; height: 24px; padding: 0 2px; }
.typeBoniList > div > span:first-child{ text-align: right; }

.userArmyList > div:first-child{ font-weight: bold; border-bottom: 1px solid #ccc; }
.userArmyList span{ float: left; text-align: center; display: inline-block; width: 65px; height: 24px; }
.bonusSum{ border-top: 1px solid #ccc; }
#memNote{ position: absolute; left: 0; top: 35px; bottom: 50px; width: 100%; resize: none; }

/* member menu */
.editMemberMenu{ width: 200px; }
.editMemberMenu button{ width: 100%; }
.editMemberMenu i{ margin-right: 5px; }


/* presence block */
.presenceWrapper{ position: relative; }
.presenceWrapper ul{ margin: 0; padding: 4px 10px; list-style: none; width: 260px; }
html.dark .presenceWrapper ul, .userArmyList{ background-color: rgb(33, 37, 41) !important; }
.presenceWrapper ul li div{ float: left; width: 25%; }
.presenceWrapper ul li div:first-child{ font-weight: bold; }

#powerTip .presenceTip{ width: 260px; margin-top: 12px; margin: 0; padding: 0; list-style: none; }
#powerTip .presenceTip li div{ float:left; margin: 1px 0; text-align: center; }
#powerTip .presenceTip li div:first-child{ width: 45%; }
#powerTip .presenceTip li div:nth-child(2){ width: 55%; }
    
.presenceWrapper.edit > div{ border-bottom: 1px solid #ccc; margin-bottom: 10px; padding: 5px 0; }
.presenceWrapper.edit > div > div{ float: left; width: 25%; font-weight: bold; text-align: left; }
.presenceWrapper.edit > div > div:first-child{ padding-left: 5px; }
.presenceWrapper.edit ul{ width: 100%; }
.presenceWrapper.edit ul > li{ margin: 2px 0; }
.presenceWrapper.edit input[name="0"],
.presenceWrapper.edit input[name="1"]{ width: 100%; }
.presenceWrapper.edit input[name="2"]{ width: 70px; }

.presenceWrapper:NOT(.edit) ul, /* :NOT(:hover) */
#powerTip .presenceTip .editMemParti{ display: none; }

.rlDateQuick{ position: absolute; top: 0px; right: 7px; }
#checkRLlist > div:first-child{ text-align: center; font-weight: bold; border-bottom: 1px solid #ccc; margin-bottom: 5px; padding-bottom: 5px;}
#checkRLlist > div > span{ display: inline-block; }
#checkRLlist > div > span:first-child{ width: 200px; padding-left: 5px; }
#checkRLlist > div:NOT(:first-child) > span:first-child:hover{ cursor: pointer; font-weight: bold; }
#checkRLlist > div > span:last-child{ width: 100px; text-align: center; }
#checkRLlist span.blue, .rlDateQuick.blue{ color: blue; }
#checkRLlist span.red, .rlDateQuick.red{ color: red; }


/* member chart */
#memberArmy{ position: relative; }
#showUserToken{ position: absolute; top: -49px; right: 4px; background: #ccc; border-radius: 50%; }
#memberArmy label > b{ color: #000; font-size: 18px; line-height: 18px; }
#memberArmy label > b > small{ color: #808080; font-size: 14; font-weight: normal; }
.sizeNotice{ text-transform: uppercase; margin-left: 15px; }
#brtit{ color: #000; }
#memberChart_wrapper td, #memberChart_wrapper th{ text-align: center; }

/* info windows */
.infoWin{ padding: 10px; }
.infoWin h2{ font-size: 22px; margin-bottom: 12px; }
.infoWin p:first-child{ font-weight: bold; }
.infoWin p{ margin: 10px 0 16px; }
.heighImage{ height: 425px; cursor: row-resize; overflow-y: scroll }
.heighImage > div{ margin: 0 !important; }
.heighImage.armysetup{ height: 350px; }

.tutitem{ display: flex; }
.tutitem > div{ flex: 1; }
.tutitem.talents > .imgCol{ min-width: 420px; max-width: 420px; }
.tutitem.equip > .imgCol{ min-width: 575px; max-width: 575px; }
.tutitem.army > .imgCol{ min-width: 555px; max-width: 555px; }


/* nicknames not found list */
#NotFoundListWrapper{ background: #fff; padding-left: 5px; padding-top: 2px; }
#NotFoundListWrapper > h4, #NotFoundListWrapper > hr{ margin: 5px 0 5px 0; }
#notFoundList{ margin: 0; padding: 0; padding-left: 5px; }

/* participate lists */
#partilist{ position: relative; z-index: 150; min-height: 100%; }
#partiReview{ position: absolute; z-index: 200; top: 0; left: 0; bottom: 0; width: 100%; background: #fff; }
#partiReview > div:first-child{ background: #fff; }
.patiRewLi{ margin: 0; width: 33.3%; float: left; min-height: 200px;  padding-bottom: 5px; }
.patiRewLi > li:first-child{ list-style: none; margin-left: -40px; padding-left: 30px; background: #f1f1f1; font-weight: bold; line-height: 40px; }
.patiRewLi i{ margin-right: 10px; }
.patiRewLi > li:NOT(:first-child){ border-radius: 10px; padding-left: 10px; list-style: none; }
#partilist:NOT(.review) #partiReview, #partilist.review #parti_wrapper{ display: none; }
#newPartiMenu{ margin-top: 20px; left: 50%; margin-left: -100px; }
#parti_wrapper{ top: 0; }
.partiSelector{ margin-top: 5px; height: 34px; display: inline-block; border: 1px solid #ccc; text-align: center; padding: 0 !important; border-radius: 4px; }
.partiSelector span{ height: 32px; line-height: 32px;  display: inline-block; float: left; padding: 0 5px; margin: 0 !important; vertical-align: unset !important; cursor: pointer; -webkit-transition: all 1s; -o-transition: all 1s; transition: all 1s; }
.partiSelector span:hover, .patiRewLi > li:hover{ background-color: #ccc; cursor: pointer; }
.partiSelector *:nth-child(2){ border-left: 1px solid #ccc; border-right: 1px solid #ccc; }

#partiEdit_wrapper .fg-toolbar, #partiEdit_wrapper .DataTables_sort_icon{ display: none; }


@media (max-width: 992px){
    #hotalertServer label{ width: 49%; }
}