/* - z-index - */
/* - vjs-default-skin 1000 - */
/* - video info dropdown menu 1098 - */
/* - topbar 1099 - */
/* - sidebars 1199 - */
/* - modal 3299 + 3498-3499 - */
/* - snackbar 3999 - */
/* - chatsidebar 9999 - */
/* - selectize-dropdown 9999 - */
/* - delete-modal 10000 - */


/*=========================
	FONT COLOR
=========================*/
.featured-baner > h2 > span,
aside.sidebar .frnd-meta > a.main-btn2,
.menu-list > li > a i,
.heart-pnts > div > i,
.filter-ajex > li > a:hover,
.filter-ajex > li.active > a,
.view-port > li.active > a,
.pitdate-user > a,
.pitdate-user .save-post.save > i,
.share > a:hover,
.member-des .bottom-meta .main-btn2
{
	color: #21283b;	
}



/*=========================
	BACKGROUND COLOR
=========================*/

.checkbox .check-box::after, .checkbox .check-box::before,
.search-match > form > button,
aside.sidebar .frnd-meta > a.main-btn2:hover,
.sidebar .widget-title:before,
.owl-dot.active::before,
.slider-box > .slider,
.sub-links > .main-btn,
.buttons .main-btn,
.buttons .main-btn2:hover,
.btn-view.btn-load-more:hover,
.member-des .bottom-meta .main-btn,
.member-des .bottom-meta .main-btn2:hover
{
	background: #21283b;
}


/*=========================
	BORDER COLOR
=========================*/
.checkbox .check-box,
aside.sidebar .frnd-meta > a.main-btn2,
.owl-dot,
.select-gender > li.selected,
.buttons .main-btn2,
.member-des .bottom-meta .main-btn2
{
	border-color: #21283b;	
}

/* fix for responsive slideout menu */
.mm-menu {
    background: #21283b;
	color: #e1e1e1;
}
.mm-menu .mm-navbar a, .mm-menu .mm-navbar>* {
	color:#ffffff;
}

/* fix lists */
ul {
    list-style-type:none;
	padding-left:0px;
}

/* fix for nested modals */
.modal:nth-of-type(even) {
    z-index: 3499 !important;
}
.modal-backdrop.show:nth-of-type(even) {
    z-index: 3498 !important;
}
.modal {
    z-index: 3299 !important;
}
.modal-header {
	background-color:#34465d;
	color:#e7e7e7;
}
.modal-body {
	background-color:#060818;
	color:#ffffff;
}
.modal-footer {
	background-color:#34465d;
	color:#e7e7e7;
	padding:0px;
}

/* global page header */
#globalPageHeader .dropdown-menu { background-color: #494949; color: #ccc;}
#globalPageHeader .dropdown-item:focus,#globalPageHeader .dropdown-item:hover  { background-color: #000; color: #fff;}

/* html/thumbnail editor modal - make fullscreen */
.full_modal-dialog {
  width: 98% !important;
  height: 92% !important;
  min-width: 98% !important;
  min-height: 92% !important;
  max-width: 98% !important;
  max-height: 92% !important;
  padding: 0 !important;
}
.full_modal-content {
  height: 99% !important;
  min-height: 99% !important;
  max-height: 99% !important;
}

/* pin for students */
/* pin login */
.mypass-parent input[type="text"] {
            width: 36px;
            height: 38px;
            text-align: center;
            margin: 0 2px;
        }

