/*******************************Common Styling Starts*********************************/
:root {
	--blue: #0d6efd;
	--indigo: #6610f2;
	--purple: #6f42c1;
	--pink: #d63384;
	--red: #dc3545;
	--orange: #fd7e14;
	--yellow: #ffc107;
	--green: #6dc900;
	--teal: #20c997;
	--cyan: #0dcaf0;
	--white: #fff;
	--gray: #6c757d;
	--gray-dark: #343a40;
	--gray-100: #f8f9fa;
	--gray-200: #e9ecef;
	--gray-300: #dee2e6;
	--gray-400: #ced4da;
	--gray-500: #adb5bd;
	--gray-600: #6c757d;
	--gray-700: #495057;
	--gray-800: #343a40;
	--gray-900: #212529;
	--vilot:#1920a4;
	--lightgreen:#1bbd8d;
	--lightred:#ca213d;
	--lightorange:#de7a1d;
	--primary: #67afab;
	--secondary: #6c757d;
	--success: #198754;
	--info: #0dcaf0;
	--warning: #ffc107;
	--danger: #dc3545;
	--light: #f8f9fa;
	--dark: #212529;
	--primary-rgb: 13, 110, 253;
	--secondary-rgb: 108, 117, 125;
	--success-rgb: 25, 135, 84;
	--info-rgb: 13, 202, 240;
	--warning-rgb: 255, 193, 7;
	--danger-rgb: 220, 53, 69;
	--light-rgb: 248, 249, 250;
	--dark-rgb: 33, 37, 41;
	--white-rgb: 255, 255, 255;
	--black-rgb: 0, 0, 0;
	--body-rgb: 33, 37, 41;
	--system-font: Segoe UI;
	--body-bg:white;
	--solid-border:#d1d1d1;
	--font-normal: nunito;
	--font-medium: nunitoMedium;
	--font-semi-bold: nunitoSemiBold;
	--font-bold: nunitoBold;
	--font-med-italic: robotoMedItalic;
	--font-bold-italic: robotoBoldItalic;
	--body-font-family: var(--font-normal);
	--body-bg-color: var(--body-bg);
	--body-font-size: 1em;
	--body-font-weight: 400;
	--body-line-height: 1.5;
}
*,
::after,
::before {
	box-sizing: border-box
}
*
{
	position:relative;
	margin:0%;
	padding:0%;
	font-family : var(--body-font-family), var(--system-font);
}
html,body
{
	width:100%;
	height:100%;
	overflow:hidden;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	-o-user-select:none;
	user-select:none;
}

@font-face 
{
  font-family: 'nunito';
  font-style: normal;
  font-weight: 400;
  src: url(../fonts/Nunito-Regular.ttf) format('truetype');
}

@font-face 
{
  font-family: 'nunitoMedium';
  font-style: bold;
  src: url(../fonts/Nunito-Medium.ttf) format('truetype');
}

@font-face 
{
  font-family: 'nunitoSemiBold';
  font-style: bold;
  src: url(../fonts/Nunito-SemiBold.ttf) format('truetype');
}

@font-face 
{
  font-family: 'nunitoBold';
  font-style: bold;
  src: url(../fonts/Nunito-Bold.ttf) format('truetype');
}


