body
{
  background-color:#000000;
  overflow:none;
  color:#FFFFFF;
  font-family:sans-serif;
}

a:link 
{ 
  color:#FFFFB0;
}

a:visited 
{
  color:#FFFFB0;
} 

a:hover 
{
  color:#FFFFE0;
  font-weight:bold;
}

a:active 
{
  color:#FFFFB0;
}

.unselectable
{
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;

}

/* 
  Main Container for Application 
*/
  div#MAIN
  {
    position:relative;
    width:800px;
    height:600px;
    border:1px solid #FFFFFF;
    margin:0px auto 0px auto;
    background:url('../images/misc/backgradient.png') repeat-x;
  }

/* 
  Awesome Message 
*/
  div#AWESOME_MESSAGE_DIALOG
  {
    position:absolute;
    width:300px;
    height:200px;
    top:200px;
    left:250px;
    border:5px solid #FFFFB0;
    background:url('../images/misc/backgradient.png') repeat-x;
    text-align:center;
    padding:0px 0px 0px 0px;
    margin:0px 0px 0px 0px;
    z-index:100;
    display:none;
  }

  table#AWESOME_MESSAGE_TABLE
  {
    position:relative;
    top:0px;
    width:100%;
    text-align:center;
  }

  #SHARE_LINK_TEXT
  {
    width:288px;
  }

  td#AWESOME_MESSAGE
  {
    height:200px;
    text-align:center;
  }

  div#AWESOME_MESSAGE_HIDE_BUTTON
  {
    position:absolute;
    cursor:pointer;
    bottom:0px;
    width:100px;
    margin-left:94px;
    padding:2px 2px 2px 2px;
    border-left:2px solid #FFFFB0;
    border-right:2px solid #FFFFB0;
    border-top:2px solid #FFFFB0;
    background-color:#FFFFB0;
    color:#000000;
    font-weight:bold;
  }

/* 
  Container for Awesome Logo 
*/
  div#AWESOME_LOGO
  {
    background:url('../images/logos/awesomenauts.png') no-repeat center;
    background-size:contain;
    width:750px;
    height:80px;
    margin:0px auto 10px auto;
  }


/* 
  Container handling Portrait Titles and Images 
*/
  div#LEFT_COLUMN
  {
    display:none;
    margin:0px 10px 0px 10px;
    width:305px;
    height:500px;
    font-size:30px;
    text-align:center;
    float:left;
  }

  div#PORTRAIT_TITLE
  {
    height:70px;
    font-size:19px;
  }

  div#PORTRAIT
  {
    width:305px;
    height:425px;
    margin:0px auto 0px auto;
  }

/* 
  Container for Messages
*/
  div#MESSAGES
  {
    padding-top:150px;
    font-size:25px;
    text-align:center;
  }


/* 
  Container for Awesomenaut Selector, Phrase Buttons, and VCR Controls 
*/
  div#RIGHT_COLUMN
  {
    display:none;
    width:465px;
    height:500px;
    float:left;
    margin:0px 0px 0px 0px;
    padding:0px 0px 0px 0px;
    text-align:center;
  }

  div#AWESOMENAUTS_SELECTOR
  {
    width:465px;
    height:70px;
  }

  div#PHRASES
  {
    position:relative;
    height:400px;
    width:465px;
    font-size:25px;
    padding-top:10px;
  }

  div#VCR
  {
    display:none;
    width:465px;
    height:25px;
  }

  div#CREDITS
  {
    font-size:10px;
    text-align:center;
  }

/*
  VCR Controls
*/
  div#VCR_LABEL
  {
    position:relative;
    font-size:18px;
    font-weight:bold;
    color:#FFFFB0;
    top:5px;
    float:left;
    margin-left:45px;
  }

  div#VCR_CONTROLS
  {
    float:left;
    margin-left:10px;
    padding:1px 10px 1px 0px;
    width:440px;
    height:25px;
    /*background-color:#111100;*/
    /*background:url('../images/vcr/background.png') center no-repeat;*/
  }

  div#RECORD_STOP
  {
    float:left;
    margin:0px 10px 0px 15px;
  }

  div#PLAY_BUTTON
  {
    background:url('../images/vcr/play.png') center no-repeat; 
    background-size:contain;
    float:left;
    width:92px;
    height:18px;
    cursor:pointer;
    margin-left:30px;
  }

  div#PLAY_SHARE_BUTTON
  {
    position:relative;
    top:6px;
    background:url('../images/vcr/play.png') center no-repeat; 
    background-size:contain;
    float:left;
    width:92px;
    height:18px;
    cursor:pointer;

  }

  div#RECORD_BUTTON
  {
    background:url('../images/vcr/record.png') center no-repeat;
    background-size:contain;
    width:119px;
    height:18px;
    cursor:pointer;
    float:left;
  }

  div#STOP_BUTTON
  {
    background:url('../images/vcr/stop.png') center no-repeat;
    background-size:contain;
    float:left;
    width:119px;
    height:18px;
    cursor:pointer;
    display:none;
  }

  div#SHARE_BUTTON
  {
    position:relative;
    float:left;
    cursor:pointer;
    background:url('../images/vcr/share.png') center no-repeat;
    background-size:contain;
    width:87px;
    height:18px;
    margin-left:50px;
  }

  div#MAKE_YOURS_BUTTON
  {
    position:relative;
    float:left;
    cursor:pointer;
    /*
    background:url('../images/vcr/share.png') center no-repeat;
    background-size:contain;
    */
    padding:5px 5px 5px 5px;
    margin-left:25px;
    text-align:center;
  }

/*
  Awesome Sharing Rules
*/
  td#PHRASES_MESSAGE
  {
    height:400px;
    width:465px;
    text-align:center;
    font-size:40px;
  }

/*
  Classes for JavaScript Created Objects
*/
  div.AWESOME_ICON
  {
    float:left;
    margin:0px 5px 0px 2px;
    cursor:pointer;
  }

  div.PHRASE_BUTTON
  {
    position:absolute;
    font-size:25px;
    cursor:pointer;
    padding:2px 2px 2px 2px;
    white-space:nowrap;
    overflow:hidden;
  }


/*
  Help CSS
*/

div#HELP
{
  text-align:left;
  font-size:19px;
  margin-top:100px;
  font-weight:bold;
  color:#FFFFB0;
}

div#VCR_HELP
{
  margin-top:15px;
  margin-left:15px;
  font-size:15px;
  color:#FFFFFF;
}