@charset "UTF-8";
/* Copyright (c) 2025 Zyxel GmbH */
@media all
{body{background:#fff; padding: 12px;}
body.cIframeBody{padding:0;}
#page_margins{width:980px;margin:0 auto;border:0px #889 solid;}
#page{background:#fff; border: 1px #999 solid;}
body{text-align:center;}
#page_margins{text-align:left;}
#header{color:#333388; cursor: default; padding: 0 12px 0 12px;}
#topnav{color:#aaa; background: transparent; z-index: 2;}
#header #topinfo{min-height:80px;z-index:1;display:-webkit-flex;display:flex;-webkit-align-items:center;-ms-flex-align:center;align-items:center;}
#header #topinfo #navigation{}
#header #topinfo #logo{display:block; margin: 0 34px 0 27px;}
#main #logo{display:none; margin: 15px 30px;}
#header #topinfo #logo #image,
#main #logo #image{background:url(../../../images/sas/logo.png) no-repeat;background-size:119px 27px;width:119px;height:27px;cursor:pointer;}
#header #topinfo #logo #text{font-size:10px; color: #999;}
#header #topinfo #boxname{display:block;-webkit-flex:1 1 auto;-ms-flex:1 1 auto;flex:1 1 auto;font-size:16px;color:#000;}
#header #topinfo #boxname span{font-size:16px;}
#header #topinfo #info{display:-webkit-flex;display:flex;-webkit-align-items:center;align-items:center;color:#000;}
#header #topinfo #info #system_service.system_info_module,
#header #topinfo #info #system_mode.system_info_module,
#header #topinfo #info #system_info.system_info_module{display:inline-block;margin:0 30px 0 0;}
#header #topinfo #info .system_info_module img{margin:0 1px;}
#header #topinfo #info .system_info_module img.security{display:none;}
#header #topinfo #info #system_mode.system_info_module label .alt{display:none;}
#header #topinfo #menu{display:block;}
#header #topinfo #menu #system_menu{display:none;background-color:#fff;margin:0 7px;padding:12px;position:absolute;border:1px solid #555;-moz-box-shadow:1px 2px 3px #555;-webkit-box-shadow:1px 2px 3px #555;box-shadow:1px 2px 3px #555;color:#000;top:65%;right:0;left:auto;z-index:1101;}
#header #topinfo #menu #system_menu.show{display:block; min-width: 130px;}
#header #topinfo #menu #system_menu .anchor{width:18px;height:18px;background-color:white;-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg);position:absolute;top:-6px;right:10px;}
#header #topinfo #menu #system_menu ul{list-style-type:none; margin: 0;}
#header #topinfo #menu #system_menu ul li{white-space:nowrap; margin: 0;}
#system_user.system_info_module,
#system_mode.system_info_module,
#system_language.system_info_module{display:-webkit-flex;display:flex;-webkit-justify-content:space-between;justify-content:space-between;-webkit-align-items:center;align-items:center;}
#system_language.system_info_module .active{color:#ff4c00;}
.menu_bar{display:inline-block;cursor:pointer;width:21px;height:21px;}
.menu_bar .bar{width:21px;height:3px;background-color:#333388;margin:4px 0;}
.menu_bar .rounded_bar{width:4px;height:4px;background-color:#333388;margin:3px auto;border-radius:4px;}
.menu_bar.active .bar,
.menu_bar.active .rounded_bar{background-color:#ff4c00;}
.cPageDisabled, .cPageDisabledLight{background:transparent;position:fixed;top:-10px;left:-10px;width:150%;height:150%;-moz-opacity:0.70;-khtml-opacity:0.7;opacity:0.7;filter:alpha(opacity=70);z-index:1100;}
.cPageDisabled{background:#a0a0a0 !important;}
#header #toptitle{min-height:19px;}
#header #toptitle #title{position:relative;display:inline;float:left;width:595px;margin:0 0 0 180px;}
#header #toptitle #title,
#header #toptitle #title *{font-size:16px;}
#header #toptitle #title a.active,
#header #toptitle #title span.active{font-weight:bold;}
.cLoadingData,
.cLoadingDataRight{padding-right:20px !important;background:url(../../../images/common/wait_animation_mini.gif) no-repeat scroll right transparent;}
.cLoadingDataLeft{padding-left:20px !important;background:url(../../../images/common/wait_animation_mini.gif) no-repeat scroll left transparent;}
.cLoadingDataError,
.cLoadingDataRightError{padding-right:19px !important;background:url(../../../images/common/icon_common_error.png) no-repeat scroll right transparent;}
.cLoadingDataLeftError{padding-left:19px !important;background:url(../../../images/common/icon_common_error.png) no-repeat scroll left transparent;}
#nav{color:#333388; display: none;}
#main{background:transparent; padding: 12px 0 0 12px; color: #000;}
#footer{padding:0 0 0 12px;}
#logout, #footer_button{height:47px; position: relative;}
#logout{float:left;width:168px;color:#999;text-align:center;white-space:nowrap;cursor:default;}
#footer_button{width:auto;margin-left:180px;background:url(../../../images/sas/background_footercontent.png) repeat-x;}
#footer_button #content{height:33px;border-left:1px solid #999;border-bottom:1px solid #999;}
#footer_button #device_info{min-height:14px;padding:0 12px 0 0;text-align:right;}
#logout, #logout *,
#footer_button, #footer_button *{font-size:10px;color:#999;}
#col1{width:168px; margin: 0;}
#col1_content{background:#fff;}
#col2, #col2_content{display:none;}
#col3{width:785px; margin: 0 0 0 180px; border-left: 1px solid #999; border-top: 1px solid #999;}
#col3_content{background:#fff; min-height: 574px; background: url(../../../images/sas/background_maincontent.png) repeat-x;}
.subcl{padding:0 0.5em 0 0}
.subcr{padding:0 0 0 0.5em}
#main_container{padding:12px;}
#info_container{padding:12px 12px 0 12px;}
#info_container_content{background-color:#fff; border: 1px solid #000;}
#info_container_content #message_content{min-height:35px; padding: 12px 12px 0 12px}
#info_container_content #message_content div{float:left; width: 35px; height: 35px;}
#info_container_content #message_content p{margin-left:35px; margin-bottom: 0;}
#info_container_content.cError{background-color:#8d080b; border: 1px solid #000;}
#info_container_content.cError #message_content{background:#8d080b url(../../../images/sas/background_errorinfocontainer.png) repeat-x;}
#info_container_content.cError #message_content div{background:url(../../../images/common/icon_common_error_2.png) no-repeat;}
#info_container_content.cError #message_content p{color:#fff;}
#info_container_content.cSuccess{border:1px solid #99cc87;}
#info_container_content.cSuccess #message_content div{}
#info_container_content.cWait{border:1px solid #f00;}
#info_container_content.cWait #message_content div{}
#button_content div{width:21px; height: 18px; float: right;}
#button_content div:hover{cursor:pointer;}
#button_content div.plus{background-position:6px 5px !important; background: url(../../../images/common/icon_maximize.png) no-repeat;}
#button_content div.minus{background-position:6px 5px !important; background: url(../../../images/common/icon_minimize.png) no-repeat;}
.cShortMessageLink{display:inline-block;padding:0 2px;}
.cShortMessageLink #element_info_container{position:absolute;display:block;border:1px solid #000;white-space:normal;width:300px;background-color:#eff0f2;z-index:99;}
#element_info_container{color:#333388; margin: 0; padding: 6px; text-align: justify;}
#element_info_container.cError{color:#f00;}
#element_info_container:hover{cursor:pointer;}
.cWaitAnimation{padding:10px 0 0 17px;}
iframe{background:#fff;padding:0;border:1px solid #999;width:100%;}
iframe.license{min-height:574px;}
.fr_center{background:none !important; margin: 0 !important; width: 100% !important;}
div#system_nav, div#system_nav_close{display:none;}
}
@media screen\0
{#header #topinfo{height:80px;}
}
@media (min-width:1025px){div#system_nav, div#system_nav_close{display:none;}
div#system_nav{width:21px;height:21px;background:url(../../../images/common/navigation.png) no-repeat;}
}
@media (max-width:1024px){div#page_margins{width:auto;}
div#toptitle div#title{margin:0 !important; width: auto !important;}
div#main{padding:12px 12px 0 12px !important;}
div#main_container{overflow:auto !important;}
div#col1{background:#fff; z-index: 1000; position: fixed; top: 0; left: -200px; max-width: 200px; width: 200px; height: 100% !important; overflow-y: auto !important;}
div#col1.show{z-index:1102; left: 0; box-shadow: 0.05rem 0.2rem 0.4rem #555;}
div#col1_content{padding:12px; height: auto !important; min-height: auto !important;}
div#col3{margin:0 !important; width: auto !important; border: 1px solid #ccc;}
div#col3_content{margin-bottom:12px !important; height: auto !important; min-height: auto !important;}
div#footer_button{margin-left:0; height: auto;}
div#footer_button div#content{display:none;}
div#logout{display:none; background: transparent;}
div#system_nav{display:block;}
#main #logo{display:block;}
div#system_nav_close{display:block;position:fixed;top:0;left:-20px;z-index:1102;width:20px;height:100%;}
div#system_nav_close div{width:19px;height:50px;margin-top:6px;border-left:1px solid #e0e0e0;background:#fff url(../../../images/common/nav_arrow_left.png) 0 16px no-repeat;box-shadow:0.1rem 0.1rem 0.1rem #555;}
div#system_nav_close.show{left:200px;}
div#col1, div#system_nav_close div{visibility:hidden;opacity:0;transition:visibility 0s linear 0.5s, opacity 0.5s linear;-webkit-transition:visibility 0s linear 0.5s, opacity 0.5s linear;-moz-transition:visibility 0s linear 0.5s, opacity 0.5s linear;}
div#col1.show, div#system_nav_close.show div{visibility:visible;opacity:1;transition-delay:0s;-webkit-transition-delay:0s;-moz-transition-delay:0s;}
}
@media screen and (max-width:900px){body{padding:6px;}
#header #topinfo{flex-wrap:wrap;}
#header #topinfo #navigation{margin-right:27px;}
#header #topinfo #logo{display:none;}
#header #topinfo #boxname{}
div#col3_content{height:auto !important; min-height: auto !important;}
div.c50l, div.c50r{float:none !important; width: auto !important; margin-left: 0; margin-right: 0;}
div.subcl, div.subcr{padding:0;}
}
@media (max-width:690px){#header #topinfo{padding-top:33px; min-height: 60px;}
#header #topinfo #info{margin:0 !important;}
#header #topinfo #info .system_info_module{margin:0 12px 0 0 !important;}
#header #topinfo #navigation{position:absolute;left:0;top:0;margin:12px 0 0 12px;}
#header #topinfo #menu{position:absolute;right:0;top:0;margin:12px 12px 0 0;}
#header #topinfo #menu #system_menu{top:35px;right:-8px;margin-right:0;}
}
@media (max-width:460px){#system_date #date{display:none;}
}
