@import url(/clientlib/css/quotes.standard.css);


*  {
	margin: 0; padding: 0;
	list-style-type: none;
}
body {
	font: 76% "Trebuchet MS", Arial, Verdana, Tahoma, Sans-serif;
	color: #000;
	background: #fff url(/images/bgrounds/body.jpg) no-repeat 50% 0;
}

.clear {
	height: 0px;
	line-height: 0;
	clear: both;
	font-size: 0px;
}
a { font-size: 1em; }
a:link{ color: #4e3594; text-decoration: underline; }
a:visited { color: #4e3594; text-decoration: underline; }
a:hover { color: #4e3594; text-decoration: none; }
a:active { color: #4e3594; text-decoration: underline;}
a.external {
	background:transparent url(/images/icons/external.png) no-repeat scroll right center;
	padding-right:13px;
}
#content ul, #intro ul { margin: 0 0 1em 5px; }
#content ul li, #intro ul li { 
	margin: 0 0 .4em 0; 
	padding: 0 0 0 20px; 
	background: url(/images/icons/arrow.gif) no-repeat 6px 6px; 
}
#intro ul li {
	background-image: url(/images/icons/bullet-on-purple.gif);
	margin-bottom: 0;
}
#content ol {
	margin: 0 0 1em 20px;
}
#content ol li {
	list-style-type: decimal;
	margin: 0 0 .4em 0; 
}

p, table, td, p a, li a, table a, dl a {
	font-size: 1em;
}

img { border: 0; }
.img-l, .left_aligned_image_margin, .left_aligned_image_margin_and_border { margin: 0 10px 10px 0; float: left; }
.img-r, .right_aligned_image_margin, .right_aligned_image_margin_and_border { margin: 0 0 10px 10px; float: right; }
.img-c { margin-left: 0px; margin-bottom: 10px}
.img-bdr, .image_border, .right_aligned_image_margin_and_border, .left_aligned_image_margin_and_border { padding: 1px; border: 1px solid #eee; }

h1, h2, h3, h4, h5, h6 {
	font-size: 1em;
	margin: 0 0 .5em 0;
	color: #8776b6;
}
#home h1 {
	border: none;
	padding-bottom: 0;
}
h1 { font-size: 1.4em; color: #4e3594; border-bottom: 1px solid #d9dadc; padding-bottom: 5px; }
h2 { font-size: 1.3em; }
h2 strong { color: #4e3594; }
h3 { font-size: 1.1em; }
h4 { font-size: 1.1em; }
h5 { font-size: 1em; }
h6 { font-size: 1em; }

h1 span, h2 span, h3 span {
	display: none;
}

h1 span.blurb {
	display: inline;
	font-size: 90%;
	font-weight: bold;
	color:#a7a9ac;
}

p {
	margin: 0 0 1em 0;
}

hr {
	height: 1px;
	border-width: 0;
	border-top: 1px solid #eee;
	background-color: #fff;
	margin: .5em 0 !important;
	margin: 0;
}

#header {
	position: relative;
	width: 100%;
	height: 208px;
	border-bottom: 1px solid #fff;
}

#header .logo {
	position: absolute;
	top: 26px;
	left: 35px;
}
#header .logobigger {
	position: absolute;
	top: 12px;
	left: 35px;
}
#container {
	margin: 0 auto;
	width: 973px;
	text-align: left;
}
#pageheader {
	width: 973px;
	height: 254px;
}
#intro, #panorama, #promo {
	float: left;
	display: inline;
}
#intro {
	width: 319px;/* 363 */
	height: 233px;/* 381 */
	background: url(/images/bgrounds/purple-left.jpg) no-repeat bottom left;
	color: #d1c9e7;
	padding: 24px 14px 0 30px;
}
#intro h1,
#promo h1 {
	color: #fff;
}
#promo h1 { padding: 10px 0 0 22px; color: white; margin-bottom: 4px; }
#promo h1 a { text-decoration: none; color: white !important }
#promo #flash_promo {
	padding: 0 0 10px 22px;
}

