@font-face {
    font-family: pixel;
    src: url('https://cdn.idle-pixel.com/fonts/pixel.ttf');
  }


  
.wrapper-grid {
    display:grid;
    grid-template-columns: 2fr 6fr 2fr;
    grid-template-areas: 
            "lefty middy righty"
            "bot bot bot";
    grid-gap: 20px;
}

@media (max-width: 780px) {
    .wrapper-grid {
        grid-template-columns: 1fr;
        grid-template-areas: 
                    "middy"
                    "lefty"
                    "righty"
                    "bot";
    }
  }

  
  .new-login-updatelog {
    grid-area: bot;
    border:1px solid rgb(156, 156, 156);
    background-color: #e9e9e9ac;
    border-radius: 10pt;
    padding:20px;
  }

.new-login-left {
    border:1px solid grey;
    grid-area: lefty;
    background-color: #e9e9e9dc;
    border-radius: 10pt;
    padding:20px;
}

.new-login-middle {
    border:1px solid grey;
    background-color: #bbf3f3e6;
    border-radius: 10pt;
    grid-area: middy;
    padding:20px;
    box-shadow: 1px 1px 5px;
}

.landing-page-panel-link {
    text-decoration: none;
    font-size: 14pt;
    color:grey;
}


.new-login-right {
    border:1px solid grey;
    grid-area: righty;
    background-color: #e9e9e9dc;
    border-radius: 10pt;
    padding:20px;
    font-size: 14pt;
}


.background-login {
    margin:20px;
    background-image:url('https://cdn.idle-pixel.com/images/bg_bg_light_castle_3.png');
    background-size: cover;
    background-size: 100% 100%;
}


.new-login-banner {
    border:1px solid grey;
}

.data-preset-entry {
    border:1px solid grey;
    background-color: white;
    padding:20px;
    max-width:250px;
    width:250px;
    margin:20px;
    display: inline-block;
    box-shadow: 1px 1px 5px;
    text-decoration: none;
    color:black;
}

.data-preset-entry a {
    text-decoration: none;
    color:black;
}

.new-login-middle .input-text {
    width:70%;
    font-size: 20px;
    padding:10px;
    border-radius: 5pt;
    margin:10px;
}

.new-login-middle input {
    width:70%;
    padding:10px;
    border-radius: 5pt;
    border:1px solid grey;
    margin-top:30px;
    box-shadow: 1px 1px 5px grey;
    font-size: 16pt;
    margin:10px;
}

a .new-preset {
    border:1px solid red;

}



.login-form-footer-label {
    color:black;
    margin-bottom:20px;
}

.login-form-footer-label a {
    color:black(255, 255, 255);
    text-decoration: none;
}

.login-form-footer-label i {
    color:orange;
    text-decoration: none;
}


body.font-famlies {
    font-family:"Roboto","Lucida Grande","bitstream vera sans","trebuchet ms","sans-serif","verdana";
}

body.legacy-font-families {
    font-family: 'pixel','Courier New', Courier, monospace !important; 
}

.hover:hover {
    cursor: pointer;
    filter: brightness(65%);
}

.hover-no-cursor:hover {
    filter: brightness(65%);
}

.hover-underline:hover {
    cursor: pointer;
    filter: brightness(65%);
    text-decoration: underline;
}

.inactive-animal-box {
    background-color: #8c7300;
}

.combat-modal-monster-table {
    background-color: rgb(255, 255, 255, 0.9);
    border:1px solid rgb(49, 49, 49);
    box-shadow: 1px 1px 5px;
}


.modal-robot-waves-table {
    border-radius: 5pt;
    box-shadow: 1px 1px 3px;
}

.modal-robot-waves-table td {
    padding:10px;
}


.modal-robot-waves-table-select {
    border:1px solid black;
    background-color: #dfd966;
    border-radius: 5pt;
    box-shadow: 1px 1px 3px;
}

.modal-robot-waves-table-select td {
    padding:10px;
}

.modal-robot-waves-select-table tr {
    border:1px solid black;
}

.gathering-button {
    border:1px solid silver;
    box-shadow: 1px 1px 5px;
    border-radius: 3pt;
    padding:5px 20px;
    font-size:24pt;
}

.badge-select-area {
    margin-top:20px;
    border:1px solid grey;
    background-color: #FEFEFE;
    padding:20px;
    box-shadow: 1px 1px 10px;
}

.table-badge-button {
    background-color: #b4b4b4;
    border:1px solid grey;
    box-shadow: 1px 1px 5px;
    width:300px;
    margin: 10px;
    display: inline-block;

}

.table-seed-popup {
    border:1px solid silver;
    box-shadow: 1px 1px 5px;
    background-color: #EDEDED;
}

.table-seed-popup td{
    padding: 5px 10px;
}


.badge-unlocked {
    background-color: #c6ffc5;
    border:1px solid rgb(0, 129, 19);
}

.table-badge-button td {
    padding:10px;
}

.right {
    text-align: right;
}
.modal-robot-waves-select-table-hover:hover {
    cursor: pointer;
    background-color: silver;
}


.robot-waves-list-table {

    background-color: #fff6f6;
}
.robot-waves-list-table td {
    padding:20px;
}

.robot-waves-list-table th {
    padding:20px;
}

.robot-waves-list-table-loot {

    background-color: #fff6f6;
    text-align: center;
}

.rare-monster-pot-shortcut {
    display:inline-block;
    border:1px solid black;
    background-color: #0000006e;
    margin-top:10px;
    padding:5px;
    color:silver;
    font-size: 10pt;
    border-radius: 5pt;
}

.select-character-screen-box {
    background-color: #78f3e5d0;
    padding:20px;
    border-radius: 20pt;
    margin:50px auto;
    display: inline-block;
}

.select-defaut-character-next-btn {
    width:100%;
}
.character-screen-box-skill {
    background-color: #b7ff8ed0;
    padding:10px 20px;
    border-radius: 5pt;
    margin:30px;
    width:400px;
}

.character-screen-box-skill td {
    padding:10px;
}


.notification-banner {
    border:1px solid rgba(0, 0, 80, 0.447);
    background-color: #95fff169;
    color:grey;
    padding:10px;
    display: block;
    margin:10px;
}

.notification-banner-red {
    border:1px solid rgb(80, 0, 0);
    background-color: #ffe8e8;
    color:black;
    padding:5px;
    display: block;
    text-align: center;
    margin-top:10px;
}



.robot-waves-list-table-loot td {
 padding:20px;
 text-align: center;
}

.produce-item-table {
    border:1px solid black;
    box-shadow: 2px 2px 5px;
}

.breeding-table td {
    padding:20px;
}

.table-list-ores-chances {
    border:1px solid silver;
    background-color: #e6fdfa;
    padding:20px;
    box-shadow: 1px 1px 5px;
}

.breeding-table-ingredient {
    padding:5px 0px;
}

.table-list-ores-chances-reqs {
    border:1px solid silver;
    background-color: #fde9e6;
    padding:20px;
    box-shadow: 1px 1px 5px;
}


.table-list-ores-chances-reqs th{
    border-top:1px solid silver;
    border-bottom:1px solid silver;
    padding:5px;
    background-color: #8e8e8e;
    text-align: center;
}
.table-list-ores-chances-reqs td{
    border-top:1px solid silver;
    border-bottom:1px solid silver;
    padding:5px;
    text-align: center;
}


.table-list-ores-chances th{
    border-top:1px solid silver;
    border-bottom:1px solid silver;
    padding:5px;
    background-color: #8e8e8e;
    text-align: center;
}

.table-list-ores-chances td{
    border-top:1px solid silver;
    border-bottom:1px solid silver;
    padding:5px;
    text-align: center;
}


.robot-waves-list-table-loot th {
    padding:20px;
    text-align: center;
}


.modal-robot-waves-select-table-hover td {
    border: 1px solid grey;
    text-align: center;
}


.modal-robot-waves-select-table th {
    background-color: #b8b354;
    text-align: center;
}

.modal-robot-waves-select-table td th {
    border:1px solid grey;
    padding:20px;
}

.new-game-shop-box {
    width:400px;
    height:80px;
    background-color: #3f3f3f;
    border-radius: 5pt;
    border:1px solid grey;
    display: inline-block;
}

.grey-button {
    background-color: grey;
}


.furnace-select-ore-table th {
    border-bottom:1px solid black;
    padding:10px;
    font-size: 14pt;
    background-color: #262626;
    color:silver;
    text-align: center;
}

.furnace-select-ore-table td {
    padding:20px;
    background-color: #434343;
    color:silver;
    text-align: center;
}

.new-game-shop-box-table td{
    padding:5px 10px;
}

.splash-box {
    position: fixed;
    min-width:50px;
    max-width:700px;
    right:40px;
    background-color: rgba(46, 46, 46, 0.98);
    border: 1px solid rgb(0, 0, 0);
    color:rgb(176, 176, 176);
    padding:10px 20px;
    display:inline-block;
    margin: 10px auto;
    box-shadow: 2px 2px 5px;
}

.splash-box-table td {
    color:white;
    font-size: 16pt;
}


.requirment-combat-modal-info {
    background-color: rgba(253, 254, 195, 0.9);
    border:1px solid grey;
    display: inline-block;
    box-shadow: 1px 1px 5px;
    padding:20px;
}

.modal-fight-areas-area-title {
    background-color: rgba(195, 254, 198, 0.6);
    border:1px solid grey;
    display: inline-block;
    padding:10px;
}

.modal-fight-blood-areas-area-title {
    background-color: rgba(254, 195, 195, 0.6);
    border:1px solid grey;
    display: inline-block;
    padding:10px;
}

.combat-modal-monster-table th {
    text-align: center;
    padding:10px 10px;
}

.combat-modal-monster-table td {
    padding:5px 10px;
    text-align: center;
    border:1px solid grey;
}

.reroll-blue-orb-entry {
    border:1px solid blue;
    padding:20px;
    background-color: rgb(168, 213, 255);
    display:inline-block;
}

.reroll-green-orb-entry {
    border:1px solid rgb(83, 139, 0);
    padding:20px;
    background-color: rgb(210, 255, 182);
    display:inline-block;
}

.quest-table {
    background-color: #FEFEFE;
    border:1px solid silver;
    box-shadow: 1px 1px 3px;
}

.quest-table tr {
    border:1px solid grey;
}

.quest-table th {
    text-align: center;
}

.quest-table td {
    text-align: center;
}


.reroll-red-orb-entry {
    border:1px solid rgb(139, 0, 0);
    padding:20px;
    background-color: rgb(255, 182, 182);
    display:inline-block;
}

.table-borders td {
    border:1px solid black;
}

.shooting-star-enchant-table th {
    border:1px solid rgb(0, 0, 81);
    background-color: #cefff9;
    padding:10px;
}


.tutorial-static {
    display: inline-block;
    padding:10px 20px;
    border:1px solid rgb(56, 56, 56);
    background-color: rgb(0, 76, 78);
    color:white;
    pointer-events: none;
    box-shadow: 1px 1px 5px;
    border-radius: 3pt;
    margin: auto;

}

.furnace-input-box {
    width:50px;
}

.tutorial {
    position: fixed;
    right: 30;
    top: 60;
    z-index: 400;
    padding:10px 20px;
    border:1px solid black;
    background-color: #000000c0;
    color:white;
    pointer-events: none;

}

.shooting-star-enchant-table td {
    border:1px solid rgb(0, 0, 64);
    background-color: #00d6ba;
    padding:10px;
}

.drop-log-div {
    display: inline-block;
    border:1px solid grey;
    box-shadow: 1px 1px 5px;
    padding:5px 20px;
    background-color: #4f4f4f67;
}
.drop-log-dt {
    text-align: right;
    padding:10px;
}
.left-menu-item
{
    margin-bottom: 3px;
}

.market-rules-box
{
    border:1px solid grey;
    background-color: black;
    padding:20px;
    color:red;
    display: inline-block;
    max-width: 400px;
}

.chat-username {
    text-decoration:none;
    color:black;
}

.chat-username:hover
{
    cursor: pointer;
    color:red !important;
}

.hardcore-warning {
    color:red;
    font-size: 10pt;
    margin:20px;
    padding:10px;
    background-color: rgb(246, 216, 216);
    border:1px solid grey;
}

.hover-arrow
{
   border:1px solid black;
   background-color: white;
   box-shadow: 1px 1px 5px;
   padding:5px;
}

.hover-menu-bar-item {
    margin:0;
    padding:0;
}

.hover-menu-bar-item:hover
{
    background-color: rgb(145, 110, 110);
}

.hover-menu-bar-item-combat {
    div {
        margin:0;
        padding:0;
    }
    
}

.hover-menu-bar-item-combat:hover
{
    div {
        margin:0;
        padding:0;
    }
    background-color: rgb(145, 110, 110);
}

.dropdown-button {
    border:1px solid silver;
    display: inline-block;
    background-color: #d4d4d4;
    padding: 0px 10px;
    color:black;
}


.search-anything-item-box {
    border: 1px solid silver;
    box-shadow: 1px 1px 1px;
    margin:7px;
    padding:5px 8px;
    display: inline-block;
    width:250px;
    font-size: 10pt;
    background-color: #5a5a5a;
    color:white;
}

.center
{
    text-align: center;
}


