:root {
  --rcp-gray-r: 127;
  --rcp-gray-g: 127;
  --rcp-gray-b: 127;
  --rcp-gray-rgb: var(--rcp-gray-r), var(--rcp-gray-g), var(--rcp-gray-b);

  --rcp-red-r: 241;
  --rcp-red-g: 27;
  --rcp-red-b: 36;
  --rcp-red-rgb: var(--rcp-red-r), var(--rcp-red-g), var(--rcp-red-b);

  --rcp-purple-r: 41;
  --rcp-purple-g: 37;
  --rcp-purple-b: 129;
  --rcp-purple-rgb: var(--rcp-purple-r), var(--rcp-purple-g), var(--rcp-purple-b);

  --rcp-pink-r: 216;
  --rcp-pink-g: 81;
  --rcp-pink-b: 247;
  --rcp-pink-rgb: var(--rcp-pink-r), var(--rcp-pink-g), var(--rcp-pink-b);

  --rcp-primary: rgb(var(--rcp-purple-rgb));
  --rcp-primary-rgb: var(--rcp-purple-rgb);
  --rcp-primary-r: var(--rcp-purple-r);
  --rcp-primary-g: var(--rcp-purple-g);
  --rcp-primary-b: var(--rcp-purple-b);

  --rcp-secondary: rgb(var(--rcp-pink-rgb));
  --rcp-secondary-rgb: var(--rcp-pink-rgb);
  --rcp-secondary-r: var(--rcp-pink-r);
  --rcp-secondary-g: var(--rcp-pink-g);
  --rcp-secondary-b: var(--rcp-pink-b);

  --bs-primary: rgb(var(--rcp-primary-rgb));
  --bs-primary-rgb: var(--rcp-primary-rgb);
  --bs-secondary: rgb(var(--rcp-secondary-rgb));
  --bs-secondary-rgb: var(--rcp-secondary-rgb);
  --bs-link-color: rgb(var(--rcp-primary-rgb));
  --bs-link-hover-color: rgb(
	calc(var(--rcp-primary-r) * 0.8),
	calc(var(--rcp-primary-g) * 0.8),
	calc(var(--rcp-primary-b) * 0.8)
  );

  --bs-nav-link-color: rgb(255, 255, 255);
  --bs-navbar-active-color: rgb(255, 255, 255);
}

.navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.navbar-toggler {
  border: 1px solid #fff;
}

body {
  background: #efeff8;
}

.pagination {
  --bs-pagination-active-bg: rgb(var(--rcp-primary-rgb));
  --bs-pagination-active-border-color: rgb(var(--rcp-primary-rgb));
}

main {
  padding-top: 1rem;
  padding-bottom: 4rem;
}

header {
  border-bottom: 3px solid rgb(var(--rcp-primary-rgb));
}

.navbar-brand {
  color: rgb(var(--rcp-primary-rgb));
}

footer a,
footer a:visited {
  color: #333;
  font-weight: normal;
  text-decoration: none;
}

footer a:hover,
footer a:focus,
footer a:active {
  color: #666;
  font-weight: normal;
}

footer.footer-dark {
  background: rgb(var(--rcp-primary-rgb));
  color: rgb(var(--rcp-secondary-rgb));
}

footer.footer-dark a,
footer.footer-dark a:visited {
  color: #e5e4f6;
  font-weight: normal;
}

footer.footer-dark a:hover,
footer.footer-dark a:focus,
footer.footer-dark a:active {
  color: #c5c4d6;
  font-weight: normal;
}

.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--rcp-primary);
  --bs-btn-border-color: var(--rcp-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: rgb(
	calc(var(--rcp-primary-r) * 0.9),
	calc(var(--rcp-primary-g) * 0.9),
	calc(var(--rcp-primary-b) * 0.9)
  );
  --bs-btn-hover-border-color: rgb(
	calc(var(--rcp-primary-r) * 1.1),
	calc(var(--rcp-primary-g) * 1.1),
	calc(var(--rcp-primary-b) * 1.1)
  );
  --bs-btn-focus-shadow-rgb: var(--rcp-secondary-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: rgb(
	calc(var(--rcp-primary-r) * 1.1),
	calc(var(--rcp-primary-g) * 1.1),
	calc(var(--rcp-primary-b) * 1.1)
  );
  --bs-btn-active-border-color: rgb(
	calc(var(--rcp-primary-r) * 1.05),
	calc(var(--rcp-primary-g) * 1.05),
	calc(var(--rcp-primary-b) * 1.05)
  );
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--rcp-primary);
  --bs-btn-disabled-border-color: var(--rcp-primary);
}

