/******
 * Note on font sizes
 *
 * Always use "em". IE 5-7 only allow font-resizing via the menu if using a relative size
 *   (such as percentage or em). If using point or pixel size, the font size is completely fixed.
 *   (does not affect Mozilla, Opera, Safari)
 **/
/******
 * 0. Undo CITI/default styles
 *
 * Even if CITI stylesheet is not loaded, it is still a good idea to do this,
 * because not all browsers start with the same default styles (example:
 * margin/padding on list items are different on IE, Mozilla and Konqueror.)
 *
 *   --- Additional CITI undo statements are in ie.css and ie6-.css ---
 *
 **/
h1,
h2,
h3,
h4,
h5,
h6,
p,
td,
th {
  color: inherit;
  /*citi*/
  background: none;
  /*citi*/
  text-decoration: inherit;
  /*citi*/
  border: 0;
  padding: 0;
  margin: 0;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 1rem 0;
}

/*

  ul,ol,li {
    color: inherit;
    background: none;
    font-size: 1rem;
    font-family: inherit;
    text-decoration: inherit;
    border: 0;
    padding: 0;
    margin: 0;
  }

  ul,ol {
    margin: 1rem 0;
  }
  ul,ol {
    padding-left: 3rem;
  }
  ul {
    list-style-image: none;
    list-style-type: disc;
  }
  */
a img {
  border: 0;
}

textarea {
  width: 95%;
}

/**********************
   * 1. Styling the structure
   *
   * change this to give the site a different "theme"
   **********************/
/******
   * Header
   **/
#header {
  overflow: hidden;
  /* auto-contain float */
  padding: 2px 15px;
  margin-bottom: 0;
  background-color: #0000cc;
  /* #336699;
      CITI blue */
  color: #ffffff;
  font-size: 1.25em;
}

* html #header h1 {
  width: 100%;
}

#header h1 {
  margin: 0.5rem 0 0 0;
  font-size: 1.8rem;
  width: 620px;
}

#header h2 {
  float: left;
  clear: left;
  margin: 0.67rem 0 0 0;
  font-size: 1rem;
  font-weight: normal;
}

#header h2 .desc {
  font-size: 0.75rem;
}

#header a {
  color: #ffffff;
  text-decoration: none;
}

#header .chrpp-title {
  font-size: 20px;
  margin: 0.67rem 0 0;
}

#header #toplogo {
  float: right;
  margin: 2px 0;
}

#header #institution-logo {
  float: right;
  margin: 2px 10px 2px 0;
  border: 5px solid #ed6d00;
  max-width: 150px;
  max-height: 120px;
}

#header .topmenu {
  float: left;
  margin: 32px 5px 4px 5px;
  font-size: 1.3rem;
  height: 30px;
}

#header p {
  float: right;
  margin: 10px 1rem 0 0;
  font-size: 0.8rem;
}

div.error {
  color: #ff0000;
  padding: 3px 5px;
  font-size: 95%;
  display: none;
}

label.error {
  color: #ff0000;
  font-weight: bold;
}

#login-notice td,
#login-notice th {
  text-align: left;
  padding: 3px;
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  border: 1px solid #ccc;
}

#login-notice td {
  border-left: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
}

#content_login {
  /*   display: inline; */
  /*   float: left; */
  /*   zoom: 1; */
  /*   height: 100%; */
  display: block;
  width: 600px;
  border-right: 1px solid #0000cc;
  /*#004992 = dark blue*/
  /* invis bottom border - cheat to make border-right extend to the bottom, how: integrates margin-bottom of
         child elements inside the content_main box, by default the margins spill outside the box */
  border-bottom: 1px solid white;
  padding-right: 50px;
  font-size: 1.2rem;
}

/*************************
  * login classes
  *************************/
table.progress {
  border-width: 2px 2px 2px 2px;
  border-spacing: 2px;
  border-style: solid solid solid solid;
  border-color: gray gray gray gray;
  border-collapse: separate;
  background-color: white;
  font-size: 12pt;
}

table.progress th {
  border-width: 1px 1px 1px 1px;
  padding: 5px 5px 5px 5px;
  border-style: inset inset inset inset;
  border-color: gray gray gray gray;
  background-color: white;
  text-align: center;
  -moz-border-radius: 0px 0px 0px 0px;
  background-color: #ddaaff;
  color: #303;
}

table.progress td {
  border-width: 1px 1px 1px 1px;
  padding: 5px 5px 5px 5px;
  border-style: inset inset inset inset;
  border-color: gray gray gray gray;
  background-color: white;
  -moz-border-radius: 0px 0px 0px 0px;
  font-size: 12pt;
}

table.progress a {
  font-size: 14pt;
}

/*************************
   * 2. General-purpose classes (can appear anywhere)
   *************************/
.banner1,
.banner2 {
  margin: -5px -15px 0px -20px !important;
  padding: 5px 10px !important;
  border-bottom: 1px solid #00c;
}

.banner1 {
  background: #f9f;
}

.banner2 {
  background: #ff9;
}

/* change orange from EE8800 to FF6600 - apr 29/08 */
.orange,
.green,
.blue,
.red,
.internal,
.external,
.new-ext,
.ext-raw,
.more,
.rollover {
  font-weight: bold;
}

.orange,
a.orange,
.more,
a.more {
  color: #ff6600 !important;
}

.green,
a.green,
.rollover,
a.rollover {
  color: #00cc00;
}

.blue,
a.blue,
.external,
a.external,
a.new-ext,
.ext-raw {
  color: #0099ff !important;
}

.red {
  color: #cc3333;
}

/*added by RRF to solve issue */
a.green:visited,
a.rollover:visited {
  color: #00cc00;
}

a.orange,
a.more {
  padding-right: 10px;
  background: transparent url(/images/superscript-moreinfo.png) no-repeat top right;
  border: 1px solid transparent;
}

a.red,
a.internal {
  padding-right: 10px;
  background: transparent url(/images/superscript-internal.png) no-repeat top right;
}

a.green span,
a.rollover span {
  display: none;
}

a.green,
a.rollover {
  position: relative;
  padding-right: 10px;
  background: transparent url(/images/superscript-glossary.png) no-repeat top right;
}

a.green:hover span,
a.rollover:hover span {
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  z-index: 500;
  background: #ccffcc;
  color: #000;
  border: 1px solid #000;
  padding: 3px 0 2px 6px;
  font-weight: normal;
  font-size: 80%;
  background: none;
  background-color: #ccffcc;
}

.orangebox,
.yellowbox,
.bluebox,
.purplebox {
  padding: 0.7rem;
  font-size: 16px;
}

.orangebox img,
.yellowbox img,
.bluebox img,
.purplebox img {
  float: right;
  margin: 2px;
}

.orangebox a {
  color: #cc0000;
}

/* change border from FFCC99 to FF6600 - apr 29/08 */
.orangebox {
  background: #ffffff;
  border: 0.5em solid #ff6600;
}

.yellowbox {
  background: #ffff99 !important;
}

.bluebox {
  background: #ddeeff;
}

.purplebox {
  background: #ddaaff !important;
}

.submit {
  background: #ddaaff;
  border: 1px solid black;
  margin: 0.2rem 1rem;
  padding: 0.2rem 0.5rem;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: black;
}

a.bigbutton {
  float: left;
  display: block;
  background-color: #ff6600;
  margin: 1rem 1rem;
  padding: 0.4rem 1rem;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  font-size: 24px;
  color: black;
  text-decoration: none;
}

a.bigbutton:hover {
  background-color: orange;
}

a.bigbutton2 {
  float: left;
  display: block;
  background-color: blue;
  margin: 1rem 1rem;
  padding: 0.4rem 1rem;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  font-size: 24px;
  color: white;
  text-decoration: none;
}

a.bigbutton2:hover {
  background-color: #0066ff;
}

.gradstudent {
  background: #ff9900;
  border: 1px solid black;
  margin: 0.2rem 1rem;
  padding: 0.2rem 0.5rem;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: black;
  text-decoration: none;
}

.notgradstudent {
  background: #66ff00;
  border: 1px solid black;
  margin: 0.2rem 1rem;
  padding: 0.2rem 0.5rem;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: black;
  text-decoration: none;
}

.quizresponse {
  background: #ddeeff;
  margin-right: 1rem;
  padding: 1px 0.5rem;
}

.quizans {
  height: 15rem;
  overflow: auto;
  padding: 0.5rem;
  border: 0.5rem solid #00bbbb;
}

ol.qchoices {
  list-style-type: lower-alpha;
}

ol.qchoices li {
  margin: 1rem 0;
}

/*************************
   * 2.1. Themable - can change colours/styles/etc to give different "theme"
   *******/
abbr,
.abbr {
  color: #0099cc;
  border-bottom: dashed 1px #0099cc;
  cursor: help;
}

.correct {
  color: #009900;
}

.incorrect {
  color: #cc0000;
}

.submitfeedback {
  color: #000099;
  font-size: 90%;
}

/** Button  #DDAAFF;  #EEBBFF;**/
a.button1,
a.fr-button1 {
  float: left;
  display: block;
  background-color: #ddaaff;
  border: 1px solid black;
  margin: 0.2rem 1rem;
  padding: 0.2rem 0.5rem;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: #f3e2fe !important;
  font-weight: 600;
  text-decoration: none;
}

a.button1:hover,
a.fr-button1:hover,
#content_side a.button1:hover,
#content_side a.fr-button1:hover {
  background-color: #eebbff;
  color: #5e2466 !important;
}

a.button1:visited,
a.fr-button1:visited {
  color: #f3e2fe;
}

/** Button  #DDAAFF;  #EEBBFF;**/
a.buttonvid {
  float: left;
  display: block;
  background-color: #ff6600;
  border: 1px solid black;
  margin: 0.2rem 1rem;
  padding: 0.2rem 0.5rem;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: black;
  text-decoration: none;
}

a.buttonvid:hover {
  background-color: #ff9900;
}

/** Tabbed containers **/
ul.tabbed {
  /*   overflow: auto; */
  float: left;
  padding: 0 1rem;
  border-bottom: 1px solid black;
  font-size: 0.8rem;
}

ul.tabbed li {
  float: left;
  list-style-type: none;
}

ul.tabbed li a:before {
  content: url("/images/corner.gif");
  display: block;
  /*    margin-left: -1.0rem;
     margin-top: -0.3rem; */
  margin-left: -14px;
  margin-top: -11px;
  /* position not supported by Moz on pseudo elements... looks ugly */
  /*   position: relative;
    top: -1px;
    left: -1px; */
}

ul.tabbed li a {
  display: block;
  position: relative;
  top: 1px;
  z-index: 2;
  /*   padding: 0.3rem 1.0rem; */
  padding: 4px 13px;
  margin: 0 0.5rem;
  /*   background-image: url("images/corner.gif");
    background-repeat: no-repeat;
    background-position: -1px -1px; */
  border: 1px solid #000000;
  border-bottom: 1px solid #cceedc;
  background-color: #ddaaff;
  color: #000000;
  text-decoration: none;
}

ul.tabbed li.selected a {
  background: #dddddd;
  color: #777777;
}

/** "Folders" **/
ul.folders {
  float: left;
  padding: 0 1rem;
  font-size: 0.8rem;
}

ul.folders li {
  float: left;
  margin: 3px 0;
  list-style-type: none;
}

ul.folders li a:before {
  content: url("images/corner.gif");
  display: block;
  margin-top: -11px;
  /* Set to vertical padding of parent *(-1) - 1,  */
  margin-left: -15px;
  margin-bottom: 5px;
  /* Set to margin_top *(-1) - image_height - 1 */
  border: 0px solid red;
}

ul.folders li a {
  display: block;
  position: relative;
  z-index: 2;
  padding: 10px 14px;
  margin: 0 0.5rem;
  border: 1px solid #000000;
  background-color: #00ff00;
  color: #000000;
  text-decoration: none;
}

/** The "rank-order" dragging activity. **/
ol.rankdrag {
  /*   list-style-position: outside; */
}

ol.rankdrag li {
  /* do not give OL LI items width/height/etc or "hasLayout" in IE will
       trigger, and list numbering will be restarted */
}

ol.rankdrag.fixwidth {
  /* padding fixes hidden bullet in IE5-7 'hasLayout' */
  padding-left: 3rem;
  margin-left: 0;
  width: 90%;
}

ol.rankdrag.fixwidth li {
  padding-left: 0.2rem;
  cursor: move;
}

ol.rankdrag.fixwidth li a {
  /* display: block erases the bullets from Opera?!*/
  display: block;
  background: #eeeeee;
  border: 1px solid #333;
  padding: 0.1rem 0.4rem;
  margin: 0.2rem;
  /* IE requires explicit width to click whole area */
  width: 95%;
  text-decoration: none;
  color: black;
  cursor: move;
}

/** Quizzes **/
.question {
  margin-left: 50px;
  color: #006262;
  color: #501f56;
  font-weight: bold;
}

.question img {
  display: block;
  float: left;
  margin-left: -50px;
  margin-top: -10px;
}

/* a hack to place the image beside the question. not the best way. maybe use list-style-image */
.question .qmark {
  position: absolute;
  display: block;
  left: -50px;
  margin-left: -1rem;
  top: -0.3rem;
}

/** List bullets **/
.nobullet {
  list-style-type: none;
}

.bulletsquare {
  list-style-type: square;
}

.bulletarrow0 {
  list-style-image: url(/images/arrowbullet_black.gif);
}

.bulletarrow1 {
  list-style-image: url(/images/arrowbullet_lightblue.gif);
}

.bulletarrow2 {
  list-style-image: url(/images/arrowbullet_blue.gif);
}

.bulletarrow3 {
  list-style-image: url(/images/arrowbullet_green.gif);
}

.bulletarrow4 {
  list-style-image: url(/images/arrowbullet_red.gif);
}

ol.bulletarrow li.color0,
ul.bulletarrow li.color0,
ol.bulletarrow li,
ul.bulletarrow li {
  list-style-image: url(/images/arrowbullet_black.gif);
}

ol.bulletarrow li.color1,
ul.bulletarrow li.color1 {
  list-style-image: url(/images/arrowbullet_lightblue.gif);
}

ol.bulletarrow li.color2,
ul.bulletarrow li.color2 {
  list-style-image: url(/images/arrowbullet_blue.gif);
}

ol.bulletarrow li.color3,
ul.bulletarrow li.color3 {
  list-style-image: url(/images/arrowbullet_green.gif);
}

ol.bulletarrow li.color4,
ul.bulletarrow li.color4 {
  list-style-image: url(/images/arrowbullet_red.gif);
}

.pagemenu {
  color: #c00;
}

.pagemenu a {
  color: #c00;
  font-weight: bold;
  text-decoration: none;
}

.pagemenu a:visited {
  color: #600;
}

.pagemenu li.selected {
  list-style-image: url(/images/arrowbullet_black.gif);
}

.pagemenu li.selected a {
  color: #999 !important;
}

dl.bulleted dt {
  display: list-item;
  margin-top: 1rem;
  font-weight: bold;
}

dl.bulleted {
  list-style-position: outside;
  margin-left: 1.2rem;
  padding-left: 0rem;
}

/** Colours **/
.color1,
li.color1,
li.color1 a {
  color: #0066cc;
  /*  text-decoration: none; */
}

li.color1 a:visited {
  color: #86a3bf;
}

.color2,
li.color2,
li.color2 a {
  color: #dd0000;
  /*  text-decoration: none; */
}

li.color2 a:visited {
  color: #d19292;
}

.color3,
li.color3,
li.color3 a {
  color: #007700;
  /*  text-decoration: none; */
}

li.color3 a:visited {
  color: #4b6b4b;
}

.glossary-term {
  color: #006400;
  font-weight: bold;
}

/*************************
   * 2.2. Non-themable - The names imply the presentation.
   *
   * These styles are used when the HTML page developer wants a certain formatting,
   * so they shouldn't really change.
   ********/
.hide {
  display: none;
}

.center {
  text-align: center;
}

.left {
  text-align: left;
}

/*.right  {text-align: right;}*/
.floatleft {
  float: left;
}

.floatright {
  float: right;
}

.floatnone {
  float: none;
}

.clear {
  clear: both;
}

.clearleft {
  clear: left;
}

.clearright {
  clear: right;
}

img.floatright {
  margin: 0.5rem;
  margin-right: 0;
}

img.floatleft {
  margin: 0.5rem;
  margin-left: 0;
}

.small4,
a.small4 {
  font-size: 66.67%;
}

.small3,
a.small3 {
  font-size: 75%;
}

.small2,
a.small2 {
  font-size: 83.33%;
}

.small,
a.small {
  font-size: 90%;
}

.big,
a.big {
  font-size: 111.11%;
}

.big2,
a.big2 {
  font-size: 120%;
}

.big3,
a.big3 {
  font-size: 133.33%;
}

.big4,
a.big4 {
  font-size: 150%;
}

.bold {
  font-weight: bold;
}

.alpha {
  list-style-type: lower-alpha;
}

.borderblack {
  border: 1px solid black;
}

/* the following box/bg classes may be too specific...*/
.boxyellow {
  border: 1px solid #000000;
  padding: 0.66rem;
  background-color: #ffffcc;
}

.bglightblue {
  background-color: #ccffff;
}

.bgpink {
  background-color: #ffcccc;
}

.bglightgreen {
  background-color: #e3ff93;
}

.bgyellowgreen {
  background-color: #99cc00;
}

.bgyellow {
  background-color: #ffec86;
}

.bglightyellow {
  background-color: #ffff99;
}

/* .blue {color: #004992; }*/
/*dark blue*/
.minheight12em {
  min-height: 12rem;
}

/** Spacing **/
ul.padded li,
li.padded,
.padded {
  padding: 0.5rem;
}

ul.spaced li,
ol.spaced li {
  margin-top: 1rem;
  margin-bottom: 1rem;
}

