@charset "UTF-8";
/*
======================================================================
Css Name: No Flash
Css URL: http://inspireimage.com.au/
Description: Custom style for No Flash html page for Inspire Image
Version: 3.0
Author: Andreas Pratikto
Author Email: andreas@inspireimage.com.au

======================================================================*/

/* Colors
======================================================================
	#fdfcec : super light cream - bg
	#DAD499 : light cream - bg
	#736357 : dark brown - body text
	#8dc63f : green 
	#ff4200 : orange - intro text, h1, links
	#a5c718 : Green - heading2
	#534741 : dark brown lebih gelap lagi
====================================================================== */


/*----------------------------------
		overall layout
-----------------------------------*/
/* Reset browser defaults for consistency */

html, body, div, span, h1, h2, h3, h4, p, a, img, li, ol, ul, fieldset, form, label, legend {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;	
}


body {
	font-weight: normal;
	font-style: inherit;
	font: 12px Tahoma, Arial, Helvetica, sans-serif;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	background: #DAD499 url(../images/interface/gradient.jpg) repeat-y center;
	color: #736357;	
}

.container { width: 840px;margin: 0 auto;}
ul {list-style: none;padding: 5px 5px 10px 18px;}
li {padding: 4px 2px 2px 2px;}
img:link, img:visited  {border: none;}

/*----------------------------------
		Typography
-----------------------------------*/

h1 {
	font-size: 20px;
	color: #ff4200;
}
h2 {
	font-size: 28px;
	color: #8dc63f;
	font-weight: normal;
}
h3 {
	font-size: 18px;
	color: #ff4200;
	font-weight: normal;
}


p {
	text-align: left;
	line-height: 150%;
}

