html, body {
    overflow: hidden;
    user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
body {
    line-height:0;font-size:18px;
}

label {
    cursor: default !important;
}

div, span {
    cursor: default;
}
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
    -webkit-border-radius:4px !important;
    -moz-border-radius:4px !important;
    border-radius:4px !important;
}
textarea:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="time"]:focus,
input[type="week"]:focus,
input[type="number"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="color"]:focus,
.uneditable-input:focus {
	border:2px solid #1b4a74;
}
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus
input:-webkit-autofill, 
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
	transition: background-color 5000s ease-in-out 0s;
	-webkit-text-fill-color: #444 !important;
}
option {
    width:50px !important;
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    display:none;
    margin: 0;
}
input::-webkit-input-placeholder {
    color: #FFF;
}

input:-moz-placeholder { /* Firefox 18- */
    color: #FFF;
}

input::-moz-placeholder {  /* Firefox 19+ */
    color: #FFF;
}

input:-ms-input-placeholder {
    color: #FFF;
}

a:hover {
    text-decoration:none;
}

a {
	color: #2F85C5;
}

.highlighted {

}
.selected {
    background: #2F85C5 !important;
}
.selected > a {
    color: #333 !important;
}
.noaccess {cursor:default;}
.customPopup {background:#edecec !important;padding:2px !important; border-radius:0 !important;}
.sidebar .action-image {
    height: 12vh;
    width: auto;
    position: absolute;
    width: 6vw;
    left: 0.5vw;
    z-index:9;
}

.sidebar .back-image {
    width: 95px;
    height: 95px;
    position: absolute;
    top: 46px;
    left: 21px;
    z-index:9;
}

.sidebar .edit-image {
    top: 16vh;
}

.history-reporting-icon {
    height:12.5vh;
    width: auto;
    position: absolute;
    width: 6vw;
}
.history-reporting-report {
    top: 15vh;
}

.history-reporting-refine {
    width: auto;
    position: absolute;
    width: 6vw;
    top: 27vh;
    left: 0.5vw;
}

.history-reporting-search {
  width: auto;
  position: absolute;
  width: 6vw;
  top: 40.5vh;
  left: 0.5vw;
}
.history-reporting-graph,
.history-reporting-report  {
  width: auto;
  position: absolute;
  width: 6vw;
  top: 54.5vh;
  left: 0.5vw;
}
.history-reporting-save {
  width: auto;
  position: absolute;
  width: 6vw;
  top: 68vh;
  left: 0.5vw;
}
.history-reporting-print {
  width: auto;
  position: absolute;
  width: 6vw;
  top: 82.5vh;
  left: 0.5vw;
}

.sidebar div a.ui-link img.save-image {
    height: 13vh;
    position: absolute;
    width: 6vw;
    top: 19vh;
    left: 0.5vw;
    z-index:999;
}

.save-image, .save-image img {
    height: 13vh;
    width: 6vw;
}

.black-box{
    border: 4px solid #000;
    padding: 20px;
}

.white-box {
    background-color: #000; /* old */
		background-color: transparent; 
    border: 4px solid #FFF; /* old */
		border: none;
}

#loadingAnimation {
    position: absolute;
    z-index: 997;
    background: url(/img/broken-ring-transparent.GIF) no-repeat;
    height: 180px;
    width: 180px;
}

.main-box {
    display: inline;
    position: absolute;
    width: 1870px;
    height: 910px;
    left: 30px;
    top: 50px;
}

#alerttypesSetup div.main-box {float:left;}

.pageContent .main-box {
    width: 1780px;
    height: 875px;
    left: 142px;
    top: 16px;
    box-sizing: border-box;
    padding:10px;
}

.menuBarIcon {
    /* For Opera and <= IE9, we need to add unselectable="on" attribute onto each element */
    /* Check this site for more details: http://help.dottoro.com/lhwdpnva.php */
    -moz-user-select: none; /* These user-select properties are inheritable, used to prevent text selection */
    -webkit-user-select: none;
    -ms-user-select: none; /* From IE10 only */
    user-select: none; /* Not valid CSS yet, as of July 2012 */

    -webkit-user-drag: none; /* Prevents dragging of images/divs etc */
    user-drag: none;
}

