html, body {
    height: 100%;
    }
body {
    margin:          0 !important;
    min-width:       1000px;
    background:      #333333 url(images/blakebackground.jpg) no-repeat fixed center center;
    background-size: cover;
    font-size:       14px;
    font-family:     'Open Sans', sans-serif;
    }
#video_container {
    left:       0;
    min-height: 100%;
    min-width:  101%;
    height:     100%;
    width:      100%;
    position:   fixed;
    top:        0;
    z-index:    -2;
    }
@keyframes fin {
    0% {
        opacity: 0;
        }
    100% {
        opacity: 1;
        }
    }
#video_container video {
    animation:  fin 1s linear !important;
    object-fit: cover;
    width:      100% !important;
    height:     100% !important;
    }
input, select {
    padding:          6px;
    outline:          0;
    border:           1px solid #333;
    border-radius:    2px;
    background-color: #000000a6;
    box-shadow:       inset 1px 1px 0 rgba(0, 0, 0, 0.3);
    color:            #fff;
    text-decoration:  none;
    }
textarea {
    padding:          6px;
    outline:          0;
    border:           1px solid #333;
    border-radius:    2px;
    background-color: #000000a6;
    box-shadow:       inset 1px 1px 0 rgba(0, 0, 0, 0.3);
    color:            #fff;
    text-decoration:  none;
    resize:           vertical;
    cursor:           text;
    }
input[type=radio] {
    display:        inline-block;
    margin-top:     -2px;
    width:          16px;
    height:         16px;
    vertical-align: middle;
    cursor:         pointer;
    }
input[type=checkbox] {
    width:  16px;
    height: 16px;
    cursor: pointer;
    }
input[type=submit], input[type=button], button {
    padding:    8px 15px 8px 15px;
    outline:    0;
    border:     0;
    background: #222222;
    color:      #ffffff;
    cursor:     pointer;
    }
input[type=submit]:active, input[type=button]:active, button:active {
    background: #b42020;
    }
button.active {
    background: #b42020;
    }
button.select {
    background: #b42020;
    }
input[type=submit].select {
    background: #b42020;
    }
a:active, a:link, a:visited {
    color:           #222222;
    text-decoration: none;
    transition:      all 0.3s linear;
    }
.clear {
    clear: both;
    }
.outer {
    position:  relative;
    max-width: 1000px;
    width:     100%;
    margin:    0 auto;
    }
header {
    position:      relative;
    overflow:      hidden;
    margin:        0 auto;
    height:        150px;
    border-radius: 4px 4px 0 0;
    }
header .outer {
    height:        100%;
    border-radius: 30px 30px 0 0;
    background:    #000000a6;
    }
header .outer > h1 {
    text-align:  center;
    padding-top: 10px;
    color:       rgb(125 26 77);
    text-shadow: 0 0 2px #c28174;
    font-size:   45px;
    }
header .outer > h1 span {
    display:     block;
    font-size:   30px;
    color:       #8a8a8a;
    font-weight: normal;
    text-shadow: 0 1px 1px #666;
    font-style:  italic;
    }
#autord {
    position: absolute;
    top:      50px;
    left:     60px;
    }
#autord span {
    display:     block;
    color:       #aaa;
    text-shadow: 0 1px 1px #555;
    font-weight: bold;
    font-size:   16px;
    }
#autord a {
    display:     block;
    color:       #aaa;
    text-shadow: 0 1px 1px #555;
    font-weight: normal;
    }
#wave {
    position: absolute;
    top:      115px;
    left:     10px;
    width:    96%;
    }
nav {
    overflow:       hidden;
    height:         50px;
    background:     #000000a6;
    box-shadow:     1px 3px 12px rgba(0, 0, 0, 0.4);
    color:          #ddd;
    text-align:     center;
    text-shadow:    0 1px 0 #000;
    line-height:    53px;
    padding-bottom: 10px;
    }
#navigation.top {
    position: fixed;
    top:      -60px;
    right:    0;
    left:     0;
    }
#navigation.select {
    top:        -3px;
    transition: all 0.3s linear;
    }
nav ul {
    margin:          0;
    padding:         0;
    list-style:      none;
    display:         flex;
    justify-content: center;
    }
nav ul li {
    outline:    none;
    cursor:     pointer;
    margin:     0 5px;
    transition: all 0.3s linear;
    }
