﻿.profiledetail {
    width: auto;
    max-width: 150px;
    float: right;
    line-height:40px;
    background-color:#467EC5;
}
.profiledetail:hover{
    background-color: #29507E;
}
.shadow{
z-index:150;
border-bottom: 1px #cccccc solid;
-webkit-box-shadow: 0px 1px 1px #bbbbbb;
-moz-box-shadow: 0px 1px 1px #bbbbbb;
box-shadow: 0px 1px 1px #bbbbbb;
}
.ClearBoth{
clear:both;
}
.PointerSearch{
position: absolute;
background: url("../Default/Images/u832_2.png");
width: 16px;
height: 7px;
margin-top: -4px;
margin: -5px 0 0 534px;
left:0;
}
.PointerApps{
position: absolute;
background: url("../Default/Images/u832_2.png");
width: 16px;
height: 7px;
margin-top: -4px;
margin: -5px 0 0 363px;
left:0;
}
.PointerCreate{
position: absolute;
background: url("../Default/Images/u832_2.png");
width: 16px;
height: 7px;
margin-top: -4px;
margin: -5px 0 0 124px;
left:0;
}
.PointerAppSystem{
position: absolute;
background: url("../Default/Images/u832_2.png");
width: 16px;
height: 7px; 
margin: -25px 0 0 136px;
left:0;
}
.PointerToDo{
position: absolute;
background: url("../Default/Images/u832_2.png");
width: 16px;
height: 7px;
margin-top: -4px;
margin: -5px 0 0 87px;
left:0;
}
.PointerSetting{
position: absolute;
background: url("../Default/Images/u832_2.png");
width: 16px;
height: 7px;
margin-top: -4px;
margin: -5px 35px 0 0;
right:0;
}
  /*Header********************************************************************************************************/
#Header {
    width:100%;
    height:46px;
    background:#396CAC;
    /*border-bottom:1px #A6A6A6 solid;
	-webkit-box-shadow: 0px 0px 1px #A6A6A6;
	-moz-box-shadow: 0px 0px 1px #A6A6A6;
    box-shadow: 0px 0px 1px #A6A6A6;*/
    max-width:100%;
    min-width:1024px;
    min-height:46px;
    position:relative;
    z-index:100;
    top: 0;
}
#Header .MenuOrg{
    width:41px;
    height:46px;
    float:left;
    text-align: center;
    line-height: 35px; 
    cursor:pointer;
    background-color:#467EC5;
    }
#Header .MenuOrg img{
    margin-left: 3px;
    }
@media all and (max-width: 1150px) 
{ 
    #Header .LogoCRM {
        display:none;
    }
}
#Header .QuickMenu {
    float:left;
    width:535px;
    height:40px; 
    color: #FFFFFF;   
    /*position: absolute;*/
    left: 10.32%;
    background:#396CAC; 
}
#Header .QuickMenu .Home {
    float:left;
    width:90px;
    height: 46px;
    line-height:38px;
    text-align:center;
    color: white;
    padding-top: 2px;
}
#Header .QuickMenu .Home:hover{
   background :#467EC5;
}
#Header .QuickMenu .Home .ImgLogo{
    float:left;
    margin-left: 9px;
    line-height: 40px;
}
#Header .QuickMenu .Home .Apps{
    float:left;
    margin-left: 8px;
    line-height: 42px;
    color: white; 
}

#Header .QuickMenu .Application{
    width:80px;
    height: 46px;
    float:left;
    cursor:pointer; 
    padding:2px 0px 0px 5px;
}
#Header .QuickMenu .Application:hover{
    background :#467EC5;
}
#Header .QuickMenu .Application .ImgLogo{
    float:left;
    margin-left: 8px;
    line-height: 38px;
}
#Header .QuickMenu .Application .Apps{
    float:left;
    margin-left: 8px;
    line-height: 42px;
}
#Header .QuickMenu .Application .ImgMenu{
    float:left;
    margin-left: 5px;
    line-height: 42px;
}
#Header .QuickMenu .Create{
    width:130px;
    height: 46px;
    float:left;
    cursor:pointer; 
    padding :2px 0px 0px 4px;
}

#Header .QuickMenu .Create:hover{
   background :#467EC5;
}

#Header .QuickMenu .Create .ImgLogo{
    float:left;
    margin-left: 9px;
    line-height: 40px;
}
#Header .QuickMenu .Create .Apps{
    float:left;
    margin-left: 4px;
    line-height: 41px;
}
#Header .QuickMenu .Create .ImgMenu{
    float:left;
    margin-left: 5px;
    line-height: 42px;
}
#Header .QuickMenu .Todo{
    width:85px;
    height:40px;
    float:left;
    cursor:pointer;
}

#Header .QuickMenu .Todo:hover{
   background :#467EC5;
}

#Header .QuickMenu .Todo .ImgLogo{
    float:left;
    margin-left: 9px;
    line-height: 40px;
}
#Header .QuickMenu .Todo .Apps{
    float:left;
    margin-left: 4px;
    line-height: 41px;
}
#Header .QuickMenu .Todo .ImgMenu{
   float: right;
   width: 15px;
   margin-left: 5px;
   margin-top: -42px;
   line-height: 42px;
}
#Header .QuickMenu .MenuList{
    float:left;
    width:25px;
    height: 46px;
    line-height:40px;
    text-align:center;
    padding-top:2px;
}
#Header .QuickMenu .MenuList:hover{
     background :#467EC5;
}
#Header .QuickMenu #line_rigth {
   float:left;
   width:10px;
   height: 46px; 
   text-align:center;
   line-height: 40px;
}
#Header .LogoCRM{
    float: left;
    line-height: 34px;
    position: absolute;
    left: 47.2%;
}
#Header .QuickMenuRight{
    float:right;
    width: auto;
    height: 46px; 
    color: #FFFFFF;
/* position: absolute; */
    right: 10.32%;
    background: #396CAC; 
}
#Header .Reminder-Bell{
    float:right;
    width: 30px;
    height: 40px;
    font-size:14px;
    color: #FFFFFF;
    right: 10.32%;
    background: #396CAC;
    padding-top:2px;
}
#Header .QuickMenuRight .RightMenu{
   width: auto;
   height: 40px;
   float: left;
   cursor: pointer;
   /*padding-top:2px;*/
}
#Header .QuickMenuRight #line_rigth2 {
   float:left;
   width:10px;
   height: 40px; 
   text-align: right;
   line-height: 40px;
}
#Header .QuickMenuRight .RightMenu .ImgLogo{
    float: right;
    margin-left: 5px;
    line-height: 38px;
}
#Header .QuickMenuRight .RightMenu .Apps{
    float: left;
    margin-left: 10px; 
    width:110px;
    max-width:110px;
}
#Header .QuickMenuRight .RightMenu .ImgMenu{
    float: left;   
    margin : 0 10px 0 5px;
}
#Header .QuickMenuRight .HeadLogout {
    float:right;
   /*margin-right:10px;
    line-height: 26px;*/ 
    width: 40px;
    height: 46px;
    padding-top: 2px;
}
#Header .QuickMenuRight .HeadLogout:hover {
    background: #467EC5;
}
#Header .QuickMenuRight .HeadLogout .mp-img-logout{
    background:url("../Default/Images/icon-logout.png") no-repeat;
    background-size:20px 20px;
    background-position :10px 10px;
    cursor:pointer;
    width:100%;
    height:100%;
}
#Header .QuickMenuRight .HeadLogout .LogImage {
   width: 20px;
   height: 22px;
   margin-top: 10px;
   cursor: pointer;
}
#Header .QuickMenuRight .HeadLogout .Logtxt {
    float: left;
    margin-left : 20px;
    margin-top:-16px;
    cursor: pointer;
    color: white;
}

