/* begin scrollbar */
::-webkit-scrollbar { width: 6px !important; height: 3px!important; }

::-webkit-scrollbar-thumb { height: 50px!important; background-color: #eb3580!important; background-image: linear-gradient(#eb576a, #51bac3); border-radius: 3px!important; }
::-webkit-scrollbar-track {
 -webkit-box-shadow:inset 0 0 6px rgba(0,0,0,.3)
}
/* einde scrollbar */

/* begin left avatar */
.time-morning {
	background: url(../default_images/user_information/time-morning.png) 0 0 repeat-x
}
.time-afternoon {
	background: url(../default_images/user_information/time-afternoon.png) 0 0 repeat-x
}
.time-night {
	background: url(../default_images/user_information/time-night.png) 0 0 repeat-x
}
.peep_avatar_field_preview {
	width: 100px;
	height: 100px;
	position: relative;
	cursor: pointer;
	float: left
}
.peep_avatar_field_preview span {
	width: 20px;
	height: 20px;
	position: absolute;
	right: 2px;
	top: 2px;
	background: url(images/chat_btn_close.png) no-repeat center top;
	cursor: pointer
}
.peep_avatar_field_preview img {
	width: 100px;
	height: 100px
}
.side_block_avatar {
	float: left;
	margin: 0 15px 5px 5px;
	position: relative;
	background-size: 100%
}
.side_block_avatar .peep_avatar {
	width: 42px!important;
	height: 42px!important;
	background: #ddd;
	padding: 4px
}
.side_block_avatar .peep_avatar img {
	width: 42px!important;
	height: 42px!important
}
.peep_greeting {
	position: relative;
	top: 20px;
	left: 0;
	font-size: 11px
}
#greeting_ico {
	width: 50px;
	height: 50px;
	z-index: 9;
	background-size: 100%!important;
	-webkit-background-size: 100%!important;
	-moz-background-size: 100%!important;
	-o-background-size: 100%!important;
	-ms-background-size: 100%!important;
	display: inline-block;
	position: absolute;
	top: 5px
}
.quick-report-side {
	float: left;
	padding: 10px 0;
	width: 100%
}
.quick-report-side>span {
	color: #a6a8b0;
	float: left;
	font-size: 12px;
	width: 100%
}
.quick-report-side>ul {
	display: inline;
	list-style: outside none none;
	margin: 0 -1px;
	padding: 0
}
.quick-report-side>ul>li {
	float: left;
	padding: 0 1px;
	width: 33.334%
}
.quick-report-side>ul>li>div {
	background: #30313e none repeat scroll 0 0;
	float: left;
	margin-top: 16px;
	padding: 11px 0 16px;
	text-align: center;
	width: 100%
}
.quick-report-side div>strong {
	color: #fff;
	float: left;
	font-size: 17px;
	font-weight: 500;
	width: 100%
}
.user-info-wrapper {
	display: block;
	margin: 0 32px;
	margin-bottom: 0;
	margin-left: 17px
}
.user-info-wrapper.sm {
	margin-left: 0;
	background: linear-gradient(rgba(41, 41, 95, .7), rgba(41, 41, 95, .7)), #29295f url(../default_images/user_information/user-info-background.jpg) no-repeat center;
	background-size: cover
}
.user-overlay {
	background: rgba(93, 83, 134, .8)
}
.user-info-wrapper .profile-wrapper {
	border-radius: 100px;
	position: relative
}
.user-info-wrapper .profile-wrapper.sm {
	overflow: visible;
	top: 10px;
	margin-bottom: 10px
}
.user-info-wrapper .profile-wrapper.sm img {
	width: 80px;
	height: 80px;
	border-radius: 5px;
	border-color: #fff
}
.user-info-wrapper .profile-wrapper .availability-bubble {
	height: 16px;
	width: 16px;
	border: 2px solid #30313e;
	position: absolute;
	bottom: 25px;
	right: -15px;
	border-radius: 100px
}
.user-info-wrapper .profile-wrapper .availability-bubble.online {
	background-color: #0aa699
}
.user-info-wrapper .profile-wrapper .availability-bubble.away {
	background-color: #fbb05e
}
.user-info-wrapper .profile-wrapper .availability-bubble.busy {
	background-color: #f35958
}
.user-info-wrapper .profile-wrapper .availability-bubble.offline {
	background-color: #8b91a0
}
.user-info-wrapper .user-info {
	color: #fff;
	display: inline-block;
	float: left;
	margin-left: 35px;
	margin-bottom: 10px
}
.user-info-wrapper .user-info.sm .status {
	margin-bottom: 20px;
	margin-top: 0
}
.user-info-wrapper .user-info .status {
	color: #929fa5;
	font-size: 13px;
	margin-bottom: 10px;
	margin-top: 2px;
	font-weight: 400
}
.user-info-wrapper .user-info .profile {
	float: right;
	display: inline
}
.user-info-wrapper .user-info .btn-set {
	margin-top: 10px
}
.user-info-wrapper .user-info {
	font-size: 18px;
	float: left
}
.user-info-wrapper .user-info .greeting {
	font-size: 19px;
	font-weight: 600;
	position: relative;
	top: 1.5px
}
.user-info-wrapper .user-info a {
	color: #fff
}
.user-info-wrapper .user-info a:hover {
	text-decoration: none
}
.user-info-wrapper .user-info .status-icon {
	margin: 0 5px
}
.user-info-wrapper .user-info .collapse {
	width: 18px;
	height: 18px;
	background-color: #50545c;
	position: absolute;
	right: 15px;
	margin-top: 10px
}
.user-info-wrapper .user-info .collapse i {
	position: relative;
	margin-top: -8px;
	top: -2px;
	left: 3px
}
.user-info-wrapper .user-info .collapse:hover {
	background-color: #000
}
.username2 {
	font-size: 18px;
	font-weight: 700;
	padding: 4px 0
}
.welcome-text {
	margin-top: 10px;
	margin-left: -35px;
	text-align: center;
	padding: 0 10px
}
.greeting_time {
	color: #fff;
	font-weight: 700;
	font-size: 14px
}
.greeting_message {
	color: #fff;
	font-weight: 400;
	font-size: 12px
}
.user_profile_header {
	background: linear-gradient(rgba(38, 1, 50, .7), rgba(38, 1, 50, .9)), rgba(38, 1, 50, .99) url(../default_images/user_information/user-info-background.jpg) no-repeat center;
	background-size: cover;
	position: relative
}
/* einde left avatar */

