/* buttons.css */

/* 
   |-|----|----------------|----|-|
    w  pl        text        pr  w
   
   w  = radius of the rounded corners
   pl = padding inside left of button
   pr = padding inside right of button
*/

.imd .button,
.imd .button span,
.imd .button input {
    display: inline-block;
    /* line-height is height of button */
    line-height: 30px;
    /* FF ignores line-height on inputs */
    height: 30px;
    font-size: 13px;
    font-family: Arial, sans-serif;
    font-weight: bold;
    text-overflow: ellipsis;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    color: #193E8E;
    -webkit-background-clip: padding-box;
    -moz-background-clip: padding-box;
    -ms-background-clip: padding-box;
    background-clip: padding-box;
    background-repeat: no-repeat;
    border: 0 solid transparent;
}

.imd .button {
    /* This is the right sliding door. */
    background-position: right top;
    vertical-align: baseline;
    /* Create space for the inner span to inhabit as the left
	   sliding door. */
    border-left-width: 6px; /* r */
    padding-right: 10px; /* pr */
}

    .imd .button[type="submit"] {
        border-left-width: 0; /* r */
    }

@media \0screen {
    /* IE8
     
     This bit of fudge is a hack for IE8 that allows us to have shadows
     in modern browsers, where we use border-left: transparent with
     background-clip: padding-box to compensate for the left sliding
     door. IE8 renders the right sliding door background over the border,
     so here we replace the border with a margin. I realise it's not ideal,
     and need to come back to look at it. Stephen. */
    .imd .button {
        border-left-width: 0;
        margin-left: 6px;
    }
}

.imd .button span,
.imd .button input {
    /* This is the left sliding door. */
    background-position: left top;
    vertical-align: top;
    position: relative;
    padding-left: 16px; /* pl + r */
    left: -6px; /* -r */
}

    .imd .button span input {
        /* input elements require special handling */
        left: 0;
        margin: 0;
        padding: 0;
        background: none;
    }

.imd .button {
    margin-left: 10px;
    /* Create the shadow effect. */
    border-radius: 5px;
    -webkit-box-shadow: 0 0 4px 2px #D7D7D7;
    -moz-box-shadow: 0 0 4px 2px #D7D7D7;
    box-shadow: 0 0 4px 2px #D7D7D7;
}

    .imd .button.left {
        margin-left: 0;
        margin-right: 10px !important;
    }

    .imd .button,
    .imd .button input,
    .imd .button span {
        color: #FFFFFF;
        background-image: url("images/button_standard.png");
    }

        .imd .button:hover,
        .imd .button:hover span {
            background-image: url("images/button_standard_hover.png");
            text-decoration: none !important;
        }

.imd .actionButton,
.imd .actionButton input,
.imd .actionButton span {
    color: #193E8E;
    background-image: url("images/button_action.png");
}

    .imd .actionButton.inactive,
    .imd .actionButton.inactive input,
    .imd .actionButton.inactive span {
        color: gray;
        background-image: url("images/button_action_hover.png");
        pointer-events: none;
    }

    .imd .actionButton:hover,
    .imd .actionButton:hover span {
        color: #193E8E;
        background-image: url("images/button_action_hover.png");
    }

.imd .simpleButton,
.imd .simpleButton input,
.imd .simpleButton span {
    color: #FFFFFF;
    background-image: url("images/button_simple.png");
}

    .imd .simpleButton.inactive,
    .imd .simpleButton.inactive input,
    .imd .simpleButton.inactive span {
        color: #d7d7d7;
        background-image: url("images/button_simple_hover.png");
        pointer-events: none;
    }

    .imd .simpleButton:hover,
    .imd .simpleButton:hover span {
        color: #FFFFFF;
        background-image: url("images/button_simple_hover.png");
    }

.imd .toolButton {
    /* Create the embossed effect. */
    border-radius: 5px;
    -webkit-box-shadow: 0 0 0 0 #808080, 0 1px 2px rgba(255,255,255,0.8), 0 -1px 0 #C4C4C4;
    -moz-box-shadow: 0 0 0 0 #808080, 0 1px 2px rgba(255,255,255,0.8), 0 -1px 0 #C4C4C4;
    box-shadow: 0 0 0 0 #808080, 0 1px 2px rgba(255,255,255,0.8), 0 -1px 0 #C4C4C4;
}

    .imd .toolButton,
    .imd .toolButton input,
    .imd .toolButton span {
        color: #FFFFFF;
        background-image: url("images/button_tool.png");
    }

        .imd .toolButton:hover,
        .imd .toolButton:hover span {
            background-image: url("images/button_tool_hover.png");
        }

.blueButton, .blueButton input, .blueButton span {
    background-image: url("images/button_blue.png");
}

    .blueButton:hover, .blueButton:hover span {
        background-image: url("images/button_blue_hover.png");
    }

.imd .blueButton, .imd .blueButton input, .imd .blueButton span {
    background-image: url("images/button_blue.png");
}

    .imd .blueButton:hover, .imd .blueButton:hover span {
        background-image: url("images/button_blue_hover.png");
    }

.imd .glcButton {
    float: right;
    margin-top: 15px;
}

    .imd .glcButton,
    .imd .glcButton input,
    .imd .glcButton span {
        color: #193E8E;
        background-image: url("images/button_GLC_individuals.png");
        width: 136px;
    }

        .imd .glcButton:hover,
        .imd .glcButton:hover span {
            color: #193E8E;
            background-image: url("images/button_GLC_individuals_hover.png");
        }

.btn.no-pointer-events {
    pointer-events: none;
}

.imd .longLabelApply {
    padding-left: 6px !important;
    width: 150px !important;
}