/* =========================================================================================================================
	Core SASS File that provides a single location for all CSS to be stored which is then imported by each theme SASS file.
	The Theme SASS file will define the individual variables for each theme, i.e. colors to create the file CSS file used.
	v8
   =========================================================================================================================
*/
/* =========================================================================================================================
	General Cross Site Styles
	Misc
   =========================================================================================================================
*/
Body {
  margin: 0;
  background-color: white;
  /*    padding-top: 75px;*/ /* Should add for the Bootstrap 4 pages */
  font-family: "Nunito Sans", sans-serif;
}

.navbar-brand img {
  height: 40px;
}

#MainPanes {
  width: 100%;
  border: 0;
  padding: 0;
}

#MainPanes tr {
  vertical-align: top;
}

#MainPanes > td:nth-child(1) {
  width: 5px;
}

#MainPanes > td:nth-child(2) {
  width: 170px;
}

#MainPanes > td:nth-child(3) {
  width: 1px;
}

#MainPanes > td:nth-child(5) {
  width: 230px;
}

#MainPanes > td:nth-child(6) {
  width: 10px;
}

/* text style used for most text */
.Normal, .PHWizActivityPermission, .PHWizTable, .PHWizTableAddress, .NormalSpaced, .NormalRed, .NormalBold, .NormalRedBold {
  font-weight: normal;
  font-size: 14px;
  font-family: "Nunito Sans", sans-serif;
  line-height: 1.4;
  color: #000000;
}

.NormalBold, .NormalRedBold {
  font-weight: bold;
}

.NormalRed {
  color: red;
  line-height: inherit;
}

.NormalRedBold {
  color: red;
}

.NormalValidationErrors {
  color: red;
  font-weight: bolder;
  font-size: 15px;
  font-family: "Nunito Sans", sans-serif;
}

.NormalSmall, .NormalQuickLinks {
  font-weight: normal;
  font-size: 12px;
  font-family: "Nunito Sans", sans-serif;
  line-height: 13px;
  color: #000000;
}

.NormalSpaced {
  line-height: 20px;
  color: #000000;
}

.NormalSpaced li {
  margin: 15px 0;
  color: #000000;
}

.NormalTextHeading {
  color: #7413dc;
  font-weight: bold;
  font-size: 15px;
  font-family: "Nunito Sans", sans-serif;
  line-height: 17px;
}

.FontPrimary {
  color: #7413dc;
}

.FontSecondary {
  color: #00a794;
}

/* =========================================================================================================================
	General Cross Site Styles
	Headings and Titles
   =========================================================================================================================
*/
.Head {
  padding: 3px 5px;
  height: 25px;
  color: #7413dc;
  font-weight: bold;
  font-size: 17px;
  font-family: "Nunito Sans", sans-serif;
}

.HeadNoBackground {
  padding: 3px 5px;
  color: #00a794;
  font-weight: bold;
  font-size: 17px;
  font-family: "Nunito Sans", sans-serif;
}

/* style of item titles on edit and admin pages */
.SubHead {
  padding: 3px 5px;
  background-position: center center;
  background-repeat: repeat-x;
  color: #7413dc;
  font-weight: bold;
  font-size: 16px;
  font-family: "Nunito Sans", sans-serif;
}

/* module title style used instead of Head for compact rendering by QuickLinks and Signin modules */
.SubSubHead {
  color: #00a794;
  font-weight: bold;
  font-size: 15px;
  font-family: "Nunito Sans", sans-serif;
}

.clickable {
  cursor: pointer;
}

.panel-heading span {
  margin-top: -18px;
  font-size: 15px;
}

.panel-primary > .panel-heading .badge {
  color: #7413dc;
  background-color: #fff;
}

.panel-heading .badge {
  margin-top: -2px;
  font-size: 12px;
}

.pager {
  margin: 8px 0;
}

/* =========================================================================================================================
	General Cross Site Styles
	Headings and Titles
   =========================================================================================================================
*/
.footer {
  width: 100%;
  height: 45px;
  line-height: 45px;
  background-color: #7413dc;
  color: white;
  z-index: 6;
}

.footer-fixed-bottom {
  position: fixed;
  bottom: 0;
  width: 100%;
  height: 30px;
  line-height: 30px;
  background-color: #7413dc;
  color: white;
  z-index: 6;
}

#footerfixed_hypPrivacyPolicy {
  color: white;
}

#footer_hypPrivacyPolicy {
  color: white;
}

.footer-fixed-bottom div a:visited {
  color: white;
}

.footer-fixed-bottom div a:link {
  color: white;
}

.footer-fixed-bottom div a:hover {
  color: white;
  text-decoration: underline;
}

.footer-fixed-bottom div a:active {
  color: white;
}

.footer div a:visited {
  color: white;
}

.footer div a:link {
  color: white;
}

.footer div a:hover {
  color: white;
  text-decoration: underline;
}

/* =========================================================================================================================
	General Cross Site Styles
	Hyperlinks and Standard Navigation
   =========================================================================================================================
*/
a:link {
  color: #e22e12;
  text-decoration: none;
}

a:visited {
  color: #e22e12;
  text-decoration: none;
}

