/*-----------------------------------------------------------------------------
Website: www.ter-heide.be
Auteur: Webatvantage.be
Laatst gewijzigd: 07-07-2009
-----------------------------------------------------------------------------*/

/*------------------------------- START HTML / BODY -------------------------------*/
html, body { background: #f1eddf url(../Graphics/Body_bg.gif) repeat-x top left; }
html, body, #container { height: 100%; }
body { font-family: Times New Roman, Georgia, serif; font-size: 14px; color: #282419; line-height: 16px; }
/*------------------------------- END HTML BODY -------------------------------*/

/*------------------------------- START HEADINGS -------------------------------*/
h1 { height: 40px; margin: 0 0 10px 0; background: url(../Graphics/H1_bg.gif) no-repeat bottom center; font-family: Times New Roman, Georgia, serif; font-size: 20px; color: #710000; font-weight: bold; text-transform: uppercase; letter-spacing: -1px; line-height: 25px; }
/*------------------------------- END HEADINGS -------------------------------*/

/*------------------------------- START LINKS -------------------------------*/
a:link, a:visited, a:active { color: #710000; text-decoration: underline; }
a:hover { color: #710000; }
a:focus { outline: none; }
a img { border: none; }
/*------------------------------- END LINKS -------------------------------*/

/*------------------------------- START DL -------------------------------*/
dl { margin: 0 0 10px 0; }
dl dt { margin: 10px 0; }

dl.links { margin: 20px 0 10px 0; }
/*------------------------------- END DL -------------------------------*/

/*------------------------------- START CONTAINER -------------------------------*/
body > #container { height: auto; min-height: 100%; }
div#container { width: 900px; margin: 0 auto; font-size: 14px; }
/*------------------------------- END CONTAINER -------------------------------*/

/*------------------------------- START HEADER -------------------------------*/
div#header { position: relative; width: 900px; height: 157px; background: url(../Graphics/Header_inner_bg.gif) repeat-x; }

/* Mainnav */
div#header ul#mainnav { position: absolute; top: 125px; left: 0; width: auto; height: 25px; list-style: none; }
div#header ul#mainnav li { display: inline; }
div#header ul#mainnav li a { float: left; display: block; height: 25px; margin: 0 15px 0 0; border-bottom: 7px solid #f3f0e4; font-family: Georgia, Times New Roman, serif; font-size: 12px; color: #f1eddf; text-decoration: none; text-transform: uppercase; }
div#header ul#mainnav li a:hover, 
div#header ul#mainnav li a.active { border-bottom: 7px solid #710000; }
div#header ul#mainnav li a.divider { float: left; display: block; width: 2px; background: url(../Graphics/Mainnav_divider.gif) no-repeat top right; }

/* Taalkeuze */
div#header ul#taalkeuze { position: absolute; top: 125px; right: 0; width: auto; height: 25px; list-style: none; }
div#header ul#taalkeuze li { display: inline; }
div#header ul#taalkeuze li a { float: left; display: block; height: 25px; margin: 0 10px 0 0; border-bottom: 7px solid #f3f0e4; font-family: Georgia, Times New Roman, serif; font-size: 12px; color: #f1eddf; text-decoration: none; text-transform: uppercase; }
div#header ul#taalkeuze li a.active { border-bottom: 7px solid #710000; }
div#header ul#taalkeuze li a.divider { float: left; display: block; width: 2px; background: url(../Graphics/Mainnav_divider.gif) no-repeat top right; }

/* Logo */
div#header a#logo {  position: absolute; top: 30px; left: 0; display: block; width: 248px; height: 69px; background: url(../Graphics/Logo.png) no-repeat top left; text-indent: -9999px;}
/*------------------------------- END HEADER -------------------------------*/

/*------------------------------- START CONTENT -------------------------------*/
div#content { padding: 0 0 50px 0; }
div#content ul { margin: 0 0 0 15px; list-style-type: square; }
div#content ul li { margin: 0 0 5px 0; }

/* Inline nav */
div#content ul.inline_nav { margin: 0; height: 20px; line-height: 20px; list-style: none; }
div#content ul.inline_nav li { display: inline; }
div#content ul.inline_nav li.divider { float: left; display: block; width: 2px; height: 20px; margin: 0 10px 0 0; background: url(../Graphics/Inline_nav_divider.gif) no-repeat top right; }
div#content ul.inline_nav li a { float: left; display: block; height: 20px; line-height: 20px; margin: 0 10px 0 0; border-bottom: 3px solid #f1eddf; text-decoration: none; text-transform: uppercase; } 
div#content ul.inline_nav li a:hover, div#content ul.inline_nav li a.active { border-bottom: 3px solid #710000; }

/* Main */
div#content div#main { float: left; width: 570px; margin: 0 0 0 20px; }

/* Baseline */
div#content div#main div#baseline { width: 570px; height: 142px; margin: 0 0 20px 0;  }
div#content div#main div#baseline a { display: block; width: 570px; height: 142px; text-indent: -9999px; }

div#content div#main div#baseline a.baseline_NL { background: url(../Graphics/Baseline_NL.gif) no-repeat top left; }
div#content div#main div#baseline a.baseline_FR { background: url(../Graphics/Baseline_FR.gif) no-repeat top left; }
div#content div#main div#baseline a.baseline_EN { background: url(../Graphics/Baseline_EN.gif) no-repeat top left; }
div#content div#main div#baseline a.baseline_DE { background: url(../Graphics/Baseline_DE.gif) no-repeat top left; }

div#content div#main div#baseline a:hover { background-position: bottom left; }

/* Garden photo scroller */
div#content div#main div#garden_photo_scroller { width: 559px; height: 230px; margin: 30px 0; background: url(../Graphics/Garden_photo_scroller_bg.gif) no-repeat top left; overflow: hidden; }
div#content div#main div#garden_photo_scroller div { margin: 5px 0 0 5px; }
/*------------------------------- END CONTENT -------------------------------*/

/*------------------------------- START CONTACTFORM -------------------------------*/
form#contactform { float: left; width: 250px; margin: 10px 0 30px 0; }
form#contactform p { margin: 5px 0; }
form#contactform p.validation { margin: 0 0 5px 0; padding: 5px; background: #f7f5ed; border: 1px solid #c5c2b6; }
form#contactform p.error { color: #770000; font-style: italic; }
form#contactform label, form#contactform .input, form#contactform .inputred, form#contactform .textarea { font-family: Times New Roman, Georgia, serif; font-size: 14px; color: #282419; }

form#contactform label { display: block; height: 25px; line-height: 25px; }
form#contactform .input { display: block; width: 244px; height: 18px; padding: 3px; background: none; border: none; border-bottom: 1px solid #c5c2b6; border-left: 1px solid #c5c2b6; cursor: text; }
form#contactform .inputred { display: block; width: 244px; height: 18px; padding: 3px; background: none; border: none; border-bottom: 1px dotted #710000; border-left: 1px dotted #710000; cursor: text; }

form#contactform .input:focus, form#contactform .textarea:focus { background: #f7f5ed; }

form#contactform .textarea { display: block; width: 244px; height: 144px; padding: 3px; background: none; border: none; border-bottom: 1px solid #c5c2b6; border-left: 1px solid #c5c2b6; cursor: text; overflow: auto; }
form#contactform .textareared { display: block; width: 244px; height: 144px; padding: 3px; background: none; border: none; border-bottom: 1px dotted #710000; border-left: 1px dotted #710000; cursor: text; overflow: auto; }

form#contactform .submit { padding: 3px; background: #710000; border: none; color: #f7f5ed; cursor: pointer; }
/*------------------------------- END CONTACTFORM -------------------------------*/

/*------------------------------- START CONTACT -------------------------------*/
div#contact { margin-right: 10px; }

/* Gegevens */
div#contact div#gegevens { float: left; width: 300px; margin: 10px 0 30px 10px; }
div#contact div#gegevens div#map { width: 295px; height: 145px; margin: 0 0 10px 0; padding: 5px 0 0 5px; background: url(../Graphics/Gegevens_box.gif) no-repeat top left; }

div#contact div#gegevens p { width: 300px; background: url(../Graphics/Gegevens_box_bg.gif) repeat-y top left; }
div#contact div#gegevens p span.top { display: block; width: 300px; height: 20px; background: url(../Graphics/Gegevens_box_top.gif) top left; }
div#contact div#gegevens p span.content { display: block; padding: 0 20px; }
div#contact div#gegevens p span.bottom { display: block; width: 300px; height: 20px; background: url(../Graphics/Gegevens_box_bottom.gif) bottom left; }
/*------------------------------- END CONTACT -------------------------------*/

/*------------------------------- START SIDEBAR -------------------------------*/
div#sidebar { float: left; width: 301px; }
div#sidebar p { line-height: 20px; }

/* Main photo scroller */
div#sidebar div#main_photo_scroller { width: 301px; height: 301px; margin: 30px 0; background: url(../Graphics/Main_photo_scroller_bg.gif) no-repeat top left; overflow: hidden; }
div#sidebar div#main_photo_scroller div { margin: 5px 0 0 5px; }

/* Terras en tuin */
div#sidebar div#terras_en_tuin { width: 301px; height: auto; margin: 0 0 30px 0; }

/* Referenties */
div#sidebar div#referenties { width: 301px; height: auto; margin: 0 0 30px 0; }

div#sidebar div#referenties ul { margin: 0 0 0 15px; list-style-type: square; }
div#sidebar div#referenties ul li { margin: 0 0 5px 0; }

/* Reserveren */
div#sidebar div#reserveren { margin: 15px 0; }
/*------------------------------- END SIDEBAR -------------------------------*/

/*------------------------------- START MENU -------------------------------*/
ul.menucats li ul { padding: 10px; }
ul.menucats li ul li { padding: 2px 0; list-style-type: circle; }

div.menu_item { position: relative; background: #f9f5e6; padding: 10px; border: 1px solid #c5c2b6; border-top: none; border-bottom: none; }
div.menu_item_top { width: 570px; height: 16px; margin-top: 10px; background: url(../Graphics/Menu_item_top.gif) no-repeat top left; }
div.menu_item_bottom { width: 570px; height: 16px; margin-bottom: 10px; background: url(../Graphics/Menu_item_bottom.gif) no-repeat top left; }

div.menu_item h2 { height: 25px; margin: 0 0 0px 0; font-family: Times New Roman, Georgia, serif; font-size: 16px; font-weight: bold; text-transform: uppercase; text-align: center; letter-spacing: -1px; line-height: 25px; }
div.menu_item p { text-align: center; }
div.menu_item p.datum { margin: 0 0 10px 0; }
div.menu_item p.gangen { font-style: italic; line-height: 20px; }
div.menu_item p.prijs { margin: 10px 0; font-weight: bold; line-height: 20px; }

div.menu_item span.niet_inbegrepen { display: inline-block; width: 16px; height: 16px; background: url(../Graphics/Star.gif) no-repeat center center; color: #770000; font-weight: bold; text-indent: -9999px; }

div.menu_item p#menukaart_NL,
div.menu_item p#menukaart_FR,
div.menu_item p#menukaart_EN,
div.menu_item p#menukaart_DE { position: absolute; top: -18px; left: -2px; width: 116px; height: 116px; text-indent: -9999px; }
div.menu_item p#menukaart_NL { background: url(../Graphics/Menukaart_NL.png); }
div.menu_item p#menukaart_FR { background: url(../Graphics/Menukaart_FR.png); }
div.menu_item p#menukaart_EN { background: url(../Graphics/Menukaart_EN.png); }
div.menu_item p#menukaart_DE { background: url(../Graphics/Menukaart_DE.png); }
/*------------------------------- END MENU -------------------------------*/

/*------------------------------- START STYLED TABLE -------------------------------*/
.styled_table { border-collapse: collapse; }
.styled_table thead th { background-color: #c5c2b6; padding: 5px; font-weight: bold; }
.styled_table tbody td { padding: 5px; }
.styled_table tbody tr.even { background-color: #e3dfd1; }
/*------------------------------- END STYLED TABLE -------------------------------*/

/*------------------------------- START BESCHIKBAARHEID -------------------------------*/
div#beschikbaarheid { position: relative; margin: 20px 0; /*overflow: hidden;*/ }

div#beschikbaarheid div.box { margin: 0 0 10px 0; padding: 10px 10px 10px 40px; background: #f3f0e4; border: 1px solid #d5d2c5; overflow: hidden; }
div#beschikbaarheid div.legende { background: #f3f0e4 url(../Graphics/Opgelet.gif) no-repeat 10px 8px }
div#beschikbaarheid div.top { background: #f3f0e4 url(../Graphics/Top.gif) no-repeat 10px 8px }

div#beschikbaarheid table.maand { float: left; margin: 0 0 10px 0; border-left: 5px solid #f1eddf; border-right: 5px solid #f1eddf; }
div#beschikbaarheid table.maand thead tr { background: #c5c2b6; }
div#beschikbaarheid table.maand thead tr.titel th { font-size: 16px; padding: 5px; }
div#beschikbaarheid table.maand thead tr th { text-align: center; }

div#beschikbaarheid table.maand tbody tr.odd { background:#e3dfd1; }
div#beschikbaarheid table.maand tbody tr td { padding: 5px; text-align: center; }
div#beschikbaarheid table.maand tbody tr td a { display: inline-block; width: 20px; height: 20px; line-height: 20px; }
div#beschikbaarheid table.maand tbody tr td a:hover { background: #c5c2b6; }

div#beschikbaarheid table.maand tbody tr td a.gereserveerd { background: url(../Graphics/Reeds_gereserveerd.gif) no-repeat center center; color: #f1eddf; text-decoration: none; }
/*------------------------------- END BESCHIKBAARHEID -------------------------------*/

/*------------------------------- START TOOLTIP -------------------------------*/
a.tooltip { z-index: 24; position: relative; }
a.tooltip:hover { z-index: 25; }
a.tooltip span { display: none; }
a.tooltip:hover span { display: block; position: absolute; top: -3em; left: -2em; padding: 5px 10px; border: 1px solid #282419; background: #464031; color: #e5e2d3; text-align: center; }
/*------------------------------- END TOOLTIP -------------------------------*/

/*------------------------------- START SITEMAP -------------------------------*/
ul.sitemap li ul { padding: 10px 0 2px 0; }
ul.sitemap li ul li { padding: 2px 0; list-style-type: circle; }
/*------------------------------- END SITEMAP -------------------------------*/

/*------------------------------- START BROWSER WARNING -------------------------------*/
div#browserWarning { position: absolute; z-index: 9999; top: 0; left: 0; width: 100%; padding: 20px 0; background-color: #464031; color: #e5e2d3; font-size: 20px; text-align: center; }
div#browserWarning a { color: #e5e2d3; }
/*------------------------------- END BROWSER WARNING -------------------------------*/

/*------------------------------- START FOOTER -------------------------------*/
div#footer { position: relative; margin-top: -50px; height: 50px; background: url(../Graphics/Footer_bg.gif) no-repeat top center; clear: both;  }

/* Inner footer */
div#footer div#inner_footer { width: 880px; height: 50px; line-height: 50px; margin: 0 auto; padding: 0 10px; color: #a8a69c; }
div#footer div#inner_footer a { color: #a8a69c; text-decoration: none; }
div#footer div#inner_footer a:hover { text-decoration: underline; } 
/*------------------------------- END FOOTER -------------------------------*/

/*------------------------------- START OTHER CLASSES -------------------------------*/
.left { float: left; }
.right { float: right; }
.underline { text-decoration: underline !important; }
.terug { display: block; margin: 10px 0 0 0; }
.tekstblok { margin: 20px 0; }
.align_right { text-align: right; }
/*------------------------------- END OTHER CLASSES -------------------------------*/

/*------------------------------- START CLEARFIX -------------------------------*/
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */
.clear { clear: both; }
/*------------------------------- END CLEARFIX -------------------------------*/

/*------------------------------- START JQUERY DATEPICKER -------------------------------*/
a.dp-choose-date { float: left; width: 25px; height: 25px; margin: -10px 0 0 0; padding: 0; display: block; text-indent: -9999px; overflow: hidden; background: url(../Graphics/Calender.png) no-repeat center center; }
a.dp-choose-date.dp-disabled { cursor: default; }
input.dp-applied { float: left; }
/*------------------------------- END JQUERY DATEPICKER -------------------------------*/