html, :root {
     --maincolor: #009fe3;
}
 body {
     height: 100%;
     font-size: 12px;
     line-height: 1 !important;
     font-family: -apple-system,BlinkMacSystemFont,Segoe\000020UI,"Segoe UI",Roboto,"Helvetica Neue",Helvetica,Arial,sans-serif;
     margin: 0;
     padding: 0;
     white-space: nowrap;
     float: left;
     width: 100%;
	 overflow: visible;
}
 .wrap {
     min-height: 100%;
     height: auto;
     margin: 0 auto -60px;
     padding: 0 0 60px;
}
 .wrap > .container {
     padding: 70px 15px 20px;
}
 .content {
     /*overflow-x: hidden;*/
     /*overflow-y: hidden;*/
     /*overflow: auto;*/
}
 .footer {
    /*height: 200px;
    */
     background-color: var(--maincolor);
     border-top: 1px solid #ddd;
     padding-top: 20px;
     color: #ffffff;
}
 .footer a {
     color: #ffffff;
}
 .not-set {
     color: #c55;
     font-style: italic;
}
/* add sorting icons to gridview sort links */
 a.asc:after, a.desc:after {
     position: relative;
     top: 1px;
     display: inline-block;
     font-family: 'Glyphicons Halflings';
     font-style: normal;
     font-weight: normal;
     line-height: 1;
     padding-left: 5px;
}
 a.asc:after {
     content: 
    /*"\e113"*/
     "\e151";
}
 a.desc:after {
     content: 
    /*"\e114"*/
     "\e152";
}
 .sort-numerical a.asc:after {
     content: "\e153";
}
 .sort-numerical a.desc:after {
     content: "\e154";
}
 .sort-ordinal a.asc:after {
     content: "\e155";
}
 .sort-ordinal a.desc:after {
     content: "\e156";
}
 .grid-view th {
     white-space: nowrap;
}
 .hint-block {
     display: block;
     margin-top: 5px;
     color: #999;
}
 .error-summary {
     color: #a94442;
     background: #fdf7f7;
     border-left: 3px solid #eed3d7;
     padding: 10px 20px;
     margin: 0 0 15px 0;
}
 .carousel-inner > .item > img {
     margin: 0 auto;
}
 @media (max-width: 1000px) {
     .navbar-collapse.collapse {
         display: none !important;
    }
     .navbar-collapse.collapse.in {
         display: block !important;
    }
     .navbar-header .collapse, .navbar-toggle {
         padding-top: 70px;
         display:block !important;
    }
     .navbar-header {
         float:none;
    }
     .navbar-nav > li > a {
         line-height: 25px;
         padding-top: 0px;
         padding-bottom: 0px;
    }
}
 .row {
     color: #000000;
}
 .row a {
     color: var(--maincolor);
     text-decoration: none;
}
 .row-white {
    /*height: 100px;
    */
     background-color: #ffffff;
     color: white;
     text-align: left;
     vertical-align:middle;
     font-size: 18px;
     padding: 14px 24px;
}
 .row-blue {
    /*height: 100px;
    */
     background-color: var(--maincolor);
     color: white;
     text-align: left;
     vertical-align:middle;
     font-size: 18px;
     padding: 14px 24px;
}
 .row-lightblue {
    /*height: 100px;
    */
     background-color: #C9EAFD;
     color: black;
     text-align: left;
     vertical-align:middle;
     font-size: 14px;
     font-weight: normal;
     padding: 14px 24px;
}
 .row-lightblue h2 {
     font-size: 18px;
     color: var(--maincolor);
}
 .row-lightblue h4 {
     font-size: 18px;
     color: var(--maincolor);
}
 .alert {
     margin-left: 200px;
}
 .mycheckbox {
     font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
     font-size: 12px;
     font-weight: normal;
     line-height: 1.42857;
     color: #333;
     text-align: left;
     position: relative;
     display: block;
     margin-top: 10px;
     margin-bottom: 10px;
     box-sizing: border-box;
}
 .panel-primary > .panel-heading {
     background-color: var(--maincolor);
}
 .text-info {
     color: var(--maincolor);
}
 .btn-primary {
     background-color: #009FE3 !important;
}
 .FormButtonsOutsideGrid {
     margin-bottom: 15px;
}

