* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Amiri", serif;
}
.main-margin-top-header-container {
  margin-top: 140px;
}

.message-container {
  position: relative;
}
.count-message {
  position: absolute;
  top: -6px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  height: 20px;
  width: 20px;
  border-radius: 50%;
  background-color: red;
  text-align: center;
  display: inline-block;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  color: #fff;
font-weight: 600;
}

/* في كل البيدجات ح */
/* Start Link Top Page */
/* هنا فى الاتجاه مع اللغه هتغير كلمه left بكلمه right */
.link-page-top {
  position: fixed;
  height: 60px;
  width: 60px;
  line-height: 60px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background-color: #fff;
  box-shadow: 0 0 10px 10px #eee;
  text-align: center;
  bottom: 20px;
  left: 20px;
  z-index: 10;
  cursor: pointer;
}
.icon-top {
  width: 30px;
}
/* En Link Top Page */

/* Start Header */
.main-header-container {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
  position: relative;
  margin-bottom: 10px;
}
.main-header-container .main-header-item-logo .logo-img {
  width: 50px;
  height: 30px;
}
.main-header-item-filter {
  border: 2px solid #eaa45b;
  overflow: hidden;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
}
.main-header-container .main-header-item-filter .input-search,
.main-header-container .main-header-item-filter .select-items {
  background: none;
  border: none;
  padding: 6px 10px;
  width: 280px;
  outline: none;
  font-size: 16px;
}
.main-header-container .main-header-item-filter .input-search::placeholder {
  font-size: 16px;
  font-weight: 400;
  color: #5a5a5a;
}
.input-search {
  border-right: 1px solid #eaa45b !important;
  border-left: 1px solid #eaa45b !important;
}
.btn-search {
  background-color: #eaa45b;
  color: #fff;
  border: none;
  outline: none;
  padding: 10px 26px;
  font-size: 18px;
  font-weight: 600;
}
.main-header-item-login .select-language {
  border: none;
  border-bottom: 1px solid #eaa45b;
  padding: 4px 10px 0;
  font-size: 16px;
  font-weight: 400;
  color: #eaa45b;
  outline: none;
  margin: 0 16px;
}
.btn-login {
  padding: 4px 26px;
  outline: none;
  background: none;
  border: 1px solid #eaa45b;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  font-size: 16px;
  font-weight: 500;
  color: #eaa45b;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -ms-transition: all 0.4s;
  -o-transition: all 0.4s;
}
.btn-login:hover {
  background-color: #eaa45b;
  color: #fff;
}
.navbar {
  padding: 0;
}
.nav-link {
  font-size: 20px;
  font-weight: 500;
}
.navbar-nav .nav-link.active {
  color: #eaa45b !important;
  background: none;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  border: 2px solid #eaa45b;
  padding: 2px 24px;
}
.main-login-container {
  display: inline-block;
}
.user-image {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  cursor: pointer;
}
/* هنا فى الاتجاه مع اللغه هتغير كلمه right بكلمه left */
.dropdown-logout {
  margin: 0;
  padding: 0;
  list-style: none;
  background-color: #eaa45b;
  color: #fff;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  width: 180px;
  position: absolute;
  top: 70px;
  right: 0;
  z-index: 10;
  display: none;
  transition: all 0.6s;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -ms-transition: all 0.6s;
  -o-transition: all 0.6s;
}
.logout-item {
  margin: 6px 0;
  font-size: 18px;
  padding: 8px 16px;
  display: block;
  width: 100%;
}
.logout-item:hover {
  background-color: #f0f0f042;
}
.logout-item-link {
  color: #fff;
  text-decoration: none;
  display: block;
  width: 100%;
}
.logout-item-link:hover {
  color: #fff;
}
.main-navbar-container {
  background-color: #eee;
  padding: 16px;
}
.main-header-fixed-container {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 100;
  background-color: #fff;
}
@media (max-width: 884px) {
  .navbar-nav {
    text-align: center;
    padding: 16px 0;
  }
}
/* End Header */

