#page-wrapper {
    min-height: 300px;
}

input[type="text" i]:disabled {
    background-color: white;
    border-bottom: 1px dotted;
}

* {
    box-sizing: border-box;
}

    * {
        box-sizing: border-box;
    }

    .container {
        font-family: Arial, Helvetica, sans-serif;
        width: 600px;
        margin: 30px auto 0;
        display: block;
        background: #fff;
        padding: 10px 50px 50px;
    }
.row {

    margin:auto;
}

    /* form starting stylings ------------------------------- */
    .group {
        max-width: 250px;
        position: relative;
        margin-bottom: 25px;
    }

    input[type=text] {
        border: none;
        border-bottom: 1px solid #757575;
    }

    input {
        font-size: 18px;
        padding: 10px 10px 10px 5px;
        display: block;
        width: 100%;
        border: none;
        border-bottom: 1px solid #757575;
    }

        input:focus {
            outline: none;
        }

    /* LABEL ======================================= */
    label {
        color: #737373;     /*#999*/
        font-size: 18px;
        font-weight: normal;
        position: absolute;
        pointer-events: none;
        left: 5px;
        top: 17px;
        transition: 0.2s ease all;
        -moz-transition: 0.2s ease all;
        -webkit-transition: 0.2s ease all;
    }

    /* active state */
    input:focus ~ label,
    input:valid ~ label {
        top: -15px;
        font-size: 16px;
        color: #B95B18;     /* de6f1d;*/
    }

    /* BOTTOM BARS ================================= */
    .bar {
        position: relative;
        display: block;
        width: 100%;
    }

        .bar:before,
        .bar:after {
            content: "";
            height: 2px;
            width: 0;
            bottom: 1px;
            position: absolute;
            background: #de6f1d;
            transition: 0.2s ease all;
            -moz-transition: 0.2s ease all;
            -webkit-transition: 0.2s ease all;
        }

        .bar:before {
            left: 50%;
        }

        .bar:after {
            right: 50%;
        }

    /* active state */
    input:focus ~ .bar:before,
    input:focus ~ .bar:after {
        width: 50%;
    }

    /* HIGHLIGHTER ================================== */
    .highlight {
        position: absolute;
        height: 60%;
        width: 100%;
        top: 25%;
        left: 0;
        pointer-events: none;
        opacity: 0.5;
    }

    /* active state */
    input:focus ~ .highlight {
        -webkit-animation: inputHighlighter 0.3s ease;
        -moz-animation: inputHighlighter 0.3s ease;
        animation: inputHighlighter 0.3s ease;
    }
    #ErrorContainer{
        margin:10px 25px 8px 25px;
    }
#giftDetail {
    padding: 5px;
    font-weight: bold;
    font-size:16px;
    border-bottom: 1px solid #e5e5e5;
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}
    .alert {
        border-radius: 4px;
    }

    @-webkit-keyframes inputHighlighter {
        from {
            background: #5264AE;
        }

        to {
            width: 0;
            background: transparent;
        }
    }

    @-moz-keyframes inputHighlighter {
        from {
            background: #5264AE;
        }

        to {
            width: 0;
            background: transparent;
        }
    }

    @keyframes inputHighlighter {
        from {
            background: #5264AE;
        }

        to {
            width: 0;
            background: transparent;
        }
    }

    @media only screen and (max-width: 512px) {

        #desktopFooterLook {
            display: none;
        }
    }

    @media only screen and (min-width: 512px) {
        #mobileFooterLook {
            display: none;
        }
    }