h1, h2, h3, h4, h5 {
	font-family:"fira-sans";
}

h2 {
  	font-size: 34px;
  	color: #000;
  	font-weight: 100;
  	text-transform: uppercase;
  	font-style: italic;
  	letter-spacing:-1px;
  	line-height:.8;
}

a, a:hover {
	color:#F33;
}

.btn-primary {
  background-image: none;
  background-repeat: repeat-x;
  background-color: #F33;
  border:none;
  border-radius:0;
}

.btn-primary:focus, .btn-primary:hover {
  background-color: #B50B0B;
}

.navbar-brand {
	width:204px;
	padding: 6px 24px 6px 10px;
}

.navbar-nav>li>a {
	font-family:"fira-sans", open-sans, sans-serif;
	text-transform:uppercase;
}

.hero-snake-removal {
	background-image: url("_images/hero-arizona-black-rattlesnake.jpg");
	background-size:cover;
	background-position:50%;
}

.hero-prescott-snake-removal {
	background-image: url("_images/hero-porch-diamondback.jpg");
	background-size:cover;
	background-position:50%;
}

.hero-content {
	background: rgba(0, 0, 0, 0.6);
}

.hero-snake-removal-services {
	background-image: url("_images/hero-western-molossus.jpg");
	background-size:cover;
	background-position:50%;
}

.hero-snake-removal-services .hero-content {
	background: rgba(0, 0, 0, 0.4);
}

.jumbotron h1 {
  	font-size: 40px;
  	color: #FFF;
  	font-weight: 100;
  	text-transform: uppercase;
  	font-style: italic;
  	letter-spacing:-1px;
  	line-height:.8;
}

.jumbotron p {
	color:#fff;
	font-size: 16px;
}

.callout {
    padding: 60px 0;
    background-color: #333;
}

.callout ul li {
	list-style:none;
	color:#fff;
	padding:10px 0 0 0;
	font-size:20px;
}

.callout p {
	color:#fff;
}

.callout h2 {
	color:#fff;
}

.top30 { margin-top:30px; }
.top60 { margin-top:60px; }
.bottom30 { margin-bottom:30px; }
.bottom60 { margin-bottom:60px; }

.specieslist {
	border:none;
}

.species {
	padding-bottom: 30px;
}

.species p {
	font-size: 1em;
    color: #999;
    border-left: 1px solid #eee;
    padding-left: 10px;
    font-style: italic;
}

.species img {
	outline: 2px solid #000;
}

/* Extra small devices (phones, less than 768px) */
/* No media query since this is the default in Bootstrap */

/* Small devices (tablets, 768px and up) */
@media (min-width: 768px) { 

	.jumbotron {
	  	padding: 50px 15px 20px;
	}

	.jumbotron h1 {
	  	font-size: 44px;
	}

}

/* Medium devices (desktops, 992px and up) */
@media (min-width: 992px) { 

	.jumbotron h1 {
	  	font-size: 63px;
	}

}

/* Large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 

	.jumbotron h1 {
	  	font-size: 63px;
	}

	.hero {
		min-height:500px;
	}

	.jumbotron .container-fluid {
		width:80%;
	}

	.jumbotron p {
	  font-size: 24px;
	}

}