body {font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#333#; margin:0px; padding:0px;}
.clear{ clear:both}
img{border:none}
#main{margin:0px; padding:0px; width:100%;}

#main #header{height:200px; background:#389e98 url(../images/header_banner.jpg)  no-repeat top center;}
#main .header{margin:0px auto; padding:0px; width:1000px; height:200px; background-image:url(../images/logo.png); background-repeat:no-repeat; background-position:-3px 46px;}


#main #mainnav{background:#08605e; height:40px; margin:0px; padding:0px;}
#main .mainnav{margin:0px auto; padding:0px; width:1000px; height:40px;}


#main #container{margin:0px; padding:0px;background: url(../images/big_banner.png) no-repeat top center fixed ; }
#main .container{margin:0px auto; padding:10px 0px; width:1000px;}
.indexpage #main .container{margin:0px; padding:10px 0px; width:1000px;overflow: auto; overflow-x: hidden}

#main .container h1{margin:0px; padding:0px; font-size:20px; font-weight:bold; color:#08605E;}
#main .container p{margin:0px; padding:0px; font-size:14px; text-align:justify; line-height:25px; color:#333333;}
#main .container .txt_content{background:#FFFFFF; padding:10px; margin:0px; border:2px solid #08605E; border-radius:5px;}
#main .container .txt_content_about{
background:#ffffff url(../images/aboutus.jpg) no-repeat top center; 
   min-height:700px;


padding:0px; margin:0px; border:2px solid #08605E; border-radius:5px;}
#main .container .txt_content_about strong{color:#990033; !important}
#main .container .txt_content_about img{width:100%;}
.about_txt{width:87%; margin:132px auto 20px auto;}
.about_txt h2{ font-family:"Monotype Corsiva"; font-size:40px; font-weight:bold; color:#08605e; margin:0px 0px 10px 0px; padding:0px;}
.about_txt p{font-family:"Monotype Corsiva"; font-size:27px !important; color:#000000 !important; line-height:40px !important; text-align:justify;}


#main #footer{background:#08605e; margin:0px; padding:10px 0px; color:#FFFFFF;}
#main .footer{margin:0px auto; padding:0px; width:1000px;}
#main #footer .lft_foot{float:left; text-align:left;}
#main #footer .rgt_foot{float:right; text-align:right;}
#main #footer a{color:#99FFFF; text-decoration:underline;}#main #footer a:hover{color:#FFFFFF; text-decoration:none}



/* FlexSlider Necessary Styles
*********************************/ 
.flexslider {width: 100%; margin:0px; padding:0px 0px 30px 0px;}
.flexslider .slides li {display: none;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {max-width: 100%; display: block;}


/* FlexSlider Default Theme
*********************************/
.flexslider {position: relative;}
.flexslider ul{margin:0px; padding:0px; list-style:none; list-style-type:none}
.flexslider ol{margin:0px; padding:1% 0px 0px 37%; list-style:none; list-style-type:none}
.flexslider .slides  li {position: relative; list-style:none; padding:42px 0px 42px 0px; margin:0px;}
/* Suggested container for "Slide" animation setups. Can replace this with your own, if you wish */
.flexslider-container {position: relative;}
/*.flexslider .slides  li img{-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
 border-top-left-radius: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
border-top-right-radius: 10px;
}*/

/* Caption style */
.flex-caption {width:98% !important; padding: 1% !important; position: absolute; left: 0; bottom:0px; background:#08605e; color: #fff !important; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px;-moz-border-radius-bottomright: 10px;
-webkit-border-bottom-right-radius: 10px;
border-bottom-right-radius: 10px;
-moz-border-radius-bottomleft: 10px;
-webkit-border-bottom-left-radius: 10px;
border-bottom-left-radius: 10px;}

.flex-caption2 {width:98% !important; padding: 1% !important; position: absolute; left: 0; top:0px; background:#08605e; color: #fff !important; text-shadow: 0 -1px 0 rgba(0,0,0,.3); font-size: 14px; line-height: 18px;-moz-border-radius-topleft: 10px;
-webkit-border-top-left-radius: 10px;
 border-top-left-radius: 10px;
-moz-border-radius-topright: 10px;
-webkit-border-top-right-radius: 10px;
border-top-right-radius: 10px;
}

/* Direction Nav */
.flex-direction-nav li a {width: 52px; height: 52px; margin: -13px 0 0; display: block; background: url(../images/bg_direction_nav.png) no-repeat 0 0; position: absolute; top: 50%; cursor: pointer; text-indent: -9999px; list-style:none;} /* set negative margin-top equal to half the height on the directional-nav for perfect vertical centering */
.flex-direction-nav li a.next {background-position: -52px 0; right: -15px;}
.flex-direction-nav li a.prev {background-position: 0 0; left: -15px;}

/* Control Nav */
.flex-control-nav ol { padding-left:50%;} /* set negative margin-left equal to half the width on the control-nav for perfect centering */
.flex-control-nav li {margin: 0 0 0 5px; float: left;}
.flex-control-nav li:first-child {margin: 0;}
.flex-control-nav li a {width: 13px; height: 13px; display: block; background: url(../images/bg_control_nav.png) no-repeat 0 0; cursor: pointer; text-indent: -9999px;}
.flex-control-nav li a:hover {background-position: 0 -13px;}
.flex-control-nav li a.active {background-position: 0 -26px; cursor: default;}

/* CSS for Button*/
.jcl_button {cursor:pointer;
 -moz-box-shadow:inset 0px 1px 0px 0px #085f60;
 -webkit-box-shadow:inset 0px 1px 0px 0px #085f60;
 box-shadow:inset 0px 1px 0px 0px #085f60;
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #1e8c83), color-stop(1, #085f5e) );
 background:-moz-linear-gradient( center top, #1e8c83 5%, #085f5e 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e8c83', endColorstr='#085f5e');
 background-color:#1e8c83;
 -moz-border-radius:6px;
 -webkit-border-radius:6px;
 border-radius:6px;
 display:inline-block;
 color:#ffffff;
 font-family:arial;
 font-size:14px;
 font-weight:bold;
 padding:8px 16px;
 text-decoration:none;
 text-shadow:1px 1px 0px #333333;
}.jcl_button:hover {
 background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #085f5e), color-stop(1, #1e8c83) );
 background:-moz-linear-gradient( center top, #085f5e 5%, #1e8c83 100% );
 filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#085f5e', endColorstr='#1e8c83');
 background-color:#085f5e;
}.jcl_button:active {
 position:relative;
 top:1px;
}


/* left product card css*/
 /* fonts  */

@import url('https://fonts.googleapis.com/css?family=Abel|Aguafina+Script|Artifika|Athiti|Condiment|Dosis|Droid+Serif|Farsan|Gurajada|Josefin+Sans|Lato|Lora|Merriweather|Noto+Serif|Open+Sans+Condensed:300|Playfair+Display|Rasa|Sahitya|Share+Tech|Text+Me+One|Titillium+Web');


#main #container #container_productcard{
	box-shadow: 0 15px 30px 1px rgba(128, 128, 128, 0.31);
	background: rgba(255, 255, 255, 0.90);
	text-align: center;
	border-radius: 5px;
	overflow: hidden;
	height: 720px;
	width: 270px;
	float:left;
	margin: 1em 4em 1em 2em;
	
}



/* 	Product details  */
#container_productcard .product-details {
	position: relative;
	text-align: left;
	overflow: hidden;
	padding: 20px 10px 5px 5px;
	height: 50%;
	float: left;
	width: 99%;

}

/* 	Product Name */
#container_productcard .product-details h1{
	font-family: 'Old Standard TT', serif;
	display: inline-block;
	position: relative;
	font-size: 26px;
	color: #344055;
	margin: 0px 0px 0px 8px;
	
}

#container_productcard .product-details h1 a{
	color: inherit; /* blue colors for links too */
  text-decoration: inherit; /* no underline */
}

#container_productcard .product-details h1:before{
	position: absolute;
	content: '';
	right: -5%; 
	top: 0%;
	transform: translate(25px, -15px);
	font-family: 'Farsan', cursive;
	display: inline-block;
	background: #FFA69E;
	border-radius: 5px;
	font-size: 15px;
	padding: 5px;
	color: #FFF;
	margin: 0;
	animation: chan-sh 6s ease infinite;

}


@keyframes chan-sh {
	from  {content: 'free shipping';}
	to  {content: 'New';}
	
}

/*Product Rating  */
.hint-star {
	display: inline-block;
	margin-left: 0.5em;
	color: gold;
	width: 50%;
}


/* The most important information about the product */
#container_productcard .product-details > p {
	font-family: 'Farsan', cursive;
	text-align: center;
	font-size: 14px;
	margin-right:6px;
	color: #7d7d7d;
	
}

