/*------------ banner ------------*/



.banner:before {

    background: url(../../../../images/common/color_black/banner_bg.png) center bottom;

}



/*------------ site-header ------------*/



.site-header {

    border-bottom: 1px solid #e8e8e8;

    /*outline: 1px solid #fff;*/

}



.site-title .logo {

    background: url(../../../../images/common/color_black/logo.png) 50% 50% no-repeat;

    background-size:contain;

    width: 250px;

    height: 67px;

}



/*------------ top-nav ------------*/



.top-nav {

    background: #333;

}



.site-info {

    color: #fff;

}

.footer-mid .site-info-txt {

    border-bottom:2px groove #737373;

}

.footer-mid .site-info-txt li{

    color: #fff;

}

/*------------ menu ------------*/



.site-nav .menu {

    margin: 35px 0;

}



.site-nav .menu li a {

    color: #333;

    border-bottom: 3px solid transparent;

}



.site-nav .menu li ul {

    background: #FFFFFF;

    box-shadow: 0 0 4px rgba(0, 0, 0, .2);

    border: 1px solid #CCCCCC;

}



.site-nav .menu>li>a:after {

    border-bottom: 3px solid #e74549;

}



.site-nav .menu li ul li + li {

    border-top: 1px solid #CCCCCC;

}



.site-nav .menu ul li a {

    border: 0;

    color: #666666;

}



.site-nav .menu ul > li > a:hover {

    color: #E7464A;

    border-left: 3px solid #E7464A;

}





/*------------ btn ------------*/



.btn.back {

    width: 100px;

    height: 30px;

    line-height: 28px;

    text-align: right;

    color: #999999;

    font-size: 13px;

    padding: 0 12px;

    border: 1px solid #E8E8E8;

    transition: all .2s;

    background: #fff;

}



.btn.back i,.btn.back:before {

    font-size: 20px;

    color: #BBBBBB;

    float: left;

    margin: 4px 0;

    content: "\f104";

    font-family: 'icon-font' !important;

    speak: none;

    font-style: normal;

    font-weight: normal;

    font-variant: normal;

    text-transform: none;

    line-height: 1;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

}



.btn.back:hover {

    transition: all .2s;

    background: #e7464a;

    color: #ffffff;

}



.btn.back:hover i {

    color: #fff;

}





/*--- back-btn ---*/





/*--- style01-btn ---*/



.btn.style01 {

    font-size: 15px;

    color: #FFFFFF;

    background: #333;

    padding: 0 10px;

    line-height: 32px;

    display: block;

    width: 100%;

    text-align: right;

    border: 1px solid #E8E8E8;

    transition: all .2s;

}



.btn.style01 i {

    float: left;

    font-size: 20px;

    margin: 5px 0;

}



.btn.style01:hover {

    background: #e7464a;

}





/*--- style02-btn ---*/



.btn.style02 {

    font-size: 13px;

    color: #999999;

    width: 100px;

    line-height: 28px;

    text-align: right;

    padding: 0 10px;

    border: 1px solid #E8E8E8;

    box-sizing: border-box;

    transition: all .2s;

}



.btn.style02 i ,.btn.style02:before{

    font-size: 16px;

    color: #CCCCCC;

    float: left;

    margin: 6px 0;

    display: inline-block;

    font-family: 'icon-font' !important;

    speak: none;

    font-style: normal;

    font-weight: normal;

    font-variant: normal;

    text-transform: none;

    line-height: 1;

    -webkit-font-smoothing: antialiased;

    -moz-osx-font-smoothing: grayscale;

    content: "\e1011";

}



.btn.style02:hover {

    color: #ffffff;

    background: #e7464a;

}



.btn.style02:hover i {

    color: #fff;

}





/*------------ share ------------*/



.share .btn {

    color: #fff;

    background: #E7464A;

}



.share .btn:hover {

    color: #fff;

}



.share .facebook:hover {

    background: #405D9A;

}



.share .twitter:hover {

    background: #39A0CE;

}



.share .google:hover {

    background: #F34537;

}



.share .plurk:hover {

    background: #E9443D;

}





/*------------ search ------------*/



.search-box .btn {

    width: 30px;

    height: 30px;

    background: url('../../../../images/common/color_black/ic_search.png');

}



.site-header .search-box {

    margin: 38px 0;

}



.site-header .search-box .form-control {

    background: #000;

    color: #fff;

}



