From 9cd91a59e506ef346b228817b8f832801870686d Mon Sep 17 00:00:00 2001 From: James George Date: Wed, 24 Oct 2018 18:55:14 +0530 Subject: [PATCH] Fixes :+1: (#10688) --- sass/_base.sass | 3 +- static/css/case-study-styles.css | 2046 +++++++++++++++++++++++++++++- static/css/styles.css | 1948 +++++++++++++++++++++++++++- 3 files changed, 3992 insertions(+), 5 deletions(-) diff --git a/sass/_base.sass b/sass/_base.sass index daa7107b62324..0ea641352782e 100644 --- a/sass/_base.sass +++ b/sass/_base.sass @@ -558,7 +558,8 @@ section #vendorStrip line-height: 44px max-width: 100% - overflow-x: scroll + overflow-x: auto + -webkit-overflow-scrolling: touch ul float: none diff --git a/static/css/case-study-styles.css b/static/css/case-study-styles.css index 39d66cd7722d3..2747d92683018 100644 --- a/static/css/case-study-styles.css +++ b/static/css/case-study-styles.css @@ -1,2 +1,2044 @@ -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:#fff}.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:#fff}.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:.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:#fff}section{position:relative;background-color:#fff}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:#fff;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:.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:.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 #fff;background-color:transparent;transition:.3s}#viewDocs:hover{background-color:#fff;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:.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:.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:#fff}#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,.open-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:#fff}.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:auto;padding:0 20px;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:#fff}.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:#fff;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:#fff;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:#fff;border:1px solid #fff;transition:.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:#fff}#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:#fff;font-size:.75em;font-weight:bold}#vendorStrip li+li{margin-left:0}#docs #vendorStrip{line-height:44px;max-width:100%;overflow-x:scroll}#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:#fff;top:0;left:0;width:0;height:100vh;overflow:hidden;padding:50px 0;z-index:999999;transition:.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:.3s}.pi-accordion .title:hover{color:#3371e3}.pi-accordion a.item>.title{color:#000}.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:.3s}.pi-accordion .wrapper{position:relative;width:100%;transition:height .3s}.pi-accordion .content{padding-left:20px;opacity:0;transition:.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 .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:#fff;overflow:auto;transition:.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 #ccc}.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:#555}.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:#000}.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 #ccc}#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-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:#fff !important;background-color:transparent !important}#docsContent .includecode pre{margin:0 !important}#docsContent ul li{list-style:disc}#docsContent ol ul li{list-style:none}#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:.75em 0}#docsContent li{margin-bottom:.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:#fff}#docsContent th,#docsContent td{padding:8px;text-align:left;margin:0}#docsContent th{font-weight:normal}#docsContent td{font-size:.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 #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-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:#fff}#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:#fff;padding:20px 10px 20px 10px}#video #desktopShowVideoButton{position:relative;font-size:24px;background-color:#fff;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 #fff}#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.2222222222vh;max-height:80vh}#videoPlayer #closeButton{position:absolute;top:20px;right:20px;width:50px;height:50px;border:2px solid transparent;transition:.3s}#videoPlayer #closeButton:before,#videoPlayer #closeButton:after{content:"";position:absolute;top:calc(50% - 1px);left:10%;width:80%;height:2px;background-color:#fff}#videoPlayer #closeButton:before{transform:rotate(45deg)}#videoPlayer #closeButton:after{transform:rotate(-45deg)}#videoPlayer #closeButton:hover{border-color:#fff}#cncf{padding-top:60px;padding-bottom:140px;background-image:url(/images/cncf-color.png);background-position:center 100px;background-repeat:no-repeat;background-size:300px}#kubeweekly{background-color:#f7f7f7;padding-top:60px;padding-bottom:140px;background-size:auto;font-family:"Roboto Mono",monospace !important;font-size:24px;font-weight:bold}#kubeweekly h5{font-size:20px}.subscribe-button{border-radius:6px;padding:0 20px;line-height:31px;color:#fff;background-color:blue;text-decoration:none;font-size:14px}#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:#fff;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:.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:.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 #ccc}.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:#fff !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:.75em 0}.ui-dialog-content li{margin-bottom:.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:#fff}.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:.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 img{padding-bottom:1rem}#home #caseStudiesWrapper div{position:relative;display:inline-block;vertical-align:top;width:100%;min-height:230px;margin-bottom:60px;padding-right:1rem;background-position:top center}#home #caseStudiesWrapper p{font-size:20px}#home #caseStudiesWrapper a{position:absolute;bottom:-30px;left:50%;transform:translateX(-50%);color:#3371e3;font-weight:400}.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-results-container{margin-top:30px;margin-left:20px}.bing-result{margin-bottom:20px}.bing-result-name a{font-size:16px;color:#00c}.bing-result-url{color:green;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:#00c;margin-right:8px}hr{background-color:#999}h2{margin-bottom:15px !important}.subhead{padding-bottom:2% !important;padding-top:0% !important}.details{margin-left:1.9%;padding-right:5%;font-size:16px !important;padding-bottom:2% !important}.section1{margin-bottom:3%}.section1 .cols{width:80% !important;margin-left:6.8%;padding-top:1.5%}.section1 .cols .col1{width:52% !important;font-weight:300 !important}.section1 .cols .col2{width:46% !important}.banner2text{width:63%;padding-top:10%;padding-left:0% !important;float:initial !important;text-align:center;margin:0 auto;position:relative}.banner3text,.banner4text,.banner5text{width:63%;padding-left:0% !important;float:initial !important;text-align:center;margin:0 auto;position:relative}.fullcol{float:initial !important}body footer{background-color:#585858 !important}.section1{float:left !important}.banner1{padding-left:11.9% !important}.banner2{float:initial !important;padding-bottom:2% !important}footer{padding:0% 7%}.banner4,.banner3,.banner5{float:initial !important}@media screen and (max-width: 910px){.banner2text{width:47%;padding-top:45%}.details{margin-left:0%;margin-bottom:3%}.subhead{padding-bottom:0% !important;padding-top:0% !important}.banner3{width:100% !important}}@media screen and (max-width: 780px){.section1 .cols{width:100% !important;margin-left:0%;padding-top:5%}.section1 .cols .col1,.section1 .cols .col2{width:100% !important;margin-left:0% !important}.fullcol{width:90% !important;margin-left:5% !important}.banner1{padding-left:10% !important;margin-bottom:6% !important}.banner2text{padding-top:60% !important;padding-bottom:2% !important}}@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:.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:.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;height:160px}#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-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:#fff;border:1px solid #fff;transition:.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}} -/*# sourceMappingURL=case-study-styles.css.map */ +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, .open-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: auto; + padding: 0 20px; + 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; + max-width: 100%; + overflow-x: scroll; } + #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-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 ul li { + list-style: none; } + #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 #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-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.22222vh; + 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-image: url(/images/cncf-color.png); + background-position: center 100px; + background-repeat: no-repeat; + background-size: 300px; } + +#kubeweekly { + background-color: #f7f7f7; + padding-top: 60px; + padding-bottom: 140px; + background-size: auto; + font-family: "Roboto Mono", monospace !important; + font-size: 24px; + font-weight: bold; } + #kubeweekly h5 { + font-size: 20px; } + +.subscribe-button { + border-radius: 6px; + padding: 0 20px; + line-height: 31px; + color: white; + background-color: blue; + text-decoration: none; + font-size: 14px; } + +#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 img { + padding-bottom: 1rem; } + #home #caseStudiesWrapper div { + position: relative; + display: inline-block; + vertical-align: top; + width: 100%; + min-height: 230px; + margin-bottom: 60px; + padding-right: 1rem; + background-position: top center; } + #home #caseStudiesWrapper p { + font-size: 20px; } + #home #caseStudiesWrapper a { + position: absolute; + bottom: -30px; + 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; } + +hr { + background-color: #999999; } + +h2 { + margin-bottom: 15px !important; } + +.subhead { + padding-bottom: 2% !important; + padding-top: 0% !important; } + +.details { + margin-left: 1.9%; + padding-right: 5%; + font-size: 16px !important; + padding-bottom: 2% !important; } + +.section1 { + margin-bottom: 3%; } + .section1 .cols { + width: 80% !important; + margin-left: 6.8%; + padding-top: 1.5%; } + .section1 .cols .col1 { + width: 52% !important; + font-weight: 300 !important; } + .section1 .cols .col2 { + width: 46% !important; } + +.banner2text { + width: 63%; + padding-top: 10%; + padding-left: 0% !important; + float: initial !important; + text-align: center; + margin: 0 auto; + position: relative; } + +.banner3text, .banner4text, .banner5text { + width: 63%; + padding-left: 0% !important; + float: initial !important; + text-align: center; + margin: 0 auto; + position: relative; } + +.fullcol { + float: initial !important; } + +body footer { + background-color: #585858 !important; } + +.section1 { + float: left !important; } + +.banner1 { + padding-left: 11.9% !important; } + +.banner2 { + float: initial !important; + padding-bottom: 2% !important; } + +footer { + padding: 0% 7%; } + +.banner4, .banner3, .banner5 { + float: initial !important; } + +@media screen and (max-width: 910px) { + .banner2text { + width: 47%; + padding-top: 45%; } + .details { + margin-left: 0%; + margin-bottom: 3%; } + .subhead { + padding-bottom: 0% !important; + padding-top: 0% !important; } + .banner3 { + width: 100% !important; } } + +@media screen and (max-width: 780px) { + .section1 .cols { + width: 100% !important; + margin-left: 0%; + padding-top: 5%; } + .section1 .cols .col1, .section1 .cols .col2 { + width: 100% !important; + margin-left: 0% !important; } + .fullcol { + width: 90% !important; + margin-left: 5% !important; } + .banner1 { + padding-left: 10% !important; + margin-bottom: 6% !important; } + .banner2text { + padding-top: 60% !important; + padding-bottom: 2% !important; } } + +@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; + height: 160px; } + #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-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/static/css/styles.css b/static/css/styles.css index 2cb5ddd886964..a48e6900d62f8 100644 --- a/static/css/styles.css +++ b/static/css/styles.css @@ -1,2 +1,1946 @@ -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:#fff}.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:#fff}.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:.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:#fff}section{position:relative;background-color:#fff}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:#fff;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:.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:.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 #fff;background-color:transparent;transition:.3s}#viewDocs:hover{background-color:#fff;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:.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:.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:#fff}#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,.open-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:#fff}.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:auto;padding:0 20px;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:#fff}.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:#fff;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:#fff;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:#fff;border:1px solid #fff;transition:.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:#fff}#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:#fff;font-size:.75em;font-weight:bold}#vendorStrip li+li{margin-left:0}#docs #vendorStrip{line-height:44px;max-width:100%;overflow-x:scroll}#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:#fff;top:0;left:0;width:0;height:100vh;overflow:hidden;padding:50px 0;z-index:999999;transition:.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:.3s}.pi-accordion .title:hover{color:#3371e3}.pi-accordion a.item>.title{color:#000}.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:.3s}.pi-accordion .wrapper{position:relative;width:100%;transition:height .3s}.pi-accordion .content{padding-left:20px;opacity:0;transition:.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 .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:#fff;overflow:auto;transition:.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 #ccc}.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:#555}.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:#000}.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 #ccc}#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-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:#fff !important;background-color:transparent !important}#docsContent .includecode pre{margin:0 !important}#docsContent ul li{list-style:disc}#docsContent ol ul li{list-style:none}#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:.75em 0}#docsContent li{margin-bottom:.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:#fff}#docsContent th,#docsContent td{padding:8px;text-align:left;margin:0}#docsContent th{font-weight:normal}#docsContent td{font-size:.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 #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-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:#fff}#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:#fff;padding:20px 10px 20px 10px}#video #desktopShowVideoButton{position:relative;font-size:24px;background-color:#fff;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 #fff}#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.2222222222vh;max-height:80vh}#videoPlayer #closeButton{position:absolute;top:20px;right:20px;width:50px;height:50px;border:2px solid transparent;transition:.3s}#videoPlayer #closeButton:before,#videoPlayer #closeButton:after{content:"";position:absolute;top:calc(50% - 1px);left:10%;width:80%;height:2px;background-color:#fff}#videoPlayer #closeButton:before{transform:rotate(45deg)}#videoPlayer #closeButton:after{transform:rotate(-45deg)}#videoPlayer #closeButton:hover{border-color:#fff}#cncf{padding-top:60px;padding-bottom:140px;background-image:url(/images/cncf-color.png);background-position:center 100px;background-repeat:no-repeat;background-size:300px}#kubeweekly{background-color:#f7f7f7;padding-top:60px;padding-bottom:140px;background-size:auto;font-family:"Roboto Mono",monospace !important;font-size:24px;font-weight:bold}#kubeweekly h5{font-size:20px}.subscribe-button{border-radius:6px;padding:0 20px;line-height:31px;color:#fff;background-color:blue;text-decoration:none;font-size:14px}#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:#fff;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:.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:.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 #ccc}.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:#fff !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:.75em 0}.ui-dialog-content li{margin-bottom:.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:#fff}.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:.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 img{padding-bottom:1rem}#home #caseStudiesWrapper div{position:relative;display:inline-block;vertical-align:top;width:100%;min-height:230px;margin-bottom:60px;padding-right:1rem;background-position:top center}#home #caseStudiesWrapper p{font-size:20px}#home #caseStudiesWrapper a{position:absolute;bottom:-30px;left:50%;transform:translateX(-50%);color:#3371e3;font-weight:400}.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-results-container{margin-top:30px;margin-left:20px}.bing-result{margin-bottom:20px}.bing-result-name a{font-size:16px;color:#00c}.bing-result-url{color:green;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:#00c;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:.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:.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;height:160px}#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-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:#fff;border:1px solid #fff;transition:.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}} -/*# sourceMappingURL=styles.css.map */ +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, .open-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: auto; + padding: 0 20px; + 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; + max-width: 100%; + overflow-x: scroll; } + #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-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 ul li { + list-style: none; } + #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 #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-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.22222vh; + 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-image: url(/images/cncf-color.png); + background-position: center 100px; + background-repeat: no-repeat; + background-size: 300px; } + +#kubeweekly { + background-color: #f7f7f7; + padding-top: 60px; + padding-bottom: 140px; + background-size: auto; + font-family: "Roboto Mono", monospace !important; + font-size: 24px; + font-weight: bold; } + #kubeweekly h5 { + font-size: 20px; } + +.subscribe-button { + border-radius: 6px; + padding: 0 20px; + line-height: 31px; + color: white; + background-color: blue; + text-decoration: none; + font-size: 14px; } + +#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 img { + padding-bottom: 1rem; } + #home #caseStudiesWrapper div { + position: relative; + display: inline-block; + vertical-align: top; + width: 100%; + min-height: 230px; + margin-bottom: 60px; + padding-right: 1rem; + background-position: top center; } + #home #caseStudiesWrapper p { + font-size: 20px; } + #home #caseStudiesWrapper a { + position: absolute; + bottom: -30px; + 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; + height: 160px; } + #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-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; } }