/* CSS Document */
body {
	background:#ccc url(../images/wk-bg.jpg) repeat-x;
	font-family:Arial, Helvetica, sans-serif;
	margin:0;
	padding:0;
	color:#000;
}

#container {
	margin:0 auto;	
}

h2 { font-size:28px; padding:15px 0; font-weight:bold; }

/*h2.tech { color:#3fc8d9; }
h2.app { color:#ef3d3e; }
h2.research { color:#3dbc86; }
h2.program { color:#d7cf3d; }
h2.data { color:#ecb43d; }*/


h3 {
	font-size:18px;
	padding:8px 0;
	font-weight:bold;
}

#content img.left { float:left; }
.left { float:left; }
.right {float:right; }

strong { font-weight:bold; }

p { margin:15px 0; line-height:13pt; font-size:9pt; }
	
p, li { font-size:9pt; }

p.intro { font-weight:bold; }

ul, ol { margin:10px 0 20px; }

li { color:#000; margin:5px 0 0 15px; list-style:outside; list-style-type:disc; line-height:20px; }

a { color:#0000EE; text-decoration:none; }

a:hover { color:#006699; text-decoration:underline; }


.center { text-align:center !important; }
.clear { clear:both; }

/* ---------- HEADER ----------- */
#header {
	width: 100%;
	margin:0 auto;
	height:80px;
	padding:0;
	/*background-color:#f2f2f2;*/
}

#header-app, #header-contact { background: url(../images/world-red.jpg) no-repeat top left; height:80px; }
#header-home { background: url(../images/world-blue.jpg) no-repeat top left; height:80px; }
#header-program, #header-calculator { background: url(../images/world-yellow.jpg) no-repeat top left; height:80px; }
#header-research, #header-company { background: url(../images/world-green.jpg) no-repeat top left; height:80px; }
#header-data { background: url(../images/world-orange.jpg) no-repeat top left; height:80px; }
#header-tech, #header-dashboard { background: url(../images/world-teal.jpg) no-repeat top left; height:80px; }




#header-container {
	width:850px;
	margin:0 auto;
	position:relative;
}

#header-container h1 a{
	display: block; /* Allows you to change the width and height of the image */
	height: 83px;
	width: 405px;
	text-indent: -9999em; /* Hides the text in the h1 tag */
	text-decoration: none; /* Hides the underline of the hyperlink */
	z-index: 1000; /* IE Fix*/
	background:url(../images/worldklass-logo.png) no-repeat; /* The pathway to the image*/
}

#app-hire {
	position:absolute;
	top:10px;
	right:15px;
	color:#333;
	z-index:2000;
	font-size:13px;
}

#app-hire a {
	color:#333;
	font-weight:bold;
	text-decoration:none;
	margin:0 3px;
}

#app-hire a:hover {
	color:#069;
}

.tagline { position:absolute; top:50px; right:20px; font-size:20px; font-weight:bold; font-style:italic; color:#197FDD;}

/* ---------- NAV ----------- */
#nav {
	margin:0;
	padding:0;
	height:30px;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	font-size:17px;
	color:#ccc;
	
}

#nav ul {
	width:880px;
	margin:0 auto;
	padding:0;
	padding-top:6px;
	background: url(../images/nav-bg.jpg) no-repeat -17px 2px;
}

#nav li {
	display:inline;
	margin:0 27px;
}

#nav li a:link, #nav li a:visited {
	color:#666;
	font-size:15px;
	text-decoration:none;
	font-weight:bold;
}

