@charset "UTF-8";

/*
general
*/
html {
    font-size: 100%;
    background-color: rgb(250, 250, 250);
}
.container {

    height: 100vh;
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    padding: 0;
	font-family: 'Comfortaa', 'M PLUS 1p', sans-serif;
    text-align: center;
}
.header {
    width: 100%;
    height: 100px;

    /* background-color: blue; */
}

.main {
    display: flex;
    height: 600px;
    justify-content: space-between;
    text-align: left;
}
.main h1 {
    font-size: 200%;
    text-align: center;
}

.main h2 {
    padding-top: 10px;
}

.textright {
    padding-top: 10px;
    padding-bottom: 70px;
    padding-right: 50px;
    text-align: right;
}


.side-bar {
    /* flex-grow: 1; */
    width: 200px;

    /* background-color: green; */
}

.main-contents {
    flex-grow: 1;
    padding-top: 10%;
    padding-bottom: 5%;
    padding-left: 5%;
    padding-right: 5%;
    font-size: 80%;

    /* background-color: gray; */
}

.footer {
    width: 100%;
    height: 200px;

    /* background-color: red; */
}