/* Start Footer */
.main-footer-container {
  box-shadow: 0 0 20px 20px #e7e7e767;
  padding: 50px 0 10px;
  text-align: center;
  background-color: #fff;
}
.footer-logo {
  width: 100px;
}
.footer-links {
  margin: 22px 0;
}
.footer-link-item {
  font-size: 20px;
  color: #000;
  text-decoration: none;
  margin: 0 10px;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -ms-transition: all 0.4s;
  -o-transition: all 0.4s;
}
.social-links {
  margin-bottom: 10px;
}
.link-footer-social {
  text-decoration: none;
  margin: 0 6px;
}
.social-link {
  width: 30px;
}
.bottom-footer {
  margin: 0;
  font-size: 22px;
  font-weight: 600;
  padding: 10px 0;
}
@media (max-width: 700px) {
  .footer-logo {
    width: 60px;
  }
  .footer-link-item {
    font-size: 18px;
  }
}
/* End Footer */

/* Start Home Page */
/* Start Carousel */
.main-carousel-container {
  padding: 24px 0;
}
.carousel-inner {
  border-radius: 16px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  overflow: hidden;
  height: 100% !important;
}
.image-carousel {
  width: 100% !important;
  height: 500px !important;
}
.carousel-btn-join-us {
  padding: 6px 40px;
  border: 2px solid #eaa45b;
  font-size: 16px;
  font-weight: 600;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  background: none;
  color: #eaa45b;
  transition: all 0.6s;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -ms-transition: all 0.6s;
  -o-transition: all 0.6s;
}
.carousel-btn-join-us:hover {
  background-color: #eaa45b;
  color: #fff;
}
/* End Carousel */

/* Start Broadcasts */
.main-broadcasts-container {
  padding: 50px 0;
}
.main-broadcasts-title {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 50px;
  text-align: start;
  position: relative;
}
.main-broadcasts-title::before {
  content: "";
  position: absolute;
  bottom: -2px;
  width: 80px;
  height: 3px;
  background-color: #000;
  border-radius: 16px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
}
.search-name-broadcasts,
.select-filter-broadcasts,
.select-type-broadcasts {
  display: block;
  width: 100%;
  padding: 8px 10px;
  font-size: 16px;
  outline: none;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border: 1px solid #eaa45b;
}
.select-filter-broadcasts,
.select-type-broadcasts {
  padding: 6px 10px;
}
.btn-filter-broadcasts {
  border: none;
  padding: 6px 24px;
  font-size: 16px;
  font-weight: 600;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  color: #fff;
}
.btn-search-broadcasts {
  background-color: #eaa45b;
}
.btn-save-broadcasts {
  background-color: #fd9540;
}
.btn-create-broadcasts {
  background-color: #af5001;
}
.button-filter-table-broadcasts {
  margin-top: 24px;
}
.button-filter-table-broadcasts .btn-filter-table-broadcasts {
  border: none;
  background: none;
  font-size: 18px;
  margin: 0 8px;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -ms-transition: all 0.4s;
  -o-transition: all 0.4s;
}
.button-filter-table-broadcasts .btn-filter-table-broadcasts:hover {
  border-bottom: 1px solid #eaa45b;
  color: #eaa45b;
}
.button-filter-table-broadcasts .btn-filter-table-broadcasts-active {
  border-bottom: 1px solid #eaa45b;
  color: #eaa45b;
}
.main-broadcasts-table-container {
  margin-top: 24px;
}
.link-table-item {
  text-decoration: none;
  font-size: 16px;
  color: #222;
}
.link-table-item:hover {
  color: #222;
}
.btn-load-more {
  border: none;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  background-color: #eaa45b;
  color: #fff;
  padding: 6px 50px;
  font-size: 18px;
  font-weight: 400;
}
.table-header-title {
  font-size: 20px;
}
/* End Broadcasts */

/* Start Main About */
.main-about-container {
  padding: 50px 0;
  margin: 50px 0;
  background-color: #f1f1f175;
}
.main-about-card {
  background-color: #fff;
  padding: 16px;
  border-radius: 16px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  box-shadow: 0 0 10px 10px #eee;
  height: 320px;
  max-height: 320px;
}
.about-card-image {
  width: 80px;
}
.about-card-title {
  margin: 16px 0;
  font-size: 26px;
  font-weight: 600;
  color: #eaa45b;
}
.about-card-description {
  font-size: 16px;
  color: #757575;
}
/* End Main About */

