#main.row, #main .row {
  padding-left: 0px;
  padding-right: 0px;
  margin-bottom: 0px; }

.homepage>.home-slot-wrapper, .homepage>.row {
    margin-top: 0px;
    margin-bottom: 0px;
}

#main {
  margin-bottom: 0px;
}

/* hero */

#hero {
 color: white;
 margin-left: auto;
 margin-right:auto;
 position:relative;
 background-size:cover;
}

#hero .overlay {
  padding: 25% 10%;
}

#hero h1 {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-size: 50px;
  font-style: normal;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
  color: white;
  margin-bottom: 2%;
}

#hero h2, #hero h2 span, #hero h2 a {
  /* display: block; */
  font-family: Arial;
  font-weight: bold;
  font-size: 14px;
  text-align: center;
  text-transform: uppercase;
  color: white;
  margin: 4% 0;
  line-height: 1.25em;
}

#hero h2:first-child {
  margin-bottom: 0%;
}

#hero h2 a {
  text-decoration: underline;
}

#hero h2 a:hover {
  text-decoration: none;
}

span.promo-code {
  color: #dd0000!important;
}

#hero img {
  display: block;
  width: 70vw;
  margin: auto;
}

#hero button {
 display: block;
 margin: 4% auto;
}

@media only screen and (min-width: 768px){
  #hero {
    height: 65vh;
    min-height: 358px;
  }
  #hero.full-height {
    min-height: 600px;
    height: calc(100vh - 97px);
  }
  #hero .overlay {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    padding: 0px;
  }
  #hero.full-height .overlay {
    top: 45%;
    transform: translateY(-45%);
  }
  #hero h1 {
    font-size: 86px;
  }
  #hero h2, #hero h2 span, #hero h2 a {
    margin: 2% 0 3%;
  }
  #hero button {
    margin: 1% auto;
  }
  #hero img {
    width: 30vw;
  }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: landscape) {
  #hero.full-height {
    height: 672px; } }
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (orientation: portrait) {
  #hero.full-height {
    height: 928px; } }

@media only screen and (min-width: 1440px){
  #hero h1 {
    font-size: 6vw;
  }
  #hero h2, #hero h2 span, #hero h2 a {
    font-size: 1vw;
    margin: 2% 0;
  }
  #hero .button-red-large {
    font-size: 0.9vw;
    padding: 0.75vw 1.25vw;
  }
}

#scrollArrow {
  position: absolute;
  bottom: 0;
  margin-bottom: 1%;
  left: 50%;
  transform: translateX(-50%); }

#scrollArrow img {
  width: 10%;
}

.modal.ui-dialog p {
  padding-bottom:20px;
}
.modal span.ui-dialog-title {
  border-bottom:none;
}

/* category overview */

#category-overview {
  margin: 15% 0;
}

#category-overview h1 {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-size: 35px;
  font-style: normal;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase;
  margin: 0px 0px 0.2em;
  padding-left: 5%;
  padding-right: 5%;
}

#category-overview h2 {
  display: block;
  font-family: Arial;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  text-transform: uppercase;
  margin: 5% 0px;
  padding-left: 5%;
  padding-right: 5%;
}

#category-overview p {
  font-family: Arial;
  font-size: 15px;
  text-align: center;
  font-weight: normal;
  margin: 0px 0px 5%;
  padding-left: 5%;
  padding-right: 5%;
}

#category-overview p a {
  font-family: Arial;
  font-size: 15px;
  font-weight: normal;
  color: #045A7E;
}

#category-overview p a:hover {
  color: #034662;
}

#category-overview button {
  display: block;
  margin: auto;
}

@media only screen and (min-width: 768px){
  #category-overview {
    margin: 6% 0 4%;
  }
  #category-overview h1 {
    font-size: 40px;
    padding: 0px;
  }
  #category-overview h2 {
    padding: 0px;
    margin: 2% 0px;
  }
  #category-overview p {
    padding: 0px;
    margin: 0px 0px 2%;
  }
}

@media only screen and (min-width: 1440px){
  #category-overview h1 {
    font-size: 2.8vw;
  }
  #category-overview h2 {
    font-size: 1.05vw;
  }
  #category-overview p, #category-overview p a {
    font-size: 1.05vw;
  }
  #category-overview .button-red-large {
    font-size: 0.9vw;
    padding: 0.75vw 1.25vw;
  }
}

/* bestsellers */

#bestsellers {
  margin-bottom: 4%;
}

div.column-2 a {
  display: block;
  text-align: center;
}

#bestsellers img.second {
  display:none;
}

