/*
Theme Name: Beostud
Text Domain: beostud.rs
Version: 1.0
Description: WordPress theme developed for business purposes.c
Author: beostud
Author URI: https://beostud.rs/
Theme URI: https://beostud.rs/
*/

/* Fonts */

@import url("https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap");

html {
  scroll-behavior: smooth;
}

body {
  background-color: #fafafa !important;
  font-family: "Ubuntu", sans-serif !important;
}

::-moz-selection {
  color: #fff;
  background-color: #ed49248c;
}

::selection {
  color: #fff;
  background-color: #ed49248c;
}

.no-wrap {
  flex-wrap: nowrap !important;
}

/* resolution end */

/* Back to top start */

#backToTop {
  width: 3rem;
  height: 3rem;
  bottom: 1.25rem;
  right: 1.875rem;
  position: fixed;
  display: none;
  z-index: 1000;
  background-color: #fff;
  color: #fff;
  border: 0 solid;
  /* border-radius: 1.875rem; */
  font-size: 1.25rem;
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.4);
  transition: 0.3s;
  display: none;
}

#backToTop:hover {
  background-color: #000;
  color: #fff;
  border: 0 solid;
  box-shadow: 0 1rem 2rem 0 #000;
  transition: 0.3s;
}

.fa.fa-arrow-up {
  display: flex;
  justify-content: center;
  align-items: center;
}
/* Back to top end */

/* Navbar start */

.navbar-brand {
  z-index: 100;
}

.navbar {
  background-color: rgba(0, 0, 0, 0.7) !important;
}

.cart-holder {
  position: relative;
}

.cart-number {
  position: absolute;
  top: -1rem;
  right: -0.5rem;
  background-color: #ED4924;
  width: 1.2rem;
  height: 1.2rem;
  border-radius: 50%;
}

.cart-number-value {
  margin: 0;
  text-align: center;
  font-size: 0.8rem;
  font-weight: 700;
}

.menu-toggle {
  background-color: transparent;
  border: 0;
  outline: 0;
  z-index: 99999;
}

.menu-toggle.collapsed .toggler-icon {
  width: 2.575rem;
  height: 0.188rem;
  background-color: #fff;
  display: block;
  transition: all 0.2s;
}

.menu-toggle.collapsed .toggler-icon.top-bar {
  width: 1.287rem;
}

.menu-toggle.collapsed .toggler-icon.bottom-bar {
  width: 1.287rem;
  margin-left: auto;
}

.menu-toggle .toggler-icon {
  width: 1.875rem;
  height: 0.188rem;
  background-color: #fff;
  display: block;
  transition: all 0.2s;
}

.middle-bar {
  margin: 0.313rem auto;
}

.menu-toggle .top-bar {
  transform: rotate(45deg);
  transform-origin: 10% 10%;
}

.menu-toggle .middle-bar {
  opacity: 0;
  filter: alpha(opacity=0);
}

.menu-toggle .bottom-bar {
  transform: rotate(-45deg);
  transform-origin: 10% 90%;
}

.menu-toggle.collapsed .top-bar {
  transform: rotate(0);
}

.menu-toggle.collapsed .middle-bar {
  opacity: 1;
  filter: alpha(opacity=100);
}

.menu-toggle.collapsed .bottom-bar {
  transform: rotate(0);
}

.menu-toggle.collapsed .toggler-icon {
  background-color: #fff;
}

.nav-item.prominently {
  background-color: #fff;
  padding: 0rem 1.3rem;
  border-radius: 5rem;
  z-index: 100;
}

.nav-item.prominently.no-z-index {
  z-index: 1;
}

.nav-item.prominently a {
  color: #000 !important;
  font-weight: 500;
}

.nav-item a {
  color: #fff !important;
  font-weight: 300;
}

.nav-link {
  color: #fff;
}

