@charset "UTF-8";
/* CSS Document */


/* ===== COLORS ===== */
/* blue 		: #0166FF	*/
/* dark blue 	: #020660 	*/


/* ===== COMMON ===== */
html, body {
	background:#000000;
	height:100%;
	margin:0; 
	padding:0;
}

#page {
	/*background:url(img/bg.jpg) top no-repeat #202044;*/
	background:#202044;
	margin:0 auto;
	padding:0;
	position:relative;
	width:1000px;
	height:760px;
}

p {
	color:#FFF;
	font-size:12px;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	line-height:2em;
}

h1 {
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:18px;
	font-weight:bold;
}

h2 {
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:16px;
	font-weight:normal;
}

h3 {
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:normal;
}

a {
	color:#FFF;
	text-decoration:none;
}

a:hover {
	color:#436caf;
}

span {color:#FFF; font-size:12px; font-family:Arial, Helvetica, sans-serif; font-weight:bold;}
strong {font-weight:bold;}
em {color:#87C13F; font-style:normal;}
.clear {clear:both;}
.left {float:left;}
.right {float:right;}
.center {text-align:center;}

.mb-5 {margin-bottom:5px;}
.mt-5 {margin-top:5px;}
.mt-20 {margin-top:20px;}
.mt-30 {margin-top:30px !important;}
.mr-30 {margin-right:30px;}
.mr-80 {margin-right:80px;}
.mr-60 {margin-right:60px;}
.notop {margin-top:0;}
.nomargin {margin:0;}
.underline {text-decoration:underline;}
img {border:1px solid #fff;}
.noborder {border:none;}
ul {margin:0; padding:0;}

label {
	color:#FFF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:bold;
	display:block;
}

input {
	margin:0 0 15px;
	width:200px;
}

.btn {background:url(img/buttons/btn_bg.png) repeat-x; border:1px solid #000; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; display:block; height:27px; line-height:27px; padding:0 10px; color:#FFF !important; font-family:Tahoma, Geneva, sans-serif; font-size:14px; font-weight:bold; text-shadow:0 1px #000; width:100px; text-align:center; text-transform:uppercase; outline:none; cursor:pointer;}
.btn:hover {background:url(img/buttons/btn_bg2.png) repeat-x; text-decoration:none !important;}

/* ===== NAVIGATION ===== */

/*---- main nav index.html ----*/
#nav {background:url(img/navigation/main-nav.jpg); height:36px; margin:0 auto 80px auto; padding:0; width:814px;}
#nav ul { margin:0; padding:0;}
#nav li {float: left; list-style:none;}
#nav li a {
	background:url(img/navigation/main-nav.jpg);
	display: block;
	height: 36px;
	text-indent: -9009px;
}
#nav ul li#link0 a { width: 78px; background-position: 0px 0px; }
#nav ul li#link1 a { width: 143px; background-position: -78px 0px; }
#nav ul li#link2 a { width: 131px; background-position: -221px 0px; }
#nav ul li#link3 a { width: 150px; background-position: -352px 0px; }
#nav ul li#link4 a { width: 188px; background-position: -502px 0px; }
#nav ul li#link5 a { width: 124px; background-position: -690px 0px; }

#nav ul li#link0 a:hover { width: 78px; background-position: 0px -36px; }
#nav ul li#link1 a:hover { width: 143px; background-position: -78px -36px; }
#nav ul li#link2 a:hover { width: 131px; background-position: -221px -36px; }
#nav ul li#link3 a:hover { width: 150px; background-position: -352px -36px; }
#nav ul li#link4 a:hover { width: 188px; background-position: -502px -36px; }
#nav ul li#link5 a:hover { width: 124px; background-position: -690px -36px; }

#home #nav ul li#link0 a { width:78px; background-position: 0px -36px; }
#sample-projects #nav ul li#link1 a { width:143px; background-position: -78px -36px; }
#qualifications #nav ul li#link2 a { width:131px; background-position: -221px -36px; }
#protected-access #nav ul li#link3 a { width:150px; background-position: -352px -36px; }
#product-development #nav ul li#link4 a { width:188px; background-position: -502px -36px; }
#contact #nav ul li#link5 a { width:124px; background-position: -690px -36px; }
/*---- eof nav ----*/

#logo {margin:0 10px;}
#logo img {border:none;}

/*---- nav-sample-projects ----*/
#nav-sample-projects ul {float:left; margin:0 16px 0 40px; height:382px; width:220px;}
#nav-sample-projects li {list-style:none; padding:2px 0;}
#nav-sample-projects li a {display:block; font-family:Verdana, Geneva, sans-serif; font-size:11px; font-weight:normal; color:#436caf; padding:5px 20px; border:1px solid #151632; background:#3c528c;-webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; color:#FFF;}
#nav-sample-projects li a:hover {background:#FFF; color:#151632 !important;}
#nav-sample-projects li a.selected {background:url(img/common/pointer.gif) left no-repeat; color:#FFF; padding:5px 10px 5px 30px;}
#nav-sample-projects li a.selected:hover {color:#FFF !important;}
.hidden {display:none;}

/* ===== CONTENT ===== */
#content {margin-top:40px;}
/*---- Index.html ----*/
#imgBar {margin-top:40px;}
#imgBar a {float:left;}
#imgBar a img {border:none;}
.rborder {border-right:2px solid #fff;}
#download img {border:none; margin:-1px 0 0 5px;}
.size12, .size12 a {font-size:13px;}

/*---- sample-projects.html ----*/
#info {height:0;margin:0; padding:0;}
a.lightbox {margin:0; padding:0;}
a.lightbox img {border:1px solid #fff; border-collapse:collapse; height:188px; width:230px; margin:0; padding:0;}
#video { margin: 10px 10px 5px 280px; float:left;}
.video {float:left; margin:5px;}
.video img { border:none;}

/*---- qualifications.html ----*/
body#qualifications #page {height:840px;}
body#qualifications #content p, body#qualifications #content li {font-size:14px;}
.portrait {margin:0px 20px 0 40px;}
#qualifications #textBox {height:auto; margin-top:0; margin-bottom:20px; padding:0px 20px 10px 20px; width:550px;}
#qualifications #textBox p {margin-top:0; line-height:1.4em;}
#quallist {color:#fff; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:1.5em; margin-left:20px;}
#quallist li {margin:10px 0;}
.resume {margin:0 0 0 340px;}
.resume img {border:none; margin-top:20px;}

#cv-resume-btn {background:url(img/buttons/cv-resume.png) no-repeat; background-position:0 0; display:block; height:30px; width:110px;}
#cv-resume-btn:hover {background-position:bottom left;}
#vcard-btn {background:url(img/buttons/vcard.png) no-repeat; background-position:0 0; display:block; height:30px; width:110px;}
#vcard-btn:hover {background-position:bottom left;}
.mr-15 {margin-right:15px;}

/*---- contact.html ----*/
body#contact #page {height:890px;}
body#contact #content p {font-size:14px;}
#team {margin:0px 20px 0px 40px; float:left;}
#contact #textBox { height:auto; margin-top:0; padding:0 20px; margin-bottom:20px; width:480px; float:left;}
#contact #textBox p {line-height:1.4em;}
#contact #textBoxLarge {height:auto; margin-top:0; padding:0 60px 0 40px; width:auto;}
#contact #textBoxLarge p {line-height:1.4em;}
.addy {height:auto; width:195px; float:left;}
#email-link:hover {color:#fff; text-decoration:underline;}
#jobs {padding:0 0 0 30px; margin:0;}
#jobs li {color:#fff; font-size:14px; font-family:Arial, Helvetica, sans-serif; line-height:1.5em; margin:0;}

/*---- login.php / books.php ----*/
body#books #page {height:840px;}
body#protected-access #page {height:840px;}
body#books p, body#protected-access p {font-size:14px;}
#protected-access #textBox, #product-development #textBox  { height:300px; margin:0px auto; padding:0 70px; width:362px;}
#login2 {margin:00px 0 0 20px;}

#textBox2 {border-bottom:1px solid #FFF; height:auto; margin:0 auto 30px; padding:0 20px 15px; position:relative; width:880px;}
#textBox2 a {color:#436caf;}
#textBox2 a:hover {text-decoration:underline;}
.lastBox {border-bottom:none !important;}

.infiniteCarousel .wrapper {
  width: 744px; /* .infiniteCarousel width - (.wrapper margin-left + .wrapper margin-right) */
  overflow: auto;
  height:270px;
  margin: 0 68px;
  position: absolute;
  top: 0;
}

.infiniteCarousel ul img {
  border: 2px solid #FFF;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  margin-bottom:5px;
}

.infiniteCarousel .wrapper ul {
  width: 9999px;
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin:0;
  padding:0;
  position: absolute;
  top: 0;
}

.infiniteCarousel ul li {
  display:block;
  float:left;
  padding:0 10px;
  height: 270px;
  width: 104px;
}

.infiniteCarousel ul li h2 {font-size:13px; font-weight:bold; height:40px; text-align:center;}

.infiniteCarousel ul li p {line-height:1.5em; margin:0; padding:0 0 0 8px; font-size:12px !important;}

.infiniteCarousel ul li a img {
  display:block;
}

.infiniteCarousel .arrow {
  display: block;
  height: 62px;
  width: 62px;
  background: url(img/arrow.png) no-repeat 0 0;
  text-indent: -9009px;
  position: absolute;
  top: 95px;
  cursor: pointer;
}

.infiniteCarousel .forward {
  background-position: 0 0;
  right: 0;
}

.infiniteCarousel .back {
  background-position: 0 -124px;
  left: 0;
}

.infiniteCarousel .forward:hover {
  background-position: 0 -62px;
}

.infiniteCarousel .back:hover {
  background-position: 0 -186px;
}

/*----- product development ----- */
body#product-development #nameField {padding-left:65px;}
body#product-development #passField {padding-left:65px;}

/*----- gallery ----*/
/*.galleria {list-style:none;width:700px; background:url(img/index/textBox.png) repeat; padding:10px; height:364px;}
.galleria li{display:block;width:80px;height:80px;overflow:hidden;float:left;margin:0 10px 10px 0}
.galleria li a{display:none}
.galleria li div{position:absolute;display:none;top:0;left:180px}
.galleria li div img{cursor:pointer}
.galleria li.active div img,.galleria li.active div{display:block}
.galleria li img.thumb{cursor:pointer;top:auto;left:auto;display:block;width:auto;height:auto}
.galleria li .caption{display:block;padding-top:.5em}
* html .galleria li div span{width:400px} 
ul.gallery {margin-left:-10px; background:none;}
.galleria_wrapper {text-align:center;}*/

/* ==== FOOTER ==== */
/*---- bottomNav ----*/
#bottomNav {position:absolute; bottom:10px; left:170px; width:100%; text-align:center;}
#bottomNav ul {list-style:none;}
#bottomNav li {color:#FFF; float:left; margin:0 10px;}
#bottomNav li a {font-size:10px; font-family:Verdana, Geneva, sans-serif; font-weight:normal; color:#4968B1;}
#bottomNav li a.select {color:#FFF;}
#bottomNav li a:hover {color:#fff;}

/*---- footer ----*/
#footer {margin:0 auto; padding:0; width:1000px; text-align:center; height:50px;}
#footer p {font-size:10px; color:#888;}