@charset "utf-8";
.header_overflow { position: absolute; left:0; right:0; height:420px; overflow-x:hidden; background:transparent;}
.header { position: absolute; z-index:2000; left: 0; top: 0; right: 0; box-shadow: -4px 2px 4px rgba(0, 0, 0, 0.2);  height: 58px; background: url(../images/skinimages/header_bg.png) repeat-x;}
.header_logo { float: left; width:250px; height:60px;display: table;}
.header_logo>span{display: table-cell;vertical-align: middle;}
.header_logo>span>img{vertical-align: initial;margin-left: 20px;}
/*--------------header_menu--------------*/
.header_menu { float:left;}
.header_menu > li { float:left; display:block; width:70px; height:60px; margin-top:-1px; }
.header_menu > li > a { float:left; display:block; position:relative; width:100%; height:100%; }
.header_menu > li > a:hover { background:url(../images/skinimages/header_menuico.png) 0px -60px no-repeat;}
.header_menu > li.active > a { background:url(../images/skinimages/header_menuico.png) 0px 0px no-repeat;}
.header_menu > li > a > b { display:inline-block; position:absolute; right:15px; top:12px; width:10px; height:10px; border-radius:50%; box-shadow:1px 1px 0px rgba(0,0,0,0.1);}
.header_menu > li > a > i { display:inline-block; width:100%; height:100%; vertical-align:middle; background-image:url(../images/skinimages/header_menuico.png); }
.header_menu .headermenu_ico_myfile { background-position:0px -120px;}
.header_menu .headermenu_ico_companyfile { background-position:0px -180px;}
.header_menu .headermenu_ico_team { background-position:0px -240px;}
.header_menu .headermenu_ico_share { background-position:0px -300px;}
.header_menu .headermenu_ico_workflow {background-position: 0px -360px;}

/*--------------header_user--------------*/
.header_btn, .header_btn:hover, .header_btn:focus, .header_ico, .header_ico:hover, .header_ico:focus{ float: right; height: 58px; padding:0 10px; position:relative;}
.header_btn_content { display:block; margin-top:21px;}
.header_btn_content b  { display: block; float: left; width: 16px; height: 16px; }
.header_btn_content span { display: block; float: left; margin-left:8px; line-height: 16px; }
.header_btn_content .header_ico_lang { background: url(../images/skinimages/header_bg.png) 0px -160px no-repeat; }
.header_btn_content:hover .header_ico_lang { background: url(../images/skinimages/header_bg.png) 0px -140px no-repeat; }
.header_btn_content .header_ico_login { background: url(../images/skinimages/header_bg.png) -20px -140px no-repeat; }

