/*  

Theme Name: Octopus

Theme URI: http://octopusdive.org/

Description: Special for Octopus Indonesia

Version: E=MC2

Author: Octopus Indonesia

Author URI: http://www.jemuran.com



The CSS, XHTML and design is released under GPL:

http://www.opensource.org/licenses/gpl-license.php







/* HTML Elements */



* {

	margin:0;

	padding:0;

	}



body,html {

	min-height:101%;

	}

	

body {

	background: #000;

	color: #545454;

	padding: 0 0 25px 0;

        margin-top:0;

	

	}



body {

	font: 1.2em Arial, Verdana, Sans-Serif;



	}

select, input, textarea {

	font: 1.1em Arial, Verdana, Sans-Serif;



	}

	

p {	

	margin: 15px 0;

	}



a:link, a:visited {

	color: #2255AA;

	text-decoration:none;

	}



a:hover, a:active {

	color:#000;

	text-decoration:none;

	}



hr {

	display: block;

	height:1px;

	background:#333;

	border:0;

	}



small {

	font-size: 0.9em;

	background:#E5EBF5;

	padding:3px 0px;

	}



img, a:link img, a:visited img {

	border:1px;

	}

	

navigation {

	display: block;

	text-align: center;

	margin: 20px 0 20px 0;

	padding-bottom:20px;

	position:relative;

	}

	

navigation a {

	font:small;

	padding:10px;

	text-decoration:none;

	}	

	

/* Structure */



#page {

	width:800px;

	margin:0 auto;

	font-size:0.6em;

	background:#FFF;

	padding: 10px 25px 35px 25px;

	border:3px #333;

	}



#branding {

	width:615px;

	padding-bottom:3px;

	}



.left {

	float:left;

	}



.right {

	float:right;

	}



#sidebar {

	width: 200px;

	float:left

	}



#leftcol {

	width:284px;

	border-right:1px dotted #b6b6b6;

	padding-right:18px;

	}



#leftcol, #rightcol {

	float:left;

	

	}	

	

#rightcol {

	width:230px;

	padding-right:1px;

        padding-top:12px;

	float:right;

	}





		

/*Subnav */



.subnav li {

	list-style:none;

	border-bottom:1px solid #FFF;

	}



.subnav li a:link, .subnav li a:visited {

	font: 1em Arial, Helvetica, sans-serif;

	padding:2px 2px 2px 6px;

	}

		

.subnav li a:hover, .subnav li a:active {

	text-decoration:none;

	color: #2255AA;

	}



.subnav li li a:link, .subnav li li a:visited {

	border-left:none

	}

		



	

/*	Headers */





h1 {

	font:3em Verdana, Sans-Serif;

	letter-spacing:-0.02em;

	}

	

h2 {

	font: 1.6em Tahoma, Verdana, Sans-Serif;

	padding-bottom:8px;

	font-weight:bold;

	border-bottom:1px solid #333;

	margin: 20px 0;

	}



h3, #sidebar h2 {

	font: 1em Verdana, sans-serif;

	text-transform:uppercase;

	letter-spacing:0.1em;

	margin-bottom:4px;

	font-weight:bold;

	color:#5f5f5f;

	}



#sidebar h3, #sidebar h2 {

	border-top:5px solid #BBB;

	border-bottom:1px solid #BBB;

	padding:6px 0 6px 2px;

	margin:22px 0 15px 0;

	font-size:1.0em;

	}



h3#respond {

	border-top:1px dotted #b6b6b6;

	margin-top:25px;

	padding-top:20px;

	}



h3#comments {

	margin-top:32px;

	}



h4 {

	font-size:1.1em;

	margin-bottom:6px;

	}

	

h5 {

	font-size:1em;

	text-transform:uppercase;

	margin-bottom:4px;

	margin-top:4px;

	}

h6 {

	font-size:0.8em;

	margin-bottom:4px;

	margin-top:4px;

	}

h7 {

	font-size:0.8em;

        font-weight:bold;

	}

	

/* Content */



#content {

	width:565px;

	float:right;

	margin-right:2px;

	}

	

.description {

	font-size: 1em;

	font-weight: bold; 

	font-style:italic;

	color:#545454;

	margin-top:-4px;

	text-align: justify ;

	}



.feature {

	background:#f2f2f2;

	padding:15px;

	border-bottom:1px dotted #b6b6b6;

	border-top:1px dotted #b6b6b6;

	margin-right:2px;

	}



.feature:hover {

	background:#F1F6FD;

	}

	

.feature p, #rightcol p {

	margin:0;

	}



.feature img, #rightcol img {

	padding:1px;

	border:1px solid #000;

	}

			

#leadpic {

	float:left;

	margin: 0 18px 8px 0;

	}



#lead {

	margin-top:22px;

	}



.title {

	font:1.4em Tahoma, Verdana, Sans-Serif;

	font-weight:bold;

	line-height:110%;

        text-align:none;

	}

	

