/*
 *  Copyright 2009-2010 Games by Major Fracas
 *  Copyright 2009-2010 David Calhoun
 *
 */

    body, html/*, #container*/ {
         margin: 0px;
         padding: 0px;
         height: 400px;
         text-align: center;
    }
    .ie body, .ie html {
        text-align: left;
    }
    body {
         background: url(board.png);
         font-family: Trebuchet MS, Verdana, Helvetica, Arial, san-serif;
         font-size: 10pt;
      }
    #container {
         float: left;
    }
      #gameboard {
         position: absolute; /* test */
         top: 70px; /* test */
         left:0px; /* test */
         margin-top: 10px;
         margin-right: 10px;
         margin-left: 10px;
         width: 400px;
         height: 350px;
      }
      .titlebar {
         text-align: center;
         margin: 0px;
         padding-bottom: 5px;
         color: #6c4f0c;
         font-size: 1.4em;
      }
      .tile {
         position: absolute;
      }
      .small {
         height: 57px;
         width: 57px;
      }
      .large {
         height: 76px;
         width: 76px;
      }
       .face {
         position: absolute;
         border-radius: 6px;
         -webkit-border-radius: 6px;
         -moz-border-radius: 6px;
         -opera-border-radius: 6px;
       }
       .face.front {
         color: #fff;
         display: block;
         /*background-color: #800;*/
       }
      .tile.flipped .face.front {
         /*visibility: hidden;*/
         display: none;
       }
       .face.back {
         color: #000;
         display: none;
         /*background-color: #008;*/
       }
       .tile.flipped .face.back {
         display: block;
       }
       .bonusPic {
         position: absolute;
         width: 400px;
         height: 300px;
         left: 0px;
         top: 70px;
       }
       #resources {
         visibility: hidden;
       }
      .board {
      }
       .boardface {
         position: absolute;
         width: 400px;
         height: 350px;
         border-radius: 6px;
         -webkit-border-radius: 6px;
         -moz-border-radius: 6px;
         -opera-border-radius: 6px;
       }
/*       .ie .boardface {
          left: 0px;
          top: 0px;
          left: 74px;
          top: 35px;
       }*/
/*       #scoreboard {
         position: absolute;
         top: 100px;
         background: white;
         border: black 2px solid;
         margins: 10px;
         -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.5);
         -webkit-transition: opacity 0.5s ease-in-out;
       }*/ 
       #scoreboard.hidden {
         /*visibility: hidden;*/
         display: none;
         /*opacity: 0.0;*/
       }
       #scoreboard.visible {
         /*visibility: visible;*/
         display: block;
         /*opacity: 1.0;*/
       }
       #titlescreen {
          position: absolute;
          width: 220px;
          left: 50%;
          margin-left: -160px;
          top: 110px;
          /*-webkit-transition: opacity 0.5s ease-in-out;*/
       }
       
       #titlescreen.hidden {
         /*visibility: hidden;*/
         display: none;
         /*opacity: 0.0;*/
       }
       #titlescreen.visible {
         /*visibility: visible;*/
         display: block;
         /*opacity: 1.0;*/
       }
       #titlescreen img {
         margin-left: 55px;
         margin-bottom: 15px;
       }
       #titlescreen img.second {
         margin-left: 50px;
         margin-top: -10px;
       }
       #titlescreen p {
         width: 230px;
         margin-top: 5px;
         margin-left: 25px;
       }  
       #titlescreen button {
         margin-left: 78px;
         margin-top: 10px;
         width: 120px;
         font-family: Trebuchet MS;
         font-size: 10pt;
       }
       #login {
         margin-left: 109px;
       }
       #titlescreen select,
       #scoreboard select,
       #leveltitle select,
       #levelselect select {
          font-family: Trebuchet MS;
          font-size: 10pt;
          width: 240px;
          margin-left: 10px;
       }
       #scoreboard select {
          width:190px;
          margin-top: 20px;
       }
       #scoreboard,
       #leveltitle,
       #levelselect {
          background-color:#ffffb4;
          border-style:solid;
          border-color:#ffffd4 #ddddb4 #ddddb4 #ffffd4;
          border-width:3px;
          /*-webkit-transition: opacity 0.5s ease-in-out;
          -webkit-box-shadow: 2px 2px 3px rgba(0,0,0,0.5);*/
         border-radius: 10px;
         -webkit-border-radius: 10px;
         -moz-border-radius: 10px;
         -opera-border-radius: 10px;
         padding: 20px;
       }
       #scoreboard,
       #leveltitle,
       #levelselect {
          position:absolute;
          width:260px;
          height:210px;
          top: 130px;
          left: 50%;
          margin-left: -180px;
          text-align: center;
       }
