﻿
.look-commandbutton
{
    /** From comments in code the control should have a 1px margin top and bottom
		but we add it as padding in the parent to avoid issues with incorrect button width/height
		as they do not include margins.
    */
    padding: 1px 0 1px 0;
}

.look-commandbutton button
{
    /** [16831] Explicitly set the 'display' and 'vertical-align' as we cannot rely on the default
	    browser values to be the same. See also:
	    http://stackoverflow.com/questions/29091376/firefox-offsets-button-within-parent-div
    */
    vertical-align: top;

    border: 1px #808080 solid;

    display: block;
    position: relative;
    width: 100%;
    height: 100%;

    overflow: hidden;

    cursor: pointer;
    cursor: hand;
}

.look-commandbutton.imageonly button
{
    position: absolute;
}

.look-commandbutton.imageandtext button span
{
    position: relative;
}

.look-commandbutton.imageandtext button img 
{
    position: absolute;
}

.look-commandbutton button:not(.look-transparent)
{
    background-color:#C0C0C0;
}

.look-commandbutton:not([disabled]) button:active
{
    background-color:#A0A0A0;
}

.look-commandbutton button[disabled]
{
    color: #CCC;
}

/** Image alignment
*/

.look-pushbutton-align-top-left 
{
    position: absolute;
    top: 2px;
    left: 2px;
}

.look-pushbutton-align-top-center 
{
    position: absolute;
    top: 2px;
    right:2px;
    left:2px
}

.look-pushbutton-align-top-right 
{
    position: absolute;
    top: 2px;
    right: 2px;
}

.look-pushbutton-align-left 
{
    text-align:left;
}

.look-pushbutton-align-center 
{
    text-align:center;
}

.look-pushbutton-align-center > span
{
    vertical-align: inherit;
}

.look-pushbutton-align-right
{
    text-align:right;
}

.look-pushbutton-align-bottom-left 
{
    position: absolute;
    bottom: 2px;
    left: 2px;
}

.look-pushbutton-align-bottom-center 
{
    position: absolute;
    bottom: 2px;
    right:2px;
    left:2px
}

.look-pushbutton-align-bottom-right
{
    position: absolute;
    bottom: 2px;
    right: 2px;
}

.look-pushbutton-align-numeric 
{
    position: absolute;
    top: 2px;
    right:2px;
    left:2px
}
