X-Git-Url: http://git.ipfire.org/?a=blobdiff_plain;f=static%2Fcss%2Fstyle.css;h=e0f848a4f53bafe31b56c5ba40981953562dc67d;hb=b3af5d9ba1ac60df876f5e40f8c7e7c105ccb16b;hp=c8e08b0a0ceb1aec67cc22b7df3c455c341d32a1;hpb=b6eb516242dbdf6cf9b8b92c7e593e1fda470ea8;p=ipfire.org.git

diff --git a/static/css/style.css b/static/css/style.css
index c8e08b0a..e0f848a4 100644
--- a/static/css/style.css
+++ b/static/css/style.css
@@ -222,8 +222,8 @@ body {
   font-size: 1rem;
   font-weight: normal;
   line-height: 1.5;
-  color: #292b2c;
-  background-color: #fff; }
+  color: #263238;
+  background-color: #eceff1; }
 
 [tabindex="-1"]:focus {
   outline: none !important; }
@@ -482,53 +482,28 @@ mark,
 .blockquote-reverse .blockquote-footer::after {
   content: "\00A0 \2014"; }
 
-.img-fluid {
-  max-width: 100%;
-  height: auto; }
-
-.img-thumbnail {
-  padding: 0.25rem;
-  background-color: #fff;
-  border: 1px solid #ddd;
-  border-radius: 0.25rem;
-  -webkit-transition: all 0.2s ease-in-out;
-  transition: all 0.2s ease-in-out;
-  max-width: 100%;
-  height: auto; }
-
-.figure {
-  display: inline-block; }
-
-.figure-img {
-  margin-bottom: 0.25rem;
-  line-height: 1; }
-
-.figure-caption {
-  font-size: 90%;
-  color: #636c72; }
-
 .container {
   position: relative;
   margin-left: auto;
   margin-right: auto;
-  padding-right: 15px;
-  padding-left: 15px; }
+  padding-right: 12px;
+  padding-left: 12px; }
   @media (min-width: 576px) {
     .container {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 768px) {
     .container {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 992px) {
     .container {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 1200px) {
     .container {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 576px) {
     .container {
       width: 540px;
@@ -550,24 +525,24 @@ mark,
   position: relative;
   margin-left: auto;
   margin-right: auto;
-  padding-right: 15px;
-  padding-left: 15px; }
+  padding-right: 12px;
+  padding-left: 12px; }
   @media (min-width: 576px) {
     .container-fluid {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 768px) {
     .container-fluid {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 992px) {
     .container-fluid {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 1200px) {
     .container-fluid {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
 
 .row {
   display: -webkit-box;
@@ -575,24 +550,24 @@ mark,
   display: flex;
   -ms-flex-wrap: wrap;
       flex-wrap: wrap;
-  margin-right: -15px;
-  margin-left: -15px; }
+  margin-right: -12px;
+  margin-left: -12px; }
   @media (min-width: 576px) {
     .row {
-      margin-right: -15px;
-      margin-left: -15px; } }
+      margin-right: -12px;
+      margin-left: -12px; } }
   @media (min-width: 768px) {
     .row {
-      margin-right: -15px;
-      margin-left: -15px; } }
+      margin-right: -12px;
+      margin-left: -12px; } }
   @media (min-width: 992px) {
     .row {
-      margin-right: -15px;
-      margin-left: -15px; } }
+      margin-right: -12px;
+      margin-left: -12px; } }
   @media (min-width: 1200px) {
     .row {
-      margin-right: -15px;
-      margin-left: -15px; } }
+      margin-right: -12px;
+      margin-left: -12px; } }
 
 .no-gutters {
   margin-right: 0;
@@ -606,24 +581,24 @@ mark,
   position: relative;
   width: 100%;
   min-height: 1px;
-  padding-right: 15px;
-  padding-left: 15px; }
+  padding-right: 12px;
+  padding-left: 12px; }
   @media (min-width: 576px) {
     .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 768px) {
     .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 992px) {
     .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
   @media (min-width: 1200px) {
     .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl {
-      padding-right: 15px;
-      padding-left: 15px; } }
+      padding-right: 12px;
+      padding-left: 12px; } }
 
 .col {
   -ms-flex-preferred-size: 0;
@@ -1424,7 +1399,7 @@ mark,
 
 .btn {
   display: inline-block;
-  font-weight: normal;
+  font-weight: 600;
   line-height: 0.95;
   text-align: center;
   white-space: nowrap;
@@ -2553,7 +2528,7 @@ button.list-group-item-danger {
   vertical-align: text-top !important; }
 
 .bg-faded {
-  background-color: #f7f7f7; }
+  background-color: #e3e8eb; }
 
 .bg-primary {
   background-color: #0275d8 !important; }
@@ -4874,7 +4849,7 @@ a.bg-inverse:focus, a.bg-inverse:hover {
   font-weight: 300; }
 
 .font-weight-bold {
-  font-weight: bold; }
+  font-weight: 900; }
 
 .font-italic {
   font-style: italic; }
@@ -4994,16 +4969,187 @@ a.text-gray-dark:focus, a.text-gray-dark:hover {
   .hidden-print {
     display: none !important; } }
 
+.amber-800 {
+  color: #ff8f00; }
+
+h1 {
+  line-height: 3rem; }
+
+h2 {
+  line-height: 2.75rem; }
+
+h3 {
+  line-height: 2rem; }
+
 h4 {
-  font-weight: 600; }
+  font-weight: 600;
+  line-height: 1.75rem; }
+
+h5 {
+  line-height: 1.5rem; }
+
+p {
+  line-height: 1.5rem; }
+  p.lead {
+    line-height: 2rem; }
+    @media (max-width: 991px) {
+      p.lead {
+        font-size: 1.5rem;
+        line-height: 2rem; } }
+    @media (max-width: 767px) {
+      p.lead {
+        font-size: 1rem;
+        line-height: 1.5rem; } }
+
+.display-2 {
+  margin-bottom: 4rem; }
+  @media (max-width: 991px) {
+    .display-2 {
+      font-size: 2.5rem;
+      line-height: 3.5rem;
+      margin-bottom: 3rem; } }
+  @media (max-width: 767px) {
+    .display-2 {
+      font-size: 2rem;
+      line-height: 2.75rem; } }
+
+@media (max-width: 767px) {
+  .display-4 {
+    font-size: .875rem;
+    line-height: 1.25rem; } }
+
+small {
+  line-height: 1rem; }
+
+.truncate {
+  width: 100%;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis; }
+
+img.img-fluid {
+  width: 100%;
+  max-width: 100%;
+  height: auto; }
+
+.icon {
+  width: 1.5rem;
+  height: 1.5rem;
+  fill: currentColor;
+  vertical-align: -.15rem;
+  overflow: hidden;
+  margin-right: .5rem; }
+
+.i_arrow_down {
+  margin: 0;
+  position: absolute;
+  left: .75rem;
+  top: -.25rem;
+  -webkit-animation: scroll 3s infinite;
+          animation: scroll 3s infinite; }
+  @media (max-width: 767px) {
+    .i_arrow_down {
+      width: 2rem !important;
+      height: 2rem !important;
+      left: .15rem;
+      top: -.75rem; } }
+
+.i_lg {
+  width: 2.5rem;
+  height: 2.5rem;
+  margin: 0;
+  -webkit-transform: translateY(-0.35rem);
+          transform: translateY(-0.35rem);
+  fill: #b71c1c; }
+
+.i_sm {
+  vertical-align: top;
+  -webkit-transform: translateY(-0.1rem);
+          transform: translateY(-0.1rem); }
+
+footer .btn-toolbar .icon {
+  height: 2.25rem;
+  width: 2.25rem;
+  fill: rgba(38, 50, 56, 0.6); }
+
+footer .i_heart {
+  vertical-align: top;
+  -webkit-transform: translateY(-0.15rem);
+          transform: translateY(-0.15rem); }
+  @media (max-width: 767px) {
+    footer .i_heart {
+      -webkit-transform: translateY(-0.75rem);
+              transform: translateY(-0.75rem); } }
+
+.btn-red900 {
+  color: #fff !important;
+  background-color: #b71c1c;
+  border-color: #b71c1c; }
+  .btn-red900:hover {
+    color: #fff !important;
+    background-color: #8b1515;
+    border-color: #821414; }
+  .btn-red900:focus, .btn-red900.focus {
+    box-shadow: 0 0 0 2px rgba(183, 28, 28, 0.5); }
+  .btn-red900.disabled, .btn-red900:disabled {
+    background-color: #b71c1c;
+    border-color: #b71c1c; }
+  .btn-red900:active, .btn-red900.active,
+  .show > .btn-red900.dropdown-toggle {
+    color: #fff !important;
+    background-color: #8b1515;
+    background-image: none;
+    border-color: #821414; }
+
+.btn-white {
+  color: #b71c1c;
+  background-color: #fff;
+  border-color: #fff; }
+  .btn-white:hover {
+    color: #b71c1c;
+    background-color: #e6e5e5;
+    border-color: #e0e0e0; }
+  .btn-white:focus, .btn-white.focus {
+    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.5); }
+  .btn-white.disabled, .btn-white:disabled {
+    background-color: #fff;
+    border-color: #fff; }
+  .btn-white:active, .btn-white.active,
+  .show > .btn-white.dropdown-toggle {
+    color: #b71c1c;
+    background-color: #e6e5e5;
+    background-image: none;
+    border-color: #e0e0e0; }
+
+.btn-bluegrey900 {
+  color: #fff;
+  background-color: #263238;
+  border-color: #263238; }
+  .btn-bluegrey900:hover {
+    color: #fff;
+    background-color: #11171a;
+    border-color: #0d1114; }
+  .btn-bluegrey900:focus, .btn-bluegrey900.focus {
+    box-shadow: 0 0 0 2px rgba(38, 50, 56, 0.5); }
+  .btn-bluegrey900.disabled, .btn-bluegrey900:disabled {
+    background-color: #263238;
+    border-color: #263238; }
+  .btn-bluegrey900:active, .btn-bluegrey900.active,
+  .show > .btn-bluegrey900.dropdown-toggle {
+    color: #fff;
+    background-color: #11171a;
+    background-image: none;
+    border-color: #0d1114; }
 
 button.navbar-toggler div {
   font-family: 'Ubuntu', sans-serif;
   font-size: 1rem;
   display: inline-block;
-  margin-left: 12px; }
+  position: relative;
+  top: -4px; }
 
 .btn {
+  height: 36px;
   text-transform: uppercase;
   box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.25);
   -webkit-transition: box-shadow .25s ease-in-out;
@@ -5012,12 +5158,9 @@ button.navbar-toggler div {
     box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.15), 0 3px 6px 0 rgba(0, 0, 0, 0.25);
     -webkit-transition: box-shadow .25s ease-in-out;
     transition: box-shadow .25s ease-in-out; }
-  .btn svg {
-    margin-right: .75rem;
-    height: 17px;
-    width: auto;
-    -webkit-transform: translateY(2px);
-            transform: translateY(2px); }
+  @media (max-width: 767px) {
+    .btn {
+      font-size: .875rem; } }
 
 .btn-outline-primary,
 .btn-outline-secondary {
@@ -5029,28 +5172,41 @@ button.navbar-toggler div {
     transition: background-color .25s ease-in-out; }
 
 .btn-lg, .btn-group-lg > .btn {
+  height: 48px;
   margin: 0 24px; }
-  @media (max-width: 991px) {
+  @media (max-width: 767px) {
     .btn-lg, .btn-group-lg > .btn {
+      height: 36px;
       margin: 0 8px;
-      font-size: 14px; } }
+      padding: 1rem;
+      font-size: .875rem;
+      line-height: 0; } }
 
-.btn-sm small, .btn-group-sm > .btn small {
-  display: inline-block;
-  -webkit-transform: translateY(-2px);
-          transform: translateY(-2px); }
+.btn-md {
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+  padding: .4rem 1rem .5rem 1rem; }
 
 .btn-block {
   margin: 0 0 1.5rem 0; }
   @media (min-width: 768px) {
     .btn-block {
       margin: 0 0 2rem 0; } }
+  @media (max-width: 767px) {
+    .btn-block {
+      font-size: .875rem;
+      line-height: 0; } }
 
 .fixed-top {
   -webkit-transition: background-color 700ms linear;
   transition: background-color 700ms linear; }
   .fixed-top .navbar {
     width: 100%; }
+    @media (max-width: 991px) {
+      .fixed-top .navbar {
+        padding: .5rem 0; } }
+    .fixed-top .navbar .navbar-toggler-left {
+      left: -1rem; }
   .fixed-top .navbar-brand {
     opacity: 0;
     -webkit-transition: opacity 700ms linear;
@@ -5082,25 +5238,13 @@ button.navbar-toggler div {
   @media (min-width: 576px) {
     .navbar-brand {
       font-size: 2rem; } }
+  .navbar-brand strong {
+    font-weight: 900; }
   .navbar-brand img {
     margin-right: 1rem;
     -webkit-transform: translateY(-5px);
             transform: translateY(-5px); }
 
-.display-2 {
-  margin-bottom: 4rem; }
-  @media (max-width: 991px) {
-    .display-2 {
-      font-size: 32px; } }
-
-@media (max-width: 991px) {
-  .display-4 {
-    font-size: 14px; } }
-
-.bg-progress {
-  background-image: -webkit-linear-gradient(left, #fbc02d, #ff8f00);
-  background-image: linear-gradient(to right, #fbc02d, #ff8f00); }
-
 section.intro {
   min-height: 100vh;
   background-image: url("../img/header-background.jpg");
@@ -5119,7 +5263,7 @@ section.intro {
     section.intro .branding h1 {
       font-weight: 300 !important;
       color: #263238; }
-      @media (max-width: 991px) {
+      @media (max-width: 767px) {
         section.intro .branding h1 {
           font-size: 4.5rem; } }
       section.intro .branding h1 strong {
@@ -5155,185 +5299,93 @@ section.intro {
         section.intro .page-scroll .btn {
           width: 64px;
           height: 64px; } }
-      section.intro .page-scroll .btn:hover {
+      section.intro .page-scroll .btn:hover .i_arrow_down {
         fill: white; }
-      section.intro .page-scroll .btn svg {
-        width: 12px;
-        height: auto;
-        position: absolute;
-        top: 50%;
-        -webkit-transform: translate(-50%, -60%);
-                transform: translate(-50%, -60%);
-        -webkit-animation: scroll 3s infinite;
-                animation: scroll 3s infinite; }
-        @media (min-width: 768px) {
-          section.intro .page-scroll .btn svg {
-            width: 24px; } }
 
 section.content-section {
   padding: 3rem 0; }
   @media (min-width: 768px) {
     section.content-section {
-      padding: 96px 0; } }
+      padding: 72px 0; } }
 
-section#features,
-section#appliances,
-section#fireinfo {
-  background-color: #eceff1; }
+.feature_icons {
+  width: 40px;
+  height: 100%;
+  float: left;
+  margin-right: .75rem; }
 
 section#news,
 footer {
-  background-color: rgba(38, 50, 56, 0.2); }
+  background-color: rgba(38, 50, 56, 0.06); }
+
+section#news {
+  color: rgba(38, 50, 56, 0.6); }
+  section#news h2 {
+    color: #263238; }
 
 section#wishlist {
   background-image: url("../img/wishlist-background.jpg");
   background-size: cover;
   background-position: center center; }
 
+.bg-progress {
+  background-image: -webkit-linear-gradient(left, #fbc02d, #ff8f00);
+  background-image: linear-gradient(to right, #fbc02d, #ff8f00); }
+
 section#fireinfo {
   border-bottom: 1px solid rgba(38, 50, 56, 0.2); }
 
-#copyright {
-  background-color: rgba(38, 50, 56, 0.3);
-  padding: 1rem 0; }
+.circle {
+  position: relative; }
+  .circle p.lead {
+    color: #546e7a;
+    position: absolute;
+    top: calc(50% - 1.25rem);
+    width: 100%; }
 
 footer {
   padding: 3rem 0 0 0; }
   footer h4 {
-    margin-bottom: 1.25rem; }
+    margin-bottom: 1.25rem;
+    color: rgba(38, 50, 56, 0.6); }
   footer ul li {
     font-size: 0.875rem;
     margin-bottom: .75rem; }
     footer ul li a {
-      color: #263238;
+      color: rgba(38, 50, 56, 0.6);
       text-decoration: none; }
       footer ul li a:hover {
-        color: #546e7a;
+        color: #263238;
         text-decoration: underline; }
   footer .btn-lg, footer .btn-group-lg > .btn {
     margin-bottom: 2.75rem; }
-    footer .btn-lg svg, footer .btn-group-lg > .btn svg {
-      width: 20px;
-      height: auto;
-      margin-right: 1.125rem;
-      -webkit-transform: translateY(2px);
-              transform: translateY(2px); }
   footer .btn-sm, footer .btn-group-sm > .btn {
     box-shadow: none; }
     footer .btn-sm:hover, footer .btn-group-sm > .btn:hover {
       box-shadow: none; }
-    footer .btn-sm svg, footer .btn-group-sm > .btn svg {
-      width: auto;
-      height: 28px; }
 
-.feature_icons {
-  width: 40px;
-  height: 100%;
-  float: left;
-  margin-right: .5rem; }
-  .feature_icons svg {
-    width: 32px;
-    height: auto;
-    -webkit-transform: translateY(-4px);
-            transform: translateY(-4px);
-    fill: #b71c1c; }
+#copyright {
+  background-color: rgba(38, 50, 56, 0.06);
+  padding: 1rem 0; }
 
 @-webkit-keyframes scroll {
   0% {
-    -webkit-transform: translate(-50%, -60%);
-            transform: translate(-50%, -60%); }
+    -webkit-transform: translateY(30%);
+            transform: translateY(30%); }
   50% {
-    -webkit-transform: translate(-50%, -30%);
-            transform: translate(-50%, -30%); }
+    -webkit-transform: translateY(50%);
+            transform: translateY(50%); }
   100% {
-    -webkit-transform: translate(-50%, -60%);
-            transform: translate(-50%, -60%); } }
+    -webkit-transform: translateY(30%);
+            transform: translateY(30%); } }
 
 @keyframes scroll {
   0% {
-    -webkit-transform: translate(-50%, -60%);
-            transform: translate(-50%, -60%); }
+    -webkit-transform: translateY(30%);
+            transform: translateY(30%); }
   50% {
-    -webkit-transform: translate(-50%, -30%);
-            transform: translate(-50%, -30%); }
+    -webkit-transform: translateY(50%);
+            transform: translateY(50%); }
   100% {
-    -webkit-transform: translate(-50%, -60%);
-            transform: translate(-50%, -60%); } }
-
-.btn-red900 {
-  color: #fff !important;
-  background-color: #b71c1c;
-  border-color: #b71c1c; }
-  .btn-red900:hover {
-    color: #fff !important;
-    background-color: #8b1515;
-    border-color: #821414; }
-  .btn-red900:focus, .btn-red900.focus {
-    box-shadow: 0 0 0 2px rgba(183, 28, 28, 0.5); }
-  .btn-red900.disabled, .btn-red900:disabled {
-    background-color: #b71c1c;
-    border-color: #b71c1c; }
-  .btn-red900:active, .btn-red900.active,
-  .show > .btn-red900.dropdown-toggle {
-    color: #fff !important;
-    background-color: #8b1515;
-    background-image: none;
-    border-color: #821414; }
-
-.btn-white {
-  color: #b71c1c;
-  background-color: #fff;
-  border-color: #fff; }
-  .btn-white:hover {
-    color: #b71c1c;
-    background-color: #e6e5e5;
-    border-color: #e0e0e0; }
-  .btn-white:focus, .btn-white.focus {
-    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.5); }
-  .btn-white.disabled, .btn-white:disabled {
-    background-color: #fff;
-    border-color: #fff; }
-  .btn-white:active, .btn-white.active,
-  .show > .btn-white.dropdown-toggle {
-    color: #b71c1c;
-    background-color: #e6e5e5;
-    background-image: none;
-    border-color: #e0e0e0; }
-
-.btn-bluegrey900 {
-  color: #fff;
-  background-color: #263238;
-  border-color: #263238; }
-  .btn-bluegrey900:hover {
-    color: #fff;
-    background-color: #11171a;
-    border-color: #0d1114; }
-  .btn-bluegrey900:focus, .btn-bluegrey900.focus {
-    box-shadow: 0 0 0 2px rgba(38, 50, 56, 0.5); }
-  .btn-bluegrey900.disabled, .btn-bluegrey900:disabled {
-    background-color: #263238;
-    border-color: #263238; }
-  .btn-bluegrey900:active, .btn-bluegrey900.active,
-  .show > .btn-bluegrey900.dropdown-toggle {
-    color: #fff;
-    background-color: #11171a;
-    background-image: none;
-    border-color: #0d1114; }
-
-@media (max-width: 991px) {
-  p.lead {
-    font-size: 1rem; } }
-
-.circle {
-  position: relative; }
-  .circle p.lead {
-    color: #546e7a;
-    position: absolute;
-    top: calc(50% - 1.25rem);
-    width: 100%; }
-
-.truncate {
-  width: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis; }
+    -webkit-transform: translateY(30%);
+            transform: translateY(30%); } }