﻿/* *****************************************************************
//  Program name:   styles.css
//  Program type:   css styles sheet
//    Invoked by:   header.php
//  Main function:  CSS styles sheet for all custom css
//  Notes/Special instructions:
//    Custom identifier will start with xx-
//
// *****************************************************************
//  Modification History: 2020-10-06 WJC - Created program.
//                        2021-06-22 WJC01 - Added CSS for home.php carousel directional button
//                        2024-08-24 WJC02 - Adjusted html to remove spacing around landing page content.
//                                   WJC03 - Add margins to remove spacing from logged in containers
//                        2024-11-14 WJC04 - Adjusted margins for logged in containers & removed scroll bar on bottom of menu    

/* ===== Global HTML Settings ===== */
*,
*::after,
*::before{
  margin: 0;
  padding: 0;
  box-sizing: inherit;
}

html{
  font-family: sans-serif; /* 1 */
  overflow-x: hidden;
  /*overflow-y: hidden;*/
  padding: 10px;
  padding-right: 0px; 
  padding-left: 0px; 
  font-size: 100%;/*for using REM units*/
}
/*video {
  object-fit: cover;
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
}*/

body{
  box-sizing: border-box;
  padding-top: 78px; /* 7rem  Sets all workspace to begin below the navigation bar*/
 /* background: url("../img/estatory_background.webp") repeat center center fixed;*/ /*background image*/
  /*background: #016382; repeat  center center fixed;*/
  -webkit-background-size: cover;
  /*-moz-background-size: cover;*/
  -o-background-size: cover;
  background-size: cover;
}

.page-footer {
  position: fixed;
  padding-right: 3rem;
  padding-top: 5px;
  height: 3rem;
  bottom: 0rem;
  width: 96%;
  /*border: 1px solid black; */
  background: transparent;
}

hr {
  margin-top: 2px;
  margin-bottom: 1px;
}

a {
  color: #ffffff;
  text-decoration: none;
  outline: 0;
}
a.disabled {
  pointer-events: none;
  cursor: default;
}

textarea {
    height: 110px;
}

ol {
  list-style: none;
  color:darkolivegreen;
  padding: 0;
  margin-left:20px;
}

td{
  padding:0px;
}

/* Css code to override code in icon.css */
ul {
  padding:0;
/*  margin:0 0 20px 0;
  list-style:none;*/
}
ul li {
  padding:0px 0;
/*  padding:5px 0;*/
}
/* end of override of icon.css */

.content-template{
  display:none
}

/* =============================== Estatory Custom Styles =============================== */

/* ===== Bootstrap Overrides ===== */

.modal{               /*inv_distribution.php*/
  position: absolute;
  margin-top:100px;
  background: rgba(0,0,0,0.5);
}

[data-toggle="collapse"] .fas:before { /*used with script.js for tooltips*/
    position: relative;
    color:white;
    content: "\f331";
    z-index: 3;
}
[data-toggle="collapse"].collapsed .fas:before { /*used with script.js for tooltips*/
    position: relative;
    color: white;
    content: "\f32d";
    z-index: 3;
}
tr td{
  padding: 0 !important;
  margin: 0 !important;
}
.trusted_access{
  position: absolute;
  margin-top: -25px;
}
.card-header .fa {
  transition: .3s transform ease-in-out;
}
.card-header .collapsed .fa {
  transform: rotate(90deg);
}
.btn:focus,.btn:active {
    outline: none !important;
    box-shadow: none;
}
.btn-primary {
    background-color: #00303f;
    border-color: #00303f;
}
.btn-primary:hover {
    color: #ffffff;
    background-color: #669900;
    border-color: #669900;
}
.nav-pills a{                             /*Bootstrap override*/ /*Pill buttons on pages/features page*/
  background-color: #016382;
}
 .nav-pills a.active {                    /*Bootstrap override*/ /*Active Pill button on pages/features page*/
  background-color: #227aa2 !important;
}
.embed-responsive{                        /*Bootstrap override*/ /*iframes for Inventory Assign Column - pages/inventory.php*/
  position: relative;
  height: auto;
}
.modal-header{                            /*Bootstrap override*/
  background: #2193b0;  /* fallback for old browsers */
  background: -webkit-linear-gradient(to bottom, #6dd5ed, #2193b0);  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to bottom, #6dd5ed, #2193b0); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  color: #000000;
  text-align: center;
}
.card-header{ /*Needed to keep the error popup on top of the iframe header and body*/
  position: relative;
  z-index: 1;
}
.form-control{
  color: #000000;
}
.input-group{
  z-index: 1;
}
.navbar-toggler{ /* removes border from hamburger bars */
  border:none;
}

/* ===== Id for Floating Div ===== */

#container-floating {
  position: fixed;
  width: 150px;
  right: 22px;
  top: 150px;
  z-index: 100;
}
#modal-floating {
  position: fixed;
  z-index: 120;
}
/* ==== Containers ==== */

.xx-container{
  margin-top: -1.5rem;
  margin-right: 2px;
  margin-left: 2px; /*WJC03*/
}
.xx-container_1{
  height: 56.5rem;
  margin-top: -1.5rem;
  padding: 0;
}
.xx-container_2{
  height:65vh;
}
.xx-container_3{
  height: 75vh;
  margin-top: 30px;
}
.xx-container_4{
  height: 80.7vh;
  padding: 0;
}
.xx-container_5{
  height:81.4vh;
  margin-top: -1.5rem;
  padding: 0;
  margin-left: 17px;
  margin-right: 17px;
}
.xx-container_6{
  position: absolute;
  margin-top: 195px;
  border-width:6px !important;
  z-index: 100;
}
.xx-container_7{
  height:80.7vh;
  overflow: hidden;
}
.xx-container_8{
  height:75vh;
}
.xx-container_9{
  height:50vh;
}
.xx-container_10{
  margin-top: -1.5rem;
  height:81.4vh;
  padding: 0;
}

/* ===== Table ===== */

