/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Dec 19, 2016, 3:50:00 PM
    Author     : Leetsj
*/

html, body {
    font-family: maiandra;
    font-size: 0.9em;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0;
    background-color: #A4CCCD;
}

h3 {
    color: #204F57;
    font-size: 1em;
}

b {
    color: #204F57;
}

a:link {
    color: #008A8A;
}

a:visited {
    color: #008A8A;
}

a:hover {
    color: #204F57;
}

a:active {
    color: #204F57;
}

@font-face {
    font-family: maiandra;
    src: url('/web/font/Maiandra.ttf');
}

.ui-widget {
    font-family: maiandra;
    font-size: 0.9em;
}

.ui-button {
    padding: 0.4em 0.6em;
}

.ui-corner-all {
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
}

.ui-dialog {
    z-index: 100000;
}

/* new clearfix */
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
    }
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

.page {
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background: url(/web/img/background.png) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.scrollpage {
    position: absolute;
    top: 50px;
    height: 583px;
    width: 630px;
    margin: 0 auto;
    background-color:rgba(255, 255, 255, 1);
    overflow: hidden;
    border: 1px solid #008A8A;
}

.container {
    position: relative;
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
}

.checkbox-container {
    position: relative;
    float: left;
    width: 100%;
    height: fit-content;
}

.checkbox-container label {
    position: relative;
    float: left;
    width: 340px;
}

.checkbox-time {
    position: relative;
    float: left;
    width: 65px;
}

.checkbox-time label {
    width: auto !important;
}

.checkbox-time input {
    position: relative;
    float: left;
}

.input-container {
    position:relative;
    float: left;
    width:100%;
    padding-bottom: 2px;
}

.input-container label {
    position: relative;
    float: left;
    display: inline-block;
    width: 25%;
}

.input-container input {
    width: 70%;
}

.input-container textarea {
    width: 70%;
    height: 60px;
}

#registration_form {
    height: 340px;
    overflow-x: hidden;
    overflow-y: scroll;
}

/* pages */

.page-content {
    display: block;
    position: relative;
    float: left;
    width: 440px;
    height: 100%;
    padding: 10px;
    overflow: hidden;
}

#page_1_left {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/welkom_rechts.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

#page_1_right {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/welkom_links.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

#page_2_left {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/informatie_rechts.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

#page_2_right {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/informatie_links.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

#page_3_left {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/kleding_rechts.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

#page_3_right {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/kleding_links.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

#page_4_left {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/blijven-slapen_rechts.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

#page_4_right {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/blijven-slapen_links.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

#page_5_left {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/aanmelden_rechts.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

#page_5_right {
    display: block;
    position: relative;
    float: left;
    width: 85px;
    height: 100%;
    background-image: url('/web/img/aanmelden_links.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 85px 100%;
}

.goto_page_1 {
    cursor: pointer;
}

.goto_page_2 {
    cursor: pointer;
}

.goto_page_3 {
    cursor: pointer;
}

.goto_page_4 {
    cursor: pointer;
}

.goto_page_5 {
    cursor: pointer;
}