html,body { margin:0; padding:0; }
*         { margin:0; padding:0; }
body {
   background-color: white;
   color: black;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10pt;
   line-height:125%;
   margin: 0;
   padding: 0;
}
/* --- delen van de pagina (id's) ------------------------------------------- */
#website {
   background-color:white;
   width:980px;
   margin:0 auto;
}
#iframe-page {
   width:710px;
   padding:0 !important;
   margin:0 0 !important;
}
#websiteheader {
   background:#31569d url(http://www.staplijst.be/images/staplijst-be-nl-com-wandelingen-550.jpg) top left no-repeat;
   width:980px;
   height:100px;
   border-bottom:1px solid #31569d;
}
#websiteheader img {
   left:0px;
   top:0px;
   float:left;
}
#websiteheader strong, #websiteheader em {
   display:block;
   text-align:right;
   color:yellow;
   border:none;
   margin:0;
   font-weight:bold;
}
#websiteheader strong {
   font-size:16px;
   line-height:20px;
   padding:10px 15px 0 350px;
}
#websiteheader em {
   font-size:13px;
   padding:5px 15px 0 350px;
}
#websiteheader a { text-decoration:none; color:yellow; }
#websiteheader a:hover {text-decoration:underline;}

#websitefooter, #websitefooterlinken {
   border-top:1px solid #31569d;
   clear:both;
   text-align:center;
   /*background: #7D7DA6 url(http://www.staplijst.be/images/down-880.jpg) top left;*/
   width:980px;
   height:23px;
   line-height:22px;
   font-size:8pt;
   font-family: Arial, sans-serif;
   color: #113372
}
#websitefooter A:link    { color:#0000ff; text-decoration:underline; }
#websitefooter A:visited { color:#444444; Text-decoration:underline; }
#websitefooter A:hover   { color:#000000; text-decoration:underline; }

#websitefooter table , #websitefooterlinken table{
   clear:both;
   margin:4px auto 0 auto;
   width:860px;
}

#websitesubheader {
   text-align:left;
   /*background: #7D7DA6 url(http://www.staplijst.be/images/staplijst-be-nl-com-subheader-balk-10.jpg) 0px 0px;*/
   width:980px;
   height:54px;
   font-size:9pt;
   font-family: Arial, sans-serif;
   color: #345E8E;
   padding:0px; margin:0 0 10px 0;
   /*border-bottom:1px solid #31569d;*/
}
#websitesubheader table {
   margin:0 auto 0 10px;
   width:960px;
}
#websitesubheader td {
   padding:1px 0 0 22px;
}
#websitesubheader input {
   padding:0;
   margin:0;
}
#websitesubheader .websitemenu {
   /*background: #7D7DA6 url(http://www.staplijst.be/images/staplijst-be-nl-com-subheader-balk-10.jpg) 0px 0px;*/
   width:978px;
   height:27px;
   border-bottom:1px solid #31569d;
   /*border-left:1px solid #31569d;
   border-right:1px solid #31569d;*/
   line-height:27px;
}

#websitecontents {
   clear:both;
   float:left;
   text-align:left;
   width:980px;
   /*background: #fff url(http://www.staplijst.be/images/back-880.jpg) repeat-y top left;*/
}
#websitecontents td {
   text-align:left;
}
/* --- (her)definities standaard html elementen ----------------------------- */
table {
   border-collapse:collapse;
   border:none;
}
td , th {
   vertical-align:top;
   border:none;
}
img {
   border:none;
   margin:0;
   padding:0;
}
h1 {
   font-size:22px;
   line-height:25px;
   padding:7px 0;
   margin:10px 0 10px 0;
   /* color:#31569d;                        background-color:green; */
   /* outline:1px solid #ff8040; */
}
h2 {  /* outline:1px solid yellow; */
   clear:both;
   font-size:16px;
   line-height:21px;
   font-style: normal;
   font-family:arial, sans-serif;
   padding:5px 0;
   margin:20px 0 10px 0;
   /* color:#31569d;   background-color:red; */
}
h3 {
   font-size:11pt;
   clear:both;
   padding:3px 0;
   margin:20px 0 10px 0;
}
h4 {
   font-family: "times new roman", serif;
   font-size:11pt;
   font-style:italic;
   margin:15px 10px 10px 10px;
}
p {
   text-align:justify;
   margin:14px 0;
}
ul, ol {
   margin-left:15px;
}
li {
   margin:6px 15px;
}
form { margin-top: 0 !important; margin-bottom: 0 !important; display:inline;}
input { margin-top: 0 !important; margin-bottom: 0 !important; padding:2px;}
select { margin-top: 0; margin-bottom: 0; }

