@charset "utf-8";
/* CSS Document */

@import url("reset.css");

/*//////////////////
GENERAL CSS
//////////////////*/

/* ||||| Start Structural Styles ||||| */
html{
	width:100%;
	height:100%;
}
body {
	width:100%;
	height:100%;
	background-image:url('../images/bg-main4.jpg');
	background-position:top center;
	background-repeat:repeat-x;
	font-family:Verdana, Helvetica, Arial;
	font-size:12px;
	color:#222;
}
#header {
	background-image:url('../images/bg-header.png');
	background-position:bottom center;
	background-repeat:no-repeat;
	position:relative;
	width:940px;
	height:75px;
	margin:0 0 60px 0;
	z-index:9;
}
#footer{
	flaot:left;
	background:none;
	width:940px;
	height:auto;
	min-height:75px;
	padding:0 0 25px 0;
}
#container {
	width:940px;
	height:auto;
	margin:0 auto;
}
#content{
	position:relative;
	z-index:2;
}
.scrollWindow {
	position:relative;
	float:left;
	overflow:hidden;
	width:525px;
	height:490px;
	margin:10px 0 0 0px;
}
.scrollPanel {
	float:left;
	width:525px;
	height:auto;
}
hr {
	float:left;
	width:180px;
	height:1px;
	margin:20px 160px 20px 160px;
	color:#006fc5;
	background-color:#006fc5;
	border:none;
}
#burglaries{
	position:relative;
	width:100%;
	margin:10px 0 20px 0;
}
#burglaries th{
	padding:5px 0 10px 0;
}
#burglaries tr.odd{
	background-image:url('../images/bg-header2.png');
	background-repeat:repeat;
}
#burglaries td{
	padding:5px 0 5px 5px;
	width:30%;
}
#video-dialog{
	position:absolute;
	background:#fff;
	width:388px;
	height:316px;
	bottom:10px;
	left:10px;
	padding:10px;
	z-index:999998;
	overflow:hidden;
}
#video-dialog #video{
	z-index:999999;
}
#videoClose{
	position:absolute;
	bottom:-5px;
	right:10px;
	color:#222;
	font-weight:900;
	cursor:pointer;
}
	
/* ||||| End Structural Styles ||||| */

/* ||||| Start Navigation Styles ||||| */

#header ul {
	position:absolute;
	bottom:0;
	left:170px;
	width:auto;
	height:25px;
	clear: both;
	text-align:center;
	margin:0;
	padding:0;
	z-index:9;
}
#header ul > li {
	position:relative;
	float:left;
	display:inline;
	width:auto;
	height:25px;
	border-left:2px solid #222;
	padding:0 10px 0 10px;
}
#header ul > li:first-child{
	border:none;
}
#header ul li a {
	position:relative;
	float:left;
	width:inherit;
	background:none;
	color: #000;
	text-decoration: none;
	text-align:center;
	z-index:10;
}
#header ul li .dropDown{
	position:absolute;
	top:0px;
	left:0;
	background:none;
	width:225px;
	text-align:left;
	display:none;
	font-size:16px;
	padding:25px 0 0 0;
	margin:0;
}
#header li .dropDown li{
	position:relative;
	float:left;
	clear:left;
	background-image:url('../images/bg-header2.png');
	background-repeat:repeat;
	height:21px;
	width:225px;
	color:#006fc5;
	font-weight:900;
	text-align:left;
	display:block;
	padding:3px 10px 3px 10px;
	border-left:2px solid #222;
	margin:0 0 0 -2px;
}
#header li .dropDown li a{
	color:#000;
	width:225px;
	font-weight:100;
	font-size:14px;
	text-align:left;
}
#header li .dropDown li:hover{
	border-left-color:#006fc5;
}
#header li .dropDown li a:hover{
	color:#006fc5;
}
#header li:hover .dropDown, #header li:hover .dropDown:hover, #header li .dropDown:hover{
	display:block;
}