/* control */

#container_productcard .control{
	position: absolute;
	bottom: 8%;
	left: 1.8%;
	
}

#container_productcard .controlright{
	position: absolute;
	bottom: 8%;
	right: 6%;
	
}
/* the Button */
#container_productcard .btn {
	transform: translateY(0px);
	transition: 0.3s linear;
	background: #49C608;
	border-radius: 6px;
  position: relative;
  overflow: hidden;
	cursor: pointer;
	outline: none;
	border: none;
	color: #eee;
	padding: 2px;
	margin: 5px 0px 0px 0px;
	
}

#container_productcard .btn:hover{transform: translateY(-5px);}

#container_productcard .btn span {
	font-family: 'Farsan', cursive;
	transition: transform 0.3s;
	display: inline-block;
  padding: 5px 5px 5px;
	font-size: 0.89em;
	margin:0;
	
}

#container_productcard .btn a {
	color: inherit; /* blue colors for links too */
  text-decoration: inherit; /* no underline */
	
}
/* shopping cart icon */
#container_productcard .btn .price, .shopping-cart{
	background: #333;
	border: 2px;
	margin: 0px;
	font-weight: bolder
}

#container_productcard .btn .price {
	transform: translateX(-5%); padding-right:10px;
}

/* the Icon */
#container_productcard .btn .shopping-cart {
	transform: translateX(-100%);
  position: absolute;
	background: #333;
	z-index: 1;
  left: 0;
  top: 0;
}

