@charset "utf-8";
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: local('Lato Light'), local('Lato-Light'), url(https://themes.googleusercontent.com/static/fonts/lato/v7/KT3KS9Aol4WfR6Vas8kNcg.woff) format('woff');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local('Lato Regular'), local('Lato-Regular'), url(https://themes.googleusercontent.com/static/fonts/lato/v7/9k-RPmcnxYEPm8CNFsH2gg.woff) format('woff');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local('Lato Bold'), local('Lato-Bold'), url(https://themes.googleusercontent.com/static/fonts/lato/v7/wkfQbvfT_02e2IWO3yYueQ.woff) format('woff');
}
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: local('Lato Black'), local('Lato-Black'), url(https://themes.googleusercontent.com/static/fonts/lato/v7/BVtM30trf7q_jfqYeHfjtA.woff) format('woff');
}

#nav ul {
      margin: 0px;
      padding: 0px;
      list-style: none;
      width: 200px;
}
#nav  ul li {
  position: relative;
  border-bottom:1px solid #ccc;
}
#nav li ul {
  position: absolute;
  left: 200px;
  top: 0;
  display: none;
}
#nav ul li a {
  display: block;
  text-decoration: none;
  color: #777;
  background: #fff;
  padding: 5px;
}
#nav  li:hover ul { display: block; }
#nav li:hover  a {
  color:#FFFFFF;
  background:  url(../img/bg.png);
}
#nav  li:hover ul a:hover {
  background-color:#cccccc;
  background-image:none;
  color:#FFFFFF;
}