.search-box .form-control::-webkit-input-placeholder {

    color: #BFD1D3;

}



.search-box .form-control:focus::-webkit-input-placeholder {

    color: #BFD1D3;

}



.search-box .form-control::-moz-placeholder {

    color: #BFD1D3;

}



.search-box .form-control:focus::-moz-placeholder {

    color: #BFD1D3;

}



.search-box .form-control::-ms-input-placeholder {

    color: #BFD1D3;

}



.search-box .form-control:focus::-ms-input-placeholder {

    color: #BFD1D3;

}



.search-box .form-control::-moz-placeholder {

    color: #BFD1D3;

}



.search-box .form-control:focus::-moz-placeholder {

    color: #BFD1D3;

}





/*------------ language ------------*/



.language .btn {

    color: #fff;

}



.language ul {

    background: #FFFFFF;

    box-shadow: 0 0 4px rgba(0, 0, 0, .2);

    border: solid #CCCCCC;

    border-width: 0 1px 1px 1px;

}



.language ul li + li {

    border-top: 1px solid #CCCCCC;

}



.language li a {

    color: #666666;

}



.language ul li a:hover {

    color: #E7464A;

    border-left: 3px solid #E7464A;

}





/*------------ fixed ------------*/



.header-fixed .site-header {

    background: #fff;

}



.header-fixed .site-title .logo {

    width: 130px;

    height: 40px;

}



/*------------ site_main ------------*/



.main-top {

    background: #F5F5F3;

}



.main-title {

    color: #000000;

}



.site-main {

    background: url('../../../../../images/common/color_black/index/content_bg.jpg') -30px repeat;

    background-position: top center;

}



.site-main:before {

    background: url('../../../../images/common/color_black/content_bg.png') no-repeat center top;

}



.content-title {

    color: #C2A254;

    background: #fff url('../../../../images/common/color_black/dot.png') repeat-x 0 90%;

}



.main-content {

    border: 1px solid #ECECEC;

    outline: 10px solid #F5F5F3;

    background: #fff;

}



.main-content-style02 {

    border: 0;

    outline: 0;

    background: none;

}





/*------------ breadcrumb ------------*/



.breadcrumb {

    color: #999999;

}



.breadcrumb a:hover,

.products-breadcrumb a:hover ,

.products-breadcrumb02 a:hover {

    color: #000;

}



.products-breadcrumb,

.products-breadcrumb02 {

    color: #AAAAAA;

}





/*------------ floating ------------*/



.floating .gotop {

    background: #e7464a url('../../../../images/common/color_black/ic_arrow.png') no-repeat center;

}



.floating .gotop:hover {

    background: #444 url('../../../../images/common/color_black/ic_arrow.png') no-repeat center;

}





/*------------ pagination ------------*/



.pagination li a {

    color: #999999;

    border: 1px solid #E8E8E8;

    background: #fff;

}



.pagination li a:hover,

.pagination li.active a {

    background: #e7464a;

    color: #ffffff;

}



.pagination li a.controls {

    color: #BBBBBB;

    background: #fff;

}



.pagination li a.controls:hover {

    background: #e7464a;

    color: #ffffff;

}



.page-info .form-control {}



.page-info .form-control:focus {}





/*------------ side ------------*/



.side {}



.side .title {}



.side-nav > li > a {}



.side-nav > li > a:before {}



.side-nav > li > a:hover,

.side-nav > li.active > a {}



.side-nav ul {}



.side-nav ul li a:hover,

.side-nav ul li.active a {}





/*------------ content-nav-menu ------------*/



.content-nav-menu > li > a {

    color: #666666;

    border: thin #DDDDDD solid;

    background: #fff;

}



.content-nav-menu > li i {

    color: #fff;

}



.content-nav-menu ul {

    box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);

}



.content-nav-menu ul li a {

    background: #fff;

    color: #666666;

}



.content-nav-menu li a:hover {

    color: #fff;

    background: #e7464a;

}



.content-nav-menu ul li a:hover {

    color: #E7464A;

    background: #fff;

    border-left: 4px solid #E7464A;

}



.content-nav-menu ul li + li {

    border-top: 1px solid #CCCCCC;

}



.content-nav-menu li > a.active {

    color: #fff;

    background: #e7464a;

}

.content-nav-menu li > ul > li > a.active {

    color: #E7464A;

    background: #fff;

    border-left: 4px solid #E7464A;

}





