@import "../../../theme/color.css.less";


 

.article-title{
  border-top:4px solid @colorA1;
  border-right:1px solid @colorC1;
  border-left:1px solid @colorC1;
   background-color:@colorC2;
  padding:0 10px;
  overflow:hidden;
  
}


.article-content{
  
  line-height: 1.5;
  width:98%;  
  clear:both;
  padding:1%;
  box-shadow: inset 0 0 1px 1px @colorC1;
 overflow:hidden;
}

.article-content blockquote{
  
  background-color:@colorC2;
  padding:1%;
  color:@colorB1;
  border-right:8px solid @colorB1;
 }
 
 .article-content .article-image {
     margin-bottom:10px; 
   
 }
 
 
.article-body iframe ,.article-body embed ,.article-body img{
  margin:10px auto; 
  }
  
.article-statistic{
  color:@colorC1;
  direction:ltr;
}



 


.article-brief-content {
 
   box-shadow: 0px 0px 2px @colorC3;
   width:97%;
   margin:0 1.5% 10px 1.5%;

  
}

 
 
 
 .article-brief-content .cat-title {
 padding:6px;
 height:20px;
 z-index:2;
  position:relative ;
 background-color:@colorC2;  
 color:@colorA2;
 opacity:.99;
 transition: opacity .3s ease-in;
text-align:center;
 border-top:1px solid @colorA1;
}
 

 .article-brief-content .brief-text {
 padding:6px;
 height:188px;
 z-index:2;
  position:relative ;
 margin-bottom:-200px;
 background-color:fade(@colorA2, 90%); 
 color:@colorAInverse;
 opacity:0;
 transition: opacity .5s .1s ease-in;
 text-align:justify;

}

.article-brief-content:hover  > .image-wrapper  .brief-text {
 opacity:.9;
}

 


.article-brief-content .title{
 border-bottom:1px solid @colorC1;
 background-color:@colorC2;  
 color:@colorA1;
 width:98%;
 padding:8px 1% 12px 1%;
 overflow: hidden;
 text-overflow: ellipsis; 
 white-space: nowrap;
}




.article-brief-content .image-wrapper{
   overflow:hidden;
}
.article-brief-content img{
width:100%; 
height:200px;
vertical-align:bottom;
  -webkit-transition:  transform .5s ; /* Safari */
    transition:  transform .5s ;
  
 
}

.article-brief-content:hover > .image-wrapper img {
 transform:scale(1.1);
 position:relative ;
  z-index:1;

}





.article-cat {
    width:97%;
   margin:0 1.5% 10px 1.5%;
}

 

.article-cat .brief-text {
 padding:6px;
 height:188px;
 z-index:2;
 margin-bottom:-200px;
 background-color:fade(@colorA2, 90%); 
 color:@colorAInverse;
 opacity:0;
 transition: opacity .3s ease-in;
 text-align:justify;

}
.article-cat:hover  > .image-wrapper  .brief-text {
 opacity:.9;
}

 
.article-cat  .title{
  border-bottom:1px solid @colorA2;
 background-color:@colorA1;
 color:@colorC3;
 width:98%;
 padding:8px 1% 12px 1%;
 overflow: hidden;
 text-overflow: ellipsis; 
 white-space: nowrap;
 text-align:center;
}

.article-cat img{
width:100%; 
height:200px;
vertical-align:bottom;
}


/*
 * social share 
 */
.article-brief-social-share {
  margin-top:-90px;
  width:40px;
  padding:0 5px;
  color:#fff;
  text-shadow: 1px 1px #000;
  opacity:.9;
  position:relative;
  z-index:4;
  text-align:center;
   height:40px;
}

.article-brief-social-share .socialicon {
  margin:4px;
}

.article-brief-social-share  .dropdown-content{
  visibility: hidden;
     opacity:0;
    position:absolute;
   background-color:@colorC2; 
   border:1px @colorC1 solid;
   border-radius:6px;

   transition: opacity .4s ease-in-out , visibility .4s ease-in-out;

  
} 
.article-brief-social-share .typcn{cursor:pointer; margin:0}
.article-brief-social-share .typcn:hover +  .dropdown-content , .dropdown-content:hover   {
  visibility: visible;
   opacity:1;

}





.article-author-info{
  
    line-height: 1.5;
  
}

.article-author-socialButton .socialicon  {
  
    margin-top:6px;
}



.article-show-layout{
  margin-bottom:10px;
}