html {
    margin-left: calc(100vw - 100%);
}

/*		Main Body Text		*/
html,
body {

    background-color: #f8f8f8;
}

.background-default {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    min-height: 485px !important;
    z-index: -1;
    background-image: url('https://apps.test.moo.nl/static-storage/assets/MOO-2.0/Images/Dots.svg'), url('https://apps.test.moo.nl/static-storage/assets/MOO-2.0/Images/Cirkel.svg'), url('https://apps.test.moo.nl/static-storage/assets/MOO-2.0/Images/HeaderCircles.svg');
    background-repeat: no-repeat, no-repeat, no-repeat;
    background-attachment: fixed, fixed, fixed;
    background-position: 100% 100px, 100% 170px, 36px 110px;
}

.custom-background {
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    min-height: 485px !important;
    z-index: -1;
    background-color: #EDEDED;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    clip-path: ellipse(90% 75% at 50% 0%);
}

/*		Box Shadows		*/
.shadow {
    -webkit-box-shadow: 0px 0px 5px 4px rgba(133, 133, 133.5);
    -moz-box-shadow: 0px 0px 5px 4px rgba(133, 133, 133.5);
    box-shadow: 0px 0px 5px 4px rgba(133, 133, 133, 0.5);
}

/*		For Solid/Semi-transparent Backgrounds on HD, Dashboard, SSO, and Acct Mgmt Pages		*/
.opaque,
.hdOpaque {
    background-color: transparent;
    padding-bottom: 20px;
    margin-top: 50px;
    align-self: flex-start;
    min-height: 85%;
}

/*		Link Text		*/
a {
    color: #337ab7;
}

a:focus,
a:hover,
.deleteLink:focus,
.deleteLink:hover {
    color: #23527c;
}

#userMenuList>li>a {
    color: #fff;
}

#userMenuList>li>a:hover {
    color: #ddd;
}

/*		Login Box Background		*/
.logonbox {
    background-color: transparent;
    border-radius: 10px;
    width: 400px;
}

/* 2021-02-04: Ensure long errors do not stretch the error div */
/*#login{background-color:transparent; width: 100vw;} */
#login {
    display: none
}

/*		Self-Service Dialogue Box Backgrounds		*/
#popup_OTPResend {
    width: 660px;
    border-radius: 6px;
    font-weight: 400;
    font-size: 14px !important;
    color: #6E6B7B !important;
    background-color: #FFFFFF !important;
    box-shadow: 5px 5px 5px -4px rgb(0 0 0 / 15%), 0 0 30px 0 rgb(0 0 0 / 45%) !important;
}

#popup_OTPResend a {
    text-decoration: none;
    color: #3498DB;
}

.popupWin {
    z-index: 1;
    border-radius: 8px;
    position: absolute;
    left: 0;
    right: 0;
    margin-left: auto;
    margin-right: auto;
    width: 407px;
}

.popupWin>* {
    background-color: #FFFFFF;
}

/*2021-02-04: Same as above, fixed width */
.popFieldsContainer {
    /*width: 400px;*/
    margin: auto;
}

/* 2021-02-19: For full-width fields on login popups */
#SSEnrollmentAuth {
    margin-left: 20px;
}

/* 2021-02-19: Indent SS radio buttons */

/*	Input Fields	*/
.form-control {
    border: 1px solid #cbd6e2 !important;
    border-radius: 8px;
    color: #636771;
}

.form-control:focus {
    border-color: #66afe9;
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);
}


/*		Header Text		*/
h1,
h2,
h3 {
    color: #000;
}

/*		Header Background		*/
.dlghdr {
    text-transform: none;
    background-color: transparent;
    width: 100%;
}

.dlghdr h1,
.dlghdr h2 {
    color: #000;
}

.loginHdr {
    background-color: transparent;
}

/*		Labels & Legends		*/
label {
    color: #80848e;
}

