/*
Website URL: *url*
Description: *title* Screen Style Sheet
Author: Michael Cheung
Author URL: http://www.mikecheung.net
Version: 1.0
Last Updated: *Date Last Modified*

[COLORS]
*Color Hex*				*Color Name* (*purpose*)

[TABLE OF CONTENTS]
## CSS Reset
## General Declarations
## Header
## Menu
## Content
## Sub-Section
## Footer
---
7. *Name*
*/

@import url("base/typography.css");
@import url("base/960.css");

/* =============================================================
@   ## CSS Reset
   ============================================================= */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}:focus{outline:0}ins{text-decoration:none}del{text-decoration:line-through}table{border-collapse:collapse;border-spacing:0}

header, footer, aside, nav, article, section {  
	display: block;  
}  
/* =============================================================
@   ## General Declarations 
   ============================================================= */
a {color: #06c}

.orange {color: #f90}
.blue {color: #06c}

.clearfix { overflow: hidden; }
.clrright { float: right; }
.clrleft { float: left; }

.left {float:left}
.right {float:right}

.ta_right {text-align: right;}

.text {overflow: hidden;height:1%}
.tmar_0 {margin-top: 0px}
.tmar_5 {margin-top: 5px !important}
.tmar_10 {margin-top: 10px !important}
.tmar_15 {margin-top: 15px}
.tmar_20 {margin-top: 20px}

.lmar_20 {margin-left: 20px}

.rowlist li {display:block;float:left;}

/*  Tabs [A basic ruleset for beginning tabs]
   ------------------------------------------------------------- */
ul.tabs { margin: 0; padding: 0; }
ul.tabs li { float: left; list-style: none; margin: 0; padding: 0; }
ul.tabs li a { float: left; display: block; }

/* Clearing floats without extra markup  */
ul.tabs { display: inline-block; }
ul.tabs:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html ul.tabs { height: 1%; }
ul.tabs { display: block; }

.right_corner {display: block;width:144px;height:144px;background: url(../images/AYAJcontest_corner.png) no-repeat;position: fixed;right:0;top:0;}

/* =============================================================
@   ## Body 
   ============================================================= */
body {background: url(../images/bg/default_bg.png) #fff repeat-x}
body[name='offwhite'] {background: url(../images/bg/default_bg.png) #f0f0f8 repeat-x}
body[name='divided_bg'] {background: url(../images/bg/main_bg.png) #f0f0f8 repeat-x}

/* =============================================================
@   ## Header 
   ============================================================= */
#header {height:98px;background: url(../images/header.jpg) top center no-repeat}
#language {margin-top:10px;color:#fff;font-size: 12px;text-align: right;}
#logo {display:block;height: 100%}

/* =============================================================
@   ## Nav
   ============================================================= */
#nav {margin-top:42px; color: #fff;font-size: 14px;text-transform: uppercase; }
#nav li {float: right !important; margin:0 0px 0 20px;}
#nav li a {color:#fff;}
#nav li.active {color:#f90;font-weight: bold;}

/* =============================================================
@   ## Content 
   ============================================================= */
#content {margin-bottom: 20px;min-height: 600px}
.tbnr {height: 330px;}
#tbnr_content {margin-top:40px;}
#tbnr_content h1 {font-size: 24px;}
#tbnr_content .subheader {display:block;margin: 4px 0 16px;font-size: 16px}
#tbnr_content p {font-size: 13px;line-height:20px;color:#555}

#tbnr_img {background: url(../images/banner.jpg)}
#tbnr_img_1_5 {background: url(../images/banner_1_5.jpg)}

/*
#downloadbtn {display:block;margin:20px 107px 0;width:326px;height:40px;background: url(../images/btn_download.png);text-indent: -10000px;}
#downloadbtn:hover {background: url(../images/btn_download_act.png);}
#versioninfo {display: block;margin-top:5px;text-align:center;font-size: 10px;color:#666;}
*/

#download_area {height:90px;margin: 30px 0 0 0px;overflow:hidden;background:url(../images/bg/download_black_bg.jpg) no-repeat}/* height:80px;margin: 17px 0 0 0px;overflow:hidden;background:url(../images/bg/download_black_bg.jpg) */
#download_area li {display:block;float:left;height:74px; color:#666}
#download_header {float:left;margin: 28px 25px 0 84px;font-size:26px;text-transform: uppercase;color:#fff}
.subtitle {display:block;font-size: 10px; color: #fc0;}
.inputlabel {display:block;font-size: 10px; color: #fc0;}

#da-right {margin: 11px 0 0 56px;border-left: 0px solid #ccc;}
#da-right .inputbox {float:left;margin-top:3px;height:20px;width:129px;background:url(../images/bg/input_email.gif)no-repeat;}
#da-right input[type="text"] {margin: 4px 3px 0;border:0;background: transparent;color:#777;}
#da-right input[type="submit"] {float:left;width: 56px;height:20px;margin-top:3px;margin-left: 5px;border:0;background:url(../images/bg/submit_email.gif)no-repeat;color: #333;font-weight: bold}
#da-right input[type="submit"]:hover {background:url(../images/bg/submit_email_hvr.gif)no-repeat;color: #333;font-weight: bold;cursor:pointer}
#da-right .orange {display:block; margin: 3px 0 1px;font-size: 10px;}
.dl_url {font-size: 12px;color:#999}

/* =============================================================
@   ## Section
   ============================================================= */
#banners li {display:block;padding-bottom:15px;border-bottom:1px solid #ccc;}
#banners li a {margin-right:6px;}
#bbappworld {float:left;display:block;width:147px;height:62px;background: url(../images/bb_appworld.jpg) no-repeat;}
#bbappworld:hover {background: url(../images/bb_appworld_hover.jpg) no-repeat;}

section {}
#ftr_list .icon {float:left;margin:0 11px 0 0;}
#ftr_list > ul {margin-bottom: 40px;overflow: hidden}
#ftr_list li {float: left;width: 300px; margin: 0 10px;}
#ftr_list li div > h2 {margin: 0 0 10px 0;line-height: 20px}
#ftr_list li div > p {font-size: 12px;line-height: 18px}

#screenshots img {float:left;width:143px;height:93px;margin:5px;border:1px solid #ccc;}

#feedback li {display:block; padding:15px 0;border-top:1px solid #ccc; /* border-bottom: 1px solid #ccc; */font-size: 12px; line-height: 14px;}
#feedback .userfeedback {color: #333;font-style: italic}
#feedback .userinfo {color: #06c}

/* =============================================================
@   ## Footer 
   ============================================================= */
#footer {width:100%;background: #000;text-align: left;color:#ccc;font-size: 12px; line-height: 16px;}
#footer > div {margin-top: 20px;margin-bottom: 20px;}
#footer h2 {color:#fff;font-size: 14px;}
#footer .about_us p {display: block;margin:12px 0 40px;font-size: 13px;}
.copyright {font-size: 10px;}
#footer .siteindex a {color:#fff;}
#footer .siteindex a:hover {color:#06c;}
#footer .siteindex ul {margin-top: 12px;}
#footer .siteindex ul li {margin: 2px 0;}

/* =============================================================
@   ## Contact Us
   ============================================================= */
.grid_6_center {margin: 0 230px;}
#contact_header {margin-top: 20px;background: url(../images/bg/grid_6_divider.gif) bottom no-repeat #fff;border: 1px solid #e2e2e2;border-bottom: 0;}
#contact_header img {float:left;margin: 13px 0 18px 131px;}
#contact_header span {float:left; margin:28px 0 0 10px;color: #666;font-size: 16px;text-transform: uppercase;font-weight: bold}
#contact_social {background: #fff;border: 1px solid #e2e2e2;border-top: 0;}
#contact_section {background: #fff;border: 1px solid #e2e2e2;border-top: 0;}
#contact_section ul > li {margin: 10px 20px;}
#contact_section label {float:left;margin: 1px 0;color:#333;font-size: 12px;}
#contact_section .error {float: left; padding:2px 2px;margin-left:10px;background: red;color: #fff;font-size: 8px;text-transform: capitalize}
#contact_section input,#contact_section select,#contact_section textarea {margin-top: 4px;}
#copymyself {font-size: 10px;}
#contact_section button {width:425px;height:37px;background: url('../images/bg/fb_button.png') no-repeat;border:0;color:#222222;font-size:13px;text-shadow:0 1px 0 #FFFFFF;}
#contact_section button:hover {background-position: bottom;cursor: pointer}

#contact_success {background: #fff;border: 1px solid #e2e2e2;border-top: 0; border-bottom: 0}
#contact_success > div {margin: 10px;background: #e9e9e9;border: 1px solid #666;}
#contact_success h2, #contact_success p {margin:10px 20px;}
#contact_success p {font-size: 12px;color:#333;line-height: 14px}

.contact_result span {font-size: 12px; color:#666;}
.contact_result  #copymyself {font-size: 12px;color:#f90;}
/* =============================================================
@   ## Side Navigation
   ============================================================= */
#sidenav_menu ul li {display:block;border-bottom: 1px solid #ccc;font-size: 12px;color: #666}
#sidenav_menu ul li:hover,#sidenav_menu ul li.ui-state-active {background: #ccc;background:url(../images/bg/feat_menu.gif) repeat-y right}
#sidenav_menu ul li a {display:block;padding: 7px 0 5px 5px;text-decoration: none;color: #666}
#sidenav_menu ul li a:hover, #sidenav_menu ul li.ui-state-active a {color: #333}

/* =============================================================
@   ## Features
   ============================================================= */
#feature_sec {background:url(../images/bg/vertical_line.gif) left repeat-y; min-height: 600px}
#feature_sec h1, #feature_sec h2 {margin:0 0 10px 0;font-size: 20px;font-weight: 600;}
#feature_sec > div > p {padding-bottom: 20px;border-bottom: 1px solid #ccc;font-size: 12px;line-height: 16px}

.feat_detail {margin-top: 20px;width: 370px !important}
.feat_detail label {display:block;margin:0 0 15px;color: #666;font-size: 14px;font-weight: bold;}
.feat_detail p {display:block;margin:0 0 25px;font-size: 12px;line-height:14px}

#overview > img {margin-left:0px;}
#overview  .feat_detail img {float:left; margin:0 10px 0 0px;}
#overview ul li div > label {margin-top:10px;font-size:18px}

.ui-tabs-hide {display: none}

/*
#sidenav_menu ul li {display:block;border-bottom: 1px solid #ccc;font-size: 12px;color: #666}
#sidenav_menu ul li:hover,#sidenav_menu ul li.ui-state-active {background: #ccc;background:url(../images/bg/feat_menu.gif) repeat-y right}
#sidenav_menu ul li a {display:block;padding: 7px 0 5px 5px;text-decoration: none;color: #666}
#sidenav_menu ul li a:hover, #sidenav_menu ul li.ui-state-active a {color: #333}

#feature_sec > div {background:url(../images/bg/vertical_line.gif) left repeat-y}
#feature_sec h1, #feature_sec h2 {margin:0 20px 10px;font-size: 20px;font-weight: 600;}
#feature_sec > div > p {margin:0 20px;padding-bottom: 20px;border-bottom: 1px solid #ccc;font-size: 12px;line-height: 16px}

.feat_detail {margin-top: 20px;}
.feat_detail label {display:block;margin:0 0 15px 20px;color: #666;font-size: 14px;font-weight: bold;}
.feat_detail p {display:block;margin:0 0 25px 20px;font-size: 12px;line-height:14px}

#overview {background: red;}
#overview > img {margin-left:20px;}
#overview  .feat_detail img {float:left; margin:0 10px 0 20px;}
#overview ul li div > label {margin-top:10px;font-size:18px}

.ui-tabs-hide {display: none}
*/
/* =============================================================
@   ## Support
   ============================================================= */
#support_sec {background:url(../images/bg/vertical_line.gif) left repeat-y;min-height: 600px}
#support_sec h1 {margin:0 0 10px;font-size: 20px;font-weight: 600;}
#support_sec h2 {margin:0 0 10px;font-size: 16px;font-weight: 600;}
#support_sec h3 {margin:0 0 0px;font-size: 14px;}
#support_sec h4 {margin:0 0 0px;font-size: 12px;}
#support_sec .updates div {height:14px;margin: 10px 0 0;padding:2px 0 0 22px;font-size:12px;font-weight: bold;text-transform: uppercase}
#support_sec .new_features {background: url(../images/icons/sup_features.png) no-repeat;}
#support_sec .new_updates {background: url(../images/icons/sup_updates.png) no-repeat;}
#support_sec .bug {background: url(../images/icons/sup_bugs.png) no-repeat;}
#support_sec .updates ul {margin: 0 0 15px 28px;list-style: disc;}
#support_sec .updates li {font-size: 12px;line-height: 16px;}

#support_sec p {margin: 12px 0 16px;font-size: 12px;line-height: 16px;}
#support_sec .release_date {font-size: 10px; color: #999;font-weight: normal}
#support_sec .note {color:red}

#faq_list li {margin-left: 25px;list-style: decimal;font-size: 12px;line-height: 16px}
#faq_list li a {color: #000;text-decoration: underline}
#faq_list li a:hover {color:#666}

.faq_question {margin-top:20px;padding:10px 0 0;border-top: 1px dotted #666;font-size: 12px}
.label_col {padding:3px 0;width: 20px;}
.faq_question .question {color: #06c;font-weight: bold;}
.faq_question .answer {}

/* =============================================================
@   ## apn
   ============================================================= */
#apn_table {width: 100%;margin-bottom: 15px;}
#apn_table b {color: #f30;}
#apn_table img {border: 2px solid #000;}
#apn_table td {padding: 10px 20px 5px 0;border-bottom: 1px solid #ccc;font-size: 12px; vertical-align: top;line-height: 14px}

/* =============================================================
@   ## jobs
   ============================================================= */
#joblist > li {margin: 10px 0;font-size: 12px;border-top: 1px solid #999;line-height: 14px}
#joblist h2 {font-size: 14px;margin-bottom: 5px !important;margin-top: 13px !important;}
#joblist h3 {margin: 10px 0 5px;}
#joblist > li ul li {margin:2px 0 2px 25px;list-style: disc}

/* =============================================================
@   ## contracts
   ============================================================= */
#contracts p {line-height: 16px;}
#contracts h1 {text-transform: uppercase}
#contracts h2 {margin: 40px 0 10px;text-transform: uppercase}
#contracts h3 {color: #06c;text-transform: capitalize}

#contracts .lcase_alpha {margin: 0 0 20px 40px;list-style: lower-alpha;font-size: 12px;}
#contracts .lcase_alpha li {margin: 10px 0}