/* 
 * Auteur: GBWebdesign 
 * Datum: 09-06-2009
 * Versie: 1.0
 * Beschrijving: CSS voor de website epgvoorthuizen.nl  
 */

/* ALGEMEEN */

*{margin:0; padding:0; outline:0;}

p, a, div, i, td, li{
  font-family: Arial;
  font-size: 12px;
}

h1,h2,h3,h4,h5,h6{
  font-family: Trebuchet MS, Arial;
  font-weight: bold;
  color: #CC0033;
}

p,h1,h2,h3,h4,h5,h6{
  margin: 0px 0px 15px 0px;
}

td{
  vertical-align: top;
}

h1{
  font-size: 18px;
}

p{
  line-height: 16px;
}
/* VORMGEVING */

div.holder{
  width: 1000px;
  margin: 40px auto 0 auto;
}

div.outside{
  padding: 35px;
  position: relative;
  top: 40px;
}
.out_grijs{
  background-color: #93856d;
}
.out_rood{
  background-color: #CC0033;
}
.out_roze{
  background-color: #f2830b;
}

div.inside{
  background-color: #ffffff;
  padding: 20px 0px 20px 20px;
}

table.vorm{
  margin: 28px 0px 13px 13px; 
}

td.tekst{
  padding: 0px 25px;
}

td.tekst li{
margin: 0px 0px 0px 15px;
}

div.breedte_text{
  width: 460px;
}

.elkezondag{
  position: absolute;
  left: 773px;
  top: 54px;
}

/* SLIDESHOW */
#slider{position: absolute; top: 55px; left: 605px;}
#slider ul, #slider li{list-style:none;}
#slider li{ width: 167px;height: 126px;overflow:hidden; }
#slider li img{ width: 165px; height: 124px; border: solid 1px #aaa;}

/* AGENDA */

div.agenda_in{
  background-color: #f2830b;
  border: solid 2px #CC0033;
  padding: 10px;
}

td.agenda{
  width: 194px;
}

div.agendapunt{
  margin: 10px 0px 0px 0px;
  font-weight: bold;
}

div.agendapunt b{
  color: #fff;
}

div.agenda_in a{
  color: #fff;
  text-decoration: none;
}

div.agenda_in a:hover{
  text-decoration: underline;
}

div.agenda_onpage{
  margin: 10px 0px 0px 0px;
}

div.agenda_onpage a{
  color: #CC0033;
}

/* FOTO RECHTS BOVEN */

