@import url(reset.css);
@import url(code/font.css);
@import url(nexa/font.css);

/***************************************************************
GENERIC CLASSES 
***************************************************************/
body			{ background-color: #f5f5f5; }
.clear 			{ clear: both; height: 0; line-height: 0; font-size: 0; }
.hidden 		{ display: none; }
.float_left 	{ float: left; }
.float_right 	{ float: right; }
.txt_hidden 	{ text-indent: -1000px; overflow: hidden; }
.active			{ //background-color:#ccc; 
}
a				{ color:#204096; }
a:hover			{ color:#204096; }
.pointer		{ cursor: pointer; }
.holder 		{ width: 1024px; margin-left: auto; margin-right: auto; z-index: 100; }
.center			{ margin-left: auto; margin-right: auto; }
/***************************************************************
LAYOUT
***************************************************************/
.wrapper 		{ width: 1024px; margin-left: auto; margin-right: auto; min-height: 50px; }
.wrapper745 	{ width: 745px; margin-left: auto; margin-right: auto; min-height: 50px; }
.wrapper_inside	{ background-color: #f5f5f5; border-top: 1px solid #dedede;}
#header			{ height: 115px; background-color: #f5f5f5; border-bottom: 1px solid #d7d7d7; text-align: center; padding-top: 20px;}
#navigation-template-home 
				{ min-height: 375px; background: #fff url('../images/bg_batik1.png') no-repeat center top;}
#navigation-template-inside
				{ min-height: 275px; background: #fff url('../images/bg_batik1.png') no-repeat center top;}				
#menu			{ margin-left: auto; margin-right: auto; width: 935px; height: 350px; 
				  background: url('../images/image_menu_2.png') no-repeat center top; position: relative;}
#menu-inside	{ margin-left: auto; margin-right: auto; width: 935px; height: 210px; 
				  background: url('../images/image_menu_2.png') no-repeat center -100px; position: relative;}
.wrapper_submenu{ height: 67px; background: url('../images/shadow_submenu.png') no-repeat center bottom;}
#submenu		{ height: 35px; border-bottom: 1px solid #dedede; text-align: center; 
				  font-size: 24px; font-family: 'code_lightregular'; color: #0a90a4; padding-top: 15px;
			  }
#submenu .submenu-item	{ display: inline-block; color: #444;}
#submenu .submenu-active{  display: inline-block; color: #0a90a4; }
#submenu a		{ color: #444; text-decoration: none; }
#submenu a:hover{ color: #0a90a4; text-decoration: none; }
#submenu span	{ width: 135px; display: inline-block;}

#btn-people		{ position: absolute; left: 270px; top: 250px; }
#btn-philosophy	{ position: absolute; left: 350px; top: 330px; }
#btn-services	{ position: absolute; left: 510px; top: 230px; }
#btn-work		{ position: absolute; left: 590px; top: 330px; }
#btn-whatsnew	{ position: absolute; left: 640px; top: 230px; }

#btn-people-inside		{ position: absolute; left: 270px; top: 150px; }
#btn-philosophy-inside	{ position: absolute; left: 350px; top: 220px; }
#btn-services-inside	{ position: absolute; left: 510px; top: 130px; }
#btn-work-inside		{ position: absolute; left: 590px; top: 220px; }
#btn-whatsnew-inside	{ position: absolute; left: 640px; top: 130px; }

#kufic-home				{ padding: 40px 0px; }
#kufic-home-inside		{ padding: 40px 0px; }

#tagline		{ padding-top: 40px; line-height: 36px; background-color: #fff;}
.category1 a	{ padding: 4px 10px; color: #fff; text-decoration: none; background-color: #867d61; }
.category1 a:hover{color: #fff; text-decoration: none; background-color: #000; }
.category2 a	{ padding: 4px 10px; color: #fff; text-decoration: none; background-color: #6d5f71; }
.category2 a:hover{color: #fff; text-decoration: none; background-color: #000; }
.category3 a	{ padding: 4px 10px; color: #fff; text-decoration: none; background-color: #79835c; }
.category3 a:hover{color: #fff; text-decoration: none; background-color: #000; }
.category4 a	{ padding: 4px 10px; color: #fff; text-decoration: none; background-color: #426670; }
.category4 a:hover{color: #fff; text-decoration: none; background-color: #000; }

#news-section	{ margin-left: auto; margin-right: auto; padding-left: 15px; }
#news			{ background-color: #fff;}
.news			{ width: 300px; height: 460px; border: 1px solid #ebebeb; margin: 0px 0px 20px 20px; 
				  -webkit-box-shadow: 0px 0px 10px rgba(50, 50, 50, 0.1);
				  -moz-box-shadow:    0px 0px 10px rgba(50, 50, 50, 0.1);
				  box-shadow:         0px 0px 10px rgba(50, 50, 50, 0.1); }
				  
.news .title		{ font-size: 16px; font-family: 'nexa_boldregular'; color: #000; padding: 19px; height: 47px;}
.news .bar-category	{ height: 10px; background-color: #000; }
.news .bar-category1{ height: 10px; background-color: #867d61; }
.news .bar-category2{ height: 10px; background-color: #6d5f71; }
.news .bar-category3{ height: 10px; background-color: #79835c; }
.news .bar-category4{ height: 10px; background-color: #426670; }
.news .description	{ font-size: 16px; font-family: 'nexa_lightregular'; color: #000; padding: 19px; height: 150px; overflow: hidden;}

.news-detail	{}
.news-detail .title	{ color: #444; font-family: 'code_lightregular'; font-size: 40px; padding: 50px; background-color: #fff;}
.news-detail .description	{ font-size: 16px; font-family: 'nexa_lightregular'; color: #000; padding: 50px; background-color: #f5f5f5;}
.news-detail .image	{ width: 100%; height: 200px; background-color: #ccc;}
.bar-category1{ height: 10px; background-color: #867d61; }
.bar-category2{ height: 10px; background-color: #6d5f71; }
.bar-category3{ height: 10px; background-color: #79835c; }
.bar-category4{ height: 10px; background-color: #426670; }

.more			{ font-size: 12px; font-family: 'nexa_boldregular'; padding-left: 210px; }
.more	a		{ color: #000; text-decoration: none; }
.more	a:hover	{ color: #cc8915; text-decoration: none; }
.more span	{ vertical-align: middle; padding-right: 10px; }
.more img		{ vertical-align: middle; }

#footer			{ background-color: #fff; }
#footer-section	{ padding-top: 20px; position: relative; padding-bottom: 50px; height: 200px;}
#footer-button	{ width: 136px; height: 137px; background-color: #fff; padding: 20px 20px; z-index: 100; position: absolute; left: 444px; }
#footer-button2	{ width: 136px; height: 137px; background-color: #f5f5f5; padding: 20px 20px; z-index: 100; position: absolute; left: 444px; }
#footer-line	{ height: 10px; border-bottom: 1px solid #dedede; position: absolute; width: 100%; top: 100px; z-index: 1; }
#footer-copy	{ position: absolute; top: 130px; }
#footer-store	{ position: absolute; top: 110px; right: 20px; }

#founder		{ font-family: "code_lightregular"; color: #444;}
#founder .title	{ font-size: 63px;  text-align: center; padding: 30px 0px;}
#founder .brief	{ font-size: 24px; text-align: justify; padding-bottom: 20px; line-height: 30px;
}
#founder .desc	{ font-size: 18px; font-family: 'nexa_lightregular'; text-align: justify;}
#founder h1		{ font-family: 'nexa_boldregular'; padding-top: 40px; padding-bottom: 10px; }
#founder .photo	{ text-align: center; padding: 40px 0px; }
#founder .name	{ font-size: 63px; padding-top: 30px; }
#founder .position	{ font-size: 18px; padding-bottom: 40px; font-family: "code_boldregular"; }
#founder .active{ box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; border: 5px solid #89bcc7; }
.founder-detail	{ display: none; }
#founder1 {
	background:url('../images/kusye.jpg') no-repeat;
	 -moz-border-radius:100px;
	 -webkit-border-radius:100px;
	 border-radius:100px;
	 -moz-background-size:100% 100%; -webkit-background-size:100% 100%;
	width:149px;
	height:149px;
	display: inline-block;
	margin-right: 20px;
}
#founder2 {
	background:url('../images/banie.jpg') no-repeat;
	 -moz-border-radius:100px;
	 -webkit-border-radius:100px;
	 border-radius:100px;
	 -moz-background-size:100% 100%; -webkit-background-size:100% 100%;
	width:149px;
	height:149px;
	display: inline-block;
	margin-right: 20px;
}
#founder3 {
	background:url('../images/erwin.jpg') no-repeat;
	 -moz-border-radius:100px;
	 -webkit-border-radius:100px;
	 border-radius:100px;
	 -moz-background-size:100% 100%; -webkit-background-size:100% 100%;
	width:149px;
	height:149px;
	display: inline-block;
}
#founder4 {
	background:url('../images/zaenudin.jpg') no-repeat;
	 -moz-border-radius:100px;
	 -webkit-border-radius:100px;
	 border-radius:100px;
	 -moz-background-size:100% 100%; -webkit-background-size:100% 100%;
	width:149px;
	height:149px;
	display: inline-block;
	margin-right: 20px;
}
#founder5 {
	background:url('../images/made.jpg') no-repeat;
	 -moz-border-radius:100px;
	 -webkit-border-radius:100px;
	 border-radius:100px;
	 -moz-background-size:100% 100%; -webkit-background-size:100% 100%;
	width:149px;
	height:149px;
	display: inline-block;
}

#artist					{ font-size: 18px; font-family: "nexa_lightregular"; padding-top: 30px; }
#artist-names 			{ display: inline-block; width: 300px; vertical-align: top;}
#artist-names .active	{ font-family: "nexa_boldregular"; background-color: #f5f5f5; }
#artist-names li		{ list-style: none; text-align: right; padding-right: 25px; padding-bottom: 15px; }
.artist-detail			{ display: inline-block; width: 675px; padding-left: 25px; }
.artist-detail .title	{ font-family: "nexa_boldregular"; padding-bottom: 10px; }
.artist-detail .desc	{ padding-bottom: 20px; }
.artist-detail .desc li	{ padding-bottom: 3px; }

#services-circle		{
	margin: 50px 0px;
	background: #f5f5f5 url('../images/services_circle.png') no-repeat center top;
	height: 606px;
	position: relative;
}
#services-circle .active{ color: #8730b4; }
.services 				{ position: absolute; font-size: 18px; font-family: "code_boldregular"; color: #444; }
.viewphotos				{
	margin: 30px 0px;
}
.galleria{ width: 200px; height: 200px; background: #f5f5f5; opacity: 0; position: absolute; }
/***************************************************************
TEXT
***************************************************************/
.menu			{ font-size: 12px; color: #cc8915; font-family: 'code_boldregular'; letter-spacing: .9px; }
.menu a			{ color: #444; text-decoration: none; }
.menu a:hover	{ color: #cc8915; text-decoration: none; }
#tagline		{ color: #444; font-family: 'code_lightregular'; font-size: 28px; text-align: center; }
.copytext		{ font-size: 10px; font-family: 'code_boldregular'; color: #636363; }

/***************************************************************
FX
***************************************************************/