html{overflow-y:scroll; height:100%}
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,pre,address,cite,code,del,em,img,small,strong,sub,sup,b,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
body { color:#f5f5f5; line-height:1; }
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; }
ul { list-style:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; }
input,select { vertical-align:middle; }

/*html{background:#000 url(/images/left-bar.png) no-repeat left top; }*/
body{/*background:url(/images/right-bar.png) no-repeat right top; */ background:#000; height:100%; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif}

p{line-height:1.2em}
div,a{-webkit-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box; }
a{color:#fff;}
dl{margin:10px 0; }
dt{font-size:2em; margin-bottom:5px; color:yellow; text-shadow:2px 2px 2px #000}
dd{font-size:1em; margin-bottom:5px;}
.bullet li{
  background:url(/images/bullet.gif) 0 1px no-repeat;
  padding-left:25px;
  line-height:1.2em;
}
.clear{float:none; clear:both}
/*** wrapper ***/
#wrapper{
  position:relative; 
  width:950px; 
  margin:0 auto; 
  background:#555; 
  padding-bottom:80px;
  -webkit-box-shadow:0 0 50px 20px #06C; 
  -moz-box-shadow:0 0 50px 20px #06C; 
  box-shadow:0 0 50px 20px #06C;
  border-left:1px solid #06c;
  border-right:1px solid #06c;
  behavior:url(/PIE.htc);
}

/*** nav ***/
header{
  height:250px;
  padding:20px; 
  background:#444 url(/images/chicago-skyline.jpg) -20px -60px repeat-x;
  margin-bottom:50px;
  border-top:1px solid #06c;
  border-bottom:1px solid #06c;
}
/*** content ***/
section{ padding:20px}
section p{margin-bottom:30px}
section img{
  border:3px solid #fff;
  -webkit-box-shadow:5px 5px 5px #000;
  -moz-box-shadow:5px 5px 5px #000;
  box-shadow:5px 5px 5px #000;  
}

/*** img rotate degrees ***/
.deg-5 {
  -webkit-transform: rotate(-5deg);
  -moz-transform: rotate(-5deg);
  -ms-transform: rotate(-5deg);
  transform: rotate(-5deg);
}
.deg-10{
  -webkit-transform: rotate(-10deg);
  -moz-transform: rotate(-10deg);
  -ms-transform: rotate(-10deg);
  transform: rotate(-10deg);
}
.deg-15{
  -webkit-transform: rotate(-15deg);
  -moz-transform: rotate(-15deg);
  -ms-transform: rotate(-15deg);
  transform: rotate(-15deg);
}
.deg5{
  -webkit-transform: rotate(5deg);
  -moz-transform: rotate(5deg);
  -ms-transform: rotate(5deg);
  transform: rotate(5deg);
}
.deg10{
  -webkit-transform: rotate(10deg);
  -moz-transform: rotate(10deg);
  -ms-transform: rotate(10deg);
  transform: rotate(10deg);
}
.deg15{
   -webkit-transform: rotate(15deg);
  -moz-transform: rotate(15deg);
  -ms-transform: rotate(15deg);
  transform: rotate(15deg);
}
.w30{
  width:30%;
  float:left;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}
.w40{
  width:40%;
  float:left;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}
.w50{
  width:50%;
  float:left;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}
.w60{
  width:60%;
  float:left;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}
.w70{
  width:70%;
  float:left;
  -webkit-box-sizing:border-box;
  -moz-box-sizing:border-box;
  box-sizing:border-box;
}
.right{text-align:right}
h1{ position:absolute; top:320px; font-size:24px; text-shadow:2px 2px 2px #000}
h2{ background:#005177; color:#FC0; border-top:1px solid #06c; border-bottom:1px solid #06c; padding:5px 0 5px 20px; font-size:24px; margin:0 -20px .5em -20px; text-shadow:2px 2px 2px #000}
h3{ font-size:20px; margin:20px 0 .5em 0; color:#fff; text-shadow:2px 2px 2px #000}
h4{ font-size:20px; font-weight:normal; margin:20px 0 .5em 0; text-shadow:2px 2px 2px #000}
nav{
  position:relative;
  top:-10px;
  right:0;
  float:right;
  text-align:right;
}
nav li{
  float:left;
  border-left:1px solid #fff;
  margin-left:10px;
  padding-left:10px;
}
nav li:first-child{
  border-left:none;
  margin-left:0;
  padding-left:0;
}
nav li a{
  font-size:16px;
  color:#fff;
  margin:0;
}
.nav a + span{
   opacity:.7;
   filter:alpha(opacity:70%);
}

#water-damage a:hover + span,
#biohazard a:hover + span,
#fire-damage a:hover + span,
#construction a:hover + span{
   opacity:1;
   filter:alpha(opacity:100%);
}
#water-damage,
#biohazard,
#fire-damage,
#construction{
  position:absolute;
  bottom:-260px;
  width:98px;
  height:223px;
  border:1px solid #fff;
  margin:0;
  padding:0;
}

#water-damage span,
#biohazard span,
#fire-damage span,
#construction span{
  position:absolute;
  top:0;
  left:0;
  height:177px;
  width:98px;
  display:block;    
}

#water-damage{ background:#009bed; right:324px }
#water-damage span{ background:#009bed url(/images/nav-water-damage.jpg) 0 0 no-repeat }

#biohazard{ background:#8ace21; right:216px }
#biohazard span{ background:#8ace21 url(/images/nav-biohazard.jpg) 0 0 no-repeat }

#fire-damage{ background:#ea2119; right:108px }
#fire-damage span{ background:#ea2119 url(/images/nav-fire-damage.jpg) 0 0 no-repeat }

#construction{ background:#f87d13; right:0 }
#construction span{ background:#f87d13 url(/images/nav-construction.jpg) 0 0 no-repeat }

#water-damage a,
#biohazard a,
#fire-damage a,
#construction a{
  display:block;
  position:absolute;
  bottom:0;
  left:0;
  height:29px;
  width:88px;
  text-decoration:none;
  font-size:12.5px;
  font-family:Arial;
  font-variant:small-caps;
  font-weight:bold;   
  border-top:1px solid #fff;
  padding:10px 5px 6px 5px;
  text-align:left;
}
#emergency{
  position:absolute;
  bottom:-277px;
  left:-565px;
  border:none;
  width:378px;
  height:100px;
  display:block;
}
#emergency a{
  display:block;
  width:378px;
  height:100px;
  line-height:100px;
  text-align:left;
  text-indent:130px;
  background:url(/images/report-emergency-bg.png) 0 0 no-repeat;
  color:#fff;
  outline:none;
}
#emergency a:active,
#emergency a:link{outline:none}
#emergency a:hover{text-decoration:none; color:#00ff00}
#emergency a:hover img{display:none;}
#emergency img{
  display:block;
  position:absolute;
  left:34px;
  top:0px;
}

