/*
 * Globals
 */

@font-face {
  font-family: "Source Sans Pro Black";
  src: url("SourceSansPro-Black.woff") format("woff"),
    url("SourceSansPro-Black.woff2") format("woff2"),
    url("SourceSansPro-Black.otf") format("opentype");
}

@font-face {
  font-family: "Source Sans Pro Regular";
  src: url("SourceSansPro-Regular.woff") format("woff"),
    url("SourceSansPro-Regular.woff2") format("woff2"),
    url("SourceSansPro-Regular.otf") format("opentype");
}

/* 
* Links
*/

a,
a:focus,
a:hover {
  color: #fff;
}

.text-left a {
  color: #038343;
}

/* 
* Custom default button
*/

.btn-secondary,
.btn-secondary:hover,
.btn-secondary:focus {
  color: #333;
  text-shadow: none;
  background-color: #fff;
  border: 0.05rem solid #fff;
}

/*
 * Base structure
 */

html,
body {
  height: 100%;
  background-image: url("/images/Networking.jpg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-color: #000;
}

body {
  display: -ms-flexbox;
  display: flex;
  color: #333;
}

p .btn {
  margin-top: 0.35rem;
}

h1 {
  font-family: "Source Sans Pro Black", sans-serif;
  font-weight: 900;
  text-transform: lowercase;
  font-size: 2.5em;
}

.cover-container {
  max-width: 42em;
}

.lead {
  font-family: "Source Sans Pro Regular", sans-serif !important;
  font-weight: 400;
}

/*
 * Header
 */

.masthead {
  margin-bottom: 2rem;
  margin-top: 1.5rem;
}

.masthead-logo {
  width: 35%;
  height: auto;
  float: left;
  margin-top: -0.5rem;
}

.nav-masthead .nav-link {
  padding: 0.25rem 0;
  font-weight: 700;
  color: #fff;
  background-color: transparent;
  border-bottom: 0.25rem solid transparent;
}

.nav-masthead .nav-link:hover,
.nav-masthead .nav-link:focus {
  border-bottom-color: #fff;
}

.nav-masthead .nav-link + .nav-link {
  margin-left: 1rem;
}

.nav-masthead .active {
  color: #fff;
  border-bottom-color: #fff;
}

@media (min-width: 48em) {
  .masthead-brand {
    float: left;
  }
  .nav-masthead {
    float: right;
  }
}

@media (max-width: 800px) {
  .masthead-logo {
    float: none;
    width: 75%;
  }
  .nav-masthead {
    float: none;
  }
}

@media (max-width: 500px) {
  h1 {
    font-size: 1.5em;
  }
  .lead {
    font-size: 1em;
  }
}

/*
 * Cover
 */

.orange {
  background-color: #f16522;
  margin: 1.5rem;
  /* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: 12px;
  /* Firefox 1-3.6 */
  -moz-border-radius: 12px;
  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
  border-radius: 12px;
}

.white-bg {
  background-color: #fff;
  margin: 0 0 1.5rem 0;
  padding: 1.5rem 0 1.5rem 0;
  /* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: 0 0 12px 12px;
  /* Firefox 1-3.6 */
  -moz-border-radius: 0 0 12px 12px;
  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
  border-radius: 0 0 12px 12px;
  box-shadow: 0 0 5rem rgba(0, 0, 0, 0.5);
}

.cover-image {
  background-color: #fff;
  /* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: 12px 12px 0 0;
  /* Firefox 1-3.6 */
  -moz-border-radius: 12px 12px 0 0;
  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
  border-radius: 12px 12px 0 0;
}

.roundbox {
  margin: 1.5rem;
  /* Safari 3-4, iOS 1-3.2, Android 1.6- */
  -webkit-border-radius: 12px;
  /* Firefox 1-3.6 */
  -moz-border-radius: 12px;
  /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
  border-radius: 12px;
}

.column-pad {
  margin: 0 1rem 0 1rem;
}

.cover {
  padding: 1rem 1.5rem;
}

.cover .btn-md {
  padding: 0.75rem 1.25rem;
  font-family: "Source Sans Pro Black", sans-serif;
}

/*
 * Footer
 */

.mastfoot {
  color: #fff;
}

/*
 * Dynamic Button Coloring
 */

.service-buttons a:nth-child(5n - 4) {
  background-color: #f9a51a;
  border: 4px solid #f9a51a;
}

.service-buttons a:nth-child(5n - 4):hover,
.service-buttons a:nth-child(5n - 4):focus {
  border: 4px solid #f9a51a;
}

.service-buttons a:nth-child(5n - 3) {
  background-color: #0cbab4;
  border: 4px solid #0cbab4;
}

.service-buttons a:nth-child(5n - 3):hover,
.service-buttons a:nth-child(5n - 3):focus {
  border: 4px solid #0cbab4;
}

.service-buttons a:nth-child(5n - 2) {
  background-color: #f3d925;
  border: 4px solid #f3d925;
}

.service-buttons a:nth-child(5n - 2):hover,
.service-buttons a:nth-child(5n - 2):focus {
  border: 4px solid #f3d925;
}

.service-buttons a:nth-child(5n - 1) {
  background-color: #f16522;
  border: 4px solid #f16522;
}

.service-buttons a:nth-child(5n - 1):hover,
.service-buttons a:nth-child(5n - 1):focus {
  border: 4px solid #f16522;
}

.service-buttons a:nth-child(5n - 5) {
  background-color: #76bc21;
  border: 4px solid #76bc21;
}

.service-buttons a:nth-child(5n - 5):hover,
.service-buttons a:nth-child(5n - 5):focus {
  border: 4px solid #76bc21;
}

.service-buttons a:hover,
.service-buttons a:focus {
  background-color: #ffffff;
  color: #222222;
}

.service-buttons a {
  color: #222222;
}

/*
 * Buttons
 */

.btn {
  border-radius: 40px;
  width: 175px;
}

.btn-orange {
  background-color: #f9a51a !important;
  color: #222222 !important;
  border: 4px solid #f9a51a !important;
}

.btn-orange:hover,
.btn-orange:focus {
  background-color: #ffffff !important;
  color: #222222 !important;
  border: 4px solid #f9a51a !important;
}

.btn-teal {
  background-color: #0cbab4 !important;
  color: #222222 !important;
  border: 4px solid #0cbab4 !important;
}

.btn-teal:hover,
.btn-teal:focus {
  background-color: #ffffff !important;
  color: #222222 !important;
  border: 4px solid #0cbab4 !important;
}

.btn-salmon {
  background-color: #f16522 !important;
  color: #222222 !important;
  border: 4px solid #f16522 !important;
}

.btn-salmon:hover,
.btn-salmon:focus {
  background-color: #ffffff !important;
  color: #222222 !important;
  border: 4px solid #f16522 !important;
}

.btn-yellow {
  background-color: #f3d925 !important;
  color: #222222 !important;
  border: 4px solid #f3d925 !important;
}

.btn-yellow:hover,
.btn-yellow:focus {
  background-color: #ffffff !important;
  color: #222222 !important;
  border: 4px solid #f3d925 !important;
}

.btn-green {
  background-color: #76bc21 !important;
  color: #222222 !important;
  border: 4px solid #76bc21 !important;
}

.btn-green:hover,
.btn-green:focus {
  background-color: #ffffff !important;
  color: #222222 !important;
  border: 4px solid #76bc21 !important;
}

.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
}

@media (min-width: 768px) {
  .bd-placeholder-img-lg {
    font-size: 3.5rem;
  }
}

/*
 * Contact Info 
 */

.contact p {
  color: #ffffff;
  filter: drop-shadow(0 0 0.75rem #000000);
}
.contact {
  margin-bottom: 2rem;
}

/*
 * Social Media
 */

.facebook {
  background-image: url("facebook.svg");
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
}
.instagram {
  background-image: url("instagram.svg");
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
}
.youtube {
  background-image: url("youtube.svg");
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
}
.twitter {
  background-image: url("twitter.svg");
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
}
.social {
  list-style: none;
  padding-left: 0;
}

.social li {
  display: inline;
  padding: 0.25rem;
}

.social li a {
  padding: 1.5rem;
  width: 0;
  height: 0;
  margin: 0.25rem;
}