legend,
#SSActionChosen>span {
    display: none;
}

/*		Buttons		*/
.PGButton {
    background-color: #3498DB;
    color: #FFFFFF;
    height: 40px;
    font-weight: 400;
    font-size: 14px;
    line-height: normal;
    border-radius: 24px;
    border: none !important;
    box-shadow: none !important;
}

.PGButton:hover {
    background-color: #3498DB !important;
    color: #fff !important;
}

.PGButton:active {
    position: relative;
    outline: none !important;
    box-shadow: none;
}

.PGButton:focus {
    background-color: #3498DB !important;
    color: #fff !important;
    outline: none !important;
    box-shadow: none;
}

/* BS color was black */



.PGButtonDisabled {
    background-color: #b7b2b8 !important;
    color: #FFFFFF !important;
    width: 180px !important;
    height: 40px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    border-radius: 8px !important;
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
    border-bottom-left-radius: 8px !important;
}

.btn.disabled {
    background-color: #b7b2b8 !important;
    color: #FFFFFF !important;
    width: 180px !important;
    height: 40px !important;
    font-size: 16px !important;
    font-weight: bold !important;
    border-radius: 8px !important;
    border-top-left-radius: 8px !important;
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
    border-bottom-left-radius: 8px !important;
    border: none !important;
}

.PGButtonDisabled:hover {
    color: #808080;
}

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

.btn.disabled {
    cursor: inherit;
    color: #FFFFFF;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    cursor: inherit !important;
}

.PGAltButton {
    background-color: #ff8000;
}

.PGAltButton:hover {
    background-color: #ff9933;
    color: #fff;
}

/*		Errors, Warnings, and Confirmations		*/
.successdiv {
    color: #80848e;
    background: transparent;
    margin-top: auto;
    margin-bottom: 40px;
    padding-top: 0;
    padding-bottom: 0.5em;
    padding-right: 0.5em;
    padding-left: 0.5em;
    text-align: center;
    border: none;
    width: 100%;
}

.warningdiv {
    background-color: #fcf8e3;
    color: #a94442;
    border-radius: 4px;
    margin: auto;
    margin-top: auto;
    margin-right: auto;
    margin-bottom: 20px;
    margin-left: auto;
    padding: 0.5em;
    padding-top: 0.5em;
    padding-right: 0.5em;
    padding-bottom: 0.5em;
    padding-left: 0.5em;
    border: 1px solid rgba(255, 0, 0, 0.1);
    width: 95%;
    text-align: left;
}

.errordiv {
    background-color: #EA54551F;
    color: #EA5455;
    border-radius: 4px;
    margin: auto;
    padding: 0.5em;
    border: none;
    width: 100%;
    text-align: center;
    font-weight: 400;
    font-size: 14px;
}

.errorfield {
    background: #fff;
    box-shadow: 3px 3px 3px -3px rgb(0 0 0 / 15%), 0 0 0 1px red !important;
}

/*		Link Text for Errors, Warnings, and Confirmations		*/
.warningdiv>a,
.errordiv>a {
    color: #3498DB;
    text-decoration: none;
}

.successdiv a:link {
    background-color: #3498DB;
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    display: flex;
    text-decoration: none;
    height: 40px;
    width: 100%;
    align-items: center;
    justify-content: center;
    border-radius: 24px;
}

.successdiv a {
    color: #ffffff;
}

/*		Input		*/
.form-control {
    border: 2px solid #ccc;
}

.form-control:focus {
    border-color: #66afe9;
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    cursor: inherit !important;
    background-color: rgb(232, 240, 254) !important;
}

/*		Account Management		*/
.panel-title>a {
    color: #000;
}

.panel-heading {
    background-color: rgba(26, 26, 29, .02) !important;
}

.activityLabel {
    color: #000;
}

.panel {
    background-color: transparent;
    color: #000;
}