button
{
    border:1px solid black;
    box-shadow: 1px 0px 2px 1px grey;
    border-radius: 2pt;
}

.btn-close {
    border:1px solid grey !important;
}

button:hover
{
    filter: brightness(65%);
}

img {
    vertical-align: middle;
}
.color-grey
{
    color:grey;
}

.donor-coins-display {
    border:1px solid black;
    display: inline-block;
    padding: 10px 30px;
    margin:20px;
    background-color: silver;
}

.donor-coins-arrow {
    background-color: white;
    border:1px solid black;
    display: inline-block;
    padding: 10px 10px;
}

.locked-area-box {
    background-color: rgba(0, 0, 0, 0.726);
    border:1px solid black;
    padding:20px;
    display: inline-block;
}

.color-black
{
    color:black;
}

.color-blue
{
    color:blue;
}

.color-pink
{
    color:pink;
}

.color-cyan-darker
{
    color:rgb(0, 197, 197);
}

.color-cyan
{
    color:cyan;
}

.color-light-red
{
    color:rgb(253, 146, 146);
}

.color-white
{
    color:white;
}

.background-grey
{
    background-color: grey;
}

.hover-tr:hover
{
    background-color: rgb(136, 229, 255);
    cursor: pointer;
}

.underline
{
    text-decoration: underline;
}


.img-rotate-90 {
    transform: rotate(90deg);
}
.font-small
{
    font-size: 0.8em;
}

.font-tiny
{
    font-size: 0.6em;
}

.font-large
{
    font-size: 1.3em;
}

.font-huge
{
    font-size: 6em;
}

.color-silver
{
    color:silver;
}

.color-primary
{
    color: rgb(0, 247, 255);
}
.btn-primary
{
    background-color: rgb(0, 247, 255);
}

.background-primary {
    background-color: rgb(0, 247, 255);
}

.foreground-primary {
    color: rgb(0, 247, 255);
}

.foreground-secondary {
    color: rgb(255, 174, 0);
}

.background-primary-light {
    background-color: rgb(169, 252, 255);
}
.background-white {
    background-color: white;
}


.background-primary-lighter {
    background-color: rgb(200, 247, 248);
}

.fresh-account-buy-pickaxe-text {
    font-size: 20pt;
}
.background-primary-gradient {
    background-image: linear-gradient(to top, rgb(128, 251, 255), rgb(255, 255, 255));
    min-height:100vh;
    margin: 0;
    background-repeat: no-repeat;
}


.referral-table-section-div {
    width:90%;
    margin:20px;
    display: block;
}

.table-notifications-referrals {
    border:2px solid black;
}
.table-notifications-referrals tr {
    border:1px solid rgb(91, 91, 91);
    text-align: center;
}
.table-notifications-referrals th {
    padding:20px;
    text-align: center;
    color:white;
    background-color: #005247;
}

.table-notifications-referrals td {
    text-align: center;
    background-color: #d2ffd9;
    padding:20px;
}

.table-notifications tr {
    border:1px solid grey;
    text-align: center;
}
.table-notifications th {
    padding:20px;
    text-align: center;
    color:white;
    background-color: #005247;
}

.table-notifications td {
    text-align: center;
    background-color: #eeeeee;
    padding:20px;
}


.table-customize-interface tr {
    border:1px solid grey;
}
.table-customize-interface td {
    padding:20px;
}

.pretty-panel {
    /** deprecated **/
}   

.left-menu-bar-notification {
    font-size:10pt;
    margin-top:5px;
    color:rgba(255, 255, 0, 0.702);
}


.panel-logo-xp-area {
    display: inline-block;
    padding:15px;
    border-radius: 5pt;
    margin-bottom: 20px;
    vertical-align: text-top;
}

.craftable-btns-title {
    font-size: 16pt;
    margin-bottom: 5px;
    color:grey;
}
.collection-log-entry {
    border:1px solid rgb(255, 0, 0);
    padding:7px;
    box-shadow: 1px 1px 5px;
    margin:8px;
    background-color: #ffd8d8;
    display: inline-block;
    vertical-align: text-top;
}

.boat-table {
    border:1px solid black;
    box-shadow: 1px 1px 4px;
}

.boat-table td {
    padding: 20px;
    border:1px solid silver;
}


.craftable-btns {
    display: none;
    padding:15px;
    margin-bottom: 20px;
    vertical-align: text-top;
    border-radius: 5pt;
    border: 1px solid silver;
    background-color: #e6e6e6;
}

.craftable-btn {
    display: inline-block;
    padding:5px;
    margin-bottom: 20px;
    vertical-align: text-top;
    background-color: #ffffff;
    border: 1px solid black;
}


.notification-passive {
    border-radius: 5pt;
}

.server_message {
    color:#005247;
    border:1px solid grey;
    background-color: #00d6ba;
    padding: 3px 6px;
    font-size: 10pt;
}


.event-table {
    border-collapse: collapse;
    border:2px solid grey;
    box-shadow: 1px 1px 2px;
}

.main-event-td {
    min-width:1000px;
    min-height:800px;
    max-width:1000px;
    max-height:800px;
}

.main-event-td-background-image {
    min-width:1000px;
    min-height:800px;
    max-width:1000px;
    max-height:800px;
}

.event-entry {
    background-color: rgba(0, 0, 0, 0.117);
    border:1px solid green;
    margin:20px;
}

.event-entry-random {
    background-color: rgba(129, 110, 0, 0.561);
    border:1px solid rgb(128, 113, 0);
}

.event-entry-points {
    background-color: rgba(129, 0, 101, 0.561);
    border:1px solid rgb(122, 0, 128);
}


.event-entry-extra-points {
    background-color: rgba(0, 110, 129, 0.561);
    border:1px solid rgb(0, 28, 128);
}

.stardust-potion-drink {
    border:1px solid orange;
    background-color: rgb(255, 232, 190);
    padding:10px;
}

.event-table td {
    background-color: #0c0c0c;
    color:silver;
    border:1px solid silver;
}

.box
{
    max-width:400px; 
    border:1px solid silver;
    border-radius: 5pt;
    padding:20px;
}

.create-account-box
{
    max-width:500px; 
    border:1px solid silver;
    border-radius: 5pt;
    padding:20px;
}

.shadow
{
    box-shadow: 1px 2px;
}


.hard-shadow
{
    box-shadow: 2px 4px;
}

.w40
{
    width:40px;
    height:40px;
}


.w30
{
    width:30px;
    height:30px;
}

.w35
{
    width:35px;
    height:35px;
}

.w25
{
    width:25px;
    height:25px;
}

.w20
{
    width:20px;
    height:20px;
}


.w300
{
    width:300px;
    height:300px;
}

.modal-cooking-select-log
{
    border:1px solid black;
    margin:10px;
    padding:10px;
    display: inline-block;
    background-color: rgb(155, 155, 155);
    color:white;
    border-radius: 2pt;
    min-width: 200px;
    box-shadow: 1px 1px 3px;
}

.modal-cooking-select-potion
{
    background-color: rgb(220, 21, 204);
}

.fighting-spell-area-heal
{
    background-color: #005114aa;
    border:1px solid black;
    border-left:1px solid rgb(9, 174, 0);
    border-top:1px solid rgb(9, 174, 0);
    border-bottom:1px solid rgb(9, 174, 0);
    padding:10px;
    color:white;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    margin-right:-3px;
    margin-top:20px;
}

.fighting-spell-area-heal-raids
{
    background-color: #005114aa;
    border:1px solid black;
    border-left:1px solid rgb(9, 174, 0);
    border-top:1px solid rgb(9, 174, 0);
    border-bottom:1px solid rgb(9, 174, 0);
    padding:5px;
    color:white;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    margin-right:-3px;
    margin-top:12px;
}


.fighting-spell-area-fire
{
    background-color: #510000aa;
    border:1px solid black;
    border-left:1px solid rgb(174, 0, 0);
    border-top:1px solid rgb(174, 0, 0);
    border-bottom:1px solid rgb(174, 0, 0);
    padding:10px;
    color:white;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    margin-right:-3px;
    margin-top:20px;
}

.fighting-spell-area-fire-raids
{
    background-color: #510000aa;
    border:1px solid black;
    border-left:1px solid rgb(174, 0, 0);
    border-top:1px solid rgb(174, 0, 0);
    border-bottom:1px solid rgb(174, 0, 0);
    padding:5px;
    color:white;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    margin-right:-3px;
    margin-top:5px;
}

.offline-timer {
    display: inline-block;
    vertical-align: text-bottom;
    border: 1px solid grey;
    padding: 10px 20px;
    background-color: #00ffdd55;
    margin:3px;
}

.offline-timer-ores {
    background-color: #e2e2e2;
}

.offline-timer-seeds {
    background-color: #63f56f;
}

.btn-fancy-selectable-off {
    border:1px solid red;
    background-color: #ff000040;
    padding:20px;
    margin:20px;
    font-size: 16pt;
    text-align: center;
}

.btn-fancy-selectable-on {
    border:1px solid green;
    background-color: #00ff0d40;
    padding:20px;
    margin:20px;
    font-size: 16pt;
    text-align: center;
}

.hover-red-text:hover {
    color:red;
}


.offline-timer-fish {
    background-color: #63a5f5;
}

.show-monsters-label {
    text-decoration: underline;
    font-size: 20pt;
}

.offline-timer-gathering {
    background-color: #ebbc58;
}

.fighting-spell-area-invisibility
{
    background-color: rgba(86, 86, 86, 0.667);
    border:1px solid black;
    border-left:1px solid rgb(155, 155, 155);
    border-top:1px solid rgb(155, 155, 155);
    border-bottom:1px solid rgb(155, 155, 155);
    padding:10px;
    color:white;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    margin-right:-3px;
    margin-top:20px;
}

.raids-potion {
    display: inline-block;
}

.fighting-spell-area-invisibility-raids
{
    background-color: rgba(86, 86, 86, 0.667);
    border:1px solid black;
    border-left:1px solid rgb(155, 155, 155);
    border-top:1px solid rgb(155, 155, 155);
    border-bottom:1px solid rgb(155, 155, 155);
    padding:5px;
    color:white;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    margin-right:-3px;
    margin-top:5px;
}

.fighting-hero-stats-area
{
    background-color: #495100aa;
    border-left:1px solid rgb(174, 157, 0);
    border-top:1px solid rgb(174, 157, 0);
    border-bottom:1px solid rgb(174, 157, 0);
    padding:10px;
    color:white;
    border-bottom-left-radius: 5px;
    border-top-left-radius: 5px;
    margin-top:20px;
}

.crafting-custom-table th {
    text-align: center;
}

.crafting-custom-table td {
    border:1px solid silver;
    text-align: center;
}

.crafting-custom-table tr:nth-child(odd) {
    background-color: #EDEDED;
}


.notification-gathering-panel {
    border:1px solid rgba(135, 135, 0, 0.534);
    background-color:rgba(50, 50, 0, 0.534);
    color:white;
    padding:20px;
    margin:20px;
    text-align: center;
    border-radius: 5pt;
}

.fighting-monster-stats-area
{
    background-color: #495100aa;
    border-right:1px solid rgb(174, 157, 0);
    border-top:1px solid rgb(174, 157, 0);
    border-bottom:1px solid rgb(174, 157, 0);
    padding:10px;
    color:white;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
    margin-top:20px;
}



.combat-spells-area {
    background-color: #005146aa;
    padding:15px;
    margin-bottom:50px;
    border-left:1px solid rgb(0, 174, 174);
    border-top:1px solid rgb(0, 174, 174);
    border-bottom:1px solid rgb(0, 174, 174);
    border-radius: 2pt;
}


.combat-presets-area {
    background-color: #fffa7544;
    padding:5px;
    margin-bottom:50px;
    border-right:1px solid orange;
    border-left:1px solid orange;
    border-bottom:1px solid orange;
    border-radius: 2pt;
    display: inline-block;
}

.no-select {
    user-select: none;
}

.combat-spells-area-spell-cooldown 
{
    z-index:5;
    position:absolute;
    font-size:20pt;
    margin-left:8px;
    margin-top:5px;
    color:rgb(143, 168, 255);
}

.combat-spells-area-spell {
    border:1px solid rgb(0, 0, 68);
    background-color: #00ffdd;
    padding:2px;
}

.combat-presets-combat-icon {
    border:1px solid rgb(68, 25, 0);
    background-color: #eff49a;
    padding:2px;
}

.team-trading-box {
    border:1px solid black;
    background-color: white;
    min-height:400px;
    padding:20px;
    box-shadow: 1px 1px 3px;
}

.team-username-offline {
    border:1px solid grey;
    background-color: #DEDEDE;
    display: inline-block;
    color:grey;
    vertical-align: text-top;
    padding:5px 10px;
    text-align: center;
    margin-right:10px;
}

.team-hiscore-btn {
    float:right;
    padding:10px;
    background-color: rgb(237, 237, 237);
    border-radius: 5pt;
}

.team-stoage-logger-context {
    background-color: #0000000f;
    padding:20px;
    font-size: 10pt;
    margin-bottom:10px;
}


.small-br {
    height:10px;
}

.progress-bar-dialogues {
    width:100%;
    height:30px;
    margin: 0 auto;
    border:1px solid grey;
    background-color: #DEDEDE;
}