#panorama {
	width: 430px;/* 431 */
	height: 258px;
	padding-left: 1px;
	background: url(/images/bgrounds/panorama.png) no-repeat bottom;
}
#promo {
	width: 179px;
	height: 256px;
	background: url(/images/bgrounds/purple-right.jpg) no-repeat bottom right;
	color: #d1c9e7;
}
#promo h2 {
	color: #fff;
	font-size: 1.1em;
	/*text-transform: lowercase;*/
	margin: 0 0 5px 22px;
}
#promo li {
	background: url(/images/icons/purple-arrow.gif) no-repeat 13px 6px;
	padding: 0 22px;
	margin: 0;
	line-height: 1.4em;
	font-size: .9em;
}
#promo a, #promo a:link, #promo a:visited, #promo a:active {
	color: #d1c9e7;
	margin: 0;
	padding: 0;
	text-decoration: none;
}
#promo a:hover {
	text-decoration: underline;
}

.client-login{
	position: absolute;
	top: 217px;
	left:812px;
}

/*#pageheader {
	background: #4e3594 url(/images/bgrounds/pageheader.gif) no-repeat bottom left;
	padding-bottom: 40px;
}
#intro, #panorama, #promo {
	float: left;
	display: inline;
}
#intro {
	color: #d1c9e7;
	background: url(/images/bgrounds/intro.jpg) no-repeat;
	width: 363px;
}

#panorama {
	width: 437px;
	height: 259px;
	background: url(/images/bgrounds/panorama.png) no-repeat;
}
#promo {
	width: 173px;
	background: url(/images/bgrounds/promo.gif) no-repeat top right;
}*/

#main {
	width: 973px;
}
#main-l, #main-r {
	float: left;
	display: inline;
}

#main-l {
	width: 558px;/* 626 */
	padding: 30px 34px 0 34px;
	text-align: justify;
}
#main-l p {
	
}
#main-r {
	width: 347px;
}



#nav {
	text-align: left;
	background: url(/images/bgrounds/nav.gif) no-repeat;
	height: 39px;
	margin: 0 0 0 0;
	padding: 5px 0 0 0px;
}
  
#tabnav { 
	float: left; 
	width: 100%;
	white-space: nowrap;
	margin: 0 0 0 0;
	padding: 0 0 0 0; /* same as amount of graphic 'bottom' if any */
	/*background: transparent url(/images/bgrounds/bg-tabnav.gif) repeat-x left bottom;*/
}
  
#tabnav ul.toplevel {
    margin: 0 0 0 30px;
    padding: 0 0 0 0;
    list-style: none !important;
    background: transparent;
}
  
#tabnav li {
    float:left;
    background: transparent url(/images/bgrounds/bg-tab-left.gif) no-repeat left top;
    padding: 0 0 0 10px;
	 margin-right: 2px;
   /* border-bottom: 1px solid #f00;  matches 1px underlining of nav */
    list-style: none !important;
}
  
#tabnav span.content {
    float: left;
    display: block;
	/*text-transform: lowercase;*/
    width: .1em;
    background: transparent url(/images/bgrounds/bg-tab-right.gif) no-repeat right top;
    padding: 0px 15px 0 5px; /* padding right = padding left + padding left of tabnav li */
}

/* WTF, i don't know, IE7 just needs a background color, besides transparent, or won't play ball.....typical */
#tabnav span.content { background-color: #4E3594 }

#tabnav span.content a {
    font-size: 1.2em;
    color: #fff; 
}
  
#tabnav > ul span.content {width:auto;}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabnav span.content {float:none;}
/* End IE5-Mac hack */

#tabnav a:hover {
   /* color:#f00; nothing*/
    /*text-decoration:underline;*/
}
 

/* current tab background left */
div#nav div#tabnav li.current {
    background-position:0 -75px;
    border-width: 0;
    list-style: none !important;
} 


/* current tab background right and underline removal */
div#nav div#tabnav li.current span.content {
    background-position: 100% -75px;
    padding-bottom: 0px; /* has to be 1 more (or however many pixels high the navigation underline is) than regular span.content */
}  











/* not active left side */
#tabnav li:hover/*, #tabnav li:hover span.content*/ {
    background-position: 0% -150px; 
}
/* not active right side */
#tabnav li:hover span.content {
    background-position: 100% -150px;
}



/* current tab */
div#nav div#tabnav li.current span.content a {
    text-decoration:none;
	 color: #4e3594; 
}


/*current tab hover, first for IE, second for FF*/
div#nav div#tabnav li.current span.content a:hover,    
div#nav div#tabnav li.current:hover span.content a {
    color: #4e3594;
	 text-decoration: none;
}
 /* not active tab(s) */
