/*stuff for mobile yay */


/*override some old classes......... */
.modal-content .tab-content-gen {
  border: 0;
}
.btn-v-small {
  padding: 3px 10px !important;
  font-size: 14px;
  height: 30px;
}
.tab-content > .tab-pane > section {
  margin: 0px 10px;
}
.display-on-mobile, .display-table-cell-on-mobile {
  display: none !important;
}
.navbar-collapse.collapse {
  display: none !important;
}
.pull-right-not-nb {
  float: right;
}
.rate-payer-table th {
  color: #666666;
}
.small-top-margin {
  margin-top: 35px !important;
}
.consumption-table th {
  color: #666666;
  line-height: 2;
  font-family: Arial, 'Helvetica Neue', Helvetica;
  font-weight: normal;
}
label{
  margin-top:10px;
}
.section-button{
  padding: 2px 6px;
}
.btn-icon {
  min-width: 30px;
  font-size: 16px;
}
.small-bottom-content-tab > li {
  min-height: 30px;
  font-size: 14px;
}
.small-bottom-content-tab > li:hover {
  min-height: 33px;
}
.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
	background-color: #eee;
  cursor: pointer;
}
.row-selected {
  background-color: rgba(2, 80, 130, 0.12);
  box-shadow: 0px 0px 2px 2px #ECFFFE;
}
.row-selected > td:nth-child(1) {
  padding-left: 2px;
}
.container-fluid {
  background-color: #fff;
  box-shadow: 0px 3.6px 7.6px 0px #888888;
  padding-bottom: 15px;
}
.ul-scroll-wrapper {
  width: 100%;
  overflow: hidden;
  /*padding-top: 1px;
  margin-left: 36px;*/
  left: 0px;
  position: relative;
  height: auto;
  /*background-color: aqua;*/
}

.nav-tabs-border-bottom-nb {
  border-bottom: 1px solid #ccc !important;
}

.icon-wrapper-left {
  position: absolute;
  /*left: 90%;*/
  top: 57px;
  display:none;
}
.icon-wrapper-right {
  position: absolute;
  left: 90% !important;
  top: 57px;
  display:none;
}

.bottom-block-text {
  /*  min-height: 55px;*/
  height:93px;
  line-height: 1.3;
  min-height: 58px;
}


.navbar-inverse {
    background-color: inherit;
  }
.navbar-header {
  color: #fff;
  list-style: none;
  margin-top:10px;
  font-size:18px;
}
.navbar-collapse > ul > li {
  /*color: #7fb9d2;*/
}

.navbar-toggle {
  /*background-color: #0074a6;*/
}
.navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {
  /*background-color: #00395d;
  border-color: #0074a6;*/
}
.nav-a-no-color-nb {
  background-color: inherit !important;
  border: 0px !important;
  color:inherit !important;
  padding: 4px 25px !important;
}
.nav-a-fs-nb {
  font-size: 18px !important;
}

.navbar-inverse {
  margin: 0px;
}


.btn-report {
  padding: 3px 10px;
  min-width:110px;
  font-size: 14px;
  height: 30px;
}
.btn-report > .glyphicon {
  font-size: 12px;
  margin-left: 5px;
}