.progress-bar-dialogues-inner {
    width:10%;
    top:0;
    left:0;
    height:100%;
    background-color: #32cd32;
}

.progress-bar-itembox {
    width:80px;
    height:10px;
    margin: 0 auto;
    border:1px solid grey;
    background-color: #DEDEDE;
}

.breeding-food-shop-entry-seeds {
    border:1px solid black;
    padding:20px;
    font-style: 20pt;
    display: inline-block;
    background-color: rgb(159, 222, 159);
    border-radius: 5pt;
    box-shadow: 1px 1px 5px;
    margin:5px;
    min-width:150px;
}

.breeding-food-shop-entry-leaves {
    border:1px solid black;
    padding:20px;
    font-style: 20pt;
    display: inline-block;
    background-color: rgb(89, 190, 89);
    border-radius: 5pt;
    box-shadow: 1px 1px 5px;
    margin:5px;
    min-width:150px;
}

.breeding-food-shop-entry-strange-leaves {
    border:1px solid black;
    padding:20px;
    font-style: 20pt;
    display: inline-block;
    background-color: rgb(13, 227, 13);
    border-radius: 5pt;
    box-shadow: 1px 1px 5px;
    margin:5px;
    min-width:150px;
}

.breeding-food-shop-entry-wood {
    border:1px solid black;
    padding:20px;
    font-style: 20pt;
    display: inline-block;
    background-color: rgb(187, 96, 17);
    border-radius: 5pt;
    box-shadow: 1px 1px 5px;
    margin:5px;
    min-width:150px;
}


.td-invent-warning-breeding {
    padding:20px;
    color:green;
    background-color: #b0ffbe;
}

.pick-mush-food {
    border:1px solid black;
    padding:10px;
    box-shadow: 1px 1px 5px; 
    width: 80px;
}

.breeding-food-shop-entry-metal {
    border:1px solid black;
    padding:20px;
    font-style: 20pt;
    display: inline-block;
    background-color: rgb(181, 181, 181);
    border-radius: 5pt;
    box-shadow: 1px 1px 5px;
    margin:5px;
    min-width:150px;
}

.breeding-food-shop-entry-fish {
    border:1px solid black;
    padding:20px;
    font-style: 20pt;
    display: inline-block;
    background-color: rgb(52, 146, 212);
    border-radius: 5pt;
    box-shadow: 1px 1px 5px;
    margin:5px;
    min-width:150px;
}

.breeding-food-shop-entry-fruit {
    border:1px solid black;
    padding:20px;
    font-style: 20pt;
    display: inline-block;
    background-color: rgb(228, 138, 111);
    border-radius: 5pt;
    box-shadow: 1px 1px 5px;
    margin:5px;
    min-width:150px;
}


.breeding-food-shop-entry-insects {
    border:1px solid black;
    padding:20px;
    font-style: 20pt;
    display: inline-block;
    background-color: rgb(246, 212, 201);
    border-radius: 5pt;
    box-shadow: 1px 1px 5px;
    margin:5px;
    min-width:150px;
}


.miniquest {
    border:1px solid rgba(0, 255, 255, 0.371);
    background-color: #75aca596;
    color:white;
    padding:20px;
    display: inline-block;
}

.miniquest img {
    padding-right:20px;
}

.mini-quest-table {
    border:1px solid grey;
    background-color: #e3fffb;
    width:100%;
}


.mini-quest-table th {
    padding:10px;
    border-top:1px solid silver;
    border-bottom:1px solid silver;
}


.mini-quest-table td {
    padding:10px;
    border:1px solid silver;
}

.buy-token-box {
    display: inline-block;
    padding:20px;
    margin: 20px;
    border:1px solid grey;
    background-color: rgb(192, 229, 193);
    box-shadow: 1px 1px 5px;
    width:150px;
}

.buy-animal-box {
    display: inline-block;
    padding:20px;
    margin: 20px;
    border:1px solid grey;
    background-color: rgb(229, 211, 192);
    box-shadow: 1px 1px 5px;
}

.active-animal-table {
    display: inline-block;
    border:1px solid grey;
    background-color: #4242421a;
    vertical-align: text-top;
    margin:20px;
    width:400px;
}

.sick-animal-table {
    background-color: rgba(255, 0, 0, 0.2);
}

.table-btn {
    width:100%;
    background-color: #FEFEFE;
    border:1px solid grey;
    box-shadow: 1px 1px 5px;
}

.table-btn td {
    padding:20px;
}

.table-btn td:last-child {
    width:100%;
}


.active-animal-table td {
    padding:5px;
    text-align: center;
    border:1px solid grey;
}

.active-animal-table td:last-child {
    width:100%;
}

.color-brown {
    color:brown;
}

.progress-bar-itembox-inner {
    width:10%;
    top:0;
    left:0;
    height:100%;
    background-color: #32cd32;
}

.black-img {
    filter: brightness(0%);
}

.rainbow {
    min-height:100%;
    background: 
     linear-gradient(rgba(255,0,0,1) 0%, rgba(255,154,0,1) 10%, rgba(208,222,33,1) 20%, rgba(79,220,74,1) 30%, rgba(63,218,216,1) 40%, rgba(47,201,226,1) 50%, rgba(28,127,238,1) 60%, rgba(95,21,242,1) 70%, rgba(186,12,248,1) 80%, rgba(251,7,217,1) 90%, rgba(255,0,0,1) 100%) 
     0 0/100% 200%;
     animation: a-rainbow 2s linear infinite;
  }
  
@keyframes a-rainbow {
to {background-position:0 -200%}
}

.level-up-animation-progress-bar {
    min-height:100%;
    background: 
     linear-gradient(rgba(26, 255, 0, 1) 0%, rgba(81, 255, 0, 1) 10%, rgba(33, 222, 83, 1) 20%, rgba(103, 220, 74, 1) 30%, rgba(63, 218, 110, 1) 40%, rgba(47, 226, 59, 1) 50%, rgba(28, 238, 56, 1) 60%, rgba(21, 242, 28, 1) 70%, rgba(12, 248, 102) 80%, rgba(117, 251, 7, 1) 90%, rgba(81, 255, 0, 1) 100%)
     0 0/100% 200%;
     animation: a-level-up-animation-progress-bar 2s linear infinite;
  }
  
@keyframes a-level-up-animation-progress-bar {
to {background-position:0 -200%}
}


.team-username-online {
    border:1px solid grey;
    background-color: #DEDEDE;
    color:grey;
    display: inline-block;
    vertical-align: text-top;
    padding:5px 10px;
    text-align: center;
    margin-right:10px;
}

.online-dot {
    height: 10px;
    width: 10px;
    background-color: #39ff71;
    border-radius: 50%;
    display: inline-block;
    box-shadow: 0px 0px 5px 1px green;
  }
  
  .offline-dot {
    height: 10px;
    width: 10px;
    background-color: #ff3939;
    border-radius: 50%;
    display: inline-block;
  }


.model-team-storage-item {
    display:inline-block;
    vertical-align: text-top;
    margin:5px;
    padding:10px;
    background-color: #FEFEFE;
    border:1px solid silver;
}

.penguin-ticket-wrapper {
    display: inline-block;
    margin:20px 20px 20px 0px;
    padding:10px 20px;
    background-color: rgb(220, 220, 220);
    border-radius: 5pt;
}

.liveteam-msg {
    border:1px solid green;
    background-color: rgba(0, 255, 0, 0.676);
    padding:20px;
    margin-top:20px;
}

.penguin-ticket {
    background-color: brown;
    color:white;
    text-align: center;
}

.friends-list-online {
    background-color: rgba(0, 128, 0, 0.367);
    color:green;
    font-size: 10pt;
    display: inline-block;
    position: absolute;
    border-top:1px solid green;
    border-left:1px solid green;
    padding:5px;
    border-bottom:1px solid green;
    right:0;
    top:60px;
    width:50x;
}

.friends-list-entry {
    border:1px solid silver;
    margin:40px;
    position: relative;
    width:500px;
    display: inline-block;
    vertical-align: text-top;
    background-color: #0000000f;
}

.friends-list-entry h1 {
    margin-left:120px;
    margin-top:20px;
}
.friends-account-type {
    margin-left:120px;
    color:grey;
}

.friends-account-right-tag {
    left:390px;
    top:10px;
    color:black;
    border:1px solid gold;
    display:inline-block;
    padding:10px;
    background-color: white;
    position: absolute;
}

.friends-list-entry-table {
    margin:50px 25px 20px 20px;
    background-color: #00000049;
    border-radius: 5pt;
}



.friends-list-entry-table img {
    margin-right:10px;
    font-size: 14pt;
}


.friends-list-entry-table td {
    padding:20px;
}



.team-trading-box-entry {
    border:1px solid grey;
    background-color: silver;
    padding:10px;
    display:inline-block;
    margin-right: 10px;
    margin-bottom: 10px;
    width:200px;
}

.team-trading-box-entry img{
    width:50px;
    height:50px;
    margin-right:20px;
}

.team-trading-box-entry span{
    color: #111111
}




.img-btn {
    display: inline-block;
    vertical-align: text-top;
    background-color: #EEEEEE;
    border:1px solid grey;
    padding:20px;
    margin:10px;
}

.itembox-icon img {
    position: absolute;
    z-index: 500;
    filter:brightness(80%);
    width:15px;
    height:15px;
    margin-top: 1px;
    margin-left: 80px;
}

.invention-itembox-icon img {
    position: absolute;
    z-index: 500;
    filter:brightness(80%);
    width:15px;
    height:15px;
    margin-top: 1px;
    margin-left: 80px;
}


.mega-tablette-section {
    background-color: rgb(250, 250, 250);
    padding:30px;
    display: inline-block;
}

.mega-tablette-entry {
    border:1px solid silver;
    background-color: white;
    display: inline-block;
    padding:10px;
}

.wiki img {
    position: absolute;
    z-index: 500;
    filter:brightness(80%);
    width:15px;
    height:15px;
}

.w15
{
    width:15px;
    height:15px;
}

.w10
{
    width:10px;
    height:10px;
}


.w7
{
    max-width:7px;
    max-height:7px;
}

.w50
{
    width:50px;
    height:50px;
}

.w100
{
    width:100px;
    height:100px;
}

.create-account-form-table tr td{
    padding:10px;
}

.create-account-form-table input {
    height:30px;
}

.w150
{
    width:150px;
    height:150px;
}

.captcha {
    border: 1px solid silver;
}

.w200
{
    width:200px;
    height:200px;
}

.background-silver
{
    background-color: #FEFEFE;
}

.quest-text
{
    border:1px solid black;
    padding: 20px;
    border-radius: 5pt;
    background-image: linear-gradient(to top, rgb(191, 250, 252), rgb(255, 255, 255));
}

.align-left
{
    text-align: left;
}
.foreground-black
{
    color:black;
}

.log-into-another {
    border:1px solid black;
    border-radius: 3px;
    font-size: 8pt;
    background-color: #DDDDDD;
    color:black;
    margin-top:50px;
    margin-bottom:10px;
    padding:5px;
    display: inline-block;
    box-shadow: 1px 1px 5px;
    bottom:0;
}

.link-no-decoration {
    text-decoration: none;
    color:silver;
}

.gold {
    color:gold;
}

.pink {
    color: pink;
}




.woodcutting-patch:hover
{
    border: 1px solid black;
}

.settings-section {
    border:1px solid black;
    background-color: white;
    padding: 50px 50px;
    width:400px;
    margin-top: 50px;
}
.background-game
{
    background-color:rgb(200, 247, 248);
}

.needle-entry {
    border:1px solid silver;
    background-color: #FEFEFE;
    display: inline-block;
    margin:20px;
}

.raid-canvas-table-tag tr td {
    border:1px solid lime;
}

.notifications-area
{
    width:100%;
    display: inline-block;
    top:0;
    padding:20px;
    margin-top:-25px;
    margin-left:-30px;
    margin-bottom:5px;
}


.trophy-banner-area {
    width:100%;
    background-color: rgba(255, 255, 0, 0.555);
    font-size: 20pt;
    border:1px solid gold;
    padding:20px;
    text-align: center;
}

.activity-log-area
{
    margin-top:-20px;
    margin-left:-22px;
    margin-right:-10px;
    resize:vertical;
    overflow:auto; /* something other than visible */
    font-family:"Roboto","Lucida Grande","bitstream vera sans","trebuchet ms","sans-serif","verdana";
    font-size:8pt;
    overflow-y: scroll;
    padding:7px;
    height:75px;
    color:#618E8E;
    background-color:rgb(0, 0, 0, 0.08);
}

.sublte-button {
    box-shadow: none;
    background-color: #FEFEFE;
    border-radius: 2px;
}


.itembox-bg-pirate-stuff {
    background-color: rgb(63, 90, 101);
}

.itembox-bg-pirate-stuff-2 {
    background-color: rgb(63, 101, 98);
}
.itembox-bg-pirate-stuff-3 {
    background-color: rgb(66, 101, 63);
}

.itembox-invention-tutorial {
    background-color: yellow;
    color:black;
}

.level-up-banner
{
    position: fixed;
    z-index: 1000000;
    width:80%;
    border:1px solid black;
    left:10%;
    font-size:30pt;
    background-color: #a79400e3;
    top:5%;
    border-radius: 5pt;
    display: none;
}