#tabnav span.content a { 
    color: #fff;
    text-decoration: none;
}
/* crap browser hover */
#tabnav li a:hover {
   /* text-decoration: underline;*/
    color: #fff;
}
/* good browser hover */
#tabnav li:hover a, #tabnav li:hover span.content a {
    /*text-decoration: underline;*/
    color: #fff;
}






#nav, #nav ul {
	line-height: 1;
}



/*#nav ul a.current:link, #nav ul a.current:visited, #nav ul a.current:active {
	background: #5f5f8b;
	color: #fff;
	display: block;	
	font-weight: normal;	
	text-decoration: none;
	padding-bottom: 11px;
}*/


#nav a, #nav a:link, #nav a:visited, #nav a:active {
	display: block;
	/*color: #666;*/
	background-image: none;
	padding: 11px 0px 12px 0px;
	text-decoration: none;
}




#nav a:hover {
	color: #fff;
}

#nav li {
	float: left;
	text-align: center;
}
#nav li ul li a, #nav li ul li a:link, #nav li ul li a:visited, #nav li ul li a:active {
	padding: 5px 0px 5px 0px;
	line-height: 1.2em;
	color: #fff;
	background-image: none;
	width: 168px;
	/*margin-left: -6px;*/
	/*font-size: .9em;*/
}


#nav li ul {
	position: absolute;
	background-color: #9080bc;
	padding: 5px;
	width: 178px;
	left: -999em;
	z-index: 100;
	white-space: normal;
	margin: 0;
}

#nav li ul li {
	width: 168px;
	text-align: left;
	border-bottom: 1px solid #8776b6;
	position: relative;
	z-index: 1000;
	margin:0px;
}
#nav li ul ul {
	padding: 0;
	position: absolute;
	top: 0; right: -178px;
	z-index: 10000;
}
#nav li li.active {
	font-weight: bold;
	background: #eee;
}
#nav li ul li.active a { color: #4E3594 }
#nav li li.active ul {
	background: #fff;
	font-weight: normal;
}


#nav li li li li {	
	z-index: 10;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
	left: auto;
	margin-left: -6px;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul, #nav li.sfhover ul ul ul ul {
	left: -999em;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul, #nav li li li li.sfhover ul {
	left: auto;
}

#nav li li:hover, #nav li li.sfhover, 
#nav ul li.current ul li a:hover {
	background-color: #4e3594;
	color: #fff;
	background-image: none;
}
#nav li:hover, #nav li.sfhover {
	color: #fff;
}

#bottompanel {
	width: 973px;
}
#threed {
	float: left;
	display: inline;
	width: 297px;/* 330 */
	padding: 0 0 0 33px;
}
.homeright {
	display: inline;
	float: left;
	width: 613px;
}
.homeright ul {
	float: left;
	display: inline;
	width: 185px;
	margin-left: 15px;
}
.homeright li {
	padding: 5px 0 5px 20px;
	color: #555659;
	background: url(/images/icons/tick.gif) no-repeat 0 50%;
}
.homeright ul a {
	color: #555659;
	text-decoration: none;
}
.homeright ul a:hover {
	text-decoration: underline;
	color: #4e3594;
}
.greybox {
	color: #555659;
	width: 613px;
	margin-top: 5px;
	padding-top: 19px;
	background: url(/images/bgrounds/greybox-top.gif) no-repeat;
}
.greybox-bottom {
	background: url(/images/bgrounds/greybox-bottom.gif) no-repeat bottom left;
	padding-bottom: 15px;
	height: 62px;
	min-height: 62px;
	/*border-top: 1px solid blue;
	border-bottom: 1px solid blue;*/
}
html>body .greybox-bottom { height: auto }
.polo, .enews {
	float: left;
	display: inline;
	width: 307px;
	height: auto;
}
.polo h3, .polo2 h3 {
	display: block;
	float: left;
	width: 156px; /*306*/
	height: 17px;
	margin-top: 10px;
	margin-bottom: 10px;
	background: url(/images/text/designed-by-you.gif) no-repeat 0 0; /*left-123*/
}
.polo2 h3 {
	margin-top: 0;
	padding-top: 5px;
	background-position: /*110px*/ 0 5px;
}
.polo a,.polo a:link, .polo a:visited, .polo a:active,
.polo2 a,.polo2 a:link, .polo2 a:visited, .polo2 a:active {
	color: #555659;
	text-decoration: none;
}
.polo a:hover, .polo2 a:hover {
	text-decoration: underline;
}
.enews h3, #enews2 h3 {
	width: 227px;
	height: 17px;
	margin-top: 10px;
	margin-bottom: 10px;
	background: url(/images/text/e-newsletter.gif) no-repeat;	
}
.polo p {
	float: left;
	padding-right: 10px;
}
.enews {
	width: 286px;/* 306 */
	padding: 0 0 0 20px;
}
.polo img {
	float: left;
	margin: 0 10px 0 14px;
}
.greybox input, #enews2 input {
	border: 1px solid #fff;
	background: #d9dadc;
	width: 92px;
	padding: 2px 1px;
	color: #555659;
}
.greybox form, #enews2 form {
	position: relative;
}
.greybox .namefield, .greybox .emailfield, #enews2 .namefield, #enews2 .emailfield {
	position: absolute;
	top: 0; left: 0;
}
.greybox .emailfield, #enews2 .emailfield {
	left: 104px;
}
.greybox label, #enews2 label {
	display: block;
}
.greybox input.button, #enews2 input.button {
	width: auto;
	height: auto;
	padding: 0;
	border: none;
	position: absolute;
	top: 18px; left: 210px;
	
}

