/* This is the css file for a basic layout where the footer moves up and down with the content,
regardless of page length */

/*EZ MEDIA 1 */


/* ----------- BASIC ELEMENTS ----------- */

html
{
	height: 100%;
	border: 0;
	padding: 0;
	margin: 0;
}

body
{
	font: 80% Arial, Verdana, sans-serif;
	color: #666666;

	background: #eaedef url(../images/bg/gradient_bg1.jpg) 0 0 repeat-x;
	margin: 0;
	text-align: center;

	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
}

img
{
	border: 0px none;
	margin: 0;
	padding: 0;
}

a
{
	color: #3576a4; /* bright turquoise blue */
	font-family: Arial, Verdana, sans-serif;
	/*font-weight: bold;*/
	text-decoration: none;
}

a:hover, a.selected
{
	color: #191919; /* charcoal */
}



/* ----------- headings and bold text ------------ */


h1
{
	font-size: 180%;
	color: #3576a4; /* bright turquoise blue */
	font-weight: normal;
}

h2, .special
{
	font-size: 130%;
	color: #3c5f76; /* dusty medium blue */
	font-weight: bold;
}

h3
{
	font-size: 100%;
	color: #3c5f76; /* dusty medium blue */
	font-weight: bold;
	/*text-decoration: underline;*/
}


h1, h2, h3 { font-family: Arial, Verdana, sans-serif; text-align: left; }




/* ----------- LAYOUT ----------- */



#container
{
	width: 775px;

	background: #ebebeb url(../images/bg/background1.jpg) 50% 0 repeat-y;
	border: 0;

	margin: 0 auto;
	padding: 0;
	text-align: center;
}


/* ----------- HEADER ----------- */
#top_div
{
	width: 775px;
	height: 184px;

	background-color: #516f89; /* medium greyish blue */

	margin: 0;
	padding: 0;

	text-align: left;
}

/* for heading pictures in big blue top header */
.fire_float
{
	float: left !important;
	float: none;
}

.ie_float
{
	float: none !important;
	float: left;
}

#logo_animation
{
	padding: 0px;
	margin: 0px;
}

#heading_div
{
	margin: 0;
	padding: 0;
	text-align: right;
}

/* ----------- HEADER NAVIGATION ----------- */

#top_nav_div
{
	width: 775px;
	height: 50px;

	background: #516f89 url('../images/tabs/7page_nav_div_left.jpg') top left no-repeat;

	padding: 0;
	margin: 0;
}

#top_nav_list
{
	float: right;
	margin: 0;
	padding: 0;

	height: 50px; /* height of the visible part of a tab pic */
	list-style: none;
	display: inline;
}

#top_nav_list li
{
	margin: 0;
	padding: 0;
   list-style: none;
	display: inline;
}

#top_nav_list a /* default link */
{
	float: left;
	margin: 0 0 0 0 !important;
	margin: 0 2px 0 2px;
	padding: 50px 0 0 0;
	overflow: hidden;
	height: 0px !important;
	height: 50px;
}

#top_nav_list a:hover, #top_nav_list a.selected
{
	background-position: 0 -50px;
}

/* INDIVIDUAL IMAGES [6] */
/* Total width: 620px */

#home_toplink a
{
	width: 76px;
	background: url(../images/tabs/home.jpg) top left no-repeat;
}

#services_toplink a
{
	width: 122px;
	background: url(../images/tabs/services.jpg) top left no-repeat;
}

#gallery_toplink a
{
	width: 77px;
	background: url(../images/tabs/gallery.jpg) top left no-repeat;
}

#about_toplink a
{
	width: 120px;
	background: url(../images/tabs/about.jpg) top left no-repeat;
}

#rates_toplink a
{
   width: 99px;
   background: url(../images/tabs/rates.jpg) top left no-repeat;
}

#client_toplink a
{
	width: 78px;
	background: url(../images/tabs/clients.jpg) top left no-repeat;
}

#contact_toplink a
{
	width: 108px;
	background: url(../images/tabs/contact.jpg) top left no-repeat;
}

/* ----------- MAIN CONTENT ----------- */

#contentblock
{
	width: 593px !important;
	width: 595px;

	float: right;

	background-color: #ffffff;
	border-right: 1px solid #d2dde5;
	border-left: 1px solid #d2dde5;

	padding: 0 0 50px 0 !important;
	padding: 10px 0 60px 0;
	margin: 0 auto;
	text-align: center;

	/* IE FIX */
	position:relative;
	top: 0 !important;
	top: -4px;
}

#contentblock p, #contentblock h1, #contentblock h2, #contentblock h3
{
	padding: 0 15px 0 15px;
}

#contentblock ul p, #contentblock ul h1, #contentblock ul h2, #contentblock ul h3
{
	padding: 0;
}

.subSection
{
	width: 545px;

	margin: 0 auto;
	padding: 0;
	text-align: left;
}


/* ----------- SIDEBAR ----------- */

#sidebar1
{
	width: 179px;

	display: block;
	float: right;

	background: #ffffff url('../images/sidebar_pic_watermark2.jpg') top left no-repeat; /* change bg border pic colours */

	margin: 0;
	padding: 0;
	text-align: center;

	/* IE FIX */
	position:relative;
	top: 0 !important;
	top: -4px;
}

