| /* |
| ▄▄▄ ██▓███ ▄▄▄ ▄████▄ ██░ ██ ▓█████ ██▓ ▄████ ███▄ █ ██▓▄▄▄█████▓▓█████ |
| ▒████▄ ▓██░ ██▒▒████▄ ▒██▀ ▀█ ▓██░ ██▒▓█ ▀ ▓██▒ ██▒ ▀█▒ ██ ▀█ █ ▓██▒▓ ██▒ ▓▒▓█ ▀ |
| ▒██ ▀█▄ ▓██░ ██▓▒▒██ ▀█▄ ▒▓█ ▄ ▒██▀▀██░▒███ ▒██▒▒██░▄▄▄░▓██ ▀█ ██▒▒██▒▒ ▓██░ ▒░▒███ |
| ░██▄▄▄▄██ ▒██▄█▓▒ ▒░██▄▄▄▄██ ▒▓▓▄ ▄██▒░▓█ ░██ ▒▓█ ▄ ░██░░▓█ ██▓▓██▒ ▐▌██▒░██░░ ▓██▓ ░ ▒▓█ ▄ |
| ▓█ ▓██▒▒██▒ ░ ░ ▓█ ▓██▒▒ ▓███▀ ░░▓█▒░██▓░▒████▒ ░██░░▒▓███▀▒▒██░ ▓██░░██░ ▒██▒ ░ ░▒████▒ |
| ▒▒ ▓▒█░▒▓▒░ ░ ░ ▒▒ ▓▒█░░ ░▒ ▒ ░ ▒ ░░▒░▒░░ ▒░ ░ ░▓ ░▒ ▒ ░ ▒░ ▒ ▒ ░▓ ▒ ░░ ░░ ▒░ ░ |
| ▒ ▒▒ ░░▒ ░ ▒ ▒▒ ░ ░ ▒ ▒ ░▒░ ░ ░ ░ ░ ▒ ░ ░ ░ ░ ░░ ░ ▒░ ▒ ░ ░ ░ ░ ░ |
| ░ ▒ ░░ ░ ▒ ░ ░ ░░ ░ ░ ▒ ░░ ░ ░ ░ ░ ░ ▒ ░ ░ ░ |
| ░ ░ ░ ░░ ░ ░ ░ ░ ░ ░ ░ ░ ░ ░ ░ ░ |
| */ |
| |
| /* |
| Licensed to the Apache Software Foundation (ASF) under one |
| or more contributor license agreements. See the NOTICE file |
| distributed with this work for additional information |
| regarding copyright ownership. The ASF licenses this file |
| to you under the Apache License, Version 2.0 (the |
| "License"); you may not use this file except in compliance |
| with the License. You may obtain a copy of the License at |
| |
| http://www.apache.org/licenses/LICENSE-2.0 |
| |
| Unless required by applicable law or agreed to in writing, |
| software distributed under the License is distributed on an |
| "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY |
| KIND, either express or implied. See the License for the |
| specific language governing permissions and limitations |
| under the License. |
| */ |
| |
| @import "compass"; |
| @import "bootstrap"; |
| @import "markup-mixins"; |
| @font-face { @include fontface(atillanormal, atilla_normal-webfont) } |
| @font-face { @include fontface(harabara, harabara-webfont) } |
| @font-face { @include fontface(icomoon, icomoon) } |
| |
| // Flat colors. |
| $color-turquoise: #1abc9c; |
| $color-emerald: #2ecc71; |
| $color-river: #3498db; |
| $color-amethyst: #9b59b6; |
| $color-asphalt: #34495e; |
| $color-sea: #16a085; |
| $color-nephritis: #27ae60; |
| $color-belize: #2980b9; |
| $color-wisteria: #8e44ad; |
| $color-midnight: #2C3E50; |
| $color-sunflower: #F1C40F; |
| $color-orange: #F39C12; |
| $color-carrot: #E67E22; |
| $color-pumpkin: #D35400; |
| $color-alizarin: #E74C3C; |
| $color-pomegranate: #C0392B; |
| $color-cloud: #ECF0F1; |
| $color-silver: #BDC3C7; |
| $color-concrete: #95A5A6; |
| $color-asbestos: #7F8C8D; |
| |
| .syntaxhighlighter { |
| padding: 10px 5px; |
| border-radius: 6px; |
| } |
| |
| div.toolbar { |
| display: none; |
| } |
| |
| div, p, h1, h2, h3, span, body, html, ul, li { |
| font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; |
| font-size: 18px; |
| font-weight: 300; |
| letter-spacing: 0.2px; |
| } |
| |
| .carousel { |
| min-height: 500px; |
| } |
| |
| .screencast { |
| border: 1px #ddd solid; |
| } |
| |
| #overview h2, |
| #askquestion h2, |
| #sqlqueries h2, |
| #startdata h2, |
| #startcompute h2 { |
| padding: 0 0 20px 0; |
| line-height: 1.5em; |
| } |
| |
| h3, .h3 { |
| font-size: 22px; |
| color: #333; |
| font-weight: 400; |
| } |
| |
| h4, b { |
| font-weight: 400; |
| } |
| |
| p { |
| line-height: 1.5em; |
| color: #333; |
| font-size: 18px; |
| font-weight: 300; |
| letter-spacing: 0.2px; |
| } |
| |
| a { |
| color: #f00; |
| text-decoration: none; |
| font-weight: 300; |
| letter-spacing: 0.2px; |
| } |
| |
| sup, sub { |
| height: 0; |
| line-height: 1; |
| font-size: smaller; |
| vertical-align: baseline; |
| position: relative; |
| } |
| |
| sup { bottom: 0.8ex; } |
| sub { top: 0.5ex; } |
| |
| #overview { |
| margin: -38px 0 0; |
| padding-top: 80px; |
| } |
| |
| .carousel-inner p { |
| color: #fff; |
| } |
| |
| .carousel .img-holder { |
| margin: 0; |
| |
| img { |
| width: auto; |
| height: auto; |
| } |
| } |
| |
| #documentation table, |
| #download table, |
| #benchmarks table { |
| & > tbody > tr > th { |
| text-align: center; |
| background-color: $color-asphalt; |
| color: #fff; |
| } |
| |
| &, |
| & > tbody > tr > tr, |
| & > tbody > tr > th, |
| & > tbody > tr > td { |
| border: 1px solid $color-asphalt; |
| |
| &:first-child { |
| padding: 5px 20px |
| } |
| } |
| |
| ul#javadoc, |
| ul#docs, |
| ul#videos { |
| margin: 0; |
| padding: 4px 0; |
| list-style: none; |
| |
| & > li { |
| padding-bottom: 4px; |
| } |
| } |
| } |
| #benchmarks table { |
| margin-bottom: 35px |
| } |
| #benchmarks section { |
| padding: 90px 0 0 0; |
| margin-top: -40px; |
| border-bottom: 2px dotted #ddd; |
| |
| &.first-section { |
| margin-top: 0; |
| } |
| } |
| #benchmarks img { |
| margin: 0; |
| } |
| #community, |
| #askquestion { |
| ul#lists { |
| margin: 0; |
| padding: 4px 0; |
| list-style: none; |
| |
| & > li { |
| padding-bottom: 4px; |
| } |
| } |
| } |
| |
| #download table > tbody > tr > td { |
| text-align: center; |
| } |
| |
| #footer { |
| p { |
| font-size: 13px; |
| text-align: justify; |
| text-justify: inter-word; |
| } |
| .social-networks { |
| float: right; |
| } |
| } |
| |
| .footer-nav > ul { |
| padding-left: 50px; |
| |
| @media (max-width:$mobile) { |
| padding: 5px 0 10px 0; |
| } |
| } |
| |
| #header { |
| background: rgba(54, 54, 54, 0.95); |
| top: 0; |
| padding-top: 0px; |
| |
| } |
| |
| section.page-section { |
| padding: 160px 0 10px 0; |
| margin-top: -110px; |
| border-bottom: 2px dotted #ddd; |
| |
| table.twosides { |
| padding: 0 !important; |
| margin: 0 !important; |
| border: none !important; |
| |
| td { |
| padding: 0 !important; |
| margin: 0 !important; |
| border: none !important; |
| } |
| } |
| h1 { |
| font-size: 32px; |
| margin-bottom: 25px; |
| padding-bottom: 5px; |
| line-height: 1.5em; |
| color: #333; |
| font-weight: 400; |
| } |
| h2 { |
| font-size: 28px; |
| color: #333; |
| padding: 0 0 15px 0; |
| text-align: left; |
| font-weight: 400; |
| } |
| h3 { |
| font-size: 24px; |
| color: #333; |
| padding: 0 0 20px 0; |
| text-align: left; |
| font-weight: 400; |
| } |
| h4 { |
| font-size: 20px; |
| color: #333; |
| padding: 0 0 20px 0; |
| text-align: left; |
| font-weight: 400; |
| } |
| |
| &:last-child { |
| border-bottom: none |
| } |
| |
| ul.page-list, ol.page-list { |
| padding-left: 20px; |
| color: #333; |
| line-height: 1.5em; |
| |
| & > li { |
| padding-bottom: 4px; |
| } |
| } |
| |
| div.page-links { |
| margin: 20px 0 10px 0px; |
| font-weight: bold; |
| } |
| |
| div.page-heading { |
| padding-top: 10px; |
| font-weight: 400; |
| padding-bottom: 10px; |
| font-size: 24px; |
| line-height: 40px; |
| } |
| |
| .code-examples { |
| clear: both; |
| margin: 10px 0 10px 0; |
| } |
| |
| .github-examples { |
| margin-top: 40px; |
| } |
| |
| .videos > ul { |
| list-style: none; |
| padding-left: 0; |
| |
| li { |
| padding: 3px 0; |
| |
| i.fa { |
| color: $color-river; |
| } |
| } |
| |
| .video-title { |
| padding-left: 10px; |
| } |
| |
| .video-duration { |
| padding-left: 5px; |
| color: #aaa; |
| font-size: 12px |
| } |
| } |
| |
| .screencasts { |
| iframe { |
| border: 1px solid #eee; |
| } |
| } |
| } |
| |
| section.page-section .first { |
| padding-top: 120px; |
| } |
| |
| section.page-section .page-box { |
| div.page-left { |
| float: left; |
| |
| ul.page-list { |
| padding-left: 20px; |
| |
| & > li { |
| padding-bottom: 4px; |
| } |
| } |
| } |
| |
| div.page-right { |
| padding-top: 10px; |
| float: right; |
| } |
| } |
| |
| .syntaxhighlighter .code, |
| .syntaxhighlighter .gutter { |
| font-size: 16px !important; |
| } |
| |
| img[usemap], map area{ |
| outline: none; |
| } |
| |
| #list table { |
| width: auto; |
| |
| & > thead > tr { |
| background: #f5f5f5; |
| |
| & > th { |
| text-align: center; |
| } |
| } |
| |
| & > tbody > tr { |
| & > td:nth-child(3) { |
| text-align: center; |
| } |
| } |
| } |
| |
| .submenu-header { |
| display: block; |
| font-weight: bold; |
| padding: 3px 15px 0 15px; |
| font-size: 14px; |
| line-height: 1.9; |
| white-space: nowrap; |
| } |
| |
| .dropdown-menu >li >a { |
| font-size: 13px !important; |
| font-weight: normal; |
| line-height: 1.4; |
| } |
| |
| .dropdown-menu { |
| list-style-type: none !important; |
| } |
| |
| .dropdown-menu >li >a:hover { |
| color: $red; |
| background: none; |
| } |
| |
| .dropdown-menu .last { |
| padding-bottom: 3px; |
| } |
| |
| |
| .dropdown:hover .dropdown-menu { |
| display: block; |
| border-radius: 5px 5px 5px 5px ; |
| } |
| |
| .dropdown-menu .divider { |
| margin: 0; |
| } |
| |
| .dropdown-menu > div.items > li> a { |
| display: block; |
| padding: 3px 20px; |
| clear: both; |
| font-weight: normal; |
| line-height: 1.4; |
| color: #333333; |
| white-space: nowrap; |
| font-size: 13px !important; |
| |
| &:hover { |
| color: $red; |
| } |
| } |
| |
| table.overview { |
| width: 92% !important; |
| border: none !important; |
| margin: auto !important; |
| |
| & > thead > tr { |
| border-bottom: 1px solid grey !important; |
| |
| & > th { |
| color: #000; |
| font-size: 21px !important; |
| font-weight: 400; |
| border: none !important; |
| padding: 20px !important; |
| } |
| & .left { |
| padding-left: 20px !important; |
| } |
| & .border-right { |
| border-right: 1px solid grey !important; |
| } |
| } |
| |
| & > tbody { |
| & > tr:nth-child(even){ |
| background: #f5f5f5; |
| } |
| |
| & > tr { |
| |
| & > td { |
| border: none !important; |
| font-size: 18px !important; |
| |
| |
| & > p { |
| margin-top :8px; |
| margin-bottom :8px |
| } |
| |
| } |
| & .left { |
| padding-left: 20px !important; |
| } |
| & .border-right { |
| border-right: 1px solid grey !important; |
| } |
| } |
| } |
| } |
| |
| table.formatted { |
| border: 1px solid #ddd !important; |
| margin-bottom: 40px; |
| position: relative; |
| |
| letter-spacing: 0.2px; |
| |
| & > thead > tr { |
| background: #cfcfcf; |
| border: 1px solid #cfcfcf; |
| |
| & > th { |
| color: #000; |
| font-weight: bold; |
| border: none !important; |
| font-weight: 400; |
| } |
| & .left { |
| padding-left: 20px !important; |
| font-weight: 400; |
| } |
| } |
| |
| & > tbody { |
| |
| & > tr:nth-child(even){ |
| background: #f5f5f5; |
| } |
| |
| & > tr { |
| |
| & > td { |
| border: none !important; |
| |
| & > p { |
| margin-top :8px; |
| margin-bottom :8px; |
| @media (max-width: $mobile) { |
| margin-top :0px; |
| margin-right :5px; |
| padding-right: 5px; |
| } |
| } |
| |
| @media (max-width: $mobile) { |
| white-space: normal !important; |
| } |
| } |
| |
| & .left { |
| font-weight: bold; |
| padding-left: 20px !important; |
| font-weight: 400; |
| } |
| } |
| |
| @media (max-width: $mobile) { |
| border: none !important; |
| } |
| } |
| } |
| |
| #main table { |
| & td { |
| @media (max-width: $mobile) { |
| margin: 10px 0 5px -110px !important; |
| white-space: normal !important; |
| } |
| |
| & ul { |
| @media (max-width: $mobile) { |
| padding:0 0 0 20px ! important; |
| margin-right: 5px; |
| } |
| } |
| } |
| |
| & tr:nth-child(odd) td { |
| @media (max-width: $mobile) { |
| background-color: white; |
| } |
| } |
| |
| @media (max-width: $mobile) { |
| margin: 0 0 20px 0 !important; |
| } |
| } |
| |
| .centeredImage { |
| display: block; |
| margin-left: auto; |
| margin-right: auto; |
| } |
| |
| .page-menu { |
| |
| text-indent: 20px; |
| padding: 20px 0 0 0; |
| |
| & h3 { |
| font-size: 21px !important; |
| border-right: 1px solid grey; |
| border-bottom: 1px solid grey; |
| @media (max-width: $mobile) { |
| border: none; |
| } |
| } |
| |
| & ul { |
| list-style-type: none; |
| padding-left: 0; |
| border-right: 1px solid grey; |
| @media (max-width: $mobile) { |
| border: none; |
| padding-bottom: 20px; |
| } |
| |
| & > li { |
| padding-bottom: 10px; |
| padding-top: 10px; |
| height:40px; |
| } |
| |
| & > li:nth-child(even) { |
| background: #f5f5f5; |
| @media (max-width: $mobile) { |
| background: none; |
| } |
| } |
| } |
| |
| & .last { |
| border-right: none !important; |
| } |
| |
| & .empty { |
| @media (max-width: $mobile) { |
| height:0; |
| padding:0; |
| } |
| } |
| |
| & .col-sm-4, .col-md-4, .col-xs-12 { |
| padding-left: 0; |
| padding-right: 0; |
| } |
| } |
| |
| .dropdown-menu { |
| @media (max-width: $mobile) { |
| position: relative !important; |
| } |
| } |
| |
| iframe { |
| @media (max-width: $mobile) { |
| width : auto; |
| height: auto; |
| } |
| } |
| |
| .carousel .carousel-control { |
| @media (max-width: $mobile) { |
| visibility: hidden; |
| } |
| } |
| |
| .carousel { |
| @media (max-width: $mobile) { |
| min-height: 300px !important; |
| } |
| } |
| |
| #people { |
| & .col-xs-12 { |
| @media (max-width: $mobile) { |
| padding-right: 0px !important; |
| |
| & table.formatted.committers > tbody> tr > td:nth-child(odd) { |
| font-weight: 500; |
| } |
| } |
| } |
| } |
| |
| .syntaxhighlighter table td.gutter .line { |
| @media (max-width: $mobile) { |
| display: none !important; |
| } |
| } |
| |
| .ignite-img { |
| margin: 45px 35px 45px 35px; |
| |
| @media (max-width: $mobile) { |
| margin: 17px; |
| } |
| } |
| |
| #main table.benchmarks { |
| @media screen { |
| @media (max-width: $mobile) { |
| & > thead { |
| display: block !important; |
| } |
| |
| |
| & > thead > tr { |
| height: 50px; |
| & > th { |
| text-align: center; |
| display: block !important; |
| } |
| } |
| } |
| } |
| } |
| |
| .news-box { |
| background: #e8f1fc; |
| text-align: left; |
| border-radius: 6px; |
| padding: 12px 12px 0px 12px; |
| |
| h4 { |
| font-size: 16px; |
| margin-bottom: 12px; |
| } |
| |
| ul { |
| list-style-type: none; |
| padding-left: 0px; |
| |
| li { |
| padding-bottom: 15px; |
| font-size: 15px; |
| line-height: 1.2em; |
| color: #333; |
| a { |
| color: #333; |
| |
| &:hover { |
| text-decoration: underline; |
| } |
| } |
| } |
| } |
| |
| p { |
| font-size: 15px; |
| margin-bottom: 5px; |
| } |
| } |
| |
| .news-box-date { |
| font-size: 12px; |
| color: #888; |
| } |
| |
| .news-date { |
| font-size: 15px; |
| color: #888; |
| } |
| |
| section.news-section { |
| a > i { |
| opacity: 0; |
| color: #888; |
| font-size: 16px; |
| |
| &:hover { |
| opacity: 1; |
| color: rgb(255, 0, 0); |
| } |
| } |
| |
| h3 { |
| padding: 0 0 10px 0; |
| line-height: 1.5em; |
| |
| &:hover { |
| a > i { |
| opacity: 1; |
| } |
| } |
| } |
| p { |
| padding-top: 10px; |
| } |
| } |
| |
| .credits { |
| font-style: normal; |
| font-size: 15px; |
| } |
| |
| section#chatroom #gitter-badge { |
| margin-left: 10px; |
| } |
| |
| .delta { |
| color: #449d44 |
| } |
| |
| .img-caption { |
| font-size: 13px; |
| text-align: center; |
| margin-bottom: 0px; |
| } |
| |
| .addons-contibutor { |
| font-size: 13px; |
| } |
| |
| table.features { |
| & p { |
| margin-bottom: 20px !important; |
| } |
| } |
| |
| tr.sub-heading { |
| & > th { |
| background: #cfcfcf !important; |
| border: 1px solid #cfcfcf !important; |
| color: #000; |
| font-weight: 400; |
| } |
| } |
| |
| .feature-section { |
| padding: 90px 0 10px 0; |
| margin-top: -70px; |
| } |
| |
| .feature-header { |
| color: #333; |
| font-size: 24px; |
| |
| &:hover { |
| color: $red; |
| } |
| } |
| |
| .features-left { |
| padding-left: 20px !important; |
| font-weight: 400; |
| width :35%; |
| } |
| |
| .btn-download { |
| color: #fff; |
| background-color: #c51017; |
| border-color: #ad0e14; |
| position: relative; |
| top: -8px; |
| padding: 5px 14px 5px 14px; |
| font-size: 18px; |
| border-radius: 5px; |
| |
| &:hover { |
| color: #fff; |
| background-color: #960c11; |
| border-color: #960c11; |
| } |
| |
| } |
| |
| .github-image { |
| font-size: 1.7em !important; |
| position: relative; |
| top: -3px; |
| |
| @media(max-width: $mobile){ |
| display: none !important; |
| } |
| } |
| |
| #top-nav { |
| text-align: right; |
| line-height: 20px; |
| padding: 21px 0 0; |
| letter-spacing: 0.1px; |
| position: static; |
| |
| @media (max-width: $mobile) { |
| padding: 10px 10px 0; |
| text-align: center; |
| |
| .navbar-collapse { |
| overflow: hidden; |
| position: absolute; |
| top: 100%; |
| left: 0; |
| right: 0; |
| z-index: 99; |
| margin: 10px 0 0; |
| background: rgba(54,54,54,0.95); |
| } |
| } |
| .container-fluid { |
| padding: 0; |
| } |
| .navbar-toggle { |
| margin: 0; |
| } |
| .navbar-nav { |
| float: none; |
| letter-spacing: -4px; |
| |
| @media (max-width: $mobile) { |
| padding: 10px 0; |
| } |
| > li { |
| @extend %align-top; |
| letter-spacing: normal; |
| float: none; |
| margin: 0 0 0 20px; |
| font-size: 14px; |
| color: #d7d7d7; |
| |
| @media (max-width: $mobile) { |
| display: block; |
| margin: 0; |
| padding: 5px 10px; |
| } |
| >a { |
| padding: 0; |
| color: #d7d7d7; |
| @extend %align-top; |
| } |
| } |
| } |
| } |
| |
| section.blog-section { |
| h3 { |
| padding: 0 0 10px 0; |
| line-height: 1.2em; |
| } |
| p { |
| padding-top: 10px; |
| } |
| } |
| |
| .blog-img { |
| width: 40px; |
| height: 40px; |
| margin-right:10px; |
| } |
| |
| .blog-date { |
| font-size: 15px; |
| color: #888; |
| } |
| |
| section.page-subsection { |
| padding: 120px 0 10px 0; |
| margin-top: -110px; |
| border-bottom: none; |
| } |
| |
| .t-image { |
| position: relative; /* Declared position allows for location changes */ |
| top: -10px; /* Moves the image 2px closer to the top of the page */ |
| } |
| |
| .features-icon { |
| color: white; |
| text-align: center; |
| display: block !important; |
| padding-top: 15px; |
| margin: auto; |
| width: 80px; |
| height: 80px; |
| background: #d7d7d7; |
| |
| &:hover { |
| background: #c51017; |
| } |
| } |
| |
| .features-text { |
| text-align: justify; |
| } |
| |
| .features-box { |
| padding-right: 10px; |
| padding-left: 10px; |
| h2 { |
| text-align: center !important; |
| } |
| p { |
| text-align: center; |
| } |
| } |
| |
| .features-box-left { |
| padding-right: 20px; |
| padding-left: 0; |
| } |
| |
| .features-box-right { |
| padding-right: 0; |
| padding-left: 20px; |
| } |
| |
| .screencast-center { |
| padding-right: 10px; |
| padding-left: 10px; |
| |
| @media (max-width: $tablet) { |
| text-align: center; |
| padding-left: 0; |
| padding-right: 0; |
| } |
| } |
| |
| .screencast-left { |
| padding-left: 0; |
| |
| @media (max-width: $tablet) { |
| text-align: center; |
| } |
| } |
| |
| .screencast-right { |
| padding-right: 0; |
| padding-left: 20px; |
| |
| @media (max-width: $tablet) { |
| text-align: center; |
| padding-left: 0; |
| } |
| } |
| |
| .screencast-duration { |
| color: #888; |
| font-size: 14px; |
| line-height: 1.6em; |
| } |
| |
| .video-modal-content { |
| margin-top: 200px; |
| width: 700px; |
| height: 500px; |
| } |
| |
| .news-socialmedia-icons { |
| float: right !important; |
| } |
| |
| .news-socialmedia-share { |
| display:inline; |
| font-size: 16px; |
| color: #888; |
| } |
| |
| .news-readmore { |
| padding-left: 0px; |
| } |
| |
| .video-description { |
| color: #888; |
| font-size: 14px; |
| line-height: 1.6em; |
| } |
| |
| .main-banner { |
| min-height: 375px; |
| margin-top: 133px; |
| font-size: 24px; |
| line-height: 24px; |
| color: $white; |
| z-index: 9; |
| position: relative; |
| background-color: rgb(0, 0, 0) !important; |
| background: url(../images/bannernodots-optimized-75.jpg) no-repeat center/cover; |
| @include transition(all, 0.2s, linear); |
| |
| @media (max-width: $tablet) { |
| min-height: 400px; |
| } |
| @media (max-width: $mobile) { |
| min-height: 325px; |
| } |
| |
| .banner { |
| padding: 50px 0 0; |
| |
| @media (max-width: $mobile) { |
| padding: 0px; |
| } |
| } |
| |
| .text{ |
| font-size: 35px; |
| line-height: 35px; |
| letter-spacing: 1.1px; |
| font-weight: 400; |
| margin: 0 0 15px; |
| text-align: left; |
| |
| @media (max-width: $mobile) { |
| margin: 0 0 5px; |
| font-size: 30px; |
| line-height: 50px; |
| } |
| |
| & > span { |
| font-size: 35px; |
| line-height: 35px; |
| font-weight: 400; |
| |
| @media (max-width: $mobile) { |
| text-align: center; |
| line-height: 50px; |
| font-size: 30px; |
| } |
| |
| |
| } |
| & > h1 { |
| font-size:30px; |
| line-height: 35px; |
| letter-spacing: 1.1px; |
| font-weight: 400; |
| } |
| |
| } |
| |
| p { |
| padding-top: 10px; |
| font-size: 24px; |
| color: $white; |
| } |
| |
| .buttons { |
| margin: 0 0 12px; |
| letter-spacing: -4px; |
| |
| @media (max-width: $mobile) { |
| margin: 0; |
| } |
| li{ |
| @extend %align-top; |
| letter-spacing: normal; |
| margin: 0 10px 10px; |
| } |
| } |
| } |
| |
| .section-heading { |
| height: 75px; |
| text-align: center; |
| margin-top: 50px; |
| margin-bottom: 20px; |
| padding-top:30px; |
| |
| h2 { |
| font-size: 28px; |
| font-weight: 300; |
| letter-spacing: 5px; |
| line-height: 35px; |
| } |
| |
| h1 { |
| font-size: 30px; |
| font-weight: 300; |
| letter-spacing: 5px; |
| line-height: 35px; |
| } |
| |
| @media (max-width: $mobile) { |
| height: 105px; |
| } |
| } |
| |
| .feature-box { |
| h3 { |
| text-align: center !important; |
| font-weight: 300 !important; |
| |
| &:hover { |
| color: #e50000; |
| } |
| } |
| |
| p { |
| text-align: center; |
| Line-height: 24px; |
| font-weight: 300 !important; |
| } |
| |
| hr{ |
| border-top: none !important; |
| border-bottom: 1px solid #d7d7d7 !important; |
| width: 100px; |
| margin-top: 0px; |
| margin-bottom: 40px; |
| |
| @media (max-width: $mobile) { |
| display: none; |
| } |
| } |
| } |
| |
| .feature-box-left { |
| padding-right: 20px; |
| padding-left: 0px; |
| } |
| |
| .feature-box-center { |
| padding-right: 10px; |
| padding-left: 10px; |
| } |
| |
| .feature-box-right { |
| padding-right: 0px; |
| padding-left: 20px; |
| } |
| |
| .cross-mark { |
| color:red; |
| } |
| |
| .check-mark { |
| color:green; |
| } |
| |
| .social-media { |
| text-align: left; |
| border-radius: 6px; |
| padding: 0px 12px 0px 12px; |
| top: -30px; |
| |
| h4 { |
| font-size: 16px; |
| margin-bottom: 12px; |
| border-bottom: 1px solid black; |
| } |
| |
| h3 { |
| margin-bottom: 12px; |
| border-bottom: 1px solid black; |
| font-weight: 300 !important; |
| font-size: 24px !important; |
| } |
| ul { |
| list-style-type: none; |
| padding-left: 0px; |
| padding-right:20px; |
| |
| li { |
| padding-bottom: 15px; |
| font-size: 15px; |
| line-height: 1.2em; |
| color: #333; |
| a { |
| color: #333; |
| |
| &:hover { |
| text-decoration: underline; |
| } |
| } |
| } |
| } |
| |
| p { |
| font-size: 15px; |
| margin-bottom: 5px; |
| } |
| |
| @media(max-width: $mobile) { |
| margin-bottom: 40px; |
| } |
| } |
| |
| hr { |
| border: 0; |
| border-top: 1px solid #d7d7d7; |
| border-bottom: 1px solid #d7d7d7; |
| max-width: 250px; |
| height: 5px; |
| } |
| |
| .banner-buttons { |
| width: 400px; |
| @media(max-width: $mobile) { |
| width: 215px; |
| } |
| } |
| |
| .banner-buttons-left { |
| width:200px; |
| float:left; |
| @media (max-width: $mobile) { |
| width:175px; |
| } |
| } |
| |
| .banner-buttons-right { |
| width:200px; |
| float:right; |
| @media (max-width: $mobile) { |
| width:215px; |
| } |
| } |
| |
| .banner-learn-more { |
| background-color: #e50000; |
| width : 175px; |
| text-align:center; |
| border-radius: 7px; |
| letter-spacing: 1.1px; |
| margin-top: 50px; |
| |
| @media(max-width: $mobile) { |
| margin-top: 30px; |
| margin-bottom: 20px; |
| } |
| |
| p { |
| color: #fff; |
| font-size: 20px !important; |
| margin-bottom: 0px; |
| padding-bottom: 10px; |
| font-weight: 400; |
| |
| @media(max-width: $mobile) { |
| font-size: 18px !important; |
| } |
| } |
| |
| transition: background-color 0.2s linear; |
| -moz-transition: background-color 0.2s linear; |
| -webkit-transition: background-color 0.2s linear; |
| -ms-transition: background-color 0.2s linear; |
| -o-transition: background-color 0.2s linear; |
| |
| &:hover { |
| background-color: #941d15 !important; |
| color: #fff !important; |
| } |
| |
| &:active { |
| background-color: #941d15; |
| -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.55); |
| -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.55); |
| -ms-transition: inset 0 0 3px rgba(0,0,0,0.55); |
| -o-transition: inset 0 0 3px rgba(0,0,0,0.55); |
| box-shadow: inset 0 0 3px rgba(0,0,0,0.55); |
| } |
| } |
| |
| .banner-getting-started { |
| border: 2px solid #e50000; |
| width : 165px; |
| text-align:center; |
| border-radius: 7px; |
| letter-spacing: 1.1px; |
| margin-top: 50px; |
| height: 50px; |
| |
| @media(max-width: $mobile) { |
| margin-top: 5px; |
| margin-bottom: 20px; |
| height: 47px; |
| } |
| |
| p { |
| color: #fff; |
| font-size: 20px !important; |
| margin-bottom: 0px; |
| padding-bottom: 10px; |
| font-weight: 400; |
| |
| @media(max-width: $mobile) { |
| font-size: 18px !important; |
| } |
| } |
| |
| transition: background-color 0.2s linear; |
| -moz-transition: background-color 0.2s linear; |
| -webkit-transition: background-color 0.2s linear; |
| -ms-transition: background-color 0.2s linear; |
| -o-transition: background-color 0.2s linear; |
| |
| &:hover { |
| background-color: #e50000 !important; |
| color: #fff !important; |
| } |
| |
| &:active { |
| background-color: #e50000; |
| -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.55); |
| -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.55); |
| -ms-transition: inset 0 0 3px rgba(0,0,0,0.55); |
| -o-transition: inset 0 0 3px rgba(0,0,0,0.55); |
| box-shadow: inset 0 0 3px rgba(0,0,0,0.55); |
| } |
| } |
| |
| table.comparison-matrix { |
| border: none !important; |
| margin-bottom: 20px; |
| position: relative; |
| |
| & > thead > tr { |
| background: #e50000; |
| border: 1px solid #e50000; |
| |
| & > th { |
| color: white; |
| font-size: 20px !important; |
| font-weight: 400; |
| border: none !important; |
| } |
| & .left { |
| padding-left: 20px !important; |
| } |
| } |
| |
| & > tbody { |
| |
| & > tr { |
| border-bottom: 1px solid #d7d7d7; |
| & > td { |
| border: none !important; |
| font-weight: 300; |
| letter-spacing: 0.2px; |
| padding-right: 0px !important; |
| |
| & > p { |
| margin-top : 8px; |
| margin-bottom : 8px; |
| |
| |
| @media (max-width: $mobile) { |
| margin-top : 0px; |
| margin-right : 5px; |
| padding-right: 5px; |
| } |
| } |
| |
| @media (max-width: $mobile) { |
| white-space: normal !important; |
| } |
| } |
| |
| & .left { |
| font-weight: bold; |
| padding-left: 20px !important; |
| } |
| } |
| |
| @media (max-width: $mobile) { |
| border: none !important; |
| } |
| } |
| |
| @media (max-width: $mobile) { |
| display: none !important; |
| } |
| } |
| |
| |
| |
| |
| table.comparison-matrix-mobile { |
| display: none; |
| @media (max-width: $mobile) { |
| border: none !important; |
| padding-bottom: 20px; |
| position: relative; |
| |
| |
| & > thead { |
| display: block !important; |
| & > tr { |
| background: #e50000; |
| border: 1px solid #e50000; |
| height: 40px; |
| & > th { |
| color: white; |
| font-size: 20px !important; |
| font-weight: 400; |
| border: none !important; |
| display: block !important; |
| text-align: center; |
| padding : 10px !important; |
| } |
| |
| } |
| } |
| |
| & > tbody { |
| |
| & > tr { |
| border-bottom: 1px solid #d7d7d7; |
| |
| & > td { |
| border: none !important; |
| font-weight: 300; |
| letter-spacing: 0.2px; |
| vertical-align: middle; |
| |
| & > span { |
| padding: 0px !important; |
| } |
| |
| & .right { |
| float: right; |
| width: 50%; |
| margin-left: 10px; |
| } |
| |
| & .left { |
| |
| } |
| } |
| |
| &.ignite { |
| background: #eee; |
| } |
| } |
| |
| @media (max-width: $mobile) { |
| border: none !important; |
| } |
| } |
| } |
| } |
| |
| .github-stats-bar { |
| background: #e50000; |
| padding-top: 12px; |
| padding-bottom: 7px; |
| } |
| |
| .download-button-dropdown { |
| background-color: #e50000; |
| border-radius: 5px; |
| padding-top: 5px !important; |
| padding-bottom: 5px !important; |
| padding-left: 5px !important; |
| padding-right: 5px !important; |
| top: -5px; |
| font-weight: 400; |
| |
| transition: background-color 0.2s linear; |
| -moz-transition: background-color 0.2s linear; |
| -webkit-transition: background-color 0.2s linear; |
| -ms-transition: background-color 0.2s linear; |
| -o-transition: background-color 0.2s linear; |
| |
| &:hover { |
| background-color: #941d15 !important; |
| color: white !important; |
| } |
| |
| &:active { |
| background-color: #941d15; |
| -moz-box-shadow: inset 0 0 3px rgba(0,0,0,0.55); |
| -webkit-box-shadow: inset 0 0 3px rgba(0,0,0,0.55); |
| -ms-transition: inset 0 0 3px rgba(0,0,0,0.55); |
| -o-transition: inset 0 0 3px rgba(0,0,0,0.55); |
| box-shadow: inset 0 0 3px rgba(0,0,0,0.55); |
| } |
| } |
| |
| .news-announcement { |
| background :#ffab40; |
| height: 24px; |
| & p { |
| font-size: 14px; |
| text-align: center; |
| color: #393939; |
| margin-bottom: 0px; |
| padding-top: 5px; |
| font-weight:400; |
| |
| & a { |
| color: #393939; |
| text-decoration: underline; |
| font-weight:400; |
| } |
| } |
| } |
| |
| a.social-media-bar { |
| color: #24292e; |
| position: relative; |
| top: -8px; |
| background-color: #eff3f6; |
| |
| margin-right: 1px; |
| padding: 3px 10px 3px 10px !important; |
| |
| border-width: 1px; |
| border-style: solid; |
| border-color: #d1d2d3; |
| border-image: initial; |
| border-radius: 0.25em; |
| |
| |
| & span { |
| vertical-align: 2px; |
| font-size: 12px; |
| font-weight: 600; |
| font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; |
| } |
| |
| &:hover { |
| background-color: #e6ebf1; |
| border-color: #afb1b2; |
| } |
| } |
| |
| .social-media-icon { |
| font-size: 16px !important; |
| } |
| |
| a.timeline-Tweet-text { |
| font-size: 15px!important; |
| } |
| |
| .highlight-ignite-comparison { |
| background-color: #eee; |
| background-clip: padding-box; /* for Firefox and IE*/ |
| } |
| |
| .durable-memory-panel { |
| p.feature-icon { |
| background-image: url("/images/durable_memory_icon.svg"); |
| } |
| |
| &:hover { |
| p.feature-icon { |
| background-image: url("/images/durable_memory_red_icon.svg"); |
| } |
| } |
| } |
| |
| .distributed-sql-panel { |
| p.feature-icon { |
| background-image: url("/images/distributed_sql_icon.svg"); |
| } |
| |
| &:hover { |
| p.feature-icon { |
| background-image: url("/images/distributed_sql_red_icon.svg"); |
| } |
| } |
| } |
| |
| .acid-transactions-panel { |
| p.feature-icon { |
| background-image: url("/images/acid_transactions_icon.svg"); |
| } |
| |
| &:hover { |
| p.feature-icon { |
| background-image: url("/images/acid_transactions_red_icon.svg"); |
| } |
| } |
| } |
| |
| .key-value-panel{ |
| p.feature-icon { |
| background-image: url("/images/key_value_icon.svg"); |
| } |
| |
| &:hover { |
| p.feature-icon { |
| background-image: url("/images/key_value_red_icon.svg"); |
| } |
| } |
| } |
| |
| .collocated-processing-panel{ |
| p.feature-icon { |
| background-image: url("/images/collocated_processing_icon.svg"); |
| } |
| &:hover { |
| p.feature-icon { |
| background-image: url("/images/collocated_processing_red_icon.svg"); |
| } |
| } |
| } |
| |
| .machine-learning-panel { |
| p.feature-icon { |
| background-image: url("/images/machine_learning_icon.svg"); |
| } |
| &:hover { |
| p.feature-icon { |
| background-image: url("/images/machine_learning_red_icon.svg"); |
| } |
| } |
| } |
| |
| .ignite-used-by-panel { |
| p.feature-icon { |
| background-image: url("/images/ignite_used_by.svg"); |
| } |
| |
| &:hover { |
| p.feature-icon { |
| background-image: url("/images/ignite_used_by_red.svg"); |
| } |
| } |
| } |
| |
| .keep-your-database-panel { |
| p.feature-icon { |
| background-image: url("/images/keep_your_database.svg"); |
| } |
| |
| &:hover { |
| p.feature-icon { |
| background-image: url("/images/keep_your_database_red.svg"); |
| } |
| } |
| } |
| |
| .sql-at-nosql-scale-panel { |
| p.feature-icon { |
| background-image: url("/images/sql_at_nosql_scale.svg"); |
| } |
| |
| &:hover { |
| p.feature-icon { |
| background-image: url("/images/sql_at_nosql_scale_red.svg"); |
| } |
| } |
| } |
| |
| .durable-memory-panel, .distributed-sql-panel, .acid-transactions-panel, |
| .key-value-panel, .collocated-processing-panel, .machine-learning-panel, |
| .sql-at-nosql-scale-panel, .keep-your-database-panel, .ignite-used-by-panel{ |
| p.feature-icon { |
| height: 50px; |
| width: 50px; |
| display: block; |
| margin-left: auto; |
| margin-right: auto; |
| } |
| &:hover { |
| p.feature-icon { |
| height: 50px; |
| width: 50px; |
| display: block; |
| margin-left: auto; |
| margin-right: auto; |
| } |
| h2 { |
| color: #e50000; |
| |
| } |
| } |
| } |
| |
| .relative { |
| position:relative; |
| } |
| |
| .video-image-text{ |
| position: absolute; |
| bottom: 60px; |
| color: #ef0000 !important; |
| width: 100%; |
| text-align: center; |
| font-size: 18px !important; |
| letter-spacing: 2px; |
| padding-left: 10px; |
| |
| &:hover { |
| text-decoration: underline; |
| } |
| |
| @media(max-width: $tablet) |
| { |
| padding-left: 0px; |
| |
| } |
| } |
| |
| .event-date { |
| background-color: #ef0000; |
| width: 50px; |
| line-height:22px; |
| text-align: center; |
| color: #fff; |
| font-weight: 300; |
| border-radius: 5px; |
| } |
| |
| .event-date-col { |
| max-width:80px; |
| } |
| |
| .event-title { |
| @media(max-width: $tablet) { |
| width: 400px; |
| margin-bottom: 10px; |
| top: -3px; |
| } |
| |
| @media(max-width: $mobile) { |
| width: 270px; |
| margin-top: 10px; |
| margin-bottom: 10px; |
| top: -3px; |
| } |
| } |
| |
| a.event-link { |
| font-weight: normal; |
| font-size: 16px; |
| line-height: 20px; |
| color: #333; |
| |
| &:hover { |
| |
| text-decoration: underline; |
| } |
| } |
| |
| .event-details { |
| font-size: 13px; |
| line-height: 15px; |
| color: #888; |
| font-weight: 300; |
| } |
| |
| |
| hr.vertical { |
| height: 18px; |
| width: 0; |
| border: 1px solid #e50000; |
| text-align: left !important; |
| margin-left: 22px !important; |
| margin-top: 0px !important; |
| margin-bottom: 0px !important; |
| |
| @media(max-width: $tablet) { |
| display: none; |
| } |
| } |
| |
| #ignite-faq { |
| |
| h2 { |
| font-size: 32px; |
| } |
| |
| h3 { |
| font-size: 28px; |
| line-height: 40px; |
| } |
| } |
| |
| .header { |
| background: rgba(0, 0, 0, 1.0) !important; |
| |
| &.affix { |
| background: rgba(0, 0, 0, 1.0) !important; |
| } |
| } |
| |
| .github-stats { |
| text-align: left; |
| |
| @media (max-width: $tablet) { |
| width: 500px; |
| } |
| |
| @media (max-width: $mobile) { |
| display: none; |
| } |
| } |
| |
| .twitter-follow { |
| text-align: right; |
| padding-top: 5px; |
| |
| @media (max-width: $mobile) { |
| text-align: left; |
| padding-bottom: 5px; |
| } |
| |
| @media (max-width: $tablet) { |
| width: 250px; |
| } |
| } |
| |
| div.square { |
| border: solid 25px #ef0000; |
| border-radius: 5px; |
| width: 50px; |
| height: 50px; |
| } |
| |
| #whatisignite { |
| |
| .heading { |
| |
| @media (max-width: $mobile) { |
| padding-top: 120px; |
| } |
| |
| & span { |
| color: #e50000; |
| font-size: 32px; |
| font-weight: 400; |
| } |
| } |
| |
| .description-block { |
| padding: 0px; |
| margin-bottom: 30px; |
| |
| @media (max-width: $tablet) { |
| height: auto; |
| margin-bottom: 50px; |
| } |
| |
| & .ignite-image { |
| padding-right:0; |
| top: -115px; |
| |
| @media (max-width: $tablet) { |
| top: auto; |
| } |
| |
| @media (max-width: $mobile) { |
| top: auto; |
| margin-top: 20px; |
| } |
| } |
| |
| p { |
| font-size: 28px; |
| line-height: 40px; |
| } |
| } |
| |
| .img-holder { |
| width:100%; |
| height:100%; |
| margin-bottom: 30px; |
| } |
| |
| .img-holder img { |
| display: block; |
| margin-left: auto; |
| margin-right: auto; |
| } |
| |
| ul { |
| font-size:27px; |
| padding-left: 15px; |
| margin-left: 10px; |
| color: #e50000; |
| |
| li { |
| |
| p { |
| font-size:24px; |
| margin-bottom: 5px; |
| } |
| } |
| } |
| } |
| |
| .download-button-visibilty { |
| @media (max-width: 1025px) { |
| display: none !important; |
| } |
| } |
| |
| .wrapper-main-banner { |
| background-color: rgb(0, 0, 0); |
| } |
| |
| #navbar-mobile { |
| @media (min-width: $mobile) { |
| display: none !important; |
| } |
| } |
| |
| .dropdown > ul.lg-screen-menu { |
| width: 475px; /* fallback for IE */ |
| width: -webkit-max-content; |
| width: -moz-max-content; |
| /* width: -ms-max-content; */ |
| width: -o-max-content; |
| |
| @media (max-width: $mobile) { |
| display: none !important; |
| } |
| } |
| |
| .dropdown > ul.mobile-menu { |
| @media (min-width: $mobile) { |
| display: none !important; |
| } |
| } |
| |
| |
| #whatisignite-feature-desc { |
| |
| h2 { |
| font-size: 32px; |
| } |
| |
| h3 { |
| font-size: 28px; |
| line-height: 40px; |
| } |
| |
| p { |
| padding-bottom: 30px; |
| } |
| } |
| |
| .usecase-video { |
| padding:0 0 20px 0; |
| } |
| |
| .usecase-video-title { |
| padding-bottom: 10px !important; |
| padding-top: 10px !important; |
| line-height: 30px; |
| } |
| |
| .usecase-video-presenter { |
| font-size: 18px; |
| color: #888; |
| } |
| |
| .usecase-video-company { |
| font-size: 15px; |
| color: #888; |
| } |
| |
| /* Fix menu for IE, Edge */ |
| .dropdown-menu > div.items > li { |
| list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=); |
| } |
| |
| /* Fix menu for IE, Edge */ |
| .dropdown-menu > li { |
| list-style-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mNkYAAAAAYAAjCB0C8AAAAASUVORK5CYII=); |
| } |
| |
| #ignite-facts { |
| > .fact-panel { |
| margin-bottom: 40px; |
| |
| h3 { |
| line-height: 30px; |
| color: #e50000; |
| padding-bottom: 10px; |
| padding-top: 10px; |
| } |
| |
| > .left { |
| padding-left: 0px; |
| padding-right: 15px; |
| } |
| |
| > .right { |
| padding-right: 0px; |
| padding-left: 15px; |
| } |
| |
| hr { |
| border-top: none !important; |
| border-bottom: 1px solid #d7d7d7 !important; |
| width: 100px; |
| margin-top: 0px; |
| margin-bottom: 40px; |
| } |
| } |
| } |
| |
| .ignite-facts-question { |
| margin-bottom: 10px; |
| } |
