/*
    File Name: style.css
*/
 
/* body */
    body {
        margin:0px auto;
        padding:0px;
        font-family: 'Arial', 'Verdana', Helvetica san-serif;
        font-size:12px;
        line-height:21px;
        position:relative; 
	padding:20px 0;
    }

/* Reset */
    ul, ol,li, h1,h2,h3,h4,h5,h6,form,p,a,img,fieldset{
        margin:0;
        padding:0;
        border:0;
    }
    .clear{
        clear:both;
    }
    
    a{
        outline: none;
    }

	.style6 {
        margin:0px auto;
        padding:0px;
        font-family: 'Arial', 'Verdana', Helvetica san-serif;
        font-size:10px;
        line-height:21px;
        position:relative;
    }

/* Layout general*/
    #container{
	width:960px;
	margin:0 auto; 
	position:relative;
	display: block;
	padding:0 10px;
    }  

    /* header */
    #header{
        clear:both;
        width:938px;
        margin:0 auto 16px auto;
	position:relative; 
	z-index:52;
    }

    /* logo */
    #logo{
        display:block;
	position:relative;
	margin:20px 0 21px 0;
	z-index:50;
    }
	
	/* signin rizky */
	#signin{
    display:inline;
	position:absolute;
	margin-top:-70px;
	margin-left:760px;
	z-index:52;
    }
 
    /*main wrapper*/
    #main{
	display:block;
	margin:0px 0 0 0;
	width:960px;
    }

    /*content wrapper*/
    .content{
        width:680px;
        float:left;
        display:inline;
	overflow:hidden;
	padding:0 30px 0 0; 
        margin:0 0px 20px 10px; 
    }

    /*full width content*/
    .content.sub.full{
        width:940px;
        float:left;
        display:block;
	overflow:hidden;
	padding:0;
	margin:0 10px;
	background:none;
    }

    /*sidebar*/
    .sidebar{
        width:220px;
        float:left;
        display:inline;
	margin:0 10px;
    }        

/* Navigation */
 
    #navigation{
	background: #cf2525 url(../images/overlay.png) repeat-x; 
	color: #fff; 
	text-decoration: none;
	-moz-border-radius: 6px; 
	-webkit-border-radius: 6px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.6);	
	line-height:12px;
	padding-top:13px;
	z-index:50;
	float:left;
	list-style-type:none;
	list-style-position:outside;
	position:absolute;	
	bottom:4px;
	right:400px;
	font-size:13px;
    }

    #navigation ul{
	display:none;
	z-index:50;
	margin:0;
	position:absolute;
	top:30px;
	left:-2px;
	padding:8px 0 0 0;
	font-size:11px;
	overflow:visible;
	width:170px;
	list-style-type: none; 
	list-style-position:outside; 
    }

    #navigation li{
	float:left;
	position:relative;
	padding-bottom:24px;
    }
    
    #navigation a{
	display:block; 
	padding:0 20px; 
	text-decoration:none; 
    }
    
    #navigation li ul li a{
	margin-left:4px;
	display:block;
	line-height:100%;
	padding:5px 20px;
	margin:0; 
	width:130px;
	overflow:visible;
	position:relative;
    }

    #navigation .current_page_item{
    }    
    
    #navigation a:hover{ 
    }
 
    #navigation ul li a:hover{ 
	padding-left:16px;
    }

    #navigation li:hover{ 
    }

    #navigation ul li:hover{
	border-bottom:0px solid transparent;
    }        
    
    #navigation ul li{
	padding-bottom:0px;
	clear:both;
	display:block;
    }
    
    #navigation ul ul{	 
	 position:absolute;
	 left:160px;
	 padding-top:0;
	 top:-8px;
	 z-index:999;
    }	

/* lines */

    .line{
	height:2px;
	position:relative;
	clear:both; 
	margin:0 10px;
	padding:0;
	font-size:1px;
    }
 
    .line.margin{
	margin:0px 10px 20px 10px !important;
    }
    
    .content .line.margin{
	margin:0px 0px 20px 0px !important;
    }

    .content .line.margin-min{
	margin:0px 0px 5px 0px !important;
    }
    
    .content  .line.nomargin{
	margin:0 !important;
    }
    
    .content  .product_list .line{ 
	margin:0px 0px 0  10px !important;
    }        

    .line.two{
	margin:0px 10px 10px 10px;
    }
    
    /*top link*/
    a.top{
	font-size:10px;
	float:right;
	position:absolute;
	right:0;
	top:-11px;
	padding-left:10px; 
	text-decoration:none;	
    }

    a.top:hover{ 
	text-decoration:underline;	
    }
    

/*  sub page header */
    .sub_header{
        width:930px;
        margin:10px auto 2px auto;
	padding:0 5px 10px 5px; 
    }

    .sub_header .left{
    width:200px;
	float:left;
	display:inline;
    }

    .sub_header h2{
	line-height:110% !important;
	padding:0 !important; 
	font-size:28px;
    }
    
	
/* Breadcrumb Menu */
    .breadcrumb{
        font-size:10px;
	float:left;
    }


/* search bar */
    .search_bar{
	height:26px;
        font-size:10px;
	float:right; 
        width:220px;
	margin-top:12px;
	z-index: 50;
    }
    
    .search_bar form input{
        height:20px; 
        float:left;
        width:180px;
        line-height:22px;
        font-size:11px;
        margin:2px 0 0 2px;
        border:0;
	padding:1px 0 0 2px; 
	background:transparent !important;
	outline:none;
	z-index: 50;
    }
    
    .search_bar form .searchsubmit{
        border:0;
        width:24px;
        height:24px;
	margin-left:10px;
	padding:0;
    }
    
    
