@charset "UTF-8";
/******************************
Template Name: Kile
Template Description: Kinle - Responsive eCommerce HTML Template
Template Author: Jaber Hossain Shovon
Template URL: https://hasthemes.com/

=====================
    Table Of Index:
=====================

01 - Base - Default
02 - Base - Color
03 - Base - Typhography
04 - Base - Animation

05 - Component - Button
06 - Component - Hero Slider
07 - Component - CMS
08 - Component - Banner
09 - Component - Product
10 - Component - Testimonial
11 - Component - Company Logo
12 - Component - Modal
13 - Component - Breadcrumb
14 - Component - Shop Sorting
15 - Component - Pagination
16 - Component - Sidebar Widget
17 - Component - Gallery
18 - Component - Tabstyle
19 - Component - Comment
20 - Component - Form

21 - Page - Shop
22 - Page - Product Single
23 - Page - Blog
24 - Page - Cart
25 - Page - Checkout
26 - Page - 404 
27 - Page - My Account
28 - Page - Login
29 - Page - Contact

30 - Layout - Header
31 - Layout - Mobile Menu
32 - Layout - Vertical Menu
33 - Layout - Footer
34 - Layout - Custom Layout
35 - Layout - Table
36 - Layout - Offacnvas
37 - Layout - Addcart Offacnvas
38 - Layout - Utilities
******************************/
/*****************************
01 - Base - Default
*****************************/
@import url("https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500;1,700;1,900&display=swap");
* {
  margin: 0;
  padding: 0;
  list-style: none;
  word-wrap: break-word;
}
*, *::after, *::before {
  box-sizing: border-box;
}

body {
  font-family: "Rubik", sans-serif;
  font-size: 16px;
}

dl, ol, ul {
  margin-top: 0;
  margin-bottom: 0;
}

* button {
  border: none;
  background: transparent;
  outline: none !important;
}

.no-gutters {
  margin-right: 0;
  margin-left: 0;
}

.img-responsive {
  overflow: hidden;
}
.img-responsive img {
  width: 100%;
  height: auto;
}

.border-around {
  border: 1px solid #dee2e6;
  border-radius: 3px;
}

.list-space--small li {
  margin-bottom: 10px;
}
.list-space--small li:last-child {
  margin-bottom: 0;
}
.list-space--medium li {
  margin-bottom: 20px;
}
.list-space--medium li:last-child {
  margin-bottom: 0;
}
.list-space--large li {
  margin-bottom: 30px;
}
.list-space--large li:last-child {
  margin-bottom: 0;
}

.pos-relative {
  position: relative;
}

.pos-absolute {
  position: absolute;
}

.position-sticky {
  position: sticky;
  top: 0;
  width: 100%;
}

.overflow-hidden {
  overflow: hidden;
}

.clearfix::after {
  display: block;
  content: "";
  clear: both;
}

.float-left {
  float: left;
}

.float-right {
  float: right;
}

.float-2 {
  width: 50%;
}

.float-3 {
  width: 100%;
}
@media (min-width: 576px) {
  .float-3 {
    width: 50%;
  }
}
@media (min-width: 768px) {
  .float-3 {
    width: 50%;
  }
}
@media (min-width: 992px) {
  .float-3 {
    width: 33.3333%;
  }
}

.float-4 {
  width: 100%;
}
@media (min-width: 576px) {
  .float-4 {
    width: 50%;
  }
}
@media (min-width: 768px) {
  .float-4 {
    width: 33.333%;
  }
}
@media (min-width: 992px) {
  .float-4 {
    width: 25%;
  }
}

.float-5 {
  width: 100%;
}
@media (min-width: 576px) {
  .float-5 {
    width: 50%;
  }
}
@media (min-width: 768px) {
  .float-5 {
    width: 33.333%;
  }
}
@media (min-width: 992px) {
  .float-5 {
    width: 25%;
  }
}
@media (min-width: 1200px) {
  .float-5 {
    width: 20%;
  }
}

.float-20-per {
  width: 20%;
}

.float-80-per {
  width: 80%;
}

.text-overflow-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gray-bg.p-tb-100,
.swiper-outside-arrow-hover.p-tb-100 {
  padding: 60px 0;
}
@media (min-width: 768px) {
  .gray-bg.p-tb-100,
.swiper-outside-arrow-hover.p-tb-100 {
    padding: 80px 0;
  }
}
@media (min-width: 992px) {
  .gray-bg.p-tb-100,
.swiper-outside-arrow-hover.p-tb-100 {
    padding: 100px 0;
  }
}

.gray-bg.m-t-100 {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .gray-bg.m-t-100 {
    margin-top: 80px;
  }
}
@media (min-width: 992px) {
  .gray-bg.m-t-100 {
    margin-top: 100px;
  }
}

/*****************************
02 - Base - Color
*****************************/
.gray-bg {
  background-color: #efefef;
}

.pink-bg {
  background-color: #d1008a !important;
}

.white-color {
  color: #fff !important;
}

.yellow-color {
  color: #e7b20f !important;
}

.yellow-bg {
  background-color: #e7b20f !important;
}

/*****************************
03 - Base - Typhography
*****************************/
/*...::: Title - Font Style :::...*/
.title {
  display: block;
  line-height: 1;
}
.title--large {
  font-size: 30px;
}
@media (min-width: 768px) {
  .title--large {
    font-size: 40px;
  }
}
@media (min-width: 992px) {
  .title--large {
    font-size: 50px;
  }
}
@media (min-width: 1200px) {
  .title--large {
    font-size: 60px;
  }
}
.title--normal {
  font-size: 18px;
}
@media (min-width: 768px) {
  .title--normal {
    font-size: 22px;
  }
}
@media (min-width: 992px) {
  .title--normal {
    font-size: 28px;
  }
}
@media (min-width: 1200px) {
  .title--normal {
    font-size: 36px;
  }
}
.title--small {
  font-size: 28px;
}
.title--description {
  font-size: 18px;
  margin-top: 20px;
  margin-bottom: 36px;
}
@media (min-width: 768px) {
  .title--description {
    margin-top: 30px;
    margin-bottom: 46px;
  }
}
@media (min-width: 992px) {
  .title--description {
    margin-top: 30px;
    margin-bottom: 56px;
  }
}
@media (min-width: 1200px) {
  .title--description {
    margin-top: 28px;
    margin-bottom: 62px;
  }
}
.title--thin {
  font-weight: 300;
}
.title--regular {
  font-weight: 400;
}
.title--blue {
  color: #0063d1;
}
.title--white {
  color: #fff;
}

.section-content__title {
  font-size: 20px;
  line-height: 22px;
  color: #242424;
  font-weight: 500;
  text-transform: capitalize;
}
.section-content__desc {
  margin-top: 20px;
  color: #666666;
  font-size: 14px;
}
.section-content--border {
  padding-bottom: 28px;
  border-bottom: 1px solid #ddd;
}
@media (min-width: 992px) {
  .section-content--border {
    padding-bottom: 38px;
  }
}

.block-quote {
  margin-left: 80px;
  color: #545454;
  border-left: 2px solid #0063d1;
  padding: 5px 15px;
  margin: 30px 0 30px 80px;
  text-align: justify;
  font-weight: 400;
  font-style: italic;
}

.para__text {
  margin: 20px 0 20px 0;
}
.para__text:last-child {
  margin: 20px 0 0 0;
}

