@charset "UTF-8";
/* CSS Document */


 * {
     margin: 0;
 }
html, body,  {height: 100%;}


h1 {
	color:#B0B0B0;
	background-colour: transparent;
	background: transparent;
}



h2 {
color:#5C5C5C;
	font-size: 11px;
	background-colour: transparent;
	background: transparent;
}

h3 {
color:#5C5C5C;
	font-size: 16px;
	background-colour: transparent;
	background: transparent;
}

h4 {
color:#5C5C5C;
	font-size: 56px;
	background-colour: transparent;
	background: transparent;
	line-height: 1.3;
}


body {
	font: 65% 'helvetica neue',sans-serif;
	background: #ffffff;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	color: #3E3E3E;
	height: 100%;
}


div#contain  {
	position: relative;
	padding-bottom: 40px;
	height: 100%;
}

img {
border:none;}





a:link {
	color: #5C5C5C;
	text-decoration: none;
	}
a:visited {
	color: #ABA9A9;
	text-decoration: none;
	}
a:hover {
	text-decoration: none;
	color: #B9BBBB;
	}
a:active {
	color: #2F2E2E;
	text-decoration: none;
	outline-style:none;
	}
	
	a:focus {
    
	 -moz-outline-style: none;
	 outline-style:none;
}
	
	
.topspacer   {
	height: 4px;
	
}
div#midpacer  {
	height: 13px;
	
}
div#footer  {
	font: 'helvetica neue' sans-serif;
	position: relative; /* negative value of footer height */
	height: 30px;
	clear:both;
	line-height: 20px;
	font-style: normal;
	text-transform: uppercase;
	text-align: right;
	font-weight: bold;
	top: 20px;
	letter-spacing: 3px;
	color: #C3C3C3;
	font-size: 0.5em;
}

div#header  {
	height: 80px;
	position: relative;
	
}

div#header img {
	position: absolute;
	bottom: 2px;
	left: 0px;
	
}
div#topnav1, #topnav2, #topnav3 {
	height: 10px;
	display:none;
	border-bottom: solid #ffffff 4px;
	color: #5C5C5C;
	}
	
	

	
	
div#topnav1 topnav2 topnav3 img    {
	border:none;
	}
		


#statement {
	display:none;
	
}


div#midsection {
	position: relative;
	height: 540px;
	top: 30px;
	
}

.stripe {
	height: 12px;
	background-color: #5A5F77;
	display:block;
	}
	
	.stripe:hover{
	background-color: #FFFFFF;
}

div#frontai  {
	position: absolute;
	z-index: 1;
	left: 85px;
	top: 140px;
}


div#frontai2  {
	position: absolute;
	z-index: 2;
	left: 580px;
	top: 100px;
	visibility: hidden;
}

div#midsection.left  {
	position: relative;
	background-color: #FDFDFD;
	
}


div#secondnav  {
	position:absolute;
	top: 0px;
	left: 0px;
	width: 140px;
	background-color: #FFFFFF;
	height: 240px;
	visibility: hidden;
	border: none;
	outline-style: none;
}

div#secondnavport  {
	position:absolute;
	top: 0px;
	left: 0px;
	width: 190px;
	background-color: #FFFFFF;
	height: 240px;
	border: none;
	outline-style: none;
}


div#contact  {
	position:absolute;
	top: 60px;
	left: 0px;
	width: 538px;
	background-color: #FFFFFF;
	height: 420px;
	font-size: 11px;
	
	
}
div#form  {
	position:absolute;
	top: 143px;
	left: 0px;
	width: 500px;
	background-color: #FFFFFF;
	height: 210px;
	font-size: 11px;
	outline: none!important;
	border:none;
	
}


div#about  {
	position:absolute;
	top: 80px;
	left: 0px;
	width: 440px;
	height: 430px;
	text-align: justify;
}

div#comment  {
	position:absolute;
	top: 300px;
	left: 0px;
	width: 238px;
	height: 240px;
	
}

