/**********************************************************************************************

	CSS on Sails
	Title: Site Name
	Author: XHTMLized (http://www.xhtmlized.com/)
	Date: June 2009

***********************************************************************************************
		
	1. BASE
			1.1 Reset
			1.2 Accessibility Navigation & Hide
			1.3 Clearfix
			1.4 Default Styles
	
	2. LAYOUT
      2.1 Structure
			2.2 Header
      2.3 Navigation
			2.4 Content
			2.5 Sidebar
			2.6 Footer		

***********************************************************************************************/


/* 1. BASE
-----------------------------------------------------------------------------------------------
===============================================================================================*/	


/* 1.1	Reset
-----------------------------------------------------------------------------------------------*/	
 
html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, samp, small, strong, sub, sup, tt, var, 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; }
q { quotes: none; }
q:before, q:after { content: ""; content: none; }
a, ins, del { text-decoration: none; }
table { border-collapse: collapse; border-spacing: 0; }
th, td { vertical-align: top; }
th { text-align: left; }

/* 1.2	Accessibility Navigation & Hide
-----------------------------------------------------------------------------------------------*/	

ol#accessibility-nav, .hide { position: absolute; top: -999em; left: -999em; height: 1px; width: 1px; }


/* 1.3	Clearfix
-----------------------------------------------------------------------------------------------*/

.clearfix:after,
#navigation ul:after,
#navigation form fieldset:after,
div.breadcrumb:after,
body.home .top-content:after,
body.home .primary-content .slide ul.slide-inside:after,
body.home .bottom-content ul.cols:after,
body.home .bottom-content ul.cols li.links ul:after,
#footer:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }


/* 1.4	Default Styles
-----------------------------------------------------------------------------------------------*/	

