/**
 * Copyright 2015 Google Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *      http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

html, body {
  font-family: 'Roboto', 'Helvetica', sans-serif;
}
.demo-avatar {
  width: 48px;
  height: 48px;
  border-radius: 24px;
}
.demo-layout .mdl-layout__header .mdl-layout__drawer-button {
  color: rgba(0, 0, 0, 0.54);
}
.mdl-layout__drawer .avatar {
  margin-bottom: 16px;
}
.demo-drawer {
  border: none;
}
/* iOS Safari specific workaround */
.demo-drawer .mdl-menu__container {
  z-index: -1;
}
.demo-drawer .demo-navigation {
  z-index: -2;
}
/* END iOS Safari specific workaround */
.demo-drawer .mdl-menu .mdl-menu__item {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.demo-drawer-header {
  box-sizing: border-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-justify-content: flex-end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 16px;
  height: 100px;
}
.demo-avatar-dropdown {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  -webkit-flex-direction: row;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
}

.demo-navigation {
  -webkit-flex-grow: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.mdl-layout__drawer .mdl-navigation .mdl-navigation__link {
  padding:16px 20px;
}
.demo-layout .demo-navigation .mdl-navigation__link {
  display: -webkit-flex !important;
  display: -ms-flexbox !important;
  display: flex !important;
  -webkit-flex-direction: row;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  color: rgba(255, 255, 255, 0.56);
  font-weight: 500;
}
.demo-layout .demo-navigation .mdl-navigation__link:hover {
  background-color: #F6C95B;
  color: #fff;
}
.demo-navigation .mdl-navigation__link .material-icons {
  font-size: 24px;
  color: rgba(255, 255, 255, 0.56);
  margin-right: 32px;
}

.demo-content {
  max-width: 1080px;
}

.demo-charts {
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}
.demo-chart:nth-child(1) {
  color: #ACEC00;
}
.demo-chart:nth-child(2) {
  color: #00BBD6;
}
.demo-chart:nth-child(3) {
  color: #BA65C9;
}
.demo-chart:nth-child(4) {
  color: #EF3C79;
}
.demo-graphs {
  padding: 16px 32px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-align-items: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
}
/* TODO: Find a proper solution to have the graphs
 * not float around outside their container in IE10/11.
 * Using a browserhacks.com solution for now.
 */
_:-ms-input-placeholder, :root .demo-graphs {
  min-height: 664px;
}
_:-ms-input-placeholder, :root .demo-graph {
  max-height: 300px;
}
/* TODO end */
.demo-graph:nth-child(1) {
  color: #00b9d8;
}
.demo-graph:nth-child(2) {
  color: #d9006e;
}

.demo-cards {
  -webkit-align-items: flex-start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-align-content: flex-start;
      -ms-flex-line-pack: start;
          align-content: flex-start;
}
.demo-cards .demo-separator {
  height: 32px;
}
.demo-cards .mdl-card__title.mdl-card__title {
  color: white;
  font-size: 24px;
  font-weight: 400;
}
.demo-cards ul {
  padding: 0;
}
.demo-cards h3 {
  font-size: 1em;
}
.demo-updates .mdl-card__title {
  min-height: 200px;
  background-image: url('images/dog.png');
  background-position: 90% 100%;
  background-repeat: no-repeat;
}
.demo-cards .mdl-card__actions a {
  color: #00BCD4;
  text-decoration: none;
}

.demo-options h3 {
  margin: 0;
}
.demo-options .mdl-checkbox__box-outline {
  border-color: rgba(255, 255, 255, 0.89);
}
.demo-options ul {
  margin: 0;
  list-style-type: none;
}
.demo-options li {
  margin: 4px 0;
}
.demo-options .material-icons {
  color: rgba(255, 255, 255, 0.89);
}
.demo-options .mdl-card__actions {
  height: 64px;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  box-sizing: border-box;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
}

.demo-card-wide.mdl-card {
  width: 640px;
  min-height: 260px;
}

.mdl-card__actions {
  outline: skyblue solid 5px;
  z-index: 4;
}

.mdl-button {
  margin-left: 10px ;
}


.demo-card-wide > .mdl-card__title {
  color: #fff;
  height: 64px;
  background-color:#CB2E37;
}

.mdl-card__title-text {
  position: relative;
  top: 6px; 
}

.demo-card-wide > .mdl-card__menu {
  color: #fff;
}

.mdl-textfield {
  width: 250px;
  margin-right: 10px;
}

.mdl-button-group { padding-bottom:1rem ; }
.mdl-button-group .mdl-button { margin-left:0; background-color:#CB2E37; color:white;}

a { color:#CB2E37; }
table a { text-decoration:none; color:#666; font-weight:700; }

.pagination-navigation a, .pagination-navigation .last a, .pagination-navigation .next a, .pagination-navigation .first a { text-decoration:none; color:#666; font-weight:700; border-radius:4px; }

.mdl-textfield__error { visibility:visible; }

select {
  font-family: inherit;
  background-color: transparent;
  width: 100%;
  padding: 4px 0;
  font-size: 16px;
  color: rgba(0,0,0, 0.26);
  border: none;
  border-bottom: 1px solid rgba(0,0,0, 0.12);
}

/* Remove focus */
select:focus {
  outline: none;
}

/* Hide label */
.mdl-selectfield label {
  display: none;
}

/* Use custom arrow */
.mdl-selectfield select {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.mdl-selectfield {
  font-family: 'Roboto','Helvetica','Arial',sans-serif;
  position: relative;
}
.mdl-selectfield:after {
  position: absolute;
  top: 0.75em;
  right: 0.5em;
  /* Styling the down arrow */
  width: 0;
  height: 0;
  padding: 0;
  content: '';
  border-left: .25em solid transparent;
  border-right: .25em solid transparent;
  border-top: 0.375em solid rgba(0,0,0, 0.12);
  pointer-events: none;
}

#country-lbl {
  visibility:hidden; display:none;
}

.mdl-data-table
{
  table-layout: fixed;
  width:100%;
}

.mdl-data-table th, td {
  text-align:left !important;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:no-wrap;
}

.center { text-align:center !important; margin:0; padding:0; }


.mdl-card-stepper {
 /* width: 550px; */
  min-height: 0;
  background:#fff;
}

.mdl-card-stepper__supporting-text {
  width: 100%;
  padding: 0;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step {
  width: 25%;
  /* 100 / no_of_steps */
}


/* Begin actual mdl-stepper css styles */

.mdl-stepper-horizontal-alternative {
  display: table;
  width: 100%;
  margin: 0 auto;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step {
  display: table-cell;
  position: relative;
  padding: 24px;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step:hover,
.mdl-stepper-horizontal-alternative .mdl-stepper-step:active {
  background-color: rgba(0, 0, 0, .06);
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step:active {
  border-radius: 15% / 75%;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step:first-child:active {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step:last-child:active {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step:hover .mdl-stepper-circle {
  background-color: #757575;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step:first-child .mdl-stepper-bar-left,
.mdl-stepper-horizontal-alternative .mdl-stepper-step:last-child .mdl-stepper-bar-right {
  display: none;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step .mdl-stepper-circle {
  width: 24px;
  height: 24px;
  margin: 0 auto;
  background-color: #9E9E9E;
  border-radius: 50%;
  text-align: center;
  line-height: 2em;
  font-size: 12px;
  color: white;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step.active-step .mdl-stepper-circle {
  background-color: #CB2E37;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step.step-done .mdl-stepper-circle:before {
  content: "\2714";
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step.step-done .mdl-stepper-circle *,
.mdl-stepper-horizontal-alternative .mdl-stepper-step.editable-step .mdl-stepper-circle * {
  display: none;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step.editable-step .mdl-stepper-circle {
  -moz-transform: scaleX(-1);
  /* Gecko */
  -o-transform: scaleX(-1);
  /* Opera */
  -webkit-transform: scaleX(-1);
  /* Webkit */
  transform: scaleX(-1);
  /* Standard */
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step.editable-step .mdl-stepper-circle:before {
  content: "\270E";
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step .mdl-stepper-title {
  margin-top: 16px;
  font-size: 14px;
  font-weight: normal;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step .mdl-stepper-title,
.mdl-stepper-horizontal-alternative .mdl-stepper-step .mdl-stepper-optional {
  text-align: center;
  color: rgba(0, 0, 0, .26);
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step.active-step .mdl-stepper-title {
  font-weight: 500;
  color: rgba(0, 0, 0, .87);
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step.active-step.step-done .mdl-stepper-title,
.mdl-stepper-horizontal-alternative .mdl-stepper-step.active-step.editable-step .mdl-stepper-title {
  font-weight: 300;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step .mdl-stepper-optional {
  font-size: 12px;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step.active-step .mdl-stepper-optional {
  color: rgba(0, 0, 0, .54);
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step .mdl-stepper-bar-left,
.mdl-stepper-horizontal-alternative .mdl-stepper-step .mdl-stepper-bar-right {
  position: absolute;
  top: 36px;
  height: 1px;
  border-top: 1px solid #BDBDBD;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step .mdl-stepper-bar-right {
  right: 0;
  left: 50%;
  margin-left: 20px;
}

.mdl-stepper-horizontal-alternative .mdl-stepper-step .mdl-stepper-bar-left {
  left: 0;
  right: 50%;
  margin-right: 20px;
}

.mdl-badge[data-badge]:after{
  background:#ff4081;
  color:#fff;
}

.no-stretch { width:14%; }

.take-more { width:30%; }

.pagination-navigation {
  text-align:right; padding:7px 0;
}

.pagination-navigation span.current {
padding:5px 10px;
  display:inline-block;
}

.pagination-navigation a {
    padding:5px 10px;
  display:inline-block;
  border:1px solid #ccc;
  background:#efefef;
  text-decoration:none;
}

.pagination-navigation a:hover { 
  background:#e1e1e1;
}



.license-start { padding:20px; background:#fff; }
.kit-none { background: red; /* For browsers that do not support gradients */
    background: -webkit-linear-gradient(left, #009EE6, #82B753, #FFB1E8); /* For Safari 5.1 to 6.0 */
    background: -o-linear-gradient(right, #009EE6, #82B753, #FFB1E8); /* For Opera 11.1 to 12.0 */
    background: -moz-linear-gradient(right, #009EE6, #82B753, #FFB1E8); /* For Firefox 3.6 to 15 */
    background: linear-gradient(to right, #009EE6, #82B753, #FFB1E8); /* Standard syntax (must be last) */ }
.kit-camo {
  background: red; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(
          left,
          #1b5e20,
          #A88049,
          #212121
  ); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(
          right,
          #1b5e20,
          #A88049,
          #212121
  ); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(
          right,
          #1b5e20,
          #A88049,
          #212121
  ); /* For Firefox 3.6 to 15 */
  background: linear-gradient(
          to right,
          #1b5e20,
          #A88049,
          #212121
  ); /* Standard syntax (must be last) */
}
.kit-black { background:#222; }
.kit-blue { background:#009EE6; }
.kit-cyan { background: rgb(21, 210, 210); }
.kit-green { background:#82B753; }
.kit-lime { background: #b2ff59; }
.kit-grey { background:#BAB4AF; }
.kit-navy { background:#004674; }
.kit-orange { background:#FFAA47; }
.kit-pink { background:#FFB1E8; }
.kit-purple { background:#53246C; }
.kit-yellow { background:#f1e321; }
.kit-red { background:#B80029; }
.kit-white { background:#F4F4F4; color:black !important; }
.selected-colour { border-color:#ccc !important; outline:none !important; }

.license-colour { width:50px; height:50px; border-radius:25px; color:#fff; font-size:11px; font-weight:bold; text-align:center; vertical-align:middle }

.colour-pick { padding:4px 0 10px; }
.colour-picker { border:10px solid #fff; width:80px; height:80px; border-radius:40px; outline:none !important; margin-right:2px; }


.current-page { border-right:7px solid #fff; }

.destructive { background:#B80029!important; }



.mdl-textfield__label, select { color:#666; }

h1:first-of-type,h2:first-of-type,h3:first-of-type,h4:first-of-type,h5:first-of-type,h6:first-of-type { margin:0 0 1rem; }
h1,h2,h3,h4,h5,h6 { margin:1rem 0; }
h2.mdl-card__title-text { margin:0; }

.flash-message {
  border-radius:4px; padding:16px; background:#efefef; font-family:'Roboto','Helvetica','Arial',sans-serif !important;
}
.flash-message.success {
  background:#ceefcb;
}
.flash-message.error {
  background:#f9c9c5;
}

.reports-list { color:#fff; }
.reports-list a { color:#fff; text-decoration:none; }
.reports-list a:hover { text-decoration:underline; }

.mdl-data-table td, .mdl-data-table th { padding:6px 9px; }