html, body {
	height: 100%;
	width: 100%;
	margin-left: auto;
	margin-right: auto;
	font-family: helvetica, arial, sans-serif;
	font-size: .95em;
}

body {
	height: 100%;
	/* min-width: 1024px; */
	padding: 0;
	margin: 0;
	overflow-x: auto;
    overflow-y: auto;
}

.bpopup {
	display: none;
	padding: 1em;
	background: white;
	display: none;
}

.form-group {
	margin: 0.5em 0;
}

#content {
	background-color: #fff;
	padding: 20px;
}

#home {
    width: 100%;
    text-align: center;
    padding-top: 50px;
}

#help-videos-bpopup {
	padding: 15px;
	min-width: 950px;
	background: white;
	display: none;
	border-radius: 10px;
}

#help-videos-bpopup .bClose {
	float: right;
	font-size: 1.3em;
}

#help-videos-bpopup p.description {
	margin-top: 10px;
}

#help-video-details {
	width: 50%;
	margin-left: auto;
	margin-right: auto;
}

#help-videos-bpopup .fa-close {
	cursor: pointer;
}

#help-link {
	cursor: pointer;
}

p {
	margin: 0;
	padding: 0;
}

a {
	text-decoration: none;
	color: #1d6076;
}

a:hover {
	text-decoration: underline;
	color: #174e60;
}

button,
.btn {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	background-color: #ccc;
	border: 1px solid #cdcdcd;
	color: #5D5D5D;
	font-size: .8em;
	padding: .2em .8em;
	margin: 0;
	cursor: pointer;
	background: rgb(246,246,246); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(246,246,246,1) 0%, rgba(224,224,224,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(246,246,246,1)), color-stop(100%,rgba(224,224,224,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(224,224,224,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(224,224,224,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(224,224,224,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(246,246,246,1) 0%,rgba(224,224,224,1) 100%); /* W3C */
}

.btn:hover {
	text-decoration: none;
}

button:hover,
.btn:hover {
	color: #000;
	-webkit-box-shadow: 0px 0px 3px 0px rgba(73,123,135,.25);
	-moz-box-shadow: 0px 0px 3px 0px rgba(73,123,135,.25);
	box-shadow: 0px 0px 3px 0px rgba(73,123,135,.25);
}

.fa {
	margin-right: .5em;
}

/* ---------
Header */

header {
	position: relative;
	color: #fff;
	overflow: auto;
	padding: 10px;

	background-color: #7d9096;
	background-image: url(../img/header-bg.png);
	background-image: url(../img/header-bg.png), -webkit-gradient(linear, 0 0, 0 100%, from(#7d9096), to(#576f77));
	background-image: url(../img/header-bg.png), -moz-linear-gradient(#7d9096, #576f77);
}

header a {
	color: #fff;
}

header #welcome-user, header #login {
	position: absolute;
	right: 15px;
	top: 15px;
}

header #logged-in-user { 
	position: absolute;
	bottom: 15px;
	right: 15px;
	list-style: none;
	padding: 0;
	margin: 0;
}

header #logged-in-user li {
	display: block;
	float: left;
	margin: 0;
	padding: 0 10px;
	border-right: 1px solid rgba(165,165,165,.5);
}

header #logged-in-user li:last-child {
	border: none;
	padding-right: 0;
}


#mpInfo, #rsInfo {
	border: 1px solid rgba(165,165,165,.5);
	border-radius: 8px;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	margin-top: 90px;
	padding: 10px;
	width: 800px;
}

#mpInfo h1, #rsInfo h1 {
	float: left;
	width: 735px;
	margin: 8px 0;
}

#mpInfo #edit-btn, #rsInfo #edit-btn {
	float: left;
	width: 55px;
	margin-top: 5px;
}

#mpInfo hr , #rsInfo hr{
	clear: left;
	display: block;
	height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 0;
    padding: 0;
}

.mpInfoSection, .rsInfoSection {
	float: left;
	width: 265px;
}

.mpInfoSection p, .rsInfoSection p {
	padding-bottom: 5px;
}

