/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,400,700&display=swap");
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after {
  content: '';
  content: none; }

q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

/*MIXINS*/
@font-face {
  font-family: 'RheemSansRoman';
  src: url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Roman.eot");
  /* IE9 Compat Modes */
  src: url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Roman.eot?#iefix") format("embedded-opentype"), url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Roman.woff2") format("woff2"), url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Roman.woff") format("woff"), url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Roman.ttf") format("truetype"), url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Roman.svg#RheemSans-Roman") format("svg");
  /* Legacy iOS */ }
@font-face {
  font-family: 'RheemSansBold';
  src: url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Bold.eot");
  /* IE9 Compat Modes */
  src: url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Bold.eot?#iefix") format("embedded-opentype"), url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Bold.woff2") format("woff2"), url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Bold.woff") format("woff"), url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Bold.ttf") format("truetype"), url("https://www.rheem.com/wp-content/themes/RheemTheme/fonts/RheemSans-Bold.svg#RheemSans-Bold") format("svg");
  /* Legacy iOS */ }
#mobileview {
  position: relative;
  display: block;
  width: 370px;
  height: 95vh;
  max-width: 100%;
  min-height: 650px;
  margin: 0 auto;
  overflow: hidden;
  background: url(../images/waves.jpg) no-repeat center center; }
@media only screen and (min-width: 1400px) {
  #mobileview {
    display: none; } }
#mobileview #mobilelogowrapper {
  position: absolute;
  z-index: 3;
  top: 0px;
  left: 0px;
  width: 100%;
  text-align: center;
  padding: 20px 0px;
  background-color: rgba(255, 255, 255, 0.8); }
#mobileview #mobilelogowrapper img {
  max-width: 250px;
  height: auto;
  display: inline-block; }
#mobileview #mobilegozero {
  position: absolute;
  z-index: 3;
  transform: scale(0.6);
  bottom: -10px;
  left: -60px; }
#mobileview #mobilemenu {
  position: absolute;
  z-index: 3;
  bottom: 80px;
  left: 10px; }
#mobileview #mobilemenu li {
  display: block;
  margin-bottom: 10px; }
#mobileview #mobilemenu li a {
  display: block;
  color: #fff;
  font-family: 'RheemSansRoman';
  text-align: center;
  padding: 13px 10px 8px 10px;
  background-color: #e70033;
  text-decoration: none;
  font-size: 16px;
  line-height: 1;
  border-radius: 6px; }
#mobileview #mobilemap {
  position: relative;
  display: block;
  transform: scale(0.9); }
#mobileview #mobilewindow {
  position: absolute;
  z-index: 2;
  -webkit-transition: all 800ms ease-in-out;
  -moz-transition: all 800ms ease-in-out;
  transition: all 800ms ease-in-out; }
#mobileview #mobilewindow.us-west {
  top: -980px;
  left: -1075px; }
#mobileview #mobilewindow.us-east {
  top: -930px;
  left: -1400px; }
#mobileview #mobilewindow.asia {
  top: -1390px;
  left: -3950px; }
#mobileview #mobilewindow.samerica {
  top: -2040px;
  left: -1580px; }

#viewwindow {
  width: 1500px;
  height: 840px;
  background: url(../images/waves.jpg) no-repeat center center;
  margin: 0 auto;
  position: relative;
  display: none;
  overflow: hidden; }
#viewwindow:before {
  content: '';
  display: block;
  width: 100%;
  height: 100px;
  position: absolute;
  z-index: 5;
  pointer-events: none;
  top: 0px;
  left: 0px;
  background: linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, white 90%); }
#viewwindow:after {
  content: '';
  display: block;
  width: 100%;
  height: 100px;
  position: absolute;
  z-index: 5;
  pointer-events: none;
  bottom: 0px;
  left: 0px;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, white 90%); }
@media only screen and (min-width: 1400px) {
  #viewwindow {
    display: block; } }

#logo {
  position: absolute;
  z-index: 6;
  top: 100px;
  left: 510px;
  -webkit-transition: all 800ms ease-in-out;
  -moz-transition: all 800ms ease-in-out;
  transition: all 800ms ease-in-out; }
#logo.home {
  top: 120px;
  left: 0px;
  transform: scale(0.7); }

#startblock {
  background-color: #fff;
  padding: 20px 20px 40px 20px;
  -webkit-box-shadow: 0px 15px 24px 0px rgba(164, 164, 164, 0.47);
  -moz-box-shadow: 0px 15px 24px 0px rgba(164, 164, 164, 0.47);
  box-shadow: 0px 15px 24px 0px rgba(164, 164, 164, 0.47);
  position: absolute;
  z-index: 6;
  top: 300px;
  left: 50%;
  transform: translateX(-50%);
  width: 560px;
  text-align: center;
  font-family: 'RheemSansRoman';
  color: #63666A;
  font-size: 20px;
  line-height: 1.5;
  border-radius: 3px;
  border: 1px solid #D6D6D6;
  transition: border-width 0.1s linear;
  transform-origin: center center;
  cursor: pointer; }
#startblock:hover {
  border: 4px solid #A2C271; }
#startblock:hover .circlechev {
  transform: scale(1.2) translate(-50%, 45%); }
#startblock .circlechev {
  position: absolute;
  bottom: 0px;
  left: 50%;
  transform-origin: center center;
  transform: translate(-50%, 50%);
  transition: transform 0.1s linear; }