body { background: #fff url(../images/bg-body.png) repeat-x ; color: #333; font: 62.5%/1.3 Arial, Helvetica, sans-serif; text-align: center; }
hr { display: none; }
strong { font-weight: bold; }
em { font-style: italic; }
del { text-decoration: line-through; }
th { font-weight: normal; }
address, cite, dfn { font-style: normal; }
li { list-style: none; margin-left:0px; }
abbr, acronym { border-bottom: 1px dotted #999; cursor: help; }
input, textarea, select { font-family: Arial, Helvetica, sans-serif; }
a, a:visited { color:#263997; text-decoration: none; }
a:hover, a:active { color: #F37121; text-decoration: none; }


/* 2. LAYOUT
-----------------------------------------------------------------------------------------------
===============================================================================================*/	


/* 2.1	Structure
-----------------------------------------------------------------------------------------------*/	

.container { width: 1050px; position: relative; margin: 0 auto; text-align: left; font-size: 1.2em }
#content { float: left; width: 786px; background: url(../images/bg-inside.png) no-repeat left top }
body.home #content { width: 1050px; float: none; background: none }
#sidebar { float: right; width: 225px; padding: 15px }
#footer { clear: both; }


/* 2.2	Header
-----------------------------------------------------------------------------------------------*/	

#header { height: 109px; width: 1050px; position: relative; text-align: right }
#header img { position: absolute; top: 0; right: -95px }
#header .site-name, 
#header .site-name span { display: block; overflow: hidden; width: 244px; height: 68px; top: 17px; left: 21px }
#header .site-name { position: relative; }
#header .site-name span { background: url(../images/logo.png) no-repeat; position: absolute; top: 0; left: 0; z-index: 10; }
#header a.site-name span { cursor: pointer; }
#header h2, #header p { position: relative; z-index: 10; color: #263997; font-weight: bold; font-size: 1.2em; right: 220px }
#header h2 { font-size: 2em; top: -30px }
#header p { top: -30px }


/* 2.3	Navigation
-----------------------------------------------------------------------------------------------*/
#navigation { height: 36px; width: 1050px; position: relative }
#navigation ul li { width: 100px; padding: 11px 12px; float: left; font-size: 13px; display: block; margin-left: 10px }
#navigation ul li a { color: #fff; font-weight: bold }
#navigation ul li a:hover,
#navigation ul li.active a { color: #f37121; text-decoration: none }
#navigation ul li ul { background: #ada8a2; padding: 5px 0 8px; margin-top: 3px; width: 145px }
#navigation ul li ul li { padding: 5px 2px; line-height: 16px; font-size: 12px; padding-right: 0; width: 124px }
#navigation ul li.active ul li a,
#navigation ul li ul li a { color: #fff; font-weight: normal }
#navigation ul li.active ul li a:hover,
#navigation ul li ul li a:hover { color:  #595148 }

#navigation form { width: 204px; height: 26px; position: absolute; top: 0; right:  0 }
#navigation form input { float: left; margin-top: 6px }
#navigation form input#q { height: 18px; border: 0; padding: 6px 5px 0 5px; color: #89827a; text-transform: uppercase; font-size: 10px; width: 149px; margin-right: 10px }

div.breadcrumb { padding: 10px; margin-bottom: 20px }
body.home div.breadcrumb { margin: 0 }
div.breadcrumb h3 { float: left; width: 350px; font-size: 11px; font-weight: normal; color: #263997; padding-left: 15px; text-transform: uppercase }
div.breadcrumb .breadcrumb-nav { float: right; width: 650px; text-align: right; font-size: 11px; color: #89827a }
div.breadcrumb .breadcrumb-nav a { color: #89827a }
div.breadcrumb .breadcrumb-nav a.active,
div.breadcrumb .breadcrumb-nav a:hover,
div.breadcrumb h3 span { color: #f37121 }

/* 2.4	Content
-----------------------------------------------------------------------------------------------*/	

/* 	FAQ layout ---------*/

#faq	{ background: url(/_media/images/faq_bg.jpg) no-repeat; width:1050px; padding:55px; }

#faq a, { color: #263997; text-decoration: none; }
#faq a:hover, a:active { color:#F37121; text-decoration: none; }
#answer { line-height:200%;}

body.home .top-content { background: url(../images/bg-sidebar_home.png) repeat-y right; margin-bottom: 8px }
body.home .primary-content { float: left; width: 786px; overflow: hidden }
body.home .primary-content .slide { overflow: hidden; background: #cdc5bc; position: relative; width: 770px; height: 371px; padding: 8px }
body.home .primary-content .slide ul.slide-nav li a { display: block; width: 42px; height: 18px; text-indent: -9999em; position: absolute }
body.home .primary-content .slide ul.slide-nav li.back a { background: url(../images/btn-back.png) no-repeat; bottom: 15px; left: 15px } 
body.home .primary-content .slide ul.slide-nav li.next a { background: url(../images/btn-next.png) no-repeat; bottom: 15px; right: 15px } 
body.home .primary-content .slide ul.slide-inside { width: 4000px }
body.home .primary-content .slide ul.slide-inside li {  float: left; margin-right: 8px }

body.home .secondary-content { float: right; width: 225px; padding: 15px }
body.home .secondary-content h3 { color: #263997; font-size: 14px; text-transform: uppercase }
body.home .secondary-content ol li { list-style: decimal; margin-left: 20px; font-size: 16px; color: #fff; padding-top: 13px }
body.home .secondary-content ol li span { font-size: 12px; text-transform: uppercase; display: block }
body.home .secondary-content ol li em { font-style: normal; font-weight: bold }
body.home .secondary-content ol li a { color: #fff }
body.home .secondary-content ol li a:hover { color: #263997 }

body.home .bottom-content { border: 1px solid #89827a }
body.home .bottom-content ul.cols { background: url(../images/bg-cols.png) repeat-y left; border-bottom: 1px solid #89827a }
body.home .bottom-content ul.cols li { float: left; padding: 12px 15px; padding-bottom: 0 }
body.home .bottom-content ul.cols li h3, #news h3 { color: #263997; font-size: 13px; text-transform: uppercase; padding-bottom: 8px }
body.home .bottom-content ul.cols li h3 span, #news h3 span { color: #f37121 }

body.home .bottom-content ul.cols li.product-otm { width: 222px }
body.home .bottom-content ul.cols li.product-otm img { float: left }
body.home .bottom-content ul.cols li.product-otm p { width: 125px; float: right; color: #89827a }
body.home .bottom-content ul.cols li.whats-new { width: 230px }
body.home .bottom-content ul.cols li.whats-new ul li { padding: 0; padding-bottom: 15px }
body.home .bottom-content ul.cols li.whats-new ul li h4, #news ul li h4 { color: #625c56; font-size: 12px; text-transform: uppercase; }
body.home .bottom-content ul.cols li.whats-new ul li p, #news ul li p { color: #89827a; }
body.home .bottom-content ul.cols li.whats-new ul li a, #news ul li a { color: #263997; }
body.home .bottom-content ul.cols li.whats-new ul li a:hover, #news ul li a:hover { color: #f37121; }
body.home .bottom-content ul.cols li.links { width: 243px; position: relative; overflow:hidden; }
body.home .bottom-content ul.cols li.links ul li { padding: 0; padding-bottom:8px; float: left; width: 115px; margin-right: 5px; font-size: 11px }
body.home .bottom-content ul.cols li.links p.career { border-top: 1px solid #89827a; clear: both; width: 273px; left: -15px; position: relative; padding-top: 15px; text-align: center; font-size: 13px }
body.home .bottom-content ul.cols li.links p.career a { color: #263997; font-weight: bold; }
body.home .bottom-content ul.cols li.links p.career a:hover { color: #f37121; font-weight: bold; }
body.home .bottom-content ul.cols li.links ul li a { color:  #F37121; }
body.home .bottom-content ul.cols li.links ul li a:hover { color: #263997; }
body.home .bottom-content ul.cols li.tour { width: 233px; text-align: center; }
body.home .bottom-content ul.cols li.tour h3 { text-align: left; }
body.home .bottom-content .bottom-inside { color: #89827a; overflow:hidden;}
body.home .bottom-content .bottom-inside strong { color: #625c56; }
body.home .bottom-content ul.cols li.avatar { width: 233px; }

body.home .bottom-content .bottom-inside #information { width: 754px; padding: 15px; border-right: 1px solid #89827a; float:left;}
body.home .bottom-content .bottom-inside #news { width: 233px; padding: 15px; float:right;}

div.banner{ text-align: center ; margin-bottom: 20px }
div.content-inside { padding: 0px 20px 40px 50px; color: #89827a; font-size: 13px }
div.content-inside h1 { color: #263997; font-size: 21px; padding-bottom: 20px }
div.content-inside p { padding-bottom: 15px }
div.content-inside h2 { font-size: 17px; padding: 10px 0 15px;  }
div.content-inside h2.orange { color: #f37121 }
div.content-inside h3 { font-size: 14px; color: #263997; padding-bottom: 15px }
div.content-inside li { list-style: disc; margin-left:30px; }
div.content-inside #management a, { color: #F37121; text-decoration: none; } 
div.content-inside #management a:hover, { color:#263997 ; text-decoration: none; }
.orange {color: #F37121;}



/* 2.5	Sidebar
-----------------------------------------------------------------------------------------------*/	
ul.second-nav li { padding-bottom: 15px; }
ul.second-nav li a:hover,
ul.second-nav li.active a { color: #f37121 }
ul.second-nav li a { color: #263997 }

ul.second-nav-reps li { padding-bottom: 3px; }
ul.second-nav-reps li a:hover,
ul.second-nav-reps li.active a { color: #f37121 }
ul.second-nav-reps li a { color: #263997 }
/* 2.6	Footer
-----------------------------------------------------------------------------------------------*/
#footer { padding: 10px; border-top: 1px solid #89827a; margin-top:20px; }
body.home #footer { border: none }
#footer p { font-size: 11px; color: #91887d }
#footer .copyright { width: 50%; float: left; color: #625c56 }
#footer .footer-nav { width: 50%; float: right; text-align: right }
#footer .footer-nav ul li { display: inline; padding: 0 10px; border-right: 1px solid #333 }
#footer .footer-nav ul li.last { padding-right: 0; border: 0 }
#footer .footer-nav ul li a { color:  #625c56; font-weight: bold }
#footer .footer-nav ul li a:hover { color: #263997 }