@charset "UTF-8";
/*
Copyright XHTML/CSS design by: Marvin Aoanan 04|27|2012
URL: www.marvin.e-aoanan.com
*/
/* CSS Document */

@media screen and (max-device-width: 480px){
    img{
        max-width:100%;
        height:auto;
    }
}


html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6 {
    -webkit-text-size-adjust:none;
}

body {
	font-family: "Myriad Pro", "Myriad Pro Bold", "Myriad Pro Semibold";
	border:none;
	margin:0px;
	padding:0px;
	text-align:center;
	background:#2d2d2d;
	color:#000;
}

a {
	color:#14b523;
	text-decoration:none;
}
a:hover {
	text-decoration: underline;
	color:#009933;
	
}
/*glabal css layout*/

#mainDiv { width:100%; margin:0; padding:0; background:#2d2d2d; position:relative;}
.W960px { width:960px; margin:0 auto; border:#F00 solid 0px; position:relative;}
.W900px { width:900px; margin:0 auto; border:#F00 solid 0px; position:relative;}

h1, h2, h3 { margin:0; padding:0;}
.float_right { float:right;}
.float_left { float:left;}
.clearFloat { clear: both;}
.spacer { clear:both; height:20px;}
.spacer10 { height:10px;}
.spacer20 { height:20px;}
.spacer40 { height:40px;}
.marginL20 { margin-left:20px;}
.marginR20 { margin-right:20px;}
.marginT20 { margin-top:20px;}
.marginB20 { margin-bottom:20px;}
.margin20 { margin:20px;}
.txtBold { font-weight:bold;}
.txt16 { font-size:16px; line-height:24px;}
.txt14 { font-size:14px; line-height:24px;}
.txt12 { font-size:12px; line-height:17px;}
/*p { font-size:11px; line-height:17px;}*/
img, img a { border:none;}
form { margin:0; padding:0;}
.line { height:20px; border-bottom:#CCC solid 1px; margin-bottom:20px;}
.hidden { display:none; visibility:hidden;}

#header { height:122px; background:url(../images/header_bg.png) top repeat-x; position:relative;}
.header_divider { background:url(../images/header_divider.png) top repeat-x; height:23px; width:100%; position:absolute; bottom:-23px; z-index:1000;}
.logo { width:209px; height:78px; margin:0 0 0 35px; padding:25px 0 0 0}

/*******NAVIGATION**********************/
.navigation { width:530px; height:65px; position:absolute; top:9px; right:0px; background:url(../images/nav_bg.png) 0 0 no-repeat; text-align:right;}
.navigation ul { margin:15px 0 0 180px; padding:0; width:250px; height:20px}
.navigation li { margin:0; padding:0; list-style:none;}
.navigation li.nav_home a { background:url(../images/nav_txt.png) 0 0 no-repeat; width:56px; height:13px; display:block; float:left;}
.navigation li.nav_about_us a { background:url(../images/nav_txt.png) -56px 0px no-repeat; width:96px; height:13px; display:block; float:left;}
.navigation li.nav_contact_us a { background:url(../images/nav_txt.png) -152px 0px no-repeat; width:89px; height:13px; display:block; float:left;}

.social_links { width:147px; height:30px; position:absolute; top:72px; right:35px;}
.social_links ul { margin:0; padding:0;}
.social_links li { margin:0; padding:0; list-style:none;}
.social_links li.icon_fb a { width:34px; height:28px; background:url(../images/social_icons.png) 0 0 no-repeat; float:left; display:block;}
.social_links li.icon_twitter a { width:39px; height:28px; background:url(../images/social_icons.png) -34px 0 no-repeat; float:left; display:block;}
.social_links li.icon_linkedin a { width:41px; height:28px; background:url(../images/social_icons.png) -73px 0 no-repeat; float:left; display:block;}
.social_links li.icon_flickr a { width:33px; height:28px; background:url(../images/social_icons.png) -114px 0 no-repeat; float:left; display:block;}

/************CONTENTS****************/
div.contents { background:#2d2d2d url(../images/main_bg.png) top repeat-x; margin:0px 0 0 0;}
.contents h1 { font-size:30px;}
.contents h2 { font-size:24px; padding:5px 0;}
.contents h3 { font-size:20px;}
.contents h4 { font-size:17px; padding:10px 0 0 0;}
.contents p { font-size:14px; line-height:15px;}
.contents ul { margin:10px 0 0 15px; padding:0;}
.contents li { margin:0; padding:0; list-style:disc outside;}

#hero { background:url(../images/hero_bg.png) 0 0 repeat; height:312px; position:relative; }
.hero_bottom { background:url(../images/hero_bottom.png) 0 0 no-repeat; height:29px; }

.full_content_wrap { background: url(../images/content_bg.png) center repeat-y; margin-top:-29px; padding:85px 30px 30px 30px; text-align:left;}
.contents { width:100%; position:relative;}
.new_post { width:400px; float:left; margin:0 0 0 35px;}
.featured_banner { margin:5px 0; padding:0;}
.mobile_logos { padding-top:4px;}
.toggleDiv, .toggleDiv2 { display:none}
.black_bar { background:url(../images/black_bar_bg.png) center repeat-x; height:111px; width:825px; margin:10px auto; position:relative;}
.apple_official_dev { width:196px; height:41px; margin:0 auto; padding-top:69px;}
.rss_feed { position:absolute; bottom:3px; right:15px; width:38px; height:39px;}

.divider_footer { height:16px; background:url(../images/divider_footer.png) bottom repeat-x; width:100%; margin-top:-16px; position:absolute; bottom:0px; z-index:3000}
.btn_goTop { width:35px; height:35px; margin:-3px auto 0 auto}

#footer { width:100%; background:#151515 url(../images/footer_bg.png) top repeat-x;}
#footer #col1 { width:40%; float:left; text-align:left; padding-top:30px; padding-left:40px; }
#footer h2 { color:#14b523; font-size:24px; padding:0 0 20px 0;}
#footer p { color:#FFF; }
p.about_us_copy, p.contact_info_copy { width:220px; text-align:left; line-height:14px;}
#footer #col2 {  width:30%; float:left; text-align:left; padding-top:30px; padding-left:200px;}
#footer a { color:#FFF; text-decoration:none;}
#footer a:hover { color:#14b523;}



/****************SLIDESHOW HERO***************************/
/* slide show */

#Slideshow { 
	height:400px; 
	overflow: hidden;
	margin:0;
	padding:0;
	width:960px;
	z-index:5000;
	position:relative;
	border:#00F solid 0px;
	}
#SlideTop, #SlideRepeat, #SlideBottom,
.slidePrev, .slideNext,
#slidePager {
	position: relative;
	z-index: 29;
	}
#SlideTop {
	height: 6px;
	overflow: hidden;
	background: transparent url("../images/pageBg-slideTop.png") no-repeat 0 0;
	margin-bottom:-6px;
	}
#SlideRepeat {
	height: 301px;
	overflow: hidden;
	background: transparent url("../images/pageBg-slideRepeat1.png") repeat-y 0 0;}
