

body.Portal{
	background-color: #c1d1dd;
	font-family: 'Inter', 'Roboto', 'Lato', 'Arial';
}




@media only screen and (max-width: 500px) {
	body.Portal{
		background-color: #F8F9FA;
	}
}

div.Portal{
	background-color: #F8F9FA;
}


div.CreateArea{
	background: #FFFFFF;
	border-radius: 20px;

	padding-bottom: 30px;
	padding-top: 11px;
	padding-left: 11px;
	padding-right: 11px;
}

@media only screen and (max-width: 500px) {
	div.CreateArea{

		padding-left: 10px;
		padding-right: 10px;
	}
}


@media only screen and (min-width: 501px) {
	div.Portal {
		width:800px;
		position: absolute;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		min-height: 100vh;
	}
}

@media only screen and (min-width: 1300px) {
	div.Portal {
		width:1300px;
		position: absolute;
		margin-left: auto;
		margin-right: auto;
		left: 0;
		right: 0;
		height=9000000px;
		min-height: 100vh;
	}
}

@media only screen and (max-width: 500px) {
	div.Portal {
		width:100%		
		min-height: 100vh;
	}
}



div.PortalHeader {    
	left: 0;
	right: 0;
	height: 60px;
	z-index: 1002;

	width:100%;
	margin-left: auto;
	margin-right: auto;
	left: 0;
	right: 0;
	background-color:#486484;
	padding-top: 10px;
	padding-left: 20px;
	padding-right: 20px;
}

div.PortalHeaderImage {    
	display: inline-block;
	margin:5px;
}

img.PortalHeaderImage {    
	height:30px;
}

div.PortalHeaderLinks {    
	float:right;
	display: inline-block;

	margin-top: 10px;
}

a.PortalHeaderLink {    
	color: #FFFFFF;
	margin-left: 10px;
}

span.PortalHeaderUser {    
	color: #FFFFFF;
	margin-left: 10px;
}








div.MenuSection {
	margin-top: 20px;
}


img.MenuItemHeader {
	width:20px;
}

span.MenuItemHeader {
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	color: #344054;
	flex: none;
	order: 1;
	flex-grow: 0;
	margin-left: 15px;
}

.MenuItem {
	margin-top:13px;
	padding-left:0px;
	padding-right:20px;
}
.MenuItem a {
	font-style: normal;
	font-weight: 500;
	font-size: 15px;
	line-height: 24px;
	color: #344054;
	flex: none;
	order: 0;
	flex-grow: 0;
}

.MenuItem li {
	height: 40px;
	padding-top: 8px;
	padding-left: 12px;
}


span.Title {
	font-style: normal;
	font-weight: 500;
	font-size: 30px;
	line-height: 38px;
	color: #101828;
	flex: none;
	order: 0;
	align-self: stretch;
	flex-grow: 0;
}

span.TitleHelp {
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	color: #667085;
	flex: none;
	order: 1;
	align-self: stretch;
	flex-grow: 0;
}






div.CreateFields {
	padding-top:20px;
	margin-left:100px;
}

@media only screen and (max-width: 500px) {
	div.CreateFields {
		margin-left:0px;
	}
}




div.CreateFooter {
	margin-top:40px;
	margin-left:20px;
	margin-right:20px;
}

@media only screen and (max-width: 500px) {

	div.CreateFooter {
		margin-top:40px;
		margin-left:2px;
		margin-right:2px;
	}
}


div.CreatePreviousButton {
	display: inline-block;
	margin-bottom:20px;
}

div.CreateNextButton {
	display: inline-block;
	float:right;
}

div.FieldLabel {
	margin-top:20px;
}

div.FieldControl {
	margin-top:6px;
}


span.FieldHeader {
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #344054;
	width: 100%;

	flex: none;
	order: 0;
	flex-grow: 0;
	display:block;
}

span.FieldHeaderAction {

	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;

	color: #667085;
}

span.FieldHeaderHelp {
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	color: #667085;
}

select.Field {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 14px;

	background: #FFFFFF;

	border: 1px solid #D0D5DD;

	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;

	width: 405px;
	height: 44px;


	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	color: #667085;
}

@media only screen and (max-width: 500px) {
	select.Field {
		width: 100%;
	}
}


input.Field {
	box-sizing: border-box;

	display: flex;
	flex-direction: row;
	align-items: flex-start;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 14px;

	width: 400px;
	height: 44px;

	background: #FFFFFF;

	border: 1px solid #D0D5DD;

	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;
}

@media only screen and (max-width: 500px) {
	input.Field {
		width: 100%;
	}
}


textarea.Field {
	box-sizing: border-box;

	display: flex;
	flex-direction: row;
	align-items: flex-start;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 14px;

	width: 400px;

	background: #FFFFFF;

	border: 1px solid #D0D5DD;

	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;
}