a:active {
  color: #23a950;
  text-decoration: none;
}

a:hover {
  color: #23a950;
  text-decoration: underline;
}

a.btn:visited, a.btn:active, a.btn:link {
  color: white;
}

a.btn:hover {
  color: white;
  text-decoration: none; /* we don't want buttons with links to look like links. This should all be handled by bootstrap*/
}

body > footer > div > span > a {
  color: white;
}

/* For Use with Coloured Panels - ensuring no colour clash. See Forgot Pwd*/
a.PanelLink:visited:not(.footer) {
  color: #00a794;
}

a.PanelLink:link:not(.footer) {
  color: #00a794;
}

a.PanelLink:active:not(.footer) {
  color: #00a794;
}

a.PanelLink:hover:not(.footer) {
  color: #ffb4e5;
}

/* =========================================================================================================================
	General Cross Site Styles
	Text Boxes, Buttons and other Controls

	Many of these buttons are based on Bootstrap v3 - http://getbootstrap.com/getting-started/
   =========================================================================================================================
*/
.container-fluid {
  margin-top: 50px;
}

.NormalTextBox, .PHWizTableMedical, .txtEventConfSingle, .txtEventConfMulti {
  font-weight: normal;
  font-size: 13px;
  font-family: "Nunito Sans", sans-serif;
}

.CommandButton {
  font-weight: 500;
  font-size: 12.5px;
  font-family: "Nunito Sans", sans-serif;
}

.btnBase, input.aspNetDisabled[type=submit], .btnSmallSelect:hover, .btnSmallSelect, .btnSuperLargeEdit:hover, .btnSuperLargeEdit, .btnSuperLarge:hover, .btnSuperLarge, .btnDelete:hover, .btnDelete, .btnCancel:hover, .btnCancel, .btnEdit:hover, .btnEdit, .btnAdd:hover, .btnAdd, .btnSave:hover, .btnSave, .btnNormal:hover, .btnNormal, .btnActive:hover, .btnActive {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}

.btnActive {
  color: #fff;
  background-color: #7413dc;
  border-color: #7413dc;
}

.btnActive:hover {
  color: #fff;
  background-color: #6706cf;
  border-color: #6706cf;
}

.btnNormal {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}

.btnNormal:hover {
  color: #fff;
  background-color: #286090;
  border-color: #204d74;
}

.btnSave {
  color: #fff;
  background-color: #5cb85c;
  border-color: #5cb85c;
}

.btnSave:hover {
  color: #fff;
  background-color: #449d44;
  border-color: #419641;
}

.btnAdd {
  color: #fff !important;
  background-color: #5cb85c;
  border-color: #5cb85c;
}

.btnAdd:hover {
  color: #fff !important;
  background-color: #449d44;
  border-color: #419641;
}

.btnEdit {
  color: #fff;
  background-color: #d9534f;
  border-color: #d9534f;
}

.btnEdit:hover {
  color: #fff;
  background-color: #c9302c;
  border-color: #c12e2a;
}

.btnCancel {
  color: #fff;
  background-color: #f0ad4e;
  border-color: #f0ad4e;
}

.btnCancel:hover {
  color: #fff;
  background-color: #ec971f;
  border-color: #eb9316;
}

.btnDelete {
  color: #fff;
  background-color: red;
  border-color: red;
}

.btnDelete:hover {
  color: #fff;
  background-color: #D90000;
  border-color: #D90000;
}

.btnSuperLarge {
  color: #fff;
  background-color: #7413dc;
  border-color: #7413dc;
  width: 400px;
  height: 50px;
  text-align: center;
  vertical-align: central;
  line-height: 35px;
  font-size: 16px;
}

.btnSuperLarge:hover {
  color: #fff;
  background-color: #6706cf;
  border-color: #6706cf;
  width: 400px;
  height: 50px;
  text-align: center;
  vertical-align: central;
  line-height: 35px;
  font-size: 16px;
}

a.btnSuperLarge {
  color: #fff;
}

.btnSuperLargeEdit {
  color: white !important;
  background-color: #d9534f;
  border-color: #d9534f;
  width: 400px;
  height: 50px;
  text-align: center;
  vertical-align: central;
  line-height: 50px;
}

.btnSuperLargeEdit:hover {
  background-color: #D90000;
  border-color: #D90000;
  width: 400px;
  height: 50px;
  text-align: center;
  vertical-align: central;
  line-height: 50px;
}

.btnSmallSelect {
  color: #fff;
  background-color: #5cb85c;
  border-color: #5cb85c;
  height: 25px;
  text-align: center;
  vertical-align: central;
  line-height: 14px;
  font-size: 13px;
}

.btnSmallSelect:hover {
  color: #fff;
  background-color: #449d44;
  border-color: #449d44;
  height: 25px;
  text-align: center;
  vertical-align: central;
  line-height: 14px;
  font-size: 13px;
}

input.aspNetDisabled[type=submit] {
  background-color: grey;
  border-color: grey;
  color: white;
}

/* =========================================================================================================================
	General Cross Site Styles
	Used to Correct or modify generic bootstrap styles

	Bootstrap v3 - http://getbootstrap.com/getting-started/
   =========================================================================================================================
*/
.input-group-addon-glyphprofix {
  padding: 0px 4px;
}