.side-wrapper-local {
  background-color: #0267a9;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#eee), to(#ccc));
  background-image: -webkit-linear-gradient(top, #eee, #ccc);
  background-image: -moz-linear-gradient(top, #eee, #ccc);
  background-image: -ms-linear-gradient(top, #eee, #ccc);
  background-image: -o-linear-gradient(top, #eee, #ccc);
  background-image: linear-gradient(top, #eee, #ccc);

  -webkit-box-shadow: 10px -5px 6px -8px #888;
  box-shadow: 10px -5px 6px -8px #888;
  width: 190px;
  transition: width 0.3s ease;
}
.text-white {
  color: #fff!important;
}

/*cater for phones......... */

@media (max-width: 640px) {
  .icon-top-logout {
    margin-right: 10px;
  }
  /*[class^="icon-"]:before, [class*=" icon-"]:before  {
    display: none;
  }*/
  .navbar-toggle {
    margin: 3px 0px 0px 0px;
    padding: 4px 4px;
  }
  .navbar-header {
    font-size: inherit;
    margin-top: 17px;
  }
  .no-img-mobile {
    display: none;
  }
  .mobile-hidden {
    display: none !important;
  }
  .topBanner {
    height: auto;
    padding-bottom: 10px;
  }
  .topRowLogo {
    display: none;
  }
  .topBreadcrumb {
    padding-top: 20px;
  }
  .toolbox-div {
    padding-top: 0px;
    margin-top: 0px;
    width: 100%;
    padding-left: 0px;
  }
  .text-right {
    text-align: left !important;
  }
  .ul-scroll-wrapper {
    left: 20px;
    width: 88%;
  }
  .tab-content {
    overflow-y: auto;
    max-height: 350px;
  }
  .icon-wrapper-right, .icon-wrapper-left {
    display: block;
    top: 40px !important;
  }
  .other-icon-wrapper-right, .other-icon-wrapper-left {
    display: block;
    top: 5px !important;
  }
  .icon-wrapper-zero-top {
    top: 5px !important;
  }
  .table-overflow-x {
    overflow: scroll !important;
  }
  .table-employer, .table-contribution {
   /* width: auto;
    max-width: none;
    table-layout: fixed;*/
    
  }
  .table-employer, .table-contribution > tbody > tr > th, td {
   /* min-width: 20px;*/
  }
  .bottom-block-text {
    height: auto;
    min-height: 0;
  }
  .navbar {
    height: auto;
    font-size: inherit;
  }

  .navbar-header {
    float: none;
  }
  .navbar-toggle {
    display: block;
  }

  .navbar-collapse {
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
  }

  .navbar-collapse.collapse {
    display: none!important;
  }
  .navbar-nav {
    float: none!important;
    margin: 7.5px -15px;
  }
  .navbar-nav>li {
    float: none;
  }
  .navbar-nav>li>a {
    padding-top: 10px;
    padding-bottom: 10px;
  }
  .navbar-text {
    float: none;
    margin: 15px 0;
  }

  /* since 3.1.0 */
  .navbar-collapse.collapse.in { 
    display: block!important;
    overflow-x: hidden;
  }
  .collapsing {
    overflow: hidden!important;
  }
  .nav-header-padding {
    padding: 9px;
  }
  .benefit-icon-width {
    width: 90%;
  }
  .pos-z-index {
    z-index: 5;
  }
  .tc-no-max-height-mobile {
    max-height: none; 
  }
  .projection-box-center {
    border-left:1px solid #ccc;
    border-right:1px solid #ccc;
  }
  .projection-box {
    margin-top: 30px;
    margin-bottom: 30px;
  }
  .proj-no-border {
    border: 0px solid #ccc;
  }
  .nstSlider-calculator {
    margin-bottom: 23px;
    margin-top: 20px;
  }
  .projection-button {
    margin-top: 10px;
  }
  .bottomContentTab > li {
    min-width: 88px;
    max-width: 88px;
  }
  .margin-top-mobile {
    margin-top: 25px;
  }
  .padding-top-mobile {
    padding-top: 25px;
  }
  .icon-side-font-size {
    display: none;
  }
  .mobile-full-width {
    width: 100%;
  }
  .mobile-half-width {
    width: 50%;
  }
  .mobile-nb-left {
    float: left !important;
  }
  .display-on-mobile {
    display: inline-block !important;
  }
  .display-table-cell-on-mobile {
    display: table-cell !important;
  }
  .inline-on-mobile {
    display: inline-block;
  }
  .breadcrumb-top-margin {
    margin-top: 35px;
  }
  .rows-ratepayers {
    margin-top: 15px;
  }
  .container > div > h2 {
    margin-top: 5px;
  }
  .tab-content-gen {
    padding: 2px;
  }
  .col-sm-2, .col-sm-4, .col-sm-6, .col-sm-8, .col-sm-10, .col-sm-12 {
    padding-left: 7px;
    padding-right: 7px;
  }
  .navbar-default .navbar-collapse, .navbar-default .navbar-form {
    border-color: transparent;
  }
  .container-fluid {
    margin-left: 0px !important;
  }
  .cd-dropdown-content {
    padding: 0px;
}
  .cd-dropdown-content > .top-level {
    width: 50%;
  }
  .cd-dropdown-content > .current-context {
    width: 34%;
  }

  .cd-dropdown-content > .top-level.icon-with-child {
    width: 10%;
  }
  .cd-dropdown-content > .icon-with-child > ul.is-active {
    width: 100%;
    left: 0;
  }
  .cd-dropdown-content > .current-active-page {
    width: 33%;
  }
  .cd-dropdown-content > .current-active-page, .cd-dropdown-content > .current-context {
    display: block !important; 
  }
  .cd-dropdown-content > #navbarMenuClose, .cd-dropdown-content > #navbarMenuHamburger {
    display: block !important;
    width: auto;
  }
  .cd-dropdown-content > .has-children > ul.is-active {
    opacity: 1;
    z-index: 2;
    overflow: auto;
    height: 30em;
  }
  .cd-dropdown-content > .current-active-page li {
    /* display: block !important; */
  }
  #modalFullChartDialog {
    width: 95% !important;
  }
  /*.has-children > a::before, .has-children > a::after {
    display: none;
  }*/
  .has-children > a > p::before, .has-children > a > p::after, .go-back a::before, .go-back a::after {
    content: '';
    position: absolute;
    top: 55%;
    margin-top: -1px;
    display: inline-block;
    height: 1px;
    width: 4px;
    background: #ffffff;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  .has-children > a > p::before, .go-back a::before {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  .cd-dropdown-icons .has-children > a > p::before {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  .has-children > a > p::after, .go-back a::after {
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
  }

  .has-children > a {
    padding-right: 20px;
  }
  .has-children > a > p {
    position: absolute;
    display: inline;
    top: 4px;
    min-width: 30px;
    min-height: 30px;
    left: 80%;
  }
  .has-children > a > p::before, .has-children > a > p::after {
    right: 10px;
    -webkit-transform-origin: 4px 50%;
    -moz-transform-origin: 4px 50%;
    -ms-transform-origin: 4px 50%;
    -o-transform-origin: 4px 50%;
    transform-origin: 4px 50%;
  }

  .open-to-left .cd-dropdown-content > .has-children > a {
    padding-left: 40px;
    padding-right: 20px;
  }
  .open-to-left .cd-dropdown-content > .has-children > a > p::before, .open-to-left .cd-dropdown-content > .has-children > a > p::after {
    right: auto;
    left: 20px;
    -webkit-transform-origin: 1px 50%;
    -moz-transform-origin: 1px 50%;
    -ms-transform-origin: 1px 50%;
    -o-transform-origin: 1px 50%;
    transform-origin: 1px 50%;
  }





  /* catering now for mobile phones for the square pizza and mywork and scm page design with top and side navbar */

  .mobile-overflow-x {
    overflow-x: auto;
    margin: 0px 5px;
  }
  .sub-sr-section {
    padding: 5px 15px !important;
  }
  .sub-sr-header {
    padding: 10px 15px !important;
  }
  .mobile-no-right-padding {
    padding-right: 0px;
  }
  .table-no-wrap td, .table-no-wrap th {
    white-space: nowrap;
  }
  table.dataTable thead .sorting_desc:after, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting:after {
    content: '' !important;
  }
  .overflow-visible {
    overflow: visible !important;
    width: 190px !important;
    transition: width 0.3s ease;
  }
  .sidebar-nav {
    width: 0px !important;
    transition: width 0.3s ease;
  }
  .overflow-visible > .sidebar-nav {
    width: 190px !important;
    transition: width 0.3s ease;
  }
  .sidenavbar-wf {
    background-color: #ccc;
    overflow-y: auto;
    height: 100%;
  }

  #stickyButtons.action-buttons {
    display: none !important;
  }
  .action-buttons button {
    margin-right: 0px !important;
    margin-bottom: 2px;
  }
  .select-inline {
    margin-right: 0px !important;
  }
  .action-buttons {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
  .modal-dialog {
    width: auto !important;
  }
}


/*cater for tablets......... */


@media (max-width: 1024px) {
  .tab-content {
    overflow-y: auto;
    max-height: 350px;
  }
  .icon-wrapper-right, .icon-wrapper-left {
    display: block;
    top: 5px;
  }
  .ul-scroll-wrapper {
    left: 20px;
  }
  .tc-no-max-height-mobile {
    max-height: none; 
  }
  .bottom-block-text {
    height:auto;
    min-height: 70px;
  }
  .projection-label {
    height: 30px;
  }
  .right-navbar-fixed {
    left: 920px !important;
  }
  .no-img-mobile {
    display: none;
  }
  section > div {
    padding-left: 3px !important;
    padding-right: 3px !important;
  }
}

.div-search {
  display: table;
}
.div-search .input-group-btn:last-child > .btn {
  margin-left: -3px;
}

/*cater for desktops......... */

/*
@media (min-width: 767px) {
  .pull-right-desktop {
    float: right !important;
  }
  .navbar-collapse {
    width: 50%;
  }
  .portfolio-tab-value {
    text-align: right;
    padding-right: 31px !important;
  }
  .li-btn-desktop {
    background-color: #105887;
    border-color: #105887;
    color: #fff !important;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    border-radius: 5px;
    -moz-user-select: none;
    font-size: 16px;
    font-family: Arial, 'Helvetica Neue', Helvetica;
    transition: background 0.45s ease-out;
  }
}

*/

.no-background {
  background: none !important;
}