.feature#lead .title {

	font:1.4em Tahoma, Verdana, Sans-Serif;

	font-weight:bold;

	line-height:110%;

	display:block;

	padding-bottom:8px;

        text-align:none;

	}



#rightcol .feature {

	margin-bottom: 5px;

	border-bottom:none;

	}



#leftcol img {

	float:left;

	margin:3px 10px 4px 0;

	}



#rightcol img {

	margin-bottom: 4px;

	display:block;

	}

	

#leftcol .clearfloat {

	border-bottom:1px dotted #b6b6b6;

	padding:12px 0;

	}	



#sidelist li {

	list-style:none;

	}

	

.bullets li {

	list-style:square;

	border-bottom:1px solid #FFF;

	margin-left:20px;

	}

	

#sidelist .bullets li {

	list-style:square;

	margin-bottom:5px;

	line-height:115%;

	margin-left:20px;

	}



#sidelist .children {

	background:none;

	}

	

#sidelist .children li {

	list-style: square;

	margin-left:28px;

	}

	

#sidelist .children li a, #sidelist .children li a:visited {

	padding:2px 2px 2px 0px;

	border:0;

	color: #7F8FAB;

	}



#sidelist .children li a:hover, #sidelist .children li a:active	{				

	color:#35507E

	}

	

.post {

	margin: 0px 10px 0px 10px;

	padding-bottom:0;

	text-align: justify ;

	}



.postmetadata {

	margin: 30px 0;

	}



#writer {

	background:#F1F6FD;

	margin:25px 0 15px 0;

	padding:12px;

	}



#writer img {

	padding:1px;

	border:1px solid #2255AA;

	float:left;

	width:80px;

	}



#writer span {

	display:block;

	padding-top:4px;

	border-top:1px solid #AFC4D7;

	margin-top:12px;

    margin-left:90px; 

	}



#writer p {

	margin:0;

	width:500 px;

	}	



.entry {

	padding-bottom:28px;

	}



h3 a:link, h3 a:visited {

	color:#5f5f5f;

	}



#skymap {

	width:800px;

	display: block;

	margin-left: 30px;

	margin-right: auto;



	}



/*Post Formatting*/



.picleft {

	float:left;

	margin:3px 14px 10px 0;

	border:7px solid #f2f2f2;

	}



.picright {

	float:right;

	margin:3px 0 10px 14px;

	border:7px solid #f2f2f2;

	}	



.post blockquote {

	color:#76767a;

	background:#f2f2f2;

	padding:6px 14px;

	margin:18px 35px;

	border-right:1px solid #DDD;

	border-bottom:1px solid #DDD;

	}	



.post ul li {

	list-style:square;

	margin-bottom:5px;

	line-height:115%;

	margin-left:30px;

	margin-right:5px;

	}



.post ol li {

	margin-bottom:5px;

	line-height:115%;

	margin-left:25px;



	}

	

#tags {

	padding:3px;

	border-bottom:1px solid #DDD;

	border-top:1px solid #DDD;

	}	

				



/* Begin Images */

p img {

	padding: 0;

	max-width: 100%;

	}



/*	Using 'class="alignright"' on an image will (who would've

	thought?!) align the image to the right. And using 'class="centered',

	will of course center the image. This is much better than using

	align="center", being much more futureproof (and valid) */



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;

	}

.caption { margin: 5px; padding: 5px; border: solid 1px #E5E5FF; background: #eee; font-size:60%; color: black }



/* Form Elements */



select {

	background:#f2f2f2;

	border:1px solid #666;

	width:100%;

	}

	

#searchform {

	padding:16px 5px 0 0; 

	}



.button {

	padding: 1px;

	background:#000;

	color:#fff;

	border:none;

	}



.button:hover {

	background:#0099FF;

	color:#FFF;

	text-decoration:none;

	}



#commentform input {

	width: 170px;

	margin: 5px 5px 1px 5px;

	}



#commentform textarea {

	width: 100%;

	margin-top:5px;

	}







/* Comments*/



.commentlist {

	padding-left:1px;

	}

	

.commentlist li {

	margin: 15px 0 3px 5px;

	padding: 8px 15px 10px 15px;

	background:#F1F6FD;

	border-top: 1px solid #DCE8F8;

	}



#commentform small {

	background:#FFF;

	font-weight:bold;

	padding:0;

	}

	

.commentmetadata {

	display: block;

	}



.commentlist small {

	background:#DCE8F8;

	}



.commentlist cite {

	font: 1.1em Verdana, Sans-Serif;

	font-weight:bold;

	letter-spacing:0.05em;

	}	

	



/* Float Properties*/



.clearfloat:after {

	display:block;

	visibility:hidden;

	clear:both;

	height:0;

	content:".";

	}

	

.clearfloat {

	display:inline-block;

	}



.clearfloat {

	display:block;

	}

	





/* Footer*/



#footer {

	margin: 0 auto;

	width: 820px;

	font-size:0.55em;

	padding-top:15px;

	color:#FFF;

	}



#footer a {

	color:#d3d1d1;

	}



