/* Bootstrap Breakpoints.
---------------------------------------------------------------- */
/* Container Sizes.
---------------------------------------------------------------- */
/* Body Colors.
---------------------------------------------------------------- */
/* Text Colors.
---------------------------------------------------------------- */
/* Button Colors.
---------------------------------------------------------------- */
/* Font Awesome Checkbox and RadioButton Colors.
---------------------------------------------------------------- */
/* Divider Colors.
---------------------------------------------------------------- */
/* Header Colors.
---------------------------------------------------------------- */
/* Background */
/* Text */
/* Magnify Glass */
/* Top Section Burger */
/* Bottom Section Search */
/* Dropdown Menu Section */
/* Wait Cover */
/* Footer Colors.
---------------------------------------------------------------- */
/* Footer Top */
/* Footer Bottom */
/* Cookie Directive */
/* Modal Colors.
---------------------------------------------------------------- */
/* Modal Header */
/* Modal Close Button */
/* Modal Body */
/* Word Prompter Colors.
---------------------------------------------------------------- */
/* Word Prompter Content */
/* Word Prompter Options */
/* Word Prompter Close Button */
/* Vertical Scroll Bar Colors.
---------------------------------------------------------------- */
/* Tool Tip Colors.
---------------------------------------------------------------- */
/* Accordions.
---------------------------------------------------------------- */
/* Preview Page.
---------------------------------------------------------------- */
/* Video Controls.
---------------------------------------------------------------- */
/* Results Refine Search.
---------------------------------------------------------------- */
/* Results Pagination Bar.
---------------------------------------------------------------- */
/* Lightbox Slider.
---------------------------------------------------------------- */
/* Lightbox Manager.
---------------------------------------------------------------- */
/* This shows when the user is dragging an item from a box to another box and isn't hovering over an item. */
/* Lightboxes Page.
---------------------------------------------------------------- */
/* Lightbox Page.
---------------------------------------------------------------- */
/* Shared Lightbox Page.
---------------------------------------------------------------- */
/* Bootstrap 4
---------------------------------------------------------------- */
#DebugResXX-BS5 {
  padding: 5px 0 5px 15px;
  background: #808080;
  color: black;
  font-family: "Segoe UI";
  font-size: 12pt;
  display: block;
}

#DebugResXXS-BS5 {
  padding: 5px 0 5px 15px;
  background: navy;
  color: white;
  font-family: "Segoe UI";
  font-size: 12pt;
  display: none;
}

#DebugResXS-BS5 {
  padding: 5px 0 5px 15px;
  background: blue;
  color: white;
  font-family: "Segoe UI";
  font-size: 12pt;
  display: none;
}

#DebugResSM-BS5 {
  padding: 5px 0 5px 15px;
  background: green;
  color: white;
  font-family: "Segoe UI";
  font-size: 12pt;
  display: none;
}

#DebugResMD-BS5 {
  padding: 5px 0 5px 15px;
  background: yellow;
  color: black;
  font-family: "Segoe UI";
  font-size: 12pt;
  display: none;
}

#DebugResLG-BS5 {
  padding: 5px 0 5px 15px;
  background: orange;
  color: white;
  font-family: "Segoe UI";
  font-size: 12pt;
  display: none;
}

#DebugResXL-BS5 {
  padding: 5px 0 5px 15px;
  background: red;
  color: white;
  font-family: "Segoe UI";
  font-size: 12pt;
  display: none;
}

#DebugResXXL-BS5 {
  padding: 5px 0 5px 15px;
  background: brown;
  color: white;
  font-family: "Segoe UI";
  font-size: 12pt;
  display: none;
}

#DebugResHD-BS5 {
  padding: 5px 0 5px 15px;
  background: hotpink;
  color: white;
  font-family: "Segoe UI";
  font-size: 20pt;
  display: none;
}

#DebugResQHD-BS5 {
  padding: 5px 0 5px 15px;
  background: purple;
  color: white;
  font-family: "Segoe UI";
  font-size: 20pt;
  display: none;
}

#DebugRes4K-BS5 {
  padding: 5px 0 5px 15px;
  background: black;
  color: white;
  font-family: "Segoe UI";
  font-size: 40pt;
  display: none;
}

#DebugRes8K-BS5 {
  padding: 5px 0 5px 15px;
  background: lightgrey;
  color: black;
  font-family: "Segoe UI";
  font-size: 40pt;
  display: none;
}

@media (min-width: 320px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: block;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 480px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: block;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 576px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: block;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 768px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: block;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 992px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: block;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 1200px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: block;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 1400px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: block;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 1920px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: block;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 2560px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: block;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 3840px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: block;
  }
  #DebugRes8K-BS5 {
    display: none;
  }
}