/* buy */
#container_productcard .btn .buy {z-index: 4; font-weight: bolder;}

#container_productcard .btn:hover .price {transform: translateX(-1%);}

#container_productcard .btn:hover .shopping-cart {transform: translateX(0%);}



/* product image  */
#container_productcard .product-image {
	transition: all 0.3s ease-out;
	display: inline-block;
	position: relative;
	overflow: hidden;
	height: 50%;
	float: right;
	width: 100%;
	display: inline-block;
}

#container_productcard img {width: 100%;height: 100%;}

#container_productcard .info {
    background: rgba(85, 107, 47, 0.9);
    font-family: 'Farsan', cursive;
    transition: all 0.3s ease-out;
    transform: translateX(-100%);
    position: absolute;
    line-height: 1.7;
    text-align: left;
    font-size: 100%;
    cursor: no-drop;
    color: #FFF;
   #height: 100%;
    width: 100%;
    left: 0;
    top: 0;
}

#container_productcard .info a {

    color: #FFF;
text-decoration:none;
}

#container_productcard .info h3 {text-align: center; margin-bottom:3px}
#container_productcard .product-image:hover .info{transform: translateX(0);}


#container_productcard .info ul li{transition: 0.3s ease;}
#container_productcard .info ul li:hover{transform: translateX(20px) scale(1.2);}

#container_productcard .product-image:hover img {transition: all 0.3s ease-out;}
#container_productcard .product-image:hover img {transform: scale(1.1, 1.1);}


/*

CSS for product details for product coming from databbase

*/

.container_product_details {
  max-width: 1200px;
  margin: 0 auto;
  padding: 15px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}



/* Columns */
.container_product_details .left-column {
  width: 48%;
  position: relative;
  margin: 20px 5px 10px 5px
}

.container_product_details .right-column {
  width: 49%;
  margin: 0px 5px 10px 5px

}


/* Left Column 
.container_product_details .left-column img {
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  transition: all 0.3s ease;
}

.container_product_details .left-column img.active {
  opacity: 1;
}
*/

/* Right Column */

