* {
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
}

/* .font_chelsea {font-family:'Chelsea Market', cursive;} */
/* .font_opensans {font-family:'Open Sans', sans-serif;} */

.font_chelsea {font-family: 'Karla', sans-serif;}
.font_tech {font-family: 'Share Tech', sans-serif;}

/*body  {font-family:'Chelsea Market', cursive; font-size:14px; line-height:16px;}*/
body  {font-family: 'Karla', sans-serif; font-size:14px; line-height:16px;}
/*
body  {font-family:'Open Sans', sans-serif;}
body {
	background-image:url(../images/iface/bg_40jaar.png);
	background-position:center top;
	background-repeat:no-repeat;
}
*/
body  {visibility:hidden;}

/* bootstrap adjustments */
.modal-header {color:#ffffff !important; background-color:#FF8000;}
legend {color:green; border-color:#CCE6CC;}
label, form {font-size:14px;}
input, button, textarea {font-family: 'Karla', sans-serif;}
input[type=text], input[type=password] {height:30px;}
.popover {z-index:1030;}
.table A, .table A:hover {text-decoration:none;}
.table th, .table td {text-align:left;}
.dropdown-menu {min-width:0px;}


input::-webkit-input-placeholder { /* WebKit browsers */
	color:    #d0d0d0;
}
input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #d0d0d0;
   opacity:  1;
  }
input::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #d0d0d0;
   opacity:  1;
 }
input:-ms-input-placeholder { /* Internet Explorer 10+ */
   color:    #d0d0d0;
 }
 
 b {font-weight:bold;}

[type="search"] {
        -moz-appearance:    textfield;
        -webkit-appearance: textfield;
        appearance: textfield;
    }