#nav li a:hover {
	color:#333;
}
#current-nav.tech { color:#1795c1 !important; }
.tech:hover { color:#1795c1 !important; }

#current-nav.apps { color:#ff5750 !important; }
.apps:hover { color:#ff5750 !important; }

#current-nav.research { color:#29CF08 !important; }
.research:hover { color:#29CF08 !important; }

#current-nav.program { color:#CFC500 !important; }
.program:hover { color:#CFC500 !important; }

#current-nav.data { color:#B37F04 !important; }
.data:hover { color:#B37F04 !important; }


.top-current-nav { color:#f2f2f2 !important; background-color:#324f5d; padding:10px 5px 0px 5px; }


/* ---------- SUBNAV ----------- */
#subnav {
	margin:0;
	padding:0;
	position:absolute;
	top:-5px;
	right:0px;
	width:460px;
}

#subnav.home-sub { display:none; }

#subnav li {
	display:inline;
	margin:0 14px;
	float:left;
}


/* ---------- CONTENT ----------- */
#content {
	margin:15px auto;
	width:930px;
	position:relative;
}

#content p {
	padding:5px 0;
}

#content img { margin:3px; float:right; }

#images li { list-style-type:none; }




.applicationbox {
	height:100%;
	width:650px;
	float:left;
	margin-left:30px;
}
.applicationbox img {
	float:left;
	padding:8px;
}
.apptext {
	width:auto;
	padding:5px;
	color:#333;
	font-size:.9em;
}
.title {
	font-size:1.2em;
	color:#039;
}

.button {
	display: inline-block;
	margin:3px auto;
	height:50px;
	width:195px;
	text-indent:-9999em;
}

/*.dashboard { background: url(../images/subnav-dashboard.png) no-repeat 0 0px; }
.calculator { background: url(../images/subnav-calculator.png) no-repeat 0px 0px; }*/

.awesome img { margin:0px 8px -4px -5px !important; }
.awesome:hover { background-color: #eee; text-decoration:none; }

#images img { height:225px; margin:0 !important; width:825px; }

.logos li { display:inline; margin:0 2px; }
.logos li a { text-decoration:none; }

ul.blue li { list-style-image: url(../images/bullet-blue.png); }
ul.red { width:155px; float:left; }
ul.red li { list-style-image: url(../images/bullet-red.png); }
ul.yellow li { list-style-image: url(../images/bullet-yellow.png); }

/* ---------- INFO ----------- */
.info {
	width:260px;
	display:block;
	float:left;
	padding:5px 10px;
	text-align:left;
	color:#333;
	font-size:.9em;
	line-height:1.1em;
	border-right:1px solid #ccc;
}

.info.last { border:none; }


.info h2 {
	color:#069;
	font-size:17px;
	font-family:"Trebuchet MS";
	font-weight:bold;
	text-align:center;
	text-transform:uppercase;
}

.info p {
	margin-top:10px;
}

.info a {
	color:#999;
}

.info ul {
	margin-top:10px;
	list-style-type:disc;
	margin-left:30px;
}

.info li {
	margin:6px 0;
}
.empha {
	font-size:1.1em;
	color:#069;
}

/* ---------- NEWS ----------- */
.news {
	width:300px;
	display:block;
	float:right;
	margin:8px 5px;
	text-align:left;
	color:#333;
	font-size:.9em;
	line-height:1.1em;	
}
.news h2 {
	color:#069;
	font-size:1.1em;
	font-family:"Trebuchet MS";
	font-weight:bold;
	text-align:center;
	text-transform:uppercase;	
}
.news p {
	clear:both;	
}
.news a {
	color:#999;	
}
.date {
	float:right;
	color:#069;
	padding:2px;
}

.right {
	float:right;
	font-size:.8em;
}

/* - - - - - - APPLICATIONS IMAGES - - - - - - */

ul.polaroids { width: 740px; margin:0; float:right; }
		ul.polaroids li { display: inline; }
		ul.polaroids a { background: #fff; 
		display: inline; float: left; margin: 0 0 27px 30px; 
		width: auto; padding: 10px 10px 15px; text-align: center; 
	    text-decoration: none; color: #333; font-size: 18px; 
		-webkit-box-shadow: 0 3px 6px rgba(0,0,0,.25); 
		-moz-box-shadow: 0 3px 6px rgba(0,0,0,.25); 
		-webkit-transform: rotate(-2deg); 
		-webkit-transition: -webkit-transform .15s linear; -moz-transform: rotate(-2deg); }
		
		ul.polaroids img { display: block; width: 190px; margin-bottom: 12px; }
		ul.polaroids a:after { content: attr(title); }
		
		ul.polaroids li:nth-child(even) a { -webkit-transform: rotate(2deg);  -moz-transform: rotate(2deg); }
		ul.polaroids li:nth-child(3n) a { -webkit-transform: none; position: relative; top: -5px;  -moz-transform: none; }
		ul.polaroids li:nth-child(5n) a { -webkit-transform: rotate(5deg); position: relative; right: 5px;  -moz-transform: rotate(5deg); }
		ul.polaroids li:nth-child(8n) a { position: relative; right: 5px; top: 8px; }
		ul.polaroids li:nth-child(11n) a { position: relative; left: -5px; top: 3px; }
		
		ul.polaroids li.messy a { margin-top: -375px; margin-left: 160px; -webkit-transform: rotate(-5deg); -moz-transform: rotate(-5deg); }
		
		ul.polaroids li a:hover { -webkit-transform: scale(2.00);
		-moz-transform: scale(2.00); -webkit-box-shadow: 0 3px 6px rgba(0,0,0,.5); 
		-moz-box-shadow: 0 3px 6px rgba(0,0,0,.5); position: relative; z-index: 5; }

/* ---------- FOOTER ----------- */
.footer-bg {
	width:100%;
	color:#ccc;
	text-align:center;
	font-size:.8em;
	height:23px;
	background:url(../images/footer-gradient.png) repeat-x;
}

.footer-bg p { padding-top:2px; margin:0px; }

#footer-nav { 
	margin:0;
	padding:5px;
	height:21px;
	border-top:1px solid #ddd;
	color:#ccc; 
	clear:both;
	text-align:center;
}

#footer-nav ul {
	width:800px;
	margin:0 auto;
	padding:0;
	padding-top:6px;
}

#footer-nav li { display:inline; margin:0 27px; }
	#footer-nav li a { color:#ccc; }

#footer-nav li a:link, #footer-nav li a:visited {
	color:#666;
	font-size:15px;
	text-decoration:none;
	font-weight:bold;
}

