﻿
ul,
ol,
li {
    list-style: none;
}

.page-bottom--area {
    padding: 12px 0 13px;
}

    .page-bottom--area .bottom-content {
        margin: 0 auto;
        width: 1200px;
        text-align: center;
        font-size: 0;
    }

        .page-bottom--area .bottom-content .top-area {
            margin-bottom: 16px;
        }

        .page-bottom--area .bottom-content .display-style {
            display: inline-block;
            vertical-align: middle;
        }

        .page-bottom--area .bottom-content .divider {
            margin: 0 10px;
            width: 1px;
            height: 12px;
            font-weight: 400;
        }

        .page-bottom--area .bottom-content .common-style {
            font-size: 12px;
            font-weight: 400;
        }

        .page-bottom--area .bottom-content a {
            font-weight: 400;
            text-decoration: none;
        }

        .page-bottom--area .bottom-content .ga-area a img {
            margin-top: 1px;
            margin-right: 6px;
            width: 14px;
            height: 14px;
            vertical-align: middle;
        }

        .page-bottom--area .bottom-content .ali-area a img {
            margin-top: -2px;
            margin-right: 10px;
            width: 55px;
            height: 13px;
            vertical-align: middle;
        }

        .page-bottom--area .bottom-content .ipv-area .ipv6-box {
            display: inline-block;
            margin-left: 4px;
            text-align: center;
            border-radius: 4px;
            border: 1px solid rgba(152, 152, 152, 1);
            padding: 3px;
        }
        .page-bottom--area .bottom-content .ali-area a svg, .page-bottom--area .bottom-content .ali-area a span {
            vertical-align: top;
        }
        .bottom-words {
            vertical-align: middle;
        }
.page-bottom--area .bottom-content .ga-area a img, .page-bottom--area .bottom-content .ga-area a span {
    vertical-align: top;
}

