html, body {
  background:#222d32 !important;
}

h1 {
  color: #777777;
  font-size: 3.0rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;  
}

h2 {
  color: #777777;
  font-size: 2.0rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}

h3 {
  color: #777777;
  font-size: 1.2rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
}

h3.subtitle {
  color: #1bacab;
  font-size: 2.0rem !important;
  padding:20px;
}

.text-bold {
  font-weight: 700;
}

.button {
  background-color: #1bacab;
  color: #efefef;
}

.button.large {
  font-size: 1.0rem !important;
  font-weight: 700;
  text-transform: uppercase;
}

.button.extra-large {
  font-size: 2.5rem !important;
  font-weight: 700;
  text-transform: uppercase;
}

.callout {
  background: #222d32;
  border: 0;
  color: #777;
}

.contact {
  color: #1bacab;
  font-size: 3.0rem;
  letter-spacing: 1px;
  text-align: center;
  padding: 0px 0px 80px 0px;
}

.dark {
  background:#222d32 !important;
}

.dark-grey {
  background:#424c50 !important;
}

.headline {
  border-top:10px solid rgba(27,172,171,0.25);
}

.icon {
  margin-right:10px;
}

.row.dark-grey {
  padding: 30px 0px 30px 0px;
}

.overlay-01 {
 background:rgba(34,45,50,0.925);
}

.overlay-02 {
 background:rgba(66,76,80,0.125);
}

.overlay-03 {
  background:rgba(27,172,171,0.075);
}

.overlay-04 {
 background:rgba(34,45,50,0.750);
}

.row.overlay-01, .row.overlay-02, .row.overlay-03, .row.overlay-04 {
  padding: 30px 0px 30px 0px;
}

.footer {
  background-color: #424c50;
}

.lead {
  font-size: 1.25rem !important;
}

.logo {
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.6;
  padding-left: 10px !important;
}

.menu a {
  color: #efefef;
  cursor: pointer !important;
  letter-spacing: 1px;  
  text-transform: uppercase;
}
.menu a.active {
  border-left: 5px solid #1bacab;
  color:#1bacab;
}

.menu a:hover {
  border-left: 5px solid #1bacab;
  color: #1bacab;
}

.top-bar, .top-bar ul {
 background:rgba(34,45,50,0.925);
}

.top-bar { 
  position: fixed; 
  right: 0; 
  left: 0;  
  z-index: 999; 
}

.logo-grey {
  color: #efefef;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.logo-green {
  color: #1bacab;
  letter-spacing: 1px;
  text-transform: uppercase;
}

h1.title {
  border-bottom:1px solid #777;
  display:inline-block;
  font-size: 5rem !important;
  padding: 80px 0px 0px 0px;
  margin:0;
  margin-bottom:10px;
}

h1.subtitle {
  color:#efefef;
  font-size: 4rem !important;
  padding: 30px 0px 30px 0px;
  margin:0;
  text-align:center;
}

h1.use-case {
  font-size: 4.5rem !important;
}

h2.title {
  font-size: 2.80rem !important;
  line-height: 1.0 !important;  
  margin:0;
}

h2.subfooter {
  color: #777777;
  margin: 30px 0px 10px 0px;
  text-align:center;
}

h2.subtitle {
  color: #efefef;
  font-size:2.5rem !important;
  margin: 30px 0px 10px 0px;  
  text-align:center
}

h2.spark {
  color: #1bacab;
  padding:30px;
}

.cell-container {
  background:rgba(27,172,171,0.150);
  border: 1px solid #1bacab;
  min-height: 180px;
  height:180px;
  margin:20px 40px 20px 0px;
}

.cell-container.last {
  margin-right:0;
}

.cell-text {
  color: #efefef;
  font-size: 1.20rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;  
  padding:20px;
}

.barrier {
  background-image: url('images/barrier.svg');
  background-size: contain;
  background-repeat: no-repeat;
  max-height: 297mm;
  max-width: 210mm;
  margin:0 auto;
  z-index: 1;
}

