html, body, .viewport {
  font-family: 'Roboto', sans-serif;
  font-size:16px;
  height:100%;
  margin: 0px;
  padding: 0px;
  width: 100%;
}

/* Toolbar area */

.menu {
  background-color: transparent;
  border: none;
  height: 38px;
  margin: 16px;
  width: 36px;
}

md-toolbar h1 {
  margin: auto;
}

/* Sidenav area */

md-list .md-button {
  color: inherit;
  font-weight: 500;
  font-size: 16px;
  text-align: left;
  width: 100%;
  text-transform: none;
  font-family: 'PT Sans', sans-serif;
}
  md-list .md-button.selected {
    color: #03a9f4;
  }

  md-sidenav  md-list {
    padding: 0px 0px 8px 0px;
  }


/* Primary content area */

 #content {
  overflow: hidden;
}

#content  {
  padding-left: 40px;
  padding-right: 40px;
  padding-top: 5px;
} 

#content .md-button.contact {
  background-color: transparent;
  border: none;
  width: 48px;
  height: 48px;
  margin: 8px auto 16px 0;
  position: absolute;
  top: 10px;
  right: 40px;
}

#content md-icon.avatar {
  margin-top: 10px;
}

#content .md-button.contact > md-icon {
  fill:black;
  width:36px;
  height:36px;
}

md-button.menuBtn > md-icon {
  fill:white;
  width:24px;
  height:24px;
}

#content .md-button.contact:active > md-icon {
  background-color: #dadada;
  border-radius: 75%;
  padding:4px;
  transition: all 100ms ease-out 30ms;
}

#content img {
  display: block;
  height: auto;
  max-width: 500px;
}

/* Utils */

.content-wrapper {
  position: relative;
}

/* Typography support coming in 0.8.0 */

md-toolbar h1 {
  font-size: 1.250em;
  font-weight: 400;
}

.avatar {
  position: relative;
  width: 64px;
  height: 64px;
  border: 1px solid #ddd;
  border-radius: 50%;
  display: inline-block;
  overflow: hidden;
  margin: 0px;
  vertical-align: middle;
  zoom:0.70;
  transform: translateZ(0);
  -webkit-transform: scale(0.70);
  -moz-transform:scale(0.70);
}


md-bottom-sheet  md-icon {
  margin-right:20px;
}

span.name {
  font-weight: bold;
  font-size:1.1em;
  padding-left:5px;
}

.toolbardemoBasicUsage md-toolbar md-icon.md-default-theme {
  color: white; 

}


a {
  text-decoration: none;
}

i {
  vertical-align: middle;
  font-size: 24px;
}

.main-fab {
  position:absolute;
  z-index:20;
  font-size:10px;
  top:60px;
  right:24px;
  transform:scale(.88,.88);
}

.md-breadcrumb {
  padding-left:88px;  
}

.JCLRgrip:first-child {
  left:105px!important;
  display: none!important;
}

.JColResizer th:first-child {
  width: 105px!important;
}

.md-table {
  min-width: 100%; 
  border-collapse: collapse;
  width: 1200px;
}

.md-table tbody tr:hover, .md-table tbody tr:focus {
  cursor:pointer;
  background-color:rgba(63,81,181,0.2);
}

.md-table-header {
  border-bottom: 1px solid rgb(230,230,230);
  color: rgb(130,130,130);
  text-align: left;
  font-size: 0.8em;
  font-weight: 700;
  padding: 10px 10px 10px 20px;
}

.md-table-header a{
  text-decoration: none;
  color: inherit;
}

.md-table-content {
  white-space: nowrap;
  font-size: 0.8em;
  padding: 1px 1px 1px 0;
  height: 10px;
}

.md-table-td-more {
  max-width:72px;
  width:72px;
  padding:6px;
}

.md-table-thumbs {
  max-width: 104px;
  width: 104px;
  padding: 6px 16px;
}

.md-table-thumbs div {
  overflow:hidden;
  width: 40px;
  height:40px;
  border-radius:20px;
  border: 1px solid rgba(0,0,0,0.2);
  background-size:cover;
  box-shadow: 0 8px 10px rgba(0,0,0,.3);
  -webkit-box-shadow: 0 8px 10px rgba(0,0,0,.1);
}

.md-table-footer {
  height:40px;
  padding-left: 32px;
  padding-right: 32px;
}

.md-table-count-info {
  line-height:40px;
  font-size:.75em;
}

.md-table-footer-item {
  width: 40px;
  height: 40px;
  vertical-align:middle;
}

.md-table-active-page {
  font-weight: 700;
}


.grey {
  color: grey;
}