.hidden {display: none; } 
.green {color: #8dc63f; }
.boldie {font-weight: bold; }
.UPPERCASE { text-transform: uppercase; color: #534741;}

/*------------These are standard sIFR styles... do not modify---------------------------*/

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
}

.sIFR-hasFlash h2 {
	visibility: hidden;
}

.sIFR-hasFlash h3 {
	visibility: hidden;
}
/*
.sIFR-hasFlash h4 {
	visibility: hidden;
	letter-spacing: -5px;
	font-size: 21px;
}

*/


/*----------------------------------
		Link Style
-----------------------------------*/


a:link, a:visited { color: #ff4200; text-decoration: none; }
a:hover { color: #fdfcec; border: none;  }
 
.kecil a:link, .kecil a:visited { color: #736357; text-decoration: none; }	
.kecil a:hover, .featured a:hover {
	color: #fdfcec;  
	background: #a5c718;
	border: none; 
	}
.featured a:link, .featured a:visited { color: #9b8c80; text-decoration: none; }	
	

.dotted_line:link, .dotted_line:visited, #sitemap ul a:link, #sitemap ul a:visited {
	padding-bottom: 1px; 
	border-bottom: 1px dotted #ff4200; 
	color: #ff4200; 
	text-decoration: none;
	}
.dotted_line:hover, .email:hover, .controls a:hover, #sitemap ul a:hover {
	color: #fdfcec;  
	background: #a5c718;
	border: none; 
	}
	
#contact #click_comment { /* kita lagi di contact page gak perlu link ini */
	color: #736357; 
	text-decoration: none;
	border: none;
	}

	
	
/*----------------------------------
		Header layout 
-----------------------------------*/

.header_wrapper { background: url(../images/interface/bg_header.jpg) top repeat-x; }

.header {
	width: 840px;
	margin: 0 auto;
	height: 131px;
}
.logo {
	position:absolute;
	z-index: 3;
	width: 244px;
	height: 168px;
	background: url(../images/interface/Logo.png) 0 0 no-repeat;

}
.jahitan {
	position:absolute;
	z-index: 2;
	height: 21px;
	width: 100%;
	background: url(../images/interface/jahitan.png) 0 0 repeat-x;
	left: 0;
	top: 124px;
	}

/*----------------------------------
		Main Menu
-----------------------------------*/


.menu_container {
	padding-top: 83px;
	padding-left: 450px;
}

/* ----------  Roll Over Menu Style----------------*/
#about #about_page, #works #works_page, #service #service_page, #contact #contact_page {/* this is to indicate the current page */
	background-position: 0px 0px; }

.about:link, .works:link, .service:link, .contact:link, .about:visited, .works:visited, .service:visited, .contact:visited {/* clean up underline dotted */
	border: none; }

.about:hover, .works:hover, .service:hover, .contact:hover {
	background-position: 0px -48px;	
	
	}

.about, .works, .service, .contact { height: 48px; width: 93px; display: inline; float: left; } 

.about { background:url(../images/interface/about.png) 0 -96px no-repeat;  }
.works { background:url(../images/interface/works.png) 0 -96px no-repeat; } 	
.service { background:url(../images/interface/service.png) 0 -96px no-repeat; } 
.contact { background:url(../images/interface/contact.png) 0 -96px no-repeat; }


/*----------------------------------------------------------
		Sub Menu 
------------------------------------------------------------*/




.AccordionPanelContent ul li a:link, .AccordionPanelContent ul li a:visited {
	color: #736357;
}	
.AccordionPanelContent ul li a:hover {
	color: #fdfcec;  
	background: #a5c718;
	border: none;
}	




/* Buat indicate kita lagi di page mana */
.fifth #fifth,
.wisdompos #wisdompos,
.funky_skirt #funky_skirt,
.leanne_mcdonnell #leanne_mcdonnell,
.bloomingdales #bloomingdales,
.simple_retail #simple_retail,
.bernie_segedin #bernie_segedin,
.design_view #design_view,
.simple_retail_flash #simple_retail_flash,
.the_scoobber #the_scoobber,
.fishing_charters #fishing_charters,
.mary_ferguson #mary_ferguson, 
.black_and_white #black_and_white,
.danielle #danielle,
.eva #eva,
.eva_and_leighton #eva_and_leighton,
.natalie #natalie,
.olga #olga,
.previous_site #previous_site
{
	color: #ff4200;  
	border: none;
	background: none; 
	}





/* main Accordion container.*/
 
.Accordion {
	
	overflow: hidden;
}

/* AccordionPanel container*/ 

.AccordionPanel {
	margin: 0px;
	padding: 0px;
}

/* AccordionPanelTab. This container houses*/
 
.AccordionPanelTab {
	margin: 2px;
	padding: 2px 2px 2px 16px;
	cursor: pointer;
	/*-moz-user-select: none;
	-khtml-user-select: none;*/
	text-transform: uppercase;
	font-weight: bold;
	letter-spacing: 1px;
	background: url(../images/interface/arrow_side.gif) 2px center no-repeat;
	border-bottom: #a5c718 1px dashed;
	color: #a89587;
}

/* Panel's Content area.  */
.AccordionPanelContent {
	overflow: auto;
	margin: 0px;
	padding: 0px;
	height: 100%;
	
}


/*----------------------------------
		Content Page
-----------------------------------*/


.intro_heading {
	/*height: 78px;*/
	text-align: left;
	margin-top: 40px;
	/*background: url(../images/interface/we_design.png) 0 0 no-repeat;*/
}
.content {
	text-align: left;
	padding-top: 20px;
	
	background: url(../images/interface/shadow.png) top center no-repeat;
}
.left_content {
	float: left;
	width: 562px;
	display: inline;
}


.picture { /* picture wrapper yg ada framenya */ 
	height: 193px;
	padding: 16px 0 16px 15px;
	
}
#randomImage { /* random image yg di about page */
	height: 193px;
	width: 532px;
	border: 2px solid #a5c718;
	position: absolute;
	
}
#about .picture{background:url(../images/lightbox/loading.gif) center center no-repeat;}/* preloading image buat random image di about page */

.picture a img{ border: 2px solid #a5c718;}/* border buat picture */
	

.with_bg {/* buat h3 container*/
	padding: 14px 0 0 20px;
	height: 40px;
}
.no_bg {/* buat h3 container*/
	padding: 14px 0 5px 20px;	
}

.right_content {
	display: inline;
	float: left;
	width: 270px;
}
.right_text {
	padding: 10px 20px 10px 20px;
	}
.left_text {
	padding: 5px 20px 10px 20px;
}


/* thumbnail picture di about page	*/
.thumb_about{
	border: #a5c718 2px solid;
	margin-right: 6px;
}
.thumb_about_left{
	border: #a5c718 2px solid;
	margin-right: 6px;
	margin-left:-2px;
}
.thumb_about_right{
	border: #a5c718 2px solid;
}


/* thumbnail picture di service page	*/
.thumb_featured {
	border: #a5c718 2px solid;
	margin: 0 16px 11px 0;
}
#sitemap ul {
	list-style-type: square;
	padding-left: 16px;
}
.strecter {
	clear: both; height: 1px;}


/*----------------------------------
		footer
-----------------------------------*/
.footer {
	width: 800px;
	font-size: 10px;
	text-align: left;
	margin: 0 auto;
	margin-right: auto;
	padding: 40px 20px 40px 20px;
}

.footer_wrapper {}
.kecil { font-size:9px; color:#736357;}	
.featured { font-size:9px; color:#9b8c80;}