/* JUF WRAPPER STYLESHEET

 ***********
 BRAND COLORS
 
    Blues
    P295C100: #002855
    P295C80: #2D4D76
    P295C60: #627596
    P295C40: #94A1B8
    P295C20: #C8CEDA

    Purples
    P2587C100: #8347AD
    P2587C60: #B590CC

    Orange
    P170C100: #FF8671
    Pantone 7417C: R:230 G:75 B:56  HEX: #E64B38
    Pantone 1797C: R:207 G:51 B:57  HEX: #CF3339

    Reds
    P234C100: #A50063
    P233C100: #CA007B
    P218C100: #E96BAF

    Aquas
    Pantone 318 C: #84D9DE
    Pantone 319 C: #1DC9D3
    Pantone 7467 C: #00A0AF

 *********/






/********************************/
/*           BUTTONS            */
/********************************/


/* SIZING */

.juf__brand__btn,
.juf__brand__btn:link,
.juf__brand__btn:visited {
    font-size: 1.75rem;
    font-weight: normal;
    text-transform: uppercase;
    font-weight: 600;
    letter-spacing: 1px;
    padding: 1rem 3rem;
    margin: 0;
    border-radius: 0px;
    display: inline-block;
    opacity: .75;
    transition: all ease .15s;
}

    .juf__brand__btn:hover,
    .juf__brand__btn:active,
    .juf__brand__btn:focus {
        opacity: 1;
        box-shadow: none;
    }


@media (max-width: 575px) {
    .juf__brand__btn,
    .juf__brand__btn:link,
    .juf__brand__btn:visited {
        padding: .85rem 2.75rem;
        font-size: 1.5rem;
    }
}


.juf__brand__btn__small,
.juf__brand__btn__small:link,
.juf__brand__btn__small:visited {
    padding: 10px 20px;
    font-size: 0.85rem;
}

.juf__brand__btn__xs,
.juf__brand__btn__xs:link,
.juf__brand__btn__xs:visited {
    padding: 8px 12px;
    font-size: 0.75rem;
}

.juf__brand__btn__tiny,
.juf__brand__btn__tiny:link,
.juf__brand__btn__tiny:visited {
    padding: 3px 6px;
    font-size: 0.6rem;
    border-width: 1px !important;
    letter-spacing: inherit;
    line-height: initial;
}



.juf__brand__btn__wide {
    width: 100%;
}




/* COLOR STATES */


.juf__brand__btn__blue {
    color: #FFFFFF !important;
    border: 2px solid #009bd3;
    background-color: #009bd3 !important;
}

    .juf__brand__btn__blue:hover,
    .juf__brand__btn__blue:active,
    .juf__brand__btn__blue:focus {
        color: #FFFFFF !important;
    }

.juf__brand__btn__blue__outline {
    color: #009bd3 !important;
    border: 2px solid #009bd3;
    background-color: transparent !important;
}

    .juf__brand__btn__blue__outline:hover,
    .juf__brand__btn__blue__outline:active,
    .juf__brand__btn__blue__outline:focus {
        color: #009bd3 !important;
        border-color: #009bd3;
    }

.juf__brand__btn__green {
    color: #FFFFFF !important;
    border: 2px solid #80bb00;
    background-color: #80bb00 !important;
}

    .juf__brand__btn__green:hover,
    .juf__brand__btn__green:active,
    .juf__brand__btn__green:focus {
        color: #FFFFFF !important;
    }

.juf__brand__btn__green__outline {
    color: #80bb00 !important;
    border: 2px solid #80bb00;
    background-color: transparent !important;
}

    .juf__brand__btn__green__outline:hover,
    .juf__brand__btn__green__outline:active,
    .juf__brand__btn__green__outline:focus {
        color: #80bb00 !important;
        border-color: #80bb00;
    }

.juf__brand__btn__dkGreen {
    color: #FFFFFF !important;
    border: 2px solid #6aa339 !important;
    background-color: #6aa339 !important;
}

    .juf__brand__btn__dkGreen:hover,
    .juf__brand__btn__dkGreen:active,
    .juf__brand__btn__dkGreen:focus {
        color: #FFFFFF !important;
    }

.juf__brand__btn__dkGreen__outline {
    color: #6aa339 !important;
    border: 2px solid #6aa339;
    background-color: transparent !important;
}

    .juf__brand__btn__dkGreen__outline:hover,
    .juf__brand__btn__dkGreen__outline:active,
    .juf__brand__btn__dkGreen__outline:focus {
        color: #6aa339 !important;
        border-color: #6aa339;
    }

.juf__brand__btn__violet {
    color: #FFFFFF !important;
    border: 2px solid #8347ad !important;
    background-color: #8347ad !important;
}

    .juf__brand__btn__violet:hover,
    .juf__brand__btn__violet:active,
    .juf__brand__btn__violet:focus {
        color: #FFFFFF !important;
    }

.juf__brand__btn__violet__outline {
    color: #8347ad !important;
    border: 2px solid #8347ad;
    background-color: transparent !important;
}

    .juf__brand__btn__violet__outline:hover,
    .juf__brand__btn__violet__outline:active,
    .juf__brand__btn__violet__outline:focus {
        color: #8347ad !important;
        border-color: #8347ad;
    }

.juf__brand__btn__p220 {
    color: #FFFFFF !important;
    border: 2px solid #aa004f;
    background-color: #aa004f !important;
}

    .juf__brand__btn__p220:hover,
    .juf__brand__btn__p220:active,
    .juf__brand__btn__p220:focus {
        color: #FFFFFF !important;
    }

.juf__brand__btn__p220__outline {
    color: #aa004f !important;
    border: 2px solid #aa004f;
    background-color: transparent !important;
}

    .juf__brand__btn__p220__outline:hover,
    .juf__brand__btn__p220__outline:active,
    .juf__brand__btn__p220__outline:focus {
        color: #aa004f !important;
        border-color: #aa004f;
    }

/* SHADOWS */

.juf__brand__btn__shadow__med {
    box-shadow: .2rem .25rem .85rem rgba(0,0,0,.25) !important;
    transition: all ease .15s;
}

    .juf__brand__btn__shadow__med:hover,
    .juf__brand__btn__shadow__med:active,
    .juf__brand__btn__shadow__med:focus {
        box-shadow: .1rem .1rem .25rem rgba(0,0,0,.25) !important;
    }