@font-face {
    font-family: 'Challenge';
    src: url('resources/ChallengeBold.otf');
}
@font-face {
    font-family: 'Helvetica';
    src: url('resources/HelveticaBold.ttf');
    font-weight: bold;
}
@font-face {
    font-family: 'Helvetica';
    src: url('resources/Helvetica.ttf');
}

div.logo {
    padding-bottom: 6px;
}
table.logo {
    border-collapse: collapse;
}
table.logo tr {
    white-space: nowrap;
}
td.green {
    background-color: #009e30;
}
td.red {
    background-color: red;
}

#mainLogo td.narrow {
    line-height: 0;
    height: 0.2cm;
}
#mainLogo td.wide {
    line-height: 0;
    height: 0.75cm;
}
#mainLogo td.empty {
    line-height: 0;
    height: 0.2cm;
}
#mainLogo td.side {
    min-width: 2.6cm;
}
#mainLogo td.safeway {
    color: red;
    text-align: center;
    font-weight: bold;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 68pt;
    line-height: 0;
    text-transform: uppercase;
    letter-spacing: -3pt;
    padding-left: 14px;
    padding-right: 14px;
}

#longLogo td.slogan {
    color: #009e30;
    font-family: 'Challenge', 'Challenge Std', cursive;
    font-size: 68pt;
    letter-spacing: -3pt;
    padding-right: 6pt;
}
#longLogo td.narrow {
    line-height: 0;
    height: 0.1cm;
}
#longLogo td.wide {
    line-height: 0;
    height: 0.4cm;
}
#longLogo td.empty {
    line-height: 0;
    height: 0.1cm;
}
#longLogo td.left {
    width: 2.5cm;
}
#longLogo td.left-alt {
    width: 1.25cm;
}
#longLogo td.right {
    min-width: 2.5cm;
}
#longLogo td.safeway {
    color: red;
    text-align: left;
    font-weight: bold;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 38pt;
    line-height: 0;
    text-transform: uppercase;
    letter-spacing: -3pt;
    padding-left: 8px;
    padding-right: 8px;
    width: 1px;
}

h1, h2 {
    text-align: center;
}

#mainLogo {
    float: left;
    margin-right: 5%;
    max-width: 100%;
}
#longLogo {
    float: left;
    max-width: 100%;
}
#pageBottom {
    clear: both;
    text-align: center;
}

/* Overrides */
a:link { color: #009e30; text-decoration: none; }
a:visited { color: #009e30; }
a:hover { color: #05c918; font-weight: bolder; }
a:active { color: red; }

.textbox {
  border: 1px solid #009e30;
}

.textbox:hover {
  border: 1px solid red;
  background: rgba(232,249,255,1);
}

.textbox:focus {
  background: rgba(255,253,232,1);
}

.button, button {
  border: 1px solid rgb(211,211,211);
  background: rgb(0, 200, 0);
}

.button:hover, button:hover {
  border: 1px solid red;
  background: #009e30;
}

.button:active, button:active {
  border: 1px solid rgba(0, 200, 0);
  background: red;
}