@media (min-width: 7680px) {
  #DebugResXX-BS5 {
    display: none;
  }
  #DebugResXXS-BS5 {
    display: none;
  }
  #DebugResXS-BS5 {
    display: none;
  }
  #DebugResSM-BS5 {
    display: none;
  }
  #DebugResMD-BS5 {
    display: none;
  }
  #DebugResLG-BS5 {
    display: none;
  }
  #DebugResXL-BS5 {
    display: none;
  }
  #DebugResXXL-BS5 {
    display: none;
  }
  #DebugResHD-BS5 {
    display: none;
  }
  #DebugResQHD-BS5 {
    display: none;
  }
  #DebugRes4K-BS5 {
    display: none;
  }
  #DebugRes8K-BS5 {
    display: block;
  }
}

#DebugBreakpointXXS {
  width: 320px;
}

#DebugBreakpointXS {
  width: 480px;
}

#DebugBreakpointSM {
  width: 576px;
}

#DebugBreakpointMD {
  width: 768px;
}

#DebugBreakpointLG {
  width: 992px;
}

#DebugBreakpointXL {
  width: 1200px;
}

#DebugBreakpointXXL {
  width: 1400px;
}

#DebugBreakpointHD {
  width: 1920px;
}

#DebugBreakpointQHD {
  width: 2560px;
}

#DebugBreakpoint4K {
  width: 3840px;
}

#DebugBreakpoint8K {
  width: 7680px;
}

/* Bootstrap Breakpoints.
---------------------------------------------------------------- */
/* Container Sizes.
---------------------------------------------------------------- */
/* Body Colors.
---------------------------------------------------------------- */
/* Text Colors.
---------------------------------------------------------------- */
/* Button Colors.
---------------------------------------------------------------- */
/* Font Awesome Checkbox and RadioButton Colors.
---------------------------------------------------------------- */
/* Divider Colors.
---------------------------------------------------------------- */
/* Header Colors.
---------------------------------------------------------------- */
/* Background */
/* Text */
/* Magnify Glass */
/* Top Section Burger */
/* Bottom Section Search */
/* Dropdown Menu Section */
/* Wait Cover */
/* Footer Colors.
---------------------------------------------------------------- */
/* Footer Top */
/* Footer Bottom */
/* Cookie Directive */
/* Modal Colors.
---------------------------------------------------------------- */
/* Modal Header */
/* Modal Close Button */
/* Modal Body */
/* Word Prompter Colors.
---------------------------------------------------------------- */
/* Word Prompter Content */
/* Word Prompter Options */
/* Word Prompter Close Button */
/* Vertical Scroll Bar Colors.
---------------------------------------------------------------- */
/* Tool Tip Colors.
---------------------------------------------------------------- */
/* Accordions.
---------------------------------------------------------------- */
/* Preview Page.
---------------------------------------------------------------- */
/* Video Controls.
---------------------------------------------------------------- */
/* Results Refine Search.
---------------------------------------------------------------- */
/* Results Pagination Bar.
---------------------------------------------------------------- */
/* Lightbox Slider.
---------------------------------------------------------------- */
/* Lightbox Manager.
---------------------------------------------------------------- */
/* This shows when the user is dragging an item from a box to another box and isn't hovering over an item. */
/* Lightboxes Page.
---------------------------------------------------------------- */
/* Lightbox Page.
---------------------------------------------------------------- */
/* Shared Lightbox Page.
---------------------------------------------------------------- */
/* Word Prompter Container.
---------------------------------------------------------------- */
#WordPrompter {
  position: absolute;
  left: 0;
  top: 0;
  width: 0;
  display: none;
}

/* Word Prompter Content.
---------------------------------------------------------------- */
.WordPrompterContent {
  position: relative;
  margin-bottom: 20px;
  border-right: #999999 1px solid;
  border-bottom: #999999 1px solid;
  border-left: #999999 1px solid;
  background: white;
  z-index: 2004;
}

/* Word Prompter Options.
---------------------------------------------------------------- */
.WordPrompterOptionOff {
  padding: 0 5px 0 5px;
  color: #333333;
  background: white;
  font-size: 12px;
  cursor: pointer;
}

.WordPrompterOptionOn {
  padding: 0 5px 0 5px;
  color: white;
  background: #3b5e8d;
  font-size: 12px;
  cursor: pointer;
}

/* Word Prompter Close Button.
---------------------------------------------------------------- */
#WordPrompterCloseBtn {
  position: absolute;
  bottom: 8px;
  right: -12px;
  width: 26px;
  height: 26px;
  border: #999999 2px solid;
  border-radius: 13px;
  color: white;
  background: #333;
  text-align: center;
  font-family: Verdana;
  font-size: 15px;
  font-weight: bold;
  line-height: 18px;
  cursor: pointer;
  z-index: 2004;
}

#WordPrompterCloseBtn:hover {
  background: white;
  color: #333;
}

