.video-streams video, .video-streams canvas  {position: relative !important;}
.video-streams > div{ background-color: transparent!important; }

.pip
{
    width: 200px;
    height: 200px;
    position: absolute !important;
    z-index: 10000;
    left: 106px !important;
    top: 158px !important;
}
.sliderRange {
  -webkit-appearance: none;
  width: 100%;
  height: 10px;
  background: #434343;
  outline: none;
  opacity: 0.8;
  -webkit-transition: .2s;
  transition: opacity .2s;
  position: absolute;
  border-radius: 30px;
  right: 0;
  bottom: -5px;
}

.sliderRange:hover {
  opacity: 1;
}

.sliderRange::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 25px;
  height: 25px;
  background: #9b51e0e8;
  cursor: pointer;
  border-radius: 50% !important;
}

.sliderRange::-moz-range-thumb {
  width: 15px;
  height: 15px;
  background: #9b51e0e8;
  cursor: pointer;
  border-radius: 50%;
}

.activity-counter
{
    right: 0;
    position: absolute;
    background: #2F2F2F;
    border: 4px solid #9b51e0;
    border-radius: 20px;
    height: 35px;
    z-index: 99;
}
.activity-counter:hover
{
    cursor: pointer;
}
.activity_list_popup
{
    position: absolute;
	right: 0;
	bottom: 165px;
	
	max-height: calc(100vh - 165px);
    width: 40%;
    margin-bottom: 2px;
	padding: 10px;
	
    border-radius: 8px;
    z-index: 100;
    background-color: #2F2F2F;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.3);
	
	z-index: 99999;
	
	scroll-behavior: smooth;
    
	overflow-y: auto;
}
.script-list
{
    display: inline-block;
	position: relative;
	
	margin: 5px;
    padding: 5px;
    width: 31%;
	
    background: #6F4298;
    border-radius: 10px;
	
	vertical-align: top;
}
#script-video-popup
{
	z-index: 999999;
}
#video_script::-webkit-media-controls-fullscreen-button {
    display: none;
}
.btn-start-recording
{
    opacity: 0.4;
}
.change-reso-msg
{
    margin-left: 10%;
    margin-top: 2%;
}
.remote_resolution {
    color: #000;
    position: absolute;
    top: 15%;
    left: 1%;
    font-weight: bold;
    font-size: 12px;
    z-index: 9;
    background-color: #fff;
    border-radius: 5px;
    padding: 0px 3px;
}
.remote_resolution_host_stream
{
    color: #000;
    position: absolute;
    top: 15%;
    left: 20%;
    font-weight: bold;
    font-size: 12px;
    z-index: 9;
    background-color: #fff;
    border-radius: 5px;
    padding: 0px 3px;
}
.disabled
{
    cursor: default;
    pointer-events: none;
    opacity: 0.5;
}
.custom_resolution
{
    display: block;
}
.fa-circle-o:before
{
    content: "\f05a";
}
.fa-circle-o
{
    color: #fff;
    margin-left: 5px;
    transform: rotate(90deg);
}
.main-flex > .row
{
    width: 100%;
}
.fullVideoBox {
    margin-top: 1px;
    padding: 0px;
    width:70%;
   
}
.fullVideoBox video, .fullVideoBox canvas
{
    border-radius: 10px !important;
	zoom: 1 !important;
}
.rightVideoList {
    margin-top: 1px;
    width:auto;
}
.custom-video-streams {
    height: 100%;
    display: flex;
	position: relative;
    justify-content: center;
	z-index: 20;
}


.custom-video-streams>div {
    text-align: center;
}

/* On-demand video css starts */
.duration{
    font-family: 'Avenir-Black';
    font-size: 15px;
    color: #fff;
    font-weight: normal;
    margin: 0;
    width: 105px;
}

.progress-box {
    display: flex;
    width: 60%;
    justify-content: space-between;
    padding: 0px 30px;
    align-items: center;
    position: absolute;
    /*top: -60px;*/
    left: 10%;
    z-index: 9999;
}

.noautowidth
{
	width: auto !important;
}

.progress-box .video-progress {
    width: 60%; position: relative;
}
.video-progress progress {
    width: 100%;
    height: 10px;
    border-radius: 30px !important;
    overflow: hidden;
}
.video-controls {
    width: 22%;
    display: flex;
    justify-content: center;
    align-items: center;
}
.video-controls > a {
    margin: 0px 7px !important;
}
.video-controls > a:hover, .video-controls > a:focus{ outline:0 !important; text-decoration:none; }
.width-30 {
    width: 30px !important;
}

.duration, .duration > span {
    font-size: 22px !important; 
    padding:0px 5px;
    color: #fff;
}
.progress-box .duration {
    width: 20%;
    display: flex;
    justify-content: flex-start;
    padding-left: 0px;
}
/*.video-progress progress::before {*/
.video-progress .video_slide_width {
    content: '';
    background: #9b51e0e8;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    position: absolute;
    margin-top: -22px;
    margin-left: -6px;
}

progress {
  color: #9b51e0;
  font-size: 12px;
  width: 220px;
  height: 8px;
  border: none;
  margin-right: 10px;
  background: #434343;
  border-radius: 9px;
  vertical-align: middle;
}

progress[value]::-webkit-progress-bar {
  background-color: #434343;
  border-radius: 2px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
}

progress[value]::-webkit-progress-value {
  background-color: #9b51e0;
}

progress[value]::-moz-progress-bar {
  background-color: #9b51e0;
  border-radius: 2px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
}

progress[value]::-moz-progress-value {
  background-color: #9b51e0 !important;
}
/* On-demand video css end */


button.cross_btn {position: absolute;right: 7px;top: -40px;font-size: 19px;background: none;border: none;color:#fff;}
a.rounded_hand {
    border: 1px solid #9b51e0;
    background: none;
    color: #fff;
    padding: 6px 12px 10px;
    margin-left: 11px!important;
}
.visualizer
{
    border: 1px solid #9b51e0;
    width: 175px;
    margin-left: 10px;
}
#virdio_onboarding1 p a
{
    color: white;
    text-decoration: underline;
}
#network-test-counter 
{
    font-size: 25px;
}
#network-test-alert .modal-dialog
{
    max-width: 800px;
}
#media-access-alert .modal-dialog
{
    max-width: 725px;
}
#networkmsg, #virtualmsg
{
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 3;
    opacity: .9;
}
#virtualmsg
{
	top: 110px;
}

.main_view_participant #virtualmsg
{
	z-index: 2;
}

.network-text
{
    position: absolute;
    top: 45px;
    left: 50%;
    transform: translateX(-50%);
    background: #2f2f2f;
    padding: 8px;
    z-index: 999;
    color: white;
    border-radius: 8px;
    font-size: 13px;
}
.no-video-text
{
   display: inline-block;
    z-index: 999;
    color: white;
	vertical-align: middle;
}

.mute-audio
{
    display: inline-block;
    z-index: 999;
    color: white;
	vertical-align: middle;
    background-color: #d417c0;
    padding: 5px;
    border-radius: 25px;
}

.unmute-audio
{
    display: inline-block;
    z-index: 999;
    color: white;
    vertical-align: middle;
    cursor: pointer;
    background-color: #d417c0;
    padding: 5px;
    border-radius: 25px;
}
.unmute-audio img {
    width: 24px;
    height: 24px;
}

.zoom-video .mute-audio
{
	bottom: 90px;
}

.mute-audio img {
    width: 24px;
    height: 24px;
}

.participant_grid_icon{
    position:absolute;
    left: -30px;
}
.bottom-links .dropup .list-group-item
{
    padding: .3rem .5rem .3rem .5rem;
}
.volume_indicator
{
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    border: 1px solid #9b00d2;
    color: white;
    padding: 5px 25px;
    border-radius: 5px;
}
.opacity-zero
{
    opacity: 0;
}

.heartrateg.opacity-zero
{
	pointer-events: none;
}

.order-wine
{
    position: relative;
    z-index: 9999;
}
.bg-green
{
    background-color: seagreen !important
}
.fn-normal
{
	font-weight: normal !important;
}
.stream-bg
{
    background-color: black !important;
    border-radius: 10px;
    overflow: hidden;
}
/*  PARTICIPANT LIST FOR HOST CSS*/

.participant_list_popup .tab-pane
{
    position: relative;
}
.participant_list_popup .tab-pane:before
{
    /*content: "";
    position: absolute;
    right: 110px;
    width: 1px;
    height: 100%;
    background-color: #bd85f2;
    top: 0;*/
}
.participant_list_popup
{
    width: 475px;
    background-color: #9b51e0;
    position: absolute;
    top: 10px;
    /*left: 0px;*/
    z-index: 999;
    border-radius: 10px;
}

.new_pop_top
{
	 top: 130px;
}

.participant_list_popup .nav-tabs .nav-link.active
{
    background-color: #72429f;
    border-radius: 20px;
    font-size: 14px;
}
.participant_list_popup .nav-tabs .nav-link
{
    background-color: transparent;
    color: white;
    padding: 7px 15px;
    border: none;
    font-size: 14px;
    font-family: Avenir-Medium;
    position: relative;
    margin: 0px 15px;       
}
.participant_list_popup .nav-tabs
{
    border-bottom: none;
}
.participant_list_popup .w-18
{
    width: 18px;
}
.participant_list_popup .w-20
{
    width: 20px;
}
.participant_list_popup .tab-content
{
    max-height: 200px;
    overflow-y: auto;
    overflow-x: hidden;
}
.participant_list_popup .tab-content::-webkit-scrollbar {
    width: 3px;
  }
  .participant_list_popup .tab-content::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
  }
  
  .participant_list_popup .tab-content::-webkit-scrollbar-thumb {
    background: #65388f;
  }
.participant_list_popup .tab-content p
{
    font-size: 14px;
}
.participant_list_info
{
    position: absolute;
    top: 119%;
    left: 0;
    width: 100%;
    background-color: #72429f;
    border-radius: 8px;
    z-index: 99;
}
.participant_list_info p
{
    font-size: 14px;
}
.participant_list_info .arrow
{
    position: absolute;
    top: -15px;
    right: 15px;
    width: 0;
    height: 0;
    border-width: 10px;
    border-style: solid;
    border-color: transparent transparent #72429f transparent;

}
.Participant_name_limited_text{
    white-space: nowrap;
    width: 150px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-transform: capitalize;
}
.wine-img-width
{
    max-width: 200px;
    max-height: 200px;
}
#prgs p
{
    margin-bottom: 0;
}
.logo_icon, .session-logo img
{
    max-width: 80px;
    max-height: 75px;
    border-radius: 10px;
}
.purple_color
{
    color: #bd00ff;
}

.purple_back_color
{
    background-color: #bd00ff !important;
}

.white_color
{
    color: #fff;
}

.white_border_right
{
    border-right: 1px solid #ffffff;
}
.white_border
{
    border: 1px solid #ffffff;
    background-color: #9b51e0;
}
.font-12
{
    font-size: 12px !important;
}
.purple_light
{
    color: rgb(209, 76, 255) !important;
}
.aqua_color
{
    color: aqua;
    /*font-weight: bold;*/
}
.remote_emoji_category
{
    border: 1px solid #ffffff;
    background-color: #9b51e0;
    border-radius: 4px;
}
.participant-video-holder
{
    height: 80px;
    background-color: #000;
    border-radius: 5px;
    width: 160px;
    height: 90px;
    overflow: hidden;
}
.participant-video-holder video, .participant-video-holder canvas
{
    top: 0px;
    left: 0px;
    border-radius: 5px;
}
.agora-video-stream>div{
    border-radius:5px;
    border: solid 1px #a9a6a6;
}
button.cross_btn_guest {
    border: 1px solid #928c97;
    background: none;
    color: #fff;
    font-size: 19px;
    padding: 4px 15px 6px;
    border-radius: 10px;
    margin-top: 1px;
    float: right;
    line-height: 24px;}
.no-padding{padding:0;}
.minimize_btn {
    display: none;
}
.audience_selected
{
    background-color: #6e1eb9;
}
.mr-185
{
    margin-right: 185px !important;
}
.badge-pill
{
    transform: translate(-5px,-12px);
    background-color:#f50505;
    color: white;
    padding-left: .5em;
    padding-right: .5em;
    position: absolute;
}

.badge-wrapper-host .badge-pill {
    transform: translate(-14px,-11px);
}

#cart-quantity
{
    position: absolute;
    top: -5px;
    left: 0px;
    background-color: #bd00ff;
    border-radius: 50%;
    padding: 4px 7px;
}
.score_count
{
    position: absolute;
    top: -5px;
    /*left: -20px;*/
    background-color: #bd00ff;
    border-radius: 50%;
    padding: 4px 7px;
}

/* LOADER CSS */
.circle
{
    width:40px;
    height:40px;
    border:5px solid #9b00d2;
    border-top-color:white;
    border-radius: 50%;
    position: relative;
    animation:spin 500ms linear infinite;
    transform:rotate(0deg);
    /* top:45%;
    left:45%;
    z-index: 1; */
}
@keyframes spin{
    from{
        transform:rotate(0deg);
    }
    to{
        transform:rotate(360deg);
    }
}
.click-recoring_gif
{
    position: absolute;
    z-index: 99;
}
.plus-icnn, .minus-icnn
{
    position: absolute;
    bottom: -6px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    /* transform: translateX(-50%); */
    background-color: #212121;
    right: 22px;
}
.new_overflow
{
	overflow: hidden;	
}
.plus-icnn i, .minus-icnn i
{
    color: white;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
}
.joined-membrs
{
    overflow: hidden;
}
.sml-image
{
    width: 22px;
}
.sml-image1
{
    width: 35px;
}
.overlay1
{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(47, 47, 47, 0.7);
    z-index: 9999;
    border-radius: 8px;
}
.mh-150
{
    min-height: 150px;
}
#virdio_step2_2_close p i
{
    vertical-align: middle;
}
.particlecontainer{
    position: fixed;
    top: 200px;
    bottom:0;
    right: 100px;
    margin:auto;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: right;
    width:200px;
    z-index: 99;
    background:transparent;
	pointer-events: none;
}
.particle{
    display: inline-block;
    position: absolute; 
    top: 100%; 
    margin:auto; 
    background-repeat: no-repeat; 
    width:100px;
    height:100px;
    background-color: transparent;
    text-align: center;
}
.particle img
{
    width: 50px;
    height: 50px;
    display: block;
    margin: 5px auto;

}
.particle span.bottomtext
{
    color: black;
    padding: 5px 18px;
    background: white;
    border-radius: 10px;
    display: inline-block;
    margin-top: 0px;
    font-weight: bold;
}
.particle span.toptext
{
    color: white;
    padding: 0px 10px;
    display: inline-block;
    margin-bottom: 5px;
    background: transparent;
    border-radius: 10px;
    font-weight: bold;
    font-size: 30px;
    font-style: italic;
}
.zindex
{
    z-index: 9999 !important;
}
.particlecontainer-host{
    position: fixed;
    left: 0;
    right: 100px;
    margin:auto;
    display: flex;
    justify-content: flex-end;
    align-items: center;
    top:5px;
    background: transparent;
    z-index: 4;
    background-color: red;
}
.remote_video_selected
{
    border: 3px solid #3ce604;
    padding: 2px;
    border-radius: 10px;
}
.remote_emoji_selected
{
    transform: scale(1.6);
    font-weight: bold;
}
.remote_wine_emoji_selected
{
    /* transform: scale(1.1); */
    font-weight: bold;
    background: #939393;
    border-radius: 9px;
}
.remote_maxonscreen_selected
{
    border: 3px solid #3ce604 !important;
    padding: 2px;
    border-radius: 10px !important;
}
.remote_setting_selected
{
    transform: scale(1.2);
    font-weight: bold;
}
.remote_script_selected
{
    transform: scale(1.2);
    font-weight: bold;
}
.remote_camera_selected
{
    transform: scale(1.2);
    font-weight: bold;
}
.particle-host{
    display: inline-block;
    position: absolute; 
    top: 100%; 
    margin:auto; 
    background-repeat: no-repeat; 
    width:100px;
    height:100px;
    background-color: transparent;
    text-align: center;
}
#poor-network
{
   border: 1px solid gray;
    position: absolute;
    padding: 10px;
    top: 10px;
    left: 52%;
    transform: translateX(-50%);
    z-index: 999;
    border-radius: 8px;
}
#poor-network-guest
{
   border: 1px solid gray;
    position: absolute;
    padding: 15px;
    top: -190px;
    left: 55%;
    transform: translateX(-50%);
    /*z-index: 999;*/
    border-radius: 8px;
    background-color: #3f3f3f;
}
.particle-host span.bottomtext
{
    color: black;
    padding: 5px 18px;
    background: white;
    border-radius: 10px;
    display: inline-block;
    /*margin-top: 10px;*/
    font-weight: bold;
}
.particle-host span.toptext
{
    color: white;
    padding: 0px 10px;
    display: inline-block;
    margin-bottom: 0px;
    background: transparent;
    border-radius: 10px;
    font-weight: bold;
    font-size: 30px;
    font-style: italic;
}
.particle-host img
{
    width: 40px;
    height: 40px;
    display: block;
    margin: 5px auto;

}
.text-decoration-none
{
    text-decoration: none !important;
}
.modal-dialog
{
    max-width: 850px;
}
.font-22
{
    font-size: 22px !important;
}
.radio_button_radio .custom-control-input:checked~.custom-control-label::before
{
    color: #fff;
    border-color: white;
    background-color: transparent;
    box-shadow: none;
}
.radio_button_radio .custom-control-label::before
{
    background-color: transparent;
    border: 1px solid white;
}
.radio_button_radio .custom-control-label::before
{
    left: 2rem;
    top: .4rem;
}
.radio_button_radio .custom-control-label::after
{
    left: 2rem;
    top: .4rem;
}
.translatee1
{
    transform: translateY(-8px);
}
.mt--3
{
    margin-top: -3px;
}
.joined-membrs p
{
    font-size: 12px;
    margin-bottom: 0px;
}
.small_image1
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.bg-grayy
{
    background-color: #2a2a2a;
}
.ok_btn_cont
{
    position: absolute;
    bottom: -70px;
    transform: translateX(-50%);
    left: 50%;
}
.inner-containr
{
    display: flex;
}
.inner-containr p
{
    margin-right: 30px;
    margin-bottom: 5px;
}
.h-115
{
    height: 80px !important;
}
.w-80
{
    width: 80%;
}

.w-80.with_cacl 
{
    width: calc(100vw - 400px);
	flex-grow: 0 !important;
}

.ok-btn
{
    padding: 12px 30px;
	margin-left: 0.5rem !important;
	
    background: #E4DAFF;
    color: #6D118C;
	font-family: Poppins;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 28px;
    text-align: center;
    letter-spacing: 0.75px;
	
    border: 2px solid #E4DAFF;
    border-radius: 20px;
    
}
.ok-btn a, .ok-btn-access a
{
    text-decoration: none;
}

.ok-btn-access
{
    padding: 14px 16px;
    background: #9b51e0;
    border: none;
    border-radius: 30px;
    font-size: 19px;
    margin-left: 0.5rem !important;
}

.font-17
{
    font-size: 17px !important;
}
.show-script
{
    position: relative;
    z-index: 999999;
}
.modal.bg-transparent{
    background-color: rgba(0, 0, 0, 0.7) !important;
}
.close.close-btn
{
    color: white;
    opacity: 1;
    font-weight: normal;
    background: #9b00d2;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    font-size: 32px;
    line-height: 2px;
    padding: 0 0 6px 0;
    margin-top: 0px;
    margin-right: -6px;
}
.border-bottm
{
    border-bottom: 1px solid #696969 !important;
}
.bg-trans-red
{
   background: rgb(167, 55, 55,.7) !important;
}
.radius-10
{
    border-radius: 10px !important;
}
.font-14
{
    font-size: 9px;
}
.font-20
{
    font-size: 20px;
}
.font-8
{
    font-size: 8px !important;
}

#agora_local>div
{
    padding-top: 56.25%;
}
 #agora_local video,  #agora_local canvas
{
    position: absolute !important;
    min-width: 100px !important;
    width: 100%;
    height: 100%;    
    top: 0 !important;
    left: 50% !important;
    transform: translateX(-50%) rotateY(180deg) !important;
    object-fit: cover;

}
 /* .video-style
{
    position: absolute !important;
    min-width: 180px !important;
    max-width: 250px !important;
    top: 0 !important;
    left: 50% !important;
    height: auto !important;
    transform: translateX(-50%) !important; 
}  */
.pos-style
{
    bottom: 5px;
    width: 192px;
}

.guest-video {
    border-radius: 10px;
    border: 1px solid #9b51e0;
    background: #000;
    min-height: 435px !important;
}
.zoomHostFull .guest-video {
    min-height: 580px !important;
}
.zoomHostFull .guestfooter .guest-video, .guestfooter .guest-video{ min-height: 0px !important; }
#agora_inject_stream .guest-video {  min-height: 0px !important;}
.guest-video video, .guest-video canvas
{
    border-radius:10px;
}

#video11:before
{
    font-family: 'FontAwesome';
    position: absolute;
    top: 0px;
    left: -5px;
    content: "\f007";
}
.header_btn_cnt
{
    max-width: 70px;
    margin: 0px 10px;
    padding: 0px 5px;
}
.header_btn_cnt
{
    position: relative;
}
.header_btn_cnt:before
{
    content: "";
    position: absolute;
    top: 4px;
    right: -5px;
    height: 30px;
    width: 1px;
    background-color: rgba(181, 181, 181, 0.3);;
    /*z-index: 9999;*/
}
#start-session:before, #startsession1:before, .startsession1:before
{
    display: none;
}
.header_btn_cnt:last-child::before
{
    display: none;
}
.custom_button1
{
    background: transparent;
    border:none;
    padding: 0 !important;
    display: inline-block;
}
.pointer-none
{
    pointer-events: none !important;
}
.height-56
{
    height: 56px;
}
#start-session img, #startsession1 img, .startsession1 img
{
    width: 26px;
}
#start-session, #startsession1, .startsession1
{
    background-color: #9b51e0;
    border-radius: 7px;
    position: relative;
    margin: 0px 5px;
    /* margin-right: 8px; */
    padding-top: 5px;
    padding: 5px 2px;
    margin-right: 5px;
    width: 90px;
	
	cursor: pointer;
}

#mute-unmute-all
{
	cursor: pointer;
}
#start-session .font-14, #startsession1 .font-14, .startsession1 .font-14
{
    font-size: 13px;
}
.custom_button2 img
{
    width: 20px;  
}
.custom_button2
{
    background: transparent;
    border:none;
    padding: 0 !important;
}
.custom_button1 img
{
    width: 20px;
    
}
.d-inherit
{
    display: inherit;
}
.tooltip { pointer-events: none; }
.custom_button
{
    padding: 5px;
    border-radius: 8px;
    background: transparent;
    border:1.5px solid #bd00ff;
    box-sizing: border-box;
    display: inline-block;
    }
.custom_button img
{
    width: 24px;
}
/*  TUTORIAL CSS START*/
.walk-1
{
    position: absolute;
    top: 5px;
    right: 5px;
    /* max-width: 220px; */
    z-index: 9999999999999;
}
.walk-2
{
    position: absolute;
    top: 100%;
    left: 102px;
    max-width: 270px;
    z-index: 9999999999999;
}
.walk-4
{
    position: absolute;
    top: 100%;
    left: 95px;
    width: 70%;
    z-index: 9999999999999;
}
.pop_text
{
    top: -6px;
    left: -7px;
    color: white;
    text-align: center;
    border: 2px solid #9b51e0;
    padding: 4px;
    margin-bottom: 10px;
}
.pop_text img
{
    padding: 5px 10px;
    width: 40px !important;
    background-color: #9b51e0;
    border-radius: 9px 0px 0px 0px;
}
.walk-3
{
    position: absolute;
    top: 100%;
    right: 0;
    max-width: 270px;
    z-index: 9999999999999;
}
.walk-3 .popover2
{
    left: 0;
    max-width: 250px;
}
.walk-1 .time span{
    font-size: 24px;
}
#walk1
{
    top: 16px;
}
#walk3 {
    width: 120px;
    top: -9px;
    left: -5px;
}
#walk3 .popover1
{
    top: 120%;
    left: 0 !important;
    width: 550px;
}
#walk3 .popover1 .arrow_small{
    left: 17px !important;
}

#walk1 .popover1
{
    top: 110%;
    width: 600px;
}
#walk7 .popover1
{
    bottom: 120%;
    width: 290px;
}
#walk7 .popover1 .arrow1
{
    right: 20px;
}
#walk6 .arrow1
{
    left: 20px;
}
.popover2 .arrow_small
{
    left: 17px !important;
}
#walk2
{
    top: 65px;
    right: 113px;
    width: 96px;
}
#walk8
{
    width: 50px;
    top: 66px;
    right: 0px;
}
#walk5
{
    top: 50px;
    left: 0px;
    width: 100%;
    border: 2px solid #9b51e0;
}
#walk5 .small_txt
{
    width: 80%;
}

.participant_img{
    position: relative;
    width: 140px;
    height: 50px;
    background-color: #9b51e0;
}
.small_txt img, .main_pop_text img
{
    width: 20px;
}
.small_txt .group img
{
    width: 49%;
    opacity: .5;
}
/*  PARTICIPANT LIST FOR PARTICIPANT CSS*/

.participant_list_container
{
    min-width: 220px; 
    position: relative;
}
.participant_list_container .user
{
     background-color: rgba(155,81,224,.6);
     padding: 10px;
     cursor: pointer;
}
.participant_list_container .list_container
{
    background-color: rgba(155,81,224,.6);
    max-height: 400px;
    overflow-y: auto;
}
.smily
{
    width: 36px;
    box-sizing: border-box;
    padding: 3px 5px;
    background-color: #6c4b8a;
    border-radius: 5px;
}
.no_emojis
{
    width: 36px;
    box-sizing: border-box;
    padding: 3px 5px;
    background-color: transparent;
    border-radius: 5px;
}
.left-box
{
    position: absolute;
    top: 0;
    right: 104%;
    border-radius: 8px;
    background-color: rgba(57,42,71,.5);
    padding: 5px;
    /*opacity: 0;*/
    display: none;
}
.left-box .arrow
{
    position: absolute;
    right: -15px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 10px solid #1d1524;
}
.left-box .inner
{
    max-height: 100px;
    overflow-y: auto;
}
.left-box .inner img
{
    width: 30px;
    max-width: fit-content;
}

.participant_list_container .cross_inner
{
    text-decoration: none;
    position: relative;
    right: 2px;
    top: -1px;
    text-align: right;
    display: block;
    margin-top: -5px;

}
/* width */
.left-box .inner::-webkit-scrollbar, .participant_list_container .list_container::-webkit-scrollbar {
width: 5px;

}

/* Track */
.left-box .inner::-webkit-scrollbar-track, .participant_list_container .list_container::-webkit-scrollbar-track {
    background: #693f8e;
    border-radius: 5px;
}

/* Handle */
.left-box .inner::-webkit-scrollbar-thumb, .participant_list_container .list_container::-webkit-scrollbar-thumb {
    background: #a38cb8;
    border-radius: 5px;
}
.p_list_content:hover
{
    background-color: rgba(2,2,2,.5);
}
.count_badge
{
    padding: 5px;
    position: absolute;
    top: -7px;
    left: -9px;
    background-color: red;
    color: white;
    border-radius: 50%;
}
.popover1
{
    position: absolute;
    /* max-width: 276px; */
    width: 400px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.42857143;
    line-break: auto;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    word-wrap: normal;
    white-space: normal;
    font-size: 20px;
    background-color: #bd00ff;
    color: white;
    border-radius: 5px;
    padding: 10px;
    z-index: 9999999999999;
    right: 0px;
}
.popover2
{
    position: absolute;
    width: 500px;
    font-style: normal;
    font-weight: 400;
    line-break: auto;
    text-decoration: none;
    font-size: 20px;
    background-color: #bd00ff;
    color: white;
    border-radius: 5px;
    padding: 10px;
    z-index: 9999999999999;
    left: 80px;
    bottom: 122%;
}
 .arrow_small
{
    position: absolute;
    width: 0; 
    height: 0; 
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;        
    border-bottom: 10px solid #bd00ff;
    top: -10px;
    right:23px;
}
.arrow1
{
    position: absolute;
    width: 0; 
    height: 0; 
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;        
    border-top: 10px solid #bd00ff;
    bottom: -10px;
}
.walk-wd .popover1
{
    width: 250px !important;
    z-index: 9999999999999;
}
#walk5 .popover1
{
    top: 64px;
    left: 3%;
    width: 600px !important;
    z-index: 9999999999999;
}
#walk5 .popover1 .arrow1_small
{
    right: auto;
}
.walk-wd .popover1 .arrow_small
{
transform: translateX(-50%);
}
.overlay-box
{
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(0,0,0,.6);
    z-index: 9999;
    
}
.start-tutorial
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    max-width: 550px;
    z-index: 99999;
}
.start-tutorial .ok-btn
{
    background: rgba(124,31,156,0.9);
}
.black_button
{
    display: inline-block;
    padding: 5px 10px;
    color: white !important;
    text-decoration: none;
    background-color: black;
    font-size: 14px;
    border-radius: 3px;
    text-decoration: none;
}
.main_pop_text
{
    position: relative;
    color: white;
    font-size: 12px;
    text-align: center;
    border: 2px solid #9b51e0;
    padding:2px 8px;
    background-color: black;
    margin-bottom: 10px;
}
.main_pop_text span.badge, .pop_text span.badge, #walk5 span.badge
{
    position: absolute;
    top: -8px;
    left: -5px;
    background-color: #9b51e0;
    color: white;
    font-weight:normal;
}
.tutorial_txt_box
{
    background-color: #bd00ff;
    border-radius: 8px;
    position: absolute;
    top: 0;
}
.zoom_video_text
{
    position: absolute;
    top: -9px;
    right: 65px;
    background-color: #bd00ff;
    border-radius: 8px;
    width: 80%;
    padding: 25px;
    color: white;
    z-index: 999;
    font-size: 16px;

}
.tutorial_txt_box p{
    color: white;
    font-size: 16px;
    margin-bottom: 0;
}
.border_box1
{
    top: -6px;
    margin-bottom: 0;
    right: -4px;
    cursor: pointer;
    z-index: 9999999999;
    width: 61px;
    height: 50px;
    border: 2px solid #9b51e0;
}
.border_box2
{
    top: -32px;
    right: -10px;
    cursor: pointer;
    z-index: 9999999999;
    width: 106%;
    height: 174px;
    border: 2px solid #9b51e0;
}
.hand_btn_cnt
{
    width: 50px;
    border: 2px solid #9b51e0;
}
.hand-icon-left
{
    position: absolute;
    left: 0;
    top: 0;
    padding: 7px 15px;
    border-radius: 12px 0px 0px 0px;
    text-align: center;
    background-color: #9b51e0;
}
.hand-icon-right
{
    position: absolute;
    right: 0;
    top: 0;
    padding: 7px 18px;
    border-radius: 0px 12px 0px 0px;
    text-align: center;
    background-color: #9b51e0;
    color: white;
    font-size: 20px;
}
.hand-icon-right_grp1
{
    position: absolute;
    left: 347px;
    top: 0;
    padding: 7px 18px;
    border-radius: 0px 12px 0px 0px;
    text-align: center;
    background-color: #9b51e0;
    color: white;
    font-size: 20px;
}

.highlight_text
{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 2px;
    padding: 5px 10px;
    font-weight: bold;
    border-radius: 5px;
    text-align: center;
    background-color: white;
    color: black;
}

.highlight_text_group1
{
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 1px;
    padding: 5px 10px;
    font-weight: bold;
    border-radius: 5px;
    text-align: center;
    background-color: white;
    color: black;
}
.arrow_down
{
    width: 25px;
    position: absolute;
    top: -51px;
    z-index: 99999;
    left: 55%;
    transform: translateX(-50%);
    animation: uparrow 0.6s infinite alternate ease-in-out;
}
.arrow_down_zoom
{
    width: 25px;
    position: absolute;
    top: 46px;
    z-index: 99999;
    right: 0px;
    animation: uparrow 0.6s infinite alternate ease-in-out;
}
@keyframes leftarrow {
    0% { -webkit-transform: translate(0em,-50%); opacity: 0.6 }
    100% { -webkit-transform: translate(-0.4em,-50%); opacity: 1 }
  }
  @keyframes uparrow {
    0% { -webkit-transform: translate(-50%,0em); opacity: 0.6 }
    100% { -webkit-transform: translate(-50%,-0.4em); opacity: 1 }
  } 
  @keyframes uparrow1 {
    0% { -webkit-transform: translate(-50%,-30px); opacity: 0.6 }
    100% { -webkit-transform: translate(-50%,-35px); opacity: 1 }
  } 
#session_strt .arrow_down, .zoom_video_text .arrow_down
{
    top: 110%;
}
.video_arrow_down
{
    width: 25px;
    position: absolute;
    top: -18px;
    z-index: 99999;
    right: 0px;
    animation: uparrow1 0.6s infinite alternate ease-in-out;
}
/* #playNext .arrow_down
{
    animation: uparrow1 0.6s infinite alternate ease-in-out !important;
}   */
.union-right
{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: -73px;
    animation: leftarrow 0.6s infinite alternate ease-in-out;
}
.parent-session
{
    border: 2px solid #9b51e0;
    padding: 19px;
    width: 100%;
    left: -12px;
    top: -2px;
    height: 118%;
}
.one-gutters .parent-session
{
    padding: 22px 30px;
    left: -7px;
    top: -4px;
}
.parent-session1
{
    border: 2px solid #9b51e0;
    padding: 19px;
    width: 116%;
    left: -7px;
    top: -5px;
    height: 118%;
}
.purple_border
{
    border: 1px solid #9b51e0;
    background-color: #35223c;
    
}
.purple_border_right
{
    border-right: 1px solid #9b51e0;
}
.hain_raise_btn
{
    border: 2px solid #9b51e0;
}
.overflow-inherit
{
    overflow: inherit !important;
}.purple-border
{
    border: 2px solid #9b51e0;
}
.union_right
{
    position: absolute;
    left: 121%;
    top: 50%;
    transform: translateY(-50%);
    animation: leftarrow 0.6s infinite alternate ease-in-out;
}


