* {margin: 0; padding: 0; border:0;}
    
    body {
      background-color:#333;
       background-repeat: repeat;
        }
    body, table {
      font-family: 'Segoe UI', helvetica, arial, verdana;
      font-size:1em;
    }
    /*headings*/
    #headline {
      background: white;
      border: 0 none;
      border-radius: 15px;
      box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
      width:480px;
      margin: 10px auto;
      text-align:center;
      display:block;
      cursor: pointer;
    }
    #headline img {
      width:120px;
      float:right;
      margin: 10px 50px 10px 0;
    }
    #headline div {
      padding-top:25px;
    }
    #headline .title {
      font-weight:bold;
      font-size: 24px;
      color: #005785;
      width:200px;
    }
    #headline a {
      color: #005785;
      text-decoration:none;
    }
    #headline a:hover span, #headline a:active span  {
      color: #0893d4;
    }
    /*buttons*/
    .ResetButton, .RandomButton {
      display:none;
      background: #2c3e50;
      font-weight: bold;
      color: white;
      border: 0 none;
      border-radius: 5px;
      cursor: pointer;
      margin: 10px auto 20px;
      padding:10px;
      width:250px;
      text-align:center;
    }
    .ResetButton:hover, .ResetButton:focus, .RandomButton:hover, .RandomButton:focus {
      box-shadow: 0 0 0 2px white, 0 0 0 3px #2c3e50;
    }
    .ResetButton a, .RandomButton a {
      text-decoration:none;
      color:#fff;
    }
    .RandomButton {
      display:block;
    }
    h2 {
      font-size:15px;
      font-weight:bold;
      margin-bottom:10px;
    }
    #container {
      margin: 0 auto;
    }
    /*form styles*/
    #msform {
      width:480px;
      margin: 0 auto;
      text-align: center;
      position: relative;
      clear:both;
    }
    #msform fieldset {
    }
    #optionscontainer {
      background: white;
      border: 0 none;
      border-radius: 15px;
      box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
      padding: 20px 30px;
    }
    /*Hide all except first fieldset*/
    #msform fieldset:not(:first-of-type) {
       display: none; 
    }
    /*inputs*/
    #msform input, #msform textarea, #msform select {
      padding: 15px;
      border: 1px solid #ccc;
      border-radius: 3px;
      margin-bottom: 10px;
      width: 100%;
      font-family: arial, verdana;
      color: #2C3E50;
      font-size: 13px;
    }
    #Step5 span {
      cursor: pointer;
    }
    
    .checkbox {
      padding-right:4px !important;
      vertical-align:top;
    }
    .checkbox input {
      width: auto !important;
      margin-right:4px !important;
    }
    #loading-image {
      margin:0 auto;
      font-size:12px;
      color:#2c3e50;
      padding:5px;
      background-color:#fff;
      border: 0 none;
      border-radius: 15px;
      box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
      margin-bottom:5px;
      width:150px;
      text-align:center;
      display:none;
    }
    #loading-image table {
      margin:0 auto;
    }  
    #ListView {
      display:none;
      width:800px;
      background: white;
      border: 0 none;
      border-radius: 15px;
      box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
      margin:10px auto;
      text-align:left;
      padding-bottom:10px;
      font-size:11px;
      line-height:15px;
    }
    #ListView th {
      vertical-align:bottom;
    }
    #ListView th, #ListView td {
      padding:5px 10px;
    }    
    #ListTable {
      width:100%;
    }
    
    #ListView  .ascdesc  {
      font-size:10px;
      font-weight:normal;
    }
    .count, .pagination {
      text-align:center;
    }
    .GameLink  span, #ListView  .ascdesc  span, .pagination span {
      color:#005785;
      cursor: pointer;
    }
    
    .pagination span {
      display:inline-block;
      width:50px;
    }
    .AllGamesLink {
      display:block;
      text-decoration:underline;
      color:#005785;
      cursor: pointer;
      font-size:10px;
    }
    #Game {
      display:none;
      width:800px;
      background: white;
      border: 0 none;
      border-radius: 15px;
      box-shadow: 0 0 15px 1px rgba(0, 0, 0, 0.4);
      margin:10px auto;
      text-align:center;
      padding-bottom:10px;
    }
    #Step4, #Step5 {
      padding: 10px 20px;
    }
    #Step5 span {
      max-width:190px;
    }
    #Step5 img {
      border: 0 none;
      border-radius: 15px;    
      margin:5px;
      max-width:180px;
    }
    #Gameimage {
      float:left;  
      margin: 0 20px 20px 0;
    }
    #GameThumb {
      display:none;
    }
    #Gameimage img {
      max-width:300px;
      border: 0 none;
      border-radius: 15px;    
    }
    #Gameyearpublished {
      font-size:12px;
      font-style:italic;
    }
    #GameTitle, h1 {
      font-weight:bold;
      font-size:28px;
    }
    #DetailsBox {
      text-align:left;
      padding-top:10px;
    }
    #PlayerBox {
      border: 2px solid #2C3E50;
      border-radius: 15px;
      float: right;
      margin: 0 0 10px 10px;
      padding: 10px;
      width: 150px;
      background-color:#ebf0f4;
      font-size:12px;
    }
    br {
      line-height:1px;
      font-size:1px;
      height:1px;
    }
    #GameBackground {
      position:fixed;
      bottom:0;
      right:0;
      color:fff;
      cursor: pointer;
    }
    #GameBackground  a {
      color:#fff;
      text-decoration:underline;
    }
    #GameBackground  #textbox {
      background-color:#000;
     padding:5px;
     font-size:11px;
      
    }
    #GameBackground img {
    }
    #Permalink, #BGGEntry { 
      padding-top:10px; 
    }
    tr.row1 td{
      background-color:#CBD8D7;
      
    }
    tr.row2 td{
      background-color:#ACC1C0;
    }
    th.SortName {
      background-color:#ACADC1;
      border-top-left-radius: 15px;
    }
    th.SortYear, th.SortMin, th.SortMax, th.SortTime, th.SortRate {
      background-color:#ACADC1;
    }
    th.SortRate {
      background-color:#ACADC1;
      border-top-right-radius: 15px;
    }
    tr.row1 td.SortName, tr.row1 td.SortYear, tr.row1 td.SortMin, tr.row1 td.SortMax, tr.row1 td.SortTime, tr.row1 td.SortRate {
      background-color:#DFC9ED !important;
    }
    tr.row2 td.SortName, tr.row2 td.SortYear, tr.row2 td.SortMin, tr.row2 td.SortMax, tr.row2 td.SortTime, tr.row2 td.SortRate {
      background-color:#CAA6E1 !important;
    }

    @media only screen and (min-width: 0px) and (max-width: 497px) {
      #container, #msform, #Game, #headline, #RecommendedGames {
        width:100% !important;
        max-width: 100% !important;
        min-width:320px;
      }
      #headline {
        text-align:center;
        padding-left:0;
        width:auto;
      }
      #headline  div {
        padding-top:0;
      }
      #headline .title {
        font-size:18px;
      }
      #headline .title br {
        display:inline;
      }
      #headline .title br:after
           {
        content:" ";
      } 
      #Gameimage {
        display:none;
      }
      #GameThumb {
        display:block;
        width:150px;
        margin: 0 auto 10p 0;
      }
      #GameThumb img {
        width:150px;
        border: 0 none;
        border-radius: 5px;    
      }
      .ResetButton {
        max-width: 100% !important;
      }
      #headline img {
        width:60px;
      }
      #GameBackground {
        display:none;
      }
      #Step5 img {
        max-width:60px;
      }
      .RandomButton {
        max-width: 100% !important;
      }
      #ListView, #ListTable {
        width: auto !important;
        min-width:320px;
      }
      .AllGamesLink { 
        font-size:10px; 
      }
      #ListTable th, #ListTable td {
        padding:1px 0px;
        font-size:9px;
      }    
    }
    @media only screen and (min-width: 497px) and (max-width: 900px) {
      #GameBackground {
        display:none;
      }
    }