/*$button-raised-color: #2c3531 !default;*/
/*$collapsible-body-color: #FFCB9A !default;*/
/* File that holds base styling for the entire application 
    Used to combine with each application theme to create a unique theme styling so there
    will be a site.css under each theme that contains all the styles created by combining this
    scss file with the materialize variables.  There is a separate materialize styling as well. Both
    are required.
*/
.circle {
  background-color: #D9B08C !important; }

.wk-tan {
  color: #D9B08C !important; }

.wk-peach {
  /*color: #FFCB9A;*/
  background-color: #FFCB9A; }

.wk-green {
  color: #116466; }

.wk-text {
  color: #000; }

.user-view {
  padding: 15px !important; }

/* helps keep plot.ly off of materializecss tabs */
.svg-container {
  margin-top: 10px !important;
  margin-right: 0px !important; }

/* KDA 1.0.0 dropdown-trigger has blue outline, bug? */
.dropdown-trigger {
  outline-color: transparent; }

.dropdown-content {
  min-width: 120px; }

/*.material-tooltip {
    top: unset !important;
    left: unset !important;
}*/
/* Buttons - override MaterializeCSS */
.navbar-color .dropdown-trigger.btn i,
.navbar-color .dropdown-trigger.btn-floating i,
.navbar-color .dropdown-trigger.btn-large i,
.navbar-color .dropdown-trigger.btn-small i,
.navbar-color .dropdown-trigger.btn-flat i {
  color: fff; }

.btn {
  /*background-color: $secondary-color;*/
  /*&.hover {
        background-color: #116466;
        background-color: $button-raised-background-hover;
    }*/
  /*&.focus {
        background-color: #D9B08C;
    }*/ }
  .btn.visited {
    background-color: #2c3531; }
  .btn.active {
    background-color: #D9B08C; }

/* Cards - override MaterializeCSS */
.card .card-title {
  font-weight: 400;
  color: #116466; }

.dashboard-card .card-title {
  color: #000 !important; }

.dashboard-card.card-content h5 {
  color: #000 !important; }

.dashboard-card.card-content > p {
  color: #000 !important; }

/* Checkboxes - override MaterializeCSS */
[type="checkbox"].filled-in:checked + span:not(.lever):after {
  border: 2px solid #FFCB9A;
  background-color: #FFCB9A; }

/* Learn More Links */
li.learn-more-link {
  padding-bottom: 5px; }

.learn-more-link-heading {
  font-size: 1.64rem;
  font-weight: 400;
  line-height: 110%;
  margin: 1.09333rem 0 0.656rem 0; }

.learn-more-link {
  color: #0A3D3D;
  font-size: 1.1rem;
  font-weight: 400; }

a:hover.learn-more-link {
  color: #157f7f; }

/* Tab colors */
.tabs .tab a.active {
  background-color: #D1E8E2; }

/*.tabs .tab a:hover {
    color: darkslategray;
}*/
/*.tabs .tab a {
    color: lightgray;
}*/
/* end tab colors */
/** START CHANGES **/
div#test5 {
  /*position: fixed;*/
  top: 80px;
  margin-left: 0;
  margin-right: 0;
  bottom: 25px;
  min-width: 200px;
  /*width: 100%;*/
  background: black;
  height: 300px; }

div#test5 iframe {
  /*position: absolute;*/
  /*padding-top: 100px;*/
  /*bottom: 0;*/
  /*padding-left: 30px;
                        padding-right: 30px;
                        padding-bottom: 30px;*/
  height: 100%;
  width: 100%;
  /*display: none;*/ }

/** END CHANGES **/
.collection .collection-item.orderLine {
  padding: 10px;
  border-bottom: none; }

.orderLineTitle {
  padding-left: 5px; }

.verticalLine {
  border-left: thin solid lightgray; }

/* used to have header here when margin-top was 64px */
main[id="main"] {
  padding-left: 0px; }

header[id="header"] {
  padding-left: 270px; }

/* KDA change for materialize 1.0.0-alpha.1 */
/*.content, footer {
    padding-left: 270px;
}*/
/* hide the blue outline on the side nav link */
.sidenav li > a:focus {
  /*border-color: red !important;
    border-width: 1px;
    border-style: solid;
    text-decoration: none;*/
  outline-style: none; }

/* KDA rename class side-nav to sidenav */
.sidenav {
  /*position: absolute;*/
  /*margin-top: 64px;*/
  margin-top: 0px;
  height: 100%;
  /*z-index: -90;*/
  overflow-y: hidden;
  /* fixes a scroll bar problem in FF */ }

nav {
  padding-right: 270px; }

nav .brand-logo {
  padding-left: 15px; }

nav[id="navbar-unauthenticated"] {
  padding-right: 0px; }

.container {
  max-width: unset;
  width: 90%; }

#selectField {
  margin-top: 0px; }

/* add a little room to help offset the footer covering the page */
.content .container {
  padding-bottom: 60px; }

/*  Changing colors of waves to custom - brown
                          When creating your CSS selector,
                          change "brown" to something of your choosing
                          */
/* The alpha value allows the text and background color
                           of the button to still show through. */
/*.waves-effect.waves-brown .waves-ripple {
                    background-color: rgba(121, 85, 72, 0.65);
                }*/
/*.ilike-blue-container {
                          @@extend .blue, .lighten-4;
                        }*/
/*.navbar-color {
    background-color: lightgray;
}*/
/* KDA added for 1.0.0 */
.sidenav-fixed {
  width: 270px; }

.sideNavBarContainer {
  position: fixed;
  width: 270px;
  background-color: #d7d7d7;
  height: 100%; }

.sideNavHeader {
  background-color: #2C3531;
  height: 177px;
  /*height: 194px;*/
  width: 270px;
  margin-top: 0px;
  margin-bottom: 0px;
  padding-bottom: 0px;
  overflow: hidden; }

.sideNavList {
  /*list-style: none;*/
  padding: 0;
  margin: 0;
  overflow-y: auto;
  overflow-x: hidden;
  position: absolute;
  width: 270px;
  height: 80%;
  padding-bottom: 194px; }

/*left-sidebar-nav {
                                  -webkit-transition: left 0.3s ease;
                                  transition: left 0.3s ease;
                              }*/
/* for sticky footer */
/*.body {
                            display: flex;
                            min-height: 100vh;
                            flex-direction: column;


                            display: -webkit-box;
                            display: -webkit-flex;
                            display: -ms-flexbox;
                            display: flex;
                            min-height: 100vh;
                            -webkit-box-orient: vertical;
                            -webkit-box-direction: normal;
                            -webkit-flex-direction: column;
                            -ms-flex-direction: column;
                            flex-direction: column;
                        }

                              .main {
                                  -webkit-box-flex: 1;
                                  -webkit-flex: 1 0 auto;
                                  -ms-flex: 1 0 auto;
                                  flex: 1 0 auto;
                              }*/
.page-footer {
  /*background-color: gray;*/
  padding-top: 0px; }

#footer, #footer-unauthenticated {
  bottom: 0px;
  height: 50px;
  right: 0%;
  left: 0%;
  position: fixed !important;
  position: absolute;
  width: 100%;
  top: expression((0-(footer.offsetHeight)+
 (document.documentElement.clientHeight?
 document.documentElement.clientHeight:
 document.body.clientHeight)+(ignoreMe=document.documentElement.scrollTop?
 document.documentElement.scrollTop:document.
 body.scrollTop))+'px');
  /*text-align: center;*/
  visibility: visible;
  z-index: 2; }

/* end sticky footer */
.save-button-bar.row {
  margin-top: -1.5rem; }

/* KDA change offset for fixed parameter on slide out side nav */
header[id="header"], main[id="main"], footer[id="footer"] {
  padding-left: 270px; }

/*@media only screen and (min-width : 360px) {
    nav .brand-logo {
        font-size: 1rem;
    }
}

@media only screen and (min-width : 480px) {
    nav .brand-logo {
        font-size: 1.4rem;
    }
}

@media only screen and (min-width : 640px) {
    nav .brand-logo {
        font-size: 1.8rem;
    }
}


@media only screen and (min-width : 992px) {
    nav .brand-logo {
        font-size: 2.1rem;
    }
}*/
@media only screen and (min-width: 360px) {
  nav .brand-logo {
    font-size: 1.7rem;
    display: inline-flex; } }

@media only screen and (min-width: 480px) {
  nav .brand-logo {
    font-size: 1.9rem;
    display: inline-flex; } }

@media only screen and (min-width: 640px) {
  nav .brand-logo {
    font-size: 2.1rem;
    display: inline-flex; } }

@media only screen and (min-width: 992px) {
  nav .brand-logo {
    font-size: 2.1rem;
    display: inline-flex; } }

@media only screen and (max-width: 992px) {
  header[id="header"], main[id="main"], footer[id="footer"] {
    padding-left: 0; }
  .sideNavHeader {
    height: 160px; }
  nav {
    padding-right: 0px; }
  nav ul li {
    float: right; }
  .content {
    padding-left: 0px; }
  /*nav .brand-logo {
        font-size: 1.8rem;
    }*/ }

.sidenav li > a > i.material-icons {
  margin-right: 8px; }

/* alert text styling for data entry field validation errors */
.alert {
  font-size: 16px;
  font-weight: 600;
  background-color: pink;
  padding: 5px; }

.alert-danger {
  color: red; }

/* for netcore validation summary box */
.validation-summary-valid {
  display: none; }

/* Styles for charge pages */
.hanging {
  display: block;
  padding-left: 2.3em;
  text-indent: -1.1em; }

.check-mark {
  vertical-align: bottom;
  margin-right: 8px; }

.subscriptionBackground {
  background-color: #f5f5f5; }

.collapsible {
  border: 1px solid #fcfcfc; }

.collapsible-header {
  border: 1px solid #fcfcfc; }

.collapsible-body {
  border: 1px solid #fcfcfc; }

.subscriptionBackground {
  background-color: #f5f5f5; }

/* styles for Dashboard pages */
.start-date-wrapper {
  top: 6px;
  position: relative; }

.time-span-wrapper {
  margin-top: 1.4rem; }

.card.small {
  height: 350px; }

.card.small.xsmall {
  height: 200px; }

.card-usage-summary {
  min-height: 340px; }

.inline-icon {
  vertical-align: middle;
  font-size: 2em; }

li.faq-link {
  padding-bottom: 5px; }

.wk-faq-background {
  background-color: #FFCB9A; }

.faq-link-heading {
  font-size: 1.64rem;
  font-weight: 400;
  line-height: 110%;
  margin: 1.09333rem 0 0.656rem 0; }

.faq-link {
  color: black;
  font-size: 1.1rem;
  font-weight: 400; }

a:hover.faq-link {
  color: #D9B08C; }

.resp-table {
  width: 100%;
  display: table;
  border-collapse: collapse; }

.resp-table-body {
  display: table-row-group; }

.resp-table-row {
  display: table-row;
  border-bottom: solid;
  border-bottom-color: #ddd;
  border-bottom-width: 1px; }

.table-body-cell {
  display: table-cell; }

/* Reporting CSS */
.report-selector-label {
  font-size: 1.64rem;
  color: rgba(0, 0, 0, 0.87); }

/* on mobile, this lower z-index allows the left side bar to float over the plot.ly modebar (which now i have disabled) */
.modebar {
  z-index: 1 !important; }

/* materializecss bug on tab scroll bar */
.indicator {
  visibility: hidden !important;
  display: none !important; }

.xsmall {
  height: 250px !important; }

/* is this used anywhere? */
.datepicker-modal {
  overflow-y: visible; }

#footer {
  z-index: 10000; }

#header {
  z-index: 10000; }

.preloader-wrapper .circle {
  background-color: white !important; }

.activeBtn {
  background-color: #D9B08C !important; }