/* ==========================================================================
Project - SG POOLS

DEPENDENCIES
--------------------------------------------------------------------------
_color.scss
_mixin.scss
_common.scss
_customBootstrap.scss

TABLE OF CONTENT
--------------------------------------------------------------------------
01 Global
02 Layout
03 Header
04 Main Navigation
05 Home Page

08 Footer
================================================== */
body {
  font-size: 12px;
  font-size: 1.2rem; }

.glyphicon-phoneicon {
  background: transparent url("../images/sprite.png") no-repeat 0 0;
  position: absolute;
  height: 50px;
  width: 50px !important;
  top: 50%;
  margin-top: -25px; }
  .glyphicon-phoneicon:before {
    content: ""; }

.glyphicon-login {
  background: transparent url("../images/sprite.png") no-repeat 0 -300px;
  position: absolute;
  height: 50px;
  width: 50px;
  top: 50%;
  margin-top: -25px;
  text-indent: -9999px; }
  .glyphicon-login:before {
    content: ""; }

.desktop-only {
  display: none; }

/**
 * Custom Buttons
 */
.btn-blue,
.btn-orange,
.btn-white,
.btn-red,
.btn-green {
  transition-property: background-color;
  transition-duration: 0.2s;
  transition-timing-function: linear;
  /* Safari */
  -webkit-backface-visibility: hidden;
  -webkit-transition-property: background-color;
  -webkit-transition-duration: 0.2s;
  -webkit-transition-timing-function: linear;
  background: #006aac;
  color: #fff;
  padding: 3px 10px; }
  .btn-blue .glyphicon-play,
  .btn-orange .glyphicon-play,
  .btn-white .glyphicon-play,
  .btn-red .glyphicon-play,
  .btn-green .glyphicon-play {
    top: 0;
    font-size: 10px;
    margin-left: 10px; }
  .btn-blue:hover,
  .btn-orange:hover,
  .btn-white:hover,
  .btn-red:hover,
  .btn-green:hover {
    background: #0092d6;
    color: #fff; }

.btn-orange {
  background: #febd3d;
  color: #000; }
  .btn-orange:hover {
    background: #f58220;
    color: #fff; }

.btn-white {
  background: #fff;
  color: #1e4c7f; }
  .btn-white:hover {
    background: #ccc;
    color: #1e4c7f; }
  .btn-white .glyphicon-play {
    color: #0092d6; }

.btn-red {
  background: #eb0c28;
  color: #fff; }
  .btn-red:hover {
    background: #fe4e6b;
    color: #fff; }

.btn-green {
  background: #0f7940;
  color: #fff; }
  .btn-green:hover {
    background: #77b344;
    color: #fff; }

.btn-cta {
  transition-property: background-color;
  transition-duration: 0.2s;
  transition-timing-function: linear;
  /* Safari */
  -webkit-backface-visibility: hidden;
  -webkit-transition-property: background-color;
  -webkit-transition-duration: 0.2s;
  -webkit-transition-timing-function: linear;
  font-size: 18px;
  font-size: 1.8rem;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
  position: relative;
  border: none;
  color: #1e4c7f;
  font-weight: bold;
  padding: 3px 0 0 10px;
  line-height: 44px;
  width: 100%;
  text-align: left; }
  .btn-cta .glyphicon-play {
    position: absolute;
    color: #888;
    line-height: 40px;
    border-left: 1px solid #006aac;
    font-size: 10px;
    top: 3px;
    right: 0;
    padding: 0 15px 0 15px; }
  .btn-cta:hover {
    background: #ccc; }

/**
 * Tables
 */
.table td .date, .table td .day, .table td .opening-odds, .table td .closing-odds {
  display: block; }
.table td .time {
  color: #999; }
.table > tbody > tr > td {
  border-top: 1px solid #e7e7e7;
  border-right: 1px solid #e7e7e7;
  text-align: center;
  vertical-align: middle; }
  .table > tbody > tr > td:last-child {
    border-right: 0; }
.table > tbody > tr:last-child > td {
  border-bottom: 1px solid #e7e7e7; }
.table > thead > tr > th {
  background: #777;
  color: #f3f3f3;
  text-align: center;
  border-right: 1px solid #e7e7e7; }
  .table > thead > tr > th:last-child {
    border-right: 0; }
.table.orange-header > thead > tr > th {
  background: #f58220; }

.table-striped > tbody > tr:nth-child(odd) > td {
  background-color: #f4f4f4; }

.table-striped > tbody > tr:nth-child(even) > td {
  background-color: #fff; }

.black-row {
  background: #000; }

.thumbnail {
  padding: 0;
  border: 0;
  background: none; }

/* =======================================================================
01 Global
========================================================================== */
.desktop-only {
  display: none; }

a:hover, a:active, a:focus {
  outline: 0; }

a:visited {
  color: #5a2680; }

a:hover {
  text-decoration: underline;
  -webkit-transition: all 0.1s linear;
  -moz-transition: all 0.1s linear;
  -o-transition: all 0.1s linear;
  -ms-transition: all 0.1s linear;
  transition: all 0.1s linear; }

a {
  color: #005e8c; }

button:hover {
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  transition: all 0.2s linear; }
button a {
  color: white; }
  button a:visited {
    color: white; }
  button a:hover {
    text-decoration: none; }
button:focus {
  outline: none; }

input:focus, select:focus {
  outline: 0; }

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
  background: none; }

/* =======================================================================
02 Layout
========================================================================== */
body.snapjs-left {
  overflow: hidden; }

.section-wrapper {
  position: relative; }
  .section-wrapper ul {
    padding: 0;
    margin: 0;
    list-style-type: none; }

.section {
  padding: 10px; }

#content-wrapper {
  background: #ffffff;
  max-width: 1000px;
  margin: auto;
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */
  position: relative; }
  #content-wrapper:before, #content-wrapper:after {
    content: "";
    display: table; }
  #content-wrapper:after {
    clear: both; }

/* =======================================================================
03 Header
========================================================================== */
.header {
  border-top: 2px solid #c00;
  position: fixed;
  width: 100%;
  z-index: 1000;
  background-color: white;
  box-shadow: 0px 1px 0px #ddd;
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */ }
  .header:before, .header:after {
    content: "";
    display: table; }
  .header:after {
    clear: both; }
  .header .branding {
    padding: 0 3%; }
    .header .branding .site_logo {
      float: none;
      margin: 6px 0 0;
      width: 250px;
      padding-bottom: 8px;
      border-bottom: 1px solid; }
      .header .branding .site_logo img {
        height: 45px; }
    .header .branding .site_region {
      margin-bottom: 0; }
      .header .branding .site_region h4 {
        font-size: 1.4em;
        margin-top: 0.5em;
        font-weight: bold; }
    .header .branding .site_search {
      display: none;
      float: none;
      margin: 1.3em 0; }
      .header .branding .site_search #search {
        width: 80%;
        padding: 1.5px 8px; }
      .header .branding .site_search #search_submit {
        border: 0;
        background-color: #aaa;
        color: white;
        width: 18%;
        font-weight: bold;
        padding: 0.3em 0; }
  .header ul {
    padding: 0;
    margin: 0;
    list-style-type: none; }
  .header .quick-nav {
    position: absolute;
    right: 0px;
    top: 2px; }
    .header .quick-nav .search-icn {
      background-image: url("/assets/images/search.png");
      width: 20px;
      height: 20px;
      opacity: 0.6;
      margin-right: 59px;
      position: relative;
      top: 18px; }
    .header .quick-nav .MenuToggle {
      position: absolute;
      top: 0;
      right: 0;
      outline: 0;
      margin: 0 1em;
      border: 0;
      background: 0 0;
      padding: 17px 1rem;
      transition: .1s;
      cursor: pointer;
      user-select: none; }
      .header .quick-nav .MenuToggle.menu-close .lines {
        transition: background .3s 0s ease;
        background: 0 0; }
        .header .quick-nav .MenuToggle.menu-close .lines:before {
          -webkit-transform: rotate3d(0, 0, 1, 45deg);
          transform: rotate3d(0, 0, 1, 45deg);
          transition: top .3s ease,-webkit-transform .3s .5s ease;
          transition: top .3s ease,transform .3s .5s ease;
          top: 0;
          width: 20px; }
        .header .quick-nav .MenuToggle.menu-close .lines:after {
          transition: top .3s ease,-webkit-transform .3s .5s ease;
          transition: top .3s ease,transform .3s .5s ease;
          top: 0;
          width: 20px;
          -webkit-transform: rotate3d(0, 0, 1, -45deg);
          transform: rotate3d(0, 0, 1, -45deg); }
      .header .quick-nav .MenuToggle .lines {
        transition: background .3s .5s ease; }
        .header .quick-nav .MenuToggle .lines:before {
          -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
          transition: top .3s .6s ease,-webkit-transform .1s ease;
          transition: top .3s .6s ease,transform .1s ease;
          top: 6px; }
        .header .quick-nav .MenuToggle .lines:after {
          -webkit-transform-origin: 50% 50%;
          transform-origin: 50% 50%;
          transition: top .3s .6s ease,-webkit-transform .1s ease;
          transition: top .3s .6s ease,transform .1s ease;
          top: -6px; }
    .header .quick-nav .visuallyhidden {
      border: 0;
      clip: rect(0 0 0 0);
      height: 1px;
      margin: -1px;
      overflow: hidden;
      padding: 0;
      position: absolute;
      width: 1px; }
    .header .quick-nav .lines {
      display: inline-block;
      width: 20px;
      height: 3px;
      background: #656565;
      transition: .3s;
      position: relative; }
      .header .quick-nav .lines:before {
        display: inline-block;
        width: 20px;
        height: 3px;
        background: #656565;
        border-radius: .28571rem;
        transition: .3s;
        position: absolute;
        left: 0;
        content: '';
        -webkit-transform-origin: .28571rem center;
        transform-origin: .28571rem center; }
      .header .quick-nav .lines:after {
        display: inline-block;
        width: 20px;
        height: 3px;
        background: #656565;
        border-radius: .28571rem;
        transition: .3s;
        position: absolute;
        left: 0;
        content: '';
        -webkit-transform-origin: .28571rem center;
        transform-origin: .28571rem center; }
  .header .mobile-nav {
    zoom: 1;
    /* For IE 6/7 (trigger hasLayout) */
    display: none;
    width: 100%;
    z-index: 10;
    margin-bottom: 10px; }
    .header .mobile-nav:before, .header .mobile-nav:after {
      content: "";
      display: table; }
    .header .mobile-nav:after {
      clear: both; }
    .header .mobile-nav ul {
      text-align: left;
      height: auto;
      width: 100%; }
      .header .mobile-nav ul li {
        position: relative;
        border-top: 1px solid #ccc;
        background-color: #666;
        color: #ccc; }
        .header .mobile-nav ul li:hover {
          opacity: 0.8; }
        .header .mobile-nav ul li .lvl2 {
          display: none; }
          .header .mobile-nav ul li .lvl2 li {
            background-color: #eee;
            border-top: 1px solid #444; }
        .header .mobile-nav ul li.product {
          background-color: #bbb;
          border-top: 1px solid #666; }
        .header .mobile-nav ul li a {
          text-transform: none;
          width: 100%;
          line-height: 3.5em;
          border-right: 0px;
          padding: 0 7.5%;
          width: 100%;
          font-weight: bold; }
    .header .mobile-nav .close {
      color: white;
      background-color: #444;
      opacity: 1;
      font-size: 1.2em;
      margin-top: 1px;
      padding: 0.2em 0;
      font-weight: 200;
      text-shadow: 0 0 0;
      width: 100%;
      line-height: 1.6; }
  .header .login-icon {
    display: block;
    position: absolute;
    width: 50px;
    height: 100%;
    top: 0;
    right: 0;
    background-color: #1e4c7f; }

.main.primary {
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */
  font-size: 1.2em;
  display: none;
  width: 100%;
  z-index: 10;
  box-shadow: 1px 1px 6px inset; }
  .main.primary:before, .main.primary:after {
    content: "";
    display: table; }
  .main.primary:after {
    clear: both; }
  .main.primary .mobile-only.menu {
    background-color: #aaa; }
    .main.primary .mobile-only.menu a {
      color: #fff; }
  .main.primary ul {
    text-align: left;
    height: auto;
    width: 100%;
    list-style-type: none;
    padding-left: 0;
    margin-bottom: 0; }
    .main.primary ul li {
      position: relative;
      border-top: 1px solid #ccc; }
      .main.primary ul li:hover {
        background-color: #ccc; }
        .main.primary ul li:hover a {
          text-decoration: none; }
      .main.primary ul li:first-child {
        padding-left: 0; }
      .main.primary ul li a {
        text-transform: none;
        width: 100%;
        border-right: 0px;
        padding: 0.8em 7.5%;
        font-weight: bold;
        font-size: 12px;
        color: #333;
        display: block; }
      .main.primary ul li .lvl2 {
        display: none;
        font-size: 0.8em; }
        .main.primary ul li .lvl2 li {
          background-color: #eee;
          border-top: 1px solid #aaa; }
          .main.primary ul li .lvl2 li:hover {
            opacity: 0.5; }
        .main.primary ul li .lvl2:first-child {
          border-top: 1px solid #dddddd; }
  .main.primary .close {
    color: white;
    background-color: #444;
    opacity: 1;
    font-size: 1.2em;
    margin-top: 1px;
    padding: 0.2em 0;
    font-weight: 200;
    text-shadow: 0 0 0;
    width: 100%;
    line-height: 1.6; }

/* =======================================================================
04 Main Navigation
========================================================================== */
.content-body {
  margin-top: 94px;
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */
  position: relative;
  padding-bottom: 35px; 
  width: auto;
overflow-x: auto;
display: block;
}
  .content-body:before, .content-body:after {
    content: "";
    display: table; }
  .content-body:after {
    clear: both; }

/* =======================================================================
05 Homepage
========================================================================== */
/**
 * Homepage Banner
 */
swiper-container
{
    height:auto !important;
}
.swiper-container .swiper-wrapper .swiper-slide a {
  position: relative;
  display: table; }
  .swiper-container .swiper-wrapper .swiper-slide a img {
    width: 100%;
    height: 100%;
  }
.swiper-container .swiper-wrapper .swiper-slide .overlay {
 background-color: rgba(0,0,0,0.8);
  color: white;
  float: none;
  width: auto;
  height: auto;
  padding: 1% 4%; 
    width: 100%;
    position:absolute;
    bottom:0;
    height: 29%;
}
    .swiper-container .swiper-wrapper .swiper-slide .overlay.right
    {
        right:0;
    }

  .swiper-container .swiper-wrapper .swiper-slide .overlay .title {
    font-weight: bold;
    font-size: 0.9em;
    margin: 0 0 3% 0; }
  .swiper-container .swiper-wrapper .swiper-slide .overlay .desc {
      display: none;
    font-size: 1.2em; }
.swiper-container .pagination {
  position: relative;
  left: 45%;
  margin: auto;
  bottom: 20px;
  display: none;
  width: auto; }

.quick-link-options {
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */
  margin: 5px 0; }
  .quick-link-options:before, .quick-link-options:after {
    content: "";
    display: table; }
  .quick-link-options:after {
    clear: both; }
  .quick-link-options a {
    color: #333; }
    .quick-link-options a:hover title {
      text-decoration: underline; }
    .quick-link-options a .option {
      width: 100%;
      height: 100%;
      float: left;
      margin-left: 0;
      margin-top: 1%;
      padding-left: 55px;
      background-color: #c00;
      background-repeat: no-repeat;
      background-position: 2% 50%; }
      .quick-link-options a .option:hover {
        box-shadow: 0 0 10px #ccc;
        transition: 0.1s; }
      .quick-link-options a .option.reg {
        background-image: url("/assets/images/Note.png"); }
      .quick-link-options a .option.inq {
        background-image: url("/assets/images/inquiries.png"); }
      .quick-link-options a .option.dealer {
        background-image: url("/assets/images/Pointer.png"); }
      .quick-link-options a .option .icn {
        width: 55px;
        height: 100%;
        background-color: #cc0000;
        float: left;
        background-repeat: no-repeat;
        background-position: 50%; }
      .quick-link-options a .option .title {
        padding: 0.6em 5.4%;
        font-weight: bold;
        font-size: 1.2em;
        background-color: #eee; }

.products {
  position: relative;
  margin: 15px 0;
  text-align: center; }
  .products .main-title {
    font-weight: bold;
    margin: 15px 5px;
    text-align: left; }
  .products .more {
    width: 99%;
    margin: 10px auto;
    position: relative;
    background-color: #aaa; }
    .products .more:hover {
      background-color: #888; }
  .products .all {
    position: relative;
    right: 0px;
    top: 0px;
    width: 99%;
    margin: auto; 
    color: white;
    text-decoration: none
  }

.see-more {
  border: 0;
  background-color: #cc0000;
  color: white;
  border-radius: 15px;
  font-size: 1.1em;
  padding: 5px 10px;
  font-weight: bold;
  cursor: pointer;
  width: auto;
  box-shadow: 1px 1px 5px -2px #000; }
  .see-more:hover {
    background-color: #aa0000; }

.item-listing {
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */
  margin-bottom: 0px; }
  .item-listing:before, .item-listing:after {
    content: "";
    display: table; }
  .item-listing:after {
    clear: both; }

.item {
  width: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  -webkit-box-shadow: 1px 1px 2px #e6e6e6;
  -moz-box-shadow: 1px 1px 2px #e6e6e6;
  box-shadow: 1px 1px 2px #e6e6e6;
  cursor: default;
  margin-left: 0;
  max-height: 250px;
  margin-bottom: 5px;
  background-color: black; }
  .item .content {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0; }
  .item .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
    top: 0;
    left: 0; }
  .item img {
    display: block;
    position: relative;
    width: auto;
    margin: auto; }
  .item .overlay {
    color: #fff;
    font-size: 1.5em;
    margin: 7%;
    top: 0em;
    font-weight: 800;
    z-index: 999;
    text-align: left;
    margin: 7% 0 2%;
    background-color: rgba(15, 15, 15, 0.5);
    padding: 2% 5%; }
  .item .links {
    font-style: italic;
    font-size: 1.3em;
    position: relative;
    color: #fff;
    padding: 0 11%;
    text-align: left; }
    .item .links li {
      line-height: 1.4;
      list-style-type: none; }
      .item .links li a {
        color: white; }
        .item .links li a:hover {
          color: #faa;
          text-decoration: none; }
  .item .info {
    display: inline-block;
    text-decoration: none;
    padding: 7px 14px;
    background: #000;
    color: #fff;
    text-transform: uppercase;
    -moz-box-shadow: 0 0 0 1px black;
    -webkit-box-shadow: 0 0 0 1px black;
    box-shadow: 0 0 0 1px black; }
    .item .info:hover {
      -moz-box-shadow: 0 0 0 5px black;
      -webkit-box-shadow: 0 0 0 5px black;
      box-shadow: 0 0 0 5px black; }

.item-first img {
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  opacity: 1;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  transition: all 0.2s linear; }
.item-first .overlay {
  -webkit-transform: translateY(140px);
  -moz-transform: translateY(140px);
  -o-transform: translateY(140px);
  -ms-transform: translateY(140px);
  transform: translateY(140px);
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out; }
.item-first .links {
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
  -webkit-transition: all 0.2s linear;
  -moz-transition: all 0.2s linear;
  -o-transition: all 0.2s linear;
  -ms-transition: all 0.2s linear;
  transition: all 0.2s linear; }
.item-first:hover img {
  -webkit-transform: scale(1.1, 1.1);
  -moz-transform: scale(1.1, 1.1);
  -o-transform: scale(1.1, 1.1);
  -ms-transform: scale(1.1, 1.1);
  transform: scale(1.1, 1.1);
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
  opacity: 0.5; }

.item-first a.info {
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  opacity: 0;
  -webkit-transition: all 0.2s ease-in-out;
  -moz-transition: all 0.2s ease-in-out;
  -o-transition: all 0.2s ease-in-out;
  -ms-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out; }

.item-first:hover .overlay,
.item-first:hover ul,
.item-first:hover a.info {
  -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100);
  opacity: 1;
  -webkit-transform: translateY(0px);
  -moz-transform: translateY(0px);
  -o-transform: translateY(0px);
  -ms-transform: translateY(0px);
  transform: translateY(0px); }

.item-first:hover ul {
  -webkit-transition-delay: 0.1s;
  -moz-transition-delay: 0.1s;
  -o-transition-delay: 0.1s;
  -ms-transition-delay: 0.1s;
  transition-delay: 0.1s; }

.item-first:hover a.info {
  -webkit-transition-delay: 0.2s;
  -moz-transition-delay: 0.2s;
  -o-transition-delay: 0.2s;
  -ms-transition-delay: 0.2s;
  transition-delay: 0.2s; }

.calendar-icn {
  background-image: url("/assets/images/calendar.png"); }

.events {
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */
  position: relative;
  margin: 10px 0;
  text-align: center; }
  .events:before, .events:after {
    content: "";
    display: table; }
  .events:after {
    clear: both; }
  .events .main-title {
    font-weight: bold;
    margin: 5px 5px 15px;
    text-align: left; }

  .events .event-listings {
        zoom: 1;
        /* For IE 6/7 (trigger hasLayout) */
        margin-bottom: 0;
        text-align: left; 
  }



    .events .event-listings:before, .events .event-listings:after {
      content: "";
      display: table; }
    .events .event-listings:after {
      clear: both; }

   

    .events .event-listings .event-item {
      width: 100%;
      padding: 2.5%;
      float: left;
      margin-left: 0;
      margin-bottom: 20px; 
      position: relative;
      overflow: hidden;
    }
      .events .event-listings .event-item a {
        color: #333; }
      .events .event-listings .event-item:nth-child(odd) {
        background-color: #eee; }
      .events .event-listings .event-item .date {
        font-size: 1.6em;
        font-weight: bold;
        background-image: url("/assets/images/calendar.png");
        background-repeat: no-repeat;
        line-height: 44px;
        padding-left: 44px; }
      .events .event-listings .event-item .news {
        font-size: 1.6em;
        font-weight: bold;
        background-image: url("/assets/images/news.png");
        background-repeat: no-repeat;
        line-height: 44px;
        padding-left: 44px; }
      .events .event-listings .event-item .title {
        font-weight: bold;
        margin: 10px 0; }
      .events .event-listings .event-item .description {
        display: none; }
      .events .event-listings .event-item .read-more {
        font-weight: bold;
        margin-top: 4%;
        font-size: 1.2em; 
      }
  .events .all {
    position: relative;
    top: 0;
    right: 0px;
    width: 99%; 
    color: white;
    text-decoration: none
  }

/* =======================================================================
 Product Page
========================================================================== */
.top-nav {
  display: none; }

.page-title h1 {
  margin: 15px 2%;
  font-size: 2.2em;
  border-bottom: 1px solid #ccc;
  padding: 0 0 15px;
  font-weight: bold; }
h2 {
  font-size: 2.0em;
  font-weight: bold; 

}

h3 {
  font-size: 1.7em;
  font-weight: bold; 

}

.side-nav {
  display: none; }

.product-list {
  width: auto;
  margin: 0 2%; }
  .product-list .prod-item {
    zoom: 1;
    /* For IE 6/7 (trigger hasLayout) */
    margin-bottom: 30px; }
    .product-list .prod-item:before, .product-list .prod-item:after {
      content: "";
      display: table; }
    .product-list .prod-item:after {
      clear: both; }
    .product-list .prod-item .image {
      float: left;
      width: 25%;
      text-align: center;
      padding: 1em;
      border: 1px solid #ccc; }
      .product-list .prod-item img {
        height: auto;
        max-width: 100%; }
    .product-list .prod-item .details {
      float: left;
      width: 70%;
      margin: 0 2%; }
      /*.product-list .prod-item .details *:empty {
        display: none; }*/
      .product-list .prod-item .details .title {
        font-size: 1.6em;
        font-weight: bold;
        float: none;
        width: 100%;
        margin: 0; }
      .product-list .prod-item .details .desc {
        padding: 14px 0 24px 0;
        border-bottom: 1px solid #ccc; }
  .product-list a:hover {
    text-decoration: none; }
  .product-list .more-info {
    border-radius: 0;
    padding: 0.3em 0.5em;
    margin-top: 13px;
    box-shadow: 1px 1px 7px -2px #000;
    width: auto;
    margin-bottom: 10px;
    position: relative;
    left: 0%;
    bottom: 0;
    text-align: center; }

/* =======================================================================
07 Enquiry/Forms
========================================================================== */
.form-content {
  width: auto;
  margin-bottom: 20px;
  margin: 0 4%;
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */ }
  .form-content:before, .form-content:after {
    content: "";
    display: table; }
  .form-content:after {
    clear: both; }
  .form-content div.title {
    font-size: 20px;
    font-weight: bold;
    padding: 0 0 10px 0; }
  .form-content div.desc {
    font-size: 14px; }
  .form-content .field {
    margin: 25px 1%;
    zoom: 1;
    /* For IE 6/7 (trigger hasLayout) */ }
    .form-content .field:before, .form-content .field:after {
      content: "";
      display: table; }
    .form-content .field:after {
      clear: both; }
    .form-content .field > label, .form-content .scfRadioButtonListLabel, .form-content .scfSectionLegend{
      width: auto;
      font-size: 14px; }
    .form-content .scfRadioButtonListLabel
    {
        font-weight: bold;
    }
      .form-content .field > label.light {
        font-weight: normal;
        font-size: 12px; }
      .form-content .field > label .normal-text {
        font-weight: normal;
        font-size: 12px; }
    .form-content .field.plaintext > label, .form-content .section-noborder .scfSectionBorderAsFieldSet .scfSectionLegend {
      width: 100% !important; }
    .form-content .field .input-panel, .form-content .scfSingleLineGeneralPanel, .form-content .scfEmailGeneralPanel,.form-content .scfTelephoneGeneralPanel,.form-content .scfDropListGeneralPanel ,.form-content .scfMultipleLineGeneralPanel, .form-content .scfRadioButtonListGeneralPanel{
      width: 95%;
      float: left; }
      .form-content .field .input-panel .dropDownList, .form-content .field .scfDropListGeneralPanel .scfDropList {
        width: 100%;
        height: 30px;
        box-shadow: inset 0 1px 3px #ddd;
        border-radius: 4px;
        border: 1px solid #ccc; }
      .form-content .field .input-panel .input-field, .form-content .scfSingleLineGeneralPanel .scfSingleLineTextBox, 
        .form-content .scfEmailGeneralPanel .scfEmailTextBox,.form-content .scfTelephoneGeneralPanel .scfTelephoneTextBox,
        .form-content .scfMultipleLineGeneralPanel .scfMultipleLineTextBox {
        width: 100%;
        height: 30px;
        border: 1px solid #ccc;
        border-radius: 4px;
        box-shadow: inset 0 1px 3px #ddd;
        padding: 5px; }
      .form-content .field .input-panel textarea.input-field, .form-content .scfMultipleLineGeneralPanel .scfMultipleLineTextBox {
        height: 75px; }
      .form-content .field .input-panel .radio-option {
        float: left;
        margin-right: 10%;
        display: inline-block; }
        .form-content .field .input-panel .radio-option .radio-field {
          float: left;
          margin-right: 5px; }
        .form-content .field .input-panel .radio-option label {
          float: left;
          font-weight: normal; }
    .form-content .field.captcha, .form-content .scfCaptchaGeneralPanel  {
      padding-left: 0;
      margin-top: 5px;
      width: 100%;
      margin-bottom: 5px; }
      .form-content .field.captcha .scfCaptchaLimitGeneralPanel {
        width: 210px; }
        .form-content .field.captcha .scfCaptchaLimitGeneralPanel .scfCaptchaTextBox, .form-content .scfCaptchaLimitGeneralPanel .scfCaptchStrongTextPanel .scfCaptchaTextBox {
          width: 100%;
          height: 30px;
          border: 1px solid #ccc;
          border-radius: 4px;
          box-shadow: inset 0 1px 3px #ddd;
          padding: 5px;
          margin-bottom: 10px; }
        .form-content .field.captcha .scfCaptchaLimitGeneralPanel .scfValidator {
          color: #c00;
          display: none; }
      .form-content .field.captcha table, .form-content .scfCaptchaGeneralPanel table {
        border: 1px solid #cbcbcb;
        border-radius: 4px; }
        .form-content .field.captcha table td, .form-content .scfCaptchaGeneralPanel table td {
          border-left: 1px solid #cbcbcb;
          border-width: 0 0 0 1px;
          font-size: inherit;
          margin: 0;
          overflow: visible; }
         .form-content .field.captcha table td input[type="image"], .form-content .scfCaptchaLimitGeneralPanel table td input[type="image"] {
              padding: 7px 8px;
              margin-left: 12px; }
          .form-content .field.captcha table td input[type="image"] {
            margin: 5%;
            margin-left: 10%; }
    .form-content .field.required .error {
      display: none;
      color: #c00;
      padding: 5px 2% 0; }
    .form-content .field.required .symbol, .form-content .scfSectionContent span.scfRequired {
      display: inline !important;
      float: right; }
  .form-content .submission , .form-content .scfSubmitButtonBorder{
    margin-left: 0; }
    .form-content .submission .submit, .form-content .scfSubmitButtonBorder .scfSubmitButton {
      border-radius: 0;
      padding: 0.3em 0.5em;
      margin-top: 13px;
      box-shadow: 1px 1px 7px -2px #000;
      width: 100%;
      margin-bottom: 10px;
      background-color: #c00;
      bordeR: 0;
      color: white;
      padding: 0.3em 7.5em; }
  .form-content .symbol, .form-content .scfSectionContent span.scfRequired {
    display: none;
    color: #c00;
    padding: 1%;
    font-weight: bold;
    font-size: 18px; }
  .form-content .error {
    float: left;
    display: none; }
  .form-content .empty {
    display: none; }
  .form-content .service section {
    margin-top: 50px; }
    .form-content .subsection legend {
      color: #c00; }
  .form-content .general .field .radio-option {
    margin-right: 0%;
    width: 100%; }

    .form-content .section-noborder .scfSectionBorderAsFieldSet, .form-content .section-noborder .scfSectionBorderAsFieldSet .scfSectionLegend
    {
        padding: 0;
        margin: 0;
        border: none;

    }

.form-content .scfSectionBorderAsFieldSet, .form-content .scfSectionContent
{
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.scfCaptcha img
{
    border: none !important;
}

.form-content .scfRadioButtonList label {
            font-weight: normal; 
            position: relative;
            bottom: 3px;
            padding-left: 5px;
          }
.form-content .scfCaptchStrongTextPanel .scfValidator
{
    width: 100%;
}

span.scfCaptchaLabel
{
    display:none;
}

/* =======================================================================
08 Product-Detail
========================================================================== */
.product-detail {
  width: auto; }
  .product-detail .prod-item .image {
    float: left;
    width: 25%;
    max-height: 150px;
    text-align: center;
    padding: 1em; }
    .product-detail .prod-item .image img {
      width: auto; }
  .product-detail .prod-item .details {
    float: right;
    width: 70%;
    margin: 0 2%; }
    .product-detail .prod-item .details .quick-link-options a .option {
      background-position: 4% 50%; }
      .product-detail .prod-item .details .quick-link-options a .option .title {
        font-size: 14px;
        padding: 12px 5.4%; }
    .product-detail .prod-item .details .title {
      font-size: 1.4em; }
    .product-detail .prod-item .details .cta {
      float: left;
      background-color: #5F605A;
      width: 100%; }
      .product-detail .prod-item .details .cta:hover {
        background-color: #c00; }
  .product-detail .ui-tabs .ui-tabs-nav {
    background: none;
    border: none; }
    .product-detail .ui-tabs .ui-tabs-nav .ui-tabs-anchor {
      font-size: 14px;
      font-weight: bold;
      padding: 0.6em 2em; }
    .product-detail .ui-tabs .ui-tabs-nav li {
      background-color: #EAEAEA; }
      .product-detail .ui-tabs .ui-tabs-nav li.ui-tabs-active {
          background: none;
        background-color: #5F605A;
        color: white; }
        .product-detail .ui-tabs .ui-tabs-nav li.ui-tabs-active a {
          color: white; }
  .product-detail .accordion, .product-detail .tabs {
    border: 0;
    margin-bottom: 10px;
    margin-right: 1%; }
    .product-detail .accordion h3, .product-detail .tabs h3 {
      background-color: #EAEAEA;
      color: #333;
      padding: 10px;
      font-size: 16px;
      font-weight: bold;
      margin: 0;
      cursor: pointer;
      background-image: url("/assets/images/chevron-down-dark.png");
      background-repeat: no-repeat;
      background-position: 97% 50%;
      transition: 1s; }
      .product-detail .accordion h3.active, .product-detail .tabs h3.active {
        background-color: #5F605A;
        color: #fff;
        transition: 1s;
        background-image: url("/assets/images/chevron-up-light.png"); }
    .product-detail .accordion .description, .product-detail .tabs .description {
      display: none;
      border: 1px solid #ccc;
      padding: 10px 2%; }
      .product-detail .accordion .description ul li a, .product-detail .tabs .description ul li a {
        color: #333; }
        .product-detail .accordion .description ul li a:hover, .product-detail .tabs .description ul li a:hover {
          color: #333; }
      .product-detail .accordion .description table, .product-detail .tabs .description table {
        border: 1px solid;
        margin-bottom: 20px; }
        .product-detail .accordion .description table td, .product-detail .tabs .description table td {
          padding: 10px; }
      .product-detail .accordion .description h4, .product-detail .tabs .description h4 {
        margin-top: 0; }
      .product-detail .accordion .description span.bold-text, .product-detail .tabs .description span.bold-text {
        font-weight: bold;
        font-size: 14px; }
      .product-detail .accordion .description .badges, .product-detail .tabs .description .badges {
        zoom: 1;
        /* For IE 6/7 (trigger hasLayout) */
        margin-left: 3%;
        margin-bottom: 20px; }
        .product-detail .accordion .description .badges:before, .product-detail .accordion .description .badges:after, .product-detail .tabs .description .badges:before, .product-detail .tabs .description .badges:after {
          content: "";
          display: table; }
        .product-detail .accordion .description .badges:after, .product-detail .tabs .description .badges:after {
          clear: both; }
        .product-detail .accordion .description .badges img, .product-detail .tabs .description .badges img {
          float: left;
          height: 31px; }
    .product-detail .accordion img, .product-detail .tabs img {
      max-width: 100%; 
      height: auto !important
    }

.refrigerator .accordion img, .refrigerator .tabs img {
  width: 40%;
  float: left; }
.refrigerator .accordion p:after, .refrigerator .tabs p:after {
  clear: both;
  display: table;
  content: ""; }

/* =======================================================================
09 Events
========================================================================== */
.inpage-search {
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */
  width: 100%;
  margin: 0;
  margin-bottom: 20px;
  padding: 2%;
  background: #eee; }
  .inpage-search:before, .inpage-search:after {
    content: "";
    display: table; }
  .inpage-search:after {
    clear: both; }
  .inpage-search input, .inpage-search select {
    height: 30px;
    box-shadow: inset 0 1px 3px #ddd;
    border-radius: 4px;
    border: 1px solid #ccc;
    padding: 0 10px; }
  .inpage-search label {
    margin-right: 4%; }
  .inpage-search .search-options {
    float: left;
    width: 100%;
    margin-right: 2%;
    margin-bottom: 10px; }
    .inpage-search .search-options .by-content {
      position: relative;
      display: block; }
      .inpage-search .search-options .by-content input {
        width: 100%; }
    .inpage-search .search-options .by-date {
      position: relative;
      display: none;
      zoom: 1;
      /* For IE 6/7 (trigger hasLayout) */ }
      .inpage-search .search-options .by-date:before, .inpage-search .search-options .by-date:after {
        content: "";
        display: table; }
      .inpage-search .search-options .by-date:after {
        clear: both; }
      .inpage-search .search-options .by-date .from-fields {
        float: left;
        width: 100%;
        margin-bottom: 10px; }
        .inpage-search .search-options .by-date .from-fields input {
          width: 100%; }
      .inpage-search .search-options .by-date .to-fields {
        float: left;
        width: 100%; }
        .inpage-search .search-options .by-date .to-fields input {
          width: 100%; }
  .inpage-search .search-by {
    width: 100%;
    margin-right: 2%;
    margin-bottom: 10px;
    clear: both; }
    .inpage-search .search-by select {
      width: 100%; }
  .inpage-search .submit-button {
    width: 100%; }
    .inpage-search .submit-button button {
      width: 100%;
      background-color: #5F605A;
      color: white;
      border: 0;
      line-height: 26px;
      font-weight: bold;
      box-shadow: 1px 1px 7px -2px #000; }

.event-list {
  width: auto;
  margin: 0 2%; }
  .event-list .top-desc {
    font-size: 1.4em;
    font-style: italic;
    margin-bottom: 30px; }
  .event-list .event-item {
    zoom: 1;
    /* For IE 6/7 (trigger hasLayout) */
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee; }
    .event-list .event-item:before, .event-list .event-item:after {
      content: "";
      display: table; }
    .event-list .event-item:after {
      clear: both; }
    .event-list .event-item .image {
      float: left;
      width: 25%;
      margin-right: 1%; }
      .event-list .event-item .image img {
        width: 100%; }
    .event-list .event-item .details {
      float: left;
      width: 70%;
      margin: 0 2%; }
      .event-list .event-item .details .title {
        font-size: 1.4em;
        float: none;
        width: 100%;
        margin: 0; }
        .event-list .event-item .details .title a {
          color: black; }
      .event-list .event-item .details .date {
        font-style: italic;
        font-weight: bold;
        color: #999; }
      .event-list .event-item .details .desc {
        padding: 5px 0; }
  .event-list .more-info {
    border-radius: 0;
    padding: 0.3em 0.5em;
    margin-top: 13px;
    box-shadow: 1px 1px 7px -2px #000;
    width: auto;
    margin-bottom: 10px;
    position: relative;
    left: 0%;
    bottom: 0; }
  .event-list.news-list .event-item .details {
    width: auto; }
    .event-list.news-list .event-item .details .title {
      font-size: 1.4em; }
  .event-list.employee-eng .event-item .image {
    width: 23%; }
  .event-list.employee-eng .event-item .details .title {
    font-size: 1.4em; }

.pagination {
  display: inline-block;
  padding-left: 0;
  width: 100%; }
  .pagination > li a, .pagination > li span {
    position: relative;
    float: left;
    padding: 6px 6px;
    margin-right: 1%;
    line-height: 1.428571429;
    color: #005e8c;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #fcc;
    border-radius: 0 !important; }
    .pagination > li a:hover, .pagination > li span:hover {
      border: 1px solid #c00;
      background-color: #fff; }

.icn2 {
  width: 20px;
  height: 20px;
  display: inline-block;
  background-repeat: no-repeat;
  margin-left: 2px; }

.external-icn {
  background-image: url("/assets/images/external.png"); }

.pdf-icn {
  background-image: url("/assets/images/icon_pdf.jpg"); }

/* =======================================================================
10 Footer
========================================================================== */
.footer {
  zoom: 1;
  /* For IE 6/7 (trigger hasLayout) */
  font-size: 12px;
  clear: both;
  position: relative;
  border-top: 0;
  margin-top: 10px;
  padding-top: 10px;
  background-color: #eee;
  padding: 10px; }
  .footer:before, .footer:after {
    content: "";
    display: table; }
  .footer:after {
    clear: both; }
  .footer .links {
    list-style-type: none;
    padding: 0; }
    .footer .links li {
      padding: 0 1%;
      position: relative;
      background-repeat: no-repeat; }
      .footer .links li a {
        color: #333; }
      .footer .links li:first-child {
        border: 0; 
        padding-right: 20px;
      }
  .footer .left-links {
    margin-bottom: 10px; }
    .footer .left-links:after {
      content: "";
      display: table;
      clear: both; }
  .footer .icn2 {
    padding-left: 20px;
    background-repeat: no-repeat;
    width: auto;
    margin-left: 0; }
  .footer .global-icn {
    background-image: url("/assets/images/external.png");
    background-position: 107px; }
  .footer .screen-icn {
    background-image: url("/assets/images/screen.png");
    background-position: 72px; }

.article-content {
  float: none;
  margin: 3%; }
  .article-content img {
    max-width: 100%;
    height: auto !important;
    padding: 1%; }
  .article-content ul {
    padding-left: 22px; }
    .article-content ul li {
      padding: 5px; }
  .article-content h3 {
    margin-top: 0; }
  .article-content p {
    line-height: 20px; }
  .article-content.careers {
    font-size: 13px; }
    .article-content.careers .job-listing ul {
      list-style-type: none; }
    .article-content.careers .job-listing {
      font-weight: bold; }
    .article-content.careers .job-details .job-item {
      margin-bottom: 35px; }
  .article-content.location h3 {
    font-size: 16px;
    font-weight: bold; }
  .article-content.location .color {
    display: block;
    padding: 0 0 0 15px;
    background-repeat: no-repeat;
    background-position: left 5px; }
    .article-content.location .color.color1 {
      background-image: url("/assets/images/color1.gif"); }
    .article-content.location .color.color2 {
      background-image: url("/assets/images/color2.gif"); }
    .article-content.location .color.color3 {
      background-image: url("/assets/images/color3.gif"); }
    .article-content.location .color.color4 {
      background-image: url("/assets/images/color4.gif"); }
    .article-content.location .color.color5 {
      background-image: url("/assets/images/color5.gif"); }
#map-canvas img[src*="gstatic.com/"], img[src*="googleapis.com/"]
{
    max-width: none;
}

#map-canvas {
  height: 350px;
  width: 100%;
  margin-bottom: 20px; }

.back-to-top {
  background-image: url("/assets/images/backtotop.png");
  background-repeat: no-repeat;
  content: "";
  position: relative;
  right: 1%;
  bottom: 0;
  width: 30px;
  height: 30px;
  position: absolute;
  background-color: white;
  background-position: 30%;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: inset 0 1px 3px #ddd; }

/* =======================================================================
08 Print
========================================================================== */
@media print {
  a:link:after {
    content: ""; }

  .banner-img {
    width: 670px; }

  .quick-nav {
    display: none; }

  .quick-link-options {
    display: none; }

  .products button {
    display: none; }
  .products .item-listing {
    display: block !important; }
    .products .item-listing:nth-child(2) {
      page-break-after: always; }
    .products .item-listing .item {
      width: 24%;
      margin-right: 1%;
      max-height: none; }
      .products .item-listing .item .mask {
        position: relative; }
        .products .item-listing .item .mask .links {
          opacity: 1; }
        .products .item-listing .item .mask .overlay {
          -webkit-transform: translateY(5px);
          -moz-transform: translateY(5px);
          -o-transform: translateY(5px);
          -ms-transform: translateY(5px);
          transform: translateY(5px); }

  .events button {
    display: none; }
  .events .event-listings .event-item {
    padding: 0 0 0 1%;
    float: left;
    width: 23.5%; }
    .events .event-listings .event-item .news {
      padding-left: 0; }
    .events .event-listings .event-item .date {
      padding-left: 0; }

  .footer {
    zoom: 1;
    /* For IE 6/7 (trigger hasLayout) */
    clear: both;
    position: relative;
    border-top: 1px solid #ddd;
    padding: 10px 0 0;
    background-color: #fff; }
    .footer:before, .footer:after {
      content: "";
      display: table; }
    .footer:after {
      clear: both; }
    .footer .links {
      list-style-type: none;
      display: table;
      padding: 0;
      width: 100%; }
      .footer .links li {
        display: inline-block;
        border-left: 1px solid #999;
        padding: 0 1%;
        float: none;
        height: 1.5em; }
        .footer .links li:first-child {
          padding-left: 0px; }
    .footer .left-links {
      float: left;
      width: 61%;
      margin-bottom: 0; }
    .footer .right-links {
      float: right;
      width: 233px; }
    .footer .icn2 {
      width: auto;
      padding-right: 20px !important;
      background-repeat: no-repeat;
      background-position: right; } }

/* =======================================================================
09 GoogleMap
========================================================================== */