/* Colors to change:  
2b3d41 to primary
94caef to secondary
ebece9 tile background - Leave alone unless there is a third color option
*/

@import url('https://fonts.googleapis.com/css2?family=Red+Hat+Display:wght@900&family=Roboto:wght@300;400;500;700&display=swap');}



html,
body {
font-family: 'Roboto', sans-serif; padding-top: 0px;
margin: 0;
  padding: 0;
  width: 100%;
  overflow-x: hidden;
  background-color: transparent;
}

.btn.btn-primary:disabled{
    background-color: #999999;
}
.btn:disabled{
    background-color: #999999;
}

body {font-family: 'Roboto', sans-serif;}
.bg-light { background-color: #f6f6f6!important; }
p { font-family: 'Roboto', sans-serif; font-size: 0.9em; }
p.lead { font-family: 'Roboto', sans-serif; font-size: 1.3em; }
a { text-decoration: none; font-family: 'Roboto', sans-serif; }

ul strong { font-family: 'Roboto', sans-serif; }

.btn-link  { font-size: 1.2em; text-decoration: none; font-family: 'Roboto', sans-serif; }

/* Navbar back color */

.navbar-light .navbar-nav .nav-link { color: #485867; }

.card, .dropdown-menu { background-color: #f6f6f6; border-radius: 0px; }

.form-control { border: 1px solid #cccccc; }
.form-control:focus { border: 1px solid #cccccc; }

/* client video buttons */
.my-span-class:hover {
  background-color: #0a3c61; 
}


/* client portal buttons */

/* Change to primary color */

.btn-custom,
.btn-custom:visited {
  background-color: #2b3d41; /* Main bar with text all */
  border-top: 0px solid #94caef; /* Solid border only at the top */
  color: #ffffff;
  font-family: 'Roboto', sans-serif;
  border-radius: 10px 10px 10px 10px; /* Rounded corners */
  display: flex;
  justify-content: space-between; /* Space between text and icon */
  align-items: center; /* Vertically align icon and text */
  padding: 10px 15px; /* Add padding for alignment */
}

.btn-custom:hover,
.btn-custom:active {
  background-color: #94caef; /* Main bar with text hover all*/
  border-top: 0px solid #2b3d41; /* Solid border on hover/active */
  color: #2b3d41; /* Text Color */
  font-family: 'Roboto', sans-serif;
  border-radius: 10px 10px 10px 10px; /* Rounded corners */
}

/* Change for search and language buttons color */

.btn-success { background-color: #34394c; color: #ffffff; border: 0px solid #0d4b79; }
.btn-outline-success { color: #34394c; background-color: transparent; border: 1px solid #0d4b79; }
.btn-success:hover, .btn-outline-success:hover { background-color: #0a3c61; border-color: #0a3c61; }



/* PORTAL SECTIONS */

/* FIRST TWO BLOCKS */

.block-0 {
background-color: #34394c;
color:#ffffff; 
font-family: 'Roboto', sans-serif; font-size: 0.9em; }

.block-1 {
background-color: #4F5865;
color:#ffffff; 
font-family: 'Roboto', sans-serif; font-size: 0.9em; 
margin-top: 20px; /* Space between button and card */
border-radius: 10px 10px 10px 10px; /* Rounded corners */
}

/* PORTAL SECTIONS */


.block-2 {
background-color: #E4E4E4;
color:#000000; 
font-family: 'Roboto', sans-serif; font-size: 0.9em; }



/* THIRD BLOCK */

.block-4 {
background-color: #323a45; color: #ffffff; 
font-family: 'Roboto', sans-serif; font-size: 0.9em; }



/* MAIN PORTAL BEHIND IMAGES or ICONS all*/

.block-1a {
background-color: #2b3d41;
color:#ffffff; 
font-family: 'Roboto', sans-serif; font-size: 0.9em; 
margin-top: 20px; /* Space between button and card */
border-radius: 10px 10px 10px 10px; /* Rounded corners */
}

.block-3 {
background-color: #ebece9;
color:#ffffff; 
font-family: 'Roboto', sans-serif; font-size: 0.9em; 
margin-top: 20px; /* Space between button and card */
border-radius: 10px 10px 10px 10px; /* Rounded corners */
}



/* BUSINESS ACCORDIAN BLOCK */

.block-5 {
background-color: #f6f6f6; color: #000000; 
font-family: 'Roboto', sans-serif; font-size: 0.9em; }




/* HELP PORTAL 3 buttons bottom left */

.btn-customa, .btn-customa:visited {
    background-color: #34394c; color: #ffffff; border: 0px solid #ffffff;
  border-radius: 0px; font-family: 'Roboto', sans-serif;
}

.btn-customa:hover, .btn-customa:active {
    background-color: #000000; color: #ffffff; border: 0px solid #ffffff;
  border-radius: 0px; font-family: 'Roboto', sans-serif;
}


/* IDENTITY 3 buttons bottom left */

.btn-custom2, .btn-custom2:visited {
    background-color: #34394c; color: #ffffff; border: 0px solid #ffffff;
  border-radius: 0px; font-family: 'Roboto', sans-serif;
}

.btn-custom2:hover, .btn-custom2:active {
    background-color: #ffffff; color: #000000; border: 0px solid #ffffff;
  border-radius: 0px; font-family: 'Roboto', sans-serif;
}




.special {
color: #000000;
  }


/* business accordian */

.myaccordion {
  max-width: 100%;
  margin: 0px auto;
  box-shadow: 0 0 1px rgba(0,0,0,0.1);
border-radius: 0px; 
}

.myaccordion .card,
.myaccordion .card:last-child .card-header {
  border: none;
border-radius: 0px; 
}

.myaccordion .card-header {
  border-bottom-color: #EDEFF0;
  background: transparent;
}

.myaccordion .fa-stack {
  font-size: 18px;
}

.myaccordion .btn {
  width: 100%;
  font-weight: bold;
  color: #68657a;
  padding: 0;
border-radius: 0px; 
}


.sr-only {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}


#collapse1 {
  position: absolute;
  z-index: 1;
width: 93%;
}



#collapse2 {
  position: absolute;
  z-index: 1;
width: 93%;
}



#collapse3 {
  position: absolute;
  z-index: 1;
width: 93%;
}



#collapse4 {
  position: absolute;
  z-index: 1;
width: 90%;
}



#collapse5 {
  position: absolute;
  z-index: 1;
width: 90%;
}



#collapse6 {
  position: absolute;
  z-index: 1;
width: 93%;
}


#collapse7 {
  position: absolute;
  z-index: 1;
width: 93%;
}

#collapse8 {
  position: absolute;
  z-index: 1;
width: 93%;
}