#Header .QuickMenuRight .Setting {
    float: left;
    width: 40px;
    height: 46px;
    line-height: 38px;
    text-align: center;
    cursor: pointer;
    color: white;
    padding-top: 2px;
}
#Header .QuickMenuRight .Setting:hover {
    background: #467EC5;
}
#Header .QuickMenuRight .UpgradNow{
    float:left;
    width:237px;
    margin-top: -3px;
    height:33px;
    background:url("../Default/Images/u223.png") no-repeat;
    margin-right:24px;
}
#Header .QuickMenuRight .UpgradNow .Txt{
    padding: 7px 14px 0 12px;
    /*font-weight: 700;*/
    font-family:'SegoeUI';
    font-weight:bold;
    font-size: 11px;
    color: #396CAC;
    float:left;
}
#Header .QuickMenuRight .UpgradNow .BtnUpgrad{
    font-family: 'SegoeUI-Bold';
    float:left;
    width:80px;
    height:17px;
    background:url("../Default/Images/u500.png") 2px 0px no-repeat; 
    margin: 7px -13px;
    /*font-weight: 700;*/
    font-size: 10px;
    color: #FFFFFF;
    padding: 1px 0px;
    text-align: center
}

  /*Content*********************************************************************************************************/
#content{
    margin:auto auto;
    margin-top:15px;
    margin-bottom:45px;

    width:100%;  
    float:left;
    height:100%!important;
    min-height:700px;
    position:relative; 
    bottom:0px;
    top:0px;
}
#content div.main{
margin: 0 5.78% 0 5.78%;
width: 88.44%;
min-width: 974px;
/*min-height:800px;*/
min-width:974px;
float:left;
}
#content div.main .main_l {
float:left;
width:73.57%;
min-height:600px;
padding:20px;
background-color:#FFF; 
min-width:715px;
/*margin-bottom:35px;*/
}
#content div.main .main_r {
padding:20px;
margin-left:1.07%;
width:25.35%;
float:left;
height:370px;  
background-color:#FFF;
margin-bottom:10px;      
min-width:234px;    
}
#content div.main .main_r .HeaderMain_r {
width:100%;
height:70px;
         
}
#content div.main .main_r .HeaderMain_r .Tiele_r {
width:145px;
float:left;
         
}
#content div.main .main_r .HeaderMain_r .Title_r .ImgHead_r{
float:left;
}
#content div.main .main_r .HeaderMain_r .Title_r .TitleHead_r{
font-size: 20px;
color: #396CAC;
float:left;
margin-left:10px;
}
#content div.main .main_r .HeaderMain_r .Menu_r {
float:right;   
}
#content div.main .main_r .HeaderMain_r .TextDetail{
color: #333333;
text-align: left;
margin-top:10px;
      
}
#content div.main .main_r2 {
padding:10px;
margin-left:1.07%;
width:25.35%;
float:left;
height:340px;  
background-color:#FFF;
margin-bottom:10px;      
min-width:234px;    

}
/* Menu left********************************************************************************************************/
.company-caret{
position: absolute;
background: url("../Default/Images/u832_2.png");
width: 14px;
height: 7px; 
left: 11px;
z-index: 1000;
display: none;
top: 41px; 
}
#SlideRight{
width: auto; 
min-width:275px; 
max-width:650px; 
min-height:260px;
max-height:467px; 
background-color: white;
position:absolute;
display: none;  
z-index:100;
top: 46px; 
color:black; 
padding:15px 0px 10px 20px; 
border: solid #CCCCCC 1px;
    /*background: -webkit-linear-gradient(#FFF, #EEEEEE); /* For Safari 5.1 to 6.0 
    background: -o-linear-gradient(#FFF, #EEEEEE);  For Opera 11.1 to 12.0 
    background: -moz-linear-gradient(#FFF, #EEEEEE);  For Firefox 3.6 to 15 
    background: linear-gradient(#FFF, #EEEEEE);  Standard syntax (must be last) */
}
.company-wrapper{
    width:100%; 
    height:100%; 
    max-height:340px;  
    float:left; 
}
#SlideRight .Search{
width: 100%;
height: 12px;
}
#SlideRight .Search .MenuLeft{
float: right;
width: 29px;
height: 36px;
margin-top: 6px;
text-align:center;
}
#SlideRight ul.HeadOrg{
width:100%;
height:auto;
padding: 0px; 
float:left;
margin:0px;
list-style:none;
}  
#SlideRight ul.HeadOrg li {
    width:100px;
    max-width: 100px;
    min-width: 100px;
    height:140px;
    float:left;
    text-align:center;
    margin-right:20px; 
    margin-bottom:10px;
}
#SlideRight ul.company-footer{
    height:30px; 
    padding:0px;
    list-style:none;
    width:100%;
    float:left;  
    border-top: 1px solid #ccc;
    margin:0px;
}
#SlideRight ul.company-footer li{
    width:124px;
    float:left;
    padding-left:5px;
    margin-top:10px;
}
#SlideRight ul.company-footer li.icon-usermanual{
    background-image:url('../Default/Images/icon-usermanual.png'); 
    background-repeat :no-repeat;
    background-position: 0%;
    background-size: 16px;
    padding-left: 20px;
}
#SlideRight ul.company-footer li.icon-tutorial{
    background-image:url('../Default/Images/icon-tutorial.png'); 
    background-repeat :no-repeat;
    background-position: 0%;
    background-size: 16px;
    padding-left: 20px;
}
#SlideRight ul.company-footer li.icon-faq{
    background-image:url('../Default/Images/icon-faq.png'); 
    background-repeat :no-repeat;
    background-position: 0%;
    background-size: 16px;
    padding-left: 20px;
}
#SlideRight ul.company-footer2{
    height:30px; 
    padding:0px;
    list-style:none;
    width:100%;
    float:left;  
    margin:0px;
}
#SlideRight ul.company-footer2 li{
    width:124px;
    float:left;
    padding-left:5px;
    margin-top:10px;
}
#SlideRight ul.company-footer2 li.icon-tel{
    background-image:url('../Default/Images/tel.png'); 
    background-repeat :no-repeat;
    background-position: 0%;
    background-size: 16px;
    padding-left: 20px;
}
#SlideRight ul.company-footer2 li.icon-contactus{
    background-image:url('../Default/Images/contact.png'); 
    background-repeat :no-repeat;
    background-position: 0%;
    background-size: 16px;
    padding-left: 20px;
}
#SlideRight .HeadOrg .HeadOrgImg{ 
}
#SlideRight .HeadOrg .HeadOrgImg-focus{
border-radius: 50%;
border: 2px solid #4DAD75;
width: 100px;
height: 100px;
}
#SlideRight .HeadOrg .HeadOrgContent{
width: 100px; 
height:auto;
float:left;
} 
#SlideRight .HeadOrg .HeadOrgSeting{
width: 47px;
height: 35px;
float:left;
text-align:center;       
       
}

