/**side navigation*/
		.side-con{
			position: absolute;
			padding: 0;
			width: 285px;
			margin-top: .5%;
		}
		#sidebar{
			width: 100%;
			margin-top: 1%; 
			position: relative;
		}


		#sidebar .sidebar-submenu li a {
			font-size: 12px;
		}
		/*#sidebar #sideManu .subMenu ul li{
			margin-left: -60px;
		}
		#sideManu {
			background-color: #ffffff;
			border: 1px solid #e3e3e3;
			border-radius: 4px;
			padding: 0;
			margin: 0;
		}
		#sideManu .subMenu{
			border-bottom: 1px solid #e3e3e3;
		}
		.well{
			height: 55px;
			padding-top: 10px;
			background-color: #003366;
		}
		.subMenu ul li{
			margin: 0;
			padding: 0;
			height: 25px;
			text-decoration: none;
			margin-left: -23%;
			padding-left: 50px;
			padding-top: 2px;
			list-style: none;
		}
		.subMenu ul li:hover{
			background-color: #ededed;
			text-decoration: none;
			display: block;
		}
		.subMenu ul li a{
			font-size: 12px;
		}*/

		/*side brands*/
		.side-brands{
			width: 100%;
			min-height: 340px;
			padding-bottom: 10px;
			margin-top: 1%;		
			background-color: #ffffff;
			border: 1px solid  	#E8E8E8;
			margin-bottom: 15%;
		}
		.side-brands ul li{
			list-style: none;
			padding-left: 15px;
		}
		.side-brands label{
			color: grey;
		}
		.side-brands .title{
			padding-top: 5px;
			text-align: center;
			color: #428bca;
		}
		.card {
		    width: 85%;
		    min-height: 235px;
		    margin: 0 auto;
		    clear: both;
		    display: block;
		    padding: 0px 0px;
		    border-top: solid .1px #D8D8D8;;
		    border-bottom: solid .1px #D8D8D8;
		    background-color: #ffffff;   
		}
		.card::after {
		    clear: both;
		    display: block;
		    content: "";
		}
		.card .checkbox-container {
		    display: inline-block;
		    width: 50%;
		    margin: 0 auto;
		    box-sizing: border-box;
		    text-align:center;
		  	padding: 15px 0px;
		}
		/* Styling Checkbox Starts */
		.checkbox-label {
		    display: block;
		    position: relative;
		    margin: auto;
		    cursor: pointer;
		    font-size: 22px;
		    line-height: 24px;
		    height: 24px;
		    width: 24px;
		    clear: both;
		}

		.checkbox-label input {
		    position: absolute;
		    opacity: 0;
		    cursor: pointer;
		}

		.checkbox-label .checkbox-custom {
		    position: absolute;
		    top: 0px;
		    left: 0px;
		    height: 24px;
		    width: 24px;
		    background-color: transparent;
		    border-radius: 5px;
		    transition: all 0.3s ease-out;
		    -webkit-transition: all 0.3s ease-out;
		    -moz-transition: all 0.3s ease-out;
		    -ms-transition: all 0.3s ease-out;
		    -o-transition: all 0.3s ease-out;
		    border: 2px solid #428bca;
		}
		.checkbox-label input:checked ~ .checkbox-custom {
		    background-color: #ffffff;
		    border-radius: 5px;
		    -webkit-transform: rotate(0deg) scale(1);
		    -ms-transform: rotate(0deg) scale(1);
		    transform: rotate(0deg) scale(1);
		    opacity:1;
		    border: 2px solid #428bca;
		}
		.checkbox-label .checkbox-custom::after {
		    position: absolute;
		    content: "";
		    left: 12px;
		    top: 12px;
		    height: 0px;
		    width: 0px;
		    border-radius: 5px;
		    border: solid #428bca;
		    border-width: 0 3px 3px 0;
		    -webkit-transform: rotate(0deg) scale(0);
		    -ms-transform: rotate(0deg) scale(0);
		    transform: rotate(0deg) scale(0);
		    opacity:1;
		    transition: all 0.3s ease-out;
		    -webkit-transition: all 0.3s ease-out;
		    -moz-transition: all 0.3s ease-out;
		    -ms-transition: all 0.3s ease-out;
		    -o-transition: all 0.3s ease-out;
		}
		.checkbox-label input:checked ~ .checkbox-custom::after {
		  -webkit-transform: rotate(45deg) scale(1);
		  -ms-transform: rotate(45deg) scale(1);
		  transform: rotate(45deg) scale(1);
		  opacity:1;
		  left: 8px;
		  top: 3px;
		  width: 6px;
		  height: 12px;
		  border: solid #428bca;
		  border-width: 0 2px 2px 0;
		  background-color: transparent;
		  border-radius: 0;
		}
		/* For Ripple Effect */
		.checkbox-label .checkbox-custom::before {
		    position: absolute;
		    content: "";
		    left: 10px;
		    top: 10px;
		    width: 0px;
		    height: 0px;
		    border-radius: 5px;
		    border: 2px solid #428bca;
		    -webkit-transform: scale(0);
		    -ms-transform: scale(0);
		    transform: scale(0);    
		}
		.checkbox-label input:checked ~ .checkbox-custom::before {
		    left: -3px;
		    top: -3px;
		    width: 24px;
		    height: 24px;
		    border-radius: 5px;
		    -webkit-transform: scale(3);
		    -ms-transform: scale(3);
		    transform: scale(3);
		    opacity:0;
		    z-index: 999;
		    transition: all 0.3s ease-out;
		    -webkit-transition: all 0.3s ease-out;
		    -moz-transition: all 0.3s ease-out;
		    -ms-transition: all 0.3s ease-out;
		    -o-transition: all 0.3s ease-out;
		}
		.view-more-btn{
			margin: 5px auto;
			text-align:center;
		}
		#showbrands{
			display: none;
		}
		#showhide-btn{
			border-style: none;
			background-color: #ffffff;
			color: #428bca;
		}

		  .side-sales{
		    margin-top: -25px;
		    height: 330px;
		  }
		  .sales-head{
		    height: 45px;
		    background-color: #003366;
		    color: white;
		    padding-top: 8px;
		    font-size: 20px;
		    padding-left: 25px;
		    border-bottom: solid .1px gray;
		  }
		  .sales-content{
		    position: relative;
		    margin-left: 0px;
		    margin-top: -25px;
		  }
		  .sales-responsive{
		    width: 100%;
		    height: auto;
		    margin-bottom: 10px;
		  }
		  #slideshow { 
		  	margin-top: 11%;
		    position: relative; 
		    width: 100%; 
		    height: 300px; 
		}
		#slideshow > div { 
		    position: absolute; 
		    top: 0px; 
		    left: 0px; 
		    right: 0px; 
		    bottom: 0px; 
		}
		
		/*side bar category sub menu*/
		/*.overlay {
		  position: absolute;
		  bottom: 0;
		  right: 0; 
		  background:#fff;
		  box-shadow: 0 0 4px 0 rgba(0,0,0,.25);
		  overflow: hidden;
		  width: 0;
		  height: 100%;
		  max-height: 100%;
		  overflow-y: scroll;
		  scrollbar-width: thin ;
		  transition: .5s ease;
		  display: none;
		}
		.text {
		  white-space: nowrap; 
		  color: white;
		  font-size: 20px;
		  position: absolute;
		  overflow: hidden;
		  top: 50%;
		  right: 50%;
		  transform: translate(-50%, -50%);
		  -ms-transform: translate(-50%, -50%);
		}
		.subMenu ul .concon:focus .overlay {
		  display: block;
		}		
		.subMenu ul .concon:hover .overlay {
		  display: block;
		}
		.overlay{
		  position: absolute;
		  z-index: 1;
		  width: 100%;
		  right: -100%;
		}
		.overlay ol{
		  margin-top: 10px;
		   margin-bottom: 10px;
		}
		.overlay ol li a{
		  color: #428bca;
		  font-size: 10px;
		  margin: 0;
		}
		.overlay ol li:hover{
		 background-color: #ededed;
		}*/

		@media screen and (max-width: 1400px) {
			.main{
					height: auto; 
					width: 1200px;
					margin: auto;
				}
			.side-con{
					width: 250px;
			}
			#sidebar #sideManu .subMenu ul li{
				margin-left: -75px;
			}
		}
		@media screen and (max-width: 1250px) {
			.main{
					height: auto; 
					width: 1000px;
					margin: auto;
				}
			.side-con{
					width: 225px;
			}
			#sidebar .sidebar-submenu li a {
				font-size: 10px;
			}
		}

		@media screen and (max-width: 600px) {
			.side-con{
				position: relative;
				width: 90%;
				margin-left: 5%;
			}
				.main{
					height: auto; 
					width: 100%;
					margin: auto;
				}

				.mytopnav{
					width: 90%;
					margin-left: 5%;
				}
				#myCarousel{
					width: 90%;
					margin-left: 5%;
				}
				#sidebar{
					width: 100%;
					margin-left: 0;
					margin-top: 1%;
					background-color: #ffffff;
					box-shadow: 0px 0px .5px .2px gray;
					position: relative;
					margin-bottom: 10px;
				}
				/*font size*/	
				.well{
					height: 45px;
				}
				.well img, .well a, .well span{
					height: 20px;
					font-size: 12px;
					margin-top: -5px;
				}
				#sidebar li a{
					font-size: 12px;
				}
        		.concon:hover .overlay {
				  position: absolute;
				  z-index: 1;
				  width: 100%;
				  right: 0;
				}
		}