/****************************************/
/* Layout created by Monsterguy (2013) */
/****************************************/

/* ---Anime Cover Image - THOSE ARE SPECIAL COVER CODES !!! --- */
@import url(http://dl.dropbox.com/u/78192465/MyAnimeList/Kore%20wa%20Zombie%20Desuka/Covers.css);

/* ---Fonts--- */
@import url("http://fonts.googleapis.com/css?family=Tangerine");
@import url("http://fonts.googleapis.com/css?family=Lemon");


/*
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

*/


/************/
/* BODY */
/************/

body {
background-attachment:fixed !important;
background-image: url(http://4otaku.org/images/booru/resized/9e8769db11595da8a84b4ed4903bcfca.jpg), url(https://dl.dropbox.com/u/144008148/Premade/Request_Hanekawa/layout/rsz_hanekawa_tsubasa_cat___by_jackchrist-d5ck0sv.png), url(https://dl.dropbox.com/u/144008148/Premade/Request_Hanekawa/layout/Desktop-background-wallpaper-blue-black-gradient-vizfact-dot-com_2.png);
background-position:left bottom, 98% 100%, 100% 20%;
background-repeat:no-repeat;
background-size: 75% 100%, 25% 80%, cover;
color: white !important;
/* ---CURSOR --- */
cursor:url(https://dl.dropbox.com/u/144008148/Premade/Request_Hanekawa/layout/25112615OLKUIATy2.png) 1 2,auto !important;
}

/************/
/* BANNER */
/************/
body:before {
position:absolute;
display:block !important;
top:40px;
left:250px;
width:300px;
height: 50px;
content:"";
margin-bottom:0px;
background-color: rgba(0, 0, 0, 0.6);
background-image:url(http://i44.tinypic.com/15s9esp.jpg);
/*background-image:url(http://i41.tinypic.com/34nh0e9.jpg);*/
background-repeat: no-repeat;
background-size:300px 50px;
background-position: center center;
z-index: -1;
}

/*************/
/* List Area */
/*************/
#list_surround{
left:0px;
width:75%;
z-index:-1;
padding-bottom: 50px;
padding-top: 250px;
}

/*
HEADER COLOR AND FONT
*/

.header_title {
background-color: rgba(115, 136, 183, 0.6);
color: #EBCF9E;
font-family: "Tangerine";
font-size:40px;
border-radius: 20px 20px 0px 0px;
font-weight: 700;
text-align: center;
text-shadow: 3px -1px 5px #0C0C0C;
}


/*
SUB-HEADERS BACKGROUND COLOR COLOR
Below each main header is the sub-header which says Score, Episodes, Tags, etc.
*/

.table_header {
background-color: rgba(0, 0, 0, 0.8);
font-family: "Lemon";
color:white !important;
font-weight:normal !important;
font-size: 14px !important;
}

/* --- TABELE'S BACKGROUND --- */

a {
color: white;
text-decoration:none;
}

.td1, .td2{
background-color: rgba(0, 0, 0, 0.6);
color: white !important;
}

/* --- TABELE ROW'S HIGHLIGHT --- */

tr:hover [class^="td"] {
background-color:rgba(255,255,255,0.6);
transition: all 0.25s ease-in-out 0s ;
-o-transition: all 0.25s ease-in-out 0s ;
-moz-transition: all 0.25s ease-in-out 0s ;
-webkit-transition: all 0.25s ease-in-out 0s ;
}


#list_surround tbody:hover td[class^='td']:first-child {
border-radius: 5px 0 0 5px;
-o-border-radius: 5px 0 0 5px;
-moz-border-radius: 5px 0 0 5px;
-webkit-border-radius: 5px 0 0 5px;
}

#list_surround tbody:hover td[class^='td']:last-child {
border-radius: 0 5px 5px 0;
-o-border-radius: 0 5px 5px 0;
-moz-border-radius: 0 5px 5px 0;
-webkit-border-radius: 0 5px 5px 0;
}

#list_surround tr:hover .td1, #list_surround tr:hover .td2, #list_surround tr:hover .td1 a, #list_surround tr:hover .td2 a {
font-weight:bold;
color: black !important;
text-shadow: -1px -1px 3px rgb(102,255,51), 1px 1px 3px rgb(102,255,51);
-webkit-transition: all 0.25s ease-in-out;
-moz-transition: all 0.25s ease-in-out;
-o-transition: all 0.25s ease-in-out;
-ms-transition: all 0.25s ease-in-out;
transition: all 0.25s ease-in-out;
}

