/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/*
    Created on : Oct 11, 2017, 11:43:29 AM
    Author     : Madalina
*/

body{
    background-color: #fff;
    color: #000;
    font-size: 18px;
    font-family: 'ABeeZee', sans-serif;
    line-height: 1.3;
    text-align: center;
}
html,
body {
    margin:0;
    padding:0;
    height:100%;
    word-wrap: break-word;
}
span {word-wrap: break-word;}

.admin-app {text-align: left}
.admin-app .table,
.admin-app .data-list .btn{
    font-size: 16px;
}
.admin-app #filters input,
.admin-app #filters .input-group-addon{
    padding: 6px 12px;
}
.admin-app .input-group-addon {
    padding: 0 12px;
}
.admin-app #filters .btn{
    font-size: 12px;
}
.container-navbar-admin { width: 1200px;}
#content {
    padding-top: 100px;
}
.navbar-fixed-bottom .navbar-collapse,
.navbar-fixed-top .navbar-collapse, .pre-scrollable{
    max-height: none;
}
#footer {
    padding: 8px 0;
    width:100%;
    height:auto;
    overflow:hidden;
    position: fixed;
    bottom: 0;
    margin-top: 20px;
    box-shadow:0 0 15px 0 grey;
}
a.disabled {
    pointer-events: none;
}
/* FONT SIZES*/
.font-size-24{
    font-size: 24px;
}
.font-size-20{
    font-size: 20px;
}
.font-size-18{
    font-size: 18px;
}
.font-size-16{
    font-size: 16px;
}
.font-size-14{
    font-size: 14px;
}
/* FONT WEIGHT*/
.font-weight-700{
    font-weight: 700;
}
.font-weight-500{
    font-weight: 500;
}
.font-weight-bold{
    font-weight: 900;
}
.font-italic{
    font-style: italic;
}
/* FONT COLOR*/
.color-white{
    color: #fff;
}
.color-red{
    color: #ff8080;
}
.color-green{
    color: #b1e2b1;
}

.color-red-dark{
    color: #ff5252;
}
.color-green-dark{
    color: #3aaa3a;
}
/*MARGIN & PADDING*/
.margin-auto {margin: auto}
.no-margin-t{margin-top: 0}
.no-margin-b{margin-bottom: 0}
.margin-b-15{margin-bottom: 15px;}
.margin-b-30{margin-bottom: 30px}
.margin-b-5{margin-bottom: 5px;}
.margin-b-8{margin-bottom: 8px;}
.margin-b-150{margin-bottom: 150px;}
.margin-b-15{margin-bottom: 15px;}
.margin-t-15{margin-top: 15px;}
.margin-t-5{margin-top: 5px;}
.margin-t-20{margin-top: 20px;}
.margin-t-30{margin-top: 30px;}
.margin-t-60{margin-top: 60px;}
.margin-lr-5{margin-left: 5px; margin-right: 5px;}
.margin-lr-15{margin-left: 15px; margin-right: 15px;}
.margin-l-5{margin-left: 5px;}
.margin-r-5{margin-right: 5px;}
.padding-tb-10{padding-top: 10px; padding-bottom: 10px;}
.padding-b-5{padding-bottom: 5px;}
.padding-b-40{padding-bottom: 40px;}
.no-padding-left{padding-left: 0}
.no-padding-right{padding-right: 0}
.padding-r-15{padding-right: 15px;}
.padding-l-22{padding-left: 22px;}
.padding-l-30{padding-left: 30px;}
.padding-l-44{padding-left: 44px;}
.padding-t-10{padding-top: 10px;}
.padding-t-30{padding-top: 30px;}

/*CUSTOM NAVBAR*/
.navbar-toggle {
    position: absolute;
    margin-left: 15px;
    padding: 9px 0;
    margin-top: 8px;
    margin-bottom: 8px;
    background-color: transparent;
}
.navbar-default .navbar-toggle{
    border: none;
}
img.navbar-logo{
    width: 170px;
    margin-top: -8px;
}
li img.navbar-logo {
    width: 140px;
    margin-top: 0px;
    padding: 10px 15px;
}
.navbar-default .navbar-toggle .icon-bar{
    background-color: #000;
    width: 26px;
    height: 4px;
}
.navbar-default{
    box-shadow:0 0 15px 0 grey;
    border: none;
    margin-bottom: 45px;
}
.navbar-default .navbar-link {
    color: #000;
    font-size: 20px;
    text-decoration: none;
}
.navbar-default .navbar-link:hover {
    text-decoration: none;
}
.navbar{background-color: #fff !important}
.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {
    background-color: #fff;
}
.navbar-default .navbar-nav>li>a, .navbar-default .navbar-text {
    color: #000000;
}
#btn-hamburger-language.navbar-toggle{
    padding: 0;
    font-size: 24px;
    right: 0;
    top: 0;
}
#btn-hamburger.navbar-toggle {
    left: 0;
}

