/*
   Definition of the graphical elements of the pong game.
   
   Warren Sack <wsack@ucsc.edu>
*/


      /* Define the size, layout and colors of the pong playing area. */
       #playingArea{   
            position: absolute;
            left: 20;
            z-index: 1;
            border: 5px solid rgb(255,255,255);
            width: 600;
            height: 500;
            background-color: white;
        }
        /* Define the position and size of the left and right paddles.
           The paddles are small images 16 pixels wide by 64 pixels high.
           The image file "paddle.gif" is used to represent both paddles. */
        #leftPaddle{
            position: absolute;
            top: 218;
            left: 0;
            opacity:.50;
            filter: alpha(opacity=50); 
            -moz-opacity: 0.5;
            z-index: 1;
            width: 16;
            height: 64;
        }
        #rightPaddle{
            position: absolute;
            top: 218;
            left: 584;
            opacity:.50;
            filter: alpha(opacity=50); 
            -moz-opacity: 0.5;
            z-index: 1;
            width: 16;
            height: 64;
        }
        /* Define the position and size of the ball.  The ball is a
           small image 16 pixels wide by 16 high.  The image file
           "ball.gif" is used to represent the ball. */
        #ball{
            position: absolute;
            top: 4;
            left: 200;
            opacity:.50;
            filter: alpha(opacity=50); 
            -moz-opacity: 0.5;
            z-index: 1;
            width: 16;
            height: 16;
        }
        /* Define elements leftScore and rightScore to hold
           the current scores of the left and right players
           respectively.  Position the scores at the bottom
           of the playing area. */
        #leftScore{
            position: absolute;
            top: 486;
            left: 0;
            opacity:.50;
            filter: alpha(opacity=50); 
            -moz-opacity: 0.5;
            width: 300;
            height: 14;
            font-size: 14pt;
            font-family: Arial, sans-serif;
            style: bold;
            color: white;
            background-color: white;
        }
        #rightScore{
            position: absolute;
            top: 486;
            left: 300;
            opacity:.50;
            filter: alpha(opacity=50); 
            -moz-opacity: 0.5;
            width: 300;
            height: 14;
            font-size: 14pt;
            font-family: Arial, sans-serif;
            style: bold;
            color: white;
            background-color: white;
        }