*{padding:0; margin:0;box-sizing:border-box;}
body, html{width:100%;  height:100%; background:#ECEDEE; font-family: 'Open Sans', sans-serif;font-size:13px;}
a{color:#fff; text-decoration: none;box-sizing:border-box;}
.clear{display:block; clear:both;}

/*-----------------------------------DOSJOB 2011---------------------------------*/
div#eegg{display:block; position:fixed; bottom:-400px; right:-420px; z-index:9999;}

.clearfix:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}

h2{
  font-size:1.2em;
}

.jobdetail{
  font-family: 'Open Sans', sans-serif;
  font-size:2em;
  font-weight:500;
}

.klant-wrap{
  float:left;
  display: block;
  width:100%;
  margin:5px 0;
  border:1px solid #bbb;
  box-sizing: border-box;

}

div#main-table .klant-wrap .tbody{
  width:100%;
}

.klant-wrap .klant-title{
  padding:15px 10px;
  float:left;
  display: block;
  width:100%;
  color:#13181f;
  background-color: #f6f6f6;
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  text-transform: uppercase;
  position: relative;
}

.klant-wrap .klant-title .caret{
  position: absolute;
  right: 15px;
  top: 15px;
  width: 10px;
  height: 14px;
}


.klant-wrap .jobs-wrap{
  float:left;
  width:100%;
  border-top:1px solid #bbb;
}

div#main-table .klant-wrap .omschrijving {
    width: 60%;
}

.klant-wrap .klant-title h2{
    font-weight: 400;
}

/*------------------FONTS---------------*/
@font-face {
    font-family: 'OSPDIN';
    src: url('../fonts/OSP-DIN-webfont.eot');
    src: url('../fonts/OSP-DIN-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/OSP-DIN-webfont.woff') format('woff'),
         url('../fonts/OSP-DIN-webfont.ttf') format('truetype'),
         url('../fonts/OSP-DIN-webfont.svg#OSPDIN') format('svg');
    font-weight: normal;
    font-style: normal;
}


@font-face {
    font-family: 'HelveticaNeueLTStd35Thin';
    src: url('../fonts/helveticaneueltstd-th-webfont.eot');
    src: url('../fonts/helveticaneueltstd-th-webfont.eot?#iefix') format('embedded-opentype'),
         url('../fonts/helveticaneueltstd-th-webfont.woff') format('woff'),
         url('../fonts/helveticaneueltstd-th-webfont.ttf') format('truetype'),
         url('../fonts/helveticaneueltstd-th-webfont.svg#HelveticaNeueLTStd35Thin') format('svg');
    font-weight: normal;
    font-style: normal;
}

input, textarea, keygen, select, button {
    text-rendering: auto;
    color: initial;
    letter-spacing: normal;
    word-spacing: normal;
    text-transform: none;
    text-indent: 0px;
    text-shadow: none;
    display: inline-block;
    text-align: start;
    margin: 0em 0em 0em 0em;
    font: 13px;
    font-family: 'Open Sans', sans-serif;
}

/*-----------------GENERAL--------------*/
/*sticky footer*/
div#wrapper{min-height:100%; height:auto !important; height:100%; margin:0 auto -40px;}
div#push, div#footer-wrapper{height:40px;}
div.nine80{display:block; width:1200px; margin:0px auto;}

/*wrappers*/
div#header-wrapper, div#content-wrapper, div#footer-wrapper{display:block; float:left; width:100%;}

/*-----------------HEADER--------------*/
#logout-wrapper, #nav-wrapper{display:block; float:left; width:100%; background:#13181f; height:76px;}
#nav-wrapper{display:block; float:left; width:100%; padding:0; height:40px; background:#222932;}

#logout-wrapper h1.logo{display: block;
float: left;
width: 180px;
height: 76px;
background-image: url('../img/logo.png');
text-indent: -9999px;
background-size: 100% auto;
background-position: center center;
background-repeat: no-repeat;}
#secondary-links{display:block; float:right; padding:18px 0px 0px 0px;}
#secondary-links li, #secondary-links li a{display:block; float:left;}
#secondary-links li a{color:#fff;-webkit-transition: all 200ms ease-in-out;-moz-transition: all 200ms ease-in-out;-o-transition: all 200ms ease-in-out;transition: all 200ms ease-in-out;font-size:14px;padding:10px 20px;font-family: 'Source Sans Pro', sans-serif; font-weight:300;height:38px; line-height:38px; border:1px solid #fff; 
                        text-decoration: none; padding:0px 20px 0px 20px; margin-right:10px; letter-spacing:0.03em;}

#secondary-links li a:hover{color:#fff; border-color:#fff;background-color: #fff;color:#13181f;}
#secondary-links li.home a:hover{border-color:#fff; background-color: #fff;color:#13181f;}