.label {
  font-size: 95%;
}

/* =========================================================================================================================
	General Cross Site Styles
	Tables and Table Cells
   =========================================================================================================================
*/
/* This two classes support improved formatting of the ASP.Net Web Form controls when used with bootstrap. They format Radio Button Lists in forms such as register.ascx. */
.form-control td {
  padding-right: 8px;
}

.form-control input[type=radio] + label {
  padding-left: 5px;
}

/* More generic table settings */
.NormalTable {
  border-spacing: 0;
  padding: 0;
  width: 100%;
  border-width: 0;
  vertical-align: top;
}

TH.NormalTable {
  /*color: darkred;*/
  vertical-align: baseline;
  font-weight: bold;
  font-size: 15px;
  font-family: "Nunito Sans", sans-serif;
}

/* =========================================================================================================================
	General Cross Site Styles
	Panels
	These panels are based on Bootstrap v3 - http://getbootstrap.com/getting-started/
   =========================================================================================================================
*/
.panel {
  margin-bottom: 20px;
  background-color: #fff;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.05);
}

.panel-primary {
  border-color: #7413dc;
}

.panel-primary > .panel-heading {
  color: #fff;
  background-color: #7413dc;
  border-color: #7413dc;
}

.panel-heading {
  padding: 10px 15px;
  border-bottom: 1px solid transparent;
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
  color: #fff;
  background-color: #7413dc;
  border-color: #7413dc;
}

.panel-body {
  padding: 15px;
}

.panel-title {
  margin-top: 0;
  margin-bottom: 0;
  font-size: 16px;
  color: inherit;
}

.alert-primary {
  background-color: #f7f0fe;
}

.alert-secondary {
  background-color: white;
}

.modal-content > .modal-header {
  color: #fff;
  background-color: #7413dc;
  border-color: #7413dc;
}

/* =========================================================================================================================
	General Cross Site Styles
	Bootstrap v4 overrides
	These are based on Bootstrap v4 - http://getbootstrap.com/getting-started/
   =========================================================================================================================
*/
.bg-primary-event {
  background-color: #7413dc !important;
}

.bg-secondary-event {
  background-color: #23a950 !important;
}

.badge-primary-event {
  color: #fff;
  background-color: #23a950;
}

.badge-secondary-event {
  color: #fff;
  background-color: #7413dc;
}

.btn-primary-event {
  color: #fff;
  background-color: #7413dc;
  border-color: #420b7e;
}

.btn-primary-event:hover {
  color: #fff;
  background-color: #420b7e;
  border-color: #360967;
}

.btn-secondary-event {
  color: #fff;
  background-color: #23a950;
  border-color: #125528;
}

.btn-secondary-event:hover {
  color: #fff;
  background-color: #125528;
  border-color: #0d3f1e;
}

.card-primary-event {
  background-color: #7413dc;
}

.card-secondary-event {
  background-color: #23a950;
}

.table td, .table th {
  vertical-align: middle;
}

/* =========================================================================================================================
	General Cross Site Styles
	SyncFusion EJ2 Bootstrap v4 Controls overrides
   =========================================================================================================================
*/
.e-listview .e-list-item.e-active {
  background-color: #23a950;
  color: #fff;
}

/* =========================================================================================================================
	General Cross Site Styles
	Misc HTML Tags
   =========================================================================================================================
*/
UL LI :not(nav-item) {
  list-style-type: square;
}

HR {
  height: 1pt;
  color: dimgrey;
  text-align: left;
}

/* =========================================================================================================================
	DesktopBanner
	General
   =========================================================================================================================
*/
#Banner {
  min-height: 45px;
  height: 45px;
}

.Header {
  position: fixed;
  margin: 0;
  border-bottom: 0;
  top: 0;
  height: 45px;
  line-height: 45px;
  padding: 0 20px;
  background-color: #7413dc;
  width: 100%;
  z-index: 5;
}

.Header-Logo {
  background: url("/EventImages/Scouts2018/scoutsbannerlogo.png") no-repeat;
  position: fixed;
  margin: 0;
  top: 2px;
  left: 20px;
  height: 40px;
  line-height: 40px;
  background-color: #7413dc;
  max-width: 50px;
  min-width: 50px;
  width: 50px;
  white-space: nowrap;
  z-index: 6;
}

.smlogo {
  padding: 3px 105px 3px 15px;
  height: 40px;
  line-height: 45px;
  min-height: 40px;
  color: #ffffff;
  font-weight: bold;
  font-size: 33px;
  font-family: "Nunito Sans", sans-serif;
}

.Header-Left {
  position: fixed;
  margin: 0;
  top: 5px;
  left: 85px;
  height: 40px;
  line-height: 40px;
  background-color: #7413dc;
  max-width: 800px;
  min-width: 400px;
  width: 700px;
  white-space: nowrap;
  z-index: 6;
}

@media only screen and (max-width: 700px) {
  .Header-Left {
    visibility: hidden;
  }
}
.Header-Right {
  position: fixed;
  height: 40px;
  line-height: 47px;
  background-color: #7413dc;
  white-space: nowrap;
  top: 0px;
  right: 10px;
  min-width: 300px;
  text-align: right;
  z-index: 7;
}

