body                { border: 0px none ; margin: 0px; padding: 0px 2px 0px 2px; text-align:center; background-color: #FFFFFF; color: #000000; }

.kopContainer       { margin: 0 auto; display: inline-block; }

.logoOorboekje      { margin-right: 10px; border: 0; }


/********************
    menu (dropdown)
 ********************/
.menuContainer      { display: inline-block; vertical-align: bottom;} 


 /* Container <div> voor het dropdown-menu */
.dropdownGroep 
{
    position: relative;
    display: table-row;
    margin: 0px 6px;
}

/* input in dropdown verbergen */
.dropdownGroep INPUT {display:none;}


/* wrapper om kop en dropdowns heen */
.dropdownKopEnContainer { display: table-cell; }


/* sub-items van dropdown-menu (standaard verborgen) */
.dropdownItemsContainer
{
    display: none;
    position: absolute;
    background-color: #f9f9f9;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
    z-index: 1;
}

.dropdownItemsContainerTijdstippen
{
	width: 190px;
}

/* Links in sub-items van dropdown-menu */
.dropdownItemsContainer a 
{
    color: black;
    text-decoration: none;
    display: inline-block;
}

/* dropdown-items tonen */
.dropdownGroep INPUT:checked~.dropdownItemsContainer {
  display: block;
}

/* geselecteerde item onderstrepen */
.dropdownItemsContainer a:hover 
{
	text-decoration: underline; 
}

/* items */
.dropdownItem
{
	border: solid 1px #FFAA55; border-radius: 5px; background-color: #FFDDBB;
	margin: 0px; padding: 0px 10px; 
	line-height:22px; height: 22px; display:block;
	font-family: sans-serif; font-size: 0.9em; font-weight: bold;
	vertical-align: middle; text-align: center;
	color: #003355; text-decoration: none;
}
.dropdownItemDatum
{
	width: 180px; text-align: right;
}
.dropdownItemTijd
{
	width: 70px;
}
.dropdownItemHeleDag
{
	width: 166px;
}
.dropdownItemOntvangst
{
	width: 270px;
	text-align:left;
	background-repeat: no-repeat; background-position-y: center; background-position-x: 8px; 
	padding-left: 30px;
}
.dropdownItemGeselecteerd
{
	background-color: #FFCC99;
}

.ontvangstImg
{
	vertical-align: middle;
	width: 16px;
	height: 16px;
	margin-right: 5px;
}

.dropdownItemVorigeVolgende { font-family: sans-serif; font-weight: bold; color: #000; text-decoration: none; padding:0px; vertical-align: middle;
                              display: table-cell; width: 24px; text-align:center;}


/* kop / knop van dropdown-menu */
.dropdownKop 
{
    cursor: pointer; text-align:center;
	margin: 1px;
}
/* achtergrondkleur van kop dropdown veranderen */
.dropdownGroep:hover .dropdownKop 
{
    background-color: #FFAA55; 
}






.filterSectie       { border: none; margin: 20px 0px 0px 0px; padding: 0px 0px 3px 0px; 
                      font-family: sans-serif; font-size: 0.7em; font-weight: normal; 
                      color: #000000;
                      vertical-align: top; text-align: left; text-decoration: none; 
					  display: inline-block; float: right;
					  z-index: 1; }
.filterSectie a     { color: #000000; text-decoration: none; }





/* voorpagina */
.vpMenuKop			{ border: solid 1px #55FFAA; margin: 0 auto; padding: 3px 4px 3px 4px; 
                      background-color: #BBFFDD; 
                      font-family: sans-serif; font-size: 0.9em; font-weight: bold; 
                      vertical-align: middle; text-align: center; }
.vpMenuKop H2		{ border: 0px; margin: 0px; padding: 0px;
					  font-family: sans-serif; font-size: 1.0em; font-weight: bold; 
					  color: #000000;
                      vertical-align: middle; text-align: center }
DIV.vpColofonKop    { border: solid 1px #FFAA55; margin: 0px; padding: 1px 2px 1px 2px; 
                      background-color: #FFBBDD; 
                      font-family: sans-serif; font-size: 0.9em; font-weight: bold; 
                      vertical-align: middle; text-align: center; }
DIV.vpMenuInhoud    { border: solid 1px #55FFAA; margin: 0px auto 10px auto; padding: 6px 4px 6px 4px; 
                      background-color: #FFFFFF; 
                      font-family: sans-serif; font-size: 0.9em; font-weight: normal; 
                      vertical-align: top; text-align: left }
DIV.vpColofonInhoud { border: solid 1px #FFAA55; margin: 0px; padding: 4px 2px 4px 2px; 
                      background-color: #FFFFFF; 
                      font-family: sans-serif; font-size: 0.9em; font-weight: normal; 
                      vertical-align: top; text-align: justify }
P.vpDatum           { border: 0px; margin: 0px; padding: 0px 0px 2px 0px; 
                      background-color: #FFFFFF; color: #AAAAAA; font-weight: normal; 
                      vertical-align: middle; text-align: left }
P.vpSubkop          { border: 0px; margin: 0px; padding: 0px 0px 0px 0px; 
                      background-color: #FFFFFF; font-size: 1.3em; font-weight: bold; 
                      vertical-align: middle; text-align: left }
.vpMenuInhoud H2,
.vpColofonInhoud H2 { border: 0px; margin: 0px; padding: 15px 0px 0px 0px;
					  font-family: sans-serif; 
                      background-color: #FFFFFF; font-size: 1.1em; font-weight: bold; font-style: italic;
                      vertical-align: middle; text-align: left }

TH.vpTabelKop       { border: solid 1px #AAFF55; margin: 0px; padding: 1px 2px 1px 2px; 
                      background-color: #DDFFBB; 
                      font-family: sans-serif; font-weight: bold; 
                      vertical-align: middle; text-align: center; }
TD.vpTabelInhoudL,
TD.vpTabelInhoudM,
TD.vpTabelInhoudR   { border: solid 1px #AAFF55; margin: 0px; padding: 2px 2px 2px 2px; 
                      background-color: #FFFFFF; 
                      text-align: left; font-family: sans-serif; font-weight: normal; 
                      vertical-align: top }
TD.vpTabelInhoudL   { border-right-color: #DDFFCC }
TD.vpTabelInhoudM   { border-left-color: #DDFFCC; border-right-color: #DDFFCC }
TD.vpTabelInhoudR   { border-left-color: #DDFFCC }

/* Kop bovenaan verschillende pagina's */
H1                  { font-family: sans-serif; font-weight: bold; font-size: 1.2em; color: #000000; text-align:center; }
H2                  { font-family: sans-serif; font-weight: bold; font-size: 1.0em; color: #555555; text-align:left; }
.vpMenuKop h1       { margin:0px; padding:0px; }
.vpMenuInhoud h2    { margin:0px; padding:0px; }
H1.verborgenKop     { display:none; }




/* program */
.pgMenuKop          { border: solid 1px #55AAFF; margin: 0px; padding: 0px; 
                      background-color: #BBDDFF; 
                      font-family: sans-serif; font-size: 0.9em; font-weight: bold; 
                      vertical-align: middle; text-align: center; }
.pgMenuKop H2	{ border: 0px; margin: 0px; padding: 0px;
				  font-family: sans-serif; font-size: 1.0em; font-weight: bold; 
				  color: #000000;
                  vertical-align: middle; text-align: center }
.pgMenuKopSub       { border: solid 1px #55AAFF; margin: 0px; padding: 1px 2px 1px 2px; 
                      background-color: #DDEEFF; 
                      font-family: sans-serif; font-size: 0.9em; font-weight: normal; 
                      vertical-align: middle; text-align: center; }
.pgMenuKopSubSelectieTijdstip { min-width: 210px; }
H2.pgMenuKopSubZenderCategorie {font-weight: normal; font-size:0.9em; vertical-align: top; font-style: italic; margin:0px; padding:0px; }
.pgMenuInhoud       { border: solid 1px #55AAFF; margin: 0px; padding: 0px; 
                      font-family: sans-serif; font-size: 0.9em; font-weight: normal; 
                      vertical-align: top; text-align: left }
.pgProgramma        { max-width: 100vw; }
.pgProgTijdEnTitel  { font-weight: bold; text-indent: -16px; padding-left: 16px; }
.pgProgTijdEnTitelHeleDag { text-indent: 0px; }
.pgProgOmschrijving { padding-left: 16px; max-width: 100vw}
.pgProgOmschrijving SPAN { display: block; padding-left:16px; text-indent:0px; font-style:italic; margin-top: 0px; padding-top: 0px }
.pgProgPresentatie  { padding-left: 16px; }
.pgProgramma:target { background-color: #FFFFAA; }
.pgProgrammaHuidigeProgramma { background-color: #FFFFCC !important; }
H6.pgProgTijdEnTitel { margin:0; font-size:1em }
.pgProgrammaNonstop  { background-color: #F6F6F6; color: #666666;}



/* programNu */
.pnZender            { border: 0px; margin: 0px; padding: 0px; font-weight: bold; color: #555555; vertical-align: middle; }
.pnZendernaamLogoEnNaam { width:122px; padding-left: 24px; background-repeat: no-repeat; background-size: 20px; background-position-y: center; min-height: 20px; display: inline-block; vertical-align: top; }
.pnZenderNaamToevoeging {font-size: 0.75em; font-weight: normal; display: inline-block; text-indent: 0px;}
IMG.pnZenderLogo     { width: 20px; height: 20px; }
.pnKanaalNr          { border: 0px; margin: 0px; padding: 0px; 
                       font-family: sans-serif; font-size: 1.0em; font-weight: normal; 
                       color: #222222;
                       vertical-align: middle; text-align: left;
                       width:100%; text-indent: 24px;
                     }
.pnKanaalNrZiggo     { color: #F48E04; }
.pnKanaalNrKpn       { color: #009900; }
.pnKanaalNrDigitenne { color: #00AAD5; }
.pnKanaalNrCanalDigitaal { color: #140087; }
.pnKanaalNrTMobile   { color: #E20074; }
.pnKanaalNrDelta     { color: #008ECF; }
.pnKanaalNrCaiway    { color: #00529C; }
.pnZenderVoorpagina  { width:140px; text-indent: -24px; padding-left: 24px; }
.pnZenderStream      { display:inline; line-height:32px; vertical-align:top; }
H1.pnZendernaamLogoEnNaam { width: auto; padding-left: 36px;background-size: 32px; display: inline-block; line-height: 32px; }

.selectTijdstip      { background: transparent; border: none; font-size: inherit; }

/* stream */
.stLinkerKolom,
.stRechterKolom      { width: 100%; min-width: 316px; max-width: 500px; display:inline-block; vertical-align:top; margin:0px; padding:0px; 
                       text-align:left; font-family: sans-serif; }
@media (min-width:710px) 
{
	.stLinkerKolom, 
	.stRechterKolom  { margin-left:  50px; margin-right: 50px; }
}
@media (min-width:1020px) 
{
	.stRechterKolom  { width:450px;}
}



/* ondertussen */
.otRegelLinkStream       { text-decoration: none; width:100%; color:#000000; display: table; border:none; }
.otRegelLinkStream:hover { background-color: #BBDDFF; }
.otRegelLinkStream:hover .pgProgrammaNonstop { background-color: #BBDDFF; }
.otRegelLinkStreamEerste { border-top: 1px solid #BBDDFF; }
.otRegelLinkStreamHuidig { background-color: #FFFFCC; }
.otRegelLinkStreamHuidig .pgProgrammaNonstop { background-color: #FFFFCC; }
.otZendernaam            { display:table-cell; height: 20px; width: 140px; vertical-align:top; font-weight: bold; padding-top: 4px; padding-bottom: 4px;}
.otProgramma             { display:table-cell; overflow: hidden; vertical-align:top; padding: 4px 0px; }



/* ------------------------- */
DIV.tussenregel { border: 0px; margin: 0px; padding: 0px; height:  2px; background-color: #FFFFFF; }
DIV.tussenblok  { border: 0px; margin: 0px; padding: 0px; height: 20px; background-color: #FFFFFF; }


UL {margin: 0px;              padding: 0px; text-indent: 0px}
OL {margin: 0px;              padding: 0px; text-indent: 0px}
LI {margin: 2px 0px 2px 20px; padding: 0px; text-indent: 0px}

SUP {font-size: 0.7em}

.tekstNormaal { font-family: "MS Sans Serif", sans-serif; font-size:   small; vertical-align: top; text-align:left}
.tekstKlein   { font-family: "MS Sans Serif", sans-serif; font-size: x-small; vertical-align: top; text-align: left }

/* Zenderinfo / Streams */
.programmeringZender { margin: 0px auto 15px auto; }
.infoLinkerKolom, 
.infoRechterKolom  { width: 355px; display:inline-block; vertical-align:top; margin:0px; padding:0px; 
                     text-align:left; font-family: sans-serif; }

@media (min-width:710px) 
{
	.infoLinkerKolom, 
	.infoRechterKolom { margin-left:  50px; margin-right: 50px; }
}

.ontvangstTitel {width: 80px; vertical-align:top; padding-left:20px; background-repeat: no-repeat;}
.ontvangstTitel P {vertical-align:middle}
.ontvangstBeschrijving {vertical-align:top; padding-left:14px; background-repeat: no-repeat; background-position-y: center; }
.ontvangstBeschrijving P {vertical-align:middle; }

.ontvangstTitelFM           {background-image: url("/img/fm.png");}
.ontvangstTitelZiggo        {background-image: url("/img/ziggo.png");}
.ontvangstTitelKPN          {background-image: url("/img/kpn.png");}
.ontvangstTitelOdido        {background-image: url("/img/odido.png");}
.ontvangstTitelDelta        {background-image: url("/img/delta.png");}
.ontvangstTitelCaiway       {background-image: url("/img/caiway.png");}
.ontvangstTitelInternet     {background-image: url("/img/internet.png");}
.ontvangstTitelDab          {background-image: url("/img/dab.png");}
.ontvangstTitelCanalDigitaal{background-image: url("/img/canaldigitaal.png");}
.ontvangstKlassiek          {background-image: url("/img/klassiek.png");}
.ontvangstSpraak            {background-image: url("/img/spraak.png");}

.ontvangstBeschrijvingPositief {background-image: url("/img/vink.png");}
.ontvangstBeschrijvingNegatief {background-image: url("/img/kruis.png");}

/*
.frequentiekaart .frequentiekaartInhoud { display: none; }
.frequentiekaart:target .frequentiekaartInhoud { display: inline-block; }
.frequentiekaart:target IMG.frequentiekaartInhoud  { display: block; }
.frequentiekaart:target .frequentiekaartKnopToonMeer { display: none; }*/
#frequentiekaartToonKaartFM { display: none; }
#frequentiekaartToonKaartFM         + label > .frequentiekaartInhoud { display:none; } 
#frequentiekaartToonKaartFM:checked + label > .frequentiekaartInhoud { display:inline-block; } 
#frequentiekaartToonKaartFM:checked + label > IMG.frequentiekaartInhoud  { display: block; }
#frequentiekaartToonKaartFM:checked + label > .frequentiekaartKnopToonMeer { display: none; }

#frequentiekaartToonKaartDAB { display: none; }
#frequentiekaartToonKaartDAB         + label > .frequentiekaartInhoud { display:none; } 
#frequentiekaartToonKaartDAB:checked + label > .frequentiekaartInhoud { display:inline-block; } 
#frequentiekaartToonKaartDAB:checked + label > IMG.frequentiekaartInhoud  { display: block; }
#frequentiekaartToonKaartDAB:checked + label > .frequentiekaartKnopToonMeer { display: none; }

SPAN.frequentiekaartKnopToonMeer { text-decoration: underline dashed; cursor: pointer; }
SPAN.frequentiekaartInhoud        { text-decoration: underline dashed; cursor: pointer;}



/*Eindejaarslijsten*/
.rij1 {font-family: "MS Sans Serif", sans-serif; font-size: x-small; vertical-align: top; 
       background-color: #22FFAA}
.rij2 {font-family: "MS Sans Serif", sans-serif; font-size: x-small; vertical-align: top; 
       background-color: #88FFCC}
.lijstnaam  { color: green; font-weight: bold }
.zendernaam { color: green;  }

IMG.rechts { text-align: right; border: 0px; margin: 0px 0px 0px 6px }

HR { color: #AAAAFF; background-color: #DDDDFF; }

P { margin: 0px 0px 0px 0px; }

LABEL { display: inline-block; }




							   
/* Voettekst */
DIV.voettekst-kader		{ width:100%; background-color:#000033; color: #DDDDFF; margin-top:10px; padding-top: 10px; font-family: sans-serif; font-size:0.7em; text-align:center;}
DIV.voettekst-kolom		{ width:200px; display:inline-block; vertical-align: top; text-align:left; }
.voettekst-kolom A      	{ color: #DDDDFF; }
.voettekst-kolom UL     	{ margin: 0px;              padding: 0px; text-indent: 0px; list-style-type: none;}
.voettekst-kolom LI     	{ margin: 2px 0px 2px 10px; padding: 0px; text-indent: 0px}
.voettekst-link-kop     	{ font-weight: bold; text-decoration: none;}
.voettekstCopyright     { margin-top:5px; }
H5.voettekst-link-kop     { margin:0; font-size:1em; }


/* link onder zendernaam: luisteren */
IMG.linkLuisteren         { width: 32px; height: 32px; padding:2px; opacity: 0.5}
IMG.linkLuisteren:hover   { opacity: 1.0}



/* kalender + bijzonderheden */
.containerKalenderEnBijzonderheden { width:calc(100vw - 5px); max-width:776px; display:inline-block; font-family: sans-serif; margin: 10px 0px 10px 0px;}

/* kalender: */
.containerKalender    { display:inline-block; margin: 0px 10px 0px 0px; 
                        border: 1px solid #000066; 
                        text-align:center; }
.containerJaar        { background:#55AAFF; color: #000000; font-size: 0.9em; font-weight:bold; padding: 4px }   
.containerDagEnMaand  { background:#DDEEFF; color: #000000; border-top: 1px dashed #000000; display:table-cell; width: 90px; }
.kalenderDagVanWeek   { margin:0px; font-size:1.0em; line-height: 30px; vertical-align:middle; }
.kalenderDagVanMaand  { margin:0px; font-size:1.8em; line-height: 30px; vertical-align:middle; font-weight:bold }
.kalenderNaamMaand    { margin:0px; font-size:1.0em; line-height: 30px; vertical-align:middle; }


/* bijzonderheden: */
.containerBijzonderheden      { display:inline-block; vertical-align:top; min-width: 100px; max-width: 656px; font-size:0.9em; text-align:left;}
.bijzonderhedenKop            { font-size:1.2em; font-weight:bold; color:#666666; text-align: left; }
.bijzonderhedenTitel          { font-weight: bold; font-style: italic; }
.bijzonderhedenItem           { background-repeat: no-repeat; background-position-x: right; background-size: 24px; padding-right: 24px; }

@media (min-width:350px) 
{
	.containerBijzonderheden {width: calc(100% - 120px); }
}


/* navigatie */
.navVorigeVolgende {font-weight: bold; color: #55AAFF; text-decoration: none; padding:20px;}

.datumSelectiePicker { visibility:hidden; width:0px;margin:0px; }
.selectDatumDropdown {visibility:hidden;}




/*************
  kenmerken (herhaling / non-stop)
  ************/
.kenmerken { width: 10px; height: 10px; border: 0; }
  
/* legenda onderaan programmering */
.legenda    { font-family: sans-serif; font-size: 0.8em; font-weight: normal; text-align: center; }