#SlideRight .HeadOrg .HeadOrgName{
    width:100%;   
}  
#SlideRight .HeadOrg .OrgName{
        width:100%; 
    color:#999999;
    cursor:pointer;
}
#SlideRight .HeadOrg .OrgName:hover{
    color:#333;
}
#SlideRight .OrgNameMenuLeft img{
margin-top: -15px;
}
#SlideRight .HeadOrg  .company-select{
    border:2px solid #4DAD75;
}
#SlideRight .HeadOrg .company-other{
    border:2px solid #ccc; 
    cursor:pointer;
}
#SlideRight .HeadOrg .company-other-hover{ 
    background-color: white;
    opacity: 0.1;  
    background-size:80px;
    cursor:pointer;
} 
.btn-comp-menu{
    width:50px;
    height:25px;
    background-color:#249D56;
    border-radius:4px; 
    color: white;
    padding: 3px;
    margin:-73px 0px 0px 27px;
    display:none;  
}
.btn-Admin-menu{
    width:50px;
    height:25px;
    background-color:#249D56;
    border-radius:4px; 
    color: white;
    padding: 3px;
    margin:-73px 0px 0px 27px;
    display:none;  
}
#SlideRight .OrgNameMenuLeft{
width: 100%; 
font-size: 18px;
color: #396CAC;
}

#SlideRight ul{
padding: 0 0 0 20px;
}
#SlideRight ul li{
list-style: none;
}
#SlideRight ul li .Org{
width: 235px;
height: 45px;
float: none;
margin-top: -3px;
}
#SlideRight ul li .Org .OrgImg{
float: left;
width: 36px;
height: 36px;
text-align: center;
}
/*#SlideRight ul li .Org .OrgName {
width: 185px;
margin-left: 6px;
float: left;
color: #FFF;
font-size: 14px;
}
#SlideRight ul li .Org .OrgName a {
color: #FFF;
text-decoration: none;
cursor: pointer;
}
#SlideRight ul li .Org .OrgName a:hover {
color: #0099FF;
}*/
#SlideRight .Setting{
width: 100%;
padding: 0 0 0px 20px;
font-size: 16px;
color: #0099FF;
margin-bottom: 2px;
}
#SlideRight .Setting img{
margin-top: -15px;
}
#SlideRight .MenuSetting{
width:100%;
color: #FFFFFF;
font-size: 14px;
padding-left:20px;
margin-bottom: 9px;
}
#SlideRight .Help{
width: 100%;
padding: 9px 0 0px 20px;
font-size: 16px;
color: #0099FF;
margin-bottom: 3px;
}
#SlideRight .Help img{
margin-top: -15px;
}
#SlideRight .MenuSetting{
width:100%;
color: #FFFFFF;
font-size: 14px;
padding-left:20px;
margin-bottom: 9px;
}
#SlideRight .MenuLeftFooter {
width: 225px;    
text-align: center;    
margin-bottom: 5px;    
font-size: 12px;    
color: #FFF;    
bottom: 0px;    
position: absolute;   
}
  /* AppSlideDown *******************************************************************************************/
#Header #MenuSlideDown{
font-family:'SegoeUI-SemiLight';
position:absolute;
width: 100%;	
height: auto;	
background-color: #FFFFFF;		
display: none;		 	
z-index:250;
top: 46px;      
	}
#Header #MenuSlideDown .ContainerApps{
width: 88.44%;
height:auto;
margin: auto auto;
}
#Header #MenuSlideDown .ContainerApps .SearchApps {
width:100%; 
height:100px;    
padding: 20px 8px;
min-width: 890px;    
}
#Header #MenuSlideDown .ContainerApps .TitleApps{
width:141px;    
height:87px;     
font-weight: 300;    
font-style: normal;    
font-size: 50px;    
color: #396CAC;    
float:left;    
}
#Header #MenuSlideDown .ContainerApps .BoxSearch{
float: left;
width: 496px;
height: 50px;
margin: 31px 6px 0 0;
}
#Header #MenuSlideDown .ContainerApps .BoxSearch .SearchBoxApps{
border: 1px solid;
width: 350px;
height: 25px;
color: #CCCCCC;
border-radius:0;
}
#Header #MenuSlideDown .ContainerApps .LeftRightMore{
    width:100px;
    height:50px;
    float:right;
    margin: 24px -16px 0 0;
}
#Header #MenuSlideDown .ContainerApps .LeftMore{
    width:30px;
    height:40px;
    float:right;
    text-align: center;
    line-height: 34px;
    border:1px #001940 solid;
}
#Header #MenuSlideDown .ContainerApps .LeftMore:hover{
    border:1px #11478A solid;
    background-color:#002255;
}
#Header #MenuSlideDown .ContainerApps .RightMore{
    width: 30px;
    height: 40px;
    float: right;
    text-align: center;
    line-height: 34px;
    margin-left: 10px;
    border:1px #001940 solid;
}
#Header #MenuSlideDown .ContainerApps .RightMore:hover {
    border:1px #11478A solid;
    background-color:#002255;
}
#Header #MenuSlideDown .ContainerApps ul.GroupCol{
    /*width:100%;*/
    height:380px;
    min-width:500px;
    margin:0;
}
#Header #MenuSlideDown .ContainerApps ul.GroupCol li{
    width:350px;
    float:left;
}
#Header #MenuSlideDown .ContainerApps ul.GroupCol li .CateApps{
    width:320px;
    height:auto;      
	margin-left:8px;
    font-size: 16px;
    color: #000000;
    margin-bottom:20px;
}
#Header #MenuSlideDown .ContainerApps .CateApps{
	/*margin-left:8px;*/
    font-size: 18px;
    margin-bottom:20px;
}
#Header #MenuSlideDown .ContainerApps .CateApps a{
    color: #000000;
    text-decoration: none;
}
#Header #MenuSlideDown .ContainerApps .CateApps a:hover{
	 color: #396CAC;
}


#Header #MenuSlideDown .ContainerApps ul.GroupCol li .CateApps img{
    margin-top: -16px;  
}
#Header #MenuSlideDown .ContainerApps ul{
    padding:0px;
    float:left;
    list-style:none;   
    width: 320px;
    margin: -6px 7px;
}
#Header #MenuSlideDown .ContainerApps ul li{
    margin-bottom: 21px;
}
#Header #MenuSlideDown .ContainerApps .ImgApps{
    width:44px;
    height:75px;
    float:left;
    margin-right: 15px;
}
#Header #MenuSlideDown .ContainerApps .AppsName a{
    font-size: 16px;
    height: 23px;
    line-height:24px;
    color: #000000;
}
#Header #MenuSlideDown .ContainerApps .AppsName a:hover{
    color: #396CAC;
    text-decoration: none;
}
#Header #MenuSlideDown .ContainerApps .ManageApps a{
    color: #396CAC;
    height:17px;
    line-height: 20px;
    cursor:pointer;
}
 /* SearchSlideDown *****************************************************************************************/
