/*************************************************************************
 * 
 * EQUATIONS WORK CONFIDENTIAL
 * __________________
 * 
 *  [2018] - [2020] Equations Work IT Services Private Limited, India
 *  All Rights Reserved.
 * 
 * NOTICE:  All information contained herein is, and remains
 * the property of Equations Work IT Services Private Limited and its suppliers,
 * if any.  The intellectual and technical concepts contained
 * herein are proprietary to Equations Work IT Services Private Limited
 * and may be covered by U.S. and Foreign Patents,
 * patents in process, and are protected by trade secret or copyright law.
 * Dissemination of this information or reproduction of this material
 * is strictly forbidden unless prior written permission is obtained
 * from Equations Work IT Services Private Limited.
*
 * Copyright (C) Equations Work IT Services Pvt. Ltd.
 * NOTE: Unauthorized copying of this file, via any medium is strictly prohibited
 * Proprietary and confidential
 * Owned and written by the proprietors of Equations Work IT Private Limited, India, August 2018
 */
/* You can add global styles to this file, and also import other style files
@import "~font-awesome/css/font-awesome.css"; */
@font-face{
    font-family: 'Open-Sans-Regular';
    src: url('../../assets/fonts/OpenSans-Regular.eot');
    src: url('../../assets/fonts/OpenSans-Regular.woff2') format('woff2'),
         url('../../assets/fonts/OpenSans-Regular.woff') format('woff'),
         url('../../assets/fonts/OpenSans-Regular.ttf') format('truetype'),
         url('../../assets/fonts/OpenSans-Regular.woff2') format('svg');
}

@font-face{
    font-family: 'Sansita';
    src: url('../../assets/fonts/Sansita_font2.woff2')  format('woff2');
}

body
{
    font-family: 'Open-Sans-Regular' !important;
    font-size: 14px !important;
}

body {
    max-width: 100vw;
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    overflow-x:hidden
  } 

/* Scrollbar css start */

    /* width */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

/* Track */
::-webkit-scrollbar-track {
    box-shadow: inset 0 0 5px grey; 
    border-radius: 10px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
    background: #999999; 
    border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
    background: #c3c3c3; 
}

/* Scrollbar css end*/

.bs-datepicker-container{padding: 0px !important; }

.align-items-stretch {
    align-items: stretch !important;
}
.d-flex {
    display: flex !important;
}
*, ::after, ::before {
    box-sizing: border-box;
}

#toast-container > div {
    margin-top: 10px !important;
  }
  

nav#sidebar {
    width: 255px;
    /* color: rgb(106, 108, 112);
    background: rgb(45, 48, 53); */
    border-right: 1px solid rgb(195, 196, 197);
    box-shadow: 3px 4px 5px 0px rgba(105, 103, 103, 0.25);
}
#sidebar {
    position: fixed;
    height: 100vh;
    z-index: 2;
}

 nav#sidebar .sidebar-header {
    padding: 30px 20px 10px 20px;
} 
.align-items-center {
    align-items: center !important;
}

.align-text-center {
    text-align: center !important;
}

nav#sidebar .avatar {
    min-width: 60px;
    max-width: 60px;
    min-height: 60px;
    max-height: 60px;
    margin-right: 15px;
    border-radius: 50%;
    overflow: hidden;
    /* padding: 4px; */
    border-width: 2px;
    border-style: solid;
    border-color: #05A0DE;
    border-image: initial;
    position: relative;
    top: -8px;
    background-position: center;
    background-size: cover;
} 

#userInfoDiv{
    position: absolute;
    top:2rem;
    left: 90px;
    width:50%;
    gap: 10px;
    overflow-wrap: break-word;
}
#planName{
    position: relative;
    top: -5px;
}

nav#sidebar ul {
    max-height: none;
    list-style-type: none;
    line-height: 2.5em;
}
.list-unstyled {
    padding-left: 0px;
    list-style: none;
}

nav#sidebar li {
    position: relative;
    padding: 0 20px;
    margin-top: 1px;
}

