/* This file will hold styles for the mobile version of your website (mobile first). */
/* This also can include ANY global CSS that applies site-wide. Unless overwritten by a more specific style rule, CSS declarations in global.css will apply site-wide. */
.node .checklist-link, .detail h3, .detail h4, .detail h5, .field-name-field-audience, .field-name-field-video > .label-inline, .field-name-field-slider-small-preface, .node-showcase .field-name-body h2, .node-showcase .field-name-body h3, .node-showcase .field-name-body h4, .related > h5 { font-family: 'GibsonLightBold'; font-weight: normal; }

.node-showcase, .node-showcase * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

.banner { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; margin-top: 2vh; }
@media (min-width: 980px) { .banner { -ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; -ms-align-items: stretch; -webkit-align-items: stretch; align-items: stretch; margin-top: 0; } }
@media (min-width: 980px) { .banner > .field-name-field-banner-image { width: 66.66667%; }
  .banner > .field-name-field-banner-image + .field { width: 33.33333%; border-left: 10px #de6e1d solid; } }
.banner > .field-name-field-banner-image > img { max-width: 100%; height: auto; width: 100%; }
@media (min-width: 980px) { .banner > .field-name-field-banner-image > img { width: auto; } }
.banner > .field-name-field-meta { padding: 20px; color: white; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuMCIgeTE9IjAuNSIgeDI9IjEuMCIgeTI9IjAuNSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzI0NTQ3MyIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzM2NzJhNyIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #245473), color-stop(100%, #3672a7)); background-image: -moz-linear-gradient(left, #245473, #3672a7); background-image: -webkit-linear-gradient(left, #245473, #3672a7); background-image: linear-gradient(to right, #245473, #3672a7); display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; -ms-align-items: center; -webkit-justify-content: center; justify-content: center; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: 'GibsonRegular', sans-serif; font-size: 1.75rem; line-height: 1.15; text-align: center; }
.banner > .field-name-field-meta:after { content: ''; width: 200px; display: block; height: 58px; margin-left: auto; margin-right: auto; margin-top: 20px; background: url('../images/eqc-fixfasten-logo--white.svg') no-repeat center; background-size: 100% auto; }
@media (min-width: 980px) { .banner > .field-name-field-meta { padding: 40px; text-align: left; }
  .banner > .field-name-field-meta:after { margin-top: 50px; width: 100%; } }
.banner + * { margin-top: 2rem; }

.node .checklist-link { border: 1px #de6e1d solid; text-align: center; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-transform: uppercase; color: #1C5072; line-height: 1.2; margin-bottom: 1rem; margin-top: 1rem; display: block; padding: 20px !important; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; font-size: 1.1rem; cursor: pointer; }
@media (min-width: 740px) { .node .checklist-link { float: right; max-width: 24%; margin-left: 1.5rem; margin-bottom: 1.5rem; } }
.node .checklist-link span { -ms-flex-order: 1; -webkit-order: 1; order: 1; white-space: nowrap; text-overflow: ellipsis; }
.node .checklist-link .field { -ms-flex-order: 2; -webkit-order: 2; order: 2; font-size: .9rem; }
.node .checklist-link label { -ms-flex-order: 3; -webkit-order: 3; order: 3; cursor: pointer; }
.node .checklist-link label ~ .field { margin-bottom: .25rem; }
.node .checklist-link .label-above { color: #de6e1d; -ms-flex-order: 2; -webkit-order: 2; order: 2; }
.node .checklist-link:hover, .node .checklist-link:focus { background-color: #1C5072 !important; border-color: #1C5072; }
.node .checklist-link:hover *, .node .checklist-link:focus * { color: white; }

.cinema { background-color: #333333; }
.cinema video { width: 100%; height: auto; vertical-align: top; }

.detail { position: relative; /*
details[open] { > summary { position: absolute; bottom: 0; left: 0;  &:before {  } }  > .field { padding-bottom: 60px; // space for the button }
}*/ }
.logged-in .detail:before { content: "Link to #" attr(id); color: red; font-size: 11px; position: absolute; top: -20px; }
.detail ~ .detail { margin-top: 3rem; }
.detail > .group-left { -ms-flex-order: 1; -webkit-order: 1; order: 1; float: right; margin-left: 1rem; margin-bottom: 1rem; width: 25vw; }
.detail > .group-right { -ms-flex-order: 2; -webkit-order: 2; order: 2; position: relative; }
.detail > .group-right:before { content: ''; position: absolute; top: 0; left: -25px; width: 6px; height: 100%; background-color: #f0f1f1; }
@media (min-width: 740px) { .detail > .group-left { width: 20%; margin-left: 5%; margin-bottom: 20px; } }
.detail .field-name-field-slider-image { -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; position: relative; background-color: #de6e1d; height: auto; max-width: 100%; }
@media (min-width: 740px) { .detail .field-name-field-slider-image { float: right; } }
.detail .field-name-field-slider-image > img { vertical-align: top; width: 100%; height: auto; }
.detail h3, .detail h4, .detail h5 { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; color: #1C5072; margin: 0; }
.detail h3 + *, .detail h4 + *, .detail h5 + * { margin-top: 1rem; }
.detail h3 { font-size: 1.6rem; }
.detail h4 { font-size: 1.3rem; }
.detail h5 { font-size: 1.15rem; color: #555; }
.detail h5 + * { margin-top: 0.5em !important; }
.detail ul { line-height: 1.625 !important; }
.detail summary, .detail .detail__summary { border: 1px #0085C2 solid; color: #0085C2; padding: 10px; line-height: 1; display: inline-block; cursor: pointer; }
.detail summary + .field, .detail .detail__summary + .field { margin-top: 1rem; }
.detail summary:before, .detail .detail__summary:before { content: ''; background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%207%204%22%20width%3D%227%22%20height%3D%224%22%3E%3Cpath%20d%3D%22M0%2C.5V0H.5l3%2C3%2C3-3H7V.5L3.5%2C4Z%22%20style%3D%22fill%3A%230062a0%22%2F%3E%3C%2Fsvg%3E'); background-repeat: no-repeat; background-position: center; background-size: 100% auto; width: 12px; height: 6px; display: inline-block; margin-right: 6px; vertical-align: middle; margin-top: -3px; -moz-transition: -moz-transform 0.2s ease; -o-transition: -o-transform 0.2s ease; -webkit-transition: -webkit-transform 0.2s ease; transition: transform 0.2s ease; }
.no-touch .detail summary:hover, .no-touch .detail .detail__summary:hover { background-color: #0085C2; color: white; }
.no-touch .detail summary:hover:before, .no-touch .detail .detail__summary:hover:before { background-image: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%207%204%22%20width%3D%227%22%20height%3D%224%22%3E%3Cpath%20d%3D%22M0%2C.5V0H.5l3%2C3%2C3-3H7V.5L3.5%2C4Z%22%20style%3D%22fill%3A%23ffffff%22%2F%3E%3C%2Fsvg%3E'); }
.detail details { position: relative; }
html.no-details .detail details > .field, html.no-details .detail details > .detail__summary { display: none; }
html.no-details .detail details[open] > * { display: block; }
.detail details[open] > summary:before, .detail details[open] > .detail__summary:before { -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); }
.detail * + .detail__summary { margin-top: 2rem; }

details summary::-webkit-details-marker { display: none; }

.feature { position: relative; overflow: hidden; }
* + .feature { margin-top: 2rem; }
.feature.full-screen { margin: 0; }
.feature button:focus { outline: none !important; box-shadow: none !important; }

.node .field-name-body > *, .node .field-name-field-body > * { margin: 0; }
.node .field-name-body > * + *, .node .field-name-field-body > * + * { margin-top: 1em; }
.node-showcase > .field + .field-name-body, .node-showcase > .field + .field-name-field-body { margin-top: 0.5rem; }

.node-showcase > .field-name-field-detail-nodes + .field-name-field-body { margin-top: 2rem; }

.field-name-field-audience { color: #de6e1d; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-transform: uppercase; font-size: .85rem; }
* + .field-name-field-audience { margin-top: .5rem; }
.banner + .field-name-field-audience { margin-top: 2rem; }

.field-name-field-video > img, .field-name-field-splash-image > img { max-width: 100%; height: auto; }

.field-name-html5-video + .field-name-field-splash-image { display: none; }

.field-name-field-video > .label-inline { position: absolute; width: 30%; bottom: 0; padding: 15px; background-color: #de6e1d; color: white; line-height: 1; text-transform: uppercase; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.field-name-field-video > video { width: 100%; height: auto; }

.field-name-field-slider-small-preface { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size: 1.3rem; text-align: left; transition: all .4s ease; }
.field + .field-name-field-slider-small-preface { width: 100%; z-index: 10; background-color: #333333; color: white; padding: 20px; }
@media (min-width: 740px) { .field + .field-name-field-slider-small-preface { position: absolute; bottom: 0px; padding: 0 72px 22px 50px; display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; -ms-align-items: center; -webkit-align-items: center; align-items: center; background-color: transparent; background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzAwMDAwMCIgc3RvcC1vcGFjaXR5PSIwLjAiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC43NSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA=='); background-size: 100%; background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.75))); background-image: -moz-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75)); background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75)); background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75)); } }
.field-name-field-slider-small-preface .btn { white-space: nowrap; cursor: pointer; font-size: 1.2rem; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; line-height: 1; width: 100%; display: none; }
@media (min-width: 740px) { .field-name-field-slider-small-preface .btn { margin-left: auto; margin-right: auto; width: auto; display: inline-block; }
  .field-name-field-slider-small-preface .btn + .video__caption { margin-left: 35px; width: 100%; } }
.field-name-field-slider-small-preface .btn:before { content: ''; width: 30px; height: 30px; border: 1px white solid; -moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; background: url('data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2040.38%2044.42%22%20width%3D%2240%22%20height%3D%2244%22%3E%3Cpath%20d%3D%22M1.44%2C44a2.86%2C2.86%2C0%2C0%2C0%2C1.44.42A2.86%2C2.86%2C0%2C0%2C0%2C4.33%2C44L38.94%2C24.57a2.85%2C2.85%2C0%2C0%2C0%2C1.44-2.36%2C2.67%2C2.67%2C0%2C0%2C0-1.44-2.36L4.33.42a2.71%2C2.71%2C0%2C0%2C0-2.88%2C0A2.85%2C2.85%2C0%2C0%2C0%2C0%2C2.78V41.65A2.67%2C2.67%2C0%2C0%2C0%2C1.44%2C44Z%22%20style%3D%22fill%3A%23fff%22%2F%3E%3C%2Fsvg%3E') no-repeat 55% center; background-size: 38% auto; display: inline-block; margin-right: .75em; vertical-align: middle; }
.field-name-field-slider-small-preface .video__caption { line-height: 1.25; }
@media (min-width: 740px) { .field-name-field-slider-small-preface .video__caption { max-width: 600px; } }
@media (min-width: 740px) { .feature--playing .field-name-field-slider-small-preface { opacity: 0; transform: translateY(100%); } }

.field-name-field-video ~ .field-name-field-slider-small-preface { text-align: left; width: 70%; right: 0; }

* + .field-name-field-detail-nodes, .field-name-field-detail-nodes + * { margin-top: 3rem; }

.flexgrid { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; }
.flexgrid, .flexgrid * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
@media (min-width: 740px) { .flexgrid { -ms-flex-direction: row; -webkit-flex-direction: row; flex-direction: row; margin-left: -20px !important; margin-right: -20px !important; } }

.node ul.flexgrid { padding: 0; list-style: none; }

.flexgrid--3 > li { margin-top: 2rem; }
.flexgrid--3 > li:nth-child(-n+1) { margin-top: 0; }
@media (min-width: 740px) { .flexgrid--3 > li { width: 50%; padding-left: 20px; padding-right: 20px; }
  .flexgrid--3 > li:nth-child(-n+2) { margin-top: 0; } }
@media (min-width: 980px) { .flexgrid--3 > li { width: 33.33333%; }
  .flexgrid--3 > li:nth-child(-n+3) { margin-top: 0; } }

.node-type-showcase .region-content-inner > .block:last-child { margin-bottom: 2rem; }
.node-type-showcase .region-content-inner > .block.block-system ~ .block { margin-top: 2rem; }

.node-showcase .field-name-body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.node-showcase .field-name-body .intro { font-size: 1.6em; line-height: 1.6; color: #1C5072; font-family: 'GibsonRegular'; margin: 0; }
.node-showcase .field-name-body .intro + * { margin-top: .75rem; }
.node-showcase .field-name-body * + .intro { margin-top: .75rem; }
.node-showcase .field-name-body h2, .node-showcase .field-name-body h3, .node-showcase .field-name-body h4 { color: #333333; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.node-showcase .field-name-body h2 { font-size: 23px; }
.node-showcase .field-name-body h3 { font-size: 20px; }
.node-showcase .field-name-body h4 { font-size: 16px; }
.node-showcase.teaser .field-name-field-teaser-image + .field-name-field-banner-image { display: none; }
.node-showcase > .group-link { display: block; }
.node-showcase > .group-link:hover > h2, .node-showcase > .group-link:focus > h2 { color: #de6e1d; }
.node-showcase .field-name-field-body h2 { color: #1C5072; font-size: 1.6rem; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.showcase.teaser--short, .showcase.teaser--short * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.showcase.teaser--short img { padding: 0; border: none; float: none; }
.showcase.teaser--short .field-name-field-teaser-image { position: relative; }
.showcase.teaser--short .field-name-field-teaser-image:after { content: ''; position: absolute; bottom: 0; width: 0; left: 0; height: 4%; background-color: #de6e1d; -moz-transition: width 0.4s ease; -o-transition: width 0.4s ease; -webkit-transition: width 0.4s ease; transition: width 0.4s ease; }
.showcase.teaser--short h3 { color: #1C5072; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-family: 'GibsonRegular'; margin: 0; }
.showcase.teaser--short h3 + h3 { display: none; }
.showcase.teaser--short .field + h3 { margin-top: .2rem; }
.showcase.teaser--short .field-name-field-teaser-image + h3 { margin-top: 1rem; }
.showcase.teaser--short a:hover h3, .showcase.teaser--short a:focus h3 { color: #de6e1d; }
.showcase.teaser--short a:hover .field-name-field-teaser-image:after, .showcase.teaser--short a:focus .field-name-field-teaser-image:after { width: 100%; }

.vocabulary-partner-links { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.vocabulary-partner-links .taxonomy-term-description { margin: 0; }
.vocabulary-partner-links .taxonomy-term-description > * { margin: 0; line-height: 1.6; }
.vocabulary-partner-links .taxonomy-term-description > * ~ * { margin-top: .5em; }
.vocabulary-partner-links .taxonomy-term-description + * { margin-top: .5rem; }
.vocabulary-partner-links .field-name-title { font-size: 1.3rem; font-family: 'GibsonRegular', sans-serif; }
.vocabulary-partner-links .field-name-title + * { margin-top: .5rem; }

.vocabulary-partner-links > .group-link { display: block; padding: 0 !important; background: none !important; }

* + .related { margin-top: 3rem; }
.related > h5 { color: #1C5072; margin: 0; font-size: 1.4rem; border-bottom: 1px #979797 solid; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.related > h5 + ul { margin-top: 1.5rem; }

@media (min-width: 980px) { .node-showcase.view-mode-full > h1, .node-showcase.view-mode-full > .field-name-body, .node-showcase.view-mode-full > .field-name-field-body, .node-showcase.view-mode-full > .field-name-field-audience, .node-showcase.view-mode-full .field-name-field-detail-nodes { max-width: 66.66667%; margin-left: auto; margin-right: auto; } }
.survey > .block-inner { display: none; }
.survey-is-continued .survey > .block-inner { display: block; }

.survey > .block-title { text-transform: uppercase; font-size: 1.5rem; }

.survey .form-actions { margin: 0 !important; }
.survey .form-actions > .form-submit { font-size: 1.1rem; }

.full-screen-is-active .survey__trigger { z-index: 1; }

.block + .block .view-display-id-listing { margin-top: 2rem; }