#list_surround tr:hover .animetitle + small{
display:none;
}

a:hover {
text-decoration:underline !important;
}


/*******************/
/* Category Totals */
/*******************/
.category_totals{
background-color: rgba(0,0,0,0.5);
border-color: rgba(255,255,255,0.25);
color: #fff;
font-weight: bold;
text-shadow: orange 1px 1px 2px,cyan -1px -1px 2px;
text-align: center;
border-radius: 0px 0px 20px 20px;
}

/*********************************/
/* Text displaying global totals */
/*********************************/
#grand_totals{
color: #fff;
font-size: 17px;
font-weight: bold;
text-shadow: #c51 -1px -1px 3px, #c51 1px 1px 3px, #c51 1px -1px 4px, #c51 -1px 1px 3px;
/* The following line makes it ALL-CAPS */
text-transform: uppercase;
text-align: center;
padding-bottom: 30px;
}

/*************/
/* Copyright */
/*************/

#copyright{
background-color: rgba(0, 0, 255, 0.8);
border-radius: 20px 20px 20px 20px;
border-color: rgba(255,255,255,0.25);
}

#copyright:before {
content: "Custom CSS by Monsterguy. Google 'Shishio's Custom Lists' for more designs and info.";
background-color: rgba(0,0,0,0.6);
display:block !important;
border-radius: 80px 80px 0px 0px;
padding: 0px 0 0 0;
margin-top:0px;
}

/* Modifying the text color in copyright section */
#copyright{
color: orange;
}

/******************/
/* DVD covers */
/******************/

#list_surround table:nth-of-type(n+4) tbody:hover .animetitle:after {
content: '';
background-color: white;
position: fixed !important;
display: block !important;
top:70px;
/*right:50px !important;*/
right:5% !important;
width:200px !important;
height:300px;
margin-top: -26px !important;
background-repeat: no-repeat !important;
background-size: 100% 100% ;
border: ridge 5px deepskyblue;
border-radius: 10px;
-o-border-radius: 10px;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
z-index: 25;
}


/***********************************************************/
/* ----------edit tag after you click on it------------- */
/***********************************************************/

input.inputtext, textarea.textarea, textarea.inputtext {
position:fixed;
display: block !important;
width: 270px;
height: 100px;
right: 4px;
bottom: 30px;
padding: 8px 8px 150px 8px;
z-index: 26;
}

/*-----Changes "Tags" writing (the number 6 indicates which row Tags are in !!!) to what other name you desire (write new text under "content")----- */

.table_header:nth-of-type(6){
font-size: 0 !important}


.table_header:nth-of-type(6):before{
content: "Comments";
font-weight:bold !important;
font-family: "Lemon";
color:white !important;
font-size: 14px !important;
}


/* ---MORE function--- */

.borderRBL {
color:#00FFFF !important;
}

.borderRBL:hover {
font-weight:normal !important;
color:rgb(255,255,255) !important;
text-align: center;
}

/* ---text like "Aring"--- */

#list_surround .animetitle + small {
color:#FF6600;
}

/*****************/
/* ---CURSOR --- */
/*****************/