nav ul li a {
    display:         block;
    padding:         0 30px;
    outline:         0;
    color:           #ddd !important;
    text-decoration: none;
    }
nav ul li a i {
    margin-right: 5px;
    }
nav ul li a:hover {
    border-radius: 10px;
    box-shadow:    inset 0 0 15px rgb(125, 26, 77);
    }
nav ul li:active {
    border-radius: 10px;
    background:    rgba(125, 26, 77, 0.34);
    transition:    all 0s linear;
    }
nav ul li.select {
    border-radius: 10px;
    background:    rgba(125, 26, 77, 0.34);
    transition:    all 0s linear;
    }
nav ul li:after {
    clear:   both;
    content: '';
    }
#hmenu {
    background-color: #222;
    padding:          10px;
    color:            #ddd;
    }
main {
    padding: 0 0 70px 0;
    }
#exin {
    background:    #000000a6;
    border-radius: 0 0 30px 30px;
    border-top:    20px solid #111;
    border-left:   5px solid #000000a6;
    border-right:  5px solid #000000a6;
    border-bottom: 10px solid #000000a6;
    position:      relative;
    padding:       10px;
    color:         white;
    box-shadow:    1px 3px 12px rgba(0, 0, 0, 0.4);
    }
#exin h1 {
    margin: 0;
    }
.gallery_container {
    display:         flex;
    justify-content: center;
    flex-flow:       row wrap;
    }
.gallery_container > a {
    margin:     10px;
    color:      white;
    transition: all linear 0.1s;
    }
.gallery_container > a:hover {
    transform: scale(1.03)
    }
.gallery_container > a div {
    position:            relative;
    width:               200px !important;
    height:              150px !important;
    background-size:     cover !important;
    background-position: top center;
    opacity:             0.8;
    border-radius:       8px;
    }
.gallery_container.video > a div {
    background-color: #000000a6;
    }
.gallery_container.video > a div > i {
    position:  absolute;
    top:       50%;
    left:      50%;
    transform: translate(-50%, -50%);
    font-size: 40px;
    }
.gallery_container > a > div > span {
    position:   absolute;
    bottom:     0;
    width:      100%;
    padding:    8px 0;
    background: #000000c7;
    text-align: center;
    font-size:  16px;
    }
footer {
    z-index:       100;
    position:      fixed;
    left:          0;
    bottom:        0;
    width:         100%;
    height:        40px;
    border-radius: 0 0 4px 4px;
    background:    #222 linear-gradient(to top, #222 0%, #333 100%);
    color:         white;
    }
footer ul {
    margin:      0;
    padding:     0;
    list-style:  none;
    display:     flex;
    align-items: center;
    }
footer ul li {
    margin:      0 5px;
    text-shadow: 0 1px 0 #000;
    }
footer ul li.flexspace {
    flex:       1;
    text-align: center;
    }
footer ul li a {
    color: #ddd !important;
    }
.navhead {
    position:      relative;
    margin-top:    -3px;
    width:         100%;
    height:        30px;
    border-top:    1px solid rgba(0, 0, 0, 0.2);
    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
    background:    #333 linear-gradient(to top, #333333 0%, #444444 100%);
    box-shadow:    1px 3px 12px rgba(0, 0, 0, 0.4);
    color:         #ddd;
    text-shadow:   0 1px 0 #000;
    font-family:   'Black Ops One', cursive;
    line-height:   30px;
    }
.navhead:first-child {
    height:        50px;
    border-top:    3px solid rgba(0, 0, 0, 0.2);
    border-right:  3px solid rgba(0, 0, 0, 0.2);
    border-bottom: 3px solid rgba(0, 0, 0, 0.2);
    line-height:   50px;
    }
.navhead span {
    padding-left: 10px;
    }
.navcont span {
    position: relative;
    display:  block;
    }
#rightpane {
    position:    relative;
    z-index:     10;
    display:     flex;
    float:       left;
    width:       802px;
    border-left: 1px solid rgba(0, 0, 0, 0.2);
    align-items: stretch;
    }

.toprow {
    position:      relative;
    padding:       10px;
    border-bottom: 1px solid #ddd;
    cursor:        pointer;
    transition:    all 0.3s linear;
    }
.toprow:hover {
    background: rgba(0, 0, 0, 0.1);
    }
.toprow:last-child {
    border-bottom: 0;
    }
.toprow span {
    display:        inline-block;
    margin-right:   10px;
    width:          95px;
    vertical-align: middle;
    }
