body {
	background-color: #eceff1;
	/*color: rgba(0, 0, 0, .68);*/
	color: #445a63;
}
footer {
	margin-top:10px;
	box-shadow: 1px -3px 5px 0px rgba(0, 0, 0, 0.05);
}
.margin-top-10 {
	margin-top:10px;
}
.footer-icons {
	color: #ffffff;
	font-size: 24px;
    margin: 5px;
}
.youtube:hover {
	color: #ff0000;
}
.facebook:hover {
	color: #365899;
}
.twitter:hover {
	color: #1da1f2;
}
a {
	color: #028ec3;
}

a:active, a:hover {
	color: #02c3c3;
}
.carousel-control-prev-icon {
	background-image:none;
	font-family: 'Font Awesome 5 Free';
    font-weight: 900;
	-webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
	/*font-size: 28px;*/
	/*text-shadow: 2px 2px 13px #00000040;*/
	font-size: 20px;
    color: #757e84;
    text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;
}
.carousel-control-prev-icon:before {
	content: '\f053';
	/*content: '\f104';*/
}
.carousel-control-next-icon {
	background-image:none;
	font-family: 'Font Awesome 5 Free';
    font-weight: 900;
	-webkit-font-smoothing: antialiased;
    display: inline-block;
    font-style: normal;
    font-variant: normal;
    text-rendering: auto;
    line-height: 1;
	/*font-size: 28px;*/
	/*text-shadow: 2px 2px 13px #00000040;*/
	font-size: 20px;
    color: #757e84;
    text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;
}
.carousel-control-next-icon:before {
	content: '\f054';
	/*content: '\f105';*/
}
.carousel-control-icon-white {
	text-shadow: 2px 2px 13px #00000040;
	color: #ffffff;
}
.carousel-control-prev, .carousel-control-next {
	width : 10%;
}
.carousel-control-prev:hover {
    background-color: rgba(229, 229, 229, .4);
    box-shadow: 1px 0 5px rgba(0, 0, 0, 0.4);
    -webkit-transition: opacity 0.4s,visibility 0.4s;
    transition: opacity 0.5s,visibility 0.5s;
    border-bottom-right-radius: 40px;
    border-top-right-radius: 40px;
}
.carousel-control-next:hover {
	background-color: rgba(229, 229, 229, .4);
    box-shadow: -1px 0 5px rgba(0, 0, 0, 0.4);
    -webkit-transition: opacity 0.4s,visibility 0.4s;
    transition: opacity 0.5s,visibility 0.5s;
    border-bottom-left-radius: 40px;
    border-top-left-radius: 40px;
}
.pagemiddle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}
::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #868e96;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #868e96;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #868e96;
}
.full-width {
	width: 100%;
}
.full-max-width {
	max-width: 100%;
}
h1 {
	font-size:20px;
	padding: 10px;
	margin-bottom: 0px;
	text-transform: capitalize;
	overflow: hidden;
	text-overflow: ellipsis;
}
h2 {
	font-size: 17px;
	padding: 10px;
	margin-bottom: 0px;
	text-transform: capitalize;
	overflow: hidden;
	text-overflow: ellipsis;
}
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    line-height: 1.3;
}
main {
	
}
.grey-border {
    border-style: solid;
    border-width: 1px;
    border-color: #c6c8cb;
}
/* breadcrumb start */
.breadcrumb {
	margin-bottom: 0px;
    /*position: relative;*/
	/*z-index: 1;*/
	/*background-color: #eceff1;*/
}
.breadcrumb-item span {
	white-space: nowrap;
    overflow: hidden;
    display: inline-block;
    text-overflow: ellipsis;
    vertical-align: top;
	text-transform: capitalize;
}

@media (max-width: 888px) {
	.breadcrumb li:nth-last-child(n+6) span {
		max-width: 21px;
	}
	
	.breadcrumb li:nth-last-child(n+5) {
		padding-left: 0.1rem;
	}
	
	.breadcrumb li:nth-last-child(n+5)::before {
		padding-right: 0.1rem;
	}
}
@media (max-width: 740px) {
	.breadcrumb li:nth-last-child(n+5) span {
		max-width: 21px;
	}
	.breadcrumb li:nth-last-child(n+4) {
		padding-left: 0.1rem;
	}
	.breadcrumb li:nth-last-child(n+4)::before {
		padding-right: 0.1rem;
	}
}
@media (max-width: 592px) {
	.breadcrumb li:nth-last-child(n+4) span {
		max-width: 21px;
	}
	.breadcrumb li:nth-last-child(n+3) {
		padding-left: 0.1rem;
	}
	.breadcrumb li:nth-last-child(n+3)::before {
		padding-right: 0.1rem;
	}
}
@media (max-width: 444px) {
	.breadcrumb li:nth-last-child(n+3) span {
		max-width: 21px;
	}
	.breadcrumb li:nth-last-child(n+2) {
		padding-left: 0.1rem;
	}
	.breadcrumb li:nth-last-child(n+2)::before {
		padding-right: 0.1rem;
	}
}
@media (max-width: 296px) {
	.breadcrumb li:nth-last-child(n+2) span {
		max-width: 21px;
	}
	.breadcrumb li:nth-last-child(n+1) {
		padding-left: 0.1rem;
	}
	.breadcrumb li:nth-last-child(n+1)::before {
		padding-right: 0.1rem;
	}
}

