{IMPORTANT:
For sharper and brighter preview pics, change "USERNAME" to your username in the first two imports below. They start with
@\import

If needed, fix layout problems with this topic:
https://myanimelist.net/forum/?topicid=439897
}

@\import "https://malscraper.azurewebsites.net/covers/anime/USERNAME/presets/dataimagelinkbefore";

@\import "https://malscraper.azurewebsites.net/covers/manga/USERNAME/presets/dataimagelinkbefore";

/*Layout CSS was originally made by Takana_no_hana, edits by
Shishio-kun and Valerio_Lyndon

Grid Style 2, 2023 Update

Learn how to customize the layout here:
https://myanimelist.net/forum/?topicid=1640096
*/
@\import "https://storage.live.com/items/4A07C1EEED420167%21170";

@\import "https://dl.dropboxusercontent.com/s/4u0rqtodxpjkti4/TakanaGridBackup.css";

@\import "https://fonts.googleapis.com/css?family=Orbitron";

@\import "https://fonts.googleapis.com/css?family=Amaranth";

@\import "https://fonts.googleapis.com/css?family=Rancho";

@\import "https://fonts.googleapis.com/css?family=Kaushan+Script|Tangerine";

/*WALLPAPERS
To change background images: delete what's in the parenthesis. Upload
the new background to Imgur or a similar site, then copy the direct link (or Original GIF link if it's animated) and paste it into the parenthesis. Save.*/
body, body.ownlist
{
background-image: url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CDwPFOh8EFNst5IuA6dZ9dJWSmBXfBAGUX-rlKPwyr32w);
}

/*PREVIEW PICS/COVERS
See the help at the top of this layout code if you have problems
with blurry or missing preview pics.

If you want to customize a preview pic, use the code below but change the number after "anime" to the anime's number. Get the number from the address bar on its page on MAL. For example if you go to Code Geass's page the number in the address bar is 1575.

Change "anime" to "manga" to customize manga previews. This code customizes the Code Geass preview (anime #1575) if you change the background image link.

Copy and paste the code to customize more preview pics, just change the number.*/

.data.image a[href^="/anime/1575/"]:before{background-image:url(https://image.myanimelist.net/ui/5LYzTBVoS196gvYvw3zjwA5Tctkq8HqPvnR9oiSb04M);
}

/*BANNER AVATAR
Change the first "center" to "left" or "right" to move the picture position. Change "cover" to "contain" or remove it to change how the image fills the avatar.*/
.list-table .list-table-header:after {
background-image: url(https://image.myanimelist.net/ui/BQM6jEZ-UJLgGUuvrNkYUHbX73YKsqBNULwFQ5w91IKVfdAlndbO0M5nJUddzBgEYpSu0jfmBmrdQHygdYX2Ng);
background-position: center center;
background-size: cover !important;
}

/*BANNER QUOTE*/
.cover-block::before {
content: "I'm Gonna Take You There Myself, Fly You To The Moon. That's A Promise."
}

/*BANNER BACKGROUNDS AND HEIGHT
You can change the images here and adjust the height. If you can't see the whole image increase height and/or change "cover" to "contain".

You may want to lower cover pics after (scroll down).*/

/*ALL ANIME/MANGA BANNER BACKGROUND*/
.list-unit.all_anime .list-status-title:after {
background-image: url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CDbmwJclS8waHH8ICALwTZoPPMfMIjGhhbI-RhNDr1GhQ);
background-size: cover !important;
height: 500px !important;
}
/*CURRENTLY WATCHING BANNER BACKGROUND*/
.list-unit.watching .list-status-title:after,
.list-unit.reading .list-status-title:after  {
background-image: url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CBG-b7hwy7qKu7zWmpKenzP_Cjzlet2NWKewpO1mspNBw);
background-size: cover !important;
height: 500px !important;
}
/*COMPLETED BANNER BACKGROUND*/
.list-unit.completed .list-status-title:after {
background-image: url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CD5WlWNiHQhjXW8kRrx5NjEZCUFVEqAyah-tWx3RT0fjw);
background-size: cover !important;
height: 500px !important;
}
/*ON-HOLD BANNER BACKGROUND*/
.list-unit.onhold .list-status-title:after {
background-image: url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CC_2jPQsUiotjmM0rb6t09gpjOPSE96k5bO0_lEDIasAw);
background-size: cover !important;
height: 500px !important;
}
/*DROPPED BANNER BACKGROUND*/
.list-unit.dropped .list-status-title:after {
background-image: url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CAMEPfxhywYDDaYfFusV8PvtbnXIJJToV1GbVIlW7ZlPA);
background-size: cover !important;
height: 500px !important;
}
/*PLAN TO BANNER BACKGROUND*/
.list-unit.plantowatch .list-status-title:after,
.list-unit.plantoread .list-status-title:after  {
background-image: url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CAyloDh4mb5YIYdc6bl9cO6d_1s1PFzoasFxrysljucLw);
background-size: cover !important;
height: 500px !important;
}