/* Bootstrap Breakpoints.
---------------------------------------------------------------- */
/* Container Sizes.
---------------------------------------------------------------- */
/* Body Colors.
---------------------------------------------------------------- */
/* Text Colors.
---------------------------------------------------------------- */
/* Button Colors.
---------------------------------------------------------------- */
/* Font Awesome Checkbox and RadioButton Colors.
---------------------------------------------------------------- */
/* Divider Colors.
---------------------------------------------------------------- */
/* Header Colors.
---------------------------------------------------------------- */
/* Background */
/* Text */
/* Magnify Glass */
/* Top Section Burger */
/* Bottom Section Search */
/* Dropdown Menu Section */
/* Wait Cover */
/* Footer Colors.
---------------------------------------------------------------- */
/* Footer Top */
/* Footer Bottom */
/* Cookie Directive */
/* Modal Colors.
---------------------------------------------------------------- */
/* Modal Header */
/* Modal Close Button */
/* Modal Body */
/* Word Prompter Colors.
---------------------------------------------------------------- */
/* Word Prompter Content */
/* Word Prompter Options */
/* Word Prompter Close Button */
/* Vertical Scroll Bar Colors.
---------------------------------------------------------------- */
/* Tool Tip Colors.
---------------------------------------------------------------- */
/* Accordions.
---------------------------------------------------------------- */
/* Preview Page.
---------------------------------------------------------------- */
/* Video Controls.
---------------------------------------------------------------- */
/* Results Refine Search.
---------------------------------------------------------------- */
/* Results Pagination Bar.
---------------------------------------------------------------- */
/* Lightbox Slider.
---------------------------------------------------------------- */
/* Lightbox Manager.
---------------------------------------------------------------- */
/* This shows when the user is dragging an item from a box to another box and isn't hovering over an item. */
/* Lightboxes Page.
---------------------------------------------------------------- */
/* Lightbox Page.
---------------------------------------------------------------- */
/* Shared Lightbox Page.
---------------------------------------------------------------- */
/* Cover for the screen when a modal is shown.
---------------------------------------------------------------- */
#ModalCover {
  position: fixed;
  top: 0;
  left: 0;
  background: #000000;
  opacity: 0.5;
  z-index: 2004;
  display: none;
}

/* Changes to body and ModalCover when ModalPage is shown.
---------------------------------------------------------------- */
.ModalBodyPage {
  overflow: hidden;
}

/* Modal Templates
---------------------------------------------------------------- */
.ModalPop {
  position: absolute;
  box-sizing: border-box;
  top: 0;
  left: 0;
  border: #dddddd 1px solid;
  padding: 10px;
  background: white;
  z-index: 2005;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  display: none;
}

#ModalAlert {
  outline: none;
  display: none;
}

.ModalAlert {
  position: absolute;
  box-sizing: border-box;
  top: 0;
  left: 0;
  width: 90%;
  max-width: 625px;
  border: #dddddd 1px solid;
  background: white;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  z-index: 2005;
}

.ModalAlert_Small {
  max-width: 400px;
}

.ModalAlert_Large {
  max-width: 850px;
}

.ModalAlertHeader {
  height: 42px;
  margin: -1px -1px 0px -1px;
  border-bottom: white 1px solid;
  background: #333333;
  color: white;
  font-size: 16pt;
}

#ModalAlertHeaderContent {
  float: left;
  padding: 6px 0 0 15px;
}

#ModalAlertHeaderClose {
  float: right;
  padding: 8px 15px 0 0;
}

#ModalAlertBody {
  padding: 15px;
  background: white;
  color: #333;
}

#ModalConfirm {
  outline: none;
  display: none;
}

.ModalConfirm {
  position: absolute;
  box-sizing: border-box;
  top: 0;
  left: 0;
  width: 90%;
  max-width: 625px;
  border: #dddddd 1px solid;
  background: white;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  z-index: 2005;
}

.ModalConfirm_Small {
  max-width: 400px;
}

.ModalConfirm_Large {
  max-width: 850px;
}

.ModalConfirmHeader {
  height: 42px;
  margin: -1px -1px 0px -1px;
  border-bottom: white 1px solid;
  background: #333333;
  color: white;
  font-size: 16pt;
}

#ModalConfirmHeaderContent {
  float: left;
  padding: 6px 0 0 15px;
}

#ModalConfirmHeaderClose {
  float: right;
  padding: 8px 15px 0 0;
}

#ModalConfirmBody {
  padding: 15px;
  background: white;
  color: #333;
}

#ModalConfirmFooter {
  padding: 0 10px 10px 0;
  text-align: right;
  background: white;
}

#ModalConfirmNo {
  margin-left: 5px;
}

#ModalDialog {
  outline: none;
  display: none;
}

.ModalDialog {
  position: absolute;
  box-sizing: border-box;
  top: 0;
  left: 0;
  width: 90%;
  max-width: 625px;
  border: #dddddd 1px solid;
  background: white;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  z-index: 2005;
}

.ModalDialog_Small {
  max-width: 400px;
}

.ModalDialog_Large {
  max-width: 850px;
}

.ModalDialogHeader {
  height: 42px;
  margin: -1px -1px 0px -1px;
  border-bottom: white 1px solid;
  background: #333333;
  color: white;
  font-size: 16pt;
}