.sidebar {
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0;
  right: 0;
  width: 16.9rem;
  height: 100%;
  background-color: #000;
  padding-top: 60px;
  visibility: hidden;
  transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out, box-shadow 0.5s ease-in-out, visibility 0s 0.5s;
  transform: translateX(100%);
  opacity: 0;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0);
  z-index: 50;
}

.sidebar.show {
  visibility: visible;
  transition: transform 0.5s ease-in-out, opacity 0.5s ease-in-out, box-shadow 0.5s ease-in-out, visibility 0s;
  transform: translateX(0);
  opacity: 1;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.navbar-nav.spec {
  border: 2px solid #fff;
}
/* Navbar end */

/* Carousel section start */
.carousel-inner {
  height: 100vh;
}

.carousel-item {
  height: 100vh !important;
  background: no-repeat center center scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;

}

.carousel-item img {
  object-fit: cover;
  object-position: center;
}

.hero-border {
  position: absolute; /* Pozicioniranje unutar parenta */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); /* Centriranje */
  z-index: 10; /* Da bude iznad slika */
}

.carousel-heading {
  color: #fff;
  font-size: 3rem;
  font-weight: 500;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 1rem;
}

.carousel-text {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 300;
  text-align: center;
  margin-bottom: 1rem;
  max-width: 50%;
}

.beostud-btn {
  color: #000;
  border: 0;
  padding: 0.5rem 1.7rem;
  font-size: 1.2rem;
  font-weight: 500;
  border-radius: 5rem;
  transition: 0.3s;
  text-decoration: none !important;
}

.beostud-btn.white {
  background-color: #fff;
}

.beostud-btn.transparent {
  background-color: transparent;
  border: 0.15rem solid #fff;
  color: #fff;
}

.beostud-btn.w-70 {
  width: 70% !important;
}

.beostud-btn.w-30 {
  width: 30% !important;
}

.beostud-btn.w-45 {
  width: 45% !important;
}

.higerZ {
  z-index: 99 !important;
}
/* Carousel section end */

/* Divider section start */
.divider-section {
  background-color: #0c0c0c;
}

.divider-section-left-side {
  width: 7%;
}

.divider-section-right-side {
  width: 90%;
}

.divider-circle {
  width: 3.5rem;
  height: 3.5rem;
  background-color: transparent;
  border-radius: 50%;
  border: 0.12rem solid #fff;
}

.divider-line {
  width: 100%;
  height: 0.01rem;
  background-color: #fff;
}

.circle-number {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 500;
  text-align: center;
}
/* Divider sectuib end */

/* About and IG section start */
#aboutAndIgSection {
  background-color: #0c0c0c;
}

.heading-line {
  width: 4rem;
  height: 0.01rem;
  background-color: #fff;
}

.section-heading {
  color: #fff;
  /* font-size: 2rem; */
  font-weight: 700;
  text-align: left;
}

.sub-heading {
  color: #ced4da;
  font-size: 1.2rem;
  font-weight: 300;
  text-align: left;
  margin-bottom: 1rem;
}

.section-text {
  color: #fff;
  font-size: 1.2rem;
  font-weight: 300;
  text-align: left;
}

.ig-content-about {
  max-width: 21rem;
  margin: 0 auto;
}

