@charset "UTF-8";
/* reset styles to try and make all browsers play nice */
@import url("reset.css");
@import url("framework.css");

@font-face {
    font-family: 'CenturyGothicRegular';
    src: url('fonts/century_gothic.eot');
    src: url('fonts/century_gothic.eot') format('embedded-opentype'),
         url('fonts/century_gothic.woff') format('woff'),
         url('fonts/century_gothic.ttf') format('truetype'),
         url('fonts/century_gothic.svg#CenturyGothicRegular') format('svg');
}

@font-face {
    font-family: 'CenturyGothicBold';
    font-weight: bold;
    src: url('fonts/centugotbol.eot');
    src: url('fonts/centugotbol.eot') format('embedded-opentype'),
         url('fonts/centugotbol.woff') format('woff'),
         url('fonts/centugotbol.ttf') format('truetype'),
         url('fonts/centugotbol.svg#CenturyGothicBold') format('svg');
}

/* HTML */

	body { font: 12px 'CenturyGothicRegular', Helvetica, sans-serif; color: #909C96; }
	strong { font-family: 'CenturyGothicBold', Helvetica, sans-serif; }

	p { margin: 0 0 10px 0; }

	h1 { font-size: 30px; font-weight: bold; color: #F89728; margin: 0 0 20px 0; padding: 0; line-height: 1; }
	h1 span { font-size: 24px; font-weight: normal; }
	h2 { font-family: 'CenturyGothicBold'; font-size: 14px; font-weight: bold; color: #F89728; margin: 0 0 20px 0; padding: 0; }
	h3 { font-family: 'CenturyGothicBold'; font-size: 12px; font-weight: bold;  }
	h3 span { float: right; }

/* Classes */

	.border-bottom { border-bottom: 1px solid #909C96; }
	.border-right { border-right: 1px solid #909C96; padding-right: 20px; height: 100%; }

	.mid { width: 220px; margin: 0 auto; }
	.space { height: 20px; }

	.hint { font-size: 10px; text-transform: lowercase; color: #a6b4ac;  }

/* */

	#content { margin: 40px auto 0; }

/* Side */

	#content-side h3 { text-transform:lowercase; height: 20px; border-bottom: 1px solid #909C96; margin: 0 0 10px 0; width: 160px; }
	#content-side-logo { padding: 0 0 20px 0; }

	#flipbox { width: 160px; height: 160px; background: #fff; }

	#content-side-nav { width: 160px; }

	#content-side-nav ul li {
		text-align: center;
		line-height: 25px;
		margin-top: 18px;
	}

	#content-side-nav ul li a {
		width: 160px;
		height: 25px;
		background: url(img/content-side-nav-item-bg.png) top no-repeat;
		display: block;
		color: #fff;
		text-decoration: none;
		font-weight: bold;
		font-size: 11px;
		text-transform: lowercase;
	}

	#content-side-nav ul li a:hover,
	#content-side-nav ul li a.active { background-position: bottom; }

	#content-side-main {
		/* width: 160px; */
		padding: 50px 0 0 0;
	}

	#subscribe, #connect, #visit { padding: 0 0 30px 0; }

	#content-side-main .trading ul li,
	#content-main-text .trading ul li { float: none; height: auto; width: auto; margin: 0; }

	.trading ul { margin: 0 0 20px; }

	#subscribeFrm { width: 160px; }

	#content-side-main ul { padding: 0; margin: 0; }
	#content-side-main ul li { float: left; padding: 0; margin: 0; height: 20px; width: 20px; }
	#content-side-main ul li p { margin: 0 !important; }
	#content-side-main ul li a { display: block; }

	#connect li { overflow: hidden; width: 23px !important; margin: 0 10px 0 0 !important; line-height: 22px; height: 22px; }
	/* #connect li a:hover img { margin-top: -22px; } */
   #connect li a { color: #909d96; font-size: 22px; }
   #connect li a:hover { color: #c2c9c5; }

/* Content */

	.line { position: absolute; width: 3px; height: 3px; opacity: 0;  filter: alpha(opacity=0); background: #F89728;  z-index: 9999; }

	#map-overlay { z-index: 9998; position: absolute; width: 700px; height: 440px; top: 0; left: 0; }
	#map-overlay img { z-index: 9999; position: absolute; width: 77px; height: 77px; cursor: pointer; bottom: 0; right: 0; }

	#line-vert {  bottom: 195px; left: 445px; }
	#line-hori { top: 228px; right: 253px; }

	#content-main-heading { position: relative; height: 158px; margin-bottom: 20px; }
	#content-main-heading h1 { position: absolute; bottom: 0; left: 0; margin: 0; padding: 0; }

	#content-main-image { position: relative; margin: 0 0 20px 0; }
	#content-main-image img.pageimage { width: 700px; }

	#slideshow { position: relative; /* height: 440px; */ height: 930px; }
	#slideshow img { width: 700px; }

	#content-main-image #view { position: absolute; bottom: 0; right: 0; width: 76px; height: 76px; z-index: 999; cursor: pointer; }

	#content-side { margin: 0 20px 0 0 !important; }
	#content-main { margin: 0 0 0 20px !important; }
	#content-main ul li { margin: 0 0 20px 0;  padding: 0; }
	#content-main .legend { margin: 0; padding: 0; }
	#content-main .legend li { margin: 0; padding: 0 15px 0 0; text-align:right; }
	#content-main .legend li.leg01 { background: url(img/legend-icon_01.png) right no-repeat; }
	#content-main .legend li.leg02 { background: url(img/legend-icon_02.png) right no-repeat; }
	#content-main .legend li.leg03 { background: url(img/legend-icon_03.png) right no-repeat; }

	#contact-address {
		position: absolute;
		z-index: 99;
		bottom: 25px;
		right: 0;
		padding: 20px;
		width: 251px;
		height: 60px;
		background:url(img/contact-address-bg.png);
		font-size: 21px;
		color: #F98728;
		text-align: center;
	}

	#content-main-secondary {  border-top: 1px solid #909C96; padding-top: 20px; margin-top: 10px; }
	#content-main-secondary ul { margin: 0 0 0 8px; padding: 0; }
	#content-main-secondary ul li { margin: 0; padding: 0; line-height: 14px; list-style: disc; margin: 0 0 0 7px; }

	#content-main-secondary .gallery { margin: 0; padding: 0; list-style: none; }
	#content-main-secondary .gallery li {
		float: left;
		line-height: 80px;
		height: 80px;
		width: 120px;
		margin: 0 10px 20px;
		padding: 0;
		list-style: none;
		overflow: none;
	}
	#content-main-secondary .gallery li a { display: block; height: 80px; width: 120px; text-align:center; overflow: hidden; }
	#content-main-secondary .gallery li a:hover,
	#content-main-secondary .gallery li.activeSlide a { }


/* Form */

	fieldset { margin: 0; padding: 0; }
	legend { font-weight: bold; font-family: 'CenturyGothicBold'; padding: 0 0 5px 0; }
	label { display: block; }
	input { padding: 0 5px; margin: 0; border: none; background: #ecf0ed; height: 22px; line-height: 22px; outline: none; color: #a6b4ac; }
	#signupFrm input { width: 250px; }
	#subscribeFrm input { width: 128px; }
	button {
		border: 0 !important;
		width: 22px;
		height: 22px;
		margin: 0 0 0 -4px;
		padding: 0;
		float: right;
		background: url(img/email-btn-bg.png) top no-repeat;
		color: #fff;
	}
	#signupFrm button { margin-right: 58px; }
	.btn:hover { background-position: bottom; }
	#signup-response,
	#subscribe-response { color: #a5b3ab; font-style:italic; font-size: 10px; display: block; padding: 0 0 5px !important; width: 160px; }

/* Map */

	#map { position: relative; width: 700px; height: 440px; overflow: hidden; background: #f5f6f6; z-index: 99; }
	#inner { position: relative; }
	.hotspot { position: absolute; bottom: 0; left: 0; width: 9px; height: 8px; margin: 0; padding: 0; }
	.hotspot a { display: block; width: 9px; height: 8px; text-decoration: none; padding: 10px; }

	.us { position: absolute; bottom: 495px; left: 565px; width: 13px; height: 11px; }

	#hotspot-info {
    position:absolute;
    z-index:9999;
    color:#fff;
    font-size:9px;
    width:97px;
		text-decoration: none;
	}

	#hotspot-info .hotspot-info-header { height:10px; background:url(img/hotspot-info-header.png) no-repeat; }
	/* IE hack */
	*html #hotspot-info .hotspot-info-header { margin-bottom:-6px; }

	#hotspot-info .hotspot-info-body { background-color:#f89829; padding:0 10px; min-height: 75px; }
	#hotspot-info p { margin: 0; padding: 0; }
	.hotspot-info-body span {
		font-size: 10px;
 		font-weight: bold;
		line-height: 18px;
		display: block;
		border-bottom: 1px solid #fff;
		margin-bottom: 5px;
	}

	#hotspot-info .hotspot-info-footer { height:33px; }
	#hotspot-info.left .hotspot-info-footer { background:url(img/hotspot-info-footer-left.png) no-repeat; }
	#hotspot-info.right .hotspot-info-footer { background:url(img/hotspot-info-footer-right.png) no-repeat; }

/* Intro */

	#intro {
		position: absolute;
		left: 50%;
		top: 50%;
		padding: 0;
		width: 1000px;
		height: 700px;
		margin-left: -500px;
		margin-top: -350px;
	}
	#intro a {
		position: absolute;
		left: 50%;
		top: 50%;
		margin: 0 auto;
		height: 500px;
		width: 500px;
		margin-left: -250px;
		margin-top: -250px;
	}

	.boxed { border: 5px solid #f89829; border-radius: 10px; margin-bottom: 20px; }
	.boxed h2, .boxed ul { width: 660px; margin:  20px auto; }

	ul.nail-art li { float: left; width: 315px; list-style: none; }
	ul.nail-art li.even { margin-left: 20px !important; width: 325px !important; }

	ol#steps { margin: 0 0 0 20px; padding: 0 0 10px 0; }
	ol#steps li {
		list-style: decimal;
		float: left;
		width:160px;
		margin: 0 100px 0 0;
		padding: 0;
		font-family: 'CenturyGothicBold';
		font-size: 14px;
		font-weight: bold;
		color: #F89728;
	}
	ol#steps li.last { margin: 0; }
	ol#steps li h2 { margin: 0 0 5px 0; }
	ol#steps li p { font: 12px 'CenturyGothicRegular', Helvetica, sans-serif; color: #909C96; }

	ul.bullets { margin-left: 20px; }
	ul.bullets,
	ul.bullets li { list-style: disc !important; }

	.corporate { width: 40%; float: left; }
	.corporate ol { list-style: decimal; margin-left: 20px; }
	.corporate ol li { font-family: 'CenturyGothicBold', Helvetica, sans-serif; margin-bottom: 10px; }
	.corporate ol li ul { list-style: none !important; padding-left: 0 !important; margin-left: 0 !important; }
	.corporate ol li ul li { list-style: none !important; font-family: 'CenturyGothicRegular', Helvetica, sans-serif; padding-left: 0 !important; margin-left: 0 !important; }

	.corporate ol li ul li:before {
		content: '\2013';
		margin-right: 5px;
	}
