/* ==========================================================================
 * HTML5 display definitions
 * ========================================================================== */
/* Corrects `block` display not defined in IE 8/9. */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary {
  display: block;
}

/* Addresses styling for `hidden` attribute not present in IE 8/9. */
[hidden] {
  display: none;
}

/* ==========================================================================
 * Base
 * ========================================================================== */
/* 
 * Prevents iOS text size adjust after orientation change, without disabling
 *    user zoom. */
html {
  -webkit-text-size-adjust: 100%;
  /* 2 */
  -ms-text-size-adjust: 100%;
  /* 2 */
}

/* ==========================================================================
 * Links
 * ========================================================================== */
/* Addresses `outline` inconsistency between Chrome and other browsers. */
a:focus {
  outline: none;
}
a:active, a:hover {
  outline: 0;
}

/* Improves readability when focused and also mouse hovered in all browsers. */
/* ==========================================================================
 * Typography
 * ========================================================================== */


/* Prevents `sub` and `sup` affecting `line-height` in all browsers. */
sub {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
  top: -0.5em;
}

sub {
  bottom: -0.25em;
}

/* ==========================================================================
 * Embedded content
 * ========================================================================== */
/* Removes border when inside `a` element in IE 8/9. */
img {
  border: 0;
}

/* Corrects overflow displayed oddly in IE 9. */
svg:not(:root) {
  overflow: hidden;
}

/* ==========================================================================
 * Figures
 * ========================================================================== */
/* Addresses margin not present in IE 8/9 and Safari 5. */
figure {
  margin: 0;
}

/* ==========================================================================
 * Forms
 * ========================================================================== */
