NoGameNoLife - Jibril Theme for Relics of Avabur - Stylish

@-moz-document domain("www.avabur.com") {
/* This is a theme for the game Relics of Avabur. I use Stylish, which requires Google Chrome or Firefox. Just install Stylish, then Create New Theme, and then Import Mozilla Format, copy this, paste it, Overwrite Style, save, and go.

Credit also goes to Reltorakii and his Relics of Avabur - Rewamped themes. If it wasn't for his code, this wouldn't even be possible. Link: https://userstyles.org/styles/123685/relics-of-avabur-rewamped


*/


.toprounder, .toprounder15
{
    box-shadow: none !important;
}
/* here be tables like clan member lists and shit */
#accountActivityTable > .row:nth-child(odd), #clanMemberList tr:nth-child(odd), #clanActivityTable>.row:nth-child(odd), #onlineStaff tr:nth-child(odd), #onlinePlayers tr:nth-child(odd), #myClanDonationTable tr:nth-child(odd), #myClanDonationTable tr:nth-child(odd), .marketListings tr:nth-child(odd), .marketListings tr:nth-child(odd), #rankingTable tr, #milestoneTable tr, .marketListings tr, #inventoryTable tr, #accountReferralTable tr, #fameShopPurchaseTable tr, #clan_list tr:nth-child(odd), .bossParticipantList tr:nth-child(odd), .sorted_table tr:nth-child(odd), .full tr:nth-child(odd), td[class^="calendar-day"]:nth-child(odd), .shortActivitySection > .row:nth-child(odd), #confirmButtons > .button.green
{
    background: linear-gradient( to right, rgba(0,0,0,.8) 0%, rgba(0,0,0,.8) 100%) !important;
border: 1px rgba(253, 244, 153,.9) solid !important;
}
#accountActivityTable > .row:nth-child(even), #clanMemberList tr:nth-child(even), #clanActivityTable>.row:nth-child(even), #onlineStaff tr:nth-child(even), #onlinePlayers tr:nth-child(even), #myClanDonationTable tr:nth-child(even), #myClanDonationTable tr:nth-child(even), .marketListings tr:nth-child(even), .marketListings tr:nth-child(even), #clan_list tr:nth-child(even), .bossParticipantList tr:nth-child(even), .sorted_table tr:nth-child(even), .full tr:nth-child(even), td[class^="calendar-day"]:nth-child(even), .shortActivitySection > .row:nth-child(even)
{
    background: linear-gradient( to right, rgba(20,20,20,.8) 0%, rgba(20,20,20,.8) 100%) !important;
    border: 1px rgba(253, 244, 153,.9) solid !important;
}
#myClanDonationTable, #onlineStaff td, #onlinePlayers td, .dataTable thead th, .marketListings td, .marketListings th, #myClanDonationTable td, #myClanDonationTable td, .bossParticipantList td, .sorted_table td, .full td, td[class^="calendar-day"]
{
    background: linear-gradient( to right, rgba(0,0,0,.8) 0%, rgba(0,0,0,.8) 100%) !important;
border: 1px rgba(253, 244, 153,.9) solid !important;
}
select option
{
    background: rgba(0,0,0,0.75) !important;
}
#chatMessageListWrapper, #modalBackground /* chat box */
{
    background: transparent -moz-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.5) 100%) !important;
    background: transparent -webkit-linear-gradient(top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.5) 100%) !important;
    background: transparent linear-gradient(to bottom, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.5) 100%) !important;
}
#areaWrapper.fatigued
{
    /* fatigue thingy if you have the setting that changes colors if you get fatigued */

    background: -moz-linear-gradient(top, rgba(253, 244, 153, 0.75) 0%, rgba(253, 244, 153,.5)5%, rgba(255, 174, 232, 0.5) 6%, rgba(0,0,0,.5) 25%, rgba(0, 0, 0, 0.5) 100%) !important;
    background: -webkit-linear-gradient(top, rgba(253, 244, 153, 0.75) 0%, rgba(253, 244, 153,.5)5%, rgba(255, 174, 232, 0.5) 6%, rgba(0,0,0,.5) 25%, rgba(0, 0, 0, 0.5) 100%) !important;
    background: linear-gradient(to bottom, rgba(253, 244, 153, 0.75) 0%, rgba(253, 244, 153,.5)5%, rgba(255, 174, 232, 0.5) 6%, rgba(0,0,0,.5) 25%, rgba(0, 0, 0, 0.5) 100%) !important;
}
.closeModal, .spellCircle, .closeCustomWindow
{
    /* this is the circle for x-ing out open thingies */

    background: -moz-radial-gradient(center, ellipse cover, rgba(255, 174, 232, 0.85) 0%, rgba(255, 174, 232, 0.75) 25%, rgba(0,0,0,.75) 75%, rgba(0, 0, 0, 0.85) 94%, rgba(253, 244, 153, 0.85) 100%) !important;
    background: -webkit-radial-gradient(center, ellipse cover, rgba(255, 174, 232, 0.85) 0%, rgba(255, 174, 232, 0.75) 25%, rgba(0,0,0,.75) 75%, rgba(0, 0, 0, 0.85) 94%, rgba(253, 244, 153, 0.85) 100%) !important;
    background: radial-gradient(ellipse at center, rgba(255, 174, 232, 0.85) 0%, rgba(255, 174, 232, .75) 25%, rgba(0,0,0,.75) 75%, rgba(0, 0, 0, 0.85) 94%, rgba(253, 244, 153, 0.85) 100%) !important;
    border: 1px solid rgba(253, 244, 153, 0.75) !important;
    box-shadow: 0px 0px 20px rgba(253, 244, 153, 0.75) !important;}