/*** nav tray ***/
nav ul ul{display:none}

#water-damage li:hover a{border-bottom:none}
#water-damage li:hover > a + span + ul{
  display:block;
  position:absolute;
  top:223px;
  left:-300px;
  width:600px;
  height:200px;
  background:#009bed;
  border:1px solid #fff;
  z-index:999;
}

/*** footer ***/
footer{
  position:fixed;
  bottom:0;
  left:0;
  margin:0;
  width:100%;
  background:#333;  
}
footer a{ text-decoration:none; margin:0 10px; }
footer div{
  width:760px; 
  height:30px;
  margin:0 auto; 
  color:#fff; 
}
footer div p{
  float:left; 
  line-height:30px; 
  font-family:Arial;
  font-size:10px;
  margin-left:20px;
}
footer div p + p{
  float:right;
  margin-right:10px;
}
#wrapper > strong{
  position:absolute;
  top:5px;
  left:20px;
  font-size:24px;
  text-shadow:2px 2px 2px #000;
}
span.date{
  position:absolute;
  top:35px;
  right:20px;
  font-size:10px;
}
#background{width:100%; height:600px; overflow:hidden; background:url(/images/right-bar.png) right top no-repeat; position:fixed; top:0; left:0; z-index:-1}
#background img{position:absolute; top:0; left:0; z-index:-2; width:95px;}

.cityList ul{
  float:left;
  width:20%;
  box-sizing:content-box;

}