/******************************************************************
  Template Name: Male Fashion
  Description: Male Fashion - ecommerce teplate
  Author: Colorib
  Author URI: https://www.colorib.com/
  Version: 1.0
  Created: Colorib 
******************************************************************/

/*------------------------------------------------------------------
[Table of contents]

1.  Template default CSS
	1.1	Variables
	1.2	Mixins
	1.3	Flexbox
	1.4	Reset
2.  Helper Css
3.  Header Section
4.  Hero Section
5.  Banner Section
6.  Product Section
7.  Intagram Section
8.  Latest Section
9.  Contact
10.  Footer Style
-------------------------------------------------------------------*/

/*----------------------------------------*/
/* Template default CSS
/*----------------------------------------*/
.prod-title{
	font-weight: 400!important;
}
.product-count {
	margin-bottom: 10px;
	display: flex;
   
  }
  
.product-count a {
	text-decoration: none;
	font-weight: 500;
	color: black;
}

.button-count {
	display: flex; 
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 25px;
	height: 25px;
	background-color: #B3CC23;
	color: white;
	font-size: 17px;
	line-height: 30px;
	text-align: center;
	border: none;
	outline: none;
}
.button-count:first-child{
	border-top-left-radius: 100%;
	border-bottom-left-radius: 100%;
}

.button-count:last-child{
	border-top-right-radius: 100%;
	border-bottom-right-radius: 100%;
}
.button-count:active {
	background-color: #5d721a;
}
.button-count:focus{
	outline: none!important;

}
.number-product {
	width: 45px;
	height: 25px;
	font-size: 13pt;
	border: none;
	text-align: center;
}
:disabled {
	background-color: silver;
}  
.after-discount{
	color: red!important;
	text-decoration: line-through;
	opacity: 50%;
	font-size: 10pt;
}
.cont-shop{
	outline: none!important;

	color: #5d721a!important;
}
.cont-shop:hover{
	color: white!important;
}
.modal-close{
	outline: none!important;

	color: #5d721a!important;
	background-color: white!important;
}
.modal-close:hover{
	background-color: #B3CC23!important;
	color: white!important;
}

.form-control:focus{
    border-color: #B3CC23;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px #b3cc237e;
    outline: 0 none!important;
}
.form-control{
	height: 40px;
}


a:hover,
a:focus {
	text-decoration: none;
	outline: none;
	color: #ffffff;
}

ul,
ol {
	padding: 0;
	margin: 0;
}

/*---------------------
  Helper CSS
-----------------------*/

.section-title {
	margin-bottom: 45px;
	text-align: center;
}


.set-bg {
	background-repeat: no-repeat;
	background-size: cover;
	background-position: top center;
}

.spad {
	padding-top: 100px;
	padding-bottom: 100px;
}


/* buttons */

.primary-btn {
	display: inline-block;
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	padding: 14px 30px;
	color: #ffffff;
	background: #000000;
	letter-spacing: 4px;
}

.site-btn {
	font-size: 14px;
	color: #ffffff;
	background: #111111;
	font-weight: 700;
	border: none;
	text-transform: uppercase;
	display: inline-block;
	padding: 14px 30px;
}


.spacial-controls {
	position: fixed;
	width: 111px;
	height: 91px;
	top: 0;
	right: 0;
	z-index: 999;
}

.spacial-controls .search-switch {
	display: block;
	height: 100%;
	padding-top: 30px;
	background: #323232;
	text-align: center;
	cursor: pointer;
}

#discount_apply{
	background-color:#b3cc23;
	border-top-right-radius: 50px;
	border-bottom-right-radius: 50px;
	outline: none;

}
#discount_apply:active{
	background-color:#5d721a;
}


/*---------------------
  Shopping Cart
-----------------------*/

.shopping__cart__table {
	margin-bottom: 30px;
}

.shopping__cart__table table {
	width: 100%;
}

