/* Klachten, klachten (kort), technieken, technieken (kort) */
/* 'VENSTERS' PLAATSEN */
body#klachten div#header
{
  position: absolute
}

.top-klachten-kort
{
  height: 10em;
}

body#technieken-kort div#header
{
  height: 11em;
}

.top-tech-kort
{
  height: 11em;
}

/* Omdat gecko scrollwiel en cursortoetsen uitschakelt bij position: fixed, moeten de pagina's Technieken en Klachten (de lange pagina's)
anders worden weergegeven */
body#technieken div#header
{
  position: absolute;
}


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

/* KNOPPEN */
body#klachten-kort div#knoppen
{
  position: relative;
  width: 650px;
  margin: auto;
}

body#technieken-kort div#knoppen
{
  position: relative;
  width: 750px;
  margin: auto;
}

span#klachten-wrapper, span#technieken-wrapper
{
  float: right;
}

body#klachten-kort div#knoppen-rechts
{
  width: 300px;
  float: left;
}

body#technieken-kort div#knoppen-rechts
{
  width: 400px;
  float: left;
}

#knoppen-midden
{
  width: 150px;
  float: left;
}

#knop-alle-klachten, #knop-alle-technieken
{
  margin-top: 0;
}


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

/* KOPPEN */
#tekst-technieken h3
{
  margin-top: 0.5em;
  font-size: 100%;
}

.ana-tech
{
  color: #090;
}

body#technieken-kort h1.teksten-kop
{
  margin-bottom: 0;
}

body#technieken-kort #subkop
{
  margin-top: 0;
  padding-left: 3%;
  font-size: 130%;
  font-weight: 600;
  color: #00B;
}

body#technieken-kort h2
{
  display: inline;
  font-size: 115%;
  font-weight: 600;
  margin-right: 0.4em;
}

body#technieken h1.teksten-kop
{
  margin: 0;
}


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

/* MARGES, PADDING, TEXT-INDENT, CLEAR, e.d. */
body#technieken-kort #tekst-technieken p.eerste
{
  display: inline;
}

#klachten #tekst div, #klachten-kort #tekst div
{
  position: relative;
}

#klachten #tekst h2, #klachten-kort #tekst h2
{
  display: inline;
  font-size: 100%;
}

#klachten #tekst h3, #klachten-kort #tekst h3
{
  display: inline;
  font-size: 100%;
  font-weight: normal;
}

#klachten #tekst div div, #klachten-kort #tekst div div
{
  display: inline;
  position: absolute;
  left: 33%;
  width: 33%;
}

#klachten #tekst div div div, #klachten-kort #tekst div div div
{
  position: relative;
  left: 100%;
  top: -1.2em;
  width: 100%;
  float: right;
}

#klachten #tekst .ins, #klachten-kort #tekst .ins
{
  padding-left: 4%;
}

#klachten #tekst .line-2, #klachten-kort #tekst .line-2
{
  height: 2.4em;
}

#klachten #tekst .line-3, #klachten-kort #tekst .line-3
{
  height: 3.6em;
}

/* Omdat gecko scrollwiel en cursortoetsen uitschakelt bij position: fixed, moeten de pagina's Technieken en Klachten (de lange pagina's)
anders worden weergegeven */
body#technieken #tekst-technieken
{
  margin-left: 2%;
  width: 70%;
}

#tekst-technieken h2
{
  margin-bottom: 0;
}

#header-tech-kort
{
  font-size: 85%;
  font-weight: 600;
  text-align: center;
}


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

/* ADRES */
body#klachten div#adres-footer
{
  margin-bottom: 10em;
}


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

/* AFBEELDINGEN */
div#knoppen img#pendule
{
  position: relative;
  left: 57px;
  float: left;
  width: 35px;
  height: 35px;
}


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

/* KLACHTEN - ALFABET */