.market-history-table th {
    padding:10px;
    border:1px solid silver;
    width:15%;
    background-color: #0c0c0c;
    text-align: center;
    color: white;
}

.new-login-updatelog-entry {
    color: rgb(97, 97, 97);
    background-color: #0000000f;
    padding:20px;
    margin:10px;
}

.raids-spell-cooldown {
    color:silver;
    font-size: 10pt;
    font-weight: bold;
}

.market-history-table td {
    padding:10px;
    border:1px solid silver;
    background-color: #EDEDED;
    text-align: center;
    width:15%;
}

.achievement-perk-banner {
    position: fixed;
    z-index: 1000000;
    width:80%;
    border:1px solid black;
    left:10%;
    font-size:30pt;
    background-color: #16a700e3;
    top:5%;
    border-radius: 5pt;
    display: none;
}

.notification
{
    border:1px solid silver;
    display:inline-block;
    padding:5px 10px;
    background-color: rgb(0, 76, 78);
    font-size: 12pt;
    border-radius: 5pt;
    color:white;
    margin-top:10px;
}



.notification-rare
{
    border:1px solid rgb(0, 203, 173);
    display:inline-block;
    padding:5px 10px;
    background-color: rgba(0, 78, 65, 0.753);
    margin-top:10px;
}


.notification-ready
{
    border:1px solid grey;
    display:inline-block;
    padding:5px 10px;
    background-color: rgba(9, 78, 0, 0.753);
    margin-top:10px;
}


.notification-warning
{
    border:1px solid grey;
    display:inline-block;
    border-radius: 5pt;
    padding:5px 10px;
    background-color: rgba(78, 0, 0, 0.753);
    margin-top:10px;
}

.notification-halloween
{
    border:1px solid rgb(203, 122, 0);
    display:inline-block;
    padding:5px 10px;
    background-color: rgba(255, 191, 131, 0.753);
    margin-top:10px;
}


.notification-stopwatch
{
    border:1px solid grey;
    display:inline-block;
    border-radius: 5pt;
    color:white;
    padding:5px 10px;
    background-color: rgba(120, 124, 0, 0.549);
    margin-top:10px;
}


.notification-quest
{
    border:1px solid grey;
    display:inline-block;
    border-radius: 5pt;
    color:white;
    padding:5px 10px;
    background-color: rgba(7, 110, 114, 0.549);
    margin-top:10px;
}


.notification-potion
{
    border:1px solid silver;
    display:inline-block;
    padding:5px 10px;
    background-color: rgb(78, 0, 78, 0.549);
    margin-top:10px;
    border-radius: 5pt;
}

.notification-blood-moon
{
    border:1px solid red;
    display:inline-block;
    padding:5px 10px;
    background-color: rgb(0,0,0);
    margin-top:10px;
}

.notification-cooks-book
{
    border:1px solid grey;
    border-radius: 5pt;
    display:inline-block;
    padding:5px 10px;
    background-color: rgb(166, 138, 0);
    margin-top:10px;
}

.notification-boats
{
    border:1px solid grey;
    display:inline-block;
    padding:5px 10px;
    background-color: rgba(0, 89, 255, 0.657);
    margin-top:10px;
    color:white;
    border-radius: 5pt;
}

.notification-beehive {
    border:1px solid silver;
    display:inline-block;
    border-radius: 5pt;
    padding:5px 10px;
    background-color: rgb(140, 79, 0);
    margin-top:10px;
}

.landing-page-button {
    padding:20px;
    width:300px;
    box-shadow: 1px 2px 3px;
    border-radius:5pt;
}

.landing-page-button-label {
    font-size: 24pt;
    
}

.landing-page-button-label-2 {
    color:grey;
}

.notification-cooldown
{
    border:1px solid rgb(36, 0, 0);
    display:inline-block;
    padding:5px 10px;
    background-color: rgb(85, 0, 0);
}

.animation-shake
{
    animation: shake 0.1s infinite alternate;
}

@keyframes shake 
{
    from {
        margin-right:1px;
    }
    to {
        margin-left:1px;
    }
}

.preset-title {
    font-size: 16pt;
    font-weight: bold;
}


.quick-fight-btn {
    text-align: center;
    background-color: #fefefe;
    border:1px solid grey;
    font-size: 10pt;
    margin: 1px 5px;
    display: inline-block;
    vertical-align: text-top;
    padding:5px;
    border-radius: 5pt;
}



.img-outline {
    -webkit-filter: drop-shadow(1px 1px 0 black)
                    drop-shadow(-1px -1px 0 black);
    filter: drop-shadow(1px 1px 0 black) 
            drop-shadow(-1px -1px 0 black);
  }

.select-fighting-section {
    width:300px;
    height:400px;
    display:inline-block;
    vertical-align: text-top;
    margin:20px;
    background-repeat: no-repeat;
    background-size: cover;
    border:1px solid black;
    box-shadow: 1px 1px 3px;
}
.select-fighting-section-title {
    text-align: center;
    background-color: #fefefebd;
    border:1px solid grey;
    font-size: 20pt;
}

.select-fighting-section-title-subtitle {
    font-size: 8pt;
    font-style: italic;
    color:grey;
}

.select-fighting-section-fp-energy {
    text-align: center;
    background-color: #fefefebd;
    border:1px solid grey;
    font-size: 10pt;
    margin: 1px 5px;
    display: inline-block;
    vertical-align: text-top;
    padding:5px;
    border-radius: 5pt;
}

.fight-select-area-button-other {
    border:1px solid silver;
    background-color: rgba(192, 192, 192, 0.649);
    box-shadow: 1px 1px 3px;
    padding:5px 10px;
    font-size: 20pt;
    margin:5px 10px;
    display: inline-block;
    vertical-align: text-top;
}

.preset-entry {
    border:1px solid black;
    background-color: #00ffdd;
    padding:5px 10px;
    box-shadow: 1px 1px 5px;
    margin:30px 10px 10px 10px;
    max-width:400px;
    min-width: 400px;
    min-height:300px;
    max-height:300px;
    text-align: left;
    border-radius: 5px;
    display:inline-block;
}


.miniquest-not-started {
    border:1px solid rgb(0, 181, 181);
    background-color: #2a2a2abb;
    color:cyan;
    margin-bottom:10px;
    box-shadow: 1px 1px 5px;
}


.animal-tabs {
    margin:10px 20px;
}

.left-menu-combat-stat-section {
    background-color: #00000036;
    padding:10px;
    margin:3px;
}
.animal-tabs-btn {
    border:1px solid grey;
    padding:5px;
    width:200px;
    display: inline-block;
    vertical-align: text-top;
    box-shadow: 1px 1px 5px;
    margin-right:10px;
    margin-bottom: 5px;
}

.animal-stats {
    background-color: rgba(63, 63, 63, 0.557);
    padding:5px;
    border-radius: 5pt;
    margin:0px 20px;
}

.animal-stats td {
    padding-right:10px;
    color:rgb(215, 215, 215);
}

.miniquest-not-started td {
    padding:10px;
    color:cyan;
}


.modal-furnace-title-box {
    border:1px solid grey;
    background-color: #FEFEFE;
    padding:20px;
    margin:10px;
    display: inline-block;
}

.preset-table td {
    padding:5px;
}

input[type=checkbox]
{
  /* Double-sized Checkboxes */
  -ms-transform: scale(1.5); /* IE */
  -moz-transform: scale(1.5); /* FF */
  -webkit-transform: scale(1.5); /* Safari and Chrome */
  -o-transform: scale(1.5); /* Opera */
  padding: 10px;
}

input[type=checkbox].small-checkbox
{
  vertical-align: middle;
  /* Double-sized Checkboxes */
  -ms-transform: scale(1); /* IE */
  -moz-transform: scale(1); /* FF */
  -webkit-transform: scale(1); /* Safari and Chrome */
  -o-transform: scale(1); /* Opera */
}

.grayscale .greyscale {
    filter: grayscale(100%);
  }

  
table.table-borders tr td {
    border:1px solid red;
}

.fight-left-border {
    border-left:1px solid grey;
}
.fight-right-border {
    border-right:1px solid grey;
}

.square-yellow {
    background-color: yellow;
    width:10px;
    height:10px;
    display: inline-block;
    border: 1px solid black;
}

.square-pink {
    background-color: pink;
    width:10px;
    height:10px;
    display: inline-block;
    border: 1px solid black;
}


.square-cyan {
    background-color: rgb(154, 221, 255);
    width:10px;
    height:10px;
    display: inline-block;
    border: 1px solid rgb(0, 238, 255);
}


.square-lime {
    background-color: rgb(154, 255, 154);
    width:10px;
    height:10px;
    display: inline-block;
    border: 1px solid lime;
}

.square-green {
    background-color: green;
    width:10px;
    height:10px;
    display: inline-block;
    border: 1px solid black;
}

.square-grey {
    border: 1px solid black;
    background-color: white;
    width:10px;
    height:10px;
    display: inline-block;
}

.canvas-fighting-td {
    background-color: rgba(0, 0, 0, 0.704);
}


.fight-top-border {
    border-top:1px solid grey;
}
.fight-bottom-border {
    border-bottom:1px solid grey;
}

.farming-patches-area
{
    background-image:url('https://cdn.idle-pixel.com/images/background_grass.png');
    background-repeat:repeat;
    border-radius: 5pt;
}

.preset-icon {
    display: inline-block;
    border:1px solid black;
    background-color: pink;
    width: 35px;
    height: 35px;
}

.preset-row {
    border:1px solid grey;
}

.preset-row td {
    padding:10px;
}

.preset-icon-img {
    margin-top:6px;
}

.z-index-5
{
    z-index: 5;
}

.color-yellow
{
    color:yellow;
}

.z-index-10
{
    z-index: 10;
}

.castle-map {
    border:2px solid grey;
}

.button-image {
    background-color: #FEFEFE;
    border:1px solid grey;
    box-shadow: 1px 1px 3px;
    padding:10 20px;
    display: inline-block;
    width: 200px;
}

.position-absolute
{
    position: absolute;
}

.farming-patch
{
   cursor: pointer;
}

.cooked-fish {
    background-color: #b04400;
}

.farming-patch:hover
{
    filter:brightness(65%);
}

.activites-options-table  td{
    border:1px solid grey;
    background-color: #DDDDDD;
    padding:10px 20px;
    text-align: center;
}


.activites-options-table  th {
    border:1px solid grey;
    background-color: #cad4bd;
    padding:10px 20px;
    text-align: center;
}

.quest-requirements {
    border:1px solid grey;
    background-color: #5bf1ff;
    padding:20px;
    text-align: center;
    box-shadow: 1px 1px 4px;
}

.friends-list-table {
    background-color: #b8ffb0;
    border:1px solid grey;
    margin-top: 50px;
}


.table-general {
    margin-top:50px;
}

.table-general td {
    background-color: #EDEDED;
    border:1px solid silver;
    padding:15px 25px;
    text-align: center;
}

.table-general th {
    background-color: #EDEDED;
    border:1px solid silver;
    padding:15px 25px;
    font-size: 14pt;
    text-align: center;
}

.friends-list-table td {
    padding:20px;
}

.scroller{
	padding:10px 20px;
	font-size:30pt;
	z-index: 1000;
    pointer-events:none;
}

.modal-xxl {
    min-width:90vw !important;
    max-width:90vw !important;
}

.modal-xxxl {
    min-width:98vw !important;
    max-width:98vw !important;
}

.gathering-items-list img {
    margin:2px;
}
.panel-gathering-icon-regular {
    background-color: #DEDEDE;
    border-radius:2px;
    border: 1px solid grey;
    padding:5px;
}

.modal-machinery
{
    display: inline-block;
    padding:20px;
    border: 1px solid silver;
    border-radius: 10pt;
    background-color: #EEEEEE;
}
.animation-glow
{
    animation: glow 3s infinite alternate;
}

.animation-glow-fast
{
    animation: glow 1s infinite alternate;
}


@keyframes glow 
{
    from {
      box-shadow: 0 0 5px -5px #aef4af;
    }
    to {
      box-shadow: 0 0 5px 5px #aef4af;
    }
}

.bold
{
    font-weight: bold;
}

.info-box {
    display:inline-block;
    border:1px solid silver;
    padding:10px;
}

.modal-enchant-shooting-star-info {
    border:1px solid purple;
    background-color: rgb(254, 167, 254);
    padding:20px;
    margin:20px;
}


.progress-bar
{
    border:1px solid black;
    width:300px;
    display: inline-block;
    height:25px;
    background-color: white !important;
    vertical-align: middle;
}

.progress-bar-inner
{
    width:0%;
    background-color: lime;
    display: block;
    height:23px;
    float:left;
}


.menu-bar-left-sub-label {
    color:grey;
    font-size: 8pt;
    font-style: italic;
    margin:3px;
}

.game-menu-bar-left-table-btn-borderless {
    background-color: #005247;
    padding:0;
}



.game-shop-table-entry-red-ghost {

    max-width: 450px;
    min-width: 450px;
    width:450px;
    display:inline-block;
    margin:10px;
    table {
        width:450px;
        background-color: rgb(216, 191, 228);
        border:1px solid rgb(204, 0, 255);
    }
    td {
        padding:5px;
        color:black;
    }
}

