/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

    #back {
      position: absolute;
      left: 0px;
      top: 0px;
      width: 100%;
      height: 100%;
      z-index:-1;
    }

    #video {
      position: fixed;
      right: 0;
      bottom: 0;
      min-width: 100%; 
      min-height: 100%;
    }
    
    #buttons {
      width:100%;    
      text-align: center;        
      /*position: absolute; 
      */
      vertical-align: middle;
      top: 5%;
    }
    
    #button-content {
      width:100%;    
      text-align: center;        
      vertical-align: middle;
    }

    #button-content-right {
      width:100%;    
      text-align: right;        
      vertical-align: middle;
    }
    
    #content {
      background-color: rgba(0, 0, 0, 0.8);
      max-width:800px;    
      text-align: center;        
      display: block;
      margin-left: auto;
      margin-right: auto;
      border: 1px solid white;
      margin-top:20px;
    }
    
    #neotag {
      position: absolute;
      bottom: 15px;
      right: 15px;
    }
    
    .track {
      text-align: center;
      margin-left: auto;
      margin-right: auto;
      margin-top:2px;      
      margin-bottom:2px;      
      padding-top:0px;
      padding-bottom:5px;
    }
    
    .button {
        font-family: 'Work Sans', sans-serif;
        font-size: 20px;
        color: rgba(255, 255, 255, 1);
        display: inline-block;
        background: rgba(0, 0, 0, 0.35);
        min-width:200px;
        /*min-height:35px; */
        padding-top:5px;
        padding-bottom:5px;
        padding-left:10px;
        padding-right:10px;
        margin:15px;    
        border: 1px solid white;
        text-align: center;        
        vertical-align: middle;
        text-transform: uppercase;
    }
    
    .button-rcoil {
        font-family: 'Work Sans', sans-serif;
        font-size: 20px;
        color: rgba(255, 255, 255, 1);
        display: inline-block;
        background-image: url("/rcoil/rcoil6.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        min-width:250px;
        min-height:35px;
        padding-top:125px;
        padding-bottom:5px;
        padding-left:5px;
        padding-right:15px;
        margin:15px;    
        border: 1px solid white;
        text-align: center;        
        vertical-align: bottom;
        text-transform: uppercase;
    }

    .button-bd {
        font-family: 'Work Sans', sans-serif;
        font-size: 20px;
        color: rgba(255, 255, 255, 1);
        display: inline-block;
        background-image: url("/bytedriver/__laser.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        min-width:250px;
        min-height:35px;
        padding-top:125px;
        padding-bottom:5px;
        padding-left:5px;
        padding-right:15px;
        margin:15px;    
        border: 1px solid white;
        text-align: center;        
        vertical-align: bottom;
        text-transform: uppercase;
    }

    .button-bd:hover {
        font-size: 20px;
        background-image: url("/bytedriver/bdbg.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 1px solid rgba(200, 0, 255, 1);
    }
    
    .button-chess {
        font-family: 'Work Sans', sans-serif;
        font-size: 20px;
        color: rgba(255, 255, 255, 1);
        display: inline-block;
        background-image: url("/radicalchess/lelvelup.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        min-width:250px;
        min-height:35px;
        padding-top:125px;
        padding-bottom:5px;
        padding-left:5px;
        padding-right:15px;
        margin:15px;    
        border: 1px solid white;
        text-align: center;        
        vertical-align: bottom;
        text-transform: uppercase;
    }

    .button-chess:hover {
        font-size: 20px;
        background-image: url("/radicalchess/lelvelup.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 1px solid rgba(200, 0, 255, 1);
    }

    .button-sol {
        font-family: 'Work Sans', sans-serif;
        font-size: 20px;
        color: rgba(255, 255, 255, 1);
        display: inline-block;
        background-image: url("/radicalsolitaire/claw.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        min-width:250px;
        min-height:35px;
        padding-top:125px;
        padding-bottom:5px;
        padding-left:5px;
        padding-right:15px;
        margin:15px;    
        border: 1px solid white;
        text-align: center;        
        vertical-align: bottom;
        text-transform: uppercase;
    }
    
    .button-sol:hover {
        font-size: 0px;
        background-image: url("/radicalsolitaire/title.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 1px solid rgba(200, 0, 255, 1);
    }
    
    .button-rldd {
        font-family: 'Work Sans', sans-serif;
        font-size: 14px;
        color: rgba(255, 255, 255, 1);
        display: inline-block;
        background-image: url("/rldd/rldd0017.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        min-width:250px;
        min-height:35px;
        padding-top:125px;
        padding-bottom:5px;
        padding-left:5px;
        padding-right:15px;
        margin:15px;    
        border: 1px solid white;
        text-align: center;        
        vertical-align: bottom;
        text-transform: uppercase;
    }

    .button-rldd:hover {
        font-size: 0px;
        background-image: url("/rldd/rldd002.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 1px solid rgba(200, 0, 255, 1);
    }

    .button-rcoil:hover {
        font-size: 0px;
        background-image: url("/rcoil/rcoil3.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 1px solid rgba(200, 0, 255, 1);
    }

    .iframe {
        color: rgba(255, 255, 255, 1);
        display: inline-block;
        background: rgba(0, 0, 0, 0.35);
        min-width:250px;
        padding:10px;
        margin:15px;    
        border: 1px solid white;
        text-align: center;        
        vertical-align: middle;
        text-transform: uppercase;
    }
    
    .button:hover {
        background-image: url("/radicalsolitaire/bg.gif");
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        border: 1px solid rgba(200, 0, 255, 1);
    }
    
    .body-logo {
        background-color: rgb(0, 0, 0);
        background-image: url("/VH_BG.gif");
        background-position: center center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    .body {
        background-color: rgb(0, 0, 0);
    }

    .body-rldd {
        background-color: rgb(0, 0, 0);
        background-image: url("/rldd/savedisco.gif");
        background-position: center center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .body-bd {
        background-color: rgb(0, 0, 0);
        background-image: url("/bytedriver/bdbg.gif");
        background-position: center center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .body-rcoil {
        background-image: url("/rcoil/rcoil7.gif");
        background-position: center center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .body-chess {
        background-image: url("/radicalchess/lelvelup.gif");
        background-position: center center;
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-size: cover;
    }

    .body-sol {
        background-image: url("/radicalsolitaire/fish.gif");
        background-position: center top;
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    #content img {
      display: block;
      margin-left: auto;
      margin-right: auto;
      width: 80%;
    }
    
    h1 {
        display: inline-block;
        font-family: 'Work Sans', sans-serif;
        font-size: 50px;
        color: #ffffff;
        padding:10px;
        margin:15px;    
        text-align: center;        
        vertical-align: middle;
        text-transform: uppercase;
        background-color: rgb(0, 0, 0);
        background-image: url("/radicalsolitaire/bg.gif");
    }

    h2 {
        font-family: 'Work Sans', sans-serif;
        font-size: 25px;
        color: #ffffff;
        padding:10px;
        margin:15px;    
        text-align: center;        
        vertical-align: middle;
        text-transform: uppercase;
    }

    h3 {
        font-family: 'Work Sans', sans-serif;
        font-size: 10px;
        color: #eeeeee;
        padding:10px;
        margin:15px;    
        text-align: center;        
        vertical-align: middle;
        text-transform: uppercase;
    }

    h4 {
        font-family: 'Work Sans', sans-serif;
        font-size: 12px;
        color: #aaaaaa;
        padding:10px;
        margin:15px;    
        text-align: left;        
        vertical-align: middle;
        text-transform: uppercase;
    }
    
    p {
        font-family: 'Work Sans', sans-serif;
        font-size: 15px;
        color: #bbbbbb;
        padding:10px;
        margin:15px;    
        text-align: left;        
        vertical-align: middle;
        text-transform: uppercase;
    }
    
    /* unvisited link */
    a:link {
      color: #ccccff;
      text-decoration: none;
    }
    
    /* visited link */
    a:visited {
      color: #ccccff;
      text-decoration: none;
    }
    
    /* mouse over link */
    a:hover {
      color: #ffffff;
      text-decoration: underline;
    }
    
    /* selected link */
    a:active {
      color: #ffffff;
      text-decoration: none;
    }
    
    
@media screen and (max-width: 992px) {
    a:hover {
      color: #ffffff;
      text-decoration: none;
    }
  
    #neotag {
      position: relative;
      display: block;
      margin-top:60px;
      float:right;
    }
    
    #back {
      display: none;
      position: absolute;
    }


    .body {
        background-color: rgb(30, 20, 0);
        background-image: none;
    }

    .body-rldd {
        background-color: rgb(0, 0, 0);
        background-image: none;
    }

    .body-bd {
        background-color: rgb(0, 0, 0);
        background-image: none;
    }

    .body-rcoil {
        background-color: rgb(0, 0, 0);
        background-image: none;
    }

    .body-chess {
        background-color: rgb(0, 0, 0);
        background-image: none;
    }

    .body-sol {
        background-color: rgb(0, 0, 0);
        background-image: none;
    }
    
    .button {
        font-size: 30px;
        display: block;
        text-align: center;        
        margin-bottom:40px;    
    }

    .button:hover {
        font-size: 30px;
        background-image: none;
        border: 1px solid rgba(200, 0, 255, 1);
    }
    
    .button-rcoil {
        font-size: 40px;
        display: block;
        text-align: center;        
        background-image: url("/m_img/m_rcoil.gif");
        margin-bottom:60px;    
    }
    
    .button-rcoil:hover {
        font-size: 40px;
        background-image: url("/m_img/m_rcoil.gif");
    }

    .button-bd {
        font-size: 40px;
        display: block;
        text-align: center;        
        background-image: url("/m_img/m_bd.gif");
        margin-bottom:60px;    
    }

    .button-bd:hover {
        font-size: 40px;
        background-image: url("/m_img/m_bd.gif");
    }
    
    .button-chess {
        font-size: 40px;
        display: block;
        text-align: center;        
        background-image: url("/m_img/m_rc.gif");
        margin-bottom:60px;    
    }

    .button-chess:hover {
        font-size: 40px;
        background-image: url("/m_img/m_rc.gif");
    }

    .button-sol {
        font-size: 40px;
        display: block;
        text-align: center;        
        background-image: url("/m_img/m_rs.gif");
        margin-bottom:60px;    
    }
    
    .button-sol:hover {
        font-size: 40px;
        background-image: url("/m_img/m_rs.gif");
    }
    
    .button-rldd {
        font-size: 28px;
        display: block;
        text-align: center;        
        background-image: url("/m_img/m_rldd.gif");
        margin-bottom:60px;    
    }

    .button-rldd:hover {
        font-size: 28px;
        background-image: url("/m_img/m_rldd.gif");
    }

}