/* Home Page Slider */

    /* Slider Height Normal*/    
    #slider, #slider_area, .slide{
	height:300px;
    }

    /* Slider Height Big*/    
    .big#slider, .big#slider_area, .slide.big{
	height:420px;
    }
    
    /* Wrappers */
    #slider{
        display:block;
        clear:both;
        padding:0px;
        position:relative; 
	margin:0 10px 20px 10px;
	padding:0; 
	width:940px;
    }
 
    #slider_area{
        overflow:hidden;
	width:940px; 
        margin:0 auto;
        position:absolute;
	overflow:hidden;
        z-index:1; 
        padding:0px;
    }
        
    /* Slides */
    .slide{
	width:940px;
	position:relative;
	overflow:hidden; 	
        padding:0px;
    }

    /* slider title */
    .slide b.title{
	font-size:46px;
    }

    /* Slider sub title */
    .slide b.subtitle{ 
	font-size:22px;
    }

    /* slider title with links */
    .slide b.title, .slide b.title a{ 
	text-decoration:none !important;
	border:0;
    }    

    .slide b.title a:hover{ 
    }        	
    
    .slide .image{
        margin:0;
        padding:0;
        position:relative;
	z-index:5;
	float:right;	
        padding:0px !important;
    }
        
    /* slider text */
    #slider_area .desc{
	width:500px;
        position:absolute;
        z-index:6;
        top:40px;
        margin:0px;
        font-size:14px; 
	padding: 10px 10px 10px 10px; 
	font-weight:normal;
	line-height:24px;  
    }
        
    #slider_area .desc a{ 
	text-decoration:underline;
    }

    #slider_area .desc a:hover{ 
	text-decoration:none;
    }
    
    
    /* prev and next buttons*/
    .prev, 
    .next {
	cursor:pointer; 
	padding:0px;
	margin:120px 0 0 0px;
	width:14px;
	position:absolute;
	top:0;
	height:40px;
	z-index:999; 
	padding:0;
	text-align:center;
    }

    /*extra space for big slider*/
    .prev.big, 
    .next.big {
	margin:180px 0 0 0px;
    }
    
    .prev img, 
    .next img{
	margin:15px 0 0 0px;
    }
    
    .prev {
	left:-17px;
    }
    .next {
	right:-17px;
    }
 
    .prev:hover, 
    .next:hover { 
    }


/* Sub page slider*/

    /* Wrapper */
    .sub_slider_con{
	position:relative;
	overflow:hidden;
	height:220px;
	width:680px;
	margin:0 0 20px 0;
	padding:0;
    }

    /* Sub slider pager*/
    .sub_slider_pager{
	position:relative;
	top:-24px;    
	z-index:999;
	margin:0 0 0 5px;
    }
    
    .sub_slider_pager a{ 
	margin:2px;
	text-decoration:none; 
	font-size:0px;
	text-indent:-999px; 
	width:10px;
	height:10px;
	position:relative;
	float:left;
    }
     
    .sub_slider_pager a.activeSlide, .sub_slider_pager a:hover{
	text-decoration:none; 
    }


 
/*  Banner bar  */
    .banner{ 
	width:940px;
	margin:0 10px 2px 10px;
	position:relative;
	display:block;
	padding:25px 0;
	font-size:28px;
	line-height:48px; 
	text-align:left;
    }
  
    a.banner_button{
	width:220px;
	height:48px;
	text-align:center;
	display:block;
	font-size:20px;
	line-height:44px;
	position:relative; 
	text-decoration:none; 
    }

     a.banner_button:hover{
    }


/* Buttons */
    a.small_button{
	width:130px;
	height:27px;
	text-align:center;
	display:block;
	font-size:13px;
	line-height:24px;
	position:relative; 
	text-decoration:none; 
    }

     a.small_button:hover{ 
    }
    
    
/* Images and Alignments */
    .aligncenter{
        display:block;
        text-align:center;
        display: block;
        margin:0 auto 0 auto;
    }
    
    .alignleft{
        float:left;
        display: inline;
    }
    
    .alignright{
        float:right;
	display: inline;
    }

    img.aligncenter{
        display:block;
        text-align:center;
        display: block;
        margin:0 auto 20px auto;
        padding:0px;
        border:0px;
        background:none;
    }
    
    img.alignleft{
        float:left;
        margin: 6px 20px 6px 0;
        display: inline;
        border:0px;
        background:none;
        padding:0;
	display:block;
    }
    
    img.alignright{
        padding:0;
        float:right;
        margin: 6px 0 6px 20px;
        border:0px;
	display:block;
        background:none;
    }
    
    
 /*  CSS framework */
    .box{
        margin:0px 10px 20px 10px;
	padding:0;
	display:inline;
	background:none;
	float:left;
	position:relative;
    }

/* columns for content with sidebar */

    /*two*/
    .content.sub .box.two-col{
	width:330px; 
    }
    
    /*three*/
    .content.sub .box.three-col{
	width:213.33px;
    }
    
    /*four*/
    .content.sub .box.four-col{
	width:155px; 
    } 
	.content.sub .box.four-col a{
	text-decoration :none;	
    }   
    
/* columns for full-width content */

    /* one-half column */
    .content.sub.full .box.one-half-col{
	width:700px; 
    }

    /* two  */
    .content.sub.full .box.two-col{
	width:460px;
    }
    
    /* three*/
    .content.sub.full .box.three-col{
	width:300px; 
    }

    /* Four*/
    .content.sub.full .box.four-col{
	width:220px; 
    }
        
/* standart layout columns */

    /* tree*/
    .box.three{
	width:300px; 
	margin:0px 10px 20px 10px;
    }
    
    /* two*/
    .box.two{
	width:460px; 
	margin:0px 10px 20px 10px;
    }
    
    /*four*/
    .box.four{
	width:220px; 
	margin:0px 10px 20px 10px;
    }
    