/* =========================================================================================================================
	DesktopBanner 
	Menu
   =========================================================================================================================
*/
#spBanner-Menu {
  display: none;
  position: fixed;
  height: 180px;
  line-height: 30px;
  white-space: nowrap;
  top: 33px;
  right: 120px;
  width: 220px;
  text-align: left;
  z-index: 6;
  border: 0;
}

#DesktopBanner1_BannerMenu {
  color: white;
  text-align: left;
  font-weight: bold;
  font-size: 11px;
  font-family: "Nunito Sans", sans-serif;
  padding: 0;
  border: 0;
}

#DesktopBanner1_BannerMenu li {
  color: #fff;
  list-style-type: none;
  padding: 5px;
  background-color: #00a794;
}

#DesktopBanner1_BannerMenu li:hover {
  color: #ffe627;
  background-color: #e22e12;
}

.MenuItem {
  font-size: 13px;
  color: #fff;
}

#DesktopBanner1_BannerMenu > li > a {
  font-size: 13px;
  color: #fff;
}

#DesktopBanner1_BannerMenu li:hover > a {
  color: white;
}

#DesktopBanner1_BannerMenu > li.MenuItem > a {
  font-size: 13px;
  color: #fff;
}

#DesktopBanner1_BannerMenu > li.MenuItemOver > a {
  font-size: 13px;
  color: #ffe627;
  font-weight: bold;
  text-decoration: underline;
}

.MenuItemOver {
  padding: 2px 15px;
  border: 1px;
  border-style: solid;
  border-top-color: white;
  border-right-color: gray;
  border-bottom-color: gray;
  color: #3F3F3F;
  text-decoration: none;
  font-weight: bold;
  font-size: 13px;
  font-family: "Nunito Sans", sans-serif;
  cursor: pointer;
}

#spHeader-Right > a {
  color: #e22e12;
}

/* =========================================================================================================================
	DesktopBanner 
	Site Title, Site Link and About Links
   =========================================================================================================================
*/
.SiteTitle {
  height: 40px;
  line-height: 40px;
  min-height: 40px;
  color: white;
  font-weight: bold;
  font-size: 11pt;
  font-family: "Nunito Sans", sans-serif;
  vertical-align: top;
}

/* hyperlink style for the site links */
A.SiteTitle:link, A.SiteTitle:visited, A.SiteTitle:active, A.SiteTitle:hover {
  color: white;
  text-decoration: none;
}

.AboutLink {
  color: white;
  font-weight: bold;
  font-size: 10pt;
  font-family: "Nunito Sans", sans-serif;
  text-align: right;
}

/* text style used in DesktopBanner */
.SiteLink {
  color: #eeeeee;
  font-weight: bold;
  font-size: 11px;
  font-family: "Nunito Sans", sans-serif;
}

/* style for separator between elements on the desktopbanner */
.Accent {
  color: red;
  font-weight: bold;
  text-align: right;
}

/* =========================================================================================================================
	Modal Popup Banners
	For Messages, Search etc
   =========================================================================================================================
*/
/* ModalPopopBanner - for Messages*/
.modalBackgroundMsg {
  background-color: Black;
  opacity: 0.8;
  filter: alpha(opacity=90);
}

.modalPopupMsg {
  padding-top: 10px;
  padding-left: 10px;
  width: 550px;
  height: 200px;
  border: 3px solid black;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background-color: #FFFFFF;
}

/* ModalPopopBanner - for Search*/
.modalBackgroundSearch {
  background-color: Black;
  opacity: 0.8;
  filter: alpha(opacity=90);
}

.modalPopupSearch {
  padding-top: 10px;
  padding-left: 10px;
  width: 850px;
  height: 400px;
  border: 3px solid black;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background-color: #FFFFFF;
  position: fixed !important;
}

.modalPopupNotice {
  padding-top: 10px;
  padding-left: 10px;
  width: 750px;
  height: 370px;
  border: 3px solid black;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background-color: #FFFFFF;
}

@media (min-width: 768px) and (max-width: 991px) {
  .popupSearchResults {
    width: 560px;
    margin: auto;
    overflow: hidden;
  }
}
@media (min-width: 992px) {
  .popupSearchResults {
    width: 860px;
    margin: auto;
    overflow: hidden;
  }
}
@media (max-width: 767px) {
  .popupSearchResults {
    margin: 10px;
    width: 100%;
    overflow-x: auto;
  }
}
.popupSearchResults {
  font-weight: normal;
  font-size: 14px;
  font-family: "Nunito Sans", sans-serif;
  line-height: 28px;
  color: black;
  table-layout: fixed;
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
}