#Header #MenuSearch{
position:absolute;
width: 100%;		
height: 760px;		
background-color: #FFFFFF;		
display: none;		
border-bottom: 1px #cccccc solid;		
-webkit-box-shadow: 0px 1px 1px #bbbbbb;		
-moz-box-shadow: 0px 1px 1px #bbbbbb;		
box-shadow: 0px 1px 1px #bbbbbb;		
z-index:250;
top: 46px;     

    /*background: -webkit-linear-gradient(#FFF, #EEEEEE); /* For Safari 5.1 to 6.0 */
   /* background: -o-linear-gradient(#FFF, #EEEEEE); /* For Opera 11.1 to 12.0 */
   /* background: -moz-linear-gradient(#FFF, #EEEEEE); /* For Firefox 3.6 to 15 */
   /* background: linear-gradient(#FFF, #EEEEEE); /* Standard syntax (must be last) */   
}
#Header #MenuSearch .ContainerSearch{
width: 88.44%;
height: 760px;
margin: auto auto;
}
#Header #MenuSearch .ContainerSearch .SearchBoxSearch {
width:100%;    
height:100px;    
padding: 26px 0 0 8px;
min-width: 891px;    

}
#Header #MenuSearch .ContainerSearch .TitleSearch{
width:350px;    
height:87px;     
font-family:'SegoeUI-SemiLight';
font-weight: 300;    
font-size: 40px;    
color: #396CAC;    
float:left;    
}
#Header #MenuSearch .ContainerSearch .BoxSearch{
float: left;
height: 50px;
margin: 12px 0 0 11px;
}
#Header #MenuSearch .ContainerSearch .BoxSearch .SearchBoxApps{
width: 400px;
height: 40px;
color: #999999;
font-size: 16px;
border-radius: 0px;
border:1px #CCCCCC solid;
}
#Header #MenuSearch .ContainerSearch .LeftRightMore{
width: 100px;
height: 50px;
float: right;
margin: 12px -8px 0 0;
}
#Header #MenuSearch .ContainerSearch .LeftMore{
    width:30px;
    height:40px;
    float:right;
    text-align: center;
    line-height: 34px;
    border:1px #FFFFFF solid;
}
#Header #MenuSearch .ContainerSearch .LeftMore:hover{
    border:1px #3C89E7 solid;
}
#Header #MenuSearch .ContainerSearch .RightMore{
    width: 30px;
    height: 40px;
    float: right;
    text-align: center;
    line-height: 34px;
    margin-left: 10px;
    border:1px #FFFFFF solid;
}
#Header #MenuSearch .ContainerSearch .RightMore:hover {
    border:1px #3C89E7 solid;
}
#Header #MenuSearch .ContainerSearch ul.GroupCol{
    list-style:none;
    padding:0px;
    width:100%;
}
#Header #MenuSearch .ContainerSearch ul.GroupCol li{
    width: 100%;
    float:left;
}
#Header #MenuSearch .ContainerSearch ul.GroupCol li .CateSearch{
    width:100%;
    height:auto;      
	margin: 4px 0px 3px 10px;
    font-size: 18px;
    color: #999999;
}
#Header #MenuSearch .ContainerSearch ul.GroupCol li .CateSearch ul.CateSearchMenu{
margin: 0;
width: 70%;
height: 32px;
  padding:0px;
    float:left;
    list-style:none; 
}
#Header #MenuSearch .ContainerSearch ul.GroupCol li .CateSearch ul.CateSearchMenu li {
   margin-right:26px;
   width: auto;
   float: left;
}
#Header #MenuSearch .ContainerSearch ul.GroupCol li .CateSearch ul.CateSearchMenu li.active {
   color:#333333;
}
#Header #MenuSearch .ContainerSearch ul.GroupCol li .CateSearch .TotleResult{
    float:left;
    width:30%;
    height:30px;
    text-align:right;
    color:#333333;
}
#Header #MenuSearch .ContainerSearch ul.GroupCol li .CateSearch img{
    margin-top: -31px;  
}
#Header #MenuSearch .ContainerSearch ul.SearchResult{
    float:left;
    list-style:none;   
    width: 465px;
    padding: 0 0 0 10px;
    margin-bottom:50px;
}
#Header #MenuSearch .ContainerSearch ul.SearchResult li{
    width:400px;
    height:auto;
    margin-bottom: 7px;
}
#Header #MenuSearch .ContainerSearch ul.SearchResult li.System{
    font-size: 14px;
}
#Header #MenuSearch .ContainerSearch ul.SearchResult li.Create{
    font-size: 14px; 
} 
a.searchCateL{
   color: #999999;
   text-decoration:none;
}
a.searchCateL:link{
     color: #999999;
    text-decoration:none;
}
a.searchCateL:hover{
    color: #333333;
    text-decoration:none;
}
a.searchCateL:active{
    color: #333333;
    text-decoration:none;
}
a.searchL{
     color:#333333;
}
a.searchL:link {
    color:#333333;
text-decoration:none;
}
a.searchL:hover {
color: #396CAC;
text-decoration:none;
}
.searchGreen{
    color:#57996C;
}
 /*QuickCreation ************************************************************************************************/