/* first and last column fix*/
    .box.first{
	margin-left:0px !important;
    }

    .box.last{
	margin-right:0px !important;
    }    

/* sidebar fix*/
   .sidebar .box.four{
	margin:0px 10px 10px 0px;
	padding:0;
    }
        
    .sidebar .box.four h4{
	width:220px;
    }

 
 /* Futured Boxes */
 
    /*  H4 style for futured boxes   */
    .box.four h4{
        width:240px; 
    }
    
    .box.four h4.fourth{
        width:220px;
    }    

    /* Featured box image margins */
    .box .featured_image{ 
	padding:1px;
    }

    .box.four .featured_image{
	max-width:220px;
	overflow:hidden;
    }

    
 /* Portfolio */
 
    /* portfolio wrapper */
    .portfolio_wrapper{
	margin:20px 0 0 0;
    }
 
    /* portfolio heading size for four column*/
    .portfolio_wrapper .box.four h5{
	font-size:15px  !important;
    }

    /* portfolio heading size for three column*/
    .portfolio_wrapper  .box.three h5{
	font-size:18px  !important;
    }

    /* portfolio heading size for two column*/
    .portfolio_wrapper  .box.two h5{
	font-size:20px  !important;
    }    



 /* Products */
 
    /* wrapper */
    .product_list{
	left:-10px;
	position:relative;
	display:block;
	width:690px; 
	overflow:hidden; 
    }

    /*box for products*/
    .box.products{
        width:305px;
	float:left;
	display:inline;
	margin:20px 10px 20px 10px;
	padding:0 0px 0 20px; 
    } 

    /*product title*/
    .box.products h5{
	font-size:15px;
	line-height:21px;
	margin:0;
	padding:0 0 5px 0;
    }

    .box.products .imgarea{
	margin:0 10px 0 0;
	float:left;
	display:inline;
    }

    .box.products .imgarea img{
	display:block;
    }
    
    .box.products p{
	margin:0;
	padding:0;
    }

    /*price*/
    span.price {
	font-size:15px;
	margin:0;
	padding:0;
	display:block; 
    }


    /* Product detail document Icons*/
    ul.doc_icons{
	list-style-type:none;
	list-style-position:outside;
	border:0;
	margin:0 !important;
	padding:0;
    }
    
    .doc_icons li{
	float:left;
	display:inline;
	width:auto;
	background:none;
	padding:20px;
	border:0;
	margin:0;
	text-align:center;
	width:120px;
    } 

    .doc_icons li img{
	display:block;
	margin:0 auto;
    }

    .doc_icons li:hover{ 
    } 

    /* Photos */
    .photos{
	list-style:none;
	list-style-position:inside;
	margin:0 !important;
    }

    .photos li{
	float:left;
	margin:0 6px 6px 0;
	padding:0;
    }

    .photos li img{
	display:block;
    }

    /* Price Table */
    table.product_data{
        width:auto;
        border-collapse:collapse;
        border-spacing:0;
	padding:0;
	margin:0px 0 20px 0;
	border:0;
    }

    table.product_data td.left{
        width:auto;
	padding:0px 5px 0 0 !important; 
	border:0;
    }
     
    table.product_data td{
	padding:0px 5px !important;
	border:0;
    }    
    
    
/* Blog */
 
    /* post image */
    .box.blog .post_image{
        padding:5px 0;
    }
    
    /* Date and Categories Bar */
    .dateandcategories{
        font-size:11px;
        padding:5px 0;
        margin-bottom:4px;
        clear:both;
        display:block;
        margin:2px 0; 
	font-style: italic;
	width:680px; 
    }

    /* Links For Date and Categories */
    .box.blog .dateandcategories a{
        text-decoration: none;
    }
    
    .box.blog .dateandcategories a:hover{
        text-decoration: none; 
    }
    
    /*comments*/
    .comment{ 
	margin-left:5px;
	padding-left:5px;
	position:relative;
	display:inline;
    }

/* Play and Zoom Icon */    
    .play{ 
    }
    
    .magnifier{ 
    }


/* Paging */
    .paging {
        display:block;
        clear:both;
        overflow:hidden;
	margin:0;
	width:940px;
	position:relative;
	list-style-type:none;
    } 

     .paging li{
	display:inline;
	margin-right:5px;
	float:left;
	display:inline;
	font-size:12px;
	line-height:11px;
	background:none;
    }
    
    /* paging link*/
    .paging li a,  .paging li.active a{
       border:0;
       padding:5px 0px;
       overflow:hidden;
       width:24px;
       display:block;
       text-align:center;
       text-decoration:none;    
   }

    /* paging mouseover*/
    .paging li.active a{
	text-decoration:none; 
    }
    
    .paging li a:hover{
	text-decoration:none;   
    }
    
    /* paging under content - portfolio */ 
    #main  ul.paging{
	margin:0 0 20px 10px;
    }

    /* paging in content - blog */ 
    #main  .content ul.paging{
	margin:0;
    }    

    /* paging in content - product list */ 
   #main .content .product_list ul.paging{
	left:10px;
	margin:20px 0 0 0 !important;	
    }

/* Footer */
    #footer {
	margin:0 auto 10px auto;	
        clear:both;
	width:960px;
	clear:both;
	overflow:hidden;
	padding:0;
    }
    
    /* footer copyright text */
    #footer .part1{
        float:left;
	display:inline;
        margin:20px 10px;
        font-size:11px;
        line-height:14px; 
	padding:0;
    }
    
    /* footer navigation */
    #footer .part2{
        float:right;
	display:inline;
        margin:20px 10px;
        font-size:11px;
        line-height:14px;
    }
    
    /* footer links */
    #footer  a{
        text-decoration:none; 
    }
    #footer  a:hover{
        text-decoration:underline; 
    }
    
    .part2 ul li{
	list-style:none;
	list-style-position:outside;
	line-height:12px;
	float:left;
	padding:15px 10px 15px 13px; 
    }

    /* Social media icons */
    #footer .social_media_icons{
        display:block;
        margin:5px 0 0 0;
        font-size:11px; 
    }

    
    