/* breadcrumb end*/
/* topbar categoy start */
.topbar-category {
	padding-top: 10px;
	margin-bottom: 10px;
}
.topbar-category > div {
	text-align: center;
	overflow: auto;
	white-space: nowrap;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 0px;

	background-color: white;
    box-shadow: 1px 0px 5px 3px rgba(0, 0, 0, 0.05);
}
.topbar-category > div a {
	display: inline-block;
	margin-left: 5px;
	margin-right: 5px;
	text-align: center;	
	text-transform: capitalize;
	text-decoration: none;

	overflow: hidden;
	text-overflow: ellipsis;
	width: 73px;
	color: #445a63;	
}
.topbar-category .imagecontainer {
	width: 50px;
	height: 50px;
	overflow: hidden;
	display: inline-block;
	border-radius: 20%;
	background-color: white;
	border-color: #b0bec5;
	border-width: 2px;
	border-style: solid;
}
/* topbar category end */
/* imageless topbar categoy start */
.imageless-topbar-category {
	margin-bottom: 10px;
	background-color: white;
	border-top-style: solid;
	border-width: 1px;
	border-bottom-style: solid;
	border-color: #e5e8ea;
	position: relative;
	height: 53px;
}
.imageless-topbar-category > div {
	text-align: center;
	overflow: auto;
	white-space: nowrap;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
	padding-bottom: 10px;
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 1;
	box-shadow: 1px 0px 5px 3px rgba(0, 0, 0, 0.05);
}
.imageless-topbar-category > div a {
	display: inline-block;
	margin-left: 5px;
	margin-right: 5px;
	text-align: center;
	border-style: solid;
	border-width: 1px;
	border-radius: 5px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	border-color: #b0bec5;
	text-transform: capitalize;
}
.imageless-topbar-category > div a:focus {
	border-color: #028ec3;
	box-shadow: none;
}
.imageless-topbar-category > div a:active, .imageless-topbar-category > div a:hover {
	border-color: #02c3c3;
	box-shadow: none;
	/*border: none;
	box-shadow: 0 0 0 0.2rem rgba(2, 195, 195, 0.25);*/
	text-decoration: none;
}
/* imageless topbar category end */
/* pagination start */
.page-link {
	color: #028ec3;
}

.page-link:focus {
	color: #028ec3;
	border-color: #028ec3;
	box-shadow: none;
}
.page-link:active, a.page-link:hover {
	color: #02c3c3;
	border-color: #02c3c3;
	background-color: #fff;
	box-shadow: none;
	/*box-shadow: 0 0 0 0.2rem rgba(2, 195, 195, 0.25);*/
}
/* pagination end */

/* home page start */
.multi-carousel-3 .carousel-inner .carousel-item.active, .carousel-inner .carousel-item-next, .carousel-inner .carousel-item-prev {
  display: flex;
}

.multi-carousel-3 .carousel-inner .carousel-item-right.active, .multi-carousel-3 .carousel-inner .carousel-item-next {
  transform: translateX(33.33%);
}

.multi-carousel-3 .carousel-inner .carousel-item-left.active, .multi-carousel-3 .carousel-inner .carousel-item-prev {
  transform: translateX(-33.33%);
}
  
.multi-carousel-3 .carousel-inner .carousel-item-right, .multi-carousel-3 .carousel-inner .carousel-item-left { 
  transform: translateX(0);
}

.hp-section {
	overflow: auto;
	margin-top: 10px;
	box-shadow: 1px 0px 5px 3px rgba(0, 0, 0, 0.05);
}
.hp-section .smallsec {
	float: left;
	width: 34%;
	padding-top: 42.31%;
	position:relative;
}
.hp-section .largesec {
	float: left;
	width: 66%;
}
.hp-section .largesec .top {
	padding-top: 42.18%;
	position:relative;
}
.hp-section .largesec .bottom {
	padding-top: 21.93%;
	position:relative;
}

