@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Abril+Fatface&display=swap");

/* Theme Styles */
body {
  font-family: "Lato", sans-serif;
  font-style: normal;
}

@media (min-width: 1400px) {
  .custom-container {
    max-width: 1600px !important; /* Custom extra extra large breakpoint width */
  }
}

.fw-extra-bold {
  font-weight: 900;
}

.text-light-grey {
  color: #717070;
}

.text-medium-grey {
  color: #555;
}

.text-dark-grey {
  color: #070216;
}

.text-dark-grey-blogs {
  color: #464646;
}

.abril-fatface {
  font-family: "Abril Fatface", serif;
  font-style: normal;
}

.text-orange {
  color: #e96d53;
}

.text-purple {
  color: #855794;
}

/* Header styles start */

#menu-primary-menu li a {
  color: #000;
  padding: 0 20px;
  font-weight: 900;
  transition: all 0.3s ease;
}

#menu-primary-menu li a:hover {
  color: #ea6d53;
}

.custom-logo {
  width: 115px;
  height: 150px;
  object-fit: cover;
  transition: width 0.3s ease, height 0.3s ease;
}

.sticky-navbar {
  position: fixed !important;
  top: 0;
  width: 100%;
  z-index: 9999;
  background-color: white !important;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
  transition: background-color 0.3s ease;
  border-bottom: 5px solid #ef8f3b;
  z-index: 9999;
}

.sticky-navbar .custom-logo {
  width: 35px;
  height: 45.5px;
}

@media screen and (max-width: 768px) {
  .custom-logo {
    width: auto;
    height: 70px;
  }
  #menu-primary-menu li a {
    color: #fff !important;
  }
  .nav-link{
    color: #fff !important;
    text-align: start !important;
  }
}

/* Mobile Navbar */
.navbar.mobile-active .mobile-custom-logo {
    transition: height 0.3s ease, width 0.3s ease;
}

/* Shrink the logo when the mobile navbar becomes sticky */
.sticky-mobile-navbar .mobile-custom-logo {
    height: 30px;
    width: auto; /* Adjust width automatically based on height */
}
.mobile-custom-logo{
height: 60px;
width: auto;
}
.sticky-mobile-navbar{
    border-bottom: 2px solid #ef8f3b;
}

.navbar{
z-index: 99;
}
/* Header styles end */

/* Home page start */
@media screen and (min-width: 900px) {
  .banner-section-home {
    padding-top: 20vh;
  }
  .banner-logo{
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    height: 880px;
    position: absolute;
    z-index: 9;
    width: 100%;
}
.liner-bar-with-content{
    top: 10vh;
}
}

@media screen and (max-width:768px) {
    .banner-section-home {
        padding-top: 20vh;
        background-position: center !important;
      }
      .banner-logo{
        background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    background-size: cover;
    position: absolute;
    z-index: 9;
    width: 100%;
    height: 90vh;
      }
      
}


.linear-bar {
  width: 80%;
  height: 100%;
  right: 0;
  opacity: 0.7;
  background: linear-gradient(90deg,#f5aa1b 0,#f5aa1d 1%,#f6aa20 0,#f5a71f 2%,#f6a822 3%,#f5a920 0,#f6a424 5%,#f2a229 7%,#f39c33 13%,#f29b32 15%,#f29935 0,#f19736 16%,#f09635 18%,#f19339 19%,#ef9437 0,#f19339 20%,#f09039 22%,#ee8d40 27%,#ef8941 30%,#ef8845 31%,#ed8747 33%,#ed8345 34%,#ed8548 0,#ec8246 35%,#ee8149 37%,#ec7f47 38%,#ed7f4a 0,#ec774c 45%,#ed774f 0,#eb734e 47%,#eb734e 48%,#ec7451 0,#e97051 49%,#ea7250 50%,#eb6d54 53%,#e96d53 60%,#e76d55 61%,#e96d55 64%,#de6a5b 76%,#dc6a5f 77%,#d36862 83%,#d46865 0,#d16864 0,#c8656a 90%,#c2656f 92%,#bf6370 94%,#be6374 95%,#ba6173 96%,#b66377 98%,#b36177 99%,#b56179 0,#b06079);
}

.project-card {
  border: 1px solid #555;
}

.project-card-title-section {
  border-top: 1px solid #555;
}

.project-card-image {
  width: auto;
  height: 296px;
}

.tab-btn {
  flex: 1;
  padding: 10px;
  border: none;
  background-color: #f6ac1a;
  cursor: pointer;
  border: 1px solid #fff;
}

.tab-btn.active {
  background-color: #ea6d53;
}

.bg-orange {
  background-color: #ea6d53;
}

.blogs-btn span {
  display: inline-block;
  width: 50%;
  /* position: absolute; */
  height: 1px;
  background: #ea3c3a;
  left: 0;
  /* top: 16px; */
  margin-bottom: 5px;
}

.bg-purple {
  background-color: #825795;
}
/* Home page end */

/* footer start */
.email-field {
  width: 90%;
}

.email-field::placeholder {
  color: #fff;
}

.subscribe-btn {
  background-color: #ea6d53;
  color: #fff;
  padding: 10px 45px;
  border: none;
}

.subscribe-btn:hover {
  border: 1px solid #ea6d53;
  background-color: transparent;
  color: #ea6d53;
}
/* footer end */

/* Blogs start */
@media screen and (min-width: 900px) {
  .blogs-listing-section {
    padding-top: 15vh;
  }
}

/* Blogs end */

/* contact us start */
.divider-line {
  width: 1px;
  height: 100%;
  position: absolute;
  background: #dcdcdc;
  right: -56px;
  top: 0;
}

@media screen and (min-width: 900px) {
  .contact-row-section {
    padding-top: 20vh;
  }
}

@media screen and (max-width: 768px) {
  .contact-row-section {
    padding-top: 13vh;
  }
}
.wpcf7 {
  margin: unset !important;
}

.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 textarea {
  background: transparent;
  border: none;
  font-size: 20px;
  padding-left: 0;
  border-bottom: 2px solid #dcdcdc !important;
  border-top: none;
  box-shadow: none;
  padding-top: 15px;
  /* padding-bottom: 15px; */
  resize: none;
  border-radius: 0% !important;
}
.wpcf7 textarea {
  height: 150px;
}
/* contact us end */

/* Vlogs login page start */
.um-link-alt {
  text-align: start !important;
}

#um-submit-btn {
  display: flex !important;
  justify-content: flex-start;
}

.um .um-form input[type="text"],
.um .um-form input[type="password"] {
  background-color: transparent !important;
  font-size: 20px !important;
  color: #555 !important;
  padding-top: 15px;
  padding-bottom: 15px;
}

#um-submit-btn {
  border-radius: 0% !important;
  background-color: #ea6d53 !important;
  padding: 10px 45px !important;
  min-width: fit-content !important;
  text-transform: uppercase !important;
}

.video-thumbnail {
  position: relative;
  cursor: pointer;
}

.play-button-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 50px;
  height: 50px;
  pointer-events: none;
}

.modal-dialog {
  max-width: 600px;
  max-height: 300px;
  margin: 30px auto;
}

.modal-content {
  background: transparent;
  border: none;
}

.modal-body {
  padding: 0;
}

/* Vlogs login page end */