:root {
  --secondary: #ed5b2d;
  --alpha: rgb(195, 197, 191);
  --white: #ffffff;
  --blue: rgb(37, 37, 94);
  --link: rgb(37, 37, 94);
  --link-active: #14a800;
  --link-hover: #14a800;
  --black: rgb(82, 60, 60);
  --common-font: 'Inter';
  --title-font: 'Fira Sans';
  --top-green: darkgreen;
  --primary: darkgreen;
}

* {
  padding: 0px;
  margin: 0px;
  box-sizing: border-box;
  font-family: var(--common-font);
  color: var(--black);
}

a {
  text-decoration: none;
  font-weight: 600;
  text-decoration: none;
  color: var(--link);
}

a:active {
  color: var(--link-active);
}
a:hover {
  color: var(--link-hover);
}

body {
  font-family: 'Roboto', sans-serif;
  overflow: hidden;
}

.bold-text {
  font-weight: bold;
}

button {
  padding: 2px 20px;
  border-radius: 10px;
}
.mybtn {
  padding: 6px 20px;
  border-radius: 5px;
}

.mybtn-contained {
  border: none;
}

.mybtn-outlined {
  border: 1px solid var(--blue);
  background: transparent !important;
  color: var(--primary) !important;
}

.mybtn-primary {
  border: 1px solid var(--primary);
  background: var(--primary);
  color: white;
}

.mybtn-secondary {
  border: 1px solid var(--secondary);
  background: var(--secondary);
  color: white;
}

.btn-outlined-primary {
  border: 1px solid var(--blue);
  background: transparent;
  color: var(--primary);
}

.btn-outlined-danger {
  border: 1px solid red;
  background: transparent;
  color: red;
}

.btn-donate {
  border: 1px solid green;
  background: orange;
  color: black;
}

.btn-outlined-success {
  border: 1px solid green;
  background: transparent;
  color: green;
}

.btn-contained-success {
  border: 1px solid green;
  background: green;
  color: white;
}

.btn-icon {
  background: transparent;
  color: var(--secondary);
  padding: 0px !important;
  border: none;
  border: 1px solid rgba(0, 0, 0, 0.08);
}

.btn-icon img {
  height: 40px;
}

.btn-chip {
  border: 1px solid green;
  background: rgba(0, 0, 0, 0.08);
  color: black;
  padding: 1px 8px;
  margin: 1px 0px;
  font-size: 0.7rem;
}

.btn-open {
  border: 1px solid var(--blue);
  background: transparent;
  color: var(--primary);
  padding: 1px 10px;
  font-size: 12px;
}

.ck-editor__editable {
  min-height: 100px;
}

.title {
  padding: 10px 0px;
  color: var(--primary);
  font-size: 2rem;
  font-family: var(--title-font), sans-serif;
}

.subtitle {
  padding: 10px 0px;
  font-size: 1.2rem;
}

.active > a {
  background: var(--primary) !important;
}

.blog-title p {
  font-family: var(--common-font), sans-serif;
}

.blog-title {
  padding: 10px 0px;
  color: var(--primary);
  font-size: 30px;
  font-family: var(--title-font), sans-serif;
}

.blog-subtitle {
  padding: 10px 0px;
  font-size: 18px;
}

.secondary-bg {
  background: var(--secondary);
}

.secondary-text {
  color: var(--secondary) !important;
}

.BodyMainContent {
  min-height: 50vh;
  margin-top: 9vh;
}

.BodyContainer {
  overflow-y: scroll;
  overflow-x: hidden;
  height: 100vh;
}

.BodyContainer::-webkit-scrollbar {
  width: 5px;
  background-color: #f5f5f5;
  height: 5px;
}

.BodyContainer::-webkit-scrollbar-thumb {
  background-color: var(--primary);
  border-radius: 10px;
  background-image: -webkit-linear-gradient(
    0deg,
    rgba(255, 255, 255, 0.5) 25%,
    transparent 25%,
    transparent 50%,
    rgba(255, 255, 255, 0.5) 50%,
    rgba(255, 255, 255, 0.5) 75%,
    transparent 75%,
    transparent
  );
}

.phone-input-container {
  display: grid;
  grid-template-columns: 1fr;
}
.flexible-phone-input {
  grid-column: 1 / span 1;
}