#mpInfo #notification-policy {
	clear: left;
	padding-top: 10px;
}

#mpInfo #notification-policy p {
	margin-bottom: 5px;
}

.add-entity-btn.btn {
	padding: 7px 10px 7px;
	font-size: 13px;
	border-radius: 5px;
	color: #fff;
	background: #66c66c;
}

.add-entity-btn.btn.top {
	position: absolute;
	top: 18px;
	right: 0px;
	margin-right: 20px;
}

.add-entity-btn.btn.bottom {
	margin-bottom: 12px;
	float: right;
}

.help-resource {
	margin-bottom: 50px;
}

.primary-btn {
	padding: 5px 10px;
	color: #fff;
	background: #66c66c;
}

.primary-btn:hover {
	color: #fff;
}

.add-entity {
	position: absolute;
	top: 2px;
	right: 0px;
	margin-right: 0px;
}
div#navbar {
    position: relative;
}
.add-sub-entity{
	position: absolute;
    top: 3px;
    right: 7px;
}

.rs-add-entity {
	position: absolute;
	top: 96px;
	right: 0px;
	margin-right: 20px;
}

.in-rs-add-entity {
	position: absolute;
	top: -36px;
	right: 0px;
	margin-right: 20px;
}


#refreshSubjectsBtn, #refreshNorthpointeSubjectsBtn {
	position: absolute;
	top: 31px;
	right: 15px;
	padding: 5px 10px;
}

.mp-subject-buttons-wrapper {
	position: absolute;
    right: 0;
    top: 22px;
}

.mp-subject-buttons-wrapper .add-entity, .mp-subject-buttons-wrapper #refreshNorthpointeSubjectsBtn, .mp-subject-buttons-wrapper #refreshSubjectsBtn {
	position: relative;
	right: auto;
	top: auto;
}

#needSentryCredentials {
	clear: both;
	font-size: 1.0em;
	font-weight: bold;
	color: rgb(182,20,12);	/* Bright Red */
	text-align: right;
}

#sentryRefreshMessage {
	display: inline-block;
	margin: 6px 12px;
	font-size: 1.0em;
	font-weight: bold;
	color: rgb(182,20,12);	/* Bright Red */
}
.sentryRefreshProblem {
	margin: 10px;
	font-size: 0.75em;
}

#navBarAdminBtn,
#backToSubjectsListBtn,
.back-btn.btn {
	padding: 7px 10px;
	display: inline-block;
	border: 1px solid #cdcdcd;
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	font-size: 1em;
	margin: 0px 15px 10px 0;
	cursor: pointer;
	color: #dddddd;
	background: rgb(64,64,64);
}
#navBarAdminBtn {
	float: left;
	padding: 5px 10px;
}

#navBarAdminBtn:hover,
#backToSubjectsListBtn:hover {
	color: #ffffff;
}

#navBarTitle {
	font-size: 24px;
	font-weight: bold;
	padding: 0;
	margin: 5px 0 10px 0;
}

.navBar {
	list-style-type: none;
	padding: 0;
	margin: 5px 0 10px 0;
	overflow: auto;
}


.navBar li {
	float: left;
	display: inline-block;
	border: 1px solid #cdcdcd;
	border-left: none;
	color: #5D5D5D;
	font-size: 1em;
	padding: 7px 12px;
	margin: 0;
	cursor: pointer;
}

