html,body{
    background:url(image/cardboard.png);
    height:100%;
    padding:0;
    margin:0;
    min-width:1003px;
    text-shadow:0 1px 3px rgba(0, 0, 0, 0.75);
    color:#fff;
    font-family:Microsoft Yahei,"宋体";
    overflow:hidden;
}
li{
    list-style:none;
}
h3{
    font-weight:normal;
    text-align:center;
    height:30px;
    line-height:30px;
    font-size:16px;
}
.header{
    border-bottom:1px solid #575C62;
    text-align:center;
    margin:0;
    height:40px;
    line-height:40px;
    background:#26292d;
}
.wrapper{
    border-top:1px solid #282B2F;
    height:100%;
    /*
    display:box;
    display:-webkit-box;
    display:-moz-box;
    box-orient:horizontal;
    -webkit-box-orient:horizontal;
    */
}
.left{
    width:250px;
    border-right:1px solid #575C62;
    height:100%;
    overflow-y:auto;
    overflow-x:hidden;
    float:left;
    padding:0;
}
.right{
    /*
    box-flex:1;
    -webkit-box-flex:1;
    -moz-box-flex:1;
    */
    border-left:1px solid #282B2F;
    width:600px;
    float:left;
}
.effects{
    border-top:1px solid #575C62;
    border-bottom:1px solid #282B2F;
    padding:0;
}
.effects li{
    margin-left:0;
    border-top:1px solid #282B2F;
    border-bottom:1px solid #575C62;
    list-style:none;
     transition:all ease-in .2s;
    -webkit-transition:all ease-in .2s;
   height:80px;
   overflow:hidden;
}
.imgWrapper{
    margin:0px;
    margin-left:15px;
    padding:0;
    line-height:80px;
    border-top-left-radius:10px;
    border-bottom-left-radius:10px;
    width:250px;
    transition:all ease-in .2s;
    -webkit-transition:all ease-in .2s;
    position:relative;
    height:80px;
    cursor:pointer;
}
.imgWrapper img{
    margin:0;
    width:100px;
    height:60px;
    left:0;
    top:10px;
    position:absolute;
    border:none;
    border-radius:10px;
    z-index:3;
    cursor:pointer;
}
#infoMsg{
    position:absolute;
    top:170px;
    left:450px;
    z-index:9;
    width:100px;
    height:100px;
    text-align:center;
    line-height:100px;
    background:#333;
    border-radius:4px;
    opacity:0.7;
    display:none;
    color:#ccc;
}
.imgWrapper{
    width:250px;
    padding-left:110px;
}
.imgWrapper img:hover{
    box-shadow:0 0 10px #52cca0;
    -webkit-box-shadow:0 0 10px #52cca0;
    -moz-box-shadow:0 0 10px #52cca0;
}

.effects li:hover{
    background:#5344c3;
}
.picWrapper{
    position:relative;
    width:100%;
    height:500px;
}
.pic{
    position:absolute;
    left:0;
    top:0;
    2box-shadow:6px 6px 3px #333;
    2-webkit-box-shadow:6px 6px 3px #333;
}
.command{
    background:#27282b;
    background:-webkit-gradient(linear,left top,left bottom,from(#26292d),color-stop(50%,#27282b),to(#26292d));
    height:100px;
    border-top:1px solid #565555;
    border-bottom:1px solid #565555;
    position:fixed;
    bottom:0;
    width:100%;
    z-index:10;
}
.demoImg{
    float:left;
    margin-right:20px;
}
.demoImg li{
    list-style:none;
    display:inline-block;
    margin-left:10px;
    vertical-align:middle;
    text-align:center;
}
.d_item{
    width:80px;
    height:90px;
    overflow:hidden;
    position:relative;
}
.d_item img{
    width:80px;
    height:auto;
    border:3px solid rgb(45,45,45);
}
.lab{
    position:absolute;
    bottom:0;
    width:100%;
    text-align:center;
    padding-bottom:10px;
    font-size:12px;
}
.footer{
    float:right;
    margin-right:20px;
    margin-top:50px;
    font-size:12px;
    text-align:right;
}
.footer a{
    text-decoration:none;
    color:#fff;
}
.footer a:hover{
    text-decoration:underline;
}
/*
 * botton'
 * */
a.button{
    text-decoration:none;
    -moz-border-radius:5px;
    -webkit-border-radius:5px; 
    border-radius:5px;
    background: #E0B324;

    background: -moz-linear-gradient(0% 45% 90deg,#E0B324, #FAD121, #FFE678 100%);

    background: -webkit-gradient(linear, 0% 0%, 0% 65%, from(#FFE678), to(#E0B324), color-stop(.2,#FAD121));

    color:#312f30;
    float:left;
    font-family:arial,helvetica,sans-serif;
    font-size:17px;
    font-weight:bold;
    padding:10px 20px;
    text-shadow:1px 1px 0 #ebd663;
}

a.button:hover{
    background: #D4A922;
    background: -moz-linear-gradient(40% 51% 90deg,#D4A922, #EBC41F, #EDD670 100%);
    background: -webkit-gradient(linear, 0% 0%, 0% 65%, from(#EDD670), to(#D4A922), color-stop(.2,#EBC41F));
}

.command_items{
    float:left;
    margin-top:20px;
    margin-left:0;
    padding:0;
}
#open{
    display:none;
}
.d_item{
    cursor:pointer;
}