/***************************************************************************
*  Style Guide clickdummy styles.
*  NOTE: These styles must be removed from the production build!!!
****************************************************************************/
body.style-guide .page-logo ul, body.style-guide .fonts-example .insight-web-example p:first-child, body.style-guide .footer_title, body.style-guide .navbar .navbar-brand {
  font-family: "Insight Web", Helvetica, Arial, sans-serif;
}

body.style-guide figure.highlight > pre, body.style-guide .list-group .top-item {
  -webkit-transition: all 0.3s linear;
  -o-transition: all 0.3s linear;
  transition: all 0.3s linear;
}

.sixteen-nine {
  position: relative;
  margin-bottom: 20px;
}

.sixteen-nine:before {
  display: block;
  content: '';
  width: 100%;
  padding-top: 56.25%;
}

.sixteen-nine > .content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}

.sixteen-nine > .content > * {
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}

.sixteen-ten {
  position: relative;
  margin-bottom: 20px;
}

.sixteen-ten:before {
  display: block;
  content: '';
  width: 100%;
  padding-top: 62.5%;
}

.sixteen-ten > .content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  overflow: hidden;
}

.sixteen-ten > .content > * {
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
}

.header-container-no-padding {
  padding-top: 0;
  padding-bottom: 0;
}

@-webkit-keyframes loading-dots {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes loading-dots {
  0%, 80%, 100% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  40% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

/**
 * Syntax highlighting styles
 */
body.style-guide pre {
  -webkit-border-radius: 0;
  border-radius: 0;
  margin-bottom: 0;
}

body.style-guide .highlight .c {
  color: #998;
  font-style: italic;
}

body.style-guide .highlight .err {
  color: #a61717;
  background-color: #e3d2d2;
}

body.style-guide .highlight .k {
  font-weight: bold;
}

body.style-guide .highlight .o {
  font-weight: bold;
}

body.style-guide .highlight .cm {
  color: #998;
  font-style: italic;
}

body.style-guide .highlight .cp {
  color: #999;
  font-weight: bold;
}

body.style-guide .highlight .c1 {
  color: #998;
  font-style: italic;
}

body.style-guide .highlight .cs {
  color: #999;
  font-weight: bold;
  font-style: italic;
}

body.style-guide .highlight .gd {
  color: #000;
  background-color: #fdd;
}

body.style-guide .highlight .gd .x {
  color: #000;
  background-color: #faa;
}

body.style-guide .highlight .ge {
  font-style: italic;
}

body.style-guide .highlight .gr {
  color: #a00;
}

body.style-guide .highlight .gh {
  color: #999;
}

body.style-guide .highlight .gi {
  color: #000;
  background-color: #dfd;
}

body.style-guide .highlight .gi .x {
  color: #000;
  background-color: #afa;
}

body.style-guide .highlight .go {
  color: #888;
}

body.style-guide .highlight .gp {
  color: #555;
}

body.style-guide .highlight .gs {
  font-weight: bold;
}

body.style-guide .highlight .gu {
  color: #aaa;
}

body.style-guide .highlight .gt {
  color: #a00;
}

body.style-guide .highlight .kc {
  font-weight: bold;
}

body.style-guide .highlight .kd {
  font-weight: bold;
}

body.style-guide .highlight .kp {
  font-weight: bold;
}

body.style-guide .highlight .kr {
  font-weight: bold;
}

body.style-guide .highlight .kt {
  color: #458;
  font-weight: bold;
}

body.style-guide .highlight .m {
  color: #099;
}

body.style-guide .highlight .s {
  color: #f0ab00;
}

body.style-guide .highlight .na {
  color: #007dc3;
}

body.style-guide .highlight .nb {
  color: #0086B3;
}

body.style-guide .highlight .nc {
  color: #458;
  font-weight: bold;
}

body.style-guide .highlight .no {
  color: #008080;
}

body.style-guide .highlight .ni {
  color: #800080;
}

body.style-guide .highlight .ne {
  color: #900;
  font-weight: bold;
}

body.style-guide .highlight .nf {
  color: #900;
  font-weight: bold;
}

body.style-guide .highlight .nn {
  color: #555;
}

body.style-guide .highlight .nt {
  color: #d65400;
}

body.style-guide .highlight .nv {
  color: #008080;
}

body.style-guide .highlight .ow {
  font-weight: bold;
}

body.style-guide .highlight .w {
  color: #bbb;
}

body.style-guide .highlight .mf {
  color: #099;
}

body.style-guide .highlight .mh {
  color: #099;
}

body.style-guide .highlight .mi {
  color: #099;
}

body.style-guide .highlight .mo {
  color: #099;
}

body.style-guide .highlight .sb {
  color: #d14;
}

body.style-guide .highlight .sc {
  color: #d14;
}

body.style-guide .highlight .sd {
  color: #d14;
}

body.style-guide .highlight .s2 {
  color: #d14;
}

body.style-guide .highlight .se {
  color: #d14;
}

body.style-guide .highlight .sh {
  color: #d14;
}

body.style-guide .highlight .si {
  color: #d14;
}

body.style-guide .highlight .sx {
  color: #d14;
}

body.style-guide .highlight .sr {
  color: #009926;
}

body.style-guide .highlight .s1 {
  color: #d14;
}

body.style-guide .highlight .ss {
  color: #990073;
}

body.style-guide .highlight .bp {
  color: #999;
}

body.style-guide .highlight .vc {
  color: #008080;
}

body.style-guide .highlight .vg {
  color: #008080;
}

body.style-guide .highlight .vi {
  color: #008080;
}

body.style-guide .highlight .il {
  color: #099;
}

body.style-guide figure.highlight > pre {
  padding: 0;
  -webkit-box-shadow: 0 0.3em 0.5em -0.2em rgba(0, 0, 0, 0.24), 0.5em 1em 2em -0.75em rgba(0, 0, 0, 0.24), 1.5em 1em 3em -0.5em rgba(100, 100, 100, 0.25), 0 3em 3em -0.25em rgba(100, 100, 100, 0.12);
  box-shadow: 0 0.3em 0.5em -0.2em rgba(0, 0, 0, 0.24), 0.5em 1em 2em -0.75em rgba(0, 0, 0, 0.24), 1.5em 1em 3em -0.5em rgba(100, 100, 100, 0.25), 0 3em 3em -0.25em rgba(100, 100, 100, 0.12);
  will-change: box-shadow;
}

body.style-guide figure.highlight > pre table pre {
  border: none;
}

body.style-guide figure.highlight > pre table code pre {
  padding: 0;
}

body.style-guide figure.highlight .lineno {
  border-left: none;
  border-top: none;
  border-right: 1px solid #c1c1c1;
  background: #ececec;
  color: #5c5c5c;
  font-weight: bold;
}

.b2b body.style-guide .footer_title {
  color: #007cc1;
}

body.style-guide .survey-teaser:not(:first-child) {
  margin-top: 30px;
}

body.style-guide .page-logo {
  margin-bottom: 40px;
}

body.style-guide .page-logo ul {
  font-weight: bold;
  font-size: 24px;
  display: inline-block;
  padding: 0 0 0 20px;
  margin: 0;
}

body.style-guide .fonts-example {
  padding-top: 40px;
  padding-bottom: 40px;
}

body.style-guide .fonts-example .insight-web-example p:first-child span:first-child {
  font-size: 30px;
}

body.style-guide .fonts-example .insight-web-example p:first-child span:last-child {
  font-size: 16px;
}

body.style-guide .fonts-example .insight-web-example p:nth-child(2) {
  color: #999999;
  font-size: 42px;
}

body.style-guide .fonts-example .arial-example p:first-child span:first-child {
  font-size: 30px;
}

body.style-guide .fonts-example .arial-example p:first-child span:last-child {
  font-size: 16px;
}

body.style-guide .fonts-example .arial-example p:nth-child(2) {
  font-size: 42px;
  padding-top: 7px;
  color: #999999;
  line-height: 57px;
}

body.style-guide .footer_title {
  margin-top: 50px;
  margin-bottom: 50px;
  color: #fff;
  word-break: break-all;
}

body.style-guide .navbar {
  margin-bottom: 50px;
}

body.style-guide .navbar .navbar-brand {
  font-weight: normal;
  font-size: 23px;
}

body.style-guide .position-element-at-top-of-container {
  margin-top: -90px;
}

body.style-guide .content-container {
  background: #ffffff;
  padding-bottom: 90px;
}

body.style-guide .sub-section {
  display: block;
}

body.style-guide .sub-section:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

body.style-guide .sub-section.buttons .btn-default, body.style-guide .sub-section.buttons .btn-primary, body.style-guide .sub-section.buttons .btn-tertiary {
  margin-bottom: 20px;
}

body.style-guide .sub-section.buttons .btn-secondary .btn {
  margin-bottom: 0;
}

body.style-guide .highlight {
  margin-bottom: 40px;
}

body.style-guide .top-margin {
  margin-top: 40px;
}

body.style-guide .page-header {
  margin-bottom: 50px;
}

body.style-guide[class*=section] .section-title {
  margin-top: 0;
  margin-bottom: 50px;
  padding-bottom: 30px;
}

body.style-guide[class*=section] .sub-title {
  color: #777777;
  margin-bottom: 20px;
  margin-top: 35px;
}

body.style-guide .list-group .top-item {
  background: #eeeeee;
  font-weight: bold;
}

body.style-guide .list-group .top-item:hover {
  background: #e7e7e7;
}

body.style-guide .list-group .sub-item {
  padding-left: 35px;
}

body.style-guide .section.interactions .global_search {
  padding: 0;
}

body.style-guide .section.typography .sub-section.headings .list-unstyled {
  margin-top: 30px;
}

body.style-guide .section.colors .sub-section .color > div {
  margin-bottom: 42px;
  padding: 25px 25px 80px;
  color: #ffffff;
}

body.style-guide .section.colors .sub-section .color > div div:first-child {
  font-weight: bold;
}

body.style-guide .section.colors .sub-section .color > div div:nth-child(2) {
  margin-top: 10px;
}

body.style-guide .section.colors .gfk-orange > div {
  padding: 25px 25px 285px 25px !important;
}

body.style-guide .section.colors .b2b-gradient div,
body.style-guide .section.colors .gray-4 div,
body.style-guide .section.colors .gray-5 div,
body.style-guide .section.colors .gray-6 div {
  color: #000;
}

body.style-guide .section.grid .col-inner {
  text-align: center;
  background: #e9ebc2;
  font-size: 16px;
  padding: 20px 0;
  margin-top: 30px;
  font-weight: bold;
  color: #484848;
}

body.style-guide .stage-button-section {
  padding-top: 20px;
  background: #e4e4e4;
}

@media (max-width: 479px) {
  body.style-guide .page-logo ul {
    font-size: 20px;
  }
}

@media (max-width: 991px) {
  body.style-guide .section {
    padding: 50px 0 30px;
  }
  body.style-guide .section .highlight {
    margin-top: 40px;
    margin-bottom: 20px;
  }
}

@media (max-width: 991px) {
  body.style-guide .list-unstyled {
    margin-top: 30px;
  }
}

body.style-guide code {
  background-color: rgba(34, 34, 34, 0.6);
  color: #ffffff;
}

body.style-guide .srcset-debug-label {
  position: absolute;
  background: rgba(255, 255, 255, 0.85);
  color: #333;
  font-size: 12px;
  line-height: 1.5;
  padding: 5px;
  word-break: break-all;
  margin-top: 100px;
}

body.style-guide.homepage .page-title {
  margin-bottom: 50px;
}

.style-switcher {
  background: white;
  position: fixed;
  bottom: 0;
  right: 0;
  -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.25);
  padding: 7px 15px;
  cursor: pointer;
  z-index: 99999;
  -webkit-border-radius: 15px 0 0 0;
  border-radius: 15px 0 0 0;
  border-top: 2px solid rgba(0, 0, 0, 0.35);
  border-left: 2px solid rgba(0, 0, 0, 0.35);
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  font-size: 12px;
}
