@font-face{
   font-family: 'JosefinSans-Bold';
   src:url('../fonts/JosefinSans-Bold.ttf') format('truetype');
}

@font-face{
   font-family: 'JosefinSans-SemiBold';
   src:url('../fonts/JosefinSans-SemiBold.ttf') format('truetype');
}

@font-face{
   font-family: 'Clab Personal Use-Bold';
   src:url('../fonts/Clab Personal Use-Bold.otf') format('opentype');
}

@font-face{
   font-family: 'OpenSans-Regular';
   src:url('../fonts/OpenSans-Regular.ttf') format('truetype');
}

body{ font-family: 'JosefinSans-SemiBold'; position: relative;}
p{margin-top: 10px;}

.header{
	color: #ffffff;
	transition: 0.3s;
}
.header a{ color:#ffffff; }

.header:hover{
	background: #ffffff;
	color:#333333;
}
.header:hover a{ color:#333333; }


.header2{
	background: #ffffff;
	color: #333333;
	transition: 0.3s;
}
.header2 a{ color:#333333; }

.brand{
	 font-family: 'JosefinSans-Bold';
	 text-decoration: none;
}
.brand:hover{text-decoration: none;}

.search{
	border:0;
	background: #eeeeee;
	padding:5px 7px;
	outline: none;
}

.top-right{margin-top: 10px;}

.top-right a{
	display: inline-block;
	/*color:#333333;*/
	text-decoration: none;
	padding: 10px;
}

.top-right a i{font-size: 18px;}
.navigation{margin-bottom: 0;}
.navigation .menu{margin:0; padding-left:0; }
.navigation .menu li{display: inline-block;}
.navigation .menu li a{display: inline-block; 
	padding: 10px 20px; 
	text-transform: uppercase; 
	 font-family: 'JosefinSans-SemiBold';
	font-size: 12px;
	/*color: #333333;*/
	text-decoration: none;
	letter-spacing: 0.5px;
}


.banner{
	padding: 0;
}

.mt150{margin-top: 150px;}

.mt70{margin-top: 70px;}
.mt50{margin-top: 50px;}
.mt30{margin-top: 30px;}
.nopad{padding: 0;}

.heading{letter-spacing: 1px; text-align: center;}
.coll p{
	font-size: 14px;
	color: #666666;
	letter-spacing: 1px;
}
.cat{
	margin-top: 30px;
}

.cat img{width:100%;}

.cat .catname{
	position: absolute;
	text-transform: uppercase;
	color:#ffffff;
	width: 100%;
	left: 0;
	bottom: 50px;
	text-align: center;
	letter-spacing: 1px;
	font-family: 'JosefinSans-Bold';
	transition: 0.5s;
}

.cat:hover .catname{
	bottom: 250px;
}

.cat a{
	text-decoration: none;
}

.cat .pname{
	text-align: center;
	color: #333333;

}

.cat .price{text-align: center;}

.footer{
	margin-top: 70px;
	background: #000000;
	color: #ffffff;
	padding-top: 50px;
	padding-bottom: 50px;
}

.footer ul{
	padding-left: 0;
	list-style: none;
}

.footer ul li a{
	display: block;
	color:#dddddd;
	letter-spacing: 1px;
	font-size: 11px;
	text-decoration: none;
	padding:7px 5px;
	padding-left: 0;
	text-transform: uppercase;

}

.footer h4{
	text-transform: uppercase;
	letter-spacing: 1px;
	font-size: 14px;
}

.footer p{
	line-height: 25px; 
	text-transform: uppercase;
	font-size: 12px;
	color:#dddddd;
}

.sort{
	margin: 0; 
	text-transform: uppercase;
	font-size: 12px !important;
}
.sort span{cursor: pointer;}
.sort .dropdown-menu{border-radius: 0; border:0}
.sort .dropdown-menu>li>a{
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 7px 10px;
	display: block !important;
}

.sort .dropdown-menu>li>span{
	display: block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding: 7px 10px;
	display: block !important;
}

.thumbs img{margin-bottom: 10px;}

.detail{padding-left: 50px;}
.pnamebig{
	color:#000000 !important;
	text-transform: uppercase;
	font-size: 16px !important;
	letter-spacing: 1px;
}
.pricebig{
	font-size: 16px;
	margin-top: 20px;
	letter-spacing: 0.5px;
}

.pricebig i{font-size: 14px;}

.detail .desc{
	color:#888888 !important;
	font-size: 13px;
	letter-spacing: 1px;
}

.feature p{
	color:#888888 !important;
	font-size: 13px;
	letter-spacing: 0.5px;
}

#pview{
	transition: 0.5s;
}

#country{
	width: 150px;
	border: 1px solid #cccccc;
	border-radius: 25px;
	padding: 5px 10px;
	text-align: center;
	background: #efefef;
	margin-top: 15px;
}

.size{
	color:#888888;
	font-size: 12px;
	text-transform: uppercase;
}

.sguide{
	color:#666666;
	font-size: 13px;
	text-transform: uppercase;
	cursor: pointer;
	display: inline-block;
	user-select: none;
}

.sizes{
	display: inline-block;
	padding: 5px 10px;
	border:1px solid #dddddd;
	width: 45px;
	text-align: center;
	padding-top: 9px;
	margin-right: 7px;
	margin-bottom: 7px;
	cursor: pointer;
	font-size: 13px;
}

.cactive{background: #000; color: #ffffff;}

.cs{
	display: inline-block;
	padding: 5px 10px;
	border:1px solid #dddddd;
	color:#333333;
	font-size: 13px;
	text-decoration: none;
	text-align: center;
	padding-top: 9px;
	margin-right: 7px;
	cursor: pointer;
}
.cs:hover{color:#333333;
	text-decoration: none;}


.atc{
	background: #000000;
	color:#ffffff;
	display: inline-block;
	padding:10px 30px;
	padding-top: 13px;
	height: 46px;
	border:0;
}

.atc:hover{
	color: #ffffff;
	text-decoration: none;
	border:0;
}


.enq{
	border: 1px solid #000000;
	color:#000000;
	display: inline-block;
	padding:10px 30px;
	padding-top: 13px;
	margin-left: 30px;
	height: 46px;
}

.enq:hover{
	color: #000000;
	text-decoration: none;
}

.atc i, .enq i{
	font-size: 18px;
	margin-right: 20px;
}

#myModal table{
	font-family: 'OpenSans-Regular';
	letter-spacing: 0.5px;
}

.item{
	border:1px solid #cccccc;
	width: 100%;
	float: left;
	padding: 10px;
	margin-bottom: 15px;
}

.item img{width: 90%;}

.remove{
	color:#666666;
}

.item .cs{
	font-size: 12px;
	margin-top: 0;
	margin-bottom: 5px;
	padding-top: 5px;
	padding-bottom: 3px;
}

.item .pname{margin-top: 5px;}
.item .price{
	font-size: 16px;
	font-weight: bold;
	letter-spacing: 1px;
	font-family: 'OpenSans-Regular';
}

.qty{margin-top: 10px; margin-bottom: 0;}
.qty a{
	font-size: 24px;
	display: inline-block;
	text-decoration: none;
	background: #eeeeee;
	color:#000000;
	width: 30px;
	height: 32px;
	text-align: center;
}

.qty span{
	display: inline-block;
	text-align: center;
	width: 50px;
	font-size: 18px;
}


.summary{
	border:1px solid #cccccc;
	width: 100%;
	float: left;
	padding: 10px;
	margin-bottom: 15px;
}

.summary p{
  font-size: 14px;
  color:#444444;
  line-height: 20px;
}

.bold{
	font-weight: bold;
	letter-spacing: 0.5px;
	font-size: 14px !important;
}

.amt{
	width: 230px;
	display: inline-block;
	text-align: right;
	font-family: 'OpenSans-Regular';
}

.tit{
	width: 90px;
	display: inline-block;
}

.checkout{
	background: #000000;
	color: #ffffff;
	text-align: center;
	width: 100%;
	display: block;
	padding:15px 10px;
	border:0;
}

.checkout:hover{
	color:#ffffff;
	text-decoration: none;
}

.save{
	margin-bottom: 20px !important;
	text-align: center;
	cursor: pointer;
}



.offers hr{margin-top: 10px; margin-bottom: 5px;}
.offers .fa-stack{margin-right: 8px;}
.per{
	font-size: 16px;
	margin: 0;
}

.cap{
	font-size: 13px;
	margin: 0;
	margin-left: 55px;
	margin-top: -10px;
}

.apply{
	float: right; 
	display: inline-block;
	margin-top: 5px;
}

.modal-body a{
	color:#333333;
	text-decoration: none;
}

.social i{
	font-size: 22px;
}

.social a{
	color:#ffffff;
	display: inline-block;
	margin-right: 15px;
	width: 40px;
	height: 40px;
	background: #555555;
	border-radius: 50%;
	text-align: center;
	padding-top: 8px;
}
.social a:hover{
	color:#ffffff;
}

#loading-image{position: relative;}
#loading-image img{position: absolute;}

.form label{font-weight: normal; font-size: 12px; text-transform: uppercase; letter-spacing: 1px;}
.form input[type='text']{
	width: 100%; 
	height: 35px; 
	padding-left: 10px; 
	outline: none; 
	letter-spacing: 1px; 
	border:1px solid #cccccc;
}
.form input[type='password']{
	width: 100%; 
	height: 35px; 
	padding-left: 10px; 
	outline: none; 
	letter-spacing: 1px; 
	border:1px solid #cccccc;
}

.form select{
	width: 100%; 
	height: 35px; 
	padding-left: 10px; 
	outline: none; 
	letter-spacing: 1px; 
	border:1px solid #cccccc;
	background: #ffffff;
}

.form input[type='tel']{
	width: 100%; 
	height: 35px; 
	padding-left: 10px; 
	outline: none; 
	letter-spacing: 1px; 
	border:1px solid #cccccc;
}

.form input[type='date']{
	width: 100%; 
	height: 35px; 
	padding-left: 10px; 
	outline: none; 
	letter-spacing: 1px; 
	border:1px solid #cccccc;
}

.form input[type='time']{
	width: 100%; 
	height: 35px; 
	padding-left: 10px; 
	outline: none; 
	letter-spacing: 1px; 
	border:1px solid #cccccc;
}
.form textarea{
	width: 100%; 
	height: 100px; 
	padding-left: 10px; 
	outline: none; 
	letter-spacing: 1px; 
	border:1px solid #cccccc;
}
.button{
	display: inline-block;
	padding: 10px 20px;
	background: #000000;
	color:#ffffff;
	border: 0;
	text-transform: uppercase;
}

.plinks li a{
	color:#000000;
	font-weight: normal;
	letter-spacing: 1px;
	font-size: 12px;
	text-transform: uppercase;
}

.odrs p{margin-top: 0; margin-bottom: 5px;}

.contact-form{
	border:1px solid #cccccc;
	padding: 25px;
}

@media(max-width: 768px)
{
	.head{padding: 0;}
	.top-right{padding: 0; text-align: left}
	.navbar-toggle{margin-top:-48px; margin-bottom: 0; margin-right:5px; }
	.navigation{min-height: 5px;}
	.navigation .menu li{display: block;}
	.navigation .menu li a{display: block; border-bottom: 1px solid #cccccc}
	.banner{margin-top: 105px;}

	.header{
	color: #333333;
	transition: 0.3s;
	}
	.header a{ color:#333333; }

	.header:hover{
		background: #ffffff;
		color:#333333;
	}
	.header:hover a{ color:#333333; }
	.coll{padding-left: 5px; padding-right: 5px;}
	.cat{padding-left: 5px; padding-right: 5px; margin-top: 10px;}
	.catname{font-size: 14px}
	.detail{padding-left: 5px; padding-right: 5px;}
	#pview{display: none;}
	.cart{padding: 0;}
	
	.item .pname{
		font-size: 11px;margin-top: 0;
	}
	.item img{width: 100%;}
	.itemdet{padding:0 7px; }
	.rem{padding: 0 5px;}
	.amt{width: 225px;}
	.mt150{margin-top: 120px;}
	/*.table-responsive{padding: 2px;}*/
	.table{margin-top: 0px; font-size: 13px;}


	.atc{	padding:10px 15px; }
   .enq{	padding:10px 15px; margin-left: 8px;}

   .footer h4{border-bottom: 1px solid #cccccc;padding-bottom: 7px; margin-top: 15px;}
}