
* {
	font-family: 'Arial';
}

html {
	font-size: 100%;
	height: 100%;
	/*background: url("../images/body-bg.jpg") repeat-x scroll 0 0;*/
	background-color: #cccccc;
}

body {
	font-size: 12px;
	line-height: 1.5em;
	text-align: center;
	margin: 0;
	padding: 0;
	
	color: #333333;
	width: 100%;
	height: 100%;
}

html > body {
	width: auto;
	min-width: 980px;
}

#wrapper {
	width: 980px;
	margin: auto;
	position: relative;
	text-align: left;
	height: 100%;
	z-index: 2;
}

body > #wrapper {
	height: auto;
	min-height: 100%;
}

.light { color: #000000 }

#page_base_spacing {
	padding-bottom: 102px;
}

#page_base {
	position: relative;
	padding: 0;
	margin-top: -102px;
	line-height: 102px;
	height: 102px;
	/*background: url('../images/body-base.jpg') bottom left repeat-x;*/
	color: #ffffff;
	z-index: 1;
}



/*
 * Float clearing styles
 * This set of styles is to do with clearing floated objects within a container.
 * Used the clearfix float clearing method found at http://www.positioniseverything.net/easyclearing.html
 * and is copyright to it's rightful authors and contributors.
 */
.clearfix { display: inline-block; }

.clearfix:after {
	content: " ";
	display: block;
	height: 0;
	clear: both;
	font-size: 0;
	visibility: hidden;
}

/* Hides from IE-mac. Dont remove this, or the next comment \*/
* html .clearfix { height: 1%; }

.clearfix { display: block; }
/* End hide from IE-mac */




/*
 * Header styles
 * The header will appear at the top of each page, it's always going to remain horizontal
 */
#header {
	display: inline;
	float: left;
	background: url('../images/header-bg2.jpg') no-repeat bottom left;
	height: 158px;
	width: 100%;
}


#header #sclogo {
	display: inline;
	float: left;
	margin-top: 116px;
	margin-left: 20px;
	width: 191px;
	height: 25px;
	line-height: 25px;
}



/*
 * Navigation styles
 * The following styles apply to the appearance of the navigation present on each page of the website.
 * The Navigation will only ever be nested within the header
 */
#header div#navigation_container {
	display: inline;
	float: left;
	width: 730px;
	height: 25px;
	overflow: hidden;
	background: url('../images/navigation-bg.gif') no-repeat top left;
	margin-top: 116px;
	margin-left: 21px;
}

#header ul#navigation {
	display: inline;
	float: left;
	margin: 0 0 0 38px;
	padding: 0;
	line-height: 25px;
	list-style: none;
}

#header ul#navigation li.navigation_link {
	display: inline;
	float: left;
	width: auto;
	padding: 0;
	margin: 0;
}

#header ul#navigation li.navigation_link a {
	display: inline;
	float: left;
	color: #fff;
	text-decoration: none;
}

#header ul#navigation li.navigation_link a:hover {
	margin-top: -25px;
}

#header ul#navigation li.navigation_link a img {
	display: block;
}




/*
 * Text styles
 * The following styles are styles applied to elements to style the text within. Common styles here
 * include styles for titles, emphasized text and text based link elements
 */
.title_page {
	display: block;
	font-size:  18px;
	font-weight: normal;
	margin: 7px 0 7px 0;
	padding: 0;
	color: #000;
}

.title_column {
	display: block;
	font-size: 14px;
	font-weight: normal;
	margin: 7px 0 7px 0;
	padding: 0;
	color: #000;
}

p {
	display: block;
	margin: 0 0 1.3em 0;
	padding: 0;
}





/*
 * Main styles
 * The following styles are mainly to do with the styling of the content within the page specific content area layout.
 */
#main {
	display: inline;
	background-color: #fff;
	margin: 0;
	float: left;
	width: 100%;
	padding: 16px 0 0px 0;
	clear: left;
	position: relative;
}



/*
 * Introduction styles
 * The following styles are mainly concerned with the appearance of an introduction
 * that is present on most secondary and tertiary pages
 */
#introduction {
	display: inline;
	float: left;
	margin-left: 20px;
	width: 940px;
	margin-right: 20px;
	border-top: 2px solid #2d6d6f;
}

#introduction_text {
	width: 880px;
	margin-bottom: 30px;
}




/*
 * Footer styles
 * The following styles are for styling the footer which appears on every page
 */
#footer {
	float: left;
	width: 980px;
	height: 91px;
	background: #234f50;/* url('../images/foot-bg.gif') no-repeat bottom left;*/
	color: #7e9d9e;
}

#footer #footer_text {
	margin: 20px;
}

#footer #footer_text #idlogo {
	float: right;
	margin: 0;
	width: 72px;
	height: 34px;
	background: url('../images/idlogo.gif') no-repeat top left;
}

