/* =========================
   ROOT VARIABLES
========================= */
:root {
    --gold:#ad7f37;
    --green_primary:#758f43;
    --green_secondary:#0f1406;
    --white:#fff;
    --black:#000;
}

/* =========================
   GLOBAL RESET
========================= */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/*
  buttons
*/
.mainbutton {
    background-color: color-mix(in srgb, var(--green_primary) 30%, transparent);
    
    color: var(--white);
    border: 1px solid var(--gold);
    padding: 10px 20px;
    cursor: pointer;
    font-size: 16px;
    border-radius: 5px;
    transition: background-color 0.3s ease;
}
.secondarybutton{
    background-color: transparent;
    color: var(--white);
    border: 1px solid var(--gold);
    padding: 10px 20px;
    cursor: pointer;
    font-size: 16px;
    border-radius: 5px;
    transition: background-color 0.3s ease;
}
.mainbtn{
    background-color: var(--gold);
    color: var(--black);
    border: transparent;
}
.secbtn{
    background-color: transparent;
    border: 2px solid var(--gold);
    color: var(--white);
}