You are here

preview.css in Open Social 8.4

@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;
  -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
          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: #777;
}

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

.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;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

.badge-danger {
  background-color: #d9534f;
  color: #fff;
  -webkit-transition: 0.3s;
  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: transparent;
  border-color: transparent;
  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: transparent;
  border-color: transparent;
  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: #777;
  font-weight: 500;
}

.secondary-col .card__title,
.secondary-col .card__actionbar,
.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;
}

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

.form-control:focus {
  border-color: #29abe2;
  outline: 0;
  -webkit-box-shadow: 0 2px 0 0 #29abe2;
          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;
}

input[type='range']::-webkit-slider-thumb {
  background: #1d789e;
  border: 2px solid #1d789e;
}

input[type='range']::-ms-thumb {
  background: #1d789e;
  border: 2px solid #1d789e;
}

input[type='range']::-moz-range-thumb {
  background: #1d789e;
  border: 2px solid #1d789e;
}

[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 {
  -webkit-box-shadow: 0 0 3px 2px #56bde8;
          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% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}

@keyframes scale-form-control {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
            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 {
  -webkit-box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.4), 0 0 0 15px rgba(29, 120, 158, 0.1);
          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 {
  -webkit-box-shadow: 0 2px 0 0 #a94442;
          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: -webkit-gradient(linear, left top, right top, from(rgba(31, 128, 170, 0)), to(#1f80aa));
  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;
}

.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;
}

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

.page-title {
  color: white;
}

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

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

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

.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 {
  -webkit-box-shadow: 0 2px 0 0 #1f80aa;
          box-shadow: 0 2px 0 0 #1f80aa;
}

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

.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),
.body-text a:not(.btn) {
  text-decoration: underline;
  color: #33b5e5;
}

.field--name-field-introduction-text 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 {
  -webkit-box-shadow: 0 0 3px 2px #29abe2;
          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 {
  -webkit-box-shadow: 0 2px 0 0 #1f80aa;
          box-shadow: 0 2px 0 0 #1f80aa;
}

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

.form-control:focus {
  border-color: #29abe2;
  -webkit-box-shadow: 0 2px 0 0 #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;
}

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

.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: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.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: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
  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: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
  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: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
  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: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
  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: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.2)), to(rgba(0, 0, 0, 0.2)));
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2) 0%, rgba(0, 0, 0, 0.2) 100%);
}

.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,
.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;
  -webkit-box-shadow: 0 2px 0 0 #29abe2;
          box-shadow: 0 2px 0 0 #29abe2;
}

.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: -webkit-gradient(linear, left top, right top, from(#1f7ea7), to(transparent));
  background: linear-gradient(90deg, #1f7ea7, transparent);
}

.navbar-scrollable:after {
  background: -webkit-gradient(linear, right top, left top, from(#1f7ea7), to(transparent));
  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;
}

.navbar-nav__icon {
  fill: #ffffff;
}

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

.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;
}

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