#ModalDialogHeaderContent {
  float: left;
  padding: 6px 0 0 15px;
}

#ModalDialogHeaderClose {
  float: right;
  padding: 8px 15px 0 0;
}

#ModalDialogBody {
  padding: 15px;
  background: white;
  color: #333;
}

#ModalPageContainer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  background: transparent;
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 2005;
  outline: none;
  display: none;
}

#ModalPage {
  display: block;
}

.ModalPage {
  position: relative;
  box-sizing: border-box;
  width: 90%;
  max-width: 625px;
  min-width: 300px;
  margin: 20px auto 20px auto;
  border: #dddddd 1px solid;
  background: white;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  z-index: 2005;
}

.ModalPage_Small {
  max-width: 400px;
}

.ModalPage_Large {
  max-width: 850px;
}

.ModalPage_EmailLightbox {
  max-width: 700px;
}

.ModalPage_AnnotateLightbox {
  max-width: 800px;
}

.ModalPageHeader {
  height: 56px;
  margin: -1px -1px 0px -1px;
  border-bottom: white 1px solid;
  background: #333333;
  color: white;
  font-size: 20pt;
}

#ModalPageHeaderContent {
  float: left;
  padding: 10px 0 0 15px;
}

#ModalPageHeaderClose {
  float: right;
  padding: 10px 15px 0 0;
}

#ModalPageBody {
  padding: 15px;
  background: white;
  color: #333;
}

/* This is the "X" close button that appears in the modal header.
	This was copied and changed from the .close element in bootstrap.css.
---------------------------------------------------------------- */
.ModalCloseBtn {
  float: right;
  font-size: 21px;
  font-weight: bold;
  line-height: 1;
  color: white;
  text-shadow: 0px 2px 0 #303030;
  filter: alpha(opacity=20);
  opacity: 1;
}

.ModalCloseBtn:hover,
.ModalCloseBtn:focus {
  color: white;
  text-shadow: 0px 2px 0 #303030;
  text-decoration: none;
  cursor: pointer;
  filter: alpha(opacity=50);
  opacity: 0.8;
}

button.ModalCloseBtn {
  -webkit-appearance: none;
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
}

/* Different colors for the modal header's background and text.
	It should be listed below the Modal Templates CSS for it to work.
---------------------------------------------------------------- */
.ModalColorInfo {
  background: #333333;
  color: white;
}

.ModalColorPrimary {
  background: #3b5e8d;
  color: white;
}

.ModalColorSuccess {
  background: #5cb85c;
  color: white;
}

.ModalColorWarning {
  background: #f0ad4e;
  color: white;
}

.ModalColorDanger {
  background: #d9534f;
  color: white;
}

.ModalNoHeader {
  display: none;
}

.ModalNoBorder {
  border: 0;
}

/* Bootstrap Breakpoints.
---------------------------------------------------------------- */
/* Container Sizes.
---------------------------------------------------------------- */
/* Body Colors.
---------------------------------------------------------------- */
/* Text Colors.
---------------------------------------------------------------- */
/* Button Colors.
---------------------------------------------------------------- */
/* Font Awesome Checkbox and RadioButton Colors.
---------------------------------------------------------------- */
/* Divider Colors.
---------------------------------------------------------------- */
/* Header Colors.
---------------------------------------------------------------- */
/* Background */
/* Text */
/* Magnify Glass */
/* Top Section Burger */
/* Bottom Section Search */
/* Dropdown Menu Section */
/* Wait Cover */
/* Footer Colors.
---------------------------------------------------------------- */
/* Footer Top */
/* Footer Bottom */
/* Cookie Directive */
/* Modal Colors.
---------------------------------------------------------------- */
/* Modal Header */
/* Modal Close Button */
/* Modal Body */
/* Word Prompter Colors.
---------------------------------------------------------------- */
/* Word Prompter Content */
/* Word Prompter Options */
/* Word Prompter Close Button */
/* Vertical Scroll Bar Colors.
---------------------------------------------------------------- */
/* Tool Tip Colors.
---------------------------------------------------------------- */
/* Accordions.
---------------------------------------------------------------- */
/* Preview Page.
---------------------------------------------------------------- */
/* Video Controls.
---------------------------------------------------------------- */
/* Results Refine Search.
---------------------------------------------------------------- */
/* Results Pagination Bar.
---------------------------------------------------------------- */
/* Lightbox Slider.
---------------------------------------------------------------- */
/* Lightbox Manager.
---------------------------------------------------------------- */
/* This shows when the user is dragging an item from a box to another box and isn't hovering over an item. */
/* Lightboxes Page.
---------------------------------------------------------------- */
/* Lightbox Page.
---------------------------------------------------------------- */
/* Shared Lightbox Page.
---------------------------------------------------------------- */
/* Header
---------------------------------------------------------------- */
#Header {
  width: 100%;
  z-index: 2003;
  background: white;
  color: #333;
}

