@charset "utf-8";
/* CSS Document */

/* ----------------------- LAYOUT ----------------------*/
#logo {
	margin-left: 5px;
}

img {border: none; text-decoration:none;}

a {
	color: #058EDC;
	text-decoration: none;
}

a:hover { color: #EF7B08;}

p {color: #666; margin: 0; margin-bottom: 10px;text-align:justify;}

#banner {
	margin-top: 20px;
}

#header {
	background: url(../images/header.png) no-repeat;
	height: 214px;
	z-index: -1;
}

@font-face {
	font-family: 'FontinSans';
	src: url('Fontin_Sans_R_45b.otf');
}

@font-face {
	font-family: 'FontinSansBold';
	src: url('Fontin_Sans_B_45b.otf');
}

/*------------------------ TOP NAV --------------------*/
#navlist {
	width: 621px;
	height: 130px;
	overflow: hidden;
}

ul#topnav {
	margin: 0; padding: 0;
	list-style: none;
	float: left;
	width: 621px;
	text-align: center;
}

ul#topnav li {
	float: left;
	margin: 0; padding: 0;
	font-family: FontinSansBold, sans-serif;
	font-size: 34px;
	letter-spacing: -1px;
}

/*--CSS Sprites - Default State--*/
ul#topnav a {
	float: left;
	display: block;
	height: 120px; /*--Specify height of navigation--*/
	background-position: 0px 0px;
	color: #c8c6c6;
	text-decoration: none;
	padding-top: 70px;
	margin-top: 15px;
}

/*--CSS Sprites - Hover State--*/
ul#topnav a:hover, ul#topnav li.home-active a, ul#topnav li.store-active a, ul#topnav li.mice-active a {
	background-position: 0px 120px;
	color: #686868;
}

/*--Assign an image and width to each link--*/
ul#topnav li.home a, ul#topnav li.home-active a {
	background-image: url(../images/menuicon2.png);
	width: 207px;
}

ul#topnav li.store a, ul#topnav li.store-active a {
	background-image: url(../images/menuicon3.png);
	width: 207px;
}

ul#topnav li.mice a, ul#topnav li.mice-active a {
	background-image: url(../images/menuicon1.png);
	width: 207px;
}


/*------------------------- FOLLOW --------------------------*/
#follow {
	margin: 0px;
	padding: 0px;
	width: 240px;
	height: 80px;
	overflow: hidden;
}

#follow ul {
	margin: 0;
	list-style-type: none;
}

#follow ul li { float: right; }

li.twitter a {
	text-decoration: none;
	background: url(../images/twitter.png) 0px 0px;
	text-indent: -8000px; /*--Shoot the text off the page--*/
	float: left;
	margin-top: 22px;
	height: 120px;
	width: 55px;
}

li.twitter a:hover {
	background: url(../images/twitter.png) 0px 58px;
}

li.facebook a {
	text-decoration: none;
	background: url(../images/facebook.png) 0px 0px;
	text-indent: -8000px;
	float: left;
	margin-top: 22px;
	height: 120px;
	width: 55px;
}

li.facebook a:hover {
	background: url(../images/facebook.png) 0px 58px;
}

/*------------------------- SEARCH --------------------------*/
#search {
	margin-top: 0px;
	margin-right: -35px;
	float: right;
}

fieldset.search {
	border: none;
	width: 243px;
}
.search input, .search button {
	border: none;
	float: left;
}
.search input.area {
	color: #333333;
	font-size: 14px;
	width: 170px;
	height: 26px;
	padding-top: 8px;
	padding-left: 10px;
	padding-right: 0px;
	padding-bottom: 0px;
	background: url(../images/search_bg.png) no-repeat;
	margin-right: 0px;
}
.search input.area:focus {
	background: url(../images/search_bg.png) no-repeat 0 -34px;
	outline: none;
}
.search button.btn {
	margin-top: 7px;
	width: 53px;
	height: 34px;
	cursor: pointer;
	text-indent: -9999px;
	background: url(../images/search_btn.png) no-repeat 0 0;
}
.search button.btn:hover {
	background: url(../images/search_btn.png) no-repeat 0px -35px;
}

/*------------------------- CONTENT --------------------------*/
#c_top {
	background: url(../images/c_top.png) no-repeat;
	margin-left: 5px;
	width: 940px;
	height: 40px;
}

#c_middle {
	background: url(../images/c_middle.png) repeat-y;
	margin-left: 5px;
	width: 940px;
}

#c_bottom {
	background: url(../images/c_bottom.png) no-repeat;
	margin-left: 5px;
	width: 940px;
	height: 44px;
}

#content { width: 600px;}

.content { width: 415px;}

#contentinnertop {
	background: url(../images/contentinnertop.gif) no-repeat;
	margin-top: 10px;
	margin-left: -2px;
	width: 602px;
	height: 10px;
}

#contentinnermid {
	background: url(../images/contentinnermid.gif) repeat-y;
	margin-left: -2px;
	width: 602px;
}

#contentinnerbot {
	background: url(../images/contentinnerbot.gif) no-repeat;
	margin-left: -2px;
	width: 602px;
	height: 12px;
}

/*  POST */
.postmeta{clear:left;display:block;float:left;font-size:11px;padding:5px 0 20px;width:160px}