nav#sidebar li::before {
    content: "";
    width: 2px;
    height: 100%;
    display: block;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 99;
    background: none;
}

nav#sidebar li a {    
 
    height: 35px;
    overflow: hidden;
    position: relative;
    text-overflow: ellipsis;
    transition: color .3s;
    vertical-align: top;
    white-space: nowrap;
    width: 100%;
}
nav#sidebar a {
    position: relative;
    text-decoration: none;
    /* color:#fff; */
}

nav#sidebar li a > i{
    margin-right: 20px;
    width: 14px;
    height: 14px;
}

nav#sidebar ul
{
    /*padding: 0px 20px;*/
}

nav#sidebar li.active > a {
    color: #047DAD;
}

.active
{
    opacity: 1;
}

nav#sidebar li:after {
    background-color: rgba(63,70,82,0);
    content: '';
    display: inline-block;
    height: 100%;
    left: -20px;
    position: absolute;
    top: 0;
   /* width: calc(100% + 40px);*/
   width:100%;
    z-index: -1;
}

nav#sidebar .tabPointerVertical.arrow:before {
    content: '';
    background-color: #363d47;
    position: absolute;
    width: 255px;
    right: 20px;
    height: 40px;
    top: -20px;
}

nav#sidebar li
{
    cursor: pointer;
    margin-bottom: 5px;
}

nav#sidebar .tabPointerVertical {
    top: -10px;
    border-width: 20px 0 20px 15px;
    border-color: transparent;
    z-index: -1;
    margin-left: 1px;
}
.tabPointerVertical {
    top: 0;
    left: 100%;
    border-width: 10px 0 10px 10px;
    border-color: transparent transparent transparent #00b0b7;
}
.tabPointer {
    border-color: #00b0b7 transparent transparent;
    border-style: solid;
    border-width: 10px 10px 0;
    bottom: -10px;
    box-sizing: border-box;
    height: 10px;
    opacity: 1;
    position: absolute;
    transition: transform .5s ease,opacity .5s ease;
    width: 20px;
}

.page-content {
    overflow: hidden;
    position: relative;
    min-height: 100vh;
    background: #fff;
    padding: 0px 0px 0px;
    }


.header-area {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    background: hsla(0, 0%, 100%, 0.266666666666667);
    z-index: 9;
}

.navbar-default {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}

.navbar {
    border: medium none;
    margin-bottom: 0;
}
/*
nav#sidebar li:not(.active):not(.selected):not(.noHover):after{
    background-color:transparent !important;
}

nav#sidebar li:not(.active):not(.selected):not(.noHover):hover:after{
    background-color:rgba(54,61,71,.65);
}*/

nav#sidebar li
{
    /* background-color:transparent !important; */
}

nav#sidebar li:hover
{
    background-color:#B2E7FC !important;
}


.sticky-logo h1 {
    /* color: #fff; */
    padding: 0;
    margin: 0;
    font-size: 36px;
    font-weight: bold;
    line-height: 1;
}

.title-padding {
    padding-top: 2%;
}

.subtitle
{
    font-weight: 600;
    cursor: pointer;
}
.button {
    -moz-appearance: none;
    -webkit-appearance: none;
    border: 2px solid transparent;
    border-radius: 5px;    width: 75px;
    /*height:75px;*/
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: Open Sans,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 14px;
    font-weight: 400;
    margin: 0;
    min-width: 2.78572em;
    line-height: 2.78572;
    outline-width: 0;
    padding: 0 1em;
    position: relative;
    text-align: center;
    text-decoration: none;
    transition: background-color .15s,border-color .15s,color .15s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.button:visited {
    color: #fff;
}
#sidebar a {
    /* color: #fff; */
    text-decoration: none;
}
.buttonBlock {
    display: block;
    width: 100%;
}
.buyButtons { 
    position: relative; /* Or static, depending on design */
    height: auto;
}

.createExpBtn
{
    width:100%; 
    color: #fff !important;
    border-color: transparent;
    background-color: #05A0DE;
    transition: filter .2s ease;
    border-radius: 30px;
}

