/* Title Header */
#titleHeader{background-color: var(--bs-primary);}
#titleHeader_TEST{background-color: #FFCC00;}
#titleHeader_TEST_BRANCH1{ background-color: #CCFF00; }
#titleHeader_TEST_BRANCH2{ background-color: #23A7DB; }
#titleHeader_TEST_BRANCH3{ background-color: #CC99FF; }
#titleHeader_TEST_BRANCH4{ background-color: #BB4444; }
#titleHeader_TEST_BRANCH5{ background-color: #0070CE; }
#titleHeader_DEVELOPMENT{ background-color: #009933; }
#titleHeader_DEVELOPMENT_BRANCH1{ background-color: #33E8A9; }
#titleHeader_DEVELOPMENT_BRANCH2{ background-color: #70B319; }
#titleHeader_DEVELOPMENT_BRANCH3{ background-color: #D17E1F; }
#titleHeader_DEVELOPMENT_BRANCH4{ background-color: #FA8072; }
#titleHeader_DEVELOPMENT_BRANCH5{ background-color: #FB8072; }

@font-face {
		font-family: "Trebuchet MS", Helvetica, sans-serif;
		src: url('/includes/fonts/geosanslight-webfont.eot');
		src: url('/includes/fonts/geosanslight-webfont.eot?#iefix') format('embedded-opentype'),
				 url('/includes/fonts/geosanslight-webfont.woff') format('woff'),
				 url('/includes/fonts/geosanslight-webfont.ttf') format('truetype'),
				 url('/includes/fonts/geosanslight-webfont.svg#geosanslightregular') format('svg');
		font-weight: normal;
		font-style: normal;

}

body{margin-bottom:82px; --bs-body-font-family: "Trebuchet MS", Helvetica, sans-serif; --bs-body-font-size: 14px;}
html{min-height:100%;position:relative;}
#HeaderRow{
    @media only screen and (min-width : 1200px) {
          min-width: 960px;
      }

}

.HeaderLogoImage{
  cursor: pointer;
  height:34px;

  @media only screen and (max-width : 1400px) {
      object-fit:cover;width:150px;object-position:0px 0px; 
  }  

  @media only screen and (max-width : 1200px) {
      object-fit:cover;width:90px;object-position:0px 0px;
  }
}

#main{
        @media only screen and (min-width : 1200px) {
            min-width: 960px;
        }

        min-height:500px;margin-bottom:125px;        
  }  

.LayoutDefault{
  margin-top:73px;
}

.LayoutNoNav{
  margin-top:45px;
}

.LayoutSimple{
  margin-top:30px;
}

.LargeScreen{
  @media only screen and (max-width : 1200px) {
      display:none;
  }
}

.MediumScreen{
  @media only screen and (max-width : 1000px) {
      display:none;
  }
}

.VariableSelect{
  @media only screen and (max-width : 1199px) {
      width: 150px;
  }

  @media only screen and (min-width : 1200px) {
      width: 225px;
  }
}

.dataTable a{text-decoration:none;cursor:pointer;}
.dataTable a:hover{text-decoration:underline;cursor:pointer;}

.dataTable thead tr th{--bs-table-bg: var(--bs-primary-bg-subtle); --bs-table-color: var(--bs-primary)}

.dt-button-collection.columns{background-color: var(--bs-primary-bg-subtle); --bs-dropdown-link-color: var(--bs-primary);}
.dt-button-collection.columns div{margin:0px; padding:0px;}
.dt-button-collection.columns a{border-right: 1px solid white; padding-top:0px; padding-bottom:0px;}

div#notification-bell {position: relative; float: left; }
div#notification-bell {color: silver; }
div#notification-bell:hover {cursor: pointer; color: #ffffff; }
div#notification-bell > i {text-align: center;vertical-align: middle; }
div#notification-bell > .badge {background: rgba(0, 0, 0, 0.5);width: auto;height: auto;margin: 0;border-radius: 50%;position: absolute;top: -13px;right: -1px;padding: 5px; }

#GlobalSearch {margin-top:14px; width:300px}
#EventViewTypeBtns > button {margin-top:14px;}
#ClientChangeForm > select {margin-top:14px;}
#NavRow {min-width:1000px;margin-top:50px;}

.OverlayBtn{margin-top:2px; margin-bottom:2px;}
.NavFavorite{width: 100px; border-radius: 8px; color: white; font-size: 12px; font-weight: bold; margin-top:3px; margin-bottom:2px;}