.meta-date{background: url(../images/date.gif) no-repeat 1px 0;clear:both;color:#333;display:block;height:34px;padding-top:7px;width:160px;}
.date-day{border-right:1px solid #333;display:block;float:left;font-size:30px;font-weight:700;height:20px;line-height:18px;padding-left:0px;padding-right:5px;text-align:right}
.date-month{display:block;float:left;font-size:1.2em;font-weight:700;height:12px;line-height:10px;padding-left:8px;width:90px}
.date-year{display:block;float:left;font-size:0.8em;height:10px;line-height:10px;padding-left:8px;width:90px}

.meta-author,.meta-edit,.meta-comments,.meta-categories,.meta-tags{clear:both;display:block;margin-left:10px;padding:2px 0 2px 20px;width:130px}

.meta-author{background:url(../images/author.png) no-repeat 0 0}
.meta-edit{background:url(../images/edit.png) no-repeat 0 0}
.meta-comments{background:url(../images/comments.png) no-repeat 0 0}
.meta-categories{background:url(../images/category.png) no-repeat 0 0}
.meta-tags{background:url(../images/tag.png) no-repeat 0 0}


div.calendar p span {
	color:#878181;
	display:block;
	font-size:14px;
	font-weight:bold;
	line-height:12px;
	padding:30px 10px 0;
}

/*------------------------- SIDEBAR --------------------------*/
#sidebar {
	margin-left: 15px;
	width: 250px;
}

.advert, .recent, .comment, .twit, .side {
	-moz-border-radius-topleft: 0; 
	-moz-border-radius-topright: 10px;
	-moz-border-radius-bottomleft: 0;
	-moz-border-radius-bottomright: 0;
	-webkit-border-radius: 10px; 
	border: 1px solid #058EDC; 
	padding: 5px;
	margin-top: 10px;
	margin-bottom: 5px;
	text-align: left;
}

.advert { background-color: #ABDAE1;}
.recent { background-color: #3c3c3c; }
.comment { background-color: #A7B526; }
.twit { background-color: #5E5288; }
.side { background-color: #ABDAE1; }

.advert-title, .recent-title, .comment-title, .twit-title, .widgettitle {
	height: 24px;
	text-indent: 30px;
	margin: 0px;
}

.advert-title, .widgettitle { background: url(../images/promotion.png) no-repeat;}
.recent-title {	background: url(../images/art.png) no-repeat;} 
.comment-title { background: url(../images/comment.png) no-repeat;} 
.twit-title { background: url(../images/twit.png) no-repeat;}

ul.sidebar  {list-style-type: none;padding:0;margin:0;margin-left: 1em;}

.sidebar li { 
	background: url(../images/sidebar-arrow.png) no-repeat 0 .4em;
	padding-left: 1em; 
	border-bottom: 1px dotted #CCC; 
	line-height: 20px;
	margin-top: 5px;
	margin-right: 10px;
	font-size: 12px;
}

.sidebar li a:hover {color:#fff;}

.banner {border:none; margin:0; padding:0;}

/*------------------------- FOOTER --------------------------*/
#f-top {
	background: url(../images/f-top.png) no-repeat;
	margin-left: 5px;
	width: 940px;
	height: 14px;
}

#f-mid {
	background: url(../images/f-mid.png) no-repeat;
	margin-left: 5px;
	width: 940px;
	height: 166px;
}

#f-down {
	background: url(../images/f-down.png) no-repeat;
	margin-left: 5px;
	width: 940px;
	height: 19px;
}

#col3 {clear: both; display: block; width: 230px;}
#media {position:relative; border:4px solid #ccc;}

#col4 {display: block; width: 320px; height: 100px;}
.bottommenu { width: 300px;}

#copyright {display: block; width: 297px;margin-left: 20px;}

#footer_language_list {
	margin-top: 20px;
	margin-left: 100px;
	padding: 0px;
	width: 300px;
	height: 90px;
	overflow: hidden;
}

#footer_language_list ul {
	margin: 0;
	list-style-type: none;
}

#footer_language_list ul li { float: left; }

li.id a {
	text-decoration: none;
	background: url(../images/id.png) 0px 0px;
	text-indent: -8000px; /*--Shoot the text off the page--*/
	float: left;
	height: 64px;
	width: 64px;
}

li.id a:hover {
	background: url(../images/id.png) 0px 64px;
}

li.en a {
	text-decoration: none;
	background: url(../images/uk.png) 0px 0px;
	text-indent: -8000px;
	float: left;
	height: 64px;
	width: 64px;
}

li.en a:hover {
	background: url(../images/uk.png) 0px 64px;
}


/*------------------------- BREADCRUMB --------------------------*/

#breadcrumb {
font: 11px Arial, Helvetica, sans-serif;
    background-image:url(http://justinbali.com/wp-content/themes/justinbali/images/bc_bg.png); 
    background-repeat:repeat-x;
    height:30px;
    line-height:30px;
    color:#9b9b9b;
    border:solid 1px #cacaca;
    width:596px;
    overflow:hidden;
    margin:0px;
    padding:0px;
}
#breadcrumb li {
list-style-type:none;
float:left;
padding-left:10px;
}
#breadcrumb a {
height:30px;
display:block;
background-image:url(http://justinbali.com/wp-content/themes/justinbali/images/bc_separator.png);
background-repeat:no-repeat;
background-position:right;
padding-right: 15px;
text-decoration: none;
color:#000;
}
.home {
border:none;
margin: 8px 0px;
}
#breadcrumb a:hover {
color:#35acc5;
}