.upgradeBtn {
    width:100%; 
    color: #fff !important;
    border-color: transparent;
    background-color: #05A0DE;
    transition: filter .2s ease;
    border-radius: 3px;
    padding: 5px;
    font-size: 9px;
}

.sidebarSection {
    padding: 10px 20px 10px;
    /* -ms-flex-negative: 0; */
    flex-shrink: 0;
}

.userProfile
{
    position: absolute;
    right: 10px;
    top: 35px;
    color: #5c5c5c;
    font-size: 24px;
    cursor: pointer;
}

.avatar > img
{
    max-width: 115%;
    height: auto;
    position: relative;
    top: -3px;
    left: -5px;
}

.sidebar-header popover-container
{
    top: 18px !important;
    left: 235px !important;
}

.sidebar-header > .popover
{    
    max-width: 500px !important;
    width: 335px;
}

.usernameLabel {
    width: 100%
}

.personalInfoPopover
{
    padding: 10px;
}

/*.popover-arrow-slide-up
{
    top:4% !important;
}

.sidebar-header > .popover > .popover-arrow
{    
    top:7% !important;
}

.popover-arrow-slide-down
{
    top:7% !important;
}*/

.customise-avatar
{
    min-width: 65px !important;
    max-width: 65px !important;
    min-height: 65px !important;
    max-height: 65px !important;
    margin-top: auto;
}

.customise-avatar > img
{
    top:-5px !important;
    left:-5px !important;
}

nav#sidebar.shrinked .sidebar-header {
    padding: 10px;
}

nav#sidebar.shrinked .sidebar-header .title, nav#sidebar.shrinked .sidebar-header .userProfile{
    display: none;
}

nav#sidebar.shrinked .sidebarSection {
    display: none;
}

nav#sidebar.shrinked .experizer-logo {
   /* display: none;*/
   transform: rotate(-90deg);
    transform: rotate(-90);
    bottom: 10px;
    position: absolute;
}
nav#sidebar.shrinked .experizer-logo > img {
   width: 80px;
   margin-left: 60px;
}

nav#sidebar.shrinked ul {
    max-height: none;
    margin-top: 5px;
    /*padding-left: 25px;*/
}

nav#sidebar.shrinked ul a {
    padding: 14px 5px;
    display: inline;
    font-weight: 400;
    text-align: center;
    font-size: 1.2rem;
}

nav#sidebar ul a img
{
    width:15px;height:15px;margin-right: 20px;
}

nav#sidebar.shrinked ul a img
{
    width:20px;
    height:20px;
}

nav#sidebar.shrinked ul a span{
    display: none;
}

nav#sidebar.shrinked {
    width: 80px;
}

nav#sidebar.shrinked li:after {
    left: -24px;
   /* width: calc(100% + 45px);*/
   width:100%;
}

.shrinked-body
{
    margin-left: 80px;
    width: calc(100% - 80px);
}

.unshrinked-body
{
    margin-left: 255px;
    width: calc(100% - 420px);
}

@media screen and (min-width: 1200px) {
    .unshrinked-body {
    margin-left: 255px;
    width: calc(100% - 265px);
}

}

.experizer-logo
{
    position: absolute;
    bottom: 5px;
    left: calc(50% - 75px);
}

.experizer-logo > img
{
    width: 140px;
}

@media only screen and (min-width: 3840px), only screen and (min-height: 2160px) {
  .experizer-logo {
    bottom: 9.5rem;
    left: 50%;
    transform: translateX(-75px);
  }
}

nav#sidebar.shrinked .token-count-display {
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: max-content;
   /* display: none;*/
    transform: rotate(-90deg);
    transform: rotate(-90);
    bottom: 100px;
    position: absolute;
}

.padding-LR-20
{
    padding-left: 20px;
    padding-right: 20px;
}