.hp-section .maincat {
	background-color: #fff;
	display: block;
	overflow: hidden;
	/*border-right-color: #f1f1f1;
	border-right-style: solid;
	border-right-width: 1px;*/
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
}
.hp-section .maincat .imagecontainer {
	width:100%;
	height:100%;
	position: relative;
	overflow:hidden;
	background: url(../images/loading.gif) no-repeat center;
}
.hp-section .maincat .imagecontainer .image {
	max-height:100%;
	max-width:100%; 
	position: absolute; 
	top: 50%; 
	left: 50%; 
	transform: translate(-50%, -50%); 
	text-align: center;
}
.hp-section .maincat .text {
	color: #445a63; 
	font-style: italic; 
	position: absolute; 
	top: 66.66%; 
	transform: translateY(-50%); 
	text-align: center;
	background-color: #ffffff;
	background-color: #ffffffbf;
	background-image: url(../images/diffusedbg.png);
	width: 100%;
	box-shadow: 0px 3px 5px 0 rgba(0, 0, 0, 0.05);
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(255,255,255,0.75)),color-stop(100%,rgba(255,255,255,0.75)));
	background-image: -webkit-linear-gradient(top,rgba(255,255,255,0.75),rgba(255,255,255,0.75));
	background: linear-gradient(to bottom,rgba(255,255,255,0.75),rgba(255,255,255,0.75));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#ffffffbf',EndColorStr='#ffffffbf');
}
.hp-section .subcat {
	display:block; 
	width:33.33%; 
	position: relative; 
	overflow:hidden; 
	height:100%; 
	float: left;
	/*border-right-color: #f1f1f1; 
	border-right-style: solid; 
	border-right-width: 1px; 
	border-bottom-color: #f1f1f1; 
	border-bottom-style: solid; 
	border-bottom-width: 1px;*/
}
.hp-section .subcat .imagecontainer {
	width:100%; 
	height:100%; 
	position: relative; 
	overflow:hidden; 
	background-color: #fff;
	background: url(../images/loading.gif) no-repeat center;
}
.hp-section .subcat .imagecontainer .image {
	max-height:100%;
	max-width:100%; 
	position: absolute; 
	top: 50%; 
	left: 50%; 
	transform: translate(-50%, -50%); 
	text-align: center;
}
.hp-section .subcat .text {
	position: absolute;
	top: 66.66%;
	transform: translateY(-50%);
	text-align: center;
	background-color: #ffffff;
	background-color: #ffffffbf;
	background-image: url(../images/diffusedbg.png);
	width: 100%;
	/*white-space: nowrap;*/
	font-style: italic;
	color: #445a63;
	box-shadow: 0px 3px 5px 0 rgba(0, 0, 0, 0.05);
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(255,255,255,0.75)),color-stop(100%,rgba(255,255,255,0.75)));
	background-image: -webkit-linear-gradient(top,rgba(255,255,255,0.75),rgba(255,255,255,0.75));
	background: linear-gradient(to bottom,rgba(255,255,255,0.75),rgba(255,255,255,0.75));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#ffffffbf',EndColorStr='#ffffffbf');
}

.hp-section .prod {
	background-color:#fff; 
	display:block; 
	width:33.33%; 
	height:100%; 
	position: relative; 
	overflow:hidden;
	float:left;
}

.hp-section .prod .imagecontainer {
	width:66%; 
	height:100%; 
	position: relative; 
	overflow:hidden; 
	background-color: #fff; 
	float:left;
	background: url(../images/loading.gif) no-repeat center;
}
.hp-section .prod .imagecontainer .discountpercentage {
	position: absolute;
	right: 0px;
	top: 0px;
	background-color: #ffffffd4;
	color: #ef6c00;
	border-radius: 2px;
	width: 30px;
	vertical-align: middle;
	line-height: 18px;
	text-align: center;
	font-size: 11px;
	border-width: 1px;
	border-color: #ef6c00;
	border-style: solid;
}
.hp-section .prod .imagecontainer .image {
	max-height:100%;
	max-width:100%; 
	position: absolute; 
	top: 50%; 
	left: 50%; 
	transform: translate(-50%, -50%); 
	text-align: center;
}
.hp-section .prod .right {
	width:34%; 
	height:100%; 
	float:left;
}
.hp-section .prod .right .textcontainer {
	height:100%;
	width:100%;
/*			border-right-color: #f1f1f1;
	border-right-style: solid;
	border-right-width: 1px;
*/			padding-right:8px;
	padding-left:8px;
}
.hp-section .prod .right .textcontainer .toptextcontainer {
	position: relative; 
	width: 100%; 
	height: 70%;
}
.hp-section .prod .right .textcontainer .toptextcontainer .toptext {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	padding-top:8px;
	padding-bottom:8px;
	color: #445a63;
	overflow: hidden;
	text-align: center;
	font-size: 80%;
	text-overflow: ellipsis;
	text-transform: capitalize;
	width: 100%;
	max-height: 100%;
	font-style: italic;
	display: block;
}

.hp-section .prod .right .textcontainer .bottomtextcontainer {
	border-top-color: #f1f1f1;
	border-top-style: solid;
	border-top-width: 1px;
	text-align:center; 
	width:100%; 
	height: 30%; 
	vertical-align:middle;
	color: #445a63;
	font-size:90%;
	position: relative;
}
.hp-section .prod .right .textcontainer .bottomtextcontainer .bottomtext {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	text-align: center;
	width: 100%;
}
.diffuse {
	background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0%,rgba(255,255,255,0)),color-stop(100%,rgba(255,255,255,1)));
	background-image: -webkit-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,1));
	background: linear-gradient(to bottom,rgba(255,255,255,0),rgba(255,255,255,1));
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#00ffffff',EndColorStr='#ffffff');
	bottom: 0px;
	position: absolute;
	left: 0;
	height: 30%;
	width: 100%;
}
.hp-section .contentcontainer {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0px;
}

