html,body { margin:0; padding:0; }
*         { margin:0; padding:0; }

body {
   background-color: #ffff80;
   color: black;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10pt;
   line-height:125%;
   margin: 0px;
   padding: 0px;
}
/* --- delen van de pagina (id's) ------------------------------------------- */
#website {
   background-color:#ffff80;
   width:880px;
   margin:0 auto;
}
#iframe-page {
   background-color:#f8fcfd;
   width:880px;
   margin:0 0;
}
#websiteheader {
   background: #7D7DA6 url(http://www.staplijst.be/images/staplijst-be-nl-com-wandelingen-880.jpg) top left;
   width:880px;
   height:99px;
}
#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;
   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 {
   clear:both;
   text-align:center;
   background: #7D7DA6 url(http://www.staplijst.be/images/down-880.jpg) top left;
   width:880px;
   height:40px;
}
#websitefooter .link {
   height:22px;
   line-height:22px;
}
#websitefooter 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-880.jpg) 0px 0px;
   width:880px;
   height:66px;
   font-size:9pt;
   font-family: Arial, sans-serif;
   color: #345E8E;
   padding:0px; margin:0;
}
#websitesubheader table {
   margin:0px auto 0 10px;
   width:860px;
}
#websitesubheader td {
   padding:10px 0 0 22px;
}
#websitesubheader input {
   padding:0;
   margin:0;
}
#websitecontents {
   clear:both;
   float:left;
   text-align:left;
   background: #fff url(http://www.staplijst.be/images/back-880.jpg) repeat-y top left;
}
#websitecontents td {
   text-align:left;
}
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;
   margin:10px;
   color:#31569d;
}
h2 {
   clear:both;
   font-size:16px;
   line-height:21px;
   font-style: italic;
   margin:20px 10px 10px 10px;
   color:#31569d;
}
h3 {
   font-size:11pt;
   clear:both;
   margin:20px 10px 10px 10px;
}
h4 {
   font-family: "times new roman", serif;
   font-size:11pt;
   font-style:italic;
   margin:15px 10px 10px 10px;
}
p {
   text-align:justify;
   margin:14px;
}
ul, ol, li {
   margin-left: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;
}
/* --- [ affiches ] --------------------------------------------------------- */
.affiches {
   text-align:center;
   margin-left:0px;
   margin-bottom:20px;
   border:1pt solid #ddddee;
   background:#ffffe0;
}
.affiches img   { border: solid 1px #0080FF; }
.logo           { border:none; width:50px; height:50px; }
.logo50         { border:none; width:50px; height:50px; }
.logo100        { border:none; width:100px; height:100px; }
.logo200        { border:none; width:200px; height:200px; }
.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:250px;
   border:2px solid #0080ff;
   padding:10px;
   margin-left:15px;
   margin-bottom:15px;
   background-color:white;
   -moz-border-radius: 15px;
   -webkit-border-radius: 15px;
}
.wandelmee .logo {
   float:left;
}
/* --- [ 1 affiche ] -------------------------------------------------------- */
.affiche {
   width:210px;
   /*height:250px;*/
   font-size:11px;
   font-family: Arial, sans-serif;
   color: #345E8E;
   background-color:white;
   margin:4px 5px;
   float:left;
}
.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:1px solid #cccccc;
   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;
}
.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; }

.linken2x2rechts {
         font-size:8pt;
         font-family: Arial, sans-serif;
         color: #345E8E;
         padding-top:10px;
         margin-left:10px;
         padding-left:10px;
         border-left:1px solid #cccccc;
         border-bottom:1px solid #cccccc;
         margin-bottom:10px;
         padding-bottom:10px;
         }

.linken2x2links {
         font-size:8pt;
         font-family: Arial, sans-serif;
         color: #345E8E;
         padding-top:10px;
         margin-right:10px;
         padding-right:10px;
         border-bottom:1px solid #cccccc;
         margin-bottom:10px;
         padding-bottom:10px;
         }

.left {text-align:left !important}
.center {text-align:center !important}

.stand { /*font-size:8pt !important;
         font-family: Arial, sans-serif;
         color: #000030;
         margin:10px auto !important;
         text-align:center !important;*/
       }