/*****************************
04 - Base - Animation
*****************************/
@keyframes animate-top {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0px);
  }
}
@keyframes animate-left {
  0% {
    opacity: 0;
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0px);
  }
}
@keyframes animate-right {
  0% {
    opacity: 0;
    transform: translateX(50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0px);
  }
}
@keyframes animate-zoom {
  0% {
    opacity: 0;
    transform: scale(0.3);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes animate-zoom-blink {
  0% {
    transform: scale(1.1);
  }
  25% {
    transform: scale(0.9);
  }
  50% {
    transform: scale(1.1);
  }
  75% {
    transform: scale(0.9);
  }
  100% {
    transform: scale(1.1);
  }
}
@keyframes slideInDown {
  from {
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }
  to {
    transform: translate3d(0, 0, 0);
  }
}
/*****************************
05 - Component - Button
*****************************/
.btn {
  display: inline-block;
  font-size: 13px;
  line-height: 1;
  outline: none;
}
.btn:focus {
  box-shadow: none;
}
.btn--box {
  border-radius: 3px;
}
.btn--border-white {
  color: #fff;
  border: 2px solid #fff;
}
.btn--border-white:hover {
  background: #0063d1;
  border-color: #0063d1;
}
.btn--border-blue {
  color: #0063d1;
  border: 2px solid #0063d1;
}
.btn--border-blue:hover {
  background: #0063d1;
  border-color: #0063d1;
  color: #fff;
}
.btn--block {
  display: block;
}
.btn--submit {
  border-top-left-radius: 0px;
  border-bottom-left-radius: 0px;
  border-top-right-radius: 3px;
  border-bottom-right-radius: 3px;
}
.btn--large {
  padding: 15px 20px;
}
@media (min-width: 768px) {
  .btn--large {
    padding: 16px 25px;
  }
}
@media (min-width: 992px) {
  .btn--large {
    padding: 17px 35px;
  }
}
@media (min-width: 1200px) {
  .btn--large {
    padding: 18px 40px;
  }
}
.btn--medium {
  padding: 13px 40px;
}
.btn--small {
  padding: 13px 27px;
}
.btn--blue {
  background: #0063d1;
  color: #fff;
}
.btn--blue:hover {
  background: #333;
  color: #fff;
}
.btn--white {
  background: #fff;
  color: #545454;
}
.btn--white:hover {
  background: #0063d1;
  color: #fff;
}
.btn--gray {
  background: #eef0f1;
  color: #545454;
}
.btn--gray:hover {
  background: #0063d1;
  color: #fff;
}
.btn--uppercase {
  text-transform: uppercase;
}
.btn--weight {
  font-weight: 500;
}
.btn--hover-zoom {
  transform: scale(0.8);
  transition: all 0.3s ease;
}

button.btn--block {
  width: 100%;
}

.link--gray {
  color: #777;
  text-decoration: none !important;
}
.link--gray:hover {
  color: #0063d1;
}
.link--icon-left {
  display: inline-flex;
  align-items: center;
}
.link--icon-left i {
  margin-right: 10px;
}
.link--icon-right {
  display: inline-flex;
  align-items: center;
}
.link--icon-right i {
  margin-left: 10px;
}

.swiper-button-next::after,
.swiper-button-prev::after {
  content: "";
  display: none;
}

.swiper-outside-arrow-fix {
  width: 100%;
}

.text__nav {
  width: 75px;
  height: 35px;
  line-height: 1;
  padding: 10px 0;
}

.text-swiper-buttons {
  margin-top: 40px;
  margin-bottom: 50px;
}
@media (min-width: 768px) {
  .text-swiper-buttons {
    margin-top: 190px;
    margin-bottom: 0px;
  }
}
@media (min-width: 992px) {
  .text-swiper-buttons {
    margin-top: 170px;
    margin-bottom: 0px;
  }
}
@media (min-width: 1200px) {
  .text-swiper-buttons {
    margin-top: 150px;
    margin-bottom: 0px;
  }
}

.slider-arrow-btn-style, .inner__nav, .default__nav {
  font-size: 16px;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  z-index: 999;
  transition: all 0.3s ease;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}

.default__nav {
  background: #242424;
  border-radius: 50%;
  color: #fff;
  visibility: hidden;
  opacity: 0;
}
@media (min-width: 992px) {
  .default__nav {
    color: #333;
    font-size: 28px;
    background: transparent;
    width: 40px;
    height: 40px;
    line-height: 40px;
    line-height: normal;
  }
}
.default__nav--next {
  right: calc(0% + 10px);
}
@media (min-width: 992px) {
  .default__nav--next {
    right: calc(0% - 10px);
  }
}
.default__nav--next::after {
  content: "";
}
.default__nav--prev {
  left: calc(0% + 10px);
}
@media (min-width: 992px) {
  .default__nav--prev {
    left: calc(0% - 10px);
  }
}
.default__nav--prev::after {
  content: "";
}
.default__nav:hover {
  color: #0063d1;
}

.inner__nav {
  background: #0063d1;
  color: #fff;
}
.inner__nav--next {
  right: calc(0% + 20px);
}
.inner__nav--next::after {
  content: "";
}
.inner__nav--prev {
  left: calc(0% + 20px);
}
.inner__nav--prev::after {
  content: "";
}
.inner__nav:hover {
  color: #fff;
}

.swiper-outside-arrow-hover:hover .default__nav {
  visibility: hidden;
  opacity: 0;
}
.swiper-outside-arrow-hover:hover .default__nav--next {
  right: calc(0% + 20px);
}
@media (min-width: 992px) {
  .swiper-outside-arrow-hover:hover .default__nav--next {
    right: calc(0% - 30px);
    visibility: visible;
    opacity: 1;
  }
}
.swiper-outside-arrow-hover:hover .default__nav--prev {
  left: calc(0% + 20px);
}
@media (min-width: 992px) {
  .swiper-outside-arrow-hover:hover .default__nav--prev {
    left: calc(0% - 30px);
    visibility: visible;
    opacity: 1;
  }
}

/*****************************
06 - Component - Hero Slider
*****************************/
.hero {
  position: relative;
  overflow: hidden;
}
.hero-img {
  background-color: #0063d1;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}
.hero-img--1 {
  height: 340px;
}
@media (min-width: 768px) {
  .hero-img--1 {
    height: 380px;
  }
}
@media (min-width: 992px) {
  .hero-img--1 {
    height: 440px;
  }
}
@media (min-width: 1200px) {
  .hero-img--1 {
    height: 498px;
  }
}
.hero-img--2 {
  height: 380px;
}
.hero-img.swiper-slide-active .hero__content .title:nth-child(1) {
  animation: animate-top 0.5s linear 0.2s backwards;
}
.hero-img.swiper-slide-active .hero__content .title:nth-child(2) {
  animation: animate-left 0.5s linear 1s backwards;
}
.hero-img.swiper-slide-active .hero__content .title:nth-child(3) {
  animation: animate-right 0.5s linear 2s backwards;
}
.hero-img.swiper-slide-active .hero__content .btn {
  animation: animate-zoom 0.5s linear 3s backwards;
}
.hero-img.swiper-slide-active .hero__content .btn:hover {
  color: #fff;
}
.hero__content {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
}
.hero__nav {
  color: #e1e1e1;
  font-size: 28px;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s;
}
.hero__nav--next {
  right: calc(0% - 10px);
}
.hero__nav--next::after {
  content: "";
}
.hero__nav--prev {
  left: calc(0% - 10px);
}
.hero__nav--prev::after {
  content: "";
}
.hero:hover .hero__nav {
  visibility: hidden;
  opacity: 0;
}
@media (min-width: 992px) {
  .hero:hover .hero__nav {
    visibility: visible;
    opacity: 1;
  }
}
.hero:hover .hero__nav--next {
  right: calc(0% + 10px);
}
.hero:hover .hero__nav--prev {
  left: calc(0% + 10px);
}
.hero__dots {
  width: 100%;
}
.hero__dots.swiper-pagination {
  text-align: center;
}
.hero__dots.swiper-pagination-bullets {
  bottom: 20px;
}
.hero__dots--2.swiper-pagination {
  text-align: left !important;
  margin-left: 25px;
}
.hero__dots .swiper-pagination-bullet {
  width: 12px !important;
  height: 12px !important;
  margin: 0 4px;
  outline: none;
  opacity: 1;
  background: #e0e0e0;
}
.hero__dots .swiper-pagination-bullet-active {
  background: #0063d1;
}

/*****************************
07 - Component - CMS
*****************************/
.cms--1 {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .cms--1 {
    margin-top: 80px;
  }
}
@media (min-width: 992px) {
  .cms--1 {
    margin-top: 100px;
  }
}
.cms.p-t-100 {
  padding-top: 60px;
}
@media (min-width: 768px) {
  .cms.p-t-100 {
    padding-top: 80px;
  }
}
@media (min-width: 992px) {
  .cms.p-t-100 {
    padding-top: 100px;
  }
}
.cms .col-12 > .cms__content {
  margin-bottom: 30px;
}
@media (min-width: 768px) {
  .cms .col-12 > .cms__content {
    margin-bottom: 0px;
  }
}
.cms .col-12:last-child > .cms__content {
  margin-bottom: 0;
}
.cms__content {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
@media (min-width: 768px) {
  .cms__content {
    margin-bottom: 0px;
  }
}
@media (min-width: 992px) {
  .cms__content {
    align-items: flex-start;
    margin-bottom: 0px;
    flex-direction: row;
    text-align: left;
  }
}
.cms__icon {
  margin-right: 0;
  margin-bottom: 15px;
}
@media (min-width: 992px) {
  .cms__icon {
    margin-right: 20px;
  }
}
@media (min-width: 992px) {
  .cms__icon {
    margin-bottom: 0px;
  }
}
.cms__title {
  color: #242424;
  font-size: 14px;
  font-weight: 500;
  text-transform: capitalize;
  margin-bottom: 0;
}
.cms__des {
  line-height: 23px;
  color: #666666;
  font-size: 13px;
  margin: 0;
}
.cms__content:hover .cms__icon {
  animation: animate-zoom-blink 1.5s infinite linear;
}

/*****************************
08 - Component - Banner
*****************************/
.banner--1 {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .banner--1 {
    margin-top: 80px;
  }
}
@media (min-width: 992px) {
  .banner--1 {
    margin-top: 100px;
  }
}
.banner--2 {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .banner--2 {
    margin-top: 80px;
  }
}
@media (min-width: 992px) {
  .banner--2 {
    margin-top: 0;
  }
}
.banner--2 .row .col-12 {
  margin-top: 30px;
}
.banner--2 .row .col-12:first-child {
  margin-top: 0;
}
.banner .col-12 > .banner__box {
  margin-bottom: 30px;
}
@media (min-width: 768px) {
  .banner .col-12 > .banner__box {
    margin-bottom: 0px;
  }
}
.banner .col-12:last-child > .banner__box {
  margin-bottom: 0;
}
.banner__box {
  width: 100%;
  overflow: hidden;
  border-radius: 3px;
}
.banner__link {
  display: block;
}
.banner__link::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  opacity: 0;
  background: rgba(255, 255, 255, 0.2);
  width: 100%;
  height: 100%;
  transform: scale(0.7);
  transition: all 0.5s ease;
}
.banner__link:hover::after {
  transform: scale(1);
  opacity: 1;
}
.banner__img {
  width: 100%;
  object-fit: cover;
  transform: scale(1);
  transition: all 1s ease;
}
.banner__box:hover .banner__img {
  transform: scale(1.1);
}

/*****************************
09 - Component - Product
*****************************/
.product--1 {
  margin-top: 57px;
}
@media (min-width: 768px) {
  .product--1 {
    margin-top: 76px;
  }
}
@media (min-width: 992px) {
  .product--1 {
    margin-top: 96px;
  }
}
.product .swiper-outside-arrow-fix .m-t-50 {
  margin-top: 40px;
}
@media (min-width: 992px) {
  .product .swiper-outside-arrow-fix .m-t-50 {
    margin-top: 50px;
  }
}
.product__box {
  background-color: #fff;
  transition: all 0.3s ease;
  padding: 15px;
}
.product__box--lg-hr {
  padding: 30px 20px;
}
.product__box--lg-vr {
  padding: 30px 20px;
}
.product__box--md {
  padding: 16px 15px;
  margin-top: 30px;
  text-align: center;
}
@media (min-width: 768px) {
  .product__box--md {
    text-align: left;
  }
}
@media (min-width: 992px) {
  .product__box--md {
    margin-top: 0;
  }
}
.product__box--border {
  border-radius: 3px;
  border: 1px solid #ebebeb;
}
.product__box--border:hover {
  border: 1px solid #0063d1;
}
.product__box--border-hover {
  border-radius: 3px;
  border: 2px solid transparent;
}
.product__box--border-hover:hover {
  border: 2px solid #ebebeb;
}
.product__box .btn--hover-zoom {
  visibility: hidden;
  opacity: 0;
}
.product__box:hover .btn--hover-zoom {
  visibility: visible;
  opacity: 1;
  transform: scale(1);
}
.product__img-box {
  overflow: hidden;
  position: relative;
}
.product__img--link {
  display: block;
}
.product__img {
  max-width: 100%;
}
.product__tag {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  text-align: center;
  line-height: 40px;
  color: #fff;
  border-radius: 50%;
  font-size: 13px;
}
.product__tag--new {
  background: #0063d1;
}
.product__tag--discount {
  background: #62ab00;
}
.product__wishlist-icon {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 40px;
  height: 40px;
  line-height: 40px;
  color: #0063d1;
  text-decoration: none !important;
  visibility: hidden;
  opacity: 0;
  transition: all 0.3s ease;
  transform: scale(0.8);
}
.product__box:hover .product__wishlist-icon {
  visibility: visible;
  opacity: 1;
  transform: scale(1);
}
.product__counter-box {
  width: 100%;
  position: absolute;
  bottom: 0;
  right: 0;
  left: 0;
  text-align: center;
  background-color: rgba(0, 99, 209, 0.95);
  color: #fff;
  border-radius: 3px;
  font-weight: 500;
  height: 55px;
}
.product__counter-item {
  position: absolute;
  width: 100%;
  display: flex;
  justify-content: space-evenly;
  top: 50%;
  transform: translateY(-50%);
}
.product__counter-item p {
  font-size: 13px;
  font-weight: 400;
  text-transform: uppercase;
  margin-bottom: 0;
}
.product__upper-btn {
  position: absolute;
  text-align: center;
  left: auto;
  right: 0;
  top: 75%;
  width: 100%;
}
.product__price-del {
  font-size: 14px;
  color: #a4a4a4;
  font-weight: 400;
  text-decoration: line-through;
  margin-right: 5px;
}
.product__price-reg {
  font-size: 16px;
  font-weight: 500;
  color: #0063d1;
}
.product__link {
  display: block;
  overflow: hidden;
  color: #242424;
  font-size: 14px;
  line-height: 24px;
}
.product__link--weight-regular {
  font-weight: 500;
}
.product__link--weight-light {
  font-weight: 400;
}
.product__link:hover {
  color: #0063d1;
  text-decoration: none;
}
.product__link--underline:hover {
  text-decoration: underline;
}
.product__desc {
  font-size: 14px;
  color: #777777;
  line-height: 24px;
}
.product__review {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
}
.product__review li {
  margin-right: 2px;
}
.product__review li:last-child {
  margin-right: 0px;
}
.product__review--fill {
  color: #0063d1;
}
.product__review--blank {
  color: #333;
}
.product-tablist .nav-link, .product__extra-nav .nav-link {
  color: #242424;
}
.product-tablist .nav-link.active, .product-tablist .nav-link:hover, .product__extra-nav .nav-link.active, .product__extra-nav .nav-link:hover {
  color: #0063d1;
}
.product-tablist--style-title li {
  position: relative;
}
.product-tablist--style-title li::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  height: 15px;
  width: 0px;
  background: #777;
}
@media (min-width: 768px) {
  .product-tablist--style-title li::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    height: 15px;
    width: 1px;
    background: #777;
  }
  .product-tablist--style-title li:first-child::after {
    display: none;
  }
}
.product-tablist--style-title .nav-link {
  font-size: 20px;
  line-height: 22px;
  font-weight: 500;
  text-transform: capitalize;
  color: #777;
}
.product-tablist--style-title .nav-link.active, .product-tablist--style-title .nav-link:hover {
  color: #000;
}

/*****************************
10 - Component - Testimonial
*****************************/
.testimonial {
  padding-bottom: 65px;
}
.testimonial__desc {
  margin-bottom: 18px;
}
.testimonial__desc p {
  font-size: 14px;
  line-height: 25px;
  color: #242424;
}
.testimonial__info--user {
  font-size: 14px;
  color: #0063d1;
  line-height: 25px;
  font-weight: 700;
  text-transform: capitalize;
  margin: 0;
}
.testimonial__info--user::after {
  content: "-";
}
.testimonial__info--email {
  font-size: 13px;
  color: #444444;
  font-weight: 400;
  line-height: 20px;
  margin: 0;
}

/*****************************
11 - Component - Company Logo
*****************************/
.company-logo--2 {
  border-top: 1px solid #dee2e6;
  margin-top: 20px;
}
@media (min-width: 768px) {
  .company-logo--2 {
    margin-top: 40px;
  }
}
@media (min-width: 992px) {
  .company-logo--2 {
    margin-top: 60px;
  }
}
.company-logo__item {
  overflow: hidden;
  text-align: center;
}
.company-logo__link {
  display: block;
  margin-bottom: 30px;
}
.company-logo__link:last-child {
  margin-bottom: 0;
}
.company-logo__img {
  max-width: 100%;
  height: auto;
  transition: all 0.3s ease;
}
.company-logo__img:hover {
  transform: scale(1.05);
}

/*****************************
12 - Component - Modal
*****************************/
.modal {
  padding-right: 0 !important;
}
.modal-product-image--large {
  margin-bottom: 20px;
}
.modal-dialog {
  max-width: calc(100% - 20px) !important;
  margin: 0 auto !important;
}
@media (min-width: 992px) {
  .modal-dialog {
    max-width: 800px !important;
  }
}
@media (min-width: 1200px) {
  .modal-dialog {
    min-width: 1140px !important;
  }
}
.modal-header {
  align-items: center;
  justify-content: space-between;
  padding: 15px;
  background: #0063d1;
  color: #fff;
}
@media (min-width: 992px) {
  .modal-header {
    padding: 0;
  }
}
.modal-header .close {
  margin: 0 !important;
  color: #fff;
}
.modal-title {
  text-align: center;
  margin: 0 auto;
}
.modal__border {
  border-left: none;
}
@media (min-width: 992px) {
  .modal__border {
    border-left: 1px solid #ddd;
  }
}
.modal__product-img {
  text-align: center;
}
.modal__product-title {
  margin-top: 25px;
}
@media (min-width: 768px) {
  .modal__product-title {
    margin-top: 0px;
  }
}
.modal__product-title, .modal__product-price {
  display: block;
  font-weight: 500;
}
.modal__product-info, .modal__product-shipping-info {
  font-weight: 500;
}
.modal__product-info span, .modal__product-shipping-info span {
  font-weight: 300;
  padding-left: 5px;
}
.modal__product-cart-buttons {
  display: flex;
  flex-direction: column;
}
.modal__product-cart-buttons a {
  margin-bottom: 15px;
}
.modal__product-cart-buttons a:last-child {
  margin-bottom: 0;
}
@media (min-width: 768px) {
  .modal__product-cart-buttons {
    flex-direction: row;
  }
  .modal__product-cart-buttons a {
    margin-bottom: 0;
    margin-right: 30px;
  }
  .modal__product-cart-buttons a:last-child {
    margin-right: 0;
  }
}

/*****************************
13 - Component - Breadcrumb
*****************************/
.page-breadcrumb {
  background: #efefef;
  padding: 35px 0;
  margin-bottom: 60px;
}
@media (min-width: 992px) {
  .page-breadcrumb {
    padding: 55px 0;
  }
}
@media (min-width: 768px) {
  .page-breadcrumb {
    margin-bottom: 80px;
  }
}
@media (min-width: 992px) {
  .page-breadcrumb {
    margin-bottom: 100px;
  }
}
.page-breadcrumb__menu {
  font-size: 16px;
  color: #333;
}
.page-breadcrumb__nav {
  display: inline-block;
  margin-right: 10px;
  position: relative;
}
.page-breadcrumb__nav::after {
  content: ">";
  padding-left: 10px;
}
.page-breadcrumb__nav:last-child::after {
  content: "";
}
.page-breadcrumb__nav a {
  color: #0063d1;
  text-decoration: none;
}
.page-breadcrumb__nav a:hover {
  color: #0063d1;
}
.page-breadcrumb__nav.active {
  color: #333;
}

/*****************************
14 - Component - Shop Sorting
*****************************/
.sort-box {
  border: 1px solid #dee2e6;
  padding: 20px;
  border-radius: 3px;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  font-size: 13px;
  flex-direction: column;
}
@media (min-width: 768px) {
  .sort-box {
    flex-direction: row;
    align-items: center;
  }
}
.sort-box__left, .sort-box__right {
  display: flex;
  align-items: center;
}
.sort-box__left span, .sort-box__right span {
  display: inline-block;
}
.sort-box__left {
  margin-bottom: 20px;
}
.sort-box__left span {
  margin-left: 55px;
}
@media (min-width: 768px) {
  .sort-box__left {
    margin-bottom: 0;
  }
}
.sort-box__right span {
  margin-right: 20px;
}
.sort-box__tab-list li {
  margin-right: 15px;
  display: inline-block;
}
.sort-box__tab-list li:last-child {
  margin-right: 0;
}

.sort-nav-link {
  display: block;
  font-size: 18px;
  text-decoration: none !important;
  color: #333;
}
.sort-nav-link.active {
  color: #0063d1;
}

.select-sort {
  padding: 5px 100px 5px 15px;
  border-radius: 3px;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.select-sort option {
  text-align: right;
  border: 1px solid #dee2e6;
  padding: 5px 15px;
}
.select-sort__arrow {
  position: relative;
  margin-bottom: 0;
}
.select-sort__arrow::after {
  content: "";
  position: absolute;
  font-family: "Font Awesome 5 Free";
  font-weight: 600;
  top: 50%;
  transform: translateY(-50%);
  right: 25px;
}

.tab-pane > .product__box--default {
  transform: scale(0.3);
  transition: all 0.3s ease;
}

.tab-pane.active > .product__box--default {
  transform: scale(1);
}

.tab-pane > .product__box--list {
  transform: translateX(100px);
  transition: all 0.5s ease;
}

.tab-pane.active > .product__box--list {
  transform: translateX(0);
}

.product__box--list .product__img {
  margin: 0 auto;
  text-align: center;
  display: block;
}

/*****************************
15 - Component - Pagination
*****************************/
.page-pagination {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 20px;
  border: 1px solid #dee2e6;
  border-radius: 3px;
  font-size: 14px;
  flex-direction: column;
  margin-top: 60px;
}
@media (min-width: 768px) {
  .page-pagination {
    margin-top: 80px;
    flex-direction: row;
    align-items: center;
  }
}
@media (min-width: 992px) {
  .page-pagination {
    margin-top: 100px;
  }
}
.page-pagination__list {
  margin-top: 20px;
}
@media (min-width: 768px) {
  .page-pagination__list {
    margin-top: 0;
  }
}
.page-pagination__item {
  display: inline-block;
  margin-right: 5px;
}
.page-pagination__item:last-child {
  margin-right: 0;
}
.page-pagination__link {
  font-weight: 500;
}
.page-pagination__link.active {
  background: #0063d1;
  color: #fff;
}

/*****************************
16 - Component - Sidebar Widget
*****************************/
.sidebar {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .sidebar {
    margin-top: 80px;
  }
}
@media (min-width: 992px) {
  .sidebar {
    margin-top: 0px;
  }
}
.sidebar__widget {
  padding: 20px;
  border: 1px solid #dee2e6;
  border-radius: 3px;
  margin-bottom: 40px;
}
.sidebar__widget:last-child {
  margin-bottom: 0;
}
.sidebar__box {
  position: relative;
}
.sidebar__box::after {
  position: absolute;
  content: "";
  width: 100%;
  height: 1px;
  background-color: #dee2e6;
  bottom: -20px;
  left: 0;
}
.sidebar__title {
  font-size: 18px;
  margin-bottom: 40px;
  text-transform: uppercase;
}
.sidebar__menu-collapse-list:last-child .accordion__title {
  margin-bottom: 0;
}
.sidebar__post-img {
  width: 40%;
}
.sidebar__post-content {
  width: 60%;
  margin-left: 10px;
}
.sidebar__post-content a {
  font-size: 14px;
  word-wrap: break-word;
  font-weight: 500;
}
.sidebar__post-content span {
  font-size: 13px;
}
.sidebar__tag li {
  display: inline-block;
  margin-right: 5px;
}

.accordion__title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}
.accordion__category-list li {
  padding: 5px;
  display: block;
}
.accordion a {
  text-decoration: none !important;
  color: #000;
}
.accordion a:hover {
  color: #0063d1;
}

/*****************************
17 - Component - Gallery
*****************************/
.product-gallery-box__vertical {
  display: flex;
  align-items: center;
}
.product-gallery-box__tab-left {
  flex-direction: row-reverse;
}
.product-gallery-box .swiper-slide {
  height: 100% !important;
}

.gallery--right {
  width: 80%;
}
.gallery--left {
  width: 20%;
}

.product-image--large .img-fluid {
  max-width: 100% !important;
}
.product-image--gallery .img-responsive {
  margin: 10px;
}

/*set a border on the images to prevent shifting*/
#gallery-zoom img {
  border: 2px solid #dee2e6;
}