.popupSearchResults td {
  -ms-text-overflow: ellipsis;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.popupSearchResults td:nth-child(1) {
  min-width: 48px;
  width: 50px;
}

.popupSearchResults td:nth-child(2) {
  min-width: 210px;
}

.popupSearchResults td:nth-child(3) {
  min-width: 116px;
}

.popupSearchResults td:nth-child(4) {
  min-width: 160px;
}

.popupSearchResults td:nth-child(5) {
  min-width: 75px;
}

.popupSearchResults td:nth-child(6) {
  min-width: 45px;
  width: 55px;
}

.popupSearchResults td:nth-child(7) {
  min-width: 57px;
  width: 62px;
}

.popupSearchControls {
  position: relative;
  left: -7px;
  top: -5px;
  float: right;
}

/* =========================================================================================================================
	Form Wizards
	Generic Elements
   =========================================================================================================================
*/
/* WIZARD currently only used in the Register Activity Wizard but really cool! :) */
.stepCompleted, .stepCurrent, .stepNotCompleted {
  width: 15px;
  color: White;
  font-family: "Nunito Sans", sans-serif;
  font-size: 15px;
  text-align: center;
}

.stepNotCompleted {
  background-color: #00a794;
  border: 1px solid rgb(153, 153, 153);
  margin-right: 5px;
}

.stepCompleted {
  background-color: #23a950;
  border: 1px solid #4d4d4d;
}

.stepCurrent {
  background-color: #e22e12;
  border: 1px solid #e22e12;
}

.stepBreak {
  width: 3px;
  background-color: Transparent;
}

.wizardProgress {
  padding-right: 10px;
  font-family: "Nunito Sans", sans-serif;
  color: #333333;
  font-size: 15px;
}

.wizardTitle {
  color: black;
  font-weight: bold;
  font-size: 15px;
  font-family: "Nunito Sans", sans-serif;
  vertical-align: middle;
  float: left;
  background-color: #e22e12;
  width: 300px;
  min-height: 25px;
  border: 0;
  padding: 0;
  text-align: left;
}

#ctl04_wizpch > tbody > tr:first-child > td > table > tbody > tr:first-child {
  background-color: #e22e12;
}

.wizardSteps {
  vertical-align: middle;
  float: right;
  background-color: #e22e12;
  width: 50%;
  border: 0;
  padding: 0;
}

/* =========================================================================================================================
	CurrentRegistration Control
	Generic Elements
   =========================================================================================================================
*/
.CurrentRegistrationControl {
  max-width: 230px;
  min-width: 182px;
  text-align: right;
  /*float: right;*/
  border-collapse: separate;
  border-spacing: 2px;
  border-color: gray;
  line-height: 18px;
}

/* =========================================================================================================================
	Activity Registration
	Registration Wizard
   =========================================================================================================================
*/
.RegisterActivityHeaderBanner {
  background-color: #7413dc;
  border: 0;
  border-color: #7413dc;
  border-spacing: 0;
  padding: 0;
  min-height: 30px;
  height: 62px;
}

#RegWizButtons {
  position: relative;
  right: 0;
  width: 90%;
  float: right;
  text-align: right;
  margin: 10px;
}

.RegisterActivityWizardHeader {
  background-color: white;
  border: 0;
  border-spacing: 0;
  font-weight: bold;
  font-size: 0.9em;
  color: white;
  text-align: center;
}

/* Ensure all the ActivityWizard Update Panels in the Wizard Steps are the same height - ensure the buttons are in the same place!*/
.ActivityRegTable {
  width: 100%;
  min-width: 850px;
}

#tblActRegAdmin > tbody > tr > td:nth-child(1) {
  max-width: 100px;
  min-width: 50px;
}

#tblActRegAdmin > tbody > tr > td:nth-child(2) {
  max-width: 340px;
  min-width: 300px;
}

#tblActRegAdmin > tbody > tr > td:nth-child(3) {
  /*        width: 60%;*/
  min-width: 400px;
}

.ActivityRegBalloonPanel {
  color: red;
  font-weight: normal;
  font-size: 13px;
  font-family: "Nunito Sans", sans-serif;
  margin-bottom: 0;
}

/* =========================================================================================================================
	Activity Registration
	Risk Assessment File Upload
   =========================================================================================================================
*/
#RAFileUploadBox {
  width: 500px;
  height: 300px;
  padding: 10px 20px;
  font-size: 12pt;
  background-image: url("/images/themes/scouts/glyphicons-364-cloud-upload@3x.png");
  background-repeat: no-repeat;
  background-position: center;
  outline: 2px dashed #aaaaaa;
  outline-offset: -10px;
  -webkit-transition: outline-offset 0.15s ease-in-out, background-color 0.15s linear;
  -moz-transition: outline-offset 0.15s ease-in-out, background-color 0.15s linear;
  -o-transition: outline-offset 0.15s ease-in-out, background-color 0.15s linear;
  transition: outline-offset 0.15s ease-in-out, background-color 0.15s linear;
  text-align: center;
}

.upload {
  width: 0.1px;
  height: 0.1px;
  opacity: 0;
  overflow: hidden;
  position: absolute;
  z-index: -1;
}

.upload + label {
  font-size: 12pt;
  font-weight: 700;
  display: inline-block;
  padding: 5px;
}

/*.upload:focus + label,
.upload + label:hover {
	color: red;
}*/
.upload.has-advanced-upload {
  outline: 2px dashed #92b0b3;
  outline-offset: -10px;
  -webkit-transition: outline-offset 0.15s ease-in-out, background-color 0.15s linear;
  -moz-transition: outline-offset 0.15s ease-in-out, background-color 0.15s linear;
  -o-transition: outline-offset 0.15s ease-in-out, background-color 0.15s linear;
  transition: outline-offset 0.15s ease-in-out, background-color 0.15s linear;
}