a:hover,a:visited:hover {
cursor:url(https://dl.dropbox.com/u/144008148/Premade/Request_Hanekawa/layout/25112615OLKUIATy%282%29.png) 1 2,auto !important;
transition:width 2s, height 2s;
-moz-transition:width 2s, height 2s, -moz-transform 2s; /* Firefox 4 */
-webkit-transition:width 2s, height 2s, -webkit-transform 2s; /* Safari and Chrome */
-o-transition:width 2s, height 2s, -o-transform 2s; /* Opera */
-moz-transition-delay:2s;
-webkit-transition-delay:2s;
-o-transition-delay:2s;


transform:rotate(360deg);
-moz-transform:rotate(360deg); /* Firefox 4 */
-webkit-transform:rotate(360deg); /* Safari and Chrome */
-o-transform:rotate(360deg); /* Opera */
}


/* ---------- TOP-BAR RESTYLING ---------- */

#mal_control_strip{
background-color: transparent !important;
position:fixed;
top: 0;
z-index: 25;
}

/* -------- Setting top bar's background---------- */
#mal_control_strip
{
background-size: 100% 100% !important;
background-image: url(http://i.imgur.com/NWqnO.png) !important;
z-index: 25;
}

/* ---------- BAR AT BOTTOM ---------- */

/* Setting a position */
#list_surround > table:first-of-type {
bottom: 0;
margin-left: -20px;
position: fixed;
width: 1000px;
}

/* Setting elements to display pure image */
#list_surround > table:first-of-type td{
background-color: transparent;
border-width: 0 !important;
}

.status_not_selected, .status_selected{
border-width: 0 !important;
padding: 0 !important;
width: auto !important;
}

.status_not_selected > a, .status_selected > a{
color: transparent !important;
content: none;
display: block;
height: 30px;
width: 150px;
}

/* Override size for wider parts */
.status_not_selected > a[href*="status=1"],.status_selected > a[href*="status=1"],.status_not_selected > a[href*="status=7"], .status_selected > a[href*="status=7"]{
width: 200px;
}

/* Currently watching */
.status_not_selected > a[href*="status=1"]{background-position: 0px 0px}
.status_not_selected > a[href*="status=1"]:hover{background-position: 0px 30px}
.status_not_selected > a[href*="status=1"]:active, .status_selected > a[href*="status=1"]{background-position: 0px 60px}

/* Completed */
.status_not_selected > a[href*="status=2"]{background-position: -200px 0px}
.status_not_selected > a[href*="status=2"]:hover{background-position: -200px 30px}
.status_not_selected > a[href*="status=2"]:active, .status_selected > a[href*="status=2"]{background-position: -200px 60px}

/* On Hold */
.status_not_selected > a[href*="status=3"]{background-position: -350px 0px}
.status_not_selected > a[href*="status=3"]:hover{background-position: -350px 30px}
.status_not_selected > a[href*="status=3"]:active, .status_selected > a[href*="status=3"]{background-position: -350px 60px}

/* Dropped */
.status_not_selected > a[href*="status=4"]{background-position: -500px 0px}
.status_not_selected > a[href*="status=4"]:hover{background-position: -500px 30px}
.status_not_selected > a[href*="status=4"]:active, .status_selected > a[href*="status=4"]{background-position: -500px 60px}

/* Plan to watch */
.status_not_selected > a[href*="status=6"]{background-position: -650px 0px}
.status_not_selected > a[href*="status=6"]:hover{background-position: -650px 30px}
.status_not_selected > a[href*="status=6"]:active, .status_selected > a[href*="status=6"]{background-position: -650px 60px}

/* All Anime */
.status_not_selected > a[href*="status=7"]{background-position: -800px 0px}
.status_not_selected > a[href*="status=7"]:hover{background-position: -800px 30px}
.status_not_selected > a[href*="status=7"]:active, .status_selected > a[href*="status=7"]{background-position: -800px 60px}



/* ---Configures a CSS sprite for the bar at the bottom--- */

.status_not_selected a, .status_selected a{
background-image: url('http://i.imgur.com/rSgqF.png');
}