You are here

media_gallery.css in Media Gallery 7

Same filename and directory in other branches
  1. 7.2 media_gallery.css
/* @group Node edit form styles */

.settings-group {
  clear: both;
  margin-top: 1.5em;
}

.settings-group > img {
  float: left;
  margin-bottom: 2em;
  margin-right: 2em;
}

.settings-group .group-label {
  font-weight: bold;
  margin-bottom: 0.75em;
}

.settings-group .form-item {
  padding: 0;
}

.settings-group .form-item label {
  font-weight: normal;
}

.settings-group .form-item label.option {
  font-size: 1em;
  vertical-align: middle;
}

.settings-group .form-item div.description {
  font-size: 0.87em;
  margin-top: 0;
}

.settings-group .form-inline {
  float: left;
}

.settings-group .form-inline label {
  display: none;
}

.settings-group .form-inline select {
  margin: 2em 1em 0 0;
}

.settings-group .form-inline.label label {
  display: block;
  position: absolute;
}

.settings-group .form-select.enhanced {
  margin-right: 1em;
}

.no-overflow {
  overflow: hidden;
}

.field-name-media-gallery-format .form-type-radio label.option,
.field-name-media-gallery-lightbox-extras .form-type-checkbox label.option {
  font-size: 0.94em;
  line-height: 1.2em;
}

.field-name-media-gallery-format .form-type-radio label.option .description {
  color: #666666;
  display: block;
  font-size: 0.86em;
}

.no-label label,
.no-group-label > .form-item > label {
  display: none;
}

.setting-icon {
  background: url('images/gallery-icon-sprite.png') no-repeat left top transparent;
  display: block;
  float: left;
  height: 44px;
  margin: 0 0.5em;
  width: 42px;
}

.settings-group .setting-icon {
  height: 109px;
  width: 104px;
}

.gallery-settings .setting-icon {
  background-position: -442px -57px;
}

.presentation-settings .setting-icon {
  background-position: 0 -57px;
}

.block-settings .setting-icon {
  background-position: -331px -57px;
}

.galleries-settings .setting-icon {
  background-position: -552px -57px;
}

/* @end */

/* @group Galleries form styles */

.form-media-gallery-collection .field-name-field-license {
  clear: both;
}

#edit-media-gallery-lightbox-extras {
  margin-left: 2em;
  margin-top: -1em;
}

.presentation-settings .setting-icon.display-page {
  background-position: -221px -57px;
}

.presentation-settings .setting-icon.display-lightbox {
  background-position: 0 -57px;
}

.presentation-settings .setting-icon.display-extras {
  background-position: -110px -57px;
}

/* @end */

/* @group Gallery thumbnail styles */

.media-gallery-collection a.media-gallery-thumb,
.media-gallery-media a.media-gallery-thumb,
.media-gallery-thumb img {
  display: block;
  overflow: hidden;
  position: relative;
}

.media-gallery-media > .field-items > .field-item {
  float: left;
  position: relative;
}

.media-gallery-media .media-gallery-item-wrapper {
  margin: 0.5em;
  position: relative;
}

.media-gallery-media .media-gallery-item {
  background: #FFFFFF;
  border: 1px solid #666666;
  padding: 2%;
}

.meta-wrapper,
.meta-wrapper:link,
.meta-wrapper:hover,
.meta-wrapper:visited,
.meta-wrapper:active {
  font-size: 0.8462em;
  line-height: 1.5em;
  min-height: 3em;
  vertical-align: top;
}

.meta-wrapper .media-title * .field-item,
.meta-wrapper .media-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width: 100%;
  -moz-binding: url('ellipsis.xml#ellipsis');
}

.meta-wrapper {
  display: block;
  padding: 0 9%;
}

.meta-wrapper.hover {
  line-height: 1em;
  padding: 0;
}

.meta-wrapper .media-description span {
  white-space: nowrap;
}

.media-license {
  display: block;
  float: right;
  font-size: 0;
  line-height: 14px;
}

.media-gallery-media .media-license {
  float: left;
  margin: 4px 0 0;
}