@charset "UTF-8";
/*
CSS Reset
*/
/*布局（grid）（.g-）；模块（module）（.m-）；元件（unit）（.u-）；功能（function）（.f-）；皮肤（skin）（.s-）；状态（.z-）*/
/* reset */
html { height:100%; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; -webkit-font-smoothing: antialiased!important;}
body,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { margin:0; padding:0;}
body,button, input, select, textarea {font: 12px/1 "Microsoft YaHei","微软雅黑","arial","tahoma","MicrosoftJhengHei";  -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; -webkit-font-smoothing: antialiased!important;/* 用 ascii 字符表示，使得在任何编码下都无问题 */}
input.form-control{font: 12px/1 "Microsoft YaHei","微软雅黑","arial","tahoma","MicrosoftJhengHei";}
body { background-color:transparent; min-height:100%; height:auto !important; overflow-x: hidden;}
img { border:0; vertical-align:middle; -ms-interpolation-mode:bicubic;}
a {text-decoration:none; background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; /* 2 */ color:#333;}
a.focus, a:focus{outline:0;}
a.active.focus, a.active:focus, a.active:hover, a.focus:active, a:focus:active, a:hover:active, .open > a.dropdown-toggle.focus, .open > a.dropdown-toggle:focus, .open > a.dropdown-toggle:hover{outline:0;text-decoration:none;font-weight:400;}
a:hover {text-decoration:none; transition:box-shadow .3s, border .3s, background-color .3s, color .3s;}
a:active,a:visited{text-decoration:none;}
a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover{}


h1 { font-size:16px; line-height:36px;}
h2 { font-size:14px; line-height:30px;}
h3 { line-height:24px;}
h3,h4,h5,h6 { font-size:12px;}
ul,li,ol { margin:0; padding:0; list-style:none outside none;}
ul.has-style li,ol li { margin-left:25px;}
ul.has-style li { list-style:disc;}
ol li { list-style:decimal;}
ul.inline-style li { float:left; display:inline;}
dl { margin-bottom:18px;}
dt { font-weight:bold;}
dd { margin:0 0 0 9px; padding:0;}
svg:not(:root) { overflow:hidden;}
pre { margin:0; white-space:pre-wrap; white-space:-moz-pre-wrap !important; white-space:-pre-wrap; white-space:-o-pre-wrap; word-wrap:break-word;}

/*- Form -*/
button,input,select,textarea { font-size:100%; font-family:tahoma; margin:0; outline:0 none; vertical-align:baseline; *vertical-align:middle;}
textarea { overflow:auto; vertical-align:top; resize:none;}
button,input { line-height:normal; }
button.active.focus, button.active:focus, button.active:hover, button.focus:active, button:focus:active, button:hover:active, .open > button.dropdown-toggle.focus, .open > button.dropdown-toggle:focus, .open > button.dropdown-toggle:hover{outline:0;}
button,html input[type="button"],input[type="reset"],input[type="submit"],.submit-btn { -webkit-appearance:button; cursor:pointer; *overflow:visible;}
button[disabled],input[disabled],.disable { cursor:default;}
input[type="checkbox"],input[type="radio"],.form-radio,.form-checkbox { box-sizing:border-box; padding:0; *height:13px; *width:13px;}

/*- Html5 -*/
fieldset { border:1px solid #c0c0c0; margin:0 2px 18px; padding:0.35em 0.625em 0.75em;}
legend { border:0; padding:0; white-space:normal; *margin-left:-7px;}
button::-moz-focus-inner,input::-moz-focus-inner { border:0; padding:0;}
article,aside,details,figcaption,figure,footer,header,hgroup,nav,section,summary { display:block;}
audio,canvas,video { display:inline-block; *display:inline; *zoom:1;}
audio:not([controls]) { display:none; height:0;}
nav ul,nav ol { list-style:none; list-style-image:none;}
input[type="search"] { -webkit-appearance:textfield; -moz-box-sizing:content-box; -webkit-box-sizing:content-box; box-sizing:content-box;}
input[type="search"]::-webkit- search-cancel-button,input[type="search"]::-webkit-search-decoration { -webkit-appearance:none;}
::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */font: inherit; /* 2 */}
abbr[title] {border-bottom: none; /* 1 */text-decoration: underline; /* 2 */ text-decoration: underline dotted; /* 2 */}

/*- Add the correct display in IE. -*/
template {display: none;}
/*- Hidden Add the correct display in IE 10-. -*/
[hidden] {display: none;}


/*scrollbar*/
::-webkit-scrollbar{width:8px;height: 6px;}
::-webkit-scrollbar-track-piece{margin-right:10px; background-color:#EEE; -webkit-border-radius:8px;}
::-webkit-scrollbar-thumb:vertical{height:8px; background-color:#DDD; -webkit-border-radius:8px;}
::-webkit-scrollbar-thumb:horizontal{ width:6px; background-color:#EEE; -webkit-border-radius:8px;}


/*------ function ------*/
/*- f-clearfix -*/
.f-clearfix:before,.f-clearfix:after,.clearfix:before,.clearfix:after,.f_clearfix:before,.f_clearfix:after { content:""; display:table;}
.f-clearfix:after,.clearfix:after,.f_clearfix:after { clear:both; overflow:hidden;}
.f-clearfix,.clearfix,.f_clearfix  { zoom:1;}

/*- Float -*/
.f-left { float:left;}
.f-right { float:right;}
.f-no-float{float:none !important;}

/*- Block -*/
.f-hide{display:none !important;}
.f-inline {display:inline !important;}
.f-inlineblock{display:inline-block !important;}
.f-block{display:block;}
.f-display-table{display:table;}
.f-table-cell{display:table-cell;}
.f-middle{ vertical-align:middle !important; }

/*- Overflow -*/
.f-break{word-break:break-all; word-wrap:break-word;}
.f-ellipsis{overflow:hidden; white-space:nowrap; text-overflow:ellipsis;}
.f-overflow{overflow:hidden;}
.f-no-overflow{overflow:initial !important;}

/*- position -*/
.f-fixed{position:fixed !important; z-index:99;}
.f-relative{position:relative;}
.f-absolute{position:absolute;}

/*- scroll -*/
.f-scroll-y{overflow-y:scroll;}

/*- Text -*/
.text-large{font-size:18px !important;}
.text-xlarge{font-size:24px !important;}
.text-middle{font-size:16px !important;}
.text-normal{font-size:14px !important;}
.text-small{font-size:12px !important;}
.text-xsmall{font-size:11px !important;}
.strong{ font-weight:700 !important;}
.thin{font-weight:400 !important;}

/*- Text-align -*/
.text-left{ text-align:left !important;}
.text-right{ text-align:right !important;}
.text-center{ text-align:center !important;}
.text-middleAlign{ vertical-align:middle !important; }

/*- Text-Decoration -*/
.f-tdu,.f-tdu:hover{text-decoration:underline;}
.f-tdn,.f-tdn:hover{text-decoration:none;}

/*- Border -*/
.border{border:1px inherit solid}
.border-top{border-top:1px inherit solid !important;}
.border-right{border-right:1px inherit solid !important;}
.border-bottom{border-bottom:1px inherit solid !important;}
.border-left{border-left:1px inherit solid !important;}
.border-none{border:none !important;}
.border-top-none{border-top:none !important;}
.border-right-none{border-right:none !important;}
.border-bottom-none{border-bottom:none !important;}
.border-left-none{border-left:none !important;}
.border-dashed{border-style:dashed !important;}

/*- Border Radius -*/
.radius{-moz-border-radius:4px !important;-webkit-border-radius:4px !important; border-radius:4px !important;}
.radius-3{-moz-border-radius:3px !important;-webkit-border-radius:3px !important;border-radius:3px !important;}
.radius-2{-moz-border-radius:2px !important;-webkit-border-radius:2px !important;border-radius:2px !important;}
.radius-50{-moz-border-radius:50px !important;-webkit-border-radius:50px !important;border-radius:50px !important;}
.radius-tl{-moz-border-top-right-radius:4px;-webkit-border-top-right-radius:4px;border-top-right-radius:4px;}
.radius-tr{-moz-border-top-left-radius:4px;-webkit-border-top-left-radius:4px;border-top-left-radius:4px;}
.radius-bl{-moz-border-bottom-right-radius:4px;-webkit-border-bottom-right-radius:4px;border-bottom-right-radius:4px;}
.radius-br{-moz-border-bottom-left-radius:4px;-webkit-border-bottom-left-radius:4px;border-bottom-left-radius:4px;}
.radius-0{-moz-border-radius:0px !important;-webkit-border-radius:0px !important;border-radius:0px !important;}
.radius-tl-0{-moz-border-top-left-radius:0px !important;-webkit-border-top-left-radius:0px !important;border-top-left-radius:0px !important;}
.radius-tr-0{-moz-border-top-right-radius:0px !important;-webkit-border-top-right-radius:0px !important;border-top-right-radius:0px !important;}
.radius-bl-0{-moz-border-bottom-left-radius:0px !important;-webkit-border-bottom-left-radius:0px !important;border-bottom-left-radius:0px !important;}
.radius-br-0{-moz-border-bottom-right-radius:0px !important;-webkit-border-bottom-right-radius:0px !important; border-bottom-right-radius:0px !important;}

/*- Background -*/
.background{background:#F9F9F9;}
.background-none{background:none !important;}

/*- Shadow -*/
.shadow-none{box-shadow:none; }

/*- Padding -*/
.f-p5{padding:5px;}
.f-pt5{padding-top:5px !important;}
.f-pr5{padding-right:5px !important;}
.f-pb5{padding-bottom:5px !important;}
.f-pl5{padding-left:5px !important;}
.f-p10{padding:10px;}
.f-pt10{padding-top:10px !important;}
.f-pr10{padding-right:10px !important;}
.f-pb10{padding-bottom:10px !important;}
.f-pl10{padding-left:10px !important;}
.f-p12{padding:12px;}
.f-pt12{padding-top:12px !important;}
.f-pr12{padding-right:12px !important;}
.f-pb12{padding-bottom:12px !important;}
.f-pl12{padding-left:12px !important;}
.f-p15{padding:15px;}
.f-pt15{padding-top:15px !important;}
.f-pr15{padding-right:15px !important;}
.f-pb15{padding-bottom:15px !important;}
.f-pl15{padding-left:15px !important;}
.f-p18{padding:18px;}
.f-pt18{padding-top:18px !important;}
.f-pr18{padding-right:18px !important;}
.f-pb18{padding-bottom:18px !important;}
.f-pl18{padding-left:18px !important;}
.f-p20{padding:20px;}
.f-pt20{padding-top:20px !important;}
.f-pr20{padding-right:20px !important;}
.f-pb20{padding-bottom:20px !important;}
.f-pl20{padding-left:20px !important;}
.f-p24{padding:24px;}
.f-pt24{padding-top:24px !important;}
.f-pr24{padding-right:24px !important;}
.f-pb24{padding-bottom:24px !important;}
.f-pl24{padding-left:24px !important;}
.f-p30{padding:30px;}
.f-pt30{padding-top:30px !important;}
.f-pr30{padding-right:30px !important;}
.f-pb30{padding-bottom:30px !important;}
.f-pl30{padding-left:30px !important;}
/*- padding none -*/
.f-p0{padding:0px !important;}
.f-pt0{padding-top:0px !important;}
.f-pr0{padding-right:0px !important;}
.f-pb0{padding-bottom:0px !important;}
.f-pl0{padding-left:0px !important;}

/*- Margin -*/
.f-m5{margin:5px;}
.f-mt5{margin-top:5px !important;}
.f-mr5{margin-right:5px !important;}
.f-mb5{margin-bottom:5px !important;}
.f-ml5{margin-left:5px !important;}
.f-m10{margin:10px;}
.f-mt10{margin-top:10px !important;}
.f-mr10{margin-right:10px !important;}
.f-mb10{margin-bottom:10px !important;}
.f-ml10{margin-left:10px !important;}
.f-m12{margin:12px;}
.f-mt12{margin-top:12px !important;}
.f-mr12{margin-right:12px !important;}
.f-mb12{margin-bottom:12px !important;}
.f-ml12{margin-left:12px !important;}
.f-m15{margin:15px;}
.f-mt15{margin-top:15px !important;}
.f-mr15{margin-right:15px !important;}
.f-mb15{margin-bottom:15px !important;}
.f-ml15{margin-left:15px !important;}
.f-m18{margin:18px;}
.f-mt18{margin-top:18px !important;}
.f-mr18{margin-right:18px !important;}
.f-mb18{margin-bottom:18px !important;}
.f-ml18{margin-left:18px !important;}
.f-m20{margin:20px;}
.f-mt20{margin-top:20px !important;}
.f-mr20{margin-right:20px !important;}
.f-mb20{margin-bottom:20px !important;}
.f-ml20{margin-left:20px !important;}
.f-m30{margin:30px;}
/*- Margin none -*/
.f-m0{margin:0px !important;}
.f-mt0{margin-top:0px !important;}
.f-mr0{margin-right:0px !important;}
.f-mb0{margin-bottom:0px !important;}
.f-ml0{margin-left:0px !important;}

/*- Cursor -*/
.f-csp{cursor:pointer;}
.f-csd{cursor:default;}
.f-csh{cursor:help;}
.f-csm{cursor:move;}

/*- about smart -*/
.animated{-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;opacity:0;filter:alpha(opacity:0)}
.smvContainer{margin:0 auto;position:relative}
.context-menu-list{margin:0;padding:0;min-width:180px;max-width:250px;display:inline-block;position:absolute;list-style-type:none}
.context-menu-item{position:relative}
.control-add-flag{cursor:crosshair!important}
.yibuFrameContent{height:100%}
.smartAbs{position:absolute}
.smartFixed{position:fixed!important}
.smart-deleted,.smart-none{display:none;}
.sm-context-menu{background-color:#fff;box-shadow:0 0 15px rgba(0,0,0,.15),0 0 1px 1px rgba(0,0,0,.1);content:'';position:absolute;line-height:1.2;padding-top:0;padding-bottom:0;cursor:default;margin:0;font-size:15px;overflow:visible;border-radius:3px}
div.zoomDiv{z-index:999999999;position:absolute;top:0;left:0;width:200px;height:200px;background:#fff;border:1px solid #CCC;display:none;text-align:center;overflow:hidden}
div.zoomMask{position:absolute;background:url(images/mask.png) repeat scroll 0 0 transparent;cursor:move;z-index:999999999}
.ui-hide-handler{display:none!important;}

/*- 页面模板布局 -*/
.header {height: 200px;}
.footer {height: 200px;}
.main-layout-wrapper {position: relative;}
.main-layout {position: relative;margin: 0 auto;}
.col-main {float: left;width: 100%;min-height: 1px;}
.col-right {margin-left: -100% !important;overflow: visible;width: 190px;float: right;}
/*.main-layout .main-wrap {margin-right: 190px;}*/
.main-wrap:after {content: '\20';display: block;height: 0;clear: both;}
.sub-wrap {position: relative;width: 100%;}

/*-  所有容器类控件 -*/
.smAreaC{position:relative; }

/*-widget nodata -*/
.m-nodata{padding:12px 14px 12px 10px; border:1px #EEE solid; background-color:#FFF; }
.m-nodata .m-datain{display:table;}
.m-nodata .m-datain .m-dataimg{width:60px; height:auto; float:left; margin-right:6px;}
.m-nodata .m-datain .m-datatext{display:table-cell; vertical-align:middle;line-height:18px; color:#4a4a4a;}


.w-clearfix:after {
  content: '';
  clear: both;
  height: 0;
  display: block;
  overflow: hidden; }

.w-pageline.w-page-num {
  margin: 20px auto;
  padding: 0;
  font-family: Arial,"Lucida Grande","Microsoft Yahei","Hiragino Sans GB","Hiragino Sans GB W3",SimSun,STHeiti;
  font-size: 12px;
  display: table; 
  clear: both;
}

.w-pageline.w-page-num ul {
  list-style: none outside none;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0; }

.w-pageline.w-page-num ul li {
  float: left;
  margin-right: 10px;
  height: 30px;
  line-height: 30px;
  text-align: center; }

.w-pageline.w-page-num ul li em {
  font-style: normal;
  color: #666; }

.w-pageline.w-page-num ul li input {
  padding: 0 10px;
  width: 10px;
  height: 30px;
  line-height: 30px;
  border: 1px solid #ddd;
  border-radius: 3px;
  outline: none; }

.w-pageline.w-page-num ul li a {
  display: block;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
  text-decoration: none; }

.w-pageline.w-page-num ul li a:hover {
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear; }

.w-page-cm {
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center; }

.w-page-cm.disabled {
  -webkit-opacity: .5;
  -moz-opacity: .5;
  -ms-opacity: .5;
  opacity: .5; }

.w-page-cm.disabled a {
  cursor: default; }

.w-page-square .w-page-cm.disabled a:hover {
  background: #fff;
  color: #666;
  border-color: #ddd; }

.w-page-round .w-page-cm.disabled a:hover {
  background: #fff;
  color: #666;
  border-color: #ddd; }

.w-page-alpha .w-page-cm.disabled a:hover {
  background: #fff;
  color: #666; }

.w-page-square-blue .w-page-cm.disabled a:hover {
  background: #eee;
  color: #666;
  border-color: #eee; }

.w-page-square-red .w-page-cm.disabled a:hover {
  background: #eee;
  color: #666;
  border-color: #eee; }

.w-page-square-orange .w-page-cm.disabled a:hover {
  background: #ddd;
  color: #666;
  border-color: #eee; }

.w-page-square li a i {
  display: none; }

.w-page-square li.w-page-flip {
  width: 67px !important; }

.w-page-square li a {
  color: #666;
  background: #fff;
  border-color: #ddd;
  border-width: 1px;
  border-style: solid;
  border-radius: 3px; }

.w-page-square li a:hover {
  background: #eee;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-page-square li.active a {
  background: #eee;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-page-round li a span {
  display: none; }

.w-page-round li a {
  color: #666;
  background: #fff;
  border-color: #ddd;
  border-width: 1px;
  border-style: solid;
  border-radius: 16px; }

.w-page-round li a:hover {
  background: #eee;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-page-round li.active a {
  background: #eee;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-page-alpha li a span {
  display: none; }

.w-page-alpha li a {
  color: #666;
  background: #fff;
  border-radius: 3px; }

.w-page-alpha li a:hover {
  background: #eee; }

.w-page-alpha li.active a {
  background: #eee; }

.w-page-square-blue li a i {
  display: none; }

.w-page-square-blue li.w-page-flip {
  width: 67px !important; }

.w-page-square-blue li a {
  color: #666;
  background: #eee;
  border-color: #eee;
  border-width: 1px;
  border-style: solid;
  border-radius: 3px; }

.w-page-square-blue li a:hover {
  color: #fff;
  background: #00ACF0;
  border-color: #00ACF0;
  border-width: 1px;
  border-style: solid; }

.w-page-square-blue li.active a {
  color: #fff;
  background: #00ACF0;
  border-color: #00ACF0;
  border-width: 1px;
  border-style: solid; }

.w-page-square-red li a i {
  display: none; }

.w-page-square-red li.w-page-flip {
  width: 67px !important; }

.w-page-square-red li a {
  color: #666;
  background: #eee;
  border-color: #eee;
  border-width: 1px;
  border-style: solid;
  border-radius: 0px; }

.w-page-square-red li a:hover {
  color: #fff;
  background: #EA594F;
  border-color: #EA594F;
  border-width: 1px;
  border-style: solid; }

.w-page-square-red li.active a {
  color: #fff;
  background: #EA594F;
  border-color: #EA594F;
  border-width: 1px;
  border-style: solid; }

.w-page-square-orange li a i {
  display: none; }

.w-page-square-orange li.w-page-flip {
  width: 67px !important; }

.w-page-square-orange li a {
  color: #666;
  background: #ddd;
  border-color: #eee;
  border-width: 1px;
  border-style: solid;
  border-radius: 3px; }

.w-page-square-orange li a:hover {
  color: #fff;
  background: #F57A19;
  border-color: #F57A19;
  border-width: 1px;
  border-style: solid; }

.w-page-square-orange li.active a {
  color: #fff;
  background: #F57A19;
  border-color: #F57A19;
  border-width: 1px;
  border-style: solid; }

.w-clearfix:after {
  content: '';
  clear: both;
  height: 0;
  display: block;
  overflow: hidden; }

.w-pageline.w-page-go {
  display: table;
  margin: 20px auto;
  padding: 0;
  font-family: Arial,"Lucida Grande","Microsoft Yahei","Hiragino Sans GB","Hiragino Sans GB W3",SimSun,STHeiti;
  font-size: 12px; }

.w-pageline.w-page-go ul {
  list-style: none outside none;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0; }

.w-pageline.w-page-go ul li {
  float: left;
  margin-right: 10px;
  height: 30px;
  line-height: 30px;
  text-align: center; }

.w-pageline.w-page-go ul li em {
  font-style: normal;
  color: #666; }

.w-line-height-ie7 {
  *display: inline-block;
  *height: 30px;
  *line-height: 14px;
  *vertical-align: middle; }

.w-pageline.w-page-go ul li input {
  padding: 0 4px;
  width: 22px;
  height: 30px;
  line-height: 30px;
  border: 1px solid #ddd;
  border-radius: 3px;
  outline: none;
  *display: inline-block;
  text-align: center; }

.w-pageline.w-page-go ul li a {
  display: block;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear;
  text-decoration: none; }

.w-pageline.w-page-go ul li a:hover {
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear; }

.w-pageline.w-page-go .w-page-cm {
  width: 67px;
  height: 30px;
  line-height: 30px;
  text-align: center; }

.w-pageline.w-page-go .w-line-height-ie7 {
  margin-right: 10px; }

.w-pageline.w-page-go .w-page-cm.disabled {
  -webkit-opacity: .5;
  -moz-opacity: .5;
  -ms-opacity: .5;
  opacity: .5; }

.w-pageline.w-page-go .w-page-cm.disabled a {
  cursor: default; }

.w-pageline.w-page-go .w-page-rectangle .w-page-cm.disabled a:hover {
  color: #666;
  background: #eee;
  border-color: #ddd; }

.w-pageline.w-page-go .w-page-rectangle-white .w-page-cm.disabled a:hover {
  color: #666;
  background: #fff;
  border-color: #999; }

.w-pageline.w-page-go .w-page-rectangle-gray .w-page-cm.disabled a:hover {
  color: #666;
  background: #eee;
  border-color: #ddd; }

.w-pageline.w-page-go .w-page-rectangle-red .w-page-cm.disabled a:hover {
  color: #EA594F;
  background: #fff;
  border-color: #EA594F; }

.w-pageline.w-page-go .w-page-rectangle-round .w-page-cm.disabled a:hover {
  color: #666;
  background: #fff;
  border-color: #ddd; }

.w-pageline.w-page-go .w-page-rectangle-alpha .w-page-cm.disabled a:hover {
  color: #666;
  background: none; }

.w-pageline.w-page-go .w-page-rectangle li a i {
  display: none; }

.w-pageline.w-page-go .w-page-rectangle li a {
  color: #666;
  background: #eee;
  border-color: #ddd;
  border-width: 1px;
  border-style: solid;
  border-radius: 3px; }

.w-pageline.w-page-go .w-page-rectangle li a:hover {
  background: #ddd;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle li.active a {
  background: #ddd;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-white li a i {
  display: none; }

.w-pageline.w-page-go .w-page-rectangle-white li a {
  color: #666;
  background: #fff;
  border-color: #999;
  border-width: 1px;
  border-style: solid;
  border-radius: 3px; }

.w-pageline.w-page-go .w-page-rectangle-white li a:hover {
  background: #ccc;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-white li.active a {
  background: #ccc;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-gray li a i {
  display: none; }

.w-pageline.w-page-go .w-page-rectangle-gray li a {
  color: #666;
  background: #eee;
  border-color: #ddd;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-gray li a:hover {
  background: #ddd;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-gray li.active a {
  background: #ddd;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-red li a i {
  display: none; }

.w-pageline.w-page-go .w-page-rectangle-red li input {
  border-radius: 3px !important; }

.w-pageline.w-page-go .w-page-rectangle-red li a {
  color: #EA594F;
  background: #fff;
  border-color: #EA594F;
  border-width: 1px;
  border-style: solid;
  border-radius: 16px; }

.w-pageline.w-page-go .w-page-rectangle-red li a:hover {
  color: #fff;
  background: #EA594F;
  border-color: #EA594F;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-red li.active a {
  color: #fff;
  background: #EA594F;
  border-color: #EA594F;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-round li input {
  width: 67px; }

.w-pageline.w-page-go .w-page-rectangle-round li a span {
  display: none; }

.w-pageline.w-page-go .w-page-rectangle-round li input {
  border-radius: 16px !important; }

.w-pageline.w-page-go .w-page-rectangle-round li.w-page-flip {
  width: 30px !important; }

.w-pageline.w-page-go .w-page-rectangle-round li a {
  color: #666;
  background: #fff;
  border-color: #ddd;
  border-width: 1px;
  border-style: solid;
  border-radius: 16px; }

.w-pageline.w-page-go .w-page-rectangle-round li a:hover {
  color: #666;
  background: #ccc;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-round li.active a {
  color: #666;
  background: #ccc;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-pageline.w-page-go .w-page-rectangle-alpha li a span {
  display: none; }

.w-pageline.w-page-go .w-page-rectangle-alpha li input {
  border-radius: 16px !important; }

.w-pageline.w-page-go .w-page-rectangle-alpha li.w-page-flip {
  width: 30px !important; }

.w-pageline.w-page-go .w-page-rectangle-alpha li a {
  color: #666;
  background: none;
  border-radius: 16px; }

.w-pageline.w-page-go .w-page-rectangle-alpha li input {
  width: 67px; }

.w-pageline.w-page-go .w-page-rectangle-alpha li a:hover {
  color: #666;
  background: #ccc; }

.w-pageline.w-page-go .w-page-rectangle-alpha li.active a {
  color: #666;
  background: #ccc; }

.w-clearfix:after {
  content: '';
  clear: both;
  height: 0;
  display: block;
  overflow: hidden; }

.w-pageline.w-page-more-box {
  margin: 20px 0;
  padding: 0;
  font-family: Arial,"Lucida Grande","Microsoft Yahei","Hiragino Sans GB","Hiragino Sans GB W3",SimSun,STHeiti; }

.w-pageline.w-page-more-box ul {
  list-style: none outside none;
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0; }

.w-pageline.w-page-more-box ul li {
  float: left;
  margin-right: 10px;
  height: 30px;
  line-height: 30px;
  text-align: center; }

.w-pageline.w-page-more-box ul li input {
  width: 10px;
  height: 30px;
  line-height: 30px;
  border: 1px solid #ddd;
  border-radius: 3px; }

.w-pageline.w-page-more-box ul li a {
  display: block;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear; }

.w-pageline.w-page-more-box ul li a:hover {
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear; }

.w-page-more {
  display: block;
  padding: 0 10px;
  font-size: 14px;
  height: 32px;
  line-height: 32px;
  color: #666;
  text-align: center;
  text-decoration: none; }

.w-page-more:hover {
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  transition: all 0.2s linear; }

.w-pageline.w-page-more-box a.disabled {
  display: none; }

.w-page-more-one {
  /*background*/
  background-color: #FFF;
  /*border*/
  border-color: #ddd;
  border-width: 1px;
  border-style: solid; }

.w-page-more-one:hover {
  background-color: #EEE;
  /*border*/
  border-color: #ddd;
  border-width: 1px;
  border-style: solid; }

.w-page-more-two {
  /*background*/
  background-color: #EEE;
  /*border*/
  border-color: #EEE;
  border-width: 1px;
  border-style: solid; }

.w-page-more-two:hover {
  background-color: #ddd;
  /*border*/
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-page-more-three {
  background-color: #fff;
  border-color: #EEE;
  border-width: 1px;
  border-style: solid;
  border-radius: 40px; }

.w-page-more-three:hover {
  background-color: #eee;
  border-color: #ddd;
  border-width: 1px;
  border-style: solid; }

.w-page-more-four {
  background-color: #eee;
  border-color: #ddd;
  border-width: 1px;
  border-style: solid; }

.w-page-more-four:hover {
  background-color: #ccc;
  border-color: #ccc;
  border-width: 1px;
  border-style: solid; }

.w-page-more-fives {
  background-color: transparent;
  border-color: transparent;
  border-width: 1px;
  border-style: solid; }

.w-page-more-fives:hover {
  background-color: #ddd; }

.w-page-more-six {
  color: #EA594F;
  background-color: #fff;
  border-color: #EA594F;
  border-width: 1px;
  border-style: solid;
  border-radius: 40px; }

.w-page-more-six:hover {
  color: #fff;
  background-color: #EA594F;
  border-color: #EA594F;
  border-width: 1px;
  border-style: solid; }

/*# sourceMappingURL=page.css.map */

/* hover-effect */

/* ----------------Direction Effect begin------------------------- */
.hover-effect[data-effect-name="direction-top"] img,
.hover-effect[data-effect-name="direction-right"] img,
.hover-effect[data-effect-name="direction-bottom"] img,
.hover-effect[data-effect-name="direction-left"] img,
.hover-effect[data-effect-name="direction-origin"] img {
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}
/* .layer common */
.hover-effect[data-effect-name="direction-top"] .layer,
.hover-effect[data-effect-name="direction-right"] .layer,
.hover-effect[data-effect-name="direction-bottom"] .layer,
.hover-effect[data-effect-name="direction-left"] .layer,
.hover-effect[data-effect-name="direction-origin"] .layer,
.hover-effect[data-effect-name="zoom-in"] .layer,
.hover-effect[data-effect-name="flash-full"] .layer,
.hover-effect[data-effect-name="flash-line"] .layer,
.hover-effect[data-effect-name="flash-disperse"] .layer,
.hover-effect[data-effect-name="xxx"] .layer {
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    align-items: center;
    -ms-flex-line-pack: center;
    -webkit-align-content: center;
    align-content: center;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    pointer-events: none
}

.hover-effect[data-effect-name="direction-top"] .layer {
    top: -100%;
    left: 0;
}

.hover-effect[data-effect-name="direction-right"] .layer {
    top: 0;
    right: -100%;
}

.hover-effect[data-effect-name="direction-bottom"] .layer {
    bottom: -100%;
    left: 0;
}

.hover-effect[data-effect-name="direction-left"] .layer {
    left: -100%;
    top: 0;
}

.hover-effect[data-effect-name="direction-origin"] .layer {
    bottom: 0;
    left: 0;
}

.hover-effect[data-effect-name="direction-top"]:hover img,
.hover-effect[data-effect-name="direction-right"]:hover img,
.hover-effect[data-effect-name="direction-bottom"]:hover img,
.hover-effect[data-effect-name="direction-left"]:hover img,
.hover-effect[data-effect-name="direction-origin"]:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2)
}

.hover-effect[data-effect-name="direction-top"]:hover .layer,
.hover-effect[data-effect-name="direction-right"]:hover .layer,
.hover-effect[data-effect-name="direction-bottom"]:hover .layer,
.hover-effect[data-effect-name="direction-left"]:hover .layer,
.hover-effect[data-effect-name="direction-origin"]:hover .layer {
    opacity: 1
}

.hover-effect[data-effect-name="direction-top"]:hover .layer {
    top: 0;
}

.hover-effect[data-effect-name="direction-right"]:hover .layer {
    right: 0;
}

.hover-effect[data-effect-name="direction-bottom"]:hover .layer {
    bottom: 0;
}

.hover-effect[data-effect-name="direction-left"]:hover .layer {
    left: 0;
}
/* ----------------Direction Effect end------------------------- */

/* ------Border Effect begin--------------- */
.hover-effect[data-effect-name="extend-border"] img,
.hover-effect[data-effect-name="full-border"] img {
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.hover-effect[data-effect-name="extend-border"] .layer,
.hover-effect[data-effect-name="full-border"] .layer {
    position: absolute;
    left: 0;
    top: 0;
    padding: 30px;
    width: 100%;
    height: 100%;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: -moz-box;
    display: flex;
    -ms-flex-align: center;
    -webkit-align-items: center;
    -moz-box-align: center;
    align-items: center;
    -ms-flex-line-pack: center;
    -webkit-align-content: center;
    align-content: center;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    pointer-events: none
}

.hover-effect[data-effect-name="extend-border"] .title,
.hover-effect[data-effect-name="full-border"] .title,
.hover-effect[data-effect-name="extend-border"] .desc,
.hover-effect[data-effect-name="full-border"] .desc {
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

.hover-effect[data-effect-name="extend-border"] .title,
.hover-effect[data-effect-name="full-border"] .title {
    padding-bottom: 42px
}

.hover-effect[data-effect-name="extend-border"] .title,
.hover-effect[data-effect-name="full-border"] .title,
.hover-effect[data-effect-name="extend-border"] .desc,
.hover-effect[data-effect-name="full-border"] .desc {
    opacity: 0
}

/* -------extend-border" 伪类begin---------- */
.hover-effect[data-effect-name="extend-border"]::before {
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: scale(0, 1);
    -moz-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    -o-transform: scale(0, 1);
    transform: scale(0, 1)
}

.hover-effect[data-effect-name="extend-border"]::after {
    border-left: 1px solid #fff;
    border-right: 1px solid #fff;
    -webkit-transform: scale(1, 0);
    -moz-transform: scale(1, 0);
    -ms-transform: scale(1, 0);
    -o-transform: scale(1, 0);
    transform: scale(1, 0)
}

.hover-effect[data-effect-name="extend-border"]::before,
.hover-effect[data-effect-name="extend-border"]::after {
    position: absolute;
    top: 30px;
    right: 30px;
    bottom: 30px;
    left: 30px;
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, -webkit-transform 0.35s;
    -o-transition: opacity 0.35s, -o-transform 0.35s;
    -moz-transition: opacity 0.35s, transform 0.35s, -moz-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s, -moz-transform 0.35s, -o-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s;
    z-index: 2
}
/* -------extend-border" 伪类end---------- */

/* -------full-border" 伪类begin---------- */
.hover-effect[data-effect-name="full-border"]::before {
    position: absolute;
    top: 30px;
    right: 30px;
    bottom: 30px;
    left: 30px;
    content: '';
    opacity: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    border: 1px solid #fff;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, -webkit-transform 0.35s;
    -o-transition: opacity 0.35s, -o-transform 0.35s;
    -moz-transition: opacity 0.35s, transform 0.35s, -moz-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s, -moz-transform 0.35s, -o-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s, -webkit-transform 0.35s;
    z-index: 2
}
/* -------full-border" 伪类end---------- */
.hover-effect[data-effect-name="extend-border"]:hover::before,
.hover-effect[data-effect-name="extend-border"]:hover::after,
.hover-effect[data-effect-name="full-border"]:hover::before,
.hover-effect[data-effect-name="full-border"]:hover::after {
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1)
}

.hover-effect[data-effect-name="extend-border"]:hover img,
.hover-effect[data-effect-name="full-border"]:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2)
}



.hover-effect[data-effect-name="extend-border"]:hover .title,
.hover-effect[data-effect-name="full-border"]:hover .title {
    -webkit-transform: translateY(16px);
    -moz-transform: translateY(16px);
    -ms-transform: translateY(16px);
    -o-transform: translateY(16px);
    transform: translateY(16px);
    opacity: 1
}

.hover-effect[data-effect-name="extend-border"]:hover .desc,
.hover-effect[data-effect-name="full-border"]:hover .desc {
    -webkit-transform: translateY(-16px);
    -moz-transform: translateY(-16px);
    -ms-transform: translateY(-16px);
    -o-transform: translateY(-16px);
    transform: translateY(-16px);
    opacity: 1
}
/* ------------Border Effect end-------------------- */



/* --------------Zoom Effect begin----------------------- */
.hover-effect[data-effect-name="zoom-in"] img {
    -webkit-transition: -webkit-transform .3s ease-in-out;
    transition: -webkit-transform .3s ease-in-out;
    -o-transition: -o-transform .3s ease-in-out;
    -moz-transition: transform .3s ease-in-out, -moz-transform .3s ease-in-out;
    transition: transform .3s ease-in-out;
    transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out, -moz-transform .3s ease-in-out, -o-transform .3s ease-in-out;
    transition: transform .3s ease-in-out
}

.hover-effect[data-effect-name="zoom-in"]:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2)
}
/* --------------Zoom Effect end--------------------- */



.hover-effect[data-effect-name="zoom-in"] .layer,
.hover-effect[data-effect-name="flash-full"] .layer,
.hover-effect[data-effect-name="flash-line"] .layer,
.hover-effect[data-effect-name="flash-disperse"] .layer,
.hover-effect[data-effect-name="xxx"] .layer {
    top: 0;
    opacity: 0;
    background: transparent;
}

.hover-effect[data-effect-name="zoom-in"]:hover .layer,
.hover-effect[data-effect-name="flash-full"]:hover .layer,
.hover-effect[data-effect-name="flash-line"]:hover .layer,
.hover-effect[data-effect-name="flash-disperse"]:hover .layer {
    background: transparent !important;
    opacity: 1;
}
.hover-effect[data-effect-name="xxx"]:hover .layer {
    opacity: 1;
}
/* --------------Flash Effect begin--------------------- */
.hover-effect[data-effect-name="flash-full"]:hover img {
    opacity: 1;
    -webkit-animation: flash 1.5s;
    -moz-animation: full 1.5s;
    -o-animation: full 1.5s;
    animation: full 1.5s
}

.hover-effect[data-effect-name="flash-line"]::before,
.hover-effect[data-effect-name="flash-shadow"]::before {
    position: absolute;
    top: 0;
    left: -100%;
    z-index: 2;
    display: block;
    content: '';
    width: 50%;
    height: 100%;
    background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
    background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
    background: -moz-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
    background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
    background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
    -webkit-transform: skewX(-25deg);
    -moz-transform: skewX(-25deg);
    -ms-transform: skewX(-25deg);
    -o-transform: skewX(-25deg);
    transform: skewX(-25deg)
}

.hover-effect[data-effect-name="flash-line"]:hover::before,
.hover-effect[data-effect-name="flash-shadow"]:hover::before {
    -webkit-animation: line .75s;
    -moz-animation: line .75s;
    -o-animation: line .75s;
    animation: line .75s
}

.hover-effect[data-effect-name="flash-disperse"]::before {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    display: block;
    content: '';
    width: 0;
    height: 0;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 100%;
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    opacity: 0
}

.hover-effect[data-effect-name="flash-disperse"]:hover::before {
    -webkit-animation: disperse .75s;
    -moz-animation: disperse .75s;
    -o-animation: disperse .75s;
    animation: disperse .75s
}

@-webkit-keyframes full {
    0% {
        opacity: .4
    }

    100% {
        opacity: 1
    }
}

@-moz-keyframes full {
    0% {
        opacity: .4
    }

    100% {
        opacity: 1
    }
}

@-o-keyframes full {
    0% {
        opacity: .4
    }

    100% {
        opacity: 1
    }
}

@keyframes full {
    0% {
        opacity: .4
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes line {
    100% {
        left: 125%
    }
}

@-moz-keyframes line {
    100% {
        left: 125%
    }
}

@-o-keyframes line {
    100% {
        left: 125%
    }
}

@keyframes line {
    100% {
        left: 125%
    }
}

@-webkit-keyframes disperse {
    0% {
        opacity: 1
    }

    40% {
        opacity: 1
    }

    100% {
        width: 200%;
        height: 200%;
        opacity: 0
    }
}

@-moz-keyframes disperse {
    0% {
        opacity: 1
    }

    40% {
        opacity: 1
    }

    100% {
        width: 200%;
        height: 200%;
        opacity: 0
    }
}

@-o-keyframes disperse {
    0% {
        opacity: 1
    }

    40% {
        opacity: 1
    }

    100% {
        width: 200%;
        height: 200%;
        opacity: 0
    }
}

@keyframes disperse {
    0% {
        opacity: 1
    }

    40% {
        opacity: 1
    }

    100% {
        width: 200%;
        height: 200%;
        opacity: 0
    }
}


/* --------------Flash Effect end--------------------- */



/* -------------------- Button Effect  bengin -------------------------- */
.hover-effect[data-effect-name="grow"],
.hover-effect[data-effect-name="shrink"],
.hover-effect[data-effect-name="sink"],
.hover-effect[data-effect-name="forward"],
.hover-effect[data-effect-name="backward"] {
    -webkit-transition: all 300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}

    .hover-effect[data-effect-name="grow"]:hover {
        -webkit-transform: scale(1.1);
        -moz-transform: scale(1.1);
        -ms-transform: scale(1.1);
        -o-transform: scale(1.1);
        transform: scale(1.1);
    }

    .hover-effect[data-effect-name="shrink"]:hover {
        -webkit-transform: scale(0.9);
        -moz-transform: scale(0.9);
        -ms-transform: scale(0.9);
        -o-transform: scale(0.9);
        transform: scale(0.9);
    }

.hover-effect[data-effect-name="float"]:hover {
    -webkit-transform: translateY(-8px);
    -moz-transform: translateY(-8px);
    -ms-transform: translateY(-8px);
    -o-transform: translateY(-8px);
    transform: translateY(-8px)
}

.hover-effect[data-effect-name="sink"]:hover {
    -webkit-transform: translateY(8px);
    -moz-transform: translateY(8px);
    -ms-transform: translateY(8px);
    -o-transform: translateY(8px);
    transform: translateY(8px);
}

.hover-effect[data-effect-name="forward"]:hover {
    -webkit-transform: translateX(8px);
    -moz-transform: translateX(8px);
    -ms-transform: translateX(8px);
    -o-transform: translateX(8px);
    transform: translateX(8px);
}

.hover-effect[data-effect-name="backward"]:hover {
    -webkit-transform: translateX(-8px);
    -moz-transform: translateX(-8px);
    -ms-transform: translateX(-8px);
    -o-transform: translateX(-8px);
    transform: translateX(-8px);
}

.hover-effect[data-effect-name="sweep-to-right"]:hover {
    -webkit-transform: perspective(1px) translateZ(0);
    -moz-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    position: relative;
}

    .hover-effect[data-effect-name="sweep-to-right"]:hover:before {
        -webkit-transform: scaleX(1);
        -moz-transform: scaleX(1);
        -ms-transform: scaleX(1);
        -o-transform: scaleX(1);
        transform: scaleX(1);
    }

.hover-effect[data-effect-name="sweep-to-right"]:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 0 50%;
    -moz-transform-origin: 0 50%;
    -ms-transform-origin: 0 50%;
    -o-transform-origin: 0 50%;
    transform-origin: 0 50%;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.hover-effect[data-effect-name="rectangle-out"]:hover {
    -webkit-transform: perspective(1px) translateZ(0);
    -moz-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    position: relative;
}

.hover-effect[data-effect-name="rectangle-out"]:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.hover-effect[data-effect-name="rectangle-out"]:hover:before {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.hover-effect[data-effect-name="shutter-out-horizontal"]:hover {
    -webkit-transform: perspective(1px) translateZ(0);
    -moz-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    position: relative;
    -webkit-transition-property: color;
    -o-transition-property: color;
    -moz-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.hover-effect[data-effect-name="shutter-out-horizontal"]:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-transform: scaleX(0);
    -moz-transform: scaleX(0);
    -ms-transform: scaleX(0);
    -o-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transform-origin: 50%;
    -moz-transform-origin: 50%;
    -ms-transform-origin: 50%;
    -o-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.hover-effect[data-effect-name="shutter-out-horizontal"]:hover:before {
    -webkit-transform: scaleX(1);
    -moz-transform: scaleX(1);
    -ms-transform: scaleX(1);
    -o-transform: scaleX(1);
    transform: scaleX(1);
}

.hover-effect[data-effect-name="shutter-out-vertical"]:hover {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    -moz-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    position: relative;
    background: #e1e1e1;
    -webkit-transition-property: color;
    -o-transition-property: color;
    -moz-transition-property: color;
    transition-property: color;
    -webkit-transition-duration: 0.3s;
    -moz-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
}

.hover-effect[data-effect-name="shutter-out-vertical"]:before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    -webkit-transform: scaleY(0);
    -moz-transform: scaleY(0);
    -ms-transform: scaleY(0);
    -o-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-transform-origin: 50%;
    -moz-transform-origin: 50%;
    -ms-transform-origin: 50%;
    -o-transform-origin: 50%;
    transform-origin: 50%;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.hover-effect[data-effect-name="shutter-out-vertical"]:hover:before {
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);
}

.hover-effect[data-effect-name="underline-from-center"]:hover {
    -webkit-transform: perspective(1px) translateZ(0);
    -moz-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    position: relative;
    overflow: hidden;
}

.hover-effect[data-effect-name="underline-from-center"]:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 51%;
    right: 51%;
    bottom: 0;
    height: 2px;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.hover-effect[data-effect-name="underline-from-center"]:hover:before {
    left: 0;
    right: 0;
}

.hover-effect[data-effect-name="overline-from-center"]:hover {
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: perspective(1px) translateZ(0);
    -moz-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    box-shadow: 0 0 1px rgba(0, 0, 0, 0);
    position: relative;
    overflow: hidden;
}

.hover-effect[data-effect-name="overline-from-center"]:before {
    content: "";
    position: absolute;
    z-index: -1;
    left: 51%;
    right: 51%;
    top: 0;
    height: 2px;
    -webkit-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}

.hover-effect[data-effect-name="overline-from-center"]:hover:before {
    left: 0;
    right: 0;
}

/* -------------------- Button  bengin -------------------------- */



/* -------------------------list begin--------------------------------------- */
.hover-effect[data-effect-name="mirror-opacity"] img,
.hover-effect[data-effect-name="opacity-border"],
.hover-effect[data-effect-name="float-border"],
.hover-effect[data-effect-name="float"],
.hover-effect[data-effect-name="float-shadow"],
.hover-effect[data-effect-name="shadow"],
.hover-effect[data-effect-name="border"],
.hover-effect[data-effect-name='puff'] {
    -webkit-transition: all 300ms ease-in-out;
    -o-transition: all 300ms ease-in-out;
    -moz-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
}

.hover-effect[data-effect-name="mirror-opacity"]:hover img {
    opacity: 0.7;
}

.hover-effect[data-effect-name="shadow"]:hover {
    box-shadow: 0 5px 12px rgba(0,0,0,.1);
}

.hover-effect[data-effect-name="float-shadow"]:hover {
    -webkit-transform: translateY(-8px);
    -moz-transform: translateY(-8px);
    -ms-transform: translateY(-8px);
    -o-transform: translateY(-8px);
    transform: translateY(-8px);
    box-shadow: 0 5px 12px rgba(0,0,0,.1);
}

.hover-effect[data-effect-name="flash-shadow"]:hover {
    box-shadow: 0 5px 12px rgba(0,0,0,.1);
}

.hover-effect[data-effect-name="flash-shadow"] {
    position: relative;
}

.hover-effect[data-effect-name="opacity-border"]:hover {
    opacity: 0.7;
}

.hover-effect[data-effect-name="float-border"]:hover {
    -webkit-transform: translateY(-8px);
    -moz-transform: translateY(-8px);
    -ms-transform: translateY(-8px);
    -o-transform: translateY(-8px);
    transform: translateY(-8px);
}

.hover-effect[data-effect-name='puff']:hover {
    -webkit-transform: scale(1.05) translate3d(0, 0, 8px);
    -moz-transform: scale(1.05) translate3d(0, 0, 8px);
    transform: scale(1.05) translate3d(0, 0, 8px);
}

.hover-effect[data-effect-name='flash-line'] {
    position: relative;
}
/* -------------------------List Effect end--------------------------------------- */



.hover-effect[data-effect-name='direction-top'] > .smAreaC:last-of-type {
    opacity: 0;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    pointer-events: none;
}

.hover-effect[data-effect-name='direction-top']:hover > .smAreaC:last-of-type {
    opacity: 1;
    z-index: 2;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    pointer-events: auto;
}

.hover-effect[data-effect-name='direction-right'] > .smAreaC:last-of-type {
    opacity: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    pointer-events: none;
}

.hover-effect[data-effect-name='direction-right']:hover > .smAreaC:last-of-type {
    opacity: 1;
    z-index: 9999;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    pointer-events: auto;
}

.hover-effect[data-effect-name='direction-bottom'] > .smAreaC:last-of-type {
    opacity: 0;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    pointer-events: none;
}

.hover-effect[data-effect-name='direction-bottom']:hover > .smAreaC:last-of-type {
    opacity: 1;
    z-index: 9999;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    pointer-events: auto;
}


.hover-effect[data-effect-name='direction-left'] > .smAreaC:last-of-type {
    opacity: 0;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    pointer-events: none;
}

.hover-effect[data-effect-name='direction-left']:hover > .smAreaC:last-of-type {
    opacity: 1;
    z-index: 9999;
    -webkit-transform: translateX(0);
    transform: translateX(0);
    pointer-events: auto;
}

.hover-effect[data-effect-name='fade-in'] > .smAreaC:last-of-type {
    opacity: 0
}

.hover-effect[data-effect-name='fade-in']:hover > .smAreaC:last-of-type {
    opacity: 1;
    z-index: 9999;
    -webkit-animation: fadeIn 1s ease-in-out;
    animation: fadeIn 1s ease-in-out
}

.hover-effect[data-effect-name='fade-out'] > .smAreaC:first-of-type {
    z-index: 2;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out
}

.hover-effect[data-effect-name='fade-out']:hover > .smAreaC:first-of-type {
    -webkit-transform: scale(2);
    transform: scale(2);
    opacity: 0;
    z-index: -1;
}

.hover-effect[data-effect-name='fade-out']:hover > .smAreaC:last-of-type {
    z-index: 9999;
    opacity: 1;
}

.hover-effect[data-effect-name='filp-top'] > .smAreaC:last-of-type {
    opacity: 0;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: perspective(900px) rotateX(180deg);
    transform: perspective(900px) rotateX(180deg);
    pointer-events: none;
}

.hover-effect[data-effect-name='filp-top']:hover > .smAreaC:last-of-type {
    opacity: 1;
    z-index: 9999;
    -webkit-transform: perspective(900px) rotateX(0);
    transform: perspective(900px) rotateX(0);
    -webkit-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    pointer-events: auto;
}

.hover-effect[data-effect-name='filp-right'] > .smAreaC:last-of-type {
    opacity: 0;
    -webkit-transform-origin: 100% 50%;
    transform-origin: 100% 50%;
    -webkit-transform: perspective(900px) rotateY(180deg);

    transform: perspective(900px) rotateY(180deg);
    pointer-events: none;
}

.hover-effect[data-effect-name='filp-right']:hover > .smAreaC:last-of-type {
    opacity: 1;
    z-index: 9999;
    -webkit-transform: perspective(900px) rotateY(0);
    transform: perspective(900px) rotateY(0);
    -webkit-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    pointer-events: auto;
}

.hover-effect[data-effect-name='filp-bottom'] > .smAreaC:last-of-type {
    opacity: 0;
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
    -webkit-transform: perspective(900px) rotateX(-180deg);
    transform: perspective(900px) rotateX(-180deg);
    pointer-events: none;
}

.hover-effect[data-effect-name='filp-bottom']:hover > .smAreaC:last-of-type {
    opacity: 1;
    z-index: 9999;
    -webkit-transform: perspective(900px) rotateX(0);
    transform: perspective(900px) rotateX(0);
    -webkit-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    pointer-events: auto;
}

.hover-effect[data-effect-name='filp-left'] > .smAreaC:last-of-type {
    opacity: 0;
    -webkit-transform-origin: 0 50%;
    transform-origin: 0 50%;
    -webkit-transform: perspective(900px) rotateY(-180deg);
    transform: perspective(900px) rotateY(-180deg);
    pointer-events: none;
}

.hover-effect[data-effect-name='filp-left']:hover > .smAreaC:last-of-type {
    opacity: 1;
    z-index: 9999;
    -webkit-transform: perspective(900px) rotateY(0);
    transform: perspective(900px) rotateY(0);
    -webkit-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
    pointer-events: auto;
}

.hover-effect[data-effect-name='filp-origin'] > .smAreaC:first-of-type {
    z-index: 3;
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-transition: -webkit-transform 0.5s ease-in-out;
    transition: -webkit-transform 0.5s ease-in-out;
    transition: transform 0.5s ease-in-out;
    transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out
}

.hover-effect[data-effect-name='filp-origin']:hover > .smAreaC:first-of-type {
    opacity: 0;
    -webkit-animation: ladderin 0.5s ease-in-out;
    animation: ladderin 0.5s ease-in-out
}

.hover-effect[data-effect-name='filp-origin']:hover > .smAreaC:last-of-type {
    z-index: 9999;
    opacity: 1;
}

.hover-effect[data-effect-name='slash-fly-out'] > .smAreaC:first-of-type {
    z-index: 3;
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    -webkit-transition: -webkit-transform 0.5s ease-in-out;
    transition: -webkit-transform 0.5s ease-in-out;
    transition: transform 0.5s ease-in-out;
    transition: transform 0.5s ease-in-out, -webkit-transform 0.5s ease-in-out
}

.hover-effect[data-effect-name='slash-fly-out']:hover > .smAreaC:last-of-type {
    z-index: 9999;
    opacity: 1;
}

.hover-effect[data-effect-name='slash-fly-out']:hover > .smAreaC:first-of-type {
    -webkit-animation: bombout 1s both;
    animation: bombout 1s both;
    pointer-events: none;
}

@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
        z-index: -1
    }

    40% {
        opacity: 1;
        z-index: 2;
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }

    100% {
        opacity: 1;
        z-index: 2;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@keyframes fadeIn {
    0% {
        opacity: 0;
        z-index: -1
    }

    40% {
        opacity: 1;
        z-index: 2;
        -webkit-transform: scale(1.2);
        transform: scale(1.2)
    }

    100% {
        opacity: 1;
        z-index: 2;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
}

@-webkit-keyframes ladderin {
    0% {
        opacity: 1;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: perspective(800px) rotate(0) translateZ(0);
        transform: perspective(800px) rotate(0) translateZ(0)
    }

    100% {
        opacity: 0;
        -webkit-transform-origin: 50% 0;
        transform-origin: 50% 0;
        -webkit-transform: perspective(800px) rotateY(180deg) translateZ(300px);
        transform: perspective(800px) rotateY(180deg) translateZ(300px)
    }
}

@keyframes ladderin {
    0% {
        opacity: 1;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
        -webkit-transform: perspective(800px) rotate(0) translateZ(0);
        transform: perspective(800px) rotate(0) translateZ(0)
    }

    100% {
        opacity: 0;
        -webkit-transform-origin: 50% 0;
        transform-origin: 50% 0;
        -webkit-transform: perspective(800px) rotateY(180deg) translateZ(300px);
        transform: perspective(800px) rotateY(180deg) translateZ(300px)
    }
}

@-webkit-keyframes bombout {
    0% {
        opacity: 1;
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    50% {
        opacity: 1;
        -webkit-transform-origin: 200% 50%;
        transform-origin: 200% 50%;
        -webkit-transform: rotate(160deg);
        transform: rotate(160deg)
    }

    100% {
        opacity: 0;
        -webkit-transform-origin: 200% 50%;
        transform-origin: 200% 50%;
        -webkit-transform: rotate(160deg);
        transform: rotate(160deg)
    }
}

@keyframes bombout {
    0% {
        opacity: 1;
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%;
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    50% {
        opacity: 1;
        -webkit-transform-origin: 200% 50%;
        transform-origin: 200% 50%;
        -webkit-transform: rotate(160deg);
        transform: rotate(160deg)
    }

    100% {
        opacity: 0;
        -webkit-transform-origin: 200% 50%;
        transform-origin: 200% 50%;
        -webkit-transform: rotate(160deg);
        transform: rotate(160deg)
    }
}


/* -------------------- Text  bengin -------------------------- */

.hover-effect[data-effect-name="text-shadow"] p > span:hover {
    text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25);
}

.hover-effect[data-effect-name="text-bottom-shadow"] p > span {
    position: relative;
}

.hover-effect[data-effect-name="text-bottom-shadow"] p > span:before {
        position: absolute;
        top: 100%;
        left: 5%;
        display: block;
        content: '';
        width: 90%;
        height: 10px;
        z-index: -1;
        opacity: 0;
        background: radial-gradient( ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80% );
        transition: all 0.3s linear;
    }

.hover-effect[data-effect-name="text-bottom-shadow"] p > span:hover {
        transform: translateY(-5px);
    }

 .hover-effect[data-effect-name="text-bottom-shadow"] p > span:hover:before {
            opacity: 1;
            transform: translateY(5px);
        }

.hover-effect[data-effect-name="text-3d-shadow"] p > span:hover {
    color: rgb(40, 80, 120);
    text-shadow: 0 0 1px currentColor, 2px 0 1px #083058, 0 2px 1px #98c0e8, 2px 1px 1px #083058, 1px 2px 1px #98c0e8, 2px 2px 1px #487098, 3px 1px 1px #083058, 1px 3px 1px #98c0e8, 3px 2px 1px #083058, 2px 3px 1px #98c0e8, 3px 3px 1px #487098, 4px 2px 1px #083058, 2px 4px 1px #98c0e8, 4px 3px 1px #083058, 3px 4px 1px #98c0e8, 4px 4px 1px #487098, 5px 3px 1px #083058, 3px 5px 1px #98c0e8, 5px 4px 1px #083058, 4px 5px 1px #98c0e8, 5px 5px 1px #487098;
}

 .hover-effect[data-effect-name="text-3d-shadow"] p > span:hover:before {
        color: rgb(40, 80, 120);
        text-shadow: 0 0 1px currentColor, -1px -1px 1px #003, 0 -1px 1px #003, 1px -1px 1px #003, 1px 0 1px #003, 1px 1px 1px #003, 0 1px 1px #003, -1px 1px 1px #003, -1px 0 1px #003;
    }

 .hover-effect[data-effect-name="text-3d-shadow"] p > span:hover:after {
        color: rgba(40, 80, 120, 0.1);
        text-shadow: 1px -1px 1px rgba(40, 80, 120, 0.8), -1px 1px 1px rgba(255, 255, 255, 0.8);
    }

.hover-effect[data-effect-name="text-bold-shadow"] p > span:hover {
    font-weight: bold;
    color: orange;
    text-shadow: 0 0 1px currentColor, -1px -1px 1px #030, 0 -1px 1px #030, 1px -1px 1px #030, 1px 0 1px #030, 1px 1px 1px #030, 0 1px 1px #030, -1px 1px 1px #030, -1px 0 1px #030;
}

/* -------------------- Text  end -------------------------- */

.hover-effect .smAreaC .yibuFrameContent:not(.image_Style6) img {
    transform: none !important;
}

/* hover-effect */
.antChainBackgroundWrap {
    width: 100%;
    height:80px;
    background-color: #4c70ff;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-justify-content: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: relative;
}

.antChainBackgroundWrap .antChainBackground {
  width: 1920px;
  height: 80px;
  position: relative;
}

.antChainBackgroundWrap .antChainBackground .antChainBackgroundImg {
  width: 1920px;
  height: 80px;
}

.antChainBackgroundWrap .antChainBackground .antChainBtn {
  font-size: 24px;
  color: #ffffff;
  font-weight: bold;
  text-decoration: underline;
  position: absolute;
  left: 1105px;
  top: 27px;
  z-index: 2;
  cursor: pointer;
}

.antChainBackgroundWrap .antChainBackground .qrCodeWrap {
  position: absolute;
  top: -176px;
  left: 1105px;
  width: 220px;
  height: 256px;
  opacity: 0;
  z-index: -1;
  -webkit-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  transition: all 0.2s linear;
}

.antChainBackgroundWrap .antChainBackground .qrCodeWrap .qrCodeWrapImg {
  width: 220px;
  height: 256px;
}

.antChainBackgroundWrap .antChainBackground .qrCodeWrap .qrCodeImg {
  position: absolute;
  top: 25px;
  left: 25px;
  width: 170px;
  height: 170px;
}

.antChainBackgroundWrap .antChainBackground .qrCodeShow {
  top: 80px;
  opacity: 1;
  z-index: 999;
}

.antChainBackgroundWrap .antChainClose {
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
  opacity: 0.6;
}

.antChainBackgroundWrap .antChainClose:hover {
    opacity: 1;
}

.antChainBackgroundWrap .antChainClose .antChainCloseImg {
  width: 26px;
  height: 26px;
}

.translate {
    -webkit-transform: translate(0px, 0px);
    -moz-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    -o-transform: translate(0px, 0px);
    transform: translate(0px, 0px);
}