body {
    margin: 0 auto;
    padding-bottom: 4px;
    font-family: ms pgothic;
    text-shadow: 0 0 0px, 0 0 3px grey;
    font-size: 15px;
    line-height: 17px;

    background-color: rgba(255, 255, 255, 0.9);
}

body.intro-boot {
    animation: bootUp 1.5s cubic-bezier(0.1, 0.7, 1.0, 0.1) forwards;
    min-height: 100vh;
    position: relative;
    overflow-x: hidden;
}

body.intro-boot::after {
    content: " ";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image:
        linear-gradient(45deg, #000000 25%, transparent 25%, transparent 75%, #000000 75%, #000000),
        linear-gradient(45deg, #000000 25%, transparent 25%, transparent 75%, #000000 75%, #000000);
    background-position: 0 0, 1px 1px;
    background-size: 2px 2px;
    opacity: 0.1;
    pointer-events: none;
    z-index: 999;
}

@keyframes bootUp {
    0% {
        opacity: 0;
        filter: blur(10px) contrast(200%) grayscale(100%);
        text-shadow: 10px 0 #555, -10px 0 #888;
        transform: scale(1.02);
    }
    15% {
        opacity: 0.35;
        filter: blur(6px) contrast(160%) grayscale(80%);
        text-shadow: 3px 0 #666, -4px 0 #999;
        transform: scale(1.01);
    }
    30% {
        opacity: 0.5;
        filter: blur(4px) grayscale(50%);
        text-shadow: 4px 0 #777, -4px 0 #aaa;
    }
    50% {
        opacity: 0.65;
        filter: blur(2px) grayscale(30%);
        text-shadow: 2px 0 #999, -2px 0 #ccc;
    }
    70% {
        opacity: 0.8;
        filter: blur(1px) grayscale(10%);
        text-shadow: 1px 0 #aaa, -1px 0 #ddd;
    }
    100% {
        opacity: 1;
        filter: blur(0) grayscale(0%);
        text-shadow: 0 0 0 transparent;
        transform: scale(1);
    }
}

html, body {
    height: auto;
    min-height: 0;
}

body a {
    text-decoration: underline;
    color: black;

}

body a:hover {
    text-decoration: underline;
    color: black;

}

.subject {

    padding: 60px;
    border: 1px;
    margin: auto 0;
    width: 560px;
    font-size: 14px;
    letter-spacing: 1px;
    
}

.area {
    margin: 0 auto;
    width:700px;
    max-width: 100%;
    background-color: white;
    overflow-x: hidden;
}

.side {
    padding: 10px;
    position: fixed;


}

.table {
    width: 100px;
    background-color: white;
    padding: 10px;
    border: 1px dotted black;
    float: right;
    line-height: 25px;

}

.fun {
    margin: 0 auto;
    padding: 40px;
    border: 1px;
    line-height: 20px;
    width: 650px;
    font-size: 14px;
    letter-spacing: 1px;
    opacity: 80%;
}

.box {
    width:700px;
    height:340px;
    margin:0 auto;
    padding:10px;
}



.me {
    background-color:white;
    padding:15px;
    width: 300px;
    height: 326px;

    font-family: georgia;
    font-size: 15px;
    line-height: 28.3px;
    opacity: 80%;

    float:left;
    text-shadow: 0 0 0px, 0 0 4px dimgray;

}

.right {
    
    float:right;



    
}

.sidepic {
    background-color:white;
    padding:15px;
    height:326px;
    overflow:hidden;
}



.updatebox {
    width:680px;
    text-align:center;
    margin: 15px auto 0 auto;
    height:15px;
    font-family:ms pgothic;
    letter-spacing:1px;
    font-weight:bold;
    background-color:white;
    border:1px solid black;
    color:black;
    padding:5px;
    text-shadow: 0 0 0px, 0 0 0px white;
}

.updates {
    margin:15px auto 4px auto;
    border:1px solid black;
    padding:0;
    background-color:white;
    width:680px;
    min-height:100px;
    box-sizing:border-box;
    text-shadow: 0 0 0px, 0 0 4px dimgray;
}

.updates-header {
    text-align:center;
    font-family:ms pgothic;
    padding:5px;
    background-color:white;
    border-bottom:1px solid black;
}

.content-list {
    display:block;
}

.content-row {
    display:grid;
    grid-template-columns: 1fr 120px 140px;
    gap:10px;
    align-items:baseline;
    font-family:ms pgothic;
}

.content-header-row {
    font-weight:bold;
    letter-spacing:1px;
}

.text {
    padding:8px;
    overflow: auto;
    font-size:13px;
    line-height:20px;
    letter-spacing:1px;
    background-color:white;
    height:auto;
    box-sizing:border-box;
}
