/*
 * Copyright (c) 2018. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
 * Morbi non lorem porttitor neque feugiat blandit. Ut vitae ipsum eget quam lacinia accumsan.
 * Etiam sed turpis ac ipsum condimentum fringilla. Maecenas magna.
 * Proin dapibus sapien vel ante. Aliquam erat volutpat. Pellentesque sagittis ligula eget metus.
 * Vestibulum commodo. Ut rhoncus gravida arcu.
 */

/* class used to reset style put on input[type="submit"] */
input[type="submit"].reset-style {
    margin: 0;
    padding: 0;
    border: 0;
    font-weight: inherit;
    font-style: inherit;
    background:none;
    text-decoration: none;
}

/*
 * @TODO : once the style on input[type="submit"] is unused :
 * @TODO   - remove the reset-style class
 * @TODO   - remove lines with unneeded "input[type="submit"]" specification in this file
 */

input[type="submit"].material-btn,
*.material-btn {
    display:inline-block;
    border-radius: 2px;
    border: 1px solid #0E3460;
    transition: .2s ease-out;
    color: #fff;
    background-color: #0E3460;
    margin: 6px;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    padding:8px 10px;
}

input[type="submit"].material-btn:hover,
.material-btn:hover {
    color: #fff;
    border-color:#5E99BD;
    background-color: #5E99BD;
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
    text-decoration:none;

}

input[type="submit"].material-btn:active, input[type="submit"].material-btn:focus, input[type="submit"].material-btn.active
.material-btn:active, .material-btn:focus, .material-btn.active {
    outline: 0;
    color: #fff;
}

/* AVAILABLE COLORS */
.material-btn.red {
    color:#fff;
    background-color: #a4201b;
    border-color:#a4201b;
}
.material-btn.red:hover {
    color:#fff;
    background-color: #ff2722;
    border-color:#ff2722;
}

.material-btn.orange {
    color:#fff;
    background-color: #c3712a;
    border-color:#c3712a;
}
.material-btn.orange:hover {
    color:#fff;
    background-color: #ff9b2f;
    border-color:#ff9b2f;
}

.material-btn.primary {
    color: #fff;
    background-color: #0E3460;
    border-color:#0E3460;
}
.material-btn.primary:hover {
    color: #fff;
    background-color: #5E99BD;
    border-color:#5E99BD;
}

.material-btn.secondary {
    color:#5E99BD;
    background-color:#fff;
    border-color:#5E99BD;
}
.material-btn.secondary:hover {
    color: #fff;
    background-color:#5E99BD;
}


/* BUTTON GROUPS */
.material-btn-group .material-btn:first-child {
    margin-right:0;
    border-right:0;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}
.material-btn-group .material-btn:last-child {
    margin-left:0;
    border-left:0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}
.material-btn-group .material-btn:not(:first-child):not(:last-child) {
    margin-right:0;
    border-right:0;
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    margin-left:0;
    border-left:0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

.material-btn-group.right .material-btn {
    text-align:right;
}