/*------------------------------------- osx common ----------------------------------------------*/
*{
    margin:0px;
    padding:0px;
    font-family: 'MyriadPro-Regular', 'LucidaGrande', Helvetica, Arial, sans-serif;
    font-size: 14px;
    color: #000;
    border:0px;
}

html, body{
    width:100%;
    height:100%;
    overflow: hidden;
}

table{
    border-collapse:collapse;
}

ul{
    list-style:none;
}

/*------------------------------------- osx button ----------------------------------------------*/
.osx-button-outer{
    width: 100%;
    text-align: center;
}
.osx-button{
    min-width: 80px;
    width: auto;
    height: 20px;
    line-height: 20px;
    text-align: center;
    cursor: pointer;
    background: #F8F8F8 url("../images/osx-button.jpg") repeat-x;
    border: 1px solid #858585;
    display: inline-block;
    padding: 2px 6px;
    margin: 4px 4px;
}

a.buttons {
        display: inline-block;
        padding: 0 33px;
        height: 19px;
        line-height: 19px;
        border-radius: 3px;
        -webkit-border-radius: 3px;
        -o-border-radius: 3px;
        -moz-border-radius: 3px;
        border-width: 1px;
        border-style: solid;
        text-decoration: none;
        font-family: "Lucida Grande", lucida, "Helvetica Neue", helvetica, sans-serif;
        font-size: 12px;
        color: #000;
        text-shadow: 0 1px 0 rgba(255,255,255,0.09);
        min-width: 38px;
    }
    
    @-webkit-keyframes blinking {
       from {
           -webkit-box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
            }
       50% {
           -webkit-box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0.2), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
            }
        to {
           -webkit-box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
            }
        }
        
        @-moz-keyframes blinking {
       from {
           -moz-box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
            }
       50% {
           -moz-box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0.2), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
            }
        to {
           -moz-box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
            }
        }
        
        @keyframes blinking {
       from {
           box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
            }
       50% {
           box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0.2), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
            }
        to {
           box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
            }
        }
    
    a.buttons.ok {
        border-top-color: #5a5caf;
        border-bottom-color: #52536f;
        border-left-color: #56578f;
        border-right-color: #56578f;
        background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0, #D3F7FD),
            color-stop(0.5, #87C5FB),
            color-stop(0.5, #A1D1F9),
            color-stop(1, #D4E9FC)
            );
        background-image: -moz-linear-gradient(
            center bottom,
            #D3F7FD 0%,
            #87C5FB 50%,
            #A1D1F9 50%,
            #D4E9FC 100%
            );
        -webkit-animation-name: blinking;
        -webkit-animation-timing-function: ease-in-out;
        -webkit-animation-iteration-count: infinite;
        -webkit-animation-duration: 1s;
        -moz-animation-name: blinking;
        -moz-animation-timing-function: ease-in-out;
        -moz-animation-iteration-count: infinite;
        -moz-animation-duration: 1s;
        animation-name: blinking;
        animation-timing-function: ease-in-out;
        animation-iteration-count: infinite;
        animation-duration: 1s;
    }
    
    a.buttons.ok:active, a.buttons.cancel:active, a.buttons.small:active {
        -webkit-box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0.3), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
        -webkit-animation-name: none;
        -moz-box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0.3), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
        -moz-animation-name: none;
        box-shadow: 
                inset 0 19px 0 rgba(0,115,215,0.3), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
        animation-name: none;
        background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0, #D3F7FD),
            color-stop(0.5, #87C5FB),
            color-stop(0.5, #A1D1F9),
            color-stop(1, #D4E9FC)
            );
        background-image: -moz-linear-gradient(
            center bottom,
            #D3F7FD 0%,
            #87C5FB 50%,
            #A1D1F9 50%,
            #D4E9FC 100%
            );
        border-top-color: #5a5caf;
        border-bottom-color: #52536f;
        border-left-color: #56578f;
        border-right-color: #56578f;
    }
    
    
    a.buttons.cancel, a.buttons.inactive, a.buttons.small {
        border-color: #9a9a9a;
        background-image: -webkit-gradient(
            linear,
            left bottom,
            left top,
            color-stop(0, #EBEBEB),
            color-stop(0.5, #ECECEC),
            color-stop(0.5, #F3F3F3),
            color-stop(1, #FFFFFF)
        );
        background-image: -moz-linear-gradient(
            center bottom,
            #EBEBEB 0%,
            #ECECEC 50%,
            #F3F3F3 50%,
            #FFFFFF 100%
        );
        -webkit-box-shadow: 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
        -moz-box-shadow: 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
        box-shadow: 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);       
    }
    
    a.buttons.inactive {
        opacity: 0.5;
        cursor: default;
    }
    
    a.buttons.small {
        height: 16px;
        line-height: 16px;
        font-size: 11px;
    }
    
    a.buttons.small:active {
        -webkit-box-shadow: 
                inset 0 16px 0 rgba(0,115,215,0.3), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
        -moz-box-shadow: 
                inset 0 16px 0 rgba(0,115,215,0.3), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
        box-shadow: 
                inset 0 16px 0 rgba(0,115,215,0.3), 
                inset 0 1px 0 rgba(255,255,255,1),
                0 1px 0 rgba(0,0,0,0.09);
    }