.shopping__cart__table table thead {
	border-bottom: 1px solid #f2f2f2;
}

.shopping__cart__table table thead tr th {
	color: #111111;
	font-size: 16px;
	font-weight: 700;
	text-transform: uppercase;
	padding-bottom: 25px;
}

.shopping__cart__table table tbody tr {
	border-bottom: 1px solid #f2f2f2;
}

.shopping__cart__table table tbody tr td {
	padding-bottom: 30px;
	padding-top: 30px;
}

.shopping__cart__table table tbody tr td.product__cart__item {
	width: 400px;
}

.shopping__cart__table table tbody tr td.product__cart__item .product__cart__item__pic {
	float: left;
	margin-right: 30px;
}

.shopping__cart__table table tbody tr td.product__cart__item .product__cart__item__text {
	overflow: hidden;
	padding-top: 21px;
}

.shopping__cart__table table tbody tr td.product__cart__item .product__cart__item__text h6 {
	color: #111111;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 10px;
}

.shopping__cart__table table tbody tr td.product__cart__item .product__cart__item__text h5 {
	color: #0d0d0d;
	font-weight: 700;
}

.shopping__cart__table table tbody tr td.quantity__item {
	width: 175px;
}

.shopping__cart__table table tbody tr td.quantity__item .quantity .pro-qty-2 {
	width: 80px;
}

.shopping__cart__table table tbody tr td.quantity__item .quantity .pro-qty-2 input {
	width: 50px;
	border: none;
	text-align: center;
	color: #111111;
	font-size: 16px;
}

.shopping__cart__table table tbody tr td.quantity__item .quantity .pro-qty-2 .qtybtn {
	font-size: 16px;
	color: #888888;
	width: 10px;
	cursor: pointer;
}

.shopping__cart__table table tbody tr td.cart__price {
	color: #111111;
	font-size: 18px;
	font-weight: 700;
	width: 140px;
}

.shopping__cart__table table tbody tr td.cart__close i {
	font-size: 18px;
	color: #111111;
	height: 40px;
	width: 40px;
	background: #f3f2ee;
	border-radius: 50%;
	line-height: 40px;
	transition: all ease 0.5s;
	text-align: center;
}
.shopping__cart__table table tbody tr td.cart__close i:hover{
	background-color: #dfded8;
}
.continue__btn.update__btn {
	text-align: right;
}

.continue__btn.update__btn a {
	color: #ffffff;
	background: #111111;
	border-color: #111111;
}

.continue__btn.update__btn a i {
	margin-right: 5px;
}

.continue__btn a {
	color: #111111;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	border: 1px solid #e1e1e1;
	padding: 14px 35px;
	display: inline-block;
}

.cart__discount {
	margin-bottom: 60px;
}

.cart__discount h6 {
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 35px;
}

.cart__discount form {
	position: relative;
}

.cart__discount form input {
	font-size: 14px;
	color: #b7b7b7;
	height: 50px;
	width: 100%;
	border: 1px solid #e1e1e1;
	border-radius: 50px;
	padding-left: 20px;
}

.cart__discount form input::-webkit-input-placeholder {
	color: #b7b7b7;
}

.cart__discount form input::-moz-placeholder {
	color: #b7b7b7;
}

.cart__discount form input:-ms-input-placeholder {
	color: #b7b7b7;
}

.cart__discount form input::-ms-input-placeholder {
	color: #b7b7b7;
}

.cart__discount form input::placeholder {
	color: #b7b7b7;
}

.cart__discount form button {
	font-size: 14px;
	color: #ffffff;
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
	background: #111111;
	padding: 0 30px;
	border: none;
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
}

.cart__total {
	background: #f3f2ee;
	padding: 35px 40px 40px;
	border-radius: 5px;
	-webkit-box-shadow: 0px 0px 41px 5px #5d721a78;
	-moz-box-shadow: 0px 0px 41px 5px #5d721a78;
	box-shadow: 0px 0px 41px 5px #5d721a78;

}