md-input-container.md-default-theme .md-input {
  color: white;
  border-color: white;
  margin-top: 24px;
}
 
 
 .tabset, .tab-content, .tab-pane, .tabbable {
  height:100%;
}



 
md-content {
  -webkit-flex: 1 1 auto;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  background-color: #f5f5f5 !important;
  -moz-osx-font-smoothing: grayscale;
  padding-left: 2px;
  padding-right: 2px;
}
a {
  text-decoration: none;
  color: rgb(33,150,243);
}
a:hover {
  text-decoration: underline;
  cursor: pointer;
}
input::-webkit-input-placeholder {
  color: rgba(0, 0, 0, 0.26);
  font-weight: 300;
}
input::-moz-placeholder {
  color: rgba(0, 0, 0, 0.26);
  font-weight: 300;
}
input:-ms-input-placeholder {
  color: rgba(0, 0, 0, 0.26);
  font-weight: 300;
}
input::input-placeholder {
  color: rgba(0, 0, 0, 0.26);
  font-weight: 300;
}
md-toolbar,
footer-content {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
footer {
  -webkit-flex: 1 0 auto;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
}
footer > footer-content {
  min-height: 64px;
  padding: 0 16px 16px;
  background-color: #fff;
  color: rgba(0, 0, 0, 0.54);
  font-size: 14px;
}
footer > footer-content > div {
  margin-top: 16px;
}
footer > footer-content > div:not(:last-child) {
  margin-right: 24px;
}
footer > footer-content > div > *:not(span) + *:not(span) {
  margin-left: 24px;
}
md-card {
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  position: relative;
}
.md-button.md-icon-button {
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.md-button.md-icon-button > i {
  margin: auto;
}
md-data-table-toolbar.ng-hide {
  display: none;
}
md-data-table-toolbar.alternate {
  color: #1e88e5;
  background-color: #e3f2fd;
}
md-data-table-toolbar > .md-button.md-icon-button:last-child {
  margin-right: -12px;
}
md-data-table-toolbar > form {
  margin-left: 16px;
}
md-data-table-toolbar > form > input {
  width: 100%;
  margin: 0;
  border: none;
  color: rgba(0, 0, 0, 0.87);
}
md-data-table-toolbar > form > input:focus {
  outline: none;
}

md-dialog {
     border-radius: 0px !important;
    background-color: rgb(255,255,255);
}

md-dialog > md-dialog-content > p {
  margin: 16px 0;
  color: rgba(0, 0, 0, 0.54);
  line-height: 22px;
}
md-dialog > md-dialog-content > p.md-warn {
  color: #f44336;
}
md-dialog > md-dialog-content > form:last-child > md-input-container:last-child {
  padding-bottom: 0;
}
md-dialog > .md-actions > .md-button {
  min-width: 60px;
}
md-dialog[delete-dialog] {
  max-width: 300px;
}
md-dialog[add-item-dialog] > md-dialog-content > form > .input-row {
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}
md-dialog[add-item-dialog] > md-dialog-content > form > .input-row > md-input-container {
  min-width: 120px;
}


.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  color: inherit;
  display: inline-block;
  line-height: 1;
  text-transform: none;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-feature-settings: 'liga';
          font-feature-settings: 'liga';
}
.material-icons.md-18 {
  font-size: 18px;
}
.material-icons.md-36 {
  font-size: 36px;
}
.material-icons.md-48 {
  font-size: 48px;
}
.material-icons.md-dark {
  color: rgba(0, 0, 0, 0.54);
}
.material-icons.md-light {
  color: #ffffff;
}

.bottomSheetdemoBasicUsage .md-inline-list-icon-label {
  display: inline-block;
  padding-left: 10px;
  padding-right: 10px;
  margin-top: -10px;
  height: 24px;
  vertical-align: middle; }

.bottomSheetdemoBasicUsage .md-grid-item-content {
  height: 96px; }

.bottomSheetdemoBasicUsage .md-grid-item-content md-icon {
  height: 48px;
  width: 48px; }

.bottomSheetdemoBasicUsage .md-grid-text {
  padding-bottom: 5px; }

.bottomSheetdemoBasicUsage md-list-item, .bottomSheetdemoBasicUsage md-list-item .md-list-item-inner {
  min-height: 48px; }

.bottomSheetdemoBasicUsage h2 {
  line-height: 36px;
  padding-top: 10px; }

.bottomSheetdemoBasicUsage .md-subheader .md-subheader-inner {
  padding: 0px; }

.bottomSheetdemoBasicUsage md-toast {
  background-color: #B14141; }

.bottomSheetdemoBasicUsage md-toast > * {
  font-weight: bolder; }
.fabSpeedDialdemoMoreOptions .md-fab-top-right {
  top: 16px; }
 
.dialogdemoBasicUsage #popupContainer {
  position: relative; }

.dialogdemoBasicUsage .footer {
  width: 100%;
  text-align: center;
  margin-left: 20px; }

.dialogdemoBasicUsage .footer, .dialogdemoBasicUsage .footer > code {
  font-size: 0.8em;
  margin-top: 50px; }

md-input-container md-icon svg {
  fill: darkcyan;
}
  

.gridList .s64 {
  font-size: 64px; }

.gridList .s32 {
  font-size: 48px; }

.gridList md-icon.fa {
  display: block;
  padding-left: 0; }

.gridList md-icon.s32 span {
  padding-left: 8px; }

.gridList md-grid-list {
  margin: 8px; }


.gridList md-grid-tile {
  transition: all 300ms ease-out 50ms; }

.gridList md-grid-tile md-icon {
  padding-bottom: 2px; 

}

 
.gridList md-grid-tile-footer figcaption {
  width: 100%; }

.gridList md-grid-tile-footer figcaption h3 {
  margin: 0;
  font-weight: 700;
  width: 100%;
  text-align: center; }
   
.gridList .darkBlue {
  background: #80d8ff; }

.gridList .deepBlue {
  background: #448aff; }

.gridList .purple {
  background: #b388ff; }

.gridList .lightPurple {
  background: #8c9eff; }

.gridList .pink {
  background: #ff80ab; }

.gridList md-grid-list {
  margin: 8px; }
.gridList .gray {
  background: #f5f5f5; }
.gridList .green {
  background: #b9f6ca; }
.gridList .yellow {
  background: #ffff8d; }
.gridList .blue {
  background: #84ffff; }
.gridList .purple {
  background: #b388ff; }
.gridList .red {
  background: #ff8a80; }

.gridList md-grid-tile {
  transition: all 400ms ease-out 50ms; }

.gridList padded-content-page {
    padding: 64px 88px;
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: darkgray;
    z-index: -1;
}

.listdemoListControls {
  /* Add some right padding so that the text doesn't overlap the buttons */ }
  .listdemoListControls md-divider {
    margin-top: 10px;
    margin-bottom: 10px; }
  .listdemoListControls md-list-item > p,
  .listdemoListControls md-list-item > .md-list-item-inner > p,
  .listdemoListControls md-list-item .md-list-item-inner > p,
  .listdemoListControls md-list-item .md-list-item-inner > .md-list-item-inner > p {
    -webkit-user-select: none;
    /* Chrome all / Safari all */
    -moz-user-select: none;
    /* Firefox all */
    -ms-user-select: none;
    /* IE 10+ */
    user-select: none;
    /* Likely future */ }
  .listdemoListControls .secondary-button-padding p {
    padding-right: 100px; }



  md-content.md-default-theme {
  background-color: #eee;
}

md-card {
  background-color: #fff;
}
md-card h2:first-of-type {
  margin-top: 0;
}

md-toolbar .md-button.md-default-theme {
  border-radius: 99%;
}

h2 {
  font-weight: 400;
}

.md-toolbar-tools-bottom {
  font-size: small;
}
.md-toolbar-tools-bottom :last-child {
  opacity: 0.8;
}

md-toolbar:not(.md-hue-1),
.md-fab {
  fill: #fff;
}

md-sidenav {
  fill: #737373;
}
md-sidenav ng-md-icon {
  position: relative;
  top: 5px;
}

.user-avatar {
  border-radius: 99%;
}

md-list-item.md-2-line, md-list-item.md-2-line>.md-no-style {
    height: auto;
    min-height: 50px;
}

.buttonspec {
    border: 1px solid orange;
    border-radius: 80%;
}
.buttonspec:hover {
    cursor: pointer;
}

.inset {
    padding: 0px;
}

.avatar-icon{
	width: 36px;
	border-radius: 50%;
	border: 2px solid;
}
.toggled {
	transform: rotate(0deg);
	-webkit-transform: rotate(0deg);
	transition: transform 0.3s ease-in-out;
	-webkit-transition: -webkit-transform 0.3s ease-in-out;
}

.md-toggle-icon{
	transform: rotate(180deg);
	-webkit-transform: rotate(180deg);
	transition: transform 0.3s ease-in-out;
	-webkit-transition: -webkit-transform 0.3s ease-in-out;
}

md-autocomplete[md-floating-label] md-autocomplete-wrap {
    height: auto;
    border: none;
    box-shadow: inherit;
}