.callScreenRow {
	position: relative;
    z-index: 2;
    height: 60px;
    margin-top: 20px;
}
.call-timer {
    float: right;
    width: 2vw;
    text-align:right;
}
#callScreenList {
    height:auto;
    padding:0px 0px 0px 20px;
    overflow:hidden;
    width:1880px;
}
.callScreenRow, .callScreenRow div, .callScreenDetailsRow .button {
	cursor:pointer;
}
.callScreenDetailsRow .button.disabled {
	cursor:initial;
}
.callScreenRow .call-description {
    float: left;
    padding-left: 30px;
    width: 1560px !important;
    text-overflow: clip;
    overflow: hidden;
    white-space: nowrap;
    letter-spacing:1px;
    font-size:50px;
    font-weight:bold;
}
.callScreenRow {
  	line-height: 90px;
  	height: 90px;
  	margin: 15px 0px;
}
.callScreenRow .color-indicator {
	width:22px;
	height:100%;
}
.call-timer {
  	padding-right: 30px;
  	margin: 0 !important;
  	width: 200px !important;
  	font-size:45px;
  	font-weight:bold;
  	text-overflow:clip;
}
.callScreenDetailsRow {
	clear:both;
	display:table-cell;
	width:1810px;
	padding:0px 30px;
	line-height:32px;
	font-size:24px;
	color:#707070;
}
.callScreenDetailsRow .row-fluid {
	margin-top:5px;
}
.callScreenDetailsRow .row-fluid.hr {
    height:1px;
    margin-bottom:20px;
    margin-top:0px !important;
}
.callScreenDetailsRow img {
	max-height:240px;
}
.callScreenDetailsRow .button_container {
	height:85px;
	text-align:right;
}
.callScreenDetailsRow .button {
	width:260px;
	height:80px;
    line-height:80px;
	display:inline-block;
	text-align:center;
	border-radius:10px;
	color:#fff;
	font-size:28px;
    font-weight:bold;
}
.callScreenDetailsRow #call_back.button {
	background: linear-gradient(#40B992, #007661);
}
.callScreenDetailsRow #end_call.button {
	background: linear-gradient(#EA360C, #BD0101);
}
.callScreenDetailsRow #cancel_call.button {
	background: linear-gradient(#F5A22A, #E36F07);
}
.callScreenDetailsRow #workflow.button {
	background: linear-gradient(#59B3EC, #1661A7);
}
.callScreenDetailsRow #play_live_video.button {
	background: linear-gradient(#792291, #950BA8);
}
.callScreenDetailsRow #play_event_video.button {
	background: linear-gradient(#A16A12, #7E5F35);
}
.callScreenDetailsRow .button.disabled {
	background:#ccc !important;
    color:#fff !important;
}
.callScreenDetailsRow .button img {
 	height: 70px;
    margin: 5px 5px 0px 8px;
}
.multisection-container {
    height: 91vh;
}
.greybox {
    background-color: #CACACA;
}
.light-greybox {
    background-color: #E5E5E5;
}
.yellowborder-box {
    border: 1px solid #fbfd98;
		background: transparent;
}
.whiteborder-box {
    border: 1px solid #fff;
	background: transparent;
}
.sub-box {
    height: 85vh;
    background-color:#FFF;
    padding:0;
}
.sub-box-head {
    background-color : transparent;
    box-sizing:border-box;
    height:55px;
    line-height:30px;
    text-align:center;
    text-transform: uppercase;
    text-shadow: none;
    width:100%;
}
span.sub-box-head {
    display: block;
    padding: 3% 0%;
}
.sub-box [class*="span"] {
    background-color: #FFF;
}
.sub-box-content {
    height: 74.5vh;
    padding-left:1vw;
    overflow-y: auto;
    -webkit-transform: translate3d(0,0,0);
}
.sub-box .span3 {
    width: 24%;
    margin-left: 1%;
}
.sub-box table {
    width: 100%;
}
.sub-box table thead {
    border : none;
    background-color: transparent;
}
.sub-box table thead th {
    text-transform: uppercase;
    text-shadow: none;
    text-align: center;
    height: 7vh;
}
.sub-box .two-col {
    width: 49%;
    float: left;
}
.sub-box .two-col.right-col {
    width: 50.84%;
    border-left:1px solid #FFF;
}
.sub-box .four-col {
    width: 24%;
    float: left;
    margin-right:1%;
}
.sub-box .five-col {
    width: 19.5%;
    float: left;
    margin-right: 3px;
}
.jspScrollable .five-col {
    margin-right: 1%;
}
.jspScrollable .row-fluid .five-col:last-child {
    margin-right: -2.5% !important;
}
#site_setup_icons_div .sub-box-content {
    padding-left: 0;
}
.tab-pane .sub-box-content {
    height: 62vh;
}

.button-controls a img {
    height: 11vh;
    width: 5.5vw;
}

.sidebar {
    float:left;left: 2%;height:100%; margin-top: 24px;
}
.sidebar .row {
    margin-left: -2vw;
}

.sidebar div {
    width: 5vw;
}