/*------------ form ------------*/



.form-control {

    border: 1px solid #E8E8E8;

}



.form-control:focus {

    outline: none;

}



.form-box .required:before {

    border: 3px solid #e7464a;

}





/*--- reminder ---*/



.reminder b {

    border: 3px solid #e7464a;

}





/*------------ site-footer ------------*/



.footer-top {

    background: #F7F7F7;

}



.footer-mid {

    background: #333;

}



.site-map {

    color: #ccc;

}



.footer-mid .title {

    color: #C2A254;

}



.site-map ul a:hover {

    color: #f9cfd0;

}



.site-map ul li + li {

    border-left: 1px solid #555;

}



.site-map ul {

    border: solid #555;

    border-width: 0 1px;

}



.footer-copy .copyright b {

    color: #e7464a;

}



.footer-copy .author {

    color: #919191;

}



.footer-copy {

    color: #919191;

}



/*------------ mobile_menu ------------*/



.mmenu-show #mobile-fixed ul {

    border-bottom: 1px solid #505050;

}



.mmenu-show #mobile-fixed li {

    background: #333;

}



.mmenu-show #mobile-menu .menu li > a:hover,

.mmenu-show #mobile-menu .menu li.active > a {

    color: #E7464A;

}



.mmenu-show #mobile-menu .share-menu {

    background: #333;

}



.mmenu-show #mobile-search {

    background: #333;

}



.mmenu-show #mobile-menu .language-menu {

    background: #333;

}



.mmenu-show #member-box li {

    background: #333;

    border-bottom: 1px solid #505050;

}



.mmenu-show #mobile-search .search-box .form-control::-webkit-input-placeholder {

    color: #999;

}



.mmenu-show #mobile-search .search-box .form-control:focus::-webkit-input-placeholder {

    color: #999;

}



.mmenu-show #mobile-search .search-box .form-control::-moz-placeholder {

    color: #999;

}



.mmenu-show #mobile-search .search-box .form-control:focus::-moz-placeholder {

    color: #999;

}



.mmenu-show #mobile-search .search-box .form-control::-ms-input-placeholder {

    color: #999;

}



.mmenu-show #mobile-search .search-box .form-control:focus::-ms-input-placeholder {

    color: #999;

}



.mmenu-show #mobile-search .search-box .form-control::-moz-placeholder {

    color: #999;

}



.mmenu-show #mobile-search .search-box .form-control:focus::-moz-placeholder {

    color: #999;

}



.mmenu-show .toggle-mmenu-close {

    color: #fff;

}



/*------------ news ------------*/



.news-list li .box {

    background: rgba(255, 255, 255, .9);

}



.news-list li .box:hover {

    border-color: #e7464a;

    outline: 1px solid #ECECEC;

    background: rgba(255, 255, 255, 1);

}



.news-list .cover:before,

.news-list .cover:after {

    height: 6px;

    background: url('../../../../images/common/color_black/dot2.png') repeat-x;

}



.news-list .cover i:before {

    content: "\e1008";

    color: #C2A254;

    font-size: 24px;

}



.news-list li .date {

    color: #C2A254;

}



.news-list li .date i {

    background: #333;

}



.news-list li .name {

    color: #444444;

}



.news-list .box:hover .name {

    text-decoration: underline;

}



.news-list li .description {

    color: #999999;

}



.news-list li .pic a:before {

    background: rgba(183, 183, 183, 0.3);

    opacity: 1;

}



.news-list .box:hover .pic a:before {

    opacity: 0;

}



.news-detail {

    background: #fff;

}



.news-date {

    background: url('../../../../images/common/color_black/dot2.png') repeat-x 0 7px;

    color: #C2A254;

}



.news-date i {

    background: #fff;

    color: #C2A254;

}



.news-title {

    color: #444444;

}





/*------------ album ------------*/



.album-list li .pic a:before {

    opacity: 0;

    background: rgba(70, 70, 70, 0.2);

}



.album-list .box:hover .pic a:before {

    opacity: 1;

}



.album-list li .cover {

    background: #F7F7F7;

}



.album-list li .cover:before {

    border: 1px solid #EBEBEB;

}



.album-list li .cover:after {

    border-width: 31px 31px 31px 0;

    border-color: transparent #F7F7F7 transparent transparent;

}