/* event damage bubble */ .badcircle {
    background: -moz-radial-gradient(center, ellipse cover, rgba(95,0,0, 0.85) 0%, rgba(95,0,0, 0.75) 25%, rgba(95,0,0, 0.75) 100%) !important;
    background: -webkit-radial-gradient(center, ellipse cover, rgba(95,0,0, 0.85) 0%, rgba(95,0,0, 0.75) 25%, rgba(95,0,0, 0.75) 100%) !important;
    background: radial-gradient(ellipse at center, rgba(95,0,0, 0.85) 0%, rgba(95,0,0, 0.75) 25%, rgba(95,0,0, 0.75) 100%) !important;
    border: 1px solid rgba(255,255,255, 0.25) !important;
    box-shadow: 0px 0px 10px rgba(255,255,255, 0.75) !important;}

/* event healing bubble */ .goodcircle {
        background: -moz-radial-gradient(center, ellipse cover, rgba(0,200,0, 0.85) 0%, rgba(0,200,0, 0.75) 25%, rgba(0,200,0, 0.75) 100%) !important;
    background: -webkit-radial-gradient(center, ellipse cover, rgba(0,200,0, 0.85) 0%, rgba(0,200,0, 0.75) 25%, rgba(0,200,0, 0.75) 100%) !important;
    background: radial-gradient(ellipse at center, rgba(0,200,0, 0.85) 0%, rgba(0,200,0, 0.75) 25%, rgba(0,200,0, 0.75) 100%) !important;
    border: 1px solid rgba(255,255,255, 0.25) !important;
    box-shadow: 0px 0px 10px rgba(255,255,255, 0.75) !important;}

div.day-number {
    background: rgba(255, 174, 232,0.4);
    border-left: 1px solid rgba(158,255,248,.9);
    border-bottom: 1px solid rgba(158,255,248,.9);
    width: 30px;
}
/* these are the headers */
h1, h2, h3, h4, h5, h6, .customWindowContent thead th, #NoAConfig_header {
    background-color: transparent !important;
    font-weight: bold;
    color: rgba(255, 174, 232, .9) !important;
    text-shadow: 0 0 9px rgba(0, 0, 0, 0.9) !important;
   /* gradient */
background: -moz-linear-gradient(top, rgba(158,255,248,0.9) 0%, rgba(158,255,248,0.9) 2%, rgba(0,0,0,0.75) 3%, rgba(0,0,0,.1) 20%, rgba(0,0,0,.1) 80%, rgba(0,0,0,.75) 97%, rgba(158,255,248,.9) 98%, rgba(158,255,248,0.9) 100%);
background: -webkit-linear-gradient(top, rgba(158,255,248,0.9) 0%, rgba(158,255,248,0.9) 2%, rgba(0,0,0,0.75) 3%, rgba(0,0,0,.1) 20%, rgba(0,0,0,.1) 80%, rgba(0,0,0,.75) 97%, rgba(158,255,248,.9) 98%, rgba(158,255,248,0.9) 100%);
background: linear-gradient(to bottom, rgba(158,255,248,0.9) 0%, rgba(158,255,248,0.9) 2%, rgba(0,0,0,0.75) 3%, rgba(0,0,0,.1) 20%, rgba(0,0,0,.1) 80%, rgba(0,0,0,.75) 97%, rgba(158,255,248,.9) 98%, rgba(158,255,248,0.9) 100%);
}

#confirmBox h1 {
   /* this is where gradients live*/