img.side-header {
    height: 745px;
    position: absolute;
    top: 160px;
    left: 0px;
    width: 134px;
}
.jqtree-element {
    line-height: 15px;
}
.jqtree-element img.mainIcon {
    height: 35px;
    width: 35px;
    margin-right: 20px;
}
.jqtree_common a.deleteLink {
    background-color: #6adeff;
    padding-top: 4px;
    height: 45px;
    width:35px;
    position: absolute;
    right: 10;
}
.jqtree-tree .ui-droppable, .jqtree_common {
    height:auto;
    min-height:30px;
    display:inline-block;
}
.jqtree_common a.deleteLink img.actionIcon {
    height: 40px;
    width: 40px;
}
span .ui-draggable {
    height: auto;
    width: 100%;
}

.ui-draggable img, .ui-droppable img {
    height: 50px;
    width: 50px;
}

input[type="text"], input[type="text"]:focus,
input[type="password"], input[type="password"]:focus{
    outline: none; box-shadow:none;
    -ms-box-shadow:none;
}
input.wide, select.wide {
    width:150px !important;
}
input.wider, select.wider {
    width:500px !important;
}
input.full-width, select.full-width {
    width: 100% !important;
}
input.no-max-width, select.no-max-width {
    max-width: none !important;
}
ul.customdropdown li {
    cursor:pointer;
    padding: 3px 20px;
    white-space:nowrap;
}
input.digitInput {
    width: 60px !important;
}

input.underlined {
    height: auto;
    background-color: transparent !important;
    border:0 !important;
    border-bottom: 3px solid #FFF !important;
    border-radius: 0 !important;
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    color: #FFF !important;
    font-size: 3vmin;
    font-size: 3vm;
    height: 4vh !important;
    min-height: 3vh;
}
.bold {
    font-weight: bolder;
}
.row-thin {
    height: 35px !important;
    min-height: 35px;
}
.row-thin div {
    height: 35px !important;
    min-height: 35px;
}
.row-thin div input[type="text"] {
    margin-bottom: 0;
}

div.text-right,span.text-right,label.text-right {
    text-align:right;
}
div.text-center,span.text-center,label.text-center {
    text-align: center !important;
}

/*.form-signin input[type="text"],
.form-signin input[type="password"] {
    color: #ffffff;
    border: none;
    background-color: transparent;
    font-weight:bold;
    font-family: Arial;
    font-size: 3vmin;
    width: 19vw !important;
    height: 5vh;
    min-height: 3vh;
    margin: 0 auto;
    margin-top: 1vh;
    margin-bottom: 1vh;
}

.form-signin div div.input-holder {
    margin-top: 6vh;
    margin-left: auto;
    margin-right: auto;
    width: 22vw;
}

div.input-holder {
    background: url(/img/Bar%20EG.png);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    height: 8vh;
    width: 20vw;
    margin: 0 auto;
}
div.input-holder input[type="text"] {
    background: none;
    border: none;
    width: 100%;
}    */
input[type="text"], input[type="password"] {
    border:2px solid #1b4a74; background:transparent;
}
input[type="text"]::-webkit-input-placeholder, input[type="password"]::-webkit-input-placeholder {
    color: #666;
}

input[type="text"]:-ms-input-placeholder, input[type="password"]:-ms-input-placeholder {
    color: #666;
}
.form-actions{
    padding: 5px 12px;
}

#login-form-container {
    margin-top: 3%;
}

img.loginHeaderImage {
    width: 30.5vw;
    height: 12vh;
}

/*New Class: centered text in header*/
.nav.nav-center {
    display: inline-block;
    left: 0;
    right: 0;
    margin: 0;
    float: none;
    font-size: 2em;
}

/* Formatting header*/
#header {
    position:absolute;
    top:0px;
    left:0px;
    width:1920px;
    height:60px;
    margin-left:auto;
    margin-right:auto;
    text-align:center;    
    cursor:default;
    font-weight:bold;
    z-index:1;
}
#header .shiftName, #header .shiftName label {
    margin: 0px;
    padding: 0px;
    position: absolute;
    left: 1635px;
    top: 49px;
    width: 185px;
    height: 33px;
    text-align: left;
    z-index: 10;
}
#header > ul > li {
    color: #FFFFFF;
    float: none;
}
#footer_container {
	position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px; /* adjust as needed */
    display: flex;
    align-items: center;
    width: 100%;
    height: 158px;
    z-index: 2;
}
#footer_logo_container {
	flex-shrink: 0;
  	padding-left: 20px;
  	padding-right: 20px;
}
#footer_logo_container img#footer_img_logo {
	width: 546px;
    height: 80px;
}
.footer-icon {
    margin: 0;
    padding: 0;
    /*position: absolute;*/
    /*top:925px;*/
    /*width:220px;*/
    height:160px;
    text-align: left;
    z-index: 9;
}
.footer-icon a img {
    height: 160px;
    width: 220px;
    cursor: pointer;
}