#bestsellers .column-2:hover img.first {
  display:none;
}

#bestsellers .column-2:hover img.second {
  display:inline-block;
}

#bestsellers h3 {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-weight: 700;
  font-size: 30px;
  text-transform: uppercase;
  margin: 0% 0 3%;
}

#bestsellers p {
  font-family: Arial, sans-serif;
  font-weight: bold;
  font-size: 14px;
  text-transform: uppercase;
  line-height: initial;
  margin: 0.8em 0px 0.4em;
}

#bestsellers p.price {
  color:#999;
}

#bestsellers .column-2:hover p {
  color:#999;
}

@media only screen and (max-width: 767px){
  #bestsellers {
    margin-bottom: 15%;
  }
  #bestsellers h3 {
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
    margin: 0 0;
  }
}

@media screen and (min-width: 768px) {
  #bestsellers .column-2 {
    width: 17.75%;
  }
}

@media only screen and (min-width: 1440px){
  #bestsellers h3 {
    font-size: 2.1vw;
  }
  #bestsellers p {
    font-size: 1vw;
  }
}

/* profession */

#profession .row {
  padding: 2%;
}

#profession div.column-4 {
  text-align: center;
}

#profession div.column-4 a {
  display: block;
  text-align: center;
}

#profession .overlay {
  width: 90%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

#profession h1 {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-style: normal;
  font-weight: 700;
  font-size: 22px;
  text-transform: uppercase;
  color: white;
  margin: 0em 0px 0.4em;
  text-align: center;
  padding-left: 4%;
  padding-right: 4%;
}

#profession p, #profession p span {
  font-family: Arial;
  font-size: 15px;
  font-weight: normal;
  color: white;
}

#profession img {
  /* margin-bottom: 5%; */
  width: 100%;
  -webkit-filter: none;
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
 }

@media only screen and (max-width: 767px){
  #profession {
    display: none;
  }
  /* #profession .row {
    padding: 3% 3% 0;
  }
  #profession div.column-4 {
    width: 100%;
    position: relative;
    margin-bottom: 3%;
  }
  #profession h1 {
    font-size: 25px;
    padding-left: 5%;
    padding-right: 5%;
  } */
}

@media only screen and (min-width: 1000px){
  #profession .column-4:hover img, #profession .column-4:focus img {
    -webkit-filter: brightness(80%);
    -moz-filter: brightness(80%);
    -ms-filter: brightness(80%);
    -o-filter: brightness(80%);
    filter: brightness(80%);
  }
  #profession p.cta span{
    color: rgba(255,255,255,0);
  }
  #profession .column-4:hover p.cta span{
    color: rgba(255,255,255,1);
  }
}

@media only screen and (min-width: 1440px){
  #profession h1 {
    font-size: 2vw;
  }
  #profession p, #profession p span{
    font-size: 1.1vw;
  }
}

/* featured */

#featured .row {
  background-color: #111;
}

#featured div.column-4 a {
  display: block;
  text-align: center;
  margin-bottom: 5%;
}

#featured h3 {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  color: #fff;
}

#featured .title {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-weight: 700;
  font-style: normal;
  text-transform: uppercase;
  color: #fff;
}

#featured p, #featured p span {
  font-family: Arial;
  font-size: 14px;
  font-weight: normal;
  color: #fff;
}

#featured p {
  padding: 1% 3% 0%;
}

#featured p.cta {
  font-size: 14px;
}

/* #featured .shop {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-weight: 700;
  font-size: 15px;
  font-style: italic;
  color: grey;
  text-transform: uppercase;
} */

#featured img {
  width: 100%;
  margin-bottom: 5%;
  -webkit-filter: none;
  -moz-filter: none;
  -ms-filter: none;
  -o-filter: none;
  filter: none;
 }

@media only screen and (max-width: 767px){
  #featured {
    margin: 0 0 15%;
  }
  #featured div.column-4 {
    width: 100%;
    margin-top: 0;
  }
  #featured h3 {
    padding-left: 5%;
    padding-right: 5%;
    margin: 8% 0;
  }
}

@media only screen and (min-width: 768px){
  #featured div.column-4 {
    margin-left:0px;
    width: 33.33%;
  }
  #featured h3 {
    font-size: 30px;
    margin: 3% 0;
  }
  #featured .title {
    font-size: 21px;
  }
}

