fullpage.css 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. /**
  2. * fullPage 1.4.5
  3. * https://github.com/alvarotrigo/fullPage.js
  4. * MIT licensed
  5. *
  6. * Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo
  7. */
  8. html,
  9. body {
  10. margin: 0;
  11. padding: 0;
  12. }
  13. #superContainer {
  14. height: 100%;
  15. position: relative;
  16. }
  17. .section {
  18. position: relative;
  19. -webkit-box-sizing: border-box;
  20. -moz-box-sizing: border-box;
  21. box-sizing: border-box;
  22. }
  23. .slide {
  24. float: left;
  25. }
  26. .slide,
  27. .slidesContainer {
  28. height: 100%;
  29. display: block;
  30. }
  31. .slides {
  32. height: 100%;
  33. overflow: hidden;
  34. position: relative;
  35. -webkit-transition: all 0.3s ease-out;
  36. -moz-transition: all 0.3s ease-out;
  37. -o-transition: all 0.3s ease-out;
  38. transition: all 0.3s ease-out;
  39. }
  40. .section.table,
  41. .slide.table {
  42. display: table;
  43. width: 100%;
  44. }
  45. .tableCell {
  46. display: table-cell;
  47. vertical-align: middle;
  48. width: 100%;
  49. height: 100%;
  50. }
  51. .slidesContainer {
  52. float: left;
  53. position: relative;
  54. }
  55. .controlArrow {
  56. position: absolute;
  57. top: 50%;
  58. cursor: pointer;
  59. width: 0;
  60. height: 0;
  61. border-style: solid;
  62. margin-top: -38px;
  63. }
  64. .controlArrow.prev {
  65. left: 15px;
  66. width: 0;
  67. border-width: 38.5px 34px 38.5px 0;
  68. border-color: transparent #fff transparent transparent;
  69. }
  70. .controlArrow.next {
  71. right: 15px;
  72. border-width: 38.5px 0 38.5px 34px;
  73. border-color: transparent transparent transparent #fff;
  74. }
  75. .scrollable {
  76. overflow: scroll;
  77. }
  78. .easing {
  79. -webkit-transition: all 0.7s ease-out;
  80. -moz-transition: all 0.7s ease-out;
  81. -o-transition: all 0.7s ease-out;
  82. transition: all 0.7s ease-out;
  83. }
  84. #fullPage-nav {
  85. position: fixed;
  86. z-index: 100;
  87. margin-top: -32px;
  88. top: 50%;
  89. opacity: 1;
  90. }
  91. #fullPage-nav.right {
  92. right: 17px;
  93. }
  94. #fullPage-nav.left {
  95. left: 17px;
  96. }
  97. .fullPage-slidesNav {
  98. position: absolute;
  99. z-index: 4;
  100. left: 50%;
  101. opacity: 1;
  102. }
  103. .fullPage-slidesNav.bottom {
  104. bottom: 17px;
  105. }
  106. .fullPage-slidesNav.top {
  107. top: 17px;
  108. }
  109. #fullPage-nav ul,
  110. .fullPage-slidesNav ul {
  111. margin: 0;
  112. padding: 0;
  113. }
  114. #fullPage-nav li,
  115. .fullPage-slidesNav li {
  116. display: block;
  117. width: 14px;
  118. height: 13px;
  119. margin: 7px;
  120. position: relative;
  121. }
  122. .fullPage-slidesNav li {
  123. display: inline-block;
  124. }
  125. #fullPage-nav li a,
  126. .fullPage-slidesNav li a {
  127. display: block;
  128. position: relative;
  129. z-index: 1;
  130. width: 100%;
  131. height: 100%;
  132. cursor: pointer;
  133. text-decoration: none;
  134. }
  135. #fullPage-nav li .active span,
  136. .fullPage-slidesNav .active span {
  137. background: #333;
  138. }
  139. #fullPage-nav span,
  140. .fullPage-slidesNav span {
  141. top: 2px;
  142. left: 2px;
  143. width: 8px;
  144. height: 8px;
  145. border: 1px solid #000;
  146. background: rgba(0, 0, 0, 0);
  147. -webkit-border-radius: 50%;
  148. -moz-border-radius: 50%;
  149. border-radius: 50%;
  150. position: absolute;
  151. z-index: 1;
  152. }
  153. .fullPage-tooltip {
  154. position: absolute;
  155. color: #fff;
  156. font-size: 14px;
  157. font-family: arial, helvetica, sans-serif;
  158. top: -2px;
  159. }
  160. .fullPage-tooltip.right {
  161. right: 20px;
  162. }
  163. .fullPage-tooltip.left {
  164. left: 20px;
  165. }