﻿:root{
    --hrheadfont : "p22-mackinac-pro", serif;
    --hrbodyfont : "Mulish";
    --hrmontfont : "Mont";
    --catnipgreen:#A6E191;
    --catnipgreenhover:#74aa50;
    --trublue:#3A5DAE;
    --trubluehover:#28396f;
    --purple:#9A7AE6;
    --bodyblack:#222725;
    --bodywhite:#ffffff;
}

/*h1, h2, h3, h4, h5, h6{
    font-family : var(--hrheadfont);
}*/

.bgcolorgreen{background-color:var(--catnipgreen);}
.bgcolorblue{background-color:var(--trublue);}
.bgcolorpurple{background-color:var(--purple);}

/*body {
    font-family : var(--hrbodyfont);
    color:var(--bodyblack);
}*/

.hrbtn{
    -webkit-border-radius: 28px;
    border-radius: 28px;
    padding: 14px 20px;
    font-family: var(--hrmontfont);
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 22px;
    text-transform: uppercase;
    text-align: center;
}
.hrbtn.btn-primary.btngreen{
    background:var(--catnipgreen);
    border:2px solid var(--catnipgreen);
    color:var(--bodyblack);
}
.hrbtn.btn-primary.btngreen:hover,
.hrbtn.btn-primary.btngreen:focus{
    background:var(--catnipgreenhover);
    border:2px solid var(--catnipgreenhover);
    color:var(--bodyblack);
}
.hrbtn.btn-primary.btnblue{
    background:var(--trublue);
    border:2px solid var(--trublue);
    color:var(--bodywhite);
}
.hrbtn.btn-primary.btnblue:hover,
.hrbtn.btn-primary.btnblue:focus{
    background:var(--trubluehover);
    border:2px solid var(--trubluehover);
    color:var(--bodywhite);
}
.hrbtn.btn-secondary.btntranswhite{
    background:rgba(255, 255, 255, 0.4);
    border:2px solid var(--bodyblack);
    color:var(--bodyblack);
}
.hrbtn.btn-secondary.btntranswhite:hover,
.hrbtn.btn-secondary.btntranswhite:focus{
    background:rgba(255, 255, 255, 0.8);
    border:2px solid var(--bodyblack);
    color:var(--bodyblack);
}
.hrbtn.btn-secondary.btntransblack{
    background:rgba(0, 0, 0, 0.4);
    border:2px solid var(--bodywhite);
    color:var(--bodywhite);
}
.hrbtn.btn-secondary.btntransblack:hover,
.hrbtn.btn-secondary.btntransblack:focus{
    background:rgba(0, 0, 0, 0.8);
    border:2px solid var(--bodywhite);
    color:var(--bodywhite);
}


.hrhero {
    position: relative;
    width: 100%;
    height:650px;
    overflow: hidden;
}
 
.hrhero__overlay {
    position: absolute;
    inset: 0;
    background: rgba(20, 20, 20, 0.4);
    z-index: 1;
}
 
.hrhero__image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 30%;
}
 
.hrhero__content {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: center;
    text-align: center;
    padding: 46px 16px;
}
.hrhero__content.topcentered{
    align-items: start;
}
.hrhero__content.bottomcentered{
    align-items: end;
}

.hrhero__eyebrow {
    font-size: 16px;
    font-family: var(--hrmontfont);
    text-transform: uppercase;
    margin-bottom: 1rem;
    font-weight: 800;
    text-align: center;
}
 
.hrhero__title {
    font-size: 56px;
    font-family: var(--hrheadfont);
    margin-bottom: 1rem;
    font-weight: 700;
    text-align: center;
}
 
.hrhero__description {
    font-size: 16px;
    font-family: var(--hrbodyfont);
    margin-bottom: 1rem;
    font-weight: 400;
    text-align: center;
}

.hrhero__contenttext.white .hrhero__eyebrow,
.hrhero__contenttext.white .hrhero__title,
.hrhero__contenttext.white h1, .hrhero__contenttext.white h2, .hrhero__contenttext.white h3, 
.hrhero__contenttext.white h4, .hrhero__contenttext.white h5, .hrhero__contenttext.white h6,
.hrhero__contenttext.white .hrhero__description{
    color:var(--bodywhite);
}
.hrhero__contenttext.black .hrhero__eyebrow,
.hrhero__contenttext.black .hrhero__title,
.hrhero__contenttext.black h1, .hrhero__contenttext.black h2, .hrhero__contenttext.black h3, 
.hrhero__contenttext.black h4, .hrhero__contenttext.black h5, .hrhero__contenttext.black h6,
.hrhero__contenttext.black .hrhero__description{
    color:var(--bodyblack);
}

.rtbbanner{padding:36px 58px;}
.rtbbanner .rtbbannercard{margin-right:48px;}
.rtbbanner .rtbbannercard:last-child{margin-right:0;}
.rtbbanner .rtbbannercard .icon{margin-right:10px;}
.rtbbanner span{
    font-family: Mont;
    font-size: 20px;
    font-weight: 800;
    text-transform: uppercase;
}
.rtbbanner.white span{color:var(--bodywhite);}
.rtbbanner.black span{color:var(--bodyblack);}

@media only screen and (max-width:767px){
    .rtbbanner{padding: 36px 48px;}
    .rtbbanner .rtbbannercard{margin-right: 0; margin-bottom: 48px;padding: 0;}
    .rtbbanner .rtbbannercard:last-child{margin-bottom: 0;}
}