.album-list li:nth-child(4n) .cover:after,

.album-list li:nth-child(3n) .cover:after {

    border-width: 31px 0 31px 31px;

    border-color: transparent transparent transparent #F7F7F7;

}



.album-list li:nth-child(4n) .box:hover .cover:after,

.album-list li:nth-child(3n) .box:hover .cover:after {

    border-color: transparent transparent transparent #444;

}



.album-list .box:hover .cover {

    background: #444;

}



.album-list .box:hover .cover:before {

    border-color: #EBEBEB;

}



.album-list .box:hover .cover:after {

    border-color: transparent #444 transparent transparent;

}



.album-list li .name {

    color: #000000;

}



.album-list .box:hover .name {

    color: #fff;

}



.album-list li .more {

    color: #DFDFDF;

}





/*------------ lightbox ------------*/



body #fancybox-thumbs ul li a {

    border: 1px solid transparent;

    background: transparent;

    padding: 0;

    opacity: .4;

    transition: all .2s;

}



body #fancybox-thumbs ul li a:hover,

body #fancybox-thumbs ul li.active a {

    border: 1px solid #fff;

    opacity: 1;

}



body .fancybox-opened .fancybox-skin {

    background: #fff;

    outline: 1px solid #CCCCCC;

}



.photo-intro {

    color: #666666;

}



.photo-title {

    color: #FFFFFF;

    background: #444;

}



.photo-pager {

    color: #c7c7c7;

}



.photo-pager b {

    color: #C2A254;

    font-size: 20px;

}





/*------------ products ------------*/



.product-list .pic a:before {

    background: rgba(70, 70, 70, 0.2);

    opacity: 0;

}



.product-list .pic a:after {

    color: #FFFFFF;

    border: 2px solid rgba(231, 70, 74, 0);

    background: rgb(231, 70, 74);

    opacity: 0;

    top: 0;

    width: 150px !important;

    height: 40px !important;

    line-height: 40px !important;

    margin: -25px 0 0 -75px !important;

}



.product-list .box:hover .pic a:before,

.product-list .box:hover .pic a:after {

    opacity: 1;

}



.product-list .box:hover .pic a:after {

    top: 50%;

}



.product-list li .box:hover .pic a:before {

    opacity: 1;

}



.product-list .name {

    color: #444444;

}



.product-list .box:hover .name a{

    color: #E7464A;

}



.product-list .description {

    color: #999999;

}



.product-list .box.new:before {

    background: #e7464a;

    color: #ffffff;

    border-radius: 0% !important;

    height: 25px !important;

    line-height: 25px !important;

    -webkit-transform: skew(-15deg);

    -moz-transform: skew(-15deg);

    -o-transform: skew(-15deg);

    -ms-transform: skew(-15deg);

    transform: skew(-15deg);

}



.product-list .more {

    color: #999999;

    border: 1px solid #E8E8E8;

}



.product-list .box:hover .more {

    color: #E7464A;

    border: 1px solid #E7464A;

}



.sort_icon .ibtn.one {

    background-image: url(../../../../images/common/color_black/products/sort_pic3.png);

    display: none;

}



.sort_icon .ibtn.two {

    background-image: url(../../../../images/common/color_black/products/sort_pic1.png);

}



.sort_icon .ibtn.four {

    background-image: url(../../../../images/common/color_black/products/sort_pic2.png);

}



/*--- search ---*/





/*--- sort_box ---*/



.sort_box .form-control {

    border-color: #ECECEC;

    color: #858585;

}





/*--- detail ---*/



.products-intro .product-name {

    color: #e7464a;

}



.product-text .tit {

    border-bottom: 1px solid #666;

}



.product-text p {

    font-size: 14px;

    color: #999999;

}



.products-intro .thumbnails li a:after {

    background: rgba(70, 70, 70, 0.2);

}



.products-detail .title {

    border: solid #E8E8E8;

    border-width: 1px 0;

}





/*------------ article ------------*/



.article-list > li .box {

    border: 1px solid #E8E8E8;

    background: #F6F6F6;

}



.article-list .pic a:before {

    opacity: 0;

    background: rgba(183, 183, 183, 0.3);

}



.article-list li:hover .pic a:before {

    opacity: 1;

}



.article-list li .date i,

.article-date i {

    background: #444;

    color: #F6F6F6;

}



.article-list li .date i b,

