You are here

preview.css in Open Social 8.9

@font-face {
  font-family: 'montserrat';
  src: url("../font/montserrat/montserrat-light.eot") format('embedded-opentype'),
       url("../font/montserrat/montserrat-light.woff2") format('woff2'),
       url("../font/montserrat/montserrat-light.woff") format('woff'),
       url("../font/montserrat/montserrat-light.ttf") format('truetype'),
       url("../font/montserrat/montserrat-light.svg") format('svg');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'montserrat';
  src: url("../font/montserrat/montserrat-normal.eot") format('embedded-opentype'),
       url("../font/montserrat/montserrat-normal.woff2") format('woff2'),
       url("../font/montserrat/montserrat-normal.woff") format('woff'),
       url("../font/montserrat/montserrat-normal.ttf") format('truetype'),
       url("../font/montserrat/montserrat-normal.svg") format('svg');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'montserrat';
  src: url("../font/montserrat/montserrat-bold.eot") format('embedded-opentype'),
       url("../font/montserrat/montserrat-bold.woff2") format('woff2'),
       url("../font/montserrat/montserrat-bold.woff") format('woff'),
       url("../font/montserrat/montserrat-bold.ttf") format('truetype'),
       url("../font/montserrat/montserrat-bold.svg") format('svg');
  font-weight: 700;
  font-style: normal;
}

code,
kbd,
pre,
samp {
  font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}

code {
  color: #c7254e;
  background-color: #f9f2f4;
  border-radius: 2px;
}

kbd {
  color: #fff;
  background-color: #333;
  border-radius: 3px;
  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}

pre {
  color: #333333;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 10px;
}

blockquote {
  border-left: 3px solid #29abe2;
}

strong {
  font-weight: 500;
}

.text-primary {
  color: #29abe2;
}

a.text-primary:hover,
a.text-primary:focus {
  color: #1a8dbe;
}

.text-success {
  color: #3c763d;
}

a.text-success:hover,
a.text-success:focus {
  color: #2b542c;
}

.text-info {
  color: #31708f;
}

a.text-info:hover,
a.text-info:focus {
  color: #245269;
}

.text-warning {
  color: #8a6d3b;
}

a.text-warning:hover,
a.text-warning:focus {
  color: #66512c;
}

.text-danger {
  color: #a94442;
}

a.text-danger:hover,
a.text-danger:focus {
  color: #843534;
}

.text-muted {
  color: #555555;
}

a.text-muted:hover,
a.text-muted:focus {
  color: #3c3c3c;
}

.text-gray {
  color: #555555;
}

a.text-gray:hover,
a.text-gray:focus {
  color: #3c3c3c;
}

.text-gray-light {
  color: #777;
}

a.text-gray-light:hover,
a.text-gray-light:focus {
  color: #5e5e5e;
}

.text-gray-lighter {
  color: #adadad;
}

a.text-gray-lighter:hover,
a.text-gray-lighter:focus {
  color: #949494;
}

.text-gray-lightest {
  color: #e6e6e6;
}

a.text-gray-lightest:hover,
a.text-gray-lightest:focus {
  color: #cdcdcd;
}

.text-accent {
  color: #ffc142;
}

a.text-accent:hover,
a.text-accent:focus {
  color: #ffb00f;
}

.bg-primary {
  background-color: #29abe2;
}

.bg-secondary {
  background-color: #1f80aa;
}

.bg-accent {
  background-color: #ffc142;
}

.bg-success {
  background-color: #dff0d8;
}

.bg-warning {
  background-color: #fcf8e3;
}

.bg-danger {
  background-color: #f2dede;
}

.bg-info {
  background-color: #d9edf7;
}

.bg-gray-base {
  background-color: #000;
}

.bg-gray-darker {
  background-color: #222222;
}

.bg-gray-dark {
  background-color: #333333;
}

.bg-gray {
  background-color: #555555;
}

.bg-gray-light {
  background-color: #777;
}

.bg-gray-light-1 {
  background-color: #adadad;
}

.bg-gray-lighter {
  background-color: #e6e6e6;
}

.bg-gray-lighter-1 {
  background-color: #f7f7f7;
}

.bg-gray-lightest {
  background-color: #f3f3f3;
}

.bg-white {
  background-color: white;
}

.brand-primary {
  background-color: #29abe2;
  border-color: #29abe2;
  color: white;
}

a.brand-primary:hover,
a.brand-primary:focus {
  background-color: #1a8dbe;
  border-color: #1a8dbe;
  color: white;
}

.brand-secondary {
  background-color: #1f80aa;
  border-color: #1f80aa;
  color: white;
}

a.brand-secondary:hover,
a.brand-secondary:focus {
  background-color: #17607f;
  border-color: #17607f;
  color: white;
}

.brand-accent {
  background-color: #ffc142;
  border-color: #ffc142;
  color: #4d4d4d;
}

a.brand-accent:hover,
a.brand-accent:focus {
  background-color: #ffb00f;
  border-color: #ffb00f;
  color: #4d4d4d;
}

.brand-user {
  background-color: #222222;
  border-color: #222222;
  color: white;
}

a.brand-user:hover,
a.brand-user:focus {
  background-color: #090909;
  border-color: #090909;
  color: white;
}

.default-light {
  background-color: #e6e6e6;
  border-color: #e6e6e6;
  color: #4d4d4d;
}

a.default-light:hover,
a.default-light:focus {
  background-color: #cdcdcd;
  border-color: #cdcdcd;
  color: #4d4d4d;
}

body {
  font-family: "montserrat", sans-serif;
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: #4d4d4d;
  background-color: #f3f3f3;
}

.table-primary,
.table-primary > th,
.table-primary > td {
  background-color: #c3e7f7;
}

.table-hover .table-primary:hover {
  background-color: #addef4;
}

.table-hover .table-primary:hover > td,
.table-hover .table-primary:hover > th {
  background-color: #addef4;
}

.table-secondary,
.table-secondary > th,
.table-secondary > td {
  background-color: #c0dbe7;
}

.table-hover .table-secondary:hover {
  background-color: #aed0e0;
}

.table-hover .table-secondary:hover > td,
.table-hover .table-secondary:hover > th {
  background-color: #aed0e0;
}

.table-accent,
.table-accent > th,
.table-accent > td {
  background-color: #ffeeca;
}

.table-hover .table-accent:hover {
  background-color: #ffe6b1;
}

.table-hover .table-accent:hover > td,
.table-hover .table-accent:hover > th {
  background-color: #ffe6b1;
}

.table-success,
.table-success > th,
.table-success > td {
  background-color: #d1ebd1;
}

.table-hover .table-success:hover {
  background-color: #bfe3bf;
}

.table-hover .table-success:hover > td,
.table-hover .table-success:hover > th {
  background-color: #bfe3bf;
}

.table-info,
.table-info > th,
.table-info > td {
  background-color: #c6eaf8;
}

.table-hover .table-info:hover {
  background-color: #afe2f5;
}

.table-hover .table-info:hover > td,
.table-hover .table-info:hover > th {
  background-color: #afe2f5;
}

.table-warning,
.table-warning > th,
.table-warning > td {
  background-color: #ffdeb8;
}

.table-hover .table-warning:hover {
  background-color: #ffd29f;
}

.table-hover .table-warning:hover > td,
.table-hover .table-warning:hover > th {
  background-color: #ffd29f;
}

.table-danger,
.table-danger > th,
.table-danger > td {
  background-color: #f4cfce;
}

.table-hover .table-danger:hover {
  background-color: #efbbb9;
}

.table-hover .table-danger:hover > td,
.table-hover .table-danger:hover > th {
  background-color: #efbbb9;
}

.table-light,
.table-light > th,
.table-light > td {
  background-color: #f8f8f8;
}

.table-hover .table-light:hover {
  background-color: #ebebeb;
}

.table-hover .table-light:hover > td,
.table-hover .table-light:hover > th {
  background-color: #ebebeb;
}

.table-dark,
.table-dark > th,
.table-dark > td {
  background-color: #c6c6c6;
}

.table-hover .table-dark:hover {
  background-color: #b9b9b9;
}

.table-hover .table-dark:hover > td,
.table-hover .table-dark:hover > th {
  background-color: #b9b9b9;
}

.table-active,
.table-active > th,
.table-active > td {
  background-color: rgba(0, 0, 0, 0.075);
}

.table-hover .table-active:hover {
  background-color: rgba(0, 0, 0, 0.075);
}

.table-hover .table-active:hover > td,
.table-hover .table-active:hover > th {
  background-color: rgba(0, 0, 0, 0.075);
}

.table .table {
  background-color: #f3f3f3;
}

.table th a {
  color: #1d789e;
}

.table th.is-active > a {
  color: #29abe2;
}

.table .icon-tablesort {
  fill: #29abe2;
}

.img-avatar,
.avatar img,
.avatar-icon {
  border-radius: 50%;
}

.badge {
  border-radius: 0.25em;
  color: #fff;
}

.badge__icon {
  fill: #4d4d4d;
}

.badge--pill {
  border-radius: 1em;
}

.badge-default {
  background-color: #e6e6e6;
  color: #4d4d4d;
  transition: 0.3s;
}

.badge-default[href]:hover, .badge-default[href]:focus {
  background-color: #cdcdcd;
}

.badge-primary {
  background-color: #29abe2;
  color: #fff;
  transition: 0.3s;
}

.badge-primary[href]:hover, .badge-primary[href]:focus {
  background-color: #1a8dbe;
}

.badge-secondary {
  background-color: #1f80aa;
  color: #fff;
  transition: 0.3s;
}

.badge-secondary[href]:hover, .badge-secondary[href]:focus {
  background-color: #17607f;
}

.badge-accent {
  background-color: #ffc142;
  color: #4d4d4d;
  transition: 0.3s;
}

.badge-accent[href]:hover, .badge-accent[href]:focus {
  background-color: #ffb00f;
}

.badge-success {
  background-color: #5cb85c;
  color: #fff;
  transition: 0.3s;
}

.badge-success[href]:hover, .badge-success[href]:focus {
  background-color: #449d44;
}

.badge-info {
  background-color: #33b5e5;
  color: #fff;
  transition: 0.3s;
}

.badge-info[href]:hover, .badge-info[href]:focus {
  background-color: #1a9bcb;
}

.badge-warning {
  background-color: #f80;
  color: #fff;
  transition: 0.3s;
}

.badge-warning[href]:hover, .badge-warning[href]:focus {
  background-color: #cc6d00;
}

.badge-danger {
  background-color: #d9534f;
  color: #fff;
  transition: 0.3s;
}

.badge-danger[href]:hover, .badge-danger[href]:focus {
  background-color: #c9302c;
}

a .badge-default {
  color: #4d4d4d;
}

a .badge-default:hover {
  color: #4d4d4d;
}

.btn {
  border-radius: 10px;
}

.btn.btn-floating {
  border-radius: 50%;
}

.btn-default {
  color: #4d4d4d;
  background-color: #ffffff;
  border-color: #adadad;
  fill: #4d4d4d;
}

.btn-default:focus, .btn-default.focus, .btn-default:hover, .btn-default:active, .btn-default.active,
.open > .btn-default.dropdown-toggle {
  background-color: #e6e6e6;
  border-color: #8e8e8e;
  color: #4d4d4d;
}

.btn-default.disabled:hover, .btn-default.disabled:focus, .btn-default.disabled.focus, .btn-default[disabled]:hover, .btn-default[disabled]:focus, .btn-default[disabled].focus,
fieldset[disabled] .btn-default:hover,
fieldset[disabled] .btn-default:focus,
fieldset[disabled] .btn-default.focus {
  background-color: #ffffff;
  border-color: #adadad;
}

.btn-primary {
  color: #ffffff;
  background-color: #29abe2;
  border-color: #29abe2;
  fill: #ffffff;
}

.btn-primary:focus, .btn-primary.focus, .btn-primary:hover, .btn-primary:active, .btn-primary.active,
.open > .btn-primary.dropdown-toggle {
  background-color: #1a8dbe;
  border-color: #1987b5;
  color: #ffffff;
}

.btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus,
fieldset[disabled] .btn-primary:hover,
fieldset[disabled] .btn-primary:focus,
fieldset[disabled] .btn-primary.focus {
  background-color: #29abe2;
  border-color: #29abe2;
}

.btn-secondary {
  color: #ffffff;
  background-color: #1f80aa;
  border-color: #1f80aa;
  fill: #ffffff;
}

.btn-secondary:focus, .btn-secondary.focus, .btn-secondary:hover, .btn-secondary:active, .btn-secondary.active,
.open > .btn-secondary.dropdown-toggle {
  background-color: #17607f;
  border-color: #165976;
  color: #ffffff;
}

.btn-secondary.disabled:hover, .btn-secondary.disabled:focus, .btn-secondary.disabled.focus, .btn-secondary[disabled]:hover, .btn-secondary[disabled]:focus, .btn-secondary[disabled].focus,
fieldset[disabled] .btn-secondary:hover,
fieldset[disabled] .btn-secondary:focus,
fieldset[disabled] .btn-secondary.focus {
  background-color: #1f80aa;
  border-color: #1f80aa;
}

.btn-accent {
  color: #333333;
  background-color: #ffc142;
  border-color: #ffc142;
  fill: #333333;
  fill: #333333;
}

.btn-accent:focus, .btn-accent.focus, .btn-accent:hover, .btn-accent:active, .btn-accent.active,
.open > .btn-accent.dropdown-toggle {
  background-color: #ffb00f;
  border-color: #ffad05;
  color: #333333;
}

.btn-accent.disabled:hover, .btn-accent.disabled:focus, .btn-accent.disabled.focus, .btn-accent[disabled]:hover, .btn-accent[disabled]:focus, .btn-accent[disabled].focus,
fieldset[disabled] .btn-accent:hover,
fieldset[disabled] .btn-accent:focus,
fieldset[disabled] .btn-accent.focus {
  background-color: #ffc142;
  border-color: #ffc142;
}

.btn-flat {
  color: #29abe2;
  background-color: transparent;
  border-color: transparent;
  fill: #29abe2;
  fill: #29abe2;
  white-space: normal;
}

