* { margin:0; padding:0; text-decoration:none; font-weight:normal; outline:none; }
strong { font-weight:bold; }
a img { border:0; }

body {
  font-family:Verdana, Arial, Helvetica, sans-serif;
  font-size:13px;
  line-height:24px;
  overflow-y:scroll;
  background:url(https://www.zwembadscharlakenhof.nl/projects/scharlakenhof/img/bgrb.png) right bottom no-repeat;
}

hr { color:#ccc; background:#fff; border:0; height:1px; margin:15px 0; border-top:1px dotted #ddd; }

.dg, .dg * { color:#ccc; }
div.ctr { width:980px; margin:0 auto; }
div.clear, #footer, #subfooter, #page, #header, #nav, .cols { clear:both; }
div.bgg, #nav li.active ul li.active a, #sidemenu ul li.active a, #header div.rgt div.bottom a {
  background: #00a1e5; /* Old browsers */
  background: -moz-linear-gradient(45deg,  #00a1e5 0%, #00adef 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#00a1e5), color-stop(100%,#00adef)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(45deg,  #00a1e5 0%,#00adef 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(45deg,  #00a1e5 0%,#00adef 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(45deg,  #00a1e5 0%,#00adef 100%); /* IE10+ */
  background: linear-gradient(45deg,  #00a1e5 0%,#00adef 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00a1e5', endColorstr='#00adef',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
/*
  #header, #nav, #subfooter h2, #sidemenu ul li a, #content h1, #content h2, #content h3, #rightbar h2 { font-family:Open Sans, Verdana, Arial, Helvetica, sans-serif; }
*/

#container { }

#header {
  height:157px;
  overflow:hidden;
  /*background:url(https://www.zwembadscharlakenhof.nl/projects/scharlakenhof/img/bgheader.png) top center no-repeat;*/
}

#header div.lft {
  padding-top:30px;
  width:555px;
  float:left;
  margin-left:10px;
}
#header div.lft h1 a { color:#26ade4; font-size:26px; }
#header div.rgt {
  width:330px;
  float:right;
  margin-right:10px;
}
#header div.rgt a { color:#fff; }
#header div.rgt div.top {
  padding-left:30px;
  height:40px;
  line-height:40px;
  color:#fff;
}
#header div.rgt div.top a { font-size:14px; font-weight:bold; margin-right:15px; }
#header div.rgt div.bottom {
  height:58px;
  line-height:58px;
  color:#fff;
  text-align:right;
}
#header div.rgt div.bottom a {
  font-size:18px;
  font-weight:bold;
  -webkit-border-radius: 10px 0;
  -moz-border-radius: 10px 0;
  border-radius: 10px 0;
  /* background:#5AC2EC; */
  box-shadow:0 0 10px #eee;
  padding:10px;
}


.hinfo {
  background:#00ADEF;
  border-radius:0 0 10px 10px;
  box-shadow:5px 5px 10px #ccc;
  padding:10px 30px;
}
.hinfo ul { list-style:none; color:#eee; margin:0; padding:0; }
.hinfo a {
  color:#fff;
}


#menu {
  height:35px;  
  line-height:35px;
  background:#ededed;
  margin-left:10px;
}
#nav li {
  float:left;
  display:block;
  background:#fff;
  position:relative;
  margin:0 0 0 0px;
  font-size:14px;
  z-index:500;
}
#nav li a {
  border-right:1px solid #fff;
  border-left:1px solid #fff;
  z-index:1000;
  display:block;
  text-align:center;
  padding:0 13px;
  height:35px;
  line-height:35px;
  color:#002E5F;
  float:left;
  font-size:15px;
}
#nav li.active a {
  border:1px solid #dedede;
  border-bottom:0;
  background:#fff;
  margin-top:-3px;
  line-height:37px;
  height:37px;
}
#nav li.active.last a {  }

#nav ul {
  z-index:400;
  background:#fff;
  display:block;
  width:300px;
  position:absolute;
  left:0;
  display:none;
  margin:35px 0 0 0px;
  padding:0;
  list-style:none;
}
#nav li.active ul { margin-top:38px; }
#nav li.active ul li.active a { color:#fff; border:0; width:262px; }
#nav ul li {
  display:block;
  float:left;
  border:0;
}
#nav ul a {
  display:block;
  width:260px;
  border-top:1px solid #ccc;
  text-align:left;
  height:35px;  
  line-height:35px;
  color:#002E5F;
  padding: 0 20px;
  font-size:13px;
}
#nav ul a:hover { background:#eee; }

*html #nav ul {
  margin:0 0 0 -2px;
}

#splash {
  height:197px;
  margin-bottom:30px;
}
#splash div.top {
  margin-left:10px;
  height:36px;
  background:url(https://www.zwembadscharlakenhof.nl/projects/scharlakenhof/img/bgheadertop.png) top center no-repeat;
}

