#wtf {
        position: absolute;
    width: 280px;
    -webkit-transform: rotateY(45deg);
    z-index:1;

}

#container {
        position: relative;
    height: 500px;
    width: 500px;
    margin: auto;
    margin-bottom:300px;
    perspective: 500px; 
    perspective-origin: 50% 60%;
    margin-top:100px;
    & > h1 {font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; margin:0;font-size:3rem;font-weight:lighter;text-align: end;
    position: absolute;
    width: 370px;
    height:420px;
    -webkit-transform:rotateY(-30deg);
    bottom:60px;
    right:-70px;
z-index:-1}
}

button {
    width:100%;
font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
font-size:2rem;
border:black 3px solid;
background: linear-gradient(90deg,#ffffff 0%, #ffcee4 100%);
margin-top:-2px;
box-shadow:#fd0273 -2px 5px;
    &:hover {
        background:black;
        color:white;
        scale:1.2;
        box-shadow:none;
    }
}

#abc {
    position: absolute;
    width: 370px;
    height:420px;
    -webkit-transform:rotateY(-30deg);
    bottom:0px;
    
    right:-80px;
    overflow-y:scroll;
    
    & > div {
        background:linear-gradient(90deg,#ffcee4 0%, #fff 50%);
    border:3px solid black;
    padding:5px;
    margin-bottom:10px;
    width:80%;
    font-family:Arial, Helvetica, sans-serif;
    box-shadow:#fd0273 2px 5px;
    
        & > h2 {
            margin:0;line-height: 0.8;margin-top:2px;
            margin-bottom:5px;
        }
        & span {color:#fd0273;font-size:1rem;};
        & > p {
            margin:0;
            margin-bottom:5px;
            &::first-letter {float:left; color:#fd0273;font-size:1.5rem;margin-right:0.2rem};}
        & > iframe {
            height:75px;width:75px;float:right;
        }
        &:nth-child(even) {margin-left:50px;}
    }
}

    body {
        background-color: #ffffff;
opacity: 1;
background-image:  linear-gradient(135deg, #ffcee4 25%, transparent 25%), linear-gradient(225deg, #ffcee4 25%, transparent 25%), linear-gradient(45deg, #ffcee4 25%, transparent 25%), linear-gradient(315deg, #ffcee4 25%, #ffffff 25%);
background-position:  30px 0, 30px 0, 0 0, 0 0;
background-size: 30px 30px;
background-repeat: repeat;
    }

    
    #record {
    position: absolute;
    rotate:40deg X;
    bottom:0px;
    left:-60px;
    width:360px;
    z-index:-1;
    animation:spinny 5s linear infinite
    }

    @keyframes spinny {
        from {transform:rotateZ(0deg)}
        to {transform:rotateZ(360deg)}
    }

    ::selection {
        color:#fff;
        background-color: #000;
    }

     #bio {
    position: absolute;
    rotate:40deg X;
    top: 500px;
    width:650px;
    background:linear-gradient(180deg,#ffcee4 0%, #fff 50%);
    border:3px solid black;
    padding:5px;
    font-family:Arial, Helvetica, sans-serif;
    box-shadow:#fd0273 0px 5px;
    -webkit-transform:rotateY(20deg);
    & p {margin-top:0;
        margin-bottom:7px;
    }
 }

 ::-webkit-scrollbar {width:5px;height:5px;}
    ::-webkit-scrollbar-thumb {background-color:#000;}
    ::-webkit-scrollbar-thumb:hover {background-color:#fd0273;}