body{margin:0;padding:0;background:#0a0a0a;color:#ddd;outline:none;border:none;list-style:none;font:16px 'Roboto',sans-serif;}a{color:inherit;background:inherit;}a:hover{color:inherit;background:inherit;}.avatar{width:500px;height:125px;margin:20px auto;}#background{z-index:-5;width:100%;height:100%;background-image:url('img/city-scape.jpg');background-repeat:no-repeat;background-size:100% 100%;opacity:0.3;position:absolute;}#scroll{position:absolute;min-width:500px;width:100%;height:calc(100% - 41px);overflow-x:hidden;overflow-y:auto;}#header{width:100%;height:250px;display:table;}.cover{background:#0a0a0a;position:absolute;width:100%;height:0%;transition-property:all;transition-duration:.5s;transition-timing-function:cubic-bezier(0,1,0.5,1);}.cover.active{height:100%;}.header-container{width:800px;display:table-cell;vertical-align:middle;}.header-content{width:500px;vertical-align:middle;margin:0 auto;text-align:center;}.header-content.extra-info{width:600px;padding-bottom:15px;}.welcome{margin:20px auto;}#list{max-width:1500px;min-height:300px;margin:0 auto;display:-webkit-flex;display:flex;-webkit-flex-flow:row wrap;flex-flow:row wrap;-webkit-justify-content:center;justify-content:center;}.pad{width:320px;height:250px;float:left;margin:20px;cursor:pointer;background:#1C1C1F;box-shadow:10px 10px 30px 0px rgba(0,0,0,0.75);}.pad a{text-decoration:none;}.pad .mp-official{height:20px;margin-right:5px;margin-top:-3px;vertical-align:middle;}.pad-img{width:320px;height:180px;background-repeat:no-repeat;background-position:center;}nav{width:300px;height:40px;padding:0 10px;background:linear-gradient(to bottom,rgba(28,28,31,1) 0%,rgba(28,28,31,.75) 50%,rgba(28,28,31,.5) 75%,rgba(28,28,31,0) 100%);vertical-align:middle;line-height:40px;}.pad:hover nav{opacity:1;}.pad:active{box-shadow:5px 5px 10px 0px rgba(0,0,0,0.75);}.pad-info{padding:10px;width:300px;height:49px;background:#282C35;border-top:1px solid #444A59;text-align:center;font-weight:bold;}nav div{float:right;}.users{font-size:12px;}.song-title{max-width:250px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;float:left;}.pad-info p{max-width:250px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;margin:0 auto;}.pad-owner{color:#94959A;font-size:12px;}.pad-dj{color:#94959A;font-size:12px;}p{padding:0;margin:0;}.middle{font-size:100px;font-weight:bold;text-align:center;margin:50px;}.playback{margin:50px auto;width:640px;height:360px;z-index:9;background-repeat:no-repeat;background-size:50%;background-position:center;background-image:url('img/mqp.png');background-color:rgba(10,10,10,0.9);border:1px solid #444A59;}.video{width:640px;height:360px;}#footer{width:100%;height:40px;background:#1C1C1F;border-top:1px solid #0a0a0a;position:absolute;bottom:0;overflow:hidden;text-align:center;}.left{width:calc(100% - 390px);position:absolute;left:0;display:-webkit-flex;display:flex;}.right{width:390px;position:absolute;right:0;top:0;display:-webkit-flex;display:flex;}.center{display:table;margin:0 auto;max-width:calc(100% - 240px);}.ad{text-align:center;line-height:40px;vertical-align:middle;cursor:pointer;padding:0 10px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;font-style:italic;animation:blink ease-in-out 2s infinite;}.btn-key{text-align:center;line-height:40px;vertical-align:middle;cursor:pointer;padding:0 10px;color:#ffdd6f;}.btn{width:40px;line-height:40px;text-align:center;vertical-align:middle;cursor:pointer;color:#88898C;}.mdi{font-size:24px;vertical-align:middle;}.btn:hover,.ad:hover,.btn-key:hover{background:#0a0a0a;}.modal-bg{position:absolute;width:100%;height:100%;background:rgba(10,10,10,0.7);z-index:89;display:table;}.modal-container{display:table-cell;vertical-align:middle;}.modal.large{width:740px;}.modal{width:640px;background:#1C1C1F;border:1px solid #444A59;margin:0 auto;}.modal-box{height:calc(100% - 41px);width:100%;display:table;}.modal-text{text-align:center;vertical-align:middle;word-wrap:break-word;display:table-cell;padding:20px;}.modal-controls{height:40px;width:100%;border-top:1px solid #444A59;background:#282C35;display:-webkit-flex;display:flex;}.modal-ctrl{font-size:16px;line-height:40px;vertical-align:middle;text-align:center;cursor:pointer;float:left;-webkit-flex:1;-ms-flex:1;flex:1;}.modal-ctrl>div{width:calc(50% - 4px);display:inline-block;}.modal-yes{color:#A7CA00;cursor:pointer;}.modal-yes:hover{background:rgba(167,202,0,.25);}.modal-no{color:#C8303E;}.modal-no:hover{background:rgba(200,48,62,.25);}.modal-options{border:1px solid #444A59;background:#282C35;height:40px;}.modal-input{background:transparent;border:none;padding:10px;font-size:15px;color:#ddd;outline:none;border-bottom:1px solid #444A59;width:300px;height:41px;text-align:center;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;}.modal-input:focus{border-bottom:2px solid #A77DC2;}@keyframes blink{50%{text-shadow:0 0 10px #FFF;}}::-webkit-scrollbar{width:5px;height:5px;}::-webkit-scrollbar-track{-webkit-border-radius:10px;border-radius:10px;margin:10px 0;}::-webkit-scrollbar-thumb{-webkit-border-radius:10px;border-radius:10px;background:rgba(68,74,89,0.8);-webkit-box-shadow:inset 0 0 6px rgba(0,0,0,0.5);}::-webkit-scrollbar-thumb:window-inactive{background:rgba(68,74,89,0.4);}#search{max-width:1400px;margin:0 auto;height:40px;border:1px solid #444A59;vertical-align:middle;line-height:40px;background:#222326;width:80vw;}#searchbox{width:100%;background:transparent;border:none;min-height:20px;padding:10px 10px;font-size:15px;color:#ddd;outline:none;}