body {
  background-size: 10% 10%;
}

div#container {
  margin: 0;
  padding: 20px 0 0 0;
  position: relative;
  overflow: hidden;
}

h1 {
  font-size: 350%;
}

div#header {
  background-image: none;
  margin: 0;
  padding: 0;
}

div#header > div#header-content {
  background-image: none;
  margin: 0 0 15px 0;
  padding: 0;
  min-height: inherit;
}

div#header h2 {
  top: -5px;
  left: -5px;
  font-size: 22px;
  transform: rotate(-02deg);
  -webkit-transform:rotate(-2.5deg);
  -moz-transform:rotate(-2.5deg);
  -o-transform:rotate(-2.5deg);
  z-index: 3;
}

/** Navigation **/

div#navigation {
  position: static;
  margin: 0;
  padding: 0;
  background-image: none;
}

div#navigation div.title {
  display: none;
}

div#header div#navigation ul {
  margin: 25px 5px 5px;
  padding: 0;
  z-index: 2;
  position: relative; 
  overflow: hidden;
  background-color: rgba(255,255,255,0.2);
  width: auto;
  height: auto;
  border-radius: 6px;
  -moz-border-radius: 6px;
  -webkit-border-radius: 6px;
  box-shadow: -2px -2px 10px rgba(0,0,0,0.80);
  -moz-box-shadow: -2px -2px 10px rgba(0,0,0,0.80);
  -webkit-box-shadow: -2px -2px 10px rgba(0,0,0,0.80);
  border-style: solid;
  border-color: rgba(0,0,0,0.5);
  border-width: 0 0 1px 0px;
}

div#header div#navigation ul li {
  display: block;
  margin: 0;
  padding: 5px 10px 5px 10px;
  position: static; 
  float: left;
  transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -webkit-transform-origin: 0 0;
  -o-transform-origin: 0 0;
  border-width: 0 1px 0 1px;
  border-style: solid;
  border-color: rgba(0,0,0,0) rgba(255,255,255,0.3) rgba(0,0,0,0) rgba(0,0,0,.3);
  text-align: center;
}

div#header div#navigation ul li:hover {
  background-color: rgba(0,0,0,0.1);
  color: rgba(255,255,255,1);
  border-style: solid;
  border-color: rgba(0,0,0,0) rgba(255,255,255,0.3) rgba(0,0,0,0) rgba(0,0,0,.3);
  border-width: 0px 1px 0px 1px;
  z-index: 5;
}

div#header div#navigation ul li:nth-child(1),
div#header div#navigation ul li:nth-child(2),
div#header div#navigation ul li:nth-child(3),
div#header div#navigation ul li:nth-child(4) {
  transform:rotate(0deg);
  -moz-transform:rotate(0deg);
  -webkit-transform:rotate(0deg);
}

/** Content Area **/

div#contentarea {
  margin: 15px 30px 30px 30px;
  padding: 0;
  background-color: rgba(0,0,0,0.6);
  border-style: solid;
  border-color: rgba(255,255,255,0.3);
  border-width: 1px;
  border-radius: 10px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;  
  position: relative;
  box-shadow: 0px 0px 25px rgba(0,0,0,0.60);
  -moz-box-shadow: 0px 0px 25px rgba(0,0,0,0.90);
  -webkit-box-shadow: 0px 0px 25px rgba(0,0,0,0.60);
  min-height: 300px;
  background-image: url("images/cityscape.png");
  background-repeat: repeat-x;
  background-position: 0 100%;
}

div#contentarea > div#content {
  min-height: 300px;
  padding: 0 20px 20px 20px;
  color: #fff;
}

/* Content Items */

div.item {
  margin: 0 0 15px 0;
  padding: 0 0 5px 0;
  font-size: 11px;
}

div.item:hover {
  margin: 0 0 15px 0;
  padding: 0 0 5px 0;
  background-image: -moz-radial-gradient(top left, circle, rgba(0,0,0, 0.1) 10%, rgba(0,108,255,0.2) 65%);
  background-image: -webkit-gradient(radial, 0 0, 0, 40% 40%, 800, from(rgba(0,0,0, 0.1)), to(rgba(0,108,255,0.2)));
  transform: translate(0px, 0px) scale(1, 1);
  -moz-transform: translate(0px, 0px) scale(1, 1);
  -moz-transition-property: transform; /* FF4 */
  -moz-transition-duration: 0s; /* FF4 */
  -webkit-transform: translate(0px, 0px) scale(1, 1);
  -webkit-transition-property: transform;
  -webkit-transition-duration: 0s;
  -o-transform: translate(0px, 0px) scale(1, 1);
  position:relative;
  z-index: 20;
}

div.item:nth-child(1) {
  margin-right: 0px;
}

div.item h3 {
  margin: 0 0 0 60px;
  padding: 5px;
  text-shadow: 2px 2px 3px rgba(0,0,0,0.80);
}

div.item p {
  margin: 0 0 0 60px;
  padding: 5px;
}

div.item img {
  float: left;
  margin: -25px 0 0 -15px;
  padding: 0;
  width: 25%;
  height: auto;
}

/** Footer **/

div#footer {
  background-image: none;
  margin: 0;
  padding: 0;
}

div#footer > div#footer-content {
  background-image: none;
  margin: 0;
  padding: 0px;
  min-height: inherit;
  color: #fff;
  font-family: 'Zero&ZeroIsRegular', verdana, arial, helvetica, sans-serif;
  font-size: 14px;
}

div#footer > div#footer-content a:link {
  color: rgba(255,255,255,1);
  text-decoration: none;
  text-shadow: 2px 2px 3px rgba(0,0,0,0.80);
}

div#footer > div#footer-content p.credit {
  float: right;
  white-space:nowrap;
  transform: rotate(03deg);
  -webkit-transform:rotate(3deg);
  -moz-transform:rotate(3deg);
  -o-transform:rotate(3deg);
}

div#footer > div#footer-content a:visited {
  color: rgba(255,255,255,0.8);
  text-decoration: none;
  text-shadow: 2px 2px 3px rgba(0,0,0,0.80);
}

div#footer > div#footer-content a:hover {
  color: rgba(0,108,255,0.8);
  text-decoration: none;
  text-shadow: 2px 2px 3px rgba(0,0,0,0.80);
}