/*--------------user_bar--------------*/
.user_bar, .user_bar:hover, .user_bar:focus { display: block; width:210px; margin:0px -12px; height:100%; color:inherit}
.header_btn .face { float: left; margin: 5px 0 0 8px;}
.header_btn .face > img { border-radius:50%;}
.header_btn .face .shadow{ display:block; position:absolute; width:50px; height:50px; border-radius:50%; box-shadow:2px 2px 3px rgba(0, 0, 0, 0.3) inset; }
.header_btn .caret { display: inline-block; float: right; width: 0; height: 0; margin: 25px 8px 0 0; border-right: 4px solid transparent; border-left: 4px solid transparent; border-top:4px solid transparent;  border-bottom: 0 dotted; content: ""; }
@media (max-width:1024px) {
.user_bar, .user_bar:hover, .user_bar:focus  { width:60px; }
.header_btn .face { margin: 15px 0 0 8px;}
.header_btn .face > img { width:30px; }
.header_btn .face .shadow{ width:30px; height:30px;  }
}
/*--------------user_menu & lang_menu--------------*/
.header .user_menu, .header .lang_menu { display: none; }
.header .open .user_menu:before, .header .open .lang_menu:before { position: absolute; z-index:1000; width: 0; height: 0; right: 2px; top: -7px; border-bottom: 7px solid #fff; border-right: 7px solid transparent; border-left: 7px solid transparent; border-top: 0 dotted; content: ""; }
.header .open .lang_menu:before { right:auto; left:8px;}
.header .open .user_menu, .header .open .lang_menu { display: block; position: absolute; right: 2px; margin-top: 2px; width:180px; padding: 5px 0; border: 1px solid #e1e1e8!important; background: #fff; border-radius: 4px; box-shadow: 0 6px 12px rgba(0,0,0,0.175); }
.header .open .lang_menu { width:120px; margin-top:39px; left:2px; right:auto;}
@media (max-width:1024px) {
.header .open .user_menu { padding-top: 74px;}
.header .open .lang_menu:before { right:8px; left:auto;}
.header .open .lang_menu { left:auto; right:2px;}
}

.header .open .user_menu > a, .header .open .user_menu > a:hover, .header .open .user_menu > a:focus, .header .open .lang_menu > a, .header .open .lang_menu > a:hover, .header .open .lang_menu > a:focus { display: block; float: left; width: 100%; padding:8px 0px 8px 15px; cursor: default; color:inherit; box-sizing:border-box; }
.header .open .user_menu > a:hover, .header .open .user_menu > a:focus, .header .open .lang_menu > a:hover, .header .open .lang_menu > a:focus { background: #f5f5f5; }
.header .open .user_menu b, .header .open .lang_menu b { display: block; float: left; margin: 0px 10px 0px 0px; width: 16px; height: 16px; }
.header .open .user_menu span, .header .open .lang_menu span { display: block; float: left; line-height: 16px; }
.header .open .user_menu .divider, .header .open .lang_menu .divider { display: block; float: left; width: 100%; height: 1px; margin: 5px 0; background: #e5e5e5; }
.header .open .user_menu .header_ico_user_info { background: url(../images/skinimages/header_bg.png) 0px -80px no-repeat!important; }
.header .open .user_menu .header_ico_user_sms { background: url(../images/skinimages/header_bg.png) 0px -120px no-repeat!important; }
.header .open .user_menu .header_ico_user_exit { background: url(../images/skinimages/header_bg.png) -24px -80px no-repeat!important; }
.header .open .user_menu .header_ico_feedback { background: url(../images/skinimages/header_bg.png) -24px -100px no-repeat!important; }
.header .open .user_menu .header_ico_myfeedback { background: url(../images/skinimages/header_bg.png) -0px -160px no-repeat!important; }
.header .open .user_menu .header_ico_help { background: url(../images/skinimages/header_bg.png) 0px -100px no-repeat!important; }
.header .open .user_menu .header_ico_calender { background: url(../images/skinimages/header_bg.png) -24px -120px no-repeat!important; }
.lang_ico_chinese { width:16px; height:16px; background: url(../images/publicimages/public_pic.png) -140px -90px no-repeat!important;}
.lang_ico_english { width:16px; height:16px; background: url(../images/publicimages/public_pic.png) -160px -90px no-repeat!important;}

/*--------------user_name--------------*/
.user_name { display: block; position: absolute; margin:8px 0 0 68px; width:123px; }
.user_name ul { display: block; float: none; }
.user_name .user_id { font-weight: bold; margin-bottom: 5px;}
.user_name .user_roomsize { font-size: 10px; }
.user_name .user_loading { display: block; position: relative; float: none; height: 4px; padding:1px; border: 1px solid transparent; }
.user_name .user_loading_num { float:left; height:4px; }
@media (max-width:1024px) {
.header .user_name { display: none; z-index:99999; position: absolute; width:180px; right:3px; top:62px; border-bottom:1px solid #e5e5e5; padding-bottom:10px; background-color:transparent;}
.header .open .user_name { display: block; }
.header .open .user_name ul { display: block; float: none; padding: 0 15px; position: relative; }
.header .open .user_name .user_id { margin-bottom: 10px; color:inherit;}
.header .open .user_name .user_roomsize { color: #7d838f; margin-bottom: 4px;}
.header .open .user_name .user_loading { border: 1px solid #d7d9e0; background: #edeff4; }
.header .open .user_name .user_loading_num { position: absolute; left: -1px; top: -1px; height: 6px; border: 1px solid #3f9a00; background: #66d21d; }
}
/*---------header_search---------*/
.header_search { float: right;  height: 58px; padding:0; margin-right:5px;}
.header_search .search_dropdown { margin-top:13px; position:relative;}
.header_search .btn_dropdown{ float:left; outline: 0; padding:0; width:60px; height:32px; border-radius:5px 0 0 5px; border-style:solid; border-width:1px 0px 1px 0;}
.header_search .open .btn_dropdown { border-radius:5px 0 0 0;}
.header_search .btn_dropdown .caret { display: inline-block; margin-left:3px; width: 0; height: 0; vertical-align:middle; border-width:4px 4px 0 4px; border-style:solid; border-color:transparent; content: ""; }
.header_search .open .btn_dropdown .caret,.header_search .open .btn_dropdown:hover .caret { margin-bottom:2px; border-bottom: 4px solid transparent; border-top: 0 dotted;}
.header_search .search_input, .header_search .search_input:focus { float:left; margin-top:13px; outline: 0; width:160px; padding:6px 0; height:32px; padding:0\9; line-height:30px\9; border-radius:0; border-style:solid; border-width:1px 0px 1px 0; }
.header_search .search_input:focus { box-shadow:none; }
.header_search .btn_search { float:left; margin-top:13px; outline: 0; padding-left:5px; width:26px; height:32px; border-radius:0 5px 5px 0; border-style:solid; border-width:1px 1px 1px 0; }
.header_search .btn_search .header_ico_search { display:block; width:16px; height:16px; background:url(../images/skinimages/header_bg.png) 0px -60px no-repeat!important; }
.header_search .btn_search:hover .header_ico_search { background:url(../images/skinimages/header_bg.png) -24px -60px no-repeat!important;}
/*--------------header_search   search_downmenu--------------*/
.header_search .search_downmenu { display:none; }
.header_search .open .search_downmenu { display:block; position:absolute; top:31px; padding:5px 0; width:80px; border-radius:0 0 5px 5px; border-style:solid; border-width:0 1px 1px 1px;}
.header_search .open .search_downmenu a { display:block; padding:7px 10px; }
.header_search .open .search_downmenu a:hover { cursor:default;}
.header_search .open .search_downmenu .divider { display:block; height:1px; border-bottom:1px solid transparent;}
.header_search .btn_moresearch { float:left; margin:20px 5px 0px 5px; outline: 0; border:0; background:transparent; }
@media (max-width:1024px) {
.header_search .btn_moresearch { width:58px; padding-left:0px; padding-right:0px; }
}
