/************************/
/*         font        */
/************************/
@font-face {
  font-family: 'Abadi';
  src: url('/css/kkraf/font/Abadi MT Condensed Extra Bold.eot'); /* IE9 Compat Modes */
  src: url('/css/kkraf/font/Abadi MT Condensed Extra Bold.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/css/kkraf/font/Abadi MT Condensed Extra Bold.woff') format('woff'), /* Modern Browsers */
       url('/css/kkraf/font/Abadi MT Condensed Extra Bold.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('/css/kkraf/fontAbadi MT Condensed Extra Bold.svg#svgFontName') format('svg'); /* Legacy iOS */
  }

@font-face {
  font-family: 'coolvetica';
  src: url('/css/kkraf/font/coolvetica_rg.eot'); /* IE9 Compat Modes */
  src: url('/css/kkraf/font/coolvetica_rg.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/css/kkraf/font/coolvetica rg.woff') format('woff'), /* Modern Browsers */
       url('/css/kkraf/font/coolvetica rg.ttf')  format('truetype'), /* Safari, Android, iOS */
       url('/css/kkraf/font/coolvetica rg.svg#svgFontName') format('svg'); /* Legacy iOS */
  }

* {
    margin: 0;
    padding: 0;
}
.clear {
    clear: both;
}
body {
    background-attachment: fixed;
    background-color: #FFFFFF;
    /*background-image: url("/img/kkraf/background-karnival.png")!important;
    background-image:url("/img/kkraf/bg.jpg");
    background-position: top center;
    background-repeat: no-repeat;                                           */

    height: 100%;
    margin: 0 auto;
    padding: 0;
    width: 100%;
}
#main-wrapper{
   width:985px;margin:0 auto;
}
/******************/
/*     header     */
/******************/

#headerArea {
    width:100%;float:left;background-color:#FFFFFF;
}
/*.header .lead300,.lead {
    display: none;
}*/
.header {
   float:left;
    width: 985px;
  background-color:#FFFFFF;


}

