/**********************************************
              GLOBAL STYLES USE
  ===========================================
  Fonts and colors are considered "global
  styles" because if they need to be changed,
  it would make sense to change them for the
  whole website. Everything else should be in
  a token (specific to a function/feature) or
  in a template (specific sections or depts.).

  Ctrl + F to find:
  - FONT STYLES
  - GLOBAL COLORS
**********************************************/

body {
    margin: 0;
	font-family: 'Lato', sans-serif;
    font-size: 18px; /*1.2rem;*/
    font-weight: 400;
    line-height: 1.5; /*all fonts default to this line height*/
    color: #000; 
    background-color: #EBEFE3 !important; /*Cream background*/
}
.q-cp-live-edit { z-index: 800000; } /*edit button*/ 
:focus { box-shadow: 0 0 0 0.2rem rgba(129, 114, 70, 0.25) !important;   }
p.remove-this { display: none; } /*remove notes in the editor left for staff*/
iframe { width: 100%; max-width: 850px;	} /*prevents YouTube embeds from breaking containers*/
iframe[src*='//cse.google.com'] {/*removes ads that come first in the search results*/
	display: none !important;
}
iframe[src*='//riviera.novusagenda.com/agendapublic/'] {/*creates a custom size for this iframe*/
    width: 100%;
    max-width: 1200px;
    height: 1200px;
    border: none;	}


/*****************************
	Font Families
******************************
Oswald Regular (400) - all caps
font-family: 'Oswald', sans-serif;
(Main Nav, Quicklinks, All Titles)

Lato Light (300)
font-family: 'Lato', sans-serif;
(Body, News items, Subtext)	 */

.block-font { font-family: 'Oswald', sans-serif !important; }
.round-font { font-family: 'Lato', sans-serif !important; }


/*****************************
	GLOBAL FONT STYLES
******************************/

h1 {font-family: 'Oswald', sans-serif !important; font-weight: 600; font-size: 2.5rem; margin: 1rem 0 0 0;}  /*Title - Modern Font*/
h2 {font-family: 'Oswald', sans-serif !important; font-weight: 600;  font-size: 2rem; margin: 1rem 0 0 0;}  /*Headding - Modern Font*/
h3 {font-family: 'Oswald', sans-serif !important; font-weight: 600;  font-size: 1.75rem; margin: 1rem 0 0 0;}  /*Subheadding - Modern Font*/
	#LeftContentArea h1 {font-family: 'Oswald', sans-serif !important; font-weight: 600; color: #009E8E; padding: 0 0 5px 0;} /*non-special use content area headers*/
	#LeftContentArea h2 {font-family: 'Oswald', sans-serif !important; font-weight: 600; color: #DD7A1D /*non-ADA #FF9D00*/; padding: 0 0 5px 0;} /*non-special use content area headers*/
	#LeftContentArea h3 {font-family: 'Oswald', sans-serif !important; font-weight: 600; color: #021630; padding: 0 0 5px 0; border-bottom: 5px solid #FF9D00; margin: 0 0 5px 0;} /*non-special use content area headers*/
    #RightContentArea h1 {font-family: 'Oswald', sans-serif !important; font-weight: 600; font-size: 2.5rem; color: #009E8E; padding: 0 0 5px 0;}  /*Title - Modern Font*/
    #RightContentArea h2 {font-family: 'Oswald', sans-serif !important; font-weight: 600;  font-size: 2rem; color: #DD7A1D /*non-ADA #FF9D00*/;}  /*Headding - Modern Font*/
    #RightContentArea h3 {font-family: 'Oswald', sans-serif !important; font-weight: 600;  font-size: 1.75rem; color: #021630; padding: 0 0 5px 0; border-bottom: 5px solid #FF9D00; margin: 0 0 5px 0;}  /*Subheadding - Modern Font*/

h4 {font-family: 'Oswald', sans-serif !important;} /*Mission - Book Font*/
h5 {font-family: 'Oswald', sans-serif !important;} /*Regular Text - Book Font | ALSO SEE BUTTON SECTION*/
	#LeftContentArea h5 { font-family: 'Oswald', sans-serif !important; color: #000; font-size: 1.25rem; font-weight: bold; margin: 1rem 0 0; }
	#RightContentArea h5 { font-family: 'Oswald', sans-serif !important; color: #000; font-size: 1.25rem; font-weight: bold; margin: 1rem 0 0; }
h6 {font-family: 'Lato', sans-serif !important;} /*Small Text - Book Font*/
	#LeftContentArea h6 { /*Highlight Important Text*/
		font-family: 'Lato', sans-serif !important;
        font-size: 1rem;
        color: #000000 !important;
        padding: 10px !important;
        border-left: 10px solid #FF9D00;
        margin: 0;
        background-color: #f3ecda !important;
        font-weight: normal !important;
    }
#LeftContentArea a {
    color: #AE0A0A /*non-ADA #f44646*/;
    font-weight: 400;	}/*
#LeftContentArea a { color: #021630; font-weight: 600; text-decoration: underline solid #f44646; }*/
	#LeftContentArea a:hover {color: #009E8E /*non-ADA #00CCB7*/; text-decoration: dotted !important; }
	#LeftContentArea a .no-underline:hover { text-decoration: none;	}
#RightContentArea a { color: #AE0A0A !important; font-weight: 600; }
	#RightContentArea a:hover {color: #009E8E; text-decoration: dotted !important; }
