/*Application Tags Style*/
body,html{font-family:ManropeMedium;margin:0px;height:100vh;background:white;width: 100vw;overflow-x: auto;overflow-y:hidden;min-width: 900px; --purpleBtn:#4947A7;--greenBtn:#51A451;--redBtn:#FF4B63;--blueBtn:#5985FF;--darkpurple:#18183A;--green:#2C922C;--red:#FF2929;--blue:#2C5BDE;--grey:#B2B2B2;--purple:#040B4c;--darkgrey:#8B8B9C;--lightpurple:#E3E3F0;--lightgrey:#E4E4EF;--black:#000000;--white:#FFFFFF;--brdlightgrey:#EDEDED;--brdpurple:#4947a7;--brdlightpurple:#C9C8E5;--brddarkpurple:#18183A;--faintPurple:#edf5f7;--lightOrange:#F9A825;--faintgrey:#f7f7fd;--irisPurple:#4947a7;--darkpurpletxt:#18183A;--barleyCorn:#9A9A59;}
h1,h2,h3,h4,h5,h6,svg,div:focus{outline:none;}
h1,h2,h3,h4,h5,h6,p{float:left;margin:0px;padding:0px;}
div,h1,h2,h3,h4,h5,h6,p{position:relative;box-sizing: border-box;-webkit-touch-callout: text;-webkit-user-select: text;-khtml-user-select: text;-moz-user-select: text;-ms-user-select: text;user-select: text;}
div[hidden] {display: none !important;}
select{height: 35px; margin-top: var(--px);padding: 0px var(--px); position: relative; }
svg,img{transform: var(--scale)}

.masking{position:absolute;height:100%;width:100%;top:0vh;left:0vh;background:#ffffffb3;z-index:25;}
.night .masking{position:absolute;height:100%;width:100%;top:0vh;left:0vh;background:rgb(58 58 58);opacity:0.7;z-index:25;}

/*Div Positions and formats*/
.h{float:left;width:100%;height:auto;}
.v{float:left;width:auto;height:100%;}
.vh{float:left;height:auto;width:auto;}
.boundary{float:left;height: 100%;width: 100%;overflow:hidden;}
.b{float:left;height: 100%;width: 100%;overflow:hidden;}
.abTR{position: absolute;height: auto;top:0%;right: 0px; width: auto;overflow:hidden;}
.abTL{position: absolute;height: auto;top:0%;left: 0px;width: auto;overflow:hidden;}
.fx{position: fixed;height: 100%;width: 100%;overflow:hidden;}
.sticky{position: sticky;top:0px;left:0px;overflow:hidden;}
.spanPos { position: absolute;  background: white; }

.blur1{filter:blur(7px);}
.blur2{filter:blur(20px);}

.leftS{left:0%;}
.leftH{left:100%;}
.rightS{right: 0%;}
.rightH{right:100%;}
.leftP{position:absolute;top:0%;height:100%;width:100%;}

.fl{float: left;}
.fr{float: right;}

.max0{max-height:0px;overflow: hidden;}
.maxF{max-height:1000px;overflow: hidden;}

.oh{overflow: hidden;}
.scroll{overflow: auto}
.scrollX{overflow-x: auto}
.scrollY{overflow-y: auto}

.bright{opacity:1;}
.dim{opacity:0.3;}
.opMid{opacity:0.5;}
.op0{opacity:0;}
.op8{ opacity: 0.86;}
.op7{opacity:0.8;}

.leftShow{ max-width:350px; padding-left: var(--px2);  }
.leftHide{ max-width:0px; padding-left: 0px; }

.searchBar{padding-right: 40px !important;}

.apexcharts-canvas .apexcharts-zoom-icon.apexcharts-selected svg {
    fill: #008ffb00 !important;
  }

/* .leftSection{width:calc(250px * var(--scale1));overflow:hidden;} */
.hide{display: none;}
.show{display: block;}

.disableClick{pointer-events:none;}
.enableClick{pointer-events:all;}
.noSelect{-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.mGenOpts{position:absolute;height:auto;max-height:160px;width:auto; max-width: 145px;min-width: 60px;background:white;overflow-y:auto;overflow-x:hidden;z-index:21;}

.bigHeading{ font-size:calc(19px * var(--font));color:var(--darkpurpletxt);}
.heading{ font-size:calc(17.6px * var(--font));color:var(--darkpurpletxt); font-weight: 500;}
.subHeading{font-size:calc(15px * var(--font));color:var(--darkpurpletxt);font-weight: 400;}
.sectext{ font-size:calc(14px * var(--font));color:var(--darkpurpletxt);font-weight: 400;}

.night .bigHeading{color: var(--white)} 
.night .heading{color: var(--white)}
.night .subHeading{color: var(--white)}
.night .sectext{color: var(--white)}

/*Z-Index*/
.z0{z-index: 0;}
.z1{z-index: 1;}
.z5{z-index: 5;}
.z10{z-index: 10;}
.z11{z-index: 11;}
.z15{z-index: 15;}
.z99{z-index: 99;}
.zTop{z-index: 2000;}


/*Input tag styling*/
input,textarea{font-family: ManropeMedium;border:none;padding:0vh;width:100%;}
input,textarea:focus{outline:none;}
input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill{box-shadow: 0 0 0 1000px white inset;border-color: #ededed;}
.inputMoreOpt{position:absolute;top:0vh;left:0vh;height:2.5vh;width:2.5vh;opacity:0;}
.clouzer span{padding:10px;font-size: 13px;font-weight: 300;pointer-events: none;position:absolute;left:0;top:0;height: auto;transition: 0.02s;transition-timing-function: ease;transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);opacity:0.5;text-transform:capitalize;}
.clouzer input,textarea,.custclass{padding:10px;border-radius: 5px;border: 0.5px solid #ededed;box-sizing: border-box}
.clouzer input:focus,textarea:focus{border: 0.5px solid #ededed;border-radius: 5px;}
.clouzer input:not(:placeholder-shown),textarea:not(:placeholder-shown){border: 0.5px solid #ededed;}

.custclass:focus + span,input:focus + span,textarea:focus+span, input:not(:placeholder-shown) + span,textarea:not(:placeholder-shown) +span,.custclass:not(:placeholder-shown)+span  {
    opacity:0.9;
    font-size: 14px !important;
    transform: scale(0.75) translateY(-70%) translateX(3px);
    transform-origin: 0px 50%;
}
input:focus + span,textarea:focus+span, input:not(:-ms-input-placeholder) + span {
    opacity:0.9;
    font-size: 15px;
    transform: scale(0.75) translateY(-100%) translateX(3px);
}

/*pseudo-classes*/
.onHover:hover{background-color: #f2f2f2;}
.onHover1:hover{background-color: #ededed;}
.night .onHover:hover{background-color: #b4b4b4;}
.highlight:focus{ border: 1px solid rgba(0,0,0,0.14);border-radius: 4px;box-shadow: inset 0px 0px 1px 0px rgba(0,0,0,0.14), 0 0 0px rgba(0,0,0,0.2);}
.hideInArrows::-webkit-inner-spin-button,.hideInArrows::-webkit-outer-spin-button{-webkit-appearance: none;-moz-appearance: none;appearance: none;}
.hideInArrows{-moz-appearance:textfield;}
.photoHover{position:absolute;top:130%;left:0px;height:100%;width:100%;}
.photoParent:hover .photoHover{top:0px;}
.hideOnHover{position:absolute;top:100%;left:0vh;height:100%;width:100%;}
.hideOverParent:hover .hideOnHover{top:0vh;}

/*SVG and Image*/
.icon24{height:calc(24px * var(--scale));cursor: pointer;opacity:0.6;}
.icon18{height:calc(18px * var(--scale));cursor: pointer;opacity:0.6;}
.svg{height: calc(18px * var(--scale));float:left;}
.bigSvgIcon{height:calc(100px * var(--scale));width: calc(100px * var(--scale))};
.bgfixed{background-attachment: fixed;}
.img35{height:35px;width:35px;background-position: center;background-repeat: no-repeat;background-size: cover;overflow: hidden;}
.img45{height:45px;width:45px;background-position: center;background-repeat: no-repeat;background-size: cover;overflow: hidden;}
.img70{height:70px;width:70px;background-position: center;background-repeat: no-repeat;background-size: cover;overflow: hidden;}
.imgFull{height:100%;width:100%;background-position: center;background-repeat: no-repeat;background-size: cover;overflow: hidden;}


/*Background color for Day theme*/
.bg1{background:var(--darkpurple)}
.bg2{background:var(--black);}
.bg3{background:var(--green);}
.bg4{background:var(--white);}
.bg5{background:var(--blue);}
.bg6{background:var(--purple);}
.bg7{background:var(--lightpurple)}
.bg8{background:var(--lightgrey);}
.bg9{background:var(--grey);}
.bg10{background:var(--darkgrey);}
.bg11{background:var(--red);}
.bg12{background:var(--faintPurple);}
.bg13{background:var(--lightOrange);}
.bg14{background: var(--faintgrey);}
.bg15{background: var(--irisPurple);}
.bg16{background: var(--barleyCorn);}
.bg17{background: yellow;}
.bg18{background:#c6c6ce;}
.bg19{background:rgb(245, 243, 243);}
.bg20{background:#999;}
.bg21{background: #edf5f7;}
.bg22{background: #E6F3FE;}

/* .bg1{background:#FFFFFF;}
.bg2{background:#fafaf6;}
.bg3{background:rgb(69, 159, 237)}
.bg4{background:#eee;}
.bg5{background:#fafafa}
.bg6{background:#f2f2f2}
.bg7{background:#a8a8a8}
.bg8{background:#0e424f}
.bg9{background:#ededed}
.bg10{background:#F0F2F5}
.bg11{background:#436DFA} */

/* Need to remove classes */
/*.bg12{background:rgba(0,0,0,.6);}
.bg13{background: #2E7D32}*/
/* .bg14{background: #f44336;}
.bg15{background: #f9f9f9;}
.bg16{background-color: #55c18d;}
.bg17{background: #303131}
.bg18{background:#F5F5F5}
.bg19{background:#92b070}
.bg20{background: #edf1e6}
.bg21{background: #2196f3}
.bgW{background: #d5e9aa;}
.bgS{background: #f6f2a1;}
.bgF{background: #eabbef;}
.bgP{background: #f59787;}
.bg22{background: #9a9a59;}
.bg23{background: #2E7D32;}
.bg24{background:#4947a7}
.bg25{background: #04064C}
.bg26{background: #e3e3f0}
.bg27{background: #f7f7fd}
.bg28{background: #479b6b} */
/*Background color for Night theme*/
.night .bg1{background:#3a3a3a;}
.night .bg2{background:#3a3a3a;}
.night .bg4{background:#3a3a3a;}
.night .bg7{background:#4c4c4c;}
.night .bg8{background:#3a3a3a;}
.night .bg15{background:#4d5d92;}
.night .bg10{background:#3a3a3a;}
.night .bg12{background:#4c4c4c;}
.night .bg9{background:#888888;}
.night .bg6{background:#6f6f6f;}
.night .bg11 { background: #4d5d92; }
.night .bg14{background:#3a3a3a;}
.night .bg25{background:#3a3a3a;}
.night .bg26{background:#3a3a3a;}
.night .bg24{background:#4d5d92;}
.night .bg19{background:#6f6f6f;}
.night .bgLightGray{background:#3a3a3a;}
.night .bgWhite{background-image: linear-gradient(to bottom,#B2B4C0,#ab9ba1);}


/*Text color*/
.clr{color:var(--darkpurpletxt)}
.clr2{color:var(--black);}
.clr3{color:var(--green);}
.clr4{color:var(--white);}
.clr5{color:var(--blue);}
.clr6{color:var(--purple);}
.clr7{color:var(--lightpurple)}
.clr8{color:var(--lightgrey);}
.clr9{color:var(--grey);}
.clr10{color:var(--darkgrey);}
.clr11{color:var(--red);}
.clr12{color:var(--irisPurple);}
.clr13{color:var(--lightOrange);}
.clr14{color:#5c5c88}
.clr15{color:#225386}
.clr16{color:#70A2EE}

/* .clr{color:var(--darkpurple)}
.clr2{color:rgba(0,0,0,0.72);}
.clr3{color:#2E7D32;}
.clr4{color:#FFFFFF;}
.clr5{color:#2B50ED}
.clr6{color:rgba(0,0,0,0.52);}
.clr7{color:#000}
.clr8{color:rgba(255,255,255,0.9);}
.clr9{color:#c1c1c1}
.clr10{color:#F9A825;} */

/* Need to remove classes */
/* .clr11{color: #f44336;}
.clr12{color:#afafaf;}
.clr13{color:#55c18e;}
.clr14{color:rgba(0,0,0,0.65);}
.clr15{color:rgba(0,0,0,0.42);}
.clr16{color:rgba(255,255,255,0.81);}
.clr17{color:rgb(246, 191, 37)}
.clr18{color:rgb(85, 193, 142)}
.clr19{color:rgb(230, 124, 115)}
.clr20{color:#2b4d8e}
.clr21{color: #2196f3;}
.clr22{color: #0e424f;}
.clr23{color: #5c5c88;}
.clr24{color: #4947a7;}
.clr25{color: #333363;}
.clr26{color: #858495;}
.clr27{color:#B2B2B2}
.clr28{color:#6A6EFf}
.clr29{color:#18183a} */
::placeholder{color:rgba(0,0,0,0.54);-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.timestamp{font-size:10px;font-weight: 400;color:rgba(0,0,0,0.6);text-align: end;}
.night .timestamp{color: #FFFFFF}
/*Text color Night theme*/
.night .clr{color:rgba(255,255,255,1);}
.night .clr2{color:rgba(255,255,255,0.72);}
.night .clr12{color:rgba(255,255,255,0.72);}
.night .clr6{color:rgba(255,255,255,0.52);}
.night .clr7{color:#FFFFFF}
.night .clr14{color:white;}
.night .clr15{color:rgba(255,255,255,0.42);}
.night ::placeholder{color:rgba(255,255,255,0.42);}
.night .clr23{color: rgba(255,255,255,0.72);}
.night .clr24{color: rgba(255,255,255,0.72);}
.night .clr25{color: rgba(255,255,255,0.72);}
.night .clr26{color: rgba(255,255,255,0.72);}

/*Text Format*/
.lw{font-weight:300;}
.mw{font-weight:400;}
.hw{font-weight:500;}
.bold{font-weight:600;}
.nw{font-weight: normal}
.italic{font-style: italic;}
.cap{text-transform:capitalize;}
.low{text-transform:lowercase;}
.up{text-transform:uppercase;}
.wb{word-break: break-word;}
.wpw{white-space:pre-wrap;}

.slct{text-decoration:underline;}
.uSlct{text-decoration:none;}
.strike{text-decoration:line-through;}

.e{overflow:hidden;text-overflow:ellipsis;direction:ltr;max-width:100%;white-space:nowrap;}
.e2{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;max-width:100%;}
.e3{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;max-width:100%;}

.tac{text-align: center;}
.tart{text-align: right;}

/*Text Font Sixe*/
.px9{font-size:calc(9px * var(--font));}
.px10{font-size:calc(10px * var(--font));}
.px11{font-size:calc(11px * var(--font));}
.px12{font-size:calc(12px * var(--font));}
.px13{font-size:calc(13px * var(--font));}
.px14{font-size:calc(14px * var(--font));}
.px15{font-size:calc(15px * var(--font));}
.px16{font-size:calc(16px * var(--font));}
.px17{font-size:calc(17px * var(--font));}
.px18{font-size:calc(18px * var(--font));}
.px19{font-size:calc(19px * var(--font));}
.px20{font-size:calc(20px * var(--font));}
.px23{font-size:calc(23px * var(--font));}
.px25{font-size:calc(25px * var(--font));}
.px30{font-size:calc(30px * var(--font));}
.px35{font-size:calc(35px * var(--font));}
.px50{font-size:calc(50px * var(--font));}

/*pointers*/
.pw{cursor:wait;}
.default{cursor: default;}
.pt{cursor:pointer;}
.pno{cursor: not-allowed;}
.presize{cursor: s-resize;}
.cros{cursor:crosshair;}
.cprogress{cursor:progress;}
.move{cursor:move;}

/*Padding 5px*/
.zp{padding:0vh;}
.sp{padding:var(--px);}
.zp{padding:0vh;}
.sp{padding:var(--px);}
.slp{padding:0vh 0vh 0vh var(--px);}
.srp{padding:0vh var(--px) 0vh 0vh;}
.stp{padding:var(--px) 0vh 0vh 0vh;}
.sbmp{padding:0vh 0vh var(--px) 0vh;}
.slrp{padding:0vh var(--px) 0vh var(--px);}
.stbp{padding:var(--px) 0vh var(--px) 0vh;}
.sbrp{padding:0vh var(--px) var(--px) 0vh;}
.sblp{padding: 0vh 0vh var(--px) var(--px);}
.sblrp{padding: 0vh var(--px) var(--px) var(--px);}
.stlp{padding:var(--px) 0vh 0vh var(--px);}

/*Padding 10px*/
.p{padding:var(--px1);}
.lp{padding:0vh 0vh 0vh var(--px1);}
.rp{padding:0vh var(--px1) 0vh 0vh;}
.tp{padding:var(--px1) 0vh 0vh 0vh;}
.bp{padding:0vh 0vh var(--px1) 0vh;}
.bmp{padding:0vh 0vh var(--px1) 0vh;}
.lrp{padding:0vh var(--px1) 0vh var(--px1);}
.tbp{padding:var(--px1) 0vh var(--px1) 0vh;}
.brp{padding:0vh var(--px1) var(--px1) 0vh;}
.blp{padding: 0vh 0vh var(--px1) var(--px1);}
.blrp{padding: 0vh var(--px1) var(--px1) var(--px1);}
.tlp{padding:var(--px1) 0vh 0vh var(--px1);}
.tlrp{padding: var(--px1) var(--px1) 0px var(--px1);}

/*Padding 20px*/
.bfp{padding:var(--px2);}
.bxlp{padding:0vh 0vh 0vh var(--px2);}
.bbrp{padding:0vh var(--px2) 0vh 0vh;}
.btp{padding:var(--px2) 0vh 0vh 0vh;}
.bbmp{padding:0vh 0vh var(--px2) 0vh;}
.bxlrp{padding:0vh var(--px2) 0vh var(--px2);}
.btbp{padding:var(--px2) 0vh var(--px2) 0vh;}
.bxrp{padding:0vh var(--px2) var(--px2) 0vh;}
.bblp{padding: 0vh 0vh var(--px2) var(--px2);}
.bblrp{padding: 0vh var(--px2) var(--px2) var(--px2);}
.btlp{padding:var(--px2) 0vh 0vh var(--px2);}

.pf{padding:15px}
.pl{padding:0px 0px 0px 15px}
.plr{padding:0px 15px 0px 15px}
.pto{padding:15px 0px 0px 0px}
.plrb{padding:0px 15px 15px 15px}
/*solo padding 5px*/
.olp{padding-right:var(--px);}
.orp{padding-left:var(--px);}
.otp{padding-top:var(--px);}
.obp{padding-bottom:var(--px);}

/*Margin 5px*/
.mz{margin:0vh;}
.slm{margin:0vh 0vh 0vh var(--px);}
.srm{margin:0vh var(--px) 0vh 0vh;}
.stm{margin:var(--px) 0vh 0vh 0vh;}
.sbm{margin:0px 0vh var(--px) 0vh;}
.slrm{margin:0vh var(--px);}
.sbtm{margin:var(--px) 0vh;}
.stlm{margin:var(--px) 0vh 0vh var(--px);}
.strm{margin:var(--px2) var(--px) 0vh 0vh;}
.srbm{margin:0vh var(--px) var(--px) 0vh;}
/*Margin 10px*/
.m{margin:var(--px1);}
.lm{margin:0vh 0vh 0vh var(--px1);}
.rm{margin:0vh var(--px1) 0vh 0vh;}
.tm{margin:var(--px1) 0vh 0vh 0vh;}
.bm{margin:0vh 0vh var(--px1) 0vh;}
.lrm{margin:0vh var(--px1);}
.btm{margin:var(--px1) 0vh;}
.tlm{margin:var(--px1) 0vh 0vh var(--px1);}
.trm{margin:var(--px1) var(--px1) 0vh 0vh;}
.rbm{margin:0vh var(--px1) var(--px1) 0vh;}
/*Margin 20px*/
.blm{margin:0vh 0vh 0vh var(--px2);}
.brm{margin:0vh var(--px2) 0vh 0vh;}
.bxtm{margin:var(--px2) 0vh 0vh 0vh;}
.bbm{margin:0px 0vh var(--px2) 0vh;}
.blrm{margin:0vh var(--px2);}
.bbtm{margin:var(--px2) 0vh;}
.btlm{margin:var(--px2) 0vh 0vh var(--px2);}
.btrm{margin:var(--px22) var(--px2) 0vh 0vh;}
.brbm{margin:0vh var(--px2) var(--px2) 0vh;}

.mf{margin: 10px}
.ml{margin: 0px 0px 0px 10px}
.mr{margin: 0px 10px 0px 0px}
.mb{margin: 0px 0px 10px 0px}
.mt{margin: 10px 0px 0px 0px}
/*Border,shadow and masking styling*/
.brdRad{border-radius: var(--px1);}
.bbrdRad{border-radius: 0px 0px var(--px1) var(--px1);}
.tbrdRad{border-radius: var(--px1) var(--px1) 0px 0px;}
.brdRad2{border-radius: var(--px);}
.circle{border-radius:50%;}
.bxshdw1{box-shadow: 0 2px 3px 0 rgba(0,0,0,0.15);}
.bxshdw2{box-shadow: 0 2px 3px 0 rgba(0,0,0,0.25);}
.bxshdw3{box-shadow: 0 2px 3px 0 rgba(0,0,0,0.05)}
.lineshadow{border-color: #F27E7E !important;box-shadow: 0px 13px 20px #ED2B2B;}

.zBrd{border-width:0px;}
.brd{border-style:solid;border-color:var(--brdlightgrey);}
.brd1{border-style:solid;border-color: var(--brdpurple);}
.brd2{border-style:solid;border-color: var(--brdlightpurple);}
.brd3{border-style:solid;border-color: var(--white);}
.brd4{border-style: solid;border-color: var(--brddarkpurple);}
/* .brd{border-style:solid;border-color:#ededed;}
.brd1{border-style:solid;border-color: #0277BD;} */
.brd5{border-style:solid;border-color: #2E7D32;}
.brd6{border-style:solid;border-color: #f44336;}

/* Need to remove classes */
/* .brd2{border-style:solid;border-color: #2E7D32;}
.brd4{border-style:solid;border-color: #F9A825;}
.brd5{border-style:solid;border-color: rgb(69, 159, 237);}
.brd6{border-style:solid;border-color:rgba(0,0,0,0.52);}
.brd7{border-style:solid;border-color:rgb(246, 191, 37);}
.brd8{border-style:solid;border-color:rgb(230, 124, 115);}
.brd9{border-style:solid;border-color:rgb(85, 193, 142);}
.brd10{border-style:solid;border-color:#28C7CA;}
.brd11{border-style:solid;border-color:#4a4cab;}
.brd12{border-style:solid;border-color:#FFFFFF;}
.brd13{border-style:solid;border-color: #e3e3f0;}
.brd14{border-style:solid;border-color: #4947a7;}
.brd15{border-style:solid;border-color:#858495;} */

.night .brd{border-style:solid;border-color:#525252;}
.night .brd1{border-style:solid;border-color:#525252;}
.night .brd2{border-style:solid;border-color:#525252;}
.night .brd3{border-style:solid;border-color:#525252;}
.night .brd4{border-style:solid;border-color:#525252;}

.fBrd{border-width:1px;}
.lBrd{border-width:0px 0px 0px 1px;}
.rBrd{border-width:0px 1px 0px 0px;}
.tBrd{border-width:1px 0px 0px 0px;}
.bBrd{border-width:0px 0px 1px 0px;}
.tbBrd{border-width:1px 0px 1px 0px;}
.trlBrd{border-width:1px 1px 0px 1px;}
.lbBrd{border-width:0px 0px 1px 1px;}
.lrBrd{border-width:0px 1px 0px 1px;}
.trBrd{border-width:1px 1px 0px 0px;}
.rbBrd{border-width:0px 1px 1px 0px;}
.tlBrd{border-width:1px 0px 0px 1px;}
.lrbBrd{border-width:0px 1px 1px 1px;}
.ltbBrd{border-width:1px 0px 1px 1px;}

.fxBrd{border-width:2px;}
/*Button and switch styling*/
.addIcon{background-color: #4947A7;border-radius: 50%;}
.buttonRed {background:#FF4B63;color: #fff;border-style:solid;border-color: #FF4B63;border-radius:6px;border-width:1px;height: var(--btn);padding:0px var(--px4);cursor:pointer;}
.buttonGreen {background:#51A451;color: #FFF;border-style:solid;border-color: #51A451;border-radius:6px;border-width:1px;height: var(--btn);padding:0px var(--px4);cursor:pointer;}
.buttonLightBlue {background:#5985FF;color: #5985FF;border-style:solid;border-color: #5985FF;border-radius:6px;border-width:1px;height: var(--btn);padding:0px var(--px4);cursor:pointer;}
.buttonBlue{background:#4947A7;color: #fff;border-style:solid;border-color: #4947A7;border-radius:6px;border-width:1px;height: var(--btn);padding:0px var(--px4);cursor:pointer;}
.buttonShadePurple{background:#B6B5DC;color: #fff;border-style:solid;border-color: #B6B5DC;border-radius:6px;border-width:1px;height: var(--btn);padding:0px var(--px4);cursor:pointer;}
.buttonGrey {background:gray;color: #fff;border-style:solid;border-color: gray;border-radius:6px;border-width:1px;height: var(--btn);padding:0px var(--px4);cursor:pointer;}
.buttonLightGray {background:#CCCCCC;color: black;border-style:solid;border-color: #CCCCCC;border-radius:6px;border-width:1px;height: var(--btn);padding:0px var(--px4);cursor:pointer;}

.night .buttonRed {background:#3a3a3a;border-color:#525252;}
.night .buttonGreen {background:#3a3a3a;border-color:#525252;}
.night .buttonLightBlue {background:#3a3a3a;border-color:#525252;} 
.night .buttonBlue {background:#3a3a3a;border-color:#525252;}
.night .buttonGrey {background:#3a3a3a;border-color:#525252;}
.night .buttonShadePurple {background:#3a3a3a;border-color:#525252;}

.onoffswitch {position: relative; width: 43px;-webkit-user-select:none; -moz-user-select:none; -ms-user-select: none;}
.onoffswitch-checkbox {display: none;}
.onoffswitch-label {display: block;overflow: hidden;cursor: pointer;border-radius: 20px;margin:0px;}
.onoffswitch-inner {display: block; width: 200%; margin-left: -100%;transition: margin 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95);-webkit-transition: margin 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95);-moz-transition: margin 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95);-o-transition: margin 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95);}
.onoffswitch-inner:before, .onoffswitch-inner:after {display: block;	float: left;	width: 50%;	height: 25px; padding: 0; color: white; box-sizing: border-box;}
.onoffswitch-inner:before {	content: "";padding-left: var(--px1);background-color: rgba(144, 219, 22, 0.76);color: rgba(255,255,255,0.66);}
.onoffswitch-inner:after {content: "";padding-right: var(--px1);background-color: rgba(214,32,78,0.5); color: #000000;}
.tooltip .onoffswitch-inner:before {content: "ON";background-color: #4990E2;}
.tooltip .onoffswitch-inner:after {content: "OFF";background-color: #F5F5F5;text-align: right;}
.onoffswitch-switch {display: block;width: 2.5vh;margin: 0px;background: rgba(255,255,255,0.7);position: absolute;top: 0;bottom: 0;right: 2.5vh;border-radius: 20px;transition: all 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95);-moz-transition: all 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95);-webkit-transition: all 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95);-o-transition: all 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95)}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner {margin-left: 0;}
.onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch {right: 0px; }

/*Scroll bar styling*/
::-webkit-scrollbar{width:var(--bar);height:var(--bar);border-radius: 4px;}
.day ::-webkit-scrollbar-thumb {background-color:#c5c5c5;}
.night ::-webkit-scrollbar-thumb {background-color:#5a5a5a;}
.smoothscroll{scroll-behavior: smooth;}

/*Slider and progress bar*/
.slider input {pointer-events: none;position: absolute;-webkit-appearance: none;width:100%;height: 3px;outline: none;-webkit-transition: .2s;transition: opacity .2s;margin: 0px;} 
.slider input[type=range]::-webkit-slider-thumb {pointer-events: all;position: relative;-webkit-appearance: none;height: 10px;width: 10px;border-radius: 50%;cursor: pointer;z-index: 15px;}
.blue.slider input{background: linear-gradient(to right,rgb(69, 159, 237) 0% 50%,#a8a8a8 50% 100%);}
.blue.slider input[type=range]::-webkit-slider-thumb {border: 0.5px solid rgb(69, 159, 237);background-color:rgb(69, 159, 237);box-shadow: 0 1.5px 2px 0 rgb(69, 159, 237);}
.red.slider input{background: linear-gradient(to right,#ef6c00 0% 50%,#a8a8a8 50% 100%);}
.red.slider input[type=range]::-webkit-slider-thumb {border: 0.5px solid #ef6c00;;background-color:#ef6c00;;box-shadow: 0 1.5px 2px 0 #ef6c00;}
.gray.slider input{background: linear-gradient(to right,#424242 0% 50%,#a8a8a8 50% 100%);}
.gray.slider input[type=range]::-webkit-slider-thumb {border: 0.5px solid #424242;;background-color:#424242;;box-shadow: 0 1.5px 2px 0 #424242;}

/*Animation*/
.svgRotate90{transform:rotate(90deg);}
.svgRotate45{transform:rotate(45deg);}
.svgRotate180{transform:rotate(180deg);}
.svgRotate270{transform:rotate(270deg);}
.svgRotate0{transform:rotate(0deg);}

.trans{transition: all 200ms cubic-bezier(0.445, 0.05, 0.55, 0.95);}
.notrans{transition: none;}
.transition{transition: top 1s;}
.trans1{transition:all 550ms cubic-bezier(0.445, 0.05, 0.55, 0.95)}

.splRotate{z-index:11;width:12.5%;height: 12.5%;position: absolute;top:0vh;left:calc(43.75%);transition:transform 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95);transform-origin: 50% 400%;}
.bgPath,.fgPath{stroke-width: 5px;fill: transparent;stroke-dasharray: 2000;stroke-dashoffset: 2000;animation: dash 0.6s cubic-bezier(0.445, 0.05, 0.55, 0.95) forwards;}

.collapsein{height:auto;max-height:35px;width:100%;float:left;overflow:hidden;transition:max-height .5s;}
.expand{height:auto;max-height:100%;width:100%;float:left;overflow:hidden;transition:max-height .5s;}

.frontView, .backView {backface-visibility: hidden;position: absolute;top: 0;left: 0;}
.frontView {z-index: 2;}
.backView {-webkit-transform: rotateY(180deg);transform: rotateY(180deg);}
.highlightRoom {fill: #ffffff;animation: myRoom 2s 3; }
@keyframes myRoom {
    0% {fill: #ffffff;}
    20% {fill: #ffdd95;}
    50% {fill: #ffdd95;}
    100% {fill: #ffffff;}
}


/*Responsive Web Design - Media Queries*/

/* @media (max-width: 1550px) {
body, html { --px: 4px;--px1: 8px;}
}

@media (min-width: 1550px) {
body,html {--px: 5px;--px1: 10px;}
} */

@media (min-width: 1200px) {
.rightPanel {position: relative;}
.inboxLogo {display: none !important;}
.closeInbox {display: none !important;}
}

@media (max-width: 1200px) {
.rightPanel {position: absolute;top: -var(--px2);right: var(--px2);z-index: 15;}
.inboxLogo {display: flex;}
.closeInbox {display: flex;}
}

/* Need remove class    */
.bxlrp{padding:0vh var(--px2) 0vh var(--px2);}
.icon{height:24px;cursor: pointer;opacity:0.6;}
.break{word-break: break-all;} /* wb*/
.reciver{
border-radius: 0px 10px 10px 10px;
background: #FFFFFF;
}
.night .reciver{
    background-image: linear-gradient(to bottom,#B2B4C0,#ab9ba1);
}
.sender{
border-radius: 10px 0px 10px 10px;
background: #e3e3f0;
}
.night .sender{
background: #4d5d92;
}

.bg{background-repeat:no-repeat;background-size:cover;background-position:50% 50%;}
.portal .bg1{ background-image: linear-gradient(to top, #f7fffe ,#ffffff);}
.portal{background-image: linear-gradient(to right, #fafeff , #ffffee);}
.bgG{background: #2E7D32}
.bgGls{background:rgba(0,0,0,.6);}
.userImg{
height:45px;
width:45px;
border-radius:50% ;
opacity: 0.8;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.uplift{
padding-bottom:var(--px);
}
.maxHeightMin{max-height:0px;overflow: hidden;}
.maxHeightMax{max-height:1000px;overflow: hidden;}
/* .moveh{
padding:1px;
font-size: 12px;
z-index: 1;
font-weight: 300;
pointer-events: none;
position:absolute;
left:5px;
top:0;
height: auto;
transition: 0.2s;
transition-timing-function: ease;
transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1);
opacity:0.5;
text-transform:capitalize;
} */

.disableSpan{
background:#fafaf6 !important;
padding:0px;
left: 7px;
}

.asterisk{
color: #f44336;
right: -2px;
opacity: 1 !important;
left: unset;
padding: 10px 5px 10px 5px;
font-size: 15px;
}
#myProgress {
width: 100%;
background-color: #ddd;
}

#myBar {
width: 10%;
height: 30px;
background-color: rgb(69, 159, 237);
text-align: center;
line-height: 30px;
color: white;
}
.progress-bar-striped {
background-image: linear-gradient(45deg,rgba(255,255,255,.15) 25%,transparent 25%,transparent 50%,rgba(255,255,255,.15) 50%,rgba(255,255,255,.15) 75%,transparent 75%,transparent);
background-size: 17px 17px;
}
.progress-bar-animated {
-webkit-animation: progress-bar-stripes 1s linear infinite;
animation: progress-bar-stripes 1s linear infinite;
}
.progress-bar{transition: width .6s ease;}

.parContainer {
-webkit-perspective: 1000;
perspective: 1000;
}

.parContainer:hover .parent{
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
}

.parContainer, .parent, .frontView, .backView {
width: 100%;
height: 100%;
}

.parent {
-webkit-transition: 0.3s;
-webkit-transform-style: preserve-3d;
transition: 0.3s;
transform-style: preserve-3d;
position: relative;
}

.padding{ padding:var(--px);}
.child{opacity: 0;}
.parent:hover .child{opacity: 1;}
.filterSubHeading{font-size: 11px}
.cardMsg:hover .child{opacity: 1;}

/* @media (max-width: 1200px){
    body, html {--px: 3px; --px1: 6px; --scale: 1; --px2: 8px;--font:0.8;--bar:3.5px}
    }
    @media screen and (min-width: 1201px) and (max-width: 1365px){
        body, html {--px: 5px; --px1: 10px; --scale: 1;--px2: 10.96px; --font:0.9;--bar:3.5px}
    }
    @media screen and (min-width: 1366px) and (max-width: 1600px){
        body, html {--px: 5px; --px1: 10px; --scale: 1;--px2: 11.81px; --font:1;--bar:4px}
    }
    @media screen and (min-width: 1601px) {
        body, html {--px: 6px; --px1: 12px; --scale: 1;--px2: 13.5px; --font:1.1;--bar:4px}
    } */
    .emoji-mart {
        font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", sans-serif;
        font-size: 16px;
        display: inline-block;
        color: #222427;
        border: 0px solid #d9d9d9;
        border-top:1px solid #d9d9d9 ;
        border-radius: 5px;
        background: #fff;
        width: 100% !important;
      }
      .emoji-mart-search-icon {
        position: absolute;
        top: 3px;
        right: 11px;
        z-index: 2;
        padding: 2px 5px 1px;
        border: none;
        background: none;
        margin-top: 4px;
    }
    .emoji-mart-category-label {
        z-index: 2;
        position: relative;
        position: sticky;
        top: 0;
        font-size: calc(15px * var(--font));
        font-weight: 400 !important;
    }
    
    .emoji-mart-scroll {
        height: 155px;
    }
    .emoji-mart-preview {
        display: none;
    }
    .addcircle{
        background: var(--irisPurple);
    }

@media (max-width: 1420px){
    body, html {--scale1:0.9;--scale: 0.9;--font:0.9;--btn:33px;--px: 5px; --px1: 10px;--px2: 10.96px;--px3:12px;--px4:15px;--bar:3.5px} .bigSvgIcon{height:calc(90px * var(--scale));width: calc(90px * var(--scale))};
}
@media screen and (min-width: 1421px) and (max-width: 1650px){
    body, html {--scale1:1.17647059;--scale: 1;--font:1;--btn:39px;--px: 5px; --px1: 10px;--px2: 11.81px;--px3:15px;--px4:20px;--bar:4px}
}
@media screen and (min-width: 1651px){
    body, html {--scale1:1.17647059;--scale: 1;--font:1.1;--btn:39px;--px: 6px; --px1: 12px;--px2: 13.5px;--px3:15px;--px4:20px;--bar:4px}
}

.leftSection{width: 19.5%;}
.secondleftSection{width: calc(calc(255px * var(--scale1)) + var(--px3));padding: 0px 0px 0px var(--px3);}
.rightPanel{ width:19.5%;overflow: hidden;}
.middleF{width: 100;}
.middleM{width:80.5%}
.middleS{width:61%}
.tooltip .tooltip-inner{
    position: relative !important;
    z-index: 9999 !important;
    background-color:var(--purple) ;
   
}
.tooltip .tooltip-inner .scrolled{
    display: none;
   
}
@keyframes delayedFadeIn {
    0% {display: none;}
    99% {display: none;} /* Set this to 99% for no fade-in. */
    100% {display: block;}
    }

.tooltip {
    z-index: 99999999 !important;
}
.tooltip > div {
    animation-name: delayedFadeIn;
    animation-duration: 0.5s; /* Adjust this duration */
    }

.tooltip .arrow::before{
    border-top-color:var(--purple);

}
.ngb-dp-week-number, .ngb-dp-weekday{
    font-style: normal !important;
}
.ngb-dp-day{
    font-size: 0.8rem !important;
} 
.bggray{
    background-image: linear-gradient(to bottom,#B2B4C0,#ab9ba1);
}
.bgLightGray{
    background-color: #FAFAFA;
}
.bgWhite{
    background-color: white;
}   
.card {
    /* Add shadows to create the "card" effect */
    box-shadow: 0px 1px 4px 0px rgba(0,0,0,0.2);
    transition: 0.3s;
  }
  .cardMsg {
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
  transition: 0.3s;
  }

  /* On mouse-over, add a deeper shadow */
  .card:hover {
    box-shadow: 0px 3px 8px 0px rgba(0,0,0,0.2);
  }


@media (max-width: 1200px){
    body, html {--bar:3.5px;--scaleb:0.9}
    .sectext{font-size: 11px;}
    .heading{font-size: 14px;}
    .subHeading{font-size: 13px;}
    .bigHeading{font-size: 15px;}
    .persona{height:38px; width:38px;}
    .filteropt{  height: 33px;width: 33px;}
    .filterSubHeading{font-size: 10px}
    .svgsmall{ height: 18px; }
    .logo{height:21px;}
    .timestamp {font-size: 8px;}
    .countercircle{width: 17px;height: 17px;font-size: 9px;}
    .detailoption{width: 36px;height: 36px;}
    .filterbtnheight{height: 27px;}
    .conheight{height: 58px;}
    .svgbig{height: 24px;}
    .counter{font-size: 8px;}
    .svgmedium{height: 16px!important;}
    .svgextrasmall{height: 13px;}
    .addcircle{height: 21px ;width: 21px;}
    .mediumcircle{height: 29px;width: 29px;}
    .divsmall{height: 36px;}
    .smalltext{font-size: 10px;}
    /* .menubar{height:46.41px} */
    .menubarRemains{height: calc(100% - 46.41px);}
    .extraBigHeading{font-size: 19px;}
    .extraMediumHeading{font-size: 16px;}
    .minSquareScale{height: 66px; width: 69px;}
    .maxsquareScale{height: 100px; width: 97px;}
    .svgcircleScale{height: 190px; width: 190px;}
    .svgMediumCircle{height: 170px;width: 170px;}
    .bigCircleScale{height: 85px; width: 85px;}
    .minRectScale{height: 70px; width: 159px;}
    .mediumRectScale{height: 70px; width: 161px;}
    .mediumHeading{font-size: 16px;}
    .propRectScale{height: 92px;width: 208px;}
}
@media screen and (min-width: 1201px) and (max-width: 1300px){
    body, html {--bar:3.5px;--scaleb:0.9}
    .sectext{font-size: 12px;}
    .heading{font-size: 15px;}
    .subHeading{font-size: 14px;}
    .bigHeading{font-size: 16px;}
    .persona{ height:39px; width:39px; }
    .filteropt{ height: 34px; width: 34px; }
    .filterSubHeading{font-size: 10px}
    .svgsmall{ height: 18px !important;  }
    .logo{height:21px;}
    .timestamp {font-size: 8px;}
    .countercircle{width: 16px;height: 16px;}
    .detailoption{width: 37px;height: 37px;}
    .filterbtnheight{height: 29px;}
    .conheight{height: 62px;}
    .svgbig{height: 24px;}
    .counter{font-size: 9px;}
    .svgmedium{height: 16.5px!important;}
    .svgextrasmall{height: 13px;}
    .addcircle{height: 21px ;width: 21px;}
    .selectwidth{width: 65px;}
    .mediumcircle{height: 30px;width: 30px;}
    .divsmall{height: 36px;}
    .smalltext{font-size: 10px;}
    /* .menubar{height:47.41px} */
    .menubarRemains{height: calc(100% - 47.41px);}
    .extraBigHeading{font-size: 20px;}
    .extraMediumHeading{font-size: 17px;}
    .minSquareScale{height: 68px; width: 71px;}
    .maxsquareScale{height: 105px; width: 102px;}
    .svgcircleScale{height: 220px; width: 220px;}
    .svgMediumCircle{height: 180px;width: 180px;}
    .bigCircleScale{height: 95px; width: 95px;}
    .minRectScale{height: 70px; width: 159px;}
    .mediumRectScale{height: 70px; width: 161px;}
    .mediumHeading{font-size: 16px;}
    .propRectScale{height: 98px;width: 218px;}

}

@media screen and (min-width: 1301px) and (max-width: 1400px){
    body, html {--bar:3.5px;--scaleb:0.9}
    .sectext{font-size: 12px;}
    .heading{font-size: 14px;}
    .subHeading{font-size: 13px;}
    .bigHeading{font-size: 15px;}
    .persona{height:41px; width:41px;}
    .filteropt{height: 35px;width: 35px;}
    .filterSubHeading{font-size: 10px}
    .svgsmall{height: 19px;}
    .logo{height:21px;}
    .timestamp {font-size: 8.5px;}
    .countercircle{width: 17px;height: 17px;font-size: 9px;}
    .detailoption{width: 38px;height: 38px;}
    .filterbtnheight{height: 33px;}
    .conheight{height: 65px;}
    .svgbig{height: 26px;}
    .counter{font-size: 10px;}
    .svgmedium{height: 17px!important;}
    .svgextrasmall{height: 14px;}
    .addcircle{height: 21px ;width: 21px;}
    .mediumcircle{height: 31px;width: 31px;}
    .divsmall{height: 37px;}
    .smalltext{font-size: 10.5px;}
    /* .menubar{height:48.41px} */
    .menubarRemains{height: calc(100% - 48.41px);}
    .extraBigHeading{font-size: 20.5px;}
    .extraMediumHeading{font-size: 18px;}
    .minSquareScale{height: 70px; width: 73px;}
    .maxsquareScale{height: 108px; width: 105px;}
    .svgcircleScale{height: 240px; width: 240px;}
    .svgMediumCircle{height: 190px;width: 190px;}
    .bigCircleScale{height: 105px; width: 105px;}
    .minRectScale{height: 70px; width: 162px;}
    .mediumRectScale{height: 70px; width: 165px;}
    .mediumHeading{font-size: 16px;}
    .propRectScale{height: 102px;width: 220px;}
}

@media screen and (min-width: 1401px) and (max-width: 1500px){
    body, html {--bar:4px;--scaleb:0.92}
    .sectext{font-size: 13px;}
    .heading{font-size: 15px;}
    .subHeading{font-size: 14px;}
    .bigHeading{font-size: 16px;}
    .persona{height:43px;width:43px;}
    .filteropt{height: 37px;width: 37px;}
    .filterSubHeading{font-size: 11px}
    .svgsmall{height: 20px;}
    .logo{height:22px;}
    .timestamp {font-size: 9px;}
    .countercircle{width: 18px;height: 18px;font-size: 18px;}
    .detailoption{width: 39px;height: 39px;}
    .filterbtnheight{height: 34px;}
    .conheight{height: 68px;}
    .svgbig{height: 28px;}
    .counter{font-size: 11px;}
    .svgmedium{height: 18px!important;}
    .svgextrasmall{height: 13px;}
    .svgextrasmall{height: 15px;}
    .addcircle{height:23px ;width: 23px;}
    .mediumcircle{height: 32px;width: 32px;}
    .divsmall{height: 38px;}
    .smalltext{font-size: 11px;}
    /* .menubar{height:50px} */
    .menubarRemains{height: calc(100% - 50px);}
    .extraBigHeading{font-size: 21px;}
    .extraMediumHeading{font-size: 19px;}
    .minSquareScale{height: 72px; width: 75px;}
    .maxsquareScale{height: 117px; width: 115px;}
    .svgcircleScale{height: 250px; width: 250px;}
    .svgMediumCircle{height: 200px;width: 200px;}
    .bigCircleScale{height: 110px; width: 110px;}
    .minRectScale{height: 72px; width: 163px;}
    .mediumRectScale{height: 72px; width: 166px;}
    .mediumHeading{font-size: 17px;}
    .propRectScale{height: 102px;width: 225px;}

}

@media screen and (min-width: 1501px) and (max-width: 1600px){
    body, html {--bar:4.5px;--scaleb:0.94}
    .sectext{font-size: 14px;}
    .heading{font-size: 16px;}
    .subHeading{font-size: 15px;}
    .bigHeading{font-size: 17px;}
    .persona{height:45px;width:45px; }
    .filteropt{  height: 39px; width: 39px;}
    .filterSubHeading{font-size: 13px}
    .svgsmall{height: 21px; }
    .logo{height:23.5px}
    .timestamp {font-size: 9.5px;}
    .countercircle{width: 19px;height: 19px;}
    .detailoption{width: 40px;height: 40px;}
    .filterbtnheight{height: 35px;}
    .conheight{height: 70px;}
    .svgbig{height: 30px;}
    .counter{font-size: 12px;}
    .svgmedium{height: 19px!important;}
    .svgextrasmall{height: 16px;}
    .addcircle{height: 23px ;width: 23px;}
    .mediumcircle{height: 33px;width: 33px;}
    .divsmall{height: 39px;}
    .smalltext{font-size: 12px;}
    /* .menubar{height:51px} */
    .menubarRemains{height: calc(100% - 51px);}
    .extraBigHeading{font-size: 22px;}
    .extraMediumHeading{font-size: 20px;}
    .minSquareScale{height: 78px; width: 84px;}
    .maxsquareScale{height: 124px; width: 121.5px;}
    .svgcircleScale{height: 280px; width: 280px;}
    .svgMediumCircle{height: 210px;width: 210px;}
    .bigCircleScale{height: 130px; width: 130px;}
    .minRectScale{height: 78px; width: 188px;}
    .mediumRectScale{height: 78px; width: 195px;}
    .mediumHeading{font-size: 18px;}
    .propRectScale{height: 106px;width: 253px;}

}

@media screen and (min-width: 1601px) and (max-width: 1700px){
    body, html {--bar:4.5px;--scaleb:0.95}
    .sectext{font-size: 14.5px;}
    .heading{font-size: 16.5px;}
    .subHeading{font-size: 15.5px;}
    .bigHeading{font-size: 17.5px;}
    .persona{height:47px; width:47px;}
    .filteropt{ height: 41px; width: 41px;}
    .filterSubHeading{font-size: 13.5px}
    .svgsmall{height: 22px;}
    .logo{height:25px;}
    .timestamp {font-size: 10px;}
    .countercircle{width: 20px;height: 20px;}
    .detailoption{width: 41px;height: 41px;}
    .filterbtnheight{height: 36px;}
    .conheight{height: 71px;}
    .svgbig{height: 31px;}
    .counter{font-size: 12px;}
    .svgmedium{height: 20px!important;}
    .svgextrasmall{height: 17px;}
    .addcircle{height: 25px ;width: 25px;}
    .mediumcircle{height: 34px;width: 34px;}
    .divsmall{height: 40px;}
    .smalltext{font-size: 12.5px;}
    /* .menubar{height:51px} */
    .menubarRemains{height: calc(100% - 51px);}
    .extraBigHeading{font-size: 22.5px;}
    .extraMediumHeading{font-size: 21px;}
    .minSquareScale{height: 80px; width: 86px;}
    .maxsquareScale{height: 133px; width: 130px;}
    .svgcircleScale{height: 290px; width: 290px;}
    .svgMediumCircle{height: 220px;width: 220px;}
    .bigCircleScale{height: 135px; width: 135px;}
    .minRectScale{height: 80px; width: 190px;}
    .mediumRectScale{height: 80px; width: 197px;}
    .mediumHeading{font-size: 19px;}
    .propRectScale{height: 112px;width: 270px;}

}

@media screen and (min-width: 1701px) and (max-width: 1800px){
    body, html {--bar:5px;--scaleb:0.96}
    .sectext{font-size: 15px;}
    .heading{font-size: 17px;}
    .subHeading{font-size: 16px;}
    .bigHeading{font-size: 18px;}
    .persona{ height:49px; width:49px;}
    .filteropt{ height: 43px; width: 43px;}
    .filterSubHeading{font-size: 14px}
    .svgsmall{height: 23px;}
    .logo{height:26.5px}
    .timestamp {font-size: 10.5px;}
    .countercircle{width: 21px;height: 21px;}
    .detailoption{width: 42px;height: 42px;}
    .filterbtnheight{height: 37px;}
    .conheight{height: 73px;}
    .svgbig{height: 32px;}
    .counter{font-size: 13px;}
    .svgmedium{height: 21px!important;}
    .svgextrasmall{height: 17px;}
    .addcircle{height: 25px ;width: 25px;}
    .mediumcircle{height: 35px;width: 35px;}
    .divsmall{height: 41px;}
    .smalltext{font-size: 13.5px;}
    /* .menubar{height:52px} */
    .menubarRemains{height: calc(100% - 52px);}
    .extraBigHeading{font-size: 23px;}
     .extraMediumHeading{font-size: 22px;}
    .minSquareScale{height: 87px; width: 92px;}
    .maxsquareScale{height: 135px; width: 132px;}
    .svgcircleScale{height: 300px; width: 300px;}
    .svgMediumCircle{height: 230px;width: 230px;}
    .bigCircleScale{height: 140px; width: 140px;}
    .minRectScale{height: 87px; width: 198px;}
    .mediumRectScale{height: 87px; width: 205px;}
    .mediumHeading{font-size: 20px;}
    .propRectScale{height: 118px;width: 278px;}

}

@media screen and (min-width: 1801px) and (max-width: 1900px){
    body, html {--bar:5px;--scaleb:0.98}
    .sectext{font-size: 16px;}
    .heading{font-size: 18px;}
    .subHeading{font-size: 17px;}
    .bigHeading{font-size: 19px;}
    .persona{ height:51px;width:51px; }
    .filteropt{height: 45px;width: 45px; }
    .filterSubHeading{font-size: 14px}
    .svgsmall{height: 24px;}
    .logo{height:28px;}
    .timestamp {font-size: 11px;}
    .countercircle{width: 21.5px;height: 21.5px;}
    .detailoption{width: 44px;height: 44px;}
    .filterbtnheight{height: 38px;}
    .conheight{height: 75px;}
    .svgbig{height: 32px;}
    .counter{font-size: 13px;}
    .svgmedium{height: 22px!important;}
    .svgextrasmall{height: 18px;}
    .addcircle{height: 25px ;width: 25px;}
    .mediumcircle{height: 36px;width: 36px;}
    .divsmall{height: 42px;}
    .smalltext{font-size: 14px;}
    /* .menubar{height:52px} */
    .menubarRemains{height: calc(100% - 52px);}
    .extraBigHeading{font-size: 23.5px;}
    .extraMediumHeading{font-size: 23px;}
    .minSquareScale{height: 103px; width: 107px;}
    .maxsquareScale{height: 160px; width: 153px;}
    .svgcircleScale{height: 340px; width: 340px;}
    .svgMediumCircle{height: 240px;width: 240px;}
    .bigCircleScale{height: 150px; width: 150px;}
    .minRectScale{height: 103px; width: 231px;}
    .mediumRectScale{height: 103px; width: 241px;}
    .mediumHeading{font-size: 21px;}
    .propRectScale{height: 126px;width: 320px;}

}
@media screen and (min-width: 1901px) {
    body, html {--bar:5px;--scaleb:1.1}
    .sectext{font-size: 17px;}
    .heading{font-size: 19px;}
    .subHeading{font-size: 18px;}
    .bigHeading{font-size: 20px;}
    .persona{height:53px;  width:53px;}
    .filteropt{height: 47px; width: 47px;}
    .filterSubHeading{font-size: 15px}
    .svgsmall{ height: 25px; }
    .logo{height:29.5px;}
    .timestamp {font-size: 12px;}
    .countercircle{width: 22px;height: 22px;}
    .detailoption{width: 45px;height: 45px;}
    .filterbtnheight{height: 39px;}
    .conheight{height: 76px;}
    .svgbig{height: 34px;}
    .counter{font-size: 14px;}
    .svgmedium{height: 23px!important;}
    .svgextrasmall{height: 19px;}
    .addcircle{height: 27px ;width: 27px;}
    .mediumcircle{height: 37px;width: 37px;}
    .divsmall{height: 43px;}
    .smalltext{font-size: 14.5px;}
    /* .menubar{height:52px} */
    .menubarRemains{height: calc(100% - 52px);}
    .extraBigHeading{font-size: 24px;}
    .extraMediumHeading{font-size: 24px;}
    .minSquareScale{height: 107px; width: 111px;}
    .maxsquareScale{height: 162px; width: 155px;}
    .svgcircleScale{height: 350px; width: 350px;}
    .svgMediumCircle{height: 250px;width: 250px;}
    .bigCircleScale{height: 155px; width: 155px;}
    .minRectScale{height: 107px; width: 238px;}
    .mediumRectScale{height: 107px; width: 251px;}
    .mediumHeading{font-size: 22px;}
    .propRectScale{height: 126px;width: 320px;}
}