/***********************************************/
/* HTML tag styles                             */
/***********************************************/

html,
body {
	height: 100%;
}
body {
	margin: 0;
	padding: 0;
}


/************ Wrapper tag styles **************/
#wrapper {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 800px;
	height: 545px;
	margin-left: -389px;
    margin-top: -263px;
}


/************* Header tag styles ***************/
#header{
  width: 800px;
  height: 30px;
  position: absolute;
  border-bottom: 5px solid #C6C6C6;
}

#contact{
  color: #8E8E8E;
  padding-bottom: 2px;
  font: 85% Arial;
  width: 600px;
  border-bottom: 2px solid #8E8E8E;
  position: absolute;
  right: 0;
  bottom: 2px;
}
#contact ul{
   border-bottom: 1px solid #8E8E8E;
   margin: 0;
   height: 15px;
   width: 600px;
}
#contact li {
  display: list-item;
  display: inline;
  padding-left: 9px;
  padding-right: 0;
  background: url(../media/bullet.gif) no-repeat left;
}
#contact li.firstchild{
  margin-left: 40px;
}
#contact a {
  text-decoration: none;
  color: #8E8E8E;
}
#logo{
  border-bottom: 2px solid #8E8E8E;
  width: 200px;
  position: absolute;
  top: -29px;
}
.skipto{
  display: none;
}

/************* Content tag styles **************/
#content{
  position: absolute;
  top: 38px;
  left: 203px;
  height: 497px;
  width: 231px;
  overflow-y: auto;
  font-size: 75%;
  padding: 5px 9px;
  z-index: 2px;
}
html>body {
  background: url(../media/background.png);
}

#contentAlphabg {
  background: url(../media/background.png);
  Filter: Alpha(Opacity=90);
  position: absolute;
  top: 38px;
  left: 203px;
  height: 497px;
  width: 239px;
  padding: 5px;
}

/************* IMG  tag styles ****************/
#preview{
  background: #EDEDED;
  position: absolute;
  width: 345px;
  height: 420px;
  left: 455px;
  top: 38px;
  clip: rect(auto 345px 420px auto);
}
#thumbs{
  background: #EDEDED;
  position: absolute;
  left: 455px;
  top: 460px;
  height: 85px;
  width: 345px;
}
#thumbs ul{
  position: absolute;
  padding: 0;
  margin: 0;
  width: 360px;
}
#thumbs li{
cursor: pointer;
  padding: 0;
  margin-top: 4px;
  float: left;
  line-height: 0;
  margin-right: 12px;
  list-style-type: none;
  border: 1px solid #FFF;
 }

#content li img{
	cursor: pointer;
}

/************** Menu  tag styles ***************/
#mainmenuAlphabg {
  background: url(../media/background.png);
  Filter: Alpha(Opacity=80);
  position: absolute;
  top: 38px;
  height: 420px;
  width: 200px;

}

#mainmenu {
  position: absolute;
  top: 38px;
  width: 200px;
}
#mainmenu ul{
  margin-top: 0px;
  margin: auto;
}
#mainmenu li{
  margin: 0;
  padding: 0;
  list-style-type: none;
}

* html #mainmenu li {
  height: 1px;
}


#mainmenu a {
  padding: 4px 8px;
  display: block;
  text-decoration: none;
  font-size: 90%;
  font-weight: bold;
  text-decoration: none;
  color: #353535;
}


#mainmenu a:hover {
	background: #75C3DA;
}


#active a{
  color: white;
	background: #009BC9;
}

#mainmenu ul ul {
	display: none;
}

#mainmenu ul li:hover ul,
#mainmenu ul li.hover ul {
	display: block;
	position: absolute;
	left: 120px;
	width: 200px;
	margin-top: -1em;
	border: 1px solid #009BC9;
	background: white;
}

#mainmenu ul li.hover a,
#mainmenu ul li:hover a {
	color: white;
	background: #75C3DA;
}

#mainmenu ul li.hover li a,
#mainmenu ul li:hover li a {
	color: black;
	background-color: white;
}

html>body #mainmenu ul li li a:hover {
	background: #B4DEEB;
}

* html body #mainmenu ul li li a:hover {
	background: #B4DEEB !important;
}


/************** Page   visuals   ***************/

html body {
	background-attachment: fixed;
	background-repeat: no-repeat;
	background-position: 35% center !important;
}

/* Shopping Cart */
#winkel{
	position: absolute;
	bottom: 0;
	left: 0;
	width: 200px;
	height: 120px;
	border-top: 3px solid white;
}

#pg_vuurwerk #mainmenu {
	 height: 507px;
}



/* page brievenbussen */

#pg_brievenbussen body{
  background-image: url(../media/brievenbussen/background.jpg);
}

#pg_brievenbussen #preview {
	background: url(../media/brievenbussen/1.jpg) no-repeat
}

#pg_brievenbussen body.visual2 #preview {
	background: url(../media/brievenbussen/2.jpg) no-repeat
}

#pg_brievenbussen body.visual3 #preview {
	background: url(../media/brievenbussen/3.jpg) no-repeat
}

#pg_brievenbussen body.visual4 #preview {
	background: url(../media/brievenbussen/4.jpg) no-repeat
}

/* page diensten */

#pg_diensten body{
  background-image: url(../media/diensten/background.jpg);
}

#pg_diensten #preview {
	background: url(../media/diensten/1.jpg) no-repeat
}

#pg_diensten body.visual2 #preview {
	background: url(../media/diensten/2.jpg) no-repeat
}

