/**
 * Custom styles for Switch Mobile site
 */

/* Global variables */
:root {
  --red: #761638;
  --pink: #f0d0cb;
  --yellow: #f9b700;
  --gold: #cd7e2a;
  --green: #00685f;
  --white: #fff9ef;
  --white-bg: #f6faf7;
  --bright-blue: #addde0;
  --blue: #8585c0;
  --black: #000000;
  --grey-bg: #ebf0ec;
}

.btn { font-size: 17px; padding: 12px 30px; border-radius: 999px; white-space: nowrap; font-weight: 600; }
.btn-primary, .btn-yellow { background-color: #f9b700; color: black; }
.btn-secondary, .btn-grey { background-color: var(--grey-bg); color: black; }
.btn-gold { background-color: var(--gold); color: black; }
.btn-red { background-color: var(--red); color: white; }
.btn-pink { background-color: var(--pink); color: black; }
.btn-green { background-color: var(--green); color: white; }
.btn-blue { background-color: var(--blue); color: white; }
.btn-white { background-color: var(--white); color: black; }
.btn-black { background-color: var(--black); color: white; }
.btn:hover, .btn:focus { opacity: 0.8; color: black; }
.btn-red:hover { color: white; }
.btn-black:hover { color: var(--white); }

.red-text { color: var(--red); }
.pink-text { color: var(--pink); }
.yellow-text { color: var(--yellow); }
.green-text { color: var(--green); }
.blue-text { color: var(--blue); }
.white-text { color: var(--white); }
.black-text { color: var(--black); }
.grey-text { color: var(--grey-bg); }

.site-content { padding: 0px; }
.top-navigation {
  background-color: black;
}
.main-navigation ul li a { color: white; }

.top-navigation-right { display: flex; align-items: center; gap: 24px; }
.top-navigation-right .nav-icons { display: flex; gap: 14px; }
.top-navigation-right .nav-icons .nav-icon { color: #c1c1c1; }
.page-template-homepage #page.container { max-width: 100%; padding: 0px !important; }
.page-template-homepage-new #page.container { max-width: 100%; padding: 0px !important; }
.page-template-plans-page #page.container { max-width: 100%; padding: 0px !important; }
.page-template-faqs-page #page.container { max-width: 100%; padding: 0px !important; }
.page-template-contact-page #page.container { max-width: 100%; padding: 0px !important; }
.page-template-about-us-page #page.container { max-width: 100%; padding: 0px !important; }
.justify-content-center { justify-content: center; }
.justify-content-start { justify-content: flex-start; }
.justify-content-end { justify-content: flex-end; }

@media (max-width: 1000px) {
  .top-navigation-right { width: 100%; max-width: 100%; justify-content: center; margin-top: 18px; }
}