@import url(https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;700;900&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700;900&family=Raleway:wght@400;600;700;900&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Pacifico&display=swap);
@import url(//fonts.googleapis.com/earlyaccess/lohitdevanagari.css);
:root {
  --main-blue: #D72F1F;
  --darker-blue: rgb(179, 42, 29);
  --blog-card-primary-color: #434343;
  --footer-bgc: #464546;
  --footer-bgc-lighter: #656565;
  --black: black;
  --white: white;
  --off-white: #fdfdfd;
  --dark-grey: #464546;
  --gradient-start: #31312f;
  --gradient-end: #262625;
  --material-grey: #E0E0E0;
}

html,
body {
  height: 100%;
  width: 100%;
  padding: 0;
  margin: 0;
}

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::-webkit-scrollbar {
  width: 6px;
}

/* Track */
::-webkit-scrollbar-track {
  background: var(--white);
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--main-blue);
  border: var(--main-blue);
  border-radius: 4px 4px;
  height: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--main-blue);
}

.disable-scrollbars::-webkit-scrollbar {
  width: 0px;
  background: transparent; /* Chrome/Safari/Webkit */
}

.disable-scrollbars::-webkit-scrollbar-thumb {
  display: none;
}

.disable-scrollbars {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE 10+ */
}

.page-root {
  padding-top: 3.5rem;
}

a,a:hover, a:visited{
  text-decoration: none;
}

#root{
  height:100%;
}

@media only screen and (min-width: 910px) {
  .page-root {
    padding-top: 0;
  }
}

.nav-bar {
  font-family: 'Raleway', sans-serif,"Lohit Devanagri";
  background-color: white;
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 3.5rem;
  width: 100%;
  z-index: 10;
  top: 0;
  color: black;
  overflow: hidden;
  position: fixed;
}

.nav-bar a,
.nav-bar a:hover,
.nav-bar:visited {
  color: white;
  font-weight: bold;
}
.nav-menu a,
.nav-menu a:hover,
.nav-menu:visited {
  color: white;
}

.nav-bar h1 {
  font-family: 'Raleway', sans-serif;
  font-weight: 900;
  width: 80%;
  font-size: 1.5rem;
  color: var(--white);
  text-align: center;
  color: black;
}

.nav-bar .hamburger {
  padding: 1rem;
}

.nav-bar .search {
  padding: 1rem;
  display: flex;
}

.nav-bar .hidden {
  display: none;
}

.nav-bar .search-box {
  font-family: 'Raleway', sans-serif;
  font-weight: bolder;
  font-size: 0.875rem;
  width: 10.5rem;
  height: 1.5rem;
  background-color: var(--darker-blue);
  color: var(--white);
  padding: 1rem;
  border: none;
  box-sizing: border-box;
  border-radius: 4px;
}

::placeholder {
  /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: var(--white);
  opacity: 1;
}

:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: var(--white);
}

::-ms-input-placeholder {
  /* Microsoft Edge */
  color: var(--white);
}

.nav-bar .search-icon {
  cursor: pointer;
}

.nav-bar .close-search {
  margin-right: 1rem;
  cursor: pointer;
}

.nav-bar .ham-icon {
  cursor: pointer;
  position: fixed;
  top: 15px;
  left: 15px;
}

.nav-bar .search-box-lg {
  font-family: 'Raleway', sans-serif;
  font-weight: bolder;
  font-size: 1rem;
  width: 12rem;
  height: 2rem;
  background-color: var(--darker-blue);
  color: var(--off-white);
  padding: 1.2rem;
  border: none;
  border-radius: 4px;
  box-sizing: border-box;
  margin-left: 1.25rem;
}

.nav-bar .nav-wrapper {
  margin-right: 2.25rem;
  display: none;
}

.nav-bar .nav-top-row {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row-reverse;
  position: relative;
  bottom: 1.5rem;
  margin-left: 2rem;
}

.nav-bar .socials {
  margin: 0 0.5rem;
  cursor: pointer;
}

.nav-bar .nav-bottom-row {
  font-family: 'Raleway', sans-serif,"Lohit Devanagri";
  color: var(--off-white);
  font-size: 1rem;
  display: flex;
  align-items: center;
  flex-flow: row wrap;
  position: absolute;
  width: 100%;
  left: 0;
  padding: 10px 0 16px 0;
  margin: 10px 0 0 0;
  box-sizing: border-box;
  overflow-x: hidden;
  background: var(--main-blue);
  justify-content: center;
}

.nav-bar .link {
  font-weight: bold;
  text-transform: uppercase;
  cursor: pointer;
  font-size: 0.90rem;
}