#ph-internal {
	background: #4e3594 url(/images/bgrounds/ph-internal.jpg) no-repeat bottom left;
	height: 159px;
	max-height: 159px;
}
#blurb, #internalimg {
	float: left;
	display: inline;
}
#blurb {
	width: 399px;/* 499 */
	color: #d1c9e7;
	padding: 25px 65px 10px 35px
}
#internalimg {
	width: 471px;
}
#internalimg img {
	border: 1px solid #fff;
	border-top: none;
}

#enews2 {
	background: url(/images/bgrounds/smallgreybox-top.gif) no-repeat;
	padding-top: 15px;
	width: 303px;
	color: #555659;
}
#enews2bottom {
	background: #d9dadc url(/images/bgrounds/smallgreybox-bottom.gif) no-repeat bottom left;
	padding-bottom: 15px;
	padding: 0 0 15px 15px;
}
.polo2 {
	width: 303px;
	padding-top: 19px;
	color: #555659;
	background: url(/images/bgrounds/polo-top.gif) no-repeat;
	margin-bottom: 16px;
}
.polo2 img {
	float: left;
	margin-right: 15px;
}
.polo2bottom {
	background: #d9dadc url(/images/bgrounds/smallgreybox-bottom.gif) no-repeat bottom left;
	padding-bottom: 15px;
	padding: 0 0 15px 15px;
}
#enews2 h3 {
	margin-top: 0;
}
#enews2 form {
	height: 50px;
}

/*#home #footer {
	border-top: none;
}*/
#home #footer {
	margin-right: 30px;
	width: 910px;
}
#footer {
	color: #555659;
	position: relative;
	width: 897px;/* 973 */
	border-top: 1px solid #d9dadc;
	margin: 1em 43px 0 33px;
	
}

/*#home #footer p {
	top :0;
}*/
#footer p {
	position: absolute;
	top: 7px;
}
#footer p.address {
	left: 0;
}
#footer p.phones {
	right: 0;
	text-align: right;
}
#footer strong {
	color: #4e3594;
}
#footer a, #footer a:link, #footer a:visited, #footer a:active {
	color: #4e3594;
	text-decoration: underline;
}
#footer a:hover {
	text-decoration: none;
}

#testimonials blockquote {
	margin: 1em 2em;
	font-style: italic;
	font-size: 105%;
}

.faqlist, .newslist {
	padding-top: 1em;
}

.faqlist dt, .newslist dt {
	font-weight: bold;
	color: #4e3594;
	font-size: 110%;
}

.faqlist dd, .newslist dd {
	margin: 0.5em 1em 1.5em 1em;
}

.faqlist dt:hover, .newslist dt:hover{
	color:#999999;
}

#flash.cooliris {
	display: block;
	/*width: 550px;
	height:326px;*/
	width: 900px;
	height:545px;
	padding: 3px;
	margin: 0 auto;
	background: transparent url(../images/bgrounds/cooliris.png) 0 0 no-repeat;
}

#promo_wrapper {
	display: block;
	padding: 15px 0 10px 22px;
}

#promo h1{
	width:140px;
	text-align:center;
}

#promo_wrapper img {
	margin: 0;
	padding: 0;
}

