/*

	MAIN LAYOUT 

*/

body {
	margin:0px;
	padding-top:40px;
	font-size:14px;
	color:#878585;
	background-color:#FFFFFF;
	min-width:1000px;
	font-family:Helvetica, Verdana, Arial, sans-serif;
	background-repeat: no-repeat;
	background-attachment:fixed;
	background-position: 100% 100%;
	height:100%;
	overflow-x:hidden;
}
#greyframe {
	margin:0 auto;
	width:917px;
	/*background-color:#d7d7d7;*/
	background:none;
	background:url(/images/framework/bg-grey.png);
	
	padding-top:132px;
	padding-bottom:15px;
	margin-bottom:40px;
}
#logo {
	text-align:right;
	margin-right:21px;
	height:57px;
}
h1 {
	font-size:37px;
	color:#4e4b4a;
	letter-spacing:-1px;
	margin:0px;
	padding:0px;
	line-height:39px;
	font-weight:normal;
}
h2 {
	padding:0px;
	margin:0px;
	font-size:28px;
	margin-bottom:5px;
	font-weight:normal;
}

h3 {

	font-size:16px;
	font-weight:bold;
	color:#2E2E2E;
	padding:0px;
	margin:0px;

}
p{
	font-size:12px;
	
}

#whitebox {
	width:833px;
	height:100%;
	margin-left:82px;
	margin-bottom:25px;
}
#whitebox_content {
	margin-top:21px;
	width:695px;

	margin-left:23px;
	background-color:#FFFFFF;
	padding-right:47px;
	padding-left:47px;
	padding-top:7px;
	padding-bottom:7px;
}
#crosstop {
	background-image:url(/images/framework/cross.png);
	height:40px;
	width:40px;
	background-repeat:no-repeat;
	position:relative;
	bottom:29px;
	left:724px;
}
#crossbottom {
	background-image:url(/images/framework/cross.png);
	height:40px;
	width:40px;
	background-repeat:no-repeat;
	position:relative;
	top:29px;
	right:68px;
}
#footer {

}

#footer .right{
	padding-right:23px;
	float:right;
	font-size:9px;
	color:#666;
}

#footer .right span{
	position:relative;
	bottom:8px;
	right:5px;
	
}
#footer .left{
	float:left;
	text-align:left;
	font-size:9px;
	color:#958E8E;
	padding-left:100px;

}

#footer .left a {
	color:#958E8E;
	text-decoration:none;
}
#footer .left a:hover {
	text-decoration:underline;
}


#cs_maintext {
	float:left;
	width:380px;
	font-size:28px;
	line-height:31px;
	letter-spacing:-1px;
	margin-right:10px;
}
#cs_mainlinks {
	float:right;
	font-size:28px;
	display:block;
}
#cs_mainlinks a {
	color:#4C4C4C;
	text-decoration:none;
}
#cs_mainlinks span {
	padding-left:12px;
	margin:0px;
	padding-top:0px;
	border:none;
	border-width:0px;
}


img{
	border:none;
}
/*This is the circle in the top left*/
#tl_circle{
	width:100%;
	height:100%;
	position:absolute;
	background-repeat:no-repeat;
	top:0px;
	left:0px;
	display:inline;
}

.extra_text {
	display:none;
}



/*

	PAGE COLOURS AND STYLES

*/

.magenta{
	color:#DC006F;
}

.blue{
	color:#0083FF;
}

.purple{
	color:#8B1191;
}

.orange{
	color:#FD7614;
}

.yellow{
	color:#FFC000;
}

.green{
	color:#08F700;
}


.large{
	font-size:32px;
	letter-spacing:-1px;
	margin:10px; 0 0 0;
	padding:0px;
	line-height:35px;
	font-weight:normal;
	
}







/*

	NAVIGATION

*/

#nav {
	height:61px;
	width:916px;
}
#nav_container {
	height:23px;
	padding-top:16px;
	margin-right:23px;
	margin-bottom:43px;

}

#nav_container li{
	display:inline;
	padding:3px 0px 0px 0px;
	margin:0px;
	height:20px;
	margin-left:4px;
	display:block;
	float:right;
	background-color:#FFF;
	position:relative;
	
}
#nav_container li .line{
	position:absolute;
	left:10px;
	z-index:100;
	display:block;
	height:13px;
	width:13px;
	background:url(/images/framework/slash-big.png) no-repeat;
}