.upload_box.is-dragover {
  outline-offset: -20px;
  outline-color: #c8dadf;
  background-color: #23a950;
}

.upload_box.is-uploading,
.upload_box.is-success,
.upload_box.is-error {
  display: block;
}

.upload_box.is-uploading {
  background-color: grey;
}

.upload_box.is-error {
  background-color: red;
}

#ctl04_upload_filename {
  vertical-align: bottom;
  vertical-align: bottom;
  position: relative;
  top: 220px;
}

label:hover strong {
  color: #39bfd3;
}

#RAFModalContent {
  top: 50px;
  height: 302px;
  width: 500px;
}

.upload_box.is-dragover {
  outline-offset: -20px;
  outline-color: #c8dadf;
  background-color: #23a950;
}

#RAApprovalBox {
  width: 600px;
  height: 300px;
  padding: 10px 20px;
  font-size: 12pt;
  text-align: center;
}

#RAApprovalModalContent {
  top: 50px;
  height: 302px;
  width: 600px;
}

/* =========================================================================================================================
	Modal Popup for Searching for Organisations 
	Summary Table
   =========================================================================================================================
*/
.modalBackgroundOrgSelect {
  background-color: Black;
  opacity: 0.8;
  filter: alpha(opacity=90);
}

.modalPopupOrgSelect {
  padding-top: 10px;
  padding-left: 10px;
  width: 750px;
  height: 400px;
  border: 3px solid black;
  -moz-border-radius: 15px;
  border-radius: 15px;
  background-color: #FFFFFF;
}

/* =========================================================================================================================
	Event Configuration
	General
   =========================================================================================================================
*/
.EventImageRight {
  float: right;
  margin: 50px 35px 35px 20px;
}

.SettingsTable > tbody > tr > td {
  padding: 2px 15px;
}

#ActivityManagementSettings > tbody > tr > td.SubSubHead {
  padding: 15px 5px;
}

#ucEventConfiguration_ConfigurationPanel {
  position: absolute;
  top: 70px;
  left: 350px;
  width: 1000px;
  height: 800px;
  border: 2px solid #eeeeee;
}

.EventConfigOptions {
  left: 0;
  width: 260px;
  font-weight: normal;
  font-size: 14px;
  font-family: "Nunito Sans", sans-serif;
  line-height: 13px;
}

.EventConfigOptions li {
  list-style-type: none;
  background-color: #7413dc;
  border-spacing: 10px;
  border: solid;
  border-width: 1px;
  padding-left: 10px;
  height: 30px;
  line-height: 30px;
  text-align: left;
  margin: auto;
  left: 0;
}

li.EventConfigOptionsSelected {
  list-style-type: none;
  background-color: #23a950;
  border-spacing: 10px;
  border: solid;
  border-width: 1px;
  padding-left: 10px;
  height: 30px;
  line-height: 30px;
  text-align: left;
  margin: auto;
  left: 0;
}

li.EventConfigOptionsSelected > a {
  color: #000;
}

#ucEventConfiguration_SaveBtn {
  left: 30px;
  text-align: center;
}

.txtEventConfMulti {
  height: 130px;
  width: 300px;
}

.txtEventConfSingle {
  width: 300px;
}

/* =========================================================================================================================
	HTML Text Box Editor

   =========================================================================================================================*/
#maineditcontrol {
  width: 750px;
}

#maineditcontrol > tbody > tr:nth-child(1) > td:nth-child(1) {
  width: 220px;
}

#maineditcontrol > tbody > tr:nth-child(1) > td:nth-child(2) {
  min-width: 15px;
}

#maineditcontrol > tbody > tr:nth-child(5) > td {
  vertical-align: top;
}

/* =========================================================================================================================
	Permission and Medical Forms (PH / formally PCH)

   =========================================================================================================================
*/
.HeaderPCH {
  margin: 0;
  padding: 0 20px;
  background-color: #000;
}

.PrintPMLinks {
  display: block;
  float: none;
  margin: 0;
  padding: 20px;
  height: 180px;
  border-width: thin;
  border-bottom-style: dotted;
  font-weight: normal;
  font-size: 14px;
  font-family: "Nunito Sans", sans-serif;
}

.PHWizTableAddress > tbody > tr > td:nth-child(1) {
  width: 60%;
  min-width: 450px;
}

.PHWizTableAddress > tbody > tr > td:nth-child(2) {
  width: 15px;
  min-width: 15px;
  vertical-align: top;
}

.PHWizTableAddress > tbody > tr > td:nth-child(3) {
  min-width: 300px;
  vertical-align: top;
}

.PHWizTable {
  border-spacing: 0 15px;
}

.PHWizTable > tbody > tr > td:nth-child(1) {
  width: 30%;
  min-width: 250px;
}

.PHWizTable > tbody > tr > td:nth-child(3) {
  width: 15px;
  min-width: 15px;
}

.PHWizTable > tbody > tr > td:nth-child(4) {
  width: 250px;
  min-width: 250px;
  vertical-align: top;
}

