@import url('./font/font.css');

body{
    background-color: #FEFFF8; 
    font-family: Grotezk; 
    color:#6B64C3 ;
    text-decoration:none;
    margin:0;
    /*green is #69781C 
      purple is #6B64C3*/
}
.smirk{
    position:absolute;
    top: 2em;
    left:2em;
    margin:0;
    z-index:1;
}
a{
    text-decoration:none; 
    color: #69781C
}
a:hover{
    color: yellow;
}
.main{
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    height:100vh;
    margin:0;
}
.lyrics{
    margin:0;
    flex-basis:60%;
    overflow-y:scroll;
    overflow-x:hidden;
    padding: 1em;    
}
.documentation{
    flex-basis:40%;
    overflow-y:scroll;
    padding: 1em;
    margin:0;
    overflow-y:scroll;
/*     color:#69781C; */
}
h1{
    margin: 10vh 0;
    word-wrap: break-word;  
    font-size:6em;
    font-family: Bluu;
    font-weight:bold;
/*     font-style:italic; */
    width:50vw;
}
h3{
    font-family: Bluu;
    font-weight: regular;
    font-size: 2em;
}
p{
    margin: 2em auto;
    width: 90%;
    font-size: 1.2em
}
.documentation img{
    width:90%;
    margin: 1em auto;
    object-fit: contain;
}