@media only screen and (max-width: 500px) {
	textarea.Field {
		width: 100%;
	}
}


div.CreateTitle {
	padding-top:20px;
	margin-left:100px;
}

@media only screen and (max-width: 500px) {

	div.CreateTitle {
		margin-left:0px;
	}
}




span.CreateTitle {

	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 28px;
	color: #101828;
}

span.CreateTitleHelp {
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #344054;
	width: 100%;

	flex: none;
	order: 0;
	flex-grow: 0;
}

a.CreateButtonNext{
	text-align: center;
	justify-content: center;
	align-items: center;
	padding: 10px 16px;
	gap: 8px;

	width: 100px;
	height: 40px;

	background: #3F87E9;
	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;

	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #FFFFFF;
}

a.CreateButtonBack{
	text-align: center;
	justify-content: center;
	align-items: center;
	padding: 10px 16px;
	gap: 8px;

	width: 100px;
	height: 40px;

	background: #FFFFFF;

	border: 1px solid #D0D5DD;

	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;

	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;

	color: #344054;
}









a.CreateHyperlink{
	font-style: normal;
	font-weight: 500;
	font-size: 15px;
	line-height: 20px;
	text-decoration-line: underline;
	color: #3F87E9;
}


a.CreateHyperlinkButton{
	box-sizing: border-box;

	padding-top: 10px;
	padding-left: 0px;
	padding-right: 13px;
	padding-bottom: 10px;

	border: 0px solid #3F87E9;
	border-radius: 8px;
	display: inline-block;
}

span.CreateHyperlinkButton{
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;

	margin-left: 8px;
	color: #3F87E9;
}

img.CreateHyperlinkButton {
	width:10px;
}

img.CreateHyperlinkAddButton {
	width:16px;
}





span.CreateCheckListHeader{
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #000000;
	display: block;	
	margin-bottom: 15px;
}

CreateCheckListChecked.input{
	box-sizing: border-box;

	width: 16px;
	height: 16px;
	background: #FFFFFF;
	border: 1px solid #D0D5DD;
	border-radius: 4px;
}

div.CreateCheckListChecked{
	display: inline-block;
	width:20px;
	float: left;
}

div.CreateCheckListName{
	margin-left: 35px;
	margin-right:30px;
}

span.CreateCheckListName{
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 20px;
	color: #2C3038;
}






div.CreateDocument{
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 10px;
	padding-right: 10px;

	margin-left:0px;
	display: inline-block;
}

span.CreateDocumentHeader{

}

div.CreateDocumentIcon{
	display: inline-block;

	width: 40px;
	height: 40px;
	padding-top:8px;
	padding-left:13px;

	background: #F0F3F7;
	border-radius: 20px;
}

@media only screen and (max-width: 1300px) {
	div.CreateDocumentIcon{
		display: none;
	}
}


img.CreateDocumentIcon{
	width: 13px;
}

div.CreateDocumentName{
	display: inline-block;
	width: 300px;
}

span.CreateDocumentName{
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #101828;	
}

span.CreateDocumentHeader{
	font-weight: 600;
	margin-top: 20px;
	margin-bottom: 10px;
	display: inline-block;
}


div.CreateDocumentUpload{
	display: inline-block;
	width: 75px;
}

a.CreateDocumentUpload{
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #3F87E9;
}



div.CreateContactHeader{
   	padding-left: 15px;
}

div.ContactSelect{
	width: 70px;
}

div.ContactAvatar{
	width: 50px;
}

@media only screen and (max-width: 1300px) {
	div.ContactAvatar{
		display: none;
	}
}

div.ContactName{
	width: 250px;
}

div.ContactOrganization{
	width: 200px;
}

div.ContactType{
	width: 200px;
}



div.CreateContact{
	background: #FFFFFF;
	border: 1px solid #8EAEDE;
	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;
	margin-top:10px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 15px;
	padding-right: 15px;
}

div.CreateContactSelect{
	display: inline-block;	
	margin-right: 10px;
	float: left;
}

div.CreateContactFields{
	margin-left: 30px;
}


div.CreateContactAvatar{

	width: 38px;
	height: 38px;

	background: #F7F9FA;
	border: 1px solid #DDE4ED;
	border-radius: 200px;	
	display: inline-block;

	padding-top: 5px;
	margin-right: 10px;

	display: inline-block;
 	vertical-align:top;
}

@media only screen and (max-width: 1300px) {
	div.CreateContactAvatar{
		display: none;
	}
}

span.CreateContactAvatar{
	font-style: normal;
	font-weight: 600;
	font-size: 12px;
	line-height: 15px;

	margin-left: 10px;
	
	color: #405D88;

}

