@import url(https://malcat-gen.appspot.com/series?preset=more);
@import url(https://fonts.googleapis.com/css?family=Advent+Pro);
* {
    text-decoration: none;
}
body {
    background-attachment: fixed;
    background-clip: border-box;
    background-color: transparent;
    background-image: url("http://i43.tinypic.com/2wf5ksj.jpg");
    background-position: 24% 8%;
    background-repeat: no-repeat no-repeat;
    background-size: cover;
    font-family: advent;
}
#inlineContent {
    background-image: url("http://i39.tinypic.com/2mwiecj.png");
    background-position: 0 0;
    background-repeat: no-repeat no-repeat;
    display: inline-block !important;
    height: 188px;
    margin: auto !important;
    position: fixed;
    top: 0 !important;
    width: 700px !important;
    z-index: 4 !important;
}
#list_surround {
    background-attachment: fixed;
    background-position: 24% 0;
    background-repeat: no-repeat no-repeat;
    font-size: 15px;
    height: 250px;
    left: 15% !important;
    line-height: 1;
    margin: 0 auto;
    padding-bottom: 13px;
    padding-top: 133px;
    position: absolute;
    width: 700px;
    z-index: 0;
}
a {
    color: white;
    text-shadow: none;
}
tr:hover td.td1 a, tr:hover td.td1, tr:hover td.td2 a, tr:hover td.td2 {
    color: red;
    font-weight: bold;
    transition: all 0.4s ease 0s;
}
a:hover {
    color: #3167A9 !important;
    text-shadow: 0 1px rgba(255, 255, 255, 0.15);
}
.table_header {
}
.table_header:first-of-type {
    border-radius: 20px 0 0 0;
}
.table_header:nth-of-type(2) {
    text-align: left;
}
.table_header:nth-of-type(5) {
    border-bottom-right-radius: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 20px;
}
.table_header, .category_totals {
    background-color: #000000;
    border: 0 none;
    opacity: 1;
    padding: 4px;
    text-align: center;
    vertical-align: top;
}
.td1, .td2 {
    background-image: url("http://i40.tinypic.com/opuveu.png");
    padding: 4px;
}
.td1:nth-of-type(2), .td2:nth-of-type(2) {
    text-align: left;
}
.table_header:nth-of-type(6) {
    display: none;
    width: 0;
}
small {
    color: red;
    font-weight: bold;
}
.table_header, .td1, .td2, .category_totals {
    color: grey;
}
.borderRBL {
    line-height: normal !important;
}
[cellspacing="0"] {
    line-height: 17px;
}
.category_totals {
    background-color: black;
    border-radius: 0 0 12px 12px;
    text-align: center;
}
.category_totals:hover {
    background-color: #C41E0E;
    color: #FFFFFF;
}
[class^="header_"] * {
    background-repeat: no-repeat no-repeat;
    font-size: 0;
    height: 200px;
    line-height: 24px;
    padding-bottom: 0;
    text-align: right;
    vertical-align: bottom;
}
.header_title {
    border-radius: 4px 4px 4px 4px;
    color: #FFFFFF;
    display: inline-block;
    font-style: italic;
    height: auto;
    padding: 0 8px 0 0;
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15);
}
#grand_totals {
    background-color: rgba(234, 203, 82, 0.8);
    border: 0 none;
    border-radius: 3px 3px 3px 3px;
    color: White;
    line-height: 20px;
    min-height: 20px;
    padding: 8px;
    text-align: center;
    vertical-align: middle;
}
.status_not_selected {
    opacity: 0.7;
    right: -183px !important;
    transition: all 0.4s ease 0s;
}
.status_not_selected:hover {
    color: transparent;
    opacity: 1;
    right: 3px !important;
    transition: all 0.4s ease 0s;
}
.status_selected a, .status_not_selected a, .status_selected:hover a, .status_not_selected:hover a {
    color: transparent;
    display: block;
    height: 100px;
    opacity: 0;
    width: 271px;
}
.status_selected {
    display: block;
}
.status_not_selected {
    display: block;
}
.header_cw {
    background-color: transparent;
    background-image: url("http://i41.tinypic.com/qp4ewj.png");
    background-position: 50% 0;
    background-repeat: no-repeat no-repeat;
    height: 200px;
}
.header_completed {
    background-color: transparent;
    background-image: url("http://i41.tinypic.com/2iha269.png");
    background-position: 50% 0;
    background-repeat: no-repeat no-repeat;
    height: 200px;
    z-index: 0;
}
.header_onhold {
    background-color: transparent;
    background-image: url("http://i39.tinypic.com/5fhwkz.png");
    background-position: 50% 0;
    background-repeat: no-repeat no-repeat;
    height: 200px;
}
.header_dropped {
    background-color: transparent;
    background-image: url("http://i42.tinypic.com/f2n50y.png");
    background-position: 50% 0;
    background-repeat: no-repeat no-repeat;
    height: 200px;
}
.header_ptw {
    background-color: transparent;
    background-image: url("http://i39.tinypic.com/2ahh7t.png");
    background-position: 50% 0;
    background-repeat: no-repeat no-repeat;
    height: 200px;
}
#list_surround .status_selected, #list_surround .status_not_selected {
    background-attachment: scroll;
    background-color: transparent;
    background-image: url("http://i41.tinypic.com/2vxnkhh.png");
    background-position: 0 0;
    background-repeat: no-repeat no-repeat;
    border: 2px solid black !important;
    border-radius: 20px 0 0 0;
    display: block;
    height: 83px;
    padding: 0;
    position: fixed;
    right: -3px;
    top: 274px;
    width: 271px;
}
#list_surround .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected {
    background-attachment: scroll;
    background-color: transparent;
    background-image: url("http://i42.tinypic.com/m7coxw.png");
    background-position: 0 0;
    background-repeat: no-repeat no-repeat;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    top: 360px;
}
#list_surround .status_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected {
    background-attachment: scroll;
    background-color: transparent;
    background-image: url("http://i41.tinypic.com/10pww9e.png");
    background-position: 0 0;
    background-repeat: repeat repeat;
    top: 446px;
}
#list_surround .status_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected {
    background-attachment: scroll;
    background-color: transparent;
    background-image: url("http://i40.tinypic.com/2mh96c6.png");
    background-position: 0 0;
    background-repeat: no-repeat no-repeat;
    top: 531px;
}
#list_surround .status_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected {
    background-attachment: scroll;
    background-color: transparent;
    background-image: url("http://i43.tinypic.com/33nvsjo.png");
    background-position: 0 0;
    background-repeat: repeat repeat;
    top: 617px;
}
#list_surround .status_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_selected + .status_not_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_selected + .status_not_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_selected + .status_not_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_selected, #list_surround .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected + .status_not_selected {
    background-attachment: scroll;
    background-color: transparent;
    background-image: url("http://i41.tinypic.com/2r2q7ue.png");
    background-position: 0 0;
    background-repeat: no-repeat no-repeat;
    border-bottom-left-radius: 20px !important;
    top: 702px;
    width: 271px;
}
/* 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-size: cover;
left: 1%;
top: 150px;
height: 300px;
width: 201px;
border-style: solid;
border-color: white;
border-top: 1px solid white;;
border-left: 1px solid white;
border-right: 1px solid white;
border-bottom: 1px solid white;
border-radius: 25px 25px 25px 25px;
background-color: rgba(0, 5, 0, 0.75);
background-position: center 50% !important;
background-repeat: no-repeat !Important;
display: block !important;
position: fixed;
visibility: hidden;
opacity: 0;
transition: all 0.4s ease 0s;
}

/* 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: "";
padding-bottom: 5px;
position: absolute;
text-align: center;
width: 225px;
top: -25px;
border-radius: 25px 25px 0 0;
}


/*
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: 462px;
left: 0px;
background-color: rgba(20, 30, 255, 0.85) !important;
border-color: white;
border-radius: 25px 25px 25px 25px;
border-style: solid;
border-width: 1px;
font-size: 12px;
height: auto;
width: 184px;
padding: 12px 17px 16px 23px;
color: white !important;
z-index: 1;
transition: all 0.4s ease 0s;
}

/* 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 TABLE HEADER
Deletes the table 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 if your columns are uneven in Chrome. 
*/
@media screen and (-webkit-min-device-pixel-ratio:0) {
td[class^='td']:nth-of-type(2) {
width: 420px !important;}
}
#copyright, #copyright:hover {
    background-color: #C41E0E;
    border-radius: 5px 5px 5px 5px;
    bottom: 0;
    color: white;
    padding: 2px;
    width: 100%;
}
#copyright:hover {
}
#copyright:before {
    color: white;
    content: " Design by SylakentH, got the idea from Stark700s layout. Greets!";
    font-size: 12px;
    padding-right: 10px;
}
#copyright:after {
    color: gold;
    content: " ";
    padding-left: 20px;
}
#copyright a {
}
a[href=""], [href=""]
{
   background-attachment: scroll;
    background-color: transparent;
    background-image: url("http://i41.tinypic.com/jsejw1.png");
    background-position: left top;
    background-repeat: no-repeat;
    padding-bottom: 5px !important;
    padding-left: 29px;
}
/*
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;
}



#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;
}
}