﻿* { outline: none; }
body { background-color: #000; color: #FFF; }

a { color: #FF3000; }
a:hover { color: #CE2900; }

hr { border-color: #333; }

.breadcrumb { padding-left: 0; background-color: transparent;  } /* background-color: #020202; */
.breadcrumb > li + li:before { color: #EEEEEE; content: "\00BB"; }

.header-top { position: relative; text-align: center; padding-top: 15px; padding-bottom: 15px; background: #666 url('/Images/top-bg.png') center top no-repeat; background-size: cover; }
.navbar { margin-bottom: 0; }
        
.navbar-inverse { background-color: #222; }
.mobile-logo { display: none; }
/* .navbar-inverse .navbar-toggle { background-color: rgba(255, 255, 255, .3); border-color: #FFF; } */

@media only screen and (min-width: 768px) {
    .top-logo img { height: 110px; margin-top: 15px; }

    .navbar-inverse { height: 60px; background-color: none; background: url('/Images/nav-bg.png') center center no-repeat; }
    .navbar-collapse { text-align: center; }
    .navbar-collapse > ul.navbar-nav { display: inline-block; float: none; }
    .navbar-nav > li > a { padding-top: 20px; padding-bottom: 18px; font-family: 'Special Elite', cursive; font-size: 16px; color: #FFF; }
    .navbar-inverse .navbar-nav > .active > a { background-color: rgba(0, 0, 0, .25); }
    .navbar-inverse .navbar-nav > .active > a:hover { background-color: rgba(0, 0, 0, .25); }
    .navbar-inverse .navbar-nav > li > a { color: #FFF; }
    .navbar-nav > li { margin-left: 0; margin-right: 0; }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
        color: #fff;
        background-color: rgba(0, 0, 0, .2);
    }

    .navbar-nav > li > .dropdown-menu { background: url('/Images/menu-bg.png') top center no-repeat; width: 100%; }
    .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus { color: #E0E0E0; background-color: rgba(0, 0, 0, .2); }
    .dropdown-menu > li > a { color: #FFF; }
    .dropdown-header { color: #FFFF99; font-size: 16px; }
}

@media only screen and (max-width: 1200px) {
    .navbar-inverse > .container { width: 100%; padding-left: 0; padding-right: 0; }
    .navbar-inverse > .container > .navbar > .navbar-collapse { width: 100%; padding-left: 0; padding-right: 0; }
}

@media only screen and (max-width: 768px) {
    .header-top { display: none; }
    .mobile-logo { display: block; position: absolute; top: 5px; left: 0; }
    .navbar-inverse > .container { padding-left: 15px; padding-right: 15px; }
    .navbar-inverse > .container > .navbar > .navbar-collapse { padding-left: 15px; padding-right: 15px; }
}

@media only screen and (min-width: 1200px) {
    .top-logo img { height: 156px; }
    .navbar-nav > li > a { font-size: 20px; }
    .navbar-nav > li { margin-left: 10px; margin-right: 10px; }
}

.main-content { position: relative; }

h1 { font-family: 'Special Elite', cursive; font-size: 30px; color: #FFF; text-align: center; }

h3 { font-family: 'Special Elite', cursive; font-size: 20px; color: #FFF; }

@media only screen and (max-width: 600px) {
    h1 { font-size: 18px; }
}

.how-ghosty { text-align: center; margin-bottom: 18px; }
.how-ghosty ul { list-style-type: none; margin: 0; padding: 0; width: 100%; }
.how-ghosty ul li { position: relative; margin: 0; margin-top: 10px; padding: 0; display: inline-block; max-width: 200px; }
.how-ghosty ul li a img { width: 100%; max-width: 200px; }
.how-ghosty ul li:nth-child(6n) { margin-right: 0; }

.ghosty-7 ul li { width: 13.1%; margin-right: 1%;  }
.ghosty-7 ul li:nth-child(7n) { margin-right: 0 !important; }

@media only screen and (max-width: 992px) {
    .ghosty-7 ul li { width: 23.5%; margin-right: 1%;  }
    .ghosty-7 ul li:nth-child(7n) { margin-right: 1%; }
    .ghosty-7 ul li:nth-child(4n) { margin-right: 0; }
}

.ghosty-6 ul li { width: 15%; margin-right: 1%;  }
.ghosty-6 ul li:nth-child(6n) { margin-right: 0 !important; }

@media only screen and (max-width: 650px) {
    .ghosty-6 ul { width: 100%; }
    .ghosty-6 ul li { width: 32%; margin-right: 1%; }
    .ghosty-6 ul li:nth-child(3n) { margin-right: 0 !important; }
}

@media only screen and (max-width: 500px) {
    .ghosty-6 ul li { width: 30%; margin-right: 2%; }
}

.ghosty-5 ul li { width: 18.5%; margin-right: 1%;  }
.ghosty-5 ul li:nth-child(5n) { margin-right: 0 !important; }

@media only screen and (max-width: 520px) {
    .ghosty-5 ul li { width: 31.5%; margin-right: 1%;  }
    .ghosty-5 ul li:nth-child(5n) { margin-right: 1% !important; }
    .ghosty-5 ul li:nth-child(3n) { margin-right: 0 !important; }
}

.ghosty-4 ul li { width: 24%; margin-right: 1%;  }
.ghosty-4 ul li:nth-child(4n) { margin-right: 0 !important; }

@media only screen and (max-width: 992px) {
    .ghosty-4 ul li { width: 23.5%; margin-right: 1%;  }
}

@media only screen and (max-width: 520px) {
    .ghosty-4 ul li { width: 23%; margin-right: 1%;  }
}

@media only screen and (max-width: 370px) {
    .ghosty-4 ul li { width: 48%; margin-right: 1%;  }
    .ghosty-4 ul li:nth-child(2n) { margin-right: 0 !important; }
}

.ghosty-3 ul li { width: 32%; margin-right: 1%;  }
.ghosty-3 ul li:nth-child(3n) { margin-right: 0 !important; }

@media only screen and (max-width: 520px) {
    .ghosty-3 ul li { width: 31.5%; margin-right: 1%;  }
}

footer { background-color: #111; }
footer .container { padding-bottom: 20px; }
footer .container .row { position: relative; }
footer .container .row .col-sm-3 { padding-bottom: 50px; }
footer .container .row .col-sm-3 ul { list-style-type: square; margin: 0 0 0 15px; padding: 0; }
footer .container .row .col-sm-6 { padding-top: 15px; }
footer .container .row .col-sm-6 p a img { margin-right: 12px; }
footer div.footer-bottom { background-color: #222; padding: 10px; }
footer div.footer-sales { background-color: #1A1A1A; padding: 10px; text-align: center; }

.foot-social { position: absolute; bottom: 0; left: 12px; }
.foot-social a img { opacity: 0.75; margin-right: 10px; }
.foot-social a:hover img { opacity: 1.0; }

@media only screen and (max-width: 768px) {
    footer .container .row .col-sm-3 { padding-bottom: 0; }
    footer .container .row .col-sm-6 { padding-bottom: 70px; }
}

.map-box { background-color: rgba(255, 255, 255, .9); padding: 7px; border: 1px solid #000; border-radius: 7px; color: #000; font-size: 12px; }
.infobox-close { float: right; font-size: 16px; font-weight: bold; margin-top: -4px; }

.btn-main { 
  color: #FFFFFF; 
  background-color: #6F100B; 
  border-color: #560501; 
} 
 
.btn-main:hover, 
.btn-main:focus, 
.btn-main:active, 
.btn-main.active, 
.open .dropdown-toggle.btn-main { 
  color: #FFFFFF; 
  background-color: #2E0301; 
  border-color: #560501; 
} 
 
.btn-main:active, 
.btn-main.active, 
.open .dropdown-toggle.btn-main { 
  background-image: none; 
} 
 
.btn-main.disabled, 
.btn-main[disabled], 
fieldset[disabled] .btn-main, 
.btn-main.disabled:hover, 
.btn-main[disabled]:hover, 
fieldset[disabled] .btn-main:hover, 
.btn-main.disabled:focus, 
.btn-main[disabled]:focus, 
fieldset[disabled] .btn-main:focus, 
.btn-main.disabled:active, 
.btn-main[disabled]:active, 
fieldset[disabled] .btn-main:active, 
.btn-main.disabled.active, 
.btn-main[disabled].active, 
fieldset[disabled] .btn-main.active { 
  background-color: #6F100B; 
  border-color: #560501; 
} 
 
.btn-main .badge { 
  color: #6F100B; 
  background-color: #FFFFFF; 
}