/* Self-explanatory */
BODY {
    color: #000000;
    font-size: 16px;
    font-family: Verdana, Arial;
    background: url("http://i.imgur.com/vvo5tbc.png") no-repeat fixed;
	background-position: top left;
	background-size: cover;
	z-index:-1;
}
body:after {
    content: url("http://i.imgur.com/ssqEqvO.png");
    top: 680px;
	right: 1100px;
    z-index: 3;
	position: fixed;
}
/* Determines the positioning of your list */
#list_surround {
    margin-right: 20px;
	float: right;
    width: 960px;
}
/* All links on your list */
a, a:visited {
    color: #0F141A;
    text-decoration: none;,
}
a:hover{
    color: #3D5266;
    text-decoration: underline;
}
/* Alternating row color 1 */
.td1 {
    filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
    color: #0F141A;
    border: 0px solid transparent;
	border-width:0px;
    padding: 6px;
	height:30px;
    background-color: #99CCFF;
}
/* Alternating row color 2 */
.td2 {
    filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
    color: #0F141A;
    border: solid transparent;
	border-width:0px;
    padding: 6px;
	height:30px;
    background-color: #A3D1FF;
}
/* This represents the "Anime Title", "Score", "# Eps" columns */
.table_header {
    filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
    color: #0F141A;
    background-color: #A3D1FF;
    padding: 6px;
	font-size:12px;
}
.table_header:nth-of-type(2){
	/*padding-left:31px;*/
	font-size:16px;
}
/* headerLink represents the color of the links inside the_header */
.table_headerLink, .table_headerLink:Hover, .table_headerLink:Visited  {
    color: #0F141A;
}
/* 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: 11px;
    font-family: Verdana, Arial;
}
/* Which 'status' up top is selected? */
.status_selected {
    filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
    color: #0F141A;
    border: 0px solid transparent;
    padding: 2px;
    background-color: #99CCFF;
}
.status_not_selected {
    filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
    color: #0F141A;
    border: 0px solid transparent;
    padding: 2px;
    background-color: #A3D1FF;
}
.status_selected a, .status_not_selected a{
   color:#0F141A;
}
/* Header classes for Currently Watching, Completed, Dropped, etc... */
.header_cw {
}
.header_completed {
}
.header_onhold {
}
.header_dropped {
}
.header_ptw {
}
.header_title {
	filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
	padding-left: 36px;
    font-size: 36px;
    font-weight: bold;
	color: #0F141A;
	background-color:#99CCFF;
	border-top: 25px solid #99CCFF;
	border-radius: 25px 25px 0px 0px;
}
.category_totals {
	filter: alpha(opacity=90);
    -moz-opacity: 0.9;
    opacity: 0.9;
	color: #0F141A;
	text-align: center;
	border-bottom: 6px solid #99CCFF;
	border-radius: 0px 0px 25px 25px;
	background-color: #99CCFF;
}
#grand_totals {
    text-align: center;
	color: #0F141A;
	border: 6px solid #99CCFF;
	border-radius: 25px 25px 25px 25px;
	background-color: #99CCFF;
}
#copyright{
	margin: auto;
	color: #0F141A;
	border: 6px solid #99CCFF;
	border-radius: 25px 25px 25px 25px;
	background-color: #99CCFF;
}
/* header_al is thesurrounding "User's Anime List" at the top */
.header_al {
    font-weight: bold;
    font-size: 16px;
}
/* header_al_links is the width your "Profile" and "MyAnimeList home" links */
.header_al_links {
}
/* controls what styles you can give to all the anime titles in your list */
a.animetitle , a.animetitle:visited{
    color:#0F141A;
	font-weight: bold;
    text-decoration: none;
	/*padding-left:25px;*/
}
a.animetitle:hover {
    color: #3D5266;
    text-decoration: underline;
}
/* ROW HOVER */
tr:hover [class^=td] a.animetitle,
tr:hover [class^=td] a,
tr:hover [class^=td] a:visited,
tr:hover [class^=td] a:hover{
	color:#0F141A;
	-moz-transition: .3s ease;
	-webkit-transition: .3s ease;
	-o-transition: .3s ease;
}
tr:hover [class^=td]{
	background-color: rgba(255, 255, 102, 0.9)  !important;
	color:#0F141A;
	-moz-transition: .3s ease;
	-webkit-transition: .3s ease;
	-o-transition: .3s ease;
}
td[class^='td']:nth-of-type(1), .table_header:nth-of-type(1){
	/*display:none;*/
	font-size:12px;
}
td[class^='td']:nth-of-type(4){
	font-size: 12px;
}
/* MINI REVIEW (HOVER TAG) */
	td[class^='td']:nth-of-type(6) {
	display:none;
	opacity: 1;
	position: fixed;
	top: 524px;
	right: 1000px;
	font-size: 12px;
	height:auto;
	width: 263px;
	border: 25px solid #99CCFF;
	border-top: 0px solid transparent;
	border-radius: 0px 0px 25px 25px;
	background-color: #99CCFF !important;
	z-index:1;
}
/* TAG TEXT COLOR */
	tr:hover td[class^='td']:nth-of-type(6) a {
	color: #0F141A !important;
}
/* 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), td.table_header:nth-of-type(2) {
		width: 800px !important;
	}
}
/* condition for screen size minimum of 1255px */
@media (min-width:1255px) {
	/* Cover art setup */
	:hover + .hide {
		opacity: 1;
		width:275px; height:400px;
		top:100px; right: 1000px;
		background-size: cover !important;
		background-position: center center !important;
		background-repeat: no-repeat !important;
		background-color: #99CCFF;
		border: 25px solid #99CCFF;
		border-bottom: 25px solid transparent;
		border-radius: 25px 25px 25px 25px;
		display: block !important;
		position: fixed;
		z-index:0;
	}
	.hide:before {
		background: transparent;
	}
}
/* Used to remove the more button (which no longer works after using the code above to show covers).  */
#list_surround table:nth-of-type(n+4):hover td:nth-of-type(3),
#list_surround table:nth-of-type(n+4):hover td:nth-of-type(4), 
#list_surround table:nth-of-type(n+4):hover td:nth-of-type(5), 
#list_surround table:nth-of-type(n+4):hover td:nth-of-type(6), 
#list_surround table:nth-of-type(n+4):hover td:nth-of-type(7),
#list_surround table:nth-of-type(n+4):hover td:nth-of-type(8) {
    display: table-cell;
}
#list_surround div small a:first-of-type{
    visibility:visible;
	margin-right:-100px;
}
#list_surround div small{
    visibility:hidden;
}
.animetitle + small {
    visibility: visible !important;
}
#list_surround a[href*="http://myanimelist.net/panel.php?go=edit"],
#list_surround a[href*="http://myanimelist.net/editlist.php?type="], 
#list_surround a[href*="http://myanimelist.net/panel.php?go=add"] {
    visibility: visible !important;
    margin-right: 10px
}
.td1:nth-of-type(6) small, .td2:nth-of-type(6) small,
.td1:nth-of-type(5) small, .td2:nth-of-type(5) small,
.td1:nth-of-type(4) small, .td2:nth-of-type(4) small {
    visibility: visible !important;
}
.td1:nth-of-type(6) small:hover, .td2:nth-of-type(6) small:hover,
.td1:nth-of-type(5) small:hover, .td2:nth-of-type(5) small:hover,
.td1:nth-of-type(4) small:hover, .td2:nth-of-type(4) small:hover{
    text-decoration: underline;
}