#alfabet
{
  position: fixed;
  bottom: 0;
  width: 100%;
  padding-left: 1%;
  background: #2000C5;
}

#alfabet a
{
  text-align: center;
  float: left;
  width: 3.3%;
  color: #FF9;
  font-weight: 600;
}

#alfabet a.breed-7
{
  width: 7%;
}

#alfabet a.breed-3-5
{
  width: 3.5%;
}


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

/* HULPSCHERM */
body#technieken-kort div#vraagteken, body#klachten-kort div#vraagteken
{
  top: 11em;
}

/* KLACHTEN-KORT HULPTEKST KNOP 'ALLE KLACHTEN' en TECHNIEKEN KORT HULPTEKST KNOP 'ALLE TECHNIEKEN' */
span#klachten-wrapper span#klachten-tekst, span#technieken-wrapper span#technieken-tekst
{
  display: none;
}

div#knoppen span#klachten-wrapper a:hover span#klachten-tekst, div#knoppen span#klachten-wrapper a:focus span#klachten-tekst,
  span#technieken-wrapper a:hover span#technieken-tekst, span#technieken-wrapper a:focus span#technieken-tekst 
{
  display: block;
  position: absolute;
  right: 120px;
  width: 300px;
}

#klachten-tekst, #technieken-tekst
{
  color: #000;
}

#klachten-tekst span, #technieken-tekst span
{
  position: absolute;
  left: 170px;
  background: #FFF;
  font-size: 14px;
  width: 300px;
  line-height: 1.3em;
  border-left: black solid 1px;
  border-right: black solid 1px;
}

#technieken-tekst span
{
  left: 120px;
}

#klachten-tekst span.kl-regel-1, #technieken-tekst span.kl-regel-1
{
  top: -4em;
  border: black solid 1px;
}

#klachten-tekst span.kl-regel-2, #technieken-tekst span.kl-regel-2
{
  top: -2.8em;
}

#klachten-tekst span.kl-regel-3, #technieken-tekst span.kl-regel-3
{
  top: -1.6em;
}

#klachten-tekst span.kl-regel-4, #technieken-tekst span.kl-regel-4
{
  top: -0.4em;
}

#klachten-tekst span.kl-regel-5, #technieken-tekst span.kl-regel-5
{
  top: 0.8em;
  border-bottom: black solid 1px;
}

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

/* TECHNIEKEN INHOUD */
#technieken-kader
{
  position: fixed;
  top: 34%;
  right: 1%;
  width: 26%;
  height: 13.5em;
}

div#technieken-header
{
  height: 5.5em;
  overflow: auto;
  border: black solid 1px;
}

#technieken-header-binnen
{
  font-size: 75%;
  margin-top: 0;
  padding-left: 1px;
}

#technieken-header-binnen span
{
  display: block;
  text-align: center;
}

#technieken-eerste
{
}

span#technieken-links
{
  display: block;
}

a#technieken-link-home
{
  float: left;
  padding-left: 30px;
}

a#technieken-link-top
{
  float: right;
  padding-right: 30px;
  color: #009;
}

div#technieken-inhoud-kader
{
  overflow: auto;
  height: 7.2em;
  padding-left: 1px;
  border: solid black 1px;
  border-top: 0;
}

#technieken-inhoud
{
  margin-top: 5px;
}

p#technieken-inhoud a {
  display: block;
  margin: 0;
  padding-left: 1px;
}

p#technieken-inhoud span.ana-tech a:link
{
  background: #009;
  color: #FFF;
  font-weight: 500;
}

p#technieken-inhoud span.ana-tech a:visited
{
  background: #090;
  color: #FFF;
  font-weight: 500;
}

p#technieken-inhoud span.ana-tech a:hover
{
  background: #F00;
  color: #FFF;
  font-weight: 500;
}

p#technieken-inhoud span.ana-tech a:active
{
  background: #000;
  color: #FFF;
  font-weight: 500;
}