@font-face {
  font-family: 'script';
  src: url('../fonts/parisienne-regular-webfont.eot');
  src: url('../fonts/parisienne-regular-webfont.eot?#iefix') format('embedded-opentype'), 
       url('../fonts/parisienne-regular-webfont.woff2') format('woff2'), 
	   url('../fonts/parisienne-regular-webfont.woff') format('woff'), 
	   url('../fonts/parisienne-regular-webfont.ttf') format('truetype'), 
	   url('../fonts/parisienne-regular-webfont.svg#parisienneregular') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'normal';
  src: url('../fonts/FuturaStd-Book.eot');
  src: url('../fonts/FuturaStd-Book.eot?#iefix') format('embedded-opentype'), 
       url('../fonts/FuturaStd-Book.woff2') format('woff2'), 
	   url('../fonts/FuturaStd-Book.woff') format('woff'), 
	   url('../fonts/FuturaStd-Book.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'bold';
  src: url('../fonts/FuturaStd-Bold.eot');
  src: url('../fonts/FuturaStd-Bold.eot?#iefix') format('embedded-opentype'), 
       url('../fonts/FuturaStd-Bold.woff2') format('woff2'), 
	   url('../fonts/FuturaStd-Bold.woff') format('woff'), 
	   url('../fonts/FuturaStd-Bold.ttf') format('truetype'), 
	   url('../fonts/FuturaStd-Bold.svg#FuturaStd-Bold') format('svg');
  font-weight: normal;
  font-style: normal;
}
html,
body {
  height: 100%;
  font: normal 12px/22px 'normal';
  color: #42494e;
}
img{border:0px;}
input{border:solid 1px #B9B9B9}
ul{list-style:none;}
li{list-style:none;}
.clear {
  clear: both;
}
.cover {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.contain {
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  background-size: contain;
}
#wrapper .btn {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
  display: block;
  background: #5ac5f0;
  border: 0;
  font: normal 12px/20px 'normal';
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  color: #fff;
  text-transform: uppercase;
  text-decoration: none;
  padding: 5px 25px;
  text-align: center;
  letter-spacing: 2px;
  margin: auto;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
  -moz-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0) !important;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
#wrapper .btn:hover,
#wrapper .btn:focus,
#wrapper .btn:active {
  /* -webkit-transform: scale(1.1);
  transform: scale(1.1);*/
  background:#32b0e3;
}
a,
a:hover,
a:focus {
  outline: none;
}
.width100,
.form-actions .btn {
  width: 200px !important;
}
#wrapper .form-actions .btn {
  margin-top: 20px !important;
}
.relative {
  position: relative;
}
.text-shadow {
  text-shadow: 0px 0px 3px #ffffff;
}
.ProSw{ width:650px; margin:0 auto; padding-top:140px; margin-bottom:20px;}
.swipe{width:100%;overflow:hidden;position:relative;}
.swipe ul{
	-webkit-transition:left 800ms ease-in 0;
	-moz-transition:left 800ms ease-in 0;
	-o-transition:left 800ms ease-in 0;
	-ms-transition:left 800ms ease-in 0;
	transition:left 800ms ease-in 0;
}
.swipe img{ width:100%; margin:0 auto}
.swipe #pagenavi{position:absolute;left:0;bottom:0px;text-align:center;width:100%;}
.swipe #pagenavi a{width:5px;height:5px;line-height:99em;background:#c9ecff;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%;margin:0 2px;overflow:hidden;cursor:pointer;display:inline-block;*display:inline;*zoom:1;}
.swipe #pagenavi a.active{background:#5ac5f0;}
.breeze {
  animation: breeze ease-in-out 6s;
  animation-iteration-count: infinite;
  transform-origin: 50% 50%;
  -webkit-animation: breeze ease-in-out 6s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: breeze ease-in-out 6s;
  -moz-animation-iteration-count: infinite;
  -moz-transform-origin: 50% 50%;
  -o-animation: breeze ease-in-out 6s;
  -o-animation-iteration-count: infinite;
  -o-transform-origin: 50% 50%;
  -ms-animation: breeze ease-in-out 6s;
  -ms-animation-iteration-count: infinite;
  -ms-transform-origin: 50% 50%;
}
@keyframes breeze {
  0% {
    transform: translate(0px, 0px) rotate(-3deg);
  }
  50% {
    transform: translate(0, 0px) rotate(0deg);
  }
  100% {
    transform: translate(0px, 0px) rotate(-3deg);
  }
}
@-moz-keyframes breeze {
  0% {
    -moz-transform: translate(0px, 0px) rotate(-3deg);
  }
  50% {
    -moz-transform: translate(0, 0px) rotate(0deg);
  }
  100% {
    -moz-transform: translate(0px, 0px) rotate(-3deg);
  }
}
@-webkit-keyframes breeze {
  0% {
    -webkit-transform: translate(0px, 0px) rotate(-3deg);
  }
  50% {
    -webkit-transform: translate(0, 0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(0px, 0px) rotate(-3deg);
  }
}
@-o-keyframes breeze {
  0% {
    -o-transform: translate(0px, 0px) rotate(-3deg);
  }
  50% {
    -o-transform: translate(0, 0px) rotate(0deg);
  }
  100% {
    -o-transform: translate(0px, 0px) rotate(-3deg);
  }
}
@-ms-keyframes breeze {
  0% {
    -ms-transform: translate(0px, 0px) rotate(-3deg);
  }
  50% {
    -ms-transform: translate(0, 0px) rotate(0deg);
  }
  100% {
    -ms-transform: translate(0px, 0px) rotate(-3deg);
  }
}
.breeze-reverse {
  animation: breeze-reverse ease-in-out 6s;
  animation-iteration-count: infinite;
  transform-origin: 50% 50%;
  -webkit-animation: breeze-reverse ease-in-out 6s;
  -webkit-animation-iteration-count: infinite;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: breeze-reverse ease-in-out 6s;
  -moz-animation-iteration-count: infinite;
  -moz-transform-origin: 50% 50%;
  -o-animation: breeze-reverse ease-in-out 6s;
  -o-animation-iteration-count: infinite;
  -o-transform-origin: 50% 50%;
  -ms-animation: breeze-reverse ease-in-out 6s;
  -ms-animation-iteration-count: infinite;
  -ms-transform-origin: 50% 50%;
}
@keyframes breeze-reverse {
  0% {
    transform: translate(0px, 0px) rotate(3deg);
  }
  49% {
    transform: translate(-5px, 0px) rotate(0deg);
  }
  100% {
    transform: translate(0px, 0px) rotate(3deg);
  }
}
@-moz-keyframes breeze-reverse {
  0% {
    -moz-transform: translate(0px, 0px) rotate(3deg);
  }
  49% {
    -moz-transform: translate(-5px, 0px) rotate(0deg);
  }
  100% {
    -moz-transform: translate(0px, 0px) rotate(3deg);
  }
}
@-webkit-keyframes breeze-reverse {
  0% {
    -webkit-transform: translate(0px, 0px) rotate(3deg);
  }
  49% {
    -webkit-transform: translate(-5px, 0px) rotate(0deg);
  }
  100% {
    -webkit-transform: translate(0px, 0px) rotate(3deg);
  }
}
@-o-keyframes breeze-reverse {
  0% {
    -o-transform: translate(0px, 0px) rotate(3deg);
  }
  49% {
    -o-transform: translate(-5px, 0px) rotate(0deg);
  }
  100% {
    -o-transform: translate(0px, 0px) rotate(3deg);
  }
}
@-ms-keyframes breeze-reverse {
  0% {
    -ms-transform: translate(0px, 0px) rotate(3deg);
  }
  49% {
    -ms-transform: translate(-5px, 0px) rotate(0deg);
  }
  100% {
    -ms-transform: translate(0px, 0px) rotate(3deg);
  }
}
#header {
  background: url(../images/mainbg.jpg) no-repeat center bottom;
  display: block;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 100%;
  min-height: 600px;
  position: relative;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
}
#header.STORES {
  background: url(../images/StoreBg.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 100%;
  height:600px;
  min-height: 400px;
}
#header.Cooperation {
  background: url(../images/CooperationBg.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 100%;
  height:500px;
  min-height: 400px;
}
#header.Contact {
  background: url(../images/ContactBg.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 100%;
  height:500px;
  min-height: 400px;
}
#header.Security {
  background: url(../images/SecurityBg.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 100%;
  height:500px;
  min-height: 300px;
}
.productbg {
  background: url(../images/productbg.jpg) no-repeat center top fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 100%;
  height: 100%;
  display:block;
}
#header.news {
  background: url(../images/costanza_news.jpg) no-repeat center center;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  width: 100%;
  height: 640px;
}
#logo {
  position: fixed;
  z-index: 199;
  left: 0;
  right: 0;
  margin: auto;
  width: 110px;
  top: 50px;
}
#logo a {
  display: block;
  margin: auto;
  width: 110px;
}
#logo a img {
  display: block;
  width: 110px;
  margin: auto;
}
#logo a img.z-1 {
  position: absolute;
  z-index: 1;
  left: 0;
  right: 0;
  display: none;
}
#logo a img.z-2 {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
}
#NANO-bottle {
  position: absolute;
  left: 0;
  right: 0;
  margin: auto;
  bottom: 0;
  width: 60%;
  height:56%;
  z-index: 10;
  background: url(../images/NANO-bottle.png) no-repeat center bottom;
  -webkit-background-size: contain;
  -moz-background-size: contain;
  -o-background-size: contain;
  background-size: contain;
}
#NANO-bottle a{ width:100%; height:100%; display:block}
#theme{position: absolute; z-index:20; bottom:130px; left:50%; margin-left:150px;}
#theme h1{ font-size:21px !important;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif; padding:0; margin:0; padding-left:2px;}
#theme h2{ font-size:24px !important;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif; font-weight:bold !important;padding:0;}
#theme p{ line-height:16px; padding-top:10px;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;padding-left:2px;}
#theme a{ width:125px; height:28px; background:#80a4ce;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif; display:block; line-height:30px; text-align:center; color:#FFF; text-decoration:none; margin-left:2px;}
#theme a:hover{ background:#5ac5f0}
#shop {
  position: fixed;
  right: 60px;
  top: 67px;
  z-index: 200;
}
#shop a{
  color: #42494e;
  text-decoration: none;
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  font-size:14px
}