/* TABS */



.tabs-block {

	clear: left;

	float: left;

	width: 300px;

	padding: 0;

	margin: 0 0 10px 0;

	display: block;

	}

.tabbed {

	width: 100%;

	overflow: hidden;

	padding: 0;

	margin: 0;

	background: transparent;

	border: none;

	}

.tabbed ul.tabs {

	overflow: hidden;

	display: block;

	position: relative;

	top: 0;

	left: 0;

	z-index: 999;

	list-style-type: none;

	margin: 0;







	padding: 0;

	width: 100%;

	background: transparent;

	}

.tabbed ul.tabs li {

	display: inline;

	float: left;

	padding: 0;

	margin: 0 .3em 0 0;

	}

.tabbed ul.tabs li a {

	font-weight: bold;

	display: block;

	margin: 0;

	padding: 5px .8em;

	background: #eee;

	border: 1px solid #ccc;

	}

.tabs-block ul.tabs li a { padding: 5px .7em; }

.tabbed ul.tabs li a:hover {

	background: #f7f7f7;

	text-decoration: none;

	}

.tabbed ul.tabs li a.tab-current {

	background: #fff;

	border-bottom: 1px solid #fff;

	}

.tabs-block .tabbed div, #home .tabbed .c {

	overflow: hidden;

	display: block;

	position: relative;yy

	left: 0;

	top: -1px;

	z-index: 0;

	clear: left;

	width: 100%;

	margin: 0;

	padding: 5px 0;

	border: 1px solid #ccc;

	background: #fff;

	display: none;

	}

div.t2, div.t3, div.t4, div.t5, div.c2, div.c3, div.c4, div.c5, div.c6, div.c7, div.c8, div.c9, div.c10  { display: none; }

.tabs-block .tabbed div.t1, #home .tabbed div.c1 { 

	display: block;

	}

.tabs-block .tabbed div { width: 298px; }

.tabbed div ul {

	overflow: hidden;

	padding: 4px 0 2px 0;

	margin: 0;

	background: #fff;

	}

.tabbed div ul li {

	clear: left;

	background: transparent;

	}

.tabbed div ul li a {

	font-weight: normal;

	width: 97%;

	display: block;

	padding: 2px 0 2px 12px;

	background: transparent;

	border: none;

	}

.tabbed div ul li a:hover { text-decoration: none; }



/* HOME CATEGORIES TABS */

#home-categories {

	overflow: hidden;

	}

#home .tabbed .c {

	width: 300px;

	}

.tabbed .post {

	float: left;

	clear: none;

	width: 47%;

	margin: 5px 1%;

	padding: 0;

	}

.tabbed .post h3 {

	width: 97%;

	font-size: .95em;

	margin: 0 0 0 5px;

	padding: 0;

	}

.tabbed .post h3 a { 

	font-weight: bold;

	}

.tabbed .post .entry {

	margin: 0 0 0 5px;

	padding: 0;

	}

.tabbed .post .entry p { margin: 0; padding: 0; }



/* RECENT EXCERPTS (default style) */

.recent {

	width: 288px;

	padding: 0 5px 10px 5px;

	margin: 0 0 10px 0;

	float: left;

	background: #fff;

	border: 1px solid #ccc;

	}

.recent .post {

	float: left;

	margin: 5px 0 5px 0;

	padding: 0;

	background: transparent;

	}

.recent .post h3 { margin: 0; padding: 0; }

.recent .post h3 a {

	display: inline;

	font-size: .7em;

	font-weight: bold;

	margin: 0;

	padding: 0;

	}

.recent img, .excerpts img {

	float: left;

	width: 75px;

	height: 75px;

	margin: 5px 10px 0 0;

	}

.recent .entry {

	font-size: 1em;

	margin: 0;

	padding: 0;

	}

.recent p, .recent .entry p { margin: 0; padding: 0; }



/* 

Style Sheet code for Image Caption Easy Plugin for WordPress

Copy and Paste this code into your WordPress theme style sheet file (style.css) then upload to its location.

You can edit any of these to suit your needs.

*/

.imagecaptioneasy {

  padding: 5px;

  font-family: arial,helvetica,sans-serif;

  font-size: 10px;

  line-height: 1.15em;

  text-align: center;

  border: 1px solid #808080;

  background: #EAEAEA;

  color: #333;

}

.imagecaptioneasy img { border: 0px solid #fff; margin-bottom:5px; }

.imagecaptioneasy span { text-align: center; }

.imagecaptioneasy_top_left { margin: 0 11px 11px 0; float: left; }

.imagecaptioneasy_top_right { margin: 0 0 11px 11px; float: right; }

.imagecaptioneasy_top_nowrap { margin: 0 0 11px 0; float: none; }

.imagecaptioneasy_left { margin: 11px 11px 11px 0; float: left; }

.imagecaptioneasy_right { margin: 11px 0 11px 11px; float: right; }

.imagecaptioneasy_nowrap { margin-left: auto; margin-right: auto ; display: block;   )