.navBar li.current {
    cursor: default;
    background: rgb(246,246,246); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(246,246,246,1) 0%, rgba(224,224,224,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(246,246,246,1)), color-stop(100%,rgba(224,224,224,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(224,224,224,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(224,224,224,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(246,246,246,1) 0%,rgba(224,224,224,1) 100%); /* IE10+ */
	background: linear-gradient(to bottom,  rgba(246,246,246,1) 0%,rgba(224,224,224,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f6f6f6', endColorstr='#e0e0e0',GradientType=0 ); /* IE6-9 */
}
/* Flatter style for dropdowns (including navbar dropdown) */
#inventory-filter-dropdown li.current, .navBar ul li.current {
	cursor: default;
	background: #F2F2F2;
}

.navBar li:first-child { 
	border-left: 1px solid #cdcdcd;
	border-radius: 3px 0px 0px 3px;
	-moz-border-radius: 3px 0px 0px 3px;
	-webkit-border-radius: 3px 0px 0px 3px;
}

.navBar li:last-child { 
	border-radius: 0px 3px 3px 0px;
	-moz-border-radius: 0px 3px 3px 0px;
	-webkit-border-radius: 0px 3px 3px 0px;
}

#generate-invoice, #acknowledge-check, #reseller-invoice, #participant-details,#monitoring-notification,#generate_video_approval_report {
	text-decoration: none;
    color: #1d6076;
}

#generate-invoice:hover, #acknowledge-check:hover, #reseller-invoice:hover,#participant-details:hover,#monitoring-notification:hover,#generate_video_approval_report:hover{
	text-decoration: underline;
}

/*------ MP Report Modals ------*/
#activity-report-bpopup h2, #deactivation-report-modal h2 {
	margin-top: 0;
}

#activity-report-bpopup input[type="text"], 
#deactivation-report-modal input[type="text"] {
    font-size: 1em;
	padding: .5em;
	margin-bottom: 3px;

	width: 20em;
	border-radius: 3px;
	border: 1px solid transparent;
	border-bottom: 1px solid #DDD;
	box-shadow: inset 0 1px 2px rgba(0,0,0,.39), 0 -1px 1px #FFF, 0 1px 0 #FFF;
}

/*------ dropit menu ------*/
.navBar.dropit {
	overflow: visible;
}

.navBar .fa.fa-angle-down {
	margin-left: 4px;
	margin-right: 0;
}

.navBar ul.dropit-submenu {
	border: 1px solid #cdcdcd;
	background-color: #ffffff;
	min-width: 220px;
	margin-left: -1px;
}

.navBar ul.dropit-submenu li {
	float: none;
	display: block;
	border: none;
	border-bottom: 1px solid #cdcdcd;
}

.navBar ul.dropit-submenu :last-child {
	border: none;
}

.navBar .fa {
	float: right;
}

/*----- end dropit menu -----*/

dl {
	overflow: auto;
	display: table;
	width: 100%;
}

dt,
dd {
	float: left;
	margin: 0;
	display: table-cell;
	padding: .25em  .5em;
}

dt {	
	clear: left;
	width: 10%;
	font-weight: bold;
}

dd {
	width: 80%;
}


/* ---------
Modal Dialog box */

.dialog {
	display: none;
	position: relative;
	background: #fff;
	border: 1px solid #E6E6E6;
	margin-top: 10px;
	padding: 2em;
	border-radius: .3em;
	box-shadow: 0px 10px 20px 2px rgba(0,0,0,0.75);
	z-index: 10000;
	
	
}

.customdialog {
	left:initial !important;
	right:45px;
}

.dialog:not(.centered):after, 
.dialog:not(.centered):before {
	bottom: 100%;
	left: 80%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}

.dialog:not(.centered):after {
	border-color: rgba(246, 246, 246, 0);
	border-bottom-color: #fff;
	border-width: 10px;
	margin-left: -10px;
}
.dialog:not(.centered):before {
	border-color: rgba(230, 230, 230, 0);
	border-bottom-color: #E6E6E6;
	border-width: 11px;
	margin-left: -11px;
}

/* New Feature PopUps */
#feature-dialog {
	color: #fff;
	background-color: rgba(0, 26, 30, .9);
	background-image: url(../img/header-bg.png);
}

.feature-msg-close {
	float: right;
	color: #dddddd;
}

.feature-msg-close:hover {
	color: white;
}

#feature-msg-header, #feature-msg-body {
	text-align: center;
	margin: 20px;
	font-weight: lighter;
}

#feature-msg-header {
	font-size: large;
}

/* Dialog for Error Messages */
#northpointe-error-dialog {
	width: auto;
}

#northpointe-error-dialog h1 {
	color: rgb(182,20,12);
	font-size: 18px;
}

#northpointe-error-dialog p {
	font-size: 16px;
}

