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

a:link {
	color: #16488F;
	text-decoration: none;
}
a:visited {
	text-decoration: none;
}
a:hover {
	text-decoration: none;
}
a:active {
	text-decoration: none;
}

#navigationBar {
	position:absolute;
	width:318px;
	height:35px;
	z-index:1;
	top: 15px;
	left: 0px;
	background-color: #FFFFFF;
}


#miniNav {
	position:absolute;
	width:405px;
	height:35px;
	z-index:2;
	left: 550px;
	top: 15px;
}
#featureHeading {
	position:relative;
	width:480px;
	height:18px;
	z-index:1;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	font-weight: bolder;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
	margin-top: 12px;
	margin-left: 12px;
	letter-spacing: normal;
	text-align: left;
	margin-bottom: 8px;
	margin-right: 10px;
	line-height: 12px;
	text-transform: uppercase;
}

#featureColumn {
	position:relative;
	width:504px;
	height:486px;
	z-index:3;
	background-color: #FFFFFF;
	float: left;
	border: 1px none #CCCCCC;
	background-image: url(../media/images/featBackground.gif);
}



#featureWorkColumn {
	position:relative;
	width:732px;
	height:486px;
	z-index:3;
	background-color: #FFFFFF;
	float: left;
	border: 1px none #CCCCCC;
	background-image: url(../media/images/featureWorkBackground.gif);
	text-align: center;
	vertical-align: middle;
}


#videoWrapper {
	padding-top: 50px;
	width:680px;
	
	z-index:3;
	padding-left: 30px;
}

#blogColumn {
	position:relative;
	width:732px;
	height:486px;
	z-index:3;
	background-color: #FFFFFF;
	float: left;
	border: 1px none #CCCCCC;
	background-image: url(../media/images/blogBackground.gif);
}
#smallColumn {
	position:relative;
	width:216px;
	height:486px;
	z-index:5;
	background-color: #FFFFFF;
	text-align: left;
	border: 0px none #CCCCCC;
	float: left;
	margin-left: 12px;
	background-image: url(../media/images/columnBackground.gif);
}
.thumbStyle {
	position: relative;
	float: left;
	clear: both;
	height: 120px;
	width: 200px;
}
#relatedColumn {
	position:absolute;
	width:215px;
	height:515px;
	z-index:4;
	left: 698px;
	top: 69px;
	background-color: #999999;
}

#blogSideHeading {
	position:relative;
	width:192px;
	height:18px;
	z-index:1;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	font-weight: bolder;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
	margin-left: 12px;
	letter-spacing: normal;
	text-align: left;
	margin-bottom: 8px;
	}
#columnHeading {
	position:relative;
	width:192px;
	height:18px;
	z-index:1;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	font-weight: bolder;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
	margin-top: 12px;
	margin-left: 12px;
	letter-spacing: normal;
	text-align: left;
	margin-bottom: 8px;
	margin-right: 8px;
	text-transform: uppercase;
}
#sideText {
	position:relative;
	width:192px;
	z-index:2;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666;
	margin-left: 12px;
	margin-bottom: 12px;
	line-height: 14px;
}
#imageThumb {
	position:relative;
	width:192px;
	z-index:2;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #999999;
	font-weight: bold;
	text-transform: uppercase;
	margin-left: 12px;
	margin-bottom: 12px;
}
.thumb {
	padding-bottom: 4px;
}
#topNavigation {
	position:relative;
	width:960px;
	height:70px;
	z-index:6;
	float: left;
}
#videoPlayer {
	position:relative;
	width:480px;
	height:270px;
	z-index:2;
	float: left;
	margin-left: 12px;
	background-color: #CCCCCC;
}
#featureText {
	position:relative;
	width:480px;
	z-index:1;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
	margin-top: 15px;
	margin-left: 15px;
	letter-spacing: normal;
	text-align: left;
	margin-bottom: 10px;
	line-height: 14px;
}
#featureH1 {
	font-size: 14px;
	font-weight: bold;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 8px;
	padding-left: 0px;
}
#clientIcon {
	position:relative;
	height:100px;
	z-index:3;
	float: left;
	margin-top: 30px;
	margin-left: 25px;
	width: 101px;
}
#thumbButton {
	position:absolute;
	width:192px;
	height:122px;
	z-index:1;
}

