.bright_dark_mode_menu_wrapper {
    display: inline-block;
    /* float: right; */
    /* padding: 0 !important; */
    /* margin: 0 !important; */
    /* vertical-align: middle; */
    /* position: relative; */
    /* top: .4em; */
}

.bright_dark_mode_menu_relative_wrapper {
    position: relative;
}

.bright_dark_mode_menu {
    position: absolute;
    background-color: var(--background_color_transparent);
    padding: 1em 0;
    border-radius: var(--border_radius);
    box-shadow: var(--box_shadow);
    top: 2.3em;
    right: 0;
    width: 9em;
    text-align: center;
    transition: var(--transition_medium);
    opacity: 0;
    transform:
    translateY(-10%)  scale(0);
    transform:
    translate(30%, -60%)  scale(0);
    z-index: 10;
}

.bright_dark_mode_menu .close_bt {
    position: relative;
    /* top: -1em; */
    right: 0;
    background-color: transparent;
    box-shadow: none !important;
    filter: brightness(0.8);
    display: block;
    margin: auto;
    margin-top: -1em;
}

.mobile_menu .bright_dark_mode_menu {
    right: unset;
    left: 1em;
    transform: translate(-30%, -60%) scale(0);
}

.bright_dark_mode_menu_relative_wrapper:hover .bright_dark_mode_menu, .bright_dark_mode_menu.open {
    opacity: 1;
    transform:translateY(0)  scale(1) ;
    transform:translate(0, 0)  scale(1) ;
}

.bright_dark_options_bt {
    padding: .4em 1em;
    opacity: .5;
    cursor: pointer;
    transition: var(--transition_medium);
    width: 100%;
    color: var(--text_color);
}

.bright_dark_options_bt.active {
    border: var(--main_color) 10px solid;
    border-width: 0 5px;
    z-index:2;
}

.dark_mode .bright_dark_options_bt.device_pref {
    background-color: #202020;
    color: white;
}

.bright_dark_options_bt.device_pref.bright_mode {
    background-color: white;
    color: black;
}

.bright_dark_options_bt.device_pref.dark_mode {
    color: white;
    background-color: black;
}

.bright_dark_options_bt:hover {
    opacity: 1;
    /* transform: scale(1.1); */
    font-size: 1.2em;
    z-index: 2;
}


.bright_dark_options_bt.bright_mode, 
.bright_dark_options_bt.daylight.bright_mode  
{
    background-color: white;
    color: #555;
}

.bright_dark_options_bt.dark_mode, 
.bright_dark_options_bt.daylight.dark_mode  
{
    background-color: #222;
    color: white;
}

/* .bright_dark_options_bt.daylight {}

.bright_dark_options_bt.daylight.dark_mode {}

.bright_dark_options_bt.daylight.bright_mode {} */

.bright_dark_options_bt.usher {
    color: yellow;
    background-color: black;
}


.bright_dark_mode_bt {
    display: inline-block;
    /*     background-color: red; */
    /* height: auto; */
    /* height: 1.8em; */
    /* width: 3em; */
    /* background-image: url(../../_theme/icons/bright_swich_2.png); */
    cursor: pointer;
    /* float: right; */
    margin: 0 0.4em;
    /* filter: saturate(0); */
    /* top: 3px; */
    position: relative;
    background-position: -0.1em -0.1em;
    background-size: contain;
    display: inline-block;
    /* padding-left: 1.9em; */
}

span.fi-sr-moon {
    color: var(--turquoise) !important;
}