/* profile shadow */

.shgrad1,
.shback1 {
	box-shadow: #422f99 0 0 20px!important;
	border: 1px solid #422f99
}

.shgrad2,
.shback2 {
	box-shadow: #a80077 0 0 20px!important;
	border: 1px solid #a80077
}

.shgrad3,
.shback3 {
	box-shadow: #000 0 0 20px!important;
	border: 1px solid #000
}

.shgrad4,
.shback4 {
	box-shadow: #4d3e3e 0 0 20px!important;
	border: 1px solid #4d3e3e
}

.shgrad5,
.shback5 {
	box-shadow: #142850 0 0 20px!important;
	border: 1px solid #142850
}

.shgrad6,
.shback6 {
	box-shadow: #00909e 0 0 20px!important;
	border: 1px solid #00909e
}

.shgrad7,
.shback7 {
	box-shadow: #dae1e7 0 0 20px!important;
	border: 1px solid #dae1e7
}

.shgrad8,
.shback8 {
	box-shadow: #ffe0ac 0 0 20px!important;
	border: 1px solid #ffe0ac
}

.shgrad9,
.shback9 {
	box-shadow: #888 0 0 20px!important;
	border: 1px solid #888
}

.shgrad10,
.shback10 {
	box-shadow: #120136 0 0 20px!important;
	border: 1px solid #120136
}

.shgrad11,
.shback11 {
	box-shadow: #f6f578 0 0 20px!important;
	border: 1px solid #f6f578
}