/*CUSTOM*/
.btn {
    font-size: 20px;
}
.btn-width-full{
    width: 100%
}
.btn-white{
    color: #000;
    border-color: #000;
    background: #fff;
}
.btn-white:hover {
    color: #fff;
    border-color: #000;
    background: #000;
}
.border-dotted{
    border: 1px dashed #ebebeb;
}
.input-group-addon {
    padding: 12px;
}
.app .input-group-addon,
.form-create .input-group-addon,
.form-edit .input-group-addon{
    min-width: 50px;
}
.input-group i,
.input-group input,
input.form-control,
select.form-control,
textarea.form-control{
    font-size: 18px;

}
input.form-control {
    padding: 7px 12px; height: auto;
}
textarea.form-control{
    height: 170px;
}
select.form-control{
    height: 42px;
}
.link-back a{
    color:#000;
}
.ammount.radio-group div.radio{
    padding:10px;
    background-color: #fff;
    border: 1px solid #ccd0d2;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    font-size: 18px;
}
img.washing-machine.active,
img.tumble-dryer.active{
 background-color: #b1e2b1;
}
img.washing-machine.unavailable,
img.tumble-dryer.unavailable{
 background-color: #ff8080;
}
span.active{
    color: #b1e2b1;
    display:inline-block;
    width: 70px;
}
span.unavailable{
    color: #ff8080;
    display:inline-block;
    width: 70px;
}
i.fa-plus{
    padding: 5px;
    font-size: 14px;
    border-radius: 4px;
}
.word-break{
    word-wrap: break-word;
}
.alert-errors{
    color: #a94442;
    background-color: transparent;
}
span.alert-errors{
    padding-top:6px;
    padding-bottom:0;
    margin-bottom: 0;
}
.payment{
    margin-top: 50px;
}
.title {
    font-size: 56px;
}
.table-cell-id{
    width: 10px;
}
.dropdown-menu {
    min-width: 76px;
}
a.active{
    text-decoration-line: underline;
    text-decoration-color: #3097D1;
    text-decoration-skip: ink;
}

a.btn,
td {
    word-wrap: break-word;
    white-space: normal;
}

ul.footer-link a{
    padding: 10px 15px;
    color: #777;
    line-height: 22px;
    display: block;
    position: relative;
    text-decoration: none;
}
ul.footer-link li.active{
    color: #555;
    background-color: #eee;

}

/*WIDTH*/
.width-70{ width: 70px;}
.width-50{ width: 50px;}
.width-full{width: 100%;}
.width-120{width: 120px;}
.width-160{width: 160px;}
.width-205{width: 205px;}
.width-210{width: 210px;}
.width-200{width: 200px;}
.width-180{width: 180px;}
.width-250{width: 250px;}
input.input-sm{
    border-color: rgb(169, 169, 169);
    background-color: #fff;
}
.input-sm,
input.form-control.input-sm {
    font-size: 14px;
}
.ammount-selected {
    background-color: #3097D1!important;
    color: #fff;
}
img.tumble-dryer,
img.washing-machine{border-radius: 15px;}
.table-search{margin-bottom: 0;}
#paypal_overlay{
    background-color:rgba(0, 0, 0, 0.9);
    position:fixed;
    z-index: 1000;
    width:100%;
    height:100%;
    top:0; left:0;
    bottom: 0;
    right: 0;
    overflow: hidden;
    color: #fff;
    text-align: center;
    display:none;
}
#content_overlay{
    height: 100%;
    display: grid;
}
.text-overlay-center{
    margin: auto;
}
.jumbotron div.row.border-top {
    border-top: 1px solid #dddddd
}
.jumbotron p {
    margin: 10px 0;
}
.jumbotron p span {
    font-size: 18px;
}
/*bootstrap suprascrie datetimepicker*/
.bootstrap-datetimepicker-widget.dropdown-menu {
  position: absolute;
  left: 50px;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 160px;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 14px;
  text-align: left;
  list-style: none;
  background-color: #fff;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
  box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}