.attendy-fullscreen .form-group {
    position: relative;
    width: 60px;
}
.attendy-fullscreen .form-group .cover-border {
    position: absolute;
    top: 0px;
    background-color: #2f2f2f;
    z-index: 2;
    left: 8px;
    width: 55%;
    height: 2.3px;
}
.form-group .label {
    font-family: "Avenir-Book";
    color: #eee;
    position: absolute;
    z-index: 4;
    font-size: 18px;
    left: 20px;
    top: -12px;
}
.attendy-fullscreen .form-group .input-field {
    border-radius: 0px 8px 8px 8px;
    background: rgb(52, 33, 59);
    color: #fff;
    border: 2px solid #b002ed;
    height: 40px;
    width: 100%;
    margin-bottom: 22px;
    padding-left: 12px;
    font-size: 18px;
    position: relative;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
}
.attendy-fullscreen .form-group select.input-field option {
    color: #7e7382;
    /* background-color: rgb(52, 33, 59) !important; */
    background-image: url(./../images/bg1.jpg);
}
.attendy-fullscreen .form-group select.input-field {
    background-image: url(./../images/dropdown.png);
    background-repeat: no-repeat;
    background-position: right 9px center;
    color: #7e7382;
    background-size: 14px;
}
select:focus, a:focus, img:focus
{
    border: none;
    outline: none !important;
    box-shadow: none !important;
}

#subscribe_list1, #subscribe_group3, #img_group1 img, #coming_soon .modal-dialog
{
    max-width: 400px;
}
/*  TUTORIAL CSS END*/

.cursor-pointer
{
    cursor: pointer;
}
.alrt_txt
{
    color: red;
    background-color: white;
    padding: 4px 12px;
    border-radius: 8px;
    top: 5px;
    left: 50%;
    transform: translateX(-50%);
    position: absolute;
}
.fa-exclamation-circle
{
    color: red;
}
button.show-everyone.btn.btn-outline-secondary.mb-3.mx-auto {
    position: absolute;
    bottom: -17px;
    width: 155px;
    left: -159px;
}
.time.mb-2.text-left {
    display: flex;
    justify-content: space-between;
}
.align-items-top{ align-items: flex-start !important; }
.default-btns
{
    margin:0 0.5rem !important;
}
.default-btns .btn img{ max-width: 20px; }
#show-details2 p
{
    color: #eee;
    font-family: Avenir-Book;
    font-size: 15px;
}
#show-details2 button.close-model-btn
{
transform: translateY(-17px);
font-weight: inherit;

}
.b-0
{
    bottom:10px;
}
.move-list img{
    width: 20px;
}
.video-streams1
{
    /* width: 255px !important; */
    min-width: 180px !important;
    max-width: 250px !important;
    margin: auto !important;
    position: relative;
}
#show-details2 .border_botm_none
{
border-bottom: none;
}   
.white-text{
color: #eee;
font-family: Avenir-Book;
font-size: 22px;
padding: 0 20px;
margin-right: 20px;
vertical-align: middle;
} 
#show-details2 .clock_img
{
width: 20px;
margin-right: 15px;
}
#show-details2 .modal-dialog, #switch-camera-popup .modal-dialog, #musicList .modal-dialog
{
max-width: 95%;

}
#show-details2 .modal-content
{
    background-color: #000000;
}
#show-details2 div.overflow-hidden p:nth-child(1):after
{
display: none;
}
#show-details2 .input-txt {
color: #fff;
font-size: 22px;
}
#show-details2 .switch {
vertical-align: sub;
margin-right: 17px;
position: relative;
display: inline-block;

height: 20px;
margin-bottom: .5rem;
width: 32px;
}
#show-details2 .switch input {
opacity: 0;
width: 0;
height: 0;
}
#show-details2 .slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
border-radius: 34px;
}
#show-details2 .slider:before {
position: absolute;
content: "";
height: 14px;
width: 14px;
left: 4px;
bottom: 3px;
background-color: #BD00FF;
-webkit-transition: .4s;
transition: .4s;
border-radius: 50%;
}
.white_hdng
{
color: #fff;
font-family: Avenir-Heavy;
font-size: 25px;
vertical-align: middle;
}
.white_font
{
color: #fff;
font-family: Avenir-Medium;
font-size: 21px;
vertical-align: middle;
}
.font-medium
{
    font-family: Avenir-Medium;
}
#show-details2 .fa-circle
{
font-size: 6px;
color: #bd00ff;
transform: translateY(-3px);
}
#show-details2 .form-radio:checked::before
{
color: #363636;
}
#show-details2 .form-radio
{
left: 17px;
top: 5px;
}
.w-110
{
    width: 110px;
}

/*----------session selection CSS----------------*/

.background-gray
{
    background-color: #2f2f2f;
}
.logo-icon
{
    width: 135px;
}

.white_heading
{
    color: white;
    font-size: 22px;
}
.radius-8
{
    border-radius: 8px !important;
}
.radius-12
{
    border-radius: 12px !important;
}
.font-20
{
    font-size: 20px !important;
}
.font-40
{
    font-size: 40px !important;
}
.background_dark
{
    background-color: #262626;
    position: relative;
}
.background_dark .badge
{
    position: absolute;
    left: -15px;
    top: -10px;
    border-radius: 50%;
    font-size: 16px;
    padding: 5px 9px;
    background-color: #b56cee;
    color: white;
}
.small_gray_font img
{
    width: 20px;
    transform: translateY(-5px);
}
.small_gray_font
{
    color: #aaaaaa;
}
.join_button
{
    background-color: #bd00ff;
    border-radius: 8px;
    color: white;
    border:none;
    padding: 7px 30px 10px 30px;
    font-size: 19px;
}
.translate-0
{
    transform: translateY(0px) !important;
}
.border_bottom_purple
{
    border-bottom: 1px solid #b002ed;
}
.hour, .min, .sec
{
    position: relative;
}
.hour:after
{
    content: "hh";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 100%;
    font-size: 14px;
}
.min:after
{
    content: "mm";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 100%;
    font-size: 14px;
}
.sec:after
{
    content: "ss";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: 100%;
    font-size: 14px;
}
.valign-wrapper1
{
    width: 100%;
    height: 100vh;
}
.session_user
{
    max-width: 600px;
    margin-top: 100px;
}
/*----------show details4 CSS----------------*/

.details_model p
{
    color: #eee;
    font-family: Avenir-Book;
    font-size: 15px;
}
.details_model button.close-model-btn
{
transform: translateY(-17px);
font-weight: inherit;

}
.prescreen-popup .open-list
{
    width: 30px;
}

.details_model .border_botm_none
{
border-bottom: none;
}   
.white-text{
color: #eee;
font-family: Avenir-Book;
font-size: 22px;
padding: 0 20px;
margin-right: 20px;
vertical-align: middle;
} 
.details_model .clock_img
{
width: 20px;
margin-right: 15px;
}
.details_model .clock_img1
{
width: 12px;
margin-right: 15px;
}
.details_model .modal-dialog, #switch-camera-popup .modal-dialog, #musicList .modal-dialog
{
max-width: 95%;

}
.details_model .modal-content
{
    background-color: #000000;
}
.details_model div.overflow-hidden p:nth-child(1):after
{
display: none;
}
.details_model .input-txt {
color: #fff;
font-size: 22px;
}
.details_model .switch {
vertical-align: sub;
margin-right: 17px;
position: relative;
display: inline-block;

height: 20px;
margin-bottom: .5rem;
width: 32px;
}
.details_model .switch input {
opacity: 0;
width: 0;
height: 0;
}
.details_model .slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
border-radius: 34px;
}
.width-20
{
    width: 20px !important;
}
.details_model .slider:before {
position: absolute;
content: "";
height: 14px;
width: 14px;
left: 4px;
bottom: 3px;
background-color: #BD00FF;
-webkit-transition: .4s;
transition: .4s;
border-radius: 50%;
}

.white_hdng
{
color: #fff;
font-family: Avenir-Heavy;
font-size: 25px;
vertical-align: middle;
}
.white_font
{
color: #fff;
font-family: Avenir-Medium;
font-size: 21px;
vertical-align: middle;
}
.font-medium
{
    font-family: Avenir-Medium;
}
.details_model .fa-circle
{
font-size: 6px;
color: #bd00ff;
transform: translateY(-3px);
}
.details_model .form-radio:checked::before
{
color: #363636;
}
.details_model .form-radio
{
left: 17px;
top: 5px;
}
.ml-7
{
    margin-left: 36px;
}
.rgt_modal_box
{
    background-color: #363636;
}
.h-100
{
    height: 100%;
}
.camera_box
{
    border-radius: 15px;
    border: 1px solid #bd00ff;
    background-color: #363636;
    padding: 10px 8px 10px;
    width: 33.3%;
}
.camera_box img{
    border-radius: 15px;
}
#switch-camera-popup .form-radio
{
    top: 0px;
    border: 2px solid white;
	
	vertical-align: middle;
}
#switch-camera-popup .form-radio:checked
{
    background-color: white;
}
#switch-camera-popup .form-radio:checked::before
{
    color: #666;
    left: 3px;
    top: 1px;
}
.max-height-500
{
    max-height: 500px;
    overflow-y: auto;
}
.max-height-500::-webkit-scrollbar {
    width: 5px;
    border-radius: 3px;
  }
  .max-height-500::-webkit-scrollbar-track {
    background: #494949;
    border-radius: 3px;
  }
  
  .max-height-500::-webkit-scrollbar-thumb {
    background: #757575;
    border-radius: 3px;
  }

.winebg-clr
{
    background-color: #262626;
    margin: 0 auto;
    border: none !important;
}
ul.music-playlist li:first-child a
{
    border-top: 2px solid #4B4C55;
}
ul.music-playlist li:first-child a:hover, ul.music-playlist li:first-child a:focus
{
    border-top: 2px solid #9b51e0;
}
ul.music-playlist li a:hover, ul.music-playlist li a:focus
{
    background-color: #3c3345;
    border-top: 1px solid #9b51e0;
    border-bottom: 1px solid #9b51e0;
}
.small_font{
    font-family: Avenir-Book;
    display: block;
    font-size: 13px;
    color: #f4f4f4;
}
.control-music img
{
    width: 33px;
}
.control-music img.img1
{
    width: 20px;
}
div.gray_bar
{
    width: 74px;
    height: 9px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    background-color: #4b4c55;
    position: relative;
}
div.gray_bar::before
{
    content: url(./../images/active-volume.png);
    position: absolute;
    top: -9px;
    left: -4px;
}
.b-10
{
    bottom:0px;
}
.w-95
{
    width: 85%;
}
.w-90
{
    width: 90% !important;
}
.ht-20
{
    min-height: 20%;
    max-height: 38%;
}
.ht-80
{
    min-height: 80%;
    max-height: 62%;
}
.translate1
{
    transform: translateY(-5px);
}
 .message-box 
 {
     position: absolute;
     top: 135px;
     width: 600px;
     background-color: #312e2e transparent;
     left: 50%;
     transform: translateX(-50%);
     z-index: 99999999;
     border-radius: 10px;
 }

 .message-box-guest
 {
     position: absolute;
     top: 300px;
     width: 600px;
     background-color: #312e2e transparent;
     left: 42%;
     transform: translateX(-50%);
     z-index: 999;
     border-radius: 10px;
 }
/* //-----------------ONBOARDING CSS ----------------// */

.onboarding-modal .modal-content
  {
    background: #343434;
    min-width: 100%;
  }
      
.gray-box-5 .cover-border
{
  background-color: #363636;
  height: 2px;
}

.chat-wrapper .chat-header .close.close-btn1
{
    color: white;
    opacity: 1;
    font-weight: normal;
    background:#121126;
    border-radius: 50%;
    width: 35px;
    height: 35px;
    font-size: 32px;
    line-height: 2px;
    padding: 0 0 7px 0;
    position: absolute;
    top: 6px;
    right: 12px;
}
.screen_popup
{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 999;
}
.screen_popup1
{
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
}
.network_msg_audience
{	
	position: absolute;
	top: 5px;
    left: 50%;
	transform: translateX(-50%);
	
	width: fit-content;
	padding: 5px 10px;
	
	font-family: Poppins;
    font-style: normal;
    font-weight: normal;
	letter-spacing: 1px;
    font-size: 14px;
	text-align: center;
   
    border-radius: 15px;
  
    white-space: nowrap;
    z-index: 3;
}
.no_video_mg
{
    position: absolute;
    bottom: -5px;
    left: 50%;
    transform: translateX(-50%);
    /*font-size: 15px;
    padding: 2px 5px;
    border-radius: 5px;*/
    text-align: center;
    width: fit-content;
}
.font-30
{
  font-size: 30px !important;
}
.font-35
{
  font-size: 35px !important;
}
.font-24
{
  font-size: 24px !important;
}
.font-16{
    font-size: 16px;
}
.font-18{
    font-size: 18px !importants;
}
.width-75
{
  max-width: 75%;
}
.width-1000
{
    max-width: 1000px;
}
.brdcrum div.steps:nth-child(1), .brdcrum div.step:nth-child(1)
{
  margin-top: 10px;
}
.brdcrum div.steps:nth-child(2), .brdcrum div.step:nth-child(2)
{
  transform: translateX(-7px);
  margin-top: 10px;
}
.brdcrum div.steps:nth-child(3), .brdcrum div.step:nth-child(3)
{
  transform: translateX(-14px);
  margin-top: 10px;
}
.brdcrum div.steps:nth-child(4), .brdcrum div.step:nth-child(4)
{
  transform: translateX(-21px);
  margin-top: 10px;
}
.brdcrum div.steps:nth-child(5), .brdcrum div.step:nth-child(5)
{
  transform: translateX(-28px);
  margin-top: 10px;
}
.brdcrum .steps p, .brdcrum .step p
{
  position: absolute;
  transform: translate(-50%,-50%);
  top: 49%;
  left: 50%;
  color: white;
  font-size: 19px;
}
.custom_btn11
{
    border-radius: 32px !important;
    background: rgba(189,0,255,1);
    color: #fff;
    text-align: center;
    font-family: "Avenir-Medium";
    font-size: 23px;
    text-transform: capitalize;
    font-weight: 100;
    cursor: pointer;
    border: none;
    padding: 10px 45px;
}
.button-padding
{
    padding: 7px 38px !important;
}
.arow_icon
{
    width: 14px;
}
.download_app
{
    background: rgba(189,0,255,1);
}
.bg-grayy
{
    background-color: #2a2a2a;
}
.small_width
{
  max-width: 680px !important;
}

.done
{
    border-radius: 35px;
    background: rgba(189,0,255,.6);
    color: #fff;
    text-align: center;
    font-family: "Avenir-Book";
    font-size: 21px;
    text-transform: capitalize;
    font-weight: bold;
    cursor: pointer;
    border: none;
    padding: 12px 45px;
}
.mt--30
{
    margin-top: -30px !important;
}
.radius-10
{
    border-radius: 10px !important;
}
.onboarding-modal
{
  background-color: rgba(0,0,0,0.8);
}
.bg-transparent
{
  background-color: transparent !important;
}
.number_circle
{
  position: absolute;
  left: -20px;
  top: 50%;
  transform: translateY(-50%);
  width: 65px;
  height: 65px;
  border-radius: 50%;
  background-color: #b002ed;
}
.number_circle span
{
  position: absolute;
  transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
  font-size: 50px;
  display: inline-block;
  color: white;
  font-family: Avenir-Medium;
}
.image_size
{
  width: 70px;
}
.mt--5
{
  margin-top: -5px;
}
.mt--10
{
  margin-top: -10px;
}
.font-18
{
  font-size: 18px;
}
.font-medium
{
  font-family: Avenir-Medium;
}
.width-390
{
    width: 390px;
}
.lebelheight
{
    position: absolute;
    left: -70px;
    top: 14px;
}
.gray-btn
{
  background-color: #262626;
  border: none;
  border-radius: 24px;
  color: white;
}
.step img
{
  flex-basis: 220px;
}
#virdio_onboarding12 .modal-dialog .modal-content, #virdio_onboarding13 .modal-dialog .modal-content
{
  /* background-image: url(./../images/group-11.png);
  background-position: right 33px bottom 40px;
  background-repeat: no-repeat;
  background-size: 350px; */
}
#virdio_onboarding15 .modal-dialog .modal-content
{
  background-image: url(./../images/headphones.png);
  background-position: right 33px bottom;
  background-repeat: no-repeat;
  background-size: 350px;
}
.container-video
{
    width: 400px;
    height: 230px;
    background-color: black;
}
.white-dot
{
    display: inline-block;
    width: 17px;
    height: 17px;
    border-radius: 50%;
    background-color: white;
    margin-right: 10px;
}
@media screen and (min-width:768px) and (max-width: 1400px){
    .fullVideoBox
    {
        width: 67%;
    }
}
@media screen and (min-width:1700px) and (max-width: 2100px){
    .fitness-guest .swiper-slide h4
    {
        font-size: 35px;
    }
    .footer-fitness-script .fitness-guest .count-timer
    {
        transform: scale(1.3) !important;
    }
    .swiper-fitness-container
    {
        height: 180px !important;
    }
    .swiper-guest.end.swiper-slide-next span a{
        transform: scale(1.4);
    }
    .swiper-guest.end span a{
        transform: scale(1.4);
    }
    .swiper-guest.end{
        padding-top: 60px !important;
    }
    .swiper-guest.end.swiper-slide-next{
        padding-top: 60px !important;
    }
    .progress-box
    {
        bottom: 290px !important;
    }
}
@media (max-width:576px){
    .onboarding-modal .font-24
{
    font-size: 20px !important;
}
.onboarding-modal .font-35
{
    font-size: 28px !important;
}
.width-75
{
    max-width: 85% !important;
}
}

@media screen and (min-width: 1500px)
{
    /* .item-description .list-info li span:first-child, .item-description .list-info li span:last-child
    {
        max-width: 250px;
    } */
    .b-0
{
    bottom:20px;
}
    .details_model button.close-model-btn, .modal-header .close, .music-list .close
    {
        font-size: 2.5vw;
    }
    .b-10
{
    bottom:20px;
}
    .white-text
    {
        font-size: 1.3vw;
    }
    .right-sidebar{
        /*width: 400px;*/
        /*float: right;*/
    }
    .details_model .modal-dialog, #switch-camera-popup .modal-dialog, #musicList .modal-dialog
{
max-width: 75%;

}
.bottom-links li a, .score-btn a
{
    font-size: 20px;
}
.shopping-btn img
{
    width: 22px;
}
.shopping-btn
{
    padding: 9px 15px;
    font-size: 17px;
    margin-right: 5px;
}

.details_model p, #show-details2 p
{
    font-size: .9vw;
}
.translatee
{
    transform: translateY(-16px);
}
.translatee .btn-primary, .btn-primary.border-right
    {
        /*padding: 10px 25px;*/
        /*font-size: 21px;      */
        
    }
    .logout-btn i
    {
        font-size: 28px;
        width: 34px;
        height: 34px;
        font-weight: inherit;
    }
   
.section.attendees .title
{
    font-size: 1.3vw;
}

h3.main-heading span{
    font-size: 1.2vw;
}
.prescreen-popup .participant-status
{
    width: 20%;
}
}
@media screen and (min-width: 2000px)
{
    .time span
{
    font-size: 1.2vw;
}
    .max-h200
    {
        max-height: 300px;
    }

h3.main-heading
{
    font-size: 1.5vw;
}
    .transparent-gray .btn-primary, .time-session .btn-primary
    {
		height: 35px !important;
		font-size: 19px;
		min-height: 1.3vw;
    }
	
    .transparent-gray .fa-volume-up
    {
        font-size: 25px !important;
        padding-top: 5px !important;
    }
    .default-btns .btn img, .default-btns .btn .fa-microphone
    {
        width: 25px !important;
        max-width: 25px !important;
        height: 23px !important;
    }
    
    .btn-leave, .btn-join
    {
        font-size: 30px;
    }
    /* .btn-join, .count-box h4
    {
        font-size: 25px;
    } */
  
    /* .fullscreen img
    {
        width: 35px;
    } */
    .shopping-btn img
{
    width: 20px;
}
.shopping-btn
{
    padding: 15px 25px;
    font-size: 25px;
    margin-right: 25px;
}
   
    .right-sidebar
    {
        margin-top: 30px;
    }
    .mt-60
    {
        margin-top: 60px;
    }
    .font-26, .font-26 span
    {
        font-size: 26px !important;
    }
    .winesbg
    {
        width: 75%;
    }
    #show-details2 .modal-dialog, #switch-camera-popup .modal-dialog, #musicList .modal-dialog
{
max-width: 80%;

}
ul.music-playlist li a span:nth-child(2){
   
    font-size: 18px;
}
ul.music-playlist li a span:nth-child(3){
font-size: 20px;
}
ul.music-playlist li a span:nth-child(1)
{
    font-size: 25px;
}
.music-list .close
{
   
    margin-bottom: 15px !important;
    margin-left: 10px !important;
}
.pt2
{
    padding-top: 2px;
}
.white_hdng
{
    font-size: 35px;
}
.small_font
{
    font-size: 20px;
}
.control-music img.img1
{
    width: 30px;
}
.control-music img
{
    width: 50px;
}
.item-name
{
    font-size: 20px;

}
.host-header>img {
    width: 30px;
}
.custom_button
{
    padding: 8px;
}
.custom_button img
{
    width: 30px;

}
.font-size-16
{
    font-size: 21px !important;
}
.font-size-16 span
{
    font-size: 18px !important;
}
.item-description .list-info li
{
    font-size: 19px;
}
/* .script-info .carousel-control-next, 
.script-info .carousel-control-prev
{
    width: 35px;
    height: 35px;
} */
.script-info .carousel-control-prev
{
    right: 128px;
}
.show-hide-script, .show-fitness-script
{
    right: 25px;
    /* top: 19px; */
}
.next-btn
{
    width: 35px;
}
.swiper-slide-nxt
{
    background: rgba(110,67,150,0.3);
    border: 1.5px solid #9B51E0 !important;
    border-radius: 12px;
    padding: 10px;
    position: relative;
    /* height: auto !important; */
    height: 138px !important;
}

/* .play-pause-btn
{
    right:118px;

} */
/* .play-pause-btn img, .stop-btn img
{
    width: 35px;    
} */
.custom_button img
{
    width: 30px;
}
/* .stop-btn img
{
    width: 35px;    
} */
.d-inline-block
{
    display: inline-block;
}
/* .show-hide-script, .show-fitness-script
{
    right: 22px;
    width: 35px;
}   */

.attendy-list .modal-dialog
{
    max-width: 80%;
}
.prescreen-popup .small-heading
{
    font-size: 1.1vw;
}
.prescreen-popup .popup-heading
{
    font-size: 1.2vw;
}
.prescreen-popup .signup-total, .prescreen-popup .online-total
{
    font-size: 21px;
}
.network-wifi
{
    width: 380px;
}
.fill-wifi
{
    bottom: 24px;
}
.online-streams, .heart-rate
{
    width: 240px;
}
.check-camera label
{
    font-size: 21px;
}

#agora_local
{
    /* width: 400px !important;
    height: 250px !important;
    margin-bottom: 30px; */
}
/* .prescreen-popup .open-list
{
    width: 35px;
}
.target-info span, .target-info span:nth-child(2)
{
    font-size: 18px;
} */
}
@media screen and (max-width: 1500px)
{
.count-box .countdown
{
    margin-top: 1px;
  margin-bottom: 4px;
}
}

@media only screen and (min-width: 378px) and (max-width: 414px) {
    .singlevideoemoticons {
        margin: 0 2.7%
    }
}

@media only screen and (min-width: 350px) and (max-width: 375px) {
    .singlevideoemoticons {
        margin: 0 2%
    }
}

@media only screen and (min-width: 320px) and (max-width: 350px) {
    .singlevideoemoticons {
        margin: 0 1.2%
    }
}
.video-box1
{
    width: 230px;
    /* background-color: #6c757d; */
}
span.video_text{
    position: absolute;
    color: rgb(248, 246, 246) !important;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    /* right: 40%; */
    z-index: 1;	
}
.overflow-hidden
{
    overflow: hidden;
}
#container
{
    width: 230px;
    margin: auto;
}
#videoElement {
width: 230px;
border-radius: 10px;
/* background-color: rgba(7, 7, 7, 0.945); */
height: 172.2px;
}
#canvas{
    border-radius: 10px;
    border-radius: 10px;
    /* background-color: rgba(7, 7, 7, 0.945); */
    height: 172.2px;
}
.background_dark
{
    background-color: #262626;
}
.background_dark .badge
{
    position: absolute;
    top: -9px;
    left: -12px;
    background-color: #9b00d2;
    color: white;
    padding: 5px 8px;
}
.o-hidden
{
    overflow: hidden;
}

.newprogressbar div {
    height: 10px;
    background: #9b51e0;
    width: 1%;
    border-radius: 10px;
    transition: width 0.3s;
}

.newprogressbar {
    background: #111111;
    border-radius: 10px;
}

.newprogressbarinfo
{
	font-size: 15px !important;
    margin-top: 20px;
}

.playlist_loader {
	position: absolute;
	left: 6px;
	top: 5px;	

	border: 5px solid #f3f3f3;
	border-radius: 50%;
	border-top: 5px solid #bd00ff;
	width: 30px;
	height: 30px;
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
}

#sessionPay .login-inner.gray_clr_back
{
	background-color: transparent;
}



/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.password_check_form
{
	position: absolute;
	bottom: 38px;
	right: 3px;
	
	padding: 7px 22px;
	
	background-color: #2a2a2a;
	box-shadow: 0px 0px 2px 0px #fff;
	border-radius: 10px;
	text-align: left;
	
	z-index: 100;
}


.pass_done_icon
{
	display: inline-block;
   
	height: 13px;
	width: 13px;
	
	background-repeat: no-repeat;
	background-size: 100% 100%;
	background-image: url(./../images/checked_pass.png);
	vertical-align: middle;
}

.pass_line_text
{
	display: inline-block;
	margin-left: 5px;
}

.spec_char
{
	display: block;
	margin-left: 20px;
}

.pass_iks_icon
{
	background-image: url(./../images/pass_close.png);
}

@media screen and (max-width: 768px)
{
	.password_check_form
	{
		bottom: 19px;
	}
}

@media screen and (max-width: 475px)
{
	.ch_button_pad .ok-btn
	{
		padding: 14px 30px !important;
	}
}

@media screen and (max-width: 370px)
{
	.ch_button_pad .ok-btn
	{
		padding: 14px 15px !important;
		border-radius: 23px;
	}
}

.tempaudio
{
	width: 1px;
	height: 1px;
}

.countdown-logo
{
	text-align: center;
}

.countdown-logo .logo_icon
{
	max-height: 38px
}





/* Video UI */

.host-section
{
	min-width: 0px !important;
	width: 280px;
	margin-right: 3px;
}

.fitness-script
{
	width: calc(100% - 283px);
	flex: auto;
}

#subscribers-list
{
	height: calc(100vh - 385px) !important;  
	transition: all 0.5s;
}

#agora_local_parent
{
	height: 180px !important;
	transition: all 0.5s;
}

section.section.attendees
{
	margin-top: 79px !important;
}












.guesttopscreen
{
	display: block !important;
}

.guesttopscreen header
{
	width: 100% !important;
	max-width: 100% !important;
}

.guestmiddlescreen .row, .guestmiddlescreen
{
	display: block !important;
	margin: 0px;
}

.rightVideoList
{
	display: none;
	min-width: 250px;
	pointer-events: none;
}

.guestmiddlescreen .fullVideoBox
{
	display: inline-block;
	max-width: 100%;
	width: calc(100% - 130px) !important;
	height: calc(100vh - 222px) !important;
	margin: 0px 15px;
	
	vertical-align: top;
}

.guestmiddlescreen .fullVideoBox video, .guestmiddlescreen .fullVideoBox canvas
{
	width: 100% !important;
	max-width: calc((100vh - 222px)*16/9) !important;
	max-height: calc(100vh - 222px) !important;	
	vertical-align: top;
}

body .guestmiddlescreen  .fullVideoBox .highlightedStream canvas
{
	max-width: 100% !important; 
	max-height: 100% !important; 
	transform: translateX(-50%) scaleX(-1) !important;
}

.guestmiddlescreen .fullVideoBox canvas
{
	position: relative !important;
	left: 50% !important;
    transform: translateX(-50%) !important;
}

.guestmiddlescreen .videoFullScreen video, .guestmiddlescreen .videoFullScreen canvas
{
	max-width: 100% !important;
	max-height: 100% !important;
}

body.zoomHostFull .guestmiddlescreen #agora_host .videoFullScreen video, body.zoomHostFull .guestmiddlescreen #agora_host .videoFullScreen canvas, body.zoomHostFull .guestmiddlescreen #agora_inject_stream .videoFullScreen video
{
	max-width: 100% !important;
	max-height: 100% !important;
}

body.showVideoList .guestmiddlescreen .rightVideoList
{
	display: inline-block;
}

body.showVideoList .guestmiddlescreen .list_participant, body.showVideoList .guestmiddlescreen #subscribers-list .newcss
{
	display: block;
}

.list_participant
{
    display: flex !important;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    overflow: hidden;
}

.participant_image
{
    /*display: flex !important;*/
}

body.showVideoList .guestmiddlescreen .fullVideoBox
{
	width: calc(100% - 130px - 300px) !important;
}

.guestmiddlescreen .heartrateg
{
	display: inline-block !important;
	height: calc(100vh - 222px) !important;
	vertical-align: top;
}

.guestmiddlescreen .heartrateg .left-section
{
	height: 100% !important;
	vertical-align: top;
}

.guestmiddlescreen #agora_host
{
	max-width: calc((100vh - 70px)*16/9);
}

.guestmiddlescreen #agora_host, .guestmiddlescreen #agora_inject_stream
{
	position: relative;
	left: 50%;
	top: 50%;
	
	max-width: calc((100vh - 222px)*16/9) !important;
	
	transform: translateX(-50%) translateY(-50%);
}

.agora_remove_pointer
{
	pointer-events: none;
}

.guestfooter
{
	display: block !important;
	position: relative;
}

.guestfooter video, .guestfooter canvas, .guestfooter .video-holder
{
	display: inline-block;
	width: 248px;
	height: 140px;
	bottom: 0px;
	
	vertical-align: top;
}
.custom-video-streams canvas{
	display: inline-block;
	width: 100% !important;
	height: 100% !important;
	bottom: 0px;
	border-radius:10px
}
.guestfooter .w-50
{
	display: inline-block;
	width: calc(100% - 250px) !important;
	vertical-align: top;
}


.guestmiddlescreen .participant-video-holder
{
	position: relative;
	width: calc((100vh - 83px)/4*16/9) !important;
	height: calc((100vh - 110px)/4) !important;
	max-width: 300px;
	max-height: 169px;
	
	margin-bottom: 2px;
}


body.showVideoList .guestmiddlescreen .rightVideoList #subscribers-list
{
	height: calc(100vh - 80px) !important;
}

body.showVideoList .guestfooter
{
	bottom: 152px;
	width: calc(100% - 310px);
}



body.expandedView #agora_local_parent
{
	bottom: -135px;
}

body.expandedView #subscribers-list
{
	height: calc(100vh - 191px) !important;
}

body.expandedView #script_name, body.expandedView #script_time
{
	display: inline-block !important;
}

body.expandedView #script_name, body.expandedView #script_time
{
	display: inline-block !important;
}

body.expandedView .video-holder-host, body.expandedView #start-fitness
{
	display: none !important;
}




.ondemandfooter
{
	display: block;
}

.ondemandfooter .video-holder
{
	display: inline-block;
	width: 248px;
	height: 140px;
}

.ondemandfooter .video-holder
{
	display: inline-block;
	width: 248px !important;
	height: 140px !important;
	vertical-align: top;
}

.ondemandfooter .w-50
{
	display: inline-block;
	width: calc(100% - 248px) !important;
	vertical-align: top;
    margin-top: 10px;
}

.ondemandmiddlescreen .row, .ondemandmiddlescreen
{
	display: block !important;
	margin: 0px;
	z-index: 5;
}


.ondemandmiddlescreen .fullVideoBox
{
	display: inline-block;
	max-width: 100%;
	width: calc(100% - 130px) !important;
	height: calc(100vh - 222px) !important;
	margin: 0px 15px;
	
	vertical-align: top;
}

.ondemandmiddlescreen .fullVideoBox video, .ondemandmiddlescreen .fullVideoBox canvas
{
	width: 100% !important;
	max-width: calc((100vh - 222px)*16/9) !important;
	max-height: calc(100vh - 222px) !important;
	/*height: 100vh !important;*/
	margin: 0px !important;
	
	vertical-align: top;
}


.ondemandmiddlescreen .max-width-300
{
	display: inline-block !important;
}

.ondemandmiddlescreen #agora_host
{
	position: relative;
    left: 50%;
    top: 50%;
    
    max-width: calc((100vh - 222px)*16/9) !important;
    
    transform: translateX(-50%) translateY(-50%);
}

.ondemandmiddlescreen .progress-box
{
	width: 85%;
	left: 50%;
	bottom: -15px !important;
	top: auto !important;
	max-width: calc((100vh - 222px)*16/9) !important;
	
	transform: translateX(-50%);
}

.ondemandmiddlescreen .heartrateg
{
	display: inline-block !important;
	height: calc(100vh - 222px) !important;
	vertical-align: top;
}



.ondemandmiddlescreen .heartrateg .left-section
{
	height: 100% !important;
	vertical-align: top;
}


@media screen and (max-height: 700px)
{
	.bpm-bar .readings, .bpm-bar .skills.bpm
	{
		font-size: 19px;
	}
}

.tutorialscreen section.section.attendees
{
	margin-top: 116px !important;
}

.tutorialscreen #subscribers-list
{
	height: calc(100vh - 368px) !important;
}

.guest-screen .transparent-gray .btn-primary, .guest-screen .time-session .btn-primary
{
	height: 32px !important;
}

#fitness-ssession-details img.rounded
{
	object-fit: contain;
}

/*-----------MILADIN IPAD SS------------*/
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) 
{ 
	#subscribers-list
	{
			height: calc(var(--vh, 100vh) - 332px) !important;
	}
	
	body.expandedView #subscribers-list
	{
		height: calc(var(--vh, 100vh) - 191px) !important;
	}

}

/*------------- UROS IPAD CSS START ------------ */
@media all and (device-width: 768px) and (device-height: 1024px) 
{
		.count-box .scriptName
		{
			font-size: 16px; 
		}
}

/*------------- UROS IPAD CSS END ------------ */

/*------------- UROS IPAD PRO CSS START ------------ */
@media all and (device-width: 1024px) and (device-height: 1366px) 
{
	
	.count-box .scriptName
		{
			font-size: 25px; 
		}
}
@media all and (device-width: 834px) and (device-height: 1112px) 
{ 
	
	.count-box .scriptName
		{
			font-size: 18px; 
		}
}

@media all and (device-width: 1366px) and (device-height: 1024px) 
{
	
}
/*------------- UROS IPAD PRO CSS END ------------ */

.w100
{
	width: 100%;
}

.def_reso
{
	margin-left: 35px;
    margin-top: 15px;
}

.ml25
{
	margin-left: 25px;
}

.check-camera .form-radio
{
	display: inline-block;
}

.check-camera label, .one_off_option label
{
	display: inline-block;
	
	padding-left: 5px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
	
	vertical-align: middle;
}