.game-shop-table-entry-red {

    max-width: 450px;
    min-width: 450px;
    width:450px;
    display:inline-block;
    margin:10px;
    table {
        width:450px;
        background-color: rgb(228, 191, 191);
        border:1px solid red;
    }
    td {
        padding:5px;
        color:black;
    }
}

.game-shop-table-entry-green {

    max-width: 450px;
    min-width: 450px;
    width:450px;
    display:inline-block;
    margin:10px;
    table {
        width:450px;
        background-color: rgb(191, 228, 194);
        border:1px solid rgb(0, 125, 2);
    }
    td {
        padding:5px;
        color:black;
    }
}


.farming-plot-wrapper {
    vertical-align: text-top;
    min-width: 300px;
    max-width: 300px;
    width:300px;
    min-height: 400px;
    max-height: 400px;
    height:400px;
    user-select: none;
    display: inline-block;
    margin:none !important;
    background-image:url('https://cdn.idle-pixel.com/images/background_grass.png');
    background-repeat:repeat;
}

.back-btn {
    background-color:rgba(0,0,0,0.1);
    border: 1px solid rgba(0,0,0,0.2);
    display: inline-block;
    padding:3px 10px;
}

.game-shop-table-entry-ghost {

    max-width: 450px;
    min-width: 450px;
    width:450px;
    display:inline-block;
    margin:10px;
    table {
        width:450px;
        background-color: rgb(69, 10, 77);
        border-radius: 5pt;
    }
    td {
        padding:5px;
    }
}


.game-menu-bar-left-table-btn {
    border-top: 1px solid rgba(0,0,0,0.2);
    background-color: #005247;
    padding:0;
}


.left-menu-item-shops {
    background-color: #00342d;
    font-size: 10pt;
}

.left-menu-item-quests-ach-loot {
    background-color: #005247;
    font-size: 10pt;
}

.left-menu-item-other {
    background-color: #00342d;
    font-size: 10pt;
}

.game-menu-bar-left-table-btn-borderless td {
    color:silver;
    padding:10px 3px;
}

.settings-desc {
    margin-bottom:10px;
}

.you-need-a-pickaxe {
    border-radius: 5px;
    background-color: #DEDEDE;
    padding:20px;
    display: inline-block;
}

.warning {
    border:1px solid grey;
    box-shadow: 1px 1px 5px;
    padding:20px;
    display: inline-block;
    margin-top:20px;
    color:red;
}

.game-menu-bar-left-table-btn td {
    color:silver;
    padding:10px 3px;
}


.game-menu-bar-left-table-btn-shops {
    padding:0;
    border-spacing: 6px;
    border-collapse: separate;
}

.game-menu-bar-left-table-btn-shops td {
    color:silver;
    border:1px solid black;
    background-color: #005247;
    box-shadow: 1px 1px 5px;
    padding:10px 10px;
    font-size: 10pt;
    cursor: pointer;
}

.game-menu-bar-left-table-btn-shops td:hover {
    filter: brightness(50%);
}

.menu-bar-left-notification  {
    margin:5px 0px;
}

.thin-progress-bar
{
    border:1px solid rgb(2, 33, 0);
    width:200px;
    display: inline-block;
    height:12px;
    margin-top:3px;
    background-color: white !important;
    vertical-align: middle;
}

.thin-progress-bar-inner
{
    width:0%;
    background-color: rgb(139, 139, 139);
    display: block;
    height:10px;
    float:left;
}



.tool-item-box-cricle {
    border-radius: 50% !important;
}

.tool-item-box {
    background-image: url('https://cdn.idle-pixel.com/images/tool_box_bg_light.png');
    background-size: 100% auto; 
}

.fight-item-box-bg {
    background-image: url('https://cdn.idle-pixel.com/images/fighting_itembox_bg.png');
    background-size: 100% auto; 
}


.tool-item-box-breeding {
    background-image: url('https://cdn.idle-pixel.com/images/tool_box_bg_breeding.png');
    background-size: 100% auto; 
}

.tool-item-box-mining {
    background-image: url('https://cdn.idle-pixel.com/images/tool_box_bg_mining.png');
    background-size: 100% auto; 
}

.tool-item-box-gathering {
    background-image: url('https://cdn.idle-pixel.com/images/tool_box_bg_gathering.png');
    background-size: 100% auto; 
}

.tool-item-box-farming {
    background-image: url('https://cdn.idle-pixel.com/images/tool_box_bg_farming.png');
    background-size: 100% auto; 
}

.tool-item-box-woodcutting {
    background-image: url('https://cdn.idle-pixel.com/images/tool_box_bg_woodcutting.png');
    background-size: 100% auto; 
}

.tool-item-box-fishing {
    background-image: url('https://cdn.idle-pixel.com/images/tool_box_bg_fishing.png');
    background-size: 100% auto; 
}

.tool-item-box-brewing {
    background-image: url('https://cdn.idle-pixel.com/images/tool_box_bg_brewing.png');
    background-size: 100% auto; 
}

.tool-item-box-invention {
    background-image: url('https://cdn.idle-pixel.com/images/tool_box_bg_invention.png');
    background-size: 100% auto; 
}

.bg-darken {
    background:
        linear-gradient(
          rgba(0, 0, 0, 0.7), 
          rgba(0, 0, 0, 0.7)
        ),
}

.seed-compactor-seed-select {
    border:1px solid rgb(230, 230, 230);
    background-color: #ffffff;
    box-shadow: 1px 1px 3px;
    padding:20px;
    display:inline-block;
    margin-top:5px;
}


.mining-machine-item-box {
    background-image: url('https://cdn.idle-pixel.com/images/machinery_itembox_bg.png');
    background-size: 100% auto; 
}
.bone-item-box {
    background-image: url('https://cdn.idle-pixel.com/images/bone_itembox_bg.png');
    background-size: 100% auto; 
}
.waves-item-box {
    background-image: url('https://cdn.idle-pixel.com/images/waves_itembox_bg.png');
    background-size: 100% auto; 
}
.crafing-item-box {
    background-image: url('https://cdn.idle-pixel.com/images/crafting_itembox_bg.png');
    background-size: 100% auto; 
}
.mining-gem-frag-item-box {
    background-image: url('https://cdn.idle-pixel.com/images/gathering_loot_light_bg.png');
    background-size: 100% auto; 
}


.table-criptoe-research-tree {
    border:1px solid grey;
    background-color: #FEFEFE;
    box-shadow: 1px 1px 5px;
}
.table-criptoe-research-tree th {
    text-align: center;
    padding:10px;
}

.table-criptoe-research-tree td {
    text-align: center;
    padding:10px;
    background-color: rgb(255, 199, 199);
}


.player-market-slot-base 
{
    width:300px;
    height:500px;
    border:1px solid black;
    background-color: #00ffdd;
    border-radius: 5pt;
    vertical-align: text-top;
}

.market-collect-button {
    padding:10px;
    background-color: gold;
    width: 90%;
}

.market-remove-button {
    padding:10px;
    width: 90%;
    background-color: rgb(255, 97, 97);
}

.float-left {
    float:left;
}



.hp-progress-bar-event
{
    width:700px;
}

.inline-block
{
    display: inline-block;
}


.hp-progress-bar-raids
{
    border:2px solid rgb(37, 0, 0);
    width:150px;
    display: inline-block;
    height:30px;
    background-color: white;
    vertical-align: middle;
}

.hp-progress-bar-inner-raids
{   
    width:50%;
    height:26px;
    background-color: rgb(255, 0, 0);
    display: block;
    float:left;
}

.breeding-fight-area-fighting-special-btn {
    width:90%;
    border-radius: 2pt;
    color:grey;
    background-color: #FEFEFE;
    box-shadow: 1px 1px 5px;
    text-transform: uppercase;
}

.hp-progress-bar-inner
{
    width:50%;
    height:26px;
    background-color: rgb(255, 0, 0);
    display: block;
    float:left;
}


.progress-bar-label-raids
{
    width:150px;
    position:absolute;
    text-align:center;
    line-height: 25px;
}



.hp-progress-bar-monster-raids
{
    border:2px solid rgb(37, 0, 0);
    width:550px;
    display: inline-block;
    height:30px;
    background-color: white;
    vertical-align: middle;
}

.hp-progress-bar-monster-inner-raids
{
    width:50%;
    height:26px;
    background-color: rgb(255, 0, 0);
    display: block;
    float:left;
}

.hp-progress-bar
{
    border:2px solid rgb(37, 0, 0);
    width:300px;
    display: inline-block;
    height:30px;
    background-color: white;
    vertical-align: middle;
}

.progress-bar-label-breeding
{
    width:140px;
    position:absolute;
    text-align:center;
    line-height: 25px;
}


.breeding-fight-select-area-monster-stats {
    border:1px solid silver;
    background-color: #DEDEDE;
    padding:20px;
    margin:20px;
    width:300px;
    display: inline-block;
}

.modal-breeding-fight-area-enter-amount {
    border:1px solid grey;
    background-color: #b1fffd;
    padding:20px;
    margin:20px;
}



.breeding-hp-progress-bar
{
    border:1px solid rgb(37, 0, 0);
    width:140px;
    display: inline-block;
    height:26px;
    background-color: white;
    vertical-align: middle;
}
.breeding-hp-progress-bar-inner
{
    width:50%;
    height:100%;
    background-color: rgb(255, 0, 0);
    display: block;
    float:left;
}


.breeding-stamina-progress-bar
{
    border:1px solid rgb(37, 0, 0);
    width:140px;
    display: inline-block;
    height:26px;
    background-color: white;
    vertical-align: middle;
}
.breeding-stamina-progress-bar-inner
{
    width:50%;
    height:100%;
    background-color: #a29500;
    display: block;
    float:left;
}

.breeding-fight-area-fighting-title {
    color:grey;
    border-bottom: 1px solid grey;
    margin-bottom:10px;
}

.breeding-fighting-entry {
    border:1px solid black;
    box-shadow: 1px 1px 5px;
    padding:5px 10px 5px 10px;
    display: inline-block;
    vertical-align: text-top;
    background-color: #b3ffcc;
    height:220px;
}

.breeding-fighting-entry-monster {
    border:1px solid black;
    box-shadow: 1px 1px 5px;
    padding:5px 10px 5px 10px;
    display: inline-block;
    vertical-align: text-top;
    background-color: #ffb3b3;
    height:220px;
}




.breeding-fight-area-fighting-hero-entry {
    border:1px solid black;
    padding:20px;
    width:80px;
}




.mana-progress-bar-raids
{
    border:2px solid rgb(1, 0, 37);
    width:150px;
    display: inline-block;
    height:30px;
    background-color: white;
    vertical-align: middle;
}

.mana-progress-bar-inner-raids
{
    width:50%;
    height:26px;
    background-color: rgb(4, 0, 255);
    display: block;
    float:left;
}


.mana-progress-bar
{
    border:2px solid rgb(1, 0, 37);
    width:300px;
    display: inline-block;
    height:30px;
    background-color: white;
    vertical-align: middle;
}

.mana-progress-bar-inner
{
    width:50%;
    height:26px;
    background-color: rgb(4, 0, 255);
    display: block;
    float:left;
}

.progress-bar-inner-gathering
{
    width:1%;
    background-color: rgb(2, 85, 2);
    display: block;
    float:left;
}

.unselectable {
    user-select: none;
}

.raids-left-hero-hp-bars {
    max-height:150px;
    min-height:150px;
    border:1px solid blue;
}

.raids-left-hero-magic {
    max-height:150px;
    min-height:150px;
    border:1px solid purple;
}


itembox-static {
    width:100px;
    height:100px;
    user-select: none;
    display: inline-block;
    border:1px solid rgb(66, 66, 66);
    background-color: rgb(107, 107, 107);
    border-radius: 5pt;
    color:white;
    margin-bottom: 15px;
}


itembox {
    width:100px;
    height:100px;
    user-select: none;
    display: inline-block;
    vertical-align: text-top;
    border:1px solid rgb(66, 66, 66);
    background-color: rgb(107, 107, 107);
    border-radius: 5pt;
    color:white;
    margin-bottom: 15px;
}

.box-shortcut-potion {
    user-select: none;
    display: inline-block;
    vertical-align: text-top;
    height:30px;
    width:auto;
    background-color: rgb(122, 94, 122);
}

.itembox-div {
    width:100px;
    height:100px;
    user-select: none;
    display: inline-block;
    vertical-align: text-top;
    border:1px solid rgb(66, 66, 66);
    background-color: rgb(107, 107, 107);
    border-radius: 5pt;
    color:white;
    margin-bottom: 15px;
}

.box-shortcut-potion {
    height:30px;
    width:auto;
    background-color: rgb(122, 94, 122);
    border:none;
}


.table-filter-btn {
    background-color: #DEDEDE;
    border: 1px solid black;
    padding:5px;
    display: inline-block;
    border-bottom:none;
}



.itembox-subskill
{
    width:100px;
    height:100px;
    display: inline-block;
    border:1px solid rgb(66, 66, 66);
    background-color: white;
    border-radius: 5pt;
    color:black;
    vertical-align: text-top;
}


.itembox-fight
{
    width:100px;
    height:100px;
    display: inline-block;
    border:1px solid rgb(66, 66, 66);
    background-color: rgb(122, 86, 0);
    border-radius: 5pt;
    color:white;
    vertical-align: text-top;
}