.bootstrap-datetimepicker-widget.dropdown-menu li a { color: #000 !important; padding:2px 0; display: block; position: relative; }
.bootstrap-datetimepicker-widget.dropdown-menu li a:hover { color: #000 ;}
.bootstrap-datetimepicker-widget table td span:hover { color: #000; background-color: #70BE44}
.bootstrap-datetimepicker-widget table td.active, .bootstrap-datetimepicker-widget table td.active:hover {
    background-color: #70BE44;
    color: #000;
}
.bootstrap-datetimepicker-widget table td.active.today:before {
    border-bottom-color: #000;
    color: #000;
}
.bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
    background: #70BE44;
    color: #000;
}
.bootstrap-datetimepicker-widget table td.day:hover,
.bootstrap-datetimepicker-widget table td.hour:hover,
.bootstrap-datetimepicker-widget table td.minute:hover,
.bootstrap-datetimepicker-widget table td.second:hover {
    background:  #70BE44;
    color: #000;
    cursor: pointer;
}
.bootstrap-datetimepicker-widget table td span.active {
    background-color: #70BE44;
    color: #000;
}
.bootstrap-datetimepicker-widget.dropdown-menu li a.btn{
  margin-right: 0;
  color: #000;
}
.bootstrap-datetimepicker-widget table td.disabled, .bootstrap-datetimepicker-widget table td.disabled:hover {
    background: none;
    color: #777;
    cursor: not-allowed;
}

.maintenance-spinning-div {
    margin-top:80px;
    margin-left:10px;
    position:absolute;
    width:210px;
    height:170px;
    background-color: #ff8080
}

.maintenance-spinning-icon {
    position:absolute;
    font-size:138px;
    margin-top:100px;
    margin-left:30px;
    color: #555
}

.running-by-me-spinning-div {
    margin-top:80px;
    margin-left:10px;
    position:absolute;
    width:210px;
    height:170px;
    background-color: #b1e2b1
}

.running-by-other-spinning-div {
    margin-top:80px;
    margin-left:10px;
    position:absolute;
    width:210px;
    height:170px;
    background-color: #ff8080
}

.running-spinning-icon {
    position:absolute;
    font-size:130px;
    margin-top:100px;
    margin-left:32px;
    color: #555
}
/* flexboxes */

.equalHMWrap {
    justify-content: center;
    flex-wrap: wrap;
}
.eqWrap {
    display: flex;
}
.wrapper {
    min-width: 123px;
    padding: 10px;
    max-width: 123px;
}
.image-bg{
    min-height: 128px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    overflow: auto;
    border-radius: 6px;
    max-height: 128px;
}
.wrapper-spinner{
    height: 88px;
    width: 72px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin: auto;
    margin-top: 1px;
    display: none;
}
.in_use_by_you {
    background-color: #b1e2b1;
}
.in_maintenance{
    background-color: #ff8080;
}
.in_use {
    background-color: #ff8080;
}
.reserved {
    background-color: #f3c5be;
}
.reserved_by_you {
    background-color: #dbf7d8;
}
.wrapper-spinner.in_use {
    background-image: url("/images/arrows.gif");
}
.wrapper-spinner.in_use_by_you {
    background-image: url('/images/arrows.gif');
}
.wrapper-spinner.in_maintenance{
    background-image: url('/images/gear.gif');
}
.details-machine-status {
    width: 95px;
    height: 34px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    /*margin-top: 3px;*/
    font-size: 15px;
    vertical-align: middle;
    color: #fff;
    display: inline-block;
}
.time-remaining{
    background-color: #156d9f;
}
.under-maintenance {
    background-color: #777;
}
.details-machine-status .under-maintenance,
.details-machine-status .time-remaining {
    height: 26px;
    margin-top: 4px;
}
.tumble-dryer{
    background-image: url('/images/dryericon.png');
}
.washing-machine{
    background-image: url('/images/washericon.png');
}
.btn-back {
    padding: 5px 9px;
    border: 1px solid #000;
    border-radius: 5px;
    font-size: 28px;
}
#name_sort {
    width: 150px;
    max-width: 150px;
}
/*tooltip*/
.tooltip-inner {
    max-width: 300px;
}
.column-sort {
    background-color: #e9e9e9;
}
.btn-login-social i{
    font-size: 3.5rem;
}
.btn-login-social {
    display: flex;
}
.btn-facebook {
    background-color: #4267b2;
    border-color: #4267b2;
}
.btn-google {
    background-color: #df4a32;
    border-color: #df4a32;
}
#app-navbar-collapse,
#app-navbar-collapse-language {
    white-space: nowrap;
}
.iti-flag {background-image: url("/images/flags.png");}

@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2 / 1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
    .iti-flag {background-image: url("/images/flags@2x.png");}
}