@import 'LL.css';

html,
body{
  position : relative ;
  margin: 0;
  padding:0;
  font-family: 'Linux Libertine', Arial, sans-serif;
  font-size: 1.2em;
  color: #333;
  box-sizing: border-box;
  height:100%;
}
div {
  border-style: solid;
  border-width: 0px;
  box-sizing: border-box;
}





#app{
  position: relative;
  right: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin : 0;
  
}

#textinput{
  position: relative;
  width: 96%;
  height: 96%;
  top:2%;
  right : 0;
  left : 0;
  margin : auto;
  z-index:0;
}

#textarea{
  box-sizing: border-box;
  display:block;
  position: relative;


  width : 100%;
  height:100%;
  resize: both;
  margin : auto;
  font-size:0.8em}

#content{
  display: block;
  width : 80%;
  position: relative;
  top:0%;
  left : 0;
  right : 0;
  padding: 33vh 0%;
  margin: 0 auto;
}

a {

  text-decoration: none;
  background-color:#333;
  color: white;
  word-break: break-all;
  
}

a:hover {
  background-color:white;
  color:#333;
}
#meta-button {
  z-index: 999;
}

img{
  position: relative;
  display:block;
  width: 100%;
  right:0;
  left:0;
  margin: 2% auto;
}

#login-form{
  position: relative;
  margin: 0;
  width: auto;  
  font-size: inherit;
}
input{font-size: inherit;}

#meta-div{
  position : fixed;
  right : 2%;
  top : 2%;
  z-index:999;
}



.meta-button{
  border: none;
  border-radius: 0;
    margin: 0;
    padding: 0;
    width: auto;
    overflow: visible;
    position: absolute;
    right:0;

    /* inherit font & color from ancestor */
    color: inherit;
    font: inherit;

    /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */
    line-height: normal;

    /* Corrects font smoothing for webkit */
    -webkit-font-smoothing: inherit;
    -moz-osx-font-smoothing: inherit;

    /* Corrects inability to style clickable `input` types in iOS */
    -webkit-appearance: none;
    text-decoration: none;
    background-color:#333;
    color: white;

  }
.meta-button:hover {
  background-color:white;
  color:#333;
}






@media (min-width: 500px) {
  #content{
    width : 66%;
  }

}

@media (min-width: 600px) {
  #content{
    width : 50%;
  }
  
}

@media (min-width: 800px) {
  #content{
    width : 33%;
  }
  #textinput{
    position: fixed;
    height: 60%;
    width : 28%;
    top : 15%;
    left : 2%;
    margin: 0;
  }
  #textarea{
    box-sizing: border-box;
    display:block;
    position: relative;
    top : 0;
    right : 0;
    left : 0;
    width : 100%;
    height: 100%;
    
    resize: both;
    margin : auto;
  }
}

pre{
  font: inherit;
  word-break: inherit;
  white-space: pre-wrap;       /* css-3 */
  white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
  white-space: -pre-wrap;      /* Opera 4-6 */
  white-space: -o-pre-wrap;    /* Opera 7 */
  word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

code{
  word-break: inherit;
}

h1{
  font-size: 3em;
}
h2{
  font-size: 2em;
}
h3{
  font-size: 1.5em;
}

h4{
  font-size: 1.4em;
}
h5{
  font-size: 1.3em;
}
h6{
  margin : 1.2em 0;
}

iframe {
  width : 100%;
  height : 300px;
}