﻿
/* ------------------------------
 * Define the Desktop Page Layout
 * ------------------------------
*/

#layout {
  position: relative;
	background-color:#fff;	/* change background color for web site contents */
	/*margin-left:15px;	/*allow padding around entire website for desktop displays */
	/*margin-right:15px;
	margin-bottom:15px;
	margin-top:10px;*/
	/*max-width: 1000px;  remove this line if you want the website to use the whole browser page width */
	/*	margin-left: auto; /* add this line if you want the website to center when a fixed width is specified */
	/* margin-right: auto; /* add this line if you want the website to center when a fixed width is specified */
	}

/* --------------------------------------------
 * Desktop Header ie. Logo - Phone - Tag Line etc. 
 * --------------------------------------------
*/

#desktop_header {
	display:block;
	/* min-width:960px;	/* set minimum screen width to stop floating elements wrapping onto next line when browser window resized */
	/* overflow:hidden;	/* hide any part of frame that doesnt fit into browser window, stops whole frame disappearing */
	/* border-width: 1px; */
	/* border-style: solid; */
	/* padding:2px; */
 	/* margin:0 2px; */
	/* background-color:#ccc; */
}

#title_bar {	/* Logo, tag line and search box */ 
	display:block;
	height:65px;
	padding-top:5px;	/*empty space above the title bar */
	background-color: #000;
}
#title_bar .logo {
	float:left; 
	margin-top:12px;
	margin-left:10px;
}
#title_bar .tag_line {
	margin-top:15px; 
	margin-left:30px;
	font-style:italic;
	font-weight:bold;
	font-size:1.4em;
	float:left;
	color:#fff;
}
#title_bar .search {
	float:right;
	margin-top:15px; 
	margin-right:10px;
}
#title_bar input[type="text"] {	/* form input text field */
	padding: 6px;
	margin:0px;
	width:240px;
	border: 1px solid #fff;
	background-color:#000;
	color:#fff;
}
#title_bar input[type="submit"]  {	/* go buttons */
	background-color: #00a651; /* green */
	padding: 7px;
	color: #fff;
	margin:0px 10px 0px 5px;
	border:none;
}
/* Format the colour of the SEARCH placeholder text */
#title_bar ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #ccc;
}
#title_bar ::-moz-placeholder { /* Firefox 19+ */
  color: #ccc;
	opacity:1;
}
#title_bar :-ms-input-placeholder { /* IE 10+ */
  color: #ccc;
}
#title_bar :-moz-placeholder { /* Firefox 18- */
  color: #ccc;
}



/* --------------------------
 * Define desktop search 
 * --------------------------
*/

#livesearch {
	position: absolute;
	top: 52px;
	right: 20px;
	width: 282px;
	height: 180px;
	background-color: #fff;
	border: 1px solid #ccc;
	padding: 5px;
	overflow: auto;
	white-space: nowrap;
	display:none;	/* hide the element & leave no space on the page for it */
	color: #000;
	font-size: 80%;
	line-height:1.5em;
	z-index: 100;	/* make sure this is the top layer = highest number */
}

#livesearch_close {
	position: absolute;
	top: 22px;
	right: 62px;
	width: 15px;
	height: 18px;
	background-color: #000;
	border-left: 1px solid #fff;
	padding: 5px;
	display:none;	/* hide the element & leave no space on the page for it */
	text-align: center;
	font-weight: bold;
	z-index: 99;	/* make sure this is the top layer = highest number */
}
#livesearch_close a:hover {
  text-decoration:none;
}
#livesearch_close a {
  color: #fff;
}
#livesearch_close a.selected: {
  color: #fff;
}


/* --------------------------
 * Define desktop drop-down menu
 * --------------------------
*/

