/* 
Author: www.ta-design.co.uk
*/


/* project boxes */

/* box text */

body
    {
        margin:0;
        padding:0;
        font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
        font-size: 62.5%;
        color:#000000;
        background: #00446A;
    }

.boxHeading
{
    font-size: 1.1em;
    font-weight: bold;
    color: #0071B7;
    padding: 1em 2em 0em 0em;
    margin: 0;
}

.boxBody
{
    font-size: 1.1em;
    padding: 0em 2em 3em 0em;
    margin: 0;
}

.boxBodyBlue
{
    color: #0071B7;
}


#boxContainer
{
    float: left;
    width: 66em;
    padding: 0;
    margin: 1em 0 0 0;
    text-align: left;
}

#box1
{
    float: left;
    width: 20em;
    height: 24em;
    margin-bottom: 1em;
    margin-right: 1em;
    background: url(images/boxes/box1.jpg) no-repeat;
}

        #box1 a {
          display:block;
          width:100%;
          height:17em;
          color: #000000;
          text-decoration:none;
        }

        #box1 a:hover {
          text-decoration:none;
          color: #0071B7;
        }

#box2
{
    float: left;
    width: 20em;
    height: 24em;
    margin-bottom: 1em;
    margin-right: 1em;
    background: url(images/boxes/box2.jpg) no-repeat;
}

        #box2 a {
          display:block;
          width:100%;
          height: 17em;
          color: #000000;
          text-decoration:none;
        }

        #box2 a:hover {
          text-decoration:none;
          color: #0071B7;
        }

#box3
{
    float: left;
    width: 20em;
    height: 24em;
    margin-bottom: 1em;
    margin-right: 0em;
    background: url(images/boxes/box3.jpg) no-repeat;
}

        #box3 a {
          display:block;
          width:100%;
          height: 17em;
          color: #000000;
          text-decoration:none;
        }

        #box3 a:hover {
          text-decoration:none;
          color: #0071B7;
        }

#box4
{
    float: left;
    width: 20em;
    height: 24em;
    margin-bottom: 1em;
    margin-right: 1em;
    background: url(images/boxes/box4.jpg) no-repeat;
}

        #box4 a {
          display:block;
          width:100%;
          height: 17em;
          color: #000000;
          text-decoration:none;
          z-index: 10;
        }

        #box4 a:hover {
          text-decoration:none;
          color: #0071B7;
          z-index: 10;
        }

#box5
{
    float: left;
    width: 20em;
    height: 24em;
    margin-bottom: 1em;
    margin-right: 1em;
    background: url(images/boxes/box5.jpg) no-repeat;
}

        #box5 a {
          display:block;
          width:100%;
          height: 17em;
          color: #000000;
          text-decoration:none;
        }

        #box5 a:hover {
          text-decoration:none;
          color: #0071B7;
        }

#box6
{
    float: left;
    width: 20em;
    height: 24em;
    margin-bottom: 1em;
    margin-right: 0em;
    background: url(images/boxes/box6.jpg) no-repeat;
}

        #box6 a {
          display:block;
          width:100%;
          height: 17em;
          color: #000000;
          text-decoration:none;
        }

        #box6 a:hover {
          text-decoration:none;
          color: #0071B7;
        }

#box7
{
    float: left;
    width: 20em;
    height: 24em;
    margin-bottom: 0em;
    margin-right: 1em;
    background: url(images/boxes/box7.jpg) no-repeat;
}

        #box7 a {
          display:block;
          width:100%;
          height: 17em;
          color: #000000;
          text-decoration:none;
        }

        #box7 a:hover {
          text-decoration:none;
          color: #0071B7;
        }

#box8
{
    float: left;
    width: 20em;
    height: 24em;
    margin-bottom: 0em;
    margin-right: 1em;
    background: url(images/boxes/box8.jpg) no-repeat;
}

        #box8 a {
          display:block;
          width:100%;
          height: 17em;
          color: #000000;
          text-decoration:none;
        }

        #box8 a:hover {
          text-decoration:none;
          color: #0071B7;
        }

