*{
    line-height: 1.6;
}

/* nav  */
#search { /* nav Search */
    border: none; 
    border-radius: 3px; 
    background: #F4FAFB url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' class='bi bi-search' viewBox='0 0 16 16'%3E%3Cpath fill='%237D7D7D' d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398h-.001c.03.04.062.078.098.115l3.85 3.85a1 1 0 0 0 1.415-1.414l-3.85-3.85a1.007 1.007 0 0 0-.115-.1zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0z'%3E%3C/path%3E%3C/svg%3E") no-repeat 13px center;
    padding-left: 35px;
}

/* *{
    padding: 0px;
    margin: 0px;
    text-align: center;
    color: rgb(0, 0, 0);
    border: 3px solid rgba(0, 0, 0, 0.494);
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0%;
    background: rgba(0, 0, 0, 0.502)ne repeat scroll 0% 0%;
    opacity: 0.5;
    z-index: 1004;
    cursor: wait;
    right: 0px;
} */


.nav-bar-page-link{
    padding-top: 2px;
    padding-bottom: 2px;
    background-color: #f8fdfd; 
    border-radius: 7px; 
    border: 1px solid #D4D4D4;
    border-top: none
}

.nav-bar-page-link:hover {
    border: 2px solid #D4D4D4;
    border-top: none
}

.nav-bar-page-link:active {
    border: 1px solid #D4D4D4;
    border-top: none;
    background-color: #f8fdfdbc; 
    box-shadow: 0px 0px 5px 0px #D4D4D4;
}

#svg-menu{
    fill: black;
}

/* 

    TODO: 👇👇👇

        - For svg-menu add lightgray circle around the svg when clicked & remove 
        - in svg-menu:hover remove box-shadow & fill & replace it with a small slitly transparent black pop up shaped like a button that says "Expand Menu"

*/

#svg-menu:hover {
    /* shadow */
    box-shadow: 0px 0px 5px 0px #D4D4D4;
    fill: rgba(0, 0, 0, 0.696);
}

.dropdown-menu {
    --bs-dropdown-link-active-bg: #f8fdfd7f;
    --bs-dropdown-link-active-color: #D4D4D4;
}

button:focus {outline:0;}

#logo-uper-left-font {
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-style: normal;
    font-variation-settings:
        "slnt" 0;
}

/* search item nav at bottom */
#all-pagination-links li {
    display: inline;
    
}
#all-pagination-links li span {
    width: 100%;
    margin: 10px 0px 10px 0px;
    font-size: 21px;
    color: #0280C8;
    padding: 4px 10px 4px 10px;
    display: inline;
    text-decoration: none;
    /* background-color: #F1F5F6; */
    background-color: white;
}
#all-pagination-links li a {
    width: 100%;
    margin: 10px 0px 10px 0px;
    font-size: 21px;
    color: #0280C8;
    padding: 4px 10px 4px 10px;
    display: inline;
    text-decoration: none;
    /* background-color: #F1F5F6; */
    background-color: white;
}
.pg-nav-active:hover{
    color: #03659e;
    cursor: pointer;
}


/* .carousel-control-prev-icon,
.carousel-control-next-icon {
  height: 100px;
  width: 100px;
  outline: black;
  background-size: 100%, 100%;
  border-radius: 50%;
  border: 1px solid black;
  background-image: none;
}

.carousel-control-next-icon:after
{
  content: '>';
  font-size: 55px;
  color: gray;
}

.carousel-control-prev-icon:after {
  content: '<';
  font-size: 55px;
  color: red;
} */

.carousel-control-next,
.carousel-control-prev /*, .carousel-indicators */ {
    filter: invert(100%);
}


/* cookie consent */
.bottomright {
    position: fixed;
    bottom: 0px;
    right: 0px;
}

.demo {
    /* background-color: HotPink; */
    padding: 20px;
    margin: 5px;
}