/* For IE11 */
@media all and (-ms-high-contrast: none),
(-ms-high-contrast: active) {
    .panel-default>.panel-heading {
        background-color: #fff;
    }
}

/* For MS Edge */
@supports (-ms-ime-align:auto) {
    .panel-default>.panel-heading {
        background-color: #fff;
    }
}

#lblLoggedInAs,
#lblLoggedInAsMobile {
    color: #000;
}

#lblLoggedInAsMobile {
    display: none;
}

/*		SSO Tiles		*/
#ssoSearch {
    width: 100%;
    padding-bottom: 0px !important;
}

/*#SAMLSSOTabContent{display: flex; flex-wrap: wrap;justify-content: space-evenly; margin-top: 5px;}*/
.rpdiv:hover {
    box-shadow: 0 12px 20px 0 #ed212787;
}

/* 2019-01-10 - Removed padding so tiles fit "3 per row" again */
#SSOContainer {
    background-color: #fff;
    color: #FFF;
}

/*		Self-Registration Page		*/
div.container div.displaybox.col-md-8.col-md-offset-2 {
    background-color: transparent;
}

/*		Horizontal Rule Spacers for HelpDesk and Admin Dashboard		*/
hr {
    border-color: #EEE;
}

/*		Help Desk Background		*/
.HelpDeskActions {
    background-color: transparent;
    border-radius: 4px;
    border: 2px solid #000;
    padding: 20px;
}

/*		Admin Dashboard User Detail Lookup Utility		*/
#ReportBody {
    /*background-color: rgba(51,51,51,0.5);*/
    border-radius: 4px;
    border: 2px solid #000;
    padding: 20px;
}

tr:nth-child(even) {
    background-color: rgba(0, 0, 0, 0.1);
}

#UserProfileData,
#NoUserSelected {
    /*background-color: rgba(51,51,51,0.5);*/
    border-radius: 4px;
    border: 2px solid #000;
    padding: 20px;
}

/*	Uncomment to add transparent background to User Detail Lookup */
.sectionHeader {
    color: #000;
}

/*	User Menu Text	*/
.usrMenuBtn {
    text-align: center;
}

.usrMenuBtn:hover {
    cursor: pointer;
}

#hidden,
.hidden {
    display: none !important;
}

#userMenu {
    margin-right: 25px;
}

#userMenuList {
    list-style: none;
    padding: 10px 0px 10px 0px;
}

#userMenuList li,
#userMenuList li a {
    background-color: transparent;
    color: #000;
}

#userMenuList li:hover,
#userMenuList li a:hover {
    color: #ed2127;
}

.userMenuItem {
    padding: 0px 20px 0px 20px;
    font-size: 1.5em;
    display: inline-grid;
    grid-template-columns: 50px auto;
}

.userMenuItem a {
    color: #fff;
    text-decoration: none;
}

.userMenuItem a:hover,
.userMenuItem a:focus {
    color: #fff;
}

#menuWrapper {
    margin-top: 15px;
    margin-right: 5vw;
}

/*	User Menu Popup	*/
#tippy-1>.tippy-box {
    background-color: #fff !important;
    box-shadow: 0px 24px 56px -8px rgba(26, 26, 29, .16);
    border-radius: 10px;
}

#tippy-1>.tippy-box>.tippy-arrow {
    color: #fff !important;
}

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

.tal {
    text-align: left !important;
}

.tar {
    display: none !important;
}

.fr {
    float: right !important;
}

/*	Footer	*/
#footerLogo {
    /*content:url('/_layouts/images/PG/images/bk.svg');*/
    max-height: 20px;
}

#copyrightLogoContainer {
    order: 1;
    flex: 2;
}

#footerHelp {
    order: 2;
    flex: 2;
}

#copyrightTextContainer {
    order: 3;
    flex: 2;
}

/*		Additional Custom CSS		*/

/*		End Additional Custom CSS		*/

