:root {
  --yellow: #fdee3d;
  --yellow-orange: #ffd662;
  --blue-dark: #000077;
  --purple: #6f42c1;
  --purple-dark: #3b1477;
  --pink-magenta: #fe1c5c;
  --orange: #f57137;
  --green-yellow: #9ae319;
  --green: #61ce70;
  --sky-blue: #02e6c6;
  --dark: #292d36;
  --dark-color: #424242;
  --orange-gradient-right: linear-gradient(340deg, #ff0566 0%, #fa7236 100%);
  --orange-gradient-left: linear-gradient(130deg, #ff0566 0%, #fa7236 100%);
  --purple-gradient: linear-gradient(117deg, #3f1084 0%, #2e036e 100%);

  --fw-light: 300;
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;

  --primary-font-family: 'DMSans', sans-serif;
  --primary-font-weight: 300;
  --bold-font-weight: 700;
}

body {
  font-family: var(--primary-font-family);
  font-weight: var(--primary-font-weight);
}

.fow-light{
  font-weight: var(--fw-light) !important;
}
.fow-regular{
  font-weight: var(--fw-regular) !important;
}
.fow-medium{
  font-weight: var(--fw-medium) !important;
}
.fow-semibold{
  font-weight: var(--fw-semibold) !important;
}
.fow-bold{
  font-weight: var(--fw-bold) !important;
}

.banner.center .container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.row {
  --bs-gutter-x: 1.5rem;
  --bs-gutter-y: 0;
  display: flex;
  flex-wrap: wrap;
  margin-top: calc(var(--bs-gutter-y) * -1);
  margin-right: calc(var(--bs-gutter-x) * -.5);
  margin-left: calc(var(--bs-gutter-x) * -.5);
}

.navbar>.container, .navbar>.container-fluid, .navbar>.container-lg, .navbar>.container-md, .navbar>.container-sm, .navbar>.container-xl, .navbar>.container-xxl {
    display: flex;
    flex-wrap: inherit;
    align-items: center;
    justify-content: space-between;
}


@media (min-width: 768px){
.d-md-none {
    display: none!important;
}}

@media only screen and (min-width: 1200px){
.container {
    max-width: 1140px !important;
    padding-right: 15px !important;
    padding-left: 15px !important;
    transition: 0.5s ease-in-out;
}}

.banner {
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}

.home-banner {
  background-color: #640cb2;
  background-image: url(../../../../uploads/2021/05/home-banner.webp);
  padding: 130px 0 70px;
}
.home-banner .banner-content{
  width: 100%;
  max-width: 800px;

}
.contact-banner {
  background-image: url(../../../../uploads/2021/05/contact-banner.webp);
  padding-top: 30px;
}
.textual-page-banner {
  background-image: url(../../../../uploads/2021/04/disclaimer_banner_bg.webp);
  padding: 45px 0 0;
}
.textual-page-banner.password {
  padding: 50px 0 40px;
}
.packages-banner {
  background-image: url(../../../../uploads/2021/04/packages-banner.webp);
  padding-top: 30px;
}
.our-work-banner {
  background-image: url(../../../../uploads/2023/12/our-portfolio-banner-bg.webp);
  padding: 30px 0 100px;
  background-position: center bottom !important;
  background-size: cover;
}
.about-us-banner {
  background-image: url(../../../../uploads/2021/04/about-banner.webp);
  background-repeat: no-repeat;
  background-position: unset;
  background-size: cover;
}
.services-banner {
  background-image: url(../../../../uploads/2021/04/services_bg.webp);
  background-repeat: repeat;
  padding: 30px 0 0 !important;
  background-position: left center;
}
.branding-banner {
  background-image: url(../../../../uploads/2021/04/banner-bg-1.webp);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 90px 0 0;
}
.logo-design-banner {
  background-image: url(../../../../uploads/2021/04/banner_bg.webp);
  background-position: top center;
  background-size: cover;
  padding: 90px 0;
}
.logo-design-banner-san-francisco {
  background-image: url(../../../../uploads/2024/04/banner.webp);
  background-position: top center;
  background-size: cover;
  padding: 90px 0;
}
.logo-design-banner-chicago {
  background-image: url(../../../../uploads/2024/04/chicago-banner.webp);
  background-position: top center;
  background-size: cover;
  padding: 90px 0;
}
.video-banner {
  background-color: transparent;
  background-image: linear-gradient(125deg, #0997ac 0, #9ee9ac 100%);
  padding: 90px 0 0;
}
.web-design-banner {
  background-image: url(../../../../uploads/2021/04/banner_bg.webp);
  background-repeat: repeat;
  background-position: bottom center;
  padding: 90px 0 40px;
}
.web-dev-banner{
  padding: 120px 0 120px;
}
.blog-banner {
  background-image: url(../../../../uploads/2021/04/blog_banner_bg_upd.webp);
  background-position: top left;
}
.contact-banner .container {
  display: flex;
  align-items: center;
  justify-content: center;
}

.banner-content .main-heading {
  color: var(--yellow);
  font-size: 50px;
  line-height: 1.1em;
  margin-bottom: 20px;
  font-weight: 600;
  letter-spacing: -1px;
}
.banner-content .sub-heading,
.single-post .banner-content .main-heading {
  font-size: 40px;
  line-height: 1.1em;
  color: #fff;
}
.banner-content p {
  font-size: 18px;
  line-height: 1.3em;
  line-height: 25px;
  margin-bottom: 30px;
}
.home-banner .banner-content p{
  width: 100%;
  max-width: 550px;
  margin: 0 auto;
}
.accordion-second .accordion-button {
  font-size: 1rem !important;
}
.button-style {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 10px;
  margin: 20px 0;
  line-height: 1;
  transition: 0.3s;
  text-align: center;
}
.button-style .button {
  font-size: 15px;
  padding: 12px 25px;
  border-radius: 30px;
  position: relative;
  font-weight: 700;
  text-transform: capitalize;
  border: 1px solid transparent;
  min-width: 150px;
}
.button-style .button.yellow {
  color: #000;
  border-color: var(--yellow);
  background-image: linear-gradient(135deg, #d0c001, #fdee3d) !important;
  font-weight: 700;
}
.button-style .button.white {
  color: var(--purple-dark);
  background-color: #fff;
  border-color: #fff;
  font-weight: 600;
}
.button-style .button.white-outline {
  color: #fff;
  background-color: transparent;
  border-color: #fff;
  font-weight: 600;
}
.button-style .button.white-outline:hover{
  color: #000;
  background-color: #fff;
}
.button-style .button.blue {
  color: #fff;
  background: var(--purple-gradient);
  border-color: var(--blue-dark);
  font-weight: 600;
}
.button-style .button.orange-gradient {
  border: 0;
  background: linear-gradient(to top, #ff0566, #fa7236);
  padding: 2px;
}
.button-style .button.orange-gradient span{
  background: linear-gradient(to bottom, #ff0566, #fa7236);
  color: #fff;
  padding: 11px 25px;
  border-radius: 50px;
  display: inline-block;
  width: 100%;
  font-weight: 600;
}
.button-style .button.orange-gradient.outline span{
  background: #fff;
}
.button-style .button.orange-gradient.outline strong{
  background: linear-gradient(to bottom, #ff0566, #fa7236);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
@media (max-width: 991px){
  .home-banner{
    padding: 90px 0 30px;
  }
}

@media (max-width: 565px){
  .home-banner {
    background-image: url(../../../../uploads/2024/05/home-banner-mobile.webp);
  }
}

@media (max-width: 400px){
  .about-us-banner {
    background-image: url(../../../../uploads/2021/04/about-banner-400x400.webp);
  }
  .services-banner {
    background-image: url(../../../../uploads/2021/04/services_bg-400x350.webp);
  }
}