.modal-inactive-slaughter-house-trait-context {
    background-color: #EDEDED;
    border-radius: 5pt;
    margin:20px;
    padding:5px;
}


.modal-inactive-slaughter-house-trait {
    border:1px solid black;
    padding:10px;
    font-size:10pt;
    width:150px;
    display:inline-block;
}

.itembox-fight-section {
    background-color: #6f1f1f;
}
.itembox-fight-section-guardians {
    background-color: #383838;
}


.itembox-fight-raids-section {
    background-color: #6f1f1f;
}

.itembox-large {
    width:205px;
}

.raids-team-panel {
    background-color: #0c0c0c;
    border:1px solid silver;
    padding:20px;
    margin:20px 0px;
    color:silver;
}

.itembox-hiscores
{
    width:100px;
    height:100px;
    display: inline-block;
    border:1px solid rgb(66, 66, 66);
    background-color: rgb(215, 151, 0);
    border-radius: 5pt;
    color:white;
}

.raids-button-table {
    margin-top:20px;
    background-color: #262626;
    border:1px solid grey;
    color:white;
}

.start-raid-button {
    font-size: 24pt;
    display: inline-block;
    background-color: orange;
    border:2px solid black;
    box-shadow: 1px 1px 20px;
    color:black;
    padding:20px;
    text-align: center;
}



.holo {
    background-image:url('https://cdn.idle-pixel.com/images/holo.gif');
    background-size: cover;
}

.tcg-card {
    width:200px;
    height:300px;
    display: inline-block;
    border-radius: 10pt;
    box-shadow: 1px 1px 5px;
    margin:20px;
}

.tcg-card-inner {
    text-align: center;
    margin:5px 18px;
    border:2px solid black;
    border-radius: 5pt;
    background-color: #FEFEFE;
    box-shadow: 1px 1px 5px;
    padding:25px 25px;
}

.tcg-card-title {
    font-weight: bold;
    font-size: 14pt;
    margin-left:18px;
    margin-top:4px;
}

.tcg-card-inner-text {
    margin:10px 18px;
    border:1px solid black;
    border-radius: 5pt;
    background-color: #FEFEFE;
    padding:5px 5px;
    font-size: 8pt;
}


.itembox-quest
{
    background-color: none;
    background-image: url('https://cdn.idle-pixel.com/images/quest-item-box-background.png');
}


.itembox-guaridan-key
{
    border:1px solid rgb(66, 66, 66);
    background-color: rgb(82, 47, 47);
}

.itembox-event
{
    border:1px solid rgb(150, 0, 180);
    background-color: rgb(54, 0, 71);
}

.itembox-rings
{
    width:100px;
    vertical-align: text-top;
    height:100px;
    display: inline-block;
    border:1px solid rgb(66, 66, 66);
    background-color: rgb(102, 101, 93);
    border-radius: 5pt;
    color:white;
}

.start-fight-btn {
    font-size: 30pt;
    width:400px;
    margin-bottom: 50px;
}

.craftable-btn {
    text-align: center;
}


.fight-area-select-monster-card {
    border:1px solid grey;
    background-color: #ffffff9d;
    padding:20px;
    display: inline-block;
    vertical-align: text-top;
    margin:20px 20px;
    max-width:240px;
    width:240px;
    height:300px;
}



.modal-fight-areas-area-image
{
    width:300px;
    height:300px;
}

.img-20
{
    width:20px;
    height:20px;
}

.img-50
{
    width:50px;
    height:50px;
}

.img-15
{
    width:15px;
    height:15px;
}


.flag {
    width:20px;
}

.modal-dim {
   background-color: rgba(0, 0, 0, 0.855);
}

.modal-backdrop { 
    opacity: 0 !important; 
}

.color-red
{
    color:red;
}

.color-orange
{
    color:orange;
}

.color-dark-orange
{
    color:rgb(149, 135, 10);
}

.color-gold
{
    color:rgb(141, 92, 0);
}

.modal-use-stardust-xp-per-item
{
    border:1px solid grey;
    background-color: #c2ebfd;
}

div.game-shop-box
{
    width:100px;
    height:100px;
    display: inline-block;
    border:1px solid rgb(66, 66, 66);
    background-color: rgb(107, 107, 107);
    border-radius: 5pt;
    color:white;
    vertical-align: text-top;
}

div.game-shop-box-ghost
{
    width:100px;
    height:100px;
    display: inline-block;
    border:1px solid rgb(48, 0, 44);
    background-color: rgb(103, 91, 105);
    border-radius: 5pt;
    color:white;
    vertical-align: text-top;
}

.todo-list {
    background-color: rgba(0, 0, 0, 0.614);
    color: silver;
    padding:5px;
    border:1px solid grey;
    box-shadow: 1px 1px 3px;
}

.todo-item {
    border:1px solid grey;
    padding:3px 5px;
    margin:3px;
    display: inline-block;
}

.todo-item-important {
    border:1px solid lime;
    padding:3px 5px;
    display: inline-block;
    margin:3px;
}

div.game-shop-merchant
{
    width:100px;
    height:100px;
    display: inline-block;
    border:1px solid rgb(154, 255, 248);
    background-color: rgb(80, 118, 119);
    border-radius: 5pt;
    color:white;
    vertical-align: text-top;
}

.quest-box
{
    width:300px;
    border:1px solid black;
    border-radius: 10px;
    padding:10px 20px;
    display: inline-block;
    text-align: center;
    color:white;
    background-color: rgb(0, 76, 78);
    margin-bottom:20px;
    box-shadow: 1px 1px 1px 1px;
}

.modal-odd-one-out-puzzle-goal  {
    border:1px solid silver;
    background-color: #FEFEFE;
    padding:10px 20px;
    margin:20px;
    box-shadow: 1px 1px 1px 1px;
    font-size: 14pt;
    margin-bottom: 50px;
}

.modal-odd-one-out-puzzle-weight {
    border:1px solid black;
    padding:5px;
    background-color: #DDDDDD;
    padding:10px;
}

.modal-time-warp-chemist-quest-menu-entry {
    border: 1px solid silver;
    box-shadow: 1px 1px 3px;
    text-align: center;
}

.modal-time-warp-chemist-quest-menu-entry td {
    background-color: rgb(233, 233, 233);
    padding:5px 10px;
    text-align: center;
}

.time-warp-chemist-dust {
    background-color: rgba(128, 0, 128, 0.463);
}

.quest-box-optional
{
    width:300px;
    border:1px solid black;
    border-radius: 10px;
    padding:10px 20px;
    display: inline-block;
    box-shadow: 1px 1px 1px 1px;
    text-align: center;
    color:white;
    background-color: rgb(94, 94, 94);
    margin-bottom:20px;
}

.quest-disable
{
    filter: blur(3px);
}

.image-quest-disable
{
    filter: brightness(0%);
}

.align-right
{
    text-align: right;
}

.raid-item-background
{
    background-color: #5e0505;
}

.mining-key-item-background
{
    background-color: rgb(72, 95, 97);
}

.mining-key-item-background-alternate
{
    background-color: rgb(50, 66, 67);
}

.left {
    text-align: left;
}

.loot
{
    display: inline-block;
    border: 1px solid black;
    padding:10px 20px;
    min-width: 300px;
    margin:10px;
    border-radius: 10pt;
}

.color-green
{
    color:green;
}

.color-blood
{
    color:rgb(161, 0, 0);
    padding:3px;
    margin-top: 5px;
}

.market-warning-message
{
    border:1px solid black;
    background-color: yellow;
    color:brown;
    padding:20px;
    margin-bottom: 50px;
}

.market-banned-message
{
    border:1px solid red;
    background-color: rgb(0, 0, 0);
    color:red;
    padding:20px;
    margin-bottom: 50px;
}

.color-lime
{
    color:lime;
}

.furnace-ore-select
{
    text-align: center;
    border: 1px solid black;
    display:inline-block;
    padding:10px;
    color:white;
    height: 230px;
    border-radius: 5pt;
    background-color: rgb(0, 76, 78);
    margin-top:20px;
    vertical-align: text-top;
}

.foundry-log-select
{
    text-align: center;
    border: 1px solid black;
    display:inline-block;
    padding:10px;
    color:white;
    margin-top: 20px;
    border-radius: 5pt;
    background-color: rgb(97, 97, 97);
}



.furnace-input
{
    background-color: #e2e2e2;
    border:1px solid grey;
    border-radius: 5px;
    padding:20px 20px;
    margin:20px;
}

.background-dark-grey
{
    background-color: rgb(36, 36, 36);
}

.background-dark-orange
{
    background-color: rgb(115, 77, 0);
}

.flower-seed-box {
    background-color: #665157;
}

.btn-width-400 {
    width:400px;
}
.mvp {
    border:1px solid green;
    background-color: rgb(194, 231, 194);
    padding:10px;
    display: inline-block;
    vertical-align: text-top;
    margin:10px;
}

.breeding-fight-current-team {
    padding:20px;
    border-radius: 5px;
    background-color: #FFFFFF66;
    margin-bottom: 10px;
}


.breeding-fight-area-fighting-img-wrapper {
    text-align: center;
    margin:10px 0px;
}

.breeding-fight-area-fighting {
    padding:20px;
    border-radius: 5px;
    background-color: #00000066;
    margin: 30px;
}

.login-warning {
    border:1px solid red;
    background-color: #FEFEFEDD;
    margin-top:10px;
    border-radius: 5pt;
    box-shadow: 1px 1px 5px;
    color:red;
    padding:10px;
}

.raid-time {
    border:1px solid orange;
    background-color: rgb(231, 228, 194);
    padding:10px;
    display: inline-block;
    vertical-align: text-top;
    margin:10px;
}


.raids-potion-box {
    background-color: #dedede;
    color:black;
}

.dust-box {
    background-color: #6b2237;
}

.brewing-bg-2 {
    background-color: rgb(122, 94, 122);
}

.tree-seed-box {
    background-color: #4b6644;
}

.vegetable-seed-box {
    background-color: #666651;
}

.cooking-vegetable {
    background-color: #516652;
}
.offline-time-div {
    background-color: rgb(191, 243, 191);
    border-color:green;
    padding:20px;
}

.offline-time-div-content {
    background-color: rgb(214, 214, 214);
    border-color:rgb(75, 75, 75);
    padding:20px;
    margin-top:25px;
}

.table-modal-container {
    border:1px solid rgb(173, 113, 0);
    border-radius: 4pt;
    background-color: rgb(255, 201, 181);
}
.table-modal-container tr td{
    padding:10px;
}

.background-brown
{
    background-color: rgb(71, 41, 23);
}

.modal-brew-ingredients {
    border:1px solid rgb(173, 0, 173);
    border-radius: 4pt;
    background-color: rgb(255, 181, 249);
    display: inline-block;
    padding:10px;
    font-size: 16pt;
    margin:20px;
}


.modal-stone-converter-potion-img {
    border:1px solid grey;
    background-color: #FEFEFE;
    padding:10px;
    margin:20px;
    display: inline-block;
}

.raid-entry {
    margin-top:20px;
    background-color: #262626;
    border:1px solid grey;
    color:white;
    display:flex;
}

.raid-entry-main-info {
    padding:10px;
    margin:20px;
}
.flex-end {
    justify-content:flex-end;
    margin-left: auto;
}


.modal-table-button {
    width: 90%;
    background-color: #FEFEFE;
    border:1px solid rgb(85, 85, 85);
    margin:10px;
    padding:10px;
    border-radius: 2px;
    box-shadow: 1px 1px 5px;
}

.modal-table-button  td {
    padding:20px;
} 
.modal-invention-ingredients {
    border:1px solid rgb(173, 109, 0);
    border-radius: 4pt;
    background-color: rgb(255, 239, 181);
    display: inline-block;
    padding:10px;
    font-size: 16pt;
    margin:20px;
}



.modal-cooks_book-ingredients {
    border:1px solid rgb(173, 109, 0);
    border-radius: 4pt;
    background-color: rgb(255, 237, 181);
    display: inline-block;
    padding:10px;
    font-size: 16pt;
    margin:20px;
}

.cooks-book-food {
    background-color: rgb(171, 111, 0);
}


.modal-crafting-ingredients {
    border:1px solid rgb(26, 26, 26);
    border-radius: 4pt;
    background-color: rgb(174, 174, 174);
    display: inline-block;
    padding:10px;
    font-size: 16pt;
    margin:20px;
}

.background-dark-blue {
    background-color: rgb(0, 107, 107);
}

.background-dark-cyan
{
    background-color: rgb(0, 53, 53);
}

.background-dark-green
{
    background-color: rgb(0, 41, 3);
}

.gathering-box
{
    border:1px solid black;
    padding:20px;
    margin:20px;
    display:inline-block;
    border-radius: 20pt;
    vertical-align: text-top;
    width:400px;
    height:640px;
    color:white;
}


.combat-xp-lamp-button
{
    width:100%;
    font-size:30pt;
    border-radius: 5pt;
}
.gathering-area-image
{
    box-shadow: 3px 6px 8px rgba(0,0,0,.3);
}

.combat-log-table
{
    border:1px solid rgb(179, 179, 179);
    margin:20px;
    float:left;
    vertical-align: text-top;
    background-color: white;
}




