/* 24. START CSS Buttons */
/* Globals for CSS Buttons */
.cssButton {
    position:relative;
    font-family: 'Red Hat Display', sans-serif;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    padding: 9px 5px;
    font-weight:900;
    text-transform:none;
    white-space:nowrap;
    text-decoration:none;
    min-height:44px;
    border-radius:4px;
    transition: all 0.3s ease-in-out;
  }
  .cssButtonText {
    font-size:13px;
    line-height:24px;
    text-transform:uppercase;
    vertical-align:top;
    padding: 0px 3px;
  }
  .cssButtonIcon {
    font-size:13px;
    line-height:24px;
    vertical-align:top;
    padding: 0px 3px;
  }
  .cssButtonIcon .far,
  .cssButtonIcon .fas,
  .cssButtonIcon .fa-solid,
  .cssButtonIcon .fa-regular {
    vertical-align:top;
    line-height:24px;
  }
  .cssButton button {
    position:absolute;
    left:0px;
    top:0px;
    width:100%;
    height:100%;
    color:transparent;
    cursor:pointer;
    opacity: 0;
  }
  .cssButton:hover { 
    opacity:0.8;
    text-decoration:none;
  }   
  
  /* Colors for CSS Buttons */
  /* Color Grey */
  .cssButtonColor1 {
    border-radius:4px;
    text-decoration:none;
    border: 1px solid var(--button1_border, rgba(0,0,0,0.1));
    background: var(--button1_background, #ddd);
    color: var(--button1_color, #333);
  }
  .cssButtonColor1:hover {
    opacity:0.8;
    text-decoration:none !important;
  }
  
  /* Color Black */
  .cssButtonColor2 {
    border-radius:4px;
    text-decoration:none;
    border: 1px solid var(--button2_border, rgba(0,0,0,0.1));
    background: var(--button2_background, #4d4d4d);
    color: var(--button2_color, #fff);
  }
  .cssButtonColor2:hover {
    opacity:0.8;
    text-decoration:none !important;
  }
  
  /* Color: light grey */
  .cssButtonColor3 {
    border-radius:4px;
    border: 1px solid rgba(0,0,0,0.1);
    text-decoration:none;
    background:#eee;
    color:#333;
  }
  .cssButtonColor3:hover {
    opacity:0.8;
    text-decoration:none !important;
  }
  
  /* Green Buttons */
  .cssButtonColor4 {
    border-radius:4px;
    border:1px solid rgba(0,0,0,0.1);
    text-decoration:none;
    background-color:#43c875;
    color:#ffffff;
  }
  .cssButtonColor4:hover {
    opacity:0.8;
    text-decoration:none !important;
  }
  
  /* Transparent Icons no Border */
  .cssButtonColor5 {
    background:#ccc;
    color:#333;
  }
  .cssButtonColor5:hover {
    opacity:0.8;
    text-decoration:none !important;
  }
  
  /* Yellow Paypal Express Buttons */
  .cssButtonColor6 {
    border-radius:2px;
    border:1px solid #d19c20;
    text-decoration:none;
    background-color:#ffc848;
    color:#222;
    display:inline-block;
    text-shadow:1px 1px 0px #ffd97e;
    box-shadow:inset 1px 1px 0px 0px #ffe3a1;
    height:32px;
  }
  .cssButtonColor6:hover {
    background-color:#fbba22;
    color:#222;
    text-decoration:none !important;
  }
  .cssButtonColor6 .color-paypal0 {
    font-size:10px;
    line-height:16px;
    font-family:Arial, Helvetica, sans-serif;
    font-weight:bold;
    color:#013088;
    padding: 0 5px 0 0;
    vertical-align:middle;
  }
  .cssButtonColor6 .color-paypal1 {
    font-size:18px;
    line-height:16px;
    font-family: 'Poppins', sans-serif;
    font-style:italic;
    font-weight:700;
    color:#013088;
  }
  .cssButtonColor6 .color-paypal2 {
    font-size:18px;
    line-height:16px;
    font-family: 'Poppins', sans-serif;
    font-style:italic;
    font-weight:700;
    color:#019CDE;
  }
  
  /* Small account action text-buttons  */
  .cssButtonColor7 {
    text-transform:none;
    font-weight:600;
    padding: 0px;
    margin: 0px;
    height:auto;  
    text-decoration:none;
    border: none;;
    color: #333;
  }
  .cssButtonColor7 .cssButtonText {
    font-size: 12px;
    line-height: 16px;
    text-transform: none;
    vertical-align: top;
    padding: 0px 3px;
    text-decoration:none;
    border-bottom: 1px solid #555;
  }
  .cssButtonColor7 .cssButtonIcon {
    font-size: 12px;
    line-height: 16px;
    vertical-align: top;
    padding: 0px 3px;
  }
  .cssButtonColor7:hover {
    opacity:0.8;
    text-decoration:none !important;
    border:none;
    background:none;
  }
  /* 24. END CSS Buttons */