/* Used for :hover aka rollover on linked elements */
/**		Background Theme	**/
/* Used for :hover aka rollover on linked elements */
/**		Background Colour	   **/
body {
  background: #D0D3D4; }

/**		Dark Navigation & Menu & Frame	**/
/* Used for :hover aka rollover on linked elements */
/**		Dark Navigation & Menu & Frame	**/
.logo-light {
  display: none; }

.logo-dark {
  display: block; }

.nav-mobile__container {
  background-color: rgba(255, 255, 255, 0.8); }

.frame__bottom,
.frame__left-right {
  background: #333F48; }

.menu-corner, .nav-mobile__spacer-item {
  background-color: #333F48; }

.nav-desktop__menu-item h3, #menu-toggle h2 {
  color: #333F48; }

/**		.Granite Text Colouring	   **/
.layout-wrapper h1, .layout-wrapper h2, .layout-wrapper h3, .layout-wrapper h4, .layout-wrapper h5, .layout-wrapper h6, .layout-wrapper p {
  color: #333F48; }

a:hover p {
  color: rgba(51, 63, 72, 0.7); }

footer a:hover h2, footer a:hover h3, footer a:hover h4, footer a:hover h5, footer a:hover p {
  color: #D0D3D4; }

/**		Page Header		**/
/* Used for :hover aka rollover on linked elements */
/**		 Styling for Page Header with About and Products buttons  	**/
.page-header-brands__spacer {
  padding-top: 50px;
  padding-bottom: 10px; }
  @media screen and (min-width: 720px) {
    .page-header-brands__spacer {
      padding-top: 100px;
      padding-bottom: 30px; } }

.page-header-brands__logo {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: flex-start; }
  .page-header-brands__logo img {
    margin-top: 50px;
    margin-bottom: 20px;
    width: 100%;
    height: auto; }
    @media screen and (min-width: 720px) {
      .page-header-brands__logo img {
        width: auto;
        height: 100%; } }

.page-header-brands__buttons {
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
  align-items: center; }
  @media screen and (min-width: 550px) {
    .page-header-brands__buttons {
      justify-content: center; } }

.page-header-brands__buttons-item {
  border: solid 2px #FFFFFF;
  width: 49%;
  height: 30px; }
  .page-header-brands__buttons-item p {
    margin: 0;
    color: #FFFFFF; }
  .page-header-brands__buttons-item a {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center; }
  @media screen and (min-width: 550px) {
    .page-header-brands__buttons-item {
      width: 120px; } }
  @media screen and (min-width: 720px) {
    .page-header-brands__buttons-item {
      width: 120px; } }
  @media screen and (min-width: 1280px) {
    .page-header-brands__buttons-item {
      width: 150px; } }

.page-header-brands__buttons-item:last-child {
  margin-left: 5px; }
  @media screen and (min-width: 720px) {
    .page-header-brands__buttons-item:last-child {
      margin-left: 10px; } }
  @media screen and (min-width: 1280px) {
    .page-header-brands__buttons-item:last-child {
      margin-left: 15px; } }

.page-header-brands__buttons-item:hover {
  background-color: #FFFFFF; }
  .page-header-brands__buttons-item:hover p {
    color: #333F48; }

/* Set About to 'Active'/'Selected' */
.button-left {
  background-color: #FFFFFF; }
  .button-left p {
    color: #333F48; }

/**		Pad between Footer & Content		**/
.layout-wrapper {
  padding-bottom: 30px; }

/**		Content styling		**/
#product-compare__wrapper {
  background: #FFFFFF;
  margin-top: 30px 10px;
  display: flex; }
  #product-compare__wrapper .product-compare__content tr {
    margin: 0px 5px; }
    @media screen and (min-width: 720px) {
      #product-compare__wrapper .product-compare__content tr {
        margin: 0px 10px; } }

.product-compare {
  flex-grow: 1;
  flex-shrink: 1;
  flex-basis: 1000px; }
  .product-compare > div {
    border-top: solid 1px #47525a; }

tr:nth-of-type(odd) {
  background-color: #D0D3D4; }

td:first-child {
  padding-left: 2px; }

table {
  border-collapse: collapse; }

.order_2 {
  display: none; }

.order_3 {
  display: none; }

.order_4 {
  display: none; }

@media screen and (min-width: 550px) {
  .order_2 {
    display: block; } }
@media screen and (min-width: 720px) {
  .order_3 {
    display: block; } }
@media screen and (min-width: 1280px) {
  .order_4 {
    display: block; } }
.product-compare__image {
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center; }
  @media screen and (min-width: 720px) {
    .product-compare__image {
      justify-content: flex-start; } }

.product-compare__image,
.product-compare__image img {
  height: 150px; }
  @media screen and (min-width: 550px) {
    .product-compare__image,
    .product-compare__image img {
      height: 170px; } }
  @media screen and (min-width: 720px) {
    .product-compare__image,
    .product-compare__image img {
      height: 190px; } }
  @media screen and (min-width: 960px) {
    .product-compare__image,
    .product-compare__image img {
      height: 210px; } }
  @media screen and (min-width: 1280px) {
    .product-compare__image,
    .product-compare__image img {
      height: 240px; } }

.product-compare__text {
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 0 5px;
  text-align: center;
  height: 120px; }
  .product-compare__text h3, .product-compare__text h5 {
    margin: 10px 0 0 0; }
    @media screen and (min-width: 720px) {
      .product-compare__text h3, .product-compare__text h5 {
        margin: 20px 0 0 0; } }
  @media screen and (min-width: 550px) {
    .product-compare__text {
      height: 130px; } }
  @media screen and (min-width: 720px) {
    .product-compare__text {
      height: 140px;
      text-align: left; } }
  @media screen and (min-width: 960px) {
    .product-compare__text {
      height: 140px; } }
  @media screen and (min-width: 1280px) {
    .product-compare__text {
      height: 160px; } }
  @media screen and (min-width: 1920px) {
    .product-compare__text {
      height: 180px; } }

.product-compare__button {
  padding: 5px 0; }

.product-compare__content p {
  margin: 0 10px 40px 10px; }

.compare {
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 50;
  cursor: pointer; }
  @media screen and (min-width: 720px) {
    .compare {
      justify-content: flex-start; } }
  .compare p {
    margin: 0; }
  .compare img {
    width: 20px;
    margin: 10px; }
  .compare .compare-on-icon {
    display: none; }
  .compare .compare-off-icon {
    display: block; }

.compare-on .compare-on-icon {
  display: block; }
.compare-on .compare-off-icon {
  display: none; }

/*# sourceMappingURL=compare-page.css.map */