﻿/* -------------- */
/*  FORM BUTTONS  */
/* -------------- */
@import url('Responsive/Responsive.css');

.FormButton-Container {
    border: 1px solid #D06F1A;
    display: inline-block;
    padding: .5em 1em .5em 1em;
    text-decoration: none !important;
    position: relative;
    top: 0;
    left: 0;
    z-index: 1;
    color: #fff;
    border-radius: .25em;
    text-align: center;
    overflow: hidden;
    box-sizing: border-box;
}

    .FormButton-Container:hover > .FormButton {
        color: #BD6112;
    }

    .FormButton-Container:hover > .FormButton-Container-Animate {
        width: 0%;
        transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
        -moz-transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
        -webkit-transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
        -o-transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
        -ms-transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
    }

    .FormButton-Container > .FormButton-Container-Animate {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        box-sizing: border-box;
        background-color: #D06F1A;
        border: 1px solid #fff;
        border-radius: .25em;
        box-sizing: border-box;
    }

    .FormButton-Container > .FormButton {
        width: 100%;
        height: 100%;
        position: relative;
        top: 0;
        left: 0;
        color: #fff;
        text-decoration: none;
        border: 0px solid #D06F1A;
        background-color: transparent;
        text-align: center;
        padding: .25em;
        box-shadow: 0 0px 0px rgba(0,0,0,0.20) !important;
        transition: color ease-in 200ms, border-color ease-in 200ms;
        -moz-transition: color ease-in 200ms, border-color ease-in 200ms;
        -webkit-transition: color ease-in 200ms, border-color ease-in 200ms;
        -o-transition: color ease-in 200ms, border-color ease-in 200ms;
        -ms-transition: color ease-in 200ms, border-color ease-in 200ms;
    }

    .FormButton-Container.Secondary > .FormButton-Container-Animate {
        width: 0%;
        border: 1px solid #fff;
    }

    .FormButton-Container.Secondary:hover > .FormButton-Container-Animate {
        width: 100%;
        border: 1px solid #fff;
        transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
        -moz-transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
        -webkit-transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
        -o-transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
        -ms-transition: color ease-in 200ms, border-color ease-in 200ms, width ease-in 200ms;
    }

    .FormButton-Container.Secondary > .FormButton {
        color: #BD6112;
    }

    .FormButton-Container.Secondary:hover > .FormButton {
        color: #fff;
    }

    .FormButton-Container[disabled] {
        background-color: #D06F1A;
        cursor: none;
        opacity: .5;
        cursor: not-allowed;
    }

        .FormButton-Container[disabled] > .FormButton-Container-Animate {
            background-color: #D06F1A;
            border: 1px solid #fff;
            transition-property: none !important;
            -moz-transition-property: none !important;
            -webkit-transition-property: none !important;
            -o-transition-property: none !important;
            cursor: not-allowed;
        }

        .FormButton-Container[disabled]:hover > .FormButton-Container-Animate {
            background-color: #333;
            color: #fff;
            border: 0px solid #fff;
            cursor: not-allowed;
        }

    .FormButton-Container.Secondary[disabled] > .FormButton-Container-Animate {
        border: 0px solid #fff;
        cursor: not-allowed;
    }

    .FormButton-Container.Secondary[disabled]:hover > .FormButton-Container-Animate {
        background-color: #333;
        color: #fff;
        cursor: not-allowed;
    }

    .FormButton-Container[disabled] > .FormButton {
        color: #000;
        font-style: italic;
        cursor: not-allowed;
    }

    .FormButton-Container.Secondary[disabled] {
        cursor: not-allowed;
    }

        .FormButton-Container.Secondary[disabled] > .FormButton {
            color: #000;
            font-style: italic;
            cursor: not-allowed;
            white-space: pre-wrap;
        }