background: -moz-linear-gradient(top, rgba(158,255,248,0.9) 0%, rgba(158,255,248,0.9) 2%, rgba(0,0,0,0.75) 3%, rgba(0,0,0,.1) 20%, rgba(0,0,0,.1) 80%, rgba(0,0,0,.75) 97%, rgba(158,255,248,.9) 98%, rgba(158,255,248,0.9) 100%);
background: -webkit-linear-gradient(top, rgba(158,255,248,0.9) 0%, rgba(158,255,248,0.9) 2%, rgba(0,0,0,0.75) 3%, rgba(0,0,0,.1) 20%, rgba(0,0,0,.1) 80%, rgba(0,0,0,.75) 97%, rgba(158,255,248,.9) 98%, rgba(158,255,248,0.9) 100%);
background: linear-gradient(to bottom, rgba(158,255,248,0.9) 0%, rgba(158,255,248,0.9) 2%, rgba(0,0,0,0.75) 3%, rgba(0,0,0,.1) 20%, rgba(0,0,0,.1) 80%, rgba(0,0,0,.75) 97%, rgba(158,255,248,.9) 98%, rgba(158,255,248,0.9) 100%);
}
/* shadow color for names in chat I suppose */
#chatMessageList .profileLink {
    text-shadow: 0 0 9px rgba(158,255,248, 0.9) !important;

}


.chat_invert {
   /* this is the gradient for being @'d */
background: -moz-linear-gradient(top, rgba(253, 244, 153,1) 0%, rgba(253, 244, 153,0.65) 4%, rgba(253, 244, 153,.57) 8%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.4) 80%, rgba(253, 244, 153,0.65) 93%, rgba(253, 244, 153,0.65) 96%, rgba(253, 244, 153,1) 100%);
background: -webkit-linear-gradient(top, rgba(253, 244, 153,1) 0%, rgba(253, 244, 153,0.65) 4%, rgba(253, 244, 153,.57) 8%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.4) 80%, rgba(253, 244, 153,0.65) 93%, rgba(253, 244, 153,0.65) 96%, rgba(253, 244, 153,1) 100%);
background: linear-gradient(to bottom, rgba(253, 244, 153,1) 0%, rgba(253, 244, 153,0.65) 4%, rgba(253, 244, 153,.57) 8%, rgba(0,0,0,0.4) 20%, rgba(0,0,0,0.4) 80%, rgba(253, 244, 153,0.65) 93%, rgba(253, 244, 153,0.65) 96%, rgba(253, 244, 153,1) 100%);
}

/* major outlines */
 .border2, .currentPage, #chatMessage, #chatChannel, input[type="button"], input[type="submit"], input[type=text], input[type="password"], input[type="submit"], input[type="email"], input[type="number"], input[type="search"], textarea, .btn-primary, select, .dropdown-menu, .page_link, .milestoneBarWrapper, #promoActive, .xpCircle, #tradeXPBar, #confirmBox, .customWindowContent thead th, #houseXPBar, #eventCountdown, .sorted_table th, #NoAconfig_saveBtn, #NoAconfig_closeBtn {
    background: rgba(0,0,0,.7) !important;
    border-color: rgba(158,255,248, 0.9) !important; /* outlines*/
}
/* lines between certain boxes */
#helpSection a, .navSection a, #confirmBox p, .customWindowContent .bRight, .customWindowContent tbody, .customWindowContent th {
    border-color: rgba(0,0,0, 0.6) !important; /* outlines */
}
/* scrollbar */
.mCSB_dragger_bar {
    background-color: rgba(253, 244, 153, 0.75) !important; }

 .separator {
background-color: rgba(158,255,248, 0.75) !important;
}
/* tooltips like for stats and stuff */
#profileOptionTooltip, #statTooltip, #currencyTooltip, #itemTooltip, #itemEquippedTooltip, #toolTooltip, #gemTooltip, #updateCount, #levelTooltip {
    background: rgba(0,0,0,.8) !important;
    border-color: rgba(253, 244, 153, 0.9) !important; /* outlines*/
color: rgba(255, 174, 232,.9) !important;
}
/* stamina number */
.actionTimer, #autosMaximum, #autosRemaining, #areaWrapper > h5 > div{
    color: rgba(253, 244, 153, 0.8) !important; /* color 1 */
font-weight: bold !important;
text-shadow: 0 0 6px rgba(0,0,0,.9) !important;
}
 #autosBuffer {
    color: rgba(158,255,248,.9) !important; /* color 2 */
 font-weight: bold !important;
              text-shadow: 0 0 6px rgba(0,0,0,.9) !important; }

