@import 'reset.css';

html, body {height:100%;}

body {
	text-align:center;
	font:normal 12px Arial,Helvetica,sans-serif;
	background:#6c6d6f url(/images/bg.jpg) 0 0 repeat-x;
	color:#444;
}

a {color:#fc7e23;}
a:hover {color:#fff;background-color:#fcb834;text-decoration:none;}

a.nohover {color:#fff;}
a.nohover:hover {color:#fff;background-color:#fff;text-decoration:none;}

.cln {display:block;overflow:hidden;clear:both;zoom:1;}
.px {height:1px;text-indent:-1000px;}
.inner {float:left;text-align:left;padding:20px;}
.right {float:right;}
.left {float:left;}
.hide {display:none;}

.rss {
	width:19px;
	height:19px;
	overflow:hidden;
	text-indent:-1000px;
	background:url(/images/rss.png) no-repeat;
}

.wrapper {
	width:960px;
	margin:0 auto;
	text-align:left;
	position:relative;
	overflow:hidden;
}
.main {
	background:#fff url(/images/bottom.png) 50% 100% no-repeat;
	padding-bottom:5px;
	}

/* TOP NAVIGATION */

.topmenu {
	height:25px;
	background:url(/images/topmenu.png) no-repeat;
	padding-left:631px;
}
.topmenu li {
	display:block;
	float:left;
}
.topmenu a {
	display:block;
	height:25px;
	line-height:25px;
	text-decoration:none;
	color:#ccc;
	text-transform:uppercase;
	font-size:9px;
	text-align:center;
}
.topmenu a:hover {color:#fff;background:none;}

.topmenu .t01 {width:120px;}
.topmenu .t02 {width:100px;}
.topmenu .t03 {width:85px;}
.topmenu .t04 {width:80px;}
.topmenu .t05 {width:120px;}

/* LOG & SLOGAN */

.logo, .slogan {
	position:absolute;
	top:44px;
	left:10px;
	width:238px;
	height:62px;
	overflow:hidden;
	background:url(/images/logo.png) 0 50% no-repeat;
}
.slogan {
	top:61px;
	left:572px;
	width:378px;
	height:34px;
	background-image:url(/images/slogan.png);
	text-indent:-1000px;
}
.logo a {
	display:block;
	height:62px;
	text-indent:-1000px;
	background-color:transparent !important;
}

/* MAIN MENU */

.menu {
	margin-top:100px;
	height:95px;
	padding:0 45px;
}
.menu, .menu a strong {
	background:url(/images/menu.png) 0 0 no-repeat;
	background-color:transparent !important;
	}
.menu li {
	display:block;
	float:left;
	height:95px;
	text-align:center;
	width:160px;
}
.menu li.active {
	background:url(/images/menu-arrow.png) 50% 100% no-repeat;
}
.menu a {
	display:block;
	height:75px;
	text-decoration:none;
}
.menu strong {
	display:block;
	height:45px;
	line-height:45px;
	overflow:hidden;
	text-indent:-1000px;
	cursor:pointer;
}
.menu .m01 a strong {background-position:-40px -95px;}
.menu .m02 a strong {background-position:-200px -95px;}
.menu .m03, .menu .m03 a, .menu .m03 a strong {
	width:185px;
	background-position:-360px -95px;
}
.menu .m04, .menu .m04 a, .menu .m04 a strong {
	width:195px;
	background-position:-543px -95px;
}
.menu .m05, .menu .m05 a, .menu .m05 a strong {
	width:170px;
	background-position:-738px -95px;
}
.menu .m01 a:hover strong {background-position:-40px -140px;}
.menu .m02 a:hover strong {background-position:-200px -140px;}
.menu .m03 a:hover strong {background-position:-360px -140px;}
.menu .m04 a:hover strong {background-position:-543px -140px;}
.menu .m05 a:hover strong {background-position:-738px -140px;}

.menu .m01.active a strong {background-position:-40px -185px !important;}
.menu .m02.active a strong {background-position:-200px -185px !important;}
.menu .m03.active a strong {background-position:-360px -185px !important;}
.menu .m04.active a strong {background-position:-543px -185px !important;}
.menu .m05.active a strong {background-position:-738px -185px !important;}

.menu span {
	display:block;
	height:30px;
	line-height:30px;
	color:#aeb0b2;
	text-transform:uppercase;
	font-size:12px;
	cursor:pointer;
}
.menu a:hover {background-color:transparent;}
.menu a:hover span {color:#fff;}


/* LEFT COLUMN */

.left-col {
	background:#f1f1f1;
	width:320px;
	margin-right:-640px;
	overflow:hidden;
	
}
* html .left-col {
	width:317px;
}
.left-col .inner {
	padding:0;
}

/* INFORMER */

.informer {
	background:#fcd68d url(/images/gr2.png) 0 0 repeat-x;
	height:160px;
}
.informer .inner {
	float:none;
	background:url(/images/info.png) 94% 0 no-repeat;
	padding-right:125px;
}

.informer p {
	line-height:17px;
	padding-bottom:10px;
}

/* TESTIMONIALS */

.testimonials {
	background:#dedede url(/images/gr1.png) 0 0 repeat-x;
	height:160px;
}
.testimonials blockquote {
	line-height:16px;
	padding:20px;
}
.testimonials blockquote b {
	width:32px;
	height:28px;
	overflow:hidden;
	display:block;
	float:left;
	text-indent:-100px;
	background:url(/images/qq.png) 4px 4px no-repeat;
	margin:0 8px 0 0;
}
.testimonials blockquote b.end {
	background-position:100% 100%;
	float:right;
}
.testimonials a.button {
	margin:0 20px;
}

/* REQUEST */

.request {
	background:#f5f5f5 url(/images/gr3.png) 0 0 repeat-x;
	padding:0 20px;
	font-size:11px;
	line-height:14px;
	height:175px;
}
.request h4 {
	color:#fc7e23;
	font-style:italic;
	display:block;
	line-height:33px;
	font-size:11px;
}

.request .left {
	width:125px;
	padding-top:10px;
}
.request .button {margin-top:15px;}

.request .contact {
	margin-left:135px;
	padding:10px 0 0 20px;
	background:url(/images/hr2.png) 0 0 no-repeat;
}

.request .contact dt {
	width:40px;
	float:left;
}
.request .contact dd {
	width:85px;
	float:left;
	margin-bottom:12px;
}

/* RIGHT COLUMN */

.right-col {
	width:640px;
	float:right;
	overflow:hidden;
}
* html .right-col {
	position:relative;
	left:-3px;
}
/* FOOTER */

.footer {
	height:35px;
	background:url(/images/footer.png) no-repeat;
}
.footer ul {
	padding:10px 0 0 10px;
	float:left;
}
.footer li {
	float:left;
	width:50px;
	text-align:center;
}
.footer li.f02 {width:65px;}
.footer li.f03 {width:69px;}
.footer li.f04 {width:79px;}
.footer li.f05 {width:70px;}
.footer li a {
	display:block;
	height:20px;
	line-height:20px;
	text-decoration:none;
	text-transform:uppercase;
	color:#ccc;
	font-size:10px;
}
.footer li a:hover {color:#fff;background:none;}
.f-logo {
	float:right;
	width:96px;
	height:26px;
	overflow:hidden;
	text-indent:-1000px;
	background:transparent url(/images/logo-small.png) no-repeat !important;
	margin:6px 20px 0 0;
}

/* BUTTONS */

.button, .button b {
	display:block;
	float:left;
	background-image:url(/images/buttons.png);
	text-transform:uppercase;
	height:24px;
	padding:0 0 0 4px;
	text-decoration:none;
	color:#fff;
	margin-right:10px;
	
}
.button b {
	display:block;
	height:24px;
	line-height:24px;
	background-position:100% 0;
	padding:0 10px 0 6px;
	float:left;
	font-weight:normal;
	font-size:10px;
	cursor:pointer;
	margin:0;
}

.button:hover b {color:#000;}

.button.t2 {background-position:0 -48px;}
.button.t2 b {background-position:100% -48px;}

.button.t3 {background-position:0 -24px;}
.button.t3 b {background-position:100% -24px;}

.button.t4 {background-position:0 -72px;}
.button.t4 b {background-position:100% -72px;color:#333;}

.button.t4:hover b {color:#000;}

/* HEADERS */

.header {
	overflow:hidden;
	text-indent:-1000px;
	background:url(about:blank) 0 50% no-repeat;
	height:22px;
}

.header.overview {
	background-image:url(/images/h-overview.png);
}
.header.ourprojects {
	height:35px;
	background-image:url(/images/h-projects.png);
	background-repeat:no-repeat;
}
.header.blog {
	height:25px;
	background-image:url(/images/h-blog.png);
	margin:0 20px 5px 20px;
}

/* PROJECTS */

.projects dt {
	font-size:20px;
	font-weight:bold;
	font-style:italic;
	color:#6b6c6e;
	margin-top:10px;
}
.projects p {
	line-height:16px;
	padding-bottom:15px;
}
.projects dd {
	border-bottom:2px solid #feeac2;
	padding-bottom:10px;
	margin-bottom:15px;
}

img.left {
	margin:0 20px 10px 0;
}
img.right {
	margin:0 0 10px 20px;
}

/* BLOG */

div.blog {
	background:#f1f1f1 url(/images/gr4.png) 0 0 repeat-x;
	position:relative;
	padding:20px 0;
}
.blog2 {
  	background:#fff;
	position:relative;
	padding:20px 0;
}

.blog dt, .blog2 dt {
	color:#fc7e23;
	font-style:italic;
	font-weight:bold;
	display:block;
	line-height:33px;
	padding:0 20px;
}
.blog dd, blog2 dd {
	font-size:11px;
	line-height:15px;
	padding:0 20px 15px 20px;
	margin-bottom:5px;
	background:url(/images/hr1.png) 50% 100% no-repeat;
}
.blog dd p, blog2 dd p {padding-bottom:5px;}
.blog dd i, blog2 dd i {
	font-size:10px;
	color:#777;
	font-style:italic;
}

/* POPUP */

.popup {
	position:fixed;
	width:100%;
	height:100%;
	left:0;top:0;
	background:#000;
	-moz-opacity:0.8;
	opacity:0.8;
	filter: alpha(opacity=80);
	z-index:9;
	overflow:hidden;
}
* html .popup {
		position:absolute;
		top:expression(((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+'px');
		}
.popup-inner {
	width:364px;
	height:427px;
	position:fixed;
	left:50%;top:50%;
	margin:-215px auto auto -182px;
	z-index:10;
	text-align:left;
	background:url(/images/popup.png) 0 0 no-repeat;
}
* html .popup-inner {
	position:absolute;
	top:expression(((e=document.documentElement.scrollTop)?e:document.body.scrollTop)+'px');
	margin-top:5%;
	background-image:url(/images/popup-ie.png);
}
.popup-inner .inner {
	float:none;
	padding:0 25px;
	font-size:.9em;
}
.popup-inner h2 {
	height:27px;
	margin:17px 0 21px 0;
	background:url(/images/h-request.png) 50% 0 no-repeat;
}
.popup-inner p {
	padding:15px 0;
	color:#3c3c3c;
	line-height:15px;
}
.popup-inner label {
	display:block;
	float:left;
	width:90px;
	height:22px;
	line-height:22px;
}
.popup-inner .error label {color:red;}
.popup-inner input {
	display:block;
	float:left;
	height:20px;
	line-height:20px;
	padding:0 4px;
	width:200px;
	font-size:12px;
	margin-bottom:12px;
}
.popup-inner textarea {
	float:left;
	height:80px;
	width:212px;
	font-size:12px;
	margin-bottom:12px;
}
.popup-inner .error input {background:#fee;border-color:red;}
.popup-inner form p {
	padding:0 0 0 90px;
}
.popup-inner form .button {
	margin-top:10px;
}

/* LEFT COL */

.left-content .inner {
	padding:15px 20px;
}
.left-content h3 {
	font:italic bold 23px Calibri,Arial,Helvetica,sans-serif;
	line-height:28px;
}
.left-content p {
	margin:0 0 10px 0;
	color:#666;
}

/* WHO WE ARE */

.left-content .photo {
  height: 60px;
}
.left-content .contact {
	margin-left: 70px;
    padding-top: 2px;
}

/* WHAT WE DO */

.rails_logo {
	background: url(/images/rails.png) 0 24px no-repeat;
	padding-left: 66px;
}
.perl_logo {
	background:  url(/images/perl.png) 0 24px no-repeat;
	padding-left: 66px;
}

/* WHAT WE HAVE DONE */

.rr {
	width: 600px;
	height: 100px;
	border: 1px solid red;
	float: left;
}
.desc {
	float: left;
	margin: 100px 0 0 240px;
}

.qype_logo {
	background: url(/images/logos/qype.png) 0 24px no-repeat;
	padding-left: 66px;

}
.frantic_logo {
	background: url(/images/logos/frantic.jpg) 0 20px no-repeat;
	padding-left: 66px;

}

/* CAREERS */
.careers ul {
  padding: 2px;

}
.careers li {
  list-style: square inside;
  padding: 1px;
}
.careers p {
  padding-bottom: 4px;
}

.el {
  color: black;
}
.el a:hover, .el:hover {
  color:black;
  border:none;
  text-decoration:none;