#footer_icons_container {
  flex-grow: 1;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  margin-top: 10px; /* adjust spacing as needed */
}

#footerLogoutImage.loggedOut {
	
}

#jclock_date {
    position:absolute;
    top:0px;
    left:0px;
    width:200px;
    height:60px;
    line-height:60px;
	padding-left:20px;
    vertical-align:middle;
    text-align:left;
    font-size:34px;
}

#jclock_time {
	display:inline-block;
	position:relative;
	text-align:center;
	padding:0px;
    width:1520px;
    height:60px;
    line-height:60px;
    vertical-align:60px;
    font-size: 46px;
}
#header #shiftName {
	position: absolute;
    top:0px;
    right:0px;
    height:60px;
    line-height:60px;
    padding-right:20px;    
    text-align:right;
    vertical-align:middle;
    font-size: 34px;
}

.checkbox {
    width: 1vw;
    height: 2.5vh;
    cursor:pointer;
    background-color: rgb(102, 102, 102);
}
.customCheckbox, .boxedCheckbox {
    display:inline-block; cursor:pointer;
}
.boxedCheckbox {height:30px;width:30px;}
.boxedCheckBg {height:30px;width:30px;margin-bottom:-23px;}
.blackCheckbox .boxedCheckBg {
	background: transparent;
	border: 1px solid #444;
	border-radius: 2px;
}
.boxedCheckBg-disabled {height:20px;width:20px;margin:4px;margin-bottom:-28px;background:#999;}
.boxedCheckbox-disabled {cursor:default;}

.checkbox-disabled {cursor: default; filter: grayscale(100%); color: lightgray !important; pointer-events: none;}

.radiobutton {height:36px;width:36px;background-repeat:no-repeat;}
.radiobutton-on {background:url(/img/radio-on.png);
    background-size: 24px 24px;
    background-position-y: 2px;
    background-repeat:no-repeat;
}
.radiobutton-off {background:url(/img/radio-off.png);
    background-size: 24px 24px;
    background-position-y: 2px;
    background-repeat:no-repeat;
}
.radiobutton-dot {height:16px;width:16px;margin:7px auto;background:#000;border-radius:50%;}

.radioGroup {
	display: flex;
    align-items: center;
    gap: 10px; /* Adjust spacing between radio buttons */
}

.radioGroup input[type="radio"] {
    margin-right: 5px; /* Space between radio button and label text */
    transform: translateY(-3px);
}

.radioGroup label {
	display: flex;
    align-items: center;
    cursor: pointer;
    font-size: 22px;
}

.radioGroup label:first-of-type {
  margin-right: 12px; /* Add gap after first radio button option */
}

#userTypeRadioGroup {
	//
}

.pageContent {
    margin-left:0px;
    margin-right:0px;
    padding:0px !important;
}
/* Bootstrap Footer floats over jquerymobile page. Must make it sticky.*/
#wrap {
    height: 1080px;
    width: 1920px;
}
#footer {
    position: relative;
    margin-top: -100px; /* negative value of footer height */
    height: 100px;
    clear: both;
}
#footer, #footer-inner {
    background-image: none;
    background-color: #666666;
    border-color: #666666;
}
.footer-image {
    height: 75px;
    width: 100%;
}
button.btn-modal {
    font-size: 12px;
    line-height: 15px;
    padding: 4px 8px;
    height: 75px;
    width: 75px;
}
a.page_back_button {
	position: absolute;
    top: 0px;
    left: 0px;
    z-index: 2;
}
div.adminTechSidePanel {
	margin-left: -200px;
	height: 1003px;
    width: 298px;
    border-radius: 0px 0px 298px 0px;
    background: #1B4A74;
}
div.adminTechSidePanelText {
	position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1;
    height: 925px;
    width: 98px;
    line-height: 98px;
    text-align: center;
    writing-mode: tb-rl;
    transform: rotate(-180deg);
    font-size: 44px;
    font-weight: bold;
    letter-spacing: 4px;
    color: #edecec;
}
#adminIframePage {
    width:1930px;
    height:926px;
    min-height:926px !important;
}
#techIframePage {
    width:1930px;
    height:926px;
    min-height:926px !important;
}
#adminIframe,
#techIframe {
    margin: 0px;
    padding: 0px;
    width: 1920px;
    border: 0px;
    height: inherit;
}
#adminIframePageContent, #techIframePageContent {
    padding: 0px;
    height: 925px;
    width: 1925px;
    overflow:hidden;
}
.main-section {

}
#techContent, #adminContent {
    margin-left: 0px;
    margin-right: 0px;
    padding-left: 0px;
    padding-right: 1%;
    padding-top: 0;
    padding-bottom: 0;
}