.ig-content.about {
  /* background-image: url("/images/hero1.jpg"); */
  width: 10rem;
  height: 10rem;
  background-size: cover;
  background-position: center;
  border-radius: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.ig-post-link {
  text-decoration: none;
  display: inline-block;
  flex: 0 0 calc(50% - 0.75rem);
  max-width: 10rem;
}

.ig-post-link:hover .ig-content.about {
  transform: scale(1.05);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}

/* Footer IG section start */
.footer-ig-content {
  width: 100%;
  max-width: 220px;
  margin: 0;
}

.footer-ig-post-link{
  text-decoration: none;
  flex-basis: calc(50% - 0.75rem);
  max-width: calc(50% - 0.75rem);
}

.footer-ig-post-link .ig-content.about {
  width: 100%;
  height: 104px;
  background-size: cover;
  background-position: center;
  border-radius: 8px;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.footer-ig-post-link:hover .ig-content.about {
  transform: scale(1.05);
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
}
/* Footer IG section end */

.ig-content.about.one {
  background-image: url("/images/hero/hero1.jpg");
}

.ig-content.about.two {
  background-image: url("/images/hero/hero2.jpg");
}

.ig-content.about.three {
  background-image: url("/images/hero/hero3.jpg");
}

.ig-content.about.four {
  background-image: url("/images/hero/hero4.jpg");
}
/* About and IG section end */

/* Partner section start */
#partnersSection {
  background-color: #0c0c0c;
}

#portfolioSection .slider {
  height: 150px !important;
  margin: auto;
  overflow: hidden;
  position: relative;
  width: auto !important;
  display: none;
}

#portfolioSection .slider.show {
  display: block;
}

#portfolioSection .slide-track {
  animation: scroll 40s linear infinite;
  display: flex;
  width: calc(250px * 14);
  gap: 1rem;
}

#portfolioSection .slide {
  height: 100px !important;
  width: unset !important;
  /* box-shadow: rgba(255, 255, 255, 0.25) 0px 50px 100px -20px, rgba(255, 255, 255, 0.3) 0px 30px 60px -30px; */
}

.partners-holder {
  gap: 2rem;
  flex-wrap: wrap;
}

.partners-box {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: transparent;
  border-radius: 0.625rem;
  /* box-shadow: 0px 1.85185px 3.14815px 0px rgba(0, 0, 0, 0), 0px 8.14815px 6.51852px 0px rgba(0, 0, 0, 0.01),
    0px 20px 13px 0px rgba(0, 0, 0, 0.01), 0px 38.51852px 25.48148px 0px rgba(0, 0, 0, 0.01),
    0px 64.81481px 46.85185px 0px rgba(0, 0, 0, 0.02), 0px 100px 80px 0px rgba(0, 0, 0, 0.02); */
  height: 6.25rem;
  border: 0.1rem solid #fff;
}

.partners-box {
  padding: 1.5rem;
}

/* .partners-box.small-section img {
  width: 100%;
  height: 100%;
  object-fit: contain;
} */

@keyframes scroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(calc(-250px * 7));
  }
}
/* Partner section end */

/* Rental section start */
#rentalSection {
  background-color: #0c0c0c;
  padding: 4rem 1rem 3rem 1rem !important;
}

.list-group.rental {
  display: none;
}

.list-group.rental.visible {
  display: block;
}

.carousel-container {
  overflow: hidden;
  width: 100%;
  max-width: 400px; /* ili koliko hoćeš da kartica bude široka */
  margin: auto;
  position: relative;
}

.carousel-track {
  display: flex;
  transition: transform 0.4s ease;
}

.card.rental {
  min-width: 100%;
  box-sizing: border-box;
  margin-right: 0;
}

.card-slider-container {
  width: 100%;
  overflow: hidden;
  position: relative;
}

.card-slider {
  display: flex;
  transition: transform 0.5s ease;
  gap: 2rem; /* razmak između kartica */
  padding-right: 3rem; /* da se ne odseče poslednja kartica */
}

.card-slider .card {
  flex: 0 0 calc(50% - 1rem); /* 2 kartice po prikazu, oduzimamo pola od 2rem */
  box-sizing: border-box;
}

.card.rental.big-screen {
  /* background-image: url("/images/rental/rentalCard.jpg"); */
  background-size: cover;
  background-position: center;
  border-radius: 0.8rem;
  padding: 1rem;
  position: relative;
  min-width: 50%; /* 2 kartice po prikazu */
  box-sizing: border-box;
  height: 22rem;
}

.card.rental {
  /* background-image: url("/images/rental/rentalCard.jpg"); */
  background-size: cover;
  background-position: center;
  border-radius: 0.8rem;
  padding: 1rem;
  position: relative;
  box-sizing: border-box;
}