#shop a:hover,
#shop a:focus {
  color: #007bdd;
}
#Fake{position: fixed;right:58px;top:105px;z-index: 200;}
#Fake a img{ width:60px;}
#FakeImg{ position:absolute;width:790px;z-index:99999; top:80px; left:50%; margin-left:-395px; display:none}
.Fakebg{position:fixed; background:#FFF; z-index:10000; top:0; left:0; width:100%; height:100%; display:none}
.FakeClose{position:fixed;z-index:999999; top:50px; right:50px; display:none}
.FakeClose img{ width:50px;}

#Notice{position: fixed;right:58px;top:180px;z-index: 200;}
#Notice a img{ width:60px;}
#NoticeImg{ position:absolute;width:790px;z-index:99999; top:80px; left:50%; margin-left:-395px; display:none}
.Noticebg{position:fixed; background:#FFF; z-index:10000; top:0; left:0; width:100%; height:100%; display:none}
.NoticeClose{position:fixed;z-index:999999; top:50px; right:50px; display:none}
.NoticeClose img{ width:50px;}




@media (max-width: 790px){
#FakeImg{ position:absolute;width:100%;top:30px; left:0; margin:0;}
#FakeImg img{ width:100%}
.FakeClose{top:10px; right:10px;}
.FakeClose img{ width:35px;}

#NoticeImg{ position:absolute;width:100%;top:30px; left:0; margin:0;}
#NoticeImg img{ width:100%}
.NoticeClose{top:10px; right:10px;}
.NoticeClose img{ width:35px;}

}

#mainNav {
  position: fixed;
  left: 60px;
  top: 51px;
  z-index: 2000;
  display: block;
  width: 50px;
}
#mainNav.mainNavAbout a span,
#shop.yellowShopa a {
  color: #fff;
}
#mainNav.mainNavAbout a span.eq0.importantGrey {
  color: #42494e !important;
  -webkit-transition: all 350ms ease;
  -moz-transition: all 350ms ease;
  -o-transition: all 350ms ease;
  transition: all 350ms ease;
}
.menu-container {
  width: auto;
  height: 50px;
  position: relative;
  padding-top:30px;
  color: #42494e;
  display:block;
}
.menu-container a,
.menu-container span {
  color: #42494e;
}
.menu-container:hover,
.menu-container:focus {
  cursor: pointer;
  text-decoration: none;
}
#bar1 {
  width: 38px;
  height: 1px;
  background-color: #5ac5f0;
  position: absolute;
  top: 9px;
  left: 0;
  -webkit-transform: rotate(0deg);
  -webkit-transform-origin: 9.5px 0px;
  -moz-transform: rotate(0deg);
  -moz-transform-origin: 9.5px 0px;
  -ms-transform: rotate(0deg);
  -ms-transform-origin: 9.5px 0px;
  transform: rotate(0deg);
  transform-origin: 9.5px 0px;
}
#bar2 {
  width: 38px;
  height: 1px;
  background-color: #5ac5f0;
  position: absolute;
  top: 15px;
  left: 0;
  -webkit-transform: rotate(0deg);
  -webkit-transform-origin: 9.5px 0px;
  -moz-transform: rotate(0deg);
  -moz-transform-origin: 9.5px 0px;
  -ms-transform: rotate(0deg);
  -ms-transform-origin: 9.5px 0px;
  transform: rotate(0deg);
  transform-origin: 9.5px 0px;
}
#bar3 {
  width: 38px;
  height: 1px;
  background-color: #5ac5f0;
  position: absolute;
  top: 21px;
  left: 0;
  -webkit-transform: rotate(0deg);
  -webkit-transform-origin: 9.5px 0px;
  -moz-transform: rotate(0deg);
  -moz-transform-origin: 9.5px 0px;
  -ms-transform: rotate(0deg);
  -ms-transform-origin: 9.5px 0px;
  transform: rotate(0deg);
  transform-origin: 9.5px 0px;
}
.menu span {
  padding: 3px;
  position: relative;
  left: -1px;
  z-index: 10;
  letter-spacing:10px;
  text-align:center;
}
.menu span.animateBg {
  background: #5ac5f0;
  position: absolute;
  z-index: 5;
  height: 20px;
  left: -3px;
  bottom: -1px;
  width: 0;
  padding: 0;
}
html {
  -webkit-overflow-scrolling: touch;
}
#menu-overlay {
  position: fixed;
  z-index: 400;
  left: 0;
  background: #42494e;
  width: auto;
  height: 100%;
  display: block;
  opacity: 0;
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -o-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  transition: all 500ms ease;
  -webkit-transform: rotateY(-90deg);
  -moz-transform: rotateY(-90deg);
  -o-transform: rotateY(-90deg);
  -ms-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
  -webkit-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateX(-1000px);
  -moz-transform: translateX(-1000px);
  -o-transform: translateX(-1000px);
  -ms-transform: translateX(-1000px);
  transform: translateX(-1000px);
  visibility: hidden;
  -webkit-box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0);
  box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0);
  border-top: solid #42494E 140px;
}
#menu-overlay-white {
  position: fixed;
  z-index: 300;
  height: 100%;
  background: #fff;
  width: 100%;
  display: none;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
  filter: alpha(opacity=50);
  zoom: 1;
  -moz-opacity: 0.5;
  -khtml-opacity: 0.5;
  opacity: 0.5;
}
#menu-overlay .nav {
  padding: 0 60px 0 60px;
}
#menu-overlay li a {
  padding: 0;
  padding: 5px 0;
  font: normal 12px 'normal';
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  color: #fff;
  text-transform: uppercase;
  border: solid 15px #42494e;
  border-width: 15px 0;
  letter-spacing: 2px;
  -webkit-transition: text-indent 200ms ease-in-out;
  -moz-transition: text-indent 200ms ease-in-out;
  -o-transition: text-indent 200ms ease-in-out;
  transition: text-indent 200ms ease-in-out;
}
#menu-overlay li a:focus {
  background: none !important;
  color: #fff !important;
}
#menu-overlay li a:hover {
  background: #5ac5f0 !important;
  text-indent: 20px;
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  color:#333
}
#menu-overlay li a.nav-path-selected {
  font-family: 'bold';
  background: #5ac5f0;
  text-align: center;
  display: block;
  text-indent: 0 !important;
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  color:#333
}
#menu-overlay li a.nav-path-selected:hover {
  text-indent: 0 !important;
}
#menu-overlay li {
  border-bottom: solid #fff 1px;
  width: 420px;
}
#menu-overlay li.nav-path-selected {
  text-align: center;
  display: block;
}
.extraShop {
  color: #42494e;
}
.extraShop:hover,
.extraShop:focus {
  text-decoration: none;
  color: #42494e;
}
#teaser {
  position: relative;
  z-index: 20;
  top: 170px !important;
  text-transform:uppercase
}
#teaser.aboutusteaser h1,
#header.STORES h1 {
  text-shadow: 0px 0px 0 rgba(0, 0, 0, 0) !important;
  color: #fff;
}
#content h1,
#teaser h1 {
  font: normal 30px/35px 'bold';
  margin: 0;
  text-align: center;
  margin: 0 0 20px 0;
  letter-spacing: 0px;
}
#wrapper .container .row h1 {
  font: normal 28px/30px 'bold';
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  text-align:left;
  margin: 0;
  letter-spacing: 1px;
}
#wrapper h2 {
  font: normal 28px/30px 'bold';
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  margin: 0;
  letter-spacing: 1px;
}
#wrapper h3 {
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  font-size:18px;
  font-weight:bold;
  margin: 0;
  letter-spacing: 1px;
}