/* Product Description */
.container_product_details .product-description {
  border-bottom: 3px solid #E1E8EE;
  margin-bottom: 20px;
}
.container_product_details .product-description span {
  font-size: 18px;
  color: #054f08;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-block;
  font-weight: 900;
  margin-bottom: 15px;

}

 
.container_product_details .product-description h1 {
  font-weight: 600;
  font-size: 46px;
  color: #43484D;
  margin-top:15px;
  letter-spacing: -2px;
    margin-bottom: 0px;

}

.container_product_details .product-description h1 span {
  font-size: 16px;
  color: #0e7b7c;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-decoration: none;
    font-weight: 600;

}

.container_product_details .product-description p {
  font-size: 16px;
  font-weight: 300;
  color: #484849;
  line-height: 24px;
}

.container_product_details .product-description ul {
	list-style-type: square;
    margin: 5px;
    font-size: x-small;
    /* font-weight: 500; */
    line-height: 1.6;
    color: #090909;
    font-family: cursive;
	}


/* Product Price */
.container_product_details .product-price {
  display: flex;
  align-items: center;
}

.container_product_details .product-price span {
  font-size: 28px;
  font-weight: 600;
  color: #43474D;
  margin-right: 20px;
}

.cart-btn {
  display: inline-block;
  background-color: #34820b;
  border-radius: 10px;
  font-size: 18px;
  color: #FFFFFF;
  text-decoration: none;
  padding: 14px 30px;
  transition: all .5s;
}
.cart-btn:hover {
  background-color: #64af3d;
  font-weight:600;
}

/* Responsive */
@media (max-width: 940px) {
  .container {
    flex-direction: column;
    margin-top: 60px;
  }

  .left-column,
  .right-column {
    width: 100%;
  }

  .left-column img {
    width: 300px;
    right: 0;
    top: -65px;
    left: initial;
  }
}

@media (max-width: 535px) {
  .left-column img {
    width: 220px;
    top: -85px;
  }
}

/** Start: to style navigation tab **/
		.nav {
				margin-bottom: 16px;
				margin-left: 25px;
				margin-right: 15px;
				list-style: none;
			}

			.nav > li > a {
			  display: block;
			}

			.nav-tabs{
			  *zoom: 1;
			}

			.nav-tabs:before,
			.nav-tabs:after {
			  display: table;
			  content: "";
			}

			.nav-tabs:after {
			  clear: both;
			}

			.nav-tabs > li {
			  float: left;
			}

			.nav-tabs > li > a {
			  padding-right: 12px;
			  padding-left: 12px;
			  margin-right: 30px;
			  line-height: 14px;
              text-decoration: none;
              font-size: 16px;
			  font-weight: 600;
				/* text-align: justify; */
			   margin-left: -30px;
			}

			.nav-tabs {
			  border-bottom: 3px solid #085f60;
			  width: 1150px;
			}

			.nav-tabs > li {
			  margin-bottom: -1px;
			}

			.nav-tabs > li > a {
			  color: #306ca1;	
			  padding-top: 20px;
			  padding-bottom: 10px;
			  line-height: 18px;
			  border: 5px solid transparent;
			  -webkit-border-radius: 4px 4px 0 0;
				 -moz-border-radius: 4px 4px 0 0;
					  border-radius: 4px 4px 0 0;
			}

			.nav-tabs > li > a:hover {
			  border-color: #eeeeee #eeeeee #dddddd;
			}

			.nav-tabs > .active > a,
			.nav-tabs > .active > a:hover {
			  color: #555555;
			  cursor: default;
			  background-color: #ffffff;
			  border: 5px solid #8c8484;
			  border-bottom-color: transparent;
			}

			li {
			  /*line-height: 18px;*/
			}

			.tab-content.active{
				display: inline-block;
				margin-left: 35px;
				margin-right: 15px;
			}

			.tab-content.active p {
				display: inline-block;
				margin-left: 35px;
				margin-right: 15px;
				padding:6px; 
				font-size:16px; 
				text-align:justify; 
				line-height:25px;
				color:#333333;
			}

			.tab-content.active ol {
				list-style-type: decimal;
				margin: 5px;
				font-size: x-small;
				/* font-weight: 500; */
				line-height: 1.8;
				color: #090909;
				font-family: inherit;
			}



			.tab-content.hide{
				display: none;
			}
			