/*primary links*/
#primary-links{display:block; float:left;}
#primary-links li{display:block; float:left;}
#primary-links li.first{padding-left:0px;}
#primary-links li.last{border:0;}
#primary-links li a{-webkit-transition: all 200ms ease-in-out;-moz-transition: all 200ms ease-in-out;-o-transition: all 200ms ease-in-out;transition: all 200ms ease-in-out;display:block; float:left;line-height:20px;font-size:14px;padding:10px 20px;font-family: 'Source Sans Pro', sans-serif; text-decoration: none;font-weight: 300;}
#primary-links li.active a, #primary-links li a:hover, #nav-right li a:hover, #nav-right li.active a{color:#fff;background-color:#5bda9a;}

#nav-right{display:block; float:right; list-style: none; padding:0;}
#nav-right li{display:block; float:left;}
#nav-right li a{-webkit-transition: all 200ms ease-in-out;-moz-transition: all 200ms ease-in-out;-o-transition: all 200ms ease-in-out;transition: all 200ms ease-in-out;display:block; float:left;line-height:20px;font-size:14px;padding:10px 20px;font-family: 'Source Sans Pro', sans-serif; text-decoration: none;font-weight: 300;}



/*----------------CONTENT---------------*/
#content{display:block; width:1200px; margin:0px auto; padding:35px 0px; margin-bottom:45px;}

/*FILTER*/
div#filter{display:block; float:left; width:100%; min-height:24px;}
div#filter .left{display:block;margin:10px 0; color:#343534; font-family: 'Open Sans', sans-serif;font-size:13px;}
div#filter .right{display:block;margin-left:-10px;margin-right:-10px;}
div#filter select.chosen, select#categorie{width:200px; margin-bottom:0;}
#categorie_chzn .chzn-search{display:none;}
div#filter ul.chzn-results li, #categorie_chzn ul.chzn-results li{color:#fff;}
div#filter li.no-results, #categorie_chzn li.no-results{background:#13181f;}
div#filter span, div#filter b, #categorie_chzn b, #categorie_chzn span{cursor:pointer;}
div.select-wrap{display:block; float:left;width:16.667%;padding:0 10px;}
.klantenfilter div.select-wrap{
  width:25%;
}
div.select-wrap select,div.select-wrap input{width:100%;}

#filter #omschrijving-filter{display:block; float:left; padding:0px 5px; border:0; height:28px; line-height:28px; color:#fff; font-size:11px; background:#222932;}
#filter{margin-bottom:35px;}
/*JOBS*/
h2.intro{display:block; float:left; width:100%;font-weight:300; padding:35px 0px; padding-top:0px;font-family: 'Source Sans Pro', sans-serif, sans-serif;font-size:70px;}
h2.intro span{color:#5bda9a;}
div#main-table{display:block; float:left; width:100%;
}
div#main-table .header{background:#13181f; color:#fff; font-family: 'Source Sans Pro', sans-serif; line-height:28px;font-size:18px; font-weight: 300; text-transform:uppercase;width:100%; display:block; float:left; padding:5px 0px;}
div#main-table .header span{display:block; float:left; margin-left:15px;line-height:33px;}
div#main-table .header span a{border:0; padding:0; margin:0; margin-left:5px; display: inline; float: none; text-transform: none; margin-bottom: 3px;}
div#main-table .header a, .btn{-webkit-transition: all 200ms ease-in-out;-moz-transition: all 200ms ease-in-out;-o-transition: all 200ms ease-in-out;transition: all 200ms ease-in-out;display:inline-block; margin-right:15px;  font-family: 'Open Sans', sans-serif;font-size:12px; padding:2px 10px; border: 1px solid #ccc;}
div#main-table .header a:hover, .btn{background:#5bda9a;border:1px solid #5bda9a;}

.btn{
  margin:10px 0;
  padding:5px;
}

div#main-table .header a{
   float:right;
   display: block;
}

