@charset "UTF-8";

/* SpryCollapsiblePanel.css - Revision: Spry Preview Release 1.4 */

/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/* This is the selector for the main CollapsiblePanel container. For our
 * default style, the CollapsiblePanel is responsible for drawing the borders
 * around the widget.
 *
 * If you want to constrain the width of the CollapsiblePanel widget, set a width on
 * the CollapsiblePanel container. By default, our CollapsiblePanel expands horizontally to fill
 * up available space.
 *
 * The name of the class ("CollapsiblePanel") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style the
 * CollapsiblePanel container.
 */
.CollapsiblePanel {
	margin: 0px;
	padding: 0px;
	border-left: solid 1px #006600; 
	border-right: solid 1px #003300;
	border-top: solid 1px #003300;
	border-bottom: solid 1px #006600;
	font:Arial, Helvetica, sans-serif;
	text-align:left;
	font-size:20px; /* Set the text size for the panel headings */
	background-color:#FFFFB4;
}

/* This is the selector for the CollapsiblePanelTab. This container houses
 * the title for the panel. This is also the container that the user clicks
 * on to open or close the panel.
 *
 * The name of the class ("CollapsiblePanelTab") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style an
 * CollapsiblePanel panel tab container.
 */
.CollapsiblePanelTab {
	font: 0.7em sans-serif;
	background-color: #7BC66B; /* The colour of the panel top */
	/*background: url(http://www.buttercups.co.uk/Website/petswebsite.nsf/Setup/Images/PanelSlice.png);
	background-image: url(http://www.buttercups.co.uk/Website/petswebsite.nsf/Setup/Images/PanelSlice.png);
	background-repeat:repeat-x;*/
	/*border-bottom: solid 1px #000000;*/
	margin: 0px;
	padding: 2px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
}

/* This is the selector for a CollapsiblePanel's Content area. It's important to note that
 * you should never put any padding on the content area element if you plan to
 * use the CollapsiblePanel's open/close animations. Placing a non-zero padding on the content
 * element can cause the CollapsiblePanel to abruptly grow in height while the panels animate.
 *
 * The name of the class ("CollapsiblePanelContent") used in this selector is not necessary
 * to make the widget function. You can use any class name you want to style a
 * CollapsiblePanel content container.
 */
.CollapsiblePanelContent {
	margin: 0px;
	padding: 0px;
}

/* An anchor tag can be used inside of a CollapsiblePanelTab so that the
 * keyboard focus ring appears *inside* the tab instead of around the tab.
 * This is an example of how to make the text within the anchor tag look
 * like non-anchor (normal) text.
 */
.CollapsiblePanelTab a {
	color: pink;
	text-decoration: none;
}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open. The class "CollapsiblePanelOpen" is programatically added and removed
 * from panels as the user clicks on the tabs within the CollapsiblePanel.
 */
.CollapsiblePanelOpen .CollapsiblePanelTab {
	/*background-color: #CC66FF;*/
}

/* This is an example of how to change the appearance of the panel tab as the
 * mouse hovers over it. The class "CollapsiblePanelTabHover" is programatically added
 * and removed from panel tab containers as the mouse enters and exits the tab container.
 */
.CollapsiblePanelTabHover,  .CollapsiblePanelOpen .CollapsiblePanelTabHover {
	background-color: #e0ffbf;/* The colour of the panel tab when you hover over it */
}

/* This is an example of how to change the appearance of all the panel tabs when the
 * CollapsiblePanel has focus. The "CollapsiblePanelFocused" class is programatically added and removed
 * whenever the CollapsiblePanel gains or loses keyboard focus.
 */
.CollapsiblePanelFocused .CollapsiblePanelTab {
	background-color: #C9C66B; /* The colour of the panel tab when it has the focus on it */
}

/*########################## CSS FOR THE ROLLOVER EFFECTS #############################################*/
/*########################## CSS FOR THE ROLLOVER EFFECTS #############################################*/
/*########################## CSS FOR THE ROLLOVER EFFECTS #############################################*/

#list-menu {
	width: 200px;
}

#list-menu ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}

#list-menu li{
	margin: 4px 0 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight:bold;
	font-size: 14px;
}

#list-menu a{
	display: block;
	width: 200px;
	height: 35px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none;
	text-align:center;
	line-height: 35px;
	filter:blendTrans(duration=0.5);
}