#wrapper blockquote {
  border: 0;
  padding: 0;
  margin: 0;
  font: normal 12px/22px 'normal';
  letter-spacing: 2px;
  margin-top:70px;
  margin-bottom: 5px;
}
#wrapper a.blockquotebtn {
  font: normal 12px/22px 'normal';
  letter-spacing: 2px;
  color: #000;
  text-decoration: none;
  text-align: center;
  display: block;
  margin: auto;
  width: 200px;
  text-decoration: underline;
}
#wrapper .headlines blockquote {
  color: #6f787d;
  text-align: center;
}
#content .whitebg h1 {
  color: #42494e;
}
#content .bluebg h1 {
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  margin:0 auto;
}
.Moofj h1{ margin-top:60px !important;}
.Moofj p{ margin-top:20px !important;}
#Store{padding:17px; margin-bottom:30px;}
#Store ul li{ float:left; width:50%; height:80px; margin-bottom:40px;}
#Store ul li h2{ font-size:18px !important; color:#333}
#Store ul li .Location{ color:#999}
#Store ul li a{ color:#26abe1; font-size:14px}
#Store ul li a:hover{ color:#007edd}

#content .bluebg blockquote {
	margin:0 auto;
	padding:10px 0 50px 0;
}
#teaser h1 {
  color:#5ac5f0;
  font-size: 64px;
  line-height: 62px;
}
#teaser a{ text-decoration:none;}
#teaser a h2{
  color:#fff;
  font-size: 16px;
  line-height: 32px;
  width:204px;
  height:32px;
  background:#5ac5f0;
  text-align:center;
  margin:0 auto;
  margin-top:-10px;
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  letter-spacing:2px;
}
#teaser a:hover h2{background:#32b0e3;}
#teaser h2 a{ color:#FFF; text-decoration:none}
#navigationArea {
  position: fixed;
  z-index: 101;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 160px;
}
#wrapper,
#header,
#branches,
#branches-left,
#branches-right {
  height: 100%;
  display: block;
}
#wrapper {
  position: relative;
}
#branches {
  position: absolute;
  overflow: hidden;
  width: 100%;
  top: 0;
  z-index: 1;
}
#branches-left,
#branches-right {
  position: absolute;
  width: 330px;
  top: 0;
}
#branches-left {
  left: -35px;
}
#branches-right {
  right: -35px;
}
.branches-center {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  margin-top: 0px;
}
.branches-center img {
  position: absolute;
}
#branches-left .breeze {
  z-index: 2;
}
#branches-left .breeze-reverse {
  z-index: 1;
}
#branches-left .branches-center,
#branches-left .branches-center img {
  left: 0;
}
#branches-right .breeze-reverse {
  z-index: 2;
}
#branches-right .breeze {
  z-index: 1;
}
#branches-right .branches-center,
#branches-right .branches-center img {
  right: 0;
}