/* inputs */
input[type=text],input[type=search],input[type=select],input[type=select-multiple],.selectize-control,.form-control {
    background: #282e3e none repeat scroll 0 0;
    background-color: #282e3e;
    border-color: #272f41;
    color: #fff;
}
.pmcradio_disabled{
	background: #282e3e none repeat scroll 0 0;
    border-color: #516288;
    color: #cccccc;
}
.pmcradio_enabled{
	background: #8c6ad2 none repeat scroll 0 0;
    border-color: aqua;
    color: #fff;
}

		
/* responsive mods */
@media screen and (max-width: 990px) {
	#ckcmain {padding-left:60px;padding-right:0px;}
	#settings-nickname {display:none;}
	.bottombar {padding-left:70px;padding-right:0px;}
	.bottombar .allrights {display:none;}
	.dropdowns {position:fixed;top:70px;right:50px;}
	.user-setting {position:fixed;top:70px;right:20px;}
	.dropdowns.languages {max-width:225px;}
	#students_areaofstudy {margin-top:0px;margin-bottom:30px;}
}
@media screen and (min-width: 991px) {
	#ckcmain {padding-left:55px;padding-right:55px;}
	#settings-nickname {display:block;}
	#students_areaofstudy {margin-top:61px;margin-bottom:30px;}
}

/* snackbar/toast */
/* The snackbar - position it at the bottom and in the middle of the screen */
#snackbar {
  visibility: hidden; /* Hidden by default. Visible on click */
  width: 250px; /* Set a default minimum width */
  margin-left: -125px; /* Divide value of min-width by 2 */
  background-color: #333; /* Black background color */
  color: #fff; /* White text color */
  text-align: center; /* Centered text */
  border-radius: 2px; /* Rounded borders */
  padding: 16px; /* Padding */
  position: fixed; /* Sit on top of the screen */
  z-index: 3999; /* Add a z-index if needed */
  left: 50%; /* Center the snackbar */
  bottom: 30px; /* 30px from the bottom */
}
/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
  visibility: visible; /* Show the snackbar */
  /* Add animation: Take 0.5 seconds to fade in and out the snackbar.
  However, delay the fade out process for 2.5 seconds */
  -webkit-animation: fadein 0.5s, fadeout 0.5s 2.5s;
  animation: fadein 0.5s, fadeout 0.5s 2.5s;
}
/* Animations to fade the snackbar in and out */
@-webkit-keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}
@keyframes fadein {
  from {bottom: 0; opacity: 0;}
  to {bottom: 30px; opacity: 1;}
}
@-webkit-keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}
@keyframes fadeout {
  from {bottom: 30px; opacity: 1;}
  to {bottom: 0; opacity: 0;}
}

/* ckc toggle switch */
/* The switch - the box around the slider */
.ckcswitch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.ckcswitch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
.ckcslider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.ckcslider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .ckcslider {
  background-color: #2196F3;
}

input:focus + .ckcslider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .ckcslider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.ckcslider.round {
  border-radius: 34px;
}

.ckcslider.round:before {
  border-radius: 50%;
}


/* right side status head */
.studenthead-circle {
  /* (A) PERCENTAGE WIDTH & BORDER RADIUS */
  width: 100%;
  border-radius: 50%;

  /* (B) BACKGROUND COLOR */ 
  background: #333333;
 
  /* (C) NECESSARY TO POSITION TEXT BLOCK */
  line-height: 0;
  position: relative;
  overflow:hidden;
} 
/* (D) MATCH HEIGHT */
.studenthead-circle::after {
  content: "";
  display: block;
  padding-bottom: 100%;
}
 
