/**************/
/* BASE RULES */
/**************/

html {
  font-size: 100%;
}

body.beta {
  background-color: #232C2F;
  background-image: url(http://AppImageos.org/img/nav-bg.png);
  background-position: center -30px;
  background-repeat: no-repeat;
  font: 14px/1.5 $font_body;
  color: #B2BFBC; /*$color_body;*/

  > * {
    max-width: 960px;
    width: 100%;
    margin: 20px auto;
  }
  
  > header {
    border-width: 1px;
    border-style: solid;
    border-color: #424C50 #313C3F #2A2F31 #313C3F;
    box-shadow: #10170A 0 0 0 1px;
    background-image: linear-gradient(#283237 0%, #1F2527 100%);
    border-radius: 5px;
    
    > nav {
      
      align-items: center;
      display: flex;
      flex-direction: row;
      float: none;
      height: 48px;
      line-height: 34px;
      
      a {
        color: #B2BFBC;/* var! */
        text-shadow: 0 1px 0 #10170A;
        align-items: center;
        height: 48px;
        line-height: 34px;
      }
      
      a:after:not(:last-child) {
        background-color: rgba(0, 0, 0, 0);
        background-image: linear-gradient(
          rgba(16,23,10,0) 0%, 
          rgba(16,23,10,1) 50%, 
          rgba(16,23,10,0) 100%
        );
        background-origin: padding-box;
        background-size: auto;
        box-shadow: #FFF 1px 0 0 0;
        content: " ";
        font-size: 0;
        display: block;
        height: 48px;
        width: 1px;
      }
      
    }
  }/* > header */
  
  > main {
    padding: 0 10px;
  }
  /* content styling in own file */
  
  > footer {
    margin-top: 50px;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background-color: $lightGrey;
    padding: 20px 0;
    text-align: center;
  }/* > footer */
  
}

// Specify the color of the selection
::-moz-selection {
  color: #fff;
  background: $color_link;
}
::selection {
  color: #fff;
  background: $color_link;
}