/* ########################################################### */
/* Fonts */
@import "https://fonts.googleapis.com/css?family=Work+Sans:100,300,500,700,900";

h1 {
  font-family: "Work Sans", sans-serif;
  color: white;
  font-weight: 300;
  text-align: center;
  text-shadow: 4px 4px 10px #000000, -1px -1px 10px #000000;
  text-transform: uppercase;
  font-size: 50px;
  line-height: 1.5;
  text-decoration: none; }

  @media screen and (max-width: 600px) {
    h1 {
      font-size: 40px; } }

  h1.specTitle {
    text-shadow: none;

    color: black; }

h2 {
  font-family: "Work Sans", sans-serif;
  font-size: 24px;
  font-weight: 300;
  line-height: 1.3;
  color: #000000;
  text-transform: initial;
  margin-bottom: 20px;
  text-align: center;
  text-decoration: none; }

  @media screen and (max-width: 600px) {
    h2 {
      font-size: 18px; } }

  h2 .subhead {
    font-size: 40px;
    text-align: center; }

    @media screen and (max-width: 600px) {
      h2 .subhead {
        font-size: 30px; } }

h3 {
  padding: 0 0 20px 0;
  text-align: left;
  font-weight: 300;
  font-size: 20px;
  color: #000000;
  text-decoration: none; }

  @media screen and (min-width: 600px) {
    h3 {
      font-size: 20px; } }

h4 {
  font-family: "Work Sans", sans-serif !important;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  margin: 10px 0;
  text-decoration: none;
  color: #000000; }

h5 {
  font-family: "Work Sans", sans-serif !important;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.2;
  margin: 10px 0;
  text-decoration: none;
  color: #000000; }

h6 {
  font-family: "Work Sans", sans-serif !important;
  line-height: 1.2;
  margin-bottom: 20px; }

p {
  font-family: "Work Sans", sans-serif !important;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.3;
  margin-bottom: 20px;
  text-align: left;
  text-transform: initial;
  text-decoration: none; }

  p:last-child {
    margin-bottom: 0; }

    .noBottomMargin {
  margin-bottom: 0; }

.subhead {
  font-size: 38px;

  font-weight: 300;

  text-align: center;

  margin-bottom: 30px; }

  @media screen and (max-width: 600px) {
    .subhead {
      font-size: 30px; } }

.intro > p {
  font-size: 26px;

  font-weight: 300;

  text-align: center;

  margin-bottom: 50px; }

  @media screen and (max-width: 600px) {
    .intro > p {
      font-size: 18px; } }

.imagetextblock li {
  font-family: "Work Sans", sans-serif !important;
  font-size: 16px;
  font-weight: 300;
  line-height: 1.3;
  margin-bottom: 5px;
  text-align: left; }

.left {
  text-align: left; }

.center {
  text-align: center; }

.right {
  text-align: right; }

.uppercase {
  text-transform: uppercase; }

.intro .balance-text p {
  text-wrap: balanced;
}

.homeSubheadings {
  font-family: "Work Sans", sans-serif;
  color: black;
  font-weight: 300;
  text-transform: uppercase;
  font-size: 50px;
  line-height: 1.5; }
  @media screen and (max-width: 600px) {
    .homeSubheadings {
      font-size: 40px; } }

/* ########################################################### */
/* Colours */
.bg_green {
  background: #000000; }

.bg_green-light {
  background: #1a5465; }

.bg_green-dark {
  background: #0a2229; }

.bg_white {
  background: #FFFFFF; }

.bg_grey {
  background: #cccccc; }

.bg_grey-light {
  background: #E5E5E5; }

.bg_grey-dark {
  background: #666666; }

.bg_black-extralight {
  background: rgba(0, 0, 0, 0.5); }

/* ########################################################### */
/* Animation */
@-webkit-keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0); }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0); }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -webkit-transform: translate3d(0, -15px, 0);

    transform: translate3d(0, -15px, 0); }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);

    transform: translate3d(0, -4px, 0); } }

@keyframes bounce {
  from, 20%, 53%, 80%, to {
    -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);

    -webkit-transform: translate3d(0, 0, 0);

    transform: translate3d(0, 0, 0); }

  40%, 43% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -webkit-transform: translate3d(0, -30px, 0);

    transform: translate3d(0, -30px, 0); }

  70% {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);

    -webkit-transform: translate3d(0, -15px, 0);

    transform: translate3d(0, -15px, 0); }

  90% {
    -webkit-transform: translate3d(0, -4px, 0);

    transform: translate3d(0, -4px, 0); } }

.bounce {
  -webkit-animation-name: bounce;

  animation-name: bounce;

  -webkit-transform-origin: center bottom;

  transform-origin: center bottom; }


/* ########################################################### */
/* Generic */
.spaceAbove {
  margin-top: 50px; }

.spaceBelow {
  margin-bottom: 50px; }

@-webkit-keyframes animateBounce {
  0%, 100% {
    -webkit-transform: translate(-50%, 0); }

  50% {
    -webkit-transform: translate(-50%, -15px); } }

@-moz-keyframes animateBounce {
  0%, 100% {
    -moz-transform: translate(-50%, 0); }

  50% {
    -moz-transform: translate(-50%, -15px); } }

@keyframes animateBounce {
  0%, 100% {
    -webkit-transform: translate(-50%, 0);

    -moz-transform: translate(-50%, 0);

    -ms-transform: translate(-50%, 0);

    -o-transform: translate(-50%, 0);

    transform: translate(-50%, 0); }

  50% {
    -webkit-transform: translate(-50%, -15px);

    -moz-transform: translate(-50%, -15px);

    -ms-transform: translate(-50%, -15px);

    -o-transform: translate(-50%, -15px);

    transform: translate(-50%, -15px); } }

.scrollGraphic {
  position: absolute;
  bottom: 120px;
  left: 50%;
  -webkit-animation: animateBounce 2s infinite;
  -moz-animation: animateBounce 2s infinite;
  animation: animateBounce 2s infinite;
  z-index: 1000; }

  @media only screen and (max-width: 600px) {
    .scrollGraphic {
      display: none; } }

  @media only screen and (max-width: 600px) {
    .scrollGraphic {
      display: none; } }

ul {
  list-style-type: square;
  list-style-position: outside;
  list-style-image: none;
  margin-bottom: 5px;
  padding-left: 20px; }

  .textblock span ul {
    text-align: left;
}

