/*
<div class="fa-welcome">
<img alt="" height="auto" src="http://192.168.1.10/faa/image/data/flavourart-panel2.png" style="border-radius:3px; float:left" width="22.25%" />
<a href="http://youtube.com/watch?v=XOUVQfBnS-Y" target="_blank"><img alt="FlavourArt - Flavours With Soul" height="auto" src="http://192.168.1.10/faa/image/data/flavour_with_soul_opt.png" style="float:right; border-radius:3px;" width="76.5%" /></a>
</div>
*/


body {
font-family: 'Open Sans', sans-serif;
}
body, td, th, input, textarea, select, a {
font-size: 13px;
}
a, a:visited, a b {
color: #08c;
text-decoration: none;
cursor: pointer;
}
a:hover {
color: #333;
}
.fa {
font-size: 14px;
}
h1, .welcome {
color: #08c;
font: 'Open Sans', sans-serif;
font-size: 30px;
text-shadow: none;
font-weight: 400
}
.breadcrumb a {
color: #777 !important;
}
#container {
width: 95%;
max-width: 1080px;
}
#header {
height: 105px;
}
#welcome, #currency, .price-tax, .product-list .compare, .product-compare {
display: none;
}
#header #logo {
left: 0px;
width: 62%;
max-width: 500px;
top: 28px;
}
#header #logo img {
width: 100%;
}

#menu-mobile ul {
position: relative !important;
}
#cart i {
font-size: 15px;
margin-right: 12px;
color: #08c;
}
#header #cart {
top: 26px;
right: 0px;
min-width: 195px;
}
#header #cart .heading h4 {
display: none;
}
#header #cart .heading {
border: 1px solid #ccc;
padding: 7px 15px 8px 15px;
border-radius: 3px;
margin-right: 0px;
margin-top: 7px;
text-align: center;
width: 163px;
}
#header #cart .heading a {
color: #08c;
}
#header #cart .heading a:hover {
color: #444;
}
#header #cart.active {
margin-top: 2px;
}
#header #cart.active .heading {
margin-top: 5px;
padding-top: 7px;
padding-bottom: 6px;
border: 1px solid #ccc;
border-bottom: none;
border-radius: 3px 3px 0px 0px;
}
#header #cart .content {
color: #777;
border: 1px solid #ccc;
border-radius: 3px 0px 3px 3px;
box-shadow: none;

}

#header .links {
right: 0px;
top: 0px;
padding: 7px 0px 6px 0px;
/*background: #f4f4f4;
border: 1px solid #ccc;
border-top: none;
border-radius: 0 0 3px 3px; */
height: 18px;
}
#header .links a + a {
margin-left: 12px;
border-left: none;
}
#header .links a {
color: #08c;
}
#header .links a:hover {
color: #444;
}
.links i {
padding-right: 5px;
}

#menu {
background: #08c;
background-image: linear-gradient(to bottom, #009ae6, #0076b1);
border: 1px solid #0074ad;
border-bottom: 1px solid #08436c;
border-radius: 3px;
box-shadow: none;
margin-bottom: 10px;
}
#menu > ul > li > a, #menu-mobile > div {
text-transform: uppercase;
font-size: 12px;
font-weight: 700;
text-shadow: 0 0 3px #000;
}
#menu > ul > li:hover > a {
color: #444;
background: #fff;
border-radius: 2px;
text-shadow: none;
}
#menu > ul > li > div {
background: #fff;
border: 1px solid #ccc;
border-top: none;
margin-top: 1px;
border-radius: 0px 0px 3px 3px;
}
#menu > ul > li > div > ul > li > a {
color: #444;
}
#menu > ul > li ul > li > a:hover {
background: #fff;
color: #08c;
}
#menu > ul > li > div > ul {
padding: 5px 10px;
}

#header .search{
		display: block;
		box-sizing: border-box;
		position: relative;
		width: 33%;
		height: 34px;
		margin-bottom: 15px;
		top: 75px;
		right: 0px;
		float: right;
	}
	
	#header .search .button-search {
		display: inline-block;
		background-color: #079BDC;
		background-image: none;
		border-right: none;
		line-height: 30px;
		height: 34px;
		text-align: center;
		font-weight: bold;
		box-sizing: border-box;
		float: right;
		border: 1px solid #ccc !important;
		background: #f4f4f4 !important;
		color: #777 !important;
		width: 18% !important;
		border-radius: 0 3px 3px 0;
	}
	
	#header .search input {
		padding: 0 0 0 10px !important;
		box-shadow: none;
		display: inline-block;
		width: 82% !important;
		box-sizing: border-box;
		height: 34px;
		line-height: 21px;
		font-size: 13px;
		float: left;
		border: 1px solid #ccc !important;
		border-right: none !important;
		background: #fff !important;
		border-radius: 3px 0 0 3px;
	}