.header_upper {

    float: left;
    width: 100%;margin-top:45px

}
.xtra_menu{width:985px;display:block;background-color:#e4e4e4;float:left;}
.top-navigation{float:left;padding-bottom:30px;width:100%;}
.header_upper .line,.line{
    border-bottom: 5px solid #C2C2C2;
    float: left;
    margin-top: 5px;
    width: 985px;
    margin-bottom: 10px;
}


.header_upper .container.twoColumnsRightHeavy .col1{width:254px;float:left;}
.header_upper .container.twoColumnsRightHeavy .col2{width:728px;float:left;padding-left:3px}

.header_bottom{float:left;width:965px;padding:0px 10px 0px 10px;}
.header_bottom .line{
    border-bottom: 5px solid #000000;
    float: left;
    margin-top: 10px;
    width: 965px;}
.header_bottom .container.twoColumnsLeftHeavy .col1{width:665px;float:left;}
.header_artikel .container.twoColumns{float:left;}
.header_bottom .container.twoColumnsLeftHeavy .col2{width:300px;float:left;}

.header_artikel .container.twoColumns .col1 {
    float: left;
    width: 300px;
    padding-right: 30px;
}
.header_artikel .container.twoColumns .col2 {
    float: left;
    width: 300px;
}
.header_artikel .lead300{margin-top:10px}
.header_artikel .lead300 a{text-decoration:none;color:#000000;font-size:13px;font-family:Arial;}
.header_artikel .tajuk300 a,.content_khas .tajuk300 a{text-decoration:none;color:#000000;font-family:'coolvetica',Arial;font-size:18px}

.socialmedia{float:left;width:250px;}


/***************************/
/****** main content ***/
/*************************/
#wrapper-content {
    clear: both;
    /*margin: 0 auto;*/
    float:left;
    width: 100%;
    background-color:#FFFFFF;

}
#main-section {

    margin:0 auto;
    width: 965px;
}
.section{width:645px;float:left;
    background-color: white;
    padding-left: 5px;}

.main_list_content{width:645px;float:left;}
.colSplitter3{width:645px;float:left;}
.titleSegment {
    color: #65318F;
    font-family: 'Abadi',Tahoma,Arial;
    font-size: 22px;
    text-transform: uppercase;
}
.content_khas{width:645px;float:left;}
.content_khas .lead300{margin-top:10px}
.content_khas .lead300 a{
text-decoration:none;color:#000000;font-family:Arial;font-size:13px;
}
.content_khas{width:645px;float:left;}
.content_khas .linksite{
    border-bottom: 1px solid #e1e1e1;
    margin-bottom: 10px;
    padding-bottom: 5px;
}
.content_khas ul.linklist li , .content_khas ul.linklist li {
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: px;

}
.content_khas ul.linklist li a, .content_khas ul.linklist li a {
    color: #000000;
    font-size: 12px;
    font-style: normal;
    text-decoration: none;
    font-family:Arial;
}
.content_khas ul.linklist li a:hover, .content_khas ul.linklist li a:hover {
    color: #646363;
}
.content_khas .container.twoColumns .col1 {
    float: left;
    width: 300px;
    padding-right: 30px;

}
.content_khas .container.twoColumns .col2 {
    float: left;
    width:310px;
}

.cnar_highlight{margin-top:20px;}
.cnar_highlight .tjk{
   text-transform:uppercase;
   font-family:'Abadi','Calibri',Tahoma;
   font-size:20px;
   color:#868688;}
.cnar_highlight .line{
    border-bottom: 1px solid #009AD8;
    margin-bottom: 10px;
    margin-top: 5px;

}
.cnar_highlight .longline,.content_khas .longline{
    border-bottom: 1px solid #009AD8;
    margin-bottom: 10px;
    margin-top: 5px;
}
.cnar_highlight .linklist li{
    border-bottom: 1px solid #e1e1e1;
    margin-bottom: 10px;
    padding-bottom: 5px;
}
.cnar_highlight .container.twoColumns .col1 {
    float: left;
    width: 300px;
    padding-right: 30px;

}
.cnar_highlight .container.twoColumns .col2 {
    float: left;
    width:310px;
}
.cnar_highlight .titleTopImgHeaderSinarUtama{display:none;}
p.lead{font-family:Arial;font-size:12px;margin-bottom:30px}
.cnar_highlight img{float:left;padding-right:5px}

.content_main{float:left;width:200px;padding-right:15px;}
.content_main .lead{display:none;}
.content_main .tajuk200 a{
    font-family: 'coolvetica';
    text-decoration: none;
    color: #000000;
    letter-spacing: 1px;
    font-weight:normal;
}
.content_main .lead200{
   display:none;
}
.content_main .tjk{
   text-transform:uppercase;
   font-family:'Abadi','Calibri',Tahoma;
   font-size:20px;
   color:#868688;
}
.content_main .tajuk{display:none;}
.content_main .line{
    border-bottom: 1px solid #009AD8;
    margin-bottom: 10px;
    margin-top: 5px;

}
.content_main ul.linklist li , .cnar_highlight ul.linklist li {
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: px;

}
.content_main ul.linklist li a, .cnar_highlight ul.linklist li a {
    color: #000000;
    font-size: 12px;
    font-style: normal;
    text-decoration: none;
    font-family:Arial;
}
.content_main ul.linklist li a:hover, .cnar_highlight ul.linklist li a:hover {
    color: #646363;
}
.content_main .linksite{
    border-bottom: 1px solid #e1e1e1;
    margin-bottom: 10px;
    padding-bottom: 5px;
}
.content_main .linksite a:hover, .cnar_highlight .linksite a:hover{text-decoration:underline;}
.other_list{float:left;}
.main_content .container.twoColumnsLeftHeavy .col1{
    background-color: #CCCCCC;
    width: 410px;
    float: left;
}
.main_content .container.twoColumnsLeftHeavy .col2{
    background-color: WHITE;
    width: 300px;
    float: left;
}
.mainlist .teaser130 {
    float: left;

}
.mainlist .teaser img {
    border: 2px solid #000000;
}
.mainlist .element.teaser {
    height: 90px;
    padding: 10px 0;
    width: 400px;
}

.mainlist .lead130 {
  font-size:14px;
  text-align:justify;
}
.mainlist .txtLagi{
  text-align:right;
}

.mainlist .txtLagi a{
  font-size:12px;
  text-decoration:none;
  color:#662e91;
}
.mainlist .txtLagi a:hover{
  color:#292929;
}
.mainlist .tajukteaser {
    text-align: left;
}
.mainlist .tajuk130 a {
    color: #662e91;
    font-size: 14px;
    text-decoration: none;
    text-transform:uppercase;
}
.mainlist .tajuk130 a:hover {
    color: #cccccc;
}
.sidebar{
    float: left;
    padding-left: 10px;
    width: 300px;
    margin-top: 15px;}

.other_list .tajuk-ab{display:none}

/**********************/
/**content 2nd level***/
/**********************/
.content2ndlevel .tajuk{display:none;}
.content2ndlevel .teaser140{
    float:left;
    padding-right:10px;
}
.content2ndlevel .teaser140 img{border:1px solid #000000}
.content2ndlevel .element.teaser{margin-bottom:10px;width:625px;float:left}
.content2ndlevel .tajuk140,.tajuk-ab{padding-top:10px}
.content2ndlevel .tajuk140 a,.tajuk-ab a{text-decoration:none;color:#000000;font-family:'coolvetica',Tahoma;font-size:17px}
.content2ndlevel .lead140{font-size:12px;font-family:Arial}
.content2ndlevel .lead140 a{color:#000000;text-decoration:none;font-family:Arial;font-size:13px}

/**********************/
/*******right column***/
/**********************/
.rightLine{
    border-bottom: 1px solid #009AD8;
    margin-bottom: 10px;
    margin-top: 5px;
}

/*********************/
/****footer***/
/*******************/
#footer {

   background-color: #000000;

    clear: both;

    margin: auto;
    padding-top: 10px;
    position: relative;
    width: 985px;
    padding-bottom: 20px;
}
.bottomfooter {
    font-size: 10px;
    text-align: center;
    color: #CCCCCC;
    MARGIN-TOP: 20PX;
}
.listmags {
    color: #FFFFFF;
    font-family: 'coolvetica',Tahoma;
    font-size: 12px;
}
.insidefooter {
    text-align: center;
}
.main215 .img215 {
    float: left;
    margin: 0 5px;
}
.main215 .img215 img {
    border: 2px solid #000000;
}
.main215 .lead215 a {
    color: #000000;
    font-family: 'Kalinga','Trebuchet MS';
    text-align: justify;
    text-decoration: none;
}
.main215.element.teaser {
    height: 145px;
    padding: 10px 0;
    width: 700px;
}
.listmags a {
    color: #FFFFFF;
    text-decoration: none;
    font-size: 11px;
}
/**********************************/
/************ARTIKEL    ***********/
/**********************************/
.tjkArtikel, .tajuk-artikel, .content-name{
    font-family: 'coolvetica',Calibri,Arial;
    color: #000000;
    font-size:25px;

}
.container .element.article h1{
    font-family: 'coolvetica',Calibri,Arial;
    color: #000000;
    font-size:25px;}
.std-article .image.top{
margin-top:10px;text-align:center;
}
.std-article .author, .author-date {float:right;font-size:12px;font-family:Arial;width:100%;margin-bottom:20px;}
.std-article img{width:95%}
.articleBody{text-align:justify;font-family:Arial,Tahoma;font-size:13px;margin-bottom:20px;line-height:1.4em;float:left;}
.articleBody strong{font-weight:bold;}
.element.article .sideBar {
    display: none;

}

.element.article .dateLine{margin-top:20px;margin-bottom:10px;font-family:Arial}
.articleBody ul {
    list-style-type: disc;
    margin-left: 10px;
}
.related-content {
    display: none;
}

.desc-area{font-family:Arial;font-size:12px;margin-bottom:30px;text-align:Left}
.articleBody .image.top.bgImage {text-align:center;margin-bottom:30px}
.caption{font-family:Arial;font-size:12px;}
.instagram{padding-top:10px}
.dateline-share{margin-top:30px;font-size:11px;font-family:Arial;}
.img-caption{font-size:12px;font-family:Tahoma}
.fbcomment{float:left;margin-top:10px;}

.double li {
    width: 50%;
}
.toplist ul {
    margin-bottom: 20px;
    overflow: hidden;
    width: 665px;
}
.toplist li {
    display: inline;
    float: left;
}
.toplist .tajuk300 a, .content-name a {
    color: #000000;
    font-family: 'Coolvetica';
    text-decoration: none;
    font-size: 17px;
}
.toplist .lead300 a{color:#000000;text-decoration:none;font-family:Arial;font-size:12px;}

.cnar_highlight .lead{font-family:Arial;font-size:12px}
.title-teaser a{color:#000000;text-decoration:none;font-family:Arial;}
.title-teaser{margin-bottom:10px;}
.title-teaser a{
  /*color:#000000;text-decoration:none;font-family:Arial;*/
color: #000000;
    font-family: 'Coolvetica';
    font-size: 17px;
    text-decoration: none;
}
.title-teaser{margin-bottom:10px;}
.sukan img{float:left;padding-right:5px;padding-bottom:15px;}
.sukan li{float:left;font-family:Arial;font-size:12px}
.sukan .title-teaser {font-weight:bold;}
.header_bottom .lead{font-family:Arial;font-size:12px;}
.header_bottom .title-teaser{font-weight:bold;}

/* articles from sh*/
#img-article > ul {
  list-style-type:none; padding:0; margin:0;
}
#controls {display: none}
#img-article span {clear:both;}
.articleBody > p {padding-top:10px;}


/**********************/
/***pagination***/
/********************/
#follow-me{
    color: #DB5C04;
    text-align: center;
}

    #follow-me a{
        color: white;
    }

#paging_container3{
    /*height: 190px;*/
}

#paging_container8 .no_more{
    background-color: white;
    color: gray;
    cursor: default;
}

.ellipse{
    float: left;
}

.page_navigation , .alt_page_navigation{
    padding-bottom: 10px;
    width:100%;
}

.page_navigation a, .alt_page_navigation a{
    background-color: #FFFFFF;

    color: #000000;
    float: left;
    font-size: 12px;
    margin: 2px;
    padding: 3px 5px;
    text-decoration: none;
}
.active_page{
    background-color: #FFFFFF !important;
    color: #abadb3 !important;
    border: 1px solid #cccccc !important;
    font-size: 18px !important;
    margin-top: 0px !important;
}

.content, .alt_content{
    color: black;
}

.content li, .alt_content li, .content > p{
    padding: 0px;
    list-style-type:none;

}
li.list-as-teaser {
  margin-left: 20px;
    padding: 8px 5px 5px 0px;
    list-style-image: url("/img/pc/bullet.png");
    font-size:14px;
}
.list-as-teaser a {
    color:#000000;
    text-decoration:none;
}
.list-as-teaser a:hover {
    color:#4d0101;
    text-decoration:none;
}

/*****************************/
/**lightbox**/
/****************************/
.imageRow {
  *zoom: 1;
  /*margin: 20px 0;*/
}
.imageRow:after {
  content: "";
  display: table;
  clear: both;
}

.imageRow .single {
  float: left;
}

.imageRow .single a {
  float: left;
  display: block;
  background: rgba(255, 255, 255, 0.1);
  padding: 3px;
  line-height: 1em;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
 /* margin-right: 40px;*/
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.imageRow .single a img {
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  border: 1px solid rgba(0, 0, 0, 0.3);
}
.imageRow .single a:hover {
  background-color: #d7b57a;
}

.imageRow .set {
  float: left;
  background: rgba(255, 255, 255, 0.1);
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
}

.imageRow .set:hover {
  background: rgba(255, 255, 255, 0.2);
}

.imageRow .set .single a {
  background: none;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none;
  margin-right: 0;
}

.imageRow .set .single a:hover {
  background-color: #8ad459;
  -webkit-box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2), 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  -moz-box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2), 0 1px 4px 0 rgba(0, 0, 0, 0.5);
  box-shadow: 0 -1px 0 0 rgba(255, 255, 255, 0.2), 0 1px 4px 0 rgba(0, 0, 0, 0.5);
}

