@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url(/fonts/O5pe56LvR8OXax_Q9tUMDg.woff) format('woff');
}
@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 700;
  src: local('PT Sans Bold'), local('PTSans-Bold'), url(/fonts/kTYfCWJhlldPf5LnG4ZnHBsxEYwM7FgeyaSgU71cLG0.woff) format('woff');
}
@font-face {
  font-family: 'PT Sans';
  font-style: italic;
  font-weight: 400;
  src: local('PT Sans Italic'), local('PTSans-Italic'), url(/fonts/GpWpM_6S4VQLPNAQ3iWvVT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}

html, body {
  font-size: 16px;
  height: 100%;
  padding: 0px;
}

.animate {
  -webkit-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1) 0s;
     -moz-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1) 0s;
       -o-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1) 0s;
      -ms-transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1) 0s;
          transition: all 500ms cubic-bezier(0.165, 0.84, 0.44, 1) 0s;
}

.no-wrap {
  white-space: nowrap;
}

.bg-green {
  background: #e1eee5;
}

.bg-blue {
  background: #f1f5f8;
}

.bg-blue-darker {
  background: #e2ebf2;
}

.no-margin {
  margin: 0px !important;
}

.no-padding-left {
  padding-left: 0px !important;
}

.no-padding-l-r {
  padding-left: 0px !important;
  padding-right: 0px !important;
}

.align-c {
  text-align: center;
}

.align-r {
  text-align: right;
}

.align-l {
  text-align: left;
}

.br5 {
  clear: both;
  height: 5px;
  width: 100%;
}

.br10 {
  clear: both;
  height: 10px;
  width: 100%;
}

.br15 {
  clear: both;
  height: 15px;
  width: 100%;
}

.br20 {
  clear: both;
  height: 20px;
  width: 100%;
}

.br30 {
	height: 30px;
	width: 100%;
	clear: both;
}

.br40 {
	height: 40px;
	width: 100%;
	clear: both;
}

.br50 {
	height: 40px;
	width: 100%;
	clear: both;
}

.br60 {
	height: 60px;
	width: 100%;
	clear: both;
}


body > .container {
  /*height: 100%;*/
}

.container {
  width: 100%;
  max-width: 1260px;
  padding: 0px;
}

.form-container {
  position: fixed;
  bottom: 0px;
  width: 100%;
}

  .form-container.showShadow {
    box-shadow: 0 0 30px 30px #e2ebf2;
  }

.chat-container {
/*  height: 100%;
  height: calc(100% - 110px);*/
}

.messages, .users {
/*  height: 100%;*/
}

.messages {
  padding-bottom: 90px;
}

/* */

.sender {
  position: fixed;
  bottom: 0px;
  width: 100%;
}

  .sender .bg-blue {
    border-top: 1px solid #d6e0e8;
  }


.message {
  overflow: hidden;
  clear: both;
  margin-bottom: 2px;
}

  .message .time {
    width: 65px;
    text-align: right;
    margin-right: 7px;
    white-space: nowrap;
    color: gray;
    float: left;
  }
  
  .message .name {
    font-weight: bold;
    float: left;
    padding-right: 7px;
  }

.users {
  padding-left: 0px;
  position: fixed;
  height: calc(100% - 91px);
  top: 15px;
}

.bg {
  position: absolute;
  bottom: 0px;
  left: 0px;
  right: 0px;
  height: 210px;
  
  background: url('../img/city.png') no-repeat 0 bottom;
}
  
  .users .user {
    font-weight: bold;
  }
  
  .users .vk-active, .users .vk-unactive {
    float: left;
    width: 16px;
    height: 16px;
    margin-top: 4px;
    margin-right: 5px;    
  }
  
  .users .vk-active {
    background: url('../img/user-vk-show.png') no-repeat 0 center;
  }
  
  .users .vk-unactive {
    background: url('../img/user-vk-hide.png') no-repeat 0 center;
  }
  
  .users .user-female {
    color: #df42b4;
  }
  
.please-auth {
  background: white;
  padding: 10px;
  padding-top: 13px;
  padding-bottom: 13px;
}

.ln-small {
  line-height: 19px;
}


.show-chat-button, .show-users-button {
  position: fixed;
  right: 15px;
  top: 15px;
  border-radius: 5px;
  z-index: 15;
  display: none;
}

@media screen and (min-width: 768px) {
  .input-md-lg {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px;  
  }
  .btn-md-lg {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px;
  }
}

@media screen and (max-width: 767px) {
  .please-auth {
    font-size: 16px;
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .show-users-list .users {
    left: 15px;
    right: 15px;
    background: #f1f5f8;
    top: 15px;
  }

  .show-users-list {
    overflow: hidden;
  }

  .show-users-list .messages {
    display: none;
  }
  
  .show-users-list .users {
    display: block !important;
    height: 100%;
    left: 0px;
    top: 0px;
    right: 0px;
    padding: 15px;
  }
  .no-padding-right-xs {
    padding-right: 0px !important;
  }
  .margin-left-xs--15 {
    margin-left: -15px !important;
  }
  .padding-right-xs-30 {
    padding-right: 25px !important;
  }
  
  .show-users-button {
    display: block !important;
  }
  
  .messages {
    padding-bottom: 75px;
  }
  
  .show-users-list .show-chat-button {
    display: block !important;
  }

  .show-users-list .show-users-button {
    display: none !important;
  }
  
  .show-users-list .form-container {
    display: none;
  }

}