.toprow span + span {
    display:        inline-block;
    margin-right:   0;
    width:          0;
    vertical-align: middle;
    }
#cop {
    position:    absolute;
    right:       0;
    color:       #ddd;
    text-shadow: 0 1px 0 #000;
    font-size:   12px;
    font-family: 'Black Ops One', cursive;
    }
.overtop {
    z-index:       100;
    display:       none;
    margin-left:   50px;
    padding:       10px;
    min-width:     200px;
    border-radius: 2px;
    background:    rgba(0, 0, 0, 0.7);
    box-shadow:    1px 3px 12px rgba(0, 0, 0, 0.4);
    color:         white;
    line-height:   16px;
    transition:    all 0.3s linear;
    }
.toprow:hover > .overtop {
    position: absolute;
    display:  inline;
    }
.toprow:active {
    background: rgba(0, 0, 0, 0.8);
    color:      white;
    transition: all 0s linear;
    }
#lrel {
    padding:     10px;
    background:  rgba(0, 0, 0, 0.85);
    box-shadow:  1px 3px 12px rgba(0, 0, 0, 0.4);
    color:       white;
    text-align:  center;
    font-weight: bold;
    cursor:      pointer;
    }
#lrel:active {
    background: rgba(100, 0, 0, 0.9);
    transition: all 0s linear;
    }
.newscontainer {
    padding: 10px;
    }
.newscontainer span {
    display:    block;
    padding:    5px 10px 0 10px;
    background: #000000a6;
    font-size:  18px;
    }
.newscontainer span + span {
    margin-bottom: 10px;
    padding:       0 10px 5px 10px;
    font-size:     14px;
    }
.newscontainer div {
    padding-top: 10px;
    }
.dbnorma {
    position:      relative;
    display:       inline-block;
    padding:       4px 8px 4px 8px;
    border:        1px solid grey;
    border-radius: 2px;
    background:    #333;
    box-shadow:    0 0 0 black;
    color:         #ffffff;
    }
.dbnorma.site {
    position:     relative;
    z-index:      100;
    padding-left: 20px;
    opacity:      0.95;
    cursor:       pointer;
    }
.dbnorma.site span {
    position:      absolute;
    top:           11px;
    left:          6px;
    display:       block;
    width:         0;
    height:        0;
    border-top:    6px solid #ddd;
    border-right:  5px solid transparent;
    border-bottom: 6px solid transparent;
    border-left:   5px solid transparent;
    }
.gopa {
    position:      absolute;
    top:           29px;
    left:          -1px;
    display:       none;
    margin-bottom: 40px;
    padding:       0 5px 0 5px;
    width:         230px;
    height:        35px;
    border-radius: 4px;
    background:    #323232;
    line-height:   35px;
    }
.dbnorm {
    padding:       4px 8px 4px 8px;
    border:        1px solid grey;
    border-radius: 2px;
    color:         #ffffff;
    opacity:       0.85;
    transition:    all 0.3s linear;
    }
.dbnorm:hover {
    padding:       4px 8px 4px 8px;
    border:        1px solid grey;
    border-radius: 2px;
    background:    #333;
    box-shadow:    0 0 0 black;
    color:         #ffffff;
    opacity:       0.85;
    }
.dbnorm:active {
    background: rgba(100, 0, 0, 0.9);
    transition: all 0s linear;
    }

.album {
    position:     relative;
    margin:       10px 10px 10px 10px;
    padding-left: 10px;
    height:       40px;
    background:   #ddd;
    font-size:    18px;
    font-family:  'Black Ops One', cursive;
    line-height:  40px;
    }
.album span {
    position:    absolute;
    top:         0;
    right:       10px;
    display:     block;
    font-size:   14px;
    font-family: 'Open Sans', sans-serif;
    }
.tracktable {
    display:       table;
    margin:        10px auto 0 auto;
    padding:       10px;
    width:         95%;
    border-top:    1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background:    #f0f0f0;
    table-layout:  fixed;
    font-size:     14px;
    font-family:   'Open Sans', sans-serif;
    }
.trow {
    display:    table-row;
    cursor:     pointer;
    transition: all 0.4s linear;
    }
.trow:hover {
    background: #ddd;
    }
.tcell {
    display: table-cell;
    padding: 5px;
    }
#gbout {
    padding:     10px;
    line-height: 25px;
    }