.foto_boven{position: absolute; top: 55px; left: 605px;height: 124px; width: 165px;border: solid 1px #aaa;}

/* RECHTS */

img.fotos_menu_rechts{
  width: 165px;
  border: solid 1px #aaa;
}

td.rechtsknoppen{
  width: 168px;
}

td.rechtsknoppen img{
  margin: 3px 0px;
}

div.knop_rechts{
  background-image: url('../image/bottum_right.png');
  width: 168px;
  height: 30px;
  background-repeat: no-repeat;
}

div.knop_rechts a{
  font-family: Trebuchet MS, Arial;
  font-size: 14px;
  color: #fff;
  position: relative;
  left: 45px;
  top:6px;
  text-decoration: none;
}

/* MENU */

ul.menu{
  list-style-type: none;
  margin: 0 auto;
  padding: 0 30px;
}

ul.menu li{
  width: 100px;
  height: 40px;
  float: left;
  margin-right: 4px;
  text-align: center;
  vertical-align: middle;
}

ul.menu a{
  position: relative;
  top: 7px;
  font-family: Trebuchet MS, Arial;
  font-size: 16px;
  color: #fff;
  text-decoration: none;
}

.rood{background-image: url('../image/buttom_rood_off.png');}
.roze{background-image: url('../image/buttom_roze_off.png');}
.grijs{background-image: url('../image/buttom_grijs_off.png');}
.rood_on{background-image: url('../image/buttom_rood.png');}
.roze_on{background-image: url('../image/buttom_roze.png');}
.grijs_on{background-image: url('../image/buttom_grijs.png');}

div.bottom{
  width: 930px;
  height: 30px;
}
.rood_onder{background-image: url('../image/bottom_roze.png');}
.grijs_onder{background-image: url('../image/bottom_rood.png');}
.roze_onder{background-image: url('../image/bottom_grijs.png');}

/* CONTACT */

.contact input, textarea{
  border: 1px solid #CC0033;
  padding: 5px;
  margin: 3px 0px 10px 0px;
  background-color: #fff;
}

.contact textarea{
  width: 450px;
  height: 60px;
}

.contact input.verzenden{
  background-color: #CC0033;
  color: white;
  font-weight: bold;
  cursor: pointer;
  float: right;
}

/* COPYRIGHTS */

.copy{text-align: center; position: relative; top: 45px; color: #aaaaaa;}
.copy a{
   color: #aaaaaa;
}

td.rechtsknoppen p{
  line-height: 25px;
}

/* CALENDAR */

.calendar td{
	border: 1px solid #000;
	vertical-align: top;
	padding: 5px;
	width: 110px;
}
tr.dagen td{
	border: 0px;
	vertical-align: top;
	padding: 5px;
	padding-bottom: 10px;
	text-align: center;
	color: #CC0033;
	font-weight: bold;
}
.calendar div.event{
	border: 1px solid #CC0033;
	color: #CC0033;
	margin-bottom: 5px;
	padding: 5px;
	font-size: 10px;
}

.calendar div.event *{
	font-size: 10px;
}

.calendar div.event a{
	color: #CC0033;
	font-weight: bold;
}

.calendar img{
	border: 0px;	
}

td.today{
	border:2px solid #CC0033; 
	color: #CC0033;
	font-weight: bold;
}

.links_calendar a{
	color: #CC0033;
	text-decoration: none;
}

.links_calendar a:hover{
	color: #CC0033;
	text-decoration: underline;
}
.links_calendar{
	margin: 10px 0px 0px;
}

#tableheader {height:55px}
.search {float:left; padding:6px; border:1px solid #c6d5e1; background:#fff}
#tableheader select {float:left; font-size:12px; width:125px; padding:2px 4px 4px}
#tableheader input {float:left; font-size:12px; width:225px; padding:2px 4px 4px; margin-left:4px}
.details {float:right; padding-top:12px}
.details div {float:left; margin-left:15px; font-size:12px}
.tinytable {width: 100%;border-left:1px solid #c6d5e1; border-top:1px solid #c6d5e1; border-bottom:none}
.tinytable th {background:url(../image/header-bg.gif); vertical-align: middle; text-align:left; color:#cfdce7; border:1px solid #fff; border-right:none}
.tinytable th h3 {font-size:10px; padding:6px 8px 6px; color: white;margin: 0px;}
.tinytable td {padding:4px 6px 6px; border-bottom:1px solid #c6d5e1; border-right:1px solid #c6d5e1}
.tinytable .head h3 {background:url(../image/sort.gif) 7px center no-repeat; cursor:pointer; padding-left:18px}
.tinytable .desc, .sortable .asc {background:url(../image/header-selected-bg.gif)}
.tinytable .desc h3 {background:url(../image/desc.gif) 7px center no-repeat; cursor:pointer; padding-left:18px}
.tinytable .asc h3 {background:url(../image/asc.gif) 7px  center no-repeat; cursor:pointer; padding-left:18px}
.tinytable .head:hover, .tinytable .desc:hover, .tinytable .asc:hover {color:#fff}
.tinytable .evenrow td {background:#fff}
.tinytable .oddrow td {background:#ecf2f6}
.tinytable tfoot {background:#fff; font-weight:bold}
.tinytable tfoot td {padding:6px 8px 8px}
#tablefooter {height:15px; margin-top:20px}
#tablenav {float:left}
#tablenav img {cursor:pointer}
#tablenav div {float:left; margin-right:15px}
#tablelocation {float:right; font-size:12px}
#tablelocation select {margin-right:3px}
#tablelocation div {float:left; margin-left:15px}
.page {margin-top:2px; font-style:italic}
#selectedrow td {background:#c6d5e1}