/**
 * Basic layout stylesheet for a 980px wide website, centered horizontally.
 * Default elements include:
 * - header with logo and possible a small menu
 * - horizontal main menu,
 * - site wide imageslider
 * - pathway
 * - main content, possibly with left or right (or both) sidebar columns
 * - footer with 4 columns
 *
 * Any changes to the default template should be made in the theme stylesheets. This stylesheet
 * should only contain generic markup for providing a general starting point.
 *
 * Reset and generic styles (such as bootstrap) are contained in separate stylesheets that are
 * loaded bef�re this one. Theme specific styles should be placed in the theme`s theme.css file
 * which should be loaded �fter this one.
 */

/**
 * General DIV structure, centered and 980px wide. This structure does NOT
 * have an outer container, so that individual vertical elements may be expanded
 * further than the site width.
 */
html, body          { height: 100%; margin: 0 0 1px; padding: 0; }
body                { text-align: center; background: #ebebeb; }

.small              { text-align: left; margin: 0 auto; position: relative; width: 980px; background: #fff; }
#sitecontainer      { width: 980px; margin: 0 auto; text-align: left; clear: both; background: #FFF; }

/**
 * Generic font settings
 */
body                { font-size: 0.8em; font-family: Geneva, 'Lucida Sans', 'Lucida Grande', 'Lucida Sans Unicode', Verdana, sans-serif; }
h1,h2,h3,h4         { font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif; }
h1 a, h2 a, h3 a, h4 a
                    { color: inherit; }
p                   { line-height: 1.4em; }

span.highlight {
    background: #f0efdd;
}
dl.zoekresultaten dd {
    margin-bottom: 1.5em;
}

#authMessage {
    margin: 1em 0 0;
    padding: 14px;
    color: #b94a48;
    background-color: #f2dede;
    border-color: #eed3d7;
}

/**
 * PATHWAY
 **/
#pathway ul         { list-style-type: none; margin: 0; padding: 0; }
#pathway li         { display: inline-block; margin: 0 5px 0 0 ; padding: 0; }


.form-horizontal .control-label             { text-align: left; }

/**
 * SITE LOGO
 * Make sure that you fit the (line-)heights for site logo so that it correlates
 * with the actual background logo. You may also want to adjust #menu_topmenu so
 * that it aligns nicely vertically with the logo (by setting their heights equal).
 **/
#logo {
    display: block;
    width: 242px;
    height: 41px;
    float: left;
    vertical-align: middle;
    margin: 20px 0 20px 20px;
}
#logo a                     { display: block; height: 41px; width: 242px; }

/**
 * TOPMENU
 **/
#menu_topmenu               { float: right; }
#menu_topmenu ul            { list-style-type: none; margin: 0; padding: 0; }
#menu_topmenu li            { display: inline; float: left; }
#menu_topmenu li a          { line-height: 41px; display: block; margin: 20px; color: inherit; text-decoration: none; }
#menu_topmenu li a:hover    { color: inherit; text-decoration: underline; }

/**
 * MAINMENU
 * Please refer to megamenu.css for styling the main menu. The menu z-index should be
 * higher than that of any elements below it, or hover menus may appear behind other content.
 **/
#menu-wide                  { z-index: 20; position: relative;}
#menu-small                 { background: #2081AB; position: static; }

/**
 * SLIDER
 * Make sure to set the slider width and height equal to the dimensions below.
 **/
#banner-wide                { z-index: 1; }
#banner-small               { height: 320px; width: 980px; }
.window                     { height: 320px; width: 980px; overflow: hidden; position: relative; }
.main_view                  { float: left; position: relative; }
.caption                    { position: absolute; padding: 10px; z-index: 15; bottom: 0; zoom: 1; filter: alpha(opacity=80); opacity: 0.8; }
.paging                     { position: absolute; top: 10px; right: 10px; z-index: 15; }
.paging li                  { text-decoration: none; list-style-type: none; display:block; }
.image_reel                 { position: absolute; z-index: 5; top: 0; left: 0; }
.image_reel img             { float: left; }
/**
 * MODULE: Nieuws
 */
