Todd_'s List Fixed

@\import "https://malscraper.azurewebsites.net/covers/auto/presets/more";
@import "http://dl.dropbox.com/u/78340470/Icon%20Style%20Menu%20Bar/IconStyleCSSFixed.css";

/*
// Self-explanatory
*/
BODY
{
background-image: url(http://myanimelist.net/images/userwalls/2092989.jpg);
background-attachment: fixed;
background-repeat: ;
background-position: bottom right;



color: #000000;
font-size: 14.00px;
font-variant: ;
font-family: Roboto;
background-color: #black;
}

/*
// Determines the positioning of your list
*/

#list_surround
{
margin-left: 20px;
width: 620px;
}

/*
// All links on your list
*/

a
{
color: #FFFFFF;
text-decoration: none;
}

a:visited
{
color: #FFFFFF;
text-decoration: none;
}

a:hover
{
color: #CC0033;
text-decoration: none;
}

/*
// Alternating row color 1
*/

.td1
{

color: #FF0033;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #000000;
padding: 3px;
background-color: #000000;
}

/*
// Alternating row color 2
*/

.td2
{

color: #FF0033;
border-width: 0px 0px 1px 0px;
border-style: solid;
border-color: #000000;
padding: 3px;
background-color: #000000;
}

/*
// This represents the "Anime Title", "Score", "# Eps" columns
*/

.table_header
{

color: #FFFFFF;
border-width: 1px 1px 1px 0px;
border-style: ;
border-color: #000000;
background-color: #000000;
padding: 2px;
}

/*
// headerLink represents the color of the links inside the_header
*/

.table_headerLink
{
color: #FFFFFF;
}

.table_headerLink:Visited
{
color: #000000;
}

.table_headerLink:Hover
{
color: #CC0033;
}

/*
// Controls the select form decoration (the drop down select box)
*/

.form
{
border-width: 1px 1px 1px 1px;
border-color: #000000;
border-style: solid;
color: #000000;
padding: 2px;
font-size: 11.00px;
font-family: Roboto;
}


/* Which 'status' up top is selected? */

.status_selected
{

color: #FFFFFF;
border-width: 0px 0px 0px 0px;
border-style: inset;
border-color: #FFFFFF;
padding: 3px;
background-color: #000000;
}

.status_not_selected
{

color: #CC0033;
border-width: 0px 0px 0px 0px;
border-style: solid;
border-color: #FFFFFF;
padding: 3px;
background-color: #000000;
}

/*
Header classes for Currently Watching, Completed, Dropped, etc...
*/

.header_cw
{

}

.header_completed
{

}

.header_onhold
{

}

.header_dropped
{

}

.header_ptw
{

}

.header_title {
font-size: 25px;
font-weight: bold;
text-align: right;
}


.category_totals
{

}

#grand_totals
{
text-align: center;
}

/* header_al is thesurrounding "User's Anime List" at the top */

.header_al
{
font-weight: bold;
font-size: 16px;
}

/* header_al_links is thewith your "Profile" and "MyAnimeList home" links */
.header_al_links
{

}

/* controls what styles you can give to all the anime titles in your list */
.animetitle
{
font-weight: bold;
}

/*
copyright contains the "Producted by Garrett Gyssler" text
DO NOT REMOVE OR HIDE THIS DIV
IF FOUND TO BE REMOVED, YOUR LIST WILL BE REMOVED TOO
*/


#copyright
{
padding-top: 6px;
text-align: center;
margin: 0 auto;
width: 620px;
}




body {
background-size: cover;
}


/* CURRENT BACKGROUND */
.status_selected a[href*="status=1"]:before {
background-color: aquamarine;
background-image: url(https://i.imgur.com/4NctLkO.jpg) !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
height: 100% !important;
width: 100% !important;
background-size: cover !important;
display: block !important;
content: "" !important;
z-index: -1 !important;
}



/* COMPLETE BACKGROUND */
.status_selected a[href*="status=2"]:before {
background-color: violet;
background-image: url(https://i.imgur.com/hBzriC8.png) !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
height: 100% !important;
width: 100% !important;
background-size: cover !important;
display: block !important;
content: "" !important;
z-index: -1 !important;
}


/* ON-HOLD BACKGROUND */
.status_selected a[href*="status=3"]:before {
background-color: cyan;
background-image: url(https://i.imgur.com/ShOBUdH.jpg) !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
height: 100% !important;
width: 100% !important;
background-size: cover !important;
display: block !important;
content: "" !important;
z-index: -1 !important;
}



/* DROPPED BACKGROUND */
.status_selected a[href*="status=4"]:before {
background-color: teal;
background-image: url(https://i.imgur.com/R9x4rpi.jpg) !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
height: 100% !important;
width: 100% !important;
background-size: cover !important;
display: block !important;
content: "" !important;
z-index: -1 !important;
}


/* PLANNED BACKGROUND */
.status_selected a[href*="status=6"]:before {
background-color: pink;
background-image: url(https://i.imgur.com/lKlCvUL.jpg) !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
height: 100% !important;
width: 100% !important;
background-size: cover !important;
display: block !important;
content: "" !important;
z-index: -1 !important;
}


/* ALL ANIME/MANGA BACKGROUND */
.status_selected a[href*="status=7"]:before {
background-color: lime;
background-image: url(https://i.imgur.com/0JZgiUn.jpg) !important;
position: fixed !important;
top: 0 !important;
left: 0 !important;
height: 100% !important;
width: 100% !important;
background-size: cover !important;
display: block !important;
content: "" !important;
z-index: -1 !important;
}

/* HEADERS */

/*
Anime List only

CURRENTLY WATCHING HEADER
This is the header above currently watching/reading. Increase the amount after "height:" if your image doesn't fit the header. Lower the margin-bottom below zero if you wish the header move it behind the list.

If in Google Chrome your header has little to no height and doesn't increase when you try to change it, then replace "height:" with "padding-top:".
*/
.header_cw {
background-image:url(https://i.imgur.com/TpJcNfM.png);
height: 200px;
margin-bottom: 0px;
background-color: transparent;
background-repeat: no-repeat;
color:;
font-family:;
font-size:;
}



/*
COMPLETED HEADER
This is the header above your anime/manga that's completed. Increase the amount after "height:" if your image doesn't fit the header. Lower the margin-bottom below zero if you wish the header move it behind the list.

If in Google Chrome your header has little to no height and doesn't increase when you try to change it, then replace "height:" with "padding-top:".
*/
.header_completed {
background-image:url(https://i.imgur.com/coo4nQA.png);
height: 200px;
margin-bottom: 0px;
background-color: transparent;
background-repeat: no-repeat;
color:;
font-family:;
font-size:;
}



/*
ON-HOLD HEADER
This is the header above your animes/mangas on-hold. Increase the amount after "height:" if your image doesn't fit the header. Lower the margin-bottom below zero if you wish the header move it behind the list.

If in Google Chrome your header has little to no height and doesn't increase when you try to change it, then replace "height:" with "padding-top:".
*/
.header_onhold {
background-image:url(https://i.imgur.com/BJVDPiN.png);
height: 200px;
margin-bottom: 0px;
background-color: transparent;
background-repeat: no-repeat;
color:;
font-family:;
font-size:;
}



/*
DROPPED HEADER
This is the header above your dropped animes/mangas. Increase the amount after "height:" if your image doesn't fit the header. Lower the margin-bottom below zero if you wish the header move it behind the list.

If in Google Chrome your header has little to no height and doesn't increase when you try to change it, then replace "height:" with "padding-top:".
*/
.header_dropped {
background-image:url(https://i.imgur.com/w1Mklhw.png);
height: 200px;
margin-bottom: 0px;
background-color: transparent;
background-repeat: no-repeat;
color:;
font-family:;
font-size:;
}



/*
PLAN TO WATCH HEADER
This is the header above the anime/manga you plan to see or read on your list. Increase the amount after "height:" if your image doesn't fit the header. Lower the margin-bottom below zero if you wish the header move it behind the list.

If in Google Chrome your header has little to no height and doesn't increase when you try to change it, then replace "height:" with "padding-top:".
*/
.header_ptw {
background-image:url(https://i.imgur.com/ocONZB7.png);
height: 200px;
margin-bottom: 0px;
background-color: transparent;
background-repeat: no-repeat;
color:;
font-family:;
font-size:;
}

/*
REMOVE HEADER COLOR
You need this code to remove the default background colors from the header and override any related codes. You're supposed to use your own images or the default ones for the header, so this color is set to transparent so it won't get in the way. If you want the color back for some reason, remove this section.
*/
.header_title {
background-color: transparent !important;
}

/*
OTHER CODES
Stuff I had to add after site changes. You need this otherwise the headers won't be visible.
*/
tbody
{background-color: transparent;
background-image: none;}


/*
REMOVE HEADER TEXT
These codes remove the original text like "Completed" and "Currently Watching" from
each category on the list. Some people will want the text gone so they can have their own custom logos. But if you want the text back, you have to remove this whole section. It shouldn't affect the images in any way.
*/
.header_title {
color: gray !important;
color: transparent !important;
font-size: 1px !important;
font-size: 0px !important;
font-size: 0 !important;
font-size: 0pt !important;
}


/* REVIEW SECTION */


/* COVER AREA
The surrounding area containing each cover pic which appears when you point to a row (requires #more CSS).
Left and top adjust the position it appears on screen.
Control the height and width of the pic with height and width.
Remove only the border-radius: 25px 25px 25px 25px; lines to take the rounded corners away.
Increase height and width to make the pics bigger.
Delete border-style: solid; to remove the border.
*/

.hide {
background-color: 000000;
background-position: 50% 20% !important;
background-repeat: no-repeat !important;
border-color: FFFFFF;
border-radius: 0px 0px 0px 0px;
border-style: solid;
border-width: 5px;
display: block !important;
height: 450px;
left: 645px;
position: fixed;
top: 65px;
width: 234px;
padding: 79px 40px 10px 10px;
background-size: 250px !important;
visibility: hidden;
opacity: 0;
}

/* PREVIEW MSG ABOVE COVERS
Remove content: "preview"; to remove the PREVIEW text.
Change the text in quotations after content to what you want it to say above your cover pic.
Top and width controls the position of the text.
*/
.hide:before {
background: transparent;
color: white;
content: "Review";
padding-bottom: 5px;
position: absolute;
text-align: center;
width: 255px;
top: 5px;
border-radius: 25px 25px 0 0;
font-size: 17px;
}


/*
MINI REVIEW (HOVER TAG)
Move the area around with the left and top codes.
Adjust the surrounding area of the tags by adjusting the padding.
Control the height and width of the section with the height and width codes.

If your tags/mini-reviews aren't hovering correctly or you need help understanding or adjusting the background color code, see the bottom of the original tutorial:
http://myanimelist.net/forum/?topicid=563993
*/
td[class^='td']:nth-of-type(6) {
visibility: hidden;
opacity: 0;
position: fixed;
top: 482px;
left: 665px;
font-size: 14px;
width: 245px;
color: white !important;
z-index: 1;
background: transparent !important;
}

/* TAG TEXT COLOR*/
tr:hover td[class^='td']:nth-of-type(6) a {
color: white !important;
}


/* OTHER SETTINGS */
:hover + .hide , tr:hover td[class^='td']:nth-of-type(6){
visibility: visible;
opacity: 1;
}

/* REMOVE HEADER
Deletes the header Tags which isn't necessary.
*/
.table_header:nth-of-type(6) {
display: none !important;
}

/* REMOVE TAG EDIT BUTTON
Deletes the Tag's edit link which will is inaccessible with this setup, use the edit button by Animetitle to edit your tags.
*/
td:nth-of-type(6) small {
display: none;
}

/* GOOGLE CHROME FIX
Adjust this amount 50px at a time (more or less) if your columns are uneven in Chrome, until your columns are even.
*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
td[class^='td']:nth-of-type(2) {
width: 420px !important;}
}

tny.cz/464a7a3d



/* TOP BAR */

/*
COLOR OF THE ICONS
Change the color, and adjust the opacity for brighter color.
Remove the display: none to match the selected icon to the other icons.
*/
#mal\_cs\_listinfo:before, #mal\_cs\_links:before,
#mal\_cs\_otherlinks:before, #mal\_cs\_powered:before {
background: transparent;
opacity: .9;

}

/*
BORDER OF ICONS
If you're having trouble seeing the border bottom, lower the height by a pixel or two until you see it.

*/
#mal_cs_listinfo:before, #mal_cs_links:before, #mal_cs_otherlinks:before, #mal_cs_powered:before, #mal\_cs\_listinfo:before, #mal\_cs\_links:before,
#mal\_cs\_otherlinks:before, #mal\_cs\_powered:before {
border-color: ;
border-style: ;
border-width: ;
height: 32px !important;
}

/*
BUTTONS COLOR AND BORDER
Buttons within the hover menus, not the icons themselves.
Second code is for button color on hover.
*/
#mal_cs_listinfo a, #mal_cs_links a, #mal_cs_otherlinks a, #mal_cs_powered a img{
background-color: rgba(64, 60, 90, 0.6) !important;
border-color: transparent;
border-style: solid !important;
border-width: 1px !important;
}


#mal\_cs\_listinfo a:hover, #mal\_cs\_links a:hover, #mal\_cs\_otherlinks a:hover, #mal_cs_powered a img:hover {
background-color: #403C5A !important;
}



/*
COLOR OF HOVER MENUS AND SELECTED ICONS
Remove display none from the second code to match the colors of the selected icon to the icons above.
*/
#mal\_cs\_listinfo div, #mal\_cs\_links div, #mal\_cs\_otherlinks div,
#mal\_cs\_powered div, #mal\_cs\_powered dd, #mal\_cs\_powered a {
background-color: rgba(255, 255, 255, 0.6) !important;
}

#mal\_cs\_listinfo:hover:before, #mal\_cs\_links:hover:before,
#mal\_cs\_otherlinks:hover:before, #mal\_cs\_powered:hover:before,
#mal\_cs\_listinfo:hover:after, #mal\_cs\_links:hover:after,
#mal\_cs\_otherlinks:hover:after, #mal\_cs\_powered:hover:after {
display: none;
background-color: ;
opacity: .2;
}

/*
COLOR OF USERNAME (for visitors)
You don't see this username on the menus when you're logged in, log out to see it.
*/
#mal\_cs\_otherlinks strong a {
color: #333333 !important;
}

#mal\_cs\_otherlinks strong a:hover {
color: blue !important;
background-color: transparent !important;
}

/*
POSITION OF TOP BAR
Change to absolute if you want it to not scroll with the page.
*/
#mal\_control\_strip
{
position: fixed !important;
background-color: transparent !important;
background-image: url(none) !important;
}




/*
OTHER CODES
If you want to change out the icon images themselves, you can scroll down through the codes and find the background images and change them with your own.
*/

#mal\_cs\_listinfo, #mal\_cs\_links, #mal\_cs\_otherlinks, #mal\_cs\_powered {
-moz-box-sizing: border-box;
transition: all 0.4s ease 0s;
background: none no-repeat scroll 100% 0 transparent;
border: 0 none;
height: 0 !important;
overflow: hidden;
position: absolute;
right: 4px;
text-align: center;
top: 4px;
width: 150px;
z-index: 10;
}
#mal\_cs\_listinfo:hover, #mal\_cs\_links:hover, #mal\_cs\_otherlinks:hover, #mal\_cs\_powered:hover {
height: 200px !important;
padding-top: 32px;
width: 150px;
}
#mal\_cs\_listinfo div, #mal\_cs\_links div, #mal\_cs\_otherlinks div, #mal\_cs\_powered div, #mal\_cs\_powered dd {
transition: opacity 0.4s ease-in-out 0s;
border-radius: 3px 0 0 0;
font-size: 0 !important;
line-height: 0;
margin: 0 !important;
opacity: 0;
padding: 8px 0 0;
}
#mal\_cs\_listinfo:hover div, #mal\_cs\_links:hover div, #mal\_cs\_otherlinks:hover div, #mal\_cs\_powered:hover div, #mal\_cs\_powered:hover dd {
opacity: 1;
}
#mal\_cs\_listinfo div:nth-of-type(2), #mal\_cs\_links div:nth-of-type(2), #mal\_cs\_otherlinks div:nth-of-type(2), #mal\_cs\_powered div:nth-of-type(2) {
border-radius: 0 0 3px 3px;
padding: 4px 0 8px;
}
#mal\_cs\_listinfo a, #mal\_cs\_links a, #mal\_cs\_otherlinks a, #mal\_cs\_powered a {
background-color: rgba(64, 60, 90, 0.6);
border-radius: 3px 3px 3px 3px;
display: block;
font: 13px/17px arial,sans-serif;
margin: 4px 12px 0;
padding: 3px 0;
text-decoration: none;
}
#mal\_cs\_listinfo a:nth-of-type(1), #mal\_cs\_links a:nth-of-type(1), #mal\_cs\_otherlinks a:nth-of-type(1), #mal\_cs\_powered a:nth-of-type(1) {
margin-top: 0;
}

