File: /home/hanode/public_html/wp-content/themes/kingstore/assets/less/app/_blog_detail.less
.single.main {
.post, .team, .attachment {
.entry-wrap {
position:relative;
.entry-thumb {
position: relative; border-radius: 4px; overflow: hidden;
}
.entry-title{
color:@body-color; margin-bottom: 15px; font-size:20px; font-weight: bold;
}
.entry-meta{
margin-bottom: 10px; font-size: 12px;
.entry-date{
float:left; border-right: 1px #999 solid; padding-right: 10px; margin-right: 10px;
i{
color: @a-color;
}
}
.entry-view{
float:left;
}
}
.entry-content{
.entry-summary {
line-height: 26px; color: #666;
ul{
margin: 0;
li{
span, em, strong{
font-size: 14px !important;
}
}
}
p {
line-height: 26px; clear: both;
.alignnone{
float: left;
display: block;
clear: none;
margin: 20px 0 30px 0;
&.image-single{
margin-left:30px;
}
}
}
.page-links{
margin-top: 30px; overflow: hidden; background: #f2f2f2; padding: 30px 0; border-radius: 4px;
.page-links-title{
border: none; margin: 0 10px;
width: auto;
height: auto;
line-height: 32px;
border-radius: 0;
float: left;
background: none;
color: #666;
&:hover{
background: none;
}
}
span, a{
display: block;
width: 32px;
line-height: 30px;
height: 32px;
border-radius:50%;
text-align:center;
font-size:14px;
float: left; background: #fff;
margin: 0 5px;
&:hover{
color: @color;
}
}
span{
background: #fff;
color: @color;
}
a{
span{
border: none;
margin: 0;
background: none;
color: @body-color;
}
}
}
}
.social-share {
line-height: 33px; margin-top: 15px;
display:block; border-top:1px solid #ddd;
border-bottom:1px solid #ddd;
padding:15px 0;
.title-share{
float:left;
font-size:14px;
color:@body-color;
margin-right:20px;
text-transform:uppercase;
.rtl &{
margin-left:20px;
margin-right:0;
float:right;
}
}
a {
display: inline-block;
vertical-align: top;
padding: 0;
margin:0 4px;
text-align:center;
border-radius:50%;
height:33px;
width:33px;
color: #fff;
background-color:@color;
font-size: 16px;
.transition(all .3s);
background:#3b5988;
&:hover {
background: @a-color;
}
i{
line-height:35px;
}
&:nth-child(2){
background: #00aced;
&:hover {
background: @a-color;
}
}
&:nth-child(3){
background: #ff1d1e;
&:hover {
background: @a-color;
}
}
i{
line-height:33px;
}
}
}
}
}
#authorDetails {
margin: 40px 0 0;
.authorDetail {
background-color: #fff;
display: inline-block;
vertical-align: top;
width: 100%;
.avatar {
overflow: hidden;
float: left;
.rtl & {
float: right;
}
}
.infomation {
overflow: hidden;
padding: 10px 20px;
color: #999999;
line-height: 22px;
.name-author {
text-transform: uppercase;
color: @body-color;
font-size:14px;
font-weight: 700;
}
}
}
}
}
.entry-single-title{
text-align: center; font-size: 22px; font-weight: bold; color: @body-color; margin-bottom: 30px;
}
.project{
.entry-top{
margin-bottom: 40px;
.entry-content{
.entry-meta{
.meta-price, .meta-item{
margin-bottom: 15px; line-height: 22px;
strong{
color: @body-color;
}
}
.meta-price span{
font-size: 16px; color: #da251d; font-weight: bold;
}
}
.entry-content-single{
line-height: 24px;
}
}
}
.responsive-slider{
margin-bottom: 50px; position: relative;
h3{
font-size: 16px; font-weight: bold; padding: 0 15px; color: @body-color; margin-bottom: 15px;
}
.slider{
.item-gallery{
padding: 0 15px;
}
}
.res-button{
position:absolute; top: 50%; cursor:pointer; font-size: 24px; width: 45px; height: 45px; text-align: center; line-height: 40px; z-index: 9;
.opacity(0); visibility: hidden; .transition(all 0.3s ease); margin-top: -22px; background: rgba(255,255,255,0.8); border-radius: 50%;
&.slick-next{
right: 30px;
&:before{
content: '\f105'; font-family: FontAwesome; color: #222;
}
&:hover{
background: @a-color; border-color: @a-color; .transition(all 0.3s ease);
&:before{
color: #fff;
}
}
}
&.slick-prev{
left: 30px;
&:before{
content: '\f104'; font-family: FontAwesome; color: #222;
}
&:hover{
background: @a-color; border-color: @a-color; .transition(all 0.3s ease);
&:before{
color: #fff;
}
}
}
}
&:hover{
.res-button{
.opacity(1); visibility: visible; .transition(all 0.3s ease);
}
}
}
}
.td-top{
display: none;
}
.tuyendung{
.item{
float: left; background: #efefef; margin-right: 15px; padding: 5px 10px;
span{
font-weight: bold; font-style: italic; color: @body-color;
}
&.item1{
background: #dff9db;
}
}
}
.td-content, .td-col{
h3{
font-size: 18px; font-weight: bold; color: @body-color;
}
ul{
list-style: none;
li{
position: relative; padding-left: 15px;
&:before{
content: "\f111"; position: absolute; left: 0; top: 0; font-family: fontawesome; color: #1d478f; font-size: 6px;
}
strong{
color: @body-color;
}
}
}
}
.td-content{
.td-content-left{
width: 60%; float: left;
}
.td-content-right{
width: 40%; float: left; position: relative;
.info{
position: absolute; left: 0; right: 0; top: 56px; text-align: center; padding-right: 56px;
h3{
font-size: 16px;
}
p{
color: #da251d; font-weight: bold; font-size: 16px;
}
a{
color: #fff; width: 160px; height: 45px; line-height: 45px; border-radius: 4px; box-shadow: 0 2px 2px #ccc; display: inline-block; vertical-align: top; .transition(all 0.3s);
&.td1{
background: @a-color; margin-bottom: 10px;
&:hover{
background: darken(@a-color,10%); .transition(all 0.3s);
}
}
&.td2{
background: @color;
&:hover{
background: darken(@color,10%); .transition(all 0.3s);
}
}
}
}
}
}
.td-col{
width: 50%; float: left;
}
}
.single-format-gallery{
.entry-wrap{
.entry-title, .entry-meta{
display: none;
}
.entry-content{
margin-bottom: 45px;
.gallery {
margin: 0 !important;
li{
padding: 0; margin: 0; width: 20% !important; float: left;
a{
padding: 0; border: none;
}
}
}
}
}
.single-post-relate{
display: none;
}
}
.entry-content{
p{
line-height: 22px;
}
}
.single-post-relate{
margin:40px 0;
> h4 {
margin-bottom: 20px;
font-size:20px;
color: @body-color;
font-weight: bold;
padding:0 0 20px 0;
border-bottom:1px solid @border-color;
}
.post {
.entry {
padding: 20px;
box-shadow: 0 0 10px rgba(0,0,0,0.15);
background-image: url(../assets/img/Bg_Product.png);
background-repeat: no-repeat;
display: block;
background-size: cover;
background-position: center center;
}
.item-relate-img {
position: relative; overflow: hidden; margin-bottom: 20px;
img{
height: 300px; width: auto; margin: 0 auto;
}
&:hover img{
opacity:0.85;
}
}
.item-relate-content{
h4{
margin-bottom: 15px; font-size: 14px; line-height: 20px; height: 40px;
a{
color:@body-color;
font-weight: bold;
&:hover{
color:@color;
}
}
}
.entry-date{
font-size:12px;color:#999;
}
}
}
&.project{
> h4{
margin: 0 15px; border: none;
}
}
}
#comments{
.title{
font-size:18px; color: @body-color; text-transform:uppercase;
font-weight: bold; padding-bottom: 15px; position: relative;
margin-bottom: 30px; border-bottom: 1px @border-color solid;
&:before{
position: absolute;
content: "";
width: 100px;
height: 2px;
bottom: -1px;
left: 0;
background: @color;
.rtl &{
left: auto; right: 0;
}
}
small{
color:@body-color; font-size: 18px;
}
}
.commentlist .children{
margin-left:60px;
margin-right:0;
.rtl &{
margin-right: 90px;
margin-left: 0
}
}
.comment{
margin-bottom:30px; border: 1px @border-color solid; padding: 15px; border-radius: 4px;
background-color:#fff;
.author{
margin: 0;
overflow: hidden;
img{
margin-bottom: 10px;
}
}
.comment-rating{
text-align: center;
}
.media-body {
padding-left: 20px;
.rtl & {
padding-right: 20px;
padding-left: 0;
}
.media{
.media-heading {
overflow:hidden;
margin-bottom:10px;
padding-bottom:5px;
border-bottom:1px solid @border-color;
.author-name{
color:@body-color;
text-transform:uppercase;
margin-bottom:5px;
}
.time{
color:#999;
font-size: 14px;
line-height: 21px;
padding: 0 50px;
margin-top:-1px;
a{
color:#999;
}
}
.reply{
a {
position: relative;
font-size: 0;
&:before {
font-size: 20px;
color: #999999;
content: "\f112";
display: inline-block;
vertical-align: top;
font-family: fontawesome;
}
&:hover:before { color: @color; }
}
}
}
.media-content{
p{
font-size: 14px;
}
}
}
}
}
.pingback {
border: 1px @border-color solid; padding: 15px 15px 5px 15px;
.media-heading {
overflow: hidden;
.time{
display: none;
}
}
.media-content{
padding: 0 30px;
}
p{
line-height: 24px;
}
}
}
#respond {
margin-bottom: 60px; margin-top: 40px;
.title{
font-size:18px; color: @body-color; text-transform:uppercase;
font-weight: bold; padding-bottom: 15px; position: relative;
margin-bottom: 30px; border-bottom: 1px @border-color solid;
&:before{
position: absolute;
content: "";
width: 100px;
height: 2px;
bottom: -1px;
left: 0;
background: @color;
.rtl &{
left: auto; right: 0;
}
}
.rtl &{
padding: 15px 0 10px 15px;
}
}
form{
p{
font-size: 14px;
}
.rating{
padding: 0;
}
.cmm-box-bottom{
textarea{
width: 100%; padding: 10px; border-radius: 4px;
}
}
.cmm-box-top{
.control-group{
width: 32%;
input{
width: 100%; padding: 10px; border-radius: 4px;
}
&.your-email{
margin: 0 2%;
}
}
}
.form-submit{
.submit{
color: #fff; background: @color; border-radius: 4px; padding: 10px 20px; text-transform: uppercase; .transition(all 0.3s);
&:hover{
background: darken(@color, 10%); .transition(all 0.3s);
}
}
}
}
}