#Header a {
  color: #333;
  text-decoration: none;
  padding-right: 20px;
}

#Header a:hover {
  color: black;
}

#Header a:active {
  color: auto;
}

#Header a:visited {
  color: auto;
}

#HeaderLogoTagLine {
  display: none;
}

/* Admin Section
---------------------------------------------------------------- */
.HeaderDebugMessage {
  margin: 0;
  padding-top: 5px;
  color: #333;
  background-color: #f5e52938;
  border-bottom: 1px solid #333;
  text-align: center;
}

/* Top Section
---------------------------------------------------------------- */
#HeaderDesktop {
  box-sizing: content-box;
  height: 50px;
  border-bottom: #d8d8d8 1px solid;
}

#HeaderTxtkeys {
  box-sizing: border-box;
  height: 50px;
  border: 0;
  padding: 0 15px 0 15px;
  border-radius: 0px;
  font-size: 14pt;
  border-left: 1px solid #d8d8d8;
  border-bottom: #d8d8d8 1px solid;
}

/* Top Section Burger
---------------------------------------------------------------- */
#HeaderBurgerContainer {
  display: block;
  float: right;
  height: 50px;
  background: white;
}

#HeaderBurger {
  box-sizing: content-box;
  float: left;
  width: 40px;
  padding: 10px;
  cursor: pointer;
}

.HeaderBurgerBarTop {
  height: 8px;
  background: #333;
}

.HeaderBurgerBarMiddle {
  height: 8px;
  background: #333;
}

.HeaderBurgerBarBottom {
  height: 8px;
  background: #333;
}

.HeaderBurgerBarHover {
  height: 8px;
  background: #000;
  display: none;
}

.HeaderBurgerDivider {
  height: 4px;
}

/* Top Section Logo
---------------------------------------------------------------- */
#HeaderLogo {
  height: 50px;
  padding: 0 0 0 10px;
}

#HeaderLogo img {
  width: 100px;
}

@media (min-width: 320px) {
  #HeaderLogo img {
    width: 100px;
  }
}

@media (min-width: 630px) {
  #HeaderDesktop {
    height: 100px;
  }
  #HeaderLogo {
    float: left;
    text-align: left;
  }
  #HeaderLogo img {
    width: 150px;
  }
  #HeaderBurgerContainer {
    margin-top: 20px;
  }
  #HeaderBurger {
    padding: 14px 20px 20px 0px;
  }
  #HeaderLogoTagLine {
    display: block;
    padding: 0 0 0 15px;
  }
}

/* Top Section Menu
---------------------------------------------------------------- */
#HeaderMenuDesktop {
  float: right;
  height: 50px;
  margin: 15px 10px 0 0;
  padding-right: 20px;
  font-size: 1.3em;
  display: none;
}

#HeaderMenuDesktopIcons {
  float: right;
  height: 50px;
  margin: 15px 10px 0 0;
  padding-right: 20px;
  font-size: 1.3em;
  display: none;
}

#HeaderMenuDesktopIcons i {
  color: #333;
  text-decoration: none;
  padding-right: 10px;
}

#HeaderMenuDesktop a {
  color: #333;
}

.HeaderMenuItemLabel {
  display: none;
}

.HeaderCartItems {
  vertical-align: top;
  font-size: 12px;
  padding-left: 2px;
  font-weight: bold;
  position: absolute;
}

@media (min-width: 660px) {
  #HeaderMenuDesktopIcons {
    display: none;
  }
  #HeaderMenuDesktop {
    display: block;
  }
}

@media (min-width: 768px) {
  #HeaderBurgerContainer {
    display: none;
  }
  #HeaderMenuDesktop {
    font-size: 14pt;
  }
  .HeaderMenuItemLabel {
    display: inline;
    text-transform: uppercase;
  }
}

/* Bottom Section Search
---------------------------------------------------------------- */
.search-input-container {
  /* IE10 */
  display: flex;
  width: 100%;
  margin-bottom: 15px;
}

.icon {
  padding: 10px;
  font-size: 18pt;
  background: #ffa500;
  color: white;
  min-width: 50px;
  text-align: center;
}

.search-input-field {
  width: 100%;
  padding: 10px;
  outline: none;
}

#HeaderSearchContainerMobile {
  box-sizing: border-box;
  height: 50px;
  background: #f5f5f5;
}

@media (min-width: 768px) {
  #HeaderSearchContainerMobile {
    padding: 0 25% 0 25%;
  }
}

#HeaderSearchMobile {
  position: relative;
  height: 100%;
}

#HeaderTxtkeysMobile {
  box-sizing: border-box;
  width: 100%;
  height: 50px;
  border: 0;
  padding: 0 15px 0 15px;
  border-radius: 0px;
  font-size: 14pt;
}

#HeaderSearchImageWrapMobile {
  position: relative;
  box-sizing: border-box;
  top: 10px;
  left: 30px;
  width: 30px;
  height: 30px;
  cursor: pointer;
}

#HeaderSearchImageMobile {
  margin-left: -10px;
  font-size: 20pt;
  opacity: 0.7;
  color: #fff;
}

.HeaderSearchCustomSelect {
  position: relative;
  width: 20%;
}

.HeaderSearchCustomSelect select {
  display: none;
}

.select-selected {
  background-color: #ffffff;
}

.select-selected:after {
  position: absolute;
  content: "";
  top: 14px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  border-color: #fff transparent transparent transparent;
}

.select-selected.select-arrow-active:after {
  border-color: transparent transparent #fff transparent;
  top: 7px;
}

.select-items div,
.select-selected {
  color: #252129;
  padding: 12px 16px;
  border-bottom: 1px solid #d8d8d8;
  border-left: 1px solid #d8d8d8;
  border-right: 1px solid #d8d8d8;
  cursor: pointer;
  user-select: none;
  text-align: center;
}

.select-items {
  position: absolute;
  background-color: #ffffff;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 2003;
}

.select-hide {
  display: none;
}

.select-items div:hover,
.same-as-selected {
  background-color: #ece3d3;
}

#HeaderSearchMobileDropDownMenu {
  position: absolute;
  left: 0px;
  top: 50px;
  box-shadow: 2px 4px 10px #909090;
  background: white;
  cursor: pointer;
  z-index: 2003;
  line-height: 2;
  display: none;
}

#HeaderSearchMobileDropDown {
  cursor: pointer;
  background: white;
  border: none !important;
  outline: none !important;
  padding: 12px;
  width: 98px;
}

.HeaderSearchMobileDropDownItem {
  padding: 10px;
  border-bottom: 1px solid #adadad;
  width: 97px;
}

.HeaderSearchMobileDropDownItem:hover {
  background: #ece3d3;
}

.input-group-text {
  background: #ffffff;
  border: none;
}

@media (min-width: 768px) {
  #HeaderSearchContainerMobile {
    background-color: #faf5f2;
  }
  #HeaderSearchImageMobile {
    margin-left: -20px;
  }
}

@media (min-width: 768px) {
  #HeaderSearchContainerMobile {
    display: none;
  }
}

/* Dropdown Menu Section
---------------------------------------------------------------- */
#HeaderBurgerMenuContainer {
  position: relative;
}

#HeaderBurgerMenu {
  box-sizing: border-box;
  position: absolute;
  top: 0;
  right: -300px;
  width: 100%;
  overflow-y: auto;
  z-index: 2003;
}

#HeaderMenuMobile .DropdownMenuItems {
  display: none;
}

@media (min-width: 768px) {
  #HeaderBurgerMenu {
    width: 300px;
  }
}

.HeaderMenuItemMobile {
  position: relative;
  margin: 0;
  border-bottom: #d8d8d8 1px solid;
  padding: 6px 10px 6px 10px;
  color: #eeeeee;
  background: #333;
  font-size: 14pt;
  cursor: pointer;
  line-height: 2.3;
}

.HeaderMenuItemMobile:hover {
  background: #3b5e8d;
  color: white;
}

.HeaderMenuItemMobileActive {
  background: #3b5e8d;
  color: #eeeeee;
}

.HeaderMenuItemMobileActive:hover {
  background: #3b5e8d;
  color: white;
}

.HeaderSubMenuItemMobile {
  margin: 0;
  border-bottom: #d8d8d8 1px solid;
  padding: 6px 10px 6px 30px;
  color: #eeeeee;
  background: #333;
  font-size: 12pt;
  cursor: pointer;
  line-height: 2;
}

.HeaderSubMenuItemMobile:hover {
  background: #3b5e8d;
  color: #eeeeee;
}

.HeaderArrowUpMobile {
  position: absolute;
  top: 7px;
  right: 30px;
  width: 0;
  height: 0;
}

.HeaderArrowDownMobile {
  position: absolute;
  top: 7px;
  right: 30px;
  width: 0;
  height: 0;
}

.HeaderArrowUpMobile {
  float: right;
  margin-top: 0px;
  padding-right: 10px;
}

.HeaderArrowDownMobile {
  float: right;
  margin-top: 0px;
  padding-right: 10px;
}

.arrow-right {
  float: right;
  padding-right: 20px;
}

#HeaderBurgerClick {
  display: none;
}

/* HeaderBurgerMenu Vertical Scroll Bar.
   https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_custom_scrollbar2
---------------------------------------------------------------- */
/* Width */
#HeaderBurgerMenu::-webkit-scrollbar {
  width: 10px;
}

/* Track */
#HeaderBurgerMenu::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #f1f1f1;
  border-radius: 10px;
}

/* Handle */
#HeaderBurgerMenu::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: #c1c1c1;
}

/* Handle on Hover */
#HeaderBurgerMenu::-webkit-scrollbar-thumb:hover {
  background: #a8a8a8;
}