#mal\_cs\_listinfo strong a strong {
font-weight: normal;
}
#mal\_cs\_otherlinks strong {
color: #333333;
display: block;
font: bold 13px/17px arial,sans-serif !important;
padding: 0 4px 4px;
text-shadow: 0 1px 1px #FFFFFF;
}
#mal\_cs\_otherlinks strong a {
background: none repeat scroll 0 0 transparent !important;
border-color: transparent !important;
border-radius: 0 0 0 0;
color: #333333;
display: inline;
font: bold 13px/17px arial,sans-serif !important;
margin: 0;
padding: 0;
text-shadow: 0 1px 1px #FFFFFF;
}
#mal\_cs\_powered a {
border-radius: 3px 0 0 0 !important;
display: block !important;
margin: 0 !important;
opacity: 0;
padding: 8px 0 0 !important;
}
#mal\_cs\_powered:hover a {
opacity: 1;
}
#mal\_cs\_powered a img {
background: url("http://i.imgur.com/fGTjBC3.png") no-repeat scroll 50% 6px rgba(64, 60, 90, 0.6);
border-radius: 3px 3px 3px 3px;
display: block;
height: 0;
margin: 0 12px;
padding: 23px 0 0 126px;
width: 0;
}
#mal\_cs\_powered a img:hover {
background-color: #403C5A;
}
#mal\_cs\_powered #search {
border-radius: 0 0 3px 3px;
padding: 8px;
position: relative;
}
#mal\_cs\_powered #search #searchBox {
-moz-box-sizing: border-box;
border-color: #BCBCBC #D6D6D6 #D6D6D6;
border-radius: 2px 2px 2px 2px;
border-style: solid;
border-width: 1px;
color: #333333;
display: inline-block;
font-family: arial,sans-serif;
font-size: 13px;
height: 28px;
padding-left: 6px;
padding-right: 24px;
vertical-align: top;
width: 100%;
}
#mal\_cs\_powered #search #searchBox:hover, #mal\_cs\_powered #search #searchBox:focus {
border-color: #ACACAC #C6C6C6 #C6C6C6;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
}
#mal\_cs\_powered #search #searchListButton {
background: url("http://i.imgur.com/XqsilHp.png") no-repeat scroll 0 0 transparent;
border-radius: 3px 3px 3px 3px;
height: 0;
margin: 0;
padding: 16px 0 0 16px;
position: absolute;
right: 12px;
top: 14px;
width: 0;
}
#mal\_cs\_listinfo {
background-image: url("http://i.imgur.com/UXZxrWI.png");
right: 106px;
}
#mal\_cs\_listinfo:hover {
background-image: url("http://i.imgur.com/VcVVnod.png");
}
#mal\_cs\_links {
background-image: url("http://i.imgur.com/LpXWTzt.png");
right: 72px;
z-index: 9;
}
#mal\_cs\_links:hover {
background-image: url("http://i.imgur.com/oPfKrOl.png");
}
#mal\_cs\_otherlinks {
background-image: url("http://i.imgur.com/ogmX9qC.png");
right: 38px;
z-index: 8;
}
#mal\_cs\_otherlinks:hover {
background-image: url("http://i.imgur.com/EEGHkbF.png");
}
#mal\_cs\_powered {
background-image: url("http://i.imgur.com/ct4BVP5.png");
right: 4px !important;
z-index: 7;
}
#mal\_cs\_powered:hover {
background-image: url("http://i.imgur.com/TUUWtaj.png");
}
td#mal\_cs\_pic a img {
display: none;
}
#mal\_cs\_pic, #mal\_cs\_listinfo, #mal\_cs\_links {
border-right: 0 none !important;
}