.monster-loot-button {
    border:1px solid black;
    border-radius: 2px;
    box-shadow: 1px 1px 2px;
}


.unselectable {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    user-drag: none;
    -webkit-user-drag: none;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;

}

.combat-log-table tr td
{
    margin:5px;
    padding:20px;
    text-align: center;
    border: 1px solid grey;
}

.combat-log-table-new
{
    border:1px solid rgb(179, 179, 179);
    margin:20px;
    float:left;
    vertical-align: text-top;
    background-color: white;
}

.combat-log-table-new tr td
{
    margin:5px;
    padding:20px;
    text-align: center;
}

.achievement-button
{
    width:250px;
    border:1px solid grey;
    padding:10px 20px;
    border-radius: 5pt;
    display: inline-block;
    color:black;
}

.completionist-entry {
    border:1px solid grey;
    box-shadow: 1px 1px 5px;
    margin:10px;
    color:grey;
    background-color: white;
    display: inline-block;
    width:300px;
    padding:5px;
}

.completionist-entry img {
    float:right;
}

.achievement-button-easy
{
    background-color: #ffa600;
}


.achievement-button-medium
{
    background-color: #bdbdbd;
}


.achievement-button-hard
{
    background-color: #fbff00;
}

.achievement-button-elite
{
    background-color: #00ffdd;
}


.achievement-entry
{
    border:1px solid black;
    padding:10px 20px;
    width:800px;
    background-color: #EEEEEE;
    border-radius: 2pt;
}

.achievement-entry-reward
{
    border:1px solid black;
    padding:10px 20px;
    width:800px;
    background-color: #dffbd2;
    border-radius: 2pt;
}



.chat
{
    min-height:200px;
    border:1px solid rgb(0, 68, 124);
    border-radius: 5pt;
    background-color: rgb(166, 252, 255);
}

.chat-area
{
    background-color: white;
    font-family:"Roboto","Lucida Grande","bitstream vera sans","trebuchet ms","sans-serif","verdana";
    font-size:16pt;
    border:1px solid silver;
    overflow-y: scroll;
    resize: both;
    overflow: auto;
}


.modal-body {
    position: relative;
    flex: 1 1 auto;
    padding: 1rem;
    overflow-y:scroll;
    max-height:70vh
  }
  

.chat-area-input
{
    width:70%;
    font-family:"Roboto","Lucida Grande","bitstream vera sans","trebuchet ms","sans-serif","verdana";
}