#QuickCreation{
width: 380px !important;
display:none;
position: absolute;
top: 46px;
margin-left: 320px;
height: 170px;
background-color: #FFFFFF; 
-webkit-box-shadow: 0px 0px 1px #acacac;
-moz-box-shadow: 0px 0px 1px #acacac;
box-shadow: 0px 0px 1px #acacac;
z-index: 250;

    /*background: -webkit-linear-gradient(#FFF, #EEEEEE); /* For Safari 5.1 to 6.0 */
    /*background: -o-linear-gradient(#FFF, #EEEEEE); /* For Opera 11.1 to 12.0 */
    /*background: -moz-linear-gradient(#FFF, #EEEEEE); /* For Firefox 3.6 to 15 */
    /*background: linear-gradient(#FFF, #EEEEEE); /* Standard syntax (must be last) */
}
#QuickCreation .Quick{
width:190px;
height:200px;
float:left;
}
#QuickCreation .Quick .Title{
width: 50px;
height: 25px;
margin: 17px 0 0 26px;
font-size: 14px;
color: #000000; 
}
#QuickCreation .Quick ul{
width:190px;
list-style:none;
margin-top: 6px;
padding:0px;
margin-left: 20px;
}
#QuickCreation .Quick ul li{
width:150px;
height:25px;
color: #396CAC;
line-height: 25px;
margin-bottom: 1px;
padding-left:8px;
}
#QuickCreation .Quick ul li a{
    text-decoration: none;
}
#QuickCreation .Quick ul li a img{
margin: -4px 4px 0px 9px;
}
#QuickCreation .Quick ul li:hover{
width:150px;
height:25px;
background:#F2F2F2;
cursor:pointer;
}
#QuickCreation .Ativity{
width:180px;
height:220px;
float:left;
}
#QuickCreation .Ativity .Title{
width: 115px;
height: 25px;
margin: 17px 0 0 26px;
font-size: 14px;
color: #000000; 
}
#QuickCreation .Ativity ul{
width:165px;
list-style:none;
margin-top: 6px;
padding:0px;
margin-left: 27px;
}
#QuickCreation .Ativity ul li{
width:150px;
height:25px;
color: #396CAC;
line-height: 25px;
margin-bottom: 1px
}
#QuickCreation .Ativity ul li a{
    text-decoration: none;
}
#QuickCreation .Ativity ul li a img{
margin: -4px 3px 0px 7px;
}
#QuickCreation .Ativity ul li:hover{
width:150px;
height:25px;
background:#F2F2F2;
}
/*------------------------------QuickTodo---------------------------*/
#QuickTodo{
width: 200px !important;
display:none;
position: absolute;
top: 40px;
margin-left: 242px;
height: auto;
background-color: #FFFFFF;
border: 1px #396CAC solid;
-webkit-box-shadow: 0px 0px 1px #acacac;
-moz-box-shadow: 0px 0px 1px #acacac;
box-shadow: 0px 0px 1px #acacac;
z-index: 250;
}
#QuickTodo .ToDo{
width:190px;
height:200px;
float:left;
}
#QuickTodo .ToDo .Title{
width: 50px;
height: 25px;
margin: 17px 0 0 26px;
font-size: 14px;
color: #000000;
font-weight: 700;
}
#QuickTodo .ToDo ul{
width:190px;
list-style:none;
margin-top: 6px;
padding:0px;
margin-left: 20px;
}
#QuickTodo .ToDo ul li{
width:150px;
height:25px;
font-size:14px;
color: #396CAC;
line-height: 25px;
margin-bottom: 1px
}
#QuickTodo .ToDo ul li a{
    text-decoration: none;
}
#QuickTodo .ToDo ul li a img{
margin: -4px 4px 0px 9px;
}
#QuickTodo .ToDo ul li:hover{
width:150px;
height:25px;
background:#F2F2F2;
}
/*Setting RightMenu SlideDown ****************************************************************************/
#Header .package-detail{
    width:145px;
    height: 40px;
    background-color:#13BA8F;
    float:right; 
    padding-top:10px;
    text-align:center;
    margin:3px 10px 0 0;
    cursor:pointer;
    padding-left: 5px;
    padding-right: 5px;
}
#Header .manage-profile{
    float:right;
    margin-top:3px;
}
#Header .MenuProFile{
width:300px !important;
height:auto;
position:absolute; 
background-color:#FFF; 
padding: 0px;
background:#fff;
top: 46px;
right:119px; /*80*/
display:none;
color: #000;
font-size:14px; 		
-webkit-box-shadow: 0px 1px 1px #9A9A9A;		
-moz-box-shadow: 0px 1px 1px #9A9A9A;		
box-shadow: 0px 1px 1px #9A9A9A;		
z-index:560;
 
}
#Header .MenuProFile .ProFile { 
margin:10px;
}
#Header .MenuProFile .profile-info{
    height:160px;
    width:100%;
    float:left;
    text-align:center;
    padding:0px 20px 20px 20px; 
    background:#fff;
}
#Header .MenuProFile .profile-info.h180{
    height:180px;
}
#Header .MenuProFile .change-member{
    padding:10px 10px 0 10px;
}
#Header .MenuProFile .profile-info .profile-img{
    margin:10px;
}
#Header .MenuProFile .profile-info .profile-name{
    max-width:100%;
}
#Header .MenuProFile .profile-info .profile-email{
    max-width:100%;
}

#Header .MenuProFile .company-info{
    height: 60px;
    width: 100%;
    float: left;
    border-top: 1px solid #ccc; 
    padding: 10px 20px 10px 20px;
    background: #fff;
}
#Header .MenuProFile .company-info img{
    float:left;
}
#Header .MenuProFile .company-info .company-name{
    float:left;
    width:190px;
    margin-left: 10px;
}
#Header .MenuProFile .company-info .singlecomp{ 
    height:35px; 
    padding-top:10px;
}
#Header .MenuProFile .company-info a{
    float:left;
    margin-left: 10px;
}
#Header .MenuProFile .nolink-edit-Language{
    height:40px;
    width:50%;
    float:left; 
    border-top:1px solid #ccc;
    color:#3987e6;

    padding:10px 20px 10px 20px;
    background:#fff;
}

#Header .MenuProFile .link-edit-Language{
    height:40px;
    width:50%;
    float:left; 
    border-top:1px solid #ccc;
    cursor:pointer;

    padding:10px 20px 10px 20px;
    background:#fff;
}
#Header .MenuProFile .link-edit-Language:hover{
    background:#f2f2f2;
    color:#3987e6;
}

#Header .MenuProFile .nolink-edit-Language .icon-LanguageTH-header{ 
    background: url("../Default/Images/thai-color.png");
    width:20px;
    height:13px;
    background-size:20px 13px; 
    float:left;
    margin-right:10px;
    margin-top:2px;
}

#Header .MenuProFile .nolink-edit-Language .icon-LanguageEN-header{ 
    background: url("../Default/Images/eng-color.png");
    width:20px;
    height:13px;
    background-size:20px 13px; 
    float:left;
    margin-right:10px;
    margin-top:2px;
}

#Header .MenuProFile .link-edit-Language .icon-LanguageTH-header{
    background: url("../Default/Images/thai-gray.png");
    width:20px;
    height:13px;
    background-size:20px 13px; 
    float:left;
    margin-right:10px;
    margin-top:2px;
}

#Header .MenuProFile .link-edit-Language:hover .icon-LanguageTH-header{
    background: url("../Default/Images/thai-color.png");
    width:20px;
    height:13px;
    background-size:20px 13px; 
    float:left;
    margin-right:10px;
    margin-top:2px;
}

#Header .MenuProFile .link-edit-Language .icon-LanguageEN-header{
    background: url("../Default/Images/eng-gray.png");
    width:20px;
    height:13px;
    background-size:20px 13px; 
    float:left;
    margin-right:10px;
    margin-top:2px;
}

#Header .MenuProFile .link-edit-Language:hover .icon-LanguageEN-header{
    background: url("../Default/Images/eng-color.png");
    width:20px;
    height:13px;
    background-size:20px 13px; 
    float:left;
    margin-right:10px;
    margin-top:2px;
}

#Header .MenuProFile .link-edit-profile{
    height:40px;
    width:100%;
    float:left; 
    border-top:1px solid #ccc;
    cursor:pointer;
    padding:10px 20px 10px 20px;
    background:#fff;
}
#Header .MenuProFile .link-edit-profile:hover{
    background:#f2f2f2;
    color:#3987e6;
}
#Header .MenuProFile .link-logout{
    width:100%;
    height:40px;
    float:left; 
    border-top:1px solid #ccc;
    cursor:pointer; 
    padding:10px 20px 10px 20px;
    background:#fff;
}
#Header .MenuProFile .link-logout:hover{
    background:#f2f2f2;
    color:#3987e6;
}
#Header .MenuProFile .link-edit-profile .icon-edit-header{ 
    background: url("../Default/Images/icon-edit3.png");
    width:20px;
    height:20px;
    background-size:20px 20px; 
    float:left;
    margin-right:5px;
}

