body {
color: #000000;
text-align : justify; 
line-height: 1.2;
background: #ffd2a4 url(Afbeeldingen/Achtergrond.jpg) no-repeat fixed right;
font-size: 7.8pt;
font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
text-decoration: none;
margin: 57px 30px 10px 10px; /* top-right-bottom-left */
padding: 0px;
overflow: hidden;
}

table {
color: #000000;
text-align : justify; 
font-size: 7.8pt;
font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
text-decoration: none;
cellspacing:0;
cellpadding:0;
}

p {margin: 8px 0; }

.Titel {background: url(Afbeeldingen/#Titel.png) no-repeat left;width: 900px;height: 30px;text-align: right;color: #C29A72;}
.Titeltekst {margin-top:15px; }

.Home-icon a {
background: url(Afbeeldingen/Home.jpg) no-repeat left;width: 15px;height: 14px;float: left;padding: 0px;margin-top: -1px;}


.Aankondiging, .Aankondiging a {color: #9999ff;}
.Kostentabel {padding: 8px 0px 0px 0px;}
.Lestijden-dinsdag {position: absolute;left: 10px;top: 75px;}
.Lestijden-donderdag {position: absolute;left: 167px;top: 75px;}
.Lestijden-vrijdag {position: absolute;right: 30px;top: 75px;}


.Volledig {margin: 23px 30px 10px 10px; /* top-right-bottom-left */}

.Verder {background-image: url(Afbeeldingen/Verder.gif);background-repeat: no-repeat;background-position: right;}
.Terug {background-image: url(Afbeeldingen/Terug.gif);background-repeat: no-repeat;background-position: left;}

.Navigatiebalk {
background: url(Afbeeldingen/Navibalk.png) no-repeat;width: 900px;height: 30px;}

a, 
a:visited, 
a:active {color: #8C31BD;text-decoration: none;outline: none;}
a:hover {color: #8C31BD;text-decoration: underline;}

H1 {font-family : Arial, Helvetica, sans-serif; color: #000000; font-size : 11pt; text-decoration : none; padding-top: 10px;margin-bottom: 18px;}

ul {margin: 0px 0px 0px 0px;list-style:circle url(Afbeeldingen/Rondje.gif);padding: 5px 0px 5px 18px;}

.Buitenrand {background-color:#ffd2a4;background-image: none;margin: 5px;}
.Aanmeldformulier {margin-top: 0px;margin-left: 0px;}
.Aanmeldformulier-data {position: absolute;top: 90px;left: 420px;}

.Afbeeldingen-horizontaal {width: 900;height: 100;background-color:#ffd2a4;margin: 0px;padding: 0px;}
.Afbeeldingen-verticaal {width: 100px;height: 306px;}

.Jaarfeesten {height: 100px;width: 125px; float: left;margin: 0px;padding: 0px;}

.Afbeelding {
height: 100px;
margin: 0px;
padding: 0px;
float: left;
}
.IFrame {
width: 700px;
height: 306px;
margin-bottom:-2px; //dit is nodig omdat Firefox anders een rand onder het IFrame maakt, die de onderrand naar beneden drukt.
padding: 0px;
overflow: hidden;
}
.Home {background: url(Afbeeldingen/Achtergrond.jpg)no-repeat 0px 0px;
margin-top: 50px;
font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
font-size: 11px;
text-align: center;
color: #000000; /*#A35CCB;*/
padding: 0px;
}
.Home a {
color: #000000;
}
.Home a:visited {
text-decoration: none;
color: #000000; /*#A35CCB;*/
}
.Home a:hover {
text-decoration: underline;
color: #000000;
}
.Kader-links {display:block;width: 250px;height: 140px;border: 1px solid #d0c0e7;position: absolute;top: 120px;left: 70px;}
.Kader-rechts {display:block;width: 250px;height: 140px;border: 1px solid #d0c0e7;position: absolute;top: 120px;right: 90px;}
.JeroenGigengack {width: 250px;font-size: 18px;position: relative;top: 10px;left: 25px;}
.Naam-adres {position: absolute;right: 19px;top: 55px;text-align: right;color: #000000;}

.Logo {position:absolute;left: 17px;top: 57px;}

.KorteAgendaTitel {font-size: 18px;position: relative;left: 25px;top: 10px;float:left;}
.KorteAgenda {position: absolute;left: 25px;top: 40px;text-align: left;color: #000000;}
.KorteAgenda table {font-size:7.9pt;line-height:1.3;}  
.Aangesloten {font-size: 9px;position: absolute;top: 290px;left:110px;}

a.KNTV,
a.KNTV:visited,
a.BHET,
a.BHET:visited {color: #8C31BD;text-decoration: none;}

a.KNTV:hover,
a.BHET:hover{color: #000000;text-decoration:underline;}
  
.Menu {color: #000000; text-align : left; background: #D0C0E8 url(Afbeeldingen/Achtergrond.jpg) top left;
font-size: 10px;
font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
text-decoration: none;
margin: 10px 10px 10px 35px; /* top-right-bottom-left */
padding: 0px;
}

.Menu a,
.Menu a:visited {margin-left: -10px;color: #000000;text-decoration: none;}
.Menu a:hover,
.Menu a:active,
.Menu a:focus {margin-left: -10px;background: url(Afbeeldingen/Rondje.gif) no-repeat left; text-decoration: none;}

.Agenda-rechts {
position: absolute;
left: 120px;
}
.Textarea { /*Formulier reageren*/
width: 350;
border-style: solid;
border-width: 1px;
border-color: #D0C0E8;
Background-color:#E7DEF4;
text-align: left;
color: #000000;
font-size: 11px;
font-family: Verdana, Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
scrollbar-base-color:#E7DEF4;
}

.Voornaam {width: 100;}
.Tussenvoegsel {width: 50;}
.Achternaam {width: 192;}
.Mail {width: 275;width: 350;}
.Code{width: 70;}
.Aantal {width: 20px;}
.Annuleerknop {position: relative;top: 4px;}

img {border: 0px;padding: 0px;margin: 0px;
}
.Topnavigatie-links {padding: 0 0 5px 0px;width: 520px;font-size: 10px;text-align: left;float: left;}
.Topnavigatie-rechts {padding: 0 0px 5px 0;width: 380px;font-size: 10px;float: right; text-align:right;}
.Ondernavigatie {text-align: center;margin-top: 5px;font-size: 12px;}

.Navigatie a,
.Navigatie a:visited {text-decoration: none;color: #000000;}
.Navigatie a:active,
.Navigatie a:hover {text-decoration: underline;color: #000000;}

.Achtergrond-zangtherapie {background-image:url(Afbeeldingen/Achtergrond-zangtherapie.jpg);}
.Achtergrond-meditatief {background-image:url(Afbeeldingen/Achtergrond-meditatief.jpg);}
.Achtergrond-zangles {background-image:url(Afbeeldingen/Achtergrond-zangles.jpg);}
.Achtergrond-koorzang {background-image:url(Afbeeldingen/Achtergrond-koorzang.jpg);}
.Achtergrond-Kerst {background-image:url(Afbeeldingen/Achtergrond-KerstZangfeest.jpg);}
.Achtergrond-Pasen {background-image:url(Afbeeldingen/Achtergrond-PaasZangfeest.jpg);}
.Achtergrond-meezingfeesten {background-image:url(Afbeeldingen/Achtergrond-meezingfeesten.jpg);}
.Achtergrond-portret {background-image:url(Afbeeldingen/Achtergrond-portret.jpg);}
.Achtergrond-login {background-image:url(Afbeeldingen/Achtergrond-login.jpg);}

a.Popup,
a.Popup:visited,
a.Popup:hover {text-decoration: none;  z-index:24;}

a.Popup span, 
a.Popup:visited span,
a.Popup span {display: none}
a.Popup:hover span { /*the span will display just on :hover state*/
   display:block;
   position:absolute;
   top:45px; left:50px; width:250px;
   border:1px solid #d0c0e7;
   background-color: #E7DEF4;
   color:#000;
   padding: 15px 30px 20px 30px;
   text-align: justify;
}
.Schaduw {
   -moz-box-shadow: 6px 6px 12px #222; /* Firefox/Mozilla */
  -webkit-box-shadow: 6px 6px 12px #222; /*Safari/Chrome */
  box-shadow: 6px 6px 12px #222; /* Opera & hoe het zou moeten */
  /* Voor IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#9c92ac')";
  /* Voor IE 5.5 - 7 */
  filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#222');

}

/* ============================================================= */
/* Afbeeldingen rand */
/* ============================================================= */

.Folklorezanger a {width: 190px;height: 100px;background:url(Afbeeldingen/Folklorezanger.jpg) no-repeat left;float: left;cursor: default;}
.Lotus-mandala a {width: 150px;height: 100px;background: url(Afbeeldingen/Lotus-mandala.jpg) no-repeat left; float: left;cursor: default;}
.Koor a {width: 206px;height: 100px;background: url(Afbeeldingen/Koor.jpg) no-repeat left; float: left;cursor: default;}
.Labyrint {height: 100px;width: 100px;background:url(Afbeeldingen/Labyrint.jpg) no-repeat left;margin: 0px;padding: 0px;float: left;}

a.Labyrint,
a.Labyrint:visited,
a.Labyrint:hover {background:#D0C0E8 url(Afbeeldingen/Labyrint.jpg);width: 100px; height: 100px;position:relative;z-index:24; color:#000;cursor: default;}

a.Labyrint span, 
a.Labyrint:visited span,
a.Labyrint span {display: none}
a.Labyrint:hover span { /*the span will display just on :hover state*/
   display:block;
   position:absolute;
   top:-2em; left:-420px; width:35em;
   border:1px outset #d0c0e7;
   background-color: #E7DEF4; 
   color:#000;
   padding: 20px 20px 30px;
   text-align: justify;
}

.Roodborstje a {height: 140px;width: 100px;margin: 0px;background: url(Afbeeldingen/Roodborstje.jpg) no-repeat top left;padding: 0px;float: left;}
.Zangeres a {width: 150px;height: 100px;background:url(Afbeeldingen/Zangeres.jpg) no-repeat left;float: left;cursor: default;}
.Lotus a {width: 120px;height: 100px;background:url(Afbeeldingen/Lotus.jpg) no-repeat left;float: left;cursor: default;}
.Projectkoor a {width: 180px;height: 100px;background:url(Afbeeldingen/Koor2.jpg) no-repeat left;float: left;cursor: default;}
.Speaker a {width: 100px;height: 100px;background:url(Afbeeldingen/Speaker.jpg) no-repeat left;float: left;cursor: default;}
.Bladmuziek {height: 66px;width: 100px;background:url(Afbeeldingen/Bladmuziek.jpg) no-repeat left;float: left;margin: 0px;padding: 0px;}
.Zanger a {width: 100px;height: 140px;background: url(Afbeeldingen/Zanger.jpg) no-repeat left; float: left;cursor: default;}
/*Kleurenvlakken=============================================================*/

.Zangles a.off {background: #00CECE url(Afbeeldingen/Zangles-uit.gif) no-repeat left; width: 100px;height: 100px;float: left;padding: 0px;}
.Zangles a.on,
.Zangles a:hover,
.Zangles a:active {background-image:url(Afbeeldingen/Zangles-aan.gif);}

.Zangtherapie a.off {background:#6300FF url(Afbeeldingen/Zangtherapie-uit.gif) no-repeat left; width: 154px;height: 100px;float: left;}
.Zangtherapie a.on,
.Zangtherapie a:hover,
.Zangtherapie a:active {background: url(Afbeeldingen/Zangtherapie-aan.gif);}

.TeamSinging a.off {background:#9CCE00 url(Afbeeldingen/TeamSinging-uit.gif) no-repeat left;width: 100px;height: 100px;float: left;}
.TeamSinging a,
.TeamSinging a.on,
.TeamSinging a:hover,
.TeamSinging a:active {background-image:url(Afbeeldingen/TeamSinging-aan.gif);}

.Agenda a.off {background:#97C2ED url(Afbeeldingen/Agenda-uit.gif)no-repeat left;width: 100px;height: 66px;float: left;}
.Agenda a.on, 
.Agenda a:hover,
.Agenda a:active {background-image:url(Afbeeldingen/Agenda-aan.gif);}

.Meditatief-zingen a.off {background: #8F32F2 url(Afbeeldingen/Meditatief-zingen-uit.gif) left no-repeat;width: 125px;height: 100px;float: left;}
.Meditatief-zingen a.on,
.Meditatief-zingen a:hover,
.Meditatief-zingen a:active {background-image:url(Afbeeldingen/Meditatief-zingen-aan.gif);}

.Koorzang a.off {background: #1D7EC2 url(Afbeeldingen/Koorzang-uit.gif) left no-repeat;width: 100px;height: 100px;float: left;}
.Koorzang a.on,
.Koorzang a:hover,
.Koorzang a:active {background-image:url(Afbeeldingen/Koorzang-aan.gif);}

.Meezingfeesten a.off {width: 125px;height: 100px;background:url(Afbeeldingen/Meezingfeesten-uit.gif) no-repeat left;float: left;cursor: default;}
.Meezingfeesten a.on,
.Meezingfeesten a:active,
.Meezingfeesten a:hover {background:url(Afbeeldingen/Meezingfeesten-aan.gif);}


.Workshops a.off {background:#8C37BE url(Afbeeldingen/Workshops-uit.gif) left no-repeat; width: 100px;height: 100px;float: left;}
.Workshops a.on,
.Workshops a:hover,
.Workshops a:active {background-image:url(Afbeeldingen/Workshops-aan.gif);}

/* =============================================================== */