.borderGrey {
  border: 1px solid #cccccc; }

.borderBlack {
  border: 1px solid #000000; }

.contactCTA {
  width: 100%;
  border-top: 1px solid #cccccc; }

#hidden,
.hidden {
display:none;
}


/* ########################################################### */
/* Main */

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box; }

html {
  height: 100%; }

body {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  font-family: "Work Sans", sans-serif;
  font-weight: 300;
  font-size: 16px; }

#skrollr-body {
  min-height: 1px; }

header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 70px;
  background: #ffffff;
  z-index: 500;
  -moz-box-shadow: grey 10px 0px 20px;
  -webkit-box-shadow: grey 10px 0px 20px;
  box-shadow: grey 10px 0px 20px; }

  header #headerLeft {
    position: absolute;
    top: 0px;
    left: 30px; }

    header #headerLeft img {
      width: 130px;
      box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.53); }

  header #headerRight {
    position: fixed;
    top: 18px;
    right: 50px;
    text-align: right;
    font-family: "Work Sans", sans-serif;
    font-weight: 100;
    font-size: calc(35px + .1vw); }

    @media only screen and (max-width: 600px) {
      header #headerRight {
        right: 20px;
        position: relative;
        font-weight: 500;
        font-size: 18px;
        margin-top: 10px; } }

/* ########################################################### */
/* Nav */
.nav_trigger,
  .nav_trigger_2 {
    display: none; }
  .nav_trigger_label,
  .nav_trigger_2_label {
    display: none; }

  label.nav_trigger_label {
    display: none;
    top: 10px;
    left: 6px;
    z-index: 1000; }

  nav {
    position: absolute;
    top: 20px;
    left: 180px;
    display: block;
    z-index: 9999; }
nav ul.mainMenu,
nav ul.mainMenu li ul {
    padding: 0;
    list-style: none; }

nav ul.mainMenu li {
    position: relative;
    float: left;
    padding: 5px 0;
    text-align: left;
    background-color: transparent;
    border-right: 1px solid rgba(0, 0, 0, 0.3); }

nav ul.mainMenu li:last-child {
      border-right: none; }

nav ul.mainMenu li > a {

      padding: 0 10px;
      color: #0a2229;
      text-decoration: none; }

nav ul.mainMenu li:hover {
      -webkit-transition: background-color 0.75s ease;
      -moz-transition: background-color 0.75s ease;
      transition: background-color 0.75s ease;
      background-color: rgba(0, 0, 0, 0.15); }

nav ul.mainMenu ul {
    display: none;
    box-sizing: border-box;
    position: absolute;
    top: 29px;
    left: 0;
    background: white;
    padding: 0;
    border-left: 1px solid #cccccc;
    box-shadow: rgba(0, 0, 0, 0.4) 7px 7px 7px; }

nav ul.mainMenu ul li {
    float: none;
    width: auto;
    margin: 0;
    padding: 10px 0px;
    border-top: 1px solid #0a2229;
    border-right: none;
    text-align: left;
    white-space: nowrap; }

nav ul.mainMenu ul li a {
    border-right: 0px; }

nav ul.mainMenu li:hover > ul {
    display: block; }

/*
@media only screen and (min-width: 601px) and (max-width: 1100px) {
  .nav_trigger,
  .nav_trigger_2 {
    display: none; }

  .wrapper {
    position: relative;
    overflow-x: hidden; }

  label.nav_trigger_label {
    display:none; }

  label.nav_trigger_2_label {
    position: fixed;
    display: block;
    top: 27px;
    left: 200px;
    color: black;
    z-index: 1000; }

  label.nav_trigger_2_label_off {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999; }

nav {
    position: fixed;
    overflow-y: scroll;
    position: fixed;
    transition-property: left;
    transition-duration: 0.25s;
    display: block;
    top: 0px;
    left: -250px;
    bottom: 0px;
    width: 250px;
    background: white;
    -moz-box-shadow: 0 0px 10px #666666;
    -webkit-box-shadow: 0 0px 10px #666666;
    box-shadow: 0 0px 10px #666666;
    z-index: 9999;
  }

nav input {display:none;}
  .nav_trigger:checked + label.nav_trigger_label {
    transition-property: left;
    transition-duration: 0.25s;
    left: 265px; }

  .nav_trigger:checked ~ label.nav_trigger_label_off {
    display: block; }

  .nav_trigger:checked ~ nav {
    transition-property: left;
    transition-duration: 0.25s;
    left: 0px; }

  nav ul.mainMenu {
    position: relative;
    padding: 0px;
    list-style: none;
    list-style-position: inside; }

  nav ul.mainMenu > li {
    position: relative;
    display: block;
    clear: both;
    padding: 0;
    width: 100%;
    background:#cccccc; }

  nav ul.mainMenu li > a {
    display: block;
    border-right: 0px;
    width: 100%;
    padding: 10px 20px;
    border-bottom: 1px solid #666666;
    text-decoration: none; }

  nav ul.mainMenu li > a:hover {
    color: #000000;
    background: #dddddd; }

  nav ul.mainMenu ul {
    position: relative;
    display: block;
    padding: 0;
    top:0;
    list-style: none;
    list-style-position: inside;
    background: white; }

  nav ul.mainMenu ul > li {
    border-top:0;
    float: none;
    width: 100%;
    padding: 0px; }

  nav ul.mainMenu ul li a {
    display: block;
    border-right: 0px;
    width: 100%;
    padding: 10px 20px;
    border-bottom: 1px solid #666666;
    text-decoration: none; }

  nav ul.mainMenu li:hover > ul {
    display: block; }
}
*/