A:link    { color:#0000ff; text-decoration:underline; }
A:visited { color:#333380; Text-decoration:underline; }
A:hover   { color:#000000; text-decoration:underline; }

listing {
   font-size:13px;
   margin-left:30px;
   border:1px solid black;
   padding:3px;
}

/* --- overrulende single properties ---------------------------------------- */
.left {text-align:left !important}
.right {text-align:right !important}
.center {text-align:center !important}
.middle {vertical-align:middle !important}
.top {vertical-align:top !important}
.floatleft  {float:left !important;}
.floatright {float:right !important;}
.margintop, .boven-spatie {margin-top:10px !important;}
.marginbottom, .onder-spatie {margin-bottom:10px !important;}
.marginleft {margin-left:10px !important;}
.marginright {margin-right:10px !important;}
.position-relative {position:relative !important; }
.font-80, .font80 {font-size:80%;}
.font-100, .font100 {font-size:100%;}
.font-120, .font120 {font-size:120%;}
.img16, .image16 {width:16px !important; height:16px !important;}
.img24, .image24 {width:24px !important; height:24px !important;}
.img32, .image32 {width:32px !important; height:32px !important;}
.img48, .image48 {width:48px !important; height:48px !important;}
.clearnone { clear:none; }


/* --- verschillende soorten spaties ---------------------------------------- */
.boven-onder-spatie {
   margin-top:10px;
   margin-bottom:10px;
}

/* --- grafische elementen (affiches, iconen, logo's ------------------------ */
.inline-icon {margin-bottom:.25em;vertical-align:middle;}  /* vervanger van align='absmiddle' */
.inline-icon16 {margin-bottom:.25em;vertical-align:middle;width:16px;height:16px;}  /* vervanger van align='absmiddle' */
.inline-icon24 {margin-bottom:.25em;vertical-align:middle;width:24px;height:24px;}  /* vervanger van align='absmiddle' */
.affiches {
   text-align:center;
   margin-left:0px;
   margin-bottom:20px;
   border:none; /*1pt solid #ddddee;*/
   background:white;/*#ffffe0;*/
}
/*.affiches img   { border: none; } solid 1px #0080FF; }*/
.logo25         { border:none; width:25px; height:25px; }
.fed25          { border:1px solid #c0c0c0; width:25px; height:25px; }
.logo           { border:none; width:50px; height:50px; }
.logo50         { border:none; width:50px; height:50px; }
.logo50rechts   { border:none; width:50px; height:50px; float:right; }
.logo100        { border:none; width:100px; height:100px; }
.logo100rechts  { border:none; width:100px; height:100px; float:right; }
.logo200        { border:none; width:200px; height:200px; }
.logo200rechts  { border:none; width:200px; height:200px; float:right; }
/*.affiches .logo,.affiches .logo50,.affiches .logo100,.affiches .logo200 { border: none; }*/
.affiches .break { clear:both;}
.affiches h3 {
   margin:5px auto;
   background-color: #ffff80;
   border-top:1pt solid #ddddee;
   border-bottom:1pt solid #ddddee;
   text-align:center;
   display:block;
   clear:both;
   height:12px;
}
.affichebreak {
   clear:both;
   height:1px;
   border-bottom:1px solid #ddddee;
}
/* --- [ wandelmee pagina ]-------------------------------------------------- */
/*
.wandelmee {
   float:right;
   width:250px;
   height:300px;
   border:2px solid #0080ff;
   padding:10px;
   margin-left:15px;
   margin-bottom:15px;
   background-color:white;
   -moz-border-radius: 15px;
   -webkit-border-radius: 15px;
}
.wandelmee h2 {
   margin:5px 0 10px 0 !important;
   text-align:center;
}
.wandelmee .logo {
   float:left;
}
*/
/* --- [ 1 affiche ] -------------------------------------------------------- */
.affiche {
   width:215px;
   height:275px;
   overflow:hidden;
   font-size:11px;
   font-family: Arial, sans-serif;
   /*color: #345E8E;*/
   background-color:white;
   margin:4px 5px;
   float:left;
   padding:0 5px;
}
.affiche:hover { background-color:#fafafa; }
.affiche .wandeling {
   height:75px;
}
.affiche .uitslag {
   height:25px;
   line-height:25px;
   background-color:#800040;
   color:white;
   margin:4px 1px;
   font-weight:bold;
   clear:both;
}
.affiche .uitslag A:link    { color:white; text-decoration:underline; }
.affiche .uitslag A:visited { color:white; Text-decoration:underline; }
.affiche .uitslag A:hover   { color:white; text-decoration:underline; }

.affiche h2 {
   background-color:#000040;
   color:white;
   text-align:center;
   display:block;
   font-size:11px;
   padding:0px;
   margin:0 0 4px 0;
}
/* --- [ grotefoto ] -------------------------------------------------------- */
.grotefoto       {
   text-align:center;
   background-color:white;
   border-bottom:1px solid #ccc;
   margin:5px;
   float:left;
}
.grotefoto img {
   border: none;
   text-align:center;
   margin:3px auto;
}
.grotefoto h1 {
   font-family: verdana, arial, helvetica, sans-serif;
   font-size:16px;
   font-weight:bold;
   padding:8px 15px;
   text-align:center;
}
.indent15 { margin-left:15px;}

.klein {
   font-size:8pt;
   font-family: Arial, sans-serif;
   /*color: #345E8E;*/ }
.kleininput {
         font-size:7pt;
         font-family: Arial,sans-serif;
         color: #647EAE; }
.kleinindent {
         font-size:8pt;
         font-family: Arial, sans-serif;
         color: #345E8E;
         margin-left:25px; }


.linken1col {
   font-size:8pt;
   font-family: Arial, sans-serif;
   padding:10px;
   border-bottom:1px solid #cccccc;
   width:100%;
   float:left;
}
.linken1col .logo50 {
   margin-right:10px;
   float:left;
}
.linken1col .foto {
   margin-right:10px;
   float:left;
}
.linken2col {
   font-size:8pt;
   font-family: Arial, sans-serif;
/*    color: #345E8E; */
   padding:10px;
   border-bottom:1px solid #cccccc;
   height:105px;
   width:355px;
   float:left;
}
.linken2col .logo100 {
   margin-right:10px;
   float:left;
}

.linken3col {
   font-size:8pt;
   font-family: Arial, sans-serif;
/*    color: #345E8E; */
   padding:10px;
   /*border:1px solid #cccccc;*/
   height:50px;
   width:225px;
   float:left;
}
.linken3col .logo50 {
   margin-right:10px;
   float:left;
}

/*
.linken2x2rechts, .linken2x2links {
   font-size:8pt;
   font-family: Arial, sans-serif;
   color: #345E8E;
   padding-top:10px;
   border-bottom:1px solid #cccccc;
   border-top:1px solid #cccccc;
   margin-bottom:10px;
   padding-bottom:10px;
   height:90px;
   width:325px;
   float:left;
}
.linken2x2rechts {
   margin-left:10px;
   padding-left:10px;
   border-left:1px solid #cccccc;
}
.linken2x2links {
   margin-right:10px;
   padding-right:10px;
}
.clubstabel .linken2x2rechts, .clubstabel .linken2x2links {
   background-color:#d5eaff;
   border:none;
   padding:13px !important;
   margin:3px !important;
   -moz-border-radius: 25px;
   -webkit-border-radius: 25px;
   border-radius: 25px;
}
*/


/* speciale kolommen en rijen */
.datumkolom   {width:60px !important; text-align:center !important;}
.standkolom   {text-align:center !important;font-weight:bold;}
.eigenclubrij {background-color:#e8e8ff !important; outline:1px solid red;}

.stand { /*font-size:8pt !important;
         font-family: Arial, sans-serif;
         color: #000030;
         margin:10px auto !important;
         text-align:center !important;*/
  /* width:680px;*/
}
#iframe-page .stand {
   font-size:8pt !important;
   margin:0 0 !important;
   text-align:left !important;
}
/*#iframe-page .stand .kalender-table {
   width:680px;
   margin-left:10px;
   border:4px solid red;
} */
.stand a {
   font-size:8pt !important;
}
.stand td {
   /*font-size:8pt !important;*/
   text-align:left;
}

.link  { font-size:8pt;
         font-family: Arial, sans-serif;
         color: #113372
       }

.link A:link    { color:#0000ff; text-decoration:underline; }
.link A:visited { color:#444444; Text-decoration:underline; }
.link A:hover   { color:#000000; text-decoration:underline; }

.affichemaand { background-color: #ffff80;
                border-top:1pt solid #ddddee;
                border-bottom:1pt solid #ddddee;  }


/* gebruikt in de getoonde tabellen */

.lijsttable {
  border:1px solid black;
  width:660px;
  margin-left:10px;
}
.lijsttable-heading {
   background-color:#d2ffff;
}
.lijsttable th {
   border-top:3px solid black;
   border-bottom: solid 1px black;
   border-left: solid 1px black;
   border-right: solid 1px black;
  padding:2px 5px;
  font-size:8pt;
  font-family: Arial, sans-serif;
  font-weight:bold;
  color: #000000;
  background-color:#FFFFC4;
}
.lijsttable td {
  border: solid 1px black;
  padding:2px 5px;
  font-size:8pt;
  font-family: Arial, sans-serif;
  color: #000000;
}
.lijsttotal {
  border: solid 1px #ccccdd;
  padding:2px 5px;
  font-size:8pt;
  font-family: Arial, sans-serif;
  color: #000030;
  background-color:#ffff00;
}


.ecwritewizard {
   margin:15px  0px;
}
.ecwritewizard table {
   border-collapse:collapse;
}
.ecwritewizard td {
   padding:3px 6px;
}
.ecwritewizard ul {
   margin-left:35px;
}
.ecwritewizard li {
   margin-left:35px;
}
.ecwritewizard p {
   margin-left:35px;
   text-align:justify;
}

.wiz_table   { border:1px solid black; }
.wiz_table td , .wiz_table th{ padding:3px 5px; }
.wiz_caption { text-align:center; font-weight: bold; }
.wiz_activecaption   {
   text-align:center;
   font-size:8pt;
   font-weight: bold;
   text-decoration: none;
   color:#000000; }
.wiz_inactivecaption {
   text-align:center;
   font-size:8pt;
   font-weight: normal;
   font-style: italic;
   font-variant:small-caps;
   color:#808080; }

.lijst_th, .lijst_break
          { padding:2px;
            font-size:8pt;
            font-family: Arial, sans-serif;
            font-weight:bold;
            color: #000030;
            background-color:#FFFFC4;
          }
.lijst_td { padding:2px;
            font-size:8pt;
            font-family: Arial, sans-serif;
            color: #000030;
          }
.lijst_total { padding:2px;
               font-size:8pt;
               font-family: Arial, sans-serif;
               color: #000030;
               background-color:#ffff00;
             }

.zieook { float:right;
          width:200px;height:25px;
          border:solid 1px #0080FF;
          text-align:center;
          background-color:#D7EBFF;
        }

/* --- type kaders - steeds met kader suffix -------------------------------- */
/*     enkel kleur, padding en kader instellen                                */

.opvallend-kader {
   background-color:#ffffff;
   color:#0080ff;
   padding:6px;
   text-align:center;
   border:2px solid #0080ff;
   position:relative;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-box-shadow: 5px 5px 5px #aaa ;
   -webkit-box-shadow: 5px 5px 5px #aaa;
   box-shadow: 5px 5px 5px #aaa;
}
.opvallend-kader.marginbottom { margin-bottom:35px !important;}
.opvallend-kader.margintop { margin-bottom:35px !important;}
.opvallend-kader .caption {
   position:absolute;
   background-color:white;
   color:#0080ff;
   top:-10px;
   left:15px;
}
.gekleurde-achtergrond { background-color:#ffffC0 !important; }
.opvalllend-kader A:link    { color:#ffffff; text-decoration:none;      }
.opvalllend-kader A:visited { color:#ffffff; Text-decoration:underline; }
.opvalllend-kader A:hover   { color:#ffff00; text-decoration:none;      }

.opvallend-kader table {
   width:90%;
   margin:5px auto;
}
.opvallend-kader td {
   text-align:left;
   padding:3px 7px;
}

.aandachtskader {
   text-align:left;
   margin:20px;
   border:1px solid #ddddee;
   background-color:#ffffe0;
   color: #5774a8;
}
.aandachtskader table {
   width:100%;
   border:1px solid gray;
   background-color:white;
}
.aandachtskader td {
   border:1px solid gray;
   background-color:white;
   padding:2px 5px;
   vertical-align:middle;
}

/* --- foutmeldingen --- */
.fout-kader {
   background-color:#ce0000;
   color:#ffffff;
   padding:6px;
   font-weight:bold;
   text-align:center;
   border:2px solid #800000;
   width:80%;
   margin:10px;
}
.fout-kader A:link    { color:#ffff00; text-decoration:none;      }
.fout-kader A:visited { color:#ffff00; Text-decoration:underline; }
.fout-kader A:hover   { color:#ffffff; text-decoration:none;      }
.fout-tekst {
   color:#ce0000;
   font-weight:bold;
}

/* --- breedteaanduidingen -------------------------------------------------- */
/*     breedte moet rekening houden met dikte van de border , dus aparte
       breedte per type volledige breedte                                     */
.volledige-breedte { width:100% !important; /* outline:1px solid #ff00ff; */ clear:both; }
.halve-breedte     { width:50%  !important; /* outline:1px solid #972fff; */ }
.eenderde-breedte  { width:33%  !important; /* outline:1px solid #06ff06; */ }
.tweederde-breedte { width:65%  !important; /* outline:1px solid #ff8000; */ }

/*     bij opvallende kaders plaats laten voor de schaduw                     */
.opvallend-kader.volledige-breedte { margin:3px;width:97% !important }
.opvallend-kader.halve-breedte     { margin:3px;width:47% !important }
.opvallend-kader.eenderde-breedte  { margin:3px;width:30% !important }
.opvallend-kader.tweederde-breedte { margin:3px;width:63% !important }


  /* margin-left:10px !important;*/

/*
.volledige-breedte-opvallend-kader {
   clear:both;
   width:90% !important;        -* border van 2px ! *-
  -* margin-left:10px !important; *-
}
*/
/*
.volledige-breedte-uitleg {
   clear:both;
   width:650px !important;
}
*/
/*
.volledige-breedte-aandachtskader {
   clear:both;
   width:664px !important;        -* border van 2px ! *-
 -* margin-left:10px !important; *-
}
*/

/* --- breedteaanduidingen -------------------------------------------------- */
/*     breedte moet rekening houden met dikte van de border , dus aparte
       breedte per type halve breedte                                     */
/* .halve-breedte-tabel, .halve-breedte {
   width:50% !important;
   outline:1px solid #972fff;
}
 */
 /*
.halve-breedte-opvallend-kader {
   clear:both;
   width:90% !important;        -* border van 2px ! *-
}
.halve-breedte-tabel {
   clear:both;
   margin-left:10px !important;
}
.halve-breedte-uitleg {
   clear:both;
   width:310px !important;
   margin-left:10px !important;
}
.halve-breedte-aandachtskader {
   clear:both;
   width:322px !important;        -* border van 2px ! *-
   margin-left:10px !important;
}
*/

/* --- breedteaanduidingen -------------------------------------------------- */
/*     breedte moet rekening houden met dikte van de border , dus aparte
       breedte per type eenderde breedte                                     */
/*
.eenderde-breedte-opvallend-kader {
   width:190px !important;        -* border van 2px ! *-
   margin-left:10px !important;
}
.eenderde-breedte-tabel, .eenderde-breedte {
   width:33% !important;
   -*margin-left:10px !important;*-
}
.opvallend-kader.eendere-breedte {
   width:30% !important;
}
.eenderde-breedte-uitleg {
   width:205px !important;
   margin-left:10px !important;
}
.eenderde-breedte-aandachtskader {
   width:211px !important;        -* border van 2px ! *-
   margin-left:10px !important;
}
*/


/* --- tekstblokken in verschillende kolommen ------------------------------- */
.tekst-2col {
}
.tekst-2col .halve-breedte {
   width:355px !important;
   /* outline:1px solid #ff9393; */
}
.halve-breedte.floatleft {
   padding:10px 20px 10px 0;
   /* outline:1px solid #d9d900; */
}
.halve-breedte.floatright {
   padding:10px 0 10px 20px;
   /* outline:1px solid #b3b3ff; */
}


/* --- hoogtes -------------------------------------------------------------- */
.hoogte-aankondiging {
   height:85px;
}


/* --- promotekst ----------------------------------------- */
.promotitel {
           background-color:#000080;
           color:white;
           font-size:20px;
           font-weight:bold;
           text-align:center;
           padding:4px 0px;
           margin:0 0 10px 0;
           display:block;
           }
.promotekst {
           width:670px;
           background-color:#0080FF;
           color:white;
           border:5px solid #000080;
           padding:3px 3px 3px 3px;
           font-family:verdana, arial, sans-serif;
           margin-bottom:10px;
           float:left; }
.promotekst h1 {
           font-size:20px;
           font-weight:bold;
           color:white;
           margin:0px; }
.promotekst h2 {
           font-size:17px;
           font-weight:bold;
           color:yellow;}
.promotekst form {
           float:right;
           margin:5px 0px 0px 0px;}

/* --- bestelkader ---------------------------------------- */

.bestelkader {
           float:left;
           width:670px;
           border:1px solid #0080ff;
           border-left:15px solid #0080ff;
           padding:0px 0px 0px 0px;
           background-color:#FFFF80;
           margin-top:15px; }
.bestelkader em {
           display:block;
           background-color:#0080ff;
           color:#ffffff;
           padding:3px;
           font-weight:bold; }
.bestelkader .tekst {
           clear:both;
           border-left:5px solid #000060;
           padding:10px 10px 10px 10px;
           margin:0 10px 0 0; }
.bestelkader form {
           float:right;
           clear:both;
           margin:5px 0px; }

/* --- alle tabellen die wandelgegevens laten zien -------------------------- */
.wandellijst-table {
   width:100%;  /*752px;*/
   color:black;
   padding-right:0 !important;
   margin-right:0 !important;
   border:none;
/*   border:1px solid #333 !important; */
}
.wandelkalender-1dag .wandellijst-table { width:355px !important; }
#iframe-page         .wandellijst-table { width:710px;}
#staplijst-tabs      .wandellijst-table { width:710px;}

.wandellijst-table-divider {
   background-color:#004e9b;
   padding:0px !important;
}
.wandellijst-table td, .wandellijst-table th {
   font-size:0.85em;
   border-bottom:1px solid #666;
   padding:8px 3px;
   overflow:hidden;
}
.wandellijst-table th {
   text-align:center;
}
.wandellijst-table td {
   /*text-align:left !important;*/
}
.wandellijst-met-grafieken .wandellijst-table td {
   padding:2px 3px !important;
   vertical-align:middle;
   border-bottom:1px solid #dfdfdf;
}
.wandellijst-table-header {
   background-color:#004e9b;
   color:white;
   padding:4px 4px 2px 4px !important;
}
.wandellijst-table-header h2 {
   color:white;
}

.sortering {
   width:660px;
   padding:5px;
   border:1px solid blue;
   text-align:center;
}

/* *** wandelkalender ******************************************************* */
/* *** maand *** */
.kalender-table {
   width:680px;
   border:1px solid #003366;
}
.kalender-table td, .kalender-table th {
   font-size:11px;
   border:1px solid #003366;
}
.kalender-table-header {
   background-color:#003366;
   color:white;
}
/* *** dag *** */
.dagkalender-table {
   width:355px;
   border:none;
   background-color:white;
}
.dagkalender-table td, .kalender-table th {
   font-size:11px;
   line-height:14px;
   border-bottom:1px solid green;
   padding:10px 3px !important;
}
.dagkalender-table-header {
   background-color:#0080ff;
   color:white;
}

/* *** daglijst *** */
.daglijstkalender-table {
   /*margin-left:10px;*/
   width:100%;
   border:2px solid #000080;
   background-color:white;
}
.daglijstkalender-table td  {
   font-size:11px;
   line-height:16px;
   vertical-align:middle !important;
   border:none;
   padding:3px 3px 0px 15px !important;
}
.daglijstkalender-table td img {
   width:18px;
   height:18px;
   padding:1px 2px;
}
.daglijstkalender-table-header {
   background-color:#000080;
   color:white;
   text-align:left;
   padding:10px 25px !important;
   font-variant: small-caps;
 /*  border-top:1px solid #adadad;
   border-bottom:1px solid #adadad; */
}


.clear-both { clear:both; }
.clear { clear:both; }

.clubhoofding {
   border:2px solid #004891;
   padding:4px 8px;
   margin:5px 5px 10px 0;
   width:730px;
   height:55px;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border-radius: 5px;

   background-color:#d5eaff;
   background: -moz-linear-gradient(top, top, white, #d5eaff 95%);
   background: -webkit-gradient(linear, top, white, #d5eaff 95%);
   background: -webkit-linear-gradient( top, white, #d5eaff 95%);
   background: -o-linear-gradient(top, white, #d5eaff 95%);
   background: linear-gradient(top, white, #d5eaff 95%);
   box-shadow: 5px 5px 5px #aaa;
}
.clubhoofding h2 {
   clear:none;
   margin:0 0 0 10px;
}
.clubhoofding-metbericht {
   height:120px;
}

.tabelperwandeling {
   border:1px solid blue;
   border-collapse:collapse;
   width:660px;
}
.tabelperwandeling td {
   font-size:8pt !important;
   overflow:hidden;
   border:1px solid blue;
   text-align:center;
   font-family: Arial, sans-serif;
   padding:2px 5px;
}
.horizbartabel {
   border:1px solid #000 !important;
   border-collapse:collapse;
}
.horizbartabel td {
   border:1px solid #000 !important;
   padding:2px 0px;
}

.clubstabel {
   padding-left:15px;
   padding-bottom:10px;
   border-bottom:1px solid #dddeee;
   margin-top:5px;
   margin-bottom:5px;
}

/* --- nieuwstabel ----------------------------------- */

.nieuwstabel {
}
.nieuwstabel div {
   border-bottom:1px solid #dddeee;
   margin-top:10px;
   padding-bottom:10px;
}
/*
.nieuwtabel td {
   text-align:left;
   vertical-align:top;
   font-size:8pt;
   font-family: Arial, sans-serif;
   color:#345E8E;
   border-bottom:1px solid #dddeee;
}
*/
/*
.clubstabel th {
   text-align:left;
   vertical-align:top;
   font-size:8pt;
   font-family: Arial, sans-serif;
   color:#345E8E;
   border-bottom:1px solid #dddeee;
}
.clubstabel td {
   text-align:left;
   vertical-align:top;
   font-size:8pt;
   font-family: Arial, sans-serif;
   color:#345E8E;
   border-bottom:1px solid #dddeee;
   padding-left:25px;
}
*/

/* --- legende -------------------------------------------- */
.legende {
   width:300px;
   height:76px;
   border:none;
   padding:3px 5px;
   float:right;
}
.legende img {
/*   width:16px;
   height:16px;*/
   border:none !important;
   padding:0 3px 0 0 !important;
   vertical-align: middle;
}

/* --- contentsblock (links van het scherm ---------------- */
#contentsblok {
   width:752px;
   border:none;
   left:0;
   float:left;
   padding:0px 10px 0 12px;
}
/* --- in skeleton scherm - overruled breedte van #contentsblok ------------- */
#schermvoorbeeldblok {
   background: white url(http://www.staplijst.be/images/back-880.jpg) repeat-y top left;
   width:880px;
}
#schermvoorbeeldblok h1 {
  clear:both;
}
#schermvoorbeeldblok h2 {
  clear:both;
}
#schermvoorbeeldblok .grotefoto {
   width:860px;
   margin:0 10px;
   border:none;
}
#schermvoorbeeldblok img {
   margin-top:10px;
}
#schermvoorbeeldblok span {
   font-size:10px;
}

/* --- infoblok (rechts van het scherm) ------------------- */
#infoblok {
   width:180px;
   border:none;
   font-size:8pt;
   line-height:125%;
   font-family: Arial, sans-serif;
   color: #345E8E;
   right:0;
   float:right;
   margin:0;
   padding:0 12px 0 9px;
   border-left:1px solid #31569d;
}
#infoblok table {
   width:171px;
   /*height:100%;*/
   border-collapse:collapse;
   border:none;
}
/*
#infoblok td {
   border:none;
   padding:0;
   font-size:8pt;
   font-family: Arial, sans-serif;
   color: #345E8E;
} */
.infotop {
   border:1px solid #c0c0c0;
   background-color:#f7f7f7;
   /*background: #fff url(http://www.staplijst.be/images/tabtop-171.jpg) top left;*/
   width:171px;
   height:20px;
   line-height:22px;
   text-align:center;
   margin:5px 0 0 5px;
   font-weight:bold;
}
.infomidden {
   /*background: #fff url(http://www.staplijst.be/images/tabback-171.jpg) repeat-y top left;*/
   width:171px;
   text-align:left;
   padding:2px 10px 2px 5px;
   margin:0 0 0 5px;
   /*padding:2px 13px 2px 6px !important;*/
}
.infotussenstuk {
   /*background: #fff url(http://www.staplijst.be/images/tabmiddle-171.jpg) top left;*/
   width:171px;
   height:21px;
   line-height:21px;
   text-align:center;
   margin:0 0 0 5px;
   border-bottom:1px solid #c0c0c0;
}
.infobodem {
   /* background: #fff url(http://www.staplijst.be/images/tabdown-171.jpg) top left; */
   height:7px;
   width:171px;
   margin:0 0 25px 5px;
   /*border-bottom:2px solid #c0c0c0;*/
}
.infokader {
   width:171px;
   height:20px;
   line-height:20px;
   text-align:center;
   border:1px solid #0080ff;
   margin:8px 0 0 0;
   background-color:white;
   color:#0080ff;
}
.headerlink{
   /*background: url(http://www.staplijst.be/images/arrow.jpg) no-repeat 2px 11px;*/
   padding-left:20px;
   /*font-variant:small-caps !important;*/
   /*font-size:11px;*/
}
.headerlink A:link    { color:#0000ff; text-decoration:none; }
.headerlink A:visited { color:#444444; Text-decoration:none; }
.headerlink A:hover   { color:#000000; text-decoration:underline; }

.headerlink-zoekuwclub {
   width:160px;
   /* background: url(http://www.staplijst.be/images/arrow.jpg) no-repeat 2px 11px; */
}

.headerlink-nieuw {
   background-color: #ca0000;
   color:white;
   padding:0px 7px 1px 7px;
   /* margin:28px 0 0px 0 !important; */
   border:1px solid white;
   font-weight:bold;
   text-align:center;
}
.headerlink-nieuw A:link    { color:#ffffff; text-decoration:none;      }
.headerlink-nieuw A:visited { color:#ffffff; Text-decoration:none;      }
.headerlink-nieuw A:hover   { color:#ffff00; text-decoration:underline; }


.uitslag {
   margin:15px 0;
}
.uitlag table {
   border:1px solid black;
}
.uitslag td, .uitslag th {
   border:1px solid black;
   font-size:10px;
   padding:2px 5px;
   text-align:left;
}

/* --- maandkalender -------------------------------------------------------- */
.maand {
   padding:0 !important;
   margin:0 !important;
   font-size:9px !important;
   line-height:14px !important;
}
.maand table {
   /*width:120px;*/
   height:75px;
   border-collapse:collapse;
   border:1px solid #9bdeff;
}
.maand td {
   padding:0 0;
   height:31px;
   border:1px solid white;
   text-align:center;
   background-color:#e1f5ff;
}
.maand th {
   padding:0 1px;
   height:16px;
   border:1px solid white;
   text-align:center;
   background-color:#c1ebff;
}
.maand .monthname {
   border:none;
   margin:0;
   padding:0;
   line-height:19px;
}
.maand .clickable   {cursor:pointer !important;padding:0 !important;}
.maand .diaryhours  {color:#0080FF;width:48px;text-align:center;margin-top:0;background:#fff;}
.maand .diarytext   {color:#000080;width:48px;text-align:center;margin-top:0;background:#fff;border:1px solid #000080;text-decoration:none;}
.maand .diarytext:hover   {text-decoration:underline;}
.maand .datein      {color:#000000;width:48px;text-align:center;}
.maand .tdout       {background-color:#f4fcff;}
.maand .dateout     {color:#ababdb;width:48px;text-align:center;}
.maand .datetoday   {color:#0000ff;width:48px;text-align:center;font-weight:bold;/* border:1px solid #ff0000 ;*/background-color:#ff0000 !important;}
.maand .datemarked  {cursor:pointer;font-weight:bold;color:white;background-color:#000080;border-top:1px solid #000080;border-left:1px solid #000080;border-right:1px solid #000080;}
.maand .inthepassed {color:#ceceff;}
.maand .inthepast   {color:#ceceff;}


/* --- specifiek voor de starten met staplijstpagina ------------------------ */
.uitlegblok {
}
.uitleg { padding:6px; }
.uitlegblok img { margin:6px; }
.uitlegscherm_links {
    font-family:"arial narrow",arial,sans-serif;
    color:#000040;
    background-color:white;
    text-align:center;
    font-style:italic;
    font-weight:bold;
    border:1px solid #000040;
    position:relative;
    margin:10px 0 10px 10px;
}
.uitlegscherm_rechts {
    font-family:"arial narrow",arial,sans-serif;
    color:#000040;
    background-color:white;
    text-align:center;
    font-style:italic;
    font-weight:bold;
    border:1px solid #cccccc;
    position:relative;
    margin:10px 10px 10px 0;
}
.uitlegscherm_center {
    font-family:"arial narrow",arial,sans-serif;
    color:#000040;
    background-color:white;
    text-align:center;
    font-style:italic;
    font-weight:bold;
    border:1px solid #cccccc;
    position:relative;
    margin:10px auto;
}

/* --- contacttabel - enkel gebruikt in contactinfo-pagina ------------------ */
.contacttabel {
   border:1px solid #ccc;
}
.contacttabel td, .contacttabel th {
   padding:3px 6px;
   border:1px solid #ccc;
}
.contacttabel th {
   background-color:#a8d3ff;
}


.gekleurd {
   background-color:#ffffC0;
   border:1px solid #f2f200;
   margin-left:10px;
}

/* --- hoedini pagina's ----------------------------------------------------- */
.tips {

}
.tips h3 {
   clear:none;
}
.tips ul, .tips ol {
margin-top:28px;
   margin-bottom:28px;
}
.tips li {
   margin-top:8px;
   margin-bottom:8px;
}
.tips-terug {
   float:right;
   margin:5px;
   width:150px;
   height:25px;
   line-height:25px;
   border-radius: 5px;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   text-align:center;
   border:1px solid #004e9b;
}
.tips-terug a { display:block; }
.tips-terug a:hover { display:block; background-color:#004e9b; color:white; }

.tips .img-links, .tips .img-rechts, .tips .img-center {
   margin-top:10px;
   margin-bottom:10px;
   padding:5px;
}
.tips .img-links {
   margin-left:10px;
   margin-right:0;
}
.tips .img-rechts {
   margin-left:0;
   margin-right:10px;
}
/* -- alleen bij kleine schermafdrukken --*/
.tips .img-indent {
   margin-left:25px;
}

/* -------------------------------------------------------------------------- */

.background-color-lichtblauw {
   background-color:#f8fcfd;
}
.scrolldiv180 {
   height:180px;
   overflow:scroll;
   border:1px solid #eeeeee;
}
.stepdialogs {
   border:1px solid #ccc;
   margin:25px;
   padding:10px;
   background-color:white;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   -moz-box-shadow: 5px 5px 5px #aaa ;
   -webkit-box-shadow: 5px 5px 5px #aaa;
}
.steplogin {
}
.stepdialog-table {
   margin:15px auto;
   border:1px solid #ccc;
}
.stepdialog-table td {
   padding:5px 10px;
}
.stepdialog-explanation {
    font-size:10px;
    border-top:1px solid #ccc;
}
.stepdialog-table-header {
   background-color:#ffffbf;
   line-height:26px;
   font-size:12px;
   padding-left:10px;
}
/* --- logo mozaiek --------------------------------------------------------- */
.grotelogomozaiek {
   width:620px;
   margin:5px auto;
   height:auto;
   padding:2px;
}
.grotelogomozaiek img {
   float:left;
   margin:1px;
   width:100px;
   height:100px;
}
.grotelogomozaiek-titel {
   width:100%;
   font-size:12px;
   height:25px;
   line-height:25px;
   text-align:center;
}
.logomozaiek {
   width:100%;
   height:150px; /*auto;*/
   overflow:hidden;
   background-color:black;
   padding:2px;
}
.logomozaiek img {
   float:left;
   margin:1px;
   width:24px;
   height:24px;
}
.logomozaiek .mozaiek-titel {
   clear:both;
   font-size:10px;
   color:white;
}
.infomidden .logomozaiek {
   width:163px;
   background-color:transparent;
}
.infomidden .logomozaiek .mozaiek-titel {
   clear:both;
   height:12px;
   font-size:10px;
   overflow:hidden;
   width:163px;
   text-align:center;
}
#sorteerbaar {
   width:660px;
   background-color:yellow;
}
#sorteerbaar div {
   width:50px;
   height:50px;
   border:1px solid blue;
   float:left;
   margin:5px;
}
#sorteerbaar img {
   width:50px;
   height:50px;
}
.mozaiek-titel {
   clear:both;
   margin-top:15px;
   overflow:hidden;
   height:15px;
   background-color:#004e9b;
   color:white;
   padding-left:2px;
}
/* --- twitter/facebook dingen ---------------------------------------------- */
.infomidden .socialnetwerkblok {
   padding:8px 0 0 2px;
}
.infomidden .socialnetwerkblok img {
   margin:1px;
}
.infomidden .logomozaiek .mozaiek-titel {
   padding-top:3px;
   padding-bottom:0;
   color:black;
}
.links-bovenuit {
   position:absolute;
   left:5px;
   top:-8px;
}
.rechts-bovenuit {
   position:absolute;
   right:5px;
   top:-38px;
}
.rechts-benedenhoek {
   position:absolute;
   right:0px;
   bottom:0px;
}

.smalle-padding-rondom {
   padding:13px;
}
/*
.ui-tabs-panel {
width:300px;
border:1px solid #0000cc;
}
.ui-tabs-nav a, .ui-tabs-nav a span {
background:url(../img/tab-sprite.gif) no-repeat;
}
.ui-tabs-nav a {
background-position:100% 0%;
}
*/

.img-affiche {
   width:175px;
}

.binnen-3-dagen {
   background-color:#ffff80;
}
.binnen-10-dagen {
   background-color:#ffffd9;
}
.ronde-hoeken {
   -moz-border-radius: 10px;
   -webkit-border-radius: 10px;
}
.kleine-ronde-hoeken {
   -moz-border-radius: 8px;
   -webkit-border-radius: 8px;
}
.h1-img48 {
   line-height:48px;
}
.h1-img48 img {
   vertical-align:middle;
   width:48px;
   height:48px;
   padding-right:10px;
}

#googlemap-canvas {
   width:500px;
   height:400px;
   border:1px solid #eeeeee;
}
.googlemap-link {
   padding:5px 15px;
   font-size:110% !important;
   line-height:150% !important;
}
.googlemap-link-inline {
   padding:0px 15px;
   font-size:100% !important;
   line-height:100% !important;
}
.datum-verleden .googlemap-link , .datum-verleden-alt .googlemap-link {
   /*padding:0px 15px;*/
   /*line-height:90% !important;*/
   /*font-size:0.8em !important;*/
}
.googlemap-link a {
   font-size:1.2em !important;
   line-height:1.5em !important;
}
.wandellijst-table .googlemap-link a {
/*   padding:10px;*/
}
/*.wandellijst-table .googlemap-link {
   padding:0;
}  */
/* *** wandelkalender ******************************************************* */
/* *** maand *** */
.ingaveformulier-table {
   width:630px;
   /* border:1px solid #000080; */
}
.ingaveformulier-table td, .ingaveformulier-table th {
   font-size:13px;
   /* border:1px solid #000080; */
   padding:3px 8px;
}
.ingaveformulier-table-header {
   background-color:#0080ff;
   color:white;
}
/* *** Klasse voor toekomst en verleden************************************** */
/* *** maand *** */
.tr-odd {
   background-color:white;
}
.tr-even {
   background-color:#ffffd5;
}
.tr-highlight {
   /* background-color:#f8f8f8; */
   opacity:0.9;
   border-left:3px solid #666;
/*    background: linear-gradient( top, #fff, #ebebeb 60%, #d4d4d4);  Officiële syntax */
/*   background: -webkit-linear-gradient( top, #fff, #ebebeb 60%, #d4d4d4);  Google */
/*   background: -o-linear-gradient( top, #fff, #ebebeb 60%, #d4d4d4);  Opera */
/*   background: -moz-linear-gradient(top, #fff, #ebebeb 60%, #d4d4d4);  */
/*   background: -webkit-gradient(linear, top, #fff, #ebebeb 60%, #d4d4d4);  */

}
.datum-verleden {
   color:#8080f0;
   background-color:white !important;
}
.datum-verleden-alt {
   color:#8080f0;
   background-color:#f5f5f5 !important;
}
.datum-toekomst {
   background-color:#ffffea !important;
}
.datum-toekomst-alt {
   background-color:#ffffaa !important;
}
.datum-nabije-toekomst, .datum-vandaag {
   background-color:#ffff00 !important;
}
.datum-nabije-toekomst-alt, .datum-vandaag-alt {
   background-color:#ecec00 !important;
}
.datum-vandaag, .datum-vandaag-alt {
   color:#770000;
}

/* *** Wandelwiki************************************************************ */
.wandelwiki-index {
   font-size:11px;
   border:1px solid #b8d6fb;
   height:21px;
   padding:0px 12px;
   background: #7D7DA6 url(http://www.staplijst.be/images/gradient-licht-blauw-6op20a.jpg) repeat-x top left;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
}

/* *** kader met alle wandelingen in **************************************** */
.kader-met-wandelingen {
   width:200px;
   border:1px solid #e8e8e8;
   background-color:white;
   padding:5px 8px;
   -moz-border-radius: 10px;
   -webkit-border-radius: 10px;
   margin:5px;
}

/* *** optie menu *********************************************************** */
.slw-menu h2 {
   margin:20px 15px 10px;
}
.slw-menu li {
   display:block;
   margin:8px 0px;
}
.slw-menu a {
   display:block;
   width:450px;
   height:35px;
   line-height:35px;
   padding:0px 10px;
   border:1px solid #e6f2ff;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
}
.slw-menu a:hover {
   background-color: #e6f2ff;
   border:1px solid #ddedff;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border-radius: 5px;
}
.slw-header {
   border:3px solid black;
   width:680px;
   padding:5px;
}
.slw-dbs {
   border:none;
   width:750px;
   padding:5px;
   clear:both;
}
.slw-dbs table {
   width:100%;
   border:none; /* 1px solid #444; */
}
.slw-dbs td, .slw-dbs th {
   padding:2px 5px;
   border-bottom:1px solid #444;
}
.slw-dbs .submit-button {
   padding:3px 15px;
}
.slw-dbs .dbs-row {
   background-color:white;
}
.slw-dbs .dbs-alt-row {
   background-color:#ecf7ff;
}
.slw-dbs .dbs-image {
   /*width:16px;
   height:16px;*/
   margin:0 2px;
   padding:0px;
}
/* .slw-dbs .dbs-image {
   padding:0;
   margin:0 0; outline:1px solid cyan;

} */


/* --- dbs ------------------------------------------------------------------ */
.dbstepper-table {
   border-collapse:collapse;
   border:none !important; /* 1px solid #004891; */
}
.dbstepper-table td, .dbstepper-table th {
   font-size:10px;
   border-bottom:1px solid #004891;
   /* border:1px solid #004891; */
   padding:3px 6px;
}
.dbstepper-table-header {
   background-color:#004891;
   color:white;
   padding-left:10px;
}

/* --- dbs filter box ------------------------------------------------------- */
.dbsfilter {
   width:650px;
   margin:15px 0;
   padding:12px 12px 8px 12px;
   border:1px solid #666;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border-radius: 5px;
   -moz-box-shadow: 5px 5px 5px #aaa ;
   -webkit-box-shadow: 5px 5px 5px #aaa;
   box-shadow: 5px 5px 5px #aaa;
   background: -moz-linear-gradient(top, #ffffff, #ebebeb 60%, #d4d4d4);
   background: -webkit-gradient(linear, top, #ffffff, #ebebeb 60%, #d4d4d4);
   background: -webkit-linear-gradient( top, #ffffff, #ebebeb 60%, #d4d4d4);
   background: -o-linear-gradient(top, #ffffff, #ebebeb 60%, #d4d4d4);
   background: linear-gradient(top, #ffffff, #ebebeb 60%, #d4d4d4);
   position:relative;
}
.dbsfiltercaption {
   position:absolute;
   background-color:white;
   color:#666;
   top:-10px;
   left:15px;
}
/* --- grid ----------------------------------------------------------------- */
.rowheader, .rowdata, .rowtotal {
   font-size:9px !important;
}
.valadd {
   text-align:right !important;
}
.rowheader {
   background-color:#004891 !important;
   color:white !important;
}
.rowheader a  {
   color:white !important;
   text-decoration:underline;
}
.rowheader a:hover {
   color:yellow !important;
}
.rowtotal {
   background-color:#7d7da6 !important;
}
.total {
   font-weight:bold;
   text-align:right !important;
}
.tr-odd .total, .tr-odd .ranking {
   background-color:#fbfbfb;
}
.tr-even .total, .tr-even .ranking {
   background-color:#f5f5f5;
}
.colimp {
   color:#800040;
}
.ranking {
   text-align:center !important;
   color:#0000ff;
   font-weight:bold;
}
.repval.ranking {
   color:transparent ;
}

.gradient-witgrijs {
   background-color:white;
   opacity:0.9;
   background: -webkit-linear-gradient( top, #fff, #ebebeb 60%, #d4d4d4);  /* Google */
   background: -moz-linear-gradient( top, #fff, #ebebeb 60%, #d4d4d4);  /* Firebox */
   background: -o-linear-gradient( top, #fff, #ebebeb 60%, #d4d4d4);  /* Opera */
   background: linear-gradient( top, #fff, #ebebeb 60%, #d4d4d4);  /* Officiële syntax */
}
.gradient-geelwit {
   background-color: #ffff80;
   background: -moz-linear-gradient(top, #ff8, white 95%);   /* Firefox */
   background: -webkit-linear-gradient( top, #ff8, white 95%);
   background: -o-linear-gradient(top, #ff8, white 95%);
   background: linear-gradient(top, #ff8, white 95%);
}


.headerlinken {
   width:100%;
   float:left;
}
.headerlinken li {
   float:left;
   position:relative;
   list-style-type:none;
   padding:0 13px;
   margin:0;
   border-left:1px solid white;
   border-right:1px solid white;
}
/*.headerlinken.menulijn1 li {
   margin:0 0px;
   background-color:red;
}
.headerlinken.menulijn2 li {
   margin:0 0px; background-color:yellow;
} */
/*.headerlinken a {
   display:block;
} */
.headerlinken li:hover {
   background-color:#f4f4f4;
   border-left:1px solid #31569d;
   border-right:1px solid #31569d;
}


.headerlinken .headerlink{
   /*background: url(http://www.staplijst.be/images/arrow.jpg) no-repeat 2px 11px;*/
   padding-left:20px;
   /*font-variant:small-caps !important;*/
   /*font-size:11px;*/
}
.headerlinken .headerlink A:link    { color:#0000ff; text-decoration:none; }
.headerlinken .headerlink A:visited { color:#444444; Text-decoration:none; }
.headerlinken .headerlink A:hover   { color:#000000; text-decoration:underline; }

.headerlinken .headerlink-zoekuwclub {
   width:160px;
   /* background: url(http://www.staplijst.be/images/arrow.jpg) no-repeat 2px 11px; */
}

.headerlinken .headerlink-nieuw {
   background-color: #ca0000;
   color:white;
   padding:0px 7px 1px 7px;
   /* margin:28px 0 0px 0 !important; */
   border:1px solid white;
   font-weight:bold;
   text-align:center;
}
.headerlinken .headerlink-nieuw A:link    { color:#ffffff; text-decoration:none;      }
.headerlinken .headerlink-nieuw A:visited { color:#ffffff; Text-decoration:none;      }
.headerlinken .headerlink-nieuw A:hover   { color:#ffff00; text-decoration:underline; }