#footer ul{
	position:relative;
	width:auto;
	height:20px;
	text-align:center;
	margin:40px 0 20px 0;
	padding:0;
	z-index:9;
}
#footer ul li{
	display:inline;
	width:auto;
	padding:3px 0px 3px 0px;
	margin:0;
}
#footer ul li:first-child{
	border:0;
}
#footer ul li a{
	position:relative;
	color:#666;
	font-size:11px;
	text-align:center;
	height:25px;
	width:auto;
	margin:0;
	padding:2px 5px 0px 5px;
}
#footer ul li a:hover{
	color:#000;
	border-bottom:2px solid #006fc5;
}
/* ||||| End Navigation Styles ||||| */

/* ||||| Start Typography Styles ||||| */

h1, h2, h3, h4, h5 {
	font-family:Helvetica, Arial;
}
h1 {
	float:left;
	font-size:38px;
	font-weight:900;
	margin:0px 0 5px 30px;
}
h1 a{
	color:#222;
}
h2 {
	font-size:22px;
}
h3 {
	color:#222;
	font-size:14px;
	font-weight:900;
	margin:20px 0 5px 0;
}
h4{
	font-weight:900;
}
p{
	margin:0 0 15px 0;
}
a {
	color:#005eb4;
	text-decoration:none;
}
q{
	color:#000;
	font-style:italic;
}
q strong{
	font-weight:900;
}
q + p{
	color:#005eb4;
	font-weight:900;
	margin:5px 0 15px 20px;
}
sup{
	vertical-align:text-top;
}
.light {
	font-weight:100;
}
#header ul {
	font-size:18px;
}
#burglaries th{
	color:#004da3;
	font-size:14px;
	font-weight:900;
	margin:20px 0 5px 0;
}
#burglaries td.colHeading{
	font-weight:900;
}
.contactInfo{
	margin:0 0 3px 0;
}
h3.contactInfo{
	margin:15px 0 0 0;
}
p.contactInfo{
	padding:0 0 0 10px;
}
.pageTitle{
	font-size:22px;
	font-weight:900;
}
.section-title {
	color:#222;
	font-size:18px;
	font-weight:normal;
	margin:10px 0px 10px 0px;
}
.backTop{
	text-align:right;
	float:right;
	width:525px;
	margin:10px 0 10px 0;
}
#copyright{
	float:right;
	clear:both;
	color:#666;
	font-size:10px;
	text-align:right;
	margin:5px 25px 0 0;
}
.cloggCredit{
	float:right;
	clear:both;
	color:#666;
	font-size:10px;
	text-align:right;
	margin:0px 25px 0 0;
}
.cloggCredit a{
	font-size:14px;
	font-family:"Orator Std",Helvertica,Arial,sans-serif;
	text-transform:lowercase;
}
/* ||||| End Typography Styles ||||| */

/* ||||| Start Image Styles ||||| */
#logoHaverkamp{
	float:right;
	width:247px;
	margin:13px 30px 0 0;
}
.mainImage {
	float:left;
	width:323px;
	height:753px;
	margin:10px 0 0 15px;
}
/* ||||| End Image Styles ||||| */






/* ||||| Start Coda Slider 2.0 Styles ||||| */

/*
	jQuery Coda-Slider v2.0 - http://www.ndoherty.biz/coda-slider
	Copyright (c) 2009 Niall Doherty
	This plugin available for use in all personal or commercial projects under both MIT and GPL licenses.
*/

/* Insignificant stuff, for demo purposes */
noscript div {
	background: #fff;
	border: 1px solid #004da3;
	color:#222;
	margin:20px;
	padding:20px;
}
/* Most common stuff you'll need to change */

	.coda-slider-wrapper {
	padding:0;
}
.coda-slider {
	background:none;
	padding:0;
}
/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
	.coda-slider-no-js .coda-slider {
	height: 200px;
	overflow: auto !important;
	padding-right: 0;
}
/* Change the width of the entire slider (without dynamic arrows) */
	.coda-slider, .coda-slider .panel {
	width: 940px;
	height:507px;
}
/* Change margin and width of the slider (with dynamic arrows) */
	.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel {
	width: 940px;
}
/* Panel padding */
.coda-slider .panel-wrapper {
	padding: 0;
}
/* Preloader */
.coda-slider p.loading {
	padding: 20px;
	text-align: center;
}
/* Don't change anything below here unless you know what you're doing */

