*-----------------------------------------------------------------------------
	DEFAULT GLOBAL
-----------------------------------------------------------------------------*/

* {margin: 0; padding: 0;}

body {margin: 0 auto; font: 80% helvetica,arial,sans-serif; color: #333333; background: #ffffff; text-align: center;}

/*body {margin: 0 auto; font: 80% verdana,arial,helvetica,sans-serif; color: #333333; background: #ffffff; text-align: center;}*/

.smaller {font-size: 0.9em;}
.smallest {font-size: 0.8em;}
.larger {font-size: 1.1em;}
.largest {font-size: 1.2em;}

.left {text-align: left;}
.center {text-align: center;}
.right {text-align: right;}
.top {vertical-align: top;}
.middle {vertical-align: middle;}
.bottom {vertical-align: bottom;}
.floatleft {float: left;}
.floatright {float: right;}

p {margin: 0 0 0.9em 0;}
img {border: 0;}

.strong {font-weight: bold;}
.em {font-style: italic;}
.hide {display: none;}
.block {display: block;}
.inline {display: inline;}
.none {display: none;}

.cap {text-transform: capitalize;}
.ucase {text-transform: uppercase;}
.lcase {text-transform: lowercase;}

hr {margin: 1em 0 1em 0; background: #eeeeee; width: 100%; height: 1px; color: #eeeeee; border: none; clear: both;}
.hr {margin: 1em 0 1em 0; border-top: 1px solid #eeeeee;}
	.hr hr {display: none;}
	
.clear {position: relative; width: 100%; clear: both; line-height: 0; height: 0; display: block;}

/* for flash and similar */
embed, object {position: relative; z-index: 0;}

/*-----------------------------------------------------------------------------
	TABLES
-----------------------------------------------------------------------------*/

table, td, th {vertical-align: top; text-align: left; font-size: 1em;}

/*-----------------------------------------------------------------------------
	DEFAULT LINKS
-----------------------------------------------------------------------------*/

a {color: #999999; text-decoration: none; cursor: pointer;}
	a:hover {color: #333333;}
	a:focus {-moz-outline: none;}
	
/*-----------------------------------------------------------------------------
	DEFAULT HEADINGS
-----------------------------------------------------------------------------*/

h1, h2, h3, h4, h5, h6 {font-style: italic; font-weight: bold; text-transform: lowercase; padding: 0;}
	h1 em, h2 em, h3 em, h4 em, h5 em, h6 em {color: #666666;}

h1 {font-size: 2.5em; color: #cccccc; margin: 0 0 0.3em 0;}
h2 {font-size: 2.2em; color: #999999; margin: 0 0 0.3em 0;}
h3 {font-size: 2em; color: #000000; margin: 0 0 0.3em 0;}
h4 {font-size: 1.8em; color: #cccccc; margin: 0.5em 0 0.1em 0;}
h5 {font-size: 1.6em; color: #999999; margin: 0.5em 0 0 0;}
h6 {font-size: 1.4em; color: #000000; margin: 0.5em 0 0 0;}

/*-----------------------------------------------------------------------------
	DEFAULT LISTS
-----------------------------------------------------------------------------*/

ul {margin: 0 0 1em 1.5em;}
	ul li {margin: 0 0 0.3em 0;}
	ul.spaced li {margin: 0 0 1em 0;}
	
ol {margin: 0 0 1em 3em;}
	ol li {margin: 0 0 0.2em 0;}
	ol.spaced li {margin: 0 0 1em 0;}

/*----------------------------------------------------------------------------- 
Forms
-----------------------------------------------------------------------------*/

form {font-size: 1em;}

fieldset {margin: 0; border: none; padding: 0;}
label {padding: 0 5px 0 0;}

input, textarea, select {font: 1em Verdana, Arial, Helvetica, sans-serif; color: #666666; background: #eeeeee; margin: 0 0 3px 0; padding: 1px 2px 1px 2px; border: 1px solid #c1c1c1;}
	input:hover, textarea:hover, select:hover, input:focus, textarea:focus, select:focus {background: #ffffff; border: 1px solid #999999;}
	textarea {overflow: auto; height: 100px;}
	select {padding: 0;}

	input.btn {float: none; border: 1px solid #666666; color: #ffffff; background: #666666; margin: 20px 3px 10px 0; cursor: pointer; text-transform: uppercase; font-weight: bold; width: auto !important; padding: 2px 5px 2px 5px;}
		input.btn:hover {color: #666666; background: #ffffff;}
	
optgroup {font-style: normal;}
	optgroup option {padding: 0 0 0 10px;}

input[type="radio"], input[type="checkbox"], input.checkbox {width: auto !important; margin: 2px 2px 0 0}
input[type="hidden"] {display: none;}
select[multiple="multiple"] {margin-left: 0;}

form br {clear: both; line-height: 0; height: 0;}

form .required {border: 1px solid #990000;}
.error-message {font-weight: bold; color: #990000;}

form.custom1 {}
	form.custom1 fieldset {margin: 0 0 5px 0; border-top: 5px solid #666666; background: #f3f3f3; padding: 10px 10px 10px 10px;}
	form.custom1 input, form.custom1 textarea, form.custom1 select {width: 200px; float: left;}
		form.custom1 select {width: 208px;}
		form.custom1 input.file {border: none; width: 100%;}
	form.custom1 label {float: left; text-align: right; width: 200px;}

/*-----------------------------------------------------------------------------
	LAYOUT
-----------------------------------------------------------------------------*/

#container {position: relative; width: 990px; margin: 0 auto; text-align: left; background: transparent url(/images/bg.gif) 0 0 repeat-y;}

#container2 {padding: 0 10px 0 10px;}

#logo {float: left; display: block; margin: 20px 0 20px 0; color: #666666; background: transparent url(/images/logo_jabbawoki_2.gif) 10px 0 no-repeat; width: 580px;}
	#logo a {display: block; width: 190px; height: 46px;}
		#logo a span {display: none;}

#search {float: left; width: 190px; margin: 20px 0 0 5px;}

#toplinks {float: right; width: 185px; border-left: 1px solid #dddddd; margin: 10px 0 5px 5px; color: #666666;}
	#toplinks ul {list-style: none; margin: 5px 0 5px 0; padding: 0 0 0 10px;}
		#toplinks li {padding: 0 0 0 17px; background: transparent url(/images/bullet_2.gif) 10px 3px no-repeat;}
			#toplinks li.phone {padding: 0 0 2px 27px; background: transparent url(/images/phoneicon.gif) 10px 0 no-repeat; font-weight: bold; margin: 0.5em 0 0.3em 0;}

#header {float: left; clear: both; width: 970px; padding: 0 0 5px 0;}

#header-content {float: left; clear: both; width: 950px; padding: 10px 10px 5px 10px;}


#col1, #col2, #col3 {position: relative; float: left; width: 320px; height: 600px; overflow: hidden; margin: 0 0 0 5px;}
	#subpage #col1, #subpage #col2, #subpage #col3 {height: 150px;}

	#col1 {background: transparent url(/images/banners/bg_col1.jpg) 0 50% no-repeat; margin-left: 0;}

	#col2 {background: transparent url(/images/banners/bg_col2.jpg) 0 50% no-repeat;}

	#col3 {background: transparent url(/images/banners/bg_col3.jpg) 0 50% no-repeat;}
	
	#logo1, #logo2, #logo3 {position: absolute; top: 275px; left: 0; width: 100%; height: 50px; display: block; overflow: hidden;}
		#subpage #logo1, #subpage #logo2, #subpage #logo3 {top: 10px;}
	
		#logo1 span, #logo2 span, #logo3 span {display: none;}
		#logo1 p, #logo2 p, #logo3 p {text-align: center; font-size: 1em; font-style: italic; color: #333333; margin: 50px 0 10px 0;}
		#logo1 {background: #ffffff url(/images/logo_wokihost.gif) 50% 10px no-repeat;}
		#logo2 {background: #ffffff url(/images/logo_wokidev.gif) 50% 10px no-repeat;}
		#logo3 {background: #ffffff url(/images/logo_wokivps.gif) 50% 10px no-repeat;}

	#link1, #link2, #link3 {position: absolute; top: 0; left: 0; display: block; z-index: 10;}
		#link1 a, #link2 a, #link3 a {display: block; width: 320px; height: 600px;}
			#subpage #link1 a, #subpage #link2 a, #subpage #link3 a {height: 150px;}
		#link1 a span, #link2 a span, #link3 a span {display: none;}

#left {position: relative; float: left; clear: both; width: 315px; padding: 20px 0 20px 5px; font-size: 1em;}

#left .nav, .nav * {margin: 0; padding: 0; list-style: none;}
#left .nav {line-height: 1em;}

#left .nav ul {position: absolute; top: -999em; width: 10em;}
#left .nav ul ul {width: 11em;}

#left .nav a {display: block;}

#left .nav li:hover ul, ul.nav li.sfHover ul {left: 0; top: 3em;}

#left .nav li:hover li ul, .nav li.sfHover li ul {top: -999em;}

#left .nav li li:hover ul, ul.nav li li.sfHover ul {left: 11em; top: 0;}

/*** ORIGINAL SKIN ***/
#left .nav {float: left; font-size: 1.1em;}

#left .nav li {width: auto; font-weight: normal;}
	#left .nav li a {color: #666666; padding: 1em 0.75em 1em 0.75em; width: auto;}
	#left .nav li:hover, .nav li.sfHover, .nav li a:hover {color: #000000; background: #eeeeee;}

#left .nav li li {border-bottom: 1px solid #ffffff; background: #eeeeee; font-weight: normal;}

#left .nav li li a {color: #666666; padding: 0.4em 0.75em 0.4em 0.75em; width: 16em;}

#left .nav li li:hover, .nav li li.sfHover, .nav li li a:hover {color: #ffffff; background: #666666;}

#main {float: left; width: 630px; padding: 20px 0 20px 5px; font-size: 1em;}

#middle {clear: both; width: 960px; height: 0; margin: 0 0 0 10px; overflow: visible; visibility: visible; display: inline-table;}
	#middle .head{float: left; width: 450px; margin: 0 20px 10px 10px;}
	#middle .bread{float: left; width: 450px; margin: 0 20px 10px 10px; color: #999999; text-align: right;}
	#middle .col{float: left; width: 450px; margin: 0 20px 10px 10px;}
	#middle .tab{float: left; width: 950px; margin: 0 20px 10px 10px;}

#footer {clear: both; width: 950px; background: #ffffff url(/images/bg_footer.gif) 0 0 no-repeat; padding: 10px 20px 20px 20px; color: #666666;}
	#footer a {color: #999999;}
		#footer a:hover {color: #666666;}

/*-----------------------------------------------------------------------------
	TOP NAVIGATION
-----------------------------------------------------------------------------*/

#nav {float: left; clear: both; width: 970px; background: transparent url(/images/bg_nav.gif) 0 0 repeat-x; margin: 0;}

#seoimages ul {text-align: center; list-style: none;}
	#seoimages li.first {display: inline; margin-left: -20px;}
	#seoimages li {display: inline; margin-left: 30px;}

/**#seolist ul {font-size: 1.2em;}**/


.logos {float: right;}
    
.logos a {float: left; margin-left: 5px; height: 47px; background-repeat: no-repeat; filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=1);}
    
.logos a:hover {filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=0)}
    
.logos a span {display: none; }
    
a.aimia {width: 77px; background-image: url(/images/logo/aimia.png);}
    
a.microsoft {width: 77px; background-image: url(/images/logo/microsoft.png);}

a.awia {width: 77px; background-image: url(/images/logo/awia.png);}

a.iia {width: 77px; background-image: url(/images/logo/iia.png);}