/* Wait Cover (covers the screen when searching)
---------------------------------------------------------------- */
#WaitCover {
  position: fixed;
  top: 0;
  left: 0;
  background: black;
  opacity: 0.8;
  z-index: 2003;
  display: none;
}

/* Bootstrap Breakpoints.
---------------------------------------------------------------- */
/* Container Sizes.
---------------------------------------------------------------- */
/* Body Colors.
---------------------------------------------------------------- */
/* Text Colors.
---------------------------------------------------------------- */
/* Button Colors.
---------------------------------------------------------------- */
/* Font Awesome Checkbox and RadioButton Colors.
---------------------------------------------------------------- */
/* Divider Colors.
---------------------------------------------------------------- */
/* Header Colors.
---------------------------------------------------------------- */
/* Background */
/* Text */
/* Magnify Glass */
/* Top Section Burger */
/* Bottom Section Search */
/* Dropdown Menu Section */
/* Wait Cover */
/* Footer Colors.
---------------------------------------------------------------- */
/* Footer Top */
/* Footer Bottom */
/* Cookie Directive */
/* Modal Colors.
---------------------------------------------------------------- */
/* Modal Header */
/* Modal Close Button */
/* Modal Body */
/* Word Prompter Colors.
---------------------------------------------------------------- */
/* Word Prompter Content */
/* Word Prompter Options */
/* Word Prompter Close Button */
/* Vertical Scroll Bar Colors.
---------------------------------------------------------------- */
/* Tool Tip Colors.
---------------------------------------------------------------- */
/* Accordions.
---------------------------------------------------------------- */
/* Preview Page.
---------------------------------------------------------------- */
/* Video Controls.
---------------------------------------------------------------- */
/* Results Refine Search.
---------------------------------------------------------------- */
/* Results Pagination Bar.
---------------------------------------------------------------- */
/* Lightbox Slider.
---------------------------------------------------------------- */
/* Lightbox Manager.
---------------------------------------------------------------- */
/* This shows when the user is dragging an item from a box to another box and isn't hovering over an item. */
/* Lightboxes Page.
---------------------------------------------------------------- */
/* Lightbox Page.
---------------------------------------------------------------- */
/* Shared Lightbox Page.
---------------------------------------------------------------- */
/* Make the Footer stick to the bottom of the page
---------------------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 0px;
}

/* JavaScript code in footer.comp.js sets this to be the same value as the height of the footer. */
#footer {
  position: absolute;
  bottom: 15px;
  width: 100%;
  display: none;
}

/* Footer Top
---------------------------------------------------------------- */
#FooterTop {
  margin-top: 15px;
  padding-top: 15px;
  background: #222222;
  color: #a7a7a7;
}

#FooterTop a {
  color: #a7a7a7;
}

#FooterTop a:hover {
  color: #a7a7a7;
}

#FooterTop ul {
  margin: 0;
  padding: 0;
}

#FooterTop li {
  margin-top: 4px;
  list-style-type: none;
}

#FooterTopWrap {
  margin-left: 15px;
}

.FooterSectionWrap {
  float: left;
  width: 100%;
}

.FooterSection {
  float: left;
  width: 100%;
  padding-bottom: 40px;
}

.FooterSection a {
  text-decoration: none;
}

.FooterSection a:hover {
  text-decoration: underline;
}

.FooterTitle {
  font-size: 16px;
  color: white;
}

@media (min-width: 480px) {
  #FooterTop {
    padding-top: 40px;
  }
  #FooterTopWrap {
    margin-left: 10%;
  }
  .FooterSection {
    float: left;
    width: 50%;
  }
}

@media (min-width: 768px) {
  #FooterTopWrap {
    margin-left: 5%;
  }
  .FooterSectionWrap {
    width: 50%;
  }
  .FooterSection {
    float: left;
    width: 50%;
  }
}

/* Footer Bottom
---------------------------------------------------------------- */
#FooterBottom {
  border-top: #101010 1px solid;
  padding: 15px;
  background: #1a1a1a;
  color: #a7a7a7;
}

#FooterBottom a {
  color: #a7a7a7;
}

#FooterBottom a:hover {
  color: #a7a7a7;
}

#FooterEulaMobile {
  display: block;
}

#FooterEulaMobile a {
  text-decoration: none;
}

#FooterEulaMobile a:hover {
  text-decoration: underline;
}

#FooterEulaDesktop {
  float: left;
  display: none;
}

#FooterEulaDesktop a {
  text-decoration: none;
}

#FooterEulaDesktop a:hover {
  text-decoration: underline;
}

.FooterCopyright {
  margin-top: 6px;
  font-size: 12px;
  color: #b3b3b3;
}

#FooterSocialMedia {
  padding-top: 20px;
  text-align: center;
}