.slideAnimation {
  opacity: 0;
  -webkit-transform-origin: 0 0;
  -moz-transform-origin: 0 0;
  -o-transform-origin: 0 0;
  -ms-transform-origin: 0 0;
  transform-origin: 0 0;
  -webkit-transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  transition: all 500ms ease;
  -webkit-transform: rotateY(-90deg);
  -moz-transform: rotateY(-90deg);
  -o-transform: rotateY(-90deg);
  -ms-transform: rotateY(-90deg);
  transform: rotateY(-90deg);
  -webkit-backface-visibility: hidden;
  -o-backface-visibility: hidden;
  -ms-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform: translateX(-1000px);
  -moz-transform: translateX(-1000px);
  -o-transform: translateX(-1000px);
  -ms-transform: translateX(-1000px);
  transform: translateX(-1000px);
  visibility: hidden;
  -webkit-box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0);
  box-shadow: inset 1px 0px 0px 0px rgba(255, 255, 255, 0);
}
.slideAnimationShow {
  visibility: visible !important;
  opacity: 1 !important;
  -webkit-transform: rotateY(0deg) !important;
  -moz-transform: rotateY(0deg) !important;
  -o-transform: rotateY(0deg) !important;
  -ms-transform: rotateY(0deg) !important;
  transform: rotateY(0deg) !important;
}
.animateOpen {
  top: 67px !important;
}
.animateClose {
  top: 45px !important;
}
/* CONTENT */
.bluebg {
  background: #e7f4fc;
  padding: 50px 0;
}
.whitebg {
  background: #fff;
  padding: 50px 0;
}
.img-olive-solo {
  display: block;
  margin: auto;
  text-align: center;
  width: 319px;
}
.bothnearby {
  margin-bottom: 15px;
}
.bothnearby.left {
  padding-right: 7.5px !important;
}
.bothnearby.right {
  padding-left: 7.5px !important;
}