#pg_diensten body.visual3 #preview {
	background: url(../media/diensten/3.jpg) no-repeat
}

#pg_diensten body.visual4 #preview {
	background: url(../media/diensten/4.jpg) no-repeat
}

/* page dubbelwandig */

#pg_dubbelwandig body{
  background-image: url(../media/dubbelwandig/background.jpg);
}

#pg_dubbelwandig #preview {
	background: url(../media/dubbelwandig/1.jpg) no-repeat
}

#pg_dubbelwandig body.visual2 #preview {
	background: url(../media/dubbelwandig/2.jpg) no-repeat
}

#pg_dubbelwandig body.visual3 #preview {
	background: url(../media/dubbelwandig/3.jpg) no-repeat
}

#pg_dubbelwandig body.visual4 #preview {
	background: url(../media/dubbelwandig/4.jpg) no-repeat
}

/* page haard */

#pg_haard body{
  background-image: url(../media/haard-schouw/background.jpg);
}

#pg_haard #preview {
	background: url(../media/haard-schouw/1.jpg) no-repeat
}

#pg_haard body.visual2 #preview {
	background: url(../media/haard-schouw/2.jpg) no-repeat
}

#pg_haard body.visual3 #preview {
	background: url(../media/haard-schouw/3.jpg) no-repeat
}

#pg_haard body.visual4 #preview {
	background: url(../media/haard-schouw/4.jpg) no-repeat
}

/* page index */

#pg_index body{
  background-image: url(../media/index/background.jpg);
}

#pg_index #preview {
	background: url(../media/index/1.jpg) no-repeat
}

#pg_index body.visual2 #preview {
	background: url(../media/index/2.jpg) no-repeat
}

#pg_index body.visual3 #preview {
	background: url(../media/index/3.jpg) no-repeat
}

#pg_index body.visual4 #preview {
	background: url(../media/index/4.jpg) no-repeat
}

/* page info */

#pg_info body{
  background-image: url(../media/informatie/background.jpg);
}

#pg_info #preview {
	background: url(../media/informatie/1.jpg) no-repeat
}

#pg_info body.visual2 #preview {
	background: url(../media/informatie/2.jpg) no-repeat
}

#pg_info body.visual3 #preview {
	background: url(../media/informatie/3.jpg) no-repeat
}

#pg_info body.visual4 #preview {
	background: url(../media/informatie/4.jpg) no-repeat
}

/* page naamplaten */

#pg_naamplaten body{
  background-image: url(../media/naamplaten-huisnummers/background.jpg);
}

#pg_naamplaten #preview {
	background: url(../media/naamplaten-huisnummers/1.jpg) no-repeat
}

#pg_naamplaten body.visual2 #preview {
	background: url(../media/naamplaten-huisnummers/2.jpg) no-repeat
}

#pg_naamplaten body.visual3 #preview {
	background: url(../media/naamplaten-huisnummers/3.jpg) no-repeat
}

#pg_naamplaten body.visual4 #preview {
	background: url(../media/naamplaten-huisnummers/4.jpg) no-repeat
}

/* page tuin */

#pg_tuin body{
  background-image: url(../media/tuin-park/background.jpg);
}

#pg_tuin #preview {
	background: url(../media/tuin-park/1.jpg) no-repeat
}

#pg_tuin body.visual2 #preview {
	background: url(../media/tuin-park/2.jpg) no-repeat
}

#pg_tuin body.visual3 #preview {
	background: url(../media/tuin-park/3.jpg) no-repeat
}

#pg_tuin body.visual4 #preview {
	background: url(../media/tuin-park/4.jpg) no-repeat
}

/* page vacatures */

#pg_vacatures body{
  background-image: url(../media/vacatures/background.jpg);
}

#pg_vacatures #preview {
	background: url(../media/vacatures/1.jpg) no-repeat
}

#pg_vacatures body.visual2 #preview {
	background: url(../media/vacatures/2.jpg) no-repeat
}

#pg_vacatures body.visual3 #preview {
	background: url(../media/vacatures/3.jpg) no-repeat
}

#pg_vacatures body.visual4 #preview {
	background: url(../media/vacatures/4.jpg) no-repeat
}

/* page vloer */

#pg_vloer body{
  background-image: url(../media/vloeren/background.jpg);
}

#pg_vloer #preview {
	background: url(../media/vloeren/1.jpg) no-repeat
}

#pg_vloer body.visual2 #preview {
	background: url(../media/vloeren/2.jpg) no-repeat
}

#pg_vloer body.visual3 #preview {
	background: url(../media/vloeren/3.jpg) no-repeat
}

#pg_vloer body.visual4 #preview {
	background: url(../media/vloeren/4.jpg) no-repeat
}

/* page vuurwerk */

/*#pg_vuurwerk body {
  background-image: url(../media/vuurwerk/background.jpg);
}*/

#pg_vuurwerk #preview {
	background: url(../media/vuurwerk/1.jpg) no-repeat
}

#pg_vuurwerk body.visual2 #preview {
	background: url(../media/vuurwerk/2.jpg) no-repeat
}

#pg_vuurwerk body.visual3 #preview {
	background: url(../media/vuurwerk/3.jpg) no-repeat
}

#pg_vuurwerk body.visual4 #preview {
	background: url(../media/vuurwerk/4.jpg) no-repeat
}

/* page vuurwerk */

#pg_routebeschrijving body #preview {
  background-image: url(../media/routebeschrijving.jpg);
}