@import url('https://fonts.googleapis.com/css?family=Lato:400,700|Montserrat:400,700|PT+Sans:400,700');
/*font-family: 'PT Sans', sans-serif;
font-family: 'Lato', sans-serif;
font-family: 'Montserrat', sans-serif;*/


@keyframes slideInUp {
  from {
    visibility: visible;
    transform: translate3d(0, 100%, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
.animated {
  animation-duration: 0.4s;
  animation-fill-mode: both;
}

.slideInUp {
  animation-name: slideInUp;
}
.mx-scrollcontainer-wrapper{
  padding:0!important;
}
/* .mx-scrollcontainer-fixed > .mx-scrollcontainer-middle > .mx-scrollcontainer-wrapper,
 .mx-scrollcontainer-fixed > .mx-scrollcontainer-left > .mx-scrollcontainer-wrapper,
  .mx-scrollcontainer-fixed > .mx-scrollcontainer-center > .mx-scrollcontainer-wrapper,
   .mx-scrollcontainer-fixed > .mx-scrollcontainer-right > .mx-scrollcontainer-wrapper{
  overflow: hidden!important;
} */
@keyframes slideInDown {
  from {
    visibility: visible;
    transform: translate3d(0, -100%, 0);
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
.slideInDown {
  animation-name: slideInDown;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeIn {
  animation-name: fadeIn;
}





/* .mx-scrollcontainer .mx-scrollcontainer-wrapper {
  padding: 0;
  overflow-x: hidden!important;
  height: 100%!important;
}
*/
.menubar-landing + .mx-layoutcontainer-middle .mx-layoutcontainer-nested, .menubar-landing + .mx-scrollcontainer-middle .mx-scrollcontainer-nested{
    height: 100%!important;
}



.mx-scrollcontainer .mx-scrollcontainer-wrapper .mx-layoutgrid-fixed {
  width: 100%;
  margin: auto;
}
@media (min-width: 768px) {
  .mx-scrollcontainer .mx-scrollcontainer-wrapper .mx-layoutgrid-fixed {
    max-width: 750px;
  }
}
@media (min-width: 992px) {
  .mx-scrollcontainer .mx-scrollcontainer-wrapper .mx-layoutgrid-fixed {
    max-width: 970px;
  }
}
@media (min-width: 1200px) {
  .mx-scrollcontainer .mx-scrollcontainer-wrapper .mx-layoutgrid-fixed {
    max-width: 1170px;
  }
}

.mx-scrollcontainer .mx-placeholder {
  width: 100%;
  height: 100%;
}
@media (max-width: 767px) {
  .mx-scrollcontainer .mx-placeholder .mx-layoutgrid {
    padding: 15px 15px 15px 15px;
  }
}
@media (min-width: 768px) {
  .mx-scrollcontainer .mx-placeholder .mx-layoutgrid {
    padding: 30px 30px 30px 30px;
  }
}
@media (min-width: 992px) {
  .mx-scrollcontainer .mx-placeholder .mx-layoutgrid {
    padding: 30px 30px 30px 30px;
  }
}
.mx-scrollcontainer .mx-placeholder .mx-layoutgrid .mx-layoutgrid {
  padding: 0;
}

/* ==========================================================================
   Base

   Default settings
========================================================================== */
html {
  height: 100%;
    font-size: 14px;
}

body {
  min-height: 100%;
  color: #555555;
  background-color: #FFFFFF;
  font-family: 'Lato', sans-serif;
  font-size: 14px;
  font-weight: normal;
  line-height: 1.42857;
  overflow-x: hidden!important;
}
html, body {
    font-size: 14px;
}

a {
  -webkit-transition: 0.25s;
  -moz-transition: 0.25s;
  -o-transition: 0.25s;
  transition: 0.25s;
  color: #0595DB;
  -webkit-backface-visibility: hidden;
}

a:hover {
  text-decoration: underline;
  color: #036290;
}

a:focus {
  outline: thin dotted;
}

a:active,
a:hover {
  outline: 0;
}

input:focus,
button:focus,
.mx-link:focus {
  outline: 0;
}

div[tabindex] {
  outline: 0;
}

.disabled,
[disabled] {
  cursor: not-allowed;
  opacity: 0.65;
  -webkit-box-shadow: none;
  box-shadow: none;
  filter: alpha(opacity=65);
}
input[type=date]{
  line-height: 1.42857!important;
}
/* ==========================================================================
   Inputs

   The form-control class style all inputs
========================================================================== */
.form-control {
  display: block;
  width: 100%;
  height: auto;
  padding: 8px 10px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -moz-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  color: #555555;
  border: 1px solid #D7D7D7;
  border-radius: 3px;
  background-color: #FFF;
  background-image: none;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-size: 14px;
  line-height: 1.42857;
  -moz-appearance: none;
  -webkit-appearance: none;
}

[dir="rtl"]  .form-control {
 /*padding: 0 30px 0 5px!important; */
}

.form-control:focus {
  border-color: #0595DB;
  outline: 0;
  background-color: #FFF;
  -webkit-box-shadow: none;
  box-shadow: none;
}

textarea.form-control {
  height: auto;
}

select.form-control {
   padding-right: 30px; 
  /*padding-right: 10px;*/
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15px' height='8px'><polyline id='Line' fill='none' stroke='%23555555' points='0.5 0.5 6 6 11.545361 0.5'></polyline></svg>");
  background-repeat: no-repeat;
  background-position: calc(100% - 10px) center;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance:none;
}

.form-control-lined {
  border: 0;
  border-bottom: 1px solid #D7D7D7;
  border-radius: 0;
  background-color: transparent;
}
.form-control-lined:focus {
  background-color: transparent;
}

.form-control-static, .form-group div[class*="textBox"] > label,
.form-group div[class*="textArea"] > label,
.form-group div[class*="datePicker"] > label {
  overflow: hidden;
  min-height: auto;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 10px;
  border-bottom: 1px solid #F0F0EE;
  font-size: 14px;
  line-height: 1.42857;
}

.xl-field input.form-control{
    font-size: 30px
}
.mx-textarea label {
  height: auto;
}

.mx-fileinput {
  /* File input widget hover fix */
}
.mx-fileinput .mx-wrapped-label {
  display: inline-block;
  width: 200px;
  margin: 5px;
}
.mx-fileinput .mx-wrapped-form{
  overflow: initial!important;
}
.mx-fileinput .mx-wrapped-form .mx-wrapped-input {
  cursor: pointer;
}
.mx-fileinput .mx-wrapped-form .mx-fileinput-upload-button:hover {
  background-color: #FFF;
}

.form-group {
  margin-bottom: 15px;
}
.form-group > [class*="col-"] {
  padding-right: 15px;
  padding-left: 15px;
}

 .form-group .control-label {
  /*color: #666;
  font-size: 1.471em;
  font-weight: 400;
  font-family: 'Montserrat';*/
}

@media (min-width: 768px) {
  .form-horizontal .control-label {
    padding-top: 8px;
    padding-bottom: 8px;
    line-height: 1.42857;
  }
}

@media only screen and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 0) {
  input[type=date],
  input[type=time],
  input[type=datetime-local],
  input[type=month] {
    line-height: 1;
  }
}
/* ==========================================================================
   Alerts

   Default Bootstrap Alert boxes. Provide contextual feedback messages for typical user actions with the handful of available and flexible alert messages
========================================================================== */
.alert {
  margin-top: 0;
  padding: 15px;
  border: 0;
  border-radius: 4px;
}

.alert-bordered {
  border: 1px solid;
}

.alert-success {
  color: #477901;
  border-color: #538d01;
  background-color: #e4f4cc;
}

.alert-info {
  color: #2b6a94;
  border-color: #327bad;
  background-color: #daeffd;
}

.alert-warning {
  color: #955d11;
  border-color: #ae6d14;
  background-color: #feebd2;
}

.alert-danger {
  color: #8e1116;
  border-color: #a61419;
  background-color: #fbd2d3;
}

.has-error .alert {
  margin-top: 8px;
  margin-bottom: 0;
}

[dir="rtl"] .has-error .alert {
  text-align: right!important;
}
/* ==========================================================================
   Backgrounds

   Different background components, all managed by variables
========================================================================== */
.background-main {
  background-color: #FFFFFF !important;
}

.background-secondary {
  background-color: #F5F8FD !important;
}

.background-default {
  background-color: #DDDDDD !important;
}

.background-default-darker {
  background-color: #858585 !important;
}

.background-default-dark {
  background-color: #9b9b9b !important;
}

.background-default-light {
  background-color: #ebebeb !important;
}

.background-default-lighter {
  background-color: #f8f8f8 !important;
}

.background-inverse {
  background-color: #252C36 !important;
}

.background-inverse-darker {
  background-color: #161a20 !important;
}

.background-inverse-dark {
  background-color: #1a1f26 !important;
}

.background-inverse-light {
  background-color: #7c8086 !important;
}

.background-inverse-lighter {
  background-color: #d3d5d7 !important;
}

.background-primary {
  background-color: #0595DB !important;
}

.background-primary-darker {
  background-color: #035983 !important;
}

.background-primary-dark {
  background-color: #046899 !important;
}

.background-primary-light {
  background-color: #69bfe9 !important;
}

.background-primary-lighter {
  background-color: #cdeaf8 !important;
}

.background-info {
  background-color: #48B0F7 !important;
}

.background-info-darker {
  background-color: #2b6a94 !important;
}

.background-info-dark {
  background-color: #327bad !important;
}

.background-info-light {
  background-color: #91d0fa !important;
}

.background-info-lighter {
  background-color: #daeffd !important;
}

.background-success {
  background-color: #76CA02 !important;
}

.background-success-darker {
  background-color: #477901 !important;
}

.background-success-dark {
  background-color: #538d01 !important;
}

.background-success-light {
  background-color: #addf67 !important;
}

.background-success-lighter {
  background-color: #e4f4cc !important;
}

.background-warning {
  background-color: #F99B1D !important;
}

.background-warning-darker {
  background-color: #955d11 !important;
}

.background-warning-dark {
  background-color: #ae6d14 !important;
}

.background-warning-light {
  background-color: #fbc377 !important;
}

.background-warning-lighter {
  background-color: #feebd2 !important;
}

.background-danger {
  background-color: #ED1C24 !important;
}

.background-danger-darker {
  background-color: #8e1116 !important;
}

.background-danger-dark {
  background-color: #a61419 !important;
}

.background-danger-light {
  background-color: #f4777c !important;
}

.background-danger-lighter {
  background-color: #fbd2d3 !important;
}

.background-brand-gradient {
  background-image: linear-gradient(152deg, #0CC7F0 0%, #087ECC 51%, #077AC9 55%, #0659B9 78%) !important;
}

/* ==========================================================================
   Buttons

   Default Bootstrap and Mendix Buttons
========================================================================== */
.btn,
.mx-button {
  display: inline-block;
  margin-bottom: 0;
  padding: 0.6em 1em;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  color: #0595DB;
  border: 1px solid transparent;
  border-radius: 4px;
  background-color: #FFF;
  background-image: none;
  box-shadow: none;
  text-shadow: none;
  font-size: 1em;
  line-height: 1.42857;
  font-family: 'Lato', sans-serif;

}
.btn:hover, .btn:focus, .btn:active,
.mx-button:hover,
.mx-button:focus,
.mx-button:active {
  outline: none;
  box-shadow: none;
}

.mx-link {
  padding: 0;
  color: #0595DB;
}
.mx-link a {
  color: inherit;
}

.btn img,
.mx-button img,
.mx-link img {
  height: 18px;
  margin-top: -1px;
  margin-right: 5px;
}

.dj_ie8 .mx-link {
  margin-right: 0;
  white-space: normal;
}

.btn,
.btn-default {
  color: #0595DB;
  border-color: #DDDDDD;
  background-color: #FFF;
}
.btn:hover, .btn:focus, .btn:active, .btn.active, .open > .btn.dropdown-toggle,
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.btn-default.active, .open >
.btn-default.dropdown-toggle {
  color: #0595DB;
  border-color: #DDDDDD;
  background-color: #DDDDDD;
}
.btn:active, .btn.active, .open > .btn.dropdown-toggle,
.btn-default:active,
.btn-default.active, .open >
.btn-default.dropdown-toggle {
  background-image: none;
}
.btn.disabled, .btn.disabled:hover, .btn.disabled:focus, .btn.disabled:active, .btn.disabled.active, .btn[disabled], .btn[disabled]:hover, .btn[disabled]:focus, .btn[disabled]:active, .btn[disabled].active,
.btn fieldset[disabled],
.btn fieldset[disabled]:hover,
.btn fieldset[disabled]:focus,
.btn fieldset[disabled]:active,
.btn fieldset[disabled].active,
.btn-default.disabled,
.btn-default.disabled:hover,
.btn-default.disabled:focus,
.btn-default.disabled:active,
.btn-default.disabled.active,
.btn-default[disabled],
.btn-default[disabled]:hover,
.btn-default[disabled]:focus,
.btn-default[disabled]:active,
.btn-default[disabled].active,
.btn-default fieldset[disabled],
.btn-default fieldset[disabled]:hover,
.btn-default fieldset[disabled]:focus,
.btn-default fieldset[disabled]:active,
.btn-default fieldset[disabled].active {
  border-color: #DDDDDD;
  background-color: #FFF;
}
.btn.btn-bordered,
.btn-default.btn-bordered {
  background-color: transparent;
}
.btn.btn-bordered:hover, .btn.btn-bordered:focus, .btn.btn-bordered:active, .btn.btn-bordered.active, .open > .btn.btn-bordered.dropdown-toggle,
.btn-default.btn-bordered:hover,
.btn-default.btn-bordered:focus,
.btn-default.btn-bordered:active,
.btn-default.btn-bordered.active, .open >
.btn-default.btn-bordered.dropdown-toggle {
  color: #0595DB;
  border-color: #DDDDDD;
  background-color: #DDDDDD;
}
.btn.btn-link,
.btn-default.btn-link {
  text-decoration: none;
  border-color: transparent;
  background-color: transparent;
}
.btn.btn-link:hover,
.btn-default.btn-link:hover {
  border-color: #EEEEEE;
  background-color: #EEEEEE;
}

.btn-primary, .datagrid-fullsearch.mx-grid .mx-grid-search-button {
  color: #FFF;
  border-color: #0595DB;
  background-color: #0595DB;
}
.btn-primary:hover, .datagrid-fullsearch.mx-grid .mx-grid-search-button:hover, .btn-primary:focus, .datagrid-fullsearch.mx-grid .mx-grid-search-button:focus, .btn-primary:active, .datagrid-fullsearch.mx-grid .mx-grid-search-button:active, .btn-primary.active, .datagrid-fullsearch.mx-grid .active.mx-grid-search-button, .open > .btn-primary.dropdown-toggle, .datagrid-fullsearch.mx-grid .open > .dropdown-toggle.mx-grid-search-button {
  color: #FFF;
  border-color: #0477af;
  background-color: #0477af;
}
.btn-primary:active, .datagrid-fullsearch.mx-grid .mx-grid-search-button:active, .btn-primary.active, .datagrid-fullsearch.mx-grid .active.mx-grid-search-button, .open > .btn-primary.dropdown-toggle, .datagrid-fullsearch.mx-grid .open > .dropdown-toggle.mx-grid-search-button {
  background-image: none;
}
.btn-primary.disabled, .datagrid-fullsearch.mx-grid .disabled.mx-grid-search-button, .btn-primary.disabled:hover, .datagrid-fullsearch.mx-grid .disabled.mx-grid-search-button:hover, .btn-primary.disabled:focus, .datagrid-fullsearch.mx-grid .disabled.mx-grid-search-button:focus, .btn-primary.disabled:active, .datagrid-fullsearch.mx-grid .disabled.mx-grid-search-button:active, .btn-primary.disabled.active, .datagrid-fullsearch.mx-grid .disabled.active.mx-grid-search-button, .btn-primary[disabled], .datagrid-fullsearch.mx-grid [disabled].mx-grid-search-button, .btn-primary[disabled]:hover, .datagrid-fullsearch.mx-grid [disabled].mx-grid-search-button:hover, .btn-primary[disabled]:focus, .datagrid-fullsearch.mx-grid [disabled].mx-grid-search-button:focus, .btn-primary[disabled]:active, .datagrid-fullsearch.mx-grid [disabled].mx-grid-search-button:active, .btn-primary[disabled].active, .datagrid-fullsearch.mx-grid [disabled].active.mx-grid-search-button,
.btn-primary fieldset[disabled],
.datagrid-fullsearch.mx-grid .mx-grid-search-button fieldset[disabled],
.btn-primary fieldset[disabled]:hover,
.datagrid-fullsearch.mx-grid .mx-grid-search-button fieldset[disabled]:hover,
.btn-primary fieldset[disabled]:focus,
.datagrid-fullsearch.mx-grid .mx-grid-search-button fieldset[disabled]:focus,
.btn-primary fieldset[disabled]:active,
.datagrid-fullsearch.mx-grid .mx-grid-search-button fieldset[disabled]:active,
.btn-primary fieldset[disabled].active,
.datagrid-fullsearch.mx-grid .mx-grid-search-button fieldset[disabled].active {
  border-color: #0595DB;
  background-color: #0595DB;
}
.btn-primary.btn-bordered, .datagrid-fullsearch.mx-grid .btn-bordered.mx-grid-search-button {
  background-color: transparent;
  color: #0595DB;
}
.btn-primary.btn-bordered:hover, .datagrid-fullsearch.mx-grid .btn-bordered.mx-grid-search-button:hover, .btn-primary.btn-bordered:focus, .datagrid-fullsearch.mx-grid .btn-bordered.mx-grid-search-button:focus, .btn-primary.btn-bordered:active, .datagrid-fullsearch.mx-grid .btn-bordered.mx-grid-search-button:active, .btn-primary.btn-bordered.active, .datagrid-fullsearch.mx-grid .btn-bordered.active.mx-grid-search-button, .open > .btn-primary.btn-bordered.dropdown-toggle, .datagrid-fullsearch.mx-grid .open > .btn-bordered.dropdown-toggle.mx-grid-search-button {
  color: #FFF;
  border-color: #0595DB;
  background-color: #0595DB;
}
.btn-primary.btn-link, .datagrid-fullsearch.mx-grid .btn-link.mx-grid-search-button {
  text-decoration: none;
  border-color: transparent;
  background-color: transparent;
  color: #0595DB;
}
.btn-primary.btn-link:hover, .datagrid-fullsearch.mx-grid .btn-link.mx-grid-search-button:hover {
  border-color: #EEEEEE;
  background-color: #EEEEEE;
}

.btn-inverse {
  color: #FFF;
  border-color: #252C36;
  background-color: #252C36;
}
.btn-inverse:hover, .btn-inverse:focus, .btn-inverse:active, .btn-inverse.active, .open > .btn-inverse.dropdown-toggle {
  color: #FFF;
  border-color: #51565e;
  background-color: #51565e;
}
.btn-inverse:active, .btn-inverse.active, .open > .btn-inverse.dropdown-toggle {
  background-image: none;
}
.btn-inverse.disabled, .btn-inverse.disabled:hover, .btn-inverse.disabled:focus, .btn-inverse.disabled:active, .btn-inverse.disabled.active, .btn-inverse[disabled], .btn-inverse[disabled]:hover, .btn-inverse[disabled]:focus, .btn-inverse[disabled]:active, .btn-inverse[disabled].active,
.btn-inverse fieldset[disabled],
.btn-inverse fieldset[disabled]:hover,
.btn-inverse fieldset[disabled]:focus,
.btn-inverse fieldset[disabled]:active,
.btn-inverse fieldset[disabled].active {
  border-color: #252C36;
  background-color: #252C36;
}
.btn-inverse.btn-bordered {
  background-color: transparent;
  color: #252C36;
}
.btn-inverse.btn-bordered:hover, .btn-inverse.btn-bordered:focus, .btn-inverse.btn-bordered:active, .btn-inverse.btn-bordered.active, .open > .btn-inverse.btn-bordered.dropdown-toggle {
  color: #FFF;
  border-color: #252C36;
  background-color: #252C36;
}
.btn-inverse.btn-link {
  text-decoration: none;
  border-color: transparent;
  background-color: transparent;
  color: #252C36;
}
.btn-inverse.btn-link:hover {
  border-color: #EEEEEE;
  background-color: #EEEEEE;
}

.btn-success {
  color: #FFF;
  border-color: #76CA02;
  background-color: #76CA02;
}
.btn-success:hover, .btn-success:focus, .btn-success:active, .btn-success.active, .open > .btn-success.dropdown-toggle {
  color: #FFF;
  border-color: #5ea202;
  background-color: #5ea202;
}
.btn-success:active, .btn-success.active, .open > .btn-success.dropdown-toggle {
  background-image: none;
}
.btn-success.disabled, .btn-success.disabled:hover, .btn-success.disabled:focus, .btn-success.disabled:active, .btn-success.disabled.active, .btn-success[disabled], .btn-success[disabled]:hover, .btn-success[disabled]:focus, .btn-success[disabled]:active, .btn-success[disabled].active,
.btn-success fieldset[disabled],
.btn-success fieldset[disabled]:hover,
.btn-success fieldset[disabled]:focus,
.btn-success fieldset[disabled]:active,
.btn-success fieldset[disabled].active {
  border-color: #76CA02;
  background-color: #76CA02;
}
.btn-success.btn-bordered {
  background-color: transparent;
  color: #76CA02;
}
.btn-success.btn-bordered:hover, .btn-success.btn-bordered:focus, .btn-success.btn-bordered:active, .btn-success.btn-bordered.active, .open > .btn-success.btn-bordered.dropdown-toggle {
  color: #FFF;
  border-color: #76CA02;
  background-color: #76CA02;
}
.btn-success.btn-link {
  text-decoration: none;
  border-color: transparent;
  background-color: transparent;
  color: #76CA02;
}
.btn-success.btn-link:hover {
  border-color: #EEEEEE;
  background-color: #EEEEEE;
}

.btn-info {
  color: #FFF;
  border-color: #48B0F7;
  background-color: #48B0F7;
}
.btn-info:hover, .btn-info:focus, .btn-info:active, .btn-info.active, .open > .btn-info.dropdown-toggle {
  color: #FFF;
  border-color: #3a8dc6;
  background-color: #3a8dc6;
}
.btn-info:active, .btn-info.active, .open > .btn-info.dropdown-toggle {
  background-image: none;
}
.btn-info.disabled, .btn-info.disabled:hover, .btn-info.disabled:focus, .btn-info.disabled:active, .btn-info.disabled.active, .btn-info[disabled], .btn-info[disabled]:hover, .btn-info[disabled]:focus, .btn-info[disabled]:active, .btn-info[disabled].active,
.btn-info fieldset[disabled],
.btn-info fieldset[disabled]:hover,
.btn-info fieldset[disabled]:focus,
.btn-info fieldset[disabled]:active,
.btn-info fieldset[disabled].active {
  border-color: #48B0F7;
  background-color: #48B0F7;
}
.btn-info.btn-bordered {
  background-color: transparent;
  color: #48B0F7;
}
.btn-info.btn-bordered:hover, .btn-info.btn-bordered:focus, .btn-info.btn-bordered:active, .btn-info.btn-bordered.active, .open > .btn-info.btn-bordered.dropdown-toggle {
  color: #FFF;
  border-color: #48B0F7;
  background-color: #48B0F7;
}
.btn-info.btn-link {
  text-decoration: none;
  border-color: transparent;
  background-color: transparent;
  color: #48B0F7;
}
.btn-info.btn-link:hover {
  border-color: #EEEEEE;
  background-color: #EEEEEE;
}

.btn-warning {
  color: #FFF;
  border-color: #F99B1D;
  background-color: #F99B1D;
}
.btn-warning:hover, .btn-warning:focus, .btn-warning:active, .btn-warning.active, .open > .btn-warning.dropdown-toggle {
  color: #FFF;
  border-color: #c77c17;
  background-color: #c77c17;
}
.btn-warning:active, .btn-warning.active, .open > .btn-warning.dropdown-toggle {
  background-image: none;
}
.btn-warning.disabled, .btn-warning.disabled:hover, .btn-warning.disabled:focus, .btn-warning.disabled:active, .btn-warning.disabled.active, .btn-warning[disabled], .btn-warning[disabled]:hover, .btn-warning[disabled]:focus, .btn-warning[disabled]:active, .btn-warning[disabled].active,
.btn-warning fieldset[disabled],
.btn-warning fieldset[disabled]:hover,
.btn-warning fieldset[disabled]:focus,
.btn-warning fieldset[disabled]:active,
.btn-warning fieldset[disabled].active {
  border-color: #F99B1D;
  background-color: #F99B1D;
}
.btn-warning.btn-bordered {
  background-color: transparent;
  color: #F99B1D;
}
.btn-warning.btn-bordered:hover, .btn-warning.btn-bordered:focus, .btn-warning.btn-bordered:active, .btn-warning.btn-bordered.active, .open > .btn-warning.btn-bordered.dropdown-toggle {
  color: #FFF;
  border-color: #F99B1D;
  background-color: #F99B1D;
}
.btn-warning.btn-link {
  text-decoration: none;
  border-color: transparent;
  background-color: transparent;
  color: #F99B1D;
}
.btn-warning.btn-link:hover {
  border-color: #EEEEEE;
  background-color: #EEEEEE;
}

.btn-danger {
  color: #FFF;
  border-color: #ED1C24;
  background-color: #ED1C24;
}
.btn-danger:hover, .btn-danger:focus, .btn-danger:active, .btn-danger.active, .open > .btn-danger.dropdown-toggle {
  color: #FFF;
  border-color: #be161d;
  background-color: #be161d;
}
.btn-danger:active, .btn-danger.active, .open > .btn-danger.dropdown-toggle {
  background-image: none;
}
.btn-danger.disabled, .btn-danger.disabled:hover, .btn-danger.disabled:focus, .btn-danger.disabled:active, .btn-danger.disabled.active, .btn-danger[disabled], .btn-danger[disabled]:hover, .btn-danger[disabled]:focus, .btn-danger[disabled]:active, .btn-danger[disabled].active,
.btn-danger fieldset[disabled],
.btn-danger fieldset[disabled]:hover,
.btn-danger fieldset[disabled]:focus,
.btn-danger fieldset[disabled]:active,
.btn-danger fieldset[disabled].active {
  border-color: #ED1C24;
  background-color: #ED1C24;
}
.btn-danger.btn-bordered {
  background-color: transparent;
  color: #ED1C24;
}
.btn-danger.btn-bordered:hover, .btn-danger.btn-bordered:focus, .btn-danger.btn-bordered:active, .btn-danger.btn-bordered.active, .open > .btn-danger.btn-bordered.dropdown-toggle {
  color: #FFF;
  border-color: #ED1C24;
  background-color: #ED1C24;
}
.btn-danger.btn-link {
  text-decoration: none;
  border-color: transparent;
  background-color: transparent;
  color: #ED1C24;
}
.btn-danger.btn-link:hover {
  border-color: #EEEEEE;
  background-color: #EEEEEE;
}

.btn-lg {
  font-size: 1.143em;
}
.btn-xl {
    font-size: 22px;
    padding: 37px inherit;
    margin-top: 60px;
}
.btn-lg img {
  height: calc($font-size-small + 4px);
}

.btn-sm {
  font-size: 12px;
}
.btn-sm img {
  height: calc($font-size-small + 4px);
}

.btn-image {
  padding: 0;
  vertical-align: middle;
  border-style: none;
  background-color: transparent;
}
.btn-image img {
  display: block;
  height: auto;
}
.btn-image:hover, .btn-image:focus {
  background-color: transparent;
}

.btn-icon > img, .btn-icon > .glyphicon {
  margin: 0;
}

.btn-icon-right > img, .btn-icon-right > .glyphicon {
  float: right;
  margin-left: 5px;
}

.btn-icon-top {
  padding-right: 0;
  padding-left: 0;
}
.btn-icon-top > img, .btn-icon-top > .glyphicon {
  display: block;
  margin: 0 0 5px 0;
}

.profile-phone .btn,
.profile-phone .mx-link {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
}
.profile-phone .btn:active,
.profile-phone .mx-link:active {
  -webkit-transform: translateY(1px);
  transform: translateY(1px);
}

/* ==========================================================================
   Grid

   Default Mendix Grid (used for Mendix Datagrid)
========================================================================== */
.mx-grid {
  padding: 0px;
  border: 0;
  border-radius: 0;
}
.mx-grid .mx-grid-controlbar {
  margin: 10px 0;
  /* Paging */
}
.mx-grid .mx-grid-controlbar .mx-grid-pagingbar {
  /* Buttons */
  /* Text Paging .. to .. to .. */
}
.mx-grid .mx-grid-controlbar .mx-grid-pagingbar .mx-button {
  padding: 6px;
  color: #888888;
  border-color: transparent;
  background-color: transparent;
}
.mx-grid .mx-grid-controlbar .mx-grid-pagingbar .mx-button:hover {
  color: #0595DB;
  border-color: transparent;
  background-color: transparent;
}
.mx-grid .mx-grid-controlbar .mx-grid-pagingbar .mx-grid-paging-status {
  padding: 0 8px 8px;
}
.mx-grid .mx-grid-searchbar {
  margin: 10px 0;
}
.mx-grid .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-label {
  vertical-align: middle;
}
.mx-grid .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-label label {
  padding-top: 5px;
}
.mx-grid .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-input .form-control {
  height: 28px;
  font-size: 11px;
}
.mx-grid .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-input select.form-control {
  padding: 3px;
  vertical-align: middle;
}
.mx-grid .mx-grid-searchbar .mx-grid-search-item .mx-grid-search-input .mx-button {
  height: 28px;
  padding-top: 2px;
  padding-bottom: 2px;
}

.mx-dataview .mx-grid {
  border: 0;
}

/* ==========================================================================
   Datagrid Default

   Default Mendix Datagrid Widget. The datagrid shows a list of objects in a grid
========================================================================== */
.mx-datagrid .mx-datagrid-head-table {
  border-width: 0;
  background-color: transparent;
  /* Table header */
}
.mx-datagrid .mx-datagrid-head-table th {
  border-style: solid;
  border-color: #D7D7D7;
  border-top-width: 0;
  border-right: 0;
  border-bottom-width: 1px;
  border-left: 0;
  background-color: transparent;
}
.mx-datagrid .mx-datagrid-head-table .mx-datagrid-head-wrapper {
  padding: 15px 15px;
  vertical-align: middle;
}
@media (max-width: 992px) {
  .mx-datagrid .mx-datagrid-head-table .mx-datagrid-head-wrapper {
    padding: 15px 5px!important;
  }
}

.mx-datagrid .mx-datagrid-head-table .mx-datagrid-head-wrapper .mx-datagrid-head-caption {
  white-space: normal;
}
.mx-datagrid .mx-datagrid-body-table {
  border-width: 0;
  /* Table Body */
  /* Table Footer */
}
.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr td {
  padding: 15px 15px 15px 15px;
  vertical-align: middle;
  border-width: 0;
  border-color: #D7D7D7;
  /* border-bottom-width: 1px;
  border-bottom-style: solid;
  background-color: #FFF; */
  /* Text without spaces */
}

.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr:nth-child(odd){
  background: #f9f9f9;
}

.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr td:focus {
  outline: none;
}
.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr td .mx-datagrid-data-wrapper {
  text-overflow: ellipsis;
}
.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr.selected td, .mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr.selected:hover {
  /* color: #555555;
  background-color: #f3f3f3 !important; */
  color: #ffffff;
  /* background-color: #909090 !important; */
  background-color: #303942 !important;

}
.mx-datagrid .mx-datagrid-body-table .mx-datagrid-foot > tr > th {
  padding: 15px 15px 15px 15px;
  border-width: 0;
  background-color: #D7D7D7;
}
.mx-datagrid .mx-datagrid-body-table .mx-datagrid-foot > tr > td {
  padding: 15px 15px 15px 15px;
  border-width: 0;
  background-color: #FFF;
  font-weight: bold;
}
.mx-datagrid .mx-datagrid-body-table *:focus {
  outline: 0;
}

.datagrid-striped.mx-datagrid .mx-datagrid-head-table th {
  border-width: 0;
}
.datagrid-striped.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr td {
  border-top-width: 0;
}
.datagrid-striped.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr:nth-child(odd) td {
  background-color: #fbfbfb;
}

.datagrid-bordered.mx-datagrid .mx-datagrid-head-table th {
  border: 1px solid #D7D7D7;
  border-bottom-width: 1px;
}
.datagrid-bordered.mx-datagrid .mx-datagrid-body-table {
  border: 1px solid;
}
.datagrid-bordered.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr td {
  border: 1px solid #D7D7D7;
}
.datagrid-bordered.mx-datagrid .mx-datagrid-foot > tr > th {
  border-width: 0;
  background-color: #D7D7D7;
}
.datagrid-bordered.mx-datagrid .mx-datagrid-foot > tr > td {
  border-width: 1px;
}

.datagrid-transparent.mx-datagrid .mx-datagrid-head-table {
  background-color: transparent;
}
.datagrid-transparent.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr:nth-of-type(odd) {
  background-color: transparent;
}
.datagrid-transparent.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr td {
  background-color: transparent;
}

.datagrid-hover.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr:hover td {
  background-color: #f7f7f7 !important;
}
.datagrid-hover.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr.selected:hover td {
  background-color: #ebebeb !important;
}

.datagrid-lg.mx-datagrid .mx-datagrid-head-table .mx-datagrid-head-wrapper {
  padding: 30px 30px 30px 30px;
}
.datagrid-lg.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr td {
  padding: 30px 30px 30px 30px;
}

.datagrid-sm.mx-datagrid .mx-datagrid-head-table .mx-datagrid-head-wrapper {
  padding: 7.5px 7.5px 7.5px 7.5px;
}
.datagrid-sm.mx-datagrid .mx-datagrid-body-table .mx-datagrid-body tr td {
  padding: 7.5px 7.5px 7.5px 7.5px;
}

.datagrid-fullsearch.mx-grid .mx-grid-reset-button {
  display: none;
}
.datagrid-fullsearch.mx-grid .mx-grid-search-item {
  display: block;
}
.datagrid-fullsearch.mx-grid .mx-grid-search-label {
  display: none;
}
.datagrid-fullsearch.mx-grid .mx-grid-searchbar .mx-grid-search-controls {
  position: absolute;
  right: 0;
}
.datagrid-fullsearch.mx-grid .mx-grid-searchbar .mx-grid-search-input {
  width: 80%;
  padding-left: 0;
}
.datagrid-fullsearch.mx-grid .mx-grid-searchbar .mx-grid-search-input .form-control {
  height: 35px;
  font-size: 12px;
}

/* ==========================================================================
   Dataview

   Default Mendix Dataview Widget. The data view is used for showing the contents of exactly one object
========================================================================== */
.mx-dataview {
  /* Control bar */
  /* Dataview-content gives problems for nexted layout grid containers */
  /* Dataview empty message */
}
.mx-dataview .mx-dataview-controls {
  clear: both;
  margin-top: 10px;
  padding: 8px 0;
  border-top: 1px solid #D7D7D7;
  border-radius: 0;
  background-color: transparent;
  /* Buttons */
}
.mx-dataview .mx-dataview-controls .mx-button {
  margin-right: 0.3em;
  margin-bottom: 0;
}
.mx-dataview .mx-dataview-controls .mx-button:last-child {
  margin-right: 0;
}
.mx-dataview > .mx-dataview-content > .mx-container-nested > .row {
  margin-right: 0;
  margin-left: 0;
}
.mx-dataview .mx-dataview-message {
  color: #555555;
  background: #FFFFFF;
}

/* ==========================================================================
   Header

   Default Mendix Mobile Header
========================================================================== */
.mx-header {
  z-index: 100;
  display: flex;
  width: 100%;
  height: 45px;
  padding: 0;
  text-align: initial;
  color: #555;
  border-bottom: 1px solid #D7D7D7;
  background-color: #FFFFFF;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14);
}
.mx-header div.mx-header-left,
.mx-header div.mx-header-right {
  position: relative;
  top: initial;
  right: initial;
  left: initial;
  display: flex;
  align-items: center;
  width: 25%;
  height: 100%;
}
.mx-header div.mx-header-left .mx-placeholder,
.mx-header div.mx-header-right .mx-placeholder {
  display: flex;
  align-items: center;
  height: 100%;
}
.mx-header div.mx-header-left .mx-placeholder {
  order: 1;
}
.mx-header div.mx-header-left .mx-placeholder .mx-placeholder {
  justify-content: flex-start;
}
.mx-header div.mx-header-center {
  overflow: hidden;
  flex: 1;
  order: 2;
  text-align: center;
}
.mx-header div.mx-header-center .mx-title {
  overflow: hidden;
  width: 100%;
  margin: 0;
  text-overflow: ellipsis;
  color: #555;
  font-size: 17px;
  line-height: 45px;
}
.mx-header div.mx-header-right {
  order: 3;
}
.mx-header div.mx-header-right .mx-placeholder {
  justify-content: flex-end;
}
.mx-header .mx-link {
  display: flex;
  align-items: center;
  height: 100%;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
}
.mx-header .mx-link a {
  text-decoration: none;
}
.mx-header .mx-link .glyphicon {
  top: 0;
  font-size: 23px;
}
.mx-header .mx-link:active {
  -webkit-transform: translateY(1px);
  transform: translateY(1px);
  color: #036290;
}
.mx-header .mx-link,
.mx-header .btn,
.mx-header img {
  padding: 0 8px;
}
.mx-header .mx-sidebartoggle {
  font-size: 24px;
  line-height: 45px;
}
.mx-header .mx-sidebartoggle img {
  height: 20px;
}

body[dir="rtl"] .mx-header-left {
  order: 3;
}
body[dir="rtl"] .mx-header-right {
  order: 1;
}

/*
* Mendix Documentation
* Special styles for presenting components
*/
/*
* Dijit Widgets
*
* Default Dojo Dijit Widgets
*/
/*
 * Dijit Calendar Widget
 *
 * Used in dataviews
 */
.dijitCalendarContainer {
  /* (must be higher than popup z-index) */
  z-index: 10010 !important;
  padding: 10px;
  border: 1px solid #D1D6E4;
  border-radius: 4px;
  background: #FFFFFF;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.06);
  font-size: 12px;
}
.dijitCalendarContainer tr th {
  text-align: center;
  color: #0595DB;
}
.dijitCalendarContainer tr th,
.dijitCalendarContainer tr td {
  padding: 10px;
  text-align: center;
}
.dijitCalendarContainer tr td .dijitCalendarDateLabel {
  color: #2D3E4E;
}
.dijitCalendarContainer tr tfoot h3 {
  margin: 0;
  padding: 0;
  font-size: inherit;
}
.dijitCalendarContainer tr .dijitCalendarNextMonth span,
.dijitCalendarContainer tr .dijitCalendarPreviousMonth span {
  color: #abbecf;
}
.dijitCalendarContainer .dijitCalendarMonthLabel {
  color: #0595DB;
}
.dijitCalendarContainer .dijitButtonNode {
  border: 0;
}
.dijitCalendarContainer .dijitCalendarArrow {
  cursor: pointer;
}
.dijitCalendarContainer .dijitCalendarSelectedDate,
.dijitCalendarContainer .dijitCalendarSelectedDate:hover {
  border-radius: 50%;
  background: #0595DB;
}
.dijitCalendarContainer .dijitCalendarSelectedDate .dijitCalendarDateLabel,
.dijitCalendarContainer .dijitCalendarSelectedDate:hover .dijitCalendarDateLabel {
  color: #FFFFFF;
}
.dijitCalendarContainer .dijitCalendarHoveredDate {
  border-radius: 50%;
  background-color: #DDDDDD;
}
.dijitCalendarContainer .dijitCalendarHoveredDate .dijitCalendarDateLabel {
  color: #0595DB;
}
.dijitCalendarContainer .dijitCalendarYearContainer {
  text-align: center;
}
.dijitCalendarContainer .dijitCalendarYearContainer span {
  color: #7dd2fc;
}
.dijitCalendarContainer .dijitCalendarYearContainer span.dijitCalendarSelectedYear {
  color: #0595DB;
}
.dijitCalendarContainer .dijitCalendarYearContainer span:hover {
  text-decoration: underline;
  background-color: transparent;
}
.dijitCalendarContainer .dijitCalendarMonthContainer th:first-child {
  border-top-left-radius: 3px;
}
.dijitCalendarContainer .dijitCalendarMonthContainer th:last-child {
  border-top-right-radius: 3px;
}

.dijitCalendarMonthMenuPopup {
  /* (must be higher than popup z-index) */
  z-index: 10020 !important;
  padding: 3px 4px;
  border-radius: 3px;
  background-color: #26323D;
}
.dijitCalendarMonthMenuPopup .dijitCalendarMonthMenu {
  padding: 5px;
  border-style: none;
  background: none;
  font-size: 12px;
}
.dijitCalendarMonthMenuPopup .dijitCalendarMonthMenu .dijitCalendarMonthLabel {
  padding: 2px 0;
  color: #FFFFFF;
}
.dijitCalendarMonthMenuPopup .dijitCalendarMonthMenu .dijitCalendarMonthLabel:hover, .dijitCalendarMonthMenuPopup .dijitCalendarMonthMenu .dijitCalendarMonthLabel:focus {
  color: #4280CB;
}

.dj_rtl .dijitCalendarContainer .dijitCalendarMonthContainer th:first-child {
  border-top-left-radius: 0;
  border-top-right-radius: 3px;
}
.dj_rtl .dijitCalendarContainer .dijitCalendarMonthContainer th:last-child {
  border-top-left-radius: 3px;
  border-top-right-radius: 0;
}

/*
 * Dijit Tooltip Widget
 *
 * Default tooltip used for Mendix widgets
 */
.mx-tooltip .dijitTooltipContainer {
  border-width: 1px;
  border-color: #888888;
  border-radius: 4px;
  background: #FFFFFF;
  box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
}
.mx-tooltip .dijitTooltipContainer .mx-tooltip-content {
  padding: 10px;
}
.mx-tooltip .dijitTooltipContainer .form-group {
  margin-bottom: 5px;
}
.mx-tooltip .dijitTooltipConnector {
  width: 0;
  height: 0;
  margin-left: -10px;
  border-width: 10px 10px 10px 0;
  border-style: solid;
  border-color: transparent;
  border-right-color: #888888;
}

/*
 * Dijit Border Container
 *
 * Used in Mendix as split pane containers
 */
.dijitBorderContainer {
  padding: 5px;
  background-color: #FCFCFC;
}
.dijitBorderContainer .dijitSplitterV,
.dijitBorderContainer .dijitGutterV {
  width: 5px;
  border: 0;
  background: #FCFCFC;
}
.dijitBorderContainer .dijitSplitterH,
.dijitBorderContainer .dijitGutterH {
  height: 5px;
  border: 0;
  background: #FCFCFC;
}
.dijitBorderContainer .dijitSplitterH .dijitSplitterThumb {
  top: 2px;
  width: 19px;
  height: 1px;
  background: #B0B0B0;
}
.dijitBorderContainer .dijitSplitterV .dijitSplitterThumb {
  left: 2px;
  width: 1px;
  height: 19px;
  background: #B0B0B0;
}
.dijitBorderContainer .dijitSplitContainer-child,
.dijitBorderContainer .dijitBorderContainer-child {
  border: 1px solid #CCCCCC;
}
.dijitBorderContainer .dijitBorderContainer-dijitTabContainerTop,
.dijitBorderContainer .dijitBorderContainer-dijitTabContainerBottom,
.dijitBorderContainer .dijitBorderContainer-dijitTabContainerLeft,
.dijitBorderContainer .dijitBorderContainer-dijitTabContainerRight {
  border: none;
}
.dijitBorderContainer .dijitBorderContainer-dijitBorderContainer {
  padding: 0;
  border: none;
}
.dijitBorderContainer .dijitSplitterActive {
  /* For IE8 and earlier */
  margin: 0;
  opacity: 0.6;
  background-color: #AAAAAA;
  background-image: none;
  font-size: 1px;
  filter: alpha(opacity=60);
}
.dijitBorderContainer .dijitSplitContainer-dijitContentPane,
.dijitBorderContainer .dijitBorderContainer-dijitContentPane {
  padding: 5px;
  background-color: #FFFFFF;
}

/*
 * Dijit Menu Popup
 *
 * Used in datepickers and calendar widgets
 */
.dijitMenuPopup {
  margin-top: 10px;
}
.dijitMenuPopup .dijitMenu {
  display: block;
  width: 200px !important;
  margin-top: 0;
  padding: 12px 10px;
  border-radius: 3px;
  background: #252C36;
}
.dijitMenuPopup .dijitMenu:after {
  position: absolute;
  bottom: 100%;
  left: 20px;
  width: 0;
  height: 0;
  margin-left: -10px;
  content: " ";
  pointer-events: none;
  border: medium solid transparent;
  border-width: 10px;
  border-bottom-color: #252C36;
}
.dijitMenuPopup .dijitMenu .dijitMenuItem {
  background: transparent;
}
.dijitMenuPopup .dijitMenu .dijitMenuItem .dijitMenuItemLabel {
  display: block;
  overflow: hidden;
  width: 180px !important;
  padding: 10px;
  text-overflow: ellipsis;
  color: #FFFFFF;
  border-radius: 3px;
}
.dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover {
  background: none;
}
.dijitMenuPopup .dijitMenu .dijitMenuItem.dijitMenuItemHover .dijitMenuItemLabel {
  background: #0595DB;
}
.dijitMenuPopup .dijitMenu .tg_newlabelmenuitem .dijitMenuItemLabel {
  font-weight: bold;
}
.dijitMenuPopup .dijitMenu .dijitMenuSeparator td {
  padding: 0;
  border-bottom-width: 3px;
}
.dijitMenuPopup .dijitMenu .dijitMenuSeparator .dijitMenuSeparatorIconCell > div {
  margin: 0;
}

/* ==========================================================================
   Glyphicons

   Glyphicons alternaed to use with Mendix
========================================================================== */
.mx-glyphicon:before {
  display: inline-block;
  margin-top: -0.2em;
  margin-right: 0.4555555em;
  vertical-align: middle;
  font-family: "Glyphicons Halflings";
  font-weight: normal;
  font-style: normal;
  line-height: inherit;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ==========================================================================
   Groupbox

   Default Mendix Groupboxes
========================================================================== */
.mx-groupbox {
  margin: 0;
}
.mx-groupbox > .mx-groupbox-header {
  margin: 0;
  color: #555555;
  border-width: 1px 1px 0 1px;
  border-style: solid;
  border-color: #DDDDDD;
  background: #DDDDDD;
  font-size: 14px;
}
.mx-groupbox > .mx-groupbox-header .mx-groupbox-collapse-icon {
  margin-top: 0.1em;
}
.mx-groupbox > .mx-groupbox-body {
  padding: 10px 15px;
  border-width: 1px;
  border-style: solid;
  border-color: #DDDDDD;
  background-color: #FFFFFF;
}
.mx-groupbox .mx-groupbox-header + .mx-groupbox-body {
  border-top: none;
}

.groupbox-default > .mx-groupbox-header {
  color: #555555;
  border-color: #DDDDDD;
  background: #DDDDDD;
}
.groupbox-default > .mx-groupbox-body {
  border-color: #DDDDDD;
}

.groupbox-primary > .mx-groupbox-header {
  color: #FFF;
  border-color: #0595DB;
  background: #0595DB;
}
.groupbox-primary > .mx-groupbox-body {
  border-color: #0595DB;
}

.groupbox-inverse > .mx-groupbox-header {
  color: #FFF;
  border-color: #252C36;
  background: #252C36;
}
.groupbox-inverse > .mx-groupbox-body {
  border-color: #252C36;
}

.groupbox-success > .mx-groupbox-header {
  color: #FFF;
  border-color: #76CA02;
  background: #76CA02;
}
.groupbox-success > .mx-groupbox-body {
  border-color: #76CA02;
}

.groupbox-info > .mx-groupbox-header {
  color: #FFF;
  border-color: #48B0F7;
  background: #48B0F7;
}
.groupbox-info > .mx-groupbox-body {
  border-color: #48B0F7;
}

.groupbox-warning > .mx-groupbox-header {
  color: #FFF;
  border-color: #F99B1D;
  background: #F99B1D;
}
.groupbox-warning > .mx-groupbox-body {
  border-color: #F99B1D;
}

.groupbox-danger > .mx-groupbox-header {
  color: #FFF;
  border-color: #ED1C24;
  background: #ED1C24;
}
.groupbox-danger > .mx-groupbox-body {
  border-color: #ED1C24;
}

.groupbox-white > .mx-groupbox-header {
  color: #555555;
  border-color: #FFF;
  background: #FFF;
}
.groupbox-white > .mx-groupbox-body {
  border-color: #FFF;
}

.groupbox-transparent {
  border-bottom: 1px solid #D7D7D7;
}
.groupbox-transparent > .mx-groupbox-header {
  padding: 15px 0;
  color: #222222;
  border-style: none;
  background: transparent;
  font-size: 1.143em;
  font-weight: 600;
}
.groupbox-transparent .mx-groupbox-body {
  padding: 15px 0;
  border-style: none;
  background-color: transparent;
}
.groupbox-transparent .mx-groupbox-collapse-icon {
  color: #0595DB;
}

.groupbox-h1 > .mx-groupbox-header {
  font-size: 31px;
}

.groupbox-h2 > .mx-groupbox-header {
  font-size: 26px;
}

.groupbox-h3 > .mx-groupbox-header {
  font-size: 24px;
}

.groupbox-h4 > .mx-groupbox-header {
  font-size: 18px;
}

.groupbox-h5 > .mx-groupbox-header {
  font-size: 14px;
}

.groupbox-h6 > .mx-groupbox-header {
  font-size: 12px;
}

.groupbox-callout > .mx-groupbox-header,
.groupbox-callout > .mx-groupbox-body {
  border: 0;
  background-color: #daeffd;
}
.groupbox-callout .mx-groupbox-header + .mx-groupbox-body {
  padding-top: 0;
}

.groupbox-info.groupbox-callout > .mx-groupbox-header,
.groupbox-info.groupbox-callout > .mx-groupbox-body {
  background-color: #daeffd;
}
.groupbox-info.groupbox-callout > .mx-groupbox-header {
  color: #48B0F7;
}

.groupbox-success.groupbox-callout > .mx-groupbox-header,
.groupbox-success.groupbox-callout > .mx-groupbox-body {
  background-color: #e4f4cc;
}
.groupbox-success.groupbox-callout > .mx-groupbox-header {
  color: #76CA02;
}

.groupbox-warning.groupbox-callout > .mx-groupbox-header,
.groupbox-warning.groupbox-callout > .mx-groupbox-body {
  background-color: #feebd2;
}
.groupbox-warning.groupbox-callout > .mx-groupbox-header {
  color: #F99B1D;
}

.groupbox-danger.groupbox-callout > .mx-groupbox-header,
.groupbox-danger.groupbox-callout > .mx-groupbox-body {
  background-color: #fbd2d3;
}
.groupbox-danger.groupbox-callout > .mx-groupbox-header {
  color: #ED1C24;
}

/* ==========================================================================
   Helpers

   Default Mendix Helpers
========================================================================== */
.show {
  display: block !important;
}

.hidden {
  display: none !important;
  visibility: hidden !important;
}

.invisible {
  visibility: hidden !important;
}

.display-ie8-only:not([attr*=""]) {
  display: none !important;
  padding: 0 !important;
}

.list-nostyle ul {
  margin: 0 !important;
  padding: 0 !important;
}
.list-nostyle ul li {
  list-style-type: none !important;
}

.nowrap,
.nowrap * {
  overflow: hidden;
  white-space: nowrap !important;
  text-overflow: ellipsis;
}

.table {
  display: table !important;
}

.table-row {
  display: table-row !important;
}

.table-cell {
  display: table-cell !important;
}

.pull-left {
  float: left !important;
}

.pull-right {
  float: right !important;
}

.align-top {
  vertical-align: top !important;
}

.align-middle {
  vertical-align: middle !important;
}

.align-bottom {
  vertical-align: bottom !important;
}

.row-left {
  display: flex !important;
  align-items: center !important;
  flex-flow: row !important;
  justify-content: flex-start !important;
}

.row-center {
  display: flex !important;
  align-items: center !important;
  flex-flow: row !important;
  justify-content: center !important;
}

.row-right {
  display: flex !important;
  align-items: center !important;
  flex-flow: row !important;
  justify-content: flex-end !important;
}

.col-left {
  display: flex !important;
  align-items: flex-start !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.col-center {
  display: flex !important;
  align-items: center !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.col-right {
  display: flex !important;
  align-items: flex-end !important;
  flex-direction: column !important;
  justify-content: center !important;
}

.spacing-inner-none {
  padding: 0 !important;
}

.spacing-inner-top-none {
  padding-top: 0 !important;
}

.spacing-inner-right-none {
  padding-right: 0 !important;
}

.spacing-inner-bottom-none {
  padding-bottom: 0 !important;
}

.spacing-inner-left-none {
  padding-left: 0 !important;
}

.spacing-outer-none {
  margin: 0 !important;
}

.spacing-outer-top-none {
  margin-top: 0 !important;
}

.spacing-outer-right-none {
  margin-right: 0 !important;
}

.spacing-outer-bottom-none {
  margin-bottom: 0 !important;
}

.spacing-outer-left-none {
  margin-left: 0 !important;
}

.spacing-inner {
  padding: 5px !important;
}

.spacing-inner-top {
  padding-top: 5px !important;
}

.spacing-inner-right {
  padding-right: 5px !important;
}

.spacing-inner-bottom {
  padding-bottom: 5px !important;
}

.spacing-inner-left {
  padding-left: 5px !important;
}

.spacing-outer {
  margin: 5px !important;
}

.spacing-outer-top {
  margin-top: 5px !important;
}

.spacing-outer-right {
  margin-right: 5px !important;
}

.spacing-outer-bottom {
  margin-bottom: 5px !important;
}

.save-second-wizard {
    border-radius: 4px;
    color: white;
    background-color: #303942;
    border-color: transparent;
	padding: 15px 98px;
	font-family: 'Montserrat';
}
.cell-save-second-wizard {
	text-align: left;
}
@media (max-width: 767px) {
	.save-second-wizard {
		border-radius: 4px;
		color: white;
		background-color: #303942;
		border-color: transparent;
		padding: 15px 98px;
	}
	.cell-save-second-wizard {
		text-align: center;
	}
}
.spacing-outer-left {
  margin-left: 5px !important;
}

@media (max-width: 767px) {
  .spacing-inner-medium {
    padding: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-medium {
    padding: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-medium {
    padding: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-top-medium {
    padding-top: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-top-medium {
    padding-top: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-top-medium {
    padding-top: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-right-medium {
    padding-right: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-right-medium {
    padding-right: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-right-medium {
    padding-right: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-bottom-medium {
    padding-bottom: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-bottom-medium {
    padding-bottom: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-bottom-medium {
    padding-bottom: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-left-medium {
    padding-left: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-left-medium {
    padding-left: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-left-medium {
    padding-left: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-medium {
    margin: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-medium {
    margin: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-medium {
    margin: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-top-medium {
    margin-top: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-top-medium {
    margin-top: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-top-medium {
    margin-top: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-right-medium {
    margin-right: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-right-medium {
    margin-right: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-right-medium {
    margin-right: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-bottom-medium {
    margin-bottom: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-bottom-medium {
    margin-bottom: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-bottom-medium {
    margin-bottom: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-left-medium {
    margin-left: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-left-medium {
    margin-left: 15px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-left-medium {
    margin-left: 15px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-large {
    padding: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-large {
    padding: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-large {
    padding: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-top-large {
    padding-top: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-top-large {
    padding-top: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-top-large {
    padding-top: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-right-large {
    padding-right: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-right-large {
    padding-right: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-right-large {
    padding-right: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-bottom-large {
    padding-bottom: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-bottom-large {
    padding-bottom: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-bottom-large {
    padding-bottom: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-left-large {
    padding-left: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-left-large {
    padding-left: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-left-large {
    padding-left: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-large {
    margin: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-large {
    margin: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-large {
    margin: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-top-large {
    margin-top: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-top-large {
    margin-top: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-top-large {
    margin-top: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-right-large {
    margin-right: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-right-large {
    margin-right: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-right-large {
    margin-right: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-bottom-large {
    margin-bottom: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-bottom-large {
    margin-bottom: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-bottom-large {
    margin-bottom: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-left-large {
    margin-left: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-left-large {
    margin-left: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-left-large {
    margin-left: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-layout {
    padding: 15px 15px 15px 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-layout {
    padding: 30px 30px 30px 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-layout {
    padding: 30px 30px 30px 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-top-layout {
    padding-top: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-top-layout {
    padding-top: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-top-layout {
    padding-top: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-right-layout {
    padding-right: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-right-layout {
    padding-right: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-right-layout {
    padding-right: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-bottom-layout {
    padding-bottom: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-bottom-layout {
    padding-bottom: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-bottom-layout {
    padding-bottom: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-inner-left-layout {
    padding-left: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-inner-left-layout {
    padding-left: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-inner-left-layout {
    padding-left: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-layout {
    margin: 15px 15px 15px 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-layout {
    margin: 30px 30px 30px 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-layout {
    margin: 30px 30px 30px 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-top-layout {
    margin-top: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-top-layout {
    margin-top: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-top-layout {
    margin-top: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-right-layout {
    margin-right: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-right-layout {
    margin-right: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-right-layout {
    margin-right: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-bottom-layout {
    margin-bottom: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-bottom-layout {
    margin-bottom: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-bottom-layout {
    margin-bottom: 30px !important;
  }
}

@media (max-width: 767px) {
  .spacing-outer-left-layout {
    margin-left: 15px !important;
  }
}
@media (min-width: 768px) {
  .spacing-outer-left-layout {
    margin-left: 30px !important;
  }
}
@media (min-width: 992px) {
  .spacing-outer-left-layout {
    margin-left: 30px !important;
  }
}

.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

/* ==========================================================================
   Images

   Default Mendix Image Widgets
========================================================================== */
img.img-rounded,
.img-rounded img {
  border-radius: 6px;
}

img.img-thumbnail,
.img-thumbnail img {
  display: inline-block;
  max-width: 100%;
  height: auto;
  padding: 4px;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  border: 1px solid #DDDDDD;
  border-radius: 4px;
  background-color: #FFFFFF;
  line-height: 1.42857;
}

img.img-circle,
.img-circle img {
  border-radius: 50%;
}

img.img-auto,
.img-auto img {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 100% !important;
}

img.img-center,
.img-center img {
  margin-right: auto !important;
  margin-left: auto !important;
}

/* ==========================================================================
   Labels

   Default labels combined with Bootstrap labels
========================================================================== */
.label {
  display: inline;
  display: inline-block;
  padding: 0.2em 0.6em 0.3em;
  text-align: center;
  vertical-align: baseline;
  white-space: nowrap;
  color: #FFFFFF;
  border-radius: 0.25em;
  font-size: 1em;
  font-weight: bold;
  line-height: 1;
}

.label-default {
  color: #555555;
  background-color: #DDDDDD;
}

.label-primary {
  color: #FFF;
  background-color: #0595DB;
}

.label-success {
  color: #FFF;
  background-color: #76CA02;
}

.label-info {
  color: #FFF;
  background-color: #48B0F7;
}

.label-warning {
  color: #FFF;
  background-color: #F99B1D;
}

.label-danger {
  color: #FFF;
  background-color: #ED1C24;
}

/* ==========================================================================
   Listview

   Default Mendix Listview Widget. The list view shows a list of objects arranged vertically. Each object is shown using a template
========================================================================== */
.mx-listview {
  padding: 0;
  /* Clear search button (overrides load more button stying) */
  /* Load more button */
}
.mx-listview .mx-button.mx-listview-clear-button {
  width: auto;
}
.mx-listview .mx-listview-searchbar {
  margin-bottom: 15px;
}
.mx-listview > .mx-button {
  width: 100%;
  margin: 10px auto;
}
.mx-listview .mx-listview-list {
  margin: 0;
}
.mx-listview .mx-listview-list .mx-listview-empty {
  border-style: none;
  background-color: transparent;
}
.mx-listview .mx-listview-item {
  transition-delay: 0.1s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.2s;
  transition-property: all;
  transform-style: initial;
  padding: 15px 15px 15px 15px;
  border-width: 1px 0 0 0;
  border-style: solid;
  border-color: #ffffff;
  background-color: #FFF;
}
.mx-listview .mx-listview-item:first-child {
  border-radius: 0;
}
.mx-listview .mx-listview-item:last-child {
  /* border-bottom: 1px solid #D7D7D7; */
  border-radius: 0;
}
/* .mx-listview .mx-listview-item:nth-child(2n + 1) {
  background-color: #FFF;
} */
/* .mx-listview .mx-listview-item:hover {
  background-color: #FFF;
} */
/* .mx-listview .mx-listview-item:focus, .mx-listview .mx-listview-item:active {
  background-color: #f7f7f7;
} */
.mx-listview .mx-listview-item.selected {
  background-color: #f3f3f3 !important;
}
.mx-listview .mx-layoutgrid {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.listview-bordered.mx-listview .mx-listview-item {
  border: 1px solid #D7D7D7;
  border-top: 0;
}
.listview-bordered.mx-listview .mx-listview-item:first-child {
  border-top: 1px solid #D7D7D7;
  border-radius: 0;
}
.listview-bordered.mx-listview .mx-listview-item:last-child {
  border-radius: 0;
}

.listview-striped.mx-listview .mx-listview-item:nth-child(2n + 1) {
  background-color: #fbfbfb;
}

.listview-seperated.mx-listview .mx-listview-item {
  margin-bottom: 15px;
  border-width: 1px;
  border-style: solid;
  border-radius: 4px;
}

.listview-hover.mx-listview .mx-listview-item:hover, .listview-hover.mx-listview .mx-listview-item:focus, .listview-hover.mx-listview .mx-listview-item:active {
  background-color: #f7f7f7 !important;
}
.listview-hover.mx-listview .mx-listview-item.selected:hover, .listview-hover.mx-listview .mx-listview-item.selected:focus, .listview-hover.mx-listview .mx-listview-item.selected:active {
  background-color: #ebebeb !important;
}

.listview-stylingless.mx-listview .mx-listview-item {
  padding: 0;
  cursor: default;
  border: 0;
  background-color: transparent;
}
.listview-stylingless.mx-listview .mx-listview-item:hover, .listview-stylingless.mx-listview .mx-listview-item:focus, .listview-stylingless.mx-listview .mx-listview-item:active {
  background-color: transparent;
}
.listview-stylingless.mx-listview .mx-listview-item.selected {
  background-color: transparent !important;
}
.listview-stylingless.mx-listview .mx-listview-item.selected:hover, .listview-stylingless.mx-listview .mx-listview-item.selected:focus, .listview-stylingless.mx-listview .mx-listview-item.selected:active {
  background-color: transparent !important;
}

.listview-lg.mx-listview .mx-listview-item {
  padding: 30px 30px 30px 30px;
}

.listview-sm.mx-listview .mx-listview-item {
  padding: 7.5px 7.5px 7.5px 7.5px;
}

.mx-listview[class*="lv-col"] {
  overflow: hidden;
}
.mx-listview[class*="lv-col"] .mx-listview-content-wrapper {
  display: block;
}
.mx-listview[class*="lv-col"] > .mx-listview-list {
  display: block;
  margin-right: -15px;
  margin-left: -15px;
}
.mx-listview[class*="lv-col"] > .mx-listview-list::before, .mx-listview[class*="lv-col"] > .mx-listview-list::after {
  display: table;
  clear: both;
  content: " ";
}
.mx-listview[class*="lv-col"] > .mx-listview-list > .mx-listview-item {
  position: relative;
  display: block;
  float: left;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
  border: 0;
}
@media (max-width: 991px) {
  .mx-listview[class*="lv-col"] > .mx-listview-list > .mx-listview-item {
    width: 100% !important;
  }
}
.mx-listview[class*="lv-col"] > .mx-listview-list > .mx-listview-item > .mx-dataview {
  overflow: hidden;
}
.mx-listview[class*="lv-col"].lv-col-xs-12 > .mx-listview-list > .mx-listview-item {
  width: 100% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-11 > .mx-listview-list > .mx-listview-item {
  width: 91.66666667% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-10 > .mx-listview-list > .mx-listview-item {
  width: 83.33333333% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-9 > .mx-listview-list > .mx-listview-item {
  width: 75% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-8 > .mx-listview-list > .mx-listview-item {
  width: 66.66666667% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-7 > .mx-listview-list > .mx-listview-item {
  width: 58.33333333% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-6 > .mx-listview-list > .mx-listview-item {
  width: 50% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-5 > .mx-listview-list > .mx-listview-item {
  width: 41.66666667% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-4 > .mx-listview-list > .mx-listview-item {
  width: 33.33333333% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-3 > .mx-listview-list > .mx-listview-item {
  width: 25% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-2 > .mx-listview-list > .mx-listview-item {
  width: 16.66666667% !important;
}
.mx-listview[class*="lv-col"].lv-col-xs-1 > .mx-listview-list > .mx-listview-item {
  width: 8.33333333% !important;
}
@media (min-width: 768px) {
  .mx-listview[class*="lv-col"].lv-col-sm-12 > .mx-listview-list > .mx-listview-item {
    width: 100% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-11 > .mx-listview-list > .mx-listview-item {
    width: 91.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-10 > .mx-listview-list > .mx-listview-item {
    width: 83.33333333% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-9 > .mx-listview-list > .mx-listview-item {
    width: 75% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-8 > .mx-listview-list > .mx-listview-item {
    width: 66.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-7 > .mx-listview-list > .mx-listview-item {
    width: 58.33333333% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-6 > .mx-listview-list > .mx-listview-item {
    width: 50% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-5 > .mx-listview-list > .mx-listview-item {
    width: 41.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-4 > .mx-listview-list > .mx-listview-item {
    width: 33.33333333% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-3 > .mx-listview-list > .mx-listview-item {
    width: 25% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-2 > .mx-listview-list > .mx-listview-item {
    width: 16.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-sm-1 > .mx-listview-list > .mx-listview-item {
    width: 8.33333333% !important;
  }
}
@media (min-width: 992px) {
  .mx-listview[class*="lv-col"].lv-col-md-12 > .mx-listview-list > .mx-listview-item {
    width: 100% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-11 > .mx-listview-list > .mx-listview-item {
    width: 91.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-10 > .mx-listview-list > .mx-listview-item {
    width: 83.33333333% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-9 > .mx-listview-list > .mx-listview-item {
    width: 75% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-8 > .mx-listview-list > .mx-listview-item {
    width: 66.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-7 > .mx-listview-list > .mx-listview-item {
    width: 58.33333333% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-6 > .mx-listview-list > .mx-listview-item {
    width: 50% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-5 > .mx-listview-list > .mx-listview-item {
    width: 41.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-4 > .mx-listview-list > .mx-listview-item {
    width: 33.33333333% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-3 > .mx-listview-list > .mx-listview-item {
    width: 25% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-2 > .mx-listview-list > .mx-listview-item {
    width: 16.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-md-1 > .mx-listview-list > .mx-listview-item {
    width: 16.66666667% !important;
  }
}
@media (min-width: 1200px) {
  .mx-listview[class*="lv-col"].lv-col-lg-12 > .mx-listview-list > .mx-listview-item {
    width: 100% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-11 > .mx-listview-list > .mx-listview-item {
    width: 91.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-10 > .mx-listview-list > .mx-listview-item {
    width: 83.33333333% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-9 > .mx-listview-list > .mx-listview-item {
    width: 75% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-8 > .mx-listview-list > .mx-listview-item {
    width: 66.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-7 > .mx-listview-list > .mx-listview-item {
    width: 58.33333333% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-6 > .mx-listview-list > .mx-listview-item {
    width: 50% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-5 > .mx-listview-list > .mx-listview-item {
    width: 41.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-4 > .mx-listview-list > .mx-listview-item {
    width: 33.33333333% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-3 > .mx-listview-list > .mx-listview-item {
    width: 25% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-2 > .mx-listview-list > .mx-listview-item {
    width: 16.66666667% !important;
  }
  .mx-listview[class*="lv-col"].lv-col-lg-1 > .mx-listview-list > .mx-listview-item {
    width: 8.33333333% !important;
  }
}

.profile-phone .mx-listview .mx-listview-searchbar {
  margin-bottom: 3px;
  background: #FFFFFF;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14);
}
.profile-phone .mx-listview .mx-listview-searchbar input {
  padding: 14px 15px;
  color: #555555;
  border-style: none;
  border-radius: 0;
  box-shadow: none;
}
.profile-phone .mx-listview .mx-listview-clear-button {
  padding: 14px 15px;
  color: inherit;
  border-style: none;
}
.profile-phone .mx-listview .mx-listview-item:first-child {
  border-top: none;
}

/* ==========================================================================
   Modals

   Default Mendix Modals. Modals are streamlined, but flexible, dialog prompts with the minimum required functionality and smart defaults
========================================================================== */
.modal-dialog .modal-content {
  border: 1px solid #D7D7D7;
  border-radius: 4px;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}
.modal-dialog .modal-content .modal-header {
  padding: 15px 20px;
  border-bottom-color: #D7D7D7;
  border-radius: 0;
  background-color: transparent;
}
.modal-dialog .modal-content .modal-header h4 {
  margin: 0;
  color: #555555;
  font-size: 1.143em;
  font-weight: bold;
}
.modal-dialog .modal-content .modal-header .close {
  margin-top: -3px;
  opacity: 1;
  /* For IE8 and earlier */
  color: #555555;
  text-shadow: none;
  filter: alpha(opacity=100);
}
.modal-dialog .modal-content .modal-body {
  padding: 20px;
}
.modal-dialog .modal-content .modal-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: 0;
  padding: 20px;
  border-style: none;
}

.mx-window.mx-window-view .mx-window-body {
  padding: 0;
}
.mx-window.mx-window-view .mx-window-body > .mx-dataview > .mx-dataview-content,
.mx-window.mx-window-view .mx-window-body > .mx-placeholder > .mx-dataview > .mx-dataview-content {
  padding: 20px;
}
.mx-window.mx-window-view .mx-window-body > .mx-dataview > .mx-dataview-controls,
.mx-window.mx-window-view .mx-window-body > .mx-placeholder > .mx-dataview > .mx-dataview-controls {
  display: flex;
  justify-content: flex-end;
  margin: 0;
  padding: 20px;
  text-align: left;
  border-top: 1px solid #D7D7D7;
}
.mx-window .mx-dataview-controls {
  padding-bottom: 0;
}
.mx-window .mx-layoutgrid {
  padding-right: 0;
  padding-left: 0;
}

.mx-login .modal-body {
  padding: 0 15px;
}
.mx-login .modal-content input {
  height: 56px;
  padding: 12px 12px;
  border: 1px solid #EEEEEE;
  background: #EEEEEE;
  box-shadow: none;
  font-size: 1.143em;
}
.mx-login .modal-content input:focus {
  border-color: #66AFE9;
}
.mx-login .modal-header,
.mx-login .modal-footer {
  border: 0;
}
.mx-login button {
  font-size: 1.143em;
}
.mx-login h4 {
  color: #AAAAAA;
  font-size: 1.429em;
  font-weight: bold;
}

/* ==========================================================================
   Navigation

   Default Mendix Navigation Bar
========================================================================== */
.mx-navbar {
  margin: 0;
  border-style: none;
  border-radius: 0;
  background-color: #252C36;
  /* remove focus */
}
.mx-navbar ul.nav {
  margin: 0;
  /* Navigation item */
  /* When hovering or the dropdown is open */
}
.mx-navbar ul.nav > li.mx-navbar-item > a {
  display: flex;
  align-items: center;
  min-height: 60px;
  padding: 5px 15px;
  vertical-align: middle;
  color: #FFF;
  border-radius: 0;
  font-size: 1em;
  font-weight: normal;
  /* Dropdown arrow */
  /* Dropdown */
}
.mx-navbar ul.nav > li.mx-navbar-item > a .caret {
  border-top-color: #FFF;
  border-bottom-color: #FFF;
}
.mx-navbar ul.nav > li.mx-navbar-item > a:hover, .mx-navbar ul.nav > li.mx-navbar-item > a:focus, .mx-navbar ul.nav > li.mx-navbar-item > a.active {
  text-decoration: none;
  color: #FFF;
  background-color: #2d3642;
}
.mx-navbar ul.nav > li.mx-navbar-item > a:hover .caret, .mx-navbar ul.nav > li.mx-navbar-item > a:focus .caret, .mx-navbar ul.nav > li.mx-navbar-item > a.active .caret {
  border-top-color: #FFF;
  border-bottom-color: #FFF;
}
.mx-navbar ul.nav > li.mx-navbar-item > a.active {
  color: #FFF;
  background-color: #36404e;
}
.mx-navbar ul.nav > li.mx-navbar-item > a .mx-navbar-submenu::before {
  position: absolute;
  top: -9px;
  left: 15px;
  width: 0;
  height: 0;
  content: "";
  -webkit-transform: rotate(360deg);
  transform: rotate(360deg);
  border-width: 0 9px 9px 9px;
  border-style: solid;
  border-color: transparent transparent #2d3642 transparent;
}
.mx-navbar ul.nav > li.mx-navbar-item > a img {
  width: 20px;
  height: auto;
  margin-right: 0.5em;
}
.mx-navbar ul.nav > li.mx-navbar-item > a .glyphicon {
  top: 0;
  margin-right: 0.5em;
  vertical-align: middle;
  font-size: 20px;
}
.mx-navbar ul.nav > .mx-navbar-item > a:hover, .mx-navbar ul.nav > .mx-navbar-item > a:focus, .mx-navbar ul.nav > .mx-navbar-item.active a, .mx-navbar ul.nav > .mx-navbar-item.open > a, .mx-navbar ul.nav > .mx-navbar-item.open > a:hover, .mx-navbar ul.nav > .mx-navbar-item.open > a:focus {
  text-decoration: none;
  color: #FFF;
  background-color: #2d3642;
}
.mx-navbar ul.nav > .mx-navbar-item > a:hover .caret, .mx-navbar ul.nav > .mx-navbar-item > a:focus .caret, .mx-navbar ul.nav > .mx-navbar-item.active a .caret, .mx-navbar ul.nav > .mx-navbar-item.open > a .caret, .mx-navbar ul.nav > .mx-navbar-item.open > a:hover .caret, .mx-navbar ul.nav > .mx-navbar-item.open > a:focus .caret {
  border-top-color: #FFF;
  border-bottom-color: #FFF;
}
.mx-navbar ul.nav > .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem.active a {
  color: #0595DB;
  background-color: #1d222a;
}
.mx-navbar ul.nav > .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem.active a .caret {
  border-top-color: #0595DB;
  border-bottom-color: #0595DB;
}
@media (max-width: 768px) {
  .mx-navbar ul.nav > li.mx-navbar-item > a {
    padding: 10px 20px;
  }
  .mx-navbar .mx-navbar-item.open .dropdown-menu {
    padding: 0;
    border-radius: 0;
    background-color: #1d222a;
  }
  .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a {
    padding: 10px 20px;
    color: #AAA;
    border-radius: 0;
    font-size: 12px;
    font-weight: normal;
  }
  .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a:hover, .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a:focus {
    color: #0595DB;
    background-color: #1d222a;
  }
  .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a.active {
    color: #0595DB;
    background-color: #1d222a;
  }
}
.mx-navbar:focus {
  outline: 0;
}

.region-topbar .mx-navbar {
  background-color: #FFFFFF;
}
.region-topbar .mx-navbar ul.nav {
  /* Navigation item */
  /* When hovering or the dropdown is open */
}
.region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a {
  color: #555555;
  font-size: 14px;
  /* Dropdown arrow */
  /* Dropdown */
}
.region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a .caret {
  border-top-color: #555555;
  border-bottom-color: #555555;
}
.region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a:hover, .region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a:focus, .region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a.active {
  color: #555555;
  background-color: whitesmoke;
}
.region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a:hover .caret, .region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a:focus .caret, .region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a.active .caret {
  border-top-color: #555555;
  border-bottom-color: #555555;
}
.region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a.active {
  color: #555555;
  background-color: #ebebeb;
}
.region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a .mx-navbar-submenu::before {
  border-color: transparent transparent #D7D7D7 transparent;
}
.region-topbar .mx-navbar ul.nav > li.mx-navbar-item > a .glyphicon {
  font-size: 1.2em;
}
.region-topbar .mx-navbar ul.nav > .mx-navbar-item > a:hover, .region-topbar .mx-navbar ul.nav > .mx-navbar-item > a:focus, .region-topbar .mx-navbar ul.nav > .mx-navbar-item.active a, .region-topbar .mx-navbar ul.nav > .mx-navbar-item.open > a, .region-topbar .mx-navbar ul.nav > .mx-navbar-item.open > a:hover, .region-topbar .mx-navbar ul.nav > .mx-navbar-item.open > a:focus {
  color: #555555;
  background-color: whitesmoke;
}
.region-topbar .mx-navbar ul.nav > .mx-navbar-item > a:hover .caret, .region-topbar .mx-navbar ul.nav > .mx-navbar-item > a:focus .caret, .region-topbar .mx-navbar ul.nav > .mx-navbar-item.active a .caret, .region-topbar .mx-navbar ul.nav > .mx-navbar-item.open > a .caret, .region-topbar .mx-navbar ul.nav > .mx-navbar-item.open > a:hover .caret, .region-topbar .mx-navbar ul.nav > .mx-navbar-item.open > a:focus .caret {
  border-top-color: #555555;
  border-bottom-color: #555555;
}
.region-topbar .mx-navbar ul.nav > .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem.active a {
  color: #FFF;
  background-color: white;
}
.region-topbar .mx-navbar ul.nav > .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem.active a .caret {
  border-top-color: #FFF;
  border-bottom-color: #FFF;
}
@media (max-width: 768px) {
  .region-topbar .mx-navbar .mx-navbar-item.open .dropdown-menu {
    background-color: white;
  }
  .region-topbar .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a {
    color: #AAA;
    font-size: 12px;
  }
  .region-topbar .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a:hover, .region-topbar .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a:focus {
    color: #0595DB;
    background-color: white;
  }
  .region-topbar .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a.active {
    color: #FFF;
    background-color: white;
  }
}

.region-sidebar .mx-navbar {
  background-color: #252C36;
}
.region-sidebar .mx-navbar ul.nav {
  /* Navigation item */
  /* When hovering or the dropdown is open */
}
.region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a {
  color: #FFFFFF;
  font-size: 14px;
  /* Dropdown arrow */
  /* Dropdown */
}
.region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a .caret {
  border-top-color: #FFFFFF;
  border-bottom-color: #FFFFFF;
}
.region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a:hover, .region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a:focus, .region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a.active {
  color: #FFFFFF;
  background-color: #2d3642;
}
.region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a:hover .caret, .region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a:focus .caret, .region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a.active .caret {
  border-top-color: #FFF;
  border-bottom-color: #FFF;
}
.region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a.active {
  color: #FFF;
  background-color: #36404e;
}
.region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a .mx-navbar-submenu::before {
  border-color: transparent transparent #2d3642 transparent;
}
.region-sidebar .mx-navbar ul.nav > li.mx-navbar-item > a .glyphicon {
  font-size: 20px;
}
.region-sidebar .mx-navbar ul.nav > .mx-navbar-item > a:hover, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item > a:focus, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item.active a, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item.open > a, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item.open > a:hover, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item.open > a:focus {
  color: #FFFFFF;
  background-color: #2d3642;
}
.region-sidebar .mx-navbar ul.nav > .mx-navbar-item > a:hover .caret, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item > a:focus .caret, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item.active a .caret, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item.open > a .caret, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item.open > a:hover .caret, .region-sidebar .mx-navbar ul.nav > .mx-navbar-item.open > a:focus .caret {
  border-top-color: #FFFFFF;
  border-bottom-color: #FFFFFF;
}
.region-sidebar .mx-navbar ul.nav > .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem.active a {
  color: #0595DB;
  background-color: #1d222a;
}
.region-sidebar .mx-navbar ul.nav > .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem.active a .caret {
  border-top-color: #0595DB;
  border-bottom-color: #0595DB;
}
@media (max-width: 768px) {
  .region-sidebar .mx-navbar .mx-navbar-item.open .dropdown-menu {
    background-color: white;
  }
  .region-sidebar .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a {
    color: #AAA;
    font-size: 12px;
  }
  .region-sidebar .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a:hover, .region-sidebar .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a:focus {
    color: #0595DB;
    background-color: #1d222a;
  }
  .region-sidebar .mx-navbar .mx-navbar-item.open .dropdown-menu > li.mx-navbar-subitem > a.active {
    color: #0595DB;
    background-color: #1d222a;
  }
}

/* ==========================================================================
   Navigation List
   Default Mendix Navigation List Widget. A navigation list can be used to attach an action to an entire row. Such a row is called a navigation list item
========================================================================== */
.mx-navigationlist {
  margin: 0;
  padding: 0;
}
.mx-navigationlist li.mx-navigationlist-item {
  transition-delay: 0.1s;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.2s;
  transition-property: all;
  transform-style: initial;
  padding: 15px 15px 15px 15px;
  border-width: 1px;
  border-style: none none solid none;
  border-color: #D7D7D7;
  border-radius: 0;
  background-color: #FFF;
}
.mx-navigationlist li.mx-navigationlist-item:hover, .mx-navigationlist li.mx-navigationlist-item:focus {
  color: inherit;
  background-color: #f7f7f7;
}
.mx-navigationlist li.mx-navigationlist-item.active {
  color: inherit;
  background-color: #f3f3f3;
}

/* ==========================================================================
   Navigation

   Default Mendix Navigation Tree
========================================================================== */
.mx-navigationtree {
  background-color: #252C36;
  /* Every navigation item */
  /* Sub navigation item specific */
  /* remove focus */
}
.mx-navigationtree .navbar-inner > ul {
  margin: 0;
  padding-left: 0;
}
.mx-navigationtree .navbar-inner > ul > li {
  padding: 0;
  border-style: none;
}
.mx-navigationtree .navbar-inner > ul > li > a {
  display: flex;
  align-items: center;
  height: 60px;
  padding: 5px 15px;
  color: #FFF;
  border-bottom: 1px solid #2d3642;
  border-radius: 0;
  background-color: #252C36;
  text-shadow: none;
  font-size: 14px;
  font-weight: normal;
}
.mx-navigationtree .navbar-inner > ul > li > a .caret {
  border-top-color: #FFF;
  border-bottom-color: #FFF;
}
.mx-navigationtree .navbar-inner > ul > li > a img {
  width: 20px;
  height: auto;
  margin-right: 0.5em;
}
.mx-navigationtree .navbar-inner > ul > li > a .glyphicon {
  top: 0;
  margin-right: 0.5em;
  vertical-align: middle;
  font-size: 20px;
  margin: 5px 0;
}
.mx-navigationtree .navbar-inner > ul > li a:hover,
.mx-navigationtree .navbar-inner > ul > li a:focus,
.mx-navigationtree .navbar-inner > ul > li a.active {
  text-decoration: none;
  color: #FFF;
  background-color: #2d3642;
}
.mx-navigationtree .navbar-inner > ul > li a:hover .caret,
.mx-navigationtree .navbar-inner > ul > li a:focus .caret,
.mx-navigationtree .navbar-inner > ul > li a.active .caret {
  border-top-color: #FFF;
  border-bottom-color: #FFF;
}
.mx-navigationtree .navbar-inner > ul > li a.active {
  color: #FFF;
  border-left-color: #FFF;
  background-color: #36404e;
}
.mx-navigationtree li.mx-navigationtree-has-items > ul {
  margin: 0;
  padding-left: 0;
  background-color: #1d222a;
}
.mx-navigationtree li.mx-navigationtree-has-items > ul li {
  margin: 0;
  padding: 0;
  border: 0;
}
.mx-navigationtree li.mx-navigationtree-has-items > ul li a {
  padding: 12px 20px 12px 25px;
  text-decoration: none;
  color: #AAA;
  border: 0;
  background-color: #1d222a;
  text-shadow: none;
  font-size: 12px;
  font-weight: normal;
}
.mx-navigationtree li.mx-navigationtree-has-items > ul li a:hover, .mx-navigationtree li.mx-navigationtree-has-items > ul li a:focus, .mx-navigationtree li.mx-navigationtree-has-items > ul li a.active {
  color: #0595DB;
  background-color: #1d222a;
}
.mx-navigationtree li.mx-navigationtree-has-items > ul li a.active {
  color: #0595DB;
  border: 0;
  background-color: #1d222a;
}
.mx-navigationtree:focus {
  outline: 0;
}

.region-topbar .mx-navigationtree {
  background-color: #FFFFFF;
  /* Sub navigation item specific */
}
.region-topbar .mx-navigationtree .navbar-inner > ul > li > a {
  color: #555555;
  border-color: #D7D7D7;
  background-color: #FFFFFF;
  font-size: 14px;
}
.region-topbar .mx-navigationtree .navbar-inner > ul > li > a .caret {
  border-top-color: #555555;
  border-bottom-color: #555555;
}
.region-topbar .mx-navigationtree .navbar-inner > ul > li > a .glyphicon {
  font-size: 1.2em;
}
.region-topbar .mx-navigationtree .navbar-inner > ul > li a:hover,
.region-topbar .mx-navigationtree .navbar-inner > ul > li a:focus,
.region-topbar .mx-navigationtree .navbar-inner > ul > li a.active {
  color: #555555;
  background-color: whitesmoke;
}
.region-topbar .mx-navigationtree .navbar-inner > ul > li a:hover .caret,
.region-topbar .mx-navigationtree .navbar-inner > ul > li a:focus .caret,
.region-topbar .mx-navigationtree .navbar-inner > ul > li a.active .caret {
  border-top-color: #555555;
  border-bottom-color: #555555;
}
.region-topbar .mx-navigationtree .navbar-inner > ul > li a.active {
  color: #555555;
  border-left-color: #555555;
  background-color: #ebebeb;
}
.region-topbar .mx-navigationtree li.mx-navigationtree-has-items > ul {
  background-color: white;
}
.region-topbar .mx-navigationtree li.mx-navigationtree-has-items > ul li a {
  color: #AAA;
  background-color: white;
  font-size: 12px;
}
.region-topbar .mx-navigationtree li.mx-navigationtree-has-items > ul li a:hover, .region-topbar .mx-navigationtree li.mx-navigationtree-has-items > ul li a:focus, .region-topbar .mx-navigationtree li.mx-navigationtree-has-items > ul li a.active {
  color: #0595DB;
  background-color: white;
}
.region-topbar .mx-navigationtree li.mx-navigationtree-has-items > ul li a.active {
  color: #FFF;
  background-color: white;
}

.region-sidebar .mx-navigationtree {
  background-color: #252C36;
  /* Sub navigation item specific */
}
.region-sidebar .mx-navigationtree .navbar-inner > ul > li > a {
  color: #FFFFFF;
  border-color: #2d3642;
  background-color: #252C36;
  font-size: 14px;
}
.region-sidebar .mx-navigationtree .navbar-inner > ul > li > a .caret {
  border-top-color: #FFFFFF;
  border-bottom-color: #FFFFFF;
}
.region-sidebar .mx-navigationtree .navbar-inner > ul > li > a .glyphicon {
  font-size: 20px;
}
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a:hover,
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a:focus,
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a.active {
  color: #FFFFFF;
  background-color: #2d3642;
}
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a:hover .caret,
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a:focus .caret,
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a.active .caret {
  border-top-color: #FFF;
  border-bottom-color: #FFF;
}
.region-sidebar .mx-navigationtree .navbar-inner > ul > li a.active {
  color: #FFF;
  border-left-color: #FFF;
  background-color: #36404e;
}
.region-sidebar .mx-navigationtree li.mx-navigationtree-has-items > ul {
  background-color: #1d222a;
}
.region-sidebar .mx-navigationtree li.mx-navigationtree-has-items > ul li a {
  color: #AAA;
  background-color: #1d222a;
  font-size: 12px;
}
.region-sidebar .mx-navigationtree li.mx-navigationtree-has-items > ul li a:hover, .region-sidebar .mx-navigationtree li.mx-navigationtree-has-items > ul li a:focus, .region-sidebar .mx-navigationtree li.mx-navigationtree-has-items > ul li a.active {
  color: #0595DB;
  background-color: #1d222a;
}
.region-sidebar .mx-navigationtree li.mx-navigationtree-has-items > ul li a.active {
  color: #0595DB;
  background-color: #1d222a;
}

.nav-content-center-text-icons.mx-navigationtree .navbar-inner ul a {
  flex-direction: column;
  justify-content: center;
}
.nav-content-center-text-icons.mx-navigationtree .navbar-inner ul a .glyphicon {
  margin: 0 0 5px 0;
}

.nav-content-center.mx-navigationtree .navbar-inner ul a {
  justify-content: center;
}

/* ==========================================================================
   Navigation

   Default Mendix Simple Menu Bar
========================================================================== */
.mx-menubar {
  padding: 0;
  background-color: #252C36;
  /* remove focus */
}
.mx-menubar ul.mx-menubar-list {
  display: flex;
  width: 100%;
  min-height: 50px;
}
.mx-menubar ul.mx-menubar-list li.mx-menubar-item {
  margin: 0;
}
.mx-menubar ul.mx-menubar-list li.mx-menubar-item > a {
  display: flex;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 5px 15px;
  white-space: nowrap;
  color: #FFF;
  border-radius: 0;
  font-size: 14px;
  font-weight: normal;
}
.mx-menubar ul.mx-menubar-list li.mx-menubar-item > a img {
  margin-right: 0.5em;
}
.mx-menubar ul.mx-menubar-list li.mx-menubar-item > a .glyphicon {
  top: -1px;
  margin-right: 0.5em;
  vertical-align: middle;
  font-size: 20px;
}
.mx-menubar ul.mx-menubar-list li.mx-menubar-item a:hover,
.mx-menubar ul.mx-menubar-list li.mx-menubar-item a:focus, .mx-menubar ul.mx-menubar-list li.mx-menubar-item:hover a, .mx-menubar ul.mx-menubar-list li.mx-menubar-item:focus a, .mx-menubar ul.mx-menubar-list li.mx-menubar-item.active a {
  text-decoration: none;
  color: #FFF;
  background-color: #2d3642;
}
.mx-menubar ul.mx-menubar-list li.mx-menubar-item.active a {
  color: #FFF;
  background-color: #36404e;
}
.mx-menubar:focus {
  outline: 0;
}

.mx-menubar-vertical {
  background-color: #252C36;
}
.mx-menubar-vertical ul.mx-menubar-list {
  display: flex;
}
.mx-menubar-vertical ul.mx-menubar-list li.mx-menubar-item {
  display: block;
}
.mx-menubar-vertical ul.mx-menubar-list li.mx-menubar-item a {
  border-bottom: 1px solid #2d3642;
}

.mx-menubar-horizontal {
  box-shadow: 2px 0 4px 0 rgba(0, 0, 0, 0.14);
  /* Two menu items */
  /* Three menu items */
  /* Four menu items */
  /* Five menu items */
}
.mx-menubar-horizontal ul.mx-menubar-list li.mx-menubar-item {
  width: auto;
}
.mx-menubar-horizontal ul.mx-menubar-list li.mx-menubar-item a {
  width: 100%;
}
.mx-menubar-horizontal.menubar-col-6 ul.mx-menubar-list li.mx-menubar-item {
  width: 50%;
}
.mx-menubar-horizontal.menubar-col-4 ul.mx-menubar-list li.mx-menubar-item {
  width: 33.33333333%;
}
.mx-menubar-horizontal.menubar-col-3 ul.mx-menubar-list li.mx-menubar-item {
  width: 25%;
}
.mx-menubar-horizontal.menubar-col-2 ul.mx-menubar-list li.mx-menubar-item {
  width: 20%;
}

.region-topbar .mx-menubar {
  background-color: #FFFFFF;
}
.region-topbar .mx-menubar ul.mx-menubar-list li.mx-menubar-item a {
  color: #555555;
  font-size: 14px;
}
.region-topbar .mx-menubar ul.mx-menubar-list li.mx-menubar-item a .glyphicon {
  font-size: 1.2em;
}
.region-topbar .mx-menubar ul.mx-menubar-list li.mx-menubar-item a:hover,
.region-topbar .mx-menubar ul.mx-menubar-list li.mx-menubar-item a:focus, .region-topbar .mx-menubar ul.mx-menubar-list li.mx-menubar-item:hover a, .region-topbar .mx-menubar ul.mx-menubar-list li.mx-menubar-item:focus a, .region-topbar .mx-menubar ul.mx-menubar-list li.mx-menubar-item.active a {
  color: #555555;
  background-color: whitesmoke;
}
.region-topbar .mx-menubar ul.mx-menubar-list li.mx-menubar-item.active a {
  color: #555555;
  background-color: #ebebeb;
}
.region-topbar .mx-menubar-vertical {
  background-color: #FFFFFF;
}
.region-topbar .mx-menubar-vertical ul.mx-menubar-list li.mx-menubar-item a {
  height: 60px;
  border-color: #D7D7D7;
}

.region-sidebar .mx-menubar {
  background-color: #252C36;
}
.region-sidebar .mx-menubar ul.mx-menubar-list li.mx-menubar-item a {
  color: #FFFFFF;
  font-size: 14px;
}
.region-sidebar .mx-menubar ul.mx-menubar-list li.mx-menubar-item a .glyphicon {
  font-size: 20px;
}
.region-sidebar .mx-menubar ul.mx-menubar-list li.mx-menubar-item a:hover,
.region-sidebar .mx-menubar ul.mx-menubar-list li.mx-menubar-item a:focus, .region-sidebar .mx-menubar ul.mx-menubar-list li.mx-menubar-item:hover a, .region-sidebar .mx-menubar ul.mx-menubar-list li.mx-menubar-item:focus a, .region-sidebar .mx-menubar ul.mx-menubar-list li.mx-menubar-item.active a {
  color: #FFFFFF;
  background-color: #2d3642;
}
.region-sidebar .mx-menubar ul.mx-menubar-list li.mx-menubar-item.active a {
  color: #FFF;
  background-color: #36404e;
}
.region-sidebar .mx-menubar-vertical {
  background-color: #252C36;
}
.region-sidebar .mx-menubar-vertical ul.mx-menubar-list li.mx-menubar-item a {
  border-color: #2d3642;
}

.bottom-nav-text-icons.mx-menubar ul.mx-menubar-list li.mx-menubar-item a {
  flex-direction: column;
  padding: 8px 8px 6px 8px;
  line-height: normal;
  font-size: 11px;
}
.bottom-nav-text-icons.mx-menubar ul.mx-menubar-list li.mx-menubar-item a .glyphicon {
  display: block;
  margin: 0 0 5px 0;
  font-size: 18px;
}
.bottom-nav-text-icons.mx-menubar ul.mx-menubar-list li.mx-menubar-item a img {
  display: block;
  height: 18px;
  margin: 0 0 5px 0;
}

/* ==========================================================================
   Tab Container

   Default Mendix Tab Container Widget. Tab containers are used to show information categorized into multiple tab pages.
   This can be very useful if the amount of information that has to be displayed is larger than the amount of space on the screen
========================================================================== */
.mx-tabcontainer .mx-tabcontainer-tabs {
  margin-bottom: 20px;
  border-color: #D7D7D7;
}
.mx-tabcontainer .mx-tabcontainer-tabs > li > a {
  margin-right: 0;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  color: #888888;
  font-weight: normal;
}
.mx-tabcontainer .mx-tabcontainer-tabs > li > a:hover, .mx-tabcontainer .mx-tabcontainer-tabs > li > a:focus {
  background-color: #e4e4e4;
}
.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a,
.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:hover,
.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:focus {
  color: #555555;
  border: 1px solid #D7D7D7;
  border-bottom-color: transparent;
  background-color: #FFF;
}

.tab-pills.mx-tabcontainer .mx-tabcontainer-tabs {
  border: 0;
}
.tab-pills.mx-tabcontainer .mx-tabcontainer-tabs > li > a {
  margin-right: 2px;
  color: #888888;
  border: 1px solid #D7D7D7;
  border-radius: 4px;
}
.tab-pills.mx-tabcontainer .mx-tabcontainer-tabs > li > a:hover, .tab-pills.mx-tabcontainer .mx-tabcontainer-tabs > li > a:focus {
  background-color: #e4e4e4;
}
.tab-pills.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a,
.tab-pills.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:hover,
.tab-pills.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:focus {
  color: #FFFFFF;
  border-color: #0595DB;
  background-color: #0595DB;
}

.tab-lined.mx-tabcontainer .mx-tabcontainer-tabs {
  border-width: 3px;
}
.tab-lined.mx-tabcontainer .mx-tabcontainer-tabs li {
  margin-right: 30px;
  margin-bottom: -3px;
}
.tab-lined.mx-tabcontainer .mx-tabcontainer-tabs li > a {
  padding: 10px 0;
  color: #888888;
  border: 0;
  border-style: solid;
  border-color: transparent;
  border-bottom-width: 3px;
  border-radius: 0;
}
.tab-lined.mx-tabcontainer .mx-tabcontainer-tabs li > a:hover, .tab-lined.mx-tabcontainer .mx-tabcontainer-tabs li > a:focus {
  color: #888888;
  border: 0;
  border-color: transparent;
  background: transparent;
}
.tab-lined.mx-tabcontainer .mx-tabcontainer-tabs li.active > a, .tab-lined.mx-tabcontainer .mx-tabcontainer-tabs li.active > a:hover, .tab-lined.mx-tabcontainer .mx-tabcontainer-tabs li.active > a:focus {
  color: #0595DB;
  border: 0;
  border-bottom: 3px solid #0595DB;
  background-color: transparent;
}

.tab-justified.mx-tabcontainer .mx-tabcontainer-tabs {
  width: 100%;
  border-bottom: 0;
}
.tab-justified.mx-tabcontainer .mx-tabcontainer-tabs > li {
  display: table-cell;
  float: none;
  width: 1%;
  margin: 0;
}
@media (max-width: 767px) {
  .tab-justified.mx-tabcontainer .mx-tabcontainer-tabs > li {
    display: block;
    width: 100%;
  }
}
.tab-justified.mx-tabcontainer .mx-tabcontainer-tabs > li > a {
  text-align: center;
  border-bottom: 1px solid #D7D7D7;
}
.tab-justified.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a {
  border-bottom-color: transparent;
  border-radius: 4px;
}
@media (max-width: 767px) {
  .tab-justified.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a {
    border-bottom-color: #D7D7D7;
  }
}

.tab-bordered.mx-tabcontainer .mx-tabcontainer-tabs {
  margin: 0;
}
.tab-bordered.mx-tabcontainer .mx-tabcontainer-content {
  padding: 10px;
  border-width: 0 1px 1px 1px;
  border-style: solid;
  border-color: #D7D7D7;
  background-color: #FFFFFF;
}

.tab-wizard.mx-tabcontainer .mx-tabcontainer-tabs {
  border-style: none;
  position: relative;
  display: flex;
  justify-content: space-between;
}
.tab-wizard.mx-tabcontainer .mx-tabcontainer-tabs::before {
  content: "";
  height: 1px;
  position: absolute;
  width: 100%;
  display: block;
  top: 16px;
  background-color: #D7D7D7;
}
.tab-wizard.mx-tabcontainer .mx-tabcontainer-tabs > li {
  position: relative;
  width: 100%;
  text-align: center;
  float: none;
}
.tab-wizard.mx-tabcontainer .mx-tabcontainer-tabs > li > a {
  text-align: center;
  margin: auto;
  height: 33px;
  width: 33px;
  padding: 0;
  line-height: 33px;
  font-size: 18px;
  font-weight: bold;
  color: #DDDDDD;
  border: 1px solid #D7D7D7;
  background-color: #FFFFFF;
  border-radius: 100%;
}
.tab-wizard.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a,
.tab-wizard.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:hover,
.tab-wizard.mx-tabcontainer .mx-tabcontainer-tabs > li.active > a:focus {
  color: #FFFFFF;
  border-color: #0595DB;
  background-color: #0595DB;
}

.tab-mobile.mx-tabcontainer .mx-tabcontainer-tabs {
  margin: 0;
  text-align: center;
  border-style: none;
  background-color: #0595DB;
}
.tab-mobile.mx-tabcontainer .mx-tabcontainer-tabs li {
  display: table-cell;
  float: none;
  width: 1%;
  margin: 0;
  text-align: center;
  border-style: none;
  border-radius: 0;
}
.tab-mobile.mx-tabcontainer .mx-tabcontainer-tabs li a {
  padding: 15px;
  text-transform: uppercase;
  color: #FFFFFF;
  border-width: 0 1px 0 0;
  border-style: solid;
  border-color: rgba(255, 255, 255, 0.3);
  border-radius: 0;
  font-size: 12px;
  font-weight: normal;
}
.tab-mobile.mx-tabcontainer .mx-tabcontainer-tabs li a:hover, .tab-mobile.mx-tabcontainer .mx-tabcontainer-tabs li a:focus {
  background-color: inherit;
}
.tab-mobile.mx-tabcontainer .mx-tabcontainer-tabs li:last-child a {
  border-right: none;
}
.tab-mobile.mx-tabcontainer .mx-tabcontainer-tabs li.active > a, .tab-mobile.mx-tabcontainer .mx-tabcontainer-tabs li.active > a:hover, .tab-mobile.mx-tabcontainer .mx-tabcontainer-tabs li.active > a:focus {
  color: #FFFFFF;
  border-style: none;
  border-radius: 0;
  background-color: #0477af;
}

/* ==========================================================================
   Tables

   Default Mendix Table Widget. Tables can be used to lend structure to a page. They contain a number of rows (tr) and columns, the intersection of which is called a cell (td). Each cell can contain widgets
========================================================================== */
th {
  font-weight: bold;
}

html body .mx-page table.mx-table th.nopadding,
html body .mx-page table.mx-table td.nopadding {
  padding: 0;
}
/* #content > .mx-page{
  overflow-x: hidden;
} */

table.mx-table > tbody {
  /* Table row */
}
table.mx-table > tbody > tr {
  /* Table header */
  /* Table cells */
}
table.mx-table > tbody > tr > th {
  padding: 8px 8px 8px 8px;
}
table.mx-table > tbody > tr > th s
* {
  color: #666;
  font-weight: bold;
  font-weight: 600;
}
table.mx-table > tbody > tr > th > label {
  padding-top: 7px;
  padding-bottom: 6px;
}
table.mx-table > tbody > tr > td {
  padding: 8px 8px 8px 8px;
}
table.mx-table > tbody > tr > td > div > label,
table.mx-table > tbody > tr > td .mx-referenceselector-input-wrapper label {
  padding-top: 7px;
  padding-bottom: 6px;
}

.mx-templategrid table.mx-table > tbody > tr > th,
.mx-templategrid table.mx-table > tbody > tr > td {
  padding: 8px 8px 8px 8px;
}

.mx-list table.mx-table > tbody > tr > th,
.mx-list table.mx-table > tbody > tr > td {
  padding: 8px 8px 8px 8px;
}

table.table-lined.mx-table > tbody > tr > td {
  border-width: 1px 0;
  border-style: solid;
  border-color: #D7D7D7;
}

table.table-bordered.mx-table > tbody > tr > th,
table.table-bordered.mx-table > tbody > tr > td {
  border-width: 1px;
  border-style: solid;
  border-color: #D7D7D7;
}

table.table-compact.mx-table > tbody > tr > th,
table.table-compact.mx-table > tbody > tr > td {
  padding-top: 2px;
  padding-bottom: 2px;
}

table.table-sideless.mx-table > tbody > tr > td,
table.table-sideless.mx-table > tbody > tr > th {
  padding-right: 0;
}
table.table-sideless.mx-table > tbody > tr > th:first-child,
table.table-sideless.mx-table > tbody > tr > td:first-child {
  padding-left: 0;
}

table.table-spaceless.mx-table > tbody > tr > th,
table.table-spaceless.mx-table > tbody > tr > td {
  padding: 0;
}

table.table-vertical.mx-table > tbody > tr > th {
  padding-bottom: 0;
}
table.table-vertical.mx-table > tbody > tr > th > label {
  padding: 0;
}
table.table-vertical.mx-table > tbody > tr > th > div > label {
  padding: 0;
}

table.table-align-vertical-middle.mx-table > tbody > tr > th,
table.table-align-vertical-middle.mx-table > tbody > tr > td {
  vertical-align: middle;
}

table.table-label-compact.mx-table > tbody > tr > th > label,
table.table-label-compact.mx-table > tbody > tr > td > label {
  margin: 0;
  padding: 0;
}
table.table-label-compact.mx-table > tbody > tr > th > div > label,
table.table-label-compact.mx-table > tbody > tr > th .mx-referenceselector-input-wrapper label,
table.table-label-compact.mx-table > tbody > tr > td > div > label,
table.table-label-compact.mx-table > tbody > tr > td .mx-referenceselector-input-wrapper label {
  margin: 0;
  padding: 0;
}

table.table-row-s.mx-table > tbody > tr > th,
table.table-row-s.mx-table > tbody > tr > td {
  height: 55px;
}

table.table-row-m.mx-table > tbody > tr > th,
table.table-row-m.mx-table > tbody > tr > td {
  height: 70px;
}

table.table-row-l.mx-table > tbody > tr > th,
table.table-row-l.mx-table > tbody > tr > td {
  height: 120px;
}

table.table-fixed {
  table-layout: fixed;
}

/* ==========================================================================
   Templategrid

   Default Mendix Templategrid Widget. The template grid shows a list of objects in a tile view. For example, a template grid can show a list of products. The template grid has a lot in common with the data grid. The main difference is that the objects are shown in templates (a sort of small data view) instead of rows
========================================================================== */
.mx-templategrid .mx-templategrid-content-wrapper {
  table-layout: fixed;
}
.mx-templategrid .mx-templategrid-item {
  padding: 15px 15px 15px 15px;
  cursor: default;
  background-color: #FFF;
}
.mx-templategrid .mx-templategrid-item:hover {
  background-color: transparent;
}
.mx-templategrid .mx-templategrid-item.selected {
  background-color: #f3f3f3 !important;
}
.mx-templategrid .mx-layoutgrid {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.templategrid-hover.mx-templategrid .mx-templategrid-item:hover {
  background-color: #f7f7f7 !important;
}
.templategrid-hover.mx-templategrid .mx-templategrid-item.selected {
  background-color: #f3f3f3 !important;
}
.templategrid-hover.mx-templategrid .mx-templategrid-item.selected:hover {
  background-color: #ebebeb !important;
}

.templategrid-selectable.mx-templategrid .mx-templategrid-item {
  cursor: pointer;
}

.templategrid-lined.mx-templategrid .mx-grid-content {
  border-top-width: 2px;
  border-top-style: solid;
  border-top-color: #D7D7D7;
}
.templategrid-lined.mx-templategrid .mx-templategrid-item {
  border-top: 1px solid #D7D7D7;
  border-right: none;
  border-bottom: 1px solid #D7D7D7;
  border-left: none;
}

.templategrid-striped.mx-templategrid .mx-templategrid-row:nth-child(odd) .mx-templategrid-item {
  background-color: #F9F9F9;
}

.templategrid-stylingless.mx-templategrid .mx-templategrid-item {
  padding: 0;
  cursor: default;
  border: 0;
  background-color: transparent;
}
.templategrid-stylingless.mx-templategrid .mx-templategrid-item:hover {
  background-color: transparent;
}
.templategrid-stylingless.mx-templategrid .mx-templategrid-item.selected {
  background-color: transparent !important;
}
.templategrid-stylingless.mx-templategrid .mx-templategrid-item.selected:hover {
  background-color: transparent !important;
}

.templategrid-transparent.mx-templategrid .mx-templategrid-item {
  border: 0;
  background-color: transparent;
}

.templategrid-lg.mx-templategrid .mx-templategrid-item {
  padding: 30px 30px 30px 30px;
}

.templategrid-sm.mx-templategrid .mx-templategrid-item {
  padding: 7.5px 7.5px 7.5px 7.5px;
}

.mx-templategrid[class*="tg-col"] {
  overflow: hidden;
}
.mx-templategrid[class*="tg-col"] .mx-templategrid-content-wrapper {
  display: block;
}
.mx-templategrid[class*="tg-col"] .mx-templategrid-row {
  display: block;
  margin-right: -15px;
  margin-left: -15px;
}
.mx-templategrid[class*="tg-col"] .mx-templategrid-row::before, .mx-templategrid[class*="tg-col"] .mx-templategrid-row::after {
  display: table;
  clear: both;
  content: " ";
}
.mx-templategrid[class*="tg-col"] .mx-templategrid-item {
  position: relative;
  display: block;
  float: left;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
  border: 0;
}
@media (max-width: 992px) {
  .mx-templategrid[class*="tg-col"] .mx-templategrid-item {
    width: 100% !important;
  }
}
.mx-templategrid[class*="tg-col"] .mx-templategrid-item .mx-dataview {
  overflow: hidden;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-12 .mx-templategrid-item {
  width: 100% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-11 .mx-templategrid-item {
  width: 91.66666667% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-10 .mx-templategrid-item {
  width: 83.33333333% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-9 .mx-templategrid-item {
  width: 75% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-8 .mx-templategrid-item {
  width: 66.66666667% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-7 .mx-templategrid-item {
  width: 58.33333333% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-6 .mx-templategrid-item {
  width: 50% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-5 .mx-templategrid-item {
  width: 41.66666667% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-4 .mx-templategrid-item {
  width: 33.33333333% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-3 .mx-templategrid-item {
  width: 25% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-2 .mx-templategrid-item {
  width: 16.66666667% !important;
}
.mx-templategrid[class*="tg-col"].tg-col-xs-1 .mx-templategrid-item {
  width: 8.33333333% !important;
}
@media (min-width: 768px) {
  .mx-templategrid[class*="tg-col"].tg-col-sm-12 .mx-templategrid-item {
    width: 100% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-11 .mx-templategrid-item {
    width: 91.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-10 .mx-templategrid-item {
    width: 83.33333333% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-9 .mx-templategrid-item {
    width: 75% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-8 .mx-templategrid-item {
    width: 66.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-7 .mx-templategrid-item {
    width: 58.33333333% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-6 .mx-templategrid-item {
    width: 50% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-5 .mx-templategrid-item {
    width: 41.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-4 .mx-templategrid-item {
    width: 33.33333333% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-3 .mx-templategrid-item {
    width: 25% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-2 .mx-templategrid-item {
    width: 16.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-sm-1 .mx-templategrid-item {
    width: 8.33333333% !important;
  }
}
@media (min-width: 992px) {
  .mx-templategrid[class*="tg-col"].tg-col-md-12 .mx-templategrid-item {
    width: 100% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-11 .mx-templategrid-item {
    width: 91.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-10 .mx-templategrid-item {
    width: 83.33333333% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-9 .mx-templategrid-item {
    width: 75% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-8 .mx-templategrid-item {
    width: 66.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-7 .mx-templategrid-item {
    width: 58.33333333% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-6 .mx-templategrid-item {
    width: 50% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-5 .mx-templategrid-item {
    width: 41.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-4 .mx-templategrid-item {
    width: 33.33333333% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-3 .mx-templategrid-item {
    width: 25% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-2 .mx-templategrid-item {
    width: 16.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-md-1 .mx-templategrid-item {
    width: 8.33333333% !important;
  }
}
@media (min-width: 1200px) {
  .mx-templategrid[class*="tg-col"].tg-col-lg-12 .mx-templategrid-item {
    width: 100% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-11 .mx-templategrid-item {
    width: 91.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-10 .mx-templategrid-item {
    width: 83.33333333% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-9 .mx-templategrid-item {
    width: 75% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-8 .mx-templategrid-item {
    width: 66.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-7 .mx-templategrid-item {
    width: 58.33333333% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-6 .mx-templategrid-item {
    width: 50% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-5 .mx-templategrid-item {
    width: 41.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-4 .mx-templategrid-item {
    width: 33.33333333% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-3 .mx-templategrid-item {
    width: 25% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-2 .mx-templategrid-item {
    width: 16.66666667% !important;
  }
  .mx-templategrid[class*="tg-col"].tg-col-lg-1 .mx-templategrid-item {
    width: 8.33333333% !important;
  }
}

/* ==========================================================================
   Typography
========================================================================== */
p {
  line-height: 1.78571;
}

label {
  padding-top: 0;
}

.mx-title {
  margin: 15px 0 30px 0;
  color: #17347B;
  font-size: 2.214em;
  font-weight: normal;
}

h1,
.h1,
.h1 > * {
  font-size: 2.214em;
}

h2,
.h2,
.h2 > * {
  font-size: 1.857em;
}

h3,
.h3,
.h3 > * {
  font-size: 1.714em;
}

h4,
.h4,
.h4 > * {
  font-size: 1.286em;
}

h5,
.h5,
.h5 > * {
  font-size: 1em;
}

h6,
.h6,
.h6 > * {
  font-size: 0.857em;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  margin: 15px 0 30px 0;
  color: #17347B;
  font-weight: normal;
  line-height: 1.3;
}

.text-small {
  font-size: 0.857em !important;
}

.text-large {
  font-size: 1.143em!important;
}

.text-light,
.text-light > *,
.text-light label {
  font-weight: 100 !important;
}

.text-normal,
.text-normal > *,
.text-normal label {
  font-weight: normal !important;
}

.text-semibold,
.text-semibold > *,
.text-semibold label {
  font-weight: 600 !important;
}

.text-bold,
.text-bold > *,
.text-bold label {
  font-weight: bold !important;
}

.text-default,
.text-default:hover {
  color: #555555 !important;
}

.text-primary,
.text-primary:hover {
  color: #0595DB !important;
}

.text-info,
.text-info:hover {
  color: #48B0F7 !important;
}

.text-success,
.text-success:hover {
  color: #76CA02 !important;
}

.text-warning,
.text-warning:hover {
  color: #F99B1D !important;
}

.text-danger,
.text-danger:hover {
  color: #ED1C24 !important;
}

.text-header {
  color: #17347B !important;
}

.text-detail {
  color: #888888 !important;
}

.text-white {
  color: #FFFFFF;
}

.text-left {
  display: block;
  text-align: left !important;
}

.text-center {
  display: block;
  text-align: center !important;
}

.text-right {
  display: block;
  text-align: right !important;
}

.text-justify {
  text-align: justify !important;
}

.text-lowercase {
  text-transform: lowercase !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

.text-capitalize {
  text-transform: capitalize !important;
}

.text-break {
  word-break: break-all !important;
  word-break: break-word !important;
  -ms-word-break: break-all !important;
  -webkit-hyphens: auto !important;
  -moz-hyphens: auto !important;
  hyphens: auto !important;
}

.text-nowrap {
  white-space: nowrap !important;
}

/* ==========================================================================
   Layout Grid

   Default Bootstrap containers
========================================================================== */
@media (max-width: 767px) {
  .row {
    margin-right: -7.5px;
    margin-left: -7.5px;
  }
}

.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
  padding-right: 15px;
  padding-left: 15px;
}
@media (max-width: 767px) {
  .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
    padding-right: 7.5px;
    padding-left: 7.5px;
  }
}

.v-center {
  display: table;
  width: 100%;
}
.v-center::before, .v-center::after {
  display: none;
}
.v-center .row {
  display: table-row;
}
.v-center .row > [class*="col-"] {
  display: table-cell;
  float: none;
  vertical-align: middle;
}
.v-center .row > [class*="col-"]:first-child {
  padding-left: 0;
}
.v-center .row > [class*="col-"]:last-child {
  padding-right: 0;
}

.no-gutter > [class*="col-"] {
  padding-right: 0;
  padding-left: 0;
}

.mx-progress {
  color: #555555;
  background: #F5F8FD;
}

.mx-progress .mx-progress-message {
  color: #555555;
}
/*
.mx-progress .mx-progress-indicator {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  height: 2px;
  margin: auto;
  padding: 0;
  border-radius: 0;
  background: #EEEEEE;
}
.mx-progress .mx-progress-indicator:before, .mx-progress .mx-progress-indicator:after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 50%;
  height: 2px;
  content: "";
  transform: translate3d(-100%, 0, 0);
  background: #0595DB;
}
.mx-progress .mx-progress-indicator::before {
  animation: loader 2s infinite;
}
.mx-progress .mx-progress-indicator::after {
  animation: loader 2s -2s infinite;
}

@keyframes loader {
  0% {
    transform: translate3d(-100%, 0, 0);
  }
  100% {
    transform: translate3d(200%, 0, 0);
  }
}


start the style for circle animation */
.mx-progress {
    background: transparent;
}
.mx-progress .mx-progress-indicator,
.mx-progress .mx-progress-indicator:after {
  border-radius: 50%;
  width: 10em;
  height: 10em;
  background: transparent;
}
.mx-progress .mx-progress-indicator {
  margin: 60px auto;
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.1em solid rgba(220,41,30, 0.2);
  border-right: 1.1em solid rgba(220,41,30, 0.2);
  border-bottom: 1.1em solid rgba(220,41,30, 0.2);
  border-left: 1.1em solid #dc291e;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: load8 1.1s infinite linear;
  animation: load8 1.1s infinite linear;
}
@-webkit-keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes load8 {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


.profile-phone .mx-progress-empty {
  position: relative;
  top: 45px;
  left: 0;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  height: 1px;
  margin: auto;
  padding: 0;
  border-radius: 0;
  background: #EEEEEE;
}
.profile-phone .mx-progress-empty:before, .profile-phone .mx-progress-empty:after {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  width: 50%;
  height: 1px;
  content: "";
  transform: translate3d(-100%, 0, 0);
  background: #0595DB;
}
.profile-phone .mx-progress-empty::before {
  animation: loader 2s infinite;
}
.profile-phone .mx-progress-empty::after {
  animation: loader 2s -2s infinite;
}
.profile-phone .mx-progress-empty .mx-progress-indicator, .profile-desktop .mx-progress-empty.mx-progress-hidden .mx-progress-indicator {
  display: none;
}

/* ==========================================================================
   Alignment Blocks

========================================================================== */
.flexcontainer {
  display: flex;
  overflow: hidden;
  flex: 1;
  flex-direction: row;
}
.flexcontainer .flexitem {
  margin-right: 15px;
}
.flexcontainer .flexitem:last-child {
  margin-right: 0;
}
.flexcontainer .flexitem-main {
  overflow: hidden;
  flex: 1;
}

.flex-center {
  align-items: center;
}

/* ==========================================================================
   Breadcrumbs

========================================================================== */
.breadcrumb {
  margin: 0;
  padding: 0;
  border-radius: 0;
  background-color: transparent;
  font-size: 14px;
}

.breadcrumb-item {
  display: inline-block;
  margin: 0;
}
.breadcrumb-item:last-child {
  color: #555555;
}
.breadcrumb-item:last-child a {
  text-decoration: none;
}

.breadcrumb-item + .breadcrumb-item::before {
  display: inline-block;
  padding-right: 10px;
  padding-left: 10px;
  content: "/";
  color: #888888;
}

.breadcrumb-large {
  font-size: 24px;
}

.breadcrumb-underline {
  padding-bottom: 15px;
  border-bottom: 1px solid #D7D7D7;
}

/* ==========================================================================
   Cards

========================================================================== */
.card {
  padding: 30px;
  border: 1px solid #D7D7D7;
  border-radius: 4px;
  background-color: #FFFFFF;
}

.card-title {
  margin-top: 0;
}

.cardaction .card-image .glyphicon {
  font-size: 58px;
}

.cardmetrics .card-title {
  margin-bottom: 0;
}
.cardmetrics .card-image {
  width: 100px;
  height: auto;
}
.cardmetrics .card-image.btn {
  width: 100px;
  height: 100px;
  padding: 0;
  cursor: default;
  pointer-events: none;
  font-size: 40px;
}
.cardmetrics .card-counter {
  margin: 0;
  font-size: 64px;
}

.cardinfo .card-text {
  margin-bottom: 30px;
}

.textwithicon {
  overflow: hidden;
  max-width: 100%;
  margin-bottom: 15px;
  text-overflow: ellipsis;
}
.textwithicon .textwithicon-icon,
.textwithicon .textwithicon-text {
  display: inline-block;
  vertical-align: middle;
}
.textwithicon .textwithicon-icon {
  margin-right: 15px;
  padding: 0;
  color: #0595DB;
  border: 0;
  background: transparent;
  font-size: 23px;
}

.socialprofiles .socialprofiles-title {
  display: block;
  margin-bottom: 10px;
  font-weight: bold;
}
.socialprofiles .socialprofiles-button {
  width: 24px;
  height: 24px;
  margin-right: 15px;
  padding: 0;
  border-radius: 24px;
}
.socialprofiles .socialprofiles-button .glyphicon {
  margin: 0;
}

.cardtabs {
  padding: 0;
}
.cardtabs .cardtabs-tabs {
  margin: 0;
}
.cardtabs .cardtabs-tabs ul.mx-tabcontainer-tabs {
  display: flex;
  margin: 0;
  background-color: #f7f7f7;
}
.cardtabs .cardtabs-tabs ul.mx-tabcontainer-tabs li {
  flex: 1 1 auto;
  text-align: center;
}
.cardtabs .cardtabs-tabs ul.mx-tabcontainer-tabs li a,
.cardtabs .cardtabs-tabs ul.mx-tabcontainer-tabs li a:hover,
.cardtabs .cardtabs-tabs ul.mx-tabcontainer-tabs li a:focus {
  border-top-width: 0;
  border-right-width: 1px;
  border-left-width: 0;
}
.cardtabs .cardtabs-tabs ul.mx-tabcontainer-tabs li:first-child a {
  border-radius: 4px 0 0 0;
}
.cardtabs .cardtabs-tabs ul.mx-tabcontainer-tabs li:last-child a {
  border-radius: 0 4px 0 0;
}
@media (max-width: 767px) {
  .cardtabs .cardtabs-tabs .mx-tabcontainer-pane {
    padding: 15px;
  }
}
@media (min-width: 768px) {
  .cardtabs .cardtabs-tabs .mx-tabcontainer-pane {
    padding: 30px;
  }
}
@media (min-width: 992px) {
  .cardtabs .cardtabs-tabs .mx-tabcontainer-pane {
    padding: 30px;
  }
}

.cardproduct, .cardproduct2, .cardproduct3 {
  padding: 0;
}
.cardproduct .cardproduct-header, .cardproduct2 .cardproduct-header, .cardproduct3 .cardproduct-header {
  position: relative;
  overflow: hidden;
  height: 200px;
}
.cardproduct .cardproduct-header .card-image, .cardproduct2 .cardproduct-header .card-image, .cardproduct3 .cardproduct-header .card-image {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: auto;
}
.cardproduct .cardproduct-header .cardproduct-overlay, .cardproduct2 .cardproduct-header .cardproduct-overlay, .cardproduct3 .cardproduct-header .cardproduct-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 20px 30px;
  background: rgba(0, 0, 0, 0.6);
}
.cardproduct .cardproduct-header .cardproduct-overlay .cardproduct-overlay-category, .cardproduct2 .cardproduct-header .cardproduct-overlay .cardproduct-overlay-category, .cardproduct3 .cardproduct-header .cardproduct-overlay .cardproduct-overlay-category,
.cardproduct .cardproduct-header .cardproduct-overlay .cardproduct-overlay-title,
.cardproduct2 .cardproduct-header .cardproduct-overlay .cardproduct-overlay-title,
.cardproduct3 .cardproduct-header .cardproduct-overlay .cardproduct-overlay-title {
  margin: 0;
  color: #FFFFFF;
}
.cardproduct .cardproduct-footer, .cardproduct2 .cardproduct-footer, .cardproduct3 .cardproduct-footer {
  position: relative;
  padding: 20px 30px;
}
.cardproduct .cardproduct-footer .cardproduct-name, .cardproduct2 .cardproduct-footer .cardproduct-name, .cardproduct3 .cardproduct-footer .cardproduct-name {
  margin: 0;
}
.cardproduct .cardproduct-footer .widget-star-rating-font, .cardproduct2 .cardproduct-footer .widget-star-rating-font, .cardproduct3 .cardproduct-footer .widget-star-rating-font {
  font-size: 20px;
}
.cardproduct .cardproduct-footer .cardproduct-btn, .cardproduct2 .cardproduct-footer .cardproduct-btn, .cardproduct3 .cardproduct-footer .cardproduct-btn {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  height: 100%;
  padding: 30px;
  border-left: 1px solid #D7D7D7;
}

.cardproduct2 .cardproduct-header::after {
  position: absolute;
  bottom: 0;
  left: 0;
  display: block;
  width: 100%;
  padding: 20px 30px;
  content: "";
  background: rgba(0, 0, 0, 0.6);
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(250, 250, 250, 0) 2%, rgba(0, 0, 0, 0.99) 99%, black 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(250, 250, 250, 0) 2%, rgba(0, 0, 0, 0.99) 99%, black 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(250, 250, 250, 0) 2%, rgba(0, 0, 0, 0.99) 99%, black 100%);
}

.cardproduct3 .cardproduct-header {
  height: 320px;
}
.cardproduct3 .cardproduct-header img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.cardproduct3 .cardproduct-header .cardproduct-overlay {
  min-height: 100px;
  padding: 30px;
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(250, 250, 250, 0) 8%, rgba(0, 0, 0, 0.99) 121%, black 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(250, 250, 250, 0) 8%, rgba(0, 0, 0, 0.99) 121%, black 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(250, 250, 250, 0) 8%, rgba(0, 0, 0, 0.99) 121%, black 100%);
  font-size: 14px;
}

.cardstatus {
  padding: 20px;
}
.cardstatus .card-linkicon {
  font-size: 30px;
}
.cardstatus .cardstatus-status {
  margin-bottom: 5px;
}

.cardprogress .cardprogress-state {
  width: 80px;
  height: 80px;
  padding: 0;
  cursor: default;
  pointer-events: none;
  border-radius: 100%;
  font-size: 28px;
}

.cardhighlight {
  border-top: 4px solid #0595DB;
}

/* ==========================================================================
   Control Group

   A group of buttons next to eachother
========================================================================== */
.controlgroup .btn,
.controlgroup .btn-group {
  margin-right: 5px;
  margin-bottom: 5px;
}
.controlgroup .btn:last-child,
.controlgroup .btn-group:last-child {
  margin-right: 0;
}
.controlgroup .btn .btn,
.controlgroup .btn-group .btn {
  margin-right: 0;
  margin-bottom: 0;
}
.controlgroup .btn-group .btn + .btn {
  margin-left: -1px;
}

/* ==========================================================================
   Full page blocks

   Blocks that take up the full width and height
========================================================================== */
.fullpageblock {
  position: relative;
  height: 100%;
  min-height: 100%;
}
.fullpageblock .fullheight {
  height: 100% !important;
}
.fullpageblock .fullheight > .mx-dataview-content {
  height: inherit !important;
}
.fullpageblock .fullpage-overlay {
  position: absolute;
  z-index: 10;
  bottom: 0;
  left: 0;
  width: 100%;
}

/* ==========================================================================
   Pageheader
========================================================================== */
.pageheader {
  border-bottom: 1px solid #D7D7D7;
  background: #F5F8FD;
}

.mx-scrollcontainer .mx-placeholder .mx-layoutgrid .pageheader {
  background: transparent;
}
@media (max-width: 767px) {
  .mx-scrollcontainer .mx-placeholder .mx-layoutgrid .pageheader {
    margin-bottom: 15px;
  }
}
@media (min-width: 768px) {
  .mx-scrollcontainer .mx-placeholder .mx-layoutgrid .pageheader {
    margin-bottom: 30px;
  }
}
@media (min-width: 992px) {
  .mx-scrollcontainer .mx-placeholder .mx-layoutgrid .pageheader {
    margin-bottom: 30px;
  }
}
@media (max-width: 767px) {
  .mx-scrollcontainer .mx-placeholder .mx-layoutgrid .pageheader {
    padding-bottom: 15px;
  }
}
@media (min-width: 768px) {
  .mx-scrollcontainer .mx-placeholder .mx-layoutgrid .pageheader {
    padding-bottom: 30px;
  }
}
@media (min-width: 992px) {
  .mx-scrollcontainer .mx-placeholder .mx-layoutgrid .pageheader {
    padding-bottom: 30px;
  }
}

.pageheader-type {
  margin: 0;
}

.pageheader-title {
  margin: 0;
}

.pageheader-subtitle {
  margin: 0;
}

.pageheaderwithsearch .pageheader-title {
  margin-bottom: 1em;
}

/* ==========================================================================
   Pageheader

========================================================================== */
.heroheader {
  border-bottom: 1px solid #D7D7D7;
  background: #F5F8FD;
}

.heroheader-title {
  margin: 0 0 10px 0;
}

.heroheader-subtitle {
  margin: 0;
  padding: 0 15px;
}
.heroheader-subtitle::before {
  display: block;
  max-width: 330px;
  height: 1px;
  margin: auto auto 10px auto;
  content: "";
  background-color: #e1e1e1;
}

.heroheader1 {
  background-image: linear-gradient(152deg, #0CC7F0 0%, #087ECC 51%, #077AC9 55%, #0659B9 78%);
}
.heroheader1 .heroheader-title {
  margin-bottom: 10px;
  color: #FFFFFF;
}
.heroheader1 .heroheader-subtitle {
  padding: 0;
  color: #FFFFFF;
}
.heroheader1 .heroheader-subtitle::before {
  display: none;
}

.heroheadermap .heroheadermap-map {
  height: 350px;
}
.heroheadermap .heroheadermap-controls {
  background: #F5F8FD;
}

.heroheaderproduct {
  position: relative;
  overflow: hidden;
  height: 300px;
  background-color: #000000;
}
.heroheaderproduct .heroheaderproduct-backgroundimage {
  position: absolute;
  z-index: 0;
  top: 0;
  width: 100%;
  opacity: 0.7;
  filter: blur(5px);
}
.heroheaderproduct .heroheaderproduct-overlay {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.heroheaderexpense .heroheaderexpense-title {
  font-size: 72px;
}
.heroheaderexpense .heroheaderexpense-type {
  align-items: center;
}
.heroheaderexpense .heroheaderexpense-type::before {
  flex-grow: 1;
  height: 1px;
  margin-right: 10px;
  content: "";
  background-color: #D2D2D2;
}

/* ==========================================================================
   Form Block

   Used in default forms
========================================================================== */
.formblock-title {
  margin-bottom: 15px;
  padding-bottom: 15px;
  border-bottom: 1px solid #D7D7D7;
}

/* ==========================================================================
   Lists

   Pre-styled listviews with content
========================================================================== */
/* ==========================================================================
   Master Detail

    A list with a listening dataview
========================================================================== */
.masterdetail {
  position: relative;
}
@media (min-width: 992px) {
  .masterdetail .mx-layoutgrid {
    padding: 0 15px !important;
  }
}
.masterdetail .masterdetail-master .controlgroup {
  margin-bottom: 15px;
}
@media (min-width: 992px) {
  .masterdetail .masterdetail-master {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    padding: 0;
    border-right: 1px solid #D7D7D7;
  }
  .masterdetail .masterdetail-master .mx-listview-searchbar {
    margin: 15px;
  }
  .masterdetail .masterdetail-master .controlgroup {
    margin: 0;
    padding: 15px;
    border-bottom: 1px solid #D7D7D7;
  }
}
@media (min-width: 992px) and (max-width: 767px) {
  .masterdetail .masterdetail-detail {
    padding: 15px 15px 15px 15px;
  }
}
@media (min-width: 992px) and (min-width: 768px) {
  .masterdetail .masterdetail-detail {
    padding: 30px 30px 30px 30px;
  }
}
@media (min-width: 992px) and (min-width: 992px) {
  .masterdetail .masterdetail-detail {
    padding: 30px 30px 30px 30px;
  }
}

@media (max-width: 767px) {
  .masterdetailvertical .masterdetail-master {
    margin-bottom: 15px;
  }
}
@media (min-width: 768px) {
  .masterdetailvertical .masterdetail-master {
    margin-bottom: 30px;
  }
}
@media (min-width: 992px) {
  .masterdetailvertical .masterdetail-master {
    margin-bottom: 30px;
  }
}
@media (max-width: 767px) {
  .masterdetailvertical .masterdetail-detail {
    padding-top: 15px;
  }
}
@media (min-width: 768px) {
  .masterdetailvertical .masterdetail-detail {
    padding-top: 30px;
  }
}
@media (min-width: 992px) {
  .masterdetailvertical .masterdetail-detail {
    padding-top: 30px;
  }
}

/* ==========================================================================
   User profile blocks
   -
========================================================================== */



.wizard {
  display: flex;
  justify-content: space-between;
}
.wizard .wizard-step {
  position: relative;
  width: 100%;
  text-align: center;
}
.wizard .wizard-step::before {
  position: absolute;
  z-index: -1;
  top: 30px;
  display: block;
  width: 100%;
  height: 2px;
  content: "";
  background-color: #D7D7D7;
}
.wizard .wizard-step .wizard-step-number {
  width: 60px;
  height: 60px;
  border-color: #D7D7D7;
  border-radius: 50%;
  background-color: #FFFFFF;
  font-size: 20px;
}
.wizard-step.visited .wizard-step-number{
  background-image: none!important;
 }
.wizard .wizard-step .wizard-step-text {
  display: block;
  margin-top: 15px;
}
.wizard .wizard-step-active .wizard-step-number {
  color: #FFFFFF;
  border-color: #0595DB;
  background-color: #0595DB;
}
.wizard .wizard-step-active .wizard-step-text {
  color: #0595DB;
}
.wizard .wizard-step-visited .wizard-step-number {
  color: #FFFFFF;
  border-color: #76CA02;
  background-color: #76CA02;
}

.wizardprogress {
  display: flex;
  justify-content: space-between;
}
.wizardprogress .wizard-step-text {
  width: 100%;
}
.wizardprogress .wizard-step {
  position: relative;
  width: 100%;
  height: 50px;
  margin-left: -25px;
  padding-left: 25px;
  border: 1px solid #D7D7D7;
  background: #FFFFFF;
}
.wizardprogress .wizard-step a {
  display: block;
  overflow: hidden;
  width: 100%;
  height: 100%;
  padding: 14px;
  white-space: nowrap;
  text-decoration: none;
  text-overflow: ellipsis;
  color: #555555;
}
.wizardprogress .wizard-step::before, .wizardprogress .wizard-step::after {
  position: absolute;
  z-index: 1;
  left: 100%;
  margin-left: -25px;
  content: " ";
  border-style: solid;
  border-color: transparent;
}
.wizardprogress .wizard-step::after {
  top: 1px;
  border-width: 24px;
  border-left-color: #FFFFFF;
}
.wizardprogress .wizard-step::before {
  top: 0;
  border-width: 25px;
  border-left-color: #D7D7D7;
}
.wizardprogress .wizard-step:first-child {
  margin-left: 0;
  padding-left: 0;
  border-radius: 5px 0 0 5px;
}
.wizardprogress .wizard-step:last-child {
  border-radius: 0 5px 5px 0;
}
.wizardprogress .wizard-step:last-child::before, .wizardprogress .wizard-step:last-child::after {
  display: none;
}
.wizardprogress .wizard-step-active {
  background: #0595DB;
}
.wizardprogress .wizard-step-active a {
  text-decoration: none;
  color: #FFFFFF;
}
.wizardprogress .wizard-step-active::after {
  border-left-color: #0595DB;
}
.wizardprogress .wizard-step-visited a {
  color: #0595DB;
}

.timeline .timeline-header {
  display: inline-block;
  width: 110px;
  padding: 8px;
  text-align: center;
  border: 1px solid #D7D7D7;
  border-radius: 30px;
}

.timeline-itemwrapper.mx-listview {
  margin-bottom: 0;
  margin-left: 55px;
  padding: 30px 0;
  border-left: 1px solid #D7D7D7;
}
.timeline-itemwrapper.mx-listview > ul > .mx-listview-item {
  position: relative;
  padding-left: 30px;
}
.timeline-itemwrapper.mx-listview > ul > .mx-listview-item::before {
  position: absolute;
  top: 5px;
  left: -5px;
  display: block;
  width: 10px;
  height: 10px;
  content: "";
  border-radius: 50%;
  background-color: #0595DB;
}
.timeline-itemwrapper.mx-listview .mx-listview-item + .mx-listview-item {
  margin-top: 30px;
}

.timeline2 .timeline-itemwrapper.mx-listview > ul > .mx-listview-item {
  padding-left: 15px;
}

/* ==========================================================================
   Atlas layout

   The core stucture of all atlas layouts
========================================================================== */
.layout-atlas .toggle-btn > .glyphicon {
  margin: 0;
}
.layout-atlas .region-sidebar {
  background-color: #252C36;
}
.layout-atlas .region-sidebar .mx-navigationtree .navbar-inner > ul > li > a {
  padding: 0 15px;
}
.layout-atlas .region-sidebar .mx-navigationtree .navbar-inner > ul > li > a .glyphicon {
  margin-right: 10px;
}
.layout-atlas .region-sidebar .toggle-btn {
  border-color: transparent;
  border-radius: 0;
  background: transparent;
}
.layout-atlas .region-topbar {
  position: relative;
  z-index: 1;
  min-height: 60px;
  border-bottom: 1px solid #D7D7D7;
  background-color: #FFFFFF;
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.14);
}

.layout-atlas .region-topbar .topbar-content {
  display: flex;
  align-items: center;
  min-height: 60px;
}
.layout-atlas .region-topbar .toggle-btn {
  margin-right: 15px;
  padding: 5px;
}
.layout-atlas .region-topbar .navbar-brand {
  display: inline-block;
  float: none;
  height: auto;
  padding: 0;
  line-height: inherit;
}
.layout-atlas .region-topbar .navbar-brand img {
  display: inline-block;
  width: auto;
  height: 30px;
}
.layout-atlas .region-topbar .navbar-brand a {
  margin-left: 5px;
  color: #D7D7D7;
  font-size: 20px;
}
.layout-atlas .region-topbar .navbar-brand a:hover, .layout-atlas .region-topbar .navbar-brand a:focus {
  text-decoration: none;
}
.layout-atlas .region-topbar .mx-navbar {
  display: inline-block;
  margin-left: 15px;
  vertical-align: middle;
  background: transparent;
}
.layout-atlas .region-topbar .mx-navbar > .mx-navbar-item > a {
  margin-top: 5px;
  padding: 0 20px;
}

/* ==========================================================================
   Atlas layout

   Extra styling for phone layouts
========================================================================== */
.layout-atlas-phone .region-topbar {
  min-height: 45px;
  border-style: none;
  background-color: #FFFFFF;
}
.layout-atlas-phone .region-topbar::before {
  display: none;
}

/* ==========================================================================
   Atlas layout

   Extra styling for responsive layouts
========================================================================== */
@media (min-width: 768px) {
  .layout-atlas-responsive-default .mx-scrollcontainer:not(.mx-scrollcontainer-open) > .region-sidebar {
    width: 60px !important;
  }
  .layout-atlas-responsive-default .mx-scrollcontainer:not(.mx-scrollcontainer-open) > .region-sidebar .mx-scrollcontainer-wrapper > .mx-navigationtree ul li.mx-navigationtree-has-items:hover a {
    background-color: #1d222a;
  }
  .layout-atlas-responsive-default .mx-scrollcontainer:not(.mx-scrollcontainer-open) > .region-sidebar .mx-scrollcontainer-wrapper > .mx-navigationtree ul li.mx-navigationtree-has-items:hover ul {
    position: absolute;
    z-index: 100;
    top: 0;
    bottom: 0;
    left: 60px;
    display: block;
    overflow-y: auto;
    min-width: 200px;
    padding-top: 10px;
  }
  .layout-atlas-responsive-default .mx-scrollcontainer:not(.mx-scrollcontainer-open) > .region-sidebar .mx-scrollcontainer-wrapper > .mx-navigationtree ul li.mx-navigationtree-collapsed ul, .layout-atlas-responsive-default .mx-scrollcontainer:not(.mx-scrollcontainer-open) > .region-sidebar .mx-scrollcontainer-wrapper > .mx-navigationtree ul li.mx-navigationtree-has-items ul {
    display: none;
  }
}
@media (max-width: 767px) {
  .layout-atlas-responsive-default .mx-scrollcontainer-open {
    width: 1100px;
  }
}
.layout-atlas-responsive-default .region-sidebar .toggle-btn {
  width: 60px;
  height: 60px;
  border-color: transparent;
  border-radius: 0;
  background: transparent;
}
.layout-atlas-responsive-default .region-sidebar .mx-scrollcontainer-wrapper > .mx-navigationtree .navbar-inner > ul > li > a {
  height: 60px;
}
.layout-atlas-responsive-default .region-sidebar .mx-scrollcontainer-wrapper > .mx-navigationtree .navbar-inner > ul > li > a .glyphicon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin-left: -5px;
  padding: 10px;
  border-radius: 3px;
}
.layout-atlas-responsive-default .region-sidebar .mx-scrollcontainer-wrapper > .mx-navigationtree .navbar-inner > ul > li > a.active .glyphicon {
  background: #0595DB;
}

.layout-atlas-responsive-default .region-topbar .toggle-btn,
.layout-atlas-responsive-topbar .region-topbar .toggle-btn {
  display: none;
}
@media (max-width: 767px) {
  .layout-atlas-responsive-default .region-topbar .toggle-btn,
  .layout-atlas-responsive-topbar .region-topbar .toggle-btn {
    display: inline-block;
  }
}

.profile-tablet .mx-scrollcontainer:not(.mx-scrollcontainer-open) > .region-sidebar {
  overflow-y: auto;
}
.profile-tablet .mx-scrollcontainer:not(.mx-scrollcontainer-open) > .region-sidebar .mx-scrollcontainer-wrapper {
  overflow: visible;
}

/* ==========================================================================
   Atlas layout

   Extra styling for tablet layouts
========================================================================== */
/* Based on https://github.com/mendixlabs/star-rating/blob/v1.1.1/src/ui/StarRating.scss */
div.widget-progress-bar .progress-bar-default {
  background-color: #DDDDDD;
}

div.widget-progress-bar .progress-bar-primary {
  background-color: #0595DB;
}

div.widget-progress-bar .progress-bar-success {
  /* background-color: #76CA02; */
  background-color: #50e3c2;
}

div.widget-progress-bar .progress-bar-info {
  background-color: #48B0F7;
}

div.widget-progress-bar .progress-bar-warning {
  background-color: #F99B1D;
}

div.widget-progress-bar .progress-bar-danger {
  background-color: #ED1C24;
}

div.widget-progress-bar .progress-bar-inverse {
  background-color: #252C36;
}

div.widget-progress-bar-alert.widget-progress-bar-text-contrast .progress-bar {
  color: #8e1116;
}

div.widget-progress-bar-text-contrast .progress-bar {
  color: #555555;
}

/* Based on https://github.com/mendixlabs/progress-circle/tree/master/src/ui/_progress-circle-theme.scss */
path.widget-progress-circle-path {
  stroke: #0595DB;
}

.widget-progress-circle-primary path.widget-progress-circle-path {
  stroke: #0595DB;
}
.widget-progress-circle-primary .progressbar-text {
  color: #0595DB !important;
}

.widget-progress-circle-info path.widget-progress-circle-path {
  stroke: #48B0F7;
}
.widget-progress-circle-info .progressbar-text {
  color: #48B0F7 !important;
}

.widget-progress-circle-success path.widget-progress-circle-path {
  stroke: #76CA02;
}
.widget-progress-circle-success .progressbar-text {
  color: #76CA02 !important;
}

.widget-progress-circle-warning path.widget-progress-circle-path {
  stroke: #F99B1D;
}
.widget-progress-circle-warning .progressbar-text {
  color: #F99B1D !important;
}

.widget-progress-circle-danger path.widget-progress-circle-path {
  stroke: #ED1C24;
}
.widget-progress-circle-danger .progressbar-text {
  color: #ED1C24 !important;
}

.widget-progress-circle-inverse path.widget-progress-circle-path {
  stroke: #252C36;
}
.widget-progress-circle-inverse .progressbar-text {
  color: #252C36 !important;
}

div.widget-range-slider .rc-slider-handle,
div.widget-range-slider .rc-slider-dot-active {
  border-color: #DDDDDD;
}
div.widget-range-slider .rc-slider-handle:active,
div.widget-range-slider .rc-slider-dot-active:active {
  border-color: #DDDDDD;
  box-shadow: none;
}
div.widget-range-slider .rc-slider-handle:hover,
div.widget-range-slider .rc-slider-dot-active:hover {
  border-color: #DDDDDD;
}
div.widget-range-slider.has-error .rc-slider-track,
div.widget-range-slider.has-error .rc-slider-rail {
  background-color: #ED1C24;
}

div.widget-range-slider-primary .rc-slider-track {
  background-color: #0595DB;
}

div.widget-range-slider-info .rc-slider-track {
  background-color: #48B0F7;
}

div.widget-range-slider-success .rc-slider-track {
  background-color: #76CA02;
}

div.widget-range-slider-warning .rc-slider-track {
  background-color: #F99B1D;
}

div.widget-range-slider-danger .rc-slider-track {
  background-color: #ED1C24;
}

div.widget-range-slider-inverse .rc-slider-track {
  background-color: #252C36;
}

div.widget-slider .rc-slider-handle,
div.widget-slider .rc-slider-dot-active {
  border-color: #DDDDDD;
}
div.widget-slider .rc-slider-handle:active,
div.widget-slider .rc-slider-dot-active:active {
  border-color: #DDDDDD;
}
div.widget-slider .rc-slider-handle:hover,
div.widget-slider .rc-slider-dot-active:hover {
  border-color: #DDDDDD;
}
div.widget-slider.has-error .rc-slider-track,
div.widget-slider.has-error .rc-slider-rail {
  background-color: #ED1C24;
}

div.widget-slider-primary .rc-slider-track {
  background-color: #0595DB;
}

div.widget-slider-info .rc-slider-track {
  background-color: #48B0F7;
}

div.widget-slider-success .rc-slider-track {
  background-color: #76CA02;
}

div.widget-slider-warning .rc-slider-track {
  background-color: #F99B1D;
}

div.widget-slider-danger .rc-slider-track {
  background-color: #ED1C24;
}

div.widget-slider-inverse .rc-slider-track {
  background-color: #252C36;
}

/* Based on https://github.com/mendixlabs/star-rating/blob/v1.1.1/src/ui/StarRating.scss */
span.widget-star-rating-full-default {
  color: #DDDDDD;
}

span.widget-star-rating-full-primary {
  color: #0595DB;
}

span.widget-star-rating-full-success {
  color: #76CA02;
}

span.widget-star-rating-full-info {
  color: #48B0F7;
}

span.widget-star-rating-full-warning {
  color: #F99B1D;
}

span.widget-star-rating-full-danger {
  color: #ED1C24;
}

span.widget-star-rating-full-inverse {
  color: #252C36;
}

div.widget-switch.iOS .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-default {
  border-color: #64bd63;
  background-color: #64bd63;
  box-shadow: #64bd63 0 0 0 16px inset;
}
div.widget-switch.iOS .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-success {
  border-color: #76CA02;
  background-color: #76CA02;
  box-shadow: #76CA02 0 0 0 16px inset;
}
div.widget-switch.iOS .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-info {
  border-color: #48B0F7;
  background-color: #48B0F7;
  box-shadow: #48B0F7 0 0 0 16px inset;
}
div.widget-switch.iOS .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-primary {
  border-color: #0595DB;
  background-color: #0595DB;
  box-shadow: #0595DB 0 0 0 16px inset;
}
div.widget-switch.iOS .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-warning {
  border-color: #F99B1D;
  background-color: #F99B1D;
  box-shadow: #F99B1D 0 0 0 16px inset;
}
div.widget-switch.iOS .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-danger {
  border-color: #ED1C24;
  background-color: #ED1C24;
  box-shadow: #ED1C24 0 0 0 16px inset;
}
div.widget-switch.iOS .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-inverse {
  border-color: #252C36;
  background-color: #252C36;
  box-shadow: #252C36 0 0 0 16px inset;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-default {
  background-color: #92cec7;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-default .widget-switch-btn {
  background: #6FBEB5;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-success {
  background-color: #94fd03;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-success .widget-switch-btn {
  background: #76CA02;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-info {
  background-color: #79c5f9;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-info .widget-switch-btn {
  background: #48B0F7;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-primary {
  background-color: #19b0fa;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-primary .widget-switch-btn {
  background: #0595DB;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-warning {
  background-color: #fab14f;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-warning .widget-switch-btn {
  background: #F99B1D;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-danger {
  background-color: #f14b52;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-danger .widget-switch-btn {
  background: #ED1C24;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-inverse {
  background-color: #3a4554;
}
div.widget-switch.android .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-inverse .widget-switch-btn {
  background: #252C36;
}
div.widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-default {
  border-color: #303942;
  background-color: #303942;
  box-shadow: #303942 0 0 0 16px inset;
}
div.widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-success {
  border-color: #76CA02;
  background-color: #76CA02;
  box-shadow: #76CA02 0 0 0 16px inset;
}
div.widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-info {
  border-color: #48B0F7;
  background-color: #48B0F7;
  box-shadow: #48B0F7 0 0 0 16px inset;
}
div.widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-primary {
  border-color: #0595DB;
  background-color: #0595DB;
  box-shadow: #0595DB 0 0 0 16px inset;
}
div.widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-warning {
  border-color: #F99B1D;
  background-color: #F99B1D;
  box-shadow: #F99B1D 0 0 0 16px inset;
}
div.widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-danger {
  border-color: #ED1C24;
  background-color: #ED1C24;
  box-shadow: #ED1C24 0 0 0 16px inset;
}
div.widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-inverse {
  border-color: #252C36;
  background-color: #252C36;
  box-shadow: #252C36 0 0 0 16px inset;
}

html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-default {
  background-color: #92cec7;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-default .widget-switch-btn {
  background: #6FBEB5;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-success {
  background-color: #94fd03;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-success .widget-switch-btn {
  background: #76CA02;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-info {
  background-color: #79c5f9;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-info .widget-switch-btn {
  background: #48B0F7;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-primary {
  background-color: #19b0fa;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-primary .widget-switch-btn {
  background: #0595DB;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-warning {
  background-color: #fab14f;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-warning .widget-switch-btn {
  background: #F99B1D;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-danger {
  background-color: #f14b52;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-danger .widget-switch-btn {
  background: #ED1C24;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-inverse {
  background-color: #3a4554;
}
html div.dj_android .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-inverse .widget-switch-btn {
  background: #252C36;
}
html div.dj_ios .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-default {
  border-color: #64bd63;
  background-color: #64bd63;
  box-shadow: #64bd63 0 0 0 16px inset;
}
html div.dj_ios .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-success {
  border-color: #76CA02;
  background-color: #76CA02;
  box-shadow: #76CA02 0 0 0 16px inset;
}
html div.dj_ios .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-info {
  border-color: #48B0F7;
  background-color: #48B0F7;
  box-shadow: #48B0F7 0 0 0 16px inset;
}
html div.dj_ios .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-primary {
  border-color: #0595DB;
  background-color: #0595DB;
  box-shadow: #0595DB 0 0 0 16px inset;
}
html div.dj_ios .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-warning {
  border-color: #F99B1D;
  background-color: #F99B1D;
  box-shadow: #F99B1D 0 0 0 16px inset;
}
html div.dj_ios .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-danger {
  border-color: #ED1C24;
  background-color: #ED1C24;
  box-shadow: #ED1C24 0 0 0 16px inset;
}
html div.dj_ios .widget-switch.auto .widget-switch-btn-wrapper.checked.widget-switch-btn-wrapper-inverse {
  border-color: #252C36;
  background-color: #252C36;
  box-shadow: #252C36 0 0 0 16px inset;
}




/****  NEW MOCKUPS DESIGN START  ****/


/** MENU **/
.region-topbar.menubar-landing, .region-topbar.menubar-landing {
  background: transparent;
  width: 100%;
  padding: 30px 0;
  border-bottom: 0px solid #D7D7D7!important;
  box-shadow: none!important;
  z-index: 99!important;
}

.region-topbar.menubar-landing::before {
  background-color: transparent!important;
}
.region-topbar.menubar-landing .menu-list, .region-topbar.transparent-landing .menu-list  {
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
}
.region-topbar.menubar-landing .menu-list li, .region-topbar.transparent-landing .menu-list li {
  border-color: transparent !important;
  background-color: transparent!important;
  color: white;
  margin: 0 10px;
  font-size: 1.5rem;
}
/* Start Sandra's fix for 2080851*/
.region-topbar.menubar-landing .logout-btn{
  background-color: white;
  border-radius: none;
  font-size: 17.6px;
  font-weight: bold;
  color: #5a787a;
  text-align: center;
  padding: 0px;
  width: 127px;
  height: 42px;
  border-radius:3.2px;
  margin-bottom: 0;
  font-family: 'Montserrat'

}


.region-topbar.menubar-landing .gloab-btn {
  margin: 10px 5px;
  border: none;
  background-color: transparent;
  font-size: 24px;
  color: white;
  padding: 0 10px;  
  text-shadow: 2px 2px 2px #000;
}
/* ends fix for 2080851 */
.region-topbar.menubar-landing.dashbord{
  background-image: none;
  background-color: #303942;
  padding: 20px 0;
  position: relative;
 }

 .region-topbar.menubar-landing.dashbord .topbar-content{
  display: flex;
  align-items: center;
}
.fleet-logo{
  background-color: transparent;
  border: 0px solid;
  padding: 0;
}
.fleet-logo img{
  /* width: 160px;
  height: 60px; */
  height: 55px;
  margin-left: 25px;
  filter: drop-shadow(0px 2px 4px #000);
}
.fleet-logo:hover, .fleet-logo:focus, .fleet-logo.active {
  background-color: transparent;
  border: 0px solid;
}
 .login-btn {
    display: flex;
	justify-content: flex-end;
   }

@media (max-width:767px){
  .region-topbar.menubar-landing { padding: 10px 0; }
  .fleet-logo img{
    /* width: 100px; */
    height: 40px;
    margin-left: 0px !important;
  }
  .menubar-landing .login-btn button{
    padding: 5px;
}
.region-topbar.menubar-landing .gloab-btn {
  font-size: 14px!important;
  padding: 0;
  /* margin-top: 5px; */
}
.gloab-btn + button{
  padding: 0;
  margin: 0 8px;
}

}

.change-your-choice-area{
	font-weight: bold;
	
  margin-top:10px;
}



@media (min-width: 768px){
  .mobile-design-show{
      display: none;
  }
}
@media (max-width: 767px){
  .desktop-design-show{
      display: none;
  }
}
@media (min-width: 992px){
  .tab-design-show{
      display: none;
  }
}
@media (max-width: 991px){
  .largdevice-design-show{
      display: none;
  }
}


/*** Landing page start ***/

.landing-page{
  padding: 0 !important;
}
.landing-page .section-one-landing {

  background-image: url("../../images/img-section1.png");
  background: linear-gradient(180deg, rgba(10,90,255,0.2), rgba(255, 255, 255, 0.2) 50%), url(../../images/img-section1.png);
  padding-top: 400px;
  background-size: cover;
  width: 100%;
  height: 100vh;
  margin: 0;
  min-height: 920px;


  /* START Ganesh - Header Transparent on homepage - 2081704 */
  /*Tried the 1. position relative to parent and child to absolute, top:0 but that pulled subsequent div elemets upwards!*/
  /*2. make header transparent, and pull the sectionone element upwards using translateY leaves an empty space!*/
  /*3. resorted to margin-top -ve correction and added a related quantity for small screens! in line 6062*/
  margin-top: -130px !important;
  /* END Ganesh - Header Transparent on homepage - 2081704 */
  background-repeat: no-repeat;

}
.landing-page .section-text, .section-text{
  font-family: 'Montserrat';
  font-size:4em;
  line-height: 1;
  font-weight: bold;
  color: #fff;
  text-shadow: 2px 2px 8px #000000;
  z-index: 9;
  position: relative;
}
.landing-page .video-text{
  display: flex;
  align-items: center;
  color: #fff;
  font-size: 2rem;
  font-weight: bold;
  margin: 10px 0px;
}
.landing-page .mx-text{
  margin-left: 10px;
}
.landing-page .dropdown-section{
  background-color:#fff;
  margin-top: 20px;
  padding: 0px 10px 0px 20px;
  /* display: flex;
  align-items: center;
  justify-content: center; */
  box-shadow: 0px 6px 5px 2px rgba(0, 0, 0, 0.4);
  border-radius: 3px;
}
 .landing-page .arbic-dropdown {
	  padding:0!important;
 }
.landing-page .dropdown-section .country-section{
  width:100%;
}



.m-auto{
  margin: auto;
}
@media (max-width:767px){
  .landing-page .dropdown-section{
    padding: 0px 5px 0px 5px!important;;
  }
  .landing-page .section-one-landing{
    background-image: linear-gradient(180deg, rgba(10,90,255,0.2), rgba(255, 255, 255, 0.2) 50%), url(../../images/img-section1-mobile.png);
    padding-top: 150px;
    height: 100%;
    min-height: auto;
	margin-top: 50px;
  }
  .landing-page .section-text{
    font-size: 2.607em!important;
  }
  .landing-page
  .country-drop-down
    .country-section{
      display: block!important;
    }
    .landing-page
    .country-drop-down .country-section .country-text{
      width: 100%!important;
    }
    .landing-page
    .country-drop-down .joint-button{
      width: 94%!important;
    margin: 10px 0px 30px 10px !important;
    }
    .landing-page .license-section{
      padding:0px 8px!important;
    }
}

.dropdown-section .country-section{
  display: flex;
  align-items: center;
  justify-content: center;
  width:100%;
}
.dropdown-section .country-section .country-text{
  width:60%;
}
.dropdown-section .form-group{
  /* padding:25px 10px; */
  padding:25px 5px;
  border-right: 2px solid #ccc;
  margin:0px;
  padding-bottom: 10px;
}




@media (min-width:768px){
  .arbic-styles-fleet  .form-group{
    border-left: 2px solid #ccc;
    border-right: 0px solid!important;
  }
body[dir="rtl"]  .dropdown-section .form-group{
  border-left: 2px solid #ccc;
  border-right: 0px solid transparent;
}
}

.dropdown-section .no-border{
  border-left: none;
}

.arbic-styles-fleet .joint-button{
  margin-left:0px!important;
  margin-right:10px;
}

.landing-page .already-text{
  color:#fff;
  width:100%;
  text-align:left;
  margin-top:10px;
  text-shadow: 2px 2px 8px rgb(0, 0, 0);
  font-weight: bold;
  font-size: 1.429em;
  font-family: 'Montserrat';
}

.landing-page .joint-button{
  border-radius: none;
  font-size: 1.429em;
  font-family: 'Montserrat';
  font-weight: bold;
  color: white;
  margin-left:10px;
  padding:10px 10px;
  background-color:#303942;
  white-space: pre-wrap;
  width: 40%;
  min-height: 90px;
  margin-bottom: 0px;
}
body[dir="rtl"] .landing-page .joint-button{
  margin-right: 10px;
}
.section-middle-img-greystrip,
.section-middle-img-steps {
  background-repeat: no-repeat;
  background-size: contain;
	width:100%
}

.section-middle-img {
  background-image: url("../../images/img-how.png");
  height: 0px;
  background-repeat: no-repeat;
  background-size: contain;
  padding-bottom: 96.45%;
  margin-bottom: 20px;
}
 [dir="rtl"] .section-middle-img{
  background-image: url("../../images/img-how_ar.png");
  height: 0px;
  background-repeat: no-repeat;
  background-size: contain;
  padding-bottom: 96.45%;
  margin-bottom: 20px;
}

.section-middle-img-steps {
	background-image: url("../../images/img-steps-En.png");
	padding-bottom: 83.00%;
    margin-bottom: 0px;
}

.section-middle-img-greystrip {
	background-image: url("../../images/img-how-final.png");
  background-size: cover;
	padding-bottom: 22.3%;
  margin-bottom: 0px;
  width:100%;
  position: relative;
}

 [dir="rtl"] .section-middle-img-steps{
    background-image: url("../../images/img-steps-Ar.png");
}

[dir="rtl"] .section-middle-img-greystrip{
  background-image: url("../../images/img-how_ar.png");
  width: 102%;
}
.about-aramex-section {
  background-image: url("../../images/img-about.png");
  min-height: 420px;
  text-align: center;
  padding: 28px 0 0;
  background-size: cover;
  background-repeat: no-repeat;
  color: white;
  font-size: 25px;
  background-position: center right;
  display: flex;
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
 [dir="rtl"] .about-aramex-section {
  background-image: url("../../images/img-about-reverse.png");
  min-height: 500px;
  text-align: center;
  padding: 95px 20px 0;
  background-size: cover;
  background-repeat: no-repeat;
  color: white;
  font-size: 25px;
  background-position: center right;
}
.about-aramex-section h1{
  color: white;
  font-size: 36px;
}

@media (min-width:768px){
  [dir="ltr"]  .desc-align-styles{
    /* float: right; */
  }
  [dir="rtl"]  .desc-align-styles{
    /* float: left; */
    text-align: right;
  }
 /* .desc-align-styles{
    width: 765px!important;
    margin: 0 10px;
  } */
  .desc-align-styles .width-70 {
  width: 765px;
  margin: 15px 10px;
}
.about-aramex-section .heading {
  color: #5d5d5d;
  font-weight: bold;
  padding: 10px 0 0px 0;
  font-size: 1.5em;
  margin: 0;
}
.about-aramex-section-en {
  min-height: 300px;
  text-align: center;
  /* padding-top: 95px; */
  padding: 25px 20px;
  background-position-x: 20%;
  background-image: url(../../images/img-about_mobile_en.png)!important;
  font-size: 16px!important;
  color: white;
}
.desc-align-styles-en .width-70, .desc-align-styles-en {
  width: 100%!important;
}
}
 .desc-align-styles{
  display: flex;
  align-items: center;
  width: 90%;
  text-align: left;

}
[dir="rtl"]  .desc-align-styles{
  display: flex;
  align-items: center;
  width: 90%;

}

@media (max-width:767px){
  .desc-align-styles   .width-70{
    width: 100%!important;
  }

	.about-aramex-section-en {
    min-height: 300px;
    text-align: center;
    /* padding-top: 95px; */
    padding: 25px 20px;
    background-position-x: 20%;
    background-image: url("../../images/img-about_mobile_en.png")!important;
    font-size: 16px!important;

  }
  .about-aramex-section-ar {
    min-height: 300px;
    text-align: center;
    /* padding-top: 95px; */
    padding: 25px 20px;
    background-position-x: 70%;
    background-image: url("../../images/img-about_mobile_ar.png")!important;
    font-size: 16px!important;
	}
}
.about-aramex-section .content {
  padding: 0 7%;
}

.about-aramex-section .heading {
  color: #fff;
  /* font-weight: 600; */
  padding: 30px 0 40px 0;
  font-family: 'Montserrat';
  font-size: 32px;
  margin: 0;
}

.about-aramex-section .description {
  color: #fff;
  font-size: 1.2em;
  line-height: 1.6;
}

@media (max-width:767px){
  .dropdown-section .form-group{
    padding:5px 10px;
    border-right: 0px solid #ccc;
    text-align: center;
    border-bottom: 1px solid #ccc;
  }
  .landing-page .joint-button{
    width: 35%;
    min-height: 55px;
    font-size: 14px;
  }
}



/****** News Section********/
.news-section .heading {
  color: #495663;
  margin: 50px 0;
  text-align: center;
  font-weight: bold;
}
.news-section .news-card {
  background-color: #fff;
  border: 1px solid #808892;
  border-radius: 10px;
  border-collapse: inherit;
  margin: 10px 0;
}
.news-section .news-card .news-image {
  /* background-image: url("../../images/1.jpg"); */
  /* height: 300px; */
  background-position: center;
  background-size: cover;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
  padding: 0;
  overflow: hidden;
}
.news-section .news-card .news-image img{
  width:100%;
}
.news-section .news-card .content {
  padding: 20px;
}
.news-section .news-card .content .news-number {
  font-size: 1.8em;
  margin: 20px 0;
  color: #546a79;
  font-weight: bold;
}
.news-section .news-card .content .text {
  color: #546a79;
}
.news-section .news-card .content .see-details {
  width: 100%;
  font-size: 1.2em;
  padding: 24px 0;
  color: #fff;
  text-align: center;
  display: flex;
  justify-content: center;
  margin: 30px auto 10px auto;
  background-color: #303942;
}


/*****  side menu  start  ******/
@media (max-width:767px) {
  .side-menu-mobile-hide{
   width: 100px!important;
  }
  .mx-scrollcontainer-open .side-menu-mobile-hide{
      width: 0px!important;
     }

  }
.sidemenu-dashbord{
  height:100% !important;
  background-color:#ededed;
  /*overflow-y: auto;*/
}


.sidemenu-dashbord .mx-navigationtree .navbar-inner > ul{
    position: relative;
    top:45px;
}
@media (min-width:768px){
  .sidemenu-dashbord .mx-navigationtree .navbar-inner{
    background-color: #ccc;
    /* overflow-y:auto;
    overflow-x: hidden;
    height: 740px;
    max-height: 740px; */
  }
}

.sidemenu-dashbord  .mx-navigationtree .navbar-inner > ul > li a{
    background-color: #fff;
    color: #bfbfbf;
    display: grid;
    /* display: block; */
    border-bottom: 0px solid #fff;
    min-height: 85px;
    padding: 5px 1px;
    text-align: center;
}
.sidemenu-dashbord .mx-navigationtree .navbar-inner > ul > li a.active{
     color: #36404e;
     border-right: 2px solid #36404e;
 }
 body[dir="rtl"] .sidemenu-dashbord .mx-navigationtree .navbar-inner > ul > li a.active{
  color: #36404e;
  border-right: 0px solid #36404e!important;
  border-left: 2px solid #36404e;
}
/*****  side menu  end  ******/

/******* Footer *********/
.footer-section {
  background-color: #303942;
  padding: 0 25px;
}
.footer-section .heading {
  color: #fff;
  font-size: 1.4em;
  margin: 8px 0;
  font-weight: bold;
  font-family: 'Montserrat';
}
@media (max-width:767px){
	.footer-section .heading {
	  color: #fff;
	  font-size: 1.4em;
	  margin: 8px 0;
    font-weight: bold;
    line-height: 3;
  }
  .footer-section {
    background-color: #303942;
    padding: 0 0px;
  }
  .footer-section .footer-table .mx-name-table10 .heading{
    text-align: center;
  }
}
.footer-section .content {
 /* padding: 0 6%; */
  padding-left: 6%!important;
  padding-right: 6%!important;
}
.footer-section .links {
  color: #fff;
  margin: 10px 0;
}
.footer-section .copyright {
  border-top: 1px solid #888;
  margin-top: 30px;
  padding: 10px 0;
  text-align: center;
  color: #fff;
}
.footer-section .copyright .logo-text {
  font-size: 5em;
  font-weight: bold;
  /* letter-spacing: -3px; */
    line-height: 1;
}


/***  Personal information start  ***/

.Personal-information{
    /*padding-top:200px!important;*/
}
.layout-anon{
  width: 100%;
  min-height: 662px;
  background-image: -moz-linear-gradient(45deg, #ededed 0%, #ededed 2%, #a6c4cf 43%, #6D91A1 83%, #6D91A1 100%);
  background-image: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #ededed), color-stop(2%, #ededed), color-stop(43%, #a6c4cf), color-stop(83%, #6D91A1), color-stop(100%, #6D91A1));
  background-image: -webkit-linear-gradient(45deg, #ededed 0%, #ededed 2%, #a6c4cf 43%, #6D91A1 83%, #6D91A1 100%);
  background-image: -o-linear-gradient(45deg, #ededed 0%, #ededed 2%, #a6c4cf 43%, #6D91A1 83%, #6D91A1 100%);
  background-image: -ms-linear-gradient(45deg, #ededed 0%, #ededed 2%, #a6c4cf 43%, #6D91A1 83%, #6D91A1 100%);
  background-image: linear-gradient(45deg, #ededed 0%, #ededed 2%, #a6c4cf 43%, #6D91A1 83%, #6D91A1 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6D91A1', endColorstr='#ededed',GradientType=1 );
}

.layout-anon .region-topbar.transparent-landing{
    background-color: transparent;
    padding: 30px 0;
  border-bottom: 0px solid #D7D7D7!important;
  box-shadow: none!important;
  z-index: 99!important;

}
.layout-anon .region-topbar.transparent-landing .gloab-btn {
  margin: 0 10px;
  border: none;
  background-color: transparent;
  font-size: 24px;
  color: white;
}
.layout-anon .region-topbar.transparent-landing .logout-btn{
    background-color: white;
    border-radius: none;
    font-size: 1.257em;
    font-weight: bold;
    color: #5a787a;
    text-align: center;
    padding: 0px;
    width: 127px;
    height: 42px;
    border-radius: 3.2px;
    margin-bottom: 0;
    font-family: 'Montserrat';
}
.layout-anon .form-control{
    /*font-size: 1.571em;*/
    font-family: 'Montserrat';
}
.layout-anon .mx-fileinput .mx-wrapped-label{
    width: calc(100% - 122px);
}
.layout-anon .mx-fileinput .mx-wrapped-input{
    width: 140px;
}
.layout-anon .mx-fileinput .mx-wrapped-form .btn.mx-button.mx-fileinput-upload-button{
    border-radius: 4px;
    color: white;
    background-color: #303942;
    /*font-size: 1.271em;*/
    min-width: 100px;
}
.layout-anon
.progressbar-content{
  border: 1px solid #ccc;
  padding: 5px;
}
.progressbar-content .p-text{
      font-weight: bold;
      color: #303942;
  }
  .progressbar-content .sub-text{
    color: #303942;
  }
.profile-information{
  /* padding-top:200px!important; */
  height: 100%;
  width: 100%;
  min-height: 662px;
}

.pf-headding{
  font-size: 4.714em;
  font-family: 'Montserrat';
  color: white;
  font-weight: 700;
}
.sub-headding{
  font-weight: bold;
  font-size: 1.571em;
  color: #495663;
  font-family: 'Montserrat';
}
.pre-headding{
  font-weight: bold;
  color: #495663;
}
.verf-text{
  color: #fff;
  margin: 10px 0;
}
.next-button{
  min-width: 100px;
  min-height: 37px!important;
  border-radius: 4px!important;
  color: white;
  background-color: #303942;
  border: none;
  width: 100%!important;
  font-family: 'Montserrat';
  font-size: 1.2em !important;
}
.cell-save-second-wizard .next-button{
  min-height: 50px !important;
}
.back-button{ 
  min-width: 100px;
  height: 50px!important;
  border-radius: 4px!important;
  color: white;
  background-color: #9b9b9b;
  border: none;
  width: 100%!important;
  font-family: 'Montserrat';
  font-size: 1.2em !important;
}

.states-list{
border: 1px solid #ccc;
background-color: #fff;
}
.states-list .selected-state{
  padding: 10px;
  border: 1px solid #ccc;
}
.states-list .list-section{
  height: 200px;
  overflow: hidden;
  padding: 5px;
}
.states-list .button-section{
  box-shadow: 0 -1px 1px 1px rgb(230, 230, 230);
  padding: 10px 0;
}
.states-list .select-btn{
  border: 0px solid white;
  color: #ccc;
 }
.dates-btn{
   width: 140px;
   border-radius: 30px;
   background-color: #495663;
   color: white;
   font-family: 'Montserrat';
}

 /** Tab **/
 .Personal-information .tab-personal-info .widget-progress-bar .progress-bar-success{
  background-color: #50e3c2;
}
.Personal-information .wizard-steps li{
  border: 0px solid!important;
  z-index: 9;
}
/* .Personal-information .wizard-step.visited .wizard-step-description::after, .wizard-step.active .wizard-step-description::after{
content: "";
border: solid transparent;
} */


/* .Personal-information .mx-name-datePicker3 button{
  padding: 1.4em 1em;
    } */
 @media (max-width:767px){
  .layout-anon .form-control{
    font-size: 1em;
}
  .profile-information{
    padding-top: 95px!important;
  }
  .Personal-information{
    height: 100%;
    min-height: 400px;
    padding-top: 100px!important;
  }
  .pf-headding{
    font-size: 2rem!important;
  }
  /* .Personal-information .form-control{
    height: auto;
  } */
  /* .Personal-information .mx-name-datePicker3 button{
    padding: 0.6em 1em;
  } */
  .Personal-information .wizard-steps{
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .Personal-information .wizard-steps li{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 31%;
  }
  .Personal-information .wizard-step-title{
    font-size: 13px;
  }
  .Personal-information .wizard-steps:before{
    top: 23px;
    width: 60%;
  }
}

/***  Personal information end  ***/

/** Login Start **/
.Personal-information.login-top{
  /*padding-top:155px!important;*/
}
.login-card {
  margin: 20px 0;
  padding: 10px;
}
.login-card  img{
  width: 150px;
}
.login-card .login-headding{
        font-size: 2.000em;
        color: #495663;
        text-align: center;
    }
    .login-card .form-control{
      height: auto !important;
  }
    .login-card   .lg-sub-headding{
        font-size: 1.286em;
        color: #495663;
        text-align: center;
        /* margin: 20px 0; */
    }

    .login-card  .form-control{
      max-width: 250px;
      margin: auto;
  }

  .login-card .forget-pwd{
    margin-top: 10px;
    text-align: center;
}

.login-card .submit{
  background-color: #303942;
  color: white;
  /* START Ganesh 2083728 - Login Button in Arabic is not visible fully */
  width: auto;
  /* END Ganesh 2083728 - Login Button in Arabic is not visible fully */
  font-family: 'Montserrat';
}

@media (max-width:767px){
  .login-card .login-headding{
      font-size: 2rem;
      color: #495663;
      margin-bottom: 0;
  }
  .login-card .lg-sub-headding{
      font-size: 1.3rem;
  }
  .login-card img{
      width: 115px;
  }
  .Personal-information.login-top{
    padding-top: 80px!important;
  }
}





/** Login End **/


/***  Search card  start ***/

.search-card{
  color: #303942;
  box-shadow: 0 0 8px 0px #ccc;
  /*height: 100%;*/
  padding: 7px;
}
.search-card .search-card-status{
  display: flex;
  flex-wrap: wrap;
}
.status-btn{
  /*font-size: 10px!important;*/
  border-radius: 30px;
  color: #303942;
  margin: 2px !important;
  min-width: 95px;
}

/***  Search card  end ***/


/***  state card  start ***/

/* .search-card-list{
      border: 1px solid #fff;
} */



@media (min-width: 992px){
  .dashboard-edit-filter{
    display: flex;
    height: 100%;
  }

}

.driver-dashbord  .mx-layoutgrid{
      padding: 0 10px!important;
}

.driver-dashbord  h6{
    font-weight: bold;
    margin: 10px 0;
    color: #303942;
}
.driver-dashbord .table-headding{
  font-weight: bold;
  color: grey;
  /* margin-left: 10px; */
}



/***  state card  end ***/


/****  NEW MOCKUPS DESIGN START  ****/


/**  My profile start  **/
.my-profile-page{
     margin: 20px 0;
}
  .my-profile-page .mx-tabcontainer .mx-tabcontainer-tabs{
    display: flex;
    flex-wrap: wrap;
  }
  .my-profile-page .nav>li>a{
    padding: 5px;
    font-size: 13px;
    /* word-break: break-all; */
}
 .driver-dashbord .mx-scrollcontainer-wrapper{
 height: 100%!important;
 overflow-x: hidden!important;
 overflow: hidden!important;
}
.form-horizontal.widget-switch-label .form-group .widget-switch, .form-horizontal.widget-switch-label {
  float: none!important;
  display: flex;
}
.congueatulation-icon{
  width: 19px;
  /* height: 20%; */
  float: right;
}
/* Starts Sandra for bug 2107274 */
.almost-there-box{
  padding: 15px 20px;
}
.cell-submit-button{
	vertical-align: middle;
	text-align: center;
	padding: 23px 53px;
}
@media (max-width:767px){
	.cell-submit-button{
		text-align: center;
		padding-bottom: 23px;
	}
}
.congratulations-green-check-icon{
  width: 150px;
  /* width:164%; */
  /* height:164%; */
  padding-top:20px;
}
@media (max-width:767px){
	.congratulations-green-check-icon{
		width:20%;
		height:20%;
		padding-top:0px;
    padding-bottom: 10px;
    margin: auto;
  }
  .congratulations-title,.congratulations-text{
    text-align: center;
  }
}
.congratulations-outer-box{
  background-color:#eaedf2;
  border: solid 0.5px #979797;
  padding-left: 20px;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 0px;
}
.application-submmited-outer-box{
  background-color:#eaedf2;
  border: solid 0.5px #979797;
  padding-left: 20px;
  padding-top: 10px;
  padding-right: 10px;
  padding-bottom: 10px;
}
.congratulations-title {
  font-size: 21.6px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  letter-spacing: normal;
  color: #495663;
}
.congratulations-text{
  font-size: 21.6px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  letter-spacing: normal;
  color: #495663;
}
.congratulations-submit{
  border-radius: 2.9px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: normal;
  letter-spacing: normal;
  text-align: center;
  color: #ffffff;
  background-color: #303942;
  border-color: transparent;
  padding: 16.4px 72px;
}
@media (max-width:320px){
	.congratulations-submit{
	  border-radius: 2.9px;
	  font-weight: bold;
	  font-style: normal;
	  font-stretch: normal;
	  line-height: normal;
	  letter-spacing: normal;
	  text-align: center;
	  color: #ffffff;
	  background-color: #303942;
	  border-color: transparent;
	  padding: 16.4px 52px;
	}
}
/* Ends Sandra for bug 2107274 */
.my-profile-page  .total-card{
  color: #ffffff;
  border:5px solid white;
  /*min-height: 196px;*/
}
.total-card p{
  font-size: 20px;
  line-height: 1.6;
  margin:7px 0 0;
}
.my-profile-page  .total-card .total-amount{
  /* margin-left: 10px; */
  font-size: 300%;
  display: flex;
  justify-content: flex-end;
}
@media (max-width: 767px){
  .total-amount{
    display: flex;
  }
  .my-profile-page .total-card{
    min-height: 145px;
    width: 100%!important;
  }

}
/**  My profile end  **/


/** List card data start **/
@media (max-width:767px){
  .driver-dashbord .list-set .list-card{
  border: 1px solid #ccc;
  box-shadow: 0 2px 3px -1px #ccc;
  margin: 5px 0;
  padding: 5px 15px!important;
   }

 .list-set ul{
    text-align: left;
   }
   .list-card  .tittle-data{
     font-weight: bold;
     margin: 0 10px 0 0;
   }
   .list-set li{
    border: 1px solid white!important;
    padding: 0!important;
    text-align: left;
}
.list-set .mx-layoutgrid{
    padding: 5px!important;
}
}
@media (min-width: 768px){
  /* .role-operation  .list-set .mx-text{
    white-space: nowrap;
  } */
}
.list-set .mx-templategrid-item{
  border: 0px solid!important;
  padding: 0;
}

.list-set .next-button{
  white-space: normal;
  font-size: 1em;
  padding: 5px!important;
  width: 90%!important;
  min-width: auto!important;
  height: auto!important;
  min-height: 50px;
}
.list-set ul li{
  padding-left: 0!important;
  padding-right: 0!important;
}
/** List card data end **/


    /** hidden text box start **/
    .hidden-text{
      position: relative;
    }
    .hidden-text  input{
          visibility: hidden;
          position: absolute;
      }
      .hidden-text   .alert{
         /*position: absolute;*/
        /*top: -10px; */
        padding: 10px;
        margin: 5px 0;
         /*right: 0;*/
        /*width: 90px;*/
        /*z-index: 1; */
      }
      /** hidden text box end *


      /** graph charts alignment start  **/
      .charts-alignment {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
    }
      /** graph charts alignment start  **/

     /** Date Wizard start  **/
     .date-wizard{
      display: flex;
      justify-content: center;
    }
/** Date Wizard end  **/



    /** circle bullets start **/
    .circle-list.radium-green::before{
      content: "";
      width: 10px;
      height: 10px;
      border: 1px solid #8bc14a;
      border-radius: 50%;
      background-color: #8bc14a;
      position: absolute;
      /*top: 5px;*/
      margin: 3px -16px;
  }
  .circle-list.dark-grey::before{
      content: "";
      width: 10px;
      height: 10px;
      border: 1px solid  #01bbd4;
      border-radius: 50%;
      background-color:  #01bbd4;
      position: absolute;
      /*top: 5px;*/
      margin: 3px -16px;
  }
  .circle-list.light-grey::before{
      content: "";
      width: 10px;
      height: 10px;
      border: 1px solid  #8a96a0;
      border-radius: 50%;
      background-color:  #8a96a0;
      position: absolute;
      /*top: 5px;*/
      margin: 3px -16px;
  }
  .circle-list.red::before{
      content: "";
      width: 10px;
      height: 10px;
      border: 1px solid   #303942;
      border-radius: 50%;
      background-color:   #303942;
      position: absolute;
      /*top: 5px;*/
      margin: 3px -16px;
  }
 /** circle bullets end **/

/***  IE Styles ***/
@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .sidemenu-dashbord .mx-navigationtree .navbar-inner > ul > li a{
        display: block!important;
        width: 100% !important;
    }
    .mx-navigationtree .navbar-inner > ul > li > a .glyphicon{
        width: 100% !important;
    }
    .mx-navigationtree .navbar-inner > ul > li > a{
        min-height: 60px;
        height: auto!important;
    }
    select.form-control{
      padding-right: 10px;
  }
  /* .city-name {
    top:-38px!important;
 } */
.icon-wizard a.wizard-step:before{
  left:50%;
 }
  [dir="rtl"] .icon-wizard a.wizard-step:before{
    right:50%;
  }
  select.form-control::-ms-expand {
    border: none!important;
   background: transparent;
   }
   input[type=checkbox]::-ms-check {
    margin-right: 10px;
    display: inline-block;
    vertical-align: text-top;
    width: 16px;
    height: 16px;
    background: white;
    border: 1px solid #ccd1d9;
    box-shadow: 0 0 2px 0px #ccc;
    border-radius: 3px;
    padding: 2px;
    color: #69c1cd;
  
  }
  .checkbox-BD input[type=checkbox]{
    margin: 0px 0px 0 0!important;
  }

  input[type=checkbox]::-ms-clear {
    display: none;
}

.home-fields select.form-control{
  text-indent: 40% ;
}

/** Added by Sushuma*/
body[dir="rtl"] .region-topbar.menubar-landing .logout-btn{
  margin-left:5px!important;
}
}

.btn[disabled]{
  color: #ccc!important;
}

@media screen and (min-width: 768px) and (max-width:959px)  {
  .payment-vertical-chart{
    width: 380px!important;
    height: 260px!important;
  }
}
@media (min-width:960px){
  .payment-vertical-chart{
    width: 600px!important;
    height: 260px!important;
  }
}

@media (min-width:768px){
  .vertical-chart{
    width: 350px!important;
    height: 250px!important;
  }
  .flex-style-desktop{
    display: flex;
  }
  .payments-donutchart{
    height: 300px;
    width: 200px;
}
}

@media (max-width:767px){
  .flex-style-mobile{
    display: flex;
  }
}


.payment-charts{
  display: flex;
  flex-wrap: wrap;
}
.payment-charts  .payments-donutchart{
  display: flex;
  justify-content: center;
  align-items: center;
}

/* ==========================================================================
   NourA/ class for the put red star for the required field.
========================================================================== */
.requiredFieldLabel label:after { content:" *";color:red; }

/* Sandra*/
.custom-widget-progress{
  height:16px!important;
  margin-bottom: 20px!important;
}

/**========================Sushuma======================*/
/*Desktop*/

/***------------------Calender start---------------------*/
.city-name .form-control{
  padding-right: 30px;
  }
.dijitCalendarContainer .dijitCalendarArrow {
  font-size: 14px!important;
}

.dijitCalendarContainer tr td .dijitCalendarDateLabel {
  font-size: 14px;
}

.dijitCalendarContainer tr .dijitCalendarNextMonth span,
.dijitCalendarContainer tr .dijitCalendarPreviousMonth span {
  color: #777777;
}

.dijitCalendarContainer .dijitCalendarHoveredDate {
  border-radius: 0px;
  background-color: #eeeeee;
  color:#000000;
}

.dijitCalendarContainer .dijitCalendarSelectedDate, .dijitCalendarContainer .dijitCalendarSelectedDate:hover {
    color: #fff!important;
    background-color: #286090!important;
    border-color: #204d74!important;
    border-radius: 0px!important;
}

.dijitCalendarContainer .dijitCalendarYearContainer span.dijitCalendarSelectedYear {
  color: #555555!important;
  font-weight:bold!important;
  font-size:14px!important;
}

.dijitInline .dijitCalendarPreviousYear{
  color: #555555!important;
  font-size:14px!important;
}

.dijitCalendarContainer .dijitCalendarYearContainer span {
  color: #555555!important;
  font-size:14px!important;
}

.dijitCalendarContainer .dijitCalendarMonthLabel {
  color: #555555!important;
  font-size: 14px!important;
  font-weight:bold!important;
  font-family: 'Lato', sans-serif!important;

}

.dijitCalendarContainer tr th {
  color: #555555!important;
  font-weight: bold!important;
  font-size: 14px!important;
  font-family: 'Lato', sans-serif!important;
}

td .dijitCalendarContainer .dijitCalendarCurrentMonth .dijitCalendarDateTemplate{
  font-size: 14px!important;
  font-weight:normal;
  font-family: 'Lato', sans-serif!important;
}
/***------------------Calender end---------------------*/
body[dir="rtl"] .phone-verification-code-fields{
  direction:ltr;
}
.edit-route .form-group{
  font-size:0.9em;
}
.routes-min-max .form-control[disabled]{
  cursor: pointer!important;
}
.opeartion-routes-template .min-max-route:hover{
  cursor: default;
}

.opeartion-routes-template .mx-templategrid-content-wrapper .mx-templategrid-item.selected{
  padding: 0!important;
  background-color: transparent!important;
}
 
.opeartion-routes-template .mx-templategrid-content-wrapper .mx-templategrid-item.selected    .list-set {
  background-color: #f3f3f3 !important;
  padding: 15px 15px 15px 15px!important;
}

.opeartion-routes-template .mx-templategrid-row:first-child  .operation-routes {
  font-weight:bold;
  display:block!important;
  margin-bottom:10px;
  /* border-bottom:1px solid #ddd; */
  /*padding: 15px;*/
  padding-bottom: 15px !important;
}
.opeartion-routes-template .mx-templategrid-row .mx-templategrid-item{
  border:none;
  border-bottom:1px solid #ddd!important;
}
.operation-routes{
 display:none;

}
.routes-min-max input[type=text] {
  background: transparent!important;
  border: none!important;
  font-size: 14px!important;
  margin-top: -15px!important;
}

.hide-list-empty .mx-list .mx-listview-empty{
  display:none;
}

.manage-jobs-admin{
  margin-top:35px;
  margin-left:3px;
  margin-bottom:35px;
}

.jobRangeSlider .rs-container, .manage-jobs-admin .rs-container{
  width:80%!important;
  margin:auto;
 display: flex;
}
.jobsFilterToggle{
  display:none;
}

.jobRangeSlider .rs-container .ins-strstp-tex, .manage-jobs-admin .rs-container .ins-strstp-tex{
  display:block!important;
}

.progressbar-content .custom-widget-progress .progress{
  height:16px!important;
  margin-bottom:10px!important;
}

.gloab-btn img{ 
  width:36px;
  height:36px;
  filter: drop-shadow(0px 2px 2px #000);
}

.region-topbar.menubar-landing .menu-list .btn-link:focus, .btn-link:hover  {
  text-decoration: none;
}



.home-fields .form-control{
  /*line-height: 2!important;*/
  font-size:1.571em!important;
  color:#3e4c5b!important;
  font-family: 'Montserrat';
  font-weight: 700;
  border: none;
}

.home-fields .control-label{
  color:#9aa8b6;
  font-family: 'Montserrat';
  font-size: 1em;
  font-weight: bold;
  text-align: center;
  width: 100%;
  margin-bottom: 0;
}

/* .home-fields .control-label:after{
  font-family: 'Glyphicons Halflings';
  content: "\e252";
  font-size: 10px;
  padding: 2px 8px;
  color: #dfe4e8;
} */

.home-fields select.form-control{
  -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
  /* background-image: none; */
  background-position: calc(100% - 10px) center;
  -moz-appearance: none;
  -webkit-appearance: none;
  text-align: center !important;
  /* text-align-last: center; */
  padding-right: 30px;
}
.home-fields select::-ms-expand {
    display: none;
    text-align: center;
}
.home-fields select, option {
    text-align: center;
}

.text-align-left-text{
  display: block;
  text-align: left!important;
}
.job-dashboard .input-group-addon{
  border:none;
  background:transparent;
}

.job-dashboard .input-daterange{
  border-radius: 2px;
  border: 1px solid #c6cbd4!important;
}
.job-dashboard .input-daterange .form-control{
  border:none;
}
.job-dashboard > div > div > .input-sm:first-child
{
	font-size: 15px;
	width: 100% !important;
}

.job-dashboard > div > div > .input-sm
{
	font-size: 15px;
	width: 70% !important;
}


.job-dashboard .input-daterange:last-child::after{
  /*content:url(../../images/calendarEmpty.png);*/
  content: "";
    background-image: url(../../images/calendarEmpty.png);
    background-repeat: no-repeat;
    display: inherit;
    width: 30px;
    height: 30px;
    background-size: 30px 30px;
    top: 7px;
    position: relative;
}
.entry:last-child {
  border-bottom: none;
}

.custom-dropdown .mx-referenceselector-input-wrapper select {
  /* padding-right: 30px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='15px' height='8px'><polyline id='Line' fill='%23ffffff' stroke='%23ffffff' points='0.5 0.5 6 6 11.545361 0.5'></polyline></svg>")!important;
  background-repeat: no-repeat;
  background-position: calc(100% - 10px) center;
  -moz-appearance: none;
  -webkit-appearance: none; */
  /* background-color: #303942; */
  background-color: #43474b;
  color: #fff;
}
/**Mobile*/
@media (max-width:767px){
  body[dir="rtl"] .jobsFilterToggle .sub-headding{
  float:right!important;
  }

  body[dir="rtl"] .jobsFilterToggle .job-filter-btn{
    float:left!important;
  }
  body[dir="rtl"] .jobsFilterToggle .job-filter-cls-btn{
    float:left!important;
  }
  .jobsFilterToggle .job-filter-cls-btn{
    float:right;
    border:none;
    background-color: #f5f5f5;
    color: #969696;
  }
  .jobsFilterToggle .job-filter-btn{
    float:right;
    border:none;
  }

  .dashboard-desktop{
    display: none;
  }
  .jobRangeSlider .rs-container, .manage-jobs-admin .rs-container{
    width:80%!important;
    margin:auto;
  }

  .jobsFilterToggle{
    display:block;
  }

  .landing-page .already-text{
      font-size: 15.3px !important;
  }

 .landing-page .link-text-ar{
    font-family: 'Montserrat';
  }

.home-fields .form-control{
    font-size:.93m!important;
    text-align: center;
}
.home-fields .control-label{
     text-align: center;
 font-weight: bold!important;
}

.gloab-btn img{
  width:18px!important;
  height:18px!important;
}

/* Ends Sandra's fix for 2080851 */
.region-topbar.menubar-landing .logout-btn {
  font-size: 14px;
  width: 90px;
  height: 25px;
}
/* ends fix for 2080851*/


}
/**---------------*/
.abs-social{
    position: relative;
}

.abs-social .social-vert{
    position: absolute;
    top: 0;
    left: -15%;
}

.abs-social .social-vert .facebook,
.abs-social .social-vert .twitter,
.abs-social .social-vert .rss{
    margin-bottom: 28px;
}

.mx-layoutgrid.mx-layoutgrid-fluid.no-gutter .row div[class*="col-"]{
    padding-left: 0;
    padding-right: 0;
}
.mx-layoutgrid.mx-layoutgrid-fluid.no-gutter .row div[class*="col-"]:first-child{
    padding-left: 15px;
}
.mx-layoutgrid.mx-layoutgrid-fluid.no-gutter .row div[class*="col-"]:last-child{
    padding-right: 15px;
}

.icon-wizard .wizard-step .wizard-step-number{
    font-family: 'Lato', sans-serif;
    font-weight: 400;
    font-size:  2.171em;
}
.icon-wizard .wizard-step-title,.icon-wizard .tick-text{
    display: none;
}
.icon-wizard a.wizard-step{
    position: relative;
}
.icon-wizard a.wizard-step:before{
    content: "";
    border-bottom: 11px dotted #d8d8d8;
    z-index: -1;
  position: absolute;
  width: 94%;
  top: 36px;
  margin: 0 -2px;
  /* left: 42%; */
}
body[dir="rtl"] .icon-wizard a.wizard-step:before{
    /* left: 0;
    right: 0; */
}
.icon-wizard li:last-child a.wizard-step:before{
 content: none;
}

.icon-wizard a.wizard-step.visited:before{
    content: "";
    border-bottom: 11px solid #495663;
    width: 100%;
}
.icon-wizard a.wizard-step.visited:after{
    content: "";
    background-image: url(../../images/completed-check.png);
        background-size: 45px auto;
    width: 60px;
    height: 60px;
    z-index: +1;
    position: absolute;
    top: 0;
    background-repeat: no-repeat;
        top: 17px;
    right: 0;
    left: 14px;
    margin-left: auto;
    margin-right: auto;
}
/* .icon-wizard  li:nth-child(1) a.wizard-step.active:after{
    content: "";
    background-image: url(../../images/profile-icon.png);
        background-size: 45px auto;
    width: 60px;
    height: 60px;
    z-index: +1;
    position: absolute;
    top: 0;
    background-repeat: no-repeat;
        top: 17px;
    right: 0;
    left: 14px;
    margin-left: auto;
    margin-right: auto;
}
.icon-wizard  li:nth-child(2) a.wizard-step.active:after{
    content: "";
    background-image: url(../../images/location-icon.png);
        background-size: 45px auto;
    width: 60px;
    height: 60px;
    z-index: +1;
    position: absolute;
    top: 0;
    background-repeat: no-repeat;
        top: 17px;
    right: 0;
    left: 14px;
    margin-left: auto;
    margin-right: auto;
}
.icon-wizard  li:nth-child(3) a.wizard-step.active:after{
    content: "";
    background-image: url(../../images/time-icon.png);
        background-size: 45px auto;
    width: 60px;
    height: 60px;
    z-index: +1;
    position: absolute;
    top: 0;
    background-repeat: no-repeat;
        top: 17px;
    right: 0;
    left: 14px;
    margin-left: auto;
    margin-right: auto;
} */
.Personal-information{
    margin-top: 100px;
    min-height: 520px;
}


 @media (max-width: 767px) {
     .Personal-information {
         margin-top: 0;
         padding-top: 0!important;
     }
     .Personal-information .icon-wizard .wizard-steps {
         display: flex;
         align-items: center;
         justify-content: space-evenly;
     }
     .Personal-information .icon-wizard .wizard-steps li {
         display: flex;
         align-items: center;
         justify-content: center;
         width: 31%;
     }
     .Personal-information .icon-wizard .wizard-step .wizard-step-number {
         width: 70px!important;
         height: 70px!important;
         line-height: 65px;
     }
     .Personal-information .icon-wizard .wizard-steps li:first-child {
         justify-content: flex-start;
     }
     .Personal-information .icon-wizard .wizard-steps li:last-child {
         justify-content: flex-end;
     }
     .Personal-information .icon-wizard .wizard-step-title {
         display: none;
     }
     .Personal-information .icon-wizard .wizard-steps:before {
         content: none;
     }
     .icon-wizard li:nth-child(1) a.wizard-step.active:after {
         width: 40px;
         height: 40px;
         top: 11px;
         left: -4px;
     }
     .icon-wizard a.wizard-step:before {
         width: 250%;
         top: 32px; 
          left: 0;
     }
     body[dir="rtl"] .icon-wizard a.wizard-step:before {
         width: 250%;
         top: 32px;
        right: 95%;
         left: auto;
     }
     .icon-wizard a.wizard-step.visited:before {
         width: 350%; 
         left: 98%;
     }
 }
 @media (max-width: 632px) {
    .icon-wizard a.wizard-step.visited:before {
         width: 262%;
     }
}
@media (max-width: 528px) {
     .icon-wizard a.wizard-step:before {
         width: 120%;
         top: 32px;
         left: 100%;
     }
     .icon-wizard a.wizard-step.visited:before {
         width: 182%;
     }
    /* body[dir="rtl"]  .icon-wizard a.wizard-step:before {
         right: 0;
         left: auto;
     } */
 } 

.icon-wizard-areas li:first-child a.wizard-step:before{
  content: none;
 }

 .icon-wizard-areas li:last-child a.wizard-step:before{
  content: "";
  border-bottom: 11px dotted #d8d8d8;
  z-index: -1;
  position: absolute;
  width: 94%;
  top: 36px;
  right: 42%;
}
.icon-wizard-dates a.wizard-step:before{
  content: "";
  border-bottom: 11px solid #495663;;
  z-index: -1;
  position: absolute;
  width: 96%;
  top: 36px;
  right: 42%;
}

.icon-wizard-dates li:first-child a.wizard-step:before{
  content: none;
 }





.mx-layoutgrid.mx-layoutgrid-fluid.form-grid .row div[class*="col-"]{
    padding-left: 15px;
    padding-right: 15px;
}
.mx-layoutgrid.mx-layoutgrid-fluid.form-grid .row .col-xs-12,
.mx-layoutgrid.mx-layoutgrid-fluid.form-grid .row .col-sm-12,
.mx-layoutgrid.mx-layoutgrid-fluid.form-grid .row .col-md-12{
    padding-left: 15px;
    padding-right: 15px;
}
/* .mx-layoutgrid.mx-layoutgrid-fluid.form-grid .row div[class*="col-"]:first-child{
    padding-left: 15px;
} */
/* .mx-layoutgrid.mx-layoutgrid-fluid.form-grid .row div[class*="col-"]:first-child
.mx-layoutgrid.mx-layoutgrid-fluid .row div[class*="col-"]:first-child{
    padding-left: 0;
} */
/* .mx-layoutgrid.mx-layoutgrid-fluid.form-grid .row div[class*="col-"]:last-child{
    padding-right: 15px;
} */
/* .mx-layoutgrid.mx-layoutgrid-fluid.form-grid .row div[class*="col-"]:last-child
.mx-layoutgrid.mx-layoutgrid-fluid .row div[class*="col-"]:last-child{
    padding-right: 0;
} */
 @media (max-width: 767px) {
  .mx-layoutgrid.mx-layoutgrid-fluid.form-grid .row div[class*="col-"]{
    padding-left: 7px!important;
    padding-right: 7px!important;
}

}


.country-name .form-control{
  background-color: white;
  border-radius: 0;
}

.area-search{
  position: relative;
  text-align: center;
}
body[dir="ltr"] .area-search .search-input{
  position: relative;
  /*width: 50%;*/
  right: 0;
  /*top: -49px;*/
  height: 49px;
  /**Added on 20190228 for Remediation Phase1 Sprint for Bug: 2230086**/
	padding: 0px;
  /**Added on 20190228 for Remediation Phase1 Sprint for Bug: 2230086**/
  padding-left: 15px;
  margin-bottom: 15px;
}

.area-search .search-input.new{
  width: 100%;
  top: 0 !important;
  /*right: 10px;*/
}

body[dir="rtl"] .area-search .search-input.new{
  right: auto;
  /*left: 10px;*/
  width: 100%;
}
body[dir="ltr"] .area-search .search-input::placeholder{
  margin-top: 10px;
}

body[dir="rtl"] .area-search .search-input{
  position: relative;
  /*width: 50%;*/
  /*top: -49px;*/
	right: auto;
  height: 49px;
  left: 0;
}

@media (max-width: 768px){
	body[dir="ltr"] .area-search .search-input{
	  position: relative;
		width: 100%;
	  right: 0;
		top: 0px;
		height: 49px;
  }
  .area-search select.form-control{
    margin-bottom: 15px;
  }
}
@media (max-width: 768px){
	body[dir="rtl"] .area-search .search-input{
	  position: relative;
		width: 100%;
		top: 0px;
		 right: auto;
		height: 49px;
    padding-right: 15px;
	}

}
.area-search .city-name{
    width: 100%;
    padding: 0;
    top: 0;
    height: 49px;
    display: inline-grid;
    position: relative;
}
.area-search .city-name .mx-referenceselector-input-wrapper{
    padding-left: 50px;
    background-image: url(../../images/location-white.png);
    background-size: 48px 50px;
    border: 1px solid #ccc;
}

.search-data {
  /*width: 50%;
  float: left;*/
}
.area-search.right .search-input{
  position: absolute;
    width: 50%;
    right: auto;
    left: 0;
    top: 0;
        height: 49px;

}
.area-search.right .city-name{
    width: 50%;
    top: -49px;
    height: 49px;
    float: right;

}
.city-name  .form-control{
  border-radius: 0;
  border:none;
  height:100% !important;
}
@media (max-width: 767px){
  .SearchForArea {
    width: 100% !important; 
  }
  .area-search .city-name {
    width: 100%;
    /*margin-bottom: 49px;*/
  }
    .area-search .search-input{
     width: 100%;
    }
}
.footer-table{
    margin-top: 60px;


}
.footer-table table.mx-table > tbody > tr > td a{
    margin-top: 0;
    margin-bottom: 14px;
}
/*.Personal-information .wizard-steps:before{
  content: "";
  border: 2px solid;
  z-index: 1;
  position: absolute;
  width: 65%;
  top: 36px;
  margin: auto;
  left: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;

}*/

.main-menu > .mx-dataview-content {
  padding-left: 25%;
}

@media only screen and (max-width: 767px) {

  .section-middle-en {
    background: url("../../images/img-how_mobile_en.png");
    background-repeat: no-repeat;
    background-size: contain;
    height: 0px;
    padding-top: 234%;
  }
  .section-middle-ar {
    background: url("../../images/img-how-mobile_ar.png");
    background-repeat: no-repeat;
    background-size: contain;
    height: 0px;
    padding-top: 234%
  }
}

@media only screen and (max-width: 767px) {

  .copyright-text {
    display: none;
  }

  .logo-text {
    text-align: center;
  }

}


.removeposition{
	position:unset !important;

}
.widget-pagination .pagination
{
	height: 50px;
    border: 1px solid #ccc;
display: flex!important;
}


/** START Ganesh Added to prevent BUG:2059045**/
.browse-button
.mx-fileinput .mx-wrapped-input {
  position: absolute !important;
  opacity: 0 !important;
  top:0;
  font-size: 0!important;
  right: 0;
}
.browse-button
input[type=file] {
  display: block !important;
  height: 48px !important;
  /*width: 108px !important;*/
}
.browse-button
.mx-wrapped-form > .mx-wrapped-input {
  margin-top: -28px;
  z-index: 100;
}


.browse-button-direction .mx-fileinput{
  direction: rtl;
}
/** END Ganesh Added to prevent BUG:2059045**/


/** START Ganesh - Modal popup window Yes No Buttons do not have same height*/
.modal-footer .btn+.btn {

	height: 48px;

}
/** END Ganesh - Modal popup window Yes No Buttons do not have same height*/


.btn-status-clicked {
  background-color: #495663 !important;
  color: #fff !important;
  line-height: 0 !important;
  font-size: 14px !important;
  width: 95px !important;
  height: 31.8px !important;
}

/** side menu change to bottom of the screen in dashboard start **/
@media (min-width:768px){
  .sidemenu-mobile-dashbord{
    display: none;
  }
}
@media (max-width:767px){
.sidemenu-mobile-dashbord{
  position: fixed;
  bottom: 0;
  min-height: 85px;
  width: 100%;
  height: auto!important;
  border-top: 1px solid #eae9e9;
 z-index: 9999;
}

 .sidemenu-mobile-dashbord .mx-navigationtree .navbar-inner > ul{
  display: flex;
  width: 100%;
  top:0!important;
 }
 .sidemenu-mobile-dashbord .mx-navigationtree .navbar-inner > ul > li{
  width: 25%;
  flex: auto;
 }
 .sidemenu-mobile-dashbord .mx-navigationtree .navbar-inner > ul > li a.active{
  color: #36404e;
  border-right: 0px solid #36404e!important;
  border-top: 2px solid #36404e!important;

 }
 body[dir="rtl"] .sidemenu-mobile-dashbord .mx-navigationtree .navbar-inner > ul > li a.active{
  color: #36404e;
  border-right: 0px solid #36404e!important;
  border-left: 0px solid #36404e!important;
  border-top: 2px solid #36404e!important;
 }
 .footer-section.pb-xs-100{
  padding-bottom: 100px;
 }
}
 /** side menu change to bottom of the screen in dashboard end **/

 /** pagination buttons style start **/
 @media (max-width:767px){
  .pagination-styles button{
    padding:10px;
  }

 }


 .driver-dashboard .mx-name-customListViewWithSearch1 {
   position: absolute;
   top: 50px;
   width: 100%;
 }

 .driver-dashboard ul li {
   width: 100%;
 }


 .driver-dashboard .mx-name-referenceSelector1 {
   width: 100%;
 }

 .driver-dashboard .search-input {
   width: 100% !important;
 }
 .widget-switch.auto .widget-switch-btn-wrapper .widget-switch-btn{
  width: 25px!important;
  height: 25px!important;
  top: 0!important;
 }
 .widget-switch.auto .widget-switch-btn-wrapper{
  width: 45px!important;
  height: 25px!important;
 }
 .mx-scrollcontainer-toggleable .mx-scrollcontainer-wrapper{
  min-height: 500px;
 }

 .hidding-first-op select.form-control option:first-child{
   display: none!important;
 }

 /** Bank details styles start **/

 .input-feild-BD .col-sm-9, .input-feild-BD label{
  width: 100%;
  text-align: left!important;
}
.input-feild-BD.arbic .col-sm-9, [dir="rtl"] .input-feild-BD .control-label, .input-feild-BD .arbic .control-label{
  width: 100%;
  text-align: right!important;
  direction: rtl;
}
.checkbox-BD label{
  display: flex;
  text-align: left!important;
}
[dir="rtl"] .checkbox-BD label{
  direction: rtl;
}
.checkbox-BD input[type=checkbox]{
   margin: 0px 20px 0 0;
   outline: 0;
}
[dir="rtl"] .checkbox-BD input[type=checkbox]{
  margin: 0px 0px 0 20px;
}
.checkbox-BD input[type=checkbox]:checked:after {
  background: #ffff;
  border: solid #bfbfbf;
  border-width: 0 3px 3px 0;
  margin-left: -2px;
}
[dir="rtl"] .checkbox-BD input[type=checkbox]:before{
  margin-right: 0px;
  margin-left: 10px;
}

.checkbox-BD input[type=checkbox]:before {
  content: '';
  margin-right: 10px;
  display: inline-block;
  vertical-align: text-top;
  width: 25px;
  height: 25px;
  background: white;
  border: 1px solid #ccd1d9;

  box-shadow: 0 0 2px 0px #ccc;
  border-radius: 3px;
  margin-left: -5px;
}
[dir="rtl"] .checkbox-BD input[type=checkbox]:after{
  right: 0px;
  left: 0!important;
  margin-left: 0px;
}
.checkbox-BD input[type=checkbox]:after {
  content: '';
  position: relative;
  left: 5px;
  top: 3px;
  display: block;
  width: 8px;
  height: 15px;
  border: solid transparent;
  border-width: 0 3px 3px 0;
  transform: rotate(48deg);
  margin: auto;
}
@media (max-width:767px){
  .checkbox-BD input[type=checkbox]:after {
    top: -22px;
  }
  .checkbox-BD input[type=checkbox]{
    margin: 0 20px 0 0;
 }
}

/** Bank details styles end **/
.modal-content .mx-layoutgrid.mx-layoutgrid-fluid .row .col-md-12, .tab-personal-info .mx-layoutgrid.mx-layoutgrid-fluid .row .col-md-12{
  padding-right: 15px!important;
  padding-left: 15px!important;
}

/** Bank details styles end **/
/*****************/
/* .input-feild-flex .form-group .control-label{
  display: flex;
} */
/* @media only screen and (max-width: 1375px) and (min-width: 992px) {
 .m-t-alignmrnt{
  margin-top: 27px;
}
} */

@media only screen and (max-width: 1520px) and (min-width: 992px) {
.input-feild-flex .form-group .control-label{
  /*width: 140px;*/
}
.input-feild-flex.vechical-info .form-group .control-label{
  /*width: 160px;*/
}
[dir="rtl"] .input-feild-flex .form-group .control-label{
  /*width: 115px;*/
}
.role-driver .input-feild-flex .form-group .control-label{
  /*width: 130px;*/
}
[dir="rtl"] .input-feild-flex .form-group .control-label{
  /*width: 105px;*/
}

.second-phase-signup-feild  .input-feild-flex .form-group .control-label{
  /*width: 128px;*/
}

[dir="rtl"] .second-phase-signup-feild .input-feild-flex .form-group .control-label{
  /*width: 90px;*/
  }

  [dir="rtl"]   .second-phase-signup-feild .input-feild-flex.vechical-info .form-group .control-label{
    /*width: 132px;*/
    }

[dir="rtl"] .input-feild-flex.vechical-info .form-group .control-label{
  /*white-space: nowrap;*/
}
}
/* @media only screen and (max-width: 1365px) and (min-width: 992px) {
  .input-feild-flex.arabic .form-group .control-label{
    width: 125px;
  }
  
  } */
@media (min-width:768px){
.p-15-responsive, .driver-dashbord .dashboard-edit-filter .row .col-md-12.p-15-responsive{
  padding-left:15px!important;
  padding-right:15px!important;
}
.m-t-25{
  margin-top: 41px;
    }
    /* .input-feild-flex .form-group .control-label{
  display: flex;
} */
}
@media (max-width:767px){
  .p-15-responsive, .driver-dashbord .dashboard-edit-filter .mx-layoutgrid.mx-layoutgrid-fluid .row .col-md-12.p-15-responsive{
    padding-left:7px!important;
    padding-right:7px!important;
  }
  .m-t-25{
    margin-top: 30px;
      }
}
/** search card in arbic ***/
.search-card-list.arbic .areas-list li label, [dir="rtl"] .areas-list li label, [dir="rtl"] .search-card-list .search-input, .search-card-list.arbic .search-input{
   direction: rtl;
   text-align: right;
}
.search-card-list.arbic .areas-list li label:before, [dir="rtl"] .areas-list li label:before{
  margin-left: 10px;
  margin-right: 0px;
}
.search-card-list.arbic .areas-list li label:after, [dir="rtl"] .areas-list li label:after{
  right: 13px;
  left: 0;
}
.browser-button-alignment .mx-fileinput .mx-wrapped-label{
  width: calc(100% - 122px)!important;
}
.browser-button-alignment  .mx-wrapped-form .btn, .browser-button-alignment  .mx-wrapped-form + .btn{
  min-width: 100px;
 }

[dir="rtl"] .arbic-date-text-left .text-right {
  text-align: left!important;
}


.section-one-landing .country-text .mx-referenceselector{
  height: auto!important;
  position: relative;
}

.section-one-landing .country-text .home-fields select.form-control{
  box-shadow: inset 0 0px 0px rgba(0,0,0,.075)!important;
}
@media (min-width:768px){
  .section-one-landing .country-text .alert.alert-danger{
    position: absolute;
    margin: auto;
    left: 0;
    right: 0;
  }
  .section-one-landing .country-text .mx-referenceselector{
    height: 49px;
    position: relative;
  }
}
[dir="rtl"] .text-align-buttons .text-right{
  text-align: left!important;
}
.logo-footer{
  width: 150px;
}

[dir="rtl"].role-driver .search-card .search-data .close {
  left: 10px;
/*  right: 0;*/
}
.state-wizard ul{
    padding: 0;
}
@media (min-width:768px){
.role-driver .state-wizard ul li{
    width: 50%;
}
}
[dir="rtl"] .search-data .close {
  left: 5px !important;
  right: auto;
}

.search-data .close {
  top: 15px;
}


.almost-there-progress-bar .progress .progress-bar-success{
  background-color: #23a3b4 !important;
  /* background-image: linear-gradient(to right top, #23a3b4, #23a9bb, #23b0c3, #23b6ca, #23bdd2) !important; */
  background-size: 0px !important;
  color: white!important;
 }
 
 .almost-there-progress-bar .progress .progress-bar-success.active{
  animation: none !important;
 }

 .tick-text h5{
   /* padding: 0 5px; */
   width: auto !important;
 }



/*** Font Styles ***/

 [dir="rtl"] .landing-page .already-text .mx-text,
 [dir="rtl"] .link-text-ar, [dir="rtl"] .landing-page_mobile .already-text_mobile .mx-text , 
 [dir="rtl"] .landing-page_mobile .already-text_mobile .link-text-ar_mobile{
   font-family: 'Cairo';
 }

 [dir="rtl"]  .home-fields .control-label, [dir="rtl"]  .home-fields select.form-control{
   font-family: 'Cairo';
   font-weight: 500;
 }
 
 [dir="rtl"]  .home-fields select.form-control{
  font-family: 'Cairo';
  font-weight: bold;
}

[dir="rtl"] .about-aramex-section .heading, [dir="rtl"] .about-aramex-section-en_mobile .heading_mobile{
  font-family: 'Cairo';
}

[dir="rtl"] .deliver-text, [dir="rtl"] .deliver-text-mobile{
/* font-family: 'Cairo'; */
font-weight: 500;
}

[dir="rtl"] .footer-section .heading, [dir="rtl"] .links a, [dir="rtl"] .copyright-text{
  font-family: 'Cairo';
}

.landing-page_mobile .want-more-earnings-en, .landing-page_mobile .section-text{
  font-family: 'Montserrat' ;
}
body[dir="rtl"] .full-phone-number-container{
 direction: ltr;
 text-align: right;
}

body[dir="rtl"] .full-phone-number-container_mobile{
 direction: ltr;
 text-align: right;
}

/* body[dir="rtl"] .rs-scale{
 left: 22px;
} */

body[dir="rtl"] .full-phone-number-container{
  direction: ltr;
  text-align: right;
}

.date-of-brith-dropdown {
  /*margin-bottom: 15px;*/
}

.deliver-text{
   /*font-family: 'Lato', sans-serif;*/
}
.DOB-text, .personal-information-row-common-styling p{
  /*color: #666;*/
  /*font-size: 1.571em;*/
  font-weight: 700;
  /*font-family: 'Lato', sans-serif;*/
}
.DOB-text::after{
    content: " *";
    color: red;
}
@media (max-width:767px){
  .DOB-text{
  font-size: 1.27em;
}
}
.role-administrator .footer-section{
  margin-top: 10px;
}

.date-picker-adjustment .form-control{
  padding-left: 15px !important;
  font-family: 'Montserrat';
}

.sidemenu-dashbord .mx-navigationtree .navbar-inner > ul > li:last-child a.active{
 color: #bfbfbf!important;
  border-right: 0px solid #36404e!important;
  border-left: 0px solid #36404e!important;
  border-top: 0px solid #36404e!important;
}
[dir="rtl"] .date-picker-adjustment .form-control{
  padding-right: 15px !important;
}

[dir="rtl"] .date-picker-adjustment.date-of-brith-dropdown .form-control{
  padding-right: 30px !important;
}
body[dir="rtl"]{
  font-family: 'Cairo';
}

body[dir="ltr"]{
  font-family: 'Montserrat';
}

.wizard-progress .wizard-step .wizard-step-title{
  font-family: 'Montserrat' !important;
}

[dir="rtl"] .wizard-progress .wizard-step .wizard-step-title{
  font-family: 'Cairo' !important;
}

[dir="rtl"] .pf-headding, [dir="rtl"] .next-button, [dir="rtl"] .back-button ,
[dir="rtl"] .sub-headding, [dir="rtl"] .form-group .control-label, [dir="rtl"] .DOB-text, 
[dir="rtl"] .date-picker-adjustment .form-control,
[dir="rtl"] .layout-anon .region-topbar.transparent-landing .logout-btn,
[dir="rtl"] .region-topbar.menubar-landing .logout-btn, [dir="rtl"] .login-card .submit,
[dir="rtl"] .landing-page .joint-button{
  font-family: 'Cairo' !important;
}
[dir="rtl"] .login-card .form-control{
  height:40px !important;
  font-family: 'Cairo' !important;
}

[dir="rtl"] .save-second-wizard{
  font-family: 'Cairo';
}

/*** Popup Design ***/

.almost-there-popup{
  width:500px !important;
  height: 210px !important;
}

.almost-there-popup-ar{
  width:400px !important;
  height: 210px !important;
}

@media (max-width:767px){
  .almost-there-popup-ar{
    width:300px !important;
    height: 250px !important;
  }
  .almost-there-popup{
    width:300px !important;
    height: 250px !important;
  }
}

.almost-there-popup-ar .modal-header{
  direction: rtl;
}

.almost-there-popup-ar .button-section .common-popup-btn{
  font-family: 'Cairo' !important;
}

.almost-there-popup-ar .modal-header h4{
  font-family: 'Cairo' !important;
  direction: ltr;
  text-align: right;
}

.almost-there-popup-ar .modal-header .close{
  float: left;
}

.almost-there-popup-ar  .popup-text {
  font-family: 'Cairo' !important;
}


.almost-there-popup .modal-header h4{
  font-size: 22px;
  color: #495663;
  font-family: 'Montserrat';
  font-weight: 600;  
}

.almost-there-popup  .popup-text {
font-size: 18px;
font-weight: 400;
line-height: 24px;
color: #495663;
font-family: 'Montserrat';
}

.almost-there-popup .button-section{
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 20px; 
}

.almost-there-popup .button-section .common-popup-btn{
  padding: 10px 25px;
  text-align: center;
  background-color: #303942;
  border: none !important;
  color: #ffffff;
  font-weight: 600;
  font-size: 18px;
  min-width: 150px;
}
.slider-section .slider{
  margin: 0 35px;
}
[dir="rtl"] .dates-btn{
  font-family: 'Cairo';
}

.section-text{
  font-family: 'Montserrat' !important;
   font-size:4.714em;
  line-height: 1;
  font-weight: bold;
  color: #fff;
}
/*** customize driver menu ***/

.customize-driver-menu .glyphicon-dashboard:before{
  content: '\f0e4';
  font-family: 'FontAwesome';
}

.customize-driver-menu .glyphicon-user:before{
  content: '\f007';
  font-family: 'FontAwesome';
}

.customize-driver-menu .glyphicon-credit-card:before{
  content: '\f0d6';
  font-family: 'FontAwesome';
}

/* .customize-driver-menu .glyphicon-dashboard:before{
  content: '\f0e4';
  font-family: 'FontAwesome';
} */

@media (max-width:1196px) and (min-width: 992px){
  .landing-page .section-text{
    font-size: 3.7em !important;
  }
}

.manage-jobs-admin .rs-container .rs-scale{
  display: flex;
}

.vehical-licence-data .form-group .control-label{
  white-space: nowrap;
}
.vehical-licence-data  select.form-control{
  padding-right: 30px!important;
}
@media (max-width:1240px) and (min-width: 992px){
 .vehical-data  .form-group .control-label,  .vehical-data  .form-control{
    white-space: nowrap;
    font-size:16px; 
  }
}
[dir="rtl"] .arabic-checkbox-text{
  margin-right: 15px;
 }

.side-menu-scroll .mx-scrollcontainer-wrapper{
  overflow: initial !important;
}

@media (min-width:768px){
	.help-support-mobile{
		display:none;
	}
}



/**** driver profil styles  *****/
.role-driver  .profile-information  .tick-text h5,   .second-phase-signup-feild .tick-text h5{
  font-size: 0.91em!important;
}
.role-driver  .profile-information .form-control,  .second-phase-signup-feild .form-control  {
  /*font-size: 1.2em;*/
  /*height: 40.2px;*/
}

 .role-driver .profile-information .btn, .role-driver .profile-information .mx-button,.LandingPage .role-driver .profile-information .form-group .control-label{
  /*font-size: 1.1em;*/
  /*line-height: 1.1em;*/
}

.second-phase-signup-feild .btn, .second-phase-signup-feild .mx-button,.second-phase-signup-feild .form-group .control-label{
  font-size: 1.1em;
  line-height: 1.1em;
}

.role-driver .profile-information  .sub-headding,  .second-phase-signup-feild .sub-headding {
  margin-bottom: 10px;
  font-size: 1.2em!important;
}

/**** driver profil styles  ****

.search-data .close{
	right:0px ;
	top:-35px ;
}

/*** Terms of use ***/

.doc-viewer .documentiframe{
height: 80vh !important;
}

/***  side menu for admin page start ****/
.role-administrator  .mx-scrollcontainer-wrapper{
  /* height: 100%!important; */
  overflow-y: auto!important;
  overflow-x: hidden!important;
}

.role-administrator   .sidemenu-dashbord  .mx-scrollcontainer-wrapper{
  height: 700px!important;
}
.role-administrator  .side-menu-scroll .mx-navigationtree .navbar-inner{
  overflow-y: inherit; 
 overflow-x: inherit;
 height: 100%;
 max-height: 100%;
}
.role-administrator    .mx-scrollcontainer-shrink > .mx-scrollcontainer-toggleable{
  height: 100%!important;
  background-color: #ccc;
}
  .sidemenu-dashbord .admin-sidemenu-list  ul li a{
  color: #303942!important;
}

.sidemenu-dashbord .admin-sidemenu-list  ul li a:focus{
  color: #303942!important;
  border-right: 2px solid #303942;
}
.sidemenu-dashbord .admin-sidemenu-list  ul li ul li a{
  color: #9ea3a8!important;
}
.sidemenu-dashbord .admin-sidemenu-list  ul li ul li a:focus{
  color: #fff!important;
}
.role-administrator  .sidemenu-dashbord .mx-navigationtree .navbar-inner > ul{
  top:0;
}
/* 
.role-administrator   .sidemenu-dashbord{
  height: auto !important;
  overflow-y: inherit!important;
}


.role-administrator    .sidemenu-dashbord .mx-navigationtree .navbar-inner > ul > li a.active{
  color: #fff;
}


.role-administrator   .mx-navigationtree li.mx-navigationtree-has-items > ul li a:hover{
  color: #fff!important;
}

.role-administrator   .sidemenu-dashbord .mx-navigationtree .navbar-inner > ul > li a{
  color:#303942;
} */


/***  side menu for admin page end ****/

/*** Help & support ***/

.help-support-text{
	text-align:center;
}

body[dir="rtl"] .help-support-text{
	text-align:center;
}


/*** Teja Kumar Changes ***/
.video-head-text, .video-desc-text{
  color:#303A43;
  font-family: 'Montserrat';  
}

.video-head-text{
  font-weight: 600;
}

.video-desc-text{
  font-weight: 600;
  font-size: 12px;
}

body[dir="rtl"] .video-desc-text{
  font-size: 16px;
  font-weight: 400;
  font-family: 'Cairo';
}

body[dir="rtl"] .video-head-text{
  font-family: 'Cairo';
  font-size: 24px;
}

.social-link-head{
  color:#303A43;
  font-family: 'Montserrat';
  font-weight: 500; 
  margin-bottom: 10px;
}

body[dir="rtl"] .social-link-head{
  font-family: 'Cairo';
  margin-bottom: 10px;
}

.deliver-aramex-section{
  margin: auto;
  text-align: center !important;
  width: 100%;
}

.deliver-aramex-section .form-horizontal{
  margin: auto;
  text-align: center !important;
  width: 80%;
}

.deliver-aramex-text{
  color: #FFFFFF;
  font-size: 1.6rem;
  line-height: 34px;
  font-family: 'Montserrat';
}

body[dir="rtl"] .deliver-aramex-text{
  font-family: 'Cairo';
}

@media (max-width:767px){
  .section-middle-img-greystrip{
    background-image: url("../../images/img-how-final-mobile.png");
    padding-bottom: 200%;
  }
  .section-middle-img-steps{
    background-image: url("../../images/img-steps-En-mobile.png");
    padding-bottom: 140%;
  }
  .video-head-text{
    font-size: 35px;
    font-weight: 600;
    color: #303A43;
    line-height: 1;
    margin-bottom: 20px;
  }

  body[dir="rtl"] .video-head-text{
    font-size: 30px;
    line-height: 1.4;
  }

  body[dir="rtl"] .video-desc-text{
    font-size: 12px !important;
  }

  .video-desc-text{
    font-size: 12px;
    font-weight: 600;
    color: #303A43;
    line-height: 1.8;
  }
  .social-link-head{
    font-size: 28px;
    font-weight: 600;
    color: #303A43;
    line-height: 1;
    margin-bottom: 20px;
  }
  .video-section-mobile{
    width: 80%;
    margin: auto;
  }
  .deliver-aramex-text-mobile{
    font-size: 14px;
    line-height: 2;
  }
  .about-aramex-section{
    background-position: 30% !important;
  }
  [dir="rtl"] .section-middle-img-greystrip{
    background-image: url(../../images/img-how_ar_mobile.png);
    padding-bottom: 200%;
  }
  [dir="rtl"] .section-middle-img-steps{
    background-image: url(../../images/img-steps-Ar_mobile.png);
    padding-bottom:140%; 
  }
  [dir="rtl"] .deliver-aramex-text-mobile{
    font-family: 'Cairo' !important;
  }
  .footer-section .links{
    line-height: 3;
    font-size: 12px;
  }
  .mobile-social-icons{
    margin-bottom: 30px;
  }
  .logo-footer{
    margin:20px auto;
  }
  .copyright-text{
    text-align: center !important;
    margin: 10px 0px;
    font-size: 12px;
  }
  .corosol-image{
    background-position: 70% center;
  }
  [dir="rtl"] .copyright-container .copyright-text{
    text-align: center !important;
    margin: 20px 0px;
  }
  .landing-page_mobile .already-text_mobile{
    font-size: 16px;
  }
  .carousel{
    /*display: flex;*/
    /*justify-content: center;*/
    /*align-items: flex-end;*/
    /*background-size: cover;*/
    /*width: 100%;*/
    height: 100vh;
    /*margin: 0;*/
    min-height: 700px !important;
    /*background-repeat: no-repeat;*/
    margin-top: 0px !important;
  }

  .carousel-inner{
    height: 100%;
  }
  .country-drop-down .form-control{
    font-size: 1.25em !important;
  }
  .dropdown-block-mobile{
    width: 75%;
    margin: auto;
  }
  .already-text-mobile{
    font-size: 14px !important;
  }
  .corosol-container{
    /*min-height: 720px !important;*/
    /*height: 100vh !important;*/
  }
  .dot-section{
    bottom: 20px;
  }
}

@media (min-width:768px) and (max-width:991px){
  .landing-page .section-text, .section-text{
    font-size: 3em;    
  }
  .landing-page .dropdown-section{
    padding: 0px;
  }
  .dropdown-block{
    width: auto !important;
  }
  .banner-section{
    margin-left: 35px;
  }
  .landing-page .joint-button{
    margin: 0px 5px;
  }
  .corosol-image{
    background-position: 60%;
  }
  .login-btn{
    padding: 0px;
  }
  .region-topbar.menubar-landing .logout-btn{
    margin-right: 15px;
    width: 100px;
  }
  .order-1 .form-horizontal{
    width: 80%;
    margin: auto;
  }
  .video-head-text, .video-desc-text, .social-link-head{
    font-weight: 600;
  }
  .social-icon-table{
    width: auto;
  }
  .deliver-aramex-text{
    font-size: 1.3rem;
    line-height: 30px;
  }
  .about-aramex-section{
    background-position: 40%;
  }
  .footer-social-icons{
    width: 40%;
  }
  [dir="rtl"] .region-topbar.menubar-landing .logout-btn{
    margin-right: 0px;
    margin-left: 15px;
    width: 120px;
    font-size: 1.2em;
  }
  [dir="rtl"] .copyright-text{
    text-align: left !important;
  }
  [dir="rtl"] .about-aramex-section{
    padding: 0px;
    min-height: 400px;
    background-position: 40%;
  }
  [dir="rtl"] .landing-page .joint-button{
    font-size: 1.2em;
  }
  body[dir="rtl"] .banner-section{
    margin-right: 40px;
  }
  .region-topbar.menubar-landing, .region-topbar.menubar-landing{
    padding: 25px 0px !important;
  }
}

.video-text-block{  
  padding-top: 7%;
  padding-left: 10%;
  padding-right: 15px;
}

[dir="rtl"] .video-text-block{
  padding-top: 7%;
  padding-right: 10%;
  padding-left: 30px;
  }

@media (max-width:992px){
  .video-text-block{
    padding-top: 4%;
    padding-left: 20px;
    padding-right: 5px;
    padding-bottom: 2%;
  }
}


/* carousel styles */

.carousel-indicators{
  bottom: 0px !important;
}

.dot.active{
  width: 15px !important;
  height: 15px !important;
  background-image: linear-gradient(45deg, #3B4B56 0%, #346E83 100%);
}

.carousel-indicators li{
  width: 15px !important;
  height: 15px !important;
  background-color: #FFFFFF;
  border: 0px;
}

.carousel-control.right, .carousel-control.left{
  background-image: none !important;
}


.login-btn{
  z-index: 999999;
}

.carousel-control{
  opacity: 1;
}

.left-arrow{
  position: absolute;
  left: 30px;
  top:40%;   
  z-index: 99999999;  

}
.right-arrow{
  position: absolute;
  right: 30px;
  top:40%;  
  z-index: 99999999;  
}
.arrow-btns{
  background-color: transparent;
  border: 0;
  outline: 0;
  font-size: 3rem !important;
  padding: 0;
  color: #FFF;
  opacity: 0.9;
  box-shadow: 0px 0px 0px rgba(0,0,0,0.3);
  z-index: 99999;
}
.arrow-btns:hover, .arrow-btns:focus{
  color: #fff;
  border:0px;
  background-color: transparent;
}

@media (max-width:767px){
  
  .role-anonymous .mobile-homepage-menu-container,.role-anonymous .mobile-homepage-menu-container .mobile-homepage-menu-button{
    z-index: 9999;
  }
  .right-arrow .glyphicon-chevron-right{
    font-size: 1em;
  }
  .right-arrow{
    right: 5px;
  }
  .left-arrow .glyphicon-chevron-left{
    font-size: 1em;
  }
  .left-arrow{
    left: 5px;;
  }
  .carousel-indicators{
    width: 100%;
    right: 0px;
    left: 0px;
    margin: 0px;
    padding: 0px;
  }
}



.mySlides {
  display: none;
  height: 100%;
}


  .mySlides {
    height: 100%;    
  }

  .mySlides img{  
    min-height: 100%;
    object-fit: cover;
    object-position: 55% 40%;
  }

  @media (max-width:767px){
    .mySlides img{
      min-height: 700px ;
      object-fit: cover; 
      object-position: 55% 40%;   
    }
  }

/* Slideshow container */
.slideshow-container {
  position: relative;
  height: 100%;
  width: 100vw;
}

/* Caption text */
.text {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #f2f2f2;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #fff;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
  box-shadow: 0px 3px 6px 4px rgba(0, 0, 0, 0.06);
  text-shadow: 2px 2px 2px #0000;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 3s;
  animation-name: fade;
  animation-duration: 3s;
  transition: 2s ease-in-out;
}

@-webkit-keyframes fade {
  from {opacity: 0.8} 
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: 0.8} 
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 300px) {
  .text {font-size: 11px}
}

.dot-section{
  position: absolute;
  bottom: 40px;
  right: 0;
  left: 0;
  z-index: 999999999999999;
}

@media (max-width:767px){
  .dot-section{
    bottom: 10px;
  }
}

.youtube-iframe{
  width: 100%;
  min-height: 320px;
  display: flex;
}

body[dir="rtl"] .youtube-iframe{
  min-width: 102% !important;
}

@media (max-width:992px){
  body[dir="rtl"] .youtube-iframe{
    min-width: 100% !important;
  }
}

@media (max-width:767px){
  .corosol-container{
    /*min-height: 720px !important;*/
    /*height: auto !important;*/
  }
}


.corosol-container{
  /* display: flex;
  justify-content: center;
  align-items: flex-end; */
  background-size: cover;
  width: 100%;
  height: 100vh;
  margin: 0;
  min-height: 920px;
  margin-top: -130px;
  background-repeat: no-repeat;
}

.carousel {
  position: relative;
}

.slides {
  height: 100%;
  width: 100%;
  position: relative;
}

.slide:nth-child(1) {
    opacity: 1;
}

.slide[data-state=active] {
  display: block;
}

.indicators {
  position: absolute;
  bottom: 20px;
  right: 0px;
  left: 0px;
  z-index: 999999;
  text-align: center;
}

@media (max-width:767px){
  .indicators {
    bottom: 30px;
  }
}

.indicators [type="radio"]:checked,
.indicators [type="radio"]:not(:checked)
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
    /* margin: 0 4px; */
    outline: 0;
    visibility: visible;
    -webkit-appearance: none;
    appearance: none;
}
.indicators [type="radio"]:checked:before,
.indicators [type="radio"]:not(:checked):before {
    content: '';
    position: absolute;
    left: -1px;
    right: 0;
    top: -1px;
    width: 18px;
    height: 18px;
    border-radius: 100%;
    background: #fff;
    visibility: visible;
}
.indicators [type="radio"]:checked:after,
.indicators [type="radio"]:not(:checked):after {
    content: '';
    width: 18px;
    height: 18px;
    background-image: linear-gradient(45deg, #3B4B56 0%, #346E83 100%);
    position: absolute;
    right: 0;
    top: -1px;
    left: -1px;
    border-radius: 100%;
    -webkit-transition: all 0.2s ease;
    transition: all 0.2s ease;
    visibility: visible;
  }
.indicators [type="radio"]:not(:checked):after {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
.indicators [type="radio"]:checked:after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}

.mySlides .six{
  object-position: 50%;
}

.mySlides .five{
  object-position: 50%;
}
.mySlides .four{
  object-position: 70%;
}
.mySlides .three{
  object-position: 70%;
}
.mySlides .two{
  object-position: 65%;
}
.mySlides .one{
  object-position: 30%;
}

body[dir="rtl"] .landing-page .already-text{
  text-align: right !important;
}




/* carousel slider */
.carousel {
  position: relative;
}

.slides {
  height: 100%;
  width: 100%;
  position: relative;
}

.desktop-slide {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  font-size: 3em;
  color: white;
  line-height: 400px;
  text-align: center;
  opacity: 0;
  transition: opacity 2000ms;
}

.desktop-slide img{  
  min-height: 100%;
  object-fit: cover;
  object-position: 55% 40%;
}

.slide-des:nth-child(1) {
    opacity: 1;
}

.slide-des[data-state=active] {
  display: block;
}


/* buttons issue related styles */

@supports (-webkit-appearance:none) {
.indicators [type="radio"]:checked,
.indicators [type="radio"]:not(:checked)
{
    position: relative;
    padding-left: 28px;
    cursor: pointer;
    line-height: 20px;
    display: inline-block;
    color: #666;
    /* margin: 0 4px; */
    outline: 0;
    visibility: visible !important;
    -webkit-appearance: none;
    appearance: none;
}
}


@supports (-ms-ime-align: auto) {
  .indicators [type="radio"]:checked,
  .indicators [type="radio"]:not(:checked)
  {
      position: relative;
      padding-left: 0px !important;
      cursor: pointer;
      line-height: 20px;
      display: inline-block;
      color: #666;
      /* margin: 0 4px; */
      outline: 0;
      visibility: visible !important;
      -webkit-appearance: none;
      appearance: none;
  }
}


@media screen and (-webkit-min-device-pixel-ratio:0) {
  .indicators [type="radio"]:checked,
  .indicators [type="radio"]:not(:checked)
  {
      position: relative;
      padding-left: 28px;
      cursor: pointer;
      line-height: 20px;
      display: inline-block;
      color: #666;
      /* margin: 0 4px; */
      outline: 0;
      visibility: visible;
      -webkit-appearance: none;
      appearance: none;
  }
}

/* .dijitCalendarContainer{
  z-index: 110000000000000 !important;
} */


 tr td, th {
  /* padding: 15px 15px 15px 15px; */
  vertical-align: middle;
  border-width: 0;
  border-color: #D7D7D7;
}

.background-logo + #content{
  height: auto !important;
}

.profile-information{
	padding-top: 0px !important;
}

.mx-calendar{
  z-index: 99999999999 !important;
  }