/* Miscellaneous */
	.coda-slider-wrapper {
	clear: both;
	overflow: auto;
}
.coda-slider {
	float: left;
	overflow: hidden;
	position: relative;
}
.coda-slider .panel {
	display: block;
	float: left;
	background-image:url('../images/bg-box4.png');
	background-position:top left;
	background-repeat:no-repeat;
}
.coda-slider .panel-container {
	position: relative;
}


/*//////////////////
ABOUT PAGE CSS
//////////////////*/

div#scrollbarAbout {
	float:left;
	display:block;
	left:25px;
	top:70px;
	position:relative;
	width:6px;
	height:380px;
	font-size:1px;
}
div#trackAbout {
	position:absolute;
	left:0;
	top:10px;
	width:16px;
	height:358px;
	background-image:url('../images/bg-track.png');
	background-repeat:no-repeat;
}
#dragBarAbout {
	position:absolute;
	left:-1px;
	top:1px;
	width:6px;
	height:20px;
	margin-left:-1px;
}
div#dragBarAbout img {
	float:left;
	height:inherit;
	width:6px;
}
div#scrollbarAbout div#aboutUp {
	position:absolute;
	left:0;
	top:0;
}
div#scrollbarAbout div#aboutDown {
	position:absolute;
	left:0;
	bottom:0;
}
/* for safari, to prevent selection problem  */
div#scrollbarAbout, div#trackAbout, div#dragBarAbout, div#aboutUp, div#aboutDown {
	-moz-user-select: none;
	-khtml-user-select: none;
}
div#scrollbarAbout img {
	display:block;
	border:0;
}



/*//////////////////
CONTACT PAGE CSS
//////////////////*/

div#scrollbarContact{ 
	float:left;
	display:block;
	left:25px;
	top:70px;
  	position:relative;
  	width:6px; 
	height:380px; 
  	font-size:1px;
}
  
div#trackContact{ 
  position:absolute; left:0; top:10px;
  width:16px; height:358px;
  background-image:url('../images/bg-track.png');
  background-repeat:no-repeat;
  }
  
#dragBarContact{
  position:absolute; left:-1px; top:1px;
  width:6px; height:20px;
  margin-left:-1px;
  }
  
div#dragBarContact img{
	float:left;
	height:inherit;
	width:6px;
}
  
div#scrollbarContact div#up { position:absolute; left:0; top:0; }  
div#scrollbarContact div#down { position:absolute; left:0; bottom:0; }

/* for safari, to prevent selection problem  */
div#scrollbarContact, div#trackContact, div#dragBarContact, div#up, div#down {
    -moz-user-select: none;
    -khtml-user-select: none;
}

div#scrollbarContact img {
    display:block; 
	border:0;
}


/*//////////////////
HOME PAGE CSS
//////////////////*/

div#scrollbarHome{ 
	float:left;
	display:block;
	left:25px;
	top:70px;
  	position:relative;
  	width:6px; 
	height:380px; 
  	font-size:1px;
}
  
div#trackHome{ 
  position:absolute; left:0; top:10px;
  width:16px; height:358px;
  background-image:url('../images/bg-track.png');
  background-repeat:no-repeat;
  }
  
#dragBarHome{
  position:absolute; left:-1px; top:1px;
  width:6px; height:20px;
  margin-left:-1px;
  }
  
div#dragBarHome img{
	float:left;
	height:inherit;
	width:6px;
}
  
div#scrollbarHome div#homeUp { position:absolute; left:0; top:0; }  
div#scrollbarHome div#homeDown { position:absolute; left:0; bottom:0; }

/* for safari, to prevent selection problem  */
div#scrollbarHome, div#trackHome, div#dragBarHome, div#homeUp, div#homeDown {
    -moz-user-select: none;
    -khtml-user-select: none;
}

div#scrollbarHome img {
    display:block; 
	border:0;
}


/*//////////////////
PRODUCT PAGE CSS
//////////////////*/

#productsWindow li{
	color:#005eb4;
	cursor:pointer;
}
#productsWindow li:hover{
	color:#222;
}
.productDialog{
	position:absolute;
	width:478px;
	height:420px;
	display:none;
	background-color:#fff;
	padding:0;
	z-index:99999;
	border:2px solid #222;
}
.productDialog h5{
	position:absolute;
	top:0;
	left:0;
	width:430px;
	height:20px;
	font-size:14px;
	font-weight:900;
	padding:10px 20px 0px 20px;
	cursor:move;
}
.productDialog .dialogContent{
	position:absolute;
	background:none;
	top:30px;
	left:0;
	width:436px;
	height:346px;
	overflow:auto;
	color:#222;
	font-size:12px;
	padding:5px 22px 5px 20px;
	border-top:2px solid #005eb4;
	border-bottom:2px solid #005eb4;
}