/*Change the colour*/
.zoom-active img {
  border: 2px solid #0063d1 !important;
}

.modal-product-image--thumb img,
.product-image--thumb img {
  cursor: pointer;
  border: 1px solid #dee2e6;
}
.modal-product-image--thumb .swiper-slide-thumb-active img,
.product-image--thumb .swiper-slide-thumb-active img {
  border: 1px solid #0063d1;
}

.gallery__nav {
  text-align: center;
  top: 50%;
  color: #0063d1;
  font-size: 30px;
  outline: none;
}
.gallery__nav--next {
  right: 0px !important;
}
.gallery__nav--prev {
  left: 0px !important;
}

.text-reference {
  font-size: 14px;
  color: #777;
}

.product-var {
  border-top: 1px solid #dee2e6;
  border-bottom: 1px solid #dee2e6;
}
.product-var__item {
  margin-bottom: 30px;
}
.product-var__text {
  display: block;
  margin-bottom: 9px;
  font-weight: 500;
}

.product-social {
  display: flex;
  align-items: center;
}
.product-social span {
  color: #777;
  margin-right: 20px;
  display: inline-block;
  font-size: 16px;
}
.product-social-link li {
  display: inline-block;
  margin-right: 10px;
}
.product-social-link li:last-child {
  margin-right: 0;
}
.product-social-link li:nth-child(1) a:hover {
  background: #3c5b9b;
}
.product-social-link li:nth-child(2) a:hover {
  background: #40c1df;
}
.product-social-link li:nth-child(3) a:hover {
  background: #eb8314;
}
.product-social-link li:nth-child(4) a:hover {
  background: #ed3c32;
}
.product-social-link a {
  color: #777;
  width: 40px;
  height: 40px;
  display: block;
  border: 1px solid #777;
  text-align: center;
  line-height: 40px;
  border-radius: 50%;
  transition: all 0.3s ease;
}
.product-social-link a:hover {
  color: #fff;
  border: 1px solid transparent;
}

/*****************************
18 - Component - Tabstyle
*****************************/
.tablist li {
  position: relative;
}
.tablist .nav-link {
  padding: 0.5rem 0 !important;
}
.tablist--style-black .nav-link {
  color: #545454;
}
.tablist--style-black .nav-link.active, .tablist--style-black .nav-link:hover {
  color: #000;
}
.tablist--style-blue .nav-link {
  color: #545454;
}
.tablist--style-blue .nav-link.active, .tablist--style-blue .nav-link:hover {
  color: #0063d1;
}
.tablist--style-title li > .nav-link {
  font-size: 20px;
  line-height: 22px;
  font-weight: 500;
  text-transform: capitalize;
}
.tablist--style-seperator li::after {
  position: absolute;
  content: "";
  width: 1px;
  height: 15px;
  background: #dee2e6;
  top: 50%;
  transform: translateY(-50%);
  left: calc(100% - 35px);
}
.tablist--style-seperator li:last-child::after {
  display: none;
}
.tablist--style-gap li:last-child > .nav-link {
  margin-right: 0;
}
.tablist--style-gap-20 li > .nav-link {
  margin-right: 20px;
}
.tablist--style-gap-30 li > .nav-link {
  margin-right: 30px;
}
.tablist--style-gap-70 li > .nav-link {
  margin-right: 70px;
}

.tab-content .tab-pane {
  display: block;
  height: 0;
  max-width: 100%;
  visibility: hidden;
  overflow: hidden;
  opacity: 0;
}

.tab-content .tab-pane.active {
  height: auto;
  visibility: visible;
  opacity: 1;
  overflow: visible;
}

.tab-animate-zoom .tab-pane {
  transform: translateY(-100px) scale(0.5);
  transition: all 0.5s ease;
}

.tab-animate-zoom .tab-pane.active {
  transform: translateY(0) scale(1);
}

/*****************************
19 - Component - Comment
*****************************/
.comment {
  padding: 0;
}
@media (min-width: 768px) {
  .comment {
    padding: 0px 20px 20px 20px;
  }
}
.comment__list {
  border-bottom: 1px solid #dee2e6;
  padding-top: 20px;
  padding-bottom: 15px;
}
.comment__list:last-child {
  border-bottom: none;
}
.comment__list:first-child {
  padding-top: 0;
}
.comment__list > .comment__reply {
  margin-left: 0;
}
@media (min-width: 768px) {
  .comment__list > .comment__reply {
    margin-left: 100px;
  }
}
.comment__reply li {
  border-top: 1px solid #dee2e6;
  padding-top: 20px;
  margin-top: 15px;
}
.comment__wrapper {
  display: flex;
  align-items: flex-start;
  flex-direction: column;
}
@media (min-width: 576px) {
  .comment__wrapper {
    flex-direction: row;
  }
}
.comment__img {
  margin-right: 30px;
}
.comment__img img {
  border-radius: 50%;
  border: 3px solid #dee2e6;
  width: 78px;
  height: 78px;
}
.comment__name {
  margin-right: 10px;
}
.comment__content-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
  flex-wrap: wrap;
}
.comment__content-left {
  display: flex;
  align-items: center;
}

/*****************************
20 - Component - Form
*****************************/
.form-box__single-group {
  display: flex;
  flex-direction: column;
  margin-top: 25px;
}
.form-box__single-group label {
  font-size: 14px;
  font-weight: 400;
  text-align: left;
}
.form-box__single-group input, .form-box__single-group textarea, .form-box__single-group select {
  border: 1px solid #dee2e6;
  border-radius: 3px;
  padding: 7.5px 10px;
  width: 100%;
  outline: none;
  font-size: 14px;
}

select {
  outline: none;
  border: 1px solid #dee2e6;
  padding: 5px 15px;
}

label > span {
  display: inline-block;
  padding-left: 30px;
}

input[type=checkbox] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  position: relative;
}
input[type=checkbox]::after {
  position: absolute;
  content: "";
  width: 20px;
  height: 20px;
  border: 1px solid #0063d1;
  top: -15px;
  line-height: 20px;
  background: #fff;
  text-align: center;
  transition: all 0.3s ease;
  border-radius: 2px;
}

