html, body {
    margin: 0;
    padding: 0;
}

.mainContentPane, .loginControl, input,
 .Login , .leftPanel *, .headerMenu{
   
    font-family: '微軟正黑體', '微软雅黑', 'Verdana', 'Arial';
    font-size: 15px;
    letter-spacing: 1px;
    line-height: 120%;

}
.title { padding:10px; background-color:#f0f0f0;
         display:block; font-size:x-large;  font-weight:bold;
}
.logo {
    width: 183px;
    height: 51px;
    background-image: url(logo.png);
    background-repeat: no-repeat;
    display: block;
    overflow: hidden;
}

body {
    margin: 0;
    padding: 0;
    color: #000000;
    letter-spacing: 1px;
    margin: 0;
    padding: 0;
    background: #ffffff url() center center fixed no-repeat;
    -moz-background-size: cover;
    background-size: cover;
    line-height: 1;
    -webkit-text-size-adjust: none;
}
.language { /*position:absolute; */ float:right; 
            position:relative; margin-top:-26px; margin-right:10px; font-size:13px;
}

.li2 , .li3{  margin:0px; padding:0px;
      list-style-image:url(../../Images/bullet-1.gif);
      padding-left:20px;
      -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
          box-sizing: border-box;

}
.li2 li{
       float:left; width:45%; 
       margin:5px 0 0 20px; 
}
.li3 li{
 margin:10px 20px; 
}
/*
@media (max-width: 900px) { 
    .li li{ float:none; width:auto;
}
}
*/
/********tab*********/

.tab
{
    border-collapse: collapse;
    border: 1px solid #c2c2c2;
    width: 100%;
}
.tab td
{
    padding: 5px;
    border: 1px solid #c2c2c2;
}
.tab_title {  background-color:#f3f3f3;
}
/* Button */
/*
input[type="button"],
input[type="submit"],
input[type="reset"],
button,
*/
.button {
    background-color: #2a5fc0;
    position: relative;
    display: inline-block;
    border-radius: 0.35em;
    color: #fff !important;
    text-decoration: none;
    padding: 10px 20px;
    border: 0;
    cursor: pointer;
    background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15)), url("images/overlay.png");
    background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15)), url("images/overlay.png");
    background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15)), url("images/overlay.png");
    background-image: linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15)), url("images/overlay.png");
    -moz-transition: background-color 0.35s ease-in-out;
    -webkit-transition: background-color 0.35s ease-in-out;
    -ms-transition: background-color 0.35s ease-in-out;
    transition: background-color 0.35s ease-in-out;
    /*
    font-size: 16px;*/
}

    input[type="button"]:hover,
    input[type="submit"]:hover,
    input[type="reset"]:hover,
    button:hover,
    .button:hover {
        background-color: #ff9c00;
    }

    input[type="button"]:active,
    input[type="submit"]:active,
    input[type="reset"]:active,
    button:active,
    .button:active {
        background-color: #57b100; 
    }


.ImageButton { border:1px solid #c0c0c0;  float:left;
              
                padding:4px 7px 5px 7px;
}
    .ImageButton:hover { background-color:#0072c6;
    }

.bu { padding:5px; border:1px solid #cccccc;  text-decoration:none;
      display:inline-block; 
      box-shadow: inset 0px -20px 60px -45px #000000; 
        -webkit-border-radius: 5px;
       -moz-border-radius: 5px;
       border-radius: 5px; 

}
    .bu:hover { position:relative; top:1px;
    }
/* Login */

.Login {
    -moz-box-shadow: 10px 10px 20px -10px #000000, inset 0px -20px 70px -55px #000000, inset 0px 0px 1px 0px #666666;
    -webkit-box-shadow: 10px 10px 20px -10px #000000, inset 0px -20px 70px -55px #000000, inset 0px 0px 1px 0px #666666;
    box-shadow: 10px 10px 20px -10px #000000, inset 0px -20px 70px -55px #000000, inset 0px 0px 1px 0px #666666;
    width: 100%;
    max-width: 500px;
    margin: 100px auto;
    background-image: url(white.png);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 0px solid #ffffff;
    padding: 50px 20px;
    
}

.number {
    float: right;
   
    padding: 0px;  position:relative; 
    height:60px;
}

.number_refresh { position:absolute; top:0px; left:0px; 
}


.Login table {
    /*   margin:50px auto;
    font-family:微軟正黑體; width:85%;
  
    background-color:#ffffff;  
     -webkit-border-radius:5px;
     -moz-border-radius: 5px;
      border-radius:5px; 
      border:1px solid #c0b7ba;
      display:block; padding:20px;
   */
}
/*
.Login blockquote { background-color:#ffffff;  
     -webkit-border-radius:5px;
     -moz-border-radius: 5px;
      border-radius:5px; 
      
      padding:30px;

    -moz-box-shadow:  0px 0px 15px -8px #000000;
    -webkit-box-shadow: 0px 0px 15px -8px #000000;
    box-shadow:  0px 0px 15px -8px #000000;
}
*/