.card.rental.rental-card-1 {
  background-image: url("../images/rental/rasveta.jpg");
  /* background-position: bottom center; */
}

.card.rental.rental-card-2 {
  background-image: url("/images/rental/scena.jpg");
}

.card.rental.rental-card-3 {
  background-image: url("/images/rental/rentalCard.jpg");
}

.card.rental .card-title {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 500;
}

.card.rental .card-text {
  color: #fff;
  font-size: 1rem;
  font-weight: 300;
}

.rental-card-btn {
  text-decoration: none;
  color: #fff;
  font-weight: 500;
  font-size: 1.2rem;
  margin: 0;
}

.btn-icon-holder {
  border: 0.1rem solid #fff;
  border-radius: 0.3rem;
  padding: 0.3rem;
  margin-left: 0.7rem !important;
}

.btn-icon-holder img {
  /* transform: rotate(-90deg); */
  transition: transform 0.3s ease-in;
}

.list-group.list-group-flush.rental {
  border-radius: 0.5rem !important;
  opacity: 0;
  transition: opacity 0.5s ease-in;
  visibility: hidden;
}

.list-group.list-group-flush.rental .list-group-item {
  background-color: rgba(255, 255, 255, 0.404) !important;
  font-size: 1.1rem;
}

.list-group.list-group-flush.rental.visible {
  visibility: visible;
  opacity: 1;
}

.btn-icon-holder.next-card {
  padding: 0.5rem;
  position: absolute;
  top: 50%;
  left: 1rem;
  transform: translate(-50%, -50%);
}

.btn-icon-holder.next-card:hover {
  cursor: pointer;
}

.btn-icon-holder.next-card img {
  width: 2rem;
  height: 2rem;
}

.rental-text-holder {
  padding-left: 4rem;
}

.section-text.rental {
  max-width: 35rem;
}
/* Rental section end */

/* Portfolio section start */
#portfolioSection {
  background-color: #0c0c0c;
}

.select-portfolio {
  background-color: #000 !important;
  color: #fff !important;
  font-weight: 500;
  font-size: 1.2rem;
  border: 0;
  padding: 0.5rem 1.5rem !important;
  border-radius: 5rem !important;
}

/* Vertical animation start */
.vertical-animation {
  display: none !important;
}

.vertical-animation.show {
  display: flex !important;
}

.column {
  height: 60vh;
  overflow: hidden;
  position: relative;
}

.scroll-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  animation-duration: 10s;
  animation-iteration-count: infinite;
  animation-timing-function: linear;
}

.scroll-content img {
  width: 14rem !important;
  height: auto;
}

.left .scroll-content {
  animation-name: scroll-up;
  /* margin-left: 3rem; */
}

.middle .scroll-content {
  animation-name: scroll-down;
}

.right .scroll-content {
  animation-name: scroll-up;
  /* margin-right: 3rem; */
}

@keyframes scroll-up {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(-50%);
  }
}

@keyframes scroll-down {
  0% {
    transform: translateY(-50%);
  }
  100% {
    transform: translateY(0);
  }
}

.scroll-content img {
  width: 100%;
  height: auto;
  transition: transform 0.3s;
}

.scroll-content:hover {
  animation-play-state: paused;
  transform: scale(1.05);
}

.scroll-content img:hover {
  transform: scale(1.05);
  cursor: pointer;
}
/* Vertical animation end */

/* Horizontal animation start */
.horizontal-animation {
  display: none;
}

.horizontal-animation.show {
  display: block;
}

.slider-row {
  overflow: hidden;
  white-space: nowrap;
  position: relative;
}

.slider-track {
  display: inline-block;
  white-space: nowrap;
  animation: scroll-left 20s linear infinite;
}

.slider-row.reverse .slider-track {
  animation: scroll-right 20s linear infinite;
}