/* (E) TEXT BLOCK */
.studenthead-circle-txt {
  /* (E1) CENTER TEXT IN CIRCLE */
  position: absolute;
  bottom: 50%;
  width: 100%;
  text-align: center;
 
  /* (E2) THE FONT - NOT REALLY IMPORTANT */
  font-family: arial, sans-serif;
  font-weight: bold;
}
.studenthead-circle.online {background-color:#CCFF99;}
.studenthead-circle.online.studenthead-circle-txt {color:#33CC00}

/* fix cursor */
a:hover,button:hover {
 cursor:pointer;
}

/* fix modal hiding scrollbar */
.modal-open {
  overflow:hidden;
  overflow-y:scroll;
  padding-right:0 !important;
}

/* chat */
#chaticon {margin-right:20px;}
#chaticon i {color:#757a95;}
#chaticon i.active {color:yellow;}
#chatsidebar {
	position:absolute;
	z-index:9999;
	top:70px;
	right:70px;
	width:300px;
	display:none;
	height:0;
	background-color: rgba(0,0,0,0.3) !important;
	}
#chatsidebar.active {display:block;}
#chatbox{
	width:100%;
	height:100%;
	display:inline-block;
	font-size:15px;
	vertical-align:top;
	
}
.chat{
	margin-top: auto;
	margin-bottom: auto;
}
.chat .card{
	height: 100%;
	width:100%;
	border-radius: 15px !important;
	background-color: rgba(0,0,0,0.8) !important;
}
.chat .msg_card_body{
	overflow-y: auto;
}
.chat .card-header{
	border-radius: 15px 15px 0 0 !important;
	border-bottom: 0 !important;
}
.chat .card-footer{
	border-radius: 0 0 15px 15px !important;
		border-top: 0 !important;
}
.chat .type_msg{
	background-color: rgba(0,0,0,0.3) !important;
	border:0 !important;
	color:white !important;
	height: 60px !important;
	overflow-y: auto;
}
.chat .type_msg:focus{
	box-shadow:none !important;
   outline:0px !important;
}
.chat .attach_btn{
	border-radius: 15px 0 0 15px !important;
	background-color: rgba(0,0,0,0.3) !important;
	border:0 !important;
	color: white !important;
	cursor: pointer;
}
.chat .send_btn{
	border-radius: 0 15px 15px 0 !important;
	background-color: rgba(0,0,0,0.3) !important;
	border:0 !important;
	color: white !important;
	cursor: pointer;
}
.chat .search_btn{
	border-radius: 0 15px 15px 0 !important;
	background-color: rgba(0,0,0,0.3) !important;
	border:0 !important;
	color: white !important;
	cursor: pointer;
}
.chat .img_cont{
		position: relative;
		height: 70px;
		width: 70px;
}
.chat .img_cont_msg{
		height: 40px;
		width: 40px;
}
.chat .user_info{
	margin-top: auto;
	margin-bottom: auto;
	margin-left: 15px;
}
.chat .user_info span{
	font-size: 20px;
	color: white;
}
.chat .user_info p{
font-size: 10px;
color: rgba(255,255,255,0.6);
}
.chat .video_cam{
	margin-left: 50px;
	margin-top: 5px;
}
.chat .video_cam span{
	color: white;
	font-size: 20px;
	cursor: pointer;
	margin-right: 20px;
}
.chat .msg_cotainer{
	margin-top: auto;
	margin-bottom: auto;
	margin-left: 10px;
	border-radius: 25px;
	background-color: #82ccdd;
	padding: 10px;
	position: relative;
}
.chat .msg_cotainer_send{
	margin-top: auto;
	margin-bottom: auto;
	margin-right: 10px;
	border-radius: 25px;
	background-color: #78e08f;
	padding: 10px;
	position: relative;
}
.chat .msg_time{
	width:80%;
	text-align:left;
	bottom: 3px;
	color: rgba(255,255,255,0.5);
	font-size: 10px;
}
.chat .msg_time_send{
	width:80%;
	text-align:right;
	bottom: 3px;
	color: rgba(255,255,255,0.5);
	font-size: 10px;
}
.chat .msg_head{
	position: relative;
	background-color:#34465d;
}
#action_menu_btn{
	position: absolute;
	right: 10px;
	top: 10px;
	color: white;
	cursor: pointer;
	font-size: 20px;
}
.chat .action_menu{
	z-index: 1;
	position: absolute;
	padding: 15px 0;
	background-color: rgba(0,0,0,0.5);
	color: white;
	border-radius: 15px;
	top: 30px;
	right: 15px;
	display: none;
}
.chat .action_menu ul{
	list-style: none;
	padding: 0;
	margin: 0;
}
.chat .action_menu ul li{
	width: 100%;
	padding: 10px 15px;
	margin-bottom: 5px;
}
.chat .action_menu ul li i{
	padding-right: 10px;

}
.chat .action_menu ul li:hover{
	cursor: pointer;
	background-color: rgba(0,0,0,0.2);
}