.Login td, .Login tr {
    white-space: nowrap;
    padding: 10px;
}



img {
    vertical-align: middle;
}
/*
.Login input[type="text"],
.Login input[type="password"]
*/
.input {
    width: 95%;
    border: 0px;
    vertical-align: middle;
    background-color: #ffffff;
    padding: 6px 10px;
    color: #000000;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: inset 1px 1px 9px -5px #000000;
    -webkit-box-shadow: inset 1px 2px 9px -5px #000000;
    box-shadow: inset 1px 1px 9px -5px #000000;
    line-height: 18px;
    border: 1px solid #cccccc;
}

input[type="text"]:hover, input[type="password"]:hover {
    border: 1px solid #2a5fc0;
}



/******LoginView*******/
/*
.LoginView { background-image:url(black.png);
             padding:20px;
             margin:20px;
             box-shadow:inset 3px 3px 8px -5px #000000;
             border-right:1px solid #3b4450;
             border-bottom:1px solid #3b4450;
              -webkit-border-radius:5px;
     -moz-border-radius: 5px;
      border-radius:5px; 
      text-align:left; font-size:13px; 
}

    .LoginView b { margin-left:10px;
    }

.LoginMsg { background-color:#2b61c1; padding:20px;
             -webkit-border-radius:5px;
     -moz-border-radius: 5px;
      border-radius:5px;  line-height:150%; margin:5px 0;
}
.LoginMsg a { background-color:#ffffff;
              display:block; padding:3px; text-align:center;
              text-decoration:none; letter-spacing:5px;  line-height:150%;
              font-weight:bold; color:#ffffff;
             
              border-right:1px solid #001b67;
              border-bottom:1px solid #001b67;
               -webkit-border-radius:5px;
     -moz-border-radius: 5px;
      border-radius:5px; 
      background-image:url(shadow.png); 
      background-repeat:repeat-x; color:#072592; margin-top:10px;
       
      
    }
    .LoginMsg a:hover {
                       background-color:#ff9000; color:#ffffff;

    }

.map {
}
.map a {text-decoration:none;
    }

*/

/* Header */
.dxpnl-edge.t.headerPane {
    background-color: #EDEDED;
    background-position: left top;
    background-repeat: no-repeat;
}

    .dxpnl-edge.t.headerPane.panel {
        padding: 0;
    }

.headerMenu {
    border-width: 0!important;
    border-top-width: 1px!important;
}

.expandedPanel {
    padding: 2px!important;
}

    .expandedPanel .headerMenu {
        border-top-width: 0!important;
    }

    .expandedPanel .headerTop {
        /*
        display: none;*/
    }

.templateTitle {
    float: left;
    margin: 10px 18px;
    /*
    margin: 12px 12px 18px;*/
}

.dxpnl-edge.t.headerPane.bar .templateTitle {
    margin: 0;
}

.templateTitle a {
    text-decoration: none;
    font-size: x-large;
    color: black;
}
/**/
.loginControl {
    float: right;
    margin: 30px 10px;
}

    .loginControl a {
        color: black;
        text-decoration: none;
        border-bottom: dashed 1px black;
        display: inline-block;
    }


/* Footer */
.dxpnl-edge.b.footerPane {
    background-color: #EDEDED;
}

    .dxpnl-edge.b.footerPane.panel {
        padding: 0;
    }

.footerMenu {
    float: right;
    padding-top: 7px;
}

.copyright {
    /* float: left;
   
    margin: 100px 15px 11px;*/
}

.content {
    padding: 5px;
}

/* Left Panel */
.leftPane.panel {
    padding: 1px;
    width: 200px;
}

/* Right Panel */
.rightPane.panel {
    padding: 0;
    width: 250px;
}

/* Account */
.accountHeader h2 {
    margin: 10px 0 7px 0;
    font-size: 16px;
}

.accountHeader p {
    margin: 0;
    padding: 0;
}

.accountHeader {
    margin-bottom: 20px;
}

.form-field {
    margin-bottom: 8px;
}


input[readonly="readonly"] { display:none;
}



@media (max-width: 500px) {
    .dxpnlControl_PlasticBlue.dxpnl-edge.t.headerPane {
        background-color: #4f64a5;
        box-shadow: 0px 0px 30px -7px #000000, inset 0px -50px 60px -55px #000000;
        color: #FFFFFF;
    }


    .dxpnlControl_PlasticBlue .loginControl a,
    .dxpnlControl_PlasticBlue .templateTitle a {
        color: White;
        font-size: large;
        font-weight: bold;
    }

    .Login {
        margin-top: 10px;
    }

    .welcome {
        position: absolute;
        top: 15px;
        right: 15px;
        z-index: 100;
        display: block;
    }

    .logo {
        display: none;
    }

    .Login td {
        float: left; display:block; width:90%;
    }
    /**/

}


div.leftZone,
div.rightZone
{
    width:49.8%; 
}
@media (max-width: 900px) {
    div.leftZone,
div.rightZone
{
    width:100%; 
}
}