/* ------------- Custom Base ------------------ */

    a.btn-custom.disabled, button.btn-custom.disabled {
        opacity:0.5;
    }
    
    a.btn-custom.disabled:hover, button.btn-custom.disabled:hover {
        opacity:0.5;
    }
    
    a.btn-custom, button.btn-custom {
        border-style:solid;
        border-width:2px;
        border-radius: 4px 4px 4px 4px;
        cursor: pointer;
        margin: 0;
        padding: 10px;
        text-decoration:none;
        font-family: 'Lato',sans-serif;
        font-size: 1.1em;
        font-weight: 500;
        line-height: 14px;
        background-color:white;
        
        opacity:1;
    }
    
    a.btn-custom:hover,
    a.btn-custom:focus,
    a.btn-custom:visited {
        text-decoration:none;
    }
    
    a.btn-custom:hover {
        opacity:0.8;
    }

    /* ------------- Purple ------------------ */
    
    a.btn-custom.purple, button.btn-custom.purple {
        border-color:#c473c4;
        color:#c473c4;
    }
    
    a.btn-custom.solid.purple, button.btn-custom.solid.purple {
        background-color:#c473c4;
        color:white;
    }
    
    a.btn-custom.border.purple, button.btn-custom.border.purple {
        border-color:#a260a2;
    }
    
    a.btn-custom.purple:hover, button.btn-custom.purple:hover {
        border-color:#842C84;
        color:#842C84;
        background-color:#FDE5FD;
    }
    
    a.btn-custom.duo.purple > .btn-icon {
        background-color: #a260a2;
        color:white;
    }
    
    /* ------------- Red ------------------ */

    a.btn-custom.red, button.btn-custom.red {
        border-color:#f47f6f;
        color:#f47f6f;
    }
    
    a.btn-custom.solid.red, button.btn-custom.solid.red {
        background-color:#f47f6f;
        color:white;
    }
    
    a.btn-custom.border.red, button.btn-custom.border.red {
        border-color:#f25d40;
    }
    
    a.btn-custom.red:hover, button.btn-custom.red:hover {
        border-color: #f24422;
        color:#f24422;
        background-color:#FCEDEB;
    }
    
    a.btn-custom.duo.red > .btn-icon {
        background-color: #f25d40;
        color:white;
    }
    
    /* ------------- Green ------------------ */
    a.btn-custom.green, button.btn-custom.green {
        border-color:#84c984;
        color:#84c984;
    }
    
    a.btn-custom.solid.green, button.btn-custom.solid.green {
        background-color:#84c984;
        color:white;
    }
    
    a.btn-custom.border.green, button.btn-custom.border.green {
        border-color:#74ba74;
    }
    
    a.btn-custom.green:hover, button.btn-custom.green:hover {
        border-color:#47a447;
        color:#47a447;
        background-color:#DDFCDD;
    }
    
    a.btn-custom.duo.green > .btn-icon {
        background-color: #74ba74;
        color:white;
    }

    /* ------------- Blue ------------------ */
    a.btn-custom.blue, button.btn-custom.blue {
        border-color:#70a7d6;
        color:#70a7d6;
    }
    
    a.btn-custom.solid.blue, button.btn-custom.solid.blue {
        background-color:#70a7d6;
        color:white;
    }
    
    a.btn-custom.border.blue, button.btn-custom.border.blue {
        border-color:#6497c3;
    }
    
    a.btn-custom.blue:hover, button.btn-custom.blue:hover {
        border-color:#3276b1;
        color:#3276b1;
        background-color:#EAF5FF;
    }
    
    a.btn-custom.duo.blue > .btn-icon {
        background-color: #6497c3;
        color:white;
    }
    
    /* ------------- Orange ------------------ */

    a.btn-custom.orange, button.btn-custom.orange {
        color:#f49c6f;
        border-color:#f49c6f;
    }
    
    a.btn-custom.orange:hover, button.btn-custom.orange:hover {
        color:#f26722;
        border-color:#f26722;
        background-color:#FFEDE5;
    }
    
    a.btn-custom.solid.orange, button.btn-custom.solid.orange {
        background-color:#f49c6f;
        color:white;
    }
    
    a.btn-custom.border.orange, button.btn-custom.border.orange {
        border-color:#f48c58;
    }
    
    a.btn-custom.duo.orange > .btn-icon {
        background-color: #f48c58;
        color:white;
    }
    
    /* ------------- Grey ------------------ */

    a.btn-custom.grey, button.btn-custom.grey {
        color:#afafaf; 
        border-color:#afafaf; 
    }
    
    a.btn-custom.solid.grey, button.btn-custom.solid.grey {
        background-color:#afafaf; 
        color:white;
    }
    
    a.btn-custom.border.grey, button.btn-custom.border.grey {
        border-color:#969696;
    }
    
    a.btn-custom.grey:hover, button.btn-custom.grey:hover {
        border-color: #666666;
        color:#666666;
        background-color:#E5E5E5;
    }
    
    a.btn-custom.duo.grey > .btn-icon {
        background-color: #969696;
        color:white;
    }
    
    /* ------------- No Border ------------------ */

    a.btn-custom.no-border, button.btn-custom.no-border {
        border:none;
    }
    
    a.btn-custom.no-border:hover, button.btn-custom.no-border:hover {
        background:none;
    }
    
    /* ------------- Solid ------------------ */

    a.btn-custom.solid, button.btn-custom.solid {
        border:none;
    }
    
    a.btn-custom.solid:hover, button.btn-custom.solid:hover {
    }
    
    /* ------------- Border ------------------ */

    a.btn-custom.border, button.btn-custom.border {
        border-style:solid;
        border-width:2px;
    }
    
    /* ------------- Square ---------------- */
    a.btn-custom.square {
        padding: 8px;
        text-align: center;
        min-width: 80px;
        border: 1px solid;
        border-radius: 6px;
    }
    
    a.btn-custom.square > div {
        font-size:0.6em;
    }
    
    a.btn-custom.square > i {
        font-size:1.5em;
    }
    
    /* ------------- Duo ------------------ */
    
    a.btn-custom.duo {
        
        display: flex;
        flex-wrap: nowrap;
        
        opacity:1;
        
        padding:0;
    }
    
    a.btn-custom.duo:hover {
        opacity:0.8;
    }
    
    a.btn-custom.duo > div {
       padding:8px;
    }
    
    a.btn-custom.duo.disabled .btn-icon i {
        opacity:0.2;
    }
    
    /* ------------- Sprites ------------------ */

    a.btn-sprite, button.btn-sprite {
        line-height: 1.7em;
        font-size: 1.7em;
        padding: 0 8px;
        background:transparent;
        
        border-radius: 5px;
        color: #4a5764;
    }

    a.btn-sprite:hover, button.btn-sprite:hover {
        color:white;
        background: #f27c41;
        text-decoration:none;
    }
    
    a.btn-sprite > span {
        margin-left:5px;
    }
    
    @media screen and (max-width: 580px) {
        a.btn-sprite, button.btn-sprite {
            line-height: 1.5em;
            font-size: 1.5em;
            padding: 0 8px;
            border-radius: 5px;
        }
    }