input[type=checkbox]:checked::after {
  content: "";
  font-family: "Font Awesome 5 Light";
  color: #fff;
  background: #0063d1;
}

input[type=radio] {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  position: relative;
}
input[type=radio]::after {
  position: absolute;
  content: "";
  font-family: "Font Awesome 5 Free";
  background: #fff;
  text-align: center;
  transition: all 0.3s ease;
  top: -17px;
  color: #0063d1;
}

.product-color-select {
  position: relative;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
.product-color-select::after {
  position: absolute;
  content: "";
  width: 15px;
  height: 15px;
  border-radius: 50% !important;
  border: 1px solid transparent !important;
}
.product-color-select[value=color-red]::after {
  background: #ed3c32 !important;
}
.product-color-select[value=color-green]::after {
  background: #62ab00 !important;
}
.product-color-select[value=color-blue]::after {
  background: #0063d1 !important;
}
.product-color-select:checked::after {
  content: "" !important;
  border: 2px solid #000 !important;
}

input[type=radio]:checked::after {
  content: "";
}

input[type=radio].shipping-select::after {
  position: absolute;
  content: "";
  font-family: "Font Awesome 5 Free";
  background: transparent;
  text-align: center;
  transition: all 0.3s ease;
  top: -17px;
  color: #0063d1;
}

input[type=radio].shipping-select:checked::after {
  content: "";
}

.from-box__buttons {
  flex-direction: column;
  align-items: flex-start !important;
}
@media (min-width: 576px) {
  .from-box__buttons {
    flex-direction: row;
  }
}

.form-box-right {
  margin-top: 25px;
}
@media (min-width: 576px) {
  .form-box-right {
    margin-top: 0;
  }
}

/*****************************
21 - Page - Shop
*****************************/
.shop__list-link {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  flex-wrap: wrap;
}
@media (min-width: 768px) {
  .shop__list-link {
    flex-direction: column;
    align-items: flex-start;
    flex-wrap: nowrap;
  }
}
.shop__list-link li a {
  display: block;
}
.shop-list > .product__box--list {
  border-bottom: 1px solid #dee2e6;
  padding: 30px 0;
}

.border-right.pos-absolute {
  border-right: none !important;
}
@media (min-width: 768px) {
  .border-right.pos-absolute {
    border-right: 1px solid #dee2e6 !important;
    height: 100%;
    right: 0;
  }
}

/*****************************
22 - Page - Product Single
*****************************/
.product-details-tab-area {
  padding: 30px 20px;
}
@media (min-width: 768px) {
  .product-details-tab-area {
    padding: 30px 40px;
  }
}

.review-box {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.review-box > * {
  margin-right: 30px;
}
.review-box > *:last-child {
  margin-right: 0;
}

.product-dis__img {
  display: inline-block;
  border: 1px solid #dee2e6;
}
.product-dis__title {
  font-weight: 500;
}
.product-dis__text {
  font-weight: 300;
}

/*****************************
23 - Page - Blog
*****************************/
.blog--1 {
  margin-top: 60px;
}
@media (min-width: 768px) {
  .blog--1 {
    margin-top: 80px;
  }
}
@media (min-width: 992px) {
  .blog--1 {
    margin-top: 100px;
  }
}
.blog--2 {
  margin-top: 12px;
}
@media (min-width: 768px) {
  .blog--2 {
    margin-top: 32px;
  }
}
@media (min-width: 992px) {
  .blog--2 {
    margin-top: 52px;
  }
}
.blog-news__img-box {
  overflow: hidden;
  position: relative;
}
.blog-news__img-box::before {
  background: rgba(255, 255, 255, 0.41) none repeat scroll 0 0;
  content: "";
  height: 0;
  left: 0;
  margin: auto;
  opacity: 1;
  position: absolute;
  top: 0;
  width: 0;
  pointer-events: none;
  z-index: 1;
  overflow: hidden;
}
.blog-news__img-box:hover::before {
  height: 100%;
  opacity: 0;
  transition-duration: 1.3s;
  width: 100%;
}
.blog-news__img-box::after {
  background: rgba(255, 255, 255, 0.41) none repeat scroll 0 0;
  bottom: 0;
  content: "";
  height: 0;
  opacity: 1;
  position: absolute;
  right: 0;
  width: 0;
  pointer-events: none;
  z-index: 1;
  overflow: hidden;
}
.blog-news__img-box:hover::after {
  height: 100%;
  opacity: 0;
  transition-duration: 1.3s;
  width: 100%;
}
.blog-news__img--link {
  display: block;
}
.blog-news__img {
  width: 100%;
  height: auto;
}
.blog-news__archive {
  font-size: 13px;
  text-transform: capitalize;
}
.blog-news__archive a {
  display: inline-block;
  margin-right: 20px;
  color: #545454 !important;
  text-decoration: none;
}
.blog-news__archive a:last-child {
  margin-right: 0;
}
.blog-news__link {
  font-weight: 500;
  line-height: 20px;
  color: #242424 !important;
  text-transform: capitalize;
  display: block;
  margin-top: 25px;
  text-decoration: none !important;
}
.blog-news__link h5 {
  font-size: 16px;
}
.blog__img {
  overflow: hidden;
}
.blog__img a {
  display: block;
}
.blog__img img {
  object-fit: cover;
  width: 100%;
  height: 300px;
}
.blog__img iframe {
  width: 100%;
  height: 300px;
}
.blog__type-grid {
  margin-bottom: 40px;
}
.blog__type-list {
  margin-bottom: 30px;
}
@media (min-width: 768px) {
  .blog__type-list {
    margin-bottom: 40px;
  }
}
.blog__type-list .blog__img {
  margin-bottom: 35px;
}
@media (min-width: 768px) {
  .blog__type-list .blog__img {
    margin-bottom: 0px;
  }
}
.blog__type-single .img-responsive {
  margin-bottom: 35px;
}
.blog ~ .page-pagination {
  margin-top: 10px;
}
@media (min-width: 768px) {
  .blog ~ .page-pagination {
    margin-top: 30px;
  }
}
@media (min-width: 992px) {
  .blog ~ .page-pagination {
    margin-top: 50px;
  }
}

.popup-icon i {
  color: #fff;
  width: 50px;
  height: 50px;
  line-height: 50px;
  background: blue;
  text-align: center;
  border-radius: 50%;
}

.popup-icon {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.45);
  display: flex !important;
  align-items: center;
  justify-content: center;
  text-decoration: none !important;
}

.blog__tag-share {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-direction: column;
  padding: 10px 15px;
}
@media (min-width: 768px) {
  .blog__tag-share {
    flex-direction: row;
    align-items: center;
  }
}

.nametag {
  display: flex;
}
.nametag span {
  font-weight: 500;
  margin-right: 15px;
}

.nametag__list {
  display: flex;
}

.nametag__list li {
  margin-right: 10px;
}

.nametag__list a {
  color: #333;
  text-decoration: none !important;
}

/*****************************
24 - Page - Cart
*****************************/
.cart-table-button {
  display: flex;
  justify-content: flex-start;
  flex-direction: column;
}
@media (min-width: 768px) {
  .cart-table-button {
    flex-direction: row;
    justify-content: space-between;
  }
}

.total-shipping {
  padding: 15px 0;
  border-top: 1px solid #dee2e6;
  border-bottom: 1px solid #dee2e6;
  margin-top: 20px;
}

.total-cost {
  display: flex;
  justify-content: space-between;
  font-weight: 300;
}
.total-cost span {
  font-weight: 500;
}

.shipping-cost li {
  display: flex;
  justify-content: space-between;
}

.grand-total {
  color: #0063d1;
  display: flex;
  justify-content: space-between;
}

/*****************************
25 - Page - Checkout
*****************************/
.your-order-section {
  margin-top: 40px;
}
@media (min-width: 768px) {
  .your-order-section {
    margin-top: 55px;
  }
}
@media (min-width: 992px) {
  .your-order-section {
    margin-top: 0px;
  }
}

.your-order-box {
  padding: 40px;
}

.your-order-middle {
  color: #333;
  padding: 20px 0;
  border-top: 1px solid #dee2e6;
  border-bottom: 1px solid #dee2e6;
  margin: 20px 0;
}

.your-order-total {
  padding: 20px 0;
  border-top: 1px solid #dee2e6;
  border-bottom: 1px solid #dee2e6;
  margin: 20px 0;
}

.payment-accordion h4 a {
  color: #333;
  font-size: 16px;
  margin: 0;
  font-weight: 400;
  text-decoration: none;
}

.panel-body {
  color: #777;
  padding-left: 15px;
  font-size: 14px;
}

.open-create-account,
.open-shipping-account {
  display: none;
}

/*****************************
26 - Page - 404
*****************************/
.page-not-found {
  box-shadow: 2px 2px 8px 0 rgba(0, 0, 0, 0.2);
  background: #fff;
  padding: 1rem;
  font-size: 0.875rem;
  color: #7a7a7a;
  max-width: 570px;
  margin: 0 auto;
}
.page-not-found h4 {
  font-size: 1rem;
  font-weight: 700;
  margin: 0.5rem 0 1rem;
}
.page-not-found p {
  color: #777;
}
.page-not-found a {
  color: #272727;
  font-weight: 700;
  margin: 10px 0;
  display: inline-block;
  text-transform: capitalize;
}

/*****************************
27 - Page - My Account
*****************************/
.account-wrapper {
  border: 2px solid #e5e5e5;
  padding: 40px 30px;
}

.my-account-menu .account-menu-list li a {
  display: inline-block;
  width: 100%;
  height: 50px;
  line-height: 50px;
  padding: 0 20px;
  font-size: 14px;
  color: #333;
  border: 1px solid #e5e5e5;
  margin-top: -1px;
  transition: all 0.3s linear;
  text-decoration: none;
}

.my-account-menu .account-menu-list li a:hover,
.my-account-menu .account-menu-list li a.active {
  background-color: #333;
  color: #fff;
  border-color: #333;
}

.my-account-dashboard .welcome-dashboard p a:hover {
  color: #e52e06;
}

.my-account-tab .account-title {
  font-size: 24px;
  font-weight: 700;
  color: #333;
}

.my-account-details .account-details .title {
  font-size: 20px;
  font-weight: 700;
  color: #333;
}

.account-table .table thead tr th {
  border: 1px solid #e5e5e5;
  font-size: 16px;
  font-weight: 500;
  color: #333;
  padding: 8px 15px;
}

.account-table .table tbody tr td {
  font-size: 14px;
  color: #333;
  font-weight: 400;
  vertical-align: middle;
  border: 1px solid #e5e5e5;
}

.account-table .table thead tr th.name {
  min-width: 140px;
}

.account-table .table thead tr th.date {
  min-width: 130px;
}

.single-form select, .single-form textarea, .single-form input {
  width: 100%;
  font-size: 14px;
  height: 40px;
  color: #333;
  border: 1px solid #e5e5e5;
  padding: 0 15px;
  margin-top: 12px;
  outline: none;
}

/*****************************
28 - Page - Login
*****************************/
.login-register-tab-list {
  display: flex;
  justify-content: center;
  margin-bottom: 40px;
}
.login-register-tab-list h4 {
  font-size: 25px;
  font-weight: 500;
  margin: 0 20px;
  text-transform: capitalize;
  transition: all 0.3s ease 0s;
  color: #333;
}
.login-register-tab-list .active h4 {
  color: #0063d1;
}
.login-register-tab-list a {
  position: relative;
  text-decoration: none !important;
}
.login-register-tab-list a::before {
  background-color: #242424;
  bottom: 5px;
  content: "";
  height: 18px;
  margin: 0 auto;
  position: absolute;
  right: -2px;
  transition: all 0.4s ease 0s;
  width: 1px;
}
.login-register-tab-list a:last-child::before {
  display: none;
}

/*****************************
29 - Page - Contact
*****************************/
#map iframe {
  width: 100%;
  border: none;
  height: 600px;
}
@media (min-width: 576px) {
  #map iframe {
    height: 400px;
  }
}
@media (min-width: 360px) {
  #map iframe {
    height: 340px;
  }
}

.contact-info-wrap,
.contact-form {
  padding: 25px 20px;
}
@media (min-width: 576px) {
  .contact-info-wrap,
.contact-form {
    padding: 25px 30px;
  }
}
@media (min-width: 768px) {
  .contact-info-wrap,
.contact-form {
    padding: 30px 40px;
  }
}

.single-contact-info {
  display: flex;
  align-items: center;
  margin-bottom: 20px;
}

.contact-icon i {
  margin-right: 20px;
  width: 35px;
  height: 35px;
  border: 1px solid #ddd;
  text-align: center;
  line-height: 35px;
  border-radius: 50%;
}

.contact-info-dec a, .contact-info-dec span {
  display: block;
  color: #333;
  text-decoration: none !important;
}

.social-link li {
  display: inline-block;
  margin-right: 15px;
}

.social-link a {
  color: #333;
  font-size: 22px;
}