.btn-flat:focus, .btn-flat.focus, .btn-flat:hover, .btn-flat:active, .btn-flat.active,
.open > .btn-flat.dropdown-toggle {
  background-color: rgba(0, 0, 0, 0);
  border-color: rgba(0, 0, 0, 0);
  color: #29abe2;
}

.btn-flat.disabled:hover, .btn-flat.disabled:focus, .btn-flat.disabled.focus, .btn-flat[disabled]:hover, .btn-flat[disabled]:focus, .btn-flat[disabled].focus,
fieldset[disabled] .btn-flat:hover,
fieldset[disabled] .btn-flat:focus,
fieldset[disabled] .btn-flat.focus {
  background-color: transparent;
  border-color: transparent;
}

.btn-flat:hover, .btn-flat:focus,
.open .dropdown-toggle .btn-flat {
  color: inherit;
  background-color: #ffffff;
  border-color: #adadad;
  fill: inherit;
  color: #1a8dbe;
  fill: #1a8dbe;
}

.btn-flat:hover:focus, .btn-flat:hover.focus, .btn-flat:hover:hover, .btn-flat:hover:active, .btn-flat:hover.active,
.open > .btn-flat:hover.dropdown-toggle, .btn-flat:focus:focus, .btn-flat:focus.focus, .btn-flat:focus:hover, .btn-flat:focus:active, .btn-flat:focus.active,
.open > .btn-flat:focus.dropdown-toggle,
.open .dropdown-toggle .btn-flat:focus,
.open .dropdown-toggle .btn-flat.focus,
.open .dropdown-toggle .btn-flat:hover,
.open .dropdown-toggle .btn-flat:active,
.open .dropdown-toggle .btn-flat.active,
.open >
.open .dropdown-toggle .btn-flat.dropdown-toggle {
  background-color: #e6e6e6;
  border-color: #8e8e8e;
  color: inherit;
}

.btn-flat:hover.disabled:hover, .btn-flat:hover.disabled:focus, .btn-flat:hover.disabled.focus, .btn-flat:hover[disabled]:hover, .btn-flat:hover[disabled]:focus, .btn-flat:hover[disabled].focus,
fieldset[disabled] .btn-flat:hover:hover,
fieldset[disabled] .btn-flat:hover:focus,
fieldset[disabled] .btn-flat:hover.focus, .btn-flat:focus.disabled:hover, .btn-flat:focus.disabled:focus, .btn-flat:focus.disabled.focus, .btn-flat:focus[disabled]:hover, .btn-flat:focus[disabled]:focus, .btn-flat:focus[disabled].focus,
fieldset[disabled] .btn-flat:focus:hover,
fieldset[disabled] .btn-flat:focus:focus,
fieldset[disabled] .btn-flat:focus.focus,
.open .dropdown-toggle .btn-flat.disabled:hover,
.open .dropdown-toggle .btn-flat.disabled:focus,
.open .dropdown-toggle .btn-flat.disabled.focus,
.open .dropdown-toggle .btn-flat[disabled]:hover,
.open .dropdown-toggle .btn-flat[disabled]:focus,
.open .dropdown-toggle .btn-flat[disabled].focus,
fieldset[disabled]
.open .dropdown-toggle .btn-flat:hover,
fieldset[disabled]
.open .dropdown-toggle .btn-flat:focus,
fieldset[disabled]
.open .dropdown-toggle .btn-flat.focus {
  background-color: #ffffff;
  border-color: #adadad;
}

.btn-flat:hover .icon-inline, .btn-flat:focus .icon-inline,
.open .dropdown-toggle .btn-flat .icon-inline {
  fill: #4d4d4d;
}

.btn-flat:active, .btn-flat.active {
  background-color: rgba(12, 12, 12, 0.25);
  border-color: transparent;
  color: white;
}

.btn-link {
  color: #29abe2;
  background-color: transparent;
  border-color: transparent;
  fill: #29abe2;
}

.btn-link:focus, .btn-link.focus, .btn-link:hover, .btn-link:active, .btn-link.active,
.open > .btn-link.dropdown-toggle {
  background-color: rgba(0, 0, 0, 0);
  border-color: rgba(0, 0, 0, 0);
  color: #29abe2;
}

.btn-link.disabled:hover, .btn-link.disabled:focus, .btn-link.disabled.focus, .btn-link[disabled]:hover, .btn-link[disabled]:focus, .btn-link[disabled].focus,
fieldset[disabled] .btn-link:hover,
fieldset[disabled] .btn-link:focus,
fieldset[disabled] .btn-link.focus {
  background-color: transparent;
  border-color: transparent;
}

.btn-link:hover, .btn-link:focus {
  color: #178ab4;
  fill: #178ab4;
  text-decoration: none;
}

.btn-link[disabled]:hover, .btn-link[disabled]:focus {
  color: #777;
}

.btn--with-bgicon {
  color: #fff;
}

.btn--facebook {
  color: #fff;
  background-color: #3b5998;
  border-color: #3b5998;
  fill: #fff;
}

.btn--facebook:focus, .btn--facebook.focus, .btn--facebook:hover, .btn--facebook:active, .btn--facebook.active,
.open > .btn--facebook.dropdown-toggle {
  background-color: #2d4373;
  border-color: #2a3f6c;
  color: #fff;
}

.btn--facebook.disabled:hover, .btn--facebook.disabled:focus, .btn--facebook.disabled.focus, .btn--facebook[disabled]:hover, .btn--facebook[disabled]:focus, .btn--facebook[disabled].focus,
fieldset[disabled] .btn--facebook:hover,
fieldset[disabled] .btn--facebook:focus,
fieldset[disabled] .btn--facebook.focus {
  background-color: #3b5998;
  border-color: #3b5998;
}

.btn--linkedin {
  color: #fff;
  background-color: #0077b5;
  border-color: #0077b5;
  fill: #fff;
}

.btn--linkedin:focus, .btn--linkedin.focus, .btn--linkedin:hover, .btn--linkedin:active, .btn--linkedin.active,
.open > .btn--linkedin.dropdown-toggle {
  background-color: #005582;
  border-color: #004f78;
  color: #fff;
}

.btn--linkedin.disabled:hover, .btn--linkedin.disabled:focus, .btn--linkedin.disabled.focus, .btn--linkedin[disabled]:hover, .btn--linkedin[disabled]:focus, .btn--linkedin[disabled].focus,
fieldset[disabled] .btn--linkedin:hover,
fieldset[disabled] .btn--linkedin:focus,
fieldset[disabled] .btn--linkedin.focus {
  background-color: #0077b5;
  border-color: #0077b5;
}

.btn--google {
  color: #fff;
  background-color: #d34836;
  border-color: #d34836;
  fill: #fff;
}

.btn--google:focus, .btn--google.focus, .btn--google:hover, .btn--google:active, .btn--google.active,
.open > .btn--google.dropdown-toggle {
  background-color: #b03626;
  border-color: #a73425;
  color: #fff;
}

.btn--google.disabled:hover, .btn--google.disabled:focus, .btn--google.disabled.focus, .btn--google[disabled]:hover, .btn--google[disabled]:focus, .btn--google[disabled].focus,
fieldset[disabled] .btn--google:hover,
fieldset[disabled] .btn--google:focus,
fieldset[disabled] .btn--google.focus {
  background-color: #d34836;
  border-color: #d34836;
}

.btn--twitter {
  color: #fff;
  background-color: #1da1f2;
  border-color: #1da1f2;
  fill: #fff;
}

.btn--twitter:focus, .btn--twitter.focus, .btn--twitter:hover, .btn--twitter:active, .btn--twitter.active,
.open > .btn--twitter.dropdown-toggle {
  background-color: #0c85d0;
  border-color: #0b7fc6;
  color: #fff;
}

.btn--twitter.disabled:hover, .btn--twitter.disabled:focus, .btn--twitter.disabled.focus, .btn--twitter[disabled]:hover, .btn--twitter[disabled]:focus, .btn--twitter[disabled].focus,
fieldset[disabled] .btn--twitter:hover,
fieldset[disabled] .btn--twitter:focus,
fieldset[disabled] .btn--twitter.focus {
  background-color: #1da1f2;
  border-color: #1da1f2;
}

.btn-sm {
  border-radius: 8px;
}

.btn-xs {
  border-radius: 5px;
}

.shariff-button {
  border-radius: 10px;
}

.card {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  background-color: #ffffff;
}

.card__title {
  color: #555555;
  font-weight: 500;
}

.region--complementary .card__title,
.region--complementary .card__actionbar,
.paragraph--block .secondary-col .card__title,
.paragraph--block .secondary-col .card__actionbar {
  text-align: center;
}