ul.halfspaced li,
ol.halfspaced li {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

ul.tight li,
ol.tight li {
  margin-top: 0rem;
  margin-bottom: 0rem;
}

dl.spaced dt {
  margin-top: 1rem;
}

/*************************
   * Dreamweaver code-completion cues
   ********/
a.external,
a.new-ext,
a.ext-raw {
  padding-right: 10px;
  background: transparent url(/images/superscript-external.png) no-repeat top right;
}

/**
   * Primary links
   */
ul.primary {
  list-style: none;
  margin-left: -20px;
}

ul.primary li {
  display: inline;
  font-size: 12px;
  padding-left: 10px;
}

ul.primary li:first-child {
  margin-left: 20px;
}

.topmenu {
  /*position : relative;
      top: 59px;
      left: 20px;
      display : block;
      padding-bottom: 5px;
      padding-right : 30px;
      min-height : 20px;*/
}

div.topmenu ul.primary {
  margin-left: -27px;
}

div.topmenu ul.primary li {
  /* border : 0.215rem ridge #663366;
      */
  border: 0.165em outset #996699;
  font-size: 13px;
  text-align: center;
  text-decoration: none;
  padding-bottom: 5px;
  padding-top: 5px;
  padding-left: 4px;
  padding-right: 4px;
  background-color: #cc99cc;
}

div.topmenu ul.primary li a:link,
div.topmenu ul.primary li a:visited {
  background-color: #cc99cc;
  color: #ffccff;
  color: #663366 !important;
  text-decoration: none;
  padding-bottom: 2px;
  padding-top: 2px;
  padding-left: 4px;
  padding-right: 4px;
  text-align: center;
}

div.topmenu ul.primary li a:hover {
  background-color: #e9d0f7;
  color: #663366 !important;
  color: #cc99cc !important;
  color: #9d51c4 !important;
  text-decoration: none;
  border: 0.01em inset #660066;
  padding-bottom: 2px;
  padding-top: 2px;
  padding-left: 4px;
  padding-right: 4px;
  text-align: center;
}

/* ends here */
.frame-close-notice {
  text-align: center;
  font-size: 14px;
  padding: 5px 0;
}

.media-notice {
  color: green;
  font-weight: bold;
}

/**
   * Sortable
   */
#sortable {
  list-style-type: none;
  margin: 0;
  padding: 0;
  /*background-color:#FFC; */
  margin-left: -20px;
}

#sortable li span {
  /*position: absolute;
      margin-left: -1.3rem;
    margin-right: -10px;
    margin-left: -30px;*/
  position: relative;
  float: left;
  padding-right: 1px;
  /*  background-color:#FC9; */
}

#sortable li {
  /* margin: 0px 3px 3px 3px;
    padding: 0.025rem;
    padding-left: 1.25rem;
    font-size: 0.9rem;
    cursor: move;
  */
}

#sortable li.ui-state-default {
  float: right;
  padding: 3px;
  padding-left: 2.75rem;
  font-size: 0.9rem;
  cursor: move;
  margin-bottom: 8px;
  color: #06c;
  padding-bottom: 5px;
  padding-top: 2px;
  padding-right: 5px;
  padding-left: 15px;
  font-weight: 400;
  font-variant: normal;
  width: 255px;
  text-align: left;
  background-color: #ffc !important;
}

.ui-icon-arrowthick-2-n-s {
  padding-right: 0px;
}

/** Poll **/
.submiterror {
  color: red;
  font-weight: bold;
}

.poll {
  margin-bottom: 20px;
  border: 5px solid #e5e5e5;
  padding: 20px;
}

.poll h3 {
  font-size: 16px;
  font-weight: normal;
  padding: 0;
  margin: 0;
}

.poll p.question {
  margin: 5px 0;
  padding: 0;
}

/** Institution pages **/
.institution-side-content {
  border: 2px solid blue;
  padding: 10px;
}

.institution-login {
  background-color: #ff6600;
  margin-top: 20px;
  font-size: 34px;
  padding: 10px 20px;
  text-align: center;
}

.institution-login a {
  color: #fff;
  text-decoration: none;
}

/** Welcome page login button **/
.home-get-chrpp a,
.home-login a,
#content_side .button1 a,
#content_side .fr-button1 a {
  color: #fff;
  text-decoration: none;
}

.home-login {
  background-color: #ff9900;
  border: thin solid #cccccc;
  color: #ffffff;
  display: block;
  font-size: 2em;
  margin: 5px 15px;
  padding: 10px 20px;
}

.home-get-chrpp,
a.button1,
a.fr-button,
#content_side .button1,
#content_side .fr-button1 {
  background-color: blue;
  border: thin solid #cccccc;
  color: #ffffff;
  display: block;
  font-size: 1.8rem;
  font-weight: bold;
  margin: 5px 15px;
  padding: 10px 8px;
  text-align: center;
}

/* CSS Document */
/**
 * Content Styles
 */
.quizresponse {
  background: #fff;
}

.more-box .close {
  display: block;
  float: right;
  color: #000;
  font-size: 0.8rem;
  cursor: pointer;
  border: 0.015rem solid black;
  padding: 2px;
  height: 14px;
  width: 12px;
  text-align: center;
  /* added by RRF April 23 for spacing issue*/
  margin-left: 5px;
  font-weight: 600;
  text-transform: uppercase;
  background-color: #E8E8E8;
  background-color: #fddb96;
}

#TB_title {
  /*added by RRF for orange box close / fermer */
  font-weight: bold;
}

p.quote {
  color: #990099;
  font-style: italic;
  font-weight: bold;
  text-align: center;
}

#content_main div.tcps-button, #content_main p.tcps-button {
  text-align: right;
  vertical-align: bottom;
  margin-right: -5px;
  margin-bottom: 2px;
  /* margin-top: 50px; */
}

img.tcps-button {
  vertical-align: middle;
  margin-top: 5px;
  /* height: 36px;
  width: 80px; */
}

div.transcript {
  padding: 10px 0;
  clear: both;
}

div.transcript span {
  /*background: transparent url("/images/pre/transcript-icon-sm.gif") no-repeat center right;
  padding: 5px 25px 5px 0px;*/
}

div.transcript a {
  background: transparent url("/images/pre/transcript-icon-sm.gif") no-repeat center right;
  padding: 5px 25px 5px 0px;
}

/** Content side **/
#content_side {
  /*border-left: 1px solid #990099; */
  /* added by RRF to resolve dynamic growth and shrinking */
  /* min-height: 250px;
  height:inherit;
  border-left: 2px solid #7d4490;*/
  margin-top: 0px;
  z-index: 100;
}

#content_main {
  /* 
  border-left: 2px solid #7d4490;
  background-image:url("/images/pre/side_divider.png");
  background-repeat: repeat-y;	
  background-position: right;
  min-height: 250px;
  height:auto; */
}

#content_side div.tcps-button, #content_side p.tcps-button {
  text-align: left;
}

/** Bullet styles **/
#content_main ul {
  padding-left: 1.6rem;
}

#content_side ul {
  padding-left: 1.3rem;
}

#content_side ul.compass-bullet {
  padding-left: 0;
}

li.arrow-bullet-red,
li.arrow-bullet-red-quarter,
li.arrow-bullet-red-half {
  list-style-image: url(/images/arrowbullet_red.gif);
}

#content_main ul.arrow-bullet-red-quarter {
  padding-left: 2rem;
}

#content_main ul.arrow-bullet-red-half {
  padding-left: 3rem;
}

li.arrow-bullet-purple,
li.arrow-bullet-purple-quarter,
li.arrow-bullet-purple-half,
ul.arrow-bullet-purple,
ul.arrow-bullet-purple-quarter,
ul.arrow-bullet-purple-half {
  list-style-image: url(/images/arrowbullet_purple.gif);
}

li.arrow-bullet-purple {
  padding-left: 0.8rem;
}

#content_main ul.arrow-bullet-purple-quarter {
  padding-left: 2rem;
}

#content_main ul.arrow-bullet-purple-half {
  padding-left: 3rem;
}

li.arrow-bullet-black,
li.arrow-bullet-black-quarter,
li.arrow-bullet-black-half {
  list-style-image: url(/images/arrowbullet_black.gif);
}

#content_main ul.arrow-bullet-black-quarter {
  padding-left: 2rem;
}

#content_main ul.arrow-bullet-black-half {
  padding-left: 3rem;
}

li.arrow-bullet-blue,
li.arrow-bullet-blue-quarter,
li.arrow-bullet-blue-half {
  list-style-image: url(/images/arrowbullet_blue.gif);
}

li.arrow-bullet-blue-quarter {
  padding-left: 2rem;
}

#content_main ul.arrow-bullet-blue-half {
  padding-left: 3rem;
}

li.arrow-bullet-green,
li.arrow-bullet-green-quarter,
li.arrow-bullet-green-half {
  list-style-image: url(/images/arrowbullet_green.gif);
}

ul.arrow-bullet-green-quarter {
  list-style-image: url(/images/arrowbullet_green.gif);
}

ul.arrow-bullet-green-half {
  padding-left: 3rem;
}

li.arrow-bullet-lightblue,
li.arrow-bullet-lightblue-quarter,
li.arrow-bullet-lightblue-half {
  list-style-image: url(/images/arrowbullet_lightblue.gif);
}

ul.arrow-bullet-lightblue-quarter {
  padding-left: 2rem;
}

ul.arrow-bullet-lightblue-half {
  padding-left: 3rem;
}

li.compass-bullet,
li.compass-bullet-quarter,
li.compass-bullet-half,
ul.compass-bullet,
ul.compass-bullet-quarter,
ul.compass-bullet-half {
  list-style-image: url(/images/compass-bullet.png);
}

li.compass-bullet {
  list-style-image: none;
  list-style: none;
  background: transparent url(/images/compass-bullet.png) no-repeat top left;
  padding-left: 2.8rem;
  padding-bottom: 10px;
}

#content_main ul.compass-bullet {
  padding-left: 0rem;
}

#content_main ul.compass-bullet-quarter {
  padding-left: 2.5rem;
}

#content_main ul.compass-bullet-half {
  padding-left: 3.5rem;
}

ul.hyphen-bullet {
  list-style-image: url(/images/pre/hyphen-bullet.png);
  /*remmed out by RRF April 20, 2011 */
  /* padding-left: 0; */
}

ul.hyphen-bullet li {
  list-style-image: url(/images/pre/hyphen-bullet.png);
}

#content_main ul.hyphen-bullet {
  margin-left: -0.5rem;
}

#content_main ul.hyphen-bullet li {
  padding-left: 1.1rem;
}

li.bullet-box {
  cursor: pointer;
}

li.bullet-box.visited {
  color: #666;
}

li.bullet-box.selected {
  color: #990099;
}

li.bullet-box a {
  color: #000;
}

/* remmed out by RRF as per LLB instructions June 2, 2011
li.bullet-box:hover, li.bullet-box a:hover {
  color: #990099;
}
*/
li.bullet-box a.rollover {
  color: #00cc00;
}

ol.qchoices li a:visited {
  color: blue;
}

#content_side ul.arrow-bullet-purple li a {
  font-weight: normal;
  color: #000;
}

/* added by RRF to resolve issue Keep Consent Free Mod-3 */
#content_main li.arrow-bullet-purple a {
  font-weight: normal;
  color: #990099;
}

/* added by RRF to resolve issue witj green links inside purple arrow list items */
#content_main li.arrow-bullet-purple a.rollover, #content_main li.arrow-bullet-purple:active a.rollover {
  color: #00CC00 !important;
}

#content_side ul.arrow-bullet-purple li a:visited {
  color: #666;
  /* change of color requested by LLB June 2, ,2011 */
  color: #000;
}

#content_side ul.arrow-bullet-purple li.selected a, #content_main ul.arrow-bullet-purple li.selected a {
  font-weight: bold;
  color: #990099;
}

/** Glossary **/
.red, .internal {
  color: #990099;
}

a.internal {
  color: #990099;
}

.more-box {
  display: none;
  padding: 10px;
  background-color: #FFCC66;
  margin-top: 10px;
  position: absolute;
  z-index: 200;
  /* added by RRF April 15, 2011 for demo */
  border: 0.025rem #666 ridge;
  margin-right: 8px;
  margin-left: 8px;
  width: 80%;
  font-size: 0.825rem;
  font-size: 0.85rem;
}

/* added by RRF to demo */
.more-box-bullet {
  /* list-style-image: url(/images/pre/hyphen-bullet.png); */
  list-style-type: square;
  padding-left: 0rem;
  padding-bottom: 3px;
}

li.arrow-bullet-purple {
  padding-bottom: 15px;
}

.purplebox {
  /*  background: #DDAAFF !important; */
  border: 0.25em solid #783f89;
  background: #FFFFFF !important;
  color: #450e59;
  font-size: 12px;
}

/**
 * Side menu styles
 */
/* added by RRF to fix isses with right side nav line */
.bullet-box-height {
  min-height: 250px;
  /* height: 450px; */
  overflow: visible;
}

/* ---------------- */
div.bullet-box {
  border: 3px solid #990099;
  padding: 3px;
  display: none;
}

#content_side div.bullet-box {
  position: absolute;
  z-index: 200;
  top: 0;
  background-color: #fff;
  /* added by RRF April 18, 2011*/
  margin-right: 5px;
  margin-top: 15px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 4px;
  padding-top: 8px;
  width: 250px;
  font-size: 0.85rem;
}

div.bullet-box.overlay {
  position: absolute;
  top: 150px;
  left: 100px;
  background-color: #fff;
  z-index: 100;
  width: 600px;
  height: 400px;
  overflow: auto;
  border-width: 6px;
}

.quizans {
  border-color: blue;
  /* added by RRF to demo */
  border: 0.35rem solid #7c428d;
}

/* added by RRF to demo */
.introSidebar {
  border: 0.35rem solid #7c428d;
  overflow: visible;
  margin-left: 15px;
  font-size: 12px;
  padding-left: 5px;
  padding-right: 5px;
  padding-bottom: 12px;
  padding-top: 8px;
}

#content_side .introSidebar div.tcps-button, #content_side .introSidebar p.tcps-button {
  text-align: center;
  background-color: #99F;
}

.introSidebar div.tcps-button img.tcps-button {
  vertical-align: middle;
  background-color: #F3C;
}

/* RRF ends here */
.shout {
  width: 80%;
  background: #4B015F;
  color: #fff;
  font-weight: bold;
  padding: 10px;
}

.shout a {
  color: #fff;
}

/* added by RRF April 20 */
.shout a:visited {
  color: #C9F;
}

/**
 * Links
 */
a {
  text-decoration: none;
}

a:visited {
  text-decoration: none;
  color: #666;
}

a:active {
  text-decoration: none;
}

a.button1, #content_side .button1, input.button1 {
  background-color: #4B015F;
  /* Added by RRF for DEMO TEST */
  float: right;
  height: 15px;
  width: 80px;
  text-align: center;
  vertical-align: middle;
  font-size: 1.2rem;
  padding-bottom: 10px;
  padding-top: 5px;
  margin-top: 2px;
  margin-right: 40px;
  color: #F3E2FE;
}

input.button1 {
  height: 35px;
  text-align: center !important;
  -moz-border-radius: 0.5rem;
  -webkit-border-radius: 0.5rem;
  float: none;
}

a.fr-button1, #content_side .fr-button1 {
  background-color: #4B015F;
  /* Added by RRF for DEMO TEST */
  float: right;
  height: 15px;
  width: 80px;
  text-align: center;
  vertical-align: middle;
  font-size: 1.2rem;
  padding-bottom: 10px;
  padding-top: 5px;
  margin-top: 2px;
  margin-right: 40px;
  width: 110px;
}

.core-better {
  background: transparent url("/images/pre/core-better.png") no-repeat top center;
  text-align: center;
  width: 525px;
  padding: 20px;
  height: 129px;
  margin: 10px auto 0 auto;
}

/* added by RRF as requested by LLB June 7, 20011 */
.core-better p {
  padding-left: 20px;
  padding-right: 20px;
}

.accentNote {
  font-size: 1.025rem;
}

.printCert {
  font-size: 1.2rem;
  margin: 15px 0;
  margin-right: 20px;
  border: 1px solid #333;
  background-color: #4B015F;
  color: #FFF;
  padding: 10px;
  float: right !important;
}

.printCert a {
  color: #FFF;
  font-weight: bold;
}

/* RRF new entries ends here */
.end-module .exit {
  font-size: 4rem;
  text-align: center;
  width: 120px;
  margin-top: 15px;
  margin: 10px auto 0 auto;
}

/** Certificate styles **/
#print-certificate .options {
  /* font-size: 1.2rem;
  margin: 15px 0;
  border: 3px solid #333;
  background-color: #FFF;
  padding: 10px;
  float: right;
  position: absolute; */
}

#print-certificate #survey-box {
  display: none;
  font-size: 120%;
  text-align: center;
}

#print-certificate #survey-box .links {
  margin: 0 auto;
  width: 500px;
  height: 30px;
}

#print-certificate #dashboard-link {
  float: left;
}

#print-certificate #survey-link {
  float: right;
}

/** Activation page **/
#activation-page .activation {
  border: 3px #333 solid;
  padding: 10px;
  width: 60%;
  margin: 0 auto;
  text-align: center;
}

/* Added style by RRF  */
.accentNote {
  font-weight: bold;
  color: #606;
}

#answer {
  margin-left: 10px;
}

#answerTable {
  /* RRF */
  top: -390px;
  left: 2px;
  display: block;
  float: left;
  position: relative;
  width: auto;
  margin-bottom: -375px;
  border-right: 2px solid #990099;
  background-color: transparent;
  margin-right: -13px;
}

.howtoapply {
  color: #606;
  border-bottom: dotted #C9F 0.1rem;
  border-left: dotted #C9F 0.1rem;
  /* background-color:#E3CFEF; */
  padding-left: 4px;
  padding-right: 2px;
  padding-bottom: 2px;
}

.poll {
  background-color: #FFC;
  background-color: #F8EDFE;
  border: 0.175em dotted #606;
  width: 60%;
  -moz-border-radius: 0.5rem;
  -webkit-border-radius: 0.5rem;
}

div.poll input.submit {
  background-color: #DDAAFF;
  border: 1px solid black;
  margin: 0.2rem 1rem;
  padding: 0.2rem 0.5rem;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: black;
  height: 35px;
  width: 110px;
  font-weight: 600;
}

a.clickhere:link, a.clickhere:active, a.clickhere:visited {
  color: #F60 !important;
  text-decoration: none;
  font-weight: bold;
}

a.clickhere:hover {
  color: #39F !important;
  text-decoration: none;
  font-weight: bold;
}

.tablecell_left {
  float: left;
  width: 50%;
  padding-right: 1px;
}

.tablecell_right {
  float: right;
  width: 40%;
}

