/*
Theme Name: Orango
Theme URI: http://fikrirasyid.com
Description: Personal Kickass theme in Orange
Version: 1.0
Author: Bloggingly
Tags: Personal, Two Column, Orange, Batik, Grunge
*/

/* Import */
@import url('reset.css');
@font-face {font-family:"museo700"; src:url("fonts/Museo700-Regular.otf") format("opentype");}
@font-face {font-family:"museo500"; src:url("fonts/Museo500-Regular.otf") format("opentype");}

/* Global Element */
body			{background: url(images/expero2.png) 0 283px repeat-x #C9B377; font-family:verdana; font-size:11px;}
a					{color:#B9340B; text-decoration:none;}
a:hover		{color:#E34E21;}
h1,h2,h3,
h4,h5,h6	{font-weight:normal;}

/* Wrapper - Container */
.wrapper	{float:left; width:100%;}
.wrap			{margin:0 auto; width:960px;}

/* Main Area */
#header:after{ 
   content: ".";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;

}
#main:after{ 
   content: ".";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;

}
#body			{background:#E6E0B0; float:right; margin:10px 0 20px 10px; width:630px;}
#full-body{background:#E6E0B0; float:right; margin:10px 0 20px 10px; width:950px;}
#sidebar	{float:left; margin:10px 0 10px 0; width:310px;}
#footer		{padding:10px 0;}

#main-wrapper	{background:url(images/expero3.png) bottom repeat-x;}

/* Tool Bar */
#wrapper-tool-bar	{width:100%; position:fixed; bottom:10px;}
#tool-bar					{background:url(images/toolbar-bg.png) repeat-x; font-family:arial; font-size:14px; height:36px; margin:0 auto; width:90%; position:relative;}

#tool-bar-category		{background:url(images/images.png) 75px 8px no-repeat;}
#tool-bar-share				{background:url(images/images.png) 117px -18px no-repeat;}
#tool-bar-contact			{background:url(images/images.png) 109px -46px no-repeat;}
#tool-bar-subscribe		{background:url(images/images.png) 113px -221px no-repeat;}
#tool-bar-archive			{background:url(images/images.png) 55px -195px no-repeat;}

#tool-bar a:hover			{-moz-box-shadow: 0 0 10px #333; -webkit-box-shadow: 0 0 10px #333; box-shadow: 0 0 10px #333;}

ul.topnav 		{background:url(images/images.png) -515px -231px no-repeat; float: left; height:28px; margin:0 0 0 -11px; padding:4px 0 4px 12px;}
ul.topnav li 	{float: left; position: relative;}
ul.topnav li a{color:#333; border-right:1px solid #afafaf; padding:7px 35px 6px 15px;	display: block;}
.subnav 			{position: absolute; display: none; float: left;	width: 170px; bottom: 29px;}
.subnav li		{clear: both;}
ul.subnav li a{background:#222; color:#fff; float: left; border-right:none; width: 130px;}
.subnav li a:hover	{background:#effeff; color:#222;}

.subnav .bookmark		{padding-left:40px; background:url(images/images.png) -500px 5px no-repeat #222;}
.subnav .delicious	{padding-left:40px; background:url(images/images.png) -499px -17px no-repeat #222;}
.subnav .email			{padding-left:40px; background:url(images/images.png) -499px -313px no-repeat #222;}
.subnav .facebook		{padding-left:40px; background:url(images/images.png) -499px -40px no-repeat #222;}
.subnav .feed				{padding-left:40px; background:url(images/images.png) -499px -335px no-repeat #222;}
.subnav .koprol			{padding-left:40px; background:url(images/images.png) -499px -63px no-repeat #222;}
.subnav .linkedin		{padding-left:40px; background:url(images/images.png) -499px -86px no-repeat #222;}
.subnav .lintasberita	{padding-left:40px; background:url(images/images.png) -499px -109px no-repeat #222;}
.subnav .plurk			{padding-left:40px; background:url(images/images.png) -499px -132px no-repeat #222;}
.subnav .slideshare	{padding-left:40px; background:url(images/images.png) -499px -155px no-repeat #222;}
.subnav .twitter		{padding-left:40px; background:url(images/images.png) -499px -178px no-repeat #222;}
.subnav .youtube		{padding-left:40px; background:url(images/images.png) -499px -201px no-repeat #222;}

.subnav .bookmark:hover		{padding-left:40px; background:url(images/images.png) -500px 5px no-repeat #effeff;}
.subnav .delicious:hover	{padding-left:40px; background:url(images/images.png) -499px -17px no-repeat #effeff;}
.subnav .email:hover			{padding-left:40px; background:url(images/images.png) -499px -313px no-repeat #effeff;}
.subnav .facebook:hover		{padding-left:40px; background:url(images/images.png) -499px -40px no-repeat #effeff;}
.subnav .feed:hover				{padding-left:40px; background:url(images/images.png) -499px -335px no-repeat #effeff;}
.subnav .koprol:hover			{padding-left:40px; background:url(images/images.png) -499px -63px no-repeat #effeff;}
.subnav .linkedin:hover		{padding-left:40px; background:url(images/images.png) -499px -86px no-repeat #effeff;}
.subnav .lintasberita:hover	{padding-left:40px; background:url(images/images.png) -499px -109px no-repeat #effeff;}
.subnav .plurk:hover			{padding-left:40px; background:url(images/images.png) -499px -132px no-repeat #effeff;}
.subnav .slideshare:hover	{padding-left:40px; background:url(images/images.png) -499px -155px no-repeat #effeff;}
.subnav .twitter:hover		{padding-left:40px; background:url(images/images.png) -499px -178px no-repeat #effeff;}
.subnav .youtube:hover		{padding-left:40px; background:url(images/images.png) -499px -201px no-repeat #effeff;}

#notification-wrapper				{background:url(images/images.png) 149px -108px no-repeat; float:right; margin:0 -12px 0 0; height:36px;}
#tool-bar-notification			{background:url(images/images.png) 120px -70px no-repeat;  border-left:1px solid #afafaf; color:#333; float:right; margin:4px 15px 0 0; padding:7px 35px 6px 15px;}
.my-sticky-class						{background:rgba(18, 4, 1, 0.8); color:#efefef; width:350px; padding:10px; position:fixed; bottom:50px; right:5%;-moz-box-shadow: 0 0 10px #333; -webkit-box-shadow: 0 0 10px #333; box-shadow: 0 0 10px #333;}
.my-sticky-class a					{text-decoration:underline; font-style:italic; color:#effeff;}
.gritter-close							{background:url(images/images.png) 0 -147px no-repeat; float:right; width:11px; height:11px;}
.gritter-title							{font-size:15px; margin:0 0 10px 0;}


/* Top Navigation */
#topnav-wrapper	{background:#120401;}
a#topnav-home		{background:url(images/images.png) -155px 8px no-repeat; float:left; height:33px; margin:0 0 0 10px; text-indent:-999999px; width:115px;}
#topnav					{overflow:auto;}
#topnav ul			{float:right; margin:0 0 0 10px; padding:0;}
#topnav ul li		{display:inline; margin:0;}
#topnav ul li a	{color:#fff; font-size:11px; float:left; margin:0; padding:10px 10px;}
#topnav ul li a:hover	{background:#2F2F2F;}

.tipsy { padding: 5px; font-size: 10px; opacity: 0.8; filter: alpha(opacity=80); background-repeat: no-repeat;  background-image: url(images/tipsy.gif); }
  .tipsy-inner { padding: 5px 8px 4px 8px; background-color: black; color: white; max-width: 200px; text-align: center; }
  .tipsy-north { background-position: top center; }
  .tipsy-south { background-position: bottom center; }
  .tipsy-east { background-position: right center; }
  .tipsy-west { background-position: left center; }

/* Searchform */
#search-form-insider	{background:url(images/images.png) 240px -160px no-repeat; float:right; padding:0 10px 0 0;}
#s							{float:right; margin:5px 10px; width:220px;}

/* Header */
#header-wrapper	{background:url(images/experobatik3.png) #B9340B;}
#site-icon			{margin:0 70px 0 10px;}
#site-icon:after{ 
   content: ".";
   visibility: hidden;
   display: block;
   height: 0;
   clear: both;

}
#site-icon p		{clear:both;}
#site-name			{background:url(images/images.png) 0 -267px no-repeat;  height:55px; width:525px; font-style:italic; font-size:32px; float:right; margin:60px 0 20px 0; text-indent:-999999px;}
#site-description	{font-family:georgia; color:#4B1403; font-size:25px; font-style:italic; float:right; margin:0 0 10px 10px; text-align:right; width:575px;}
#about-me				{background:url(images/images.png) -155px -28px no-repeat; float:right; height:43px; margin:20px 0 14px 0; width:242px; text-indent:-999999px;}

#quotation			{background:url(images/quote.png) 585px bottom no-repeat; font-family:georgia; color:#4B1403; font-size:25px; font-style:italic; float:right; margin:40px 0 40px 10px; text-align:right; width:580px; padding:0 40px 20px 0; min-height:150px;}
#quotation q		{float:left; background:url(images/quote.png) -34px top no-repeat; width:530px; margin:0 0 0 0; padding:50px 0 0 50px;}
span.quotescollection_author	{font-size:15px; font-style:normal;}
span.quotescollection_source	{font-size:15px;}

/* Body */
#recent-article	{background:url(images/images.png) -154px -109px no-repeat; color:#fff; font-family:museo500, arial; font-size:20px; float:left; height:44px; margin:13px 0 0 -11px; padding:7px 0 0 50px; width:181px; text-shadow:0 0 3px #000;}

.post						{clear:both; margin:10px 70px 50px 70px;}
.post a:hover		{text-shadow:0 0 10px #BE3A0E;}

.post-date			{border-bottom:1px solid #000; font-family:georgia; letter-spacing:5px; margin:0 auto 20px auto; padding:20px 0; text-align:center; width:200px;}
.post-title			{margin:0; padding:10px 5px; font-size:24px; text-align:center;}
.post-title a		{color:#6B3918; font-family:arial; font-size:25px; font-weight:bold; line-height:35px;}
.post-title a:hover{text-shadow:0 0 10px #5f5f5f;}
.post-writer		{font-family:georgia; font-size:12px; text-align:center;}
.post-metadata	{background:#C5BE8A; margin:0 0 10px 0; font-size:11px; padding: 2px 5px; padding:5px 15px; border-left:50px solid #3E261C;}
.post-content		{font-family:verdana; color:#413527; font-size:11px; margin:25px 0 0 0; line-height:1.2; line-height:1.8; overflow:auto;}
.post-content a:hover{text-shadow:none; text-decoration:underline;}
a.more-link			{background:url(images/images.png) -155px -71px no-repeat; color:#fff; font-family:museo500, arial; font-size:20px; float:right; margin:0 0 20px 0; padding:0 0 7px 25px; height:32px; width:137px; line-height:1.8;}
a.more-link:hover{color:#fff;}
.post-content blockquote	{background:#EFEDE0; padding:10px 40px; border-left:30px solid #AE9C5B; font-size:15px; font-family:georgia; font-style:italic; margin:0 0 20px 0;}
	
#page-navigation{background:#979062; margin:20px 70px 50px 70px; padding:10px;}
#page-navigation a,
#page-navigation strong	{margin:5px;}

/* Content Styling */
.post-content p	{margin:0 0 20px 0; line-height:2.1;}
.post-content ul{padding:0 0 0 20px; list-style:disc; margin:0 0 20px 0;}
.post-content	ol{padding:0 0 0 20px; list-style:decimal; margin:0 0 20px 0;}

.post-content h1{font-size:220%; font-family:museo700, arial; margin:35px 0 0 0; color:#7F2407;}
.post-content h2{font-size:190%; font-family:museo700, arial; margin:35px 0 0 0; color:#7F2407;}
.post-content h3{font-size:160%; font-family:museo700, arial; margin:35px 0 0 0; color:#7F2407;}
.post-content h4{font-size:130%; font-family:museo700, arial; margin:35px 0 0 0; color:#7F2407;}
.post-content h5{font-size:100%; font-family:museo700, arial; margin:35px 0 0 0; color:#7F2407;}
.post-content h6{font-size:70%; font-family:museo700, arial; margin:35px 0 0 0; color:#7F2407;}

/* archive.php, search.php */
h1.full-body-title	{color:#6B3918; font-size:25px; font-family:museo500, arial; float:left; width:810px; margin:40px 70px 40px 70px; text-align:center;}
#full-body .post		{}

ol.archive-list			{float:left; padding:0 0 0 40px; list-style:decimal; font-size:16px;}
ol.archive-list li	{margin:0 0 25px 0; float:left; width:770px; font-family:georgia;}
span.archive-date		{width:185px; float:left; font-style:italic; letter-spacing:2px; font-size:11px; padding:5px 0 0 0;}
a.archive-post-title{float:left; width:544px; border-left:1px dashed #BDAF6F; padding:0 20px; line-height:1.5; font-family:arial;}

/* single.php */
.post-author		{background:#fff; margin:0 0 10px 0; float:left;}
.post-author img{float:left; margin:10px;}
.post-author p	{line-height:1.8; margin:5px 10px 10px 0;}

.single-navigation p	{margin:10px; background:#fff; padding:5px;}

/* search.php */
.search-excerpt	{background:#C9B377;}

/* comments.php */
.post-comment		{margin:60px 0 10px 0;}

#comment-title	{font-size:20px; font-family:museo500, arial; text-shadow:0 0 3px #fff; margin:0 0 20px 0;}
ol.comment-list	{}
li.comment			{margin:0 0 10px 0; clear:both;}
li.comment img.avatar				{float:left; width:50px; height:50px; background:#000;}
.comment-inside		{float:left;margin:0 0 10px 0;}
.comment-metadata	{border-bottom:1px solid #CEA45C; background:#E6E0B0; overflow:auto; padding:0 5px;}
.comment-metadata p		{margin:10px;}
.comment-content			{background:#C5BE8A; float:left; padding:10px; line-height:2;}
.comment-reply-link		{background:#fff; float:right; text-align:right; line-height:1; padding:2px 5px;}

#add-comment-title		{font-size:20px; font-family:museo500, arial; text-shadow:0 0 3px #fff; margin:0 0 10px 0;}

#respond								{float:left; margin:20px 0; width:490px;}
textarea#comment,
input.comment-input			{width:485px; margin:0 0 2px 0;}
input#submit						{float:right; margin:5px 0 0 0;}

.depth-1 .comment-content{width:400px; margin:0 0 0 20px;}
.depth-1 .comment-inside {background:url(images/images.png) 55px -325px no-repeat;}

.depth-2 .comment-content{width:390px; margin:0 0 0 30px;}
.depth-2 .comment-inside {background:url(images/images.png) 65px -325px no-repeat;}
	
.depth-3 .comment-content{width:380px; margin:0 0 0 40px;}
.depth-3 .comment-inside {background:url(images/images.png) 75px -325px no-repeat;}

.depth-4 .comment-content{width:370px; margin:0 0 0 50px;}
.depth-4 .comment-inside {background:url(images/images.png) 85px -325px no-repeat;}

.depth-5 .comment-content{width:360px; margin:0 0 0 60px;}
.depth-5 .comment-inside {background:url(images/images.png) 95px -325px no-repeat;}

.comment-author-admin .comment-metadata {background: #B9340B; border-bottom:1px solid #4B1403;}
.comment-author-admin .comment-metadata a	{color:#fff;}

li.pingback .comment-content	{width:470px; margin:0 0 10px 0;}
li.trackback .comment-content	{width:470px; margin:0 0 10px 0;}

/* Sidebar */
.widgettitle		{background:url(images/images.png) -155px -162px no-repeat; color:#fff; font-family:museo500, arial; font-size:25px; margin:-12px 0 10px 0; padding:17px 10px 25px 10px; text-align:center; text-shadow:0 0 3px #000;}
li.widget				{background:#E6E0B0; float:left; width:310px; margin:13px 0 20px 0;}
li.widget ul li	{float:left; width:310px;}
li.widget ul li a	{border-top:1px solid #4A837A; float:left; line-height:25px; padding:20px; height:100%; width:270px;}
li.widget ul li a:hover	{background:#4A837A; color:#fff; -moz-box-shadow: 0 0 10px #333; -webkit-box-shadow: 0 0 10px #333; box-shadow: 0 0 10px #333;}

.widget_tag_cloud	{overflow:auto;}
.widget_tag_cloud	a	{float:left; margin:5px 0 5px 10px;}


.widget_125_ads span{float:left; margin:0 5px 5px 5px;}
.widget_125_ads a		{float:left; width:135px; height:135px; margin:0 0 10px 10px; background:#4E8275;}
.widget_125_ads a:hover	{background:#B9340B;}
.widget_125_ads img	{float:left; width:125px; height:125px; margin:5px; background:#283231;}
a.kdads-empty				{background:url(images/emptyads.png) center center no-repeat #4E8275; text-indent:-999999px;}
a.kdads-empty:hover	{background:url(images/emptyads.png) center center no-repeat #B9340B;}

li.widget_text			{background:transparent;}
/* Footer */
#footer-wrapper	{background:#3E261C;}

#my-project							{float:left; width:310px;}
#my-project h2,
#tag-cloud h2						{color:#fff; font-family:museo500, arial; font-size:25px; margin:20px 0; text-shadow:0 0 3px #000;}
#my-project ul.blogroll li img{width:300px; height:104px; background:#fff;}
#my-project ul.blogroll li a	{background:#000; float:left; margin:0 0 10px 0; padding:5px}
#my-project ul.blogroll li a:hover			{background:#B9340B;}

#tag-cloud			{margin:0 0 0 20px; width:590px; float:left; width:590px;}
#tag-cloud span	{background:#E6E0B0; float:left; padding:20px; width:590px;}
#tag-cloud a		{font-family:arial; color:#3E261C; line-height:30px;}
#tag-cloud a:hover{text-decoration:underline;}

#credit					{color:#E6E0B0; font-family:museo500, arial; font-size:20px; font-weight:bold; float:left; margin:60px 0 50px 0; letter-spacing:-1px; width:960px; text-align:right; text-shadow:0 0 3px #000;}

/* Begin Images */
p img						{padding:0; max-width:100%;}
img.centered		{display: block; margin-left: auto; margin-right: auto;}
img.alignright	{padding: 4px; margin: 0 0 2px 7px; display: inline;}
img.alignleft 	{padding: 4px; margin: 0 7px 2px 0; display: inline;}
.alignright 		{float: right;}
.alignleft 			{float: left;}

/* Captions */
.aligncenter,
div.aligncenter {display: block; margin-left: auto; margin-right: auto;}
.wp-caption 		{border: 1px solid #efefef; text-align: center; background-color: #EFECD1; padding-top: 4px;	margin: 10px;}
.wp-caption img {margin: 0;	padding: 0;	border: 0 none;}
.wp-caption p.wp-caption-text {font-size: 11px;	line-height: 17px;	padding: 0 4px 5px;	margin: 0;}
