.puser_icon.sc .ricon{height:auto;width:23px}
.system_scontent{display:table;margin:auto;background:#fff;padding:8px 19px 8px 8px;border-radius:15px}
.content_sc{display:table-cell;vertical-align:middle}
.syswelcome.bclick{background:red;padding:2px 6px;color:#fff;font-weight:500;border-radius:4px}


.ak_text{height:auto;text-align:center;color:#f0f8ff!important;font-size:11px}.ak_text{text-align:center;color:#daa25e}.overlay-ribbon{position:absolute;width:13em;height:14em;z-index:9999;top:0;right:2%;background:#2ec4b6;padding:5px 0;background-image:-ms-radial-gradient(center top,circle farthest-side,#cbf3f0 0%,#2ec4b6 100%);background-image:-moz-radial-gradient(center top,circle farthest-side,#cbf3f0 0%,#2ec4b6 100%);background-image:-o-radial-gradient(center top,circle farthest-side,#cbf3f0 0%,#2ec4b6 100%);background-image:-webkit-gradient(radial,center top,0,center top,487,color-stop(0,#cbf3f0),color-stop(1,#2ec4b6));background-image:-webkit-radial-gradient(center top,circle farthest-side,#cbf3f0 0%,#2ec4b6 100%);background-image:radial-gradient(circle farthest-side at center top,#cbf3f0 0%,#2ec4b6 100%);-webkit-box-shadow:-5px 21px 28px -4px rgba(0,0,0,0.43);-moz-box-shadow:-5px 21px 28px -4px rgba(0,0,0,0.43);box-shadow:-5px 21px 28px -4px rgba(0,0,0,0.43);-webkit-border-radius:8px;-moz-border-radius:8px;border-radius:8px;animation:slidein 3s ease-in-out forwards}.ribbon-content{z-index:99999;position:relative;margin:0 5px}.ribbon-content h3{margin:0;padding:5px 0 5px 0;line-height:16px;font-family:'Hammersmith One',sans-serif;color:#24505a;text-align:center}.ribbon-content > p,.ribbon-content > p span{color:#24505a;margin:0;padding:0}.ribbon-content p span{display:block}.close-x{position:absolute;top:5px;right:5px;z-index:99}.close-x a:link,.close-x a:visited{background:#2ec4b6;color:#fff;padding:0 4px;font-weight:normal;text-decoration:none}.close-x a:hover{background:#ff9f1c}.overlay-ribbon:before{/* content:""; *//* position:absolute; */bottom:-9em;left:0;width:0;height:0;border-top:10em solid #2ec4b6;border-right:10em solid transparent;z-index:997}.overlay-ribbon:after{/* content:""; */position:absolute;bottom:-9em;right:0;width:0;height:0;border-top:10em solid #2ec4b6;border-left:10em solid transparent;z-index:998}.slideout{animation:slideout 1s ease-in-out forwards}@-webkit-keyframes slidein{from{transform:translate(0,-400px)}to{transform:translate(0,100px)}}@-o-keyframes slidein{from{transform:translate(0,-400px)}to{transform:translate(0,100px)}}@-moz-keyframes slidein{from{transform:translate(0,-400px)}to{transform:translate(0,100px)}}@keyframes slidein{from{transform:translate(0,-400px)}to{transform:translate(0,100px)}}@-webkit-keyframes slideout{from{transform:translate(0,100px)}to{transform:translate(0,-400px)}}@-o-keyframes slideout{from{transform:translate(0,100px)}to{transform:translate(0,-400px)}}@-moz-keyframes slideout{from{transform:translate(0,100px)}to{transform:translate(0,-400px)}}@keyframes slideout{from{transform:translate(0,100px)}to{transform:translate(0,-400px)}}


.whisper { background:#7703bb; color:#fff; }

.whisper2 {background: #7e6d88;color:#fff;}


.level { background:#a10394; color:#fff; }



.xonair {
	background:border-radius:0 15px 0px 15px;
	box-shadow:inset 0 0 46px -5px #58ccd6;
	border:1px solid #3c8965; !important;
  }
  

  .xghost {
	background:rgba(110, 90, 112, 0.61);

}


  
.room-writings-layout {
    position: absolute;
    max-width: 100%;
    overflow-x: hidden;
    left: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    color: #fff;
    padding-bottom: -1px;
    white-space: nowrap;
}

.room-writing {
    display: inline-block;
    background: rgb(0 0 0 / 50%);
    border-radius: 5px;
    font-size: 0.7rem;
    padding: 2px 3px;
    margin-left: 1px;
}

.writing-dot {
    margin-left: 2px;
    display: inline-block;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    margin-right: 0;
    animation: wave_yazanlar 0.8s linear infinite;
}

.writing-dot:nth-child(2) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}

.writing-dot:nth-child(3) {
    -webkit-animation-delay: 0.4s;
    animation-delay: 0.4s;
}

.room-writing .writing-dot {
    background: #fff;
}

@keyframes wave_yazanlar {

    0%,
    100%,
    60% {
        transform: initial
    }

    30% {
        transform: translateY(-5px)
    }
}



  .PCZ_text{float:left;margin-top: 5px;padding: 2px 2px;border:1px solid #000;color:#000;box-shadow:inset 0 0 36px -7px rgb(185, 19, 207);border:2px solid rgb(163, 14, 201);}
  .PCZ_img{margin:2px 2px 0 0;float:left;border:1px solid #ccc}
  @media screen and (max-width:768px){
  .PCZ_music_bot{display:flex!important}
  .PCZ_img{width:30px;
  height:30px;}
  }
  @media screen and (min-width:768px){
  .PCZ_music_bot{display:flex!important}
  .PCZ_img{width:30px;
  height:30px;}
  }
  
  .radiobot .sctable {
	  box-shadow: inset 0 0 36px -7px rgb(9 202 228);
	  border: 2px solid rgb(15, 211, 236);
	  margin-left: 3px;
  }
  
  .radio_log{float:left;margin-top: 5px;padding: 2px 2px;color:rgb(0, 0, 0);box-shadow:inset 0 0 36px -7px rgb(183, 8, 199); border:2px solid  rgb(158, 14, 194);}
  
  
  .anim {
	animation-duration: 2.5s;
	animation-fill-mode: both;
	animation-iteration-count: infinite;
  }
  
  @keyframes bounce {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-30px);}
	60% {transform: translateY(-15px);}
  }
  .bounce {
	animation-name: bounce;
  }
  
  @keyframes flash {
	0%, 50%, 100% {opacity: 1;}
	25%, 75% {opacity: 0;}
  }
  .flash {
	animation-name: flash;
  }
  
  @keyframes pulse {
	0% {transform: scale(1);}
	50% {transform: scale(1.1);}
	100% {transform: scale(1);}
  }
  .pulse {
	animation-name: pulse;
	animation-duration: 1s;
  }
  
  @keyframes rubberBand {
	0% {transform: scale(1);}
	30% {transform: scaleX(1.25) scaleY(0.75);}
	40% {transform: scaleX(0.75) scaleY(1.25);}
	60% {transform: scaleX(1.15) scaleY(0.85);}
	100% {transform: scale(1);}
  }
  .rubberBand {
	animation-name: rubberBand;
  }
  
  @keyframes shake {
	0%, 100% {transform: translateX(0);}
	10%, 30%, 50%, 70%, 90% {transform: translateX(-10px);}
	20%, 40%, 60%, 80% {transform: translateX(10px);}
  }
  .shake {
	animation-name: shake;
  }
  
  @keyframes swing {
	20% {transform: rotate(15deg);}
	40% {transform: rotate(-10deg);}
	60% {transform: rotate(5deg);}
	80% {transform: rotate(-5deg);}
	100% {transform: rotate(0deg);}
  }
  .swing {
	transform-origin: top center;
	animation-name: swing;
  }
  
  @keyframes wobble {
	0% {transform: translateX(0%);}
	15% {transform: translateX(-25%) rotate(-5deg);}
	30% {transform: translateX(20%) rotate(3deg);}
	45% {transform: translateX(-15%) rotate(-3deg);}
	60% {transform: translateX(10%) rotate(2deg);}
	75% {transform: translateX(-5%) rotate(-1deg);}
	100% {transform: translateX(0%);}
  }
  .wobble {
	animation-name: wobble;
  }
  
  @keyframes flip {
	0% {transform: perspective(400px) translateZ(0) rotateY(0) scale(1);animation-timing-function: ease-out;}
	40% {transform: perspective(400px) translateZ(150px) rotateY(170deg) scale(1);animation-timing-function: ease-out;}
	50% {transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);animation-timing-function: ease-in;}
	80% {transform: perspective(400px) translateZ(0) rotateY(360deg) scale(.95);animation-timing-function: ease-in;}
	100% {transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1);animation-timing-function: ease-in;}
  }
  .animated.flip {
	backface-visibility: visible;
	animation-name: flip;
  }
  
  @keyframes lightSpeedIn {
	0% {transform: translateX(100%) skewX(-30deg);opacity: 0;}
	60% {transform: translateX(-20%) skewX(30deg);opacity: 1;}
	80% {transform: translateX(0%) skewX(-15deg);opacity: 1;}
	100% {transform: translateX(0%) skewX(0deg);opacity: 1;}
  }
  .lightSpeedIn {
	animation-name: lightSpeedIn;
	animation-timing-function: ease-out;
  }
  
  @keyframes rollIn {
	0% {opacity: 0;transform: translateX(-100%) rotate(-120deg);}
	100% {opacity: 1;transform: translateX(0px) rotate(0deg);}
  }
  .rollIn {
	animation-name: rollIn;
  }
  
  @keyframes rotateIn {
	0% {transform-origin: center center;transform: rotate(-200deg);opacity: 0;}
	100% {transform-origin: center center;transform: rotate(0);opacity: 1;}
  }
  .rotateIn {
	animation-name: rotateIn;
  }
  
  @keyframes hinge {
	0% {transform: rotate(0);transform-origin: top left;animation-timing-function: ease-in-out;}
	20%, 60% {transform: rotate(80deg);transform-origin: top left;animation-timing-function: ease-in-out;}
	40% {transform: rotate(60deg);transform-origin: top left;animation-timing-function: ease-in-out;}
	80% {transform: rotate(60deg) translateY(0);transform-origin: top left;animation-timing-function: ease-in-out;}
	100% {transform: translateY(700px);}
  }
  .hinge {
	margin: 20px;
	animation-name: hinge;
  }

.boy { border-color:#03add8; }
.girl { border-color:#ff99ff;}
.nosex { border-color:#ccc; }



 .user_item{ border-bottom:1px solid #ededed; }





.inline {
    display: inline !important;
}

.rtl_fright {
    float: right;
}
.azura_log { padding: 5px; border-radius: 20px; background-image:url('https://cutewallpaper.org/21/hd-background-gif/-in-2019-Dark-blue-background-.gif'); background-position: center, center; background-size: auto; color:white; font-size: 15px; font-weight: 700;}


.azuracat_log { padding: 5px; border-radius: 0px; background-image:url('https://cutewallpaper.org/27/blue-and-purple-wallpaper-gif/animated-colored-shapes-2-by-templatezuu-designers-on-dribbble.gif'); background-size: auto; color:#000; font-weight: 700;}
/*.input_wrap {
    background: #2e2c2c;
    border-top: 1px solid #ededed;
}
*/



.input_table {
    overflow: hidden;
    display: table;
    table-layout: fixed;
    width: 100%;
    height: 100%;
}
.levelchat {
    float: left;
    margin-top: 5px;
    padding: 2px 2px;
    border: 1px solid #000;
    color: #000;
    box-shadow: inset 0 0 36px -7px rgb(201 24 147);
    border: 2px solid rgb(243 111 240);
}


@keyframes sm_3600 {
    0% {
        transform: translate3d(0px, 0px, 0px);
    }
    100% {
        transform: translate3d(-3600px, 0px, 0px);
    }
}

@keyframes sm_756 {
    0% {
        transform: translate3d(0px, 0px, 0px);
    }
    100% {
        transform: translate3d(-756px, 0px, 0px);
    }
}

@keyframes sm_3456 {
    0% {
        transform: translate3d(0px, 0px, 0px);
    }
    100% {
        transform: translate3d(-3456px, 0px, 0px);
    }
}

@keyframes sm_1512 {
    0% {
        transform: translate3d(0px, 0px, 0px);
    }
    100% {
        transform: translate3d(-1512px, 0px, 0px);
    }
}

@keyframes sm_1800 {
    0% {
        transform: translate3d(0px, 0px, 0px);
    }
    100% {
        transform: translate3d(-1800px, 0px, 0px);
    }
}

@keyframes sm_960 {
    0% {
        transform: translate3d(0px, 0px, 0px);
    }
    100% {
        transform: translate3d(-960px, 0px, 0px);
    }
}

@keyframes sm_2880 {
    0% {
        transform: translate3d(0px, 0px, 0px);
    }
    100% {
        transform: translate3d(-2880px, 0px, 0px);
    }
}

@keyframes a_1800 {
    100% {
        background-position: -1800px center;
    }
}

@keyframes a_3456 {
    100% {
        background-position: -3456px center;
    }
}

@keyframes sm_3312 {
    0% {
        transform: translate(0px);
    }
    100% {
        transform: translate(-3312px);
    }
}

@keyframes sm_1296 {
    0% {
        transform: translate(0px);
    }
    100% {
        transform: translate(-1296px);
    }
}

@keyframes sm_3168 {
    0% {
        transform: translate(0px);
    }
    100% {
        transform: translate(-3168px);
    }
}

@keyframes sm_612 {
    0% {
        transform: translate(0px);
    }
    100% {
        transform: translate(-612px);
    }
}

@keyframes sm_ {
    0% {
        transform: translate(0px);
    }
    100% {
        transform: translate(-2448px);
    }
}
.nameWave {
    background-size: 200% 100%;
    background-position: 0 0;
    -webkit-animation: nameWave 3s linear infinite normal;
    animation: nameWave 3s linear infinite normal;
}
.clip {
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

@keyframes a_3600 { 100% { background-position: -3600px center;}}
@keyframes a_1800 { 100% { background-position: -1800px center;}}
@keyframes a_720 { 100% { background-position: -720px center;}}

.pcz_logs { padding:6px; word-wrap: break-word; display:table; width:auto; table-layout:fixed; max-width:100%; overflow:hidden; cursor:pointer; }

.pczme {
    color: white;
    margin-top: 4px;
    border-radius: 5px;
    box-shadow: 0 1px 3px rgb(0 0 0 / 12%), 0 1px 2px rgb(0 0 0 / 24%);
    transition: all 0.3s cubic-bezier(.25,.8,.25,1);
}

.state_list { width: 10px; height: 10px;   right:5px; solid #fff; border-radius: 10px; }

.hosgeldiniz{cursor:pointer;color:#fff;background:#ff0404;padding:3px 10px;display:inline-block;line-height:1em;margin-top:2px;border-radius:20px;font-weight:400}

.quiz-msg{color:#b1128b;box-shadow:inset 0 0 8px 1px #b1128b;background:linear-gradient(to bottom,#ffffff 0%,#e6e4e4 50%,#e2e2e2 51%,#eaeaea 100%)!important}

.vipMsg{
    animation: rotate-scale-up-diag-1 4s linear alternate both;
    background:radial-gradient( circle farthest-corner at 48.7% 44.3%,rgb(39 78 143) 0%,rgb(38 76 140) 22.9%,rgb(67 102 160) 76.7%,rgb(87 120 175) 100.2% )!important;
    border:1px dotted white;
    border-radius:25px;
}
.stylePro{
    color:white;
}

.dj-msg{color:#b1128b;
		box-shadow:inset 0 0 8px 1px #b1128b;background:linear-gradient(to bottom,#ffffff 0%,#e6e4e4 50%,#e2e2e2 51%,#eaeaea 100%)!important}

.wc{color:#3a75c4;
	
	padding:4px;
	box-shadow:inset 0 0 8px 1px #760585;background:linear-gradient(to bottom,#ffffff 0%,#ffffff 50%,#ffffff 51%,#ffffff 100%)!important}


.time-morning {
	background: url(https://pakistanichatzone.com/default_images/user_information/time-morning.png) 0 0 repeat-x
}
.time-afternoon {
	background: url(https://pakistanichatzone.com//default_images/user_information/time-afternoon.png) 0 0 repeat-x
}
.time-night {
	background: url(https://pakistanichatzone.com/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(https://pakistanichatzone.com/default_images/wc.svgg) 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, 66, 95, 0.7), rgb(13 119 181 / 70%)), #338fa7 url(https://pakistanichatzone.com/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(10, 101, 161, 0.7), rgba(8, 86, 158, 0.9)), rgba(13, 61, 133, 0.99) url(https://pakistanichatzone.com/default_images/user_information/user-info-background.jpg) no-repeat center;
	background-size: cover;
	position: relative
}

::-webkit-scrollbar { width: 6px !important; height: 6px!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)
}