﻿/*--------------------------------------------------------------------------------------
LA BAMBA                                                                  
----------------------------------------------------------------------------------------*/

html { height: 100%; }
body {  height: 100%; width: 100%; padding-bottom: 70px; background-color: #000; font-family: Arial, sans-serif; font-size: 13px; color: #fff; background-image: url('../images/bg.jpg'); background-repeat: no-repeat; background-position: 50% 0; }


/* CONTAINER + HOLDER.
--------------------------------------------------------------------------------------*/


#container { position: relative; width: 970px; margin: 0 auto; }


/* GENERAL MARK-UP.
--------------------------------------------------------------------------------------*/


a { color: #FFD957; text-decoration: none; }
a:hover { color: #97C758;}



#container #text { z-index: 3; position: absolute; right: 30px; top: 170px; width: 520px; margin-bottom: 50px; background-image: url('../images/textbg.png'); border-right: 1px solid #eaeaea; border-bottom: 1px solid #eaeaea; padding: 30px; }
#container #text h2 { font-size: 25px; color: #FAB046; line-height: 35px; }
#container #text p { margin-top: 20px; line-height: 18pt; color: #f9ffb2; }

#container #page-title h1 { z-index: 9; position: absolute; right: 30px; top: 124px; font-size: 25px; color: #fff; line-height: 35px; }

#container #foto { z-index: 1; position: absolute; left: 0px; top: 50px; width: 970px; overflow: hidden; height: 540px; }
#container #ornament { z-index: 5; position: absolute; left: 190px; top: 0px; }
#container #texthider { z-index: 6; position: absolute; right: 45px; top: 185px; width: 15px; height: 15px; background-image: url('../images/inout.gif'); background-repeat: no-repeat; cursor: pointer;  }
#container #cycle_controls { z-index: 6; position: absolute; right: 32px; top: 160px; color: #FAB046; height: 10px; background-color: #000000; padding: 5px; font-size: 9px; text-transform: uppercase;   }
#container #cycle_controls:hover { color: #fff;  }
#container #cycle_controls span { cursor: pointer; }


#container #logo { z-index: 4; position: absolute; left: 0px; top: 160px; border-left: 0px solid #eaeaea; border-bottom: 0px solid #eaeaea; }
#container #logo img { display: block; }

#container #menu { z-index: 6; position: absolute; left: 0px; top: 50px; width: 970px; height: 60px; padding-left: 0px; background-image: url('../images/menubg.png'); }
#container #menu ul li { display: block; height: 37px; padding-top: 23px; width: auto; padding-left: 20px; padding-right: 20px; text-align: center; float: left; }
#container #menu ul li a { color: #e8edbd; }
#container #menu ul li a:hover { color: #FAB14A; }
#container #menu ul li.on { background-color: #FAB046;  }
#container #menu ul li.on a { color: #000; }

#container #adres { z-index: 4; position: absolute; left: 20px; top: 600px; border-left: 0px solid #eaeaea; border-bottom: 0px solid #eaeaea; line-height: 16pt; }
#container #adres div { width: 170px; float: left; font-size: 11px; color: #59523A; }
#container #adres div a { color: #59523A; }
#container #adres div a.reserveer { color: #FAB046; font-size: 10px; text-transform: uppercase; }
#container #adres div a.reserveer:hover  { color: #FAB046; text-decoration: underline; }

.downloadmenu { margin-top: 20px; border-bottom: 1px solid #333; border-top: 1px solid #333; padding-top: 20px; padding-bottom: 20px;  }
.downloadmenu a { margin: 0 auto; display: block; background-image: url("../images/downloadmenu.png"); width: 300px; height: 60px; background-repeat: no-repeat; }
.downloadmenu a:hover { background-position: 0px -60px; }

.agenda_rij { width: 525px; border-bottom: 1px solid #333; margin-bottom: 20px; padding-bottom: 20px; min-height: 110px; line-height: 18pt; clear: both;  }
.agenda_rij h3 { color: #FAB046; font-size: 18px; } 
.agenda_rij .date { color: #ccc; }
.agenda_rij img { float: left; margin-right: 10px; border: 1px solid #333; padding: 4px; width: 150px; height: 100px; display: block; } 

.foto_thumb { float: left; margin: 10px; margin-left: 0;  }
.foto_thumb img { border: 1px solid #333; padding: 4px; width: 150px; height: 100px; display: block; margin-bottom: 5px; } 

.QOverlay { z-index: 9; position: absolute; top: 0px; left: 0px; }
.QLoader { z-index: 9; width: 960px; background-color: #f69220; z-index: 999; position: absolute; top: 0px; left: 0px;  }

/* form */

form { margin: 20px; border: 1px solid #222; background-color: #000; padding: 40px; padding-top: 20px; }
input, textarea { border: 0; padding: 6px; margin-top: 10px; font-family: arial; font-size: 13px; background-color: #ccc; color: #000; border: 0; background-image: url("../images/input.jpg"); background-repeat: no-repeat; } 
textarea { width: 320px; }
.button { cursor: pointer; width: 230px; height: 60px; background-color: #F78F19; color: #000; font-weight: bold; padding: 10px; font-size: 17px; background-image: url("../images/submit.jpg"); background-repeat: no-repeat; }
.button:hover { background-position: 0px -60px; }
#datepicker_datum { width: 70px; background-image: url("../images/datepicker_input.jpg"); background-repeat: no-repeat; padding-left: 45px; cursor: pointer;  }
.mandatoryfield {  }

/* lists */
#text ul { margin-top: 15px; }
#text ul li { background-image: url("../images/bull.png"); background-repeat: no-repeat; padding-bottom: 5px; padding-left: 20px; color: #9ECB62; }


/* date picker */
#ui-datepicker-div { z-index: 666 }