/* this is the blog navigation */

#navBlog {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 318px;
    height: 35px;
    overflow: hidden;
}
#navBlog li {
    float: left;
}
#navBlog a {
	display: block;
	background-image: url(../media/images/miniNavigation.gif);
	padding-top: 35px; /* same as height of #example-nav */
	text-decoration: none; /* needed for IE8 beta, otherwise it still shows the underlines */
}
#navBlog-blog {
    width: 58px;
}
#navBlog-blog:hover {
    background-position: 0px -35px;
}
#navBlog-thework {
    width: 86px;
	background-position: -58px 0px;
}
#navBlog-thework:hover {
    background-position: -58px -35px;
}

#navBlog-careers {
    width: 91px;
	background-position: -145px 0px;
}
#navBlog-careers:hover {
    background-position: -145px -35px;
}
#navBlog-contact {
    width: 83px;
	background-position: -237px 0px;
}
#navBlog-contact:hover {
    background-position: -237px -35px;
}


/* this is the main navigation */

#nav {
    padding: 0;
    margin: 0;
    list-style: none;
    width: 416px;
    height: 35px;
    overflow: hidden;
}
#nav li {
    float: left;
}
#nav a {
	display: block;
	background-image: url(../media/images/navigation.png);
	padding-top: 35px; /* same as height of #example-nav */
	text-decoration: none; /* needed for IE8 beta, otherwise it still shows the underlines */
}
#nav-blog {
    width: 52px;
	background-position: -90px 0px;
}
#nav-blog:hover {
    background-position: -90px -35px;
}
#nav-blogSelected {
    width: 52px;
	background-position: -90px -35px;
}
#nav-thework {
    width: 90px;
	background-position: 0px 0px;
}
#nav-thework:hover {
    background-position: 0px -35px;
}
#nav-theworkSelected {
	width: 90px;
    background-position: 0px -35px;
}
#nav-ouroffices {
    width: 98px;
	background-position: -142px 0px;
}
#nav-ouroffices:hover {
    background-position: -142px -35px;
}

#nav-aboutus {
    width: 79px;
	background-position: -241px 0px;
}
#nav-aboutus:hover {
    background-position: -241px -35px;
}
#nav-aboutusSelected {
    width: 79px;
	background-position: -241px -35px;
}

#nav-contact {
    width: 97px;
	background-position: -320px 0px;
}
#nav-contact:hover {
    background-position: -320px -35px;
}

#nav-contactSelected {
    width: 97px;
	background-position: -320px -35px;
}


#mediumColumn {
	position:relative;
	width:444px;
	height:486px;
	z-index:5;
	background-color: #FFFFFF;
	text-align: left;
	border: 0px none #CCCCCC;
	float: left;
	margin-left: 12px;
	background-image: url(../media/images/columnMedium.gif);
}
#storyHeading {
	position:relative;
	width:424px;
	height:18px;
	z-index:1;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #666666;
	font-weight: bolder;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
	margin-top: 12px;
	margin-left: 12px;
	letter-spacing: normal;
	text-align: left;
	margin-bottom: 8px;
	margin-right: 8px;
}
.clearfix:after {
     visibility: hidden;
     display: block;
     font-size: 0;
     content: " ";
     clear: both;
     height: 0;
     }
.clearfix { display: inline-block; }
/* start commented backslash hack \*/
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/* close commented backslash hack */#storyText {
	position:relative;
	width:424px;
	z-index:1;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
	font-weight: normal;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCCCCC;
	margin-top: 0px;
	margin-left: 12px;
	letter-spacing: normal;
	text-align: left;
	margin-bottom: 8px;
	margin-right: 8px;
}