.card{

	background-color: #fff;
	border:none;
	border-radius: 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

}

.image-container{

	position: relative;
}

.image-container-detail{
	margin: 20px;
}

.thumbnail-image{
	/* border-radius: 10px !important; */
	border-top-left-radius: 10px !important;
	border-top-right-radius: 10px !important;
	object-fit: fill;
	height: 122px;
	width: 100%;
}


.discount{

	background-color: red;
	padding-top: 1px;
	padding-bottom: 1px;
	padding-left: 4px;
	padding-right: 4px;
	font-size: 10px;
	border-radius: 6px;
	color: #fff;
}

.wishlist{

	height: 25px;
	width: 25px;
	background-color: #eee;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 50%;
	box-shadow:  0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

.first{

	position: absolute;
	width: 100%;
	    padding: 9px;
}


.dress-name{
	font-size: 16px;
	font-weight: bold;
	color: #181645;
	/* width: 75%; */
}


.new-price{
	font-size: 17px;
	font-weight: bold;
	color: #181645;
	
}
.old-price{
	font-size: 8px;
	font-weight: bold;
	color: grey;
}



.creme{
	background-color: #fff;
	border: 2px solid grey;
	

}
.creme:hover {
	border: 3px solid grey;
}

.creme:focus {
	background-color: grey;

}


.red{
	background-color: #fff;
	border: 2px solid red;
	
}


.red:hover {
	border: 3px solid red;
}
.red:focus {
	background-color: red;
}



.blue{
	background-color: #fff;
	border: 2px solid #40C4FF;
}

.blue:hover {
	border: 3px solid #40C4FF;
}
.blue:focus {
	background-color: #40C4FF;
}
.darkblue{
	background-color: #fff;
	border: 2px solid #01579B;
}
.darkblue:hover {
	border: 3px solid #01579B;
}
.darkblue:focus {
	background-color: #01579B;
}
.yellow{
	background-color: #fff;
	border: 2px solid #FFCA28;
}
.yellow:hover {
	border-radius: 3px solid #FFCA28;
}
.yellow:focus {
	background-color: #FFCA28;
}


.item-size{
	width: 15px;
	height: 15px;
	border-radius: 50%;
	background: #fff;
	border: 1px solid grey;
	color: grey;
	font-size: 10px;
	text-align: center;
	align-items: center;
	display: flex;
	justify-content: center;
}


.rating-star{
	font-size: 10px !important;
}
.rating-number{
	font-size: 10px;
	color: grey;

}
.buy{
	font-size: 12px;
	color: purple;
	font-weight: 500;
}

.voutchers{
	background-color: #3d3892;
	border:none;
	border-radius: 10px;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	overflow: hidden;
	min-height: 30px;
	padding-top: 5px ;
	
	border-top-left-radius: 0px !important;
	border-top-right-radius: 0px !important;

}
.voutchers > a{
	text-decoration: none;  color: var(--bs-yellow) !important;
}
.voutcher-divider{
	color: var(--bs-yellow);
	display: flex;

}
.voutcher-left{
	width: 60%
}
.voutcher-name{
	color: grey;
	font-size: 9px;
	font-weight: 500;
}
.voutcher-code{
	padding-top: 0.75em;
	color: #181645;
	font-size: 18px;
	font-weight: bold;
}
.voutcher-right{
	/* width: 40%;	  */
	background-color: #181645;
	text-decoration: none;  color: var(--bs-yellow);
}
.voutcher-right:hover{
	/* width: 40%;	  */
	background-color: #3d3892;
	text-decoration: none;  color: var(--bs-yellow);
}

.discount-percent{
	font-size: 12px;
	font-weight: bold;
	position: relative;
	top: 5px;
}
.off{
	font-size: 14px;
	position: relative;
	bottom: 5px;
}
.event-card{
	margin-bottom: 20px;
}
.main{
	padding:0
}
.badge{
	color: black;
	border-color: #181645;
	border-width: 1em;
	font-size: 1em;
	font-weight: 400;
	padding: 0.7em;
}
.badge:hover,.badge.active{
	background-color: #181645;
	color: #FFCA28;
	border-color: #181645;
	font-size: 1em;
	font-weight: 400;
}
body{
	/* background: url('/static/main/img/tiles.png') ; */
	background-color: #ffffff !important;
}
.card-body>p{
	text-align: justify;
}
.header-span-event{
	font-size: larger;
	padding-left: 15px;
	padding-right: 15px; 
	display: inline-block;
	position: relative;
	font-size: larger;
}
.kanan-header{
	margin-left: -10px;
	--bs-border-opacity: 1;
	border-color: #181645 !important;
}
.header-span-event span{
	display: inline-block;
}

.border-indigo {
	--bs-border-opacity: 1;
	border-color: #181645 !important;
  }

  
@media (max-width: 576px) {
	.product-detail-container a .dress-name {
	  /* color: red !important; */
	}
  }