#interface{

  display:block;
  box-sizing: border-box;
  position: relative;
  width : 500px;
  height:800px;
  resize: both;
  margin:auto;
  font-size:10px;
  text-align:right;
  z-index: 999;
  overflow: hidden;
  }


#interface2{


  height:100%;

}

#textarea{
position:relative;
border:1px solid black;
box-sizing: border-box;
width : 100%;
height : 90%;
transition: all 0.3s ease 0s;
font-family: monospace;
resize:none;
z-index:999;

}



.interfacelink {
  display:inline !important;
  text-decoration: none !important;
  background-color:black !important;
  box-sizing: border-box !important;
  color: white !important;
  position:relative !important;

  text-align:center !important;
  right:0px !important;
  bottom:0px !important;
  font-size: 2em !important;
  margin-left: 2px !important;

}
.interfacelink:hover{
  background-color:white !important;
  color:black !important;
}




#hideTextArea {
  text-decoration: none;
  background-color:black;
  display:inline-block;
  box-sizing: border-box;
  color: white;
  position:relative;
  width :50%;
  right:0px;
  font-size: 2em;
  text-align:center;
  cursor: pointer;
  border-right: 1px white solid;


}


#moveTextArea {
  text-decoration: none;
  background-color:black;
  display:inline-block;
  color: white;
  position:relative;
  width :50%;
  right:0px;
  font-size: 2em;
  text-align:center;
  cursor: grab;

}










@media (min-width: 1400px) {


  #interface{
    display:block;
    box-sizing: border-box;
    position: fixed;
    top : 100px;
    left : 10px;
    width: 500px;
    height:600px;
    resize: both;
    overflow: hidden;
    padding-bottom: 20px;
  }
}
