/* fonts setup start*/
@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Thin.eot");
  src: url("../fonts/Roboto-Thin.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto-Thin.woff2") format("woff2"), url("../fonts/Roboto-Thin.woff") format("woff"), url("../fonts/Roboto-Thin.ttf") format("truetype");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Bold.eot");
  src: url("../fonts/Roboto-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto-Bold.woff2") format("woff2"), url("../fonts/Roboto-Bold.woff") format("woff"), url("../fonts/Roboto-Bold.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Black.eot");
  src: url("../fonts/Roboto-Black.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto-Black.woff2") format("woff2"), url("../fonts/Roboto-Black.woff") format("woff"), url("../fonts/Roboto-Black.ttf") format("truetype");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Medium.eot");
  src: url("../fonts/Roboto-Medium.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto-Medium.woff2") format("woff2"), url("../fonts/Roboto-Medium.woff") format("woff"), url("../fonts/Roboto-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Light.eot");
  src: url("../fonts/Roboto-Light.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto-Light.woff2") format("woff2"), url("../fonts/Roboto-Light.woff") format("woff"), url("../fonts/Roboto-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Regular.eot");
  src: url("../fonts/Roboto-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/Roboto-Regular.woff2") format("woff2"), url("../fonts/Roboto-Regular.woff") format("woff"), url("../fonts/Roboto-Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
/* font setup end */

/* common variables start*/

:root {
  /* fonts */
  --font-roboto: "Roboto", sans-serif;

  /* font sizes */
  --font-size-4xs: 9px;
  --font-size-3xs: 10px;
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-lg: 18px;

  /* Colors */
  --color-theme-blue: #1b468b;
  --color-blue-opacity: rgba(27, 70, 139, 0.84);
  --color-blue-lightopacity: rgba(27, 70, 139, 0.69);
  --color-theme-black: #333333;
  --color-white: #ffffff;
  --color-black: #000000;
  --color-royal-black: #25252e;
  --color-gray: #666666;
}
/* common variable end */

/* general styling start */

* {
  margin: 0px;
  padding: 0px;
}

body {
  font-family: var(--font-roboto);
  position: relative;
  /* height: 100vh; */
  /* max-height: 100vh; */
}

p {
  font-size: var(--font-size-lg);
  line-height: 28px;
  margin: 0;
  font-weight: 400;
}

/* general styling end */

/* link hover */
.link-hover {
  color: var(--color-black);
  text-decoration-line: underline;
  /* font-weight: 600; */
  background-image: linear-gradient(to right, var(--color-black), var(--color-black) 50%, var(--color-theme-blue) 50%);
  background-size: 200% 100%;
  background-position: -100%;
  display: inline-block;
  position: relative;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all 0.3s ease-in-out;
}
.link-hover:hover {
  background-position: 0;
}
.link-hover:before {
  content: "";
  background: var(--color-theme-black);
  display: block;
  position: absolute;
  bottom: 3px;
  left: 0;
  width: 0;
  height: 1px;
  transition: all 0.25s ease-in-out;
  z-index: 1;
}
.link-hover:after {
  content: "";
  background: rgb(27 70 139 / 52%);
  display: block;
  position: absolute;
  bottom: 3px;
  left: 0;
  width: 100%;
  height: 1px;
  transition: all 0.25s ease-in-out;
}
.link-hover:hover::before {
  width: 100%;
}
a,
.select2-container--focus,
.select2-container--default,
:focus-visible {
  outline: unset !important;
  /* border: unset !important; */
}