i.fa.fa-search:hover {
color: #08c;
}
.box .box-heading {
border-radius: 3px 3px 0px 0px;
border: 1px solid #bbb;
background: #b1d7ee;
background-image: linear-gradient(to bottom, #b1e0ff, #a7cde1);
color: #fff;
font-family: 'Open Sans', sans-serif;
text-transform: uppercase;
font-size: 12px;
text-shadow: 0 0 3px #000;
}
.box .box-content {
background: #FFFFFF;
border-radius: 0px 0px 3px 3px;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
ul {
list-style-type: none;
}

a.button, input.button {
border-radius: 3px;
background: #08c;
background-image: linear-gradient(to bottom, #009ae6, #0076b1);
border: 1px solid #0074ad;
border-bottom: 1px solid #08436c;
box-shadow: none;
color: #fff;
height: 31px;
line-height: 29px;
padding: 0px 12px 0px 12px;
font-family: 'Open Sans', sans-serif;
text-transform: uppercase;
font-size: 11px;
text-shadow: 0px 0px 1px #444;
}
a.button:hover, input.button:hover {
background: #0074ad;
}
.product-grid {
padding-top: 15px;
border-top: 1px solid #eee;
}
.box-product, .product-grid  {
text-align: center;
}

.box-product a.button, .product-grid a.button, .box-product input.button, .product-grid input.button, .product-grid input.button-grey, .box-product input.button-grey {
height: 26px;
line-height: 24px;
width: 90%;
}
.product-list a.button, .product-list input.button, .product-list input.button-grey {
width: 100%;
max-width: 220px;
}

.box-category li a:hover {
color: #08c;
}
.box-product a:hover, .box-category li ul li a:hover {
color: #444;
}
.featured .box-product > div, .product-grid > div {
width: 150px;
margin-right: 15px;
margin-left: 15px;
margin-bottom: 15px;
}
.product-grid > div {
margin-bottom: 15px;
width: 155px;
margin-right: 15px;
margin-left: 15px;
padding: 5px;
border: 1px solid #ddd;
border-radius: 3px;
}
.box-product .name, .product-grid .name {
min-height: 36px;
}
.box-product .name a, .product-grid .name a {
color: #08c;
}
.box-product .image img, .product-grid .image img {
padding: 0px;
border: none;
border-radius: 3px;
}
.featured.box {
margin-top: 10px;
}
.product-list {
margin-top: 0px;
}
.product-list .image img {
padding: 0;
border: none;
width: 150px;
border-radius: 3px;
}
.product-list > div {
border-top: 1px solid #EEEEEE;
padding-top: 15px;
}
.product-list .image {
margin-right: 25px;
}
.product-list .name {
padding-top: 0px;
}
.product-list .price {
float: none;
height: 30px;
margin-left: 8px;
text-align: left;
color: #444;
font-size: 14px;
font-weight: 700;
}
.product-list > div {
margin-bottom: 3px;
}
.product-list .description {
min-height: 44px;
}
.product-filter {
border-bottom: none;
}

.welcome {
display: none;
}
#powered {
background: #fff;
text-align: center;
border-top: 2px solid #08c;
padding: 10px 0 20px 0;
margin-top: 20px;
}
#content {
margin-bottom: 15px;
}
#footer {
border: 1px solid #ccc;
background: #F4f4f4;
border-radius: 3px;
}
#footer .column {
width: 25%;
text-align: center;
}
#footer .column ul {
margin: 0;
padding: 0;
}
#footer h3 {
color: #08c;
}
#footer .column a {
text-decoration: none;
color: #777;
}
#footer .column a:hover {
color: #000;
text-decoration: none;
}
.product-list .name a, .product-grid .name a {
color: #08c;
}
.product-grid .image img {
width: 150px;
border-radius: 3px;
}
.product-grid .wishlist, .product-grid .compare, .product-list .wishlist, .product-list .compare {
display: none;
}
.product-list .cart {
margin-bottom: 17px;
padding-top: 14px;
text-align: right;
}
.product-info {
margin-bottom: 0px;
}
.product-info > .left {
width: 45%;
}
.product-info > .left + .right {
margin-left: 50%;
}
.product-info .image {
border: none;
width: 100%;
padding: 0;
}
.product-info img#image {
width: 100%;
max-width: 350px;
border-radius: 3px;
}
.product-info .description span {
color: #08c;
}
.product-info .cart .links {
padding-top: 5px
}
.product-info .cart .links a:hover {
color: #444;
}
.product-info .cart .links i {
padding-left: 5px;
font-size: 12px;
padding-top: 10px
}
h2#review-title {
color: #08c;
}
.price-extra {
color: #444;
font-weight: 400;
font-size: 13px;
padding-top: 7px;
}
.price-extra span {
color: #777

}
.htabs a {
border-radius: 3px 3px 0 0;
}
.htabs a.selected {
color: #08c;
}
.tab-content {
border-radius: 0 3px 3px 3px;
}
.product-info .review {
border-radius: 3px;
}
.product-filter .display a {
font-weight: 400;
}
ul.box-category > li ul {
display: block;
}
input.button-grey {
color: #FFFFFF;
line-height: 29px;
font-family: 'Open Sans', sans-serif;
font-size: 11px;
font-weight: 700;
background: #ccc;
border-radius: 3px;
margin: 0;
border: 1px solid #aaa;
height: 31px;
padding: 0px 12px 0px 12px;
text-transform: uppercase;
text-shadow: 0 0 1px #aaa;
}
.box {
margin-bottom: 10px;
}
.featured.box .box-heading {
background: none;
color: #08c;
border-bottom: none;
font-size: 16px;
font-weight: 400;
text-transform: none;
text-shadow: none;
}
.breadcrumb a:hover {
color: #000 !important;
}
.box-content ul {
padding-left: 10px;
}
.info-right {
float: right !important;
}
.captcha-box {
padding-top: 5px;
}
.footer-outer {
border-top: 1px solid #ccc;
padding-top: 20px;
}
.cat.box-product > div {
width: 130px;
margin-right: 10px;
margin-left: 10px;
margin-bottom: 15px;
}
.cat.box-product {
padding-top: 20px;
border-top: 1px solid #eee;
}
.cat.box-product a {
color: #444;
}
.cat.box-product a:hover {
color: #08c;
}
.cat-info-mobile {
display: none;
}
.category-info .image {
margin-right: 20px;
margin-top: 5px;
border-radius: 3px;
}
select {
border-radius: 2px;
}
.product-info .review > div img {
margin-bottom: -2px;
margin-right: 5px;
}
.product-grid .price, .featured .box-product .price {
float: left;
padding: 0 0 5px 10px;
margin-top: -2px;
}
.product-grid .rating, .featured .box-product .rating {
float: right;
padding-right: 5px;
}
.product-grid .cart, .featured .box-product .cart {
clear: both;
}
.list-price-rating {
height: 28px;
margin-top: 6px;
}
.product-list .price {
float: left;
margin-top: -3px;
}
.product-list .rating {
float: right;
}
table.radio tr.highlight:hover td {
background: #edf9ff;
}
.pagination .links b {
border: 1px solid #ccc;
color: #08c;
border-radius: 2px;
}