/*MOVE COVER PICS UP OR DOWN
Increase 0px to a higher amount like 100px to move the anime preview pics and header (Completed, etc) down. -480px brings them up to the banner buttons.

If you put [data-query*='"status":7'] at the start of the first two lines of code (with a space after), it will affect only All Anime/Manga. Example:

[data-query*='"status":7'] .list-unit .list-status-title .text,
[data-query*='"status":7'] .list-item

Change the 7 to 1 for current, 2 for completed, 3 for hold, 4 for dropped, and 6 for planned. Copy and paste the code again if needed.*/
.list-unit .list-status-title .text,
.list-item{
top: 0px;
}

/*BANNER BUTTON BACKGROUNDS
The first image link in parenthesis is the still black and white image, the second image link is the animated image (a GIF).*/

/*ALL ANIME BANNER BUTTON*/
.status-button.all_anime {
background-image:url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CDDWEcVx7QlUjC5tdltS6CFqtVT1VPREt2yaeEsUzgVYg);
}
.status-button.all_anime:hover,.status-button.all_anime.on {
background-image:url(https://image.myanimelist.net/ui/BQM6jEZ-UJLgGUuvrNkYUIo8DLuryyV3Hk-G5vwezjvTzonaWpFEJLPJr1xPWK7J47nEH32MXtkenTsexp18Pg);
}
/*CURRENT BANNER BUTTON*/
.status-button.watching,.status-button.reading {
background-image:url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CBCT3TZmYupO135vXZjagzFnKrY27kdhYr2q6jM7M3-DA);
}
.status-button.watching:hover,.status-button.watching.on,.status-button.reading:hover,.status-button.reading.on {
background-image:url(https://image.myanimelist.net/ui/BQM6jEZ-UJLgGUuvrNkYUGuekAww9bV9dfxCV_Gw93hCKWfjtWH1pzNcCxfisJ5I4OUpnBVSw66NXcjM_VqMuA);
}
/*COMPLETED BANNER BUTTON*/
.status-button.completed {
background-image:url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CD-Sn0YnBoiWHuyHFDpGof-XGBT7w3a2DcgmomNFouEeA);
}
.status-button.completed:hover,.status-button.completed.on {
background-image:url(https://image.myanimelist.net/ui/BQM6jEZ-UJLgGUuvrNkYUABkeOoYuMliXJgOVgcyghp9kJeAgnjuP14wrDu6AcHv1YJnuS7QrJZ_nQa0iJLbXQ);
}
/*ON HOLD BANNER BUTTON*/
.status-button.onhold {
background-image:url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CAM8qSQRVMcBDHRRXClZtApK78xii4r_-LPSQDoC8Z9eA);
}
.status-button.onhold:hover ,.status-button.onhold.on {
background-image:url(https://image.myanimelist.net/ui/BQM6jEZ-UJLgGUuvrNkYUOVAPRDPuAMT4gDcIuDLeHh75aKQ1RPe8rGZv6t07sZIxCowH0u4_kcF_sZfWgefYQ);
}
/*DROPPED BANNER BUTTON*/
.status-button.dropped {
background-image:url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CD8rq26RQMk4hVTbVY89zgCw51fTAA_QcdvfCWRGeM85Q);
}
.status-button.dropped:hover,.status-button.dropped.on {
background-image:url(https://image.myanimelist.net/ui/BQM6jEZ-UJLgGUuvrNkYUK2Yle5cj6jQ0RH63I0yQsaKMU6X4vlO24ZINkqEd2V3Iy6LpZITQqnNouH6GzD7Mg);
}
/*PLANNED BANNER BUTTON*/
.status-button.plantowatch,.status-button.plantoread{
background-image:url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CAwqfRAFyY8MWlvkF0UAiDpPrH-ArzBI3BlF-wxr4Lfyw);
}
.status-button.plantowatch:hover,.status-button.plantowatch.on,.status-button.plantoread:hover,.status-button.plantoread.on {
background-image:url(https://image.myanimelist.net/ui/BQM6jEZ-UJLgGUuvrNkYUK5biZO2sh5csXSDbF-TJjpb0wDwOyB4Iq9q972RW8DCObB2UWDIopmJ0HFxjC-NKA);
}

/*SIDE RENDERS (left and right)
To move the renders, adjust the percentage after "left" or "right". You can use negatives. To resize the renders, adjust the percentage after "width". 0% will remove the render.*/
footer:before {
left: -3%;
width: 25% !important;
background-size: contain !important;
background-image: url();
background-position: left bottom !important;
}
footer:after {
right: 0%;
width: 25% !important;
background-size: contain !important;;
background-image: url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CCaN4zpwQ99fgByE2NtinulZQhmLTg0AN85AfmFuNKLcg);
background-position: right bottom !important;
}

