@import url(https://fonts.googleapis.com/css?family=KoHo);

html {
    background-color: #FFFFFF;
    font-size: 200%;
    height: 98%;
    padding: 0px;
    margin: 0px;
}

body {
    min-height:550px;
    height: 100%;
    background-color: rgb(228, 228, 228);
}

#Title {
    font-family: 'KoHo';
    font-weight: 800;
    font-size: 2.5vw;
    margin: 1% auto;
    width: 80%;
    text-align: center;
    background-color: rgb(228, 228, 228);
}

#leftWrap {
    background-color: #475574;
    float: left;
    width: 20%;
    margin: 1% 1%;
    height: 96%;
}

#rightWrap {
    background-color: #475574;
    float: right;
    width: 75%;
    margin: 1% 1%;
    height: 96%;
    font-size: 3vw;
}

#marker {
    width: 95%;
    height: 88%;
    margin: 3% 2% 1% 2%;
    padding: 0;
    display: block;
}
    
#textInput {
    width: 100%;
    height: 100%;
    resize: none;
}

#highlighter {
    font-size:20px;
    width: 100%;
    height: 100%;
    padding: 0;
    resize: none;
    background-color: white;
    box-sizing:border-box;
    overflow-x: hidden;

}

#sendButton {
    margin: 3% 0;
    font-size: 3vw;
    height: auto;
    background-color: #DDDDDD;
    border-radius:10px;
}

.termlink {
    background-color: rgb(255, 170, 170);
}

#status {
    text-align:right;
    font-size:4vh;
    position: relative;
    top:0;
    right:3%;
    padding-right:3%;
    vertical-align:middle;
}

#upperPart {
    height:70%;
}

#modeSelect {
    width: 100%;
    font-size: 1.3vw;
}
#lowerPart {
    height:10%;
    margin-bottom: 5%;
}
#lowerPart button {
    width:100%;
    font-size:2vh;
}

#githubLink {
    margin: 2% auto;
    display: block;
    width : 50%;
}
#githubLink img {
    width : 100%;
    margin : auto;
    display: block;
}