@import url("https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Dela+Gothic+One&display=swap");

body {
  font-family: "Nunito", sans-serif !important;
  transition: all 0.2s ease !important;
}

/* Footer */

.fa-heart {
  color :rgb(255, 111, 92);

  margin: 0px 4px;
}

a {
  color : #ffffff!important;
  transition: all 0.2s ease !important;
}
a:hover {
  color: rgb(255, 255, 255) !important;
  text-decoration: none !important;
}

.bigfoot {
  background: rgb(19, 19, 19);
  color: white;

  font-family: "Nunito", sans-serif !important;
  font-weight: 600;
  padding: 10px 10px;
  transition: all 0.2s ease !important;
}

/* Navbar */

.navbar {
  font-family: "Nunito", sans-serif !important;
  font-weight: 600;
  padding: 10px 10px;
  background: rgb(19, 19, 19) !important;
  transition: all 0.2s ease !important;
}

.dropleft .dropdown-toggle::before {
  display: none !important;
}

#dropdown-basic {
  background-color: rgb(73, 73, 73) !important;
  border: none !important;
  padding: 0px !important;
  transition: all 0.2s ease !important;
}

#dropdown-basic:focus,
#dropdown-basic:active {
  background-color: rgb(100, 100, 100) !important;
  border: none;
  transition: all 0.2s ease !important;
}

.header_link {
  transition: all 0.3s ease;
  padding: 7px 15px !important;
  background: rgb(39, 39, 39) !important;
  margin: 5px;
  border-radius: 4px;
  transition: all 0.2s ease !important;
}

.header_link:hover {
  background-color: rgb(107, 91, 255) !important;
}

.my-4 {
  background: rgb(0, 0, 0);
  transition: all 0.2s ease !important;
}

.buy_button {
  background-color: rgb(44, 44, 44) !important;
  padding: 10px 20px !important;
  border: none !important;
  width: 100%;
  transition: all 0.2s ease !important;
}

.buy_button:hover {
  background-color: rgb(107, 91, 255) !important;
}

input {
  color: white !important;
  background: rgb(30, 30, 30) !important;
  padding: 10px 20px !important;
  border: none !important;
  height: 45px !important;
  transition: all 0.2s ease !important;
}

select {
  color: white !important;
  background: rgb(30, 30, 30) !important;
  padding: 10px 20px !important;
  border: none !important;
  height: 45px !important;
  transition: all 0.2s ease !important;
}

textarea {
  color: white !important;
  background: rgb(30, 30, 30) !important;
  padding: 10px 20px !important;
  border: none !important;
  transition: all 0.2s ease !important;
}

.dropdown-menu {
  color: white !important;
  background: rgb(50, 50, 50) !important;
  transition: all 0.2s ease !important;
}

.username_dropdown {
  background: rgba(32, 32, 31, 0.4);
  padding: 5px 20px 15px 20px;
  border-radius: 5px;
  color: white !important;
  text-align: center;
  transition: all 0.2s ease !important;
}

.username_dropdown small {
  background: rgb(95, 98, 255);
  padding: 3px 8px;
  border-radius: 4px;
  margin-top: 8px;
  font-weight: 700 !important;
  transition: all 0.2s ease !important;
}

.credits {
  color: white !important;
  text-align: center !important;
  font-weight: 600 !important;
  transition: all 0.2s ease !important;
}

.Logout_button {
  text-align: center !important;
  color: rgb(255, 89, 60) !important;
  font-weight: 700 !important;
  padding-bottom: 10px !important;
  transition: all 0.2s ease;
  transition: all 0.2s ease !important;
}

.dropdown_link:hover {
  background-color: transparent !important;
  transition: all 0.2s ease !important;
}

.Logout_button:hover {
  color: rgb(255, 255, 255) !important;
}

.form_button {
  background-color: rgb(44, 44, 44) !important;
  border: none !important;
  padding: 10px 20px !important;
  transition: all 0.2s ease !important;
}
.form_button:hover {
  background-color: rgb(50, 139, 255) !important;
}

.search-form {
  background-color: rgb(10, 10, 10) !important;
  padding: 10px 20px 1px 20px;
  border-radius: 4px;
  margin-bottom: 50px;
  transition: all 0.2s ease !important;
}

.search-form-inside {
  background-color: rgb(20, 20, 20) !important;
  padding: 4px 6px;
  border-radius: 6px;
  font-weight: 600 !important;
}

.filter-icon {
  font-size: 13px;
  padding: 5px;
  margin: 2px;
  border-radius: 3px;
  background-color: grey;
  transition: all 0.2s ease !important;
}

.searchBoxText {
  color: rgb(255, 208, 121);
  font-weight: 700;
  transition: all 0.2s ease !important;
}

.search-results {
  font-size: 15px !important;
  font-weight: 600 !important;
  padding: 10px 15px !important;
  border-radius: 20px !important;
  transition: all 0.3s ease !important;
  background: rgb(20, 20, 20) !important;
  width: 250px !important;
  margin: 1px auto !important;
  transition: all 0.2s ease !important;
}