.shgrad12,
.shback12 {
	box-shadow: #862a5c 0 0 20px!important;
	border: 1px solid #862a5c
}

.shgrad13,
.shback13 {
	box-shadow: #eaac9d 0 0 20px!important;
	border: 1px solid #eaac9d
}

.shgrad14,
.shback14 {
	box-shadow: #06623b 0 0 20px!important;
	border: 1px solid #06623b
}

.shgrad15,
.shback15 {
	box-shadow: #f79071 0 0 20px!important;
	border: 1px solid #f79071
}

.shgrad16,
.shback16 {
	box-shadow: #f6acc8 0 0 20px!important;
	border: 1px solid #f6acc8
}

.shgrad17,
.shback17 {
	box-shadow: #af8baf 0 0 20px!important;
	border: 1px solid #af8baf
}

.shgrad18,
.shback18 {
	box-shadow: #584153 0 0 20px!important;
	border: 1px solid #584153
}

.shgrad19,
.shback19 {
	box-shadow: #c1a57b 0 0 20px!important;
	border: 1px solid #c1a57b
}

.shgrad20,
.shback20 {
	box-shadow: #2c003e 0 0 20px!important;
	border: 1px solid #2c003e
}

.shgrad21,
.shback21 {
	box-shadow: #43d8c9 0 0 20px!important;
	border: 1px solid #43d8c9
}

.shgrad22,
.shback22 {
	box-shadow: #95389e 0 0 20px!important;
	border: 1px solid #95389e
}

.shgrad23,
.shback23 {
	box-shadow: #0779e4 0 0 20px!important;
	border: 1px solid #0779e4
}

.shgrad24,
.shback24 {
	box-shadow: #d8345f 0 0 20px!important;
	border: 1px solid #d8345f
}

.shgrad25,
.shback25 {
	box-shadow: #c70039 0 0 20px!important;
	border: 1px solid #c70039
}

.shgrad26,
.shback26 {
	box-shadow: #ff5733 0 0 20px!important;
	border: 1px solid #ff5733
}

.shgrad27,
.shback27 {
	box-shadow: #8566aa 0 0 20px!important;
	border: 1px solid #8566aa
}

.shgrad28,
.shback28 {
	box-shadow: #6983aa 0 0 20px!important;
	border: 1px solid #6983aa
}

.shgrad29,
.shback29 {
	box-shadow: #f8e1f4 0 0 20px!important;
	border: 1px solid #f8e1f4
}

.shgrad30,
.shback30 {
	box-shadow: #97e5ef 0 0 20px!important;
	border: 1px solid #97e5ef
}

.shgrad31,
.shback31 {
	box-shadow: #b9ebcc 0 0 20px!important;
	border: 1px solid #b9ebcc
}

.shgrad32,
.shback32 {
	box-shadow: #5a3f11 0 0 20px!important;
	border: 1px solid #5a3f11
}

.shgrad33,
.shback33 {
	box-shadow: #9c5518 0 0 20px!important;
	border: 1px solid #9c5518
}

.shgrad34,
.shback34 {
	box-shadow: #ffb385 0 0 20px!important;
	border: 1px solid #ffb385
}

.shgrad35,
.shback35 {
	box-shadow: #698474 0 0 20px!important;
	border: 1px solid #698474
}

.shgrad36,
.shback36 {
	box-shadow: #de7119 0 0 20px!important;
	border: 1px solid #de7119
}

.shgrad37,
.shback37 {
	box-shadow: #204051 0 0 20px!important;
	border: 1px solid #204051
}

.shgrad38,
.shback38 {
	box-shadow: #3b6978 0 0 20px!important;
	border: 1px solid #3b6978
}

.shgrad39,
.shback39 {
	box-shadow: #f76a8c 0 0 20px!important;
	border: 1px solid #f76a8c
}

.shgrad40,
.shback40 {
	box-shadow: #fbcffc 0 0 20px!important;
	border: 1px solid #fbcffc
}

.shgrad41,
.shback40 {
	box-shadow: #be79df 0 0 20px!important;
	border: 1px solid #be79df
}

