├── .DS_Store ├── .gitattributes ├── README.md ├── admin ├── .DS_Store └── base.png ├── css ├── entypo.css ├── entypo.woff ├── plugins.css └── style.css ├── images ├── eight.jpg ├── five.jpg ├── four.jpg ├── nine.jpg ├── one.jpg ├── seven.jpg ├── six.jpg ├── three.jpg └── two.jpg ├── index.html └── js ├── jquery.min.js ├── plugins.js └── scripts.js /.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/.DS_Store -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | *.md linguist-language=js 2 | *.html linguist-language=js 3 | *.css linguist-language=js -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |
2 | 3 | # Vertical Menu Hover Animation | Crimson 4 | 5 | 6 | 7 | ### by SUBUX 8 | 9 |
-------------------------------------------------------------------------------- /admin/.DS_Store: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/admin/.DS_Store -------------------------------------------------------------------------------- /admin/base.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/admin/base.png -------------------------------------------------------------------------------- /css/entypo.css: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | 3 | @font-face { 4 | font-family: 'entypo'; 5 | src: url('entypo.eot'); 6 | src: url('entypo.eot?#iefix') format('embedded-opentype'), 7 | url('entypo.woff') format('woff'), 8 | url('entypo.ttf') format('truetype'), 9 | url('entypo.svg#entypo') format('svg'); 10 | font-weight: normal; font-style: normal; 11 | } 12 | 13 | [class^="icon-"], [class*=" icon-"] { 14 | font-family: entypo; 15 | font-style: normal; 16 | 17 | /* font-size: 14px; */ 18 | 19 | display: inline-block; 20 | width: 1.1em; 21 | margin-right: .1em; 22 | text-align: center; 23 | } 24 | 25 | .the-icons li { 26 | font-size: 14px; 27 | line-height: 24px; 28 | height: 24px; 29 | } 30 | 31 | .icon-note:before { content: "\266a"; } /* '\266a' */ 32 | .icon-note-beamed:before { content: "\266b"; } /* '\266b' */ 33 | .icon-music:before { content: "🎵"; } /* '\1f3b5' */ 34 | .icon-search:before { content: "🔍"; } /* '\1f50d' */ 35 | .icon-flashlight:before { content: "🔦"; } /* '\1f526' */ 36 | .icon-mail:before { content: "\2709"; } /* '\2709' */ 37 | .icon-heart:before { content: "\2665"; } /* '\2665' */ 38 | .icon-heart-empty:before { content: "\2661"; } /* '\2661' */ 39 | .icon-star:before { content: "\2605"; } /* '\2605' */ 40 | .icon-star-empty:before { content: "\2606"; } /* '\2606' */ 41 | .icon-user:before { content: "👤"; } /* '\1f464' */ 42 | .icon-users:before { content: "👥"; } /* '\1f465' */ 43 | .icon-user-add:before { content: "\e700"; } /* '\e700' */ 44 | .icon-video:before { content: "🎬"; } /* '\1f3ac' */ 45 | .icon-picture:before { content: "🌄"; } /* '\1f304' */ 46 | .icon-camera:before { content: "📷"; } /* '\1f4f7' */ 47 | .icon-layout:before { content: "\268f"; } /* '\268f' */ 48 | .icon-menu:before { content: "\2630"; } /* '\2630' */ 49 | .icon-check:before { content: "\2713"; } /* '\2713' */ 50 | .icon-cancel:before { content: "\2715"; } /* '\2715' */ 51 | .icon-cancel-circled:before { content: "\2716"; } /* '\2716' */ 52 | .icon-cancel-squared:before { content: "\274e"; } /* '\274e' */ 53 | .icon-plus:before { content: "\2b"; } /* '\2b' */ 54 | .icon-plus-circled:before { content: "\2795"; } /* '\2795' */ 55 | .icon-plus-squared:before { content: "\229e"; } /* '\229e' */ 56 | .icon-minus:before { content: "\2d"; } /* '\2d' */ 57 | .icon-minus-circled:before { content: "\2796"; } /* '\2796' */ 58 | .icon-minus-squared:before { content: "\229f"; } /* '\229f' */ 59 | .icon-help:before { content: "\2753"; } /* '\2753' */ 60 | .icon-help-circled:before { content: "\e704"; } /* '\e704' */ 61 | .icon-info:before { content: "\2139"; } /* '\2139' */ 62 | .icon-info-circled:before { content: "\e705"; } /* '\e705' */ 63 | .icon-back:before { content: "🔙"; } /* '\1f519' */ 64 | .icon-home:before { content: "\2302"; } /* '\2302' */ 65 | .icon-link:before { content: "🔗"; } /* '\1f517' */ 66 | .icon-attach:before { content: "📎"; } /* '\1f4ce' */ 67 | .icon-lock:before { content: "🔒"; } /* '\1f512' */ 68 | .icon-lock-open:before { content: "🔓"; } /* '\1f513' */ 69 | .icon-eye:before { content: "\e70a"; } /* '\e70a' */ 70 | .icon-tag:before { content: "\e70c"; } /* '\e70c' */ 71 | .icon-bookmark:before { content: "🔖"; } /* '\1f516' */ 72 | .icon-bookmarks:before { content: "📑"; } /* '\1f4d1' */ 73 | .icon-flag:before { content: "\2691"; } /* '\2691' */ 74 | .icon-thumbs-up:before { content: "👍"; } /* '\1f44d' */ 75 | .icon-thumbs-down:before { content: "👎"; } /* '\1f44e' */ 76 | .icon-download:before { content: "📥"; } /* '\1f4e5' */ 77 | .icon-upload:before { content: "📤"; } /* '\1f4e4' */ 78 | .icon-upload-cloud:before { content: "\e711"; } /* '\e711' */ 79 | .icon-reply:before { content: "\e712"; } /* '\e712' */ 80 | .icon-reply-all:before { content: "\e713"; } /* '\e713' */ 81 | .icon-forward:before { content: "\27a6"; } /* '\27a6' */ 82 | .icon-quote:before { content: "\275e"; } /* '\275e' */ 83 | .icon-code:before { content: "\e714"; } /* '\e714' */ 84 | .icon-export:before { content: "\e715"; } /* '\e715' */ 85 | .icon-pencil:before { content: "\270e"; } /* '\270e' */ 86 | .icon-feather:before { content: "\2712"; } /* '\2712' */ 87 | .icon-print:before { content: "\e716"; } /* '\e716' */ 88 | .icon-retweet:before { content: "\e717"; } /* '\e717' */ 89 | .icon-keyboard:before { content: "\2328"; } /* '\2328' */ 90 | .icon-comment:before { content: "\e718"; } /* '\e718' */ 91 | .icon-chat:before { content: "\e720"; } /* '\e720' */ 92 | .icon-bell:before { content: "🔔"; } /* '\1f514' */ 93 | .icon-attention:before { content: "\26a0"; } /* '\26a0' */ 94 | .icon-alert:before { content: "💥"; } /* '\1f4a5' */ 95 | .icon-vcard:before { content: "\e722"; } /* '\e722' */ 96 | .icon-address:before { content: "\e723"; } /* '\e723' */ 97 | .icon-location:before { content: "\e724"; } /* '\e724' */ 98 | .icon-map:before { content: "\e727"; } /* '\e727' */ 99 | .icon-direction:before { content: "\27a2"; } /* '\27a2' */ 100 | .icon-compass:before { content: "\e728"; } /* '\e728' */ 101 | .icon-cup:before { content: "\2615"; } /* '\2615' */ 102 | .icon-trash:before { content: "\e729"; } /* '\e729' */ 103 | .icon-doc:before { content: "\e730"; } /* '\e730' */ 104 | .icon-docs:before { content: "\e736"; } /* '\e736' */ 105 | .icon-doc-landscape:before { content: "\e737"; } /* '\e737' */ 106 | .icon-doc-text:before { content: "📄"; } /* '\1f4c4' */ 107 | .icon-doc-text-inv:before { content: "\e731"; } /* '\e731' */ 108 | .icon-newspaper:before { content: "📰"; } /* '\1f4f0' */ 109 | .icon-book-open:before { content: "📖"; } /* '\1f4d6' */ 110 | .icon-book:before { content: "📕"; } /* '\1f4d5' */ 111 | .icon-folder:before { content: "📁"; } /* '\1f4c1' */ 112 | .icon-archive:before { content: "\e738"; } /* '\e738' */ 113 | .icon-box:before { content: "📦"; } /* '\1f4e6' */ 114 | .icon-rss:before { content: "\e73a"; } /* '\e73a' */ 115 | .icon-phone:before { content: "📞"; } /* '\1f4de' */ 116 | .icon-cog:before { content: "\2699"; } /* '\2699' */ 117 | .icon-tools:before { content: "\2692"; } /* '\2692' */ 118 | .icon-share:before { content: "\e73c"; } /* '\e73c' */ 119 | .icon-shareable:before { content: "\e73e"; } /* '\e73e' */ 120 | .icon-basket:before { content: "\e73d"; } /* '\e73d' */ 121 | .icon-bag:before { content: "👜"; } /* '\1f45c' */ 122 | .icon-calendar:before { content: "📅"; } /* '\1f4c5' */ 123 | .icon-login:before { content: "\e740"; } /* '\e740' */ 124 | .icon-logout:before { content: "\e741"; } /* '\e741' */ 125 | .icon-mic:before { content: "🎤"; } /* '\1f3a4' */ 126 | .icon-mute:before { content: "🔇"; } /* '\1f507' */ 127 | .icon-sound:before { content: "🔊"; } /* '\1f50a' */ 128 | .icon-volume:before { content: "\e742"; } /* '\e742' */ 129 | .icon-clock:before { content: "🕔"; } /* '\1f554' */ 130 | .icon-hourglass:before { content: "\23f3"; } /* '\23f3' */ 131 | .icon-lamp:before { content: "💡"; } /* '\1f4a1' */ 132 | .icon-light-down:before { content: "🔅"; } /* '\1f505' */ 133 | .icon-light-up:before { content: "🔆"; } /* '\1f506' */ 134 | .icon-adjust:before { content: "\25d1"; } /* '\25d1' */ 135 | .icon-block:before { content: "🚫"; } /* '\1f6ab' */ 136 | .icon-resize-full:before { content: "\e744"; } /* '\e744' */ 137 | .icon-resize-small:before { content: "\e746"; } /* '\e746' */ 138 | .icon-popup:before { content: "\e74c"; } /* '\e74c' */ 139 | .icon-publish:before { content: "\e74d"; } /* '\e74d' */ 140 | .icon-window:before { content: "\e74e"; } /* '\e74e' */ 141 | .icon-arrow-combo:before { content: "\e74f"; } /* '\e74f' */ 142 | .icon-down-circled:before { content: "\e758"; } /* '\e758' */ 143 | .icon-left-circled:before { content: "\e759"; } /* '\e759' */ 144 | .icon-right-circled:before { content: "\e75a"; } /* '\e75a' */ 145 | .icon-up-circled:before { content: "\e75b"; } /* '\e75b' */ 146 | .icon-down-open:before { content: "\e75c"; } /* '\e75c' */ 147 | .icon-left-open:before { content: "\e75d"; } /* '\e75d' */ 148 | .icon-right-open:before { content: "\e75e"; } /* '\e75e' */ 149 | .icon-up-open:before { content: "\e75f"; } /* '\e75f' */ 150 | .icon-down-open-mini:before { content: "\e760"; } /* '\e760' */ 151 | .icon-left-open-mini:before { content: "\e761"; } /* '\e761' */ 152 | .icon-right-open-mini:before { content: "\e762"; } /* '\e762' */ 153 | .icon-up-open-mini:before { content: "\e763"; } /* '\e763' */ 154 | .icon-down-open-big:before { content: "\e764"; } /* '\e764' */ 155 | .icon-left-open-big:before { content: "\e765"; } /* '\e765' */ 156 | .icon-right-open-big:before { content: "\e766"; } /* '\e766' */ 157 | .icon-up-open-big:before { content: "\e767"; } /* '\e767' */ 158 | .icon-down:before { content: "\2b07"; } /* '\2b07' */ 159 | .icon-left:before { content: "\2b05"; } /* '\2b05' */ 160 | .icon-right:before { content: "\27a1"; } /* '\27a1' */ 161 | .icon-up:before { content: "\2b06"; } /* '\2b06' */ 162 | .icon-down-dir:before { content: "\25be"; } /* '\25be' */ 163 | .icon-left-dir:before { content: "\25c2"; } /* '\25c2' */ 164 | .icon-right-dir:before { content: "\25b8"; } /* '\25b8' */ 165 | .icon-up-dir:before { content: "\25b4"; } /* '\25b4' */ 166 | .icon-down-bold:before { content: "\e4b0"; } /* '\e4b0' */ 167 | .icon-left-bold:before { content: "\e4ad"; } /* '\e4ad' */ 168 | .icon-right-bold:before { content: "\e4ae"; } /* '\e4ae' */ 169 | .icon-up-bold:before { content: "\e4af"; } /* '\e4af' */ 170 | .icon-down-thin:before { content: "\2193"; } /* '\2193' */ 171 | .icon-left-thin:before { content: "\2190"; } /* '\2190' */ 172 | .icon-right-thin:before { content: "\2192"; } /* '\2192' */ 173 | .icon-up-thin:before { content: "\2191"; } /* '\2191' */ 174 | .icon-ccw:before { content: "\27f2"; } /* '\27f2' */ 175 | .icon-cw:before { content: "\27f3"; } /* '\27f3' */ 176 | .icon-arrows-ccw:before { content: "🔄"; } /* '\1f504' */ 177 | .icon-level-down:before { content: "\21b3"; } /* '\21b3' */ 178 | .icon-level-up:before { content: "\21b0"; } /* '\21b0' */ 179 | .icon-shuffle:before { content: "🔀"; } /* '\1f500' */ 180 | .icon-loop:before { content: "🔁"; } /* '\1f501' */ 181 | .icon-switch:before { content: "\21c6"; } /* '\21c6' */ 182 | .icon-play:before { content: "\25b6"; } /* '\25b6' */ 183 | .icon-stop:before { content: "\25a0"; } /* '\25a0' */ 184 | .icon-pause:before { content: "\2389"; } /* '\2389' */ 185 | .icon-record:before { content: "\26ab"; } /* '\26ab' */ 186 | .icon-to-end:before { content: "\23ed"; } /* '\23ed' */ 187 | .icon-to-start:before { content: "\23ee"; } /* '\23ee' */ 188 | .icon-fast-forward:before { content: "\23e9"; } /* '\23e9' */ 189 | .icon-fast-backward:before { content: "\23ea"; } /* '\23ea' */ 190 | .icon-progress-0:before { content: "\e768"; } /* '\e768' */ 191 | .icon-progress-1:before { content: "\e769"; } /* '\e769' */ 192 | .icon-progress-2:before { content: "\e76a"; } /* '\e76a' */ 193 | .icon-progress-3:before { content: "\e76b"; } /* '\e76b' */ 194 | .icon-target:before { content: "🎯"; } /* '\1f3af' */ 195 | .icon-palette:before { content: "🎨"; } /* '\1f3a8' */ 196 | .icon-list:before { content: "\e005"; } /* '\e005' */ 197 | .icon-list-add:before { content: "\e003"; } /* '\e003' */ 198 | .icon-signal:before { content: "📶"; } /* '\1f4f6' */ 199 | .icon-trophy:before { content: "🏆"; } /* '\1f3c6' */ 200 | .icon-battery:before { content: "🔋"; } /* '\1f50b' */ 201 | .icon-back-in-time:before { content: "\e771"; } /* '\e771' */ 202 | .icon-monitor:before { content: "💻"; } /* '\1f4bb' */ 203 | .icon-mobile:before { content: "📱"; } /* '\1f4f1' */ 204 | .icon-network:before { content: "\e776"; } /* '\e776' */ 205 | .icon-cd:before { content: "💿"; } /* '\1f4bf' */ 206 | .icon-inbox:before { content: "\e777"; } /* '\e777' */ 207 | .icon-install:before { content: "\e778"; } /* '\e778' */ 208 | .icon-globe:before { content: "🌎"; } /* '\1f30e' */ 209 | .icon-cloud:before { content: "\2601"; } /* '\2601' */ 210 | .icon-cloud-thunder:before { content: "\26c8"; } /* '\26c8' */ 211 | .icon-flash:before { content: "\26a1"; } /* '\26a1' */ 212 | .icon-moon:before { content: "\263d"; } /* '\263d' */ 213 | .icon-flight:before { content: "\2708"; } /* '\2708' */ 214 | .icon-paper-plane:before { content: "\e79b"; } /* '\e79b' */ 215 | .icon-leaf:before { content: "🍂"; } /* '\1f342' */ 216 | .icon-lifebuoy:before { content: "\e788"; } /* '\e788' */ 217 | .icon-mouse:before { content: "\e789"; } /* '\e789' */ 218 | .icon-briefcase:before { content: "💼"; } /* '\1f4bc' */ 219 | .icon-suitcase:before { content: "\e78e"; } /* '\e78e' */ 220 | .icon-dot:before { content: "\e78b"; } /* '\e78b' */ 221 | .icon-dot-2:before { content: "\e78c"; } /* '\e78c' */ 222 | .icon-dot-3:before { content: "\e78d"; } /* '\e78d' */ 223 | .icon-brush:before { content: "\e79a"; } /* '\e79a' */ 224 | .icon-magnet:before { content: "\e7a1"; } /* '\e7a1' */ 225 | .icon-infinity:before { content: "\221e"; } /* '\221e' */ 226 | .icon-erase:before { content: "\232b"; } /* '\232b' */ 227 | .icon-chart-pie:before { content: "\e751"; } /* '\e751' */ 228 | .icon-chart-line:before { content: "📈"; } /* '\1f4c8' */ 229 | .icon-chart-bar:before { content: "📊"; } /* '\1f4ca' */ 230 | .icon-chart-area:before { content: "🔾"; } /* '\1f53e' */ 231 | .icon-tape:before { content: "\2707"; } /* '\2707' */ 232 | .icon-graduation-cap:before { content: "🎓"; } /* '\1f393' */ 233 | .icon-language:before { content: "\e752"; } /* '\e752' */ 234 | .icon-ticket:before { content: "🎫"; } /* '\1f3ab' */ 235 | .icon-water:before { content: "💦"; } /* '\1f4a6' */ 236 | .icon-droplet:before { content: "💧"; } /* '\1f4a7' */ 237 | .icon-air:before { content: "\e753"; } /* '\e753' */ 238 | .icon-credit-card:before { content: "💳"; } /* '\1f4b3' */ 239 | .icon-floppy:before { content: "💾"; } /* '\1f4be' */ 240 | .icon-clipboard:before { content: "📋"; } /* '\1f4cb' */ 241 | .icon-megaphone:before { content: "📣"; } /* '\1f4e3' */ 242 | .icon-database:before { content: "\e754"; } /* '\e754' */ 243 | .icon-drive:before { content: "\e755"; } /* '\e755' */ 244 | .icon-bucket:before { content: "\e756"; } /* '\e756' */ 245 | .icon-thermometer:before { content: "\e757"; } /* '\e757' */ 246 | .icon-key:before { content: "🔑"; } /* '\1f511' */ 247 | .icon-flow-cascade:before { content: "\e790"; } /* '\e790' */ 248 | .icon-flow-branch:before { content: "\e791"; } /* '\e791' */ 249 | .icon-flow-tree:before { content: "\e792"; } /* '\e792' */ 250 | .icon-flow-line:before { content: "\e793"; } /* '\e793' */ 251 | .icon-flow-parallel:before { content: "\e794"; } /* '\e794' */ 252 | .icon-rocket:before { content: "🚀"; } /* '\1f680' */ 253 | .icon-gauge:before { content: "\e7a2"; } /* '\e7a2' */ 254 | .icon-traffic-cone:before { content: "\e7a3"; } /* '\e7a3' */ 255 | .icon-cc:before { content: "\e7a5"; } /* '\e7a5' */ 256 | .icon-cc-by:before { content: "\e7a6"; } /* '\e7a6' */ 257 | .icon-cc-nc:before { content: "\e7a7"; } /* '\e7a7' */ 258 | .icon-cc-nc-eu:before { content: "\e7a8"; } /* '\e7a8' */ 259 | .icon-cc-nc-jp:before { content: "\e7a9"; } /* '\e7a9' */ 260 | .icon-cc-sa:before { content: "\e7aa"; } /* '\e7aa' */ 261 | .icon-cc-nd:before { content: "\e7ab"; } /* '\e7ab' */ 262 | .icon-cc-pd:before { content: "\e7ac"; } /* '\e7ac' */ 263 | .icon-cc-zero:before { content: "\e7ad"; } /* '\e7ad' */ 264 | .icon-cc-share:before { content: "\e7ae"; } /* '\e7ae' */ 265 | .icon-cc-remix:before { content: "\e7af"; } /* '\e7af' */ 266 | .icon-github:before { content: "\f300"; } /* '\f300' */ 267 | .icon-github-circled:before { content: "\f301"; } /* '\f301' */ 268 | .icon-flickr:before { content: "\f303"; } /* '\f303' */ 269 | .icon-flickr-circled:before { content: "\f304"; } /* '\f304' */ 270 | .icon-vimeo:before { content: "\f306"; } /* '\f306' */ 271 | .icon-vimeo-circled:before { content: "\f307"; } /* '\f307' */ 272 | .icon-twitter:before { content: "\f309"; } /* '\f309' */ 273 | .icon-twitter-circled:before { content: "\f30a"; } /* '\f30a' */ 274 | .icon-facebook:before { content: "\f30c"; } /* '\f30c' */ 275 | .icon-facebook-circled:before { content: "\f30d"; } /* '\f30d' */ 276 | .icon-facebook-squared:before { content: "\f30e"; } /* '\f30e' */ 277 | .icon-gplus:before { content: "\f30f"; } /* '\f30f' */ 278 | .icon-gplus-circled:before { content: "\f310"; } /* '\f310' */ 279 | .icon-pinterest:before { content: "\f312"; } /* '\f312' */ 280 | .icon-pinterest-circled:before { content: "\f313"; } /* '\f313' */ 281 | .icon-tumblr:before { content: "\f315"; } /* '\f315' */ 282 | .icon-tumblr-circled:before { content: "\f316"; } /* '\f316' */ 283 | .icon-linkedin:before { content: "\f318"; } /* '\f318' */ 284 | .icon-linkedin-circled:before { content: "\f319"; } /* '\f319' */ 285 | .icon-dribbble:before { content: "\f31b"; } /* '\f31b' */ 286 | .icon-dribbble-circled:before { content: "\f31c"; } /* '\f31c' */ 287 | .icon-stumbleupon:before { content: "\f31e"; } /* '\f31e' */ 288 | .icon-stumbleupon-circled:before { content: "\f31f"; } /* '\f31f' */ 289 | .icon-lastfm:before { content: "\f321"; } /* '\f321' */ 290 | .icon-lastfm-circled:before { content: "\f322"; } /* '\f322' */ 291 | .icon-rdio:before { content: "\f324"; } /* '\f324' */ 292 | .icon-rdio-circled:before { content: "\f325"; } /* '\f325' */ 293 | .icon-spotify:before { content: "\f327"; } /* '\f327' */ 294 | .icon-spotify-circled:before { content: "\f328"; } /* '\f328' */ 295 | .icon-qq:before { content: "\f32a"; } /* '\f32a' */ 296 | .icon-instagrem:before { content: "\f32d"; } /* '\f32d' */ 297 | .icon-dropbox:before { content: "\f330"; } /* '\f330' */ 298 | .icon-evernote:before { content: "\f333"; } /* '\f333' */ 299 | .icon-flattr:before { content: "\f336"; } /* '\f336' */ 300 | .icon-skype:before { content: "\f339"; } /* '\f339' */ 301 | .icon-skype-circled:before { content: "\f33a"; } /* '\f33a' */ 302 | .icon-renren:before { content: "\f33c"; } /* '\f33c' */ 303 | .icon-sina-weibo:before { content: "\f33f"; } /* '\f33f' */ 304 | .icon-paypal:before { content: "\f342"; } /* '\f342' */ 305 | .icon-picasa:before { content: "\f345"; } /* '\f345' */ 306 | .icon-soundcloud:before { content: "\f348"; } /* '\f348' */ 307 | .icon-mixi:before { content: "\f34b"; } /* '\f34b' */ 308 | .icon-behance:before { content: "\f34e"; } /* '\f34e' */ 309 | .icon-google-circles:before { content: "\f351"; } /* '\f351' */ 310 | .icon-vkontakte:before { content: "\f354"; } /* '\f354' */ 311 | .icon-smashing:before { content: "\f357"; } /* '\f357' */ 312 | .icon-sweden:before { content: "\f601"; } /* '\f601' */ 313 | .icon-db-shape:before { content: "\f600"; } /* '\f600' */ 314 | .icon-logo-db:before { content: "\f603"; } /* '\f603' */ 315 | 316 | -------------------------------------------------------------------------------- /css/entypo.woff: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/css/entypo.woff -------------------------------------------------------------------------------- /css/style.css: -------------------------------------------------------------------------------- 1 | * { 2 | margin: 0; 3 | padding: 0; 4 | border: 0; 5 | font-size: 100%; 6 | font: inherit; 7 | vertical-align: baseline; 8 | } 9 | 10 | body { 11 | overflow-x: hidden; 12 | line-height: 1; 13 | } 14 | 15 | ol, 16 | ul { 17 | list-style: none; 18 | } 19 | 20 | blockquote, 21 | q { 22 | quotes: none; 23 | } 24 | 25 | blockquote:before, 26 | blockquote:after, 27 | q:before, 28 | q:after { 29 | content: ''; 30 | content: none; 31 | } 32 | 33 | table { 34 | border-collapse: collapse; 35 | border-spacing: 0; 36 | } 37 | 38 | body { 39 | margin: 0; 40 | font-family: 'Archivo', sans-serif; 41 | background-color: #ededed; 42 | color: #121212 43 | } 44 | 45 | 46 | body, 47 | html { 48 | font-size: 16px; 49 | } 50 | 51 | main { 52 | display: block; 53 | } 54 | 55 | h1 { 56 | font-size: 2em; 57 | margin: 0.67em 0; 58 | } 59 | 60 | 61 | 62 | 63 | a { 64 | background-color: transparent; 65 | } 66 | 67 | b, 68 | strong { 69 | font-weight: bolder; 70 | } 71 | 72 | 73 | 74 | 75 | small { 76 | font-size: 80%; 77 | } 78 | 79 | sub, 80 | sup { 81 | font-size: 75%; 82 | line-height: 0; 83 | position: relative; 84 | vertical-align: baseline; 85 | } 86 | 87 | sub { 88 | bottom: -0.25em; 89 | } 90 | 91 | sup { 92 | top: -0.5em; 93 | } 94 | 95 | img { 96 | border-style: none; 97 | } 98 | 99 | 100 | 101 | 102 | button, 103 | [type="button"], 104 | [type="reset"], 105 | [type="submit"] { 106 | border: none; 107 | background: none; 108 | font-size: 14px; 109 | text-transform: uppercase; 110 | font-weight: 600; 111 | position: relative; 112 | display: block; 113 | padding: 0; 114 | color: #ededed 115 | } 116 | 117 | button::before { 118 | content: ""; 119 | position: absolute; 120 | width: 98%; 121 | height: 2px; 122 | bottom: -2px; 123 | right: 0; 124 | background: #ededed; 125 | -webkit-transition: all 0.3s; 126 | -o-transition: all 0.3s; 127 | transition: all 0.3s; 128 | } 129 | 130 | .button:hover::before { 131 | width: 0; 132 | } 133 | 134 | /** 135 | * Remove the inner border and padding in Firefox. 136 | */ 137 | 138 | button::-moz-focus-inner, 139 | [type="button"]::-moz-focus-inner, 140 | [type="reset"]::-moz-focus-inner, 141 | [type="submit"]::-moz-focus-inner { 142 | border-style: none; 143 | padding: 0; 144 | } 145 | 146 | /** 147 | * Restore the focus styles unset by the previous rule. 148 | */ 149 | 150 | button:-moz-focusring, 151 | [type="button"]:-moz-focusring, 152 | [type="reset"]:-moz-focusring, 153 | [type="submit"]:-moz-focusring { 154 | outline: 1px dotted ButtonText; 155 | } 156 | 157 | .field-wrap, 158 | .message-wrap { 159 | position: relative; 160 | margin-bottom: 75px; 161 | width: 100%; 162 | display: block; 163 | float: left; 164 | 165 | } 166 | 167 | .field-wrap::before, 168 | .message-wrap::before, 169 | .field-wrap::after, 170 | .message-wrap::after { 171 | content: ""; 172 | display: block; 173 | position: absolute; 174 | width: 100%; 175 | height: 1px; 176 | background: rgba(187, 187, 187, .3); 177 | z-index: 2; 178 | bottom: 0; 179 | } 180 | 181 | .field-wrap::after, 182 | .message-wrap::after { 183 | background: #ededed; 184 | -webkit-transition: all .6s ease; 185 | -o-transition: all .6s ease; 186 | transition: all .6s ease; 187 | width: 0; 188 | } 189 | 190 | .field-active::after { 191 | width: 100% 192 | } 193 | 194 | 195 | 196 | label { 197 | width: 30%; 198 | float: left; 199 | font-size: 14px; 200 | font-weight: 500; 201 | letter-spacing: 1px; 202 | padding: 20px 20px; 203 | color: #ededed; 204 | } 205 | 206 | input[type="text"], 207 | input[type="email"] { 208 | border: none; 209 | width: 70%; 210 | display: block; 211 | background: transparent; 212 | } 213 | 214 | textarea:focus, 215 | input:focus { 216 | outline: none !important 217 | } 218 | 219 | textarea { 220 | border: none; 221 | width: 70%; 222 | display: block; 223 | background: transparent; 224 | } 225 | 226 | ::-webkit-input-placeholder { 227 | color: #8f8d8d; 228 | font-size: 12px; 229 | letter-spacing: 1px 230 | } 231 | 232 | ::-moz-placeholder { 233 | color: #8f8d8d; 234 | font-size: 12px; 235 | letter-spacing: 1px 236 | } 237 | 238 | :-ms-input-placeholder { 239 | color: #8f8d8d; 240 | font-size: 12px; 241 | letter-spacing: 1px 242 | } 243 | 244 | ::-ms-input-placeholder { 245 | color: #8f8d8d; 246 | font-size: 12px; 247 | letter-spacing: 1px 248 | } 249 | 250 | ::placeholder { 251 | color: #8f8d8d; 252 | font-size: 12px; 253 | letter-spacing: 1px 254 | } 255 | 256 | .privacy-wrap, 257 | .send-wrap { 258 | display: block; 259 | } 260 | 261 | .privacy-wrap { 262 | float: left; 263 | padding-left: 20px; 264 | } 265 | 266 | .send-wrap { 267 | float: right; 268 | padding-right: 20px; 269 | } 270 | 271 | .privacy-wrap span { 272 | font-size: 14px; 273 | font-weight: 500; 274 | letter-spacing: 1px; 275 | margin-left: 10px; 276 | color: #ededed; 277 | } 278 | 279 | /** 280 | * Correct the padding in Firefox. 281 | */ 282 | 283 | fieldset { 284 | padding: 0.35em 0.75em 0.625em; 285 | } 286 | 287 | /** 288 | * 1. Correct the text wrapping in Edge and IE. 289 | * 2. Correct the color inheritance from `fieldset` elements in IE. 290 | * 3. Remove the padding so developers are not caught out when they zero out 291 | * `fieldset` elements in all browsers. 292 | */ 293 | 294 | legend { 295 | -webkit-box-sizing: border-box; 296 | box-sizing: border-box; 297 | /* 1 */ 298 | color: inherit; 299 | /* 2 */ 300 | display: table; 301 | /* 1 */ 302 | max-width: 100%; 303 | /* 1 */ 304 | padding: 0; 305 | /* 3 */ 306 | white-space: normal; 307 | /* 1 */ 308 | } 309 | 310 | /** 311 | * Add the correct vertical alignment in Chrome, Firefox, and Opera. 312 | */ 313 | 314 | progress { 315 | vertical-align: baseline; 316 | } 317 | 318 | /** 319 | * Remove the default vertical scrollbar in IE 10+. 320 | */ 321 | 322 | textarea { 323 | overflow: auto; 324 | } 325 | 326 | /** 327 | * 1. Add the correct box sizing in IE 10. 328 | * 2. Remove the padding in IE 10. 329 | */ 330 | 331 | [type="checkbox"], 332 | [type="radio"] { 333 | -webkit-box-sizing: border-box; 334 | box-sizing: border-box; 335 | /* 1 */ 336 | padding: 0; 337 | /* 2 */ 338 | } 339 | 340 | 341 | [type="number"]::-webkit-inner-spin-button, 342 | [type="number"]::-webkit-outer-spin-button { 343 | height: auto; 344 | } 345 | 346 | 347 | [type="search"] { 348 | -webkit-appearance: textfield; 349 | /* 1 */ 350 | outline-offset: -2px; 351 | /* 2 */ 352 | } 353 | 354 | [type="search"]::-webkit-search-decoration { 355 | -webkit-appearance: none; 356 | } 357 | 358 | 359 | ::-webkit-file-upload-button { 360 | -webkit-appearance: button; 361 | /* 1 */ 362 | font: inherit; 363 | /* 2 */ 364 | } 365 | 366 | 367 | 368 | 369 | 370 | 371 | details { 372 | display: block; 373 | } 374 | 375 | 376 | 377 | summary { 378 | display: list-item; 379 | } 380 | 381 | /* Misc 382 | ========================================================================== */ 383 | 384 | /** 385 | * Add the correct display in IE 10+. 386 | */ 387 | 388 | 389 | template { 390 | display: none; 391 | } 392 | 393 | /** 394 | * Add the correct display in IE 10. 395 | */ 396 | [hidden] { 397 | display: none; 398 | } 399 | 400 | 401 | 402 | body.layout-dark h1, 403 | body.layout-dark h2, 404 | body.layout-dark h3, 405 | body.layout-dark h4, 406 | body.layout-dark h5, 407 | body.layout-dark h6, 408 | body.layout-dark p { 409 | color: #ededed 410 | } 411 | 412 | body.layout-dark .caption { 413 | color: rgba(255, 255, 255, 0.49); 414 | } 415 | 416 | a.underline { 417 | position: relative; 418 | color: #121212 419 | } 420 | 421 | .layout-dark a.underline { 422 | color: #ededed 423 | } 424 | 425 | a.underline::before { 426 | content: ""; 427 | position: absolute; 428 | bottom: 0; 429 | right: 0; 430 | width: 100%; 431 | height: 1px; 432 | display: block; 433 | background: #121212; 434 | -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); 435 | -o-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); 436 | transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); 437 | } 438 | 439 | .layout-dark a.underline::before { 440 | background: #ededed 441 | } 442 | 443 | a.underline:hover { 444 | text-decoration: none; 445 | color: unset 446 | } 447 | 448 | a.underline:hover::before { 449 | width: 0; 450 | 451 | } 452 | 453 | 454 | h1.big-title a.underline::before { 455 | height: 7px; 456 | } 457 | 458 | 459 | .light a.underline, 460 | .light a.underline:hover { 461 | color: #121212 462 | } 463 | 464 | 465 | .light a.underline::before { 466 | background: #121212 467 | } 468 | 469 | h1 a.underline::before { 470 | height: 2px; 471 | } 472 | 473 | .lines { 474 | position: relative; 475 | } 476 | 477 | .line { 478 | display: block; 479 | width: 1px; 480 | height: 0; 481 | position: fixed; 482 | background: hsla(0, 0%, 48.6%, .2); 483 | z-index: -1; 484 | top: 0; 485 | pointer-events: none; 486 | 487 | } 488 | 489 | .line.page-change { 490 | z-index: 9999 491 | } 492 | 493 | 494 | .line-1 { 495 | left: 25%; 496 | } 497 | 498 | .line-2 { 499 | left: 50%; 500 | bottom: 0; 501 | top: unset; 502 | } 503 | 504 | .line-arange { 505 | z-index: 4 506 | } 507 | 508 | body.layout-dark .line-2::after { 509 | background: #121212 510 | } 511 | 512 | .line-after-out::after { 513 | opacity: 0; 514 | visibility: hidden; 515 | -webkit-transform: translate(-50%, -100%); 516 | -ms-transform: translate(-50%, -100%); 517 | transform: translate(-50%, -100%) 518 | } 519 | 520 | .line-3 { 521 | left: 75%; 522 | } 523 | 524 | .overlay { 525 | display: block; 526 | position: fixed; 527 | background: #121212; 528 | height: 0; 529 | width: 0; 530 | z-index: -2; 531 | top: 0; 532 | -webkit-transition: height .6s cubic-bezier(.645, .045, .355, 1); 533 | -o-transition: height .6s cubic-bezier(.645, .045, .355, 1); 534 | transition: height .6s cubic-bezier(.645, .045, .355, 1); 535 | border-right: 1px solid hsla(0, 0%, 48.6%, .2); 536 | } 537 | 538 | body.layout-dark .overlay { 539 | background: #ededed 540 | } 541 | 542 | .overlay-1 { 543 | left: 0; 544 | } 545 | 546 | .overlay-2 { 547 | left: 25%; 548 | -webkit-transition-delay: .03333s; 549 | -o-transition-delay: .03333s; 550 | transition-delay: .03333s 551 | } 552 | 553 | .overlay-3 { 554 | left: 50%; 555 | -webkit-transition-delay: .06667s; 556 | -o-transition-delay: .06667s; 557 | transition-delay: .06667s 558 | } 559 | 560 | .overlay-4 { 561 | left: 75%; 562 | -webkit-transition-delay: .1s; 563 | -o-transition-delay: .1s; 564 | transition-delay: .1s 565 | } 566 | 567 | .overlay-out { 568 | height: 0; 569 | } 570 | 571 | .overlay-ch-out { 572 | width: 0; 573 | } 574 | 575 | .loading-text { 576 | position: fixed; 577 | top: 50%; 578 | left: 50%; 579 | -webkit-transform: translate(-50%, -50%); 580 | -ms-transform: translate(-50%, -50%); 581 | transform: translate(-50%, -50%); 582 | font-size: 40px; 583 | text-transform: uppercase; 584 | z-index: 99999; 585 | letter-spacing: 20px; 586 | font-weight: 600; 587 | mix-blend-mode: difference; 588 | color: #ededed; 589 | opacity: 0; 590 | visibility: hidden; 591 | pointer-events: none; 592 | 593 | } 594 | 595 | .loading-text.page-change { 596 | opacity: 1; 597 | visibility: visible; 598 | } 599 | 600 | .loading-text .letter { 601 | display: inline-block 602 | } 603 | 604 | .overlay.page-change { 605 | width: 25%; 606 | height: 100%; 607 | background: #121212; 608 | z-index: 999; 609 | -webkit-transition: all 0s; 610 | -o-transition: all 0s; 611 | transition: all 0s; 612 | } 613 | 614 | .cygni-loader { 615 | position: fixed; 616 | bottom: 0; 617 | left: 50%; 618 | z-index: 999; 619 | overflow: hidden; 620 | padding-left: 10px; 621 | -webkit-transform: translateY(120%); 622 | -ms-transform: translateY(120%); 623 | transform: translateY(120%) 624 | } 625 | 626 | 627 | .counter { 628 | font-size: 22px; 629 | color: #404040; 630 | font-weight: 500; 631 | -webkit-transition: all 0.8s cubic-bezier(0.65, 0, 0.35, 1); 632 | -o-transition: all 0.8s cubic-bezier(0.65, 0, 0.35, 1); 633 | transition: all 0.8s cubic-bezier(0.65, 0, 0.35, 1); 634 | display: block; 635 | overflow: hidden 636 | } 637 | 638 | .counter::after { 639 | content: "%"; 640 | font-size: 11px; 641 | -webkit-transform: translate(100%, 100%); 642 | -ms-transform: translate(100%, 100%); 643 | transform: translate(100%, 100%); 644 | margin-left: 2px; 645 | vertical-align: top; 646 | } 647 | 648 | .cygni-loader.out .counter { 649 | -webkit-transform: translateX(-150%); 650 | -ms-transform: translateX(-150%); 651 | transform: translateX(-150%); 652 | } 653 | 654 | 655 | h5.cyg_widget-title { 656 | font-weight: 700; 657 | } 658 | 659 | .col-al-right { 660 | text-align: right; 661 | padding-right: 0; 662 | padding-left: 15px; 663 | } 664 | 665 | /*------------------------------------------------------------------ 666 | # Landing Page 667 | -------------------------------------------------------------------*/ 668 | 669 | 670 | .landing-section { 671 | position: absolute; 672 | top: 0; 673 | left: 0; 674 | width: 100%; 675 | overflow-x: hidden 676 | } 677 | 678 | 679 | .lc-header { 680 | position: relative; 681 | width: 100%; 682 | height: 100vh; 683 | } 684 | 685 | .lc-content { 686 | position: absolute; 687 | left: 10%; 688 | width: 30%; 689 | height: 100%; 690 | display: block; 691 | } 692 | 693 | 694 | .lc-images { 695 | position: absolute; 696 | right: 0; 697 | width: 60%; 698 | height: 100%; 699 | z-index: 1 700 | } 701 | 702 | 703 | .lc-images-sec { 704 | display: block; 705 | width: 150%; 706 | height: 33vh; 707 | } 708 | 709 | .lc-images-sec:nth-child(1), 710 | .lc-images-sec:nth-child(3) { 711 | margin-left: 23%; 712 | } 713 | 714 | .lc-image { 715 | max-width: 55%; 716 | height: 100%; 717 | display: block; 718 | float: left; 719 | margin-right: 40px; 720 | } 721 | 722 | .lc-image img { 723 | width: auto; 724 | height: 100%; 725 | 726 | } 727 | 728 | .lc-images-sec { 729 | /* height: 33vh; */ 730 | height: 33.33333333333%; 731 | padding: 20px 0; 732 | } 733 | 734 | .lc-top { 735 | position: absolute; 736 | top: 15%; 737 | white-space: nowrap; 738 | } 739 | 740 | .lc-top a { 741 | font-size: 12px; 742 | letter-spacing: 1px; 743 | text-transform: uppercase; 744 | margin-right: 40px; 745 | opacity: .5; 746 | color: #121212; 747 | text-decoration: none; 748 | } 749 | 750 | .ls-dark .lc-top a { 751 | color: #ededed 752 | } 753 | 754 | 755 | .lc-top .underline { 756 | font-size: 12px; 757 | letter-spacing: 1px; 758 | font-weight: 600; 759 | opacity: 1; 760 | } 761 | 762 | .lc-mid { 763 | position: absolute; 764 | top: 45%; 765 | -webkit-transform: translateY(-50%); 766 | -ms-transform: translateY(-50%); 767 | transform: translateY(-50%); 768 | } 769 | 770 | .lc-bottom { 771 | position: absolute; 772 | bottom: 10%; 773 | } 774 | 775 | .scroll-not { 776 | font-size: 12px; 777 | letter-spacing: 1px; 778 | color: #cacaca 779 | } 780 | 781 | .scroll-not::before { 782 | content: "\e764"; 783 | font-family: 'entypo'; 784 | margin-right: 10px; 785 | opacity: 1; 786 | } 787 | 788 | .lc-logo { 789 | width: 220px; 790 | margin-bottom: 60px; 791 | position: relative; 792 | } 793 | 794 | .lc-logo::after { 795 | content: "DARK"; 796 | color: #ededed; 797 | position: absolute; 798 | top: 0; 799 | right: -11px; 800 | -webkit-transform: translatex(100%); 801 | -ms-transform: translatex(100%); 802 | transform: translatex(100%); 803 | font-size: 12px; 804 | letter-spacing: 10px; 805 | font-weight: 400; 806 | } 807 | 808 | .lc-logo > img:nth-child(1) { 809 | width: 100%; 810 | } 811 | 812 | .lc-capt { 813 | color: #ededed; 814 | font-size: 10px; 815 | letter-spacing: 2px; 816 | opacity: .5; 817 | width: 200px; 818 | line-height: 22px; 819 | } 820 | 821 | 822 | .image-wrapper.landing-im { 823 | margin-bottom: 150px; 824 | z-index: 1 825 | } 826 | 827 | .left-ims .landing-im:nth-child(1) { 828 | margin-top: 150px; 829 | } 830 | 831 | .right-ims .landing-im { 832 | padding-left: 35px; 833 | } 834 | 835 | .left-ims .landing-im { 836 | padding-right: 35px; 837 | } 838 | 839 | .landing-im .caption { 840 | font-size: 10px; 841 | text-transform: uppercase; 842 | margin-left: 30px; 843 | } 844 | 845 | .landing-im a { 846 | text-decoration: none 847 | } 848 | 849 | .layout-light .lc-logo::after { 850 | color: #121212; 851 | content: "LIGHT" 852 | } 853 | 854 | .layout-light .lc-capt { 855 | color: #121212 856 | } 857 | 858 | .landing-select { 859 | position: absolute; 860 | top: 0; 861 | left: 0; 862 | width: 50%; 863 | height: 100%; 864 | overflow: hidden 865 | } 866 | 867 | .landing-select.lsc-dark { 868 | right: 0; 869 | left: unset; 870 | } 871 | 872 | .select-but { 873 | position: absolute; 874 | top: 50%; 875 | left: 50%; 876 | width: 200px; 877 | height: 200px; 878 | -webkit-transform: translate(-50%, -50%) rotate(45deg); 879 | -ms-transform: translate(-50%, -50%) rotate(45deg); 880 | transform: translate(-50%, -50%) rotate(45deg); 881 | z-index: 2; 882 | } 883 | 884 | .select-but::after { 885 | content: ""; 886 | position: absolute; 887 | display: block; 888 | top: 0; 889 | left: 0; 890 | width: 100%; 891 | height: 0; 892 | background: #ededed; 893 | z-index: -1; 894 | -webkit-transition: height .75s ease 1s; 895 | -o-transition: height .75s ease 1s; 896 | transition: height .75s ease 1s; 897 | } 898 | 899 | .loaded .select-but::after { 900 | height: 100% 901 | } 902 | 903 | .lsc-dark .select-but::after { 904 | background: #121212 905 | } 906 | 907 | 908 | .select-but .sb-span { 909 | position: absolute; 910 | top: 50%; 911 | left: 50%; 912 | -webkit-transform: translate(-50%, -50%) rotate(-45deg); 913 | -ms-transform: translate(-50%, -50%) rotate(-45deg); 914 | transform: translate(-50%, -50%) rotate(-45deg); 915 | text-decoration: none; 916 | color: hsla(0, 0%, 48.6%, 0.6); 917 | width: 100%; 918 | text-align: center; 919 | font-size: 16px; 920 | text-transform: uppercase; 921 | letter-spacing: 2px; 922 | font-weight: 600; 923 | background: transparent; 924 | opacity: 0; 925 | -webkit-transition: opacity 1s ease 2s; 926 | -o-transition: opacity 1s ease 2s; 927 | transition: opacity 1s ease 2s; 928 | 929 | } 930 | 931 | .loaded .select-but .sb-span { 932 | opacity: 1 933 | } 934 | 935 | /* Satır içi #4 | http://localhost/cygni-html/landing/ */ 936 | 937 | .select-but span { 938 | display: block; 939 | position: absolute; 940 | background: hsla(0, 0%, 48.6%, .2); 941 | -webkit-transition: all .3s ease; 942 | -o-transition: all .3s ease; 943 | transition: all .3s ease; 944 | width: 1px; 945 | height: 1px; 946 | opacity: 0; 947 | -webkit-transition: width 1s ease 1s, height 1s ease 1s; 948 | -o-transition: width 1s ease 1s, height 1s ease 1s; 949 | transition: width 1s ease 1s, height 1s ease 1s; 950 | } 951 | 952 | .select-but span::after { 953 | content: ""; 954 | display: block; 955 | width: 0; 956 | height: 0; 957 | background: hsl(0, 0%, 48.6%); 958 | -webkit-transition: all .6s ease; 959 | -o-transition: all .6s ease; 960 | transition: all .6s ease; 961 | } 962 | 963 | .select-but:hover span::after { 964 | width: 100%; 965 | height: 100% 966 | } 967 | 968 | 969 | .loaded .select-but span { 970 | opacity: 1; 971 | } 972 | 973 | /* Eleman | http://localhost/cygni-html/landing/ */ 974 | 975 | .loaded .select-but span:nth-child(1) { 976 | width: 100%; 977 | height: 1px; 978 | } 979 | 980 | /* Eleman | http://localhost/cygni-html/landing/ */ 981 | 982 | .loaded .select-but span:nth-child(2) { 983 | height: 100%; 984 | width: 1px; 985 | bottom: 0; 986 | } 987 | 988 | /* Eleman | http://localhost/cygni-html/landing/ */ 989 | 990 | .loaded .select-but span:nth-child(3) { 991 | width: 100%; 992 | height: 1px; 993 | bottom: 0; 994 | } 995 | 996 | /* Eleman | http://localhost/cygni-html/landing/ */ 997 | 998 | .loaded .select-but span:nth-child(4) { 999 | height: 100%; 1000 | width: 1px; 1001 | right: 0; 1002 | } 1003 | 1004 | .lsc-images { 1005 | width: 65%; 1006 | position: absolute; 1007 | top: 0; 1008 | left: 50%; 1009 | -webkit-transform: translateX(-50%); 1010 | -ms-transform: translateX(-50%); 1011 | transform: translateX(-50%); 1012 | -webkit-transform-origin: center; 1013 | -ms-transform-origin: center; 1014 | transform-origin: center; 1015 | -webkit-animation-name: lscIm; 1016 | animation-name: lscIm; 1017 | -webkit-animation-duration: 120s; 1018 | animation-duration: 120s; 1019 | -webkit-animation-play-state: running; 1020 | animation-play-state: running; 1021 | -webkit-animation-iteration-count: infinite; 1022 | animation-iteration-count: infinite; 1023 | opacity: 0; 1024 | -webkit-transition: opacity 1s linear 2s; 1025 | -o-transition: opacity 1s linear 2s; 1026 | transition: opacity 1s linear 2s; 1027 | } 1028 | 1029 | .loaded .lsc-images { 1030 | opacity: 1 1031 | } 1032 | 1033 | .lsc-dark .lsc-images { 1034 | -webkit-animation-name: lscImDark; 1035 | animation-name: lscImDark 1036 | } 1037 | 1038 | .lsc-dark .lsc-images { 1039 | bottom: 0; 1040 | top: unset 1041 | } 1042 | 1043 | .landing-select img { 1044 | width: 100%; 1045 | margin-bottom: 50px; 1046 | opacity: .2; 1047 | } 1048 | 1049 | @-webkit-keyframes lscIm { 1050 | 100% { 1051 | -webkit-transform: translateX(-50%) translateY(-100%); 1052 | transform: translateX(-50%) translateY(-100%); 1053 | } 1054 | } 1055 | 1056 | @keyframes lscIm { 1057 | 100% { 1058 | -webkit-transform: translateX(-50%) translateY(-100%); 1059 | transform: translateX(-50%) translateY(-100%); 1060 | } 1061 | } 1062 | 1063 | @-webkit-keyframes lscImDark { 1064 | 100% { 1065 | -webkit-transform: translateX(-50%) translateY(100%); 1066 | transform: translateX(-50%) translateY(100%); 1067 | } 1068 | } 1069 | 1070 | @keyframes lscImDark { 1071 | 100% { 1072 | -webkit-transform: translateX(-50%) translateY(100%); 1073 | transform: translateX(-50%) translateY(100%); 1074 | } 1075 | } 1076 | 1077 | .lsc-ov { 1078 | position: absolute; 1079 | width: 25%; 1080 | height: 0; 1081 | bottom: 0; 1082 | background: #ededed; 1083 | z-index: auto; 1084 | -webkit-transition: height .6s cubic-bezier(.645, .045, .355, 1); 1085 | -o-transition: height .6s cubic-bezier(.645, .045, .355, 1); 1086 | transition: height .6s cubic-bezier(.645, .045, .355, 1) 1087 | } 1088 | 1089 | .lsc-ov::after { 1090 | content: ""; 1091 | display: block; 1092 | position: fixed; 1093 | width: 25%; 1094 | height: 0; 1095 | -webkit-transition: all .6s cubic-bezier(.645, .045, .355, 1); 1096 | -o-transition: all .6s cubic-bezier(.645, .045, .355, 1); 1097 | transition: all .6s cubic-bezier(.645, .045, .355, 1); 1098 | bottom: 0; 1099 | z-index: 3; 1100 | 1101 | } 1102 | 1103 | .lsc-ov:nth-child(2)::after, 1104 | .lsc-ov:nth-child(1)::after { 1105 | background: #121212 1106 | } 1107 | 1108 | .lsc-ov:nth-child(1)::after, 1109 | .lsc-ov:nth-child(3)::after { 1110 | border-right: 1px solid hsla(0, 0%, 48.6%, .2); 1111 | } 1112 | 1113 | .lsc-ov:nth-child(3)::after { 1114 | border-left: 1px solid hsla(0, 0%, 48.6%, .2); 1115 | } 1116 | 1117 | .dark-in .lsc-ov:nth-child(1)::after, 1118 | .dark-in .lsc-ov:nth-child(2)::after { 1119 | height: 100% 1120 | } 1121 | 1122 | .light-in .lsc-ov:nth-child(3)::after, 1123 | .light-in .lsc-ov:nth-child(4)::after { 1124 | height: 100% 1125 | } 1126 | 1127 | .lsc-ov:nth-child(3)::after, 1128 | .lsc-ov:nth-child(4)::after { 1129 | background: #ededed 1130 | } 1131 | 1132 | .lsc-ov:nth-child(1)::after { 1133 | -webkit-transition-delay: .2s; 1134 | -o-transition-delay: .2s; 1135 | transition-delay: .2s 1136 | } 1137 | 1138 | .lsc-ov:nth-child(2)::after { 1139 | -webkit-transition-delay: .233s; 1140 | -o-transition-delay: .233s; 1141 | transition-delay: .233s 1142 | } 1143 | 1144 | .lsc-ov:nth-child(3)::after { 1145 | -webkit-transition-delay: .266s; 1146 | -o-transition-delay: .266s; 1147 | transition-delay: .266s 1148 | } 1149 | 1150 | .lsc-ov:nth-child(4)::after { 1151 | -webkit-transition-delay: .299s; 1152 | -o-transition-delay: .299s; 1153 | transition-delay: .299s 1154 | } 1155 | 1156 | .lsc-ov:nth-child(1) { 1157 | left: 0; 1158 | } 1159 | 1160 | .lsc-ov:nth-child(2) { 1161 | left: 25%; 1162 | -webkit-transition-delay: .233s; 1163 | -o-transition-delay: .233s; 1164 | transition-delay: .233s 1165 | } 1166 | 1167 | .lsc-ov:nth-child(3) { 1168 | left: 50%; 1169 | background: #121212; 1170 | -webkit-transition-delay: .266s; 1171 | -o-transition-delay: .266s; 1172 | transition-delay: .266s 1173 | } 1174 | 1175 | .lsc-ov:nth-child(4) { 1176 | left: 75%; 1177 | background: #121212; 1178 | -webkit-transition-delay: .299s; 1179 | -o-transition-delay: .299s; 1180 | transition-delay: .299s 1181 | } 1182 | 1183 | .loaded .lsc-ov { 1184 | height: 100% 1185 | } 1186 | 1187 | .ls-out .lsc-images { 1188 | opacity: 0; 1189 | -webkit-transition: all .4s ease; 1190 | -o-transition: all .4s ease; 1191 | transition: all .4s ease; 1192 | } 1193 | 1194 | .ls-out .select-but span { 1195 | width: 0 !important; 1196 | height: 0 !important; 1197 | -webkit-transition: all 1s ease; 1198 | -o-transition: all 1s ease; 1199 | transition: all 1s ease 1200 | } 1201 | 1202 | .ls-out .select-but .sb-span { 1203 | opacity: 0; 1204 | -webkit-transition: all 1s ease; 1205 | -o-transition: all 1s ease; 1206 | transition: all 1s ease 1207 | } 1208 | 1209 | .ls-out .select-but::after { 1210 | height: 0; 1211 | -webkit-transition: all 1s ease; 1212 | -o-transition: all 1s ease; 1213 | transition: all 1s ease 1214 | } 1215 | 1216 | .overlay.ls-light-go { 1217 | bottom: 0; 1218 | top: unset; 1219 | height: 100%; 1220 | width: 25%; 1221 | background: #ededed; 1222 | z-index: 3; 1223 | border-right: 1px solid hsla(0, 0%, 48.6%, .2) 1224 | } 1225 | 1226 | .overlay.ls-dark-go { 1227 | bottom: 0; 1228 | top: unset; 1229 | height: 100%; 1230 | width: 25%; 1231 | background: #121212; 1232 | z-index: 3; 1233 | border-right: 1px solid hsla(0, 0%, 48.6%, .2) 1234 | } 1235 | 1236 | 1237 | /*------------------------------------------------------------------ 1238 | # Header 1239 | -------------------------------------------------------------------*/ 1240 | 1241 | .site-header { 1242 | position: absolute; 1243 | width: 100%; 1244 | height: 100%; 1245 | overflow: hidden 1246 | } 1247 | 1248 | /*------------------------------------------------------------------ 1249 | ## Site Branding 1250 | -------------------------------------------------------------------*/ 1251 | 1252 | .site-branding { 1253 | position: absolute; 1254 | top: 10vh; 1255 | left: 7vw; 1256 | z-index: 556; 1257 | width: 110px; 1258 | 1259 | } 1260 | 1261 | .site-branding img { 1262 | width: 100%; 1263 | -webkit-transform: translatey(-100%); 1264 | -ms-transform: translatey(-100%); 1265 | transform: translatey(-100%); 1266 | -webkit-transition: all .6s cubic-bezier(0.42, 0.4, 0.26, 1.01); 1267 | -o-transition: all .6s cubic-bezier(0.42, 0.4, 0.26, 1.01); 1268 | transition: all .6s cubic-bezier(0.42, 0.4, 0.26, 1.01); 1269 | -webkit-transform-origin: 0 0; 1270 | -ms-transform-origin: 0 0; 1271 | transform-origin: 0 0; 1272 | opacity: 0; 1273 | visibility: hidden; 1274 | } 1275 | 1276 | .site-branding img.logo-in { 1277 | -webkit-transform: none; 1278 | -ms-transform: none; 1279 | transform: none; 1280 | opacity: 1; 1281 | visibility: visible 1282 | } 1283 | 1284 | /*------------------------------------------------------------------ 1285 | ## Site Navigation 1286 | -------------------------------------------------------------------*/ 1287 | 1288 | .site-navigation { 1289 | position: relative; 1290 | z-index: 555; 1291 | width: 100%; 1292 | height: 0 1293 | } 1294 | 1295 | .site-navigation.nav-open { 1296 | height: 100% 1297 | } 1298 | 1299 | .menu-owrapper, 1300 | .menu-widget-wrapper { 1301 | visibility: hidden; 1302 | } 1303 | 1304 | 1305 | .menu-ov { 1306 | position: fixed; 1307 | height: 0; 1308 | background: #121212; 1309 | -webkit-transition: all .6s cubic-bezier(.645, .045, .355, 1); 1310 | -o-transition: all .6s cubic-bezier(.645, .045, .355, 1); 1311 | transition: all .6s cubic-bezier(.645, .045, .355, 1); 1312 | top: 0; 1313 | width: 25%; 1314 | } 1315 | 1316 | .menu-ov-1 { 1317 | left: 0; 1318 | border-right: 1px solid hsla(0, 0%, 48.6%, .2); 1319 | } 1320 | 1321 | 1322 | .listv2-wrapper { 1323 | position: absolute; 1324 | top: 0; 1325 | left: 25%; 1326 | height: 100vh; 1327 | overflow: visible !important; 1328 | } 1329 | 1330 | .list-v2 .project-image { 1331 | display: block; 1332 | position: absolute; 1333 | top: 60%; 1334 | width: 100%; 1335 | left: 0; 1336 | transition: all .6s ease; 1337 | transform: translateY(-50%); 1338 | opacity: 0; 1339 | visibility: hidden; 1340 | pointer-events: none; 1341 | } 1342 | 1343 | .list-v2 .project-image.active { 1344 | opacity: 1; 1345 | visibility: visible; 1346 | top: 50%; 1347 | } 1348 | 1349 | .list-v2 .project-image img { 1350 | width: 100%; 1351 | } 1352 | 1353 | .list-v2 .title { 1354 | font-size: 75px; 1355 | letter-spacing: -3px; 1356 | color: #191b1d; 1357 | display: inline-block; 1358 | } 1359 | 1360 | .list-v2 .category { 1361 | display: inline-block; 1362 | color: #191b1d; 1363 | margin-left: 20px; 1364 | } 1365 | 1366 | .list-v2 .category::before { 1367 | content: "/"; 1368 | } 1369 | 1370 | .listv2-project { 1371 | transition: all .3s cubic-bezier(0.22, 0.61, 0.36, 1); 1372 | position: relative; 1373 | 1374 | } 1375 | 1376 | .listv2-project a { 1377 | transform: translateY(100%); 1378 | opacity: 0; 1379 | padding: 35px 0; 1380 | display: inline-block; 1381 | } 1382 | 1383 | .lv2-space { 1384 | display: block; 1385 | width: 100%; 1386 | height: 30vh; 1387 | } 1388 | 1389 | .listv2-project::before { 1390 | content: attr(data-index); 1391 | position: absolute; 1392 | top: 50%; 1393 | left: 0; 1394 | transform: translate(-40px, -50%); 1395 | font-size: 12px; 1396 | font-weight: 600; 1397 | opacity: 0; 1398 | transition: all .3s ease; 1399 | } 1400 | 1401 | .listv2-wrapper.loaded .listv2-project::before{ 1402 | opacity: .5; 1403 | } 1404 | 1405 | 1406 | .listv2-project.hover { 1407 | margin-left: 20px; 1408 | opacity: 1; 1409 | 1410 | } 1411 | 1412 | .listv2-wrapper.hovered .listv2-project { 1413 | opacity: .3; 1414 | } 1415 | 1416 | .listv2-wrapper.hovered .listv2-project.hover { 1417 | opacity: 1 1418 | } 1419 | 1420 | .lv2-images { 1421 | position: fixed; 1422 | top: 0; 1423 | left: 50%; 1424 | width: 35%; 1425 | height: 100%; 1426 | z-index: -1; 1427 | } 1428 | 1429 | 1430 | .layout-dark .list-v2 .category { 1431 | color: #a2a2a2; 1432 | } 1433 | 1434 | .layout-dark .listv2-project::before { 1435 | color: #fff 1436 | } 1437 | -------------------------------------------------------------------------------- /images/eight.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/images/eight.jpg -------------------------------------------------------------------------------- /images/five.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/images/five.jpg -------------------------------------------------------------------------------- /images/four.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/images/four.jpg -------------------------------------------------------------------------------- /images/nine.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/images/nine.jpg -------------------------------------------------------------------------------- /images/one.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/images/one.jpg -------------------------------------------------------------------------------- /images/seven.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/images/seven.jpg -------------------------------------------------------------------------------- /images/six.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/images/six.jpg -------------------------------------------------------------------------------- /images/three.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/images/three.jpg -------------------------------------------------------------------------------- /images/two.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/python019/vertical-menu-hover-animation-js/a2c77e409bd39ee0f292b57cba1642f06be95545/images/two.jpg -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 |  2 | 3 | 4 | 5 | 6 | 7 | Vertical Menu Hover Animation 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 |
16 | 17 |
18 | 19 | 198 |
199 | 200 |
201 | 202 |
203 | 204 | 205 | 206 | 207 | 208 | -------------------------------------------------------------------------------- /js/jquery.min.js: -------------------------------------------------------------------------------- 1 | /*! jQuery v3.5.1 | (c) JS Foundation and other contributors | jquery.org/license */ 2 | !function(e,t){"use strict";"object"==typeof module&&"object"==typeof module.exports?module.exports=e.document?t(e,!0):function(e){if(!e.document)throw new Error("jQuery requires a window with a document");return t(e)}:t(e)}("undefined"!=typeof window?window:this,function(C,e){"use strict";var t=[],r=Object.getPrototypeOf,s=t.slice,g=t.flat?function(e){return t.flat.call(e)}:function(e){return t.concat.apply([],e)},u=t.push,i=t.indexOf,n={},o=n.toString,v=n.hasOwnProperty,a=v.toString,l=a.call(Object),y={},m=function(e){return"function"==typeof e&&"number"!=typeof e.nodeType},x=function(e){return null!=e&&e===e.window},E=C.document,c={type:!0,src:!0,nonce:!0,noModule:!0};function b(e,t,n){var r,i,o=(n=n||E).createElement("script");if(o.text=e,t)for(r in c)(i=t[r]||t.getAttribute&&t.getAttribute(r))&&o.setAttribute(r,i);n.head.appendChild(o).parentNode.removeChild(o)}function w(e){return null==e?e+"":"object"==typeof e||"function"==typeof e?n[o.call(e)]||"object":typeof e}var f="3.5.1",S=function(e,t){return new S.fn.init(e,t)};function p(e){var t=!!e&&"length"in e&&e.length,n=w(e);return!m(e)&&!x(e)&&("array"===n||0===t||"number"==typeof t&&0+~]|"+M+")"+M+"*"),U=new RegExp(M+"|>"),X=new RegExp(F),V=new RegExp("^"+I+"$"),G={ID:new RegExp("^#("+I+")"),CLASS:new RegExp("^\\.("+I+")"),TAG:new RegExp("^("+I+"|[*])"),ATTR:new RegExp("^"+W),PSEUDO:new RegExp("^"+F),CHILD:new RegExp("^:(only|first|last|nth|nth-last)-(child|of-type)(?:\\("+M+"*(even|odd|(([+-]|)(\\d*)n|)"+M+"*(?:([+-]|)"+M+"*(\\d+)|))"+M+"*\\)|)","i"),bool:new RegExp("^(?:"+R+")$","i"),needsContext:new RegExp("^"+M+"*[>+~]|:(even|odd|eq|gt|lt|nth|first|last)(?:\\("+M+"*((?:-\\d)?\\d*)"+M+"*\\)|)(?=[^-]|$)","i")},Y=/HTML$/i,Q=/^(?:input|select|textarea|button)$/i,J=/^h\d$/i,K=/^[^{]+\{\s*\[native \w/,Z=/^(?:#([\w-]+)|(\w+)|\.([\w-]+))$/,ee=/[+~]/,te=new RegExp("\\\\[\\da-fA-F]{1,6}"+M+"?|\\\\([^\\r\\n\\f])","g"),ne=function(e,t){var n="0x"+e.slice(1)-65536;return t||(n<0?String.fromCharCode(n+65536):String.fromCharCode(n>>10|55296,1023&n|56320))},re=/([\0-\x1f\x7f]|^-?\d)|^-$|[^\0-\x1f\x7f-\uFFFF\w-]/g,ie=function(e,t){return t?"\0"===e?"\ufffd":e.slice(0,-1)+"\\"+e.charCodeAt(e.length-1).toString(16)+" ":"\\"+e},oe=function(){T()},ae=be(function(e){return!0===e.disabled&&"fieldset"===e.nodeName.toLowerCase()},{dir:"parentNode",next:"legend"});try{H.apply(t=O.call(p.childNodes),p.childNodes),t[p.childNodes.length].nodeType}catch(e){H={apply:t.length?function(e,t){L.apply(e,O.call(t))}:function(e,t){var n=e.length,r=0;while(e[n++]=t[r++]);e.length=n-1}}}function se(t,e,n,r){var i,o,a,s,u,l,c,f=e&&e.ownerDocument,p=e?e.nodeType:9;if(n=n||[],"string"!=typeof t||!t||1!==p&&9!==p&&11!==p)return n;if(!r&&(T(e),e=e||C,E)){if(11!==p&&(u=Z.exec(t)))if(i=u[1]){if(9===p){if(!(a=e.getElementById(i)))return n;if(a.id===i)return n.push(a),n}else if(f&&(a=f.getElementById(i))&&y(e,a)&&a.id===i)return n.push(a),n}else{if(u[2])return H.apply(n,e.getElementsByTagName(t)),n;if((i=u[3])&&d.getElementsByClassName&&e.getElementsByClassName)return H.apply(n,e.getElementsByClassName(i)),n}if(d.qsa&&!N[t+" "]&&(!v||!v.test(t))&&(1!==p||"object"!==e.nodeName.toLowerCase())){if(c=t,f=e,1===p&&(U.test(t)||z.test(t))){(f=ee.test(t)&&ye(e.parentNode)||e)===e&&d.scope||((s=e.getAttribute("id"))?s=s.replace(re,ie):e.setAttribute("id",s=S)),o=(l=h(t)).length;while(o--)l[o]=(s?"#"+s:":scope")+" "+xe(l[o]);c=l.join(",")}try{return H.apply(n,f.querySelectorAll(c)),n}catch(e){N(t,!0)}finally{s===S&&e.removeAttribute("id")}}}return g(t.replace($,"$1"),e,n,r)}function ue(){var r=[];return function e(t,n){return r.push(t+" ")>b.cacheLength&&delete e[r.shift()],e[t+" "]=n}}function le(e){return e[S]=!0,e}function ce(e){var t=C.createElement("fieldset");try{return!!e(t)}catch(e){return!1}finally{t.parentNode&&t.parentNode.removeChild(t),t=null}}function fe(e,t){var n=e.split("|"),r=n.length;while(r--)b.attrHandle[n[r]]=t}function pe(e,t){var n=t&&e,r=n&&1===e.nodeType&&1===t.nodeType&&e.sourceIndex-t.sourceIndex;if(r)return r;if(n)while(n=n.nextSibling)if(n===t)return-1;return e?1:-1}function de(t){return function(e){return"input"===e.nodeName.toLowerCase()&&e.type===t}}function he(n){return function(e){var t=e.nodeName.toLowerCase();return("input"===t||"button"===t)&&e.type===n}}function ge(t){return function(e){return"form"in e?e.parentNode&&!1===e.disabled?"label"in e?"label"in e.parentNode?e.parentNode.disabled===t:e.disabled===t:e.isDisabled===t||e.isDisabled!==!t&&ae(e)===t:e.disabled===t:"label"in e&&e.disabled===t}}function ve(a){return le(function(o){return o=+o,le(function(e,t){var n,r=a([],e.length,o),i=r.length;while(i--)e[n=r[i]]&&(e[n]=!(t[n]=e[n]))})})}function ye(e){return e&&"undefined"!=typeof e.getElementsByTagName&&e}for(e in d=se.support={},i=se.isXML=function(e){var t=e.namespaceURI,n=(e.ownerDocument||e).documentElement;return!Y.test(t||n&&n.nodeName||"HTML")},T=se.setDocument=function(e){var t,n,r=e?e.ownerDocument||e:p;return r!=C&&9===r.nodeType&&r.documentElement&&(a=(C=r).documentElement,E=!i(C),p!=C&&(n=C.defaultView)&&n.top!==n&&(n.addEventListener?n.addEventListener("unload",oe,!1):n.attachEvent&&n.attachEvent("onunload",oe)),d.scope=ce(function(e){return a.appendChild(e).appendChild(C.createElement("div")),"undefined"!=typeof e.querySelectorAll&&!e.querySelectorAll(":scope fieldset div").length}),d.attributes=ce(function(e){return e.className="i",!e.getAttribute("className")}),d.getElementsByTagName=ce(function(e){return e.appendChild(C.createComment("")),!e.getElementsByTagName("*").length}),d.getElementsByClassName=K.test(C.getElementsByClassName),d.getById=ce(function(e){return a.appendChild(e).id=S,!C.getElementsByName||!C.getElementsByName(S).length}),d.getById?(b.filter.ID=function(e){var t=e.replace(te,ne);return function(e){return e.getAttribute("id")===t}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n=t.getElementById(e);return n?[n]:[]}}):(b.filter.ID=function(e){var n=e.replace(te,ne);return function(e){var t="undefined"!=typeof e.getAttributeNode&&e.getAttributeNode("id");return t&&t.value===n}},b.find.ID=function(e,t){if("undefined"!=typeof t.getElementById&&E){var n,r,i,o=t.getElementById(e);if(o){if((n=o.getAttributeNode("id"))&&n.value===e)return[o];i=t.getElementsByName(e),r=0;while(o=i[r++])if((n=o.getAttributeNode("id"))&&n.value===e)return[o]}return[]}}),b.find.TAG=d.getElementsByTagName?function(e,t){return"undefined"!=typeof t.getElementsByTagName?t.getElementsByTagName(e):d.qsa?t.querySelectorAll(e):void 0}:function(e,t){var n,r=[],i=0,o=t.getElementsByTagName(e);if("*"===e){while(n=o[i++])1===n.nodeType&&r.push(n);return r}return o},b.find.CLASS=d.getElementsByClassName&&function(e,t){if("undefined"!=typeof t.getElementsByClassName&&E)return t.getElementsByClassName(e)},s=[],v=[],(d.qsa=K.test(C.querySelectorAll))&&(ce(function(e){var t;a.appendChild(e).innerHTML="",e.querySelectorAll("[msallowcapture^='']").length&&v.push("[*^$]="+M+"*(?:''|\"\")"),e.querySelectorAll("[selected]").length||v.push("\\["+M+"*(?:value|"+R+")"),e.querySelectorAll("[id~="+S+"-]").length||v.push("~="),(t=C.createElement("input")).setAttribute("name",""),e.appendChild(t),e.querySelectorAll("[name='']").length||v.push("\\["+M+"*name"+M+"*="+M+"*(?:''|\"\")"),e.querySelectorAll(":checked").length||v.push(":checked"),e.querySelectorAll("a#"+S+"+*").length||v.push(".#.+[+~]"),e.querySelectorAll("\\\f"),v.push("[\\r\\n\\f]")}),ce(function(e){e.innerHTML="";var t=C.createElement("input");t.setAttribute("type","hidden"),e.appendChild(t).setAttribute("name","D"),e.querySelectorAll("[name=d]").length&&v.push("name"+M+"*[*^$|!~]?="),2!==e.querySelectorAll(":enabled").length&&v.push(":enabled",":disabled"),a.appendChild(e).disabled=!0,2!==e.querySelectorAll(":disabled").length&&v.push(":enabled",":disabled"),e.querySelectorAll("*,:x"),v.push(",.*:")})),(d.matchesSelector=K.test(c=a.matches||a.webkitMatchesSelector||a.mozMatchesSelector||a.oMatchesSelector||a.msMatchesSelector))&&ce(function(e){d.disconnectedMatch=c.call(e,"*"),c.call(e,"[s!='']:x"),s.push("!=",F)}),v=v.length&&new RegExp(v.join("|")),s=s.length&&new RegExp(s.join("|")),t=K.test(a.compareDocumentPosition),y=t||K.test(a.contains)?function(e,t){var n=9===e.nodeType?e.documentElement:e,r=t&&t.parentNode;return e===r||!(!r||1!==r.nodeType||!(n.contains?n.contains(r):e.compareDocumentPosition&&16&e.compareDocumentPosition(r)))}:function(e,t){if(t)while(t=t.parentNode)if(t===e)return!0;return!1},D=t?function(e,t){if(e===t)return l=!0,0;var n=!e.compareDocumentPosition-!t.compareDocumentPosition;return n||(1&(n=(e.ownerDocument||e)==(t.ownerDocument||t)?e.compareDocumentPosition(t):1)||!d.sortDetached&&t.compareDocumentPosition(e)===n?e==C||e.ownerDocument==p&&y(p,e)?-1:t==C||t.ownerDocument==p&&y(p,t)?1:u?P(u,e)-P(u,t):0:4&n?-1:1)}:function(e,t){if(e===t)return l=!0,0;var n,r=0,i=e.parentNode,o=t.parentNode,a=[e],s=[t];if(!i||!o)return e==C?-1:t==C?1:i?-1:o?1:u?P(u,e)-P(u,t):0;if(i===o)return pe(e,t);n=e;while(n=n.parentNode)a.unshift(n);n=t;while(n=n.parentNode)s.unshift(n);while(a[r]===s[r])r++;return r?pe(a[r],s[r]):a[r]==p?-1:s[r]==p?1:0}),C},se.matches=function(e,t){return se(e,null,null,t)},se.matchesSelector=function(e,t){if(T(e),d.matchesSelector&&E&&!N[t+" "]&&(!s||!s.test(t))&&(!v||!v.test(t)))try{var n=c.call(e,t);if(n||d.disconnectedMatch||e.document&&11!==e.document.nodeType)return n}catch(e){N(t,!0)}return 0":{dir:"parentNode",first:!0}," ":{dir:"parentNode"},"+":{dir:"previousSibling",first:!0},"~":{dir:"previousSibling"}},preFilter:{ATTR:function(e){return e[1]=e[1].replace(te,ne),e[3]=(e[3]||e[4]||e[5]||"").replace(te,ne),"~="===e[2]&&(e[3]=" "+e[3]+" "),e.slice(0,4)},CHILD:function(e){return e[1]=e[1].toLowerCase(),"nth"===e[1].slice(0,3)?(e[3]||se.error(e[0]),e[4]=+(e[4]?e[5]+(e[6]||1):2*("even"===e[3]||"odd"===e[3])),e[5]=+(e[7]+e[8]||"odd"===e[3])):e[3]&&se.error(e[0]),e},PSEUDO:function(e){var t,n=!e[6]&&e[2];return G.CHILD.test(e[0])?null:(e[3]?e[2]=e[4]||e[5]||"":n&&X.test(n)&&(t=h(n,!0))&&(t=n.indexOf(")",n.length-t)-n.length)&&(e[0]=e[0].slice(0,t),e[2]=n.slice(0,t)),e.slice(0,3))}},filter:{TAG:function(e){var t=e.replace(te,ne).toLowerCase();return"*"===e?function(){return!0}:function(e){return e.nodeName&&e.nodeName.toLowerCase()===t}},CLASS:function(e){var t=m[e+" "];return t||(t=new RegExp("(^|"+M+")"+e+"("+M+"|$)"))&&m(e,function(e){return t.test("string"==typeof e.className&&e.className||"undefined"!=typeof e.getAttribute&&e.getAttribute("class")||"")})},ATTR:function(n,r,i){return function(e){var t=se.attr(e,n);return null==t?"!="===r:!r||(t+="","="===r?t===i:"!="===r?t!==i:"^="===r?i&&0===t.indexOf(i):"*="===r?i&&-1:\x20\t\r\n\f]*)[\x20\t\r\n\f]*\/?>(?:<\/\1>|)$/i;function D(e,n,r){return m(n)?S.grep(e,function(e,t){return!!n.call(e,t,e)!==r}):n.nodeType?S.grep(e,function(e){return e===n!==r}):"string"!=typeof n?S.grep(e,function(e){return-1)[^>]*|#([\w-]+))$/;(S.fn.init=function(e,t,n){var r,i;if(!e)return this;if(n=n||j,"string"==typeof e){if(!(r="<"===e[0]&&">"===e[e.length-1]&&3<=e.length?[null,e,null]:q.exec(e))||!r[1]&&t)return!t||t.jquery?(t||n).find(e):this.constructor(t).find(e);if(r[1]){if(t=t instanceof S?t[0]:t,S.merge(this,S.parseHTML(r[1],t&&t.nodeType?t.ownerDocument||t:E,!0)),N.test(r[1])&&S.isPlainObject(t))for(r in t)m(this[r])?this[r](t[r]):this.attr(r,t[r]);return this}return(i=E.getElementById(r[2]))&&(this[0]=i,this.length=1),this}return e.nodeType?(this[0]=e,this.length=1,this):m(e)?void 0!==n.ready?n.ready(e):e(S):S.makeArray(e,this)}).prototype=S.fn,j=S(E);var L=/^(?:parents|prev(?:Until|All))/,H={children:!0,contents:!0,next:!0,prev:!0};function O(e,t){while((e=e[t])&&1!==e.nodeType);return e}S.fn.extend({has:function(e){var t=S(e,this),n=t.length;return this.filter(function(){for(var e=0;e\x20\t\r\n\f]*)/i,he=/^$|^module$|\/(?:java|ecma)script/i;ce=E.createDocumentFragment().appendChild(E.createElement("div")),(fe=E.createElement("input")).setAttribute("type","radio"),fe.setAttribute("checked","checked"),fe.setAttribute("name","t"),ce.appendChild(fe),y.checkClone=ce.cloneNode(!0).cloneNode(!0).lastChild.checked,ce.innerHTML="",y.noCloneChecked=!!ce.cloneNode(!0).lastChild.defaultValue,ce.innerHTML="",y.option=!!ce.lastChild;var ge={thead:[1,"","
"],col:[2,"","
"],tr:[2,"","
"],td:[3,"","
"],_default:[0,"",""]};function ve(e,t){var n;return n="undefined"!=typeof e.getElementsByTagName?e.getElementsByTagName(t||"*"):"undefined"!=typeof e.querySelectorAll?e.querySelectorAll(t||"*"):[],void 0===t||t&&A(e,t)?S.merge([e],n):n}function ye(e,t){for(var n=0,r=e.length;n",""]);var me=/<|&#?\w+;/;function xe(e,t,n,r,i){for(var o,a,s,u,l,c,f=t.createDocumentFragment(),p=[],d=0,h=e.length;d\s*$/g;function qe(e,t){return A(e,"table")&&A(11!==t.nodeType?t:t.firstChild,"tr")&&S(e).children("tbody")[0]||e}function Le(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function He(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Oe(e,t){var n,r,i,o,a,s;if(1===t.nodeType){if(Y.hasData(e)&&(s=Y.get(e).events))for(i in Y.remove(t,"handle events"),s)for(n=0,r=s[i].length;n").attr(n.scriptAttrs||{}).prop({charset:n.scriptCharset,src:n.url}).on("load error",i=function(e){r.remove(),i=null,e&&t("error"===e.type?404:200,e.type)}),E.head.appendChild(r[0])},abort:function(){i&&i()}}});var Ut,Xt=[],Vt=/(=)\?(?=&|$)|\?\?/;S.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=Xt.pop()||S.expando+"_"+Ct.guid++;return this[e]=!0,e}}),S.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Vt.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Vt.test(e.data)&&"data");if(a||"jsonp"===e.dataTypes[0])return r=e.jsonpCallback=m(e.jsonpCallback)?e.jsonpCallback():e.jsonpCallback,a?e[a]=e[a].replace(Vt,"$1"+r):!1!==e.jsonp&&(e.url+=(Et.test(e.url)?"&":"?")+e.jsonp+"="+r),e.converters["script json"]=function(){return o||S.error(r+" was not called"),o[0]},e.dataTypes[0]="json",i=C[r],C[r]=function(){o=arguments},n.always(function(){void 0===i?S(C).removeProp(r):C[r]=i,e[r]&&(e.jsonpCallback=t.jsonpCallback,Xt.push(r)),o&&m(i)&&i(o[0]),o=i=void 0}),"script"}),y.createHTMLDocument=((Ut=E.implementation.createHTMLDocument("").body).innerHTML="
",2===Ut.childNodes.length),S.parseHTML=function(e,t,n){return"string"!=typeof e?[]:("boolean"==typeof t&&(n=t,t=!1),t||(y.createHTMLDocument?((r=(t=E.implementation.createHTMLDocument("")).createElement("base")).href=E.location.href,t.head.appendChild(r)):t=E),o=!n&&[],(i=N.exec(e))?[t.createElement(i[1])]:(i=xe([e],t,o),o&&o.length&&S(o).remove(),S.merge([],i.childNodes)));var r,i,o},S.fn.load=function(e,t,n){var r,i,o,a=this,s=e.indexOf(" ");return-1").append(S.parseHTML(e)).find(r):e)}).always(n&&function(e,t){a.each(function(){n.apply(this,o||[e.responseText,t,e])})}),this},S.expr.pseudos.animated=function(t){return S.grep(S.timers,function(e){return t===e.elem}).length},S.offset={setOffset:function(e,t,n){var r,i,o,a,s,u,l=S.css(e,"position"),c=S(e),f={};"static"===l&&(e.style.position="relative"),s=c.offset(),o=S.css(e,"top"),u=S.css(e,"left"),("absolute"===l||"fixed"===l)&&-1<(o+u).indexOf("auto")?(a=(r=c.position()).top,i=r.left):(a=parseFloat(o)||0,i=parseFloat(u)||0),m(t)&&(t=t.call(e,n,S.extend({},s))),null!=t.top&&(f.top=t.top-s.top+a),null!=t.left&&(f.left=t.left-s.left+i),"using"in t?t.using.call(e,f):("number"==typeof f.top&&(f.top+="px"),"number"==typeof f.left&&(f.left+="px"),c.css(f))}},S.fn.extend({offset:function(t){if(arguments.length)return void 0===t?this:this.each(function(e){S.offset.setOffset(this,t,e)});var e,n,r=this[0];return r?r.getClientRects().length?(e=r.getBoundingClientRect(),n=r.ownerDocument.defaultView,{top:e.top+n.pageYOffset,left:e.left+n.pageXOffset}):{top:0,left:0}:void 0},position:function(){if(this[0]){var e,t,n,r=this[0],i={top:0,left:0};if("fixed"===S.css(r,"position"))t=r.getBoundingClientRect();else{t=this.offset(),n=r.ownerDocument,e=r.offsetParent||n.documentElement;while(e&&(e===n.body||e===n.documentElement)&&"static"===S.css(e,"position"))e=e.parentNode;e&&e!==r&&1===e.nodeType&&((i=S(e).offset()).top+=S.css(e,"borderTopWidth",!0),i.left+=S.css(e,"borderLeftWidth",!0))}return{top:t.top-i.top-S.css(r,"marginTop",!0),left:t.left-i.left-S.css(r,"marginLeft",!0)}}},offsetParent:function(){return this.map(function(){var e=this.offsetParent;while(e&&"static"===S.css(e,"position"))e=e.offsetParent;return e||re})}}),S.each({scrollLeft:"pageXOffset",scrollTop:"pageYOffset"},function(t,i){var o="pageYOffset"===i;S.fn[t]=function(e){return $(this,function(e,t,n){var r;if(x(e)?r=e:9===e.nodeType&&(r=e.defaultView),void 0===n)return r?r[i]:e[t];r?r.scrollTo(o?r.pageXOffset:n,o?n:r.pageYOffset):e[t]=n},t,e,arguments.length)}}),S.each(["top","left"],function(e,n){S.cssHooks[n]=$e(y.pixelPosition,function(e,t){if(t)return t=Be(e,n),Me.test(t)?S(e).position()[n]+"px":t})}),S.each({Height:"height",Width:"width"},function(a,s){S.each({padding:"inner"+a,content:s,"":"outer"+a},function(r,o){S.fn[o]=function(e,t){var n=arguments.length&&(r||"boolean"!=typeof e),i=r||(!0===e||!0===t?"margin":"border");return $(this,function(e,t,n){var r;return x(e)?0===o.indexOf("outer")?e["inner"+a]:e.document.documentElement["client"+a]:9===e.nodeType?(r=e.documentElement,Math.max(e.body["scroll"+a],r["scroll"+a],e.body["offset"+a],r["offset"+a],r["client"+a])):void 0===n?S.css(e,t,i):S.style(e,t,n,i)},s,n?e:void 0,n)}})}),S.each(["ajaxStart","ajaxStop","ajaxComplete","ajaxError","ajaxSuccess","ajaxSend"],function(e,t){S.fn[t]=function(e){return this.on(t,e)}}),S.fn.extend({bind:function(e,t,n){return this.on(e,null,t,n)},unbind:function(e,t){return this.off(e,null,t)},delegate:function(e,t,n,r){return this.on(t,e,n,r)},undelegate:function(e,t,n){return 1===arguments.length?this.off(e,"**"):this.off(t,e||"**",n)},hover:function(e,t){return this.mouseenter(e).mouseleave(t||e)}}),S.each("blur focus focusin focusout resize scroll click dblclick mousedown mouseup mousemove mouseover mouseout mouseenter mouseleave change select submit keydown keypress keyup contextmenu".split(" "),function(e,n){S.fn[n]=function(e,t){return 0'; 13 | i++; 14 | } 15 | 16 | $('.lines').prepend(line); 17 | 18 | while (c < 5) { 19 | overlay += ''; 20 | c++; 21 | } 22 | 23 | $('.overlays').prepend(overlay); 24 | 25 | if ($('.fullscreen-footer').length < 1) { 26 | 27 | $('.site-footer').prepend('') 28 | 29 | } 30 | 31 | if ($('.projects-nav').length > 0) { 32 | 33 | $('.projects-nav').prepend('') 34 | } 35 | 36 | 37 | var body = $('body'); 38 | var pageSettings = $('.page-settings'); 39 | 40 | var dataLayout = pageSettings.data('layout'); 41 | 42 | if (dataLayout != null) { 43 | var siteLayout = 'layout-' + dataLayout; 44 | 45 | body.addClass(siteLayout) 46 | } 47 | 48 | var dataHeaderStyle = pageSettings.data('header-style'); 49 | 50 | if (dataHeaderStyle != null) { 51 | var headerStyle = 'header-style-' + dataLayout; 52 | 53 | $('.site-header').addClass(dataHeaderStyle) 54 | } 55 | 56 | var dataMenuStyle = pageSettings.data('menu-style'); 57 | 58 | if (dataMenuStyle != null) { 59 | var menuStyle = 'menu-style-' + dataMenuStyle; 60 | 61 | $('.site-navigation').addClass(dataMenuStyle) 62 | 63 | } 64 | 65 | var dataMenuLayout = pageSettings.data('menu-layout'); 66 | 67 | if (dataMenuLayout != null) { 68 | var menuLayout = dataMenuLayout; 69 | 70 | $('.site-navigation').addClass(dataMenuLayout) 71 | 72 | } 73 | 74 | var dataBackground = pageSettings.data('background'); 75 | 76 | if (dataBackground != null) { 77 | var bodyBg = dataBackground 78 | 79 | body.css('background', dataBackground); 80 | $('.np-ov').css('background', dataBackground); 81 | 82 | } 83 | 84 | 85 | if ($('.single-project').length > 0) { 86 | 87 | $('.site-footer').addClass('project-footer'); 88 | 89 | } 90 | 91 | ///////////////////////////////////////////// Page Layout ///////////////////////////////////////////// 92 | 93 | ///////////////////////////////////////////// Site Navigation ///////////////////////////////////////////// 94 | 95 | $('.menu > li > a').each(function () { 96 | var dataHover = $(this).text(); 97 | 98 | var attrHref = $(this).attr('href'); 99 | 100 | if (attrHref === '#') { 101 | 102 | $(this).addClass('no-trans') 103 | } 104 | 105 | if ($('.site-navigation').hasClass('classic')) { 106 | 107 | $(this).wrapInner('') 108 | 109 | } else { 110 | $(this).attr('data-hover', dataHover); 111 | } 112 | 113 | }); 114 | 115 | $('.menu > li').on('mouseenter', function () { 116 | 117 | $('.menu > li').removeClass('menu-item-hover') 118 | $(this).addClass('menu-item-hover'); 119 | 120 | }); 121 | 122 | $('.menu > li').on('mouseleave', function () { 123 | 124 | $('.menu > li').removeClass('menu-item-hover') 125 | $('.menu > li.menu-item-active').addClass('menu-item-hover'); 126 | 127 | }); 128 | 129 | var scA = $('.scrolling-button a').marquee({ 130 | duplicated: true, 131 | delayBeforeStart: 0, 132 | }); 133 | 134 | scA.marquee('pause'); 135 | 136 | 137 | 138 | if ($(window).outerWidth() < 850) { 139 | $('.site-navigation').removeClass('classic') 140 | } 141 | 142 | 143 | $('.site-navigation .menu > li.menu-item.has-children').each(function () { 144 | 145 | $(this).prepend(''); 146 | 147 | }) 148 | 149 | $('.sub-toggle').on('click', function () { 150 | 151 | $(this).toggleClass('st-active') 152 | 153 | var parentLi = $(this).parent('li'); 154 | var openSub = parentLi.children('.sub-menu'); 155 | 156 | openSub.toggleClass('sub-menu-in') 157 | 158 | 159 | }); 160 | 161 | 162 | 163 | 164 | 165 | 166 | 167 | $(window).on('load', function () { 168 | 169 | 170 | 171 | var loadingAn = anime({ 172 | targets: '.line', 173 | height: '100%', 174 | duration: 10, 175 | delay: 0, 176 | easing: 'easeInOutCubic', 177 | begin: function (anim) { 178 | $('.cygni-loader').addClass('in'); 179 | }, 180 | complete: function (anim) { 181 | 182 | $('.cygni-loader').addClass('out'); 183 | 184 | setTimeout(function () { 185 | 186 | $('#main').addClass('loaded'); 187 | 188 | }, 100); 189 | 190 | setTimeout(function () { 191 | 192 | var peScroll = new LocomotiveScroll({ 193 | el: document.querySelector('#main'), 194 | smooth: false, 195 | 196 | }); 197 | 198 | window.peScroll = peScroll; 199 | 200 | }, 10); 201 | 202 | if ($('.portfolio-showcase').length < 1) { 203 | setTimeout(function () { 204 | 205 | if ($('.site-navigation').hasClass('classic')) { 206 | $('.site-navigation.classic .menu > li > a > span').each(function (i, element) { 207 | $(element).delay(i * 75).queue(function (next) { 208 | $(this).addClass('span-in'); 209 | next(); 210 | }); 211 | }); 212 | 213 | } else { 214 | $('.toggle-line').addClass('toggle-line-in'); 215 | } 216 | 217 | 218 | }, 10) 219 | 220 | setTimeout(function () { 221 | 222 | $('.site-branding img ').addClass('logo-in'); 223 | }, 10) 224 | 225 | } 226 | 227 | 228 | setTimeout(function () { 229 | 230 | $('.menu-item-active').addClass('menu-item-hover'); 231 | 232 | }, 10); 233 | 234 | 235 | 236 | } 237 | }) 238 | 239 | if ($('.list-v2').length > 0) { 240 | 241 | var project = $('.listv2-project'); 242 | 243 | Scrollbar.init(document.querySelector('.listv2-wrapper')); 244 | 245 | project.each(function (i) { 246 | i++ 247 | 248 | let $this = $(this), 249 | listv2Img = $this.find('.project-image'); 250 | 251 | listv2Img.addClass('image_' + i) 252 | 253 | 254 | 255 | $('.lv2-images').append(listv2Img); 256 | 257 | 258 | if (i < 10) { 259 | 260 | $this.attr('data-index', '0' + i); 261 | 262 | } else if (i > 9) { 263 | $this.attr('data-index', i); 264 | } 265 | 266 | $this.attr('data-image', '.image_' + i) 267 | 268 | 269 | 270 | }) 271 | 272 | 273 | $('.listv2-project a').on('mouseenter', function (i) { 274 | 275 | 276 | 277 | let $this = $(this), 278 | image = $this.parent('.listv2-project').attr('data-image'), 279 | allImages = $('.project-image'), 280 | allProjects = $('.listv2-project'); 281 | 282 | allImages.removeClass('active'); 283 | $(image).addClass('active'); 284 | 285 | $('.listv2-wrapper').addClass('hovered') 286 | 287 | allProjects.removeClass('hover') 288 | $this.parent(allProjects).addClass('hover'); 289 | 290 | 291 | 292 | 293 | }) 294 | 295 | $('.listv2-project a').on('mouseleave', function () { 296 | 297 | let $this = $(this), 298 | image = $this.children('.project-image'), 299 | allImages = $('.project-image'), 300 | allProjects = $('.listv2-project') 301 | 302 | $('.listv2-wrapper').removeClass('hovered'); 303 | allProjects.removeClass('hover'); 304 | allImages.removeClass('active'); 305 | 306 | }) 307 | 308 | 309 | 310 | loadingAn.finished.then(function () { 311 | 312 | 313 | setTimeout(function () { 314 | 315 | var lvaCome = anime({ 316 | autoplay: true, 317 | loop: false, 318 | translateY: [120, 0], 319 | opacity: [0, 1], 320 | easing: "easeOutCubic", 321 | duration: 800, 322 | targets: '.listv2-project a', 323 | delay: anime.stagger(100), 324 | complete: function (anim) { 325 | $('.listv2-wrapper').addClass('loaded'); 326 | } 327 | }); 328 | 329 | 330 | }, 500); 331 | 332 | setTimeout(function () { 333 | $('.site-branding img ').addClass('logo-in'); 334 | }, 1200); 335 | 336 | setTimeout(function () { 337 | $('.toggle-line').addClass('toggle-line-in'); 338 | 339 | 340 | }, 1700); 341 | 342 | setTimeout(function () { 343 | 344 | $('.fullscreen-footer a').each(function (i, element) { 345 | $(element).delay(i * 75).queue(function (next) { 346 | $(this).addClass('span-in'); 347 | next(); 348 | }); 349 | }); 350 | 351 | 352 | }, 1250); 353 | 354 | 355 | }); 356 | } 357 | }); 358 | 359 | 360 | 361 | 362 | })(jQuery); 363 | --------------------------------------------------------------------------------