/* Light IQ standard elements */
body {
    height: 100%;
	background: #FFFFFF;
	font: 10px Arial,sans-serif;
	width: 800px;
	margin: 0 auto;
	padding: 0;
    border: 0;
}

/*links esp for database image layout*/

a{color:#333333;}
a{text-decoration:none}
a:hover{color:#F2007A; text-decoration:none;}
a img
{
text-decoration: none;
outline: none;
margin: 0px;
padding: 0px;
border-width: 0;
border-style: none;
}

/* header */
.header {
	background: #ffffff;
	height: 70px;
	margin: 0 auto;
	width: 800px;
}


/* structure */
.container {
	background: #FFFFFF;
	margin: 0 auto;
	width: 800px;
	border: none;	
	
}



/* title */
.title {
}
.title h1 {
	color: #E2007A;
	font: 10px Arial,sans-serif;
}

/* main */
.main {
	width: 800px;
	margin: 0 auto;
	border: none;	
}


/*body text header*/
h1 {
	color: #E2007A; /*pink text*/
	margin-bottom: 4px;
	padding-top: 0px;
	font: bold 12px Arial,sans-serif;
}
.h1headline {
	color: #E2007A; /*pink text*/
	margin-bottom: 0px;
	padding-top: 0px;
	font: bold 18px Arial,sans-serif;
}
.hline {
	color: #E2007A; /*pink text*/
	margin-bottom: 15px;
	padding-top: 15px;
	font: bold 14px Arial,sans-serif;
	border-bottom: solid #eeeeee;
	border-bottom-width:thin;
}

/*body text*/
h2 {
	color: #333333;
	margin-bottom: 4px;
	padding-top: 6px;
	font: bold 11px Arial,sans-serif;
}



/* navigation */
.navigation {
    text-align:left; 
	padding: 0px 32px 0px 32px;
	background: url(images/pinkbar.jpg) no-repeat;
	font: bold 11px Arial,sans-serif;
	height: 20px;
	margin: 0 auto;
	width: 800px;
}
.navigation a {
	color: #FFFFFF;
	text-decoration: none;
	padding: 0px 16px 0px 18px;
	margin-right: 10px;
	line-height: 20px;
}
.navigation a:hover {
/*background: #FFFFFF;*/
	color: #FFCCFF;
}

/* search form 
-------------------------------------- */
.searchform {
	display: inline-block;
	zoom: 1; /* ie7 hack for display:inline-block */
	*display: inline;
	border: solid 1px #d2d2d2;
	padding: 3px 5px;	
	position:relative;
	left:300px; 
	
	background: #f1f1f1;
	background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#ededed));
	background: -moz-linear-gradient(top,  #fff,  #ededed);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed'); /* ie7 */
	-ms-filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ededed'); /* ie8 */
}
.searchform input {
	font: normal 12px/100% Arial, Helvetica, sans-serif;
}
.searchform .searchfield {
	background: #fff;
	padding: 6px 6px 6px 8px;
	width: 202px;
	border: solid 1px #bcbbbb;
	outline: none;

 
	-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
	-webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
	box-shadow: inset 0 1px 2px rgba(0,0,0,.2);
}
.searchform .searchbutton {
	color: #fff;
	border: solid 1px #eeeeee;
	font-size: 11px;
	height: 27px;
	width: auto;
	text-shadow: 0 1px 1px rgba(0,0,0,.6);
 

	background: #E2007A;
	background: -webkit-gradient(linear, left top, left bottom, from(#E2007A), to(#E2007A));
	background: -moz-linear-gradient(top,  #E2007A,  #E2007A);
	filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#E2007A', endColorstr='#E2007A'); /* ie7 */
	-ms-filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#E2007A', endColorstr='#E2007A'); /* ie8 */
}


/* sidenav */
.sidenav {
	float: right;
	font: normal 10px Arial,sans-serif;
	width: 180px;
	right: auto;
	padding-top: 30px;
	
}

.alignindex{
	float: right;
	font: normal 10px Arial,sans-serif;
	width: 180px;
	right: auto;
	padding-top: 63px;
	
}

.alignindex h1{
	background: #FFFFFF;
	font: bold 11px Arial,sans-serif;
	color: #E2007A;
	height: 22px;
	padding-bottom:10px;
	margin: 0;
	padding-left: 0px;
}

.sidenav h1, .sidenav .likeh1,.sidenav p  {
	background: #FFFFFF;
    border-bottom: 1px solid #FFFFFF;  
	border-top: 1px solid #FFFFFF;
	font: bold 11px Arial,sans-serif;
	color: #E2007A;
	height: 22px;
	margin: 0;
	padding-left: 0px;
}

.sidenav h1 li {
border-bottom: 1px solid #FFFFFF;   
border-top: 1px solid #FFFFFF;
list-style: none;
}

.sidenav h1 a, .sidenav p a {
	background: #FFFFFF;
	color: #E2007A;
	display: block;
	padding: 0px 0px 0px 0px;
	text-decoration: none;
}

.sidenav h1 a:hover, .sidenav .likeh1 a:hover,.sidenav p a:hover  {
	background: #FFFFFF;
	color: #554;
}

.sidenav h2 {
	background: #FFFFFF;
    border-bottom: 0px solid #FFFFFF;  
	border-top: 0px solid #FFFFFF;
	font: normal 12px Arial,sans-serif;
	color: #E2007A;
	margin: 0;
	padding-left: 0px;
}

.sidenav h2 li {
border-bottom: 0px solid #FFFFFF;   
border-top: 0px solid #FFFFFF;
list-style: none;
}

.sidenav h2 a {
	background: #FFFFFF;
	color: #E2007A;
	display: block;
	padding: 0px 0px 0px 0px;
	text-decoration: none;
}

.sidenav h2 a:hover {
	background: #FFFFFF;
	color: #554;
}

.sidenav ul {
	margin: 0;
	padding: 0;
}
.sidenav li {
border-bottom: 1px solid #FFFFFF;   
border-top: 1px solid #FFFFFF;
list-style: none;
}
.sidenav li a {
	background: #FFFFFF;
	color: #554;
	display: block;
	padding: 0px 0px 0px 0px;
	text-decoration: none;
}
.sidenav li a:hover {
	background: #FFFFFF;
	color: #E2007A;
}

/* content */
.content {
	padding-top: 12px;
	float: left;
	margin: 0 0 0 0;
	width: 580px;
}
.content .descr {
	color: #987E57;
	font-size: 1.1em;
	margin-bottom: 0px;
}
.content li {
	list-style: url(images/li.gif);
	margin-left: 0px auto;
	padding-left: 0px;
}
#content .info {
	background:url(postimg/line.gif) top repeat-x;
	padding:5px;
	font:90% Verdana;
}

#content .info p {
	background:url(postimg/info.gif) left no-repeat;
	padding:0 0 0 20px;
}

#content .info p a {
	float:right;
	padding:0 20px 0 0;
	background:url(postimg/comment_normal.gif) right no-repeat;
	color:#777;
	text-decoration:none;
	border:none;
}
#content .info p a:hover {
	background:url(postimg/comment.gif) right no-repeat;
	text-decoration:underline;
	border:none;
}

#content h3 {
	font:150% Trebuchet MS;
	margin:5px 0;
	border-bottom:1px solid #eee;
	color:#666;
}

#content blockquote {
	padding:0 10px;
	border-left:4px solid #eee;
	margin:10px 0;
	background:#fefefe;
}