.margin-LR-0
{
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.cursor-pointer
{
    cursor: pointer;
}

.padding-top-15
{
    padding-top: 15px;
}

.modal-content-radius > .modal-content{border-bottom-left-radius: 20px; border-bottom-right-radius: 20px;}
.modal-sm-content-radius > .modal-content{border-top-left-radius: 14px; border-top-right-radius: 14px;}
.accordionShareClassEmail > .card-header{padding: 0px !important; background-color: #6CA0B6;}
.accordionShareClassEmail > .card-header > .panel-title > .accordion-toggle > .btn-link{    color: white; text-decoration: none;box-shadow:none;}

.accordionShareClassPage > .card-header{padding: 0px !important; background-color: #E9785B;}
.accordionShareClassPage > .card-header > .panel-title > .accordion-toggle > .btn-link{    color: white; text-decoration: none;box-shadow:none;}

.accordionShareClassText > .card-header{padding: 0px !important; background-color: #047DAD;}
.accordionShareClassText > .card-header > .panel-title > .accordion-toggle > .btn-link{    color: white; text-decoration: none;box-shadow:none;}

.accordionShareClassQRCode > .card-header{padding: 0px !important; background-color: #F4B251;}
.accordionShareClassQRCode > .card-header > .panel-title > .accordion-toggle > .btn-link{    color: white; text-decoration: none;
box-shadow:none;}

.patron-tabset ul
{
    border-bottom: none;
}

.patron-tabset ul li .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active
{
    color: #000;
    background-color: transparent;
    border: none;
    border-color: transparent;
    border-bottom:4px solid #05A0DE !important;
}
.patron-tabset ul li .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover
{
    color: #000;
    background-color: transparent;
    border: none;
    border-color: transparent;
}

.patron-tabset ul li a
{
    color:#000;
}

.close:focus
{
    outline: none !important;
}

.modal-manage-patron
{
  max-width: 700px !important;
}

.alert-danger {
    border: 1px solid #c0392b;
    border-radius: 3px;
    box-shadow: 0 8px 10px #888;
    font-size: 14px;
    padding: 4px 9px;
    z-index: 1;
    color: #fff;
    background-color: #c0392b;
    display: block;
}

.formErrArrow {
    background: url(//assets/images/login/errorArrow.png) no-repeat 0px 0px;
    display: inline-block;
    left: 13px;
    position: absolute;
    top: -7px;
    width: 14px;
    padding-top: 27px
}

.btn{
    /* box-shadow:5px 5px 5px rgba(0, 0, 0, 0.349019607843137); */
}
.toast-close-button
{
    top:-34px !important;
}

button.toast-close-button
{
top: -8px !important;
}


.modal-content-margin{
    margin-top: 20% !important;
  }

  .qrcode > img {border: 2px dashed;}

  .table-no-found-center{width: 97%; text-align: center; position: absolute;}
  .personalInfoPopover > .row:nth-child(1) > div:nth-child(2)
  {
        position: relative;
        left: -15px;
  }

.call-me-label 
{
    cursor: pointer;
}

.call-me-label > i
{
    color:#000000;
    font-size: 18px;
    margin-right: 10px;
}

.call-me-label > b
{
    position: relative;
    top: -10px;
}

.personal-info-detail > div > div:nth-child(1)
{
    color:#d95b1c;
    margin-bottom: 10px;
}

.personal-info-detail > div > div:nth-child(2)
{
    margin-bottom: 10px;
}
.personal-info-detail > div > div:nth-child(3)
{
    margin-bottom: 10px;
}
.personal-info-detail > div > div:nth-child(4)
{
    margin-bottom: 10px;
}

.sign-out
{
    color:#000000;
    text-align: left;
    font-size: 14px;
    /* font-weight: 600; */
}

.query-radio-btns > div > label
{
    margin-bottom: 0px;
}

.query-radio-btns > div > label > input
{
    position: relative;
    top: 2px;
    margin-right: 10px;
}

#select2-select-container
{
    display: none;
}

.btn-blue {
    background-color: #6CA0B6;
    color: white;
    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.349019607843137);
}

#userName
{
    font-size: 14.4px;
    /* color:#fff; */
    text-overflow: ellipsis;
}
.ellipsis {
    display: block;           
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;               
  }
  

.nav-ul > li > a{
    /* font-size: 14.4px; */
    font-size: 0.95rem;
    
}

.btn-color-green, .btn-color-blue
{
    width: 16.5%; 
}

body.modal-open app-root > #mainBody{
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}

body.modal-open #content{
    -webkit-filter: blur(3px);
    -moz-filter: blur(3px);
    -o-filter: blur(3px);
    -ms-filter: blur(3px);
    filter: blur(3px);
}


.modal-dialog {
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    min-height: calc(100% - (1.75rem * 2));
}

.modal-inner-scroll
{
    /* min-height: 200px; */
    max-height: 200px;
    overflow-y: scroll;
}

.modal-content-radius
{
    min-width: 500px;
}
.modal-footer-image{position: absolute;width: 100%;left:-4px;bottom: -6px;}

input.form-control,select.form-control
{
    font-size: 0.9em;
    padding: .59rem .75rem;
}

.downArrow{
    appearance:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	-ms-appearance:none;
    background-position: calc(100% - 12px) center !important;
    background: url("data:image/svg+xml,<svg height='10px' width='10px' viewBox='0 0 16 16' fill='%23000000' xmlns='http://www.w3.org/2000/svg'><path d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/></svg>") no-repeat;
    padding: 8px 32px 8px 16px;
}

.modal-content{
  -moz-box-shadow:  1px 3px 10px 3px #000;
  -webkit-box-shadow: 1px 3px 10px 3px #000;   
 box-shadow:  1px 3px 10px 3px #969696;
  border: 0px solid rgba(0,0,0,.2) !important;
}

.popup-title {
    font-size: 16px;
    color: #000;
    z-index: 1;
    font-weight: bold;
    margin-top: 10px;
}

#toast-container * {
    box-sizing: border-box !important;
    text-overflow: ellipsis !important;
    overflow: hidden !important;
}

#toast-container.toast-center > div, #toast-container.toast-top-center > div, #toast-container.toast-bottom-center > div{
    cursor: default;
}

timepicker > table > tbody > tr:nth-child(1) > td:nth-child(1) > a {
    box-shadow: none;
}

timepicker > table > tbody > tr:nth-child(1) > td:nth-child(3) > a {
    box-shadow: none;
}

timepicker > table > tbody > tr:nth-child(3) > td:nth-child(1) > a {
    box-shadow: none;
}

timepicker > table > tbody > tr:nth-child(3) > td:nth-child(3) > a {
    box-shadow: none;
}

input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

progressbar > bar {
    color: black !important;
}

.userEmail
{
    color:#999999;
    margin-top: 10px;
}

.tooltip > .arrow::after
{
    border-right-color:transparent !important;
}

.new-folder-popup-border > .modal-content{
    border: 1px solid #0000001a !important;
  }

  .page-content.unshrinked-body > app-storage-subscription-management > div > div > .card > .Plan-col > span
{
    position: relative;
    z-index: 1;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    top: -8px;
}

.page-content.shrinked-body > app-storage-subscription-management > div > div > .card > .Plan-col:nth-child(1) > span
{
     
    left: 0px !important;
}

.page-content.shrinked-body > app-storage-subscription-management > div > div > .card > .Plan-col > span
{
     position: relative;
    z-index: 2;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    top: -8px;
    left: -14px;
}  
  .modal-lg-sphercal {
    min-width: 841px;
}
.second-model-backdrop{
    z-index: 1050 !important;
}

#needHelpRedirection
{
    position: fixed;
    /* top: 95%; */
    /*top: 83%;
    right:10px;*/
    /* top: 8%; */
    top : 40px;
    right: 2.3%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 1050;
    /* box-shadow: 0px 0px 3px 6px #1c1c1c; */
}

.guideMe{
    position: fixed;
    top: 95vh;
    right: 2.3%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 1050;
}
.guideMe> a
{
    color: #fff;
    background-color: #036186;
    border-color: #036186;
    border-radius: 8px;
    padding: 8px 15px;
    text-decoration: none;
    margin-left: 10px;
    cursor: pointer;
    box-shadow: 0px 1px 0px 0px #577f8f;
}

#needHelpRedirection > a
{
     color: #fff;
    background-color: #036186;
    border-color: #036186;
    border-radius: 8px;
    padding: 8px 15px;
    text-decoration: none;
    margin-left: 10px;
    cursor: pointer;
    box-shadow: 0px 1px 0px 0px #577f8f;
}

#helpContainer
{
    position: fixed;
    /* bottom: 8%; */
    bottom: 15%;
    right:10px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: 1050;
    background: #fff;
	border-radius: .4em;
    width: 23%;
    box-shadow: 1px 0px 10px 6px #1c1c1c;
}


#helpContainer > .box-header
{
    padding: 10px 15px;
    background-color: #05A0DE;
    color: #fff;
    font-family: 'Sansita';
    border-radius: .4em;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}

#helpContainer > .box-header > span
{
    float: right;
    cursor: pointer;
}

#helpContainer > .box-header > span > i
{
    color:#fff;
}

#helpContainer > .box-body
{
    padding: 6px 10px;
    color: #404040;    
    min-height: 180px;
    max-height: 180px;
    overflow-y: auto;
    font-family: 'Sansita';
}

.text-overflow{
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 75%;
    white-space: nowrap;
}

.text-overflow-file-upload{
    display: inline-block;
    text-overflow: ellipsis;
    overflow: hidden;
    width: 95%;
    min-width: 300px;
    white-space: nowrap;
}

.text-black{
    color: #000;
}

/*ul.nav-ul .tooltip-inner
{
    max-width:500px !important;
    width:300px !important;
}

.tooltip-inner
{
    text-align: left !important;
    padding: 7px;
}*/

ul.nav-ul .tooltip> .arrow::before
{
   
}

ul.nav-ul .tooltip.show
{
        opacity: 1;
}

.active-plan{
    background-color: #e4bc1c;
    font-size: 12px;
    width: fit-content;
    padding: 7px;
    border-radius: 4px;
    color: #fff;
}


.display-div{
        display: inline-flex;
}

#fileNamesAssets > div.progress{
    height: 1.2rem !important;
    border-radius: .3rem !important;
  }

  
