.survey { max-width: 630px; margin-left: auto; margin-right: auto; }
.survey > .block-inner { background-color: #ebe4e6; border: 1px solid #b3b3b3; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; padding: 20px; margin-left: 15px; margin-right: 15px; }
@media (min-width: 992px) { .survey > .block-inner { padding: 50px; padding-bottom: 0; } }
.survey, .survey * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.survey .webform-client-form { padding: 0 0 50px 0; background-color: transparent; border: none; }
* + .survey { margin-top: 80px; }
.survey .block-title { color: #0085c4; }
.survey .block-title ~ .content { margin-top: 30px; }
.survey .webform-component ~ .webform-component { margin-top: 30px; }
.js .survey .webform-component ~ .webform-component, .js .survey .form-actions > .form-submit { display: none; }
.survey .webform-component { display: -ms-flexbox; display: -webkit-flex; display: flex; -ms-flex-direction: column; -webkit-flex-direction: column; flex-direction: column; }
.survey .webform-component > div { -ms-flex-order: 3; order: 3; margin-top: 15px; }
.survey .webform-component > .description { -ms-flex-order: 1; order: 1; margin-top: 0; }
.survey .webform-component > label { -ms-flex-order: 2; order: 2; font-weight: 600; font-size: 17px; line-height: 1.5; margin-top: 15px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.survey .description { color: #0085c4; text-transform: uppercase; font-weight: 600; }
.survey-is-continued .survey > .block-inner { position: fixed; top: 50%; left: 50%; -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); max-height: 95vh; overflow-y: scroll; z-index: 499; margin: 0; width: 90%; max-width: 630px; -moz-box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); }
@media (min-width: 992px) { .survey-is-continued .survey > .block-inner { max-height: 90vh; } }
.survey-is-continued .survey > .block-inner .webform-component ~ .webform-component { display: -ms-flexbox; display: -webkit-flex; display: flex; }
.survey-is-continued .survey > .block-inner .form-actions > .form-submit { display: inline-block; }
.survey .form-textarea { max-height: 150px; outline: none; padding: 8px; }
.survey .form-textarea:focus { outline: none; background-color: rgba(0, 133, 196, 0.05); border-color: #0085c4; box-shadow: none; }
.survey .form-actions > .form-submit { background: #0085c4; border: 1px #0085c4 solid; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; padding: 10px 25px 12px 25px; color: white; text-shadow: none; font-size: 24px; line-height: 1; text-transform: uppercase; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.survey .form-actions > .form-submit:hover, .survey .form-actions > .form-submit:focus { background: #0074ab; }
.survey .form-type-radio { position: relative; overflow: hidden; }
.survey .form-type-radio ~ .form-type-radio { margin-top: 10px; margin-left: 0 !important; display: block !important; }
.survey .form-type-radio input { position: absolute; left: -200px; height: 1px; }
.survey .form-type-radio label { line-height: 1; cursor: pointer; margin-left: 2px; margin-top: 2px; margin-bottom: 2px; }
.survey .form-type-radio label:before { content: ''; width: 12px; height: 12px; display: inline-block; border-radius: 50%; vertical-align: middle; margin-right: 8px; border: 1px solid #b3b3b3; -moz-transform: translateY(-2px); -ms-transform: translateY(-2px); -webkit-transform: translateY(-2px); transform: translateY(-2px); }
.survey .form-type-radio input:checked + label:before { background-color: #0085c4; border-color: white; box-shadow: 0 0 3px #0085c4; }
.survey-is-done .survey { display: none; }

.survey__continue { background: #0085c4; border: 1px #0085c4 solid; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; padding: 10px 25px 15px 25px; color: white; text-shadow: none; font-family: "Steelfish", "Fjalla One", arial, sans-serif; font-size: 30px; line-height: 1; text-transform: uppercase; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
.survey__continue:hover, .survey__continue:focus { background: #0074ab; }
.survey-is-continued .survey__continue { display: none; }

.survey__close { display: none; position: absolute; top: 14px; right: 14px; z-index: 100; height: 24px; width: 24px; border: none; text-indent: -5000px; background: url('../../images/close.svg') no-repeat center; background-size: 24px 100%; }
.survey-is-continued .survey__close { display: block; }
.survey__close:hover, .survey__close:focus { opacity: .75; }

.survey-is-continued:before { content: ''; position: fixed; background-color: #f4f1f2; top: 0; left: 0; width: 100%; height: 100%; z-index: 100; display: block; }

.survey-is-continued { overflow: hidden; width: 100vw; height: 100vh; }
.survey-is-continued .nav-wrapper { z-index: 1; }

.survey__countdown { display: none; }
.survey-is-continued .survey__countdown { display: block; }

.survey__trigger { padding: 20px 20px 16px 20px; margin: 0; position: fixed; bottom: 0; left: 0; width: 100%; background: #0085c4; border-color: #0085c4; -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; color: white; text-align: center; text-shadow: none; font-family: "Steelfish", "Fjalla One", arial, sans-serif; font-size: 28px; line-height: 1.2; text-transform: uppercase; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -moz-transition: opacity 0.3s ease; -o-transition: opacity 0.3s ease; -webkit-transition: opacity 0.3s ease; transition: opacity 0.3s ease; z-index: 499; }
.survey__trigger, .survey__trigger * { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
@media (min-width: 992px) { .survey__trigger { line-height: 1; } }
.survey-is-continued .survey__trigger, .survey__trigger.hide { opacity: 0; z-index: -100; }
.survey__trigger > span { cursor: pointer; }
.survey__trigger > span:hover, .survey__trigger > span:focus { color: rgba(255, 255, 255, 0.8); }
.survey__trigger svg { vertical-align: middle; -moz-transform: translateY(-3px); -ms-transform: translateY(-3px); -webkit-transform: translateY(-3px); transform: translateY(-3px); margin: 0 15px 0 0; display: none; }
@media (min-width: 992px) { .survey__trigger svg { display: inline-block; margin: 0 15px; } }
.survey__trigger > svg { display: inline-block; }
.survey-is-done .survey__trigger { display: none; }