/* ====================== *
 * ## Extra Small (XS) ##
 *
 * @min-width: 0px;
 * @max-width: 575px;
 * ====================== */

/* ## only on XS ## */
@media (max-width: 575px)
{
   /* ====================== *
    * ## Blue (#005187) ##
    * @var  --noise-bg-light
    * ====================== */

   /* ## border-color ## */

   .nline-xs-bottom:after,
   .nline-xs-left:after,
   .nline-xs-right:after,
   .nline-xs-top:after {
      border-color: #005187;
   }
}



/* ================== *
 * ## Small (SM) ##
 *
 * @min-width: 576px;
 * @max-width: 768px;
 * ================== */

/* ## for SM and larger ## */
@media (min-width: 576px)
{
   /* ====================== *
    * ## Blue (#005187) ##
    * @var  --noise-bg-light
    * ====================== */

   /* ## border-color ## */

   .nline-sm-bottom:after,
   .nline-sm-left:after,
   .nline-sm-right:after,
   .nline-sm-top:after {
      border-color: #005187;
   }
}

/* ## for SM and smaller ## */
@media (max-width: 768px)
{
}


/* ================== *
 * ## Medium (MD) ##
 *
 * @min-width: 769px;
 * @max-width: 991px;
 * ================== */

@media (min-width: 769px)
{
   /* ====================== *
    * ## Blue (#005187) ##
    * @var  --noise-bg-light
    * ====================== */

   /* ## border-color ## */

   .nline-md-bottom:after,
   .nline-md-left:after,
   .nline-md-right:after,
   .nline-md-top:after {
      border-color: #005187;
   }
}

/* ## for MD and larger ## */
@media (min-width: 992px)
{
   /* ## Blue (#005667) ## */
   .noise-line-vertical-left::after,
   .noise-table-calendar::after {
      border-color: #005667;
   }
}

/* ## for MD and smaller ## */
@media (max-width: 992px)
{
   /* ======================== *
    * ## Blue (#005667) ##
    * @var  --default-font-col
    * ======================== */

   .noise-navbar .nav-item.active .nav-link {
      background: #004D5C;
   }


   /* ===================== *
    * ## Blue (#004856) ##
    * @var  --noise-bg-dark
    * ===================== */

   .noise-navbar .dropdown-menu,
   .noise-navbar .navbar-nav .nav-item .nav-link {
      border-color: #004856;
   }


   /* ====================== *
    * ## Blue (#005667) ##
    * @var  --noise-bg-light
    * ====================== */

    /* ## background ## */
   .noise-navbar { background: #E5EAED; }
   .noise-navbar .navbar-nav .nav-link { background: #457492; }


   /* ================================ *
    * ## Green (#7BC717) ##
    * @var  --noise-primary-accent-col
    * ================================ */

   /* ## background ## */
   .noise-navbar .nav-item:hover .nav-link,
   .noise-navbar .nav-item.dropdown.show > .nav-link {
      background: #3E6883;
   }

   /* ## background-color ## */
   #noise-header > .noise-searchbar-container .noise-searchbar .navbar-search-btn.btn-round {
      background-color: #7BC717;
   }


   /* ===================== *
    * ## White (#FFFFFF) ##
    * ===================== */

   /* ## color ## */
   .noise-navbar .nav-item:hover .nav-link,
   .noise-navbar .navbar-nav .nav-item.active .nav-link {
      color: #FFF;
   }


   /* ## fill ## */
   .noise-navbar .dropdown > .dropdown-icon { fill: #FFFFFF; }

   /* ## stroke ## */
   .noise-navbar .dropdown > .dropdown-icon { stroke: #FFFFFF; }
}


/* =================== *
 * ## Large (LG) ##
 *
 * @min-width: 992px;
 * @max-width: 1199px;
 * =================== */

/* ## for LG and larger ## */
@media (min-width: 992px)
{
   /* ====================== *
    * ## Blue (#005187) ##
    * @var  --noise-bg-light
    * ====================== */

   /* ## border-color ## */

   .nline-lh-bottom:after,
   .nline-lh-left:after,
   .nline-lh-right:after,
   .nline-lh-top:after {
      border-color: #005187;
   }
}

/* ## for LG and smaller ## */
@media (max-width: 1199px)
{
}


/* ====================== *
 * ## Extra Large (XL) ##
 *
 * @min-width: 1200px;
 * ====================== */

/* ## only on XL ## */
@media (min-width: 1200px)
{
   /* ====================== *
    * ## Blue (#005187) ##
    * @var  --noise-bg-light
    * ====================== */

   /* ## border-color ## */

   .nline-sm-bottom:after,
   .nline-xl-left:after,
   .nline-xl-right:after,
   .nline-xl-top:after {
      border-color: #005187;
   }
}