#list-menu a:link{
	color:#ffffb4;
	background: url(GreenButton.png);
}

#list-menu a:visited{
	color:#ffffb4;
	background: url(GreenButton.png);
}

#list-menu a:hover{
	color:#77a25b;
	background: url(YellowButton.png);
}

#contact-forms a{
	width: 175px;
	height: 33px;
	filter:blendTrans(duration=0.5);
}

#contact-forms a:link{
	background: url(http://www.buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Company-Banner-Feedback-Green.jpg);
}

#contact-forms a:visited{
	background: url(http://www.buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Company-Banner-Feedback-Green.jpg);
}

#contact-forms a:hover{
	background: url(http://www.buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Company-Banner-Feedback-Golden.jpg);
}

#telephone-buttercups a{
	width: 299px;
	height: 33px;
	filter:blendTrans(duration=0.5);	
}

#telephone-buttercups a:link{
	background: url(http://www.buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Company-Banner-Phone-Green.jpg);
}

#telephone-buttercups a:visited{
	background: url(http://www.buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Company-Banner-Phone-Green.jpg);
}

#telephone-buttercups a:hover{
	background: url(http://www.buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Company-Banner-Phone-Golden.jpg);
}

#email-buttercups a{
	width: 207px;
	height: 33px;
	filter:blendTrans(duration=0.5);	
}

#email-buttercups a:link{
	background: url(http://www.buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Company-Banner-Email-Green.jpg);
}

#email-buttercups a:visited{
	background: url(http://www.buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Company-Banner-Email-Green.jpg);
}

#email-buttercups a:hover{
	background: url(http://www.buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Company-Banner-Email-Golden.jpg);
}

/*########################## CSS FOR THE ROLLOVER EFFECTS #############################################*/
/*########################## CSS FOR THE ROLLOVER EFFECTS #############################################*/
/*########################## CSS FOR THE ROLLOVER EFFECTS #############################################*/

/*################################################# HEADING TAGS ########################################*/
/*################################################# HEADING TAGS ########################################*/
/*################################################# HEADING TAGS ########################################*/

<!-- Used for the main headings -->
h1{

	font-size:24px;
	font-family:sans-serif, Calibri, Verdana, Arial, Helvetica;
	color: #609b49;
	text-align:left;
}

<!-- Used for the panel headings -->
h2{
	font-weight:bold;
	font-size:16px;
	font-family:sans-serif, Calibri, Verdana, Arial, Helvetica;
	margin-top: 0px;
	color: #000;
	text-align:left;
}

<!-- Used for headings within panels -->
h3{
	font-weight:bold;
	font-size:16px;
	font-family:sans-serif, Calibri, Verdana, Arial, Helvetica;
	color: #000;
	text-align:left;
	margin-left: 5px;
}

/*#############################################################################################################################################*/
/*############################################## CSS FOR THE HORIZONTAL MENU ##################################################################*/
/*############################################## CSS FOR THE HORIZONTAL MENU ##################################################################*/
/*############################################## CSS FOR THE HORIZONTAL MENU ##################################################################*/
/*#############################################################################################################################################*/

.HorizontalDropDownMenu{
width: 100%;
}

.HorizontalDropDownMenu:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.HorizontalDropDownMenu ul{
border: 1px solid #003300;
background: url(http://www.Buttercups.co.uk/Website/Storage.nsf/Setup/Images/$File/HorizontalMenuBGLargest.jpg);
padding: 4px;
margin: 0px;
text-align: center; 
}

.HorizontalDropDownMenu ul li{
display: inline;
}

.HorizontalDropDownMenu ul li a{
color: #FFFFFF; text-decoration: none;
padding-top:0px;
padding-left:0px;
padding-right:0px;
padding-bottom:0px;
text-decoration: none;
border-right: 1px solid #ffffff; 
}

.HorizontalDropDownMenu ul li a:hover{ /* SET THE PROPERTIES FOR THE TEXT WHEN YOU HOVER THE CURSOR OVER A LINK */
color: black;
text-decoration: none;
}

.HorizontalDropDownMenu ul li a:visited{ /* SET THE PROPERTIES FOR ANY PREVIOUSLY VISITED LINKS */
color: #FFFF99;
text-decoration: none;
}

#MenuBorder {
text-align: center; 
}