.tooltipcus {
  }
  
  .tooltipcus .tooltiptextbottom {
    visibility: hidden;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: auto;
    left: 35%;
    padding-left: 5px;
    padding-right: 5px;
    margin-left: -60px;
    margin-top: 5%;
  }
  
  .tooltipcus .tooltiptextbottom::after {
    content: "";
    position: absolute;
    top: -35%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color:  transparent transparent black transparent;
  }
  
  .tooltipcus:hover > .tooltiptextbottom {
    visibility: visible;
  }
  

  
  .tooltipcus .tooltiptext {
    visibility: hidden;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: -2%;
    left: 35%;
    padding-left: 5px;
    padding-right: 5px;
    margin-left: -60px;
  }
  
  .tooltipcus .tooltiptext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: black transparent transparent transparent;
  }
  
  .tooltipcus:hover > .tooltiptext {
    visibility: visible;
  }

  .page-content.unshrinked-body > app-storage-subscription-management > div>div > div > .card > .Plan-col > span
{
    position: relative;
    z-index: 1;
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    top: -8px;
}

#studioSubmenu > li{
    position: relative;
    padding: 0 15px !important;
}
  
  li.active2:hover img {
    /* Change the image on hover */
    background: url('assets/images/Experizer-Icons/Experizer-dashboard-Icons/My-Experiences_h.png');
  }