.bericht                    { clear: both; }
.bericht-thumbnail          { float: left; width: 120px; height: 120px; display: block; padding: 4px; margin-right: 10px; margin-bottom: 10px; border: 1px solid #d8d8d8; }
.bericht-wrapper            { }
.bericht-titel              { font-size: 1.2em; line-height: normal; margin-bottom: 0; }
.bericht-datum              { font-size: 0.9em; display: block; color: #666; margin: 5px 0 10px; }

.module-nieuws.listing      { margin-bottom: 20px; }
.module-nieuws.listing dt   { float: left; color: #aaa; width: 60px; font-size: 0.9em; font-weight:  normal; clear: both;}
.module-nieuws.listing dd   { float: left; }

/** MODULE: Agenda*/
.agenda-item {
    clear: both;
}

.agenda-datum {
    background: #E53400;
    color: #fff;
    float: left;
    margin: 0 20px 20px 0;
    width: 45px;
}
.agenda-dag,
.agenda-maand {
    line-height: 20px;
    text-align: center;
    display: block;
    height: 16px;
}
.agenda-dag {
    margin-top: 4px;
    font-size:1.4em;
    font-weight:bold;
}
.agenda-maand {
    margin-bottom: 4px;
}
.agenda-body {
    float: left;
    width: 400px;
    margin-bottom: 20px;
}
.agenda-meer {
    float: right;
}


.module-agenda .table-listing h2 { line-height: 40px; }
.module-agenda .table-listing td { padding: 4px 0; }
.module-agenda .table-listing th { padding: 4px 0; }


/**
 * MODULE: Fotoalbums
 **/
.albumfoto {
    float: left;
    padding: 4px;
    margin: 0 10px 10px 0;
    border: 1px solid #d8d8d8;
    border-radius: 4px;
    background: #fff;
}
.albumfoto img {
    border: none;
}
.thumbnail-wrapper {
    display: block;
    height: 120px;
    width: 120px;
    padding: 4px;
    margin-right: 10px;
    margin-bottom: 10px;
    border: 1px solid #d8d8d8;
}
#content .albumbeschrijving h2,
.albumbeschrijving h2 {
    color: #0088cc;
    font-size: 1.2em;
    margin-bottom: 0;
    margin-top: 0;
    line-height: normal;
}


/**
 * CONTENT
 **/

/**
 * FOOTER
 * Defaults to 4 columns, 980px wide. Columns thus are 230px wide.
 * Spacing between columns is 20px.
 */
#footer-wide                { text-align: center; }
#footer                     { margin: 0 auto; width: 980px; text-align: left; }
.footer-kolom h3            { font-size: 1.4em; margin: 1em 0; font-weight: normal; }
.footer-kolom a             { text-decoration: none; color: inherit;}
.footer-kolom li            { line-height: 2em;}
.footer-kolom ul            { list-style-type: none; margin: 0; padding: 0; }
.footer-kolom               { float: left; width: 230px; margin: 10px 20px 10px 0; }
.footer-kolom-last          { float: left; width: 230px; text-align: left; margin: 10px 0px 10px 0; }

/**
 * DISCLAIMER
 * Should be present on any site using CustomCMS, for backlinks and pagerank
 */
#disclaimer-wide            { }
#disclaimer-small           { background: transparent; text-align: right; margin-bottom: 1em; }

#content h2 {
    font-size: 1.4em;
    margin-bottom: 0.8em;
}
#content h3 {
    margin-bottom: 1em;
}
#content ul {
    margin-bottom: 1em;
}




/** UNSORTED **/
#content-links              { width: 640px; margin-right: 20px; float: left; }
#rechts                     { width: 320px; float: left;}