.nav-bar .link:hover {
  color: white;
}

.nav-bar .seperator {
  margin: 0 0.5rem;
}

.nav-menu {
  padding-top: 4rem;
  width: 100%;
  height: 100vh;
  position: fixed;
  top: 0;
  background-color: var(--darker-blue);
  color: white;
  z-index: 20;
}

.nav-menu .close-menu {
  position: absolute;
  top: 1rem;
  right: 1rem;
  cursor: pointer;
}

.nav-menu .menu-links {
  list-style: none;
  padding: 0;
  margin: 0;
  font-family: 'Raleway', sans-serif,"Lohit Devanagri";
  font-weight: 700;
  text-align: center;
}

.nav-menu li {
  margin: 1rem 0;
  font-size: 1.5rem;
  text-transform: uppercase;
  cursor: pointer;
}

.nav-menu .social-links {
  margin-top: 4.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.nav-menu .socials {
  margin: 0 1.5rem;
  cursor: pointer;
  transform: scaleX(1);
}

.nav-bar .nav-title {
  position: relative;
  top: 0.5rem;
  font-size: 1.3rem;
}

.nav-bar .nav-title .nav-title-span {
  position: absolute;
  font-size: 0.8rem;
  top: -0.8rem;
}

@media only screen and (min-width: 910px) {
  .nav-bar {
    height: 8rem;
    position: relative;
  }
  .nav-bar .hamburger {
    display: none;
  }
  .nav-bar .search {
    display: none;
  }
  .nav-bar h1 {
    width: 50%;
    text-align: left;
    font-size: 2.5rem;
    margin-left: 10rem;
  }
  .nav-bar .nav-title {
    margin-left: 1rem;
    top: 0.6rem;
    font-size: 2.5rem;
  }
  .nav-bar .nav-title .nav-title-span {
    font-size: 1rem;
    top: -0.5rem;
  }
  .header-title {
    margin-right: 24px;
    margin-bottom: 2.5rem;
  }
  /* .header-title.scrolled {
    margin-bottom: 1.5rem;
  } */
  /* .nav-bar.scrolled .nav-bottom-row {
    left: 1rem;
    bottom: 2px;
    background: var(--main-blue)
  } */

  .nav-bar img {
    height: 74px;
    width: 70px;
    padding: 38px 0 0 0;
    display: block;
    margin-left: 20px;
    transform: scaleX(-1);
  }

  .nav-bar img.socials {
    height: 32px;
    width: 32px;
    padding: 0;
    margin: 0 0.5rem;
    transform: scaleX(1);
  }
  .nav-bar .nav-wrapper {
    display: block;
  }
  .nav-menu {
    display: none;
  }
  /* .nav-bar.scrolled {
    height: 7rem;
  } */
  /* .nav-bar h1.scrolled {
    font-size: 1.5rem;
    margin: 0; */
  /* } */
  /* .nav-bar .nav-wrapper.scrolled {
    display: flex;
    justify-content: center;
    align-items: center;
  } */
  /* .nav-bar .nav-wrapper.scrolled .socials {
    display: none;
  }
  .nav-bar .nav-wrapper.scrolled .nav-bottom-row {
    margin: 0 -1rem;
    padding-right: 1rem;
  }
  .nav-bar .nav-wrapper.scrolled .seperator {
    margin: 0 0.2rem;
  }
  .nav-bar .nav-wrapper.scrolled .search-box-lg {
    margin-left: 0;
    margin-right: 1.2rem;
    width: 9.5rem;
  } */
}

@media only screen and (min-width: 1190px) {
  .nav-bar .socials {
    margin: 0 1.25rem;
  }
  .nav-bar .search-box-lg {
    margin-left: 1.25rem;
  }
  .nav-bar .seperator {
    margin: 0 1rem;
  }
  /* .nav-bar h1.scrolled {
    font-size: 3rem;
  }
  .nav-bar .nav-wrapper.scrolled .search-box-lg {
    width: 16rem;
  } */
}

@media only screen and (min-width: 1275px) {
  /* .nav-bar .nav-wrapper.scrolled .seperator {
    margin: 0 0.5rem;
  }
  .nav-bar .nav-wrapper.scrolled .search-box-lg {
    margin-right: 3.5rem;
    width: 18rem; */
  /* } */
}

.img {
  width: 100px;
}

@media (max-width: 912px) {
  .img {
    display: block;
    height: 50px;
    width: 47px;
    padding-top: 16px;
    transform: scaleX(-1);
  }
}