.imageRow .set .single.first a {
  -moz-border-radius-topleft: 4px;
  -webkit-border-top-left-radius: 4px;
  -ms-border-top-left-radius: 4px;
  -o-border-top-left-radius: 4px;
  border-top-left-radius: 4px;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -ms-border-bottom-left-radius: 4px;
  -o-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
}

.imageRow .set .single.last a {
  -moz-border-radius-topright: 4px;
  -webkit-border-top-right-radius: 4px;
  -ms-border-top-right-radius: 4px;
  -o-border-top-right-radius: 4px;
  border-top-right-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -ms-border-bottom-right-radius: 4px;
  -o-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}


#lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
  opacity: 0.85;
  display: none;
}


#lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-family: "lucida grande", tahoma, verdana, arial, sans-serif;
  font-weight: normal;
}

#lightbox img {
  width: auto;
  height: auto;
}

#lightbox a img {
  border: none;
}


.lb-outerContainer {
  position: relative;
  background-color: white;
  *zoom: 1;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  -ms-border-radius: 4px;
  -o-border-radius: 4px;
  border-radius: 4px;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}


.lb-container {
  padding: 10px;
}


.lb-loader {
  position: absolute;
  top: 40%;
  left: 0%;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}


.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}


.lb-container > .nav {
  left: 0;
}