p { font-family: 'Lato', sans-serif; font-weight: 400;  margin: 0;	} /*Book Font*/
p>a { color: #021630; font-weight: 600; text-decoration: none; }
a { color: #021630; font-weight: 600; text-decoration: none; } a:hover { color: #F44646; font-weight: 600; }

.no-underline:hover { text-decoration: none; }

.mission-quote {
    font-family: 'Lato', sans-serif !important;
	font-size: 1rem;
    line-height: 1.5 !important;
    color: #021630 !important;
    padding: 20px !important;
    border-left: 10px solid #00CCB7;
    margin: 20px 0 40px 40px !important;
    background-color: #ebefe3 !important; /*cream*/
    font-weight: normal !important;
    }

/*Mission Statement in Modern Font*/
#LeftContentArea h4 {
    font-family: 'Lato', sans-serif !important;
	font-size: 1rem;
    line-height: 1.5 !important;
    color: #021630 !important;
    padding: 20px !important;
    border-left:10px solid #00CCB7;
    margin: 20px 0 40px 40px;
    background-color: #ebefe3;
    font-weight: normal !important;     }
    @media (max-width: 991.98px) { #LeftContentArea h4 { margin: 20px 0 40px 0; } }


/*section off text with a horizontal rule*/ 
hr {
    margin-top: 3rem;
    margin-bottom: 2rem;
    border: 0;
    border-top: 3px solid #ebefe3;
}
hr .red-line { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 5px solid #f44646; }


/***********************
  GLOBAL COLORS
***********************/
/* CUSTOM COLOR HSL */
.hsla-red { color: hsla(0, 89%, 62%, 1);}
.hsla-orange { color: hsla(37, 100%, 50%, 1);}
.hsla-teal { color: hsla(174, 100%, 40%, 1);}
.hsla-cream { color: hsla(80, 27%, 91%, 1);}
.hsla-navy { color: hsla(214, 92%, 10%, 1);}

/* CUSTOM COLOR RGB */
.rgb-red { color: rgba(244, 70, 70, 1);}
.rgb-orange { color: rgba(255, 157, 0, 1);}
.rgb-teal { color: rgba(0, 204, 183, 1);}
.rgb-cream { color: rgba(235, 239, 227, 1);}
.rgb-navy { color: rgba(2, 22, 48, 1);}

/* COLOR HEX */
.text-white { color: #fff; }
.text-red { color: #f44646; }
.text-orange { color: #ff9d00; }
.text-teal { color: #00ccb7; }
.text-cream { color: #ebefe3; }
.text-navy { color: #021630; }
.text-black { color: #000; }

a.text-white { color: #fff; text-decoration: none; }	.text-white a { color: #fff; text-decoration: none; }
a.text-red { color: #f44646; text-decoration: none; }	.text-red a { color: #f44646; text-decoration: none; }
a.text-orange { color: #ff9d00; text-decoration: none; }	.text-orange a { color: #ff9d00; text-decoration: none; }
a.text-teal { color: #00ccb7; text-decoration: none; }	.text-teal a { color: #00ccb7; text-decoration: none; }
a.text-cream { color: #ebefe3; text-decoration: none;}	.text-cream a { color: #ebefe3; text-decoration: none; }
a.text-navy { color: #021630; text-decoration: none; }	.text-navy a { color: #021630; text-decoration: none; }
a.text-black { color: #000; text-decoration: none; }	.text-black a { color: #000; text-decoration: none; }

.hover-text-white:hover { text-decoration: none; color: #fff !important; }
.hover-text-red:hover { text-decoration: none; color: #f44646 !important; }
.hover-text-orange:hover { text-decoration: none; color: #ff9d00 !important; }
.hover-text-teal:hover { text-decoration: none; color: #00ccb7 !important; }
.hover-text-cream:hover { text-decoration: none; color: #ebefe3 !important; }
.hover-text-navy:hover { text-decoration: none; color: #021630 !important; }
.hover-text-black:hover { text-decoration: none; color: #000 !important; }

.bg-white { background-color: #fff; }	.button-white a { background-color: #fff; }
.bg-red { background-color: #f44646; }	.button-red a { background-color: #f44646; }
.bg-orange { background-color: #ff9d00; }	.button-orange a { background-color: #ff9d00; }
.bg-teal { background-color: #00ccb7; }	.button-teal a { background-color: #00ccb7; }
.bg-cream { background-color: #ebefe3; }	.button-cream a { background-color: #ebefe3; }
.bg-navy { background-color: #021630; }	.button-navy a { background-color: #021630; }
.bg-black { background-color: #000; }	.button-black a { background-color: #000; }

.hover-bg-white:hover { background-color: #fff; }	.hover-button-white a:hover { background-color: #fff; }
.hover-bg-red:hover { background-color: #f44646; }	.hover-button-red a:hover { background-color: #f44646; }
.hover-bg-orange:hover { background-color: #ff9d00; }	.hover-button-orange a:hover { background-color: #ff9d00; }
.hover-bg-teal:hover { background-color: #00ccb7; }	.hover-button-teal a:hover { background-color: #00ccb7; }
.hover-bg-cream:hover { background-color: #ebefe3; }	.hover-button-cream a:hover { background-color: #ebefe3; }
.hover-bg-navy:hover { background-color: #021630; }	.hover-button-navy a:hover { background-color: #021630; }
.hover-bg-black:hover { background-color: #000; }	.hover-button-black a:hover { background-color: #000; }


/*Drop shadows (floating nav)*/
.drop-shadow { box-shadow: 2px 2px 8px #04040463; }



/***********************
  GLOBAL BREADCRUMBS
***********************/
a.BREADCRUMB_LINK {
    color: #021630 !important;
    font-family: 'Oswald', sans-serif !important;
    font-weight: 400 !important;
    font-size: 0.8rem;	}
    a.BREADCRUMB_LINK:hover {
        color: #00CCB7 !important;
        text-decoration: dotted;
    }
span.BREADCRUMB_TEXT:last-of-type { display: none; } /*removes redundant page title from breadcrumb*/
span.BREADCRUMB_TEXT:nth-last-of-type(2) { display: none; } /*removes cliff-hanger ">>" at the end of the new breadcrumb*/



/***********************
  GLOBAL BUTTONS
***********************/
#LeftContentArea h5>a {
    display: inline-block;
    font-family: 'Oswald', sans-serif!important;
    font-weight: 400;
    font-size: 1.2rem;
    text-align: center;
    color: #000;
    background-color: #00CCB7;
    text-decoration: none;
    text-transform: capitalize;
    padding: 12px 20px;
    margin: 0 5px 5px 0;
    line-height: 1.2;	}
    #LeftContentArea h5>a:hover {
        color: #000;
        background-color: #ebefe3;
        text-decoration: none;
    }
#RightContentArea h5>a {
    display: inline-block;
    font-family: 'Oswald', sans-serif!important;
    font-weight: 400;
    font-size: 1.2rem;
    color: #000 !important;
    background-color: #00CCB7;
    text-decoration: none;
    text-transform: capitalize;
    padding: 12px 20px;
    margin: 0 5px 5px 0;
    line-height: 1.2;	}
    #RightContentArea h5>a:hover {
        color: #000;
        background-color: #ebefe3;
        text-decoration: none;
    }
.div-button {
    color: #000;
  	background-color: #d0bf6b;
    background-image: linear-gradient(#f2eed9,#d0bf6b);
    border: 2px solid #000;
    border-radius: 4px;
    line-height: 1.3;
}
.div-button a { color: #000; }
.div-button a:hover { color: #fff; }

.div-button:hover {
    color: #fff !important;
    background-image: none;
    background-color: black;
    color: #fff;
}

/*return to calendar BTN*/
tr.q-event-row.q-event-row-return td a {
    padding: 10px;
    /* text-transform: capitalize; */
    color: #fff !important;
    background-color: #00CCB7;
    border-radius: 3px;
    line-height: 3; }
    tr.q-event-row.q-event-row-return td a:hover {
        color: #00CCB7 !important;
        background-color: #fff;
        border: 2px solid #00CCB7;
        border-radius: 3px; }


/***********************
  GLOBAL LISTS (UL)
***********************/
/*
    #LeftContentArea ul li::before {
      content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet
      color: #446f97; /* Change the color to accent blue
      font-weight: bold; /* Make it bold
      display: inline-block; /* Needed to add space between the bullet and the text
      width: 1em; /* Also needed for space (tweak if needed)
      margin-left: -1em; /* Also needed for space (tweak if needed)
    } */


/*bullet list*/
#LeftContentArea ul { font-family: 'Lato', sans-serif; font-weight: 400; /*list-style: none; Removes default bullets if engaged */ }
/*#LeftContentArea ul li {
    margin-bottom: 10px;
    margin: 15px 0;
    border-left: 5px solid #021630;
    padding-left: 0.8rem;
    line-height: 1.5;
    background-color: #ebefe399;
    list-style-type: none;
}*/
#LeftContentArea ul li {
    margin-bottom: 10px;
    margin: 15px 0;
    border-left: 5px solid #021630;
    padding: 12px 10px 8px 0.8rem;
    line-height: 1.2;
    background-color: #ebefe399;
    list-style-type: none;
}
/*numbered list*/
#LeftContentArea ol { font-family: 'Lato', sans-serif; font-weight: 400; }
#LeftContentArea ol li {
    margin-bottom: 10px;
    margin: 15px 0;
    padding: 0.8rem;
    line-height: 1.5;
    background-color: #ebefe399;
}

/*exclude file browsers*/
#LeftContentArea ul.FB_FileListUL li::before {
  content: none;
}

/*add a bit of margin between bulletted list items*/
#LeftContentArea li {
  margin-bottom: 10px;
}




/***********************
  GLOBAL CONTAINERS
***********************/
.full-banner { height: 100vh; overflow: hidden; }
	@media (max-width: 999px) { .full-banner { height: auto; } }

.content-section { min-height: 200px; position: relative; top: 200px; }
	@media (max-width: 991.98px) { .content-section { top: 0px; } }


#LeftContentArea { /*box-shadow: 5px 0px 6px 0px rgba(0,0,0,0.16);*/ }
#RightContentArea { /*box-shadow: 5px 0px 6px 0px rgba(0,0,0,0.16);*/ }
	@media (max-width: 991.98px) { #RightContentArea { margin-top: 1rem; } }


.white-rounded-container { /*for main content containers*/
  background-color: #fff;
  border-radius: 3px;
  min-height: 350px;
}
.rounded-container {  /*for buttons or any content containers*/
    border-radius: 3px;
}

/*basic table with no borders that just allows a hover color*/
.simple-table thead tr:hover {
    background-color: #fff;
}
.simple-table tr:hover {
    background-color: #ededed; /*grey*/
}



/***********************
  GLOBAL INNERPAGE LINKS
***********************/

/*example for list: <ul class="department-topnav block-font"> */
.department-topnav ul { padding: 0; margin: 0; }
    /*on the li, this will turn a list into a row for buttons or links*/
   .department-topnav li { display: inline-block; }
   .department-topnav a {
      background-color: #ededed;
      text-decoration: none;
      padding: 10px 15px;
      line-height: 3;
      margin: 5px;
      border-radius: 3px;
      text-align: center;
   }
   .department-topnav a:hover { background-color: #eee; color: #061939 !important; text-decoration: none !important; }


/*inpage link buttons*/
.navy-btn { /*navy btn with white text turns the accent blue on-hover*/
    background-color: #061939;
    color: #fff;
    padding: 5px 10px;
    margin: 5px;
    border-radius: 3px;
    text-align: center;
    text-transform: capitalize;
    font-weight: 500;}
    .navy-btn:hover { background-color: #0161a6;} /*accent blue text*/
    a .navy-btn:hover { background-color: #0161a6;}



/***********************
  GLOBAL CONTACT SIDE
***********************/

#RightContentArea i {
  width: 45px;
  height: 45px;
  text-align: center;
  color: #c54b38 !important;
  padding: 10px;
  line-height: 1;
  border-style: solid;
  border-width: 2px;
  border-radius: 50%;
  border-color: #c54b38;
  margin: 0 10px 10px 0;
}
/*
#RightContentArea img {
  width: 100% !important;
  max-height: 350px;
  max-width: 250px;
  margin: 0 0 15px 0;
  border-radius: 5px;
  vertical-align: middle;
  border-style: none;
  object-fit: cover;
}*/



/****************************************
 Token: DROP_DOWN_LIST FolderID="00000"
****************************************/
  /*styles the reusable token that allows customers to choose a folder tree for internal navigation*/
  /*SUBNAV  |  Best used for short lists that have sub-folders*/

#SubNav {
    position: relative;
  	top: -1.3rem;/*positions between the two hr*/
    margin-bottom: 1.8rem !important;/*pushes down the hr*/
}
  /*text toggle*/
  .dropdownSUB {
    position: absolute;
    top: -10px;
    cursor: pointer;
    color: #0161a6; /*accent color*/       }
  .dropdownSUB:hover {  color: #061939;   }
  .dropdownSUB h5 { font-weight: 400 !important; }

  /*panel position*/
  .SUBOptions {
    position: relative;
    cursor: pointer;
    z-index: 200000;       }

  /*panel text color*/
  .SUBOptions td { color: #fff; }
  .SUBOptions td:hover {  color: #edece8; } /*text off-white color*/

  h5.dropdown-title { color: #0161a6 !important; } /*accent color*/
  h5.dropdown-title:hover { color: #061939 !important; } /*medium color*/

  /*each page/item/link rectangle*/
  .MenuIteminternal-page-subnav td {
    background-color: #0161a6;/*accent color*/
    padding: 10px 0 10px 15px !important; }
  /*each page/item/link rectangle hover state*/
  .MenuItemOverinternal-page-subnav td {
    background-color: #061939;/*darkest color*/
    padding: 10px 0 10px 15px !important; }



/********************************************
 Token: DROP_DOWN_PARAGRAPH FolderID="00000"
********************************************/
/*Displays the sub-folders as a block of links*/

/*BOOTSTRAP VERSION & OVERRIDES*/
  a#navbarPagesDropdownLink { color: #ebefe3; }
  #navbarPagesDropdownLink .dropdown.show { color: inherit !important; background-color: #fff !important; }
  #navbarPagesDropdownLink .dropdown-menu { padding: 1rem !important; }
  #navbarPagesDropdownLink .dropdown-menu.show {
        background-color: #021630;
        margin: 0;
        border-radius: 0;
        padding: 0 0 5px 5px;
      }
a.nav-bar-block {
    position: relative;
    color: #021630 !important;
    font-family: 'Oswald', sans-serif;
    font-size: 1.2rem;
    font-weight: 400 !important;
    text-transform: uppercase;
    background-color: #fff;
    border: 2px solid #021630;
    border-radius: 0;   }
    a.nav-bar-block:hover {
          color: #021630 !important;
          background-color: #00CCB7;
          border: 2px solid #00CCB7; }


/*Categories Subnav*/
a.subnav-bar-block {
  color: #fff !important;
  font-weight: 700;
  text-transform: uppercase;
  background-color: #817246;
  border: 2px solid #817246;
  border-radius: 0;   }
  a.subnav-bar-block:hover {
    color: #e7db9f !important;
    background-color: #000;
    border: 2px solid #000; }

/*submenu-title*/
.submenu-title p {
    text-align: center;
    margin-bottom: 0;
    font-weight: 700;
    color: #021630;
}
.hr-style {
    margin-bottom: 0;
    text-align: center;
    border: none;
    background: linear-gradient(to top, #ffffff00 calc(50% - 1px), #021630 calc(50% - 1px), #021630 calc(50% + 1px), transparent calc(50% + 1px));
}


/*QCONTENT OVERRIDES*/
.MenuGroupinternal-page-blocknav {
    position: relative;
    display: block;
    color: #fff;
    text-align: center;
    font-family: 'Lato', sans-serif;
    text-transform: capitalize;
    background-color: #021630;
    padding: 1rem 0;
    cursor: pointer;
    font-size: 1rem;
    line-height: 2;
    z-index: 2000;
}
.MenuGroupinternal-page-blocknav tr { display: inline-block; } /*displays links all on one line*/
.MenuGroupinternal-page-blocknav td { display: inline-flex; } /*vertical aligns middle*/
.MenuGroupinternal-page-blocknav td { padding: 0 5px; } /*adds a touch more spacing for large lists*/

.MenuIteminternal-page-blocknav td img { display: none; } /*removes hidden subpages caret*/
.MenuItemOverinternal-page-blocknav td img { display: none; } /*removes hidden subpages caret on hover*/
.MenuItemOverinternal-page-blocknav td {  color: #fff;  }


/******************************************
 Token: BUTTON_PARAGRAPH FolderID="00000"
******************************************/
/*Displays the sub-folders as masonry buttons*/
.MenuGroupinternal-page-folderlist {
    /*text-align: center;*/
    width: 100%;
    margin: auto;
    cursor: pointer;
    font-family: 'Oswald', sans-serif;
    text-transform: capitalize;
    line-height: 1.2;
}
.MenuIteminternal-page-folderlist { margin: 5px; }
  /*on hover effect*/ .MenuItemOverinternal-page-folderlist { margin: 5px;  }

.MenuGroupinternal-page-folderlist tr { display: inline-block; }
.MenuIteminternal-page-folderlist td {
    font-family: 'Oswald', sans-serif!important;
    font-weight: 400;
    font-size: 1.2rem;
    color: #000;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-right: 5px;
    padding-left: 20px !important;
    background-color: #00CCB7;	}
  	/*on hover effect*/
    .MenuItemOverinternal-page-folderlist td {
        font-family: 'Oswald', sans-serif !important;
        font-weight: 400;
        font-size: 1.2rem;
        color: #000;
        padding-top: 10px;
        padding-bottom: 10px;
        padding-right: 5px;
        padding-left: 20px !important;
        background-color: #ebefe3;    }

.MenuIteminternal-page-folderlist td img { display: none; } /*removes hidden subpages caret*/
.MenuItemOverinternal-page-folderlist td img { display: none; } /*removes hidden subpages caret on hover*/

/***********************
  GLOBAL IMAGES
***********************/

.banner-style {
    margin: 180px 0 0 0;
    position: relative;
    padding: 0;
    max-height: 540px;
    width: 100%;
    overflow: hidden; }
    @media (max-width: 1000px) {
     .banner-style { margin: 0; }
      }

 .banner-style img {
    max-height: 500px;
    width: 100%;
    vertical-align: middle;
    border-style: none;
    object-fit: cover; }


/*images pasted via the editor into the MAIN LEFT COLUMN*/
  #LeftContentArea img { border-radius: 5px; width: auto; max-width: 600px; }
  #PhotoWall img { height: 200px !important; }

/*images pasted via the editor into the RIGHT COLUMN*/
#RightContentArea img {
    width: auto !important;
    height: auto;
    max-height: 350px;
    max-width: 100%;
    margin: 0 0 15px 0;
    border-radius: 5px;
    vertical-align: middle;
    border-style: none;
    object-fit: cover;
}/*
  #RightContentArea img {
    width: 100% !important;
    height: auto;
    margin: 0 0 15px 0;
    border-radius: 5px;    }*/

  /*Contact social media icons*/
  #RightContentArea i {
    width: 45px;
    height: 45px;
    text-align: center;
    color: #dcc7aa !important;
    padding: 10px;
    line-height: 1;
    border-style: solid;
    border-width: 2px;
    border-radius: 50%;
    border-color: #dcc7aa;
    margin: 0 10px 10px 0;
  }


/*MAYOR & COUNCIL CARDS*/
    ul.image-cards {
    display: block;
    width: 100%;
    padding: 0;
    margin: auto;
    text-align: center;
    }
    ul.image-cards li {
    display: inline-block;
    padding: 0.5rem !important;
    margin: 0 !important;
    border-left: 0 !important;
    background-color: transparent !important;
    }
    ul.image-cards li img {
    object-position: center;
    width: 250px;
    height: 300px;
    object-fit: cover;
    }
    ul.image-cards a {
    color: #000 !important;
    display: inline-block;
    position: relative;
    max-width: 250px;
    height: 350px;
    vertical-align: middle;
    overflow: hidden;
    line-height: 1.3;
    }


/*EDITOR ACCESS TO STYLE IMAGES*/
  .photo-portrait {
      border-radius: 10px;
      max-width: 350px !important;    }
	  @media (max-width: 767.98px) { .photo-portrait { display: block; float: none; width: auto; max-width: 100% !important; border-radius: 50% !important; margin: auto; padding: 2rem 0;  }	}

  /*NO TEXT WRAP*/
  .photo-left-nowrap {
      width: auto;
      max-width: 450px !important;
      display: block;
      border-radius: 5px;
      padding: 0;  }
      @media (max-width: 767.98px) { .photo-left-nowrap { width: auto; max-width: 100% !important; margin: auto; padding: 2rem 0; }	}
  .photo-center-nowrap {
      width: auto;
      max-width: 450px !important;
      margin: auto;
      display: block;
      border-radius: 5px;
      padding: 0;  }
      @media (max-width: 767.98px) { .photo-center-nowrap { width: auto; max-width: 100% !important; padding: 2rem 0; }	}
  .photo-right-nowrap {
      width: auto;
      max-width: 450px !important;
      display: block;
      float: right;
      border-radius: 5px;
      padding: 0;  }
      @media (max-width: 767.98px) { .photo-right-nowrap { width: auto; max-width: 100% !important; margin: auto; padding: 2rem 0; }	}
  .photo-full-width {
      width: 100% !important;
      max-width: 100% !important;
      margin: auto;
      display: block;
      padding: 1.5rem 0;  }
      @media (max-width: 767.98px) { .photo-full-width-nowrap { width: auto; max-width: 100% !important; display: block; padding: 2rem 0; }	}


  /*WITH TEXT WRAP*/
  .photo-left-wraptext {
      width: auto;
      max-width: 350px !important;
      display: inline-block;
      float: left;
      border-radius: 5px;
      margin: .5rem 2rem .5rem 0;
      padding: 0;  }
      @media (max-width: 767.98px) { .photo-left-wraptext { width: auto; max-width: 100% !important; display: block; float: none; margin: auto; padding: 2rem 0; }	}

  .photo-right-wraptext {
      width: auto;
      max-width: 350px !important;
      display: inline-block;
      float: right;
      border-radius: 5px;
      margin:  .5rem 0 .5rem 2rem;
      padding: 0;  }
      @media (max-width: 767.98px) { .photo-right-wraptext { width: auto; max-width: 100% !important; display: block; float: none; margin: auto; padding: 2rem 0; }	}


	  @media (max-width: 767.98px) {
        #LeftContentArea img {
          display: block;
          float: none;
          width: auto;
          max-width: 100% !important;
          margin: auto;
          padding: 2rem 0; }
		}


/***********************
  GLOBAL TABLES
***********************/
/*
  .town-style table {
      border-collapse: collapse;
      border-spacing: 0;
      width: 100%;
      border: 0; }
  .town-style th {
      color: #0161a6;
      font-family: 'Oswald', sans-serif;
      font-size: 1.2rem;
      font-weight: 400;
      padding: 10px; }
  .town-style td {
      padding: 10px;
      font-family: 'Crimson Text', serif;
      font-size: 1.2rem;   }
  .town-style tr:hover { background-color: #edece8; }
  .town-style tr:nth-child(even){background-color: #69696912;}
  .town-style table {
      border-collapse: collapse;
      border-spacing: 0;
      width: 100%;
      border: none; }*/

/*editor made tables with the "town-table" class added*/
    table.town-table {
        display: block;
        border-collapse: collapse;
        border-spacing: 0;
        overflow-x: auto;
        margin: auto;
        width: 100%;
        border: 0;    }
    .town-table table {
        border-collapse: collapse;
        border-spacing: 0;
        width: 100%;
        border-left: 1px solid #ddd;    }
    .town-table th {
        color: #0161a6;
        font-family: 'Oswald', sans-serif;
        font-size: 1.2rem;
        font-weight: 400;
        padding: 10px; }
    .town-table td {
        padding: 15px;
        font-family: 'Crimson Text', serif;
        font-size: 1.2rem;   }
    table.town-table td { border-left: 1px solid #ddd;  }
    .town-table tr:hover { background-color: #edece8; }
    .town-table tr:nth-child(even){background-color: #69696912;}

/*Bootstrap pagionated table for the "Directory Of Services"*/
#LeftContentArea .bootstrap-table table .table {  border: 2px dotted transparent;  }
#LeftContentArea .bootstrap-table table .table tr {  height: 80px;	}
#LeftContentArea .bootstrap-table table .table tr th { border: 0; border-bottom: 5px solid #ff9d00 !important; }
table.table th {
    font-family: 'Oswald', sans-serif !important;
    border-bottom: 5px solid #ff9d00 !important;
}
#LeftContentArea .bootstrap-table table .table td {
    padding: 1rem;
    line-height: 1;
    margin: 0;
    border: 0;
    border-bottom: 1px solid #ebefe3;	}
#LeftContentArea .bootstrap-table table .table a { display: inline-block; }

#LeftContentArea .bootstrap-table .table ul.pagination li {
    border-left: 0 !important;
    background-color: transparent !important;
	padding-left: 0;	}

ul.pagination li {
    border-left: 0 !important;
    padding-left: 0 !important;
    background-color: transparent !important;
    list-style-type: none;
}
ul.pagination li.page-item { padding: 12px 0 !important; }

#LeftContentArea .bootstrap-table ul.pagination li a.page-link {  color: #021630 !important; padding: 0.8rem 1rem;	}
#LeftContentArea .bootstrap-table .page-item.active .page-link {  background-color: #00CCB7 !important; border-color: #00CCB7 !important;	}
#LeftContentArea .bootstrap-table .dropdown-item.active, .dropdown-item:active {
    color: #fff !important;
    text-decoration: none;
    background-color: #00CCB7;
}


/*Data Tables Override*/
      .bootstrap-table .dropdown-menu.show {
          background-color: #ffffff;
          box-shadow: 2px 2px 5px #cccccc61;
          border: 1px solid #ccc !important;
      }
      .bootstrap-table li {
          background-color: #fff;
          max-width: 50px;
          text-align: center;
      }


/*non-bootstrap dynamic, just HTML & CSS*/
  table.clean-table {
      display: table;
      width: 100%;
      overflow-x: auto;
  }
  table.clean-table th {
      border-bottom: 2px solid #000;
  }
  .clean-table thead tr:hover {
      background-color: #fff;
  }
  .clean-table tbody tr:hover {
      background-color: #ededed;
  }
  table.clean-table td {
      min-width: 100px;
  }
  /* Medium devices (tablets, less than 992px)*/
  @media (max-width: 991.98px) { table.clean-table { display: block; } }


/***********************
  GLOBAL CALENDARS
***********************/

/*no matter what id is generated, this will append to it*/
.full-cal span:nth-child(1) { width: 100%; }

    /*LIST VIEW: LEFT BORDER COLORS*/
    ul.upcoming-events li:nth-last-of-type(10) { border-left: 5px solid #00CCB7; /*teal*/  }
    ul.upcoming-events li:nth-last-of-type(9) { border-left: 5px solid #FF9D00; /*orange*/  }
    ul.upcoming-events li:nth-last-of-type(8) { border-left: 5px solid #00CCB7; /*teal*/  }
    ul.upcoming-events li:nth-last-of-type(7) { border-left: 5px solid #FF9D00; /*orange*/  }
    ul.upcoming-events li:nth-last-of-type(6) { border-left: 5px solid #00CCB7; /*teal*/  }
    ul.upcoming-events li:nth-last-of-type(5) { border-left: 5px solid #FF9D00; /*orange*/  }
    ul.upcoming-events li:nth-last-of-type(4) { border-left: 5px solid #00CCB7; /*teal*/  }
    ul.upcoming-events li:nth-last-of-type(3) { border-left: 5px solid #FF9D00; /*orange*/  }
    ul.upcoming-events li:nth-last-of-type(2) { border-left: 5px solid #00CCB7; /*teal*/  }
    ul.upcoming-events li:nth-last-of-type(1) { border-left: 5px solid #FF9D00; /*orange*/  }


    table.LARGECAL_STYLE {
        border: 2px solid #446f97 !important;
        color: #446f97 !important;
    }
    table.LARGECAL_TITLE {
        font-family: 'Open Sans', sans-serif !important;
        color: #fff !important;
        background-color: #446f97 !important;
    }
    td.LARGECAL_NEXTPREV {
        padding: 15px !important;
    }
    span.q-event-data h2 {
        font-size: 1.3rem;
    }

    /*using StyleSet="blue-cal"*/
    table.blue-cal_TITLE {
        font-family: 'Open Sans', sans-serif !important;
        color: #fff !important;
        background-color: #446f97 !important;
    }

    td.blue-cal_NEXTPREV { padding: 15px !important;  }
    span#ctl82_C { width: 100%; }


    /*EVENT/CALENDAR LIST/FEED LEFT BORDER COLORS*/
    ul.eventlist li { border-left: 5px solid #ff9d00; }
	ul.eventlist li:nth-of-type(2) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(4) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(6) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(8) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(10) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(12) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(14) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(16) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(18) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(20) { border-left: 5px solid #00CCB7 !important; }

	ul.eventlist li:nth-of-type(22) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(24) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(26) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(28) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(30) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(32) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(34) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(36) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(38) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(40) { border-left: 5px solid #00CCB7 !important; }

	ul.eventlist li:nth-of-type(42) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(44) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(46) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(48) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(50) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(52) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(54) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(56) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(58) { border-left: 5px solid #00CCB7 !important; }
	ul.eventlist li:nth-of-type(60) { border-left: 5px solid #00CCB7 !important; }

  /*MOBILE LIST VIEW BASED ON "QSchedulerEventList.txt" FILE*/
  #LeftContentArea .mobile-cal ul li {
      margin-bottom: 10px;
      margin: 15px 0;
      border-left: 5px solid #ff9d00;
      padding: 12px 10px 8px 0.8rem;
      line-height: 1.2;
      background-color: #ebefe399;
      list-style-type: none;
  }
  .mobile-cal span.eventname a { color: #021630 !important;	}

/***********************
	GLOBAL FILE BROWSER
***********************/

/*styles the built-in file browser with dropdowns and icons*/
#FB_AP h2 { font-size: 1.2rem !important;  padding: 15px 10px !important;        }
#FB_FB_APPanel img { width: 25px !important; padding: 5px 8px 5px 0 !important; } /*#FB_FB_APPanel img { width: 20px !important;  padding: 5px 8px !important; }*/
#FB_FB_APPanel ul { list-style: none;  }
.FolderPreText { display:none; }/*removes "auto" title*/

/*scroll for long lists*/
.file-listing {
    max-height: 650px;
    overflow: auto;
    padding: 0 0.5rem 0 0;	}
file-listing::-webkit-scrollbar-thumb {
    background-color: #021630;
    border: 1px solid #02163087;
    border-radius: 3px;
}

/*Multi-folder dropdown*/
.file-listing select {
    color: #ffffff;
    font-family: 'Oswald', sans-serif;
    font-size: 1rem;
    font-weight: 400;
    padding: 5px;
    background-color: #021630;	}
.file-listing h2 { display: none; }/*removes "listing files in folder..." text for dupes*/


/*styles the built-in file list display*/
div#FB_FB_APPanel h2 { display: none; }
ul.FB_FileListUL {
  list-style-type: none;
  font-size: .9rem;
  padding-left: 0;
  /*border: 2px solid;*/   }
ul.FB_FileListUL span { display: none; }
ul.FB_FileListUL li {
    margin-bottom: 10px;
    margin: 15px 0;
    padding: 1rem;
    line-height: 1.5;
    background-color: #ebefe399;
    list-style-type: none;	}
	ul.FB_FileListUL li:hover { background-color: #dcd0af33; }

ul.FB_FileListUL a { vertical-align: middle; color: #021630 !important;	}
    .FB_Footer { display: none; }

/*img alignment for my token browser lists*/
ul.FB_FileListUL img { width: 20px !important;	}
.FB_FileListUL li img { vertical-align: middle; }

/*img alignment for faux file browser lists*/
li img { vertical-align: baseline; }

/*removed the "date uploaded on" text*/
ul.FD_FileListUL span { display: none; }
#FD_AP h2 { display: none; }/*removes "listing files in folder..." text*/
.FD_Footer { display: none; }
#FD_D { font-family: 'Open Sans', sans-serif; }



/*the token adds a "sorted from ___ folder" label that can be removed*/
/*TOKEN:  QTICONTENT_FILEBROWSER ID="NoLabel" FolderID="45254" UseScriptManager="True" FileSort="Title" FileSortDirection="ASC" Include="" Exclude=""##  */
#NoLabel_AP h2 { display: none; }
#NoLabel_AP span { display: none; } /*removes both the h2 and the "uploaded on" date*/
#NoLabel_AP .FB_Footer { display: none; } /*removes disclaimer on time stamping*/

#FB_FileListUL LI DIV SPAN {  display:none;  }
.FolderPreText {  display:none;  }

/*over-ride default HTML option color*/
option[value=""] { background-color: #00CCB7; }




/***********************
  GLOBAL FEEDS
***********************/
.NEWS_FEED_DISPLAY_TABLE {
    /* margin-left: 2rem; */ }
	@media (max-width: 991.98px) { .NEWS_FEED_DISPLAY_TABLE { margin-left: 0; } }


/*LEFT BORDER COLORS*/
.NEWS_FEED_DISPLAY_ROW_TITLE { border-left: 5px solid #ff9d00; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(2) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(4) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(6) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(8) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(10) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(12) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(14) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(16) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(18) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(20) { border-left: 5px solid #00CCB7 !important; }

.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(22) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(24) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(26) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(28) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(30) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(32) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(34) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(36) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(38) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(40) { border-left: 5px solid #00CCB7 !important; }

.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(42) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(44) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(46) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(48) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(50) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(52) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(54) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(56) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(58) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(60) { border-left: 5px solid #00CCB7 !important; }

.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(62) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(64) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(66) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(68) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(70) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(72) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(74) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(76) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(78) { border-left: 5px solid #00CCB7 !important; }
.NEWS_FEED_DISPLAY_ROW_TITLE:nth-of-type(80) { border-left: 5px solid #00CCB7 !important; }

.NEWS_FEED_DISPLAY_ROW_TITLE {
    display: inline-block;
    color: #021630;
    background-color: #fff;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1;
    margin: 0 0 10px;
    padding: 1rem;
    width: 100%; }
    .NEWS_FEED_DISPLAY_ROW_TITLE:hover {
        background-color: #f8f5e7;
      	text-decoration: none;    }

.NEWS_FEED_DISPLAY_DETAILS_ROW_TITLE { margin-bottom: 1rem; }

a.NEWS_FEED_DISPLAY_LINK_TITLE {
    font-family: 'Lato', sans-serif;
    display: inline;
    color: #021630 !important;
    line-height: 1.2;
    text-decoration: none;	}
    a.NEWS_FEED_DISPLAY_LINK_TITLE:hover {
        text-decoration: none;	}

a.NEWS_FEED_DISPLAY_LINK_ARCHIVE {
    font-family: 'Oswald', sans-serif;
    font-size: 1.2rem;
    text-transform: uppercase;
    float: right;
    color: #021630 !important;
    padding: 10px;
    /* border-radius: 3px; */
    /* background-color: #ebefe3; */
    border: 2px solid #021630;
    line-height: 1.5;	}
	a.NEWS_FEED_DISPLAY_LINK_ARCHIVE:hover {  background-color: #00CCB7; }


/***********************
  BOOTSTRAP OVERRIDES
***********************/
        /*Image Gallery Style*/
        .card-gallery {
            position: relative;
            height: 200px;
            background-color: #dcc7aa !important;
            border: 0;
            border-radius: 3px;
        }
        .card-img-top-gallery {
            position: absolute;
            height: 100%;
            object-fit: cover;
            overflow: hidden;
            object-position: 50%;
        }
        .card-body-gallery {
            position: relative;
            background-color: #ededed;
            text-align: center;
            padding: 1.25rem;
            opacity: 0;
            transition: .5s ease;
        }
        .card-text-gallery {
            height: 120px;
            overflow: hidden;
        }


/***********************
   ALERT BAR OVERRIDES
***********************/
/*see token}*/


/***********************
  LOG-IN PAGE OVERRIDES
***********************/
span#objLogin > div {
    min-height: 700px;
    margin-top: 1.5rem;
}
span#objLogin .HEADER_DIV {  margin-bottom: 8px;	}
span#objLogin .HEADER_TEXT {
    font-family: 'Oswald', sans-serif !important;
    color: #021630;
    font-size: 1.5rem;
    font-weight: 600;
    border-bottom: 3px solid #FF9D00;
}
input#objLogin_L_LS {
    color: #021630;
    padding: 0.5rem 0.8rem;
    margin: 0.5rem 0.5rem 0.5rem 0;
    background-color: #00CCB7;
    border: 0;
    border-radius: 3px;
}


/***********************
  SCROLL BAR OVERRIDES
***********************/

  /* width */
  ::-webkit-scrollbar {
    width: 8px;
  }
  /* Track */
  ::-webkit-scrollbar-track {
    background-color: #EBEFE3; /*cream*/
    box-shadow: inset 0 0 5px grey;
    border-radius: 0px;
  }
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background-color: #EBEFE3; /*cream*/
    border: 1px solid #02163087; /*navy*/
    border-radius: 3px;
  }

  /* Handle on hover */
  ::-webkit-scrollbar-thumb:hover {
    background: #00CCB7; /*teal*/
  }