#piclenswarning {
	width: 909px;
	height: 70px;
	min-height: 70px;
	margin: 0 0 1em 0;
	padding: 0;
	background: transparent url(../images/bgrounds/cooliris_warning_top.jpg) 0 0 no-repeat;
}
.piclenswarning { display: none; }
#piclenswarning p {
	color: #275609;
	display: block;
	width: 800px;
	margin: 0;
	padding: 15px;
	padding-left: 94px;
	line-height: 1.5em;
	height: 40px;
	min-height: 40px;
	background: transparent url(../images/bgrounds/cooliris_warning_bottom.jpg) left bottom no-repeat;
}

/** Determines what text shows to the user based on browser **/
.piclenswarning span.ff,
.piclenswarning.ff span.other { display: none }
.piclenswarning.ff span.ff { display: block }

html>body .piclenswarning, html>body .piclenswarning p { height: auto }

/*ul.other-cool-ideas,
body#coolideas ul.page-nav {
	display: block;
	margin-bottom: 2em;
}
ul.other-cool-ideas { width: 900px }
body#coolideas ul.page-nav { width: 900px }

ul.other-cool-ideas li,
ul.other-cool-ideas li a,
body#coolideas ul.page-nav li,
body#coolideas ul.page-nav li a {
	display: block;
	float: left;
	width: 280px;
	margin: 0;
	padding: 0;
	font-size: 1.1em;
	background: transparent url(../images/buttons/button_top.jpg) 0 0 no-repeat;
}
ul.other-cool-ideas li, ul.other-cool-ideas li a { float: left }

ul.other-cool-ideas li, body#coolideas ul.page-nav li {
	margin: 0 10px 0.4em 0;
}

ul.other-cool-ideas li a span,
body#coolideas ul.page-nav li a span {
	display: block;
	width: 230px;
	cursor: pointer;
	font-weight: bold;
	padding: 5px 15px 5px 35px;
	background: transparent url(../images/buttons/button_bottom.jpg) 0 100% no-repeat;
}
ul.other-cool-ideas li a:hover,
ul.other-cool-ideas li a.selected,
body#coolideas ul.page-nav li a:hover { background-image: url(../images/buttons/button_hover_top.jpg) !important }
ul.other-cool-ideas li a:hover span,
ul.other-cool-ideas li a.selected span,
body#coolideas ul.page-nav li a:hover span { color: white; background-image: url(../images/buttons/button_hover_bottom.jpg) !important }*/

ul.other-cool-ideas { width: 900px; clear: left; }
body#coolideas ul.other-cool-ideas { width: 450px; padding-left: 50px }
ul.other-cool-ideas li {
	float: left;
	width: 95px;
	margin: 0 !important;
	padding: 0 0 0 5px !important;
}
ul.other-cool-ideas li a {
	display: block;
	width: 95px;
	padding: 90px 5px 5px 5px;
	text-align: center;
	height: 3.5em;
	font-size: 1.1em;
	text-decoration: none; 
	background-position: 18px 10px;
	background-repeat: no-repeat;
}
ul.other-cool-ideas li a.selected { font-weight: bold }
ul.other-cool-ideas li a:hover { background-position: -134px 10px }
ul.other-cool-ideas li a span { text-decoration: none; cursor: pointer; }


ul.other-cool-ideas-small { /* width: 403px;*/ clear: left; float:left; }
body#coolideas ul.other-cool-ideas-small {width: 558px; padding-left: 0px;}
ul.other-cool-ideas-small li,
#scroll-container ul.other-cool-ideas-small li {
	float: left;
	width: 71px;
	margin: 0 !important;
	padding: 0 0px 0 30px;
	text-align:center;
}
ul.other-cool-ideas-small.row-2{
	margin-left:40px !important;
}
ul.other-cool-ideas-small li a {
	display: block;
	width: 66px;
	padding: 70px 2px 10px 0px;
	text-align: center;
	height: 3.5em;
	font-size: 0.9em;
	text-decoration: none; 
	background-position: 8px 10px;
	background-repeat: no-repeat;

}
ul.other-cool-ideas-small li a.selected { font-weight: bold }
ul.other-cool-ideas-small li a:hover { background-position: -94px 10px }
ul.other-cool-ideas-small li a span { text-decoration: none; cursor: pointer; }

ul.instructions img {
	position:relative;
	top: 4px
}

ul.instructions {
	padding-left: 10px
}
ul.instructions li {
	list-style-type: disc !Important;
	padding-left:0 !important
}