#iframe-page .stand {
   font-size:8pt !important;
   margin:0 0 !important;
   text-align:left !important;
}
#iframe-page .stand .kalender-table {
   width:640px;
   margin-left:10px;
}
.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 #8888aa;
  width:660px;
  margin-left:10px;
}
.lijsttable th {
  border: solid 1px #ccccdd;
  padding:2px 5px;
  font-size:8pt;
  font-family: Arial, sans-serif;
  font-weight:bold;
  color: #000000;
  background-color:#FFFFC4;
}
.lijsttable td {
  border: solid 1px #ccccdd;
  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; }

.aandachtkader { border:1px solid #cccccc;
                 padding:5px;
                 background-color:#FFFF80;
                 margin:5px;
                 width:100%;
}

.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;
}
.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;
   /*font-size:8pt;
   font-family: Arial, sans-serif;*/
   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;      }


/* --- breedteaanduidingen -------------------------------------------------- */
/*     breedte moet rekening houden met dikte van de border , dus aparte
       breedte per type volledige breedte                                     */
.volledige-breedte-opvallend-kader {
   clear:both;
   width:650px !important;        /* border van 2px ! */
   margin-left:10px !important;
}
.volledige-breedte-tabel,  .volledige-breedte {
   clear:both;
   width:664px !important;
   margin-left:10px !important;
}
.volledige-breedte-uitleg {
   clear:both;
   width:650px !important;
   margin-left:10px !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-opvallend-kader {
   clear:both;
   width:310px !important;        /* border van 2px ! */
   margin-left:10px !important;
}
.halve-breedte-tabel, , .halve-breedte {
   clear:both;
   width:322px !important;
   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;
}

/* --- verschillende soorten spaties ---------------------------------------- */
.boven-onder-spatie {
   margin-top:10px;
   margin-bottom:10px;
}

/* --- 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:685px;
   border:2px solid #888 !important;
}
.wandellijst-table td, .wandellijst-table th {
   font-size:10px;
   border:1px solid #888;
   padding:2px 4px;
   overflow:hidden;
}
.wandellijst-table th {
   text-align:center;
}
.wandellijst-table td {
   /*text-align:left !important;*/
}
.wandellijst-table-header {
   background-color:#0080ff;
   color:white;
}

.sortering {
   width:660px;
   padding:5px;
   border:1px solid blue;
   text-align:center;
}

/* *** wandelkalender ******************************************************* */
/* *** maand *** */
.kalender-table {
   width:680px;
   border:1px solid #000080;
}
.kalender-table td, .kalender-table th {
   font-size:13px;
   border:1px solid #000080;
}
.kalender-table-header {
   background-color:#0080ff;
   color:white;
}
/* *** dag *** */
.dagkalender-table {
   width:320px;
   border:1px solid green;
   background-color:white;
}
.dagkalender-table td, .kalender-table th {
   font-size:11px;
   line-height:11px;
   border:1px solid green;
   padding:1px !important;
}
.dagkalender-table-header {
   background-color:#0080ff;
   color:white;
}

/* *** daglijst *** */
.daglijstkalender-table {
   margin-left:10px;
   width:660px;
   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; }
.floatleft { float:left;}
.floatright { float:right;}

.clubhoofding {
   border:2px solid black;
   padding:5px;
   background-color:#eee;
   margin-left:5px;
   width:660px;
   height:55px;
}
.clubhoofding h2 {
   clear:none;
   margin:0px;
}


.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:none;
   border-collapse:collapse;
}
.horizbartabel td {
   border:none !important;
}

.clubstabel {
   padding-left:15px;
   padding-bottom:10px;
   border-bottom:1px solid #dddeee;
   margin-top:5px;
   margin-bottom:5px;
}
.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;
}
*/

/* --- ingave wandelingen --------------------------------- */

.slw-header {
   border:3px solid black;
   width:680px;
   padding:5px;
}

.slw-dbs {
   border:none;
   width:680px;
   padding:5px;
   clear:both;
}

.slw-dbs table {
   width:100%;
   border:1px solid #444;
}
.slw-dbs td, .slw-dbs th {
   padding:2px 5px;
   border:1px solid #444;
}
.slw-dbs .dbs-image {
   padding:0;
   margin:0;
}

/* --- legende -------------------------------------------- */
.legende {
   width:300px;
   height:76px;
   border:none;
   padding:3px 5px;
   float:right;
}