.boundingblock {
  width: 95%;
}

.clearboth {
  height: 0;
  font-size: 1px;
  margin: 0;
  padding: 0;
  line-height: 0;
  clear: both;
}

.tabnav {
  float: right;
  margin-top: 5px;
}

.field {
  clear: left;
  margin-top: 15px;
}

.field label {
  width: 320px;
  float: left;
  padding-top: 2px;
}

.field input {
  margin-left: 10px;
  width: 375px;
  float: left;
}

table.vote-results {
  background-color: #E0D198;
  background-color: #EDF;
  border: 1px #4A3058 ridge;
  padding: 8px;
}

table.vote-results td {
  padding-left: 5px;
  padding-right: 5px;
}

hr.faq {
  border-top: 0.0125rem #D7D7D7 ridge;
  border-bottom: 0.12rem #E9E9E9 groove;
  border-left: 0;
  border-right: 0;
  width: 80%;
  text-align: left;
  margin-left: 0px;
}

table.feedback {
  /* background-color:#F8EDFE;
  border: .175rem dotted #606;
  width: 60%;
  -moz-border-radius: .50rem;
    -webkit-border-radius: .50rem; */
  border: 0.125rem solid #606;
}

table.feedback td {
  /* background-color:#EDF;
   border: 1px #4A3058 ridge;
   padding: 8px;
  -moz-border-radius: .50rem;
    -webkit-border-radius: .50rem; */
}

.submitrow {
  /*background-color:#EDF;
  border: 1px #4A3058 ridge;
  padding: 8px;
  -moz-border-radius: .50rem;
   -webkit-border-radius: .50rem; */
}

.feedback td.fieldLabels {
  /* background-color:#EDF; */
}

.feedback td.fieldLabels label.reqField {
  font-weight: bold;
}

.login div#formControls {
  text-align: left;
  /* -moz-border-radius: .50rem;
    -webkit-border-radius: .50rem; */
  vertical-align: middle;
  margin-top: 10px;
  padding-bottom: 5px;
}

.login div#formActions {
  margin-top: 5px;
}

div.login div#formControls .textbox {
  text-align: left;
  background-color: #DDAAFF;
}

.login div#formActions div#save {
  /*
  -moz-border-radius: .50rem;
  -webkit-border-radius: .50rem;
  background-color:#F3E2FE;
  border: .015rem ridge #606;
   margin-top: -1px; */
  float: none;
  margin-top: -20px;
}

.login div#formActions div#save .button, div.login .loginReminder .button, .loginReminder .button {
  height: 35px;
  width: 100px;
  -moz-border-radius: 0.5rem;
  -webkit-border-radius: 0.5rem;
  background-color: #DDAAFF;
  border: 1px solid #3F1744;
  margin: 0;
  padding: 0 0.5em;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: #5E2466;
  font-weight: 600;
  text-decoration: none;
  font-size: medium;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
}
.login div#formActions div#save .button:hover, div.login .loginReminder .button:hover, .loginReminder .button:hover {
  color: #fff;
  background-color: #3F1744;
}

div.login .loginReminder .textbox {
  width: 70%;
  float: none;
  text-align: center;
  background-color: #DDAAFF;
}

.loginReminder .textbox {
  width: 90%;
  float: none;
  text-align: center;
  background-color: #DDAAFF;
}

div.login .renderWithName .required label, div.login .renderWithName .left label {
  float: right;
  text-align: right;
}

div.login div#formControls .renderWithName .required label:after {
  /* content:"*"; */
  color: #5E2466;
  padding-left: 5px;
  font-weight: bolder;
}

div.login div#formControls .renderWithName .required label:before {
  content: "";
}

.login div#formControls {
  padding-top: 10px;
  width: 100%;
}

div.login a:link, div.login a:visited {
  text-decoration: none;
  color: #5E2466;
}

div.login a:hover {
  text-decoration: none;
  color: #B37AD8;
}

.dashboardLinksection {
  margin-top: 20px;
  -moz-border-radius: 0.5rem;
  -webkit-border-radius: 0.5rem;
  background-color: #F3E2FE;
  border: 0.015rem ridge #606;
  width: 94%;
  padding: 5px;
}

div.field_block .feedback .fieldLabels .reqField:after {
  /* content:"*"; 
  color:#5E2466;*/
  padding-left: 5px;
  font-weight: bolder;
}

div.field_block .submitrow input.button1 {
  width: 120px;
}

.col-left {
  float: left;
}

.col-right {
  float: right;
  margin-right: 100px;
}

.resolution {
  font-size: 0.75rem;
  text-align: center;
  line-height: 1rem;
}

.expandLinks {
  cursor: pointer;
}

.certName {
  margin-left: 15px;
  font-size: 40pt;
  font-weight: bold;
  color: #000000;
  text-align: center;
}

ul.spaced li.summaryExpand {
  list-style-image: url("../../images/expand.jpeg");
  padding-left: 3px;
}

ul.spaced li.summaryCollapse {
  list-style-image: url("../../images/collapse.jpeg");
  padding-left: 3px;
}

ul.spaced li.summaryExpand ul li, ul.spaced li.summaryCollapse ul li {
  list-style: square;
  list-style-image: none;
}

.summaryExpand, .summaryCollapse {
  cursor: pointer;
}

.faqRedirect {
  /*background-color:#F8EDFE;
  border: .175rem dotted #606; */
  width: 60%;
  padding: 5px;
  padding-bottom: 10px;
  -moz-border-radius: 0.5rem;
  -webkit-border-radius: 0.5rem;
}

.faqRedirect select.feedback {
  /* background-color:#EDF;
  border: 1px #4A3058 ridge;
  padding: 8px;
  -moz-border-radius: .50rem;
   -webkit-border-radius: .50rem; */
}

.newaccounts {
  border: 0.125rem #5E2466 solid;
  padding: 8px;
  margin-bottom: 20px;
}

div.newaccounts a.here:link, div.newaccounts a.here:visited {
  font-weight: bold;
  color: #481C4F;
}

.register-box {
  display: none;
  padding: 10px;
  background-color: #EFDCF8;
  margin-top: 10px;
  position: relative;
  z-index: auto;
  /* added by RRF April 15, 2011 for demo */
  border: 0.025rem #666 ridge;
  margin-right: 8px;
  margin-left: 8px;
  width: 82%;
  font-size: 0.8rem;
}

.register-box p, ol {
  font-size: 1rem;
  list-style-position: inside;
}

.register-box ol li {
  margin-left: -7px;
}

/* added by RRF to demo */
.register-box-bullet {
  /* list-style-image: url(/images/pre/hyphen-bullet.png); */
  list-style-type: square;
  padding-left: 0;
  padding-bottom: 3px;
}

.register-box .close {
  display: block;
  float: right;
  color: #000;
  font-size: 0.8rem;
  cursor: pointer;
  border: 0.015em solid black;
  padding: 2px;
  height: 14px;
  width: 12px;
  text-align: center;
  /* added by RRF April 23 for spacing issue*/
  margin-left: 5px;
  font-weight: 600;
  text-transform: uppercase;
  /*background-color:#E8E8E8;
  background-color:#fddb96; */
}

.register-box .close a {
  color: #464646;
}

/*
div.renderWithName div.required:after {
	content:"*";
	color:#5E2466;
	padding-left: 5px;
	font-weight:bolder;

 } */
/* RRF additions ends here */
/*
#page4-tabs.div ul li a {
	color: #1c94c4;
	cursor:pointer;
}

#page4-tabs.div ul li a:visited {
	color: #1c94c4;
	cursor:pointer;
}

#page4-tabs.div ul li a:hover {
	color: #eb8f00;
	cursor:pointer;
	background-color: #f9f2c7;
}

#page4-tabs.div ul li a:active, #page4-tabs.div ul li a:current  {
	color: #eb8f00;
	cursor:pointer;
}

*/
/* Standard HTML Form Controls */
input.textbox,
textarea.textbox {
  font-size: 11px;
  width: 200px;
  background-color: #cccccc;
  border: 1px solid #040404;
  padding: 2px 3px 2px 3px;
}

input.textbox {
  height: 28px;
  line-height: 28px;
}

textarea.textbox {
  height: 120px;
}

input.textbox:focus,
textarea.textbox:focus {
  background-color: #fff;
  border-color: #040404;
}

select.listbox {
  font-size: 12px;
  width: 208px;
  background-color: #cccccc;
  border: 1px solid #040404;
}

select.listbox:focus {
  background-color: #fff;
  border-color: #040404;
}

a.listboxReset {
  font-size: 8pt;
  text-decoration: none;
  color: #337;
  display: none;
}

a.listboxReset:hover {
  text-decoration: underline;
}

/**
 * Various QControl-specific Styles
 */
/* QFileAsset */
div.fileassetDbox {
  border: 4px solid #333;
  background-color: #fff;
  padding: 20px;
  width: 400px;
  overflow: auto;
}

div.fileassetDbox h1 {
  margin: 0;
}

div.fileassetDbox input {
  padding: 3px;
  margin-right: 5px;
}

/* QDialogBox */
div.dialogbox {
  border: 4px solid #333;
  background-color: #fff;
  padding: 20px;
  width: 400px;
  overflow: auto;
}

/* QDateTimePicker */
span.datetimepicker select {
  font-size: 12px;
  background-color: #cccccc;
  border: 1px solid #040404;
}

span.datetimepicker select:focus {
  background-color: #fff;
  border-color: #040404;
}

span.datetimepicker select.month {
  width: 55px;
}

span.datetimepicker select.day {
  width: 45px;
  margin-left: 8px;
}

span.datetimepicker select.year {
  width: 60px;
  margin-left: 8px;
}

span.datetimepicker select.hour {
  width: 65px;
  margin-left: 12px;
  margin-right: 2px;
}

span.datetimepicker select.minute {
  width: 45px;
  margin-left: 2px;
  margin-right: 2px;
}

span.datetimepicker select.second {
  width: 45px;
  margin-left: 2px;
}

/* QDataGrid */
table.datagrid {
  border: 1px solid #040404;
}

table.datagrid caption,
table.datagrid tfoot {
  padding-bottom: 4px;
  overflow: auto;
}

table.datagrid span.left {
  float: left;
  font-size: 10px;
  display: block;
}

table.datagrid span.right {
  float: right;
  font-size: 10px;
  display: block;
}

table.datagrid tr {
  background-color: #fff;
}

table.datagrid tr.alternate {
  background-color: #cccccc;
}

table.datagrid th {
  background-color: #040404;
  padding: 3px 5px 3px 5px;
  text-align: left;
  color: #f2f2f2;
}

table.datagrid th a {
  color: orange;
  text-decoration: none;
}

table.datagrid th a:hover {
  color: yellow;
}

table.datagrid td {
  padding: 5px;
}

table.datagrid td a {
  color: #0086b9;
  font-weight: bold;
}

table.datagrid td a:hover {
  color: #000;
}

table.datagrid tfoot {
  border-top: 1px solid #040404;
}

/* QPaginator */
span.paginator {
  margin: 0;
  padding: 0;
}

span.paginator span {
  list-style-type: none;
  display: inline;
  padding: 0;
  margin: 0;
}

span.paginator span.page a {
  text-decoration: none;
  color: #000000;
  padding: 0 3px 0 3px;
  margin: 0 2px 0 2px;
}

span.paginator span.page a:hover {
  background-color: #ccf;
}

span.paginator span.arrow {
  font-weight: bold;
  color: #ccc;
  margin: 0;
  padding: 0 3px 0 3px;
}

span.paginator span.arrow a {
  font-weight: bold;
  color: #000;
  text-decoration: none;
}

span.paginator span.selected {
  font-weight: bold;
  background-color: #ccf;
  padding: 0 3px 0 3px;
  margin: 0 2px 0 2px;
  border: 1px;
  border-style: solid;
}

span.paginator span.break {
  color: #666;
  margin: 0 5px 0 5px;
}

span.paginator span.ellipsis {
  color: #666;
}

/* QCalendar */
div.calendar {
  width: 200px;
  border: 1px solid #337;
  background-color: #ccf;
}

div.calendar div.navigator {
  background-color: #337;
  overflow: auto;
  _height: 100%;
  color: #fff;
  padding: 2px 6px 2px 6px;
}

div.calendar div.navigator div.left {
  float: left;
}

div.calendar div.navigator div.month {
  float: left;
  width: 80px;
  text-align: center;
  font-weight: bold;
  font-size: 11px;
}

div.calendar div.navigator div.year {
  float: right;
}

div.calendar div.navigator div.year span {
  font-size: 11px;
  font-weight: bold;
  margin-left: 6px;
  margin-right: 6px;
}

div.calendar div.navigator a {
  color: #fff;
  text-decoration: none;
}

div.calendar div.navigator a:hover {
  text-decoration: underline;
}

div.calendar table {
  border: 0;
  margin-left: auto;
  margin-right: auto;
}

div.calendar th {
  text-align: center;
  border: 0;
  padding: 4px 2px 4px 2px;
  font-weight: bold;
  font-size: 10px;
}

div.calendar td {
  text-align: center;
  border-width: 0 0 1px 0;
  border-style: solid;
  border-color: black;
  padding: 0;
}

div.calendar td.lastRow {
  border-width: 0;
}

div.calendar td a {
  text-decoration: none;
  color: #000;
  display: block;
  padding: 2px 6px 2px 6px;
}

div.calendar td.today {
  background-color: #bbd;
}

div.calendar td.nonMonth a {
  color: #040404;
}

div.calendar td.selected {
  background-color: #c9a;
  font-weight: bold;
}

div.calendar td a:hover {
  background-color: #cccccc;
  color: #000;
}

div.calendar div.options {
  text-align: center;
  background-color: #337;
}

div.calendar div.options a {
  color: #fff;
  font-size: 10px;
  text-decoration: none;
}

div.calendar div.options a:hover {
  text-decoration: underline;
}

/**
 * Styles for Custom Render Functions as defined in QControl.class.php
 */
div.renderWithName {
  padding: 4px 0 4px 0;
  overflow: auto;
  height: 100%;
}

div.renderWithName div.left {
  float: left;
  width: auto;
}

div.renderWithName div.required {
  font-weight: bold;
}

div.renderWithName div.left span.instructions {
  font-size: 10px;
  color: #999;
  font-style: italic;
  text-transform: none;
}

div.renderWithName div.right span.error {
  margin-left: 15px;
  font-size: 10px;
  color: #ff0000;
  font-weight: bold;
}

/**
 * Form and Dashboard Draft-Specific Styles
 * NOTE: because these are page specific, we use element IDs instead of element classes for most items here
 * (e.g. we will never have more than one titleBar per page)
 */
div#titleBar {
  border: 0px solid #337;
  margin-bottom: 18px;
}

div#titleBar h2 {
  background-color: #343434;
  font-size: 12px;
  font-style: italic;
  font-weight: bold;
  color: #fff;
  margin: 0;
  padding: 2px 5px 2px 5px;
  float: none;
}

div#titleBar h2#right {
  float: right;
  font-size: 10px;
  font-style: normal;
  font-weight: normal;
}

div#titleBar h2#right a {
  color: #fff;
  text-decoration: none;
}

div#titleBar h2#right a:hover {
  text-decoration: underline;
}

div#titleBar h1 {
  font-size: 28px;
  background-color: #343434;
  color: #fff;
  margin: 0;
  padding: 2px 0 2px 5px;
}

p.create a {
  text-decoration: none;
  color: #343434;
  font-weight: bold;
}

p.create a:hover {
  text-decoration: underline;
}

div#draftList h1 {
  margin: 0;
  font-size: 20px;
  font-weight: bold;
}

div#draftList p {
  margin-top: 6px;
  margin-bottom: 18px;
}

div#formControls {
  padding: 0 0 0 20px;
}

div#formControls fieldset {
  border: 2px solid #cccccc;
  margin-bottom: 10px;
}

div#formControls legend {
  border: 2px solid #cccccc;
  font-weight: bold;
  padding: 2px 4px;
}

div#formActions {
  padding: 10px;
  height: 20px;
  margin-top: 18px;
}

div#formActions div#save {
  float: left;
}

div#formActions div#cancel {
  margin-left: 10px;
  float: left;
}

div#formActions div#delete {
  float: right;
}

div#dashboard div#left {
  float: left;
  width: 200px;
  height: 100px;
  font-size: 10px;
  background-color: #cccccc;
  border: 1px solid #000;
  padding: 5px;
}

div#dashboard div#right {
  float: left;
  margin-left: 10px;
  width: 760px;
}

div#dashboard div#right div#pnlList {
  margin-bottom: 10px;
  border: 1px solid #000;
  padding: 5px;
  height: 300px;
  overflow: auto;
}

div#dashboard div#right div#pnlEdit {
  border: 1px solid #000;
  padding: 5px;
  background-color: #cccccc;
  height: 240px;
  overflow: auto;
}

#pnlFilter {
  margin-bottom: 15px;
  background-color: #f3efc8;
  padding: 10px;
  border-top: 5px solid #d2ca76;
  border-bottom: 5px solid #d2ca76;
}

#pnlMessage {
  color: #ff0000;
  font-size: 16px;
  background-color: #f5f5f5;
  border: 3px solid #4d82b7;
  padding: 10px;
  margin: 10px 0;
}

*,
*::after,
*::before {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

/*!
 * Bootstrap Grid v5.1.3 (https://getbootstrap.com/)
 * Copyright 2011-2021 The Bootstrap Authors
 * Copyright 2011-2021 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 */
:root {
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-primary-rgb: 13, 110, 253;
  --bs-secondary-rgb: 108, 117, 125;
  --bs-success-rgb: 25, 135, 84;
  --bs-info-rgb: 13, 202, 240;
  --bs-warning-rgb: 255, 193, 7;
  --bs-danger-rgb: 220, 53, 69;
  --bs-light-rgb: 248, 249, 250;
  --bs-dark-rgb: 33, 37, 41;
  --bs-white-rgb: 255, 255, 255;
  --bs-black-rgb: 0, 0, 0;
  --bs-body-color-rgb: 33, 37, 41;
  --bs-body-bg-rgb: 255, 255, 255;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
  --bs-body-font-family: var(--bs-font-sans-serif);
  --bs-body-font-size: 1rem;
  --bs-body-font-weight: 400;
  --bs-body-line-height: 1.5;
  --bs-body-color: #212529;
  --bs-body-bg: #fff;
}

.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
  width: 100%;
  padding-right: var(--bs-gutter-x, 0.75rem);
  padding-left: var(--bs-gutter-x, 0.75rem);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container-sm, .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container-md, .container-sm, .container {
    max-width: 720px;
  }
}
@media (min-width: 992px) {
  .container-lg, .container-md, .container-sm, .container {
    max-width: 960px;
  }
}
@media (min-width: 1200px) {
  .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1140px;
  }
}
@media (min-width: 1400px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1320px;
  }
}
.row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(-1 * var(--bs-gutter-y));
  margin-right: calc(-0.5 * var(--bs-gutter-x));
  margin-left: calc(-0.5 * var(--bs-gutter-x));
}
.row > * {
  box-sizing: border-box;
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: calc(var(--bs-gutter-x) * 0.5);
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  margin-top: var(--bs-gutter-y);
}