.card__block:first-child {
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.card__block:last-child {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.card__nested-section:last-child {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.card__link {
  color: #29abe2;
}

.card__link:hover {
  color: #1a8dbe;
}

.card.block-data-policy .card__title,
.card.block-data-policy .card__block {
  width: 100%;
}

.form-control {
  color: #555555;
  background-color: #fff;
  border: 1px solid #adadad;
  border-radius: 5px;
}

.form-control:focus {
  border-color: #29abe2;
  outline: 0;
  box-shadow: 0 2px 0 0 #29abe2;
}

.form-control::-moz-placeholder {
  color: #999;
}

.form-control:-ms-input-placeholder {
  color: #999;
}

.form-control::-webkit-input-placeholder {
  color: #999;
}

.form-control[disabled], .form-control[readonly],
fieldset[disabled] .form-control {
  background-color: #fff;
  opacity: 1;
}

[type="radio"]:checked:not(:disabled) + label {
  color: #1d789e;
}

[type="radio"]:checked + label:before {
  border: 2px solid #1d789e;
}

[type="radio"]:checked + label:after {
  border: 2px solid #1d789e;
  background-color: #1d789e;
}

[type="radio"]:focus + label:before {
  box-shadow: 0 0 3px 2px #56bde8;
}

[type="checkbox"]:checked + label:after {
  border: 2px solid #1d789e;
  background-color: #1d789e;
}

[type="checkbox"].tabbed:checked:focus + label:after {
  background-color: #1d789e;
  border-color: #1d789e;
}

.js--animate-enabled-form-control:checked + label {
  -webkit-animation: scale-form-control 0.5s ease-in 0.5s;
          animation: scale-form-control 0.5s ease-in 0.5s;
}

@-webkit-keyframes scale-form-control {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes scale-form-control {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}

.switch input[type=checkbox]:checked + .lever {
  background-color: #72afc8;
}

.switch input[type=checkbox]:checked + .lever:after {
  background-color: #1d789e;
}

input[type=checkbox]:checked:not(:disabled) ~ .lever:active:after {
  box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(29, 120, 158, 0.1);
}

.input-group .select-wrapper:first-child .form-control:first-child {
  border-bottom-left-radius: 5px;
  border-top-left-radius: 5px;
}

.input-group .select-wrapper:last-child .form-control:first-child {
  border-bottom-right-radius: 5px;
  border-top-right-radius: 5px;
}

.has-error .select-wrapper:after {
  color: #a94442;
}

.has-success .select-wrapper:after {
  color: #3c763d;
}

.has-warning .select-wrapper:after {
  color: #8a6d3b;
}

span.form-required {
  color: #d9534f;
}

html.js .input-group-addon .glyphicon.glyphicon-spin {
  color: #29abe2;
}

.form-actions .btn-group--primary .dropdown-toggle {
  border-color: #29abe2;
}

.has-error .form-control {
  border-color: #a94442;
}

.has-error .form-control:focus {
  box-shadow: 0 2px 0 0 #a94442;
  border-color: #a94442;
}

.form-item--error-message.alert-danger {
  border-radius: 5px;
}

.form-item--error-message.alert-danger:before {
  color: #f2dede;
}

.control-label {
  font-weight: 300;
}

.form-wrapper__label {
  font-weight: 500;
}

.form-wrapper {
  border-radius: 9px;
}

.card__block .form-item-data-policy label a {
  color: #33b5e5;
}

.nav > li > a:hover,
.nav > li > a:focus {
  background-color: transparent;
}

.nav > li.disabled > a {
  color: #777;
}

.nav > li.disabled > a:hover, .nav > li.disabled > a:focus {
  color: #777;
}

.navbar-default {
  background-color: #333333;
}

.navbar-default .navbar-nav > li > a {
  color: #ffffff;
  fill: #ffffff;
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
  color: #e6e6e6;
  fill: #e6e6e6;
  background-color: #1a8dbe;
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > li > a.is-active,
.navbar-default .navbar-nav > li > a.is-active:hover,
.navbar-default .navbar-nav > li > a.is-active:focus {
  color: #f3f3f3;
  fill: #f3f3f3;
  background-color: #1f1f1f;
}

.navbar-default .navbar-nav > .disabled > a, .navbar-default .navbar-nav > .disabled > a:hover, .navbar-default .navbar-nav > .disabled > a:focus {
  color: #ccc;
  fill: #ccc;
  background-color: transparent;
}

.navbar-default .dropdown-menu {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.navbar-default .dropdown-menu > li > a:hover, .navbar-default .dropdown-menu > li > a:focus {
  background-color: #f5f5f5;
}

.navbar-default .dropdown-menu > li > a.is-active {
  background-color: #e6e6e6;
  color: #4d4d4d;
  font-weight: 500;
}

.navbar-default .dropdown-menu > li > a.is-active:hover, .navbar-default .dropdown-menu > li > a.is-active:focus {
  cursor: default;
}

.navbar-default .navbar-toggle {
  border-radius: 0;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
  background-color: #222222;
}

.navbar-default .navbar-collapse {
  border-color: #ffffff;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
  background-color: #1f1f1f;
  color: #f3f3f3;
}

.navbar-default .dropdown img {
  border-radius: 50%;
}

.navbar-default .profile img {
  border: 2px solid white;
  width: 24px;
  height: 24px;
  overflow: hidden;
}

.navbar-search .form-group {
  border-radius: 5px;
}

.navbar-search .form-submit {
  border-radius: 0 5px 5px 0;
}

.navbar__open-search-block {
  background: rgba(51, 51, 51, 0.95);
}

.navbar-nav__icon {
  fill: #ffffff;
}

.navbar-secondary {
  background-color: #1f80aa;
}

.navbar-secondary .navbar-nav a {
  color: #fff;
}

.navbar-secondary .navbar-nav li.active a {
  border-bottom-color: #fff;
}

.navbar-secondary .navbar-nav li:not(.active) a:hover,
.navbar-secondary .navbar-nav li:not(.active) a:focus {
  outline: none;
  background-color: rgba(0, 0, 0, 0.3);
  border-bottom-color: rgba(0, 0, 0, 0.3);
}

.navbar-scrollable:after {
  background: linear-gradient(to right, rgba(31, 128, 170, 0), #1f80aa);
}

.nav-tabs {
  border-bottom: 1px solid transparent;
}

.nav-tabs > li > a:hover {
  border-color: transparent transparent transparent;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
  color: #29abe2;
  background-color: transparent;
  border: 1px solid transparent;
}

.nav-tabs > li > a:hover, .nav-tabs > li > a:focus {
  background-color: #e6e6e6;
  border-bottom-color: #e6e6e6;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
  font-weight: 500;
  color: #29abe2;
  background-color: transparent;
}

.tabs-left > .nav-tabs .active > a, .tabs-left > .nav-tabs .active > a:hover, .tabs-left > .nav-tabs .active > a:focus {
  border-right: 2px solid #29abe2;
}

.tabs-right > .nav-tabs .active > a, .tabs-right > .nav-tabs .active > a:hover, .tabs-right > .nav-tabs .active > a:focus {
  border-left: 2px solid #29abe2;
}

.tabs-left > .nav-tabs {
  border-radius: 10px 0 0 10px;
}

.tabs-right > .nav-tabs {
  border-radius: 0 10px 10px 0;
}

.teaser__teaser-type {
  background-color: #adadad;
  border-radius: 0 0 8px 8px;
}

.teaser__teaser-type-icon {
  fill: white;
}

.teaser .teaser__badge:first-child {
  padding-left: 0;
}

.teaser .teaser__badge:first-child.badge-default, .teaser .teaser__badge:first-child.badge-primary, .teaser .teaser__badge:first-child.badge-secondary, .teaser .teaser__badge:first-child.badge-accent, .teaser .teaser__badge:first-child.badge-success, .teaser .teaser__badge:first-child.badge-info, .teaser .teaser__badge:first-child.badge-warning, .teaser .teaser__badge:first-child.badge-danger, .teaser .teaser__badge:first-child.badge-active {
  padding-left: 1em;
}

.comments {
  background: #f3f3f3;
  border-radius: 10px;
}

.comment__reply-btn {
  color: #33b5e5;
  fill: #33b5e5;
}

.comment__reply-btn:hover, .comment__reply-btn:focus {
  color: #1a8dbe;
  fill: #1a8dbe;
}

.photoswipe-gallery-custom .field--item .file-tile,
.photoswipe-gallery-custom .field--item img:not(.node-file__icon) {
  border-radius: 10px;
}

.photoswipe-gallery-custom .field--item .file-link a {
  font-weight: 500;
}

.cover {
  color: white;
  background-color: #29abe2;
}

.cover .page-title {
  color: white;
}

.cover .hero-avatar {
  border-radius: 50%;
  border: 2px solid white;
}

.cover .hero-canvas {
  border-radius: 10px;
  background-color: rgba(51, 51, 51, 0.8);
  color: white;
}

.cover .hero-form[role='search'] .form-control {
  border-radius: 5px;
}

.cover .hero-form[role='search'] .form-control:focus, .cover .hero-form[role='search'] .form-control:active,
.cover .hero-form[role='search'] .form-control:focus ~ .search-icon,
.cover .hero-form[role='search'] .form-control:active ~ .search-icon {
  box-shadow: 0 2px 0 0 #1f80aa;
}

.cover .hero-form[role='search'] .form-submit,
.cover .hero-form[role='search'] .search-icon {
  border-radius: 0 5px 5px 0;
}

.cover .hero-form[role='search'] .search-icon {
  fill: #29abe2;
  background: white;
}

.stream-icon-new {
  background: #1f80aa;
}

.teaser--stream .teaser__image {
  border-radius: 0;
}

.teaser--stream:last-child {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.teaser--stream:last-child .card-image {
  border-bottom-left-radius: 10px;
}

.site-footer {
  background-color: #1f80aa;
  color: white;
}

.site-footer .dropdown-menu > li > a {
  color: #4d4d4d;
}

.site-footer .dropdown-menu > li > a:hover, .site-footer .dropdown-menu > li > a:focus {
  background-color: #f5f5f5;
}

.field--name-field-introduction-text a:not(.btn),
.field--name-field-featured-items-description a:not(.btn),
.field--name-field-featured-description a:not(.btn),
.field--name-field-accord-description a:not(.btn),
.body-text a:not(.btn) {
  text-decoration: underline;
  color: #33b5e5;
}

.field--name-field-introduction-text a:not(.btn):hover,
.field--name-field-featured-items-description a:not(.btn):hover,
.field--name-field-featured-description a:not(.btn):hover,
.field--name-field-accord-description a:not(.btn):hover,
.body-text a:not(.btn):hover {
  color: #178ab4;
}

[type="radio"]:checked + label:before {
  border-color: #29abe2;
}

[type="radio"]:focus + label:before {
  box-shadow: 0 0 3px 2px #29abe2;
}

[type="checkbox"]:checked + label:after,
[type="radio"]:checked + label:after {
  border-color: #29abe2;
  background-color: #29abe2;
}

[type="checkbox"]:checked:not(:disabled) + label,
[type="radio"]:checked:not(:disabled) + label {
  color: #29abe2;
}

.tabs-left .nav-tabs > li.active > a,
.tabs-left .nav-tabs > li.active > a:hover,
.tabs-left .nav-tabs > li.active > a:focus {
  border-right-color: #29abe2;
}

.view-birthday .teaser--tile .teaser__image {
  background-color: #29abe2;
}

.cover,
.read-indicator,
.select2-container--social .select2-results__option--highlighted[aria-selected],
.select2-container--social .select2-results__option[aria-selected=true],
.pagination > .active > a,
.pagination > .active > a:hover,
.pagination > .active > a:focus,
.pagination > .active > span,
.pagination > .active > span:hover,
.pagination > .active > span:focus {
  background-color: #29abe2;
}

.hero-form[role='search'] .form-control:focus, .hero-form[role='search'] .form-control:active,
.hero-form[role='search'] .form-control:focus ~ .search-icon,
.hero-form[role='search'] .form-control:active ~ .search-icon {
  box-shadow: 0 2px 0 0 #1f80aa;
}

.hero-form[role='search'] .search-icon {
  fill: #29abe2;
}

.form-control:focus {
  border-color: #29abe2;
  box-shadow: 0 2px 0 0 #29abe2;
}

.select2-container--social.select2-container--focus .select2-selection, .select2-container--social.select2-container--open .select2-selection, .select2-container--social .select2-dropdown {
  border-color: #29abe2;
}

.site-footer,
.badge-secondary,
.ui-datepicker-calendar > tbody > tr > td .ui-state-active,
.stream-icon-new {
  background-color: #1f80aa;
}

.eu-cookie-compliance-secondary-button,
.btn-primary {
  background-color: #29abe2;
  border-color: #29abe2;
}

.eu-cookie-compliance-secondary-button:focus, .eu-cookie-compliance-secondary-button.focus, .eu-cookie-compliance-secondary-button:hover, .eu-cookie-compliance-secondary-button:active, .eu-cookie-compliance-secondary-button.active,
.open > .eu-cookie-compliance-secondary-button.dropdown-toggle, .eu-cookie-compliance-secondary-button.dropdown-toggle:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.open >
.btn-primary.dropdown-toggle,
.btn-primary.dropdown-toggle:hover {
  background-color: #29abe2;
  border-color: #29abe2;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.eu-cookie-compliance-secondary-button.disabled:hover, .eu-cookie-compliance-secondary-button.disabled:focus, .eu-cookie-compliance-secondary-button.disabled.focus, .eu-cookie-compliance-secondary-button[disabled]:hover, .eu-cookie-compliance-secondary-button[disabled]:focus, .eu-cookie-compliance-secondary-button[disabled].focus,
fieldset[disabled] .eu-cookie-compliance-secondary-button:hover,
fieldset[disabled] .eu-cookie-compliance-secondary-button:focus,
fieldset[disabled] .eu-cookie-compliance-secondary-button.focus,
.btn-primary.disabled:hover,
.btn-primary.disabled:focus,
.btn-primary.disabled.focus,
.btn-primary[disabled]:hover,
.btn-primary[disabled]:focus,
.btn-primary[disabled].focus,
fieldset[disabled]
.btn-primary:hover,
fieldset[disabled]
.btn-primary:focus,
fieldset[disabled]
.btn-primary.focus {
  background-color: #29abe2;
  border-color: #29abe2;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.btn-secondary {
  background-color: #1f80aa;
  border-color: #1f80aa;
}

.btn-secondary:focus, .btn-secondary.focus, .btn-secondary:hover, .btn-secondary:active, .btn-secondary.active,
.open > .btn-secondary.dropdown-toggle, .btn-secondary.dropdown-toggle:hover {
  background-color: #1f80aa;
  border-color: #1f80aa;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.btn-secondary.disabled:hover, .btn-secondary.disabled:focus, .btn-secondary.disabled.focus, .btn-secondary[disabled]:hover, .btn-secondary[disabled]:focus, .btn-secondary[disabled].focus,
fieldset[disabled] .btn-secondary:hover,
fieldset[disabled] .btn-secondary:focus,
fieldset[disabled] .btn-secondary.focus {
  background-color: #1f80aa;
  border-color: #1f80aa;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.badge-accent {
  background-color: #ffc142;
  border-color: #ffc142;
}

.btn-accent {
  background-color: #ffc142;
  border-color: #ffc142;
}

.btn-accent:focus, .btn-accent.focus, .btn-accent:hover, .btn-accent:active, .btn-accent.active,
.open > .btn-accent.dropdown-toggle, .btn-accent.dropdown-toggle:hover {
  background-color: #ffc142;
  border-color: #ffc142;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.btn-accent.disabled:hover, .btn-accent.disabled:focus, .btn-accent.disabled.focus, .btn-accent[disabled]:hover, .btn-accent[disabled]:focus, .btn-accent[disabled].focus,
fieldset[disabled] .btn-accent:hover,
fieldset[disabled] .btn-accent:focus,
fieldset[disabled] .btn-accent.focus {
  background-color: #ffc142;
  border-color: #ffc142;
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.card__link,
.card__link .btn-default,
.card__link.btn-default {
  border-color: #29abe2;
}

.btn-flat,
.btn-link,
.btn-link:hover,
.btn-flat:hover,
.btn-link:focus,
.btn-flat:focus,
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus,
.card__link,
.card__link:focus,
.card__link:hover,
.view--who-liked .views-field-view-user a,
.comment__reply-btn,
.nav-book .menu-item--active-trail > a {
  color: #29abe2;
  fill: #29abe2;
}

.list-item--active,
.list-item--active:hover,
.list-item--active:focus,
.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
  background-color: #1f80aa;
  border-color: #1f80aa;
}

.field--name-field-introduction-text a:not(.btn),
.field--name-field-introduction-text a:not(.btn):hover,
.field--name-field-featured-items-description a:not(.btn),
.field--name-field-featured-items-description a:not(.btn):hover,
.field--name-field-featured-description a:not(.btn),
.field--name-field-featured-description a:not(.btn):hover,
.field--name-field-accord-description a:not(.btn),
.field--name-field-accord-description a:not(.btn):hover,
.body-text a:not(.btn),
.body-text a:not(.btn):hover {
  color: #33b5e5;
}

blockquote {
  border-left-color: #29abe2;
}

.input-group .form-control:focus ~ .input-group-addon {
  border-color: #29abe2;
  box-shadow: 0 2px 0 0 #29abe2;
}

#skip-link a {
  background-color: #1f1f1f;
  color: #f3f3f3;
}

.navbar-secondary {
  color: #f9f9f9;
  background-color: #1f7ea7;
}

.navbar-secondary .navbar-nav a {
  color: #f9f9f9;
}

.navbar-secondary .navbar-nav li.active a {
  border-bottom-color: #f9f9f9;
}

.navbar-scrollable:before {
  background: linear-gradient(90deg, #1f7ea7, transparent);
}

.navbar-scrollable:after {
  background: linear-gradient(-90deg, #1f7ea7, transparent);
}

.navbar-default {
  background-color: #333333;
}

.navbar-default .navbar-toggle {
  color: #ffffff;
}

.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
  color: #f3f3f3;
  background-color: #1f1f1f;
}

.navbar-default .navbar-nav > li > a {
  color: #ffffff;
  fill: #ffffff;
}

.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
  color: #f3f3f3;
  background-color: #1f1f1f;
}

.navbar-default .navbar-nav > li > a:hover .navbar-nav__icon, .navbar-default .navbar-nav > li > a:focus .navbar-nav__icon {
  fill: #f3f3f3;
}

.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
  background-color: #1f1f1f;
  color: #f3f3f3;
}

.navbar-default .navbar-nav > li > a.is-active, .navbar-default .navbar-nav > li > a.is-active:hover, .navbar-default .navbar-nav > li > a.is-active:focus,
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #f3f3f3;
  fill: #f3f3f3;
  background-color: #1f1f1f;
}

html:not(.js) .navbar-default .dropdown:focus > a, html:not(.js) .navbar-default .dropdown:hover > a {
  color: #f3f3f3;
  background-color: #1f1f1f;
}

html:not(.js) .navbar-default .dropdown:focus > a .navbar-nav__icon, html:not(.js) .navbar-default .dropdown:hover > a .navbar-nav__icon {
  fill: #f3f3f3;
}

.dropdown.has-alert.has-alert--desktop > a:before {
  background-color: #ffc142;
}

.navbar-nav__icon {
  fill: #ffffff;
}

.navbar__open-search-block {
  background-color: #333333;
}

.search--with-suggestions .spinner > div {
  background-color: #ffffff;
}

.card__block .form-item-data-policy label a {
  color: #33b5e5;
}

.vote-widget--social-vote .vote-vote {
  background-color: #ffc142;
}

.social-gtranslate-list--desktop > a {
  color: #ffffff;
  background-color: #333333;
}

.social-gtranslate-list--desktop > a:after {
  color: #ffffff;
}

.social-gtranslate-list--desktop > a .select-icon {
  fill: #ffffff;
}

.social-gtranslate-list--desktop > a:focus, .social-gtranslate-list--desktop > a:hover {
  color: #f3f3f3;
  fill: #f3f3f3;
  background-color: #1f1f1f;
}

.social-gtranslate-list--desktop > a:focus:after, .social-gtranslate-list--desktop > a:hover:after {
  color: #f3f3f3;
}

.social-gtranslate-list--desktop > a:focus .select-icon, .social-gtranslate-list--desktop > a:hover .select-icon {
  fill: #f3f3f3;
}

.social-gtranslate-list--desktop.open > a {
  color: #f3f3f3;
  fill: #f3f3f3;
  background-color: #1f1f1f;
}

.social-gtranslate-list--desktop.open > a:after {
  color: #f3f3f3;
}

.social-gtranslate-list--desktop.open > a .select-icon {
  fill: #f3f3f3;
}

.social-gtranslate-list--desktop.open > a:focus, .social-gtranslate-list--desktop.open > a:hover {
  color: #f3f3f3;
  fill: #f3f3f3;
  background-color: #1f1f1f;
}

.social-gtranslate-list--desktop.open > a:focus:after, .social-gtranslate-list--desktop.open > a:hover:after {
  color: #f3f3f3;
}

.social-gtranslate-list--desktop.open > a:focus .select-icon, .social-gtranslate-list--desktop.open > a:hover .select-icon {
  fill: #f3f3f3;
}

#sliding-popup {
  background-color: #1f7ea7 !important;
}

.marker-cluster-small,
.marker-cluster-small div {
  background-color: #1f80aa;
}

.marker-cluster div {
  font-weight: bold;
  color: #f9f9f9;
  font-size: 1.2em;
}

.geolocation-map-container {
  z-index: 5;
}

.leaflet-popup-content .card__text > a {
  color: #33b5e5;
}

.leaflet-popup-content .card__text > a:after {
  color: #33b5e5;
}

.card__featured-items .teaser__info svg {
  color: #29abe2;
  fill: #29abe2;
}

.card__featured-items .teaser__info svg:hover, .card__featured-items .teaser__info svg:focus, .card__featured-items .teaser__info svg:active {
  color: #ffc142;
  fill: #ffc142;
}

.course__navigation .course_nav-title,
.course__navigation .course_nav-toggle,
.course__navigation .course_dividing-line {
  color: #29abe2;
}

.course__navigation .course_nav-title .icon {
  background: #29abe2;
}

.course__navigation .course_nav-title:hover, .course__navigation .course_nav-title:active, .course__navigation .course_nav-title:focus {
  color: #ffc142;
}

.course__navigation .course_nav-title:hover .icon, .course__navigation .course_nav-title:active .icon, .course__navigation .course_nav-title:focus .icon {
  background: #ffc142;
}

.course__navigation .course_nav-toggle svg {
  fill: #29abe2;
}

.course__navigation .course_nav-toggle:hover, .course__navigation .course_nav-toggle:active, .course__navigation .course_nav-toggle:focus {
  color: #ffc142;
}

.course__navigation .course_nav-toggle:hover svg, .course__navigation .course_nav-toggle:active svg, .course__navigation .course_nav-toggle:focus svg {
  fill: #ffc142;
}

.badge.badge-active {
  background-color: #ffc142;
}

.phase.phase-past:not(:last-child):before {
  background-color: #ffc142;
}

.phase.phase-past .phase-past--icon .checkmark-icon {
  fill: #ffc142;
}

.phase.phase-active:before {
  background-color: #ffc142;
}

.phase .teaser__tag {
  color: #29abe2;
}

.phase .teaser__tag a:hover, .phase .teaser__tag a:active, .phase .teaser__tag a:focus {
  color: #ffc142;
}

.phase.path-group .cover-wrap .teaser__tag {
  background-color: #29abe2;
  color: #fff;
}

.phase .badge-primary {
  background: #29abe2;
}

.phase .hero__banner-static .hero__tag {
  color: #29abe2;
}

.phase .hero__banner-static .hero__tag a,
.phase .hero__banner-static .hero__tag span {
  color: #29abe2;
}

.phase .hero__banner-static .hero__tag a:hover, .phase .hero__banner-static .hero__tag a:active, .phase .hero__banner-static .hero__tag a:focus {
  color: #ffc142;
}

.phase .navbar-secondary .navbar-nav .hidden-list li a:hover, .phase .navbar-secondary .navbar-nav .hidden-list li a.active, .phase .navbar-secondary .navbar-nav .hidden-list li a:focus, .phase .navbar-secondary .navbar-nav .hidden-list li a.is-active {
  color: #29abe2;
}

.teaser--tile.teaser-profile .teaser__image {
  background-color: #29abe2;
}

@media (min-width: 600px) {
  .teaser__image {
    border-top-left-radius: inherit;
    border-bottom-left-radius: inherit;
    background: #e6e6e6;
  }
  .teaser__teaser-type {
    background-color: rgba(0, 0, 0, 0.5);
    border-radius: 0 0 10px 0;
  }
  .cover .hero-avatar {
    border-width: 3px;
  }
}

@media (min-width: 900px) {
  .search-take-over .form-text {
    color: #ffffff;
  }
  .search-take-over .form-text:focus {
    border-color: #ffffff;
    box-shadow: 0 2px 0 0 #ffffff;
  }
  .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    border-bottom: 2px solid #29abe2;
  }
  .search-take-over .form-text {
    color: #ffffff;
  }
  .search-take-over .form-text:focus {
    border-color: #ffffff;
    box-shadow: 0 2px 0 0 #ffffff;
  }
  .btn--close-search-take-over svg,
  .search-take-over svg {
    fill: #ffffff;
  }
}

@media (max-width: 599px) {
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #ffffff;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #e6e6e6;
    background-color: #1a8dbe;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #f3f3f3;
    background-color: #1f1f1f;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #ccc;
    background-color: transparent;
  }
  .dropdown.has-alert > a:before {
    background-color: #ffc142;
  }
}

@media (max-width: 899px) {
  .navbar-collapse .dropdown-menu li a {
    color: #ffffff;
  }
  .navbar-collapse .dropdown-menu li a:hover, .navbar-collapse .dropdown-menu li a:focus {
    background-color: #1f80aa;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #4d4d4d;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
    color: #404040;
    background-color: #f5f5f5;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
    color: #ffffff;
    background-color: #1f80aa;
  }
  .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
    color: #4d4d4d;
    background-color: #777;
  }
  .navbar-collapse .dropdown-menu li a {
    color: #ffffff;
  }
  .navbar-collapse .dropdown-menu li a:hover, .navbar-collapse .dropdown-menu li a:focus {
    color: #f3f3f3;
    background-color: #1f1f1f;
  }
}

File

themes/socialblue/assets/css/preview.css
View source
  1. @font-face {
  2. font-family: 'montserrat';
  3. src: url("../font/montserrat/montserrat-light.eot") format('embedded-opentype'),
  4. url("../font/montserrat/montserrat-light.woff2") format('woff2'),
  5. url("../font/montserrat/montserrat-light.woff") format('woff'),
  6. url("../font/montserrat/montserrat-light.ttf") format('truetype'),
  7. url("../font/montserrat/montserrat-light.svg") format('svg');
  8. font-weight: 300;
  9. font-style: normal;
  10. }
  11. @font-face {
  12. font-family: 'montserrat';
  13. src: url("../font/montserrat/montserrat-normal.eot") format('embedded-opentype'),
  14. url("../font/montserrat/montserrat-normal.woff2") format('woff2'),
  15. url("../font/montserrat/montserrat-normal.woff") format('woff'),
  16. url("../font/montserrat/montserrat-normal.ttf") format('truetype'),
  17. url("../font/montserrat/montserrat-normal.svg") format('svg');
  18. font-weight: 500;
  19. font-style: normal;
  20. }
  21. @font-face {
  22. font-family: 'montserrat';
  23. src: url("../font/montserrat/montserrat-bold.eot") format('embedded-opentype'),
  24. url("../font/montserrat/montserrat-bold.woff2") format('woff2'),
  25. url("../font/montserrat/montserrat-bold.woff") format('woff'),
  26. url("../font/montserrat/montserrat-bold.ttf") format('truetype'),
  27. url("../font/montserrat/montserrat-bold.svg") format('svg');
  28. font-weight: 700;
  29. font-style: normal;
  30. }
  31. code,
  32. kbd,
  33. pre,
  34. samp {
  35. font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
  36. }
  37. code {
  38. color: #c7254e;
  39. background-color: #f9f2f4;
  40. border-radius: 2px;
  41. }
  42. kbd {
  43. color: #fff;
  44. background-color: #333;
  45. border-radius: 3px;
  46. box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
  47. }
  48. pre {
  49. color: #333333;
  50. background-color: #f5f5f5;
  51. border: 1px solid #ccc;
  52. border-radius: 10px;
  53. }
  54. blockquote {
  55. border-left: 3px solid #29abe2;
  56. }
  57. strong {
  58. font-weight: 500;
  59. }
  60. .text-primary {
  61. color: #29abe2;
  62. }
  63. a.text-primary:hover,
  64. a.text-primary:focus {
  65. color: #1a8dbe;
  66. }
  67. .text-success {
  68. color: #3c763d;
  69. }
  70. a.text-success:hover,
  71. a.text-success:focus {
  72. color: #2b542c;
  73. }
  74. .text-info {
  75. color: #31708f;
  76. }
  77. a.text-info:hover,
  78. a.text-info:focus {
  79. color: #245269;
  80. }
  81. .text-warning {
  82. color: #8a6d3b;
  83. }
  84. a.text-warning:hover,
  85. a.text-warning:focus {
  86. color: #66512c;
  87. }
  88. .text-danger {
  89. color: #a94442;
  90. }
  91. a.text-danger:hover,
  92. a.text-danger:focus {
  93. color: #843534;
  94. }
  95. .text-muted {
  96. color: #555555;
  97. }
  98. a.text-muted:hover,
  99. a.text-muted:focus {
  100. color: #3c3c3c;
  101. }
  102. .text-gray {
  103. color: #555555;
  104. }
  105. a.text-gray:hover,
  106. a.text-gray:focus {
  107. color: #3c3c3c;
  108. }
  109. .text-gray-light {
  110. color: #777;
  111. }
  112. a.text-gray-light:hover,
  113. a.text-gray-light:focus {
  114. color: #5e5e5e;
  115. }
  116. .text-gray-lighter {
  117. color: #adadad;
  118. }
  119. a.text-gray-lighter:hover,
  120. a.text-gray-lighter:focus {
  121. color: #949494;
  122. }
  123. .text-gray-lightest {
  124. color: #e6e6e6;
  125. }
  126. a.text-gray-lightest:hover,
  127. a.text-gray-lightest:focus {
  128. color: #cdcdcd;
  129. }
  130. .text-accent {
  131. color: #ffc142;
  132. }
  133. a.text-accent:hover,
  134. a.text-accent:focus {
  135. color: #ffb00f;
  136. }
  137. .bg-primary {
  138. background-color: #29abe2;
  139. }
  140. .bg-secondary {
  141. background-color: #1f80aa;
  142. }
  143. .bg-accent {
  144. background-color: #ffc142;
  145. }
  146. .bg-success {
  147. background-color: #dff0d8;
  148. }
  149. .bg-warning {
  150. background-color: #fcf8e3;
  151. }
  152. .bg-danger {
  153. background-color: #f2dede;
  154. }
  155. .bg-info {
  156. background-color: #d9edf7;
  157. }
  158. .bg-gray-base {
  159. background-color: #000;
  160. }
  161. .bg-gray-darker {
  162. background-color: #222222;
  163. }
  164. .bg-gray-dark {
  165. background-color: #333333;
  166. }
  167. .bg-gray {
  168. background-color: #555555;
  169. }
  170. .bg-gray-light {
  171. background-color: #777;
  172. }
  173. .bg-gray-light-1 {
  174. background-color: #adadad;
  175. }
  176. .bg-gray-lighter {
  177. background-color: #e6e6e6;
  178. }
  179. .bg-gray-lighter-1 {
  180. background-color: #f7f7f7;
  181. }
  182. .bg-gray-lightest {
  183. background-color: #f3f3f3;
  184. }
  185. .bg-white {
  186. background-color: white;
  187. }
  188. .brand-primary {
  189. background-color: #29abe2;
  190. border-color: #29abe2;
  191. color: white;
  192. }
  193. a.brand-primary:hover,
  194. a.brand-primary:focus {
  195. background-color: #1a8dbe;
  196. border-color: #1a8dbe;
  197. color: white;
  198. }
  199. .brand-secondary {
  200. background-color: #1f80aa;
  201. border-color: #1f80aa;
  202. color: white;
  203. }
  204. a.brand-secondary:hover,
  205. a.brand-secondary:focus {
  206. background-color: #17607f;
  207. border-color: #17607f;
  208. color: white;
  209. }
  210. .brand-accent {
  211. background-color: #ffc142;
  212. border-color: #ffc142;
  213. color: #4d4d4d;
  214. }
  215. a.brand-accent:hover,
  216. a.brand-accent:focus {
  217. background-color: #ffb00f;
  218. border-color: #ffb00f;
  219. color: #4d4d4d;
  220. }
  221. .brand-user {
  222. background-color: #222222;
  223. border-color: #222222;
  224. color: white;
  225. }
  226. a.brand-user:hover,
  227. a.brand-user:focus {
  228. background-color: #090909;
  229. border-color: #090909;
  230. color: white;
  231. }
  232. .default-light {
  233. background-color: #e6e6e6;
  234. border-color: #e6e6e6;
  235. color: #4d4d4d;
  236. }
  237. a.default-light:hover,
  238. a.default-light:focus {
  239. background-color: #cdcdcd;
  240. border-color: #cdcdcd;
  241. color: #4d4d4d;
  242. }
  243. body {
  244. font-family: "montserrat", sans-serif;
  245. font-weight: 300;
  246. -webkit-font-smoothing: antialiased;
  247. -moz-osx-font-smoothing: grayscale;
  248. color: #4d4d4d;
  249. background-color: #f3f3f3;
  250. }
  251. .table-primary,
  252. .table-primary > th,
  253. .table-primary > td {
  254. background-color: #c3e7f7;
  255. }
  256. .table-hover .table-primary:hover {
  257. background-color: #addef4;
  258. }
  259. .table-hover .table-primary:hover > td,
  260. .table-hover .table-primary:hover > th {
  261. background-color: #addef4;
  262. }
  263. .table-secondary,
  264. .table-secondary > th,
  265. .table-secondary > td {
  266. background-color: #c0dbe7;
  267. }
  268. .table-hover .table-secondary:hover {
  269. background-color: #aed0e0;
  270. }
  271. .table-hover .table-secondary:hover > td,
  272. .table-hover .table-secondary:hover > th {
  273. background-color: #aed0e0;
  274. }
  275. .table-accent,
  276. .table-accent > th,
  277. .table-accent > td {
  278. background-color: #ffeeca;
  279. }
  280. .table-hover .table-accent:hover {
  281. background-color: #ffe6b1;
  282. }
  283. .table-hover .table-accent:hover > td,
  284. .table-hover .table-accent:hover > th {
  285. background-color: #ffe6b1;
  286. }
  287. .table-success,
  288. .table-success > th,
  289. .table-success > td {
  290. background-color: #d1ebd1;
  291. }
  292. .table-hover .table-success:hover {
  293. background-color: #bfe3bf;
  294. }
  295. .table-hover .table-success:hover > td,
  296. .table-hover .table-success:hover > th {
  297. background-color: #bfe3bf;
  298. }
  299. .table-info,
  300. .table-info > th,
  301. .table-info > td {
  302. background-color: #c6eaf8;
  303. }
  304. .table-hover .table-info:hover {
  305. background-color: #afe2f5;
  306. }
  307. .table-hover .table-info:hover > td,
  308. .table-hover .table-info:hover > th {
  309. background-color: #afe2f5;
  310. }
  311. .table-warning,
  312. .table-warning > th,
  313. .table-warning > td {
  314. background-color: #ffdeb8;
  315. }
  316. .table-hover .table-warning:hover {
  317. background-color: #ffd29f;
  318. }
  319. .table-hover .table-warning:hover > td,
  320. .table-hover .table-warning:hover > th {
  321. background-color: #ffd29f;
  322. }
  323. .table-danger,
  324. .table-danger > th,
  325. .table-danger > td {
  326. background-color: #f4cfce;
  327. }
  328. .table-hover .table-danger:hover {
  329. background-color: #efbbb9;
  330. }
  331. .table-hover .table-danger:hover > td,
  332. .table-hover .table-danger:hover > th {
  333. background-color: #efbbb9;
  334. }
  335. .table-light,
  336. .table-light > th,
  337. .table-light > td {
  338. background-color: #f8f8f8;
  339. }
  340. .table-hover .table-light:hover {
  341. background-color: #ebebeb;
  342. }
  343. .table-hover .table-light:hover > td,
  344. .table-hover .table-light:hover > th {
  345. background-color: #ebebeb;
  346. }
  347. .table-dark,
  348. .table-dark > th,
  349. .table-dark > td {
  350. background-color: #c6c6c6;
  351. }
  352. .table-hover .table-dark:hover {
  353. background-color: #b9b9b9;
  354. }
  355. .table-hover .table-dark:hover > td,
  356. .table-hover .table-dark:hover > th {
  357. background-color: #b9b9b9;
  358. }
  359. .table-active,
  360. .table-active > th,
  361. .table-active > td {
  362. background-color: rgba(0, 0, 0, 0.075);
  363. }
  364. .table-hover .table-active:hover {
  365. background-color: rgba(0, 0, 0, 0.075);
  366. }
  367. .table-hover .table-active:hover > td,
  368. .table-hover .table-active:hover > th {
  369. background-color: rgba(0, 0, 0, 0.075);
  370. }
  371. .table .table {
  372. background-color: #f3f3f3;
  373. }
  374. .table th a {
  375. color: #1d789e;
  376. }
  377. .table th.is-active > a {
  378. color: #29abe2;
  379. }
  380. .table .icon-tablesort {
  381. fill: #29abe2;
  382. }
  383. .img-avatar,
  384. .avatar img,
  385. .avatar-icon {
  386. border-radius: 50%;
  387. }
  388. .badge {
  389. border-radius: 0.25em;
  390. color: #fff;
  391. }
  392. .badge__icon {
  393. fill: #4d4d4d;
  394. }
  395. .badge--pill {
  396. border-radius: 1em;
  397. }
  398. .badge-default {
  399. background-color: #e6e6e6;
  400. color: #4d4d4d;
  401. transition: 0.3s;
  402. }
  403. .badge-default[href]:hover, .badge-default[href]:focus {
  404. background-color: #cdcdcd;
  405. }
  406. .badge-primary {
  407. background-color: #29abe2;
  408. color: #fff;
  409. transition: 0.3s;
  410. }
  411. .badge-primary[href]:hover, .badge-primary[href]:focus {
  412. background-color: #1a8dbe;
  413. }
  414. .badge-secondary {
  415. background-color: #1f80aa;
  416. color: #fff;
  417. transition: 0.3s;
  418. }
  419. .badge-secondary[href]:hover, .badge-secondary[href]:focus {
  420. background-color: #17607f;
  421. }
  422. .badge-accent {
  423. background-color: #ffc142;
  424. color: #4d4d4d;
  425. transition: 0.3s;
  426. }
  427. .badge-accent[href]:hover, .badge-accent[href]:focus {
  428. background-color: #ffb00f;
  429. }
  430. .badge-success {
  431. background-color: #5cb85c;
  432. color: #fff;
  433. transition: 0.3s;
  434. }
  435. .badge-success[href]:hover, .badge-success[href]:focus {
  436. background-color: #449d44;
  437. }
  438. .badge-info {
  439. background-color: #33b5e5;
  440. color: #fff;
  441. transition: 0.3s;
  442. }
  443. .badge-info[href]:hover, .badge-info[href]:focus {
  444. background-color: #1a9bcb;
  445. }
  446. .badge-warning {
  447. background-color: #f80;
  448. color: #fff;
  449. transition: 0.3s;
  450. }
  451. .badge-warning[href]:hover, .badge-warning[href]:focus {
  452. background-color: #cc6d00;
  453. }
  454. .badge-danger {
  455. background-color: #d9534f;
  456. color: #fff;
  457. transition: 0.3s;
  458. }
  459. .badge-danger[href]:hover, .badge-danger[href]:focus {
  460. background-color: #c9302c;
  461. }
  462. a .badge-default {
  463. color: #4d4d4d;
  464. }
  465. a .badge-default:hover {
  466. color: #4d4d4d;
  467. }
  468. .btn {
  469. border-radius: 10px;
  470. }
  471. .btn.btn-floating {
  472. border-radius: 50%;
  473. }
  474. .btn-default {
  475. color: #4d4d4d;
  476. background-color: #ffffff;
  477. border-color: #adadad;
  478. fill: #4d4d4d;
  479. }
  480. .btn-default:focus, .btn-default.focus, .btn-default:hover, .btn-default:active, .btn-default.active,
  481. .open > .btn-default.dropdown-toggle {
  482. background-color: #e6e6e6;
  483. border-color: #8e8e8e;
  484. color: #4d4d4d;
  485. }
  486. .btn-default.disabled:hover, .btn-default.disabled:focus, .btn-default.disabled.focus, .btn-default[disabled]:hover, .btn-default[disabled]:focus, .btn-default[disabled].focus,
  487. fieldset[disabled] .btn-default:hover,
  488. fieldset[disabled] .btn-default:focus,
  489. fieldset[disabled] .btn-default.focus {
  490. background-color: #ffffff;
  491. border-color: #adadad;
  492. }
  493. .btn-primary {
  494. color: #ffffff;
  495. background-color: #29abe2;
  496. border-color: #29abe2;
  497. fill: #ffffff;
  498. }
  499. .btn-primary:focus, .btn-primary.focus, .btn-primary:hover, .btn-primary:active, .btn-primary.active,
  500. .open > .btn-primary.dropdown-toggle {
  501. background-color: #1a8dbe;
  502. border-color: #1987b5;
  503. color: #ffffff;
  504. }
  505. .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus,
  506. fieldset[disabled] .btn-primary:hover,
  507. fieldset[disabled] .btn-primary:focus,
  508. fieldset[disabled] .btn-primary.focus {
  509. background-color: #29abe2;
  510. border-color: #29abe2;
  511. }
  512. .btn-secondary {
  513. color: #ffffff;
  514. background-color: #1f80aa;
  515. border-color: #1f80aa;
  516. fill: #ffffff;
  517. }
  518. .btn-secondary:focus, .btn-secondary.focus, .btn-secondary:hover, .btn-secondary:active, .btn-secondary.active,
  519. .open > .btn-secondary.dropdown-toggle {
  520. background-color: #17607f;
  521. border-color: #165976;
  522. color: #ffffff;
  523. }
  524. .btn-secondary.disabled:hover, .btn-secondary.disabled:focus, .btn-secondary.disabled.focus, .btn-secondary[disabled]:hover, .btn-secondary[disabled]:focus, .btn-secondary[disabled].focus,
  525. fieldset[disabled] .btn-secondary:hover,
  526. fieldset[disabled] .btn-secondary:focus,
  527. fieldset[disabled] .btn-secondary.focus {
  528. background-color: #1f80aa;
  529. border-color: #1f80aa;
  530. }
  531. .btn-accent {
  532. color: #333333;
  533. background-color: #ffc142;
  534. border-color: #ffc142;
  535. fill: #333333;
  536. fill: #333333;
  537. }
  538. .btn-accent:focus, .btn-accent.focus, .btn-accent:hover, .btn-accent:active, .btn-accent.active,
  539. .open > .btn-accent.dropdown-toggle {
  540. background-color: #ffb00f;
  541. border-color: #ffad05;
  542. color: #333333;
  543. }
  544. .btn-accent.disabled:hover, .btn-accent.disabled:focus, .btn-accent.disabled.focus, .btn-accent[disabled]:hover, .btn-accent[disabled]:focus, .btn-accent[disabled].focus,
  545. fieldset[disabled] .btn-accent:hover,
  546. fieldset[disabled] .btn-accent:focus,
  547. fieldset[disabled] .btn-accent.focus {
  548. background-color: #ffc142;
  549. border-color: #ffc142;
  550. }
  551. .btn-flat {
  552. color: #29abe2;
  553. background-color: transparent;
  554. border-color: transparent;
  555. fill: #29abe2;
  556. fill: #29abe2;
  557. white-space: normal;
  558. }
  559. .btn-flat:focus, .btn-flat.focus, .btn-flat:hover, .btn-flat:active, .btn-flat.active,
  560. .open > .btn-flat.dropdown-toggle {
  561. background-color: rgba(0, 0, 0, 0);
  562. border-color: rgba(0, 0, 0, 0);
  563. color: #29abe2;
  564. }
  565. .btn-flat.disabled:hover, .btn-flat.disabled:focus, .btn-flat.disabled.focus, .btn-flat[disabled]:hover, .btn-flat[disabled]:focus, .btn-flat[disabled].focus,
  566. fieldset[disabled] .btn-flat:hover,
  567. fieldset[disabled] .btn-flat:focus,
  568. fieldset[disabled] .btn-flat.focus {
  569. background-color: transparent;
  570. border-color: transparent;
  571. }
  572. .btn-flat:hover, .btn-flat:focus,
  573. .open .dropdown-toggle .btn-flat {
  574. color: inherit;
  575. background-color: #ffffff;
  576. border-color: #adadad;
  577. fill: inherit;
  578. color: #1a8dbe;
  579. fill: #1a8dbe;
  580. }
  581. .btn-flat:hover:focus, .btn-flat:hover.focus, .btn-flat:hover:hover, .btn-flat:hover:active, .btn-flat:hover.active,
  582. .open > .btn-flat:hover.dropdown-toggle, .btn-flat:focus:focus, .btn-flat:focus.focus, .btn-flat:focus:hover, .btn-flat:focus:active, .btn-flat:focus.active,
  583. .open > .btn-flat:focus.dropdown-toggle,
  584. .open .dropdown-toggle .btn-flat:focus,
  585. .open .dropdown-toggle .btn-flat.focus,
  586. .open .dropdown-toggle .btn-flat:hover,
  587. .open .dropdown-toggle .btn-flat:active,
  588. .open .dropdown-toggle .btn-flat.active,
  589. .open >
  590. .open .dropdown-toggle .btn-flat.dropdown-toggle {
  591. background-color: #e6e6e6;
  592. border-color: #8e8e8e;
  593. color: inherit;
  594. }
  595. .btn-flat:hover.disabled:hover, .btn-flat:hover.disabled:focus, .btn-flat:hover.disabled.focus, .btn-flat:hover[disabled]:hover, .btn-flat:hover[disabled]:focus, .btn-flat:hover[disabled].focus,
  596. fieldset[disabled] .btn-flat:hover:hover,
  597. fieldset[disabled] .btn-flat:hover:focus,
  598. fieldset[disabled] .btn-flat:hover.focus, .btn-flat:focus.disabled:hover, .btn-flat:focus.disabled:focus, .btn-flat:focus.disabled.focus, .btn-flat:focus[disabled]:hover, .btn-flat:focus[disabled]:focus, .btn-flat:focus[disabled].focus,
  599. fieldset[disabled] .btn-flat:focus:hover,
  600. fieldset[disabled] .btn-flat:focus:focus,
  601. fieldset[disabled] .btn-flat:focus.focus,
  602. .open .dropdown-toggle .btn-flat.disabled:hover,
  603. .open .dropdown-toggle .btn-flat.disabled:focus,
  604. .open .dropdown-toggle .btn-flat.disabled.focus,
  605. .open .dropdown-toggle .btn-flat[disabled]:hover,
  606. .open .dropdown-toggle .btn-flat[disabled]:focus,
  607. .open .dropdown-toggle .btn-flat[disabled].focus,
  608. fieldset[disabled]
  609. .open .dropdown-toggle .btn-flat:hover,
  610. fieldset[disabled]
  611. .open .dropdown-toggle .btn-flat:focus,
  612. fieldset[disabled]
  613. .open .dropdown-toggle .btn-flat.focus {
  614. background-color: #ffffff;
  615. border-color: #adadad;
  616. }
  617. .btn-flat:hover .icon-inline, .btn-flat:focus .icon-inline,
  618. .open .dropdown-toggle .btn-flat .icon-inline {
  619. fill: #4d4d4d;
  620. }
  621. .btn-flat:active, .btn-flat.active {
  622. background-color: rgba(12, 12, 12, 0.25);
  623. border-color: transparent;
  624. color: white;
  625. }
  626. .btn-link {
  627. color: #29abe2;
  628. background-color: transparent;
  629. border-color: transparent;
  630. fill: #29abe2;
  631. }
  632. .btn-link:focus, .btn-link.focus, .btn-link:hover, .btn-link:active, .btn-link.active,
  633. .open > .btn-link.dropdown-toggle {
  634. background-color: rgba(0, 0, 0, 0);
  635. border-color: rgba(0, 0, 0, 0);
  636. color: #29abe2;
  637. }
  638. .btn-link.disabled:hover, .btn-link.disabled:focus, .btn-link.disabled.focus, .btn-link[disabled]:hover, .btn-link[disabled]:focus, .btn-link[disabled].focus,
  639. fieldset[disabled] .btn-link:hover,
  640. fieldset[disabled] .btn-link:focus,
  641. fieldset[disabled] .btn-link.focus {
  642. background-color: transparent;
  643. border-color: transparent;
  644. }
  645. .btn-link:hover, .btn-link:focus {
  646. color: #178ab4;
  647. fill: #178ab4;
  648. text-decoration: none;
  649. }
  650. .btn-link[disabled]:hover, .btn-link[disabled]:focus {
  651. color: #777;
  652. }
  653. .btn--with-bgicon {
  654. color: #fff;
  655. }
  656. .btn--facebook {
  657. color: #fff;
  658. background-color: #3b5998;
  659. border-color: #3b5998;
  660. fill: #fff;
  661. }
  662. .btn--facebook:focus, .btn--facebook.focus, .btn--facebook:hover, .btn--facebook:active, .btn--facebook.active,
  663. .open > .btn--facebook.dropdown-toggle {
  664. background-color: #2d4373;
  665. border-color: #2a3f6c;
  666. color: #fff;
  667. }
  668. .btn--facebook.disabled:hover, .btn--facebook.disabled:focus, .btn--facebook.disabled.focus, .btn--facebook[disabled]:hover, .btn--facebook[disabled]:focus, .btn--facebook[disabled].focus,
  669. fieldset[disabled] .btn--facebook:hover,
  670. fieldset[disabled] .btn--facebook:focus,
  671. fieldset[disabled] .btn--facebook.focus {
  672. background-color: #3b5998;
  673. border-color: #3b5998;
  674. }
  675. .btn--linkedin {
  676. color: #fff;
  677. background-color: #0077b5;
  678. border-color: #0077b5;
  679. fill: #fff;
  680. }
  681. .btn--linkedin:focus, .btn--linkedin.focus, .btn--linkedin:hover, .btn--linkedin:active, .btn--linkedin.active,
  682. .open > .btn--linkedin.dropdown-toggle {
  683. background-color: #005582;
  684. border-color: #004f78;
  685. color: #fff;
  686. }
  687. .btn--linkedin.disabled:hover, .btn--linkedin.disabled:focus, .btn--linkedin.disabled.focus, .btn--linkedin[disabled]:hover, .btn--linkedin[disabled]:focus, .btn--linkedin[disabled].focus,
  688. fieldset[disabled] .btn--linkedin:hover,
  689. fieldset[disabled] .btn--linkedin:focus,
  690. fieldset[disabled] .btn--linkedin.focus {
  691. background-color: #0077b5;
  692. border-color: #0077b5;
  693. }
  694. .btn--google {
  695. color: #fff;
  696. background-color: #d34836;
  697. border-color: #d34836;
  698. fill: #fff;
  699. }
  700. .btn--google:focus, .btn--google.focus, .btn--google:hover, .btn--google:active, .btn--google.active,
  701. .open > .btn--google.dropdown-toggle {
  702. background-color: #b03626;
  703. border-color: #a73425;
  704. color: #fff;
  705. }
  706. .btn--google.disabled:hover, .btn--google.disabled:focus, .btn--google.disabled.focus, .btn--google[disabled]:hover, .btn--google[disabled]:focus, .btn--google[disabled].focus,
  707. fieldset[disabled] .btn--google:hover,
  708. fieldset[disabled] .btn--google:focus,
  709. fieldset[disabled] .btn--google.focus {
  710. background-color: #d34836;
  711. border-color: #d34836;
  712. }
  713. .btn--twitter {
  714. color: #fff;
  715. background-color: #1da1f2;
  716. border-color: #1da1f2;
  717. fill: #fff;
  718. }
  719. .btn--twitter:focus, .btn--twitter.focus, .btn--twitter:hover, .btn--twitter:active, .btn--twitter.active,
  720. .open > .btn--twitter.dropdown-toggle {
  721. background-color: #0c85d0;
  722. border-color: #0b7fc6;
  723. color: #fff;
  724. }
  725. .btn--twitter.disabled:hover, .btn--twitter.disabled:focus, .btn--twitter.disabled.focus, .btn--twitter[disabled]:hover, .btn--twitter[disabled]:focus, .btn--twitter[disabled].focus,
  726. fieldset[disabled] .btn--twitter:hover,
  727. fieldset[disabled] .btn--twitter:focus,
  728. fieldset[disabled] .btn--twitter.focus {
  729. background-color: #1da1f2;
  730. border-color: #1da1f2;
  731. }
  732. .btn-sm {
  733. border-radius: 8px;
  734. }
  735. .btn-xs {
  736. border-radius: 5px;
  737. }
  738. .shariff-button {
  739. border-radius: 10px;
  740. }
  741. .card {
  742. border-top-left-radius: 10px;
  743. border-bottom-left-radius: 10px;
  744. border-top-right-radius: 10px;
  745. border-bottom-right-radius: 10px;
  746. background-color: #ffffff;
  747. }
  748. .card__title {
  749. color: #555555;
  750. font-weight: 500;
  751. }
  752. .region--complementary .card__title,
  753. .region--complementary .card__actionbar,
  754. .paragraph--block .secondary-col .card__title,
  755. .paragraph--block .secondary-col .card__actionbar {
  756. text-align: center;
  757. }
  758. .card__block:first-child {
  759. border-top-left-radius: 10px;
  760. border-top-right-radius: 10px;
  761. }
  762. .card__block:last-child {
  763. border-bottom-left-radius: 10px;
  764. border-bottom-right-radius: 10px;
  765. }
  766. .card__nested-section:last-child {
  767. border-bottom-left-radius: 10px;
  768. border-bottom-right-radius: 10px;
  769. }
  770. .card__link {
  771. color: #29abe2;
  772. }
  773. .card__link:hover {
  774. color: #1a8dbe;
  775. }
  776. .card.block-data-policy .card__title,
  777. .card.block-data-policy .card__block {
  778. width: 100%;
  779. }
  780. .form-control {
  781. color: #555555;
  782. background-color: #fff;
  783. border: 1px solid #adadad;
  784. border-radius: 5px;
  785. }
  786. .form-control:focus {
  787. border-color: #29abe2;
  788. outline: 0;
  789. box-shadow: 0 2px 0 0 #29abe2;
  790. }
  791. .form-control::-moz-placeholder {
  792. color: #999;
  793. }
  794. .form-control:-ms-input-placeholder {
  795. color: #999;
  796. }
  797. .form-control::-webkit-input-placeholder {
  798. color: #999;
  799. }
  800. .form-control[disabled], .form-control[readonly],
  801. fieldset[disabled] .form-control {
  802. background-color: #fff;
  803. opacity: 1;
  804. }
  805. [type="radio"]:checked:not(:disabled) + label {
  806. color: #1d789e;
  807. }
  808. [type="radio"]:checked + label:before {
  809. border: 2px solid #1d789e;
  810. }
  811. [type="radio"]:checked + label:after {
  812. border: 2px solid #1d789e;
  813. background-color: #1d789e;
  814. }
  815. [type="radio"]:focus + label:before {
  816. box-shadow: 0 0 3px 2px #56bde8;
  817. }
  818. [type="checkbox"]:checked + label:after {
  819. border: 2px solid #1d789e;
  820. background-color: #1d789e;
  821. }
  822. [type="checkbox"].tabbed:checked:focus + label:after {
  823. background-color: #1d789e;
  824. border-color: #1d789e;
  825. }
  826. .js--animate-enabled-form-control:checked + label {
  827. -webkit-animation: scale-form-control 0.5s ease-in 0.5s;
  828. animation: scale-form-control 0.5s ease-in 0.5s;
  829. }
  830. @-webkit-keyframes scale-form-control {
  831. 0% {
  832. transform: scale(1);
  833. }
  834. 50% {
  835. transform: scale(1.1);
  836. }
  837. 100% {
  838. transform: scale(1);
  839. }
  840. }
  841. @keyframes scale-form-control {
  842. 0% {
  843. transform: scale(1);
  844. }
  845. 50% {
  846. transform: scale(1.1);
  847. }
  848. 100% {
  849. transform: scale(1);
  850. }
  851. }
  852. .switch input[type=checkbox]:checked + .lever {
  853. background-color: #72afc8;
  854. }
  855. .switch input[type=checkbox]:checked + .lever:after {
  856. background-color: #1d789e;
  857. }
  858. input[type=checkbox]:checked:not(:disabled) ~ .lever:active:after {
  859. box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(29, 120, 158, 0.1);
  860. }
  861. .input-group .select-wrapper:first-child .form-control:first-child {
  862. border-bottom-left-radius: 5px;
  863. border-top-left-radius: 5px;
  864. }
  865. .input-group .select-wrapper:last-child .form-control:first-child {
  866. border-bottom-right-radius: 5px;
  867. border-top-right-radius: 5px;
  868. }
  869. .has-error .select-wrapper:after {
  870. color: #a94442;
  871. }
  872. .has-success .select-wrapper:after {
  873. color: #3c763d;
  874. }
  875. .has-warning .select-wrapper:after {
  876. color: #8a6d3b;
  877. }
  878. span.form-required {
  879. color: #d9534f;
  880. }
  881. html.js .input-group-addon .glyphicon.glyphicon-spin {
  882. color: #29abe2;
  883. }
  884. .form-actions .btn-group--primary .dropdown-toggle {
  885. border-color: #29abe2;
  886. }
  887. .has-error .form-control {
  888. border-color: #a94442;
  889. }
  890. .has-error .form-control:focus {
  891. box-shadow: 0 2px 0 0 #a94442;
  892. border-color: #a94442;
  893. }
  894. .form-item--error-message.alert-danger {
  895. border-radius: 5px;
  896. }
  897. .form-item--error-message.alert-danger:before {
  898. color: #f2dede;
  899. }
  900. .control-label {
  901. font-weight: 300;
  902. }
  903. .form-wrapper__label {
  904. font-weight: 500;
  905. }
  906. .form-wrapper {
  907. border-radius: 9px;
  908. }
  909. .card__block .form-item-data-policy label a {
  910. color: #33b5e5;
  911. }
  912. .nav > li > a:hover,
  913. .nav > li > a:focus {
  914. background-color: transparent;
  915. }
  916. .nav > li.disabled > a {
  917. color: #777;
  918. }
  919. .nav > li.disabled > a:hover, .nav > li.disabled > a:focus {
  920. color: #777;
  921. }
  922. .navbar-default {
  923. background-color: #333333;
  924. }
  925. .navbar-default .navbar-nav > li > a {
  926. color: #ffffff;
  927. fill: #ffffff;
  928. }
  929. .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
  930. color: #e6e6e6;
  931. fill: #e6e6e6;
  932. background-color: #1a8dbe;
  933. }
  934. .navbar-default .navbar-nav > .active > a,
  935. .navbar-default .navbar-nav > .active > a:hover,
  936. .navbar-default .navbar-nav > .active > a:focus,
  937. .navbar-default .navbar-nav > li > a.is-active,
  938. .navbar-default .navbar-nav > li > a.is-active:hover,
  939. .navbar-default .navbar-nav > li > a.is-active:focus {
  940. color: #f3f3f3;
  941. fill: #f3f3f3;
  942. background-color: #1f1f1f;
  943. }
  944. .navbar-default .navbar-nav > .disabled > a, .navbar-default .navbar-nav > .disabled > a:hover, .navbar-default .navbar-nav > .disabled > a:focus {
  945. color: #ccc;
  946. fill: #ccc;
  947. background-color: transparent;
  948. }
  949. .navbar-default .dropdown-menu {
  950. border-top-left-radius: 0;
  951. border-top-right-radius: 0;
  952. }
  953. .navbar-default .dropdown-menu > li > a:hover, .navbar-default .dropdown-menu > li > a:focus {
  954. background-color: #f5f5f5;
  955. }
  956. .navbar-default .dropdown-menu > li > a.is-active {
  957. background-color: #e6e6e6;
  958. color: #4d4d4d;
  959. font-weight: 500;
  960. }
  961. .navbar-default .dropdown-menu > li > a.is-active:hover, .navbar-default .dropdown-menu > li > a.is-active:focus {
  962. cursor: default;
  963. }
  964. .navbar-default .navbar-toggle {
  965. border-radius: 0;
  966. }
  967. .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
  968. background-color: #222222;
  969. }
  970. .navbar-default .navbar-collapse {
  971. border-color: #ffffff;
  972. }
  973. .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
  974. background-color: #1f1f1f;
  975. color: #f3f3f3;
  976. }
  977. .navbar-default .dropdown img {
  978. border-radius: 50%;
  979. }
  980. .navbar-default .profile img {
  981. border: 2px solid white;
  982. width: 24px;
  983. height: 24px;
  984. overflow: hidden;
  985. }
  986. .navbar-search .form-group {
  987. border-radius: 5px;
  988. }
  989. .navbar-search .form-submit {
  990. border-radius: 0 5px 5px 0;
  991. }
  992. .navbar__open-search-block {
  993. background: rgba(51, 51, 51, 0.95);
  994. }
  995. .navbar-nav__icon {
  996. fill: #ffffff;
  997. }
  998. .navbar-secondary {
  999. background-color: #1f80aa;
  1000. }
  1001. .navbar-secondary .navbar-nav a {
  1002. color: #fff;
  1003. }
  1004. .navbar-secondary .navbar-nav li.active a {
  1005. border-bottom-color: #fff;
  1006. }
  1007. .navbar-secondary .navbar-nav li:not(.active) a:hover,
  1008. .navbar-secondary .navbar-nav li:not(.active) a:focus {
  1009. outline: none;
  1010. background-color: rgba(0, 0, 0, 0.3);
  1011. border-bottom-color: rgba(0, 0, 0, 0.3);
  1012. }
  1013. .navbar-scrollable:after {
  1014. background: linear-gradient(to right, rgba(31, 128, 170, 0), #1f80aa);
  1015. }
  1016. .nav-tabs {
  1017. border-bottom: 1px solid transparent;
  1018. }
  1019. .nav-tabs > li > a:hover {
  1020. border-color: transparent transparent transparent;
  1021. }
  1022. .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
  1023. color: #29abe2;
  1024. background-color: transparent;
  1025. border: 1px solid transparent;
  1026. }
  1027. .nav-tabs > li > a:hover, .nav-tabs > li > a:focus {
  1028. background-color: #e6e6e6;
  1029. border-bottom-color: #e6e6e6;
  1030. }
  1031. .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
  1032. font-weight: 500;
  1033. color: #29abe2;
  1034. background-color: transparent;
  1035. }
  1036. .tabs-left > .nav-tabs .active > a, .tabs-left > .nav-tabs .active > a:hover, .tabs-left > .nav-tabs .active > a:focus {
  1037. border-right: 2px solid #29abe2;
  1038. }
  1039. .tabs-right > .nav-tabs .active > a, .tabs-right > .nav-tabs .active > a:hover, .tabs-right > .nav-tabs .active > a:focus {
  1040. border-left: 2px solid #29abe2;
  1041. }
  1042. .tabs-left > .nav-tabs {
  1043. border-radius: 10px 0 0 10px;
  1044. }
  1045. .tabs-right > .nav-tabs {
  1046. border-radius: 0 10px 10px 0;
  1047. }
  1048. .teaser__teaser-type {
  1049. background-color: #adadad;
  1050. border-radius: 0 0 8px 8px;
  1051. }
  1052. .teaser__teaser-type-icon {
  1053. fill: white;
  1054. }
  1055. .teaser .teaser__badge:first-child {
  1056. padding-left: 0;
  1057. }
  1058. .teaser .teaser__badge:first-child.badge-default, .teaser .teaser__badge:first-child.badge-primary, .teaser .teaser__badge:first-child.badge-secondary, .teaser .teaser__badge:first-child.badge-accent, .teaser .teaser__badge:first-child.badge-success, .teaser .teaser__badge:first-child.badge-info, .teaser .teaser__badge:first-child.badge-warning, .teaser .teaser__badge:first-child.badge-danger, .teaser .teaser__badge:first-child.badge-active {
  1059. padding-left: 1em;
  1060. }
  1061. .comments {
  1062. background: #f3f3f3;
  1063. border-radius: 10px;
  1064. }
  1065. .comment__reply-btn {
  1066. color: #33b5e5;
  1067. fill: #33b5e5;
  1068. }
  1069. .comment__reply-btn:hover, .comment__reply-btn:focus {
  1070. color: #1a8dbe;
  1071. fill: #1a8dbe;
  1072. }
  1073. .photoswipe-gallery-custom .field--item .file-tile,
  1074. .photoswipe-gallery-custom .field--item img:not(.node-file__icon) {
  1075. border-radius: 10px;
  1076. }
  1077. .photoswipe-gallery-custom .field--item .file-link a {
  1078. font-weight: 500;
  1079. }
  1080. .cover {
  1081. color: white;
  1082. background-color: #29abe2;
  1083. }
  1084. .cover .page-title {
  1085. color: white;
  1086. }
  1087. .cover .hero-avatar {
  1088. border-radius: 50%;
  1089. border: 2px solid white;
  1090. }
  1091. .cover .hero-canvas {
  1092. border-radius: 10px;
  1093. background-color: rgba(51, 51, 51, 0.8);
  1094. color: white;
  1095. }
  1096. .cover .hero-form[role='search'] .form-control {
  1097. border-radius: 5px;
  1098. }
  1099. .cover .hero-form[role='search'] .form-control:focus, .cover .hero-form[role='search'] .form-control:active,
  1100. .cover .hero-form[role='search'] .form-control:focus ~ .search-icon,
  1101. .cover .hero-form[role='search'] .form-control:active ~ .search-icon {
  1102. box-shadow: 0 2px 0 0 #1f80aa;
  1103. }
  1104. .cover .hero-form[role='search'] .form-submit,
  1105. .cover .hero-form[role='search'] .search-icon {
  1106. border-radius: 0 5px 5px 0;
  1107. }
  1108. .cover .hero-form[role='search'] .search-icon {
  1109. fill: #29abe2;
  1110. background: white;
  1111. }
  1112. .stream-icon-new {
  1113. background: #1f80aa;
  1114. }
  1115. .teaser--stream .teaser__image {
  1116. border-radius: 0;
  1117. }
  1118. .teaser--stream:last-child {
  1119. border-bottom-left-radius: 10px;
  1120. border-bottom-right-radius: 10px;
  1121. }
  1122. .teaser--stream:last-child .card-image {
  1123. border-bottom-left-radius: 10px;
  1124. }
  1125. .site-footer {
  1126. background-color: #1f80aa;
  1127. color: white;
  1128. }
  1129. .site-footer .dropdown-menu > li > a {
  1130. color: #4d4d4d;
  1131. }
  1132. .site-footer .dropdown-menu > li > a:hover, .site-footer .dropdown-menu > li > a:focus {
  1133. background-color: #f5f5f5;
  1134. }
  1135. .field--name-field-introduction-text a:not(.btn),
  1136. .field--name-field-featured-items-description a:not(.btn),
  1137. .field--name-field-featured-description a:not(.btn),
  1138. .field--name-field-accord-description a:not(.btn),
  1139. .body-text a:not(.btn) {
  1140. text-decoration: underline;
  1141. color: #33b5e5;
  1142. }
  1143. .field--name-field-introduction-text a:not(.btn):hover,
  1144. .field--name-field-featured-items-description a:not(.btn):hover,
  1145. .field--name-field-featured-description a:not(.btn):hover,
  1146. .field--name-field-accord-description a:not(.btn):hover,
  1147. .body-text a:not(.btn):hover {
  1148. color: #178ab4;
  1149. }
  1150. [type="radio"]:checked + label:before {
  1151. border-color: #29abe2;
  1152. }
  1153. [type="radio"]:focus + label:before {
  1154. box-shadow: 0 0 3px 2px #29abe2;
  1155. }
  1156. [type="checkbox"]:checked + label:after,
  1157. [type="radio"]:checked + label:after {
  1158. border-color: #29abe2;
  1159. background-color: #29abe2;
  1160. }
  1161. [type="checkbox"]:checked:not(:disabled) + label,
  1162. [type="radio"]:checked:not(:disabled) + label {
  1163. color: #29abe2;
  1164. }
  1165. .tabs-left .nav-tabs > li.active > a,
  1166. .tabs-left .nav-tabs > li.active > a:hover,
  1167. .tabs-left .nav-tabs > li.active > a:focus {
  1168. border-right-color: #29abe2;
  1169. }
  1170. .view-birthday .teaser--tile .teaser__image {
  1171. background-color: #29abe2;
  1172. }
  1173. .cover,
  1174. .read-indicator,
  1175. .select2-container--social .select2-results__option--highlighted[aria-selected],
  1176. .select2-container--social .select2-results__option[aria-selected=true],
  1177. .pagination > .active > a,
  1178. .pagination > .active > a:hover,
  1179. .pagination > .active > a:focus,
  1180. .pagination > .active > span,
  1181. .pagination > .active > span:hover,
  1182. .pagination > .active > span:focus {
  1183. background-color: #29abe2;
  1184. }
  1185. .hero-form[role='search'] .form-control:focus, .hero-form[role='search'] .form-control:active,
  1186. .hero-form[role='search'] .form-control:focus ~ .search-icon,
  1187. .hero-form[role='search'] .form-control:active ~ .search-icon {
  1188. box-shadow: 0 2px 0 0 #1f80aa;
  1189. }
  1190. .hero-form[role='search'] .search-icon {
  1191. fill: #29abe2;
  1192. }
  1193. .form-control:focus {
  1194. border-color: #29abe2;
  1195. box-shadow: 0 2px 0 0 #29abe2;
  1196. }
  1197. .select2-container--social.select2-container--focus .select2-selection, .select2-container--social.select2-container--open .select2-selection, .select2-container--social .select2-dropdown {
  1198. border-color: #29abe2;
  1199. }
  1200. .site-footer,
  1201. .badge-secondary,
  1202. .ui-datepicker-calendar > tbody > tr > td .ui-state-active,
  1203. .stream-icon-new {
  1204. background-color: #1f80aa;
  1205. }
  1206. .eu-cookie-compliance-secondary-button,
  1207. .btn-primary {
  1208. background-color: #29abe2;
  1209. border-color: #29abe2;
  1210. }
  1211. .eu-cookie-compliance-secondary-button:focus, .eu-cookie-compliance-secondary-button.focus, .eu-cookie-compliance-secondary-button:hover, .eu-cookie-compliance-secondary-button:active, .eu-cookie-compliance-secondary-button.active,
  1212. .open > .eu-cookie-compliance-secondary-button.dropdown-toggle, .eu-cookie-compliance-secondary-button.dropdown-toggle:hover,
  1213. .btn-primary:focus,
  1214. .btn-primary.focus,
  1215. .btn-primary:hover,
  1216. .btn-primary:active,
  1217. .btn-primary.active,
  1218. .open >
  1219. .btn-primary.dropdown-toggle,
  1220. .btn-primary.dropdown-toggle:hover {
  1221. background-color: #29abe2;
  1222. border-color: #29abe2;
  1223. background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
  1224. }
  1225. .eu-cookie-compliance-secondary-button.disabled:hover, .eu-cookie-compliance-secondary-button.disabled:focus, .eu-cookie-compliance-secondary-button.disabled.focus, .eu-cookie-compliance-secondary-button[disabled]:hover, .eu-cookie-compliance-secondary-button[disabled]:focus, .eu-cookie-compliance-secondary-button[disabled].focus,
  1226. fieldset[disabled] .eu-cookie-compliance-secondary-button:hover,
  1227. fieldset[disabled] .eu-cookie-compliance-secondary-button:focus,
  1228. fieldset[disabled] .eu-cookie-compliance-secondary-button.focus,
  1229. .btn-primary.disabled:hover,
  1230. .btn-primary.disabled:focus,
  1231. .btn-primary.disabled.focus,
  1232. .btn-primary[disabled]:hover,
  1233. .btn-primary[disabled]:focus,
  1234. .btn-primary[disabled].focus,
  1235. fieldset[disabled]
  1236. .btn-primary:hover,
  1237. fieldset[disabled]
  1238. .btn-primary:focus,
  1239. fieldset[disabled]
  1240. .btn-primary.focus {
  1241. background-color: #29abe2;
  1242. border-color: #29abe2;
  1243. background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
  1244. }
  1245. .btn-secondary {
  1246. background-color: #1f80aa;
  1247. border-color: #1f80aa;
  1248. }
  1249. .btn-secondary:focus, .btn-secondary.focus, .btn-secondary:hover, .btn-secondary:active, .btn-secondary.active,
  1250. .open > .btn-secondary.dropdown-toggle, .btn-secondary.dropdown-toggle:hover {
  1251. background-color: #1f80aa;
  1252. border-color: #1f80aa;
  1253. background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
  1254. }
  1255. .btn-secondary.disabled:hover, .btn-secondary.disabled:focus, .btn-secondary.disabled.focus, .btn-secondary[disabled]:hover, .btn-secondary[disabled]:focus, .btn-secondary[disabled].focus,
  1256. fieldset[disabled] .btn-secondary:hover,
  1257. fieldset[disabled] .btn-secondary:focus,
  1258. fieldset[disabled] .btn-secondary.focus {
  1259. background-color: #1f80aa;
  1260. border-color: #1f80aa;
  1261. background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
  1262. }
  1263. .badge-accent {
  1264. background-color: #ffc142;
  1265. border-color: #ffc142;
  1266. }
  1267. .btn-accent {
  1268. background-color: #ffc142;
  1269. border-color: #ffc142;
  1270. }
  1271. .btn-accent:focus, .btn-accent.focus, .btn-accent:hover, .btn-accent:active, .btn-accent.active,
  1272. .open > .btn-accent.dropdown-toggle, .btn-accent.dropdown-toggle:hover {
  1273. background-color: #ffc142;
  1274. border-color: #ffc142;
  1275. background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
  1276. }
  1277. .btn-accent.disabled:hover, .btn-accent.disabled:focus, .btn-accent.disabled.focus, .btn-accent[disabled]:hover, .btn-accent[disabled]:focus, .btn-accent[disabled].focus,
  1278. fieldset[disabled] .btn-accent:hover,
  1279. fieldset[disabled] .btn-accent:focus,
  1280. fieldset[disabled] .btn-accent.focus {
  1281. background-color: #ffc142;
  1282. border-color: #ffc142;
  1283. background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
  1284. }
  1285. .card__link,
  1286. .card__link .btn-default,
  1287. .card__link.btn-default {
  1288. border-color: #29abe2;
  1289. }
  1290. .btn-flat,
  1291. .btn-link,
  1292. .btn-link:hover,
  1293. .btn-flat:hover,
  1294. .btn-link:focus,
  1295. .btn-flat:focus,
  1296. .nav-tabs > li.active > a,
  1297. .nav-tabs > li.active > a:hover,
  1298. .nav-tabs > li.active > a:focus,
  1299. .card__link,
  1300. .card__link:focus,
  1301. .card__link:hover,
  1302. .view--who-liked .views-field-view-user a,
  1303. .comment__reply-btn,
  1304. .nav-book .menu-item--active-trail > a {
  1305. color: #29abe2;
  1306. fill: #29abe2;
  1307. }
  1308. .list-item--active,
  1309. .list-item--active:hover,
  1310. .list-item--active:focus,
  1311. .list-group-item.active,
  1312. .list-group-item.active:hover,
  1313. .list-group-item.active:focus {
  1314. background-color: #1f80aa;
  1315. border-color: #1f80aa;
  1316. }
  1317. .field--name-field-introduction-text a:not(.btn),
  1318. .field--name-field-introduction-text a:not(.btn):hover,
  1319. .field--name-field-featured-items-description a:not(.btn),
  1320. .field--name-field-featured-items-description a:not(.btn):hover,
  1321. .field--name-field-featured-description a:not(.btn),
  1322. .field--name-field-featured-description a:not(.btn):hover,
  1323. .field--name-field-accord-description a:not(.btn),
  1324. .field--name-field-accord-description a:not(.btn):hover,
  1325. .body-text a:not(.btn),
  1326. .body-text a:not(.btn):hover {
  1327. color: #33b5e5;
  1328. }
  1329. blockquote {
  1330. border-left-color: #29abe2;
  1331. }
  1332. .input-group .form-control:focus ~ .input-group-addon {
  1333. border-color: #29abe2;
  1334. box-shadow: 0 2px 0 0 #29abe2;
  1335. }
  1336. #skip-link a {
  1337. background-color: #1f1f1f;
  1338. color: #f3f3f3;
  1339. }
  1340. .navbar-secondary {
  1341. color: #f9f9f9;
  1342. background-color: #1f7ea7;
  1343. }
  1344. .navbar-secondary .navbar-nav a {
  1345. color: #f9f9f9;
  1346. }
  1347. .navbar-secondary .navbar-nav li.active a {
  1348. border-bottom-color: #f9f9f9;
  1349. }
  1350. .navbar-scrollable:before {
  1351. background: linear-gradient(90deg, #1f7ea7, transparent);
  1352. }
  1353. .navbar-scrollable:after {
  1354. background: linear-gradient(-90deg, #1f7ea7, transparent);
  1355. }
  1356. .navbar-default {
  1357. background-color: #333333;
  1358. }
  1359. .navbar-default .navbar-toggle {
  1360. color: #ffffff;
  1361. }
  1362. .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
  1363. color: #f3f3f3;
  1364. background-color: #1f1f1f;
  1365. }
  1366. .navbar-default .navbar-nav > li > a {
  1367. color: #ffffff;
  1368. fill: #ffffff;
  1369. }
  1370. .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
  1371. color: #f3f3f3;
  1372. background-color: #1f1f1f;
  1373. }
  1374. .navbar-default .navbar-nav > li > a:hover .navbar-nav__icon, .navbar-default .navbar-nav > li > a:focus .navbar-nav__icon {
  1375. fill: #f3f3f3;
  1376. }
  1377. .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
  1378. background-color: #1f1f1f;
  1379. color: #f3f3f3;
  1380. }
  1381. .navbar-default .navbar-nav > li > a.is-active, .navbar-default .navbar-nav > li > a.is-active:hover, .navbar-default .navbar-nav > li > a.is-active:focus,
  1382. .navbar-default .navbar-nav > .active > a,
  1383. .navbar-default .navbar-nav > .active > a:hover,
  1384. .navbar-default .navbar-nav > .active > a:focus {
  1385. color: #f3f3f3;
  1386. fill: #f3f3f3;
  1387. background-color: #1f1f1f;
  1388. }
  1389. html:not(.js) .navbar-default .dropdown:focus > a, html:not(.js) .navbar-default .dropdown:hover > a {
  1390. color: #f3f3f3;
  1391. background-color: #1f1f1f;
  1392. }
  1393. html:not(.js) .navbar-default .dropdown:focus > a .navbar-nav__icon, html:not(.js) .navbar-default .dropdown:hover > a .navbar-nav__icon {
  1394. fill: #f3f3f3;
  1395. }
  1396. .dropdown.has-alert.has-alert--desktop > a:before {
  1397. background-color: #ffc142;
  1398. }
  1399. .navbar-nav__icon {
  1400. fill: #ffffff;
  1401. }
  1402. .navbar__open-search-block {
  1403. background-color: #333333;
  1404. }
  1405. .search--with-suggestions .spinner > div {
  1406. background-color: #ffffff;
  1407. }
  1408. .card__block .form-item-data-policy label a {
  1409. color: #33b5e5;
  1410. }
  1411. .vote-widget--social-vote .vote-vote {
  1412. background-color: #ffc142;
  1413. }
  1414. .social-gtranslate-list--desktop > a {
  1415. color: #ffffff;
  1416. background-color: #333333;
  1417. }
  1418. .social-gtranslate-list--desktop > a:after {
  1419. color: #ffffff;
  1420. }
  1421. .social-gtranslate-list--desktop > a .select-icon {
  1422. fill: #ffffff;
  1423. }
  1424. .social-gtranslate-list--desktop > a:focus, .social-gtranslate-list--desktop > a:hover {
  1425. color: #f3f3f3;
  1426. fill: #f3f3f3;
  1427. background-color: #1f1f1f;
  1428. }
  1429. .social-gtranslate-list--desktop > a:focus:after, .social-gtranslate-list--desktop > a:hover:after {
  1430. color: #f3f3f3;
  1431. }
  1432. .social-gtranslate-list--desktop > a:focus .select-icon, .social-gtranslate-list--desktop > a:hover .select-icon {
  1433. fill: #f3f3f3;
  1434. }
  1435. .social-gtranslate-list--desktop.open > a {
  1436. color: #f3f3f3;
  1437. fill: #f3f3f3;
  1438. background-color: #1f1f1f;
  1439. }
  1440. .social-gtranslate-list--desktop.open > a:after {
  1441. color: #f3f3f3;
  1442. }
  1443. .social-gtranslate-list--desktop.open > a .select-icon {
  1444. fill: #f3f3f3;
  1445. }
  1446. .social-gtranslate-list--desktop.open > a:focus, .social-gtranslate-list--desktop.open > a:hover {
  1447. color: #f3f3f3;
  1448. fill: #f3f3f3;
  1449. background-color: #1f1f1f;
  1450. }
  1451. .social-gtranslate-list--desktop.open > a:focus:after, .social-gtranslate-list--desktop.open > a:hover:after {
  1452. color: #f3f3f3;
  1453. }
  1454. .social-gtranslate-list--desktop.open > a:focus .select-icon, .social-gtranslate-list--desktop.open > a:hover .select-icon {
  1455. fill: #f3f3f3;
  1456. }
  1457. #sliding-popup {
  1458. background-color: #1f7ea7 !important;
  1459. }
  1460. .marker-cluster-small,
  1461. .marker-cluster-small div {
  1462. background-color: #1f80aa;
  1463. }
  1464. .marker-cluster div {
  1465. font-weight: bold;
  1466. color: #f9f9f9;
  1467. font-size: 1.2em;
  1468. }
  1469. .geolocation-map-container {
  1470. z-index: 5;
  1471. }
  1472. .leaflet-popup-content .card__text > a {
  1473. color: #33b5e5;
  1474. }
  1475. .leaflet-popup-content .card__text > a:after {
  1476. color: #33b5e5;
  1477. }
  1478. .card__featured-items .teaser__info svg {
  1479. color: #29abe2;
  1480. fill: #29abe2;
  1481. }
  1482. .card__featured-items .teaser__info svg:hover, .card__featured-items .teaser__info svg:focus, .card__featured-items .teaser__info svg:active {
  1483. color: #ffc142;
  1484. fill: #ffc142;
  1485. }
  1486. .course__navigation .course_nav-title,
  1487. .course__navigation .course_nav-toggle,
  1488. .course__navigation .course_dividing-line {
  1489. color: #29abe2;
  1490. }
  1491. .course__navigation .course_nav-title .icon {
  1492. background: #29abe2;
  1493. }
  1494. .course__navigation .course_nav-title:hover, .course__navigation .course_nav-title:active, .course__navigation .course_nav-title:focus {
  1495. color: #ffc142;
  1496. }
  1497. .course__navigation .course_nav-title:hover .icon, .course__navigation .course_nav-title:active .icon, .course__navigation .course_nav-title:focus .icon {
  1498. background: #ffc142;
  1499. }
  1500. .course__navigation .course_nav-toggle svg {
  1501. fill: #29abe2;
  1502. }
  1503. .course__navigation .course_nav-toggle:hover, .course__navigation .course_nav-toggle:active, .course__navigation .course_nav-toggle:focus {
  1504. color: #ffc142;
  1505. }
  1506. .course__navigation .course_nav-toggle:hover svg, .course__navigation .course_nav-toggle:active svg, .course__navigation .course_nav-toggle:focus svg {
  1507. fill: #ffc142;
  1508. }
  1509. .badge.badge-active {
  1510. background-color: #ffc142;
  1511. }
  1512. .phase.phase-past:not(:last-child):before {
  1513. background-color: #ffc142;
  1514. }
  1515. .phase.phase-past .phase-past--icon .checkmark-icon {
  1516. fill: #ffc142;
  1517. }
  1518. .phase.phase-active:before {
  1519. background-color: #ffc142;
  1520. }
  1521. .phase .teaser__tag {
  1522. color: #29abe2;
  1523. }
  1524. .phase .teaser__tag a:hover, .phase .teaser__tag a:active, .phase .teaser__tag a:focus {
  1525. color: #ffc142;
  1526. }
  1527. .phase.path-group .cover-wrap .teaser__tag {
  1528. background-color: #29abe2;
  1529. color: #fff;
  1530. }
  1531. .phase .badge-primary {
  1532. background: #29abe2;
  1533. }
  1534. .phase .hero__banner-static .hero__tag {
  1535. color: #29abe2;
  1536. }
  1537. .phase .hero__banner-static .hero__tag a,
  1538. .phase .hero__banner-static .hero__tag span {
  1539. color: #29abe2;
  1540. }
  1541. .phase .hero__banner-static .hero__tag a:hover, .phase .hero__banner-static .hero__tag a:active, .phase .hero__banner-static .hero__tag a:focus {
  1542. color: #ffc142;
  1543. }
  1544. .phase .navbar-secondary .navbar-nav .hidden-list li a:hover, .phase .navbar-secondary .navbar-nav .hidden-list li a.active, .phase .navbar-secondary .navbar-nav .hidden-list li a:focus, .phase .navbar-secondary .navbar-nav .hidden-list li a.is-active {
  1545. color: #29abe2;
  1546. }
  1547. .teaser--tile.teaser-profile .teaser__image {
  1548. background-color: #29abe2;
  1549. }
  1550. @media (min-width: 600px) {
  1551. .teaser__image {
  1552. border-top-left-radius: inherit;
  1553. border-bottom-left-radius: inherit;
  1554. background: #e6e6e6;
  1555. }
  1556. .teaser__teaser-type {
  1557. background-color: rgba(0, 0, 0, 0.5);
  1558. border-radius: 0 0 10px 0;
  1559. }
  1560. .cover .hero-avatar {
  1561. border-width: 3px;
  1562. }
  1563. }
  1564. @media (min-width: 900px) {
  1565. .search-take-over .form-text {
  1566. color: #ffffff;
  1567. }
  1568. .search-take-over .form-text:focus {
  1569. border-color: #ffffff;
  1570. box-shadow: 0 2px 0 0 #ffffff;
  1571. }
  1572. .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
  1573. border-bottom: 2px solid #29abe2;
  1574. }
  1575. .search-take-over .form-text {
  1576. color: #ffffff;
  1577. }
  1578. .search-take-over .form-text:focus {
  1579. border-color: #ffffff;
  1580. box-shadow: 0 2px 0 0 #ffffff;
  1581. }
  1582. .btn--close-search-take-over svg,
  1583. .search-take-over svg {
  1584. fill: #ffffff;
  1585. }
  1586. }
  1587. @media (max-width: 599px) {
  1588. .navbar-default .navbar-nav .open .dropdown-menu > li > a {
  1589. color: #ffffff;
  1590. }
  1591. .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
  1592. color: #e6e6e6;
  1593. background-color: #1a8dbe;
  1594. }
  1595. .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
  1596. color: #f3f3f3;
  1597. background-color: #1f1f1f;
  1598. }
  1599. .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
  1600. color: #ccc;
  1601. background-color: transparent;
  1602. }
  1603. .dropdown.has-alert > a:before {
  1604. background-color: #ffc142;
  1605. }
  1606. }
  1607. @media (max-width: 899px) {
  1608. .navbar-collapse .dropdown-menu li a {
  1609. color: #ffffff;
  1610. }
  1611. .navbar-collapse .dropdown-menu li a:hover, .navbar-collapse .dropdown-menu li a:focus {
  1612. background-color: #1f80aa;
  1613. }
  1614. .navbar-default .navbar-nav .open .dropdown-menu > li > a {
  1615. color: #4d4d4d;
  1616. }
  1617. .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
  1618. color: #404040;
  1619. background-color: #f5f5f5;
  1620. }
  1621. .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
  1622. color: #ffffff;
  1623. background-color: #1f80aa;
  1624. }
  1625. .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
  1626. color: #4d4d4d;
  1627. background-color: #777;
  1628. }
  1629. .navbar-collapse .dropdown-menu li a {
  1630. color: #ffffff;
  1631. }
  1632. .navbar-collapse .dropdown-menu li a:hover, .navbar-collapse .dropdown-menu li a:focus {
  1633. color: #f3f3f3;
  1634. background-color: #1f1f1f;
  1635. }
  1636. }