/*       .ie #scoreboard,
       .ie #leveltitle,
       .ie #levelselect {
          left: auto;
          margin-left: auto;
          margin-right: auto;
       }*/
       #leveltitle.hidden {
         visibility: hidden;
         display: none;
         opacity: 0.0;
       }
       #leveltitle.visible {
         /*visibility: visible;*/
         display: block;
         /*opacity: 1.0;*/
       }
       #levelnumber, #levelname, #leveldesc, #levelauth,
       .scoreheader, .scoredesc, .prompt {
          display: block;
          margin-top:0.25em;
          text-align: center;
       }
       #levelnumber, #levelname, #levelauth,
       .scoreheader, .prompt {
          font-weight: bold;
       }
       #levelname,
       .prompt, .scoreheader {
          font-size: 1.2em;
          margin-bottom: 0.15em;
       }
       #leveltitle button,
       #scoreboard button,
       #levelselect button {
          width: 120px;
          bottom: 190px;
          /*margin-left: 70px;
          margin-top: 25px;*/
          font-family: Trebuchet MS;
          font-size: 10pt;
          -webkit-transition: all 0.0 linear;
       }
       .notice {
          font-size:10pt;
          text-align: center;
       }
       .copyright {
          color: #6c4f0c;
          text-align: center;
          font-size:9pt;
          margin-top: -10px;
          /*padding-top:10px;*/
       }
       .copyright a {
          color: #6c4f0c;
          text-decoration: none;
       }
       .copyright.lowerleft {
          position: absolute;
          text-align: left;
          left: 20px;
          bottom: 3px;
       }
       .info {
          visibility: hidden;
       }
       #gametitle {
          position: absolute;
          top: 5px;
          left: 5px;
       }
       #ad1 {
          position: absolute;
          width: 234px;
          height: 60px;
          top: 0px;
          left: 524px;
       }
       #ad2 {
          position: absolute;
          width: 468px;
          height: 60px;
          top: 470px;
          left: 290px;
       }
       #user-info {
          position: absolute;
          top: 70px;
          left: 650px;
       }
       #activity {
          position: absolute;
          top: 70px;
          left: 650px;
       }
       #likebutton {
          position: absolute;
          top: 470px;
          left: 20px;
       }
       
       button.hidebutton {
          /*visibility: hidden;*/
          display: none;
       }
       button.showbutton {
          /*visibility: visible;*/
          display: block;
       }
       
       .spacer.canvas {
          float: left;
          height: 300px;
          width: 120px;
        }
       .scoredisplay {
          /*margin-top: -50px;
          float: left;*/
          background-color: rgba(100,100,100,0.2)
          color: #6c4f0c;
          position: absolute; /* test */
          top: 120px; /* test */
          left: 420px; /* test */
       }
       .scoredisplay.profile {
          width: 100px;
       }
       .scoredisplay.canvas {
          margin-top: -5px;
          width: 100px;
       }
       .scorehead {
          font-weight: bold;
       }
       .scoredata {
          margin-top: 0.2em;
          margin-bottom: 0.5em;
       }
       .scorehead, .scoredata {
          font-size: 1.1em;
          text-align: center;
          width: 100%;
       }

    .launch {
       width: 220px;
       display: block;
    }
    .nolaunch {
       display: none;
    }
/*    .ie .launch {
       display: none;
    }
    .ie .nolaunch {
       display: block;
       border: 1px black solid;
       background-color: #FF0;
       padding: 4px;
       left: 20px;
    }
*/