/*
Theme Name: Jamu Traditional Spa
Theme URI: http://jamutraditionalspa.com/
Description: Custom WordPress theme create by Rudiarsana <a href="http://balisidenotes.com/">Balisidenotes</a>.
Version: 1.0
Author: Rudiarsana
Author URI: http://balisidenotes.com/
Tags: pink, fixed width, two columns, spa

	Kubrick v1.0
	 http://balisidenotes.com/

	This theme was designed and built by Rudiarsana,
	whose blog you will find at http://balisidenotes.com/

	The CSS, XHTML and design is released under GPL:
	http://www.opensource.org/licenses/gpl-license.php

*/



/* Begin Typography & Colors */
body,td,th {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
}
body {
	margin: 0;
	text-align: center;
	background: #663333;
}

/* main container */
#wrapper {
	width: 780px;
	margin: auto;
	text-align: left;
	background: #fff url(images/jamuspa-bg.jpg) left top no-repeat;
	padding-top: 20px;
}
#wrapper02{
	background: url(images/down-avr.gif) 13px bottom no-repeat;
	width: 780px;
	float: right;
}
#sidebar {
	width: 183px;
	margin-left: 13px;
	background: url(images/bg-menu.gif) right top no-repeat;
	text-align: center;
}
#logo {
	width: 139px;
	height: 104px;	
	padding-top: 30px;
	background: url(images/logo.gif) left bottom no-repeat;
	margin: 0 auto;
}
#navigation {
	margin-top: 30px;
	text-align: center;
	color: #fff;
	background: url(images/bg-menured.gif) left top repeat-y;
	padding: 0 15px 30px 15px;
}
#maintext {
	width: 533px;
	float: right;
	padding: 160px 20px 20px 0;
}
#maintexthome {
	width: 533px;
	float: right;
	padding: 20px 20px 20px 0;
}
#slidehome {
	width: 425px;
	height: 639px;
	margin: auto;	
}
#spacerhome {
	height: 30px;
}
#footer {
	height: 166px;
	background: url(images/jamuspa-footer.jpg) left bottom no-repeat;
	clear: both;
}
/* main container */

/* main class */
#footer ul {
	margin: 0;
	padding: 0;
}
#footer li {
	list-style: none;
	display: inline;
	padding-right: 15px;
	margin: 0;
}
/*
#navigation ul {
	margin: 0;
	padding: 0;
}
#navigation li {
	list-style: none;
	border-bottom: 1px solid #ecd0d3;
	line-height: 20px;
}*/
.navigation-cap {
	height: 30px;
	background: url(images/navigation.gif) center top no-repeat;
}
.newsletter-cap {
	margin-top: 20px;
	height: 20px;
	background: url(images/newsletter.gif) center top no-repeat;
}
.location-cap {
	margin-top: 30px;
	height: 20px;
	background: url(images/location.gif) center top no-repeat;
}
.promo-cap {
	margin-top: 30px;
	height: 20px;
	background: url(images/promo.gif) center top no-repeat;
}
.batik-atas {
	background: url(images/up-var.gif) right top no-repeat;
	height: 112px;
}
.address {
	text-align: center;
	padding: 0 15px 150px 15px;
}
.footer-menu {
	width: 553px;
	float: right;
}
.side-footer {
	width: 183px;
	margin-left: 13px;
	height: 69px;
	background: url(images/footer-left.gif) right top no-repeat;
	text-align: center;
}
.backtotop {
	padding: 49px 0 0 0;
	height: 20px;
	background: url(images/bg-top.gif) center bottom no-repeat;
	text-align: center;
	color: #fff;
}
.copyright {
	clear: both;
	text-align: left;
	color: #666666;
	padding: 50px 0 20px 13px;
}
/* main class */

/* link class
#navigation li a:link {
	color: #fff;
	text-decoration: none;
}
#navigation li a:visited {
	color: #fff;
	text-decoration: none;
}
#navigation li a:hover {
	color: #000;
	text-decoration: none;
}
#navigation li a:active {
	color: #fff;
	text-decoration: none;
} */
.backtotop a:link {
	color: #fff;
	text-decoration: none;
}
.backtotop a:visited {
	color: #fff;
	text-decoration: none;
}
.backtotop a:hover {
	color: #000;
	text-decoration: none;
}
.backtotop a:active {
	color: #fff;
	text-decoration: none;
}
a:link {
	color: #333333;
	text-decoration: none;
}
a:visited {
	color: #333333;
	text-decoration: none;
}
a:hover {
	color: #ff6600;
	text-decoration: none;
}
a:active {
	color: #333333;
	text-decoration: none;
}
/* link class */

/* Begin Images */
p img {
	padding: 3px;
	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: 3px;
	margin: 0 0 2px 7px;
	display: inline;	
	}

img.alignleft {
	padding: 3px;
	margin: 0 7px 2px 0;
	display: inline;
	}

.alignright {
	float: right;
	}

.alignleft {
	float: left
	}
/* End Images */

/*Menu*/
#navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
	width: 155px; /* Width of Menu Items */
	}

#navigation ul li {
	position: relative;
	font-size: 11px;
	border-bottom: 1px solid #e5c2c5;
	}
	
#navigation li ul {
	position: absolute;
	left: 154px; /* Set 1px less than menu width */
	top: 0;
	display: none;
	line-height: 20px;
	border-bottom: 1px solid #999999;
	border-right: 1px solid #999999;
	border-top: 1px solid #e7e7e7;
	border-left: 1px solid #e7e7e7;
	z-index: 20;
	}

/* Styles for Menu Items */
#navigation ul li a {
	display: block;
	text-decoration: none;
	color: #fff;
	background: #cd9da1;	
	padding: 5px;
	border-bottom: 0;
	}

/* Fix IE. Hide from IE Mac \*/
* html #navigation ul li { float: left; height: 1%; }
* html #navigation ul li a { height: 1%; }
/* End */

#navigation ul li a:hover { 
	color: #CCFF00; 
	z-index: 22; 
} /* Hover Styles */
		
#navigation li ul li a { padding: 2px 5px; } /* Sub Menu Styles */
		
#navigation li:hover ul, li.over ul { display: block; } /* The magic */