br.longbreak { padding-top: 2em }


ul.garment-builder {
	padding-left: 110px
}

ul.garment-builder li  {
	float: left;

}

ul.garment-builder li a{
	width: 87px;
	height:87px;
	display: block;
	background-repeat: no-repeat;
	background-position: top center;
	padding-left: 20px;
	padding-right: 20px;
	
	text-decoration: none;
}
ul.garment-builder li span{
	display:block;
	font-weight: bold !important;
	text-align: center;
}

ul.garment-builder li a:hover{
	background-position: center -87px;
}


/*.special { width: 900px }*/

.center { text-align: center }

label#enquireInformedLbl{
	padding:2px;
}

#main-l label {
	clear: left;
	float: left;
	width: 250px;
	text-align: left;
}
#main-l textarea,
#main-l input.text-input {
	float: left;
	width: 300px;
	margin: 1px 0;
	padding: 2px;
	font-size: 1.2em;
	border: 1px solid #4E3593;
}
#main-l input#enquireSubit {
	clear: left;
	float:right;
	
}

.product img {
	padding: 1px;
	border: 1px solid #4E3593;
}

div.poloflash {
	margin-left: 180px;
}

body#faqpag dt,
body#newpag dt { cursor: pointer }


blockquote {
	width: 475px;
	font-style: normal;
	background: #eee url(/clientlib/images/quotes/blockquote.gif) no-repeat;
	padding: 12px 0 0 0;
	margin: 0 0 1.5em 0;/*border: 1px solid green; */
}
blockquote p { padding-left: 10px; padding-right: 10px }
blockquote p.none { padding-left: 0; padding-right: 0; margin: 0; }
blockquote.alt {
	background: #fff url(/clientlib/images/quotes/blockquote-r.gif) no-repeat;
}
blockquote span {
	padding: 0 20px;
	display: block;/*border: 1px solid yellow; */
}
blockquote strong {
	background: #fff url(/clientlib/images/quotes/blockquote-strong.gif) no-repeat;
	padding: 15px 0 10px 45px;
	display: block;
	color: #333;/*border: 1px solid red; */
}
blockquote.alt strong {
	background-image: url(/clientlib/images/quotes/blockquote-strong-r.gif);
	text-align: right;
	padding: 15px 45px 10px 0;
}


div.right { float: right }

div.wall { padding-top: 3em }


ul.logos { 
	padding-left: 22px;
}/*
ul.logos li {
	float: left;
	display: inline;
	overflow: hidden;
	padding: 0 !important;
}
ul.logos li a {
	float: left;
	display: inline;
	margin: 0 4px 4px 0;
	font-size: 0.7em;
	text-indent: -3000em;
	background-color: transparent;
	background-position: 0 100%;
	background-repeat: no-repeat;
}
ul.logos li a:hover { background-position: 0 0 }
li a.logo-variety { width: 41px; height: 39px; background-image: url(../images/buttons/small-variety.gif) }
li a.logo-cotslsc { width: 38px; height: 39px; background-image: url(../images/buttons/small-cslsc.gif) }
li a.logo-icgreen { width: 53px; height: 29px; background-image: url(../images/buttons/small-icgreen.gif) }
li a.logo-cg { width: 50px; height: 38px; background-image: url(../images/buttons/small-cfg.gif) }
li a.logo-jd { width: 80px; height: 29px; background-image: url(../images/buttons/small-jdrf.gif) }*/

#main { position: relative }

a.cooliris-fs {
	width: 57px;
	height: 75px;
	position: absolute;
	right: -35px;
	top: 67px /*536px*/;
	text-decoration: none;
	text-indent: -300em;
	background: transparent url(../images/icons/cool-iris-full-screen.gif) 0 0 no-repeat;
}
a.cooliris-fs:hover {
	background-position: -57px 0;
}

.yslider-nav { display: none }
div.yslider-navl {
	top: 30px;
	height: 50px;
    background: url("../images/buttons/left.gif") no-repeat center;
}
div.yslider-navr {
	top: 30px;
	height: 50px;
    background: url("../images/buttons/right.gif") no-repeat center;
}
div.ycodaslider div.yslider-wrap { width: 910px }
div.yslider-viewer,
div.yslider-viewer div.yslider-container div.yslider-panel { width: 830px }

