*{margin:0;padding:0}
body{
background-image:url('img_my-blog/fondo-pink.png');
font:14px 'Farro';
color:#523829
}

main{width:980px;padding:10px 50px 20px 50px;margin:auto}
img{-webkit-user-drag:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}

a{text-decoration:none;color:#FF889D;text-decoration:2px dotted underline;&:hover{color:#68A0E3}}
font{color:#F37088}
p, aside{text-align:justify}
p{margin:10px}
aside{
margin:10px;padding-left:10px;
color:#F37088;
border-left:3px solid #F37088;
& p{margin:10px 0}
}
mark{
padding:0 3px;
background-color:#ffd7dba2;
border-radius:5px
}
#foot, h3, #menu-button p, h5 p, #poem p, #quote, #scroll-top, footer{text-align:center}
#foot span, h1, h2, h3, #menu-button, h6, dt, #scroll-top{text-transform:uppercase}
h1, h2, h3, h6, dt{font-weight:900}

#foot span{font-size:15px}
h4{
width:auto;padding:0 5px;
background-color:#FECECDB3;
font-size:11px;font-weight:normal;
position:absolute;
top:235px;right:345px;
z-index:5
}

#blush{
padding:0 3px;
font-size:10px;letter-spacing:1px;
color:#FF889D;
background-color:#FECECD52;
border-radius:10px;
box-shadow:0 0 5px #FECECD99
}
#blush::before{content:"/ / /"}

#my-blog{
width:980px;
background-color:#FFFFFF99;
display:flex;flex-wrap:wrap;
position:relative
}
#lace-top, #lace-bottom{
width:100%;height:55px;
background-image:url('img_my-blog/-line.gif');
position:absolute
}
#lace-top{background-position:top left;background-repeat:repeat-x;top:0;z-index:4}
#lace-bottom{background-position:bottom left;background-repeat:repeat-x;bottom:0;z-index:4}
#lace-left, #lace-right{
width:68px;height:100%;
background-image:url('img_my-blog/-lace-.gif');
background-repeat:repeat-y;
position:absolute
}
#lace-left{left:-9px}
#lace-right{right:-9px}
#lace-center{
width:99%;height:48px;
background-image:url('img_my-blog/line-center.gif');
background-repeat:repeat-x;
position:absolute;
top:260px;left:5px
}
#header-welcome{width:59%;height:170px;margin:65px 0 0 60px}