.shgrad42,
.shback40 {
	box-shadow: #cff1ef 0 0 20px!important;
	border: 1px solid #cff1ef
}

.shgrad43,
.shback40 {
	box-shadow: #ffd1bd 0 0 20px!important;
	border: 1px solid #ffd1bd
}

.shgrad44,
.shback40 {
	box-shadow: #9dc6a7 0 0 20px!important;
	border: 1px solid #9dc6a7
}

.shgrad45,
.shback40 {
	box-shadow: #323232 0 0 20px!important;
	border: 1px solid #323232
}


/* Profile colors */

.prograd1,
.pgrad1 {
	background: linear-gradient(to top, #f33, #800000)!important;
	color: white!important
}

.prograd2,
.pgrad2 {
	background: linear-gradient(to top, #f63, #4d1300)!important;
	color: white!important
}

.prograd3,
.pgrad3 {
	background: linear-gradient(to top, #f93, #4d2600)!important;
	color: white!important
}

.prograd4,
.pgrad4 {
	background: linear-gradient(to top, #fc3, #806000)!important;
	color: white!important
}

.prograd5,
.pgrad5 {
	background: linear-gradient(to top, #cc0, #4d4d00)!important;
	color: white!important
}

.prograd6,
.pgrad6 {
	background: linear-gradient(to top, #9c0, #394d00)!important;
	color: white!important
}

.prograd7,
.pgrad7 {
	background: linear-gradient(to top, #59b300, #264d00)!important;
	color: white!important
}

.prograd8,
.pgrad8 {
	background: linear-gradient(to top, #829356, #2b301c)!important;
	color: white!important
}

.prograd9,
.pgrad9 {
	background: linear-gradient(to top, #008000, #001a00)!important;
	color: white!important
}

.prograd10,
.pgrad10 {
	background: linear-gradient(to top, #00e639, #00330d)!important;
	color: white!important
}

.prograd11,
.pgrad11 {
	background: linear-gradient(to top, #00e673, #063)!important;
	color: white!important
}

.prograd12,
.pgrad12 {
	background: linear-gradient(to top, #00e6ac, #004d39)!important;
	color: white!important
}

.prograd13,
.pgrad13 {
	background: linear-gradient(to top, #0cc, #004d4d)!important;
	color: white!important
}

.prograd14,
.pgrad14 {
	background: linear-gradient(to top, #03add8, #013d4b)!important;
	color: white!important
}

.prograd15,
.pgrad15 {
	background: linear-gradient(to top, #36f, #002080)!important;
	color: white!important
}

.prograd16,
.pgrad16 {
	background: linear-gradient(to top, #107896, #073845)!important;
	color: white!important
}

.prograd17,
.pgrad17 {
	background: linear-gradient(to top, #004d99, #66b3ff)!important;
	color: white!important
}

.prograd18,
.pgrad18 {
	background: linear-gradient(to top, #63f, #c6b3ff)!important;
	color: white!important
}

.prograd19,
.pgrad19 {
	background: linear-gradient(to top, #93f, #d9b3ff)!important;
	color: white!important
}

.prograd20,
.pgrad20 {
	background: linear-gradient(to top, #c3f, #ecb3ff)!important;
	color: white!important
}

.prograd21,
.pgrad21 {
	background: linear-gradient(to top, #f3f, #ffb3ff)!important;
	color: white!important
}

.prograd22,
.pgrad22 {
	background: linear-gradient(to top, #f3c, #ff99e6)!important;
	color: white!important
}

.prograd23,
.pgrad23 {
	background: linear-gradient(to top, #f39, #ffb3d9)!important;
	color: white!important
}

.prograd24,
.pgrad24 {
	background: linear-gradient(to top, #f36, #ffb3c6)!important;
	color: white!important
}

.prograd25,
.pgrad25 {
	background: linear-gradient(to top, #40e0d0, #ff8c00, #ff0080)!important;
	color: white!important
}

.prograd26,
.pgrad26 {
	background: linear-gradient(to top, #11998e, #38ef7d)!important;
	color: white!important
}

.prograd27,
.pgrad27 {
	background: linear-gradient(to top, #108dc7, #ef8e38)!important;
	color: white!important
}

.prograd28,
.pgrad28 {
	background: linear-gradient(to top, #fc5c7d, #6a82fb)!important;
	color: white!important
}

.prograd29,
.pgrad29 {
	background: linear-gradient(to top, #fc466b, #3f5efb)!important;
	color: white!important
}

.prograd30,
.pgrad30 {
	background: linear-gradient(to top, #c94b4b, #4b134f)!important;
	color: white!important
}

.prograd31,
.pgrad31 {
	background: linear-gradient(to top, #00f260, #0575e6)!important;
	color: white!important
}

.prograd32,
.pgrad32 {
	background: linear-gradient(to top, #fc4a1a, #f7b733)!important;
	color: white!important
}

.prograd33,
.pgrad33 {
	background: linear-gradient(to top, #22c1c3, #fdbb2d)!important;
	color: white!important
}

.prograd34,
.pgrad34 {
	background: linear-gradient(to top, #7f00ff, #e100ff)!important;
	color: white!important
}

.prograd35,
.pgrad35 {
	background: linear-gradient(to top, #67b26f, #4ca2cd)!important;
	color: white!important
}

.prograd36,
.pgrad36 {
	background: linear-gradient(to top, #ee0979, #ff6a00)!important;
	color: white!important
}

.prograd37,
.pgrad37 {
	background: linear-gradient(to top, #00c3ff, #ffff1c)!important;
	color: white!important
}

.prograd38,
.pgrad38 {
	background: linear-gradient(to top, #fc00ff, #00dbde)!important;
	color: white!important
}

.prograd39,
.pgrad39 {
	background: linear-gradient(to top, #833ab4, #fd1d1d, #fcb045)!important;
	color: white!important
}

.prograd40,
.pgrad40 {
	background: linear-gradient(to top, #43cea2, #185a9d)!important;
	color: white!important
}

.prograd41,
.pgrad41 {
	background: linear-gradient(to top, #bdc3c7, #2c3e50)!important;
	color: white!important
}

.prograd42,
.pgrad42 {
	background: linear-gradient(to top, #373b44, #4286f4)!important;
	color: white!important
}

.prograd43,
.pgrad43 {
	background: linear-gradient(to top, #2980b9, #6dd5fa, #fff)!important;
	color: white!important
}

.prograd44,
.pgrad44 {
	background: linear-gradient(to top, #f09, #493240)!important;
	color: white!important
}

.prograd45,
.pgrad45 {
	background: linear-gradient(to top, #f953c6, #b91d73)!important;
	color: white!important
}

.prograd46,
.pgrad46 {
	background: linear-gradient(to left, #c31432, #240b36)!important;
	color: white!important
}

.prograd47,
.pgrad47 {
	background: linear-gradient(to top, #dd3e54, #6be585)!important;
	color: white!important
}

.prograd48,
.pgrad48 {
	background: linear-gradient(to top, #8360c3, #2ebf91)!important;
	color: white!important
}

.prograd49,
.pgrad49 {
	background: linear-gradient(to top, #544a7d, #ffd452)!important;
	color: white!important
}

.prograd50,
.pgrad50 {
	background: linear-gradient(to top, #009fff, #ec2f4b)!important;
	color: white!important
}

.prograd51,
.pgrad51 {
	background: linear-gradient(to top, #59c173, #a17fe0, #5d26c1)!important;
	color: white!important
}

.prograd52,
.pgrad52 {
	background: linear-gradient(to top, #005aa7, #fffde4)!important;
	color: white!important
}

.prograd53,
.pgrad53 {
	background: linear-gradient(to top, #da4453, #89216b)!important;
	color: white!important
}

.prograd54,
.pgrad54 {
	background: linear-gradient(to top, #ad5389, #3c1053)!important;
	color: white!important
}

.prograd55,
.pgrad55 {
	background: linear-gradient(to top, #a8c0ff, #3f2b96)!important;
	color: white!important
}

.prograd56,
.pgrad56 {
	background: linear-gradient(to top, #333, #dd1818)!important;
	color: white!important
}

.prograd57,
.pgrad57 {
	background: linear-gradient(to top, #108dc7, #ef8e38)!important;
	color: white!important
}

.prograd58,
.pgrad58 {
	background: linear-gradient(to top, #23074d, #cc5333)!important;
	color: white!important
}

.prograd59,
.pgrad59 {
	background: linear-gradient(to top, #fffbd5, #b20a2c)!important;
	color: white!important
}

.prograd60,
.pgrad60 {
	background: linear-gradient(to top, #0f0c29, #302b63, #24243e)!important;
	color: white!important
}

.prograd61,
.pgrad61 {
	background: linear-gradient(to top, #800080, #ffc0cb)!important;
	color: white!important
}

.prograd62,
.pgrad62 {
	background: linear-gradient(to top, #00f260, #0575e6)!important;
	color: white!important
}

.prograd63,
.pgrad63 {
	background: linear-gradient(to top, #667db6, #0082c8, #ec38bc, #fdeff9)!important;
	color: white!important
}

.prograd64,
.pgrad64 {
	background: linear-gradient(to top, #e1eec3, #f05053)!important;
	color: white!important
}

.prograd65,
.pgrad65 {
	background: linear-gradient(to top, #03001e, #7303c0, #ec38bc, #fdeff9)!important;
	color: white!important
}

.prograd66,
.pgrad66 {
	background: linear-gradient(to top, #1a2a6c, #b21f1f, #fdbb2d)!important;
	color: white!important
}

.prograd67,
.pgrad67 {
	background: linear-gradient(to top, #000, #0f9b0f)!important;
	color: white!important
}

.prograd68,
.pgrad68 {
	background: linear-gradient(to top, #36d1dc, #5b86e5)!important;
	color: white!important
}

.prograd69,
.pgrad69 {
	background: linear-gradient(to top, #3a1c71, #d76d77, #ffaf7b)!important;
	color: white!important
}

.prograd70,
.pgrad70 {
	background: linear-gradient(to top, #283c86, #45a247)!important;
	color: white!important
}

.prograd71,
.pgrad71 {
	background: linear-gradient(to top, #ef3b36, #fff)!important;
	color: white!important
}

.prograd72,
.pgrad72 {
	background: linear-gradient(to top, #159957, #155799)!important;
	color: white!important
}

.prograd73,
.pgrad73 {
	background: linear-gradient(to top, #000046, #1cb5e0)!important;
	color: white!important
}

.prograd74,
.pgrad74 {
	background: linear-gradient(to top, #56ccf2, #2f80ed)!important;
	color: white!important
}

.prograd75,
.pgrad75 {
	background: linear-gradient(to top, #eb5757, #000)!important;
	color: white!important
}

.prograd76,
.pgrad76 {
	background: linear-gradient(to top, #20002c, #cbb4d4)!important;
	color: white!important
}

.prograd77,
.pgrad77 {
	background: linear-gradient(to top, #34e89e, #0f3443)!important;
	color: white!important
}

.prograd78,
.pgrad78 {
	background: linear-gradient(to top, #bdc3c7, #2c3e50)!important;
	color: white!important
}

.prograd79,
.pgrad79 {
	background: linear-gradient(to top, #a80077, #6f0)!important;
	color: white!important
}

.prograd80,
.pgrad80 {
	background: linear-gradient(to top, #000, #656565)!important;
	color: white!important
}

#chat_logs_container,#private_content,#chat_right_data {
  scrollbar-width: thin;  /* Firefox */
  scrollbar-color: rgba(var(--white-rgb),.16) transparent;
}
::-webkit-scrollbar {
width: 6px;
height: 6px; }

::-webkit-scrollbar-thumb {
background-color: rgb(220 220 220);
-webkit-box-shadow: inset 1px 1px 0 rgba(0,0,0,0.10),inset 0 -1px 0 rgba(0,0,0,0.07); 
}