#box9
{
    float: left;
    width: 20em;
    height: 24em;
    margin-bottom: 0em;
    margin-right: 0em;
    background: url(images/boxes/box9.jpg) no-repeat;
}

        #box9 a {
          display:block;
          width:100%;
          height: 17em;
          color: #000000;
          text-decoration:none;
        }

        #box9 a:hover {
          text-decoration:none;
          color: #0071B7;
        }


/* font styles */

	.body 
		{
			margin:0;
			padding:0;
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 12px;
			color:#000000;
		}

	.bodybold 
		{
			margin:0;
			padding:0;
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 12px;
			font-weight: bold;
			color:#000000;
		}
		
	.bodyBoldBlue
		{
			margin:0;
			padding:0;
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 12px;
			font-weight: bold;
			color:#00446A;
		}
		
	.bodyBoldWhite
		{
			margin:0;
			padding:0;
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 12px;
			font-weight: bold;
			color:#ffffff;
		}

	.heading 
		{
			margin:0;
			padding:0;
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 18px;
			color:#00446A;
			font-weight: bold;
		}

	.subheading 
		{
			margin:0;
			padding:0;
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 14px;
			color:#00446A;
			font-weight: bold;
		}
		
	.subheadingWhite 
		{
			margin:0;
			padding:0;
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 14px;
			color:#ffffff;
			font-weight: bold;
		}



/* main body links */

	a 
		{
			color: #00446A;
			text-decoration:none;
			font-weight: bold;
		}

	a:visited 
		{
			color: #00446A;
			text-decoration:none;
			font-weight: bold;
		}

	a:hover 
		{
			color: #000000;
			text-decoration:none;
			font-weight: bold;
		}
		
		
/* Case studies list links */

.caseLink
		{
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 12px;
			text-decoration:none;
			color:#000000;
		}	
		
a.caseLink:visited 
		{
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 12px;
			text-decoration:none;
			color:#000000;
		}

a.caseLink:hover 
		{
			font-family: Arial, Verdana, Helvetica, 'Trebuchet MS', sans-serif;
			font-size: 12px;
			text-decoration:none;
			color:#00446A;
		}


/*wrapper div for the whole site (the container) */

	#wrapper 
		{
			background:#00446A;
			width:970px;
			margin:0 auto;
			padding:0px 10px;
			font-family: Arial, Verdana, Helvetiva, sans-serif;
			font-size: 12px;
			color:#000000;
		}



/*divs to hold the main banner image */

	#banner
		{
			background:#00446A url('images/banner.gif') no-repeat;
			width:970px;
			height: 168px;
			margin:0 auto;
			padding:0px;
			color: #000;
		}



/*divs to hold the content, pictures and left menu */

	#main 
		{
			margin: 0 auto;
			padding:0;
			background: url('images/repeat.gif') repeat;
			width:970px;
			position: absolute;
			overflow: hidden;
		}


	#content 
		{
			width:735px;
			float:right;
			padding-left:0px;
			padding-right: 25px;
			margin-right: 0px;
			overflow:hidden;
			position: relative;
		}

	#sidebar 
		{
			width:199px;
			float:left;
			padding-left: 0px;
			margin: 0;
			position: relative;
		}



/*divs to hold the footer */

	#footer 
		{
 			background: url('images/footer.gif') no-repeat;
			padding: 0;
			margin-bottom: 0px;
			clear: both;
			width:970px;
			height: 35px;
			overflow: hidden;
		}




/* start of bullets list */

/* list font */


	.list
		{
			font-family: arial; font-size: 95%; color: #000000;
		}



	/* bullet image to use and space between points */
	
	#list li
		{
			margin: 10px;	/* vertical space between list items 5 pixels */
			list-style-image: url(images/bullet.gif);
		}



/* end of bullets list */



