@charset "UTF-8";
/* CSS Document */

*,
*::before,
*::after {
    box-sizing: border-box;
}

    html {font-size: 16px;}
	
	header {
		background-image: url("images/chain-background.jpg");
    background-color: rgba(0, 0, 0, 0.9);
    width: 100%;
    box-sizing: border-box;
    height: 102px;
		position: fixed;
		top: 0;
		border-bottom: 1px solid #222;
		z-index: 1000;
	}
	
	header .logo {
    width: 180px;
		margin-left: 20px;
	}
	
	header .logo img {
    width: 100%;
		float: left;
		border: 4px solid #9c2819;
		border-radius: 0 0 10px 10px;
		border-top: none;
	}
	
	header .mega-menu-wrapper {
	display: block;
	margin-left: 200px;
	margin-top: 40px;
	}
	
	header .social {float: right; color: #fff; position: absolute; top: 15px; right: 30px; z-index: 102}
	header .social {font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; font-size: 0.8rem;}
	header .social a {color: #fff; text-decoration: none;}
	header .social a:visited {color: #fff;}
	
	.ag-banner, .ag-banner.topbanner, .ag-banner.pagebanner {
	background-color: black;
	margin-top: 100px;
	padding: 30px 0 0 0;
	text-align: center;
	color: #fff;
	}
	
	.ag-banner.pagebanner {
	background-color: #47320D;
	margin-top: 20px;
	
background: rgb(0,0,0);
background: -moz-linear-gradient(60deg, rgba(0,0,0,1) 0%, rgba(71,50,13,1) 50%, rgba(162,68,47,1) 100%);
background: -webkit-linear-gradient(60deg, rgba(0,0,0,1) 0%, rgba(71,50,13,1) 50%, rgba(162,68,47,1) 100%);
background: linear-gradient(60deg, rgba(0,0,0,1) 0%, rgba(71,50,13,1) 50%, rgba(162,68,47,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#a2442f",GradientType=1);

	}
	
	.ag-banner img.airgun {
	/*margin-top: 30px;
	margin-bottom: 30px;*/
	width: 60%;
	}
	
	.ag-banner img.seperator {
	width:100%;
	margin-bottom: -4px;
	}
	
	.ag-banner.topbanner h1 {font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; font-size: 2.0rem; color: #fff; margin-right: 10px; margin-left: 10px;}
	.ag-banner.topbanner h2 {font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; font-size: 1.75rem; color:#9c2819; margin-right: 10px; margin-left: 10px;}
	.ag-banner.topbanner h3 {font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; font-size: 1.45rem; color:#8D7A1B; margin-right: 10px; margin-left: 10px;}
	
	.ag-banner.pagebanner h2 {font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; font-size: 1.75rem; color: #fff; margin-right: 10px; margin-left: 10px;}
	.ag-banner.pagebanner h3 {font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; font-size: 1.45rem; color:#D1B95E; margin-right: 10px; margin-left: 10px;}
	
	.ag-banner p {font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif"; font-size: 1.3rem; color: #fff; padding-right: 20px; padding-left: 20px; max-width: 940px; text-align: left; margin: 20px auto;}
	
	.ag-banner p.smalltext {font-size: 1.0rem;}
	
	.ag-banner p.smalltext.note {max-width: 600px;}
	
	.ag-banner .downarrow {
	display: block;
  font-size: 1.9rem;
	color: #fff;
	margin-bottom: 30px;
	margin-top: 30px;
	}
	
	.main-content {margin-top: 10px; width: 100%; margin-bottom: 100px;}
	
.hub-pg {
  margin: 0 auto;
	width: 75%;
	max-width: 1200px;
	text-align: center;
	padding-top: 20px;
	margin-bottom: 40px;
}
	
	
.hub-pg .hub-wrap-image {
  width: 19%;
  display: inline-block;
  margin-right: 18px;
	margin-bottom: 18px;
  padding: 0;
  border: 1px solid #000;
  border-radius: 5px;
  overflow: hidden;
  position: relative;
}

.hub-pg a, .hub-pg a:hover, .hub-pg a:visited, .hub-pg a:active {
  text-decoration: none;
}

.hub-pg .hub-wrap-image:hover {
  opacity:0.8;
  cursor: pointer;
}


.hub-pg .hub-wrap-image img {
  width: 100%;
  height: 170px; /* Maintain the height as before */
  object-fit: cover; /* Cover the container without distorting the aspect ratio */
  object-position: center; /* Center the image within the container */
  margin-bottom: -5px; /* Keep your existing adjustment if it's still needed */
}

.hub-pg .hub-wrap-image .hub-title {
  color: #fff;
  font-size: 1.9rem;
  font-weight: 700;
	line-height: 1.9rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center; /* Ensures the text is centered if it wraps onto multiple lines */
  width: 90%; /* Optional: Adjusts the width of the title area to ensure padding inside the box */
  margin: 0;
	filter: drop-shadow(2px 3px 3px #000000);
}

.gen-content {
padding: 20px;
max-width: 1200px;
margin: 0 auto;
margin-top: -20px;
text-align: left;
}

.gen-content p {
font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
font-size: 1.3rem;
color: #222;
}

a.button {
margin: 0 auto;
padding: 5px 10px;
border-radius: 6px;
background: #9c2819;
color: #fff;
}
a.button, a.button:hover, a.button:visited, a.button:active {
text-decoration: none;
}
a.button:hover {background: #fff;
border: 1px solid #9c2819;
color: #9c2819;
}

.saleswrapper {
box-sizing: border-box;
width: 100%;
/*border: 1px solid #cacaca;*/
border-radius: 5px;
padding: 20px;
box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.6);
margin-bottom: 30px;
margin-top: 30px;
}

.saleswrapper .salespic {
width: 100%;
text-align: center;
}

.saleswrapper .salespic img {
width: 70%;
display: inline-block;
max-width: 500px;
}

.saleswrapper .salespic.shorter img {
max-width: 200px;
}

.saleswrapper .salesdescript {
width: 100%;
display: inline-block;
}

.saleswrapper .affiliatenote {
font-size: 1.0rem;
}

.gen-content h2 {font-size: 1.8rem; color: #9c2819;}
.gen-content h3 {font-size: 1.6rem;}
.saleswrapper h3 {font-size: 1.5rem;}
.saleswrapper p {font-size: 1.2rem;}

.ruby-col-3 img {
width: 100px;
}

.gen-content ul li {
margin-bottom: 0.8rem;
}



.ruby-col-6 {
    display: flex;
    flex-direction: column;
    width: 48.5%; /* Slightly reduces the video section width to match the blogs */
}

.ruby-col-1 {
    width: 32px; /* Ensures image alignment stays consistent */
}

.ruby-col-11 {
    width: calc(100% - 32px); /* Balances the text width to remove excess space */
}



ul.footermenu li {
display: inline;
margin-right: 15px !important;
max-width: 50%;
}

.footermenu a, footer a:hover, footer a:visited {
color: #b67d76;
}

.footermenu a:hover {
text-decoration: underline !important;
color: #fff;
}

a.copyright, a.copyright:hover, a.copyright:visited {
margin-top: 10px !important;
display: inline-block;
color: #b67d76;
}

a.home.entypo-home {
float: left;
margin-right: 10px;
}

input#hide-footer:checked ~ #stickit label.show-lb {
    opacity: 0.5;
}






/* Media Queries */

	@media screen and (min-width: 0) and (max-width: 1369px) {
	.hub-pg .hub-wrap-image .hub-title {
  font-size: 1.5rem;
  font-weight: 600;
	line-height: 1.5rem;
	}
	}
	
	@media screen and (min-width: 0) and (max-width: 1024px) {
	.hub-pg .hub-wrap-image .hub-title {
  font-size: 1.4rem;
  font-weight: 500;
	line-height: 1.4rem;
	}
	}
	
	@media screen and (min-width: 0) and (max-width: 850px) {
	header .logo {width: 140px;}
	.ag-banner img.airgun {width: 80%;}
	}
		
	@media screen and (min-width: 0) and (max-width: 767px) {
	header {height:158px;}
  header .logo {margin-top: 45px;}
  header .mega-menu-wrapper {margin-left: 0; margin-top: 0;}
	.ag-banner.topbanner {padding-top: 100px;}
	header .social {}
	.hub-pg .hub-wrap-image {width: 40%;}
	}
	
	@media screen and (min-width: 0) and (max-width: 500px) {
	.hub-pg .hub-wrap-image {width: 100%;}
	.hub-pg .hub-wrap-image .hub-title {font-size: 1.8rem; font-weight: 700; line-height: 1.8rem;}
	}
	
	@media screen and (min-width: 0) and (max-width: 330px) {
	header .social {display: none;}
	
	}