/* ######################################################################### */
/* ######### The styles below are for the horizontal menu options  ######### */
/* ######################################################################### */

.HorizontalDropMenuClass{
position:absolute;
top: 0;
border: 1px solid #003300; 
font:normal 12px Verdana;
line-height:18px;
z-index:100;
background-color: white;
width: 200px;
visibility: hidden;
filter: progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135,strength=4); /*Add Shadow in IE. Remove if desired*/
}

.HorizontalDropMenuClass a{
width: 100%;
display: block;
text-indent: 3px;
border: 1px solid #ADED7C; 
padding: 2px 0;
text-decoration: none;
color: black;
text-align: left; 
}

.HorizontalDropMenuClass a:hover{
background-color: #EAFADC;
color: #003300;
text-align: left;
}

/*#############################################################################################################################################*/
/*############################################## END OF CSS FOR THE HORIZONTAL MENU ###########################################################*/
/*############################################## END OF CSS FOR THE HORIZONTAL MENU ###########################################################*/
/*############################################## END OF CSS FOR THE HORIZONTAL MENU ###########################################################*/
/*#############################################################################################################################################*/

#ContainerV2{ /* All content goes with this div tag */
	width: 858px; 
	background-color: #FFFFFF;
	padding-top: 8px;
	padding-right: 8px;
	padding-left: 8px;
	padding-bottom: 8px;
	border: 1px solid #003300;
}

#LogoBannerV2{ /* Sets the size of the logo div tag */
	width: 850px;
	background-color: #FFFFFF;
}

#HeadingV2{ /* Sets the size and position of the heading graphic */
	width: 100%;
	float: right;
}

#TickerStyleV2{
	border: 1px solid #003300;
	width: 100%; /* was 634px */
	background: url(http://www.Buttercups.co.uk/Website/Storage.nsf/Setup/Images/$File/NewsTickerBackground.jpg); /*THEME CHANGE HERE*/
	margin-top: 10px;/* added as a test */
	margin-bottom: 5px;
	margin-left: 0px;
	margin-right: 0px;
	text-align: center; 
}

#ContentV2{ /* Sets the properties of where the actual content goes */
	margin-top: 10px;
	margin-left: 0px;
	width: 630px;
	font-family: Calibri, Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	float: right;
}

#SidemenuV2{ /* Sets the position of the menu buttons down the left hand side of the screen */
	background-color: #FFFFFF;
	width: 205px;
	margin-top: 15px;
	margin-left: -2px;
	margin-right: 5px;
	float: left;
}

#FooterV2{
	width: 850px;
	font-family: Calibri, Verdana, Arial, Helvetica, sans-serif;
	background-color: #77a25b;
	font-weight:bold;
	color: #FFFF99;	
	font-size: 14px;
	margin-top: 0px;
	margin-left: 0px;
	margin-right: 0px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-left: 5px;
}

