@media (min-width: 768px){ .container{ width: 800px !important; } }
a > i { padding-right: 0px; }
.fa{ margin: 0 5px; }

/* dark mode */
html.dark .lordlist{ background: #181818; color: #fff; }

#optionRow{ margin-bottom: 15px; text-align: center; }
#optionRow > div:first-child{ width: 40%; }
#optionRow > div{ float: left; width: 60%; }
#myLordsList .co{ width: 48px; }
.nameco{ min-width: 1px; min-height: 1px; }

/* action block */
#lordActionWrap{ min-height: 117px; }
#lordActionBtns{ text-align: center; margin-bottom: 20px; }

#lordActionBtns.jail > a[data-action="dead"],
#lordActionBtns.jail > a[data-action="revive"],
#lordActionBtns.jail > a[data-action="home"],
#lordActionBtns.heal > a[data-action="dead"],
#lordActionBtns.heal > a[data-action="jailed"],
#lordActionBtns.heal > a[data-action="home"],
#lordActionBtns.kill > a[data-action="jailed"],
#lordActionBtns.kill > a[data-action="revive"]{ display: none; }

/* Lord lists */
#free, #busyRow{ width: 308px; }
#jail{ width: 380px; }
.lordlist{ color: #000; list-style: none; margin: 0; padding: 0; border: 1px solid #ccc; border-radius: 20px; overflow: hidden; }
.lordlist .preloader > div{ height: 36px; line-height: 36px; }
#free{ float: left; }
#jail{ float: right; }
#busyRow{ border-radius: 20px; line-height: 25px !important; font-size: 16px; height: 185px; }
#busyRow > button{ padding-top: 6px !important; margin-top: 8px; }

.visbleLord.ui-state-highlight{ height: 38px; }
.lordlist li.plc{ min-height: 36px; }
.lordlist .preloader{ padding-top: 0; }
.lordlist li{ height: 36px; line-height: 36px; padding: 0 10px; transition: all 0.5s ease; overflow: hidden; border-top: 1px solid transparent; border-bottom: 1px solid transparent; cursor: pointer; }
.lordlist li:first-child{ border-top-left-radius: 20px; border-top-right-radius: 20px; }
.lordlist li:last-child{ border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; }

/*#jail .uselordwrap{ float: right !important; margin-right: 5px; }*/

.lordlist li:NOT(#busyRow) > *{ float: left; }
.lordlist li:NOT(#busyRow) > span:nth-child(1){ width: 105px; }
.lordlist li:NOT(#busyRow) > span:nth-child(2),
.lordlist li:NOT(#busyRow) > span:nth-child(3){ width: 120px; max-width: 120px; }
.lordlist li:NOT(#busyRow) > span:last-child{ float: right; }

.visbleLord:hover{ color: #fff; }
.visbleLord:NOT(.inuse):hover{ background: green; color: #fff; }
.visbleLord.inuse{ color: #fff; background-color: green; border-color: #ccc; font-weight: bold; }
.visbleLord.inuse:hover{ background-color: red; }
.openLogin{ height: 34px; margin-top: -6px; }


/*.openLogin { margin-top: -3px; margin-left: 10px; }*/
.fa-eye{ min-width: 20px; }

#jail .nameco,
#free .jailedname,
#free a[data-action="dead"],
#free a[data-action="home"],
#free li.ui-state-highlight a[data-action="jailed"],
#free li:NOT(.ui-state-highlight) a[data-action="revive"],
#free li:NOT(.showLogin) .openLogin{ display: none; }


.lordbtn, .lordbtn, .lordbtn, .lordbtn > img{ border-radius: 4px; }
.lordbtn{ padding: 2px 7px !important; width: 42px; height: 34px; margin-top: -1px;}
.lordbtn > img{ margin: 0; width: 28px; height: 28px; -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); filter: grayscale(100%); transition: all 0.5s ease; }
.lordbtn, .lordbtn:hover > img{ -webkit-filter: grayscale(0); -moz-filter: grayscale(0); filter: grayscale(0); }

/* own lords */
#myLordsList{ list-style: none; margin: 0; padding: 0; }
#myLordsList div{ float: left; width: 135px; }
#myLordsList li > div:first-child{ float: left; width: 120px; }
#dis{ width: 200px; }
a.remLord:hover{ color: red !important; }
.addLord, .remLord{ font-size: 20px; }