--- /dev/null
+/**
+ * @file
+ */
+
+.slick--has-arrow-down > .slick__arrow {
+ bottom: 20px;
+ height: 62px;
+ left: 50%;
+ margin: 0 0 0 -90px;
+ top: auto;
+ width: 180px;
+}
+
+.slick-down {
+ background: #ff6d2c;
+ border: 0;
+ border-radius: 50%;
+ cursor: pointer;
+ display: none;
+ font-size: 0;
+ height: 48px;
+ left: 50%;
+ margin-left: -24px;
+ pointer-events: auto;
+ position: absolute;
+ top: 50%;
+ -webkit-transform: translateY(-50%);
+ transform: translateY(-50%);
+ width: 48px;
+}
+
+.slick-initialized ~ .slick__arrow .slick-down {
+ display: block;
+}
+
+.slick-down:active,
+.slick-down:focus {
+ box-shadow: none;
+ outline: 0;
+}
+
+.slick-down::before,
+.slick-down::after {
+ pointer-events: none;
+}
+
+/* Pure CSS arrow down, override by icon font accordingly */
+.slick-down:hover {
+ background: #37465b;
+}
+
+.slick-down::before,
+.slick-down::after {
+ border-right: 3px solid;
+ color: #fff;
+ content: '';
+ display: block;
+ height: 16px;
+ margin-top: -6px;
+ position: absolute;
+ -ms-transform: rotate(135deg);
+ -webkit-transform: rotate(135deg);
+ transform: rotate(135deg);
+ right: 28px;
+ top: 50%;
+ width: 0;
+}
+
+.slick-down::after {
+ right: 18px;
+ -ms-transform: rotate(45deg);
+ -webkit-transform: rotate(45deg);
+ transform: rotate(45deg);
+}
+
+.slick-down:hover::before,
+.slick-down:hover::after {
+ color: #fff;
+}
+
+@media (min-width: 64em) {
+ .slick--has-arrow-down .slide--caption--bottom .slide__caption {
+ padding-bottom: 80px;
+ }
+}