#footer #footer_text a {
	font-weight: normal;
	color: #7e9d9e;
	text-decoration: none;
}

#footer #footer_text a:hover {
	text-decoration: underline;
}

#website_maintenance
{
	float:right;
	font-size:10px;
}
#website_maintenance a
{
		color: #7e9d9e;
		text-decoration:none;
		font-weight:normal;
		font-size:10px;
}


/*
 * Reused element styles
 * The following styles apply to different elements and element specific classes for use on all pages
 */
.hr {
	clear: left;
	height: 2px;
	line-height: 2px;
	font-size: 1px;
	overflow: hidden;
	background: #2d6d6f;
}

ul.diamond_bullet {
	list-style: none;
	margin: 0 0 20px 0;
	padding: 0;
}

ul.diamond_bullet li {
	margin: 1px 0;
	padding: 5px 0 5px 25px;
	background: url('../images/diamond-bullet.gif') no-repeat center left;
	font-size: 14px;
	color: #000;
}

.column_section {
	border-top: 2px solid #2d6d6f;
	margin-bottom: 35px;

}
.column_section p {
	padding-right: 10px;
}
.column_section_services {
	float: left;
	border-top: 2px solid #2d6d6f;
	height: 160px;
	/*margin-bottom: 30px;*/
	width: 442px;
	margin-right: 30px;
	font-size: 11px;
}

.column_section.noborder {
	border: none;
}

.greenbox {
	margin: 0;
	padding: 11px;
	/*background: #234f50;*/
	background: #153031;
	border: 5px solid #0d1d1e;
}

.greenbox .title_column {
	margin: 0;
}

.greenbox h2 {
	padding-bottom: 8px;
	color: #fff;
}

.greenbox p { color: #ccc }


/*
 * Link styles
 * The following styles are for styling text based link elements
 */

/*a,
a * { cursor: pointer; }
*/

a:link,
a:visited {
	text-decoration: underline;
	font-weight: bold;
	color: #40898b;
	outline: none;
}


a:hover,
a:active {
	text-decoration: none;
	color: #204546;
	outline: none;
}

a img {
	border: none;
	outline: none;
}

img.border {
	border: 5px solid #FFF;
}




/*
 * Button link styles
 * The following styles apply to the elements that will make an appearance as a button
 * The button has a few elements within it, such as the left curve, the right curve and the button text
 * which is going to be using the sIFR library
 */
.btn_left {
	float: left;
	display: inline;
		background: #234F50;
	/*background: url('../images/btn-left.gif') no-repeat top left;*/
	margin: 2px 0;
	padding: 0;
	font-size: 14px;
	overflow: hidden;
	height: 27px;
	font-size: 12px;
	font-weight: normal !important;
	text-decoration: none !important;
	color: #FFF !important;
}

.btn_home {
	background: #234F50 !important;
}

.btn_bright {
	background: #337779 !important;
}

/*
 * Button full width style
 * This class "full" when applied to a button will allow the button to be 100% of it's container width.
 * This is required for different elements in different pages
 */
.btn_left.full {
	width: 100%;
	padding: 0;
}

.btn_left .btn_right {
	float: right;
	display: inline;
	/*background: url('../images/btn-right.gif') no-repeat top right;*/
	margin: 0;
	padding: 0;
	width: 100%;
	text-align: left;
	overflow: hidden;
	height: 27px;
}

.btn_left .btn_right span {
	margin: 0 15px;
	padding: 0;
	display: inline;
	float: left;
	width: auto;
	line-height: 27px;
}

/*
 * Button hover state
 * Hover state, when a user put's their mouse over the button, the following styles are applied
 */
.btn_left:hover { background-position: bottom left; }
.btn_left:hover .btn_right { background-position: bottom right; }






/*
 * 0.0 Home page styles
 * The following styles are for styling layout elements, text elements and other helper elements
 * that are all specific to the Home page
 */
#home_left_column {
	display: inline;
	float: left;
	width: 211px;
}

#home_introduction {
	border-top: 2px solid #2d6d6f;
	display: inline;
	height: 260px;
	float: left;
	width: 191px;
	margin-left: 20px;
}

#home_introduction_text {
	display: inline;
	height: 258px;
	float: left;
	border-bottom: 2px solid #2d6d6f;
}

#home_introduction_text h1.title_page {
	font-size:  23px;
	font-weight: normal;
	padding: 0;
	margin: 10px 0;
	color: #000;
}

#home_right_column {
	display: inline;
	float: left;
	width: 769px;
}

#home_introduction_flash {
	display: inline;
	float: left;
	height: 258px;
	margin-left: 21px;
	width: 730px;
	border-top: 2px solid #2d6d6f;
	border-bottom: 2px solid #2d6d6f;
}

