@import "http://dl.dropbox.com/u/78340470/CSSforCatgirls.css";

@import "http://dl.dropbox.com/u/78340470/animetitle.css";

@import "http://dl.dropbox.com/u/78340470/MahouLayoutCSS/Topbar%20redux.css";


/*
HOW TO USE
Use and COMPLETE this simple tutorial if you never installed CSS, it only takes a few minutes:
http://myanimelist.net/forum/?topicid=200320


When you're done with the tutorial and can see the starter layout on your list, copy and paste this entire page of codes (including this part and the codes above and below) 
to your CSS edit box (the box titled Edit Advanced CSS File) replacing any other codes in the box. 
Save with the blue button at the bottom. It will put this premade layout on your list instead of the starter one from the tutorial! 


If the layout looks weird on your list after installing, you can try to alter your settings here.
Common solutions are to set Default Status Settings to Watching or All Anime, check or uncheck tags (make sure you save afterwards):
http://myanimelist.net/editprofile.php?go=listpreferences


If your list still has problems you can ask us about it here, or other questions:
http://myanimelist.net/forum/?topicid=200323


And you'll find further ways to customize your list here:
http://myanimelist.net/forum/?topicid=419405

*/


/*
MAIN BACKGROUND
*/
body {
background: url("http://i290.photobucket.com/albums/ll279/komonora/horriblesubs-sword-art-online-11-720p-mkv_snapshot_11-42_2012-09-15_13-49-202_zpsd59e3ed9.jpg");
background-size: cover;
background-attachment: fixed !important;
}


#inlineContent {
display: inline-block !important;
height: 50px !important;
left: 0px !important;
margin: auto !important;
position: fixed !important;
right: 0 !important;
top: 0 !important;
width: 1600px !important;
z-index: -1 !important;
}

/*
TITLE
The List header which by default says My Anime List
can be changed out here.
*/

#list_surround {
font-size: 81.25%;
line-height: 1;
margin: 0 auto;
padding-bottom: 10px;
padding-top: 30px;
width: 1000px;
}



/*
FONT
Font used across the whole list.
*/
body {
font-family: arial;
}


/*
LINK COLOR
*/
a {
-moz-transition: all 0.25s ease-in-out 0s;
-webkit-transition: all 0.25s ease-in-out 0s;
-o-transition: all 0.25s ease-in-out 0s;
transition: all 0.25s ease-in-out 0s;
color: #FFFFFF;
text-decoration: none;
text-shadow: none;
}
a:hover {
color: #000000;
text-shadow: 0 1px rgba(255, 255, 255, 0.15);
}



/* CATEGORY LINKS */
.status_not_selected, .status_selected {
border: 0 none !important;
height: auto !important;
padding: 0 8px;
text-align: center !important;
width: 16.667% !important;
}
.status_not_selected a, .status_selected a {
background-color: rgba(0, 0, 0, 0.4);
border-color: rgba(255, 255, 255, 0.5);
border-radius: 2px 2px 2px 2px;
border-style: solid;
border-width: 1px;
color: #FFFFFF;
display: block !important;
font-weight: bold;
padding: 20px;
text-shadow: 0 1px rgba(0, 0, 0, 0.1);
}
.status_selected a {
background-color: rgba(255, 255, 255, 0.5);
border-color: rgba(255, 255, 255, 0.5);
}
.status_not_selected a:hover {
background-color: rgba(0, 0, 0, 0.6);
border-color: #FFFFFF;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
text-shadow: 0 1px rgba(0, 0, 0, 0.3);
}
.status_selected a:hover {
background-color: rgba(255, 255, 255, 0.7);
border-color: #FFFFFF;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
text-shadow: 0 1px rgba(0, 0, 0, 0.3);
}



/* HEADER */
.table_header {
background-color: rgba(255, 255, 255, 0.2);
}
.table_header:first-of-type {
border-radius: 3px 0 0 0;
}
.table_header:nth-of-type(2) {
text-align: left;
}
.table_header:last-of-type {
border-radius: 0 3px 0 0;
}



/* ROWS COLOR */
.td1 {
-moz-transition: all 0.25s ease-in-out 0s;
-webkit-transition: all 0.25s ease-in-out 0s;
-o-transition: all 0.25s ease-in-out 0s;
transition: all 0.25s ease-in-out 0s;
background-color: rgba(51,51,51, 0.1);
}
.td2 {
-moz-transition: all 0.25s ease-in-out 0s;
-webkit-transition: all 0.25s ease-in-out 0s;
-o-transition: all 0.25s ease-in-out 0s;
transition: all 0.25s ease-in-out 0s;
background-color: rgba(0, 0, 0, 0.1);
}



/* ROWS HOVER */
tr:hover [class^="td"] {
background-color: rgba( 255, 255, 255, 0.6);
}
.td1:nth-of-type(2), .td2:nth-of-type(2) {
text-align: left;
}



/* ROW FONT SIZE TRANSITION (FIREFOX ONLY) */
noindex:-moz-any-link, tr:hover td.td1, tr:hover td.td2 {
font-size: 15px;
}