#nav_container li a{
	color:#BAB9B9;
	font-size:14px;
	padding:0px 40px 0px 15px;
	letter-spacing:-0.05em;
}


#nav_container .portfolio .current,
#nav_container .portfolio a:hover{
	color:#0083FF;
}

#nav_container .public .current,
#nav_container .public a:hover{
	color:#8B1191;	
}

#nav_container .branding .current,
#nav_container .branding a:hover{
	color:#FD7614;	
}

#nav_container .websites .current,
#nav_container .websites a:hover{
	color:#FFC000;	
}

#nav_container .blog .current,
#nav_container .blog a:hover{
	color:#DC006F;	
}

#nav_container .contact .current,
#nav_container .contact a:hover{
	color:#08F700;	
}

/*
#nav_container div {
	width:122px;
	height:23px;
	float:left;
}
#nav_container a {
	float:left;
	display: block;
	width: 122px;
	height: 23px;
	text-indent:-9000px;
}

#nav_container a:hover {
	background-position: 0 -23px;
}
#nav_container .current {
	background-position: 0 -46px;
}


*/

/*

	PAGE SPECIFIC STYLES

*/
/* Portfolio, Public, Branding*/
.cs_left_container{
	width:490px;
	float:left;
	position:relative;
	bottom:20px;
	text-align:left;
}
#whitebox_content .cs_home{
	width:470px;
	padding-right:20px;
}
#whitebox_content .cs_home p{
	font-size:24px;
	margin:0px;
	padding:0px;
	padding-bottom:10px;

}

.cs_left_container .cs_btns{
	height:15px;
	width:490px;
	margin-top:15px;
	
}

.cs_left_container .cs_btn{
	height:12px;
	width:13px;
	background-color:#999;
	display:block;
	cursor:pointer;
	color:#FFF;
	font-size:11px;
	text-align:center;
	font-weight:bold;
	float:right;
	padding-right:2px;
	padding-bottom:3px;
	margin-left:5px;
	letter-spacing:-00.1em;
	
}
.cs_left_container .selected{
	background-color:#333333;
	color:#B8B8B8;
}
.cs_left_container .cs_btn:hover{
	background-color:#333333;
	color:#B8B8B8;
}

.cs_left_container .cs_text{
		list-style:none;
	width:490px;
	text-align:left;
}

.cs_left_container .cs_text li{
	list-style:none;
	width:490px;
	text-align:left;
}



.cs_left_container .cs_text li h3{
	margin:0px;
	line-height:22px;
	padding-bottom:6px;

}
.cs_left_container .cs_images{
	/*height:260px; THIS IS THE HEIGHT OF THE IMAGE CONTAINER*/ 
	width:490px;
	overflow:hidden;
	margin-top:15px;
}

.cs_left_container .cs_images ul li{
	list-style:none;
	padding:0px;
	margin:0px;
	overflow:hidden;
}
.cs_right_container{
	float:left;
	position:relative;
	bottom:20px;
	width:175px;
	padding-left:30px;
	color:#333;

}
.cs_right_container a{
	font-size:14px;
	text-decoration:none;
	color:#333;
	font-weight:bold;
	line-height:18px;

}


.cs_right_container .slash {
	position:absolute;
	background-image:url(../images/framework/slash.png);
	background-repeat:no-repeat;
	width:14px;
	height:14px;
	left:26px;

}

/* Home Page */

.index_maintext{
	float:left;
	width:487px;
	
	
}

.index_twitter{
	float:right;
	background-color:#D7D7D7;
	width:188px;
	overflow:hidden;
	padding:10px 10px 0px 10px;
	min-height:400px;
	
}
.index_twitter .tweet{
	margin-bottom:15px;
	overflow:hidden;
	
	
}
.index_twitter .title{
	font-size:16px;
	font-weight:bold;
	color:#DC006F;
	padding-bottom:10px;
	
	
}
.index_twitter p{
	
	color:#DC006F;
	font-size:9px;
	
	margin:0px;

}
.index_twitter a{
	font-size:11px;
	color:#333;
	font-weight:bold;
	text-decoration:none;
	
	
}
.index_twitter a:hover{
	text-decoration:underline;
	
}
/*
.magenta{
	color:#DC006F;
}

.blue{
	color:#0083FF;
}

.purple{
	color:#8B1191;
}

.orange{
	color:#FD7614;
}

.yellow{
	color:#FFC000;
}

.green{
	color:#08F700;
}
*/