/* Links */	 
    a{
        text-decoration:underline; 
    }
    
    a:hover{
        text-decoration:none; 
    }

/* Headings*/
    h1,h2,h3,h4,h5,h6{
        letter-spacing:0px;
        font-weight:normal;
        position: relative;
        padding: 0 0 10px 0;
        font-family: 'Trebuchet MS', 'Arial', Helvetica, san-serif;               
        font-weight:normal;	
    }
    
    h1{
        font-size: 34px;
        line-height:54px;
    }
    
    h2{
        font-size: 26px;
        line-height:36px;		
    }
    
    h3{
        font-size: 24px;
       line-height:32px;
    }
    
    h4{
        font-size: 20px;
        line-height:30px;			
    }
    
    h5{
        font-size: 18px;
        line-height:27px;		
    }
    
    h6{
        font-size: 16px; 
        line-height:24px;	
    }

    /*	heading colors and links  */
    h1,h2, h1 a, h2 a{ 
	text-decoration:none;
    }
    
    h3, h4,h5,h6, h3 a, h4 a, h5 a, h6 a{ 
	text-decoration:none;
    }

    h1 a:hover,h2 a:hover,h3 a:hover,h4 a:hover,h5 a:hover,h6 a:hover{
        text-decoration:none; 
    }    

/* Highlighted Texts */

    /*Thene default color*/
    span.htext{ 
	padding:3px 4px;	
    }
    
    /*yellow*/
    span.yellow{ 
	padding:3px 4px;
    }

    /*black*/
    span.black{ 
	padding:3px 4px;	
    }

    /*red*/
    span.red{ 
	padding:3px 4px;	
    }    


/* Lists */
 
    /* Lined lists */
    #main ul.lined, #main ol.lined{
        list-style:none;
        list-style-position:outside;
        margin:0px 0px 20px 0px; 
	padding:5px 0 0 0 ;
    }        

    #main ul.lined li, #main ol.lined li{ 
	padding:6px 0 16px 0;
	margin:0;
	line-height:120%;
    }

    #main ul.lined ul li, #main ol.lined ul li{
	background:none;
	padding:6px 0 10px 0;
	margin:0;
	line-height:120%;
    }
    
    #main ul.lined ul, #main ol.lined ol{ 
        margin:10px 0px 0px 0px;
	padding:10px 0 0 15px ; 
    }

    #main ul.lined ul ul, #main ol.lined ol ol{ 
	background:none;
    }

    /* content lists */
    #main ul, #main ol{
        list-style-position:inside;
        margin:0px 0px 20px 0px;
    }
    
    #main ul ul, #main ol ol{
        list-style-position:inside;
        padding:0 10px;
        margin:0px 0px 0px 0px;
    }
    
    #main ul ul li, #main ol ol li{
        list-style-position:inside;
        padding:0px 10px 0px 10px;
        margin:5px 0px 5px 0px;
    }
    

/* Sidebar Menu */ 
    .sidebar .box.four ul.sub_navigation  {
	list-style:none;
        list-style-position:outside  !important;
        margin:0px;
    }

    .sidebar .box.four ul.sub_navigation li { 
	padding:10px 0 10px 10px;
	position:relative;
	left:-17px;
	width:230px;
    }
    
    .sidebar .box.four ul.sub_navigation li.current_page_item {
 	left:-21px; 
    }

    .sidebar .box.four ul.sub_navigation li a{
	position:relative;
	display:block;
	text-decoration:none; 
	padding-left:10px;
    }

    .sidebar .box.four ul.sub_navigation li:hover a{ 
    }

    .sidebar .box.four ul.sub_navigation li:hover{
	left:-21px; 
    }


    /* Second level menu */
    .sidebar .box.four ul.sub_navigation ul {
	list-style:none;
        list-style-position:inside  !important;
        margin:15px 0 0 0 !important;
    }

    .sidebar .box.four ul.sub_navigation li ul li {
	background:none;
	padding:0 0 5px 5px !important;
	position:relative;
	left:0;
	width:auto;
    }

    .sidebar .box.four ul.sub_navigation li ul li a{
	position:relative;
	display:block;
	text-decoration:none; 
	padding-left:12px; 
    }

    .sidebar .box.four ul.sub_navigation li ul li:hover{
	left:0px; 
    }

    .sidebar .box.four ul.sub_navigation li ul li a:hover{ 
	text-decoration:underline;
    }    
    