.cart__total h6 {
	color: #111111;
	text-transform: uppercase;
	margin-bottom: 12px;
}

.cart__total ul {
	margin-bottom: 25px;
}

.cart__total ul li {
	list-style: none;
	font-size: 16px;
	color: #444444;
	line-height: 40px;
	overflow: hidden;
}

.cart__total ul li span {
	font-weight: 700;
	color: #5d721a;
	float: right;
}

.cart__total .primary-btn {
	display: block;
	padding: 12px 10px;
	text-align: center;
	letter-spacing: 2px;
}

/*---------------------
  Checkout
-----------------------*/

.address_title {
	color: #0d0d0d;
	font-size: 14px;
	border-top: 2px solid #B3CC23;
	background: #f5f5f5;
	padding: 23px 30px 18px;
	margin-bottom: 50px;
}



.checkout__title {
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
	border-bottom: 1px solid #e1e1e1;
	padding-bottom: 25px;
	margin-bottom: 30px;
}

.checkout__input__checkbox label {
	font-size: 15px;
	color: #0d0d0d;
	position: relative;
	padding-left: 30px;
	cursor: pointer;
	margin-bottom: 16px;
	display: block;
}

.checkout__input__checkbox label input {
	position: absolute;
	visibility: hidden;
}

.checkout__input__checkbox label input:checked~.checkmark {
	border-color: #e53637;
}

.checkout__input__checkbox label input:checked~.checkmark:after {
	opacity: 1;
}

.checkout__input__checkbox label .checkmark {
	position: absolute;
	left: 0;
	top: 3px;
	height: 14px;
	width: 14px;
	border: 1.5px solid #d7d7d7;
	content: "";
	border-radius: 2px;
}

.checkout__input__checkbox label .checkmark:after {
	position: absolute;
	left: 1px;
	top: -3px;
	width: 14px;
	height: 7px;
	border: solid #e53637;
	border-width: 1.5px 1.5px 0px 0px;
	-webkit-transform: rotate(127deg);
	-ms-transform: rotate(127deg);
	transform: rotate(127deg);
	content: "";
	opacity: 0;
}

.checkout__input__checkbox p {
	color: #0d0d0d;
	font-size: 14px;
	line-height: 24px;
	margin-bottom: 22px;
}

.checkout__order {
	background: #f3f2ee;
	padding: 30px;
}

.checkout__order .order__title {
	color: #111111;
	font-weight: 700;
	text-transform: uppercase;
	border-bottom: 1px solid #d7d7d7;
	padding-bottom: 25px;
	margin-bottom: 30px;
}

.checkout__order p {
	color: #444444;
	font-size: 16px;
	line-height: 28px;
}

.checkout__order .site-btn {
	width: 100%;
	margin-top: 8px;
}

.checkout__order__products {
	font-size: 16px;
	color: #111111;
	overflow: hidden;
	margin-bottom: 18px;
}

.checkout__order__products span {
	float: right;
}


.checkout__total__all {
	border-top: 1px solid #d7d7d7;
	border-bottom: 1px solid #d7d7d7;
	padding: 15px 0;
	margin-bottom: 26px;
}

.checkout__total__all li {
	list-style: none;
	font-size: 16px;
	color: #111111;
	line-height: 40px;
	overflow: hidden;
}

.checkout__total__all li span {
	color: #e53637;
	font-weight: 700;
	float: right;
}
.product__cart__item__pic img{
	width: 100px;
}

.stepper-wrapper {
	margin-top: auto;
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
  }
.stepper-item {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	flex: 1;

@media (max-width: 768px) {
	font-size: 12px;
}
}

.stepper-item::before {
	position: absolute;
	content: "";
	border-bottom: 2px solid white;
	width: 100%;
	top: 20px;
	left: -50%;
	z-index: 2;
}