.slider-track img {
  height: 150px;
  margin-right: 1rem;
  transition: transform 0.3s ease;
  cursor: pointer;
}

.slider-track img:hover {
  transform: scale(1.05);
}

/* Animacije */
@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes scroll-right {
  0% {
    transform: translateX(-50%);
  }
  100% {
    transform: translateX(0);
  }
}

.paused {
  animation-play-state: paused !important;
}
/* Horizontal animation end */
/* Portfolio section end */

/* Contact section start */
#contactSection {
  padding: 7rem 1rem 3rem 1rem !important;
  background-color: #0c0c0c;
}

#contactSection input::placeholder {
  color: #fff !important;
}

#contactSection textarea::placeholder {
  color: #fff !important;
}

#contactSection input {
  background-color: #000 !important;
  color: #fff !important;
  font-weight: 500;
  font-size: 1.2rem;
  border: 0;
  padding: 0.5rem 1.5rem !important;
  border-radius: 5rem !important;
}

#contactSection textarea {
  background-color: #000 !important;
  color: #fff !important;
  font-weight: 500;
  font-size: 1.2rem;
  border: 0;
  padding: 0.5rem 1.5rem !important;
  border-radius: 1rem !important;
}

.question-hr {
  margin-top: 2rem;
  background-color: #a0a0a0 !important;
}

.question-box-list {
  margin: 0 auto !important;
}

.question-box-list a {
  color: #666;
  font-size: 1.125rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1.875rem;
  text-decoration: none !important;
  margin-right: 3rem;
}

.question-box-list a:hover {
  color: #c7a17a;
}

#g-map {
  width: 100%;
  height: 20rem;
}
/* Contact section end */

/* Gallery Section start */
#gallerySection {
  padding: 7rem 1rem 3rem 1rem !important;
  background-color: #0c0c0c;
}

.gallery-img {
  cursor: pointer;
  transition: transform 0.2s;
  border-radius: 1rem;
}
.gallery-img:hover {
  transform: scale(1.05);
}
.modal-fullscreen .carousel-item img {
  object-fit: contain;
  max-height: 100vh;
}
/* Gallery Section end */

/* About section start */
#aboutSection {
  padding: 7rem 1rem 3rem 1rem !important;
  background-color: #0c0c0c;
}
/* About section end */

/* Rental PAGE section start */
#rentalPageSection {
  padding: 7rem 1rem 3rem 1rem !important;
  background-color: #0c0c0c;
}

#rentalPageSection a {
  text-decoration: none;
}

#rentalPageSection a,
#rentalItemSection a {
  text-decoration: none;
}

#rentalPageSection .card.rental-card,
#rentalItemSection .card.rental-card {
  background-color: #000;
}

#rentalPageSection .card.rental-card:hover,
#rentalItemSection .card.rental-card:hover {
  cursor: pointer;
}

.rental-card-btn-holder {
  cursor: pointer;
}

#rentalPageSection .card.rental-card h1,
#rentalItemSection .card.rental-card h1 {
  color: #fff;
  font-size: 1.3rem;
  font-weight: 500;
  margin: 0;
  text-align: center;
}
/* Rental PAGE section end */

/* SubcategoryPage section start */
#subcategoryItemsSection {
  padding: 7rem 1rem 3rem 1rem !important;
  background-color: #0c0c0c;
}
/* SubcategoryPage section end */

/* Rental Item PAGE section start */
#rentalItemSection {
  padding: 7rem 1rem 3rem 1rem !important;
  background-color: #0c0c0c;
}

.rental-item-image {
  width: 90%;
  height: 90%;
  object-fit: cover;
  border-radius: 1rem;
}

.rental-item-form input {
  width: 40%;
  margin: 0 auto;
}

.rental-item-heading {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 500;
  text-align: left;
}

.rental-item-input-holder {
  position: relative;
}

.rental-item-input-holder button {
  position: absolute;
  top: 0.5rem;
  right: 7rem;
}