body { 
	background: url(http://www.Buttercups.co.uk/Website/Website.nsf/Setup/Images/$File/Corduroy-Background.gif); 
	background-repeat:repeat;
	text-align:center;
}

#TickerStyle{
	border: 1px solid #003300;
	width: 634px; /* was 639 this fits perfectly for IE but means there is a overlap for the other browsers*/
	background: url(http://www.Buttercups.co.uk/Website/Storage.nsf/Setup/Images/$File/NewsTickerBackground.jpg); /*THEME CHANGE HERE*/
	margin-top: 10px;
	margin-bottom: 5px;
	margin-left: 0px;
	text-align: center; 
}

/* Horizontal rule CSS */
div.hr {
  height: 2px;
  background: #6e9c00;
  width:100%;
  margin-top: 5px;
  margin-bottom: 5px;
}

div.hr hr {
  display: none;
}

/* Below is for the text on the collapsible panels */
.ExpandContract{
	font: bold;
	font-size:12px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: #000000;
	text-align:right;
}

p{
	font-size:12px;
	Font-family:Verdana, Arial, Helvetica, sans-serif;
	text-align:left;
	line-height: 13pt;
	margin-left: 5px;
	margin-right: 5px;
}

p.TableText{
	font-size:12px;
	Font-family:Verdana, Arial, Helvetica, sans-serif;
	text-align:center;
	line-height: 13pt;
	margin-left: 5px;
	margin-right: 5px;
}

p.CenterText{
	font-size:12px;
	Font-family:Verdana, Arial, Helvetica, sans-serif;
	text-align:center;
	line-height: 13pt;
	margin-left: 5px;
	margin-right: 5px;
}

p.HeaderText{
	font-weight:bold;
	font-size:16px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: #008000;
}

li{
	font-size:12px;
	Font-family:Verdana, Arial, Helvetica, sans-serif;
	text-align:left;
	line-height: 13pt;
}

/* Links throughout the website */
a.ButtercupsLinks:link {color: #007FFF; text-decoration: none; font-size:12px}
a.ButtercupsLinks:visited {color: #218429; text-decoration: none; font-size:12px} 
a.ButtercupsLinks:hover {color: black; text-decoration: underline; font-size:12px} 

/* Link for accessing the KB */
a.KB:link {color: #FFFF99; text-decoration: none; font-size:14px; font-weight:bold}
a.KB:visited {color: #FFFF99; text-decoration: none; font-size:14px; font-weight:bold} 
a.KB:hover {color: #FFFF99; text-decoration: none; font-size:14px; font-weight:bold}

/*################################################# BELOW IS THE TABLE TEST ########################################*/
/*################################################# BELOW IS THE TABLE TEST ########################################*/
/*################################################# BELOW IS THE TABLE TEST ########################################*/
/*################################################# BELOW IS THE TABLE TEST ########################################*/
/*################################################# BELOW IS THE TABLE TEST ########################################*/
/*################################################# BELOW IS THE TABLE TEST ########################################*/
/*################################################# BELOW IS THE TABLE TEST ########################################*/
/*################################################# BELOW IS THE TABLE TEST ########################################*/
/*################################################# BELOW IS THE TABLE TEST ########################################*/

Table.GeneralLayout {
border-style:solid;
border-width: 2px;
border-color: #218429;
border-spacing: 0px;
width: 100%;
border-collapse: collapse;
}

Table.GeneralLayout td.SiteMapHeadings{
font-size:24px;
text-align: center;
background-color: #c9c66b;
width: 70%;
border-style:solid;
border-width: 2px;
border-color: #218429;
}

Table.GeneralLayout td.LeftColumn{
font-size:24px;
text-align: center;
background-color: #ffff99;
width: 30%;
}

Table.GeneralLayout td.RightColumn{
background-color: #ffffff;
width: 35%;
border-style:solid;
border-left-width: 2px;
border-left-color: #218429;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
}

Table.GeneralLayout td.RightColumnAlternate{
background-color: #e0ffbf;
width: 35%;
border-style:solid;
border-left-width: 2px;
border-left-color: #218429;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
}

Table.GeneralLayout td.RightColumn a.TableLink:link{
color: #007FFF; 
text-decoration: none; 
font-size:16px;
}

Table.GeneralLayout td.RightColumn a.TableLink:hover{
color: #000000; 
text-decoration: none; 
font-size:16px;
}

Table.GeneralLayout td.RightColumn a.TableLink:visited{
color: #218429; 
text-decoration: none; 
font-size:16px;
}

Table.GeneralLayout td.RightColumnAlternate a.TableLink:link{
color: #007FFF; 
text-decoration: none; 
font-size:16px;
}

Table.GeneralLayout td.RightColumnAlternate a.TableLink:hover{
color: #000000; 
text-decoration: none; 
font-size:16px;
}

Table.GeneralLayout td.RightColumnAlternate a.TableLink:visited{
color: #218429; 
text-decoration: none; 
font-size:16px;
}

.ColumnOne{
width:300px;
float:left;
background-color:#ffffff;
}

.ColumnTwo{
width:300px;
float:right;
background-color:#ffffff;
}

P.SiteMapHeadings{
font-weight:bold;
padding-bottom: 0px;
}

P.SiteMapList{
padding-left: 10px;
}

.SiteMapHeadings{
font-size:12px;
Font-family:Verdana, Arial, Helvetica, sans-serif;
text-align:left;
line-height: 13pt;
font-weight:bold;
padding-bottom: 0px;
}

.GreenTableRow{
background-color:#c8fbc0;
text-align:left;
}

.YellowTableRow{
background-color:#feffbf;
text-align:left;
}

