/* atomic.css | mady by CH – LUM

--------------------------------------------------------------
>>> TABLE OF CONTENTS:
--------------------------------------------------------------
# 00 Global Buttons
# 01 Global Forms
--------------------------------------------------------------

================================
 ***** # 01 GLOBAL BUTTONS *****
================================

Button big*/

.kc-elm .btn-big {
  max-width: 100%;
    padding: 22px 78px 22px 78px;
    border-radius: 8px;
    background-color: var(--prim-clr);
    font-family: var(--font-family-copy);
    font-weight: normal;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--txt-white-clr);
    margin-top:0;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.2);
}

.kc-elm .btn-big:hover {
    background-color: var(--sec-clr);
}
.kc-elm .btn-big.invert, .kc-elm .btn-big .invert {
  max-width: 100%;
    padding: 22px 78px 22px 78px;
    border-radius: 8px;
    background-color: var(--txt-white-clr);
    font-family: var(--font-family-copy);
    font-weight: normal;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--prim-clr);
    margin-top: 0;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.2);
}
.kc-elm .btn-big.invert:hover, .kc-elm .btn-big .invert:hover {
    background-color: #000 !important;
    color: #fff !important;
}

/*Button small*/

.kc-elm .btn-small {
    padding: 12px 48px 9px 48px;
    border-radius: 8px;
    background-color: var(--prim-clr);
    font-family: var(--font-family-copy);
    font-weight: normal;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: var(--txt-white-clr);
    margin-top: 0;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.2);
}

.kc-elm .btn-small:hover {
    background-color: var(--sec-clr);
}


.btn-small .invert, .btn-small.invert {
    padding: 12px 48px 9px 48px;
    border-radius: 8px;
    background-color: #fff !important;
    font-family: var(--font-family-copy);
    font-weight: normal;
    letter-spacing: 1.4px;
    text-transform: uppercase;
    color: #000;
    margin-top: 0;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.2);
}

.btn-small .invert:hover, .btn-small.invert:hover {
    background-color: #000 !important;
    color: #fff !important;
}

/* Button in black */
.btn_in_black{
  padding: 9px 27px 7px 27px !important;
      border-radius: 8px;
      background-color: #000 !important;
      font-family: var(--font-family-copy);
      font-weight: normal;
      letter-spacing: 1.4px;
      text-transform: uppercase;
      color: var(--prim-clr) !important;
      border: 1px solid var(--prim-clr);
      font-size: 12px !important;
      margin-top: 0;
      width: 100%;
}
.btn_in_black:hover{
      background-color: var(--prim-clr) !important;
      color: #000 !important;
}
.btn-small-tight{
  padding: 12px 20px 9px 20px !important;
}
.btn-bottom{
  position: absolute;
  bottom: 24px;
}
.btn-job, .btn-more{
  font-size: 12px;
      font-weight: bold;
      font-stretch: normal;
      font-style: normal;
      line-height: 1;
      letter-spacing: 1.16px;
      text-align: center;
      padding: 14px;
      width: 100%;
      position: relative;
      border: 1px solid #ed6700;
      display: flex;
      flex-direction: column;
}
.btn-job, .btn-more:hover, .btn-job:visited {
  color: #ed6700;
  background-color: transparent;
}
.btn-job:hover, .btn-more, .btn-more:visited {
background-color: #ed6700;
color: #fff;
}

@media screen and (max-width:498px) {
  .kc-elm .btn-small {
        padding: 16px;
  }
.kc-elm .btn-big, .kc-elm .btn-big.invert, .kc-elm .btn-big .invert {
    padding: 16px;
}
}
/*============================
 ***** # 01 GLOBAL FORMS *****
==============================