.card {
  background: rgb(20, 20, 20) !important;
  border-radius: 6px;
  transition: all 0.2s ease !important;
}

.card-header {
  padding-bottom: 1px!important;
}

.coupon_tag {
  font-weight: 700;
  padding: 3px 6px;
  background-color: rgb(255, 150, 29);
  border-radius: 3px;
  font-size: 10px;
  position: relative;
  right: -10px;
  transition: all 0.2s ease !important;
}

.coupon_title {
  font-weight: 700;
  color: rgb(99, 161, 253);
  font-size: 22px;
  margin-top: 12px;
}

.Toastify__toast--success {
  background: #3f73ff !important;
  transition: all 0.2s ease !important;
}

.form-coupon-add {
  width: 60% !important;
  transition: all 0.2s ease !important;
}

.form-coupon-add-signup {
  width: 50% !important;
}

.form_button_coupon {
  background-color: rgb(101, 83, 255) !important;
  border: none !important;
  padding: 20px 40px !important;
  width: 100%;
  font-weight: 700 !important;
  margin-top: 20px;
  transition: all 0.2s ease !important;
}

.form_button_coupon:hover {
  background-color: rgb(116, 101, 255) !important;
}

.alert-box {
  background-color: rgb(75, 93, 255) !important ;
  border: none !important;
  color: white !important;
  font-size: 20px !important;
  width: 80% !important;
  padding: 10px 20px !important;
  margin: 20px auto !important;
  border-radius: 4px !important;
  transition: all 0.2s ease !important;

  /* display: flow-root!important; */
}

.alert-box button {
  background-color: rgb(45, 72, 190) !important;
  border: none !important;
  margin-top: 10px !important;
  transition: all 0.2s ease !important;
}
.hero-image {
  width: 90% !important;
  float: right !important;
  transition: all 0.2s ease !important;
}

.unauth-nav {
  justify-content: center !important;
  transition: all 0.2s ease !important;
}

.move-down {
  position: relative;
  top: 20px;
  transition: all 0.2s ease !important;
}

@media (min-width: 320px) and (max-width: 480px) {
  .form-coupon-add {
    width: 100% !important;
  }

  .form-coupon-add-signup {
    width: 100% !important;
  }

  .alert-box {
    width: 90% !important;
  }

  .hero-image {
    width: 100% !important;
  }

  .page-content {
    text-align: center !important;
  }
  .page-title {
    font-size: 3.5rem !important;
  }

  .hide-in-small {
    display: none;
  }

  .move-down {
    top: 4px;
  }

  .HeadLiner {
    font-size: 50px;
  }

  .foot_float_left {
    text-align: center !important;
  }
}

.submit_button,
.resend_button {
  background-color: rgb(107, 93, 235) !important;
  border: none !important;
  padding: 10px 25px !important;
  margin: 10px !important;
  font-weight: 700 !important;
  transition: all 0.2s ease !important;
}

.resend_button {
  background-color: rgb(255, 167, 66) !important;
}

.Productbadges {
  background: rgb(20, 20, 20) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.2s ease !important;
}

.Productbadges:hover {
  background: rgb(59, 95, 255) !important;
  color: rgb(255, 255, 255) !important;
}




/* Scrollbar */
body::-webkit-scrollbar {
  width: 0rem !important;
}

body::-webkit-scrollbar-track {
  background: #ececec;
}

body::-webkit-scrollbar-thumb {
  background: #929292 !important;
  border-radius: 50px;
}


::placeholder {
  color: rgb(148, 148, 148)!important;
  opacity: 1;
}

::-webkit-calendar-picker-indicator {
  filter: invert(1);
}



.input-group-append span{
  background: #242424;
  border: none;
}

.input-group-append .fa-eye {
  color: rgb(148, 148, 148);
}


button:focus, button:active {
  outline: none;
}


.bighead_container {
  margin-top:unset!important;
  max-width:100vw!important;
  padding:unset!important;
  background: url('https://media.giphy.com/media/hVbErjjtKCIHb24j4y/giphy.gif');
}

.inputs-form-segregate {
  margin-left:10px;
}

.nav-pills a {
  color: white!important;
}

.nav-item {
  border-radius: 20px!important;
  padding-left:8px;
  padding-right:8px;
}

.report_button {
  background: rgb(255, 79, 88)!important;
  font-weight: 600!important;
}

.modal-content {
  background:rgb(20, 20, 20)!important;
  border: 1px solid rgba(255,255,255, 0.05)!important;
}

.modal-title {
  color: rgb(255, 255, 255)!important;
}
.modal-header {
  border-bottom : 1px solid rgba(255,255,255, 0.05)!important;
}

.close span{
  color:rgb(241, 241, 241)!important;
  font-weight:400;
}


.nav-pills .active {
  background-color: rgb(107, 91, 255)!important;
}