@media only screen and (max-width: 700px) {
#header #logo {
top: 40px;
}
}



@media only screen and (max-width: 640px) {
#header {
height: 65px ;
}
#header .search {
display: none;
}
#header #logo {
width: 95%;
top: 7px;
max-width: 400px;
}
#menu-mobile > div {
font-size: 13px;
font-weight: 700  !important;
text-transform: uppercase;
background: #08c;
background-image: linear-gradient(to bottom, #009ae6, #0076b1);
border: 1px solid #0074ad;
border-bottom: 1px solid #08436c;
border-radius: 3px;
cursor: pointer;
}
#menu-mobile ul {
width: 100% !important;
left: 0% !important;
border: none !important;
border-bottom: 3px solid #08c !important;
cursor: default;
border-radius: 0 0 3px 3px;
border-top: 3px solid #08c !important;
margin-top: -1px !important;
}
#menu-mobile ul li ul {
border: none !important;
margin-top: 0px !important;
}
#menu-mobile ul li a {
background: #f4f4f4;
font-weight: 700;
cursor: default;
border-right: 1px solid #08c;
border-left: 1px solid #08c;
padding: 1px 0 0 15px !important;
}
#menu-mobile ul li a:hover {
color: #08c;
}
#menu-mobile ul li ul li a {
padding: 0 30px;
border-bottom: #ccc 1px solid;
background: #fff;
font-weight: 400;
border-right: 1px solid #08c;
border-left: 1px solid #08c;

}
#menu-mobile > div > span {
background: none !important;
}
#menu-mobile > div > span.select {
width: 0px !important;
}
i.fa.fa-bars.m {
float: right;
font-size: 21px;
margin-top: 4px;
color: #f4f4f4;
}
i.fa.fa-bars.m:hover {
color: #fff;
}