/* Tables */
    table{
        width:auto;
        border-collapse: separate;
        border-spacing: inherit;
	margin:0; 
	padding:0px;
    }
    
    table caption strong{
        text-align:left;
        font-size: 14px;
        font-weight: normal;
        line-height:20px;
        font-weight:bold;
    }
    
    table caption{
        text-align:left;
        padding: 10px;
    }
    
    table th {
        padding: 13px; 
        font-size: 12px; 
    }
    
    table tr {
    }
    
    table td {
        padding: 10px;
        text-align: left;
	margin:10px; 
	font-size:12px;
    }
    
    table tr.dark { 
    }
 

 /* Forms */
    input, select, textarea{
	font-family: Arial, Helevtica, Verdana, san-serif;
        font-size:13px;
        position:relative;
        outline: none;
        padding:4px;
        margin-right:1px;  
    }

    form ul, form li{
        list-style-type:none;
        list-style-position:outside;                
        border:0;
        margin:0;
        padding:0;
    }
    
    form ul li {
        margin:0px 0 4px 0px;
        padding:4px 0 4px 0px;
    }

    .button{ 
        cursor:pointer; 
	width:130px !important;
	height:27px;
        clear:both;
        border:none;
        overflow:visible;
        outline: none;
	position:relative; 
	padding:0 0 4px 0 !important; 
    }
    
    .button:hover{
	outline: none;
        overflow:visible;  	
    }
    
 
    /* form field widths */ 
    input, select{
        width:300px;
    }
    
    textarea{
        width:500px;
	overflow:auto;
    }
    
    /* form field widths for sidebar*/ 

    .sidebar input, .sidebar  select{
        width:210px;
    }
    
    .sidebar textarea{
        width:210px;
	overflow:auto;
    }
    
/*contact form validation*/
    #validate_form label{
	display: block; 
    }
    
    #validate_form label.error { 
        border: 0;
    }
    
    #validate_form .error{  
    }
    
/* Form Messages*/
    .ok_box{
        padding:20px;
        margin:10px auto;
        font-size:13px;  
    }    

    .ok_box h3{
        font-size:18px; 
    }    
    .error_box, #loader{
        padding:20px;
        margin:10px auto;
        font-size:13px;  
    }
     
   
/* Text Elements */

    /* Standart block quote */
    blockquote {
        font-size:16px;
        line-height: 24px;
        padding:20px 20px 0 20px;
        margin:0px 0px 20px 0;
        font-style:italic;
        font-family:"Georgia","Times New Roman", sans-serif;  
    }

    /* right-side pull quote */
    blockquote.pullright{
	width:300px;
	float:right; 
        padding:20px 0 0 20px;
	margin:0px 0 20px 20px; 
    }

    /* left-side pull quote */
    blockquote.pullleft{
	width:300px;
	float:left;
	display:inline;
	margin:0px 20px 20px 0;
        padding:20px 20px 0 0;  
	border-left:0px;
    }
    
    blockquote em, blockquote i, blockquote cite {
        font-style:normal;
    }
    
    pre {
        line-height:18px;
        margin-bottom:18px;
    }
    
    code {  
	display:block;
	margin:0 0 20px 0;
	padding:0 10px;
	font-weight:normal;
	font-size:12px;
	font-family:"Courier New", Courier, Consolas, Monospace;
	line-height:18px;
	overflow:auto; 
	white-space:pre;
    }
    
    ins {
        text-decoration:none;
    }
    
    sup {
        bottom: 1ex;
    }
    
    sub {
        top: .5ex;
    }
    
    p {
        padding-bottom:20px;
    }


/*
    Product Detail Slider
*/

/*
	jQuery Coda-Slider v2.0 - http://www.ndoherty.biz/coda-slider  Copyright (c) 2009 Niall Doherty
	This plugin available for use in all personal or commercial projects under both MIT and GPL licenses.
*/

/* Most common stuff you'll need to change */
	.product-slider h2{ display:none;}
	.product-slider-wrapper { padding: 0px 0; margin:0px 0 20px 0;}
	.product-slider { padding:0; margin:10px 0;}
	
	/* Use this to keep the slider content contained in a box even when JavaScript is disabled */
	.coda-slider-no-js .product-slider { height: 200px; overflow: auto !important; padding-right: 20px }
	
	/* Change the width of the entire slider (without dynamic arrows) */
	.product-slider, .product-slider .panel { width: 450px;overflow:hidden; } 
	
	/* Change margin and width of the slider (with dynamic arrows) */
	.product-slider-wrapper.arrows .product-slider, .product-slider-wrapper.arrows .product-slider .panel { width: 400px }
	.product-slider-wrapper.arrows .product-slider { margin: 0 10px }
	
	/* Arrow styling */
	.coda-nav-left a, .coda-nav-right a { padding: 5px; width: 100px }
	
	/* Tab nav */
	.coda-nav ul li a.current, .coda-nav ul li a:hover {padding:5px 10px 5px 10px;background:none;}
 
	/* Panel padding */
	.product-slider .panel-wrapper { padding: 0px; width:460px;margin:0;display:block;}
	
	/* Preloader */
	.product-slider p.loading { padding: 0px; text-align: center }

/* Don't change anything below here unless you know what you're doing */

	/* Tabbed nav */
	.coda-nav ul { clear: both; display: block;  margin: 0 0 20px 0 !important; overflow: hidden; }
	.coda-nav ul li { display: inline; }
	.coda-nav ul li a {padding:5px 10px 5px 13px;display: block; float: left; margin-right: 1px; text-decoration: none}
	
	/* Miscellaneous */
	.product-slider-wrapper { clear: both; overflow: auto }
	.product-slider { float: left; overflow: hidden; position: relative }
	.product-slider .panel { display: block; float: left }
	.product-slider .panel-container { position: relative }
	.coda-nav-left, .coda-nav-right { float: left }
	.coda-nav-left a, .coda-nav-right a { display: block; text-align: center; text-decoration: none }
	

/*
    Jquery Tabs
*/

