.gradient{
    filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=#f0f0f0,endcolorstr=#ffffff,gradientType=0);
    -ms-filter:alpha(opacity=100 finishopacity=50 style=1 startx=0,starty=0,finishx=0,finishy=150) progid:DXImageTransform.Microsoft.gradient(startcolorstr=#f0f0f0,endcolorstr=#ffffff,gradientType=0);/*IE8*/    
    background:#ffffff; 
    background:-moz-linear-gradient(top, #f0f0f0, #ffffff);  
    background:-o-linear-gradient(top, #f0f0f0, #ffffff); 
    background:-webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(#ffffff));  
    -webkit-background-origin: padding;
    -webkit-background-clip: content;
}

#left-ct {
    border: solid 1px #ffffff; 
    border-radius: 3px;
    display: inline-block;
    float: left;
    width: 24em;
}

#right-ct {
    display: inline-block;
    float: right;
    width: 40em;
}

.video-ct {
    text-align: center;
    margin: 1em 0;
}

.video-ct video {
    margin: 1em 0;
}

#brief-ct {
    margin-bottom: 3em;
}

#brief-ct .head {
    margin: 1em 2em;
    font-size: 1em;
    color: #a0a0a0;
}

#brief-ct .brief {
    margin: 0 2.5em;
    color: #404040;
    font-size: 0.8em;
}

#logo {
    max-width: 120px;
}

div.downloads {
    float: left;
    text-align: left;
    margin-top: 2em;
}

div.downloads .head {
    font-size: 0.7em;
    color: #606060;
}

div.downloads a {
    margin-left: 1.8em;
}

@media (max-device-width: 800px) {
    #left-ct {
        border: solid 1px #ffffff; 
        border-radius: 3px;
        display: inline-block;
        float: left;
        width: 100%;
    }

    #right-ct {
        display: inline-block;
        float: left;
        width: 100%;
    }
}


/* ----------------------------------------------------- */
#feature-ct {
    float: left;
    width: 40em;
}

#feature-ct td {
    background-color: #f6f6f6;
    font-size: 0.8em;
    padding: 0.2em 0.7em;
    border-bottom: solid 1px #ffffff;
    vertical-align: top;
    font-weight: 200;
}

#feature-ct .head {
    background-color: #e0e0e0;
    font-weight: 800;
    /*border-top: solid 1.2em #ffffff;*/
}

@media (max-device-width: 800px) { 
    #feature-ct {
        width: 100%;
        float: none;
        clear: none;
        padding: 0 !important;
    }
    
    #feature-ct td {
        background-color: #f6f6f6;
        font-size: 0.8em;
        /*padding: 0.2em 0.7em;*/
        border-bottom: solid 1px #ffffff;
        vertical-align: top;
        font-weight: 200;
    }
    
    #feature-ct .head {
        background-color: #e0e0e0;
        /*font-weight: 800;*/
        border-top: solid 1.2em #ffffff;
    }
}


/* LayerSlider Layers and Sublayers unique styles */
/* LayerSlider 例子，可以删除 --------------------- */
#layerslider {
    width: 1000px;
    height: 500px;
    margin: 0px auto 50px auto;
}

#leaf1 {
    left: 110px;
    top: -110px;
}

#leaf2 {
    left: -20px;
    top: 230px;
}

#leaf3 {
    left: 500px;
    top: -200px;
}

#clouds {
    left: -100px;
    top: -100px;
}

#earth {
    left: 850px;
    top: -67px;
}

#l5text1, #l5text2, #l5text3, #l5text4 {
    padding: 5px;
    text-align: center;
    color: #eee;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background-color: #000;
    background-color: rgba(255,255,255,.07);
    font-size: 17px;
}

#l5text1, #l5text2, #l5text3 {
    width: 120px;
    -webkit-transform: rotate(-30deg); 
    -moz-transform: rotate(-30deg); 
}

#l5text1 {
    left: 250px;
    top: 120px;
}

#l5text2 {
    left: 450px;
    top: 150px; 
}

#l5text3 {
    left: 620px;
    top: 150px;
}

#l5text4 {
    width: 250px;
    left: 500px;
    top: 400px;
    background-color: #000 !important;
}

#l5text4 a {
    color: #ddd;
    font-style: italic;
}

#l5text4 a:hover {
    color: #ddd;
    border-bottom: 1px dotted #ccc;
}

.ls-active #earth {
    -webkit-transition: all 20s ease-in-out;
    -moz-transition: all 20s ease-in-out;
    -o-transition: all 20s ease-in-out;
    -ms-transition: all 20s ease-in-out;    
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
}
/* ---------------------------------------------- */