.article-date i b {

    color: #c2a254;

}



.article-list li .name {

    color: #444444;

}



.article-list .description {

    color: #999999;

}



.article-list .more {

    color: #000000;

}



.article-list .text:hover .name,

.article-list .text:hover .description {

    text-decoration: underline;

}





/*--- keyword_box ---*/



.keyword_box {

    border-top: 1px solid #E8E8E8;

}



.keyword li,

.keyword li a {

    color: #C2A254;

}



.keyword li a:hover {

    color: #e7464a;

}



.keyword_box .icon-ic-keyword {

    color: #C2A254;

}





/*--- detail ---*/



.article-detail .text {

    background: #F6F6F6;

    border: 1px solid #E8E8E8;

}



.article-title {

    color: #444444;

}



.article-share {

    background: #F6F6F6;

    border: 1px solid #E8E8E8;

}





/*------------ faq ------------*/



.faq-list li {

    background: #fff;

}



.faq-list li:before {

    color: #444444;

}



.faq-question {

    color: #444444;

}



.faq-list li:after {

    color: #999999;

}



.faq-answer {

    border-top: 1px dotted #666666;

}



.faq-item:hover .faq-question,

.faq-item.active .faq-question {

    color: #e7464a;

    text-decoration: underline;

}



.faq-item:hover:after,

.faq-item.active:after {

    color: #E7464A;

}





/*------------ links ------------*/



.link-list li .pic a:before {

    background: rgba(183, 183, 183, 0.3);

}



.link-list li .box:hover .pic a:before {

    opacity: 1;

}



.link-list li .name:before {

    content: "\e1004";

    background: #333;

    color: #fff;

}



.link-list .box:hover .name {

    text-decoration: underline;

}



.link-list .box:hover .name:before {

    background: #e7464a;

}





/*------------ branch ------------*/



.branch-list .pic a:before {

    background: rgba(183, 183, 183, 0.3);

}



.branch-list li .box:hover .pic a:before {

    opacity: 1;

}



.branch-list .text-box {

    background: #F6F6F6;

    border: 1px solid #FFF;

}



.branch-list li .name {

    color: #444444;

}



.branch-list .description {

    color: #999999;

    border-top: 1px solid #E8E8E8;

}



.branch-list .map_box i {

    background: #333;

    color: #fff;

}



.branch-list .map_box:hover i {

    background: #e7464a;

}





/*------------ download ------------*/



.download-list li .box {

    background: rgba(255, 255, 255, .85);

    border: solid rgba(255, 255, 255, .85);

}



.download-list li .box:hover {

    border-color: #e7464a;

    outline: 1px solid #ECECEC;

}



.download-list .pic a:after {

    content: "\e1003";

    color: #fff;

    background: #444;

}



.download-list .pic a:before {

    background: rgba(183, 183, 183, 0.3);

}



.download-list .box:hover .pic:before {

    opacity: 1;

}



.download-list .box:hover .pic a:after {

    color: #fff;

    background: #c2a254;

}



.download-list li .name {

    color: #444444;

}





/*------------ message ------------*/



.write-question i,

.form-title i {

    color: #fff;

    background: #C2A254;

}



.write-question:hover i {

    background: #e7464a;

}



.message-list li {

    background: url('../../../../images/common/color_black/dot.png') repeat-x bottom;

}





/*--- author-box ---*/



.author-box {

    color: #444;

}



.author-box:before {

    content: "\e1006";

    color: #444;

}



.message-answer .author-box {

    color: #666;

}





/*--- question ---*/



.message-list li:hover .message-question .title,

.message-list li.active .message-question .title {

    text-decoration: underline;

}



.message-question .title {

    color: #666666;

}





/*--- answer ---*/



.message-answer {

    background: #F6F6F6;

    border: 1px solid #E8E8E8;

}



.message-answer .author-box:before {

    color: #e7464a;

    content: "\e1005";

}



.message-answer .editor {

    color: #666666;

}





/*--- form ---*/



#message-form {

    border: 1px solid #E8E8E8;

}



#message-form .form-title {

    background: #fff;

}





/*------------ video ------------*/



.video-list li .box {

    background: rgba(255, 255, 255, .85);

}



.video-list li .box:hover {

    border-color: #e7464a;

    outline: 1px solid #ECECEC;

    background: rgba(255, 255, 255, 1);

}