/***********************************Common Styling Ends*****************************************/
/*************************************Login Page Styling Starts************************************/
.loginBodyDiv
{
	position:absolute;
	top:0%;
	width:100%;
	height:100%;
	background: url(../images/login_bg.png);
    background-repeat: no-repeat;
	background-size:100% 100%;
}
.loginPane
{
	display: flex;
    align-items: center;
    justify-content: center;
    height: 23em;
    width: 32em;
    margin: 8.8em 3em;
    float: right;
    border-radius: 15px;
    background: white;
    box-shadow: 0px 0px 7px 5px #c1c0c0;
}
.loginPaneWrapper
{
	width: 27em;
}
.loginLogo
{
	margin-top: 1.4em;
    height: 5em;
}
.productDef
{
	font: normal 0.9em/1.4 var(--font-medium);
    margin: 2.5em 0;
	text-align: center;
}
.loginBtnWrapper
{
	display: flex;
    align-items: center;
    justify-content: space-around;
    height: 3em;
    width: 100%;
    margin: 2em 0 1.3em 0;
}
.loginBtnDiv
{
    display: flex;
    justify-content: center;
    align-items: center;
	height: 2.3em;
    border-radius: 6px;
    width: 6em;
    color: white;
    background: linear-gradient(to bottom , #04a245  15%, #008838 50%);
	border: solid 1px #008838;
	cursor: pointer;
}

/******************Login Input Div Styling Starts*******************/
.handleWrapper
{
    position: relative;
    height: 2.8em;
    width: 19em;
    border: 0.1em solid #b4bbbf;
    border-radius: 0.5em;
    font: normal 1em var(--font-medium);
    background: white;
}
.placeholderText
{
    position: absolute;
    top: 1em;
    left: 1.6em;
    line-height: 1em;
    padding: 0 0.25em;
    width: auto;
    background: white;
    font-size: 0.85em;
    color: #777777;
    transform: translate(-0.5em, -1.6em);
    letter-spacing: 0.05em;
}

.text
{
    font-size: 1em;
    padding: 0em;
    background-color: transparent;
    transform: translate(0, -0.3em);
    color: #a7a7a7;
    transition: transform 0.15s ease-out, font-size 0.15s ease-out, background-color 0.2s ease-out, color 0.15s ease-out;
}
/******************Login Input Div Styling Ends*******************/
/*************************************Login Page Styling Ends************************************/
/*************************************General Styling Starts************************************/
.xa_container
{
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
}
.xa_topPane
{
	display: flex;
    justify-content: space-between;
	align-items: center;
    height: 10%;
    width: 100%;
    box-shadow: 0 8px 6px -6px gray;
    z-index: 4;
}
.xa_bottomPane
{
	display: flex;
	height: 89%;
	width: 100%;
	background: linear-gradient(#f2f1f3 5%, white);
}
.logoWrapper
{
    width: 13em;
    margin-left: 1em;
}
.adminSubMenu
{
	height: 3em;
    width: 11.5em;
    margin-right: 0.3em;
    cursor: pointer;
}
.moduleIcon svg
{
	height: 100%;
	width: 100%;
}
.menusWrapper
{
	display: flex;
	justify-content: space-evenly;
    width: 42em;
}
.signUpTxtWrapper
{
    position: absolute;
    height: 2em;
    width: 14em;
    left: 13em;
    margin-top: 0.6em;
    text-indent: 0.5em;
    font: normal 1.2em/1.8 var(--font-semi-bold);
    color: #0c45a9;
    border-left: solid 1px #979595;
}
.moduleWrapper
{
	display: flex;
    width: auto;
    align-items: center;
    justify-content: center;
	cursor: pointer;
}
.moduleIcon
{
	height: 1.5em;
    width: 1.5em;
    margin-right: 0.6em;
}
.moduleName
{
	width: auto;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
	font: normal 1.1em var(--font-normal);
}
.images
{
	height: 100%;
    width: 100%;
    object-fit: scale-down;
}
.images_svg
{
	height: 100%;
    width: 100%;
}
.userInfoWrapper
{
    display: flex;
    align-items: center;
    width: 16em;
    margin-right: 1em;
    justify-content: flex-end;
}
.userInfo
{
    display: flex;
    flex-direction: column;
    margin-right: 1em;
}
.userName
{
    height: 1em;
	width: auto;
    max-width: 12em;
	line-height: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.logoutIcon
{
	height: 1.1em;
    width: 1.3em;
	margin-left: 1em;
	bottom: 0.3em;
	cursor: pointer;
}
/*************************************General Styling Ends**************************************/
/*************************************License details module styling starts**************************************/
.subHeader_
{
	width:40%;
	text-indent:1.7em;
	font:normal 1.25em var(--font-semi-bold);
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.licenseExpiredInfo
{
    display: flex;
    align-items: center;
    font: normal 1.1em var(--font-medium);
    text-indent: 1em;
}
.licenseDetailsWrapper
{
	display: flex;
	height: 28em;
	width: 95%;
	margin: auto;
}
.licenseDetSubWrapper
{
    display: flex;
    align-items: center;
    justify-content: center;
	height: 100%;
    width: 25%;
}
.licenseDetSubWrapper_mid
{
	width: 49%;
    flex-direction: column;
    justify-content: space-evenly;
}
.licenseLogoDiv
{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    height: 11em;
    width: 12em;
}
.appLogo_license
{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 8.2em;
    width: 80%;
    border-radius: 5px;
    box-shadow: 0px 0px 6px 2px #eaeaea;
}
.imgWrapper
{
    height: 71%;
    width: 99%;
}
.logoChange
{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 29%;
    width: 100%;
    border-radius: 0px 0px 5px 5px;
    background: #e7eefa;
    font-size: 0.87em;
    font-family: var(--font-medium);
    color: #030344;
	cursor: pointer;
}
.licenseFieldWrapper
{
    display: flex;
    width: 85%;
    height: 2.8em;
    border: solid 2px #f0f0f0;
    border-radius: 5px;
}
.licenseFieldWrapper_key
{
    display: flex;
    align-items: center;
    height: 100%;
    width: 44%;
    font: normal 0.93em var(--font-semi-bold);
    text-indent: 1em;
    background: #f0f0f0;
    border-radius: 5px 0px 0px 5px;
}
.licenseFieldWrapper_val
{
    display: flex;
    align-items: center;
	height: 100%;
    width: 55%;
    text-indent: 1em;
	color: gray;
    font-size: 0.9em;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.featureWrapper_val
{
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 55%;
	color: gray;
    font-size: 0.9em;
    justify-content: space-evenly;
    align-items: flex-end;
}
.featureList
{
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 1.8em;
    width: 95%;
}
.tick
{
	height: 52%;
    width: 7%;
}
.featureName
{
	width: 90%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.logoBrowse
{
	position:absolute;
	top:0%;
	left:0;
	/* height:100%; */
	height:0;
	width:100%;
	opacity: 0;
	border: 0;
}
/*************************************License details styling ends**************************************/
/*************************************Application module styling starts**************************************/
.appConfigHeader
{
    display: flex;
    justify-content: flex-start;
    height: 3.4em;
    margin-top: 0.8em;
    color: #4b638e;
    align-items: center;
}
.stateWarning
{
	display:none;
	width:60%;
	font:normal 0.95em/2.5 var(--font-bold);
	color:orange;
	margin-right:1em;
	animation: blinker 2s infinite;
}
@keyframes blinker {50% {opacity: 0.3;}}
@-webkit-keyframes blinker {50% {opacity: 0.3;}}
.fieldCont
{
	height: auto;
}

.appFormRow
{
	display: flex;
    height: 2em;
    font: normal 0.9em/1.7 var(--font-medium);
    margin-bottom: 1.25em;
}
.appFormRowLbl_left
{
	width: 13.5em;
	font: normal 1em/1.7 var(--font-semi-bold);
	color: #565656;
}
.appFormRowLbl_right
{
	width: 14.5em;
	font: normal 1em/1.7 var(--font-semi-bold);
    color: #565656;
}
.appFieldDiv
{
	display: flex;
    width: 23.5em;
    align-items: center;
}
.formLink  
{
	text-decoration: underline;
    color: blue;
    cursor: pointer;
    font: normal 0.9em var(--font-bold);
}
.fileDwnldIcon
{
    position: absolute;
    top: 0.2em;
    right: -3em;
    cursor: pointer;
}
.recordCnt
{
    text-indent: 3.3em;
    font: normal 1em var(--font-bold);
    margin-top: 1em;
}
.reportsWrapper
{
	display: flex;
    justify-content: space-evenly;
    width: 82%;
}
.reportsBtn
{
	display: flex;
    align-items: center;
    justify-content: center;
    height: 3em;
    width: 11em;
    background: #f6f8f9;
    box-shadow: 0px 2px 0px 1px #e7e7e7;
    border: solid 1px #e7e7e7;
    border-radius: 8px;
    font: normal 1.1em/3 var(--font-bold);
    color: black;
    margin: 0.5em 0;
    cursor: pointer;
}
.reportsBtn:hover
{
	background: transparent;
}
.reportLegend
{
    display: inline-block;
    width: 13em;
    height: 100%;
    font: normal 0.85em/1 var(--font-semi-bold);
    text-align: left;
    text-indent: 1.5em;
    vertical-align: top;
}
.reportLegend:before
{
	content: '';
    position: absolute;
    top: 0px;
    left: 0px;
    width: 0.85em;
    height: 0.85em;
    border-radius: 50%;
    background: #469704 ;
}
.reportLegend:nth-child(2)::before{
	background:#c82f25;
}
.reportLegend:nth-child(3)::before{
	background:#f2a106;
}

.appFieldVal
{
	display: flex;
    margin-right: 3em;
    width: auto;
}
.appFieldVal_1
{
	margin-right: 0;
    width: 7.8em;
}

.appFieldLastVal
{
	margin-right: 0 !important;
}
.appFieldVal_selectBox
{
    outline: 0;
    border: 0;
    height: 1.8em;
    width: 15em;
	margin-right: 1em;
    padding-left: 0.3em;
    border-radius: 5px;
    font: normal 1em var(--font-normal);
    box-shadow: 0px 0px 1px 1px #b1b1b1;
}
.appFieldVal>input[type='radio']
{
	position: absolute;
    top: 4px;
    left: 0;
    opacity: 0;
}
.appFieldVal>label
{
	height: 1.6em;
	font-size: 0.93em;
    width: auto;
    padding-left: 1.4em;
    cursor: pointer;	
}
.appFieldVal input[type='radio'] + label:after,.appFieldVal input[type='radio'] + label:before
{
	content:'';
    position:absolute;
    border-radius:50%;
}

.appFieldVal input[type='radio']+ label:before
{
    left: 0;
    top: 0.3em;
    width: 0.9em;
    height: 0.9em;
    background: rgba(0,0,0,0);
    border: solid 1px gray;
}
.appFieldVal input[type='radio']:checked + label:after
{
    top: 0.5em;
    left: 0.2em;
    width: 0.5em;
    height: 0.5em;
    background: #6dc900;
}
.appFieldVal input[type='radio']:checked + label {color:blue;}

.signUpBtnWrapper
{
    display: flex;
    flex-direction: row;
    justify-content: flex-end;
    height: 2em;
    width: 100%;
	margin-top:0.3em;
}
.signUpBtnWrapper_centerAlign
{
    justify-content: center !important;
}
.appSubmitBtn
{
    height: 2em;
	width: auto;
    max-width: 15em;
    padding: 0.3em 1em;
    margin-right: 1.5em;
    font: normal 0.9em var(--font-medium);
    color: white;
    border-radius: 5px;
    text-align: center;
    background: #6dc900;
    box-shadow: 0px 0px 2px 2px #abbf94;
    cursor: pointer;
}
.appSubmitBtn:hover
{
    box-shadow: 0px 0px 3px 3px #a4ad9b;
}
#appLogo
{
    height: 100%;
    padding: 0.2em;
    width: 3.9em;
    margin-left: 2em;
    box-shadow: 0px 0px 2px 1px #b2b2b2;
    border-radius: 17px;
}
.appLogoDelWrapper
{
	height:1em;
	width:1em;
	margin-left:0.5em;
	cursor:pointer;
}
.abortBtn
{
	position: absolute;
	width: auto;
    left: 2.5em;
    padding: 0.3em 1em;
    border: solid 2px red;
    border-radius: 5px;
    font: normal 0.9em var(--font-medium);
    color: red;
    text-align: center;
    cursor: pointer;
}
.abortBtn:hover
{
	box-shadow: 0px 0px 2px 2px #e96f6f;
}

.userViewBtnWrapper
{
    display: flex;
    justify-content: center;
    margin: 0.3em 0 1.3em 0;
}
.userViewBtn
{
    height: 1.7em;
    width: 5.5em;
    text-align: center;
    line-height: 1.75;
    font-size: 0.8em;
    border-radius: 3px;
    box-shadow: 0px 0px 2px 2px #ebe8e8;
    cursor: pointer;
}

.browseBtn_app
{
	position: absolute;
    top: 0.5em;
    right: 0.6em;
    height: 1.7em;
    width: 4.7em;
    font: normal 0.8em/1.8 var(--font-medium);
    color: gray;
    box-shadow: 0px 0px 2px 1px #ede8e8;
    background: white;
    border-radius: 5px;
    cursor: pointer;
}

.applicationFields
{
    display: flex;
	margin-top: 2em;
    width: 66em;
    height: 31em;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
}
.fieldWrapper
{
    display: flex;
    width: 95%;
    height: 13em;
}
.fieldImg
{
	height: 10em;
	width: 30em;
}
.fieldConfigWrapper
{
	display: flex;
    justify-content: center;
    width: 53em;
	
}
.fieldConfigWrapper_
{
	width: 36em;
}
.fieldLabel
{
	font:normal 1em var(--font-medium);
}
.fieldDef
{
	font: normal 0.8em var(--font-normal);
    color: grey;
    margin-top: 0.6em;
    width: 41em;
}
.field
{
	display: flex;
    margin-top: 2em;
    width: 100%;
    flex-wrap: wrap;
}
.InpTxt
{
	border: 0;
	outline: 0;
	height: 3em;
    width: 20em;
	text-indent: 1em;
	border: solid 1px #bab8b8;
    border-radius: 5px;
}
.fileInp
{
	position: absolute;
    top: 0;
    left: 0;
    width: 20em;
    height: 2.9em;
    opacity: 0;
}
.modifyDiv
{
    height: 93%;
    width: 96%;
    margin: 1.3em auto 0;
    background: white;
    border: solid 1px #d5d5d5;
    border-radius: 13px;
    box-shadow: 0px 0px 2px 2px #e1e1e1;
}
.appModifyHeader
{
    display: flex;
    align-items: center;
    height: 3em;
	font:normal 1.3em var(--font-medium);
    color: #1a1aa8;
    text-indent: 2em;
}
.modificationWrapper
{
    display: flex;
    flex-direction: column;
    align-items: center;
	height: 28em;
    width: 91%;
    margin: 0.8em 0 0 6em;
	overflow-x: hidden;
    overflow-y: auto;
}
.formRow
{
    display: flex;
    flex-direction: column;
    margin-bottom: 3em;
	width: 73em;
}

.formRowAction
{
    display: flex;
    height: 2em;
}
.formRowLbl
{
	width: 20em;
    font-family: var(--font-medium);
    color: #565656;
}
#apiClientIpAddBtn, #apiClientIpAddBtn_
{
    display: flex;
    align-items: center;
    justify-content: center;
    height: 2em;
    width: 4em;
    margin-left: 2em;
    border: solid 1px #a0c3ff;
    background: #e6efff;
    border-radius: 5px;
    font: normal 0.8em var(--font-bold);
}
.addedClientIpDIv_
{
    height: auto;
    width: 55em;
    margin-top: 2em;
}
.appAddHolder
{
    position: relative;
    min-height: -2em;
    width: 92%;
    margin: 1em auto;
    font: normal 0.9em/2 var(--font-normal);
    color: black;
    text-indent: 0.3em;
	border-bottom: solid 1px #ebf1e4;
}

/**********************************Application module styling ends***********************************/
/**********************************Admin module styling starts***********************************/

.adminWrapper
{
    display: flex;
    flex-direction: column;
    width: 99%;
    margin: 0 auto;
}
.adminSubMenuWrapper
{
	display: flex;
    align-items: flex-end;
    height: 5em;
    width: 97.3%;
    margin: 0 auto;
}
.adminSubMenuWrapper>span
{
	color: gray;
    font: normal 0.98em var(--font-medium);
	cursor: pointer;
}
.adminListTblDiv
{
	height: 25em;
    width: 72em;
    margin: 2em auto;
}

.adminMainWrapper
{
	display: flex;
    justify-content: center;
    align-items: center;
    height: 29em;
    width: 97%;
    margin: -0.5em auto 0;
    background: white;
    border-radius: 10px;
    box-shadow: 0px 0px 2px 2px #e1e1e1;
}
.adminMainWrapper_
{
    display: flex;
    flex-direction: column;
    align-items: center;
	height: 31em;
    width: 79em;
    margin: 1em auto;
}
.setAdminPrefWrapper
{
	width: 58em;
    padding: 1em 2em;
    border-radius: 10px;
    background: linear-gradient(#e1f7f6, white);
}
.setAdminPrefWrapper_
{
	display: flex;
    height: 10em;
    flex-direction: column;
    justify-content: space-evenly;
}
.setAdminPrefHeader
{
	color: #131387;
    height: 2em;
    font: normal 1.2em var(--font-normal);
}
.setAdminPrefDefWrapper
{
	height: 5em;
	width: 58em;
    display: flex;
}

.adminSubMenuTxt
{
    position: absolute;
    top: 0.8em;
    left: 0;
    width: 93%;
    text-align: center;
	color: white;
}

.adminPrefDiv
{
	position: absolute;
    top: 2em;
    left: 13.8em;
    height: 37em;
    width: 60em;
    border-radius: 8px;
    z-index: 60;
    background: white;
    box-shadow: 0px 0px 3px 3px #fbf9f9;
}
.adminPrefUpperDiv
{
    display: flex;
    padding: 1em 1em 0.3em 1em;
    justify-content: space-between;
}
.adminPrefMidDiv
{
	display: flex;
    padding: 0 1em;
    justify-content: center;
}
.adminPrefSelBox
{
	display: flex;
    width: 21em;
    margin-left: 2em;
}
.formInput
{
	display: inline-block;
    vertical-align: top;
    width: 55%;
    height: 28px;
    font: normal 1em var(--font-normal);
}
.appNameSelBox
{    
	height: 100%;
    width: 78%;
    border: 0;
    outline: 0;
    font-size: 1em;
    text-indent: 0.5em;
    border-radius: 5px;
    box-shadow: 0px 0px 5px #bbb3b3;
}
.adminPrefBottomDiv
{
	display: flex;
    justify-content: space-around;
    height: 25em;
    width: 100%;
	margin-top: 1.5em;
}
.adminPrefWrapper
{
	display: inline-block;
    vertical-align: top;
    height: 25em;
    width: 24em;
}
.adminPrefLabel
{
	width: 100%;
    text-indent: 5px;
    color: brown;
    text-shadow: 0 0 3px #fff;
	font: normal 1em/2.2 var(--font-normal);
}
.adminPrefContainer
{
	height: 22.5em;
    width: 21em;
    border: solid 1px #e2e2e2;
    box-shadow: 0px 0px 3px #a2a2a2;
    border-radius: 8px;
}
.adminPref
{
    height: 19em;
    width: 90%;
    margin: 1.6em auto;
    z-index: 5;
	overflow: auto;
}
.adminPrefChkBox 
{
    display: flex;
    align-items: center;
    height: 16% !important;
    width: 88% !important;
    margin-bottom: 3%;
    border-radius: 11px;
    background: #F5F5F5;
    padding: 0 5%;
    z-index: 2;
}
.preferredAdmin, .adminListVals {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 87%;
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.addAdminWrapper
{
	display: flex;
    align-items: center;
    flex-direction: column;
    height: 30em;
    width: 93%;
}
.adminDefWrapper
{
	height: auto;
    width: 100%;
    padding: 1em 1.5em;
    font: normal 1em/1.5 var(--font-normal);
    color: #545151;
    text-align: left;
    border-radius: 9px;
    margin-top: 1em;
}
.mulAppHeading
{
	margin-top:0;
	width:71%;
	font:normal 1.4em/1.5 var(--font-medium);
	text-align:center;
	background:transparent;
}

.adminFormWrapper
{
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-around;
    height: 15em;
    width: 45%;
    margin: 1em 0 2em;
}
.adminFormRow
{
	display: flex;
    height: 2.5em;
    width: 32em;
}
.adminFormLbl
{
	width: 21em;
	font: normal 0.95em/2.1 var(--font-medium);
    text-shadow: 0 0 3px #fff;
}
.adminFormVal
{
	outline: 0;
    border: 0;
    width: 100%;
    border: solid 1px #bebebe;
    border-radius: 5px;
	font: normal 0.9em var(--font-normal);
    text-indent: 1.3em;
}
#xhandleWrapper_login
{
	text-indent: 0;
    font: normal 0.95em/2.5 var(--font-normal);
}
#xhandleWrapper
{
	height: 2em;
    width: 17.4em;
    padding-left: 0;
    text-indent: 0.4em;
    font: normal 0.85em/1.9 var(--font-normal);
}
.adminsWrapper
{
	display: flex;
    flex-wrap: wrap;
    height: 18em;
    width: 100%;
	margin-left: 1.7em;
    overflow-y: auto;
}
.wrapper_
{
    display: flex;
    justify-content: space-between;
    height: 4.4em;
    width: 16em;
    margin: 1em 3em 2em 0;
    padding: 0.5em;
	border: solid 1px #d2cfcf;
	cursor: pointer;
}
.transferLogo
{
    height: 2.8em;
	width: 2.8em;
}
.transferOwnerNameWrapper
{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 11em;
}
.transferOwnerName
{
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font: normal 1.1em/1.5em var(--font-normal);
}
.mulAppCreationWrapper
{
	display: flex;
    flex-direction: column;
    height: 95%;
    width: 95%;
    margin: 1.5em auto 0;
    align-items: center;
}
.mulAppsListWrapper
{
	display: flex;
    align-items: flex-start;
	height:auto;
    max-height: 22em;
    width: 70em;
    margin: 0em auto;
    overflow-x: hidden;
    flex-wrap: wrap;
    overflow-y: auto;
    justify-content: center;
}
.multiPageLegendWrapper
{
    position: absolute;
    bottom: 1em;
	display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.multiPageLegend
{
	display:flex;
	align-items:center;
	justify-content:center;
	width:10em;
	margin:0 4em;
}
.multiPageLegend>span:nth-child(1)
{
    width: 0.7em;
    height: 0.7em;
    border-radius: 50%;
    margin-right: 0.5em;
}
.multiPageLegend>span:nth-child(2)
{
	font:normal 0.9em/1 var(--font-bold);
}
.appWrapper
{
    height: 6.5em;
    width: 10em;
    margin: 1em;
    border-radius: 20px;
    cursor: pointer;
}
.appBox
{
    display: flex;
    align-items: center;
    justify-content: space-around;
    height: 100%;
    width: 100%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-radius: 0.5em;
    flex-direction: column;
}
.appName
{
	width: 9em;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font: normal 0.92em var(--font-medium);
}
.appCircle
{
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 7em;
    width: 7em;
    left: 3em;
    bottom: 5.3em;
    border: solid 1px #abd979;
    border-radius: 50%;
    box-shadow: 0 2px 2px 2px #c5e6bd;
    background: white;
}
.createAppDiv
{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    height: 6.5em;
    width: 10em;
    margin: 1em 1em 2em 0;
    border-radius: 20px;
    box-shadow: 0px 0px 2px 1px #d9d7d7;
    cursor: pointer;
}
.addSymbol
{
	height: 1.5em;
    width: 3em;
}

/**********************************Admin module styling ends***********************************/
/**********************************sign up page styling starts***********************************/
.bottomWrapper
{
    display: flex;
    overflow-y: scroll;
    overflow-x: hidden;
    height: 94%;
    width: 90%;
    margin: 1.5em auto;
    justify-content: space-between;
}
.fieldPanesWrapper
{
	display: flex;
    justify-content: flex-end;
    height: 90%;
    width: 100%;
}
.fieldPanesWrapper_signup
{
	margin: 0.5em auto 0;
}
.fieldPanes
{	
    display: flex;
    flex-direction: column;
    width: 37em;
    margin-left: 2em;
}
.subHeaderWrapper
{
    height: 1.9em;
    width: 27em;
    border-bottom: solid 1px #8cc34c;
}
.subHeaderWrapper_
{
	height: 1.9em;
    width: 27em;
    border-bottom: solid 1px transparent;
    border-image: linear-gradient(0.25turn, rgb(239 239 233), rgb(140 195 76), rgba(56,2,155,0));
    border-image-slice: 1;
    margin: 0.7em 0 0.82em 0;
}
.subHeader
{
    display: inline;
    font: normal 1em/2 var(--font-normal);
    color: white;
    padding: 0.2em 2.5em 0.2em 0.7em;
    border-top-right-radius: 30px;
    background: #82b0ff;
}

.signUpFieldsSubWrapper_Left
{
	display: flex;
	flex-direction: column;
	height: 90%;
	width: 100%;	
}
.signUpFormRow
{
	display: flex;
    width: 95%;
    margin: 0.85em;
}
.signUpFormRow>select
{
    outline: 0;
    border: 0;
    height: 1.77em;
    width: 14.8em;
    background: #fbfbfb;
    padding-left: 0.3em;
    border-radius: 5px;
    font: normal 1em var(--font-normal);
    box-shadow: 0px 0px 1px 1px #e5e5e5;
}
.signUpFormRowLbl
{
    width: 13em;
    font: normal 0.88em/2.5 var(--font-semi-bold);
    color: #565656;
}
.signUpVals
{
    outline: 0;
    border: 0;
    height: 2.2em;
    width: 18.5em;
    padding-left: 0.3em;
	text-indent: 0.6em;
    border-radius: 5px;
    background: #fbfbfb;
    font: normal 0.8em var(--font-normal);
    box-shadow: 0px 0px 1px 1px #e5e5e5;
}
.signUpVals::placeholder
{
	text-align: left;
}
.featureWrapper
{
	display: flex;
    width: 26em;
    flex-wrap: wrap;
    height: 7.5em;
    border: solid 1px #d5d1d1;
    border-radius: 7px;
    padding: 0.7em;
    margin-top: 1.1em;
}
.formChkBox
{
	display: flex;
    align-items: center;
    margin-left: 1.5em;
    width: 10em;
}
.formChkBox>input
{
	margin-right: 0.8em;
	cursor: pointer;
}
.formChkBox>label
{
	font: normal 0.9em var(--font-medium);
}
.formFileInput {
    position: absolute;
    top: 0%;
    left: 0%;
    opacity: 0;
    height: 100%;
    width: 100%;
    z-index: 20;
	cursor: pointer;
}

.formRowRadioDiv_modify
{
    display: flex;
	flex-direction: row;
}
.purchaseMode
{
    display: flex;
    width: 30em;
    justify-content: space-between;
    margin-top: 1em;
}
.paymentWrapper
{
	border: solid 1px #d9d5d5;
    height: 6em;
    width: 9em;
    display: flex;
    border-radius: 5px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.paymentModeImgs
{
    height: 2.5em;
    width: 5em;
}
.paymentMode
{
	margin-top: 0.6em;
    text-align: center;
	line-height: 1em;
}
.groupingImgDiv
{
    position: absolute;
	height: 4em;
    width: 4em;
	top: 7em;
    left: -2em;
    border-radius: 50%;
	background: white;
    box-shadow: 0px 0px 6px 4px #bdb9b9;
}
.signUpRadioVals
{
    display: flex;
	width: 19em;
}
.radioLabel
{
	width: 9em !important;
	margin-right: 0 !important;
}
.fieldDiv_signUp
{
	width: 8em !important;
}
.browseBtn
{
    display: flex;
    align-items: center;
    height: 4em;
    width: 6em;
    text-align: center;
    color: #5c5c5c;
    line-height: 1.2em;
	border: solid 1px #b3afaf;
    border-radius: 7px;
}
.browseFile
{
	outline: 0;
    border: 0;
    position: absolute;
    opacity: 0;
    top: 0;
    height: 100%;
    width: 100%;
    left: 0;
    cursor: pointer;
}
.enrollVal {
    width: 86%;
    margin: 0% auto;
}
.enrollUsagePeriodLbl
 {
    display: inline-block;
    vertical-align: top;
    width: 32%;
    font: normal 0.9em var(--font-semi-bold);
}
#app_validFrom {
    outline: 0;
    border: 0;
    height: 22px;
    width: 80px;
    padding-left: 2px;
    border-radius: 5px;
    font: normal 13px calibri;
    border: solid 1px #D7D8DA;
}
/**********************************sign up page styling ends***********************************/

/********************* MONTH POPUP STARTS ************************/
#monthOverlay
{
	position:absolute;
	top:0%;
	left:0%;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0);
	display:block;
    z-index: 50;
}
#monthContainer
{
	position: absolute;
    top: 210px;
    left: 900px;
    height: 150px;
    width: 280px;
    display: block;
    background: rgb(255, 255, 255);
    border: 1px solid rgb(204, 204, 204);
    z-index: 51;
    padding-top: 5px;
    padding-bottom: 5px;
    box-shadow: rgb(51, 51, 51) 2px 1px 3px;
}
.monthHeader
{
	width:100%;
	margin:0% auto;
	text-align:center;
	height:30px;
	font:normal 1em calibri,cambria;
}
.monthBody
{
	width:90%;
	height:80%;
	margin:2% auto;
}
.monthSpan
{
	display:inline-block;
	vertical-align:top;
	width:25px;
	height:25px;
	margin:2px;
	text-align:center;
	font:normal 0.9em calibri,cambria;
	border: 1px solid #eeeeee;
	cursor:pointer;
}

.monthSpan:hover {
    background: #b3b3b3;
    color: #FFFFFF;
}
/********************* MONTH POPUP ENDS ************************/
/**********************************Home module styling starts***********************************/
.dbDetailsWrapper
{
	background:none;
	display:flex;
	justify-content: space-around;
	height: 31em;
}
.homeSubWrapper_1
{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 12em;
}
.logoDiv
{
    height: 6em;
    width: 90%;
    margin: 1em auto 0em;
}
.appName_dashboard
{
	width: 90%;
    margin: 0 auto;
    height: 2.2em;
    font-family: var(--font-semi-bold);
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.statusWrapper
{
    display: flex;
    justify-content: center;
    align-items: center;
    height: 2.1em;
	background: #119c11;
    color: white;
	font-family: var(--font-bold);
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.topWrapper
{
    display: flex;
	align-items: center;
    width: 90%;
    height: 5em;
    margin: 0.5em auto;
}
.adminIconImg
{
    display: flex;
    align-items: center;
    justify-content: center;
	height: 2em;
    width: 2.5em;
}
.Info
{
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
	height: 3.6em;
    width: 6.7em;
    margin-left: 1.2em;
}
.createdBy
{
    max-width: 7em;
	font: normal 0.9em var(--font-bold);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dbLbl
{
	font-size:0.85em;
}
.homeSubWrapper_2
{
    width: 30em;
	padding: 1.5em;
    background: white;
    border-radius: 10px;
    box-shadow: 0px 0px 5px 3px #cecaca;
}

.dbHeader
{
	height: 2em;
    font: normal 1.1em var(--font-semi-bold);
    text-indent: 1em;
}
.statsCont_mainWrapper
{
    display: flex;
    flex-direction: column;
    height: 10em;
	margin-top:0.7em;
}
.statsSmallCont_header
{
	text-align: center;
}
.statsSmallCont_wrapper
{
    display: flex;
    align-items: center;
	justify-content: space-around;
    height: 9em;
	border-bottom: solid 1px #e5e5e5;
}
.statsSmallCont
{
	height: 6em;
    width: 7em;
    border-radius: 16px;
}
.statsSmallCont_state
{
    height: 38%;
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    background: #e9f5db;
    font-family: var(--font-bold);
    display: flex;
    align-items: center;
    justify-content: center;
}
.statsSmallCont_val
{
    display: flex;
    font-family: var(--font-bold);
    height: 62%;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    background: #f4faee;
    align-items: center;
    justify-content: center;
	color: green;
}
.homeSubWrapper_3
{
	width: 35em;
	padding: 1.5em;
	background: white;
    border-radius: 10px;
    box-shadow: 0px 0px 5px 3px #cecaca;
}
.licenseBottom
{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
	margin-top: 1em;
}
.licenseSmallCont
{
    height: 8em;
    width: 13em;
    border-radius: 8px;
    border: solid 1px #e2e0e0;
    margin: 1.3em;
}
.innerCont
{
	display: flex;
    align-items: center;
    justify-content: space-around;
    height: 100%;
    width: 100%;
}
.licenseDef
{
    width: 96%;
    margin-left: 1.1em;
}
.licenseInfoImgs
{
    height: 3em;
    width: 5em;
}
.licenseInfoCnt
{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    height: 4em;
    width: 9em;
}
.licenseValues
{
	font-family:var(--font-bold);
}
.smallWrapper
{
    height: 11.3em;
    width: 100%;
    background: white;
    border-radius: 10px;
    box-shadow: 0px 0px 5px 3px #cecaca;
}
.smallWrapper_3
{
    display: flex;
    flex-direction: column;
	justify-content: space-between;
	height: 5em;
    padding: 1em;
	text-align: center;
}

/**********************************Home module styling ends***********************************/
/**********************************Dull Screen styling starts***********************************/
#loaderDullscreen,.dullScreenStyle
{
	position:absolute;
	top:0%;
	left:0%;
	width:100%;
	height:100%;
	background-color:#000000;
	opacity:0.6;
	z-index:199;
}
.dullScreenStyle{z-index:10;}
/**********************************Dull Screen styling ends***********************************/

/****************************Styling for Button Begins*******************************************/
.btnWrapper_adminPref
{
	display: flex;
    justify-content: space-around;
	width: 11em;
}
.adminPrefConfigBtn
{
	height: 2.3em;
    padding: 0.5em;
    width: 6.5em;
	letter-spacing: 0.07em;
    background: #2ddb2d;
    box-shadow: 0px 2px 1px 1px #98eb98;
    border-radius: 8px;
    color: white;
    text-align: center;
    font: normal 0.85em/1.3 var(--font-medium);
	cursor: pointer;
}
.btnWrapper_setPref
{
	display: flex;
    justify-content: space-around;
    width: 100%;
    margin-top: 1.8em;
}
.btnWrapper
{
	display: flex;
    align-items: center;
    justify-content: space-around;
    height: 5em;
	width: 30em;
}
.btns
{
	height: 2.3em;
    padding: 0.5em;
    width: 6.5em;
    border: solid 2px #6dc900;
    border-radius: 5px;
    color: green;
    text-align: center;
    font: normal 1.2em/1.1 var(--font-medium);
	cursor: pointer;
}


/****************************Styling for Button Ends*******************************************/

/*************************************Radio button styling starts**************************************/
.fieldDiv
{
	display: flex;
    width: auto;
	margin-right: 2em;
}
.fieldDiv_modify
{
	display: flex;
    width: 10em;
}
.fieldDiv>input[type='radio'], .fieldDiv_modify>input[type='radio']
{
	position: absolute;
    top: 0.3em;
    left: 0.3em;
    opacity: 0;
}
.fieldDiv>label, .fieldDiv_modify>label
{
    height: 2.1em;
	/* width: 10em; */
	width: auto;
    padding: 0.4em;
    padding-left: 2em;
    margin-bottom: 1em;
    font: normal 1em/1 var(--font-medium);
    border-radius: 15px;
    cursor: pointer;
}
.fieldDiv input[type='radio'] + label:after,.fieldDiv input[type='radio'] + label:before , .fieldDiv_modify input[type='radio'] + label:after,.fieldDiv_modify input[type='radio'] + label:before
{
	content:'';
    position:absolute;
    border-radius:50%;
}

.fieldDiv input[type='radio']+ label:before, .fieldDiv_modify input[type='radio']+ label:before
{
	left: 0%;
    width: 1.1em;
    height: 1.1em;
    background: rgba(0,0,0,0);
    border: solid 2px gray;
}
.fieldDiv input[type='radio']:checked + label:after, .fieldDiv_modify input[type='radio']:checked + label:after {
	top: 0.68em;
    left: 0.291em;
    width: 0.52em;
    height: 0.52em;
    background: #6dc900;
}
.fieldDiv input[type='radio']:checked + label:before, .fieldDiv_modify input[type='radio']:checked + label:before {border:solid 2px #6dc900;}
.fieldDiv input[type='radio']:checked + label, .fieldDiv_modify input[type='radio']:checked + label {color:blue;font: normal 1em/1 var(--font-bold);}
/*************************************Radio button styling ends**************************************/

/****************************Styling for Scroll Begins*******************************************/

/* width */
::-webkit-scrollbar {
	width: 0.5em;
}

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

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #8f8d8d; 

}
/***************************Styling for Scroll Ends***********************************/
/*******************  Loader Starts  ***********************/
.loaderWrapper
{
	position: absolute;
    top: 15em;
    left: 28em;
    color: white;
    min-height: 7em;
    height: auto;
    width: 31em;
    text-align: center;
    z-index: 500;
    padding-bottom: 1em;
	align-items:center;
	justify-content:center;
	display:none;
}
#loaderDullscreen,.dullScreenStyle,.transparentOverlay
{
	position:absolute;
	top:0%;
	left:0%;
	width:100%;
	height:100%;
	background-color:#000000;
	-ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(Opacity=50)';
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	-khtml-opacity: 0.5;
	opacity:0.7;
	display:none;
	z-index:450;
}
.dullScreenStyle,.transparentOverlay{z-index:200;}
.transparentOverlay{background-color:rgba(0,0,0,0); opacity:1;}
#loader 
{
	width: 64px;
	height: 64px;
	z-index:451;
}
#loader div {
  -webkit-animation: loader 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  -moz-animation: loader 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  -ms-animation: loader 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  animation: loader 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
  -webkit-transform-origin: 32px 32px;
  -moz-transform-origin: 32px 32px;
  -ms-transform-origin: 32px 32px;
  transform-origin: 32px 32px;
}
#loader div:after {
  content: " ";
  display: block;
  position: absolute;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #fdfbfc;
  margin: -3px 0 0 -3px;
}
#loader div:nth-child(1) {
  -webkit-animation-delay: -0.036s;
  -moz-animation-delay: -0.036s;
  -ms-animation-delay: -0.036s;
  animation-delay: -0.036s;
}
#loader div:nth-child(1):after {
  top: 50px;
  left: 50px;
}
#loader div:nth-child(2) {
  animation-delay: -0.072s;
}
#loader div:nth-child(2):after {
  top: 54px;
  left: 45px;
}
#loader div:nth-child(3) {
  animation-delay: -0.108s;
}
#loader div:nth-child(3):after {
  top: 57px;
  left: 39px;
}
#loader div:nth-child(4) {
  animation-delay: -0.144s;
}
#loader div:nth-child(4):after {
  top: 58px;
  left: 32px;
}
#loader div:nth-child(5) {
  animation-delay: -0.18s;
}
#loader div:nth-child(5):after {
  top: 57px;
  left: 25px;
}
#loader div:nth-child(6) {
  animation-delay: -0.216s;
}
#loader div:nth-child(6):after {
  top: 54px;
  left: 19px;
}
#loader div:nth-child(7) {
  animation-delay: -0.252s;
}
#loader div:nth-child(7):after {
  top: 50px;
  left: 14px;
}
#loader div:nth-child(8) {
  animation-delay: -0.288s;
}
#loader div:nth-child(8):after {
  top: 45px;
  left: 10px;
}
@keyframes loader {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
#loaderText{			
    position: relative;
    font-size: 22px;
    color: white;
    bottom: 54%;
    left: 35%;
    display: none;
    z-index: 452;
}
#signLoaderText
{
    font-size: 1.7em;
    margin-left: 1em;
}
/*******************  Loader ends  ***********************/