#Header .MenuProFile .link-edit-profile:hover .icon-edit-header{ 
    background: url("../Default/Images/icon-edit3-hover.png");
    width:20px;
    height:20px;
    background-size:20px 20px; 
    float:left;
    margin-right:5px;
}

#Header .MenuProFile .link-logout .icon-logout-header{ 
    background: url("../Default/Images/icon-logout2.png");
    width:20px;
    height:20px;
    background-size:20px 20px; 
    float:left;
    margin-right:5px;
}

#Header .MenuProFile .link-logout:hover .icon-logout-header{ 
    background: url("../Default/Images/icon-logout2-hover.png");
    width:20px;
    height:20px;
    background-size:20px 20px; 
    float:left;
    margin-right:5px;
}
/*#Header .MenuProFile .ProFile .ImgProFile {
width: 80px;
height: 80px;
}
#Header .MenuProFile .ProFile .txtProFile {
float: left;
margin-left: 90px;
width: 135px;
margin-top: -80px;
}
#Header .MenuProFile .ProFile .txtProFile .txtName {
font-size: 14px;
color: #396CAC;
}
#Header .MenuProFile .ProFile .btnProFile {
float: left;
margin-left: 90px;
width: 135px;
margin-top: -20px;
}*/
/*#Header .MenuProFile .ProFile {
width:198px;
height:91px;
border-bottom: 1px #396CAC solid;
}
#Header .MenuProFile .ProFile .ListProFile {
text-indent:10px;
width:198px;
height:30px;
line-height: 30px;
}
#Header .MenuProFile .ProFile .ListProFile:hover {
background-color:#F2F2F2;
}
#Header .MenuProFile .Logout {
text-indent:10px;
width:198px;
height:30px;
line-height: 30px;
}
#Header .MenuProFile .Logout img{
margin: -4px 8px 0 0;
}
#Header .MenuProFile .Logout:hover {
background-color:#F2F2F2;
}*/
/*Chat  ********************************************************************************************************/
.Chat{
    width:200px;
    height:30px;
    position:fixed;
    right:15px;
    bottom:0px;
    border:1px #CCCCCC solid;
    padding: 3px 0 0 10px;
    font-size:14px;
    color: #000000;
    cursor:pointer;
    z-index:990;
    background: #5bc1e3;
background: -moz-linear-gradient(top, #FCFCFC 24%, #E4E4E4 72%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(24%,#FCFCFC), color-stop(72%,#E4E4E4));
background: -webkit-linear-gradient(top, #FCFCFC 24%,#E4E4E4 72%);
background: -o-linear-gradient(top, #FCFCFC 24%,#E4E4E4 72%);
background: -ms-linear-gradient(top, #FCFCFC 24%,#E4E4E4 72%);
background: linear-gradient(to bottom, #FCFCFC 24%,#E4E4E4 72%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FCFCFC', endColorstr='#E4E4E4',GradientType=0 );
}
.Chat .SChat {
    float:left;
}
.Chat .WChat{
    margin:0 0 0 10px;
    float:left;
}
/*MainChat  *****************************************************************************************************/
#MainChat{
width:400px !important;
height:450px;
position:fixed;
background-color:#FFFFFF;
right: 15px;
bottom: 0px;
border:1px #E4E4E4 solid;
font-size: 14px;
color: #000000;
display:none;
z-index: 550;
}
#MainChat .HeaderChat{
width:398px;
height:25px;
background-color:#396CAC;
color: #FFFFFF;
font-weight: 700;
font-size:14px;
} 
#MainChat .HeaderChat .ChatMessage{
width:320px;
height:25px;
float:left;
line-height: 25px;
padding-left: 65px;
text-align:center;
}
#MainChat .HeaderChat .ChatMessage img{
/*margin: -5px 6px 0 0;*/
}
#MainChat .HeaderChat .ChatMenu{
width:25px;
height:25px;
float:left;
text-align: center;
}
#MainChat .HeaderChat .ChatMenu:hover{
/*background-color:#F2F2F2;*/
}
#MainChat .UserContact{
width: 398px;
min-height: 60px;
border-bottom: 1px #E4E4E4 solid;
padding: 0px 0px 0px 14px;
}
#MainChat .UserContact:hover{
background-color:#F2F2F2;
}
#MainChat .UserContact .ImgUserChat{
float:left;
width:55px;
height:60px;
line-height: 53px;
}
#MainChat .UserContact .LastMessageChat {
font-size:14px;
color: #333333;
height: auto;
width: 355px;
padding: 9px 0 0 2px;
}
#MainChat .UserContact .TimeChat {
font-size: 11px;
color: #999999;
padding: 3px 0 5px 2px;
}
#MainChat .NotiChat {
background:url("../Default/Images/statusChat.png") 375px 23px no-repeat  #ECF3FD;
}
/*MoreChact  *************************************************************************************************/
#MoreChat{
width:400px !important;
height:450px;
position:fixed;
background-color:#FFFFFF;
right: 15px;
bottom: 0px;
border:1px #E4E4E4 solid;
font-size: 14px;
color: #000000;
display:none;
z-index: 550;
}
#MoreChat .HeaderMoreChat{
width:398px;
height:25px;
background-color:#396CAC;
color: #FFFFFF;
font-weight: 700;
font-size:14px;
} 
#MoreChat .HeaderMoreChat .MoreChatMessage{
width:320px;
height:25px;
float:left;
line-height: 25px;
padding-left: 108px;
}
#MoreChat .HeaderMoreChat .MoreChatMessage img{
margin: -5px 6px 0 0;
}
#MoreChat .HeaderMoreChat .MoreChatMenu{
width:25px;
height:25px;
float:left;
text-align: center;
line-height: 20px;
font-size: 14px;
}
#MoreChat .HeaderMoreChat .MoreMessageChat{
    width:398px;
    height:45px;
    border-bottom:1px #E4E4E4 solid;
    background-color:#F8F8F8;
    color: #000000;
    font-size: 14px;
    line-height: 28px;
    font-weight: 400;
}
#MoreChat .HeaderMoreChat .MoreMessageChat .MoreChatImg{
        width:50px;
        height:50px;
        margin: -12px 0 0 15px;
        position:absolute;
    }
#MoreChat .HeaderMoreChat .MoreMessageChat .MoreChatName{
        margin: 0 0 0 75px;
        line-height: 45px;
        float:left;
    }
#MoreChat .HeaderMoreChat .MoreMessageChat .MoreChatStatus{
        margin: 0 10px 0 0;
        line-height: 40px;
        float:right;
    }