#content blockquote p {
	margin:0;
	font:130% Trebuchet MS;
	line-height:26px;
	color:#0E91CF;
}

#content ul,ol {
	margin:10px 0 10px 25px;
	line-height:30px;
}

#content img {
	padding:4px;
	border:0;
	background:#fff;
}

#content p img {
	float:left;
	margin:10px;
}


/* just images frame layout*/
.frame {
  background-color:#ffffff;
  border: solid 1px #999;
}

.frame img {
  float: left;
  padding: 2%;
  width: 255px;
  max-width: 300px;
}

.frame p {
  float: right;
  width: 68%;
  margin: 0;
  padding: 2% 2% 2% 0;
}

/*brick a brack*/
input {
	color: #555;
	font: 10px Arial,sans-serif;
}
p,cite,code,ul {
	font-size: 1.2em;
	padding-bottom: 1.2em;
}

code {
	background: #FFE;
	border: 1px solid #EED;
	border-left: 6px solid #938262;
	color: #554;
	display: block;
	font: normal 1.1em "Lucida Sans Unicode",serif;
	margin-bottom: 12px;
	padding: 8px 10px;
	white-space: pre;
}
blockquote {
	background: url(images/icon_prog_arrow.gif) no-repeat;
	color: #666;
	display: block;
	font: 10px Arial,sans-serif;
	padding-left: 28px;
}

