/* Library 100 top 500 list page */
 table.wcf500,table.wcf500 th,table.wcf500 td{
    border-style:solid;
    border-color:#BBBCBC
}
 table.wcf500{
    width:100%;
    border-width:0;
    margin-bottom:24px
}
 table.wcf500 th,table.wcf500 td{
    border-width:0 0 1px 0;
    vertical-align:top;
    padding:6px 8px;
    font-size:18px;
    line-height:22px;
}
 table.wcf500 th{
    color:#ffffff;
    font-size:14px;
    font-family: "Graphik Bold", Helvetica, Arial, sans-serif;
    letter-spacing:0
}
 table.wcf500 th.ra,table.wcf500 th.ti{
    border-right:1px solid #fff
}
 table.wcf500 td{
    vertical-align:top;
    padding:8px;
}
 table.wcf500 th{
}
 table.wcf500 th.ra{
    padding-right:24px
}
 table.wcf500 td.ra{
    font-size:24px;
    font-family: "Graphik Light", Helvetica, Arial, sans-serif;
    width:5%
}
 table.wcf500 td.ti{
    font-family: "Graphik Bold", Helvetica, Arial, sans-serif;
    width:60%
}
 table.wcf500 td.au{
    width:35%
}
/* genre limit */
 .genre-limit{
    margin:0 0 14px
}
 .genre-limit label{
    font-size: 1em;
}
 .genre-limit label,.genre-limit select{
    display:inline;
    margin:0 8px 0 0
}
 .genre-limit label span.genrenote{
    border-bottom:1px dotted #333F48;
    cursor:help
}
 .genrenote-cont{
    display:none
}
/* sorting table headers */
 table.wcf500 th.header {
    cursor: pointer !important;
    background-color:#888B8D;
    background-image: url('../images/bg_tablesort.png');
    background-repeat: no-repeat;
    background-position: top right;
}
 table.wcf500 th.header:hover, table.wcf500 th.header:active{
     cursor:pointer !important;
    background-color:#333F48;
}
 table.wcf500 th.headerSortUp {
    background-color:#333F48;
    background-position: center right;
}
 table.wcf500 th.headerSortDown {
    background-color:#333F48;
    background-position: bottom right;
}
 @media screen and (max-width: 599px) {
     h1{
        text-indent:-9999px;
        margin:30px 0;
        text-align:center;
        background:url('../images/id_wcf500_horiz_white_noillo.svg');
        background-repeat: no-repeat;
        background-size: contain;
        background-position: center;
         padding:0 0 36%;
    }
     .genre-limit,.genre-note{
        float:none;
        width:96%;
        margin:0 auto;
        margin-bottom: 14px;
        text-align:center
    }
     table.wcf500{
        width:96%;
        margin:0 auto;
    }
     table.wcf500 tr{
        border-bottom:1px solid #888B8D;
    }
     table.wcf500 td{
        border:none !important
    }
     table.wcf500 td.ti,table.wcf500 td.ra,table.wcf500 td.au{
        width:auto
    }
     table.wcf500 td.ti a{
        padding-right:14px;
    }
     table.wcf500 td.ra{
        padding-top:14px;
    }
     table.wcf500 td.au{
        padding-bottom:8px;
    }
     table.wcf500 th{
        display:none
    }
     table.wcf500 tr{
        display:block;
    }
     table.wcf500 td{
        display:inline-block;
        padding:2px 8px;
        width:100% !important;
    }
}