div.thead{display:block; float:left; width:100%; line-height:24px;background-color: #fff;color:#626262;}
div#main-table .cell{display:block; float:left; padding:3px 10px; color:#626262; font-size:13px;}
div#main-table .status{width:3%;}
div#main-table .jobnr{width:8%;}
div#main-table .klant{width:20%;}
div#main-table .omschrijving{width:40%;}
div#main-table .team{width:5%;}
div#main-table .timing{width:5%;}
div#main-table .planning{width:7%;}
div#main-table .actions{width:10%; border-right:0px;}
div#main-table .joboverview-table .actions{width:17%;}

div#main-table .deadline{width:15%;}
div#main-table .uitvoerder{width:15%;}
div#main-table .taak{width:55%;}
div#main-table .tijd{width:5%;}

div#main-table.websites .name{width:24%;}
div#main-table.websites .klant{width:19%;}
div#main-table.websites .hosting{width:6%;}
div#main-table.websites .domein{width:6%;}
div#main-table.websites .mails{width:6%;}
div#main-table.websites .versie{width:7%;}
div#main-table.websites .versie.red{background: #FF4F4F;color: #FFF !important;min-height: 32px;}
div#main-table.websites .versie.yellow{background: #F7CA18;color: #FFF !important;min-height: 32px;}
div#main-table.websites .versie.no-updates{font-style:italic;font-weight: bold;min-height: 32px;}

div#main-table.websites .vervaldatum{width:11%;}

div#main-table.klanten .bedrijfsnaam{width:40%;}
div#main-table.klanten .stad{width:12.5%;}
div#main-table.klanten .telefoon{width:17.5%;}
div#main-table.klanten .email{width:20%;}
div#main-table.klanten .telefoon .tag{border:1px solid #aeaeae;padding:3px;margin:0 3px;border-radius:3px;}

div#main-table.leveranciers .bedrijfsnaam{width:35%;}
div#main-table.leveranciers .stad{width:10%;}
div#main-table.leveranciers .telefoon{width:10%;}
div#main-table.leveranciers .email{width:25%;}
div#main-table.leveranciers .categorie{width:10%;}

div#main-table .tbody{display:block; float:left; width:1200px; background:#fff;}
div#main-table .row-wrapper{display:block; float:left; width:100%; height:100%;}
div#main-table .tbody .cell{padding-top:7px; padding-bottom:7px; color:#8A8B8C; font-size:13px; border:0; padding-right:11px;}
div#main-table .tbody .cell.actions,div#main-table .tbody .cell.planning{
    padding-top:0;
    padding-bottom:0;
}
div#main-table .tbody .status, div#main-table .tbody .actions{padding-right:0px;}
div#main-table .tbody .row{-webkit-transition: all 200ms ease-in-out;-moz-transition: all 200ms ease-in-out;-o-transition: all 200ms ease-in-out;transition: all 200ms ease-in-out;display:block; float:left; width:100%; background:#f7f7f7;}
div#main-table .tbody .odd{background:#ffffff;}
div#main-table .tbody .row:hover{background:#D4E1EE;}
div#main-table .tbody .row:hover .cell{color:#343534;}

div#main-table .cell.status{
  padding-top:9px;padding-bottom:9px;
}
div#main-table a.status{display:block;line-height:14px; width:14px; height:14px;border-radius: 7px;border-width:5px;border-style:solid;}
div#main-table a.lopend, span.ok{border-color:#2ecc71;}/*groen*/
div#main-table a.offerte{border-color: #95a5a6;}/*grijs*/
div#main-table a.onhold{border-color:#13181f;}/*zwart*/
div#main-table a.factuur{border-color:#e67e22;}/*oranje*/
div#main-table a.afgewerkt{border-color:#c0392b;}/*rood*/
div#main-table a.gecontroleerd{border-color:#2980b9;}/*blauw*/

/*
div#main-table a.status{display:block; margin-top:1px; float:left; width:13px; height:13px; text-indent: -9999px; overflow:hidden; background:url('../img/status-icons.png') no-repeat;}
div#main-table a.lopend, span.ok{background-position:0 0px;}
div#main-table a.factuur{background-position:0px -99px;}
div#main-table a.offerte{background-position:0px -33px;}
div#main-table a.onhold{background-position:0 -66px;}
div#main-table a.afgewerkt{background-position:0px -132px;}
div#main-table a.gecontroleerd{background-position:bottom left;}
*/

/*DARK*/
.dark #logout-wrapper, .dark #nav-wrapper, .dark div#main-table .header, .dark a.reset-filter  {background-color: #202020;}
.dark #nav-wrapper {background-color: #000000;}
.dark #filter #omschrijving-filter, .dark .select-wrap .chosen-container .chosen-single {background-color: #111111 !important;}
#wework .chosen-container .chosen-results li.highlighted{
  background: #5bda9a;
}
#wework .chosen-container .chosen-results{
  margin:0;
  padding:0;
}

/*KLANTEN*/
div#main-table .thead .bedrijfsnaam{padding-left:20px;}
div#main-table .thead .contactnaam{padding-left:20px;}
div#main-table .bedrijfsnaam{width:300px; padding-left:10px;}
div#main-table .contactnaam, div#main-table .contactcell{width:156px; padding-left:10px;}
div#main-table .stad{width:200px;}
div#main-table .telefoon{width:172px;}
div#main-table .email{width:130px;}
div#main-table .cell a{color:#626262;}
div#main-table .cell a:hover{color:#222;}

div#main-table .tbody .hide{display:none;}

div#main-table .thead .cell{
    padding:4px 10px;
}
div#main-table .thead a.sort{display:block; float:left; width:100%; height:100%; background-image:url('../img/dropdown-grey.png');background-repeat:no-repeat;background-position:95% 6.5px;}
div#main-table .thead a.sort:hover{color:#5bda9a;}

