-
+
One big reason he chose Kubernetes was getting a level of abstraction that would enable the company to “enable a hybrid cloud strategy including multiple public clouds and an on-premise VMWare multi data center environment to meet the needs of the business,” he says. Another factor was how much the Kubernetes ecosystem has matured over the past couple of years. “We have spent a lot of time and energy around making logging, monitoring and alerting production ready to give us insights into applications’ well-being,” says Linder. The team has added
Prometheus for monitoring and
Jaeger for tracing, to work alongside the company’s existing tool sets: Zenoss, New Relic and ELK.
With the emphasis on common tooling, “We are getting to the place where we can one-click deploy an entire data center – the compute, network, Kubernetes, logging, monitoring and all the apps,” says Linder. “We have really enabled a platform thinking based approach to allowing applications to consume common tools and services. A new application can be onboarded in about an hour using common tooling and CI/CD processes. The gains on that side have been huge. Before, it took at least a few days to get things sorted for a new application to deploy. That does not consider the training of our operations staff to manage this new application. It is two or three orders of magnitude of savings in time and cost, and operationally it has given us the opportunity to let a core team of talented operations engineers manage common infrastructure and tooling to make our applications available at web scale.”
@@ -86,7 +86,7 @@ With the emphasis on common tooling, “We are getting to the place where we can
The team launched its first applications on Kubernetes in Sling TV’s two internal data centers in the early part of Q1 2018 and began to enable AWS as a data center option. The company plans to expand into other public clouds in the future.
The first application that went into production is a web socket-based back-end notification service. “It allows back-end changes to trigger messages to our clients in the field without the polling,” says Linder. “We are talking about very high volumes of messages with this application. Without something like Kubernetes to be able to scale up and down, as well as just support that overall workload, that is pretty hard to do. I would almost be so bold as to say that most of these applications that we are building now would not have been possible without the cloud native patterns and the flexibility that Kubernetes enables.”
- Linder oversees three teams working together on building the next-generation platform: a platform engineering team; an enterprise middleware services team; and a big data and analytics team. “We have really tried to bring everything together to be able to have a client application interact with a cloud native middleware layer. That middleware layer must run on a platform, consume platform services and then have logs and events monitored by an artificial agent to keep things running smoothly,” says Linder.
+ Linder oversees three teams working together on building the next-generation platform: a platform engineering team; an enterprise middleware services team; and a big data and analytics team. “We have really tried to bring everything together to be able to have a client application interact with a cloud native middleware layer. That middleware layer must run on a platform, consume platform services and then have logs and events monitored by an artificial agent to keep things running smoothly,” says Linder.
@@ -100,7 +100,7 @@ The first application that went into production is a web socket-based back-end n
Ultimately, this undertaking is about “trying to marry Kubernetes with AI to enable web scale that just works,” he adds. “We want the artificial agents and the big data platform using the actual logs and events coming out of the applications, Kubernetes, the infrastructure, backing services and changes to the environment to make decisions like, ‘Hey we need more capacity for this service so please add more nodes.’ From a platform perspective, if you are truly doing web scale stuff and you are not using AI and big data, in my opinion, you are going to implode under your own weight. It is not a question of if, it is when. If you are in a ‘millions of users’ sort of environment, that implosion is going to be catastrophic. We are on our way to this goal and have learned a lot along the way.”
For Sling TV, moving to cloud native has been exactly what they needed. “We have to be able to react to changes and hiccups in the matrix,” says Linder. “It is the foundation for our ability to deliver a high-quality service for our customers. Building intelligent platforms, tools and clients in the field consuming those services has got to be part of all of this. In my eyes that is a big part of what cloud native is all about. It is taking these distributed, potentially unreliable entities and enabling a robust customer experience they expect.”
-
+
diff --git a/content/en/case-studies/ygrene/index.html b/content/en/case-studies/ygrene/index.html
index a2365026c19..6f15b7fe9b7 100644
--- a/content/en/case-studies/ygrene/index.html
+++ b/content/en/case-studies/ygrene/index.html
@@ -7,7 +7,7 @@ cid: caseStudies
css: /css/style_case_studies.css
logo: ygrene_featured_logo.png
featured: true
-weight: 2
+weight: 48
quote: >
We had to change some practices and code, and the way things were built, but we were able to get our main systems onto Kubernetes in a month or so, and then into production within two months. That’s very fast for a finance company.
---
@@ -34,14 +34,14 @@ quote: >
Solution
Moving from an Engine Yard platform and Amazon Elastic Beanstalk, the Ygrene team embraced cloud native technologies and practices:
Kubernetes to help scale out vertically and distribute workloads,
Notary to put in build-time controls and get trust on the Docker images being used with third-party dependencies, and
Fluentd for "observing every part of our stack," all running on
Amazon EC2 Spot.
-
+
Impact
- Before, deployments typically took three to four hours, and two or three months’ worth of work would be deployed at low-traffic times every week or two weeks. Now, they take five minutes for Kubernetes, and an hour for the overall deploy with smoke testing. And "we’re able to deploy three or four times a week, with just one week’s or two days’ worth of work," Adams says. "We’re deploying during the work week, in the daytime and without any downtime. We had to ask for business approval to take the systems down, even in the middle of the night, because people could be doing loans. Now we can deploy, ship code, and migrate databases, all without taking the system down. The company gets new features without worrying that some business will be lost or delayed." Additionally, by using the kops project, Ygrene can now run its Kubernetes clusters with AWS EC2 Spot, at a tenth of the previous cost. These cloud native technologies have "changed the game for scalability, observability, and security—we’re adding new data sources that are very secure," says Adams. "Without Kubernetes, Notary, and Fluentd, we couldn’t tell our investors and team members that we knew what was going on."
-
+ Before, deployments typically took three to four hours, and two or three months’ worth of work would be deployed at low-traffic times every week or two weeks. Now, they take five minutes for Kubernetes, and an hour for the overall deploy with smoke testing. And "we’re able to deploy three or four times a week, with just one week’s or two days’ worth of work," Adams says. "We’re deploying during the work week, in the daytime and without any downtime. We had to ask for business approval to take the systems down, even in the middle of the night, because people could be doing loans. Now we can deploy, ship code, and migrate databases, all without taking the system down. The company gets new features without worrying that some business will be lost or delayed." Additionally, by using the kops project, Ygrene can now run its Kubernetes clusters with AWS EC2 Spot, at a tenth of the previous cost. These cloud native technologies have "changed the game for scalability, observability, and security—we’re adding new data sources that are very secure," says Adams. "Without Kubernetes, Notary, and Fluentd, we couldn’t tell our investors and team members that we knew what was going on."
+
@@ -57,7 +57,7 @@ quote: >
In less than a decade, Ygrene has funded more than $1 billion in loans for renewable energy projects.
A
PACE (Property Assessed Clean Energy) financing company, "We take the equity in a home or a commercial building, and use it to finance property improvements for anything that saves electricity, produces electricity, saves water, or reduces carbon emissions," says Development Manager Austin Adams.
In order to approve those loans, the company processes an enormous amount of underwriting data. "We have tons of different points that we have to validate about the property, about the company, or about the person," Adams says. "So we have lots of data sources that are being aggregated, and we also have lots of systems that need to churn on that data in real time."
-By 2017, deployments and scalability had become pain points. The company was utilizing massive servers, and "we just reached the limit of being able to scale them vertically," he says. Migrating to AWS Elastic Beanstalk didn’t solve the problem: "The Scala services needed a lot of data from the main Ruby on Rails services and from different vendors, so they were asking for information from our Ruby services at a rate that those services couldn’t handle. We had lots of configuration misses with Elastic Beanstalk as well. It just came to a head, and we realized we had a really unstable system."
+By 2017, deployments and scalability had become pain points. The company was utilizing massive servers, and "we just reached the limit of being able to scale them vertically," he says. Migrating to AWS Elastic Beanstalk didn’t solve the problem: "The Scala services needed a lot of data from the main Ruby on Rails services and from different vendors, so they were asking for information from our Ruby services at a rate that those services couldn’t handle. We had lots of configuration misses with Elastic Beanstalk as well. It just came to a head, and we realized we had a really unstable system."
@@ -68,7 +68,7 @@ By 2017, deployments and scalability had become pain points. The company was uti
-
+
Adams along with the rest of the team set out to find a solution that would be transformational, but "wouldn’t require us to make huge refactors to the code base," he says. And as a finance company, Ygrene needed security as much as scalability. They found the answer by embracing cloud native technologies: Kubernetes to help scale out vertically and distribute workloads, Notary to achieve reliable security at every level, and Fluentd for observability. "Kubernetes was where the community was going, and we wanted to be future proof," says Adams.
With Kubernetes, the team was able to quickly containerize the Ygrene application with Docker. "We had to change some practices and code, and the way things were built," Adams says, "but we were able to get our main systems onto Kubernetes in a month or so, and then into production within two months. That’s very fast for a finance company."
How? Cloud native has "changed the game for scalability, observability, and security—we’re adding new data sources that are very secure," says Adams. "Without Kubernetes, Notary, and Fluentd, we couldn’t tell our investors and team members that we knew what was going on."
diff --git a/resources/_gen/assets/sass/cn/sass/styles.sass_a6e533854c4de092afe9278041939937.content b/resources/_gen/assets/sass/cn/sass/styles.sass_a6e533854c4de092afe9278041939937.content
new file mode 100644
index 00000000000..f72db6b2e74
--- /dev/null
+++ b/resources/_gen/assets/sass/cn/sass/styles.sass_a6e533854c4de092afe9278041939937.content
@@ -0,0 +1,1937 @@
+html, body {
+ margin: 0;
+ padding: 0; }
+
+input, button {
+ outline: none; }
+
+button {
+ cursor: pointer; }
+
+ul, li {
+ list-style: none; }
+
+ul {
+ margin: 0;
+ padding: 0; }
+
+a {
+ text-decoration: none; }
+
+.clear {
+ display: block;
+ clear: both; }
+
+.light-text {
+ color: white; }
+
+.right {
+ float: right; }
+
+.left {
+ float: left; }
+
+.center {
+ text-align: center; }
+
+*, .button {
+ box-sizing: border-box;
+ font-family: "Roboto", sans-serif;
+ background: none;
+ margin: 0;
+ border: 0; }
+
+body {
+ font-family: "Roboto", sans-serif; }
+
+h1, h2, h5, p {
+ font-weight: 300; }
+
+h3, h4 {
+ font-weight: 400; }
+
+html, body {
+ margin: 0;
+ padding: 0; }
+
+input, button {
+ outline: none; }
+
+button {
+ cursor: pointer; }
+
+ul, li {
+ list-style: none; }
+
+ul {
+ margin: 0;
+ padding: 0; }
+
+a {
+ text-decoration: none; }
+
+.clear {
+ display: block;
+ clear: both; }
+
+.light-text {
+ color: white; }
+
+.right {
+ float: right; }
+
+.left {
+ float: left; }
+
+.center {
+ text-align: center; }
+
+h1 {
+ font-size: 32px;
+ line-height: 40px; }
+
+h2 {
+ font-size: 28px;
+ line-height: 60px; }
+
+h3 {
+ font-size: 24px;
+ line-height: 32px; }
+
+h4 {
+ font-size: 20px;
+ line-height: 40px; }
+
+h5 {
+ font-size: 16px;
+ line-height: 36px; }
+
+p {
+ font-size: 14px;
+ line-height: 22px; }
+
+section, header, #vendorStrip {
+ padding-left: 20px;
+ padding-right: 20px; }
+ section main, header main, #vendorStrip main {
+ width: 100%;
+ max-width: 100%; }
+
+header {
+ height: 80px; }
+
+.nav-buttons {
+ height: 80px;
+ line-height: 80px; }
+ .nav-buttons .button + * {
+ margin-left: 30px; }
+
+#hamburger {
+ width: 50px;
+ height: 50px; }
+
+#mainNav {
+ padding: 140px 0 30px; }
+ #mainNav h5 {
+ margin-bottom: 1em; }
+ #mainNav h3 {
+ margin-bottom: 0.6em; }
+ #mainNav .nav-box {
+ width: 20%; }
+ #mainNav .nav-box + .nav-box {
+ margin-left: calc(20% / 3); }
+ #mainNav main + main {
+ margin-top: 60px; }
+ #mainNav .left .button {
+ height: 50px;
+ line-height: 50px;
+ font-size: 18px; }
+
+.open-nav #tryKubernetes, .y-enough #tryKubernetes {
+ margin-left: 30px; }
+
+#hero {
+ padding-top: 80px; }
+
+#docs #hero h1, #docs #hero h5 {
+ padding-left: 20px;
+ padding-right: 20px; }
+
+#vendorStrip {
+ height: 88px;
+ line-height: 88px;
+ font-size: 16px; }
+
+body {
+ background-color: white; }
+
+section {
+ position: relative;
+ background-color: white; }
+
+section main, header main, footer main {
+ position: relative;
+ margin: auto; }
+
+p {
+ font-size: 14px;
+ font-weight: 400; }
+
+.button {
+ display: inline-block;
+ border-radius: 6px;
+ padding: 0 20px;
+ line-height: 40px;
+ color: white;
+ background-color: #3371e3;
+ text-decoration: none; }
+
+#cellophane {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ display: none; }
+
+header {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ z-index: 8888;
+ background-color: transparent;
+ box-shadow: 0 0 0 transparent;
+ overflow: hidden;
+ transition: 0.3s;
+ text-align: center; }
+
+.logo {
+ position: relative;
+ float: left;
+ display: block;
+ width: 180px;
+ height: 88px;
+ top: 0;
+ left: 0;
+ transform: none;
+ background-image: url(/images/nav_logo.svg);
+ background-size: contain;
+ background-position: center center;
+ background-repeat: no-repeat; }
+
+#docs .flyout-button {
+ position: fixed;
+ top: 20px;
+ left: 20px;
+ width: 50px;
+ height: 50px;
+ background-image: url(/images/toc_icon.png);
+ background-position: center center;
+ background-repeat: no-repeat;
+ background-size: auto;
+ border-radius: 50%;
+ transition: 0.3s;
+ z-index: 99999; }
+
+#docs.open-nav .flyout-button {
+ display: none; }
+
+#docs .logo {
+ position: absolute;
+ top: 40px;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ display: block;
+ width: 45px;
+ height: 44px;
+ background-image: url(/images/favicon.png); }
+
+#docs.flip-nav .flyout-button {
+ background-image: url(/images/toc_icon_grey.png); }
+
+.nav-buttons {
+ float: right; }
+
+#viewDocs, #tryKubernetes {
+ display: none; }
+
+#viewDocs {
+ border: 2px solid white;
+ background-color: transparent;
+ transition: 0.3s; }
+ #viewDocs:hover {
+ background-color: white;
+ color: #303030; }
+
+#tryKubernetes {
+ width: 0;
+ padding: 0 0;
+ border: 1px solid transparent;
+ background-color: transparent;
+ text-align: center;
+ white-space: nowrap;
+ vertical-align: middle;
+ overflow: hidden;
+ transition: 0.3s; }
+
+#hamburger {
+ display: inline-block;
+ position: relative;
+ vertical-align: middle;
+ padding: 0;
+ border: 0;
+ background: none; }
+ #hamburger div, #hamburger:before, #hamburger:after {
+ position: absolute;
+ left: 15%;
+ width: 70%;
+ height: 2px;
+ background-color: #3371e3;
+ transition: 0.3s;
+ content: ""; }
+ #hamburger div {
+ top: calc(50% - 1px); }
+ #hamburger:before {
+ top: 24%; }
+ #hamburger:after {
+ bottom: 24%; }
+ #hamburger:hover div, #hamburger:hover:before, #hamburger:hover:after {
+ background-color: white; }
+
+#mainNav h5 {
+ color: #3371e3;
+ font-weight: normal; }
+
+#mainNav main {
+ white-space: nowrap;
+ overflow: hidden;
+ clear: both; }
+
+#mainNav .nav-box {
+ float: left;
+ white-space: normal; }
+
+#mainNav h3 a {
+ color: #3371e3;
+ text-decoration: none; }
+
+ul.global-nav {
+ display: none; }
+ ul.global-nav li {
+ display: inline-block;
+ margin-right: 14px; }
+ ul.global-nav li a {
+ color: #fff;
+ font-weight: 400;
+ padding: 0;
+ position: relative; }
+ ul.global-nav li a.active:after {
+ position: absolute;
+ width: 100%;
+ height: 2px;
+ content: '';
+ bottom: -4px;
+ left: 0;
+ background: #fff; }
+ ul.global-nav li a .ui-icon {
+ filter: brightness(0) invert(1); }
+ ul.global-nav li ul {
+ display: none;
+ position: fixed;
+ top: 40px;
+ text-align: left; }
+ ul.global-nav li ul li {
+ display: block;
+ height: 28px; }
+ ul.global-nav li ul li a {
+ background: #303030;
+ color: #fff;
+ padding: 7px; }
+ ul.global-nav li ul li:last-child a {
+ border-radius: 7px; }
+ ul.global-nav li:hover ul {
+ display: block; }
+
+.flip-nav ul.global-nav li a,
+.open-nav ul.global-nav li a {
+ color: #303030; }
+
+.flip-nav ul.global-nav li a .ui-icon {
+ filter: brightness(0); }
+
+.flip-nav ul.global-nav li ul li a {
+ background: #fff;
+ color: #303030; }
+
+.flip-nav ul.global-nav li a.active:after,
+.flip-nav ul.global-nav li ul li a.active:after,
+.open-nav ul.global-nav li a.active:after {
+ background: #3371e3; }
+
+.flip-nav header {
+ background-color: white; }
+
+.open-nav body {
+ overflow: hidden; }
+
+.open-nav #cellophane {
+ display: block;
+ z-index: 9998; }
+
+.open-nav header {
+ background-color: #e8e8e8;
+ z-index: 9999; }
+
+.open-nav #hamburger div {
+ opacity: 0; }
+
+.open-nav #hamburger:before, .open-nav #hamburger:after {
+ left: 12px;
+ transform-origin: 0 1px; }
+
+.open-nav #hamburger:before {
+ transform: rotate(45deg); }
+
+.open-nav #hamburger:after {
+ transform: rotate(-45deg); }
+
+.open-nav #tryKubernetes, .y-enough #tryKubernetes {
+ width: 150px;
+ background-color: #3371e3;
+ border-color: #3371e3; }
+
+.flip-nav header, .open-nav header {
+ box-shadow: 0 1px 2px #4c4c4c; }
+
+.flip-nav #viewDocs, .open-nav #viewDocs {
+ border-color: #303030;
+ color: #303030; }
+ .flip-nav #viewDocs:hover, .open-nav #viewDocs:hover {
+ border-color: #3371e3;
+ background-color: #3371e3;
+ color: white; }
+
+.flip-nav #hamburger:hover div, .flip-nav #hamburger:hover:before, .flip-nav #hamburger:hover:after, .open-nav #hamburger:hover div, .open-nav #hamburger:hover:before, .open-nav #hamburger:hover:after {
+ background-color: #303030; }
+
+#hero {
+ background-image: url(/images/texture.png);
+ background-color: #303030;
+ text-align: center;
+ padding-left: 0;
+ padding-right: 0;
+ margin-bottom: 0;
+ position: relative; }
+ #hero.bot-bar:after {
+ display: block;
+ margin-bottom: -20px;
+ height: 8px;
+ width: 100%;
+ background-color: rgba(255, 255, 255, 0.1);
+ content: ''; }
+ #hero.no-sub h5 {
+ display: none; }
+ #hero.no-sub h1 {
+ margin-bottom: 20px; }
+
+#home #hero:after {
+ display: none; }
+
+#vendorStrip {
+ position: relative;
+ background-color: rgba(255, 255, 255, 0.1);
+ font-weight: 100;
+ white-space: nowrap;
+ text-align: center; }
+ #vendorStrip li a {
+ color: rgba(255, 255, 255, 0.5); }
+ #vendorStrip li a.YAH {
+ color: white;
+ position: relative; }
+
+footer {
+ width: 100%;
+ background-image: url(/images/texture.png);
+ background-color: #303030; }
+ footer main {
+ padding: 20px 0; }
+ footer nav a {
+ width: 100%;
+ text-align: center;
+ display: inline-block;
+ margin: 10px 0;
+ font-size: 24px;
+ font-weight: 300;
+ color: white;
+ text-decoration: none; }
+ footer .social {
+ margin: 20px 0; }
+ footer .social div {
+ text-align: center;
+ margin-bottom: 20px; }
+ footer .social div:last-child {
+ margin: 30px 0; }
+ footer .social span {
+ display: block;
+ margin-bottom: 8px; }
+ footer .social input {
+ text-align: center; }
+
+#search, #wishField {
+ background-color: transparent;
+ padding: 10px;
+ font-size: 16px;
+ font-weight: 100;
+ color: white;
+ border: 1px solid white;
+ transition: 0.3s; }
+ #search:focus, #wishField:focus {
+ background-color: #f7f7f7;
+ color: #303030; }
+
+.social a {
+ display: inline-block;
+ background-image: url(/images/social_sprite.png);
+ background-repeat: no-repeat;
+ background-size: auto;
+ width: 50px;
+ height: 50px;
+ border-radius: 5px;
+ margin-right: 10px; }
+ .social a:hover {
+ background-color: #fff; }
+ .social a span {
+ position: absolute;
+ display: block;
+ height: 0;
+ overflow: hidden; }
+ .social a.button {
+ background-image: none;
+ width: auto;
+ height: auto; }
+ .social a.button:hover {
+ color: #3371e3; }
+
+a.twitter {
+ background-position: 0 0; }
+ a.twitter:hover {
+ background-position: 0 100%; }
+
+a.stack-overflow {
+ background-position: -50px 0; }
+ a.stack-overflow:hover {
+ background-position: -50px 100%; }
+
+a.slack {
+ background-position: -100px 0; }
+ a.slack:hover {
+ background-position: -100px 100%; }
+
+a.github {
+ background-position: -150px 0; }
+ a.github:hover {
+ background-position: -150px 100%; }
+
+a.mailing-list {
+ background-position: -200px 0; }
+ a.mailing-list:hover {
+ background-position: -200px 100%; }
+
+a.calendar {
+ background-position: -250px 0; }
+ a.calendar:hover {
+ background-position: -250px 100%; }
+
+#viewDocs {
+ display: none; }
+
+section {
+ background-color: white; }
+
+#hero {
+ background-color: #303030; }
+ #hero h5 {
+ margin: 20px 0;
+ line-height: 28px; }
+
+#vendorStrip {
+ position: relative; }
+ #vendorStrip ul {
+ float: left; }
+ #vendorStrip li {
+ display: inline-block;
+ height: 100%; }
+ #vendorStrip a {
+ display: block;
+ height: 100%;
+ color: white;
+ font-size: 0.75em;
+ font-weight: bold; }
+ #vendorStrip li + li {
+ margin-left: 0; }
+
+#docs #vendorStrip {
+ line-height: 44px; }
+ #docs #vendorStrip ul {
+ float: none; }
+ #docs #vendorStrip #searchBox {
+ float: none;
+ display: block;
+ width: 80%;
+ margin: 0 auto;
+ height: 44px;
+ line-height: 44px;
+ position: relative; }
+ #docs #vendorStrip #searchBox:before {
+ position: absolute;
+ width: 15px;
+ height: 15px;
+ content: '';
+ right: 8px;
+ top: 7px;
+ background-image: url(/images/search-icon.svg);
+ background-repeat: no-repeat;
+ background-size: 100% 100%;
+ z-index: 1; }
+ #docs #vendorStrip #search {
+ width: 100%;
+ padding: 0 10px;
+ height: 30px;
+ line-height: 30px;
+ font-size: 16px;
+ vertical-align: top;
+ background: #fff;
+ border: none;
+ border-radius: 4px;
+ position: relative; }
+
+#encyclopedia {
+ position: relative;
+ padding: 50px 20px 20px 20px;
+ overflow: hidden;
+ font-size: 14px; }
+ #encyclopedia > div {
+ height: 100%; }
+
+#docsToc {
+ position: fixed;
+ background-color: white;
+ top: 0;
+ left: 0;
+ width: 0;
+ height: 100vh;
+ overflow: hidden;
+ padding: 50px 0;
+ z-index: 999999;
+ transition: 0.3s; }
+ #docsToc .yah > .title {
+ background-color: #f7f7f7;
+ border-left: 3px solid #3371e3;
+ padding: 7.5px 10px 7.5px 18px;
+ margin-left: -3px;
+ color: #3371e3; }
+
+.open-toc body {
+ overflow: hidden; }
+
+.open-toc #docsToc {
+ padding: 50px 20px;
+ width: 400px;
+ max-width: 100vw;
+ overflow-y: auto; }
+
+.pi-accordion > .container:first-child > .item:first-child > .title:first-child {
+ padding-left: 0;
+ font-size: 1.5em;
+ font-weight: 700; }
+
+.pi-accordion > .container:first-child > .item.yah:first-child > .title:first-child {
+ margin-left: -20px !important; }
+
+.pi-accordion .item {
+ overflow: hidden; }
+
+.pi-accordion .title {
+ color: #303030;
+ position: relative;
+ padding: 7.5px 10px 7.5px 18px;
+ cursor: pointer;
+ transition: 0.3s; }
+ .pi-accordion .title:hover {
+ color: #3371e3; }
+
+.pi-accordion a.item > .title {
+ color: black; }
+ .pi-accordion a.item > .title:hover {
+ color: #3371e3; }
+
+.pi-accordion div.item > .title:before {
+ content: "";
+ position: absolute;
+ top: 12px;
+ left: 2px;
+ border-style: solid;
+ border-width: 5px 0 5px 8px;
+ border-color: transparent transparent transparent #3371e3;
+ transform: rotate(0deg);
+ transition: 0.3s; }
+
+.pi-accordion .wrapper {
+ position: relative;
+ width: 100%;
+ transition: height 0.3s; }
+
+.pi-accordion .content {
+ padding-left: 20px;
+ opacity: 0;
+ transition: 0.3s; }
+
+.pi-accordion .item.on > .title:before {
+ transform: rotate(90deg); }
+
+.pi-accordion .item.on > .wrapper > .content {
+ opacity: 1; }
+
+dt {
+ margin-bottom: 8px; }
+
+dd {
+ margin-bottom: 16px; }
+
+.pi-pushmenu {
+ display: none;
+ position: fixed;
+ top: 0;
+ width: 100%;
+ height: 100%;
+ opacity: 0;
+ transition: opacity 0.3s; }
+ .pi-pushmenu.on {
+ opacity: 1; }
+ .pi-pushmenu .overlay {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 0, 0, 0.4); }
+ .pi-pushmenu .sled {
+ position: absolute;
+ top: 0;
+ width: 0;
+ height: 100%;
+ background-color: white;
+ overflow: auto;
+ transition: 0.3s; }
+ .pi-pushmenu.on .sled {
+ width: 400px;
+ max-width: 100vw; }
+ .pi-pushmenu .top-bar {
+ height: 0;
+ line-height: 60px;
+ background-color: #444; }
+ .pi-pushmenu ul {
+ margin-top: 25px; }
+ .pi-pushmenu li {
+ position: relative;
+ display: block;
+ width: 100%;
+ min-height: 45px;
+ padding: 0 60px 0 20px;
+ border-bottom: 1px solid #cccccc; }
+ .pi-pushmenu a {
+ display: inline-block;
+ width: 100%;
+ height: 45px;
+ line-height: 45px;
+ font-family: "Roboto", sans-serif;
+ font-size: 20px;
+ color: #3371e3; }
+ .pi-pushmenu .button {
+ background: none;
+ padding: 0; }
+ .pi-pushmenu ul ul {
+ padding: 0 20px; }
+ .pi-pushmenu ul ul li {
+ min-height: 40px; }
+ .pi-pushmenu ul ul a {
+ height: 40px;
+ line-height: 40px;
+ font-size: 18px;
+ color: #555555; }
+
+.push-menu-close-button {
+ position: absolute;
+ top: 0;
+ right: 0;
+ width: 50px;
+ height: 50px; }
+ .push-menu-close-button:before, .push-menu-close-button:after {
+ content: "";
+ position: absolute;
+ top: calc(50% - 1px);
+ left: 25%;
+ width: 50%;
+ height: 2px;
+ background-color: black; }
+ .push-menu-close-button:before {
+ transform: rotate(45deg); }
+ .push-menu-close-button:after {
+ transform: rotate(-45deg); }
+
+#docsContent {
+ position: relative;
+ float: right;
+ width: 100%; }
+ #docsContent * + h2, #docsContent * + h3, #docsContent * + h4, #docsContent * + h5, #docsContent * + h6 {
+ margin-top: 30px; }
+ #docsContent h1, #docsContent h2, #docsContent h3, #docsContent h4, #docsContent h5, #docsContent h6 {
+ line-height: normal;
+ font-weight: 500;
+ margin-bottom: 30px;
+ padding-bottom: 10px; }
+ #docsContent h1:before, #docsContent h2:before, #docsContent h3:before, #docsContent h4:before, #docsContent h5:before, #docsContent h6:before {
+ display: block;
+ content: " ";
+ margin-top: -100px;
+ height: 100px;
+ visibility: hidden; }
+ #docsContent h1, #docsContent h2 {
+ border-bottom: 1px solid #cccccc; }
+ #docsContent h1 {
+ font-size: 32px;
+ padding-right: 60px; }
+ #docsContent h2 {
+ font-size: 28px; }
+ #docsContent h3 {
+ font-size: 24px;
+ font-weight: 300;
+ margin-bottom: 5px; }
+ #docsContent h4 {
+ font-size: 20px;
+ margin-bottom: 0px; }
+ #docsContent h5, #docsContent h6 {
+ font-size: 16px;
+ font-weight: 500; }
+ #docsContent p {
+ font-size: 16px;
+ font-weight: 300;
+ line-height: 1.75em; }
+ #docsContent p + p {
+ margin-top: 10px; }
+ #docsContent code {
+ display: inline-block;
+ box-sizing: border-box;
+ background-color: #f7f7f7;
+ color: #303030;
+ font-family: "Roboto Mono", monospace;
+ vertical-align: baseline;
+ font-size: 14px;
+ font-weight: bold;
+ padding: 2px 4px; }
+ #docsContent a code {
+ color: #3371e3;
+ text-decoration: underline; }
+ #docsContent pre .pi, #docsContent pre .s {
+ margin: 0;
+ padding: 0; }
+ #docsContent .highlight code span, #docsContent code, #docsContent pre code {
+ font-family: "Roboto Mono", monospace; }
+ #docsContent code, #docsContent pre code {
+ color: #303030; }
+ #docsContent pre code {
+ padding: 0; }
+ #docsContent pre {
+ background-color: #f7f7f7;
+ display: block;
+ margin: 20px 0;
+ padding: 15px;
+ position: relative;
+ overflow-x: auto; }
+ #docsContent h1 code, #docsContent h2 code, #docsContent h3 code, #docsContent h4 code, #docsContent h5 code, #docsContent h6 code {
+ font-family: inherit;
+ font-size: inherit;
+ background-color: transparent; }
+ #docsContent .includecode {
+ table-layout: fixed; }
+ #docsContent .includecode, #docsContent .includecode th, #docsContent .includecode td {
+ padding: 0 !important; }
+ #docsContent .includecode th {
+ text-align: right !important;
+ padding: 10px !important; }
+ #docsContent .includecode th a, #docsContent .includecode th a code {
+ color: white !important;
+ background-color: transparent !important; }
+ #docsContent .includecode pre {
+ margin: 0 !important; }
+ #docsContent ul li {
+ list-style: disc; }
+ #docsContent ol li {
+ list-style: decimal; }
+ #docsContent ul, #docsContent ol {
+ margin: 20px 0;
+ padding-left: 30px;
+ font-weight: 300; }
+ #docsContent ul ul, #docsContent ol ol, #docsContent ul ol, #docsContent ol ul {
+ margin: 0.75em 0; }
+ #docsContent li {
+ margin-bottom: 0.75em;
+ font-size: 16px;
+ line-height: 1.75em; }
+ #docsContent table {
+ width: 100%;
+ border: 1px solid #ccc;
+ border-spacing: 0;
+ margin-top: 30px;
+ margin-bottom: 30px; }
+ #docsContent thead, #docsContent tr:nth-child(even) {
+ background-color: #f7f7f7; }
+ #docsContent thead {
+ background-color: #555;
+ color: white; }
+ #docsContent th, #docsContent td {
+ padding: 8px;
+ text-align: left;
+ margin: 0; }
+ #docsContent th {
+ font-weight: normal; }
+ #docsContent td {
+ font-size: 0.85em; }
+ #docsContent #editPageButton {
+ position: absolute;
+ top: -25px;
+ right: 5px;
+ width: 50px;
+ height: 50px;
+ line-height: 50px;
+ border-radius: 50%;
+ white-space: nowrap;
+ text-indent: 50px;
+ overflow: hidden;
+ background: #3371e3 url(/images/icon-pencil.svg) no-repeat;
+ background-position: 12px 10px;
+ background-size: 29px 29px; }
+ #docsContent #markdown-toc, #docsContent #TableOfContents {
+ margin-bottom: 20px; }
+ #docsContent #markdown-toc ul, #docsContent #markdown-toc li, #docsContent #TableOfContents ul, #docsContent #TableOfContents li {
+ list-style: disc;
+ color: #3371e3; }
+ #docsContent #markdown-toc ul, #docsContent #TableOfContents ul {
+ padding: 0 15px;
+ margin: 0; }
+ #docsContent #markdown-toc li, #docsContent #TableOfContents li {
+ padding: 0;
+ line-height: 1.5em;
+ margin-bottom: 0; }
+ #docsContent #markdown-toc a, #docsContent #TableOfContents a {
+ position: relative;
+ color: #3371e3;
+ font-weight: 700; }
+ #docsContent img {
+ max-width: 100%; }
+ #docsContent a {
+ text-decoration: underline; }
+ #docsContent #TableOfContents > ul > li {
+ list-style: none; }
+ #docsContent #TableOfContents ul, #docsContent #TableOfContents li {
+ list-style: disk; }
+
+.fixed footer {
+ position: fixed;
+ bottom: 0; }
+
+#miceType {
+ clear: both;
+ font-size: 11px;
+ line-height: 18px;
+ color: #aaa; }
+
+html.search #docsContent {
+ position: relative;
+ float: none;
+ width: 90%;
+ max-width: 850px;
+ margin: 0 auto; }
+ html.search #docsContent #editPageButton {
+ display: none; }
+ html.search #docsContent table {
+ border: 0;
+ margin-bottom: 0; }
+ html.search #docsContent td {
+ padding: 0; }
+ html.search #docsContent h1 {
+ margin-bottom: 0;
+ border-bottom: 0;
+ padding-bottom: 0;
+ padding-left: 8px; }
+
+#home.flip-nav .logo, #home.open-nav .logo {
+ background-image: url(/images/nav_logo2.svg); }
+
+#home #hero {
+ margin-bottom: 0;
+ padding-bottom: 1px; }
+ #home #hero main {
+ padding: 0 10px;
+ margin-bottom: 30px; }
+ #home #hero #vendorStrip {
+ display: none; }
+
+#oceanNodes {
+ padding-top: 60px;
+ padding-bottom: 60px; }
+ #oceanNodes a {
+ color: #3371e3; }
+ #oceanNodes main {
+ margin-bottom: 60px;
+ min-height: 160px; }
+ #oceanNodes .image-wrapper {
+ max-width: 75%;
+ margin: 0 auto 20px;
+ text-align: center; }
+ #oceanNodes .image-wrapper img {
+ width: 100%;
+ max-width: 160px; }
+ #oceanNodes main:first-child .image-wrapper {
+ max-width: 100%; }
+ #oceanNodes main:first-child .image-wrapper img {
+ max-width: 491px; }
+ #oceanNodes h3 {
+ margin-bottom: 30px; }
+
+#video {
+ height: 200px; }
+
+#video {
+ width: 100%;
+ position: relative;
+ background-image: url(/images/kub_video_banner_homepage.jpg);
+ background-position: center center;
+ background-size: cover; }
+ #video > .light-text {
+ display: none;
+ position: absolute;
+ top: 50%;
+ left: 75%;
+ width: 525px;
+ padding-right: 80px;
+ transform: translate(-50%, -50%);
+ color: white; }
+ #video h2 {
+ font-size: 32px;
+ line-height: 44px;
+ margin-bottom: 20px; }
+ #video p {
+ margin-bottom: 20px; }
+ #video #desktopKCButton {
+ position: relative;
+ font-size: 18px;
+ background-color: #303030;
+ border-radius: 8px;
+ color: #ffffff;
+ padding: 20px 10px 20px 10px; }
+ #video #desktopShowVideoButton {
+ position: relative;
+ font-size: 24px;
+ background-color: white;
+ border-radius: 8px;
+ color: #3371e3;
+ padding: 15px 30px 15px 80px;
+ margin-bottom: 15px; }
+ #video #desktopShowVideoButton:before {
+ content: "";
+ position: absolute;
+ position: absolute;
+ top: 50%;
+ left: 40px;
+ transform: translate(-50%, -50%);
+ width: 0;
+ height: 0;
+ border-style: solid;
+ border-width: 10px 0 10px 20px;
+ border-color: transparent transparent transparent #3371e3; }
+ #video #mobileShowVideoButton {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ width: 80px;
+ height: 80px;
+ border-radius: 50%;
+ background-color: transparent;
+ border: 5px solid rgba(255, 255, 255, 0.2);
+ overflow: visible; }
+ #video #mobileShowVideoButton:after {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ left: 40px;
+ content: "";
+ width: 0;
+ height: 0;
+ border-style: solid;
+ border-width: 20px 0 20px 30px;
+ border-color: transparent transparent transparent #ffffff; }
+
+#videoPlayer {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100vw;
+ height: 100vh;
+ background-color: rgba(0, 0, 0, 0.9);
+ display: none; }
+ #videoPlayer iframe {
+ position: absolute;
+ top: 50%;
+ left: 50%;
+ transform: translate(-50%, -50%);
+ width: 80vw;
+ height: 45vw;
+ max-width: 142.22222222vh;
+ max-height: 80vh; }
+ #videoPlayer #closeButton {
+ position: absolute;
+ top: 20px;
+ right: 20px;
+ width: 50px;
+ height: 50px;
+ border: 2px solid transparent;
+ transition: 0.3s; }
+ #videoPlayer #closeButton:before, #videoPlayer #closeButton:after {
+ content: "";
+ position: absolute;
+ top: calc(50% - 1px);
+ left: 10%;
+ width: 80%;
+ height: 2px;
+ background-color: white; }
+ #videoPlayer #closeButton:before {
+ transform: rotate(45deg); }
+ #videoPlayer #closeButton:after {
+ transform: rotate(-45deg); }
+ #videoPlayer #closeButton:hover {
+ border-color: white; }
+
+#cncf {
+ padding-top: 60px;
+ padding-bottom: 140px;
+ background-color: #f7f7f7;
+ background-image: url(/images/cncf-color.png);
+ background-position: center 100px;
+ background-repeat: no-repeat;
+ background-size: 300px; }
+
+#features {
+ padding-top: 140px;
+ background-color: #f7f7f7;
+ background-image: url(/images/wheel.png);
+ background-position: center 60px;
+ background-repeat: no-repeat;
+ background-size: auto; }
+
+.feature-box {
+ width: 100%;
+ overflow: hidden;
+ clear: both; }
+ .feature-box h4 {
+ line-height: normal;
+ margin-bottom: 15px; }
+ .feature-box > div:first-child {
+ float: left; }
+ .feature-box > div:last-child {
+ float: right; }
+
+#features h3 {
+ margin-bottom: 20px; }
+
+#features .feature-box {
+ margin-bottom: 0; }
+ #features .feature-box > div {
+ width: 100%;
+ margin-bottom: 40px; }
+
+#community.open-nav .logo, #community.flip-nav .logo, .gridPage.open-nav .logo, .gridPage.flip-nav .logo {
+ background-image: url(/images/nav_logo2.svg); }
+
+#community #hero, .gridPage #hero {
+ padding-bottom: 20px; }
+
+#community #mainContent, .gridPage #mainContent {
+ padding: 20px 0; }
+ #community #mainContent main, .gridPage #mainContent main {
+ max-width: none; }
+ #community #mainContent a, .gridPage #mainContent a {
+ color: #3371e3; }
+ #community #mainContent .content, .gridPage #mainContent .content {
+ margin-bottom: 30px;
+ padding: 30px 0; }
+ #community #mainContent .content h1, #community #mainContent .content h2, #community #mainContent .content h3, #community #mainContent .content h4, #community #mainContent .content h5, #community #mainContent .content h6, #community #mainContent .content p, .gridPage #mainContent .content h1, .gridPage #mainContent .content h2, .gridPage #mainContent .content h3, .gridPage #mainContent .content h4, .gridPage #mainContent .content h5, .gridPage #mainContent .content h6, .gridPage #mainContent .content p {
+ line-height: normal;
+ max-width: 1200px;
+ padding: 0 20px;
+ margin: 0 auto 20px; }
+ #community #mainContent .content:nth-child(even), .gridPage #mainContent .content:nth-child(even) {
+ background-color: #f7f7f7; }
+ #community #mainContent .company-logos, .gridPage #mainContent .company-logos {
+ text-align: center;
+ max-width: 1200px;
+ margin: 0 auto; }
+ #community #mainContent .company-logos img, .gridPage #mainContent .company-logos img {
+ width: auto;
+ margin: 10px;
+ background-color: #f7f7f7; }
+ #community #mainContent .partner-logos, .gridPage #mainContent .partner-logos {
+ text-align: center;
+ max-width: 1200px;
+ margin: 0 auto; }
+ #community #mainContent .partner-logos img, .gridPage #mainContent .partner-logos img {
+ width: auto;
+ margin: 10px;
+ background-color: #ffffff;
+ box-shadow: 0 5px 5px rgba(0, 0, 0, 0.24), 0 0 5px rgba(0, 0, 0, 0.12); }
+ #community #mainContent #calendarMeetings, .gridPage #mainContent #calendarMeetings {
+ position: relative;
+ width: 80vw;
+ height: 60vw;
+ max-width: 1200px;
+ max-height: 900px;
+ margin: 20px auto; }
+ #community #mainContent #calendarEvents, .gridPage #mainContent #calendarEvents {
+ position: relative;
+ width: 80vw;
+ height: 30vw;
+ max-width: 1200px;
+ max-height: 450px;
+ margin: 20px auto; }
+ #community #mainContent iframe, .gridPage #mainContent iframe {
+ position: absolute;
+ border: 0;
+ width: 100%;
+ height: 100%; }
+
+.ui-icon {
+ display: inline-block !important; }
+
+#feature-state-dialog-link {
+ text-decoration: none !important;
+ padding: 5px !important; }
+ #feature-state-dialog-link a:visited {
+ color: #454545 !important; }
+ #feature-state-dialog-link a code {
+ display: inline-block !important;
+ box-sizing: border-box !important;
+ background-color: #f7f7f7 !important;
+ color: #303030 !important;
+ font-family: "Roboto Mono", monospace !important;
+ vertical-align: baseline !important;
+ font-size: 14px !important;
+ font-weight: bold !important;
+ padding: 0px 4px !important; }
+
+#feature-state-dialog {
+ background: #fff !important;
+ border: 1px solid #ddd !important;
+ padding: 0.5em 1em !important; }
+ #feature-state-dialog ul, #feature-state-dialog li {
+ list-style: disc !important;
+ margin: 4px 12px !important; }
+ #feature-state-dialog p {
+ margin: 8px 0px !important; }
+ #feature-state-dialog code {
+ display: inline-block !important;
+ box-sizing: border-box !important;
+ background-color: #f7f7f7 !important;
+ color: #303030 !important;
+ font-family: "Roboto Mono", monospace !important;
+ vertical-align: baseline !important;
+ font-size: 14px !important;
+ font-weight: bold !important;
+ padding: 0px 4px !important; }
+
+.ui-dialog {
+ background: #f7f7f7 !important;
+ padding: 0.5em; }
+
+.ui-dialog-content {
+ position: relative;
+ float: right;
+ width: 100%; }
+ .ui-dialog-content * + h2, .ui-dialog-content * + h3, .ui-dialog-content * + h4, .ui-dialog-content * + h5, .ui-dialog-content * + h6 {
+ margin-top: 30px; }
+ .ui-dialog-content h1, .ui-dialog-content h2, .ui-dialog-content h3, .ui-dialog-content h4, .ui-dialog-content h5, .ui-dialog-content h6 {
+ line-height: normal;
+ font-weight: 500;
+ margin-bottom: 30px;
+ padding-bottom: 10px; }
+ .ui-dialog-content h1:before, .ui-dialog-content h2:before, .ui-dialog-content h3:before, .ui-dialog-content h4:before, .ui-dialog-content h5:before, .ui-dialog-content h6:before {
+ display: block;
+ content: " ";
+ margin-top: -100px;
+ height: 100px;
+ visibility: hidden; }
+ .ui-dialog-content h1, .ui-dialog-content h2 {
+ border-bottom: 1px solid #cccccc; }
+ .ui-dialog-content h1 {
+ font-size: 32px;
+ padding-right: 60px; }
+ .ui-dialog-content h2 {
+ font-size: 28px; }
+ .ui-dialog-content h3 {
+ font-size: 24px;
+ font-weight: 300;
+ margin-bottom: 5px; }
+ .ui-dialog-content h4 {
+ font-size: 20px;
+ margin-bottom: 0px; }
+ .ui-dialog-content h5, .ui-dialog-content h6 {
+ font-size: 16px;
+ font-weight: 500; }
+ .ui-dialog-content p {
+ font-size: 16px;
+ font-weight: 300;
+ line-height: 1.75em; }
+ .ui-dialog-content p + p {
+ margin-top: 10px; }
+ .ui-dialog-content code {
+ display: inline-block;
+ box-sizing: border-box;
+ background-color: #f7f7f7;
+ color: #303030;
+ font-family: "Roboto Mono", monospace;
+ vertical-align: baseline;
+ font-size: 14px;
+ font-weight: bold;
+ padding: 2px 4px; }
+ .ui-dialog-content a code {
+ color: #3371e3;
+ text-decoration: underline; }
+ .ui-dialog-content pre .pi, .ui-dialog-content pre .s {
+ margin: 0;
+ padding: 0; }
+ .ui-dialog-content .highlight code span, .ui-dialog-content code, .ui-dialog-content pre code {
+ font-family: "Roboto Mono", monospace; }
+ .ui-dialog-content code, .ui-dialog-content pre code {
+ color: #303030; }
+ .ui-dialog-content pre code {
+ padding: 0; }
+ .ui-dialog-content pre {
+ background-color: #f7f7f7;
+ display: block;
+ margin: 20px 0;
+ padding: 15px;
+ position: relative;
+ overflow-x: auto; }
+ .ui-dialog-content h1 code, .ui-dialog-content h2 code, .ui-dialog-content h3 code, .ui-dialog-content h4 code, .ui-dialog-content h5 code, .ui-dialog-content h6 code {
+ font-family: inherit;
+ font-size: inherit;
+ background-color: transparent; }
+ .ui-dialog-content .includecode {
+ table-layout: fixed; }
+ .ui-dialog-content .includecode, .ui-dialog-content .includecode th, .ui-dialog-content .includecode td {
+ padding: 0 !important; }
+ .ui-dialog-content .includecode th {
+ text-align: right !important;
+ padding: 10px !important; }
+ .ui-dialog-content .includecode th a, .ui-dialog-content .includecode th a code {
+ color: white !important;
+ background-color: transparent !important; }
+ .ui-dialog-content .includecode pre {
+ margin: 0 !important; }
+ .ui-dialog-content ul li {
+ list-style: disc; }
+ .ui-dialog-content ol li {
+ list-style: decimal; }
+ .ui-dialog-content ul, .ui-dialog-content ol {
+ margin: 20px 0;
+ padding-left: 30px;
+ font-weight: 300; }
+ .ui-dialog-content ul ul, .ui-dialog-content ol ol, .ui-dialog-content ul ol, .ui-dialog-content ol ul {
+ margin: 0.75em 0; }
+ .ui-dialog-content li {
+ margin-bottom: 0.75em;
+ font-size: 16px;
+ line-height: 1.75em; }
+ .ui-dialog-content table {
+ width: 100%;
+ border: 1px solid #ccc;
+ border-spacing: 0;
+ margin-top: 30px;
+ margin-bottom: 30px; }
+ .ui-dialog-content thead, .ui-dialog-content tr:nth-child(even) {
+ background-color: #f7f7f7; }
+ .ui-dialog-content thead {
+ background-color: #555;
+ color: white; }
+ .ui-dialog-content th, .ui-dialog-content td {
+ padding: 8px;
+ text-align: left;
+ margin: 0; }
+ .ui-dialog-content th {
+ font-weight: normal; }
+ .ui-dialog-content td {
+ font-size: 0.85em; }
+ .ui-dialog-content #editPageButton {
+ position: absolute;
+ top: -25px;
+ right: 5px;
+ width: 50px;
+ height: 50px;
+ line-height: 50px;
+ border-radius: 50%;
+ white-space: nowrap;
+ text-indent: 50px;
+ overflow: hidden;
+ background: #3371e3 url(/images/icon-pencil.svg) no-repeat;
+ background-position: 12px 10px;
+ background-size: 29px 29px; }
+ .ui-dialog-content #markdown-toc {
+ margin-bottom: 20px; }
+ .ui-dialog-content #markdown-toc ul, .ui-dialog-content #markdown-toc li {
+ list-style: disc;
+ color: #3371e3; }
+ .ui-dialog-content #markdown-toc ul {
+ padding: 0 15px;
+ margin: 0; }
+ .ui-dialog-content #markdown-toc li {
+ padding: 0;
+ line-height: 1.5em;
+ margin-bottom: 0; }
+ .ui-dialog-content #markdown-toc a {
+ position: relative;
+ color: #3371e3;
+ font-weight: 700; }
+ .ui-dialog-content img {
+ max-width: 100%; }
+ .ui-dialog-content a {
+ text-decoration: underline; }
+
+.ui-dialog-buttonpane {
+ background: #f7f7f7 !important; }
+
+.ui-widget-header {
+ background: transparent !important;
+ background-color: transparent !important;
+ border: 0px !important; }
+
+.ui-tabs ul, .ui-tabs ol, .ui-tabs li {
+ padding: 0px !important;
+ list-style: none !important;
+ margin-bottom: 0px !important;
+ margin-left: 4px !important; }
+
+.ui-tabs-panel ul li {
+ list-style: disc !important; }
+
+.ui-tabs-panel ol li {
+ list-style: decimal !important; }
+
+.ui-widget-content {
+ border: 0px !important; }
+ .ui-widget-content table {
+ margin: 0px !important; }
+
+.ui-tabs .ui-tabs-panel {
+ border: 1px solid #ccc !important; }
+
+.ui-tabs-anchor {
+ text-decoration: none !important; }
+
+#talkToUs h3, #talkToUs h4 {
+ text-align: center; }
+
+#talkToUs h3 {
+ margin-bottom: 15px; }
+
+#talkToUs h4 {
+ line-height: normal;
+ margin-bottom: 50px; }
+ #talkToUs h4 br {
+ display: none; }
+
+#talkToUs #bigSocial {
+ overflow: hidden; }
+ #talkToUs #bigSocial div {
+ width: 100%;
+ float: left;
+ padding: 30px;
+ padding-top: 110px;
+ background-position: center top;
+ background-size: auto;
+ background-repeat: no-repeat; }
+ #talkToUs #bigSocial div:nth-child(1) {
+ background-image: url(/images/twitter_icon.png); }
+ #talkToUs #bigSocial div:nth-child(2) {
+ background-image: url(/images/github_icon.png); }
+ #talkToUs #bigSocial div:nth-child(3) {
+ background-image: url(/images/slack_icon.png); }
+ #talkToUs #bigSocial div:nth-child(4) {
+ background-image: url(/images/stackoverflow_icon.png); }
+ #talkToUs #bigSocial div + div {
+ margin-top: 20px;
+ margin-left: 0; }
+ #talkToUs #bigSocial a {
+ display: inline-block;
+ color: #3371e3;
+ font-size: 24px;
+ font-weight: 400;
+ text-decoration: none;
+ margin-bottom: 15px; }
+ #talkToUs #bigSocial a, #talkToUs #bigSocial p {
+ text-align: center;
+ width: 100%; }
+
+#home #talkToUs main {
+ padding: 30px 0; }
+
+#home #talkToUs h5 {
+ font-size: 20px; }
+
+#home #caseStudiesWrapper {
+ position: relative;
+ text-align: center;
+ margin-bottom: 30px; }
+ #home #caseStudiesWrapper div {
+ position: relative;
+ display: inline-block;
+ vertical-align: top;
+ width: 100%;
+ min-height: 230px;
+ padding: 125px 10px 15px;
+ margin-bottom: 30px;
+ background-position: top center;
+ background-repeat: no-repeat; }
+ #home #caseStudiesWrapper div:nth-child(1) {
+ background-image: url(/images/community_logos/pearson_logo.png); }
+ #home #caseStudiesWrapper div:nth-child(2) {
+ background-image: url(/images/community_logos/box_logo.png); }
+ #home #caseStudiesWrapper div:nth-child(3) {
+ background-image: url(/images/community_logos/ebay_logo.png); }
+ #home #caseStudiesWrapper div:nth-child(4) {
+ background-image: url(/images/community_logos/wikimedia_foundation_logo.png); }
+ #home #caseStudiesWrapper p {
+ font-size: 20px; }
+ #home #caseStudiesWrapper a {
+ position: absolute;
+ bottom: 0;
+ left: 50%;
+ transform: translateX(-50%);
+ color: #3371e3;
+ font-weight: 400; }
+
+/* Google Search */
+.cse .gsc-control-cse, .gsc-control-cse {
+ padding: 0; }
+
+.gsc-control-cse table, .gsc-control-cse-en table {
+ margin: 0px !important; }
+
+.gsc-above-wrapper-area {
+ border-bottom: 0; }
+
+/* Bing Search */
+#bing-results-container {
+ margin-top: 30px;
+ margin-left: 20px; }
+
+.bing-result {
+ margin-bottom: 20px; }
+
+.bing-result-name a {
+ font-size: 16px;
+ color: #0000CC; }
+
+.bing-result-url {
+ color: #008000;
+ font-size: 13px; }
+
+.bing-result-snippet {
+ color: #000;
+ font-size: 11px; }
+
+#bing-pagination-container {
+ margin: 10px;
+ margin-left: 20px; }
+
+.bing-page-anchor {
+ text-decoration: none !important;
+ cursor: pointer;
+ color: #0000CC;
+ margin-right: 8px; }
+
+@media screen and (min-width: 750px) {
+ h1 {
+ font-size: 32px;
+ line-height: 40px; }
+ h2 {
+ font-size: 28px;
+ line-height: 60px; }
+ h3 {
+ font-size: 24px;
+ line-height: 32px; }
+ h4 {
+ font-size: 20px;
+ line-height: 40px; }
+ h5 {
+ font-size: 16px;
+ line-height: 36px; }
+ p {
+ font-size: 14px;
+ line-height: 22px; }
+ section, header, #vendorStrip {
+ padding-left: 20px;
+ padding-right: 20px; }
+ section main, header main, #vendorStrip main {
+ width: 100%;
+ max-width: 100%; }
+ header {
+ height: 80px; }
+ .nav-buttons {
+ height: 80px;
+ line-height: 80px; }
+ .nav-buttons .button + * {
+ margin-left: 30px; }
+ #hamburger {
+ width: 50px;
+ height: 50px; }
+ #mainNav {
+ padding: 140px 0 30px; }
+ #mainNav h5 {
+ margin-bottom: 1em; }
+ #mainNav h3 {
+ margin-bottom: 0.6em; }
+ #mainNav .nav-box {
+ width: 20%; }
+ #mainNav .nav-box + .nav-box {
+ margin-left: calc(20% / 3); }
+ #mainNav main + main {
+ margin-top: 60px; }
+ #mainNav .left .button {
+ height: 50px;
+ line-height: 50px;
+ font-size: 18px; }
+ .open-nav #tryKubernetes, .y-enough #tryKubernetes {
+ margin-left: 30px; }
+ #hero {
+ padding-top: 80px; }
+ #docs #hero h1, #docs #hero h5 {
+ padding-left: 20px;
+ padding-right: 20px; }
+ #vendorStrip {
+ height: 88px;
+ line-height: 88px;
+ font-size: 16px; }
+ p {
+ font-size: 16px;
+ line-height: 24px;
+ letter-spacing: 0.1px; }
+ h1 {
+ font-size: 36px;
+ line-height: 44px; }
+ h3 {
+ font-size: 28px;
+ line-height: 36px; }
+ h4 {
+ font-size: 24px;
+ line-height: 40px; }
+ #home #viewDocs, #home #tryKubernetes {
+ display: inline-block; }
+ #vendorStrip {
+ display: block;
+ text-align: center; }
+ #vendorStrip img {
+ max-height: 24px;
+ vertical-align: middle;
+ margin: 0 30px; }
+ #docs #vendorStrip li a {
+ font-size: 1em;
+ font-weight: normal; }
+ #docs #vendorStrip li li + li {
+ margin-left: 60px; }
+ #oceanNodes h3 {
+ text-align: left;
+ margin-bottom: 18px; }
+ #oceanNodes main {
+ position: relative;
+ clear: both;
+ display: table; }
+ #oceanNodes main .content {
+ display: table-cell;
+ position: relative;
+ vertical-align: middle; }
+ #oceanNodes main .image-wrapper {
+ position: absolute;
+ top: 50%;
+ max-width: 25%;
+ max-height: 100%;
+ transform: translateY(-50%); }
+ #oceanNodes main:nth-child(odd) {
+ padding-right: 210px; }
+ #oceanNodes main:nth-child(odd) .image-wrapper {
+ right: 0; }
+ #oceanNodes main:nth-child(even) {
+ padding-left: 210px; }
+ #oceanNodes main:nth-child(even) .image-wrapper {
+ left: 0; }
+ #oceanNodes main:nth-child(1) {
+ padding-right: 0; }
+ #oceanNodes main:nth-child(1) h3, #oceanNodes main:nth-child(1) p {
+ text-align: center; }
+ #oceanNodes main:nth-child(1) .image-wrapper {
+ position: relative;
+ display: block;
+ float: none;
+ max-width: 100%;
+ transform: none; }
+ #oceanNodes main:nth-child(1) .content {
+ display: block; }
+ #oceanNodes main img {
+ width: 100%; }
+ #video {
+ height: 400px;
+ display: block; }
+ #video > .light-text {
+ display: block; }
+ #mobileShowVideoButton {
+ display: none; }
+ #features {
+ padding-bottom: 60px; }
+ #features .feature-box {
+ margin-bottom: 30px; }
+ #features .feature-box:last-child {
+ margin-bottom: 0; }
+ #features h3 {
+ margin-bottom: 40px; }
+ #features .feature-box > div {
+ width: 45%;
+ margin-bottom: 0; }
+ #talkToUs #bigSocial div {
+ width: calc(50% - 15px); }
+ #talkToUs #bigSocial div + div {
+ margin-top: 0; }
+ #talkToUs #bigSocial div:nth-child(2) {
+ margin-left: 20px; }
+ #talkToUs #bigSocial div:nth-child(3) {
+ margin-top: 20px; }
+ #talkToUs #bigSocial div:nth-child(4) {
+ margin-top: 20px;
+ margin-left: 20px; }
+ #talkToUs #bigSocial a {
+ display: inline-block;
+ color: #3371e3;
+ font-weight: 400;
+ text-decoration: none; }
+ footer nav {
+ text-align: center; }
+ footer nav a {
+ width: 30%;
+ padding: 0 20px; }
+ footer .social {
+ text-align: center; }
+ footer .social div {
+ display: inline-block; }
+ footer .social div:last-child {
+ display: block;
+ margin: 0; }
+ footer .social span {
+ display: inline-block;
+ margin-right: 10px; }
+ footer .social input {
+ text-align: left; }
+ #home #caseStudiesWrapper div {
+ width: 48%; } }
+
+@media screen and (min-width: 1025px) {
+ #hamburger {
+ display: none; }
+ ul.global-nav {
+ display: inline-block; }
+ #docs #vendorStrip #searchBox:before {
+ top: 15px; }
+ #vendorStrip {
+ height: 44px;
+ line-height: 44px; }
+ #vendorStrip li a.YAH:after {
+ content: "";
+ display: block;
+ position: absolute;
+ left: 0;
+ bottom: 0;
+ width: 100%;
+ height: 4px;
+ background-color: #3371e3; }
+ #vendorStrip #searchBox {
+ float: right; }
+ #home #hero #vendorStrip {
+ display: block; }
+ #docs #hero h1, #docs #hero h5 {
+ text-align: left; }
+ #docs #hero #vendorStrip ul {
+ float: left; }
+ #docs #hero #vendorStrip #searchBox {
+ float: right;
+ width: 250px; }
+ #docs #hero #vendorStrip #search {
+ vertical-align: middle; }
+ #docs .flyout-button {
+ display: none; }
+ #docs .logo {
+ position: relative;
+ float: left;
+ display: block;
+ width: 180px;
+ height: 88px;
+ top: 0;
+ left: 0;
+ transform: none;
+ background-image: url(../images/nav_logo.svg); }
+ #docs.flip-nav .logo, #docs.open-nav .logo {
+ background-image: url(../images/nav_logo2.svg); }
+ #encyclopedia {
+ padding: 50px 50px 100px 100px;
+ clear: both; }
+ #docsToc {
+ position: relative;
+ float: left;
+ padding: 0 20px;
+ left: 0;
+ width: 350px;
+ z-index: auto; }
+ #docsToc .push-menu-close-button {
+ display: none; }
+ #docsContent {
+ width: calc(100% - 400px); }
+ #docsContent #editPageButton {
+ right: -25px; }
+ section main, header main, footer main {
+ max-width: 1200px; }
+ header, #vendorStrip, #encyclopedia, #hero h1, #hero h5, #docs #hero h1, #docs #hero h5,
+ #community #hero h1, .gridPage #hero h1, #community #hero h5, .gridPage #hero h5 {
+ padding-left: 100px;
+ padding-right: 100px; }
+ #vendorStrip {
+ padding-right: 10px; }
+ #home section main, #home header main, #home footer main {
+ max-width: 1000px; }
+ #oceanNodes main {
+ position: relative;
+ max-width: 830px; }
+ #oceanNodes main:nth-child(1) {
+ max-width: 1000px;
+ padding-right: 475px; }
+ #oceanNodes main:nth-child(1) h3, #oceanNodes main:nth-child(1) p {
+ text-align: left; }
+ #oceanNodes main:nth-child(1) .image-wrapper {
+ position: absolute;
+ max-width: 48%;
+ transform: translateY(-50%); }
+ #oceanNodes main:nth-child(1) .image-wrapper img {
+ max-width: 425px; }
+ #video {
+ height: 550px;
+ position: relative;
+ background-image: url(../images/kub_video_banner_homepage.jpg);
+ background-position: center center;
+ background-size: cover; }
+ #talkToUs h4 br {
+ display: block; }
+ #talkToUs #bigSocial div {
+ width: calc(25% - 18px); }
+ #talkToUs #bigSocial div + div {
+ margin-left: 20px; }
+ footer {
+ width: 100%;
+ background-image: url(../images/texture.png);
+ background-color: #303030; }
+ footer main {
+ padding: 20px 0; }
+ footer nav {
+ overflow: hidden;
+ margin-bottom: 20px; }
+ footer nav a {
+ width: 16.65%;
+ float: left;
+ font-size: 24px;
+ font-weight: 300;
+ white-space: nowrap; }
+ footer .social {
+ padding: 0 30px;
+ max-width: 1200px; }
+ footer .social div {
+ float: left; }
+ footer .social div:last-child {
+ float: right; }
+ #search, #wishField {
+ background-color: transparent;
+ padding: 10px;
+ font-size: 16px;
+ font-weight: 100;
+ color: white;
+ border: 1px solid white;
+ transition: 0.3s; }
+ #search:focus, #wishField:focus {
+ background-color: #f7f7f7;
+ color: #303030; }
+ .social a {
+ display: inline-block;
+ background-image: url(../images/social_sprite.png);
+ background-repeat: no-repeat;
+ background-size: auto;
+ width: 50px;
+ height: 50px;
+ border-radius: 5px;
+ margin-right: 10px; }
+ .social a:hover {
+ background-color: #fff; }
+ .social a span {
+ position: absolute;
+ display: block;
+ height: 0;
+ overflow: hidden; }
+ a.twitter {
+ background-position: 0 0; }
+ a.twitter:hover {
+ background-position: 0 100%; }
+ a.stack-overflow {
+ background-position: -50px 0; }
+ a.stack-overflow:hover {
+ background-position: -50px 100%; }
+ a.slack {
+ background-position: -100px 0; }
+ a.slack:hover {
+ background-position: -100px 100%; }
+ a.github {
+ background-position: -150px 0; }
+ a.github:hover {
+ background-position: -150px 100%; }
+ a.mailing-list {
+ background-position: -200px 0; }
+ a.mailing-list:hover {
+ background-position: -200px 100%; }
+ a.calendar {
+ background-position: -250px 0; }
+ a.calendar:hover {
+ background-position: -250px 100%; }
+ #community #hero, .gridPage #hero {
+ text-align: left; }
+ #community #hero h1, .gridPage #hero h1 {
+ padding: 20px 100px; }
+ #community #tryKubernetes, .gridPage #tryKubernetes {
+ width: auto;
+ background-color: #3371e3;
+ padding: 0 20px; }
+ #bigSocial div {
+ width: calc(25% - 18px); }
+ #home #caseStudiesWrapper div {
+ width: 24%;
+ min-height: 260px; } }
+
+@media screen and (min-width: 1300px) {
+ #vendorStrip {
+ padding-right: 100px; } }
+
+@media screen and (min-width: 456px) {
+ #vendorStrip li + li {
+ margin-left: 20px; } }
diff --git a/resources/_gen/assets/sass/cn/sass/styles.sass_a6e533854c4de092afe9278041939937.json b/resources/_gen/assets/sass/cn/sass/styles.sass_a6e533854c4de092afe9278041939937.json
new file mode 100644
index 00000000000..081a4beb86c
--- /dev/null
+++ b/resources/_gen/assets/sass/cn/sass/styles.sass_a6e533854c4de092afe9278041939937.json
@@ -0,0 +1 @@
+{"Target":"css/styles.css","MediaType":"text/css","Data":{}}
\ No newline at end of file