.image-01 {
  background: url(../images/image-01.jpg) no-repeat center center;
  display: block;
  min-height: 600px;
}
.image-02 {
  background: url(../images/image-02.jpg) no-repeat center center;
  display: block;
  min-height: 600px;
}
.image-03 {
  background: url(../images/image-03.jpg) no-repeat center center;
  display: block;
  min-height: 600px;
}
.image-04 {
  background: url(../images/image-04.jpg) no-repeat center center;
  display: block;
  min-height: 600px;
}
.humble {
  background: url(../images/olive_trees.jpg) no-repeat center top;
  display: block;
  min-height: 600px;
}
.evolution {
  background: #fff;
  display: block;
  min-height: 600px;
}
.sustainability {
  background: url(../images/olive_tree_sustainable.jpg) no-repeat center center;
  display: block;
  min-height: 600px;
}
.growing {
  background: url(../images/costanza_growing.jpg) no-repeat center center;
  display: block;
  min-height: 600px;
}

.humble *,
.evolution * {
  color: #42494e;
}
.image-01 * {
  color: #42494e;
}
.image-02 *{
  color: #42494e;
}
.image-03 * {
  color: #42494e;
}
.image-04 *{
  color: #42494e;
}
.image-01,
.image-02,
.image-03,
.image-04,
.from-sicily,
.humble,
.evolution,
.quality-prod {
  position: relative;
}
.text-image {
  padding-top: 20%;
  left: 20%;
  margin-right: 20%;
  width: 63%;
  padding-bottom: 15%;
}
.text-image {
  position: relative;
}
.text-image h2{ padding-bottom:20px; font-size:24px !important}
.text-imgres {
  position: relative !important;
  margin: 0 0 20px 0;
}
.soloTxt {
  padding: 0 !important;
}
.for-sicily-map {
  position: relative;
  margin: 0 0 50px 0;
}
.img-map-sic {
  position: relative;
  z-index: 1;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
}
.img-map-pin {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
  -webkit-animation: jump 1.5s ease 0s infinite normal;
  animation: jump 1.5s ease 0s infinite normal;
}
@-webkit-keyframes jump {
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  20% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  40% {
    -webkit-transform: translateY(-30px);
    transform: translateY(-30px);
  }
  50% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  60% {
    -webkit-transform: translateY(-15px);
    transform: translateY(-15px);
  }
  80% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}