@media only screen and (max-width: 1100px) {
  .nav_trigger,
  .nav_trigger_2 {
    display: none; }

  .wrapper {
    position: relative;
    overflow-x: hidden; }

  label.nav_trigger_label {
    transition-property: left;
    transition-duration: 0.25s;
    position: fixed;
    display: block;
    top: 10px;
    left: 6px;
    z-index: 1000; }

  label.nav_trigger_2_label {
    position: absolute;
    display: none;
    top: 10px;
    left: 6px;
    z-index: 1000; }

  label.nav_trigger_label_off {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999; }

  nav {
    position: fixed;
    overflow-y: scroll;
    position: fixed;
    transition-property: left;
    transition-duration: 0.25s;
    display: block;
    top: 0px;
    left: -250px;
    bottom: 0px;
    width: 250px;
    background: white;
    -moz-box-shadow: 0 0px 10px #666666;
    -webkit-box-shadow: 0 0px 10px #666666;
    box-shadow: 0 0px 10px #666666;
    z-index: 9999;
  }

nav input {display:none;}
  .nav_trigger:checked + label.nav_trigger_label {
    transition-property: left;
    transition-duration: 0.25s;
    left: 265px; }

  .nav_trigger:checked ~ label.nav_trigger_label_off {
    display: block; }

  .nav_trigger:checked ~ nav {
    transition-property: left;
    transition-duration: 0.25s;
    left: 0px; }

  nav ul.mainMenu {
    position: relative;
    padding: 0px;
    list-style: none;
    list-style-position: inside; }

  nav ul.mainMenu > li {
    position: relative;
    display: block;
    clear: both;
    padding: 0;
    width: 100%;
    background:#cccccc; }

  nav ul.mainMenu li > a {
    display: block;
    border-right: 0px;
    width: 100%;
    padding: 10px 20px;
    border-bottom: 1px solid #666666;
    text-decoration: none; }

  nav ul.mainMenu li > a:hover {
    color: #000000;
    background: #dddddd; }

  nav ul.mainMenu ul {
    position: relative;
    display: block;
    padding: 0;
    top:0;
    list-style: none;
    list-style-position: inside;
    background: white; }

  nav ul.mainMenu ul > li {
    border-top:0;
    float: none;
    width: 100%;
    padding: 0px; }

  nav ul.mainMenu ul li a {
    display: block;
    border-right: 0px;
    width: 100%;
    padding: 10px 20px;
    border-bottom: 1px solid #666666;
    text-decoration: none; }

  nav ul.mainMenu li:hover > ul {
    display: block; }
}


/* ########################################################### */
/* Sections */
    section {
  position: relative;

  display: block;

  box-sizing: border-box;

  width: 100% !important;

  background: #FFFFFF;

  overflow: hidden !important; }

article {
  position: relative;

  display: block;

  box-sizing: border-box;

  padding: 50px 50px;

  text-align: center; }

  @media only screen and (max-width: 600px) {
    article {
      padding: 50px 10px; } }

.contentBlocks:last-child {
  margin-bottom: 0; }

/* ########################################################### */
/* Footer */
footer {
  position: fixed;
  display: block;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 25px;
  background-color: #000000; }

  @media only screen and (max-width: 600px) {
    footer {
      position: relative;
      bottom: initial;
      left: initial;
      display: block;
      text-align: center;
      padding: 5px 0 10px;
      height: auto; } }

  footer .bottomMenu {
    position: fixed;
    font-size: 12px;
    color: white;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    bottom: 5px;
    color: white;
    margin: 0 auto; }

    footer .bottomMenu > a {
      color: white;
      padding: 0 10px; }

    @media only screen and (max-width: 1000px) {
      footer .bottomMenu {
        bottom: 30px;
        width: 100%;
        text-align: center; } }

    @media only screen and (max-width: 600px) {
      footer .bottomMenu {
        position: relative;
        bottom: initial;
        left: initial;
        display: block;
        text-align: center;
        padding: 5px 0 10px;
        -webkit-transform: translate(0, 0);
        -moz-transform: translate(0, 0);
        -ms-transform: translate(0, 0);
        -o-transform: translate(0, 0);
        transform: translate(0, 0);
        height: auto; } }

  footer .footerLeft {
    position: fixed;
    font-size: 12px;
    color: white;
    left: 30px;
    bottom: 5px; }

    @media only screen and (max-width: 600px) {
      footer .footerLeft {
        position: relative;
        bottom: initial;
        left: initial;
        display: block;
        text-align: center;
        margin-bottom: 5px; } }

  footer .footerRight {
    position: fixed;
    font-size: 12px;
    color: white;
    right: 30px;
    bottom: 5px; }

    @media only screen and (max-width: 600px) {
      footer .footerRight {
        position: relative;
        bottom: initial;
        right: initial;
        display: block;
        text-align: center; } }

    footer .footerRight a {
      color: white;
      text-decoration: none; }


/* ########################################################### */
/* Parallax */

.fullscreen {
  width: 100%;
  height: 100%;
  background: #FFFFFF; }

.parallax,
.halfparallax {
  height: 100%;
  background-position: top center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover; }
  .parallax article,
  .halfparallax article {
    height: 100%; }

  @media only screen and (max-width: 600px) {
    .parallax,
    .halfparallax {
      background-attachment: scroll;
      background-size: auto 100%;
      -webkit-background-size: auto 100%;
      -moz-background-size: auto 100%;
      -o-background-size: auto 100%; } }
/* ########################################################### */
/* FLEX */
.flex-container {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-align-items: flex-start;
  align-items: flex-start;
  -webkit-flex-wrap: no-wrap;
  flex-wrap: no-wrap;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-content: flex-start;
  align-content: flex-start; }

@media only screen and (max-width: 600px) {
  .flex-container {
    -webkit-flex-direction: column;
    flex-direction: column;
    width: 100%; } }

.flex-start {
  -webkit-justify-content: flex-start;
  justify-content: flex-start;
  -webkit-align-content: space-around;
  align-content: space-around;
  -webkit-align-items: flex-start;
  align-items: flex-start; }

/* ########################################################### */
/* FLEX */
.imageMatrix-container, .imageMatrix-container100, .imageMatrix-container60, .imageMatrix-container50 {
  display: flex;
  position: relative;
  flex-direction: row;
  align-items: center;
  padding: 0;
  margin-bottom: 20px;
  width: 100%;
  align-items: flex-start; }

  .flex-container {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: no-wrap;
  flex-wrap: no-wrap; }

  @media only screen and (max-width: 600px) {
    .flex-container {
      -webkit-flex-direction: column;
      flex-direction: column; } }

  .flex-container .flex-center-vertical {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40%; }

    @media only screen and (max-width: 600px) {
      .flex-container .flex-center-vertical {
        position: relative;
        width: 100%;
        left: 0;
        padding: 20px 0; } }

.flex-container-column {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-flex-wrap: no-wrap;
  flex-wrap: no-wrap; }

.flex-center-vertical {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  position: relative;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 100%; }

.textblock {
  position: relative; }

.imageMatrix-container100 .imageblock {
  width: 100%; }

  .imageMatrix-container100 .imageblock img {
    width: 100%; }

.imageMatrix-container100 .textblock {
  width: 100%; }

@media only screen and (max-width: 1024px) {
  .imageMatrix-container100 {
    flex-direction: column; } }

.imageMatrix-container60 .imageblock {
  width: 60%; }

  .imageMatrix-container60 .imageblock img {
    width: 100%; }

.imageMatrix-container60 .textblock {
  padding: 20px 20px 0 20px;
  width: 40%; }

@media only screen and (max-width: 1024px) {
  .imageMatrix-container60 {
    flex-direction: column !important;
    width: 100%; }
    .imageMatrix-container60 .imageblock, .imageMatrix-container60 .textblock {
      width: 100%; } }

.imageMatrix-container50 {
  justify-content: space-between; }

  .imageMatrix-container50 .imageblock {
    width: 50%; }

    .imageMatrix-container50 .imageblock img {
      display: block;
      width: 100%;
      margin: 0;
      padding: 0;
      line-height: 1; }

    .imageMatrix-container50 .imageblock:first-child {
      width: 48.5%; }
    .imageMatrix-container50 .imageblock:last-child {
      width: 48.5%; }

  @media only screen and (max-width: 1024px) {
    .imageMatrix-container50 {
      flex-direction: column;
      width: 100%; } }

/* ########################################################### */
/* IMAGE */
  .border-grey {
  border: 1px solid #cccccc; }

img {
  display: block;
  zoom: 1;
  margin: 0;
  padding: 0;
  line-height: 0; }
/* ########################################################### */
/* INTRO */
.intro {
width: 100%; }

  .intro img {
    margin: 0 auto;
    width: 50%; }

    @media only screen and (max-width: 600px) {
      .intro img {
        width: 100%; } }

/* ########################################################### */
/* Alternate */

.alternate:nth-child(odd) {
  -webkit-flex-direction: row-reverse;
  flex-direction: row-reverse; }

  @media only screen and (max-width: 600px) {
    .alternate:nth-child(odd) {
      -webkit-flex-direction: column;
      flex-direction: column; } }

  .alternate:nth-child(odd) .flex-center-vertical {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 40%; }

    @media only screen and (max-width: 600px) {
      .alternate:nth-child(odd) .flex-center-vertical {
        position: relative;
        width: 100%;
        left: 0;
        padding: 20px 0; } }

.alternate:nth-child(even) {
  -webkit-flex-direction: row;
  flex-direction: row; }

  @media only screen and (max-width: 600px) {
    .alternate:nth-child(even) {
      -webkit-flex-direction: column;
      flex-direction: column; } }

  .alternate:nth-child(even) .flex-center-vertical {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 40%; }

    @media only screen and (max-width: 600px) {
      .alternate:nth-child(even) .flex-center-vertical {
        position: relative;
        width: 100%;
        left: 0;
        padding: 20px 0; } }

/* ########################################################### */
/* Home */

.homeTitleHolder {
  display: block;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -moz-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  -o-transform: translate(0, -50%);
  transform: translate(0, -50%);
  left: 0;
  right: 0;
  box-sizing: border-box;
  width: 100%;
  z-index: 200;
  opacity: 100; }

.homeTitle {
  box-sizing: border-box;
  margin: 0;
  padding: 0 30px;
  width: 100%; }


.homeExploreHolder {
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: row;
  flex-direction: row;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-justify-content: space-between;
  justify-content: space-between;
  -webkit-align-items: stretch;
  align-items: stretch;
  -webkit-align-content: stretch;
  align-content: stretch; }
  .homeExploreHolder a {
    text-decoration: none; }
  @media screen and (max-width: 1000px) {
    .homeExploreHolder {
      -webkit-flex-direction: column;
      flex-direction: column; } }
  @media screen and (max-width: 500px) {
    .homeExploreHolder {
      width: 100%;
      -webkit-flex-direction: column;
      flex-direction: column; } }

.homeExploreColumn {
  position: relative;
  width: 23%;
  display: -webkit-box;
  display: -moz-box;
  display: box;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-flex-direction: column;
  flex-direction: column;
  -webkit-flex-wrap: nowrap;
  flex-wrap: nowrap;
  -webkit-align-content: stretch;
  align-content: stretch;
  padding-bottom: 50px; }
  .homeExploreColumn > h2 {
    margin-top: 20px;
    text-align: center; }
  @media screen and (max-width: 1000px) {
    .homeExploreColumn {
      width: 100%;
      margin-top: 20px;
      -webkit-flex-direction: row;
      flex-direction: row;
      -webkit-justify-content: flex-end;
      justify-content: flex-end;
      -webkit-align-content: flex-end;
      align-content: flex-end;
      -webkit-align-items: flex-end;
      align-items: flex-end; } }
  @media screen and (max-width: 500px) {
    .homeExploreColumn {
      display: block; } }

.homeExploreImage {
  background-size: cover;
  width: 100%; }
  .homeExploreImage:after {
    content: "";
    display: block;
    padding-bottom: 100%; }
  @media screen and (max-width: 1000px) {
    .homeExploreImage {
      width: 30%; } }
  @media screen and (max-width: 500px) {
    .homeExploreImage {
      display: block;
      width: 40%;
      margin: 0 auto; } }

.homeExploreTextHolder {
  position: relative;
  width: 100%;
  margin-bottom: 10px; }
  .homeExploreTextHolder h2 {
    text-decoration: none; }
  .homeExploreTextHolder p {
    text-decoration: none; }
  @media screen and (max-width: 1000px) {
    .homeExploreTextHolder {
      padding: 0 0 0 20px; } }
  @media screen and (max-width: 500px) {
    .homeExploreTextHolder {
      width: 100%;
      padding: 0; } }

.homeExploreTitle {
  margin-top: 20px; }
  .homeExploreTitle h2, .homeExploreTitle span {
    text-align: center; }
    @media screen and (max-width: 1000px) {
      .homeExploreTitle h2, .homeExploreTitle span {
        text-align: left; } }
    @media screen and (max-width: 500px) {
      .homeExploreTitle h2, .homeExploreTitle span {
        text-align: center; } }

.homeExploreText span p {
  color:black;
  text-align: center; }
  @media screen and (max-width: 1000px) {
    .homeExploreText span p {
      text-align: left; } }
  @media screen and (max-width: 500px) {
    .homeExploreText span p {
      text-align: center; } }

.homeExploreButton {
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0); }
  @media screen and (max-width: 500px) {
    .homeExploreButton {
      margin-top: 20px;
      position: relative;
      bottom: initial;
      right: initial; } }





/* ########################################################### */
/* Buttons */
input, textarea, select, button {
  font-size: 16px; }

.buttonSectionHolder {
  margin: 0;
  width: 100%;
  padding: 0 10px 20px;
  text-align: center; }

.absoluteBottomCenter {
  text-align: center;
  position: absolute !important;
  bottom: 0;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
  -moz-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  -o-transform: translate(-50%, 0);
  transform: translate(-50%, 0); }

.buttonSection {
  display: inline-block;
  position: relative;
  margin-bottom: 20px; }

.buttonFormSection {
  width: 100%;
  position: relative;
  text-align: center;
  margin-top: 20px; }

.buttonIntro {
  float: left; }

.buttonHolder {
  position: relative;
  display: inline-block;
  width: 136px;
  height: 26px;
  overflow: hidden;
  margin: 2px auto 20px; }

  @media screen and (max-width: 1000px) {
    .buttonHolder {
      float: none;
      margin-bottom: 20px; } }

  @media screen and (max-width: 1000px) {
    .buttonHolder {
      float: none;
      margin-bottom: 0px; } }

.buttonFormHolder {
  position: relative;
  width: 136px;
  height: 26px;
  overflow: hidden;
  margin: 2px auto 0; }

.buttonImage {
  position: absolute;
  top: 0;
  left: 0;
  width: 136px;
  height: 51px;
  overflow: hidden; }

.buttonText {
  position: absolute;
  top: 4px;
  left: 0;
  width: 105px;
  color: white;
  font-family: "Work Sans", sans-serif;
  font-size: 14px;
  font-weight: 500; }

.buttonIcon {
  position: absolute;
  top: 4px;
  left: 50%;
  width: 105px;
  color: white;
  font-family: "Work Sans", sans-serif;
  font-size: 16px; }





.contactOptions {
  position: relative;

  display: flex;

  flex-direction: row;

  justify-content: space-between;

  margin-bottom: 30px; }

  @media only screen and (max-width: 1000px) {
    .contactOptions {
      flex-direction: column; } }

  @media only screen and (max-width: 800px) {
    .contactOptions {
      flex-direction: column; } }

.contactHolder {
  position: relative;

  display: flex;

  flex-direction: column;

  justify-content: flex-start;

  align-content: flex-start;

  align-items: stretch;

  padding-bottom: 50px;

  width: 20%; }

  @media only screen and (max-width: 1000px) {
    .contactHolder {
      flex-direction: row;

      width: 100%;

      padding-bottom: 20px; } }

.contactTextHolder {
  position: relative;

  height: 100%; }

  .contactTextHolder h2 {
    text-align: center;

    margin: 0;

    padding: 0; }

  .contactTextHolder p {
    text-align: center; }

  @media only screen and (max-width: 1000px) {
    .contactTextHolder {
      text-align: left;

      width: 80%;

      height: initial; }

      .contactTextHolder h2 {
        text-align: left; }

      .contactTextHolder p {
        text-align: left; } }

.checkboxContact {
  position: absolute;

  bottom: 10px;

  left: 50%;

  -webkit-transform: translate(-50%, 0);

  -moz-transform: translate(-50%, 0);

  -ms-transform: translate(-50%, 0);

  -o-transform: translate(-50%, 0);

  transform: translate(-50%, 0);

  width: 25px; }

  @media only screen and (max-width: 1000px) {
    .checkboxContact {
      position: relative;

      text-align: right;

      width: 20%;

      left: initial;

      bottom: initial;

      -webkit-transform: translate(0, 0);

      -moz-transform: translate(0, 0);

      -ms-transform: translate(0, 0);

      -o-transform: translate(0, 0);

      transform: translate(0, 0); } }

.checkboxContact label {
  cursor: pointer;

  position: absolute;

  width: 25px;

  height: 25px;

  top: 0;

  left: 0;

  background: #ffffff;

  border: 1px solid #999999; }

  @media only screen and (max-width: 1000px) {
    .checkboxContact label {
      top: 50%;

      right: 0;

      left: initial;

      -webkit-transform: translate(0, -50%);

      -moz-transform: translate(0, -50%);

      -ms-transform: translate(0, -50%);

      -o-transform: translate(0, -50%);

      transform: translate(0, -50%); } }

.checkboxContact label:after {
  opacity: 0;

  content: attr(data-icon);

  position: absolute;

  left: 3px;

  top: -12px;

  font-size: 35px;

  color: #1a5465;

  background: transparent; }

.checkboxContact input[type=checkbox]:checked + label:after {
  opacity: 1; }

.contactForm {
  display: flex;

  flex-direction: row;

  justify-content: space-between;

  align-content: flex-start;

  align-items: stretch;

  margin-bottom: 20px; }

  @media only screen and (max-width: 600px) {
    .contactForm {
      flex-direction: column; } }

.contactFormInputsHolder {
  display: flex;

  flex-direction: column;

  margin-top: 0px;

  width: 30%; }

  @media only screen and (max-width: 600px) {
    .contactFormInputsHolder {
      width: 100%; } }

.cnFormLabel {
  text-align: left;

  color: #666666;

  margin-bottom: 5px; }

  .cnFormLabel span {
    color: red; }

.cnFormField,

.cnFormFieldLast {
  width: 100%;

  padding: 10px;

  margin-bottom: 10px; }

.cnFormFieldLast {
  margin-bottom: 0; }

  @media only screen and (max-width: 600px) {
    .cnFormFieldLast {
      margin-bottom: 10px; } }

.cnFormPostcode {
  visibility: hidden; }

.contactFormMessageHolder {
  display: flex;

  flex-direction: column;

  justify-content: flex-start;

  align-content: stretch;

  margin-top: 0px;

  width: 70%;

  padding-left: 20px; }

  @media only screen and (max-width: 600px) {
    .contactFormMessageHolder {
      width: 100%;

      padding-left: 0;

      height: 300px; } }

.contactInput {
  width: 100%;

  padding: 10px;

  margin-bottom: 20px; }

  .contactInput:last-child {
    margin-bottom: 0; }

.contactMessage {
  width: 100%;

  height: 100%; }

.contactFormButton {
  display: flex;

  flex-direction: row;

  justify-content: flex-end; }

#sectionContact {
  padding-bottom: 50px; }

.homeContactSubmit {
  position: relative;

  text-align: right; }

  @media only screen and (max-width: 600px) {
    .homeContactSubmit {
      text-align: center; }

      .homeContactSubmit > div > div {
        margin: 10px auto; } }

/* ##################################### Bespoke ##################################### */

.homeBespokeCTA {
  position: relative;

  width: 50%;

  margin: 0 auto; }

  @media only screen and (max-width: 1180px) {
    .homeBespokeCTA {
      width: 75%; } }

  @media only screen and (max-width: 600px) {
    .homeBespokeCTA {
      width: 100%; } }

/* ##################################### Specifier ##################################### */

.servicesHolder {
  -webkit-flex: auto;

  flex: auto;

  display: -webkit-box;

  display: -moz-box;

  display: box;

  display: -webkit-flex;

  display: -moz-flex;

  display: -ms-flexbox;

  display: flex;

  -webkit-flex-direction: row;

  flex-direction: row;

  -webkit-justify-content: space-between;

  justify-content: space-between; }

  @media only screen and (max-width: 1000px) {
    .servicesHolder {
      -webkit-flex-direction: column;

      flex-direction: column;

      width: 100%;

      margin: 0 auto; } }

  @media only screen and (max-width: 800px) {
    .servicesHolder {
      -webkit-flex-direction: column;

      flex-direction: column;

      width: 100%;

      margin: 0 auto; } }

.servicesColumn1 {
  width: 47%;

  margin-right: 3%; }

  .servicesColumn1 img {
    display: block;

    width: 100%; }

  .servicesColumn1 a {
    text-decoration: none; }

  @media only screen and (max-width: 1000px) {
    .servicesColumn1 {
      width: 65%;

      margin: 0 auto; } }

  @media only screen and (max-width: 800px) {
    .servicesColumn1 {
      width: 100%;

      margin: 0 auto; } }

.servicesColumn2 {
  width: 50%;

  display: flex;

  flex-direction: column;

  justify-content: space-between; }

  .servicesColumn2 a {
    text-decoration: none; }

  @media only screen and (max-width: 1000px) {
    .servicesColumn2 {
      width: 65%;

      justify-content: center;

      margin: 0 auto; } }

  @media only screen and (max-width: 800px) {
    .servicesColumn2 {
      width: 100%;

      justify-content: center;

      margin: 0 auto; } }

.servicesRow {
  display: flex;

  flex-direction: row;

  align-items: flex-end; }

  @media only screen and (max-width: 1000px) {
    .servicesRow {
      margin-top: 20px; } }

  @media only screen and (max-width: 800px) {
    .servicesRow {
      flex-direction: column;

      align-items: center;

      margin-top: 20px; } }

.servicesTile {
  width: 25%;

  margin-right: 5%; }

  .servicesTile:last-child {
    margin-right: 0; }

  .servicesTile img {
    width: 100%; }

  @media only screen and (max-width: 800px) {
    .servicesTile {
      margin-right: 0;

      width: 40%; } }

.servicesImage {
  width: 100%;

  background-size: cover; }

  .servicesImage:after {
    display: block;
    content: "";
    padding-bottom: 100%; }

.servicesText {
  width: 70%;
  color:black;
  text-align: left; }

  .servicesText h2 {
    padding: 0;
    margin: 0; }

  @media only screen and (max-width: 800px) {
    .servicesText {
      margin-top: 10px;
      text-align: center; }

      .servicesText h2 p {
        text-align: center; } }

.specifierButton {
  width: 62.5%;

  background: #333333;

  color: white;

  margin-top: 20px;

  padding: 10px 20px; }

  .specifierButton:hover {
    background: black; }

  @media only screen and (max-width: 1000px) {
    .specifierButton {
      width: 65%;

      margin: 20px auto 0; } }

  @media only screen and (max-width: 800px) {
    .specifierButton {
      width: 100%; } }

.specifierLink {
  text-decoration: none; }

a.anchor {
  display: block;

  position: relative;

  top: -250px;

  visibility: hidden; }

.texturedSection {
  border-bottom: 1px solid #cccccc;

  padding-bottom: 30px; }

.texturedSection article {
  text-align: left; }

  .texturedSection article .texDescription {
    box-sizing: border-box;

    width: 50%;

    padding-right: 30px; }

    .texturedSection article .texDescription h2, .texturedSection article .texDescription h3, .texturedSection article .texDescription p {
      text-align: left; }

  .texturedSection article .texImage {
    width: 50%; }

    .texturedSection article .texImage img {
      width: 100%; }

  .texturedSection article .texContact {
    display: block;

    width: 100%; }

.homeTexturedImage {
  box-sizing: border-box;

  width: 60%; }

  .homeTexturedImage img {
    display: block;

    margin: 0;

    padding: 0;

    line-height: 1;

    width: 100%; }

  @media screen and (max-width: 800px) {
    .homeTexturedImage {
      width: 50%; } }

  @media screen and (max-width: 600px) {
    .homeTexturedImage {
      width: 100%; } }

.homeTexturedText {
  display: table;

  position: relative;

  box-sizing: border-box;

  padding: 30px;

  width: 40%;

  height: inherit; }

  .homeTexturedText span {
    display: table-cell;

    height: inherit;

    vertical-align: middle; }

  .homeTexturedText h2 {
    text-align: left; }

  @media screen and (max-width: 800px) {
    .homeTexturedText {
      width: 50%; } }

  @media screen and (max-width: 600px) {
    .homeTexturedText {
      width: 100%;

      min-height: 100px; } }

@media only screen and (max-width: 600px) {
  .texturedSection article .texDescription {
    padding-bottom: 20px;

    width: 100%;

    padding-right: 0; }

  .texturedSection article .texContact,

  .texturedSection article .texImage {
    width: 100%; } }

.eyecandy {
  margin-bottom: 30px; }

  .eyecandy img {
    display: block;

    width: 100%; }

.colouredContainer {
  width: 100%; }

.colouredColumn {
  width: calc(100% / 5);

  margin-bottom: 20px;

  padding-right: 30px; }

  .colouredColumn:last-child {
    margin-right: 0; }

  .colouredColumn img {
    width: 100%; }

  .colouredColumn p {
    text-align: center; }

.sectionProjects {
  display: block;

  width: 100%; }

.projectsAside {
  position: relative;

  display: block;

  width: 250px;

  padding: 0px 30px 50px 30px;

  background: #E5E5E5; }

  .projectsAside .projectCheckbox {
    display: none; }

  @media only screen and (max-width: 600px) {
    .projectsAside {
      display: none; } }

.projectsArticle {
  display: block;

  padding: 20px;

  width: 100%;

  margin: 0 auto;

  background: white; }

.asideHeader {
  display: block;

  width: calc(100% + 60px);

  padding: 10px 30px 10px 30px;

  margin-left: -30px;

  color: white;

  background-color: #000000; }

  .asideHeader > input[type=checkbox] {
    visibility: visible; }

.projectsHolder {
  box-sizing: border-box;

  padding: 10px;

  width: calc(50% - 20px);

  float: left;

  text-align: center; }

.projectsImage {
  box-sizing: border-box;

  background-size: cover !important; }

  .projectsImage:after {
    display: block;

    content: "";

    padding-bottom: 60%; }

.projectsOverlay {
  position: absolute;

  top: 10px;

  bottom: 10px;

  left: 10px;

  right: 10px;

  padding: 10px;

  box-sizing: border-box;

  padding: 20px;

  display: none; }

  @media only screen and (max-width: 600px) {
    .projectsOverlay {
      padding: 5px;

      margin: 0; } }

.projectsHolder:hover .projectsOverlay {
  display: block;

  background: rgba(0, 0, 0, 0.8);

  animation: fadein .35s linear; }

.projectsOverlayText {
  position: absolute;

  top: 50%;

  -webkit-transform: translate(0, -50%);

  -moz-transform: translate(0, -50%);

  -ms-transform: translate(0, -50%);

  -o-transform: translate(0, -50%);

  transform: translate(0, -50%); }

  .projectsOverlayText h5, .projectsOverlayText p {
    color: white; }

    @media only screen and (max-width: 600px) {
      .projectsOverlayText h5, .projectsOverlayText p {
        font-size: 12px;

        text-align: center;

        margin: 0;

        padding: 0; } }

.projectSample {
  position: relative;

  width: 35%;

  padding-top: 35%; }

  .projectSample > img {
    position: absolute;

    top: 0;

    bottom: 0;

    left: 0;

    right: 0;

    width: 100%; }

.projectSampleText {
  box-sizing: border-box;

  padding-left: 30px;

  width: 65%; }
/* --- combined specifier and antique --*/

.specifierMain,

.glassTypeMain { padding: 30px; }
.specifierArticle,

.glassTypeArticle { flex: auto;
 display: flex;
 flex-direction: column;
 flex-wrap: nowrap;
 border: 1px solid #666666;
 padding: 0; }
.specTitle,

.glassTitle { padding-bottom: 0;
 margin-bottom: 0; }
.specifierTopBar,

.glassTopBar { background: black; }
 .specifierTopBar h2,

  .glassTopBar h2 {   color: #FFFFFF;
   text-align: left;
   margin: 5px 20px 0; }
.specifierSampleDetails,

.glassTypeSampleDetails{ position: relative;
 background: black; }
 .specifierSampleDetails h2,

    .glassTypeSampleDetails h2 {   color: #FFFFFF;
   text-align: left;
   margin: 0 20px; }
   @media screen and (max-width: 900px) {     .specifierSampleDetails h2,

        .glassTypeSampleDetails h2 {       text-align: center; } }
   @media screen and (max-width: 500px) {     .specifierSampleDetails h2,

        .glassTypeSampleDetails h2 {       padding-top: 10px;
       font-size: 18px; } }
.specifierHolder,

.glassTypeHolder { flex: auto;
 display: flex;
 flex-direction: row;
 flex-wrap: wrap; }
 @media screen and (max-width: 900px) {   .specifierHolder,

      .glassTypeHolder {     flex-direction: column; } }
.specifierSampleHolder,

.glassSampleHolder { width: 30%;
 padding: 20px; }
 .specifierSampleHolder img,

    .glassSampleHolder img {   width: 100%; }
 @media screen and (max-width: 900px) {   .specifierSampleHolder,

      .glassSampleHolder {     width: 100%;
     text-align: center; }
     .specifierSampleHolder img

      .glassSampleHolder img{       width: 50%; } }
 @media screen and (max-width: 500px) {   .specifierSampleHolder img,

      .glassSampleHolder img {     width: 100%; } }
.specifierTileHolder,

.glassTileHolder { -webkit-flex: auto;
 flex: auto;
 display: -webkit-inline-box;
 display: -moz-inline-box;
 display: inline-box;
 display: -webkit-inline-flex;
 display: -moz-inline-flex;
 display: -ms-inline-flexbox;
 display: inline-flex;
 -webkit-flex-direction: row;
 flex-direction: row;
 -webkit-flex-wrap: wrap;
 flex-wrap: wrap;
 padding: 20px;
 width: 70%;
 -webkit-justify-content: flex-start;
 justify-content: flex-start;
 -webkit-align-items: flex-start;
 align-items: flex-start; }
 @media screen and (max-width: 900px) {   .specifierTileHolder,

      .glassTileHolder {     padding-top: 0;
     width: initial;
     -webkit-justify-content: space-around;
     justify-content: space-around; } }
.specifierTile img,

.glassTile img { width: 90px;
 margin: 20px 5px 0; }
.specifierButtons,

.glassButtons { display: block;
 position: absolute;
 top: 0;
 right: 0;
 padding-left: 0;
 list-style-type: none; }
 .specifierButtons li,

    .glassButtons li {   display: inline-block;
   color: white;
   width: 100px;
   border-left: 1px solid white;
   padding: 6px; }
   .specifierButtons li:nth-child(1),

    .glassButtons li:nth-child(1){     background: #666666; }
   .specifierButtons li:hover,

    .glassButtons li:hover{     background: #333333;
     cursor: pointer; }
   @media screen and (max-width: 500px) {     .specifierButtons li,

      .glassButtons li {       width: 80px; } }
 @media screen and (max-width: 900px) {   .specifierButtons,

    .glassButtons {     position: relative;
     top: initial;
     right: initial; } }
 @media screen and (max-width: 500px) {   .specifierButtons,

      .glassButtons{     position: relative;
     padding: 0;
     margin: 10px 0 0 0;
     top: initial;
     right: initial; }
     .specifierButtons li:nth-child(1),

      .glassButtons li:nth-child(1) {       border: 0; } }
.specifierDetails,

.glassDetails { flex: auto;
 display: flex;
 flex-direction: row;
 flex-wrap: nowrap;
 border: 1px solid #666666;
 padding: 0; }
 @media screen and (max-width: 900px) {   .specifierDetails,

    .glassDetails {     flex-direction: column-reverse; } }
.specifierDetailsLeft,

.glassDetailsLeft { box-sizing: border-box;
 width: 65%;
 padding: 20px; }
 .specifierDetailsLeft h3,

  .glassDetailsLeft h3 {   font-weight: 500;
   margin: 0;
   padding-bottom: 10px;
   padding-top: 20px; }
 .specifierDetailsLeft ul,

  .glassDetailsLeft ul {   margin: 0; }
 .specifierDetailsLeft p,

  .glassDetailsLeft p {   margin: 0; }
 @media screen and (max-width: 900px) {   .specifierDetailsLeft,

    .glassDetailsLeft {     width: 100%; } }
.specifierDetailsRight,

.glassDetailsRight { box-sizing: border-box;
 border-left: 1px solid #666666;
 width: 35%;
 padding: 0 20px 20px 20px;
 text-align: left; }
 .specifierDetailsRight h3,

  .glassDetailsRight h3 {   background: black;
   color: #FFFFFF;
   padding: 10px;
   margin: 0 -20px;
   text-align: center;
   margin-bottom: 30px; }
 @media screen and (max-width: 900px) {   .specifierDetailsRight,

    .glassDetailsRight {     width: 100%;
     border-left: 0;
     border-bottom: 1px solid #666666; } }

/* -- end combined spec and antique --*/
.spFormLabel {
  text-align: left;

  color: #666666;

  margin-bottom: 5px; }

  .spFormLabel span {
    color: red; }

.spFormField {
  width: 100%;

  padding: 10px;

  margin-bottom: 10px; }

.newsHolder {
  position: relative;

  width: 100%;

  height: 250px;

  margin-bottom: 30px;

  border: 1px solid #E5E5E5; }

.newsImage {
  position: absolute;

  display: none;

  top: 0;

  left: 0;

  right: 50%;

  bottom: 0;

  width: 300px;

  background-position: top center;

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -o-background-size: cover;

  background-size: cover; }

  @media screen and (min-width: 750px) {
    .newsImage {
      display: block; } }

  .newsImage:after {
    display: block;

    content: "";

    padding-bottom: 100%; }

.newsTextHolder {
  position: absolute;

  top: 0;

  left: 0;

  right: 0;

  bottom: 0;

  padding: 10px 30px;

  margin-bottom: 0;

  background: #E5E5E5;

  overflow: hidden; }

  @media screen and (min-width: 750px) {
    .newsTextHolder {
      left: 300px; } }

.newsSectionName {
  font-size: 10px;

  text-transform: uppercase;

  color: #000000;

  font-weight: bold; }

.newsHeadline {
  font-size: 20px;

  padding-top: 20px;

  color: #000000;

  font-weight: bold;

  text-transform: uppercase; }

.newsDate {
  font-size: 14px;

  font-style: italic;

  padding-bottom: 20px; }

.newsDiamond {
  position: absolute;

  display: none;

  left: calc(300px - 15px);

  top: 12%;

  width: 30px;

  height: 30px;

  background: #E5E5E5;

  transform: rotate(45deg); }

  @media screen and (min-width: 750px) {
    .newsDiamond {
      display: block; } }

.loginAside {
  position: absolute;

  display: block;

  width: 300px;

  padding-top: 150px;

  padding-left: 30px;

  padding-right: 30px;

  background: #E5E5E5;

  z-index: 100; }

  @media only screen and (max-width: 600px) {
    .loginAside {
      margin: -200px; } }

.loginArticle {
  display: block;

  width: 100%;

  padding-left: 320px; }

  @media only screen and (max-width: 600px) {
    .loginArticle {
      padding-left: 30px; } }

.registrationForm {
  width: 60%;
  border: 1px solid #000000;
  margin: 0 auto; }

.registerTable {
  display: table;
  width: 100%; }

.registerRow {
  display: table-row;
  width: 100%; }

.registerCellLeft {
  display: table-cell;
  width: 30%;
  padding: 10px; }

.registerCellRight {
  display: table-cell;
  width: 70%;
  padding: 10px; }

  .registerCellRight > input {
    width: 100%;

    height: 30px; }

/*--- 28-06-2018 ---*/

.image-contentblock-6 .contentBlocks:last-child {margin-bottom:20px;}

.image-contentblock-6 .textblock span p{display:none;}

.image-contentblock-6 {display: flex;flex-wrap: wrap;justify-content: left;}

.image-contentblock-6 .imageMatrix-container60{-webkit-flex-direction:column;flex-direction:column;float:left;width:15%;word-wrap: break-word; margin-right:10px;}

.image-contentblock-6 .imageMatrix-container60 .imageblock{width:100%;}

.image-contentblock-6 .imageMatrix-container60 .imageblock img{width:100%;height: auto;}

.image-contentblock-6 .imageMatrix-container60 .textblock{padding:20px 20px 0 20px;width:100%;}

.image-contentblock-6 .imageMatrix-container60:hover,.image-contentblock-6 .imageMatrix-container60.active{background:#000000; margin-right:20px;}

.image-contentblock-6 .imageMatrix-container60:hover h2,.image-contentblock-6 .imageMatrix-container60.active h2{color:#ffffff;}

.imageblock .antique-mirror-matrix img {height:250px;}





@media only screen and (max-width:991px){
.image-contentblock-6 .imageMatrix-container60 .textblock span h2{font-size:18px;}
}

@media only screen and (max-width:768px){
  .image-contentblock-6 .imageMatrix-container60 .textblock span h2{font-size:18px;}
}

@media only screen and (max-width:767px){
.image-contentblock-6 .imageMatrix-container60 .textblock span h2{font-size:18px;}
.image-contentblock-6 .imageMatrix-container60 {
    -webkit-flex-direction: column;
    flex-direction: column;
    float: left;
    width: 18%;
}

}

@media only screen and (max-width:668px){
}

@media only screen and (max-width:639px){
  .image-contentblock-6 .imageMatrix-container60 .textblock span h2{font-size:24px;}
  .image-contentblock-6 .imageMatrix-container60{width:100%;margin-bottom:30px;}
}

@media only screen and (max-width:600px){
  .parallax,
  .halfparallax{background-size:cover;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;}
}

@media only screen and (max-width:479px){
  .image-contentblock-6 .imageMatrix-container60{width:100%;margin-bottom:30px;}
}