﻿body
{
background-color: #afafaf;
color:#7F928C; 
font-family: Verdana, Arial;
font-size:9pt;	
margin:0;
padding:0;	
}
P 
{
margin:0 0 0.8em 0;
text-align:left; 
}
a { outline: none; }
a:link { color: #ACC741;}
a:visited {color: #ACC741;}
a:hover {color: #ACACAC;}
a:active {color: black;}

/* Basic text styles */
.introStart 
{
color:#ACC741;
font-size: 1.1em;
font-weight:bold;
}
.introText 
{
font-size: 1.1em;
font-weight:bold;
}
.indent
{
margin:0 0 0 50px;
}
/* HEADINGS */
h1, h2, h3, h4, h5, h6
{
color:#ACC741;
font-family: Arial;
}
h1
{
font-size: 22pt;
font-weight:bold;
margin:0;
padding: 0;
}
h2
{
font-size:1.4em;
font-weight:bold;
padding: 0;
margin:0;
}
h3
{
font-size: 1.2em;
}
h4
{
font-size: 1.1em;
}
h5, h6
{
font-size: 1em;
}

/* this rule styles <h2> tags that are the 
first child of the left and right table columns */
.rightColumn > h1, .rightColumn > h2, .leftColumn > h1, .leftColumn > h2
{
margin-top: 0;
}
/* PRIMARY LAYOUT ELEMENTS */
/* you can specify a greater or lesser % for the 
page width. Or, you can specify an exact pixel width. */
.page
{
background-color:White;
width: 800px;  /* or screen % */
margin-left: auto;
margin-right: auto;
margin-top:5px;
padding:  10px 15px 5px 15px; /* t r b l */
border-style: solid  solid solid solid;
border-width:2px;
border-color: #7F928C;
}
.pageName
{
font-family:Arial, Verdana;
font-style:italic;
font-size:14pt;
text-align:right;
}
.leftHeading
{
width:100%;
background:#ACC741;
color:White;
border-style: solid none solid none; /* t r b l */
border-width: 1px;
border-color:#7F928C;
padding: 1px 5px 2px 5px;
}
.summaryEvent
{
margin: 5px 0px 5px 20px;
padding:0;    
font-size: 0.9em;	
}
.summaryEvent ul
{
padding:0;
margin:0;
}
.summaryEvent li
{
list-style: square;
list-style-position:outside;
margin:0;
padding:0;
}
.summaryEvent a
{
text-decoration: none;
}
.nieuwsbrief
{
margin: 5px 0px 5px 20px;
padding:0;    
font-size: 0.9em;	
}
.nieuwsbrief ul
{
padding:0;
margin:0;
}
.nieuwsbrief li
{
list-style: square;
list-style-position:outside;
margin:0;
padding:0;
}
.nieuwsbrief li a
{
text-decoration: none;
}
#english
{
    text-align:right;
}
#english a
{    
    background: white url(img/english.jpg) no-repeat center right;
    margin:0;
    font-size:0.9em;
    padding: 0 25px 0 0;
    text-decoration:none;
}
#flyerEnglish
{
    background: white url(img/FlyerEnglish.jpg) no-repeat top left;
    width:570px;
    height:806px;
}
.candidateChurch
{
margin:7px 0 12px 0;
padding:0;
font-size:0.9em;
}
.candidatePersonal
{
margin:7px 0 0 0;
padding:0;
font-size:0.9em;
}
.candidateBirth
{
margin:12px 0 0 0;
padding:0;
font-size:0.9em;
}
.eventDate
{
font-size:1.0em;
color:GrayText; 
}
.eventTitle 
{    
font-family:Arial;
color:#ACC741;
font-size:1.3em;
font-weight:bold;
padding: 0;
margin:0;
}
.eventLocation
{  
}
.eventDescription
{
font-size:10pt;
margin-left:25px;
margin-top:0.5em;
margin-bottom:1em;
}
.newsItemDate
{
font-size:0.9em;
color:GrayText; 
}
.newsItemTitle
{    
color:#ACC741;
font-family:Arial; 
font-size:1.3em;
font-weight:bold;
}
.newsItemDescription
{
margin-left:25px;
margin-top:0.5em;
margin-bottom:1em;
}
.linkTitle
{
color:#ACC741;
font-family:Arial; 
font-size:1.2em;
font-weight:bold;
}
.linkDescription
{
margin-bottom:1em;
}
.socialmedia
{
margin: 5px 0px 5px 5px;
vertical-align:middle;
font-size:0.9em;
}
.socialmedia img
{
border: none;
vertical-align:middle;
}
.socialmedia a
{
text-decoration:none;
}

#header
{
position:relative;
padding: 0;
margin-top:0px;
margin-bottom:12px;
}
#logoImage
{
padding:0px;	
margin:0px 0 5px 0;
}
#logoImageB
{
padding:4px 0 0 0;	
margin:0px 0 5px 0;
}
#skylineImage
{
padding:0;
margin:0;
}
.banner
{
text-align:center;
padding:0;
margin-top:5px;
margin-bottom:5px;
}
a img
{
 border:0;
}

#weekPicture
{
text-align:center;
margin:5px 0 0 5px;
padding: 0;

}

#left
{
float:left;
width:170px;	
}
.HvDH
{
font-style:italic;
font-size:20pt;
text-align:center;
color: #FF6600; /* orange */
}
#gap
{
float:left;
width:40px;
}
#main
{
float:left;
width:580px;
margin-bottom:10px;
min-height:400px;
_height: 1px; /* only IE6 applies CSS properties starting with an underscrore */
}
#footer
{
clear: both;
height: 25px;	
color: #c0c0c0;
background-color: Transparent;
text-align: center;
}

/* TAB MENU */
ul.menu
{
position: relative;
margin: 0;
padding:0;
text-align: left;
}
ul.menu li
{
text-align:left;
list-style: none;
height:15pt;
}
ul.menu li a
{
padding: 5px;
text-decoration: none;
color: #ACC741;      
}
ul.menu li a:hover
{
text-decoration: none;
color: #ACACAC;
}
ul.menu li a:active
{
text-decoration: none;
color: #ACC741;    
}
ul.menu li.selected a
{
color:Black;
border:none;
}


/* FORM LAYOUT ELEMENTS */
fieldset 
{
margin: 0;
padding: 0;
border-width:0;
}
fieldset p 
{
margin: 2px 12px 10px 10px;
}
fieldset label 
{
display: block;
}
fieldset label.inline 
{
display: inline;
}
legend 
{
font-size: 1.1em;
font-weight: 600;
padding: 2px 4px 8px 4px;
}
input[type="text"] 
{
width: 200px;
border: 1px solid #CCC;
}
input[type="password"] 
{
width: 200px;
border: 1px solid #CCC;
}

/* TABLE */
.candidateList table
{
border-top: solid 4px #7F928C;
border-bottom: solid 4px #7F928C;
margin-top:4px;
margin-bottom:4px;
border-collapse:collapse;
}
.candidateList table td
{
padding: 3px;
vertical-align:top;
text-align:left;
border-bottom: dotted 2px #e0e0ff;
border-left: none;
border-right:none;
}
.smallText
{
font-size:0.9em;
}
.table 
{
border: solid 1px #e8eef4;
border-collapse: collapse;
}
.table td 
{
padding: 5px;   
border: solid 1px #e8eef4;
}
.table th
{
padding: 6px 5px;
text-align: left;
background-color: #e8eef4; 
border: solid 1px #e8eef4;   
}

/* MISC */
.clear
{
clear: both;
}
.error
{
color:Red;
}
.kader
{
margin: 10px 0 10px 0;
padding:5px;
border: solid 1px #7F928C;
}
.kader ul
{   
position: relative;
margin: 0;
padding:0;
text-align: left;
}
.kader li
{
text-align:left;
margin: 0 0 0 30px;
}
#footerBorder
{
background:#ACC741;   
float:left;
width:800px;
height:10px;
margin:0px 0px 0px 0px; /* t r b l */
}
.menucontainer
{
border-style: none none none solid;
border-width: 3px;
border-color: #7F928C;    
float:left;
font-family: Arial, Verdana;
font-size:11pt;
font-weight:bold;
padding: 2px 0 0 0;
margin: 0;
}
div#title
{
position:absolute;
top:70px;
left:170px;
font-family:Georgia, Serif;
font-size:50pt;
line-height:1em;
font-style:italic;
color:White;
}
#twitter_update_list
{
font-size:0.9em;
border:solid 1px #7F928C;
padding:5px;
}
#twitter_update_list li
{
    margin: 0 0 0 15px;
    list-style:square;
    padding:0;
}
#logindisplay
{
font-size:0.9em;
display:block;
text-align:right;
margin:3px;
color:White;
}
#logindisplay a:link
{
color: white;
text-decoration: underline;
}
#logindisplay a:visited
{
color: white;
text-decoration: underline;
}
#logindisplay a:hover
{
color: white;
text-decoration: none;
}
.field-validation-error
{
color: #ff0000;
}
.input-validation-error
{
border: 1px solid #ff0000;
background-color: #ffeeee;
}
.validation-summary-errors
{
font-weight: bold;
color: #ff0000;
}

#s3slider { 
   width: 510px; /* important to be same as image width */ 
   height: 490px; /* important to be same as image height */
    position: relative; /* important */
    overflow: hidden; /* important */
 }
 
 #s3slider ul { list-style-type: none;}

 #s3sliderContent {
    width: 510px; /* important to be same as image width or wider */
    position: absolute; /* important */
    top: 0; /* important */
    margin-left: 0; /* important */
 }

 .s3sliderImage 
 {
    float: left; /* important */
    position: relative; /* important */
    display: none; /* important */
 }

 .s3sliderImage span {
    position: absolute; /* important */
    left: 0;
    font: 10px/15px Arial, Helvetica, sans-serif;
    padding: 10px 13px;
    width: 484px;
    background-color: #000;
    filter: alpha(opacity=70); /* here you can set the opacity of box with text */
    -moz-opacity: 0.7; /* here you can set the opacity of box with text */
    -khtml-opacity: 0.7; /* here you can set the opacity of box with text */
    opacity: 0.7; /* here you can set the opacity of box with text */
    color: #fff;
    display: none; /* important */
    top: 0;

    /*
        if you put
        top: 0; -> the box with text will be shown at the top of the image 
       if you put
        bottom: 0; -> the box with text will be shown at the bottom of the image
    */
 }