.clearer {
	clear: both;
}


/*int downlight special navigation*/
.menu {
width:50px; 
font-size:0.85em;
position:relative;
z-index:100;
}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
padding:0;
margin:0;
list-style-type:none;
}
.menu ul ul {
width:150px;
}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {
float:left;
width:150px;
position:relative;
}
/* style the links for the top level */
.menu a, .menu a:visited {
display:block;
font-size:11px;
text-decoration:none; 
color:#fff; 
width:139px; 
height:30px; 
border:1px solid #fff; 
border-width:1px 1px 0 0; 
background:#758279; 
padding-left:10px; 
line-height:29px;
}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {
width:150px;
w\idth:139px;
}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {
background:#d4d8bd url(../../graphics/drop.gif) bottom right no-repeat;

}
/* style the second level hover */
.menu ul ul a.drop:hover{
background:#c9ba65 url(../../graphics/drop.gif) bottom right no-repeat;
}
.menu ul ul :hover > a.drop {
background:#c9ba65 url(../../graphics/drop.gif) bottom right no-repeat;
}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {
background:#e2dfa8;
}
/* style the third level hover */
.menu ul ul ul a:hover {
background:#b2ab9b;
}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {
visibility:hidden;
position:absolute;
height:0;
top:31px;
left:0; 
width:150px;
}
/* another hack for IE5.5 */
* html .menu ul ul {
top:30px;
t\op:31px;
}

/* position the third level flyout menu */
.menu ul ul ul{
left:150px; 
top:0;
width:150px;
}
/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {
left:-150px;
}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {
background:#d4d8bd; 
color:#000; 
height:auto; 
line-height:1em; 
padding:5px 10px; 
width:129px
/* yet another hack for IE5.5 */
}
* html .menu ul ul a{
width:150px;
w\idth:129px;
}


/* style the top level hover */
.menu a:hover, .menu ul ul a:hover{
color:#fff; 
background:#949e7c;
}
.menu :hover > a, .menu ul ul :hover > a {
color:#fff;
background:#949e7c;
}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{
visibility:visible; 
}
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{
visibility:hidden;
}

/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ 
visibility:visible;
}

/*Table Colour*/
#mytable {
	width: 500px;
	padding: 0;
	margin: 0;
}


/*turn pink text to grey*/
.pink2gr {
/* background: url(images/paperop.gif) top right no-repeat; */
	font: bold 16px Arial,sans-serif;
	color: #E52E87;
	height: 22px;
	margin: 0;
	padding-left: 0px;
}

.pink2gr a {
	background: #FFFFFF;
	color: #E52E87;
	display: block;
	padding: 0px 0px 0px 0px;
	text-decoration: none;
}

.pink2gr a:hover {
	background: #FFFFFF;
	color: #554;
}

/*general grey text*/
.grtext {
	background: #FFFFFF;
	font: normal 12px Arial,sans-serif;
	color: #554;
	height: 20px;
	margin: 0;
	padding-left: 0px;
}

/*general pink bold text*/
.pinktext
{
font: normal 1.2em Arial,sans-serif;
color: #E2007A;
}

/*general green bold text*/
.greentext
{
font: normal 12px Arial,sans-serif;
color: #006600;
}

