| @@ -1,9 +1,9 @@ | ||
| 1 | 1 | /* Social Media, Buy Button*/ |
| 2 | 2 | #photonic-social { padding: 0.2em; border: none; border-radius: 4px;background: #111;background: rgba(0, 0, 0, 0.5); display: inline-block; } |
| 3 | 3 | #photonic-social a { width: 28px; height: 28px; display: block; float: left; color: inherit; text-decoration: none; margin: 0 0.2em; cursor: pointer; } |
| 4 | 4 | a.photonic-buy-link { width: 28px; height: 28px; display: inline-block; color: inherit; text-decoration: none; margin: 0 0.4em; cursor: pointer; vertical-align: middle; } |
| 5 | -#photonic-social div, .photonic-buy-link .icon-buy { font-size: 28px; float: left; position: relative; width: 100%; height: 100%; background-image: url('../../../images/Icons.svg?v=2.19'); background-color: #bbb; background-size: 100%; background-repeat: no-repeat; border-radius: 3px; } | |
| 5 | +#photonic-social div, .photonic-buy-link .icon-buy { font-size: 28px; float: left; position: relative; width: 100%; height: 100%; background-image: url('../../../images/Icons.svg?v=3.04'); background-color: #bbb; background-size: 100%; background-repeat: no-repeat; border-radius: 3px; } | |
| 6 | 6 | #photonic-social a:hover div { background-color: #6af; } |
| 7 | 7 | #photonic-social a:first-child {margin-left: 0; } |
| 8 | 8 | #photonic-social a:last-child {margin-right: 0; } |
| 9 | 9 | #photonic-social .icon-facebook { background-position: 0 0; } |
| @@ -12,11 +12,19 @@ | ||
| 12 | 12 | .photonic-buy-link .icon-buy { background-position: 0 -252px; background-color: transparent; } |
| 13 | 13 | #photonic-social .icon-twitter:before, #photonic-social .icon-facebook:before, #photonic-social .icon-twitter:after, #photonic-social .icon-facebook:after { content: '' !important; } |
| 14 | 14 | |
| 15 | 15 | /* Lightboxes */ |
| 16 | -#swipebox-arrows {text-align: center; } | |
| 17 | -#swipebox-arrows #photonic-social { background: none; position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); } | |
| 16 | +#baguetteBox-overlay #photonic-social { margin-top: 1rem; margin-left: 1rem; } | |
| 18 | 17 | |
| 18 | +#bp_container #photonic-social { top: 10px; right: 60px; } | |
| 19 | + | |
| 20 | +.ginner-container #photonic-social { top: 1rem; left: 1rem; display: block; position: absolute; } | |
| 21 | + | |
| 22 | +.lg-toolbar #photonic-social { float: right; margin-top: 8px; background: transparent; } | |
| 23 | + | |
| 24 | +#spotlight #photonic-social { width: 120px; padding: 0.6em; opacity: 1; } | |
| 25 | +#spotlight #photonic-social a:hover div { opacity: 1; } | |
| 26 | + | |
| 19 | 27 | #cboxContent #photonic-social { position: absolute; top: 14px; left: 14px; } |
| 20 | 28 | #cboxContent button { padding: 0; } |
| 21 | 29 | |
| 22 | 30 | .fancybox-title #photonic-social {position: absolute; right: 0; top: 50%; transform: translateY(-50%);} |
| @@ -21,108 +29,75 @@ | ||
| 21 | 29 | |
| 22 | 30 | .fancybox-title #photonic-social {position: absolute; right: 0; top: 50%; transform: translateY(-50%);} |
| 23 | 31 | .fancybox-title-inside-wrap { margin-top: 10px !important; padding-top: 0 !important; } |
| 24 | 32 | .fancybox-title-over-wrap { display: block; width: 100%; box-sizing: border-box; } |
| 33 | +.fancybox-caption #photonic-social { float: right; } | |
| 34 | +.fancybox-toolbar #photonic-social { margin: auto 0; height: 44px; padding: 0 8px; border-radius: 0; background: rgba(30,30,30,.6); } | |
| 35 | +.fancybox-toolbar #photonic-social a { margin: 8px 0.2em; } | |
| 36 | +.fancybox-slide--html .fancybox-content { overflow: hidden; padding: 0; } | |
| 25 | 37 | |
| 38 | +#fancybox-right, #fancybox-left { width: 15%; } | |
| 39 | +#fancybox-wrap, #fancybox-content { box-sizing: content-box; } | |
| 40 | + | |
| 41 | +.fancybox-inner { overflow: auto !important; } | |
| 42 | +.photonic-fancybox .fancybox-inner { overflow: hidden !important; } | |
| 43 | + | |
| 26 | 44 | #pp_full_res #photonic-social { position: absolute; top: 14px; left: 28px;} |
| 27 | 45 | |
| 28 | 46 | #imagelightbox-overlay #photonic-social { position: absolute; top: 2.5em; left: 2.5em; } |
| 29 | 47 | |
| 30 | -.lg-toolbar #photonic-social { float: right; margin-top: 8px; background: transparent; } | |
| 31 | - | |
| 32 | 48 | .photonic-featherlight #photonic-social { position: absolute; top: 5%; left: 5%; } |
| 33 | -.fancybox-caption #photonic-social { float: right; } | |
| 34 | 49 | |
| 35 | 50 | #lightcase-content { background: transparent; } |
| 36 | -.fancybox-slide--html .fancybox-content { overflow: hidden; padding: 0; } | |
| 37 | 51 | @media screen and (min-width: 641px) { |
| 38 | 52 | #lightcase-case:not([data-lc-type=error]) #lightcase-content .lightcase-contentInner .lightcase-inlineWrap { padding: 0; overflow: hidden; } |
| 39 | 53 | } |
| 40 | -video.photonic { margin: 0; padding: 0; } | |
| 41 | 54 | |
| 55 | +#swipebox-arrows {text-align: center; } | |
| 56 | +#swipebox-arrows #photonic-social { background: none; position: absolute; top: 50%; left: 50%; transform: translateY(-50%) translateX(-50%); } | |
| 42 | 57 | |
| 43 | -div.photonic-slideshow { | |
| 44 | - width: 100%; | |
| 45 | - clear: both; | |
| 46 | - display: -ms-flexbox; | |
| 58 | +#TB_overlay { z-index: 1050 !important; } | |
| 59 | +#TB_window { z-index: 1060 !important; } | |
| 47 | 60 | |
| 48 | - display: -webkit-box; | |
| 49 | - display: -moz-box; | |
| 50 | - -webkit-box-orient: horizontal; | |
| 51 | - -moz-box-orient: horizontal; | |
| 61 | +video.photonic { margin: 0; padding: 0; } | |
| 52 | 62 | |
| 53 | - display: -webkit-flex; | |
| 54 | - display: -moz-flex; | |
| 55 | - display: -ms-flex; | |
| 56 | - display: flex; | |
| 57 | -} | |
| 58 | -div.photonic-slideshow .lSSlideOuter { width: 100%; } | |
| 59 | -.photonic-slideshow-adapt-height-width img { width: 100%; } | |
| 60 | -.lSAction > .lSNext, .lSAction > .lSPrev { color: transparent; } | |
| 61 | -.lightSlider li {position: relative; } | |
| 62 | -.photonic-slide-center .lightSlider li, .photonic-slide-center.lightSlider li { text-align: center; } | |
| 63 | -.lSSlideOuter .lSPager.lSGallery { margin-bottom: 5px; margin-top: 0 !important; } | |
| 64 | -.photonic-slideshow-img { display: none; } | |
| 65 | -.lSSlideOuter .photonic-slideshow-img { display: list-item; } | |
| 66 | -.photonic-slideshow-side-white li img { height: 100%; width: auto; } | |
| 67 | -ul.slideshow-grid-panel { float: left; width: 100% !important; position: relative; display: inline-block; } | |
| 68 | -li.slideshow-grid { width: 100% !important; } | |
| 69 | -li.slideshow-grid li { display: inline-block; } | |
| 70 | -.slideshow-grid-panel a { display: inline-block; } | |
| 63 | +.photonic-slideshow-adapt-height-width img { width: 100%; vertical-align: middle; } | |
| 64 | +.photonic-slideshow-side-white li img { /*height: 100%;*/ width: auto; vertical-align: middle; } | |
| 71 | 65 | |
| 66 | +.modal-gallery a { display: inline-block; } | |
| 67 | + | |
| 72 | 68 | .photonic-standard-layout { |
| 73 | - float: left; | |
| 74 | 69 | width: 100%; |
| 75 | 70 | margin: 0; |
| 76 | 71 | padding: 0; |
| 77 | 72 | |
| 78 | - display: -ms-flexbox; | |
| 79 | - display: -webkit-box; | |
| 80 | - display: -moz-box; | |
| 81 | - -webkit-box-orient: horizontal; | |
| 82 | - -moz-box-orient: horizontal; | |
| 83 | - | |
| 84 | - display: -webkit-flex; | |
| 85 | - display: -moz-flex; | |
| 86 | - display: -ms-flex; | |
| 87 | 73 | display: flex; |
| 88 | - | |
| 89 | - -webkit-flex-wrap: wrap; | |
| 90 | - -ms-flex-wrap: wrap; | |
| 91 | 74 | flex-wrap: wrap; |
| 92 | 75 | } |
| 93 | 76 | .photonic-standard-layout .photonic-level-1 { float: left; position: relative; } |
| 94 | 77 | .photonic-standard-layout .photonic-level-1:after { content: ''; visibility: hidden; display: block; height: 0; clear: both; } |
| 95 | 78 | |
| 96 | -.photonic-gallery-1c { width: 98%; } | |
| 97 | -.photonic-gallery-2c { width: 49%; } | |
| 98 | -.photonic-gallery-3c { width: 32%; } | |
| 99 | -.photonic-gallery-4c { width: 24%; } | |
| 100 | -.photonic-gallery-5c { width: 19%; } | |
| 101 | -.photonic-gallery-6c { width: 16%; } | |
| 102 | -.photonic-gallery-7c { width: 14%; } | |
| 103 | -.photonic-gallery-8c { width: 12%; } | |
| 104 | -.photonic-gallery-9c { width: 10.5%; } | |
| 105 | -.photonic-gallery-10c { width: 9.5%; } | |
| 106 | -.photonic-gallery-11c { width: 8.6%; } | |
| 107 | -.photonic-gallery-12c { width: 8%; } | |
| 108 | -.photonic-gallery-13c { width: 7.2%; } | |
| 109 | -.photonic-gallery-14c { width: 6.8%; } | |
| 110 | -.photonic-gallery-15c { width: 6.5%; } | |
| 111 | -.photonic-gallery-16c { width: 6.2%; } | |
| 112 | -.photonic-gallery-17c { width: 5.8%; } | |
| 113 | -.photonic-gallery-18c { width: 5.5%; } | |
| 114 | -.photonic-gallery-19c { width: 5.2%; } | |
| 115 | -.photonic-gallery-20c { width: 4.95%; } | |
| 79 | +.photonic-gallery-1c .photonic-thumb { width: 98%; } | |
| 80 | +.photonic-gallery-2c .photonic-thumb { width: 49%; } | |
| 81 | +.photonic-gallery-3c .photonic-thumb { width: 32%; } | |
| 82 | +.photonic-gallery-4c .photonic-thumb { width: 24%; } | |
| 83 | +.photonic-gallery-5c .photonic-thumb { width: 19%; } | |
| 84 | +.photonic-gallery-6c .photonic-thumb { width: 16%; } | |
| 85 | +.photonic-gallery-7c .photonic-thumb { width: 14%; } | |
| 86 | +.photonic-gallery-8c .photonic-thumb { width: 12%; } | |
| 87 | +.photonic-gallery-9c .photonic-thumb { width: 10.5%; } | |
| 88 | +.photonic-gallery-10c .photonic-thumb { width: 9.5%; } | |
| 116 | 89 | |
| 117 | -.photonic-tree li { list-style: none; } | |
| 90 | +.photonic-tree { margin: 0; padding: 0 } | |
| 91 | +.photonic-tree .photonic-tree .photonic-tree { margin-left: 1.5rem; } | |
| 118 | 92 | |
| 119 | 93 | .photonic-panel ul { padding: 0; margin: 10px auto; } |
| 120 | 94 | .photonic-panel { display: none; text-align: center; width: 800px; z-index: 5; padding: 10px; border-radius:10px; } |
| 121 | 95 | |
| 96 | +.sizes-missing .photonic-thumb { display: none; } | |
| 97 | + | |
| 122 | 98 | .photonic-thumb { |
| 123 | - /*display: inline-block;*/ | |
| 124 | - display: none; | |
| 99 | + display: inline-block; | |
| 125 | 100 | list-style: none; |
| 126 | 101 | vertical-align: top; |
| 127 | 102 | text-align: center; |
| 128 | 103 | background: transparent !important; |
| @@ -129,43 +104,60 @@ | ||
| 129 | 104 | line-height: 1.1em; |
| 130 | 105 | zoom: 1; |
| 131 | 106 | box-sizing: border-box; |
| 132 | 107 | padding: 5px; |
| 108 | + margin: 0; | |
| 133 | 109 | } |
| 134 | 110 | |
| 135 | -.slideshow-grid-panel .photonic-level-1 { display: inline-block; } | |
| 111 | +.photonic-auto-padded .photonic-level-1 { padding: 5px 8px; } | |
| 112 | +.photonic-auto-padded .photonic-level-2 { margin: 10px; } | |
| 113 | +.modal-gallery .photonic-thumb { padding: 10px; box-sizing: border-box; } | |
| 136 | 114 | |
| 137 | -.photonic-masonry-layout { width: 100% !important; position: relative; clear: both; margin: 0 auto; } | |
| 138 | -.photonic-masonry-layout .photonic-thumb { width: 100%; display: block; } | |
| 139 | -.photonic-ie .photonic-masonry-layout .photonic-thumb { display: inline-block; } | |
| 140 | -.photonic-masonry-layout .photonic-thumb a { padding: 0; width: 100%; } | |
| 141 | -.photonic-masonry-layout.title-display-below .photonic-title { padding: 2px; overflow: hidden; font-family: "Noto Sans", HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 0.7em;} | |
| 142 | -.photonic-masonry-layout .photonic-thumb a img { width: 100%; height: 100%; padding: 0; display: none; } | |
| 143 | -.photonic-stream .photonic-masonry-layout .photonic-thumb { margin: 0; position: relative; } | |
| 144 | -.photonic-masonry-layout { -moz-column-gap: 0; -webkit-column-gap: 0; column-gap: 0; } | |
| 115 | +.photonic-stream ul.photonic-level-1-container, .photonic-stream ul.photonic-level-2-container { padding: 0 !important; margin: 0 auto !important;} | |
| 145 | 116 | |
| 117 | +.photonic-masonry-layout, .photonic-masonry-horizontal-layout { width: 100% !important; position: relative; clear: both; margin: 0 auto; column-gap: 0; } | |
| 118 | +.photonic-masonry-layout .photonic-thumb, .photonic-masonry-horizontal-layout .photonic-thumb { width: 100%; display: block; } | |
| 119 | +.photonic-masonry-layout .photonic-thumb a, .photonic-masonry-horizontal-layout .photonic-thumb a { padding: 0; width: 100%; } | |
| 120 | +.photonic-masonry-layout.title-display-below .photonic-title, .photonic-masonry-horizontal-layout.title-display-below .photonic-title { padding: 2px; overflow: hidden; font-family: "Noto Sans", HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 0.7em;} | |
| 121 | +.photonic-masonry-layout .photonic-thumb a img, .photonic-masonry-horizontal-layout .photonic-thumb a img { width: 100%; height: 100%; padding: 0; /*display: none; */} | |
| 122 | +.photonic-stream .photonic-masonry-layout .photonic-thumb, .photonic-stream .photonic-masonry-horizontal-layout .photonic-thumb { margin: 0; position: relative; } | |
| 123 | + | |
| 146 | 124 | .photonic-mosaic-layout { width: 100% !important; position: relative; clear: both; margin: 0 auto; overflow: hidden; } |
| 147 | 125 | .photonic-mosaic-layout .photonic-thumb { display: inline-block; margin: 0; position: absolute; padding: 0; } |
| 148 | 126 | .photonic-mosaic-layout .photonic-thumb a { padding: 0; width: 100%; height: 100%; } |
| 149 | -.photonic-mosaic-layout .photonic-thumb a img { width: 100%; height: 100%; padding: 0; display: none; } | |
| 127 | +.photonic-mosaic-layout .photonic-thumb a img { width: 100%; height: 100%; padding: 0; /*display: none;*/ } | |
| 150 | 128 | .photonic-stream .photonic-mosaic-layout .photonic-thumb { margin: 0; } |
| 151 | 129 | |
| 152 | 130 | .photonic-random-layout { width: 100% !important; position: relative; clear: both; margin: 0 auto; overflow: hidden; } |
| 153 | -.photonic-random-layout .photonic-thumb { display: inline-block; margin: 0; position: relative; padding: 2px; float: left; } | |
| 131 | +.photonic-random-layout .photonic-thumb { margin: 0; position: relative; padding: 2px; float: left; } | |
| 154 | 132 | .photonic-random-layout .photonic-thumb a { box-sizing: border-box; padding: 0; width: 100%; height: 100%; color: transparent; } |
| 155 | -.photonic-random-layout .photonic-thumb a img { width: 100% !important; height: 100% !important; padding: 0; display: none; } | |
| 133 | +.photonic-random-layout .photonic-thumb a img { width: 100% !important; height: 100% !important; padding: 0; } | |
| 156 | 134 | .photonic-stream .photonic-random-layout .photonic-thumb { margin: 0; } |
| 157 | 135 | |
| 136 | +.sizes-present .photonic-thumb img { visibility: hidden; } | |
| 137 | +.photonic-masonry-layout.sizes-missing .photonic-thumb a img, .photonic-masonry-horizontal-layout.sizes-missing .photonic-thumb a img, .photonic-mosaic-layout.sizes-missing .photonic-thumb a img, .photonic-random-layout.sizes-missing .photonic-thumb a img { display: none; } | |
| 138 | + | |
| 139 | +/* The Justified Grid CSS is based on the solution provided here: https://stackoverflow.com/a/49107319 */ | |
| 140 | +.photonic-random-layout.sizes-present { display: flex !important; flex-wrap: wrap } | |
| 141 | +.photonic-random-layout.sizes-present .photonic-thumb, .photonic-random-layout.sizes-present::after { --ratio: calc(var(--dw) / var(--dh)); flex-basis: calc(var(--ratio) * var(--tile-min-height)) } | |
| 142 | +.photonic-stream .photonic-random-layout.sizes-present .photonic-thumb { flex-grow:calc(var(--ratio) * 100) } | |
| 143 | +.photonic-random-layout.sizes-present .photonic-thumb a img { max-width:100%; } | |
| 144 | +.photonic-random-layout.sizes-present::after { --dw: 2; --dh: 1; content: ''; flex-grow: 1000000 } | |
| 145 | + | |
| 146 | +.photonic-standard-layout:after, .photonic-random-layout:after, .photonic-mosaic-layout:after, .photonic-masonry-layout:after, .photonic-masonry-horizontal-layout:after { | |
| 147 | + clear: both; | |
| 148 | + display: table; | |
| 149 | + content: ""; | |
| 150 | +} | |
| 151 | + | |
| 158 | 152 | a.photonic-level-3-expand { |
| 159 | 153 | float: right; |
| 160 | 154 | text-decoration: none; |
| 161 | - -webkit-box-shadow: none; | |
| 162 | - -moz-box-shadow: none; | |
| 163 | 155 | box-shadow: none; |
| 164 | 156 | width: 1.5em; |
| 165 | 157 | height: 1.5em; |
| 166 | 158 | border-radius: 50%; |
| 167 | - background: #fff url('../../../images/Icons.svg?v=2.19') no-repeat; | |
| 159 | + background: #fff url('../../../images/Icons.svg?v=3.04') no-repeat; | |
| 168 | 160 | background-size: 100%; |
| 169 | 161 | } |
| 170 | 162 | a.photonic-level-3-expand-plus { |
| 171 | 163 | background-position: 0 -7.5em; |
| @@ -187,8 +179,9 @@ | ||
| 187 | 179 | border-radius: 50%; |
| 188 | 180 | } |
| 189 | 181 | |
| 190 | 182 | .photonic-title-info { position: relative; } |
| 183 | +.photonic-standard-layout .photonic-title-info { margin: 0 auto; } | |
| 191 | 184 | .title-display-hover-slidedown-show .photonic-title-info { margin-top: -100%; } |
| 192 | 185 | .title-display-hover-slideup-show .photonic-thumb a img, .title-display-slideup-stick .photonic-thumb a img { padding: 0; } |
| 193 | 186 | .title-display-hover-slideup-show a .photonic-title, .photonic-slideshow.title-display-hover-slideup-show li .photonic-title, |
| 194 | 187 | .title-display-slideup-stick a .photonic-title, .photonic-slideshow.title-display-slideup-stick li .photonic-title { |
| @@ -193,22 +186,26 @@ | ||
| 193 | 186 | .title-display-hover-slideup-show a .photonic-title, .photonic-slideshow.title-display-hover-slideup-show li .photonic-title, |
| 194 | 187 | .title-display-slideup-stick a .photonic-title, .photonic-slideshow.title-display-slideup-stick li .photonic-title { |
| 195 | 188 | background: #111; |
| 196 | 189 | background: rgba(33, 33, 33, 0.8); |
| 197 | - display: none; | |
| 190 | + height: 0; | |
| 191 | + /*transition: height 0.4s, padding-top 0.4s, padding-bottom 0.4s;*/ | |
| 192 | + transition: height 0.4s, padding 0.4s; | |
| 193 | + overflow: hidden; | |
| 198 | 194 | width: 100%; |
| 199 | 195 | font-size: 0.7em; |
| 200 | 196 | color: #ddd; |
| 201 | 197 | font-family: "Noto Sans", HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; |
| 202 | 198 | position: absolute; |
| 203 | - padding: 3px; | |
| 199 | + /*padding: 0;*/ | |
| 200 | + padding: 0 3px; | |
| 204 | 201 | text-align: left; |
| 205 | 202 | box-sizing: border-box; |
| 206 | 203 | } |
| 207 | 204 | |
| 208 | 205 | .title-display-hover-slideup-show a .photonic-title, .photonic-slideshow.title-display-hover-slideup-show li .photonic-title, .title-display-slideup-stick a .photonic-title, .photonic-slideshow.title-display-slideup-stick li .photonic-title { bottom: 0; } |
| 209 | -.photonic-slideshow.title-display-hover-slideup-show li .photonic-title, .photonic-slideshow.title-display-slideup-stick li .photonic-title { font-size: 1em; } | |
| 210 | -.photonic-standard-layout.title-display-slideup-stick a .photonic-title, .slideshow-grid-panel.title-display-slideup-stick a .photonic-title, .photonic-slideshow.title-display-slideup-stick li .photonic-title { display: block; } | |
| 206 | +.photonic-slideshow.title-display-hover-slideup-show li .photonic-title, .photonic-slideshow.title-display-slideup-stick li .photonic-title { font-size: 1rem; } | |
| 207 | +.photonic-standard-layout.title-display-slideup-stick a .photonic-title, .modal-gallery.title-display-slideup-stick a .photonic-title, .photonic-slideshow.title-display-slideup-stick li .photonic-title { display: block; } | |
| 211 | 208 | .photonic-slideshow.title-display-below li .photonic-title { |
| 212 | 209 | background-color: rgba(0, 0, 0, 0.75); |
| 213 | 210 | position: absolute; |
| 214 | 211 | bottom: 0; |
| @@ -217,19 +214,22 @@ | ||
| 217 | 214 | color: white; |
| 218 | 215 | width: 100%; |
| 219 | 216 | } |
| 220 | 217 | |
| 218 | +.title-display-hover-slideup-show a .photonic-title.slideup-show, .title-display-hover-slideup-show li .photonic-title.slideup-show, .title-display-slideup-stick a .photonic-title, .photonic-slideshow.title-display-slideup-stick li .photonic-title { height: auto; padding: 3px; } | |
| 219 | + | |
| 221 | 220 | .photonic-thumbnail-effect-opacity .photonic-thumb img { filter: alpha(opacity=75); opacity: 0.75; } |
| 222 | 221 | .photonic-thumbnail-effect-opacity .photonic-thumb a:hover img { filter: alpha(opacity=100); opacity: 1; } |
| 223 | 222 | |
| 224 | -.photonic-thumbnail-effect-zoom a img { -webkit-transition: transform 2s ease; -moz-transition: transform 2s ease; -ms-transition: transform 2s ease; -o-transition: transform 2s ease; transition: transform 2s ease; } | |
| 225 | -.photonic-thumbnail-effect-zoom a:hover img { -webkit-transform: scale(1.2); -moz-transform: scale(1.2); -ms-transform: scale(1.2); -o-transform: scale(1.2); transform: scale(1.2); } | |
| 226 | -.photonic-thumbnail-effect-zoom a, .photonic-thumbnail-effect-zoom a:hover { overflow: hidden; } | |
| 227 | - | |
| 228 | -.photonic-thumb a img { padding: 5px; display: inline-block; } | |
| 223 | +.photonic-thumb a img { padding: 5px; display: block; margin: 0 auto; } | |
| 229 | 224 | .photonic-thumb a { display: inline-block; text-align: center; text-decoration: none; font-size: 0.9em; vertical-align: middle; border: none; /*padding: 5px;*/ box-shadow: none; width: 100%; position: relative; } |
| 230 | 225 | .photonic-thumb a span { display: block; padding: 3px; width: 100%; } |
| 231 | 226 | |
| 227 | +.photonic-thumbnail-effect-zoom a img { transition: transform 2s ease; } | |
| 228 | +.photonic-thumbnail-effect-zoom a:hover img { transform: scale(1.2); } | |
| 229 | +.photonic-thumbnail-effect-zoom a, .photonic-thumbnail-effect-zoom a:hover { overflow: hidden; } | |
| 230 | +.photonic-standard-layout.photonic-thumbnail-effect-zoom a, .photonic-standard-layout.photonic-thumbnail-effect-zoom a:hover { width: auto; } | |
| 231 | + | |
| 232 | 232 | .photonic-object-header { list-style: none; display: inline-block; width: 100%; text-align: left; border-width: 1px 0 1px 0; border-style: dotted; border-color: #888; padding: 0.5em 0; margin: 0.5em 0; } |
| 233 | 233 | .photonic-header-thumb { float: left; margin: 0 1em 0 0; } |
| 234 | 234 | .photonic-header-details { overflow: hidden; } |
| 235 | 235 | .photonic-header-title { font-size: 120%; font-weight: bold; display: block; text-decoration: none; } |
| @@ -250,10 +250,17 @@ | ||
| 250 | 250 | display: none; |
| 251 | 251 | background: #fff url(../../../images/loading.gif) no-repeat center; |
| 252 | 252 | } |
| 253 | 253 | |
| 254 | +.photonic-thumb a.photonic-image-loading { | |
| 255 | + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cstyle%3E.spinner%7Btransform-origin:center;stroke:%2393BFEC;fill:%2393BFEC;animation:spinner_irSm .75s infinite linear%7D@keyframes spinner_irSm%7B100%25%7Btransform:rotate(360deg)%7D%7D%3C/style%3E%3Cpath d='M10.72,19.9a8,8,0,0,1-6.5-9.79A7.77,7.77,0,0,1,10.4,4.16a8,8,0,0,1,9.49,6.52A1.54,1.54,0,0,0,21.38,12h.13a1.37,1.37,0,0,0,1.38-1.54,11,11,0,1,0-12.7,12.39A1.54,1.54,0,0,0,12,21.34h0A1.47,1.47,0,0,0,10.72,19.9Z' class='spinner'/%3E%3C/svg%3E"); | |
| 256 | + background-size: 32px; | |
| 257 | + background-position: center; | |
| 258 | + background-repeat: no-repeat; | |
| 259 | + cursor: pointer; | |
| 260 | +} | |
| 261 | + | |
| 254 | 262 | .photonic-more-button, .photonic-more-button:visited, |
| 255 | -.photonic-login-box a.auth-button, .photonic-login-box a.auth-button:visited, | |
| 256 | 263 | .photonic-show-gallery-button, .photonic-show-gallery-button:visited { |
| 257 | 264 | padding: 10px 15px; |
| 258 | 265 | display: inline-block; |
| 259 | 266 | text-align: center; |
| @@ -269,9 +276,8 @@ | ||
| 269 | 276 | border-radius: 3px; |
| 270 | 277 | } |
| 271 | 278 | |
| 272 | 279 | .photonic-more-button:hover, .photonic-more-button:active, .photonic-more-button:focus, |
| 273 | -.photonic-login-box a.auth-button:hover, .photonic-login-box a.auth-button:active, .photonic-login-box a.auth-button:focus, | |
| 274 | 280 | .photonic-show-gallery-button:hover, .photonic-show-gallery-button:active, .photonic-show-gallery-button:focus { |
| 275 | 281 | text-decoration: none; |
| 276 | 282 | color: #fff; |
| 277 | 283 | background: #48d; |
| @@ -277,24 +283,16 @@ | ||
| 277 | 283 | background: #48d; |
| 278 | 284 | background: linear-gradient(#224477 20%, #336699 100%); |
| 279 | 285 | } |
| 280 | 286 | |
| 281 | -.photonic-login-box { | |
| 282 | - border: 1px solid #888; | |
| 283 | - padding: 10px; | |
| 284 | - border-radius: 5px; | |
| 285 | - display: block; | |
| 286 | - clear: both; | |
| 287 | -} | |
| 288 | - | |
| 289 | -.photonic-auth-button, .photonic-more-button { | |
| 287 | +.photonic-more-button { | |
| 290 | 288 | margin: 0 auto; |
| 291 | 289 | text-align: center; |
| 292 | 290 | } |
| 293 | -.photonic-more-link-container { | |
| 294 | - text-align: right; | |
| 295 | - display: inline-block; | |
| 296 | - width: 100%; | |
| 291 | + | |
| 292 | +.photonic-js-load-button { | |
| 293 | + display: none !important; | |
| 294 | + visibility: hidden !important; | |
| 297 | 295 | } |
| 298 | 296 | |
| 299 | 297 | .photonic-panel-header { top: 0; left: 0; padding: 10px 0; text-align: left; font-weight: bold; border-bottom: 5px solid #787878; color: #787878; position: relative; display: table; width: 100%; border-top: none; margin: 0; } |
| 300 | 298 | .photonic-panel-header div { vertical-align: middle; margin: 0 5px; } |
| @@ -367,17 +365,9 @@ | ||
| 367 | 365 | text-transform: none; |
| 368 | 366 | font-weight: normal; |
| 369 | 367 | } |
| 370 | 368 | |
| 371 | -#TB_overlay { z-index: 1050 !important; } | |
| 372 | -#TB_window { z-index: 1060 !important; } | |
| 373 | - | |
| 374 | -#fancybox-right, #fancybox-left { width: 15%; } | |
| 375 | -#fancybox-wrap, #fancybox-content { box-sizing: content-box; } | |
| 376 | - | |
| 377 | -.fancybox-inner { overflow: auto !important; } | |
| 378 | -.photonic-fancybox .fancybox-inner { overflow: hidden !important; } | |
| 379 | - | |
| 369 | +/** Modal */ | |
| 380 | 370 | .photonicModalOverlay { |
| 381 | 371 | width: 100%; |
| 382 | 372 | height: 100%; |
| 383 | 373 | top: 0; |
| @@ -391,8 +381,9 @@ | ||
| 391 | 381 | .photonicModalOverlayScrollable { |
| 392 | 382 | display: inline-block; |
| 393 | 383 | width: 100%; |
| 394 | 384 | text-align: center; |
| 385 | + transition: height 1s ease-out; | |
| 395 | 386 | } |
| 396 | 387 | |
| 397 | 388 | .photonicModal { margin: 0 auto; } |
| 398 | 389 | |
| @@ -412,9 +403,9 @@ | ||
| 412 | 403 | z-index: 10000; |
| 413 | 404 | } |
| 414 | 405 | |
| 415 | 406 | .photonic-icon { |
| 416 | - background-image: url("../../../images/Icons.svg?v=2.19"); | |
| 407 | + background-image: url("../../../images/Icons.svg?v=2.3.04"); | |
| 417 | 408 | background-size: 100%; |
| 418 | 409 | width: 96px; |
| 419 | 410 | height: 96px; |
| 420 | 411 | display: block; |
| @@ -422,14 +413,39 @@ | ||
| 422 | 413 | } |
| 423 | 414 | .photonic-error-icon { background-position: 0 -768px; } |
| 424 | 415 | .photonic-error .photonic-icon { float: left; } |
| 425 | 416 | .photonic-error .photonic-message { margin-left: 100px; display: block; } |
| 426 | -.photonic-error { display: block; width: 100%; box-sizing: border-box; position: relative; padding: 1em 0; } | |
| 417 | +.photonic-error { display: inline-block; width: 100%; box-sizing: border-box; position: relative; padding: 1em 0; } | |
| 427 | 418 | |
| 428 | 419 | .photonic-html5-external { display: none; } |
| 429 | 420 | |
| 430 | -.pswp__item .photonic-video { text-align: center; position: relative; top: 50%; transform: translateY(-50%); } | |
| 421 | +.pswp__item .photonic-video { text-align: center; position: relative; height: 100%; width: 100%; } | |
| 422 | +.pswp__item .photonic-video video, .pswp__item .photonic-video iframe { position: absolute; top: 50%; transform: translate(-50%, -50%); max-height: 100%; max-width: 100%; } | |
| 431 | 423 | |
| 424 | +.pswp__custom-caption { | |
| 425 | + background: rgba(33, 33, 33, 0.75); | |
| 426 | + font-size: 16px; | |
| 427 | + color: #fff; | |
| 428 | + width: calc(100% - 32px); | |
| 429 | + max-width: 400px; | |
| 430 | + padding: 0 8px; | |
| 431 | + border-radius: 4px; | |
| 432 | + position: absolute; | |
| 433 | + left: 50%; | |
| 434 | + bottom: 16px; | |
| 435 | + transform: translateX(-50%); | |
| 436 | + text-align: center; | |
| 437 | +} | |
| 438 | +.pswp__custom-caption a { | |
| 439 | + color: #fff; | |
| 440 | + text-decoration: underline; | |
| 441 | +} | |
| 442 | +.photonic-pswp-caption { | |
| 443 | + padding: 0.5em 1em; | |
| 444 | +} | |
| 445 | +.photonic-pswp-social { display: flex; height: 60px; align-items: center; } | |
| 446 | +.photonic-pswp-social #photonic-social { background: rgba(0, 0, 0, 0); } | |
| 447 | + | |
| 432 | 448 | .mfp-inline-holder .mfp-content { text-align: center; } |
| 433 | 449 | .mfp-close-btn-in .mfp-inline-holder .mfp-close { color: #eee; } |
| 434 | 450 | .mfp-content #photonic-social { position: absolute; top: 45px; left: 5px; } |
| 435 | 451 | |
| @@ -440,16 +456,15 @@ | ||
| 440 | 456 | width: 100%; |
| 441 | 457 | box-sizing: border-box; |
| 442 | 458 | } |
| 443 | 459 | |
| 444 | -[data-photonic-stream-provider='flickr'] [data-photonic-media-type='video']:hover:before, | |
| 445 | -[data-photonic-stream-provider='smug'] [data-photonic-media-type='video']:hover:before, | |
| 446 | -[data-photonic-stream-provider='zenfolio'] [data-photonic-media-type='video']:hover:before, | |
| 447 | -[data-photonic-stream-provider='instagram'] [data-photonic-media-type='video']:hover:before { | |
| 460 | +[data-photonic-platform='flickr'] [data-photonic-media-type='video']:hover:before, | |
| 461 | +[data-photonic-platform='smug'] [data-photonic-media-type='video']:hover:before, | |
| 462 | +[data-photonic-platform='zenfolio'] [data-photonic-media-type='video']:hover:before, | |
| 463 | +[data-photonic-platform='instagram'] [data-photonic-media-type='video']:hover:before { | |
| 448 | 464 | content: ''; |
| 449 | - background-image: url("../../../images/Icons.svg?v=2.19"); | |
| 465 | + background-image: url("../../../images/Icons.svg?v=3.04"); | |
| 450 | 466 | background-size: 100%; |
| 451 | - -ms-background-position-y: -480px; | |
| 452 | 467 | background-position-y: -480px; |
| 453 | 468 | width: 48px; |
| 454 | 469 | height: 48px; |
| 455 | 470 | display: block; |
| @@ -460,8 +475,9 @@ | ||
| 460 | 475 | margin-left: -24px; |
| 461 | 476 | z-index: 1; |
| 462 | 477 | } |
| 463 | 478 | |
| 479 | +/** Tooltip */ | |
| 464 | 480 | .photonic-tooltip-container { |
| 465 | 481 | transform: translateZ(0); |
| 466 | 482 | position: absolute; |
| 467 | 483 | max-width: 300px; |
| @@ -468,9 +484,8 @@ | ||
| 468 | 484 | padding: 8px 10px 10px; |
| 469 | 485 | font-family: "Noto Sans", HelveticaNeue-Light, "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif; |
| 470 | 486 | font-size: 14px; |
| 471 | 487 | font-weight: normal; |
| 472 | - -webkit-box-shadow: 0 0 5px #aaa; | |
| 473 | 488 | box-shadow: 0 0 5px #aaa; |
| 474 | 489 | background: #2d2d2d; |
| 475 | 490 | color: #eee; |
| 476 | 491 | border-radius: 4px; |
| @@ -477,11 +492,8 @@ | ||
| 477 | 492 | opacity: 1; |
| 478 | 493 | z-index: 9999; |
| 479 | 494 | } |
| 480 | 495 | .photonic-tooltip-container[class*=" tooltip-"] { |
| 481 | - -webkit-animation: tooltip-anim 0.8s; | |
| 482 | - -moz-animation: tooltip-anim 0.8s; | |
| 483 | - -o-animation: tooltip-anim 0.8s; | |
| 484 | 496 | animation: tooltip-anim 0.8s; |
| 485 | 497 | } |
| 486 | 498 | .photonic-tooltip-container::after { |
| 487 | 499 | position: absolute; |
| @@ -516,4 +528,60 @@ | ||
| 516 | 528 | display: none; |
| 517 | 529 | } |
| 518 | 530 | |
| 519 | 531 | .photonic-show-gallery-button { display: block; margin: 1rem 0; border-width: 0; } |
| 532 | + | |
| 533 | +/** Slideshow */ | |
| 534 | +.photonic-slideshow, .photonic-slideshow-thumbs { position: relative; width: 100%; } | |
| 535 | +.photonic-slideshow-content { margin: 1em 0; } | |
| 536 | +.photonic-slideshow-adapt-height .splide__track { transition: height 1000ms ease-in-out; } | |
| 537 | +.photonic-slideshow-adapt-height .splide__slide { vertical-align: top; } | |
| 538 | +.photonic-slideshow .splide__slide__container { text-align: center; } | |
| 539 | +.photonic-slideshow-thumbs.js-thumbnails { text-align: center; } | |
| 540 | +.photonic-slideshow-thumbs .thumbnails__list { list-style: none; margin: 0.5em 0; padding: 0; } | |
| 541 | +.photonic-slideshow-thumbs .thumbnails__item { display: inline-block; } | |
| 542 | +.photonic-slideshow-thumbs .thumbnails__item img { opacity: 70%; } | |
| 543 | +.photonic-slideshow-thumbs .thumbnails__item.is-active img, .photonic-slideshow-thumbs .thumbnails__item:hover img { opacity: 100%; } | |
| 544 | + | |
| 545 | +.photonic-slideshow-thumbs.js-thumbnails { padding: 0 75px; } | |
| 546 | +.photonic-slideshow-thumbs .splide__track { margin: 0.5em 0; } | |
| 547 | +.photonic-slideshow-thumbs .splide__slide { opacity: 50%; transition: opacity .2s cubic-bezier(.54,.01,.1,1); display: inline-block; } | |
| 548 | +.photonic-slideshow-thumbs .splide__slide.is-active, .photonic-slideshow-thumbs .splide__slide:hover { opacity: 100%; } | |
| 549 | +.splide--nav>.splide__track>.splide__list>.splide__slide.is-active { border: none; } | |
| 550 | +.splide--draggable>.splide__track>.splide__list>.splide__slide { display: inline-block; } | |
| 551 | + | |
| 552 | +.photonic-slideshow-img img { display: none; } | |
| 553 | +.photonic-slideshow-thumbs img { display: none; } | |
| 554 | + | |
| 555 | +.is-visible { | |
| 556 | + display: block; | |
| 557 | + height: auto; | |
| 558 | + opacity: 1; | |
| 559 | +} | |
| 560 | + | |
| 561 | +.fade-in { | |
| 562 | + animation: fadeIn ease 1s; | |
| 563 | +} | |
| 564 | + | |
| 565 | +@keyframes fadeIn { | |
| 566 | + 0% {opacity:0;} | |
| 567 | + 100% {opacity:1;} | |
| 568 | +} | |
| 569 | + | |
| 570 | +.photonic-can-slide { | |
| 571 | + overflow: hidden; | |
| 572 | + transition: height .5s, padding-top .5s, padding-bottom .5s, margin-top 0.5s, margin-bottom 0.5s; | |
| 573 | + height: auto; | |
| 574 | +} | |
| 575 | +.photonic-can-slide-hide { | |
| 576 | + height: 0; | |
| 577 | + padding-top: 0; | |
| 578 | + padding-bottom: 0; | |
| 579 | + margin-top: 0; | |
| 580 | + margin-bottom: 0; | |
| 581 | +} | |
| 582 | + | |
| 583 | +.no-scroll .vbox-content { min-height: auto; height: 100%; } | |
| 584 | +.no-scroll .vbox-child { height: 100%; box-shadow: none; background-color: transparent !important; display: flex; align-items: center; } | |
| 585 | +.no-scroll .vbox-container { overflow-y: hidden; } | |
| 586 | +.no-scroll .vbox-container img { max-height: 90%; } | |
| 587 | +.vbox-content video.photonic { margin: 0 auto; } | |