.menu-items {
    position:absolute;
    width:1680px;
    float:left;
    left:230px;
}

#tech-menu-items.menu-items.showWarning {
    top: 26px;
}

.menu-logo {
    height: 91vh;
    width: 8.5vw;
    max-width:none;
    position:absolute;
    top:3vh;
    left:0.5vw;
}

#techContent .tech-icon-label {
	font-size: 18px;
	font-style: normal;
	color: black;
	margin-top: -6px;
}

#techContent #label-system-settings { color: #C90F04 }
#techContent #label-alert-types { color: #0C826A }
#techContent #label-cancel-calls { color: #4957BA }
#techContent #label-shift-creation { color: #C09701 }
#techContent #label-site-setup { color: #34C2C6 }
#techContent #label-site-groups { color: #359F25 }
#techContent #label-messaging-roster { color: #E87C11 }
#techContent #label-highcare-shifts { color: #EC123B }
#techContent #label-message-integration { color: #56439C }
#techContent #label-high-level-input { color: #BA53D6 }
#techContent #label-create-maps { color: #2573B6 }
#techContent #label-third-party-gateway { color: #698485 }
#techContent #label-system-logs { color: #E246A4 }
#techContent #label-software-management { color: #79A100 }
#techContent #label-rtls-setup { color: #1452A0 }
#techContent #label-system-maintenance { color: #3D3322 }
#techContent #label-logging { color: #1A3654 }

#techContent .home-link.tech-icon {
    text-align: center;
}
#techContent .home-link.tech-icon.noaccess {
    filter: blur(1px);
    pointer-events: none; /* disables clicking the blurred icon */
    opacity: 0.3;         /* make it look “disabled” */
}
#techContent .tech-icon-img {
	height: 120px;
	width: 180px;
	margin-top: 63px;
}
#techContent .home-link {
    height: 113px !important;
    width: 285px !important;
    margin-bottom: 100px;
}
.home-link {
    height: 183px !important;
    width: 285px !important;
    margin-bottom: 100px;
}
.home-link a img {
     height: 183px;
     width: 230px;
     margin-top: 50px;
 }

#scalableChart .kineticjs-content canvas {
    width: 90vw;
    height: 80vh;
}
form {
    margin: 0 !important;
}
a.actionLink {font-size:18px;text-transform:none;font-weight:bold;}
.form-inline a.actionLink img,
a.actionLink img {
    width: 115px;
    height: 142px;
}
a.actionLink img.medium {
    height: 15vh;
    width: 7vw;
}
a.actionLink img.wide {
    height: 6.5vh;
    width: 7vw;
}
a.actionLink-mini img, img.mini {
    height: 5vh;
    width: 2vw;
}

td select, select.small {
    width: 8vw;
    height: 4vh;
}


/* custom dialog styles */

#customDialog, #customAlert, #customWarning {
    max-width:1700px;
    white-space: nowrap;
    min-width: 370px !important;
    width: auto;
    height: auto;
	border: 2px solid #2F85C5;
    position: absolute;
    top: 309px;
    left: 22%;
    z-index: 17999;
    opacity: 1;
    display: block;
}

.popup-dark{top:7% !important;}
#customDialog-inner, #customAlert-inner {
  padding: 20px;
  position: relative;
}

#customWarning .customDialogMessage {font-size:24px;line-height:28px;}
#customWarning h1 {font-weight:bold;margin-top: -5px;}
#customWarning .action-links {width: auto; margin: 0px auto; text-align: center;margin-top: 50px;}
#customWarning-inner {padding:0 100px 20px;position:relative}
#customDialog .popup-content select {
    max-width: 100%;
}
#customDialog .popup-close, #customWarning-inner .popup-close, .popup-close-icon {
  cursor: pointer;
  -webkit-font-smoothing: antialiased;
  font-size: 36px;
  position: absolute !important;
  right: 1px !important;
  top: 1px !important;
  line-height: 22px;
  margin: 0 !important;
}