/******************* Show POPUP Starts ***********************/
.okBtn_
{
	position: relative;
    display: inline-block;
    text-align: center;
    height: 1.8em;
    width: 5em;
    font: bold 0.9em helvetica;
    cursor: pointer;
    letter-spacing: 0.2px;
    color: white;
    box-shadow: 0px 0px 3px #356da4;
    border-radius: 5px;
    line-height: 1.8em;
    margin-right: 1.5em;
    border: solid 1px #129CCD;
    background: -webkit-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
    background: -moz-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
    background: -ms-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
    background: -o-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
    background: linear-gradient(to bottom,#129CCD 0%,#5B5D98 100%);
    box-shadow: 1px 1px 3px #a2a2a2;
}
.showOkBtnWrapper
{
    position: relative;
    height: 2em;
    text-align: center;
}
#popupMessageArea
{
	position : absolute;
	top : 35%;
    left: 35%;
	color:#000;
	font:normal 0.95em Helvetica;
	min-height:120px;
	height:auto;
    width: 33%;
    line-height: 20px;
    text-align : center;
    box-shadow : 2px 2px 5px #000000;
	-webkit-box-shadow:2px 2px 5px #000000;
	-moz-box-shadow:2px 2px 5px #000000;
	-webkit-backface-visibility: visible !important;
	-moz--backface-visibility: visible !important;
	-ms-backface-visibility: visible !important;
	-o-backface-visibility: visible !important;
	backface-visibility: visible !important;
	-webkit-animation:flipInX 0.5s;
	-moz-animation:flipInX 0.5s;
	-ms-animation:flipInX 0.5s;
	animation:flipInX 0.5s;
	padding-bottom:10px;
	border-radius:8px;
	border:solid 1px #74afed;
	background:#ffffff;
	z-index:501;
}
.closePopup
{
	position:absolute;
	top:2%;
	right:2%;
	height:25px;
	width:25px;
	border-radius:100%;
	text-align:center;
	cursor:pointer;
	transition:transform 0.5s;
	font:normal 0.7em Helvetica;
	color:#fff;
	border:solid 1px #5413a8;
	background:#5413a8;
	line-height:25px;
	transition:transform 0.5s;
}
.closePopup:hover{transform:rotate(180deg)}
.popupText
{
	position:relative;
	left:5%;
	width:90%;
	top:30px;
	color:black;
	line-height:1.2;
	padding:15px 0px;
	font:normal 1.2em Helvetica;
}
.dullScreenStyle{z-index:200;}
.confirmationDiv
{
    position : absolute;
	top : 15em;
    left: 28em;
	color:#000;
	min-height:7em;
	height:auto;
    width: 28em;
    text-align : center;
    z-index : 201;
	border-radius  : 8px;
    box-shadow : 2px 2px 5px #000000;
	-webkit-box-shadow:2px 2px 5px #000000;
	-moz-box-shadow:2px 2px 5px #000000;
    -webkit-animation:fadeInDown 0.5s;
    -moz-animation:fadeInDown 0.5s;
    -ms-animation:fadeInDown 0.5s;
	animation:fadeInDown 0.5s;
	padding-bottom:1em;
	border:solid 1px rgba(255,255,255,0.7);
	background:#ffffff;
} 
.confirmationDiv>div:first-child{
    position:relative;
	font:normal 1em var(--font-medium);
	width:93%;
	margin:0 auto;
	text-align:center;
	padding-top:1.22em;
	padding-bottom:0.61em;
	margin-bottom:0.61em;
	height:auto;
	/* line-height:2.44em; */
	line-height:2em;
	padding: 1em;
    font-size: 1.1em;
}
.confirmationDiv>div:last-child{
    position:relative;
	height:2em;
	/* width:100%; */
	text-align:center;
}
.confirmationDiv>div:last-child>div
{
	position: relative;
    display: inline-block;
    text-align: center;
    width: 5em;
    font: normal 0.9em/2 var(--font-medium);
    cursor: pointer;
    letter-spacing: 0.2px;
    color: white;
    box-shadow: 0px 0px 3px #356da4;
    border-radius: 5px;
    margin-right: 1.5em;
    border: solid 1px #129CCD;
    background: -webkit-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
    background: -moz-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
    background: -ms-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
    background: -o-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
    background: linear-gradient(to bottom,#129CCD 0%,#5B5D98 100%);
    box-shadow: 1px 1px 3px #a2a2a2;
}
.confirmationDiv>div:last-child>div:last-child
{
	margin-right: 0;
}
.confirmationDiv>div:last-child>div:active
{
  -webkit-box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2) inset;
  box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2) inset;
  -webkit-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
  -moz-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
  -ms-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
 }