/* sidebar menu boxes */

	#sidebar h1 
		{
			margin: 0px;
			padding: 0px;
			color: #E3D7D7;
			background:url('images/repeat.gif') no-repeat;
			height:15px;
			font-size: 9px;
			width:199px;
		}

	#sidebar .fill 
		{
			padding: 0px;
			margin: 0px;
			background: url('images/repeat.gif');
			color: #000;
			width: 199px;
		}

	#sidebar h3 
		{
			padding: 0px;
			margin: 0px;
  			color: #000;	
			background: url('images/repeat.gif') no-repeat bottom;
			height: 27px;
			width: 199px;
		}

	#sidebar p 
		{
			padding: 5px 5px 0 10px;
			margin: 0px;
			font-family: Arial, Verdana, sans-serif;
			font-size: 11px;
			color: #000000;
		}

	#sidebar .title 
		{
			padding: 5px 0 0 10px;
			margin: 0;
			font-family: Georgia, serif;
			font-size: 12px;
			font-weight: bold;
			color: #636363;
		}


	#sidebar a:link, #sidebar a:visited, #sidebar a:active 
		{
			color: #4F70A4;
			text-decoration: none;
			font-weight: bold;
		}

	#sidebar a:hover 
		{
			color: #3E5880;
			text-decoration: none;
			font-weight: bold;
		} 



/* my navigation */

	#navholder 
		{
			float: left;
			width: 199px;
			font-family: Geneva, Arial, Helvetica, Sans-Serif;
			font-size: 12px;
		}

	#navholder ul 
		{
			margin: 0px;
			padding: 0px;
			list-style-type: none;
		}

	#navholder li 
		{
			margin: 0px;
		}

	#navholder a 
		{
			display: block;
			background-image: url("images/off.gif");
			background-repeat: no-repeat;
			background-position: 0% 50%;
			background-color: #00446A;
			background-color: inherit;
			padding: 4px 25px 4px 4px;
			border-right: 0px solid #000000;
			border-left: 0px solid #666666;
			border-bottom: 0px solid #000000;
		}

	#navholder a:link,  #navholder a:visited 
		{
			color: #00446A;
			text-decoration: none;
		}

	#navholder a:hover, #navholder a:active 
		{
			color: #BC8851;
			background-image: url("images/over.gif");
			background-repeat: no-repeat;
			background-position: 0% 50%;
			text-decoration: none;
		}

	#sellink a:link, #sellink a:visited, #sellink a:hover, #sellink a:active 
		{
			color: #BC8851;
			background-image: url("images/over.gif");
			background-repeat: no-repeat;
			background-position: 0% 50%;
			text-decoration: none;
		}

/* start of product navigation */

	#productNav 
		{
			float: left;
			width: 100%;
			font-family: Geneva, Arial, Helvetica, Sans-Serif;
			font-size: 12px;
		}

	#productNav ul 
		{
			margin: 0px;
			padding: 0px;
			list-style-type: none;
		}

	#productNav li 
		{
			float: left;
			white-space: nowrap;
			margin: 0 0 1em 0;
			padding: 0;
		}

	#productNav a 
		{
			color: #BC8851;
			padding: 4px 20px 4px 4px;
		}

	#productNav a:link
		{
			color: #BC8851;
			text-decoration: none;
		}

	#productNav a:hover 
		{
			color: #00446A;
			text-decoration: none;
		}

/* end of product navigation */


/* my navigation Internet Explorer 5 and 6 fixes */

<!--[if IE 5]-->
	<style>
		#navholder a {
			height: 1em;
			float: left;
			clear: both;
			width: 100%;
		}
	</style>
<![endif]-->



<!--[if IE 6]>
	<style>
		#navholder a { height: 1em; }
	</style>
<![endif]-->

	
/* fix to solve the disappearing background in IE */
ol{
  position: relative;  }


/* Contact form */

#contact-area
{
    width: 400px;
    margin-top: 25px;
}

#contact-area input, #contact-area textarea
{
    padding: 5px;
    width: 350px;
    font-family: Helvetica, sans-serif;
    font-size: 1em;
    margin: 0em 0em 1em 0em;
    border: 0.1em solid #ccc;
}

#contact-area textarea
{
    height: 9em;
}

#contact-area textarea:focus, #contact-area input:focus
{
    border: 0.1em solid #900;
}

#contact-area input.submit-button
{
    width: 80px;
    float: left;
}

label
{
    float: left;
    text-align: left;
    margin-right: 15px;
    width: 80px;
    padding-top: 5px;
    font-size: 10px;
}