.lb-nav a {
  outline: none;
}


.lb-prev, .lb-next {
  width: 49%;
  height: 100%;
  display: block;
}


.lb-prev {
  left: 0;
  float: left;
}


.lb-next {
  right: 0;
  float: right;
}


.lb-prev:hover {
  background: url(/img/hijabista/lightbox/prev.png) left 48% no-repeat;
}


.lb-next:hover {
  background: url(/img/hijabista/lightbox/next.png) right 48% no-repeat;
}


.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  *zoom: 1;
  width: 100%;
  -moz-border-radius-bottomleft: 4px;
  -webkit-border-bottom-left-radius: 4px;
  -ms-border-bottom-left-radius: 4px;
  -o-border-bottom-left-radius: 4px;
  border-bottom-left-radius: 4px;
  -moz-border-radius-bottomright: 4px;
  -webkit-border-bottom-right-radius: 4px;
  -ms-border-bottom-right-radius: 4px;
  -o-border-bottom-right-radius: 4px;
  border-bottom-right-radius: 4px;
}
.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}


.lb-data {
  padding: 0 10px;
  color: #bbbbbb;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}
.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 11px;
}

.lb-data .lb-close {
  width: 35px;
  float: right;
  padding-bottom: 0.7em;
  outline: none;
}

.lb-data .lb-close:hover {
  cursor: pointer;
}


.blurp-buku{font-family:Arial,Tahoma;font-size:14px;width:155px;}
.blurp-mags{font-family:Arial,Tahoma;font-size:14px;width:185px;float:left;}

.hightlight-area{width:100%;float:left;padding:10px 0px;}