@media only screen and (min-width: 1000px){
  #featured .column-4:hover img, #featured .column-4:focus img {
    -webkit-filter: brightness(120%);
    -moz-filter: brightness(120%);
    -ms-filter: brightness(120%);
    -o-filter: brightness(120%);
    filter: brightness(120%);
  }
  #featured p.cta span{
    color: rgba(255,255,255,0);
  }
  #featured .column-4:hover p.cta span{
    color: rgba(255,255,255,1);
  }
}

@media only screen and (min-width: 1440px){
  #featured h3 {
    font-size: 2.1vw;
  }
  #featured .title {
    font-size: 1.45vw;
  }
  #featured p, #featured p span{
    font-size: 1.05vw;
  }

  #featured p.cta{
    font-size: 0.95vw;
  }
  /* #featured .shop {
    font-size: 1.1vw;
  } */
}

/* holster finder slideshow */

#holster-finder {
  position: relative;
  margin: 0;
  text-align: center;
}

#slideshow img {
  width: 100%;
  display:block;
  color: transparent;
  opacity: 0;
  z-index: 0;
   -webkit-backface-visibility: hidden;
  -webkit-animation: imageAnimation 32s linear infinite 0s;
  -moz-animation: imageAnimation 32s linear infinite 0s;
  -o-animation: imageAnimation 32s linear infinite 0s;
  -ms-animation: imageAnimation 32s linear infinite 0s;
  animation: imageAnimation 32s linear infinite 0s;
}
#slideshow img:nth-child(1) span {
  background-image: url(home-page/holster-finder/hf-1.jpg?$staticlink$)
  position: relative;
}
#slideshow img:nth-child(2) {
  position: absolute;
  top: 0px;
  left: 0px;
  -webkit-animation-delay: 8s;
  -moz-animation-delay: 8s;
  -o-animation-delay: 8s;
  -ms-animation-delay: 8s;
  animation-delay: 8s;
}
#slideshow img:nth-child(3) {
  position: absolute;
  top: 0px;
  left: 0px;
  -webkit-animation-delay: 16s;
  -moz-animation-delay: 16s;
  -o-animation-delay: 16s;
  -ms-animation-delay: 16s;
  animation-delay: 16s;
}
#slideshow img:nth-child(4) {
  position: absolute;
  top: 0px;
  left: 0px;
  -webkit-animation-delay: 24s;
  -moz-animation-delay: 24s;
  -o-animation-delay: 24s;
  -ms-animation-delay: 24s;
  animation-delay: 24s;
}

/* Animation for the slideshow images */
@-webkit-keyframes imageAnimation {
  0% { opacity: 0;
  -webkit-animation-timing-function: ease-in; }
  5% { opacity: 1;
       -webkit-animation-timing-function: ease-out; }
  25% { opacity: 1 }
  30% { opacity: 0 }
  100% { opacity: 0 }
}
@-moz-keyframes imageAnimation {
  0% { opacity: 0;
  -moz-animation-timing-function: ease-in; }
  5% { opacity: 1;
       -moz-animation-timing-function: ease-out; }
  25% { opacity: 1 }
  30% { opacity: 0 }
  100% { opacity: 0 }
}
@-o-keyframes imageAnimation {
  0% { opacity: 0;
  -o-animation-timing-function: ease-in; }
  5% { opacity: 1;
       -o-animation-timing-function: ease-out; }
  25% { opacity: 1 }
  30% { opacity: 0 }
  100% { opacity: 0 }
}
@-ms-keyframes imageAnimation {
  0% { opacity: 0;
  -ms-animation-timing-function: ease-in; }
  5% { opacity: 1;
       -ms-animation-timing-function: ease-out; }
  25% { opacity: 1 }
  30% { opacity: 0 }
  100% { opacity: 0 }
}
@keyframes imageAnimation {
  0% { opacity: 0;
  -ms-animation-timing-function: ease-in; }
  5% { opacity: 1;
       -ms-animation-timing-function: ease-out; }
  25% { opacity: 1 }
  30% { opacity: 0 }
  100% { opacity: 0 }
}

/* Show at least something when animations not supported */
.no-cssanimations #slideshow img span{
  opacity: 1;
}
#holster-finder .overlay {
  position: absolute;
  width: 55%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
#holster-finder h1 {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  color: white;
  font-weight: 700;
  font-size: 40px;
  text-transform: uppercase;
  margin: 0px 0px 0.4em;
  text-align: center;
}

#holster-finder h2 {
  display: block;
  font-family: Arial;
  font-size: 14px;
  font-weight: bold;
  text-transform: uppercase;
  margin: 0px 0px 2%;
  color: white;
  text-align: center;
}

#holster-finder p, #holster-finder a {
  font-family: Arial;
  font-size: 15px;
  color: white;
  font-weight: normal;
  text-align: center;
  margin: 2% 0;
}

