/* CSS Document */

hr { border-top: 1px solid #D4D4D4; height: 0; margin: 15px 0; }

input { background-color: #ffffff; border: 1px solid #cccccc; transition: border linear 0.2s, box-shadow linear 0.2s; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); padding: 5px 10px; }

    input:focus { border-color: rgba(240, 114, 65, 0.8); outline: 0; outline: thin dotted \9; /* IE6-9 */ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(240, 114, 65, 0.6); }

textarea { background-color: #ffffff; border: 1px solid #cccccc; transition: border linear 0.2s, box-shadow linear 0.2s; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); padding: 5px 10px; }

    textarea:focus { border-color: rgba(240, 114, 65, 0.8); outline: 0; outline: thin dotted \9; /* IE6-9 */ box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(240, 114, 65, 0.6); }

.default_container { width: 1000px; margin: 50px auto; /*border:#000 thin solid;*/ position: relative; }

.clearBoth { clear: both; padding: 0; margin: 0; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    .container { padding: 0 4%; width: 92%; }
}

/*----------------- default_menu  -----------------*/
#d_menu_wapper { background-color: #fff; height: 65px; position: fixed; top: 0; width: 100%; z-index: 1000; border-bottom: #909090 1px solid; background: #ffffff; color: #333; filter: progid:DXImageTransform.Microsoft.Shadow(color=#909090, direction=120, strength=4); /*ie*/ -moz-box-shadow: 2px 2px 10px #909090; /*firefox*/ -webkit-box-shadow: 2px 2px 10px #909090; /*safari或chrome*/ box-shadow: 2px 2px 10px #909090; /*opera或ie9*/ }

    #d_menu_wapper .container { position: relative; height: 100%; }

    #d_menu_wapper .brand { margin-top: 10px; }

    #d_menu_wapper ul { cursor: pointer; list-style-type: none; color: #808080; display: inline-block; position: absolute; right: 0px; top: 0px; }

        #d_menu_wapper ul > li { float: left; padding: 0 20px; line-height: 40px; }

    #d_menu_wapper li > a { color: #808080; }

        #d_menu_wapper li > a:hover { color: #000000; }

    #d_menu_wapper ul .active > a { color: #000000; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #d_menu_wapper { height: 50px; }
        #d_menu_wapper .container { padding: 0; width: 100%; }
        #d_menu_wapper .brand { display: block; height: 30px; margin-bottom: 10px; margin-left: 10px; }
        #d_menu_wapper ul { position: initial; background-color: white; padding-left: 0px; width: 100%; border-top: 1px solid #cccccc; margin: 0px; border-bottom: 1px solid #909090; box-shadow: 2px 2px 2px #909090; }
            #d_menu_wapper ul > li { float: none; }
                #d_menu_wapper ul > li:hover { background: #cccccc; color: black; }
        #d_menu_wapper > button { width: 25px; height: 25px; border: none; position: absolute; right: 5px; top: 10px; cursor: pointer; background: none; }
            #d_menu_wapper > button span { width: 100%; height: 2px; background-color: #999999; border: none; display: block; margin: 2px auto; }
}

/*----------------- default_slider  -----------------*/
.ds_title { font-size: 4.5em; margin: 0; padding: 0; }

.ds_description { font-size: 2em; margin: 0; padding: 0; }

.ds_button { display: inline-block; *display: inline; zoom: 1; padding: 6px 30px; margin: 0; cursor: pointer; border: 1px solid #269CE9; overflow: visible; font-family: inherit; font-size: 16px; text-decoration: none; white-space: nowrap; color: #FFF; background-color: #269CE9; background-image: linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0)), url(data:image/png;base64,iVBORw0KGg[...]QmCC); transition: background-color .2s ease-out; background-clip: padding-box; /* Fix bleeding */ border-radius: 3px; box-shadow: 0 1px 0 rgba(0, 0, 0, .3), 0 2px 2px -1px rgba(0, 0, 0, .5), 0 1px 0 rgba(255, 255, 255, .3) inset; }

    .ds_button:hover { background-color: #70B9E8; }

    .ds_button:active { background: #269CE9; }

.ds { padding: 70px 0; min-height: 600px; }

    .ds h1 { text-align: left; font-size: 4.5em; margin: 0; padding: 0; font-weight: normal; }

    .ds ul { padding-left: 25px; text-align: left; }

        .ds ul li { padding: 5px 0 5px 10px; font-size: 2em; }

    .ds .ds_button { min-width: 210px; height: 45px; cursor: pointer; margin: 20px 0; }

    .ds .aL { position: absolute; top: 0px; left: 0px; }

    .ds .aR { position: absolute; top: 0px; right: 0px; }

    .ds .content { width: 600px; }

    .ds .phone > img { margin-top: -30px; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    .ds { }
        .ds h1 { font-size: 2.5em; }
        .ds ul li { font-size: 1.5em; }
        .ds .ds_button { display: block; margin-left: auto; margin-right: auto; margin-bottom: 0; }
        .ds .aL { position: initial; top: initial; left: initial; }
        .ds .aR { position: initial; top: initial; right: initial; }
        .ds .content { width: 100%; }
        .ds .phone > img { margin-left: auto; margin-right: auto; display: block; margin-top: initial; }
}

/*----------------- default_slider_01  -----------------*/
#ds_01 { background-color: #ffcc00; margin-top: 65px; }

    #ds_01 .content { color: #ffffff; padding-top: 20px; }

    #ds_01 .phone img { width: 330px; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #ds_01 { margin-top: 50px; }
        #ds_01 .phone img { width: 200px; }
}

/*----------------- default_slider_02_02  -----------------*/
#ds_02 { background-color: #ffffff; }

    #ds_02 .phone { left: -40px; }

    #ds_02 h1 { color: #EC225E; }

    #ds_02 .content { color: #000000; padding-top: 20px; }

    #ds_02 button { right: 0px; position: absolute; right: 20px; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #ds_02 .phone img { width: 200px; }
    #ds_02 button { position: initial; }
}

/*----------------- default_slider_03  -----------------*/
#ds_03 { background-color: #46bfde; padding: 60px 0 100px 0; }

    #ds_03 .content { color: #FFFFFF; }

    #ds_03 h1:last-of-type { font-size: 2em; }

    #ds_03 ul { list-style-type: none; margin-left: 0; padding-left: 0; text-align: left; }

        #ds_03 ul li { list-style-type: none; margin: 0 20px 20px 0; padding: 0px; float: left; cursor: pointer; }

            #ds_03 ul li > button { background: no-repeat center 20px; border: 0 none; color: #FFFFFF; font: 16px bold; font-family: inherit; height: 125px; padding-top: 80px; position: relative; width: 125px; cursor: pointer; border-radius: 4px; }

    #ds_03 li:nth-child(1) button { background-image: url('../Images/default/slider03_wall.png'); background-color: #E74C3C; }

    #ds_03 li:nth-child(2) button { background-image: url('../Images/default/slider03_photo.png'); background-color: #9B59B6; }

    #ds_03 li:nth-child(3) button { background-image: url('../Images/default/slider03_video.png'); background-color: #2ECC71; }

    #ds_03 li:nth-child(4) button { background-image: url('../Images/default/slider03_music.png'); background-color: #65819B; }

    #ds_03 li:nth-child(5) button { background-image: url('../Images/default/slider03_about.png'); background-color: #F39C12; }

    #ds_03 li:nth-child(6) button { background-image: url('../Images/default/slider03_contactme.png'); background-color: #3498DB; }

    #ds_03 li:nth-child(7) button { background-image: url('../Images/default/slider03_links.png'); background-color: #5E85E5; }

    #ds_03 .ds_03_Phone { width: 316px; height: 605px; float: right; z-index: 1000; background-image: url(../Images/default/slider03_01.png); }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #ds_03 { padding: 60px 0; }
        #ds_03 h1:last-of-type { font-size: 1.5em; }
        #ds_03 .ds_03_Phone { padding-top: 1px; float: initial; margin: 0 auto; width: 200px; height: 383px; background-size: 200px 383px; }
        #ds_03 button:last-of-type { clear: left; }
        #ds_03 ul li { margin: 0 2.5% 2.5%; text-align: center; width: 45%; }
        #ds_03 ul:after { content: "."; clear: both; display: block; height: 0; visibility: hidden; }
        #ds_03 ul li > button { width: 100%; }
}
/*---------------- slider ----------------*/
#ds_03_Phone_slider { height: 410px !important; background-color: #f8f8f8; width: 233px; margin: 93px 0 0 45px; /*overflow:hidden;*/ }

    #ds_03_Phone_slider .ds_03_Phone_slider_wapper { list-style: none; margin: 0px; width: 1631px; /*11520px;*/ transition: 600ms; -webkit-transition: 600ms; -webkit-transform: translate3d(-1165px, 0, 0); }

    #ds_03_Phone_slider .ds_03_Phone_slider_cell_wapper { display: table-cell; width: 233px; /* 1920px;*/ vertical-align: top; }

.ds_03_Phone_slider_cell_wapper img { width: 233px; height: auto; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #ds_03_Phone_slider { height: 259.5px !important; width: 147.5px; margin: 57px 0 0 28.5px; /*overflow:hidden;*/ }
    .ds_03_Phone_slider_cell_wapper img { width: 147.5px; height: 259.6px; }
}


/*----------------- default_slider_04  -----------------*/
#ds_04 { background-color: #ffffff; }

    #ds_04 h1 { color: #ff3232; text-align: center; }

        #ds_04 h1:last-of-type { padding-bottom: 20px; }

    #ds_04 ul { list-style-type: none; width: 800px; padding: 0px; margin: 0 auto; }

    #ds_04 li:nth-of-type(1) { background-color: #f9b12b; }

    #ds_04 li:nth-of-type(2) { background-color: #918cc4; }

    #ds_04 li:nth-of-type(3) { background-color: #f26261; }

    #ds_04 li:nth-of-type(4) { background-color: #16ade4; }

    #ds_04 ul li { list-style-type: none; float: left; height: 110px; width: 370px; margin: 10px; }

    #ds_04 li > span:nth-of-type(1) { color: #FFFFFF; float: left; font-size: 3em; margin: 0; padding: 0 30px; width: 50px; }

    #ds_04 li > span:nth-of-type(2) { color: #FFFFFF; display: table-cell; font-size: 1em; height: 110px; margin: 0; vertical-align: middle; width: 250px; }

    #ds_04 .ds_button { display: block; margin: 20px auto; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #ds_04 ul { width: 100%; }
        #ds_04 ul li { float: initial; margin-left: 0px; margin-right: 0px; width: 100%; height: auto; padding-left: 0px; }
    #ds_04 li > span:nth-of-type(1) { display: inline-block; font-size: 2.5em; vertical-align: middle; float: none; padding: 0 10px; }
    #ds_04 li > span:nth-of-type(2) { display: inline-block; vertical-align: middle; width: 70%; height: initial; }
    #ds_04 .ds_button { margin-bottom: 0px; }
}
/*----------------- default_slider_contact  -----------------*/
#ds_contact { background-color: #37383c; padding: 10px 0; }

    #ds_contact .ds_contact_content_wapper { width: 960px; margin: 0 auto; padding: 0; }

    #ds_contact .ds_contact_title { font-size: 4em; color: #fff; text-align: left; margin-bottom: 20px; }

    #ds_contact .ds_input_wapper { margin: 0; padding: 0; }

    #ds_contact .ds_contact_left_list { float: left; margin: 0 25px 0 0; padding: 0; }

        #ds_contact .ds_contact_left_list ul { margin: 0; padding: 0; list-style-type: none; }

        #ds_contact .ds_contact_left_list li > input { margin: 0 0 8px 0; height: 27px; width: 940px; padding: 0 10px; }

        #ds_contact .ds_contact_left_list li > textarea { height: 118px; resize: none; margin: 0 0 8px 0; width: 940px; padding: 0 10px; }

    #ds_contact .ds_contact_midlle_message { float: left; /*margin: 0 25px 0 0;*/ padding: 0; }

        #ds_contact .ds_contact_midlle_message > textarea { height: 118px; width: 475px; resize: none; margin: 0; padding: 10px 10px; }

    #ds_contact .ds_contact_right_list { float: left; }

        #ds_contact .ds_contact_right_list ul { list-style-type: none; margin: 0; padding: 0; }

        #ds_contact .ds_contact_right_list li > input { margin: 0 0 8px 0; height: 27px; width: 118px; padding: 0 10px; }

        #ds_contact .ds_contact_right_list li .ds_contact_right_list_validate { margin: 0 0 8px 0; height: 65px; }

    #ds_contact .ds_contact_send { background-color: #F25A29; color: #FFFFFF; cursor: pointer; display: block; float: right; font-size: 1.125em; height: 38px; margin-top: 8px; margin-bottom: 5px; width: 98px; font: inherit; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #ds_contact .ds_contact_title { font-size: 2.5em; }
    #ds_contact .ds_contact_content_wapper { width: 100%; }
    #ds_contact .ds_contact_left_list li > input { width: 96%; padding: 0 2%; }
    #ds_contact .ds_contact_left_list li > textarea { width: 96%; padding: 0 2%; }
    #ds_contact .ds_contact_left_list { float: initial; margin-right: 0px; }
}
/*----------------- default_slider_footer  -----------------*/
#ds_footer { background-color: #414143; padding: 10px 0; }

    #ds_footer .ds_footer_content_wapper { width: 900px; margin: 0 auto; padding: 0; color: #cfcfcf; line-height: 1.5em; }

    #ds_footer .ds_footer_content_container { margin: 20px auto; }

    #ds_footer .ds_footer_address { float: left; margin: 0 100px 0 0; padding: 0; width: 330px; }

        #ds_footer .ds_footer_address p { margin-bottom: 0px; padding-bottom: 0px; }

    #ds_footer .ds_footer_address_viewMap { color: #e55928; }

        #ds_footer .ds_footer_address_viewMap a { color: #e55928; }

    #ds_footer .ds_footer_contact { float: left; margin: 0 25px 0 0; padding: 0; width: 250px; }

        #ds_footer .ds_footer_contact p { margin-bottom: 0px; padding-bottom: 0px; }

    #ds_footer .ds_footer_social { float: right; width: 150px; }

    #ds_footer .ds_footer_social_logo { }

    #ds_footer .ds_footer_social > ul { list-style-type: none; margin: 0; padding: 0; }

        #ds_footer .ds_footer_social > ul li { float: left; }

            #ds_footer .ds_footer_social > ul li img { width: 36px; height: 36px; cursor: pointer; margin: 0 12px 12px 0; }
