﻿body {
    padding-top: 90px;
}
        
.navbar
{
    max-height: 50px;
}
.navbar-nav-color 
{
    background-color: #333333;
    border-color: #080808;
}
.search-icon
{
    color: #000000;
}
.search-icon:hover, .search-icon:active
{
    color: #CC0000;
}    
.list-group-item
{
    padding: 10px 5px;
    border-color: #999999;
}
.list-group-item > a
{
    color: #003366;
}
.list-group-item.union-type, .list-group-item.product-view {
    font-weight: bold;
    color: #003366;
    background-color: #E2E2E2;
}
/*  Override Bootstrap Tooltip styles   */
/*
.red-tooltip + .tooltip > .tooltip-inner {background-color: #f00;}
.red-tooltip + .tooltip > .tooltip-arrow { border-bottom-color:#f00; }
*/
.tooltip.top .tooltip-arrow
{
    bottom: 0;
    left: 50%;
    margin-left: -5px;
    border-top-color: #CC0000;
    border-width: 5px 5px 0;
}

.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-left-color: #CC0000;
  border-width: 5px 0 5px 5px;
}

.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-right-color: #000000;
  border-width: 5px 5px 5px 0;
}

.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-bottom-color: #CC0000;
  border-width: 0 5px 5px;
}
.tooltip-inner
{
    color: #FFFFFF;
    background: #CC0000;
    border: 1px solid #CC0000;
}  

.hand
{
    cursor: pointer;
    cursor: hand;
} 

ul.subcategories > li
{
    border-width: 1px;
    background-color: #E8EFEF;
    border-color: #808080;
}
ul.subcategories > li:hover
{
    background-color: #D6E2E2;
}
ul.subcategories > li:hover > ul.subcategories > li
{
    border-color: #333333;
}
ul.subcategories > li:hover > ul.subcategories > li:hover,
ul.subcategories > li:hover > ul.subcategories > li:active
{
    background-color: #B9CECE;
}  
.active-category 
{
    background-color: #B9B9B9 !important;
}
/* Badges */
.badge-danger {
    background-color: #d43f3a;
}

.badge-warning {
    background-color: #d58512;
}

.badge-success {
    background-color: #398439;
}

.badge-info {
    background-color: #269abc;
}

.badge-inverse {
    background-color: #333333;
}
.badge-round {
    position: absolute;
    border-radius: 50%;
    background: yellow;
    height:2rem;
    width:2rem;
    top:1.5rem;
    right:1.5rem;
    text-align: center;
    line-height: 2rem;;
    font-size: 1rem;
    font-weight:900;
    color: darkred;
    border:1px solid black;
}
label.footer-message
{
    color: #FF0000;
}

div.product-detail-header
{
    color: #FFFFFF;
    background-color: #3D5B72;
}
div.materials-list-header
{
    color: #FFFFFF;
    background-color: #005B00;
}
span.inline
{
    display: inline-block;
    position: relative;
}
span.inline > i
{
    width: 35px;
}
span.inline-text
{
    top: -5px;
    position: relative;
    left: 12px;
}
i.fa-check-square-o
{
    color: #006600;
}
.modal-sm
{
    width:400px;
}
hr.narrow
{
    margin: 5px;
}
#thumbwrap, div.imagewrap {
	position:relative;
	/*  margin:75px auto;
	width:252px; height:252px; */
}
.thumb img { 
	border:1px solid #000;
	margin:3px;
	float:left;
}
.thumb span { 
	position:absolute;
	visibility:hidden;
}
.thumb:hover, .thumb:hover span { 
	visibility:visible;
	top:45px; left: -24px; 
	z-index:1;
}


.thumb-cart img { 
	border:1px solid #000;
	margin:3px;
	float:left;
}
.thumb-cart span { 
	position:absolute;
	visibility:hidden;
}
.thumb-cart:hover, .thumb-cart:hover span { 
	visibility:visible;
	top:35px; right:-110px; 
	z-index:1;
}
@media screen and (min-width: 320px) {
    .thumb-cart:hover, .thumb-cart:hover span {
        max-width: 300px;
    }
}

@media screen and (min-width: 375px) {
    .thumb-cart:hover, .thumb-cart:hover span {
        max-width: 350px;
    }
}

#LocalContactWrapper 
{
    position:relative;
}
.dtl-local div 
{
 	position:absolute;
	visibility:hidden;  
}
.dtl-local:hover, div.contact-wrapper div 
{
    	visibility:visible;
	top:0; left:150px; 
	z-index:1;
}
.nav > li > a.show-titles,
.nav > li > a.show-details
{
    padding-bottom: 10px;
    padding-top: 10px;
}
.text-navy
{
    color: #003080;
}
.text-red
{
    color: #C10000;
}
@media screen and (max-width: 400px) {
    a.navbar-brand > img {
        max-width: 200px;
    }
}
