﻿/* #Buttons
==================================================*/

.button, a.button {
    position: relative;
    vertical-align: top;
    width: 100%;
    height: 35px;
    line-height: 35px;
    padding: 0 30px;
    margin-bottom: .75rem;
    font-size: 1rem;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
    border: 0;
    cursor: pointer;
    color: white;
    background: #e74c3c;
    border-bottom: 2px solid #db4334;
    -webkit-box-shadow: inset 0 -2px #db4334;
    box-shadow: inset 0 -2px #db4334;
}

    .button.small, a.button.small {
        padding-left: 0;
        padding-right: 0;
        padding-top: 0;
        padding-bottom: 0;
        height: 25px;
        line-height: 25px;
    }

    .button.tiny, a.button.tiny {
        padding-left: 0;
        padding-right: 0;
        padding-top: 0;
        padding-bottom: 0;
        height: 18px;
        line-height: 18px;
    }

    .button.right, a.button.right {
        float: right;
        width: auto;
    }

    .button.left, a.button.left {
        float: left;
        width: auto;
    }

    button:hover, button:focus, .button:hover, .button:focus {
        background: #e74c3c;
    }

    .button.postfix, a.button.postfix {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        top-left-radius: 0;
        bottom-left-radius: 0;
    }

    .button:active {
        top: 1px;
        outline: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

/* #Sun Flower Button
==================================================*/
.sun-flower.button {
    background: #f1c40f;
    border-bottom: 2px solid #e2b607;
    -webkit-box-shadow: inset 0 -2px #e2b607;
    box-shadow: inset 0 -2px #e2b607;
}

/* #Orange Flat Button
==================================================*/
.orange.button {
    color: white;
    background: #f39c12;
    border-bottom: 2px solid #e8930c;
    -webkit-box-shadow: inset 0 -2px #e8930c;
    box-shadow: inset 0 -2px #e8930c;
}

/* #Carrot Flat Button
==================================================*/
.carrot.button {
    color: white;
    background: #e67e22;
    border-bottom: 2px solid #da751c;
    -webkit-box-shadow: inset 0 -2px #da751c;
    box-shadow: inset 0 -2px #da751c;
}

/* #Pumpkin Flat Button
==================================================*/
.pumpkin.button {
    color: white;
    background: #d35400;
    border-bottom: 2px solid #c54e00;
    -webkit-box-shadow: inset 0 -2px #c54e00;
    box-shadow: inset 0 -2px #c54e00;
}

/* #Alizarin Flat Button
==================================================*/
.alizarin.button {
    color: white;
    background: #e74c3c;
    border-bottom: 2px solid #db4334;
    -webkit-box-shadow: inset 0 -2px #db4334;
    box-shadow: inset 0 -2px #db4334;
}

/* #Pomegranate Flat Button
==================================================*/
.pomegranate.button {
    color: white;
    background: #c0392b;
    border-bottom: 2px solid #b53224;
    -webkit-box-shadow: inset 0 -2px #b53224;
    box-shadow: inset 0 -2px #b53224;
}

/* #Turquoise Flat Button
==================================================*/
.turquoise.button {
    color: white;
    background: #1abc9c;
    border-bottom: 2px solid #12ab8d;
    -webkit-box-shadow: inset 0 -2px #12ab8d;
    box-shadow: inset 0 -2px #12ab8d;
}

/* #Green Sea Flat Button
==================================================*/
.green-sea.button {
    color: white;
    background: #16a085;
    border-bottom: 2px solid #14947b;
    -webkit-box-shadow: inset 0 -2px #14947b;
    box-shadow: inset 0 -2px #14947b;
}

/* #Emerald Flat Button
==================================================*/
.emerald.button {
    color: white;
    background: #2ecc71;
    border-bottom: 2px solid #28be68;
    -webkit-box-shadow: inset 0 -2px #28be68;
    box-shadow: inset 0 -2px #28be68;
}

/* #Nephritis Flat Button
==================================================*/
.nephritis.button {
    color: white;
    background: #27ae60;
    border-bottom: 2px solid #219d55;
    -webkit-box-shadow: inset 0 -2px #219d55;
    box-shadow: inset 0 -2px #219d55;
}

/* #Peter River Flat Button
==================================================*/
.peter-river.button {
    color: white;
    background: #3498db;
    border-bottom: 2px solid #2a8bcc;
    -webkit-box-shadow: inset 0 -2px #2a8bcc;
    box-shadow: inset 0 -2px #2a8bcc;
}

/* #Belize Hole Sea Flat Button
==================================================*/
.belize-hole.button {
    color: white;
    background: #2980b9;
    border-bottom: 2px solid #2475ab;
    -webkit-box-shadow: inset 0 -2px #2475ab;
    box-shadow: inset 0 -2px #2475ab;
}

/* #Amethyst Flat Button
==================================================*/
.amethyst.button {
    color: white;
    background: #9b59b6;
    border-bottom: 2px solid #8d4ca7;
    -webkit-box-shadow: inset 0 -2px #8d4ca7;
    box-shadow: inset 0 -2px #8d4ca7;
}

/* #Wisteria Flat Button
==================================================*/
.wisteria.button {
    color: white;
    background: #8e44ad;
    border-bottom: 2px solid #80399d;
    -webkit-box-shadow: inset 0 -2px #80399d;
    box-shadow: inset 0 -2px #80399d;
}

/* #Wet Asphalt Flat Button
==================================================*/
.wet-asphalt.button {
    color: white;
    background: #34495e;
    border-bottom: 2px solid #263849;
    -webkit-box-shadow: inset 0 -2px #263849;
    box-shadow: inset 0 -2px #263849;
}

/* #Wet Asphalt Flat Button
==================================================*/
.wet-asphalt.button {
    color: white;
    background: #34495e;
    border-bottom: 2px solid #263849;
    -webkit-box-shadow: inset 0 -2px #263849;
    box-shadow: inset 0 -2px #263849;
}

/* #Midnight Blue Flat Button
==================================================*/
.midnight-blue.button {
    color: white;
    background: #2c3e50;
    border-bottom: 2px solid #22303f;
    -webkit-box-shadow: inset 0 -2px #22303f;
    box-shadow: inset 0 -2px #22303f;
}

/* #Clouds Flat Button
==================================================*/
.clouds.button {
    color: #454545;
    background: #ecf0f1;
    border-bottom: 2px solid #dadedf;
    -webkit-box-shadow: inset 0 -2px #dadedf;
    box-shadow: inset 0 -2px #dadedf;
}

/* #Silver Flat Button
==================================================*/
.silver.button {
    color: white;
    background: #bdc3c7;
    border-bottom: 2px solid #acb2b7;
    -webkit-box-shadow: inset 0 -2px #acb2b7;
    box-shadow: inset 0 -2px #acb2b7;
}

/* #Concrete Flat Button
==================================================*/
.concrete.button {
    color: white;
    background: #859596;
    border-bottom: 2px solid #95a5a6;
    -webkit-box-shadow: inset 0 -2px #95a5a6;
    box-shadow: inset 0 -2px #95a5a6;
}

/* #Asbestos Flat Button
==================================================*/
.asbestos.button {
    color: white;
    background: #7f8c8d;
    border-bottom: 2px solid #6d7b7c;
    -webkit-box-shadow: inset 0 -2px #6d7b7c;
    box-shadow: inset 0 -2px #6d7b7c;
}

/* #Asbestos Flat Button
==================================================*/
.asbestos.button {
    color: white;
    background: #7f8c8d;
    border-bottom: 2px solid #6d7b7c;
    -webkit-box-shadow: inset 0 -2px #6d7b7c;
    box-shadow: inset 0 -2px #6d7b7c;
}

/* #Graphite Flat Button
==================================================*/
.graphite.button {
    color: white;
    background: #454545;
    border-bottom: 2px solid #2f2e2e;
    -webkit-box-shadow: inset 0 -2px #2f2e2e;
    box-shadow: inset 0 -2px #2f2e2e;
}