/* CSS Document */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,img {margin:0;padding:0; -webkit-text-size-adjust:none;}
fieldset,img {border:0;}
address,caption,cite,code,dfn,var {font-style:normal;font-weight:normal;}
ul {list-style:none;}
ol{ list-style:outside decimal; margin-left:18px; line-height:1.6em;}
ol li{ line-height:1.8em;}
h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}
a:focus{outline:thin dotted #333;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px;}
a:hover,a:active{outline:0;}
a{ text-decoration:none;color:#333;}
a:hover{text-decoration:underline;}
img{ vertical-align:middle;}
body{font:14px/1.6em  Lato,Arial,Helvetica,sans-serif;color:#7a7a7a;background:#fff; }

input[type='text'],textarea,input[type='submit']{-webkit-appearance: none;font-family:Helvetica,Arial,sans-serif; outline:none; color:#666; vertical-align:top; font-size:14px; line-height:1.2em;}
input[type='checkbox']{vertical-align:text-top; vertical-align:baseline\9;}
select{font-family:Helvetica,Arial,sans-serif;}
select:focus{ outline:none; }

/*basic*/
.fl {float:left;}
.fr {float:right;}
.ac{ text-align:center;}
.al{ text-align:left;}
.ar{ text-align:right;}
.clear{ clear:both; height:0; overflow:hidden;}
.noh{ overflow:visible !important;}
ul.dot li, ul.list li{ list-style:outside disc; line-height:1.7em; margin-left:18px;}
.noBor{ background:none !important; border:none !important; margin-right:0 !important;}
.re{ position:relative !important;}
.oh{ overflow:hidden !important;}
.blue{ color:#15abef !important;}
.red{ color:#f00 !important;}
.orange{ color:#f6772c !important;}
.gray{color:#999 !important;}
.hide{ display:none !important;}
.nobg{ background:none !important;}
.container{max-width:1000px;margin:0 auto;} 
.mt5{margin-top:5px;}.mt20{margin-top:20px;}.mt30{margin-top:30px;}

/*btn*/
.greenBtn,.orangeBtn{ display:block; background:#84c754; width:200px; height:43px; border-radius:5px; font-size:16px; line-height:42px; color:#fff !important; text-align:center; margin:0 10px 0 0;}
.greenBtn span,.orangeBtn span {padding-right:10px;}
.greenBtn:hover{ background:#8bdc4f; text-decoration:none;}
.orangeBtn{ background:#ff6c00;}
.orangeBtn:hover{ background:#ec5401; text-decoration:none;}

.greenBtn2,.orangeBtn2{display:inline-block;background:#84c754;font-size:34px; text-align:left;width:302px;height:64px;text-decoration:none !important;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;color:#fff !important; border-radius:5px;font-weight: 300; padding:16px 25px 0 37px;}
.orangeBtn2{ background:#ff6c00;}
.greenBtn2 .text,.orangeBtn2 .text{ float:left;}
.greenBtn2 .img,.orangeBtn2 .img{ float:right; padding-top:5px;}
.greenBtn2 .text span,.orangeBtn2 .text span {padding-right:10px; display:block; font-size:16px; padding-top:8px;}
.greenBtn2:hover{background:#8bdc4f; text-decoration:none;}
.orangeBtn2:hover{background:#ec5401; text-decoration:none;}
.blueBtn2{display:inline-block;background:#0699f6;font-size:34px; text-align:center;max-width:400px;height:90px;line-height:90px;text-decoration:none !important;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;color:#fff !important; border-radius:5px;font-weight: 300;}
.blueBtn2 span {padding-right:10px;}
.blueBtn2:hover{background:#22a7fb; text-decoration:none;}


.btnMac_tab ul {overflow:hidden; border-radius:5px 5px 0 0; color:#fff; width:366px;}
.btnMac_tab li {display:block; float:left; width:46%; height:32px; line-height:32px; text-align:center; background:#64963f; cursor:pointer;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.btnMac_tab li.curr {background:#84c754; width:54%;}
.btnMac_tab a {border-radius:0 0 5px 5px;}

.btnMac_tab1 ul {overflow:hidden; border-radius:5px 5px 0 0; color:#fff; width:365px;}
.btnMac_tab1 li {display:block; float:left; width:46%; height:32px; line-height:32px; text-align:center; background:#da5e1b; cursor:pointer;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.btnMac_tab1 li.curr {background:#ff6c00; width:54%;}
.btnMac_tab1 a {border-radius:0 0 5px 5px;}

/*header*/
.header{border-bottom:5px solid #d8d8d8;padding:10px 0;}
.header .logo{float:left;}
.header .logo a{display:block; background:url(images/logo.jpg) no-repeat;width:168px;height:15px; text-indent:-9999px;}
.header .lag{float:right;}
.header .lag .it{display:inline-block; background:url(images/gq.png) no-repeat;width:26px;height:20px; text-indent:-9999px;margin:0 3px;}
.header .lag .br{display:inline-block; background:url(images/gq.png) no-repeat 0 -20px;width:26px;height:20px; text-indent:-9999px;margin:0 3px;}
.header .lag .usa{display:inline-block; background:url(images/gq.png) no-repeat 0 -40px;width:26px;height:20px; text-indent:-9999px;margin:0 3px;}
.header .lag .jp{display:inline-block; background:url(images/gq.png) no-repeat 0 -60px;width:26px;height:20px; text-indent:-9999px;margin:0 3px;}
.header .lag .aus{display:inline-block; background:url(images/gq.png) no-repeat 0 -80px;width:26px;height:20px; text-indent:-9999px;margin:0 3px;}

/*banner*/
.banner{height:660px;}
.banner .banner_sideleft{ float:left; width:50%; padding-top:30px;}
.banner .banner_sideright{ float:right; width:50%; position:relative;}
.banner .pcImg{ position:absolute;width:500px;top:20px;right:-50px; z-index:1;}
.banner .pcImg img {max-width:100%;}
.banner .pcImg2{ position:absolute;max-width:560px;top:0;right:-60px; z-index:1;}
.banner .pcImg2 img {max-width:100%;}
.banner .dow_bg{ position:absolute;background:#3ea4a6;width:190px;height:190px; border-radius:100px;top:15px;left:100px; z-index:2;color:#fff; text-align:center;}
.banner .dow_bg .mun{ font-size:34px;margin-top:70px;}
.banner .dow_bg .dd{ font-size:25px;font-weight: 300;margin-top:10px;}
.banner .downNum { padding-top:20px;}
.banner .downNum span {font-size:26px; padding-right:5px;}
.banner h1{ font-size:47px; font-weight:300;color:#3ea4a6; line-height:1.2em;}
.banner h1 span{display:block; font-size:20px; line-height:1em; padding-bottom:20px;}
.banner h1.title {font-size:44px;}
.banner .txt{color:#6e6e6e;font-size:23px;font-weight: 300;line-height:1.3em; padding:30px 0;}
.banner .txt2{color:#6e6e6e;font-size:23px;font-weight: 300;line-height:1.3em; padding:20px 0;}
.banner .picbox{position:relative;}
.banner .picbox .quote {overflow:hidden;}
.banner .picbox .quote li { height:115px;position:relative;}
.banner .picbox .quote li.item2{ display:none;}
.banner .picbox .item .pic{float:left;width:120px;}
.banner .picbox .item .text{float:left;width:300px;border-left:1px solid #6b6b6b; background:url(images/fh.jpg) no-repeat 10px 0;padding-left:60px;height:105px;color:#000;}
.banner .picbox .item .text .t1{ font-size:13px;font-weight: 700; line-height:1.3em;color:#000;}
.banner .picbox .item .text .t1 a {color:#666; font-weight:normal;}
.banner .picbox .item .text .t2{ font-size:11px; font-style:italic;font-weight: 300;}
.banner .btn{ width:380px; margin-top:20px;}
.banner .btn .btnk {position:relative; z-index:1; padding:30px 0 0 90px;}
.banner .btn .ifMac_btn .btnk {padding-top:18px;} 
.banner .btn .ifMac_btn .greenBtn2 {height:60px; padding-top:12px;}
.banner .btn .btnk .box_img {position:absolute; z-index:2; left:-10px; top:0;}
.banner .btn .link {padding-top:10px; font-size:16px; text-align:center;}

.iconbg{ background:#3ea4a6; padding-bottom:40px;}
.iconbg .item{float:left;width:200px;}
.iconbg .item a {display:block;margin:-51px 0 0 0;}
.iconbg .item a:hover {text-decoration:none; color:#fff;}
.iconbg .item a span{display:block; background:url(images/icon_bg.png) no-repeat; height:132px;}
.iconbg .item a .ic1{background-position:0 0;}
.iconbg .item a:hover .ic1 {background-position:-220px 0;}
.iconbg .item a .ic2{background-position:0 -142px;}
.iconbg .item a:hover .ic2 {background-position:-220px -142px;}
.iconbg .item a .ic3{background-position:0 -284px;}
.iconbg .item a:hover .ic3 {background-position:-220px -284px;}
.iconbg .item a .ic4{background-position:0 -426px;}
.iconbg .item a:hover .ic4 {background-position:-220px -426px;}
.iconbg .item a .ic5{background-position:0 -568px;}
.iconbg .item a:hover .ic5 {background-position:-220px -568px;}
.iconbg .item .text{color:#fff; font-size:20px; text-align:center; padding-top:5px;}

.iconbg1{ background:#3ea4a6; padding-bottom:40px;}
.iconbg1 .item{float:left;width:200px;}
.iconbg1 .item a {display:block;margin:-51px 0 0 0;}
.iconbg1 .item a:hover {text-decoration:none; color:#fff;}
.iconbg1 .item a span{display:block; background:url(images/icon_bg_fb.png) no-repeat; height:132px;}
.iconbg1 .item a .ic1{background-position:0 0;}
.iconbg1 .item a:hover .ic1 {background-position:-220px 0;}
.iconbg1 .item a .ic2{background-position:0 -142px;}
.iconbg1 .item a:hover .ic2 {background-position:-220px -142px;}
.iconbg1 .item a .ic3{background-position:0 -284px;}
.iconbg1 .item a:hover .ic3 {background-position:-220px -284px;}
.iconbg1 .item a .ic4{background-position:0 -426px;}
.iconbg1 .item a:hover .ic4 {background-position:-220px -426px;}
.iconbg1 .item a .ic5{background-position:0 -568px;}
.iconbg1 .item a:hover .ic5 {background-position:-220px -568px;}
.iconbg1 .item .text{color:#fff; font-size:20px; text-align:center; padding-top:5px;}

.iconbg2{ background:#3ea4a6; padding-bottom:40px;}
.iconbg2 .item{float:left;width:200px;}
.iconbg2 .item a {display:block;margin:-51px 0 0 0;}
.iconbg2 .item a:hover {text-decoration:none; color:#fff;}
.iconbg2 .item a span{display:block; background:url(images/icon_bg_dl.png) no-repeat; height:132px;}
.iconbg2 .item a .ic1{background-position:0 0;}
.iconbg2 .item a:hover .ic1 {background-position:-220px 0;}
.iconbg2 .item a .ic2{background-position:0 -142px;}
.iconbg2 .item a:hover .ic2 {background-position:-220px -142px;}
.iconbg2 .item a .ic3{background-position:0 -284px;}
.iconbg2 .item a:hover .ic3 {background-position:-220px -284px;}
.iconbg2 .item a .ic4{background-position:0 -426px;}
.iconbg2 .item a:hover .ic4 {background-position:-220px -426px;}
.iconbg2 .item a .ic5{background-position:0 -568px;}
.iconbg2 .item a:hover .ic5 {background-position:-220px -568px;}
.iconbg2 .item .text{color:#fff; font-size:20px; text-align:center; padding-top:5px;}

.iconbg3{ background:#3ea4a6; padding-bottom:40px;}
.iconbg3 .item{float:left;width:200px;}
.iconbg3 .item a {display:block;margin:-51px 0 0 0;}
.iconbg3 .item a:hover {text-decoration:none; color:#fff;}
.iconbg3 .item a span{display:block; background:url(images/icon_bg_cam.png) no-repeat; height:132px;}
.iconbg3 .item a .ic1{background-position:0 0;}
.iconbg3 .item a:hover .ic1 {background-position:-220px 0;}
.iconbg3 .item a .ic2{background-position:0 -142px;}
.iconbg3 .item a:hover .ic2 {background-position:-220px -142px;}
.iconbg3 .item a .ic3{background-position:0 -284px;}
.iconbg3 .item a:hover .ic3 {background-position:-220px -284px;}
.iconbg3 .item a .ic4{background-position:0 -426px;}
.iconbg3 .item a:hover .ic4 {background-position:-220px -426px;}
.iconbg3 .item a .ic5{background-position:0 -568px;}
.iconbg3 .item a:hover .ic5 {background-position:-220px -568px;}
.iconbg3 .item .text{color:#fff; font-size:20px; text-align:center; padding-top:5px;}


.proTable-menu {text-align:center; border-radius:5px; margin:0 auto 20px auto; overflow:hidden; background:#649f39; width:375px;}
.proTable-menu li {display:block; width:33.1%; float:left; padding:10px 0; background:#84c754;font-size:14px; font-weight:bold; color:#fff; cursor:pointer; border-left:1px solid #649f39;}
.proTable-menu li.curr {background:#649f39; color:#fff;}
.proTable-menu li:first-child{border-left:none;}
.proTogg-cont {border-top:solid 1px #e5e5e5; padding:40px 5%;}
.proTogg-cont .pro-table a {text-decoration:underline;}
.table1 th,.table1 td { padding:15px 20px;}

.page_bg {background-color:#f9f9f9;}


.titleColumn{ font-size:30px; text-align:center; line-height:1.2em; padding:10px 0;color:#3EA4A6;}
.titleColumn strong{display:block; font-size:14px;color:#bcc8cf;}

.picInfo-box {padding:30px 0;}
.picInfo-box .pimt40 {margin-top:40px;}
.picInfo-box .picfl img,.picInfo-box .picfr img,.picInfo-box .pic img {max-width:100%;}
.picInfo-box .picfl {float:left; width:50%; text-align:center;}
.picInfo-box .picfr {float:right; width:50%; text-align:center;}
.picInfo-box .pic {padding:20px 0;}
.picInfo-box .infofr {float:right; width:45%;}
.picInfo-box .infofl {float:left; width:45%;}
.picInfo-box .title-num {background:#63c0ec; color:#fff; border-radius:50px;width:50px; height:50px; line-height:50px; font-size:16px; text-align:center; font-size:16px; margin:10px 0; display:inline-block;}
.picInfo-box .title-name { font-size:30px; line-height:1.2em; padding:25px 0; font-weight:normal; color:#3ea4a6}
.picInfo-box .title-name span {font-weight:300;}
.picInfo-box .title-name2 { font-size:20px; line-height:1.2em; margin-top:-10px; font-weight:normal;}
.picInfo-box .iist_ul {padding:15px 0; overflow:hidden;}
.picInfo-box .iist_ul li {float:left; width:46%; list-style:disc; margin-left:4%; line-height:1.3em; padding:3px 0;}
.picInfo-box ul.list {padding:15px 0; float:left; width:50%;}
.picInfo-box ul.list li {float:none; width:auto; list-style:none; margin-left:0; color:#3ea4a6; font-size:20px; line-height:1.3em; padding:3px 30px; background:url(images/icon_g.png) no-repeat 0 10px;}
.picInfo-box .itemBox { text-align:center;}
.picInfo-box .itemBox li {display:inline-block; list-style:none; width:30%; padding:0 3%;}
.picInfo-box .itemBox li p {padding:10px 0;}
.picInfo-box .item3Box {padding-top:10px;}
.picInfo-box .item3Box .name {font-size:16px; font-weight:bold; padding:10px 0;}
.picInfo-box a.btnMore {color:#fff; text-decoration:underline;}
.picInfo-style {padding:0 0 30px 0;}
.picInfo-style .picfl {position:relative;}
.picInfo-style .picfl span {display:block; position:absolute; bottom:9%; left:54%;}
.picInfo-style .infofr {padding-top:5%;}
@media (max-width: 979px) {
	.picInfo-box .itemBox li {width:43%;}
	.picInfo-style .picfl span {width:80%; left:25%; bottom:15%;}
	.picInfo-style .infofr {padding-top:3%;}
}
@media (max-width: 767px) {
	.picInfo-box .picfl,.picInfo-box .infofr,.picInfo-box .picfr,.picInfo-box .infofl {float:none; width:auto;}
	.picInfo-box .infofl {padding-top:20px; padding-bottom:10px;}
	.picInfo-style .picfl span {left:auto; right:0;}
	.banner .pcImg {display:none;}
	.iconbg {display:none;}
		.slibox {display:none;}
			.revbox { width: 99%;}
			.banner .banner_sideleft { width: 90%;}
}
@media (max-width: 479px) {
	.picInfo-box .itemBox li {width:auto; float:none;}
	.banner .pcImg {display:none;}
	.iconbg {display:none;}
	.slibox {display:none;}
	.revbox { width: 99%;}
	.banner .banner_sideleft { width: 90%;}
}

.vc_hd_info .title-name {color:#fff; font-size:26px; padding-top:10%;}
.vc_hd_info .pic { margin-top:-7%;}

/*screencast*/
.featImgSlide{position:relative;margin:10px auto;}
.featImgSlide .imgSlide {list-style: none;padding: 0;margin: 0 auto;width:600px;}
.featImgSlide .imgSlide li {position:relative; text-align:center; line-height:1.3em;}
.featImgSlide .imgSlide li img {max-width:100%;}
.featImgSlide .imgSlide li.roundabout-in-focus {cursor:default;}
.featImgSlide .imgSlide li span{text-align:center; display:block; padding-top:10px;}
.featImgSlide .flex-control-paging{position:absolute;bottom:-40px;left:50%;text-align:center;list-style:none;margin-left:-50px;}
.featImgSlide .flex-control-paging li{margin-right:10px;display:inline-block;*display:inline;}
.featImgSlide .flex-control-paging li a{display:inline-block; background:#e0e0e0;width:14px;height:14px;cursor:pointer; overflow:hidden; text-indent:-99999px; border-radius:20px;}
.featImgSlide .flex-control-paging li a.flex-active{background:#3EA4A6;}  
.featImgSlide .flex-prev,.featImgSlide .flex-next{ background:url(images/prev4.png) no-repeat; width:55px; height:80px; position:absolute; top:35%;left:50%;z-index:1; text-indent:-9999px;}
.featImgSlide .flex-prev:focus,.featImgSlide .flex-next:focus{ outline:none;}
.featImgSlide .flex-prev{margin-left:-315px;}
.featImgSlide .flex-next{ background-position:-55px 0;margin-left:250px;}
@media (max-width: 979px) {
	.featImgSlide .flex-prev,.featImgSlide .flex-next{display:none;}
}

.page_bottom {margin:15px 0; font-size:16px; text-align:center;}
.page_bottom a {text-decoration:underline; color:#0072bc;}

/*footer*/
.footer{ background:#19282f; overflow:hidden; padding: 25px 0; color:#88919f; text-align:left;}
.footer dt{ font-size:15px;  color:#a7b0bd; margin-bottom:2px;}
.footer a{color:#88919f;}
.footer .link{ font-size:12px;padding-right:20px; margin-right:20px;}

.topPro-nav {padding:10px 0; background:#3EA4A6!important; color:#fff;}
.topPro-nav .if_close_top {background-color:#3EA4A6!important;}
.topPro-nav .pro_name {float:left; font-size:24px; padding:10px 0 0 0;}
.topPro-nav .btn {float:right;}
.topPro-nav .btn a {float:left; line-height:43px!important;}

.livechatBtn,.feedbackBtn{ display:block;background:url(https://images.wondershare.net/style/images/livechat_icon.jpg) no-repeat; width:45px; height:42px; position:fixed; right:0;bottom:30%; z-index:2;-webkit-transition: all 0.3s;-moz-transition: all 0.3s;transition: all 0.3s;}
.livechatBtn:hover{width:116px;}
.feedbackBtn{ background-image:url(https://images.wondershare.com/style/images/feedback.png); width:50px; height:100px;}
@media (max-width: 979px) {
  .livechatBtn{ display:none !important;}
}

.toTop {display:block; position:fixed; z-index:2; background:url(https://images.wondershare.net/style/images/btn.png) no-repeat  -163px -53px; width:55px; height:50px; bottom:30px; right:3%;}

/*main2*/

.revbox{float:right;width:39%;}
.revbox .item{ background:#ececec; border-radius:10px;padding:15px 20px;margin-top:10px;}
.revbox .arrow{display:block;background:url(images/arrow.png) no-repeat;width:34px;height:17px;margin-left:30px;}
.slibox{float:left;width:58%;}
/*rating*/
.rating{display:inline-block;*display:inline; zoom:1;} 
.rating li{ display:inline-block; *display:inline;*padding:0 2px 0 0; height:15px;width:15px; background:url(images/star_img.png) no-repeat 0 -3px; zoom:1}
.rating li.on{background-position:0 -31px}
.rating li.half{background-position:0 -58px}

.bottom_bg{ background:#3ea4a6; color:#fff; padding:35px 0;}
.bottom_bg h1{ font-size:47px; font-weight:300; text-align:center; line-height:1.1em;}
.bottom_bg h1 span{ font-size:21px; display:block; font-weight:normal;font-weight:300;}
.bottom_bg .btn{ width:375px; margin:30px auto 0 auto;}
.bottom_bg .downNum { padding-top:20px; text-align:center;}
.bottom_bg .downNum span {font-size:26px; padding-right:5px;}

.button {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    padding: 12px 24px;
    border: 1px solid #0f1847;
    border-radius: 8px;
    background: #2b44c6;
    background: -webkit-gradient(linear, left top, left bottom, from(#2b44c6), to(#0f1847));
    background: -moz-linear-gradient(top, #2b44c6, #0f1847);
    background: linear-gradient(to bottom, #2b44c6, #0f1847);
    -webkit-box-shadow: #3452ee 0px 0px 40px 0px;
    -moz-box-shadow: #3452ee 0px 0px 40px 0px;
    box-shadow: #3452ee 0px 0px 40px 0px;
    text-shadow: #090e28 1px 1px 1px;
    font: normal normal bold 20px arial;
    color: #ffffff;
    text-decoration: none;
}
.button:hover,
.button:focus {
    background: #ff5959;
    background: -webkit-gradient(linear, left top, left bottom, from(#ff5959), to(#b62f2f));
    background: -moz-linear-gradient(top, #ff5959, #b62f2f);
    background: linear-gradient(to bottom, #ff5959, #b62f2f);
    color: #ffffff;
    text-decoration: none;
}
.button:active {
    background: #982727;
    background: -webkit-gradient(linear, left top, left bottom, from(#982727), to(#982727));
    background: -moz-linear-gradient(top, #982727, #982727);
    background: linear-gradient(to bottom, #982727, #982727);
}
.button:before{
    content:  "\0000a0";
    display: inline-block;
    height: 24px;
    width: 24px;
    line-height: 24px;
    margin: 0 4px -6px -4px;
    position: relative;
    top: 0px;
    left: 0px;
    background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEyElEQVRIia2Va2xTZRjHf+fSrbRbYTh3010YY0Ecg8UoIETJ5APRDAYqfFliMqIJIpcgiSFZREOMH4xRol8MJCgYYzSBqENuMcIYlxmGLhtzA9Z1967b2q7t2p6257x+OGdQjSEu8UmenJw37/n/n///fc77KMwx6isoWFvI6ifmkyuniI1rxOaK8dC4tC//uBi7Ioy+MyJw6UOt8/PNV7/bntlYaMf+vxBc2F34vZgZFiI8JER4WIioV4jRy6Lv2JbeT2pZ98/98pwZhAAtaGUAZnxgy6F8yweVr7/73q8nXnE0pm9X567BgEQIdAMQJqHJjHPJBvXl3frRYPiwb895mgGUucI3rBDbyueHl0naFGS6QE+BHgM9DqkotgUlUnFWZEPbjd4vh2aIKtW5ZD1XREW3n4BZ3sNj06LkNqevc1mkqwXJfY7MhY+APQdSUUjFITlDdmGpMz9w1fjmlvaL8tlm9jUdbDi94/lHG1+rkVZvLJ5eoM2IaE8Av+nB32NtKetddparKmo8rpFy/4azsAhsDkjFTDUCpITv8WNnh76QTm7lcMPeXU04S028RIDkpJuhwUHP9NhQq7t/9OLxNtF6pg+PpTAXKFuaS+UbT7HjxSXUFpcX4Fi3E3TdKkmgjXexcc/pFWo0QRK/G2Tn/YJtOaWUL1xURo1RVpMKNtS9OsTw6Mi98KS35fadiYtHr9B6aZBb+8/z82CIQ++4vPsc2iBIDvPQdci021icS4l628c9ERxAyi4GYTxwRRZmE8uCjNxCyvMeq0A2KlbUTjdu3e412tu7Lqx7P/TSp9c5tHE56wsM/0rQTAJDgqk2ZAVZvTpMT8Q/QXZewCSQhNlbae1nPoRpkAx2yS9nTIUqzTdCsmteD7K2El0zwf3doA2AAmq3l2GfPxTK1vwuMB6AK2ngzKoxEKN38d0YJzxjdlzTC1Q9syZ/E8Y06EkI3QPNDzKkkhhqzCA4FdQGFwe6q8jKBRRThSxM/PtKdPQ+D972KKMaoa86+OhoA7X1dTnH5+dlOtD6IDaBeQAQ9cFIiEkVSPijuImPVWF4weEEuwMkG8hSWoPqiDxw1KgY4yLYtFp5u3yRrVJRk5C4a9prs0xLwEA/oevDeFSA8QjdqGxCFUAE9AikAFk2U5FAAtUFOTmw6klKEEkQCVNlpln4bMZuQ4ePlnAcnwrQ4eV3AUgq5u2kYlajGlZaa4qVkpVYf4ZhgRuQ6oTREVInOjgCGCrA5X7uxDRwuCwAmykTAWSlrSkWUfodLCwCDZLXwOeGZg9fn/2TFqztdI0x7AsTKivAhQ3ENPjbTVtzykBZDuSnkchpCjQQ/RBphUAcrvho2f8TB60STYKETnAihKfMRrUYg4luGBFEFZAjHuxON2QVQeZSkAsAO4gU6JMQvQPTg5AQ0Ozh1IEf2WsYeGcFzs6D1PQUbr2Lat8E9KfwHjjHTv8M8bfWsmtNEbX5fhxqG6jzQLE6mRREkhi3/PQcu8mR5k6+BUJpBj4YOCMxusaD1P8RpevN0+wYmOImYOw+RWuWnWV1VdSuKuHpXCcFGSpyWCPUO0HPD51c7vVyDfDxsOu+rppnP67npCODCv59lMqmObisdDDHiSgDGXP54L/EX5ztNQw3UOoSAAAAAElFTkSuQmCC") no-repeat left center transparent;
    background-size: 100% 100%;
}