.xx-table_75{
  width:75%;
}
.xx-table_90{
  width:90%;
}
.xx-table_100{
  width:100%;
}
.xx-table_125{
    width:120rem;
}
.xx-table_wd{
  width:1450px;
}
.xx-table_wd1{
  width:1495px;
}
.xx-table_wd2{
  width:1370px;
}

.table > thead > tr > th,
.table > tbody > tr > th,
.table > tfoot > tr > th,
.table > thead > tr > td,
.table > tbody > tr > td,
.table > tfoot > tr > td {
  padding: 1px;
  line-height: 1.42857143;
  vertical-align: inherit;
  border: 0;
}
.row_spacing {
    border-top: 1em;
}

/* ===== Card Css ===== */

.xx-card_1{  /*Card Text overlay height for Sidebar Menu and Vault Access*/
  margin-top: 115px;
}
.xx-card_2{
  margin-top: 4rem;
}
.xx-card_3{
  height: 68.3vh;
  border: 0;
  margin-bottom: 5px;
}
.xx-card_4{
  height: 69.3vh;
  border-top: 0;
}
.xx-card_5{
  height: 17.5vh;
  border-top: 0;
}
.xx-card_6{
  height: 69.3vh;
  border-top: 0;
}
.xx-card_7{
  height: 45vh;
}
.xx-card_menu{
  height:80.7vh;
  border-top: 0;
}
.xx-card-box_register{
  position: relative;
  margin-top: 4vh;
  border: 0;
}
.xx-card_iframe{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.xx-card_login{
  position: relative;
  margin-top: 4vh;  /* 40px; */
  border: 0;
}
.xx-card_register{
  position: relative;
  margin-top: 4vh;  /* 40px; */
  border: 0;
}
.xx-card_msg{
  position: absolute;
  text-align: left;
  padding: 3px;
  margin-top:-7px;
  margin-left:-12px;
}
.xx-card1_msg1{
  margin-top: -10px;
  margin-left: -25px;
}
.xx-card_msg2{
  position: absolute;
  text-align: left;
  padding: 3px;
  margin-top: -8px;
  margin-left: -13px;
}
.xx-card_msg3{
  position: absolute;
  margin-left: -14px;
  margin-top: -11px;
  padding: 4px;
  z-index: 20;
}

.xx-card_Menu{
  margin-top: 11.5rem;
}


/* ===== Headers ===== */

.xx-btn_header{
  position: absolute;
  border: 0;
  background-color: transparent;
  margin-left: -1rem;
}
.xx-header{ /* For all Headers but include in class: xx-ht_8vh for iframe and xx-ht_9vh for all other headers*/
  position: relative;
  background: #01607d;  /* fallback for old browsers */
  background: -webkit-linear-gradient(to top, #01607d, #00d2ff);  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to top, #01607d, #00d2ff);          /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  color: #000000;
  text-align: center;
  z-index: 2;
  border: 0;
}
.xx-ht_9vh {
  height: 9rem ;
}
.xx-ht_8vh {
  height: 8rem ;
}

.xx-header_msg{ /*headers in general for message windows*/
    background: #01607d;  /* fallback for old browsers */
    background: -webkit-linear-gradient(to top, #6dd5ed, #2193b0);  /* Chrome 10-25, Safari 5.1-6 */
    background: linear-gradient(to top, #6dd5ed, #2193b0);          /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}


 /* ===== Navbar ===== */

.xx-navbar{ /* header.php */
  height: 9.5vh;
}
.xx-thumb { /* report_inv_audit.php */
  height: 6.5vh;
}

/* ===== Cursor ===== */

.xx-disable:hover {
  cursor:not-allowed ;
}
.default {
  cursor: default;
}

/* ===== Standard CSS Objects ===== */

.xx-std_lbl{
  color:#016382;             /* #016382; #006699; */
  font-size:1.2rem;
}
.xx-std_fld{
  color:#000000;       /* #262626; */
  font-size:1.2rem;
}
.xx-std_ol{
  border-color: #c0c0c0;
}
.xx-success_ol{
  border-color:#339900;
}
.xx-success_fld{
  color: #339900;
}
.xx-success_lbl{
  color: #339900;
  font-weight: bold;
}
.xx-caution_ol{
  border-color: #ffcc00;
}
.xx-caution_fld{
  color: #ff9900;
  /*text-shadow: 1px 1px #000000;*/
}
.xx-caution_lbl{
  color: #ff9900;
  font-weight: bold;
}
.xx-danger_ol{
  border-color:red;
}
.xx-danger_fld{
  color:red;
}
.xx-danger_lbl{
  color:red;
  font-weight: bold;
}
/* *** Error Messages */
.xx-std_msg{                            /*Custom*/ /*Default message font size*/
    font-size: 12px;
}
.xx-success_msg{                        /*Custom*/ /*Success message color & font*/
    font-size: 12px;
    color: green;
}
.xx-caution_msg{                        /*Custom*/ /*Caution message color & font*/
    font-size: 12px;
    color: orange;
}
.xx-danger_msg{                         /*Custom*/ /*Error message color & font*/
    font-size: 12px;
    color: red;
}
/* ===== Font Sizes ===== */
.xx-fs1 {                               /*spacer for print function*/
  font-size: .4rem ;
}
.xx-fs4 {
  font-size: .4rem ;
}
.xx-fs6 {
  font-size: .6rem ;
}
.xx-fs8 {
  font-size: .8rem ;
}
.xx-fs9 {
  font-size: .9rem ;
}
.xx-fs10 {
  font-size: 1.0rem ;
}
.xx-fs11 {
  font-size: 1.15rem ;
}
.xx-fs12 {
  font-size: 1.2rem ;
}
.xx-fs14 {
  font-size: 1.4rem ;
}
.xx-fs16 {
  font-size: 1.6rem ;
}
.xx-fs18 {
  font-size: 1.8rem ;
}
.xx-fs20 {
  font-size: 2rem ;
}
.xx-fs22 {
  font-size: 2.2rem ;
}
.xx-fs24 {
  font-size: 2.4rem ;
}
.xx-fs33 {
  font-size: 3.3rem ;
}
.xx-fs36 {
  font-size: 3.6rem ;
}
.xx-semi {
  font-weight: 600;
}
.xx-semi_400 {
  font-weight: 400;
}
.xx-semi_bold {
  font-weight: 600;
}
.xx-bold {
  font-weight: bold ;
}
.xx-invert:hover{
  filter: invert(100%);
  -webkit-filter: invert(100%);
}
.xx-invert_white:hover{
  font-weight: bold;
  color: #ffffff;
}
.xx-invert_black:hover{
  font-weight: bold;
  color: #000000;
}
.xx-invert_50:hover{
  filter: invert(50%);
  -webkit-filter: invert(50%);
}

/* ===== Font Colors ===== */

.xx-fc_primary {
  color: #016382 ;  /* Estatory default color */
}
.xx-fc_primary1 {
  color: #00303f ;  /* Estatory default color dark */
}
.xx-fc_black {
  color: #000000 ;
}
.xx-fc_white {
  color: #ffffff ;
}
.xx-fc_red {
  color: red ;
}
.xx-fc_danger{
    color:red;
}
.xx-fc_blue {
  color: blue ;
}
.xx-fc_lightblue {
  color: #00a6cb ;
}
.xx-fc_darkblue {
  color: #00303f;
}
.xx-fc_green {
  color: #339900 ;
}
.xx-fc_darkgreen {
  color: #006400 ;
}
.xx-fc_limegreen {
  color: #00ff00 ;
}
.xx-fc_yellow {
  color: #ffcc00 ;
}
.xx-fc_darkgrey {
  color: #303030 ;
}
.xx-fc_grey {
  color: #808080 ;
}
.xx-fc_lightgrey {
  color: #e0e0e0 ; /* #d3d3d3 light as well */
}
.xx-fc_beige {
  color: #d7c7b0 ;
}
.xx-fc_darkbeige {
  color: #c6b090 ;
}

/* ===== Specialty Font Colors ===== */

.xx-success_msg{
  font-size: 1.2rem;
  color: #339900;
}
.xx-fc_success{
    color: #339900;
}
.xx-fc_caution {
  color: #ff9900 ;
  /*text-shadow: 1px 1px #000000;*/
}
.xx-fc_danger {
  color: red ;
}
.xx-fc_gold {
  color: #daa520 ;
}
.xx-fc_trans {
  color: transparent ;
}

/* ==== Font Awesome ==== */

.xx-icon_size {
  font-size: 1.5rem ;
}

/* ===== Background Colors ===== */

.xx-bg_primary {
  background-color: #016382 ;  /* Estatory default color */
}

.xx-bg_black {
  background-color: #000000 ;
}
.xx-bg_white {
  background-color: #ffffff ;
}
.xx-bg_red {
  background-color: red ;
}
.xx-bg_blue {
  background-color: blue ;
}
.xx-bg_lightblue {
  background-color: #00a6cb ;
}
.xx-bg_lightblue1 {
  background-color: #cff4fb;
}
.xx-bg_green {
  background-color: #339900 ;
}
.xx-bg_lightgreen {
  background-color: #98fb98 ;
}
.xx-bg_darkgreen {
  background-color: #006400 ;
}
.xx-bg_limegreen {
  background-color: #00ff00 ;
}
.xx-bg_yellow {
  background-color: #ffcc00 ;
}
.xx-bg_darkgrey {
  background-color: #303030 ;
}
.xx-bg_grey {
  background-color: #808080 ;
}
.xx-bg_lightgrey {
  background-color:  #e0e0e0 ;
}
.xx-bg_lightgrey1 {
  background-color: #F0F0F0 ;
}
.xx-bg_lightgrey2 {
  background-color: #F8F8F8 ;
}
.xx-bg_darkbeige {
  background-color: #c6b090 ;
}
.xx-bg_beige {
  background-color: #d7c7b0 ;
}
.xx-bg_couple {
  background-color: #e7ded1 ;
}
.xx-bg_family {
  background-color: #e7ded1 ;
}
.xx-bg_lightbeige {
  background-color: #e7ded1 ;
}
.xx-bg_lightblue1 {
  background-color: #cff4fb;
}

/* ===== Specialty Background Colors ===== */
.xx-bg_9 {
  opacity: 0.9 ;
}
.xx-bg_5 {
  opacity: 0.5 ;
}
.xx-bg_caution {
  background-color: #ff9900 ;
}
.xx-bg_danger {
  background-color: red ;
}
.xx-bg_trans {
  background-color: transparent ;  /* no color - no fill */
}
.xx-bg_grad_blue {
  background-color: #cff4fb;
  background-image: linear-gradient(290deg, #cff4fb 0%, #ffffff 100%);
}
.xx-bg_grad_beige {
  background-color: #e7ded1;
  background-image: linear-gradient(290deg, #e7ded1 0%, #ffffff 100%);
}
 /* Pricing Page Header Colors */
.xx-bg_bron {
  background-color: #cd7f32;
}
.xx-bg_silv {
  background-color: #c0c0c0;
}
.xx-bg_gold {
  background-color: #daa520;
}
.xx-bg_plati {
  background-color: #e5e4e2;
}
.xx-bg_tita {
  background-color: #878681;
}

/* ===== Positions & Misc ===== */
a.anchor { /*this anchor class moves the href #target <a> tag position down 100 px (offsets the 90px for header*/
  display: block;
  position: relative;
  top: -100px;
  visibility: hidden;
}
.header, .header-space,
.footer, .footer-space {
  height: 100px;
}
.header {
  position: fixed;
  top: 0;
}
.footer {
  position: fixed;
  bottom: 0;
}

.xx-p_abs{
  position: absolute;
}
.xx-p_fix{
  position: fixed;
}
.xx-p_rel{
  position: relative;
}
.xx-circle_x{
  color:#000000;
  margin-top: -5px;
  margin-right: -9px;
  float:right;
}
.xx-circle_x1{
    color:#000000;
    margin-top:-10px;
    margin-right:-15px;
    float:right;
}
.xx-circle_x:hover{
    color:#ffffff;
}
.xx-circle_x1:hover{
    filter: invert(100%);
    -webkit-filter: invert(100%);
}
.xx-percent_box{
  font-size: 1.2rem;
  margin-top: 2px;
  padding: 1px 1px 1px 1px;
  text-align: center;
}
.truncate { /* truncate text */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 1rem;
}
.xx-truncate{ /* truncate text */
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right: 1rem;
}
.xx-normal {
  white-space: normal;
}
.xx-wrap_text{
  word-wrap: break-word;
}
.xx-max_width_50{
  max-width: 50%;
}
.xx-max_width_100{
  max-width: 100%;
}
.flex {
  display: flex;
}
.xx-required{
  font-size:12px;
  color:grey;
  margin-top:8px;
  margin-bottom:5px;
  margin-left: 2px;
}
.xx-btn_group{
  margin-bottom:10px;
  margin-right:5px;
}
.pointer {
  cursor: pointer;
}
.disabled {
  cursor: not-allowed;
}
.img {
  height: auto;
  width: 100%;
}
.img_size{
  height:68vh;
  overflow: hidden;
}
.image_params{
  height: 400px;
  width: auto;
}
.xx-nav_pl {
  padding-left: 27rem;
}
.xx-nav_pl1 {
  padding-left: 20.5rem;
}

/****** Dragable guide for help ******/
#help {
  position: absolute;
  z-index: 9;
  background-color: #f1f1f1;
  border: 1px solid #d3d3d3;
  text-align: center;
}

#helpheader {
  padding: 1px;
  cursor: move;
  z-index: 10;
  color: #ffffff;
}
/****** End of dragable div for help ******/


/* ===== Border Colors ===== */

.xx-border_primary {
  border-color: #016382 ;
}
.xx-border_black {
  border-color: #000000 ;
}
.xx-border_yellow {
  border-color: #ffcc00 ;
}
.xx-border_greydark {
  border-color: #303030 ;
}
.xx-border_grey {
  border-color: #808080 ;
}
.xx-border_lightgrey{
  border-color: #c0c0c0;
}
.xx-border_green {
  border-color: #339900 ;
}
.xx-border_success{
    border-color:#339900;
}
.xx-border_caution{
    border-color: #ff9900  ;
}
.xx-border_danger{
  border-color: red ;
}
.xx-border_limegreen {
  border-color: #00ff00 ;
}
.xx-border_darkbeige {
  border-color: #c6b090 ;
}
.xx-border_lightblue1 {
   border-color: #cff4fb;
}
.xx-border_grad_beige {
  border-image: linear-gradient(290deg, #ffffff 25%, #d7c7b0 100%) 1;
}
.xx-border_grad_darkbeige {
  border-image: linear-gradient(290deg, #ffffff 25%, #c6b090 100%) 1;
}

/* ===== Border Thickness addon to Bootstrap CSS ===== */

.xb-border-top-2{
  border-top-width: medium ;
}
.xb-border-top-3{
  border-top-width: thick ;
}
.xb-border-bottom-2{
  border-bottom-width: medium ;
}

/* ===== Width ===== */

.xx-width_2pt5 {
  width: 2.5rem ;
}
.xx-max_width_2pt5 {
  max-width: 2.5rem ;
}
.xx-max_width_2pt5x {
  width: 2.5rem ;
  max-width: 2.5rem ;
}
/* --- */
.xx-width_3 {
  width: 3rem ;
}
.xx-max_width_3 {
  max-width: 3rem ;
}
.xx-max_width_3x {
  width: 3rem ;
  max-width: 3rem ;
}
/* --- */
.xx-width_4 {
  width: 4rem ;
}
.xx-max_width_4 {
  max-width: 4rem ;
}
.xx-max_width_4x {
  width: 4rem ;
  max-width: 4rem ;
}
/* --- */
.xx-width_5 {
  width: 5rem ;
}
.xx-max_width_5 {
  max-width: 5rem ;
}
.xx-max_width_5x {
  width: 5rem ;
  max-width: 5rem ;
}
/* --- */
.xx-width_6 {
  width: 6rem ;
}
.xx-max_width_6 {
  max-width: 6rem ;
}
.xx-max_width_6x {
  width: 6rem ;
  max-width: 6rem ;
}
/* --- */
.xx-width_7 {
  width: 7rem ;
}
.xx-max_width_7 {
  max-width: 7rem ;
}
.xx-max_width_7x {
  width: 7rem ;
  max-width: 7rem ;
}
/* --- */
.xx-width_8 {
  width: 8rem ;
}
.xx-max_width_8 {
  max-width: 8rem ;
}
.xx-max_width_8x {
  width: 8rem ;
  max-width: 8rem ;
}
/* --- */
.xx-width_9 {
  width: 9rem ;
}
.xx-max_width_9 {
  max-width: 9rem ;
}
.xx-max_width_9x {
  width: 9rem ;
  max-width: 9rem ;
}
/* --- */
.xx-width_10 {
  width: 10rem ;
}
.xx-max_width_10 {
  max-width: 10rem ;
}
.xx-max_width_10x {
  width: 10rem ;
  max-width: 10rem ;
}
/* --- */
.xx-width_12 {
  width: 12rem ;
}
.xx-max_width_12 {
  max-width: 12rem ;
}
.xx-max_width_12x {
  width: 12rem ;
  max-width: 12rem ;
}
/* --- */
.xx-width_14 {
  width: 14rem ;
}
.xx-max_width_14 {
 max-width: 14rem ;
}
.xx-max_width_14x {
  width: 14rem ;
  max-width: 14rem ;
}
/* --- */
.xx-width_15 {
  width: 15rem ;
}
.xx-max_width_15 {
 max-width: 15rem ;
}
.xx-max_width_15x {
  width: 15rem ;
  max-width: 15rem ;
}
/* --- */
.xx-width_15pt5 {
  width: 15.5rem ;
}
.xx-max_width_15pt5 {
 max-width: 15.5rem ;
}
.xx-max_width_15pt5x {
  width: 15.5rem ;
  max-width: 15.5rem ;
}
/* --- */
.xx-width_16 {
  width: 16rem ;
}
.xx-max_width_16 {
  max-width: 16rem ;
}
.xx-max_width_16x {
  width: 16rem ;
  max-width: 16rem ;
}
/* --- */
.xx-width_17 {
  width: 17rem ;
}
.xx-width_17pt5 {
  width: 17.5rem ;
}
.xx-max_width_17 {
  max-width: 17rem ;
}
.xx-max_width_17x {
  width: 17rem ;
  max-width: 17rem ;
}
/* --- */
.xx-width_18 {
  width: 18rem ;
}
.xx-max_width_18 {
  max-width: 18rem ;
}
.xx-max_width_18x {
  width: 18rem ;
  max-width: 18rem ;
}
/* --- */
.xx-width_19 {
  width: 19rem ;
}
.xx-width_19pt5 {
  width: 19.5rem ;
}
.xx-max_width_19 {
  max-width: 19rem ;
}
.xx-max_width_19x {
  width: 19rem ;
  max-width: 19rem ;
}
/* --- */
.xx-width_20 {
  width: 20rem ;
}
.xx-max_width_20 {
  max-width: 20rem ;
}
.xx-max_width_20x {
  width: 20rem ;
  max-width: 20rem ;
}
/* --- */
.xx-width_21 {
  width: 21rem ;
}
.xx-max_width_21 {
  max-width: 21rem ;
}
.xx-max_width_21x {
  width: 21rem ;
  max-width: 21rem ;
}
/* --- */
.xx-width_22 {
  width: 22rem ;
}
.xx-max_width_22 {
  max-width: 22rem ;
}
.xx-max_width_22x {
  width: 22rem ;
  max-width: 22rem ;
}
/* --- */
.xx-width_23 {
  width: 23rem ;
}
.xx-max_width_23 {
  max-width: 23rem ;
}
.xx-max_width_23x {
  width: 23rem ;
  max-width: 23rem ;
}
/* --- */
.xx-width_24 {
  width: 24rem ;
}
.xx-max_width_24 {
  max-width: 24rem ;
}
.xx-max_width_24x {
  width: 24rem ;
  max-width: 24rem ;
}
/* --- */
.xx-width_27pt5 {
  width: 27.5rem ;
}
.xx-max_width_27pt5 {
  max-width: 27.5rem ;
}
.xx-max_width_27pt5x {
  width: 27.5rem ;
  max-width: 27.5rem ;
}
/* --- */
.xx-width_28 {
  width: 28rem ;
}
.xx-max_width_28 {
  max-width: 28rem ;
}
.xx-max_width_28x {
  width: 28rem ;
  max-width: 28rem ;
}
/* --- */
.xx-width_30 {
  width: 30rem ;
  overflow: hidden;
}
.xx-max_width_30 {
  max-width: 30rem ;
}
.xx-max_width_30x {
  width: 30rem ;
  max-width: 30rem ;
}
/* --- */
.xx-width_32 {
  width: 32rem ;
}
.xx-max_width_32 {
  max-width: 32rem ;
}
.xx-max_width_32x {
  width: 32rem ;
  max-width: 32rem ;
}
/* --- */
.xx-width_34 {
  width: 34rem ;
}
.xx-max_width_34 {
  max-width: 34rem ;
}
.xx-max_width_34x {
  width: 34rem ;
  max-width: 34rem ;
}
/* --- */
.xx-width_36 {
  width: 36rem ;
}
.xx-max_width_36 {
  max-width: 36rem ;
}
.xx-max_width_36x {
  width: 36rem ;
  max-width: 36rem ;
}
/* --- */
.xx-width_37 {
  width: 37rem ;
}
.xx-max_width_37 {
  max-width: 37rem ;
}
.xx-max_width_37x {
  width: 37rem ;
  max-width: 37rem ;
}
/* --- */
.xx-width_38 {
  width: 38rem ;
}
.xx-max_width_38 {
  max-width: 38rem ;
}
.xx-max_width_38x {
  width: 38rem ;
  max-width: 38rem ;
}
/* --- */
.xx-width_39 {
  width: 39rem ;
}
.xx-max_width_39 {
  max-width: 39rem ;
}
.xx-max_width_39x {
  width: 39rem ;
  max-width: 39rem ;
}
/* --- */
.xx-width_40 {
  width: 40rem ;
}
.xx-max_width_40 {
  max-width: 40rem ;
}
.xx-max_width_40x {
  width: 40rem ;
  max-width: 40rem ;
}
/* --- */
.xx-width_40pt5 {
  width: 40.5rem ;
}
/* --- */
.xx-width_41 {
  width: 41rem ;
}
.xx-max_width_41 {
  max-width: 41rem ;
}
.xx-max_width_41x {
  width: 41rem ;
  max-width: 41rem ;
}
/* --- */
.xx-width_52 {
  width: 52rem ;
}
.xx-max_width_52 {
  max-width: 52rem ;
}
.xx-max_width_52x {
  width: 52rem ;
  max-width: 52rem ;
}
/* --- */
.xx-width_52 {
  width: 52rem ;
}
.xx-max_width_52 {
  max-width: 52rem ;
}
.xx-max_width_52x {
  width: 52rem ;
  max-width: 52rem ;
}
/* --- */
.xx-width_68 {
  width: 68rem ;
}
.xx-max_width_68 {
  max-width: 68rem ;
}
.xx-max_width_68x {
  width: 68rem ;
  max-width: 68rem ;
}
/* --- */
.xx-width_75 {
  width: 75rem ;
}
.xx-max_width_75 {
  max-width: 75rem ;
}
.xx-max_width_75x {
  width: 75rem ;
  max-width: 75rem ;
}
/* --- */
.xx-width_120 {
  width: 120rem ;
}
.xx-max_width_120 {
  max-width: 120rem ;
}
.xx-max_width_120x {
  width: 120rem ;
  max-width: 120rem ;
}
.xx-width_dp { /*width for distribution plan*/
  width: 130rem ;
}
/* ========== */
.xx-logo_width{
  width: 200px ;
  height: auto;
}
.xx-logo_width1{
  width: 253px ;
  height:auto;
}
.xx-width_modal1{
  width: 625px;
  max-width: 100%;
}
.xx-width_1000x{
  width: 1000px;
  max-width: 100%;
}

/* ===== Dropdown ===== */

.xx-width_dropdown{
   width: 30rem !important;
}
.xx-w_dropdown_1{
   width: 150px !important;
/* height: 400px !important;*/
}
.xx-dropdown_icon{
    margin-top: .6rem;
}
.dropdown-item:hover{ /*bootstrap override*/
    background-color:lightblue;
}

/* ===== Margin Left ===== */

.xx-ml_pt3{
  margin-left: 0.3rem ;
}
.xx-ml_1{
  margin-left: 1rem ;
}
.xx-ml_2{
  margin-left: 2rem ;
}
.xx-ml_3{
  margin-left: 3rem ;
}
.xx-ml_3pt5{
  margin-left: 3.5rem ;
}
.xx-ml_4{
  margin-left: 4rem ;
}
.xx-ml_5{
  margin-left: 5rem ;
}
.xx-ml_6{
  margin-left: 6rem ;
}
.xx-ml_7{
  margin-left: 7rem ;
}
.xx-ml_8{
  margin-left: 8rem ;
}
.xx-ml_9{
  margin-left: 9rem ;
}
.xx-ml_10{
  margin-left: 10rem ;
}
.xx-ml_12{
  margin-left: 12rem ;
}
.xx-ml_12pt5{
  margin-left: 12.5rem ;
}
.xx-ml_14{
  margin-left: 14rem ;
}
.xx-ml_15{
  margin-left: 15rem ;
}
.xx-ml_16{
  margin-left: 16rem ;
}
.xx-ml_18{
  margin-left: 18rem ;
}
.xx-ml_20{
  margin-left: 20rem ;
}
.xx-ml_24{
  margin-left: 24rem ;
}
.xx-ml_28{
  margin-left: 28rem ;
}
.xx-ml_30{
  margin-left: 30rem ;
}
.xx-ml_33{
  margin-left: 33rem ;
}
.xx-ml_36{
  margin-left: 36rem ;
}
.xx-ml_41{
  margin-left: 41rem ;
}
.xx-ml_48{
  margin-left: 48rem ;
}
.xx-ml_-pt3{
  margin-left: -0.3rem ;
}
.xx-ml_-pt5{
  margin-left: -0.5rem ;
}
.xx-ml_-pt6{
  margin-left: -0.6rem ;
}
.xx-ml_-pt7{
  margin-left: -0.7rem ;
}
.xx-ml_-pt8{
  margin-left: -0.8rem ;
}
.xx-ml_-1{
  margin-left: -1.0rem ;
}
.xx-ml_-1pt1{
  margin-left: -1.1rem ;
}
.xx-ml_-1pt2{
  margin-left: -1.2rem ;
}
.xx-ml_-1pt3{
  margin-left: -1.3rem ;
}
.xx-ml_-1pt5{
  margin-left: -1.5rem ;
}
.xx-ml_-1pt6{
  margin-left: -1.6rem ;
}
.xx-ml_-1pt7{
  margin-left: -1.7rem ;
}
.xx-ml_-2{
  margin-left: -2rem ;
}
.xx-ml_-2pt5{
  margin-left: -2.5rem ;
}
.xx-ml_-3{
  margin-left: -3rem ;
}
.xx-ml_-4{
  margin-left: -4rem ;
}
.xx-ml_-5{
  margin-left: -5rem ;
}
.xx-ml_-6{
  margin-left: -6rem ;
}
.xx-ml_-7{
  margin-left: -7rem ;
}
.xx-ml_-8{
  margin-left: -8rem ;
}
.xx-ml_-8pt5{
  margin-left: -8.5rem ;
}
.xx-ml_-9{
  margin-left: -9rem ;
}
.xx-ml_-9pt5{
  margin-left: -9.5rem ;
}
.xx-ml_-10{
  margin-left: -10rem ;
}
.xx-ml_-10pt5{
  margin-left: -10.5rem ;
}
.xx-ml_-11{
  margin-left: -11rem ;
}
/*WJC01*/
.xx-ml_-281{
  margin-left: -281rem ;
}

/* ===== Margin Right ===== */

.xx-mr_2{
  margin-right: 2rem;
}
.xx-mr_4 {
  margin-right: 4rem;
}
.xx-mr_dp {
  margin-right: 1rem;
}

/* ===== Padding ===== */

/*Register Report indents for distribution*/
.xx-indent0{
  padding-left: 1rem;
}
.xx-indent1{
  padding-left: 3rem;
}
.xx-indent2{
  padding-left: 5rem;
}
.xx-indent3{
  padding-left: 7rem;
}
.xx-indent4{
  padding-left: 9rem;
}
.xx-indent5{
  padding-left: 11rem;
}
/*End indents for distribution*/
.xx-pl_3{
  padding-left: 3rem;
}
.xx-pl_5{
  padding-left: 5rem;
}
.xx-pl_7{
  padding-left: 7rem;
}
.xx-pl_9{
  padding-left: 9rem;
}
.xx-pt_6 {
  padding-top: 46px;
}
.xx-pt_header {
  padding-top: 46px;
}

/* ===== Margin Top ===== */

.xx-align_top {
  vertical-align:top
}
.xx-mt_pt1{
  margin-top: 0.1rem ;
}
.xx-mt_pt2{
  margin-top: 0.2rem ;
}
.xx-mt_1 {
  margin-top: 1rem ;
}
.xx-mt_1pt9 {
  margin-top: 1.9rem ;
}
.xx-mt_2 {
  margin-top: 3rem ;
}
.xx-mt_2pt5 {
  margin-top: 2.5rem ;
}
.xx-mt_4 {
  margin-top: 4rem ;
}
.xx-mt_4pt2 {
  margin-top: 4.2rem ;
}
.xx-mt_4pt9 {
  margin-top: 4.9rem ;
}
.xx-mt_5 {
  margin-top: 5rem ;
}
.xx-mt_6 {
  margin-top: 6rem ;
}
.xx-mt_7 {
  margin-top: 7rem ;
}
.xx-mt_8 {
  margin-top: 8rem ;
}
.xx-mt_9 {
  margin-top: 9rem ;
}
.xx-mt_10 {
  margin-top: 10rem ;
}
.xx-mt_12 {
  margin-top: 12rem ;
}
.xx-mt_32 {
  margin-top: 32rem ;
}

/*Margin Top Minus*/
.xx-mt_-pt1{
  margin-top: -0.1rem ;
}
.xx-mt_-pt2{
  margin-top: -0.2rem ;
}
.xx-mt_-pt3{
  margin-top: -0.3rem ;
}
.xx-mt_-pt4{
  margin-top: -0.4rem ;
}
.xx-mt_-pt5{
  margin-top: -0.5rem ;
}
.xx-mt_-pt7{
  margin-top: -0.7rem ;
}
.xx-mt_-pt8{
  margin-top: -0.8rem ;
}
.xx-mt_-pt9{
  margin-top: -0.9rem ;
}
.xx-mt_-1 {
  margin-top: -1rem ;
}
.xx-mt_-1pt1 {
  margin-top: -1.1rem ;
}
.xx-mt_-1pt2 {
  margin-top: -1.2rem ;
}
.xx-mt_-1pt3 {
  margin-top: -1.3rem ;
}
.xx-mt_-1pt4 {
  margin-top: -1.4rem ;
}
.xx-mt_-1pt5 {
  margin-top: -1.5rem ;
}
.xx-mt_-1pt6 {
  margin-top: -1.6rem ;
}
.xx-mt_-1pt7 {
  margin-top: -1.7rem ;
}
.xx-mt_-1pt9 {
  margin-top: -1.9rem ;
}
.xx-mt_-2 {
  margin-top: -2rem ;
}
.xx-mt_-2pt5 {
  margin-top: -2.5rem ;
}
.xx-mt_-2pt7 {
  margin-top: -2.7rem ;
}
.xx-mt_-3 {
  margin-top: -3rem ;
}
.xx-mt_-3pt5 {
  margin-top: -3.5rem ;
}
.xx-mt_-4 {
  margin-top: -4rem ;
}
.xx-mt_-6 { /* moves div up 60px (replacing navbar spacing 60px) */
  margin-top: -6rem ;
}
.xx-mt_-9 { /* moves div up 90px (replacing navbar spacing 90px) */
  margin-top: -9rem ;
}
.xx-mt_-12 {
  margin-top: -12rem ;
}

/* ===== Margin Bottom ===== */

.xx-mb_60{
  margin-bottom: 60rem ;
}

/* ===== Height ===== */

.xx-ht_1pt5 {
  height: 1.5rem ;
}
.xx-ht_2pt5 {
  height: 2.5rem ;
}
.xx-ht_5 {
  height: 5rem ;
}
.xx-ht_5pt7 {
  height: 5.7rem ;
}
.xx-ht_6 {
  height: 6rem ;
}
.xx-ht_7pt5 {
  height: 7.5rem ;
}

/* ===== Custom Positions (align) ===== */

.xx-align_5{
  position: absolute;
  margin-left: -15px;
  margin-top: -1px;
  transform: scale(1.5);
}


/* ==== Line Through ==== */

.xx-line_through{
  color: red;
  text-decoration: line-through ;
}
.xx-text_shadow_white {
  text-shadow: 1px 1px #ffffff ;
}
.xx-text_shadow_black {
  text-shadow: 1px 1px #000000 ;
}
.xx-text_shadow_black2 {
  text-shadow: 3px 3px #000000 ;
}
.xx-text_shadow_grey {
  text-shadow: 1px 1px #808080 ;
}


/* ==== Z-index ==== */
.xx-z_index_0{
  z-index: 0;
}
.xx-z_index-1{
  z-index: -1;
}
.xx-z_index10{
  z-index: 10;
}
.xx-z_index100{
  z-index: 100;
}

/* ==== Font Awesome ==== */

.xx-icon_size {
  font-size: 1.5rem ;
}

/* ==== Scroll Bars ==== */
.xx-scroll_bar {
  overflow: auto;
  overflow-x: hidden; /* WJC04 */
 /* overflow-x: scroll;*/
  padding-right: 1.5rem;
}
.xx-scroll_bar1 {
  /* overflow: auto; */
  overflow-y: scroll;
  overflow-x: hidden;
  padding-right: 1.5rem;
}
.xx-scroll_bar2 {
  overflow: scroll;
  overflow-x: scroll;
  padding-right: 1.5rem;
}
.xx-ht_4vh {
   height: 4vh ;
}
.xx-ht_13vh {
  height: 13vh ;
}
.xx-ht_15vh {
  height: 15vh ;
}
.xx-ht_18vh {
  height: 18vh ;
}
.xx-ht_24vh {
  height: 24vh ;
}
.xx-ht_26vh {
  height: 26.5vh ;
}
.xx-ht_28vh {
  height: 28vh ;
}
.xx-ht_30vh {
  height: 30vh ;
}
.xx-ht_32vh {
  height: 32vh ;
}
.xx-ht_34vh {
  height: 34vh ;
}
.xx-ht_43vh {
  height: 43vh ;
}
.xx-ht_48vh {
  height: 48vh ;
}
.xx-ht_50vh {
  height: 50vh ;
}
.xx-ht_52vh {
  height: 52vh ;
}
.xx-ht_53vh {
  height: 53vh ;
}
.xx-ht_54vh {
  height: 54vh ;
}
.xx-ht_56vh {
  height: 56vh ;
}
.xx-ht_59vh {
  height: 59vh ;
}
.xx-ht_60vh {
  height: 60vh ;
}
.xx-ht_62vh {
  height: 62vh ;
}
.xx-ht_63vh {
  height: 63vh ;
}
.xx-ht_65vh {
  height: 65vh ;
}
.xx-ht_66vh {
  height: 66vh ;
}
.xx-ht_67vh {
  height: 67vh ;
}
.xx-ht_68vh {
  height: 68vh ;
}
.xx-ht_69vh {
  height: 69vh ;
}
.xx-ht_69pt3vh {
  height: 69.3vh ;
}
.xx-ht_74vh {
  height: 74vh ;
}
.xx-ht_80vh {
  height: 80vh ;
}
.xx-ht_85vh {
  height: 85vh ;
}
.xx-ht_custom-vh {
   height: 69.3vh ;
}

/* ==== line height ==== */

.xx-line_height_1 {
  line-height: 1;
}
.xx-line_height_2 {
  line-height: 1.2;
}

/* ==== Vault Switch ==== */
.switch {
  position: relative;
  height: 29px;
  width: 100%;
  background: rgba(0, 0, 0, 0.45);
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
}

.switch-label {
  position: relative;
  z-index: 2;
  float: left;
  width: 50%;
  margin-top: 3px;
  font-size: 1.2rem;
  color: #e0e0e0;
  text-align: center;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);
  cursor: pointer;
}
.switch-label:active {
  font-weight: bold;
}
.switch-input {
  display: none;
}
.switch-input:checked + .switch-label {
  margin-top: 3px;
  font-size: 1.2rem;
  color: #ffcc00;
  text-shadow: 2px 2px #000000 ;
  -webkit-transition-property: color, text-shadow;
  -moz-transition-property: color, text-shadow;
  -ms-transition-property: color, text-shadow;
  -o-transition-property: color, text-shadow;
  transition-property: color, text-shadow;
}
.switch-input:checked + .switch-label-on ~ .switch-selection {
  left: 50%;
  /* Note: left: 50%; doesn't transition in WebKit */
}
.switch-selection {
  position: absolute;
  z-index: 1;
  top: 2px;
  left: 2px;
  display: block;
  width: 49%;
  height: 25px;
  border-radius: 3px;
  background-color: #016382;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
}

/* Start Disabled Switch */
.switch1 {
  position: relative;
  height: 29px;
  width: 100%;
  background: rgba(0, 0, 0, 0.25);
  border-radius: 3px;
  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.3), 0 1px rgba(255, 255, 255, 0.1);
}

.switch1-selection {
  position: absolute;
  z-index: 1;
  top: 2px;
  left: 2px;
  display: block;
  width: 98.5%;
  height: 25px;
  border-radius: 3px;
  background-color: #016382;
  -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.5), 0 0 2px rgba(0, 0, 0, 0.2);
}
.switch1-label {
  position: relative;
  z-index: 2;
  float: left;
  width: 100%;
  margin-top: 3px;
  font-size: 1.2rem;
  color: #ffcc00;
  text-align: center;
  cursor:not-allowed ;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.45);
}
/* end Disabled Switch */

/*@media only screen and (max-width: 1920px) {
  body {
    background: yellow;
  }
}
@media only screen and (max-width: 1440px) {
  body {
    background: green;
  }
}
@media only screen and (max-width: 1366px) {
  body {
    background: blue;
  }
}*/
@media (max-width: 1000px){
  .xx-md_hide { /* removes targeted tag like 'div' for mobile sizing */
    display: none;
  }
}

@media (max-width: 440px){
  body{
    background: #ffffff; /* white background */
  }
  .image_params {
    height: 200px;
    width: auto;
  }
  .xx-nav_pl {
    margin-top: 3.5rem;
    padding-left: 3rem;
    padding-bottom: 2rem;
    border: 2px solid #fff;
  }
  .xx-pt_20 { /* padding for navigation hamburger links */
    padding-top: 20px;
  }
  .xx-fs8 { /* Changes font-size for mobile sizing */
    font-size: 12px;
  }
  .xx-fs10 {
    font-size: 14px;
  }
  .xx-fs16 {
    font-size: 20px;
  }
    .xx-md_show { /* removes targeted tag like 'div' for mobile sizing */
    display: block;
  }
  
  .xx-md_hide { /* removes targeted tag like 'div' for mobile sizing */
    display: none;
  }
}

.top-content {
   width: 100vw;
   height: 100vh;
   position: fixed;
   top: 0;
   left: 0;
}

.top-content .carousel-control-prev {
    border-bottom: 0;
}

.top-content .carousel-control-next {
    border-bottom: 0;
}

.top-content .carousel-caption {
    padding-bottom: 60px;
}

.top-content .carousel-caption h1 {
    padding-top: 60px;
    color: #fff;
}

.top-content .carousel-caption h3 {
    color: #fff;
}

.top-content .carousel-caption .carousel-caption-description {
    color: #fff;
    color: rgba(255, 255, 255, 0.8);
}

.top-content .carousel-indicators li {
    width: 16px;
    height: 16px;
    margin-left: 5px;
    margin-right: 5px;
    border-radius: 50%;
}
/*Password Strength Indicator*/
.progress {
    height: 5px;
}

.text-success{
    color: green;
}

/*.tooltip-inner {
    min-width: 300px;
    max-width: 100%;
    padding-top: 20px;
    padding-bottom: 1px;
    color: #ffffff;
    font-size: 1.2rem;
    position: absolute;
    z-index: 1;
    left: 50%;
    top: -40px;
    transform: translateX(-50%);
}*/

.bg-image {
  background: url("../img/bg.avif");
  background-size: cover;
  min-height: 900px;
  width: auto;
}
.bg-img_booklet {
  background: url("../img/bg.avif");
  background-size: cover;
  min-height: 400px;
  width: auto;
}
.booklet-container {
  margin: 0;
  padding: 0;
}
