﻿
.look-updown
{
    padding: 1px;
}

.look-updown .inner-container
{
    border: 1px;
    border-color: #808080;
    background-color: #C0C0C0;
    border-style: solid;
 }

.look-updown button
{
    position: absolute;
    border-style: none;
    background-color: #C0C0C0;
    cursor: pointer;
    cursor: hand;
    padding: 0 0 0 0;

    background-repeat: no-repeat;
    background-position: center;
}

.look-updown button img
{
    display: none;
}

.look-updown[data-orientation="orienthorizontal"]  button:first-child {
    height: 100%;
    width: 50%;
    left: 0;
}

.look-updown[data-orientation="orienthorizontal"]  button:last-child {
    height: 100%;
    width: 50%;
    left: 50%;
}

.look-updown[data-orientation="orientvertical"]  button:first-child {
    height: 50%;
    width: 100%;
    top: 0;
}


.look-updown[data-orientation="orientvertical"]  button:last-child {
    height: 50%;
    width: 100%;
    top: 50%;
}

.look-updown[data-orientation="orienthorizontal"]  button:first-child:after,
.look-updown[data-orientation="orienthorizontal"]  button:last-child:after,
.look-updown[data-orientation="orientvertical"]  button:first-child:after,
.look-updown[data-orientation="orientvertical"]  button:last-child:after {
    display: block;
    height: 100%;
    width: 100%;
    content: "";

    -ms-background-size: 40% 30%;
    background-size: 40% 30%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.look-updown[data-orientation="orienthorizontal"]  button:first-child:after {
    background-image: url(../../../images/UpDown_Left.gif);
}

.look-updown[data-orientation="orienthorizontal"] button:last-child:after
{
    background-image: url(../../../images/UpDown_Right.gif);
}

.look-updown[data-orientation="orientvertical"] button:first-child:after {
    background-image: url(../../../images/UpDown_Up.gif);
}

.look-updown[data-orientation="orientvertical"] button:last-child:after
{
    background-image: url(../../../images/UpDown_Down.gif);
}

.look-updown:not([disabled]) button:active
{
    background-color: #A0A0A0;
}

.look-updown[disabled][data-orientation="orienthorizontal"]  button:first-child:after
{
    background-image: url(../../../images/UpDown_LeftG.gif);
}

.look-updown[disabled][data-orientation="orienthorizontal"] button:last-child:after
{
    background-image: url(../../../images/UpDown_RightG.gif);
}

.look-updown[disabled][data-orientation="orientvertical"]  button:first-child:after
{
    background-image: url(../../../images/UpDown_UpG.gif);
}

.look-updown[disabled][data-orientation="orientvertical"] button:last-child:after
{
    background-image: url(../../../images/UpDown_DownG.gif);
}

