topical media & game development

talk show tell print

mobile-game-ch20-blob-clicker-public-style.css / css



  body { 
    font-family:arial;
    width:320px; height:416px; margin:0 auto; 
  }
  
  #title-screen { 
    width:320px;
    height:416px;
    background:url(mobile-game-ch20-blob-clicker-public-images-title.png) no-repeat left top; 
    position:relative;
  }
  
  #login { position:absolute; top:75%; left: 130px; }
  
  #main-screen {
    width:320px;
    height:416px;
    background:url(mobile-game-ch20-blob-clicker-public-images-interior.png) no-repeat left top; 
    position:relative;
  }
  
  h1 {
    position:absolute;
    top:30px;
    font-size:14px;
    width:100%;
    text-align:center;
    color:#8cc63f;
  }
  
  #blob {
    width:252px;
    padding-top:232px;
    background:url(mobile-game-ch20-blob-clicker-public-images-blob.png) no-repeat left top;
    top:105px;
    cursor:pointer;
    position:absolute;
    text-align:center;
    left:20px;
    color:#6f8d4a;
  }
  #blob:hover {
    -webkit-transform:rotate(2deg);
  
  }
  
  #clicks {
    font-size:24px;
    text-align:center;
    width:100%;
    top:55px;
    font-weight:bold;
    position:absolute;
    color:#8cc63f;
  }
  
  show-top-ten, #hide-top-ten {
    color:white;
    position:absolute;
    text-decoration:underline;
    bottom:10px;
    right:5px;
  }
  
  #hide-top-ten { display:none; }
  
  #top-ten {
    display:none;
    left:40px;
    color:#6f8d4a;
    position:absolute;
    top:90px;
  }
  


(C) Æliens 04/09/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.