@keyframes jump {
  0% {
    transform: translateY(0);
  }
  20% {
    transform: translateY(0);
  }
  40% {
    transform: translateY(-30px);
  }
  50% {
    transform: translateY(0);
  }
  60% {
    transform: translateY(-15px);
  }
  80% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0);
  }
}

#wrapper label {
  font-weight: normal;
  letter-spacing: 2px;
}
#wrapper label span {
  letter-spacing: 0;
}
#wrapper .nomargin {
  margin: 0;
}
.btnbottom {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 40px;
}
footer {
  background: #42494e;
  padding: 50px 0;
}
.footerLogo {
  width: 100px !important;
}
footer p {
  color: #98a1a6;
  font-size: 85%;
  line-height: 135%;
}
#wrapper strong {
  font-weight: normal !important;
  font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;
  font-weight:bold !important
}
.customer-opinion blockquote {
  text-transform: uppercase;
}
.yellowText {
  margin-top: 90px;
}
.yellowText * {
  color: #ffe040;
  text-align: center;
}
.closure {
  margin-bottom: 50px;
}
.importantVisible {
  display: block !important;
  background-color: #fff !important;
}
#content.contact .bluebg {
  padding-top: 160px;
}
#wrapper hr {
  border-top: solid #000 1px;
  margin: 40px 0;
}
.MainForm{width:100%; padding:17px; }
em { color:}
.MainForm p{margin-bottom:10px !important;}
.Inputbox{ border-color:#FFF; padding:10px;background:#f8f8f8;height:40px;line-height:40px; width:100%;-moz-box-shadow:1px 1px 2px #999 inset;-webkit-box-shadow:1px 1px 2px #999 inset;box-shadow:1px 1px 2px #999 inset; }
.InputMsg{ border-color:#FFF;padding:10px;background:#f8f8f8;height:150px;line-height:16px;width:103%;-moz-box-shadow:1px 1px 2px #999 inset;-webkit-box-shadow:1px 1px 2px #999 inset;box-shadow:1px 1px 2px #999 inset; }
.SubmitBtnbg{background:#5ac5f0; color:#FFFFFF; margin-top:10px; border:none; text-align:center; font-size:12px;width:120px; height:40px;line-height:38px;cursor:pointer;cursor:hand;-webkit-transition:background-color 0.2s linear;-moz-transition:background-color 0.2s linear;-o-transition:background-color 0.2s linear;transition:background-color 0.2s linear;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif; font-size:16px}
.SubmitBtnbg:hover{background:#32b0e3;}

.Codebox{ padding:5px 10px; width:80px; font-size:12px;border:#c8d1d7 1px solid;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px; display:inline-block}
.cursor1{ cursor:pointer; display:inline-block; margin-left:5px}

#wrapper .contact .btn {
  background: #42494e !important;
  color: #ffe040 !important;
}
.generatedBgs {
  -webkit-background-size: cover !important;
  -moz-background-size: cover !important;
  -o-background-size: cover !important;
  background-size: cover !important;
  background-position: center bottom !important;
}
.overview-image {
  display: block;
  min-height: 600px;
  -webkit-background-size: cover !important;
  -moz-background-size: cover !important;
  -o-background-size: cover !important;
  background-size: cover !important;
}
figure.overview {
  position: relative;
}
figure.overview figcaption {
  position: absolute;
  width: 100%;
  height: 100%;
  padding: 0;
}
figure.overview figcaption::before {
  position: absolute;
  top: 20px;
  right: 20px;
  bottom: 20px;
  left: 20px;
  content: '';
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
  opacity: 0;
  -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
  transition: opacity 0.35s, transform 0.35s;
  background: rgba(255, 224, 64, 0.9);
}
figure.overview:hover figcaption::before {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}
figure.overview .overview-image {
  -webkit-transition: all 0.25s linear;
  transition: all 0.25s linear;
}
figure.overview .buttons-cent {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  margin-top: -31px;
  opacity: 0;
  -webkit-transition: opacity 0.35s;
  transition: opacity 0.35s;
}
figure.overview .buttons-cent strong {
  color: #fff;
  text-align: center;
  margin: 5px 0;
  display: block;
}
.buttons-cent .btn.cent-1 {
  border: solid #fff 1px !important;
}
.buttons-cent .btn.cent-2 {
  background: #fff !important;
}
figure.overview:hover .buttons-cent {
  opacity: 1;
}
.uppercase {
  text-transform: uppercase;
}
.nomargin {
  margin: 0;
}
.text-image-small {
  padding-top: 10%;
  left: 10%;
  margin-right: 10%;
  padding-bottom: 5%;
  width: 80%;
  position: relative;
}
a.grey {
  font-family: 'normal';
  color: #98a1a6;
  text-decoration: underline;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.text-image-small hr {
  margin: 20px 0 !important;
}
#wrapper p {
  margin: 0 0 20px 0;
  font-size: 14px;
  line-height:24px
}
#wrapper table p {
  margin: 0;
}
#wrapper table tr td,
#wrapper table tr th {
  padding: 0 10px;
}
#wrapper table tbody tr td,
#wrapper table tbody tr th {
  width: 50%;
  border-top: solid #98a1a6 1px;
}
#wrapper table tbody tr td:first-child {
  border-right: solid #98a1a6 1px;
}
#wrapper .readmore-cos-news a.blockquotebtn {
  text-align: left;
  width: auto;
  display: block;
  color: #42494e;
}
.img-responsive{max-width:100%;height:auto}
#wrapper .recentNews {
  display: block;
  text-align: left;
  color: #42494e;
  letter-spacing: 2px;
  text-transform: uppercase;
}
.colorwhite {
  text-align: center;
  color: #fff;
}
#branche-image img {
  display: block;
  margin: auto;
  text-align: center;
}
#teaser.btnsbottom {
  height: 100%;
  top: 0 !important;
}
#teaser.btnsbottom .buttons-cent {
  position: absolute;
  bottom: 50px;
  left: 0;
  right: 0;
  margin: auto;
}
footer p a,
footer p a:hover,
footer p a:focus {
  color: #5ac5f0;
}
#badge {
  position: fixed;
  z-index: 102;
  top: 100px;
  right: 0;
  display: block;
}