.dev
{
    border:1px solid black;
    color:white;
    background-color: rgb(151, 151, 24);
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.rotate-image {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.poison-rain {
   filter: invert(100%);
}


.designer
{
    border:1px solid black;
    color:white;
    background-color: rgb(255, 170, 0);
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.fake-link {
    color: rgb(13, 110, 253);
    text-decoration: underline;
}

div.fake-button {
    border:1px solid grey;
    background-color: #FEFEFE;
    padding:20px;
    display: inline-block;
    box-shadow: 1px 1px 5px;
    margin:20px;
}

.fighting-countdown {
    position: absolute;
    z-index: 100;
    margin-left:350px;
    font-size: 30pt;
    margin-top:100px;
    box-shadow: 1px 1px 1px;
    color:white;
    background-color: black;
    border:1px solid orange;
    padding:20px 40px;
}

.invention-guide-text {
    border:1px solid black;
    border-radius: 5pt;
    color:black;
    padding:20px;
    margin:10px;
    box-shadow: 1px 2px 1px;
    background: linear-gradient(rgb(224, 215, 154), rgb(158, 151, 108));
}
.owner
{
    border:1px solid black;
    color:white;
    background-color: rgb(151, 151, 24);
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.modal-switch-account-type-button {
    border:1px solid black;
    box-shadow: 1px 2px 1px;
    padding:20px;
    border-radius: 5pt;
}

.enchant-tablette-entry {
    border:1px solid blood;
    background-color: rgb(57, 0, 0);
    color:black;
    padding:20px;
    margin:20px;
    color:white;
    box-shadow: 2px 2px 2px;
}

.color-purple {
    color:purple;
}

.blood-item-box {
    background-color: maroon;
}

.invention-item-box {
    background-color: rgb(93, 79, 0);
}

.mine-cart-map-unlock-button {
    border-right:1px solid black;
    border-top:1px solid black;
    border-bottom:1px solid black;
    background-color: #d1d1d1;
    margin-left: -3px;
    padding:20px;
}

.purple-box {
    background-color: rgb(201, 123, 201);
}

.charts-content {
    margin-top:50px;
}

.CToe-chart-table {
    color:white;
    border:1px solid black;
    box-shadow: 1px 1px 5px;
}
.CToe-chart-table td{
    padding:10px;
}

.chat_bot
{
    border:1px solid black;
    color:white;
    background-color: rgb(167, 167, 167);
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.referral-program-container {
    background-color: #EEEEEE;
    padding:10px 20px;
    margin-bottom: 20px;
}

.inline-referral-link {
    background-color: #DEDEDE;

}
.referral-program-message-grey {
    background-color: #CCCCCC;
    padding:5px 20px;
    border-radius: 5pt;
    margin-bottom: 20px;
}

.referral-program-message {
    background-color: #ccffcc;
    border:1px solid green;
    padding:10px 20px;
    margin-bottom: 20px;
}


.moderator
{
    border:1px solid black;
    color:white;
    background-color: rgb(167, 167, 167);
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.modal-toolkit-item {
    background-color: #222;
    border:1px solid grey;
    box-shadow: 1px 2px 5px 5px;
    color:white;
    width: 400px;
    padding:20px;
    display: inline-block;
    margin:20px;
    vertical-align: text-top;
}


.recruiter
{
    border:1px solid black;
    color:white;
    background-color: #9900ff;
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.donor
{
    border:1px solid black;
    color:white;
    background-color: rgb(83, 83, 83);
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.super_donor
{
    border:1px solid black;
    color:white;
    background-color: rgb(84, 0, 0);
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.ultra_donor
{
    border:1px solid black;
    color:white;
    background-color: rgb(255, 0, 0);
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.donor-box
{
    border:1px solid black;
    width:400px;
    background-color: white;
    padding:20px;
}

.contributor
{
    border:1px solid black;
    color:white;
    background-color: rgb(4, 85, 0);
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.faradox-table tr {
    background-color: #DEDEDE;
    padding:20px;
}

.faradox-table td {
    padding:20px;
}


.financier
{
    border:1px solid black;
    color:white;
    background-image: linear-gradient(rgb(0, 187, 255), rgb(3, 104, 141));
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.investor
{
    border:1px solid black;
    color:white;
    background-image: linear-gradient(rgb(255, 0, 191), rgb(168, 0, 126));
    box-shadow: 1px 2px;
    padding:1px 2px;
    font-size: 12pt;
    font-family: Comic Sans MS , "Times New Roman", Georgia, Serif;
}

.chat-tag-example {
    border:1px solid black;
    box-shadow: 1px 2px;
}

.chat-tag-example-animated  {
    background-color: white;
    display: inline-block;
    padding: 2px;
}

.background-black {
    background-color: black;
}

.background-blue {
    background-color: blue;
}

.credits {
    background-color: black;
    height:100%;
    top: 0;
    bottom: 0
}

.table-server-select tr th
{
    padding:10px 30px;
    background-color: rgb(47, 47, 47);
}

.table-server-select tr
{
    border:1px solid black;
}

.table-server-select td
{
    padding:10px 30px;
}

table.fishing-log tr td {
    text-align: center;
    border:1px solid grey;
}

table.fishing-log tr th {
    text-align: center;
    border:1px solid grey;
}

table.fishing-log {
    border-collapse: collapse;
}




.shine {
	background: #222 -webkit-gradient(linear, left top, right top, from(#222), to(#222), color-stop(0.5, #fff)) 0 0 no-repeat;
	-webkit-background-size: 150px;
	color: rgba(39, 212, 0, 0.512);
	-webkit-background-clip: text;
	-webkit-animation-name: shine;
	-webkit-animation-duration: 6s;
	-webkit-animation-iteration-count: infinite;
}


@-webkit-keyframes shine {
	0%, 10% {
		background-position: -1000px;
	}
	100% {
		background-position: 1000px;
	}
}


.search-section {
    background-color: rgba(255, 241, 185, 0.553);
    border:1px solid rgb(78, 78, 78);
    padding:30px;
    border-radius: 5pt;
    margin-bottom: 20px;
}
.background-common {
    background-color: #bfffbd;
}

.background-uncommon {
    background-color: #fbffbd;
}

.background-rare {
    background-color: #ffbdbd;
}

.background-veryrare {
    background-color: #fb8282;
}

.background-megarare {
    background-color: #978383;
}

.market-table tr {
    border:1px solid black;
}

.market-table tr th {
    padding:10px 30px;
    background-color: rgb(221, 221, 221);
    text-align: center;
}

.market-table tr td {
    padding:10px 30px;
    background-color: rgb(195, 235, 233);
    text-align: center;
}



.tr-hover:hover
{
    cursor:pointer;
    background-color: rgb(0, 247, 255);
}

.hiscore-skill-btn {
    border:1px solid silver;
    background-color: #00ffdd;
}
.hero-progress-bar-hp-label 
{
    width:260px;
    position:absolute;
    text-align:center;
    line-height: 25px;
}



.progress-bar-label 
{
    width:300px;
    position:absolute;
    text-align:center;
    line-height: 25px;
}

.progress-bar-label-monster-raids {
    width:550px;
    position:absolute;
    text-align:center;
    line-height: 25px;
}

.progress-bar-label-event
{
    width:700px;
    position:absolute;
    text-align:center;
    line-height: 25px;
}

.yeti-boss-event-spell-heal {
    border:1px solid green;
    color:white;
    background-color: rgb(0, 164, 0);
    padding:5px 20px;
    text-align: center;
}

.yeti-boss-event-spell-reflect {
    border:1px solid rgb(128, 0, 0);
    color:white;
    background-color: rgb(164, 0, 0);
    padding:5px 20px;
    text-align: center;
}

.table-hiscores {
    width:80%;  
    border-collapse: collapse;
    border:1px solid black;
}

.btn-chat-configure {
    background-color: #abeae2;
}


.chat-tags-message {
    border:1px solid black;
    padding:5px;
    border-radius: 5pt;
    background-color: rgba(0, 0, 0, 0.155);
    text-align: center;
}

.td-combat-bottom-panel {
    border:1px solid rgb(80, 80, 80);
    color:grey;
    background-color: rgba(0, 0, 0, 0.778);
    padding:20px;
    max-width: 200px;
    min-width: 200px;
    font-size: 12pt;
}

.td-combat-stat-entry {
    margin-bottom: 5px;
}




.table-hiscores th {
    border-bottom: 1px solid black;
    background-color: #00d6ba;
    padding:5px;
}

.table-hiscores tr {
    background-color: #b8fff6;
    text-align: center;
}


.table-hiscores td {
    text-align: center;
    padding:5px;
}


.hiscores-skill-button {
    display: inline-block;
    border:1px solid silver;
    background-color: #00ffdd;
    padding:10px;
    width:130px;
}

.area-monster-label {
    color:blue;
    cursor: pointer;
}
.area-monster-label:hover {
    color:red;
}

.itembox-resource-crafting {
    background-color: #936D6D;
}


.itembox-resource-crafting-1 {
    background-color: #90936D;
}

.itembox-resource-crafting-2 {
    background-color: #6C9272;
}

.itembox-resource-gathering-1 {
    background-color: #909055;
}




.itembox-resource-farming-1 {
    background-color: #5C8971;
}

.itembox-resource-farming-2 {
    background-color: #5D9253;
}



.itembox-resource-mining-1 {
    background-color: #92896C;
}

.itembox-resource-mining-2 {
    background-color: #7F3300;
}


.itembox-resource-mining-3 {
    background-color: rgb(109, 128, 148);
}

.itembox-resource-mining-4 {
    background-color: rgb(78, 132, 116);
}






.itembox-equipment {
    background-color: rgb(130, 139, 89);
}

.itembox-equipment-magic {
    background-color: #85CAC6;
}

.fishing-unique {
background-color: rgb(0, 157, 185);
}
.fishing-unique-2 {
    background-color: rgb(111, 149, 156);
    }
.itembox-spellscroll {
    background-color: rgb(34, 56, 255);
}

.modal-gathering-uniques-table {
    border:1px solid grey;
    box-shadow: 1px 1px 5px;
    display:inline-block;
    vertical-align: text-top;
}

.modal-gathering-uniques-table td{
    border:1px solid grey;
    padding:10px;
}
.modal-gathering-uniques-table th{
    text-align: center;
}

.item-box-equip-tag {
    font-size: 6pt;
    color:silver;
    position: absolute;
}

.item-box-equip-tag-wrapper-2 {
    margin-left: 15%;
}

.item-box-equip-tag-wrapper {
    margin-left: 30%;
}


.select-item-tradables-catagory {
    display: inline-block;
    background-color: #FEFEFE;
    border:1px solid silver;
    padding:20px 20px;
    margin:10 30px;
    text-transform: capitalize !important;
}

.market-tradable-item {
    border:1px solid black;
    display: inline-block;
    background-color: #aef4af;
    padding:40px;
    border-radius: 5pt;
    text-align: center;
}

.float-right {
    float:right;
}
.modal-market-sell-inputs
{
    border:1px solid grey;
    border-radius: 5pt;
    background-color: #aef4af;
}

.modal-market-sell-image
{
    border:1px solid grey;
    border-radius: 5pt;
    background-color: #aef4af;
}

.socket-scroll-row {
    background-color: white;
    margin:20px 200px;
    border:1px solid grey;
    padding:20px;
}

.dissasemble-output {
    border:1px solid grey;
    padding:10px;
    background-color: #333;
    font-size:12pt;
    margin-top:5px;
}

.img-vert {
    -moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1);
    filter: FlipV;
    -ms-filter: "FlipV";
}

.img-horz {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

.img-horz-grey {
    transform: rotate(90deg);
    filter: FlipH;
    -ms-filter: "FlipH";
    filter: grayscale(100%);
}


.warning-message-softer
{
    border:1px solid grey;
    background-color: rgb(255, 149, 149, 0.5);
    padding:10px;
    font-size: 10pt;
    text-align:center;
}

.warning-message
{
    border:1px solid rgb(255, 0, 0);
    background-color: rgb(255, 149, 149);
    padding:20px;
    text-align:center;
}

.modal-beehive-table {
    border-collapse: collapse;
}

.modal-beehive-table th {
    background-color: #a9ff52;
    border: 1px solid grey;
    text-align: center;
}

.modal-beehive-table td {
    background-color: #e3ffc7;
    text-align: center;
    border: 1px solid grey;
}


.dim-teleport-screen
{
	height:100%;
	width:100%;
	border:1px solid black;
	position: absolute; 
	top: 0; 
	left: 0;
}
.magic-spell  
{
    display: inline-block;
}
.magic-spell img 
{
    width:40px;
    height:40px;
}

/** Anwinity is a beast. **/
#content.side-chat {
    display: grid;
    column-gap: 0;
    row-gap: 0;
    grid-template-columns: 2fr minmax(300px, 1fr);
    grid-template-rows: 1fr;
  }
#content.side-chat #game-chat {
    max-height: calc(100vh - 32px);
}
#content.side-chat #game-chat > :first-child {
    display: grid;
    column-gap: 0;
    row-gap: 0;
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr auto;
    height: calc(100% - 16px);
}
#content.side-chat #chat-area {
    height: auto !important;
  }

/* game grid layout stuff */
/* Ty Anwinity for the help and suggestions */
/* Mouse coin exists btw */
/* So does faradox, if you ask anyone but the dwarf */
.game-screen
{
    min-height: 90vh;
    width: 100%;
    display: grid;
    column-gap: 0.25em;
    row-gap: 0.25em;
    grid-template-columns: auto 1fr;
    grid-template-rows: auto 1fr;
}






.select-monster-potion-button {
    border:1px solid black;
    padding:20px;
    margin:5px;
    display: inline-block;
    vertical-align: text-top;
    width:100px;
}




.criptoe-img-400-400 {
  border:2px solid black;
  box-shadow: 1px 1px 10px;
  margin:20px;
}

.table-invention-tablet td {
    border:1px solid grey;
}

.tablette_background_broken {
    background-image: url('https://cdn.idle-pixel.com/images/tablette_background_broken.png');
    background-size: 100% auto;
}

.tablette_background_uncharged {
    background-image: url('https://cdn.idle-pixel.com/images/tablette_background_grey.png');
    background-size: 100% auto;
}

.trophy-table {
    width:100%;
}

.trophy-table td {
    padding:10px;
}

.trophy-table th {
    padding:10px;
}

.trophy-content-table {
    display: inline-block;
    padding:20px;
    background-color: white;
    margin:20px;
    border:1px solid silver;
    width:400px;
    vertical-align: text-top;
}
.tablette_background {
    background-image: url('https://cdn.idle-pixel.com/images/tablette_background.png');
    background-size: 100% auto;
}

.top-bar {
    background-color: #00342d;
    color:silver;
    padding:10px;
    border-bottom: 1px solid grey;
    
    grid-column-start: 1;
    grid-column-end: span 2;
    grid-row-start: 1;
    grid-row-end: span 1;
}

.game-top-bar {
    background-color: #00342d;
    color:silver;
    border-bottom: 1px solid grey;
    
    grid-column-start: 1;
    grid-column-end: span 2;
    grid-row-start: 1;
    grid-row-end: span 1;
}



.top-bar-entry {
    display:inline-block;
    padding:0px 5px 0px 5px;
    margin-right:20px;
}


.panels
{
    vertical-align: text-top;
    background-color:rgb(200, 247, 248);
    grid-column-start: 2;
    grid-column-end: span 1;
    grid-row-start: 2;
    grid-row-end: span 1;
}

.panel-content {
    padding:20px;
}

.btn-tab {
    background-color: rgb(0, 0, 0, 0.5) !important;
    color:white !important;
    
}
.active {
    background-color: rgb(255, 255, 255, 0.5) !important;
    color: black !important;
}

.settings-tab-entry {
    background-color: rgb(255, 255, 255, 0.5) !important;
    padding:15px;
    margin:10px 0px;
    border:1px solid silver;
    border-radius: 5pt;
    h3 {
        color:grey;
    }

    input[type="checkbox"] {
        margin:10px 5px;
    }
   
}


.game-top-bar-upper {
    border-bottom: 1px solid grey;
    padding:5px;
}

.settings-tab {
    background-color: white;
    border:1px solid grey;
    padding: 20px;
    box-shadow: 2px 2px 5px;
    text-align: left;
}

.game-top-bar-lower {
    background-color: #005247;
    padding:5px;
    margin-top:-5px;
    margin-left:-4px;
    border-bottom: 1px solid grey;
    color:white;
}

.game-top-bar-optional-lower {
    background-color: #005247;
    padding:5px;
    margin-top:-5px;
    margin-left:-4px;
    border-bottom: 1px solid grey;
    color:grey;
}


.whats-this {
    color:blue;
    text-decoration: underline;
    float:right;
    margin-right:80px;
    margin-top: 6px;
    cursor: pointer;
}

.menu-bar-mobile-button {
    padding:5px;
    border:1px solid black;
    margin:5px 0px;
    background-color: rgba(219, 219, 219, 0.7);
}


.menu-left-bar-hide-button {
    font-size: 8pt;
    float:right;
    height:20px;
    padding:3px;
    border:1px solid black;
    line-height: 10pt;
    background-color: rgba(219, 219, 219, 0.4);
}
.whats-this:hover {
    color:red;
}

.menu-bar-hero {
    margin:10px;
}

.tr-hiscore-player:hover {
    background-color: lime;
    cursor: pointer;
}
.menu-bar {
    grid-column-start: 1;
    grid-column-end: span 1;
    grid-row-start: 2;
    grid-row-end: span 1;


    background-color: #005247;
    margin-top:-5px;
    color:white;
    vertical-align: text-top;
    border-right:1px solid grey;
    border-bottom:1px solid grey;
}

input[type='text'] {
    border:1px solid grey;
    font-size: 14pt;
    border-radius: 2pt;
}
input[type='password'] {
    border:1px solid grey;
    font-size: 14pt;
    border-radius: 2pt;
}

.input-modern-control-table-wrapper {
    background-color: #ECFBFC;
    box-shadow: 0px 1px 5px #C8F7F8;
    padding:20px;
    border-radius:5pt;
}

.btn-modern-input {
    border:1px solid silver;
    background-color: #C8F7F8;
    color:black;
    font-size: 16pt;
    box-shadow: none;
    border-radius:5pt;
}

.min-width-300 {
    min-width: 300px;
}

.quest-tabs {
    border:1px solid rgb(0, 0, 115);
    padding:20px;
    background-color: #00d6b976;
    box-shadow: 1px 1px 1px 1px;
}

.quest-tab-button {
    border:1px solid rgba(0, 0, 0, 0.496);
    padding:5px 20px;
    background-color: #00736476;
    display: inline-block;
    border-bottom: none;
    
}

.mail-entry {
    background-color: white;
    border: 1px solid grey;
    padding:5px 20px;
    box-shadow: 1px 1px 5px;
    margin-bottom: 20px;
}

.mail-entry-title {
    border-bottom: 1px solid silver;
    padding:20px 0px;
}

.mail-entry-content {
    margin-top:5px;
    padding:20px 0px;
}

.cursor {
    cursor:pointer;
}


/* end of grids */


.shake {
    /* Start the shake animation and make the animation last for 0.5 seconds */
    animation: shake 1s;
  
    /* When the animation is finished, start again */
    animation-iteration-count: infinite;
  }
  
  @keyframes shake {
    0% { transform: translate(1px, 1px) rotate(0deg); }
    10% { transform: translate(-1px, -1px) rotate(-1deg); }
    20% { transform: translate(-1px, 0px) rotate(1deg); }
    30% { transform: translate(1px, 1px) rotate(0deg); }
    40% { transform: translate(1px, -1px) rotate(1deg); }
    50% { transform: translate(-1px, 1px) rotate(-1deg); }
    60% { transform: translate(-1px, 1px) rotate(0deg); }
    70% { transform: translate(1px, 1px) rotate(-1deg); }
    80% { transform: translate(-1px, -1px) rotate(1deg); }
    90% { transform: translate(1px, 1px) rotate(0deg); }
    100% { transform: translate(1px, -2px) rotate(-1deg); }
  }


.search-table {
    border:1px solid rgb(103, 103, 103);
    background-color: white;
    margin-bottom: 25px;
}

.search-table td {
    padding:5px 20px;
    min-width:100px;
    border-top:1px solid rgb(103, 103, 103);
}

.search-table-border-left-td {
    border-left:1px solid rgb(103, 103, 103);
}


.shiny {
    position: relative;
    overflow: hidden;
}
.shiny:before { /* the transparent white thingy */
    display: inline-block;
    content: '';
    position: absolute;
    top: 0;
    left: -150px; /* animation starting point */
    width: 100px; /* how wide the thingy is */
    height: 100%;
    box-shadow: 0 0 16px rgba(255, 255, 255, 0.3); /* make it a little blurry */
    background: rgba(255, 255, 255, 0.3); 
    transform: skewX(-30deg); /* slant it */
    animation: imageshine 1.5s infinite; /* reference below keyframes, 1.5s is time of animation */
    animation-timing-function: ease; /* can control how the keyframes render, see https://www.w3schools.com/cssref/css3_pr_animation-timing-function.asp */
}

@keyframes imageshine {
    from {
        left: -150px; /* animation starting point */
    }
    to {
        left: 200%; /* animation ending point - extend to increase delay */
    }
}


@-webkit-keyframes blink {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-moz-keyframes blink {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-o-keyframes blink {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
img.blink {
    -webkit-animation: blink 1s;
    -webkit-animation-iteration-count: infinite;
    -moz-animation: blink 1s;
    -moz-animation-iteration-count: infinite;
    -o-animation: blink 1s;
    -o-animation-iteration-count: infinite;
}

.tooltip {
    --bs-tooltip-max-width: 500px !important;
}

.tp-content {
    text-align: left;
    font-size: 12pt;
    padding:10px;
}

.tp-combat-box {
    background-color:#222222;
    border-color: black;
    box-shadow: 1px 1px 5px;
    padding:5px;
    border-radius: 5px;
}
.tp-content div{
    margin-bottom:5px;
}


.dot {
    height: 10px;
    width: 10px;
    box-shadow: 0 0 10px greenyellow;
    background-color: lime;
    border-radius: 50%;
    display: inline-block;
}

.dot-green {
    height: 10px;
    width: 10px;
    box-shadow: 0 0 10px greenyellow;
    background-color: green;
    border-radius: 50%;
    display: inline-block;
}

.dot-grey {
    height: 10px;
    width: 10px;
    box-shadow: 0 0 10px grey;
    background-color: grey;
    border-radius: 50%;
    display: inline-block;
}



.tp-title {
    font-size: 16pt;
    color:cyan;
    text-transform: capitalize;
}

.tp-price {
    float:right;
}

.tp-subtitle {
    font-size: 10pt;
    color:orange;
}

.tp-description {
    color:grey;
}

.breeding-fighting-area {
    width:200px;
    height:200px;
    border:1px solid black;
    box-shadow: 1px 1px 5px;
    display: inline-block;
    vertical-align: text-top;
}


.toybox-record-medium {
    color:grey;
    font-size: 10pt;
    margin-top:10px;
    padding:10px;
    border:1px solid grey;
}

/* Flex Utilities */

.h-flex {
    display: flex;
    flex-direction: row;
}

.v-flex {
    display: flex;
    flex-direction: column;
}

.justify-center {
    justify-content: center;
}

.justify-start {
    justify-content: start;
}

.justify-end {
    justify-content: end;
}

.justify-space-around {
    justify-content: space-around;
}

.justify-space-between {
    justify-content: space-between;
}

.justify-space-evenly {
    justify-content: space-evenly;
}

.align-stretch {
    align-items: stretch;
}

.align-start {
    align-items: start;
}

.align-end {
    align-items: end;
}

.align-center {
    align-items: center;
}

.eighth-gap {
    gap: 0.125em;
}

.quarter-gap {
    gap: 0.25em;
}

.half-gap {
    gap: 0.5em;
}

.full-gap {
    gap: 1em;
}

.double-gap {
    gap: 2em;
}