nav#sidebar.shrinked #studioSubmenu {
    max-height: none;
    margin-top: 5px !important;
    /*padding-left: 25px;*/
}
nav#sidebar.shrinked #studioSubmenu > li > a > span{
    display: none;
}

nav#sidebar.shrinked #studioSubmenu {
    display: none;
}

/* nav#sidebar.shrinked #scrollable-left-menu > ul > li.active1.active > i{
    display: none;
} */

.category-dropdown-caret{
    float: right;
      position: absolute;
      top: 6px;
      right: 30px;
      font-size: 24px !important;
  }

nav#sidebar.shrinked .category-dropdown-caret {
      float: right;
      position: absolute;
      top: 6px;
      right: 10px;
      font-size: 24px !important;
}

#shrinked-category-dropdown > ul > li > a > span{
    display: inline !important;
    font-size: 14px !important;
}

.category-dropdown-hide{
   
    -webkit-animation: slide-left .9s ease-out;
    -moz-animation: slide-left .9s ease-out;
    display: none !important;
    /* transition: opacity 0.5s linear; */
}

.category-dropdown{
    display: block !important;
    -webkit-animation: slide-right .9s ease-out;
    -moz-animation: slide-right .9s ease-out;
}

.category-dropdown-slide-left{
    display: none !important;
    -webkit-animation: slide-left .9s ease-out;
    -moz-animation: slide-left .9s ease-out;
}