.mob{ display:none}

#firstpage{z-index:2000; position:absolute; background:#FFF; height:100%; width:100%; position:fixed; top:0;-webkit-transition: all 1s ease-out;-moz-transition: all 1s ease-out;transition: all 1s ease-out;}
#firstpage .Codemain{z-index:10;position:absolute; width:190px; left:50%; margin-left:-95px;top:200px;}
#firstpage .Codemain .finger_line{ width:100%}
@keyframes ball-pulse-rise-odd {
  0% {-webkit-transform: translateY(-75px);
            transform: translateY(-75px);}

  100% {-webkit-transform: translateY(75px);
            transform: translateY(75px);} }

.ball-pulse-rise > div {
  position:absolute;
  top:160px;
  -webkit-animation-fill-mode: both;
          animation-fill-mode: both;
  display: inline-block;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-timing-function: cubic-bezier(.15, .46, .9, .6);
          animation-timing-function: cubic-bezier(.15, .46, .9, .6);
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  -webkit-animation-delay: 0;
          animation-delay: 0; }
  .ball-pulse-rise > div:nth-child(2n) {
    -webkit-animation-name: ball-pulse-rise-even;
            animation-name: ball-pulse-rise-even; }
  .ball-pulse-rise > div:nth-child(2n-1) {
    -webkit-animation-name: ball-pulse-rise-odd;
            animation-name: ball-pulse-rise-odd; }

#firstpage .finger_logo{position:absolute;z-index:10;width:120px; left:50%; margin-left:-60px;text-align:center;top:40px;}
#firstpage .finger_info{position:absolute;z-index:10;width:100px; left:50%; margin-left:-50px;text-align:center;top:170px; color:#FFF; font-size:16px; font-weight:bold}
#firstpage .Codemain .CodePng,#firstpage .bg,#firstpage .finger_logo img{ width:100%}

