@font-face {
  font-family: "FSAlbert";
  src: url(/layouts/images/PG/assets/fonts/FS-Albert-Arabic-Web.ttf);
}
@font-face {
  font-family: "FSAlbertBold";
  src: url(/layouts/images/PG/assets/fonts/FS-Albert-Arabic-Web-Bold.ttf);
}
@font-face {
  font-family: "FSAlbertlight";
  src: url(/layouts/images/PG/assets/fonts/FS-Albert-Arabic-Web-Light.ttf);
}

html { margin-left: calc(100vw - 100%); }
/*		Main Body Text		*/
html, body {font-family: 'FSAlbert'!important; color: #224d79; background-color: #224d79; background: url('/layouts/images/PG/images/gradient.svg') no-repeat center center fixed; background-size: cover;}


h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
  font-family: 'FSAlbertBold'!important;
}
/*		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;text-decoration: none !important;}
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;}

/*		Self-Service Dialogue Box Backgrounds		*/
#popup_OTPResend{background-color: #eee;}
.popupWin {background-color:transparent;z-index:1;margin-top: 50px; width: 400px;} /*2021-02-04: Same as above, fixed width */
.popFieldsContainer{width: 400px;}	/* 2021-02-19: For full-width fields on login popups */
#SSRecoveryActions, #SSEnrollmentAuth { margin-left: 20px; } /* 2021-02-19: Indent SS radio buttons */

/*	Input Fields	*/
.form-control{border: 1px solid #cbd6e2 !important; border-radius: 28px;}
.form-control:focus{border-color: #66afe9 !important; box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,0); -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,0);}

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

/*		Header Background		*/
.dlghdr{background-color: transparent;}
.dlghdr h1, .dlghdr h2 {color: #224d79;}

.loginHdr{background-color: transparent;}

img.svg-logo {
    height: 70px!important;
}
#BrandedLogo {
    max-height: 70px!important;
}
.logo-container {
    height: 83px!important;
}

#maintitle {
    padding-top: 4px;
}
.pgRPLink, .rplink {
    color: #224d79!important;
}
html, body {
    color: #224d79!important;
}

#userMenuList li, #userMenuList li a {
    color: #224d79!important;
}

#footerCorporateLink {
    max-height: 40px!important;
	padding-bottom: 7px!important;
}
.AMtable th { vertical-align: middle; text-align: center; border: 1px solid #ada9ae; padding: 3px; }
.AMtable td { vertical-align: middle; text-align: left; border: 1px solid #ada9ae; padding: 5px; }
.pgRP, .rpdiv {
    border: 2px solid #224d79!important;
}

#sortedList>li.activeGroup {
    border-top: solid 2px #ada9ae!important;
    border-right: solid 2px #fff!important;
    border-bottom: solid 2px #ada9ae!important;
    border-left: solid 2px #ada9ae!important;
    border-radius: 5px 0px 0px 5px;
    background-color: #fff;
}

#SSOContainer {
    border: 2px solid #ada9ae!important;
}