.click-recoring_gif
{
	top: 10px;
	left: 10px;
}

.session_recoring_gif
{
    top: 5px;
    right: -30px;
    position: absolute;
    z-index: 1;
}

.new_pos_holder
{
	position: relative !important;
}
.video-holder.zoom-video
{
	position: fixed !important;
	top: 30px;
	left: 0px;
	width: 100%;
	height: 95vh !important;
	padding: 35px;
	
	z-index: 2000;
}

.video-holder
{
	border-radius: 10px;
}

.new_top_pos
{
	top: 50px !important;
}

.less_zInd
{
	z-index: 1000 !important;
}
.new_zIndex_userList
{
	z-index: 9995 !important;
}
.recording_alert_hold
{
	margin-top: 1.5rem;
	text-align: center;
}

.bg-gray.px-0.py-1.rounded.section.attendees.mysec.position-relative
{
	/*margin-top: 0px !important;*/
}

.video-streams.h-100.stream-bg
{
	position: relative;
}

.zoom-box.h-100
{
	position: relative;
}

.zoom-video .video-streams canvas
{
	height: 100%;
}

.for_btns_version
{
	display: inline-block;
	width: 100%;
	padding-top: 50px;
	text-align: center;
}

.ml20
{
	margin-left: 20px;
}

.custom_btn1 
{
    display: inline-block;
	border-radius: 25px;
    background: #E4DAFF;
    color: #6D118C;
    text-align: center;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: bold;
    cursor: pointer;
    border: none;
    padding: 13px 35px;
	font-family: "Avenir-Book";
}

.main_loader
{
	display: none;
	position: fixed;
    top: 0;
    left: 0;
   
    width: 100%;
    height: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    background: rgba(0, 0, 0, 0.5);
    overflow: hidden;
    outline: 0;
    z-index: 9999999999999;
}

.room_setup_loader
{
    width: 100%;
    height: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    overflow: hidden;
    outline: 0;
    z-index: 9999999999999;
}

.main_loader_inner 
{
    transform: translateX(-50%) translateY(-50%);

	border: 5px solid #f3f3f3;
	border-radius: 50%;
	border-top: 5px solid #121126;
	width: 70px;
	height: 70px;
	margin: auto;
	
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
}

.room_setup_loader_inner 
{
    transform: translateX(-50%) translateY(-50%);

	border: 15px solid #E4DAFF;
	border-radius: 50%;
	border-top: 15px solid #121126;
	width: 150px;
	height: 150px;
	margin: auto;
	
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
}

.video_behind_loader{
	position: absolute;
    z-index: 2;
}

.mind_close
{
	position: absolute;
    top: -5px;
    right: -4px;
   
	width: 30px;
    height: 30px;
	
	background-image: url('../images/close_mind.svg');
	background-position: center;
	background-size: 12px;
	background-repeat: no-repeat;
    
	border-radius: 50%;
	border: 2px solid #9b51e0;
	
	z-index: 10;
	cursor: pointer;
}

.white_on_scr
{
	color: #fff;
}

.opacityText
{
	color: #a7a79f;
}

/* ANDREJ START */

.no_script_hold
{
	display: flex;

	height: 100%;
	width: calc(100% - 283px);
	
	color: #777;
	text-align: center;
	font-size: 30px;
	
	background-color: #2f2f2f;
	border-radius: 10px;
	
	justify-content: center;
	flex-direction: column;
}

.margin_rigt_5px
{
	margin-right: 5px;
}

.show_hide_emojis
{
	position: absolute;
	top: 2px;
	right: 5px;
	
	display: inline-block;
	padding: 3px 6px;
	
	font-size: 11px;
	border-radius: 15px;
	
	background-color: #9b51e0;
	color: #fff;
	
	cursor: pointer;
}

.fitness-emoji
{
	transition: top 2s;
	pointer-events: auto;
}

.hideEmoji
{
	top: 110px;
}

.allowEmoji
{
	position: absolute;
	top: 10px;
	right: 10px;
	
	display: inline-block;
	padding: 10px 15px;
	
	color: #fff;
	background-color: #9b51e0;
	
	border-radius: 15px;
	font-size: 15px;
	
	cursor: pointer;
}

/* ANDREJ END */
.draw-icon
{
	background:#9b51e0 url(./../images/draw.png);
    float: left;
    top: 0px;
    left: 70px;
    cursor: pointer;
    width: 70px;
    height: 50px;
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
	z-index: 99;
}

.canvasDot
{
	position: absolute; 
	display: none; 
	width: 10px; 
	height: 10px; 
	border-radius: 100%; 
	background-color: #000;
	
	z-index: 11;
}

.canvasDraw
{
	position: relative; 
	width: 100%!important;
	height: 100%!important;
	max-width: calc(100vh * (16/9)) !important;
	max-height: calc(100vw * (9/16)) !important;
	
	z-index: 10;
}

.canvasGrid
{
	position: absolute; 
	top: 0px;
	left: 50%;
	width: 100%!important;
	height: 100%!important;
	max-width: calc(100vh * (16/9)) !important;
	max-height: calc(100vw * (9/16)) !important;
	
	transform: translateX(-50%);
	z-index: 9;
}

.canvasImage
{
	display: none;
	max-width: calc(100vh * (16/9)) !important;
	max-height: calc(100vw * (9/16)) !important;
	z-index: 8;
}

.paletteHolder
{
    display: flex;
	position: relative;
    height: 50px;
    justify-content: center;
    align-items: center;
    z-index: 11;
}

.equipmentTagsHolder, .actStartHost, .actStartHost2, .equipmentTagsHolderDem
{
    padding: 1vw 2vw;
    display: flex;
    justify-content: center;
    align-items: center;
	
    background: rgb(229, 219, 255);
    color: rgb(77, 41, 104);
    font-weight: bold;
	
    border-radius: 10px;
	overflow: hidden;
    z-index: 11;
	vertical-align: middle;
	font-size: 1.2vw;
	
	cursor: pointer;
}

#workoutAreaButton
{
	padding: 1vw 2vw;
    display: flex;
    justify-content: center;
    align-items: center;
	
    background: rgb(255,0,0);
    color: #fff;
    font-weight: bold;
	
    border-radius: 10px;
	overflow: hidden;
    z-index: 11;
	vertical-align: middle;
	font-size: 1.2vw;
}

.actStartHost2
{
	top: 110px;
}

.equipment_setup_hold
{
	padding: 15px 30px !important;
    font-size: 24px !important;
}

.equipmentInstructions
{
	position: fixed!important;
	left: 0;
	top: 0;
	width: 100vw!important;
	height: 100vh!important;
	max-width: 100vw!important;
	max-height: 100vh!important;
	background: rgb(29, 28, 41)!important;
	
	z-index: 9999;
}

.equipmentSetup
{
	display: inline-block;
	width: 25%;
	padding-left: 5vw;
	padding-top: 7vw;
	vertical-align: top;
}

.videoMargin
{
	margin-left: 2vw;
	margin-top: 6%;
}

.smallerButton
{
	display: inline-block;
}

.equipmentSetupText
{
	display: inline-block;
	padding: 0 1.3vw;
	
    color: #000;
    font-weight: bold;
	font-size: 1.2vw;
	
	background-image: url('../images/checked.png');
	background-repeat: no-repeat;
	background-position: left;
	background-size: 1vw;
}

.movedEqButtonHold
{
	position: absolute;
    left: 50%;
    top: 10px;
    transform: translateX(-50%);
	padding: 10px;
	z-index: 11;
}

.audioPlayingHold
{
	position: absolute;
	right: 50px;
	top: 0px;
	
	z-index: 11;
}

.audioPlayingIcon
{
	padding: 16px 16px 23px 33px;
	background: #9b51e0 url(./../images/volume_controll.png);
	background-repeat: no-repeat;
	background-size: 25px;
	background-position: center;
	border-radius: 10px;
	color: #fff;
}

.buttonHoldPart
{
	top: 50%;
	transform: translate(-50%, -50%);
}

.whiteBkg
{
	background-color: #fff;
	border-radius: 5px;
}

.equipment_allow
{
	top: 20px !important;
}

.equipment_allow_text
{
	font-size: 23px !important;
}

.paletteHolder2
{
	height: 50px;
	max-width: calc(100vw - 550px);
	border: 3px solid #6D118C;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #413f40;
	border-radius: 25px;
	overflow: hidden;
    z-index: 11;
}

.paletteFlex
{
	position: relative;
	max-width: 55% !important;
	justify-content: center;
	padding: 43px 0 !important;
    margin: auto;
}

.closePalette
{
	position: absolute;
	right: -20%;
	top: 51px;
	
	height: 35px;
	width: 35px;
	
	background-size: 15px 15px;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/right_close.svg');
	
	border: 2px solid #E4DAFF;
	border-radius: 10px;
	
	cursor: pointer;
}

body.zoomParticipantOn .paletteFlex
{
	position: fixed;
	top: 10px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 100000;
}

.palette-dropdown
{
	height: 100%;
	padding: 0px 20px 0px 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	cursor: pointer;
	width: 108px;
	
	background: #fff;
	background-repeat: no-repeat;
	background-size: 13px;
	background-position: right 10px center;
	border-radius: 10px;
}

.paletteHolder span
{
	display: inline-block;
	vertical-align: middle;
	margin: 0 5px;
}

.paletteHolder span:hover
{
	background-color: #6D118C!important;
}

.paletteHolder2 span:hover
{
	background-color: #6D118C!important;
}

.paletteHolder select {
  /* for Firefox */
  -moz-appearance: none;
  /* for Chrome */
  -webkit-appearance: none;
  
  border-right: 3px solid #6D118C;
}

/* For IE10 */
.paletteHolder select::-ms-expand {
  display: none;
}

.canvasHold
{
	position: absolute; 
	top: 0px; 
	left: 0px; 
	width: 100%; 
	height: 100%;
	max-width: calc(100vh * (16/9)) !important;
	max-height: calc(100vw * (9/16)) !important;
	
	border-radius: 10px;
	overflow: hidden;
}

.canvasBorder
{
	border: 5px solid #9b51e0;
}

.centerCanvasHold
{
	display: flex;
	justify-content: center;
	align-items: center;
}

.hostNoVideoIcon
{
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	
	height: 150px;
	width: 150px; 
	margin: auto;
	
	background: url(./../images/host_offline.png);
	background-size: 100%;
	background-position: center;
	background-repeat: no-repeat;
}