.media-license span {
  background: url('images/creative-commons-sprite.png') no-repeat left top transparent;
  display: inline-block;
  font-size: 1em;
  height: 0;
  padding: 7px;
  width: 0;
}

.media-license span + span {
  margin-left: 3px;
}

.media-license.dark .copyright {
  background-position: -95px -1px;
}

.media-license.dark .attribution {
  background-position: -2px -1px;
}

.media-license.dark .non-commercial {
  background-position: -25px -1px;
}

.media-license.dark .share-alike {
  background-position: -49px -1px;
}

.media-license.dark .no-deriv {
  background-position: -72px -1px;
}

.media-license.light .copyright {
  background-position: -95px -51px;
}

.media-license.light .attribution {
  background-position: -2px -51px;
}

.media-license.light .non-commercial {
  background-position: -25px -51px;
}

.media-license.light .share-alike {
  background-position: -49px -51px;
}

.media-license.light .no-deriv {
  background-position: -72px -51px;
}

.media-license.medium .copyright {
  background-position: -95px -26px;
}

.media-license.medium .attribution {
  background-position: -2px -26px;
}

.media-license.medium .non-commercial {
  background-position: -25px -26px;
}

.media-license.medium .share-alike {
  background-position: -49px -26px;
}

.media-license.medium .no-deriv {
  background-position: -72px -26px;
}

.meta-wrapper.hover {
  color: #666;
  display: none;
  left: -2px;
  line-height: 1.25em;
  margin: -7px 0 0;
  min-height: 0;
  min-width: 100%;
  position: absolute;
  *right: -2px;
  top: 100%;
  z-index: 1;
}

.meta-wrapper.hover .slider {
  background: url('images/hover-bubble.png') no-repeat left top transparent;
  display: block;
}

.meta-wrapper.hover .slider.top {
  padding-left: 53px;
}

.meta-wrapper.hover .slider.top-inner {
  background-position: right -48px;
  height: 14px;
}

.meta-wrapper.hover .slider.meta-outer {
  background: url('images/hover-bubble-middle.png') repeat-y left top transparent;
  padding-left: 0.5em;
}

.meta-wrapper.hover .slider.meta-inner {
  background: url('images/hover-bubble-middle.png') repeat-y right top transparent;
  padding-right: 0.5em;
}

.meta-wrapper.hover .slider.bottom {
  background-position: left -42px;
  padding-left: 53px;
}

.meta-wrapper.hover .slider.bottom-inner {
  background-position: right bottom;
  height: 5px;
}

.meta-wrapper .media-title {
  display: block;
  font-size: 12px;
  font-weight: bold;
  height: 1.5em;
  line-height: 1.5em;
  white-space: nowrap;
}

.meta-wrapper.hover .media-title {
  color: #000;
}

.meta-wrapper.hover .media-title a,
.meta-wrapper.hover .media-title a:hover {
  color: #000;
}

.media-gallery-item-wrapper:hover .meta-wrapper.hover,
.media-collection-item-wrapper:hover + .meta-wrapper.hover,
.meta-wrapper.hover:hover {
  display: block;
}

.meta-inner span {
  display: block;
}

.media-description span {
  display: inline;
  line-height: 1em;
}

/* @end */

/* @group Gridding styles */

.media-gallery-media {

}

.mg-col {
  display: inline-block;
  margin: 0 -0.5em 3em;
  width: 100%;
}

.mg-col > .field-items {
  width: 100%;
}

a.media-gallery-thumb img,
.media-gallery-detail img {
  height: auto;
  overflow: auto;
  width: 100%;
}

/**
 * The following widths are inflected with !important to
 * prevent users in the ThemeBuilder from destroying the
 * presentation of their galleries if they alter the width
 * of items with the .field class.
 */
.mg-col-1 > .field-items > .field-item,
.mg-col-1 .mg-gallery,
.media-gallery-detail .field-items > .field-item {
  width: 100% !important;
}

.mg-col-2 > .field-items > .field-item,
.mg-col-2 .mg-gallery {
  width: 50% !important;
}