@-webkit-keyframes slide-right {
    0% { opacity: 0; -webkit-transform: translateX(-50%); }   
  50% { opacity: 1; -webkit-transform: translateX(0); }
}
@-moz-keyframes slide-right {
    0% { opacity: 0; -moz-transform: translateX(-50%); }   
  50% { opacity: 1; -moz-transform: translateX(0); }
}


@-webkit-keyframes slide-left {
    100% { opacity: 0; -webkit-transform: translateX(-50%); }   
  0% { opacity: 1; -webkit-transform: translateX(0); }
}
@-moz-keyframes slide-left {
    100% { opacity: 0; -moz-transform: translateX(-50%); }   
  0% { opacity: 1; -moz-transform: translateX(0); }
}

.button-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
    margin-top: 10px;
  }
  
  /* === THEME: GREEN === */
.theme-green .bs-datepicker-head {
    background-color: #4caf50 !important;
    color: white !important;
  }
  
  .theme-green .bs-datepicker-body table td span.selected,
  .theme-green .bs-datepicker-body table td span.range,
  .theme-green .bs-datepicker-body table td span:hover {
    background-color: #66bb6a !important; 
    color: white !important;
  }
  
  .theme-green .bs-datepicker-container {
    border-radius: 10px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
    background-color: #f7fff7 !important; 
  }
  
  .theme-green .bs-datepicker-body table td.week span {
    color: #81c784;
  }
  
  .theme-green .bs-datepicker-body table td span.disabled {
    color: #ccc;
    background-color: transparent;
  }
  
  .theme-green .bs-datepicker-multiple {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
  }
  
  .theme-green .bs-datepicker {
    flex: 0 0 50%;
    max-width: 50%;
    width: 50%;
  }
  

  
  /* .createExpBtn {
    background-color: #33aaf1;
    color: white;
    font-weight: bold;
    font-size: 1rem;
    padding: 10px 24px;
    border-radius: 24px;
    width: 100%;    
    border: none;
    cursor: pointer;
  } */

  @media (min-width: 1080px) {
    .Profilemove-up {
        margin-top: 0.8rem;
    }
}

@media (min-width: 1200px) {
    .Profilemove--down {
        margin-top: 1.5rem;
        margin-left: -5px;
    }

    .Profilemove-up {
        margin-top: 0.8rem;
    }
}


@media (min-width: 1900px) {
.nav-ul > li > a{
    font-size: 1rem;
}
.button-container {
    gap: 20px; 
    margin-top: 20px;
    margin-bottom: 20px;
  }
}

@media (min-width: 1900px) {
  
    #userName
{
    font-size: 1rem;
}
#userInfoDiv
{
   margin-left: 0px;
}
#planName
{
    font-size: 14px;
}
.fa-cog::before
{
    font-size: 18px;
}
.createExpBtn
{
    font-size: 1rem;
}
nav#sidebar ul
{
    line-height: 3rem;
}
nav#sidebar ul a img
{
    width:20px;height:20px;margin-right: 20px;
}
#scrollable-left-menu {
    height: auto;
    overflow-y: hidden;
    overflow-x: hidden;
}