#footer-nav li a:hover {
	color:#333;
}


/* ----------- CONTACT FORM ----------- */

#contact {
	display: block;
	width: 545px;
	margin: 20px 130px;
	padding: 15px;
	border: 1px solid #cbcbcb;
	background-color: #FFF;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
	float:left;
}
/* Form style */

label {
	display: inline-block;
	float: left;
	height: 26px;
	line-height: 26px;
	width: 130px;
	font-size: 16px;
	text-align: right;
	padding-right:13px;
}
input, textarea, select {
	margin: 0;
	padding: 5px;
	color: #666;
	background: #f5f5f5;
	border: 1px solid #ccc;
	margin: 5px 0;
	font:15px "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
input:focus, textarea:focus, select:focus {
	border: 1px solid #999;
	background-color: #fff;
	color:#333;
}
input.submit {
	cursor: pointer;
	border: 1px solid #222;
	background:#333;
	color:#fff;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
input.submit:hover {
	background:#444;
}
fieldset {
	padding:20px;
	border:2px solid #eee;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
	margin-top:15px;
}
legend {
	padding:7px 10px;
	font-weight:bold;
	color:#000;
	border:1px solid #eee;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
span.required {
	font-size: 13px;
	color: #ff0000;
} /* Select the colour of the * if the field is required. */
/* Style for the error message */

.error_message {
	display: block;
	height: 22px;
	line-height: 22px;
	background: #FBE3E4 url(../images/error.gif) no-repeat 10px center;
	padding: 3px 10px 3px 35px;
	margin: 10px 0;
	color:#8a1f11;
	border: 1px solid #FBC2C4;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
#succsess_page h1 {
	background: url(../images/success.gif) left no-repeat;
	padding-left:22px;
}

blockquote {
 background:#FFEE7C;
 border:1px solid #999;
color:black;
font-weight:bold;
padding:10px;
font-style:italic;
line-height:20px;
}

/* ----------- SAVINGS CALCULATOR ----------- */

#calculator {
	display: block;
	width: 620px;
	margin: 20px auto;
	padding: 20px;
	border: 2px solid #cbcbcb;
	background-color: #FFF;
	-moz-border-radius: 5px;
	-webkit-border-radius:5px;
}
/* Form style */

#calculator label {
	display: inline-block;
	float: left;
	height: 26px;
	line-height: 40px;
	width: 275px;
	font-size: 16px;
	text-align: right;
	padding-right:13px;
}

#calculator span {
	display: inline-block;
	float: left;
	height: 26px;
	line-height: 40px;
	width: 275px;
	font-size: 34px;
	font-weight:bold;
	color:#29CF08;
}