/*.side-sales{
			display: none;
		}*/
		body{
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			padding: 0;
			margin:0;
			background-color: #ffffff;
		}
		.main{
			height: auto; 
			width: 1400px;
			margin: auto;
			padding: 10px;
			background-color: white;
			border-radius: 4px;
		}
		
		/* The flip box container - set the width and height to whatever you want. We have added the border property to demonstrate that the flip itself goes out of the box on hover (remove perspective if you don't want the 3D effect */
		 .all-con{
		 	/*background-color: #e3e3e3;*/
		 	position: relative;
		 	background-color: #ffffff; 	
			width: 79%;
			min-height: 440px;
			height: auto;
			overflow: hidden;
			margin-left: 22%;
			margin-top: 1%;
			margin-bottom: 5%;
			padding-left: 0px;
			padding-top: 10px;
			padding-bottom: 3%;
		 }

       .product_dtl{
			margin-left: 5px;
			margin-top: 1%;
			margin-bottom: 5%;
			width: 100%;
			height: auto;
		}
		.product_dtl li{
			float: left;
			list-style: none;
			text-decoration: none;
		}
		.product_dtl .p_title{
			margin-top: 5px;
			margin-left: 0;
			/*background-color: #e3e3e3;*/
			position: relative;
			border-radius: 5px;
			height: 40px;
			width: 100%;
			padding-left: 15px;
			padding-top: 5px;
		}
		.head_product_dtl{
			margin-left: 5px;
			position: absolute;
		}
		.head_product_dtl .drift-demo-trigger{
			margin-left: 0;
			width: 250px;
			height: 240px;			
		}
		.head_product_dtl:hover .detail{
			display: block;
		}
		.pdtl_name {
			position: relative;
			margin-left: 26%;
		}
		.line{
			margin-top: 5px;
			margin-left: 26%;
			width: 71.5%;
			border-bottom: 1px solid #b3b3b3;
			position: absolute;
		}	
		.pdtl_desc{
			margin-left: 26%; 
			margin-top: 30px; 
			width: 90%;
		}	
		.pdtl_tbl{
			overflow-x:auto; 
			margin-left: 10px; 
			margin-top: 10%; 
			width: 96.5%;
		}
				
		.pr-header{
			height: 40px;
			width: 200px;
			margin-top: -1.5%;
			margin-bottom: 2%;
			position: relative;
		}
		.pr-header h3{
			padding-top: -10px;
			margin-left: 20px;
		}

		/*ARROW HEADER DESIGN*/
		.product_dtl #pointer {
	      width: 230px;
	      height: 40px;
	      position: relative;
	      background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(6,60,101,1) 24%, rgba(87,122,150,1) 84%);
	      margin-left: 2%;
	      padding-left: 3%;
	      padding-top: 2px;
	      margin-bottom: 10px;
	    }
	    .product_dtl #pointer:after {
	      content: "";
	      position: absolute;
	      left: 0;
	      bottom: 0;
	      width: 0;
	      height: 0;
	      border-left: 20px solid white;
	      border-top: 20px solid transparent;
	      border-bottom: 20px solid transparent;
	    }
	    .product_dtl #pointer:before {
	      content: "";
	      position: absolute;
	      right: -20px;
	      bottom: 0;
	      width: 0;
	      height: 0;
	      border-left: 20px solid rgb(87,122,150);
	      border-top: 20px solid transparent;
	      border-bottom: 20px solid transparent;
	    }

		/*custom dropdown menu*/
		.custom-select-wrapper {
		     position: relative;
		     user-select: none;
		     width: 300px;
		     margin-left: 70%;
		     margin-top: -3%;
		     margin-bottom: 1%;
		}
		 .custom-select {
		     position: relative;
		     display: flex;
		     flex-direction: column;
		     border-width: 0 1px 0 1px;
		     border-style: solid;
		     border-color: #428bca;
		     border-radius: 3px;
		}
		 .custom-select__trigger {
		     position: relative;
		     display: flex;
		     align-items: center;
		     justify-content: space-between;
		     padding: 0 10px;
		     font-size: 15px;
		     color: #0066cc;
		     height: 35px;
		     line-height: 35px;
		     background: #ffffff;
		     cursor: pointer;
		     border-width: 1px 0 1px 0;
		     border-style: solid;
		     border-radius: 3px;
		     border-color: #428bca;
		}
		 .custom-options {
		     position: absolute;
		     display: block;
		     top: 100%;
		     left: 0;
		     right: 0;
		     border: 1px solid #394a6d;
		     border-top: 0;
		     background: #fff;
		     transition: all 0.5s;
		     opacity: 0;
		     visibility: hidden;
		     pointer-events: none;
		     z-index: 2;
		}
		 .custom-select.open .custom-options {
		     opacity: 1;
		     visibility: visible;
		     pointer-events: all;
		}
		 .custom-option {
		     position: relative;
		     display: block;
		     padding: 0 10px 0 10px;
		     font-size: 15px;
		     color: #3b3b3b;
		     line-height: 35px;
		     cursor: pointer;
		     transition: all 0.5s;
		}
		 .custom-option:hover {
		     cursor: pointer;
		     background-color: #b2b2b2;
		}
		 .custom-option.selected {
		     color: #ffffff;
		     background-color: #305c91;
		}

		.arrow {
		     position: relative;
		     height: 15px;
		     width: 15px;
		}
		 .arrow::before, .arrow::after {
		     content: "";
		     position: absolute;
		     bottom: 0px;
		     width: 0.15rem;
		     height: 100%;
		     transition: all 0.5s;
		}
		 .arrow::before {
		     left: -5px;
		     transform: rotate(45deg);
		     background-color: #0066cc;
		}
		 .arrow::after {
		     left: 5px;
		     transform: rotate(-45deg);
		     background-color: #0066cc;
		}
		 .open .arrow::before {
		     left: -5px;
		     transform: rotate(-45deg);
		}
		 .open .arrow::after {
		     left: 5px;
		     transform: rotate(45deg);
		}
		/*end*/

		/*RELATED PRODUCTS*/
		.tab-content{
			margin-left: -1%;
		}
		.tab-content  .col-sm-3{
			width: 23.3%; 
			margin-left: 1%; 
			margin-top: 1%;
			padding: 0;	
			border: 1px solid  	#E8E8E8;
		}
		.col-item .photo img{
		    margin: 0 auto;
		    width: 100%;
		    height: 200px;
		    border: none;
		}
		.col-item .info{
		    padding: 10px;
		    border-radius: 0 0 5px 5px;
		}
		.col-item .info .row .price h6{
			width: 190px;
		}
		.col-item:hover{
		    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
		}
		.col-item .price{
		    float: left;
		    margin-top: 5px;
		}
		.col-item .price h5{
		    line-height: 20px;
		    margin: 0;
		}
		.price-text-color{
		    color: #00990E;
		}
		.col-item .info .rating{
		    color: #003399;
		}
		.col-item .rating{
		    float: left;
		    font-size: 17px;
		    text-align: right;
		    line-height: 52px;
		    margin-bottom: 10px;
		    height: 52px;
		}
		.col-item .separator{
		    border-top: 1px solid #FFCCCC;
		}
		.clear-left{
		    clear: left;
		}
		.col-item .separator p{
		    line-height: 20px;
		    margin-bottom: 0;
		    margin-top: 10px;
		    text-align: center;
		}
		.col-item .separator p i{
		    margin-right: -15px;
		    margin-top: 3px;
		    float: left;
		}
		.col-item .btn-add{
		    width: 50%;
		    float: left;
		}
		.col-item .btn-add{
		    border-right: 1px solid #CC9999;
		}
		.col-item .btn-details{
		    width: 50%;
		    float: left;
		    padding-left: 10px;
		}

		 /*dropdown login*/
		.navbar-default{background:#3285D1;border-color: #3285D1;}
	    .navbar-default .navbar-nav > li > a{color:#FFF;}
	    /*.nav > li > a{margin:15px; font-size: 17px; color:#FFF;}
	    .nav .open > a, .nav .open > a:hover, 
	    .nav .open > a:focus,
	    .nav > li > a:hover, .nav > li > a:focus{background-color:transparent !important;}*/

      	.navbar-brand{    
          margin: 15px !important;
          padding: 13px !important;
          color: #fff !important;
          font-size: 2em !important;
          font-weight: bold !Important;
        }
          
	    .navbar-toggle{margin-top:20px !important;}
	    .dropdown-menu{background:#fff !important;}
	    .navbar-login
	    {
	        width: 300px;
	        padding: 10px;
	        padding-bottom: 0px;
	    }

      	.navbar-login-session
      	{
            padding: 10px;
            padding-bottom: 0px;
        	padding-top: 0px;
      	}

	    .icon-size
	    {
	        font-size: 87px;
	    }

      	.dropdown-container{
      		position: absolute; 
      		margin-left: 1240px;
      	}
      	/*end of dropdown login*/





@media screen and (max-width: 1400px) {
			.main{
					height: auto; 
					width: 1200px;
					margin: auto;
				}
			.side-con{
					width: 250px;
			}

			.pdtl_name {
					position: relative;
					margin-left: 28%;
				}
				.line{
					margin-top: 5px;
					margin-left: 28%;
					width: 69%;
					border-bottom: 1px solid #b3b3b3;
					position: absolute;
				}	
				.pdtl_desc{
					margin-left: 28%; 
					margin-top: 30px; 
					width: 90%;
				}	
				.pdtl_tbl{
					overflow-x:auto; 
					margin-left: 10px; 
					margin-top: 12%; 
					width: 96%;
				}

				.subMenu ul li{
					margin-left: -40%;
				}

				/*custom dropdown menu*/
				.custom-select-wrapper {
				     position: relative;
				     user-select: none;
				     width: 250px;
				     margin-left: 70%;
				     margin-top: -3%;
				     margin-bottom: 1%;
				}

				
		}
		@media screen and (max-width: 1250px) {
				.main{
					height: auto; 
					width: 1000px;
					margin: auto;
				}
				.pdtl_name {
					position: relative;
					margin-left: 36%;
				}
				.line{
					margin-top: 5px;
					margin-left: 36%;
					width: 61%;
					border-bottom: 1px solid #b3b3b3;
					position: absolute;
				}	
				.pdtl_desc{
					margin-left: 36%; 
					margin-top: 30px; 
					width: 90%;
				}	
				.pdtl_tbl{
					overflow-x:auto; 
					margin-left: 10px; 
					margin-top: 14%; 
					width: 96%;
				}
				.all-con{
					width: 74%;
					margin-left: 26%;
				}	
				 /*custom dropdown menu*/
				.custom-select-wrapper {
				     position: relative;
				     user-select: none;
				     width: 230px;
				     margin-left: 65%;
				     margin-top: -4%;
				     margin-bottom: 1%;
				}
				.col-item .info{
					height: 50px;
				}
				.col-item .info .row{
					margin-left: -5%;
					margin-top: -5%;
					margin-bottom: 0;
					padding: 0;
					width: 170px;
				}
				.btn-add a{
					font-size: 10px;
					margin-left: 10px;
				}
				.btn-details a{
					font-size: 10px;
					margin-left: -5px;
				}
				.btn-details i{
					margin-left: 2px;
				}
				.col-item .btn-details{
					width: 50%;
				    float: left;
				    padding-left: 0;
				    margin-left: 0px;
				}
				.col-item .info .rating{
				    color: #003399;
				    font-size: 10px;
				}
				.col-item .info .row .price h6{
					width: 170px;
					margin-left: -25%;
					font-size: 10px;
				}
				.col-item .price h5{
				    line-height: 20px;
				    font-size: 12px;
				    margin-top: -10px;
				    margin-left: -25%;
				}
				.col-item .photo img{
					margin-top: -7%;
					height: 150px;
				}

				.head_product_dtl .detail{
					width: 70%;
					height: 300px;
				}

		}

		/*for mobile responsiveness--------------------------------------------------------------------------*/
			@media screen and (max-width: 600px) {
				.main{
					height: auto; 
					width: 100%;
					margin: auto;
					padding: 0;
				}
				.header1{
			      height: 55px;
			      width: 90%;
			      margin-left: 5%;
			      background: linear-gradient(90deg, rgba(2,0,36,1) 0%, rgba(6,60,101,1) 24%, rgba(87,122,150,1) 84%);
			    }
			    .header1 a {
			      float: left;
			      display: block;
			      text-align: center;
			      text-decoration: none;
			      color: white; 
			      font-family: sans-serif;
			      padding-top: 7px;
			      padding-left: 20px;
			    }    
			    #header{
			      margin-left: 5%;
			      width: 90%;
			      height: 10%;
			      position: relative;
			    } 
				#header img{
					width: 100px;
					height: 30px;
				}		
				.mytopnav{
					width: 90%;
					margin-left: 5%;
				}
				.mytopnav #bs-example-navbar-collapse-1 li:hover{
					color: white;
					background-color: #989244;
				}
				.mytopnav #bs-example-navbar-collapse-1 a{
					color: white;
				}
				.mytopnav #bs-example-navbar-collapse-1 .dropdown-menu li a{
					color: black;
				}
				.mytopnav #bs-example-navbar-collapse-1  .actives{
					color: #a9a34c;
				}
				.mytopnav #bs-example-navbar-collapse-1  .actives:hover{
					color: white;
				}
				.searchbar{
			      margin-left: 1%;
			      height: 90px;
			      position: relative;
			    }
			    #header .input-group{
			    	width: 105%;
			    }
			    #frm_search{
			    	width: 95%;
			        margin-top: 20px;
			    }
			    .input-group .form-control{
			      width: 100%;
			      box-sizing: border-box;
			      display: block;
			      height: 40px;
			    }
			    #frm_search button{
			      height: 40px;
			    }
			    .socialmedia-btn{
			      margin-left: 55%; 
			      margin-top: 2px; 
			      width: auto; 
			      position: absolute;
			    }
				#myCarousel{
					width: 90%;
					margin-left:5%;
				}
				
				#photo-slider .item{
        			height: 150px;
        		}
        		#photo-slider .item img{
        			height: 150px;
        		}
				.topnav a{
					height: 35px;
					padding-top: 8px;
					font-size: 12px;
				}
				.topnav .dropbtn{
					height: 35px;
					padding-top: 8px;
					font-size: 12px;
				}
				.dropdown-content a{
					height: 35px;
					padding-top: 8px;
				}
				#myCarousel{
					width: 90%;
					margin-left: 5%;
				}
				#photo-slider .item{
        			height: 150px;
        			width: 100%;
        		}
        		#photo-slider .item img{
        			height: 150px;
        			width: 100%;
        		}

        		.col-item .info .row{
					margin-left: 0;
					margin-top: 0;
					margin-bottom: 0;
					padding: 0;
					width: 100%;
					height: 70px;
				}
				.col-item .rating{
				    margin-right: 5%;
				}
				.btn-add a{
					font-size: 14px;
					margin-left: 10px;
				}
				.btn-details a{
					font-size: 14px;
					margin-left: -5px;
				}
				.col-item .info .row .price h6{
					width: 170px;
					margin-left: 0;
					margin-top: 10%;
					font-size: 12px;
				}
				.col-item .price h5{
				    line-height: 20px;
				    font-size: 12px;
				    margin-top: 10px;
				    margin-left: 0;
				}
        		.all-con{
        			width: 90%;
					margin-left: 5%;
					border: none;
					box-shadow: none;
				}					
				.brands_container{
				 	background-color: white;
				 	width: 100%;
				 	height: 300px;
				 	margin-left: -10px;
				 	margin-top: 10px;
				 }
				 .brands_container h4,.brands_container h6{
				 	margin-left: 15px;
				 	color: gray;
				 	padding-right: 10px;
				 }
				 .brands_container:hover{
				 	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
				 }
				 .product_dtl{
					margin-left: 0;
					margin-top: 1%;
					margin-bottom: 5%;
					width: 100%;
					height: auto;
				}
				.product_dtl li{
					float: left;
					list-style: none;
					text-decoration: none;
				}
				.product_dtl .p_title{
					margin-top: 5px;
					margin-left: 0;
					background-color: #e3e3e3;
					position: relative;
					border-radius: 5px;
					height: 40px;
					width: 100%;
					padding-left: 15px;
					padding-top: 5px;
				}
				.head_product_dtl{
					margin-left: 5px;
					position: relative;
				}
				.head_product_dtl .imgl{
					margin-left: 0;
					width: 250px;
					height: 240px;			
				}
				.pdtl_name {
					position: relative;
					margin-left: 5%;
				}
				.line{
					margin-top: 5px;
					margin-left: 5%;
					width: 90%;
					border-bottom: 1px solid #b3b3b3;
					position: absolute;
				}	
				.pdtl_desc{
					margin-left: 5%; 
					margin-top: 30px; 
					width: 90%;
				}	
				.pdtl_tbl{
					overflow-x:auto; 
					margin-left: 10px; 
					margin-top: 50px; 
					width: 90%;
				}
				.head_product_dtl:hover .detail{
					display: none;
				}
				/*custom dropdown menu*/
				.custom-select-wrapper {
				     position: relative;
				     user-select: none;
				     width: 100%;
				     margin-left: 0;
				     margin-top: 0;
				     margin-bottom: 1%;
				}
				/**product slider container*/			
				.tab-content  .col-sm-3{
					width: 95%;
					margin-left: 4%;
					margin-bottom: 15px;
				}
				.tab-content .col-item{
					width: 100%;
					height: auto;
					box-shadow: 0px 0px 2px 2px #D3D3D3;
				}
				.tab-content .col-item .info .row .price h6{
					width: 150px;
				}
				.tab-content .col-item:hover{
					box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
				}
				.tab-content .controls{
					margin-top: -10px;
					margin-right: 15px;
				}			
				.tab-content .col-item .photo img{
				    margin-top: -10px;
				    width: 100%;
				    height: auto;
				}
				.tab-content .info{
					height: 60px;
				}
				.tab-content{
					position: relative;
					margin-left: 0;
					height: auto;
					margin-bottom: 5%;
					border-radius: 2px;			
					width: 100%;
				}			
				.tab-content .col-sm-3{
					width: 100%; 
					margin-left: 2.4%; 
					padding: 0;
				}
				.tab-content .col-item{
					width: 95%;
					height: auto;
				}						
				.tab-content .col-item .photo img{
				    margin-top: -10px;
				    width: 100%;
				    height: auto;
				}
				.tab-content .info{
					height: 60px;			
				}	
				.custom-select-wrapper {
				    margin-top: 8%;
				    width: 90%;
				    margin-left: 5%;
				}
			}	