#customDialog .popup-content input,
.customDialog input {
    margin: 0;
}
.customDialog, .customWarning {
    width: 42vw;
    height: 35vh;
    padding: 1vh 0.5vw;
}
.customDialog-main, .customWarning-main {
    width: 30vw;
    height: 27vh;
    float: left;
    padding: 15px;
    color: #1B4A74;
    font-weight: bold;
}
.customDialog-main .row-fluid, .customWarning-main .row-fluid {
    margin-bottom:4vh;
}
.customDialog-main .row-fluid .value {
    color: #007eff;
    margin-left: 2vw;
}
.customDialog-buttons {
    float:right;
    width: 6vw;
}
.customDialog-buttons img {
    width: 115px;
    height: 118px;
}
.customDialog-main .row-fluid .bootstrap-select {
    width: 220px;
}
.customDialog-main .row-fluid .bootstrap-select.btn-group {
    margin-bottom:0 !important;
}
#customDialog .customDialogMessage {
    line-height:30px;
}
#customAlert .customDialogMessage {
    max-height: 200px;
    overflow-x: hidden;
    overflow-y: auto;
	padding-left: 5px; 
	padding-right: 5px;
	margin-bottom: 30px;
}
.customDialogMessage {
    font-size: 22px;
    font-weight:normal;
    text-align: center;
    text-transform:none;
    width: 100%;
    min-height: 40px;
    height: auto;
    line-height: 40px;
    margin-bottom: 50px;
    padding-top: 20px;
}
.customdialog-bg, .customWarning-bg, .customalert-bg {background:#707070;opacity:0.6;}
.ui-popup-screen.in ~ .customdialog-bg, .ui-popup-screen.in ~ .customWarning-bg, .ui-popup-screen.in ~ .customalert-bg {opacity: 0.4 !important}
.customDialogActionLink {cursor:pointer; margin:0px 15px 10px; display:inline-block;font-size:18px;}
.sub-box-content div.odd, .sub-box table tbody tr.odd, tr.odd {
    background-color: transparent;
}
.sub-box-content div.even, .sub-box table tbody tr.even, tr.even {
    background-color: transparent;
}

.sub-box-content div.odd [class*="span"],
.sub-box-content div.even [class*="span"] {
    background: transparent;
}
.sub-box-content .four-col {
    width:23%;
    padding-left:1%;
}
.ui-popup-container .header {
    width:100%;
    text-align:center;
    margin-top:2vh;
}
.ui-popup select,
.popup-content select {
    width: 4vw;
    height:4vh;
}
.ui-popup label,
.popup-content label,
.ui-popup label.standard-label,
.ui-popup label.medium-label,
.ui-popup label.large-label,
.popup-content label.standard-label,
.popup-content label.medium-label,
.popup-content label.large-label,
.modal label.standard-label,
.modal label.medium-label,
.modal label.large-label,
#customDialog label.standard-label,
#customDialog label.medium-label,
#customDialog label.large-label,
#customWarning label.standard-label,
#customWarning label.medium-label,
#customWarning label.large-label {
    line-height:24px;
    margin-bottom:0;
    display:inline-block;
}
.ui-popup label.standard-label,
.popup-content label.standard-label,
.modal label.standard-label,
#customDialog label.standard-label {
    width:5.5vw;
}
.ui-popup label.medium-label,
.popup-content label.medium-label,
.modal label.medium-label,
#customDialog label.medium-label {
    width:10vw;
    max-height: 6vh;
    line-height: 2vh;
    text-overflow: ellipsis;
    overflow: hidden;
}
.ui-popup label.large-label,
.popup-content label.large-label,
.modal label.large-label,
#customDialog label.large-label {
    width:15vw;
    margin-right:0.5vw;
}
.ui-popup-screen.in {
    opacity:0.85 !important;
}

.popup-content .popup-subsection {
    border-right: 2px solid #6adeff;height: 96%;
}

img.tick {
    width: 30px;
    height: 30px;
    cursor:pointer;
}

p.error, div.error, span.error {
    color:#F00;line-height:3vh;
}

.truncate-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.text-left {text-align:left;}

/* mapping screen styles */
#floor-map {
    height: 804px;width: 1890px; overflow:hidden;margin-left:15px;
}

li.ui-draggable-dragging, span.ui-draggable-dragging {
  list-style:none;
  background:none;
  width:auto;

}
input[disabled], select[disabled], textarea[disabled], input[readonly], select[readonly], textarea[readonly] {cursor:default !important;}

/* helpers */

.mt5 {
	margin-top: 5px !important;
}
.ml0 {
	margin-left: 0px !important;
}
.ml10 {
	margin-left: 10px !important;
}
.ml20 {
	margin-left: 20px !important;
}
.ml40 {
	margin-left: 40px !important;
}
.ml60 {
	margin-left: 60px !important;
}
.mr0 {
	margin-right: 0px !important;
}
.mr20 {
	margin-right: 20px !important;
}
.mr25 {
	margin-right: 25px !important;
}
.mr40 {
	margin-right: 40px !important;
}
.mb15 {
	margin-bottom: 15px !important;
}
.nobor {
	border: none !important;
}
.txt-red {
	color: #C40404 !important;
}
.txt-green {
	color: #21A021 !important;
}
.txt-grey {
	color: #888 !important;
}
.txt-purple {
	color: #d17efd !important;
}
.txt-orange {
    color: #fdd198 !important;
}
.txt-yellow {
    color: #fbfd98 !important;
}
.txt-right {
	text-align: right !important;
}
.fs1 {
	font-size: 20px !important;
}
.fw-normal {
	font-weight: normal !important;
}

