/* Home*/
#banner{
    width:100%;
    height:500px;
    background-image:linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)) url('https://static.igem.wiki/teams/5233/header/bg-image.jpg');
    background-repeat: repeat-x;
}
.button-big
{
    font-size: 1.5em;
    padding: 10px 35px 10px 35px;
    background-color: greenyellow;
    opacity:0.1px;
}
.banner-word{
    width:390px;
    height:100px;
    margin-left: 0;
    margin-bottom: 10px;
    float:left;
}
.banner-feature{
    width:500px;
    height: 300px;
    margin-right: 10px;
    margin-top: 10px;
    float:left;
}
.banner-feature-image{
    display: block;
    padding: 10px;
    box-shadow: 3px 3px 3px 1px rgba(0,0,0,0.15);
    margin: 0 0 1.5em 0;
    outline: 0; 

}
		
.banner-feature-image img
{
    display: block;
    width: 70%;

}
.banner-word a {
    text-decoration:none;

}


/* Sidebar*/

/* REUSABLE STYLES*/

.unstyled
{ list-style: none; padding: 0; margin: 0;
  a{ text-decoration: none; }
}

.sidebar{
  position: fixed;
  left: 0; top: 0; bottom: 0;
  width: 5em;
  background:green;
  margin-top: 180px;
  margin-bottom: 100px;
  height:40%;
  opacity: 0.5;
  border-top-left-radius:0px;
  border-top-right-radius:15px;
  border-bottom-right-radius:15px;
  border-bottom-left-radius:0px;
}

/* MAIN NAV*/
.main-nav{
  margin-top:60px;
  ul{
    border-top: solid 1px gray;
  }
  
  li{
    border-bottom: solid 1px gray;
  }
  
  a{
    padding: 1.1em 0;
    color: whitesmoke;
    font: 400 1.125em ;
    text:{
      text-align: center;
      transform: lowercase;
    }
    
    &:hover{
      color: #fff;
    }
  }
}

/* HOVER SLIDE EFFECT*/
.list-hover-slide{
  
  li{
    position: relative;
    overflow: hidden;
  }
  
  a{
    display: block;
    position: relative;
    z-index: 1;
    transition: .35s ease color;
    
    &:before{
      content: '';
      display: block;
      z-index: -1;
      position: absolute;
      left: -100%; top: 0;
      width: 100%; height: 100%;
      border-right: solid 5px orange;
      background:gray;
      transition: .35s ease left;
    }
    
    &.is-current,
    &:hover{
      
      &:before{
        left: 0;
      }
    }
  }
}