.rental-item-input-holder button:hover {
  cursor: pointer;
}

input[name="quantity"]::-webkit-inner-spin-button,
input[name="quantity"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[name="quantity"] {
    -moz-appearance: textfield;
}

.rental-item-input {
  background-color: #000 !important;
  color: #fff !important;
  font-weight: 500;
  font-size: 1.2rem;
  border: 0;
  padding: 0.5rem 1.5rem !important;
  border-radius: 5rem !important;
}

.bi-file-plus {
  color: #fff;
  font-size: 1.5rem;
}

/* Rental Item PAGE section end */

/* Breadcrumb component start */
.breadcrumb {
  border: 0.1rem solid #495057;
  border-radius: 0.5rem;
  padding: 0.3rem 0.5rem;
}

.breadcrumb a {
  text-decoration: none;
  color: #ced4da;
  font-size: 0.8rem;
  font-weight: 300;
}

.breadcrumb a:hover {
  color: #ED4924;
}
/* Breadcrumb component end */

/* Newsletter section start */
#newsletterSection {
  background-color: #000;
}

.news-letter-text {
  margin: 0 !important;
  font-weight: 500;
  font-size: 2rem;
  color: #fff;
  max-width: 20rem;
}

.input-holder {
  position: relative;
}

.subscribe-input {
  border: 0;
  padding: 0.9rem 1rem;
  border-radius: 5rem;
  font-size: 1rem;
  font-weight: 300;
  background-color: #0f0f0f;
  width: 20rem;
  color: #fff;
}

.subscribe-input:focus {
  outline: none !important;
  box-shadow: none !important; /* Uklanja eventualni shadow efekat */
  border: none !important;
}

.subscribe-button {
  color: #000;
  border: 0;
  padding: 0.5rem 1rem;
  font-size: 1rem;
  font-weight: 500;
  border-radius: 5rem;
  background-color: #fff;
  transition: 0.3s;
  position: absolute;
  top: 0.4rem;
  right: 0.4rem;
}
/* Newsletter section end */

/* Checkout section start */

#checkuoutSection {
  padding: 7rem 1rem 3rem 1rem !important;
  background-color: #0c0c0c;
}

#checkuoutSection label {
  color: #868e96;
  font-weight: 500;
  font-size: 1.2rem;
}

#checkuoutSection input,
#checkuoutSection textarea {
  background-color: #000 !important;
  color: #fff !important;
  font-weight: 500;
  font-size: 1.2rem;
  border: 0;
  padding: 0.5rem 1.5rem !important;
  border-radius: 5rem !important;
}

input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(100%) brightness(100%);
  cursor: pointer;
}

input[type="date"]::-webkit-calendar-picker-indicator:hover {
  filter: invert(100%) brightness(80%);
}

/* Checkout section ned */

/* Projects start */
#projectSection {
  padding: 7rem 1rem 3rem 1rem !important;
  background-color: #0c0c0c;
}

.subheading {
  font-size: 1.5rem;
  font-weight: 500;
  color: #ED4924;
}

.projects-text {
  color: #fff;
  font-size: 1.1rem;
  font-weight: 300;
  text-align: left;
  font-style: normal;
}

.projects-text .italic {
  font-style: italic;
}

.projects-text .bold {
  font-weight: 700;
}
/* Projects end */

/* Footer start */
.footer-beostud {
  background-color: #0f0f0f;
}

.footer-beostud p {
  color: #fff;
}

.footer-heading {
  color: #fff;
  font-weight: 500;
  font-size: 1.7rem;
  border-bottom: 0.15rem solid #ED4924;
  max-width: 8rem;
  padding-bottom: 0.3rem;
}

.footer-contact a {
  color: #fff;
  text-decoration: none;
}

.copy {
  background-color: #000;
  color: #fff;
}

.copy a {
  color: #ED4924;
  text-decoration: none;
}