.canvas-draw-icon
{
	background: url(./../images/freehand-27247.svg);
    width: 60px;
    height: 50px;
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-line-icon
{
	background: url(./../images/Icon-awesome-grip-lines.svg);
    width: 60px;
    height: 50px;
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-square-icon
{
	background: url(./../images/Icon-ionic-ios-square-outline.svg);
    width: 60px;
    height: 50px;
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-circle-icon
{
	background: url(../images/Icon-awesome-circle.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.line-width-hold
{
    position: absolute;
    top: 100%;
	display: flex;
    justify-content: center;
    align-items: center;
    height: 50px;
    padding: 10px;
    background: rgb(65, 63, 64);
}

.line-width-text
{
    width: 50px;
	color: #fff;
}

.line-width-input
{
    display: inline-block;
	-webkit-appearance: none;
	width: 100%;
	height: 5px;
	background: #fff;
	outline: none;
	opacity: 0.7;
	-webkit-transition: .2s;
	transition: opacity .2s;
	border-radius: 5px;
}

.line-width-input:hover 
{
	opacity: 1;
}

.line-width-input::-webkit-slider-thumb 
{
	-webkit-appearance: none;
	appearance: none;
	width: 15px;
	height: 15px;
	border-radius: 50%; 
	border: 2px solid #9b51e0;
	background: #fff;
	cursor: pointer;
}

.line-width-input::-moz-range-thumb 
{
	width: 15px;
	height: 15px;
	border-radius: 50%;
	border: 2px solid #9b51e0;
	background: #fff;
	cursor: pointer;
}

.canvas-joined-icon
{
	background: url(./../images/Icon-material-linear-scale.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.share-all-icon
{
	background-image: url(./../images/share-all-icon.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.remove-share-all-icon
{
	background-image: url(./../images/remove-share-all.svg);
}

.canvas-angle-icon
{
	background: url(./../images/angle-icon.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-grid-icon
{
	background: url(./../images/Icon-ionic-md-grid.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-trash-icon
{
    height: 33px;
	min-width: fit-content;
	margin: 0px 5px;
	padding: 4px 10px;
	border: 1px solid #E4DAFF;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
	color: #E4DAFF;
    border-radius: 10px;
	text-align: center;
    cursor: pointer;
	z-index: 99;
}

.canvas-ladder-icon
{
	background: url(./../images/ladder.svg);
    width: 60px;
    height: 50px;
    background-size: 15px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-color-icon
{
	position: relative;
	background: url(./../images/Icon-ionic-md-color-fill.svg);
    width: 60px;
    height: 50px;
	background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-screenshot-icon
{
	position: relative;
	background: url(./../images/cameradraw.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.screenshot-arrow
{
	position: absolute;
	left: 0px;
	bottom: 3px;
	background: url(./../images/bottom_arrow_new.svg);
	background-size: 7px;
	background-repeat: no-repeat;
	background-position: center;
	width: 100%;
	height: 10px;
}

.color-picker-holder
{
	width: 100%;
	height: 100%;
	border: 2px solid #fff;
	border-radius: 50px;
	overflow: hidden;
}

.color-picker-inside
{
	position: absolute;
	top: calc( 100% - 10px );
	left: 0;
	
	border: 0;
	padding: 0;
	width: 100%;
	height: 5px;
	cursor: pointer;
}

.color-picker-inside::-webkit-color-swatch-wrapper {
    padding: 0;	
}
.color-picker-inside::-webkit-color-swatch {
    border: none;
}

.canvas-eraser-icon
{
	background: url(./../images/eraser-tool.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-close-icon
{
	position: absolute;
    top: 0;
    right: 0;
    padding: 20px 25px;
    background: #9b51e0 url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADMAAAAzCAYAAAA6oTAqAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA3ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTQ1IDc5LjE2MzQ5OSwgMjAxOC8wOC8xMy0xNjo0MDoyMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo2Y2Y5ZjkwYi03NWE0LTk0NDktYWEzYy0zMjQ5YWM3MzczMTYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QzcwMjk0RUQyMDE2MTFFQUJCNzM5NEU1RjZGREQ3RDYiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QzcwMjk0RUMyMDE2MTFFQUJCNzM5NEU1RjZGREQ3RDYiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTkgKFdpbmRvd3MpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDMxZjFmYjAtZDZhZS1lNDRlLTkzNjUtNzE2NDIyNTFmOTI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjZjZjlmOTBiLTc1YTQtOTQ0OS1hYTNjLTMyNDlhYzczNzMxNiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pu6ulRwAAAUgSURBVHjazJpriFVVFMfvXEbzkak4TjpmVpojNjRSOb2GSZQwgtSQNBlfMw6kgjU0aWaOTX3wg0UQKkU1PhLUUlPRwgcSqAWiIk1+yDHD18ygaT4QH9l4+29YB3aLtc85e+9zZ1zw43LP2a//2Y+z9jo7J5PJpBKynmAYeAIMBgNBL9Af5FKaFnARnAaNoIH4I4kG5HiKyQGvgPGgBAxxKOMy2Ad2g3XggnNrlBgH7gVV4GgmWWsGS8AAl3a5CBkDDmeya5fAeyDXpm02w6w3WAKmh6S5QnPhZ/o9AW6zNH1pOD4FngT5IeUdBdVgT5LDrBQ0hDzJvWARKLDs5a5gMvge/GsouxW8ldQwGw9uGyr6AYx1nHec4eCTkAe23FfMREPBLaAiIRGcMvCTod7PXMWMMXT9TtfVxpI6g6DPbcUUg1tCQcvaQITOVJoz3ObFFaPeIb8KBXzaxkICXgY3hEXh2ThilgpCVraTkIBJQpuOgXvCxJQImdQLMqedxaRo6ef2UZiYvSzxZVB4FwgJ4KvcLX0x4mOT29yIwlWPjQSjPBv5OK2ePSPSDRMWpqWSmB0sUSPoFFH4ci39KkchU7QG/gbyI9IvY+28FngeQYJCQfGbEYX2FXpytaWQGUIZVRF5HhLaOkcXU8NuNpHfFFbofeCk0Jg1MYVMN7wUX4iRdwXL80sgpiPY5fhOeY7cdW7rHHpE2YKY9Y5i+a6DoepGEbjp8HQCRhq8hdWWQhZa1NkZnGD5Z6dojOr2F7jfcuyPAFdj9NBUg5A6h4VjIyvjS3VxMbu423FVGkHdza2edozlBiGLHOtbyLcjKXp6/1Po8b4YTUslt33gH485IjGBlXUkTdtY3Zo8ojU7wUu0fdatFHRg1+rAYo+6zoA72v98JaZPKlnbD14Dpwz3L4F3wYee9ajYQqv2P0+JyQixMF9TMbANhnvNFBjxNd7uTJp1VYqpdbUq8Ibh3mNgRQJ1qGGb5mKaWaKOnpVMA1+BbiFpKsDaBMToo+hcmuK/uj3gUcEMsEq4Xi/UMwl841HXANYzF9SfP1migcLKE8cqwdfC9fk07FTjb7B7UzwE8bj2WbVevy641A9arvmVMV+IKpj4t5DuO4fd7HYehlIXBwvO4mhPN15ZraUvZ7Mf6g7OsvwVKXI1tjgWXG4pRBd01RA46RCj3ldZvitqNAU3Z7KbqqJ+EQX2Nrj/cX2tMoPrMy5G3m0szx59c1YgNOyDiAILhIjnAgdfjsfEJkfkKRIeQCWPAXzLEpynpx9WcDW4Q6LmOjqMT2t7k020gw1Lv5618xzowcUMtw1UE4+Ahz2jM71oIbLdYSp73xQ3Wy+EQUvvkphZF4pi8tGTZxIzSFg2j9NS2N5i6oVemRkVa54vZNpu+30xYd4R2rQ/TuBcvYl/FDJvpUhOWwuZJbTlouSlhC27TQZBPdpQSK3hpTzB9stZMU0wburb//NZFpFH/ppkNa7fNEsMgtQi8XGWeklFOk/ZCon7tfkZOjkhmXrZvU1xZ18RYw1zNbDqpE5o9Bdcbt1Ogy/IPekWs8xc+kShAoAHQso+A15M+oSGslpQA7qHpDlPJ5V+p9NKNymuEOzZVWhrKCgGBaBTSFkqKDIPnMzWQaAiwVNI2g6Rm5/1g0B6OHarYRvgYq30lbucvnhbt8n3vJmyQlBO583KQGfL/IfBQbAZ7GrPw3Pc1Fx4lCInKjDST4v2pGk+tVC0s5HmQgPNK2/7T4ABAH72XCt8mgT9AAAAAElFTkSuQmCC');
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 0 8px 0 0;
    cursor: pointer;
    z-index: 99;
}

.canvas-cone-icon
{
	background: url(./../images/Cone.svg);
    width: 60px;
    height: 50px;
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-box-icon
{
	background: url(./../images/Box.svg);
    width: 60px;
    height: 50px;
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-hurdle-icon
{
	background: url(./../images/hurdle-race.svg);
    width: 60px;
    height: 50px;
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-bag-icon
{
	background: url(./../images/Punching_Bag.svg);
    width: 60px;
    height: 50px;
    background-size: 12px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-ball-icon
{
	background: url(./../images/ball_exercise.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-gallery-icon
{
	background: url(./../images/gallery.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-note-icon
{
	background: url(./../images/note-icon.svg);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.canvas-help-icon
{
	background: url(./../images/bulb.png);
    width: 60px;
    height: 50px;
    background-size: 25px;
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	z-index: 99;
}

.squat-line-text
{
    padding: 0 5px;
	flex: none;
	
	color: #fff;
	font-size: 15px;
    text-align: center;
    line-height: 1;
}

.canvas-squat-line
{
	border: none!important;
	padding: 0 15px 0 5px;
	
	background: url(./../images/bottom_arrow_new.svg);
	background-repeat: no-repeat;
	background-size: 10px;
	background-position: right center;
	color: #fff;
}

.canvas-squat-line option
{
	background: #2F2F2F;
}

.palette-drawing
{
	display: flex;
	align-items: center;
	overflow-x: auto;
	overflow-y: hidden;
}

.palette-equipment
{
	display: flex;
	align-items: center;
	overflow-x: auto;
	overflow-y: hidden;
}

.screenshot-dropdown
{
	position: absolute;
	left: 60%;
	top: 100%;
	background: #27212c;
	max-height: 400px;
	padding: 5px 0px;
	
	overflow-x: hidden;
	overflow-y: auto;
	z-index: 999;
}

.canvas-note-hold
{
	width: 100%;
	padding: 10px;
	color: #fff;
	cursor: pointer;
}

.canvas-note-hold:hover
{
	background: #3f2b51;
}

.no-img:hover
{
	background: none;
	cursor: default;
}

.note-img
{
	display: inline-block;
	padding: 60px 110px;
	
	background-repeat: no-repeat;
	background-size: cover;
	background-position: left center;
	
	vertical-align: middle;
}

.note-img2
{
	display: inline-flex;
    width: 65%;
    height: auto;
    padding-right: 20px;
	
    border-radius: 10px;
    vertical-align: top;
}

.note-img2 img
{
	height: 100%;
    width: 100%;
    background-size: cover;
    border-radius: 10px;
}

.note-right-side
{
	display: inline-flex;
    flex-direction: column;
    justify-content: space-between;
    width: 35%;
}

.note-textarea-hold
{
	position: relative;
	width: 100%;
    height: 100%;
    padding-bottom: 20px;
}

.note-text-holder
{
	display: inline-block;
	font-size: 14px;
    padding-left: 10px;
	max-width: 150px;
	
	vertical-align: middle;
}

.note-text
{
	display: block;
	display: -webkit-box;
	max-width: 100%;
	max-height: 45px;
	margin: 0 auto;
	font-size: 14px;
	line-height: 1;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
	word-break: break-all;
}

.bottom-line
{
	height: 2px;
	background: #35303a;
	margin: 2px 4px;
}

.note-view-text
{
	max-height: 100px;
	margin-bottom: 10px;
	
	font-size: 16px;
	text-align: left;
	color: #fff;
	
	word-break: break-all;
    overflow-y: auto;
}

.padTop5
{
	padding-top: 5px;
}

.padbtt
{
	padding: 5px 30px 7px 30px;
}

.note-view-image
{
	box-shadow: 0 0 0 1px #696969;
	width: 100%;
}

.centerCanvas
{
	position: absolute;
	top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%);
	
	z-index: 2;
}

.pos-left
{
	left: 0px;
	border-radius: 8px 0 0 0;
}

.video_behind_loader{
	position: absolute;
    z-index: 2;
}

.videoFullScreen
{
	width:100vw!important; 
	height:100vh!important;
}

#canvasNotePopup
{
	left: 50% !important;
	top: 0px !important;
	transform: translateX(-50%) !important;
}

.note-modal
{
	position: absolute;
	left: 50%;
	top: 50%;
	
	transform: translate(-50%, -50%);
	
	z-index: 999;
}

.note-modal-title
{
	padding-left: 1rem;
	color: #fff;
}

.canvas-note-textarea 
{
    position: relative;
    width: 100%;
	height: 100%;
    padding: 20px 18px;
    border: 2px solid #b002ed;
	
    background: rgb(52, 33, 59);
    color: #fff;
    font-size: 18px;
	
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
	
	outline: 0;
    border-radius: 0px 8px 8px 8px;
}

.cover-border
{
	position: absolute;
    top: 0px;
    left: 8px;
    width: max-content;
	padding: 0px 10px;
    height: 2.3px;
	background-color: #2a2a2a;
    z-index: 2;
}

.note-description
{
	position: relative;
	top: -12px;
	width: 100%;
	color: #fff;
	text-align: center;
}

.buttons-holder
{
	display: flex;
	justify-content: center;
	align-items: center;
}

.cancel-btn
{
	border: none;
	background: none;
    font-size: 19px;
	margin: 14px;
}

.note-view-holder
{
	background: #27212c;
}

.close-note-view
{
	position: absolute!important;
    right: 0px;
	width: 30px;
    height: 30px;
    border: none !important;
    padding: 0!important;
    float: right;
	
    background-color: #7c1f9c !important;
	
    font-size: 23px;
    text-shadow: none !important;
    font-weight: inherit !important;
    font-family: "Avenir-Medium";
    color: #fff!important;
    line-height: 1;
	
    border-radius: 50% !important;
    opacity: 1;
    transform: translate(10px, -10px);
    
    z-index: 99;
}

.close-note-view:hover
{
	opacity: .75;
}

.mw-70
{
	max-width: 70%;
}

.mw-400
{
	max-width: 400px;
}

.mw-500
{
	max-width: 500px;
}

.mw-600
{
	max-width: 600px;
}

.mw-800
{
	max-width: 800px;
}

.mind_close
{
	position: absolute;
    top: -5px;
    right: -4px;
   
	width: 30px;
    height: 30px;
	
	background-image: url('../images/close_mind.svg');
	background-position: center;
	background-size: 12px;
	background-repeat: no-repeat;
    
	border-radius: 50%;
	border: 2px solid #9b51e0;
	
	z-index: 10;
	cursor: pointer;
}

.rep-count
{
	padding-top: 3px;
	padding-left: 15px;
    color: #fff;
    line-height: 1;
	text-align: center;
	
    z-index: 1000;
}

#repcounter.behindHRT, #perMinuteCounter.behindHRT, .participant_stats_hold.behindHRT
{
	left: 90px !important;
}

#repcounter.behindHRT2, #perMinuteCounter.behindHRT2, .zoomFullScreen.behindHRT2, .participant_stats_hold.behindHRT2
{
	left: 40px !important;
}
.zoomFullScreen.behindHRT2
{
	/* left: 100px !important; */
}
.onDemandCounter
{
	top: 55px;
}

.onDemandCounter2
{
	top: 160px!important;
}

.click-camera-mainview.behindHRT
{
    left: 155px;
}

.click-switch-camera-mainview.behindHRT
{
    left: 201px;
}

.click-zoom-mainview.behindHRT
{
    left: 228px;
}

.pip.behindHRT
{
    left: 90px !important;
}

#activityCounter
{
    max-width: 140px;
    min-width: 110px;
    padding: 5px 7px;
}

#activityName
{
	left: auto;
	top : 116px;
	right: 5px;
	
	max-width: 140px;
	min-width: 110px;
	padding: 10px 0px;
}

#activityName .act-name
{
	max-width: 150px;
	font-size: 25px;
	font-weight: bold;
	line-height: 1.5;
    overflow: hidden;
}

.counter-text
{
	margin: auto;
	min-width: 100px;
	max-width: calc( 100% - 10px );
	
	font-size: 15px;
}

.tooltip_hold
{
	position: absolute;
    display: none;
	
    top: 38px;
    left: -36px;
	
    width: 100px;
	
    border-radius: 5px;
    background-color: #bd00ff;
    box-shadow: 0px 1px 1px 1px rgba(0,0,0, 0.2);
    text-align: center;
	color: #fff;
	
	z-index: 20;
}

.tooltip_active
{
	position: relative;
	display: flex;
	z-index: 1000;
}

.tooltip_hold.pink_info
{
	right: -12px;
	padding-top: 0px;
	
	background-color: #000;
}

.tooltip_hold.pink_info::after
{
	position: absolute;
	top: -6px;
	right: 39px;
	content: '';
	width: 20px;
	height: 20px;
	
	background-color: #000;
	transform: rotate(135deg);
	
	 z-index: 10;
}

.stand_still_box
{
	padding: 5px;
}

.tool_tip_inner
{
	padding: 5vw;
	
	text-align: left !important;
	border-radius: 0 2vw 2vw 0 !important;
}

.tool_tip_inner_host
{
	max-width: 100%;
	max-height: 100%;
	width: max-content;
	height: max-content;
	padding: 1vw;
}

.tooltip_text
{
	position: relative;
    display: inline-block;
	
    width: 100%;
    padding: 5px;
	
    font-size: 11px;
	
    z-index: 20;
    text-align: center;
	
	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome, Edge, Opera and Firefox */
	
}

.hostCam
{
	position: relative;
	transition: 2s;
}

.hostCamLeft
{
	left: 20px;
	transform: translateX(-100%);
}

.hostCamBack
{
	position: absolute;
	top: 0px;
	right: 0px;
	
	width: 30px;
	height: 30px;
	
	background: #9b51e0 url(../images/back-arrow-right.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px;
	cursor: pointer;
	pointer-events: auto;
	
	transition: 1s;
	border-radius: 0 8px 0 0;
	z-index: 99;
}

.backLeft
{
	left: 0px;
	right: auto;
	
	transform: scaleX(-1);
}

.flipCanvas
{
	transform: scaleX(-1);
}

.zoom1
{
	zoom: 1 !important;
}

/* Safari */
@-webkit-keyframes spin 
{
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin 
{
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

#previous-recording-found .ok_btn_cont
{
	text-align: center;
    width: 100%;
}

.notshow-btn
{
    padding: 10px 20px;
    background: transparent;
    border: none;
    border-radius: 30px;
    font-size: 19px;
}

.skip-btn {
    padding: 8px 30px;
    background: transparent;
    border: 2px solid #6b128d;
    border-radius: 30px;
    font-size: 15px;
}

.notshow-btn a:hover, .yesgo-btn a:hover, .skip-btn a:hover
{
    text-decoration: none;
}

.yesgo-btn {
    padding: 8px 30px;
    background: #6b128d;
    border: 2px solid #6b128d;
    border-radius: 30px;
    font-size: 15px;
}

.modal-confirm1 {
    width: 650px;
}

.bg-purple {
    background-color: #28232d;
    border: 3px solid #4a484a;
    border-radius: 15px !important;
}

.custom-modal p {
    margin-bottom: 45px;
    font-weight: 300;
    line-height: 50px;
}

.custom-modal .custom-control.custom-checkbox {
    display: flex;
    align-items: center;
    min-height: 40px;
}

.modal-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
}

.modal-buttons button + button {
    margin-left: 15px;
}
.modal-body.custom-modal {
    padding: 20px 20px;
}

.custom-modal .custom-control-input:checked ~ .custom-control-label::before, .custom-modal .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
    color: #fff;
    border-color: #6b128d;
    background-color: #6b128d;
}

.custom-modal .custom-control-label::before {
    position: absolute;
    top: 3px;
    width: 18px;
    height: 18px;
    background-color: transparent;
    border: #6b128d solid 3px;
}

.custom-modal .custom-control-label 
{
    font-weight: 300;
}

.custom-modal .custom-control-input:focus ~ .custom-control-label::before {
    box-shadow: none !important;
    border-color: #6b128d !important;
}
 
.video-holder-host.zoom-video .videoPopup > small + div::before
{
    content: '';
    border: 65px solid #00000070;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 99;
    border-left-width: 50px;
    border-right-width: 50px;
}

.click-zoom
{
    z-index: 9999;
}

#fullbodymsg-one, #fullbodymsg-two
{
    z-index: 9999;
    font-size: 38px;
}

.counter_button_hold
{
    height: auto;
	margin: 0;
    padding: 3px 19px;
	
	font-family: 'Avenir-Black';
    font-size: 22px;
    color: #fff;
	
	border-radius: 30px;
}

.counter_inner_text
{
	margin: 0 !important;
	font-size: 21px !important;
}

.activity_list_title
{
	padding-top: 20px;
	text-align: center;
	font-size: 25px;
	color: #fff;
}
 
 
.activity_list_border
{
	height: 1px;
	margin: 10px 0;
	border-top: 1px solid #fff;
}

.acitvity_close_button
{
	position: absolute;
    top: 33px;
    right: 12px;
	width: 30px;
	height: 30px;
	background-image: url('../images/close_main.png');
	background-size: 100% 100%;
	background-repeat: no-repeat;
	background-color: #000;
	border-radius: 50%;
    cursor: pointer;    
	z-index: 5;
}

.operation_title
{
	display: -webkit-box;
    max-width: 100%;
	height: 45px;
    max-height: 45px;
    margin: 0 auto;
	margin-bottom: 15px;
    font-size: 21px;
    text-align: center;
    line-height: 1;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.transpartent_video
{
	background-color: transparent !important;
}

.guest_video_hold
{
	display: block !important;
}

.blur_activity
{
	filter: blur(4px);
}

.main_video_close_hold
{
	position: relative;
	text-align: left;
    max-width: 1000px;
}

.close_video_btn
{
	top: -40px;
    right: 6px;
}

.activityTimingHold
{
	display: inline-block;
	vertical-align: middle;
}

.activity_section_hold
{
	padding-top: 15px;
    text-align: center;
    position: relative;
}

.activity_list_video
{
	display: inline-block;
	margin-left: 10px;
	vertical-align: middle;
	cursor: pointer;
}
.activity_list_video img
{
    width: 50px;
    height: 40px;
}
.ac_list_counter
{
	display: inline-block;
	font-size: 25px;
}

.ac_list_counter_active
{
    margin: 0px 5px;
}

.ac_list_description_active
{
    margin: 0px 5px;
}

.session-heading
{
    color: #fff;
    position: absolute;
    top: 5px;
    font-size: 18px;
}

.session-heading-desc
{
    color: #fff;
    font-size: 16px;
    left: 25%;
    margin-bottom: 25px;
    text-align: center;
}

.session-list-footer{
    margin-top: 35px;
    text-align: center;
}

.zoomFullScreen
{
	position: absolute;
	left: 10px;
	top: 10px;
	width: 60px;
	height: 40px;	
	background-image: url('../images/zoomp.svg');
    background-size: 30px;
	z-index: 1000;	
	cursor: pointer;
    border-radius: 20px;
    background-color: #9b51e0;
    background-repeat: no-repeat;
    background-position: center;
}

.zoomFullScreenButton
{
	display: none;
	position: absolute;
	left: 50px;
	top: 10px;
	
	padding: 5px 20px;
    font-size: 15px;
	
	z-index: 1000;
	
	cursor: pointer;
}

.zoomHostFull .zoomFullScreen
{
	background-image: url('../images/zoomm.svg');
}

.zoomHostFull .zoomFullScreenButton
{
	display: block;
}

.pre-zoom-video1 video { object-fit: contain !important; background-color: #000 !important;}
.for_cameras_main ::before { border: none !important; }

.zoomHostFull .heartrateg, .zoomHostFull footer, .zoomHostFull .rightVideoList { display: none !important; }

body.zoomHostFull .guestmiddlescreen .fullVideoBox { width: 100vw !important; height: calc(100vh - 70px) !important; }

body.zoomHostFull .guestmiddlescreen #agora_host video, body.zoomHostFull .guestmiddlescreen #agora_host canvas, body.zoomHostFull .guestmiddlescreen #agora_inject_stream video { max-width: 100vw !important; max-height: calc(100vh - 70px) !important;}
body.zoomHostFull .guestmiddlescreen #agora_host, body.zoomHostFull .guestmiddlescreen #agora_inject_stream { max-width: calc((100vh - 70px)*16/9) !important; }


body.zoomHostFull.zoomHostFullShow .heartrateg { display: inline-block !important; position: absolute; top: 65px; z-index: 100; }
body.zoomHostFull.zoomHostFullShow .no_margin_top_zoom { margin-top: 4px !important; }
body.zoomHostFull.zoomHostFullShow footer { display: block !important; }

body.zoomHostFull.zoomHostFullShow .rightVideoList { display: block !important; position: absolute !important; right: 2px; top: 55px; }

body.zoomHostFull.zoomHostFullShow .guestmiddlescreen .fullVideoBox { position: absolute; left: 0px; top: 55px; }
body.zoomHostFull.zoomHostFullShow footer .guestfooter .w-50 { width: calc((100vw - 310px) - 250px) !important; }

body .zoomFullScreen.behindHRT { left: 90px; }

body.zoomHostFull.zoomHostFullShow .zoomFullScreen.behindHRT { left: 90px; }
body.zoomHostFull.zoomHostFullShow .zoomFullScreenButton.behindHRT { left: 120px; }

body.showVideoList .zoomFullScreen.behindHRT { left: 90px; }
body.zoomHostFull .zoomFullScreen.behindHRT { left: 10px; }

/* Ondemand Video */
body.zoomHostFull .ondemandmiddlescreen .fullVideoBox { width: 100vw !important; height: calc(100vh - 70px) !important; }
body.zoomHostFull .ondemandmiddlescreen #agora_host video, body.zoomHostFull .ondemandmiddlescreen #agora_host canvas { max-width: 100vw !important; max-height: calc(100vh - 70px) !important; object-fit: contain !important; }
body.zoomHostFull .ondemandmiddlescreen #agora_host, body.zoomHostFull .ondemandmiddlescreen #agora_inject_stream { max-width: calc((100vh - 70px)*16/9) !important; }
body.zoomHostFull.zoomHostFullShow .ondemandmiddlescreen .fullVideoBox { position: absolute; left: 0px; top: 55px; }
body.zoomHostFull.zoomHostFullShow footer .ondemandfooter .w-50 { width: calc((100vw - 310px) - 250px) !important; }
body.zoomHostFull .ondemandmiddlescreen .progress-box 
	{
		left: auto;
		right: 10px;
		bottom: auto !important;
		top: 10px !important;
		transform: none;
	}
body.zoomHostFull.zoomHostFullShow .ondemandfooter .w-50 { margin-top: 10px; }

/* UROS NEW CAMERA - MICROPHONE - SPEAKER UI START */

.for_camera_and_mic
{
	display: inline-block;
	width: 100%;
	margin-top: 10px;
}

.inline_camera
{
	display: inline-block;
    width: 50%;
	padding: 0px !important;
    vertical-align: top;
}

.inline_speaker
{
	display: inline-block !important;
    width: 50%;
    vertical-align: top;
}

.main_title_conf
{
	margin-top: 10px;
	margin-bottom: 30px;
	padding-left: 15px;
	
	font-size: 20px;
	color: #fff;
	text-align: left;
	font-family: Avenir-Medium;
	letter-spacing: 0.5px;
	
	border-left: 4px solid #B002ED;
}

.for_cameras_main
{
	position: relative;
	display: inline-block;
	width: 50%;
	min-width: 340px;
	text-align: right;
}

.for_cameras_main video
{
	width: 340px !important;
	height: 191px !important;
	border-radius: 10px;
	border: 2px solid #E4DAFF;
}

.for_cameras_main canvas
{
	width: 340px !important;
	height: 191px !important;
	zoom: 1 !important;
	border-radius: 10px;
	border: 2px solid #E4DAFF;
}

.for_cameras_cbx
{
	display: inline-block;
    width: 50%;
	min-width: 340px;
	
	padding-top: 0px;
    
	text-align: left !important;
    
	vertical-align: top;
}

.start_room_button_holder
{
	position: absolute;
	left: 0px;
	top: 0px;
    width: 100%;
    height: 100vh;
	
	display: flex;
    justify-content: center;
    align-items: center;
	
	margin: auto;
}

.inside_session_button
{
	z-index: 9999;
}

.inline_cbx
{
	display: block !important;
	margin-bottom: 20px;
}

.for_cameras_cbx .check-camera label, .turning_video_container .one_off_option label
{
	font-size: 16px;
}

.for_cameras_cbx .form-radio, .turning_video_container .form-radio
{
	height: 30px;
    width: 30px;
}

.for_cameras_cbx .form-radio:checked, .turning_options_container .form-radio:checked
{
	border-radius: 50%;
}

.for_cameras_cbx .form-radio:checked::before, .turning_video_container .form-radio:checked::before, .for_select_setups .form-radio:checked::before
{
    top: 3px;
	left: 7px;
	font-size: 16px;
}

.for_all_test_sp
{
	display: inline-block;
	
	width: 100%;
	
	padding-bottom: 40px;
	padding-left: 30px;
	padding-right: 20px;
	
	text-align: left;
}

.all_width_mic
{
	display: inline-block;
	
	width: 100%;
}

.main_title_speakers
{
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #FCFCFC;
}

.left_speakers
{
	display: inline-block;
	width: 400px;
	text-align: left;
	vertical-align: middle;
}

.right_speakers
{
	display: inline-block;
	text-align: center;
	vertical-align: middle;
}

.select_field
{
	border-radius: 0px 12px 12px 12px;
    background: rgb(52, 33, 59);
    color: #fff;
    border: 2px solid #b002ed !important;
    height: 60px;
    width: 97%;
    padding-left: 12px;
	padding-right: 50px;
    font-size: 18px;
    position: relative;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
	background-image: url(../images/dropdown.svg);
    background-repeat: no-repeat;
    background-position: right 15px center;
}

.main_select
{
	width: 97%;
	height: 60px;
	
	padding-left: 12px;
	padding-right: 50px;
	
	background: #24223D;
	
	border: 1px solid #FCFCFC;
	box-sizing: border-box;
	border-radius: 16px;
	
	color: #FCFCFC;
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	
	background-image: url(../images/select_arrow.svg);
    background-repeat: no-repeat;
    background-position: right 15px center;
	background-size: 12px 6px;
	
	-moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
	
	outline: none;
}

.cameraSelect
{
	position: relative;
	top: -185px;
	width: 45%;
}

.main_select:focus{
   border: 1px solid #FCFCFC !important;
}

.test_title
{
	font-size: 26px;
	font-weight: 500;
	text-align: center;
	color: #fff;
}

.relative_test
{
	position: relative;
	padding-left: 60px;
	cursor: pointer;
}

.absolute_mic
{
	position: absolute;
    top: 50%;
    left: 20px;
	transform: translateY(-50%);
    
	width: 18px;
    height: 22px;
    
	background-image: url(../images/mic_ps.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.cursor
{
	cursor: pointer;
}

.mb90
{
	margin-bottom: 90px;
}

.mb30
{
	margin-bottom: 30px;
}

.absolute_spc
{
	position: absolute;
    top: 50%;
    left: 20px;
	transform: translateY(-50%);
    
	width: 22px;
    height: 16px;
    
	background-image: url(../images/speaker_ps.svg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.gray_clr
{
	color: #c7c7c7;
}

.for_visualizer
{
	position: relative;
	display: inline-block;
	width: 250px;
	height: 90px;
	
	padding-left: 60px;
}

#audio-media-content svg
{
	display: block;
	position: absolute;
	
	width: 100%;
	height: 100%;
	
	padding: 0;
	margin: 0;	
}

#audio-media-content path
{
	stroke-linecap: round;
	stroke: white;
	stroke-width: 10px;
	stroke-linejoin: round;
}

#test_mic, #test_mic_rec, #test_speakers
{
	padding: 30px 0px;
}

.t23
{
	top: 23px;
}

.h375
{
	height: 375px;
}

.for_in_session_test
{
	display: inline-block;
	width: 100%;
	
	padding-top: 10px;
	padding-bottom: 20px;
	
	text-align: center;
}

.device_title
{
	padding-bottom: 15px;
	padding-top: 0px;
	
	text-align: left;
}

.for_svg_audio
{
	position: relative;
	
	display: inline-block;
	
	width: 100%;
	height: 90px;
	
	padding-left: 70px;
	
	cursor: pointer;
}

.for_svg_audio svg
{
	height: 90px;
}

.spc_svg
{
	top: 22px;
    left: 20px;
}

.w320
{
	width: 320px;
}

@media screen and (max-width: 1050px)
{
	.inline_speaker, .inline_camera
	{
		width: 100%;
		margin-bottom: 5px;
	}
	
	.h375
	{
		height: auto;
	}
}
/* UROS NEW CAMERA - MICROPHONE - SPEAKER UI END */

/*SRETEN ONDEMAND START*/

.ch_progress
{
	padding: 0px 10px !important;
}

.ch_justify_lft
{
	justify-content: flex-start !important;
	min-width: 73px !important;
	margin-right: 5px;
}

.ch_justify_rght
{
	min-width: 130px !important;
	justify-content: flex-end !important;
}

.min_w12
{
	min-width: 12px !important;
}
/*SRETEN ONDEMAND END*/

.new_padd_swiper
{
	padding-right: 100px !important;
}
.new_script_flow
{
	word-break: break-word;
    white-space: break-spaces;
	
	font-size: 28px !important;
	top: -15px;
	line-height: 22px;
}
.swiper-slide-next .new_script_flow 
{
	top: 10px;
	font-size: 35px !important;
	line-height: 30px;
}
.swiper-slide-next .count-box .countdown
{
	top: 5px;
	margin-top: 20px;
}
.countdown_tutorial
{
	top: -6px !important;
	margin-top: 0px !important;
}
.new_script_name_part
{
	top: -4px;
	width: 100% !important;
	
	word-break: keep-all ;
	
	line-height: 1 !important;
	font-size: 35px !important;
	
	z-index: 10 !important;
}

.script_background_none
{
	background: none !important;
}

.zoomHostFullShow .ondemandfooter .swiper-container
{
	top: -8px;
}

.zoomHostFullShow .ondemandfooter .new_script_name_part
{
	font-size: 25px !important;
}

.zoomHostFullShow .ondemandfooter .count-timer
{
	min-height: 85px;
    min-width: 85px;
    max-height: 85px;
    max-width: 85px;
}

.zoomHostFullShow .ondemandfooter .countdown-number
{
	font-size: 45px;
}

.zoomHostFull .ondemandfooter .swiper-container
{
	top: -8px;
}

.zoomHostFull .ondemandfooter .new_script_name_part
{
	font-size: 35px !important;
}

.zoomHostFull .ondemandfooter .count-timer
{
	min-height: 85px;
    min-width: 85px;
    max-height: 85px;
    max-width: 85px;
}

.zoomHostFull .ondemandfooter .countdown-number
{
	font-size: 45px;
}

.ondemandmiddlescreen .progress-box
{
	border-radius: 20px;
    background: rgba(0, 0, 0, 0.4);
}


.help_inner_text
{
	padding: 10px 0px;
	margin: 0;
}

.participant_streaming_container  #sessionCanvas { transform: scaleX(-1) !important; }
#agora_host #onDemandStream #sessionCanvas { transform: scaleX(-1) !important; }
#local-media #sessionCanvas { transform: scaleX(-1) !important; }
#imageCanvas { position: absolute !important; transform: translateX(-50%) scaleX(-1) !important; }
#bufferCanvas { width: 100% !important; height: 100% !important; display: block !important; transform: translateX(-50%) scaleX(-1) !important; }

.ondemandmiddlescreen .zoomFullScreen
{
	left: 10px !important;
}

.ondemandmiddlescreen .zoomFullScreenButton
{
	left: 65px;
}

.failed_center
{
	top: 50%;
	transform: translateY(-50%);
}

.bc_black
{
	background-color: #000;
}

.light_black
{
	background-color: #2a2a2a;
}

.white_clr
{
	color: #fff;
}

.hostVideo .pip {
    left: 33% !important;
    top: 32% !important;
}

.activity-past
{
    opacity: 0.4;
    background: #2F2F2F;
    border: 1px solid #fff !important;
}

.activity-current
{
    background: #BD00FF;
}

.tool_tip_checkmark
{
	display: inline-block;
	width: 80%;
    vertical-align: middle;
    padding-left: 1vw;
}

.tool_tip_checkmark_left
{
	display: inline-block;
	vertical-align: middle;
}

.help_inner_text
{
	padding: 10px 0px;
	margin: 0;
}

#imageCanvas { position: absolute !important; }

.displ_inl
{
	display: inline-block;
}

.add_padr_24
{
	padding-right: 24px !important;
}

.add_margr5
{
	margin-right: 5px !important;
}

.logout_butt
{
	display: inline-block;
	color: #fff;
}

.add_point
{
	cursor: pointer;
}

.sharing_speakerabs
{
	top: -2px;
    right: -27px;
	
	opacity: 0.3;
	
	animation: pulse 1s infinite;
	-webkit-animation: pulse 1s infinite;
	-moz-animation: pulse 1s infinite;
	-o-animation: pulse 1s infinite;
	-ms-animation: pulse 1s infinite;
}

.ppm_count
{
	top: 116px;
}

.ppm_value
{
	display: inline-block;
    vertical-align: middle;
}

.ppm_text
{
	display: inline-block;
    vertical-align: middle;
    margin-left: 8px;
	font-size: 18px !important;
}

#bagToolTip
{
	width: 70%;
	pointer-events: none;
}

#partToolTip
{
	position: absolute;
	left: 0;
	top: 50%;
	
	max-width: 50%;
	text-align: left;
	background-color: rgba(11, 2, 12, 0.6);
	border-radius: 0 2vw 2vw 0 !important;
	
	transform: translateY(-50%);
	
	z-index: 4;
}

.hostToolTip
{
	left: 0;
	top: 50%;
	max-width: 100%;
	max-height: 100%;
	width: max-content;
	height: max-content;
	
	text-align: left;
	background-color: rgba(11, 2, 12, 0.6);
	border-radius: 0 2vw 2vw 0 !important;
	transform: translate(0, -50%);
}

.hostToolTip2
{
	left: 0;
	top: 50%;
	max-width: 100%;
	max-height: 100%;
	width: max-content;
	height: max-content;
	padding: 2vw 5vw 2vw 5vw;
	
	text-align: left;
	background-color: rgba(11, 2, 12, 0.6);
	border-radius: 0 2vw 2vw 0 !important;
	
    font-size: 2vw;
    color: #fff;
	transform: translate(0, -50%);
}

.hostToolTip2 .checkmark
{
	margin: 1% 0px !important;
}


#heightToolTip, #heightToolTipDem
{
	left: 60% !important;
}

.part_inner, .setupInnerText
{
	color: #fff;
	font-size: 1.5vw;
}

.padd3
{
	padding: 3vw;
}

.walk_tool_hold
{
	width: max-content;
	max-width: 100%;
	margin-top: 20px;
	padding: 20px;
	
	background-color: #fff;
	border-radius: 1vw;
}

.walk_tool_hold_host
{
	width: max-content;
	max-width: 100%;
	margin-top: 10px;
	padding: 10px;
}

.center-pointer
{
	text-align: center;
	cursor: pointer;
}

.setupButtonHold
{
	width: 100%;
	margin-top: 20px;
	padding: 20px;
	
	border-radius: 1vw;
	background-color: #fff;
}

.applyToAll
{
    position: relative;
	margin-top: 40px;
	
	color: #fff;
    text-align: center;
}

.applyCheck
{
	position: absolute;
	left: 3vw; 
	top: 50%;
	width: 2vw; 
	height: 2vw;
	
    transform: translateY(-50%);
}

.applyCheck:checked::before
{
	position: absolute;
	left: 50%;
	top: 50%;
	
	font-size: 1vw;
	transform: translate(-50%, -50%);
}

.walk_tool_text, .setupButtonText
{
	display: inline-block;
	
    font-size: 1.5vw;
    vertical-align: middle;
}

.walk_tool_text_host, .setupButtonTextHost
{
	width: 100%;
	text-align: center;
	font-size: 1.3vw;
	color: #000000;
}

.walk_tool_image
{
	display: inline-block;
	
	width: 6vh;
	height: 6vh;
	margin-right: 1vw;
	
	background-image: url(./../images/walk.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
	
	vertical-align: middle;
}

.upNext
{
	font-size: 1vw;
	color: #fff;
}

.tooltipImage
{
	width: auto;
	height: 12vh;
	background-image: url(./../images/maximise.png);
	background-repeat: no-repeat;
	background-position: left;
	background-size: auto 100%;
}

.tooltipImageHost
{
	max-height: 100px;
}

.bagInnerImage
{
	width: 100%;
	height: 12vh;
	background-image: url(./../images/maximise.png);
	background-repeat: no-repeat;
	background-position: left;
	background-size: auto 100%;
}

.tooltipText, .heightTipText, .setupText
{
	font-size: 2.5vw;
	color: #fff;
}

.actNameHost
{
	font-size: 2vw;
}

.script_msg_inner
{
	padding: 1.5vw 1.5vw;
}

.heightTipText
{
	position: relative;
    bottom: 56px;
    left: 145px;
}

.progress_bar_percent
{
	position: absolute;
	right: -103px;
	transform: rotate(180deg);
}

#percentProgress
{
	font-size: 1.5vw;
}

#progressHeightNum
{
	padding-right: 5px;
}

#heightProgressBar, #heightProgressBarDem {
  position: absolute;
  bottom: -26px;
  
  width: 11px;
  height: 645px;
  transform: rotate(180deg);
  background-color: #fff;
}

.hostProgressBar
{
    position: absolute;
    bottom: 51px;
    width: 11px;
    height: 470px;
    transform: rotate(180deg);
    background-color: #fff;
    left: 59%;
    z-index: 100;
}

.definition_hold
{
    width: 340px;
	padding: 10px 0 0 0 !important;
	text-align: left;
}

.par_def_hold
{
	padding-left: 90px;
}

.camera_info_hold
{
	display: inline-block;
	vertical-align: top;
}

#progressBarRoom {
	width: 0%;
	background-image: linear-gradient(0deg, #1dcae9, #1bc9e7);
	height: 11px;
}

.progressHostRoom {
	width: 0%;
	background-image: linear-gradient(0deg, #1dcae9, #1bc9e7);
	height: 11px;
}

#heightProgress, #heightProgressDem {
  width: 100%;
  background-image: linear-gradient(0deg, #1dcae9, #1bc9e7);
  height: 0%;
}

.hostProgress {
  width: 100%;
  background-image: linear-gradient(0deg, #1dcae9, #1bc9e7);
  height: 0%;
}

.tooltipNumber
{
	font-size: 3vw;
	text-align: center;
	color: #fff;
}

.up_next
{
	color: #fff;
	font-size: 1vw;
}

.progressText
{
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	font-size: 1.5vw;
	color: #fff;
	line-height: 1;
}

.progressPercent
{
	position: absolute;
	left: 50%;
	top: 1.5vw;
	transform: translateX(-50%);
	font-size: 1vw;
	color: #fff;
	line-height: 1;
}

.tooltipSvg
{
	width: 8vw;
	height: 7vw;
}

#v_shape
{
	width: 20vw;
    height: 20vw;
	stroke: url(#progress);
    stroke-dasharray: 0;
    stroke-dashoffset: 0;
    stroke-width: 20;
    stroke-miterlimit: 2;
}

.checkmark__circle 
{
  stroke-dasharray: 166;
  stroke-dashoffset: 166;
  stroke-width: 2;
  stroke-miterlimit: 10;
  fill: rgb(128, 255, 182);
}

.checkmark 
{
  width: 5vw;
  height: 5vw;
  border-radius: 50%;
  display: block;
  stroke-width: 2;
  stroke: #fff;
  stroke-miterlimit: 10;
  margin: 10% auto;
  box-shadow: inset 0px 0px 0px rgb(128, 255, 182);
  animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
}

.checkmark_host
{
	max-width: 60px;
	max-height: 60px;
}

.checkmark_inline
{
	display: inline-block;
}

.checkmark__check 
{
  transform-origin: 50% 50%;
  stroke-dasharray: 48;
  stroke-dashoffset: 48;
  stroke-width: 5;
  stroke-linecap: round;
  animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.5s forwards;
}

@keyframes stroke {
  100% {
    stroke-dashoffset: 0;
  }
}
@keyframes scale {
  0%, 100% {
    transform: none;
  }
  50% {
    transform: scale3d(1.1, 1.1, 1);
  }
}
@keyframes fill {
  100% {
    box-shadow: inset 0px 0px 0px 30px rgb(128, 255, 182);
  }
}

.top20
{
	top: 20%;
}

@-webkit-keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
  100% {
      opacity: 1;
  }
}
@keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
  100% {
      opacity: 1;
  }
}

@-ms-keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
  100% {
      opacity: 1;
  }
}

@-o-keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
  100% {
      opacity: 1;
  }
}

@-moz-keyframes pulse {
0% {opacity:1;}
50% {
    opacity: 0.3;
  }
100% {opacity:1;}
}

.videoFullScreen small.click-zoom-mainview {
    right: 0px;
    left: auto;
}

.custom-icon {
    width: 60px;
    height: 40px;
    background: #9b51e0;
    border-radius: 20px;
    font-size: 30px;
   display: inline-flex;
    justify-content: center;
    align-items: center;
}
.custom-switch-camera {
    background: #9b51e0;
    border-radius: 0px 20px 20px 0px;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    width: 22px;
    padding: 0px 5px;
}
.zoom-icon-height img {
    height: 28px;
}
.border-rds {
    border-radius: 20px 0px 0px 20px;
    width: 46px;
    padding: 0px;
    justify-content: flex-end;
}

.pip {left: 45px !important; top: 10px !important;transform: none !important;height: 112px;}
.pip .video-holder {overflow: visible;}
.pip .click-camera-mainview {left: 65px;bottom: -47px;top: auto;}
.pip .click-switch-camera-mainview {bottom: -47px;top: auto;left: 111px;}
.pip .click-zoom-mainview {bottom: -47px;top: auto;left: 139px;}
.pip ~ .zoomFullScreen {top: 130px; left: 40px;}

.pip .videoFullScreen .click-zoom-mainview {
    bottom: auto;
top: 0px;}
.pip .videoPopup > small + div::before{ display:none;}
.pip .videoFullScreen .videoPopup > small + div::before{display:block;}
.hostVideo .pip {
    left: 45px !important;
    top: 10px !important;
}

.hostVideo .pip.behindHRT_stream
{
	left: 50px !important;
}

.zoomFullScreen.behindHRT_stream
{
	left: 10px !important;
}

.hostVideo .pip.less_left_stream
{
	left: 60px !important;
}


.zoom-video1 .videoPopup > small + div::before
{
    content: '';
    border: 65px solid #00000070;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 99;
    border-left-width: 50px;
    border-right-width: 50px;
}

@media screen and (min-width: 3000px)
{
	.guest-screen .align-items-top .btn-primary img, .guest-screen .align-items-top .default-btns .btn .fa-microphone
	{
		width: 30px !important;
		max-width: 30px !important;
		height: 100% !important;
		object-fit: contain;
		
		font-size: 28px;
	}
	
}

@media screen and (min-width: 5000px)
{
	.guest-screen .align-items-top .default-btns .btn .fa-microphone
	{
		line-height: 1vw;
	}
	
}

@media screen and (max-width: 1300px)
{
	.activity_list_popup
	{
		width: 60%;
	}
	
	.ppm_text
	{
		font-size: 14px;
	}
}

@media screen and (max-width: 900px)
{
	.activity_list_popup
	{
		width: 80%;
	}
}

.activity_video_hold
{
	display: inline-block !important;
}

.border-none
{
	border: 0px none !important;
}

.ondemandfooter .activity-counter
{
	top: 10px;
}

#video_script
{
	max-width: 100%;
	max-height: 80vh;
	background-color: #000;
}

.zIndex99 {z-index:99;}

.video_close {
    position: absolute;
    right: 5px;
    top: 5px;
    width: 30px;
    height: 30px;
    top: -40px;
    -webkit-appearance: none;
}

.eject_btn
{
	margin-left: 0px;
	padding: 4px 10px;
	
	font-size: 14px;
	text-align: center;
	
	cursor: pointer;
}

.participant_list_popup
{
	width: 932px;
	resize: both;
	overflow: auto;
}

#walkToolImageDem
{
    padding-left: 53px;
	width: 29%;
	
    background-repeat: no-repeat;
    background-size: 23% 50%;
    background-position: center left;
}

.participant_list_innit
{
	max-width: 15% !important;
}

.participant_list_checkmark
{
	width: 25px;
	height: 25px;
	margin: auto;
	
	background-image: url('../images/checked.png');
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.participant_list_innit2
{
	max-width: 14% !important;
}

.margin-list
{
	margin-top: 5px;
	margin-top: 5px;
}

.for_reject_area
{
	display: inline-block;
	width: 100%;
	margin-top: 20px;
	text-align: center;
}

.main_area
{
    border-radius: 0px 12px 12px 12px;
    background: rgb(52, 33, 59);
    color: #fff;
    border: 2px solid #b002ed;
    height: 151px;
    width: 100%;
    padding: 20px 18px;
    margin-bottom: 17px;
    font-size: 18px;
    position: relative;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
	resize: none;
}

.error_area
{
	border: 2px solid #ff0000;
}

.heartRate-meter ul {
    margin: 0px;
    padding: 0px;
    background: #2e2e2e;
    width: 104px;
    border-radius: 15px;
    height: 430px;
    overflow-y: hidden;
    overflow-x: hidden;
    position: fixed;
    left: 20px;
	z-index: -1;
}
.heartRate-meter ul li {
    display: flex;
    list-style: none;
    font-size: 56px;
    color: #ebebeb;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    line-height: 60px;
    padding: 12px 0px;
    font-weight: 600;
    font-family: Avenir-Medium;
    height: 107px;
}
.heartRate-meter ul li span {
    display: block;
    font-size: 22px;
    font-weight: normal;
    line-height: 22px;
    font-family: Avenir-Book;
}

.alertMassages {
    position: absolute;
    left: 150px;
    z-index: 9999;
    background: #747474;
    color: #fff;
    border-radius: 6px;
    width: 70%;
    padding: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.content-text {
    position: relative;
    display: flex;
    padding: 0px 45px;
    width: 85%;
    flex-direction: column;
    border-right: 1px solid #ffffff30;
}
.content-text .iconType {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 35px;
    height: 35px;
    font-size: 35px;
    line-height: 35px;
}
.content-text h2 {
    font-size: 30px;
    font-family: Avenir-Medium;
    margin-bottom: 10px;}
.content-text p {
    font-size: 18px;
    font-family: Avenir-Book;
    margin-bottom: 0px;
    line-height: 26px;
}

.closeDiv {
    display: flex;
    width: 15%;
    font-size: 40px;
    font-weight: 6;
    justify-content: center;
    align-items: center;
}
.failed-msg {
    background: #c9252d;
}

.agora_fix
{
	top: 49% !important;
}

.counter_none
{
	display: none !important;
}

#multi-device-login-alert
{
    z-index: 9999 !important;
}

/* NEW PRESTREAMING UI UROS START */

.main_container_configuration
{
	display: inline-block;
	width: 100%;
}

.top_channel_info
{
	position: relative;
	display: inline-block;
	
	width: 100%;

	padding: 30px 20px;
	padding-bottom: 0px;
	
	background: #000000;
	
	text-align: center;
}

.top_channel_name
{
	font-size: 50px;
    color: #acacac;
    font-weight: 700;
	text-align: center;
}

.waiting_container
{
	font-family: Poppins;
	font-style: normal;
	font-weight: bold;
	font-size: 48px;
	line-height: 70px;
	text-align: center;
	letter-spacing: 1px;
	color: #FFFFFF;
}

.absolute_channel_container
{
	position: absolute;
    top: 50%;
    left: 20px;
	transform: translateY(-50%);
}

.channel_streaming_img
{
	display: block;
	
	width: 161px;
	height: 89px;
	
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	
	border-radius: 10px;
}

.powered_ch
{
	display: block;
	
	width: 100%;
	
	font-size: 16px;
	color: #bd00ff;
	text-align: center;
}

.close_streaming
{
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	
	width: 60px;
	height: 60px;
	
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(./../images/close_lounge.svg);
	
	border-radius: 50%;
	
	cursor: pointer;
}

.channel_info_content
{
	text-align: left;
}

.channel_img_ps
{
	display: inline-block;
	
	width: 48px;
	height: 48px;
	
	margin-right: 10px;
	
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	
	border-radius: 12px;
	
	vertical-align: top;
}

.ps_info_content
{
	display: inline-block;
	text-align: left;
	vertical-align: top;
}

.channel_psname
{
	max-width: 230px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 34px;
	letter-spacing: 0.75px;
	color: #F3EFFF;
	
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.host_nameps
{
	display: inline-block;
	
	max-width: 165px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: 0.25px;
	color: #F3EFFF;
	text-align: left;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	
	vertical-align: middle;
}

.session_streaming_container
{
	position: relative;
	display: inline-block;
	
	width: 100%;
	
	padding-top: 25px;
    padding-bottom: 25px;
	
	background: #000000;
	
	border-top: 1px solid #545461;
	border-bottom: 1px solid #545461;
	
	text-align: center;
}

.session_info_content
{
	color: #FFFFFF;
	opacity: 0.6;
}

.session_clock
{
	display: inline-block;
	
	width: 20px;
	height: 20px;
	
	margin-right: 15px;
	
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(./../images/session_clock.svg);
	
	border-radius: 50%;
	
	vertical-align: middle;
}

.inline_session_starting
{
	display: inline-block;
	text-align: center;
}

.waiting_host_container
{
	position: relative;
	
	font-size: 40px;
    color: #ffffff;
    text-align: center;
}

.streaming_session_name
{
	position: relative;
	
	padding-bottom: 20px;
	
	font-size: 40px;
    color: #acacac;
    text-align: center;
}

.relative
{
	position: relative;
}

.online_span
{
	position: relative;
	padding-left: 10px;
	padding-right: 20px;
}

.mic_left_side
{
	left: 24%;
	padding: 5px 5px 5px 10px;
}

.absolute_online_status
{
	position: absolute;
    top: 8px;
    right: 5px;
    
	width: 15px;
    height: 15px;
    
	background-color: #6DD400;
    
	border-radius: 50%;
}

.offline_status
{
	background-color: #ff0000;
}

.online_container
{
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	z-index: 10;
}

.online_users_drop
{
	position: relative;
    
	padding: 7px 75px 7px 35px;
    
	background: transparent;
    
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
   
	border-radius: 35px;
    border: 1px solid #545461;
	
	cursor: pointer;
}

.online_users_drop span
{
	position: relative;
	top: -2px;
	
	padding-left: 10px;
    
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 25px;
	line-height: 37px;
	color: #00BF51;
    
	vertical-align: middle;
}

.drop_arrow
{
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	
	width: 20px;
	height: 9px;
	
	background-position: center;
	background-size: 20px 9px;
	background-repeat: no-repeat;
	background-image: url(./../images/online_arrow.svg);
}

.session_time_container
{
	position: absolute;
	bottom: 0px;
	right: 20px;
}

.session_starting
{
	font-size: 30px;
    color: #acacac;
    text-align: center;
}

.started_session
{
	display: inline-block;
	
	font-weight: 500;
	
	vertical-align: middle;
}

.join_streaming
{
	display: inline-block;
    padding: 12px 30px;
	margin-left: 40px;
	
    background-color: #E4DAFF;
    font-family: Poppins;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 28px;
    text-align: center;
    letter-spacing: 0.75px;
    color: #6D118C;
	
    border: 2px solid #E4DAFF;
    border-radius: 20px;
    vertical-align: middle;
    cursor: pointer;
}

.virtual_room_button
{
	display: block;
	
	margin-top: 10px;
	padding: 12px 30px;
	width: 250px;
	
	background-color: #E4DAFF;
    font-family: Poppins;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 28px;
    text-align: center;
    letter-spacing: 0.75px;
    color: #6D118C;
	
    border: 2px solid #E4DAFF;
    border-radius: 20px;
    vertical-align: middle;
    cursor: pointer;
}

.online_container ::-webkit-scrollbar {
  width: 8px;
  background-color: transparent;
  border-radius: 10px;
}

/* Track */
.online_container ::-webkit-scrollbar-track {
  border-radius: 10px;
}
 
/* Handle */
.online_container ::-webkit-scrollbar-thumb{
  background: #acacac; 
  border-radius: 10px;
}

.online_drop_users
{
	position: absolute;
	top: 100%;
	right: 0px;
	
	width: 400px;   
	max-height: 250px;
	
	padding: 8px 3px;
	
	background: #000000;
	
	border: 1px solid #413f41;
	
	overflow-y: auto;
	cursor: auto;
}

.one_drop_user
{
	position: relative;
	
	width: 100%;
	
	padding: 20px 10px 20px 50px;
	
	background: #000000;
	
	color: #fff;
	font-size: 16px;
	text-align: left;
	font-weight: 400;
}

.session_options_container
{
	display: inline-block;
	
	width: 100%;
	
	padding-bottom: 20px;
	padding-left: 20px;
	padding-right: 20px;
	
	background: #000000;
}

.user_online_img
{
	position: absolute;
	top: 50%;
	left: 2px;
	transform: translateY(-50%);
	
	width: 40px;
	height: 40px;
	
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	
	border: 1px solid #413f41;
	border-radius: 50%;
}

.streaming_options_menu
{
	display: inline-block;
	
	width: 450px;
	
	vertical-align: middle;
}

.streaming_option_title
{
	display: inline-block;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: bold;
	font-size: 32px;
	line-height: 52px;
	letter-spacing: 1px;
	color: #FFFFFF;
	
	vertical-align: middle;
    padding-left: 16px;
}

.session_name_ps
{
	position: absolute;
	top: 50%;
	left: 20px;
	transform: translateY(-50%);
	
	max-width: 350px;
	max-height: 64px;
	 
	 text-align: left;
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 24px;
	line-height: 32px;
	letter-spacing: 1px;
	color: #FCFCFC;
	overflow: hidden;
    text-overflow: ellipsis;
}

.streaming_option
{
	padding: 15px;
    
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 34px;
	letter-spacing: 0.75px;
	color: #E4DAFF;
	
	cursor: pointer;
}

.active_streaming_option
{
	background: #121126;
	
	color: #fff;
	font-weight: 400;
	
	border-left: 4px solid #BCA4FF;
}

.padding_menu
{
	padding-left: 10px;
	padding-bottom: 80px;
}

.cameras_container
{
	display: inline-block;
	width: calc(50% - 30px);
	
	vertical-align: top;
}

.opened_menu_streaming
{
	padding-top: 35px;
}

.setup_top_container
{
	border-right: 2px solid #3F3E4D;
    padding-right: 30px;
	width: 50%;
}

.cameras_container video
{
	left: 0px !important;
	top: 0px !important;
}


.for_cameras_main div
{
	//background-color: transparent !important;
}

.turning_video_container
{
	width: 100%;
	padding-top: 30px;
}

.camera_info_left
{
	text-align: left;
}

.active_sel, .active_sel_pos
{
	position: absolute;
	display: none;
	left: 4px;
	top: 4px;
	height: 15px;
	width: 15px;
	
	border-radius: 100%;
	background-color: #6D118C;
}

.turning_video_title
{
	padding-bottom: 20px;
	
	font-family: Poppins;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 28px;
    letter-spacing: 0.75px;
    color: #FFFFFF;
}

.turning_options_container
{
	display: inline-block;
	width: 100%;
	text-align: left;
}

.one_off_option
{
	position: relative;    
	width: 100%;
    padding-bottom: 15px;
	padding-right: 15px;
	text-align: left;
    color: #fff;
	font-size: 16px;
}

.check_mark_option
{
	position: absolute;
	top: 3px;
	left: 8px;
	
	width: 20px;
	height: 20px;
	
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(./../images/checked_pass.png);
}

.speakers_container
{
	display: inline-block;
	
	width: 100%;
	
	padding-top: 30px;
	padding-left: 40px;
	
	text-align: center;
}

.pb20
{
	padding-bottom: 20px;
}

.empty_container
{
	padding-top: 250px;
	padding-bottom: 250px;
	padding-left: 20px;
	padding-right: 20px;
	
	font-size: 30px;
	color: #fff;
	text-align: center;
}

.relative_opt_menu
{
	position: relative;
	padding-right: 80px;
}

.info_circle
{
	position: absolute;
	top: 10px;
	right: 30px;
	
	width: 40px;
	height: 40px;
	
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(./../images/info-button.svg);
	
	border-radius: 50%;
	
	cursor: pointer;
}

.info_watch_container
{
	position: absolute;
	top: -170px;
	left: 100%;
	
	min-width: 68vw;
	
	padding: 20px;
	
	background: #121126;
	
	border-radius: 20px;
	border: 1px solid #616162;
	
	cursor: auto;
	z-index: 100;
}

.info_watch_title
{
	padding-bottom: 70px;
	padding-right: 40px;
    
	font-size: 36px;
    text-align: left;
    color: #fff;
	font-family: 'Poppins';
}

.info_watch_text
{
	padding-bottom: 45px;
    
	font-size: 26px;
    text-align: left;
    color: #d2d3d3;
    font-weight: 300;
    line-height: 35px;
	font-family: 'Poppins';
}

.arrow_info
{
	position: absolute;
    bottom: 40%;
    left: -13px;
    
	width: 25px;
    height: 25px;
    
	background: #121126;
    
	border-top: 1px solid #616162;
    border-left: 1px solid #616162;
    
	transform: rotate(-45deg);
}

.info_close
{
	position: absolute;
    top: 13px;
    right: 13px;
    
	width: 42px;
    height: 42px;
    
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(./../images/close_lounge.svg);
    
	border-radius: 50%;
    
	cursor: pointer;
}

.apps_container
{
	display: inline-block;
	width: 100%;
	text-align: center;
}

.email_container
{
	padding-top: 165px;
}

.instruction_text
{
	padding-bottom: 40px;
	
	font-size: 30px;
    color: #fff;
    text-align: center;
}

.centered_full
{
	display: inline-block;
	width: 100%;
	text-align: center;
}

.inline_input
{
	display: inline-block;
	width: 400px;
	vertical-align: middle;
}

.main_input
{
	width: 100%;
    
	padding: 15px 15px;
    
	background: #24223D;
    
	text-align: left;
    font-size: 22px;
    color: #fff;
	font-family: 'Poppins';
	
	border: 2px solid #24223D;
    
    border-radius: 10px;
	outline: none;
}

.chat_ps
{
	width: 25px;
	height: 25px;
}

.error_input
{
	border: 2px solid #ff0000;
}

.sucess_span
{
	color: #BCA4FF;
}

.succes_instructor
{
	padding-left: 80px;
	padding-right: 80px;
}

.success_mark
{
	position: absolute;
    top: 2px;
    left: -55px;
    
	width: 40px;
    height: 40px;
    
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(./../images/success_mark.svg);
    
	border-radius: 50%;
}

.none_margin
{
	margin: 0px;
}

.steps_container
{
	display: inline-block;
	
	width: 100%;
	
	padding-top: 30px;
	
	text-align: left;
}

.padding_steps
{
	padding-left: 70px;
	padding-right: 70px;
}

.step_title
{
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 34px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
}

.step_info
{
	padding-bottom: 40px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
}

.step_info span
{
	color: #BCA4FF;
}

.digits_container
{
	display: inline-block;
    
	padding: 5px 45px;
    margin-top: 15px;
	
	background: #3F3E4D;
    
	font-family: Poppins;
	font-style: normal;
	font-weight: bold;
	font-size: 64px;
	line-height: 90px;
	letter-spacing: 22.5px;
	color: #E4DAFF;
}

.pt20
{
	padding-top: 20px;
}

.connected_container
{
	padding-top: 215px;
}

.room_container
{
	display: inline-block;
	
	width: 100%;
}

.camera_room_container
{
	display: inline-block;
	width: 360px;
	vertical-align: top;
}

.room_setup_container
{
	display: inline-block;
	width: calc(100% - 385px);
	margin-left: 25px;
	vertical-align: top;
}

.setup_title
{
	font-size: 20px;
	text-align: left;
	color: #fff;
}

.for_select_setups
{
	display: inline-block;
	width: 100%;
	margin-top: 20px;
	text-align: left;
}

.one_select_option
{
	display: inline-block;
	margin-right: 60px;
	vertical-align: middle;
}

.select_room
{
	width: 100px;
}

.select_title_room
{
	display: inline-block;
	
	margin-left: 15px;
	
	font-size: 20px;
	color: #acacac;
	
	vertical-align: middle;
}

.mb35
{
	margin-bottom: 35px;
}

.room_btn_container
{
	display: inline-block;
	width: 100%;
	text-align: left;
}

.room_btn
{
	display: inline-block;
	
	padding: 15px 40px;
	
	font-size: 20px;
	font-weight: 700;
	color: #fff;
	
	border-radius: 30px;
	border: 2px solid #B002ED;
	
	cursor: pointer;
}

.opacity_room
{
	opacity: 0.5;
	cursor: auto;
}

.back_instruction
{
	position: absolute;
	top: 10px;
	right: 25px;
	
	width: 30px;
	height: 30px;
	
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	background-image: url(./../images/close_lounge.svg);
	
	border-radius: 50%;
	
	cursor: pointer;
}

.online_user_drop
{
	position: absolute;
	bottom: 0px;
	right: -3px;
	
	width: 12px;
	height: 12px;
	
	background-color: #56CB00;
	
	border-radius: 50%;
}


.offline_user_drop
{
	background-color: #ff0000;
}

.empty_users
{
	padding-top: 15px;
	padding-bottom: 15px;
	
	font-size: 16px;
	color: #fff;
	text-align: center;
}

.absolute_required
{
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	
	color: #FF0000;
	font-size: 14px;
	font-weight: 500;
}

.succes_text
{
	font-size: 22px;
	color: #fff;
	text-align: center;
}

.room_container .for_cameras_cbx
{
	display: none !important; 
}

.mt30
{
	margin-top: 30px;
}

.ml0
{
	margin-left: 0px;
}

.equipment_stats_hold
{
	position: absolute;
    top: 10px;
    left: 20px;
	
	max-width: 250px;
    line-height: 1;
    padding: 10px 20px;
	
	font-size: 60px !important;
    color: #fff !important;
   
    background-color: rgb(17, 2, 31, 0.6);
    border-radius: 30px;
	
	
	z-index: 100;
}

.stats_hold_host
{
	width: 12vw;
	font-size: 30px!important;
}

.inside_stats
{
	padding: 0px 20px;
}

.stats_timer_hold
{
	position: relative;
	display: block;
	
	padding: 0px 20px 5px 20px;
	margin-top: 10px;
	
	border-radius: 0px 0px 30px 30px;
	overflow: hidden;
}

.stats_timer_bar
{
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0%;
    background-color: #b89afa;
	transition: width 1s linear;
}

.participant_stats_hold
{
	padding: 10px 0 0 0;
}

.stats_timer_number
{
	position: relative;
	display: inline-block;
    vertical-align: top;
    padding: 3px 0px 0px 5px;
}

.stats_timer
{
	position: relative;
	display: inline-block;
	
	width: 51px;
	height: 49px;
	
	vertical-align: middle;
	background-image: url(./../images/alarm-clock.png);
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.t-left-status
{
	text-align: left;
}

.stats_image
{
	display: inline-block;
	
	width: 24px;
    height: 21px;
	
	vertical-align: middle;
	background-image: url(./../images/glove_purple.png);
	background-size: 100% 100%;
    background-position: center;
	background-repeat: no-repeat;
}

.stats_hold_host .stats_image
{
    position: relative;
    bottom: 6px;
	
	width: 40%;
    height: auto;
    padding-top: 40%;
	background-size: 70% 70%;
	vertical-align: bottom:
}

.no_padd
{
	padding: 0!important;
}

.inner_status_hold
{
	display: block;
	padding: 10px 20px
}

.separate_stats
{
	display: block;
}

.reverse_second_image
{
	background-image: url(./../images/glove_grey.png);
}

.heart_stats
{
	background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNiAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik0xOC42MjUgMC43NUMyMi40MjI1IDAuNzUgMjUuNSAzLjg3NSAyNS41IDguMjVDMjUuNSAxNyAxNi4xMjUgMjIgMTMgMjMuODc1QzkuODc1IDIyIDAuNSAxNyAwLjUgOC4yNUMwLjUgMy44NzUgMy42MjUgMC43NSA3LjM3NSAwLjc1QzkuNyAwLjc1IDExLjc1IDIgMTMgMy4yNUMxNC4yNSAyIDE2LjMgMC43NSAxOC42MjUgMC43NVpNMTQuMTY3NSAyMC4yNTVDMTUuMjY4OCAxOS41NiAxNi4yNjI1IDE4Ljg2ODcgMTcuMTkyNSAxOC4xMjg3QzIwLjkxODggMTUuMTY2MyAyMyAxMS45Mjg4IDIzIDguMjVDMjMgNS4zIDIxLjA3ODggMy4yNSAxOC42MjUgMy4yNUMxNy4yOCAzLjI1IDE1LjgyNSAzLjk2MjUgMTQuNzY3NSA1LjAxNzVMMTMgNi43ODVMMTEuMjMyNSA1LjAxNzVDMTAuMTc1IDMuOTYyNSA4LjcyIDMuMjUgNy4zNzUgMy4yNUM0Ljk1IDMuMjUgMyA1LjMyIDMgOC4yNUMzIDExLjkzIDUuMDgyNSAxNS4xNjYzIDguODA2MjUgMTguMTI4N0M5LjczNzUgMTguODY4NyAxMC43MzEyIDE5LjU2IDExLjgzMjUgMjAuMjUzN0MxMi4yMDYzIDIwLjQ5IDEyLjU3NjMgMjAuNzE2MiAxMyAyMC45Njg4QzEzLjQyMzcgMjAuNzE2MiAxMy43OTM3IDIwLjQ5IDE0LjE2NzUgMjAuMjU1WiIgZmlsbD0iI0ZGODQ5MyIvPg0KPC9zdmc+DQo=');
}

.calories_image
{
	background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAxOCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik04Ljk5OTggMjMuOTE2N0MxMS4xNTQ3IDIzLjkxNjcgMTMuMjIxMyAyMy4wNjA2IDE0Ljc0NSAyMS41MzY5QzE2LjI2ODggMjAuMDEzMiAxNy4xMjQ4IDE3Ljk0NjUgMTcuMTI0OCAxNS43OTE3QzE3LjEyNDggMTQuODUzNSAxNi44NzU2IDEzLjk1MzIgMTYuNTgzMSAxMy4xMTU4QzE0Ljc3NzIgMTQuOTAwMSAxMy40MDU3IDE1Ljc5MTcgMTIuNDY2NSAxNS43OTE3QzE2Ljc5NDQgOC4yMDgzMyAxNC40MTY1IDQuOTU4MzMgNy45MTY0NiAwLjYyNUM4LjQ1ODEzIDYuMDQxNjcgNC44ODc0NiA4LjUwNTE3IDMuNDMzNjMgOS44NzM0MkMyLjI0NzczIDEwLjk4ODkgMS40MjQzIDEyLjQzNDkgMS4wNzAxIDE0LjAyNEMwLjcxNTkwMyAxNS42MTMxIDAuODQ3MjcgMTcuMjcyIDEuNDQ3MTcgMTguNzg1NUMyLjA0NzA3IDIwLjI5OSAzLjA4Nzg0IDIxLjU5NzQgNC40MzQ1MyAyMi41MTI0QzUuNzgxMjIgMjMuNDI3MyA3LjM3MTcxIDIzLjkxNjUgOC45OTk4IDIzLjkxNjdaTTkuNzY4OTYgNC42NzEyNUMxMy4yOCA3LjY1MDQyIDEzLjI5NzQgOS45NjU1IDEwLjU4NDcgMTQuNzE4MUM5Ljc2MDMgMTYuMTYyMiAxMC44MDM1IDE3Ljk1ODMgMTIuNDY2NSAxNy45NTgzQzEzLjIxMTggMTcuOTU4MyAxMy45NjU4IDE3Ljc0MTcgMTQuNzYyIDE3LjMxMzdDMTQuNTI2IDE4LjIwNTMgMTQuMDg2MyAxOS4wMjk5IDEzLjQ3NzQgMTkuNzIyNkMxMi44Njg1IDIwLjQxNTMgMTIuMTA3MSAyMC45NTcyIDExLjI1MzIgMjEuMzA1N0MxMC4zOTkzIDIxLjY1NDEgOS40NzYxNCAyMS43OTk2IDguNTU2NDUgMjEuNzMwNkM3LjYzNjc2IDIxLjY2MTYgNi43NDU2NCAyMS4zODAxIDUuOTUzMjUgMjAuOTA4MUM1LjE2MDg3IDIwLjQzNjIgNC40ODg4NSAxOS43ODY4IDMuOTkwMTIgMTkuMDExQzMuNDkxMzkgMTguMjM1MiAzLjE3OTU2IDE3LjM1NDIgMy4wNzkxOCAxNi40Mzc0QzIuOTc4ODEgMTUuNTIwNiAzLjA5MjYyIDE0LjU5MzEgMy40MTE2OCAxMy43Mjc3QzMuNzMwNzMgMTIuODYyNCA0LjI0NjMgMTIuMDgyOSA0LjkxNzggMTEuNDUwN0M1LjA1NDMgMTEuMzIyOSA1Ljc0NjU1IDEwLjcwODcgNS43NzY4OCAxMC42ODE2QzYuMjM2MjEgMTAuMjY5OSA2LjYxNDMgOS45MDQ4MyA2Ljk4ODA1IDkuNTA1MDhDOC4zMjA1NSA4LjA3NzI1IDkuMjc4MjEgNi40OTM0MiA5Ljc2Nzg4IDQuNjcxMjVIOS43Njg5NloiIGZpbGw9IiNGRkQ3ODkiLz4NCjwvc3ZnPg0K');
}

.vomax_image
{
	background-image: url(./../images/vomax.png);
}

.purple_cone
{
	background-image: url(./../images/purple_cone.png);
}

.grey_cone
{
	background-image: url(./../images/grey_cone.png);
}

.grey_ladder
{
	background-image: url(./../images/grey_ladder.svg);
}

.purple_ladder
{
	background-image: url(./../images/purple_ladder.svg);
}

.purple_box
{
	background-image: url(./../images/box_jump_purple.svg);
}

.grey_box
{
	background-image: url(./../images/box_jump_grey.svg);
}

.squat_icon
{
	background-image: url(./../images/squat.png);
	background-size: 70% 80%;
}


.stats_value
{
	display: inline-block;
    vertical-align: top;
}

.stats_hold_host .stats_value
{
	vertical-align: middle;
}

.stats_activity
{
	text-align: left !important;
}

.required_span
{
	position: relative;
	top: -2px;
	
	padding-left: 25px;
	
	color: #FF0000;
    font-size: 14px;
    font-weight: 500;
}

.required_room_info
{
	position: absolute;
	bottom: -85px;
	left: 50%;
	transform: translateX(-50%);
	
	width: 475px;
	
	padding: 15px 50px; 
	
	background-color: #ea222c;
	
	color: #fff;
	font-size: 16px;
	font-weight: 500;
	text-align: center;
	
	border-radius: 4px;
	
	z-index: 10;
}

.danger_icon
{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 15px;
	
	width: 30px;
	height: 30px;
	
	background-image: url(./../images/danger.svg);
	background-size: cover;
    background-position: center;
	background-repeat: no-repeat;
}

.cancel_error
{
	position: absolute;
    top: 12px;
    right: 14px;
    
	width: 13px;
    height: 12px;
    
	background-image: url(./../images/cancel.svg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    
	cursor: pointer;
}

.calories_container
{
	display: inline-block;
	
	width: 100%;
	
	padding-top: 70px;
	padding-left: 120px;
    padding-right: 120px;
	
	text-align: center;
}

.calories_title
{
	padding-bottom: 25px;
	padding-left: 20px;
    padding-right: 20px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 34px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
}

.calories_input_container
{
	display: inline-block;
	width: 100%;
	text-align: center;
}

.calories_one_container
{
	display: inline-block;
	
	width: calc(50% - 25px);
	
	margin-right: 25px;
	margin-bottom: 30px;
	
	text-align: left;
	
	vertical-align: top;
}

.widder_calories
{
	width: 55%;
}

.select_full
{
	width: 90%;
}

.txt_left
{
	text-align: left;
}

.txt_center
{
	text-align: center;
}

.midredlineinst
{
    padding-top: 20px;
	border-bottom: 1px dashed #f50505;
}

.setup_room_holder
{
	position: fixed;
	top: 0px;
	left: 0px;
	
	width: 100vw;
	height: 100vh;
	
	z-index: 1000;
}

.room_container_pop
{
	position: relative;
	top: 50%;
	left: 50%;
	
	transform: translate(-50%, -50%);
	
	width: 75%;
	max-width: 1100px;
	max-height: 90vh;
	
    padding: 50px 20px;
	
	background-color: #06050B;
	
	font-family: 'Poppins';
	
	border-radius: 35px;
	
	overflow-y: auto;
	z-index: 2;
}

.room_container_pop::-webkit-scrollbar 
{
    width: 8px;
	background-color: #99949c;
	border-radius: 10px;
}

.room_container_pop::-webkit-scrollbar-track 
{
	border-radius: 10px;
}

.room_container_pop::-webkit-scrollbar-thumb 
{
	background: #3f3d40; 
	border-radius: 10px;
}

.welcome_room
{
	padding-bottom: 25px;
	
	font-size: 34px;
    color: #fff;
    text-align: center;
}

.welcome_room_subtext
{
	padding-bottom: 40px;
	padding-right: 50px;
	padding-left: 50px;
	
	font-size: 22px;
    color: #717171;
    text-align: center;
}

.pop_room_container
{
	display: inline-block;
	
	width: 100%;
	
	padding-right: 50px;
	padding-left: 50px;
}

.selects_container
{
	display: inline-block;
	width: 60%;
	vertical-align: top;
}

.room_img_container
{
	display: inline-block;
    
	width: 40%;
    height: 270px;
    
	background-image: url(./../images/room_example.svg);
    background-size: 100% auto;
    background-position: center;
    background-repeat: no-repeat;
    
	vertical-align: top;
}

.select_option_pop
{
	margin-right: 20px;
}

.select_room_pop
{
	width: 130px;
}

.room_continue_container
{
	display: inline-block;
	
	width: 100%;
	
	margin-top: 20px;
	
	text-align: center;
}

.continue_disabled
{
	display: inline-block;
    
	padding: 12px 30px;
    
	background-color: #E4DAFF;
    
	font-family: Poppins;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 28px;
    text-align: center;
    letter-spacing: 0.75px;
    color: #6D118C;
    
	border: 2px solid #E4DAFF;
    border-radius: 20px;
    vertical-align: middle;
    
	cursor: auto;
    opacity: 0.3;
}

.continue_allowed
{
	display: inline-block;
    
	padding: 13px 50px;
    
	font-size: 20px;
	color: #fff;
    text-align: center;
    font-weight: 700;
    
	background-color: #b002ed;
    
	border-radius: 30px;
    
	vertical-align: middle;
	
	cursor: pointer;
}

.room_setup_video
{
	position: absolute;
	top: 0px;
	left: 0px;
	
	width: 100vw;
	height: 100vh;
	
	z-index: 1;
}

@media screen and (max-width: 1615px)
{
	.calories_container
	{
		padding-left: 50px;
		padding-right: 50px;
	}
}

@media screen and (max-width: 1550px)
{
	.info_watch_container
	{
		min-width: 60vw;
	}
}

@media screen and (max-width: 1470px)
{
	.calories_container, .calories_title
	{
		padding-left: 10px;
		padding-right: 10px;
	}
}

@media screen and (max-width: 1390px)
{
	.calories_one_container
	{
		width: 70%;
	}
	
	.centered_full.txt_left
	{
		margin-bottom: 20px;
		text-align: center;
	}
}

@media screen and (max-width: 1300px)
{
	.info_watch_container
	{
		min-width: 55vw;
	}
}

@media screen and (max-width: 1220px)
{
	.calories_one_container
	{
		width: 100%;
	}
}

@media screen and (max-width: 1200px)
{
	.streaming_options_menu
	{
		width: 100%;
	}
	
	.padding_menu
	{
		padding-bottom: 5px;
	}
	
	.opened_menu_streaming
	{
		width: 100%;
	}
	
	.waiting_container
	{
		font-size: 35px;
	}
	
	.session_info_content
	{
		font-size: 20px;
	}
	
	.session_name_ps
	{
		max-width: 250px;
		font-size: 20px;
	}
	
	.info_watch_container
	{
		left: -5px;
		width: calc(100% - 20px);
	}
	
	.arrow_info
	{
		display: none;
	}
	
	.cameras_container, .speakers_container
	{
		padding-left: 10px;
		padding-right: 10px;
		
		text-align: center;
	}
	
	.setup_top_container
	{
		text-align: left;
	}
	
	.for_all_test_sp, .main_title_speakers
	{
		text-align: center;
	}
	
	.opened_menu_streaming
	{
		padding-left: 20px;
		padding-right: 20px;
	}
	
	.ppm_text
	{
		font-size: 9px;
	}
}

@media screen and (max-width: 1120px)
{
	.room_container_pop
	{
		width: 95%;
	}
}

@media screen and (max-width: 1000px)
{
	.waiting_host_container
	{
		padding-left: 20px;
		padding-right: 180px;
		
		font-size: 30px;
	}

	.streaming_session_name
	{
		padding-left: 20px;
		padding-right: 275px;
		
		font-size: 25px;
		text-align: left;
	}
	
	.session_starting
	{
		font-size: 25px;
	}
	
	.session_time_container
	{
		bottom: -20px;
	}
	
	.padding_steps
	{
		padding-left: 0px;
	}
	
	.session_name_ps
	{
		max-width: 200px;
	}
}

@media screen and (max-width: 950px)
{
	.room_setup_container
	{
		width: 100%;
		margin-top: 20px;
	}
}

@media screen and (max-width: 900px)
{
	.top_channel_info
	{
	   padding-left: 130px;
	   padding-right: 130px;
	}
   
	.top_channel_name
	{
	   font-size: 40px;
	}
   
	.waiting_container
	{
	   font-size: 24px;
	}
   
	.channel_streaming_img
	{
	   width: 125px;
	}
   
   .info_watch_title
	{
	    font-size: 30px;
	}
	
	.info_watch_text
	{
		font-size: 22px;
	}
	
	.instruction_text 
	{
		font-size: 24px;
	}
	
	.success_mark
	{
		top: -3px;
	}
	
	.selects_container
	{
		width: 100%;
	}
	
	.room_img_container
	{
		display: none; 
	}
}

@media screen and (max-width: 768px)
{
	.top_channel_info
	{
	   padding-top: 25px;
	}
	
	.top_channel_name
	{
		font-size: 30px;
	}
	
	.waiting_container
	{
		font-size: 20px;
	}
	
	.started_session
	{
		width: 100%;
	}
	
	.session_streaming_container .join_streaming
	{
		margin-left: 0px;
	}
	
	.main_title_speakers
	{
		padding-bottom: 20px;
	}
	
	.info_watch_title
	{
		font-size: 24px;
	}
	
	.info_watch_text
	{
		font-size: 20px;
	}
	
	.inline_input
	{
		width: 100%;
	}
	
	.email_container .join_streaming
	{
		margin-left: 0px;
		margin-top: 20px;
	}
	
	.for_cameras_cbx
	{
		display: block;
		width: 100%;
		text-align: center !important;
		padding-left: 0px;
		padding-right: 0px;
	}
	
	.info_watch_title
	{
		padding-bottom: 10px;
	}
	
	.info_watch_text
	{
		padding-bottom: 10px;
	}
	
	.channel_streaming_img
	{
		width: 75px;
	}
	
	.powered_ch
	{
		font-size: 11px;
	}
	
	.close_streaming
	{
		width: 35px;
		height: 35px;
	}
	
	.top_channel_info
	{
		padding-left: 115px;
		padding-right: 75px;
	}
	
	.session_options_container
	{
		padding-left: 2px;
	}
	
	.absolute_channel_container
	{
		left: 5px;
	}
	
	.for_all_test_sp
	{
		padding-left: 0px;
		padding-right: 0px;
	}
	
	.streaming_session_name
	{
		padding-bottom: 30px;
		padding-right: 100px;
		font-size: 18px;
	}
	
	.session_starting
	{
		font-size: 20px;
	}
	
	.speakers_container
	{
		padding-top: 30px;
	}
	
	.required_room_info
	{
		bottom: auto;
		top: 100%;
		width: 95%;
	}
}

@media screen and (max-width: 600px)
{
	.select_option_pop
	{
		width: 100%;
		margin-bottom: 20px;
	}
}

@media screen and (max-width: 550px)
{
	.calories_container .one_select_option
	{
		width: 100%;
		margin-bottom: 10px;
		margin-right: 0px;
	}
}

@media screen and (max-width: 500px)
{
	.join_streaming
	{
		padding: 15px 20px;
		font-size: 14px;
	}
	
	.waiting_host_container
	{
		font-size: 22px;
	}
	
	.online_users_drop
	{
		font-size: 14px;
	}
	
	.online_users_drop span
	{
		top: -2px;
		font-size: 22px;
	}
	
	.top_channel_name
	{
		font-size: 22px;
	}
	
	.waiting_container 
	{
		font-size: 16px;
	}	
		
	.left_speakers
	{
		width: 100%;
	}
	
	.online_drop_users
	{
		width: 85vw;
	}
	
	.cameras_container
	{
		padding-left: 0px;
		padding-right: 0px;
	}
	
	.succes_instructor
	{
		padding-left: 25px;
		padding-right: 25px;
	}
	
	.absolute_online_status
	{
		top: 5px;
		right: 7px;
		width: 11px;
		height: 11px;
	}
	
	.speakers_container
	{
		padding-left: 0px;
		padding-right: 0px;
	}
	
	.opened_menu_streaming
	{
		padding-left: 5px;
		padding-right: 5px;
	}
	
	.one_select_option
	{
		width: 100%;
		margin-right: 0px;
		margin-bottom: 10px;
	}
	
	.room_btn
	{
		margin-bottom: 25px;
		padding: 15px 20px;
		font-size: 16px;
	}
	
	.room_setup_container
	{
		margin-left: 0px;
	}
	
	.camera_room_container
	{
		width: auto;
	}
	
	.setup_title, .for_select_setups, .room_btn_container
	{
		text-align: center;
	}
	
	.welcome_room
	{
		font-size: 28px;
	}
	
	.welcome_room_subtext
	{
		padding-left: 0px;
		padding-right: 0px;
		
		font-size: 18px;
	}
	
	.pop_room_container
	{
		padding-left: 0px;
		padding-right: 0px;
	}
}

@media screen and (max-width: 430px)
{
	.waiting_host_container 
	{
		padding-right: 130px;
		font-size: 16px;
	}
	
	.join_streaming
	{
		font-size: 12px;
	}
	
	.online_container
	{
		right: 5px;
	}
	
	.online_users_drop
	{
		padding: 10px 40px 10px 10px;
	}
	
	.drop_arrow
	{
		right: 5px;
	}	
}

@media screen and (max-width: 400px)
{
	.welcome_room
	{
		font-size: 24px;
	}
	
	.welcome_room_subtext
	{
		font-size: 16px;
	}
}

@media screen and (max-width: 390px)
{
	.for_cameras_main, div#local-media, .for_cameras_main video
	{
		width: 250px !important;
	}
}


/* NEW PRESTREAMING UI UROS END */

/* SUPPORT FLOW UI UROS START */

.support_help
{
	position: fixed;
    bottom: 10px;
    right: 20px;
    
	padding: 12px 20px 12px 50px;
    
	background: #121126;
    
	color: #fff;
    font-size: 16px;
    text-align: center;
    font-weight: 700;
    
	border-radius: 30px;
	
	cursor: pointer;
	
	z-index: 1000;
}

.move_support_right .support_help
{
	right: 315px;
}

.question_icon
{
	position: absolute;
    top: 9px;
    left: 14px;
    
	width: 24px;
    height: 24px;
    
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(./../images/information.svg);
    
	border-radius: 50%;
}

.support_container
{
	position: fixed;
    bottom: 20px;
    right: 20px;
	
	width: 400px;
	
	z-index: 1000;
}

.header_support
{
	position: relative;
	
	width: 100%;
	height: 60px;
    
	padding: 15px 20px;
    
	background: #121126;
    
	font-size: 20px;
    color: #fff;
    text-align: center;
    font-weight: 700;
}

.support_middle_part
{
	position: relative;
	
	width: 100%;
	height: 50vh;
	
	padding: 0px 10px;
	
	background-color: #f2f1f6;
}

.support_footer
{
	width: 100%;
	
	background-color: #ffffff;
	
	border-top: 1px solid #e7e6e8;
}

.support_menu
{
	display: inline-block;
	
	width: 50%;
	
	padding-top: 8px;
	
	text-align: center;
	
	vertical-align: top;
	cursor: pointer;
}

.first_menu_supp
{
	border-right: 1px solid #e7e6e8;
}

.active_support
{
	background-color: #f2f1f6;
}

.sup_footer_icons
{
	display: inline-block;
	
	width: 42px;
	height: 42px;
	
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
	
	border-radius: 50%;
}

.faq_icon
{
	background-image: url(./../images/faq_icon.svg);
}

.contact_icon
{
	background-image: url(./../images/contact_icon.svg);
}

.sup_footer_title
{
	position: relative;
    top: -6px;
	
	width: 100%;
	
	color: #282a2c;
	font-size: 16px;
	font-weight: 500;
	text-align: center;
}

.close_faqsupp
{
	position: absolute;
	top: 5px;
	right: 5px;
	
	width: 25px;
	height: 25px;
	
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
	background-image: url(./../images/close_faq.svg);
	
	border-radius: 50%;
	
	cursor: pointer;
}

.questions_middle_title
{
	height: 70px;
	
	padding-top: 20px;
	padding-bottom: 20px;
	
	color: #404040;
	font-size: 18px;
	text-align: center;
	font-weight: 700;
	letter-spacing: 0.3px;
}

.questions_container
{
	position: relative;
	
	display: inline-block;
	
	width: 100%;
	height: calc(50vh - 130px);
	
	overflow-y: auto;
}

.one_support_que
{
	position: relative;
	width: calc(100% - 5px);
	
	margin-bottom: 10px;
	padding: 20px 45px 20px 8px;
	
	background-color: #ffffff;
	
	font-size: 16px;
	color: #575757;
	text-align: left;
	font-weight: 500;
	
	border: 1px solid #dddddf;
	border-radius: 5px;
	
	cursor: pointer;
}

.abs_question_arrow
{
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	
	width: 22px;
	height: 22px;
	
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
	background-image: url(./../images/right-arrow-angle.svg);
}

.faq_search_container
{
	display: inline-block;
	width: 100%;
	height: 60px;
}

.search_faq
{
	position: relative;
	width: 100%;
	
	padding: 10px 40px 10px 35px;
	
	color: #d6d5d7;
	
	background-color: #fcfbfd;
	
	border-radius: 30px;
	border: 1px solid #d6d5d7;
}

.input_faq
{
	width: 100%;
	height: 100%;
	
	font-size: 16px;
	color: #575757;
	
	background-color: transparent;
	border: 0px none;
	outline: none;
}

.search_icon
{
	position: absolute;
    top: 50%;
    left: 12px;
    transform: translateY(-50%);
    
	width: 15px;
    height: 15px;
    
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(./../images/magnifying-glass.svg);
}

.start_search
{
	position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    
	width: 24px;
    height: 24px;
    
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(./../images/start_search.svg);
	
	cursor: pointer;
}


.support_middle_part ::-webkit-scrollbar {
  width: 8px;
  background-color: #99949c;
  border-radius: 10px;
}

/* Track */
.support_middle_part ::-webkit-scrollbar-track {
  border-radius: 10px;
}
 
/* Handle */
.support_middle_part ::-webkit-scrollbar-thumb{
  background: #3f3d40; 
  border-radius: 10px;
}

.back_support_title
{
	padding-left: 35px;
	text-align: left;
	cursor: pointer;
}

.back_arrow
{
    position: absolute;
    top: 24px;
    left: 10px;
    
	width: 16px;
    height: 16px;
    
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(./../images/left-arrow.svg);
}

.question_chosen_container
{
	width: 100%;
}

.question_title
{
	height: 70px;
	
	padding-top: 20px;
    padding-bottom: 20px;
    
	color: #404040;
    font-size: 18px;
    text-align: left;
    font-weight: 700;
    letter-spacing: 0.3px;
}

.chosen_que
{
	position: relative;
	
	height: 70px;
	
	color: #404040;
    font-size: 18px;
    text-align: left;
    font-weight: 700;
    letter-spacing: 0.3px;
	
	overflow-y: auto;
}

.widder_question
{
	font-size: 16px;
}

.answer_container
{
	position: relative;
    
	display: inline-block;
   
	width: 100%;
    height: calc(50vh - 150px);
	
	padding: 8px;
	
	background-color: #ffffff;
    
    border: 1px solid #dddddf;
    border-radius: 5px;
    
	overflow-y: auto;
}

.answer_container a 
{
    color: #b146d6;
}

.answer_container li
{
	margin-top: -15px;
}

.list_container_parent
{
	position: relative;
    
	display: inline-block;
   
	width: 100%;
    height: calc(50vh - 150px);
	
	overflow-y: auto;
}

.faq_answer
{
	margin-bottom: 0px;
	
	font-size: 16px;
    color: #575757;
    text-align: left;
    font-weight: 500;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    white-space: pre-wrap;
}

.faq_answer a
{
	color: #b146d6;
}

.faq_answer ul
{
	margin-bottom: 0px;
}

.buttons_container_faq
{
	display: inline-block;
	
	width: 100%;
	
	margin-top: 10px;
	margin-bottom: 30px;
	
	text-align: center;
}

.faq_btns
{
	display: inline-block;
	
	margin-right: 10px;
	margin-bottom: 5px;
	padding: 10px 20px;
	
	font-size: 16px;
	color: #bd00ff;
	font-weight: 700;
	
	border: 2px solid #bd00ff;
	
	border-radius: 30px;
	cursor: pointer;
}

.faq_btns:hover
{
	background-color: #f2f1f6;
}

.pointer
{
	cursor: pointer;
}

.ptb50
{
	padding-top: 50px;
	padding-bottom: 50px;
}

@-webkit-keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
  100% {
      opacity: 1;
  }
}
@keyframes pulse {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
  100% {
      opacity: 1;
  }
}

.relative_empty
{
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	
	text-align: center;
	color: #bd00ff;
    font-weight: 500;
}

.ulInUl
{
	margin-block-start: -3em !important;
	list-style-type: disc;
}

.question_answer .ulInUl
{
	margin-bottom: -40px !important;
}

.relative_empty
{
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	
	text-align: center;
	color: #bd00ff;
    font-weight: 500;
}

.plug_container
{
	position: relative;
	
	display: inline-block;
	
	width: 100%;
	height: 50vh;
	
	padding-top: 10px;
	padding-bottom: 10px;
	
	text-align: left;
	
	overflow-y: auto;
}

.support_input_container
{
	display: inline-block;
	width: 100%;
	padding-bottom: 10px;
	text-align: left;
}

.support_input_title
{
	padding-bottom: 5px;
	
	font-size: 15px;
    text-align: left;
    color: #404040;
    font-weight: 500;
}

.support_input
{
	width: 97%;
    
	padding: 12px 10px;
    
	color: #000;
    font-size: 16px;
    text-align: left;
    
	border-radius: 8px;
    border: 1px solid #dedee0;
	
	outline: none;
}

.area_support
{
	height: 110px;
	outline: none;
	resize: none;
}

.support_input_title span
{
	font-size: 13px;
	font-weight: normal;
}

.attachments_container
{
	position: relative;
	
	width: 97%;
	
	padding: 15px 10px;
	
	background-color: #fff;
	
	font-size: 14px;
	text-align: center;
	color: #404040;
	
	border-radius: 8px;
	border: 1px dashed #dedee0;
	
	cursor: pointer;
}

.relative_files
{
	position: relative;
}

.clip_icon
{
	position: absolute;
	top: 2px;
	left: -25px;
	
	width: 18px;
	height: 18px;
	
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-image: url(./../images/attach.svg);
}

.support_send_container
{
	display: inline-block;
	width: 97%;
	text-align: right;
}

.support_send_btn
{
	display: inline-block;
    
	padding: 12px 40px;
    
	background-color: #121126;
    
	font-size: 16px;
    color: #fff;
    font-weight: 500;
    
	border-radius: 35px;
    
	cursor: pointer;
}

.opacity_file
{
	position: absolute;
	top: 0px;
	left: 0px;
	
	width: 100%;
	height: 100%;
	
	opacity: 0;
	cursor: pointer;
}

.support_error
{
	border: 1px solid #ef5454;
}

.one_attach_support
{
	position: relative;
	display: inline-block;
	
	width: 97%;
	
	margin-bottom: 10px;
	padding: 15px 35px 15px 60px;
	
	background-color: #f8f9f9;
	
	border: 1px solid #dedee0;
	border-radius: 8px;
}

.support_attach_name
{
	color: #2f3941;
	font-size: 14px;
	text-align: left;
}

.support_attach_size
{
	color: #78828b;
	font-size: 14px;
	text-align: left;
}

.support_attach_img
{
	position: absolute;
	top: 17px;
	left: 10px;
	
	width: 40px;
	height: 40px;
	
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.image_icon
{
	background-image: url(./../images/image_support.svg);
}

.video_icon
{
	background-image: url(./../images/multimedia_support.svg);
}

.document_icon
{
	background-image: url(./../images/document_support.svg);
}

.remove_attach
{
	position: absolute;
	top: 24px;
	right: 20px;
	
	width: 8px;
	height: 8px;
	
	background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
	background-image: url(./../images/remove_doc.svg);
	
	cursor: pointer;
}

.support_loader_holder
{
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	
	display: inline-block;
	
	width: 100%;
	
	text-align: center;
}

.loader_support
{
	display: inline-block;
	
	width: 120px;
	height: 120px;
	  
	border: 16px solid #e6e2e2;
	border-top: 16px solid #bd00ff; 
	border-radius: 50%;
	 
	animation: spin 2s linear infinite;
}

@keyframes spin 
{
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

.loader_support_info
{
	padding-top: 25px;
	
	font-size: 18px;
	text-align: center;
	font-weight: 500;
	color: #000;
}

@media(max-width: 450px)
{
	.support_container
	{
		width: 85vw;
	}
}

/* SUPPORT FLOW UI UROS END */

@-moz-keyframes pulse {
0% {opacity:1;}
50% {
    opacity: 0.3;
  }
100% {opacity:1;}
}

#multi-device-login-alert
{
    z-index: 9999 !important;
}

/* EJECT PARTICIPANT POPUP */

.ejected_content
{
	background: #2a2a2a;
	border: none;
	
	position: relative;
  
    display: flex;
   
    flex-direction: column;
	border-radius: .3rem;
    width: 100%;
	
	padding-bottom: 30px;
}

.moreZIndex
{
	z-index: 2150;
}

.modal_div_pop
{
	height: 100%;
	width: 100%;
	
	z-index: 2001;
}

.new_modal
{
	display: flex;
	height: 100%;
	width: 100%;
	
}

.newDisplBlock
{
	display: block;
}

.relative_eject 
{
    position: relative;
    padding-top: 40px !important;
}

.new_padding_pop
{
	padding-bottom: 30px;
}

.abs_participant_img 
{
    position: absolute;
    top: -65px;
    left: 50%;
    transform: translateX(-50%);
    width: 125px;
    height: 125px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 50%;
    box-shadow: 0px 0px 4px 0px #000000;
}

.error_reason
{
	border: 1px solid #ff0000 !important;
}

.white_pop_text 
{
    color: #fff !important;
    text-shadow: none !important;
    font-size: 23px;
}

.newZindex
{
	background-color: rgba(0, 0, 0, 0.9) !important;
	z-index: 2001;
}
.text_area_pop
{
    height: 141px;
    padding: 20px 18px;
    margin-bottom: 17px;
	border-radius: 0px 12px 12px 12px;
    background: rgb(52, 33, 59);
    color: #fff;
    border: 2px solid #b002ed;
	width: 100%;
}
/* EJECT PARTICIPANT POPUP */

.zommedout_eject
{
	position: absolute;
	top: 0px;
	right: 27px;
	
	width: 165px;
}

.zommedout_eject img
{
	width: 17px;
	height: 18px;
}

.eject_btn 
{
    padding: 1px 10px;
    background-color: #fff;
    color: #bd00ff!important;
    letter-spacing: 1px;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    border-radius: 35px;
    cursor: pointer;
}

.mtb10
{
	margin-top: 10px;
	margin-bottom: 10px;
}

.download_back_container
{
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	
	width: 100vw;
	height: 100vh;
	
	background-color: rgba(0,0,0,0.8); 
	
	z-index: 100;
}

.download_content
{
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: inline-block;
	
	width: 70%;
	max-height: 95vh;
	
	padding: 170px 0px;
	
	background-color: #2f2f2f;
	
	border-radius: 35px;
	
	overflow-y: auto;
}

.download_text
{
	text-align: center;
	font-size: 40px;
	font-weight: 700;
	color: #ffffff;
	letter-spacing: 1px;
}

.relative_down
{
	position: relative;
}

.down_btn
{
	display: inline-block;
	
	padding: 15px 30px;
	
	font-size: 22px;
	text-align: center;
	color: #fff;
	font-weight: 300;
	letter-spacing: 1px;
	
	background-color: #bd00ff;
	
	border-radius: 35px;
	
	cursor: pointer;
}

.for_down_btn
{
	display: inline-block;
	width: 100%;
	margin-top: 30px;
	text-align: center;
}

.rocket_emoji
{
	position: absolute;
	
	top: 5px;
	right: -55px;
	
	width: 45px;
	height: 45px;
	
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
	background-image: url(./../images/rocket.png);
}

@media(max-width: 800px)
{
	.download_content
	{
		width: 95%;
	}
}

@media(max-width: 600px)
{
	.download_content
	{
		padding: 100px 0px;
	}
	
	.download_text
	{
		font-size: 30px;
	}
	
	.rocket_emoji
	{
		right: -40px;
		width: 35px;
		height: 35px;
	}
}

@media(max-width: 450px)
{
	.download_text 
	{
		font-size: 24px;
	}
	
	.rocket_emoji
	{
		top: 4px;
		width: 30px;
		height: 30px;
	}
	
	.down_btn
	{
		font-size: 20px;
	}
}

@media(max-width: 370px)
{
	.download_text 
	{
		font-size: 20px;
	}
	
	.rocket_emoji 
	{
		top: 3px;
		right: -30px;
		width: 25px;
		height: 25px;
	}
}

.absolute_icons_participant
{
	position: absolute;
    bottom: 31px;
    left: 7px;
    z-index: 6;
}

.msg_container
{
	display: inline-block;
	
	width: 100%;
	
	margin-bottom: 25px;
	
	text-align: center;
}

.recording_msg
{
	position: relative;
	display: inline-block;
    
	padding: 13px 20px 13px 60px;
    
	background-color: #cc0119;
    
	font-size: 14px;
    color: #fff;
    text-align: center;
    
	border-radius: 10px;
}

.alert_icon
{
	position: absolute;
    top: 14px;
    left: 15px;
    
	width: 20px;
    height: 20px;
    
	background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(./../images/alert.svg);
   
	border-radius: 50%;
}

@media(max-width: 1500px)
{
	.recbtns
	{
		margin-top: 5px;
	}
}

.main_progress_container
{
	position: absolute;
    top: 114px;
    right: 290px;
	
	max-width: 90%;
	
	padding-top: 7px;
	padding-bottom: 7px;
	padding-left: 15px;
	padding-right: 15px;
	
	background: rgba(0, 0, 0, 0.4);
	
	border-radius: 30px;
	
	z-index: 3;
}

.unactive_ondemandPlayer
{
	top: 28px !important;
}

.start_room_setup
{
	margin-right: 50px;
}

.control_icons
{
	display: inline-block;
	
	width: 25px;
	height: 25px;
	
	margin-right: 8px;
	
	background-repeat: no-repeat;
	background-size: 20px;
	background-position: center;
	
	cursor: pointer;
	
	vertical-align: middle;
}

.play_icon
{
	background-image: url(./../images/play.svg);
}

.pause_icon
{
	background-image: url(./../images/pause.svg);
}

.stop_icon
{
	background-image: url(./../images/stop.svg);
}

.unmute_icon
{
	background-image: url(./../images/volume.svg);
	background-size: 23px;
}

.mute_icon
{
	background-image: url(./../images/volume_cross.svg);
	background-size: cover;
}

.progress_container
{
	display: inline-block;
	
	width: 400px;
	
	vertical-align: middle;
}

.progress_main
{
	-webkit-appearance: none;
	width: 100%;
	height: 10px;
	
	background: #434343;
	
	-webkit-transition: .2s;
	transition: opacity .2s;
	
	outline: none;
	opacity: 0.8;
	border-radius: 30px;
	
	cursor: pointer;
}

.progress_main:hover 
{
	opacity: 1;
}

.progress_main::-webkit-slider-thumb 
{
	-webkit-appearance: none;
	appearance: none;
	width: 25px;
	height: 25px;
	background: #121126;
	cursor: pointer;
	border-radius: 50% !important;
}

.progress_main::-moz-range-thumb 
{
	width: 15px;
	height: 15px;
	background: #121126;
	cursor: pointer;
	border-radius: 50%;
}

.duration_container
{
	display: inline-block;
	
	margin-left: 15px;
	
	font-size: 20px;
	color: #fff;
	font-weight: 700;
	
	vertical-align: middle;
}

.duration_video
{
	display: inline-block;
	
	font-size: 20px;
	color: #fff;
	font-weight: 700;
}

.smallerVideo
{
	display: inline-block;
	width: 70vw !important;
	height: 80vh !important;
	max-height: calc(70vw * 9 / 16 ) !important;
	max-width: calc(80vh * 16 / 9) !important;
	top: 7vw!important;
	left: 2vw!important;
}

.smallerVideo canvas
{
	height: 100%;
}

.skiproomsetupsh
{
	position: absolute;
    top: 5px;
    right: 5px;
    padding: 13px 50px;
    z-index: 1000000;
}

@media(max-width: 1500px)
{
	.checkmark_host
	{
		max-width: 45px;
		max-height: 45px;
	}
	
	.tooltipImageHost
	{
		max-height: 70px;
	}
}

.settings_popup_active
{
	display: block;
	background: rgba(0,0,0,.8);
}

.zindex999999
{
	z-index: 9999999999 !important;
}

.zindex999
{
    z-index: 999 !important;
}

.popup_error_text
{
	color: #fff;
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
    white-space: pre-wrap;
	overflow-x: hidden;
	margin-bottom: 0px;
}

.modl_bg_drk 
{
    background-color: #121126 !important;
    border-radius: 10px;
}

.save_height_cbx
{
	position: relative;
	display: inline-block;
	
	padding-left: 35px;
	
	font-size: 20px;
	text-align: left;
	color: #fff;
	
	cursor: pointer;
}

.height_cbx
{
	position: absolute;
    top: 4px;
    left: 0px;
}

.on_screen_1 .actNameHost
{
	font-size: 2vw;
}

.on_screen_1 .part_inner
{
	font-size: 1.5vw;
}

.on_screen_1 .upNext
{
	font-size: 1vw;
}

.on_screen_1 .tooltipImage
{
	height: 12vh;
}

.on_screen_2 .actNameHost
{
	font-size: 1.2vw;
}

.on_screen_2 .part_inner
{
	font-size: 1vw;
}

.on_screen_2 .upNext
{
	font-size: 0.8vw;
}

.on_screen_2 .tooltipImage
{
	height: 8vh;
}

.on_screen_3 .actNameHost
{
	font-size: 1vw;
}

.on_screen_3 .part_inner
{
	font-size: 0.6vw;
}

.on_screen_3 .upNext
{
	font-size: 0.6vw;
}

.on_screen_3 .tooltipImage
{
	height: 6vh;
}

.on_screen_4 .actNameHost
{
	font-size: 0.8vw;
}

.on_screen_4 .part_inner
{
	font-size: 0.6vw;
}

.on_screen_4 .upNext
{
	font-size: 0.4vw;
}

.on_screen_4 .tooltipImage
{
	height: 4vh;
}

.chat-wrapper {
    position: fixed;
    right: 17px;
    top: 17px;
    width: 27vw;
    background-color: #121126;
    border-radius: 5px;
    display: none;
    transition: all 0.4s;
    z-index: 1001;
    height: 92vh;
    border-radius: 25px;
}

#check:checked~.wrapper {
    opacity: 1
}

.chat-header {
    padding: 13px;
    background-color: #121126;
    border-radius: 5px 5px 0px 0px;
    margin-bottom: 10px;
    color: #fff;
    border-radius: 25px;
}

.chat-body {
    display: flex;
    flex-direction:column;
    height: 89%;
}

.chat-msg-container{
    margin: 0;
    width: 100%;
    padding-right: 20px;
    padding-left: 20px;
    -webkit-transition: all 200ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
    -moz-transition: all 200ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
    -ms-transition: all 200ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
    -o-transition: all 200ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
    transition: all 200ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
    overflow-x: hidden;
	overflow-y: auto;
	/* flex: 1 1 auto; */
	position: relative;
	
	height: calc(100% - 96px);
}
/* Chat CSS starts */
.chat-messages{
    padding:0px;
}

.chat-messages .message{
  padding: 0 0 20px 40px;
  clear:both;
  margin-bottom:10px;
  background-color: #000;
  border-radius: 10px;
}
.chat-messages .message.right{
    padding: 0 38px 0px 0;
    margin-left: 2px;
    background-color: #121126;
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
    align-items: flex-end;
}

.chat-messages .left{
    padding: 0px;
    margin-left: 19px;
    background-color: #121126;
    display: flex;
    justify-content: flex-end;
    flex-direction: column;
    align-items: flex-start;
}

.chat-messages .message .headermsg img{
    float: left;
    margin-left: -38px;
    border-radius: 50%;
    width: 30px;
    margin-top: 12px;
}
.chat-messages .message a{
    text-decoration: none;
}
ul {
    list-style-type: none !important;
}
.chat-messages .message .bubble .chat-file-link{
    padding: 5px;
    cursor: pointer;
}

.chat-messages .message.left .bubble div a{
    color: black;
}
.chat-messages .message.right .bubble div a{
    color: white;
}

.chat-messages .message.right .headermsg img{
  float: right;   
  margin-left: 0;
  margin-right: -38px; 
  width: 30px;
  height: 30px;
}
.chat-messages .message.left .headermsg img{
    float: left;   
    margin-left: -35px; 
    position: absolute;
    width: 30px;
    height: 30px;
  }

.chat-messages .message.right .corner{
  position: absolute;
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 7px solid #b2e281;
  border-right: initial;
  left: initial;
  right: -6px;
  bottom: 10px;
}

.chat-history {
  overflow-y: auto;
}

.chat-history>li{
  width: 100%;
  height: 100px;
  position: relative;
  border-bottom: 1px solid #E6E6E6;
}

.chat-history>li.selected{
  background-color: #D8DADA;
  border-bottom: 0;
}

.chat-history>li .title{
  font-size: 16px;
  padding: 10% 20px 0px 20px;
}

.chat-history>li .desc{
  font-size: 13px;
  padding: 0px 20px 10px 20px;
}

.chat-messages .message.right .bubble{
    background: #20bbe1;
    float: right;
    border-radius: 30px;
    padding: 7px 13px;
    color: white;
    max-width: 100%;
    word-wrap: break-word;
    margin-right: -10px;
}

.chat_user_action{
    display: flex;
    flex-direction: column;
    align-items: stretch;
    height: 96px;
    flex: 0 0 auto;
}
.chat_user_action .to{
    display: flex;
    justify-content: flex-start;
    background-color: #24223d;
    padding: 10px;
    margin-bottom: 2px;
}

.chat_body .chat-emoji{
    transition: none;
}
.chat_inputlabel{
    height: 25px;
    width: 25px;
    background-image: url("../images/chat/chat-add-icon.svg");
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.chat_user_action .to .chat-option{
    max-height: 70px;
	color: white;
    border: none;
    background-color: #24223d;
    padding-left: 10px;
	width: 200px;
	overflow-y: auto !important;
}    

.chat_user_action .chat_send{
    display: flex;
    justify-content: flex-start;
}
.chat_user_action .chat_assets{
	position: relative;
    background-color: #24223d;
    display: flex;
    padding:10px;
    border-radius: 0 0 25px 25px;
}
.chat_user_action .chat_assets .chat-smiley{
    height: 25px;
    position: absolute;
    right: 50px;
    margin-top: 6px;
    cursor: pointer;
}
.chat_user_action .chat_assets .chat-send{
    height: 25px;
    position: absolute;
    right: 13px;
    margin-top: 6px;
    cursor: pointer;
}

.chat_user_action .chat_assets .chat-emoji{
	position: absolute;
	left: 0px;
	width: 100%;
	top: -135px;
	
	z-index: 2147483003;
	transition: none;
}

.chat-messages .message .ch_time
{
    color: white;
    font-size:small;
}
.chat-messages .message.right .headermsg{
    display: flex;
    justify-content: flex-end;
    align-items: center;
}

.chat-messages .message.right .headermsg .to{
    padding-top: 10px;
    padding-right: 10px;
    font-size: small;
}

.chat-messages .message.left .headermsg{
    display: flex;
    justify-content: flex-start;
    align-items: center;
}

.chat-messages .message.left .headermsg .to{
    padding-top: 10px;
    font-size: small;
}

.chat-messages .message.left .bubble{
    background: #fff;
    float: left;
    border-radius: 30px;
    padding: 7px 13px;
    color: black;
    max-width: 100%;
    word-wrap: break-word;
    margin-left:  -5px;
}
.bubble .corner{
  position: absolute;
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-right: 7px solid white;
  left: -6px;
  bottom: 10px;
}
.chat-messages .message.right .corner{
  position: absolute;
  width: 0;
  height: 0;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 7px solid #b2e281;
  border-right: initial;
  left: initial;
  right: -6px;
  bottom: 10px;
}
.bubble span{
    color: #aab8c2;
    font-size: 25px;
    /*position: absolute;
    white-space: nowrap;
    right: 0;
    bottom: -22px;*/
}
.media-container {
    height: 500px;
    overflow-y: scroll;
    overflow-x: hidden;
}
.typing-area {
    height: 50px;
    border-color: #24223d;
    border-radius: 10px;
    background-color: #24223d;
    color: white;
    font-size:16px;
    width:100%;
    margin-left: 10px;
    padding-right : 69px;
	outline: none;
	resize: none;
}
.chat-text {
    display: inline-block;
    font-weight: 700;
    cursor: pointer;
    height: 30px;
    width: 30px;
    position: absolute;
    top: 35%;
    right: 8%;
}
.chat-text-host {
    display: inline-block;
    font-weight: 700;
    cursor: pointer;
    position: relative;
}
.chat-host{
    margin-left: 15px;
    z-index: 1001;
    position: absolute;
}

.chat-guest {
    position: absolute;
    z-index: 9992;
}
.chat-lounge{
    position: absolute;
    top: 45px;
    right: 101px;
}
.chat-lounge .chat-text{
}

.chat-host .badge-pill{
    position: inherit;
}

.chat-text-guest{
    height: auto;
    width: auto;
    cursor: pointer;
}

.chat-text-guest img{
    height: 20px;
    width: 20px;
}

.bg-black
{
    background-color: black !important
}
.chat-wrapper .chat-msg-container::-webkit-scrollbar {
    width: 5px;
}
.chat-wrapper .chat-msg-container::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.chat-wrapper .chat-msg-container::-webkit-scrollbar-thumb {
    background: #b002ed;
}

.chat-emoji .intercom-composer-popover-body::-webkit-scrollbar {
    width: 5px;
}
.chat-emoji .intercom-composer-popover-body::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.chat-emoji .intercom-composer-popover-body::-webkit-scrollbar-thumb {
   background: #121126;
}

.user-left{
    color: #fff;
    background-color: red;
    border-radius: 15px;
    bottom: 5px;
    position: relative;
}
.chat-link {
    color: #0000ff !important;
}
.unread-messages {
    position: fixed;
    background-color: #cab0ea;
    color: #000;
    border: 5px solid #cab0ea;
    border-radius: 20px;
    top: 50%;
    left: 80%;
    width: 200px;
    cursor: pointer;
    z-index: 99;
}
.text-align-start {
    text-align: justify;
}
.badge-wrapper {
    right: 7px;
    position: absolute;
    top: 5px
}

.emoji-right{
    background: #121126;
    position: absolute;
    right: 6px;
    border-radius: 20px;
    top: 11px;
}
.padding-6{
    padding: 6px;
}

.emoji {
  display: inline-block;
  background-size: 100% 100%;
}

/* ----------- iPad 1, 2, Mini and Air ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 1) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* ----------- iPad 3, 4 and Pro 9.7" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* ----------- iPad Pro 10.5" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 1112px)
  and (-webkit-min-device-pixel-ratio: 2) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 834px) 
  and (max-device-width: 834px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1112px) 
  and (max-device-width: 1112px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* ----------- iPad Pro 12.9" ----------- */

/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px)
  and (-webkit-min-device-pixel-ratio: 2) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 8% !important;
    }
}

/* Portrait */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}

/* Landscape */
/* Declare the same value for min- and max-width to avoid colliding with desktops */
/* Source: https://medium.com/connect-the-dots/css-media-queries-for-ipad-pro-8cad10e17106*/
@media only screen 
  and (min-device-width: 1366px) 
  and (max-device-width: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .chat-wrapper { 
        height: 85vh !important;
    }

    .chat-text {
        right: 10% !important;
    }
}
/* Chat CSS ends */

.canvas_gallery_par
{
	display: inline-block;
    vertical-align: middle;
	height: 25px;
}

.par_gallery_hold
{
	position: absolute;
    left: -61px;
    bottom: 21px;
}

.inner_streaming_hold
{
	position: relative;
}

.on_demand_tip
{
	width: 50%;
}

.intercom-composer-popover {
    box-shadow: 0 1px 15px 1px rgba(0,0,0,.08);
    background-color: #fff;
    border-radius: 6px;
    transition-duration: 200ms;
    transition-delay: 0ms;
    transform-style: flat;
    transform-origin: 50% 50% 0;
    opacity: 0;
    transition: all 0.2s linear;
    visibility: hidden;
}
.intercom-composer-popover.active{
  visibility: visible;
  opacity:1;
}
.intercom-emoji-picker {
    width: 27vw;
    height: 135px;
}

.intercom-composer-popover-body {
    padding: 0 20px;
    overflow-y: scroll;
    height: 133px;
}

.intercom-emoji-picker-group {
    margin: 10px -5px;
}
.intercom-emoji-picker-emoji {
    padding: 5px;
    width: 30px;
    line-height: 30px;
    display: inline-table;
    text-align: center;
    cursor: pointer;
    vertical-align: middle;
    font-size: 28px;
    transition: -webkit-transform 60ms ease-out;
    transition: transform 60ms ease-out;
    transition: transform 60ms ease-out,-webkit-transform 60ms ease-out;
    transition-delay: 60ms;
    font-family: Apple Color Emoji,Segoe UI Emoji,NotoColorEmoji,Segoe UI Symbol,Android Emoji,EmojiSymbols;
}
.intercom-emoji-picker-emoji:hover {
    transition-delay: 0ms;
    -webkit-transform: scale(1.4);
    -ms-transform: scale(1.4);
    transform: scale(1.4);
}
.intercom-composer-popover-caret {
    position: absolute;
    bottom: -8px;
    right: 55px;
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 8px solid #fff;
}

@media screen and (max-width: 900px)
{
	.paletteFlex
	{
		display: block;
		width: 75%;
		max-width: 75% !important;
	}
}

.click-cam-od, .switch-cam-od
{
	top: auto;
	bottom: 0px;
	
	pointer-events: auto;
}

.change-camera
{
	pointer-events: auto;
}

/*------------- PARTICIPANT REDESIGN START ------------ */

.participant_streaming_container
{
	position: relative;
	display: inline-block;
	
	width: 100%;
	height: 100vh;
	
	background-color: #adadbb;
	
	text-align: center;
	
	z-index: 1;
}

.container_right_menu
{
	width: calc(100% - 300px) !important;
}

.participant_header
{
	position: relative;
	display: inline-block;
	
	width: 100%;
	
	padding: 15px 30px 30px 30px;
	
	text-align: center;
}

.container_right_menu .participant_header, .container_right_menu .host_header
{
	text-align: right;
}

.container_right_menu .session_data_container
{
	max-width: 300px;
}

.container_right_menu .participant_header .participant_player
{
	display: none !important;
}

.fmControlAlign
{
	text-align: right;
	padding: 8px 30px 30px 30px
}

.session_data_container
{
	position: absolute;
    left: 30px;
   
	display: inline-block;
	
	max-width: 260px;
	
	padding: 9px 12px 9px 60px;
	
	background: rgba(20, 19, 41, 0.92);
	
	text-align: left;
	
	vertical-align: middle;
	border-radius: 42px;
	
	z-index: 4;
}

.networkMsgHolder
{
	position: absolute;
    left: 30px;
   
	display: inline-block;
	max-width: 260px;
	padding: 11px 55px;
	
	text-align: center;
	font-size: 20px;
	color: #000;
	font-weight: 600;
	
	background-color: #dddd04;
	border-radius: 42px;
	z-index: 5;
}

.virtualDisabledMsg
{
	position: absolute;
    right: 30px;
   
	display: inline-block;
	max-width: 260px;
	padding: 11px 55px;
	
	text-align: center;
	font-size: 20px;
	color: #000;
	font-weight: 600;
	
	background-color: #ff0000;
	border-radius: 42px;
	z-index: 5;
}

.networkMsg_moreWidth
{
	max-width: none;
}

.playlist_content
{
	display: inline-block;
	padding: 0px 20px;
	background: rgba(20, 19, 41, 0.92);
	border-radius: 42px;
}

.sess_name
{
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 20px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #fff;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.host_container
{
	display: inline-block;
	
	max-width: 150px;

	font-family: Poppins;
	font-style: normal;
	font-weight: 500;
	font-size: 15px;
	line-height: 22px;
	letter-spacing: 0.25px;
	color: #D8D8D8;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	
	vertical-align: middle;
}

.online_icon
{
	display: inline-block;
	
	width: 10px;
	height: 10px;
	
	margin: 0px 8px;
	
	background: #029A42;
	
	border-radius: 50%;
	
	vertical-align: middle;
}

.offline_icon
{
	background: #ff1010;
}

.online_text
{
	display: inline-block;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 500;
	font-size: 13px;
	line-height: 22px;
	letter-spacing: 0.25px;
	color: #FCEFEF;
	
	vertical-align: middle;
}

.channelimg
{
	position: absolute;
	top: 50%;
	left: 13px;
	transform: translateY(-50%);
	
	width: 40px;
	height: 40px;
	
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	
	border-radius: 6px;
}

.defChannelImg
{
	background-image: url('../images/session-banner.jpg');
}

.controls_container
{
	position: relative;
	display: inline-block;
	
	padding: 12px 20px;
	
	background: rgba(20, 19, 41, 0.92);
	
	border-radius: 42px;
	
	vertical-align: middle;
	z-index: 4;
}

.participant_header .controls_container
{
	vertical-align: top; 
}

.session_time
{
	position: relative;
	display: inline-block;
	
	width: 280px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 48px;
	line-height: 34px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
	text-align: center;
	
	vertical-align: middle;
}

.control_container
{
	position: relative;
	display: inline-block;
	
	padding: 3px 20px;
	
	text-align: center;
	
	vertical-align: middle;
	cursor: pointer;
}

.control_container:hover
{
	background: #504e80;
	border-radius: 6px;
}

.control_icon
{
	position: relative;
	display: inline-block;
	
	width: 20px;
	height: 20px;
	
	background-repeat: no-repeat;
	background-position: center;
}

.control_title
{
	margin-top: -3px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 600;
	font-size: 11px;
	line-height: 18px;
	display: flex;
	align-items: center;
	text-align: center;
	letter-spacing: 0.75px;
	color: #E4DAFF;
}

.audio_icon
{
	background-image: url('../images/audio.svg');
	background-size: 20px 20px;
}

.video_icon
{
	background-image: url('../images/video.svg');
	background-size: 18px 13px;
}

.video_icon_participants
{
	background-image: url('../images/video.svg');
	background-size: 18px 13px;
}


.chat_icon
{
	background-image: url('../images/chat.svg');
	background-size: 20px 20px;
}

.participants_icon
{
	background-image: url('../images/participants.svg');
	background-size: 17px 17px;
}

.hand_icon
{
	background-image: url('../images/hand.svg');
	background-size: 16px 20px;
}

.smyle_icon
{
	background-image: url('../images/smyle.svg');
	background-size: 17px 17px;
}

.fms_icon
{
	background-image: url('../images/gallery_fms.svg');
	background-size: 17px 17px;
}

.zoom_icon
{
	background-image: url('../images/zoom.svg');
	background-size: 17px 17px;
}

.more_icon
{
	background-image: url('../images/more.svg');
	background-size: 15px 3px;
}

.leave_icon
{
	background-image: url('../images/leave.svg');
	background-size: 15px 16px;
}

.abs_border
{
	position: absolute;
	top: 50%;
	right: 0px;
	transform: translateY(-50%);
	
	width: 1px;
	height: 22px;
	
	background: #C4C4C4;
	border-radius: 12px;
}

.main_view_participant
{
	display: inline-block;
	width: 100%;
}

.left_stream
{
	display: inline-block;
	width: 500px;
	padding-left: 30px;
	text-align: left;
}

.zoomPartStreamHolder .control_icon
{
	height: 25px;
	width: 25px;
	
	background-size: 25px 25px;
}

.right_stream
{
	display: inline-block;
	width: calc(100% - 500px);
	text-align: right;
	vertical-align: top;
}

.stream_container
{
	display: inline-block;
	width: 100%;
	text-align: right;
}

.stream_inner
{
	position: relative;
	display: inline-block;
	
	width: 230px;
	
	margin-bottom: 20px;
	padding: 16px 5px 16px 38px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #FCFCFC;
	text-align: left;
	
	background: #121126;
	border-radius: 24px 0px 0px 24px;
	
	cursor: pointer;
	z-index: 3;
}

.stream_inner_zoomed
{
    width: 50px;
	padding: 0px 9px 16px 38px;
	font-size: 0px;
}

.open_stream_inner
{
	position: relative;
	display: inline-block;
	
	width: 275px;
	
	margin-bottom: 20px;
	padding: 16px 20px 16px 20px;
	
	text-align: left;
	
	background: #121126;
	border-radius: 24px 0px 0px 24px;
	
	z-index: 3;
}

.hide_stream_text
{
	position: relative;
	
	padding-left: 18px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #FCFCFC;
	
	cursor: pointer;
}

.open_arrow
{
	position: absolute;
	top: 50%;
	left: 20px;
	transform: translateY(-50%);
	
	width: 6px;
	height: 9px;
	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/arr_left_stream.svg');
}

.close_arrow
{
	position: absolute;
	top: 50%;
	left: 0px;
	transform: translateY(-50%);
	
	width: 9px;
	height: 6px;
	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/arr_down_stream.svg');
}

.cam_container
{
	display: inline-block;
	width: 100%;
	margin-top: 10px;
	text-align: center;
}

.cam_stream
{
	position: relative;
	display: inline-block;
	
	width: 232px;
	height: 131px;
	
	border-radius: 8px;
}

.cam_stream video, .cam_stream canvas
{
	position: absolute;
	left: 0px;
	
	width: 232px !important;
	height: 131px !important;
	
	border-radius: 8px;
	
	zoom: 1 !important;
}

.no_cam_stream
{
	position: relative;
	display: inline-block;
	
	width: 232px;
	height: 131px;
	
	padding: 20px 0px;
	
	background: #0A091A;
	
	text-align: center;
	
	border-radius: 8px;
}

.initials
{
	display: inline-block;
	
	width: 88px;
	height: 88px;
	
	padding: 20px 0px;
	
	background: #E4DAFF;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 32px;
	line-height: 50px;
	letter-spacing: 1px;
	color: #BCA4FF;
	text-align: center;
	
	border-radius: 50%;
}

.main_stream
{
	position: absolute;
	top: 0px;
	left: 0px;
	
	width: 100%;
	height: 100vh;
	
	z-index: -1;
}

.main_stream canvas
{
	width: 100% !important;
	height: 100% !important;
	max-width: calc(100vh * (16/9)) !important;
	max-height: calc(100vw * (9/16)) !important;
	zoom: 1 !important;
}

.replay_video
{
	width: 100% !important;
	height: 100% !important;
}

.participant_injected
{
	width: 100%;
	height: 100vh;
	
	object-fit: cover;
}

.participant_name_container
{
	position: absolute;
	bottom: 5px;
	left: 5px;
	
	height: 34px;
    
	padding: 4px 15px;
	
	background-color: rgba(6, 5, 11, 0.8);
	
	border-radius: 12px;
	z-index: 1;
}

.participant_name
{
	display: inline-block;
	
	max-width: 100px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: 0.25px;
	color: #FCFCFC;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	
	vertical-align: middle;
}

.zoomPartStreamHolder
{
	position: absolute;
	top: 1%;
	right: 1%;
	padding: 3px 5px 0px 5px;
	
	background-color: rgba(6, 5, 11, 0.8);
	z-index: 1;
	cursor: pointer;
}

.main_stream video
{
	display: block !important;
}

.stream_pop_holder
{
	position: fixed;
	top: 0px;
	left: 0px;
	
	width: 100%;
	height: 100vh;
	
	background-color: rgba(0, 0, 0, 0.7);
	
	z-index: 6;
}

.notes_pop_holder
{
	background-color: rgba(0, 0, 0, 0.3);
}

.close_zoomed
{
	position: absolute;
	top: 20px;
	right: 20px;
	
	width: 35px;
	height: 35px;
	
	background-image: url('../images/close_zoom.svg');
	background-size: cover;
    background-position: center;
	background-repeat: no-repeat;
	
	cursor: pointer;
	
	z-index: 4;
}

.zoom_container
{
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	
	width: 90%;
	height: 90vh;
	
	border-radius: 8px;
}

.zoom_container video, .zoom_container canvas
{
	position: absolute;
	left: 0px;
	
	width: 100% !important;
	height: 100% !important;
	
	border-radius: 8px;
	
	zoom: 1 !important;
}

.stream_inner_pop
{
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	
	width: 680px;
	
	padding: 50px 35px 35px 35px;
	
	background: #06050B;
	
	border-radius: 20px;
}

.notes_back_color
{
	position: absolute;
	
	padding: 15px;
	background: rgb(35 33 58);
	z-index: 5;
}

.stream_pop_text
{
	padding-bottom: 65px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 32px;
	line-height: 50px;
	letter-spacing: 1px;
	color: #FFFFFF;
	text-align: left;
	word-break: break-word;
}

.stream_btns_holder
{
	display: inline-block;
	width: 100%;
	text-align: right;
}

.stream_cancel_btn
{
	display: inline-block;
	
	margin-right: 20px;
	padding: 12px 30px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 600;
	font-size: 16px;
	line-height: 28px;
	text-align: center;
	letter-spacing: 0.75px;
	color: #E4DAFF;
	
	border: 2px solid #E4DAFF;
	border-radius: 20px;
	
	vertical-align: middle;
	
	cursor: pointer;
}

.stream_confirm_btn
{
	display: inline-block;

	padding: 12px 30px;
	
	background-color: #E4DAFF;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 600;
	font-size: 20px;
	line-height: 28px;
	text-align: center;
	letter-spacing: 0.75px;
	color: #6D118C;
	
	border: 2px solid #E4DAFF;
	border-radius: 20px;
	
	vertical-align: middle;
	
	cursor: pointer;
}

.control_arrow
{
	position: absolute;
	top: 9px;
	right: -15px;
	
	width: 7px;
	height: 4px;
	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/control_arrow.svg');
}

.control_drop
{
	position: absolute;
	top: 50px;
	left: 0px;
	
	width: 250px;
	
	background: #121126;
	border-radius: 4px;
	
	z-index: 4;
}

.drop_container
{
	display: inline-block;
	
	width: 100%;
	
	padding: 10px 15px;
	
	border-bottom: 1px solid #444444;
}

.drop_title
{
	position: relative;
	
	padding-bottom: 15px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 500;
	font-size: 15px;
	line-height: 22px;
	letter-spacing: 0.25px;
	color: #FFFFFF;
	text-align: left;
}

.control_drop_padding
{
	padding: 10px 10px;
	max-height: 365px;
	
    overflow-x: auto;
	border-radius: 15px;
}

.fmsTitle
{
	padding-bottom:15px;
	
	text-align: left;
	font-size: 16px;
	color: #E4DAFF;
	font-family: Poppins;
}

.fms_note_img
{
	padding-bottom: 15px;
	width: 100%;
	height: 100px;
	
	border-radius: 15px;
	
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

.fms_note_text
{
	color: #fff;
	text-align: left;
	
	word-break: break-word;
	
	max-height: 48px;
	
	overflow: hidden;
	text-overflow: ellipsis;
	font-family: Poppins;
	
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical
}

.bottom_line_notes
{
	height: 1px;
	border-bottom: 1px solid #626262;
	margin-bottom: 10px;
}

.no_border
{
	border: 0px none;
}

.test_title
{
	font-family: Poppins;
	font-style: italic;
	font-weight: 500;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
}

.test_title_streaming
{
	font-family: Poppins;
    font-style: normal;
    font-weight: normal;
    font-size: 14px;
    line-height: 230%;
    color: #E4DAFF;
    text-align: center;
}

.drop_option
{
	position: relative;
	
	width: 100%;
	
	padding-left: 15px;
	padding-bottom: 7px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 12px;
	line-height: 230%;
	color: #E4DAFF;
	text-align: left;
	
	cursor: pointer;
}

.drop_option:hover, #mic_control:hover, #speaker_control:hover, #test_part:hover, #speak_control:hover, .highlight_option
{
	background-color: #504e80;
}

.drop_checked
{
	position: absolute;
	top: 8px;
    left: 0px;
	
	width: 9px;
	height: 7px;
	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/drop_checked.svg');
}

.drop_select
{
	background: none;
	border: none;
}

.drop_select option
{
	background-color: #504e80;
}

.right_menu_streaming
{
	position: relative;
	display: inline-block;
	
	width: 300px;
	height: 100vh;
	
	padding: 20px;
	
	background: #121126;
	
	overflow-y: auto;
	vertical-align: top;
	
	z-index: 1;
}

.right_menu_title
{
	position: relative;
	
	padding-bottom: 50px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: bold;
	font-size: 16px;
	line-height: 28px;
	text-align: center;
	letter-spacing: 0.75px;
	color: #FFFFFF;
}

.right_close
{
	position: absolute;
	top: 6px;
    left: 0px;
	
	width: 15px;
    height: 15px;
	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/right_close.svg');
	
	cursor: pointer;
}

.drop_close
{
	position: absolute;
	top: 7px;
    right: 0px;
	
	width: 9px;
	height: 9px;
	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/right_close.svg');
	
	cursor: pointer;
}

.participant_stat
{
	display: inline-block;
	width: 100%;
	margin-bottom: 20px;
	text-align: left;
}

.stat_number
{
	display: inline-block;
	width: 18px;
	
	width: 18px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	text-align: center;
	letter-spacing: 0.75px;
	color: #E4DAFF;
	
	vertical-align: middle;
}

.stat_avatar
{
	display: inline-block;
	
	width: 36px;
	height: 36px;
	
	margin: 0px 12px;
	
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	
	vertical-align: middle;
	border-radius: 8px;
}

.stat_name
{
	display: inline-block;
	
	width: calc(100% - 130px);
	
	font-family: Poppins;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	
	vertical-align: middle;
}

.stat_name:hover
{
	white-space: normal;
	word-break: break-all;
}

.reactions_container
{
	position: absolute;
	bottom: 40px;
	left: 50%;
	transform: translateX(-50%);
	
	width: 650px;
	
	padding: 40px 20px 20px 20px;
	
	background: #06050B;
	
	border-radius: 12px;
	
	z-index: 999;
}

.one_emoji
{
	display: inline-block;
	
	width: 100px;
	
	text-align: center;
	
	vertical-align: middle;
	cursor: pointer;
}

.one_emoji:hover, .highlight_emoji
{
	background-color: #353232;
	border-radius: 10px;
}

.emoji_icon
{
	display: inline-block;
	
	width: 50px;
    height: 45px;
    
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

.emoji_title
{
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #F3EFFF;
}

.close_emoji
{
	position: absolute;
	top: 15px;
	right: 20px;
	
	width: 13px;
	height: 13px;
	
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/close_emojis.svg');
	
	cursor: pointer;
}

.testing_container
{
	display: inline-block;
	
	width: 100%;
	
	margin-top: 15px;
	
	text-align: center;
}

.mic_test_icon
{
	display: inline-block;
	
	width: 40px;
	height: 40px;
	
	margin-right: 10px;
	
	background-image: url(../images/audio.svg);
    background-size: 40px 40px;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
}

.test_text
{
	display: inline-block;
	
	font-family: Poppins;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: 0.25px;
    color: #FFFFFF;
    text-align: left;
	
	vertical-align: middle;
}

.svg_visualizer
{
	display: inline-block;
    width: 60px;
    height: 45px;
	vertical-align: middle;
}

.activity_container
{
	display: inline-block;
	position: relative;
	
	width: 210px;
	margin-bottom: 10px;
	
	z-index: 3;
}

.top_activity
{
	display: inline-block;
	
	width: 100%;
	
	padding: 24px 0px 0px 0px;
	
	background: #24223D;
	
	border-radius: 42px 42px 0px 0px;
}

.on_demand_stats
{
    position: absolute !important;
	top: 60px !important;
	left: 10px;
	
	width: 210px;
	
    z-index: 20;
}

.top_activity_radius
{
	padding: 10px 0px 10px 0px;
	border-radius: 42px;
}

.activity_title
{
	padding: 0px 10px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 500;
	font-size: 29px;
	line-height: 30px;
	color: #FFFFFF;
	text-align: center;
}

.act_stats_container
{
	display: inline-block;
	
	width: 100%;
	
	padding: 10px 20px;
	
	text-align: center;
}

.one_stat
{
	display: inline-block;
	
	width: 100%;
	
	margin-bottom: 10px;
	
	text-align: left;
}

.heart_icon
{
	display: inline-block;
	
	width: 24px;
	height: 21px;
	
	background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjYiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNiAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik0xOC42MjUgMC43NUMyMi40MjI1IDAuNzUgMjUuNSAzLjg3NSAyNS41IDguMjVDMjUuNSAxNyAxNi4xMjUgMjIgMTMgMjMuODc1QzkuODc1IDIyIDAuNSAxNyAwLjUgOC4yNUMwLjUgMy44NzUgMy42MjUgMC43NSA3LjM3NSAwLjc1QzkuNyAwLjc1IDExLjc1IDIgMTMgMy4yNUMxNC4yNSAyIDE2LjMgMC43NSAxOC42MjUgMC43NVpNMTQuMTY3NSAyMC4yNTVDMTUuMjY4OCAxOS41NiAxNi4yNjI1IDE4Ljg2ODcgMTcuMTkyNSAxOC4xMjg3QzIwLjkxODggMTUuMTY2MyAyMyAxMS45Mjg4IDIzIDguMjVDMjMgNS4zIDIxLjA3ODggMy4yNSAxOC42MjUgMy4yNUMxNy4yOCAzLjI1IDE1LjgyNSAzLjk2MjUgMTQuNzY3NSA1LjAxNzVMMTMgNi43ODVMMTEuMjMyNSA1LjAxNzVDMTAuMTc1IDMuOTYyNSA4LjcyIDMuMjUgNy4zNzUgMy4yNUM0Ljk1IDMuMjUgMyA1LjMyIDMgOC4yNUMzIDExLjkzIDUuMDgyNSAxNS4xNjYzIDguODA2MjUgMTguMTI4N0M5LjczNzUgMTguODY4NyAxMC43MzEyIDE5LjU2IDExLjgzMjUgMjAuMjUzN0MxMi4yMDYzIDIwLjQ5IDEyLjU3NjMgMjAuNzE2MiAxMyAyMC45Njg4QzEzLjQyMzcgMjAuNzE2MiAxMy43OTM3IDIwLjQ5IDE0LjE2NzUgMjAuMjU1WiIgZmlsbD0iI0ZGODQ5MyIvPg0KPC9zdmc+DQo=');
    background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
}

.fire_icon
{
	display: inline-block;
	
	width: 24px;
	height: 21px;
	
	background-image: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTgiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAxOCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik04Ljk5OTggMjMuOTE2N0MxMS4xNTQ3IDIzLjkxNjcgMTMuMjIxMyAyMy4wNjA2IDE0Ljc0NSAyMS41MzY5QzE2LjI2ODggMjAuMDEzMiAxNy4xMjQ4IDE3Ljk0NjUgMTcuMTI0OCAxNS43OTE3QzE3LjEyNDggMTQuODUzNSAxNi44NzU2IDEzLjk1MzIgMTYuNTgzMSAxMy4xMTU4QzE0Ljc3NzIgMTQuOTAwMSAxMy40MDU3IDE1Ljc5MTcgMTIuNDY2NSAxNS43OTE3QzE2Ljc5NDQgOC4yMDgzMyAxNC40MTY1IDQuOTU4MzMgNy45MTY0NiAwLjYyNUM4LjQ1ODEzIDYuMDQxNjcgNC44ODc0NiA4LjUwNTE3IDMuNDMzNjMgOS44NzM0MkMyLjI0NzczIDEwLjk4ODkgMS40MjQzIDEyLjQzNDkgMS4wNzAxIDE0LjAyNEMwLjcxNTkwMyAxNS42MTMxIDAuODQ3MjcgMTcuMjcyIDEuNDQ3MTcgMTguNzg1NUMyLjA0NzA3IDIwLjI5OSAzLjA4Nzg0IDIxLjU5NzQgNC40MzQ1MyAyMi41MTI0QzUuNzgxMjIgMjMuNDI3MyA3LjM3MTcxIDIzLjkxNjUgOC45OTk4IDIzLjkxNjdaTTkuNzY4OTYgNC42NzEyNUMxMy4yOCA3LjY1MDQyIDEzLjI5NzQgOS45NjU1IDEwLjU4NDcgMTQuNzE4MUM5Ljc2MDMgMTYuMTYyMiAxMC44MDM1IDE3Ljk1ODMgMTIuNDY2NSAxNy45NTgzQzEzLjIxMTggMTcuOTU4MyAxMy45NjU4IDE3Ljc0MTcgMTQuNzYyIDE3LjMxMzdDMTQuNTI2IDE4LjIwNTMgMTQuMDg2MyAxOS4wMjk5IDEzLjQ3NzQgMTkuNzIyNkMxMi44Njg1IDIwLjQxNTMgMTIuMTA3MSAyMC45NTcyIDExLjI1MzIgMjEuMzA1N0MxMC4zOTkzIDIxLjY1NDEgOS40NzYxNCAyMS43OTk2IDguNTU2NDUgMjEuNzMwNkM3LjYzNjc2IDIxLjY2MTYgNi43NDU2NCAyMS4zODAxIDUuOTUzMjUgMjAuOTA4MUM1LjE2MDg3IDIwLjQzNjIgNC40ODg4NSAxOS43ODY4IDMuOTkwMTIgMTkuMDExQzMuNDkxMzkgMTguMjM1MiAzLjE3OTU2IDE3LjM1NDIgMy4wNzkxOCAxNi40Mzc0QzIuOTc4ODEgMTUuNTIwNiAzLjA5MjYyIDE0LjU5MzEgMy40MTE2OCAxMy43Mjc3QzMuNzMwNzMgMTIuODYyNCA0LjI0NjMgMTIuMDgyOSA0LjkxNzggMTEuNDUwN0M1LjA1NDMgMTEuMzIyOSA1Ljc0NjU1IDEwLjcwODcgNS43NzY4OCAxMC42ODE2QzYuMjM2MjEgMTAuMjY5OSA2LjYxNDMgOS45MDQ4MyA2Ljk4ODA1IDkuNTA1MDhDOC4zMjA1NSA4LjA3NzI1IDkuMjc4MjEgNi40OTM0MiA5Ljc2Nzg4IDQuNjcxMjVIOS43Njg5NloiIGZpbGw9IiNGRkQ3ODkiLz4NCjwvc3ZnPg0K');
    background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
}

.vo2_icon
{
	display: inline-block;
	
	width: 24px;
	height: 21px;
	
	background-image: url(../images/vo2_icon.svg);
    background-size: 100% 100%;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
}

.activity_val
{
	display: inline-block;
	
	margin: 0px 8px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 45px;
	line-height: 37px;
	color: #FFFFFF;
	
	vertical-align: middle;
}

.activity_type
{
	display: inline-block;
	
	padding-top: 8px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 27px;
	line-height: 15px;
	color: #FFFFFF;
	
	vertical-align: middle;
}

.counter_container
{
	position: relative;
	display: inline-block;
	
	width: 100%;
	
	padding: 14px 0px;
	
	background: #E4DAFF;
	
	text-align: center;
	
	border-radius: 0px 0px 42px 42px;
}

.counter_circle
{
	position: relative;
	display: inline-block;
	
	width: 100%;
	height: 90px;
	
	padding: 25px 0px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 67px;
	line-height: 32px;
	color: #000;
	text-align: center;
	letter-spacing: 1px;
	
	border: 0px solid #BCA4FF;
	border-radius: 50%;
}

.repeat_num
{
	position: absolute;
    top: 18px;
    left: 50%;
    transform: translateX(-50%);
    
	width: 100%;
    
	font-size: 16px;
    text-align: center;
    font-family: Poppins;
    font-style: normal;
    font-weight: normal;
    line-height: 32px;
    color: #000;
    letter-spacing: 1px;
}

.footer_streaming
{
	position: absolute;
	bottom: 0px;
	left: 0px;
	display: inline-block;
	
	width: 100%;
	
	padding: 0px 0px;
	
	text-align: left;
	z-index: 3;
}

.footerPaddingHolder
{
	padding: 20px 20px 30px 20px;
}

.footer_ps
{
	display: inline-block;
	width: 100%;
	margin-top: 20px;
	text-align: left;
}

.powered_streaming
{
	display: inline-block;
	
	width: 65px;
	height: 11px;
	
	background-image: url(../images/powered_by.svg);
    background-size: 65px 11px;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
}

.footer_logo
{
	display: inline-block;
	
	width: 77px;
	height: 16px;
	
	margin-top: -6px;
	margin-left: 7px;
	
	background-image: url(../images/logo_footer.svg);
    background-size: 77px 16px;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
}

.footer_activity_container
{
	position: relative;
	display: inline-block;
	
	width: 100%;
	
	margin-bottom: 30px;
	
	text-align: left;
}

.footer_border
{
	position: absolute;
	top: 0px;
	left: -20px;
	
	width: 4px;
	height: 100%;
	
	background-color: #fff;
}

.up_next
{
	display: inline-block;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 24px;
	line-height: 38px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
	
	vertical-align: middle;
}

.no_workout
{
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 24px;
	line-height: 38px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
	text-shadow: 2px 2px #000000;
	text-align: center;
}

.activity_index
{
	display: inline-block;
	
	margin-left: 15px;
    padding: 4px 17px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 600;
	font-size: 18px;
	line-height: 27px;
	text-align: center;
	letter-spacing: 0.75px;
	color: #FCFCFC;
	
	border: 2px solid #FCFCFC;
	border-radius: 20px;
	
	vertical-align: middle;
	cursor: pointer;
}

.next_name
{
	padding: 8px 5px 8px 0px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 40px;
	line-height: 38px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
	
	word-break: break-all;
}

.next_type
{
	padding-bottom: 8px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 30px;
	line-height: 34px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
}

.view_all_act
{
	display: inline-block;
	
	padding-bottom: 15px;
	
	font-family: Poppins;
	font-style: normal;
	font-size: 16px;
	line-height: 34px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
	text-decoration: underline;
	
	cursor: pointer;
	
	vertical-align: middle;
}

.more_settings_hold
{
	width: 280px;
	max-height: calc( 100vh - 100px );
	left: auto;
    right: 0px;
	
	overflow-y: auto;
}

.redo_button
{
	padding: 12px 15px;
	border-radius: 15px;
}

.footer_active
{
    position: relative;
	z-index: 3;
}

.arrow_act
{
	display: inline-block;
	
	width: 6px;
	height: 8px;
	
	margin-left: 15px;
	
	background-image: url(../images/arrow_act.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
}

.activity_container_menu
{
	display: inline-block;
	
	width: 100%;

	text-align: center;
}

.one_activity_menu
{
	display: inline-block;
	
	width: 100%;
	
	margin-bottom: 15px;
	padding: 20px 15px;
	
	background: #24223D;
	border-radius: 8px;
	
	text-align: left;
}

.one_activity_menu.active
{
	background: #3F3E4D;
}

.workout_name
{
	display: inline-block;
	
	text-align: left;
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 100%;
	letter-spacing: 0.75px;
	color: #FFFFFF;
	word-break: break-word;
}

.workout_duration
{
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 32px;
	line-height: 50px;
	letter-spacing: 1px;
	color: #FFFFFF;
	opacity: 0.8;
	text-align: left;
}

.workout_duration span
{
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 34px;
	letter-spacing: 0.75px;
	color: #E4DAFF;
	opacity: 0.8;
}

.success_work
{
	display: none;
	
	width: 20px;
	height: 20px;
	
	margin-left: 15px;
	margin-top: -2px;
	
	background-image: url(../images/success_activity.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
}

.one_activity_menu.active .success_work
{
	display: inline-block;
}

.play_activity
{
	display: inline-block;
	
	width: 20px;
	height: 20px;
	
	margin-left: 15px;
	margin-top: -2px;
	
	background-image: url(../images/play_activity.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
	cursor: pointer;
}

.hostScreenMainDiv .play_activity
{
	background-image: url(../images/host_play_activity.svg);
}

.live_participants_scroll
{
	position: relative;
	max-height: calc(100vh - 240px);
	overflow-y: auto;
	overflow-x: hidden;
}

.opened_my_stream .live_participants_scroll
{
	max-height: calc(100vh - 430px);
}

.stream_container ::-webkit-scrollbar {
  width: 8px;
  background-color: #99949c;
  border-radius: 10px;
}

/* Track */
.stream_container ::-webkit-scrollbar-track {
  border-radius: 10px;
}
 
/* Handle */
.stream_container ::-webkit-scrollbar-thumb {
  background: #3f3d40; 
  border-radius: 10px;
}

.right_menu_streaming .chat-wrapper .chat-msg-container::-webkit-scrollbar {
    width: 8px;
	background-color: #99949c;
	border-radius: 10px;
}
.right_menu_streaming .chat-wrapper .chat-msg-container::-webkit-scrollbar-track {
	border-radius: 10px;
}

.right_menu_streaming .chat-wrapper .chat-msg-container::-webkit-scrollbar-thumb {
   background: #3f3d40; 
	border-radius: 10px;
}

.more_settings_hold::-webkit-scrollbar {
    width: 8px;
	background-color: #99949c;
	border-radius: 10px;
}
.more_settings_hold::-webkit-scrollbar-track {
	border-radius: 10px;
}

.more_settings_hold::-webkit-scrollbar-thumb {
   background: #3f3d40; 
	border-radius: 10px;
}

.stream_notification
{
	position: fixed;
	top: 130px;
	left: 50%;
	transform: translateX(-50%);
	
	padding: 16px;
	
	background: #121126;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	text-align: center;
	letter-spacing: 0.75px;
	color: #FCFCFC;
	
	border-radius: 24px;
	
	z-index: 1;
}

.video_holder
{
	position: absolute;
	
	top: 130px;
	left: 45%;
	transform: translateX(-50%);
	
	width: 795px;
	height: 450px;
	
	z-index: 1;
	border-radius: 12px;
}

.activity_video
{
	position: relative;
	width: 100%;
	height: 100%;
	
	border-radius: 12px;
}

.activity_video_loading
{
	position: absolute;
	top: 0px;
	left: 0px;
	
	width: 100%;
	height: 100%;
	
	padding: 165px 0px;
	
	background-color: #000;
	
	font-size: 22px;
	color: #fff;
	font-family: Poppins;
	text-align: center;
}

.main_controls
{
	position: absolute;
	bottom: 50px;
	left: 50%;
	transform: translateX(-50%);
	
	width: 500px;
	
	padding: 15px 20px;
	
	background: #121126;
	
	text-align: center;
	
	border-radius: 42px;
}

.play_work
{
	display: inline-block;
	
	width: 11px;
	height: 11px;
	
	margin-right: 20px;
	
	background-image: url(../images/play_work.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
	cursor: pointer;
}

.pause_work
{
	display: inline-block;
	
	width: 10px;
	height: 11px;
	
	margin-right: 20px;
	
	background-image: url(../images/pause_work.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
	cursor: pointer;
}

.stop_work
{
	position: relative;
	display: inline-block;
	
	width: 10px;
	height: 10px;
	
	margin-right: 20px;
	
	background-image: url(../images/stop_work.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
	cursor: pointer;
}

.mute_work
{
	position: relative;
	display: inline-block;
	
	width: 18px;
	height: 14px;
	
	margin-right: 15px;
	
	background-image: url(../images/mute_work.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
	cursor: pointer;
}

.line_video
{
	position: relative;
	display: inline-block;
	
	width: 250px;
	height: 5px;
	
	background: #DDDDDD;
	
	vertical-align: middle;
	cursor: pointer;
}

.inner_line_video
{
	position: absolute;
	top: 0px;
	left: 0px;
	
	height: 5px;
	
	background: #BD00FF;
}

.video_duration
{
	display: inline-block;
	
	margin-left: 15px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 22px;
	text-align: center;
	letter-spacing: 0.25px;
	color: #FFFFFF;
	
	vertical-align: middle;
}

.muted_video
{
	position: absolute;
    left: 8px;
    top: -2px;
    width: 2px;
    height: 21px;
    
	background: #ff0000;
    
	transform: rotate(-35deg);
    
	z-index: 1;
}

.close_video
{
	position: absolute;
	top: 10px;
	right: 10px;
	
	width: 35px;
	height: 35px;
	
	background-image: url(../images/close_video.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	
	border-radius: 50%;
	cursor: pointer;
	z-index: 1;
}

.workout_svg
{
	display: none !important;
	position: absolute;
	top: 13px;
    left: 51px;
	
	width: 92px;
    height: 92px;
	
	margin: 0px;
	
	transform: rotate(-90deg);
}

[data-role="radial-progress"] > circle
{
	transition: stroke-dashoffset 1s linear;
	stroke-width: var(--progress-bar-width);
    stroke-dasharray: calc(100% * 3.141592);
    stroke-dashoffset: calc(100% * (100 - var(--progress-percent))/100 * 3.141592);
    stroke: var(--progress-color);
}

.logo_container
{
	display: inline-block;
	width: 50%;
	vertical-align: bottom;
}

.playlist_container
{
	display: inline-block;
	width: 100%;
	padding-right: 130px;
	text-align: right;
	vertical-align: bottom;
}

.song_cont
{
	display: inline-block;
	vertical-align: middle;
}

.songname
{
	max-width: 200px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 18px;
	line-height: 34px;
	letter-spacing: 0.75px;
	color: #FCFCFC;
	text-align: left;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.songartist
{
	max-width: 200px;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #D8D8D8;
	text-align: left;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.song_animation
{
	display: inline-block;
	position: relative;
	
	width: 40px;
    height: 44px;
	
	margin-right: 10px;
	
	background-image: url(../images/playlist_icon.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	
	vertical-align: middle;
}


.muted_audio
{
    position: absolute;
    left: 10px;
    top: -3px;
    
	width: 2px;
    height: 25px;
    
	background: #ff0000;
    
	transform: rotate(-35deg);
    
	z-index: 1;
}

.stop_share
{
	left: 28px;
    top: 9px;
}

.host_video_muted
{
	left: 60px;
    top: -15px;
	
	width: 4px;
    height: 180px;
}

.control_counter
{
	position: absolute;
	top: 0px;
	right: 10px;
	
	width: 21px;
	height: 16px;
	
	padding: 3px 1px;
	
	background: #6D118C;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: 500;
	font-size: 8px;
	text-align: center;
	letter-spacing: 0.25px;
	color: #F3EFFF;
	
	border-radius: 60px;
}

.partNumPos
{
	top: -7px;
	right: -10px;
}

.right_menu_streaming .chat-header
{
	display: none;
}

.right_menu_streaming .chat-wrapper
{
	position: relative;
	top: 0px;
	left: 0px;
	
	width: 100%;
}

.chat_streaming
{
	padding: 20px 0px 0px 0px;
	
	overflow-y: hidden;
}

.header_chat
{
	padding: 0px 20px;
	margin-bottom: 30px;
}

.close_chat
{
	left: 20px;
}

.right_menu_streaming .chat-body
{
	height: calc(100vh - 115px);
}

.right_menu_streaming .typing-area, .right_menu_streaming  .chat_user_action .chat_assets
{
	border-radius: 0px;
}

.right_menu_streaming .intercom-emoji-picker
{
	width: 100%;
}

.chat_container, .left_container
{
    display: inline-block;
    vertical-align: top;
}

.chat-messages .message.left .bubble
{
	margin: 5px 0px;
	background: #F3EFFF;
	border-radius: 20px;
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 18px;
	color: #24223D;
}

.chat-messages .message.right .bubble
{
	margin: 5px 0px;
	background: #21BBE1;
	border-radius: 20px;
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 18px;
	color: #FFF;
}

.chat-messages .message.left .headermsg .to
{
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 12px;
	line-height: 15px;
	color: #F3EFFF;
}

.ch_time
{
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 12px;
	line-height: 16px;
	color: #F3EFFF;
}

.chat-messages .message.left .headermsg img, .chat-messages .message.right .headermsg img
{
	object-fit: cover;
}

.typing-area::-webkit-scrollbar {
    width: 2px;
}
.typing-area::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 3px;
}

.typing-area::-webkit-scrollbar-thumb {
   background: #121126;
}

.mic_icon
{
	position: relative;
	display: inline-block;
	
	width: 20px;
	height: 20px;
	
	background-image: url(../images/audio.svg);
    background-size: 20px 20px;
	background-repeat: no-repeat;
    background-position: center;
	
	vertical-align: middle;
}

.speak_icon
{
	background-image: url(../images/speaker_icon.svg);
}

.smaller_stream_host
{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	
	width: calc((100vh - 400px) * (16 / 9));
    height: calc(100vh - 400px);
    max-width: calc(100vw - 600px);
    max-height: calc((100vw - 600px)*(9/16));
	
	border-radius: 10px;
}

.container_right_menu .smaller_stream_host
{
	width: calc(100vw - 900px);
}

.smaller_stream_host video, .smaller_stream_host canvas, .smaller_stream_host div
{
	border-radius: 10px;
}

.smaller_stream_host .participant_injected
{
	width: 100%;
	height: 100%;
}

.pipHostVideo
{
	position: absolute;
	top: 120px;
	left: 300px;
	
	height: 170px;
	width: 250px;
	
	border-radius: 15px;
	overflow: hidden;
	
	z-index: 2;
}

.videoHolderCoverPip
{
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.txt-center
{
	text-align: center;
}

.ended_session
{
	font-size: 14px;
}

.recording_on_participant
{
	position: absolute;
	bottom: 20px;
    right: 300px;
	
	display: inline-block;
	
	text-align: right;
}

.container_right_menu .recording_on_participant
{
	top: 0px;
}

.rec_icon
{
	display: inline-block;
	
	width: 12px;
	height: 12px;
	
	margin-right: 8px;
	
	background: #FF8493;
	
	border-radius: 50%;
	
	vertical-align: middle;
}


.rec_text
{
	display: inline-block;
	
	font-family: Poppins;
	font-style: normal;
	font-weight: normal;
	font-size: 14px;
	line-height: 22px;
	letter-spacing: 0.25px;
	color: #FFFFFF;
	text-shadow: 2px 2px #000000;
	
	vertical-align: middle;
}

.smaller_timer
{
	font-size: 18px;
}

.disable_list
{
	position: absolute;
	top: 0px;
	left: 0px;
	
	width: 100%;
	height: 100%;
	
	background-color: rgba(255, 255, 255, 0.9);
	
	opacity: 0.5;
	border-radius: 24px 0px 0px 24px;
}

#injected_pip_video video, #injected_pip_video canvas
{
	top: 0px;
	left: 0px;
}

.reps_inline
{
	display: inline-block;
	width: 50%;
	text-align: center;
	vertical-align: top;
}

.rep_text
{
	padding: 0px 3px 5px 3px;
	
	font-family: Poppins;
    font-style: normal;
    font-weight: 500;
	color: #000;
    text-align: center;
	font-size: 24px;
	overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.workout_menu
{
	position: relative;
	left: -30px;
		
    display: inline-block;
    
	width: 230px;

	margin-top: 15px;
    padding: 16px 38px 16px 5px;
    
	font-family: Poppins;
    font-style: normal;
    font-weight: normal;
    font-size: 22px;
    line-height: 28px;
    letter-spacing: 0.75px;
    color: #FCFCFC;
    text-align: right;
    
	background: rgba(20, 19, 41, 0.92);
    
	border-radius: 0px 24px 24px 0px;
    
	cursor: pointer;
    
	z-index: 3;
}

.open_workout_arrow
{
	position: absolute;
    top: 25px;
    right: 15px;
    
	width: 6px;
    height: 9px;
   
	background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url(../images/arr_left_stream.svg);
	
	transform: rotate(180deg);
}

.opened_workout_arrow
{
	transform: rotate(-90deg);
}

.bottom_activity_container
{
	position: relative;
	left: -30px;
	display: inline-block;
	
	width: 440px;
	
	padding-left: 15px;
	
	background: rgba(20, 19, 41, 0.92);
	
	text-align: left;
	
	cursor: auto;
	border-radius: 0px 0px 24px 0px;
	z-index: 3;
}

.opened_workout_list
{
	width: 440px;
	font-size: 30px;
	
	border-radius: 0px 24px 0px 0px;
}

.main_loader_inner_new_design
{
    transform: translateX(-50%) translateY(-50%);

	border: 5px solid #f3f3f3;
	border-radius: 50%;
	border-top: 5px solid #121126;
	width: 70px;
	height: 70px;
	margin: auto;
	
	-webkit-animation: spin 2s linear infinite; /* Safari */
	animation: spin 2s linear infinite;
}

.ondemandfooter .activity_list_popup
{
	background-color: #121126;
}

.ondemandfooter .script-list
{
	background-color: #24223D;
}

.ondemandfooter .activity-current
{
	background-color: #3F3E4D;
}

.notesH1
{
	padding-bottom: 15px;
	
	text-align: left;
	color: #fff;
	font-size: 18px;
	font-family: 'Poppins';
}

.closeNotesBtn
{
	position: absolute;
	top: 23px;
	right: 25px;
	
	height: 15px;
	width: 15px;	
	
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/close_emojis.svg');
	
	cursor: pointer;
}

.noteHolderPart
{
	padding: 10px;
	
	border-radius: 15px;
	background: rgba(20, 19, 41);
}

.noteImgMax
{
	height: 250px;
	width: 100%;
	
	border-radius: 15px;
	
	background-position: center;
	background-repeat: no-repeat;
	background-size: 100%;
}

.noteOptionMax
{
	display: inline-block;
	width: 100px;
	padding: 5px 0px;
	margin-top: 15px;
	margin-bottom: 15px;
	
	text-align: center;
	color: #fff;
	cursor: pointer;
	font-family: Poppins;
	border-radius: 15px;
}

.activeNoteText
{
	background-color: #000;
}

.notesVertical
{
	width: 450px;
}

.noteTextMax
{
	max-height: 48px;
	color: #fff;
	font-family: Poppins;
	overflow-x: auto;
}

.notesHolderVertical
{
	width: 100%;
	overflow-y: auto;
}

.noteTextMax::-webkit-scrollbar , .control_drop_padding::-webkit-scrollbar 
{
    width: 8px;
	background-color: #99949c;
	border-radius: 10px;
}

.noteTextMax::-webkit-scrollbar-track , .control_drop_padding::-webkit-scrollbar-track 
{
	border-radius: 10px;
}

.noteTextMax::-webkit-scrollbar-thumb , .control_drop_padding::-webkit-scrollbar-thumb 
{
   background: #3f3d40; 
	border-radius: 10px;
}

.notesHolderVertical::-webkit-scrollbar 
{
    height: 8px;
	background-color: #99949c;
	border-radius: 10px;
}

.notesHolderVertical::-webkit-scrollbar-track 
{
	border-radius: 10px;
}

.notesHolderVertical::-webkit-scrollbar-thumb 
{
   background: #3f3d40; 
	border-radius: 10px;
}

.control_tooltip
{
	display: none;
	position: absolute;
	bottom: -25px;
	left: 50%;
	transform: translateX(-50%);
	
	min-width: 100%;
	width: 75px;
	
	padding: 2px 5px;
	
	color: #E4DAFF;
	font-family: Poppins;
    font-style: normal;
    font-weight: 600;
    font-size: 8px;
	text-align: center;
	
	background: #504e80;
	
	border-radius: 8px;
	z-index: 1;
}

.mute_fm_part
{
	position: relative;
	display: block;
	
	width: 30px;
	height: 30px;
	
	margin-top: 20px;
	margin-left: 0px;
	
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	background-image: url('../images/fm_mute.svg');
	
	cursor: pointer;
}

.times_demand
{
	font-size: 34px !important;
    font-weight: bold !important;
}

.unactive_screen_activity
{
	position: relative;
    top: -80px;
}

@media screen and ( max-width: 1600px )
{
	.session_time 
	{
		width: 240px;
		font-size: 43px;
	}
	
	.container_right_menu .session_time
	{
		width: 220px;
		font-size: 40px;
	}
	
	.container_right_menu .session_data_container 
	{
		max-width: 300px;
		left: 5px;
	}
}

@media screen and ( max-width: 1560px )
{
	.cameraSelect
	{
		position: relative;
		top: 8px;
		width: 340px;
	}
}

@media screen and ( max-width: 1520px )
{
	.container_right_menu .session_time
	{
		width: 210px;
		font-size: 35px;
	}
	
	.container_right_menu .control_container 
	{
		padding: 3px 15px;
	}
}

@media screen and ( max-width: 1510px )
{
	.participant_header, .host_header
	{
		text-align: right;
	}
	
	.control_less_padding
	{
		padding: 3px 15px !important; 
	}

	.controls_container_less_padding
	{
		padding: 12px 15px !important;
	}
	
	.control_container 
	{
		padding: 5px 15px;
	}
}

@media screen and ( max-width: 1450px )
{
	.right_close
	{
		left: -7px;
	}
	
	.close_chat
	{
		left: 20px;
	}
	
	.container_right_menu .session_data_container
	{
		max-width: 300px;
		left: 5px;
	}

	.container_right_menu .participant_header, .container_right_menu .host_header
	{
		padding-right: 2px;
	}
	
	.container_right_menu .control_container
	{
		padding: 3px 15px;
	}
	
	.session_data_container
	{
		max-width: 250px;
	}
	
	.control_container
	{
		padding: 5px 15px;
	}
	
	.session_time 
	{
		width: 200px;
		font-size: 36px;
	}
}

@media screen and ( max-width: 1400px )
{
	.container_right_menu .session_data_container
	{
		max-width: 300px;
		left: -120px !important; 
	}
	
	.fmControlAlign
	{
		padding: 8px 0px 0px 0px;
	}
	
	.fmControlAlign .session_data_container
	{
		left: 0px;
	}
}

@media screen and ( max-width: 1370px )
{
	.container_right_menu .session_time 
	{
		width: 175px;
		font-size: 31px;
	}
	
	.online_drop_users
	{
		top: auto;
		bottom: -95px;
	}
	
	.container_right_menu .transBackgroundColor .session_time
	{
		width: initial;
	}
	
	.container_right_menu .session_data_container
	{
		max-width: 300px;
		left: -120px !important;
	}
}

@media screen and ( max-width: 1350px )
{
	.control_less_padding
	{
		padding: 3px 10px !important; 
	}

	.controls_container_less_padding
	{
		padding: 12px 5px !important;
	}
	
	.container_right_menu .control_container
	{
		padding: 3px 10px;
	}
	
	.container_right_menu .control_arrow
	{
		right: -10px;
	}
	
	.session_time
	{
		font-size: 31px;
		width: 175px;
	}
	
	.session_data_container 
	{
		max-width: 200px;
		left: -5px !important;
	}
	
	.fmControlAlign .feed_fm_info
	{
		width: 250px;
	}
}

@media screen and ( max-width: 1230px )
{
	.fmControlAlign .feed_fm_info
	{
		width: 200px;
	}
}

@media screen and ( max-width: 1200px )
{
	.controls_container
	{
		padding: 12px 4px;
	}
	
	.fmControlAlign .control_container
	{
		padding: 5px 10px;
	}
}

@media screen and ( max-width: 1165px )
{
	.container_right_menu .session_data_container
	{
		max-width: 300px;
		left: -240px !important;
	}
}

@media screen and ( max-width: 1150px )
{
	.control_container
	{
		padding: 3px 10px;
	}
	
	.btns_canvas
	{
		max-width: 60px;
		min-width: 60px;
		overflow: hidden;
	}
	
	.chat-wrapper
	{
		height: 87vh;
	}
	
	.session_time
	{
		font-size: 22px;
	}
	
	.fmControlAlign .controls_container
	{
		padding: 12px 0px;
	}
	
	.fmControlAlign .control_icon
	{
		height: 15px !important;
		width: 15px !important;
		
		background-size: 15px 15px !important;
	}
	
	.fmControlAlign .session_data_container
	{
		max-width: 170px;
	}
	
}

@media screen and ( max-width: 1050px )
{
	.control_less_padding
	{
		padding: 3px 7px !important; 
	}

	.controls_container_less_padding
	{
		padding: 12px 0px !important;
	}
	
	.main_view_participant
	{
		margin-top: 30px;
	}
	
	.palette-dropdown
	{
		width: 65px;
	}
	
	.members_content_host
	{
		max-width: 100px !important;
	}
	
	.members_content_host .title
	{
		font-size: 12px !important;
	}
	
	#maxSelect
	{
		margin-right: 2px !important;
	}
	
	#maxSelect .mb-0
	{
		font-size: 12px !important;
		margin-right: 0px !important;
	}
	
	#maxSelect .input-field
	{
		padding-left: 5px;
		padding-right: 20px;
	}

}

@media screen and ( max-width: 1020px )
{
	.fmControlAlign .feed_fm_info
	{
		width: 170px; 
	}
	
	.participant_header .participant_player
	{
		margin-left: 5px;
	}
}

@media screen and ( max-height: 1100px )
{
	.activity_list_popup
	{
		max-height: calc(100vh - 350px);
	}
}

@media screen and ( max-height: 750px )
{
	.participant_header, .host_header
	{
		padding: 8px 30px;
	}
	
	.pipHostVideo
	{
		top: 90px;
	}
}

@media screen and ( max-height: 690px )
{
	
	.footer_activity_container
	{
		margin-bottom: 10px;
	}
	
	.activity_title, .activity_val
	{
		font-size: 20px;
	}
	
	.act_stats_container
	{
		padding: 3px 20px;
	}
	
	.one_stat
	{
		margin-bottom: 0px;
	}
	
	.top_activity
	{
		padding: 10px 0px 0px 0px;
	}
	
	.top_activity_radius
	{
		padding: 10px 0px 10px 0px;
	}
	
	.up_next
	{
		font-size: 18px;
	}
	
	.activity_index
	{
		padding: 4px 10px;
		font-size: 14px;
	}
	
	.next_name
	{
		padding: 0px;
		
		font-size: 18px;
	}
	
	.next_type
	{
		padding-bottom: 0px;
		
		font-size: 14px;
	}
	
	.viewAllAct
	{
		font-size: 14px;
	}
	
	.pipHostVideo
	{
		left: 240px;
	}
}

/*------------- PARTICIPANT REDESIGN END ------------ */
.onDemandTitleMaxCap
{
	max-width: 60vw;
}


.lheigh15
{
	top: -5px !important;
	right: -20px;
	line-height: 1.5 !important;
}

.pos_rel
{
	position: relative;
	display: inline-block;
}

.poorNetwork_memberHiden
{
	position: absolute;
	top: 3px;
	
	background-color: #121126;
	z-index: 2;
}

.dspl_inl
{
	display: inline-block;
}

.control_container.active
{
	background: #504e80;
	border-radius: 6px;
}

.camera_hold_disable
{
	padding: 10px;
}

.abs_camoff
{
	position: absolute;
	bottom: 0px;
	right: 0px;
	padding: 4px 15px;
}

.host_injected_video_element
{
	width: 100%;
	height: 100%;
	
	object-fit: cover;
}

.controls_container_demand
{
	display: inline-block;
    position: relative;
	
	vertical-align: middle;
	
	z-index: 3;
}

body.zoomHostFull.zoomHostFullShow #footerId {
    display: block !important;
    position: fixed !important;
    width: 98%;
    left: 1% !important;
    bottom: -7px !important;
    background: linear-gradient(rgba(0, 0, 0, 0.8), transparent);
    max-height: 145px;
    z-index: 200;
}

.backgroundui
{
	background-color: #121126 !important;
}

.borderui
{
	border: 1px solid #121126 !important;
}

.ondemandfooter .activity-counter
{
	border: 4px solid #121126 !important;
}

.demandlog i
{
	color: #fff !important;
	border: 2px solid #fff !important;
}

@media screen and ( max-width: 1200px )
{
	.control_icons
	{
		width: 15px;
		height: 15px;
		
		background-size: contain !important;
	}
	
	.progress_container
	{
		width: 200px;
	}
	
	.duration_video, .duration_container
	{
		font-size: 16px;
	}
}

@media screen and ( max-height: 800px )
{
	.control_icons
	{
		width: 15px;
		height: 15px;
		
		background-size: contain !important;
	}
	
	.progress_container
	{
		width: 200px;
	}
	
	.duration_video, .duration_container
	{
		font-size: 16px;
	}
}

.header_on_demand
{
	z-index: 15;
}

.cpoint
{
	cursor: pointer;
}

.prestreaming_nocam
{
	position: absolute;
	bottom: 10px;
    right: 10px;
	
	width: 20px;
    height: 20px;
	
	background-repeat: no-repeat;
    background-position: center;
	background-image: url(../images/video.svg);
    background-size: 18px 13px;
	z-index: 1;
}

.muted_ps
{
	position: absolute;
    left: 10px;
    top: -3px;
    width: 2px;
    height: 25px;
    background: #ff0000;
    transform: rotate(-35deg);
    z-index: 1;
}

.nBack
{
	background: #E4DAFF !important;
	color: #6D118C !important;
}

.ffPopins
{
	font-family: Poppins !important; 
}

.actPopPart
{
	display: inline-block;
	
	font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
	font-family: Poppins;
	color: #fff;
}

.new_des_confirm
{
	display: inline-block;
    padding: 12px 30px;
	margin-left: 0.5rem !important;
	
    background-color: #E4DAFF;
    font-family: Poppins;
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 28px;
    text-align: center;
    letter-spacing: 0.75px;
    color: #6D118C;
	
    border: 2px solid #E4DAFF;
    border-radius: 20px;
    vertical-align: middle;
    cursor: pointer;
}

.no_bord
{
	border: none !important;
}

.highlightCanvas
{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	
	z-index: 1;
}

.highlightCanvasDraw
{
	position: relative;
	z-index: 2;
}

.none_d
{
	display: none;
}

.settings_scroll_host
{
	max-height: 80vh;
    overflow-y: auto;
    overflow-x: hidden;
}

.numDisplay
{
	display: inline-block;
}

.holdPartList
{
	position: fixed;
	top: 0px;
	left: 0px;
	
	height: 100%;
	width: 100%;
	
	background-color: rgba(0, 0, 0, 0.6);
	
	z-index: 1;
}

.part_list_holder
{
	position: absolute;
    transform: translate(-50%,-50%);
    top: 40%;
    left: 50%;
	
	padding-bottom: 10px;
	width: 90%;
	
	
	overflow-x: auto;
}

.list_color
{
	text-align: center;
}

.partMain
{
	position: relative;
	display: inline-block;
	min-width: 900px;
	padding: 20px 35px 35px 35px;
	
	background-color: #121126;
}

.part_list_holder::-webkit-scrollbar 
{
  height: 7px;
}
.part_list_holder::-webkit-scrollbar-track 
{
  background: #f1f1f1;
}

.part_list_holder::-webkit-scrollbar-thumb 
{
  background: #2b2b2a;
}

.part_list_holder::-webkit-scrollbar-thumb:hover 
{
  background: #555;
}

.partListH1
{
	padding-left: 35px;
	padding-bottom: 15px;
	
	color: #fff;
	font-weight: 600;
	font-size: 28px;
}

.holdLabelsPartList
{
	padding-left: 20px;
	padding-bottom: 15px;
}

.partListLabel
{
	display: inline-block;
	
	color: #fff;
	font-size: 21px;
}

.memberInfoHold
{
	display: inline-block;
	
	vertical-align: top;
}

.namePartWidth
{
	width: 250px;
}

.scorePartWidth
{
	min-width: 140px;
}

.memberNumPart
{
	position: relative; 
	left: 1px;
	
	display: inline-block;
	width: 20px;
	height: 20px;
	
	background-image: url(./../images/trophy.svg);
    background-repeat: no-repeat;
    background-position: center;
	background-size: 100%;
	
	vertical-align: middle;
}

.numPart
{
	position: relative; 
	left: 1px;
	
	display: inline-block;
	width: 20px;
	height: 20px;
	
	text-align: center;
	font-size: 18px;
	line-height: 28px;
	color: #E4DAFF;
}

.memberImgPart
{
	display: inline-block;
	width: 36px;
	height: 36px;
	margin-right: 25px;
	margin-left: 5px;
	
    background-repeat: no-repeat;
    background-position: center;
	background-size: cover;
	
	vertical-align: top;
}

.memberDefImg
{
	background-image: url(./../images/user_avatar.svg);
}

.memberNamePart
{
	display: inline-block;
	height: 33px;
	width: 170px;
	
	color: #fff;
	font-size: 19px;
	letter-spacing: 0.75px;
    text-overflow: ellipsis;
    text-transform: capitalize;
	
	vertical-align: middle;
	overflow: hidden;
}

.memberScorePart
{
	display: inline-block;
	padding: 5px 10px;
	
	background-color: #EFFCFF;
	border-radius: 4px;
	
	font-size: 16px;
	
	font-size: 16px;
	line-height: 28px;
	letter-spacing: 0.75px;
	
	color: #076A83;
}

.memberCameraStatus
{
	font-size: 19px;
	line-height: 28px;
	letter-spacing: 0.75px;
	color: #FFFFFF;
}

.ejectBtn
{
	color: #E4DAFF;
	cursor: pointer;
}

.closePartList
{
	position: absolute; 
	top: 33px;
	left: 23px;
	
	height: 12px;
	width: 12px;
	
	background-image: url(./../images/partListX.svg);
    background-repeat: no-repeat;
    background-position: center;
	background-size: 100%;
	
	cursor: pointer;
}

.oneMemberHolder
{
	padding-bottom: 10px;
}

.ejectHostPop
{
	background-color: rgba(0, 0, 0, 0.9) !important;
	z-index: 3;
}

.participantEjectPop
{
	position: fixed;
	top: 0px;
	left: 0px;
	
	height: 100%;
	width: 100%;
	
	background-color: rgba(0, 0, 0, 0.8);
	
	z-index: 2;
}

.eject_pop_holder
{
	position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
	
	padding-bottom: 10px;
}

.fixed_container_host
{
	position: fixed;
	top: 0px;
	right: 0px;
	
	width: 300px;
	height: 100vh;
	
	z-index: 4;
}

.name_zIndex
{
	z-index: 11 !important;
	pointer-events: none;
}

.ml0
{
	margin-left: 0px !important;
}

.poorNetwork
{
	display: inline-block;
	padding: 10px;
	margin-left: 5px;
	
	white-space: nowrap;
	color: #fff !important;
	
	border: 1px solid gray;
	border-radius: 8px;
    z-index: 5;
}

.zind1
{
	z-index: 1;
}

.transBackgroundColor
{
	background-color: transparent; 
}

.timerColor
{
	left: 0px;
	width: auto;
	
	padding: 25px 40px;
	
	font-size: 5rem;
	
	background-color: rgba(20, 19, 41, 0.92);
	border-radius: 30px;
}

.end_class_font .timerColor
{
	font-size: 3rem;
}

.participant_streaming_container .bigCountShow
{
	position: fixed;
}

flt-glass-pane
{
	display: none;
}

.button_text 
{
	color: black;
}

.posRel
{
	position: relative;
}

.sharesong .stop_share
{
	left: 12px;
    top: 0px;
}

.top100
{
	top: 100%;
}

.removeTransform
{
	transform: none!important;
}

.controls_script
{
	display: block;
	z-index: 3;
}

.control_container .playOptionBtn
{
	margin: 0px;
}

.hiddenItems .main_view_participant
{
	position: relative;
    top: -20px;
}

.hiddenItems .stream_container
{
	position: relative;
    top: -20px;
}

.virtual_shown_button
{
	display: block;
	
	margin-top: 10px;
	padding: 20px 50px;
	width: 320px;
	
	background-color: #E4DAFF;
    font-family: Poppins;
    font-style: normal;
    font-weight: 600;
    font-size: 22px;
    line-height: 28px;
    text-align: center;
    letter-spacing: 0.75px;
    color: #6D118C;
	
    border: 2px solid #E4DAFF;
    border-radius: 20px;
    vertical-align: middle;
    cursor: pointer;
}

.leave_class_text
{
    display: inline-block;
	
	padding-left: 5px;
	
	color: #BCA4FF;
	font-family: Poppins;
    font-style: normal;
    font-weight: normal;
    font-size: 24px;
    line-height: 34px;
    letter-spacing: 0.75px;
	vertical-align: middle;
	
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
	
	cursor: pointer;
}

.leave_class_image
{
	display: inline-block;
	
	width: 25px;
	height: 20px;
	
	vertical-align: middle;
	
	background-image: url('../images/leave_wl.svg');
	background-repeat: no-repeat;
	background-size: 100% 100%;
	
	cursor: pointer;
}

.class_setup_text
{
    font-family: Poppins;
    font-style: normal;
    font-weight: bold;
    font-size: 32px;
    letter-spacing: 1px;
    color: #FFFFFF;
}

.class_info_hold
{
	position: absolute;
    top: 33px;
    right: 0;
	
    padding: 0px 30px;
    color: #ffffff;
    font-family: Poppins;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
}

.class_inner_container
{
	padding: 48px;
    background-color: #121126;
    border-radius: 26px;
}

.step_count
{
	display: inline-block;
	
	padding: 16px;
	
	color: #ffffff;
    font-family: Poppins;
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    background-color: #24223D;
    vertical-align: middle;
    border-radius: 12px;
}

.step_buttons_hold
{
	text-align: right;
	 margin-bottom: 30px;
}

.step_buttons_inner_hold
{
    display: inline-block;
	width: 100%;
	max-width: 500px;
	
	text-align: right;
}

.step_button_continue
{
	display: block !important;
}

.blur_background
{
	filter: blur(8px);
}

.waiting_lounge_popup
{
	position: fixed;
	display: flex;
    top: 0;
    left: 0;
	
    width: 100%;
    height: 100%;
	
    justify-content: center;
    align-items: center;
}

.videoErrorZIndex
{
	z-index: 1;
}

.wl_popup_inner
{
    padding: 32px;
	background-color: #24223D;
	border-radius: 12px;
}

.wl_popup_text
{
	font-family: Poppins;
    font-style: normal;
    font-weight: bold;
    font-size: 32px;
    letter-spacing: 1px;
    color: #FFFFFF;
    padding-bottom: 32px;
}

.wl_popup_right_button
{
	width: 200px;
}

.wl_popup_left_button
{
	width: 200px;
    background-color: transparent;
    color: #E4DAFF;
    margin-right: 15px;
}

.top_step_text
{
    font-family: Poppins;
    font-size: 18px;
    line-height: 34px;
    letter-spacing: 0.75px;
    color: #FFFFFF;
}

.equipment_chosing_container
{
	padding-top: 35px;
}

.equipment_step_title
{
	color: #fff;
	font-size: 24px;
	font-weight: 600;
}

.boxing_position_label
{
	margin-right: 25px !important;
}

.wl_step_checkbox
{
	width: 30px !important;
	height: 30px !important;
}

.wl_back_button
{
	display: inline-block !important;
	
    background-color: transparent;
    color: #E4DAFF;
    margin-right: 15px;
}

.wl_continue_button
{
	display: inline-block !important;
	
	width: 75%;
}

.wl_camera_hold
{
    width: 45%;
    margin-right: 30px;	
}

.step_top_container
{
	position: relative;
}

.setup_watch_app_button
{
    position: absolute;
    right: 0;
    top: 0;
	
    margin-right: 15px;
	padding-left: 40px;
	
	background-color: transparent;
    color: #E4DAFF;
	
	background-image: url('../images/watch_image.svg');
	background-repeat: no-repeat;
	background-position: 7% center;
}

.wl_popup_container
{
	font-family: Poppins;
	width: 100%;
    height: 100%;
	padding: 90px 30px;
	overflow-y: auto;
}

.watch_track_text
{
	font-family: Poppins;
    font-size: 24px;
    color: #FFFFFF;
}

.watch_info_container
{
	text-align: left !important;
}

.watch_steps_container
{
	font-size: 18px;
	line-height: 34px;
    color: #FFFFFF;
}

.watch_app_open
{
	color: #6D118C;
}

.watch_steps_container
{
	margin-top: 30px;
}

.watch_google_play
{
	display: inline-block;
	
	width: 215px;
	height: 75px;
	
	background-image: url('../images/google_play.svg');
	background-repeat: no-repeat;
	
	vertical-align: middle;
}

.step_text_inline
{
	display: inline-block;
	vertical-align: middle;
}

.watch_apple_image
{
	background-image: url('../images/get_it_ios.svg');
}

.watch_steps_text
{
	margin-right: 40px;
}

.setup_watch_part
{
	display: inline-block;
	
	width: 50%;
	
	vertical-align: top;
}

.watch_cover
{
    display: inline-block;
	
    height: 440px;
    width: 79%;
	
	background-image: url('../images/watch_cover.svg');
	background-size: 100% 100%;
	background-repeat: no-repeat;
}

.right_side_cont
{
	text-align: right;
}

.watch_buttons_hold
{
	display: inline-block;
	
	width: 79%;
	margin-top: 30px;
}

.watch_app_popup_hold
{
	background-color: #121126;
}

.room_setup_message_hold
{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 24px;
	width: 1020px;
	height: 572px;
	
	background: rgba(18, 17, 38, 0.9);
	border-radius: 42px;
}

.room_setup_message_title
{
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-size: 72px;
	line-height: 90px;
	/* identical to box height, or 125% */

	display: flex;
	align-items: center;
	letter-spacing: 1px;
	font-feature-settings: 'ss01' on, 'ss02' on, 'ss03' on, 'ss04' on;

	/* Grayscale / Background */

	color: #FFFFFF;

	/* Inside auto layout */

	margin: 32px 0px;
}

.room_setup_message
{
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 400;
	font-size: 64px;
	line-height: 90px;
	/* or 141% */

	display: flex;
	align-items: center;
	letter-spacing: 1px;

	/* Grayscale / Background */

	color: #FFFFFF;

	margin: 32px 0px;
}

.room_setup_smaller_title
{
	font-size: 54px;
	text-align: center;
	line-height: unset;
}

.room_setup_smaller_text
{
	width: 100%;
	font-size: 28px;
	line-height: unset;
}

.room_setup_message_button_hold
{
	width: 100%;
	text-align: center;
}

.room_setup_message_button
{
	display: inline-block;
	margin: 15px 0px;
	padding: 0px 15px;
	
	background: #E4DAFF;
	border-radius: 20px;
	
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-size: 48px;
	text-align: center;
	cursor: pointer;
	letter-spacing: 0.75px;

	/* Primary / Dark */
	color: #6D118C;
}

.room_setup_button_small
{
	margin-right: 10px;
	margin-left: 10px;
}

.room_setup_message_button_text
{
	font-family: 'Poppins';
	font-style: normal;
	font-weight: 600;
	font-size: 48px;
	text-align: center;
	cursor: pointer;
	letter-spacing: 0.75px;

	/* Primary / Dark */
	color: #6D118C;
}

.room_setup_message_small
{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	padding: 24px;

	position: absolute;
	width: 412px;
	height: 572px;
	left: 25px;

	background: rgba(18, 17, 38, 0.9);
	border-radius: 42px;
	
	z-index: 100000;
}

.room_setup_inner_holder
{
	padding: 135px 24px !important;
}

.room_setup_checkmark
{
	width: 150px !important;
	height: 150px !important;
	margin: auto !important;
	
	stroke: #029A42 !important;
}

.top_room_setup_bar
{
    position: absolute;
    top: 0;
	
	width: 100%;
    height: 0px;
	
	background-color: #ff1a1a7a;
    background-image: url('../images/room_error.svg');
	background-repeat: no-repeat;
	background-position: center;
	
    z-index: 10000;
}

.bottom_room_setup_bar
{
    position: absolute;
    bottom: 0;
	
	width: 100%;
    height: 0px;
	
	background-color: #ff1a1a7a;
    background-image: url('../images/room_error.svg');
	background-repeat: no-repeat;
	background-position: center;
	
    z-index: 10000;
}

#media-access-alert .modal-dialog.moreW
{
    max-width: 745px;
}

.calories_margin
{
	margin-right: 0;
}

.height_margin
{
	margin-right: 10px;
}

.weight_select_container
{
	margin-right: 0px;
	width: 100%;
}

.weight_select_inner
{
	width: 75%;
}

.before_start_timer
{
	padding-left: 40px;
    color: #ffffff;
    font-family: Poppins;
    font-style: normal;
    font-weight: normal;
    font-size: 30px;
    text-align: left;
	opacity: 1;
}

.roomIsSetup canvas
{
	max-width: calc(100vh * (16/9)) !important;
	max-height: calc(100vw * (9/16)) !important;
}

.hostVirtualOnMember #imageCanvas
{
	transform: translateX(-50%) scaleX(1) !important;
}

.hostVirtualOnMember #sessionCanvas
{
	transform: scaleX(1) !important; 
}

.pre-streaming-counter #partBigCounter
{
	z-index: 9999;
}

.before_start_timer
{
	text-align: right;
    padding-right: 10px;
}

.box_jump_container
{
	text-align: left;
}

.box_jump_container .drop_option
{
	width: auto;
	padding-right: 15px;
    padding-bottom: 5px;
    padding-top: 5px;
}

.box_jump_container .select_title_room
{
	font-size: 12px;
	color: #E4DAFF;
	margin-left: 5px;
}

.no_available
{
	padding-top: 15px;
	text-align: center;
}

@media screen and ( max-height: 610px )
{
	.room_setup_smaller_text
	{
		font-size: 19px;
	}
	
	.room_setup_smaller_title
	{
		font-size: 40px;
	}
	
	.room_setup_message_small
	{
		width: 330px;
		height: 390px;
	}
	
	.room_setup_inner_holder
	{
		padding: 90px 24px !important;
	}
	
	.room_setup_message_title
	{
		font-size: 35px;
		line-height: 40px;
	}
}

@media (max-width:1650px){
	.setup_watch_part .wl_continue_button
	{
		width: 60% !important;
	}
	
	.setup_watch_part .wl_back_button
	{
		width: 35% !important;
	}
}

.ondemandLocalMedia #local_preview {
	transform: translateX( 0%) rotateY(180deg) !important;
}

.setup_top_container .ondemandLocalMedia #local_preview
{
	max-width: 100% !important;
	max-height: 100vh !important;
}

.ondemandLocalMedia #imageCanvas {
	transform: translateX(0%) scaleX(-1) !important;
}

.not_supported_hidden
{
	top: -20px !important;
}

.calibration_ar_text
{
	font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    font-size: 50px;
    line-height: 70px;
    letter-spacing: 1px;
    color: #FFFFFF;
    text-align: left;
    vertical-align: middle;
}

#showCalculatingAR
{
	text-align: left !important;
	cursor: auto;
}

#showCalculatingAR .room_setup_message_small
{
	display: block !important;
	width: 350px !important;
}

#showCalculatingAR .room_setup_loader
{
	display: inline-block;
	
	width: 45px;
    height: 45px;
    padding-top: 0;
    padding-bottom: 0;
	
    vertical-align: middle;
    margin-left: 10px;
}

#showCalculatingAR .room_setup_loader_inner
{
	width: 40px;
    height: 40px;
	
	border: 5px solid #E4DAFF;
	border-top: 5px solid #121126;
}

.out_of_frame
{
	font-weight: normal;
    font-size: 40px;
	margin: 10px 0;
}

.dont_show_message
{
	color: #E4DAFF;
	text-decoration: underline;
}

/* The switch - the box around the slider */
#recalibrationToggle .switch {
  position: relative;
  top: 2px;
  display: inline-block;
  width: 49px;
  height: 23px;
  margin: 0;
}

/* Hide default HTML checkbox */
#recalibrationToggle .switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

/* The slider */
#recalibrationToggle .slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

#recalibrationToggle .slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 4px;
  bottom: 4px;
  background-color: #F7F7FC;
  -webkit-transition: .4s;
  transition: .4s;
}

#recalibrationToggle input:checked + .slider {
  background-color: #BCA4FF;
}

#recalibrationToggle input:focus + .slider {
  box-shadow: 0 0 1px #BCA4FF;
}

#recalibrationToggle input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
  background-color: #6D118C;
}

/* Rounded sliders */
#recalibrationToggle .slider.round {
  border-radius: 34px;
}

#recalibrationToggle .slider.round:before {
  border-radius: 50%;
}

.recab_title
{
	display: inline-block;
	margin-right: 10px;
}

.recalibration_inner
{
	padding: 48px 64px 48px 64px;
	
	border-radius: 20px;
	background-color: #000;
}

.recalibration_title
{
	font-family: Poppins;
    font-style: normal;
    font-size: 32px;
    letter-spacing: 1px;
    color: #FFFFFF;
    padding-bottom: 32px;
}

.recalibration_inner_text
{
	font-size: 24px;
}

.recal_buttons_hold
{
	text-align: right;
    padding-left: 275px;
}

.recab_buttons
{
	width: 125px;
}

#recalibrationPopup
{
	background-color: #00000059;
	z-index: 10;
}

.full_element_box
{
	width: 100%;
	height: 100%;
}

.video_hidden
{
	opacity: 0;
}

.instructorStreamD2C .room_setup_message_small
{
	right: 25px !important;
    left: auto;
	
	width: 320px !important;
    height: 80% !important;
	background: rgba(18, 17, 38, 0.9) !important;
}

.ins_sep
{
	display: block !important;
}

.instructorStreamD2C .calibration_ar_text
{
	font-size: 28px;
	line-height: 50px;
}

.instructorStreamD2C .room_setup_loader
{
	height: 45px !important;
}

.instructorStreamD2C .room_setup_loader_inner
{
	height: 40px !important;
}

.instructorStreamD2C .out_of_frame
{
	font-size: 22px !important;
}

.instructorStreamD2C #showCalculatingAR
{
	display: flex;
}

.cameraTurnedOff
{
	position: relative;
	width: 340px !important;
    height: 60px !important;
	margin-top: 20px;
}

.cameraIcon
{
	position:absolute;
	width: 30px;
	height: 30px;
	left: 50%;
	
	background-image: url(../images/video.svg);
    background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	transform: translate(-50%, -50%);
}

.videoOff
{
	position: absolute;
    left: 12px;
    top: -5px;
    width: 2px;
    height: 40px;
    background: #ff0000;
    transform: rotate(-35deg);
    z-index: 1;
}

.hideTestMic #test_mic
{
	display: none;
}

.download_app_inner
{
	text-align: center;
	font-size: 22px;
	margin-top: 30px;
	color: #ffffff;
	letter-spacing: 1px;
}

.holder_result
{
	display: inline-block;
	vertical-align: middle;
    padding: 4px 10px;
	
	background: white; 
	border-radius: 4px;
	
	color: #076A83;
	font-family: Poppins;
	font-size: 16px;
}

.personal_b_holder
{
	position: absolute;
	bottom: 20px;
	padding: 12px;
	
    width: calc(100% - 40px);
	
	background: white;
	border-radius: 16px;
	
	color: black;
	font-family: Poppins;
}

.personal_b_content
{
	display: flex;
    align-items: center;
}

.personal_b_txt_holder
{
	margin-left: 10px;
}

.personal_b_record
{
	color: #158C4A !important;
}

#repCounterNegative, #repCountNegHost
{
	color: #FF8493;
}