div#client  {
	position:absolute;
	top: 0px;
	left: 0px;
	width: 110px;
	height: 12px;
	margin-bottom: 10px;
	}
	
	div#client2  {
	position:absolute;
	top: 5px;
	left: 49px;
	width: 110px;
	height: 12px;
	margin-bottom: 0px;
	}
	
	div#see  {
	position:absolute;
	top: 160px;
	left: 0px;
	width: 210px;
	height: 12px;
	margin-bottom: 10px;
	}
	div#see2  {
	position:absolute;
	top: 160px;
	left: 49px;
	width: 110px;
	height: 12px;
	margin-bottom: 10px;
	}
	
		div#see2 :hover{
	color:#91759B;
	
	}
	
	
	div#brief  {
	position:relative;
	top: 26px;
	left: 0px;
	width: 50px;
	height: 12px;
	text-transform: uppercase;
	font-style: normal;
	margin-bottom: 50px;
	
	
	}
	
	div#address {
	position:relative;
	top: 36px;
	left: 0px;
	width: 200px;
	height: 12px;
	text-transform: lowercase;
	font-style: normal;
	margin-bottom: 50px;
	color: #888888;
	
	
	}
	
	
	div#brief2  {
	position:absolute;
	top: 31px;
	left: 49px;
	width: 170px;
	height: 12px;
	text-transform: lowercase;
	font-style: normal;
	margin-bottom: 50px;	
	}
	
	
	
	div#what  {
	position:relative;
	left: 0px;
	width: 212px;
	height: 75px;
	text-align: justify;
	margin-bottom: 80px;
	}
	
	div#im  {
	position:absolute;
	top: 130px;
	left: 0px;
	width: 215px;
	height: 60px;
	text-align: justify;
	
	}
	
	
	div#im img {
	margin: 0 0.5em 0 0; /* Provides horizontal separation between menu items */
	border: solid 1px #E5E5E5;
	}
	
	
	
	div#visit  {
	position:relative;
	left: 0px;
	width: 210px;
	height: 12px;
	border: 0px;
	
	}
	
			div#visit :hover{
	color:#91759B;
	
	}
	
div#toppic  {
	position:absolute;
	left: 0px;
	width: 940px;
	height: 527px;
	z-index: 100;
	top: 0px;
	}
	
	
div#midsection .righthome  {
	background-color: #ffffff;
	height: 427px;
	z-index: 1;
	width: 471px;
	position: absolute;
	bottom: 0px;
	right: 0px;
	margin-bottom: 8px;
	
}



 #teext {
	background-color: #51453C;
	height: 199px;
	width: 356px;
	position: absolute;
	bottom: 60px;
	left: 20px;
	border-style: none;
	
}


 #teext img {
	
	border-style: none;
	
}

div#midsection .right  {
	height: 527px;
	position: absolute;
	top: 2px;
	right: 0px;
}



div#midsection .right img  {
	right: 0px;
	position: absolute;
	bottom: 0px;
	border: solid 1px #E5E5E5;	
}

div#midsection .righthome img  {
	
	
	border: solid 1px #E5E5E5;	
}


div#midsection .rightstatement  {
	visibility: visible;
	height: 400px;
	position: absolute;
	top: 18px;
	right: 0px;
	width: 400px;
}

div#midsection .rightstatement img  {
	position: absolute;
	bottom: 0px;
	left: 0px;
	
}

.abouttitles{


}

/***  slideshow - set the width and height to match your images **/

#slideshow {
	position:absolute;
	height:427px;
	width: 471px;
	bottom: 20px;
}

#slideshow DIV {
	position:absolute;
	left:0;
	z-index:8;
	opacity:0.0;
	height: 427px;
	background-color: #FFF;
	width: 471px;
}

#slideshow DIV.active {
    z-index:10;
    opacity:1.0;
}

#slideshow DIV.last-active {
    z-index:9;
}

#slideshow DIV .slidey {
	height: 427px;
	display: block;
	border: 0;
	margin-bottom: 0px;
	width: 471px;
}


.textslide {
	position:absolute;
	right:60px;
	height: 22px;
	border: 0;
	margin-bottom: 40px;
	z-index: 11;
	color: #5A5F77;
	background-color: #FFFFFF;
	border:none;
	width: 400px;
	top: -25px;
}
.inner {
	font-family: "Times New Roman", Times, serif;
	font-size: 11px;
	font-style: normal;
	color: #000000;
	border: solid #E0E0E0 1px;
	padding: 5px;
	background-color: #FFFFFF;
}

.whatcolour {
	text-indent: 4px;
	
	
}
.them {
	font-family: "Trebuchet MS", Arial. Helvetica;
	font-size: 12px;
	font-style: italic;
	padding-left: 45px;	
	
}

  /*this is what we want the div to look like
    when it is not showing*/
  div.loading-invisible{
	/*make invisible*/
    display:none;
  }

  /*this is what we want the div to look like
    when it IS showing*/
  div.loading-visible{
	/*position it 200px down the screen*/
    position:absolute;
	top:100px;
	left:0;
	width:100%;
	text-align:center;
	/*in supporting browsers, make it
      a little transparent*/
    background:#ffffff;
	opacity:1;
	height: 600px;
	z-index: 9999;
  }