ul.tabs {
	margin: 0;
	padding: 0;
	float: left;
	list-style: none;
	height: 32px; /*--Set height of tabs--*/
	border-bottom: 1px solid #999;
	/*
	//border-left: 1px solid #999;
	*/
	width: 467px;
}
ul.tabs li {
	float: left;
	margin: 0;
	padding: 0;
	height: 31px; /*--Subtract 1px from the height of the unordered list--*/
	line-height: 31px; /*--Vertically aligns the text within the tab--*/
	border: 1px solid #999;
	/*
	//border-left: none;
	*/
	margin-bottom: -1px; /*--Pull the list item down 1px--*/
	overflow: hidden;
	position: relative;
	background: #e0e0e0;
}
ul.tabs li a {
	text-decoration: none;
	color: #000;
	display: block;
	font-size: 1.2em;
	padding: 0 20px;
	border: 1px solid #fff; /*--Gives the bevel look with a 1px white border inside the list item--*/
	outline: none;
}
ul.tabs li a:hover {
	background: #ccc;
}
html ul.tabs li.active, html ul.tabs li.active a:hover  { /*--Makes sure that the active tab does not listen to the hover properties--*/
	background: #fff;
	border-bottom: 1px solid #fff; /*--Makes the active tab look like it's connected with its content--*/
}

.tab_container {
	/*
	//border: 1px solid #999;
	*/
	border-top: none;
	overflow: hidden;
	clear: both;
	float: left; width: 450px;
	background: #fff;
}
/*
.tab_content {
	//padding: 20px;
	font-size: 1.2em;
}
*/

/* Bar graph */

.block {
	width: 200px;
	/*margin: 0px auto;*/
}
.block a {
	display: block;
	padding: 5px;
	margin-bottom: 2px;
	background-color: #666;
	color: #fff;
	text-decoration: none;
}
.block a:hover {
	background: #269BC6;
	color: #fff;
}

/* end bar graph */

/* button */
#dark{
	background-color:#333;
	border:1px solid #000;
	padding:10px;
	margin-top:20px;}
	
#light{
	background-color:#FFF;
	border:1px solid #dedede;
	padding:10px;
	margin-top:20px;}	
	
#header ul, #header li{ 
	list-style:none;
	padding-top:10px;
	padding-bottom:10px;
	}	

.button, .button:visited {
	background: #222 url(../images/overlay.png) repeat-x; 
	display: inline-block; 
	padding: 5px 10px 6px; 
	color: #fff; 
	text-decoration: none;
	-moz-border-radius: 6px; 
	-webkit-border-radius: 6px;
	-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.6);
	text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
	border-bottom: 1px solid rgba(0,0,0,0.25);
	position: relative;
	cursor: pointer
}
 
	.button:hover							{ background-color: #111; color: #fff; }
	.button:active							{ top: 1px; }
	.small.button, .small.button:visited 			{ font-size: 11px}
	.button, .button:visited,
	.medium.button, .medium.button:visited 		{ font-size: 13px; 
												  font-weight: bold; 
												  line-height: 1; 
												  text-shadow: 0 -1px 1px rgba(0,0,0,0.25); 
												  }
												  
	.large.button, .large.button:visited 			{ font-size: 14px; 
													  padding: 8px 14px 9px; }
													  
	.super.button, .super.button:visited 			{ font-size: 34px; 
													  padding: 8px 14px 9px; }
	
	.pink.button, .magenta.button:visited		{ background-color: #e22092; }
	.pink.button:hover							{ background-color: #c81e82; }
	.green.button, .green.button:visited		{ background-color: #91bd09; }
	.green.button:hover						    { background-color: #749a02; }
	.red.button, .red.button:visited			{ background-color: #e62727; }
	.red.button:hover							{ background-color: #cf2525; }
	.orange.button, .orange.button:visited		{ background-color: #ff5c00; }
	.orange.button:hover						{ background-color: #d45500; }
	.blue.button, .blue.button:visited		    { background-color: #2981e4; }
	.blue.button:hover							{ background-color: #2575cf; }
	.yellow.button, .yellow.button:visited		{ background-color: #ffb515; }
	.yellow.button:hover						{ background-color: #fc9200; }

/* end button */


/*navigation rizky */

#nav {
	color: #666;
	margin: 0;
	padding: 7px 6px 0;
	line-height: 100%;


}
#nav li {
	margin: 0 5px;
	padding: 0 0 8px;
	float: left;
	position: relative;
	list-style: none;
	z-index: 55;
}
/* main level link */
#nav a {
	font-weight: bold;
	color: #e7e5e5;
	text-decoration: none;
	display: block;
	padding:  8px 20px;
	margin: 0;
	-webkit-border-radius: 1.6em;
	-moz-border-radius: 1.6em;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .3);
}
/* main level link hover */
#nav .current a, #nav li:hover > a {
	background: #d1d1d1; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ebebeb', endColorstr='#a1a1a1'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#a1a1a1)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #ebebeb,  #a1a1a1); /* for firefox 3.6+ */

	color: #444;
	border-top: solid 1px #f8f8f8;
	-webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
	-moz-box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
	box-shadow: 0 1px 1px rgba(0, 0, 0, .2);
	text-shadow: 0 1px 0 rgba(255, 255, 255, .8);
	padding : 15px;
	z-index: 55;
}
/* sub levels link hover */
#nav a {
	color: #333;
}
#nav ul li:hover a, #nav li:hover li a {
	background: none;
	border: none;
	color: #666;
	-webkit-box-shadow: none;
	-moz-box-shadow: none;
	z-index: 55;
}
#nav ul a:hover {
	background: #0399d4 !important; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#04acec', endColorstr='#0186ba'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba)) !important; /* for webkit browsers */
	background: -moz-linear-gradient(top,  #04acec,  #0186ba) !important; /* for firefox 3.6+ */

	color: #fff !important;
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	text-shadow: 0 1px 1px rgba(0, 0, 0, .1);
	z-index: 55;
}
/* level 2 list */
#nav ul {
	background: #ddd; /* for non-css3 browsers */
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cfcfcf'); /* for IE */
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#cfcfcf)); /* for webkit browsers */
	background: -moz-linear-gradient(top,  #fff,  #cfcfcf); /* for firefox 3.6+ */

	display: none;
	margin: 0;
	padding: 0;
	width: 185px;
	position: absolute;
	top: 35px;
	left: 0;
	border: solid 1px #b4b4b4;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
	-moz-box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
	box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
	z-index: 55;
}
/* dropdown */
#nav li:hover > ul {
	display: block;
}
#nav ul li {
	float: none;
	margin: 0;
	padding: 0;
	z-index: 55;
}
#nav ul a {
	font-weight: normal;
	text-shadow: 0 1px 1px rgba(255, 255, 255, .9);
}
/* level 3+ list */
#nav ul ul {
	left: 181px;
	top: -3px;
}

/* clearfix */
#nav:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
#nav {
	display: inline-block;
}
html[xmlns] #nav {
	display: block;
}
* html #nav {
	height: 1%;
}