#home_whoweare {
	display: inline;
	float: left;
	width: 421px;
	height: 259px;
	margin-left: 20px;
}

#home_whatwedo {
	display: inline;
	float: left;
	width: 230px;
	height: 259px;
	margin-left: 21px;
}
#home_whatwedo ul {
	padding-left: 17px;
}
#home_whatwehavedone {
	display: inline;
	float: left;
	width: 490px;
	height: 259px;
	margin-left: 20px;
}

#home_getintouch {
	display: inline;
	float: left;
	width: 230px;
	height: 259px;
	margin-left: 20px;
}

#home_getintouch ul {
	padding-left: 17px;
}


#home_whoweare #home_whoweare_text,
#home_whatwedo #home_whatwedo_text,
#home_whatwehavedone #home_whatwehavedone_text,
#home_getintouch #home_getintouch_text {
	/*height: 301px; with smaller font*/
	height: 205px;
	margin-top: 7px;
	border-bottom: 2px solid #2d6d6f;
}


a.home_quicklink {
	display: block;
	margin-top: 6px;
}







/*
 * 1.0 Company profile page styles
 * These styles apply mainly to the elements and text appearing on the company profile page
 */
#company_left_column {
	display: inline;
	float: left;
	width: 672px;
	margin-left: 20px;
}

#company_mid_column,
#company_right_column {
	display: inline;
	float: left;
	width: 230px;
	margin-left: 10px;
	padding-left: 10px;
}
.company_client_list {
	margin-top: 27px;
	width: 920px;
}
.company_client_list ul {
	padding-left: 17px;
}





/*
 * 2.0 Services page styles
 */

#services_wrapper {
	float: left;
}
#services_left_column {
	display: inline;
	float: left;
	width: 952px;
	margin-left: 20px;
}

#services_right_half {
	display: inline;
	float: left;
	width: 478px;
	margin-left: 20px;
}

#services_mid_column,
#services_right_column {
	display: inline;
	float: left;
	width: 230px;
	margin-left: 20px;
}





/*
 * 2.1 Service details page styles
 */
#service_details_left_column {
	display: inline;
	float: left;
	width: 676px;
	margin-left: 20px;
}

#service_details_feature {
	padding-bottom: 7px;
	border-bottom: 2px solid #2d6d6f;
	height: 290px;
}

#service_details_feature img {
	display: block;
}

#service_details_inner_left {
	display: inline;
	float: left;
	width: 622px;
}

#service_details_inner_right {
	display: inline;
	float: left;
	width: 233px;
	margin-left: 20px;
}

#service_details_right_column {
	display: inline;
	float: left;
	width: 243px;
	margin-left: 20px;
}

#related_services_container {
	margin-left: -18px;
}

#related_services_container .related_service {
	display: inline;
	float: left;
	width: 150px;
	height: 210px;
	margin-left: 18px;
}

#related_services_container .related_service .related_service_thumbnail {
	padding-bottom: 5px;
	border-bottom: 2px solid #2d6d6f;
	
}

#related_services_container .related_service .related_service_thumbnail img {
	display: block;
}

#related_services_container .related_service .related_service_snippet {
	margin-top: 10px;
	padding-bottom: 15px;
	font-size: 11px;
	line-height: 15px;
}







/*
 * 3.0 Projects overview page styles
 */
#projects_left_column {
	display: inline;
	float: left;
	width: 672px;
	margin-left: 20px;
}


#projects_right_column {
	display: inline;
	float: left;
	width: 248px;
	background: url('../images/column-gradient2.jpg') no-repeat top left;
	margin-left: 10px;
	padding-left: 10px;
	margin-right: 20px;
	height: 800px;
}
#projects_right_column a {
	color: #85b5b6;
}
body > #projects_right_colum {
	height: auto;
	min-height: 600px;
}


#projects_right_column h2.title_column {
	padding-bottom: 10px;
	color: #fff;
}
#projects_right_column p {
	margin-bottom: 10px;
}
#projects_container {
	margin-left: -20px;
}

#projects_container .project {
	display: inline;
	float: left;
	width: 153px;
	height: 178px;
	margin-top: 20px;
	margin-left: 20px;
}

#projects_container .project .hr {
	margin: 7px 0 11px 0;
}

#projects_container .project .project_thumbnail,
#projects_container .project .project_thumbnail img,
#projects_container .project .project_snippet {
	display: block;
	font-size: 11px;
	line-height: 15px;
}




/*
 * 3.1 Project details pages styles
 */
#project_details_left_column {
	display: inline;
	float: left;
	width: 676px;
	margin-left: 20px;
}


#project_details_feature {
	padding-bottom: 7px;
	border-bottom: 2px solid #2d6d6f;
	height: 290px;
}