.ig-content.footer {
  /* background-image: url("/images/hero1.jpg"); */
  width: 7rem;
  height: 7rem;
  background-size: cover;
  background-position: center;
}

.ig-content.footer.one {
  background-image: url("/images/hero/hero1.jpg");
}

.ig-content.footer.two {
  background-image: url("/images/hero/hero2.jpg");
}

.ig-content.footer.three {
  background-image: url("/images/hero/hero3.jpg");
}

.ig-content.footer.four {
  background-image: url("/images/hero/hero4.jpg");
}
/* Footer end */

/* Cart section start */
#cartSection {
  padding: 7rem 1rem 3rem 1rem !important;
  background-color: #0c0c0c;
}

.cart-text {
  color: #fff !important;
}

.cart-text-grey {
  color: #868e96;
}

#cart-alert {
  top: 5rem !important;
  right: 2rem !important;
}

.btn-close {
  background-color: #fff !important;
  color: #fff !important;
} 

.cart-section-text {
  color: #adb5bd !important;
  font-size: 1.5rem;
  font-weight: 500;
}
/* Cart section end */

/* Toast start */
#toast-container > div {
  opacity: 1 !important;
}
/* Toast end */

/* Small devices (landscape phones, 375px and up) */
@media (min-width: 320px) {
  /* Buttons */
  .beostud-btn {
    font-size: 1rem;
  }

  /* Navbar start */
  .sidebar {
    width: 100vw;
  }

  .logo {
    width: 3.5rem;
  }

  .submenu-list {
    margin-right: 0.8rem;
  }

  .submenu-item {
    margin-left: 0.7rem;
  } 

  .nav-item.prominently {
    padding: 0rem 0.5rem;
  } 

  .rentalNavTextStyle {
    font-size: 0.8rem;
  }

  /* .navbar-nav img {
    width: 1.5rem;
    height: 1.5rem;
  }
  /* Navbar end */

  /* Carousel start */
  .carousel-text {
    font-size: 1.2rem;
    max-width: 80%;
  }

  .carousel-item.active img {
    height: 100vh;
  }

  .carousel-item img {
    height: 100vh;
  }
  /* Carousel edn */

  /* Divider section start */
  .divider-section-left-side {
    width: 25%;
  }

  .divider-section-right-side {
    width: 70%;
  }

  .divider-circle {
    width: 3rem;
    height: 3rem;
  }

  .circle-number {
    font-size: 1.2rem;
  }
  /* Divider section end */

  /* About and IG section start */
  .ig-content-about {
    max-width: 9rem;
  }
  
  .ig-content.about {
    /* background-image: url("/images/hero1.jpg"); */
    width: 4rem;
    height: 4rem;
    background-size: cover;
    background-position: center;
  }
  
  .ig-post-link {
    flex: 0 0 calc(50% - 0.4rem);
    max-width: 4rem;
  }
  /* About and IG section end */

  /* Rental section start */
  .rental-text-holder {
    padding-left: 1rem;
  }

  .section-text.rental {
    max-width: 100%;
  }
  /* Rental section end */

  /* Portfolio section start */
  .scroll-content img {
    width: 10rem !important;
  }
  /* Portfolio section end */

  /* Breadcrumb component start */
  .breadcrumb {
    width: 100%;
  }

  .subscribe-input::placeholder {
    font-size: 0.9rem;
  }

  .subscribe-button {
    font-size: 0.7rem;
    top: 0.6rem;
    right: 0.5rem;
  }
  /* Breadcrumb component end */

  /* Rental cards start */
  .carousel-container {
    overflow: visible;
  }

  .carousel-track {
    display: flex;
    flex-direction: column;
  }
  /* Rental cards end */

  /* Footer start */
  .copy {
    font-size: 0.6rem;
  }

  .ig-content.footer {
    width: 3rem;
    height: 3rem;
    gap: 0.5rem;
  }
  /* Footer end */
}

