body {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  font-family: 'Roboto', sans-serif;
}

main {
  flex: 1 0 auto;
}

.nav-wrapper .fa-bars{
  font-size:25px;
}

h1, h2, h3, h4 {
  color: lightslategray;
}

p { 
  word-break: break-word;
  white-space: normal;
 }
 

.story-text{
  height:90px;
}

.modal.appCreate { width: 45% !important  }

/* div appCreate {
  width: 10%
} */
/* .modal { width: 100% !important  } */

textarea.materialize-textarea{height: 10rem;}

img.ios-appicon {
  max-width:100px;
  border-radius: 25%;
  -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
}

img.android-appicon {
  max-width:100px;
  -webkit-box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
  box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2);
}

img.profilePictureLarge {
  max-width:50px;
  border-radius: 50%;
  border: solid 1px rgb(0, 0, 0);
  padding: 1px;
  margin: 5px 0px;
}

a.black {
  color: #000000;
}

a.black:hover {
  color: lightskyblue;
}

.dash-status{
  text-transform: capitalize;
}

#delete-form{
  display:inline;
}

table.highlight tbody tr:hover {
  background-color: #eee !important;
}

img {
  vertical-align: middle;
}

/* ALERT STYLE START */
.alert-info {
  padding: 20px;
  background-color: #03a9f4;
  color: white;
}

.alert-success {
  padding: 20px;
  background-color: #81c784;
  color: white;
}


.alert-error {
  padding: 20px;
  background-color: #ef5350;
  color: white;
}

.closebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: black;
}
/* ALERT STYLE END */

/* tr :hover {
  background-color: white;
}

tr:hover td {
  background-color: transparent;
} */

/* TABS */

.tabs .tab a{
  background-color: #eceff1;
  color:#90a4ae;
} /*Not selected background color and text color*/

.tabs .tab a:hover {
  background-color:#eceff1;
  color:lightslategray;
} /*Text color on hover */

.tabs .tab a.active {
  background-color:#eceff1;
  color:lightslategray;
} /*Background and text color when a tab is active*/

.tabs .indicator {
  background-color:lightslategray;
} /*Color of underline*/

span.status {
  display: inline;
  padding: .2em .6em .3em;
  font-size: 75%;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: .25em;
}

span.status.green {
  background-color: #43a047;
}

.orange {
  background-color: #ff9800;
  color: #fff
}

span.status.red {
  background-color: #ff5722;
  color: #fff
}

span.status.blue {
  background-color: #2347bc;
  color: #fff
}

span.status.grey {
  background-color: #bdbdbd;
  color: #fff
}

#overlay {
  position: fixed; /* Sit on top of the page content */
  display: none; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5); /* Black background with opacity */
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}

.overlay-text {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 50px;
    color: white;
    user-select: none;
    transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
}

i.title-dropdown {
  font-size: 2rem !important;
}

.dot {
  height: 12px;
  width: 12px;
  border-radius: 50%;
  display: inline-block;
  /* margin-top:5px; */
}

.production {
  background-color: #43a047;
}

.testing {
  background-color: #ff9800;
  color: #fff
}

.new {
  background-color: #2347bc;
  color: #fff
}

.archive {
  background-color: #bdbdbd;
  color: #fff
}

.deleted {
  background-color: #ff5722;
  color: #fff
}


.card.rounded {
  border-radius: 2%;
}