/* IMPORT THE FRAMEWORK */
/* /////////////// VARIABLES /////////////// */
/* COLOUR PALETTE */
/* PRIMARY NAV */
/* LINKS */
/* /////////////// MIXIN FUNCTIONS /////////////// */
/*  LINEAR GRADIENTS  */
/*  BREAKPOINTS  */
/*  VISUAL STYLES  */
/*  LAYOUT FRAMEWORK  */
.left-content, .sidebar, header, .header-contact, .main-content li, .pagination {
  position: relative; }

.logo, .primary-nav, .menu-burger, .main-content li::before {
  position: absolute; }

.button {
  display: inline-block;
  zoom: 1; }

.read-more, .primary-nav span, .header-contact .header-phone, .secondary-nav a, .main-content li::before {
  display: block; }

.breadcrumbs p {
  box-sizing: border-box; }

.header-contact .header-phone {
  text-align: right; }

.button, body, .primary-nav, .menu-burger {
  text-align: center; }

/*  COLUMN FRAMEWORK  */
section:before, .pagination:before, .footer-wrapper:before, section:after, .pagination:after, .footer-wrapper:after {
  content: "";
  display: table; }
section:after, .pagination:after, .footer-wrapper:after {
  clear: both; }

/* LOOP TO CREATE A CLASS FOR EACH COLUMN WIDTH */
.sw, header, .primary-nav span, .main-content, .breadcrumbs, footer {
  width: 1200px;
  margin: 0 auto;
  text-align: left; }
  @media screen and (max-width: 1199px) {
    .sw, header, .primary-nav span, .main-content, .breadcrumbs, footer {
      width: 95%;
      padding-left: 2.5%;
      padding-right: 2.5%; } }

/* --------------------------------- */
/* /////// SITE SPECIFIC STYLES //// */
/* --------------------------------- */
.button, .main-content h1, .main-content h2, .primary-nav {
  text-transform: uppercase; }