.col {
  flex: 1 0 0%;
}

.row-cols-auto > * {
  flex: 0 0 auto;
  width: auto;
}

.row-cols-1 > * {
  flex: 0 0 auto;
  width: 100%;
}

.row-cols-2 > * {
  flex: 0 0 auto;
  width: 50%;
}

.row-cols-3 > * {
  flex: 0 0 auto;
  width: 33.3333333333%;
}

.row-cols-4 > * {
  flex: 0 0 auto;
  width: 25%;
}

.row-cols-5 > * {
  flex: 0 0 auto;
  width: 20%;
}

.row-cols-6 > * {
  flex: 0 0 auto;
  width: 16.6666666667%;
}

.col-auto {
  flex: 0 0 auto;
  width: auto;
}

.col-1 {
  flex: 0 0 auto;
  width: 8.33333333%;
}

.col-2 {
  flex: 0 0 auto;
  width: 16.66666667%;
}

.col-3 {
  flex: 0 0 auto;
  width: 25%;
}

.col-4 {
  flex: 0 0 auto;
  width: 33.33333333%;
}

.col-5 {
  flex: 0 0 auto;
  width: 41.66666667%;
}

.col-6 {
  flex: 0 0 auto;
  width: 50%;
}

.col-7 {
  flex: 0 0 auto;
  width: 58.33333333%;
}

.col-8 {
  flex: 0 0 auto;
  width: 66.66666667%;
}

.col-9 {
  flex: 0 0 auto;
  width: 75%;
}

.col-10 {
  flex: 0 0 auto;
  width: 83.33333333%;
}

.col-11 {
  flex: 0 0 auto;
  width: 91.66666667%;
}

.col-12 {
  flex: 0 0 auto;
  width: 100%;
}

.offset-1 {
  margin-left: 8.33333333%;
}

.offset-2 {
  margin-left: 16.66666667%;
}

.offset-3 {
  margin-left: 25%;
}

.offset-4 {
  margin-left: 33.33333333%;
}

.offset-5 {
  margin-left: 41.66666667%;
}

.offset-6 {
  margin-left: 50%;
}

.offset-7 {
  margin-left: 58.33333333%;
}

.offset-8 {
  margin-left: 66.66666667%;
}

.offset-9 {
  margin-left: 75%;
}

.offset-10 {
  margin-left: 83.33333333%;
}

.offset-11 {
  margin-left: 91.66666667%;
}

.g-0,
.gx-0 {
  --bs-gutter-x: 0;
}

.g-0,
.gy-0 {
  --bs-gutter-y: 0;
}

.g-1,
.gx-1 {
  --bs-gutter-x: 0.25rem;
}

.g-1,
.gy-1 {
  --bs-gutter-y: 0.25rem;
}

.g-2,
.gx-2 {
  --bs-gutter-x: 0.5rem;
}

.g-2,
.gy-2 {
  --bs-gutter-y: 0.5rem;
}

.g-3,
.gx-3 {
  --bs-gutter-x: 1rem;
}

.g-3,
.gy-3 {
  --bs-gutter-y: 1rem;
}

.g-4,
.gx-4 {
  --bs-gutter-x: 1.5rem;
}

.g-4,
.gy-4 {
  --bs-gutter-y: 1.5rem;
}

.g-5,
.gx-5 {
  --bs-gutter-x: 3rem;
}

.g-5,
.gy-5 {
  --bs-gutter-y: 3rem;
}

@media (min-width: 576px) {
  .col-sm {
    flex: 1 0 0%;
  }

  .row-cols-sm-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-sm-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-sm-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-sm-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-sm-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-sm-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-sm-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-sm-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-sm-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-sm-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-sm-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-sm-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-sm-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-sm-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-sm-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-sm-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-sm-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-sm-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-sm-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-sm-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-sm-0 {
    margin-left: 0;
  }

  .offset-sm-1 {
    margin-left: 8.33333333%;
  }

  .offset-sm-2 {
    margin-left: 16.66666667%;
  }

  .offset-sm-3 {
    margin-left: 25%;
  }

  .offset-sm-4 {
    margin-left: 33.33333333%;
  }

  .offset-sm-5 {
    margin-left: 41.66666667%;
  }

  .offset-sm-6 {
    margin-left: 50%;
  }

  .offset-sm-7 {
    margin-left: 58.33333333%;
  }

  .offset-sm-8 {
    margin-left: 66.66666667%;
  }

  .offset-sm-9 {
    margin-left: 75%;
  }

  .offset-sm-10 {
    margin-left: 83.33333333%;
  }

  .offset-sm-11 {
    margin-left: 91.66666667%;
  }

  .g-sm-0,
.gx-sm-0 {
    --bs-gutter-x: 0;
  }

  .g-sm-0,
.gy-sm-0 {
    --bs-gutter-y: 0;
  }

  .g-sm-1,
.gx-sm-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-sm-1,
.gy-sm-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-sm-2,
.gx-sm-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-sm-2,
.gy-sm-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-sm-3,
.gx-sm-3 {
    --bs-gutter-x: 1rem;
  }

  .g-sm-3,
.gy-sm-3 {
    --bs-gutter-y: 1rem;
  }

  .g-sm-4,
.gx-sm-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-sm-4,
.gy-sm-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-sm-5,
.gx-sm-5 {
    --bs-gutter-x: 3rem;
  }

  .g-sm-5,
.gy-sm-5 {
    --bs-gutter-y: 3rem;
  }
}
@media (min-width: 768px) {
  .col-md {
    flex: 1 0 0%;
  }

  .row-cols-md-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-md-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-md-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-md-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-md-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-md-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-md-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-md-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-md-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-md-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-md-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-md-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-md-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-md-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-md-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-md-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-md-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-md-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-md-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-md-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-md-0 {
    margin-left: 0;
  }

  .offset-md-1 {
    margin-left: 8.33333333%;
  }

  .offset-md-2 {
    margin-left: 16.66666667%;
  }

  .offset-md-3 {
    margin-left: 25%;
  }

  .offset-md-4 {
    margin-left: 33.33333333%;
  }

  .offset-md-5 {
    margin-left: 41.66666667%;
  }

  .offset-md-6 {
    margin-left: 50%;
  }

  .offset-md-7 {
    margin-left: 58.33333333%;
  }

  .offset-md-8 {
    margin-left: 66.66666667%;
  }

  .offset-md-9 {
    margin-left: 75%;
  }

  .offset-md-10 {
    margin-left: 83.33333333%;
  }

  .offset-md-11 {
    margin-left: 91.66666667%;
  }

  .g-md-0,
.gx-md-0 {
    --bs-gutter-x: 0;
  }

  .g-md-0,
.gy-md-0 {
    --bs-gutter-y: 0;
  }

  .g-md-1,
.gx-md-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-md-1,
.gy-md-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-md-2,
.gx-md-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-md-2,
.gy-md-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-md-3,
.gx-md-3 {
    --bs-gutter-x: 1rem;
  }

  .g-md-3,
.gy-md-3 {
    --bs-gutter-y: 1rem;
  }

  .g-md-4,
.gx-md-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-md-4,
.gy-md-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-md-5,
.gx-md-5 {
    --bs-gutter-x: 3rem;
  }

  .g-md-5,
.gy-md-5 {
    --bs-gutter-y: 3rem;
  }
}
@media (min-width: 992px) {
  .col-lg {
    flex: 1 0 0%;
  }

  .row-cols-lg-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-lg-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-lg-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-lg-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-lg-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-lg-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-lg-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-lg-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-lg-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-lg-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-lg-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-lg-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-lg-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-lg-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-lg-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-lg-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-lg-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-lg-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-lg-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-lg-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-lg-0 {
    margin-left: 0;
  }

  .offset-lg-1 {
    margin-left: 8.33333333%;
  }

  .offset-lg-2 {
    margin-left: 16.66666667%;
  }

  .offset-lg-3 {
    margin-left: 25%;
  }

  .offset-lg-4 {
    margin-left: 33.33333333%;
  }

  .offset-lg-5 {
    margin-left: 41.66666667%;
  }

  .offset-lg-6 {
    margin-left: 50%;
  }

  .offset-lg-7 {
    margin-left: 58.33333333%;
  }

  .offset-lg-8 {
    margin-left: 66.66666667%;
  }

  .offset-lg-9 {
    margin-left: 75%;
  }

  .offset-lg-10 {
    margin-left: 83.33333333%;
  }

  .offset-lg-11 {
    margin-left: 91.66666667%;
  }

  .g-lg-0,
.gx-lg-0 {
    --bs-gutter-x: 0;
  }

  .g-lg-0,
.gy-lg-0 {
    --bs-gutter-y: 0;
  }

  .g-lg-1,
.gx-lg-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-lg-1,
.gy-lg-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-lg-2,
.gx-lg-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-lg-2,
.gy-lg-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-lg-3,
.gx-lg-3 {
    --bs-gutter-x: 1rem;
  }

  .g-lg-3,
.gy-lg-3 {
    --bs-gutter-y: 1rem;
  }

  .g-lg-4,
.gx-lg-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-lg-4,
.gy-lg-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-lg-5,
.gx-lg-5 {
    --bs-gutter-x: 3rem;
  }

  .g-lg-5,
.gy-lg-5 {
    --bs-gutter-y: 3rem;
  }
}
@media (min-width: 1200px) {
  .col-xl {
    flex: 1 0 0%;
  }

  .row-cols-xl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-xl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-xl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-xl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-xl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-xl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-xl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-xl-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-xl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-xl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-xl-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-xl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-xl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-xl-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-xl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-xl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-xl-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-xl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-xl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-xl-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-xl-0 {
    margin-left: 0;
  }

  .offset-xl-1 {
    margin-left: 8.33333333%;
  }

  .offset-xl-2 {
    margin-left: 16.66666667%;
  }

  .offset-xl-3 {
    margin-left: 25%;
  }

  .offset-xl-4 {
    margin-left: 33.33333333%;
  }

  .offset-xl-5 {
    margin-left: 41.66666667%;
  }

  .offset-xl-6 {
    margin-left: 50%;
  }

  .offset-xl-7 {
    margin-left: 58.33333333%;
  }

  .offset-xl-8 {
    margin-left: 66.66666667%;
  }

  .offset-xl-9 {
    margin-left: 75%;
  }

  .offset-xl-10 {
    margin-left: 83.33333333%;
  }

  .offset-xl-11 {
    margin-left: 91.66666667%;
  }

  .g-xl-0,
.gx-xl-0 {
    --bs-gutter-x: 0;
  }

  .g-xl-0,
.gy-xl-0 {
    --bs-gutter-y: 0;
  }

  .g-xl-1,
.gx-xl-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-xl-1,
.gy-xl-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-xl-2,
.gx-xl-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-xl-2,
.gy-xl-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-xl-3,
.gx-xl-3 {
    --bs-gutter-x: 1rem;
  }

  .g-xl-3,
.gy-xl-3 {
    --bs-gutter-y: 1rem;
  }

  .g-xl-4,
.gx-xl-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-xl-4,
.gy-xl-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-xl-5,
.gx-xl-5 {
    --bs-gutter-x: 3rem;
  }

  .g-xl-5,
.gy-xl-5 {
    --bs-gutter-y: 3rem;
  }
}
@media (min-width: 1400px) {
  .col-xxl {
    flex: 1 0 0%;
  }

  .row-cols-xxl-auto > * {
    flex: 0 0 auto;
    width: auto;
  }

  .row-cols-xxl-1 > * {
    flex: 0 0 auto;
    width: 100%;
  }

  .row-cols-xxl-2 > * {
    flex: 0 0 auto;
    width: 50%;
  }

  .row-cols-xxl-3 > * {
    flex: 0 0 auto;
    width: 33.3333333333%;
  }

  .row-cols-xxl-4 > * {
    flex: 0 0 auto;
    width: 25%;
  }

  .row-cols-xxl-5 > * {
    flex: 0 0 auto;
    width: 20%;
  }

  .row-cols-xxl-6 > * {
    flex: 0 0 auto;
    width: 16.6666666667%;
  }

  .col-xxl-auto {
    flex: 0 0 auto;
    width: auto;
  }

  .col-xxl-1 {
    flex: 0 0 auto;
    width: 8.33333333%;
  }

  .col-xxl-2 {
    flex: 0 0 auto;
    width: 16.66666667%;
  }

  .col-xxl-3 {
    flex: 0 0 auto;
    width: 25%;
  }

  .col-xxl-4 {
    flex: 0 0 auto;
    width: 33.33333333%;
  }

  .col-xxl-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }

  .col-xxl-6 {
    flex: 0 0 auto;
    width: 50%;
  }

  .col-xxl-7 {
    flex: 0 0 auto;
    width: 58.33333333%;
  }

  .col-xxl-8 {
    flex: 0 0 auto;
    width: 66.66666667%;
  }

  .col-xxl-9 {
    flex: 0 0 auto;
    width: 75%;
  }

  .col-xxl-10 {
    flex: 0 0 auto;
    width: 83.33333333%;
  }

  .col-xxl-11 {
    flex: 0 0 auto;
    width: 91.66666667%;
  }

  .col-xxl-12 {
    flex: 0 0 auto;
    width: 100%;
  }

  .offset-xxl-0 {
    margin-left: 0;
  }

  .offset-xxl-1 {
    margin-left: 8.33333333%;
  }

  .offset-xxl-2 {
    margin-left: 16.66666667%;
  }

  .offset-xxl-3 {
    margin-left: 25%;
  }

  .offset-xxl-4 {
    margin-left: 33.33333333%;
  }

  .offset-xxl-5 {
    margin-left: 41.66666667%;
  }

  .offset-xxl-6 {
    margin-left: 50%;
  }

  .offset-xxl-7 {
    margin-left: 58.33333333%;
  }

  .offset-xxl-8 {
    margin-left: 66.66666667%;
  }

  .offset-xxl-9 {
    margin-left: 75%;
  }

  .offset-xxl-10 {
    margin-left: 83.33333333%;
  }

  .offset-xxl-11 {
    margin-left: 91.66666667%;
  }

  .g-xxl-0,
.gx-xxl-0 {
    --bs-gutter-x: 0;
  }

  .g-xxl-0,
.gy-xxl-0 {
    --bs-gutter-y: 0;
  }

  .g-xxl-1,
.gx-xxl-1 {
    --bs-gutter-x: 0.25rem;
  }

  .g-xxl-1,
.gy-xxl-1 {
    --bs-gutter-y: 0.25rem;
  }

  .g-xxl-2,
.gx-xxl-2 {
    --bs-gutter-x: 0.5rem;
  }

  .g-xxl-2,
.gy-xxl-2 {
    --bs-gutter-y: 0.5rem;
  }

  .g-xxl-3,
.gx-xxl-3 {
    --bs-gutter-x: 1rem;
  }

  .g-xxl-3,
.gy-xxl-3 {
    --bs-gutter-y: 1rem;
  }

  .g-xxl-4,
.gx-xxl-4 {
    --bs-gutter-x: 1.5rem;
  }

  .g-xxl-4,
.gy-xxl-4 {
    --bs-gutter-y: 1.5rem;
  }

  .g-xxl-5,
.gx-xxl-5 {
    --bs-gutter-x: 3rem;
  }

  .g-xxl-5,
.gy-xxl-5 {
    --bs-gutter-y: 3rem;
  }
}
.d-inline {
  display: inline !important;
}

.d-inline-block {
  display: inline-block !important;
}

.d-block {
  display: block !important;
}

.d-grid {
  display: grid !important;
}

.d-table {
  display: table !important;
}

.d-table-row {
  display: table-row !important;
}

.d-table-cell {
  display: table-cell !important;
}

.d-flex {
  display: flex !important;
}

.d-inline-flex {
  display: inline-flex !important;
}

.d-none {
  display: none !important;
}

.flex-fill {
  flex: 1 1 auto !important;
}

.flex-row {
  flex-direction: row !important;
}

.flex-column {
  flex-direction: column !important;
}

.flex-row-reverse {
  flex-direction: row-reverse !important;
}

.flex-column-reverse {
  flex-direction: column-reverse !important;
}

.flex-grow-0 {
  flex-grow: 0 !important;
}

.flex-grow-1 {
  flex-grow: 1 !important;
}

.flex-shrink-0 {
  flex-shrink: 0 !important;
}

.flex-shrink-1 {
  flex-shrink: 1 !important;
}

.flex-wrap {
  flex-wrap: wrap !important;
}

.flex-nowrap {
  flex-wrap: nowrap !important;
}

.flex-wrap-reverse {
  flex-wrap: wrap-reverse !important;
}

.justify-content-start {
  justify-content: flex-start !important;
}

.justify-content-end {
  justify-content: flex-end !important;
}

.justify-content-center {
  justify-content: center !important;
}

.justify-content-between {
  justify-content: space-between !important;
}

.justify-content-around {
  justify-content: space-around !important;
}

.justify-content-evenly {
  justify-content: space-evenly !important;
}

.align-items-start {
  align-items: flex-start !important;
}

.align-items-end {
  align-items: flex-end !important;
}

.align-items-center {
  align-items: center !important;
}

.align-items-baseline {
  align-items: baseline !important;
}

.align-items-stretch {
  align-items: stretch !important;
}

.align-content-start {
  align-content: flex-start !important;
}

.align-content-end {
  align-content: flex-end !important;
}

.align-content-center {
  align-content: center !important;
}

.align-content-between {
  align-content: space-between !important;
}

.align-content-around {
  align-content: space-around !important;
}

.align-content-stretch {
  align-content: stretch !important;
}

