@import "listview.css";
#page_wrapper{
    max-width: none;
}

.comment_header, #related_header{
    border-bottom: 1px dotted #000;
    border-top: 1px dotted #000;
    padding-left: 15px;
    color: black;
    line-height:2.5;
    letter-spacing:2.5px;
    margin-bottom: 10px !important;
}

figure{
    display: inline-block;
    margin:10px 0px;
}

figure figcaption:before {
    content: '▲';
    padding-right:10px;
}

figure figcaption{
    font-size:12pt;
    padding-top:5px;
    text-align: center;
}

#feature_text img.mid{
    max-width:640px;
    height:auto;
}

#feature_text p{
    margin:16px 0px;
    line-height: 1.8;
}

#comment_title{
    width: 60%;
    display: inline-block;
}

#keyword_title{
    display: inline-block;
}

.feature_content{
    min-height: 610px;
    width: 100%;
}

#feature_header_container{
    margin: 0 auto;
    padding-bottom: 20px;
    border-bottom: 1px dotted #333;
    text-align: center;
    position: relative;
}

#feature_header_container .arrow{
    display:block;
    position:absolute;
    top:37%;
    width:50px;
    height:101px;
    z-index:2;
}

.flex-next, .flex-prev{
    display:none;
}

#feature_header_container .left_arrow{
    left:100px;    
    background:url(../../../image/menclub/common/left_arrow.png) center center;
}

#feature_header_container .right_arrow{
    right:100px;
    background:url(../../../image/menclub/common/right_arrow.png) center center;
}

#feature_header_container .slides li{
    display:none;
}

#feature_header{
}

#comment_div, #keyword_div{
    display: inline-table;
}

#comment_div{
    width: 55%;
    margin-right: 5%;
    border: 0px;
    vertical-align: text-top;
}

#comment_text{
    width: 100%;
    height: 170px;
    border: 0px;
}

#keyword_div{
    height: 170px;
    width: 40%;
    color: black;

    letter-spacing:2.5px;
    font-size: 18px;
}

.social_share{
    width: 55%;
    margin-right: 5%;
    margin-bottom: 15px;
}

#social_button{
    display: inline-block;
    float:left;
}
#comment_send{
    float: right;
    color: black;
    line-height:2.5;
    letter-spacing:2.5px;
    font-size: 13px;
}

#related_article_div{
    width: 100%;
    margin: 0 auto;
    text-align: center;
}

.related_img{
    width: 30%;
    max-width:100%;
}

.header_image{
    max-width: 860px;    
    max-height: 647px;
    width: auto;
}



.grid_detail{
    width: 100%;
    top: 271px;
    left: 0px;
    bottom: 0px;
    display: none;
}

.grid_share{
    width: 25px;
    height: 25px;
    background: url('../../../image/menclub/common/btn_share.png') no-repeat -25px 0px;
    margin:0px;
    margin-left:150px;
    float:left;
    position:relative;
}

.grid_share a.share_icon{
    width:44px;
    height:44px;
}

.grid_share a{
    display: block;
    white-space: nowrap;
    text-indent: -100%;
    overflow: hidden;
    border: 0 none;
}

.grid_widget_three{
    width: 30%;
    margin: 0px 0px 1% 1%;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    transition: all 0.5s ease;
    cursor:pointer;
    height: auto;
    background-color: #fff;
    border-radius: 15px;
    display: inline-block;    
}


#grid_photo_1{
    background: url(../../../image/temp/featureWidget_sample1.jpg) center center;
    background-size: 100%;
}

#grid_photo_2{
    background: url(../../../image/temp/featureWidget_sample2.jpg) center center;
    background-size: 100%;
}

#grid_photo_3{
    background: url(../../../image/temp/featureWidget_sample3.jpg) center center;
    background-size: 100%;
}

#grid_photo_4{
    background: url(../../../image/temp/featureWidget_sample4.jpg) center center;
    background-size: 100%;

}

#grid_photo_5{
    background: url(../../../image/temp/featureWidget_sample5.jpg) center center;
    background-size: 100%;
}


.grid_widget_three:hover {
    box-shadow: 4px 4px 5px #b0b0b0;
}

.grid_widget_three:hover div.grid_detail{
    display:inline;
}

#related_header{
    padding-left:0px;
}

#feature_text{
    padding-top: 10px;
    padding-bottom: 10px;
    text-align:center;
    color: #333;
    font-size: 13px;
    line-height: 20px;
    background-color:transparent !important;
}

#feature_text table td{
    vertical-align: top;
}

#feature_text *{
    background-color:transparent !important;
}

#feature_text img{
    max-width:640px;
    height:auto;
}

.fb-comments{
}

.author{
    color:#333;
    font-size:14px;
    font-weight:bold;
    margin-bottom:10px;
    font-family: 'Arial';
}

.line_break {
    display: block;
    width: 106%;
    height: 1px;
    margin: 10px 0px 10px -3%;
    border-bottom: 1px dotted #333;
}

#related_article_div li{
    width:100%;
    border-bottom:1px dotted #333;
    padding:10px 0px;
}

#related_article_div li .blogger{
    width:80%;
    padding:0 10%;
    text-align: left;
}

#related_article_div li .profile_pic{
    width:30%;
    max-width:85px;
    height:auto;
    float:left;
}

#related_article_div .post_info{
    width:60%;
    margin-left:10%;
    float:left;
    color:#333;
}

#related_article_div li .post_title{
    font-size:15px;
}

.author span{
    font-size:11px;
    font-weight:normal;
}

.grid_widget{
    max-width:350px;
}

#feature_text table{
    width:auto;
}

#feature_text table img{
    padding: 0 10px;
}

.feature_header .caption{
    text-align:center;
    color:#333;
}

.btn_share {
    background: url('../../../image/menclub/common/btn_share.png') 0px 0px;
    display: block;
    width: 100%;
    height: 25px;
    white-space: nowrap;
    text-indent: -100%;
    overflow: hidden;
    border: 0 none;
}

.art_nav{
    margin-top: 10px;
height: 180px;
}

.art_nav a{
    color:#333;
}

.art_nav .prev {
    float: left;
    margin-left:10px;
}

.art_nav .next {
    float: right;
    margin-right:10px;
}

.art_nav .next_title {
    float: right;
    line-height:100px;
}

.prev_title{
    line-height:100px;
}

.left_article, .right_article {
    width: auto;
    margin: 5px 10px;
    height: 70px;
}

.right_article,  .right_article .article_thumbnail {
    float: right;
}

.left_article, .prev_title, .left_article .nav_title, .article_content .left_article .article_thumbnail {
    float: left;
}

.nav_title{
    clear:both;
    text-align: center;
}

.left_article .nav_title, .left_article .article_thumbnail {
    float: left;
}

.left_article .nav_title {
    width: 100px;
}

.right_article .nav_title {
    width: 100px;
    float: right;
}

.feature_comment {
    min-height: 450px;
}

.article_thumbnail {
    width: 100px;
    height: 100px;
    overflow: hidden;
    background-position: center center;
    background-size: 150px;
    background-repeat: no-repeat;
}