/* end navigation rizky */


/* load more rizky */

ol.row {
	list-style:none
}
ol.row li {
	position:relative;
	border-bottom:1px solid #EEEEEE;
	padding:8px;
}
ol.row li:hover {
	background-color:#F7F7F7;
}
ol.row li:first-child {
}
.load_more {
	background-color:#FFFFFF;
	background-image:url("images/more.gif");
	background-position:left top;
	background-repeat:repeat-x;
	border-color:#DDDDDD #AAAAAA #AAAAAA #DDDDDD;
	border-style:solid;
	border-width:1px;
	display:block;
	font-size:14px;
	font-weight:bold;
	height:22px;
	line-height:1.5em;
	margin-bottom:6px;
	outline:medium none;
	padding:6px 0;
	text-align:center;
	text-shadow:1px 1px 1px #FFFFFF;
	width:95%;
}
.load_more {
	-moz-border-radius:5px 5px 5px 5px;
}
.load_more:hover {
	background-position:left -78px;
	border:1px solid #BBBBBB;
	text-decoration:none;
}
.load_more:active {
	background-position:left -38px;
	color:#666666;
	text-decoration:none;
}
img {
	border : none;
}

/* end rizky load more */

/* bbcode. */ span.acronym { border-bottom:1px dashed darkgreen; } span.acronym:hover { color: lightgreen; border-bottom:1px dashed green; } /* Make spoilers invisible, so that you need to select them with the mouse. */ span.spoiler { background-color: gray; color: gray; } /* Align columns to the top, and add some space between them. */ table.bbcode_columns { border-collapse: collapse; margin-top: 1em; margin-bottom: 1em; } table.bbcode_columns td.bbcode_column { padding: 0 1em; vertical-align: top;} table.bbcode_columns td.bbcode_firstcolumn { border-left: 0; padding-left: 0; } /* Wrap quotes in a big red box. */ div.bbcode_quote { border: 1px solid darkred; margin: 0.5em 0; } div.bbcode_quote_head { background-color: darkred; color: white; font-weight: bold; padding: 0.25em 0.5em; } div.bbcode_quote_head a:link { color: yellow; } div.bbcode_quote_head a:visited { color: yellow; } div.bbcode_quote_head a:hover { color: white; text-decoration: underline; } div.bbcode_quote_head a:active { color: white; text-decoration: underline; } div.bbcode_quote_body { background-color: #333; color: white; padding: 0.5em 1em; } /* Wrap code in a big red box. */ div.bbcode_code { border: 1px solid darkred; margin: 0.5em 0; } div.bbcode_code_head { background-color: darkred; color: white; font-weight: bold; padding: 0.25em 0.5em; } div.bbcode_code_body { background-color: #333; color: white; font: 8pt monospace; padding: 0.5em 0.5em; }




/* list image inline */

#spnsrlist {
	list-style: none outside none;
	margin:0;
	padding: 10px 0 15px;
}

#spnsrlist li {
	display: inline;
	float:left;
	margin: 0 0 15px 15px;
}

#spnsrlist li img{
	display: block;
	margin: 0 0 -2px;
}

#spnsrlist li br{
	display: none;
}

/* /list image inline */


/* follow member */

	.follow_b
{
	border:#dedede solid 2px;
	background-color:#f5f5f5;
	color:#000;
	font-size:12px;
	font-weight:bold;
	padding-left:4px ;
	padding-right:4px ;
	-moz-border-radius: 6px; -webkit-border-radius: 6px; 

}
.youfollowing_a
{
	font-size:11px; color:#000; font-weight:bold;
}
.youfollowing_b
{
	font-size:10px; color:#006600; font-weight:bold;
}
.remove_b
{
	border:#dedede solid 2px;
	background-color:#f5f5f5;
	color:#CC3333;
	font-size:12px;
	padding-left:4px ;
	padding-right:4px ;
	font-weight:bold;
	/*margin-left:30px;*/
	-moz-border-radius: 6px; -webkit-border-radius: 6px; 
}
/* /follow member*/

/* pagination 29/11/2010 */

#page_navigation a{
	border: 1px solid #DDDDDD;
	padding:5px;
	margin:2px;
	color:#A3A3A3;
	text-decoration:none;
	width:24px;
	line-height:30px;

}
.active_page{
	background:#269BC6;
	color:white !important;
}

/* end pagination */ 

/* mungkin kamu suka */

#suka{
 height:140px;
 width:220px;
 overflow:hidden;
}

#suka div{
 border:0; margin:0; padding:0; list-style:none;
}
 
 #suka div{
  height:140px;
  padding-top:5px;
  list-style:none;
  
 }
  #suka a{
   text-decoration:none;
   
  }
  #suka .del
  {
  float:right; 
  font-weight:bold; 
  color:#666666;
  margin-top:-13px;
  margin-left: -25px;
  }
  #suka .del a
  {
  background-color:#269BC6;
  padding-left:1px;
  padding-right:1px;
  color:#ffffff;
  
  }
  #suka .del a:hover
  {
  background-color:#269BC6;
  padding-left:1px;
  padding-right:1px;
  color:#ffffff;
  }
 