#insidebar
{
	width: 160px;

	margin: 0 auto;
	padding: 15px 0 0 0;
	text-align: left;
}

#insidebar1 p, #insidebar1 h1, #insidebar1 h2, #insidebar1 h3
{
	margin: 0;
	padding: 0;
}

#insidebar ul
{
	margin: 0;
	padding: 0 5px 0 15px;
	font-size: 11px;
}

#insidebar p
{
	margin: 0;
	padding: 0 5px;
	font-size: 11px;
}

.ul_separator
{
	height: 1px;
	border-bottom: 1px solid #d2dde5;
	margin: 10px 0 10px 0;
}

/* ----------- STATS ------------ */

p.caption
{
	font-size: 11px;
}

p.center, p.center a
{
	text-align: center;
	/*font-size: 11px;*/
	font-weight: bold;
}

/* ----------- FOOTER ----------- */


#footer
{
	width: 775px;
	height: 34px;
	background: #3576a4 url('../images/bg/footer_bg1.jpg') bottom left repeat-x;
	margin: 0 auto;
}

#footer_right
{
	width: 775px;
	height: 34px;
	background: transparent url('../images/bg/footer_right.jpg') bottom right no-repeat;
	margin: 0 auto;
}

#footer_left
{
	width: 775px;
	height: 34px;
	background: transparent url('../images/bg/footer_left.jpg') bottom left no-repeat;
	margin: 0 auto;
}

#footer p
{
	color: #ebebeb;

	font-size: 11px;
	font-family: Arial, Verdana, sans-serif;

	padding: 10px 0 10px 0;
	margin: 0;
	text-align: center;
}

/* space below footer that hides repeating background border image */
#special
{
	background: #eaedef;
	width: 775px;
	height: 20px;
}

/* ----------- TABLES ----------- */

table#contact
{
	width: 545px;
	background-color: #e4eaee;
	margin: 0 auto;
	padding: 0;

	border: 0;

	font-size: 100%; /* because IE needs you to tell how big the font must be for tables too */
}

td, th
{
	padding: 5px 15px 5px 15px;
}

#contact h3
{
	padding: 0;
}

#contact tr.darkrow td
{
	background-color: #e2e7ed;
}

#submit
{
	text-align: center;
}

table#admin
{
	width: 545px;
	background-color: #e4eaee;
	margin: 0 auto;
	padding: 0;

	border: 0;

	font-size: 90%; /* because IE needs you to tell how big the font must be for tables too */
}

table#admin td, table#admin th
{
	padding: 3px;
}

table.client {
	margin: 0 auto;
}

table.client td {
	text-align: center;
}

table.client td img {
	padding: 8px 0 8px 0;
}

/*  ====== RATES ===== */


table.rates {
   font-family:verdana;
   font-size: 10px;
   width: 545px;
   border: 1px #999999 solid;
   text-align: left;
   }

.zone {
   font-family:verdana;
   font-size: 10px;
   }

table.rates th {
	padding: 5px;
	border: 0;
	font-family: tahoma;
	font-size: 11px;
	color: #4f4e53;
	background-color: #c6d4dd;
	text-decoration: none;
	text-align: center;
	vertical-align: top;
}

table.rates td {
   padding: 5px;
   background-color: #e4eaee;
   vertical-align: top;
   }

.left_align {
   text-align: left;
   }

.right_align {
   text-align: right;
   }

table.invisible {
   background-color: transparent;
   border: 0;

   }

table.invisible td {
   vertical-align: top;
   padding: 5px;
   }

table.rates td p, table.invisible td p {
   padding: 0px;
   margin: 0px;
   margin-left: 0px;
   }

.bold {
   font-weight: bold;
   }

/* ----------- PHOTO ----------- */

#photo_section
{
	width: 545px;
	margin: 0 auto;

	padding: 0;

	background-color: #e4eaee;
	/*border: 1px solid #cccccc;*/

	text-align: center;
}

#back_to_gallery
{
	padding: 10px 10px 10px 20px;
	text-align: center;
	float: left;
	font-weight: bold;
}

#photo_controls
{
	float: right;
	padding: 10px 20px 10px 10px;
	text-align: center;
	font-weight: bold;
}

#photo img
{
	display: block;
	margin: 0 auto;
}

/* ----------- MISCELLANEOUS ----------- */

.clearfloat
{ /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

.separator
{
	height: 1px;
	border-bottom: 1px solid #d2dde5;
}

#animation
{
	padding: 0px;
	text-align: left;
	margin: 0px;

	position: relative;
	left: -2px !important;
	left: 0;
}

#button
{
	padding: 0px;
	text-align: right;
	margin: 0px;
}

/* ----- ERROR HANDLING ----- */

.error
{
	font-style: oblique;
	color: #ff0000;
}

.success
{
	font-style: oblique;
	color: #3576a4;
	background-color: #e4eaee;
	padding-bottom: 1px;
	padding-top: 1px;
}

.success p
{
	padding-left: 10px;
	text-align: center;
}