.img-circle {
    border-radius: 50%;
}

/*------------------------------------------------------------------
[3. Helper Class]
*/


.m-r-10 {margin-right: 10px !important;}
.m-r-15 {margin-right: 15px !important;}

.w-md {min-width: 110px;}
.w-40 {width: 40px;}



/*------------------------------------------------------------------
[6. Header]
*/



.user-img {display: inline-block;position: relative;}
.user-img .status {border: 2px solid #fff;bottom: 0;height: 10px;position: absolute;right: 0;width: 10px;}
.user-menu .user-img .status {bottom: 10px;}
.user-menu .dropdown-menu {min-width: 136px;}
.status {background-color: #ccc;border-radius: 50%;display: inline-block;height: 10px;width: 10px;}
.status.online {background-color: #55ce63;}
.status.offline {background-color: #f62d51;}
.status.away {background-color: #faa937;}

.task-chat-user {
    color: #333;
    font-size: 13px;
}

/*------------------------------------------------------------------
[16. Chat]
*/

.chat-main-row {bottom: 0;left: 0;overflow: auto;padding-bottom: inherit;padding-top: inherit;position: absolute;right: 0;top: 0;}
.chat-main-wrapper {display: table;height: 100%;table-layout: fixed;width: 100%;}
.message-view {display: table-cell;height: 100%;float: none;padding: 0;position: static;vertical-align: top;}
.chat-window {display: table;height: 100%;table-layout: fixed;width: 100%;background-color: #f5f5f5;}
.fixed-header {background-color: #fff;}
.fixed-header .navbar {border: 0 none;margin: 0;min-height: auto;}
.fixed-header .user-info a {color: #76838f;text-transform: uppercase;}
.typing-text {color: #00bf6f;font-size: 12px;text-transform: lowercase;}
.last-seen {color: #a3afb7;display: block;font-size: 12px;}
.custom-menu {margin-top: 6px;}
.custom-menu.navbar-nav > li > a {color: #00bf6f;font-size: 26px;margin-left: 15px;padding: 0;}
.custom-menu.navbar-nav > li > a:hover, .custom-menu.navbar-nav > li > a:focus {background-color:transparent;} 
.custom-menu .dropdown-menu {left: auto;right: 0;}
.search-box {margin-top: 5px;}
.search-box .input-group {background-color: #e6e6e6;border: 1px solid #ddd;border-radius: 50px;}
.search-box .input-group .form-control {background: transparent;border: none;}
.search-box .btn {background-color: transparent;}
.chat-contents {display: table-row;height: 100%;}
.chat-content-wrap {height: 100%;position: relative;width: 100%;}
.chat-wrap-inner {bottom: 0;left: 0;overflow: auto;position: absolute;right: 0;top: 0;}
.chats{}
.chat-body{display:block;margin:10px 0 0;overflow:hidden;}
.chat-body:first-child{margin-top:0}
.chat-right .chat-content{position:relative;display:block;float:right;padding:8px 15px;margin: 0;clear:both;background-color:#e6e6e6;border-radius:20px 2px 2px 20px;max-width: 60%;}
.chat-right .chat-body {padding-left: 48px;padding-right: 10px;}
.chat-bubble {display: block;width: 100%;float: left;margin-bottom:10px;}
.chat.chat-right .chat-bubble:last-child .chat-content {border-bottom-right-radius: 20px;}
.chat.chat-right .chat-bubble:first-child .chat-content {border-top-right-radius: 20px;}
.chat-content > p{margin-bottom:0;word-wrap: break-word;}
.chat-time{color:rgba(0, 0, 0, 0.5);font-size:12px;}
.chat-right .chat-time {text-align: right;}
.chat-line {border-bottom: 1px solid #eaeaea;height: 12px;margin: 7px 0 20px;position: relative;text-align: center;}
.chat-date {background-color: #f5f5f5;color: #000;font-size: 12px;padding: 0 11px;}
.chat-avatar{float:right;}
.chat-avatar .avatar {line-height:30px;height:30px;width:30px;}
.chat-left .chat-avatar{float:left}
.chat-left .chat-body{margin-right:0;margin-left:30px;padding-right: 20px;}
.chat-left .chat-content {background-color: #fff;}
.avatar {background-color: #aaa;border-radius: 50%;color: #fff;display: inline-block;font-weight: 500;height: 38px;line-height: 38px;margin: 0 10px 0 0;overflow: hidden;text-align: center;text-decoration: none;text-transform: uppercase;vertical-align: middle;width: 38px;position:relative;white-space:nowrap;}
.avatar:hover {color:#fff;}
.avatar > img {width: 100%;display:block;}
.chat.chat-left .chat-bubble:first-child .chat-content {border-top-left-radius: 20px;margin-top: 0;}
.chat.chat-left .chat-bubble:last-child .chat-content {border-bottom-left-radius: 20px;}
.chat-left .chat-time{color:#a3afb7}
.attach-list {color: #adb7be;padding: 5px 0 0;line-height: 24px;margin: 0;list-style: none;}
.attach-list i {margin-right: 3px;font-size: 16px;}
.attach-list a {word-wrap: break-word;}
.chat-footer {background-color: #fff;border-top: 1px solid #eaeaea;padding: 15px 0px 0px 0px;}
.message-bar{display:table;height:44px;position:relative;width:100%;}
.message-bar .message-inner{display:table-row;height:100%;padding:0 8px;width:100%;}
.message-bar .link{color:#777;display:table-cell;font-size:20px;padding:0 10px;position:relative;vertical-align:middle;width:30px;}
.message-bar .message-area{display:table-cell;}
.message-area .input-group .form-control {background-color: #fff;border: 1px solid #eaeaea;box-shadow: none;color: #555;display: block;font-size: 14px;height: 44px;margin: 0;padding: 6px 12px;width: 100%;resize: none;}
.message-area .btn {height: 44px;width: 50px;}
.profile-right {display: table-cell;height: 100%;float: none;padding: 0;position: static;vertical-align: top;}
.display-table {display: table;table-layout: fixed;border-spacing: 0;width: 100%;height: 100%;}
.table-row {display: table-row;height: 100%;}
.table-body {position: relative;height: 100%;width: 100%; }
.table-content {bottom: 0;left: 0;overflow: auto;position: absolute;right: 0;top: 0;}
.profile-right-inner {border-left: 1px solid #eaeaea;background-color: #fff;}
.chat-profile-img {padding: 30px;position: relative;text-align: center;}
.edit-profile-img {height: 120px;margin: 0 auto;position: relative;width: 120px;cursor:pointer;}
.change-img {background-color: rgba(0, 0, 0, 0.3);border-radius: 50%;color: #fff;display: none;height: 100%;left: 0;line-height: 120px;position: absolute;top: 0;width: 100%;}
.edit-profile-img:hover .change-img {display: block;}
.edit-profile-img img {height: auto;margin: 0;width: 120px;border-radius: 50%;}
.user-name {color: #333;}
.edit-btn {border-radius: 40px;height: 36px;position: absolute;right: 15px;top: 15px;width: 36px;}
.chat-profile-info {padding:15px;}
.user-det-list {list-style: none;padding: 0;}
.user-det-list > li {padding: 6px 15px;}
.user-det-list .text-muted {color: #888;}
.transfer-files .tab-content {padding-top:0;}
.files-list {list-style: none;padding-left: 0;}
.files-list > li {border-bottom: 1px solid #eaeaea;border-radius: inherit;margin: 2px 0 0;padding: 10px;}
.files-cont {position: relative;}
.file-type {height: 48px;position: absolute;width: 48px;}
.files-icon {background-color: #f3f7f9;border: 1px solid #e4eaec;border-radius: 4px;display: inline-block;height: 38px;line-height: 38px;text-align: center;width: 38px;}
.files-icon i {color: #76838f;font-size: 20px;}
.files-info {padding: 0 30px 0 50px;}
.file-name a {color: #333;}
.files-action {display:none;height: 30px;list-style: none;padding-left: 0;position: absolute;right: 0;text-align: right;top: 10px;width: 30px;}
.files-list > li:hover .files-action {display:block;}
.file-date {color: #888;font-size: 12px;}
.file-author a {color: #00bf6f;font-size: 12px;text-decoration: underline;}
.files-action .dropdown-menu {left: auto;right: 0;}
.chat-img-attach {border-radius: 4px;margin-bottom: 12px;margin-left: 12px;position: relative;float: right;}
.chat-img-attach img {border-radius: 4px;display: inline-block;height: auto;max-width: 100%;}
.chat-placeholder {background: rgba(69, 81, 97, 0.6);border-radius: 4px;color: #fff;display: flex;flex-direction: column;height: 100%;justify-content: flex-end;left: 0;padding: 13px;position: absolute;top: 0;width: 100%;}

.chat-img-name {font-size: 12px;font-weight: 700;line-height: 16px;}
.chat-file-desc {font-size: 11px;}
.chat-right .chat-content.img-content {background-color:transparent;color: #76838f;padding: 0;text-align: right;}
.chat-right .img-content .chat-time {color: #a3afb7;}
.chat-left .chat-img-attach {float: left;}
.chat-left .chat-img-attach {float: left;margin-left: 0;margin-right: 12px;}
.chat-avatar-sm {width:24px;margin-right: 10px;display: inline-block;position: relative;float: left;}
.chat-avatar-sm img {width:24px;}
.chat-avatar-sm.user-img .status {bottom: 4px;right: -3px;}



/*------------------------------------------------------------------
[42. Voice call]
*/

.voice-call-avatar {flex-direction: column;display: flex;align-items: center;justify-content: center;flex: 2;}
.voice-call-avatar .call-avatar {margin: 15px;width: 150px;height: 150px;border-radius: 100%;border: 1px solid rgba(0,0,0,0.1);padding: 3px;background-color: #fff;}
.call-duration {display: inline-block;font-size: 30px;margin-top: 4px;position: absolute;left: 10px;}
.voice-call-avatar .call-timing-count {padding: 5px;}
.voice-call-avatar .username {font-size: 18px;text-transform: uppercase;}
.call-icons {text-align: center;position: relative;}
.call-icons .call-items {border-radius: 5px;padding: 0;	margin: 0px 0px 15px 0px;list-style: none;display:inline-block;}
.call-icons .call-items .call-item {display: inline-block;text-align: center;margin-right: 5px;}
.call-icons .call-items .call-item:last-child {margin-right: 0;}
.call-icons .call-items .call-item a {color: #777;border:1px solid #ddd;width:50px;height:50px;line-height:50px;border-radius:50px;display:inline-block;font-size: 20px;}
.call-icons .call-items .call-item a i {width: 18px;height: 18px; margin: 15px 0px 0px 0px;}
.user-video {bottom: 0;left: 0;overflow: auto;position: absolute;right: 0;top: 0;z-index:10;}
.user-video img {width: auto;max-width: 100%;height: auto;max-height: 100%;display: block;margin: 0 auto;}
.user-video video {width: auto;max-width: 100%;height: auto;max-height: 100%;display: block;margin: 0 auto;}
.my-video {position: absolute;z-index: 99;bottom: 20px;right: 20px;}
.my-video ul {margin: 0;padding: 0;list-style: none;}
.my-video ul li {float: left;width: 120px;margin-right: 10px;}
.my-video ul li img {border:3px solid #fff;border-radius:6px;}
.end-call {position: absolute;top: 7px;right: 10px;}
.end-call a {color: #fff;border-radius: 50px;display: inline-block;background-color: #f06060;padding: 8px 25px;text-transform: uppercase;}
.call-users {position:absolute; z-index:99;bottom:20px;right:20px;}
.call-users ul {margin: 0;padding: 0;list-style: none;}
.call-users ul li {float: left;width: 80px;margin-left: 10px;}
.call-users ul li img {border-radius: 6px;padding: 2px;background-color: #fff;border: 1px solid rgba(0,0,0,0.1);}
.call-mute {width: 80px;height: 80px;background-color: rgba(0, 0, 0, 0.5);position: absolute;display: inline-block;text-align: center;line-height: 80px;border-radius: 6px;font-size: 30px;color: #fff;display:none;top:0;border:3px solid transparent;}
.call-users ul li a:hover .call-mute {display:block;}
.call-details {margin: 10px 0 0px;display: flex;}
.call-info {margin-left: 10px;width: 100%;}


.call-timing {color: #a0a0a2;display: flex;font-size: 14px;margin-top: 1px;overflow: hidden;white-space: pre;}


/*------------------------------------------------------------------
[53. Responsive]
*/

@media only screen and (min-width: 768px) {
	
}
@media (min-width: 992px) and (max-width: 1350px) {
	
}
@media only screen and (max-width: 1199px) {
	
}
@media only screen and (max-width: 991px) {
	
}
@media only screen and (max-width: 767px) {
	
}
@media only screen and (max-width: 479px) {
	.user-menu {display:none;}
	.mobile-user-menu {display:block;}
	.search-box {display:none;}
	.staff-grid-row > .col-xs-6 {width: 100%;}
	.filter-row > .col-xs-6 {width: 100%;}
	.filter-row {margin-bottom: 15px;}
	.page-wrapper > .content {padding: 15px;}
	.profile-view .profile-basic {margin-left: 0;}
	.profile-img-wrap {position:relative;margin:0 auto;}
	.profile-view .profile-img-wrap {margin: 0 auto 10px;height: 100px;width: 100px;}
	.profile-view .profile-img {height: 100px;width: 100px;}
	.profile-view .profile-img .avatar {font-size: 24px;height: 100px;line-height: 100px;margin: 0;width: 100px;}
	.profile-info-left {text-align:center;}
	.profile-basic {margin-left: 0;margin-top: 15px;}
	.page-title {font-size:18px;}
	.fc-toolbar .fc-right {display: inline-block;float: none;margin: 10px auto 0;width: 200px;clear: both;}
	.fc-toolbar .fc-left {float: none;margin: 0 auto;width: 200px;}
	.upload-text {font-size: 18px;}
	.call-duration {display: block;margin-top:0;margin-bottom: 10px;position: inherit;}
	.end-call {margin-top: 10px;position: inherit;}
	.chat-panel .chats {padding: 15px 0;}
	.chat-right .chat-content {max-width:90%;}
	.chat-right .chat-body {padding-left:0;padding-right:0;}
	.chat-left .chat-content {max-width:90%;}
	.chat-left .chat-body {padding-left:0;padding-right:0;}
	.chat-avatar .avatar {height: 20px;line-height: 20px;width: 20px;}
	.account-box {width:100%;margin-bottom: 20px;}
	
}


@media (max-width: 576px){.modal-dialog.modal-dialog-slideout {width: 80%}}

.modal-dialog-slideout {min-height: 100%; margin: 0 0 0 auto;background: #fff;}

.modal.fade .modal-dialog.modal-dialog-slideout {-webkit-transform: translate(100%,0);transform: translate(100%,0);}

.modal.fade.show .modal-dialog.modal-dialog-slideout {-webkit-transform: translate(0,0);transform: translate(0,0);flex-flow: column;}