.PHWizActivityPermission > tbody > tr > td:nth-child(1) {
  min-width: 120px;
}

.PHWizTableMedical > tbody > tr > td:nth-child(1) {
  width: 60%;
  min-width: 450px;
}

.PHWizTableMedical > tbody > tr > td:nth-child(2) {
  width: 350px;
  min-width: 350px;
  vertical-align: top;
}

.PHWizTableMedical > tbody > tr > td:nth-child(3) {
  min-width: 90px;
  vertical-align: top;
}

#PrintorEdit {
  margin: auto;
  text-align: center;
  left: 50%;
  right: 50%;
}

#lkbEditForm {
  text-align: center;
  vertical-align: central;
}

/* =========================================================================================================================
	Manage Permission and Medical Forms (PH / formally PCH)

   =========================================================================================================================
*/
#tblPHStatus {
  min-width: 833px;
  margin-left: auto;
  margin-right: auto;
}

#tblPHStatus > tbody > tr > td:nth-child(1) {
  width: 85px;
  min-width: 75px;
}

#tblPHStatus > tbody > tr > td:nth-child(2) {
  width: 85px;
  min-width: 75px;
}

#tblPHStatus > tbody > tr > td:nth-child(3) {
  min-width: 350px;
}

#tblPHStatus > tbody > tr > td:nth-child(4) {
  min-width: 115px;
  vertical-align: middle;
  text-align: center;
}

#tblPHStatus > tbody > tr > td:nth-child(5) {
  min-width: 55px;
  vertical-align: middle;
  text-align: center;
}

#tblPHStatus > tbody > tr > td:nth-child(6) {
  min-width: 65px;
  vertical-align: middle;
  text-align: center;
}

#tblPHStatus > tbody > tr > td:nth-child(7) {
  min-width: 65px;
  vertical-align: middle;
  text-align: center;
}

#tblPHStatus > tbody > tr:nth-last-of-type(1) {
  min-height: 70px;
  height: 70px;
}

/* =========================================================================================================================
	Global Search Page 
   =========================================================================================================================
*/
#SearchResultsReg {
  min-width: 500px;
  width: 95%;
  margin-left: auto;
  margin-right: auto;
}

/* =========================================================================================================================
	Callout formatting from http://cpratt.co/twitter-bootstrap-callout-css-styles/
   =========================================================================================================================
*/
.bs-callout {
  padding: 20px;
  margin: 20px 0;
  border: 1px solid #eee;
  border-left-width: 5px;
  border-radius: 3px;
}

.bs-callout h4 {
  margin-top: 0;
  margin-bottom: 5px;
}

.bs-callout p:last-child {
  margin-bottom: 0;
}

.bs-callout code {
  border-radius: 3px;
}

.bs-callout + .bs-callout {
  margin-top: -5px;
}

.bs-callout-default {
  border-left-color: #7413dc;
}

.bs-callout-default h4 {
  color: #7413dc;
}

.bs-callout-primary {
  border-left-color: #00a794;
}

.bs-callout-primary h4 {
  color: #00a794;
}

.bs-callout-success {
  border-left-color: #5cb85c;
}

.bs-callout-success h4 {
  color: #5cb85c;
}

.bs-callout-danger {
  border-left-color: #d9534f;
}

.bs-callout-danger h4 {
  color: #d9534f;
}

.bs-callout-warning {
  border-left-color: #f0ad4e;
}

.bs-callout-warning h4 {
  color: #f0ad4e;
}

.bs-callout-info {
  border-left-color: #5bc0de;
}

.bs-callout-info h4 {
  color: #5bc0de;
}

/* =========================================================================================================================
	MVC Shared/_Layouts.cshtml
	General Layout CSS
   =========================================================================================================================
*/
.navbar {
  min-height: 45px;
}

.navbar-fixed-top {
  top: 0;
  border-width: 0 0 2px;
}

.navbar-inverse {
  background-color: #7413dc;
  border-bottom: 0;
}

.navbar-inverse .navbar-brand {
  color: white;
  font-size: 11pt;
}

.navbar-inverse .navbar-brand:hover,
.navbar-inverse .navbar-brand:focus {
  color: white;
  background-color: transparent;
}

.navbar-inverse .navbar-text {
  color: white;
}

.navbar-inverse .navbar-nav > li > a {
  color: white;
}

.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > li > a:focus {
  color: white;
  background-color: transparent;
}

.navbar-inverse .navbar-toggle {
  border-color: #7413dc;
}

.navbar-inverse .navbar-toggle:hover,
.navbar-inverse .navbar-toggle:focus {
  background-color: #7413dc;
}

.navbar-inverse .navbar-toggle .icon-bar {
  background-color: #7413dc;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:focus, .nav-pills > li.active > a:hover {
  color: #FFFFFF;
  background-color: #7413dc;
  border-bottom-right-radius: 0px;
  border-top-right-radius: 0px;
  border-right-width: 4px;
  border-right-style: solid;
  border-right-color: #420b7e;
}

.nav > li > a:focus, .nav > li > a:hover {
  border-bottom-right-radius: 0px;
  border-top-right-radius: 0px;
  border-right-width: 4px;
  border-right-style: solid;
  border-right-color: #7413dc;
}