/* shop borders n stuff */
.bt1, #rankingTable tr, #milestoneTable tr, .marketListings tr, #inventoryTable tr, #accountReferralTable tr, #fameShopPurchaseTable tr, .bossParticipantList tr, .sorted_table tr {
        border: 1px rgba(158,255,248,.9) solid !important;   /* outlines */
}
/* backgrounds for ALL of the major boxes */
.ui-element, .border2, input[type="button"], input[type="submit"], .btn-primary, .page_link, #onlineStaff thead tr th, #onlinePlayers thead tr th, #myClanDonationTable thead tr th, #myClanDonationTable tfoot tr th, .marketListings thead tr th, .marketListings tfoot tr th, .invTypeHeader, #updateCount, #promoActive, .xpCircle, #confirmBox, #confirmBox p, #modalWrapper, .bossParticipantList thead tr th, #eventCountdown, .sorted_table th
{
    background: linear-gradient(to right, rgba(0,0,0,.8) 0%, rgba(0,0,0,.55) 30%, rgba(0,0,0,.55) 70%, rgba(0,0,0,.8) 100%) !important;

}
/* inputs and stuff */
div.editable, select, .dropdown-menu, input[type=text], input[type="password"], input[type="email"], input[type="number"], #chatChannel, #chatMessage, textarea, .milestoneBarFillIncomplete {
    background: linear-gradient(to right, rgba(0,0,0,.8) 0%, rgba(0,0,0,.55) 30%, rgba(0,0,0,.55) 70%, rgba(0,0,0,.8) 100%) !important;

}
/* these are the buttons like Account Management and whatnot at the top */
#accountLinks li {
    background: transparent !important;
    border-width: 1px 0 1px 0;
    border-color: rgba(0,0,0, 0.6); /* outlines */
    border-top-color: rgba(0,0,0, 0.75);
border-bottom-color: rgba(158,255,248, 0.9);
}

/* varous buttons and stuff */
.navSection li, #helpSection li, #gameStatList li {
    background: transparent !important;
    border-top: 1px rgba(0,0,0, 0) solid !important; /* outlines */
}

#moreStatsLinkWrapper {
    background: transparent !important;
    border: 1px rgba(0,0,0,0) solid !important;
}
 #eventCalendarLink {
              background: transparent;
              border: 1px rgba(0,0,0,0) solid !important;
          }
/* button hovers */
.navSection a:hover, #helpSection a:hover, #onlineList > li:hover, #moreStatsLinkWrapper:hover, #accountLinks>a>li:hover, #bq_flasher:hover, input[type="button"]:hover, input[type="submit"]:hover, .btn-primary.active, .btn-primary:active, .open > .dropdown-toggle.btn-primary, .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary.focus:active, .btn-primary:active:focus, .btn-primary:active:hover, .open > .dropdown-toggle.btn-primary.focus, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary:hover, .dropdown-menu > li > a:hover, .page_cur, a>h5:hover, #eventCalendarLink:hover, #NoAconfig_saveBtn:hover, #NoAconfig_closeBtn:hover, #confirmButtons > .button.green:hover {
    background: linear-gradient(to right, rgba(0,0,0,.9) 0%, rgba(0,0,0,.9) 100%) !important;
border: 1px rgba(253, 244, 153,.9) solid !important;
color: rgba(255, 174, 232,.9) !important;
}

/* just XP bar backgrounds. I wouldn't touch this. */
#xpFill, #tradeskillXPFill, .PlayerHPFill, .milestoneBarFillComplete, #tradeXPFill, #houseXPFill {
    background: linear-gradient(to right, rgba(150,150,150, .90) 0%, rgba(158,255,248, .6) 100%) !important;
}

/* links, of course */
a, a:link, a:visited, #NoAConfig_resetLink, #NoAConfig_resetLink:link, #NoAConfig_resetLink:visited {
    color: #FFFFFF !important;
    text-shadow: 0 0 9px rgba(0, 0, 0, 0.9) !important;
}
/* link hovering... */
a:active, a:hover, #NoAConfig_resetLink:hover, #NoAConfig_resetLink:active {
    color: rgba(255, 174, 232,.9) !important;
}

/* the actual background and text */
body {
    background: url(https://i.imgur.com/4uWL2Mi.png?1) no-repeat center center fixed !important;
    background-color: rgba(200,200,200, 1) !important;
    -webkit-background-size: cover;
    /* For WebKit*/

    -moz-background-size: cover;
    /* Mozilla*/

    -o-background-size: cover;
    /* Opera*/

    background-size: cover;
    /* Generic*/
color: #FFFFFF;
text-shadow: 0 0 9px rgba(0,0,0,.95);
   --scrollbar-color: rgba(253, 244, 153, 0.65) !important; /*color 2 */
    --scrollbar-background: rgba(253, 244, 153, 0.1) !important; /*color 2 */
}
/* this is the background for the top stats list and stuff. I recomment leaving this alone. This is just to make it transparent. */
#statsAndStuff { background: transparent }

#statsTable, #resourcesTable, #tradesTable, #attrTable, #skillTable { background: transparent}

}