/* End mungkin kamu suka */

#wrapperblog {

    text-align: left;

    margin: 0px auto;

    padding: 0px;

    border:0;

    width: 760px;

    height: 160px;

    background: url("bg-blog.jpg") no-repeat;

}



#side-a {

    float: left;

    width: 350px;

}



#myBlog-wrap #side-a h3{

    float: left;

    font-size: 12px;

    margin-top: 12px;

    margin-left: 25px;

    color: #fff;

}



#side-b { 

    margin: 0;

    float: left;

    width: 410px;

    height: 1%;

}



#side-a .content{ 

    margin: 0;

    font-size: 11px;

    float: left;

    margin-top: 30px;

    margin-left: 22px;

    width: 350px;

    color: #033551;

}



#myBlog-wrap #side-b h3{

    float: left;

    font-size: 12px;

    margin-top: 12px;

    margin-left: 70px;

    color: #fff;

}



#side-b .content{ 

    margin: 0;

    float: left;

    font-size: 11px;

    margin-top: 30px;

    margin-left: 55px;

    width: 410px;

    height: 1%;

    color: #033551;

}



img.floatLeft { 

    float: left; 

    margin: 5px; 

}



/* Content */

#content {

  margin: 0 auto;

  position: relative;

  overflow: visible;

}

  #page {

    float: left;

    position: relative;

    z-index: 1;

  }

  #content .single_post {

    background: none;

    border: none;

  }

    #page .page_inner {

      float: left;

      border-top: 1px solid #fefefe;

    }

    #content .single_post .page_inner {

      border-top: none;

      background: none;

    }

    #content .single_post .post_inner {

      border: 1px solid #ddd;

      border-bottom: none;

      position: relative;

      background: #fff url(images/global/corner_gradient.png) no-repeat 665px 1px;

    }

    #content .single_post .extra_posts {

      border-top: none !important;

      margin-bottom: 40px;

    }


       /* The Author */

        #page .question .left {

          float: right;

          width: 350px;

          /*padding-left: 55px;*/

          position: relative;

        }

          #page .left .avatar {

            display: block;
            left: 0;
            top: 0;
			z-index: -1;

          }

          #page .left h5 a {

            color: #000;

          }

          #page .left h5 a:hover {

            text-decoration: underline;

          }

            #page .left div {

              background: #f2f2f2;

              width: 270px;

              padding: 15px;

              position: absolute;

              left: 5px;

              top: 55px;

              border: 1px solid #d3d3d3;

              display: none;

              font-size: 12px;
			  z-index: 999;

            }

            #page div:hover.left div {

              display: block;

              z-index: 999;

              color: #4f4e4e;

              font-size: 13px;

              line-height: 20px;

            }

              #page .left div a {

                margin: 0;

              }

              #page .left div span.arrow {

                width: 0;

                height: 0;

                line-height: 0;

                border-bottom: 7px solid #f2f2f2;

                border-right: 7px solid transparent;

                border-left: 7px solid transparent;

                position: absolute;

                top: -7px;

                left: 27px;

              }
			  
.requiredfield {
	color: #FF0000;
	font-weight: bold;
}

.requireddone {
	color: #777;
}


/* Megahover kanal */
ul#navkanal {
        margin: 0; padding: 0;
        /*width: 100%;*/
        list-style: none;
        font-size: 1.1em;
        position:absolute;
        top: 40px;
        right:400px;
        z-index:99;
        font-size:12px;
}
ul#navkanal li {
        float: right;
        margin: 0; padding:0;
        position: relative;
}
ul#navkanal li a {
        float: right; 
        text-indent: -9999px;
        height: 44px;
}
ul#navkanal li:hover a, ul#navkanal li a:hover { background-position: left bottom; }
ul#navkanal a.products {
        background: url(../images/nav_products.png) no-repeat;
        width: 117px; 
}
ul#navkanal li .sub {
        position: absolute;     
        top: 44px; left: -280px;
        background: #22bee2 repeat-x;
        padding: 15px 15px 15px;
        width:680px;
        float: left;
        -moz-border-radius: 10px;
        -webkit-border-radius :10px;
        border-radius: 10px;
        display: none;
        overflow: hidden;
}
ul#navkanal li .row {clear: both; float: left; width: 100%; margin-bottom: 10px;}
ul#navkanal li .sub ul{
        list-style: none;
        margin: 0; padding: 0;
        width: 100px;
        float: left;
}
ul#navkanal .sub ul li {
        width: 100%;
        color: #fff;
}
ul#navkanal .sub ul li h2 {
        padding: 0;  margin: 0;
        font-size: 1.3em;
        font-weight: normal;
}
ul#navkanal .sub ul li h2 a {
        padding: 5px 0;
        background-image: none;
        color: #269BC6;
}
ul#navkanal .sub ul li a {
        float: left; 
        text-indent: 0; /*--Reset text indent--*/
        height: auto;
        padding: 5px 5px 5px 5px;
        display: block;
        text-decoration: none;
        color: #fff;
}
ul#navkanal .sub ul li a:hover {color: #fff; font-weight: bold; background-position: 5px 12px ;}

/* End kanal */


/* Slider Up down */

.clear {overflow:auto;}
#vertical, #horizontal {
	margin:0 auto;
	width:909px;
}
#vertical div, #horizontal div {
	margin-right:3px;
	float:left;
	width:296px;
	height:300px;
	border:1px solid #eaeaea;
	position:relative;
	overflow:hidden;
}
#vertical img, #horizontal img {
	position:absolute;
}

/* End Slider Up down */