/*	Media Queries	*/
@media all and (min-width: 320px) {
    #login {
        margin-top: 0px;
    }
}

@media all and (max-width: 800px) {
    .branded-footer {
        display: none !important;
    }
}

@media all and (max-width: 600px) {

    /*#maintitle{display:none;}*/
    #searchBarDiv>input {
        width: 100%;
    }

    .deleteLink {
        float: left !important;
        padding-right: 0px !important;
    }
}

@media all and (max-width:768px) {

    #copyrightLogoContainer,
    #footerHelp,
    #copyrightTextContainer {
        display: none !important;
    }

    .opaque {
        margin-top: 50px;
    }

    #menuWrapper {
        margin-right: 2.5vw;
    }

    #lblLoggedInAs {
        display: none;
    }

    #lblLoggedInAsMobile {
        display: inline-block;
    }

    /* 2021-02-16: Don't apply the larger width to mobile */
    .logonbox {
        background-color: transparent;
        border-radius: 10px;
        width: 330px;
    }

    .popupWin {
        z-index: 1;
        margin-top: 0px;
        width: 330px;
        height: auto !important;
    }

    .popupWin>* {
        background-color: #FFFFFF;
    }

    .secondaryWrapper {
        width: 330px;
    }

  
}

li[aria-expanded=true] {
    pointer-events: none;
}

#ssoGroupCreationHelp {
    margin-bottom: 0;
}

.ssoGroupName {
    min-width: 200px;
}

#SSUsername {
    display: flex;
    flex-direction: column;
    margin-bottom: 10px !important;
}

.buttonsContainer {
    padding: 0;
    display: flex;
    justify-content: center;
    flex-direction: column;
}

.continueContainer {
    padding: 0;
}

.cancelContainer {
    padding: 10px 0 20px 0;
}

#btnSSCancel {
    background-color: #FFFFFF !important;
    border: 1px solid #B4241D !important;
    color: #B4241D;
}

#btnSSCancel:hover {
    color: #B4241D !important;
}

#btnSSCancel:focus {
    color: #B4241D !important;
}

#fldsSS {
    width: 90%;
}

#SSTitle {
    margin-top: 40px;
    color: #5E5873;
    font-weight: 600;
    font-size: 18px;
}

#SSForm {
    box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.2) !important;
    border-radius: 8px;
}

.popupInstructions {
    color: #6E6B7B;
    padding: 0 15px 0 15px;
    margin-bottom: 20px;
    width: 90%;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
}


#btnCloseResendOTP {
    display: block;
    margin: 0 auto;
    width: 100px;
}

#SSAction2 {
    display: none;
}

.successdiv .pgh3 {
    margin-bottom: 30px;
}

.control-label {
    padding-bottom: 3px;
    padding-top: 4px;
}

.containerPGButton {
    margin-bottom: 25px;
}

.containerPGButton .col-xs-6 {
    padding-right: 7px;
    padding-left: 7px;
}

#SSChooseAuth {
    display: none;
}


.lblRadioDisabled {
    cursor: none !important;
    display: none !important;
}

#ErrMsgSS {
    width: 90% !important;
    padding: 0 15px;
    font-size: 14px;
    font-weight: 400;
    color: #6E6B7B;
}

.resendLink {
    margin-left: 0 !important;
}

.confDsp {
    color: #B4241D !important;
    padding-left: 0 !important;
    font-style: normal !important;
}

.pgh3 {
    font-size: 1em !important;
}

.otpresendPopup {
    position: absolute !important;
    text-align: left !important;
    z-index: 10002 !important;
    padding: 20px !important;
    background-color: #dadbdf !important;
    border: none !important;
    color: #80848e !important;
    font-size: 1.125em !important;
    box-shadow: 5px 5px 5px -4px rgb(0 0 0 / 15%), 0 0 30px 0 rgb(0 0 0 / 45%) !important;
}