#holster-finder button{
  min-width: 200px;
  width: 15%;
  background-color: initial;
  border: 1px solid #ffffff!important;
  padding: 0.5% 1.5% 0.75%;
  margin: 0.15%;
  outline: 0;
  transition: color 0.1s cubic-bezier(0.16, 0.08, 0.355, 1), background 0.1s cubic-bezier(0.16, 0.08, 0.355, 1), border-color 0.1s cubic-bezier(0.16, 0.08, 0.355, 1);
}

#holster-finder button span{
  font-family: arial;
  color: white;
  font-size: 12px;
  text-transform: uppercase;
  font-weight: bold;
  outline: 0;
}

#holster-finder button:hover {
  background-color: rgba(0, 0, 0, 0.5);
  border-color: transparent!important;
}

#holster-finder p a {
  color: white;
}

#holster-finder p a:hover {
  color: #d1d1d1;
}

#firearms {
  margin-top: 5%;
}

#firearms img {
  width: 45%;
  display: block;
  position:relative;
  margin: auto;
  bottom: 0;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -ms-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;;
}

#holster-finder p.gun-type {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-weight: 700;
  font-size: 18px;
  text-transform: uppercase;
  padding-top: 0px;
}

@media only screen and (min-width: 1000px) {
  #firearms .column-4:hover img {
    bottom: 1vw!important; }
}

@media only screen and (min-width: 1440px){
  #holster-finder h1 {
    font-size: 2.8vw;
  }
  #holster-finder h2 {
    font-size: 1.05vw;
  }
  #holster-finder p, #holster-finder a, #holster-finder button {
    font-size: 1vw;
  }
  #holster-finder button span {
    font-size: 0.8vw;
  }
  #holster-finder .gun-type {
    font-size: 1.25vw!important;
  }
}

#holster-finder div.column-4.first {
  margin-left:0px;
}

@media only screen and (max-width: 767px){
  #holster-finder {
    /* background-image: url(home-page/holster-finder/hf-4.jpg?$staticlink$);
    background-size: cover;
    background-position: center right; */
    background-color: black;
  }
  #holster-finder .overlay {
    position: initial;
    top: initial;
    left: initial;
    transform: initial;
    width: 90%;
    padding: 20% 5%;
  }
  #slideshow img {
    display: none;
  }
  #holster-finder h1 {
    font-size: 30px;
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
  }
  #holster-finder h2 {
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
    padding-bottom: 5%;
  }
  #holster-finder button {
    display: block;
    padding: 10px 20px;
    margin: 5px auto;
  }
  #holster-finder p {
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 5%;
  }
  #firearms img {
    margin-top: 40px;
  }
}

/* categories */

#categories {
  margin-bottom: 5%;
}

div.column-2 {
  display: block;
  text-align: center;
}

div.column-2.prefix-1 {
  margin-left:0px;
}

#categories h3 {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-weight: 700;
  font-size: 30px;
  text-transform: uppercase;
  margin: 5% 0 3%;
}

#categories .shop {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-weight: 700;
  font-size: 18px;
  color: grey;
  text-transform: uppercase;
  margin: 0px 0px 0.4em;
}

#categories .category {
  font-family: 'acumin-pro-condensed', Arial, sans-serif;
  font-weight: 700;
  font-style: italic;
  font-size: 18px;
  text-transform: uppercase;
  margin: 0px 0px 0.4em;
}


#categories p a {
  font-family: Arial;
  font-size: 15px;
  font-weight: normal;
  color: #045A7E;
}

#categories p a:hover {
  color: #034662;
}

#categories img {
  -webkit-transform: none;
  -moz-transform: none;
  -ms-transform: none;
  -o-transform: none;
  transform: none;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}

@media only screen and (max-width: 767px){
  #categories {
    margin-bottom: 15%;
  }
  #categories h3 {
    text-align: center;
    padding-left: 5%;
    padding-right: 5%;
    margin: 0 0;
  }
}

@media only screen and (min-width: 1000px){
  #categories .column-2 a:hover img, #categories .column-2 a:focus img {
    -webkit-transform: scale(1.06, 1.06);
    -moz-transform: scale(1.06, 1.06);
    -ms-transform: scale(1.06, 1.06);
    -o-transform: scale(1.06, 1.06);
    transform: scale(1.06, 1.06);
  }
}

@media only screen and (min-width: 1440px){
  #categories h3 {
    font-size: 2.1vw;
  }
  #categories .shop, #categories .category {
    font-size: 1.25vw;
  }
}