/* Define consistent border, margin, and padding. */
fieldset {
  border: 1px solid silver;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/* 1. Corrects color not being inherited in IE 8/9.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets. */
legend {
  border: 0;
  /* 1 */
  padding: 0;
  /* 2 */
}

/* 1. Corrects font family not being inherited in all browsers.
 * 2. Corrects font size not being inherited in all browsers.
 * 3. Addresses margins set differently in Firefox 4+, Safari 5, and Chrome */
button, input, select, textarea {
  font-family: inherit;
  /* 1 */
  font-size: 100%;
  /* 2 */
  margin: 0;
  /* 3 */
}

/* Addresses Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet. */
button, input {
  line-height: normal;
}

/* 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Corrects inability to style clickable `input` types in iOS.
 * 3. Improves usability and consistency of cursor style between image-type
 *    `input` and others. */
button, html input[type="button"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

input[type="reset"], input[type="submit"] {
  -webkit-appearance: button;
  /* 2 */
  cursor: pointer;
  /* 3 */
}

/* Re-set default cursor for disabled elements. */
button[disabled] {
  cursor: default;
}

input[disabled] {
  cursor: default;
}
input[type="search"] {
  -webkit-appearance: textfield;
  /* 1 */
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  /* 2 */
  box-sizing: content-box;
}
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/* 1. Addresses box sizing set to `content-box` in IE 8/9.
 * 2. Removes excess padding in IE 8/9. */
/* 1. Addresses `appearance` set to `searchfield` in Safari 5 and Chrome.
 * 2. Addresses `box-sizing` set to `border-box` in Safari 5 and Chrome
 *    (include `-moz` to future-proof). */
/* Removes inner padding and search cancel button in Safari 5 and Chrome
 * on OS X. */
/* Removes inner padding and border in Firefox 4+. */
button::-moz-focus-inner, input::-moz-focus-inner {
  border: 0;
  padding: 0;
}

/* 1. Removes default vertical scrollbar in IE 8/9.
 * 2. Improves readability and alignment in all browsers. */
textarea {
  overflow: auto;
  /* 1 */
  vertical-align: top;
  /* 2 */
}

/* ==========================================================================
 * Tables
 * ========================================================================== */
/* Remove most spacing between table cells. */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

body {
    margin:0px;
    padding-top:46px;
    font-family: Roboto Slab Regular, Cambria, Arial;
    font-size:15px;
    color:#444444;
}


@font-face
{
    font-family: "Roboto Slab Regular";
    src: url("/Font/RobotoSlab-Regular.ttf") format("truetype");
}
@font-face
{
    font-family: "Roboto Slab Bold";
    src: url("/Font/RobotoSlab-Bold.ttf") format("truetype");
}
@font-face
{
    font-family: "Itch Social";
    src: url("/Font/itch-social-icons.ttf") format("truetype");
}


#pages
{
    padding-top:600px;
}
.mid
{
	width: 1020px;
	margin-left: auto;
	margin-right: auto;
}

.mid-hdr
{
    text-align: center;
}

.left
{
    float: left;
}
.right
{
    float: right;
}
.clear
{
    clear:both;
}

.hdr
{
    z-index:999999;
    position:fixed;
    width:100%;
    top:0;
    left:0;
    background-color:#30AEC0;
    box-shadow: 0px 4px 10px 0px #999999;
}

#hdr_menu
{
    height:35px;
}
.menufill
{
	width: 990px;
    height:100%;
    padding-top:12px;
    padding-left:30px;
}

.footer
{
    height:30px;
    background-color:#30AEC0;
    padding-top:40px;
    padding-bottom:40px;
    vertical-align:middle;
    font-size:15px;
    color:#F3F3E7;
    width:100%;
	min-width: 1020px;
    /*margin-bottom:40px;*/
}

.footer-mid
{
	width: 1020px;
    padding-left:40px;
	margin-left: auto;
	margin-right: auto;
}

.footer-logo
{
    font-family:Itch Social;
    font-size:40px;
    margin-right:10px;
}

.footer-text
{
    padding-top:14px;
}


.footer-social
{
    font-family:Itch Social;
    float:right;
    font-size:40px;
    /*letter-spacing:10px;*/
}

.footer a
{
    text-decoration:none;
    color:inherit;
    display:inline;
}

#home_payoff
{
    display:none;
}

nav a
{
    color:#F5F5EA;
    text-decoration:none;
    font-size:15px;
    padding:4px 6px;
    margin:4px 10px;
    height:20px;
}

.navactive
{
    color:#30AEC0;
    /*display:inline-block;*/
    background-color:#F5F5EA;
    /*padding:4px 8px;*/
    border-radius: 4px 4px 4px 4px;
}
/*@media screen{
  div.fixedhdr{
   position:fixed;
  }
 }*/

#home
{
    height: 600px;position:fixed;z-index:-1;
    width:100%;
    background-image:url(../Images/bghome.jpg);
    background-size:100%;
    background-repeat:no-repeat;
    text-align: center;
    color: #30AEC0; font-size: 26px;
    padding-top: 8%;
}

#content
{
}

.page
{
	min-width: 1020px;
    padding-top:40px;
}

.pgcontent
{
    padding-right:120px;
    line-height:28px;
}

h1
{
    color:#ffbf00;
    /*border-top:1px solid #ffbf00;
    border-bottom:1px solid #ffbf00;*/
    font-family:Roboto Slab Bold;
    font-size:50px;
    padding:10px 0px;
    display:inline-block;
    border-top:1px solid #ffbf00;
    border-bottom:1px solid #ffbf00;
}

.subhdr
{
    font-style: italic;
}

.msg-feedback
{
    margin-top:20px;
    /*color:#ffbf00;*/
    font-size:18px;
    font-weight:bold;
    padding:10px 0px;
    display:inline-block;
    border-top:1px solid #ffbf00;
    border-bottom:1px solid #ffbf00;
}

.tb_big
{
    /*color:gray;*/
    height:50px;
    /*background-color: rgba(255, 255, 255, 0.8);*/
    border: 1px solid #BABABA;
    color: #999999; 
    /*font-family: "Segoe UI","Segoe UI Web Regular","Segoe UI Symbol","Helvetica Neue","BBAlpha Sans","S60 Sans",Arial,"sans-serif";*/ 
    font-size: 24px;
    padding: 8px 8px;
    border-radius: 4px 4px 4px 4px;
    width:450px;
}

.werk-img
{
}

#img_the_web
{
    height:350px;
}

#img_interactief
{
    width:400px;
}

#img_back
{
    padding-top:50px;
    height:400px;
}

#img_pv
{
    /*width:400px;*/
}


#SaveForm textarea
{
    /*font-family:Arial;*/
    height:100px;
}

.submit
{
    display:inline-block;
    background-color:#ffbf00;
    height:50px;
    width:470px;
    color:white;
    padding-top:10px;
    text-align:center;
    text-shadow:1px 1px #999999;
    font-family:Roboto Slab Bold;
    font-size: 26px;
    text-decoration:none;
    border-radius: 4px 4px 4px 4px;
}

#block1
{
    background-color:#F0F0E1;height: 800px;
}

    #block1 .block-img
    {
        float:left;
        /*width:424px;*/
    }
    #block1 .block-txt
    {
        float:right;
        width:400px;
    }


#block2
{
    background-color:#F5F5EA;
    min-height: 600px;
}

    #block2 .block-img
    {
        float:left;
        width:424px;
        text-align:center;
    }

    #block2 .block-txt
    {
        float:left;
        width:450px;
    }

#block3
{
    background-color:#F0F0E1;
    min-height: 600px;
}

    #block3 .block-img
    {
        float:left;
        width:424px;
        text-align:center;
        padding-top:75px;
    }

    #block3 .block-txt
    {
        float:left;
        width:450px;
    }

#block4
{
    background-color:#F5F5EA;
    min-height: 800px;
}


#formholder
{
    margin-top: 30px;
}

#SaveForm div
{margin: 10px;
}

#contact_info
{
    margin-top:90px;color:#999999;padding-left:165px;font-size:15px;line-height:22px;padding-bottom:20px;
}
.contact-info-col
{
    float:left;width:230px;
}

.contact-info-col-left
{
    text-align:left;
}
.contact-info-col-mid
{
    text-align:center;

}
.contact-info-right
{
    text-align:right;
}
.contact-info-bold
{
    font-weight:bold;
}
#contact_info a, .block-txt a
{
    text-decoration:none;
    color:inherit;
}
#contact_info a:hover, .block-txt a:hover
{
    text-decoration:underline;
}
/*..flex-direction-nav .flex-next {
  background-position: 0 -980px;
  height: 59px;
  width: 36px;
}
 .flex-direction-nav .flex-prev {
  background-position: 0 -921px;
  height: 59px;
  width: 36px;
}*/

 /* ==========================================================================
 * Slider
 * ========================================================================== */
/* jQuery FlexSlider v2.0
 * http://www.woothemes.com/flexslider/
 *
/* Browser Resets */
.flex-container a:active,
.flexslider a:active {outline: none;}
.slides,
.flex-control-nav,
.flex-direction-nav {margin: 0; padding: 0; list-style: none;} 

/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {
    width: 100%; margin: 0; padding: 0;
background-color: inherit;
position: relative; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; border-radius: 5px; zoom: 1;
}

.flexslider .slides > li {position: relative; display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flex-pauseplay span {text-transform: capitalize;}

/* Clearfix for the .slides element */
.slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} 
html[xmlns] .slides {display: block;} 
* html .slides {height: 1%;}

/* No JavaScript Fallback */
/* If you are not using another script, such as Modernizr, make sure you
 * include js that eliminates this class on page load */
.no-js .slides > li:first-child {display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider .slides {zoom: 1;}
/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */
.flex-container {zoom: 1; position: relative;}

/* Caption style */
/* IE rgba() hack */
/*.flex-caption {background:none; -ms-filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000);
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4C000000,endColorstr=#4C000000); zoom: 1;}
.flex-caption {width: 96%; padding: 2%; position: absolute; left: 0; bottom: 0; background: rgba(0,0,0,.3); color: #fff; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px;}*/

/* Direction Nav */
/*.flex-direction-nav li a {width: 52px; height: 52px; margin: -13px 0 0; display: block; background: url(theme/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; cursor: pointer; text-indent: -9999px;}
.flex-direction-nav li .next {background-position: -52px 0; right: -24px;}
.flex-direction-nav li .prev {left: -17px;}
.flex-direction-nav li .disabled {opacity: .3; filter:alpha(opacity=30); cursor: default;}*/

/* Control Nav */
.flex-control-nav {width: 100%; position: absolute; bottom: -50px; 
                   text-align: center;
}
.flex-control-nav li {margin: 0 0 0 5px; display: inline-block; zoom: 1; *display: inline;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {
    width: 18px; height: 18px; display: block; 
                            /*background: url(theme/bg_control_nav.png) no-repeat 0 0;*/
  -webkit-border-radius: 20px;
  -moz-border-radius: 20px;
  -ms-border-radius: 20px;
  -o-border-radius: 20px;
  border-radius: 20px;
  background-color: #c5c5c5;                             
                        cursor: pointer; text-indent: -9999px;}
/*.flex-control-nav li a:hover {background-position: 0 -13px;}
.flex-control-nav li a.active {background-position: 0 -26px; cursor: default;}*/
.flex-control-nav li a:hover, .flex-control-nav li a.flex-active {
  background-color: #ffbf00;
}