body { font-family: Arial, Helvetica, sans-serif; font-size: 12pt; color: #000000; background: url("/images/bgs/wood-bg.jpg") repeat-y; background-size: cover; }
h1 { text-align: center; }
h2 { margin-top: 10px; font-size: 20pt; }
h3 { margin: 0px 0px 10px; font-size: 18px; }
h4 { margin: 0px; font-size: 16pt; }
a, a:visited { color: #58c50f; }
  a:hover { color: #4f8f2f; }
b { color: #00594c; }
.error { padding: 6px; background: #ffdedd; border: 2px solid #FF0000; font-weight: bold; }
.alert { padding: 6px; background: #c6ea9e; border: 2px solid #65b706; font-weight: bold; }

.row { margin-right: 0px; margin-left: 0px; }

a.button-link, a.button-link:visited { background-color: rgba(79,143,47,1); padding: 3px 6px; border: 1px solid #00594c; border-radius: 6px; color: white; }
  a.button-link:hover { background-color: #81d349; }

.bg-light { background-color: rgba(255,255,255,0.9)!important; }
.bg-dark-green { background-color: #00594c; }
.bg-light-green { background-color: #81d349; }
.text-dark-green { color: #00594c; }
.text-light-green { color: #81d349; }
.text-red { color: #d82221; }
.border-red { border-color: #d82221; }

.slideshowBlock { max-height: 800px; overflow: hidden; }
.slideshowBlock .carousel { max-height: 800px; }

.maitenance { position: absolute; z-index: 1000; }
  .maitenance-h-top { top: 50%; }

.header-image { max-height: 350px; overflow: hidden; }

.page-title { position: absolute; bottom: 0; left: 10%; width: 470px; text-align: left; background-color: rgba(240, 240, 240, .7); }
  .page-title h1 { padding: 0px 10px; margin: .5rem 0px; text-align: left; }
h1.pageTitle { text-align: left; color: #000000; }

.home-product-title { margin-top: 48px; }
.page-content { min-height: 300px; background-color: #fff; }
.content { padding: 22px; }

.contact-info { float: right; margin-top: 30px; width: 224px; }
label { color: #4F8F2F; font-weight: bold;}

.bella-bttn, a.bella-bttn, a.bella-bttn:visited
{
  background-color: rgba(79,143,47,1); border: 1px solid #4F8F2F; border-radius: 6px; padding: 3px 10px; margin-top: 8px;
  text-decoration: none; text-align: center; font-size: 12pt; color: white;
}
  .bella-bttn:hover, a.bella-bttn:hover, a.bella-bttn:focus { background-color: #81d349; }
  a.bella-bttn:hover, a.bella-bttn:focus { text-decoration: none; }
.back-to-top { position: fixed; top: 50%; right: 20px; display: none; }
  .back-to-top:hover { display: block !important; }

.breadcrumb { padding: 8px 15px 0px; margin: 0px; background: none; border: none; color: #999999; }
  .breadcrumb>.active{  }
	.breadcrumb a, .breadcrumb a:visited { text-decoration: underline; }

.home-image { display: inline-block; }
.home-info { margin: 40px 0px 20px; }
.home-info h2 { margin-bottom: 30px; text-align: center; }

.zero-bg { background: url(/images/bgs/ZeroBGLogo.jpg) top right no-repeat; }
.home-zero { text-align: left; }
.home-greenguard { text-align: right; }

.greenguard-bg { background: url(/images/bgs/GreenGuardBGLogo.jpg) top left no-repeat; background-size: cover; }

.search-block { display: table-cell; vertical-align: bottom; }
  .search-block  input#search-field { margin: 7px 0px 0px 7px; vertical-align: top; width: 192px; border: none; }
.search-field-center { background: url(/images/bgs/SearchBG.png) no-repeat top center; text-align: center; }
.search-field-right { background: url(/images/bgs/SearchBG.png) no-repeat top right; text-align: right; }
.search-bttn
{
  display: inline-block; width: 44px; height: 30px; margin: 5px 0px 0px; background: url(../images/SearchIcon.png) center top no-repeat; color: #FFFFFF; border: none;
}
  .searchBttn:hover {  }

.main-nav-button { width: 100%; text-align: right; }

.navbar { margin-bottom: 0px; }

.bella-main-navbar-bg { background: url(/images/bgs/main-menu-bg.jpg) top left no-repeat; background-size: cover; }
.bella-main-navbar { margin: 0px auto; text-align: center; }
  .bella-main-navbar ul { margin: 0px auto; text-align: center; }
  .bella-main-navbar a, .bella-main-navbar a:hover { margin: 0px 10px; font-size: 18pt; font-weight: bold; color: #000000; background-color: rgba(255,255,255,.4); }
    .bella-main-navbar a:hover { color: #00594c; }
  .bella-main-navbar .navbar-expand-lg .navbar-nav .nav-link a, .bella-main-navbar .navbar-expand-lg .navbar-nav .nav-link a:visited
  {
    padding: 3px 10px;
  }

.navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link
{
  color: rgba(0,0,0,.7);
}
a.nav-link { padding: 4px 0px 4px; }
  .navbar-light .navbar-nav .nav-link:hover { background-color: #EDEDED; color: #4f8f2f; }
.bella-main-navbar ul.dropdown-menu .show
{
  display: block; max-height: 0; overflow: hidden; padding: 0px 0px 0px 16px; margin: 0; border: 0; position: static;
  box-shadow: none; width: 360px; text-align: left; float: none; 
}
  .bella-main-navbar ul.dropdown-menu { text-align: left; } 
  .bella-main-navbar ul.dropdown-menu .show { padding: 0px; max-height: 400px; transition: max-height .6s ease-out; }
  .bella-main-navbar .dropdown-menu li { padding: 4px 0px; }
  .bella-main-navbar ul.dropdown-menu a, .bella-main-navbar ul.dropdown-menu a:visited { margin: 0px 0px; font-size: 12pt; }

.navbar { margin-bottom: 0px; }
.navbar-brand>img { width: 100%; height: auto; }
.bella-logo { margin-bottom: -110px; z-index: 400; width: 440px; border: none; }
.logo-static-top { z-index: 500; }

.navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link, .navbar-light .navbar-nav .nav-link.show, .navbar-light .navbar-nav .show>.nav-link
{
  color: rgba(0,0,0,.7);
}
a.nav-link { padding: 4px 0px 4px; }
  .navbar-light .navbar-nav .nav-link:hover { background-color: #EDEDED; color: #4f8f2f; }
.bella-logo .navbar-collapse .navbar-nav>li .dropdown-menu
{
  display: block; max-height: 0; overflow: hidden; padding: 0px 0px 0px 16px; margin: 0; border: 0; position: static;
  box-shadow: none; width: 100%; float: none; transition: max-height .5s ease-out; text-align: right;
}
.dropdown-menu { padding: 0px 0px 0px 16px; line-height: normal; border: none; }
.bella-logo .navbar .navbar-nav .show .dropdown-menu { max-height: 340px; transition: max-height .6s ease-out; }

.arrow, .arrow-up, .arrow-left
{
  display:inline-block; width:0; height:0; margin-left:2px; vertical-align:middle;
  border-top:4px dashed; border-top:6px solid\9; border-right:6px solid transparent; border-left:6px solid transparent;
}
.arrow-up { border-top: none; border-bottom:4px dashed; border-bottom:6px solid\9; }
.arrow-left { vertical-align: 0px; margin-right: 2px; border-right:4px dashed; border-right:6px solid\9; border-top:6px solid transparent; border-bottom:6px solid transparent; }
.bella-main-navbar button.navbar-toggler[aria-expanded=true] .arrow
{
  -webkit-transform: rotate(180deg); transform: rotate(180deg); transition: transform .2s ease-out; transition: transform .2s ease-out,-webkit-transform .2s ease-out;
}
.bella-main-navbar button.navbar-toggler[aria-expanded=false] .arrow
{
  -webkit-transform: rotate(0deg); transform: rotate(0deg); transition: transform .2s ease-out; transition: transform .2s ease-out,-webkit-transform .2s ease-out;
}
.bella-main-navbar .navbar-collapse .navbar-nav>li>a[aria-expanded=true] .arrow
{
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
  transition: transform .2s ease-out;
  transition: transform .2s ease-out,-webkit-transform .2s ease-out;
}
.bella-main-navbar .navbar-collapse .navbar-nav>li>a[aria-expanded=false] .arrow
{
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  transition: transform .2s ease-out;
  transition: transform .2s ease-out,-webkit-transform .2s ease-out;
}

.dropdown-toggle::after { display:none; }

.large-thumb-link { display: inline-block; margin: 10px 9px 15px; width: 321px; height: 277px; vertical-align: top; }
  a.large-thumb-link:hover { text-decoration: none; box-shadow: 0 6px 11px 0 rgba(0,0,0,0.2), 0 6px 6px 0 rgba(0,0,0,0.19); }
  .large-thumb-link h4 { margin: 15px 0px; padding: 0px 10px; text-align: center; }

.click { position: absolute; bottom: 20px; left: 0px; width: 172px; padding: 2px 0px 2px 0px; color: #EDEDED; background-color: rgb(96,96,96); background-color: rgba(96,96,96,.7) }
.click-detail { padding: 0px 0px 0px 12px; text-align: left; }

.product-image-link { display: block; max-width: 500px; max-height: 500px; }
.product-thumb-link { display: inline-block; width: 160px; padding: 10px 6px; margin: 0px 3px; vertical-align: top; overflow: hidden; }
  a.product-thumb-link:hover { text-decoration: none; box-shadow: 0 6px 11px 0 rgba(0,0,0,0.2), 0 6px 6px 0 rgba(0,0,0,0.19); }
  .product-thumb-link p { margin: 8px 0px; text-align: center; }
.product-thumb-image
{
  margin-bottom: 5px; width: 148px; height: 148px; overflow: hidden; border: 1px solid #ccc;
  border-radius: 10px; -moz broder-radius: 10px; -webkit-border-radius: 10px;
}
  .product-thumb-image img { vertical-align: middle; border-style: none; }

.product-col-1 { }
  .product-col-1 h1.pageTitle { width: 100%; }
.product-col-2 { margin-top: 30px; padding-left: 40px; }

ul.product-details { padding: 0px 0px 0px 15px; list-style: none; }
  ul.product-details li { padding: 15px 0px 0px; }
  ul.product-details li label { width: 80px; }

.product-detail-info { margin: auto; }
  .product-detail-info .btn-link { color: #000000; }
  .product-detail-info .btn-link:hover, .product-detail-info .btn-link:focus { text-decoration: none; }
  .product-detail-info .card-body { padding-bottom: 0; }

.product-sample { width: 166px; }

.product-sheet-info { margin-top: 20px; }
.product-sheet-info label { width: 100%; border-bottom: 1px solid #000000; color: #4f8f2f; font-weight: bold; }
.product-sheet-info::before { margin-left: 15px; }

.product-pdf-link { display: inline-block; margin: 0px 1rem 1rem; }
.product-pdf { display: inline-block; width: 245px; border: 1px solid #000000; }
.product-pdf-text { padding-top: 10px; border-top: 1px solid #000000; font-size: 11pt; }
  .product-pdf-text p { margin-bottom: 10px; }

.product-sample-box { border: 1px solid #000000; }
  .product-sample-box h4 { padding: 10px; background-color: #dfdfdf; border-bottom: 1px solid #000000; }
  .product-sample-box label { width: 100%; padding-top: 10px; font-weight: bold; }
  .product-sample-box input:disabled { border: none; background: none; color: #545454; }
  .product-sample-box .button { background-color: #4f8f2f; color: white; border-color: #4f8f2f; border-radius: 6px; }
    .product-sample-box .button:hover { background-color: #4f8f2f; }

.product-image { overflow: hidden; border: 1px solid #CCCCCC; border-radius: 10px; -moz border-radius: 10px; -webkit-border-radius: 10px; }
  .product-image img { width: 100%; height: 100%; }

form.sample label { width: 108px; }
  form.sample label.short-label { width: 75px; }
  form.sample label.long-label { width: 190px; }

.wallboard-filters { padding: 10px 15px; margin: 0px 0px 10px; border: 1px solid #CCCCCC; background-color: #EAEAEA; }
.filter-col { display: inline-block; margin-right: 20px; }

.wallboard-thumb-link { display: inline-block; width: 87px; padding: 10px 6px; vertical-align: top; overflow: hidden; }
  a.wallboard-thumb-link:hover { text-decoration: none; box-shadow: 0 6px 11px 0 rgba(0,0,0,0.2), 0 6px 6px 0 rgba(0,0,0,0.19); }
  .wallboard-thumb-link p { margin: 8px 0px; text-align: center; }
.wallboard-thumb-image
{
  margin-bottom: 5px; width: 75px; height: 148px; overflow: hidden; border: 1px solid #CCCCCC;
  border-radius: 10px; -moz broder-radius: 10px; -webkit-border-radius: 10px;
}
  .wallboard-thumb-image img { vertical-align: middle; border-style: none; }

.modal-body { background-color: #CCCCCC; }

footer { margin-top: 0px; }
  footer hr { margin-bottom: 0px; }
.copyright { margin-bottom: 8px; text-align: center; }

@media (max-width: 1400px) { .navbar-nav .dropdown-menu { float: left; } .bella-main-navbar a, .bella-main-navbar a:hover { font-size: 14pt; } }
@media (max-width: 1026px ) { .product-col-2 { margin-top: 100px; padding-left: 0px; } }
@media (max-width: 1024px) { .navbar-brand { width: 300px; } .main-nav-button { width: auto; text-align: inherit; } .page-title { width: 570px; } .page-title h1 { font-size: 17pt; } }
@media (max-width: 992px) { .contact-info { float: left; } }
@media (max-width: 991px ) { .bella-main-navbar ul { text-align: left; } .product-col-2 { margin-top: 0px; padding-left: 0px; } .product-thumb-link { width: 155px; } .product-thumb-image { width: 142px; } }
@media (max-width: 767px) { .image-div { display: none; } .home-info { margin: 15px 0px 10px; } .home-zero { text-align: center; } .home-greenguard { text-align: center; } }
@media (max-width: 600px)
{
  .page-title { left: 30px; width: 470px; } .page-title h1 { font-size: 17pt; } .product-image { width: 452px; margin-left: 4px; } .product-thumb { width: 142px; }
  .image-grid { padding-right: 0px; padding-left: 0px; }
}
@media (max-width: 500px) { .product-thumb-link { width: 142px; } .product-thumb-image { width: 130px; } }
@media (max-width: 400px)
{
  .product-col-2 { margin-top: 26px; } .product-image { width: 348px; } .product-pdf-link { margin: 0px 0px 1rem; }
}

@media (min-width: 1400px) { .container { max-width: 1400px; padding-right: 0px; padding-left: 0px; } }
@media (min-width: 1025px) { .navbar-brand { width: 100%; } .page-title { width: 670px; } .page-title h1 { font-size: 20pt; } }
@media (min-width: 992px) { }
@media (min-width: 576px)
{
  .navbar-expand-sm { flex-flow: wrap; width: 300px; } .navbar-expand-sm .navbar-nav { flex-direction: column; } .navbar-expand-sm .navbar-nav .dropdown-menu { text-align: right; position: relative; }
}

#backToTopBttn
{
  display: none; position: fixed; right: 30px; z-index: 99; font-size: 18px; border: none; outline: none; background-color: #65b706;
	color: white; cursor: pointer; padding: 15px; border-radius: 4px;
}


.listingBlock { display: inline-block; padding: 10px 12px 10px 8px; text-align: center; vertical-align: top; overflow: hidden; }
  .listingBlock img { border: 1px solid #484546; width: 175px; }
	.listingBlock:hover { background-color: #999; }
  .listingBlock > a { color: #000; }
	.listingBlock > a:hover, .listingBlock > a:focus { color: #333; text-decoration: none; }
/*	.listingBlock > a:hover img, .listingBlock > a:focus img { border: 1px solid #CCC; } */
.listingBlockTitle { margin-top: 12px; font-size: 16pt; }
.sampleBox { width: 93px; display: inline-block; text-align: center; }
.rackBox { display: inline-block; width: 93px; padding: 10px 5px 10px 7px; vertical-align: top; overflow: hidden; }
	a:hover .rackBox { background-color: #dfdfdf; text-decoration: none; }
.rackImg
{
  margin-bottom: 6px; width: 78px; height: 157px; overflow: hidden; border-top: 1px solid #ccc; border-left: 1px solid #ccc;
	border-radius: 10px 10px 10px 10px;-moz-border-radius: 10px 10px 10px 10px; -webkit-border-radius: 10px 10px 10px 10px; box-shadow: 4px 5px 5px #999999;
}
  .rackImg img { }
.wallboardBox { display: inline-block; width: 77px; padding: 10px 5px 10px 7px; vertical-align: top; overflow: hidden; }
	a:hover .wallboardBox { background-color: #dfdfdf; text-decoration: none; }
.wallboardImg
{
  margin-bottom: 6px; width: 58px; height: 157px; overflow: hidden; border-top: 1px solid #ccc; border-left: 1px solid #ccc;
	border-radius: 10px 10px 10px 10px;-moz-border-radius: 10px 10px 10px 10px; -webkit-border-radius: 10px 10px 10px 10px; box-shadow: 4px 5px 5px #999999;
}
  .wallboardImg img { }
.itemText { margin-top: 8px; font-size: 10pt; }
  .itemText p { margin: 5px 0px; }
.listingBlockImg
{
  width: 175px; height: 157px; overflow: hidden; border-top: 1px solid #000; border-left: 1px solid #000;
	border-radius: 10px 10px 10px 10px;-moz-border-radius: 10px 10px 10px 10px; -webkit-border-radius: 10px 10px 10px 10px; box-shadow: 5px 5px 5px #333;
}
.listingBlockText { width: 175px; margin-top: 6px; }
  .rackImg img { }

.noImage { display: table-cell; text-align: center; vertical-align: middle; }
.imgBorder { border: 1px solid #CCC; border-radius: 10px 10px 10px 10px;-moz-border-radius: 10px 10px 10px 10px;-webkit-border-radius: 10px 10px 10px 10px; box-shadow: 5px 5px 5px #999999; } /* border-top: 1px solid #ccc; border-left: 1px solid #ccc; } */
.defaultImg { width: 400px; height: 400px; overflow: hidden; font-size: 12pt; }

.browseBttn, .sampleBttn, .removeBttn
{
	display: inline-block; height: 34px; margin: 0px 0px 10px 0px; border: 1px solid #CCCCCC; background-color: #4f8f2f; color: #FFFFFF;
	border-radius: 10px 10px 10px 10px;-moz-border-radius: 10px 10px 10px 10px; -webkit-border-radius: 10px 10px 10px 10px; box-shadow: 5px 5px 5px #333;
}
.browseBttn { width: 90px; }
  .browseBttn a, .browseBttn a:visited, .sampleBttn a, .sampleBttn a:visited, .removeBttn a, .removeBttn a:visited
	{ display: block; padding: 7px 0px; color: #FFFFFF; text-decoration: none; text-align: center; }
  .browseBttn:hover, .sampleBttn:hover, .removeBttn:hover { background-color: #81d349; }
.sampleBttn { width: 136px; }
.removeBttn { padding: 0px 8px; }

.form-horizontal .form-group { margin-left: 0px; margin-right: 0px; }

.tagline { padding: 12px 0px; font-size: 16pt; text-align: center; }
  .tagline ul { margin: 0px auto; padding: 0px; text-align: center; }
	.tagline li { display: inline-block; padding: 0px 30px; list-style: none; }
.companyFooter { padding: 12px 0px; font-size: 16pt; }
  .companyFooter ul { margin: 0px auto; padding: 0px; text-align: center; }
	.companyFooter li { display: inline-block; padding: 0px 30px; list-style: none; }

.footerItem { display: inline; margin: 0px 80px; }
.footerItem-xs { display: inline; margin: 0px 0px; }