.video-list .cover {

    font-size: 12px;

    color: #C2A254;

}



.video-list .cover:before,

.video-list .cover:after {

    height: 6px;

    background: url('../../../../images/common/color_black/dot2.png') repeat-x;

}



.video-list .cover i:after {

    content: "\e1009";

    color: #C2A254;

    font-size: 20px;

}



.video-list li .name {

    color: #444444;

}



.video-ic {

    color: #C2A254;

    background: url(../../../../images/common/color_black/dot2.png) repeat-x bottom;

}



.video-ic:after {

    content: "\e1009";

    background: #fff;

}



.video-title {

    color: #444444;

    border: 1px solid #E8E8E8;

    background: #F6F6F6;

}



.video-box {

    margin: 30px 0;

}





/*------------ contact ------------*/



.contact-map {

    border: 6px solid #E0E0E0;

}



.contact-map:after {

    content: "";

    width: 100%;

    height: 5px;

    display: block;

    background: url('../../../images/common/color_black/dot.png') repeat-x bottom;

    position: absolute;

    bottom: -30px;

}



.contact-map:before {

    background: rgba(36, 54, 57, .2);

}



.contact-map iframe {

    -webkit-filter: grayscale(100%);

    -moz-filter: grayscale(100%);

    -ms-filter: grayscale(100%);

    -o-filter: grayscale(100%);

    filter: grayscale(100%);

    vertical-align: bottom;

}



.contact-map:hover iframe {

    -webkit-filter: grayscale(0);

    -moz-filter: grayscale(0);

    -ms-filter: grayscale(0);

    -o-filter: grayscale(0);

    filter: grayscale(0);

}



.contact-map:hover:before {

    opacity: 0;

}



.contact-detail .editor {

    background: url('../../../images/common/color_black/dot.png') repeat-x bottom;

}



.contact-title {

    background: #fff;

}



.contact-title i {

    color: #fff;

    background: #C2A254;

}



.form-wrap {

    border: 1px solid #E8E8E8;

}





/*------------ success-box ------------*/



.success-box .msg {

    color: #202020;

}



.success-box .msg i:before {

    content: "\e1010";

    color: #fff;

    background: #E7464A;

}



/*------------ footer-editor ------------*/



.footer-editor .qr-inner img {

    border: 12px solid #DDDDDD;

    background: #fff;

}



/*------------ about-editor ------------*/



.about-tit {

    font-size: 18px;

    color: #E74549;

}



/*------------ news-editor ------------*/



.news-tit {

    font-size: 18px;

    color: #e7464a;

}



/*------------ service-editor ------------*/



.service-ul li .box {

    background: #F5F5F3;

}



.service-ul li b {

    font-size: 33px;

    color: #D8CC5A;

}



/*------------ video-editor ------------*/



.video-editor-tit {

    font-size: 18px;

    color: #467B60;

}





/*------------ terms-editor ------------*/



.terms-editor .title {

    font-size: 16px;

    color: #E7464A;

    margin: 0;

}



/*------------ index-service ------------*/



.index-service-editor {

    text-align: center;

    font-size: 15px;

    color: #fff;

}



.index-service-tit {

    margin: 0;

    font-size: 18px;

    color: #C2A254;

    line-height: 1.85;

}



/*------------ rwd ------------*/



@media screen and (max-width: 1350px) {

    .site-header .search-box {

        margin: 10px 0;

    }



    .site-nav .menu {

        margin: 0px 0;

    }

    .site-title .logo {

        width: 140px;

        height: 50px;

    }

}



@media screen and (max-width: 767px) {

    .site-title .logo {

        width: 145px;

        height: 40px;

    }

}



@media screen and (max-width: 550px) {

    .album-list li .cover:after,

    .album-list li:nth-child(4n) .cover:after,

    .album-list li:nth-child(3n) .cover:after {

        border-width: 0 31px 31px 31px;

        border-color: transparent transparent #F7F7F7 transparent;

    }

     .album-list li:hover .cover:after,

    .album-list li:hover:nth-child(4n) .cover:after,

    .album-list li:hover:nth-child(3n) .cover:after {

        border-width: 0 31px 31px 31px;

        border-color: transparent transparent #444 transparent;

    }

    .album-list li:nth-child(4n) a:hover .cover:after,

    .album-list li:nth-child(3n) a:hover .cover:after {

        border-color: transparent transparent #444 transparent;

    }

}