.greentext2
{
font: bold 12px Arial,sans-serif;
color: #66ff33;
}

/*general pink bold text*/
.pinkbold
{
font: bold 1.2em Arial,sans-serif;
color: #E2007A;
}

/*previous and next buttons*/

.prevbutton a{
background: url(images/previous.jpg) no-repeat;
display: block;
width: 102px;
height: 21px;
}

.prevbutton a:hover {
background: url(images/previous_hover.jpg) no-repeat;
display: block;
width: 102px;
height: 21px;
}

.nextbutton a{
background: url(images/button_ani.gif) no-repeat;
display: block;
width: 102px;
height: 21px;
}

.nextbutton a:hover {
background: url(images/next_hover.jpg) no-repeat;
display: block;
width: 102px;
height: 21px;
}


/* image magnifier*/
.gallerycontainer{
position: relative;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid #E2007A;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 0;
left: 300px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

/* footer */
.footer {
    background-color:#FFFFFF;
	color: #333333;
	font: normal 10px Arial,sans-serif;
	text-align: left;
	margin: 0 auto;
	width: 800px;
}

/*post comment*/
.comment-block{float:left;width:240px;margin:0 0 12px 2px;}
.comment-talk{float:left;width:14px;height:13px;background: url(images/comment-talk.gif);margin:9px 0 0 0;}
.comment-body{float:left;width:200px; background:url (images/comment-bg.gif) no-repeat; }
.comment-top{width:200px;height:4px;background:url (images/comment-top.gif) no-repeat;}
.comment-btm{width:200px;height:4px;background: url (images/comment-btm.gif) no-repeat;}
.comment-text{width:200px;min-height:28px; text-align: left; padding:6px 10px;background:url (images/comment-bg.gif) no-repeat;border-right:1px solid #b2b2b2;background-image: url(images/comment-bg.jpg);}
.comment-num{float:left;width:24px;margin:10px 0 0 3px;font-size:12px;color:#7e7e7e;}
.comment-info{width:200px;display:block;margin:2px 0 0 14px;clear:left;color:#7e7e7e;}
.comment-info span{font-family:Verdana,Arial,Helvetica,Sans-Serif;font-size:12px;vertical-align:top;}


/*image and text hilight effects -- on project*/
#wrap {position:relative; width:800px; height:600px; background:#222; padding:20px; position:relative; font-family: sans-serif;}
#wrap h1 {color:#fff; font-family:arial, sans-serif; font-weight:normal;}
#outerImage {padding:0; margin:0; list-style:none;}
#outerImage li a {color:#777; text-decoration:none;}
#outerImage table {border-collapse:collapse; width:0; height:0; margin:-1px -4px;}
#outerImage span {display:block; width:571px; height:379px; background:url(images/comproj1.jpg); position:absolute; left:230px; top:50px;}
#innerImage {padding:0; margin:0 ; list-style:none;}
#innerImage li {width:130px; /*individual menu width */
height:15px; /*individual menu height */
float:left; color:#777; font-size:12px; }
#innerImage li a {float:left; color:#777; text-decoration:none; font-size:12px; white-space:nowrap;  top: 50%;}
#innerImage li a b {display:block; width:140px; height:187px; position:absolute; background:#transparent;}
#innerImage li a b#link1 {left:230px; top:50px;}
#innerImage li a b#link2 {left:373px; top:50px;}
#innerImage li a b#link3 {left:516px; top:50px;}
#innerImage li a b#link4 {left:659px; top:50px;}
#innerImage li a b#link5 {left:230px; top:240px;}
#innerImage li a b#link6 {left:373px; top:240px;}
#innerImage li a b#link7 {left:516px; top:241px;}
#innerImage li a b#link8 {left:659px; top:241px;}
#innerImage li a b#link9 {left:230px; top:460px;}

#outerImage li a:hover {border:0;}
/*#outerImage :hover span {background:url(images/dark.jpg);}*/

#innerImage li a:hover {color:#F2007A; }
#innerImage li a:hover b {cursor:pointer;}

#innerImage :hover b#link1 {background:#fff url(images/commercial_westonpark.jpg);}
#innerImage :hover b#link2 {background:#fff url(images/commercial_chelseafs_2010.jpg);}
#innerImage :hover b#link3 {background:#fff url(images/commercial_64knightbridge.jpg);}
#innerImage :hover b#link4 {background:#fff url(images/commercial_lancome.jpg);}
#innerImage :hover b#link5 {background:#fff url(images/commercial_37degree.jpg);}
#innerImage :hover b#link6 {background:#fff url(images/commercial_barnleyspa.jpg);}
#innerImage :hover b#link7 {background:#fff url(images/commercial_dgalvin.jpg);}
#innerImage :hover b#link8 {background:#fff url(images/commercial_pangolin.jpg);}
#innerImage :hover b#link9 {background:#fff url(images/LD32.jpg);}

/* This CSS is used for the Show/Hide functionality. */
.more {
display: none;
border-top: 1px solid #F2007A;;
}
a.showLink, a.hideLink {
text-decoration: none;
color: #F2007A;
padding-left: 0px;
background: transparent url(down.gif) no-repeat left; }
a.hideLink {
background: transparent url(up.gif) no-repeat left; }
a.showLink:hover, a.hideLink:hover {
}
#jscontent1, #jscontent2, #jscontent3, #jscontent4, #jscontent5, #jscontent6, #jscontent7 {width: 510px; height: 145px; background-color: #eee; padding:  20px 30px; margin-bottom: 5px; }

.add2cartbut {
font-size:2em; /* Bigger addtocart submit form button text */
color: #E2007A;
text-decoration:none;
}

/*search button box*/
#search-block-form input.form-submit, #search-form input.form-submit {
height: 24px;
width: 24px;
cursor: pointer;
text-indent: -9999px;
border: none;
background: url(images/mag_glass.jpg) no-repeat left top;
}


#IEroot .block-search input.form-submit, #IEroot #search-form input.form-submit {
width: 34px;
font-size: 0;
color: #fff;
text-align: right;
}
#IEroot #search-form .search-advanced input.form-submit {
width: 44px;
text-indent: 0;
}

/*feed section*/
.feed {
  margin-left: 3px;
  padding: 0 0 0 19px;
  background: url("images/feed-icon.png") no-repeat 0 50%;
} 

.feed-list {
  margin: 0 0 15px 15px;
  padding: 0;
  list-style-type: none;
}

.feed-list li {
  margin: 0 0 10px 0;
  padding: 0;
  list-style-type: none;
}

.feed-list li a {
  padding: 0 0 0 19px;
  background: url("images/feed-icon.png") no-repeat 0 50%;
  list-style-type: none;
}
.arcsin_infobox {position: absolute; right: 0; top: 0; background: #222; color: #FFF; padding: 6px 12px; font: normal 12px "Lucida Sans Unicode",sans-serif; z-index: 10;}
.arcsin_infobox a {color: #F93; text-decoration: none;}
.arcsin_infobox a:hover {color: #FA4; text-decoration: underline;}
.arcsin_infobox form {display: inline; margin: 0; padding: 0;}
.arcsin_infobox select {font: normal 1em sans-serif; margin: 0 5px;}
.arcsin_infobox {position: absolute; right: 0; top: 0; background: #222; color: #FFF; padding: 6px 12px; font: normal 12px "Lucida Sans Unicode",sans-serif; z-index: 10;}
.arcsin_infobox a {color: #F93; text-decoration: none;}
.arcsin_infobox a:hover {color: #FA4; text-decoration: underline;}
.arcsin_infobox form {display: inline; margin: 0; padding: 0;}
.arcsin_infobox select {font: normal 1em sans-serif; margin: 0 5px;}
.style19 {font-weight: bold}
#apDiv1 {
	position:absolute;
	left:178px;
	top:26px;
	width:601px;
	height:34px;
	z-index:2;
.panels h2{color:#E2007A;}
.panels a {color:#E2007A;text-decoration:none}
.panels a:hover{text-decoration:underline;}
.panels h2 {color:#E2007A;}