#mal\_cs\_listinfo, #mal\_cs\_links, #mal\_cs\_otherlinks, #mal\_cs\_powered {
padding: 32px 0 0 !important;
}

#mal\_cs\_listinfo:before,
#mal\_cs\_links:before,
#mal\_cs\_otherlinks:before,
#mal\_cs\_powered:before {
z-index: 10 !important;
content: "";
right: 0 !important;
top: 0 !important;
width: 32px !important;
position: absolute !important;
border-radius: 4px;
}

#mal\_cs\_listinfo:after{
background-image: url(http://i.imgur.com/856wzPZ.png);
}
#mal\_cs\_links:after{
background-image: url(http://i.imgur.com/rwvRyux.png);
}
#mal\_cs\_otherlinks:after{
background-image: url(http://i.imgur.com/fbWr1K4.png);
}
#mal\_cs\_powered:after{
background-image: url(http://i.imgur.com/fKvpt1F.png);
}

#mal\_cs\_listinfo:after,
#mal\_cs\_links:after,
#mal\_cs\_otherlinks:after,
#mal\_cs\_powered:after {
z-index: 10 !important;
content: "";
right: 0 !important;
top: 0 !important;
width: 32px !important;
height: 32px !important;
position: absolute !important;
}

/* remove MAL logo */
#mal_cs_pic {
display: none;
}

#searchBox {
width: 128px !important;
margin-left: 1px;
}

#mal_cs_powered #search #searchListButton {
right: 15px !important;
top: 12px !important;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
#searchBox {
width: 96px !important;
}
}