@import url(messina-stylesheet.css);
@import url(basis-stylesheet.css);

@font-face {
    font-family: "CamptonBook";
    src:
      url("../fonts/CamptonBook.otf") format("opentype");
  }

@font-face {
    font-family: "VoyageReg";
    src:
      url('..fonts/VoyageReg.eot?#iefix') format('embedded-opentype'),
      url("../fonts/VoyageReg.otf") format("opentype"),
      url('../fonts/VoyageReg.svg#VoyagerReg') format('svg');
}

@font-face {
    font-family: "MaisonNeueMono";
    src:
      url('../fonts/MaisonNeueMono.ttf')  format('truetype');

}

@font-face {
    font-family: "GT-Flexa";
    src: url("../fonts/GT-Flexa/GT-Flexa-Medium-Trial.otf") format("opentype");

}

@media (max-width: 900px) {
    html { font-size: 15px; }
}

@media (max-width: 400px) {
    html { font-size: 13px; }
}

::selection {
    background: #3c40c6; /* WebKit/Blink Browsers */
  }
::-moz-selection {
    background: #3c40c6; /* Gecko Browsers */
}

/* width */
::-webkit-scrollbar {
    width: 3px;
  
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: transparent; 
  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: #4d463c;
  }
  
  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #999999;
  }

.floating_message::-webkit-scrollbar {
    width: 3px;
  
  }

   /* Track */
.floating_message::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.3); 
  }
   
  /* Handle */
.floating_message::-webkit-scrollbar-thumb {
    background: #000; 
  }
  
  /* Handle on hover */
.floating_message::-webkit-scrollbar-thumb:hover {
    background: #484848; 
  }


html, body {
    height: 100%;
    width: 100%;
    background-color: #fffef8;
    margin: auto;
    overflow: hidden;
    font-size: 17px;
    -webkit-font-smoothing: antialiased;
}

ul, li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

p {
    margin: 0;
}

input, textarea {
    outline: none;
}

.interactive_button {

    transition: background-color 280ms cubic-bezier(0.37, 0, 0.63, 1) 70ms;
    transition: color 200ms cubic-bezier(0.37, 0, 0.63, 1) 50ms;

}

#right_section{
    width:55%;
    height: 100%;
    background-image: url("../images/gutenberg.png");
    background-size: auto 100%;
    background-position-x: center;
    background-repeat: no-repeat;
}

#left_section{
    width:45%;
    height: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
}

.flex_container{
    display: inline-flex;
    flex-direction: row;
}

.flex_container_item{
    padding: 10px;
    width: 100%;
    display: block;
}

.fci_title{
    font-family: Messina Sans Mono;
    font-size: 1vw;
    color: black;
}

.fci_text{
    font-family: Messina Sans Mono SemiBold;
    font-size: 2vw;
    color: black;
}

/* Loading cover */
.loading_cover {
    width: 100%;
    height: 100%;
    z-index: 3;
    background-color: #141312;
    display: flex;
    bottom:0;
    right: 0;
    position: absolute;
    transition: bottom 350ms cubic-bezier(0.37, 0, 0.63, 1) 70ms;
}

.loading_cover.loaded {
    bottom: -100%;
}

.loading_cover_inner {
    width: auto;
    height: auto;
    display: inline-flex;
    margin: auto;
    animation: fadeInOut 700ms cubic-bezier(0.37, 0, 0.63, 1) 100ms infinite;
}