.productDialog .dialogCloseContainer{
	position:absolute;
	top:396px;
	left:0;
	width:430px;
	height:20px;
	text-align:right;
	padding:0px 20px 0px 20px;
}
.productDialog .dialogClose{
	position:absolute;
	top:2px;
	right:15px;
	color:#222;
	font-weight:900;
	cursor:pointer;
}
.watchVideo{
	color:#005eb4;
	cursor:pointer;
}
.productDialog p strong{
	font-weight:900;
	margin:10px 0 0 0;
	color:#005eb4;
}

.productDialog table{
	width:400px;
	margin:0 0 20px 0;
}
.productDialog table td{
	padding:5px;
}
.productDialog table td.leftCol{
	width:200px;
}
.productDialog table td.rightCol{
	width:100px;
}
.productDialog table tr.odd{
	background:#efefef;
}
.product1dialog{
	top:20px;
	left:20px;
}
.product2dialog{
	top:40px;
	left:40px;
}
.product3dialog{
	top:60px;
	left:60px;
}
.product4dialog{
	top:80px;
	left:80px;
}
.product5dialog{
	top:100px;
	left:100px;
}
.product6dialog{
	top:120px;
	left:120px;
}
.product7dialog{
	top:140px;
	left:140px;
}
.product8dialog{
	top:160px;
	left:160px;
}
.product9dialog{
	top:180px;
	left:180px;
}
.product10dialog{
	top:200px;
	left:200px;
}


div#scrollbarProducts{ 
	float:left;
	display:block;
	left:25px;
	top:70px;
  	position:relative;
  	width:6px; 
	height:380px; 
  	font-size:1px;
}
  
div#trackProducts{ 
  position:absolute; left:0; top:10px;
  width:16px; height:358px;
  background-image:url('../images/bg-track.png');
  background-repeat:no-repeat;
  }
  
#dragBarProducts{
  position:absolute; left:-1px; top:1px;
  width:6px; height:20px;
  margin-left:-1px;
  }
  
div#dragBarProducts img{
	float:left;
	height:inherit;
	width:6px;
}
  
div#scrollbarProducts div#productsUp { position:absolute; left:0; top:0; }  
div#scrollbarProducts div#productsDown { position:absolute; left:0; bottom:0; }

/* for safari, to prevent selection problem  */
div#scrollbarProducts, div#trackProducts, div#dragBarProducts, div#productsUp, div#productsDown {
    -moz-user-select: none;
    -khtml-user-select: none;
}

div#scrollbarProducts img {
    display:block; 
	border:0;
}


/*//////////////////
SERVICES PAGE CSS
//////////////////*/

#servicesWindow li{
	color:#005eb4;
	cursor:pointer;
}
#servicesWindow li:hover{
	color:#222;
}

div#scrollbarServices{ 
	float:left;
	display:block;
	left:25px;
	top:70px;
  	position:relative;
  	width:6px; 
	height:380px; 
  	font-size:1px;
}
  
div#trackServices{ 
  position:absolute; left:0; top:10px;
  width:16px; height:358px;
  background-image:url('../images/bg-track.png');
  background-repeat:no-repeat;
  }
  
#dragBarServices{
  position:absolute; left:-1px; top:1px;
  width:6px; height:20px;
  margin-left:-1px;
  }
  
div#dragBarServices img{
	float:left;
	height:inherit;
	width:6px;
}
  
div#scrollbarServices div#servicesUp { position:absolute; left:0; top:0; }  
div#scrollbarServices div#servicesDown { position:absolute; left:0; bottom:0; }

/* for safari, to prevent selection problem  */
div#scrollbarServices, div#trackServices, div#dragBarServices, div#servicesUp, div#servicesDown {
    -moz-user-select: none;
    -khtml-user-select: none;
}

div#scrollbarServices img {
    display:block; 
	border:0;
}