.blueprint-02 {
  background-image: url('images/blueprint-02.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width:100%;
  height: 100%;
}

.blueprint-03 {
  background-image: url('images/blueprint-03.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width:100%;
  height: 100%;
}

.climbing {
  background-image: url('images/climbing.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 340px;
  height: 480px;
  margin: auto;
}

.connector {
  background-image: url('images/connector.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 332px;
  height: 200px;
  margin: auto;
}

.connector-machine {
  background-image: url('images/connector-machine.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width:100%;
  height: 100%;
}

.crowd-innovation {
  background-image: url('images/crowd-innovation.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width:784px;
  height:458px;
  margin: auto;
}

.datafabric {
  background-image: url('images/datafabric.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 320px;
  height: 320px;
  margin: auto;
}

.datafabric-small {
  background-image: url('images/datafabric.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 120px;
  height: 120px;
  margin: auto;
}

.innovation {
  background-image: url('images/innovation.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
}

.fairness {
  background-image: url('images/fairness.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
}

.insight-small {
  background-image: url('images/insight.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 120px;
  height: 120px;
  margin: auto;
}

.machine {
  background-image: url('images/machine.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 332px;
  height: 200px;
  margin: auto;
}

.mail {
  background-image: url('images/mail.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 200px;
  height: 160px;
  margin: auto;
}

.marketplace {
  background-image: url('images/marketplace.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 320px;
  height: 320px;
  margin: auto;
}

.marketplace-small {
  background-image: url('images/marketplace.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 120px;
  height: 120px;
  margin: auto;
}


.network {
  background-image: url('images/network.svg');
  background-size: contain;
  background-repeat: no-repeat;
  height: 100%;
  width:100%;
  z-index: 1;
}

.orchestrator {
  background-image: url('images/orchestrator.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 320px;
  height: 320px;
  margin: auto;
}

.orchestrator-small {
  background-image: url('images/orchestrator.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width: 120px;
  height: 120px;
  margin: auto;
}

.scene {
  background-image: url('images/scene.svg');
  background-size: contain;
  background-repeat: no-repeat;
  width:100%;
  height:100%;
}

.scene-container {
  //background:rgba(27,172,171,0.150);
  //border: 1px solid #1bacab;
  display:flex;
  align-items:center;
  justify-content:center;
  height:420px;  
  padding-left:20px;
  margin:30px 0px 0px 0px;
}

.use-case-container {
  background:rgba(27,172,171,0.150);
  border: 1px solid #1bacab;
  padding:20px;
  margin:10px 20px 10px 10px;
}

h2.use-case {
  color:#1bacab;
  font-size:1.75rem !important;
  text-align:center;
  padding-top:30px;  
}

h2.use-case.small {
  font-size:1.25rem !important;
}

.borderline {
  background:rgba(27,172,171,0.150);
  border: 1px solid #1bacab;
}

.imprint {
  color: #efefef;
  font-size: 1.5rem;
}

.imprint p {
  margin:0;
}

.team {
  color: #efefef;
  font-size: 1.5rem;
  margin-top: 30px;
}

.team li {
  font-size: 1.5rem !important;  
  list-style: square;
  margin: 20px 0px 20px 20px;
}

.blueprint-container {
  margin: 0px 20px 0px 0px;
}

.blueprint-container.last {
  margin-right:0;
}

.blueprint-container li {
  color: #1bacab;
  font-size: 1.30rem !important;  
  list-style: square;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 20px 0px 20px 20px;
}

.blueprint-container.large li {
  font-size: 2.5rem !important;  
  margin: 20px 0px 30px 20px;  
}

.blueprint-background {
  border: 1px solid rgb(27,172,171);
  background: rgba(27,172,171,0.150);
}

.statements {
  margin: 20px 20px 0px 0px;
}

.statements li {
  color: #1bacab;
  font-size: 1.5rem !important;  
  list-style: square;
  letter-spacing: 1px;
  text-transform: uppercase;
  margin: 30px 30px 30px 0px;
}

.message {
  color: #cccccc;
  font-size: 2.0rem;
  padding:50px 0px 50px 0px;
  text-align:center;
}

.statement {
  color: #efefef;
  font-size: 3.0rem;
  font-weight:300;
  line-height:3.2rem;
  padding:0px 0px 60px 0px;
  text-align:center;
  text-transform: none;
}

.statement.middle {
  font-size: 1.75rem;
  padding:0px;  
}

.statement.small {
  font-size: 1.25rem;
  line-height: 1.50rem;
  padding: 0px 0px 0px 20px;
  text-align: left;

}

.statement.small.left {
  padding: 0px 20px 0px 20px;
}

/*Terminal*/
.terminal-window {
    text-align: left;
    width: 720px;
    height: 480px;
    border-radius: 10px;
    margin: auto;
    position: relative;
    margin-bottom: -100px;
    z-index: 2;
    /*box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);*/
    -webkit-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    -mox-box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
    box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}

.terminal-window header {
    background: #E0E8F0;
    height: 30px;
    border-radius: 8px 8px 0 0;
    padding-left: 10px;
}

.terminal-window header .btn {
    width: 12px;
    height: 12px;
    margin: 10px 4px 0 0;
    display: inline-block;
    border-radius: 8px;
}

.terminal-window header .btn.green {
    background: #3BB662;
}

.terminal-window header .btn.yellow {
    background: #E5C30F;
}

.terminal-window header .btn.red {
    background: #E75448;
}

.terminal-window section.terminal {
    color: white;
    font-family: Menlo, Monaco, "Consolas", "Courier New", "Courier";
    font-size: 11pt;
    background: #30353A;
    padding: 10px;
    box-sizing: border-box;
    position: absolute;
    width: 100%;
    top: 30px;
    bottom: 0;
    overflow: auto;
}

.terminal-window section.terminal .typed-cursor {
    opacity: 1;
    -webkit-animation: blink 0.7s infinite;
    -moz-animation: blink 0.7s infinite;
    animation: blink 0.7s infinite;
}

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

@keyframes blink {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-webkit-keyframes blink {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@-moz-keyframes blink {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

.terminal-data {
    display: none;
}

.terminal-window .gray {
    color: gray;
}

.terminal-window .green {
    color: green;
}

.vision {
  color: #1bacab;
  font-size: 2.0rem;
  margin: 20px 0px 40px 0px;
}

.vertical-center {
  position: relative;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
}

.tabs {
  background: none;
  border:0;
  border-bottom: 1px solid #1bacab;
  margin:30px 0px 30px 0px;

}

.tabs-content {
  background: none;
  border: 0;
  min-height: 360px;
}

.tabs-title > a {
  color: #1bacab;
  display: block;
  padding: 0rem 1.5rem 0rem 1.5rem;
  font-size: 1.75rem;
  font-weight: 300;
  line-height: 1.75;
  outline: 0;
}

.tabs-title > a[aria-selected=true] {
  background: rgba(27,172,171,0.150);
  color: #efefef;
}

.tabs-title > a:hover {
  background: rgba(27,172,171,0.150);
  color: #efefef;
}