h1{
margin:0;
font-size:35px;
background:linear-gradient(#FFD1D4 20%, #FF889D 80%);
-webkit-background-clip:text;
-webkit-text-fill-color:transparent;
filter:drop-shadow(0px 0px 1px #FFF) drop-shadow(0px 0px 0px #FFF) drop-shadow(0px 0px 1px #FFF) drop-shadow(0px 0px 0px #FFF) drop-shadow(0px 0px 1px #FFF) drop-shadow(0px 0px 1px #FFF) drop-shadow(0px 1px 0px #0000004D);
position:absolute;
top:210px;left:65px;
}
h2, h3{text-shadow:2px 1px 1px #FFF, 1px -2px 0 #FFF, -1px 1px 0 #FFF, -1px -1px 0 #FFF, 1px 0px 0 #FFF, 0px 2px 0 #FFF, -2px 0px 0 #FFF, 0px -2px 0 #FFF, 2px 2px 2px #DD658B00}
h2{
width:92%;
margin:20px auto 0;padding:3px 10px;
background-image:url('img_my-blog/fondo-título.gif');
font-size:16px;
border-bottom:2px dashed #FF889D;
&::before{
margin-right:5px;
content:url('img_my-blog/icon-ribbon-i.gif');
filter:drop-shadow(1px 1px 0px #FFF) drop-shadow(-1px -1px 0px #FFF) drop-shadow(-1px 1px 0px #FFF) drop-shadow(1px -1px 0px #FFF)
}
&:first-of-type{margin-top:0}
}
h3{
width:92%;height:37px;
margin:10px auto;
background-image:url('img_my-blog/título-fondo.png');
background-size:13px;
background-position:bottom;background-repeat:repeat-x;
font-size:18px;
&::before{
margin-right:5px;
content:url('img_my-blog/icon-ribbon-i.gif');
filter:drop-shadow(1px 1px 0px #FFF) drop-shadow(-1px -1px 0px #FFF) drop-shadow(-1px 1px 0px #FFF) drop-shadow(1px -1px 0px #FFF)
}
&::after{
margin-left:5px;
content:url('img_my-blog/icon-ribbon-i.gif');
filter:drop-shadow(1px 1px 0px #FFF) drop-shadow(-1px -1px 0px #FFF) drop-shadow(-1px 1px 0px #FFF) drop-shadow(1px -1px 0px #FFF)
}
}

.about-me-i{
width:305px;padding:10px;
background:url('img_my-blog/fondo-título.gif');
border:1px solid #FFD1D4;
border-radius:5px;
box-sizing:border-box;
position:absolute;
top:73px;left:155px
}
.about-me{
width:100%;
background:#FFF;
font-size:10px;
border-radius:5px;
box-shadow:0px 0px 3px #0000004D;
& li{list-style:url('img_my-blog/icon-ribbon.gif') inside;margin:10px 0}
& table img{margin:5px 10px}
}

.aomine-daiki{
width:175px;height:220px;
background-image:url('img_my-blog/aomine-daiki.png');
background-size:175px;background-repeat:no-repeat;
position:absolute;
top:60px;right:365px;
z-index:4;
&:hover{transform:scale(1.04)}
}

.menu{width:80px;margin-top:-9px;& a{color:#523829;text-decoration:none}}
#menu-button{
width:80px;height:27px;
margin-bottom:5px;
background-image:url('img_my-blog/menu-button.gif');
font:900 10px 'Farro';
& p{padding:13px 0 0 0}
&:hover{
font-style:italic;
filter:drop-shadow(0px 0px 1px #FECECD) drop-shadow(0px 0px 0px #FECECD) drop-shadow(0px 0px 1px #FECECD) drop-shadow(0px 0px 0px #FECECD) drop-shadow(0px 0px 1px #FECECD) drop-shadow(0px 0px 1px #FECECD)
}
}

#i{
width:565px;
margin:70px 15px 0 65px;
background-image:url('img_my-blog/left-.gif'), url('img_my-blog/right-.gif');
background-position:top left, top right;
background-repeat:repeat-y, repeat-y;
background-color:#FFF;
& #content{width:97%;height:100%;margin:auto;margin-top:20px;margin-bottom:55px}
& hr{width:96%;margin:auto;border:none;border-top:2px dashed #F37088}
}

#ii{
width:270px;margin:-160px 0 0 0;
background-image:url('img_my-blog/line-.gif'), url('img_my-blog/left-.gif'), url('img_my-blog/right-.gif');
background-position:top, top left, top right;
background-repeat:repeat-x, repeat-y, repeat-y;
background-color:#FFF;
z-index:3;
& #content{width:95%;height:100%;margin:auto;margin-top:50px;margin-bottom:65px}
& hr{width:91%;margin:15px auto;border:none;border-top:2px dashed #F37088}
& li{margin:0 10px 3px 10px;list-style:url('img_my-blog/icon-note.gif') inside}
}

h5{
width:199px;height:146px;
margin:auto;
background-image:url('img_my-blog/status-.gif');
background-repeat:no-repeat;
font-size:12px;font-weight:normal;
& p{padding:36px 18px 0 18px}
}

h6{
width:240px;height:69px;
margin:15px auto;
background-image:url('img_my-blog/i-love-you.gif');
background-repeat:no-repeat;
& p{
padding:8px 0 0 16px;
color:#FF889D;
font-size:13px
}
}
footer{margin-top:15px;font-size:18px;font-weight:500}