span.CreateContactName {
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 16px;
	color: #000000;
}

span.CreateContactOrganization {
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 18px;
	color: #646D72;
}

span.CreateContactEmail {
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	color: #667085;	
}

div.CreateContactName{
	display: inline-block;
	width: 240px;
}

div.CreateContactOrg{
	display: inline-block;
	width: 240px;
}

div.CreateContactType{
	float: right;
	display: inline-block;	
}

@media only screen and (max-width: 1300px) {
	div.CreateContactType{
		float: none;
	}	
}


select.CreateContactType{
	width: 170px;
	height: 40px;

	background: #F4F7F8;
	border-radius: 8px;
	margin-bottom: 5px;
}


div.CreateSignatureCheckBox{
	margin-top: 20px;
}


span.ESignatureConditions{
	font-style: normal;
	font-weight: 400;
	font-size: 14px;
	line-height: 24px;
	color: #667085;
}

span.ESignatureAgree{
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 16px;
	color: #3F8CFF;
}





div.Search {
	padding-left: 15px;
	padding-right: 15px;
}

div.SearchItem {
	Display:inline-block;
}

select.FieldMyType {
	width: 200px;
}

input.FieldMyFilter {
	width: 200px;
}

div.SearchResults {
	margin-top: 10px;
}

span.SearchResults {
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #000000;
	margin-right: 10px;
}





a.SearchButton{

	justify-content: center;
	align-items: center;
	padding: 10px 16px;
	gap: 8px;

	height: 40px;

	background: #3F87E9;
	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;

	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #FFFFFF;

	margin-top: 10px;
	display: inline-block;
}

input.SearchField{
	box-sizing: border-box;
	padding: 10px 14px;
	gap: 8px;
	width: 343px;
	height: 45px;
	background: #FFFFFF;
	border: 1px solid #D0D5DD;
	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;

	margin-top: 10px;
	display: inline-block;
}


div.ActionFooter{
	margin-top: 40px;
}


div.CreateHyperlinkHeader{
	margin-top: 20px;
}

span.CreateHyperlinkHeader{
	margin-top: 10px;
	margin-bottom: 25px;
	width:100px;
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #344054;
}

div.NoFloat{
	float: none;
	margin-left: 10px;
}








div.DetailsSectionTop{
	margin-top: 40px;
}

div.DetailsSection{
	margin-top: 20px;
}

div.DetailsSectionHeader{
	margin-bottom: 10px;
	background: #F9FAFB;
	padding-top:15px;
	padding-bottom:10px;
	padding-left: 5px;
	border-radius: 8px;
	padding-right: 5px;
}

hr.DetailsSection{
	height: 1px;
	background: #EAECF0;
}


div.DetailsButtons{
	float:right;
	padding-right:0px;
}

a.DetailsButton{
	align-items: center;

	padding: 10px 16px;
	gap: 8px;
	background: #FFFFFF;
	border: 1px solid #D0D5DD;
	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;
	margin-left: 10px;

	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #344054;
}

select.DetailsButton{
	width: 150px;
	height: 35px;
	font-size: 15px;
	padding-top: 5px;
	padding-bottom: 5px;
}

img.DetailsButton{
	height: 15px;
	margin-right: 5px;
}

a.DetailsButtonPrimary{
	background: #3F8CFF;
	color: #FFFFFF;
}

span.DetailsSectionHeader{
	font-style: normal;
	font-weight: 500;
	font-size: 18px;
	line-height: 28px;
	color: #101828;
}


div.DetailsField{
	padding-top:10px;
	display: inline-block;
	padding-bottom: 10px;
	padding-left: 10px;
	width: 250px;
 	vertical-align:top;
}

div.DetailsVal{
	margin-top:5px;
}

span.DetailsFieldHeader{
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #667085;
}

span.DetailsFieldValue{
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	color: #344054;
}

span.DetailsFieldValueNonHighlight{
	font-weight: 300;
}


div.DetailsContact{
	display: inline-block;
	margin-right: 5px;
	Height: 115px;
}


div.DetailsDocument{
	border-radius: 0px 0px 14px 14px;
	box-shadow: 0px 1px 3px rgba(16, 24, 40, 0.1);
	width: 200px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	margin-top: 10px;
	display: inline-block;
	margin-right: 5px;
}

div.DetailsDocumentName{
	display:Inline-Block;
}

div.DetailsDocumentView{
	float:right;
}

a.DetailsDocumentView{
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #3F87E9;
}


span.DetailsDocumentName{
	font-style: normal;
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	color: #101828;																		color: #101828;
}

span.DetailsDocumentDate{
	font-style: normal;
	font-weight: 400;
	font-size: 12px;
	line-height: 20px;
	color: #667085;
}



div.InspectionDate{
	width:100px;
}