/* misc */
.fullheight {height:100%;}
.text_darkred {color:maroon;}
.text_orange {color:#FE4A08;}
.text_cyanblue {color:#4BB2C9;}
.help-inline {font-size:10px;}
.h3-smaller {font-size:18px; font-weight:bold; line-height:24px;}
.littlebit_margintop {margin-top:8px;}
.extra_margintop {margin-top:20px;}
.lotof_margintop {margin-top:40px;}
.modal_icon {font-size:60px;}
.modalyesno_text_adjusted {position:relative; top:24px;}

.infoblock {line-height:26px;}
.infoblock ol {list-style-type:decimal;}
.infoblock ol li {margin-left:4px;}
.infoblock ul {list-style-type:none; padding:0px; margin:0px;}
.infoblock ul li {background-image:url(../images/iface/arrow_blue_right.gif); background-repeat:no-repeat; background-position: 2px 6px; margin:0px 0px 0px 5px; padding:3px 5px 3px 17px;}

.infosquare_2xY {position:relative; overflow:hidden; padding:0px 0px 43px 0px;}
.infosquare_2xY .readmore_button {position:absolute; right:10px; bottom:10px;}
.infosquare_2xY .topimage {display:block; height:228px;}
.infosquare_2xY .topimage IMG {height:228px; width:100%;}
.infosquare_2xY .infoblock {overflow-x:hidden; overflow-y:auto;}
.infosquare_2xY .infoblock H3, .infosquare_2xY .infoblock P {margin:0px 10px 0px 0px;}
.infosquare_2xY .infoblock .h3-smaller {font-size:18px; font-weight:bold; padding:5px 0px 5px 0px; margin:0px 10px 0px 0px;}
.infosquare_2xY.noreadmorebutton {padding-bottom:0px !important;}

.topbar {min-height:1px; color:white; padding:0px 0px 0px 0px;}
.topbar .tiobutton {text-align:center; position:relative; top:-6px;}
.topbar .tiobutton h5 {line-height:0px; padding:10px 0px 0px 0px; letter-spacing:1.3px;}
.topbar A.nofx {color:inherit;}
.topbar A.nofx:hover {font-weight:bold;}

.topmenu {text-align:center; font-size:18px; letter-spacing:1.0px; text-transform:uppercase; color:#c0c0c0;text-align:right; padding:13px 0px 10px 0px; position:relative; top:3px;}
.topmenu A {text-decoration:none; color:#FE4A08; margin-left:20px;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
}
.topmenu A:hover {color:#4BB2C9;
	-webkit-transition: none;
	-moz-transition: none;
	-o-transition: none;
	-ms-transition: none;
	transition: none;
}
.topmenu A.selected {color:#0AD13C; text-shadow:0px 0px 12px #00ff00;
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
}

.tiotoppage {margin-top:45px; margin-bottom:30px;}
.tiotoppage .tioheader {margin:10px 0px 80px 0px;}
.tiotoppage .tioheader .robot, .tiotoppage .tioheader {position:relative;}
.tiotoppage .tioheader .robot IMG {width:300px; height:280px; position:absolute; left:0px; top:0px; z-index:55; border:none;}

.tiotoppage .tioheader .slogan {font-size:67px; letter-spacing:2px; position:absolute; top:20px; right:0px; text-shadow:4px 4px 5px #cccccc;}

.tiotoppage .tioheader .carrouselandfooter {position:relative; top:70px;}
.tiotoppage .tioheader .carrouselandfooter .tiocarrousel .tioslide {position:relative; border-radius:4px;}
.tiotoppage .tioheader .carrouselandfooter .tiocarrousel .tioslide IMG {width:700px; height:214px; border-radius:4px;}

.bottombar {background-color:#e0e0e0; color:#888888;}
.bottombar .text {padding:12px 0px 12px 0px;}
.bottombar .text A {text-decoration:none; color:#FF8000; font-size:12px;}
.bottombar .text A:hover {color:#ffffff;}
.bottombar .text A.selected {color:#0AD13C;}

.blockbutton_gradient {
	background: -moz-linear-gradient(top,  rgba(242,242,242,1) 0%, rgba(226,226,226,0.74) 32%, rgba(219,219,219,0.4) 75%, rgba(255,255,255,0.2) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(242,242,242,1)), color-stop(32%,rgba(226,226,226,0.74)), color-stop(75%,rgba(219,219,219,0.4)), color-stop(100%,rgba(255,255,255,0.2))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(242,242,242,1) 0%,rgba(226,226,226,0.74) 32%,rgba(219,219,219,0.4) 75%,rgba(255,255,255,0.2) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(242,242,242,1) 0%,rgba(226,226,226,0.74) 32%,rgba(219,219,219,0.4) 75%,rgba(255,255,255,0.2) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(242,242,242,1) 0%,rgba(226,226,226,0.74) 32%,rgba(219,219,219,0.4) 75%,rgba(255,255,255,0.2) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(242,242,242,1) 0%,rgba(226,226,226,0.74) 32%,rgba(219,219,219,0.4) 75%,rgba(255,255,255,0.2) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#33ffffff',GradientType=0 ); /* IE6-9 */
}
.blockbutton {height:252px; padding-top:6px; text-align:center; border:#FE4A08 3px solid; border-radius:5px; position:relative;}
/* .blockbutton .icon {height:100px; margin:0px auto;}
.blockbutton .icon IMG {height:100px;} */
.blockbutton .icon {height:100px; width:214px; position:absolute;}
.blockbutton .icon IMG {height:100%; width:100%;}
.blockbutton .title {overflow:hidden; font-size:24px; line-height:24px; font-weight:bold; letter-spacing:0.4px; text-transform:uppercase; position:relative; top:80px; margin-top:24px;}
.blockbutton .desc {padding:0px 12px; font-size:20px; line-height:22px; color:#666666; position:relative; top:90px; }
.blockbutton A {color:inherit;}
.blockbutton A:hover {text-decoration:none;}
.blockbutton .icon.explode {width:250px; height:117px; left:-18px; top:-9px;}

.minipartners {width:600px; margin:0px auto 40px auto;}
.minipartners .minipartner {display:inline-block; width:80px; height:80px; overflow:hidden; border:rgb(128,128,128,0) 1px solid; margin-right:20px;}
.minipartners .minipartner .tooltip {font-size:14px; line-height:20px;}
.minipartners .minipartner:nth-last-child(1) {margin-right:0px;}
.minipartners .minipartner IMG {width:78px; height:78px;}

.maxipartners {margin:40px auto 80px auto;}
.maxipartners .maxipartner {display:inline-block; height:82px; overflow:hidden; border:rgb(128,128,128,0) 1px solid; margin-right:16px;}
.maxipartners .maxipartner .tooltip {font-size:14px; line-height:20px;}
.maxipartners .maxipartner:nth-last-child(1) {margin-right:0px;}
.maxipartners .maxipartner IMG {height:70px;}

.coderdojo.logo {text-align:center}
.coderdojo .head {width:100%; text-align:center}
.coderdojo .head .headsup {margin:auto; max-width:100%; border:#FF8000 1px solid;}
.coderdojo .head .headsup IMG {width:100%}
.coderdojo .head .headsup .text {margin:2px 5px 2px 5px; text-align:left; font-size:18px; line-height:24px;}
.coderdojo .head .headsup .text .header {font-size:28px; font-weight:bold; color:rgb(146, 5, 0); text-align:center; margin:15px;}

.subpage .image {width:380px; text-align:right;}
.subpage .image.lift {position:relative; top:-30px;}
.subpage .image IMG {width:340px;}
.subpage .title {overflow:hidden; letter-spacing:1px; text-transform:uppercase; color:darkgreen;}
.subpage .desc {font-size:18px; line-height:26px; color:#444444;}
.subpage .desc p {margin-bottom:20px;}
.subpage .bedrijf {position:relative; height:220px; width:220px;}
.subpage .bedrijf IMG {width:218px; height:218px;}
.subpage .bedrijf .naam {position:absolute; width:218px; left:0px; bottom:1px; background-color:rgba(0,64,0, 0.8); color:white; padding:10px 4px; text-align:center;}

.inputcomment {margin-left:6px; font-size:12px;}

.schoolcontactformulier {border:#000000 1px solid;}
.schoolcontactformulier .formcontrols {padding:8px 16px;}
.schoolcontactformulier .bottombuttons {text-align:right; margin-bottom:0px; margin-top:0px;}
.schoolcontactformulier legend {border:0px;}
.schoolcontactformulier .redlegend {color:red !important; border-color:#ffe0e0;}
.schoolcontactformulier .vraag {font-size:16px;}

.technieklokaalformulier {border:#000000 1px solid;}
.technieklokaalformulier .formcontrols {padding:8px 16px;}
.technieklokaalformulier .bottombuttons {text-align:right; margin-bottom:0px; margin-top:0px;}
.technieklokaalformulier legend {border:0px;}
.technieklokaalformulier .redlegend {color:red !important; border-color:#ffe0e0;}
.technieklokaalformulier .vraag {font-size:16px;}

.spotlight .title {font-size:24px; line-height:30px; padding:10px 0px; margin-bottom:20px;}
.spotlight .bulb {font-size:24px; line-height:30px; width:220px;}
.spotlight .bulb IMG {width:220px;}
.spotlight .worker {width:220px; height:330px; position:relative;}
.spotlight .worker IMG {width:218px; height:328px;}
.spotlight .worker .naam {position:absolute; width:218px; left:0px; bottom:0px; background-color:rgba(0,64,0, 0.7); color:white; padding:6px 4px; text-align:center;}

.videoplayer {width:100%; margin:auto;}
.videoplayer video {width:100%;}
.videoplayer .caption {margin-top:6px;}
