/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header{width:100%;position:absolute;z-index:9;}
#header .head-img{position:relative;padding: 7px 0;text-align: center;}


/*nav-bar*/
.dropdown-toggle{position:relative;}
.navbar.bg-light{background-color: transparent !important;height:100%;}
.nav-link{font-size: 19px;letter-spacing: 1px;padding: 5px;background: #ffffff;background-size: 200% auto;-webkit-background-clip: text;-webkit-text-fill-color: transparent;animation: shine 3s linear infinite;}

.nav-fill{font-size: 15px;position: absolute;top: 90px;right: 0;padding: 0 5% 0 0;}

.navbar-toggler{margin: 15px 4% 15px 0;position: absolute;right: 0;z-index: 9999999;opacity: 1;border: 0;}
.dropdown-item {font-size: 15px;white-space: break-spaces;}

/*nav-bar*/

/**/
#widgetsControl, #widgetsControl_C{height:inherit !important;}
#HeaderControl{position: absolute;top: 0px;left:0;width: 30%;z-index: 999999999;padding: 5px 3%;}
#MenuControl{position: absolute;top: 0;right: 0; }

.nav-fill .nav-item{text-align: right;padding:5px 10px;margin: 0; position: relative; z-index: 2;}
.navbar-collapse{min-width: 20%; height:100vh;position: fixed;right: 0px;top: 0px;bottom: 0;padding-top: 0;overflow-y: auto;transform: translate(0, 0);}
.navbar-collapse.show{z-index: 99;transform: translate(0, 0); background-image: linear-gradient(60deg, #0091cd, #060606);}
.body-fx .navbar-toggler[aria-expanded="true"] {z-index: 999999999;position: fixed;border-radius: 50%;width: 30px;height: 30px;text-align: center;padding: 5px;margin-top:5px;right: 14px;}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:after{content:"x";position: fixed;top: 30px;right: 35px;width: 40px;height: 40px;background: #8bc751;color: #fff;font-weight: bold;border-radius: 50%;line-height: 35px;visibility: visible;/* transform:rotate(90deg); */}
.navbar-toggler[aria-expanded="true"]{visibility: hidden;}

#widgetsControl, #widgetsControl_C { height: auto !important}

.RadDock .rdMiddle .rdCenter { background: transparent !important}

#HomepagecontentControl, #HomepagecontentControl_C {height: auto !important;margin: -11px -1px 0 -1px;}
.navbar-toggler-icon { background-image: url(image/menu.png)}


.body-fx footer {
    opacity: 1;
    transition: 0.3s;
    visibility: visible;
}

.body-fx #HeaderControl {
    float: Left;
    position: fixed;
    background: #040e33;
    z-index: 9;
    text-align: left;
    transition: 0.5s;
    top: 0;
}

.body-fx #MenuControl {
    float: Left;
    position: fixed;
    background-image: linear-gradient(90deg, #040e33, #0e9489);
    z-index: 9;
    transition: 0.5s;
    top: 0;
}

@media (min-width: 320px) and (max-width: 768px) {
    #HeaderControl{position: absolute;top: 0px;left:0;width: 70%;z-index: 999999999;padding: 5px 3%;}
    #MenuControl{position: absolute;top: 0;width: 30%; right: 0; padding: 0;}
    .navbar-toggler{ margin: 3px 15px 0 0;position: absolute;top: 5px;}

    .body-fx #HeaderControl { width: 75%; padding: 8px 6%; height: 65px !important}
    .body-fx #MenuControl { width: 30%; height: 65px !important}
}

@media (min-width: 320px) and (max-width: 768px) {
    .nav-fill .nav-item .nav-link{ font-size: 14px}
    .nav-fill .nav-item{text-align: right;padding:5px 10px;margin: 0; position: relative; z-index: 2;}
    .navbar-collapse{min-width: 50%;}
    .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:after{ top: 20px;right: 20px;width: 30px;height: 30px;  line-height: 25px;}
}