#menu-mobile {
margin-bottom: 10px !important;
margin: 0 auto;
border-radius: 3px;
}
#search_mobile {
margin-bottom: 10px !important;
margin: 0 auto;
border-radius: 3px;
}
#search_mobile input {
border: 1px solid #ccc !important;
border-right: none !important;
background: #fff !important;
border-radius: 3px 0 0 3px;
line-height: 20px
}
#search_mobile .button-search-mobile {
border: 1px solid #ccc !important;
background: #f4f4f4 !important;
color: #777 !important;
width: 14% !important;
cursor: pointer;
border-radius: 0 3px 3px 0;

}
i.fa.fa-search.m:hover {
color: #08c;
}

#links-mobile {
background: #fff !important;
}
#links-mobile a {
color: #08c !important;
}
#links-mobile a:hover {
color: #444 !important;
}
#footer {
border: 1px solid #ccc !important;
border-bottom: none !important;
margin: 0px auto 10px auto;
border-radius: 3px;
}

#footer .column {
width: 100%;
}
#footer .column h3 {
font-size: 13px !important;
text-transform: uppercase;
text-shadow: none !important;
color: #444;
padding: 10px 12px !important;
background: #f4f4f4 !important;
margin: 0;
border-bottom: 1px solid #ccc;
cursor: pointer;
}
#footer .column h3:active {
color: #08c;
}
#footer .column ul {
background: #fff !important;
border-bottom: 1px solid #ccc;
padding: 5px 0 5px 18px !important;
}
#footer .column ul a {
font-size: 14px !important;
margin: 11px 0 !important;
color: #08c;
}
#footer .column ul a:hover {
text-decoration: none !important;
color: #333;
}


#content h2 {
border-radius: 3px 3px 0px 0px;
border: 1px solid #bbb;
border-bottom: none;
background: #b1d7ee;
background-image: linear-gradient(to bottom, #b1e0ff, #a7cde1);
color: #fff;
font-family: 'Open Sans', sans-serif;
text-transform: uppercase;
font-size: 12px;
text-shadow: 0 0 3px #000;
}
#content .content {
border: 1px solid #ccc;
}
.login-content .left .content, .login-content .right .content {
min-height: 0px !important;
}
.box-product .button {
margin: 0px auto;
height: 26px;
}

.product-list > div > div > div {
position: inherit;
}
.product-list > div {
position: relative;
height: 162px;
float: none;
}
.product-list .cart {
padding: 0px;
margin: 0;
width: 40%;
float: right;
position: absolute;
top: 120px;
}
.product-info > .left + .right {
margin-left: 0;
}
.product-info .left .image {
width: 100%;
}
.product-info .left .image img {
width: 100%;
max-width: 350px;
border-radius: 3px;
}
span.links a {
color: #08c;
font-family: 'Open Sans', sans-serif;
font-size: 14px;
height: 38px;
text-transform: uppercase;
border-radius: 3px;
box-shadow: none;
background: #ddd;
line-height: 38px;
border: 1px solid #ccc;
filter: none;
}
.product-info .cart div {
text-align: center;
}
.product-info .cart div input[type=text] {
width: 50% !important;
}
#tab-review h2 {
border-bottom: 1px solid #ccc;
margin-bottom: 10px;
}
#tabs a.selected {
color: #08c;
}
.product-list input.button-grey {
font-size: 11px;
}
.cart .m input.button-grey {
height: 40px;
line-height: 40px;
padding: 0;
font-size: 14px;
width: 100%;
margin: 10px 0 0 0;
}
.cart .m input.button {
font-size: 14px;
}
.fa-welcome {
display: none;
}
.cat.box-product.m > div {
width: 130px;
margin-right: 10px;
margin-left: 10px;
margin-bottom: 10px;
}
.cat-info-mobile {
display: inline;
}
}