#project_details_feature img {
	display: block;
}

#project_details_inner_left {
	display: inline;
	float: left;
	width: 422px;
}

#project_details_inner_right {
	display: inline;
	float: left;
	width: 233px;
	margin-left: 20px;
}

#project_details_right_column {
	display: inline;
	float: left;
	width: 243px;
	margin-left: 10px;
	padding-left: 10px;
	background: url('../images/column-gradient2.jpg') no-repeat top left;
	height: 450px;
}

body > #project_details_right_column {
	height: auto;
	min-height: 450px;
}



/*
 * 4.0 Policies page styles
 */
#policies_left_column {
	display: inline;
	float: left;
	width: 676px;
	margin-left: 20px;

}

#policies_left_column h2 {
	color: #333;
	font-size: 15px;
}

#policies_right_column {
	display: inline;
	float: left;
	width: 243px;
	height: 470px;
	margin-left: 10px;
	padding-left: 10px;
	background: url('../images/column-gradient2.jpg') no-repeat top left;
}

#policies_left_column .policy {
	padding-bottom: 20px;
}
#policies_left_column .objectives {
	padding-bottom: 30px;
}

#policies_left_column .achieve {
	width: 600px;
}

a.policy_row {
	float: left;
	display: inline;
	width: 100%;
	text-decoration: none !important;
	font-weight: normal !important;
	color: #adadad !important;
	margin-bottom: 20px;
}

a.policy_row * {
	cursor: pointer;
}

a.policy_row .policy_thumbnail {
	display: inline;
	float: left;
	border-bottom: 2px solid #2d6d6f;
	padding-bottom: 4px;
	width: 128px;
}

a.policy_row .policy_content {
	display: inline;
	float: left;
	width: 508px;
	margin-left: 20px;
}

/*
 * Hover styles
 */
a.policy_row:hover {
	background: #111111;
}

a.policy_row:hover .policy_thumbnail {
	border-bottom: 2px solid #FFF;
}






/*
 * 5.0 Accreditation page styles
 */
#accreditation_left_column {
	display: inline;
	float: left;
	width: 676px;
	margin-left: 20px;
}

#accreditation_right_column {
	display: inline;
	float: left;
	width: 243px;
	margin-left: 10px;
	padding-left: 10px;
	background: url('../images/column-gradient2.jpg') no-repeat top left;
}


a.accreditation_row {
	float: left;
	display: inline;
	width: 100%;
	text-decoration: none !important;
	font-weight: normal !important;
	color: #adadad !important;
	margin-bottom: 20px;
}

a.accreditation_row * {
	cursor: pointer;
}

a.accreditation_row .accreditation_thumbnail {
	display: inline;
	float: left;
	border-bottom: 2px solid #2d6d6f;
	padding-bottom: 4px;
	width: 128px;
}

a.accreditation_row .accreditation_content {
	display: inline;
	float: left;
	width: 508px;
	margin-left: 20px;
}

/*
 * Hover styles
 */
a.accreditation_row:hover {
	background: #111111;
}

a.accreditation_row:hover .accreditation_thumbnail {
	border-bottom: 2px solid #FFF;
}




/*
 * 6.0 Accreditation page styles
 */
#contact_left_column {
	display: inline;
	float: left;
	width: 260px;
	margin-left: 20px;
}

#contact_right_column {
	display: inline;
	float: left;
	width: 660px;
	margin-left: 20px;
	
}

.form_message {
	color: #ffffff;
	font-size: 17px;
}

#contact_enquiry_left_column {
	display: inline;
	float: left;
	width: 300px;
}

#contact_enquiry_right_column {
	display: inline;
	float: left;
	width: 300px;
	margin-left: 20px;
}

.contact_form_label {
	display: inline;
	float: left;
	margin-right: 10px;
	width: 60px;
	font-weight: bold;
	line-height: 26px;
	height: 26px;
	margin-bottom: 4px;
	color: #fff;
}

.contact_form_textfield {
	display: inline;
	float: left;
	margin: 0;
	padding: 0;
	width: 230px;
	background: #FFF;
	border: none;
	height: 26px;
	/*line-height: 26px;*/
	margin-bottom: 4px;
}

.contact_form_textarea {
	display: inline;
	float: left;
	margin: 0;
	padding: 0;
	width: 230px;
	background: #FFF;
	border: none;
	height: 56px;

	margin-bottom: 4px;
}

#enquiry_form {
	margin: 0;
	padding: 0;
	display: block;
}

#enquiry_form .title_column {
	margin-bottom: 7px;
}

#contact_enquiry_submit_btn {
	float: right;
	margin-right: 8px;
}

#contact_enquiry_form_note {
	float: left;
	margin-top: 10px;
	color: #ccc;
}