#gbout img {
    float:      right;
    margin:     0 0 10px 10px;
    padding:    2px;
    box-shadow: 1px 3px 12px rgba(0, 0, 0, 0.4);
    }
.album.in {
    padding-left: 42px;
    }
.in.details {
    margin:      10px;
    padding-top: 10px;
    border-top:  1px solid #ddd;
    }
.inbuttons {
    margin-top:  10px;
    padding-top: 10px;
    border-top:  1px solid #ddd;
    }
.inbuttons button + button {
    float: right;
    }
.kline {
    margin:         20px 0 10px 0;
    padding-bottom: 20px;
    border-bottom:  1px solid #ddd;
    line-height:    25px;
    }
.kline span {
    font-weight: bold;
    }
.comments {
    margin:     20px 0 20px 0;
    padding:    20px 0 20px 0;
    border-top: 1px solid #ddd;
    }
.komtainer {
    margin-bottom: 10px;
    }
.komtainer div {
    position:   relative;
    padding:    5px 10px 5px 10px;
    background: #ddd;
    }
.komtainer div > span {
    position: absolute;
    top:      7px;
    right:    10px;
    }
.komtainer div > div {
    margin:  0;
    padding: 0;
    }
.komtainer div + div {
    padding:    10px 5px 10px 5px;
    background: none;
    }
#searchcont {
    position:     relative;
    float:        right;
    margin-right: 10px;
    }
#searchcont input {
    width: 250px;
    }
#searchcont img {
    position: absolute;
    top:      9px;
    right:    10px;
    display:  none;
    }
.ui-effects-transfer {
    border:        1px dotted #666666;
    border-radius: 4px;
    list-style:    none;
    cursor:        pointer;
    }
.sorttracks {
    overflow:   hidden;
    margin:     0 0 10px 0;
    padding:    10px 0 0 0;
    max-height: 280px;
    list-style: none;
    }
.sorttracks li {
    border-bottom: 1px solid #ddd;
    text-align:    center;
    }
.sorttracks li:last-child {
    border-bottom: 0;
    }
.sorttracks li:hover {
    background: rgba(0, 0, 0, 0.1);
    }
.sorttracks li a {
    display: block;
    padding: 7px;
    }
#overlist {
    z-index:       100;
    display:       none;
    margin-left:   50px;
    padding:       10px;
    min-width:     200px;
    border-radius: 2px;
    background:    rgba(0, 0, 0, 0.7);
    box-shadow:    1px 3px 12px rgba(0, 0, 0, 0.4);
    color:         white;
    line-height:   16px;
    transition:    all 0.3s linear;
    }
#anzsong {
    position:      relative;
    padding:       10px 0 10px 0;
    border-bottom: 1px solid #aaa;
    text-align:    center;
    line-height:   30px;
    }
#info {
    position:      absolute;
    top:           15px;
    right:         10px;
    z-index:       1000;
    display:       none;
    padding:       2px;
    width:         40px;
    border-radius: 4px;
    background:    rgba(0, 0, 0, 0.8);
    color:         #ddd;
    text-align:    center;
    font-size:     13px;
    cursor:        help;
    }
#info:hover > #overlist {
    position: absolute;
    top:      0;
    left:     -5px;
    display:  inline;
    }
#listplayer {
    position:      relative;
    display:       none;
    margin:        0 auto 10px auto;
    padding:       5px 15px 5px 15px;
    width:         100px;
    outline:       0;
    border:        0;
    border-radius: 4px;
    background:    #333 linear-gradient(to top, #333333 0%, #444444 100%);
    color:         #ffffff;
    text-align:    center;
    font-size:     13px;
    cursor:        pointer;
    transition:    all 0.3s linear;
    }
#listplayer:hover {
    background: #222;
    }
#listplayer:active {
    background: #b42020;
    transition: all 0s linear;
    }
#overplay {
    z-index:       100;
    display:       none;
    margin-left:   50px;
    padding:       10px;
    min-width:     100px;
    border-radius: 2px;
    background:    rgba(0, 0, 0, 0.7);
    box-shadow:    1px 3px 12px rgba(0, 0, 0, 0.4);
    color:         white;
    line-height:   16px;
    transition:    all 0.3s linear;
    }
#listplayer:hover > #overplay {
    position: absolute;
    top:      0;
    left:     85px;
    display:  inline;
    }
#playline {
    display: none;
    }