/*Media Only*/
@media only screen and (max-width: 768px) {
  .gutter {
    grid-gap: 2rem !important;
    gap: 2rem !important;
  }
}
@media (min-width: 768px) {
  .flex_container {
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media (max-width: 1300px) {
  .vertical_align {
    display: inline-block;
  }
}
@media only screen and (max-width: 768px) {
  .pt-sides-6 {
    padding-left: 1em !important;
    padding-right: 1em !important;
  }
}
@media only screen and (max-width: 768px) {
  .pt-sides-7 {
    padding-left: 1em !important;
    padding-right: 1em !important;
  }
}
@media only screen and (max-width: 768px) {
  .pt-sides-8 {
    padding: 0em 1em 0em 1em;
  }
}
@media only screen and (max-width: 768px) {
  .pt-sides-3 {
    padding-left: 1em !important;
    padding-right: 1em !important;
  }
}
@media only screen and (max-width: 768px) {
  .pt-3 {
    padding-top: 2em !important;
  }
}
@media only screen and (max-width: 768px) {
  .pb-3 {
    padding-bottom: 2em !important;
  }
}
@media only screen and (max-width: 768px) {
  .pt-4 {
    padding-top: 2em !important;
  }
}
@media only screen and (max-width: 768px) {
  .pb-4 {
    padding-bottom: 2em !important;
  }
}
@media (max-width: 768px) {
  h2 {
    font-size: 1em !important;
  }
}
@media only screen and (max-width: 768px) {
  .intro h1 {
    font-size: 2.5em;
  }
}
@media only screen and (max-width: 768px) {
  .portfolio_nav ul {
    display: block !important;
    -webkit-box-pack: left !important;
        -ms-flex-pack: left !important;
            justify-content: left !important;
    padding-left: 0;
  }
}
@media only screen and (max-width: 768px) {
  .mission .gutter {
    grid-gap: 1rem !important;
    gap: 1rem !important;
  }
}
@media only screen and (max-width: 768px) {
  .smalls .pb-3 {
    padding-bottom: 1em !important;
  }
}
@media only screen and (max-width: 768px) {
  .draycott .small-text {
    font-size: 0.7em;
  }
}
@media only screen and (max-width: 768px) {
  .custom_bullet li {
    font-size: 0.7em;
  }
}
@media only screen and (max-width: 768px) {
  .draycott h3 {
    font-size: 18px;
  }
}
@media only screen and (max-width: 768px) {
  .draycott .text_box {
    font-size: 1em;
  }
}
@media only screen and (max-width: 768px) {
  .external-links ul li {
    font-size: 1.2em !important;
  }
}
@media only screen and (max-width: 768px) {
  .about .offset-1 {
    margin-left: 0;
  }
}
@media only screen and (max-width: 768px) {
  .contact .offset-2 {
    margin-left: 0;
  }
}
@media (max-width: 768px) {
  .bundle p {
    font-size: 0.8em !important;
  }
  .bundle .bundle_body {
    padding: 3% 0;
  }
  .bundle .mission {
    padding: 3% 0% !important;
  }
  .bundle .logo_stack {
    text-align: center;
  }
  .bundle .logo_stack .img-responsive {
    max-width: 50% !important;
    margin: auto;
  }
  .bundle .logo_concept .pt-sides-6 {
    padding: 0% !important;
  }
  .bundle .color_bars .pt-sides-6 {
    padding: 0% !important;
  }
}
@media (min-width: 1024px) {
  .lg\:pl-32 {
    padding-left: 8rem !important;
  }
}
@media (min-width: 1024px) {
  .lg\:col-span-7 {
    -ms-grid-column-span: 7 !important;
    grid-column: span 7/span 7 !important;
  }
}
@media (min-width: 1024px) {
  .lg\:col-span-6 {
    -ms-grid-column-span: 6 !important;
    grid-column: span 6/span 6 !important;
  }
}
@media (min-width: 1024px) {
  .lg\:col-span-5 {
    -ms-grid-column-span: 5 !important;
    grid-column: span 5/span 5 !important;
  }
}
@media (min-width: 1024px) {
  .lg\:pl-32 {
    padding-left: 8rem !important;
  }
}
@media (min-width: 1024px) {
  .lg\:grid-cols-2 {
    -ms-grid-columns: (minmax(0, 1fr))[2] !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (min-width: 1024px) {
  .lg\:grid-cols-3 {
    -ms-grid-columns: (minmax(0, 1fr))[3] !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (min-width: 768px) {
  .md\:grid-cols-2 {
    -ms-grid-columns: (minmax(0, 2fr))[2] !important;
    grid-template-columns: repeat(2, minmax(0, 2fr)) !important;
  }
}
@media (min-width: 768px) {
  .md\:grid-cols-3 {
    -ms-grid-columns: (minmax(0, 3fr))[3] !important;
    grid-template-columns: repeat(3, minmax(0, 3fr)) !important;
  }
}
@media (max-width: 768px) {
  .sm\:grid-cols-1 {
    -ms-grid-columns: (minmax(0, 2fr))[2] !important;
    grid-template-columns: repeat(2, minmax(0, 2fr)) !important;
  }
}
@media (min-width: 1024px) {
  .lg\:grid-cols-12 {
    -ms-grid-columns: (minmax(0, 1fr))[12] !important;
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
  }
}