/* bandwidth chart - chartist*/
.ct-series-a .ct-bar, .ct-series-a .ct-line, .ct-series-a .ct-point, .ct-series-a .ct-slice-donut {
    stroke: #22b4b7;
    stroke-width: 1px;
}
.ct-series-b .ct-bar, .ct-series-b .ct-line, .ct-series-b .ct-point, .ct-series-b .ct-slice-donut {
    stroke: #13d603;
    stroke-width: 1px;
}

/* reports */
.company-posts .position-meta {width:95%;}
.company-posts span {margin-top:2px;}

/* media */
.selectize-dropdown { z-index: 9999 !important; }.ui-datepicker { z-index: 9999 !important; }
.modal-title a{text-decoration:underline overline #cccccc;}
select,#modbox,#catbox {
    max-width: 400px;		
}
select:focus {
    width: auto;
}
/* fileTree */
.fileTreeStyle {
	border-top: solid 1px #BBB;
	border-left: solid 1px #BBB;
	border-bottom: solid 1px #FFF;
	border-right: solid 1px #FFF;
	background: #FFF;
	overflow: scroll;
	padding: 5px;
	max-height:250px;
}
/* videojs */
.video-js-responsive-container.vjs-hd {
    padding-top: 56.25%;
}
.video-js-responsive-container.vjs-sd {
    padding-top: 75%;
}
.video-js-responsive-container {
    width: 100%;
    position: relative;
}
.video-js-responsive-container .video-js {
    height: 100% !important; 
    width: 100% !important;
    position: absolute;
    top: 0;
    left: 0;
}
.vjs-default-skin .vjs-big-play-button {
	z-index:1000;
}
.vjs-icon-circle::before, .video-js .vjs-mouse-display::before, .video-js .vjs-play-progress::before, .video-js .vjs-volume-level::before {
    content: url(https://live.privatemediacloud.com/includes/icons/slider_20_chrome.png);
}
.video-js .vjs-control-bar {
    background-color: rgba(0,0,0,0.3) !important;
    color: #ffffff;
    font-size: 20px
}

/* circleTimer (activity) */
.circleTimer {
    width: 29px;
    color: #000;
    display: inline-block;
    position: relative;
    text-align: center;
    background-color: white; 
}

.circleTimer span {
    position: absolute;
    left: 0;
    width: 100%;
    font-size: 10px;
    font-family: "sans-serif";
    line-height: 30px;
}
.circleTimer canvas {
  vertical-align: top; // without this passing appears at bottom of circle
}

#banpanel {width:100%;}


/* nav color chooser */
.demo-skin-colors {
    border-right:2px solid #fff;
    display:block;
	float:left;
    margin-right:10px;
    vertical-align:middle;
}

.demo-skin-holder .demo-skin-colors:last-child {
	margin-right:0;	
}

.demo-skin-color {
    border:2px solid #fff;
    border-right:0;
    display:block;
    float:left;
    width:16px;
    height:16px;
}

.demo-skin {
	width:269px;
	padding:10px 10px;
	margin-right:8px;
	margin-bottom:2px;
}

.demo-skin-holder .demo-skin:last-child {
	margin-right:0;
}

.demo-skin > b {
	display:block;
	float:left;
	font-weight:normal;
	padding-top:4px;
	font-size:12px;
	line-height:12px;
}

/* modal no scrolling - fit in window */
.modal-body {
    max-height: calc(100vh - 80px);
    overflow-y: auto;
}
/* delete on top */
.delete-modal {
	z-index:10000 !important;
}