orangebox.css 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185
  1. /*
  2. * version: 3.0.0
  3. * package: OrangeBox
  4. * author: David Paul Hamilton - http://orangebox.davidpaulhamilton.net
  5. * copyright: Copyright (c) 2011 David Hamilton / DavidPaulHamilton.net All rights reserved.
  6. * license: GNU/GPL license: http://www.gnu.org/copyleft/gpl.html
  7. */
  8. #ob_overlay {
  9. background-color:#333;
  10. height:100%;
  11. left:0;
  12. position:fixed;
  13. top:0;
  14. width:100%;
  15. z-index:1000;
  16. }
  17. #ob_container {
  18. position:absolute;
  19. top:0;
  20. left:0;
  21. margin:0;
  22. padding:0;
  23. width:100%;
  24. height:100%;
  25. z-index:1001;
  26. }
  27. #ob_float {
  28. float:left;
  29. height:50%;
  30. min-width:100%;
  31. }
  32. #ob_content {
  33. clear:both;
  34. cursor:default;
  35. position:relative;
  36. margin: auto;
  37. background-color:#fff;
  38. border:0 solid #fff;
  39. -webkit-box-shadow: 0px 0px 8px 2px #222222;
  40. -moz-box-shadow: 0px 0px 8px 2px #222222;
  41. line-height:0;
  42. display:none;
  43. z-index:1003;
  44. }
  45. #ob_iframe {
  46. -webkit-overflow-scrolling:touch;
  47. overflow:auto;
  48. font-size:0;
  49. min-width: 320px;
  50. margin-left: 0px;
  51. left: 0px;
  52. }
  53. #ob_caption {
  54. color:#333;
  55. background-color:#fff;
  56. font-size:small;
  57. }
  58. #ob_caption p {
  59. padding:0;
  60. margin:10px;
  61. cursor:auto;
  62. line-height:1.625em;
  63. }
  64. #ob_video_wrapper {
  65. background:#000;
  66. }
  67. #ob_image {
  68. display:block;
  69. margin:0 auto;
  70. }
  71. #ob_inline {
  72. overflow:auto;
  73. cursor:auto;
  74. }
  75. #ob_inline .inline_content {
  76. padding:20px;
  77. line-height:1.625em;
  78. }
  79. #ob_load {
  80. -moz-border-radius:5px;
  81. background:url(loading.gif) no-repeat center;
  82. background-color:#fff;
  83. border-radius:5px;
  84. height:40px;
  85. left:50%;
  86. position:fixed;
  87. top:50%;
  88. width:40px;
  89. margin:-25px 0 0 -25px;
  90. padding:5px;
  91. -webkit-box-shadow: 0px 0px 8px 2px #222222;
  92. -moz-box-shadow: 0px 0px 8px 2px #222222;
  93. z-index:1002;
  94. }
  95. #ob_error {
  96. text-align:center;
  97. padding:10px;
  98. }
  99. #ob_close {
  100. background:url(buttons.png);
  101. cursor:pointer;
  102. height:30px;
  103. left:-26px;
  104. position:absolute;
  105. top:-26px;
  106. width:30px;
  107. z-index:1005;
  108. }
  109. #ob_title {
  110. color:#fff;
  111. left:auto;
  112. position:absolute;
  113. margin-left:15px;
  114. right:0;
  115. text-align:right;
  116. z-index:1004;
  117. line-height:1em;
  118. cursor:auto;
  119. }
  120. #ob_left,#ob_right {
  121. bottom:8px;
  122. cursor:pointer;
  123. height:100%;
  124. position:absolute;
  125. width:50px;
  126. z-index:1004;
  127. }
  128. #ob_left { left:-53px; }
  129. #ob_right { right:-53px; }
  130. #ob_left-ico,#ob_right-ico {
  131. cursor:pointer;
  132. display:block;
  133. height:30px;
  134. margin-top:-9px;
  135. position:absolute;
  136. top:50%;
  137. width:30px;
  138. z-index:1004;
  139. }
  140. #ob_left-ico {
  141. background:url(buttons.png) center;
  142. right:20px;
  143. }
  144. #ob_right-ico {
  145. background:url(buttons.png) right;
  146. left:20px;
  147. }
  148. #ob_left:hover,#ob_right:hover { visibility:visible; }
  149. #ob_dots {
  150. position:absolute;
  151. bottom:-24px;
  152. list-style:none;
  153. text-align:center;
  154. margin:0;
  155. padding:0;
  156. width:100%;
  157. }
  158. #ob_dots li {
  159. height:8px;
  160. list-style:none;
  161. width:8px;
  162. margin:3px;
  163. -moz-border-radius:4px;
  164. background-color:#666;
  165. border-radius:4px;
  166. cursor:pointer;
  167. display: -moz-inline-stack;
  168. display: inline-block;
  169. zoom:1;
  170. *display:inline;
  171. }
  172. #ob_dots .current { background-color:#CCC!important; }
  173. #ob_share { margin-left:8px; }
  174. @media all and (max-width: 480px) {
  175. #ob_content {
  176. width: auto !important;
  177. margin-left: 0px !important;
  178. }
  179. #ob_iframe {
  180. width: auto !important;
  181. }
  182. }