#panwindow {
  position: absolute;
  z-index: 2;
  -webkit-transition: all 800ms ease-in-out;
  -moz-transition: all 800ms ease-in-out;
  transition: all 800ms ease-in-out; }
#panwindow.start {
  top: -570px;
  left: -450px; }
#panwindow.us {
  top: -810px;
  left: -450px; }
#panwindow.eu {
  top: -560px;
  left: -2040px; }
#panwindow.sa {
  top: -2090px;
  left: -1000px; }
#panwindow.vn {
  top: -1600px;
  left: -3860px; }

#gozero {
  position: absolute;
  bottom: 40px;
  left: 40px;
  z-index: 7; }

.mapmarker {
  position: absolute;
  text-align: center;
  width: 86px;
  height: 86px;
  display: block;
  background: url(../images/marker-up.png) no-repeat center bottom;
  background-size: contain;
  z-index: 6;
  font-family: 'RheemSansBold';
  font-size: 11px;
  color: #4C4E50; }
.mapmarker:focus, .mapmarker:active {
  outline: none; }
.mapmarker:hover {
  background: url(../images/marker-over.png) no-repeat center bottom;
  color: #e70033; }
.mapmarker .overlay {
  position: absolute;
  top: -4px;
  left: 50%;
  white-space: nowrap;
  transform: translateX(-64%); }
.mapmarker .overlay span {
  display: block; }
.mapmarker.oxnard {
  top: 1180px;
  left: 890px; }
.mapmarker.mexicali {
  top: 1240px;
  left: 936px; }
.mapmarker.monterrey {
  top: 1413px;
  left: 1167px; }
.mapmarker.nuevo52 {
  top: 1365px;
  left: 1223px; }
.mapmarker.nuevo {
  top: 1337px;
  left: 1160px; }
.mapmarker.lewisville {
  top: 1247px;
  left: 1201px; }
.mapmarker.fortsmith {
  top: 1185px;
  left: 1254px; }
.mapmarker.scottsboro {
  top: 1173px;
  left: 1330px; }
.mapmarker.montgomery {
  top: 1240px;
  left: 1375px; }
.mapmarker.randleman {
  top: 1153px;
  left: 1468px; }
.mapmarker.brampton {
  top: 1007px;
  left: 1467px; }
.mapmarker.waterbury {
  top: 1070px;
  left: 1571px; }
.mapmarker.santiago {
  top: 2480px;
  left: 1614px; }
.mapmarker.binhduong {
  top: 1651px;
  left: 4234px; }
.mapmarker.rydalmere {
  top: 2315px;
  left: 4846px; }
.mapmarker.revesby {
  top: 2353px;
  left: 4874px; }


#minimap {
  width: 383px;
  height: 270px;
  background: url(../images/minimap.png) no-repeat center center;
  position: absolute;
  bottom: 0px;
  right: 0px;
  z-index: 7;
  display: none; }
#minimap span {
  position: absolute;
  width: 57px;
  height: 32px;
  border: 1px dotted blue;
  cursor: pointer; }
#minimap span.ushotspot {
  top: 110px;
  left: 94px; }
#minimap span.euhotspot {
  display: none;
  top: 98px;
  left: 157px; }
#minimap span.sahotspot {
  top: 157px;
  left: 114px; }
#minimap span.vnhotspot {
  top: 142px;
  left: 235px; }
#minimap .locator {
  position: absolute;
  top: 98px;
  left: 77px;
  -webkit-transition: all 800ms ease-in-out;
  -moz-transition: all 800ms ease-in-out;
  transition: all 800ms ease-in-out; }
#minimap .locator.us {
  top: 98px;
  left: 77px; }
#minimap .locator.eu {
  top: 85px;
  left: 140px; }
#minimap .locator.sa {
  top: 144px;
  left: 97px; }
#minimap .locator.vn {
  top: 130px;
  left: 217px; }

.arrow {
  position: absolute;
  z-index: 7;
  opacity: 0;
  -webkit-transition: all 800ms ease-in-out;
  -moz-transition: all 800ms ease-in-out;
  transition: all 800ms ease-in-out;
  cursor: pointer; }
.arrow.active {
  opacity: .3; }
.arrow:hover {
  opacity: 1; }
.arrow#arrow1 {
  top: 50%;
  right: 20px; }
.arrow#arrow1.eu, .arrow#arrow1.vn {
  top: 50%;
  right: 96%;
  transform: rotate(180deg); }
.arrow#arrow1.us {
  top: 50%;
  right: 20px;
  transform: rotate(0deg); }
.arrow#arrow1.sa {
  top: 5%;
  right: 50%;
  transform: rotate(-90deg); }
.arrow#arrow2 {
  transform: rotate(90Deg);
  right: 50%;
  bottom: 20px; }
.arrow#arrow2.us {
  transform: rotate(90Deg);
  right: 50%;
  bottom: 20px; }
.arrow#arrow2.sa {
  bottom: 43%;
  right: 20px;
  transform: rotate(0deg); }
.arrow#arrow3 {
  top: 50%;
  right: 20px;
  display: none; }

body.eu #arrow3 {
  opacity: .3;
  display: block; }

#startmap {
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 2; }

#mainmap {
  position: relative;
  display: none; }