#SlideBottom {
	height: 55px;
	overflow: hidden;
	background: transparent url("../images/pageBg-slideBottom.png") no-repeat 0 0;}
.slider_bg { background:url(../images/slide_container_bg.png) 0 0 no-repeat; width:480px; height:362px; overflow:hidden; position:absolute; top:0; left:0px; padding:14px 0 0 17px; margin:25px 0 0 40px}	
#Slides {
	/*margin-top: -360px;*/
	/*margin-top:14px;
	margin-bottom: 18px;*/ /* without this #SlideBottom will overlap #Main */
	height: 333px;
	width:448px;
	overflow: hidden;
	/*background: #F4F5F6;*/
	}
	
a.slidePrev, a.slideNext {
	display: block;
	z-index: 30;
	top: -250px;
	width: 15px;
	height: 122px;}
a.slidePrev {
	/*float: left;
	margin:0 0px 0 0;*/ 
	position:absolute;
	top:150px;
	left:27px;
	background: transparent url("../images/slide-previous.png") no-repeat 0 0;
	border:#F00 solid 0px;
	}


a.slideNext {
	/*float: right;
	margin: 0 0px 0 0;*/
	position:absolute;
	top:150px;
	right:425px;
	background: transparent url("../images/slide-next.png") no-repeat 0 0;}

a.slidePrev:hover, a.slideNext:hover { /*background-position: 0 -64px;*/}
	
#slidePager {
	bottom: 90px;
	float: right;
	margin:0 40px 0 0;}
#slidePager a, #slidePager a:visited {
	float: left;
	width: 16px;
	height: 15px;
	overflow: hidden;
	background: transparent url("../images/slide-pager.png") no-repeat 0 0;
	text-decoration: none;
	text-indent: -1234px;
	margin:0 7px;

}
#slidePager a:hover {
	background-position: -16px 0;}
#slidePager a.activeSlide {
	background-position: -32px 0;}
.btn_learn_more { width:152px; height:38px; position:absolute; top:225px; left:540px; z-index:8000}