#desktop_tab_menu {
		margin-top:4px;
		background-color:#555;	/* base color */
		border-bottom: #555;	/* base color */
		border-bottom: 5px solid #555; /* base color */
}
.tabs {
	padding: 0px;
	margin: 0px; 	/* Set starting position of 1st menu item */
	width: 100%; 
	list-style-type: none; 
	height: 40px;		/* set height of the menu tab */
	z-index: 10; 		/* Set the stack order of objects that are layered (highest nbr is on top) */
}
.tabs ul{
    margin:0px;
    padding:0px;
}
.tabs ul li {
  display: inline; 	/* Displayed inside the current block on the same line. */
	float: left; 
	width: 13.95%;		/* Set the width of each menu tab, % allows tab to grow as screen is widened. Use 13.95% for 7 tabs or 12.1% for 8 tabs */
	line-height: 2.5em; 	/* set the height of the tab */
	text-align: center;
	/*	border-left: 0px solid #fff;	/*spacing between tabs, used to move tab away from left edge of screen */
	/* border-right: 3px solid #fff; /* spacing between tabs, added to right side of tab */
}

/* settings for an unselected tab */
.tabs ul li a {
  display: block; 	/* A block has some whitespace above and below it, nothing beside it */
	background-color:#555; /* base color */ 
	color: #fff; 	/* Font Colour of link item */
	text-decoration:none;
}

/* settings for the currently selected tab */
.tabs ul li a.selected {
		background-color:#cc0000;  	/* Highlight Tab */
		color: #fff;	
		border-top: 1px solid #555; /* base color */ 
		/*border-right: 1px solid #000;
		border-left: 1px solid #000;*/
		border-bottom: 4px solid #cc0000;
	
}

/* settings for an unselected tab */
.tabs ul li a:hover {
    text-decoration:underline;
}

.tab-content {
	display:none;
  /*clear:both;*/
	border-left: 1px solid #999;
	border-right: 1px solid #999;
	border-bottom: 1px solid #999;
  padding:15px 0px;
	background-color: #888;
	color:#fff;	
}
.tab-content td {
	padding:8px 30px 8px 35px;
	border-right:1px solid #fff;
}
.tab-content a {
	color:#fff;
}


/* -------------------------
 * Define Desktop Footer 
 * -------------------------
*/

#desktop_footer {
  font-size: 0.8em;
}
#desktop_footer .icon_footer {
	display:block;
	padding:20px 20px 20px 30px;
	background-color:#555;
	color:#FFF;
}
#desktop_footer .icon {
	display:inline-block;
	float:left;
}
#desktop_footer .icon_text {
	display:inline-block;
	float:left;
	margin-left:10px;
	margin-top:5px;
}
#desktop_footer .copyright {
	padding:15px;
	margin-top:4px;
	margin-bottom:20px;
	background-color: #000;
	text-align:center;
	color:#fff;
}
#desktop_footer a {
	color:#fff;
}
#desktop_footer ul {
	list-style:none;
	margin: 0px;
	padding:0px;
}

/* -------------------------------------------------
 * Define Desktop styles for breadcrumb bar
 * -------------------------------------------------
*/

#breadcrumb_bar {
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
	padding: 5px 0px 5px 30px;
	font-size: 1em;
}
#breadcrumb_bar ul {
	margin:0px;
	padding:0px;
}
#breadcrumb_bar li {
  display: inline; 
	color:#000;
}	 
#breadcrumb_bar li+li:before {
	content:"» ";
	padding-left:3px;
	padding-right:3px;
	font-size:1.3em;
	color:#b01c2e;
}


/* -------------------------------------------------
 * Define Desktop styles for multiple content pages
 * -------------------------------------------------
*/

.content {
	margin-top: 10px;
}

.content_padding {
	padding-left:30px;
	padding-right:30px;
}

.welcome_box {
	padding: 30px;
	background-color: #006dc3;
	color: #fff;
	line-height: 1.5em;
}
.welcome_box a {
	color:#fff;
	text-decoration: underline;
}

.error_message_box {
	margin-top:20px;
	padding: 30px;
	background-color:#FDB0B1;
}
.error_message_box .heading
{
	font-size:1.3em;
}




