/* Global Styles */

* { margin:0px; padding:0px; outline:0; }
html, body { height: 100%; }
body { font-size:0.7em; font-family: Arial, Helvetica, sans-serif; color:#fff; line-height:1.4em; }
h1 { font-weight:bold; font-size:1.9em; font-family: Helvetica, Arial, sans-serif; }
h2 { font-size:1.6em; color:#fff; font-weight:bold; }
h3 { font-size:1.4em; color:#758C9A; font-weight:bold; }
h6 { font-size:.85em; color:#333; }
a { color:#84cfe7; text-decoration:none; font-weight:bold; }
a:hover { color:#99ff00; text-decoration:none; font-weight:bold; }
hr { float:left; background:#F35901; height:1px; width:100%; border:0; }
img { border:none; }
i { display:none; }
li { list-style:square; margin-left:20px; }
td { text-align:left; padding:2px; }
th { text-align:left; color:#fff; padding:2px; }
input { width:240px; font-size:1em; }
input, textarea, select { border:1px solid #fff; font-size:1em; font-family:Verdana, Arial, Helvetica, sans-serif; background:#FF6600; }
input:hover, textarea:hover, select:hover { border:1px solid #ff6600; background:#f7cf3a; }

/* Headings */

.homepage_heading, .our_clients_heading { color:#FF6600; }
.about_heading { color:#FF6600; }
.contact_heading { color:#FF6600; }
.work_with_us_heading { color:#FF6600; }
.about_sub_heading { color:#18a4a9; font-size: 1.4em; margin: 15px 0 13px 0; }
.contact_sub_heading { color:#18a4a9; font-size: 1.4em; margin: 15px 0 13px 0; }
.clients_sub_heading { color:#18a4a9; font-size: 1.4em; margin: 15px 0 13px 0; }
.work_with_us_sub_heading { color:#84cfe7; font-size: 1.4em; margin: 15px 0 13px 0; }
.selectButton { width:auto; padding:1px; color:#000; font-weight:bold; }

/* Containers */

#outer-container { width:881px; margin:0 auto; }
#container { /*padding-bottom:200px;*/ }

/* Backgrounds */

.homepage-bg1 { background:url(../../images/bgs/homepage_bg1.jpg) #232E34 center top fixed no-repeat; }
.homepage-bg2 { background:url(../../images/bgs/homepage_bg2.jpg) #232E34 center top fixed no-repeat; }
.homepage-bg3 { background:url(../../images/bgs/homepage_bg3.jpg) #232E34 center top fixed no-repeat; }
.homepage-bg4 { background:url(../../images/bgs/homepage_bg4.jpg) #232E34 center top fixed no-repeat; }
.about_bg { background:url(../../images/bgs/woman_bg.jpg) #232E34 center top fixed  no-repeat; }
.what_we_do_bg { background:url(../../images/bgs/pool.jpg) #232E34 center top fixed  no-repeat; }
.contact_bg { background:url(../../images/bgs/mountain_bg.jpg) #232E34 center top fixed  no-repeat; }
.our_clients_bg { background:url(../../images/bgs/people_sky.jpg) #232E34 center top fixed  no-repeat; }
.work_with_us_bg { background:url(../../images/bgs/work_with_us.jpg) #232E34 center top fixed  no-repeat; }
.adv_bg { background:url(../../images/bgs/contact2_bg.jpg) #232E34 center top fixed  no-repeat; }
.dove_bg { background:url(../../images/bgs/dove.jpg) #232E34 center top fixed  no-repeat; }
.dyrup_bg { background:url(../../images/bgs/dyrup.jpg) #232E34 center top fixed  no-repeat; }
.blu_bg { background:url(../../images/bgs/bluefin.jpg) #232E34 center top fixed  no-repeat; }
.qiib_bg { background:url(../../images/bgs/qiib.jpg) #232E34 center top fixed  no-repeat; }
.hbm_bg { background:url(../../images/bgs/hbm1_bg.jpg) #232E34 center top fixed  no-repeat; }
.pachin_bg { background:url(../../images/bgs/pachin.jpg) #232E34 center top fixed  no-repeat; }
.msi_bg { background:url(../../images/bgs/adviser.jpg) #232E34 center top fixed  no-repeat; }
.superted_bg { background:url(../../images/bgs/superted_bg.jpg) #232E34 center top fixed  no-repeat; }
.bridge_bg { background:url(../../images/bgs/about_bg_.jpg) #232E34 center top fixed  no-repeat; }
.flutes_bg { background:url(../../images/bgs/flutes.jpg) #232E34 center top fixed  no-repeat; }
.origins_bg { background:url(../../images/bgs/origins_bg.jpg) #232E34 center top fixed  no-repeat; }
.sapin_bg { background:url(../../images/bgs/sapin.jpg) #232E34 center top fixed  no-repeat; }
.wyevale_bg { background:url(../../images/bgs/wyevale.jpg) #232E34 center top fixed  no-repeat; }
.summit_bg { background:url(../../images/bgs/summit.jpg) #232E34 center top fixed  no-repeat; }
.tamangang_bg { background:url(../../images/bgs/tamangang.jpg) #232E34 center top fixed  no-repeat; }
.bg-opacity { position: absolute; height: 100%; width: 100%; padding-bottom:40px; background: url(../../images/bgs/our_clients_opacity.png) repeat; z-index: 2; left: 0; top: 0; }

/* Top */

#logo { position: absolute; height: 215px; width: 216px; right: 9px; z-index: 4; }
#logo-print { display:none }
a.button-services { display:block; overflow: hidden; background:url(../../images/buttons/web_development_internet_video_digital_design.png) no-repeat; left:0; margin-top:5px; height:24px; width:216px; }
a.web-development { background-position: 0 0; }
a.web-development:hover { background-position: 0 -74px; }
a.internet-video { background-position: 0 -25px; }
a.internet-video:hover { background-position: 0 -98px; }
a.digital-design { background-position: 0 -49px; }
a.digital-design:hover { background-position: 0 -123px; }

/* Left */

#left { position:relative; float:left; width:159px; /*height:100%;*/ padding-bottom:40px; background: #232e34; }
.internet-video { height:1100px; }
.left-buttons { position:relative; margin-bottom:40px; float:left; width:100%; padding: 100px 0 0 0; }
.left-buttons li { list-style:none; margin-left:0; }
.left-buttons li a { display:block; width:159px; height:35px; overflow: hidden; background: url(../../images/our_clients/our_clients_buttons.gif) no-repeat; cursor:pointer }
.left-buttons li a.button-home { background-position: 0 0; }
.left-buttons li a.button-home:hover { background-position: 0 -180px }
.left-buttons li a.button-about { background-position: 0 -31px; }
.left-buttons li a.button-about:hover { background-position: 0 -211px }
.left-buttons li a.button-what-we-do { background-position: 0 -61px; }
.left-buttons li a.button-what-we-do:hover { background-position: 0 -241px }
.left-buttons li a.button-our-clients { background-position: 0 -92px; }
.left-buttons li a.button-our-clients:hover { background-position: 0 -272px }
.left-buttons li a.button-work-with-us { background-position: 0 -123px; }
.left-buttons li a.button-work-with-us:hover { background-position: 0 -303px }
.left-buttons li a.button-contact { background-position: 0 -154px; }
.left-buttons li a.button-contact:hover { background-position: 0 -334px }
.left-buttons ul.headlink { position:relative; display:none; top:0; left:0; clear:both; text-align: left; z-index:999; background:#232E34; }
.left-buttons ul.headlink li { width:100%; height:auto; text-align:right; }
.left-buttons ul.headlink li a { display:block; height:100%; padding:5px; width:148px; background:#232E34; color:#fff; font-weight:bold; text-decoration:none; }
.left-buttons ul.headlink li:hover a { background:#89E307; color:#000; }

body#home .left-buttons li a.button-home { background-position: 0 -360px }
body#about .left-buttons li a.button-about { background-position: 0 -391px }
body#what-we-do .left-buttons li a.button-what-we-do { background-position: 0 -422px }
body#our-clients .left-buttons li a.button-our-clients { background-position: 0 -360px; }
body#work-with-us .left-buttons li a.button-work-with-us { background-position: 0 -481px }
body#contact .left-buttons li a.button-contact { background-position: 0 -513px }

/* Homepage */

#slideshow { overflow:hidden; width:590px; }
#slideshow ul { width:1030px; }
#slideshow li { cursor:pointer; float:left; margin:0 16px; list-style:none; }
#slideshow a { color:#fff; text-decoration:none; }
a.button-slideshow-prev { position:absolute; display:block; width:47px; height:77px; background:url(../../images/home/arrow_left.png) no-repeat; left: -34px; top: 74px; pointer:cursor; z-index:999}
a.button-slideshow-prev:hover { background-position: -3px -76px }
a.button-slideshow-next { position:absolute; display:block; width:47px; height:77px; background:url(../../images/home/arrow_right.png) no-repeat; right: -34px; top: 74px; pointer:cursor; z-index:999}
a.button-slideshow-next:hover { background-position:  3px -76px }
#screen2 { position:relative; float:left; padding:20px; clear:both; margin-top:50px; margin-bottom:10px; width:590px; left: 40px; background:#232E34; z-index:3; }

/* About us */

#focus-how-why-content { margin-top:40px; position:relative; left: 0; clear:both; background-color: #232E34; }
.focus-how-why-buttons-container { position:relative; float:left; width:432px; height:20px; }
a.focus-how-why-buttons { position:absolute; top:0; display:block; height:20px; background:url(../../images/buttons/focus_why_how.gif); }
a.button-focus { width:85px; background-position:top left; left:0; }
a.button-focus:hover { width:85px; background-position:bottom left; }
a.button-how { width:85px; background-position:-180px 0; left:190px; }
a.button-how:hover { width:85px; background-position:-180px -20px; }
a.button-why { width:69px; background-position:top right; right:0; }
a.button-why:hover { width:69px; background-position:bottom right; }
.focus-how-why-block { position: absolute; margin-top:100px; width: 432px; left: 40px; z-index: 2; background: url(../../images/bgs/our_clients_opacity.png) transparent; padding: 23px; }
#print-focus-how-why { display:none; }

/* Main */

#main { position:relative; float:left; width:722px; }
.block-content { position: relative; width: 350px; margin-top: 110px; right: 22px; background: #232E34; /*background: url(../../images/bgs/our_clients_opacity.png) repeat;*/ float: left; left: 0; padding: 23px; z-index: 3; }
.block-content-our-clients { margin-top:110px; }
.block-content-clients { margin-top:220px; width:650px; height:470px; }
.block-content-what-we-do { margin-top:200px; width:628px; }
.block-content-video-services { margin-top:20px; width:628px; }
.content-left { position:relative; float:left; width:341px; margin-right:22px; }
.content-right { position:relative; float:left; width: 264px; }
.content-full { position:relative; float:left; width: 627px; }
.screenshot-blocks { position:relative; float:left; width:120px; margin-right:49px; }
.left { position:relative; float:left; margin-right:53px; }
.right { position:relative; float:left; }
#interface { height:210px; }
#balloon { position: absolute; left: 645px; top: 418px; z-index: 1; }
#balloonIE7 { position: absolute; height: 200px; width: 135px; left: 591px; top: 154px; z-index: 1; }
.mainAreaLoading { position: absolute; top: 0px; left: 0px; width: 450px; height: 500px; background: #000; z-index: 1; }
.loading { position: relative; top: 100px; left: 175px }

/* Work with us */

a.work-with-us-tabs { position:absolute; display:block; background: #232E34; color:#fff; padding:8px; font-size:1.4em; font-weight:bold; text-decoration:none; }
a.work-with-us-tabs:hover { color:#F35901; }
a.tab-web-development { top: -31px; left: 0; }
a.tab-internet-video { top: -31px; left: 165px; }
a.tab-digital-design { top: -31px; left: 297px; }
a.tab-active { color:#89E307; }

/* What we do */

#featured-project-scroll .featured-projects { overflow:hidden; position: relative; }
#featured-project-scroll .featured-projects ul { height:230px; }
#featured-project-scroll .featured-projects li { list-style:none; margin:0; clear:both; padding-bottom:5px; }
a.previous-project { position:absolute; display:block; left:0px; width:22px; height:11px; background:url(../../images/what_we_do/web_development/buttons_up_down.gif) no-repeat; overflow: hidden; }
a.previous-project:hover { background-position: 0 -12px }
a.next-project { position:absolute; display:block; left:24px; width:22px; height:11px; background:url(../../images/what_we_do/web_development/buttons_up_down.gif) no-repeat -25px 0; overflow: hidden; }
a.next-project:hover { background-position: -25px -12px }

/* Links */

a.green-links { color:#89E307 }

/* Forms */
	
ul.forms { float: left; list-style: none; width: 100%; border-top:1px dotted #F35901; padding-top:20px; }
ul.forms li { clear: left; float: left; margin-bottom: 15px; width: 100%; list-style:none; font-weight:bold; }
ul.forms label { cursor: pointer; display: block; float: left; padding-right: 20px; text-align: right; width: 66px; }
ul.forms textarea { width:240px; }
ul.forms .error { position:relative; left:86px; clear:both; margin-top:4px; float: left; font-weight:bold; color:#95231C; background:#F7CF3A; padding:2px 4px 2px 4px; }

/* Footer */

#footer-container { position:relative; float:left; width:100%; min-height:220px; height:auto !important; height:220px; clear:both; background:#232E34; }
#footer { position:relative; width:900px; margin:0 auto; left:40px; }
#footer ul { position:relative; float:left; left:0; top:20px; }
#footer li { position:relative; float:left; left:0; margin:0 30px 0 0; list-style:none; }
#footer li.first { width:180px; }
#footer li.second { width:100px; }
#footer li.third { width:200px; }
#footer li.fifth { width:240px; }
.twitter { position:relative; float:left; top: 20px; left: 0;  }
.twitter-icon { position:relative; float:right; margin:-12px 0 0 0; }
#twitter_update_list li { padding:0; margin:0; text-align:left; }

/* Forms and Misc */

.image-opacity, .pointer { cursor:pointer }
.floatLeft { float:left }
.floatRight { float:right }
.noMargin { margin:0; }
.selectButton { width:auto; background:transparent; color:#F35901; font-weight:normal; font-size:2em; padding-top:2px; border:none !important; }
.selectButton:hover { color:#F7CF3A }
.selectButton::-moz-focus-inner { padding:0; border: 0; }
.radio { width:11px; border:0; background:#E5E5FF; }
.subHead { font-size:1em; color:#888; }
.errorText { font-size:1em; color:#f00; font-weight:bold; }
.clearBoth { clear:both; }
.warning { font-weight:bold; color:#f00; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }