@charset "utf-8";

/**
 * This file defines the styles to use for the buttons. Like template.css it is
 * split into a number of sections. First we define the colours for the three
 * (normal, positive and negative) types of buttons then we define the styling
 * for them. Finally is a definition for the standard .buttons class that will
 * usually contain the buttons elements
 *
 **/

 /* Standard Colours */

 button,
.buttons a,
.buttons span {
    color: #ffffff;
	background-color: #005195;
    border-color: #537295;
}

button:hover,
.buttons a:hover,
.buttons span:hover {
    color: #ffffff;
    background-color: #9AAFC7;
    border-color: #537295;
}

button:active,
.buttons a:active,
.buttons span:active {
    color: #ffffff;
    background-color: #000066;
    border-color: #537295;
}

/* Positive Colours */

button.positive,
.buttons .positive {
    color: BUTTON_POSITIVE_COLOUR;
    background-color: BUTTON_POSITIVE_BG_COLOUR;
    border-color: BUTTON_POSITIVE_BORDER_COLOUR;
}

button.positive:hover,
.buttons .positive:hover {
    color: BUTTON_POSITIVE_HOVER_COLOUR;
    background-color: BUTTON_POSITIVE_HOVER_BG_COLOUR;
    border-color: BUTTON_POSITIVE_HOVER_BORDER_COLOUR;
}

button.positive:active,
.buttons .positive:active {
    color: BUTTON_POSITIVE_ACTIVE_COLOUR;
    background-color: BUTTON_POSITIVE_ACTIVE_BG_COLOUR;
    border-color: BUTTON_POSITIVE_ACTIVE_BORDER_COLOUR;
}

/* Negative Colours */

button.negative,
.buttons .negative {
    color: #000000;
    background-color: #FFCCFF;
    border-color: #CC0000;
}

button.negative:hover,
.buttons .negative:hover {
    color: #000000;
    background-color: #FF99FF;
    border-color: #CC0000;
}

button.negative:active,
.buttons .negative:active {
    color: #000000;
    background-color: #990000;
    border-color: #CC0000;
}

/* Styling */

button,
.buttons a,
.buttons span {
    border-width: 1px ;
    border-style: solid;
    font-size: inherit;
    margin: 0px 1px;
}

button {
    width: auto;
    overflow: visible;
    padding: 0.25em 0.5em;
    vertical-align: middle;
    line-height: 100%;
	font-weight: bold;
    margin: 0px 1px;
}

.buttons a,
.buttons span {
    text-decoration: none;
    padding: 0.33em 0.6em;
    white-space: nowrap;
}

.buttons button img, .buttons a img{
    margin:0 3px -3px 0 !important;
    padding:0;
    border:none;
    width:16px;
    height:16px;
}

/* .buttons class */
.buttons {
    text-align: right;
    line-height: 2.5em;
    margin-bottom: 1em;
}