/* Start Section Card Item */
.main-section-card-items-container {
  padding: 50px 0;
}
.main-section-card-items-container .main-card-item {
  background-color: #fff;
  overflow: hidden;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  box-shadow: 0 0 10px 10px #eee;
  height: 350px;
  max-height: 350px;
  position: relative;
  margin-bottom: 16px;
}
.card-item-image-container {
  height: 315px;
  overflow: hidden;
  position: relative;
}
.main-section-card-items-container .main-card-item .image-card-item {
  width: 100%;
  height: 100%;
  transition: all 0.6s;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -ms-transition: all 0.6s;
  -o-transition: all 0.6s;
}
.main-section-card-items-container .main-card-item:hover .image-card-item {
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.card-item-details {
  transform: calc(350px - 315px);
  -webkit-transform: calc(350px - 315px);
  -moz-transform: calc(350px - 315px);
  -ms-transform: calc(350px - 315px);
  -o-transform: calc(350px - 315px);
}
.card-item-image-container .title-card-item {
  font-size: 22px;
  font-weight: 600;
  position: absolute;
  bottom: 10px;
  z-index: 10;
  color: #fff;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
}
.btn-card-item {
  display: block;
  width: 100%;
  border: none;
  background: #eaa45b;
  color: #fff;
  font-size: 18px;
  font-weight: 500;
  position: absolute;
  bottom: 0;
  padding: 6px 0;
  text-align: center;
  cursor: pointer;
}
.btn-card-item:hover {
  color: #fff;
}
/* End Section Card Item */

/* Start Product List */
.main-products-list-container {
  padding: 50px 0;
  margin: 50px 0;
  background-color: #f1f1f175;
}
.main-product-list-title {
  font-size: 32px;
  font-weight: 600;
  margin-bottom: 50px;
  text-align: center;
  position: relative;
}
.main-product-list-title::before {
  content: "";
  position: absolute;
  bottom: -2px;
  width: 100px;
  height: 3px;
  background-color: #000;
  border-radius: 16px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
}
.main-card-product {
  overflow: hidden;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  height: 400px;
  width: 95%;
  background-color: #fff;
  box-shadow: 5px 5px 10px 10px #f0f0f0;
  position: relative;
}
.main-card-product:hover .image-product {
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.card-image {
  height: 240px;
  overflow: hidden;
}
.image-product {
  height: 100%;
  transition: all 0.6s;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -ms-transition: all 0.6s;
  -o-transition: all 0.6s;
}
.card-body-item {
  padding: 16px;
  transform: calc(400px - 240px);
  -webkit-transform: calc(400px - 240px);
  -moz-transform: calc(400px - 240px);
  -ms-transform: calc(400px - 240px);
  -o-transform: calc(400px - 240px);
}
.card-title {
  font-size: 18px;
  font-weight: 600;
  color: #eaa45b;
  text-align: center;
}
.card-text {
  margin: 0;
  font-size: 16px;
}
.price-name {
  color: #122ec6;
  font-size: 18px;
}
.card-text:nth-child(3) {
  margin: 10px 0;
}
.btn-link {
  text-decoration: none;
  display: block;
  background-color: #eaa45b;
  color: #fff;
  text-align: center;
  padding: 8px 0;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  font-size: 16px;
  font-weight: 600;
  position: absolute;
  bottom: 0;
  width: 100%;
}
.btn-link:hover {
  color: #fff;
}
/* End Product List */

/* Start Section Traders opinions */
.main-traders-opinions-container {
  margin: 80px 0;
}
.main-card-traders-opinions {
  background-color: #ffe5c836;
  box-shadow: 0 0 10px 10px #eee;
  color: #222;
  overflow: hidden;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  border: 2 solid #e7e7e7;
  padding: 16px;
  width: 95%;
}
.card-image-traders-opinions {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}
.image-traders-opinions {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.card-traders-opinions-title {
  font-size: 18px;
  font-weight: 600;
  margin: 0 8px;
}
.card-text-traders-opinions {
  font-size: 16px;
}
/* End Section Traders opinions */

@media (max-width: 1024px) {
  .image-carousel {
    height: 300px !important;
  }
  .main-about-card {
    margin: 10px 0;
  }
  .about-card-description {
    font-size: 14px;
  }
  .main-card-item {
    margin: 10px 0;
  }
  .search-name-broadcasts,
  .select-filter-broadcasts,
  .select-type-broadcasts {
    margin: 6px 0;
  }
  .btn-filter-broadcasts {
    margin-top: 10px;
  }
  .link-table-item {
    font-size: 12px;
  }
  .table-header-title {
    font-size: 14px;
  }
  .btn-load-more {
    padding: 6px 24px;
    font-size: 16px;
  }
}
@media (max-width: 700px) {
  .link-table-item {
    font-size: 10px;
  }
}
@media (max-width: 375px) {
  .link-table-item {
    font-size: 8px;
  }
}
@media (max-width: 320px) {
  .link-table-item {
    font-size: 6px;
  }
}
/* End Home Page */

/* Start Packages Page */
/* Start packages pages header */
.main-header-packages-page {
  padding: 50px 0;
  text-align: center;
  background-color: #f1f1f175;
}
.Packages-title {
  font-size: 40px;
  font-weight: 600;
  color: #222;
}
.Packages-description {
  font-size: 22px;
  color: #9c9c9c;
  margin: 0;
}
.main-button-filter-packages {
  text-align: center;
}
.btn-package {
  margin: 24px 6px 0;
  background: none;
  border: 2px solid #eaa45b;
  padding: 6px 40px;
  font-size: 18px;
  font-weight: 500;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  color: #eaa45b;
}
.btn-package:hover {
  background-color: #eaa45b;
  color: #fff;
}
.package-active {
  background-color: #eaa45b;
  color: #fff;
  font-weight: 600;
}
@media (max-width: 884px) {
  .main-header-packages-page {
    margin-top: 138px;
  }
}
/* End packages pages header */

/* Start Packages Card */
.main-packages-card-container {
  padding: 50px 0;
}
.main-package-card-container {
  background-color: #fff;
  box-shadow: 0 0 10px 10px #eee;
  border-radius: 16px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
  padding: 24px 16px;
  position: relative;
  overflow: hidden;
  min-height: 660px;
  max-height: 700px;
}
.card-package-title {
  text-align: center;
  font-size: 24px;
  font-weight: 600;
  color: #b1610c;
}
.card-package-price {
  text-align: center;
  font-size: 50px;
  font-weight: 600;
  color: #eaa45b;
  border-bottom: 2px solid #eaa45b;
  padding-bottom: 6px;
  margin-bottom: 16px;
}
.list-card-package {
  list-style: none;
  padding: 0;
  padding: 10px 0;
}
.list-item-package {
  font-size: 16px;
  font-weight: 600;
  margin: 10px 0;
}
.list-throug {
  text-decoration: line-through;
}
.icon-check {
  width: 18px;
}
.list-card-title {
  color: #b1610c;
  font-size: 18px;
}
.btn-subscribe {
  display: block;
  width: 100%;
  padding: 6px 0;
  border: none;
  background-color: #eaa45b;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  text-decoration: none;
  text-align: center;
}
.btn-subscribe:hover {
  color: #fff;
}
.discount {
  font-size: 22px;
  font-weight: 400;
  text-decoration: line-through;
  color: #df9d56a8;
}
/* End Packages Card */

@media (max-width: 700px) {
  .main-package-card-container {
    margin: 10px 0;
  }
  .card-package-price {
    font-size: 30px;
  }
  .card-package-title {
    text-align: center;
    font-size: 18px;
    font-weight: 600;
    color: #b1610c;
  }
  .list-item-package {
    font-size: 14px;
    font-weight: 600;
    margin: 8px 0;
  }
  .list-card-title {
    font-size: 14px;
  }
  .btn-package {
    padding: 6px 20px;
    font-size: 16px;
  }
  .Packages-title {
    font-size: 30px;
  }
  .Packages-description {
    font-size: 16px;
  }
}
/* End Packages Page */

/* Start Product Details Page */
/* End Product Details */
.main-content-page-container {
  padding: 50px 0;
  position: relative;
}
.main-content-page-container .carousel-inner {
  height: 100% !important;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  box-shadow: 0 0 10px 10px #eee;
}
.main-content-page-container .carousel-inner .image-carousel {
  width: 100% !important;
  height: 440px !important;
}
.image-fullscreen {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  width: 100% !important;
  height: 100px !important;
  z-index: 10;
  object-fit: contain;
  cursor: zoom-out;
}
.main-product-details-container {
  box-shadow: 0 0 10px 10px #eee;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  padding: 16px;
}
.product-details-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-direction: row;
}
.product-details-header .product-header-title {
  font-size: 20px;
  font-weight: 600;
  color: #eaa45b;
}
.product-details-header .btn-follow {
  border: 1px solid #122ec6;
  color: #122ec6;
  background: none;
  font-size: 16px;
  font-weight: 600;
  padding: 6px 16px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  transition: all 0.6s;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -ms-transition: all 0.6s;
  -o-transition: all 0.6s;
}
.product-details-header .btn-follow:hover {
  background-color: #122ec6;
  color: #fff;
}
.product-details-footer {
  display: flex;
  align-items: center;
}
.product-details-footer .product-details-price {
  background-color: #eee;
  padding: 10px 24px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}
.product-details-footer .product-details-add-fav {
  background-color: #eaa45b;
  color: #fff;
  padding: 8px 24px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  font-size: 16px;
  font-weight: 600;
  border: none;
  margin: 0 14px;
}
.details-title {
  font-size: 22px;
  font-weight: 600;
  color: #122ec6;
  margin: 0;
}
.product-brand-item {
  margin: 10px 0;
  font-size: 20px;
  font-weight: 400;
}
.strong-item {
  color: #122ec6;
  font-size: 18px;
}
.product-details-description {
  font-size: 16px;
}
/* End Product Details */

/* Start Attachment */
.main-attachment-container {
  padding: 28px;
  margin: 0;
  background-color: #ffe6cb28;
  box-shadow: 0 0 10px 10px #eeeeee79;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  text-align: center;
  cursor: pointer;
}
.main-attachment-card {
  display: inline-block;
  width: 70px;
  min-height: 80px;
  max-height: fit-content;
  overflow: hidden;
  border-radius: 6px;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  -ms-border-radius: 6px;
  -o-border-radius: 6px;
  box-shadow: 0 0 10px 10px #cccccc6b;
  text-align: center;
  background-color: #fff;
  margin: 4px;
}
.image-attachment {
  width: 100%;
}
.attachment-title {
  font-size: 12px;
  margin: 0;
  color: #eaa45b;
  margin: 4px 0 0;
  line-height: 1.1;
}
/* End Attachment */

/* Start Company Info */
.main-company-info-container {
  padding: 50px 0;
  margin: 50px 0;
  background-color: #f1f1f175;
}
.company-info-title {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 24px;
  position: relative;
}
.company-info-title::before {
  content: "";
  position: absolute;
  bottom: -2px;
  width: 86px;
  height: 3px;
  background-color: #000;
  border-radius: 16px;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  -o-border-radius: 16px;
}
.company-user-info {
  box-shadow: 0 0 10px 10px #eee;
  padding: 16px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
}
.company-info-header {
  display: flex;
  align-items: center;
  margin-bottom: 16px;
}
.user-image-profile {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.user-name {
  font-size: 18px;
  font-weight: 600;
  color: #222;
  margin: 0 10px;
}
.main-details-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.main-details-list .list-company-item {
  font-size: 18px;
  margin: 10px 0;
}
.btn-trader-profile {
  display: block;
  width: 100%;
  padding: 6px 0;
  border: none;
  font-size: 18px;
  font-weight: 600;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  background-color: #eaa45b;
  color: #fff;
  margin-top: 16px;
  text-align: center;
}
.btn-trader-profile:hover {
  color: #fff;
}
.main-social-company-container {
  margin: 10px 0;
}
.main-social-company-container {
  text-align: center;
}
.social-icon-company {
  width: 24px;
  margin: 0 2px;
}
a {
  text-decoration: none;
  display: inline-block;
}
/* End Company Info */

/* Start Related Products */
.main-card-product-related {
  overflow: hidden;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  height: 450px;
  width: 95%;
  background-color: #fff;
  position: relative;
}
.main-card-product-related:hover .image-product-company {
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.card-image-company {
  height: 280px;
  overflow: hidden;
}
.image-product-company {
  height: 100%;
  transition: all 0.6s;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -ms-transition: all 0.6s;
  -o-transition: all 0.6s;
}
.card-body-item-company {
  padding: 16px;
  transform: calc(400px - 280px);
  -webkit-transform: calc(400px - 280px);
  -moz-transform: calc(400px - 280px);
  -ms-transform: calc(400px - 280px);
  -o-transform: calc(400px - 280px);
}
.card-title-company {
  font-size: 18px;
  font-weight: 600;
  color: #eaa45b;
  text-align: center;
}
.card-text-company {
  margin: 0;
  font-size: 16px;
}
.price-name-company {
  color: #122ec6;
  font-size: 18px;
}
.card-text-company:nth-child(3) {
  margin: 10px 0;
}
.btn-link-company {
  text-decoration: none;
  display: block;
  background-color: #eaa45b;
  color: #fff;
  text-align: center;
  padding: 8px 0;
  font-size: 16px;
  font-weight: 600;
  position: absolute;
  bottom: 0;
  width: 100%;
}
.btn-link-company:hover {
  color: #fff;
}
/* End Related Products */

@media (max-width: 884px) {
  .company-user-info {
    margin-bottom: 24px;
  }
}

@media (max-width: 700px) {
  .main-content-page-container {
    padding: 24px 0;
  }
  .main-content-page-container .carousel-inner .image-carousel {
    height: 300px !important;
  }
  .product-details-header {
    flex-direction: column;
  }
  .product-details-header .product-header-title {
    font-size: 18px;
    margin: 16px 0;
  }
  .product-details-header .btn-follow {
    width: 100%;
    margin-bottom: 16px;
  }
  .product-details-footer .product-details-price,
  .product-details-footer .product-details-add-fav {
    padding: 10px 16px;
    font-size: 14px;
  }
  .main-details-list .list-company-item {
    font-size: 16px;
  }
}
/* End Product Details Page */

/* Start Company Profile Page */
.main-company-profile-contact-us {
  position: fixed;
  bottom: 10px;
  right: 20px;
}
.main-contact-us-company {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: center;
}
.main-contact-us-company .company-contact-item {
  margin-bottom: 10px;
  height: 50px;
  width: 50px;
  line-height: 50px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  box-shadow: 0 0 10px 10px #eee;
}
.img-company-contact {
  width: 30px;
}
.main-company-profile-container {
  padding: 10px 0 50px;
}
.main-company-profile-overview,
.main-company-profile-capacity,
.main-company-profile-control,
.main-company-profile-employees {
  padding: 16px;
  box-shadow: 0 0 10px 10px #eee;
  background-color: #fff;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  margin-bottom: 16px;
}
.main-company-profile-links {
  margin-bottom: 16px;
  padding: 16px 0;
}
.company-profile-links {
  list-style: none;
  padding: 0;
  margin: 0;
  text-align: center;
}
.company-link-item {
  margin: 0 10px;
  display: inline-block;
}
.company-link-item .company-link {
  text-decoration: none;
  font-size: 18px;
  font-weight: 400;
  color: #222;
  transition: all 0.6s;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -ms-transition: all 0.6s;
  -o-transition: all 0.6s;
  border: 2px solid #eaa45b;
  padding: 6px 16px;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
}
.company-link-item .company-link:hover {
  background-color: #eaa45b;
  color: #fff;
}
.company-link-item .company-link-active {
  background-color: #eaa45b;
  color: #fff;
  font-weight: 600;
}
.company-profile-title {
  font-size: 22px;
  font-weight: 600;
  position: relative;
  margin-bottom: 24px;
  color: #eaa45b;
}
.company-profile-title::before {
  content: "";
  position: absolute;
  bottom: -4px;
  height: 3px;
  width: 100px;
  background-color: #eaa45b;
}
.company-overview-item {
  margin-bottom: 16px;
}
.company-overview-item-title {
  color: #222;
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}
.company-overview-item-description {
  color: #222;
  font-size: 16px;
  font-weight: 400;
  margin: 4px 0;
}
.table-light {
  margin-top: 10px;
}
.main-products-company-cards {
  margin-bottom: 16px;
  text-align: center;
}
.company-profile-card-title {
  font-size: 16px;
  margin-top: 10px;
}
.main-card-product-profile {
  width: 95%;
}
.card-image-company-profile {
  overflow: hidden;
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
}
.main-card-product-profile:hover .image-product-company-profile {
  transform: scale(1.1);
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.image-product-company-profile {
  width: 100%;
  transition: all 0.6s;
  -webkit-transition: all 0.6s;
  -moz-transition: all 0.6s;
  -ms-transition: all 0.6s;
  -o-transition: all 0.6s;
}
.main-employees-container {
  text-align: center;
}
.main-card-employees-profile {
  box-shadow: 0 0 10px 10px #eee;
  height: 200px;
  width: 200px;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  padding: 16px;
  margin: 8px 4px;
  display: inline-block;
}
.image-product-employees-profile {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.company-profile-employees-card-title {
  margin: 10px 0 4px;
  font-size: 16px;
  font-weight: 600;
  color: #eaa45b;
}
.company-profile-employees-card-job {
  font-size: 14px;
  font-weight: 600;
  margin: 0;
}
.company-profile-employees-card-social {
  list-style: none;
  padding: 0;
  margin: 0;
}
.company-profile-employees-card-social-item {
  margin: 8px 4px;
  display: inline-block;
}
.icon-employees {
  width: 20px;
}

@media (max-width: 700px) {
  .company-overview-item-title {
    font-size: 14px;
  }
  .company-overview-item-description {
    font-size: 12px;
  }
  .company-link-item {
    margin: 4px 0;
  }
}
/* End Company Profile Page */

/* Start Follows Page */
.main-follows-table-container {
  padding: 100px 0;
}
.follow-link {
  color: #222;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
  margin: 8px 0 0;
}
.follow-link:hover {
  color: #222;
}
.follow-link-btn {
  border: 1px solid #eaa45b;
  padding: 6px 24px;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  color: #eaa45b;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -ms-transition: all 0.4s;
  -o-transition: all 0.4s;
  margin: 0;
}
.follow-link-btn:hover {
  background-color: #eaa45b;
  color: #fff !important;
}
@media (max-width: 700px) {
  .table-header-follows {
    font-size: 8px;
  }
  .follow-link {
    font-size: 10px;
    font-weight: 400;
  }
  .follow-link-btn {
    padding: 2px;
    font-size: 8px;
  }
  .main-follows-table-container {
    padding: 50px 0;
  }
}
/* End Follows Page */

/* Start Products Company Filter Page */
.main-products-company-filter-container {
  padding: 80px 0;
}
.filter-products-items-title {
  font-size: 18px;
  font-weight: 600;
  margin-bottom: 16px;
  color: #eaa45b;
  position: relative;
}
.filter-products-items-title::before {
  content: "";
  position: absolute;
  bottom: -3px;
  height: 2px;
  width: 40px;
  background-color: #eaa45b;
}
.filter-products-items-list {
  outline: none;
  border: 1px solid #eaa45b;
  display: block;
  width: 100%;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  padding: 4px 8px;
  font-size: 16px;
  font-weight: 600;
  color: #222;
}
.filter-products-items-list-item:checked {
  color: #eaa45b !important;
}
.filter-products-items {
  padding: 16px 0;
  display: inline-block;
  margin: 0 8px;
  width: 22%;
}
@media (max-width: 700px) {
  .main-products-company-filter-container {
    padding: 24px 0;
  }
  .filter-products-items {
    width: 40%;
  }
  .filter-products-items-title {
    margin-bottom: 8px;
  }
  .table-header-follows {
    font-size: 8px;
  }
  .follow-link {
    font-size: 10px;
    font-weight: 400;
  }
  .follow-link-btn {
    padding: 2px;
    font-size: 8px;
  }
  .main-follows-table-container {
    padding: 50px 0;
  }
  .filter-products-items-title {
    font-size: 16px;
  }
}
@media (max-width: 360px) {
  .filter-products-items-title {
    font-size: 14px;
  }
  .filter-products-items-list {
    font-size: 12px;
  }
}
/* End Products Company Filter Page */

/* Start Contact Page Content */
.main-contact-page-container {
  padding: 80px 0;
}
.main-form-contact,
.contact-page-contact-us {
  padding: 24px;
  box-shadow: 0 0 10px 10px #eee;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.form-label {
  display: block;
  font-size: 18px;
  font-weight: 600;
  margin: 0;
}
.form-input {
  padding: 6px 10px;
  font-size: 16px;
  display: block;
  width: 100%;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border: 1px solid #eaa45b;
  margin-bottom: 16px;
  outline: none;
}
.form-input::placeholder {
  color: #afafaf;
  font-size: 14px;
}
.form-text-area {
  min-height: 200px;
  max-height: 200px;
}
.form-btn {
  border: none;
  background-color: #eaa45b;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  padding: 6px 0;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  display: block;
  width: 240px;
  margin: 0 auto;
}
.main-contact-us-title {
  font-size: 22px;
  font-weight: 600;
  position: relative;
  margin-bottom: 24px;
  color: #eaa45b;
}
.main-contact-us-title::before {
  content: "";
  position: absolute;
  bottom: -2px;
  height: 2px;
  width: 80px;
  background-color: #eaa45b;
}
.main-list-contact-us {
  list-style: none;
  padding: 0;
  margin: 0;
  border-bottom: 2px solid #f1f1f1;
}
.list-contact-us-item {
  font-size: 16px;
  margin: 16px 0;
}
.contact-us-icon {
  width: 24px;
}
.link-contact-us-item {
  text-decoration: none;
  margin: 16px 4px 0;
}
.image-contact-us-item {
  width: 30px;
}
.link-contact-us-items {
  text-align: center;
}
.map-embed {
  margin-top: 16px;
  position: relative;
  width: 100%;
  height: 284px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 0 10px 10px #eee;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
}
.map-embed iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media (max-width: 884px) {
  .main-contact-page-container {
    padding: 50px 0;
  }
  .contact-page-contact-us {
    margin-top: 16px;
  }
  .form-btn {
    width: 100%;
  }
}
/* End Contact Page Content */

/* Start Create User */
.main-create-user-container {
  padding: 50px 0;
}
.create-user-title {
  font-size: 34px;
  font-weight: 600;
  color: #eaa45b;
  text-align: center;
  margin-bottom: 24px;
}
.create-user-form-container {
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  padding: 16px;
  box-shadow: 0 0 10px 10px #eee;
}
.header-form-create-user {
  text-align: center;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-bottom: 16px;
}
.header-create-user-title {
  font-size: 18px;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
}
.steps-number {
  display: inline-block;
  height: 30px;
  width: 30px;
  line-height: 30px;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background-color: #eee;
  margin: 0 6px;
}
.step-title-active {
  color: #eaa45b;
}
.step-active {
  background-color: #eaa45b;
  color: #fff;
}
.create-user-label {
  display: block;
  font-size: 18px;
  font-weight: 600;
}
.create-user-input {
  margin-bottom: 16px;
  display: block;
  width: 100%;
  padding: 6px 16px;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  border: 2px solid #eaa45b;
  outline: none;
}
.create-user-input::placeholder {
  font-size: 14px;
  font-weight: 600;
  color: #b9b9b9;
}
.create-user-btn {
  display: inline-block;
  width: 240px;
  padding: 6px;
  border: 2px solid #eaa45b;
  background-color: #eaa45b;
  color: #fff;
  font-size: 18px;
  font-weight: 600;
  border-radius: 8px;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  -ms-border-radius: 8px;
  -o-border-radius: 8px;
  transition: all 0.4s;
  -webkit-transition: all 0.4s;
  -moz-transition: all 0.4s;
  -ms-transition: all 0.4s;
  -o-transition: all 0.4s;
}
.create-user-btn:hover {
  background-color: #bb6910;
  border: 2px solid #bb6910;
  color: #fff;
}
.form-step {
  display: none;
}
.form-step.active {
  display: block;
}
.error-message, .error {
  color: red;
  font-size: 16px;
  margin-left: 8px;
}
.create-user-input.error {
  border: 2px solid red;
}

@media (max-width: 884px) {
  .header-form-create-user {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 700px) {
  .header-create-user-title {
    font-size: 14px;
    margin: 6px 2px;
  }
  .steps-number {
    height: 20px;
    width: 20px;
    line-height: 20px;
    margin: 0 2px;
  }
  .create-user-btn {
    width: 100%;
    margin-bottom: 8px;
  }
  .create-user-label {
    font-size: 14px;
  }
}
/* End Create User */

/*Style New*/
.input-password-show{
	position: relative;
	over-flow: hidden;
}
.btn-show{
  position:absolute;
  top: 0;
  bottom:0;
  right: 0;
}
.btn-show, .btn-generate-password{
  padding: 6px;
  border: 2px solid #eaa45b;
  background-color: #eaa45b;
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  border-radius: 8px;
}
.btn-generate-password{
  padding: 4px;
  margin: 4px;
  font-size: 14px;
}
.password-flex{
	display: flex;
	align-items: center;
}
.success-step{
	text-align: center;
}
.success-text{
	font-size: 22px;
    color: cornflowerblue;
    font-weight: 600;
}
.success-description{
	font-size: 16px;
    color: crimson;
}
.btn-back-home{
	background-color: rgb(234, 164, 91);
    padding: 6px 16px;
    border-radius: 8px;
    color: #FFF;
    margin-bottom: 10px;
}
.success-image{
	width: 240px;
    height: 240px;
}
@media (max-width: 400px){
.success-text{
	font-size: 16px;
}
}