.align-self-auto {
  align-self: auto !important;
}

.align-self-start {
  align-self: flex-start !important;
}

.align-self-end {
  align-self: flex-end !important;
}

.align-self-center {
  align-self: center !important;
}

.align-self-baseline {
  align-self: baseline !important;
}

.align-self-stretch {
  align-self: stretch !important;
}

.order-first {
  order: -1 !important;
}

.order-0 {
  order: 0 !important;
}

.order-1 {
  order: 1 !important;
}

.order-2 {
  order: 2 !important;
}

.order-3 {
  order: 3 !important;
}

.order-4 {
  order: 4 !important;
}

.order-5 {
  order: 5 !important;
}

.order-last {
  order: 6 !important;
}

.m-0 {
  margin: 0 !important;
}

.m-1 {
  margin: 0.25rem !important;
}

.m-2 {
  margin: 0.5rem !important;
}

.m-3 {
  margin: 1rem !important;
}

.m-4 {
  margin: 1.5rem !important;
}

.m-5 {
  margin: 3rem !important;
}

.m-auto {
  margin: auto !important;
}

.mx-0 {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

.mx-1 {
  margin-right: 0.25rem !important;
  margin-left: 0.25rem !important;
}

.mx-2 {
  margin-right: 0.5rem !important;
  margin-left: 0.5rem !important;
}

.mx-3 {
  margin-right: 1rem !important;
  margin-left: 1rem !important;
}

.mx-4 {
  margin-right: 1.5rem !important;
  margin-left: 1.5rem !important;
}

.mx-5 {
  margin-right: 3rem !important;
  margin-left: 3rem !important;
}

.mx-auto {
  margin-right: auto !important;
  margin-left: auto !important;
}

.my-0 {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.my-1 {
  margin-top: 0.25rem !important;
  margin-bottom: 0.25rem !important;
}

.my-2 {
  margin-top: 0.5rem !important;
  margin-bottom: 0.5rem !important;
}

.my-3 {
  margin-top: 1rem !important;
  margin-bottom: 1rem !important;
}

.my-4 {
  margin-top: 1.5rem !important;
  margin-bottom: 1.5rem !important;
}

.my-5 {
  margin-top: 3rem !important;
  margin-bottom: 3rem !important;
}

.my-auto {
  margin-top: auto !important;
  margin-bottom: auto !important;
}

.mt-0 {
  margin-top: 0 !important;
}

.mt-1 {
  margin-top: 0.25rem !important;
}

.mt-2 {
  margin-top: 0.5rem !important;
}

.mt-3 {
  margin-top: 1rem !important;
}

.mt-4 {
  margin-top: 1.5rem !important;
}

.mt-5 {
  margin-top: 3rem !important;
}

.mt-auto {
  margin-top: auto !important;
}

.me-0 {
  margin-right: 0 !important;
}

.me-1 {
  margin-right: 0.25rem !important;
}

.me-2 {
  margin-right: 0.5rem !important;
}

.me-3 {
  margin-right: 1rem !important;
}

.me-4 {
  margin-right: 1.5rem !important;
}

.me-5 {
  margin-right: 3rem !important;
}

.me-auto {
  margin-right: auto !important;
}

.mb-0 {
  margin-bottom: 0 !important;
}

.mb-1 {
  margin-bottom: 0.25rem !important;
}

.mb-2 {
  margin-bottom: 0.5rem !important;
}

.mb-3 {
  margin-bottom: 1rem !important;
}

.mb-4 {
  margin-bottom: 1.5rem !important;
}

.mb-5 {
  margin-bottom: 3rem !important;
}

.mb-auto {
  margin-bottom: auto !important;
}

.ms-0 {
  margin-left: 0 !important;
}

.ms-1 {
  margin-left: 0.25rem !important;
}

.ms-2 {
  margin-left: 0.5rem !important;
}

.ms-3 {
  margin-left: 1rem !important;
}

.ms-4 {
  margin-left: 1.5rem !important;
}

.ms-5 {
  margin-left: 3rem !important;
}

.ms-auto {
  margin-left: auto !important;
}

.p-0 {
  padding: 0 !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

.px-0 {
  padding-right: 0 !important;
  padding-left: 0 !important;
}

.px-1 {
  padding-right: 0.25rem !important;
  padding-left: 0.25rem !important;
}

.px-2 {
  padding-right: 0.5rem !important;
  padding-left: 0.5rem !important;
}

.px-3 {
  padding-right: 1rem !important;
  padding-left: 1rem !important;
}

.px-4 {
  padding-right: 1.5rem !important;
  padding-left: 1.5rem !important;
}

.px-5 {
  padding-right: 3rem !important;
  padding-left: 3rem !important;
}

.py-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.py-1 {
  padding-top: 0.25rem !important;
  padding-bottom: 0.25rem !important;
}

.py-2 {
  padding-top: 0.5rem !important;
  padding-bottom: 0.5rem !important;
}

.py-3 {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}

.py-4 {
  padding-top: 1.5rem !important;
  padding-bottom: 1.5rem !important;
}

.py-5 {
  padding-top: 3rem !important;
  padding-bottom: 3rem !important;
}

.pt-0 {
  padding-top: 0 !important;
}

.pt-1 {
  padding-top: 0.25rem !important;
}

.pt-2 {
  padding-top: 0.5rem !important;
}

.pt-3 {
  padding-top: 1rem !important;
}

.pt-4 {
  padding-top: 1.5rem !important;
}

.pt-5 {
  padding-top: 3rem !important;
}

.pe-0 {
  padding-right: 0 !important;
}

.pe-1 {
  padding-right: 0.25rem !important;
}

.pe-2 {
  padding-right: 0.5rem !important;
}

.pe-3 {
  padding-right: 1rem !important;
}

.pe-4 {
  padding-right: 1.5rem !important;
}

.pe-5 {
  padding-right: 3rem !important;
}

.pb-0 {
  padding-bottom: 0 !important;
}

.pb-1 {
  padding-bottom: 0.25rem !important;
}

.pb-2 {
  padding-bottom: 0.5rem !important;
}

.pb-3 {
  padding-bottom: 1rem !important;
}

.pb-4 {
  padding-bottom: 1.5rem !important;
}

.pb-5 {
  padding-bottom: 3rem !important;
}

.ps-0 {
  padding-left: 0 !important;
}

.ps-1 {
  padding-left: 0.25rem !important;
}

.ps-2 {
  padding-left: 0.5rem !important;
}

.ps-3 {
  padding-left: 1rem !important;
}

.ps-4 {
  padding-left: 1.5rem !important;
}

.ps-5 {
  padding-left: 3rem !important;
}

@media (min-width: 576px) {
  .d-sm-inline {
    display: inline !important;
  }

  .d-sm-inline-block {
    display: inline-block !important;
  }

  .d-sm-block {
    display: block !important;
  }

  .d-sm-grid {
    display: grid !important;
  }

  .d-sm-table {
    display: table !important;
  }

  .d-sm-table-row {
    display: table-row !important;
  }

  .d-sm-table-cell {
    display: table-cell !important;
  }

  .d-sm-flex {
    display: flex !important;
  }

  .d-sm-inline-flex {
    display: inline-flex !important;
  }

  .d-sm-none {
    display: none !important;
  }

  .flex-sm-fill {
    flex: 1 1 auto !important;
  }

  .flex-sm-row {
    flex-direction: row !important;
  }

  .flex-sm-column {
    flex-direction: column !important;
  }

  .flex-sm-row-reverse {
    flex-direction: row-reverse !important;
  }

  .flex-sm-column-reverse {
    flex-direction: column-reverse !important;
  }

  .flex-sm-grow-0 {
    flex-grow: 0 !important;
  }

  .flex-sm-grow-1 {
    flex-grow: 1 !important;
  }

  .flex-sm-shrink-0 {
    flex-shrink: 0 !important;
  }

  .flex-sm-shrink-1 {
    flex-shrink: 1 !important;
  }

  .flex-sm-wrap {
    flex-wrap: wrap !important;
  }

  .flex-sm-nowrap {
    flex-wrap: nowrap !important;
  }

  .flex-sm-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }

  .justify-content-sm-start {
    justify-content: flex-start !important;
  }

  .justify-content-sm-end {
    justify-content: flex-end !important;
  }

  .justify-content-sm-center {
    justify-content: center !important;
  }

  .justify-content-sm-between {
    justify-content: space-between !important;
  }

  .justify-content-sm-around {
    justify-content: space-around !important;
  }

  .justify-content-sm-evenly {
    justify-content: space-evenly !important;
  }

  .align-items-sm-start {
    align-items: flex-start !important;
  }

  .align-items-sm-end {
    align-items: flex-end !important;
  }

  .align-items-sm-center {
    align-items: center !important;
  }

  .align-items-sm-baseline {
    align-items: baseline !important;
  }

  .align-items-sm-stretch {
    align-items: stretch !important;
  }

  .align-content-sm-start {
    align-content: flex-start !important;
  }

  .align-content-sm-end {
    align-content: flex-end !important;
  }

  .align-content-sm-center {
    align-content: center !important;
  }

  .align-content-sm-between {
    align-content: space-between !important;
  }

  .align-content-sm-around {
    align-content: space-around !important;
  }

  .align-content-sm-stretch {
    align-content: stretch !important;
  }

  .align-self-sm-auto {
    align-self: auto !important;
  }

  .align-self-sm-start {
    align-self: flex-start !important;
  }

  .align-self-sm-end {
    align-self: flex-end !important;
  }

  .align-self-sm-center {
    align-self: center !important;
  }

  .align-self-sm-baseline {
    align-self: baseline !important;
  }

  .align-self-sm-stretch {
    align-self: stretch !important;
  }

  .order-sm-first {
    order: -1 !important;
  }

  .order-sm-0 {
    order: 0 !important;
  }

  .order-sm-1 {
    order: 1 !important;
  }

  .order-sm-2 {
    order: 2 !important;
  }

  .order-sm-3 {
    order: 3 !important;
  }

  .order-sm-4 {
    order: 4 !important;
  }

  .order-sm-5 {
    order: 5 !important;
  }

  .order-sm-last {
    order: 6 !important;
  }

  .m-sm-0 {
    margin: 0 !important;
  }

  .m-sm-1 {
    margin: 0.25rem !important;
  }

  .m-sm-2 {
    margin: 0.5rem !important;
  }

  .m-sm-3 {
    margin: 1rem !important;
  }

  .m-sm-4 {
    margin: 1.5rem !important;
  }

  .m-sm-5 {
    margin: 3rem !important;
  }

  .m-sm-auto {
    margin: auto !important;
  }

  .mx-sm-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .mx-sm-1 {
    margin-right: 0.25rem !important;
    margin-left: 0.25rem !important;
  }

  .mx-sm-2 {
    margin-right: 0.5rem !important;
    margin-left: 0.5rem !important;
  }

  .mx-sm-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important;
  }

  .mx-sm-4 {
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important;
  }

  .mx-sm-5 {
    margin-right: 3rem !important;
    margin-left: 3rem !important;
  }

  .mx-sm-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .my-sm-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .my-sm-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }

  .my-sm-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  .my-sm-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }

  .my-sm-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }

  .my-sm-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }

  .my-sm-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }

  .mt-sm-0 {
    margin-top: 0 !important;
  }

  .mt-sm-1 {
    margin-top: 0.25rem !important;
  }

  .mt-sm-2 {
    margin-top: 0.5rem !important;
  }

  .mt-sm-3 {
    margin-top: 1rem !important;
  }

  .mt-sm-4 {
    margin-top: 1.5rem !important;
  }

  .mt-sm-5 {
    margin-top: 3rem !important;
  }

  .mt-sm-auto {
    margin-top: auto !important;
  }

  .me-sm-0 {
    margin-right: 0 !important;
  }

  .me-sm-1 {
    margin-right: 0.25rem !important;
  }

  .me-sm-2 {
    margin-right: 0.5rem !important;
  }

  .me-sm-3 {
    margin-right: 1rem !important;
  }

  .me-sm-4 {
    margin-right: 1.5rem !important;
  }

  .me-sm-5 {
    margin-right: 3rem !important;
  }

  .me-sm-auto {
    margin-right: auto !important;
  }

  .mb-sm-0 {
    margin-bottom: 0 !important;
  }

  .mb-sm-1 {
    margin-bottom: 0.25rem !important;
  }

  .mb-sm-2 {
    margin-bottom: 0.5rem !important;
  }

  .mb-sm-3 {
    margin-bottom: 1rem !important;
  }

  .mb-sm-4 {
    margin-bottom: 1.5rem !important;
  }

  .mb-sm-5 {
    margin-bottom: 3rem !important;
  }

  .mb-sm-auto {
    margin-bottom: auto !important;
  }

  .ms-sm-0 {
    margin-left: 0 !important;
  }

  .ms-sm-1 {
    margin-left: 0.25rem !important;
  }

  .ms-sm-2 {
    margin-left: 0.5rem !important;
  }

  .ms-sm-3 {
    margin-left: 1rem !important;
  }

  .ms-sm-4 {
    margin-left: 1.5rem !important;
  }

  .ms-sm-5 {
    margin-left: 3rem !important;
  }

  .ms-sm-auto {
    margin-left: auto !important;
  }

  .p-sm-0 {
    padding: 0 !important;
  }

  .p-sm-1 {
    padding: 0.25rem !important;
  }

  .p-sm-2 {
    padding: 0.5rem !important;
  }

  .p-sm-3 {
    padding: 1rem !important;
  }

  .p-sm-4 {
    padding: 1.5rem !important;
  }

  .p-sm-5 {
    padding: 3rem !important;
  }

  .px-sm-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .px-sm-1 {
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
  }

  .px-sm-2 {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
  }

  .px-sm-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
  }

  .px-sm-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
  }

  .px-sm-5 {
    padding-right: 3rem !important;
    padding-left: 3rem !important;
  }

  .py-sm-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .py-sm-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  .py-sm-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  .py-sm-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }

  .py-sm-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }

  .py-sm-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }

  .pt-sm-0 {
    padding-top: 0 !important;
  }

  .pt-sm-1 {
    padding-top: 0.25rem !important;
  }

  .pt-sm-2 {
    padding-top: 0.5rem !important;
  }

  .pt-sm-3 {
    padding-top: 1rem !important;
  }

  .pt-sm-4 {
    padding-top: 1.5rem !important;
  }

  .pt-sm-5 {
    padding-top: 3rem !important;
  }

  .pe-sm-0 {
    padding-right: 0 !important;
  }

  .pe-sm-1 {
    padding-right: 0.25rem !important;
  }

  .pe-sm-2 {
    padding-right: 0.5rem !important;
  }

  .pe-sm-3 {
    padding-right: 1rem !important;
  }

  .pe-sm-4 {
    padding-right: 1.5rem !important;
  }

  .pe-sm-5 {
    padding-right: 3rem !important;
  }

  .pb-sm-0 {
    padding-bottom: 0 !important;
  }

  .pb-sm-1 {
    padding-bottom: 0.25rem !important;
  }

  .pb-sm-2 {
    padding-bottom: 0.5rem !important;
  }

  .pb-sm-3 {
    padding-bottom: 1rem !important;
  }

  .pb-sm-4 {
    padding-bottom: 1.5rem !important;
  }

  .pb-sm-5 {
    padding-bottom: 3rem !important;
  }

  .ps-sm-0 {
    padding-left: 0 !important;
  }

  .ps-sm-1 {
    padding-left: 0.25rem !important;
  }

  .ps-sm-2 {
    padding-left: 0.5rem !important;
  }

  .ps-sm-3 {
    padding-left: 1rem !important;
  }

  .ps-sm-4 {
    padding-left: 1.5rem !important;
  }

  .ps-sm-5 {
    padding-left: 3rem !important;
  }
}
@media (min-width: 768px) {
  .d-md-inline {
    display: inline !important;
  }

  .d-md-inline-block {
    display: inline-block !important;
  }

  .d-md-block {
    display: block !important;
  }

  .d-md-grid {
    display: grid !important;
  }

  .d-md-table {
    display: table !important;
  }

  .d-md-table-row {
    display: table-row !important;
  }

  .d-md-table-cell {
    display: table-cell !important;
  }

  .d-md-flex {
    display: flex !important;
  }

  .d-md-inline-flex {
    display: inline-flex !important;
  }

  .d-md-none {
    display: none !important;
  }

  .flex-md-fill {
    flex: 1 1 auto !important;
  }

  .flex-md-row {
    flex-direction: row !important;
  }

  .flex-md-column {
    flex-direction: column !important;
  }

  .flex-md-row-reverse {
    flex-direction: row-reverse !important;
  }

  .flex-md-column-reverse {
    flex-direction: column-reverse !important;
  }

  .flex-md-grow-0 {
    flex-grow: 0 !important;
  }

  .flex-md-grow-1 {
    flex-grow: 1 !important;
  }

  .flex-md-shrink-0 {
    flex-shrink: 0 !important;
  }

  .flex-md-shrink-1 {
    flex-shrink: 1 !important;
  }

  .flex-md-wrap {
    flex-wrap: wrap !important;
  }

  .flex-md-nowrap {
    flex-wrap: nowrap !important;
  }

  .flex-md-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }

  .justify-content-md-start {
    justify-content: flex-start !important;
  }

  .justify-content-md-end {
    justify-content: flex-end !important;
  }

  .justify-content-md-center {
    justify-content: center !important;
  }

  .justify-content-md-between {
    justify-content: space-between !important;
  }

  .justify-content-md-around {
    justify-content: space-around !important;
  }

  .justify-content-md-evenly {
    justify-content: space-evenly !important;
  }

  .align-items-md-start {
    align-items: flex-start !important;
  }

  .align-items-md-end {
    align-items: flex-end !important;
  }

  .align-items-md-center {
    align-items: center !important;
  }

  .align-items-md-baseline {
    align-items: baseline !important;
  }

  .align-items-md-stretch {
    align-items: stretch !important;
  }

  .align-content-md-start {
    align-content: flex-start !important;
  }

  .align-content-md-end {
    align-content: flex-end !important;
  }

  .align-content-md-center {
    align-content: center !important;
  }

  .align-content-md-between {
    align-content: space-between !important;
  }

  .align-content-md-around {
    align-content: space-around !important;
  }

  .align-content-md-stretch {
    align-content: stretch !important;
  }

  .align-self-md-auto {
    align-self: auto !important;
  }

  .align-self-md-start {
    align-self: flex-start !important;
  }

  .align-self-md-end {
    align-self: flex-end !important;
  }

  .align-self-md-center {
    align-self: center !important;
  }

  .align-self-md-baseline {
    align-self: baseline !important;
  }

  .align-self-md-stretch {
    align-self: stretch !important;
  }

  .order-md-first {
    order: -1 !important;
  }

  .order-md-0 {
    order: 0 !important;
  }

  .order-md-1 {
    order: 1 !important;
  }

  .order-md-2 {
    order: 2 !important;
  }

  .order-md-3 {
    order: 3 !important;
  }

  .order-md-4 {
    order: 4 !important;
  }

  .order-md-5 {
    order: 5 !important;
  }

  .order-md-last {
    order: 6 !important;
  }

  .m-md-0 {
    margin: 0 !important;
  }

  .m-md-1 {
    margin: 0.25rem !important;
  }

  .m-md-2 {
    margin: 0.5rem !important;
  }

  .m-md-3 {
    margin: 1rem !important;
  }

  .m-md-4 {
    margin: 1.5rem !important;
  }

  .m-md-5 {
    margin: 3rem !important;
  }

  .m-md-auto {
    margin: auto !important;
  }

  .mx-md-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .mx-md-1 {
    margin-right: 0.25rem !important;
    margin-left: 0.25rem !important;
  }

  .mx-md-2 {
    margin-right: 0.5rem !important;
    margin-left: 0.5rem !important;
  }

  .mx-md-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important;
  }

  .mx-md-4 {
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important;
  }

  .mx-md-5 {
    margin-right: 3rem !important;
    margin-left: 3rem !important;
  }

  .mx-md-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .my-md-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .my-md-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }

  .my-md-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  .my-md-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }

  .my-md-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }

  .my-md-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }

  .my-md-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }

  .mt-md-0 {
    margin-top: 0 !important;
  }

  .mt-md-1 {
    margin-top: 0.25rem !important;
  }

  .mt-md-2 {
    margin-top: 0.5rem !important;
  }

  .mt-md-3 {
    margin-top: 1rem !important;
  }

  .mt-md-4 {
    margin-top: 1.5rem !important;
  }

  .mt-md-5 {
    margin-top: 3rem !important;
  }

  .mt-md-auto {
    margin-top: auto !important;
  }

  .me-md-0 {
    margin-right: 0 !important;
  }

  .me-md-1 {
    margin-right: 0.25rem !important;
  }

  .me-md-2 {
    margin-right: 0.5rem !important;
  }

  .me-md-3 {
    margin-right: 1rem !important;
  }

  .me-md-4 {
    margin-right: 1.5rem !important;
  }

  .me-md-5 {
    margin-right: 3rem !important;
  }

  .me-md-auto {
    margin-right: auto !important;
  }

  .mb-md-0 {
    margin-bottom: 0 !important;
  }

  .mb-md-1 {
    margin-bottom: 0.25rem !important;
  }

  .mb-md-2 {
    margin-bottom: 0.5rem !important;
  }

  .mb-md-3 {
    margin-bottom: 1rem !important;
  }

  .mb-md-4 {
    margin-bottom: 1.5rem !important;
  }

  .mb-md-5 {
    margin-bottom: 3rem !important;
  }

  .mb-md-auto {
    margin-bottom: auto !important;
  }

  .ms-md-0 {
    margin-left: 0 !important;
  }

  .ms-md-1 {
    margin-left: 0.25rem !important;
  }

  .ms-md-2 {
    margin-left: 0.5rem !important;
  }

  .ms-md-3 {
    margin-left: 1rem !important;
  }

  .ms-md-4 {
    margin-left: 1.5rem !important;
  }

  .ms-md-5 {
    margin-left: 3rem !important;
  }

  .ms-md-auto {
    margin-left: auto !important;
  }

  .p-md-0 {
    padding: 0 !important;
  }

  .p-md-1 {
    padding: 0.25rem !important;
  }

  .p-md-2 {
    padding: 0.5rem !important;
  }

  .p-md-3 {
    padding: 1rem !important;
  }

  .p-md-4 {
    padding: 1.5rem !important;
  }

  .p-md-5 {
    padding: 3rem !important;
  }

  .px-md-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .px-md-1 {
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
  }

  .px-md-2 {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
  }

  .px-md-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
  }

  .px-md-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
  }

  .px-md-5 {
    padding-right: 3rem !important;
    padding-left: 3rem !important;
  }

  .py-md-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .py-md-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  .py-md-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  .py-md-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }

  .py-md-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }

  .py-md-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }

  .pt-md-0 {
    padding-top: 0 !important;
  }

  .pt-md-1 {
    padding-top: 0.25rem !important;
  }

  .pt-md-2 {
    padding-top: 0.5rem !important;
  }

  .pt-md-3 {
    padding-top: 1rem !important;
  }

  .pt-md-4 {
    padding-top: 1.5rem !important;
  }

  .pt-md-5 {
    padding-top: 3rem !important;
  }

  .pe-md-0 {
    padding-right: 0 !important;
  }

  .pe-md-1 {
    padding-right: 0.25rem !important;
  }

  .pe-md-2 {
    padding-right: 0.5rem !important;
  }

  .pe-md-3 {
    padding-right: 1rem !important;
  }

  .pe-md-4 {
    padding-right: 1.5rem !important;
  }

  .pe-md-5 {
    padding-right: 3rem !important;
  }

  .pb-md-0 {
    padding-bottom: 0 !important;
  }

  .pb-md-1 {
    padding-bottom: 0.25rem !important;
  }

  .pb-md-2 {
    padding-bottom: 0.5rem !important;
  }

  .pb-md-3 {
    padding-bottom: 1rem !important;
  }

  .pb-md-4 {
    padding-bottom: 1.5rem !important;
  }

  .pb-md-5 {
    padding-bottom: 3rem !important;
  }

  .ps-md-0 {
    padding-left: 0 !important;
  }

  .ps-md-1 {
    padding-left: 0.25rem !important;
  }

  .ps-md-2 {
    padding-left: 0.5rem !important;
  }

  .ps-md-3 {
    padding-left: 1rem !important;
  }

  .ps-md-4 {
    padding-left: 1.5rem !important;
  }

  .ps-md-5 {
    padding-left: 3rem !important;
  }
}
@media (min-width: 992px) {
  .d-lg-inline {
    display: inline !important;
  }

  .d-lg-inline-block {
    display: inline-block !important;
  }

  .d-lg-block {
    display: block !important;
  }

  .d-lg-grid {
    display: grid !important;
  }

  .d-lg-table {
    display: table !important;
  }

  .d-lg-table-row {
    display: table-row !important;
  }

  .d-lg-table-cell {
    display: table-cell !important;
  }

  .d-lg-flex {
    display: flex !important;
  }

  .d-lg-inline-flex {
    display: inline-flex !important;
  }

  .d-lg-none {
    display: none !important;
  }

  .flex-lg-fill {
    flex: 1 1 auto !important;
  }

  .flex-lg-row {
    flex-direction: row !important;
  }

  .flex-lg-column {
    flex-direction: column !important;
  }

  .flex-lg-row-reverse {
    flex-direction: row-reverse !important;
  }

  .flex-lg-column-reverse {
    flex-direction: column-reverse !important;
  }

  .flex-lg-grow-0 {
    flex-grow: 0 !important;
  }

  .flex-lg-grow-1 {
    flex-grow: 1 !important;
  }

  .flex-lg-shrink-0 {
    flex-shrink: 0 !important;
  }

  .flex-lg-shrink-1 {
    flex-shrink: 1 !important;
  }

  .flex-lg-wrap {
    flex-wrap: wrap !important;
  }

  .flex-lg-nowrap {
    flex-wrap: nowrap !important;
  }

  .flex-lg-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }

  .justify-content-lg-start {
    justify-content: flex-start !important;
  }

  .justify-content-lg-end {
    justify-content: flex-end !important;
  }

  .justify-content-lg-center {
    justify-content: center !important;
  }

  .justify-content-lg-between {
    justify-content: space-between !important;
  }

  .justify-content-lg-around {
    justify-content: space-around !important;
  }

  .justify-content-lg-evenly {
    justify-content: space-evenly !important;
  }

  .align-items-lg-start {
    align-items: flex-start !important;
  }

  .align-items-lg-end {
    align-items: flex-end !important;
  }

  .align-items-lg-center {
    align-items: center !important;
  }

  .align-items-lg-baseline {
    align-items: baseline !important;
  }

  .align-items-lg-stretch {
    align-items: stretch !important;
  }

  .align-content-lg-start {
    align-content: flex-start !important;
  }

  .align-content-lg-end {
    align-content: flex-end !important;
  }

  .align-content-lg-center {
    align-content: center !important;
  }

  .align-content-lg-between {
    align-content: space-between !important;
  }

  .align-content-lg-around {
    align-content: space-around !important;
  }

  .align-content-lg-stretch {
    align-content: stretch !important;
  }

  .align-self-lg-auto {
    align-self: auto !important;
  }

  .align-self-lg-start {
    align-self: flex-start !important;
  }

  .align-self-lg-end {
    align-self: flex-end !important;
  }

  .align-self-lg-center {
    align-self: center !important;
  }

  .align-self-lg-baseline {
    align-self: baseline !important;
  }

  .align-self-lg-stretch {
    align-self: stretch !important;
  }

  .order-lg-first {
    order: -1 !important;
  }

  .order-lg-0 {
    order: 0 !important;
  }

  .order-lg-1 {
    order: 1 !important;
  }

  .order-lg-2 {
    order: 2 !important;
  }

  .order-lg-3 {
    order: 3 !important;
  }

  .order-lg-4 {
    order: 4 !important;
  }

  .order-lg-5 {
    order: 5 !important;
  }

  .order-lg-last {
    order: 6 !important;
  }

  .m-lg-0 {
    margin: 0 !important;
  }

  .m-lg-1 {
    margin: 0.25rem !important;
  }

  .m-lg-2 {
    margin: 0.5rem !important;
  }

  .m-lg-3 {
    margin: 1rem !important;
  }

  .m-lg-4 {
    margin: 1.5rem !important;
  }

  .m-lg-5 {
    margin: 3rem !important;
  }

  .m-lg-auto {
    margin: auto !important;
  }

  .mx-lg-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .mx-lg-1 {
    margin-right: 0.25rem !important;
    margin-left: 0.25rem !important;
  }

  .mx-lg-2 {
    margin-right: 0.5rem !important;
    margin-left: 0.5rem !important;
  }

  .mx-lg-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important;
  }

  .mx-lg-4 {
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important;
  }

  .mx-lg-5 {
    margin-right: 3rem !important;
    margin-left: 3rem !important;
  }

  .mx-lg-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .my-lg-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .my-lg-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }

  .my-lg-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  .my-lg-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }

  .my-lg-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }

  .my-lg-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }

  .my-lg-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }

  .mt-lg-0 {
    margin-top: 0 !important;
  }

  .mt-lg-1 {
    margin-top: 0.25rem !important;
  }

  .mt-lg-2 {
    margin-top: 0.5rem !important;
  }

  .mt-lg-3 {
    margin-top: 1rem !important;
  }

  .mt-lg-4 {
    margin-top: 1.5rem !important;
  }

  .mt-lg-5 {
    margin-top: 3rem !important;
  }

  .mt-lg-auto {
    margin-top: auto !important;
  }

  .me-lg-0 {
    margin-right: 0 !important;
  }

  .me-lg-1 {
    margin-right: 0.25rem !important;
  }

  .me-lg-2 {
    margin-right: 0.5rem !important;
  }

  .me-lg-3 {
    margin-right: 1rem !important;
  }

  .me-lg-4 {
    margin-right: 1.5rem !important;
  }

  .me-lg-5 {
    margin-right: 3rem !important;
  }

  .me-lg-auto {
    margin-right: auto !important;
  }

  .mb-lg-0 {
    margin-bottom: 0 !important;
  }

  .mb-lg-1 {
    margin-bottom: 0.25rem !important;
  }

  .mb-lg-2 {
    margin-bottom: 0.5rem !important;
  }

  .mb-lg-3 {
    margin-bottom: 1rem !important;
  }

  .mb-lg-4 {
    margin-bottom: 1.5rem !important;
  }

  .mb-lg-5 {
    margin-bottom: 3rem !important;
  }

  .mb-lg-auto {
    margin-bottom: auto !important;
  }

  .ms-lg-0 {
    margin-left: 0 !important;
  }

  .ms-lg-1 {
    margin-left: 0.25rem !important;
  }

  .ms-lg-2 {
    margin-left: 0.5rem !important;
  }

  .ms-lg-3 {
    margin-left: 1rem !important;
  }

  .ms-lg-4 {
    margin-left: 1.5rem !important;
  }

  .ms-lg-5 {
    margin-left: 3rem !important;
  }

  .ms-lg-auto {
    margin-left: auto !important;
  }

  .p-lg-0 {
    padding: 0 !important;
  }

  .p-lg-1 {
    padding: 0.25rem !important;
  }

  .p-lg-2 {
    padding: 0.5rem !important;
  }

  .p-lg-3 {
    padding: 1rem !important;
  }

  .p-lg-4 {
    padding: 1.5rem !important;
  }

  .p-lg-5 {
    padding: 3rem !important;
  }

  .px-lg-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .px-lg-1 {
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
  }

  .px-lg-2 {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
  }

  .px-lg-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
  }

  .px-lg-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
  }

  .px-lg-5 {
    padding-right: 3rem !important;
    padding-left: 3rem !important;
  }

  .py-lg-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .py-lg-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  .py-lg-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  .py-lg-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }

  .py-lg-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }

  .py-lg-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }

  .pt-lg-0 {
    padding-top: 0 !important;
  }

  .pt-lg-1 {
    padding-top: 0.25rem !important;
  }

  .pt-lg-2 {
    padding-top: 0.5rem !important;
  }

  .pt-lg-3 {
    padding-top: 1rem !important;
  }

  .pt-lg-4 {
    padding-top: 1.5rem !important;
  }

  .pt-lg-5 {
    padding-top: 3rem !important;
  }

  .pe-lg-0 {
    padding-right: 0 !important;
  }

  .pe-lg-1 {
    padding-right: 0.25rem !important;
  }

  .pe-lg-2 {
    padding-right: 0.5rem !important;
  }

  .pe-lg-3 {
    padding-right: 1rem !important;
  }

  .pe-lg-4 {
    padding-right: 1.5rem !important;
  }

  .pe-lg-5 {
    padding-right: 3rem !important;
  }

  .pb-lg-0 {
    padding-bottom: 0 !important;
  }

  .pb-lg-1 {
    padding-bottom: 0.25rem !important;
  }

  .pb-lg-2 {
    padding-bottom: 0.5rem !important;
  }

  .pb-lg-3 {
    padding-bottom: 1rem !important;
  }

  .pb-lg-4 {
    padding-bottom: 1.5rem !important;
  }

  .pb-lg-5 {
    padding-bottom: 3rem !important;
  }

  .ps-lg-0 {
    padding-left: 0 !important;
  }

  .ps-lg-1 {
    padding-left: 0.25rem !important;
  }

  .ps-lg-2 {
    padding-left: 0.5rem !important;
  }

  .ps-lg-3 {
    padding-left: 1rem !important;
  }

  .ps-lg-4 {
    padding-left: 1.5rem !important;
  }

  .ps-lg-5 {
    padding-left: 3rem !important;
  }
}
@media (min-width: 1200px) {
  .d-xl-inline {
    display: inline !important;
  }

  .d-xl-inline-block {
    display: inline-block !important;
  }

  .d-xl-block {
    display: block !important;
  }

  .d-xl-grid {
    display: grid !important;
  }

  .d-xl-table {
    display: table !important;
  }

  .d-xl-table-row {
    display: table-row !important;
  }

  .d-xl-table-cell {
    display: table-cell !important;
  }

  .d-xl-flex {
    display: flex !important;
  }

  .d-xl-inline-flex {
    display: inline-flex !important;
  }

  .d-xl-none {
    display: none !important;
  }

  .flex-xl-fill {
    flex: 1 1 auto !important;
  }

  .flex-xl-row {
    flex-direction: row !important;
  }

  .flex-xl-column {
    flex-direction: column !important;
  }

  .flex-xl-row-reverse {
    flex-direction: row-reverse !important;
  }

  .flex-xl-column-reverse {
    flex-direction: column-reverse !important;
  }

  .flex-xl-grow-0 {
    flex-grow: 0 !important;
  }

  .flex-xl-grow-1 {
    flex-grow: 1 !important;
  }

  .flex-xl-shrink-0 {
    flex-shrink: 0 !important;
  }

  .flex-xl-shrink-1 {
    flex-shrink: 1 !important;
  }

  .flex-xl-wrap {
    flex-wrap: wrap !important;
  }

  .flex-xl-nowrap {
    flex-wrap: nowrap !important;
  }

  .flex-xl-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }

  .justify-content-xl-start {
    justify-content: flex-start !important;
  }

  .justify-content-xl-end {
    justify-content: flex-end !important;
  }

  .justify-content-xl-center {
    justify-content: center !important;
  }

  .justify-content-xl-between {
    justify-content: space-between !important;
  }

  .justify-content-xl-around {
    justify-content: space-around !important;
  }

  .justify-content-xl-evenly {
    justify-content: space-evenly !important;
  }

  .align-items-xl-start {
    align-items: flex-start !important;
  }

  .align-items-xl-end {
    align-items: flex-end !important;
  }

  .align-items-xl-center {
    align-items: center !important;
  }

  .align-items-xl-baseline {
    align-items: baseline !important;
  }

  .align-items-xl-stretch {
    align-items: stretch !important;
  }

  .align-content-xl-start {
    align-content: flex-start !important;
  }

  .align-content-xl-end {
    align-content: flex-end !important;
  }

  .align-content-xl-center {
    align-content: center !important;
  }

  .align-content-xl-between {
    align-content: space-between !important;
  }

  .align-content-xl-around {
    align-content: space-around !important;
  }

  .align-content-xl-stretch {
    align-content: stretch !important;
  }

  .align-self-xl-auto {
    align-self: auto !important;
  }

  .align-self-xl-start {
    align-self: flex-start !important;
  }

  .align-self-xl-end {
    align-self: flex-end !important;
  }

  .align-self-xl-center {
    align-self: center !important;
  }

  .align-self-xl-baseline {
    align-self: baseline !important;
  }

  .align-self-xl-stretch {
    align-self: stretch !important;
  }

  .order-xl-first {
    order: -1 !important;
  }

  .order-xl-0 {
    order: 0 !important;
  }

  .order-xl-1 {
    order: 1 !important;
  }

  .order-xl-2 {
    order: 2 !important;
  }

  .order-xl-3 {
    order: 3 !important;
  }

  .order-xl-4 {
    order: 4 !important;
  }

  .order-xl-5 {
    order: 5 !important;
  }

  .order-xl-last {
    order: 6 !important;
  }

  .m-xl-0 {
    margin: 0 !important;
  }

  .m-xl-1 {
    margin: 0.25rem !important;
  }

  .m-xl-2 {
    margin: 0.5rem !important;
  }

  .m-xl-3 {
    margin: 1rem !important;
  }

  .m-xl-4 {
    margin: 1.5rem !important;
  }

  .m-xl-5 {
    margin: 3rem !important;
  }

  .m-xl-auto {
    margin: auto !important;
  }

  .mx-xl-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .mx-xl-1 {
    margin-right: 0.25rem !important;
    margin-left: 0.25rem !important;
  }

  .mx-xl-2 {
    margin-right: 0.5rem !important;
    margin-left: 0.5rem !important;
  }

  .mx-xl-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important;
  }

  .mx-xl-4 {
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important;
  }

  .mx-xl-5 {
    margin-right: 3rem !important;
    margin-left: 3rem !important;
  }

  .mx-xl-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .my-xl-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .my-xl-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }

  .my-xl-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  .my-xl-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }

  .my-xl-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }

  .my-xl-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }

  .my-xl-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }

  .mt-xl-0 {
    margin-top: 0 !important;
  }

  .mt-xl-1 {
    margin-top: 0.25rem !important;
  }

  .mt-xl-2 {
    margin-top: 0.5rem !important;
  }

  .mt-xl-3 {
    margin-top: 1rem !important;
  }

  .mt-xl-4 {
    margin-top: 1.5rem !important;
  }

  .mt-xl-5 {
    margin-top: 3rem !important;
  }

  .mt-xl-auto {
    margin-top: auto !important;
  }

  .me-xl-0 {
    margin-right: 0 !important;
  }

  .me-xl-1 {
    margin-right: 0.25rem !important;
  }

  .me-xl-2 {
    margin-right: 0.5rem !important;
  }

  .me-xl-3 {
    margin-right: 1rem !important;
  }

  .me-xl-4 {
    margin-right: 1.5rem !important;
  }

  .me-xl-5 {
    margin-right: 3rem !important;
  }

  .me-xl-auto {
    margin-right: auto !important;
  }

  .mb-xl-0 {
    margin-bottom: 0 !important;
  }

  .mb-xl-1 {
    margin-bottom: 0.25rem !important;
  }

  .mb-xl-2 {
    margin-bottom: 0.5rem !important;
  }

  .mb-xl-3 {
    margin-bottom: 1rem !important;
  }

  .mb-xl-4 {
    margin-bottom: 1.5rem !important;
  }

  .mb-xl-5 {
    margin-bottom: 3rem !important;
  }

  .mb-xl-auto {
    margin-bottom: auto !important;
  }

  .ms-xl-0 {
    margin-left: 0 !important;
  }

  .ms-xl-1 {
    margin-left: 0.25rem !important;
  }

  .ms-xl-2 {
    margin-left: 0.5rem !important;
  }

  .ms-xl-3 {
    margin-left: 1rem !important;
  }

  .ms-xl-4 {
    margin-left: 1.5rem !important;
  }

  .ms-xl-5 {
    margin-left: 3rem !important;
  }

  .ms-xl-auto {
    margin-left: auto !important;
  }

  .p-xl-0 {
    padding: 0 !important;
  }

  .p-xl-1 {
    padding: 0.25rem !important;
  }

  .p-xl-2 {
    padding: 0.5rem !important;
  }

  .p-xl-3 {
    padding: 1rem !important;
  }

  .p-xl-4 {
    padding: 1.5rem !important;
  }

  .p-xl-5 {
    padding: 3rem !important;
  }

  .px-xl-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .px-xl-1 {
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
  }

  .px-xl-2 {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
  }

  .px-xl-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
  }

  .px-xl-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
  }

  .px-xl-5 {
    padding-right: 3rem !important;
    padding-left: 3rem !important;
  }

  .py-xl-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .py-xl-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  .py-xl-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  .py-xl-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }

  .py-xl-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }

  .py-xl-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }

  .pt-xl-0 {
    padding-top: 0 !important;
  }

  .pt-xl-1 {
    padding-top: 0.25rem !important;
  }

  .pt-xl-2 {
    padding-top: 0.5rem !important;
  }

  .pt-xl-3 {
    padding-top: 1rem !important;
  }

  .pt-xl-4 {
    padding-top: 1.5rem !important;
  }

  .pt-xl-5 {
    padding-top: 3rem !important;
  }

  .pe-xl-0 {
    padding-right: 0 !important;
  }

  .pe-xl-1 {
    padding-right: 0.25rem !important;
  }

  .pe-xl-2 {
    padding-right: 0.5rem !important;
  }

  .pe-xl-3 {
    padding-right: 1rem !important;
  }

  .pe-xl-4 {
    padding-right: 1.5rem !important;
  }

  .pe-xl-5 {
    padding-right: 3rem !important;
  }

  .pb-xl-0 {
    padding-bottom: 0 !important;
  }

  .pb-xl-1 {
    padding-bottom: 0.25rem !important;
  }

  .pb-xl-2 {
    padding-bottom: 0.5rem !important;
  }

  .pb-xl-3 {
    padding-bottom: 1rem !important;
  }

  .pb-xl-4 {
    padding-bottom: 1.5rem !important;
  }

  .pb-xl-5 {
    padding-bottom: 3rem !important;
  }

  .ps-xl-0 {
    padding-left: 0 !important;
  }

  .ps-xl-1 {
    padding-left: 0.25rem !important;
  }

  .ps-xl-2 {
    padding-left: 0.5rem !important;
  }

  .ps-xl-3 {
    padding-left: 1rem !important;
  }

  .ps-xl-4 {
    padding-left: 1.5rem !important;
  }

  .ps-xl-5 {
    padding-left: 3rem !important;
  }
}
@media (min-width: 1400px) {
  .d-xxl-inline {
    display: inline !important;
  }

  .d-xxl-inline-block {
    display: inline-block !important;
  }

  .d-xxl-block {
    display: block !important;
  }

  .d-xxl-grid {
    display: grid !important;
  }

  .d-xxl-table {
    display: table !important;
  }

  .d-xxl-table-row {
    display: table-row !important;
  }

  .d-xxl-table-cell {
    display: table-cell !important;
  }

  .d-xxl-flex {
    display: flex !important;
  }

  .d-xxl-inline-flex {
    display: inline-flex !important;
  }

  .d-xxl-none {
    display: none !important;
  }

  .flex-xxl-fill {
    flex: 1 1 auto !important;
  }

  .flex-xxl-row {
    flex-direction: row !important;
  }

  .flex-xxl-column {
    flex-direction: column !important;
  }

  .flex-xxl-row-reverse {
    flex-direction: row-reverse !important;
  }

  .flex-xxl-column-reverse {
    flex-direction: column-reverse !important;
  }

  .flex-xxl-grow-0 {
    flex-grow: 0 !important;
  }

  .flex-xxl-grow-1 {
    flex-grow: 1 !important;
  }

  .flex-xxl-shrink-0 {
    flex-shrink: 0 !important;
  }

  .flex-xxl-shrink-1 {
    flex-shrink: 1 !important;
  }

  .flex-xxl-wrap {
    flex-wrap: wrap !important;
  }

  .flex-xxl-nowrap {
    flex-wrap: nowrap !important;
  }

  .flex-xxl-wrap-reverse {
    flex-wrap: wrap-reverse !important;
  }

  .justify-content-xxl-start {
    justify-content: flex-start !important;
  }

  .justify-content-xxl-end {
    justify-content: flex-end !important;
  }

  .justify-content-xxl-center {
    justify-content: center !important;
  }

  .justify-content-xxl-between {
    justify-content: space-between !important;
  }

  .justify-content-xxl-around {
    justify-content: space-around !important;
  }

  .justify-content-xxl-evenly {
    justify-content: space-evenly !important;
  }

  .align-items-xxl-start {
    align-items: flex-start !important;
  }

  .align-items-xxl-end {
    align-items: flex-end !important;
  }

  .align-items-xxl-center {
    align-items: center !important;
  }

  .align-items-xxl-baseline {
    align-items: baseline !important;
  }

  .align-items-xxl-stretch {
    align-items: stretch !important;
  }

  .align-content-xxl-start {
    align-content: flex-start !important;
  }

  .align-content-xxl-end {
    align-content: flex-end !important;
  }

  .align-content-xxl-center {
    align-content: center !important;
  }

  .align-content-xxl-between {
    align-content: space-between !important;
  }

  .align-content-xxl-around {
    align-content: space-around !important;
  }

  .align-content-xxl-stretch {
    align-content: stretch !important;
  }

  .align-self-xxl-auto {
    align-self: auto !important;
  }

  .align-self-xxl-start {
    align-self: flex-start !important;
  }

  .align-self-xxl-end {
    align-self: flex-end !important;
  }

  .align-self-xxl-center {
    align-self: center !important;
  }

  .align-self-xxl-baseline {
    align-self: baseline !important;
  }

  .align-self-xxl-stretch {
    align-self: stretch !important;
  }

  .order-xxl-first {
    order: -1 !important;
  }

  .order-xxl-0 {
    order: 0 !important;
  }

  .order-xxl-1 {
    order: 1 !important;
  }

  .order-xxl-2 {
    order: 2 !important;
  }

  .order-xxl-3 {
    order: 3 !important;
  }

  .order-xxl-4 {
    order: 4 !important;
  }

  .order-xxl-5 {
    order: 5 !important;
  }

  .order-xxl-last {
    order: 6 !important;
  }

  .m-xxl-0 {
    margin: 0 !important;
  }

  .m-xxl-1 {
    margin: 0.25rem !important;
  }

  .m-xxl-2 {
    margin: 0.5rem !important;
  }

  .m-xxl-3 {
    margin: 1rem !important;
  }

  .m-xxl-4 {
    margin: 1.5rem !important;
  }

  .m-xxl-5 {
    margin: 3rem !important;
  }

  .m-xxl-auto {
    margin: auto !important;
  }

  .mx-xxl-0 {
    margin-right: 0 !important;
    margin-left: 0 !important;
  }

  .mx-xxl-1 {
    margin-right: 0.25rem !important;
    margin-left: 0.25rem !important;
  }

  .mx-xxl-2 {
    margin-right: 0.5rem !important;
    margin-left: 0.5rem !important;
  }

  .mx-xxl-3 {
    margin-right: 1rem !important;
    margin-left: 1rem !important;
  }

  .mx-xxl-4 {
    margin-right: 1.5rem !important;
    margin-left: 1.5rem !important;
  }

  .mx-xxl-5 {
    margin-right: 3rem !important;
    margin-left: 3rem !important;
  }

  .mx-xxl-auto {
    margin-right: auto !important;
    margin-left: auto !important;
  }

  .my-xxl-0 {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .my-xxl-1 {
    margin-top: 0.25rem !important;
    margin-bottom: 0.25rem !important;
  }

  .my-xxl-2 {
    margin-top: 0.5rem !important;
    margin-bottom: 0.5rem !important;
  }

  .my-xxl-3 {
    margin-top: 1rem !important;
    margin-bottom: 1rem !important;
  }

  .my-xxl-4 {
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
  }

  .my-xxl-5 {
    margin-top: 3rem !important;
    margin-bottom: 3rem !important;
  }

  .my-xxl-auto {
    margin-top: auto !important;
    margin-bottom: auto !important;
  }

  .mt-xxl-0 {
    margin-top: 0 !important;
  }

  .mt-xxl-1 {
    margin-top: 0.25rem !important;
  }

  .mt-xxl-2 {
    margin-top: 0.5rem !important;
  }

  .mt-xxl-3 {
    margin-top: 1rem !important;
  }

  .mt-xxl-4 {
    margin-top: 1.5rem !important;
  }

  .mt-xxl-5 {
    margin-top: 3rem !important;
  }

  .mt-xxl-auto {
    margin-top: auto !important;
  }

  .me-xxl-0 {
    margin-right: 0 !important;
  }

  .me-xxl-1 {
    margin-right: 0.25rem !important;
  }

  .me-xxl-2 {
    margin-right: 0.5rem !important;
  }

  .me-xxl-3 {
    margin-right: 1rem !important;
  }

  .me-xxl-4 {
    margin-right: 1.5rem !important;
  }

  .me-xxl-5 {
    margin-right: 3rem !important;
  }

  .me-xxl-auto {
    margin-right: auto !important;
  }

  .mb-xxl-0 {
    margin-bottom: 0 !important;
  }

  .mb-xxl-1 {
    margin-bottom: 0.25rem !important;
  }

  .mb-xxl-2 {
    margin-bottom: 0.5rem !important;
  }

  .mb-xxl-3 {
    margin-bottom: 1rem !important;
  }

  .mb-xxl-4 {
    margin-bottom: 1.5rem !important;
  }

  .mb-xxl-5 {
    margin-bottom: 3rem !important;
  }

  .mb-xxl-auto {
    margin-bottom: auto !important;
  }

  .ms-xxl-0 {
    margin-left: 0 !important;
  }

  .ms-xxl-1 {
    margin-left: 0.25rem !important;
  }

  .ms-xxl-2 {
    margin-left: 0.5rem !important;
  }

  .ms-xxl-3 {
    margin-left: 1rem !important;
  }

  .ms-xxl-4 {
    margin-left: 1.5rem !important;
  }

  .ms-xxl-5 {
    margin-left: 3rem !important;
  }

  .ms-xxl-auto {
    margin-left: auto !important;
  }

  .p-xxl-0 {
    padding: 0 !important;
  }

  .p-xxl-1 {
    padding: 0.25rem !important;
  }

  .p-xxl-2 {
    padding: 0.5rem !important;
  }

  .p-xxl-3 {
    padding: 1rem !important;
  }

  .p-xxl-4 {
    padding: 1.5rem !important;
  }

  .p-xxl-5 {
    padding: 3rem !important;
  }

  .px-xxl-0 {
    padding-right: 0 !important;
    padding-left: 0 !important;
  }

  .px-xxl-1 {
    padding-right: 0.25rem !important;
    padding-left: 0.25rem !important;
  }

  .px-xxl-2 {
    padding-right: 0.5rem !important;
    padding-left: 0.5rem !important;
  }

  .px-xxl-3 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
  }

  .px-xxl-4 {
    padding-right: 1.5rem !important;
    padding-left: 1.5rem !important;
  }

  .px-xxl-5 {
    padding-right: 3rem !important;
    padding-left: 3rem !important;
  }

  .py-xxl-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  .py-xxl-1 {
    padding-top: 0.25rem !important;
    padding-bottom: 0.25rem !important;
  }

  .py-xxl-2 {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  .py-xxl-3 {
    padding-top: 1rem !important;
    padding-bottom: 1rem !important;
  }

  .py-xxl-4 {
    padding-top: 1.5rem !important;
    padding-bottom: 1.5rem !important;
  }

  .py-xxl-5 {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
  }

  .pt-xxl-0 {
    padding-top: 0 !important;
  }

  .pt-xxl-1 {
    padding-top: 0.25rem !important;
  }

  .pt-xxl-2 {
    padding-top: 0.5rem !important;
  }

  .pt-xxl-3 {
    padding-top: 1rem !important;
  }

  .pt-xxl-4 {
    padding-top: 1.5rem !important;
  }

  .pt-xxl-5 {
    padding-top: 3rem !important;
  }

  .pe-xxl-0 {
    padding-right: 0 !important;
  }

  .pe-xxl-1 {
    padding-right: 0.25rem !important;
  }

  .pe-xxl-2 {
    padding-right: 0.5rem !important;
  }

  .pe-xxl-3 {
    padding-right: 1rem !important;
  }

  .pe-xxl-4 {
    padding-right: 1.5rem !important;
  }

  .pe-xxl-5 {
    padding-right: 3rem !important;
  }

  .pb-xxl-0 {
    padding-bottom: 0 !important;
  }

  .pb-xxl-1 {
    padding-bottom: 0.25rem !important;
  }

  .pb-xxl-2 {
    padding-bottom: 0.5rem !important;
  }

  .pb-xxl-3 {
    padding-bottom: 1rem !important;
  }

  .pb-xxl-4 {
    padding-bottom: 1.5rem !important;
  }

  .pb-xxl-5 {
    padding-bottom: 3rem !important;
  }

  .ps-xxl-0 {
    padding-left: 0 !important;
  }

  .ps-xxl-1 {
    padding-left: 0.25rem !important;
  }

  .ps-xxl-2 {
    padding-left: 0.5rem !important;
  }

  .ps-xxl-3 {
    padding-left: 1rem !important;
  }

  .ps-xxl-4 {
    padding-left: 1.5rem !important;
  }

  .ps-xxl-5 {
    padding-left: 3rem !important;
  }
}
@media print {
  .d-print-inline {
    display: inline !important;
  }

  .d-print-inline-block {
    display: inline-block !important;
  }

  .d-print-block {
    display: block !important;
  }

  .d-print-grid {
    display: grid !important;
  }

  .d-print-table {
    display: table !important;
  }

  .d-print-table-row {
    display: table-row !important;
  }

  .d-print-table-cell {
    display: table-cell !important;
  }

  .d-print-flex {
    display: flex !important;
  }

  .d-print-inline-flex {
    display: inline-flex !important;
  }

  .d-print-none {
    display: none !important;
  }
}
/*
 * Variables:
 */
body {
  font-family: "Noto Sans", sans-serif;
  font-size: 18px;
  line-height: 26px;
  margin: 0;
  padding: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Lato", sans-serif;
}
h1.highlight,
h2.highlight,
h3.highlight,
h4.highlight,
h5.highlight,
h6.highlight {
  color: #c00000;
}

.h2 {
  margin-top: 0;
  margin-bottom: 0.67rem;
  padding-top: 0.8rem;
  font-family: "Lato", sans-serif;
  font-size: 1.5rem;
  font-weight: 700;
}
.h2.highlight {
  color: #c00000;
}

a, a:link, a:visited, a:active, a:hover {
  font-family: inherit;
  /*citi*/
}
a, a:link, a:visited, a:active, a:hover {
  color: #606;
}
a:hover {
  text-decoration: underline;
}

#body {
  display: flex;
  flex-direction: column;
  padding-left: 20px;
  padding-right: 20px;
  max-width: 1400px;
  margin: 0 auto;
}
@media (min-width: 992px) {
  #body {
    flex-direction: row;
  }
}
#body #content_side {
  order: 2;
}
#body #content_main {
  flex: auto;
}

