html, body { overflow-x: hidden; /* Prevent scroll on narrow devices */ } 
body { padding-top:85px; font-family: 'Overpass', Arial, sans serif; font-size:0.81rem; font-weight:300; letter-spacing:0.04rem; line-height:1.5rem; color:#7e828a; }

h1,h2,h3,h4,h5,h6 { font-family:'Montserrat', Arial, Sans Serif; font-weight:600; letter-spacing:0.2rem; }
/*h1.red,h2.red,h3.red,h4.red,h5.red,h6.red { font-family:'Montserrat', Arial, Sans Serif; font-weight:600; letter-spacing:0.2rem; color:#3d3e43; }*/

.txt_300_092 { letter-spacing:0.077rem; font-size:0.95rem; } /* Used in login input fields */
.txt_300_bld { color:#494b50; font-size:0.80rem; font-weight:600; }
.txt_300_lg { color:#494b50; font-size:1.1rem; }
.txt_400 { color:#494b50; font-size:0.86rem; }
.txt_400_bld { font-size:0.86rem; font-weight:600; }
.txt_400_lg { color:#494b50; font-size:0.9rem; }
.txt_600 { letter-spacing:0.05rem; font-weight:600; font-size:0.9rem; }
.txt_700 { letter-spacing:0.08rem; font-weight:700; font-size:0.9rem; /*font-family:'Montserrat', Arial, Sans Serif;*/ }
.txt_700_lg { letter-spacing:0.08rem; font-weight:700; font-size:0.92rem; /*font-family:'Montserrat', Arial, Sans Serif;*/ }
.txt_800_lg { letter-spacing:0.08rem; font-weight:800; font-size:1rem; /*font-family:'Montserrat', Arial, Sans Serif;*/ }
.txt_btn { letter-spacing:0.06rem; font-weight:400; font-size:0.9rem; color:#f2f2f2; }

.nav-link { display: block; padding: .5rem .8rem; }
.table { color:#7e828a; }
.table .thead-light th { color:#7e828a; font-weight:600; }
.logo { font-weight:600; letter-spacing:0.13rem; font-family:'Montserrat', Arial, Sans Serif; color:#e0a800 !important; }
.breadcrumb-item, .nav-tabs .nav-link { font-weight:600; font-size:0.85rem; letter-spacing:0.08rem; } /* font-family:'Montserrat', Sans Serif;  */
.breadcrumb-item.active { letter-spacing:0.08rem; font-weight:800; font-size:1rem; }

/* Navbar Items */
.navbar-expand-lg .navbar-nav .nav-link, .dropdown-item { 
	letter-spacing:0.09rem; font-size:0.9rem; font-weight:400; color:#f2f2f2; padding-top:0.5rem; padding-bottom:0.5rem; 
}

/* Navbar items spacing on left & right */
.navbar-expand-lg .navbar-nav .nav-link { padding-right: .32rem; padding-left: .32rem; }

/* Active Navbar option */
.navbar-dark .navbar-nav .active > .nav-link, .navbar-dark .navbar-nav .nav-link.active, .navbar-dark .navbar-nav .nav-link.show, .navbar-dark .navbar-nav .show > .nav-link { 
	color:#e0a800; font-weight:800; 
}
.dropdown-menu { background-color:#343a40; }
.custom_gutter > [class*='col-'] { padding-right:5px; padding-left:5px; }
input.qty { height:34px; width: 100px; font-weight:600; border:1px solid #ddd; border-radius:4px; display:inline-block; vertical-align: middle; }

.tab-content > .active { padding:10px; border-left: 1px solid #dee2e6; border-right: 1px solid #dee2e6; border-bottom: 1px solid #dee2e6; }
.dropdown-toggle::after { display: none; } /* suppress the default caret as I am using chevron from built-in svg */

.breadcrumb-item { font-weight:600; }

.card-body { padding:1rem; } */

table.transaction thead th, table.transaction .thead-light th, table.transaction th { font-weight:700; font-size:0.75rem; letter-spacing:0.1rem; padding:0.55rem; border: 1px solid #c5ccd3; }
table.transaction thead th { font-weight:700; font-size:0.75rem; letter-spacing:0.1rem; padding:0.55rem; border: 1px solid #f00; }
table.transaction td { padding:0.3rem; border: 1px solid #c5ccd3; color:#494b50; font-weight:400; }
table.transaction td.bld { padding:0.3rem; border: 1px solid #c5ccd3; color:#494b50; font-weight:600; }
table.transaction td.item { padding:0.2rem; border: 1px solid #c5ccd3; color:#494b50; font-weight:400; }
table.transaction td.right { padding:0.2rem; border: 1px solid #c5ccd3; color:#494b50; font-weight:400; text-align:right; }

table.profile thead th, table.profile .thead-light th, table.profile th { font-weight:700; font-size:0.75rem; letter-spacing:0.1rem; padding:0.55rem; border: 1px solid #c5ccd3; }
table.profile td { padding:0.6rem; border: 1px solid #c5ccd3; color:#494b50; font-weight:400; }
table.profile td.bld { padding:0.6rem; border: 1px solid #c5ccd3; color:#7e828a; font-weight:600; }

.img_size { width:100%; height:190px; }

#registeration_form input { font-weight:400; font-size:0.9rem; letter-spacing:0.1rem; }

/* Input box font login form */
input.login { font-size:0.9rem; font-weight:400; letter-spacing:0.04rem; } 

/* Fix autocomplete search dropdown - showing behind main navbar since z-index of navbar is 1030 */
.ui-autocomplete { z-index:2000; padding:10px; }

/* Autocomplete individual item */
.ui-menu .ui-menu-item { padding-top:10px; padding-bottom:10px; font-size:0.81rem; letter-spacing:0.05rem; font-weight:600; font-family: 'Overpass', sans serif; }

/* Autocomplete hover foucs on an item */
.ui-menu .ui-state-focus, .ui-menu .ui-state-active { color:#007bff; font-weight:600; }

hr { margin-top: 1rem; margin-bottom: 1rem; border: 0; border-top: 1px solid rgba(0, 0, 0, 0.1); }

/* Royal slider begins ********************************** */
#gallery-1 { width: 100%; -webkit-user-select: none; -moz-user-select: none; user-select: none; margin-bottom:1.2rem; }
.royalSlider { width:100%; height:300px; }
/* Royal slider ends ********************************** */

/* Smooth product slider begins ********************************** */
/* CSS for the loading div */
.sp-loading {
	text-align: center;
	max-width: 270px;
	padding: 15px;
	border: 5px solid #eee;
	border-radius: 3px;
	font-size: 12px;
	color: #888;
}

/* Element wrapper */
.sp-wrap {
	display: none;
	line-height: 0;
	font-size: 0;
	background: #eee;
	border: 5px solid #eee;
	border-radius: 3px;
	position: relative;
	margin: 0 25px 15px 0;
	float: left;
	width:100%;
}

/* Thumbnails */
.sp-thumbs { text-align:left; display:inline-block; margin-top:5px; }
.sp-thumbs img { min-height:50px; min-width:50px; max-width:50px; }

.sp-thumbs a:link, .sp-thumbs a:visited {
	width: 100px;
	height: 100px;
	overflow: hidden;
	opacity: .3;
	display: inline-block;
	background-size: cover;
	background-position: center;
	-webkit-transition: all .2s ease-out;
	-moz-transition: all .2s ease-out;
	-ms-transition: all .2s ease-out;
	-o-transition: all .2s ease-out;
	transition: all .2s ease-out;
	margin-right:5px;
}

.sp-thumbs a:hover { opacity:1; }

/* Styles for the currently selected thumbnail */
.sp-thumbs a:active, .sp-current { opacity: 1!important; position: relative; }

/* Image currently being viewed */
.sp-large {
	position: relative;
	overflow: hidden;
	top: 0;
	left: 0;
	width:100%;
}

.sp-large a img {
	max-width: 100%;
	height: auto;
	width:100%;
}

.sp-large a {
	display: block;
}

/* Panning Zoomed Image */
.sp-zoom {
	position: absolute;
	left: -50%;
	top: -50%;
	cursor: -webkit-zoom-in;
	cursor: -moz-zoom-in;
	cursor: zoom-in;
	display: none;
}
/* Lightbox */
.sp-lightbox {
	position: fixed;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	background: rgb(0, 0, 0);
	background: rgba(0, 0, 0, .9);
	z-index: 500;
	display: none;
	cursor: pointer;
}
.sp-lightbox img {
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	max-width: 90%;
	max-height: 90%;
	border: 2px solid #fff;
}
#sp-prev, #sp-next {
	position: absolute;
	top: 50%;
	margin-top: -25px;
	z-index: 501;
	color: #fff;
	padding: 14px;
	text-decoration: none;
	background: #000;
	border-radius: 25px;
	border: 2px solid #fff;
	width: 50px;
	height: 50px;
	box-sizing: border-box;
	transition: .2s;
}
#sp-prev { left: 10px; }

#sp-prev:before {
	content: '';
	border: 7px solid transparent;
	border-right: 15px solid #fff;
	position: absolute;
	top: 16px;
	left: 7px;
}

#sp-next { right: 10px; }

#sp-next:before {
	content: '';
	border: 7px solid transparent;
	border-left: 15px solid white;
	position: absolute;
	top: 16px;
	left: 18px;
}
#sp-prev:hover, #sp-next:hover { background: #444; }

/* Tweak styles for small viewports */
@media screen and (max-width: 400px) {
	.sp-wrap {	margin: 0 0 15px 0; }
	#sp-prev, #sp-next { top:auto; margin-top:0; bottom: 25px; }
}
/* Smooth product slider ends ********************************** */

@media (max-width: 991.98px) {
	.offcanvas-collapse {
    	position: fixed;
    	top: 56px; /* Height of navbar */
    	bottom: 0;
    	left: 100%;
    	width: 100%;
    	padding-right: 1rem;
    	padding-left: 1rem;
    	overflow-y: auto;
   	visibility: hidden;
    	background-color: #343a40;
    	transition: visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
    	transition: transform .3s ease-in-out, visibility .3s ease-in-out;
    	transition: transform .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
	 	padding-top: 30px;
  	}
  
	.offcanvas-collapse.open { visibility: visible; -webkit-transform: translateX(-100%); transform: translateX(-100%); }
  	/*a.dropdown-item { padding-left: 5rem; padding-top:0.5rem; padding-bottom:0.5rem; font-size:1rem;}*/
  	.mobile_dropdown_item { margin-left: 4rem; padding-top:0.55rem; padding-bottom:0.6rem; font-size:1rem;}
  	.navbar-dark .navbar-nav .nav-link { font-weight:400; font-size:1.1rem; padding:15px 0px 15px 50px; letter-spacing:0.19rem; }
  	.offcanvas-collapse #search_box .form-control { margin-left:50px; width:inherit; }
  	.label_ { letter-spacing:0.15rem;font-size:12px;font-weight:400; }
}