a.btn-social,
.btn-social
{
    border-radius: 5%;
    color: #ffffff !important;
    display: inline-block;
    height: 34px;
    line-height: 34px;

    text-align: center;
    text-decoration: none;
    transition: background-color .3s;
    webkit-transition: background-color .3s;
    width: 34px;
}

.btn-social .fa,.btn-social i
{
    backface-visibility: hidden;
    moz-backface-visibility: hidden;
    ms-transform: scale(1);
    o-transform: scale(1);
    transform: scale(1);
    transition: all .25s;
    webkit-backface-visibility: hidden;
    webkit-transform: scale(1);
    webkit-transition: all .25s;
}
.btn-social:hover,.btn-social:focus
{
    color: #fff;
    outline: none;
    text-decoration: none;
}
.btn-social:hover .fa,.btn-social:focus .fa,.btn-social:hover i,.btn-social:focus i
{
    ms-transform: scale(1.3);
    o-transform: scale(1.3);
    transform: scale(1.3);
    webkit-transform: scale(1.3);
}

.btn-social.btn-sm
{
    font-size: 13px;
    height: 36px;
    line-height: 18px;
    margin: 6px 2px;
    width: 36px;
}

.btn-twitter
{
    background-color: #55acee;
}
.btn-twitter:hover
{
    background-color: #83c3f3;
}
.btn-facebook
{
    background-color: #3b5998;
}
.btn-facebook:hover
{
    background-color: #4c70ba;
}
.btn-instagram
{
    background-color: #0976b4;
}
.btn-instagram:hover
{
    background-color: #0b96e5;
}