.btn-primary.white-border {
  border-width: 2px;
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--rcp-primary);
  --bs-btn-border-color: #fff;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: rgb(
	calc(var(--rcp-primary-r) * 0.9),
	calc(var(--rcp-primary-g) * 0.9),
	calc(var(--rcp-primary-b) * 0.9)
  );
  --bs-btn-hover-border-color: #fff;
  --bs-btn-focus-shadow-rgb: var(--rcp-secondary-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: rgb(
	calc(var(--rcp-primary-r) * 1.1),
	calc(var(--rcp-primary-g) * 1.1),
	calc(var(--rcp-primary-b) * 1.1)
  );
  --bs-btn-active-border-color: #fff;
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--rcp-primary);
  --bs-btn-disabled-border-color: #aaa;
}

.btn-primary.white-border {
  color: #fff !important;
  background-color: var(--cony-primary);
  border-color: #fff;
}

.btn-primary.white-border:hover,
.btn-primary.white-border:focus {
  background-color: var(--cony-primary-light);
  border-color: #fff;
}

.btn-primary.white-border:active,
.btn-primary.white-border.active {
  background-color: var(--cony-primary) !important;
  border-color: #fff !important;
}

.btn-primary.white-border:focus {
  box-shadow: 0 0 0 0.25rem #fff !important;
}

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
  color: rgb(var(--rcp-primary-rgb));
}

@media (min-width: 992px) {
  h1, .h1 {
	font-size: 3.75rem;
  }

  h2, .h2 {
	font-size: 2.5rem;
  }

  h3, .h3 {
	font-size: 2rem;
  }
}

article img {
  width: 100%;
  margin-top: 1rem;
  margin-bottom: 1rem;
  border-radius: 0.375rem;
}

article img.hero-image {
  margin-top: 0;
}

article h1 {
  padding-bottom: 1rem;
  text-align: center;
}

article a,
article a:visited {
  color: rgb(var(--rcp-primary-rgb));
}

article a:hover,
article a:focus,
article a:active {
  color: rgb(
	calc(var(--rcp-primary-r) * 0.9),
	calc(var(--rcp-primary-g) * 0.9),
	calc(var(--rcp-primary-b) * 0.9)
  );
}

article blockquote {
  padding-left: 0.5rem;
  border-left: 3px solid rgb(var(--rcp-primary-rgb));
  clear: both;
}

@media (min-width: 992px) {
  .recipe-text {
	padding-left: 10%;
	padding-right: 10%;
  }
}

main .card.card-primary {
  border-color: rgb(var(--rcp-primary-rgb));
}

main .card.card-primary .card-header {
  background: rgb(var(--rcp-primary-rgb));
  color: #fff;
}

.recipe-tag-list {
  text-align: center;
  padding-bottom: 1rem;
}

.recipe-tag-list .badge {
  background: rgb(var(--rcp-primary-rgb));
  color: #fff;
  text-decoration: none;
}

.recipe-list .recipe-item {
  padding-bottom: 2rem;
}

.recipe-list .recipe-item a {
  text-decoration: none;
  font-weight: bolder;
  font-size: 1.25rem;
}

.recipe-list .recipe-item a.badge {
  text-decoration: none;
  font-weight: normal;
  font-size: 0.75rem;
}

.subcategory-list[data-list-size=0] {
  display: none;
}

.subcategory-list[data-list-size="0"] {
  display: none;
}

.nav-underline {
  --bs-nav-underline-gap: 1rem;
  --bs-nav-underline-border-width: 0.125rem;
  --bs-nav-underline-link-active-color: rgb(255, 255, 255);
}

.navbar {
  --bs-navbar-active-color: rgb(255, 255, 255);
}

.navbar-nav {
  --bs-nav-link-color: rgb(255, 255, 255);
  --bs-nav-link-hover-color: rgb(255, 255, 255);
}

.accordion-button:not(.collapsed) {
  color: var(--rcp-primary-rgb);
  background-color: #fff;
}

.card.card-flow {
  border-radius: 30px;
  background: #FFF;
  box-shadow: -6px 6px 10px 0px rgba(0, 0, 0, 0.25);
}

.accordion.faq {
  border-radius: 30px;
  background: #FFF;
  box-shadow: -6px 6px 10px 0px rgba(0, 0, 0, 0.25);
  --bs-accordion-border-radius: 30px;
}

.accordion.faq .accordion-button::after {
  background-image: url(/design/accordion-plus.png);
  background-color: rgb(var(--rcp-primary-rgb));
  padding: 5px;
  width: 2rem;
  height: 2rem;
  background-position: center;
}

.accordion.faq .accordion-button:not(.collapsed)::after {
  background-image: url(/design/accordion-minus.png);
  transform: none;
}

.accordion.faq .accordion-item:last-of-type .accordion-button.collapsed {
  border-bottom-right-radius: 30px;
  border-bottom-left-radius: 30px;
}

.accordion.faq .accordion-item:first-of-type .accordion-button {
  border-top-left-radius: 30px;
  border-top-right-radius: 30px;
}

.font-20 {
  font-size: 1.25rem;
}

.font-24 {
  font-size: 1.5rem;
}

.font-28 {
  font-size: 1.75rem;
}