.index_subtext{
	clear:both;
}


/* Websites */
.website_images{
	float:left;
	width:60%;
	
}

.website_welcome{
	width:100%;
}


.website_welcome p{
	font-size:22px;
	margin:0px 0px 15px 0px;
	padding:0px;
	color:#FFC000;

}

.website_welcome .bottom{
	color:#808080;

}



.website_text{
	float:left;
	width:35%;
	padding-top:30px;
	padding-left:5%;
	text-align:right;
}
.website_text p{
	font-size:10px;
	color:#808080;
	padding-bottom:10px;
	
	
}
.website_text a{
	color:#FFC000;
	text-decoration:none;
	font-size:13px;
	font-weight:bold;
	padding-top:10px;
}
.website_text a:hover{
	text-decoration:underline;
}

.website_text h1{
	font-size:18px;
	color:#2C2C2C;
	margin:0px 0px 10px 0px;
	padding:0px;
	line-height:12px;
	font-weight:bold;
	letter-spacing:0.005em;

}
.navigation{
	height:60px;
	font-size:9px;
	color:#000;
	text-align:center;
	overflow:hidden;
	padding-top:10px;
	overflow:hidden;
	position:relative;
	width:695px;
	
	
}




/*
*	for javascript navigation
*/

.navigation .navigation_inner{
	display:block;
	height:60px;
	position:relative;
	width:1138px; /* CHANGE THIS WHEN ADDING NEW THINGS */
}


.navigation .navigation_inner li{
	display:block;
	height:60px;
	margin:0px 20px 0px 20px;
	float:left;
}

.navigation .navigation_inner a{
	text-decoration:none;
	color:#F00;
	font-size:12px;
}






.navigation a{
	text-decoration:none;
	color:#F00;
	font-size:12px;
}
.navigation a:hover{
	text-decoration:underline;
}
.hrcontainer{
	text-align:center;
	margin-bottom:5px;
	padding-top:30px;
}
.hrline{
	border-top-color:#D7D7D7;
	border-top:solid;
	border-top-width:1px;
	width:300px;
	height:1px;
	display:block;
	float:left;
	position:relative;
	top:5px;
}
.hrtext{
	float:left;
	font-size:9px;
	color:#000;
	margin-left:17px;
	margin-right:17px;
}


/* Contact */

#contact_left{
	width:40%;
	float:left;
	color:#4e4b4a;
	
}
#contact_left a{
	color:#4e4b4a;
	text-decoration:none;
	
}
#contact_left a:hover{
	color:#4e4b4a;
	text-decoration:underline;
	
}


#contact_right{
	width:60%;
	float:right;
	text-align:right;
	
}


/* Sitemap */

#sitemap_container{
margin-top:15px;
height:100%;
}
#sitemap_container div{
float:left;
width:33%;
}


#sitemap_container a{
color:#4e4b4a;
text-decoration:none;
}

#sitemap_container a:hover{
color:#4e4b4a;
text-decoration:underline;
}
#sitemap_container ul{
margin-top:5px;

}
#sitemap_container ul{
margin-top:5px;

}

#sitemap_container li{
list-style-type: disc;
color:#4e4b4a;
margin:0px;

}

/*
*	BLOG
*/
.blogDate{
	display:block;
	font-size:10px;
	margin-top:40px;
}

.blogTitle{
	display:block;
	color:#DC006F;
	font-weight:bold;
	font-size:18px;
}
.blogReadMore{
	display:block;
	color:#666;
	font-weight:bold;
	font-size:11px;
	margin-bottom:10px;
}


.blogTitle:hover{
	text-decoration:underline;
}

.MsoNormalTable p{
	color:#333;
	padding-bottom:8px;
}

.blogArticle p{
	color:#333;
	padding-bottom:8px;	
}

.MsoNormalTable p a{
	color:#DC006F;
}