.pgInputBtn {
    background-color: #006EAB;
    color: #FFFFFF;
    width: 180px;
    height: 40px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 8px;
    outline: none;
    border: none;
}

.bodyFlex {
    background: transparent;
    box-shadow: none;
    background-repeat: no-repeat;
    background-size: 200px;
    background-attachment: fixed;
    background-position-x: center;
    background-position-y: 20px;
}

.form-control {
    font-size: 1em;
    color: #636771 !important;
    border-radius: 8px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
}



#BrandedLogo {
    display: none !important
}



.branded-footer {
    display: none !important
}

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

.infoSS {
    width: 100%;
}

.UsernameSSContainer {
    width: 100%;
}

#UsernameSS {
    border: 1px solid #B9B9C3 !important;
    border-radius: 5px !important;
    box-shadow: none !important;
    font-size: 14px;
}

#lblUNameSS {
    font-weight: 600 !important;
    color: #6E6B7B !important;
    font-size: 14px !important;
}

.mainFlex {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

#SSOTPEntry {
    display: flex;
    flex-direction: column;
    margin-bottom: 0;
}

#lblOTPSS {
    font-size: 14px;
    font-weight: 600;
    color: #6E6B7B;
    padding-top: 0;
}

#spnResendSS {
    font-size: 14px;
    font-weight: 400;
}

#OTPSS {
    font-size: 14px;
    font-weight: 400;
    color: #6E6B7B;
}

#spnResendSS a {
    color: #3498DB;
    text-decoration: none;
}

.resend-container {
    text-align: center;
    padding-top: 10px;
}

#SS_NewPW {
    display: flex;
    flex-direction: column;
    margin-top: -10px;
}

#NewPasswordLabel {
    font-weight: 600;
    font-size: 14px;
    color: #6E6B7B;
}

#ConfirmPasswordLabel {
    font-weight: 600;
    font-size: 14px;
    color: #6E6B7B;
}

#SSNewPassword {
    font-size: 14px;
}

input#SSNewPassword::-ms-reveal {
    display: none;
}

#ConfirmPasswordSS {
    font-size: 14px;
}

input#ConfirmPasswordSS::-ms-reveal {
    display: none;
}

.password-reveal-eye {
    position: absolute;
    top: 9px;
    right: 30px;
    cursor: pointer;
}

.pw-reset-success {
    margin-bottom: 1rem;
    height: 100px;
}

.branding {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 2rem;
    background: transparent;
}

.branding .primary {
    width: 55%;
}

.branding .secondary {
    width: 18%;
}

#btnSSContinueDis {
    width: 100% !important;
    border-radius: 24px !important;
}

#chevronContinueBtn {
    position: absolute;
    top: 22px;
    left: 128px;
}

#errMsgSSContainer {
    color: #EA5455;
    background: rgba(234, 84, 85, 0.12);
    border-radius: 4px;
    padding: 0.5em;
    text-align: center;
}

/* COOLER*/
:root {
	--White:#fff;
	--Black:#27292A;
	--Blueberry-50:#F5FCFF;
	--Blueberry-100:#E5F7FF;
	--Blueberry-200:#ADE6FF;
	--Blueberry-300:#6BD2FF;
	--Blueberry-400:#29BEFF;
	--Blueberry-500:#009EE3;
	--Blueberry-600:#007CB2;
	--Blueberry-700:#005980;
	--Blueberry-800:#00354D;
	--Blueberry-900:#00121A;
	--Strawberry-50:#FDF1F1;
	--Strawberry-100:#FAD1D1;
	--Strawberry-200:#F4A4A4;
	--Strawberry-300:#EF7676;
	--Strawberry-400:#EA4848;
	--Strawberry-500:#E41B1B;
	--Strawberry-600:#B71515;
	--Strawberry-700:#891010;
	--Strawberry-800:#5B0B0B;
	--Strawberry-900:#2E0505;
	--Sand-50:#FAFAFA;
	--Sand-100:#F4F5F5;
	--Sand-200:#E4E6E7;
	--Sand-300:#D4D7D8;
	--Sand-400:#A1A8AA;
	--Sand-500:#71777A;
	--Sand-600:#52585B;
	--Sand-700:#3F4446;
	--Sand-800:#27292A;
	--Sand-900:#181A1B;
	
}