.x-icon {
    margin-right: -15px;
    margin-top:-5px;
    line-height: 0;
    float: right;
    font-size: 18px;
    color: #edecec;
    text-decoration: none;
}
.x-icon:hover {
    color: #edecec;
    text-decoration: none;
}

hr {
    border: 2px solid #666;
}

input[type='text']:focus, input[type='password']:focus {
  outline: none;
}
*::-moz-focus-inner {
  border: none;
}

.clickable {
  cursor: pointer;
}

div.blue-border,
form.blue-border {
  box-shadow: 0 0 0 3px #edecec, 0 0 0 5px #2F85C5 !important;
}

.close {
  color: #edecec;
}

input.red-border {
  border: 2px solid #fd9898 !important;
  outline: none !important;
}

::-webkit-scrollbar {
     width: 16px;
 }
::-webkit-scrollbar-track {
    background-color: #fff;
}
::-webkit-scrollbar-thumb {
  background-color: #bbb;
}

a {
  outline: 0 !important;
  font-weight: bold;
}

.footer-screen-display-none-important {
	display: none!important;
}

#customDialog .al-tables-container {
    display: flex;
    justify-content: space-between;
    gap: 20px; /* Spacing between tables */
    height: 100%;
}

#customDialog #al-heading {
    font-weight: bold;
    font-size: 24px;
	text-align: center;
	margin-bottom: 10px;
}

#customDialog .al-table-wrapper {
    flex: 1; /* Equal width */
    min-width: 400px;
    border: 1px solid #ccc;
    padding: 10px;
    height: 100%; 
    display: flex;
    flex-direction: column;
    /* overflow: hidden;  */
}

#customDialog .al-scrollable-table {
    width: 100%;
    display: block;
    max-height: 100%;  /* Adjust height as needed */
    /* overflow-y: auto; */
    border-collapse: collapse;
    flex-grow: 1; /* Makes it take up remaining space inside .al-table-wrapper */
}

#customDialog .al-scrollable-table tbody {
    display: block; /* Allows tbody to scroll independently */
    width: 100%;
    height: 480px;
    overflow-y: auto;
}

#customDialog .al-scrollable-table tr {
    display: flex;
    width: 100%;
}

#customDialog .al-scrollable-table td {
    padding-top: 0px;  
    padding-bottom: 0px;  
    padding-left: 5px;  
    padding-right: 5px;
    width: 376px;
    height: 40px;  /* Ensure each row has a consistent height */
    text-align: center;
}

#customDialog .al-scrollable-table input.user-input {
    padding: 4px 6px;  
    margin-top: 2px;
    margin-bottom: 2px;
    font-size: 20px !important;  
    line-height: 1;  /* Reduced line height */
    width: 100% !important;  
}

#customDialog .al-scrollable-table .al-existing-accounts {
    padding-left: 6px;  
    padding-right: 6px;  
    padding-top: 6px;  
    padding-bottom: 2px;  
    margin-right: 22px;
    margin-left: 26px;
    margin-top: 2px;
    margin-bottom: 2px;
    font-size: 20px;  
    color: #444;
    line-height: 1;  
    height: 26px;
    width: 100%;  
    border: 1px solid #1b4a74;
    border-radius: 4px;
    text-align: left;
}

#customDialog .al-scrollable-table .al-table-heading {
	font-size: 20px;
}

#customDialog #al-content {
	height: 506px; 
}

#customDialog .al-button-row {
	display: flex;
    justify-content: center; /* Centers buttons horizontally */
    align-items: center; /* Centers buttons vertically */
    gap: 128px; /* Space between buttons */
    margin-top: 35px; 
    margin-left: 26px; 
}

/* Add a highlight effect to indicate valid drop targets */
 .al-tables-container .drop-target {
    background-color: #f0f8ff; /* Light blue */
    border: 2px dashed #007bff;
}

/* Visual feedback while dragging */
 .al-tables-container .dragging {
    opacity: 0.5;
    background-color: lightgray;
}

#androidLogoUploadPanel {
	width: 532px;
	height: 396px;
}

#androidLogoUploadPanel #androidLogoUploadTitle {
	padding-left: 30px;
	padding-top: 39px;
	padding-bottom: 2px;
}

#androidLogoUploadPanel #logoInput {
	padding-left: 10px;
	padding-top: 5px;
	margin-bottom: 0px;
	margin-left: 53px;
	border: none !important;
}

