@charset "UTF-8";

.padd{ padding: 0 30px !important;}

.horizontal { margin: 15px 0 0 0; }

.horizontal:before, .horizontal:after { content: " "; display: table; }

.horizontal:after { clear: both; }

.horizontal .img { position: relative; }

.horizontal .img img { display: block; width:100%;}

.horizontal .img:after { position: absolute; background: rgba(0, 0, 0, 0.5); left: 0; top: 0; right: 0; bottom: 0; opacity: 0; transition: linear all .3s; content: ""; }

.horizontal .img:before { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; display: block; content: ''; opacity: 0; position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2; margin: auto; width: 30px; height: 30px; color: #fff; font-size: 24px; text-align: center; background-image: url(../images/icon.png); background-size: cover; }

.horizontal .content { padding: 0; margin: 0; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; }

.horizontal .content dt { margin: 0; padding: 10px 0; }

.horizontal .content dt a { padding-left: 0; height: 4.5em; display: block; color: #333; font-size: 18px; font-weight: normal; line-height: 1.5em; overflow: hidden; }

.horizontal .content dd { padding-bottom: 10px; }

.horizontal .content dd p { margin: 0; height: 3.6em; overflow: hidden; }

.horizontal:hover { background: #f2f6f8;  }

.horizontal:hover .img { overflow: hidden; }

.horizontal:hover .img:before { -webkit-animation: 0.3s animationZoomIn; -o-animation: 0.3s animationZoomIn; animation: 0.3s animationZoomIn; transform: rotate(0); opacity: 1; }

.horizontal:hover .img:after { opacity: 1; }

.horizontal:hover .img img { -webkit-transition:all 0.3s cubic-bezier(0.76, 0.18, 0.19, 1.35); -moz-transition: all 0.3s cubic-bezier(0.76, 0.18, 0.19, 1.35); -ms-transition: all 0.3s cubic-bezier(0.76, 0.18, 0.19, 1.35); -o-transition: all 0.3s cubic-bezier(0.76, 0.18, 0.19, 1.35); transition: all 0.3s cubic-bezier(0.76, 0.18, 0.19, 1.35); transform: scale(1.1); }

.horizontal:hover .content { padding: 0 10px; }


.position{position:absolute;left:0;right:0;bottom:0;top:0;z-index:9;}

@media (max-width: 767px) { .horizontal { border-bottom: 1px solid #f2f2f2; margin: 0; padding-bottom: 15px; }
  .horizontal:hover { color: #333; background: #fff; }
  .horizontal .img { float: left; width: 30%; }
  .horizontal .content { width: 70%; float: left; padding-left: 15px; box-sizing: border-box; }
  .horizontal .content dt { padding: 0; }
  .horizontal .content dt a { font-size: 16px; font-weight: normal; }
  .horizontal .content dt a:hover { color: #333; }
  .horizontal:hover .content dt a{color:#333;}
}
/* 
.pagination { height: 40px; float: right; }

.pagination .page-left { background: url(../images/btn-left.png); width: 40px; height: 40px; float: left; margin-right: 20px; }

.pagination .page-right { float: left; background: url(../images/btn-right.png); width: 40px; height: 40px; }

.mt30 { margin-top: 30px; }



.mb25 { margin-bottom: 25px; } */

@-moz-keyframes animationZoomIn { from { -webkit-transform: scale(0.7) translateY(-100%);
    -moz-transform: scale(0.7) translateY(-100%);
    -ms-transform: scale(0.7) translateY(-100%);
    -o-transform: scale(0.7) translateY(-100%);
    transform: scale(0.7) translateY(-100%); }
  to { -webkit-transform: scale(1) translateY(none);
    -moz-transform: scale(1) translateY(none);
    -ms-transform: scale(1) translateY(none);
    -o-transform: scale(1) translateY(none);
    transform: scale(1) translateY(none); } }

@keyframes animationZoomIn { from { -webkit-transform: scale(0.7) translateY(-100%);
    -moz-transform: scale(0.7) translateY(-100%);
    -ms-transform: scale(0.7) translateY(-100%);
    -o-transform: scale(0.7) translateY(-100%);
    transform: scale(0.7) translateY(-100%); }
  to { -webkit-transform: scale(1) translateY(none);
    -moz-transform: scale(1) translateY(none);
    -ms-transform: scale(1) translateY(none);
    -o-transform: scale(1) translateY(none);
    transform: scale(1) translateY(none); } }

.vertical { padding: 10px; border: 1px solid #acacac; margin: 10px; }

.vertical .img { transition: linear all .15s; display: block; overflow: hidden; position: relative; border: 1px solid #e8e8e8; }

.vertical .img img { display: block; transition: ease-out .15s all; filter: blur(0); }

.vertical .img span { position: absolute; left: 0; right: 0; bottom: 0; top: 0%; opacity: 0; transition: ease-in-out .15s all; overflow: hidden; }

.vertical .img span i { position: absolute; left: 0; right: 0; bottom: 0; font-size: 12px; margin: 60px 15px; font-style: normal; }

.vertical .img span strong { position: absolute; left: 0; top: 0; right: 0; padding: 1em; margin-top: 4em; transition: ease-in-out .15s transform; transform: scale(1.3); font-size: 16px; line-height: 1.5em; }

.vertical .img:after { display: none; background-color: #000; opacity: 0.1; filter: alpha(opacity=10); position: absolute; left: 0; bottom: 0; right: 0; top: 0; }

.vertical .title { display: block; font-size: 18px; line-height: 1.4em; box-sizing: border-box; padding: 1em 5px; }

.vertical:hover { box-shadow: 0 0   20px #ddd; }

.vertical:hover .title { color: #114455; }

.vertical:hover .img { border-color: #888; }

.vertical:hover .img a { color: #000; }

.vertical:hover .img span { opacity: 1; display: block; }

.vertical:hover .img span i { color: #888; }

.vertical:hover .img span strong { color: #000; transform: scale(1); }

.vertical:hover .img:after { display: block; }

.vertical:hover .img:after { width: 100%; }

.vertical:hover .img img { filter: progid:DXImageTransform.Microsoft.Blur(pixelRadius=7,   MakeShadow=false); filter: blur(12px); transform-origin: center; }

#loadNextPageBtn { padding: 50px 0; border-top: 1px solid #ddd; background: #f2f2f2; color: #555; text-align: center; text-align: center; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); }
#loadNextPageBtn span { width: 15rem; font-size: 1.2rem; }
#loadNextPageBtn small { margin: 0; color: #999; }
#displaypagenum { display: table; margin: 0 auto; margin-top: 30px;font-size:16px;clear:both;    border-collapse: collapse; }
#displaypagenum .page, #displaypagenum .next { text-align: center; width: 3em; line-height: 3em; color: #555; padding: 10px 15px; }
#displaypagenum .page:hover, #displaypagenum .next:hover { color: #145; background-color: #ddd; cursor: pointer; border-color: #ddd; }
#displaypagenum a, #displaypagenum .next, #displaypagenum .page{ padding: 8px 15px;}
#displaypagenum span.page { color: #fff; background: #1b4e72; border-color: #1b4e72; }

#displaypagenum .nextbtn { background: url(../images/page-right.png) no-repeat 50% 50%; }

#displaypagenum .prevbtn { background: url(../images/page-left.png) no-repeat 50% 50%; }

.cate-name {
    margin: 0;
    position: relative;
    font-size: 24px;
    font-weight: bolder;
    line-height: 1em;
}

@media (max-width: 1199px) and (min-width: 961px){.nav-main .nav-bar li a {padding: 0 12px\9;margin: 0;}}
@media(max-width:960px){ .pageNum{ display: table;}}
@media(max-width:767px){#displaypagenum {display:none}.padd {padding:0 15px !important;}}