.mg-col-3 > .field-items > .field-item,
.mg-col-3 .mg-gallery {
  width: 33.3% !important;
}

.mg-col-4 > .field-items > .field-item,
.mg-col-4 .mg-gallery {
  width: 24.96% !important;
}

.mg-col-5 > .field-items > .field-item,
.mg-col-5 .mg-gallery {
  width: 20% !important;
}

.mg-col-6 > .field-items > .field-item,
.mg-col-6 .mg-gallery {
  width: 16.6666666665% !important;
}

.mg-col-7 > .field-items > .field-item,
.mg-col-7 .mg-gallery {
  width: 14.2857142857% !important;
}

.mg-col-8 > .field-items > .field-item,
.mg-col-8 .mg-gallery {
  width: 12.5% !important;
}

.mg-col-9 > .field-items > .field-item,
.mg-col-9 .mg-gallery {
  width: 11.1111111111% !important;
}

.mg-col-10 > .field-items > .field-item,
.mg-col-10 .mg-gallery {
  width: 10% !important;
}

.mg-col .mg-gallery.mg-teaser {
  float: left;
}

.mg-col .mg-gallery.mg-teaser,
.mg-col .mg-gallery.mg-teaser .content {
  margin: 0;
  outline: none;
  position: relative;
}

.mg-col .mg-gallery.mg-teaser h2 {
  display: none;
}

.mg-col .mg-gallery.mg-teaser .float-overflow {
  margin: 0.5em;
  overflow: visible;
  position: relative;
}

/* @end */

/* @group Detail page styles */

.media-gallery-detail-wrapper {
  margin-top: 1em;
}

.media-gallery-detail {
  float: left;
  margin-right: 1em;
  line-height: normal;
  max-width: 70%;
}

.media-gallery-detail-wrapper .field-name-media-description .field-item {
  word-wrap: break-word;
}

.media-gallery-detail-info {
  clear: both;
  display: inline-block;
  margin-top: 0.5em;
  position: relative;
  overflow: hidden;
  width: 100%;
}

.media-gallery-detail-info .media-license {
  position: absolute;
  top: 0;
  right: 0;
}

.media-gallery-detail-info + .media-gallery-detail-info {
  margin-top: 1em;
}

.media-gallery-detail-image-info-wrapper {
  clear: right;
  float: right;
}

.media-gallery-image-count {
  padding-right: 1em;
}

/* @end */

/* @group Lightbox styles */

#cboxSlideshow {
  right: 40px;
}

.mg-lightbox-wrapper {
  color: #666666;
}

.mg-lightbox-wrapper a,
.lightbox-stack a {
  color: #0074BD;
}

.mg-lightbox-wrapper a:link,
.mg-lightbox-wrapper a:visited,
.mg-lightbox-wrapper a:active,
.mg-lightbox-wrapper a:hover,
.lightbox-stack a:link,
.lightbox-stack a:visited,
.lightbox-stack a:active,
.lightbox-stack a:hover{
  color: #0074BD;
}

.mg-lightbox-wrapper a:hover,
.lightbox-stack a:hover {
  text-decoration: underline;
}

.mg-lightbox-wrapper .lightbox-title {
  font-size: 1.8em;
  font-weight: bold;
  padding-bottom: 0.2em;
  padding-top: 0.2em;
}

.mg-lightbox-detail {
  float: left;
  padding-right: 320px;
}

.mg-lightbox-description {
  width: 300px;
  margin-left: -300px;
  float: left;
}

.lightbox-stack {
  min-width: 250px;
}

/* @end */

/* @group Gallery of Galleries styles */

.media-collection-item-wrapper {
  padding: 9%;
  position: relative;
}

.stack-image {
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 0;
}

.media-collection-item-wrapper .media-gallery-item {
  border: none;
  position: relative;
}

.mg-gallery img.stack-image,
.mg-gallery .media-gallery-thumb img {
  border: 0;
  padding: 0;
}

/* @end */

/* @group Gallery node styles */

.colorbox-supplemental-links {
  display: none;
}

/* @end */

/* @group Overrides */

a.contextual-links-trigger {
  background-position: 2px -18px;
}