/*****************************
30 - Layout - Header
*****************************/
.header {
  display: none;
}
@media (min-width: 992px) {
  .header {
    display: block;
  }
}
.header__mobile {
  display: block;
  padding: 10px 0;
}
@media (min-width: 992px) {
  .header__mobile {
    display: none;
  }
}
.header__mobile-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.header__top {
  background: #efefef;
  font-size: 13px;
  padding: 15px 0;
  margin: 0;
  border-bottom: 1px solid #e1e1e1;
}
.header__top-content {
  display: flex;
  justify-content: space-between;
}
.header__top-content--right {
  display: flex;
  justify-content: flex-end;
}
.header__middle--style-2 {
  background: #0055b4;
}
.header__search-form {
  position: relative;
}
.header__search-input {
  display: flex;
  font-size: 13px;
}
.header__search-input input[type=search] {
  width: 100%;
  height: 44px;
  padding: 10px 10px 10px 184px;
  outline: none;
  border: 2px solid #e1e1e1;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-right: none;
}
.header__search-input--mobile input[type=search] {
  padding: 10px 10px 10px 140px;
}
@media (min-width: 576px) {
  .header__search-input--mobile input[type=search] {
    padding: 10px 10px 10px 184px;
  }
}
.header__search-category {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
}
.header__search-category select {
  height: 45px;
  width: 150px;
  border: none;
  background: transparent;
  font-size: 14px;
  padding: 10px;
  outline: none;
}
.header__search-category--mobile select {
  width: 125px;
}
@media (min-width: 576px) {
  .header__search-category--mobile select {
    width: 150px;
  }
}
.header__wishlist-box {
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
.header__wishlist-box a {
  text-decoration: none;
  color: #242424;
}
.header__wishlist-box i {
  font-size: 20px;
  color: #242424;
}
.header__tag {
  display: inline-block;
  padding: 10px 0;
}
@media (min-width: 992px) {
  .header__tag {
    display: flex;
  }
}
.header__tag-title {
  font-size: 13px;
  color: #242424;
}
.header__tag-nav {
  display: inline;
}
@media (min-width: 992px) {
  .header__tag-nav {
    display: flex;
  }
}
.header__tag-list {
  display: inline-block;
  position: relative;
  padding: 0 10px;
}
.header__tag-list::after {
  top: 50%;
  transform: translateY(-50%);
  content: "|";
  position: absolute;
  left: 0%;
  color: #919191;
}
.header__tag-list:first-child::after {
  display: none;
}
.header__tag-link {
  display: block;
  color: #919191;
  text-decoration: none !important;
}
.header__tag-link:hover {
  color: #0063d1;
}

.wishlist-item-count {
  top: -10px;
  left: -15px;
  background: #0063d1;
  color: #fff;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  line-height: 25px;
  text-align: center;
  font-size: 12px;
}

.user-set-role {
  margin-right: 20px;
  font-size: 13px;
}
.user-set-role:last-child {
  margin-right: 0;
}
.user-set-role__button {
  border: none;
  background: transparent;
  position: relative;
  color: #333;
}
.user-set-role__button img {
  margin-right: 3px;
}
.user-set-role__button i {
  margin-left: 3px;
}
.user-set-role__button:hover {
  color: #0063d1;
  text-decoration: none;
}

.expand-dropdown-menu {
  position: absolute;
  z-index: 999;
  right: 0;
  left: auto;
  min-width: 150px;
  overflow: hidden;
  padding: 0 20px;
  background: #fff;
  border-bottom: 2px solid #0063d1;
  box-shadow: 0px 2px 13.95px 1.05px rgba(0, 0, 0, 0.05);
}
.expand-dropdown-menu li {
  padding: 0;
  border-bottom: 1px solid #e5e5e5;
  transition: all 0.3s ease;
}
.expand-dropdown-menu a {
  display: block;
  padding: 10px 0;
  color: #7e7e7e;
  line-height: 25px;
  font-size: 13px;
  text-decoration: none;
}
.expand-dropdown-menu a img {
  margin-right: 3px;
}
.expand-dropdown-menu a:hover {
  color: #0063d1;
}
.expand-dropdown-menu.dropdown-menu {
  margin: 0;
}
.expand-dropdown-menu.dropdown-menu.show {
  top: 100% !important;
}

.header-menu {
  background: #0063d1;
}
.header-menu.is-sticky {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.4);
  animation-duration: 1s;
  animation-fill-mode: both;
  animation-name: slideInDown;
  animation-duration: 0.5s;
  margin-top: 0;
  z-index: 999;
  transition: all 0.5s;
}

.header__nav {
  display: flex;
  margin: 0;
}
.header__nav-item {
  padding-right: 25px;
  display: inline-block;
}
.header__nav-link {
  display: block;
  height: 60px;
  line-height: 60px;
  color: #fff !important;
  text-decoration: none !important;
  text-transform: uppercase;
  font-weight: 500;
}

.dropdown__menu, .dropdown__submenu {
  top: 100%;
  left: 0;
  width: 230px;
  background: #fff;
  z-index: 999;
  visibility: hidden;
  opacity: 0;
  border-bottom: 2px solid #0063d1;
  transform-origin: 0% 0%;
  transform-style: preserve-3d;
  transform: rotateX(-90deg);
  transition: all 0s linear;
  padding: 10px 0;
  text-transform: uppercase;
  font-size: 14px;
}
.dropdown__submenu {
  top: 0;
  left: -100%;
}
@media (min-width: 1200px) {
  .dropdown__submenu {
    left: 100%;
  }
}
.dropdown__list, .dropdown__submenu-list {
  padding: 5px 15px;
  display: block;
  position: relative;
}
.dropdown__link, .dropdown__submenu-link {
  text-decoration: none !important;
  display: inline-block;
  width: 100%;
  color: #252525;
  transition: all 0.3s ease;
}
.dropdown__link:hover, .dropdown__submenu-link:hover {
  color: #0063d1;
}

.mega-menu {
  top: 100%;
  left: -100%;
  margin: 0 auto;
  width: 740px;
  background: #fff;
  z-index: 999;
  visibility: hidden;
  opacity: 0;
  padding: 30px;
  text-transform: uppercase;
  transform-origin: 0% 0%;
  transform-style: preserve-3d;
  transform: rotateX(-90deg);
  transition: all 0s linear;
  border-bottom: 2px solid #0063d1;
}
@media (min-width: 1200px) {
  .mega-menu {
    left: 0%;
  }
}
.mega-menu__box {
  display: flex;
}
.mega-menu__item-box {
  margin-right: 30px;
}
.mega-menu__item-box:last-child {
  margin-right: 0;
}
.mega-menu__title {
  display: block;
  font-weight: 500;
}
.mega-menu__item {
  margin-top: 15px;
}
.mega-menu__item a {
  color: #252525;
  font-size: 14px;
}
.mega-menu__item p {
  color: #666666;
  font-size: 12px;
  line-height: 18px;
}
.mega-menu__list {
  padding-bottom: 5px;
}
.mega-menu__list:last-child {
  margin-bottom: 0;
}
.mega-menu__link {
  text-decoration: none !important;
  display: inline-block;
  width: 100%;
  color: #252525;
  transition: all 0.3s ease;
}
.mega-menu__link:hover {
  color: #0063d1;
}
.mega-menu__banner {
  overflow: hidden;
  width: 100%;
  margin-top: 30px;
}
.mega-menu__banner:hover .mega-menu__banner-img {
  transform: scale(1.1);
}
.mega-menu__banner-link {
  display: block;
}
.mega-menu__banner-img {
  width: 100%;
  height: auto;
  transform: scale(1);
  transition: all 0.5s ease;
}

.header__nav-item:hover .dropdown__menu,
.dropdown__list:hover .dropdown__submenu,
.header__nav-item:hover .mega-menu {
  visibility: visible;
  opacity: 1;
  transform: rotateX(0deg);
  transition: all 0.3s linear;
}

.mobile-header {
  display: block;
}
@media (min-width: 992px) {
  .mobile-header {
    display: none;
  }
}

.offcanvas-mobile-menu {
  display: block;
}
@media (min-width: 992px) {
  .offcanvas-mobile-menu {
    display: none;
  }
}

/*****************************
31 - Layout - Mobile Menu
*****************************/
.offside {
  background: #fff;
}
.offside-button {
  border: none;
  background: transparent;
  font-size: 32px;
  outline: none !important;
}

.offcanvas {
  padding: 50px 20px;
}
.offcanvas--open {
  border: none;
  background: transparent;
  font-size: 32px;
  outline: none !important;
}
.offcanvas__close {
  border: none;
  background: transparent;
  font-size: 32px;
  outline: none !important;
  position: absolute;
  right: 20px;
  top: 0;
}
.offcanvas-userpanel a {
  display: block;
  color: #232323;
  text-decoration: none;
}
.offcanvas-userpanel__role {
  position: relative;
  padding: 5px 0;
  border-bottom: 1px solid #ddd;
}
.offcanvas-userpanel__role:last-child {
  border-bottom: none;
}
.offcanvas__user-expand::after {
  content: "";
  position: absolute;
  font-family: "plaza-icon";
  right: 0;
  transition: all 0.3s ease;
}
.offcanvas-userpanel__role.active .offcanvas__user-expand::after {
  transform: rotate(180deg);
}
.offcanvas-userpanel .user-sub-menu {
  display: none;
  padding: 5px 0;
}
.offcanvas-userpanel .user-sub-menu li {
  font-size: 14px;
  padding: 5px 5px;
}
.offcanvas-menu li {
  position: relative;
  padding: 5px 5px;
}
.offcanvas-menu > ul > li {
  border-bottom: 1px solid #ddd;
}
.offcanvas-menu > ul > li:last-child {
  border-bottom: none;
}
.offcanvas-menu li a {
  display: block;
  color: #232323;
  text-decoration: none;
}
.offcanvas-menu li a:hover {
  color: #0063d1;
}
.offcanvas-menu li .sub-menu {
  display: none;
}
.offcanvas__menu-expand::after {
  content: "";
  position: absolute;
  font-family: "plaza-icon";
  right: 0;
  transition: all 0.3s ease;
}
.offcanvas-menu .active > .offcanvas__menu-expand, .sub-menu > .active .offcanvas__menu-expand {
  border-bottom: 1px solid #ddd;
}
.offcanvas-menu .active > .offcanvas__menu-expand:last-child, .sub-menu > .active .offcanvas__menu-expand:last-child {
  border-bottom: none;
}
.offcanvas-menu .active > .offcanvas__menu-expand::after, .sub-menu > .active .offcanvas__menu-expand::after {
  content: "";
  font-family: "plaza-icon";
}
.offcanvas-buttons {
  display: flex;
  justify-content: center;
}
.offcanvas-buttons a {
  color: #fff;
  background: #0063d1;
  border: 2px solid #fff;
  text-decoration: none;
  width: 45px;
  height: 45px;
  line-height: 45px;
  font-size: 20px;
  transition: all 0.3s ease;
  text-align: center;
  border-radius: 50%;
  margin-right: 15px;
}
.offcanvas-buttons a:last-child {
  margin-right: 0;
}
.offcanvas-buttons a:hover {
  color: #0063d1;
  background: #fff;
  border: 2px solid #0063d1;
}
.offcanvas-social {
  display: flex;
  align-items: center;
}
.offcanvas-social span {
  font-weight: 500;
}
.offcanvas-social ul {
  display: flex;
  font-size: 18px;
  margin-left: 15px;
}
.offcanvas-social li {
  margin-right: 10px;
  display: inline-block;
}
.offcanvas-social li:last-child {
  margin-right: 0;
}
.offcanvas-social a {
  display: block;
  text-align: center;
}

