@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css");
a{text-decoration:none!important;}
li{list-style-type: none!important;}
.heading1{font-size: 2.5rem;} .heading2{font-size: 2rem;} .heading3{font-size: 1.75rem;} .heading4{font-size: 1.5rem;} .heading5{font-size: 1.25rem;} .heading6{font-size: 1rem;}
.fullpad{padding:0!important; margin:0!important;}
.medium{font-family: helvetica, sans-serif;}	
.smallfnt{font-size: 13px;}
.forumuser {position: relative;}
.form-group {margin-bottom: 0rem !important;}
.forumuser input[type="search"] {
	padding: 11px 27px;
	display: inline-block;
	border: 1px solid #ccc;
	box-sizing: border-box;
	border-radius: 4px;
	font-size: 14px;
	width: 100%;}
.forumuser i {
	position: absolute;
	left: 8px;
	top: 16px;
	color: #0075e7;
	font-size: 13px;}
.product-box {
	background: #FFFFFF;
	display: flex;
	padding: 12px 10px;}	
.transparent-blue-button {
	border: 1px solid #0077D1;
	font-size: 12px;
	border-radius: 30px;
	padding: 7px 12px;
	color: #0077D1 !important;}
.transparent-blue-button2 {
	border: 1px solid #0077D1;
	font-size: 11px;
	border-radius: 30px;
	padding: 7px 8px;
	color: #0077D1 !important;}	
.product-img{width:80px; border-radius: 10px;}	
.fnt1{font-size: 14px;}
.fnt2{font-size: 13px; font-weight: bold;}
.fnt3{font-size: 13px; color:#6f6f6f;}
.fnt4 {font-size: 13px; color: #d3d3d3;}
.top-fixed {
	position: sticky;
	top: 0;
	width: 100%;
	z-index: 5;}
.bottom-fixed {
	position: fixed;
	bottom: 0;
	width: 100%;}
.bottom-fixed1 {
	position: fixed;
	bottom: 45px;
	width: 100%;}	
.balancefnt{font-size: 13px;}	
.feature-gd {
	background: white;
	padding: 7px;
	border-radius: 8px;
	box-shadow: 4px 5px 10px rgb(35 35 35 / 75%);}	
.icon i {
	color: #db241e;
	font-size: 25px;
	background: rgb(13 54 159 / 9%);
	width: 35px;
	height: 35px;
	line-height: 35px;
	border-radius: 50%;
	text-align: center;}	
.fixed-bottom-clr{background-color: #0077D1;}	
.badges {
	position: absolute;
	background-color: #f10a0a;
	border-radius: 50%;
	color: #fff;
	width: 20px;
	height: 20px;
	top: -10px;
	right: 80px;
	font-size: 10px !important;
	bottom: 11px;
	border: 2px solid white;}
.badges1 {
	position: absolute;
	background-color: #f10a0a;
	border-radius: 37%;
	color: #fff;
	width: 20px;
	height: 20px;
	font-size: 9px !important;
	bottom: 59%;
	border: 2px solid white;
	left: 22%;}	
.badgescntr {align-items: center;display: flex; place-content: center;}
.line{border-bottom:1px solid #ababab;}
.order-card{background-color: #eee;}
.clr-red{color: #ff5c5c; font-size: 12px;}
.bin-clr{color:#6f6f6f;}
.dropdown-menu {width:350px; top:12px!important;}
.drop-brdr{border-bottom: 1px solid #eaeaea !important;}
.desktop-fixed{position: fixed; bottom: 0; left:35%;}
.desktop-fixed1{position: fixed; bottom: 0; width: 100%; z-index: 999;}
.fixed-bottom-clr1{background-color: #0077D1; padding:10px 10px; border-radius: 50px; color: #fff;}	
.deskpad{padding:15px 6px 0 6px!important;}
.changeicns {
	width: 15px;
	height: 15px;
	background: #fff;
	border-radius: 4px;
	line-height: 9px;
	text-align: center;
	color: #0077d1;
	border: none;}
.icnsfnt{font-size: 11px;}	
.number{border: 1px solid #0077d1;
	border-radius: 50px;
	width: 75px;
	float: right;
	text-align: center;
	padding: 2px;}	
.number input {
	height: 25px;
	width: 30px;
	text-align: center;
	font-size: 13px;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-block;}
.box-scroll{height:300px; overflow-y: hidden; overflow: scroll; scrollbar-width:thin;}
.order-btn{background-color:#0077d1; color:#fff; border-color:#0077d1; padding:8px 16px; border-radius: 5px;}  
.category-para {max-width: 400px;}
.category-bg{background-color:#0077d1; background-color: #0077d1; border-radius: 0 25px 25px 0; color: #fff; }
.navbg{background-color:#0077d1;}
.navfont{font-family: 'Arial', sans-serif; font-weight: 600; font-size: 16px; letter-spacing: 1px;}
.navbar-light .navbar-nav .nav-link {color:white!important;}  
.nav-straight li {display: inline-block; margin-right: 15px;}
.signin_button {
	background-color: #FFF;
	color: #000 !important;
	padding: 5px 12px;
	border-radius: 5px;
	font-size: 14px;}
.navdrp .dropdown-menu{width:220px!important; top:59px!important;}
.inner-login{width: 35px; position: absolute; left: 8px; top: 20px;}
.navdrp .dropdown-item{padding: 7px 15px!important;}
.navdrp .dropdown-menu-right {right: -18px !important; left: auto;}
.smallborder1 {width: 170px; height: 1px; margin: 0 10px; background-color: #A0A0A06E;}
/*.navdrp .dropdown-menu::before {
	content: '';
	display: block;
	border-top: 12px solid transparent;
	border-left: 18px solid #0077d1;
	border-bottom: 12px solid transparent;
	position: absolute;
	top: -7%;
	right: 34px;
	transform: rotate(270deg);
	opacity: 1;}*/
.login-profile {width: 35px; height: 35px;}	
.login-label {font-size: 14px; color: #999;}
.box .form-control {
    padding: 15px 5px;
    border: 1px solid #3b67b3;
    border-radius: 0px;
    border-top: none;
    border-left: none;
    border-right: none;}
.form-control:focus {box-shadow: none; border: 2px solid #0077d1!important;}
.loginbtn{background-color: #0077d1; color: #fff; padding: 8px 25px;  border:2px solid #0077d1; transition: .15s ease-in-out;}
.loginbtn:hover{background-color: #fff; color: #0077d1; }
.frgtpswd{font-size: 13px; text-decoration: underline!important; color:#222!important;}
.rgstr{font-size: 14px; color:#222;}
.rgstr:hover{color:#222; text-decoration: underline;}
.btn-secondary{background-color: #fff!important; border-color:#fff!important; color:#000!important;}
input::placeholder {font-size: 13px;}
.w0{width:0%;}
.fixed{position:fixed; z-index:2;}
.priceicn{width:50px;}
.priceicn2 {width: 120px;}
.point{bottom:10px; left:10px;}
.point1{bottom:70px; left:10px;}
.point2{bottom: 15px; right: 10px;}

@media (min-width:1px) and (max-width:767.98px){
.ribbon-top-left span {right: 0px!important; top: 6px!important; transform: rotate(-37deg)!important; left: -98px!important;}
.ribbon-top-left {top: 12px!important; left: 11px!important;}
.ribbon span{padding: 5px 0!important; font-size: 8px!important;}
.category-para {max-width: 250px; font-size: 12px;}
.time-of-year1 .tooltip1 {left: -148px!important; width: 200px;}
.time-of-year1 .tooltip1::after{left: 81%!important;}
}	

@media (min-width:768px) and (max-width:991.98px){
.ribbon-top-left {top: 24px!important; left: 15px!important;}
.ribbon-top-left::before {top: -8px; right: 42px;}
.ribbon span {width: 240px; padding: 8px 0;}
.ribbon-top-left span {right: 13px; top: 8px; transform: rotate(-46deg); left: -98px;}
.desktop-fixed {left: 23%;}
.badges1 {bottom: 56%; left: 32%;}
.category-para {max-width: 400px; font-size: 13px;}
}

*{transition: all 300ms cubic-bezier(0.4, 0, 0.2, 1);}
.category_btn{background-color: #fff;
	color: #000;
	padding: 5px 8px;
	font-size: 14px;
	border-radius: 5px;
	width: 110px;
	height: 30px;}
.category-box > ul {
	display: block;
	letter-spacing: .5px;
	text-transform: uppercase;
	font-size: 15px;
	list-style: none;
	width: 100%;}
.category-box > ul > li {
	padding: 5px 0;
	border-bottom: .5px dashed #9ea6b9;
	background-color: #fff;
	transition: background-color 30ms linear;}	
.category-box > ul > li:hover {	background-color: #ececec7a;}
.ribbon {
	width: 120px;
	height: 90px;
	overflow: hidden;
	position: absolute;}
.ribbon::before,
.ribbon::after {
	position: absolute;
	z-index: -1;
	content: '';
	display: block;
	border: 5px solid #2980b9;}
.ribbon span {
	position: absolute;
	display: block;
	width: 230px;
	padding: 8px 0;
	background-color: #3498db;
	box-shadow: 0 5px 10px rgba(0,0,0,.1);
	color: #fff;
	font: 700 18px/1 'Lato', sans-serif;
	text-shadow: 0 1px 1px rgba(0,0,0,.2);
	text-transform: uppercase;
	text-align: center;
	font-size: 11px;
	letter-spacing: 1px;}
.ribbon-top-left {top: 15px; left: 6px;}
.ribbon-top-left::before,
.ribbon-top-left::after {border-top-color: transparent; border-left-color: transparent;}
.ribbon-top-left::before {top: 0; right: 0;}
.ribbon-top-left::after {bottom: 0; left: 0;}
.ribbon-top-left span {right: 5px; top: 6px; transform: rotate(-42deg); left: -91px;}
.time-of-year {
	color: #fff;
	font-size: 18px;
	text-align: center;
	width: 45px;
	transform: translateZ(0);
	-webkit-transform: translateZ(0);}
.time-of-year .tooltip {
	border-radius: 3px;
	bottom: 41px;
	font-size: 20px;
	display: block;
	left: -213px;
	opacity: 0;
	padding: 15px;
	pointer-events: none;
	position: absolute;
	width: 320px;
	z-index: 1102;
	-webkit-transform: translateY(10px);
	transform: translateY(10px);
	-webkit-transition: all .7s ease-out;
	transition: all .7s ease-out;}
.time-of-year .tooltip::after {
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #2980b9;
	bottom: 5px;
	content: " ";
	height: 0;
	left: 75%;
	margin-left: -13px;
	position: absolute;
	width: 0;
	transform: rotate(0deg);}
.time-of-year .visible_tooltip {
	opacity: 1;
	pointer-events: auto;
	-webkit-transform: translateY(0px);
	transform: translateY(0px);}
.dropbtn {font-size: 16px;border: none;cursor: pointer; width:100%;}
.dropdown {position: relative;display: inline-block;text-align:center; width: 100%; z-index:2;}
.dropdown-content {display: none; position: absolute; overflow: auto; top: 35px; background-color:white; width: 100%; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; height: 300px;}
.dropdown-content li a {color:black; padding: 5px 10px; text-decoration: none; display: block; font-size: 13px;}
.ulmobile{list-style-type: none; padding: 0;}
.show {display: block;}
.dropdown-content {display: block;visibility: hidden;opacity:0;-webkit-transform-origin: top;transform-origin: top;
	-webkit-animation-fill-mode: forwards;animation-fill-mode: forwards; -webkit-transform: scale(1, 0); transform: scale(1, 0);
	transition: all 1s linear;-webkit-transition: all .2s linear;}
.dropdown-content.show {display: block;visibility: visible;opacity:1;-webkit-transform: scale(1, 1);transform: scale(1, 1);}	
.canvas-sticky{position: sticky; top: 0; background: #2980b9; border-bottom: 1px solid #d7d7d7;}
.canvas-btn-order{background-color: #2980b9; color:#fff; padding:10px; font-size: 15px;}	
.canvas-fixed{position:sticky; bottom:0; width: 100%; z-index: 999; background-color: #fff; border-top: 1px solid #c1c1c1;}
.inputbox-border{border: 2px solid #0077d1;}
.time-of-year1 {
	font-size: 18px;
	text-align: center;
	width: 60px;
	transform: translateZ(0);
	-webkit-transform: translateZ(0);}
.time-of-year1 .tooltip1 {
	border-radius: 3px;
	bottom: 41px;
	font-size: 20px;
	display: block;
	left: -136px;
	opacity: 0;
	padding: 15px;
	pointer-events: none;
	position: absolute;
	width: 215px;
	z-index: 1102;
	-webkit-transform: translateY(10px);
	transform: translateY(10px);
	-webkit-transition: all .7s ease-out;
	transition: all .7s ease-out;}
.time-of-year1 .tooltip1::after {
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #2980b9;
	bottom: 5px;
	content: " ";
	height: 0;
	left: 75%;
	margin-left: -13px;
	position: absolute;
	width: 0;
	transform: rotate(0deg);}
.time-of-year1:hover .tooltip1 {
	opacity: 1;
	pointer-events: auto;
	-webkit-transform: translateY(0px);
	transform: translateY(0px);}
.time-of-year2 {
	font-size: 18px;
	text-align: center;
	width: 60px;
	transform: translateZ(0);
	-webkit-transform: translateZ(0);}
.time-of-year2 .tooltip2 {
	border-radius: 3px;
	bottom: 41px;
	font-size: 20px;
	display: block;
	left: -136px;
	opacity: 0;
	padding: 15px;
	pointer-events: none;
	position: absolute;
	width: 215px;
	z-index: 1102;
	-webkit-transform: translateY(10px);
	transform: translateY(10px);
	-webkit-transition: all .7s ease-out;
	transition: all .7s ease-out;}
.time-of-year2 .tooltip2::after {
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 10px solid #2980b9;
	bottom: 5px;
	content: " ";
	height: 0;
	left: 75%;
	margin-left: -13px;
	position: absolute;
	width: 0;
	transform: rotate(0deg);}
.time-of-year2 .tooltip2 {
	opacity: 1;
	pointer-events: auto;
	-webkit-transform: translateY(0px);
	transform: translateY(0px);}
.card-highlight{box-shadow: 0px 0px 10px rgba(0, 119, 209, 0.79);
	border-radius: 5px;
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	z-index: 99;
	background: #fff;}

.input-group .select2-container { width: 75% !important; }
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type=number] {
  -moz-appearance: textfield;
  appearance: textfield;
}