@import url("https://fonts.googleapis.com/css?family=Lato:400,700");

html, body {
  height:100%;
  width: 100%;
  /*font-family: sans-serif; */
  color: #FFF;
}
.italic {
  font-style: italic;
}
.container-fluid {
  height: 100%;
  overflow-y: hidden; /* don't show content that exceeds my height */
  overflow-x: hidden; /* don't show content that exceeds my width */
}

.navbar-nav >li{
  padding-left:15px;
  padding-right:15px;
    
}
.navbar-brand {
  padding-left:50px;
  padding-right:30px;
    
}

.navbar .navbar-collapse {
    text-align: center;
}
#nav-balance:hover {
  /* styles for hover on non-disabled*/
  color: white;
}

#home{
  background: url('/images/aether.png') no-repeat 50% 50%;
  background-size: 100% auto;
  width:100%;
  height:100%;
  display: table;
  overflow:hidden;
  position: fixed;
}
.landing-text {
  padding-top:2vh;
  display: tabel-cell;
  vertical-align: middle;
  text-align: center;
  font-size: 5vmax;
}
.typed-text{
  padding-top:2vh;
  display: tabel-cell;
  vertical-align: middle;
  text-align: center;
  font-size: 4vmax;

}
h1 {
  font-family: 'Montserrat', sans-serif;
  
}
.mobile {
  overflow:scroll !important;
}
.desktop{
  overflow: hidden !important
}
.about-me{
padding-top: 2vw;

}
.skills-page{
  /* background: url('/images/code.jpg') no-repeat; 
  background-size: 100% 100%;*/
  width:100%;
  display: table;

}
.skills-page >h2{
  font-weight:bold; 
  background-color:Yellow; 
}
.skill-row{
  height:75vh;
}
#skills-obj {
  height: 75vh;

}
#skills-list {
  height: 75vh;
  line-height: 2em;

  padding: 0;
  margin: 0;
  overflow: scroll;
  overflow-x: hidden;

}
#skills-2D {
  height: 75vh;
  padding:0;
  margin:0;
}
#skills-3D {
  height: 75vh;
  padding-right:0;
}
#skills-title {
  padding-top: 2vh;
  height:15vh;
}
#skills-title >h1{
  font-size: 1.75em;
}

#skills .skills-canvas>canvas {
  cursor: -webkit-grab;
  cursor: -moz-grab;
  cursor: grab;
}

#skills .skills-canvas>canvas:active {
  cursor: -webkit-grabbing;
  cursor: -moz-grabbing;
  cursor: grabbing;
}
/* 
#skills .skills-canvas {
  width: 100%;
  width: calc(100%);
  display: inline-block;
  height: 100%;
  color: #222222
} */

#skills .ace_scrollbar-v{
  overflow: hidden !important;
}
.fill {
  min-height: 100%;
  height:auto !important; /* cross-browser */
  height: 100%; /* cross-browser */
}
/*.skills-info>canvas {
  position: absolute;
  left: 0;
  top: 61px;
}

* /
 #skills .editor{
  /* overflow: hidden; * /
  
}*/
.hidden{
  display:none;
}
.toggle {
  position: relative;
  display: block;
  margin: 0 auto;
  width: 150px;
  height: 60px;
  color: white;
  outline: 0;
  text-decoration: none;
  border-radius: 100px;
  border: 2px solid #546e7a;
  background-color: #263238;
  transition: all 500ms;
}
.toggle:active {
  background-color: #1c2429;
}
.toggle:hover:not(.toggle--moving):after {
  background-color: #455a64;
}
.toggle:after {
  display: block;
  position: absolute;
  top: 4px;
  bottom: 4px;
  left: 4px;
  width: calc(50% - 4px);
  line-height: 45px;
  text-align: center;
  text-transform: uppercase;
  font-size: 20px;
  color: white;
  background-color: #37474f;
  border: 2px solid;
  transition: all 500ms;
}
.toggle--on:after {
  content: '3D';
  border-radius: 50px 5px 5px 50px;
  color: #66bb6a;
}
.toggle--off:after {
  content: '2D';
  border-radius: 5px 50px 50px 5px;
  transform: translate(100%, 0);
  color: #66bb6a;
}
.toggle--moving {
  background-color: #1c2429;
}
.toggle--moving:after {
  color: transparent;
  border-color: #435862;
  background-color: #222c31;
  transition: color 0s, transform 500ms, border-radius 500ms, background-color 500ms;
}
.txt-rotater > *{
 margin: 0 15%;
}