.vsrwest-tooltip {
  --bs-tooltip-bg: var(--bs-info-bg-subtle);
  --bs-tooltip-color: var(--bs-black);
}

.vsrwest-searchcriteria {
  background-color: var(--bs-primary-bg-subtle);
  color: var(--bs-primary);
}

.toggleHide{display: none !important;}

.btn-refresh {background-color: #23A7DB;}

.text-label {
  color: var(--bs-info-bg-subtle);
}

.height20{height:20px !important;}
.height30{height:30px !important;}
.height35{height:35px !important;}
.height46{height:46px !important;}
.height50{height:50px !important;}
.height60{height:60px !important;}

.width20{width:20px !important;}
.width25{width:25px !important;}
.width30{width:30px !important;}
.width35{width:35px !important;}
.width40{width:40px !important;}
.width50{width:50px !important;}
.width60{width:60px !important;}
.width70{width:70px !important;}
.width80{width:80px !important;}
.width90{width:90px !important;}
.width100{width:100px !important;}
.width110{width:120px !important;}
.width120{width:120px !important;}
.width130{width:130px !important;}
.width140{width:140px !important;}
.width150{width:150px !important;}
.width165{width:165px !important;}
.width175{width:175px !important;}
.width190{width:190px !important;}
.width200{width:200px !important;}
.width205{width:205px !important;}
.width225{width:225px !important;}
.width250{width:250px !important;}
.width275{width:275px !important;}
.width300{width:300px !important;}
.width350{width:350px !important;}
.width400{width:400px !important;}
.width450{width:450px !important;}
.width500{width:500px !important;}
.width600{width:600px !important;}
.width700{width:700px !important;}
.width800{width:800px !important;}

.OverlayArea {
  color: #f1f1f1;
  font-size: 20px;
}
 /* The navigation links inside the overlay */
.OverlayArea a {
  padding: 8px;
  text-decoration: none;
  font-size: 14px;
  color: #f1f1f1;
  display: block; /* Display block instead of inline */
  transition: 0.3s; /* Transition effects on hover (color) */
}

/* When you mouse over the navigation links, change their color */
.OverlayArea a:hover, .OverlayArea a:focus {
  color: #818181;
}

.OverlayGroup{
	display: inline-block;
	white-space: nowrap;
	vertical-align: top;
}

/* The Overlay (background) */
.overlay {
  /* Height & width depends on how you want to reveal the overlay (see JS below) */
  height: 0;
  width: 100%;
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  background-color: rgb(71,95,121); /* Black fallback color */
  background-color: rgba(71,95,121, 0.9); /* Black w/opacity */
  overflow-y: scroll; /* Disable vertical scroll */
  transition: 0.5s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}

/* Position the content inside the overlay */
.overlay-content {
  position: relative;
  top: 50px; /* 25% from the top */
  left: 5px;
  width: 95%; /* 100% width */
  margin-top: 30px; /* 30px top margin to avoid conflict with the close button on smaller screens */
}

/* The navigation links inside the overlay */
.overlay a {
  padding: 8px;
  text-decoration: none;
  font-size: 14px;
  color: #f1f1f1;
  display: block; /* Display block instead of inline */
  transition: 0.3s; /* Transition effects on hover (color) */
}

/* When you mouse over the navigation links, change their color */
.overlay a:hover, .overlay a:focus {
  color: #818181;
}

/* Position the close button (top right corner) */
.overlay .closebtn {
  position: absolute;
  top: 10px;
  right: 45px;
  font-size: 60px;
}

.StartsWith{border-left: thick double var(--bs-teal);}
.EndsWith{border-right: thick double var(--bs-teal);}
.DataContains{border-right: thick double var(--bs-teal); border-left: thick double var(--bs-teal);}

.fieldSuccess {border:3px solid #00AC0C;}
.fieldError {border:3px solid #c62a2b;}
.fieldError:focus {border:2px solid #c62a2b;}
.iconlink{cursor:pointer;}
.toggleElementLabel{cursor:pointer;}
.TaskFieldRow{min-height: 46px; border-bottom: solid grey 1px;}
.MobileFieldRow{min-height: 46px; border-bottom: solid grey 1px;}

.clipCopy {
  cursor: copy;
}

.toggleElementLabel{cursor: pointer;}
.toggleElementExpandAll{cursor: pointer;}
.toggleElementCollapseAll{cursor: pointer;}