.page-title {
  margin: 0 0;
  width: 100%;
  padding: 15px 20px;
  background: #DDAAFF;
  display: inline-block;
}
.page-title h1 {
  margin: 0;
  font-size: 18px;
}

/******
   * Content_main - in the Body
   **/
#content_main {
  display: block;
  margin-top: 4px;
  margin-bottom: 0px;
  border-bottom: 1px solid white;
  padding-right: 15px;
  padding-bottom: 20px;
  overflow: inherit;
  padding-right: 10px;
}
@media (min-width: 992px) {
  #content_main {
    float: left;
  }
}
#content_main table.experts-response ul {
  padding-left: 0;
}

#content_main .medium {
  font-size: 1.3rem;
}

#content_main .large {
  font-size: 1.6rem;
}

#content_main h2 {
  margin-top: 0;
  margin-bottom: 0.67rem;
  padding-top: 0.8rem;
  font-size: 1.5rem;
}

#content_main h3 {
  margin: 0.83rem 0;
  font-size: 1.2rem;
}

#content_main h4 {
  margin: 1rem 0;
  font-size: 1rem;
}

#content_main h5 {
  margin: 1rem 0;
  font-size: 1rem;
  font-weight: normal;
  font-style: italic;
}

#content_main :first-child {
  /* unsupported in IE (incl. IE7) */
}