.closeConfirmDiv
{
	-webkit-animation:fadeOutUp 0.5s;
    -moz-animation:fadeOutUp 0.5s;
    -ms-animation:fadeOutUp 0.5s;
    -o-animation:fadeOutUp 0.5s;
	animation:fadeOutUp 0.5s;
}
.widgetConfirmDiv
{
    position : absolute;
	color:#000;
	min-height:3.5em;
	height:auto;
    width: 25em;
    z-index : 201;
	border-radius  : 8px;
    box-shadow : 2px 2px 5px #a2a2a2;
	-webkit-box-shadow:2px 2px 5px #a2a2a2;
	-moz-box-shadow:2px 2px 5px #a2a2a2;
    -webkit-animation:fadeInDown 0.5s;
    -moz-animation:fadeInDown 0.5s;
    -ms-animation:fadeInDown 0.5s;
	animation:fadeInDown 0.5s;
	padding-bottom:10px;
	border:solid 1px #129CCD;
	background:#ffffff;
} 
.widgetConfirmDiv:before
{
	content: '';
    position: absolute;
    top: -0.6em;
    right: 2em;
	width: 0.9em;
    height: 1em;
    border: solid 1px #129CCD;
    transform: rotate(-45deg);
    border-left-color: rgba(0,0,0,0);
    border-bottom-color: rgba(0,0,0,0);
    background: white;
}
.widgetConfirmDiv>div
{
	display:inline-block;
	vertical-align:middle;
	height:auto;
	width: 16em;
	padding-top:0.7em;
    margin-left: 0.9em;
	font:normal 0.9em/1.5 Helvetica;
	text-align:left;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.widgetConfirmDiv>div:last-child{
	
	text-align:center;
	width:9em;
}
.widgetConfirmDiv>div:last-child>div
{
   display: inline-block;
    text-align: center;
	width: 5em;
    height: 2.2em;
    margin-top: 0.4em;
    font: normal 0.8em/2 helvetica;
    cursor:pointer;
	color:white;
	box-shadow: 0px 0px 3px #356da4;
    border-radius:3px;
    padding-bottom:1px;
	border:solid 1px #129CCD;
	background:-webkit-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
	background:-moz-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
	background:-ms-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
	background:-o-linear-gradient(top,#129CCD 0%,#5B5D98 100%);
	background:linear-gradient(to bottom,#129CCD 0%,#5B5D98 100%);
	box-shadow:1px 1px 3px #a2a2a2;
}
.widgetConfirmDiv>div:last-child>div:last-child{
    margin-left: 0.6em;
}
.widgetConfirmDiv>div:last-child>div:active
{
  -webkit-box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2) inset;
  box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2) inset;
  -webkit-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
  -moz-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
  -ms-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
  -o-transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
  transition: all 50ms cubic-bezier(0.42, 0, 0.58, 1);
 }
.widgetConfirmCloseDiv
{
	-webkit-animation:fadeOutUp 0.5s;
    -moz-animation:fadeOutUp 0.5s;
    -ms-animation:fadeOutUp 0.5s;
    -o-animation:fadeOutUp 0.5s;
	animation:fadeOutUp 0.5s;
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }
}
@keyframes flipInX {
  from {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -moz-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -ms-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -o-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -ms-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -moz-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -ms-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -o-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    -webkit-animation-timing-function: ease-in;
    -moz-animation-timing-function: ease-in;
    -ms-animation-timing-function: ease-in;
    -o-animation-timing-function: ease-in;
    animation-timing-function: ease-in;
  }

  60% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    -moz-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    -o-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    -ms-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    -moz-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    -ms-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    -o-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    -webkit-transform: perspective(400px);
    -moz-transform: perspective(400px);
    -ms-transform: perspective(400px);
    -o-transform: perspective(400px);
    transform: perspective(400px);
  }
}
/*******************  Show POPUP Ends  ***********************/
/*******************  Style for Footer  ***********************/
.footer 
{
    position: absolute;
    display: flex;
    justify-content: flex-end;
    bottom: 0;
    left: 0%;
    height: 1.7em;
    width: 99%;
    text-align: right;
    font-family: var(--font-medium);
    font-size: 0.75em;
    padding-right: 0.9em;
    color: #342f2f;
}	
.odysseyLogoImgDiv
{
    height: 2em;
    width: 3em;
	margin-right: 0.3em;
}
/********************** Add IP Popup Styling Starts **********************/
.formRow_clientIp
{
	display: flex;
	width: 100%;
	margin-bottom: 3em;
}
.formLabel_clientIp
{
	font: normal 0.95em/1.9 var(--font-normal);
    width: 10em;
}
#appPopupOverlay
{
	position:absolute;
	top:0%;
	left:0%;
	width:100%;
	height:100%;
	background-color:rgba(0,0,0,0.5);
	z-index:200;
	display:none;
}
.appPopupContainer
{
	position:absolute;
	top:21%;
	left:32%;
	width:40%;
	height:auto;
	background-color:white;
	z-index:201;
	box-shadow:2px 2px 8px #000;
	display:none;
	border-radius:8px;
}
.appPopupHeader
{
	width: 100%;
    height: 12%;
    font: normal 1.1em var(--font-medium);
    line-height: 2.2em;
    text-align: center;
    border-radius: 8px 8px 0px 0px;
}
.appPopupClose
{
    float: right;
    margin-top: 5px;
    margin-right: 8px;
    font: bold 1.1em/25px calibri;
    width: 25px;
    height: 25px;
    text-align: center;
    cursor: pointer;
    color: #6a4334;
    border-radius: 50%;
    background-color: #fff;
}
.appPopupBody
{
	width:85%;
	margin:3% auto;
	height:88%;
	border-radius:0px 0px 8px 8px;
}
.appPopupButton
{
	position: relative;
    margin: 5% auto;
    font: normal 0.9em var(--font-medium);
    width: 4.5em;
    height: 2.3em;
    line-height: 2.3;
    background-color: #11a811;
    color: white;
    text-align: center;
    border-radius: 5px;
    cursor: pointer;
}