@media (min-width: 768px) {
  #FooterTopWrap {
    margin-left: 5%;
  }
  .FooterSectionWrap {
    width: 50%;
  }
  .FooterSection {
    float: left;
    width: 50%;
  }
  #FooterEulaMobile {
    display: none;
  }
  #FooterEulaDesktop {
    display: block;
  }
  #FooterSocialMedia {
    float: right;
    padding-top: 0;
    text-align: left;
  }
}

/* Bootstrap Breakpoints.
---------------------------------------------------------------- */
/* Container Sizes.
---------------------------------------------------------------- */
/* Body Colors.
---------------------------------------------------------------- */
/* Text Colors.
---------------------------------------------------------------- */
/* Button Colors.
---------------------------------------------------------------- */
/* Font Awesome Checkbox and RadioButton Colors.
---------------------------------------------------------------- */
/* Divider Colors.
---------------------------------------------------------------- */
/* Header Colors.
---------------------------------------------------------------- */
/* Background */
/* Text */
/* Magnify Glass */
/* Top Section Burger */
/* Bottom Section Search */
/* Dropdown Menu Section */
/* Wait Cover */
/* Footer Colors.
---------------------------------------------------------------- */
/* Footer Top */
/* Footer Bottom */
/* Cookie Directive */
/* Modal Colors.
---------------------------------------------------------------- */
/* Modal Header */
/* Modal Close Button */
/* Modal Body */
/* Word Prompter Colors.
---------------------------------------------------------------- */
/* Word Prompter Content */
/* Word Prompter Options */
/* Word Prompter Close Button */
/* Vertical Scroll Bar Colors.
---------------------------------------------------------------- */
/* Tool Tip Colors.
---------------------------------------------------------------- */
/* Accordions.
---------------------------------------------------------------- */
/* Preview Page.
---------------------------------------------------------------- */
/* Video Controls.
---------------------------------------------------------------- */
/* Results Refine Search.
---------------------------------------------------------------- */
/* Results Pagination Bar.
---------------------------------------------------------------- */
/* Lightbox Slider.
---------------------------------------------------------------- */
/* Lightbox Manager.
---------------------------------------------------------------- */
/* This shows when the user is dragging an item from a box to another box and isn't hovering over an item. */
/* Lightboxes Page.
---------------------------------------------------------------- */
/* Lightbox Page.
---------------------------------------------------------------- */
/* Shared Lightbox Page.
---------------------------------------------------------------- */
/* Cookie Notification
---------------------------------------------------------------- */
#cookie_directive_container {
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  height: 100px;
  border-top: #b7b8bd 2px solid;
  background: #f8f8f8;
  color: black;
  z-index: 1030;
  display: none;
}

#cookie_directive_container a {
  color: black;
}

#cookie_directive_container a:hover {
  color: black;
}

#cookie-directive-content-mobile {
  flex: 1;
  padding: 5px 0 0 15px;
  display: block;
}

#cookie-directive-content-desktop {
  flex: 1;
  padding: 15px 0 0 15px;
  display: none;
}

@media (min-width: 480px) {
  #cookie_directive_container {
    height: 75px;
  }
}

@media (min-width: 576px) {
  #cookie_directive_container {
    height: 50px;
  }
}

@media (min-width: 992px) {
  #cookie-directive-content-mobile {
    display: none;
  }
  #cookie-directive-content-desktop {
    display: block;
  }
}

html,
body {
  height: 100%;
}

body {
  display: flex;
  flex-direction: column;
  -ms-flex-align: center;
  -ms-flex-pack: center;
  align-items: center;
  justify-content: center;
  padding-top: 40px;
  padding-bottom: 40px;
  background-color: #F7F8FA;
}

main {
  min-width: 400px;
}

#brand-name {
  color: #0011FF;
  font-weight: 800;
  font-size: 28px;
  padding: 15px 0 20px 0;
}

#brand-image {
  width: 320px;
}

#form-container {
  width: 100%;
  padding: 5px;
}

.formsiteaccess {
  width: 100%;
  max-width: 400px;
  padding: 30px;
  margin: 0 auto;
  background: #ffffff;
  border-radius: 10px;
  border: 1px solid #eeeeee;
  text-align: center;
}

.formsiteaccess .checkbox {
  font-weight: 400;
}

.formsiteaccess .form-control {
  position: relative;
  box-sizing: border-box;
  height: auto;
  padding: 10px;
  font-size: 16px;
}

.formsiteaccess .form-control:focus {
  z-index: 2;
}

#ValidateFormSubmitButton {
  cursor: pointer;
  background: #3b5e8c;
  color: white;
}

#ValidateFormWaitButton {
  cursor: pointer;
  background: #7391b8;
  color: white;
}

.input-group-text {
  border: 1px solid #ced4da;
  appearance: none;
  border-radius: 0.25rem;
  height: 46px;
}

.MessageWrap {
	height: 20px;
}
#form-container {
	display: none;
}
#new-site-message {
	display: none;
	text-align: center;
	font-size: 18px;
}
#access-footer {
	display: none;
	height: 40px;
	text-align: center;
	position: fixed;
	bottom: 0px;
}