div.site-welkom             { background: #FFEDDF; padding: 1em; margin-bottom: 1em;}
div.nieuws-list-item        { margin-bottom: 10px; }
div.nli-afbeelding          { float: left; width: 180px; display: block; padding: 2px; height: 120px; border: 1px solid #eee;}
div.nli-afbeelding img      {  }
div.nli-content             { float: left; padding: 5px 0; width: 434px; margin-left: 20px; }
div.nli-content h2          { color: #E0281B; font-size: 1.5em;}
#content p.nieuws-datum { font-size: 0.6em; margin-bottom: 1em;}

.corner-tl {
        -webkit-border-radius-topleft: 10px;
        -moz-border-radius-topleft: 10px;
    border-top-left-radius: 10px;
}

.corner-tr {
        -webkit-border-radius-topright: 10px;
        -moz-border-radius-topright: 10px;
    border-top-right-radius: 10px;
}



.widget                     { border: 1px solid #ddd; background: #eee; margin-bottom: 10px; }
.widget-titel               { display: block; padding: 10px; font-size: 1.2em; border-bottom: 1px solid #ddd; }
.widget-body                { padding: 10px; font-size: 0.8em; }

.widget h3                  { font-size: 1.2em; margin-bottom: 0.5em;}
.widget-nieuws h3           { color: #E0281B; }

.widget table.poll          { margin: 1em 0; width: 100%; }
.widget td.poll_cb          { padding: 4px; width: 20px; }
.widget td.poll_optie       { padding: 4px; }

.listmenu .v li             { margin-bottom: 0.5em; }

p.nieuws-datum              { font-size: 0.8em; color: #888;margin-bottom: 0.5em; }



/** FORMS **/
.blok-dataform                                                                          { margin: 0; padding: 0; }
.blok-dataform .input .inputHintOverlay                         { text-align: left; color: #999; width: auto; cursor: text; }
.blok-dataform .input                                                           { clear: both; border-bottom: 1px solid #eee; display: block; background: #fff; }
.blok-dataform .error                                                           { background: #FFEFEF; border-bottom: 1px solid #FFDFDF; }
.blok-dataform .content-blok .textarea                          { border: 0; }

/* labels en errormessage */
p.error { color: #b94a48; }
p.error input[type=checkbox] { border-color: #b94a48; }
.control-group .error-message { color: #b94a48; margin-left: 180px; padding-top: 5px;  }

.blok-dataform .input label                                             { width: 180px; background: #F6F6F6; text-align: left; float: left; padding: 9px 0 9px 10px; line-height: 20px; }
.blok-dataform .error label                                                     { background: #FFEFEF; color: #F00; font-weight: bold;}
.blok-dataform .error-message                                           { background: #FFEFEF; display: block; padding: 8px 1em; }
.blok-dataform .required label                                          { font-weight: bold; }
.blok-dataform .textarea label                                          { height: 158px; }
.blok-dataform .textarea textarea                                       { height: 154px; padding: 4px; margin: 6px 0 6px 6px; width: 294px; border: 1px solid #79B7E7; }
.blok-dataform .input .checkbox label                           { background: #FFFFFF; width: auto; line-height: 14px; padding: 9px 4px 9px 8px; }
.blok-dataform .input .checkbox input                           { float: left; margin: 10px 0 8px 8px;}

/* inputvelden algemeen */
.blok-dataform .input input[type=text],
.blok-dataform .input input[type=password]                      { border: 1px solid #79B7E7; padding: 4px; line-height: 16px; width: 294px; margin: 6px 0 6px 6px; background: #fff; }
.blok-dataform .input input[type=file]                          { border: 1px solid #79B7E7; padding: 4px; margin: 7px 0 7px 6px; background: #fff; }
.blok-dataform .input select                                            { border: 1px solid #79B7E7; padding: 3px; margin: 6px 0 6px 6px; background: #fff; }
.blok-dataform .input input[type=text].currency         { width: 100px; }
.blok-dataform .submit                                                          { margin-top: 10px; }


/* Simple blockquote styleing */
blockquote {
    background: url("../img/blockquote.png") no-repeat scroll 6px 16px transparent;
    color: #777777;
    margin:0 0 20px;
	padding:9px 20px 0 49px;
    border:none;
}

blockquote cite:before {
	content:"\2014 \0020";
}

blockquote p {
    font-family: Georgia,serif;
    font-size: 14px;
    font-style: italic;
    line-height: 24px;
}

.beoordeling_ster_input {
    display: inline-block;
    width: 16px;
    height: 16px;
    margin: 0px;
    padding: 0 1px;
    text-indent: -9999px;
    background: url('../img/icons/star_gray.png') no-repeat;
}

.beoordeling_ster_input_active,
.beoordeling_ster_input:hover {
    background: url('../img/icons/star.png') no-repeat;
}

.com_faq_question .hash-padding:before  {
    display: block;
    content: "";
    height: 100px;
    margin: -100px 0 0;
}