div.InspectionName{
	width:150px;
}

div.InspectionStatus{
	width:100px;
}

div.InspectionInspector{
	width:120px;
}

div.InspectionComment{
	width:200px;
}

div.CheckListName{
	width:350px;
}


div.DetailsList{
	margin-bottom: 10px;
	margin-left: 5px;
}

div.DetailsListField{
	display: inline-block;
	vertical-align:top;
}


.DetailsList
    .DetailsList tr:nth-child(even)
    {
        background-color:#ffffff;
    }
    .DetailsList tr:nth-child(odd)
    {
        background-color:#f9f9f9;
    }






div.ProjectDocumentUpload{
	width:250px;
}

div.ProjectDocumentView{
	width:100px;
}

div.ProjectDocumentName{
	width:400px;
	max-width:100%;
}

@media only screen and (max-width: 500px) {
	div.ProjectDocumentName{
		width:300px
	}
}

div.ProjectDocumentDate{
	width:100px;
}

div.ProjectDocumentStatus{
	width:100px;
}








div.ProjectDocumentName{
	width:400px;
	max-width:100%;
}

@media only screen and (max-width: 500px) {
	div.ProjectDocumentName{
		width:300px
	}
}





div.ProjectReviewer{
	width:250px;
}

div.ProjectReviewStatus{
	width:100px;
}

div.ProjectReviewStatus{
	width:200px;
	max-width:100%;
}

div.ProjectReviewComment{
	width: 100%;
}

@media only screen and (max-width: 500px) {
	div.ProjectReviewComment{
		width:300px
	}
}

div.ProjectEmail{
	margin-bottom: 20px;
}



div.PaymentHeader{
	padding-left: 5px;
}

div.PaymentItem{
	background: #FFFFFF;
	border: 1px solid #D0D5DD;
	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
}

div.PaymentItemSelect{
	width:50px;
}

div.PaymentItemStop{
	width:100px;
}

div.PaymentItemDate{
	width:100px;
}

div.PaymentItemType{
	width:300px;
}

div.PaymentItemTypeAccount{
	width:150px;
}

span.PaymentDate{
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 20px;
	color: #667085;
	margin-right:5px;
}

div.PaymentItemDescription{
	width:300px;
}

@media only screen and (max-width: 500px) {
	div.PaymentItemDescription{
		width:300px
	}
}

div.PaymentItemAmount{
	width:200px;
	text-align: right;
	padding-right: 20px;
}

div.PaymentStatus{
	width:150px;
}





div.Login{
	width: 400px;
	max-width: 100%;
}

div.LoginHeader{

}

span.LoginHeader{
	font-style: normal;
	font-weight: 600;
	font-size: 30px;
	line-height: 38px;
	text-align: center;
	color: #101828;
	display:block;
}

span.LoginInfo{
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	text-align: center;
	color: #667085;
	width:100%;
	display:block;
}

div.LoginInfo{
	margin-top: 12px;
}

div.LoginButton{
	margin-top: 30px;
	justify-content: center;
}

a.LoginButton{
	width: 30%;
	Display: Inline-Block;
}


div.LoginFooter{
	margin-top: 30px;
}

img.LoginBack{
	width: 10px;
	margin-right: 5px;
}

a.LoginBack{
	font-style: normal;
	font-weight: 500;
	font-size: 14px;
	line-height: 20px;
	color: #667085;
}







div.Results{
	background: #FFFFFF;
	border: 1px solid #D0D5DD;
	box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.05);
	border-radius: 8px;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	padding-right: 10px;
	margin-bottom: 7px;
}

div.Results1{
	width:400px;
}


div.Results2{
	width:400px;
}

div.Results3{
	width:300px;
}

div.Results4{
	width:300px;
}

div.Results5{
	width:200px;
}



@media only screen and (max-width: 500px) {
	div.Results1{
		width:300px
	}

	div.Results2{
		width:300px
	}
}

div.ResultsDetails{
	width:200px;
}




span.InspectionSchedulePermit{
	font-style: normal;
	font-weight: 600;
	font-size: 20px;
	line-height: 38px;
	color: #000000;
}

img.InspectionScheduleAddress{
	width: 12px;
	display: inline-block;
	margin-right: 5px;
}

span.InspectionScheduleAddress{
	font-style: normal;
	font-weight: 500;
	font-size: 15px;
	line-height: 38px;
	color: #667085;
}

span.InspectionScheduleType{
	font-style: normal;
	font-weight: 500;
	font-size: 17px;
	line-height: 21px;
	color: #000000;
}




div.Message{

}

span.Message{
	font-style: normal;
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	text-align: center;
	color: #667085;
}


div.HomeActionItemTop{
	display:inline-block;
}

.autoscrollable-wrapper{
	overflow: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
}