@font-face {
  font-family: 'Early Sans Variable'; 
  src: url('../fonts/EarlySansVariable.ttf') format('truetype');
  font-weight: 100 900; 
  font-style: normal;
}

html:has(#Cooler){
	font-family: 'Early Sans Variable', sans-serif;
	font-size:16px;	
}

#Cooler {
    background-image: url(../images/clouds_background.svg);
    background-color: var(--Sand-100);    
    background-attachment: fixed;
    background-size: auto 100%;
    background-repeat: no-repeat;
    font-family: 'Early Sans Variable', sans-serif;
    font-size: 16px;
    * {
		font-size:16px;
		color:var(--Black);
		line-height:24px;	
		font-family: 'Early Sans Variable', sans-serif;
	}	
	/* reset */
	.background-default { display:none;}
	.custom-background  { display:none;}
	#SSForm {width:400px; padding:1.5rem; border-radius:16px;}
	#SSTitle {font-weight:500; font-size:1.25rem; color:var(--Blueberry-800); margin:0; line-height:25px; padding: 0 0 0.5rem 0;}
	.popupInstructions {padding:0 0 1rem 0; margin-bottom:0; width:100%;}
	.popFieldsContainer {padding:0 !important;}
	.containerPGButton {margin-bottom:0;}
	.cancelContainer {padding-bottom:0;}
	.popupWin {width:400px;}
	#fldsSS {width:100%;}
	#popup_SS {padding-top:5rem;}
	.row > * {padding:0;}
	.col-md-12 {padding:0 !important;}
	.col-sm-12 {padding:0 !important;}
	#SSOTPEntry {margin:0 !important;}
	.successdiv { margin-bottom:40px;}
	
	.branding {flex-direction: row; justify-content: space-between;   padding: 0 1.5rem 1.5rem !important; margin-bottom:0;}
	.branding .primary{display: block; height: 32px; aspect-ratio: 120 / 32; width:auto;}
	.branding .secondary {display: block; height: 32px; aspect-ratio: 107 / 32;  width:auto;}
	
	/*errors*/
	#ErrMsgSS {width:100% !important; padding:0;}
	#errMsgSSContainer { background-color:transparent; text-align:left; font-size:12px; padding:0 0 1rem 0;	}
	#errMsgSSContainer .bold {font-size:12px; font-weight:400; line-height: 18px;}
	
	
	.errordiv { margin:1rem 0; background-position: 10px 10px; background-repeat:no-repeat; text-align:left; background-color:var(--Strawberry-50); color:var(--Strawberry-600); padding: 0.5rem 0.5rem 0.5rem 0.5rem;}
	.errordiv .pgh3 {color:var(--Strawberry-600); font-weight:400;}
	.errordiv a {color:var(--Strawberry-600); text-decoration:underline;}
	.errordiv .boldred {color:var(--Strawberry-600);}
	
	/*forms*/	
	.control-label{ font-weight:500 !important; color:var(--Black)!important; font-size:16px!important; }
	.form-control{ border-color:var(--Sand-300) !important; transition:all 0.225s ease;}	
	.form-control:hover {border-color:var(--Sand-500) !important;}
	.form-control[disabled], .form-control[readonly], fieldset[disabled] {background-color:var(--Sand-100) !important}
	.form-control[disabled]:hover,
	.form-control[readonly]:hover,
	fieldset[disabled]:hover {border-color:var(--Sand-300) !important;}
	input[type=text]:-ms-input-placeholder {color:var(--Sand-400);}
	input[type=text]::-webkit-input-placeholder {color:var(--Sand-400);}
	input[type=text]::-moz-placeholder {color:var(--Sand-400);}
	input[type=text]:-ms-input-placeholder {color:var(--Sand-400);}
	input[type=password]:-ms-input-placeholder{color:var(--Sand-400);}
	input[type=password]::-webkit-input-placeholder {color:var(--Sand-400);}
	input[type=password]::-moz-placeholder {color:var(--Sand-400);}
	input[type=password]:-ms-input-placeholder {color:var(--Sand-400);}	
	.form-horizontal .form-group{ margin:0 !important; }
	
	#NewPasswordLabel{ margin-top:1.75rem;  padding-bottom: 0.25rem !important;}
	#ConfirmPasswordLabel{ margin-top:1.25rem;     padding-bottom: 0.25rem !important;}
	#lblOTPSS {margin-top:1rem;}
	#lblUNameSS { padding-bottom: 0.25rem !important;}
	.wwRulesTitle,
	.wwRulesList,
	.wwRulesList li span,
	.wwInnerRulesList,
	.wwInnerRulesList li span,
	#iisRule	{font-size:12px; line-height:18px;}
	.pwrulebad,
	.pwruleok { font-weight:400; font-style:normal;}
	
	.wwRulesList {margin-bottom:0rem; padding-left: 22px;}
	.wwInnerRulesList {margin-bottom:0rem; padding-left: 22px;}
	
	/*buttons*/
	.PGButton {font-weight:500; background-color:var(--Blueberry-700); color:var(--White); margin-top: 1rem;}
	.PGButton:hover {background-color:var(--Blueberry-800) !important;}
	.PGButton:focus {background-color:var(--Blueberry-800) !important;}
	#btnSSCancel.PGButton {background-color:var(--Sand-100) !important; border:none !important; color:var(--Blueberry-700);}
	#btnSSCancel.PGButton:hover {background-color:var(--Sand-200) !important;  color:var(--Blueberry-700) !important;}
	#btnSSCancel.PGButton:focus {background-color:var(--Sand-200) !important;  color:var(--Blueberry-700) !important;}	
	.PGButtonDisabled  { opacity:0.3; background-color:var(--Blueberry-700) !important;}

	.confDsp {color:var(--Black) !important}
	#spnResendSS {display:block; text-align:center; padding: 0.75rem 0 0.5rem 0;}
	#spnResendSS a { color:var(--Blueberry-500) !important;  font-size:14px; line-height:18px;}
	
	#popup_OTPResend {box-shadow:0 0 0 100vmax rgba(18, 18, 18, 0.15) !important; width:480px; border-radius:8px; padding:0 1.5rem 1.5rem 1.5rem !important;}
	#popup_OTPResend ol,
	#popup_OTPResend ul	{ padding-left:1rem;}
	#popup_OTPResend a {color:var(--Blueberry-700);}
	#popup_OTPResend p:empty { margin-bottom:0;}
	
	#lblOTPResendTitle {padding:1.5rem 0;}
	#lblOTPResendHeader {display: flex; align-items: center; justify-content: space-between;color:var(--Blueberry-800); background-color:var(--Sand-100); line-height:64px; padding:0 1.5rem; margin:0 -1.5rem; font-weight:500; font-size:1.25rem; }
	#lblOTPResendHeaderClose{background-image:url(../images/close_icon.svg); display:block; height:24px; width:24px; cursor:pointer;}
	#btnCloseResendOTP {margin: 0 0 0 auto;}
	
	
    @media (max-height: 489px) {
      #popup_SS {padding-top: 1rem;}
	  .branding {padding-bottom:1rem !important;}
      .branding .primary { height:18px !important; transform: translateY(3px);}
      .branding .secondary{ height:18px !important;}    
    }

    @media all {
		.col-md-12 {
			width: 100%;
		}
	}
}