/* Small devices (landscape phones, 425px and up) */
@media (min-width: 400px) {
  /* Navabr start */
  .submenu-list {
    margin-right: 1rem;
  }

  .submenu-item {
    margin-left: 1rem;
  }

  .logo {
    width: 6rem;
  }

  .nav-item.prominently {
    padding: 0rem 0.8rem;
  } 

  .rentalNavTextStyle {
    font-size: 1rem;
  }
  /* Navbar end */

  /* Divider section start */
  .divider-section-left-side {
    width: 10%;
  }

  .divider-section-right-side {
    width: 80%;
  }

  .divider-circle {
    width: 3.5rem;
    height: 3.5rem;
  }

  .circle-number {
    font-size: 1.2rem;
  }
  /* Divider section end */

  /* About and IG section start */
  .ig-content-about {
    max-width: 13rem;
  }
  
  .ig-content.about {
    /* background-image: url("/images/hero1.jpg"); */
    width: 6rem;
    height: 6rem;
    background-size: cover;
    background-position: center;
  }
  
  .ig-post-link {
    flex: 0 0 calc(50% - 0.6rem);
    max-width: 6rem;
  }
  /* About and IG section end */
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
  /* Navbar start */
  .ig-content.footer {
    width: 5rem;
    height: 5rem;
    gap: 0.5rem;
  }

  .logo {
    width: 8rem;
  }
  /* Navbar end */
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
  .navbar-nav img {
    width: 2rem;
    height: 2rem;
  }

  .nav-item.prominently {
    padding: 0rem 1.3rem;
  }

  .rentalNavTextStyle {
    font-size: 1rem;
  }

  /* Buttons */
  .beostud-btn {
    font-size: 1.2rem;
  }

  /* Carousel start */
  .carousel-text {
    font-size: 1.5rem;
    max-width: 50%;
  }
  /* Carousel end */

  /* Divider section start */
  .divider-section-left-side {
    width: 7%;
  }

  .divider-section-right-side {
    width: 90%;
  }

  .divider-circle {
    width: 3.5rem;
    height: 3.5rem;
  }

  .circle-number {
    font-size: 1.2rem;
  }
  /* Divider section end */

  /* About and IG section start */
  .ig-content-about {
    max-width: 21rem;
  }
  
  .ig-content.about {
    /* background-image: url("/images/hero1.jpg"); */
    width: 10rem;
    height: 10rem;
    background-size: cover;
    background-position: center;
  }
  
  .ig-post-link {
    flex: 0 0 calc(50% - 0.75rem);
    max-width: 10rem;
  }
  /* About and IG section end */

  /* Breadcrumb component start */
  .breadcrumb {
    width: 50%;
  }
  /* Breadcrumb component end */

  /* Rental section end */

  /* Footer start */
  .copy {
    font-size: 0.85rem;
  }

  .ig-content.footer {
    width: 7rem;
    height: 7rem;
    gap: 0.5rem;
  }

  .subscribe-input::placeholder {
    font-size: 1rem;
  }

  .subscribe-button {
    font-size: 0.7rem;
    top: 0.6rem;
    right: 0.5rem;
  }
  /* Footer end */
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
  /* Navbar start */
  .sidebar {
    width: 16.9rem;
  }
  /* Navbar end */

  /* Portfolio section start */
  .scroll-content img {
    width: 14rem !important;
  }
  /* Portfolio section end */

  /* Rental section start */
  .rental-text-holder {
    padding-left: 4rem;
  }

  .section-text.rental {
    max-width: 100%;
  }
  /* Rental section end */

  /* Rental cards start */
  .carousel-container {
    overflow: hidden;
  }

  .carousel-track {
    display: flex;
    flex-direction: row;
  }
  /* Rental cards end */
}

/* /X-Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) {
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
}

@media (min-width: 1700px) {
}

@media (min-width: 1900px) {
}

@media (min-width: 2500px) {
}