#Code_Con{width:100%;max-width:480px;margin:0 auto; padding-top:150px;margin-bottom:40px; left:50%;margin-left:-240px;}
.CHeek{width:100%;max-width:520px;position:absolute; position:fixed;left:50%;margin-left:-240px;z-index:100;top:150px;}
#Qbg{ width:100%; height:100%; background:#FFF;position:fixed;z-index:99; top:0; left:0; display:none}
#Code_Con .hddd{ text-align:center; margin-top:50px; font-size:14px}
#showresult{width: 90%;margin: 0 auto;}
#showresult a{ font-weight:bold}
.Correct img{ width:55%;}
.Correct h1{ font-weight:bold; font-size:26px;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif; padding-top:20px;}
.Correct p{font-size:15px !important; }
.Correct i{ font-style:normal; background:#d5be6e; color:#FFF; font-size:14px; padding:6px 30px 6px 30px}
.Correct a{ margin-top:20px; display:block}
.Wrong img{ width:50%;}
.Wrong h1{ font-weight:bold; font-size:26px; color:#d50c12;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif; padding-top:20px;}
.Wrong p{font-size:15px !important;}
.Wrong i{ font-style:normal; color:#d50c12; font-size:14px; font-weight:bold}
.Wrong a{ margin-top:20px; display:block}

@media (min-width: 600px){
	#firstpage .bg{ width:400px; position:absolute;left:50%; margin-left:-200px; z-index:1;}
}

@media (max-width: 480px){
	.Correct p,.Wrong p{font-size:13px !important;}
	#firstpage .finger_logo{width:100px; left:50%; margin-left:-50px;text-align:center;top:40px;}
	#firstpage .finger_info{top:120px;}
	#firstpage .Codemain{top:140px;}
	.CHeek{width:100%;max-width:480px;position:absolute; position:fixed;left:0;margin-left:0;z-index:100;top:150px;}
	.Wrong img{ width:45%;}
	.Correct img{ width:50%;}
}

.CTitle{ width:100%; height:130px; background:#f8f8f8; text-align:center;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;}
.CTitle p{ font-size:16px !important; padding-top:30px !important; margin:0 !important}
.CTitle h1{ font-size:30px; color:#2e6ec4; line-height:30px;margin-top:8px !important;}


.FFTitle{ width:100%; height:130px; background:#f8f8f8; text-align:center;}
.FFTitle p{ font-size:16px !important;color:#747474; padding-top:4px !important; margin:0 !important}
.FFTitle h1{ font-size:30px; font-weight:bold; color:#2e6ec4; line-height:30px;margin:0 !important;padding-top:36px !important;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;}

#CodeContent{ width:100%; max-width:850px; margin:0 auto;}
#CodeContent .Explain{ margin-top:50px;}
#CodeContent .Explain .fangweimob{ display:none; width:92%; margin:0 auto}

#CodeContent .Explain img{ width:100%}
#CodeContent .Explain .leftPic{ width:180px; float:left;}
#CodeContent .Explain .leftPic img{ width:115px; margin-left:30px; margin-top:12px;}
#CodeContent .Explain .RightWenzi{ width:590px; float:right}
#CodeContent .Explain .RightWenzi .tishi{ font-size:14px; font-weight:bold;}
#CodeContent .QueryBox{ width:100%; height:112px; background:#fafafa; border:solid 1px #eeeeee; margin-top:30px;}
#CodeContent .QueryBox .QIB{ width:570px; margin:0 auto; margin-top:20px;}
#CodeContent .QueryBox .QIB .gk{ font-size:24px; line-height:60px; color:#2e6ec4; margin-right:20px; font-weight:bold;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;} 
#CodeContent .QueryBox .QIB .Qtext{ width:300px; height:40px; border:solid 1px #cccccc; font-size:18px; font-family:Arial, Helvetica, sans-serif; padding-left:10px;}
#CodeContent .QueryBox .QIB .Qbtn{ width:120px; height:40px; background:#5ac5f0; font-size:16px; color:#FFF;border:none;font-family:Microsoft YaHei,"Microsoft YaHei","微软雅黑",Arial, sans-serif;}




#CodeContent .S01{ margin-top:50px;}
#CodeContent .S01 img{ width:100%}

#CodeContent .S02 h2{ font-size:24px; text-align:center}
#CodeContent .S02 ul{width:600px; margin:0 auto}
#CodeContent .S02 ul li{ float:left; width:260px; margin:30px 20px 0 20px; text-align:center; font-size:14px; line-height:18px;}
#CodeContent .S02 ul li img{ width:100%}
#CodeContent .S02 ul li h3{ font-size:18px; font-weight:bold; line-height:20px;margin-top:20px;}
#CodeContent .S02 ul li h4{ font-size:14px;}

#CodeContent .GG ul{ width:100%;}
#CodeContent .GG ul li{ width:240px;margin:30px 10px 0 10px; }

#CodeContent .S03{ text-align:center; margin-bottom:60px;}
#CodeContent .S03 a{ width:120px; margin:0 auto; display:block}

@media (max-width: 780px){
.FFTitle{height:110px; }
.FFTitle p{ font-size:12px !important; padding-top:0;}
.FFTitle h1{ font-size:24px;line-height:18px;}
#CodeContent .QueryBox{ width:96%; margin:0 auto;margin-top:30px; background:none; border:none; height:auto}

#CodeContent .QueryBox .QIB{ width:94%; margin:0 auto; margin-top:40px;}
#CodeContent .QueryBox .QIB .gk{ display:none}
#CodeContent .QueryBox .QIB .Qtext{ width:70%; font-size:14px}
#CodeContent .QueryBox .QIB .Qbtn{ width:30%;}
#CodeContent .Explain{ margin-top:50px;}
#CodeContent .Explain .leftPic{ width:180px; float:none; margin:0 auto}
#CodeContent .Explain .leftPic img{ width:100%;margin-left:0; margin-top:0;}
#CodeContent .Explain .RightWenzi{ width:90%; float:none; margin:0 auto; margin-top:40px;}

#CodeContent .S02 ul{width:440px;}
#CodeContent .S02 ul li{width:200px; margin:30px 10px 0 10px;}
}

@media (max-width: 600px){
#CodeContent .S02 ul{width:440px;}
#CodeContent .S02 ul li{width:200px; margin:30px 10px 0 10px;}
#CodeContent .Explain .fangwei{ display:none}
#CodeContent .Explain .fangweimob{ display:block}
}

@media (max-width: 480px){
.FFTitle h1{ font-size:18px;line-height:18px;}

#CodeContent .S02 ul{width:100%;}
#CodeContent .S02 ul li{ float:none;width:70%; margin:0 auto; margin-top:50px;}
}