#page { min-height:500px; }
#page, #subfooter {
  overflow:hidden;
  margin-bottom:30px;
}
#page div#leftbar, #page div#rightbar { width:190px; float:left; margin-right:30px; min-height:30px; }
#page div#leftbar { margin-left:10px; width:195px; }
#page div#rightbar { float:right; margin-right:0; }
#page div#content { width:520px; float:left; }

#content h1, #content h2, #content h3, #subfooter h2, #rightbar h2 { color:#002E5F; }

#subfooter {
  margin:0 10px 30px 10px;
  /* background:#26ADE4; */
  padding:25px 0 25px 50px;
  -webkit-border-radius: 10px 0;
  -moz-border-radius: 10px 0;
  border-radius: 10px 0;
  color:#fff;
}
#subfooter div.cols { overflow:hidden; }
#subfooter div.cols div.col {
  width:258px;
  float:left;
  margin-right:30px;
}
#subfooter div.cols div.col.last { margin-right:0; }
#subfooter h2 { margin-bottom:10px; color:#fff; font-weight:bold; }

#sidemenu {
  border:1px solid #ddd;
  -webkit-border-radius: 10px 0;
  -moz-border-radius: 10px 0;
  border-radius: 10px 0;
  margin-bottom:40px;
}
#sidemenu ul { list-style:none; }
#sidemenu ul li { display:inline; }
#sidemenu ul li a {
  display:block;
  line-height:25px;
  border-bottom:1px solid #ddd;
  color:#002E5F;
  padding-left:10px;
}
#sidemenu ul li a:hover { background:#eee; }
#sidemenu ul li.active a:hover { background:#26ADE4; }
#sidemenu ul li.active a {
  color:#fff;
}
#sidemenu ul li.first.active a {
  color:#fff;
  border-top-left-radius:10px;
  -moz-border-radius-topleft:10px;
  -webkit-border-top-left-radius:10px;
}
#sidemenu ul li.last.active a {
  color:#fff;
  border-bottom-right-radius:10px;
  -moz-border-radius-bottomright:10px;
  -webkit-border-bottom-right-radius:10px;
}

#content { overflow:hidden; }
#content h1, #content h2, #content h3, #content p, #content table, #content hr, #content ul, #content ol, #rightbar h2 {
  margin-bottom:20px;
}
#content h1 { font-size:24px; }
#content h2 { font-size:20px; }
#content h3 { font-size:18px; font-weight:bold; }
#content ul, #content ol { padding-left:30px; }
#content a { color:#002E5F; }

#footer {
  line-height:30px;
  text-align:center;
  font-size:11px;
  color:#002E5F;
  padding-bottom:50px;
}
#footer a {
  font-weight:bold;
  color:#ccc;
}


/* Nieuws */
.nieuws { overflow:hidden; margin-bottom:30px; }
.nieuws h2, .nieuws h2 { color:#002E5F; font-size:18px; margin:0; }
.nieuws img { border-radius:10px; }
.nieuws .date { margin-bottom:15px; font-size:13px; color:#666; }
.nieuws a { color:#002E5F; }
.nieuws div.item { clear:both; overflow:hidden; }
.nieuwsb div.item { padding-bottom:15px; border-bottom:1px solid #ccc; margin-bottom:15px; }


/* Versie 2 */
#pt {
  overflow:auto;
}

#pt .col_left {
  width:700px;
  float:left;
  overflow:auto;
}
#pt .col_right {
  width:250px;
  float:right;
  overflow:auto;
}

#content { }
#content h1, #content h2, #content h3, #content h4 {
  font-family:Architects Daughter;
  color:#000;
  /*text-shadow:1px 1px 1px #ccc;*/
  font-size:36px;
}
#content h1 {
  line-height:40px;
  margin:10px 0 25px 0;
}
#content p, #content li, #content td, #content th { color:#333; }
#content p {
  padding-left:10px;
  margin-bottom:10px;
}
#content h2 {
  margin:30px 0 15px 0;
  line-height:35px;
  font-size:28px;
}
#content ol, #content ul { padding-left:40px; }

.bbutton {
  background:#ED1C24;
  overflow:hidden;
  display:block;
  padding:15px 0 0 0;
  color:#fff;
  font-size:34px;
  line-height:40px;
  font-weight:bold;
  text-align:center;
  font-family:Yanone Kaffeesatz, Verdana;
  font-weight:300;
  border-radius:20px;
  margin-bottom:25px;
}
.bbutton span {
  display:block;
  font-size:150px;
  padding-top:60px;
  line-height:20px;
}
.bbpdb { padding-bottom:20px; }


