.weight-200 {
  font-weight: 200;
}
.weight-600 {
  font-weight: 600 !important;
}
.valign-top {
  vertical-align: top;
}

.opacity-5 {
  opacity: 0.5;
}

.background-gray {
  background: #f7f7f7;
}

.padding-0 {
  padding: 0;
}

#menu-list .item {
  text-align: left;
}
#menu-list .fa {
  width: 35px;
  text-align: center;
}

.no-borders-list {
  border-left: none;
  border-right: none;
}
.no-borders-list .item {
  border-left: none;
  border-right: none;
  background: transparent;
}
.no-borders-list .item:first-child {
  border-top: none;
}

.vertical-middle .scroll {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}
.vertical-middle .scroll-content {
  display: table !important;
  width: 100% !important;
  height: 100% !important;
}

.material-button {
  bottom: 20px;
  right: 20px;
  line-height: 48px;
  border-radius: 500px !important;
  position: fixed;
  min-width: 50px;
  min-height: 50px;
  z-index: 9;
  box-shadow: 0px 1px 1px black;
  font-size: 28px;
  text-align: center;
  cursor: pointer;
  color: white;
}
.material-button.red {
  border-color: rgb(230, 81, 0) !important;
  background-color: rgb(230, 81, 0) !important;
}
.material-button.orange {
  border-color: #ffc900 !important;
  background-color: #ffc900 !important;
}
.material-button.green {
  border-color: #33cd5f !important;
  background-color: #33cd5f !important;
}
.material-button.purple {
  border-color: #886aea !important;
  background-color: #886aea !important;
}
.material-button.light-blue {
  border-color: #11c1f3 !important;
  background-color: #11c1f3 !important;
}
.material-button.blue {
  border-color: #387ef5 !important;
  background-color: #387ef5 !important;
}
.material-button:active {
  opacity: 0.8;
}
.material-button-title {
  position: fixed;
  right: 88px;
  background: white;
  padding: 5px 15px;
  z-index: 99;
  border-radius: 3px;
}

.color-red {
  color: red;
}

.color-lightblue {
  color: rgb(42, 150, 255);
}
.color-blue {
  color: rgb(0, 87, 120);
}
.color-green {
  color: #77b9bb;
}
.color-darkGreen {
  color:green;
}
.color-gray {
  color: #bbb;
}
.color-dark {
  color: #000 !important;
}
.color-white {
  color: white;
}
.color-lightgray {
  color: lightgray;
}
.color-purple {
  color: rgb(110, 40, 119);
}

.cursor-pointer {
  cursor: pointer;
}

.inblock {
  display: inline-block;
}

.vertical-middle .scroll {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
}
.vertical-middle .scroll-content {
  display: table !important;
  width: 100% !important;
  height: 100% !important;
}

.placeholder-white::-webkit-input-placeholder {
  color: white;
}
.placeholder-white:-moz-placeholder {
  color: white;
}
.placeholder-white::-moz-placeholder {
  color: white;
}
.placeholder-white:-ms-input-placeholder {
  color: white;
}

.uppercase {
  text-transform: uppercase;
}

.background {
  background-position: 50% !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

.pre-bootstrap {
  margin: 50px 0;
}
.row {
  display: -webkit-box;
  display: -webkit-flex;
  display: -moz-box;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 5px;
  width: 100%;
}

.col {
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -moz-box-flex: 1;
  -moz-flex: 1;
  -ms-flex: 1;
  flex: 1;
  display: block;
  padding: 5px;
  width: 100%;
}

#message-error {
  position: fixed;
  bottom: 0;
  width: 90%;
  margin: 5%;
  z-index: 99999;
  background: #444;
  padding: 10px;
  text-align: center;
  border-radius: 5px;
  color: white;
  border: 1px solid #559799;
}

.wrapper {
  padding-bottom: 44px;
}
.wrapper.has-bottom {
  padding-bottom: 88px;
}

.col-10 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 10%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 10%;
  -ms-flex: 0 0 10%;
  flex: 0 0 10%;
  max-width: 10%;
}
.col-15 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 15%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 15%;
  -ms-flex: 0 0 15%;
  flex: 0 0 15%;
  max-width: 15%;
}

.col-20 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 20%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 20%;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  max-width: 20%;
}

.col-25 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 25%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 25%;
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
}

.col-33,
.col-34 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 33.3333%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 33.3333%;
  -ms-flex: 0 0 33.3333%;
  flex: 0 0 33.3333%;
  max-width: 33.3333%;
}

.col-40 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 40%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 40%;
  -ms-flex: 0 0 40%;
  flex: 0 0 40%;
  max-width: 40%;
}

.col-50 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 50%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 50%;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
}

.col-60 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 60%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 60%;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
  max-width: 60%;
}

.col-66,
.col-67 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 66.6666%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 66.6666%;
  -ms-flex: 0 0 66.6666%;
  flex: 0 0 66.6666%;
  max-width: 66.6666%;
}

.col-70 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 70%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 70%;
  -ms-flex: 0 0 70%;
  flex: 0 0 70%;
  max-width: 70%;
}

.col-75 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 75%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 75%;
  -ms-flex: 0 0 75%;
  flex: 0 0 75%;
  max-width: 75%;
}

.col-80 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 80%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 80%;
  -ms-flex: 0 0 80%;
  flex: 0 0 80%;
  max-width: 80%;
}

.col-90 {
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 90%;
  -moz-box-flex: 0;
  -moz-flex: 0 0 90%;
  -ms-flex: 0 0 90%;
  flex: 0 0 90%;
  max-width: 90%;
}

@media (max-height: 400px) {
  .vertical-middle .scroll {
    display: block;
  }
  .vertical-middle .scroll-content {
    display: block !important;
  }
}