body#coolideas #scroll-container {
	position: absolute;
}
body#coolideas #footer {
	margin-top: 150px;
}
#scroll-container {
	position: relative;
	width: 906px; /* 906 */
}
#scroll-container .scroll-area li {
	position: relative;
	float: left;
	margin: 0;
	padding: 0;
}
/*#scroll-container .scroll-hotspot-left {
	top: 30px;
	height: 50px;
    background-image: url("../images/buttons/left.gif");
}
#scroll-container .scroll-hotspot-right {
    background-image: url("../images/buttons/right.gif");
}*/


/* Instead of making the hotspots visible I've created a cursor as a scrolling indicator. 
   The hotspots have a minimum width of 100 pixels and if there is room the will grow
   and occupy 15% of the scrollable area (30% combined). Adjust it to your own taste.
   
   There is a big background image and it's used to solve some problems I experienced
   in Internet Explorer 6.
*/


/* Invisible left hotspot */
div.scroll-hotspot-left,
div.scroll-hotspot-right {
	min-width: 25px;
	width: 5%;
	height: 100%;
	background-color: white;
	/*background-image: url(../images/bgrounds/buttons.png);*/
	background-repeat: repeat-y;
	background-position: center center;
	position: absolute;
	z-index: 200;
}
div.scroll-hotspot-left span,
div.scroll-hotspot-right span {
	display: block;
	width: 30px;
	height: 72px;
	background: transparent 50% 50% no-repeat;
	position: absolute;
	top: 40%;
}
div.scroll-hotspot-left,
.scrollingHotSpotLeftVisible {
	left: 0;
	background-position: 0 50%;
	/*background-image: url(../images/bgrounds/buttons-left.png);*/
	cursor: url(../images/cursors/cursor_arrow_left.cur), w-resize;
}
div.scroll-hotspot-left span {
	left: 0;
	background-image: url("../images/buttons/left.gif");
}

div.scroll-hotspot-right,
.scrollingHotSpotRightVisible {
	right: 0;
	background-position: 100% 50%;
	/*background-image: url(../images/bgrounds/buttons-right.png);*/
	cursor: url(../images/cursors/cursor_arrow_right.cur), e-resize;
}
div.scroll-hotspot-right span {
	right: 0;
	background-image: url("../images/buttons/right.gif");
}

/* The scroll wrapper is always the same width and height as the containing element (div).
   Overflow is hidden because you don't want to show all of the scrollable area.
*/
#scroll-container .scroll-wrapper {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 100%;
}

#scroll-container .scroll-area {
	position: relative;
	width: auto;
	height: 100%;
}
.scrollingHotSpotLeftVisible { }
.scrollingHotSpotRightVisible { }

/*div.scroll-hotspot-left,
div.scroll-hotspot-right {
	border: 1px solid blue !important;
	background: green !important;
	height: 100px;
	width: 25px;
	display: block;
}*/

form#enquireForm {
	width: 300px;
	padding-left: 130px;
}

.phonesNav {
	position: absolute;
	top: 224px;
	left: 728px;
	color: #fff;
}
.emailNav {
	position: absolute;
	top: 224px;
	left: 886px;
	color: #fff;
}
.emailNav a, .emailNav a:link, .emailNav a:visited, .emailNav a:active {
	color: #fff;
}

.flyers {
	width: 558px;
	width: 905px;
}

.flyer {
	width: 174px;
	float: left;
	display: inline;
	margin: 0 8px 1em 0;
	background: url(/images/bgrounds/flyer.gif) no-repeat bottom left;
}
.flyers .last {
	margin-right: 0;
}
.flyers h2 {
	background: #fff url(/images/bgrounds/flyer-h2.gif) no-repeat bottom left;
	margin-bottom: 0;
	text-align: center;
	font-weight: normal;
	padding-bottom: 12px;
	font-size: 1.1em;
}
.flyers h2 a, .flyers h2 a:link, .flyers h2 a:visited, .flyers h2 a:active {
	text-decoration: none;
}
.flyers h2 a:hover {
	text-decoration: underline;
}

.flyer img {
	margin: 0 0 7px 7px;
	border: 2px solid #fff;
	padding: 1px;
}
.flyer a:hover img {
	border-color: #9080bc;
}
.nextflyers {
	background-color: #eee;
	text-align: right;
	padding: 5px;
}
.nextflyers a, .nextflyers a:link, .nextflyers a:visited, .nextflyers a:active {
	text-decoration: none;
	color: #666;
}
.nextflyers a:hover {
	text-decoration: none;
	color: #4e3594;
}