#MoreChat .MoreChatContent{
    width:100%;
    height:100%
}
#MoreChat .MoreChatContent .MoreMessage {
    font-style: italic;
    font-size: 11px;
    color: #999999;
    text-align:center;
    width:100%;
    height: 30px;
    line-height: 30px;
}
/*MyContact  ****************************************************************************************************/
#MyContact{
width:400px !important;
height:450px;
position:fixed;
background-color:#FFFFFF;
right: 15px;
bottom: 0px;
border:1px #E4E4E4 solid;
font-size: 14px;
color: #000000;
display:none;
z-index: 550;
}
#MyContact .HeaderMyContact{
width:398px;
height:25px;
background-color:#396CAC;
color: #FFFFFF;
font-weight: 700;
font-size:14px;
} 
#MyContact .HeaderMyContact .MyContactChat{
width:320px;
height:25px;
float:left;
line-height: 25px;
padding-left: 108px;
}
#MyContact .HeaderMyContact .MyContactChat img{
margin: -5px 6px 0 0;
}
#MyContact .HeaderMyContact .MyContactChatMenu{
width:25px;
height:25px;
float:left;
text-align: center;
line-height: 20px;
font-size: 14px;
}
#MyContact .SearchMyContact{
    width:398px;
    height:45px;
    border-bottom:1px #E4E4E4 solid;
    color: #999999;
    font-size:14px;
    line-height: 45px;
    padding-left: 9px;
}
#MyContact .ContentMyContact{
    width:398px;
    min-height:60px;
    border-bottom:1px #E4E4E4 solid;
    padding: 0px 0px 0px 14px;
}
#MyContact .ContentMyContact:hover{
    background-color: #F2F2F2;
}
#MyContact .ContentMyContact .MyContactUser{
    width:310px;  
    float:left;
}
#MyContact .ContentMyContact .MyContactUser .ImgMyContact{
float:left;
width:49px;
height:59px;
line-height: 53px;
}
#MyContact .ContentMyContact .MyContactUser .LastMyContact {
font-size: 14px;
color: #333333;
float:left;
height: 23px;
width: 250px;
padding: 9px 2px;
}
#MyContact .ContentMyContact .MyContactUser .RankMyContact {
font-size:14px;
color: #666666;
padding: 9px 0 0 2px;
float: left;
}
#MyContact .ContentMyContact .MyContactMessage{
    float:left;
    width:65px;
    height:60px;
}
#MyContact .ContentMyContact .MyContactMessage .ChatContact{
    float:left;
    padding: 17px 0 0 18px;
}
#MyContact .ContentMyContact .MyContactMessage .EmailContact{
  float:left;
  padding: 17px 0 0 12px;
}
 /* Notification  **********************************************************************************************/
.Notification{
    width:35px;
    height:30px;
    line-height: 25px;
    text-align: center;
    position:fixed;
    right:220px;
    bottom:0px;
    border:1px #CCCCCC solid;
    background: -moz-linear-gradient(top, #FCFCFC 24%, #E4E4E4 72%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(24%,#FCFCFC), color-stop(72%,#E4E4E4));
    background: -webkit-linear-gradient(top, #FCFCFC 24%,#E4E4E4 72%);
    background: -o-linear-gradient(top, #FCFCFC 24%,#E4E4E4 72%);
    background: -ms-linear-gradient(top, #FCFCFC 24%,#E4E4E4 72%);
    background: linear-gradient(to bottom, #FCFCFC 24%,#E4E4E4 72%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FCFCFC', endColorstr='#E4E4E4',GradientType=0 );
    z-index:990;
}
 /*Main Notification  ****************************************************************************************/
#MainNotification{
width:300px !important;
min-height:450px;
position:fixed;
background-color:#FFFFFF;
right: 220px;
bottom: 0px;
border:1px #E4E4E4 solid;
font-size: 14px;
color: #000000;
display:none;
z-index: 560;
}
#MainNotification .HeaderNotification{
width:298px;
height:25px;
background-color:#396CAC;
color: #FFFFFF;
} 
#MainNotification .HeaderNotification .NotificationMessage{
width: 270px;
height: 25px;
float: left;
line-height: 25px;
padding-left: 100px;
}
#MainNotification .HeaderNotification .NotificationMessage img{
margin: -5px 10px 0 0;
}
#MainNotification .HeaderNotification .NotificationMenu{
width:25px;
height:25px;
float:left;
text-align: center;
line-height: 20px;
}
#MainNotification .NotificationContact{
width:298px;
min-height: 79px;
border-bottom:1px #E4E4E4 solid;  
}
#MainNotification .NotificationContact:hover{
background-color:#F2F2F2;
}
#MainNotification .NotificationContact .ImgNotification{
float:left;
width: 65px;
height: 70px;
line-height: 61px;
padding:0px 18px;
}
#MainNotification .NotificationContact .NotificationDetail {
font-size:14px;
color: #333333;
float:left;
height: auto;
width: 220px;
padding: 13px 0 5px 3px;
}
#MainNotification .NotificationContact .ContactNameNoti{
font-weight: 700;
float:left; 
height: 15px;
width: 210px;
}
#MainNotification .NotificationContact .ContactNotiStatus{
font-weight: 400;
}
#MainNotification .NotificationContact .TimeNotification {
font-size: 11px;
color: #999999;
padding: 0 0 0 69px;
}
#MainNotification .NotificationContact p {
font-size: 11px;
color: #333333;
padding:5px;
border:1px #CCCCCC solid;
margin: 5px 20px 10px 69px;
background:#F8F8F8;
}
.body-wrapper{
    width:100%;
    height:100%;
    min-width:100%;
    min-height:100%;
    position:relative;
    float:left;
}

.body-footer{
    width: 100%;
    height: 35px;
    background-color: #396cac; 
    float:left;
    font-size:14px;
    color:#FFFFFF;
    position:relative;
    /*top:30px;*/
    bottom:0px!important;
} 
.body-footer .footer-wrapper{ 
    margin:0;
    float:left;
    width:100%;
    height: 35px;
    min-width:1200px;
}
.body-footer .footer-wrapper .footer-copyright{
    float:left;
    width:auto;
    text-align:left; 
    padding:7px;
}
.body-footer .footer-wrapper .footer-package{
    float:left;
    width:auto;
    text-align:right; 
    padding:7px;
    margin-right:20px;
}
.body-footer .footer-wrapper .footer-menu{
    float:left;
    width:50%;
    text-align:right; 
    padding:7px;
}
.body-footer .footer-wrapper .footer-menu .footer-menu-list{
    list-style:none;
    float:right;
    margin:0px;
}
.body-footer .footer-wrapper .footer-menu .footer-menu-list li{ 
    float:left; 
}
.body-footer .footer-wrapper .footer-menu .footer-menu-list li a{
    color:#000;
}
.body-footer .footer-wrapper .footer-menu .footer-menu-list li span{
    margin:0 7px 0 7px;
}

.body-footer .footer-wrapper a{
    color:#fff;
    margin-left:15px;
}
.body-footer .footer-wrapper span{
    color:#fff;
    margin-left:15px;
}
@media all and (max-width: 920px) {
    .div-apps {
        width: 100%;
    }
}
a.last-update{
    color:#49CA27;
    text-decoration:underline;
}


    /*#MenuSlideDown{
        overflow:auto;
        max-height:700px;
    }
}*/

/*Footer  ************************************************************************************************************/
/*@media all and  (min-width: 1900px){ 
    .body-footer{
        position:fixed;
    }
}*/
#Header .app_system_wrap{
    float: left;
    min-width:180px;
    width:36%;
    height: 46px;
    line-height: 38px;
    text-align: center;
    color: white;
    padding-top: 2px;
    padding-left: 20px;
    font-size:20px; 
    font-family: 'SegoeUI-Light';
    cursor:pointer;
    background-color:#467EC5;
}
#Header .app_system_wrap .appname{
    width:100%;
    float:left;
    text-align:left;
}



