@charset "utf-8";

a,
a:link,
a:visited,
a:active {
  text-decoration: none;
  color: #333333;
}
a:hover {
  color: #006699;
}
li {
  margin: 0px;
  padding: 0px;
  list-style-type: none;
}
ul {
  margin: 0px;
  padding: 0px;
}
ul.nav_items li {
  float: right;
  background-image: url(/images/seperator.gif);
  background-repeat: no-repeat;
  background-position: left top;
  height: 26px;
  padding-left: 22px;
  padding-right: 10px;
  padding-top: 8px;
  font-size: 9pt;
}

ul.nav_items_en li {
  float: left;
  background-image: url(/images/seperator.gif);
  background-repeat: no-repeat;
  background-position: right top;
  height: 26px;
  padding-left: 10px;
  padding-right: 22px;
  padding-top: 8px;
  font-size: 9pt;
}
.wrapper {
}

.header_bg {
  height: 114px;
}

.nav {
  position: relative;
  padding-right: 7px;
}
.behjoo_logo {
  text-align: right;
  width: 115px;
}
.behjoo_icon {
  height: 57px;
  width: 46px;
  margin-left: 20px;
}
.box_frame {
  width: 1000px;
  margin-right: auto;
  margin-left: auto;
  margin-top: 30px;
  margin-bottom: 20px;
  border: 1px dotted #666666;
}

.right_advertisement {
  margin-top: 80px;
  margin-bottom: 20px;
  margin-right: 10px;
}

.new_feature {
  color: #990000;
}
a.green_link {
  color: #009900;
}

.bjLOGO {
  height: 150px;
  width: 150px;
}

.registerTitle {
  font-weight: bold;
  border-bottom: 1px solid #ccc;
  padding-bottom: 10px;
  width: 30%;
  margin: 0 auto;
  text-align: center;
}

.registerForm {
  padding-top: 30px;
  clear: both;
}

.registerForm .col-lg-8 {
  margin-top: 10px;
  margin-bottom: 10px;
}

#btnRegister {
  background: #000;
  border: 2px #80ab40 solid;
  height: 30px;
  color: #fff;
  padding: 0 15px;
}

.form-control:focus {
  box-shadow: none !important;
  border-color: #ccc !important;
}

/* New style */

body {
  margin: 0px;
  padding: 0px;
  font-family: Tahoma, Arial, Helvetica, sans-serif;
  font-size: 10pt;
}

.navbar {
  background-image: url("../images/bg_support.gif");
  background-repeat: repeat-x;
  background-position: top;
  /* Set a fixed height for the navbar */
  height: 84px; /* Adjust this value as needed to match your header image height */
  border: none;
}

header img.img-fluid {
  float: right;
  height: 100%; /* This will make the image stretch to the full height of the navbar */
  /* If the image becomes distorted, you might want to set a specific height instead of 100% */
}

footer img.img-fluid {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* Add additional custom styles below */
@media (max-width: 991px) {
  /* Adjusts for Bootstrap's lg breakpoint */
  .navbar-collapse {
    background-color: rgb(156, 194, 73);
  }
}

main {
  max-width: 95%;
  margin-top: 4rem;
}

/* Targeting anchor tags inside list items of the navbar-nav class */
.navbar-nav li a {
  font-size: 0.9rem; /* Responsive font size */ /* Change this value to increase or decrease the size */
  margin: 0.25em 0.5em; /* Responsive padding */
  /* You might also want to adjust padding, margins, etc., for better alignment and spacing */
}

@font-face {
  font-family: "Nastaliq";
  src: url("../fonts/irannastaliq.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* This is the key to making it feel 'asynchronous' */
}

@font-face {
  font-family: "Shekasteh";
  src: url("../fonts/shekasteh.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* This is the key to making it feel 'asynchronous' */
}

@font-face {
  font-family: "Sols";
  src: url("../fonts/persian-sols 2 Regular.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap; /* This is the key to making it feel 'asynchronous' */
}

.navbar-nav .dropdown-menu {
  position: relative; /* This makes sure that dropdown items are positioned relative to the menu */
}

.navbar-nav .dropdown-menu .dropdown-item {
  width: auto; /* This allows the item to only be as wide as its content, up to the max width of the dropdown menu */
  max-width: 100%; /* This ensures that the item does not exceed the width of the dropdown menu */
}

.carousel-item {
  height: 500px; /* Adjust the height to your preference */
}

.carousel-item img {
  width: 100%; /* Ensure the width of the image is always 100% of the carousel item */
  height: 100%; /* Make the image height equal to the carousel item height */
  object-fit: contain; /* Cover the area of the carousel item, possibly cropping the image */
}

.carousel-indicators {
  background-color: rgba(0, 0, 0, 0.5); /* Dark background with semi-transparency */
  border-radius: 0.25rem; /* Optional: adds rounded corners for a modern look */
  padding: 5px 0; /* Adds some padding inside the background area */
  bottom: 10px; /* Adjusts the position to ensure it's not too close to the edge */
}

.carousel-control-prev,
.carousel-control-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  font-size: 20px; /* Adjust the size of the inner text icon */
  text-decoration: none; /* Remove any underline from the text */
}

.carousel-control-prev {
  left: 10px;
}

.carousel-control-next {
  right: 10px;
}

.carousel-control-prev span,
.carousel-control-next span {
  display: inline-block;
}

.carousel-caption {
  background-color: rgba(0, 0, 0, 0.5); /* Adds a semi-transparent black background */
  bottom: 11.8%; /* Adjusts the position to move it higher */
  left: 50%;
  transform: translateX(-50%); /* Centers the caption horizontally */
  padding: 10px; /* Adds some padding inside the caption */
  width: 70%; /* Sets the width of the caption area */
  text-align: center; /* Centers the text within the caption */
}

/* for Google ads */
.ad-container {
  display: flex;
  justify-content: center;
}

#ad-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 1200px;
}

#ad-div-parent {
  display: flex;
  justify-content: center;
}