#collapse9 {
  position: absolute;
  z-index: 1;
width: 93%;
}

#collapse10 {
  position: absolute;
  z-index: 1;
width: 93%;
}

#collapse11 {
  position: absolute;
  z-index: 1;
width: 93%;
}

#collapse12 {
  position: absolute;
  z-index: 1;
width: 93%;
}

#collapse13 {
  position: absolute;
  z-index: 1;
width: 93%;
}






@media (max-width: 991.98px) {
  .offcanvas-collapse {
    position: fixed;
    top: 76px; /* Height of navbar */
    bottom: 0;
    left: 100%;
    width: 100%;
    padding-right: 1rem;
    padding-left: 1rem;
    overflow-y: auto;
    visibility: hidden;
    background-color: #ffffff;
    transition: visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
  }
  .offcanvas-collapse.open {
    visibility: visible;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}

.nav-scroller {
  position: relative;
  z-index: 2;
  height: 2.75rem;
  overflow-y: hidden;
}



.greyfoot {
margin-top: 60px; 
padding-top: 20px;
padding-bottom: 20px;
background-color: #f4f4f4;
  }






/* business accordian */

.myaccordion {
  max-width: 100%;
  margin: 0px auto;
  box-shadow: 0 0 1px rgba(0,0,0,0.1);
border-radius: 0px; 
}

.myaccordion .card,
.myaccordion .card:last-child .card-header {
  border: none;
border-radius: 0px; 
}

.myaccordion .card-header {
  border-bottom-color: #EDEFF0;
  background: transparent;
}

.myaccordion .fa-stack {
  font-size: 18px;
}

.myaccordion .btn {
  width: 100%;
  font-weight: bold;
  color: #68657a;
  padding: 0;
border-radius: 0px; 
}



/* Search */


/* Style the search field */
form.example input[type=text] {
  padding: 20px;
  font-size: 27px;
  border: 0px solid grey;
  float: left;
  width: 80%;
  background: #787879;
font-family: 'Roboto', sans-serif;
}

/* Style the submit button */
form.example button {
  float: left;
  width: 20%;
  padding: 20px;
  background: #bbbbbb;
  color: white;
  font-size: 27px;
  border: 0px solid grey;
  border-left: none; /* Prevent double borders */
  cursor: pointer;
font-family: 'Roboto', sans-serif;
}

form.example button:hover {
  background: #787879;
font-family: 'Roboto', sans-serif;
}

/* Clear floats */
form.example::after {
  content: "";
  clear: both;
  display: table;
}



/* Portal Text */

.text-custom1, .text-custom1:visited {
    color: #1a7d41; font-family: 'Roboto', sans-serif;
}

.text-custom1:hover, .text-custom1:active {
    color: #A2AE4C; font-family: 'Roboto', sans-serif;
}

.text-custom2, .text-custom2:visited {
    color: #334957; font-family: 'Roboto', sans-serif;
}

.text-custom2:hover, .text-custom2:active {
    color: #638396; font-family: 'Roboto', sans-serif;
}










.myaccordion .btn-link:hover,
.myaccordion .btn-link:focus {
  text-decoration: none;
}

.myaccordion li + li {
  margin-top: 10px;
}



.pad {
  padding-left: 2rem;
  font-size: 1.1rem;
 font-weight: 600;
  color: #6c757d;
}

.pad2 {
  padding-left: 2rem;
  font-size: 1.1rem;
 font-weight: 600;
  color: #c10708;
}









.modal-dialog-slideout {min-height: 100%; margin: 0 0 0 auto;background: #fff;}
.modal.fade .modal-dialog.modal-dialog-slideout {-webkit-transform: translate(100%,0)scale(1);transform: translate(100%,0)scale(1);}
.modal.fade.show .modal-dialog.modal-dialog-slideout {-webkit-transform: translate(0,0);transform: translate(0,0);display: flex;align-items: stretch;-webkit-box-align: stretch;height: 100%;}
.modal.fade.show .modal-dialog.modal-dialog-slideout .modal-body{overflow-y: auto;overflow-x: hidden;}
.modal-dialog-slideout .modal-content{border: 0;}
.modal-dialog-slideout .modal-header, .modal-dialog-slideout .modal-footer {height: 69px; display: block;} 
.modal-dialog-slideout .modal-header h5 {float:left;}

.modal-header {
   background-color: #f1f1f1; color:#000000; radius:0px; border-radius: 0px;
}



@media (max-width: 991.98px) {
  .offcanvas-collapse {
    position: fixed;
    top: 76px; /* Height of navbar */
    bottom: 0;
    left: 100%;
    width: 100%;
    padding-right: 1rem;
    padding-left: 1rem;
    overflow-y: auto;
    visibility: hidden;
    background-color: #ffffff;
    transition: visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
  }
  .offcanvas-collapse.open {
    visibility: visible;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
  }
}








navbar-nav li{ list-style: none; -webkit-transition: background .3s ease; -ms-transition: background .3s ease; transition: background .3s ease; }
.navbar-nav li.has-sub > a{ position: relative; }
.navbar-nav li.has-sub a:hover{ color: #fff; }
.navbar-nav li a{ display: block; color: #9d9d9d; font-size: 15px; font-weight: 500; }
.navbar-nav > li{ margin-left: 2px; float: left; }
.navbar-nav > li.has-sub{ padding-right: 13px; }
.navbar-nav > li > a{ position: relative; display: block; font-size: 0.9rem; font-weight: 600; padding: 21px 0.5rem; color: #282b2d; letter-spacing: 0.8px;  -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; }
.navbar-nav li.current > a, .navbar-nav li.active > a{ color: #00789d; }
.navbar-nav > li.has-sub > a:hover{ color: #000; }
.navbar > ul > li.has-sub > a:hover:after{ border-color: transparent #00789d #00789d transparent; }
.navbar > ul > li.has-sub > a:after{ position: absolute; top: 28px; right: -8px; content: ""; border-color: transparent #282b2d #282b2d transparent; border-style: solid; border-width: 0 1px 1px 0; display: block; height: 6px; transform: rotate(45deg); transition: border 0.3s ease 0s; width: 6px; }
.navbar > ul > li.current > a:after{ border-color: transparent #00789d #00789d transparent; }


.navbar-nav ul{ position: absolute; left: -9999px; }
.navbar ul ul li{ -webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all .25s ease; margin-bottom: 12px; padding: 0 20px; }
.navbar ul ul li:last-child{ margin-bottom: 0; }
.navbar ul ul li.active > a{ color: #00789d; }
.navbar-nav li > ul{ padding: 15px 0; margin: 0 0 0 10px; background: #282b2d; min-width: 225px; -webkit-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); -ms-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.2); }
.navbar-nav li:hover > ul{ left: auto; }

.navbar-nav > li.has-sub > ul{ opacity: 0; margin-top: 10px; -webkit-transition: all .5s ease; -ms-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; }
.navbar-nav > li.has-sub:hover > ul{ margin-top: 0; opacity: 1; }
.navbar-nav > li.has-sub:last-child:hover ul{ left: inherit; right: 0; }
.navbar li > ul ul{ margin-top: -39px; margin-left: 200px; min-width: 200px; }
.navbar li > ul ul ul{ margin-left: 175px; min-width: 130px; }
.navbar ul ul li:last-child > a, .navbar ul ul li.last-item > a{ border-bottom: 0; }
.navbar ul ul li.has-sub > a:after{ position: absolute; top: 12px; right: -3px; width: 8px; height: 2px; display: block; background: #9d9d9d; content: ""; }
.navbar ul ul li.has-sub > a:before{ position: absolute; top: 9px; right: 0; display: block; width: 2px; height: 8px; background: #9d9d9d; content: ''; -webkit-transition: all .25s ease; -ms-transition: all .25s ease; transition: all 0.25s ease; }
.navbar ul ul > li.has-sub:hover > a:before{ top: 17px; height: 0; }


/* Screen Reader*/

*:focus {
  outline: 2px solid #0000FF;
  outline-offset: 2px;
}

a[target="_blank"]:not([rel]) {
rel: "noopener noreferrer";
aria-describedby: "external-link-description";
title: "Opens in a new window";

.screen-reader-only {
  position: absolute !important;
  clip: rect(1px 1px 1px 1px); /* for IE6 and older */
  clip: rect(1px, 1px, 1px, 1px);
  padding:0 !important;
  border:0 !important;
  height: 1px !important;
  width: 1px !important;
  overflow: hidden;
}

.sr-only {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.skip-link {
  position: absolute;
  left: -999em;
}

.visually-hidden {
  position: absolute;
  overflow: hidden;
  clip: rect(0 0 0 0);
  width: 1px;
  height: 1px;
  white-space: nowrap;
}

/* client video buttons */
.my-span-class:hover {
  background-color: #0a3c61; 
}
.my-heading {
  margin-top: 20px;
  margin-bottom: 10px;
}