/*#Header .QuickMenu .app_system_wrap:hover{
   background :#467EC5;
}*/
#Header #app_system_list_wrap{
    width: auto;
    display:none;
    position: absolute;
    top: 46px;
    background-color: #FFFFFF; 
    -webkit-box-shadow: 0px 0px 1px #acacac;
    -moz-box-shadow: 0px 0px 1px #acacac;
    box-shadow: 0px 0px 1px #acacac;
    z-index: 250; 
    padding:10px;
}
#Header #app_system_list_wrap .app_system_list{
    width:100%;
    float:left;
}
#Header #app_system_list_wrap .app_system_list .app_system{
    width:130px;
    height:120px;
    float:left;
    cursor:pointer;
    position:relative;
} 
#Header #app_system_list_wrap .app_system_list .app_system .app_coming_soon_tran{
    position:absolute;
    top:0;
    width:100px;
    height:100px;
    background-color:#FFFFFF;
    opacity: 0.4;
    cursor:default;
}
#Header #app_system_list_wrap .app_system_list .app_system .app_coming_soon {
    width:75px;
    height:30px;
    margin:auto auto;
    position:absolute; 
    top: 35px;
    left: 13px;
    cursor:default;
}
#Header #app_system_list_wrap .app_system_list .app_system:not(:first-child){
    margin-left:10px;
}
#Header #app_system_list_wrap .app_system_list .app_system.appbg_blue{
    /*background-color:#396CAC;*/ 
    width: 100px;
    height: 100px;
    background: url('/Content/Default/Images/icon-iSales_100x100.png') center no-repeat;
    display: inline-block;
    background-size: 100px 100px;
    cursor:pointer;
}
#Header #app_system_list_wrap .app_system_list .app_system.appbg_skyblue{ 
    /*background-color:#40B1D3;*/ 
    width: 100px;
    height: 100px;
    background: url('/Content/Default/Images/icon-iPurchases_100x100.png') center no-repeat;
    display: inline-block;
    background-size: 100px 100px;
    cursor:pointer;
}
    #Header #app_system_list_wrap .app_system_list .app_system.appbg_Purple {
        width: 100px;
        height: 100px;
        background: url('/Content/Default/Images/icon-iService100x100.png') center no-repeat;
        display: inline-block;
        background-size: 100px 100px;
        cursor: pointer;
    }
#Header #app_system_list_wrap .app_system_list .app_system.appbg_manager{ 
    /*background-color:#40B1D3;*/ 
    width: 100px;
    height: 100px;
    background: url('/Content/Default/Images/icon-Manager_100x100.png') center no-repeat;
    display: inline-block;
    background-size: 100px 100px;
    cursor:pointer;
}
#Header #app_system_list_wrap .app_system_list .app_system.app_istplue{ 
    /*background-color:#40B1D3;*/ 
    width: 100px;
    height: 100px;
    background: url('/Content/Default/Images/icon-iStore_100x100.png') center no-repeat;
    display: inline-block;
   background-size: 100px 100px;
    cursor:pointer;
}
#Header #app_system_list_wrap .app_system_list .app_system.app_crmmobileBlue{ 
    /*background-color:#40B1D3;*/ 
    width: 100px;
    height: 100px;
    background: url('/Content/Default/Images/icon-Mobile_100x100.png') center no-repeat;
    display: inline-block;
    background-size: 100px 100px;
    cursor:pointer;
}
#Header #app_system_list_wrap .app_system_list .app_system.appbg_green{
    /*background-color:#3DA870;*/  
    opacity:0.7;
}
#Header #app_system_list_wrap .app_system_list .app_system.appbg_blue:hover{
    /*background-color:#315C93;*/
    opacity:0.7; 
}
    #Header #app_system_list_wrap .app_system_list .app_system.appbg_Purple:hover {
        /*background-color:#2C9BBC;*/
        opacity: 0.7;
    }
#Header #app_system_list_wrap .app_system_list .app_system.appbg_skyblue:hover{ 
    /*background-color:#2C9BBC;*/ 
    opacity:0.7;
}
#Header #app_system_list_wrap .app_system_list .app_system.appbg_manager:hover{ 
    /*background-color:#348F60;*/
    opacity:0.7; 
}
#Header #app_system_list_wrap .app_system_list .app_system.app_istplue:hover{ 
    /*background-color:#348F60;*/
    opacity:0.7; 
}
#Header #app_system_list_wrap .app_system_list .app_system.appbg_green:hover{
    background-color:#396CAC; 
}
#Header #app_system_list_wrap .app_system_list .app_system.app_crmmobileBlue:hover{
    /*background-color:#315C93;*/
    opacity:0.7; 
}
#Header #app_system_list_wrap .app_system_list .app_system .app_icon{
    width:40px;
    height:40px;
    margin:30px auto 0px auto; 
    background-size:40px 40px;
}
#Header #app_system_list_wrap .app_system_list .app_system .app_icon.app_salueauto{ 
    background-image:url("../Default/Images/icon-app-saleauto.png");
}
#Header #app_system_list_wrap .app_system_list .app_system .app_icon.app_po{
    background-image:url("../Default/Images/icon-app-po.png");
}
#Header #app_system_list_wrap .app_system_list .app_system .app_icon.app_serviceauto{
    background-image:url("../Default/Images/icon-app-serviceauto.png");
}
#Header #app_system_list_wrap .app_system_list .app_system .app_name{
    width:100%;
    font-size:13px;
    color:#FFFFFF;
    text-align:center;
    margin-top:10px;
}
 

#Header .PackageDetailWrapper{
    width:300px !important;
    height:auto;
    position:absolute; 
    background-color:#FFF; 
    padding: 20px;
    background:#fff;
    top: 46px;
    right:119px;
    display:none;
    color: #000;
    font-size:14px; 		
    -webkit-box-shadow: 0px 1px 1px #9A9A9A;		
    -moz-box-shadow: 0px 1px 1px #9A9A9A;		
    box-shadow: 0px 1px 1px #9A9A9A;		
    z-index:560; 
}
#Header .PackageDetailWrapperLicense{
    width:418px !important;
    height:auto;
    position:absolute; 
    background-color:#FFF; 
    padding: 20px;
    background:#fff;
    top: 46px;
    right:1px;
    display:none;
    color: #000;
    font-size:14px; 		
    -webkit-box-shadow: 0px 1px 1px #9A9A9A;		
    -moz-box-shadow: 0px 1px 1px #9A9A9A;		
    box-shadow: 0px 1px 1px #9A9A9A;		
    z-index:560; 
}
#Header .PackageDetailWrapper span{
    color:#3399CC;
}
#Header .PackageDetailWrapper a{
    width: 80px;
    height: 35px;
    background-color: #13BA8F;
    padding-top: 7px;
    text-align: center; 
    cursor: pointer;
    float: left;
    color: #fff;
    text-decoration: none; 
    margin: 10px 0px 0px 58px;
}