a.contextual-links-trigger:hover,
div.contextual-links-active a.contextual-links-trigger {
  background-position: 2px 0;
}

/* remove extra padding around the iframe */
.ui-dialog .media-modal-frame {
  padding: 0 !important;
}

/* Ignore Bootstrap .hidden style */
#media-gallery-node-form .hidden {
  display: block !important;
}

/* @end */

File

media_gallery.css
View source
  1. /* @group Node edit form styles */
  2. .settings-group {
  3. clear: both;
  4. margin-top: 1.5em;
  5. }
  6. .settings-group > img {
  7. float: left;
  8. margin-bottom: 2em;
  9. margin-right: 2em;
  10. }
  11. .settings-group .group-label {
  12. font-weight: bold;
  13. margin-bottom: 0.75em;
  14. }
  15. .settings-group .form-item {
  16. padding: 0;
  17. }
  18. .settings-group .form-item label {
  19. font-weight: normal;
  20. }
  21. .settings-group .form-item label.option {
  22. font-size: 1em;
  23. vertical-align: middle;
  24. }
  25. .settings-group .form-item div.description {
  26. font-size: 0.87em;
  27. margin-top: 0;
  28. }
  29. .settings-group .form-inline {
  30. float: left;
  31. }
  32. .settings-group .form-inline label {
  33. display: none;
  34. }
  35. .settings-group .form-inline select {
  36. margin: 2em 1em 0 0;
  37. }
  38. .settings-group .form-inline.label label {
  39. display: block;
  40. position: absolute;
  41. }
  42. .settings-group .form-select.enhanced {
  43. margin-right: 1em;
  44. }
  45. .no-overflow {
  46. overflow: hidden;
  47. }
  48. .field-name-media-gallery-format .form-type-radio label.option,
  49. .field-name-media-gallery-lightbox-extras .form-type-checkbox label.option {
  50. font-size: 0.94em;
  51. line-height: 1.2em;
  52. }
  53. .field-name-media-gallery-format .form-type-radio label.option .description {
  54. color: #666666;
  55. display: block;
  56. font-size: 0.86em;
  57. }
  58. .no-label label,
  59. .no-group-label > .form-item > label {
  60. display: none;
  61. }
  62. .setting-icon {
  63. background: url('images/gallery-icon-sprite.png') no-repeat left top transparent;
  64. display: block;
  65. float: left;
  66. height: 44px;
  67. margin: 0 0.5em;
  68. width: 42px;
  69. }
  70. .settings-group .setting-icon {
  71. height: 109px;
  72. width: 104px;
  73. }
  74. .gallery-settings .setting-icon {
  75. background-position: -442px -57px;
  76. }
  77. .presentation-settings .setting-icon {
  78. background-position: 0 -57px;
  79. }
  80. .block-settings .setting-icon {
  81. background-position: -331px -57px;
  82. }
  83. .galleries-settings .setting-icon {
  84. background-position: -552px -57px;
  85. }
  86. /* @end */
  87. /* @group Galleries form styles */
  88. .form-media-gallery-collection .field-name-field-license {
  89. clear: both;
  90. }
  91. #edit-media-gallery-lightbox-extras {
  92. margin-left: 2em;
  93. margin-top: -1em;
  94. }
  95. .presentation-settings .setting-icon.display-page {
  96. background-position: -221px -57px;
  97. }
  98. .presentation-settings .setting-icon.display-lightbox {
  99. background-position: 0 -57px;
  100. }
  101. .presentation-settings .setting-icon.display-extras {
  102. background-position: -110px -57px;
  103. }
  104. /* @end */
  105. /* @group Gallery thumbnail styles */
  106. .media-gallery-collection a.media-gallery-thumb,
  107. .media-gallery-media a.media-gallery-thumb,
  108. .media-gallery-thumb img {
  109. display: block;
  110. overflow: hidden;
  111. position: relative;
  112. }
  113. .media-gallery-media > .field-items > .field-item {
  114. float: left;
  115. position: relative;
  116. }
  117. .media-gallery-media .media-gallery-item-wrapper {
  118. margin: 0.5em;
  119. position: relative;
  120. }
  121. .media-gallery-media .media-gallery-item {
  122. background: #FFFFFF;
  123. border: 1px solid #666666;
  124. padding: 2%;
  125. }
  126. .meta-wrapper,
  127. .meta-wrapper:link,
  128. .meta-wrapper:hover,
  129. .meta-wrapper:visited,
  130. .meta-wrapper:active {
  131. font-size: 0.8462em;
  132. line-height: 1.5em;
  133. min-height: 3em;
  134. vertical-align: top;
  135. }
  136. .meta-wrapper .media-title * .field-item,
  137. .meta-wrapper .media-title {
  138. overflow: hidden;
  139. text-overflow: ellipsis;
  140. white-space: nowrap;
  141. width: 100%;
  142. -moz-binding: url('ellipsis.xml#ellipsis');
  143. }
  144. .meta-wrapper {
  145. display: block;
  146. padding: 0 9%;
  147. }
  148. .meta-wrapper.hover {
  149. line-height: 1em;
  150. padding: 0;
  151. }
  152. .meta-wrapper .media-description span {
  153. white-space: nowrap;
  154. }
  155. .media-license {
  156. display: block;
  157. float: right;
  158. font-size: 0;
  159. line-height: 14px;
  160. }
  161. .media-gallery-media .media-license {
  162. float: left;
  163. margin: 4px 0 0;
  164. }
  165. .media-license span {
  166. background: url('images/creative-commons-sprite.png') no-repeat left top transparent;
  167. display: inline-block;
  168. font-size: 1em;
  169. height: 0;
  170. padding: 7px;
  171. width: 0;
  172. }
  173. .media-license span + span {
  174. margin-left: 3px;
  175. }
  176. .media-license.dark .copyright {
  177. background-position: -95px -1px;
  178. }
  179. .media-license.dark .attribution {
  180. background-position: -2px -1px;
  181. }
  182. .media-license.dark .non-commercial {
  183. background-position: -25px -1px;
  184. }
  185. .media-license.dark .share-alike {
  186. background-position: -49px -1px;
  187. }
  188. .media-license.dark .no-deriv {
  189. background-position: -72px -1px;
  190. }
  191. .media-license.light .copyright {
  192. background-position: -95px -51px;
  193. }
  194. .media-license.light .attribution {
  195. background-position: -2px -51px;
  196. }
  197. .media-license.light .non-commercial {
  198. background-position: -25px -51px;
  199. }
  200. .media-license.light .share-alike {
  201. background-position: -49px -51px;
  202. }
  203. .media-license.light .no-deriv {
  204. background-position: -72px -51px;
  205. }
  206. .media-license.medium .copyright {
  207. background-position: -95px -26px;
  208. }
  209. .media-license.medium .attribution {
  210. background-position: -2px -26px;
  211. }
  212. .media-license.medium .non-commercial {
  213. background-position: -25px -26px;
  214. }
  215. .media-license.medium .share-alike {
  216. background-position: -49px -26px;
  217. }
  218. .media-license.medium .no-deriv {
  219. background-position: -72px -26px;
  220. }
  221. .meta-wrapper.hover {
  222. color: #666;
  223. display: none;
  224. left: -2px;
  225. line-height: 1.25em;
  226. margin: -7px 0 0;
  227. min-height: 0;
  228. min-width: 100%;
  229. position: absolute;
  230. *right: -2px;
  231. top: 100%;
  232. z-index: 1;
  233. }
  234. .meta-wrapper.hover .slider {
  235. background: url('images/hover-bubble.png') no-repeat left top transparent;
  236. display: block;
  237. }
  238. .meta-wrapper.hover .slider.top {
  239. padding-left: 53px;
  240. }
  241. .meta-wrapper.hover .slider.top-inner {
  242. background-position: right -48px;
  243. height: 14px;
  244. }
  245. .meta-wrapper.hover .slider.meta-outer {
  246. background: url('images/hover-bubble-middle.png') repeat-y left top transparent;
  247. padding-left: 0.5em;
  248. }
  249. .meta-wrapper.hover .slider.meta-inner {
  250. background: url('images/hover-bubble-middle.png') repeat-y right top transparent;
  251. padding-right: 0.5em;
  252. }
  253. .meta-wrapper.hover .slider.bottom {
  254. background-position: left -42px;
  255. padding-left: 53px;
  256. }
  257. .meta-wrapper.hover .slider.bottom-inner {
  258. background-position: right bottom;
  259. height: 5px;
  260. }
  261. .meta-wrapper .media-title {
  262. display: block;
  263. font-size: 12px;
  264. font-weight: bold;
  265. height: 1.5em;
  266. line-height: 1.5em;
  267. white-space: nowrap;
  268. }
  269. .meta-wrapper.hover .media-title {
  270. color: #000;
  271. }
  272. .meta-wrapper.hover .media-title a,
  273. .meta-wrapper.hover .media-title a:hover {
  274. color: #000;
  275. }
  276. .media-gallery-item-wrapper:hover .meta-wrapper.hover,
  277. .media-collection-item-wrapper:hover + .meta-wrapper.hover,
  278. .meta-wrapper.hover:hover {
  279. display: block;
  280. }
  281. .meta-inner span {
  282. display: block;
  283. }
  284. .media-description span {
  285. display: inline;
  286. line-height: 1em;
  287. }
  288. /* @end */
  289. /* @group Gridding styles */
  290. .media-gallery-media {
  291. }
  292. .mg-col {
  293. display: inline-block;
  294. margin: 0 -0.5em 3em;
  295. width: 100%;
  296. }
  297. .mg-col > .field-items {
  298. width: 100%;
  299. }
  300. a.media-gallery-thumb img,
  301. .media-gallery-detail img {
  302. height: auto;
  303. overflow: auto;
  304. width: 100%;
  305. }
  306. /**
  307. * The following widths are inflected with !important to
  308. * prevent users in the ThemeBuilder from destroying the
  309. * presentation of their galleries if they alter the width
  310. * of items with the .field class.
  311. */
  312. .mg-col-1 > .field-items > .field-item,
  313. .mg-col-1 .mg-gallery,
  314. .media-gallery-detail .field-items > .field-item {
  315. width: 100% !important;
  316. }
  317. .mg-col-2 > .field-items > .field-item,
  318. .mg-col-2 .mg-gallery {
  319. width: 50% !important;
  320. }
  321. .mg-col-3 > .field-items > .field-item,
  322. .mg-col-3 .mg-gallery {
  323. width: 33.3% !important;
  324. }
  325. .mg-col-4 > .field-items > .field-item,
  326. .mg-col-4 .mg-gallery {
  327. width: 24.96% !important;
  328. }
  329. .mg-col-5 > .field-items > .field-item,
  330. .mg-col-5 .mg-gallery {
  331. width: 20% !important;
  332. }
  333. .mg-col-6 > .field-items > .field-item,
  334. .mg-col-6 .mg-gallery {
  335. width: 16.6666666665% !important;
  336. }
  337. .mg-col-7 > .field-items > .field-item,
  338. .mg-col-7 .mg-gallery {
  339. width: 14.2857142857% !important;
  340. }
  341. .mg-col-8 > .field-items > .field-item,
  342. .mg-col-8 .mg-gallery {
  343. width: 12.5% !important;
  344. }
  345. .mg-col-9 > .field-items > .field-item,
  346. .mg-col-9 .mg-gallery {
  347. width: 11.1111111111% !important;
  348. }
  349. .mg-col-10 > .field-items > .field-item,
  350. .mg-col-10 .mg-gallery {
  351. width: 10% !important;
  352. }
  353. .mg-col .mg-gallery.mg-teaser {
  354. float: left;
  355. }
  356. .mg-col .mg-gallery.mg-teaser,
  357. .mg-col .mg-gallery.mg-teaser .content {
  358. margin: 0;
  359. outline: none;
  360. position: relative;
  361. }
  362. .mg-col .mg-gallery.mg-teaser h2 {
  363. display: none;
  364. }
  365. .mg-col .mg-gallery.mg-teaser .float-overflow {
  366. margin: 0.5em;
  367. overflow: visible;
  368. position: relative;
  369. }
  370. /* @end */
  371. /* @group Detail page styles */
  372. .media-gallery-detail-wrapper {
  373. margin-top: 1em;
  374. }
  375. .media-gallery-detail {
  376. float: left;
  377. margin-right: 1em;
  378. line-height: normal;
  379. max-width: 70%;
  380. }
  381. .media-gallery-detail-wrapper .field-name-media-description .field-item {
  382. word-wrap: break-word;
  383. }
  384. .media-gallery-detail-info {
  385. clear: both;
  386. display: inline-block;
  387. margin-top: 0.5em;
  388. position: relative;
  389. overflow: hidden;
  390. width: 100%;
  391. }
  392. .media-gallery-detail-info .media-license {
  393. position: absolute;
  394. top: 0;
  395. right: 0;
  396. }
  397. .media-gallery-detail-info + .media-gallery-detail-info {
  398. margin-top: 1em;
  399. }
  400. .media-gallery-detail-image-info-wrapper {
  401. clear: right;
  402. float: right;
  403. }
  404. .media-gallery-image-count {
  405. padding-right: 1em;
  406. }
  407. /* @end */
  408. /* @group Lightbox styles */
  409. #cboxSlideshow {
  410. right: 40px;
  411. }
  412. .mg-lightbox-wrapper {
  413. color: #666666;
  414. }
  415. .mg-lightbox-wrapper a,
  416. .lightbox-stack a {
  417. color: #0074BD;
  418. }
  419. .mg-lightbox-wrapper a:link,
  420. .mg-lightbox-wrapper a:visited,
  421. .mg-lightbox-wrapper a:active,
  422. .mg-lightbox-wrapper a:hover,
  423. .lightbox-stack a:link,
  424. .lightbox-stack a:visited,
  425. .lightbox-stack a:active,
  426. .lightbox-stack a:hover{
  427. color: #0074BD;
  428. }
  429. .mg-lightbox-wrapper a:hover,
  430. .lightbox-stack a:hover {
  431. text-decoration: underline;
  432. }
  433. .mg-lightbox-wrapper .lightbox-title {
  434. font-size: 1.8em;
  435. font-weight: bold;
  436. padding-bottom: 0.2em;
  437. padding-top: 0.2em;
  438. }
  439. .mg-lightbox-detail {
  440. float: left;
  441. padding-right: 320px;
  442. }
  443. .mg-lightbox-description {
  444. width: 300px;
  445. margin-left: -300px;
  446. float: left;
  447. }
  448. .lightbox-stack {
  449. min-width: 250px;
  450. }
  451. /* @end */
  452. /* @group Gallery of Galleries styles */
  453. .media-collection-item-wrapper {
  454. padding: 9%;
  455. position: relative;
  456. }
  457. .stack-image {
  458. left: 0;
  459. position: absolute;
  460. top: 0;
  461. width: 100%;
  462. z-index: 0;
  463. }
  464. .media-collection-item-wrapper .media-gallery-item {
  465. border: none;
  466. position: relative;
  467. }
  468. .mg-gallery img.stack-image,
  469. .mg-gallery .media-gallery-thumb img {
  470. border: 0;
  471. padding: 0;
  472. }
  473. /* @end */
  474. /* @group Gallery node styles */
  475. .colorbox-supplemental-links {
  476. display: none;
  477. }
  478. /* @end */
  479. /* @group Overrides */
  480. a.contextual-links-trigger {
  481. background-position: 2px -18px;
  482. }
  483. a.contextual-links-trigger:hover,
  484. div.contextual-links-active a.contextual-links-trigger {
  485. background-position: 2px 0;
  486. }
  487. /* remove extra padding around the iframe */
  488. .ui-dialog .media-modal-frame {
  489. padding: 0 !important;
  490. }
  491. /* Ignore Bootstrap .hidden style */
  492. #media-gallery-node-form .hidden {
  493. display: block !important;
  494. }
  495. /* @end */