:root {
	--muted: #b0b0b0;
	--white: #ffffff;
	--dark: #0c1a32;
	--dark-regular: #333;
	--dark-light: #1e1d23;
	--body: #fff;
	--border: #e5e5e5;
	
	--primary: #6993ff;
	--primary-hover: #4d7fff;
	--primary-light: rgba(105, 147, 255,0.1);
	
	--secondary: #05213d;
	--secondary-hover: #030c17;
	--secondary-light: rgba(7, 33, 60,0.1);
	
	--danger: #f64e60;
	--danger-hover: #f4253a;
	--danger-light: rgba(246, 78, 96,0.1);
	
	--success: #1bc5bd;
	--success-hover: #159d96;
	--success-light: rgba(27, 197, 189,0.15);
	
	--info: #3086CF;
	--info-hover: #1d507c;
	--info-light: #dfedf8;
	
	--warning: #ffa800;
	--warning-hover: #cc8800;
	--warning-light: rgba(255, 168, 0,0.1);



	--yellow: #ffcd02;
	--orange: #db731e;
	--red: #cd4414;
	
	--space: 20px;

	--bg-1:#faf9f7;
}

.row {
	margin-right: calc(-1 * var(--space) * 0.5);
	margin-left: calc(-1 * var(--space) * 0.5);
}
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-auto, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-auto, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-auto, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-auto, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-auto {
	padding-right: calc(var(--space) * 0.5);
	padding-left: calc(var(--space) * 0.5);
}
.mb-3, .my-3 {
	margin-bottom: var(--space) !important;
}
.cursor-pointer{
	cursor: pointer;
}

.bg {
	position: relative;
	height: 100vh;
}
.bg::after {
	content: '';
	background-image: url('../images/product.png');
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-size: 200px;
	opacity: 0.3;
}
.bg .container-fluid {
	position: relative;
	z-index: 1;
}
.icon_style {
	position: absolute;
	top: 50%;
	left: 50%;
	opacity: 0.1;
	font-size: 60px;
	transform: translate(-50% , -50%);
}
.card:hover{
     transform: scale(1.05);
     border: 1px solid var(--success);
  box-shadow: 0 10px 20px rgba(0,0,0,.12), 0 4px 8px rgba(0,0,0,.06);
   transform: scale(1);
}
.warhover{
	transition: 0.300s;
}
.f25{
	font-size: 25px;
}


@media only screen and (max-width: 360px) {
  body {
    font-size: 12px;

  }
 .warover_card .card-body{
  	padding: 10px;
  }
}
@media only screen and (max-width: 576px) {
  body {
    font-size: 12px;

  }
 .warover_card .card-body{
  	padding: 10px;
  }
}
/*@media only screen and (min-width: 768px) {
  body {
    font-size: 12px;

  }
  .warover_card .card-body{
  	padding: 10px;
  }
  
}*/

/*@media only screen and (max-width: 992px) {
  body {
    font-size: 12px;

  }
.warover_card .card-body{
  	padding: 10px;
  }
}*/