/*----------------- default_slider_footer_start  -----------------*/
#ds_footer_start { background-color: #fff; padding: 10px 0; }

    #ds_footer_start .ds_footer_start_wapper { width: 700px; margin: 0 auto; text-align: center; }

    #ds_footer_start .ds_footer_start_container { margin: 20px auto; }

    #ds_footer_start .ds_footer_start_wapper span { font-size: 1.5em; margin-right: 20px; color: #222021; }

    #ds_footer_start .ds_footer_start_wapper input { height: 45px; }

.Copyright { color: #999999; text-align: center; margin-top: 20px; }

.bt-bgray { background: -moz-linear-gradient(center top, #999999 5%, #999999 100%) repeat scroll 0 0 #999999; background: #999999; border: 0 none; border-radius: 4px; box-shadow: 0 1px 0 0 #606060; color: #FFFFFF; display: inline-block; font-family: inherit; font-size: 16px; font-style: normal; height: 32px; line-height: 32px; text-align: center; text-decoration: none; text-indent: 0; width: 120px; }

    .bt-bgray:hover { background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #b3b3b3), color-stop(1, #b3b3b3) ); background: -moz-linear-gradient( center top, #b3b3b3 5%, #b3b3b3 100% ); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#b3b3b3', endColorstr='#b3b3b3'); background-color: #b3b3b3; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #ds_footer_start .ds_footer_start_wapper { width: 100%; }
        #ds_footer_start .ds_footer_start_wapper span { display: block; margin-bottom: 10px; }
}
/*----------------- app list_start  -----------------*/
#pubApps-wrapper { }
    #pubApps-wrapper .pubApp-wapper * { box-sizing: border-box; }
    #pubApps-wrapper .pubApp-wapper { position: relative; width: 200px; height: auto; background-color: #FFFFFF; border: 1px solid #E6E6E6; border-radius: 4px; text-align: center; padding: 5px; cursor: pointer; float: left; margin: 15px; }

        #pubApps-wrapper .pubApp-wapper .appIcon { width: 200px; height: 200px; }

        #pubApps-wrapper .pubApp-wapper .appTitle { background-color: rgba(0,0,0,0.3); font-size: 1em; padding-bottom: 0px; margin: 0; height: 25px; line-height: 25px; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: center; }

        #pubApps-wrapper .pubApp-wapper .appDownload { padding: 0px; font-size: 0.875em; color: #DE4126; text-align: left; margin-top: 5px; }
            #pubApps-wrapper .pubApp-wapper .appDownload a { float: right; }

@media only screen and (max-width: 480px) {
    #pubApps-wrapper .pubApp-wapper { margin: 15px 0; width: 100%; box-sizing:border-box;}
}

.card { border-radius: 4px 4px 4px 4px; border: 1px solid #E6E6E6; text-align: center; background-color: #fff; }

/*----------------- footer  -----------------*/
#footer { border-top: 1px solid #D4D4D4; margin: 0px; width: 100%; }
    #footer > div { margin: 20px auto; color: #999999; position: relative; height: 20px; }
        #footer > div div:first-of-type { position: absolute; left: 0; }
        #footer > div div:last-of-type { position: absolute; right: 0; }

@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
    #footer > div div:first-of-type { position: initial; }
    #footer > div div:last-of-type { position: initial; margin: 5px 0 10px 0; font-size: 0.875em; }
}