/* Max width before this PARTICULAR table gets nasty This query will take effect for any screen smaller than 760px and also iPads specifically. */
 @media only screen and (max-width: 550px), (min-device-width: 768px) and (max-device-width: 1024px) {
    /* Force table to not be like tables anymore */
     vacancytable, thead, tbody, th, td, tr {
         display: block;
         margin: auto;
         text-align: center;
    }
    /* Hide table headers (but not display: none;
    , for accessibility) */
     thead tr {
         position: absolute;
         top: -9999px;
         left: -9999px;
         margin: auto;
         text-align: center;
    }
     tr {
         border: 0px solid #ccc;
         margin: auto;
         text-align: center;
    }
     td {
        /* Behave like a "row" */
         border: none;
         border-bottom: 0px solid #eee;
         position: relative;
         padding-left: 50%;
         margin: auto;
         text-align: center;
    }
     td:before {
        /* Now like a table header */
         position: absolute;
        /* Top/left values mimic padding */
         top: 6px;
         left: 6px;
         width: 45%;
         padding-right: 10px;
         white-space: nowrap;
         margin: auto;
         text-align: center;
    }
}
 .summary {
     color: #F27052;
}
 .pagination {
     color: var(--maincolor);
     font-size: 11px;
}
 .leavewhitespace {
     width: 100%;
     height: 20px;
}
 .preventdoublescrollbar {
     overflow-x: hidden;
     overflow-y: hidden;
     overflow:hidden;
}
/*full calender allow multiline events*/
 .fc-day-grid-event > .fc-content {
     white-space: normal;
}
 .modal-megamenu {
     width:75%;
     height:75%;
}
 .modal-body {
     max-height:800px;
     overflow:auto;
}
 .modal-dialog{
     overflow-y: initial !important 
}
 .modal {
     margin-top: 10px;
}
 .modal-header{
     padding-bottom: 0;
     padding-top: 10px;
     padding-left: 20px;
     padding-right: 20px;
}
 #modalHeaderTitle h4 {
     margin-top: 1px;
     margin-bottom: 1px 
}
/*Making bootstrap forms more compact*/
 .form {
     font-size: 0.8em;
}
 .form-control {
     padding: 2px 2px;
     height: 24px;
     font-size:1em;
}
 .form label {
     margin-top:1px;
     margin-bottom: 1px;
}
 .form-group {
     margin-top:1px;
}
/* .form-group .select2-container {
     position: relative;
     z-index: 2;
     float: left;
     width: 100%;
     margin-bottom: 0;
     display: table;
     table-layout: fixed;
}
 .input-group .select2-container {
     position: relative;
     z-index: 2;
     float: left;
     width: 100%;
     margin-bottom: 0;
     display: table;
     table-layout: fixed;
}
 .panel-primary {
     border-color: var(--maincolor);
}
 .panel {
     border-color: var(--maincolor);
     box-shadow: 0px 1px 1px var(--maincolor);
}
 .panel-title {
     background-color: var(--maincolor);
}
 */
 .table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th, .table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
     padding: 2px;
     line-height: 1.0;
     vertical-align: middle;
}
 .table-bordered > thead > tr > th, .table-bordered > thead > tr > td {
     border-bottom-width: 4px;
}
 .kv-expand-detail-row td {
     background-color: #ffffff !important;
}
 .kv-expanded-row{
     line-height: 1.4 !important;
}
 .input-group-addon {
     padding: 0px 0px ;
     font-size: 12px ;
}
 .truncate {
     max-width: 150px !important;
     overflow: hidden;
     white-space: nowrap;
     text-overflow: ellipsis;
}
 .truncate:hover{
     overflow: visible;
     white-space: normal;
     width: auto;
}
 .filters {
     border: 1px solid #f4f4f4 !important;
     white-space: nowrap;
     vertical-align: middle !important;
     border-bottom-width: 1px;
     border-bottom-color: rgb(51, 51, 51) !important;
     rgb(51, 51, 51);
     padding: 2px;
}
 .filters td {
     border: 1px solid #f4f4f4 !important;
     border-bottom-width: 1px;
     border-bottom-color: rgb(51, 51, 51) !important;
}
 .panel-info > .panel-heading {
     color: #31708f;
     background-color: #d9edf7;
     border-color: #bce8f1;
}
 .panel-heading {
     padding: 15px 15px;
     border-bottom: 1px solid transparent;
     border-bottom-color: transparent;
     border-top-left-radius: 3px;
     border-top-right-radius: 3px;
     background-color: #009FE3 !important;
     color: #ffffff !important;
     font-size: 14px;
}
 .panel{
     font-size: 12px;
     margin-bottom: 5px;
}
 .panel-title{
     margin-top: -10px;
}
 .panel-info .kv-action-btn {
     color: #31708f;
}
 .kv-action-btn {
     margin: 0 2px;
     padding: 0 5px;
     background: 0 0;
     border: none;
     font-size: 16px;
}
 input[type="radio"], input[type="checkbox"] {
     margin: unset;
}
 .select2-container .select2-selection--single {
     height: 24px;
     line-height: 24px;
}
 .select2-container--krajee .select2-selection--single .select2-selection__arrow {
     height: 24px;
}
 .select2-container--krajee .select2-selection {
     font-size: 12px;
}
 .select2-container .select2-selection--single .select2-selection__rendered {
     margin-top: -7px;
}
 .select2-container--krajee .select2-selection--single {
     height: 24px !important;
}
 .select2-container--krajee .select2-selection__clear {
     top: -0.2rem;
}
 .krajee-default.file-preview-frame .kv-file-content {
     width: 100px;
     height: 100px;
}
 .content-header {
     padding: 5px 5px 0 5px !important;
}
 #duo_iframe {
     width: 100%;
     min-width: 304px;
     max-width: 620px;
     height: 330px;
     border: none;
     margin: 0 auto;
     display: block;
}
 .abutton{
     color: #3c8dbc;
     font-size: 14px;
     line-height: 1.5;
     border-radius: 3px;
     background:none!important;
     border:none;
     padding:0!important;
     font: inherit;
     cursor: pointer;
}
/*setting smaller left bar*/
 .content-wrapper, .right-side, .main-footer {
     margin-left: 180px;
}
 .main-sidebar, .left-side {
     width: 180px;
}
 .sidebar-menu > li > a {
     padding: 5px 5px 5px 15px;
}
/* setting navbar margin .main-header > .navbar {
     margin-left: 0;
}
 */