/* LIST SETTINGS */
.table_header, .td1, .td2, .status_selected, .status_not_selected, .category_totals {
border: 0;
padding: 4px;
text-align: center;
vertical-align: middle;
}
.table_header, .td1, .td2, .category_totals {
line-height: 30px;
}
.borderRBL{
line-height: normal !important;
}
[cellspacing="0"] {
line-height: 17px;
}
[class^="header_"] +{
border-collapse: separate !important;
}



/* CATEGORY TOTALS */
.category_totals {
-moz-transition: all 0.25s ease-in-out 0s;
-webkit-transition: all 0.25s ease-in-out 0s;
-o-transition: all 0.25s ease-in-out 0s;
transition: all 0.25s ease-in-out 0s;
background-color: rgba(72, 64, 87, 0);
border-radius: 0 0 3px 3px;
color: rgba(0, 0, 0, 0);
text-align: center;
}
.category_totals:hover {
background-color: rgba(0, 0, 0, 0.8);
color: #FFFFFF;
}



/* HEADER TEXT AND DIMENSIONS */
[class^="header_"] * {
font-size: 19px;
height: 60px;
line-height: 24px;
padding-bottom: 4px;
text-align: right;
vertical-align: bottom;
}
.header_title {
border-radius: 4px 4px 4px 4px;
display: inline-block;
font-style: italic;
height: auto;
padding: 0 8px 0 0;
color: #FFFFFF;
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
}



/* BOTTOM OF LIST */
#grand_totals {
background-color: rgba(0, 0, 0, 0);
border: 0 none;
border-radius: 3px 3px 3px 3px;
color: #FFFFFF;
line-height: 20px;
min-height: 20px;
padding: 8px;
text-align: center;
vertical-align: middle;
}
#copyright {
background-color: rgba(180, 32, 48, 0.6);
border-radius: 3px 3px 3px 3px;
color: #EEEEEE;
line-height: 17px;
margin-top: 10px;
padding: 8px;
text-align: center;
}
#copyright:after {
content: " CSS by Kyouhansha. Edits by TheHolyPotato. Google 'Shishio's Custom Lists' for more designs and info.";
}

/*
CURRENTLY WATCHING/READING HEADER
This is the header above currently watching/reading. Increase the height if your image doesn't fit the header. Lower the margin-bottom below zero to move it behind the list.
*/
.header_cw {
background-image:url(http://i50.tinypic.com/n4uxr8.png);
background-position: 250px 0px;
height: 110px;
margin-bottom: 0px;
background-color: transparent;
background-repeat: no-repeat;
color:;
font-family:;
font-size:;
}



/*
COMPLETED HEADER
This is the header above completed animes and manga. Increase the height if your image doesn't fit the header. Lower the margin-bottom below zero to move it behind the list.
*/
.header_completed {
background-image:url(http://i46.tinypic.com/30cruph.png);
background-position: 230px 0px;
height: 110px;
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 height if your image doesn't fit the header. Lower the margin-bottom below zero to move it behind the list.
*/
.header_onhold {
background-image:url(http://i49.tinypic.com/wafymq.png);
background-position: 290px 0px;
height: 100px;
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 height if your image doesn't fit the header. Lower the margin-bottom below zero to move it behind the list.
*/
.header_dropped {
background-image:url(http://i49.tinypic.com/qxjamt.png);
background-position: 250px 0px;
height: 110px;
margin-bottom: 0px;
background-color: transparent;
background-repeat: no-repeat;
color:;
font-family:;
font-size:;
}



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

the list.
*/
.header_ptw {
background-image:url(http://i46.tinypic.com/ot223n.png);
background-position: 140px 0px;
height: 100px;
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;}

.header_title {
color: gray !important;
color: transparent !important;
font-size: 1px !important;
font-size: 0px !important;
font-size: 0 !important;
font-size: 0pt !important;
}

/*
ROWS TRANSITION
This controls the part where pics appear on your rows.
It controls the timing. You can change the numbers.

The first number in each row by default is .5s, this is a half second.
It controls how fast the pic window "opens".
The second number is the time it takes the window to begin opening.
By default its set to .1s, a tenth of a second.
If you changed it to 2s, it would take two seconds for the window to open.

You'll need to change all the rows timings!
They change different browser's timings.
*/
.td1, .td2 {
transition: line-height .5s ease .1s;
-o-transition: line-height .5s ease .1s;
-moz-transition: line-height .5s ease .1s;
-webkit-transition: line-height .5s ease .1s;
}

.td1, .td2 {
line-height: 35px;
}


/*
LIST ROWS HEIGHT ON HOVER
This is the height of the rows when you put your cursor on them.
*/
tr:hover .td1, tr:hover .td2 {
line-height: 340px;
}

/*
AIRING
*/
.animetitle + small {
position: relative;
line-height: 1px !important;
}

td:nth-of-type(5) {
line-height: 20px !important;
}