.sponsor {
  background:#00ADEF;
  overflow:hidden;
  display:block;
  padding:15px;
  color:#fff;
  font-size:34px;
  /* line-height:40px;*/
  font-weight:bold;
  text-align:center;
  font-family:Yanone Kaffeesatz, Verdana;
  font-weight:300;
  border-radius:20px;
  margin-bottom:25px;
}
.sponsor span.imgwrap {
  margin:15px 0 0 0;
  display:block;
  padding:10px;
  background:#fff;
  overflow:auto;
  border-radius:20px;
}
.sponsor span.link {
  color:#fff;
  line-height:20px;
  background:#fff;
  color:#000;
  font-weight:400;
  font-size:24px;
}
.sponsor em.desc {
  display:block;
  padding-top:10px;
  font-size:13px;
  font-weight:normal;
  font-family:Verdana;
  font-style:normal;
  line-height:20px;
}


.vrienden { overflow:auto; }
.vrienden div.item {
  overflow:auto;
  padding:20px 0;
  border-bottom:1px dotted #ccc;
}
.vrienden h5 { font-family:Verdana; font-size:24px; }
.vrienden div.col_lft { float:left; width:230px; }
.vrienden div.col_rgt { float:right; width:460px; }


/* Voortgang */
.voortgang {
  margin:40px 0 50px 0;
  height:591px;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.voortgang div.scroll {
  width:220px;
  height:400px;
  float:right;
  margin-top:80px;
  padding:15px;
  background:rgba(0,0,0,.8);
  border-radius:20px 0 0 20px;
  color:#fff;
  overflow-y:scroll;
  border-bottom: 10px solid rgb(0, 0, 0);
  border-bottom: 10px solid rgba(0, 0, 0, .8);
  border-top: 10px solid rgb(0, 0, 0);
  border-top: 10px solid rgba(0, 0, 0, .8);
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.voortgang h1 {
  float:left;
  max-width:400px;
  background:#000;
  color:#fff;
  font-size:42px;
  font-weight:400;
  margin-top:390px;
  padding:10px;
  font-family:Yanone Kaffeesatz, Verdana;
  line-height:40px;
}
.voortgang h2 {
  font-family:Yanone Kaffeesatz, Verdana;
  margin-bottom:15px;
  font-weight:300;
  font-size:28px;
}
.voortgang img {
  margin-top:10px;
  border-radius:10px;
  box-shadow:3px 3px 3px #000;
}
.voortgang div.item {
  padding:10px 0;
  border-bottom:1px dotted #333;
}


#countdown {
  margin-top:30px;
}
#countdown h2 {
  font-size:24px;
  font-weight:300;
  margin-bottom:15px;
  font-family:Yanone Kaffeesatz, Verdana;
}


/* Nieuwslijst */
.nieuwslijst { list-style:none; padding:0; }
.nieuwslijst span.lft { float:left; width:190px; }
.nieuwslijst span.rgt { float:right; width:480px; }
.nieuwslijst li {
  overflow:auto;
  padding-bottom:30px;
}
.nieuwslijst img { border-radius:15px 0 15px 0; margin-top:8px; }
.nthumb { border-radius:15px 0 15px 0; }


/* Inline submenu's */
#icsubmenu {
  background: #ffffff;
  background: -moz-linear-gradient(top,  #ffffff 0%, #f6f6f6 47%, #ededed 100%);
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(47%,#f6f6f6), color-stop(100%,#ededed));
  background: -webkit-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%);
  background: -o-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%);
  background: -ms-linear-gradient(top,  #ffffff 0%,#f6f6f6 47%,#ededed 100%);
  background: linear-gradient(to bottom,  #ffffff 0%,#f6f6f6 47%,#ededed 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 );
  border:1px solid #ddd;
  border-radius:5px;
  padding:8px;
  margin-bottom:20px;
}
#icsubmenu ul { list-style:none; }
#icsubmenu ul li {
  display:inline;
}
#icsubmenu ul li a {
  color:#333;
  padding:0 10px;
  border-right:1px solid #ddd;
  font-size:11px;
  text-transform:uppercase;
}
#icsubmenu ul li.active a { font-weight:bold; }
#icsubmenu ul li.last a { border-right:0; }



/* Formulieren */
#simpleform {
    width:468px;
    padding:10px 0;
}
#simpleform ul {
    list-style:none;
}
#simpleform li {
    display:block;
    width:95%;
    height:28px;
    line-height:28px;
    margin-bottom:5px;
    padding:2px;
    clear:both;
}
#simpleform .sfleft {
    display:block;
    float:left;
    width:25%;
    margin-right:3px;
    margin-bottom:5px;
}
#simpleform .textarea { height:100px; }
#simpleform .sfright {
    float:left;
    width:65%;
    margin-bottom:5px;
}
#simpleform .sfbutton { width:auto; }
#simpleform .clear { clear:both; }



.calendar {
  padding-top:20px;
}

#content a.nwbutton { color:#fff; }
a.nwbutton {
  display:block;
  padding:10px;
  background:green;
  border-radius:20px;
  color:#fff;
  font-size:24px;
  line-height:40px;
  font-family:Yanone Kaffeesatz, Verdana, Verdana;
  margin-bottom:20px;
  text-align:center;
  text-shadow:1px 1px 2px #666;
}
#content .knoppentabel td { border-right:5px solid #fff; }

​