body
{
    font-size: 18px;
}

.Profilemove--down {
    margin-top: 1.5rem;
    margin-left: -5px;
}
.Profilemove-up {
    margin-top: 0.8rem;
}

}


@media (min-width: 2400px)
{
    nav#sidebar {
      
        display: flex;
        flex-direction: column;
        gap: 5px;
    }


    .nav-ul > li > a{
        font-size: 1.2rem;

    }
    #userName
{
    font-size: 1.2rem;
    /* color:#fff; */
}
#userInfoDiv
{
   margin-left: 0px;
}
#planName
{
    font-size: 16px;
}
.fa-cog::before
{
    font-size: 20px;
}

.button.createExpBtn
{

    font-size: 1rem;
    margin-bottom:-2rem;
   
}
nav#sidebar ul
{
    line-height: 3rem;
}
nav#sidebar ul a img
{
    width:20px;height:20px;margin-right: 20px;
}
#scrollable-left-menu {
    height: auto;
    overflow-y: hidden;
    overflow-x: hidden;
}

body
{
    font-size: 20px;
}
#needHelpRedirection
{
    font-size: 1.2rem;
}

.Profilemove--down {
    margin-top: 1.5rem;
    margin-left: -5px;
}
}

@media (min-width: 3400px)
{

    nav#sidebar {
      
        display: flex;
        flex-direction: column;
        gap: 25px;
    }
.nav-ul > li > a{
        font-size: 2rem;

}

.nav#sidebar ul
{
    line-height: 14rem;
}
#userName
{
    font-size: 1.7rem;
}
#userInfoDiv{
    position: absolute;
    top:2rem;
    left: 110px;
    width:50%;
    gap: 20px;
    overflow-wrap: break-word;
}
#sidebar {
    height: 105vh;
}
#planName
{
    font-size: 1.5rem;
}
.fa-cog::before
{
    font-size: 2.2rem;
    margin-right: 13px;
}
.createExpBtn
{
    font-size: 2rem !important;
    border-radius: 3rem
}
#needHelpRedirection
{
    font-size: 1.8rem;
}

nav#sidebar ul
{
    line-height: 5rem;
}
#scrollable-left-menu
{
    overflow-x: hidden;
}
.sidebarSection 
{
    padding: 30px 20px 10px;
    font-size:1.8rem;
}
nav#sidebar .avatar {
    min-width: 70px;
    max-width: 70px;
    min-height: 70px;
    max-height: 70px;
    margin-right: 30px;
    top: 1rem;
}
nav#sidebar ul a img
{
    width:28px;height:28px;margin-right: 30px;
}
.call-me-label > i
{
    font-size: 2.2rem;
    margin-right: 22px;
}
.call-me-label
{
    font-size: 1.8rem;
}
.sidebar-header > .popover
{
    height: 28rem;
    width: 31rem;
}
.popover-body {
    height: 9rem;
    width: 17rem;
}
.personalInfoPopover
{
    height:450px;
    width:450px;
    
}
body
{
    font-size: 24px !important;
}

.experizer-logo > .img {
    width: 11rem;
}

.planName-popup > i {
    font-size: 1.7rem;
}

.customise-avatar {
    min-width: 90px !important;
    max-width: 90px !important;
    min-height: 90px !important;
    max-height: 90px !important;
    /* margin-top: 1.5rem; */
    margin-left: 5px;
}

.upgradeBtn {
    font-size: 16px !important;
}

.upgradeBtn > img {
    height: 26px !important;
    top: -12px !important;
    right: -10px !important;
}

.Profilemove--down {
    margin-top: 1rem;
}

input.form-control,select.form-control
{
    height: calc(3.25rem + 2px) !important;
}

}

@media (max-width: 1000px) {
    .popover {
        display: none !important;
    }
}
.liMenuActive{
    background-color: #B2E7FC;
}