/*****************************
32 - Layout - Vertical Menu
*****************************/
.header-menu-vertical .menu-title {
  color: #fff;
  font-size: 15px;
  font-weight: 500;
  text-transform: uppercase;
  cursor: pointer;
  margin: 0;
  background: #0063d1;
  padding: 15px 20px;
  border-radius: 3px;
  display: block;
}
.header-menu-vertical .menu-content {
  width: 100%;
  background: #fff;
  border: 1px solid #eaeaea;
  top: 100%;
  left: 0;
  display: none;
}
@media (min-width: 992px) {
  .header-menu-vertical .menu-content {
    display: block;
  }
}
.header-menu-vertical .menu-content li {
  display: block;
  position: relative;
}
.header-menu-vertical .menu-content li:hover .sub-menu {
  opacity: 1;
  visibility: visible;
}
.header-menu-vertical .menu-content li a {
  position: relative;
  display: block;
  overflow: hidden;
  line-height: 24px;
  text-transform: capitalize;
  word-wrap: break-word;
  background: #fff;
  color: #47494a;
  padding: 7px 20px;
  font-size: 14px;
  font-weight: 400;
  transition: all 0.3s linear;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.header-menu-vertical .menu-content li a:hover {
  color: #0063d1;
}
.header-menu-vertical .menu-content li.expand a i {
  padding-right: 15px;
  font-weight: 700;
}
.header-menu-vertical .menu-content li .sub-menu {
  position: absolute;
  z-index: 9;
  text-align: left;
  top: 0;
  left: 100%;
  background: #fff;
  padding: 15px 10px 15px 10px;
  display: inline-block;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s linear;
  border: 1px solid #eaeaea;
  width: 705px;
}
@media (min-width: 1200px) {
  .header-menu-vertical .menu-content li .sub-menu {
    width: 890px;
  }
}
.header-menu-vertical .menu-content li .sub-menu > li {
  width: 33.33%;
  float: left;
}
.header-menu-vertical .menu-content li .sub-menu li a {
  margin: 5px 0px 5px 0px;
}
.header-menu-vertical .menu-content li .sub-menu.sub-menu-2 {
  padding: 0;
  width: 240px;
  border: 1px solid #eaeaea;
  background: #fff;
}
.header-menu-vertical .menu-content li .sub-menu.sub-menu-2 li {
  width: 100%;
  padding: 0;
  line-height: 20px;
  border-bottom: 1px solid #eaeaea;
  position: relative;
  display: block;
}

/*****************************
33 - Layout - Footer
*****************************/
.footer {
  font-size: 14px;
}
.footer__about {
  font-size: 14px;
}
.footer__logo {
  margin-bottom: 30px;
}
.footer__address-item {
  margin-bottom: 15px;
  color: #545454 !important;
}
.footer__address-item:last-child {
  margin-bottom: 0px;
}
.footer__address-item span {
  color: #0063d1;
}
.footer__address-item a {
  color: #545454;
}
.footer__address-item a:hover {
  color: #0063d1;
}
.footer__menu {
  margin-top: 35px;
}
.footer__nav-title {
  font-size: 20px;
  margin-bottom: 20px;
}
.footer__list {
  margin-bottom: 15px;
}
.footer__list:last-child {
  margin-bottom: 0px;
}
.footer__link {
  color: #545454;
  transition: all 0.3s ease;
  font-size: 14px;
  text-decoration: none !important;
  display: block;
}
.footer__link:hover {
  padding-left: 10px;
  color: #0063d1;
}
.footer__social-nav {
  display: flex;
}
.footer__social-list {
  margin-right: 10px;
  display: inline-block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 5px;
}
.footer__social-list:nth-child(1) {
  background: #3c5b9b;
}
.footer__social-list:nth-child(2) {
  background: #40c1df;
}
.footer__social-list:nth-child(3) {
  background: #ed3c32;
}
.footer__social-list:nth-child(4) {
  background: #eb8314;
}
.footer__social-list:nth-child(5) {
  background: #c619b8;
}
.footer__social-link {
  color: #fff !important;
  display: block;
}
.footer__form {
  margin-top: 60px;
}
.footer__form-box {
  display: flex;
  font-size: 14px;
}
.footer__form-box input {
  width: 100%;
  height: 44px;
  padding: 10px 10px 10px 10px;
  outline: none;
  border: 1px solid #e1e1e1;
  border-top-left-radius: 3px;
  border-bottom-left-radius: 3px;
  border-top-right-radius: 0px;
  border-bottom-right-radius: 0px;
  border-right: none;
}
.footer__quick-nav {
  margin-top: 50px;
  border-top: 1px solid #777;
}
.footer__quick-link {
  display: inline-block;
  color: #777;
  text-decoration: none !important;
  transition: all 0.3s ease;
  font-size: 14px;
}
.footer__quick-link:hover {
  color: #0063d1;
}
.footer__quick-link::after {
  content: "/";
  padding: 0 3px;
  color: #777;
}
.footer__quick-link:last-child::after {
  content: "";
}
.footer__bottom {
  padding: 40px 0;
}
.footer__copyright-text {
  text-align: center;
  margin-bottom: 20px;
}
@media (min-width: 992px) {
  .footer__copyright-text {
    text-align: left;
    margin-bottom: 0;
  }
}
.footer__copyright-text p {
  margin: 0;
}
.footer__payment {
  overflow: hidden;
  text-align: center;
}
@media (min-width: 992px) {
  .footer__payment {
    text-align: right;
  }
}
.footer__payment-link {
  display: block;
}
.footer__payment-img {
  max-width: 100%;
}

/*****************************
34 - Layout - Custom Layout
*****************************/
.container {
  max-width: 100%;
}
@media (min-width: 992px) {
  .container {
    max-width: 945px;
  }
}
@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}

/*****************************
35 - Layout - Table
*****************************/
table {
  border: 1px solid #dee2e6;
  width: 100%;
}
table thead > tr {
  background-color: #dee2e6;
  border: 1px solid #dee2e6;
}
table thead > tr > th {
  color: #1d1d1d;
  font-size: 14px;
  font-weight: 500;
  padding: 21px 45px 22px;
  text-align: center;
  text-transform: uppercase;
  vertical-align: middle;
  white-space: nowrap;
}
table tbody > tr {
  border-bottom: 1px solid #dee2e6;
}
table tbody > tr td {
  color: #666;
  font-size: 15px;
  padding: 30px 15px;
  text-align: center;
}
table tbody > tr td a {
  color: #666;
  text-decoration: none !important;
  display: inline-block;
}
table tbody > tr td a:hover {
  color: #666;
}

.product-thumbnail {
  width: 150px;
}

.product-name {
  width: 435px;
}

.product-price-cart {
  width: 435px;
}

.product-quantities {
  width: 435px;
}

.product-subtotal {
  width: 435px;
}

.product-remove {
  width: 100px;
}
.product-remove a {
  color: #666;
  font-size: 16px;
  margin: 0 10px;
}

.compare-table .table tbody tr td {
  text-align: center;
  border: none;
  padding: 25px 30px;
  vertical-align: middle;
  border-bottom: 1px solid #dee2e6;
  border-left: 1px solid #dee2e6;
}

.first-column {
  min-width: 160px;
  font-size: 18px;
  font-weight: 500;
  color: #333;
  margin: 0;
  line-height: 1;
}

.product-image-title {
  min-width: 300px;
  vertical-align: bottom;
  padding-top: 70px;
}

.image {
  clear: both;
  width: 100%;
  margin-bottom: 40px;
  display: block;
}

.category {
  float: left;
  clear: both;
  font-size: 13px;
  line-height: 15px;
  color: #333;
  text-transform: capitalize;
  letter-spacing: 0.5px;
}

.pro-stock {
  font-size: 16px;
  font-weight: 600;
  color: #333;
}

.pro-remove button:hover {
  color: #ed3c32;
}

.login-form-container {
  background: transparent none repeat scroll 0 0;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
  padding: 80px;
  text-align: left;
}

/*****************************
36 - Layout - Offacnvas
*****************************/
/* Body Style When OffCanvas Open */
.offcanvas-close {
  font-size: 24px;
}

/* OffCanvas Overlay */
.offcanvas-overlay {
  position: fixed;
  z-index: 999;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: none;
  background-color: rgba(0, 0, 0, 0.5);
}

/* OffCanvas */
.offcanvas {
  font-size: 16px;
  font-weight: 400;
  position: fixed;
  z-index: 1000;
  top: 0;
  right: 0;
  left: auto;
  display: block;
  overflow: hidden;
  width: 300px;
  height: 100vh;
  padding: 20px;
  transition: all 0.5s ease 0s;
  transform: translateX(100%);
  background-color: #fff;
  box-shadow: none;
  overflow-y: auto;
}
@media (min-width: 576px) {
  .offcanvas {
    width: 400px;
  }
}
.offcanvas.offcanvas-open {
  transform: translateX(0);
}
.offcanvas.offcanvas-mobile-menu {
  right: auto;
  left: 0;
  padding: 50px 40px;
  transform: translateX(-100%);
}
.offcanvas.offcanvas-mobile-menu.offcanvas-open {
  transform: translateX(0);
}

/*****************************
37 - Layout - Addcart Offacnvas
*****************************/
.offcanvas-add-cart {
  background: #fff;
  overflow-y: auto;
}
.offcanvas-add-cart__close {
  color: #fff;
  background: #333;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 5px;
  display: inline-block;
  font-weight: 300;
}
.offcanvas-add-cart__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #0063d1;
  padding-bottom: 10px;
  border-bottom: 1px solid #e1e1e1;
  text-transform: capitalize !important;
}
.offcanvas-add-cart__top-text {
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0;
}
.offcanvas-add-cart__top-text i {
  color: #fff;
  background: #0063d1;
  width: 30px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  border-radius: 3px;
  display: inline-block;
  font-weight: 300;
  margin-right: 10px;
}
.offcanvas-add-cart__list {
  display: flex;
  font-size: 14px;
  margin-bottom: 20px;
}
.offcanvas-add-cart__list:last-child {
  margin-bottom: 0;
}
.offcanvas-add-cart__img-box {
  margin-right: 25px;
  overflow: hidden;
}
.offcanvas-add-cart__img {
  width: 100%;
}
.offcanvas-add-cart__link {
  display: block;
  width: 90%;
}
.offcanvas-add-cart__link:hover {
  color: #0063d1;
}
.offcanvas-add-cart__detail span {
  display: block;
}
.offcanvas-add-cart__item-dismiss {
  right: 0;
  top: 0;
  border: none;
  width: 15px;
  height: 15px;
  line-height: 15px;
  border-radius: 50%;
  background: #333;
  color: #fff;
  text-align: center;
}
.offcanvas-add-cart__item-count {
  left: 0;
  top: 0;
  color: #fff;
  background: #0063d1;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  border-radius: 50%;
}
.offcanvas-add-cart__price {
  color: #0063d1;
  font-weight: 600;
  font-size: 16px;
  margin: 5px 0;
}
.offcanvas-add-cart__info {
  font-size: 12px;
  color: #777;
}
.offcanvas-add-cart__checkout-list {
  margin-top: 10px;
  display: flex;
  justify-content: space-between;
  font-size: 16px;
  font-weight: 500;
}
.offcanvas-add-cart__checkout-info {
  padding-top: 25px;
  border-top: 1px solid #777;
}
.offcanvas-add-cart__menu {
  margin-bottom: 35px;
}
.offcanvas-add-cart__checkout-left-info {
  color: #777;
}
.offcanvas-add-cart__checkout-right-info {
  color: #0063d1;
}
.offcanvas-add-cart__btn-checkout {
  margin-top: 50px;
}
.offcanvas-add-cart__checkout-box-bottom {
  background: #fff;
  position: sticky;
  bottom: 0;
  padding-bottom: 15px;
}

/*****************************
38 - Layout - Utilities
*****************************/
/*:::::::::: Margin Top :::::::::: */
.m-t-0 {
  margin-top: 0px;
}

.m-t-5 {
  margin-top: 5px;
}

.m-t-10 {
  margin-top: 10px;
}

.m-t-15 {
  margin-top: 15px;
}

.m-t-20 {
  margin-top: 20px;
}

.m-t-25 {
  margin-top: 25px;
}

.m-t-30 {
  margin-top: 30px;
}

.m-t-35 {
  margin-top: 35px;
}

.m-t-40 {
  margin-top: 40px;
}

.m-t-45 {
  margin-top: 45px;
}

.m-t-50 {
  margin-top: 50px;
}

.m-t-55 {
  margin-top: 55px;
}

.m-t-60 {
  margin-top: 60px;
}

.m-t-65 {
  margin-top: 65px;
}

.m-t-70 {
  margin-top: 70px;
}

.m-t-75 {
  margin-top: 75px;
}

.m-t-80 {
  margin-top: 80px;
}

.m-t-85 {
  margin-top: 85px;
}

.m-t-90 {
  margin-top: 90px;
}

.m-t-95 {
  margin-top: 95px;
}

.m-t-100 {
  margin-top: 100px;
}

.m-t-105 {
  margin-top: 105px;
}

.m-t-110 {
  margin-top: 110px;
}

.m-t-115 {
  margin-top: 115px;
}

.m-t-120 {
  margin-top: 120px;
}

.m-t-125 {
  margin-top: 125px;
}

.m-t-130 {
  margin-top: 130px;
}

.m-t-135 {
  margin-top: 135px;
}

.m-t-140 {
  margin-top: 140px;
}

.m-t-145 {
  margin-top: 145px;
}

.m-t-150 {
  margin-top: 150px;
}

.m-t-155 {
  margin-top: 155px;
}

.m-t-160 {
  margin-top: 160px;
}

/*:::::::::: Margin bottom :::::::::: */
.m-b-0 {
  margin-bottom: 0px;
}

.m-b-5 {
  margin-bottom: 5px;
}

.m-b-10 {
  margin-bottom: 10px;
}

.m-b-15 {
  margin-bottom: 15px;
}

.m-b-20 {
  margin-bottom: 20px;
}

.m-b-25 {
  margin-bottom: 25px;
}

.m-b-30 {
  margin-bottom: 30px;
}

.m-b-35 {
  margin-bottom: 35px;
}

.m-b-40 {
  margin-bottom: 40px;
}

.m-b-45 {
  margin-bottom: 45px;
}

.m-b-50 {
  margin-bottom: 50px;
}

.m-b-55 {
  margin-bottom: 55px;
}

.m-b-60 {
  margin-bottom: 60px;
}

.m-b-65 {
  margin-bottom: 65px;
}

.m-b-70 {
  margin-bottom: 70px;
}

.m-b-75 {
  margin-bottom: 75px;
}

.m-b-80 {
  margin-bottom: 80px;
}

.m-b-85 {
  margin-bottom: 85px;
}