/* BUTTON */
.button {
  padding: 0.8em 1.5em;
  background-color: #0080c6;
  font-size: 1em;
  color: #FFF;
  cursor: pointer; }
  .button:hover {
    background-color: #2ad9ff; }
  .button:active {
    background-color: #007690; }

/* CONTENT */
.main-content h1 {
  color: #00b5dc;
  font-size: 1.4em;
  margin-bottom: 0.5em; }

.main-content h2 {
  color: #00b5dc;
  font-size: 1.4em;
  margin-bottom: 0.5em; }

.read-more, .read-more a:hover, .secondary-nav a, .main-content p, .main-content li, .pagination, .breadcrumbs p, footer {
  color: #223740;
  font-size: 1em;
  line-height: 1.5em;
  margin-bottom: 1.2em; }

.main-content .link {
  color: #0080c6; }
  .main-content .link:hover {
    color: #00a1f9; }
  .main-content .link:active {
    color: #005f93; }

/* SITE SPECIFIC */
.primary-nav a {
  font-size: .9em;
  text-transform: uppercase;
  display: inline-block; }

/* FORMS */
/* --------------------------------- */
/* /////// END SITE STYLES ///////// */
/* --------------------------------- */
/* RESET & HTML 5  */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, input, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  text-decoration: none;
  list-style: none; }

header, footer, nav, section, article, aside {
  display: block; }

html {
  -webkit-text-size-adjust: 100%; }

input, textarea {
  -webkit-appearance: none;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0; }

h1, h2, h3, h4, h5, h6 {
  font-weight: normal; }

[href*=tel] {
  color: inherit; }

/* CUSTOM FONTS */
@font-face {
  font-family: 'open_sans';
  src: url("OpenSans-Regular-webfont.eot");
  src: url("OpenSans-Regular-webfont.eot?#iefix") format("embedded-opentype"), url("OpenSans-Regular-webfont.woff") format("woff"), url("OpenSans-Regular-webfont.ttf") format("truetype"), url("OpenSans-Regular-webfont.svg#open_sansregular") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'open_sans';
  src: url("OpenSans-Light-webfont.eot");
  src: url("OpenSans-Light-webfont.eot?#iefix") format("embedded-opentype"), url("OpenSans-Light-webfont.woff") format("woff"), url("OpenSans-Light-webfont.ttf") format("truetype"), url("OpenSans-Light-webfont.svg#open_sanslight") format("svg");
  font-weight: 100;
  font-style: normal; }
/* SITE SPECIFIC LAYOUT ELEMENTS */
body {
  font-family: "open_sans", sans-serif;
  font-size: 100%;
  background: #FFF url("../images/global/body-bg.jpg") repeat-x center top; }

.hidden {
  display: none; }

.left-content, .sidebar {
  float: left; }

.left-content {
  width: 65%;
  padding-right: 5%;
  padding-bottom: 5%; }

.sidebar {
  width: 30%; }

.read-more {
  color: #0080c6;
  clear: both !important;
  padding: 10px 0; }

.read-more a:hover {
  color: #00a1f9; }

/* HEADER */
header {
  height: 240px;
  z-index: 10;
  text-align: center; }

.logo {
  left: 20px;
  top: 20px;
  width: 150px; }

/* PRIMARY NAV */
.primary-nav {
  width: 100%;
  clear: both;
  background-color: #0080c6;
  height: 50px;
  bottom: 0;
  right: 0; }
  .primary-nav a {
    color: #FFF;
    padding: 1.16em 4.63em;
    border-right: 1px solid #8bd2f4;
    transition: all 250ms;
    float: left; }
    .primary-nav a:hover {
      color: #FFE62C;
      background: #2db5ff; }
    .primary-nav a:active {
      color: #FFE62C;
      background: #003e60; }

.primary-nav a.contact-link {
  border-right: none !important; }

.header-contact {
  float: right;
  top: 125px;
  right: 2.5%; }
  .header-contact .header-phone {
    color: #fff;
    background: url("../images/global/phone.png") no-repeat 0px 5px;
    padding: 5px 0 5px 35px;
    font-size: 1.6em; }

/* SECONDARY NAV */
.secondary-nav {
  width: 100%;
  margin-left: 1.5em; }
  .secondary-nav a {
    padding: 10px 0 10px 30px;
    border-bottom: 1px solid #3F3F3F;
    background: url("/images/global/arrow-right.png") no-repeat left 10px;
    background-size: 18px; }
    .secondary-nav a:hover {
      color: #00a1f9; }
    .secondary-nav a:active {
      color: #005f93; }

/* ACTIVE HIGHLIGHTS */
.home-page .home-link, .about-page .about-link, .services-page .services-link, .testimonials-page .testimonials-link, .gallery-page .gallery-link, .contact-page .contact-link {
  background: #2db5ff;
  color: #FFE62C; }

/* MENU BURGER  */
.menu-burger {
  display: none;
  top: 70px;
  right: 5%;
  background: #0080c6 url("../images/global/menu-burger.png") no-repeat center center;
  background-size: 30px;
  margin: 0px;
  color: #fff;
  width: 45px;
  height: 45px; }

.menu-burger:hover {
  background-color: #33d2f5; }

/* MAIN CONTENT */
.main-content {
  background: #fff; }
  .main-content ul {
    overflow: auto;
    margin: 1em 0 1em 1.5em; }
  .main-content li {
    padding-left: 15px; }
  .main-content li::before {
    content: ' ';
    top: 6px;
    left: 0;
    width: 8px;
    height: 8px;
    border-radius: 6px;
    background: #f3c831; }

/* PAGINATION */
.pagination {
  width: 100%;
  margin: 2em 0; }
  .pagination a {
    color: #0080c6; }
  .pagination a:hover {
    color: #00a1f9; }
  .pagination a:active {
    color: #005f93; }

.pagination .innerpag {
  text-align: center; }

.pagination .next {
  float: right;
  text-align: right; }

.pagination .previous {
  float: left;
  text-align: left; }

/* BREADCRUMBS */
.breadcrumbs {
  padding: 1.5em 0;
  margin-bottom: 1.5em;
  border-top: 1px solid #ddd; }

.breadcrumbs p {
  float: left; }
  .breadcrumbs p a {
    color: #0080c6; }
  .breadcrumbs p a:hover {
    color: #00a1f9; }
  .breadcrumbs p a:active {
    color: #005f93; }

.breadcrumbs .location {
  width: 80%;
  padding-left: 30px;
  text-align: left;
  background: url("../images/global/breadcrumbs.png") no-repeat center left;
  background-size: 24px; }

.breadcrumbs .top-link {
  width: 20%;
  padding-right: 24px;
  text-align: right;
  background: url("../images/global/page-top.png") no-repeat center right;
  background-size: 18px; }

/* FOOTER */
.footer-wrapper {
  background: #0080c6; }

footer {
  padding: 1.5em 0;
  color: #fff; }
  footer .copyright {
    float: left; }
  footer .credit {
    float: right; }
    footer .credit a {
      color: #8bd2f4; }
    footer .credit a:hover {
      color: #00a1f9; }
    footer .credit a:active {
      color: #005f93; }

/* MEDIA QUERIES */
@media screen and (max-width: 1200px) {
  .primary-nav {
    width: 100%;
    clear: both;
    background-color: #0080c6;
    height: 50px;
    bottom: 0;
    right: 0; }
    .primary-nav a {
      padding: 1.16em 3.2em; } }
@media screen and (max-width: 768px) {
  .primary-nav {
    width: 100%;
    clear: both;
    background-color: #0080c6;
    height: 50px;
    bottom: 0;
    right: 0; }
    .primary-nav a {
      padding: 1.16em 1.9em; }

  footer {
    padding: 3em 20px;
    font-size: 0.8em; } }
@media screen and (max-width: 736px) {
  header {
    height: 125px; }

  .logo {
    width: 100px !important; }

  .menu-burger {
    display: block; }

  .primary-nav {
    display: none;
    height: 230px;
    top: 60px !important;
    right: 2.5%;
    border-bottom: 8px solid #0080c6;
    padding: 0.5em 0em !important;
    width: 50% !important;
    top: 115px !important;
    right: 5% !important;
    z-index: 9999; }
    .primary-nav a {
      width: 100%;
      text-align: center;
      display: block;
      border-bottom: 1px solid #fff;
      border-right: none;
      padding: 0.8em 0em !important; }
    .primary-nav a:last-child {
      border-bottom: none; }

  .header-contact {
    top: 15px; }

  .breadcrumbs {
    display: none !important;
    width: 100%; }

  footer {
    width: 100%;
    padding: 1.5em 0;
    font-size: 0.8em; }
    footer .copyright {
      width: 95%;
      float: none;
      text-align: center;
      padding: 0; }
    footer .credit {
      width: 95%;
      float: none;
      text-align: center;
      padding-top: 10px; } }
