html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td
{ margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after,
q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }
body { font: 12px/21px Arial,Helvetica, Geneva, SunSans-Regular, sans-serif; background: #b6cbfb url(../images/background-storm-academy.jpg) top center no-repeat; color: #222; }
a:link, a:visited,
a:active { color: #48c1ec; text-decoration: none; }
a:hover { color: #F8A441; text-decoration: underline; }
b, strong { color: #222; }
p { margin-bottom: 14px; }
hr { border: 0px; border-top: 1px dashed #ccc; color: #fff; background-color: #fff; height: 1px; }
th,td { padding: 2px 4px; text-align: left; }
h1, h2 { font-family: georgia; font-weight: normal; }
h1 { font-size: 23px; color: #666; padding-bottom: 10px; margin-bottom: 10px; }
h2 { font-size: 22px; color: #48c1ec; padding-bottom: 4px; font-weight: normal; }
#page { margin: 0 auto; width: 1026px; height: 100%; min-width: 1000px; }
#wrapper { float: left; width: 1026px; background: url(../images/page.png) repeat-y; margin-bottom: 50px; border-bottom: 2px solid #b5bfd5; }
#container { float: left; width: 970px; display: inline; margin-left: 33px; }
#header { float: left; width: 970px; }
#logo { float: left; width: 247px; height: 89px; }
#login { float: right; width: 187px; height: 24px; padding-top: 2px; margin-right: 3px; text-align: center; display: inline; background: #f8a442; }
#login a { color: #fff; padding: 0px 17px; }
#nav { float: left; width: 697px; padding-left: 26px; margin-top: 41px;}
#nav ul { float: left; padding-left: 0px; list-style: none; }
/* #nav ul li { float: left; padding: 0px 22px 0px 10px; } Orgineel na ontwerp */
#nav ul li { float: left; padding: 0px 42px 0px 10px; }
#nav ul li a:link,
#nav ul li a:visited { font-size: 21px; color: #48c1ec; letter-spacing: -1px; }
#nav ul li a:active,
#nav ul li.selected a { color: #656565; }
#nav ul li a:hover { color: #f9a442; text-decoration: none; }
#bread { float: left; width: 960px; padding-top: 22px; padding-bottom: 25px; padding-left: 10px; color: #cbcbcb; font-size: 9px; }
#left { float: left; width: 246px; }
#left .tab { float: left; width: 246px; height: 42px; padding: 0px; }
#left .form { float: left; width: 246px; background: #48C1EC url(../images/tab-bottom.png) bottom center no-repeat; padding-bottom: 10px; }
#left .button-submit { float: right; }
#right { float: left; width: 684px; height: 382px; display: inline; padding-left: 18px; margin: -7px 0 0px 19px; background: url(../images/trainingen-home-background-trans.png) 0px 3px no-repeat; }
#right .training_link { float: left; padding-top: 10px; padding-left: 10px; font-size: 11px; font-weight: bold; }
/* Trainingen block */
#training_group { float: left; width: 513px; position: relative; line-height: 14px; }
#training_group h1 { padding-top: 33px; padding-bottom: 30px; padding-left: 30px; font-size: 24px; }
#training_group .training { position: relative; float: left; width: 107px; padding: 0px 25px; height: 120px; font-size: 11px; text-align: center; margin-bottom: 30px; border-left: 1px dashed #ccc; }
#training_group .first { position: relative; float: left; width: 108px; padding: 0px 25px; height: 100px; font-size: 11px; text-align: center; margin-bottom: 30px; display: inline; }
#training_group .next { position: absolute; top: 78px; left: 120px; }
#training_group .image { float: left; width: 107px; height: 65px; padding-bottom: 5px; }
/* Trainingen rechts */
#marketing_group { float: left; position: relative; width: 155px; font-size: 11px; }
#marketing_group h2 { color: #48c1ec; font-size: 11px; font-weight: bold; padding-top: 12px; padding-bottom: 25px; }
#marketing_group li { font-size: 9px; font-weight: bold;}
#marketing_group .label { position: absolute; top: 144px; left: 3px; }
/* Connect blocks */
#connect { float: left; width: 970px; height: 24px; border-bottom: 1px dashed #ccc; padding-top: 46px; padding-left: 5px; margin-bottom: 46px; }
#connect .twitter { float: left; }
#connect .call { float: left; padding-left: 250px; }
#connect .mail { float: right; padding-right: 6px; margin-top: -9px; }
#search { float: left; position: absolute; top: 194px; left: 9px; width: 358px; height: 32px; background: url(../images/search-field-trans.png) top center no-repeat; }
#search img { position: absolute; top: -9px; left: 360px; }
/* Footer blocks */
#blocks { float: left; width: 970px; border-top: 0px solid #f00; margin-top: 52px; padding-left: 17px; }
#blocks .block { float: left; width: 293px; padding-right: 30px; font-family: georgia; color: #999; border-top: 0px solid #0f0; }
#blocks .block h2,
#blocks .agenda h2 { font-size: 14px; margin-top: 4px; color: #666; }
#blocks .block h3 { font-size: 22px; margin-top: 8px; margin-bottom: 8px; font-family: georgia; font-weight: normal; padding-left: 20px; color: #48c1ec; background: url(../images/arrow-title-next-trans.jpg) 0px 2px no-repeat; }
#blocks .agenda { float: left; width: 263px; padding-left: 30px; padding-right: 30px; font-family: georgia; color: #999; border-bottom: 0px solid #0f0; }
#blocks .agenda li { font-size: 11px; }
#blocks .rating { float: left; width: 70px; height: 16px; border-bottom: 0px solid #f00; margin-top: -23px; position: relative; left: 110px; }
#blocks img { float:left; }
#blocks p { margin-bottom:0; }
#datepicker { float: left; height: 250px; }
#datepickerTrainingen { float: left; }
#datepickerTrainingen b { color: #999; }
#other_trainingen li { float: left; color: #999; width: 246px; padding: 4px 0px; border-bottom: 1px dashed #ccc; }
#other_trainingen ul { float: left; padding: 15px 0px; }
#other_trainingen li a { color: #656565; }
#other_trainingen li a { color: #656565; }
#other_trainingen li.active a { color: #48c1ec; }
/* Referentie en partners */
#reference { float: left; width: 970px; }
#reference .tab { float: left; width: 970px; margin-bottom: -1px; border-bottom: 1px dashed #ccc; }
#reference .partner { float: left; width: 295px; padding: 50px 0px; border-right: 1px dashed #ccc; }
#reference .partner img { float: left; padding-left: 35px; }
#reference .references { float: left; width: 674px; padding: 80px 0px 20px; }
#reference .references img { float: left; padding-left: 35px; }
#content ul { list-style: none; margin-left: 0px; margin-bottom: 0px; font-size: 12px; }
#content ul li { list-style: none; padding: 3px 10px; background: url(../images/bullet.png) 0 12px no-repeat; }
#left .form { position: relative; }
#left dd { position: relative; height: 40px; padding: 0 10px; background: url(../images/input_bottom.png) no-repeat bottom center; }
#left dd input { width:196px; padding: 11px 10px 12px 20px; background:#48C1EC; border:0; color:#fff; font-size:12px; }
#left .validation { position:absolute; left:215px; top:0; width:4px; height:19px; padding:10px 10px 10px 6px; color:#fff; background:#FFBE41; cursor:pointer; }
#left .validationPopup { display:none; position:absolute; left:69px; top:0px; padding:11px; width:124px; height:21px; color:#fff; background:#FFBE41; }
#left .dd_last { background:none; }
#left .dd_button { position:absolute; left:92px; top:176px; width:154px; height:50px; background:none; padding:0; }
#left .contactform_submit { background:url(../images/button-verzenden-trans.png); float: right; width:154px; height:50px; text-indent:-9999px; cursor:pointer; line-height:0; }
#left .bedankt { padding:10px; color:#fff; }
/* Font-face */
@font-face { font-family: MyCustomFont; src: url("../font/qtypesquarebook.eot") /* EOT file for IE */ }
@font-face { font-family: MyCustomFont; src: url("../font/QTypeSquare-Book.otf") /* TTF file for CSS3 browsers */ }
#nav, h1,
#blocks h2,
#left .tab h3 { font-family: MyCustomFont; }
/*
* jQuery UI CSS Framework
* Copyright (c) 2010 AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT (MIT-LICENSE.txt) and GPL (GPL-LICENSE.txt) licenses.
*/
/* Layout helpers
----------------------------------*/
.ui-helper-hidden { display: none; }
.ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.ui-helper-clearfix { display: inline-block; }
/* required comment for clearfix to work in Opera \*/
* html .ui-helper-clearfix { height:1%; }
.ui-helper-clearfix { display:block; }
/* end clearfix */
.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }
/* Interaction Cues
----------------------------------*/
.ui-state-disabled { cursor: default !important; }
/* Misc visuals
----------------------------------*/
/* Overlays */
.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
/* Button
----------------------------------*/
.ui-button { display: inline-block; position: relative; padding: 0; margin-right: .1em; text-decoration: none !important; cursor: pointer; text-align: center; zoom: 1; overflow: visible; } /* the overflow property removes extra width in IE */
.ui-button-icon-only { width: 2.2em; } /* to make room for the icon, a width needs to be set here */
button.ui-button-icon-only { width: 2.4em; } /* button elements seem to need a little more width */
.ui-button-icons-only { width: 3.4em; }
button.ui-button-icons-only { width: 3.7em; }
/*button text element */
.ui-button .ui-button-text { display: block; line-height: 1.4; }
.ui-button-text-only .ui-button-text { padding: .4em 1em; }
.ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: .4em; text-indent: -9999999px; }
.ui-button-text-icon .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 1em .4em 2.1em; }
.ui-button-text-icons .ui-button-text { padding-left: 2.1em; padding-right: 2.1em; }
/* no icon support for input elements, provide padding by default */
input.ui-button { padding: .4em 1em; }
/*button icon element(s) */
.ui-button-icon-only .ui-icon, .ui-button-text-icon .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; }
.ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; }
.ui-button-text-icon .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: .5em; }
.ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; }
/*button sets*/
.ui-buttonset { margin-right: 7px; }
.ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em; }
/* workarounds */
button.ui-button::-moz-focus-inner { border: 0; padding: 0; } /* reset extra padding in Firefox */
/* Datepicker
----------------------------------*/
.ui-datepicker { width: 17em; padding: .2em .2em 0; }
.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 1px; cursor: pointer; width: 1.8em; height: 1.8em; }
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
.ui-datepicker .ui-datepicker-prev { left:1px; background: url(../images/arrow-title-back-trans.jpg) no-repeat; }
.ui-datepicker .ui-datepicker-next { right:1px; background: url(../images/arrow-title-next-trans.jpg) no-repeat; }
.ui-datepicker .ui-datepicker-prev-hover { left:1px; background: url(../images/arrow-title-back-trans.jpg) no-repeat; }
.ui-datepicker .ui-datepicker-next-hover { right:1px; background: url(../images/arrow-title-next-trans.jpg) no-repeat; }
.ui-datepicker .ui-datepicker-prev span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; }
.ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; }
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }
.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year { width: 49%;}
.ui-datepicker table { font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
.ui-datepicker th { line-height: 25px; padding: .7em .3em; text-align: center; font-weight: bold; border: 0; width: 40px; height: 30px; font-family: Georgia, Times New Roman Times, Serif; font-size: 11px; }
.ui-datepicker td { line-height: 22px; border: 0; border-right: 0px dashed #aaa; padding: 0px; width: 40px; height: 22px; font-family: Georgia, Times New Roman Times, Serif; font-size: 11px; }
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }
/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi { width:auto; }
.ui-datepicker-multi .ui-datepicker-group { float:left; }
.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; }
.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; }
.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; }
.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; }
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; }
.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; }
.ui-datepicker-row-break { clear:both; width:100%; }
/* RTL support */
.ui-datepicker-rtl { direction: rtl; }
.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }
.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }
.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; }
.ui-datepicker-rtl .ui-datepicker-group { float:right; }
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
.ui-datepicker-cover {
display: none; /*sorry for IE5*/
display/**/: block; /*sorry for IE5*/
position: absolute; /*must have*/
z-index: -1; /*must have*/
filter: mask(); /*must have*/
top: -4px; /*must have*/
left: -4px; /*must have*/
width: 200px; /*must have*/
height: 200px; /*must have*/
}
/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default { text-align: center; border-right: 1px dashed #aaa/*{borderColorDefault}*/; background: #fff/*{bgColorDefault}*/; font-weight: normal/*{fwDefault}*/; color: #000/*{fcDefault}*/; }
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #555555/*{fcDefault}*/; text-decoration: none; }
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus { border-right: 0px dashed #aaa/*{borderColorHover}*/; background-color: #fff/*{bgColorHover}*/; font-weight: normal/*{fwDefault}*/; color: #000/*{fcHover}*/; }
.ui-state-hover a, .ui-state-hover a:hover { color: #212121/*{fcHover}*/; text-decoration: none; }
.ui-state-active, .ui-widget-content .ui-state-active { border-right: 0px dashed #aaa/*{borderColorActive}*/; background-color: #fff/*{bgColorActive}*/; font-weight: normal/*{fwDefault}*/; color: #000/*{fcActive}*/; }
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #212121/*{fcActive}*/; text-decoration: none; }
.ui-widget :active { outline: none; }
.ui-state-hover { border-right-width: 0px; }
.ui-widget-content .ui-datepicker-week-end .ui-state-default { background-color: #ccc; border: 0px solid #eee; border-right: 1px dashed #aaa; }
.ui-state-disabled, .ui-widget-content .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }
/**
* Header
*/
.ui-datepicker-buttonpane { display: none; }
.ui-widget-content { border: 0px; }
.ui-widget-header { background: none; border: 0px; font-family: Georgia, Times New Roman Times, Serif; color: #48C1EC; font-weight: bold; }
.ui-widget-content .ui-datepicker-week-end .ui-state-default { border: 1px solid #ccc; border-collapse: collapse; }
.ui-datepicker-selectable .ui-state-default { border: 1px solid #FFBE40; border-collapse: collapse; }
.ui-datepicker-unselectable .ui-state-default { border: 1px solid #fff; border-right: 1px dashed #aaa; border-collapse: collapse; }