#northpointe-error-dialog .fa {
	color: black;
}

#northpointe-error-dialog .fa:hover {
	opacity: 0.8;
	cursor: pointer;
}


/* APPROVAL BUTTONS */
button.approval {
	padding: .5em 50px;
	font-weight: normal;
	font-family: "Lucida Grande";
	font-size: 1.2em;
	color: rgba(255,255,255,.95);
	background: none;
	background-color: #535353;
	border-radius: 2px;
	border-color: #333; 
	margin-left: .7em;
}

button.approve {
	background-color: #278935;
	border-color: #0F2A13;
}

button.approve:hover {
	background-color: #2B9539;
}

button.reject:hover {
	background-color: #9B000A;
}

button.reject {
	background-color: #8E0009;
	border-color: #1C0001; 
}

/* GENERATE VOUCHER INVOICE BPOPUP */

#vouch-invoice-bpopup h3 {
	text-align: center;
}

#vouch-inv-error {
	display: none;
	text-align: center;
	font-weight: bold;
	color: rgb(182,20,12);
	padding-bottom: 10px;
}

#vouch-inv-gen {
	padding: 7px 20px;
    font-size: 1.2em;
    color: rgba(255,255,255,.95);
    background: none;
    background-color: #821D02;
    border-radius: 4px;
    border: 1px solid #000;
    margin: 10px;
}

#vouch-inv-dates {
	display: block;
	margin: 5px;
}

#vouch-inv-dates input {
	font-size: larger;
	padding: 5px;
	width: 130px;
	margin: 3px;
}

#vouch-inv-dates input:disabled {
	opacity: 0.7;
}

#vouch-all-dates {
	margin: 0 6px 6px 10px;
}

.shelter-button.btn{
	position: absolute;
	top: 101px;
	right: 22px;
	padding: 7px 10px 7px;
	font-size: 13px;
	border-radius: 5px;
	color: #fff;
	background: #66c66c;
}

@media only screen and (max-width: 1500px) {
	ul.navbar-top-custom > li {
	  /* width: 30.33%; */
	  width: 33.33%;
  }
  
  ul.navbar-top-custom{
	  float:left;
	  width:100%;
  }
  
  }
  
  @media only screen and (max-width: 768px) {
	ul.navbar-top-custom li {
	  width: 50%;
  }
  
  ul.navbar-top-custom{
	  float:left;
	  width:100%;
  }
  
  }

  #participant-details-bpopup {
	width: 50%;
    left: 50% !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
}
#participant-details-bpopup .col-md-3 {
	margin-top: .5rem;
}
.cst-participant {
	display: flex;
    justify-content: space-evenly;
    margin-bottom: 1rem;
    align-content: stretch;
    flex-wrap: wrap;
    flex-direction: row;
}
#particpant_details_wrapper  {
	height: 350px;
	overflow-y: auto;
}
#adjust-checkins-dialog {
    padding: 0;
    right: 37px !important;
}
div#event_dialog #loading-container {
	left: 30% !important;
    top: 123px !important;
}
/* Upload file in s3 bucket nutton*/

#upload-btn-div{
	display: flex;
    width: 100%;
    position: relative;
}
#upload-btn-div form{
	position: absolute;
    right: 0;
}
#upload-btn-div input[type="file"]{
	border: 1px solid #ccc;
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;
}
#upload-btn-div input[type="submit"] {
    font-family: calibri;
    width: 110px;
    padding: 2px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border: 1px #BBB;
    text-align: center;
    background-color: #7d9096;
    cursor: pointer;
	font-size: 100%;
    height: 38px;
}
#activity-report-span{
	display: none;
	color:red
}

#offender-inactive{
	color:red
}
/* password eye css */
.password-container {
  position: relative;
  display: inline-block;
}

#toggle-new-password {
  position: absolute;
  top: 62%;
  right: 10px;
  transform: translateY(-50%);
  cursor: pointer;
}

#toggle-confirm-new-password {
  position: absolute;
  top: 62%;
  right: 10px;
  transform: translateY(-50%);
  cursor: pointer;
}