a.reset-filter{-webkit-transition: all 200ms ease-in-out;-moz-transition: all 200ms ease-in-out;-o-transition: all 200ms ease-in-out;transition: all 200ms ease-in-out;display:inline-block; padding:0px 10px; height:28px; line-height:28px; background:#13181f; font-size:11px;}
a.reset-filter:hover{background:#5bda9a;}

div.edit-links{display:block; float:right; padding-right:2px;}

div.edit-links a:hover{background-color:#5bda9a;}

div.edit-links a:hover i{color:#fff;}


div.edit-links a{
    -webkit-transition: all 200ms ease-in-out;-moz-transition: all 200ms ease-in-out;-o-transition: all 200ms ease-in-out;transition: all 200ms ease-in-out;
    text-align: center;
    display: block;
    float:left;
    color:#626262;
    padding:3px;
    margin:0;
    padding:7px;
    line-height: 14px;
}
.stat-job ul li{
  margin:7px;
}
.planning .stat-job ul li{
    margin:7px;
    background-color:#e8e8e8;
}
.planning .stat-job ul li .left{
    padding:5px;
    display: inline-block;
}
.planning .stat-job ul li .right .edit-links{
  padding-right:0;
  border:1px solid #DBDBDB;
}
.planning .stat-job ul li .right .edit-links a{
    background-color: #fff;
}
.planning .stat-job ul li .right .edit-links a:hover{
    background-color: #5bda9a;
}


.planning .stat-job ul li.done { background-color: #27ae60;color:#fff;}

div.editheader{margin-bottom: 0px;}
div.main-form{display:block;  width:1200px; margin-bottom:35px; border-top:0px; background-color:#fff;}
div.main-form form{display:block; float:left; width:100%; background:#fff;}
.field-wrap{display:block; float:left; width:100%; background:#fff;}
.form-item{display:block; width:940px;margin:0 auto; padding:10px 0;}
.form-item:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}
.field-wrap .odd{background:#fff;}
.form-item label{display:block; float:left; width:140px; color:#626262; height:26px; line-height:26px; font-size:11px;}
.form-item input{display:block; float:left; width:800px; color:#626262; font-size:11px; height:26px; line-height:26px; border:none; padding:0px 5px; border:1px solid #ccc;}
.form-item.checkbox input{width: auto;}

.submit-form{display:block; width:940px; margin:0 auto;padding:10px 0;}
.submit-form:after {
   content: " "; /* Older browser do not support empty content */
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;
}
.submit-form input, a.add-contact, a#add-contact{display:block; float:right; border:0; padding:5px 10px; cursor:hand; cursor:pointer; text-transform: lowercase; color:#fff; background:#5bda9a;}
.submit-form input:hover, a.add-contact:hover, a#add-contact:hover{color:#fff; background:#5bda9a;}

div#main-table .tbody .odd, .add-contact-form .odd{background:#fff;}
.add-contact-form .form-item{width:430px;}
.add-contact-form input{width:418px;}

/*POPUP*/
div.boxoverlay{display:none; position:fixed; _position:absolute; height:100%; width:100%; top:0; left:0; background:#000000; z-index:1; opacity:0.4; cursor:hand; cursor:pointer;}
.popupbox{display:none; position:fixed; _position:absolute; height:400px; width:250px; background:#fff; z-index:9999; top:0; left:0;
                -moz-box-shadow: 0 0 5px #13181f;
                -webkit-box-shadow: 0 0 5px #13181f;
                box-shadow: 0 0 5px #13181f;
}

.padd{
  padding:20px;
}

.popupbox h3{
    background: none repeat scroll 0 0 #13181f;
    color: #FFFFFF;
    display: block;
    float: left;
    font-family: 'Open Sans', sans-serif;
    font-size:15px;
    padding: 5px 0;
    text-transform: uppercase;
    width: 100%;
}

.popupbox .form-item{
  padding:5px 0;
}
.popupbox .form-item input{
  width:100%;
}
.popupbox .form-item input[type='submit']{
  line-height: normal;
}
.popupbox .form-item input[type="checkbox"]{
  width:auto;
}

.popupbox h3 span{display:block; float:left; margin-left:10px;}

a.add-contact{margin-top:10px;}

/*-------------impromptu---------- */
.jqifade{ position: absolute; background-color: #222; }
div.jqi{ width: 400px; font-family: 'Open Sans', sans-serif; position: absolute; background-color: #ffffff; font-size: 11px; text-align: left; border: solid 1px #eeeeee; -moz-border-radius: 10px; -webkit-border-radius: 10px; padding: 7px; }
div.jqi .jqicontainer{ font-weight: bold; }
div.jqi .jqiclose{cursor:pointer; cursor:hand; position: absolute; top: 4px; right: -2px; width: 18px; cursor: default; color: #bbbbbb; font-weight: bold; }
div.jqi .jqimessage{ padding: 10px; line-height: 20px; color: #444444; }
div.jqi .jqibuttons{text-align: right; padding: 5px 0 5px 0; border: solid 1px #eeeeee; background-color: #f4f4f4; }
div.jqi button{cursor:pointer; cursor:hand;  padding: 3px 10px; margin-right:5px; background-color: #626262; border: solid 1px #f4f4f4; color: #ffffff; font-weight: bold; font-size: 12px; }
div.jqi button:hover{ background-color: #5bda9a; }
div.jqi button.jqidefaultbutton{ background-color: #626262;}
div.jqi button.jqidefaultbutton:hover{background:#5bda9a}
.jqiwarning .jqi .jqibuttons{ background-color: #5bda9a; }
/*-------------------------------- */

.form-item .chzn-container-single{width:800px;}
.form-item .chzn-container-single .chzn-single{height:26px; line-height:26px; background:#fff; border:1px solid #ccc; color:#626262;}
.form-item .chzn-container-single input{line-height:13px;}

.chzn-container-multi input{line-height:18px; height:18px; color:#626262;}
.form-item .chzn-container-multi .chzn-choices .search-field .default{color:#626262;}
.form-item .chzn-container .chzn-drop{background:#fff; color:#222; border:1px solid #ccc; background:#fff;}
.form-item .chzn-container .chzn-drop li{color:#626262;}
.form-item .chzn-container .chzn-results .highlighted{color:#fff;}
.form-item .chzn-container-single .chzn-single div b{background:url('../img/dropdown-grey.png') no-repeat 8px 8px;}

/*TIMEPICKER*/
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

#ui-datepicker-div{z-index: 9999 !important;}

.form-item textarea{font-size:11px; font-family: 'Open Sans', sans-serif;font-size:13px;}
span.red{color:red;}

#totalhours{display:block; float:left; padding:35px 0px;}
#totalhours .row{padding:4px 0px;}
span#total{display:block; float:left; padding-left:10px; color:#13181f; font-size:11px;}
span.status{display:block; margin-top:1px; float:left; width:13px; height:13px; text-indent: -9999px; overflow:hidden; background:url('../img/status-icons.png') 0px -66px no-repeat;}
span.wait{background-position:0px 0px;}

/** statistieken calendar **/
.calendar_list{display:none;}
#content #cal-results h2{display:block; float:left; width:100%; padding-bottom:15px;
                       font-family: 'Open Sans Condensed',sans-serif;
                        font-size: 35px !important;
                        font-weight: bold !important;
                        text-transform:uppercase; color:#5bda9a;
}
#content #cal-results{display:block; float:left; min-height:0; margin-top:10px; padding:25px; width:452px;}
#content #cal-results ul{display:block; float:left; width:100%; list-style:none; color:#333;}
#content #cal-results ul li{display:block; float:left; width:100%; border-bottom:1px solid #E8E8E8; padding:10px 0px; margin-right:25px; font-weight:bold;}
#content #cal-results ul li.even{margin:0;}
#content #cal-results ul li span{display:block; float:right; font-weight:normal;}

#content #cal-results ul li span.name{float:left; font-weight:bold;}
#content #cal-results ul li span.name a{color:#333;}
#content #cal-results ul li span.name a:hover{color:#5bda9a;}

.cal-left #calendar{
  width:100%;
}

.dp_calendar{display:block; float:left;}
#ajax-hours{display:block; float:left; width:100%;}

#r-table{display:block; float:left; width:100%;
        background: #ffffff;
        border:1px solid #dbdbdb;
        -moz-border-radius: 3px;
        border-radius: 3px;
        font-family: 'Open Sans', sans-serif;
        color:#272727;
}
#r-table .r-header{font-weight:bold; background:#efefef; text-transform:uppercase;}
#r-table .r-row{display:block; float:left; width:100%; border-bottom:1px solid #dbdbdb;}
#r-table .last{border-bottom:0;}
#r-table .r-cell{display:block; float:left; width:16.66667%; padding:10px 10px; text-align:right; border-left:1px solid #ccc;}
#r-table.verdiend-table .r-cell{width:12.5%;}
#r-table .r-month{background:#efefef; text-align:left; font-weight:bold; border-left:0;}
#r-table .r-total{font-weight:bold;}
#r-table .r-first{background:#fff;}
#r-table .r-cell a.verdiend-detail { color: #000000; text-decoration: none; }

#r-nav{display:block; float:left; width:100%; padding:15px 0px; padding-top:5px;}
#r-nav .rel{display:block; position:relative; width:100%; height:50px;}
#r-nav .abs{display:block; position:absolute; width:100%; height:auto; top:0; left:0;}

#r-nav .abs a.prev{left:400px;}
#r-nav .abs a{color:#333333; display:block; position:absolute; top:12px; right:400px; font-size:24px;}
#r-nav .abs a:hover{color:#5bda9a;}

#r-nav h3{display:block; float:left; width:100%; text-align:center; font-family: 'Open Sans Condensed',sans-serif;
        font-size: 35px !important;
        font-weight: bold !important;
        text-transform:uppercase; color:#5bda9a;
}

#r-ajax{display:block; float:left; width:100%;}

/** checkbox formitem **/
.form-item .checkbox{width:auto;}

div#main-table .tbody .rootlvl{color:#333; font-weight:bold;}

#cal-prestaties{
    display:block; float:right;
    background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #DBDBDB;
    border-radius: 3px 3px 3px 3px;
    color: #272727;
    font-family: 'Open Sans', sans-serif;
    padding: 1px;
    text-align: left;
    margin:2.5%;
    width: 45%;
    padding:25px;
}

.cal-left{display:block; float:left; width:45%;margin:2.5%;}
#cal-prestaties h2{display:block; float:left; width:100%; padding-bottom:15px;
                       font-family: 'Open Sans Condensed',sans-serif;
                        font-size: 25px !important;
                        font-weight: bold !important;
                        text-transform:uppercase; color:#5bda9a;
}

#cal-detail{display: block; float: left; width: 100%;}

#cal-detail .stat-job{display: block; float: left; width: 100%; padding-bottom:15px;}
#cal-detail .stat-job h3{display: block; float: left; width: 100%; color: #333;
    font-size: 13px !important;
    font-weight: bold !important;
    padding-bottom: 6px;
    text-transform: uppercase;
    width: 100%;
    border-bottom:1px dashed #DBDBDB;
    margin-bottom:4px;
}

#cal-detail .stat-job h3 a{color:#333;}
#cal-detail .stat-job h3 a:hover{color:#5bda9a;}

#cal-detail .stat-job ul{display:block; float:left; padding:0px 10px; width:100%; list-style:none;}
#cal-detail .stat-job ul li{display: block; float: left; width: 100%; padding:5px 0px;}
#cal-detail .stat-job ul li span.left{display:block; float:left; width:415px;}
#cal-detail .stat-job ul li span.right{display: block; float: right; width:53px; font-weight: bold; text-align: right;}

.root-links{display: block; float: left; width: 100%; padding-bottom:10px;}
.root-links ul, .root-links li{display: block; float: left;}
.root-links li{padding-right:20px; color:#999;}
.root-links li a{color:#5bda9a;}

div#main-table .team.red{color:#c0392b;}

p#datepicker{padding-top:15px; padding-left:15px; padding-bottom:65px;}

div.verlof-dates{display: block; float: right; position: relative; z-index: 9999; width: 50%; padding-top: 25px; margin-right:15px;}
div.verlof-dates .verlof-header{display: block; float: left; width: 94%; border-bottom:1px solid #ddd; padding-bottom:15px; margin-bottom: 15px;}
div.verlof-dates .verlof-header .full{display: block; float: left; width: 100%; text-transform: uppercase; font-weight: bold;}
div.verlof-dates .verlof-header .full span{font-weight: normal; text-transform: none; color:#999;}
div.verlof-dates .verlof-row{display: block; float: left; width: 46%; padding-bottom:15px; margin-bottom:15px; border-bottom:1px solid #efefef; margin-right:2%;}
#verlof-ajax{display: block; float: left; width: 100%;}
div.verlof-dates .left, div.verlof-dates .right{display: block; float: left; width: 50%;}

#verlof-save{display: block; float: left; width: 100%; padding-bottom:25px;}
#verlof-save input{display: block; float: right; margin-right:25px; border:1px solid #ddd; text-transform: uppercase; padding:5px 8px; cursor: pointer; color:#666;}
#verlof-save input:hover{background:#5bda9a; color:#fff; border-color:#5bda9a;}

#verlof-overzicht{display: block; float: left; width: 100%;  padding:25px 38px;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

#verlof-overzicht table {
    overflow:hidden;
    border:1px solid #ccc;
    width:29%;
    margin:0px;
    float:left;
    margin-bottom:25px;
}

#verlof-overzicht th, #verlof-overzicht td {padding:10px; text-align:left; border-bottom:1px solid #ccc;}
#verlof-overzicht th{font-weight: normal; text-transform: none;}
#verlof-overzicht th.h {background:#efefef;}
#verlof-overzicht tr.last td {border-bottom: 0;}
#verlof-overzicht td{border-right: 1px solid #ccc;}
#verlof-overzicht td.first, th.first {text-align:left}
#verlof-overzicht td.last{border-right: 0;}
#verlof-overzicht th.h{text-align: center; font-weight: bold; text-transform: uppercase;}
#verlof-overzicht th{border-right: 1px solid #ccc; font-weight: bold; background:#efefef;}
#verlof-overzicht th.last{border-right: 0;}

#verlof-overzicht tr.total{background:#efefef; font-weight: bold;}
#verlof-overzicht tr.total span{color:#c0392b;}

#verlof-overzicht .del a{color:#ccc; font-weight: bold;}
#verlof-overzicht .del{display: block; float: right;}
#verlof-overzicht .del a:hover{color:#c0392b;}

p.yes{color:#c0392b; font-weight: bold;}

.login-wrapper form{display: block; float: left; width: 350px;}
.login-wrapper form .form-line{display: block; float: left; width: 100%; margin-bottom:15px;}
.login-wrapper form .form-line input, .login-wrapper form .form-line label{display: block; float: left; width: 100%;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

.login-wrapper form .form-line input{border:1px solid #ccc; background:#fff; padding:10px 5px;}
.login-wrapper form .form-line label{font-weight: bold; text-transform: uppercase; margin-bottom: 5px;}
.login-wrapper form .form-line .submit input{width: auto; cursor: pointer; float: right;}
.login-wrapper form .form-line .submit input:hover{border-color:#5bda9a; background:#5bda9a; color:#fff;}

.login-wrapper .form p {
    border: 1px solid rgba(0, 0, 0, 0);
    border-radius: 4px;
    margin-bottom: 25px;
    padding: 15px;
}
.login-wrapper .form p {
    background-color: #F2DEDE;
    border-color: #EBCCD1;
    color: #B94A48;
}

.cell.vervaldatum.red { background: #FF4F4F; color: #FFF !important; }

/* Verdiend detail */
#r-detail { margin-top: 20px; float: left; width: 100%; }
#r-detail.closed { display: none; }
#r-detail .top { background-color: #13181f; color: #FFFFFF; width: 100%; padding: 5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#r-detail .top span { margin-left: 10px; font-family: 'Open Sans', sans-serif;font-size:26px; }
#r-detail .top a.close-detail { float: right; background-image: url('../img/close.png'); background-repeat: no-repeat; background-position: center; display: block; width: 30px; height: 30px; }
#r-detail .detail-content { border:1px solid #dbdbdb; }
#r-detail .detail-content ul { list-style-type: none; width: 100%; }
#r-detail .detail-content li { width: 100%; padding: 8px 10px; border-bottom:1px solid #dbdbdb; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
#r-detail .detail-content li:nth-child(even) { background-color: #f9f9f9; }
#r-detail .detail-content strong { width: 60%; display: inline-block; text-align: left;  }
#r-detail .detail-content span { width: 40%; display: inline-block; text-align: right;  }
#r-detail .clear { clear: both; height: 0px; }

.person-wrap{
    float:left;
    width:45%;
    margin:2%;
    box-sizing:border-box;
    background-color: #EFEFEF;
}
.person-wrap .sub-header{
    box-sizing:border-box;
    margin:0;
    padding:10px 15px;
    position: relative;
}


.person-wrap .sub-header .addplanning{
    text-align: right;
    display: inline-block;
}


.person-wrap .person-body{
    box-sizing:border-box;
    margin:0;
    padding:10px 15px;
    margin-top:42px;
}


.add-contact-form .chosen-container{
    width:100% !important;
}

#filter .right .chosen-container{
    width:100% !important;
}
.chosen-container .chosen-results {
    position: absolute !important;
    background-color: white;
    top:30px;
    width:100%;
    border:1px solid #ccc;
}

.chosen-container-multi .chosen-results {
    top:0;
}

.add-planning-user{
    float:left;
    max-width: 100%;
    box-sizing:border-box;
}
.add-planning-user .form-item,.add-planning-user .submit-form{
    max-width: 100% !important;
    padding:7px 0;
    background-color: #EFEFEF;
}

.add-planning-user .form-item select,.add-planning-user .form-item textarea,.add-planning-user .form-item input{
    max-width: 100% !important;
    padding:0;
}

.addTaskForUser{
    margin: 0;
    display: inline-block;
    float: right;
}

.add-planning-user .hidden{
    display: none;
}

.ui-widget-header{
    background:#13181f !important;
    border:0 !important;
}

select:disabled{
    background-color: rgb(235, 235, 228);
}

.feedback{
    background-color: #2ECC71;
    color:white;
}
.feedback p{
    padding:10px;
}

.select-wrap .chosen-container .chosen-single{
    background: #222932 !important;
    border-radius: 0;
    display: block !important;
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    height: 28px;
    border:0 !important;
    line-height: 28px;
    padding: 0 0 0 8px;
    margin-bottom:6px;
    color: #fff;
    box-shadow: none !important;
    text-decoration: none;
    width:100%;
    font-size: 11px;
}



.cal-prestaties .title-wrap{
    display: block;
    padding:10px;
    margin:0 10px;
    background-color:#13181f;
    color:white;
    font-family: 'Open Sans', sans-serif;
    font-size:14px;
    text-transform: uppercase;
    position: relative;
}
.cal-prestaties .title-wrap h2{
    font-weight:400;
}

.cal-prestaties .title-wrap .caret{
    position:absolute;
    right:15px;
    top:15px;
    width:10px;
    height:14px;
}


.hidden{
    display:none;
}

.special-dark{
  font-family: "Comic Sans MS", cursive, sans-serif;
}



.special-dark #logout-wrapper{
    background-color:#FF69B4;
}    
.special-dark #nav-wrapper{
    background-color:pink;
}
.special-dark h2.intro{
  font-family: "Comic Sans MS", cursive, sans-serif;
}
.special-dark #logout-wrapper #secondary-links li a{
    color:white;
  font-family: "Comic Sans MS", cursive, sans-serif;
}

.special-dark #primary-links li a, .special-dark #nav-right li a{
  font-family: "Comic Sans MS", cursive, sans-serif;  
}

.special-dark #primary-links li.active a, .special-dark #primary-links li a:hover, .special-dark #nav-right li a:hover, .special-dark #nav-right li.active a{
  background-color:#EE58A5;
}

.special-dark{
    /*
    background-image:url('http://queerty-prodweb.s3.amazonaws.com/wp/docs/2015/05/Stonemen_David_Brief_Ocean.jpg');
    */
    background-repeat: no-repeat;
    background-position: center center;
    background-size:auto 100%;
}

.planning>a{
    display: block;
    margin:0 auto;
}
.planning>a:hover .fa-square{
   color: #5bda9a !important;
}
.planning>a:hover .fa-flag{
   color: #fff !important;
}

.tooltip {
    position: relative;
    display: inline-block;
    padding:5px;
}

.tooltip .tooltiptext {
    visibility: hidden;
    opacity:0;
    width: 200px;
    background-color: #13181f;
    color: #fff;
    text-align: center;
    border-radius: 2px;
    padding: 4px 0;
    -webkit-transition: all 200ms ease-in-out;-moz-transition: all 200ms ease-in-out;-o-transition: all 200ms ease-in-out;transition: all 200ms ease-in-out;
    

    /* Position the tooltip */
    position: absolute;
    top:22px;
    left:-89px;
    z-index: 1;
}


.tooltiptext a{
    color:#CCC !important;
    text-align:left;
    display: block;
    padding:5px 15px;
}
.tooltiptext a:hover{
    color:white !important;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    opacity:1;
}

.week{
    padding:25px 0;
}
.week h3{
    margin:10px;
}

#main-table .tbody .row .cell.planning>span, #main-table .tbody .row .cell.actions .edit-links>a, #main-table .tbody .row .cell.actions .edit-links>.flag-holder{
    padding:7px;
    line-height:17px;
}
#main-table .tbody .row .cell.actions .edit-links>.flag-holder.other-user{
  color:#e74c3c;
}
#main-table .tbody .row .cell.actions .edit-links>.flag-holder.on, #main-table .tbody .row .cell.actions .edit-links>.flag-holder.on:hover{
  color:#E87E04;
}
#main-table .tbody .row .cell.actions .edit-links>.flag-holder{
  color:#929292;
}


.show-vlaggetjes.active{
  background: #5bda9a;
  color:white;
}

div#main-table .tbody .row.row-important.hidden{
  display: none;
}

/* ================================== */
/*  AJAX LOADER                       */
/* ================================== */
.ajax-loader { text-align: center; padding: 20px; }
.ajax-loader i { font-size: 20px; color: #8A8B8C; }

.add-planning-user .chosen-single, .add-planning-user .chosen-drop{
  min-width:507px;
}

/*
KLANTEN OVERZICHT VERDIEND
*/

.klanten-verdiend table{
  width:100%;
}
.klanten-verdiend table tbody tr td{
  background-color: white;
  padding:5px;
}
.klanten-verdiend table thead tr th{
  background-color:#222932;
  color:white;
  padding:10px;
}

.klanten-verdiend .up{

  font-weight: bold;
}
.klanten-verdiend .down{
 
  font-weight: bold;
}
.klanten-verdiend .equal{

  font-weight: bold;
}
.klanten-verdiend .tableheader{
  cursor: hand;
  cursor: pointer;
}
.klanten-verdiend .tableheader.active::after{
  content: '\f0d7';
   font-family: FontAwesome;
   font-weight: normal;
   font-style: normal;
   margin:0px 0px 0px 10px;
   text-decoration:none;

} 

.klanten-verdiend .total-row td{
  background-color: #222932;
  color:white;
}

.klanten-verdiend table tr:hover td{
  background-color: #f1f1f1;
}
.klanten-verdiend table .total-row:hover td{
  background-color: #222932;
}


td .hideonhover{
  display: block;
}

td .showonhover{
  display:none;
}
td:hover .showonhover{
  display:block;
  font-style: italic;
}

td:hover .hideonhover{
  display: none;
}
.ck-editor{
  width: 800px !important;
  float: right;
}

.ck-editor .ck-editor__editable{
  padding: 25px;
  height: 200px;
}

#myjobs .tile{
  background: white;
  padding:15px;
  border-radius: 5px;
  color:#222932;
  min-height: 144px;
}
#myjobs{
  margin-left: -15px;
  margin-right: -15px;
}



#myjobs .column-item{
  float:left;
  width: 33.3333%;
  padding:15px;
}
#myjobs .column-full{
  width: 100%;
  padding: 15px;
}

#myjobs .tile a{
  color:#8A8B8C;
}
#myjobs .tile a .job-id{
  font-weight: bold;
  color:#13181f;
}
#myjobs .tile a h4{
  font-size:18px;
  margin:15px 0;
  color:#000;
}

*{
  outline: none;
}

#myjobs .tile .actions{
  text-align: right;
}

#myjobs .tile .actions a{
  padding:0 10px;
  display: inline-block;
}

.myjobs h3{
  margin:10px 0;
}