#contentsblok {
   width:680px;
   border:none;
   left:0;
   float:left;
   padding:0px 10px;
}
/* --- 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 .grotefoto {
   width:860px;
   margin:0 10px;
   border:none;
}
#schermvoorbeeldblok img {
   margin-top:10px;
}
#schermvoorbeeldblok span {
   font-size:10px;
}

/* --- infotabel ------------------------------------------ */
#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;
}
#infoblok table {
   width:180px;
   /*height:100%;*/
   border-collapse:collapse;
   border:none;
}
/*
#infoblok td {
   border:none;
   padding:0;
   font-size:8pt;
   font-family: Arial, sans-serif;
   color: #345E8E;
} */
.infotop {
   background: #fff url(http://www.staplijst.be/images/tabtop.jpg) top left;
   width:180px;
   height:22px;
   line-height:22px;
   text-align:center;
}
.infomidden {
   background: #fff url(http://www.staplijst.be/images/tabback.jpg) repeat-y top left;
   width:165px;
   text-align:left;
   padding:2px 10px 2px 5px;
   /*padding:2px 13px 2px 6px !important;*/
}
.infotussenstuk {
   background: #fff url(http://www.staplijst.be/images/tabmiddle.jpg) top left;
   width:180px;
   height:21px;
   line-height:21px;
   text-align:center;
}
.infobodem {
   background: #fff url(http://www.staplijst.be/images/tabdown.jpg) top left;
   height:10px;
   width:180px;
}
.infokader {
   width:158px;
   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-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:30px;
   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:hand;padding:0 !important;}
.maand .diaryhours  {color:#0080FF;width:42px;text-align:center;margin-top:0;background:#fff;}
.maand .diarytext   {color:#000080;width:42px;text-align:center;margin-top:0;background:#fff;border:1px solid #000080;}
.maand .datein      {color:#000000;width:42px;text-align:center;}
.maand .dateout     {color:#e0e0e0;width:42px;text-align:center;}
.maand .datetoday   {color:#0000ff;width:42px;text-align:center;font-weight:bold;border:1px solid #000080;background-color:#f2f2f2;}
.maand .datemarked  {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;}


/* --- 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;
    text-align:center;
    font-style:italic;
    font-weight:bold;
    border:1px solid #cccccc;
    position:relative;
    margin:10px 0 10px 10px;
}
.uitlegscherm_rechts {
    font-family:"arial narrow",arial,sans-serif;
    color:#000040;
    text-align:center;
    font-style:italic;
    font-weight:bold;
    border:1px solid #cccccc;
    position:relative;
    margin:10px 10px 10px 0;
}

/* --- 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;
}

.tips {

}
.tips h3 {
   clear:none;
}

.floatright {
   float:right !important;
}
.margintop {
   margin-top:10px;
}
.marginbottom {
   margin-bottom:10px !important;
}
.background-color-lichtblauw {
   background-color:#f8fcfd;
}

.stepdialogs {
   border:1px solid #ccc;
   margin:25px;
   padding:10px;
   background-color:white;
}
.steplogin {
}
.stepdialog-table {
   margin:15px auto;
   border:1px solid #ccc;
}
.stepdialog-table td {
   padding:5px 10px;
}
.stepdialog-explanation {
    font-size:9px;
    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:auto;
   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;
}
/* --- 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;
}

.rechts-bovenuit {
   position:absolute;
   right:5px;
   top:-38px;
}

.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: 15px;
   -webkit-border-radius: 15px;
}
.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:12px 25px;
}
.googlemap-link a {
   font-size:14px !important;
}
.wandellijst-table .googlemap-link a {
   font-size:10px !important;
}
.wandellijst-table .googlemap-link {
   padding:0;
}
/* *** wandelkalender ******************************************************* */
/* *** maand *** */
.ingaveformulier-table {
   width:680px;
   border:1px solid #000080;
}
.ingaveformulier-table td, .ingaveformulier-table th {
   font-size:13px;
   border:1px solid #000080;
   padding:8px;
}
.ingaveformulier-table-header {
   background-color:#0080ff;
   color:white;
}
/* *** Klasse voor toekomst en verleden************************************** */
/* *** maand *** */
.datum-verleden {
   color:#c0c0c0;
   background-color:white;
}
.datum-toekomst {
   color:blue;
   background-color:#ffff80;
}

/* *** 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;
}