

header {
  display: flex;
  /*justify-content: space-between;*/
  position: fixed;
  top: 0px;
  left:0px;
  padding: 0px 0px;
  /* height:50px; */
  width:100%;
  /* background-color:rgba(3,169,244,0.1);*/
  /* background-color:rgba(0,0,0,0.02); */
  z-index: 5;

  text-align:left;
  color:#000080;
  background-color:rgba(221,221,255,0.52);
  margin-top:1px;
  margin-bottom:1px;
  font-size:2vw;
  font-weight: bold;
  border-top:1px solid;
  border-bottom:1px solid;
}

.headerTitle {
 width:50%;
}

.menuButton {
 width:50%;
 text-align:right;
}

.menuButtons {
 display:grid;
 grid-template-columns:33.333% 33.333% 33.333%;
}

.wrapper {
 display: grid;
 grid-template-columns: 50% 50%;
 grid-template-rows: max-content max-content 1fr auto;
 margin: 1% 1% 1% 1%;
 gap: 7px;
}

.writebox {
 background-color:#FaFaFF;
 grid-column-start: 1;
 grid-column-end: 1;
 grid-row-start: 1;
 grid-row-end: 1;
 padding: 1px 15px 1px 15px;
 box-shadow: 1px 1px 5px 1px #555;
}

.samplebox {
 background-color:#FaFaFa;
 grid-column-start: 2;
 grid-column-end: 2;
 grid-row-start: 1;
 grid-row-end: 1;
 padding: 1% 1% 1% 1%;
 box-shadow: 1px 1px 5px 1px #555;
}

.output {
 background-color:#FFFaFa;
 grid-column-start: 1;
 grid-column-end: 3;
 grid-row-start: 2;
 grid-row-end: 2;
 padding: 1% 1% 1% 1%;
 box-shadow: 1px 1px 5px 1px #555;
}

.image {
 background-color:#F5F5FF;
 grid-column-start: 1;
 grid-column-end: 3;
 grid-row-start: 3;
 grid-row-end: 3;
 padding: 1% 1% 1% 1%;
 box-shadow: 1px 1px 5px 1px #555;
}

.information {
 background-color:#FFFFEA;
 grid-column-start: 1;
 grid-column-end: 3;
 grid-row-start: 4;
 grid-row-end: 4;
 padding: 1% 1% 1% 1%;
 box-shadow: 1px 1px 5px 1px #555;
}

.cm {
 background-color:#e9F9FF;
 grid-column-start: 1;
 grid-column-end: 3;
 grid-row-start: 5;
 grid-row-end: 5;
 padding: 1% 1% 1% 1%;
 box-shadow: 1px 1px 5px 1px #555;
}

.profile {
 display: none;
 background-color:#F5FaF5;
 grid-column-start: 2;
 grid-column-end: 2;
 grid-row-start: 2;
 grid-row-end: 2;
 padding: 1% 1% 1% 1%;
 box-shadow: 1px 1px 5px 1px #555;
 position: absolute;
 top:500px;
 left:5%;
 width:800px
}
