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

body {

	background: #F5F5F5;
      background-image: url(../figs/dorp.png);
      background-repeat: repeat-x;
      background-position: bottom left;
      background-attachment: fixed;

	font-size: 12pt;
	color: #666666;
	font-family: 'Roboto', sans-serif;
	margin: 0;

}

a:link { color: #009BC5 }
a:visited { color: #009BC5 }
a:active { color: #009BC5 }

h1 {

	color:#2A4482 !important;
	font:30px lato;
      font-weight:400 !important;
	text-transform:uppercase;
      text-decoration:none;
	vertical-align: bottom;
      display: inline;
}

h2 {
	vertical-align: bottom;
      display: inline;
      color:#49AB64;
      font-weight:700;
      text-transform:uppercase;
      font:25px lato;
     text-decoration:none;
}

td {
	font-size: 12pt;
	color: #666666;
	font-family: 'Roboto', sans-serif;
	text-decoration: none;
	text-align: left;
	vertical-align: top;
}

p {
	font-size: 12pt;
	color: #666666;
	font-family: 'Roboto', sans-serif;
      text-align:left; 
      margin-top: 0px; 
      line-height:150%;
	vertical-align: bottom;
}

ul, ol, li {
	font-size: 12pt;
	color: #666666;
	font-family: 'Roboto', sans-serif;
      text-align:left; 
      margin-top: 0px; 
      line-height:150%;
	vertical-align: bottom;
}

textarea {
	font-size: 12pt; 
	color: #666666;
	font-family: 'Roboto', sans-serif;
}

input.glowing-border {
    font-size: 12pt;
    border-radius: 3px;
    padding: 2px;
    border: 1px solid #666666;
}

input.glowing-border:focus { 
    font-size: 12pt;
    outline: none;
    border-color: #9ecaed;
    box-shadow: 0 0 10px #9ecaed;
}

.container {
  position:relative;
  overflow: hidden;
  width: 800px;
  height: 300px;
}

.sliding-background-1 {
  position:relative;
  background: url("../figs/pano1.jpg") repeat-x;
  height: 300px;
  width: 12546px;
  animation: slide 150s linear infinite;
}

.sliding-background-2 {
  position:relative;
  background: url("../figs/pano2.jpg") repeat-x;
  height: 300px;
  width: 12546px;
  animation: slide 150s linear infinite;
}

.sliding-background-3 {
  position:relative;
  background: url("../figs/pano3.jpg") repeat-x;
  height: 300px;
  width: 12546px;
  animation: slide 150s linear infinite;
}

@keyframes slide{
  0%{
    transform: translate3d(0, 0, 0);
  }
  100%{
    transform: translate3d(-4182px, 0, 0);
  }
}

.logo {
  position: absolute;
  bottom: 0px;
  left: 450px;
  z-index: 2;
}


/* box voor panning kaart */

.content{
  width: 720px;
  height: 520px;
  overflow: hidden;
}

.content img{
  opacity: 0;
  transition: opacity .6s linear .8s;
}

.content img.loaded{ opacity: 1; }

.img-pan-container, .img-pan-container img{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.img-pan-container{
  position: relative;
  overflow: hidden;
  cursor: crosshair;
  height: 100%;
  width: 100%;
  border: 5px solid #CCCCCC;
}

.img-pan-container img{
  -webkit-transform: translateZ(0); -ms-transform: translateZ(0); transform: translateZ(0);
  position: absolute;
  top: 0;
  left: 0;
}

#slideshow {
  margin: 0px auto;
  position: relative;
  width: 650px;
  height: 350px;
  padding: 5px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
}

#slideshow > div {
  position: absolute;
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px;
}