.about{
    grid-column: 3 / 4;
    grid-row: 2 / 3;
    height: 1fr;
}

.affiliate{
    background-color: rgb(30, 35, 65);
    color: lightyellow;
}

.box_affiliate{
    background-color: rgb(95, 99, 150);
    color: lightyellow;
}

.box_affiliate a,
.box_affiliate a:link,
.box_affiliate a:visited,
.box_affiliate a:hover,
.box_affiliate a:active{
    color: lightyellow;
}

.box_contents{
    background-color: rgb(95, 99, 150);
    color: lightyellow;
    padding: 0.5em;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

.box_contents a,
.box_contents a:link,
.box_contents a:visited
.box_contents a:hover,
.box_contents a:active{
    color: lightyellow
}

.box_counter{
    background-color: rgb(30, 35, 65);
    color: lightyellow;
    font-size: 0.9em;
}

.box_copyright{
    background-color: rgb(30, 35, 65);
    color: lightyellow;
    font-size: 0.8em;
}

.box_domain{
    background-color: rgb(95, 99, 150);
    color: lightyellow;
    font-size: 3.6em;
}

.box_title{
    background-color: rgb(30, 35, 65);
    color: lightyellow;
    font-size: 1.5em;
}

.box_title a,
.box_title a:link,
.box_title a:visited,
.box_title a:hover,
.box_title a:active{
    color: lightyellow;
}

.container{
    align-items: center;
    display: grid;
    grid-template-columns: 10px 1fr 75% 1fr 10px;
    grid-template-rows: 200px 1fr 1fr 1fr 1fr 40px;
    height: 100%;
    width: 100%;
}

.footer{
    align-items: center;
    background-color: rgb(30, 35, 65);
    color: lightyellow;
    display: flex;
    justify-content: space-between;
}

.header{
    align-items: center;
    background-color: rgb(30, 35, 65);
    color: lightyellow;
    display: flex;
    justify-content: space-between;
}

.p a{
    color: lightyellow;
}

.powerd{
    background-color: rgb(95, 99, 150);
    border-radius: 5px;
    color: lightyellow;
    grid-column: 4 / 5;
    grid-row: 1 / 2;
    padding: 0.5em;
    -webkit-border-radius: 5px;
}

.profile{
    grid-column: 3 / 4;
    grid-row: 3 / 4;
    height: 1fr;
}

.title {
    align-items: center;
    background-color: none;
    color: lightyellow;
    display: flex;
    font-size: 3.6em;
    grid-column: 2 / 4;
    grid-row: 1 / 2;
    justify-content: space-between;
    padding: 0 20px;
    text-align: center;
    vertical-align: bottom;
}

.title a,
.title a:link,
.title a:visited,
.title a:hover,
.title a:active{
    color: lightyellow;
}

.title:after{
    content: "";
    color: lightyellow;
    font-size: 0.5em;
}

.thumbnail{
    background-color: rgb(95, 99, 150);
}

a{
    color: lightyellow;
}

body{
    background-color: rgb(30, 35, 65);
}

fieldset{
    border: 3px rgb(95, 99, 150) dashed;
    border-radius: 5px;
    grid-column: 2 / 2;
    grid-row: 2 / 3;
    padding: 0.5em;
    -webkit-border-radius: 15px;
}

footer{
    grid-column: 1 / 7;
    grid-row: 6 / 7;
}

header{
    grid-column: 2 / 7;
    grid-row: 1 / 2;
}

img{
    min-width: 200px;
    max-width: 1000px;
}

legend{
    background-color: rgb(95, 99, 150);
    color: lightyellow;
    padding: 0.5em;
    padding: 0.5em;
    -webkit-border-radius: 5px;
    border-radius: 5px;
}

p{
    color: lightyellow;
}

@media screen and (max-width: 1024px){
    .box_contents{
        font-size: 0.85em;
    }

    .box_copyright{
        font-size: 0.8em;
    }

    .box_counter{
        font-size: 0.8em;
    }

    .box_domain{
        font-size: 1.3em;
    }

    .box_title{
        font-size: 1.0em;
    }

    .header{
        font-size: 1.3em;
    }

    .title{
        font-size: 1.3em;
    }

    img{
        min-width: 200px;
        max-width: 900px;
    }
}

@media screen and (max-width: 480px){
    .box_contents{
        font-size: 0.7em;
    }

    .box_copyright{
        font-size: 0.6em;
    }

    .box_counter{
        font-size: 0.6em;
    }

    .box_domain{
        font-size: 1.2em;
    }

    .box_title{
        font-size: 0.85em;
    }

    .header{
        font-size: 1.2em;
    }

    .title{
        font-size: 1.2em;
    }

    img{
        width: 60%;
        max-width: 480px;
    }
}