/* quick dive
   ============================ */

.quick-dive {
    background: #f7f7f7;
}
.quick-dive .select {
    width: calc(27.08% - 25px);
    margin-right: 25px;
}
.quick-dive .cta {
    width: 18.75%;
    min-width: 0;
}
.quick-dive .cta .button {
    padding: 14px 15px 15px;
    max-width: 100%;
    width: 100%;
}
.quick-dive.form .wrapper {
    padding-left: 0;
    padding-right: 0;
}
.quick-dive.form .stylish-form .stylish-select.active,
.quick-dive.form .stylish-form .stylish-select.valid {
    background: #21016b;
    -moz-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    -webkit-transition: all 0.6s ease;
    transition: all 0.6s ease;
}
.quick-dive.form .stylish-form .stylish-select > span.selected {
    background: transparent;
    border-color: transparent;
    -moz-transition: color ease-in-out 0.3s;
    -ms-transition: color ease-in-out 0.3s;
    -o-transition: color ease-in-out 0.3s;
    -webkit-transition: color ease-in-out 0.3s;
    transition: color ease-in-out 0.3s;
}
.quick-dive.form .stylish-form .stylish-select.active > span.selected,
.quick-dive.form .stylish-form .stylish-select.valid > span.selected {
    color: #ffffff;
}
.quick-dive.form .stylish-form .stylish-select.valid > span > span.ico {
    border-top-color: #f78e1e;
}
.quick-dive.form .stylish-form .stylish-select > span.selected,
.quick-dive.form .selection .stylish-form .stylish-select > span.selected {
    padding-right: 40px;
}
.hero-banner .quick-dive {
    background: none;
    bottom: 10px;
    left: 0;
    position: absolute;
    width: 100%;
}
#main .quick-dive.form fieldset {
    margin: 0;
}

/* responsive
   ============================ */

@media screen and (max-width: 1200px) {
    .quick-dive.form .wrapper {
        padding-left: 20px;
        padding-right: 20px;
    }
}

@media screen and (max-width: 1024px) {
    .quick-dive.form,
    .hero-banner .quick-dive {
        background: #f7f7f7;
        padding: 0;
    }
    #main .quick-dive.form fieldset {
        margin: 0 -1%;
    }
    .quick-dive .select,
    .quick-dive.form .cta {
        margin-right: 0;
        padding: 0 1%;
        width: 50%;
        max-width: initial;
    }
    .quick-dive .select {
        margin-bottom: 25px;
    }
    .quick-dive.form .cta,
    .quick-dive .select:nth-child(2n+1) {
        margin-bottom: 0;
    }

    .hero-banner .quick-dive {
        bottom: auto;
        position: relative;
    }
    .hero-banner .quick-dive .wrapper {
        padding: 18px 20px;
    }
    .hero-banner .quick-dive .wrapper .select:nth-child(even) {
        margin-right: 0;
    }
    .hero-banner .quick-dive .wrapper .select:last-of-type {
        margin-bottom: 0;
    }
}

@media screen and (max-width: 880px) {
    .quick-dive .select {
        margin-bottom: 15px;
    }
    .quick-dive .cta .button {
        padding: 11px 15px 12px;
    }
}

@media screen and (max-width: 736px) {
    .quick-dive.form .select,
    .quick-dive.form .cta,
    .quick-dive.form .cta .button {
        width: 100%;
        float: none;
    }
    .quick-dive.form .select,
    .quick-dive.form .cta {
        padding: 0;
    }
    .quick-dive.form .select:not(:last-child) {
        margin-bottom: 12px;
    }
    .quick-dive.form .stylish-form .stylish-select > span.selected {
        color: #21016b;
    }
    .hero-banner .quick-dive .wrapper .select:last-of-type {
        margin-bottom: 12px;
    }
    #main .quick-dive.form fieldset {
        margin: 0 auto;
    }
}