#androidLogoUploadPanel #logoInput input[type="file"]::file-selector-button {
  /* Styles for the browse button */
  margin-right: 16px;        /* add horizontal space */
}

#androidLogoUploadPanel #androidLogoUploadPanelCurrentIconContainer {
  text-align: center;
  margin-top: 0px;
}

#androidLogoUploadPanel #androidLogoUploadPanelCurrentIcon {
  width: 200px;
  height: 200px;
  display: inline-block; 
  margin-top: 10px;
  margin-bottom: 10px;
}

#androidLogoUploadPanel #androidLogoUploadPanelButtons {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  width: 100%; /* or a specific width if needed */
  margin-top: 10px;
  margin-bottom: 12px;
}

#androidLogoUploadPanelButtons a {
  text-align: center;
}

#androidScreenSaverUploadPanel {
	width: 642px;
	height: 397px;
}

#androidScreenSaverUploadPanel #androidScreenSaverUploadTitle {
	padding-left: 30px;
	padding-top: 39px;
	padding-bottom: 2px;
}

#androidScreenSaverUploadPanel #screenSaverInput {
	padding-left: 10px;
	padding-top: 5px;
	margin-bottom: 0px;
	margin-left: 53px;
	border: none !important;
}

#androidScreenSaverUploadPanel #screenSaverInput input[type="file"]::file-selector-button {
  /* Styles for the browse button */
  margin-right: 16px;        /* add horizontal space */
}

#androidScreenSaverUploadPanel #androidScreenSaverUploadPanelCurrentImageContainer {
  text-align: center;
  margin-top: 0px;
}

#androidScreenSaverUploadPanel #androidScreenSaverUploadPanelCurrentImage {
  width: 200px;
  height: 200px;
  display: inline-block; 
  margin-top: 10px;
  margin-bottom: 10px;
}

#androidScreenSaverUploadPanel #androidScreenSaverUploadPanelButtons {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  width: 100%; /* or a specific width if needed */
  margin-top: 10px;
  margin-bottom: 12px;
}

#androidScreenSaverUploadPanelButtons a {
  text-align: center;
}

#restoreEncryptionKeyLabel {
	display:inline-block;
	font-size:20px !important; 
	margin-top:10px; 
	margin-bottom:0px !important;
	margin-right:20px;
}

#restoreEncryptionKey {
	font-size:20px !important; 
	margin-top:10px; 
	margin-bottom:0px !important;
	width:200px !important;"
}

/* Password Show/Hide */

#gbl-password input {
	padding-right: 30px; 
}

.gbl-toggle-password {
	position: absolute;
	top: 50%;
	right: 8px;
	transform: translateY(-50%);
	cursor: pointer;
	font-size: 16px;
	color: #666;
}

.gbl-password-toggle-icon {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    z-index: 10;
    opacity: 0.7; /* Slightly dim it so it's not distracting */
    transition: opacity 0.2s, transform 0.1s;
    display: flex;
}
	
.gbl-password-toggle-icon:hover {
    opacity: 1; /* Brighten on hover */
}
	
.gbl-password-toggle-icon:active {
    transform: translateY(-50%) scale(0.9); /* Subtle "click" feel */
}

.gbl-password-toggle-icon svg {
    display: block;
   	pointer-events: none; /* Ensures the click registers on the <span> */
}

.gbl-eye-path {
    transition: d 0.3s ease-in-out;
}

.gbl-popup {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            background-color: rgb(237, 236, 236);
            padding: 20px;
            border-radius: 8px;
            box-shadow: 0 2px 10px #2f85c5;
            min-width: 530px;
            z-index: 1001;
}

.gbl-popup-button-group {
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	width: 100%;
	margin-top: 20px;
	margin-bottom: 2px;
}

.gbl-popup-label-field-div {
	font-size: 18px;
	text-align: center;
	margin-bottom: 10px;
}

h3.gbl-popup-heading,
.gbl-popup-heading {
	text-align: center;
	display: block;
	width: 100%;
	margin-top: 0px;
	margin-bottom: 5px;
	font-size: 24px;
	line-height: 7vh !important;
}

.gbl-popup-label {
	height: 30px;
	line-height: 30px;
	font-size: 18px;
	padding: 0px;
	display: inline-block;
	min-width: 180px;	
	text-align: left;
}

input[type='text'].gbl-popup-field,
input[type='password'].gbl-popup-field,
input[type='number'].gbl-popup-field,
.gbl-popup-field {
	min-width: 300px;
	max-width: 300px;
	height: 34px;
	borderRadius: 3px;
	font-size: 18px;
	line-height: 18px;
	margin: 0 5px 0 0;
	text-align: left;
}

 /* Visual lowercase only (doesn't change actual value) */
  .force-lowercase {
    text-transform: lowercase;
  }