.stepper-item::after {
	position: absolute;
	content: "";
	border-bottom: 2px solid white;
	width: 100%;
	top: 20px;
	left: 50%;
	z-index: 2;
}

.stepper-item .step-counter {
	position: relative;
	z-index: 5;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: white;
	margin-bottom: 6px;
}

.stepper-item.active {
	font-weight: bold;

}
@keyframes slideRight {
	0% {
	  width: 0%;
	}
	100% {
	  width: 100%;
	}
  }

  
.stepper-item.completed .step-counter {
	background-color: #B3CC23;
}
.stepper-item.done .step-counter {
	background-color: #B3CC23!important;
}

.stepper-item.completed::after {
	position: absolute;
	content: "";
	border-bottom: 2px solid #b3cc23;
	width: 100%;
	top: 20px;
	left: 50%;
	
	animation: 2s ease-out 0s 1 slideRight;

	z-index: 3;
}
.stepper-item.done::after {
	position: absolute;
	content: "";
	border-bottom: 2px solid #b3cc23;
	width: 100%;
	top: 20px;
	left: 50%;
	

	z-index: 3;
}
.stepper-item:first-child::before {
	content: none;
}
.stepper-item:last-child::after {
	content: none;
}
.step-name{
	color: white;
}
.emptydiv{
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	opacity: 40%;
}
.emptybasket{
	font-size: 200px;
	margin: 20px;
	color: #B3CC23;
}
#saveli{
	background-color: #b3cc2390;
	padding: 0px 5px 0px 5px;
	margin: 5px 0px 5px  0px;
	border-radius: 3px;
}
#couponli{
	margin: 5px 0px 5px  0px;
	background-color: #5d721a90;
	padding: 0px 5px 0px 5px;
	border-radius: 3px;
}
#removecoupon{
	transition: all 0.5s;
}
#removecoupon:hover{
	cursor:pointer;
	color: rgb(162, 29, 29);
}

.address_cart {
	color: #0d0d0d;
	font-size: 14px;
	background: #f5f5f5!important;
	padding: 18px 25px 10px;
	margin-bottom: 50px;
}
.address_cart_small {
	color: #0d0d0d;
	font-size: 14px;
	background: #f5f5f5!important;
	padding: 10px 18px 5px;
	transition: all ease 0.5s;
}

.address_cart_small:hover {
	cursor: pointer;
	padding: 6px 14px 2px;
	-webkit-box-shadow: 0px 0px 41px 5px #5d721a78;
	-moz-box-shadow: 0px 0px 41px 5px #5d721a78;
	box-shadow: 0px 0px 41px 5px #5d721a78;
}
/*--------------------------------- Responsive Media Quaries -----------------------------*/



@media only screen and (min-width: 768px) and (max-width: 991px) {

	.shop__sidebar {
		padding-right: 0;
		padding-top: 40px;
	}
	.cart__discount {
		margin-top: 40px;
	}
	
}

/* Wide Mobile = 480px */

@media only screen and (max-width: 767px) {
	
	.shopping__cart__table {
		overflow-y: auto;
	}
	.shopping__cart__table table tbody tr td.product__cart__item .product__cart__item__pic {
		float: none;
		margin-right: 0;
	}
	.continue__btn {
		text-align: center;
	}
	.continue__btn.update__btn {
		text-align: center;
		margin-top: 20px;
	}
	.cart__discount {
		margin-top: 40px;
	}
	.checkout__order {
		margin-top: 20px;
	}

	
}

/* Small Device = 320px */

@media only screen and (max-width: 479px) {
	.cart__total {
		padding: 35px 30px 40px;
	}
	.after-discount{
		display: flex;
		align-items: center;
	}
	.number-product{
		width: 30px;
	}
	.emptybasket{
		font-size: 150px;
		margin: 20px;
	}
	.emptytext{
		text-transform: uppercase;
		font-size: 10pt;
	}

}