/*****************************************************
    Site: SITE_NAME
    Implemented by: YOUR_NAME (ASSOC)
    Date Implemented: 29-01-2016
    
    Table of Contents
    1. Fonts, Variables and Misins
    2. Global Styling and Helpers
    3. Header
    4. Menu
    5. Content
    6. Sidebar
    7. Footer
    8. Misc
    9. Responsive area
        9.1 min-width 768px
            768.1 Header
            768.2 Menu
            768.3 Content
            768.4 Sidebar
            768.5 Footer
            768.6 Misc
        9.2 min-width 992px
            992.1 Header
            992.2 Menu
            992.3 Content
            992.4 Sidebar
            992.5 Footer
            992.6 Misc
        9.3 min-width 1200px
            1200.1 Header
            1200.2 Menu
            1200.3 Content
            1200.4 Sidebar
            1200.5 Footer
            1200.6 Misc
******************************************************/
/*****************************************************
    1. Fonts, Variables and Mixins
******************************************************/
@import url(https://fonts.googleapis.com/css?family=Lato);
@font-face {
  font-family: 'ProximaNova-Bold';
  src: url("../fonts/ProximaNova-Bold.eot?#iefix") format("embedded-opentype"), url("../fonts/ProximaNova-Bold.woff") format("woff"), url("../fonts/ProximaNova-Bold.ttf") format("truetype"), url("../fonts/ProximaNova-Bold.svg#ProximaNova-Bold") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'ProximaNova-Regular';
  src: url("../fonts/ProximaNova-Regular.eot?#iefix") format("embedded-opentype"), url("../fonts/ProximaNova-Regular.woff") format("woff"), url("../fonts/ProximaNova-Regular.ttf") format("truetype"), url("../fonts/ProximaNova-Regular.svg#ProximaNova-Regular") format("svg");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'ProximaNova-Semibold';
  src: url("../fonts/ProximaNova-Semibold.eot?#iefix") format("embedded-opentype"), url("../fonts/ProximaNova-Semibold.woff") format("woff"), url("../fonts/ProximaNova-Semibold.ttf") format("truetype"), url("../fonts/ProximaNova-Semibold.svg#ProximaNova-Semibold") format("svg");
  font-weight: normal;
  font-style: normal; }
/*****************************************************
    2. Global Styling and Helpers
******************************************************/
body {
  color: #424242;
  font-family: "ProximaNova-Regular", Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  margin: 0;
  padding: 0; }

h1, h2, h3, h4, h5 {
  font-family: "ProximaNova-Bold", "Arial Black", Gadget, sans-serif; }

h5 {
  font-size: 1em; }

p {
  margin: 0 0 15px; }

a:hover {
  opacity: .8; }

a:hover, a:active {
  text-decoration: none; }

img {
  height: auto;
  max-width: 100%; }

.outer-wrapper {
  overflow: hidden; }

.animate-300, .animate-300::before, .animate-300::after {
  -webkit-transition: all 300ms ease-in-out;
  -moz-transition: all 300ms ease-in-out;
  transition: all 300ms ease-in-out; }

/*****************************************************
    3. Header
******************************************************/
.slogan {
  background: #424242;
  padding: 15px; }
.slogan p {
  color: #fff;
  letter-spacing: 2px;
  margin: 0;
  text-align: center;
  text-transform: uppercase; }

header {
  text-align: center; }
header .header__logo {
  padding: 15px 0; }
header .header__logo span {
  color: #f58220;
  font-family: "ProximaNova-Bold", "Arial Black", Gadget, sans-serif;
  font-size: 0.875em; }
header .header__details {
  padding: 45px 0 30px; }

.header__phone p {
  line-height: 1;
  margin: 0 0 5px; }
.header__phone p a {
  color: #f58220;
  font-family: "ProximaNova-Bold", "Arial Black", Gadget, sans-serif;
  font-size: 2em; }

.header__email p {
  line-height: 1;
  margin: 0 0 5px; }
.header__email p a {
  color: #424242;
  font-size: 1em; }

.sprite__icon {
  background: url("../img/sprite.png");
  display: inline-block;
  margin: 0 5px;
  width: 40px; }

.sprite__icon--facebook {
  background-position: 0 0;
  height: 39px; }

.sprite__icon--20th-annniv {
  background-position: 0 -50px;
  height: 49px; }

.sprite__icon--WA {
  background-position: 0 -100px;
  height: 49px; }

.home-banner__wrapper {
  background: url("../img/bg-orange-pattern.jpg") right bottom no-repeat;
  background-size: cover;
  margin-bottom: 30px;
  margin-left: -15px;
  margin-right: -15px; }
.home-banner__wrapper img {
  width: 100%; }

.title {
  background: url("../img/bg-orange-pattern.jpg") right bottom no-repeat;
  background-size: cover;
  margin-bottom: 15px; }
.title h3 {
  color: #fff;
  font-size: 1.625em;
  text-transform: uppercase; }
.title h4 {
  color: #000;
  font-size: 1em; }
.title .title__content {
  padding: 33px 0;
  text-align: center;
  margin: 0 0 30px; }

/*****************************************************
    4. Menu
******************************************************/
.main-menu, .slicknav_menu {
  background: #424242;
  display: none;
  padding: 15px;
  text-align: center; }
.main-menu ul, .slicknav_menu ul {
  margin: 0;
  padding: 0; }
.main-menu li, .slicknav_menu li {
  padding: 5px; }
.main-menu li a, .slicknav_menu li a {
  color: #fff;
  text-transform: uppercase; }
.main-menu li a:hover, .slicknav_menu li a:hover {
  opacity: .5; }

.main-menu--front-page {
  margin-bottom: 30px; }

.slicknav_menu {
  background: #fff;
  display: block; }
.slicknav_menu li a {
  color: #424242; }

/*****************************************************
    5. Content
******************************************************/
/* Main Content */
.content {
  padding-bottom: 30px; }

/* Inner Pages */
.content__banner {
  margin: 0 -15px 15px; }

.main-content {
  line-height: 1.5; }
.main-content h2 {
  color: #f58220;
  font-size: 1.625em;
  margin: 0 0 30px; }
.main-content h4 {
  font-family: "ProximaNova-Regular", Arial, Helvetica, sans-serif;
  font-size: 1.313em; }

.sub-items {
  padding: 30px 0; }

.sub-items__item {
  text-align: center;
  margin: 0 0 30px; }
.sub-items__item h3 {
  font-size: 1em;
  margin: 0 0 15px; }

.sub-items__img {
  margin: 0 0 15px;
  text-align: center; }

/* Contact Details */
.contact__header-wrapper {
  padding: 30px 15px 15px; }

.contact__details {
  margin: 0 0 30px; }
.contact__details .contact__icon {
  float: left; }
.contact__details p {
  margin: 0 0 0 30px; }
.contact__details p span {
  display: inline-block;
  min-width: 70px; }
.contact__details a {
  color: #424242; }

/* Products */
.products__item {
  margin: 0 0 30px; }
.products__item img {
  border: 1px solid #e2e2e2;
  border-top: 0;
  width: 100%;
  -webkit-border-radius: 0 0 3px 3px;
  -moz-border-radius: 0 0 3px 3px;
  border-radius: 0 0 3px 3px; }

.products__title {
  background: #f58220;
  color: #fff;
  margin: 0;
  padding: 15px;
  text-align: center;
  text-transform: uppercase;
  -webkit-border-radius: 3px 3px 0 0;
  -moz-border-radius: 3px 3px 0 0;
  border-radius: 3px 3px 0 0; }
.products__title h3 {
  font-size: 1em;
  margin: 0;
  padding: 0; }
.products__title a {
  color: #fff; }

.products__thumbnail {
  border-bottom: 1px solid #e2e2e2;
  border-left: 1px solid #e2e2e2;
  border-right: 1px solid #e2e2e2; }

.products__thumbnail-wrapper {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  padding: 0;
  margin: 1px; }
.products__thumbnail-wrapper img {
  height: auto;
  width: 100%;
  opacity: 0; }
.products__thumbnail-wrapper img:hover {
  opacity: 0.2; }

.search__results {
  margin-top: 0;
  margin-bottom: 20px;
  margin-left: 15px; }

.search__products {
  line-height: 1.5em; }
.search__products img {
  border: none; }

/* Contact Us */
.contact__gmap {
  margin: 0 -15px 15px; }
.contact__gmap iframe {
  border: 0;
  height: 300px;
  width: 100%; }

.contact__list {
  margin: 0 0 30px; }

.contact__entry {
  margin: 0 0 15px; }
.contact__entry a {
  color: #424242; }

/* Services */
.services-list {
  padding: 30px 0; }

.services-list__item {
  margin: 0 0 30px;
  text-align: center; }
.services-list__item h3 {
  color: #f58220;
  font-size: 1.625em;
  margin-top: 0; }

.services-list__img {
  text-align: center; }
.services-list__img img {
  margin-bottom: 15px;
  max-height: 180px; }

/* Product */
.product__images {
  margin: 0 0 30px; }
.product__images a {
  display: block; }

.product__thumbnails-wrapper {
  background-color: #fff;
  background-position: center center;
  background-size: contain;
  background-repeat: no-repeat;
  border: 3px solid #fff;
  overflow: hidden;
  margin: 15px 0;
  padding: 0;
  text-align: center;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }
.product__thumbnails-wrapper img {
  height: auto;
  opacity: 0.2;
  width: 100%; }

.product__thumbnails-wrapper:hover {
  border-color: #f58220; }
.product__thumbnails-wrapper:hover img {
  opacity: 0; }

.product__main-image a {
  position: relative; }
.product__main-image span {
  color: #000;
  font-size: 107px;
  opacity: .1;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

.product__main-image-wrapper {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-color: #fff; }
.product__main-image-wrapper img {
  width: 100%;
  height: 100%;
  opacity: 0; }

.product__text {
  margin: 30px 0; }

.product__pdf-wrapper {
  border-top: 1px solid #e2e2e2;
  padding: 15px 0; }

.product__pdf {
  margin: 15px 0; }
.product__pdf a {
  background: url("../img/sprite.png") 15px -185px #f58220;
  color: #fff;
  display: inline-block;
  font-family: "ProximaNova-Bold", "Arial Black", Gadget, sans-serif;
  padding: 20px 15px 20px 50px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }

/* Technical */
.technical__pdfs {
  padding: 30px 0; }

.technical__pdf {
  margin-bottom: 30px; }
.technical__pdf h2 {
  color: #000;
  margin-bottom: 15px; }

.technical__links a {
  color: #f58220; }

.orange-button {
  display: block;
  margin-bottom: 15px;
  margin-right: 15px; }
.orange-button a {
  color: #fff;
  font-family: "ProximaNova-Bold", "Arial Black", Gadget, sans-serif;
  background: #f58220;
  padding: 10px 30px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }

.big-ico {
  background: url("../img/sprite.png") no-repeat;
  display: inline-block;
  width: 70px;
  height: 75px; }

.big-ico-pdf {
  background-position: 0 -250px; }

/*****************************************************
    6. Sidebar
******************************************************/
/* Search */
.sidebar {
  padding-bottom: 30px; }

.search-wrapper {
  background: #f58220;
  padding: 10px;
  position: relative;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }
.search-wrapper input {
  border: none;
  font-size: 0.875em;
  padding: 10px 10px 10px 30px;
  width: 100%;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px; }
.search-wrapper span {
  left: 20px;
  top: 20px;
  position: absolute; }

.sidebar__menu h3 {
  background: #f58220;
  color: #fff;
  margin-bottom: 0;
  padding: 15px;
  text-align: center;
  text-transform: uppercase;
  -webkit-border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  border-radius: 5px 5px 0 0; }
.sidebar__menu ul {
  margin: 0;
  padding: 0; }
.sidebar__menu li {
  list-style-type: none;
  position: relative; }
.sidebar__menu li a {
  background: #f5f7f8;
  border-bottom: 1px solid #fff;
  color: #424242;
  cursor: pointer;
  display: block;
  font-family: "ProximaNova-Semibold", Arial, Helvetica, sans-serif;
  max-height: 64px;
  overflow: hidden;
  padding: 10px 30px; }
.sidebar__menu li a span {
  color: #e2e2e2;
  font-size: 0.875em;
  position: absolute;
  right: 15px;
  top: 15px; }
.sidebar__menu li:hover > a {
  background: #fff;
  border-bottom: 1px solid #e2e2e2;
  box-shadow: -2px 1px 2px #888; }

.sidebar__submenu {
  padding: 15px 30px; }
.sidebar__submenu h4 {
  color: #f58220;
  display: none;
  font-family: "ProximaNova-Semibold", Arial, Helvetica, sans-serif;
  font-size: 1em; }
.sidebar__submenu li {
  border: 0; }
.sidebar__submenu li a {
  background: none;
  border: 0;
  font-family: "ProximaNova-Regular", Arial, Helvetica, sans-serif;
  font-size: 0.875em;
  padding: 0 15px 15px; }
.sidebar__submenu li a:hover {
  background: none;
  border: 0;
  box-shadow: none; }

/*****************************************************
    7. Footer
******************************************************/
footer {
  background: #424242;
  color: #fff;
  font-size: 0.875em;
  padding: 30px 0;
  text-align: center; }
footer a, footer a:hover {
  color: #fff; }

.footer__menu {
  padding: 30px 0; }
.footer__menu ul {
  padding: 0;
  margin: 0; }
.footer__menu li {
  list-style-type: none; }

.footer__visible a {
  display: inline-block;
  height: 24px;
  width: 24px;
  overflow: hidden;
  position: relative;
  vertical-align: bottom; }
.footer__visible a span {
  display: inline-block;
  line-height: 26px;
  position: absolute;
  right: 0;
  top: 0;
  width: 70px; }
.footer__visible a img {
  float: right;
  margin-left: 2px; }
.footer__visible a:hover {
  width: 70px; }
.footer__visible a:hover img {
  transform: rotate(360deg); }

/*****************************************************
    8. Misc
******************************************************/
/* Gravity Form */
.gform_wrapper ul {
  margin: 0;
  padding: 0; }
.gform_wrapper li {
  list-style-type: none; }
.gform_wrapper label {
  display: block;
  font-family: "ProximaNova-Bold", "Arial Black", Gadget, sans-serif;
  margin: 0; }
.gform_wrapper input, .gform_wrapper textarea {
  border: 1px solid #e2e2e2;
  margin: 15px 0;
  padding: 5px 10px;
  width: 100%;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px; }
.gform_wrapper textarea {
  height: 170px;
  resize: none; }

.gform_footer input {
  background: #f58220;
  border: 0;
  color: #fff;
  float: right;
  font-family: "ProximaNova-Bold", "Arial Black", Gadget, sans-serif;
  padding: 5px 30px;
  width: auto; }
.gform_footer input:hover {
  opacity: 0.8; }

.gform_validation_container {
  display: none; }

/*****************************************************
    9. Responsive area
******************************************************/
/*****************************************************
    9.1 min-width 768px
******************************************************/
@media only screen and (min-width: 768px) {
  	/*****************************************************
          768.1 Header
      ******************************************************/
  /*****************************************************
      768.2 Menu
  ******************************************************/
  /*****************************************************
      768.3 Content
  ******************************************************/
  .fb__contact {
    text-align: right; }

  /*****************************************************
      768.4 Sidebar
  ******************************************************/
  /*****************************************************
      768.5 Footer
  ******************************************************/
  /*****************************************************
      768.6 Misc
  ******************************************************/ }
/*****************************************************
    9.2 min-width 992px
******************************************************/
@media only screen and (min-width: 992px) {
  .no-padding-md {
    padding: 0 !important; }

  .no-padding-left-md {
    padding-left: 0 !important; }

  .no-padding-right-md {
    padding-right: 0 !important; }

  .row-cancel {
    margin: 0 15px; }

  /*****************************************************
      992.1 Header
  ******************************************************/
  header {
    padding: 10px; }
  header .header__details {
    text-align: right; }

  .home-banner__wrapper {
    margin: 0; }

  .header__phone p {
    margin: 0; }

  /* Inner Page */
  .title {
    background: none; }

  .title__content {
    background: url("../img/bg-orange-pattern.jpg") right bottom no-repeat;
    background-size: cover; }

  /*****************************************************
      992.2 Menu
  ******************************************************/
  .main-menu {
    background: none;
    display: block;
    padding: 0; }
  .main-menu .main-menu__wrapper {
    background: #424242;
    padding: 15px; }
  .main-menu li {
    display: inline-block;
    margin: 0 15px; }
  .main-menu li a {
    color: #fff;
    text-transform: uppercase; }

  .mobile-menu {
    display: none; }

  /*****************************************************
      992.3 Content
  ******************************************************/
  /* Banner */
  .home-banner {
    margin-bottom: 0; }

  /* Inner Pages */
  .content__banner {
    margin: 0 0 15px; }

  .sub-items__item {
    text-align: left; }

  /* Contact Us */
  .contact__gmap {
    margin: 0 0 15px; }

  /* Services */
  .services-list {
    padding-top: 0; }

  .services-list__text {
    text-align: left; }

  /* Products */
  .product__main-image a, .product__text {
    margin-top: 0; }

  .products__title h3 {
    height: 32px;
    overflow: hidden; }

  /* Technical */
  .technical__pdfs {
    padding-top: 0; }

  .orange-button {
    display: inline-block; }

  /*****************************************************
      992.4 Sidebar
  ******************************************************/
  .sidebar__menu li:hover > .sidebar__submenu {
    display: block; }

  .sidebar__submenu {
    background: #fff;
    box-shadow: 2px 2px 2px #888;
    display: none;
    left: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 370px; }
  .sidebar__submenu h4 {
    display: block; }
  .sidebar__submenu li {
    max-height: 45px;
    overflow: hidden;
    width: 160px; }
  .sidebar__submenu .sidebar__submenu-wrapper {
    position: relative;
    min-height: 160px; }
  .sidebar__submenu .sidebar__submenu-bg {
    bottom: -15px;
    height: 100%;
    position: absolute;
    right: -30px;
    width: 185px; }

  /*****************************************************
      992.5 Footer
  ******************************************************/
  footer {
    text-align: left; }

  .footer__menu {
    padding: 0; }
  .footer__menu li {
    display: inline-block;
    margin-right: 15px; }

  .footer__visible {
    text-align: right; }

  /*****************************************************
      992.6 Misc
  ******************************************************/
  .search__products .products__thumbnail {
    height: 140px;
    line-height: 140px;
    overflow: hidden; } }
/*****************************************************
    9.3 min-width 1200px
******************************************************/
@media only screen and (min-width: 1200px) {
  /*****************************************************
      1200.1 Header
  ******************************************************/
  /*****************************************************
      1200.2 Menu
  ******************************************************/
  /*****************************************************
      1200.3 Content
  ******************************************************/
  /*****************************************************
      1200.4 Sidebar
  ******************************************************/
  /*****************************************************
      1200.5 Footer
  ******************************************************/
  /*****************************************************
      1200.6 Misc
  ******************************************************/
  .search__products .products__thumbnail {
    height: 177px;
    line-height: 177px; } }

/*# sourceMappingURL=style.css.map */