/*ANIME/MANGA CONTAINER SETTINGS
(TABLE COLORS)
You can change the color with rbga colors. Generate RGBA colors here so you can replace the codes below:
https://www.hexcolortool.com/
First set of colors= entire table. Second = banner. Third = default container behind an anime. Fourth = container when you point to it. Fifth = upper left menu. Sixth = top. You can set the last digit to zero to make it completely transparent.*/
.list-unit {
background-color: rgba(237, 250, 0, 0) ;
}
.status-menu-container {
background-color: rgba(236, 225, 14, 1) ;
}
.list-table .list-table-data {
background-color: rgba(237, 250, 0, 0) !important;
}
.list-table .list-table-data:hover {
background-color: rgba(236, 225, 14, 1) !important;
}
.list-menu-float .icon-menu{
background-color: rgba(237, 250, 0, 1) !important;
}
.header {
background: linear-gradient(rgba(237, 250, 0, 0),transparent) !important;
}

/*FILTER MENU BACKGROUND*/
#advanced-options {
background-image: url(https://image.myanimelist.net/ui/V0F1loM0v45WXM_cZqmcni_DbH4CYA24V9mL6VLt8CCzArn2x_tB6fJ_Or3wUdpMX1MzjfaZwZP8XBAqkCzpLQ) !important;
}

/*MAL LOGO*/
.header .header-title{
background-image: url(https://image.myanimelist.net/ui/yCHrxjyj0lwjmGEXjAnOyOg5uVg2jZ3RqbfLRo9JO_4) !important;
}

/*GREYSCALE FOR CUSTOM CATEGORY BUTTONS
Delete this to remove grey from custom buttons.*/
.status-button.watching,.status-button.reading,.status-button.completed,.status-button.onhold,.status-button.dropped,.status-button.plantowatch,.status-button.plantoread,.status-button.all_anime{
filter: grayscale(100%);
}
.status-button.all_anime:hover,.status-button.all_anime.on,.status-button.plantowatch:hover,.status-button.plantowatch.on,.status-button.plantoread:hover,.status-button.plantoread.on,.status-button.dropped:hover,.status-button.dropped.on,.status-button.onhold:hover,.status-button.onhold.on,.status-button.completed:hover,.status-button.completed.on,.status-button.watching:hover,.status-button.watching.on,.status-button.reading:hover,.status-button.reading.on{
filter: inherit;
}



{ADD NEW CODES UNDER HERE}

*{
  font-family:Orbitron !important;
}

.status-menu-container .status-menu .status-button {
  padding: 0 !important;
  position: relative;
  display: table-cell;
  font-family: Tangerine,cursive;
  text-align: center;
  vertical-align: bottom !important;
  font-size: 10px;
  font-weight: 600 !important;
  color: #f5ff00;
  width: 125px;
  height: 74px;
  z-index: 10;
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  border-radius: 5px !important;
  top: 2px;
}

/* CUSTOM CURSOR
*/

body *, :not(*) {
cursor: url(https://image.myanimelist.net/ui/yCHrxjyj0lwjmGEXjAnOyAN2aYUmi8vfKr103xUMmtM), url(https://image.myanimelist.net/ui/yCHrxjyj0lwjmGEXjAnOyAN2aYUmi8vfKr103xUMmtM), auto !important;
}

.cover-block:before{
font-family: Orbitron !important;

}