/* Dropdown styling */
.its-select {
  width: 100%;
  font-size: 16px;
  padding: 15px 45px 11px 12px;
  background: right 17px bottom 18px no-repeat url(/_resources/images/emerald-down.png);
  background-size: 12px auto;
  text-align: left;
  border: 2px solid #00794c;
  background-color: #fff;
  border-radius: 4px;
  transition: background 0s;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/* Responsive spacing */
@media (max-width: 767px) {
  .stacked-margin-top {
    margin-top: 20px;
  }
  .responsive-border {
    border-top: 2px solid #00794c;
    padding-top: 20px;
  }
}

@media (min-width: 768px) {
  .responsive-border {
    border-left: 2px solid #00794c;
    padding-left: 20px;
  }
}

/* Layout spacing */
.margin-top-20 { margin-top: 20px; }
.margin-top-40 { margin-top: 40px; }
.margin-top-80 { margin-top: 80px; }
.margin-bottom-80 { margin-bottom: 80px; }
.padding-20 { padding: 20px; }
.padding-top-20 { padding-top: 20px; }
.padding-left-20 { padding-left: 20px; }

/* Typography */
.text-x-large-bold { font-size: 64px; font-weight: bold; }
.text-large-bold { font-size: 32px; font-weight: bold; }
.text-medium-bold { font-size: 24px; font-weight: bold; }
.text-medium { font-size: 24px; }
.text-small-bold { font-size: 12px; font-weight: bold; }
.text-center { text-align: center; }

/* Tablet: 768px and below */
@media (max-width: 768px) {
  .text-x-large-bold { font-size: 48px; }
  .text-large-bold   { font-size: 24px; }
  .text-medium-bold  { font-size: 18px; }
  .text-medium       { font-size: 18px; }
  .text-small-bold   { font-size: 16px; }
}

/* Mobile: 480px and below */
@media (max-width: 480px) {
  .text-x-large-bold { font-size: 32px; }
  .text-large-bold   { font-size: 18px; }
  .text-medium-bold  { font-size: 16px; }
  .text-medium       { font-size: 16px; }
  .text-small-bold   { font-size: 14px; }
}

/* Colors */
.text-primary { color: #004785; }
.text-secondary { color: #000000; }
.text-white { color: white; }
.text-gold { color: #ccaa00; }
.bg-primary { background-color: #00794c; }
.bg-light { background-color: #d5e8e1; }
.bg-dark-overlay { background-color: rgba(0, 0, 0, 0.4); }

/* Borders */
.border-top-primary { border-top: 2px solid #00794c; }
.border-left-primary { border-left: 2px solid #00794c; }
.border-none { border: none; }

/* Buttons */
.btn-custom {
  font-size: 20px;
  background-color: #004785;
  color: #ffffff;
}

/* Images */
.img-center { margin: 0 auto 20px auto; }

/* Backgrounds */
.bg-gradient-bar {
  height: 2px;
  width: 100%;
  margin-top: 10px;
  background: linear-gradient(to right, #004785, #00794c);
}

.bg-gradient-divider {
  height: 2px;
  width: 100%;
  margin-top: 40px;
  background: linear-gradient(to right, #004785, #00794c);
}

.bg-image-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('https://cdn.pixabay.com/photo/2016/03/04/12/20/server-1235959_1280.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 1;
}

.bg-overlay-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
  z-index: 2;
}

.content-overlay {
  position: relative;
  z-index: 3;
  text-align: center;
}

/* Text effects */
.text-shadow {
  text-shadow: 2px 2px 4px #333;
}