@media (max-width: 480px) {
  .container-fluid {
    padding: 0;
  }
  .less-col-padding {
    padding: 5px;
  }
}
.e-grid .e-groupdroparea.e-grouped {
  background-color: #7413dc;
}

TH.e-headercell {
  color: #333;
  vertical-align: middle;
  /*font-weight: bold;*/
  font-size: 10px !important;
  /*font-family: $defaultfont;*/
}

.e-grid .e-headercelldiv {
  font-size: 12px;
}

/* =========================================================================================================================
	Stripe Elements 
	Formatting for Payment Processing via Stripe.com see - https://stripe.dev/elements-examples/
   =========================================================================================================================
*/
.payment-form * {
  font-size: 16px;
  font-weight: 500;
}

.payment-form form {
  max-width: 550px !important;
  padding: 0 15px;
  margin: auto auto 20px auto;
}

.payment-form form > * + * {
  margin-top: 20px;
}

.payment-form .container {
  background-color: #fff;
  /*border-color: black;
  border:solid;*/
  border-radius: 4px;
  padding: 3px;
  margin: 0 auto;
  padding: 0 20px 20px 20px;
  width: 100%;
}

.payment-form .card-only {
  display: block;
}

.payment-form .payment-request-available {
  display: none;
}

.payment-form input, .payment-form button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: none;
  border-style: none;
  color: #fff;
}

.payment-form input:-webkit-autofill {
  transition: background-color 100000000s;
  -webkit-animation: 1ms void-animation-out;
}

.payment-form #card-element {
  padding: 10px;
  margin-bottom: 2px;
}

.payment-form input {
  -webkit-animation: 1ms void-animation-out;
}

.payment-form input::-webkit-input-placeholder {
  color: #9bacc8;
}

.payment-form input::-moz-placeholder {
  color: #9bacc8;
}

.payment-form input:-ms-input-placeholder {
  color: #9bacc8;
}

.payment-form button {
  display: block;
  width: 100%;
  height: 37px;
  background-color: #ffb4e5;
  border-radius: 2px;
  color: #fff;
  cursor: pointer;
  margin-top: 10px;
}

.payment-form button:active {
  color: #415A68;
  background-color: #ffb4e5;
  border-color: #ffb4e5;
}

.payment-form button:hover {
  background-color: #F2A7D8;
}

.payment-form #error .message {
  font-size: 15px;
}

.payment-form #success .icon .border {
  stroke: #ffc7ee;
}

.payment-form #success .icon .checkmark {
  stroke: #d782d9;
}

.payment-form #success .title {
  color: #32325d;
}

.payment-form #success .message {
  color: #8898aa;
}

.payment-form #success {
  opacity: 0;
}

.payment-form #success {
  transition-property: opacity, transform;
  transition-duration: 0.35s;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
  opacity: 0;
  transform: translateY(50px);
}

.payment-form #error {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  margin-top: 20px;
  left: 0;
  font-size: 13px !important;
  opacity: 0;
  transform: translateY(10px);
  transition-property: opacity, transform;
  transition-duration: 0.35s;
  transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
}

.payment-form #error.visible {
  opacity: 1;
  transform: none;
}

.payment-form #success {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  padding: 20px;
  text-align: center;
  pointer-events: none;
  overflow: hidden;
}

@media (min-width: 670px) {
  .payment-form .success {
    padding: 40px;
  }
}
.payment-form #success .icon {
  margin: 15px 0 30px;
  transform: translateY(70px) scale(0.75);
}

.payment-form #success .icon svg {
  will-change: transform;
}

.payment-form #success .icon .border {
  stroke-dasharray: 251;
  stroke-dashoffset: 62.75;
  transform-origin: 50% 50%;
  transition: stroke-dashoffset 0.35s cubic-bezier(0.165, 0.84, 0.44, 1);
  animation: spin 1s linear infinite;
}

.payment-form #success .icon .checkmark {
  stroke-dasharray: 60;
  stroke-dashoffset: 60;
  transition: stroke-dashoffset 0.35s cubic-bezier(0.165, 0.84, 0.44, 1) 0.35s;
}

.payment-form #success .title {
  font-size: 17px;
  font-weight: 500;
  margin-bottom: 8px;
  margin-top: 30px;
}

.payment-form #success .message {
  font-size: 14px;
  font-weight: 400;
  margin-bottom: 25px;
  line-height: 1.6em;
}

.payment-form #success .message span {
  font-size: inherit;
}

.payment-form.submitted #success,
.payment-form.submitting #success {
  background: white;
  pointer-events: all;
  opacity: 1;
  transform: none !important;
}

.payment-form.submitting #success .icon {
  opacity: 1;
}

.payment-form.submitted #success > :nth-child(2) {
  transition-delay: 0.1s;
}

.payment-form.submitted #success > :nth-child(3) {
  transition-delay: 0.2s;
}

.payment-form.submitted #success > :nth-child(4) {
  transition-delay: 0.3s;
}

.payment-form.submitted #success .icon .border,
.payment-form.submitted #success .icon .checkmark {
  opacity: 1;
  stroke-dashoffset: 0 !important;
}