/* =TEXT ************************************************************/
* { margin: 0; }
html, body { height: 100%; }
body { background: url(../img/header-background.jpg) repeat-x; }
body#app { background: url(../img/header-app-background.jpg) repeat-x; }
body, th, td { font-family: helvetica neue, helvetica, arial, sans-serif; color: #484675; font-size: 14px; line-height: 18px; }
p { margin-bottom: 20px; }
h1 { font-size: 30px; margin-bottom: 30px; font-family: "HelveticaNeue-CondensedBlack", "Helvetica Neue Condensed Black", "Helvetica Neue", Helvetica, Arial Black, "Lucida Grande", sans-serif; font-weight: bold; }
h2 { font-size: 18px; margin-bottom: 14px; color: #5a547d; text-shadow: #838383 1px 1px 2px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; }
a { color: #e37e15; text-decoration: underline; }
a:hover { text-decoration: none; }
blockquote { margin-bottom: 20px; font-weight: bold; font-size: 16px; line-height: 20px; border-left: 4px solid #484675; padding-left: 25px; }
strong { font-weight: bold; }
em { font-style: italic; }
.image { padding: 10px; border: 1px solid #cac8c9; background: #fff; box-shadow: 2px 2px 5px #cac8c9; -moz-box-shadow: 2px 2px 5px #cac8c9; -webkit-box-shadow: 2px 2px 5px #cac8c9; }
sup { font-size:9px; vertical-align:top; }
sub { font-size:9px; vertical-align:bottom; }
.content ul { list-style: none outside none; margin-left:1em; padding-left:0; margin: 3px 0 0px 1em;  }
.content ul li { list-style: disc outside none; margin-bottom: 5px; }
.content ol { list-style-type: decimal; margin-left: 1em; padding-left: 0; margin: 0 0 0px 1em; }
.content ol li { list-style-type: decimal; margin: 0 0 5px 5px; }
.ui-state-default, .ui-tabs-nav, .ui-tabs-selected, .ui-state-active { list-style: none !important; list-style-type: none; }
.hidden { display: none; }

/* =LAYOUT **********************************************************/
#container { width: 954px; padding: 0 15px; min-height: 100%; height: auto !important; height: 100%; margin: 0 auto -250px; }
#logo { float: left; width: 205px; margin-right: 150px; height: 84px; background: url(../img/logo.jpg) left no-repeat; }
#logo a { float: left; width: 100%; height: 100%; }
#teaser { float: left; margin-top: 41px; width: 638px; height: 71px; background: url(../img/teaser.gif); }
.content { float: left; padding: 40px 0px; text-align: justify; }
.left { width: 578px; padding-right: 15px; }
.right { width: 346px; padding-left: 15px; }
#app .content { width: 954px; }
.sticky-footer, .push { height: 250px; clear: both; }
#footer-wrapper { width: 100%; min-height: 205px; background-color: #e8e8e8; float: left; }
#copyright-wrapper { width: 100%; height: 45px; background-color: #5a547d; float: left; color: #fff; }
#copyright a { color: #fff; line-height: 45px; }
#footer a:hover { color: #e37e15; }
#footer, #copyright { margin: 0 auto; width: 984px; }
#footer { background: url(../img/footer-background.jpg) no-repeat; min-height: 205px; }
.footer-content { float: left; min-height: 165px; padding: 20px 15px; width: 216px; }
.footer-content p, .footer-content a { color: #838383; }
#copyright #left { text-align: left; width: 477px; float: left; padding-left: 15px; }
#copyright #right { text-align: right; width: 477px; float: left; padding-right: 15px; }

/* =MENUS ***********************************************************/
#menu { float: right; width: 577px; height: 84px; background: url(../img/menu-border.jpg) right no-repeat; }
#menu ul { list-style-type: none; }
#menu a { float: right; width: 113px; height: 84px; text-align: center; font-size: 20px; line-height: 84px; background: url(../img/menu-border.jpg) no-repeat;  }
#menu a:hover, #login:hover, #submenu a:hover { text-decoration: underline; }
#menu a.active span { background: url(../img/active-menu.jpg); position: absolute; width: 125px; height: 92px; margin-left: 0px; margin-left: -64px; }
#menu a.active span, x:-moz-any-link, x:default { margin-left: -64px; }
#menu a.active:hover, #submenu a.active:hover { text-decoration: none; }
#menu a, .click, .click-dashboard, #submenu a, .dataset th {  text-decoration: none; color: #838383; text-shadow: #fff 1px 1px 0px; font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; }
#menu a.active, #submenu a, .dataset th { color: #fff; text-shadow: #4d4d4d 1px 1px 1px; }
#submenu { float: left; height: 44px; width: 695px; margin-top: 21px; }
#submenu ul { list-style-type: none; }
#submenu a { float: left; width: 154px; height: 34px; line-height: 34px; margin-right: 15px; text-align: center; font-size: 18px; background: url(../img/submenu.jpg) -154px 0px; }
#submenu a.active { background-position: 0px 0px;  }
#app #submenu { width: 875px; margin: 0px 0px 0px -10px; }
#app #submenu a { width: 150px; height: 38px; background: url(/img/submenu-app.png) -150px 0px; margin: 0 0 0 -8px; line-height: 28px; }
#app #submenu li:first-child a { margin-left: 0px; }
#app #submenu a.active { background-position: 0px 0px; }

/* =LOGIN THINGY ****************************************************/
#pre { float: right; width: 72px; height: 36px; background: url(../img/login-normal-background.jpg); padding-left: 15px; }
#logged { float: right; width: 87px; height: 36px; background: url(../img/login-dashboard-background.jpg); text-align: center; }
#post { float: right; display: none; width: 258px; height: 154px; background: url(../img/login-active-background.jpg); }
.click {  font-size: 16px; line-height: 40px; text-decoration: none; width: 72px; height: 36px; display: block; color: #838383; }
.click-dashboard { font-size: 15px; line-height: 40px; text-decoration: none; width: 72px; height: 36px; display: block; color: #838383; }
#post a.click { float: right; }
#app #pre { background: url(../img/login-app-background.jpg); text-align: center; padding: 0px; width: 87px; }
#app .click { width: 87px; }
#post #logindiv { padding: 50px 0 0 15px; }
#post span { margin-bottom: 11px; }
#post .validation_error { position: absolute; color: red; margin-top: -14px; }
#post .header-text { width: 100px !important; }
#post .input-text { width: 108px; }
#post .input-submit { margin-right: 14px; }
#post .input-submit, #app .input-submit { float: right; }
#app #logindiv { width: 260px; }
#app #logindiv .input-text { float: right; width: 250px; }
#app #logindiv a, #post #logindiv a { float: left; margin-top: 10px; }
#app .input-submit { float: right; margin-top: 10px; }

/* =CONTACT *********************************************************/
#contact div { margin-bottom: 5px; }
#contact textarea { background: #ddd; border: none; padding: 3px; color: #5a638d; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; font-family:helvetica neue,helvetica,arial,sans-serif; font-size:12px; }
#contact textarea:active, #contact textarea:focus { border: 1px solid #e37e15; padding: 2px; }
.validation_error { color: red; }

/* =DASHBOARD *******************************************************/
#dashboard div.recent { float: left; width: 462px; text-align: right; }
#dashboard #first { margin-right: 30px; }
#dashboard table tr td { width: 200px; }
#dashboard .dataset td, #dashboard .dataset th { padding-left: 10px; }

/* =DATASET *********************************************************/
.filters { margin: 0 0 10px 0; } 
.filters select { width: 240px !important; }
a.icon { text-decoration: none; margin-right: 10px; }
a.icon img { vertical-align: middle; }
.dataset { width: 100%; margin: 20px 0 20px 0; }
.dataset td, .dataset th { vertical-align: middle; padding: 0; padding-left: 10px; overflow: hidden; text-overflow: ellipsis;}
.dataset td { white-space: nowrap; }
.dataset td img { vertical-align: middle; }
.dataset th { color: #ffffff; height: 40px; font-weight: normal; font-size: 16px; background: url(/img/dataset-header-bg.jpg) repeat-x;  }
.dataset th:first-child { -webkit-border-top-left-radius: 8px; -moz-border-radius-topleft: 8px; border-top-left-radius: 8px;}
.dataset th:last-child { -webkit-border-top-right-radius: 8px; -moz-border-radius-topright: 8px; border-top-right-radius: 8px;}
.dataset td { color: #514f81; height: 35px; background: url(/img/dataset-row-bg.jpg) repeat-x ; }
.dataset td.hover { background-image: url(/img/dataset-row-selected-bg.jpg) ; cursor: pointer; }
.dataset tr.active td { background-image: url(/img/dataset-row-selected-bg.jpg) ; }
.dataset tr.active td.handle span { background: url(/img/dataset-dragger-selected.gif); }
.dataset.sortable .handle { cursor: move !important; width: 20px; }
.dataset.sortable .handle span { background: url(/img/dataset-dragger.gif); width: 10px; height: 15px; margin: 0 0 0 5px; display: block; }
.dataset.sortable td.hover.handle span { background: url(/img/dataset-dragger-selected.gif); }
.dataset a { color: #484675; text-decoration: none; display: block; width: 100%; height: 35px; line-height: 35px; }
.dataset img { vertical-align: middle; }
.dataset .boolean { width: 50px; text-align: center; }
.dataset .create-pdf:hover { color: #fff; }

/* =FORM *********************************************************/
.form fieldset { border: 1px solid #ddd; padding: 12px 16px; }
.form br { clear: both; }
.form .header-text { display: block; float: left; width: 200px; margin: 3px 10px 9px 0; font-weight:bold; color:#5a547d; }
.form input, .form select, form textarea { border: none; background: #ddd; margin-top: 1px; color:#5a547d; line-height: 22px; }
.form img {vertical-align: top;} 
.form span { display: inline-block; margin-top: 2px; }
.form .input-wrapper { display: inline-block; margin: 3px 0 6px 0; }
.form .input-wrapper div { display: inline-block; height: 20px; background-image: url(/img/input-middle.png); }
.form .file-inputs { position: relative; width: 269px; }
.form .file-inputs .fake-file {	position: absolute;	top: -4px; left: 0px; z-index: 1; width: 260px; color: #e37e15; }
.form .file-inputs .fake-file input { width: 169px !important; }
.form .file-inputs .file { float: right; width: 100%; position: relative; text-align: right; z-index: 2; -moz-opacity: 0; filter: alpha(opacity: 0); opacity: 0; }
.form input[type=text], .form select { width: 260px; }
.form input[type=submit], .submit { width: 85px; height: 25px; background: url(/img/submit.jpg); font-size: 14px; color: #fff !important; font-weight: bold !important; text-decoration: none; }
@-moz-document url-prefix() { .submit { line-height: 28px !important; } }
.form input[type=submit]:active, .submit:active { background-position: 0px -25px; }
.form input[type=submit]:hover, .submit:hover { text-decoration: underline; }
.form input[type=radio] { margin-right: 5px; background: #fff; }
.form input[type=file] { width: 80px; }
.submit { display: block; text-align: center; line-height: 25px; float: left; }
#wachtwoord-wijzigen { margin-left: 277px; }
.fixed { height: 750px; }
#risicowaarde, #rest_risicowaarde { margin: 3px 0 0 9px; }
a.back { display: block; margin: -35px 0 17px 0; }
a.attachment-link { color: #e37e15 !important; }

.who { float: right; text-align: right; margin: -32px 0 0 0 ; font-size: 12px; line-height: 1em;}
.form input[type=text],
.form input[type=password], 
.form textarea,
.form select { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; padding: 0 7px; height: 22px; width: 248px; border: 1px solid #DDD; }
.form select { width: 265px; }
.form textarea { height: 66px; resize: none; }
.form input[type=text]:active, 
.form input[type=text]:focus,
.form input[type=password]:active, 
.form input[type=password]:focus,
.form select:active,
.form select:focus,
.form textarea:active,
.form textarea:focus { border: 1px solid #E37E15; } 
.combo-text { display: none; margin: 5px 0 !important; }
.filters select { margin-bottom: 10px; }

/* =FORMTABS *****************************************************/
.tabs { min-height: 650px;}
.tab { display: block; height: 42px; background-position: 0px -42px !important; line-height: 42px; padding: 0 0 0 55px !important; }
.tab { width: 300px; }
.tab1 { background: url(/img/steps-1.jpg) no-repeat; }
.tab2 { background: url(/img/steps-2.jpg) no-repeat; }
.ui-state-active a { background-position: 0px 0px !important; }
.ui-state-hover a { color: #e37e15; }
.ui-tabs-nav { margin: 0 0 25px 0 !important; }
.ui-tabs-nav li { margin: 0px !important; padding: 0px !important;}
#tab-risico, #tab-maatregel { padding: 0px !important; width: 480px; }
.header-text + span { float: left; width: 270px; }
.tabs .buttons { margin-left: 390px; }
.tabs .submit { float: right; margin: 10px 0 0 15px; }
.submit-form { margin: 10px 0 0 393px; }
#gevaar-foto { position: absolute; z-index: 1; margin-left: 520px; margin-top: 100px; width: 400px; }
#gevaar-foto .image { margin-bottom: 5px; }
#arrows { width: 400px; padding: 0 20px; display: none; }
#arrows img { margin: 10px 10px; }

/* =MISC *********************************************************/
#ui-datepicker-div {  border: 1px solid #484675; z-index: 10; display: none; /* Rob: Display none niet verwijderen ivm sticky footer */}
#verwijderen-dialog img { float: left; }
#verwijderen-dialog span { float: left; height: 55px; line-height: 55px; display: block; width: 260px; }
button { width: 87px !important; height: 27px !important; line-height: 25px !important; background: url(/img/submit.jpg) !important; font-size: 13px !important; color: #fff !important; font-weight: bold !important; text-decoration: none; padding: 0px !important; text-shadow: none !important; }
@-moz-document url-prefix() { button { padding-bottom: 3px !important; } }
button:active { background-position: 0px -25px !important; }
button:hover { text-decoration: underline !important; }