/*setting breadcrumbs in top bar*/
 .breadcrumbs {
     padding-left: 50;
     padding-top: 15px;
     margin-left: 100px;
     margin-bottom: 30px;
     list-style: outside none none;
     border-radius: 4px;
     color: white;
     position: absolute;
}
 .breadcrumbs li a {
     color: white;
}
 .breadcrumbs > li {
     display: inline-block;
}
 .breadcrumbs li+li:before {
     content:"» ";
}
/*setting the dropdowns in the top bar*/
 .dropbackgroundbody{
     background-color:WhiteSmoke;
}
 .dropbackgroundfooter{
     background-color:lightgrey!important;
}
 .dropdown-menu > li.footer > a {
     background-color:lightgrey!important;
}
/*setting the color for the index header with the buttons*/
 .kv-panel-before {
     padding: 0px;
     background-color:#f5f5f5 !important;
}
 .kv-panel-after {
     background-color:#f5f5f5 !important;
     display: none;
}
 .panelBeforeBlue {
     background-color:var(--maincolor) !important;
}
 .panelBeforeText {
     padding-top: 10px;
     margin-left: 20px;
     color: white;
}
 .panelBeforeIndexText {
     padding-top: 10px;
     margin-left: 20px;
     color: black;
}
 .panel-footer {
     height: 50px;
}
 .nav-tabs > li > a {
     padding: 5px 5px ;
}
/*using \borales\extensions\phoneInput\PhoneInput in vertical form*/
 .intl-tel-input {
     display: block;
}

.nobutton {
    background:none;
    border:none;
    padding:5;
}

.strikethrough {
    text-decoration: line-through;
}