@import url('css/base.css');
html {
  font-size: 10px; scrollbar-color: #c1c1c1 #f1f1f1
}
body {
  background: #25292c; font-size: 1.2rem; font-family: "Microsoft YaHei", Arial, Verdana; color: #25292c; -webkit-text-size-adjust: none; --page-max-width: 1080px; --page-min-width: 960px; --page-gap: 20px; --page-outer-padding: 0px var(--page-gap); --page-inner-padding: var(--page-gap) 0px
}
h1 {
  font-size: 3.2rem
}
h2 {
  font-size: 2.4rem
}
h3 {
  font-size: 2rem
}
h4 {
  font-size: 1.6rem
}
h5 {
  font-size: 1.4rem
}
h6 {
  font-size: 1.2rem
}
.hand {
  cursor: pointer
}
.hide {
  display: none !important
}
header {
  display: block; box-sizing: border-box; width: 100%; min-width: var(--page-min-width); background: #25292c; border-bottom: #005f9b 1px solid
}
header box {
  display: block; box-sizing: border-box; width: 100%; max-width: var(--page-max-width); margin: auto; position: relative; z-index: 100
}
header topbar {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding)
}
header topbar logo {
  width: 100%; padding: var(--page-inner-padding); display: flex; align-items: baseline; font-size: 3rem; color: #fff
}
header topbar logo em {
  font-size: 2.4rem; display: inline-block; padding: 0px 0.4rem; font-style: normal; color: #0092e0
}
header topbar logo u {
  font-size: 1.4rem; display: inline-block; padding: 0px 0.4rem; color: #999; text-decoration: none
}
header mainmenu {
  display: block; box-sizing: border-box; width: 100%; background: linear-gradient(#0280c9 30%, #005f9b); padding: var(--page-outer-padding); border-top: #1a1e1f 6px solid
}
header mainmenu ul {
  display: flex; justify-content: flex-start; flex-wrap: wrap; border-left: #005f9b 1px solid
}
header mainmenu ul li {
  height: 50px; border-left: #0488d4 1px solid; border-right: #005f9b 1px solid
}
header mainmenu ul li:last-of-type {
  border-right: 0px
}
header mainmenu ul li a {
  display: flex; padding: 0px 2rem; font-size: 1.6rem; height: 100%; align-items: center; color: #fff; transition: background .3s ease
}
header mainmenu ul li.on a,
header mainmenu ul li a:hover {
  background: linear-gradient(#016fb0 30%, #004f7c); color: #fff
}
header mainmenu div.qq {
  display: flex; align-items: center; transform: translate(0, -50%); position: absolute; top: 50%; right: 20px; z-index: 100
}
header mainmenu div.qq span.icon {
  display: block; width: 18px; height: 18px; background: url(svg/qq.svg) center center no-repeat; background-size: contain
}
header mainmenu div.qq span.text {
  display: inline-block; padding-left: 6px; color: #eee
}
banner {
  display: block; box-sizing: border-box; width: 100%; min-width: var(--page-min-width); padding: var(--page-outer-padding); background: url(images/bg.grid.blue.gif) top center
}
banner box {
  display: block; box-sizing: border-box; width: 100%; max-width: var(--page-max-width); margin: auto
}
container {
  display: block; box-sizing: border-box; width: 100%; min-width: var(--page-min-width)
}
container h3 {
  width: 100%; font-size: 2.4rem; text-align: center; padding-bottom: var(--page-gap); font-weight: normal; color: #005f9b
}
container h3 span {
  display: inline-block
}
container h3 span u {
  display: block; text-decoration: none
}
container h3 span em {
  display: block; width: 90%; height: 4px; background: rgba(255, 132, 0, .6); margin: -8px auto auto auto
}
footer {
  display: block; box-sizing: border-box; width: 100%; min-width: var(--page-min-width)
}
footer bottom {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding)
}
footer box {
  display: flex; box-sizing: border-box; width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding); align-items: center; justify-content: space-between
}
footer div.copyright {
  font-size: 1.2rem; color: #fff
}
footer div.beian {
  display: flex; align-items: center
}
footer div.beian a {
  font-size: 1.2rem; color: #fff
}
footer div.beian a.license {
  display: inline-block; width: 20px; height: 20px; background: url(images/license.png) center center no-repeat; background-size: contain; margin-right: 10px
}
.version_history {
  width: 100%; padding-bottom: var(--page-gap)
}
.version_history table {
  width: 100%; background: #dfdfdf; border-collapse: separate; border-spacing: 1px 1px; border-radius: 5px; box-shadow: 0px 2px 2px rgb(0 0 0 / 10%)
}
.version_history table th,
.version_history table td {
  padding: 20px
}
.version_history table th {
  font-size: 1.6rem; font-weight: bold; text-align: left; background: #eee; font-weight: normal; color: #25292c
}
.version_history table td {
  font-size: 1.4rem; text-align: left; background: #ffffff; color: #666
}
.version_history table td em {
  display: inline-block; padding-left: 0.5rem; font-size: 1.2rem; color: #999; font-style: normal
}
.version_history table th.tl {
  border-top-left-radius: 5px
}
.version_history table th.tr {
  border-top-right-radius: 5px
}
.version_history table td.bl {
  border-bottom-left-radius: 5px
}
.version_history table td.br {
  border-bottom-right-radius: 5px
}
.version_history div.env {
  width: 100%
}
.version_history div.env span.logo {
  display: block; width: 30px; height: 30px; background: none center center no-repeat; background-size: contain
}
.version_history div.env span.text {
  display: block; font-size: 1.2rem; padding-top: 10px
}
.version_history div.env[env=asp] span.logo {
  background-image: url(svg/asp.svg)
}
.version_history div.env[env=dotnet] span.logo {
  background-image: url(svg/dotnet.svg)
}
.version_history div.env[env=php] span.logo {
  background-image: url(svg/php.svg)
}
.version_history div.env[env=jsp] span.logo {
  background-image: url(svg/java.svg)
}
.version_history div.version {
  font-size: 2rem; color: #25292c; font-family: Georgia
}
.version_history a.link {
  display: inline-block; padding-bottom: 2px; color: #005f9b; border-bottom: #005f9b 1px solid
}
.version_history a.link:hover {
  color: #25292c; border-color: #25292c
}
.home_slogan {
  width: 100%; padding: calc(var(--page-gap) * 3) 0px; overflow: hidden; position: relative; z-index: 100
}
.home_slogan div.text {
  width: 100%; color: #fff
}
.home_slogan div.text h1 {
  font-weight: normal; padding-bottom: 20px; line-height: 100%
}
.home_slogan div.text ol {
  width: 100%
}
.home_slogan div.text ol li {
  padding: 5px 5px 5px 24px; font-size: 1.4rem; line-height: 160%; position: relative
}
.home_slogan div.text ol li::before {
  content: ''; display: block; width: 6px; height: 6px; background: #ffffff; border-radius: 100%; transform: translate(0, -50%); position: absolute; left: 4px; top: 50%; z-index: 100
}
.home_slogan div.text ul {
  width: 480px; margin: 15px 0px; box-sizing: border-box; display: flex; flex-wrap: wrap
}
.home_slogan div.text ul li {
  width: 33.33%; padding: 5px 0px
}
.home_slogan div.text ul li span {
  background: url(svg/checkmark.svg) left center no-repeat; background-size: 14px; display: inline-block; padding-left: 24px; font-size: 1.4rem
}
.home_slogan div.text p {
  font-size: 1.4rem; line-height: 200%
}
.home_slogan div.text a.link {
  display: inline-block; padding: 8px 20px 8px 24px; letter-spacing: 4px; font-size: 1.4rem; color: #fff; background: rgba(0, 0, 0, .6); border-radius: 5px; transition: background .3s ease
}
.home_slogan div.text a.link:hover {
  background: rgba(0, 0, 0, 1)
}
.home_slogan div.image {
  position: absolute; bottom: -2px; right: 20px; z-index: 100
}
.home_slogan div.image img {
  display: block
}
.home_feature {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding); background: url(images/bg.texture.gif) center center; box-shadow: 0px 2px 2px rgb(0 0 0 / 10%)
}
.home_feature div.box {
  width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding)
}
.home_feature div.content {
  width: 100%; display: flex; padding-bottom: calc(var(--page-gap) / 2); align-items: center; justify-content: space-between
}
.home_feature div.content div.item {
  width: 23%; box-sizing: border-box; padding: 20px; background: #fff; border: #bfbfbf 1px solid; border-radius: 5px; box-shadow: 0px 3px 3px rgb(0 0 0 / 10%)
}
.home_feature div.content div.item h4 {
  width: 100%; padding-bottom: 20px; font-size: 2rem; font-weight: normal; color: #25292c; text-align: center
}
.home_feature div.content div.item p {
  padding: 10px 0px; font-size: 1.4rem; color: #999; line-height: 160%; text-align: center
}
.home_feature div.content div.item p.icon img {
  width: 38%; display: block; margin: auto
}
.home_link {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding); background: url(images/bg.eee.gif) #eee top center repeat-x
}
.home_link div.box {
  width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding)
}
.home_link div.content {
  width: 100%; display: flex; align-items: center; justify-content: space-between
}
.home_link div.content div.item {
  width: 18%; box-sizing: border-box; padding: 0px 20px 10px 20px
}
.home_link div.content div.item p.icon {
  width: 100%; height: 80px; display: flex; align-items: center; overflow: hidden
}
.home_link div.content div.item p.icon img {
  width: 40%; display: block; margin: auto
}
.home_link div.content div.item h4 {
  width: 100%; padding: calc(var(--page-gap) / 2) 0px; font-size: 1.6rem; font-weight: normal; color: #999; text-align: center
}
.page_aboutus_slogan {
  width: 100%; padding: calc(var(--page-gap) * 3) 0px; display: flex; align-items: center; justify-content: center
}
.page_aboutus_slogan div.text {
  color: #fff
}
.page_aboutus_slogan div.text h1 {
  font-weight: normal; padding-bottom: 10px; line-height: 100%; text-align: center
}
.page_aboutus_slogan div.text p {
  font-size: 1.4rem; color: #ccc; text-align: center
}
.page_aboutus_slogan div.text ul {
  width: 640px; box-sizing: border-box; display: flex; flex-wrap: wrap; padding-top: 20px
}
.page_aboutus_slogan div.text li {
  width: 16.66%; padding: 5px 0px; text-align: center
}
.page_aboutus_slogan div.text li span {
  background: url(svg/checkmark.svg) left center no-repeat; background-size: 14px; display: inline-block; padding-left: 24px; font-size: 1.4rem
}
.page_aboutus_content {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding); background: url(images/bg.eee.gif) #eee top center repeat-x; overflow: hidden; position: relative; z-index: 100
}
.page_aboutus_content div.box {
  width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding)
}
.page_aboutus_content div.intro {
  width: 100%; font-size: 1.4rem; text-align: center; color: #666; line-height: 160%; padding-bottom: 20px
}
.page_aboutus_content div.timeline {
  width: 100%; position: relative; z-index: 100
}
.page_aboutus_content div.timeline div.line {
  width: 2px; height: 100%; background: #ccc; margin-left: -1px; position: absolute; top: 0px; left: 50%; z-index: 100
}
.page_aboutus_content div.timeline div.item {
  width: 50%; box-sizing: border-box; display: flex; align-items: center; flex-wrap: wrap; padding: var(--page-inner-padding); position: relative; z-index: 100
}
.page_aboutus_content div.timeline div.item:nth-child(even) {
  margin-right: 50%; justify-content: flex-end; padding-right: 5%
}
.page_aboutus_content div.timeline div.item:nth-child(odd) {
  margin-left: 50%; justify-content: flex-start; padding-left: 5%
}
.page_aboutus_content div.timeline div.item div.dot {
  transform: translate(0, -50%); position: absolute; top: 50%; z-index: 100
}
.page_aboutus_content div.timeline div.item div.dot em {
  display: block; width: 14px; height: 14px; background: #ff8400; border: #eee 8px solid; border-radius: 100%
}
.page_aboutus_content div.timeline div.item div.text {
  padding: 10px 20px; background: #fff; border: #bfbfbf 1px solid; border-radius: 5px; box-shadow: 0px 3px 3px rgb(0 0 0 / 10%)
}
.page_aboutus_content div.timeline div.item div.text h4 {
  font-weight: normal; padding-bottom: 4px; font-size: 1.6rem; color: #25292c
}
.page_aboutus_content div.timeline div.item div.text p {
  font-size: 1.4rem; line-height: 160%; color: #005f9b
}
.page_aboutus_content div.timeline div.item div.text b {
  font-weight: normal; color: #ff8400
}
.page_aboutus_content div.timeline div.item div.text p em {
  font-style: normal; font-size: 1.2rem; color: #999
}
.page_aboutus_content div.timeline div.item div.text::after {
  content: ''; display: block; transform: translate(0, -50%); position: absolute; top: 50%; z-index: 100
}
.page_aboutus_content div.timeline div.item:nth-child(even) div.dot {
  right: -15px
}
.page_aboutus_content div.timeline div.item:nth-child(even) div.text {
  text-align: right
}
.page_aboutus_content div.timeline div.item:nth-child(even) div.text::after {
  border-top: 5px solid transparent; border-left: 10px solid #bfbfbf; border-bottom: 5px solid transparent; right: calc(10% - 10px)
}
.page_aboutus_content div.timeline div.item:nth-child(odd) div.dot {
  left: -15px
}
.page_aboutus_content div.timeline div.item:nth-child(odd) div.text::after {
  border-top: 5px solid transparent; border-right: 10px solid #bfbfbf; border-bottom: 5px solid transparent; left: calc(10% - 10px)
}
.page_aboutus_content div.feature {
  width: 100px; height: 100px; background: none center center no-repeat; background-size: contain; opacity: 0.6; position: absolute; top: 50%; left: 50%; z-index: 80
}
.page_aboutus_content div.feature[i='1'] {
  background-image: url(svg/bg.feature.1.svg); margin-left: 350px; margin-top: -350px
}
.page_aboutus_content div.feature[i='2'] {
  background-image: url(svg/bg.feature.2.svg); margin-left: -500px; margin-top: -150px; transform: rotate(45deg)
}
.page_aboutus_content div.feature[i='3'] {
  background-image: url(svg/bg.feature.3.svg); margin-left: 400px; margin-top: 0px; transform: rotate(-60deg)
}
.page_aboutus_content div.feature[i='4'] {
  background-image: url(svg/bg.feature.4.svg); margin-left: -450px; margin-top: 300px; transform: rotate(-30deg)
}
.page_download_slogan {
  width: 100%; padding: calc(var(--page-gap) * 3) 0px; display: flex; align-items: center; justify-content: center
}
.page_download_slogan div.text {
  color: #fff
}
.page_download_slogan div.text h1 {
  font-weight: normal; padding-bottom: 10px; line-height: 100%; text-align: center
}
.page_download_slogan div.text p {
  font-size: 1.4rem; color: #ccc; text-align: center
}
.page_download_slogan div.text p.download {
  padding-top: var(--page-gap)
}
.page_download_slogan div.text p.download a.link {
  display: inline-block; padding: 8px 20px 8px 22px; letter-spacing: 2px; font-size: 1.4rem; color: #fff; background: rgba(0, 0, 0, .6); border-radius: 5px; transition: background .3s ease
}
.page_download_slogan div.text p.download a.link:hover {
  background: rgba(0, 0, 0, 1)
}
.page_download_slogan div.text p.repository {
  padding: var(--page-inner-padding)
}
.page_download_slogan div.text p.repository a {
  display: inline-block; width: 24px; height: 24px; margin: 0px 5px; vertical-align: top; background: none center center no-repeat; background-size: contain; opacity: 0.7; transition: opacity .3s ease
}
.page_download_slogan div.text p.repository a.github {
  background-image: url(svg/github.svg)
}
.page_download_slogan div.text p.repository a.gitee {
  background-image: url(svg/gitee.svg)
}
.page_download_slogan div.text p.repository a:hover {
  opacity: 1
}
.page_download_ubuntu {
  width: 100%; box-sizing: border-box; padding: var(--page-outer-padding); background: url(images/bg.texture.gif) center center; box-shadow: 0px 2px 2px rgb(0 0 0 / 10%)
}
.page_download_ubuntu div.box {
  width: 100%; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; max-width: var(--page-max-width); margin: auto; transform: translate(0px, -30px); background: #eee; border: #bfbfbf 1px solid; border-radius: 5px; box-shadow: 0px 3px 3px rgb(0 0 0 / 10%)
}
.page_download_ubuntu div.box div.logo {
  width: 28%; display: flex; align-items: center; justify-content: center
}
.page_download_ubuntu div.box div.logo img {
  display: block; width: 40%
}
.page_download_ubuntu div.box div.content {
  width: 72%; box-sizing: border-box; padding: 20px; background: #fff; border-radius: 5px
}
.page_download_ubuntu div.box div.content h4 {
  font-size: 1.8rem; line-height: 160%; font-weight: normal; color: #005f9b
}
.page_download_ubuntu div.box div.content div.cmd {
  margin: 10px 0px 20px 0px; padding: 10px; font-size: 1.6rem; background: #25292c; color: #fff; font-family: Georgia
}
.page_download_ubuntu div.box div.content h5 {
  font-size: 1.6rem; line-height: 160%; font-weight: normal; color: #666
}
.page_download_ubuntu div.box div.content div.tips {
  width: 100%; padding-top: 10px
}
.page_download_ubuntu div.box div.content div.tips em {
  display: inline-block; background: url(svg/checkmark.svg) left center no-repeat; background-size: 14px; padding: 0px 24px; font-size: 1.4rem; font-style: normal;
}
.page_download_ubuntu div.box div.content div.tips em b {
  font-weight: normal; color: #ff8400
}
.page_download_content {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding); background: url(images/bg.eee.gif) #eee top center repeat-x; overflow: hidden; position: relative; z-index: 100
}
.page_download_content div.box {
  width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding)
}
.page_download_content div.box p.tips {
  font-size: 1.4rem; text-align: center; color: #666; padding-bottom: var(--page-gap)
}
.page_help_slogan {
  width: 100%; padding: calc(var(--page-gap) * 3) 0px; display: flex; align-items: center; justify-content: center
}
.page_help_slogan div.text {
  color: #fff
}
.page_help_slogan div.text h1 {
  font-weight: normal; padding-bottom: 10px; line-height: 100%; text-align: center
}
.page_help_slogan div.text p {
  font-size: 1.4rem; color: #ccc; text-align: center
}
.page_help_slogan div.text p.open {
  padding-top: var(--page-gap)
}
.page_help_slogan div.text p.open a.link {
  display: inline-block; padding: 8px 20px 8px 22px; letter-spacing: 2px; font-size: 1.4rem; color: #fff; background: rgba(0, 0, 0, .6); border-radius: 5px; transition: background .3s ease
}
.page_help_slogan div.text p.open a.link:hover {
  background: rgba(0, 0, 0, 1)
}
.page_help_content {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding); background: url(images/bg.eee.gif) #eee top center repeat-x; overflow: hidden; position: relative; z-index: 100
}
.page_help_content div.box {
  width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding)
}
.page_help_content div.box p.tips {
  font-size: 1.4rem; text-align: center; color: #666; padding-bottom: var(--page-gap)
}
.page_support_slogan {
  width: 100%; padding: calc(var(--page-gap) * 3) 0px; display: flex; align-items: center; justify-content: center
}
.page_support_slogan div.text {
  color: #fff
}
.page_support_slogan div.text h1 {
  font-weight: normal; padding-bottom: 10px; line-height: 100%; text-align: center
}
.page_support_slogan div.text p {
  font-size: 1.4rem; color: #ccc; text-align: center
}
.page_support_slogan div.text p.open {
  padding-top: var(--page-gap)
}
.page_support_slogan div.text p.open a.link {
  display: inline-block; padding: 8px 20px 8px 22px; letter-spacing: 2px; font-size: 1.4rem; color: #fff; background: rgba(0, 0, 0, .6); border-radius: 5px; transition: background .3s ease
}
.page_support_slogan div.text p.open a.link:hover {
  background: rgba(0, 0, 0, 1)
}
.page_support_content {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding); background: url(images/bg.eee.gif) #eee top center repeat-x; overflow: hidden; position: relative; z-index: 100
}
.page_support_content div.box {
  width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding)
}
.page_support_content div.box p.tips {
  font-size: 1.4rem; text-align: center; color: #666; padding-bottom: var(--page-gap)
}
.page_support_content div.box p.tips a {
  color: #666
}
.page_support_content div.box p.tips a:hover {
  color: #005f9b
}
.page_support_content div.pricing {
  width: 100%; padding-bottom: var(--page-gap); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap
}
.page_support_content div.pricing div.item {
  width: 31%; box-sizing: border-box; padding: 180px 20px 40px 20px; background: none #fff top center no-repeat; background-size: 140px; border: #bfbfbf 1px solid; border-radius: 5px; box-shadow: 0px 3px 3px rgb(0 0 0 / 10%)
}
.page_support_content div.pricing div.item.bronze {
  background-image: url(svg/bronze.svg)
}
.page_support_content div.pricing div.item.silver {
  background-image: url(svg/silver.svg)
}
.page_support_content div.pricing div.item.gold {
  background-image: url(svg/gold.svg)
}
.page_support_content div.pricing div.item h4 {
  font-size: 2.4rem; font-weight: normal; color: #005f9b; padding-bottom: 10px
}
.page_support_content div.pricing div.item p.text {
  font-size: 1.4rem; color: #666
}
.page_support_content div.pricing div.item div.price {
  font-size: 4rem; padding: var(--page-inner-padding); color: #ff8400; font-family: Georgia
}
.page_support_content div.pricing div.item div.price em {
  font-size: 1.4rem; font-style: normal; color: #666
}
.page_support_content div.pricing div.item ul li {
  line-height: 200%; background: url(svg/checkmark.svg) left center no-repeat; background-size: 14px; padding-left: 24px; font-size: 1.4rem
}
.page_support_content div.pricing div.item ul li b {
  font-weight: normal; color: #ff8400
}
.page_contactus_slogan {
  width: 100%; padding: calc(var(--page-gap) * 3) 0px; display: flex; align-items: center; justify-content: center
}
.page_contactus_slogan div.text {
  color: #fff
}
.page_contactus_slogan div.text h1 {
  font-weight: normal; padding-bottom: 10px; line-height: 100%; text-align: center
}
.page_contactus_content {
  display: block; box-sizing: border-box; width: 100%; padding: var(--page-outer-padding); background: url(images/bg.eee.gif) #eee top center repeat-x; overflow: hidden; position: relative; z-index: 100
}
.page_contactus_content div.box {
  width: 100%; max-width: var(--page-max-width); margin: auto; padding: var(--page-inner-padding)
}
.page_contactus_content div.box p.tips {
  font-size: 1.4rem; text-align: center; color: #666; padding-bottom: var(--page-gap)
}
.page_contactus_content div.box div.text {
  width: 100%; text-align: center; padding-bottom: calc(var(--page-gap) * 2)
}
.page_contactus_content div.box div.text a.link {
  font-size: 2rem; color: #ff8400; display: inline-block; padding-bottom: 2px; border-bottom: transparent 2px solid
}
.page_contactus_content div.box div.text a.link:hover {
  color: #25292c; border-color: #25292c
}
.page_contactus_content div.box div.text span.qq {
  font-size: 2rem; color: #ff8400
}
.page_contactus_content div.box div.text span.qrcode img {
  width: 200px; border: #dfdfdf 1px solid
}
.page_contactus_content div.feature {
  width: 100px; height: 100px; background: none center center no-repeat; background-size: contain; opacity: 0.6; position: absolute; top: 50%; left: 50%; z-index: 80
}
.page_contactus_content div.feature[i='2'] {
  background-image: url(svg/bg.feature.2.svg); margin-left: -500px; margin-top: -150px; transform: rotate(45deg)
}
.page_contactus_content div.feature[i='3'] {
  background-image: url(svg/bg.feature.3.svg); margin-left: 400px; margin-top: 0px; transform: rotate(-60deg)
}