.m-b-90 {
  margin-bottom: 90px;
}

.m-b-95 {
  margin-bottom: 95px;
}

.m-b-100 {
  margin-bottom: 100px;
}

.m-b-105 {
  margin-bottom: 105px;
}

.m-b-110 {
  margin-bottom: 110px;
}

.m-b-115 {
  margin-bottom: 115px;
}

.m-b-120 {
  margin-bottom: 120px;
}

.m-b-125 {
  margin-bottom: 125px;
}

.m-b-130 {
  margin-bottom: 130px;
}

.m-b-135 {
  margin-bottom: 135px;
}

.m-b-140 {
  margin-bottom: 140px;
}

.m-b-145 {
  margin-bottom: 145px;
}

.m-b-150 {
  margin-bottom: 150px;
}

.m-b-155 {
  margin-bottom: 155px;
}

.m-b-160 {
  margin-bottom: 160px;
}

/*:::::::::: Margin Left :::::::::: */
.m-l-0 {
  margin-left: 0px;
}

.m-l-5 {
  margin-left: 5px;
}

.m-l-10 {
  margin-left: 10px;
}

.m-l-15 {
  margin-left: 15px;
}

.m-l-20 {
  margin-left: 20px;
}

.m-l-25 {
  margin-left: 25px;
}

.m-l-30 {
  margin-left: 30px;
}

.m-l-35 {
  margin-left: 35px;
}

.m-l-40 {
  margin-left: 40px;
}

.m-l-45 {
  margin-left: 45px;
}

.m-l-50 {
  margin-left: 50px;
}

.m-l-55 {
  margin-left: 55px;
}

.m-l-60 {
  margin-left: 60px;
}

.m-l-65 {
  margin-left: 65px;
}

.m-l-70 {
  margin-left: 70px;
}

.m-l-75 {
  margin-left: 75px;
}

.m-l-80 {
  margin-left: 80px;
}

.m-l-85 {
  margin-left: 85px;
}

.m-l-90 {
  margin-left: 90px;
}

.m-l-95 {
  margin-left: 95px;
}

.m-l-100 {
  margin-left: 100px;
}

.m-l-105 {
  margin-left: 105px;
}

.m-l-110 {
  margin-left: 110px;
}

.m-l-115 {
  margin-left: 115px;
}

.m-l-120 {
  margin-left: 120px;
}

.m-l-125 {
  margin-left: 125px;
}

.m-l-130 {
  margin-left: 130px;
}

.m-l-135 {
  margin-left: 135px;
}

.m-l-140 {
  margin-left: 140px;
}

.m-l-145 {
  margin-left: 145px;
}

.m-l-150 {
  margin-left: 150px;
}

.m-l-155 {
  margin-left: 155px;
}

.m-l-160 {
  margin-left: 160px;
}

/*:::::::::: Margin Right :::::::::: */
.m-r-0 {
  margin-right: 0px;
}

.m-r-5 {
  margin-right: 5px;
}

.m-r-10 {
  margin-right: 10px;
}

.m-r-15 {
  margin-right: 15px;
}

.m-r-20 {
  margin-right: 20px;
}

.m-r-25 {
  margin-right: 25px;
}

.m-r-30 {
  margin-right: 30px;
}

.m-r-35 {
  margin-right: 35px;
}

.m-r-40 {
  margin-right: 40px;
}

.m-r-45 {
  margin-right: 45px;
}

.m-r-50 {
  margin-right: 50px;
}

.m-r-55 {
  margin-right: 55px;
}

.m-r-60 {
  margin-right: 60px;
}

.m-r-65 {
  margin-right: 65px;
}

.m-r-70 {
  margin-right: 70px;
}

.m-r-75 {
  margin-right: 75px;
}

.m-r-80 {
  margin-right: 80px;
}

.m-r-85 {
  margin-right: 85px;
}

.m-r-90 {
  margin-right: 90px;
}

.m-r-95 {
  margin-right: 95px;
}

.m-r-100 {
  margin-right: 100px;
}

.m-r-105 {
  margin-right: 105px;
}

.m-r-110 {
  margin-right: 110px;
}

.m-r-115 {
  margin-right: 115px;
}

.m-r-120 {
  margin-right: 120px;
}

.m-r-125 {
  margin-right: 125px;
}

.m-r-130 {
  margin-right: 130px;
}

.m-r-135 {
  margin-right: 135px;
}

.m-r-140 {
  margin-right: 140px;
}

.m-r-145 {
  margin-right: 145px;
}

.m-r-150 {
  margin-right: 150px;
}

.m-r-155 {
  margin-right: 155px;
}

.m-r-160 {
  margin-right: 160px;
}

/*:::::::::: Margin Left Right :::::::::: */
.m-lr-0 {
  margin: 0 0px;
}

.m-lr-5 {
  margin: 0 5px;
}

.m-lr-10 {
  margin: 0 10px;
}

.m-lr-15 {
  margin: 0 15px;
}

.m-lr-20 {
  margin: 0 20px;
}

.m-lr-25 {
  margin: 0 25px;
}

.m-lr-30 {
  margin: 0 30px;
}

.m-lr-35 {
  margin: 0 35px;
}

.m-lr-40 {
  margin: 0 40px;
}

.m-lr-45 {
  margin: 0 45px;
}

.m-lr-50 {
  margin: 0 50px;
}

.m-lr-55 {
  margin: 0 55px;
}

.m-lr-60 {
  margin: 0 60px;
}

.m-lr-65 {
  margin: 0 65px;
}

.m-lr-70 {
  margin: 0 70px;
}

.m-lr-75 {
  margin: 0 75px;
}

.m-lr-80 {
  margin: 0 80px;
}

.m-lr-85 {
  margin: 0 85px;
}

.m-lr-90 {
  margin: 0 90px;
}

.m-lr-95 {
  margin: 0 95px;
}

.m-lr-100 {
  margin: 0 100px;
}

.m-lr-105 {
  margin: 0 105px;
}

.m-lr-110 {
  margin: 0 110px;
}

.m-lr-115 {
  margin: 0 115px;
}

.m-lr-120 {
  margin: 0 120px;
}

.m-lr-125 {
  margin: 0 125px;
}

.m-lr-130 {
  margin: 0 130px;
}

.m-lr-135 {
  margin: 0 135px;
}

.m-lr-140 {
  margin: 0 140px;
}

.m-lr-145 {
  margin: 0 145px;
}

.m-lr-150 {
  margin: 0 150px;
}

.m-lr-155 {
  margin: 0 155px;
}

.m-lr-160 {
  margin: 0 160px;
}

/*:::::::::: Margin Top Bottom :::::::::: */
.m-tb-0 {
  margin: 0px 0;
}

.m-tb-5 {
  margin: 5px 0;
}

.m-tb-10 {
  margin: 10px 0;
}

.m-tb-15 {
  margin: 15px 0;
}

.m-tb-20 {
  margin: 20px 0;
}

.m-tb-25 {
  margin: 25px 0;
}

.m-tb-30 {
  margin: 30px 0;
}

.m-tb-35 {
  margin: 35px 0;
}

.m-tb-40 {
  margin: 40px 0;
}

.m-tb-45 {
  margin: 45px 0;
}

.m-tb-50 {
  margin: 50px 0;
}

.m-tb-55 {
  margin: 55px 0;
}

.m-tb-60 {
  margin: 60px 0;
}

.m-tb-65 {
  margin: 65px 0;
}

.m-tb-70 {
  margin: 70px 0;
}

.m-tb-75 {
  margin: 75px 0;
}

.m-tb-80 {
  margin: 80px 0;
}

.m-tb-85 {
  margin: 85px 0;
}

.m-tb-90 {
  margin: 90px 0;
}

.m-tb-95 {
  margin: 95px 0;
}

.m-tb-100 {
  margin: 100px 0;
}

.m-tb-105 {
  margin: 105px 0;
}

.m-tb-110 {
  margin: 110px 0;
}

.m-tb-115 {
  margin: 115px 0;
}

.m-tb-120 {
  margin: 120px 0;
}

.m-tb-125 {
  margin: 125px 0;
}

.m-tb-130 {
  margin: 130px 0;
}

.m-tb-135 {
  margin: 135px 0;
}

.m-tb-140 {
  margin: 140px 0;
}

.m-tb-145 {
  margin: 145px 0;
}

.m-tb-150 {
  margin: 150px 0;
}

.m-tb-155 {
  margin: 155px 0;
}

.m-tb-160 {
  margin: 160px 0;
}

/*:::::::::::::::::::::::::::::::::::::::::::::::::::::
==================== Padding measurement===========
::::::::::::::::::::::::::::::::::::::::::::::::::::::*/
/*:::::::::: Pargin Top :::::::::: */
.p-t-0 {
  padding-top: 0px;
}

.p-t-5 {
  padding-top: 5px;
}

.p-t-10 {
  padding-top: 10px;
}

.p-t-15 {
  padding-top: 15px;
}

.p-t-20 {
  padding-top: 20px;
}

.p-t-25 {
  padding-top: 25px;
}

.p-t-30 {
  padding-top: 30px;
}

.p-t-35 {
  padding-top: 35px;
}

.p-t-40 {
  padding-top: 40px;
}

.p-t-45 {
  padding-top: 45px;
}

.p-t-50 {
  padding-top: 50px;
}

.p-t-55 {
  padding-top: 55px;
}

.p-t-60 {
  padding-top: 60px;
}

.p-t-65 {
  padding-top: 65px;
}

.p-t-70 {
  padding-top: 70px;
}

.p-t-75 {
  padding-top: 75px;
}

.p-t-80 {
  padding-top: 80px;
}

.p-t-85 {
  padding-top: 85px;
}

.p-t-90 {
  padding-top: 90px;
}

.p-t-95 {
  padding-top: 95px;
}

.p-t-100 {
  padding-top: 100px;
}

.p-t-105 {
  padding-top: 105px;
}

.p-t-110 {
  padding-top: 110px;
}

.p-t-115 {
  padding-top: 115px;
}

.p-t-120 {
  padding-top: 120px;
}

.p-t-125 {
  padding-top: 125px;
}

.p-t-130 {
  padding-top: 130px;
}

.p-t-135 {
  padding-top: 135px;
}

.p-t-140 {
  padding-top: 140px;
}

.p-t-145 {
  padding-top: 145px;
}

.p-t-150 {
  padding-top: 150px;
}

.p-t-155 {
  padding-top: 155px;
}

.p-t-160 {
  padding-top: 160px;
}

/*:::::::::: Padding bottom :::::::::: */
.p-b-0 {
  padding-bottom: 0px;
}

.p-b-5 {
  padding-bottom: 5px;
}

.p-b-10 {
  padding-bottom: 10px;
}

.p-b-15 {
  padding-bottom: 15px;
}

.p-b-20 {
  padding-bottom: 20px;
}

.p-b-25 {
  padding-bottom: 25px;
}

.p-b-30 {
  padding-bottom: 30px;
}

.p-b-35 {
  padding-bottom: 35px;
}

.p-b-40 {
  padding-bottom: 40px;
}

.p-b-45 {
  padding-bottom: 45px;
}

.p-b-50 {
  padding-bottom: 50px;
}

.p-b-55 {
  padding-bottom: 55px;
}

.p-b-60 {
  padding-bottom: 60px;
}

.p-b-65 {
  padding-bottom: 65px;
}

.p-b-70 {
  padding-bottom: 70px;
}

.p-b-75 {
  padding-bottom: 75px;
}

.p-b-80 {
  padding-bottom: 80px;
}

.p-b-85 {
  padding-bottom: 85px;
}

.p-b-90 {
  padding-bottom: 90px;
}

.p-b-95 {
  padding-bottom: 95px;
}

.p-b-100 {
  padding-bottom: 100px;
}

.p-b-105 {
  padding-bottom: 105px;
}

.p-b-110 {
  padding-bottom: 110px;
}

.p-b-115 {
  padding-bottom: 115px;
}

.p-b-120 {
  padding-bottom: 120px;
}

.p-b-125 {
  padding-bottom: 125px;
}

.p-b-130 {
  padding-bottom: 130px;
}

.p-b-135 {
  padding-bottom: 135px;
}

.p-b-140 {
  padding-bottom: 140px;
}

.p-b-145 {
  padding-bottom: 145px;
}

.p-b-150 {
  padding-bottom: 150px;
}

.p-b-155 {
  padding-bottom: 155px;
}

.p-b-160 {
  padding-bottom: 160px;
}

/*:::::::::: Padding Left :::::::::: */
.p-l-0 {
  padding-left: 0px;
}

.p-l-5 {
  padding-left: 5px;
}

.p-l-10 {
  padding-left: 10px;
}

.p-l-15 {
  padding-left: 15px;
}

.p-l-20 {
  padding-left: 20px;
}

.p-l-25 {
  padding-left: 25px;
}

.p-l-30 {
  padding-left: 30px;
}

.p-l-35 {
  padding-left: 35px;
}

.p-l-40 {
  padding-left: 40px;
}

.p-l-45 {
  padding-left: 45px;
}

.p-l-50 {
  padding-left: 50px;
}