#addedClientIp 
{
    height: 9em;
    width: 49.4%;
    margin: 0.5em 7.9em 1em 0;
    overflow: auto;
    border: solid 1px #dbd8d8;
    border-radius: 5px;
}
.noIpTxt
{
    display: flex;
    align-items: center;
    justify-content: center;
	color: gray;
}
#clientIpPopupDiv .formRow>div:last-child 
{
    float: right;
    margin-right: 20px;
    display: inline-block;
    background-color: #f0b70a;
    color: white;
    width: 60px;
    height: 25px;
    text-align: center;
    font: bold 1em calibri;
    cursor: pointer;
    line-height: 25px;
	border-radius : 5px;
}
.appAddHolder_
{
    position: relative;
    width: 92%;
    background: #fbfbfb;
    box-shadow: 0px 0px 1px 1px #d4d4d4;
    margin: 1em auto;
    border-radius: 7px;
    font: normal 1em var(--font-normal);
    color: black;
    min-height: -2em;
    text-indent: 0.3em;
    line-height: 2em;
}
.appAddDelete{float:right;margin-right:8px;color:#2d2e2b;cursor:pointer;font-size:1.45em;}
#appBasicPane > .formRow
{
	margin: 1.5% auto
}
/********************** Add IP Popup Styling Ends **********************/
/********************** Session Expiry Page Styling Starts **********************/
.sessionExpiryBanner
{
	display: flex;
	top: 0%;
	height: 18%;
	width: 100%;
}
.sessionExpiryCenterDiv
{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 65%;
}
.sessionExpiryDesc
{
	font: normal 1.3em var(--font-medium);
}
.redirectLink
{
	color: blue;
	text-decoration: underline;
	font-family: var(--font-bold);
	cursor: pointer;
}
/********************** Session Expiry Page Styling Ends **********************/
/********************** Warning Popup Styling Starts **********************/
.warningDullScreenStyle
{
	display:none;
	position:absolute;
	top:0%;
	left:0%;
	width:100%;
	height:100%;
	background-color:transparent;
	z-index:200;
}
#warningPopupMessageArea
{
	position: absolute;
    top: 15em;
    left: 28em;
    color: white;
    background: #d32f2f;
    min-height: 7em;
    height: auto;
    width: 36em;
    text-align: center;
    z-index: 201;
    border-radius: 8px;
    -moz-box-shadow: 2px 2px 5px #000000;
    -moz-animation: fadeInDown 0.5s;
    -ms-animation: fadeInDown 0.5s;
    animation: fadeInDown 0.5s;
    padding-bottom: 1em;
    border: solid 1px rgba(255,255,255,0.7);
} 
.warningClosePopup
{
	position: absolute;
    top: 2%;
    right: 2%;
    text-align: center;
    cursor: pointer;
    font: normal 1em var(--font-normal);
    color: #fff;
}
.warningPopupText {
	position: relative;
    margin: 1.7em auto 0;
    width: 90%;
    color: white;
    line-height: 1.2;
    padding: 0.5em 0px;
    font: normal 1.1em var(--font-normal);
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
/********************** Warning Popup Styling Ends **********************/