/* Removes the border radius on the navbar toggler */
  #navbar-toggler{
    border-radius: 0px;
    background-color: var(--region-color-d) !important;

    border-color: var(--region-color-d);
    /* border-radius: 10px; */
    border-width: 1.25px;
  
    height:4rem !important;
    width:4rem;
    
  }
  #navbar-toggler:hover{
    background-color: var(--region-color-btn-hover) !important;
  }
  

  #r1-logo-navbar{
    height:5.6rem;
    background-color: white;
    margin-left: 1rem;
  }
  /* Sets the background color for the navbar */
  #navigation-bar,
  #navbar-collapse
  {
    background-color: var(--navbar-color) !important;
  }
  
  #navigation-bar .nav-link{
    position: relative;
    background-color: white;
    color:var(--primary-text-color)
  }
  #navigation-bar .nav-link:not(.dropdown-toggle)::after{
    content: '';
    position:absolute;
    width:0;
    height:2px;
    bottom:-2px;
    left:50%;
    background-color: #123556;
    transition: width 0.5s ease, left 0.5s ease;
  }
  #region-dropdown{
    width:11rem;
    font-size: large;
    font-weight:bold;
    margin-right: 5rem;
  }
  @media (min-width:1200px ) and (max-width:1399px){
    #region-dropdown{
      margin-right:2rem;
    }
  }
  #region-dropdown:hover.active{
    background-color: rgba(0,0,0,0);
  }
  #region-dropdown::after{
    fill:black;
  }
  #navigation-bar .nav-link:not(.dropdown-toggle):hover::after,
  #navigation-bar .nav-link.active:not(.dropdown-toggle):after{
    width:100%;
    left:0;
  }
  
  @media(max-width:1200px){
    #navigation-bar .nav-link:not(.dropdown-toggle)::after,
    #navigation-bar .nav-link.active:not(.dropdown-toggle):after{
      width:0%;
      left:0%;
    }
    #navigation-bar .nav-link:not(.dropdown-toggle):hover::after,
    #navigation-bar .nav-link.active:not(.dropdown-toggle):after{
      width:15rem;
      left:0%;
    }
  }
  
  
  /* Styles the navitems */
  .navitem-text-style{
      color:var(--secondary-text-color);
      display: flex;
      flex-flow: row nowrap;
      align-items: center;
      white-space: nowrap;
      font-size:large;
      font-weight: bold;
      gap: 10px;
      border-radius: 7px;
      margin: 1% 0;
    }


    @media(max-width:1199px){
      .navitem-text-style{
        margin-left:1rem !important;
        margin-bottom:1.0rem !important;

      }
      #region-dropdown{
        margin-left:1rem !important;
        margin-bottom: 1rem !important;
      }
    }
    @media(max-width: 320px){
      .navitem-text-style{
        margin-left:0.5rem !important;
      }
      #region-dropdown{
        margin-left:0.5rem !important;
      }
    }
    /* Sets the color for when a navitem is disabled.
       This must be applied manually */
    .navitem-text-style-disabled{
      color:grey !important;
    }
    /*Sets the hover styling of the navitems */
    .navitem-text-style:hover, .navitem-text-style:focus:hover{
      background-color: white;
      color:black;
    }