/* there are back/next buttons in #content_main on the End Module pages.
       usually they are in #nav. */
#content_main a.back {
  color: #004992;
  /*dark blue*/
  text-decoration: none;
  font-weight: bold;
}

#content_main a.next {
  color: #dc0e13;
  /*dark red*/
  text-decoration: none;
  font-weight: bold;
}

/* for two equal column pages */
#content-left,
#content-right {
  width: 48%;
  float: left;
  font-size: 1.2rem;
}

#content-right {
  clear: right;
  margin-left: 2%;
}

/******
   * Content_side - in the Body
   **/
#content_side {
  /* IEbox warning: contains both width and border/padding */
  position: relative;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 50px;
  padding-top: 1.2rem;
  margin-left: 15px;
  margin-top: 0px;
  margin-bottom: 4px;
  font-size: 14px;
  /*   display: block; */
  /*   position: absolute;
    right: 0; */
  /*   margin-left: 400px; */
  /* test RRF */
  /*border-left: 1px solid #0000CC;
      min-height: 350px;
      background-color:#CCF;
      */
  padding-left: 10px;
  padding-right: 5px;
  padding-bottom: 5px;
  margin-bottom: 30px;
  margin-left: -2px;
}
@media (min-width: 992px) {
  #content_side {
    width: 270px;
    min-width: 230px;
    min-height: 23rem;
    background-image: url("/images/pre/side_divider.png");
    background-repeat: repeat-y;
  }
}
@media (min-width: 992px) {
  #content_side .empty-sidebar {
    height: 960px;
    color: white;
  }
}