.roundborder {
	background-color: #fff;
	background-clip: border-box;
	border: 1px solid rgba(0, 0, 0, 0.125);
	border-radius: 0.25rem;
}
@keyframes slidedowntext {
	from {top: 66.66%; transform: translateY(-50%);background-color: #ffffffbf;}
	to {top: 100%; transform: translateY(-100%);background-color: #ffffffff;}
}
@-o-keyframes slidedowntext {
	from {top: 66.66%; transform: translateY(-50%);background-color: #ffffffbf;}
	to {top: 100%; transform: translateY(-100%);background-color: #ffffffff;}
}
.animtext:hover .text {
	animation-name: slidedowntext;
	animation-duration: 0.4s;
	-o-animation-name: slidedowntext;
	-o-animation-duration: 0.4s;
	top: 100%;
	transform: translateY(-100%);
	background-color: #fff;
	border-top-color: #f1f1f1;
	border-top-style: solid;
	border-top-width: 1px;
}
/* home page end */
/* product start */
.productImageLink {
    overflow: hidden;
    width: 100%;
	background-color: #fff;
	/*line-height: 0;*/
	height:100%;
}
.productImageLink .imagecontainer {
	display: inline-block;
	height:100%;
    width: 100%;
	max-width:100%;
	position:relative;
}
.productImageLink .imagecontainer .image {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
	max-width: 100%;
    max-height: 100%;
}
.displayBoard {
	background-color: #f9d6b8;
	background-image: url(../images/wood.jpg);
	background-repeat: repeat-y;
	height:100%;
	margin-right: 10px;
	position: relative;
}
.displayBoard a:nth-child(n):hover {
    -webkit-transform:rotate(0deg) scale(1,1);
    -moz-transform:rotate(0deg) scale(1,1);
    transform:rotate(0deg) scale(1,1);
	-webkit-transition:all .30s;
    -moz-transition:all .30s;
    -o-transition:all .30s;
	transition:all .30s;
	z-index:10;
}
.displayBoard1 a:nth-child(1n) {
    -webkit-transform:rotate(-20deg) scale(0.7,0.7);
    -moz-transform:rotate(-20deg) scale(0.7,0.7);
    transform:rotate(-20deg) scale(0.7,0.7);
    top:20%;
    left:20%;
}
.displayBoard2 a:nth-child(1n) {
    -webkit-transform:rotate(-20deg) scale(0.7,0.7);
    -moz-transform:rotate(-20deg) scale(0.7,0.7);
    transform:rotate(-20deg) scale(0.7,0.7);
    top:5%;
    left:0%;
}
.displayBoard2 a:nth-child(2n) {
    -webkit-transform:rotate(20deg) scale(0.7,0.7);
    -moz-transform:rotate(20deg) scale(0.7,0.7);
    transform:rotate(20deg) scale(0.7,0.7);
    top:30%;
    left:30%;
}
.displayBoard3 a:nth-child(1n) {
    -webkit-transform:rotate(-20deg) scale(0.7,0.7);
    -moz-transform:rotate(-20deg) scale(0.7,0.7);
    transform:rotate(-20deg) scale(0.7,0.7);
    top:2%;
    left:20%;
}
.displayBoard3 a:nth-child(2n) {
    -webkit-transform:rotate(20deg) scale(0.7,0.7);
    -moz-transform:rotate(20deg) scale(0.7,0.7);
    transform:rotate(20deg) scale(0.7,0.7);
    top:30%;
    left:30%;
}
.displayBoard3 a:nth-child(3n) {
    -webkit-transform:rotate(-20deg) scale(0.7,0.7);
    -moz-transform:rotate(-20deg) scale(0.7,0.7);
    transform:rotate(-20deg) scale(0.7,0.7);
    top:50%;
    left:0%;
}
.displayBoard4 a:nth-child(1n) {
    -webkit-transform:rotate(-20deg) scale(0.7,0.7);
    -moz-transform:rotate(-20deg) scale(0.7,0.7);
    transform:rotate(-20deg) scale(0.7,0.7);
    top:5%;
    left:0%;
}
.displayBoard4 a:nth-child(2n) {
    -webkit-transform:rotate(20deg) scale(0.7,0.7);
    -moz-transform:rotate(20deg) scale(0.7,0.7);
    transform:rotate(20deg) scale(0.7,0.7);
    top:65%;
    left:5%;
}
.displayBoard4 a:nth-child(3n) {
    -webkit-transform:rotate(-30deg) scale(0.7,0.7);
    -moz-transform:rotate(-30deg) scale(0.7,0.7);
    transform:rotate(-30deg) scale(0.7,0.7);
    top:45%;
    left:35%;
}
.displayBoard4 a:nth-child(4n) {
    -webkit-transform:rotate(30deg) scale(0.7,0.7);
    -moz-transform:rotate(30deg) scale(0.7,0.7);
    transform:rotate(30deg) scale(0.7,0.7);
    top:18%;
    left:40%;
}
.displayBoard5 a:nth-child(1n) {
    -webkit-transform:rotate(-20deg) scale(0.7,0.7);
    -moz-transform:rotate(-20deg) scale(0.7,0.7);
    transform:rotate(-20deg) scale(0.7,0.7);
    top:0%;
    left:0%;
}
.displayBoard5 a:nth-child(2n) {
    -webkit-transform:rotate(20deg) scale(0.7,0.7);
    -moz-transform:rotate(20deg) scale(0.7,0.7);
    transform:rotate(20deg) scale(0.7,0.7);
    top:60%;
    left:5%;
}
.displayBoard5 a:nth-child(3n) {
    -webkit-transform:rotate(-30deg) scale(0.7,0.7);
    -moz-transform:rotate(-30deg) scale(0.7,0.7);
    transform:rotate(-30deg) scale(0.7,0.7);
    top:40%;
    left:35%;
}
.displayBoard5 a:nth-child(4n) {
    -webkit-transform:rotate(30deg) scale(0.7,0.7);
    -moz-transform:rotate(30deg) scale(0.7,0.7);
    transform:rotate(30deg) scale(0.7,0.7);
    top:13%;
    left:40%;
}
.displayBoard5 a:nth-child(5n) {
    -webkit-transform:rotate(-30deg) scale(0.7,0.7);
    -moz-transform:rotate(-30deg) scale(0.7,0.7);
    transform:rotate(-30deg) scale(0.7,0.7);
    top:30%;
    left:0%;
}
.displayBoard6 a {
	width: 54%;
    height: 36%;
}
.displayBoard6 a:nth-child(1n) {
    -webkit-transform:rotate(-20deg) scale(0.7,0.7);
    -moz-transform:rotate(-20deg) scale(0.7,0.7);
    transform:rotate(-20deg) scale(0.7,0.7);
    top:0%;
    left:0%;
}
.displayBoard6 a:nth-child(2n) {
    -webkit-transform:rotate(20deg) scale(0.7,0.7);
    -moz-transform:rotate(20deg) scale(0.7,0.7);
    transform:rotate(20deg) scale(0.7,0.7);
    top:60%;
    left:5%;
}
.displayBoard6 a:nth-child(3n) {
    -webkit-transform:rotate(-30deg) scale(0.7,0.7);
    -moz-transform:rotate(-30deg) scale(0.7,0.7);
    transform:rotate(-30deg) scale(0.7,0.7);
    top:40%;
    left:35%;
}
.displayBoard6 a:nth-child(4n) {
    -webkit-transform:rotate(30deg) scale(0.7,0.7);
    -moz-transform:rotate(30deg) scale(0.7,0.7);
    transform:rotate(30deg) scale(0.7,0.7);
    top:13%;
    left:40%;
}
.displayBoard6 a:nth-child(5n) {
    -webkit-transform:rotate(-30deg) scale(0.7,0.7);
    -moz-transform:rotate(-30deg) scale(0.7,0.7);
    transform:rotate(-30deg) scale(0.7,0.7);
    top:30%;
    left:0%;
}
.displayBoard6 a:nth-child(6n) {
    -webkit-transform:rotate(-20deg) scale(0.7,0.7);
    -moz-transform:rotate(-20deg) scale(0.7,0.7);
    transform:rotate(-20deg) scale(0.7,0.7);
    top:65%;
    left:40%;
}
.displayBoard7 a {
	width: 54%;
    height: 36%;
}
.displayBoard7 a:nth-child(1n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:0%;
    left:0%;
}
.displayBoard7 a:nth-child(2n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:0%;
    left:45%;
}
.displayBoard7 a:nth-child(3n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:25%;
    left:0%;
}
.displayBoard7 a:nth-child(4n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:25%;
    left:45%;
}
.displayBoard7 a:nth-child(5n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:50%;
    left:0%;
}
.displayBoard7 a:nth-child(6n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:50%;
    left:45%;
}
.displayBoard7 a:nth-child(7n) {
    -webkit-transform:rotate(-85deg) scale(0.7,0.7);
    -moz-transform:rotate(-85deg) scale(0.7,0.7);
    transform:rotate(-85deg) scale(0.7,0.7);
    top:70%;
    left:25%;
}
.displayBoard8 a {
	width: 54%;
    height: 36%;
}
.displayBoard8 a:nth-child(1n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:0%;
    left:0%;
}
.displayBoard8 a:nth-child(2n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:0%;
    left:45%;
}
.displayBoard8 a:nth-child(3n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:22%;
    left:0%;
}
.displayBoard8 a:nth-child(4n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:22%;
    left:45%;
}
.displayBoard8 a:nth-child(5n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:44%;
    left:0%;
}
.displayBoard8 a:nth-child(6n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:44%;
    left:45%;
}
.displayBoard8 a:nth-child(7n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:65%;
    left:0%;
}
.displayBoard8 a:nth-child(8n) {
    -webkit-transform:rotate(20deg) scale(0.7,0.7);
    -moz-transform:rotate(20deg) scale(0.7,0.7);
    transform:rotate(20deg) scale(0.7,0.7);
    top:65%;
    left:45%;
}
.displayBoard9 a {
	width: 51%;
    height: 34%;
}
.displayBoard9 a:nth-child(1n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:0%;
    left:0%;
}
.displayBoard9 a:nth-child(2n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:0%;
    left:48%;
}
.displayBoard9 a:nth-child(3n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:20%;
    left:0%;
}
.displayBoard9 a:nth-child(4n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:20%;
    left:48%;
}
.displayBoard9 a:nth-child(5n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:40%;
    left:0%;
}
.displayBoard9 a:nth-child(6n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:40%;
    left:48%;
}
.displayBoard9 a:nth-child(7n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:60%;
    left:0%;
}
.displayBoard9 a:nth-child(8n) {
    -webkit-transform:rotate(20deg) scale(0.7,0.7);
    -moz-transform:rotate(20deg) scale(0.7,0.7);
    transform:rotate(20deg) scale(0.7,0.7);
    top:60%;
    left:48%;
}
.displayBoard9 a:nth-child(9n) {
    -webkit-transform:rotate(-85deg) scale(0.7,0.7);
    -moz-transform:rotate(-85deg) scale(0.7,0.7);
    transform:rotate(-85deg) scale(0.7,0.7);
    top:70%;
    left:25%;
}
.displayBoard10 a {
	width: 51%;
    height: 34%;
}
.displayBoard10 a:nth-child(1n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:0%;
    left:0%;
}
.displayBoard10 a:nth-child(2n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:0%;
    left:48%;
}
.displayBoard10 a:nth-child(3n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:16%;
    left:0%;
}
.displayBoard10 a:nth-child(4n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:16%;
    left:48%;
}
.displayBoard10 a:nth-child(5n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:32%;
    left:0%;
}
.displayBoard10 a:nth-child(6n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:32%;
    left:48%;
}
.displayBoard10 a:nth-child(7n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:48%;
    left:0%;
}
.displayBoard10 a:nth-child(8n) {
    -webkit-transform:rotate(20deg) scale(0.7,0.7);
    -moz-transform:rotate(20deg) scale(0.7,0.7);
    transform:rotate(20deg) scale(0.7,0.7);
    top:48%;
    left:48%;
}
.displayBoard10 a:nth-child(9n) {
    -webkit-transform:rotate(-25deg) scale(0.7,0.7);
    -moz-transform:rotate(-25deg) scale(0.7,0.7);
    transform:rotate(-25deg) scale(0.7,0.7);
    top:64%;
    left:0%;
}
.displayBoard10 a:nth-child(10n) {
    -webkit-transform:rotate(25deg) scale(0.7,0.7);
    -moz-transform:rotate(25deg) scale(0.7,0.7);
    transform:rotate(25deg) scale(0.7,0.7);
    top:64%;
    left:48%;
}
.productThumb {
	display: block;
    position: absolute;
	text-align: center;
    width: 60%;
    height: 40%;
	padding: 8px;
	/*width:auto;*/
	-webkit-box-shadow:0px 0px 10px rgba(0,0,0,1);
    -moz-box-shadow:0px 0px 10px rgba(0,0,0,1);
    box-shadow:0px 0px 10px rgba(0,0,0,1);
}
.productThumb .imagecontainer {
/*	border-color: #fff;
    border-style: solid;
    border-width: 8px;
*/	display: inline-block;
	border-color: #dfdfdf;
    border-style: solid;
    border-width: 1px;
	width: 100%;
    height: 100%;
    position: relative;
	overflow: hidden;
}
.productThumb .imagecontainer .image {
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 100%;
    max-height: 100%;
	
}
.main-product-container {
	position: relative;
    width: 100%;
    padding-top: 42.6%;
}
.main-product {
	position:absolute;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	padding: 10px;
	background-color: white;
	box-shadow: 1px 0px 5px 3px rgba(0, 0, 0, 0.05);
}
.main-product .currency:after {
    content: ' ';
}
.main-product .imagesection {
	width: 56%;
	float:left;
	height:100%;
}
.main-product .imagesection .thumbs {
	width: 39%;
	float: left;
	height:100%;
}
.main-product .imagesection .mainimage {
	width: 61%;
	float: left;
	height:100%; 
}
.main-product .textsection {
	width: 44%;
	height:100%;
	float:left;
}
.main-product .textsection .textsectioncontainer {
	height:100%; 
	margin-left:10px; 
	padding:20px; 
	position:relative;
}
.main-product .textsection .textsectioncontainer .textcontainer {
	overflow:auto;
	max-height:100%;
	min-height:100%;
	height:100%;
}
.main-product .textsection .textsectioncontainer .textcontainer .productname {
	padding:0px;
}

.main-product .textsection .textsectioncontainer .textcontainer .amount tr td:nth-child(2n) {
	padding-left:10px;
}
.smallbuybutton {
	margin-top:15px;
	margin-bottom:15px;
}
.smallbuybutton .label {
	padding-left:10px; 
	padding-right:10px; 
	font-weight:bold;
}
.smallbuybutton .icon {
	border-left-color: white;
	border-left-style: solid;
	border-left-width: 1px;
	padding-left: 7px;
}
.main-product .textsection .textsectioncontainer .textcontainer .heading {
	display: block; width:100%;
    font-size: 18px;
    color: #445a63;
}
.main-product .textsection .textsectioncontainer .textcontainer .desc {
	border-top-style: solid;
    border-top-color: #e6e6e6;
    border-top-width: 1px;margin-top:5px;
}
.main-product .textsection .textsectioncontainer .textcontainer .desc .specification {
	margin-top:15px;
}
.main-product .textsection .textsectioncontainer .textcontainer .desc .specification tr td:nth-child(2n) {
	padding-left:10px;
	text-transform:capitalize;
}

.main-product .accordion-toggle:after {
	display: block;
	font-family: 'Font Awesome 5 Free';
    content: '\f146';
    float: right;
}
.main-product .accordion-toggle.collapsed:after {
    content: '\f0fe';
}
.main-product .accordion-toggle:hover {
	text-decoration: none;
}
/* product end */

/* start buy button */
.big-buy-btn {
	position: fixed;
	z-index: 20;
	bottom: 0px;
	left: 0px;
	right: 0px;
	width: 100%;
	height: 38px;
	border: none;
	font-weight: bold;
	box-shadow: 2px -2px 5px 0px rgba(0, 0, 0, 0.25);
}

.big-buy-btn .icon {
    border-left-color: white;
    border-left-style: solid;
    border-left-width: 1px;
    padding-left: 7px;
}

.buy-btn {
  color: #fff;
  background-color: #20c997;
  border-color: #20c997;
}

.buy-btn:hover {
  color: #fff;
  background-color: #20c997;
  border-color: #1db387;
}

.buy-btn:focus, .buy-btn.focus {
  outline: none;
}

.buy-btn td:nth-child(1) {
	width: 30px;
}
.buy-btn td:nth-child(3) {
	width: 30px;
}

.buy-btn.disabled, .buy-btn:disabled {
  background-color: #1db387;
  border-color: #1db387;
}

.buy-btn:not([disabled]):not(.disabled):active, .buy-btn:not([disabled]):not(.disabled).active,
.show > .buy-btn.dropdown-toggle {
  color: #fff;
  background-color: #1db387;
  border-color: #1db387;
}

.buy-btn:not([disabled]):not(.disabled):active:focus, .buy-btn:not([disabled]):not(.disabled).active:focus,
.show > .buy-btn.dropdown-toggle:focus {
/*  box-shadow: 0 0 0 0.2rem rgba(40, 167, 69, 0.5);*/
}
/* end buy button */

/*start filter button*/
.filterbtn {
    display: block; /* Hidden by default */
    position: fixed; /* Fixed/sticky position */
    bottom: 45px; /* Place the button at the bottom of the page */
    right: 40px; /* Place the button 30px from the right */
    z-index: 99; /* Make sure it does not overlap */
    border: none; /* Remove borders */
    outline: none; /* Remove outline */
    background-color: #72b2f9; /* Set a background color */
    color: white; /* Text color */
    cursor: pointer; /* Add a mouse pointer on hover */
    border-radius: 50%; /* Rounded corners */
	width: 56px;
	height: 56px;
	overflow: hidden;
    box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.25), 0 0 2px 0 rgba(0, 0, 0, 0.25);
}

.filterbtn:hover {
    background-color: #b0bec5; /* Add a dark-grey background on hover */
}
.filterbtn:focus {
    outline: none;
}
.animate-appear-filterbtn {
	animation-name: expand;
	animation-duration: 0.3s;
	animation-fill-mode: forwards;
	-o-animation-name: expand;
	-o-animation-duration: 0.3s;
	-o-animation-fill-mode: forwards;
}
.animate-disappear-filterbtn {
	animation-name: shrink;
	animation-duration: 0.3s;
	animation-fill-mode: forwards;
	-o-animation-name: shrink;
	-o-animation-duration: 0.3s;
	-o-animation-fill-mode: forwards;
}
@keyframes shrink {
	from {width: 56px;height: 56px;}
	to {width: 0;height: 0;bottom:-10px; right:-10px;}
}
@keyframes expand {
	from {width: 0px;height: 0px;bottom:0px; right:0px;}
	to {width: 56px;height: 56px;}
}
@-o-keyframes shrink {
	from {width: 56px;height: 56px;}
	to {width: 0;height: 0;bottom:0px; right:0px;}
}
@-o-keyframes expand {
	from {width: 0px;height: 0px;bottom:-10px; right:-10px;}
	to {width: 56px;height: 56px;}
}
/*end filter button*/
/*start category*/

.productcard .topsection {
	display: block;
	overflow: hidden;
	position: relative;
	width: 100%;
	padding-top: 133.333%;
}
/* For Image Croped */
/*
.productcard .imagecontainer {
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	text-align: center;
}
.productcard .imagecontainer .productimage {
	max-width: 100%;
	max-height: 100%;
    border-top-left-radius: calc(0.25rem - 1px);
    border-top-right-radius: calc(0.25rem - 1px);
}*/
/* For Image Complete Visiblity Start */
.productcard .imagecontainer {
    display: inline-block;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
}
.productcard .imagecontainer .productimage {
    max-width: 100%;
    max-height: 100%;
    border-top-left-radius: calc(0.25rem - 1px);
    border-top-right-radius: calc(0.25rem - 1px);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.productcard .imagecontainer .mhproductimage {
    max-height: 100%;
    border-top-left-radius: calc(0.25rem - 1px);
    border-top-right-radius: calc(0.25rem - 1px);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
/* For Image Complete Visiblity End */

.productcard .bottomsection {
	padding-left: 10px;
    padding-bottom: 10px;
    padding-right: 10px;
	height: 48px;
}
.productcard .productname {
    overflow: hidden;
	white-space: nowrap;
	position: relative;
	text-transform: capitalize;
}
.productcard .productname .productnameend {
	background-image: -webkit-gradient(linear,left top,right top,color-stop(0%,rgba(255,255,255,0)),color-stop(100%,rgba(255,255,255,1)));
	background-image: -webkit-linear-gradient(left,rgba(255,255,255,0),rgba(255,255,255,1));
    background: linear-gradient(to right,rgba(255,255,255,0),rgba(255,255,255,1));
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#00ffffff',EndColorStr='#ffffff');
    bottom: 0;
    max-height: 100%;
    position: absolute;
    right: 0;
	height: 20px;
    width: 40px;
}
.productcard .mrp {
	font-weight: bold;
}
.productcard .cost {
}
.productcard .price {
}
.productcard .discountpercentage {
	position: absolute;
    right: 0px;
    top: 0px;
    background-color: #ffffffd4;
    color: #ef6c00;
    border-radius: 2px;
    width: 30px;
	vertical-align:middle;
	line-height: 18px;
    text-align: center;
    font-size: 11px;
    border-width: 1px;
    border-color: #ef6c00;
    border-style: solid;
}
.productcard .currency {
}
.productcard .value {
}
.pagination-container {
	text-align: right;
    margin-top: 15px;
}
.pagination-container li {
	box-shadow: 3px 3px 5px 0px rgba(0, 0, 0, 0.05);
}

@media (min-width: 260px) {
  .card-columns {
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    -webkit-column-gap: 0.0rem;
    -moz-column-gap: 0.0rem;
    column-gap: 0.0rem;
  }
  .card-columns .card {
    display: inline-block;
    width: 100%;
	margin-bottom: 0.0rem;
  }
}
@media (min-width: 576px) {
  .card-columns {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 0.0rem;
    -moz-column-gap: 0.0rem;
    column-gap: 0.0rem;
  }
  .card-columns .card {
    display: inline-block;
    width: 100%;
	margin-bottom: 0.0rem;
  }
}
@media (min-width: 768px) {
  .card-columns {
    -webkit-column-count: 3;
    -moz-column-count: 3;
    column-count: 3;
    -webkit-column-gap: 0.0rem;
    -moz-column-gap: 0.0rem;
    column-gap: 0.0rem;
  }
  .card-columns .card {
    display: inline-block;
    width: 100%;
	margin-bottom: 0.0rem;
  }
}
@media (min-width: 992px) {
  .card-columns {
    -webkit-column-count: 4;
    -moz-column-count: 4;
    column-count: 4;
    -webkit-column-gap: 0.0rem;
    -moz-column-gap: 0.0rem;
    column-gap: 0.0rem;
  }
  .card-columns .card {
    display: inline-block;
    width: 100%;
	margin-bottom: 0.0rem;
  }
}
@media (min-width: 1200px) {
  .card-columns {
    -webkit-column-count: 4;
    -moz-column-count: 4;
    column-count: 4;
    -webkit-column-gap: 0.0rem;
    -moz-column-gap: 0.0rem;
    column-gap: 0.0rem;
  }
  .card-columns .card {
    display: inline-block;
    width: 100%;
	margin-bottom: 0.0rem;
  }
}
/*end category*/
/*Start navigationbar*/
.navigationbar {
	z-index: 100;
	position:relative;
	box-shadow: 0px 3px 5px 0 rgba(0, 0, 0, 0.05);
}
.topbar {
	height: 100px;
    background-color: #b0bec5;
    padding: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
	position:relative;
	z-index:1;
	background-image: url('../images/greyblocksbg.jpg');
}
.topbar .logoimg {
	height: 65px;
	margin-left: 40px;
	margin-right: 20px;
}
.topbar .searchbar {
	margin-right:20px;
	font-size: 17px;
	box-shadow: 4px 2px 3px 2px rgba(0, 0, 0, 0.2);
	border: solid;
	border-color: #7b868a;
	border-radius: 20px;
	border-width: 2px;
	padding-left: 15px;
	padding-right: 5px;
	white-space: nowrap;
	background-color:#fff;"
}
.topbar .searchbar .searchtext {
	border:none;
	outline: none;
	width:272px;
	font-size: 15px;
}

.topbar .searchbar .searchtext::placeholder {
    color: #868e96
    opacity: 1; /* Firefox */
}

.topbar .searchbar .searchtext:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #868e96;
}

.topbar .searchbar .searchtext::-ms-input-placeholder { /* Microsoft Edge */
   color: #868e96;
}
.topbar .searchbar .searchaction {
	cursor:pointer;
	outline: none;
	border:none;
	border-radius: 20px;
	background-color:#fff;
	color:#7b868a;
}

.navigation {
	padding: 10px;
	background-color: #fff;
	text-transform: capitalize;
	font-size: 90%;
	z-index:0;
	position:relative;
}

.navigation-menu {
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-flex-align: center;
	align-items: center;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 0.5rem 1rem;
	list-style-type: none;
	padding:0px;
	margin:0px;
}

.navigation-item {
	float: left;
	padding-left:10px;
	padding-right:10px;
}

.navigation-submenu {
	display:none;
	position:absolute;
	left:0px;
	right:0px;
	background-color:#fff;
	border-bottom-style: solid;
	border-width: 1px;
	border-color: #eceff1;
	max-height: 500px;
	overflow-x: auto;
	padding-left:20px;
	padding-right:20px;
	padding-bottom:20px;
	box-shadow: 0px 3px 5px 0 rgba(0, 0, 0, 0.05);
}
.navigation-submenu-heading {
	text-align: center;
    width: 100%;
	padding: 7px;
    display: block;
    font-size: 20px;
    text-transform: capitalize;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 500;
}
.navigation-submenu-list {
	column-count: 3;
	padding-left:11px;
	padding-top:20px;
	border-top-color: #eceff1;
    border-top-style: solid;
    border-top-width: 1px;
}
@media (min-width: 1004px) {
	.navigation-submenu-list {
		column-count: 4;
	}
}
.navigation-submenu li {
	margin-left:11px;
}

.navigation-menu ul ul {
	padding-left:10px;
	font-size: 98%;
}

/*.navigation-menu > li:nth-last-child(1) > ul {
	right:0px;
}*/

.navigation-item:hover .navigation-submenu {
	display:inline-block;
	
	top: 0px;
	animation-name: slidedown;
	animation-duration: 0.3s;
	animation-fill-mode: forwards;
	-o-animation-name: slidedown;
	-o-animation-duration: 0.3s;
	-o-animation-fill-mode: forwards;
}
@keyframes slidedown {
	from {top: -200px;}
	to {top: 0px;}
}
@-o-keyframes slidedown {
	from {background-color: #ffffff00;}
	to {background-color: #ffffffd8;}
}
/*end navigationbar*/