@charset "utf-8";
html, div, body, p, form, img, dd, h1, h2, h3, h4, input { margin:0 auto; padding:0; font-style:normal; font-family:"Segoe UI", "Arial", "Helvetica", "Verdana", "sans-serif"; color:#444; line-height:160%; font-weight:normal; }
ul, li { margin:0; padding:0; list-style:none; }
img { border:none; }
a, a:link, a:visited { text-decoration:none; color:#222; }
a:hover, a:active { text-decoration:underline; color:#222; }
.menu{margin-top:22px;}
.slidingDiv{top:185px;}
a.bluecolor{color:#09F;}
/*video resource*/
.banner { position:relative; }
.video-banner { overflow:hidden; width:100%;max-height:400px; }
.video-banner video { width:100%; }
.banner-text { width:100%; background-color:rgba(000, 000, 000, 0.15); text-align:center; position:absolute; top:0; height:100%; }
.banner-text h1 { color:#fff; font-size:40px; padding-top:8%; }
.banner-text p { font-size:16px; line-height:40px; color:#fff; }
.top a { color:#fff; max-width:390px; height:284px; font-size:16px; line-height:20px; border-radius:8px 8px; display:block; float:left; margin-right:1.25%; overflow:hidden; position:relative; }
.top { margin:54px auto; }
.top a span.title { display:block; padding:230px 0 0 5px; }
.top a:hover { background-size:110%; }
.top a:hover span.play-bg { background-color:#d94e37; }
.top a span.play-bg { display:block; margin:0 auto; width:70px; height:70px; background-color:#545453; position:absolute; top:35%; left:40%; opacity:0.9; border-radius:50%; }
.top a span.play-arrow { margin:25px auto; width:0; height:0; border-left:20px solid white; border-bottom:10px solid transparent; border-top:10px solid transparent; display:block; }
a.bg-frist { background:url(/images/video/video-resource/bg-1.jpg) no-repeat center; overflow:hidden; }
a.bg-sencond { background:url(/images/video/video-resource/bg-2.jpg) no-repeat center; overflow:hidden; }
a.bg-third { background:url(/images/video/video-resource/bg-3.jpg) no-repeat center; float:right; margin-right:0; }
h2 { font-size:32px; color:#222; text-align:center; }
.middle { margin-bottom:80px; }
.middle a { display:block; max-width:285px; overflow:hidden; float:left; margin-right:1.2%; margin-top:42px; }
.middle a.last { float:right; margin-right:0; }
.middle a img { width:100%; display:block; margin:0 auto; border:none; transform: scale(1); transition: all 1s ease 0s; -webkit-transform: scale(1); -webkit-transform: all 1s ease 0s; }
h3 { color:#454545; font-size:16px; line-height:20px; width:95%; padding:20px 0 10px 0; }
.text-play { display:block; border:1px #f2f2f2 solid; border-top:none; }
.pic-play span.play-bg { display:block; margin:0 auto; width:48px; height:48px; background-color:#000; position:absolute; top:30%; left:40%; opacity:0.5; border-radius:50%; }
.pic-play { position:relative; overflow:hidden;display:block; }
.pic-play span.play-arrow { margin:15px auto; width:0; height:0; border-left:17px solid white; border-bottom: 10px solid transparent; border-top:10px solid transparent; display:block; margin-left:18px;}
.middle a:hover span.play-bg { background-color:#d94e37; opacity:0.7; }
.middle a:hover img { transform: scale(1.2); transition: all 1s ease 0s; -webkit-transform: scale(1.2); -webkit-transform: all 1s ease 0s; }
.middle a:hover { text-decoration:none; }
.pic-play span.play-time { display:block; margin:0 auto; background-color:#545453; position:absolute; top:85%; right:0; opacity:0.9; width:70px; height:24px; color:#fff; font-size:16px; text-align:center; line-height:26px; }
.middle a:hover .text-play { background-color:#f2f2f2; }
.text-play p { width:95%; font-size:14px; color:#606060; padding-bottom:10px; }
.text-play p span { float:right; background:url(/images/video/video-resource/time.png) no-repeat left; padding-left:20px; }
.text-play span.title{color:#454545; font-size:16px; line-height:20px; width:95%; padding:20px 0 10px 7px;display:block;}
.text-play span.letter { width:95%; font-size:14px; color:#606060; padding-bottom:10px;display:block;padding-left:7px; }
.text-play span.letter span { float:right; background:url(/images/video/video-resource/time.png) no-repeat left; padding-left:20px; }

.left { width:50%; background:url(/images/video/video-resource/fix-iphone.jpg) no-repeat center; max-width:590px; float:left; height:292px; display:block; margin-right:1.5%; }
.left a.title { padding-top:200px; display:block; color:#ffffff; font-size:16px; padding-left:5%; line-height:18px; max-width:none; }
.left span.pro { font-size:24px; }
.left a { display:inline-block; margin-top:auto; color:#fff; }
.left a.buy { display:inline-block; width:117px; height:25px; line-height:22px; color:#fff; text-align:center; border-radius:100px; font-size:14px; margin-left:5%; margin-top:10px; background:#d94e37; }
.left a.dow { background:none; border:#fff 1px solid; margin-left:15px; width:115px; height:23px; }
.left a:hover { background:#e88e3e; text-decoration:none; transition: all 1s ease 0s; -webkit-transform: all 1s ease 0s; }
.left a.dow:hover { border:none; background:#3ecd0c; border:#0a9b14 1px solid; }
.left a.title:hover { background:none; }
.left a.title:hover span.pro { text-decoration:underline; }
.right { margin-right:0; background:url(/images/video/video-resource/bg-pro.jpg) no-repeat center; }
.left:hover { background-size:105%; }
/*video signle*/
.banner-signle { background-color:#edeef0;margin-bottom:80px;}
.leftplay { float:left; width:53%; }
.righttext { width:38%; float:left; margin:45px 32px 0 6%; line-height:30px; }
.righttext h1 { color:#222; font-size:24px; line-height:30px; }
.righttext p { font-size:16px; padding:10px 0 5px 0; line-height:20px; }
.righttext .text-play { display:block; overflow:hidden;margin:5px 0; }
.righttext .text-play p { float:left; line-height:29px; font-size:14px; width:60%; }
.righttext .text-play p span.author { background:url(/images/video/video-resource/auther-pic.png) no-repeat left; float:left; padding-left:35px; }
.righttext p.dow-text { font-size:16px; color:#222; font-weight:600; padding-bottom:10px; }
a.download { display:inline-block; background:#6ec400; font-size:14px; color:#fff; border-radius:5px; padding:1px 30px; }
a.download:hover { background:#4dc247; transition: all 1s ease 0s; -webkit-transform: all 1s ease 0s; box-shadow: 0px 5px 10px 0 rgba(0, 0, 0, 0.3); }
.distance { margin-left:15px; }
a.learnmore { display:block; color:#5ba101; font-size:16px; color:#5ba101; margin-top:10px; }
/*go top*/
.back-to { position: fixed; bottom: 10px; right: 10px; z-index: 999; width: 110px; overflow: hidden; zoom: 1; -ie6-position-fixed-delay: 200; }
.back-to .back-top { float: right; display: block; width: 50px; height: 50px; background: url(/images/system/gotop.png) no-repeat scroll 0 0 transparent; margin-left: 10px; outline: 0 none; text-indent: -9999em; }
.back-to { _position:absolute; _bottom:auto; _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop, 10)||0)-(parseInt(this.currentStyle.marginBottom, 10)||0)));
_margin-bottom:10px; _margin-right:5px; }
*html { background-image:url(about:blank); background-attachment:fixed; }

/****new video************/
.review{overflow:hidden;}
.youtube-player{display:block;padding-bottom:56.25%;overflow:hidden;position:relative;height:100%;cursor:pointer;margin:20px 0;width:100%;max-width:838px;}
img.youtube-thumb{bottom:0;display:block;left:0;margin:auto;max-width:100%;width:100%;position:absolute;right:0;top:0;height:auto }
.play-button{height:104px;width:104px;left:5%;top:70%;position:absolute;background:url(/images/video/play.png) no-repeat 0 0px;}
.play-button:hover{background:url(/images/video/play.png) no-repeat 0 -104px;}
#youtube-iframe{width:100%;height:100%;position:absolute;top:0;left:0;}
.top-line{border-top: 2px solid #0282d9;}
ul.breadcrumbs li {float: left;font-size: 16px;color: #222222;line-height: 30px;}
ul.breadcrumbs{overflow: hidden;margin-top: 20px;}
ul.breadcrumbs li a{color:#222222;line-height:30px;}
/****new video contact************/
.leftpart, .review-all{overflow: hidden;max-width: 838px;width: 100%;float: left;}
.left-text {width:100%; float:left; margin:0 auto;margin-bottom: 7%;}
.left-text h1{font-size:30px;padding: 10px 0;}
.left-text h2{font-size:25px;text-align: left;margin-bottom: -10px;}
.left-text p {line-height:160%;color:#222222; }
.left-text .text-play{ display:block; border:none; border-top:none; }
.left-text .text-play p span {float:left;}
.left-text .text-play p span.author{margin-right:40px; }
.left-text p a, .step p span{color:#00a2ea;}
.leftpart a.download{background:#0382da url(/images/video/down.png) no-repeat 14px 13px;color:#fff; border-radius:5px; padding:10px 25px 10px 47px;font-size:18px; }
.leftpart a.download:hover {background:#0382da url(/images/video/down.png) no-repeat 14px 13px;}
.leftpart a.download{margin:2% auto;}
.step{margin: 2% auto;}
.rightpart{display: block;overflow: hidden;padding-left: 70px;}
.rightpart .middle a{margin-top: 25px;}
p.like{font-size:36px;}
.review img{float: left;}
.review-text{float: left;width: 90%;}
.review-text p.name{font-size:30px;font-weight: lighter;}
.review-text p.time{color:#bdbdbd;}
.review-text p{font-size:16px;color:#222222;padding-left: 25px;}
.circle{background-color:#f4f4f4;border-radius:5px;position:relative;margin:35px auto;padding: 10px 0 20px 0;}
.triangle{position: absolute;top: -25px;left: 6%;width:0px;height:0px;border-bottom:30px solid #f4f4f4;border-left:14px solid transparent;border-right:14px solid transparent;}
.rightpart .pic-play span.play-bg{top: 62%;left: 7%;}
.rightpart h3 {width:90%;padding: 20px 0 20px 0;}
.leftpart a.distant{margin-left: 10px;}
.container-s{margin-bottom: 40px;}
.rightpart .text-play{border:1px #d1d1d1 solid;border-top:none;}
.rightpart .pic-play span.play-bg {margin:-60px 20px;}
.rightpart span.h3{color:#454545; font-size:16px; line-height:20px;width:90%;padding: 20px 0 20px 0;display:block;margin: 0 auto;}
.righttext .text-play p span.icon{background:url(/images/video/video-resource/icon.png) no-repeat left;}

.solution-select{text-align:center;margin:0 auto 40px auto;font-size:18px;}
.solution-select a{display:inline-block;cursor:pointer;height:32px;line-height:32px;padding:0px 12px;color:#222;margin:0px 10px 16px 10px;text-decoration: none;background-color:#e3e3e3;float:none;}
.solution-select span{display:inline-block;height:32px;line-height:32px;padding:0px 12px;color:#222;margin:0px 10px 16px 10px;background-color:#e3e3e3;}
.solution-select input{height:33px;width:44px;background-color:#e3e3e3;outline:medium;text-align:center;border:0;margin:0px 0px 16px 8px;float:none;}
.solution-select a.go{color:#222;background-color:#e3e3e3;line-height:32px;font-size:18px;border:none;}
.solution-select span.active{background-color:#0960b0;color:#fff;border:none;}
.solution-select span.prev, .solution-select a.prev, .solution-select span.next, .solution-select a.next{color:#3b3b3b;border:1px solid #d8d8d8;background:none;font-size:30px;margin-right:0;border:none;}
.middle a.video-tutorail{display:none;}
.middle a.active{display:block;}
/*starlist*/
#starlist{max-width:1200px;width:96%;border-top:1px solid #f7f7f7;padding:1% 2% 0 2%;}
#starlist ul{padding-left:0;overflow:hidden;float:left;margin:10px auto;}
#starlist ul li{float:left;list-style:none;width:27px;height:27px;background:url(/images/system/star.png);}
#starlist ul li a{display:block;width:100%;padding-top:27px;overflow:hidden;margin:9px 0;}
#starlist ul li.light{background-position:0 -27px;}
#starlist #showPanel{line-height:27px;padding-left:150px;}

/* share */
#share-list{position:fixed;right:0;top:30%;overflow:hidden;}
#share-list li{width:40px;height:40px;-webkit-transition:0.5s;transition:0.5s;clear: both;display:-webkit-box;display: -webkit-flex;display: flex;-webkit-justify-content: center;justify-content: center;-webkit-align-items: center;align-items: center;cursor: pointer;}
#share-list li img{width: 35px;height: 35px;}
#share-list li.fb{background: rgb(59, 89, 152);}
#share-list li.tw{background:#000}
#share-list li.ln{background:rgb(0,115,177)}
#share-list li.gmail{background:rgb(206,73,59)}
#share-list li.gmail svg,#share-list li.reddit svg,#share-list li.whatsapp svg{width: 25px;height: 25px;}
#share-list li.whatsapp{background:#26cf44;}
#share-list li.reddit{background: rgb(255, 87, 0);}
#share-list li img{-webkit-transition: all .3s linear;transition: all .3s linear;margin-top: 0px;}
#share-list li:hover img{-webkit-transform: scale(1.2);transform: scale(1.2);}
@media screen and (max-width: 1217px){
.middle a.last{float:left;margin-right:1.65%;}
.left{float:none;margin:0 auto;margin-top:10px;width:100%;}
.middle{margin-bottom:50px;}
ul.breadcrumbs{width:98%;margin-left: 1%;}

@media screen and (max-width: 1200px){
a.bg-third{float:left;}
.top a{margin-top:10px;}
.leftpart{float: none;}

}
@media screen and (max-width: 1085px){
.righttext{margin-left:3%;width:40%;}
.left-text{width: 94%;}
}
@media screen and (max-width: 929px){
.leftplay, .righttext{float:none;width:90%;}
.righttext .text-play p{width:250px;}
.righttext{margin-left:auto;}
.banner-signle{padding-bottom:30px;}
.menu{margin-top:0;}
#lookfor{margin-top:20px;}
.menu ul{top:66px;}
#share-list{display: none;}
}
@media screen and (max-width: 800px){
.top a{float:none;margin:0 auto;margin-top:10px;}
.middle a, .middle a.last{float:none;margin:auto;margin-top:20px;}
.banner-text h1{padding-top:10%;}
}
@media screen and (max-width: 480px){
a.download, .righttext p.dow-text{display:none;}
.banner-text h1{font-size:30px;}
.play-button{top:45%;}
.review-text{width: 83%;}
.triangle{margin-left: -10px;}
.rightpart{padding-left:0px;}
p.like{text-align: center;}
.leftpart a.distant{margin-left: 0px;}
.review-text p{padding-left: 20px;}
.container-b{width:100%;}
.triangle{top: -7%;}

}