/* ==========================================================================
   PBSA custom styles
   ========================================================================== */
body{font-family:'Lato', Arial;color:#222222;font-weight:300;}
a {color:#222222;}
a:hover {color:#b0ba1c;}
h1 {color:#2d0d03;font-family:'Roboto Slab', times;font-size:30px;}
h2 {color:#2d0d03;font-family:'Roboto Slab', times;font-size:25px;}
h3 {color:#2d0d03;font-family:'Roboto Slab', times;font-size:18px;}
.row-centered {text-align:center;}
.col-centered {display:inline-block;float:none;/* reset the text-align */text-align:left;/* inline-block space fix */ margin-right:-4px;}


.col-fixed {
    /* custom width */
    width:320px;
}
.col-min {
    /* custom min width */
    min-width:320px;
}
.col-max {
    /* custom max width */
    max-width:320px;
}

IE8 Support

The code works also on IE8 only if you make Bootstrap 3 work on IE8. To make it work you need to use Respond.js and follow the respond.js guidelines:

    Change the Bootstrap 3 Css netdna.bootstrapcdn.com to a local file: Respond.js only works with local Css files unless additional steps are taken.
    Change the Css from a style element to an external local Css with link rel="stylesheet": Respond.js doesn't parse Css referenced via @import, nor does it work with media queries within style elements.
    Reference the Respond.js script after all of your Css.

I publish free and open source plugins
My plugins
My plugins
rss
Rss
rss
Google+
rss
Twitter
Copyright © 2013 - 2016 Riccardo Caroli
Report a bug

/* General */
.cartBasket{ color:#fff;}
.cartBasket:hover{ color:#fff;  text-decoration:none;}
.navbar{ background-image: url('/images/woodtexture.jpg'); border-radius:0; margin-bottom:0px;}
#navbar{background-image:url(../images/topbar-animals.png); background-position:right; background-repeat:no-repeat; }
.navbar-meat2u{ margin-top:30px;}
.navbar-brand{ height:auto;  padding:.5em 0em 15px 15px;}
.navbar-nav > li > a{ color: #111;}
.navbar-toggle .icon-bar{ background-color: #fff;}
.imgThumb{ width: 180px; height: 180px;}
.textleft{ text-align: left;}
.bg-info{ padding:15px;}
.center-block{ text-align: center; width:100%; margin:1em auto;}
.modalBackground{background-color:Gray;filter: alpha(opacity=70);opacity: 0.7}
.th-Right{ text-align: right !important;}
.label{ font-weight:normal !important;}
#ctl00_txtSearch{ opacity:.7;}
#ctl00_txtSearch:hover, #ctl00_txtSearch:active{ opacity:1;}
.caption h3, .caption h4{ margin: 0px;}
.thumbnail{ border-radius:0; }

.list-group{ border: 1px solid #ddd; }
.list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover {
    background-image: linear-gradient(to bottom, #3c3c3c  0px, #222 100%);
    background-repeat: repeat-x;
    border-color: #222;
    text-shadow: 0 -1px 0 #222;
}
.list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover {
    background-color: #222;
    border-color: #222;
    color: #fff;
    z-index: 2;
}
.list-group-item h3{margin:0; color:#fff;}
.panel-primary { border-color: #B1BB1C;}
.panel-primary > .panel-heading {
    background: #292929;
    background-repeat: repeat-x;
    border-color:#B1BB1C;
}

/* Meat2U */

@media (min-width: 768px)
{
	.col-xs-6.col-md-4
	{
		height: 395px;
	}
}

#ctl00_cph1_pnlShowOrder{padding-bottom:20px;}
.topicon {color:#b0ba1c;font-size:20px!important;}
.searchicon {color:#b0ba1c;font-size:20px!important;}
.navbar-text{font-family:'Roboto Slab', times;text-decoration:none;font-weight:700;}
.navbar-nav li a, topicon {font-family:'Roboto Slab', times;text-decoration:none;font-size:15px;text-transform:uppercase;font-weight:700;text-shadow:0 0 8px rgba(0,0,0,0.5);color:#fff;}
.nav > li > a:focus, .nav > li > a:hover{color:#b0ba1c; background:none;}
.nav .open > a, .nav .open > a:focus, .nav .open > a:hover{background:none;}
.dropdown-menu > li > a{color:#222;}
.navigationtext a:hover {color:#b0ba1c;}
.productlist_title {font-size:17px;text-align:center;color:#2d0d03;font-family:'Roboto Slab', times;font-weight:400;}
.productlist_price {font-size:23px;font-weight:400;color:#b1bb1c;text-align:center;font-family:'Roboto Slab', times;}
.feature .thumbnail{ border: 0;}

.steelbar{background:url(../images/steelbg.png) 0 0 repeat-x; height:26px;}
.bckgrnd-img{ width: 100%;}
.main-section{background-image:url(../images/header-image.jpg); background-position:center; background-repeat:no-repeat; background-size: cover; position:relative; text-align:center; z-index:1;}
.gradient{background-image:url(../images/header-gradient.png); background-position:center top; background-repeat:no-repeat;  margin:auto; text-align:center; position:relative; top:-12px;}

.home-mid{background-image:url(../images/street-image.jpg); background-position:center; background-repeat:no-repeat; background-size: cover; position:relative; text-align:center; z-index:1;}
.home-story{background-color: rgba(255,  255,  255,  0.8);background: rgba(255,  255,  255,  0.8);}
.story{padding:30px 60px; margin-bottom:2em;}
.home-links{background-image: url('/images/woodtexture.jpg');}

.buttongroup {padding:20px;background:#ddd;}
.btn-meat{cursor:pointer;background:#b0ba1c;border-radius:0px;box-shadow:none;border:solid #b0ba1c 2px;color:#fff;font-size:13px;font-weight:700;padding:7px 20px;display:inline-block;text-transform:uppercase;font-family:'Roboto Slab', times;}
.btn-search{background:#b0ba1c; border-color:#b0ba1c;color:#222;}
.btn-meat:hover{ color:#b0ba1c;}
.btn-meat.hollow {border:solid #2d0d03 2px;color:#2d0d03;background:transparent;}
.btn-meat.hollow.reversed {border-color:#fff;color:#fff;}
.btn-meat:hover {background:#2d0d03;border-color:#2d0d03;}
.btn-meat.hollow:hover {color:#fff;}
.btn-meat.hollow.reversed:hover {opacity:0.8;background:transparent;}

.footer {background:url(../images/woodtexture.jpg);}
.footerinside {background:url(../images/steelbg.png) 0 0 repeat-x;padding:40px 20px 20px;}
.footertitle {font-size:14px;color:#b0ba1c;font-weight:400;font-family:'Roboto Slab', times;text-transform:uppercase;}
.footerlink a {font-size:14px;color:#fff;text-decoration:none;}
.footertext {font-size:14px;color:#fff;}
.footer-cards{ margin-top:1.5em;}

/* Tree View */
.tree{  width:100%;padding-left: 1em !important;}
.tree a{font-size:15px; color:#3c3c3c; font-weight:bold;}
.tree td{ vertical-align:middle; padding-top:10px; padding-bottom:10px;text-transform:capitalize; text-align:left; }
.treeHover {color:#C53430;}
.treeHover a:hover{ color:#C53430 !important; text-decoration:none!important; }
.treeSelected a{color:#C53430 !important;font-size:15px !important; text-decoration:underline !important; font-weight:bold }
.ctl00_tvCategories_1{ width: 100%;} /* this allows the look of bottom borders stretching right across*/
.tree a[id^="ctl00_tvCategoriesn"] { border-bottom:0px !important;}

/******************** Progress Panel Styles *****************************/
.progressPanel{top: 45%;left: 38%;position: absolute;background-color: #fff;position: fixed;z-index: 10002;border: solid 1px #7a7a7a;-moz-border-radius: 6px;-webkit-border-radius: 6px;border-radius: 6px;}
.progressPanel_layout{width: auto;color: #7a7a7a;text-align: center;margin: auto;padding:2em;}
.progressPanel_layout span{position: relative;padding-left: .5em; padding-right:.5em;}

/* Flex Nav */
.flexnav, .flexnav li ul {margin:0px;padding:0px; box-sizing:content-box;}
/* ------------------Flexnav Base Styles---------------------- */
.flexnav {-webkit-transition: none;-moz-transition: none;-ms-transition: none;transition: none;-webkit-transform-style: preserve-3d;overflow: hidden;margin: 0 auto;width: 100%;max-height: 0; }
.flexnav.opacity {opacity: 0; }
.flexnav.flexnav-show {max-height: 2000px;opacity: 1;-webkit-transition: all .5s ease-in-out;-moz-transition: all .5s ease-in-out;-ms-transition: all .5s ease-in-out;transition: all .5s ease-in-out; }
.flexnav li {position: relative;overflow: hidden; }
.flexnav li a {position: relative;display: block;padding: .96em;z-index: 2;/*overflow: hidden;*/text-transform:uppercase;letter-spacing:2px;text-decoration:none;border-bottom: 1px solid rgba(0, 0, 0, 0.15); color:#111;}
.flexnav li ul {width: 100%; }
.flexnav li ul li {font-size: 100%;position: relative;/*overflow: hidden; */ }
.flexnav li ul.flexnav-show li {overflow: visible; }
.flexnav li ul li a {height:auto;padding-left:40px;display: block;background: #ddd; color:#111; }
.flexnav ul li ul li a {background: #bfbfbc; }
.flexnav ul li ul li ul li a {background: #cbcbc9; }
.flexnav .touch-button {position: absolute;z-index: 999;top: 0;right: 0;width: 50px;height: 48px;display: inline-block;background: #acaca1;background: rgba(0, 0, 0, 0.05);text-align: center; }
.flexnav .touch-button:hover {cursor: pointer; }
.flexnav .touch-button .navicon {position: relative;top: 14px;font-size: 12px;color: #bbb; }

.menu-button {letter-spacing:2px;padding:8px 0px;text-align:center;display: block;color: #222222;cursor: pointer; font-size:2em;}
.menu-button .touch-button {display:none!important;background: transparent;position: absolute;z-index: 999;top: 0;left: 50%;margin-left:50px;width: 50px;height: 50px;display: inline-block;text-align: center; }
.menu-button .touch-button .navicon {font-size: 16px;position: relative;top: 1em;color: #ccc;}
.navbar-brand img{ max-width:200px;}
.home-links{text-align:center;}
.col-shop table td, .col-shop table th{padding:5px;}
/* ------------------END Flexnav Base Styles---------------------- */
/* 780 - 960: Landscape IPad and Small Desktop Browser */
@media all and (min-width:960px) 
{
		.sort-col{ padding-right:0em; padding-left:0em;}
}

@media all and (min-width:768px) 
{
	.flexnav {display: none; }
	.menu-button {display: none; } 
	.home-story { margin-top: 2em;}
	.btn-shop{font-size:1.5em; margin-bottom:2em; padding-left:2.5em; padding-right:2.5em;}
	.btn-story{font-size:1.2em; margin-bottom:1em; margin-top:1em; padding-left:2em;}
}
@media all and (max-width:400px)
{
	.navbar-brand { max-width: 80%; padding:0; height:auto;}
	.navbar-brand img{ max-width: 100%;}
	.eziweb img{ max-width:100% }
}










/* ---------------------------- testimonials ---------------------------------------- */

#testimonials{
	background: RGBA(0,0,0,.5);
	width:250px;
	margin:50px auto;
	padding: 20px 20px 40px 55px;
	position:absolute;
	top:-40px;
	right:0;
}
#testimonials .testimonial{
	position:absolute;
	left:0px;
	top:0px;
	width:175px;
	z-index:1;
}
#testimonials h2{
	color:#9ac800;
	font-size:22px;
	font-style:normal;
	line-height:22px;
	margin-bottom:10px;
}
#test_container{
	position:relative;
	overflow:hidden;
	color: #fff;
	text-align:right;
}
#testimonials .testimonial_text{
	font-size:14px;
	font-family:verdana;
	font-style:italic;
}
#testimonials .testimonial_name{
	font-size:14px;
	margin:10px auto 3px;
	font-style:normal;
	font-family:arial;
	color:#9ac800;
}
#testimonials .testimonial_designation{
	font-size: 12px;
	line-height: 14px;
	font-family:verdana;
}
#t_pagers{
	position:absolute;
	left:40%;
	bottom:10px;
	z-index:2;
}
#t_pagers .pager{
	display:inline-block;
	text-decoration:none;
	width:10px;
	min-height:10px;
	margin-right:5px;
	background:#ccc;
	border-radius:50%;
	cursor:pointer;
}
#t_pagers .pager.active{
	background:#9ac800;
}
	
@media all and (max-width:400px) 
{
    #testimonials{display:none;}
}