*{margin:0;padding:0;box-sizing:border-box}
body{
margin:0;
background:url('img_aomine-daiki-shrine/fondo-.png');
font:16px 'Inter Tight';
color:#A57C81;
text-align:justify;
animation:moveIt 15s linear infinite;
animation-timing-function:linear
}
@keyframes float{0%, 100% {transform:translateY(-5px)}
50%{transform: translateY(5px)}}
@keyframes moveIt{from {background-position:0px 0px;}to {background-position:210px 210px;}}
::selection{background-color:#D7EDFa;color:#68A0E3}

::-webkit-scrollbar{display:none}
html{-ms-overflow-style:none;scrollbar-width:none}

p, aside{margin:10px 0}
b, u{font-weight:600}
u{color:#697FB9;text-decoration:2px dotted underline}

main{width:fit-content;margin:auto;padding:25px}
#aomine-daiki{
width:838px;
margin:auto;padding:20px;
background-image:url('img_aomine-daiki-shrine/fondo-i.png');
border:2px solid #FFFFFF;
outline:2px solid #95BCDD;
border-radius:15px;
box-shadow:inset 2px 2px 2px #FFFFFF;
position:relative
}
#border{
margin-bottom:20px;
background:#FFFFFF;
border:2px dashed #95BCDD;
outline:5px solid #FFFFFF;
border-radius:10px;
overflow:hidden;
}
header{
width:100%;height:234px;
background:url('img_playlist/header-.png') no-repeat;
background-size:100%;
position:relative
}
aside{
padding-left:10px;
color:#CA7D9C;
font-weight:700;
border-left:3px solid #CA7D9C
}
h2{
width:fit-content;
margin:0;padding:0px 10px;
background:linear-gradient(#00000000 50%, #F8D2E1 50%);
color:#FFFFFF;
font:900 22px 'Playwrite CO';
line-height:35px;
position:relative;
z-index:10;
text-shadow:0px 0px .2px #CA7D9C, 1px 1px .2px #CA7D9C, -1px -1px .2px #CA7D9C, -1px 1px .2px #CA7D9C, 1px -1px .2px #CA7D9C;
& span{filter:drop-shadow(1px 1px 0px #F8D2E1) drop-shadow(-1px -1px 0px #F8D2E1) drop-shadow(-1px 1px 0px #F8D2E1) drop-shadow(1px -1px 0px #F8D2E1)}
}
h3, h4, nav, footer, #music li, td{text-transform:uppercase}
h3{
padding:5px 10px;
color:#95BCDD;
position:relative
}
h4{
width:175px;
text-align:center;
text-overflow:ellipsis;
white-space:nowrap;
overflow:hidden
}
#songArtist{font-size:11px}

#i{border-top:2px dashed #95BCDD;display:flex;flex-wrap:wrap}

#music{
width:200px;
background:#EBFAFF;
font-size:12px;
border-right:2px dashed #95BCDD;
display:flex;
flex-direction:column-reverse;
justify-content:space-between
}
#music li{
list-style:none;
padding:5px 10px;
font-weight:700;
cursor:pointer;
position:relative;
&.active{background:#95BCDD;color:#FFFFFF}
&.active font{color:#FFF}
}
#music li font{color:#95BCDD;position:absolute;right:10px}

.ii{
width:590px;height:505px;
padding:20px;
background:#FFEEC080;
overflow-y:auto
}

table{width:100%;margin-top:10px;border-collapse:collapse}
table td{
width:500px;
padding:5px 10px;
font-size:13px;
font-weight:700;
cursor:pointer
}
td u{font-weight:700}
table tr:nth-child(even){background:#E5F2D8}
table td img{width:12px;margin-bottom:-1px}
#number{width:20px;padding:5px 0 5px 10px}

#music-section{
padding:10px 0;
background-color:#E5F2D8;
color:#CA7D9C;
border-top:2px dashed #95BCDD;
display:flex;flex-direction:column;
align-items:center
}
#progress{margin:3px 0 5px 0;display:flex;align-items:center}
.bar-i{
width:120px;height:8px;
margin:0 5px;
background:#FBE8F0;
border:1px solid #CA7D9C;
border-radius:5px;
overflow:hidden;
cursor:pointer
}
.bar-ii{width:0%;height:100%;background:#CA7D9C}
button{
width:21px;height:21px;
margin-right:5px;
border:1px solid #CA7D9C;
border-radius:5px;
cursor:pointer;
position:relative
}
.play{background:url('img_playlist/play-.png') no-repeat center, #FBE8F0;background-size:15px}
.arrow-left{background:url('img_playlist/arrow-i.png') no-repeat center, #FBE8F0;background-size:13px}
.arrow-right{background:url('img_playlist/arrow-ii.png') no-repeat center, #FBE8F0;background-size:13px}
#music-section span{font-size:10px}

nav, footer{
background-color:#E5F2D8;
color:#FFFFFF;
font:800 17px 'Inter Tight';
text-align:center;
text-shadow:1px 1px 0px #95BCDD, -1px -1px 0px #95BCDD, -1px 1px 0px #95BCDD, 1px -1px 0px #95BCDD, 0px 0px 1px #95BCDD, 0px 0px 1px #95BCDD, 0px 0px 1px #95BCDD, 0px -1px 1px #95BCDD, 2px 1px 1px #95BCDD, 0px 1px 1px #95BCDD;
}
nav a, footer a{
color:#FFE2F1;text-decoration:none;
&:hover{padding:0 5px;background:#95BCDD;color:#FFFFFF;border-radius:5px}
}
nav i, footer i{margin:0 8px;font-style:normal;&::before{content:'♥︎';font-weight:normal}}
nav{padding:7px 0}
footer{
padding:8px 0 5px 0;
border:2px dashed #95BCDD;
outline:5px solid #E5F2D8;
border-radius:10px;
}