.p-l-55 {
  padding-left: 55px;
}

.p-l-60 {
  padding-left: 60px;
}

.p-l-65 {
  padding-left: 65px;
}

.p-l-70 {
  padding-left: 70px;
}

.p-l-75 {
  padding-left: 75px;
}

.p-l-80 {
  padding-left: 80px;
}

.p-l-85 {
  padding-left: 85px;
}

.p-l-90 {
  padding-left: 90px;
}

.p-l-95 {
  padding-left: 95px;
}

.p-l-100 {
  padding-left: 100px;
}

.p-l-105 {
  padding-left: 105px;
}

.p-l-110 {
  padding-left: 110px;
}

.p-l-115 {
  padding-left: 115px;
}

.p-l-120 {
  padding-left: 120px;
}

.p-l-125 {
  padding-left: 125px;
}

.p-l-130 {
  padding-left: 130px;
}

.p-l-135 {
  padding-left: 135px;
}

.p-l-140 {
  padding-left: 140px;
}

.p-l-145 {
  padding-left: 145px;
}

.p-l-150 {
  padding-left: 150px;
}

.p-l-155 {
  padding-left: 155px;
}

.p-l-160 {
  padding-left: 160px;
}

/*:::::::::: padding Right :::::::::: */
.p-r-0 {
  padding-right: 0px;
}

.p-r-5 {
  padding-right: 5px;
}

.p-r-10 {
  padding-right: 10px;
}

.p-r-15 {
  padding-right: 15px;
}

.p-r-20 {
  padding-right: 20px;
}

.p-r-25 {
  padding-right: 25px;
}

.p-r-30 {
  padding-right: 30px;
}

.p-r-35 {
  padding-right: 35px;
}

.p-r-40 {
  padding-right: 40px;
}

.p-r-45 {
  padding-right: 45px;
}

.p-r-50 {
  padding-right: 50px;
}

.p-r-55 {
  padding-right: 55px;
}

.p-r-60 {
  padding-right: 60px;
}

.p-r-65 {
  padding-right: 65px;
}

.p-r-70 {
  padding-right: 70px;
}

.p-r-75 {
  padding-right: 75px;
}

.p-r-80 {
  padding-right: 80px;
}

.p-r-85 {
  padding-right: 85px;
}

.p-r-90 {
  padding-right: 90px;
}

.p-r-95 {
  padding-right: 95px;
}

.p-r-100 {
  padding-right: 100px;
}

.p-r-105 {
  padding-right: 105px;
}

.p-r-110 {
  padding-right: 110px;
}

.p-r-115 {
  padding-right: 115px;
}

.p-r-120 {
  padding-right: 120px;
}

.p-r-125 {
  padding-right: 125px;
}

.p-r-130 {
  padding-right: 130px;
}

.p-r-135 {
  padding-right: 135px;
}

.p-r-140 {
  padding-right: 140px;
}

.p-r-145 {
  padding-right: 145px;
}

.p-r-150 {
  padding-right: 150px;
}

.p-r-155 {
  padding-right: 155px;
}

.p-r-160 {
  padding-right: 160px;
}

/*:::::::::: padding Left Right :::::::::: */
.p-lr-0 {
  padding: 0 0;
}

.p-lr-5 {
  padding: 0 5px;
}

.p-lr-10 {
  padding: 0 10px;
}

.p-lr-15 {
  padding: 0 15px;
}

.p-lr-20 {
  padding: 0 20px;
}

.p-lr-25 {
  padding: 0 25px;
}

.p-lr-30 {
  padding: 0 30px;
}

.p-lr-35 {
  padding: 0 35px;
}

.p-lr-40 {
  padding: 0 40px;
}

.p-lr-45 {
  padding: 0 45px;
}

.p-lr-50 {
  padding: 0 50px;
}

.p-lr-55 {
  padding: 0 55px;
}

.p-lr-60 {
  padding: 0 60px;
}

.p-lr-65 {
  padding: 0 65px;
}

.p-lr-70 {
  padding: 0 70px;
}

.p-lr-75 {
  padding: 0 75px;
}

.p-lr-80 {
  padding: 0 80px;
}

.p-lr-85 {
  padding: 0 85px;
}

.p-lr-90 {
  padding: 0 90px;
}

.p-lr-95 {
  padding: 0 95px;
}

.p-lr-100 {
  padding: 0 100px;
}

.p-lr-105 {
  padding: 0 105px;
}

.p-lr-110 {
  padding: 0 110px;
}

.p-lr-115 {
  padding: 0 115px;
}

.p-lr-120 {
  padding: 0 120px;
}

.p-lr-125 {
  padding: 0 125px;
}

.p-lr-130 {
  padding: 0 130px;
}

.p-lr-135 {
  padding: 0 135px;
}

.p-lr-140 {
  padding: 0 140px;
}

.p-lr-145 {
  padding: 0 145px;
}

.p-lr-150 {
  padding: 0 150px;
}

.p-lr-155 {
  padding: 0 155px;
}

.p-lr-160 {
  padding: 0 160px;
}

/*:::::::::: padding Top Bottom :::::::::: */
.p-tb-0 {
  padding: 0 0;
}

.p-tb-5 {
  padding: 5px 0;
}

.p-tb-10 {
  padding: 10px 0;
}

.p-tb-15 {
  padding: 15px 0;
}

.p-tb-20 {
  padding: 20px 0;
}

.p-tb-25 {
  padding: 25px 0;
}

.p-tb-30 {
  padding: 30px 0;
}

.p-tb-35 {
  padding: 35px 0;
}

.p-tb-40 {
  padding: 40px 0;
}

.p-tb-45 {
  padding: 45px 0;
}

.p-tb-50 {
  padding: 50px 0;
}

.p-tb-55 {
  padding: 55px 0;
}

.p-tb-60 {
  padding: 60px 0;
}

.p-tb-65 {
  padding: 65px 0;
}

.p-tb-70 {
  padding: 70px 0;
}

.p-tb-75 {
  padding: 75px 0;
}

.p-tb-80 {
  padding: 80px 0;
}

.p-tb-85 {
  padding: 85px 0;
}

.p-tb-90 {
  padding: 90px 0;
}

.p-tb-95 {
  padding: 95px 0;
}

.p-tb-100 {
  padding: 100px 0;
}

.p-tb-105 {
  padding: 105px 0;
}

.p-tb-110 {
  padding: 110px 0;
}

.p-tb-115 {
  padding: 115px 0;
}

.p-tb-120 {
  padding: 120px 0;
}

.p-tb-125 {
  padding: 125px 0;
}

.p-tb-130 {
  padding: 130px 0;
}

.p-tb-135 {
  padding: 135px 0;
}

.p-tb-140 {
  padding: 140px 0;
}

.p-tb-145 {
  padding: 145px 0;
}

.p-tb-150 {
  padding: 150px 0;
}

.p-tb-155 {
  padding: 155px 0;
}

.p-tb-160 {
  padding: 160px 0;
}

.border-top-1 {
  border-top: 1px solid #ddd;
}

/* ===== Custom overrides: modern header design ===== */
.header.header--1 { 
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  background: #fff;
}

/* Top bar styling */
.header__top.header__top--style-1 {
  background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
  border-bottom: 1px solid #cbd5e1;
  padding: 12px 0;
  font-size: 14px;
  color: #475569;
  font-weight: 500;
}

.header__top-content { 
  align-items: center; 
  justify-content: space-between;
}

.header__top-content--left .contact_cms {
  display: flex;
  align-items: center;
  gap: 20px;
}

.header__top-content--left .cms1 {
  color: #64748b;
  font-weight: 500;
}

.header__top-content--left .cms2 {
  color: #1e293b;
  font-weight: 600;
}

.header__top-content--right .user-info,
.header__top-content--right { 
  display: flex;
  align-items: center;
  gap: 12px; 
}

.user-set-role__button {
  color: #3b82f6 !important;
  padding: 8px 16px !important;
  border: 2px solid #3b82f6;
  border-radius: 25px;
  line-height: 1;
  text-decoration: none;
  font-weight: 600;
  font-size: 13px;
  transition: all .3s ease;
  background: transparent;
}
.user-set-role__button:hover { 
  background: #3b82f6; 
  color: #fff !important; 
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

/* Main header section */
.header__middle.header__top--style-1 { 
  background: #ffffff; 
  padding: 24px 0;
  border-bottom: 1px solid #e2e8f0;
}

.header__logo h3 { 
  margin: 0; 
  font-weight: 800; 
  color: #1e293b;
  font-size: 28px;
  letter-spacing: -0.5px;
}


.header__search-form { 
  width: 100%; 
  max-width: 500px;
  margin: 0 auto;
}

.header__search-input {
  display: flex;
  align-items: center;
  gap: 0;
  background: #f8fafc;
  padding: 4px;
  border-radius: 50px;
  border: 2px solid #e2e8f0;
  transition: all .3s ease;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
}

.header__search-input:focus-within {
  border-color: #3b82f6;
  box-shadow: 0 4px 16px rgba(59, 130, 246, 0.15);
}

.header__search-input input[type="search"] {
  flex: 1 1 auto;
  background: transparent;
  border: none;
  outline: none;
  padding: 14px 20px;
  font-size: 15px;
  color: #1e293b;
  font-weight: 500;
}

.header__search-input input[type="search"]::placeholder {
  color: #94a3b8;
  font-weight: 400;
}

.btn.btn--submit.btn--blue { 
  background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%); 
  border: none; 
  padding: 14px 24px; 
  border-radius: 50px; 
  text-transform: none; 
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.5px;
  transition: all .3s ease;
  box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

.btn.btn--submit.btn--blue:hover { 
  background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(59, 130, 246, 0.4);
}

/* Navigation styling */
.header-menu { 
  position: sticky; 
  top: 0; 
  z-index: 1000; 
  background: linear-gradient(135deg, #1e40af 0%, #1e3a8a 100%);
  box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}

.header-menu .header__nav { 
  display: flex; 
  gap: 8px; 
  justify-content: center;
  padding: 0 20px;
}

.header-menu .header__nav-link { 
  color: #ffffff; 
  padding: 16px 20px; 
  font-weight: 600; 
  letter-spacing: 0.5px; 
  border-radius: 12px; 
  transition: all .3s ease; 
  height: auto; 
  line-height: normal;
  text-decoration: none;
  position: relative;
  font-size: 14px;
}

.header-menu .header__nav-link:hover { 
  background: rgba(255,255,255,0.15); 
  color: #ffffff; 
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(255,255,255,0.2);
}

.header-menu .header__nav-link::after {
  content: '';
  position: absolute;
  bottom: 8px;
  left: 50%;
  width: 0;
  height: 2px;
  background: #60a5fa;
  transition: all .3s ease;
  transform: translateX(-50%);
}

.header-menu .header__nav-link:hover::after {
  width: 60%;
}

/* Action buttons styling */
.header__wishlist-box {
  display: flex;
  align-items: center;
  gap: 16px;
}

.header__wishlist-link,
.header-add-cart a {
  position: relative;
  color: #64748b;
  font-size: 20px;
  transition: all .3s ease;
  padding: 8px;
  border-radius: 50%;
}

.header__wishlist-link:hover,
.header-add-cart a:hover {
  color: #3b82f6;
  background: rgba(59, 130, 246, 0.1);
  transform: scale(1.1);
}

.wishlist-item-count.pos-absolute { 
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); 
  color: #fff; 
  min-width: 20px; 
  height: 20px; 
  line-height: 20px; 
  font-size: 11px; 
  border-radius: 50%;
  font-weight: 700;
  top: -5px;
  right: -5px;
  box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
}

/* Responsive design */
@media (max-width: 991.98px) {
  .header__top.header__top--style-1 { display: none; }
  .header__middle.header__top--style-1 { padding: 16px 0; }
  .header__search-input { border-radius: 12px; }
  .header__logo h3 { font-size: 24px; }
  .header-menu .header__nav { padding: 0 10px; }
  .header-menu .header__nav-link { padding: 12px 16px; font-size: 13px; }
}

@media (max-width: 768px) {
  .header__search-form { max-width: 100%; }
  .header__search-input input[type="search"] { padding: 12px 16px; font-size: 14px; }
  .btn.btn--submit.btn--blue { padding: 12px 20px; font-size: 13px; }
}

/* ===== Brand Icons Styling ===== */
.brand-item {
  margin-bottom: 20px;
  padding: 15px 10px;
  transition: all .3s ease;
  border-radius: 12px;
}

.brand-item:hover {
  background: #f8fafc;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.brand-link {
  text-decoration: none;
  color: inherit;
  display: block;
}

.brand-icon {
  font-size: 32px;
  margin-bottom: 8px;
  display: block;
  transition: transform .3s ease;
}

.brand-item:hover .brand-icon {
  transform: scale(1.1);
}

.brand-name {
  font-size: 14px;
  font-weight: 600;
  color: #1e293b;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.brand-item:hover .brand-name {
  color: #3b82f6;
}

/* Responsive brand icons */
@media (max-width: 768px) {
  .brand-icon {
    font-size: 28px;
  }
  
  .brand-name {
    font-size: 12px;
  }
}