@import url(https://fonts.googleapis.com/css?family=Raleway|Lora|Poppins&display=swap);
html{height:100%;background-color:white}body{padding:0px;margin:0;margin-top:0px;margin-bottom:0px;height:calc(100% - 10px)}body *{font-family:"Raleway","Poppins"}.showSmall{display:none}@media only screen and (max-width: 380px){.showSmall{display:block}}.hideSmall{display:block}@media only screen and (max-width: 380px){.hideSmall{display:none}}#react-root{width:100%;height:100%;margin:auto}header{width:100%;background-color:white;position:fixed;display:flex;height:50px}@media only screen and (max-width: 380px){header{flex-direction:column;justify-content:space-around;height:70px}}header .logoBox .logo{line-height:1}header .navButtons{display:flex;justify-content:flex-start;padding-left:10px;box-sizing:border-box;align-items:center;width:100%}header a{letter-spacing:1;color:black;text-decoration:none;line-height:1;font-size:18px;margin-right:15px}header a:visited,header a:active{color:black}header a.logo{font-size:25px;letter-spacing:1.5px;transform:rotate(0deg);margin-left:10px}section{box-sizing:border-box;padding-top:50px;color:white;background-color:black;height:100%;width:calc(100% - 20px);margin:auto;display:flex;flex-direction:column}@media only screen and (max-width: 380px){section{padding-top:70px}}section .colorBox{flex-grow:1;background-color:black;margin-top:5px;margin-bottom:5px;border-top:5px solid white}section iframe{width:100%;height:100%;margin:auto;border:1px solid white}h1,h2,h3,h4{line-height:1;margin:5px 0px 5px 0px}h1{font-weight:bold;padding:30px 10px;background-color:black;font-size:30px;letter-spacing:1.5px;border-bottom:5px solid white}.active h1{letter-spacing:2px;transition:letter-spacing 1s ease-in-out}p{font-family:"Poppins";font-size:15px;margin-block-start:0px;margin-block-end:0px;padding:0px 10px 20px 0px;margin-top:-1px;line-height:1.2;max-width:400px;color:white}.active p{margin-top:0px;transition:margin-top 1s ease-in-out}.pBox{background-color:black;padding:10px}.project{display:flex;align-items:flex-start;border-top:1px solid white;padding-top:10px}@media only screen and (max-width: 380px){.project{flex-direction:column}}.project a{font-weight:bold;min-width:150px;color:red;text-decoration:none}.project a.disabled{pointer-events:none}button{border:none;background-color:white;font-weight:bold;width:150px;cursor:pointer}#modal-root{position:fixed;left:0;top:0}.modalBack{width:100vw;height:100vh;background-color:rgba(0,0,0,0.4);display:flex;justify-content:center;align-items:center}.modalBack .modalBox{border-radius:5px;padding:20px;background-color:white;width:auto;height:auto}.modalBack .modalTopRow{width:100%;display:flex;justify-content:flex-end}.modalBack .modalExit{width:15px;height:15px}.modalBack .modalExit:before{font-size:22px;content:'X';color:black;line-height:1}.modalBack .modalButtons{width:100%;display:flex;justify-content:space-around}.modalBack .modalButtons button{align-items:center;flex-grow:1;margin-right:10px;margin-bottom:0px;padding-top:5px;text-align:center}.modalBack .modalButtons button:last-child{margin-right:0px}.modalBack .modalButtons button.disabled{pointer-events:none;color:#bbb}.modalBack .modalInput{width:100%}.modalBack h2{margin-top:10px;padding:0;max-width:75vw}.modalBack input{padding:5px 10px;outline:none;border:none;background-color:"grey"}.modalBack .columnLabel{display:flex;flex-direction:column}.modalBack .columnLabel span{margin-bottom:20px}.modalBack .modalContent *{margin-bottom:10px}.modalBack .modalContent h2{margin-top:0px;margin-bottom:20px;line-height:1.4}.modalBack .modalContent .modalButtons{margin-bottom:0px}.modalBack .modalContent.vertical{display:flex;flex-direction:column}.modalBack .modalContent.vertical label{display:flex;flex-direction:column}.modalBack .modalContent.vertical label.checkBox{flex-direction:row}.modalBack .modalContent.vertical label.checkBox .checkBox__face{margin-bottom:0}