/* added by RRF as per LLB request Jun 9, 2011  */
#content_side div {
  font-size: 0.925rem;
}

#content_side :first-child {
  margin-top: 0;
}

#content_side h2 {
  margin: 0.8rem 0;
  font-size: 1.25rem;
}

#content_side h3 {
  margin: 0.83rem 0;
  font-size: 1.2rem;
}

#content_side h4 {
  margin: 1rem 0;
  font-size: 1rem;
}

#content_side h5 {
  margin: 1rem 0;
  font-size: 1rem;
  font-weight: normal;
  font-style: italic;
}

#content_side ul,
#content_side ol {
  padding-left: 2rem;
}

/* content side for help screens from welcome.html */
#content_sidelarge {
  /* IEbox warning: contains both width and border/padding */
  position: relative;
  float: right;
  width: 300px;
  min-height: 23rem;
  border-left: 1px solid #0000cc;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 5px;
  padding-top: 1.2rem;
  margin-left: 15px;
  margin-top: 0px;
  margin-bottom: 4px;
  font-size: 1.2rem;
  /*   display: block; */
  /*   position: absolute;
    right: 0; */
  /*   margin-left: 400px; */
}

#content_side #login-notice {
  font-size: 0.8rem;
}

.button {
  display: inline-block;
  -moz-border-radius: 0.5rem;
  -webkit-border-radius: 0.5rem;
  background-color: #ddaaff;
  border: 1px solid #3f1744;
  margin: 0;
  padding: 0 0.5rem;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  color: #5e2466;
  font-weight: 600;
  text-decoration: none;
  font-size: medium;
  vertical-align: middle;
  text-align: center;
  cursor: pointer;
}
.button:hover {
  color: #fff;
  background-color: #3f1744;
}
.button:disabled {
  pointer-events: none;
  opacity: 0.6;
}

a.button:visited {
  color: #5e2466;
}
a.button:hover {
  color: #fff;
}

/*
	Max width before this PARTICULAR table gets nasty. This query will take effect for any screen smaller than 760px and also iPads specifically.
	*/
@media only screen and (max-width: 991px), (min-device-width: 991px) and (max-device-width: 991px) {
  /* Force table to not be like tables anymore */
  .responsive-table {
    /* Hide table headers (but not display: none;, for accessibility) */
    /*
    Label the data
      You could also use a data-* attribute and content for this. That way "bloats" the HTML, this way means you need to keep HTML and CSS in sync. Lea Verou has a clever way to handle with text-shadow.
    */
  }
  .responsive-table table,
.responsive-table thead,
.responsive-table tbody,
.responsive-table th,
.responsive-table td,
.responsive-table tr {
    display: block;
  }
  .responsive-table thead tr {
    position: absolute;
    top: -9999px;
    left: -9999px;
  }
  .responsive-table tr {
    margin: 0 0 1rem 0;
  }
  .responsive-table tr:nth-child(odd) {
    background: #DDAAFF;
  }
  .responsive-table th,
.responsive-table td {
    padding: 10px;
  }
  .responsive-table td {
    /* Behave  like a "row" */
    border: none;
    border-bottom: 1px solid #eee;
    position: relative;
    padding-left: 50%;
  }
  .responsive-table td:before {
    /* Now like a table header */
    position: absolute;
    /* Top/left values mimic padding */
    top: 0;
    left: 6px;
    width: 45%;
    white-space: nowrap;
    padding: 10px 10px 8px 5px;
  }
  .responsive-table td::before {
    content: attr(data-attibute);
  }
}
/** 
 * Modules
 */
table.experts-response {
  border: 1px solid #666;
  border: 1px ridge #300;
}
table.experts-response ul {
  list-style: none;
}

table.experts-response th {
  background-color: #DDAAFF;
  color: #303;
  /* background-color:#C9F;
  */
}

@media (min-width: 992px) {
  table.experts-response td, table.experts-response th {
    border: 1px solid #666;
    border: 1px ridge #303;
    padding: 10px;
  }
}

/* added by RRF to save space  April 24, 2011 */
table.experts-response td {
  line-height: normal;
  font-size: 1rem;
}
@media (min-width: 992px) {
  table.experts-response td {
    margin-top: 2px;
    margin-right: 2px;
    margin-left: 2px;
    margin-bottom: 10px;
  }
}

table.experts-response td p {
  margin-top: 2px;
  margin-right: 2px;
  margin-left: 2px;
  margin-bottom: 10px;
  line-height: normal;
  font-size: 0.95rem;
}

.legend-toggle {
  width: 34px;
  height: 26px;
  position: relative;
  margin: 10px auto;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  cursor: pointer;
  float: right;
}
.legend-toggle span {
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  background: #fff;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}
.legend-toggle span:nth-child(1) {
  top: 0px;
}
.legend-toggle span:nth-child(2) {
  top: 11px;
}
.legend-toggle span:nth-child(3) {
  top: 22px;
}
.legend-toggle.open span:nth-child(1) {
  top: 18px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}
.legend-toggle.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}
.legend-toggle.open span:nth-child(3) {
  top: 18px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}
@media (min-width: 992px) {
  .legend-toggle {
    display: none;
  }
}

/** Header **/
#header {
  height: 105px;
  overflow: hidden;
  background: transparent url(/images/pre/header-bg.png) repeat-x top left;
  padding: 0;
  margin: 0;
  /* added by RRF test topmenu  */
  /*height: 130px; 
  background-color : #5e2174;
  padding-bottom: 8px;
  border-bottom-color : #e6e3d6;
  border-bottom-style : solid;
  border-bottom-width : 2px;*/
}
#header .inner {
  padding: 2px 15px;
  height: 100%;
}
#header .legend {
  float: right;
  margin: 0 1rem 0 0;
  font-size: 0.8rem;
  display: none;
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}
#header .legend.open {
  display: block;
}
@media (min-width: 992px) {
  #header .legend {
    display: block;
  }
  #header .legend.open {
    display: block;
  }
}
#header .legend span {
  display: block;
  background-color: #fff;
  padding: 1px 8px;
  margin-top: 4px;
  line-height: 14px;
}
#header .legend span sup {
  padding: 0;
  border: 0;
  margin-top: 2px;
  font-size: 0.7rem;
}
#header .chrpp-title {
  margin-top: 0.2rem;
}
#header h1 {
  font-size: 1.4rem;
  margin-top: 0rem;
  width: 22%;
}

body.page-fr #header .inner {
  background: transparent url(/images/pre/banner-bg-fra.png) no-repeat top center;
}

body.page-en #header .inner {
  background: transparent url(/images/pre/banner-bg-eng.png) no-repeat top center;
}

/** Footer **/
#footer {
  border-bottom: none;
  border-top: 2px solid #990099;
  /* added by RRF requested by LLB */
  border-top: 2px solid #7d4490;
  padding: 20px;
  display: block;
  position: relative;
  clear: both;
  border-top: 2px solid blue;
  border-bottom: 2px solid #cc0000;
  font-size: 0.8rem;
  color: #000;
}
#footer a {
  color: #000;
}
#footer .goc-footer {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  padding: 5px 0 0;
}
#footer .copyright {
  font-size: 9px;
  padding-left: 40px;
}
#footer .goc-sig {
  float: left;
  height: 20px;
  width: auto;
  border-width: 0px;
  margin-left: 5px;
  flex: 0 0 80%;
  margin: 0 0 15px 0;
}
#footer .goc-sig img {
  width: auto;
  max-width: 100%;
}
@media (min-width: 768px) {
  #footer .goc-sig {
    width: 372px;
  }
}
#footer .goc-logo {
  float: right;
  height: 20px;
  width: 83px;
  border-width: 0px;
  margin-right: 10px;
  flex: 0 0 20%;
  margin: 0;
  text-align: right;
}
#footer ul.primary {
  margin: 0 -10px;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
#footer ul.primary li {
  margin-bottom: 10px;
  padding: 0 10px;
}
#footer ul.primary li:first-child {
  margin-left: 0;
}
#footer ul.primary li a {
  border: 0.0175rem solid transparent;
}
#footer ul.primary li a:hover {
  border: 0.0175rem dotted #663366;
  background-color: #f5e5f5;
  color: #663366;
  text-align: center;
  text-decoration: none;
}
#footer #qlogof {
  float: left;
  position: relative;
  top: -20px;
  padding-right: 6px;
  background-color: #ffffff;
  max-width: 200px;
  max-height: 120px;
}

/*** acknowledgement bottom ***/
#ackfooter {
  display: block;
  position: relative;
  clear: both;
  font-size: 0.8rem;
  color: #000000;
  padding-right: 0;
  padding-left: 0;
}

#nav {
  right: 0;
  width: 100%;
  max-width: 100%;
  z-index: 0;
  padding: 0 20px;
  display: flex;
  justify-content: space-between;
  font-size: 1.5rem;
  font-weight: bold;
  margin: 15px 0;
  /* background-color:#FCF; */
}
@media (min-width: 992px) {
  #nav {
    padding: 0 20px;
  }
}
#nav a.back,
#nav a.next {
  color: #dc0e13;
  /*dark red*/
  text-decoration: none;
  float: right;
  font-size: 20px;
}
#nav a.back:hover,
#nav a.next:hover {
  color: #7c080b;
}
#nav a.next {
  margin-left: auto;
}
#nav a.back {
  color: #004992;
  /*dark blue*/
  float: left;
}
#nav a.back:hover {
  color: #00162c;
}

/*
.loginPage {
   background-color:#F3E2FE;
   float:none;
   text-align:center;
} */
#registration-link {
  width: 150px;
  overflow: hidden;
  float: left;
  font-weight: bold;
  margin: 15px 0 23px 5px;
  padding: 5px;
  border: 1px solid #000;
}

#registration-link a {
  text-decoration: underline;
  font-size: 1rem;
}

.login-box {
  height: 170px;
  border: 1px ridge #606;
}

#formActions {
  width: 90%;
  height: 20px;
}

.login {
  float: none;
  text-align: left;
  padding: 20px;
  margin: 0 auto inherit auto;
  overflow: hidden;
  width: 100%;
  display: flex;
  height: auto !important;
}
@media (min-width: 992px) {
  .login {
    width: 60%;
    min-width: 650px;
  }
}
.login div#formControls {
  padding: 0;
}
.login div#formActions {
  height: auto;
  padding-left: 0;
  padding-right: 0;
}
.login .col2-set {
  display: flex;
  flex-wrap: wrap;
}
.login .col2-set .col1 {
  display: flex;
  flex-wrap: wrap;
  flex: 0 0 100%;
  flex-direction: column;
}
@media (min-width: 992px) {
  .login .col2-set .col1 {
    flex: 0 0 59%;
  }
}
.login .col2-set .col1 #c1_ctl .renderWithName div.left,
.login .col2-set .col1 #c2_ctl .renderWithName div.left {
  width: 100%;
}
.login .col2-set .col1 #c1_ctl .renderWithName label,
.login .col2-set .col1 #c2_ctl .renderWithName label {
  width: 250px;
  max-width: 100%;
  text-align: left;
  float: left;
}
.login .col2-set .col1 #c3_ctl .renderWithName {
  display: inline-block;
  position: relative;
}
.login .col2-set .col1 #c3_ctl .renderWithName .left {
  padding-right: 20px;
}
.login .col2-set .col1 #c3_ctl .renderWithName label {
  font-size: 13px;
}
.login .col2-set .col1 #c3_ctl .renderWithName .right {
  position: absolute;
  top: 6px;
  right: 0;
}
.login .col2-set .col2 {
  flex: 0 0 100%;
}
@media (min-width: 992px) {
  .login .col2-set .col2 {
    flex: 0 0 40%;
  }
}
.login .col2-set .col2#registration-link {
  width: auto;
  float: none;
  border: none;
}

.loginReminder {
  float: none;
  text-align: left;
  padding-top: 5px;
  padding-left: 10px;
  padding-right: 10px;
  padding-bottom: 25px;
  margin-top: 30px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  overflow: visible;
}
.loginReminder #c6_ctl {
  flex: 0 0 100%;
  margin-bottom: 10px;
}
.loginReminder #c6_ctl + span {
  flex: 0 0 100%;
}
.loginReminder .renderWithName {
  flex: 0 0 100%;
}

.registration-box {
  border: 1px ridge #606;
  padding: 20px;
  margin: 30px 0;
}
@media (min-width: 992px) {
  .registration-box {
    width: 60%;
    min-width: 650px;
  }
}
.registration-box div#formControls {
  display: inline-block;
  padding: 0;
}
.registration-box div#formControls input.textbox {
  text-align: left;
  background-color: #DDAAFF;
}
.registration-box div#formControls select.listbox {
  height: 28px;
  line-height: 28px;
  background-color: #DDAAFF;
}
.registration-box div#formActions {
  height: auto;
  padding-left: 0;
  padding-right: 0;
}
.registration-box .renderWithName div.left {
  width: 100%;
}
.registration-box .renderWithName div.left label {
  width: 250px;
  max-width: 100%;
  text-align: left;
  float: left;
  font-weight: bold;
}
.registration-box .col2-set {
  display: flex;
  flex-wrap: wrap;
}
.registration-box .col2-set .col1,
.registration-box .col2-set .col2 {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
}
.registration-box .col2-set .col1 {
  display: flex;
  flex-wrap: wrap;
  flex: 0 0 100%;
  flex-direction: column;
}
@media (min-width: 576px) {
  .registration-box .col2-set .col1 {
    flex: 0 0 50%;
  }
}
.registration-box .col2-set .col2 {
  flex: 0 0 100%;
}
@media (min-width: 576px) {
  .registration-box .col2-set .col2 {
    flex: 0 0 50%;
  }
}
.registration-box .col2-set .col2#registration-link {
  width: auto;
  float: none;
  border: none;
}

.question-actions {
  margin-top: 20px;
  margin-bottom: 20px;
}
.question-actions .button {
  margin-right: 10px;
}

.response .answer {
  padding-left: 20px;
  position: relative;
  line-height: 24px;
}
.response .answer::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 14px;
  height: 14px;
  transform: translateY(-50%);
}
.response .answer.answer-correct::before {
  background: url("/images/correct.svg") 0 0 no-repeat;
  background-size: 100%;
}
.response .answer.answer-incorrect::before {
  background: url("/images/incorrect.svg") 0 0 no-repeat;
  background-size: 100%;
}

.exam-finish {
  margin-top: 25px;
}
.exam-finish .exam-finish__actions {
  margin-top: 20px;
}

.end-module {
  margin-top: 30px;
}
.end-module h1 {
  color: #990099;
  font-size: 2rem;
  font-weight: bold;
}
@media (min-width: 576px) {
  .end-module h1 {
    font-size: 5rem;
  }
}

/*# sourceMappingURL=style.css.map */