/*		Labels & Legends		*/
label{color: #224d79;}
legend, #SSActionChosen>span{color: #224d79;}

/*		Buttons		*/
.PGButton {
	color: #fff;
	border-radius: 6px;
    border: 2px solid #0a4d7c;
	line-height: 1.5;
    background-color: #224d79;
    border-color: #224d79;
}

.PGButton:hover, .PGButton:focus {
	color:#224d79;
    background-color: #f8d163;
    box-shadow: 0 10px 30px 0 rgba(165,160,160,0.32);
	border: 2px solid #f8d163;
}
.PGButtonDisabled { background-color: transparent; color:#808080; border: 2px solid #808080; }
.PGButtonDisabled:hover { color:#808080; }
.PGButtonDisabled:focus { color:#808080; }

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

/*		Errors, Warnings, and Confirmations		*/
.successdiv { background-color: #d1e7dd; border-color: #badbcc; color: #0f5132;}
.warningdiv { color: #664d03; background-color: #fff3cd; border-color: #ffecb5;}
.errordiv  { background-color: #e36159; border-color: #e1554c; color: #ffffff;}
.errorfield { color: #212529; background-color: #fff; border-color: #e36159!important;}
.errorfield:focus { border-color: #dc3545!important; box-shadow: 0 0 0 0.25rem rgb(220 53 69 / 25%)!important;}

/*		Link Text for Errors, Warnings, and Confirmations		*/
.successdiv>a, .warningdiv>a, .errordiv>a { color:#337ab7; }

/*		Input		*/
.form-control{border: 1px solid #cbd6e2 !important;border-radius: 6px !important;display: block;height: calc(1.5em + 1.2rem + 2px);padding: .6rem 1rem;font-size: 1rem;font-weight: 400;line-height: 1.5;color: #495057;background-color: #fff;background-clip: padding-box;border-radius: 6px;transition: border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out;}
.form-control:focus{color: #495057;background-color: #fff;border-color: #83adcb;outline: 0;box-shadow: 0 0 0 0.2rem rgb(56 108 160 / 25%);}

/*		Account Management		*/
.panel-title>a {color: #224d79;}
.panel-heading{background-color:rgba(26,26,29,.02)!important;}
.activityLabel{color:#224d79;}
.panel{background-color: transparent; color:#224d79;}
	/* 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:#224d79;}
#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 #0a4d7c87;}

/* 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: #224d79;}

/*	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: #224d79;}
#userMenuList li:hover, #userMenuList li a:hover { color: #0a4d7c;}
.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{text-align: right!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		*/
div#loginTitle {
    font-size: 30px;
    font-weight: 700;
}

#customTOUHTML{
    height: auto;
    max-height: 50vh;
    overflow: auto;
}

label.lableuoh {
    font-weight: 400;
    display: inline-block;
    font-size: .9em!important;
    text-align: right;
    float: right;
    color: #e36159;
}
.ssoHelpDiv {
    padding: 10px!important;
    margin: 15px 0px!important;
    border-radius: 5px!important;
    background-color: #08c!important;
    border-color: #007ebd!important;
    color: #fff!important;
    position: relative!important;
    padding: 1rem 1rem!important;
    margin-bottom: 1rem!important;
    border: 1px solid transparent!important;
    border-radius: .25rem!important;
}
/*		End Additional Custom CSS		*/

/*	Media Queries	*/
@media all and (min-width: 320px) {
	#login{margin-top: 0px;}
}
@media all and (max-width: 800px) {
	.branded-footer{margin-top:25px;}
}
@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{flex:7 1 100%;}
	.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 {background-color:transparent;z-index:1; margin-top: 0px; width: 330px;}
	.secondaryWrapper{width: 330px;}
	.popFieldsContainer{width: 330px;}	/* 2021-02-19: So fields on mobile use full width */
}

li[aria-expanded=true] { pointer-events: none; }
#ssoGroupCreationHelp { margin-bottom: 0; }
.ssoGroupName { min-width: 200px; }

.PGAltButton {
    color: #192321;
    margin-bottom: 20px;
    padding: 18px 15px;
	box-shadow: 0 1px 3px 0 rgba(50,69,66,0.07);
	transition: box-shadow .3s ease .1s;
    border: 1px solid #E8EFED;
    border-radius: 8px;
    background-color: #fff;
}

div#lblNafathTitle {
    font-size: 30px;
    font-weight: 700;
    text-align: center!important;
    line-height: 2.5;
}

input#btnChangeLang {
    width: 90px;
    height: 35px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 500;
    color: #000;
    background-color: #fff;
    border: none;
    border-radius: 45px;
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease 0s;
    cursor: pointer;
    outline: none;
}

input#btnChangeLang:hover {
    background-color: #224d79;
    box-shadow: 0px 15px 20px rgb(0 0 0 / 17%);
    color: #fff;
    transform: translateY(-2px);
}

select#listLangSel {
    padding: 0.4rem;
    cursor: pointer;
    border-radius: 45px;
    background-color: #f1f1f1;
    list-style: none;
}

.warningdiv {
    direction: rtl;
}