/**
 * Main Template CSS Stylesheet
 * 
 * BOOTSTRAP v3.4.0
 *
 */

/* STARTED BY CARLOS */

nav.navbar {height: 40px;border: 1px solid #ffffff;}
.mx-auto {width:100%;}

@media (min-width: 576px) { 
    .form-inline .input-group {
  width:55%;
}
}

/* Customizations Added by Carlos */
.mt-5 {
	margin-top: 1.5rem !important;}

.btn button_search {background:transparent;}

.list-group-flush>.list-group-item {
	border-width: 1px 1px 1px;}

.list-group-item {
    position: relative;
    display: block;
    padding: 1.0rem 1.0rem;
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, .125);
}

.list-group-item a {
	color:#000000;
	text-decoration:none;
	font-size:16px;
}

.card img,
.product img {
    border-radius: 6px;
}

list-group-item h4 centerBoxHeading ffm-header-link {color:#ffffff;}

.phone2 {display:none;}

#productListing .item {
    padding: 8px !important;
}

/* END BY CARLOS */
.clearBoth {
   clear: both;
}
.forward {
    float: right;
}
.back {
    float: left;
}

/* This is the code for the filter box and left column*/
#navColumnOne {
  width: 170px !important;
  max-width: 170px !important;
  flex: 0 0 170px !important;
}

#mainWrapper #contentMainWrapper,
#centerColumn {
  width: auto !important;
  flex: 1 1 auto !important;
}

/* Modern product title styling */
.centerBoxWrapper a,
.centerBoxContents a,
.itemTitle a,
.prod-listing a,
.productGeneral a,
.listingBox a,
.card-body a,
.card-title a {
    text-decoration: none !important;
    color: #222 !important;
    font-weight: 500;
	
}
	#navCatTabs a {
		text-decoration:none;
		padding: 14px 20px;
		font-size:15px;
}


.centerBoxWrapper a:hover,
.centerBoxContents a:hover,
.itemTitle a:hover,
.prod-listing a:hover,
.productGeneral a:hover,
.listingBox a:hover,
.card-body a:hover,
.card-title a:hover {
    text-decoration: none !important;
    color: #2c6bed !important;
}

/* This adds spacing around product items */
#productListing .item,
#productListing .product,
#productListing .thumbnail,
#productListing .listing-wrapper {
  padding: 10px !important;
}

/* This is used to re-size images */
img {
    max-width: 100%;
    height: auto;
    border: 0;
}

.qmix > br {
    display: none;
}

.normalprice, .productSpecialPriceSale {
    text-decoration: line-through;
}

#back-to-top {
    position: fixed;
    bottom: 5rem;
    right: 1rem;
    z-index: 1;
    text-align: center;
    cursor: pointer;
    transition: opacity 0.2s ease-out;
    opacity: 0;
}

#back-to-top.show {
    opacity: 1;
    z-index: 1;
}

/* set height of scrollable area in mobile menu */
div#navbarSupportedContent {
    max-height:90vh;
    overflow-y:auto;
}

.zca-banner {
    text-align: center;
}

.ot-title {
    text-align: right;
}
.ot-text,
.totalCell {
    text-align: right;
}

.centeredContent {
    text-align: center;
    padding: 1rem;
}

table.tabTable td {
    padding: 0.5rem;
}
#indexProductList-cat-wrap {
    margin-bottom: 1rem;
}
#productsListing-bottomRow {
    margin-top: 1rem;
}

.sideBoxContent select {
    margin-bottom: 1rem;
}

#navCatTabs a {
    border: none;
    border-bottom: 2px solid transparent;
    transition: all 0.2s ease;
}

#navCatTabs a:hover {
    border-bottom: 2px solid #007faf;
}/*
#navCatTabs a,
#navCatTabs a:hover {
    border: none;/*0.125rem solid #007faf;
	border-bottom: 2px solid transparent;
    transition: all 0.2s ease;
}*/

#navCatTabs li a {
    border-bottom: 2px solid transparent;
    transition: all 0.2s ease;
}

/*#navCatTabs li a:hover {
    border-bottom: 2px solid #007faf; 
    color: #007faf;
}*/

/* These CSS media queries control how many columns of cards display on the login, checkout_shipping, checkout_payment & checkout_confirmation pages */
/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) { 
.card-columns {
  -webkit-column-count: 1;
  -moz-column-count: 1;
  column-count: 1;
}
}

@media only screen and (max-width: 768px) and (orientation: portrait) {
    .phone2 {
        display: block;
        text-align: center;
        font-size: 2em;
        margin-top: 5px;
    }
	#logoWrapper {text-align:center;}
	#taglineWrapper {margin-top:10px;}
}


/*  Medium devices (tablets, 768px and up) */
@media (min-width: 768px) {
.card-columns {
  -webkit-column-count: 1;
  -moz-column-count: 1;
  column-count: 1;
}
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) {
.card-columns {
  -webkit-column-count: 2;
  -moz-column-count: 2;
  column-count: 2;
}
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
.card-columns {
  -webkit-column-count: 2;
  -moz-column-count:2;
  column-count: 2;
}
}

@media only screen and (orientation:portrait) {
/*bof responsive*/
.navbar-nav {background-color:#ffffff;
}
.phone2 {
        font-size: 1.05rem;
        text-align: center;
    }
}