/*
 Butterfly Liquid Glass

 Floating Navbar

 Version:
 v1.2

 Apple Style Toolbar

*/


/* =====================================
   Floating Navigation Container
===================================== */


#nav {


    width:

    calc(100% - 48px);



    left:

    24px;



    top:

    16px;



    border-radius:


    24px;



    background:


    rgba(255,255,255,.55)

    !important;



    backdrop-filter:


    blur(35px)

    saturate(180%);



    -webkit-backdrop-filter:


    blur(35px)

    saturate(180%);



    border:


    1px solid

    rgba(255,255,255,.55);



    box-shadow:


    0

    20

    60px

    rgba(0,0,0,.12);



}





/* =====================================
   Inner Spacing
===================================== */


#nav .nav-fixed {


    border-radius:

    inherit;


}





/* =====================================
   Text

===================================== */


#nav a,


#nav span,


#nav .site-page,


#nav #site-name {


    color:

    #1d1d1f

    !important;


}





/* =====================================
   Hover

===================================== */


#nav a:hover {


    opacity:

    .65;


}





/* =====================================
   Dark Mode

===================================== */


[data-theme="dark"]

#nav {


    background:


    rgba(32,34,42,.72)

    !important;



    border-color:


    rgba(255,255,255,.16);



    box-shadow:


    0

    20

    60px

    rgba(0,0,0,.45);



}





[data-theme="dark"]

#nav a,


[data-theme="dark"]

#nav span,


[data-theme="dark"]

#nav .site-page,


[data-theme="dark"]

#nav #site-name {


    color:


    rgba(255,255,255,.92)

    !important;


}