www.aleph1.co.uk Git - yaffs-website/blob - web/modules/contrib/slick/css/components/slick.arrows--down.css

   1 /**
   2  * @file
   3  */
   4
   5 .slick--has-arrow-down > .slick__arrow {
   6   bottom: 20px;
   7   height: 62px;
   8   left: 50%;
   9   margin: 0 0 0 -90px;
  10   top: auto;
  11   width: 180px;
  12 }
  13
  14 .slick-down {
  15   background: #ff6d2c;
  16   border: 0;
  17   border-radius: 50%;
  18   cursor: pointer;
  19   display: none;
  20   font-size: 0;
  21   height: 48px;
  22   left: 50%;
  23   margin-left: -24px;
  24   pointer-events: auto;
  25   position: absolute;
  26   top: 50%;
  27   -webkit-transform: translateY(-50%);
  28   transform: translateY(-50%);
  29   width: 48px;
  30 }
  31
  32 .slick-initialized ~ .slick__arrow .slick-down {
  33   display: block;
  34 }
  35
  36 .slick-down:active,
  37 .slick-down:focus {
  38   box-shadow: none;
  39   outline: 0;
  40 }
  41
  42 .slick-down::before,
  43 .slick-down::after {
  44   pointer-events: none;
  45 }
  46
  47 /* Pure CSS arrow down, override by icon font accordingly */
  48 .slick-down:hover {
  49   background: #37465b;
  50 }
  51
  52 .slick-down::before,
  53 .slick-down::after {
  54   border-right: 3px solid;
  55   color: #fff;
  56   content: '';
  57   display: block;
  58   height: 16px;
  59   margin-top: -6px;
  60   position: absolute;
  61   -ms-transform: rotate(135deg);
  62   -webkit-transform: rotate(135deg);
  63   transform: rotate(135deg);
  64   right: 28px;
  65   top: 50%;
  66   width: 0;
  67 }
  68
  69 .slick-down::after {
  70   right: 18px;
  71   -ms-transform: rotate(45deg);
  72   -webkit-transform: rotate(45deg);
  73   transform: rotate(45deg);
  74 }
  75
  76 .slick-down:hover::before,
  77 .slick-down:hover::after {
  78   color: #fff;
  79 }
  80
  81 @media (min-width: 64em) {
  82   .slick--has-arrow-down .slide--caption--bottom .slide__caption {
  83     padding-bottom: 80px;
  84   }
  85 }