diff --git a/custom.d.ts b/custom.d.ts index 3f11412..21128af 100644 --- a/custom.d.ts +++ b/custom.d.ts @@ -13,3 +13,8 @@ declare module '*.jpeg' { export default content; } +declare module '*.jpg' { + const content: any; + export default content; +} + diff --git a/package-lock.json b/package-lock.json index 13d2bbd..a93d2b7 100644 --- a/package-lock.json +++ b/package-lock.json @@ -4,6 +4,7 @@ "requires": true, "packages": { "": { + "hasInstallScript": true, "dependencies": { "@fortawesome/fontawesome-svg-core": "^6.5.2", "@fortawesome/free-brands-svg-icons": "^6.5.2", @@ -16,12 +17,16 @@ "history": "^5.3.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.22.3" + "react-outside-click-handler": "^1.3.0", + "react-responsive": "^10.0.0", + "react-router-dom": "^6.22.3", + "react-scroll": "^1.9.0" }, "devDependencies": { "@types/node": "^20.12.7", "@types/react": "^18.2.79", "@types/react-dom": "^18.2.25", + "@types/react-scroll": "^1.8.10", "parcel": "^2.12.0", "process": "^0.11.10", "typescript": "^5.4.5" @@ -2036,12 +2041,44 @@ "@types/react": "*" } }, + "node_modules/@types/react-scroll": { + "version": "1.8.10", + "resolved": "https://registry.npmjs.org/@types/react-scroll/-/react-scroll-1.8.10.tgz", + "integrity": "sha512-RD4Z7grbdNGOKwKnUBKar6zNxqaW3n8m9QSrfvljW+gmkj1GArb8AFBomVr6xMOgHPD3v1uV3BrIf01py57daQ==", + "dev": true, + "dependencies": { + "@types/react": "*" + } + }, "node_modules/abortcontroller-polyfill": { "version": "1.7.5", "resolved": "https://registry.npmjs.org/abortcontroller-polyfill/-/abortcontroller-polyfill-1.7.5.tgz", "integrity": "sha512-JMJ5soJWP18htbbxJjG7bG6yuI6pRhgJ0scHHTfkUjf6wjP912xZWvM+A4sJK3gqd9E8fcPbDnOefbA9Th/FIQ==", "dev": true }, + "node_modules/airbnb-prop-types": { + "version": "2.16.0", + "resolved": "https://registry.npmjs.org/airbnb-prop-types/-/airbnb-prop-types-2.16.0.tgz", + "integrity": "sha512-7WHOFolP/6cS96PhKNrslCLMYAI8yB1Pp6u6XmxozQOiZbsI5ycglZr5cHhBFfuRcQQjzCMith5ZPZdYiJCxUg==", + "deprecated": "This package has been renamed to 'prop-types-tools'", + "dependencies": { + "array.prototype.find": "^2.1.1", + "function.prototype.name": "^1.1.2", + "is-regex": "^1.1.0", + "object-is": "^1.1.2", + "object.assign": "^4.1.0", + "object.entries": "^1.1.2", + "prop-types": "^15.7.2", + "prop-types-exact": "^1.2.0", + "react-is": "^16.13.1" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + }, + "peerDependencies": { + "react": "^0.14 || ^15.0.0 || ^16.0.0-alpha" + } + }, "node_modules/ansi-styles": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz", @@ -2063,6 +2100,74 @@ "integrity": "sha512-8+9WqebbFzpX9OR+Wa6O29asIogeRMzcGtAINdpMHHyAg10f05aSFVBbcEqGf/PXw1EjAZ+q2/bEBg3DvurK3Q==", "dev": true }, + "node_modules/array-buffer-byte-length": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/array-buffer-byte-length/-/array-buffer-byte-length-1.0.1.tgz", + "integrity": "sha512-ahC5W1xgou+KTXix4sAO8Ki12Q+jf4i0+tmk3sC+zgcynshkHxzpXdImBehiUYKKKDwvfFiJl1tZt6ewscS1Mg==", + "dependencies": { + "call-bind": "^1.0.5", + "is-array-buffer": "^3.0.4" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/array.prototype.find": { + "version": "2.2.3", + "resolved": "https://registry.npmjs.org/array.prototype.find/-/array.prototype.find-2.2.3.tgz", + "integrity": "sha512-fO/ORdOELvjbbeIfZfzrXFMhYHGofRGqd+am9zm3tZ4GlJINj/pA2eITyfd65Vg6+ZbHd/Cys7stpoRSWtQFdA==", + "dependencies": { + "call-bind": "^1.0.7", + "define-properties": "^1.2.1", + "es-abstract": "^1.23.2", + "es-object-atoms": "^1.0.0", + "es-shim-unscopables": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/arraybuffer.prototype.slice": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/arraybuffer.prototype.slice/-/arraybuffer.prototype.slice-1.0.3.tgz", + "integrity": "sha512-bMxMKAjg13EBSVscxTaYA4mRc5t1UAXa2kXiGTNfZ079HIWXEkKmkgFrh/nJqamaLSrXO5H4WFFkPEaLJWbs3A==", + "dependencies": { + "array-buffer-byte-length": "^1.0.1", + "call-bind": "^1.0.5", + "define-properties": "^1.2.1", + "es-abstract": "^1.22.3", + "es-errors": "^1.2.1", + "get-intrinsic": "^1.2.3", + "is-array-buffer": "^3.0.4", + "is-shared-array-buffer": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/available-typed-arrays": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/available-typed-arrays/-/available-typed-arrays-1.0.7.tgz", + "integrity": "sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==", + "dependencies": { + "possible-typed-array-names": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/base-x": { "version": "3.0.9", "resolved": "https://registry.npmjs.org/base-x/-/base-x-3.0.9.tgz", @@ -2140,6 +2245,24 @@ "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7" } }, + "node_modules/call-bind": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/call-bind/-/call-bind-1.0.7.tgz", + "integrity": "sha512-GHTSNSYICQ7scH7sZ+M2rFopRoLh8t2bLSW6BbgrtLsahOIB5iyAVJf9GjWK3cYTDaMj4XdBpM1cA6pIS0Kv2w==", + "dependencies": { + "es-define-property": "^1.0.0", + "es-errors": "^1.3.0", + "function-bind": "^1.1.2", + "get-intrinsic": "^1.2.4", + "set-function-length": "^1.2.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/callsites": { "version": "3.1.0", "resolved": "https://registry.npmjs.org/callsites/-/callsites-3.1.0.tgz", @@ -2230,6 +2353,11 @@ "node": ">= 10" } }, + "node_modules/consolidated-events": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/consolidated-events/-/consolidated-events-2.0.2.tgz", + "integrity": "sha512-2/uRVMdRypf5z/TW/ncD/66l75P5hH2vM/GR8Jf8HLc2xnfJtmina6F6du8+v4Z2vTrMo7jC+W1tmEEuuELgkQ==" + }, "node_modules/cosmiconfig": { "version": "8.3.6", "resolved": "https://registry.npmjs.org/cosmiconfig/-/cosmiconfig-8.3.6.tgz", @@ -2256,6 +2384,11 @@ } } }, + "node_modules/css-mediaquery": { + "version": "0.1.2", + "resolved": "https://registry.npmjs.org/css-mediaquery/-/css-mediaquery-0.1.2.tgz", + "integrity": "sha512-COtn4EROW5dBGlE/4PiKnh6rZpAPxDeFLaEEwt4i10jpDMFt2EhQGS79QmmrO+iKCHv0PU/HrOWEhijFd1x99Q==" + }, "node_modules/css-select": { "version": "4.3.0", "resolved": "https://registry.npmjs.org/css-select/-/css-select-4.3.0.tgz", @@ -2315,6 +2448,86 @@ "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==", "dev": true }, + "node_modules/data-view-buffer": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/data-view-buffer/-/data-view-buffer-1.0.1.tgz", + "integrity": "sha512-0lht7OugA5x3iJLOWFhWK/5ehONdprk0ISXqVFn/NFrDu+cuc8iADFrGQz5BnRK7LLU3JmkbXSxaqX+/mXYtUA==", + "dependencies": { + "call-bind": "^1.0.6", + "es-errors": "^1.3.0", + "is-data-view": "^1.0.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/data-view-byte-length": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/data-view-byte-length/-/data-view-byte-length-1.0.1.tgz", + "integrity": "sha512-4J7wRJD3ABAzr8wP+OcIcqq2dlUKp4DVflx++hs5h5ZKydWMI6/D/fAot+yh6g2tHh8fLFTvNOaVN357NvSrOQ==", + "dependencies": { + "call-bind": "^1.0.7", + "es-errors": "^1.3.0", + "is-data-view": "^1.0.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/data-view-byte-offset": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/data-view-byte-offset/-/data-view-byte-offset-1.0.0.tgz", + "integrity": "sha512-t/Ygsytq+R995EJ5PZlD4Cu56sWa8InXySaViRzw9apusqsOO2bQP+SbYzAhR0pFKoB+43lYy8rWban9JSuXnA==", + "dependencies": { + "call-bind": "^1.0.6", + "es-errors": "^1.3.0", + "is-data-view": "^1.0.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/define-data-property": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/define-data-property/-/define-data-property-1.1.4.tgz", + "integrity": "sha512-rBMvIzlpA8v6E+SJZoo++HAYqsLrkg7MSfIinMPFhmkorw7X+dOXVJQs+QT69zGkzMyfDnIMN2Wid1+NbL3T+A==", + "dependencies": { + "es-define-property": "^1.0.0", + "es-errors": "^1.3.0", + "gopd": "^1.0.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/define-properties": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/define-properties/-/define-properties-1.2.1.tgz", + "integrity": "sha512-8QmQKqEASLd5nx0U1B1okLElbUuuttJ/AnYmRXbbbGDWh6uS208EjD4Xqq/I9wK7u0v6O08XhTWnt5XtEbR6Dg==", + "dependencies": { + "define-data-property": "^1.0.1", + "has-property-descriptors": "^1.0.0", + "object-keys": "^1.1.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/detect-libc": { "version": "1.0.3", "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz", @@ -2327,6 +2540,17 @@ "node": ">=0.10" } }, + "node_modules/document.contains": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/document.contains/-/document.contains-1.0.2.tgz", + "integrity": "sha512-YcvYFs15mX8m3AO1QNQy3BlIpSMfNRj3Ujk2BEJxsZG+HZf7/hZ6jr7mDpXrF8q+ff95Vef5yjhiZxm8CGJr6Q==", + "dependencies": { + "define-properties": "^1.1.3" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/dom-serializer": { "version": "1.4.1", "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-1.4.1.tgz", @@ -2433,11 +2657,137 @@ "is-arrayish": "^0.2.1" } }, + "node_modules/es-abstract": { + "version": "1.23.3", + "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.23.3.tgz", + "integrity": "sha512-e+HfNH61Bj1X9/jLc5v1owaLYuHdeHHSQlkhCBiTK8rBvKaULl/beGMxwrMXjpYrv4pz22BlY570vVePA2ho4A==", + "dependencies": { + "array-buffer-byte-length": "^1.0.1", + "arraybuffer.prototype.slice": "^1.0.3", + "available-typed-arrays": "^1.0.7", + "call-bind": "^1.0.7", + "data-view-buffer": "^1.0.1", + "data-view-byte-length": "^1.0.1", + "data-view-byte-offset": "^1.0.0", + "es-define-property": "^1.0.0", + "es-errors": "^1.3.0", + "es-object-atoms": "^1.0.0", + "es-set-tostringtag": "^2.0.3", + "es-to-primitive": "^1.2.1", + "function.prototype.name": "^1.1.6", + "get-intrinsic": "^1.2.4", + "get-symbol-description": "^1.0.2", + "globalthis": "^1.0.3", + "gopd": "^1.0.1", + "has-property-descriptors": "^1.0.2", + "has-proto": "^1.0.3", + "has-symbols": "^1.0.3", + "hasown": "^2.0.2", + "internal-slot": "^1.0.7", + "is-array-buffer": "^3.0.4", + "is-callable": "^1.2.7", + "is-data-view": "^1.0.1", + "is-negative-zero": "^2.0.3", + "is-regex": "^1.1.4", + "is-shared-array-buffer": "^1.0.3", + "is-string": "^1.0.7", + "is-typed-array": "^1.1.13", + "is-weakref": "^1.0.2", + "object-inspect": "^1.13.1", + "object-keys": "^1.1.1", + "object.assign": "^4.1.5", + "regexp.prototype.flags": "^1.5.2", + "safe-array-concat": "^1.1.2", + "safe-regex-test": "^1.0.3", + "string.prototype.trim": "^1.2.9", + "string.prototype.trimend": "^1.0.8", + "string.prototype.trimstart": "^1.0.8", + "typed-array-buffer": "^1.0.2", + "typed-array-byte-length": "^1.0.1", + "typed-array-byte-offset": "^1.0.2", + "typed-array-length": "^1.0.6", + "unbox-primitive": "^1.0.2", + "which-typed-array": "^1.1.15" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/es-define-property": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.0.tgz", + "integrity": "sha512-jxayLKShrEqqzJ0eumQbVhTYQM27CfT1T35+gCgDFoL82JLsXqTJ76zv6A0YLOgEnLUMvLzsDsGIrl8NFpT2gQ==", + "dependencies": { + "get-intrinsic": "^1.2.4" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/es-errors": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz", + "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==", + "engines": { + "node": ">= 0.4" + } + }, "node_modules/es-module-shims": { "version": "1.9.0", "resolved": "https://registry.npmjs.org/es-module-shims/-/es-module-shims-1.9.0.tgz", "integrity": "sha512-R4lwSjeELpw1Bzu2a7k3nqpxyPMfiXRq7ewqFhydV/zcYgt4b4VZzNonZu/SotJyb4ibEjuqN/OIM4wQCAGmwA==" }, + "node_modules/es-object-atoms": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.0.0.tgz", + "integrity": "sha512-MZ4iQ6JwHOBQjahnjwaC1ZtIBH+2ohjamzAO3oaHcXYup7qxjF2fixyH+Q71voWHeOkI2q/TnJao/KfXYIZWbw==", + "dependencies": { + "es-errors": "^1.3.0" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/es-set-tostringtag": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/es-set-tostringtag/-/es-set-tostringtag-2.0.3.tgz", + "integrity": "sha512-3T8uNMC3OQTHkFUsFq8r/BwAXLHvU/9O9mE0fBc/MY5iq/8H7ncvO947LmYA6ldWw9Uh8Yhf25zu6n7nML5QWQ==", + "dependencies": { + "get-intrinsic": "^1.2.4", + "has-tostringtag": "^1.0.2", + "hasown": "^2.0.1" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/es-shim-unscopables": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/es-shim-unscopables/-/es-shim-unscopables-1.0.2.tgz", + "integrity": "sha512-J3yBRXCzDu4ULnQwxyToo/OjdMx6akgVC7K6few0a7F/0wLtmKKN7I73AH5T2836UuXRqN7Qg+IIUw/+YJksRw==", + "dependencies": { + "hasown": "^2.0.0" + } + }, + "node_modules/es-to-primitive": { + "version": "1.2.1", + "resolved": "https://registry.npmjs.org/es-to-primitive/-/es-to-primitive-1.2.1.tgz", + "integrity": "sha512-QCOllgZJtaUo9miYBcLChTUaHNjJF3PYs1VidD7AwiEj1kYxKeQTctLAezAOH5ZKRH0g2IgPn6KwB4IT8iRpvA==", + "dependencies": { + "is-callable": "^1.1.4", + "is-date-object": "^1.0.1", + "is-symbol": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/escalade": { "version": "3.1.2", "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.2.tgz", @@ -2468,6 +2818,65 @@ "node": ">=8" } }, + "node_modules/for-each": { + "version": "0.3.3", + "resolved": "https://registry.npmjs.org/for-each/-/for-each-0.3.3.tgz", + "integrity": "sha512-jqYfLp7mo9vIyQf8ykW2v7A+2N4QjeCeI5+Dz9XraiO1ign81wjiH7Fb9vSOWvQfNtmSa4H2RoQTrrXivdUZmw==", + "dependencies": { + "is-callable": "^1.1.3" + } + }, + "node_modules/function-bind": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz", + "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/function.prototype.name": { + "version": "1.1.6", + "resolved": "https://registry.npmjs.org/function.prototype.name/-/function.prototype.name-1.1.6.tgz", + "integrity": "sha512-Z5kx79swU5P27WEayXM1tBi5Ze/lbIyiNgU3qyXUOf9b2rgXYyF9Dy9Cx+IQv/Lc8WCG6L82zwUPpSS9hGehIg==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "functions-have-names": "^1.2.3" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/functions-have-names": { + "version": "1.2.3", + "resolved": "https://registry.npmjs.org/functions-have-names/-/functions-have-names-1.2.3.tgz", + "integrity": "sha512-xckBUXyTIqT97tq2x2AMb+g163b5JFysYk0x4qxNFwbfQkmNZoiRHb6sPzI9/QV33WeuvVYBUIiD4NzNIyqaRQ==", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/get-intrinsic": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.2.4.tgz", + "integrity": "sha512-5uYhsJH8VJBTv7oslg4BznJYhDoRI6waYCxMmCdnTrcCrHA/fCFKoTFz2JKKE0HdDFUF7/oQuhzumXJK7paBRQ==", + "dependencies": { + "es-errors": "^1.3.0", + "function-bind": "^1.1.2", + "has-proto": "^1.0.1", + "has-symbols": "^1.0.3", + "hasown": "^2.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/get-port": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/get-port/-/get-port-4.2.0.tgz", @@ -2477,6 +2886,22 @@ "node": ">=6" } }, + "node_modules/get-symbol-description": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/get-symbol-description/-/get-symbol-description-1.0.2.tgz", + "integrity": "sha512-g0QYk1dZBxGwk+Ngc+ltRH2IBp2f7zBkBMBJZCDerh6EhlhSR6+9irMCuT/09zD6qkarHUSn529sK/yL4S27mg==", + "dependencies": { + "call-bind": "^1.0.5", + "es-errors": "^1.3.0", + "get-intrinsic": "^1.2.4" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/globals": { "version": "13.24.0", "resolved": "https://registry.npmjs.org/globals/-/globals-13.24.0.tgz", @@ -2492,6 +2917,40 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/globalthis": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/globalthis/-/globalthis-1.0.4.tgz", + "integrity": "sha512-DpLKbNU4WylpxJykQujfCcwYWiV/Jhm50Goo0wrVILAv5jOr9d+H+UR3PhSCD2rCCEIg0uc+G+muBTwD54JhDQ==", + "dependencies": { + "define-properties": "^1.2.1", + "gopd": "^1.0.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/gopd": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.0.1.tgz", + "integrity": "sha512-d65bNlIadxvpb/A2abVdlqKqV563juRnZ1Wtk6s1sIR8uNsXR70xqIzVqxVf1eTqDunwT2MkczEeaezCKTZhwA==", + "dependencies": { + "get-intrinsic": "^1.1.3" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/has-bigints": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/has-bigints/-/has-bigints-1.0.2.tgz", + "integrity": "sha512-tSvCKtBr9lkF0Ex0aQiP9N+OpV4zi2r/Nee5VkRDbaqv35RLYMzbwQfFSZZH0kR+Rd6302UJZ2p/bJCEoR3VoQ==", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/has-flag": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-4.0.0.tgz", @@ -2501,6 +2960,64 @@ "node": ">=8" } }, + "node_modules/has-property-descriptors": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/has-property-descriptors/-/has-property-descriptors-1.0.2.tgz", + "integrity": "sha512-55JNKuIW+vq4Ke1BjOTjM2YctQIvCT7GFzHwmfZPGo5wnrgkid0YQtnAleFSqumZm4az3n2BS+erby5ipJdgrg==", + "dependencies": { + "es-define-property": "^1.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/has-proto": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/has-proto/-/has-proto-1.0.3.tgz", + "integrity": "sha512-SJ1amZAJUiZS+PhsVLf5tGydlaVB8EdFpaSO4gmiUKUOxk8qzn5AIy4ZeJUmh22znIdk/uMAUT2pl3FxzVUH+Q==", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/has-symbols": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.0.3.tgz", + "integrity": "sha512-l3LCuF6MgDNwTDKkdYGEihYjt5pRPbEg46rtlmnSPlUbgmB8LOIrKJbYYFBSbnPaJexMKtiPO8hmeRjRz2Td+A==", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/has-tostringtag": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/has-tostringtag/-/has-tostringtag-1.0.2.tgz", + "integrity": "sha512-NqADB8VjPFLM2V0VvHUewwwsw0ZWBaIdgo+ieHtK3hasLz4qeCRjYcqfB6AQrBggRKppKF8L52/VqdVsO47Dlw==", + "dependencies": { + "has-symbols": "^1.0.3" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/hasown": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.2.tgz", + "integrity": "sha512-0hJU9SCPvmMzIBdZFqNPXWa6dqh7WdH0cII9y+CyS8rG3nL48Bclra9HmKhVVUHyPWNH5Y7xDwAB7bfgSjkUMQ==", + "dependencies": { + "function-bind": "^1.1.2" + }, + "engines": { + "node": ">= 0.4" + } + }, "node_modules/history": { "version": "5.3.0", "resolved": "https://registry.npmjs.org/history/-/history-5.3.0.tgz", @@ -2575,6 +3092,11 @@ "entities": "^3.0.1" } }, + "node_modules/hyphenate-style-name": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.5.tgz", + "integrity": "sha512-fedL7PRwmeVkgyhu9hLeTBaI6wcGk7JGJswdaRsa5aUbkXI1kr1xZwTPBtaYPpwf56878iDek6VbVnuWMebJmw==" + }, "node_modules/import-fresh": { "version": "3.3.0", "resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.0.tgz", @@ -2591,12 +3113,105 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/internal-slot": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/internal-slot/-/internal-slot-1.0.7.tgz", + "integrity": "sha512-NGnrKwXzSms2qUUih/ILZ5JBqNTSa1+ZmP6flaIp6KmSElgE9qdndzS3cqjrDovwFdmwsGsLdeFgB6suw+1e9g==", + "dependencies": { + "es-errors": "^1.3.0", + "hasown": "^2.0.0", + "side-channel": "^1.0.4" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/is-array-buffer": { + "version": "3.0.4", + "resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz", + "integrity": "sha512-wcjaerHw0ydZwfhiKbXJWLDY8A7yV7KhjQOpb83hGgGfId/aQa4TOvwyzn2PuswW2gPCYEL/nEAiSVpdOj1lXw==", + "dependencies": { + "call-bind": "^1.0.2", + "get-intrinsic": "^1.2.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-arrayish": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.2.1.tgz", "integrity": "sha512-zz06S8t0ozoDXMG+ube26zeCTNXcKIPJZJi8hBrF4idCLms4CG9QtK7qBl1boi5ODzFpjswb5JPmHCbMpjaYzg==", "dev": true }, + "node_modules/is-bigint": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/is-bigint/-/is-bigint-1.0.4.tgz", + "integrity": "sha512-zB9CruMamjym81i2JZ3UMn54PKGsQzsJeo6xvN3HJJ4CAsQNB6iRutp2To77OfCNuoxspsIhzaPoO1zyCEhFOg==", + "dependencies": { + "has-bigints": "^1.0.1" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-boolean-object": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/is-boolean-object/-/is-boolean-object-1.1.2.tgz", + "integrity": "sha512-gDYaKHJmnj4aWxyj6YHyXVpdQawtVLHU5cb+eztPGczf6cjuTdwve5ZIEfgXqH4e57An1D1AKf8CZ3kYrQRqYA==", + "dependencies": { + "call-bind": "^1.0.2", + "has-tostringtag": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-callable": { + "version": "1.2.7", + "resolved": "https://registry.npmjs.org/is-callable/-/is-callable-1.2.7.tgz", + "integrity": "sha512-1BC0BVFhS/p0qtw6enp8e+8OD0UrK0oFLztSjNzhcKA3WDuJxxAPXzPuPtKkjEY9UUoEWlX/8fgKeu2S8i9JTA==", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-data-view": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/is-data-view/-/is-data-view-1.0.1.tgz", + "integrity": "sha512-AHkaJrsUVW6wq6JS8y3JnM/GJF/9cf+k20+iDzlSaJrinEo5+7vRiteOSwBhHRiAyQATN1AmY4hwzxJKPmYf+w==", + "dependencies": { + "is-typed-array": "^1.1.13" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-date-object": { + "version": "1.0.5", + "resolved": "https://registry.npmjs.org/is-date-object/-/is-date-object-1.0.5.tgz", + "integrity": "sha512-9YQaSxsAiSwcvS33MBk3wTCVnWK+HhF8VZR2jRxehM16QcVOdHqPn4VPHmRK4lSr38n9JriurInLcP90xsYNfQ==", + "dependencies": { + "has-tostringtag": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-extglob": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz", @@ -2624,6 +3239,17 @@ "integrity": "sha512-6BEnpVn1rcf3ngfmViLM6vjUjGErbdrL4rwlv+u1NO1XO8kqT4YGL8+19Q+Z/bas8tY90BTWMk2+fW1g6hQjbA==", "dev": true }, + "node_modules/is-negative-zero": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/is-negative-zero/-/is-negative-zero-2.0.3.tgz", + "integrity": "sha512-5KoIu2Ngpyek75jXodFvnafB6DJgr3u8uuK0LEZJjrU19DrMD3EVERaR8sjz8CCGgpZvxPl9SuE1GMVPFHx1mw==", + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/is-number": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz", @@ -2633,6 +3259,107 @@ "node": ">=0.12.0" } }, + "node_modules/is-number-object": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/is-number-object/-/is-number-object-1.0.7.tgz", + "integrity": "sha512-k1U0IRzLMo7ZlYIfzRu23Oh6MiIFasgpb9X76eqfFZAqwH44UI4KTBvBYIZ1dSL9ZzChTB9ShHfLkR4pdW5krQ==", + "dependencies": { + "has-tostringtag": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-regex": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/is-regex/-/is-regex-1.1.4.tgz", + "integrity": "sha512-kvRdxDsxZjhzUX07ZnLydzS1TU/TJlTUHHY4YLL87e37oUA49DfkLqgy+VjFocowy29cKvcSiu+kIv728jTTVg==", + "dependencies": { + "call-bind": "^1.0.2", + "has-tostringtag": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-shared-array-buffer": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/is-shared-array-buffer/-/is-shared-array-buffer-1.0.3.tgz", + "integrity": "sha512-nA2hv5XIhLR3uVzDDfCIknerhx8XUKnstuOERPNNIinXG7v9u+ohXF67vxm4TPTEPU6lm61ZkwP3c9PCB97rhg==", + "dependencies": { + "call-bind": "^1.0.7" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-string": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/is-string/-/is-string-1.0.7.tgz", + "integrity": "sha512-tE2UXzivje6ofPW7l23cjDOMa09gb7xlAqG6jG5ej6uPV32TlWP3NKPigtaGeHNu9fohccRYvIiZMfOOnOYUtg==", + "dependencies": { + "has-tostringtag": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-symbol": { + "version": "1.0.4", + "resolved": "https://registry.npmjs.org/is-symbol/-/is-symbol-1.0.4.tgz", + "integrity": "sha512-C/CPBqKWnvdcxqIARxyOh4v1UUEOCHpgDa0WYgpKDFMszcrPcffg5uhwSgPCLD2WWxmq6isisz87tzT01tuGhg==", + "dependencies": { + "has-symbols": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-typed-array": { + "version": "1.1.13", + "resolved": "https://registry.npmjs.org/is-typed-array/-/is-typed-array-1.1.13.tgz", + "integrity": "sha512-uZ25/bUAlUY5fR4OKT4rZQEBrzQWYV9ZJYGGsUmEJ6thodVJ1HX64ePQ6Z0qPWP+m+Uq6e9UugrE38jeYsDSMw==", + "dependencies": { + "which-typed-array": "^1.1.14" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/is-weakref": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/is-weakref/-/is-weakref-1.0.2.tgz", + "integrity": "sha512-qctsuLZmIQ0+vSSMfoVvyFe2+GSEvnmZ2ezTup1SBse9+twCCeial6EEi3Nc2KFcf6+qz2FBPnjXsk8xhKSaPQ==", + "dependencies": { + "call-bind": "^1.0.2" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/isarray": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-2.0.5.tgz", + "integrity": "sha512-xHjhDr3cNBK0BzdUJSPXZntQUx/mwMS5Rw4A7lPJ90XGAO6ISP/ePDNuo0vhqOZU+UD5JoodwCAAoZQd3FeAKw==" + }, "node_modules/js-tokens": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz", @@ -2912,6 +3639,11 @@ "integrity": "sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA==", "dev": true }, + "node_modules/lodash.throttle": { + "version": "4.1.1", + "resolved": "https://registry.npmjs.org/lodash.throttle/-/lodash.throttle-4.1.1.tgz", + "integrity": "sha512-wIkUCfVKpVsWo3JSZlc+8MB5it+2AN5W8J7YVMST30UrvcQNZ1Okbj+rbVniijTWE6FGYy4XJq/rHkas8qJMLQ==" + }, "node_modules/loose-envify": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz", @@ -2935,6 +3667,14 @@ "node": ">=10" } }, + "node_modules/matchmediaquery": { + "version": "0.4.2", + "resolved": "https://registry.npmjs.org/matchmediaquery/-/matchmediaquery-0.4.2.tgz", + "integrity": "sha512-wrZpoT50ehYOudhDjt/YvUJc6eUzcdFPdmbizfgvswCKNHD1/OBOHYJpHie+HXpu6bSkEGieFMYk6VuutaiRfA==", + "dependencies": { + "css-mediaquery": "^0.1.2" + } + }, "node_modules/mdn-data": { "version": "2.0.14", "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.0.14.tgz", @@ -3061,6 +3801,83 @@ "node": ">=0.10.0" } }, + "node_modules/object-inspect": { + "version": "1.13.1", + "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.1.tgz", + "integrity": "sha512-5qoj1RUiKOMsCCNLV1CBiPYE10sziTsnmNxkAI/rZhiD63CF7IqdFGC/XzjWjpSgLf0LxXX3bDFIh0E18f6UhQ==", + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/object-is": { + "version": "1.1.6", + "resolved": "https://registry.npmjs.org/object-is/-/object-is-1.1.6.tgz", + "integrity": "sha512-F8cZ+KfGlSGi09lJT7/Nd6KJZ9ygtvYC0/UYYLI9nmQKLMnydpB9yvbv9K1uSkEu7FU9vYPmVwLg328tX+ot3Q==", + "dependencies": { + "call-bind": "^1.0.7", + "define-properties": "^1.2.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/object-keys": { + "version": "1.1.1", + "resolved": "https://registry.npmjs.org/object-keys/-/object-keys-1.1.1.tgz", + "integrity": "sha512-NuAESUOUMrlIXOfHKzD6bpPu3tYt3xvjNdRIQ+FeT0lNb4K8WR70CaDxhuNguS2XG+GjkyMwOzsN5ZktImfhLA==", + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/object.assign": { + "version": "4.1.5", + "resolved": "https://registry.npmjs.org/object.assign/-/object.assign-4.1.5.tgz", + "integrity": "sha512-byy+U7gp+FVwmyzKPYhW2h5l3crpmGsxl7X2s8y43IgxvG4g3QZ6CffDtsNQy1WsmZpQbO+ybo0AlW7TY6DcBQ==", + "dependencies": { + "call-bind": "^1.0.5", + "define-properties": "^1.2.1", + "has-symbols": "^1.0.3", + "object-keys": "^1.1.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/object.entries": { + "version": "1.1.8", + "resolved": "https://registry.npmjs.org/object.entries/-/object.entries-1.1.8.tgz", + "integrity": "sha512-cmopxi8VwRIAw/fkijJohSfpef5PdN0pMQJN6VC/ZKvn0LIknWD8KtgY6KlQdEc4tIjcQ3HxSMmnvtzIscdaYQ==", + "dependencies": { + "call-bind": "^1.0.7", + "define-properties": "^1.2.1", + "es-object-atoms": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/object.values": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/object.values/-/object.values-1.2.0.tgz", + "integrity": "sha512-yBYjY9QX2hnRmZHAjG/f13MzmBzxzYgQhFrke06TTyKY5zSTEqkOeukBzIdVA3j3ulu8Qa3MbVFShV7T2RmGtQ==", + "dependencies": { + "call-bind": "^1.0.7", + "define-properties": "^1.2.1", + "es-object-atoms": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/ordered-binary": { "version": "1.5.1", "resolved": "https://registry.npmjs.org/ordered-binary/-/ordered-binary-1.5.1.tgz", @@ -3156,6 +3973,14 @@ "url": "https://github.com/sponsors/jonschlinkert" } }, + "node_modules/possible-typed-array-names": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/possible-typed-array-names/-/possible-typed-array-names-1.0.0.tgz", + "integrity": "sha512-d7Uw+eZoloe0EHDIYoe+bQ5WXnGMOpmiZFTuMWCwpjzzkL2nTjcKiAk4hh8TjnGye2TwWOk3UXucZ+3rbmBa8Q==", + "engines": { + "node": ">= 0.4" + } + }, "node_modules/postcss-value-parser": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz", @@ -3230,6 +4055,21 @@ "react-is": "^16.13.1" } }, + "node_modules/prop-types-exact": { + "version": "1.2.4", + "resolved": "https://registry.npmjs.org/prop-types-exact/-/prop-types-exact-1.2.4.tgz", + "integrity": "sha512-vKfETKgBHRCLQwZgpl0pGPvMFxCX/06dAkz5jwNYHfrU0I8bgVhryaHA6O/KlqwtQi0IdnjAhDiZqzD+uJuVjA==", + "dependencies": { + "es-errors": "^1.3.0", + "hasown": "^2.0.2", + "isarray": "^2.0.5", + "object.assign": "^4.1.5", + "reflect.ownkeys": "^1.1.4" + }, + "engines": { + "node": ">= 0.8" + } + }, "node_modules/react": { "version": "18.2.0", "resolved": "https://registry.npmjs.org/react/-/react-18.2.0.tgz", @@ -3264,6 +4104,22 @@ "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz", "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==" }, + "node_modules/react-outside-click-handler": { + "version": "1.3.0", + "resolved": "https://registry.npmjs.org/react-outside-click-handler/-/react-outside-click-handler-1.3.0.tgz", + "integrity": "sha512-Te/7zFU0oHpAnctl//pP3hEAeobfeHMyygHB8MnjP6sX5OR8KHT1G3jmLsV3U9RnIYo+Yn+peJYWu+D5tUS8qQ==", + "dependencies": { + "airbnb-prop-types": "^2.15.0", + "consolidated-events": "^1.1.1 || ^2.0.0", + "document.contains": "^1.0.1", + "object.values": "^1.1.0", + "prop-types": "^15.7.2" + }, + "peerDependencies": { + "react": "^0.14 || >=15", + "react-dom": "^0.14 || >=15" + } + }, "node_modules/react-refresh": { "version": "0.9.0", "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.9.0.tgz", @@ -3273,6 +4129,23 @@ "node": ">=0.10.0" } }, + "node_modules/react-responsive": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/react-responsive/-/react-responsive-10.0.0.tgz", + "integrity": "sha512-N6/UiRLGQyGUqrarhBZmrSmHi2FXSD++N5VbSKsBBvWfG0ZV7asvUBluSv5lSzdMyEVjzZ6Y8DL4OHABiztDOg==", + "dependencies": { + "hyphenate-style-name": "^1.0.0", + "matchmediaquery": "^0.4.2", + "prop-types": "^15.6.1", + "shallow-equal": "^3.1.0" + }, + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "react": ">=16.8.0" + } + }, "node_modules/react-router": { "version": "6.22.3", "resolved": "https://registry.npmjs.org/react-router/-/react-router-6.22.3.tgz", @@ -3303,12 +4176,57 @@ "react-dom": ">=16.8" } }, + "node_modules/react-scroll": { + "version": "1.9.0", + "resolved": "https://registry.npmjs.org/react-scroll/-/react-scroll-1.9.0.tgz", + "integrity": "sha512-mamNcaX9Ng+JeSbBu97nWwRhYvL2oba+xR2GxvyXsbDeGP+gkYIKZ+aDMMj/n20TbV9SCWm/H7nyuNTSiXA6yA==", + "dependencies": { + "lodash.throttle": "^4.1.1", + "prop-types": "^15.7.2" + }, + "peerDependencies": { + "react": "^15.5.4 || ^16.0.0 || ^17.0.0 || ^18.0.0", + "react-dom": "^15.5.4 || ^16.0.0 || ^17.0.0 || ^18.0.0" + } + }, + "node_modules/reflect.ownkeys": { + "version": "1.1.4", + "resolved": "https://registry.npmjs.org/reflect.ownkeys/-/reflect.ownkeys-1.1.4.tgz", + "integrity": "sha512-iUNmtLgzudssL+qnTUosCmnq3eczlrVd1wXrgx/GhiI/8FvwrTYWtCJ9PNvWIRX+4ftupj2WUfB5mu5s9t6LnA==", + "dependencies": { + "call-bind": "^1.0.2", + "define-properties": "^1.2.0", + "es-abstract": "^1.22.1", + "es-set-tostringtag": "^2.0.1", + "globalthis": "^1.0.3" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/regenerator-runtime": { "version": "0.13.11", "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.11.tgz", "integrity": "sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==", "dev": true }, + "node_modules/regexp.prototype.flags": { + "version": "1.5.2", + "resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.5.2.tgz", + "integrity": "sha512-NcDiDkTLuPR+++OCKB0nWafEmhg/Da8aUPLPMQbK+bxKKCm1/S5he+AqYa4PlMCVBalb4/yxIRub6qkEx5yJbw==", + "dependencies": { + "call-bind": "^1.0.6", + "define-properties": "^1.2.1", + "es-errors": "^1.3.0", + "set-function-name": "^2.0.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/resolve-from": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/resolve-from/-/resolve-from-4.0.0.tgz", @@ -3318,6 +4236,23 @@ "node": ">=4" } }, + "node_modules/safe-array-concat": { + "version": "1.1.2", + "resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.2.tgz", + "integrity": "sha512-vj6RsCsWBCf19jIeHEfkRMw8DPiBb+DMXklQ/1SGDHOMlHdPUkZXFQ2YdplS23zESTijAcurb1aSgJA3AgMu1Q==", + "dependencies": { + "call-bind": "^1.0.7", + "get-intrinsic": "^1.2.4", + "has-symbols": "^1.0.3", + "isarray": "^2.0.5" + }, + "engines": { + "node": ">=0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/safe-buffer": { "version": "5.2.1", "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz", @@ -3338,6 +4273,22 @@ } ] }, + "node_modules/safe-regex-test": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/safe-regex-test/-/safe-regex-test-1.0.3.tgz", + "integrity": "sha512-CdASjNJPvRa7roO6Ra/gLYBTzYzzPyyBXxIMdGW3USQLyjWEls2RgW5UBTXaQVp+OrpeCK3bLem8smtmheoRuw==", + "dependencies": { + "call-bind": "^1.0.6", + "es-errors": "^1.3.0", + "is-regex": "^1.1.4" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/scheduler": { "version": "0.23.0", "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz", @@ -3361,6 +4312,58 @@ "node": ">=10" } }, + "node_modules/set-function-length": { + "version": "1.2.2", + "resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz", + "integrity": "sha512-pgRc4hJ4/sNjWCSS9AmnS40x3bNMDTknHgL5UaMBTMyJnU90EgWh1Rz+MC9eFu4BuN/UwZjKQuY/1v3rM7HMfg==", + "dependencies": { + "define-data-property": "^1.1.4", + "es-errors": "^1.3.0", + "function-bind": "^1.1.2", + "get-intrinsic": "^1.2.4", + "gopd": "^1.0.1", + "has-property-descriptors": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/set-function-name": { + "version": "2.0.2", + "resolved": "https://registry.npmjs.org/set-function-name/-/set-function-name-2.0.2.tgz", + "integrity": "sha512-7PGFlmtwsEADb0WYyvCMa1t+yke6daIG4Wirafur5kcf+MhUnPms1UeR0CKQdTZD81yESwMHbtn+TR+dMviakQ==", + "dependencies": { + "define-data-property": "^1.1.4", + "es-errors": "^1.3.0", + "functions-have-names": "^1.2.3", + "has-property-descriptors": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/shallow-equal": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/shallow-equal/-/shallow-equal-3.1.0.tgz", + "integrity": "sha512-pfVOw8QZIXpMbhBWvzBISicvToTiM5WBF1EeAUZDDSb5Dt29yl4AYbyywbJFSEsRUMr7gJaxqCdr4L3tQf9wVg==" + }, + "node_modules/side-channel": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.0.6.tgz", + "integrity": "sha512-fDW/EZ6Q9RiO8eFG8Hj+7u/oW+XrPTIChwCOM2+th2A6OblDtYYIpve9m+KvI9Z4C9qSEXlaGR6bTEYHReuglA==", + "dependencies": { + "call-bind": "^1.0.7", + "es-errors": "^1.3.0", + "get-intrinsic": "^1.2.4", + "object-inspect": "^1.13.1" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/source-map": { "version": "0.6.1", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz", @@ -3389,6 +4392,52 @@ "deprecated": "Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibility", "dev": true }, + "node_modules/string.prototype.trim": { + "version": "1.2.9", + "resolved": "https://registry.npmjs.org/string.prototype.trim/-/string.prototype.trim-1.2.9.tgz", + "integrity": "sha512-klHuCNxiMZ8MlsOihJhJEBJAiMVqU3Z2nEXWfWnIqjN0gEFS9J9+IxKozWWtQGcgoa1WUZzLjKPTr4ZHNFTFxw==", + "dependencies": { + "call-bind": "^1.0.7", + "define-properties": "^1.2.1", + "es-abstract": "^1.23.0", + "es-object-atoms": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/string.prototype.trimend": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/string.prototype.trimend/-/string.prototype.trimend-1.0.8.tgz", + "integrity": "sha512-p73uL5VCHCO2BZZ6krwwQE3kCzM7NKmis8S//xEC6fQonchbum4eP6kR4DLEjQFO3Wnj3Fuo8NM0kOSjVdHjZQ==", + "dependencies": { + "call-bind": "^1.0.7", + "define-properties": "^1.2.1", + "es-object-atoms": "^1.0.0" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/string.prototype.trimstart": { + "version": "1.0.8", + "resolved": "https://registry.npmjs.org/string.prototype.trimstart/-/string.prototype.trimstart-1.0.8.tgz", + "integrity": "sha512-UXSH262CSZY1tfu3G3Secr6uGLCFVPMhIqHjlgCUtCCcgihYc/xKs9djMTMUOb2j1mVSeU8EU6NWc/iQKU6Gfg==", + "dependencies": { + "call-bind": "^1.0.7", + "define-properties": "^1.2.1", + "es-object-atoms": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/supports-color": { "version": "7.2.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", @@ -3470,6 +4519,75 @@ "url": "https://github.com/sponsors/sindresorhus" } }, + "node_modules/typed-array-buffer": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/typed-array-buffer/-/typed-array-buffer-1.0.2.tgz", + "integrity": "sha512-gEymJYKZtKXzzBzM4jqa9w6Q1Jjm7x2d+sh19AdsD4wqnMPDYyvwpsIc2Q/835kHuo3BEQ7CjelGhfTsoBb2MQ==", + "dependencies": { + "call-bind": "^1.0.7", + "es-errors": "^1.3.0", + "is-typed-array": "^1.1.13" + }, + "engines": { + "node": ">= 0.4" + } + }, + "node_modules/typed-array-byte-length": { + "version": "1.0.1", + "resolved": "https://registry.npmjs.org/typed-array-byte-length/-/typed-array-byte-length-1.0.1.tgz", + "integrity": "sha512-3iMJ9q0ao7WE9tWcaYKIptkNBuOIcZCCT0d4MRvuuH88fEoEH62IuQe0OtraD3ebQEoTRk8XCBoknUNc1Y67pw==", + "dependencies": { + "call-bind": "^1.0.7", + "for-each": "^0.3.3", + "gopd": "^1.0.1", + "has-proto": "^1.0.3", + "is-typed-array": "^1.1.13" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/typed-array-byte-offset": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/typed-array-byte-offset/-/typed-array-byte-offset-1.0.2.tgz", + "integrity": "sha512-Ous0vodHa56FviZucS2E63zkgtgrACj7omjwd/8lTEMEPFFyjfixMZ1ZXenpgCFBBt4EC1J2XsyVS2gkG0eTFA==", + "dependencies": { + "available-typed-arrays": "^1.0.7", + "call-bind": "^1.0.7", + "for-each": "^0.3.3", + "gopd": "^1.0.1", + "has-proto": "^1.0.3", + "is-typed-array": "^1.1.13" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/typed-array-length": { + "version": "1.0.6", + "resolved": "https://registry.npmjs.org/typed-array-length/-/typed-array-length-1.0.6.tgz", + "integrity": "sha512-/OxDN6OtAk5KBpGb28T+HZc2M+ADtvRxXrKKbUwtsLgdoxgX13hyy7ek6bFRl5+aBs2yZzB0c4CnQfAtVypW/g==", + "dependencies": { + "call-bind": "^1.0.7", + "for-each": "^0.3.3", + "gopd": "^1.0.1", + "has-proto": "^1.0.3", + "is-typed-array": "^1.1.13", + "possible-typed-array-names": "^1.0.0" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/typescript": { "version": "5.4.5", "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz", @@ -3483,6 +4601,20 @@ "node": ">=14.17" } }, + "node_modules/unbox-primitive": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/unbox-primitive/-/unbox-primitive-1.0.2.tgz", + "integrity": "sha512-61pPlCD9h51VoreyJ0BReideM3MDKMKnh6+V9L08331ipq6Q8OFXZYiqP6n/tbHx4s5I9uRhcye6BrbkizkBDw==", + "dependencies": { + "call-bind": "^1.0.2", + "has-bigints": "^1.0.2", + "has-symbols": "^1.0.3", + "which-boxed-primitive": "^1.0.2" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/undici-types": { "version": "5.26.5", "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", @@ -3534,6 +4666,39 @@ "integrity": "sha512-DEAoo25RfSYMuTGc9vPJzZcZullwIqRDSI9LOy+fkCJPi6hykCnfKaXTuPBDuXAUcqHXyOgFtHNp/kB2FjYHbw==", "dev": true }, + "node_modules/which-boxed-primitive": { + "version": "1.0.2", + "resolved": "https://registry.npmjs.org/which-boxed-primitive/-/which-boxed-primitive-1.0.2.tgz", + "integrity": "sha512-bwZdv0AKLpplFY2KZRX6TvyuN7ojjr7lwkg6ml0roIy9YeuSr7JS372qlNW18UQYzgYK9ziGcerWqZOmEn9VNg==", + "dependencies": { + "is-bigint": "^1.0.1", + "is-boolean-object": "^1.1.0", + "is-number-object": "^1.0.4", + "is-string": "^1.0.5", + "is-symbol": "^1.0.3" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, + "node_modules/which-typed-array": { + "version": "1.1.15", + "resolved": "https://registry.npmjs.org/which-typed-array/-/which-typed-array-1.1.15.tgz", + "integrity": "sha512-oV0jmFtUky6CXfkqehVvBP/LSWJ2sy4vWMioiENyJLePrBO/yKyV9OyJySfAKosh+RYkIl5zJCNZ8/4JncrpdA==", + "dependencies": { + "available-typed-arrays": "^1.0.7", + "call-bind": "^1.0.7", + "for-each": "^0.3.3", + "gopd": "^1.0.1", + "has-tostringtag": "^1.0.2" + }, + "engines": { + "node": ">= 0.4" + }, + "funding": { + "url": "https://github.com/sponsors/ljharb" + } + }, "node_modules/yallist": { "version": "4.0.0", "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz", diff --git a/package.json b/package.json index 71999ee..ae2c8e8 100644 --- a/package.json +++ b/package.json @@ -8,6 +8,7 @@ "@types/node": "^20.12.7", "@types/react": "^18.2.79", "@types/react-dom": "^18.2.25", + "@types/react-scroll": "^1.8.10", "parcel": "^2.12.0", "process": "^0.11.10", "typescript": "^5.4.5" @@ -24,6 +25,9 @@ "history": "^5.3.0", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-router-dom": "^6.22.3" + "react-outside-click-handler": "^1.3.0", + "react-responsive": "^10.0.0", + "react-router-dom": "^6.22.3", + "react-scroll": "^1.9.0" } } diff --git a/src/Footer.tsx b/src/Footer.tsx new file mode 100644 index 0000000..1d51aea --- /dev/null +++ b/src/Footer.tsx @@ -0,0 +1,17 @@ +export default function Footer() { + return +} \ No newline at end of file diff --git a/src/Header.tsx b/src/Header.tsx new file mode 100644 index 0000000..77da46f --- /dev/null +++ b/src/Header.tsx @@ -0,0 +1,88 @@ +import {useEffect, useState} from 'react'; +import {Link} from "react-router-dom"; +import PM from "src/assets/images/PM.svg"; +import OutsideClickHandler from 'react-outside-click-handler'; +import {ALLIES} from "src/pages/Allies/Allies"; +import {CONTACT} from "src/pages/Contact/Contact"; +import {ELEMENTS} from "src/pages/Examples/Elements"; +import {GENERIC} from "src/pages/Examples/Generic"; +import {PRICING} from "src/pages/Pricing/Pricing"; +import {REVIEWS} from "src/pages/Reviews/Reviews"; +import {SERVICES} from "src/pages/Services/Services"; + +export default function Header() { + const [isMenuVisible, setIsMenuVisible] = useState(false); + + useEffect(() => { + if (isMenuVisible) { + document.body.classList.add('is-menu-visible'); + } else { + document.body.classList.remove('is-menu-visible'); + } + }, [isMenuVisible]); + + const toggleMenu = (e) => { + e.preventDefault(); + setIsMenuVisible(!isMenuVisible); + }; + + const handleOutsideClick = () => { + if (isMenuVisible) { + setIsMenuVisible(false); + } + }; + + return ( + + ); +} diff --git a/src/Home.tsx b/src/Home.tsx deleted file mode 100644 index d1cb8e5..0000000 --- a/src/Home.tsx +++ /dev/null @@ -1,194 +0,0 @@ -import {IconProp} from "@fortawesome/fontawesome-svg-core"; -import {faAddressBook, faChess, faPalette, faPhone} from "@fortawesome/free-solid-svg-icons"; -import {FontAwesomeIcon} from '@fortawesome/react-fontawesome' -import dalle10 from 'assets/dalle10.webp'; -import dalle11 from 'assets/dalle11.webp'; -import dalle12 from 'assets/dalle12.webp'; -import dalle15 from 'assets/dalle15.webp'; -import dalle17 from 'assets/dalle17.webp'; -import dalle5 from 'assets/dalle5.webp'; -import dalle6 from 'assets/dalle6.webp'; -import dalle8 from 'assets/dalle8.webp'; -import dalle9 from 'assets/dalle9.webp'; -import Parallax, {eParallaxStyle} from "src/components/Parallax"; - - -interface iHomeCardBody { - title: string; - description: string; - link: string; - image: string; - icon: IconProp; -} - -const HomeCards: iHomeCardBody[] = [ - { - title: 'Profession', - description: 'Some quick example text to build on the card title and make up the bulk of the card\'s content.', - link: '#', - image: dalle5, - icon: faPalette - }, - { - title: 'Mate', - icon: faAddressBook, - description: 'Some quick example text to build on the card title and make up the bulk of the card\'s content.', - link: '#', - image: dalle6 - }, - { - title: 'explore', - icon: faChess, - description: 'Some quick example text to build on the card title and make up the bulk of the card\'s content.', - link: '#', - image: dalle8 - }, - { - title: 'stuff', - icon: faPhone, - description: 'Some quick example text to build on the card title and make up the bulk of the card\'s content.', - link: '#', - image: dalle9 - - } -] - -export const HOME = '/' - -export default function Home() { - - const allHomeCards =
-
- {HomeCards.map(info =>
-
- {info.title -
-
-
- -
-
-

{info.title}

-

- Some quick example text to build on the card title and make up the bulk of - the card's content.

- Go somewhere -
-
-
)} -
-
- - return <> - -
-
-
-
-
-

- Welcome to Profession Mate
- #1 Job Searching Agency -

-

- We Handle The Entire Job Searching and Applying Process For You! -

-
-
-
-
-
-
- - {allHomeCards} - - -
-
-
-
-
-

- Welcome to Profession Mate -

-

- We Handle The Entire Job Searching and Applying Process For You! -

-
-
-
-
-
-
- -
-
-
-
-
-

- Welcome to Profession Mate -

-

- We Handle The Entire Job Searching and Applying Process For You! -

-
-
-
-
-
-
- - -
-
-
-
-
-

- Welcome to Profession Mate -

-

- We Handle The Entire Job Searching and Applying Process For You! -

-
-
-
-
-
-
- -} \ No newline at end of file diff --git a/src/Wrapper.tsx b/src/Wrapper.tsx deleted file mode 100644 index 6ae9748..0000000 --- a/src/Wrapper.tsx +++ /dev/null @@ -1,193 +0,0 @@ -import {Link} from "react-router-dom"; -import Parallax from "src/components/Parallax"; -import {FC, PropsWithChildren, useEffect, useState} from "react"; -import PM from 'assets/PM.svg' -import {HOME} from "src/Home"; -import {ALLIES} from "src/pages/Allies/Allies"; -import {CONTACT} from "src/pages/Contact/Contact"; -import {PRICING} from "src/pages/Pricing/Pricing"; -import {REVIEWS} from "src/pages/Reviews/Reviews"; -import {SERVICES} from "src/pages/Services/Services"; -//import PmFront from "assets/PM_Front.jpeg"; - -export default function Wrapper({children}: PropsWithChildren) { - - const [isScrolled, setIsScrolled] = useState(false); - - useEffect(() => { - const onScroll = () => { - const scrolled = window.scrollY > 200; - setIsScrolled(scrolled); - }; - - window.addEventListener('scroll', onScroll); - return () => window.removeEventListener('scroll', onScroll); - }, []); - - console.log("Wrapper TSX RENDER"); - - - const headerRightLinks = [ - { - title: 'Home', - link: HOME - }, - { - title: 'Services', - link: SERVICES - }, - { - title: 'Allies', - link: ALLIES - }, - { - title: 'Pricing', - link: PRICING - }, - { - title: 'Reviews', - link: REVIEWS - }, - { - title: 'Contact', - link: CONTACT - } - ] - - return
- -
- {children} -
- - - -
- -} \ No newline at end of file diff --git a/src/assets/css/main.css b/src/assets/css/main.css new file mode 100644 index 0000000..8c6e2b4 --- /dev/null +++ b/src/assets/css/main.css @@ -0,0 +1,4003 @@ +@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css"); +@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,800,800italic"); + +/* + Spectral by HTML5 UP + html5up.net | @ajlkn + Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +*/ + +html, body, div, span, applet, object, +iframe, h1, h2, h3, h4, h5, h6, p, blockquote, +pre, a, abbr, acronym, address, big, cite, +code, del, dfn, em, img, ins, kbd, q, s, samp, +small, strike, strong, sub, sup, tt, var, b, +u, i, center, dl, dt, dd, ol, ul, li, fieldset, +form, label, legend, table, caption, tbody, +tfoot, thead, tr, th, td, article, aside, +canvas, details, embed, figure, figcaption, +footer, header, hgroup, menu, nav, output, ruby, +section, summary, time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; +} + +article, aside, details, figcaption, figure, +footer, header, hgroup, menu, nav, section { + display: block; +} + +body { + line-height: 1; +} + +ol, ul { + list-style: none; +} + +blockquote, q { + quotes: none; +} + +blockquote:before, blockquote:after, q:before, q:after { + content: ''; + content: none; +} + +table { + border-collapse: collapse; + border-spacing: 0; +} + +body { + -webkit-text-size-adjust: none; +} + +mark { + background-color: transparent; + color: inherit; +} + +input::-moz-focus-inner { + border: 0; + padding: 0; +} + +input, select, textarea { + -moz-appearance: none; + -webkit-appearance: none; + -ms-appearance: none; + appearance: none; +} + +/* Basic */ + +@-ms-viewport { + width: device-width; +} + +html { + box-sizing: border-box; +} + +*, *:before, *:after { + box-sizing: inherit; +} + +body { + background: #2e3842; +} + +body.is-preload *, body.is-preload *:before, body.is-preload *:after { + -moz-animation: none !important; + -webkit-animation: none !important; + -ms-animation: none !important; + animation: none !important; + -moz-transition: none !important; + -webkit-transition: none !important; + -ms-transition: none !important; + transition: none !important; +} + +body, input, select, textarea { + color: #fff; + font-family: "Open Sans", Helvetica, sans-serif; + font-size: 15pt; + font-weight: 400; + letter-spacing: 0.075em; + line-height: 1.65em; +} + +@media screen and (max-width: 1680px) { + + body, input, select, textarea { + font-size: 13pt; + } + +} + +@media screen and (max-width: 1280px) { + + body, input, select, textarea { + font-size: 12pt; + } + +} + +@media screen and (max-width: 736px) { + + body, input, select, textarea { + font-size: 11pt; + letter-spacing: 0.0375em; + } + +} + +a { + -moz-transition: color 0.2s ease, border-bottom-color 0.2s ease; + -webkit-transition: color 0.2s ease, border-bottom-color 0.2s ease; + -ms-transition: color 0.2s ease, border-bottom-color 0.2s ease; + transition: color 0.2s ease, border-bottom-color 0.2s ease; + border-bottom: dotted 1px; + color: inherit; + text-decoration: none; +} + +a:hover { + border-bottom-color: transparent; +} + +strong, b { + color: #fff; + font-weight: 600; +} + +em, i { + font-style: italic; +} + +p { + margin: 0 0 2em 0; +} + +h1, h2, h3, h4, h5, h6 { + color: #fff; + font-weight: 800; + letter-spacing: 0.225em; + line-height: 1em; + margin: 0 0 1em 0; + text-transform: uppercase; +} + +h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { + color: inherit; + text-decoration: none; +} + +h2 { + font-size: 1.35em; + line-height: 1.75em; +} + +@media screen and (max-width: 736px) { + + h2 { + font-size: 1.1em; + line-height: 1.65em; + } + +} + +h3 { + font-size: 1.15em; + line-height: 1.75em; +} + +@media screen and (max-width: 736px) { + + h3 { + font-size: 1em; + line-height: 1.65em; + } + +} + +h4 { + font-size: 1em; + line-height: 1.5em; +} + +h5 { + font-size: 0.8em; + line-height: 1.5em; +} + +h6 { + font-size: 0.7em; + line-height: 1.5em; +} + +sub { + font-size: 0.8em; + position: relative; + top: 0.5em; +} + +sup { + font-size: 0.8em; + position: relative; + top: -0.5em; +} + +hr { + border: 0; + border-bottom: solid 2px #fff; + margin: 3em 0; +} + +hr.major { + margin: 4.5em 0; +} + +blockquote { + border-left: solid 4px #fff; + font-style: italic; + margin: 0 0 2em 0; + padding: 0.5em 0 0.5em 2em; +} + +code { + background: rgba(144, 144, 144, 0.25); + border-radius: 3px; + font-family: "Courier New", monospace; + font-size: 0.9em; + letter-spacing: 0; + margin: 0 0.25em; + padding: 0.25em 0.65em; +} + +pre { + -webkit-overflow-scrolling: touch; + font-family: "Courier New", monospace; + font-size: 0.9em; + margin: 0 0 2em 0; +} + +pre code { + display: block; + line-height: 1.75em; + padding: 1em 1.5em; + overflow-x: auto; +} + +.align-left { + text-align: left; +} + +.align-center { + text-align: center; +} + +.align-right { + text-align: right; +} + +/* Row */ + +.row { + display: flex; + flex-wrap: wrap; + box-sizing: border-box; + align-items: stretch; +} + +.row > * { + box-sizing: border-box; +} + +.row.gtr-uniform > * > :last-child { + margin-bottom: 0; +} + +.row.aln-left { + justify-content: flex-start; +} + +.row.aln-center { + justify-content: center; +} + +.row.aln-right { + justify-content: flex-end; +} + +.row.aln-top { + align-items: flex-start; +} + +.row.aln-middle { + align-items: center; +} + +.row.aln-bottom { + align-items: flex-end; +} + +.row > .imp { + order: -1; +} + +.row > .col-1 { + width: 8.33333%; +} + +.row > .off-1 { + margin-left: 8.33333%; +} + +.row > .col-2 { + width: 16.66667%; +} + +.row > .off-2 { + margin-left: 16.66667%; +} + +.row > .col-3 { + width: 25%; +} + +.row > .off-3 { + margin-left: 25%; +} + +.row > .col-4 { + width: 33.33333%; +} + +.row > .off-4 { + margin-left: 33.33333%; +} + +.row > .col-5 { + width: 41.66667%; +} + +.row > .off-5 { + margin-left: 41.66667%; +} + +.row > .col-6 { + width: 50%; +} + +.row > .off-6 { + margin-left: 50%; +} + +.row > .col-7 { + width: 58.33333%; +} + +.row > .off-7 { + margin-left: 58.33333%; +} + +.row > .col-8 { + width: 66.66667%; +} + +.row > .off-8 { + margin-left: 66.66667%; +} + +.row > .col-9 { + width: 75%; +} + +.row > .off-9 { + margin-left: 75%; +} + +.row > .col-10 { + width: 83.33333%; +} + +.row > .off-10 { + margin-left: 83.33333%; +} + +.row > .col-11 { + width: 91.66667%; +} + +.row > .off-11 { + margin-left: 91.66667%; +} + +.row > .col-12 { + width: 100%; +} + +.row > .off-12 { + margin-left: 100%; +} + +.row.gtr-0 { + margin-top: 0; + margin-left: 0em; +} + +.row.gtr-0 > * { + padding: 0 0 0 0em; +} + +.row.gtr-0.gtr-uniform { + margin-top: 0em; +} + +.row.gtr-0.gtr-uniform > * { + padding-top: 0em; +} + +.row.gtr-25 { + margin-top: 0; + margin-left: -0.375em; +} + +.row.gtr-25 > * { + padding: 0 0 0 0.375em; +} + +.row.gtr-25.gtr-uniform { + margin-top: -0.375em; +} + +.row.gtr-25.gtr-uniform > * { + padding-top: 0.375em; +} + +.row.gtr-50 { + margin-top: 0; + margin-left: -0.75em; +} + +.row.gtr-50 > * { + padding: 0 0 0 0.75em; +} + +.row.gtr-50.gtr-uniform { + margin-top: -0.75em; +} + +.row.gtr-50.gtr-uniform > * { + padding-top: 0.75em; +} + +.row { + margin-top: 0; + margin-left: -1.5em; +} + +.row > * { + padding: 0 0 0 1.5em; +} + +.row.gtr-uniform { + margin-top: -1.5em; +} + +.row.gtr-uniform > * { + padding-top: 1.5em; +} + +.row.gtr-150 { + margin-top: 0; + margin-left: -2.25em; +} + +.row.gtr-150 > * { + padding: 0 0 0 2.25em; +} + +.row.gtr-150.gtr-uniform { + margin-top: -2.25em; +} + +.row.gtr-150.gtr-uniform > * { + padding-top: 2.25em; +} + +.row.gtr-200 { + margin-top: 0; + margin-left: -3em; +} + +.row.gtr-200 > * { + padding: 0 0 0 3em; +} + +.row.gtr-200.gtr-uniform { + margin-top: -3em; +} + +.row.gtr-200.gtr-uniform > * { + padding-top: 3em; +} + +@media screen and (max-width: 1680px) { + + .row { + display: flex; + flex-wrap: wrap; + box-sizing: border-box; + align-items: stretch; + } + + .row > * { + box-sizing: border-box; + } + + .row.gtr-uniform > * > :last-child { + margin-bottom: 0; + } + + .row.aln-left { + justify-content: flex-start; + } + + .row.aln-center { + justify-content: center; + } + + .row.aln-right { + justify-content: flex-end; + } + + .row.aln-top { + align-items: flex-start; + } + + .row.aln-middle { + align-items: center; + } + + .row.aln-bottom { + align-items: flex-end; + } + + .row > .imp-xlarge { + order: -1; + } + + .row > .col-1-xlarge { + width: 8.33333%; + } + + .row > .off-1-xlarge { + margin-left: 8.33333%; + } + + .row > .col-2-xlarge { + width: 16.66667%; + } + + .row > .off-2-xlarge { + margin-left: 16.66667%; + } + + .row > .col-3-xlarge { + width: 25%; + } + + .row > .off-3-xlarge { + margin-left: 25%; + } + + .row > .col-4-xlarge { + width: 33.33333%; + } + + .row > .off-4-xlarge { + margin-left: 33.33333%; + } + + .row > .col-5-xlarge { + width: 41.66667%; + } + + .row > .off-5-xlarge { + margin-left: 41.66667%; + } + + .row > .col-6-xlarge { + width: 50%; + } + + .row > .off-6-xlarge { + margin-left: 50%; + } + + .row > .col-7-xlarge { + width: 58.33333%; + } + + .row > .off-7-xlarge { + margin-left: 58.33333%; + } + + .row > .col-8-xlarge { + width: 66.66667%; + } + + .row > .off-8-xlarge { + margin-left: 66.66667%; + } + + .row > .col-9-xlarge { + width: 75%; + } + + .row > .off-9-xlarge { + margin-left: 75%; + } + + .row > .col-10-xlarge { + width: 83.33333%; + } + + .row > .off-10-xlarge { + margin-left: 83.33333%; + } + + .row > .col-11-xlarge { + width: 91.66667%; + } + + .row > .off-11-xlarge { + margin-left: 91.66667%; + } + + .row > .col-12-xlarge { + width: 100%; + } + + .row > .off-12-xlarge { + margin-left: 100%; + } + + .row.gtr-0 { + margin-top: 0; + margin-left: 0em; + } + + .row.gtr-0 > * { + padding: 0 0 0 0em; + } + + .row.gtr-0.gtr-uniform { + margin-top: 0em; + } + + .row.gtr-0.gtr-uniform > * { + padding-top: 0em; + } + + .row.gtr-25 { + margin-top: 0; + margin-left: -0.375em; + } + + .row.gtr-25 > * { + padding: 0 0 0 0.375em; + } + + .row.gtr-25.gtr-uniform { + margin-top: -0.375em; + } + + .row.gtr-25.gtr-uniform > * { + padding-top: 0.375em; + } + + .row.gtr-50 { + margin-top: 0; + margin-left: -0.75em; + } + + .row.gtr-50 > * { + padding: 0 0 0 0.75em; + } + + .row.gtr-50.gtr-uniform { + margin-top: -0.75em; + } + + .row.gtr-50.gtr-uniform > * { + padding-top: 0.75em; + } + + .row { + margin-top: 0; + margin-left: -1.5em; + } + + .row > * { + padding: 0 0 0 1.5em; + } + + .row.gtr-uniform { + margin-top: -1.5em; + } + + .row.gtr-uniform > * { + padding-top: 1.5em; + } + + .row.gtr-150 { + margin-top: 0; + margin-left: -2.25em; + } + + .row.gtr-150 > * { + padding: 0 0 0 2.25em; + } + + .row.gtr-150.gtr-uniform { + margin-top: -2.25em; + } + + .row.gtr-150.gtr-uniform > * { + padding-top: 2.25em; + } + + .row.gtr-200 { + margin-top: 0; + margin-left: -3em; + } + + .row.gtr-200 > * { + padding: 0 0 0 3em; + } + + .row.gtr-200.gtr-uniform { + margin-top: -3em; + } + + .row.gtr-200.gtr-uniform > * { + padding-top: 3em; + } + +} + +@media screen and (max-width: 1280px) { + + .row { + display: flex; + flex-wrap: wrap; + box-sizing: border-box; + align-items: stretch; + } + + .row > * { + box-sizing: border-box; + } + + .row.gtr-uniform > * > :last-child { + margin-bottom: 0; + } + + .row.aln-left { + justify-content: flex-start; + } + + .row.aln-center { + justify-content: center; + } + + .row.aln-right { + justify-content: flex-end; + } + + .row.aln-top { + align-items: flex-start; + } + + .row.aln-middle { + align-items: center; + } + + .row.aln-bottom { + align-items: flex-end; + } + + .row > .imp-large { + order: -1; + } + + .row > .col-1-large { + width: 8.33333%; + } + + .row > .off-1-large { + margin-left: 8.33333%; + } + + .row > .col-2-large { + width: 16.66667%; + } + + .row > .off-2-large { + margin-left: 16.66667%; + } + + .row > .col-3-large { + width: 25%; + } + + .row > .off-3-large { + margin-left: 25%; + } + + .row > .col-4-large { + width: 33.33333%; + } + + .row > .off-4-large { + margin-left: 33.33333%; + } + + .row > .col-5-large { + width: 41.66667%; + } + + .row > .off-5-large { + margin-left: 41.66667%; + } + + .row > .col-6-large { + width: 50%; + } + + .row > .off-6-large { + margin-left: 50%; + } + + .row > .col-7-large { + width: 58.33333%; + } + + .row > .off-7-large { + margin-left: 58.33333%; + } + + .row > .col-8-large { + width: 66.66667%; + } + + .row > .off-8-large { + margin-left: 66.66667%; + } + + .row > .col-9-large { + width: 75%; + } + + .row > .off-9-large { + margin-left: 75%; + } + + .row > .col-10-large { + width: 83.33333%; + } + + .row > .off-10-large { + margin-left: 83.33333%; + } + + .row > .col-11-large { + width: 91.66667%; + } + + .row > .off-11-large { + margin-left: 91.66667%; + } + + .row > .col-12-large { + width: 100%; + } + + .row > .off-12-large { + margin-left: 100%; + } + + .row.gtr-0 { + margin-top: 0; + margin-left: 0em; + } + + .row.gtr-0 > * { + padding: 0 0 0 0em; + } + + .row.gtr-0.gtr-uniform { + margin-top: 0em; + } + + .row.gtr-0.gtr-uniform > * { + padding-top: 0em; + } + + .row.gtr-25 { + margin-top: 0; + margin-left: -0.375em; + } + + .row.gtr-25 > * { + padding: 0 0 0 0.375em; + } + + .row.gtr-25.gtr-uniform { + margin-top: -0.375em; + } + + .row.gtr-25.gtr-uniform > * { + padding-top: 0.375em; + } + + .row.gtr-50 { + margin-top: 0; + margin-left: -0.75em; + } + + .row.gtr-50 > * { + padding: 0 0 0 0.75em; + } + + .row.gtr-50.gtr-uniform { + margin-top: -0.75em; + } + + .row.gtr-50.gtr-uniform > * { + padding-top: 0.75em; + } + + .row { + margin-top: 0; + margin-left: -1.5em; + } + + .row > * { + padding: 0 0 0 1.5em; + } + + .row.gtr-uniform { + margin-top: -1.5em; + } + + .row.gtr-uniform > * { + padding-top: 1.5em; + } + + .row.gtr-150 { + margin-top: 0; + margin-left: -2.25em; + } + + .row.gtr-150 > * { + padding: 0 0 0 2.25em; + } + + .row.gtr-150.gtr-uniform { + margin-top: -2.25em; + } + + .row.gtr-150.gtr-uniform > * { + padding-top: 2.25em; + } + + .row.gtr-200 { + margin-top: 0; + margin-left: -3em; + } + + .row.gtr-200 > * { + padding: 0 0 0 3em; + } + + .row.gtr-200.gtr-uniform { + margin-top: -3em; + } + + .row.gtr-200.gtr-uniform > * { + padding-top: 3em; + } + +} + +@media screen and (max-width: 980px) { + + .row { + display: flex; + flex-wrap: wrap; + box-sizing: border-box; + align-items: stretch; + } + + .row > * { + box-sizing: border-box; + } + + .row.gtr-uniform > * > :last-child { + margin-bottom: 0; + } + + .row.aln-left { + justify-content: flex-start; + } + + .row.aln-center { + justify-content: center; + } + + .row.aln-right { + justify-content: flex-end; + } + + .row.aln-top { + align-items: flex-start; + } + + .row.aln-middle { + align-items: center; + } + + .row.aln-bottom { + align-items: flex-end; + } + + .row > .imp-medium { + order: -1; + } + + .row > .col-1-medium { + width: 8.33333%; + } + + .row > .off-1-medium { + margin-left: 8.33333%; + } + + .row > .col-2-medium { + width: 16.66667%; + } + + .row > .off-2-medium { + margin-left: 16.66667%; + } + + .row > .col-3-medium { + width: 25%; + } + + .row > .off-3-medium { + margin-left: 25%; + } + + .row > .col-4-medium { + width: 33.33333%; + } + + .row > .off-4-medium { + margin-left: 33.33333%; + } + + .row > .col-5-medium { + width: 41.66667%; + } + + .row > .off-5-medium { + margin-left: 41.66667%; + } + + .row > .col-6-medium { + width: 50%; + } + + .row > .off-6-medium { + margin-left: 50%; + } + + .row > .col-7-medium { + width: 58.33333%; + } + + .row > .off-7-medium { + margin-left: 58.33333%; + } + + .row > .col-8-medium { + width: 66.66667%; + } + + .row > .off-8-medium { + margin-left: 66.66667%; + } + + .row > .col-9-medium { + width: 75%; + } + + .row > .off-9-medium { + margin-left: 75%; + } + + .row > .col-10-medium { + width: 83.33333%; + } + + .row > .off-10-medium { + margin-left: 83.33333%; + } + + .row > .col-11-medium { + width: 91.66667%; + } + + .row > .off-11-medium { + margin-left: 91.66667%; + } + + .row > .col-12-medium { + width: 100%; + } + + .row > .off-12-medium { + margin-left: 100%; + } + + .row.gtr-0 { + margin-top: 0; + margin-left: 0em; + } + + .row.gtr-0 > * { + padding: 0 0 0 0em; + } + + .row.gtr-0.gtr-uniform { + margin-top: 0em; + } + + .row.gtr-0.gtr-uniform > * { + padding-top: 0em; + } + + .row.gtr-25 { + margin-top: 0; + margin-left: -0.375em; + } + + .row.gtr-25 > * { + padding: 0 0 0 0.375em; + } + + .row.gtr-25.gtr-uniform { + margin-top: -0.375em; + } + + .row.gtr-25.gtr-uniform > * { + padding-top: 0.375em; + } + + .row.gtr-50 { + margin-top: 0; + margin-left: -0.75em; + } + + .row.gtr-50 > * { + padding: 0 0 0 0.75em; + } + + .row.gtr-50.gtr-uniform { + margin-top: -0.75em; + } + + .row.gtr-50.gtr-uniform > * { + padding-top: 0.75em; + } + + .row { + margin-top: 0; + margin-left: -1.5em; + } + + .row > * { + padding: 0 0 0 1.5em; + } + + .row.gtr-uniform { + margin-top: -1.5em; + } + + .row.gtr-uniform > * { + padding-top: 1.5em; + } + + .row.gtr-150 { + margin-top: 0; + margin-left: -2.25em; + } + + .row.gtr-150 > * { + padding: 0 0 0 2.25em; + } + + .row.gtr-150.gtr-uniform { + margin-top: -2.25em; + } + + .row.gtr-150.gtr-uniform > * { + padding-top: 2.25em; + } + + .row.gtr-200 { + margin-top: 0; + margin-left: -3em; + } + + .row.gtr-200 > * { + padding: 0 0 0 3em; + } + + .row.gtr-200.gtr-uniform { + margin-top: -3em; + } + + .row.gtr-200.gtr-uniform > * { + padding-top: 3em; + } + +} + +@media screen and (max-width: 736px) { + + .row { + display: flex; + flex-wrap: wrap; + box-sizing: border-box; + align-items: stretch; + } + + .row > * { + box-sizing: border-box; + } + + .row.gtr-uniform > * > :last-child { + margin-bottom: 0; + } + + .row.aln-left { + justify-content: flex-start; + } + + .row.aln-center { + justify-content: center; + } + + .row.aln-right { + justify-content: flex-end; + } + + .row.aln-top { + align-items: flex-start; + } + + .row.aln-middle { + align-items: center; + } + + .row.aln-bottom { + align-items: flex-end; + } + + .row > .imp-small { + order: -1; + } + + .row > .col-1-small { + width: 8.33333%; + } + + .row > .off-1-small { + margin-left: 8.33333%; + } + + .row > .col-2-small { + width: 16.66667%; + } + + .row > .off-2-small { + margin-left: 16.66667%; + } + + .row > .col-3-small { + width: 25%; + } + + .row > .off-3-small { + margin-left: 25%; + } + + .row > .col-4-small { + width: 33.33333%; + } + + .row > .off-4-small { + margin-left: 33.33333%; + } + + .row > .col-5-small { + width: 41.66667%; + } + + .row > .off-5-small { + margin-left: 41.66667%; + } + + .row > .col-6-small { + width: 50%; + } + + .row > .off-6-small { + margin-left: 50%; + } + + .row > .col-7-small { + width: 58.33333%; + } + + .row > .off-7-small { + margin-left: 58.33333%; + } + + .row > .col-8-small { + width: 66.66667%; + } + + .row > .off-8-small { + margin-left: 66.66667%; + } + + .row > .col-9-small { + width: 75%; + } + + .row > .off-9-small { + margin-left: 75%; + } + + .row > .col-10-small { + width: 83.33333%; + } + + .row > .off-10-small { + margin-left: 83.33333%; + } + + .row > .col-11-small { + width: 91.66667%; + } + + .row > .off-11-small { + margin-left: 91.66667%; + } + + .row > .col-12-small { + width: 100%; + } + + .row > .off-12-small { + margin-left: 100%; + } + + .row.gtr-0 { + margin-top: 0; + margin-left: 0em; + } + + .row.gtr-0 > * { + padding: 0 0 0 0em; + } + + .row.gtr-0.gtr-uniform { + margin-top: 0em; + } + + .row.gtr-0.gtr-uniform > * { + padding-top: 0em; + } + + .row.gtr-25 { + margin-top: 0; + margin-left: -0.375em; + } + + .row.gtr-25 > * { + padding: 0 0 0 0.375em; + } + + .row.gtr-25.gtr-uniform { + margin-top: -0.375em; + } + + .row.gtr-25.gtr-uniform > * { + padding-top: 0.375em; + } + + .row.gtr-50 { + margin-top: 0; + margin-left: -0.75em; + } + + .row.gtr-50 > * { + padding: 0 0 0 0.75em; + } + + .row.gtr-50.gtr-uniform { + margin-top: -0.75em; + } + + .row.gtr-50.gtr-uniform > * { + padding-top: 0.75em; + } + + .row { + margin-top: 0; + margin-left: -1.5em; + } + + .row > * { + padding: 0 0 0 1.5em; + } + + .row.gtr-uniform { + margin-top: -1.5em; + } + + .row.gtr-uniform > * { + padding-top: 1.5em; + } + + .row.gtr-150 { + margin-top: 0; + margin-left: -2.25em; + } + + .row.gtr-150 > * { + padding: 0 0 0 2.25em; + } + + .row.gtr-150.gtr-uniform { + margin-top: -2.25em; + } + + .row.gtr-150.gtr-uniform > * { + padding-top: 2.25em; + } + + .row.gtr-200 { + margin-top: 0; + margin-left: -3em; + } + + .row.gtr-200 > * { + padding: 0 0 0 3em; + } + + .row.gtr-200.gtr-uniform { + margin-top: -3em; + } + + .row.gtr-200.gtr-uniform > * { + padding-top: 3em; + } + +} + +@media screen and (max-width: 480px) { + + .row { + display: flex; + flex-wrap: wrap; + box-sizing: border-box; + align-items: stretch; + } + + .row > * { + box-sizing: border-box; + } + + .row.gtr-uniform > * > :last-child { + margin-bottom: 0; + } + + .row.aln-left { + justify-content: flex-start; + } + + .row.aln-center { + justify-content: center; + } + + .row.aln-right { + justify-content: flex-end; + } + + .row.aln-top { + align-items: flex-start; + } + + .row.aln-middle { + align-items: center; + } + + .row.aln-bottom { + align-items: flex-end; + } + + .row > .imp-xsmall { + order: -1; + } + + .row > .col-1-xsmall { + width: 8.33333%; + } + + .row > .off-1-xsmall { + margin-left: 8.33333%; + } + + .row > .col-2-xsmall { + width: 16.66667%; + } + + .row > .off-2-xsmall { + margin-left: 16.66667%; + } + + .row > .col-3-xsmall { + width: 25%; + } + + .row > .off-3-xsmall { + margin-left: 25%; + } + + .row > .col-4-xsmall { + width: 33.33333%; + } + + .row > .off-4-xsmall { + margin-left: 33.33333%; + } + + .row > .col-5-xsmall { + width: 41.66667%; + } + + .row > .off-5-xsmall { + margin-left: 41.66667%; + } + + .row > .col-6-xsmall { + width: 50%; + } + + .row > .off-6-xsmall { + margin-left: 50%; + } + + .row > .col-7-xsmall { + width: 58.33333%; + } + + .row > .off-7-xsmall { + margin-left: 58.33333%; + } + + .row > .col-8-xsmall { + width: 66.66667%; + } + + .row > .off-8-xsmall { + margin-left: 66.66667%; + } + + .row > .col-9-xsmall { + width: 75%; + } + + .row > .off-9-xsmall { + margin-left: 75%; + } + + .row > .col-10-xsmall { + width: 83.33333%; + } + + .row > .off-10-xsmall { + margin-left: 83.33333%; + } + + .row > .col-11-xsmall { + width: 91.66667%; + } + + .row > .off-11-xsmall { + margin-left: 91.66667%; + } + + .row > .col-12-xsmall { + width: 100%; + } + + .row > .off-12-xsmall { + margin-left: 100%; + } + + .row.gtr-0 { + margin-top: 0; + margin-left: 0em; + } + + .row.gtr-0 > * { + padding: 0 0 0 0em; + } + + .row.gtr-0.gtr-uniform { + margin-top: 0em; + } + + .row.gtr-0.gtr-uniform > * { + padding-top: 0em; + } + + .row.gtr-25 { + margin-top: 0; + margin-left: -0.375em; + } + + .row.gtr-25 > * { + padding: 0 0 0 0.375em; + } + + .row.gtr-25.gtr-uniform { + margin-top: -0.375em; + } + + .row.gtr-25.gtr-uniform > * { + padding-top: 0.375em; + } + + .row.gtr-50 { + margin-top: 0; + margin-left: -0.75em; + } + + .row.gtr-50 > * { + padding: 0 0 0 0.75em; + } + + .row.gtr-50.gtr-uniform { + margin-top: -0.75em; + } + + .row.gtr-50.gtr-uniform > * { + padding-top: 0.75em; + } + + .row { + margin-top: 0; + margin-left: -1.5em; + } + + .row > * { + padding: 0 0 0 1.5em; + } + + .row.gtr-uniform { + margin-top: -1.5em; + } + + .row.gtr-uniform > * { + padding-top: 1.5em; + } + + .row.gtr-150 { + margin-top: 0; + margin-left: -2.25em; + } + + .row.gtr-150 > * { + padding: 0 0 0 2.25em; + } + + .row.gtr-150.gtr-uniform { + margin-top: -2.25em; + } + + .row.gtr-150.gtr-uniform > * { + padding-top: 2.25em; + } + + .row.gtr-200 { + margin-top: 0; + margin-left: -3em; + } + + .row.gtr-200 > * { + padding: 0 0 0 3em; + } + + .row.gtr-200.gtr-uniform { + margin-top: -3em; + } + + .row.gtr-200.gtr-uniform > * { + padding-top: 3em; + } + +} + +/* Section/Article */ + +section.special, article.special { + text-align: center; +} + +header p { + color: rgba(255, 255, 255, 0.5); + position: relative; + top: -0.25em; +} + +header h3 + p { + font-size: 1.1em; +} + +header h4 + p, +header h5 + p, +header h6 + p { + font-size: 0.9em; +} + +header.major { + margin: 0 0 3.5em 0; +} + +header.major h2, header.major h3, header.major h4, header.major h5, header.major h6 { + border-bottom: solid 2px #fff; + display: inline-block; + padding-bottom: 1em; + position: relative; +} + +header.major h2:after, header.major h3:after, header.major h4:after, header.major h5:after, header.major h6:after { + content: ''; + display: block; + height: 1px; +} + +header.major p { + color: #fff; + top: 0; +} + +@media screen and (max-width: 736px) { + + header.major { + margin: 0 0 2em 0; + } + +} + +@media screen and (max-width: 980px) { + + header br { + display: none; + } + +} + +/* Form */ + +form { + margin: 0 0 2em 0; +} + +label { + color: #fff; + display: block; + font-size: 0.9em; + font-weight: 600; + margin: 0 0 1em 0; +} + +input[type="text"], +input[type="password"], +input[type="email"], +select, +textarea { + -moz-appearance: none; + -webkit-appearance: none; + -ms-appearance: none; + appearance: none; + background-color: rgba(144, 144, 144, 0.25); + border-radius: 3px; + border: none; + color: inherit; + display: block; + outline: 0; + padding: 0 1em; + text-decoration: none; + width: 100%; +} + +input[type="text"]:invalid, +input[type="password"]:invalid, +input[type="email"]:invalid, +select:invalid, +textarea:invalid { + box-shadow: none; +} + +input[type="text"]:focus, +input[type="password"]:focus, +input[type="email"]:focus, +select:focus, +textarea:focus { + box-shadow: 0 0 0 2px #21b2a6; +} + +select { + background-size: 1.25em; + background-repeat: no-repeat; + background-position: calc(100% - 1em) center; + height: 2.75em; + padding-right: 2.75em; + text-overflow: ellipsis; +} + +select:focus::-ms-value { + background-color: transparent; +} + +select::-ms-expand { + display: none; +} + +input[type="text"], +input[type="password"], +input[type="email"], +select { + height: 2.75em; +} + +textarea { + padding: 0.75em 1em; +} + +input[type="checkbox"], +input[type="radio"] { + -moz-appearance: none; + -webkit-appearance: none; + -ms-appearance: none; + appearance: none; + display: block; + float: left; + margin-right: -2em; + opacity: 0; + width: 1em; + z-index: -1; +} + +input[type="checkbox"] + label, +input[type="radio"] + label { + text-decoration: none; + color: #fff; + cursor: pointer; + display: inline-block; + font-size: 1em; + font-weight: 400; + padding-left: 2.4em; + padding-right: 0.75em; + position: relative; +} + +input[type="checkbox"] + label:before, +input[type="radio"] + label:before { + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + display: inline-block; + font-style: normal; + font-variant: normal; + text-rendering: auto; + line-height: 1; + text-transform: none !important; + font-family: 'Font Awesome 5 Free'; + font-weight: 900; +} + +input[type="checkbox"] + label:before, +input[type="radio"] + label:before { + background: rgba(144, 144, 144, 0.25); + border-radius: 3px; + content: ''; + display: inline-block; + font-size: 0.8em; + height: 2.0625em; + left: 0; + line-height: 2.0625em; + position: absolute; + text-align: center; + top: 0; + width: 2.0625em; +} + +input[type="checkbox"]:checked + label:before, +input[type="radio"]:checked + label:before { + background: #2e3842; + color: #fff; + content: '\f00c'; +} + +input[type="checkbox"]:focus + label:before, +input[type="radio"]:focus + label:before { + box-shadow: 0 0 0 2px #21b2a6; +} + +input[type="checkbox"] + label:before { + border-radius: 3px; +} + +input[type="radio"] + label:before { + border-radius: 100%; +} + +::-webkit-input-placeholder { + color: rgba(255, 255, 255, 0.5) !important; + opacity: 1.0; +} + +:-moz-placeholder { + color: rgba(255, 255, 255, 0.5) !important; + opacity: 1.0; +} + +::-moz-placeholder { + color: rgba(255, 255, 255, 0.5) !important; + opacity: 1.0; +} + +:-ms-input-placeholder { + color: rgba(255, 255, 255, 0.5) !important; + opacity: 1.0; +} + +/* Box */ + +.box { + border-radius: 3px; + border: solid 2px #fff; + margin-bottom: 2em; + padding: 1.5em; +} + +.box > :last-child, +.box > :last-child > :last-child, +.box > :last-child > :last-child > :last-child { + margin-bottom: 0; +} + +.box.alt { + border: 0; + border-radius: 0; + padding: 0; +} + +/* Icon */ + +.icon { + text-decoration: none; + border-bottom: none; + position: relative; +} + +.icon:before { + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + display: inline-block; + font-style: normal; + font-variant: normal; + text-rendering: auto; + line-height: 1; + text-transform: none !important; + font-family: 'Font Awesome 5 Free'; + font-weight: 400; +} + +.icon > .label { + display: none; +} + +.icon:before { + line-height: inherit; +} + +.icon.solid:before { + font-weight: 900; +} + +.icon.brands:before { + font-family: 'Font Awesome 5 Brands'; +} + +.icon.major { + -moz-transform: rotate(-45deg); + -webkit-transform: rotate(-45deg); + -ms-transform: rotate(-45deg); + transform: rotate(-45deg); + border-radius: 3px; + border: solid 2px #fff; + display: inline-block; + font-size: 1.35em; + height: calc(3em + 2px); + line-height: 3em; + text-align: center; + width: calc(3em + 2px); +} + +.icon.major:before { + -moz-transform: rotate(45deg); + -webkit-transform: rotate(45deg); + -ms-transform: rotate(45deg); + transform: rotate(45deg); + display: inline-block; + font-size: 1.5em; +} + +@media screen and (max-width: 736px) { + + .icon.major { + font-size: 1em; + } + +} + +.icon.style1 { + color: #00ffcc; +} + +.icon.style2 { + color: #00f0ff; +} + +.icon.style3 { + color: #76ddff; +} + +/* Image */ + +.image { + border-radius: 3px; + border: 0; + display: inline-block; + position: relative; +} + +.image img { + border-radius: 3px; + display: block; +} + +.image.left { + float: left; + margin: 0 2em 2em 0; + top: 0.25em; +} + +.image.right { + float: right; + margin: 0 0 2em 2em; + top: 0.25em; +} + +.image.left, .image.right { + max-width: 40%; +} + +.image.left img, .image.right img { + width: 100%; +} + +.image.fit { + display: block; + margin: 0 0 2em 0; + width: 100%; +} + +.image.fit img { + width: 100%; +} + +/* List */ + +ol { + list-style: decimal; + margin: 0 0 2em 0; + padding-left: 1.25em; +} + +ol li { + padding-left: 0.25em; +} + +ul { + list-style: disc; + margin: 0 0 2em 0; + padding-left: 1em; +} + +ul li { + padding-left: 0.5em; +} + +ul.alt { + list-style: none; + padding-left: 0; +} + +ul.alt li { + border-top: solid 1px #fff; + padding: 0.5em 0; +} + +ul.alt li:first-child { + border-top: 0; + padding-top: 0; +} + +dl { + margin: 0 0 2em 0; +} + +/* Actions */ + +ul.actions { + display: -moz-flex; + display: -webkit-flex; + display: -ms-flex; + display: flex; + cursor: default; + list-style: none; + margin-left: -1em; + padding-left: 0; +} + +ul.actions li { + padding: 0 0 0 1em; + vertical-align: middle; +} + +ul.actions.special { + -moz-justify-content: center; + -webkit-justify-content: center; + -ms-justify-content: center; + justify-content: center; + width: 100%; + margin-left: 0; +} + +ul.actions.special li:first-child { + padding-left: 0; +} + +ul.actions.stacked { + -moz-flex-direction: column; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-left: 0; +} + +ul.actions.stacked li { + padding: 1em 0 0 0; +} + +ul.actions.stacked li:first-child { + padding-top: 0; +} + +ul.actions.fit { + width: calc(100% + 1em); +} + +ul.actions.fit li { + -moz-flex-grow: 1; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -moz-flex-shrink: 1; + -webkit-flex-shrink: 1; + -ms-flex-shrink: 1; + flex-shrink: 1; + width: 100%; +} + +ul.actions.fit li > * { + width: 100%; +} + +ul.actions.fit.stacked { + width: 100%; +} + +@media screen and (max-width: 480px) { + + ul.actions:not(.fixed) { + -moz-flex-direction: column; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-left: 0; + width: 100% !important; + } + + ul.actions:not(.fixed) li { + -moz-flex-grow: 1; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -moz-flex-shrink: 1; + -webkit-flex-shrink: 1; + -ms-flex-shrink: 1; + flex-shrink: 1; + padding: 1em 0 0 0; + text-align: center; + width: 100%; + } + + ul.actions:not(.fixed) li > * { + width: 100%; + } + + ul.actions:not(.fixed) li:first-child { + padding-top: 0; + } + + ul.actions:not(.fixed) li input[type="submit"], + ul.actions:not(.fixed) li input[type="reset"], + ul.actions:not(.fixed) li input[type="button"], + ul.actions:not(.fixed) li button, + ul.actions:not(.fixed) li .button { + width: 100%; + } + + ul.actions:not(.fixed) li input[type="submit"].icon:before, + ul.actions:not(.fixed) li input[type="reset"].icon:before, + ul.actions:not(.fixed) li input[type="button"].icon:before, + ul.actions:not(.fixed) li button.icon:before, + ul.actions:not(.fixed) li .button.icon:before { + margin-left: -0.5em; + } + +} + +/* Icons */ + +ul.icons { + cursor: default; + list-style: none; + padding-left: 0; +} + +ul.icons li { + display: inline-block; + padding: 0 1em 0 0; +} + +ul.icons li:last-child { + padding-right: 0 !important; +} + +ul.icons.major { + padding: 1em 0; +} + +ul.icons.major li { + padding-right: 3.5em; +} + +@media screen and (max-width: 736px) { + + ul.icons.major li { + padding: 0 1em !important; + } + +} + +/* Table */ + +.table-wrapper { + -webkit-overflow-scrolling: touch; + overflow-x: auto; +} + +table { + margin: 0 0 2em 0; + width: 100%; +} + +table tbody tr { + border: solid 1px #fff; + border-left: 0; + border-right: 0; +} + +table tbody tr:nth-child(2n + 1) { + background-color: rgba(144, 144, 144, 0.25); +} + +table td { + padding: 0.75em 0.75em; +} + +table th { + color: #fff; + font-size: 0.9em; + font-weight: 600; + padding: 0 0.75em 0.75em 0.75em; + text-align: left; +} + +table thead { + border-bottom: solid 2px #fff; +} + +table tfoot { + border-top: solid 2px #fff; +} + +table.alt { + border-collapse: separate; +} + +table.alt tbody tr td { + border: solid 1px #fff; + border-left-width: 0; + border-top-width: 0; +} + +table.alt tbody tr td:first-child { + border-left-width: 1px; +} + +table.alt tbody tr:first-child td { + border-top-width: 1px; +} + +table.alt thead { + border-bottom: 0; +} + +table.alt tfoot { + border-top: 0; +} + +/* Button */ + +input[type="submit"], +input[type="reset"], +input[type="button"], +button, +.button { + -moz-appearance: none; + -webkit-appearance: none; + -ms-appearance: none; + appearance: none; + -moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; + -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; + -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; + transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out; + background-color: transparent; + border-radius: 3px; + border: 0; + box-shadow: inset 0 0 0 2px #fff; + color: #fff; + cursor: pointer; + display: inline-block; + font-size: 0.8em; + font-weight: 600; + height: 3.125em; + letter-spacing: 0.225em; + line-height: 3.125em; + max-width: 30em; + padding: 0 2.75em; + text-align: center; + text-decoration: none; + text-transform: uppercase; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} + +input[type="submit"]:hover, +input[type="reset"]:hover, +input[type="button"]:hover, +button:hover, +.button:hover { + background-color: rgba(144, 144, 144, 0.25); +} + +input[type="submit"]:active, +input[type="reset"]:active, +input[type="button"]:active, +button:active, +.button:active { + background-color: rgba(144, 144, 144, 0.5); +} + +input[type="submit"].icon:before, +input[type="reset"].icon:before, +input[type="button"].icon:before, +button.icon:before, +.button.icon:before { + margin-right: 0.5em; +} + +input[type="submit"].fit, +input[type="reset"].fit, +input[type="button"].fit, +button.fit, +.button.fit { + width: 100%; +} + +input[type="submit"].small, +input[type="reset"].small, +input[type="button"].small, +button.small, +.button.small { + font-size: 0.8em; +} + +input[type="submit"].large, +input[type="reset"].large, +input[type="button"].large, +button.large, +.button.large { + font-size: 1.35em; +} + +input[type="submit"].primary, +input[type="reset"].primary, +input[type="button"].primary, +button.primary, +.button.primary { + background-color: #ed4933; + box-shadow: none !important; + color: #ffffff !important; +} + +input[type="submit"].primary:hover, +input[type="reset"].primary:hover, +input[type="button"].primary:hover, +button.primary:hover, +.button.primary:hover { + background-color: #ef5e4a !important; +} + +input[type="submit"].primary:active, +input[type="reset"].primary:active, +input[type="button"].primary:active, +button.primary:active, +.button.primary:active { + background-color: #eb341c !important; +} + +input[type="submit"].disabled, input[type="submit"]:disabled, +input[type="reset"].disabled, +input[type="reset"]:disabled, +input[type="button"].disabled, +input[type="button"]:disabled, +button.disabled, +button:disabled, +.button.disabled, +.button:disabled { + pointer-events: none; + opacity: 0.25; +} + +@media screen and (max-width: 736px) { + + input[type="submit"], + input[type="reset"], + input[type="button"], + button, + .button { + height: 3.75em; + line-height: 3.75em; + } + +} + +/* Features */ + +.features { + display: -moz-flex; + display: -webkit-flex; + display: -ms-flex; + display: flex; + -moz-flex-wrap: wrap; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -moz-justify-content: center; + -webkit-justify-content: center; + -ms-justify-content: center; + justify-content: center; + list-style: none; + padding: 0; + width: 100%; +} + +.features li { + padding: 4em 4em 2em 6em; + display: block; + position: relative; + text-align: left; + width: 50%; +} + +.features li:nth-child(1) { + background-color: rgba(0, 0, 0, 0.035); +} + +.features li:nth-child(2) { + background-color: rgba(0, 0, 0, 0.07); +} + +.features li:nth-child(3) { + background-color: rgba(0, 0, 0, 0.105); +} + +.features li:nth-child(4) { + background-color: rgba(0, 0, 0, 0.14); +} + +.features li:nth-child(5) { + background-color: rgba(0, 0, 0, 0.175); +} + +.features li:nth-child(6) { + background-color: rgba(0, 0, 0, 0.21); +} + +.features li:nth-child(7) { + background-color: rgba(0, 0, 0, 0.245); +} + +.features li:nth-child(8) { + background-color: rgba(0, 0, 0, 0.28); +} + +.features li:nth-child(9) { + background-color: rgba(0, 0, 0, 0.315); +} + +.features li:nth-child(10) { + background-color: rgba(0, 0, 0, 0.35); +} + +.features li:before { + display: block; + color: #00ffcc; + position: absolute; + left: 1.75em; + top: 2.75em; + font-size: 1.5em; +} + +.features li:nth-child(1) { + border-top-left-radius: 3px; +} + +.features li:nth-child(2) { + border-top-right-radius: 3px; +} + +.features li:nth-last-child(1) { + border-bottom-right-radius: 3px; +} + +.features li:nth-last-child(2) { + border-bottom-left-radius: 3px; +} + +@media screen and (max-width: 980px) { + + .features li { + padding: 3em 2em 1em 2em; + text-align: center; + } + + .features li:before { + left: 0; + margin: 0 0 1em 0; + position: relative; + top: 0; + } + +} + +@media screen and (max-width: 736px) { + + .features li { + padding: 3em 0 1em 0; + background-color: transparent !important; + border-top: solid 2px #fff; + width: 100%; + } + + .features li:first-child { + border-top: 0; + } + +} + +/* Spotlight */ + +.spotlight { + -moz-align-items: center; + -webkit-align-items: center; + -ms-align-items: center; + align-items: center; + display: -moz-flex; + display: -webkit-flex; + display: -ms-flex; + display: flex; +} + +.spotlight .image { + -moz-order: 1; + -webkit-order: 1; + -ms-order: 1; + order: 1; + border-radius: 0; + width: 40%; +} + +.spotlight .image img { + border-radius: 0; + width: 100%; +} + +.spotlight .content { + padding: 2em 4em 0.1em 4em; + -moz-order: 2; + -webkit-order: 2; + -ms-order: 2; + order: 2; + max-width: 48em; + width: 60%; +} + +.spotlight:nth-child(2n) { + -moz-flex-direction: row-reverse; + -webkit-flex-direction: row-reverse; + -ms-flex-direction: row-reverse; + flex-direction: row-reverse; +} + +.spotlight:nth-child(1) { + background-color: rgba(0, 0, 0, 0.075); +} + +.spotlight:nth-child(2) { + background-color: rgba(0, 0, 0, 0.15); +} + +.spotlight:nth-child(3) { + background-color: rgba(0, 0, 0, 0.225); +} + +.spotlight:nth-child(4) { + background-color: rgba(0, 0, 0, 0.3); +} + +.spotlight:nth-child(5) { + background-color: rgba(0, 0, 0, 0.375); +} + +.spotlight:nth-child(6) { + background-color: rgba(0, 0, 0, 0.45); +} + +.spotlight:nth-child(7) { + background-color: rgba(0, 0, 0, 0.525); +} + +.spotlight:nth-child(8) { + background-color: rgba(0, 0, 0, 0.6); +} + +.spotlight:nth-child(9) { + background-color: rgba(0, 0, 0, 0.675); +} + +.spotlight:nth-child(10) { + background-color: rgba(0, 0, 0, 0.75); +} + +@media screen and (max-width: 1280px) { + + .spotlight .image { + width: 45%; + } + + .spotlight .content { + width: 55%; + } + +} + +@media screen and (max-width: 980px) { + + .spotlight { + display: block; + } + + .spotlight br { + display: none; + } + + .spotlight .image { + width: 100%; + } + + .spotlight .content { + padding: 4em 3em 2em 3em; + max-width: none; + text-align: center; + width: 100%; + } + +} + +@media screen and (max-width: 736px) { + + .spotlight .content { + padding: 3em 2em 1em 2em; + } + +} + +/* Wrapper */ + +.wrapper { + padding: 6em 0 4em 0; +} + +.wrapper > .inner { + width: 60em; + margin: 0 auto; +} + +@media screen and (max-width: 1280px) { + + .wrapper > .inner { + width: 90%; + } + +} + +@media screen and (max-width: 980px) { + + .wrapper > .inner { + width: 100%; + } + +} + +.wrapper.alt { + padding: 0; +} + +.wrapper.style1 { + background-color: #21b2a6; + color: #c8ece9; +} + +.wrapper.style1 strong, .wrapper.style1 b { + color: #ffffff; +} + +.wrapper.style1 h2, .wrapper.style1 h3, .wrapper.style1 h4, .wrapper.style1 h5, .wrapper.style1 h6 { + color: #ffffff; +} + +.wrapper.style1 hr { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style1 blockquote { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style1 code { + background: rgba(255, 255, 255, 0.075); +} + +.wrapper.style1 header p { + color: #a6e0db; +} + +.wrapper.style1 header.major h2, .wrapper.style1 header.major h3, .wrapper.style1 header.major h4, .wrapper.style1 header.major h5, .wrapper.style1 header.major h6 { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style1 header.major p { + color: #c8ece9; +} + +.wrapper.style1 label { + color: #ffffff; +} + +.wrapper.style1 input[type="text"], +.wrapper.style1 input[type="password"], +.wrapper.style1 input[type="email"], +.wrapper.style1 select, +.wrapper.style1 textarea { + background-color: rgba(255, 255, 255, 0.075); +} + +.wrapper.style1 select { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'%3E%3Cpath d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='rgba(0, 0, 0, 0.125)' /%3E%3C/svg%3E"); +} + +.wrapper.style1 select option { + color: #ffffff; + background: #21b2a6; +} + +.wrapper.style1 input[type="checkbox"] + label, +.wrapper.style1 input[type="radio"] + label { + color: #c8ece9; +} + +.wrapper.style1 input[type="checkbox"] + label:before, +.wrapper.style1 input[type="radio"] + label:before { + background: rgba(255, 255, 255, 0.075); +} + +.wrapper.style1 input[type="checkbox"]:checked + label:before, +.wrapper.style1 input[type="radio"]:checked + label:before { + background: #ffffff; + color: #21b2a6; +} + +.wrapper.style1 ::-webkit-input-placeholder { + color: #a6e0db !important; +} + +.wrapper.style1 :-moz-placeholder { + color: #a6e0db !important; +} + +.wrapper.style1 ::-moz-placeholder { + color: #a6e0db !important; +} + +.wrapper.style1 :-ms-input-placeholder { + color: #a6e0db !important; +} + +.wrapper.style1 .formerize-placeholder { + color: #a6e0db !important; +} + +.wrapper.style1 .icon.major { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style1 ul.alt li { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style1 table tbody tr { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style1 table tbody tr:nth-child(2n + 1) { + background-color: rgba(255, 255, 255, 0.075); +} + +.wrapper.style1 table th { + color: #ffffff; +} + +.wrapper.style1 table thead { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style1 table tfoot { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style1 table.alt tbody tr td { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style1 input[type="submit"], +.wrapper.style1 input[type="reset"], +.wrapper.style1 input[type="button"], +.wrapper.style1 button, +.wrapper.style1 .button { + box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.125); + color: #ffffff; +} + +.wrapper.style1 input[type="submit"]:hover, +.wrapper.style1 input[type="reset"]:hover, +.wrapper.style1 input[type="button"]:hover, +.wrapper.style1 button:hover, +.wrapper.style1 .button:hover { + background-color: rgba(255, 255, 255, 0.075); +} + +.wrapper.style1 input[type="submit"]:active, +.wrapper.style1 input[type="reset"]:active, +.wrapper.style1 input[type="button"]:active, +.wrapper.style1 button:active, +.wrapper.style1 .button:active { + background-color: rgba(255, 255, 255, 0.2); +} + +@media screen and (max-width: 736px) { + + .wrapper.style1 .features li { + border-top-color: rgba(0, 0, 0, 0.125); + } + +} + +.wrapper.style2 { + background-color: #2e3842; +} + +.wrapper.style3 { + background-color: #505393; + color: #d3d4e4; +} + +.wrapper.style3 strong, .wrapper.style3 b { + color: #ffffff; +} + +.wrapper.style3 h2, .wrapper.style3 h3, .wrapper.style3 h4, .wrapper.style3 h5, .wrapper.style3 h6 { + color: #ffffff; +} + +.wrapper.style3 hr { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style3 blockquote { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style3 code { + background: rgba(255, 255, 255, 0.075); +} + +.wrapper.style3 header p { + color: #b9bad4; +} + +.wrapper.style3 header.major h2, .wrapper.style3 header.major h3, .wrapper.style3 header.major h4, .wrapper.style3 header.major h5, .wrapper.style3 header.major h6 { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style3 header.major p { + color: #d3d4e4; +} + +.wrapper.style3 label { + color: #ffffff; +} + +.wrapper.style3 input[type="text"], +.wrapper.style3 input[type="password"], +.wrapper.style3 input[type="email"], +.wrapper.style3 select, +.wrapper.style3 textarea { + background-color: rgba(255, 255, 255, 0.075); +} + +.wrapper.style3 select { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'%3E%3Cpath d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='rgba(0, 0, 0, 0.125)' /%3E%3C/svg%3E"); +} + +.wrapper.style3 select option { + color: #ffffff; + background: #505393; +} + +.wrapper.style3 input[type="checkbox"] + label, +.wrapper.style3 input[type="radio"] + label { + color: #d3d4e4; +} + +.wrapper.style3 input[type="checkbox"] + label:before, +.wrapper.style3 input[type="radio"] + label:before { + background: rgba(255, 255, 255, 0.075); +} + +.wrapper.style3 input[type="checkbox"]:checked + label:before, +.wrapper.style3 input[type="radio"]:checked + label:before { + background: #ffffff; + color: #505393; +} + +.wrapper.style3 ::-webkit-input-placeholder { + color: #b9bad4 !important; +} + +.wrapper.style3 :-moz-placeholder { + color: #b9bad4 !important; +} + +.wrapper.style3 ::-moz-placeholder { + color: #b9bad4 !important; +} + +.wrapper.style3 :-ms-input-placeholder { + color: #b9bad4 !important; +} + +.wrapper.style3 .formerize-placeholder { + color: #b9bad4 !important; +} + +.wrapper.style3 .icon.major { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style3 ul.alt li { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style3 table tbody tr { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style3 table tbody tr:nth-child(2n + 1) { + background-color: rgba(255, 255, 255, 0.075); +} + +.wrapper.style3 table th { + color: #ffffff; +} + +.wrapper.style3 table thead { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style3 table tfoot { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style3 table.alt tbody tr td { + border-color: rgba(0, 0, 0, 0.125); +} + +.wrapper.style3 input[type="submit"], +.wrapper.style3 input[type="reset"], +.wrapper.style3 input[type="button"], +.wrapper.style3 button, +.wrapper.style3 .button { + box-shadow: inset 0 0 0 2px rgba(0, 0, 0, 0.125); + color: #ffffff; +} + +.wrapper.style3 input[type="submit"]:hover, +.wrapper.style3 input[type="reset"]:hover, +.wrapper.style3 input[type="button"]:hover, +.wrapper.style3 button:hover, +.wrapper.style3 .button:hover { + background-color: rgba(255, 255, 255, 0.075); +} + +.wrapper.style3 input[type="submit"]:active, +.wrapper.style3 input[type="reset"]:active, +.wrapper.style3 input[type="button"]:active, +.wrapper.style3 button:active, +.wrapper.style3 .button:active { + background-color: rgba(255, 255, 255, 0.2); +} + +@media screen and (max-width: 736px) { + + .wrapper.style3 .features li { + border-top-color: rgba(0, 0, 0, 0.125); + } + +} + +.wrapper.style4 { + background-color: transparent; +} + +.wrapper.style5 { + background-color: #ffffff; + color: #4E4852; +} + +.wrapper.style5 strong, .wrapper.style5 b { + color: #2E3842; +} + +.wrapper.style5 h2, .wrapper.style5 h3, .wrapper.style5 h4, .wrapper.style5 h5, .wrapper.style5 h6 { + color: #2E3842; +} + +.wrapper.style5 hr { + border-color: #dfdfdf; +} + +.wrapper.style5 blockquote { + border-color: #dfdfdf; +} + +.wrapper.style5 code { + background: rgba(0, 0, 0, 0.0375); +} + +.wrapper.style5 header p { + color: #8E8892; +} + +.wrapper.style5 header.major h2, .wrapper.style5 header.major h3, .wrapper.style5 header.major h4, .wrapper.style5 header.major h5, .wrapper.style5 header.major h6 { + border-color: #dfdfdf; +} + +.wrapper.style5 header.major p { + color: #4E4852; +} + +.wrapper.style5 label { + color: #2E3842; +} + +.wrapper.style5 input[type="text"], +.wrapper.style5 input[type="password"], +.wrapper.style5 input[type="email"], +.wrapper.style5 select, +.wrapper.style5 textarea { + background-color: rgba(0, 0, 0, 0.0375); +} + +.wrapper.style5 select { + background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'%3E%3Cpath d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='%23dfdfdf' /%3E%3C/svg%3E"); +} + +.wrapper.style5 select option { + color: #2E3842; + background: #ffffff; +} + +.wrapper.style5 input[type="checkbox"] + label, +.wrapper.style5 input[type="radio"] + label { + color: #4E4852; +} + +.wrapper.style5 input[type="checkbox"] + label:before, +.wrapper.style5 input[type="radio"] + label:before { + background: rgba(0, 0, 0, 0.0375); +} + +.wrapper.style5 input[type="checkbox"]:checked + label:before, +.wrapper.style5 input[type="radio"]:checked + label:before { + background: #2E3842; + color: #ffffff; +} + +.wrapper.style5 ::-webkit-input-placeholder { + color: #8E8892 !important; +} + +.wrapper.style5 :-moz-placeholder { + color: #8E8892 !important; +} + +.wrapper.style5 ::-moz-placeholder { + color: #8E8892 !important; +} + +.wrapper.style5 :-ms-input-placeholder { + color: #8E8892 !important; +} + +.wrapper.style5 .formerize-placeholder { + color: #8E8892 !important; +} + +.wrapper.style5 .icon.major { + border-color: #dfdfdf; +} + +.wrapper.style5 ul.alt li { + border-color: #dfdfdf; +} + +.wrapper.style5 table tbody tr { + border-color: #dfdfdf; +} + +.wrapper.style5 table tbody tr:nth-child(2n + 1) { + background-color: rgba(0, 0, 0, 0.0375); +} + +.wrapper.style5 table th { + color: #2E3842; +} + +.wrapper.style5 table thead { + border-color: #dfdfdf; +} + +.wrapper.style5 table tfoot { + border-color: #dfdfdf; +} + +.wrapper.style5 table.alt tbody tr td { + border-color: #dfdfdf; +} + +.wrapper.style5 input[type="submit"], +.wrapper.style5 input[type="reset"], +.wrapper.style5 input[type="button"], +.wrapper.style5 button, +.wrapper.style5 .button { + box-shadow: inset 0 0 0 2px #dfdfdf; + color: #2E3842; +} + +.wrapper.style5 input[type="submit"]:hover, +.wrapper.style5 input[type="reset"]:hover, +.wrapper.style5 input[type="button"]:hover, +.wrapper.style5 button:hover, +.wrapper.style5 .button:hover { + background-color: rgba(0, 0, 0, 0.0375); +} + +.wrapper.style5 input[type="submit"]:active, +.wrapper.style5 input[type="reset"]:active, +.wrapper.style5 input[type="button"]:active, +.wrapper.style5 button:active, +.wrapper.style5 .button:active { + background-color: rgba(0, 0, 0, 0.1); +} + +@media screen and (max-width: 736px) { + + .wrapper.style5 .features li { + border-top-color: #dfdfdf; + } + +} + +@media screen and (max-width: 980px) { + + .wrapper { + padding: 4em 3em 2em 3em; + } + +} + +@media screen and (max-width: 736px) { + + .wrapper { + padding: 3em 2em 1em 2em; + } + +} + +/* Page Wrapper + Menu */ + +#page-wrapper { + -moz-transition: opacity 0.5s ease; + -webkit-transition: opacity 0.5s ease; + -ms-transition: opacity 0.5s ease; + transition: opacity 0.5s ease; + opacity: 1; + padding-top: 3em; +} + +#page-wrapper:before { + background: rgba(0, 0, 0, 0); + content: ''; + display: block; + display: none; + height: 100%; + left: 0; + position: fixed; + top: 0; + width: 100%; + z-index: 10001; +} + +#menu { + -moz-transform: translateX(20em); + -webkit-transform: translateX(20em); + -ms-transform: translateX(20em); + transform: translateX(20em); + -moz-transition: -moz-transform 0.5s ease; + -webkit-transition: -webkit-transform 0.5s ease; + -ms-transition: -ms-transform 0.5s ease; + transition: transform 0.5s ease; + -webkit-overflow-scrolling: touch; + background: #21b2a6; + color: #ffffff; + height: 100%; + max-width: 80%; + overflow-y: auto; + padding: 3em 2em; + position: fixed; + right: 0; + top: 0; + width: 20em; + z-index: 10002; +} + +#menu ul { + list-style: none; + padding: 0; +} + +#menu ul > li { + border-top: solid 1px rgba(0, 0, 0, 0.125); + margin: 0.5em 0 0 0; + padding: 0.5em 0 0 0; +} + +#menu ul > li:first-child { + border-top: 0 !important; + margin-top: 0 !important; + padding-top: 0 !important; +} + +#menu ul > li > a { + border: 0; + color: inherit; + display: block; + font-size: 0.8em; + letter-spacing: 0.225em; + outline: 0; + text-decoration: none; + text-transform: uppercase; +} + +@media screen and (max-width: 736px) { + + #menu ul > li > a { + line-height: 3em; + } + +} + +#menu .close { + background-image: url("/src/assets/images/close.svg"); + background-position: 4.85em 1em; + background-repeat: no-repeat; + border: 0; + cursor: pointer; + display: block; + height: 3em; + position: absolute; + right: 0; + top: 0; + vertical-align: middle; + width: 7em; +} + +@media screen and (max-width: 736px) { + + #menu { + padding: 3em 1.5em; + } + +} + +/* +body.is-menu-visible #page-wrapper { + opacity: 0.35; +} + +body.is-menu-visible #page-wrapper:before { + display: block; +} + */ + +body.is-menu-visible #menu { + -moz-transform: translateX(0); + -webkit-transform: translateX(0); + -ms-transform: translateX(0); + transform: translateX(0); +} + +/* Header */ + +#header { + -moz-transition: background-color 0.2s ease; + -webkit-transition: background-color 0.2s ease; + -ms-transition: background-color 0.2s ease; + transition: background-color 0.2s ease; + background: #2e3842; + height: 3em; + left: 0; + line-height: 3em; + position: fixed; + top: 0; + width: 100%; + z-index: 10000; +} + +#header h1 { + -moz-transition: opacity 0.2s ease; + -webkit-transition: opacity 0.2s ease; + -ms-transition: opacity 0.2s ease; + transition: opacity 0.2s ease; + height: inherit; + left: 1.25em; + line-height: inherit; + position: absolute; + top: 0; +} + +#header h1 a { + border: 0; + display: block; + height: inherit; + line-height: inherit; +} + +@media screen and (max-width: 736px) { + + #header h1 a { + font-size: 0.8em; + } + +} + +#header nav { + height: inherit; + line-height: inherit; + position: absolute; + right: 0; + top: 0; +} + +#header nav > ul { + list-style: none; + margin: 0; + padding: 0; + white-space: nowrap; +} + +#header nav > ul > li { + display: inline-block; + padding: 0; +} + +#header nav > ul > li > a { + border: 0; + color: #fff; + display: block; + font-size: 0.8em; + letter-spacing: 0.225em; + padding: 0 1.5em; + text-transform: uppercase; +} + +#header nav > ul > li > a.menuToggle { + outline: 0; + position: relative; +} + +#header nav > ul > li > a.menuToggle:after { + background-image: url("/src/assets/images/bars.svg"); + background-position: right center; + background-repeat: no-repeat; + content: ''; + display: inline-block; + height: 3.75em; + vertical-align: top; + width: 2em; +} + +@media screen and (max-width: 736px) { + + #header nav > ul > li > a.menuToggle { + padding: 0 1.5em; + } + + #header nav > ul > li > a.menuToggle span { + display: none; + } + +} + +@media screen and (max-width: 736px) { + + #header nav > ul > li > a { + padding: 0 0 0 1.5em; + } + +} + +#header nav > ul > li:first-child { + margin-left: 0; +} + +#header.alt { + background: transparent; +} + +#header.alt h1 { + pointer-events: none; + opacity: 0; +} + +/* Banner */ + +#banner { + display: -moz-flex; + display: -webkit-flex; + display: -ms-flex; + display: flex; + -moz-flex-direction: column; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -moz-justify-content: center; + -webkit-justify-content: center; + -ms-justify-content: center; + justify-content: center; + cursor: default; + height: 100vh; + min-height: 35em; + overflow: hidden; + position: relative; + text-align: center; +} + +#banner h2 { + -moz-transform: scale(1); + -webkit-transform: scale(1); + -ms-transform: scale(1); + transform: scale(1); + -moz-transition: -moz-transform 0.5s ease, opacity 0.5s ease; + -webkit-transition: -webkit-transform 0.5s ease, opacity 0.5s ease; + -ms-transition: -ms-transform 0.5s ease, opacity 0.5s ease; + transition: transform 0.5s ease, opacity 0.5s ease; + display: inline-block; + font-size: 1.75em; + opacity: 1; + padding: 0.35em 1em; + position: relative; + z-index: 1; +} + +#banner h2:before, #banner h2:after { + -moz-transition: width 0.85s ease; + -webkit-transition: width 0.85s ease; + -ms-transition: width 0.85s ease; + transition: width 0.85s ease; + -moz-transition-delay: 0.25s; + -webkit-transition-delay: 0.25s; + -ms-transition-delay: 0.25s; + transition-delay: 0.25s; + background: #fff; + content: ''; + display: block; + height: 2px; + position: absolute; + width: 100%; +} + +#banner h2:before { + top: 0; + left: 0; +} + +#banner h2:after { + bottom: 0; + right: 0; +} + +#banner p { + letter-spacing: 0.225em; + text-transform: uppercase; +} + +#banner p a { + color: inherit; +} + +#banner .more { + -moz-transition: -moz-transform 0.75s ease, opacity 0.75s ease; + -webkit-transition: -webkit-transform 0.75s ease, opacity 0.75s ease; + -ms-transition: -ms-transform 0.75s ease, opacity 0.75s ease; + transition: transform 0.75s ease, opacity 0.75s ease; + -moz-transition-delay: 3.5s; + -webkit-transition-delay: 3.5s; + -ms-transition-delay: 3.5s; + transition-delay: 3.5s; + -moz-transform: translateY(0); + -webkit-transform: translateY(0); + -ms-transform: translateY(0); + transform: translateY(0); + border: none; + bottom: 0; + color: inherit; + font-size: 0.8em; + height: 8.5em; + left: 50%; + letter-spacing: 0.225em; + margin-left: -8.5em; + opacity: 1; + outline: 0; + padding-left: 0.225em; + position: absolute; + text-align: center; + text-transform: uppercase; + width: 16em; + z-index: 1; +} + +#banner .more:after { + background-image: url("/src/assets/images/arrow.svg"); + background-position: center; + background-repeat: no-repeat; + background-size: contain; + bottom: 4em; + content: ''; + display: block; + height: 1.5em; + left: 50%; + margin: 0 0 0 -0.75em; + position: absolute; + width: 1.5em; +} + +#banner:after { + pointer-events: none; + -moz-transition: opacity 3s ease-in-out; + -webkit-transition: opacity 3s ease-in-out; + -ms-transition: opacity 3s ease-in-out; + transition: opacity 3s ease-in-out; + -moz-transition-delay: 1.25s; + -webkit-transition-delay: 1.25s; + -ms-transition-delay: 1.25s; + transition-delay: 1.25s; + content: ''; + background: #2e3842; + display: block; + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + opacity: 0; +} + +@media screen and (max-width: 736px) { + + #banner { + padding: 7em 3em 5em 3em; + height: auto; + min-height: 0; + } + + #banner h2 { + font-size: 1.25em; + } + + #banner br { + display: none; + } + + #banner .more { + display: none; + } + +} + +body.is-preload #banner h2 { + -moz-transform: scale(0.95); + -webkit-transform: scale(0.95); + -ms-transform: scale(0.95); + transform: scale(0.95); + opacity: 0; +} + +body.is-preload #banner h2:before, body.is-preload #banner h2:after { + width: 0; +} + +body.is-preload #banner .more { + -moz-transform: translateY(8.5em); + -webkit-transform: translateY(8.5em); + -ms-transform: translateY(8.5em); + transform: translateY(8.5em); + opacity: 0; +} + +body.is-preload #banner:after { + opacity: 1; +} + +/* CTA */ + +#cta .inner { + display: -moz-flex; + display: -webkit-flex; + display: -ms-flex; + display: flex; + max-width: 45em; +} + +#cta .inner header { + -moz-order: 1; + -webkit-order: 1; + -ms-order: 1; + order: 1; + padding-right: 3em; + width: 70%; +} + +#cta .inner header p { + color: inherit; +} + +#cta .inner .actions { + -moz-order: 2; + -webkit-order: 2; + -ms-order: 2; + order: 2; + width: 30%; +} + +@media screen and (max-width: 980px) { + + #cta .inner { + display: block; + text-align: center; + } + + #cta .inner header { + padding-right: 0; + width: 100%; + } + + #cta .inner .actions { + margin-left: auto; + margin-right: auto; + max-width: 20em; + width: 100%; + } + +} + +@media screen and (max-width: 736px) { + + #cta .inner .actions { + max-width: none; + } + +} + +/* Main */ + +#main > header { + padding: 12em 0 10em 0; + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-image: linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-attachment: fixed; + background-position: center center; + background-repeat: no-repeat; + background-size: cover; + text-align: center; +} + +#main > header h2 { + font-size: 1.75em; + margin: 0 0 0.5em 0; +} + +#main > header p { + color: inherit; + letter-spacing: 0.225em; + text-transform: uppercase; + top: 0; +} + +#main > header p a { + color: inherit; +} + +@media screen and (max-width: 1680px) { + + #main > header { + padding: 10em 0 8em 0; + } + +} + +@media screen and (max-width: 1280px) { + + #main > header { + padding: 8em 3em 6em 3em; + } + +} + +@media screen and (max-width: 980px) { + + #main > header { + padding: 10em 3em 8em 3em; + } + +} + +@media screen and (max-width: 736px) { + + #main > header { + padding: 5em 3em 3em 3em; + } + + #main > header h2 { + font-size: 1.25em; + margin: 0 0 1em 0; + } + +} + +body.is-mobile #main > header { + background-attachment: scroll; +} + +/* Footer */ + +#footer { + padding: 6em 0 4em 0; + background-color: #1d242a; + text-align: center; +} + +#footer .icons { + font-size: 1.25em; +} + +#footer .icons a { + color: rgba(255, 255, 255, 0.5); +} + +#footer .icons a:hover { + color: #fff; +} + +#footer .copyright { + color: rgba(255, 255, 255, 0.5); + font-size: 0.8em; + letter-spacing: 0.225em; + list-style: none; + padding: 0; + text-transform: uppercase; +} + +#footer .copyright li { + border-left: solid 1px rgba(255, 255, 255, 0.5); + display: inline-block; + line-height: 1em; + margin-left: 1em; + padding-left: 1em; +} + +#footer .copyright li:first-child { + border-left: 0; + margin-left: 0; + padding-left: 0; +} + +#footer .copyright li a { + color: inherit; +} + +#footer .copyright li a:hover { + color: #fff; +} + +@media screen and (max-width: 480px) { + + #footer .copyright li { + border: 0; + display: block; + line-height: 1.65em; + margin: 0; + padding: 0.5em 0; + } + +} + +@media screen and (max-width: 980px) { + + #footer { + padding: 4em 3em 2em 3em; + } + +} + +@media screen and (max-width: 736px) { + + #footer { + padding: 3em 2em 1em 2em; + } + +} + +/* Landing */ + +body.landing #page-wrapper { + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-image: linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-attachment: fixed; + background-position: center center; + background-repeat: no-repeat; + background-size: cover; + padding-top: 0; +} + +body.landing #footer { + background-color: rgba(29, 36, 42, 0.9); +} + +body.is-mobile.landing #page-wrapper { + background: none; +} + +body.is-mobile.landing #banner, +body.is-mobile.landing .wrapper.style4 { + background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-image: -ms-linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-image: linear-gradient(top, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("/src/assets/images/banner.jpg"); + background-position: center center; + background-repeat: no-repeat; + background-size: cover; +} + +body.is-mobile.landing #footer { + background-color: #1d242a; +} \ No newline at end of file diff --git a/src/assets/css/noscript.css b/src/assets/css/noscript.css new file mode 100644 index 0000000..c9a111f --- /dev/null +++ b/src/assets/css/noscript.css @@ -0,0 +1,31 @@ +/* + Spectral by HTML5 UP + html5up.net | @ajlkn + Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +*/ + +/* Banner */ + + body.is-preload #banner h2 { + -moz-transform: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; + opacity: 1; + } + + body.is-preload #banner h2:before, body.is-preload #banner h2:after { + width: 100%; + } + + body.is-preload #banner .more { + -moz-transform: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; + opacity: 1; + } + + body.is-preload #banner:after { + opacity: 0; + } \ No newline at end of file diff --git a/assets/PM.svg b/src/assets/images/PM.svg similarity index 100% rename from assets/PM.svg rename to src/assets/images/PM.svg diff --git a/assets/PM_FRONT.jpeg b/src/assets/images/PM_FRONT.jpeg similarity index 100% rename from assets/PM_FRONT.jpeg rename to src/assets/images/PM_FRONT.jpeg diff --git a/assets/ProfessionMate.mov b/src/assets/images/ProfessionMate.mov similarity index 100% rename from assets/ProfessionMate.mov rename to src/assets/images/ProfessionMate.mov diff --git a/assets/TruncatedIcosahedron.svg b/src/assets/images/TruncatedIcosahedron.svg similarity index 100% rename from assets/TruncatedIcosahedron.svg rename to src/assets/images/TruncatedIcosahedron.svg diff --git a/assets/current/media_disrupt.webp b/src/assets/images/allies/media_disrupt.webp similarity index 100% rename from assets/current/media_disrupt.webp rename to src/assets/images/allies/media_disrupt.webp diff --git a/assets/current/media_redx.webp b/src/assets/images/allies/media_redx.webp similarity index 100% rename from assets/current/media_redx.webp rename to src/assets/images/allies/media_redx.webp diff --git a/assets/current/media_the_royal_heir_post.webp b/src/assets/images/allies/media_the_royal_heir_post.webp similarity index 100% rename from assets/current/media_the_royal_heir_post.webp rename to src/assets/images/allies/media_the_royal_heir_post.webp diff --git a/assets/current/staffing_csl.webp b/src/assets/images/allies/staffing_csl.webp similarity index 100% rename from assets/current/staffing_csl.webp rename to src/assets/images/allies/staffing_csl.webp diff --git a/assets/current/staffing_culinaire.webp b/src/assets/images/allies/staffing_culinaire.webp similarity index 100% rename from assets/current/staffing_culinaire.webp rename to src/assets/images/allies/staffing_culinaire.webp diff --git a/assets/current/staffing_grassroots.webp b/src/assets/images/allies/staffing_grassroots.webp similarity index 100% rename from assets/current/staffing_grassroots.webp rename to src/assets/images/allies/staffing_grassroots.webp diff --git a/assets/current/staffing_guidehouse.jpeg b/src/assets/images/allies/staffing_guidehouse.jpeg similarity index 100% rename from assets/current/staffing_guidehouse.jpeg rename to src/assets/images/allies/staffing_guidehouse.jpeg diff --git a/assets/current/staffing_modern_culture.webp b/src/assets/images/allies/staffing_modern_culture.webp similarity index 100% rename from assets/current/staffing_modern_culture.webp rename to src/assets/images/allies/staffing_modern_culture.webp diff --git a/assets/current/staffing_ncw.jpeg b/src/assets/images/allies/staffing_ncw.jpeg similarity index 100% rename from assets/current/staffing_ncw.jpeg rename to src/assets/images/allies/staffing_ncw.jpeg diff --git a/assets/current/staffing_premier_staffing_inc.jpeg b/src/assets/images/allies/staffing_premier_staffing_inc.jpeg similarity index 100% rename from assets/current/staffing_premier_staffing_inc.jpeg rename to src/assets/images/allies/staffing_premier_staffing_inc.jpeg diff --git a/assets/current/staffing_proclinical.webp b/src/assets/images/allies/staffing_proclinical.webp similarity index 100% rename from assets/current/staffing_proclinical.webp rename to src/assets/images/allies/staffing_proclinical.webp diff --git a/assets/current/staffing_sales_fit.webp b/src/assets/images/allies/staffing_sales_fit.webp similarity index 100% rename from assets/current/staffing_sales_fit.webp rename to src/assets/images/allies/staffing_sales_fit.webp diff --git a/assets/current/staffing_tql.webp b/src/assets/images/allies/staffing_tql.webp similarity index 100% rename from assets/current/staffing_tql.webp rename to src/assets/images/allies/staffing_tql.webp diff --git a/src/assets/images/arrow.svg b/src/assets/images/arrow.svg new file mode 100644 index 0000000..49ee37c --- /dev/null +++ b/src/assets/images/arrow.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/src/assets/images/banner.jpg b/src/assets/images/banner.jpg new file mode 100644 index 0000000..d5423e2 Binary files /dev/null and b/src/assets/images/banner.jpg differ diff --git a/src/assets/images/bars.svg b/src/assets/images/bars.svg new file mode 100644 index 0000000..50e4e41 --- /dev/null +++ b/src/assets/images/bars.svg @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/src/assets/images/close.svg b/src/assets/images/close.svg new file mode 100644 index 0000000..3ad8786 --- /dev/null +++ b/src/assets/images/close.svg @@ -0,0 +1,5 @@ + + + + + \ No newline at end of file diff --git a/assets/dalle1.webp b/src/assets/images/dalle1.webp similarity index 100% rename from assets/dalle1.webp rename to src/assets/images/dalle1.webp diff --git a/assets/dalle10.webp b/src/assets/images/dalle10.webp similarity index 100% rename from assets/dalle10.webp rename to src/assets/images/dalle10.webp diff --git a/assets/dalle11.webp b/src/assets/images/dalle11.webp similarity index 100% rename from assets/dalle11.webp rename to src/assets/images/dalle11.webp diff --git a/assets/dalle12.webp b/src/assets/images/dalle12.webp similarity index 100% rename from assets/dalle12.webp rename to src/assets/images/dalle12.webp diff --git a/assets/dalle13.webp b/src/assets/images/dalle13.webp similarity index 100% rename from assets/dalle13.webp rename to src/assets/images/dalle13.webp diff --git a/assets/dalle14.webp b/src/assets/images/dalle14.webp similarity index 100% rename from assets/dalle14.webp rename to src/assets/images/dalle14.webp diff --git a/assets/dalle15.webp b/src/assets/images/dalle15.webp similarity index 100% rename from assets/dalle15.webp rename to src/assets/images/dalle15.webp diff --git a/assets/dalle16.webp b/src/assets/images/dalle16.webp similarity index 100% rename from assets/dalle16.webp rename to src/assets/images/dalle16.webp diff --git a/assets/dalle17.webp b/src/assets/images/dalle17.webp similarity index 100% rename from assets/dalle17.webp rename to src/assets/images/dalle17.webp diff --git a/assets/dalle18.webp b/src/assets/images/dalle18.webp similarity index 100% rename from assets/dalle18.webp rename to src/assets/images/dalle18.webp diff --git a/assets/dalle19.webp b/src/assets/images/dalle19.webp similarity index 100% rename from assets/dalle19.webp rename to src/assets/images/dalle19.webp diff --git a/assets/dalle2.webp b/src/assets/images/dalle2.webp similarity index 100% rename from assets/dalle2.webp rename to src/assets/images/dalle2.webp diff --git a/assets/dalle20.webp b/src/assets/images/dalle20.webp similarity index 100% rename from assets/dalle20.webp rename to src/assets/images/dalle20.webp diff --git a/assets/dalle21.webp b/src/assets/images/dalle21.webp similarity index 100% rename from assets/dalle21.webp rename to src/assets/images/dalle21.webp diff --git a/assets/dalle22.webp b/src/assets/images/dalle22.webp similarity index 100% rename from assets/dalle22.webp rename to src/assets/images/dalle22.webp diff --git a/assets/dalle23.webp b/src/assets/images/dalle23.webp similarity index 100% rename from assets/dalle23.webp rename to src/assets/images/dalle23.webp diff --git a/assets/dalle24.webp b/src/assets/images/dalle24.webp similarity index 100% rename from assets/dalle24.webp rename to src/assets/images/dalle24.webp diff --git a/src/assets/images/dalle25.webp b/src/assets/images/dalle25.webp new file mode 100644 index 0000000..102091c Binary files /dev/null and b/src/assets/images/dalle25.webp differ diff --git a/src/assets/images/dalle26.webp b/src/assets/images/dalle26.webp new file mode 100644 index 0000000..de730f1 Binary files /dev/null and b/src/assets/images/dalle26.webp differ diff --git a/src/assets/images/dalle27.webp b/src/assets/images/dalle27.webp new file mode 100644 index 0000000..4bfcc75 Binary files /dev/null and b/src/assets/images/dalle27.webp differ diff --git a/assets/dalle3.webp b/src/assets/images/dalle3.webp similarity index 100% rename from assets/dalle3.webp rename to src/assets/images/dalle3.webp diff --git a/assets/dalle4.webp b/src/assets/images/dalle4.webp similarity index 100% rename from assets/dalle4.webp rename to src/assets/images/dalle4.webp diff --git a/assets/dalle5.webp b/src/assets/images/dalle5.webp similarity index 100% rename from assets/dalle5.webp rename to src/assets/images/dalle5.webp diff --git a/assets/dalle6.webp b/src/assets/images/dalle6.webp similarity index 100% rename from assets/dalle6.webp rename to src/assets/images/dalle6.webp diff --git a/assets/dalle8.webp b/src/assets/images/dalle8.webp similarity index 100% rename from assets/dalle8.webp rename to src/assets/images/dalle8.webp diff --git a/assets/dalle9.webp b/src/assets/images/dalle9.webp similarity index 100% rename from assets/dalle9.webp rename to src/assets/images/dalle9.webp diff --git a/assets/dalleIcons1.webp b/src/assets/images/dalleIcons1.webp similarity index 100% rename from assets/dalleIcons1.webp rename to src/assets/images/dalleIcons1.webp diff --git a/assets/img.png b/src/assets/images/img.png similarity index 100% rename from assets/img.png rename to src/assets/images/img.png diff --git a/src/assets/images/people/dariush.webp b/src/assets/images/people/dariush.webp new file mode 100644 index 0000000..edd0a6f Binary files /dev/null and b/src/assets/images/people/dariush.webp differ diff --git a/src/assets/images/people/george.webp b/src/assets/images/people/george.webp new file mode 100644 index 0000000..9c4677d Binary files /dev/null and b/src/assets/images/people/george.webp differ diff --git a/src/assets/images/people/jonah.webp b/src/assets/images/people/jonah.webp new file mode 100644 index 0000000..19edb30 Binary files /dev/null and b/src/assets/images/people/jonah.webp differ diff --git a/src/assets/images/people/rachel.webp b/src/assets/images/people/rachel.webp new file mode 100644 index 0000000..819fdaa Binary files /dev/null and b/src/assets/images/people/rachel.webp differ diff --git a/src/assets/images/people/rati.webp b/src/assets/images/people/rati.webp new file mode 100644 index 0000000..09dfad2 Binary files /dev/null and b/src/assets/images/people/rati.webp differ diff --git a/src/assets/images/people/roan.webp b/src/assets/images/people/roan.webp new file mode 100644 index 0000000..ed19297 Binary files /dev/null and b/src/assets/images/people/roan.webp differ diff --git a/src/assets/images/pic01.jpg b/src/assets/images/pic01.jpg new file mode 100644 index 0000000..a14ad04 Binary files /dev/null and b/src/assets/images/pic01.jpg differ diff --git a/src/assets/images/pic02.jpg b/src/assets/images/pic02.jpg new file mode 100644 index 0000000..57a2a83 Binary files /dev/null and b/src/assets/images/pic02.jpg differ diff --git a/src/assets/images/pic03.jpg b/src/assets/images/pic03.jpg new file mode 100644 index 0000000..cab2c29 Binary files /dev/null and b/src/assets/images/pic03.jpg differ diff --git a/src/assets/images/pic04.jpg b/src/assets/images/pic04.jpg new file mode 100644 index 0000000..86b93fc Binary files /dev/null and b/src/assets/images/pic04.jpg differ diff --git a/src/assets/images/pic05.jpg b/src/assets/images/pic05.jpg new file mode 100644 index 0000000..f2fc227 Binary files /dev/null and b/src/assets/images/pic05.jpg differ diff --git a/assets/services/apply.webp b/src/assets/images/services/apply.webp similarity index 100% rename from assets/services/apply.webp rename to src/assets/images/services/apply.webp diff --git a/assets/services/consulting.webp b/src/assets/images/services/consulting.webp similarity index 100% rename from assets/services/consulting.webp rename to src/assets/images/services/consulting.webp diff --git a/assets/services/mock.webp b/src/assets/images/services/mock.webp similarity index 100% rename from assets/services/mock.webp rename to src/assets/images/services/mock.webp diff --git a/assets/services/money.webp b/src/assets/images/services/money.webp similarity index 100% rename from assets/services/money.webp rename to src/assets/images/services/money.webp diff --git a/assets/services/optimization.webp b/src/assets/images/services/optimization.webp similarity index 100% rename from assets/services/optimization.webp rename to src/assets/images/services/optimization.webp diff --git a/assets/services/search.webp b/src/assets/images/services/search.webp similarity index 100% rename from assets/services/search.webp rename to src/assets/images/services/search.webp diff --git a/src/assets/js/breakpoints.min.js b/src/assets/js/breakpoints.min.js new file mode 100644 index 0000000..32419cc --- /dev/null +++ b/src/assets/js/breakpoints.min.js @@ -0,0 +1,2 @@ +/* breakpoints.js v1.0 | @ajlkn | MIT licensed */ +var breakpoints=function(){"use strict";function e(e){t.init(e)}var t={list:null,media:{},events:[],init:function(e){t.list=e,window.addEventListener("resize",t.poll),window.addEventListener("orientationchange",t.poll),window.addEventListener("load",t.poll),window.addEventListener("fullscreenchange",t.poll)},active:function(e){var n,a,s,i,r,d,c;if(!(e in t.media)){if(">="==e.substr(0,2)?(a="gte",n=e.substr(2)):"<="==e.substr(0,2)?(a="lte",n=e.substr(2)):">"==e.substr(0,1)?(a="gt",n=e.substr(1)):"<"==e.substr(0,1)?(a="lt",n=e.substr(1)):"!"==e.substr(0,1)?(a="not",n=e.substr(1)):(a="eq",n=e),n&&n in t.list)if(i=t.list[n],Array.isArray(i)){if(r=parseInt(i[0]),d=parseInt(i[1]),isNaN(r)){if(isNaN(d))return;c=i[1].substr(String(d).length)}else c=i[0].substr(String(r).length);if(isNaN(r))switch(a){case"gte":s="screen";break;case"lte":s="screen and (max-width: "+d+c+")";break;case"gt":s="screen and (min-width: "+(d+1)+c+")";break;case"lt":s="screen and (max-width: -1px)";break;case"not":s="screen and (min-width: "+(d+1)+c+")";break;default:s="screen and (max-width: "+d+c+")"}else if(isNaN(d))switch(a){case"gte":s="screen and (min-width: "+r+c+")";break;case"lte":s="screen";break;case"gt":s="screen and (max-width: -1px)";break;case"lt":s="screen and (max-width: "+(r-1)+c+")";break;case"not":s="screen and (max-width: "+(r-1)+c+")";break;default:s="screen and (min-width: "+r+c+")"}else switch(a){case"gte":s="screen and (min-width: "+r+c+")";break;case"lte":s="screen and (max-width: "+d+c+")";break;case"gt":s="screen and (min-width: "+(d+1)+c+")";break;case"lt":s="screen and (max-width: "+(r-1)+c+")";break;case"not":s="screen and (max-width: "+(r-1)+c+"), screen and (min-width: "+(d+1)+c+")";break;default:s="screen and (min-width: "+r+c+") and (max-width: "+d+c+")"}}else s="("==i.charAt(0)?"screen and "+i:i;t.media[e]=!!s&&s}return t.media[e]!==!1&&window.matchMedia(t.media[e]).matches},on:function(e,n){t.events.push({query:e,handler:n,state:!1}),t.active(e)&&n()},poll:function(){var e,n;for(e=0;e+~]|"+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&&e.namespaceURI,n=e&&(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},j=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 j(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||D,"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,D=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 je(e,t){return A(e,"table")&&A(11!==t.nodeType?t:t.firstChild,"tr")&&S(e).children("tbody")[0]||e}function De(e){return e.type=(null!==e.getAttribute("type"))+"/"+e.type,e}function qe(e){return"true/"===(e.type||"").slice(0,5)?e.type=e.type.slice(5):e.removeAttribute("type"),e}function Le(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 _t,zt=[],Ut=/(=)\?(?=&|$)|\?\?/;S.ajaxSetup({jsonp:"callback",jsonpCallback:function(){var e=zt.pop()||S.expando+"_"+wt.guid++;return this[e]=!0,e}}),S.ajaxPrefilter("json jsonp",function(e,t,n){var r,i,o,a=!1!==e.jsonp&&(Ut.test(e.url)?"url":"string"==typeof e.data&&0===(e.contentType||"").indexOf("application/x-www-form-urlencoded")&&Ut.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(Ut,"$1"+r):!1!==e.jsonp&&(e.url+=(Tt.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,zt.push(r)),o&&m(i)&&i(o[0]),o=i=void 0}),"script"}),y.createHTMLDocument=((_t=E.implementation.createHTMLDocument("").body).innerHTML="
",2===_t.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):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]=Fe(y.pixelPosition,function(e,t){if(t)return t=We(e,n),Pe.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 01){for(var r=0;r=i&&o>=t};break;case"bottom":h=function(t,e,n,i,o){return n>=i&&o>=n};break;case"middle":h=function(t,e,n,i,o){return e>=i&&o>=e};break;case"top-only":h=function(t,e,n,i,o){return i>=t&&n>=i};break;case"bottom-only":h=function(t,e,n,i,o){return n>=o&&o>=t};break;default:case"default":h=function(t,e,n,i,o){return n>=i&&o>=t}}return c=function(t){var i,o,l,s,r,a,u=this.state,h=!1,c=this.$element.offset();i=n.height(),o=t+i/2,l=t+i,s=this.$element.outerHeight(),r=c.top+e(this.options.top,s,i),a=c.top+s-e(this.options.bottom,s,i),h=this.test(t,o,l,r,a),h!=u&&(this.state=h,h?this.options.enter&&this.options.enter.apply(this.element):this.options.leave&&this.options.leave.apply(this.element)),this.options.scroll&&this.options.scroll.apply(this.element,[(o-r)/(a-r)])},p={id:a,options:u,test:h,handler:c,state:null,element:this,$element:s,timeoutId:null},o[a]=p,s.data("_scrollexId",p.id),p.options.initialize&&p.options.initialize.apply(this),s},jQuery.fn.unscrollex=function(){var e=t(this);if(0==this.length)return e;if(this.length>1){for(var n=0;n1){for(o=0;omedium', function() { + $body.removeClass('is-mobile'); + }); + + breakpoints.on('<=medium', function() { + $body.addClass('is-mobile'); + }); + + } + + // Scrolly. + $('.scrolly') + .scrolly({ + speed: 1500, + offset: $header.outerHeight() + }); + + // Menu. + $('#menu') + .append('') + .appendTo($body) + .panel({ + delay: 500, + hideOnClick: true, + hideOnSwipe: true, + resetScroll: true, + resetForms: true, + side: 'right', + target: $body, + visibleClass: 'is-menu-visible' + }); + + // Header. + if ($banner.length > 0 + && $header.hasClass('alt')) { + + $window.on('resize', function() { $window.trigger('scroll'); }); + + $banner.scrollex({ + bottom: $header.outerHeight() + 1, + terminate: function() { $header.removeClass('alt'); }, + enter: function() { $header.addClass('alt'); }, + leave: function() { $header.removeClass('alt'); } + }); + + } + +})(jQuery); \ No newline at end of file diff --git a/src/assets/js/util.js b/src/assets/js/util.js new file mode 100644 index 0000000..bdb8e9f --- /dev/null +++ b/src/assets/js/util.js @@ -0,0 +1,587 @@ +(function($) { + + /** + * Generate an indented list of links from a nav. Meant for use with panel(). + * @return {jQuery} jQuery object. + */ + $.fn.navList = function() { + + var $this = $(this); + $a = $this.find('a'), + b = []; + + $a.each(function() { + + var $this = $(this), + indent = Math.max(0, $this.parents('li').length - 1), + href = $this.attr('href'), + target = $this.attr('target'); + + b.push( + '' + + '' + + $this.text() + + '' + ); + + }); + + return b.join(''); + + }; + + /** + * Panel-ify an element. + * @param {object} userConfig User config. + * @return {jQuery} jQuery object. + */ + $.fn.panel = function(userConfig) { + + // No elements? + if (this.length == 0) + return $this; + + // Multiple elements? + if (this.length > 1) { + + for (var i=0; i < this.length; i++) + $(this[i]).panel(userConfig); + + return $this; + + } + + // Vars. + var $this = $(this), + $body = $('body'), + $window = $(window), + id = $this.attr('id'), + config; + + // Config. + config = $.extend({ + + // Delay. + delay: 0, + + // Hide panel on link click. + hideOnClick: false, + + // Hide panel on escape keypress. + hideOnEscape: false, + + // Hide panel on swipe. + hideOnSwipe: false, + + // Reset scroll position on hide. + resetScroll: false, + + // Reset forms on hide. + resetForms: false, + + // Side of viewport the panel will appear. + side: null, + + // Target element for "class". + target: $this, + + // Class to toggle. + visibleClass: 'visible' + + }, userConfig); + + // Expand "target" if it's not a jQuery object already. + if (typeof config.target != 'jQuery') + config.target = $(config.target); + + // Panel. + + // Methods. + $this._hide = function(event) { + + // Already hidden? Bail. + if (!config.target.hasClass(config.visibleClass)) + return; + + // If an event was provided, cancel it. + if (event) { + + event.preventDefault(); + event.stopPropagation(); + + } + + // Hide. + config.target.removeClass(config.visibleClass); + + // Post-hide stuff. + window.setTimeout(function() { + + // Reset scroll position. + if (config.resetScroll) + $this.scrollTop(0); + + // Reset forms. + if (config.resetForms) + $this.find('form').each(function() { + this.reset(); + }); + + }, config.delay); + + }; + + // Vendor fixes. + $this + .css('-ms-overflow-style', '-ms-autohiding-scrollbar') + .css('-webkit-overflow-scrolling', 'touch'); + + // Hide on click. + if (config.hideOnClick) { + + $this.find('a') + .css('-webkit-tap-highlight-color', 'rgba(0,0,0,0)'); + + $this + .on('click', 'a', function(event) { + + var $a = $(this), + href = $a.attr('href'), + target = $a.attr('target'); + + if (!href || href == '#' || href == '' || href == '#' + id) + return; + + // Cancel original event. + event.preventDefault(); + event.stopPropagation(); + + // Hide panel. + $this._hide(); + + // Redirect to href. + window.setTimeout(function() { + + if (target == '_blank') + window.open(href); + else + window.location.href = href; + + }, config.delay + 10); + + }); + + } + + // Event: Touch stuff. + $this.on('touchstart', function(event) { + + $this.touchPosX = event.originalEvent.touches[0].pageX; + $this.touchPosY = event.originalEvent.touches[0].pageY; + + }) + + $this.on('touchmove', function(event) { + + if ($this.touchPosX === null + || $this.touchPosY === null) + return; + + var diffX = $this.touchPosX - event.originalEvent.touches[0].pageX, + diffY = $this.touchPosY - event.originalEvent.touches[0].pageY, + th = $this.outerHeight(), + ts = ($this.get(0).scrollHeight - $this.scrollTop()); + + // Hide on swipe? + if (config.hideOnSwipe) { + + var result = false, + boundary = 20, + delta = 50; + + switch (config.side) { + + case 'left': + result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX > delta); + break; + + case 'right': + result = (diffY < boundary && diffY > (-1 * boundary)) && (diffX < (-1 * delta)); + break; + + case 'top': + result = (diffX < boundary && diffX > (-1 * boundary)) && (diffY > delta); + break; + + case 'bottom': + result = (diffX < boundary && diffX > (-1 * boundary)) && (diffY < (-1 * delta)); + break; + + default: + break; + + } + + if (result) { + + $this.touchPosX = null; + $this.touchPosY = null; + $this._hide(); + + return false; + + } + + } + + // Prevent vertical scrolling past the top or bottom. + if (($this.scrollTop() < 0 && diffY < 0) + || (ts > (th - 2) && ts < (th + 2) && diffY > 0)) { + + event.preventDefault(); + event.stopPropagation(); + + } + + }); + + // Event: Prevent certain events inside the panel from bubbling. + $this.on('click touchend touchstart touchmove', function(event) { + event.stopPropagation(); + }); + + // Event: Hide panel if a child anchor tag pointing to its ID is clicked. + $this.on('click', 'a[href="#' + id + '"]', function(event) { + + event.preventDefault(); + event.stopPropagation(); + + config.target.removeClass(config.visibleClass); + + }); + + // Body. + + // Event: Hide panel on body click/tap. + $body.on('click touchend', function(event) { + $this._hide(event); + }); + + // Event: Toggle. + $body.on('click', 'a[href="#' + id + '"]', function(event) { + + event.preventDefault(); + event.stopPropagation(); + + config.target.toggleClass(config.visibleClass); + + }); + + // Window. + + // Event: Hide on ESC. + if (config.hideOnEscape) + $window.on('keydown', function(event) { + + if (event.keyCode == 27) + $this._hide(event); + + }); + + return $this; + + }; + + /** + * Apply "placeholder" attribute polyfill to one or more forms. + * @return {jQuery} jQuery object. + */ + $.fn.placeholder = function() { + + // Browser natively supports placeholders? Bail. + if (typeof (document.createElement('input')).placeholder != 'undefined') + return $(this); + + // No elements? + if (this.length == 0) + return $this; + + // Multiple elements? + if (this.length > 1) { + + for (var i=0; i < this.length; i++) + $(this[i]).placeholder(); + + return $this; + + } + + // Vars. + var $this = $(this); + + // Text, TextArea. + $this.find('input[type=text],textarea') + .each(function() { + + var i = $(this); + + if (i.val() == '' + || i.val() == i.attr('placeholder')) + i + .addClass('polyfill-placeholder') + .val(i.attr('placeholder')); + + }) + .on('blur', function() { + + var i = $(this); + + if (i.attr('name').match(/-polyfill-field$/)) + return; + + if (i.val() == '') + i + .addClass('polyfill-placeholder') + .val(i.attr('placeholder')); + + }) + .on('focus', function() { + + var i = $(this); + + if (i.attr('name').match(/-polyfill-field$/)) + return; + + if (i.val() == i.attr('placeholder')) + i + .removeClass('polyfill-placeholder') + .val(''); + + }); + + // Password. + $this.find('input[type=password]') + .each(function() { + + var i = $(this); + var x = $( + $('
') + .append(i.clone()) + .remove() + .html() + .replace(/type="password"/i, 'type="text"') + .replace(/type=password/i, 'type=text') + ); + + if (i.attr('id') != '') + x.attr('id', i.attr('id') + '-polyfill-field'); + + if (i.attr('name') != '') + x.attr('name', i.attr('name') + '-polyfill-field'); + + x.addClass('polyfill-placeholder') + .val(x.attr('placeholder')).insertAfter(i); + + if (i.val() == '') + i.hide(); + else + x.hide(); + + i + .on('blur', function(event) { + + event.preventDefault(); + + var x = i.parent().find('input[name=' + i.attr('name') + '-polyfill-field]'); + + if (i.val() == '') { + + i.hide(); + x.show(); + + } + + }); + + x + .on('focus', function(event) { + + event.preventDefault(); + + var i = x.parent().find('input[name=' + x.attr('name').replace('-polyfill-field', '') + ']'); + + x.hide(); + + i + .show() + .focus(); + + }) + .on('keypress', function(event) { + + event.preventDefault(); + x.val(''); + + }); + + }); + + // Events. + $this + .on('submit', function() { + + $this.find('input[type=text],input[type=password],textarea') + .each(function(event) { + + var i = $(this); + + if (i.attr('name').match(/-polyfill-field$/)) + i.attr('name', ''); + + if (i.val() == i.attr('placeholder')) { + + i.removeClass('polyfill-placeholder'); + i.val(''); + + } + + }); + + }) + .on('reset', function(event) { + + event.preventDefault(); + + $this.find('select') + .val($('option:first').val()); + + $this.find('input,textarea') + .each(function() { + + var i = $(this), + x; + + i.removeClass('polyfill-placeholder'); + + switch (this.type) { + + case 'submit': + case 'reset': + break; + + case 'password': + i.val(i.attr('defaultValue')); + + x = i.parent().find('input[name=' + i.attr('name') + '-polyfill-field]'); + + if (i.val() == '') { + i.hide(); + x.show(); + } + else { + i.show(); + x.hide(); + } + + break; + + case 'checkbox': + case 'radio': + i.attr('checked', i.attr('defaultValue')); + break; + + case 'text': + case 'textarea': + i.val(i.attr('defaultValue')); + + if (i.val() == '') { + i.addClass('polyfill-placeholder'); + i.val(i.attr('placeholder')); + } + + break; + + default: + i.val(i.attr('defaultValue')); + break; + + } + }); + + }); + + return $this; + + }; + + /** + * Moves elements to/from the first positions of their respective parents. + * @param {jQuery} $elements Elements (or selector) to move. + * @param {bool} condition If true, moves elements to the top. Otherwise, moves elements back to their original locations. + */ + $.prioritize = function($elements, condition) { + + var key = '__prioritize'; + + // Expand $elements if it's not already a jQuery object. + if (typeof $elements != 'jQuery') + $elements = $($elements); + + // Step through elements. + $elements.each(function() { + + var $e = $(this), $p, + $parent = $e.parent(); + + // No parent? Bail. + if ($parent.length == 0) + return; + + // Not moved? Move it. + if (!$e.data(key)) { + + // Condition is false? Bail. + if (!condition) + return; + + // Get placeholder (which will serve as our point of reference for when this element needs to move back). + $p = $e.prev(); + + // Couldn't find anything? Means this element's already at the top, so bail. + if ($p.length == 0) + return; + + // Move element to top of parent. + $e.prependTo($parent); + + // Mark element as moved. + $e.data(key, $p); + + } + + // Moved already? + else { + + // Condition is true? Bail. + if (condition) + return; + + $p = $e.data(key); + + // Move element back to its original location (using our placeholder). + $e.insertAfter($p); + + // Unmark element as moved. + $e.removeData(key); + + } + + }); + + }; + +})(jQuery); \ No newline at end of file diff --git a/src/assets/sass/libs/_breakpoints.scss b/src/assets/sass/libs/_breakpoints.scss new file mode 100644 index 0000000..c5301d8 --- /dev/null +++ b/src/assets/sass/libs/_breakpoints.scss @@ -0,0 +1,223 @@ +// breakpoints.scss v1.0 | @ajlkn | MIT licensed */ + +// Vars. + + /// Breakpoints. + /// @var {list} + $breakpoints: () !global; + +// Mixins. + + /// Sets breakpoints. + /// @param {map} $x Breakpoints. + @mixin breakpoints($x: ()) { + $breakpoints: $x !global; + } + + /// Wraps @content in a @media block targeting a specific orientation. + /// @param {string} $orientation Orientation. + @mixin orientation($orientation) { + @media screen and (orientation: #{$orientation}) { + @content; + } + } + + /// Wraps @content in a @media block using a given query. + /// @param {string} $query Query. + @mixin breakpoint($query: null) { + + $breakpoint: null; + $op: null; + $media: null; + + // Determine operator, breakpoint. + + // Greater than or equal. + @if (str-slice($query, 0, 2) == '>=') { + + $op: 'gte'; + $breakpoint: str-slice($query, 3); + + } + + // Less than or equal. + @elseif (str-slice($query, 0, 2) == '<=') { + + $op: 'lte'; + $breakpoint: str-slice($query, 3); + + } + + // Greater than. + @elseif (str-slice($query, 0, 1) == '>') { + + $op: 'gt'; + $breakpoint: str-slice($query, 2); + + } + + // Less than. + @elseif (str-slice($query, 0, 1) == '<') { + + $op: 'lt'; + $breakpoint: str-slice($query, 2); + + } + + // Not. + @elseif (str-slice($query, 0, 1) == '!') { + + $op: 'not'; + $breakpoint: str-slice($query, 2); + + } + + // Equal. + @else { + + $op: 'eq'; + $breakpoint: $query; + + } + + // Build media. + @if ($breakpoint and map-has-key($breakpoints, $breakpoint)) { + + $a: map-get($breakpoints, $breakpoint); + + // Range. + @if (type-of($a) == 'list') { + + $x: nth($a, 1); + $y: nth($a, 2); + + // Max only. + @if ($x == null) { + + // Greater than or equal (>= 0 / anything) + @if ($op == 'gte') { + $media: 'screen'; + } + + // Less than or equal (<= y) + @elseif ($op == 'lte') { + $media: 'screen and (max-width: ' + $y + ')'; + } + + // Greater than (> y) + @elseif ($op == 'gt') { + $media: 'screen and (min-width: ' + ($y + 1) + ')'; + } + + // Less than (< 0 / invalid) + @elseif ($op == 'lt') { + $media: 'screen and (max-width: -1px)'; + } + + // Not (> y) + @elseif ($op == 'not') { + $media: 'screen and (min-width: ' + ($y + 1) + ')'; + } + + // Equal (<= y) + @else { + $media: 'screen and (max-width: ' + $y + ')'; + } + + } + + // Min only. + @else if ($y == null) { + + // Greater than or equal (>= x) + @if ($op == 'gte') { + $media: 'screen and (min-width: ' + $x + ')'; + } + + // Less than or equal (<= inf / anything) + @elseif ($op == 'lte') { + $media: 'screen'; + } + + // Greater than (> inf / invalid) + @elseif ($op == 'gt') { + $media: 'screen and (max-width: -1px)'; + } + + // Less than (< x) + @elseif ($op == 'lt') { + $media: 'screen and (max-width: ' + ($x - 1) + ')'; + } + + // Not (< x) + @elseif ($op == 'not') { + $media: 'screen and (max-width: ' + ($x - 1) + ')'; + } + + // Equal (>= x) + @else { + $media: 'screen and (min-width: ' + $x + ')'; + } + + } + + // Min and max. + @else { + + // Greater than or equal (>= x) + @if ($op == 'gte') { + $media: 'screen and (min-width: ' + $x + ')'; + } + + // Less than or equal (<= y) + @elseif ($op == 'lte') { + $media: 'screen and (max-width: ' + $y + ')'; + } + + // Greater than (> y) + @elseif ($op == 'gt') { + $media: 'screen and (min-width: ' + ($y + 1) + ')'; + } + + // Less than (< x) + @elseif ($op == 'lt') { + $media: 'screen and (max-width: ' + ($x - 1) + ')'; + } + + // Not (< x and > y) + @elseif ($op == 'not') { + $media: 'screen and (max-width: ' + ($x - 1) + '), screen and (min-width: ' + ($y + 1) + ')'; + } + + // Equal (>= x and <= y) + @else { + $media: 'screen and (min-width: ' + $x + ') and (max-width: ' + $y + ')'; + } + + } + + } + + // String. + @else { + + // Missing a media type? Prefix with "screen". + @if (str-slice($a, 0, 1) == '(') { + $media: 'screen and ' + $a; + } + + // Otherwise, use as-is. + @else { + $media: $a; + } + + } + + } + + // Output. + @media #{$media} { + @content; + } + + } \ No newline at end of file diff --git a/src/assets/sass/libs/_functions.scss b/src/assets/sass/libs/_functions.scss new file mode 100644 index 0000000..f563aab --- /dev/null +++ b/src/assets/sass/libs/_functions.scss @@ -0,0 +1,90 @@ +/// Removes a specific item from a list. +/// @author Hugo Giraudel +/// @param {list} $list List. +/// @param {integer} $index Index. +/// @return {list} Updated list. +@function remove-nth($list, $index) { + + $result: null; + + @if type-of($index) != number { + @warn "$index: #{quote($index)} is not a number for `remove-nth`."; + } + @else if $index == 0 { + @warn "List index 0 must be a non-zero integer for `remove-nth`."; + } + @else if abs($index) > length($list) { + @warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`."; + } + @else { + + $result: (); + $index: if($index < 0, length($list) + $index + 1, $index); + + @for $i from 1 through length($list) { + + @if $i != $index { + $result: append($result, nth($list, $i)); + } + + } + + } + + @return $result; + +} + +/// Gets a value from a map. +/// @author Hugo Giraudel +/// @param {map} $map Map. +/// @param {string} $keys Key(s). +/// @return {string} Value. +@function val($map, $keys...) { + + @if nth($keys, 1) == null { + $keys: remove-nth($keys, 1); + } + + @each $key in $keys { + $map: map-get($map, $key); + } + + @return $map; + +} + +/// Gets a duration value. +/// @param {string} $keys Key(s). +/// @return {string} Value. +@function _duration($keys...) { + @return val($duration, $keys...); +} + +/// Gets a font value. +/// @param {string} $keys Key(s). +/// @return {string} Value. +@function _font($keys...) { + @return val($font, $keys...); +} + +/// Gets a misc value. +/// @param {string} $keys Key(s). +/// @return {string} Value. +@function _misc($keys...) { + @return val($misc, $keys...); +} + +/// Gets a palette value. +/// @param {string} $keys Key(s). +/// @return {string} Value. +@function _palette($keys...) { + @return val($palette, $keys...); +} + +/// Gets a size value. +/// @param {string} $keys Key(s). +/// @return {string} Value. +@function _size($keys...) { + @return val($size, $keys...); +} \ No newline at end of file diff --git a/src/assets/sass/libs/_html-grid.scss b/src/assets/sass/libs/_html-grid.scss new file mode 100644 index 0000000..7438a8c --- /dev/null +++ b/src/assets/sass/libs/_html-grid.scss @@ -0,0 +1,149 @@ +// html-grid.scss v1.0 | @ajlkn | MIT licensed */ + +// Mixins. + + /// Initializes the current element as an HTML grid. + /// @param {mixed} $gutters Gutters (either a single number to set both column/row gutters, or a list to set them individually). + /// @param {mixed} $suffix Column class suffix (optional; either a single suffix or a list). + @mixin html-grid($gutters: 1.5em, $suffix: '') { + + // Initialize. + $cols: 12; + $multipliers: 0, 0.25, 0.5, 1, 1.50, 2.00; + $unit: 100% / $cols; + + // Suffixes. + $suffixes: null; + + @if (type-of($suffix) == 'list') { + $suffixes: $suffix; + } + @else { + $suffixes: ($suffix); + } + + // Gutters. + $guttersCols: null; + $guttersRows: null; + + @if (type-of($gutters) == 'list') { + + $guttersCols: nth($gutters, 1); + $guttersRows: nth($gutters, 2); + + } + @else { + + $guttersCols: $gutters; + $guttersRows: 0; + + } + + // Row. + display: flex; + flex-wrap: wrap; + box-sizing: border-box; + align-items: stretch; + + // Columns. + > * { + box-sizing: border-box; + } + + // Gutters. + &.gtr-uniform { + > * { + > :last-child { + margin-bottom: 0; + } + } + } + + // Alignment. + &.aln-left { + justify-content: flex-start; + } + + &.aln-center { + justify-content: center; + } + + &.aln-right { + justify-content: flex-end; + } + + &.aln-top { + align-items: flex-start; + } + + &.aln-middle { + align-items: center; + } + + &.aln-bottom { + align-items: flex-end; + } + + // Step through suffixes. + @each $suffix in $suffixes { + + // Suffix. + @if ($suffix != '') { + $suffix: '-' + $suffix; + } + @else { + $suffix: ''; + } + + // Row. + + // Important. + > .imp#{$suffix} { + order: -1; + } + + // Columns, offsets. + @for $i from 1 through $cols { + > .col-#{$i}#{$suffix} { + width: $unit * $i; + } + + > .off-#{$i}#{$suffix} { + margin-left: $unit * $i; + } + } + + // Step through multipliers. + @each $multiplier in $multipliers { + + // Gutters. + $class: null; + + @if ($multiplier != 1) { + $class: '.gtr-' + ($multiplier * 100); + } + + &#{$class} { + margin-top: ($guttersRows * $multiplier * -1); + margin-left: ($guttersCols * $multiplier * -1); + + > * { + padding: ($guttersRows * $multiplier) 0 0 ($guttersCols * $multiplier); + } + + // Uniform. + &.gtr-uniform { + margin-top: $guttersCols * $multiplier * -1; + + > * { + padding-top: $guttersCols * $multiplier; + } + } + + } + + } + + } + + } \ No newline at end of file diff --git a/src/assets/sass/libs/_mixins.scss b/src/assets/sass/libs/_mixins.scss new file mode 100644 index 0000000..a331483 --- /dev/null +++ b/src/assets/sass/libs/_mixins.scss @@ -0,0 +1,78 @@ +/// Makes an element's :before pseudoelement a FontAwesome icon. +/// @param {string} $content Optional content value to use. +/// @param {string} $category Optional category to use. +/// @param {string} $where Optional pseudoelement to target (before or after). +@mixin icon($content: false, $category: regular, $where: before) { + + text-decoration: none; + + &:#{$where} { + + @if $content { + content: $content; + } + + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; + display: inline-block; + font-style: normal; + font-variant: normal; + text-rendering: auto; + line-height: 1; + text-transform: none !important; + + @if ($category == brands) { + font-family: 'Font Awesome 5 Brands'; + } + @elseif ($category == solid) { + font-family: 'Font Awesome 5 Free'; + font-weight: 900; + } + @else { + font-family: 'Font Awesome 5 Free'; + font-weight: 400; + } + + } + +} + +/// Applies padding to an element, taking the current element-margin value into account. +/// @param {mixed} $tb Top/bottom padding. +/// @param {mixed} $lr Left/right padding. +/// @param {list} $pad Optional extra padding (in the following order top, right, bottom, left) +/// @param {bool} $important If true, adds !important. +@mixin padding($tb, $lr, $pad: (0,0,0,0), $important: null) { + + @if $important { + $important: '!important'; + } + + $x: 0.1em; + + @if unit(_size(element-margin)) == 'rem' { + $x: 0.1rem; + } + + padding: ($tb + nth($pad,1)) ($lr + nth($pad,2)) max($x, $tb - _size(element-margin) + nth($pad,3)) ($lr + nth($pad,4)) #{$important}; + +} + +/// Encodes a SVG data URL so IE doesn't choke (via codepen.io/jakob-e/pen/YXXBrp). +/// @param {string} $svg SVG data URL. +/// @return {string} Encoded SVG data URL. +@function svg-url($svg) { + + $svg: str-replace($svg, '"', '\''); + $svg: str-replace($svg, '%', '%25'); + $svg: str-replace($svg, '<', '%3C'); + $svg: str-replace($svg, '>', '%3E'); + $svg: str-replace($svg, '&', '%26'); + $svg: str-replace($svg, '#', '%23'); + $svg: str-replace($svg, '{', '%7B'); + $svg: str-replace($svg, '}', '%7D'); + $svg: str-replace($svg, ';', '%3B'); + + @return url("data:image/svg+xml;charset=utf8,#{$svg}"); + +} \ No newline at end of file diff --git a/src/assets/sass/libs/_vars.scss b/src/assets/sass/libs/_vars.scss new file mode 100644 index 0000000..83b0e14 --- /dev/null +++ b/src/assets/sass/libs/_vars.scss @@ -0,0 +1,119 @@ +// Misc. + $misc: ( + max-spotlights: 10, + max-features: 10, + z-index-base: 10000 + ); + +// Duration. + $duration: ( + transitions: 0.2s, + menu: 0.5s, + fadein: 3s + ); + +// Size. + $size: ( + element-height: 2.75em, + element-margin: 2em, + letter-spacing: 0.075em, + letter-spacing-alt: 0.225em + ); + +// Font. + $font: ( + family: ('Open Sans', Helvetica, sans-serif), + family-fixed: ('Courier New', monospace), + weight: 400, + weight-bold: 600, + weight-extrabold: 800 + ); + +// Palette. + $palette: ( + bg: #2e3842, + fg: #fff, + fg-bold: #fff, + fg-light: rgba(255,255,255,0.5), + border: #fff, + border-bg: rgba(144,144,144,0.25), + border2: #fff, + border2-bg: rgba(144,144,144,0.5), + + accent1: ( + bg: #21b2a6, + fg-bold: #ffffff, + fg: mix(#21b2a6, #ffffff, 25%), + fg-light: mix(#21b2a6, #ffffff, 40%), + border: rgba(0,0,0,0.125), + border-bg: rgba(255,255,255,0.075), + border2: rgba(0,0,0,0.25), + border2-bg: rgba(255,255,255,0.2) + ), + + accent2: ( + bg: #00ffcc, + fg-bold: #ffffff, + fg: mix(#00ffcc, #ffffff, 25%), + fg-light: mix(#00ffcc, #ffffff, 40%), + border: rgba(0,0,0,0.125), + border-bg: rgba(255,255,255,0.075), + border2: rgba(0,0,0,0.25), + border2-bg: rgba(255,255,255,0.2) + ), + + accent3: ( + bg: #00f0ff, + fg-bold: #ffffff, + fg: mix(#00f0ff, #ffffff, 25%), + fg-light: mix(#00f0ff, #ffffff, 40%), + border: rgba(0,0,0,0.125), + border-bg: rgba(255,255,255,0.075), + border2: rgba(0,0,0,0.25), + border2-bg: rgba(255,255,255,0.2) + ), + + accent4: ( + bg: #76ddff, + fg-bold: #ffffff, + fg: mix(#76ddff, #ffffff, 25%), + fg-light: mix(#76ddff, #ffffff, 40%), + border: rgba(0,0,0,0.125), + border-bg: rgba(255,255,255,0.075), + border2: rgba(0,0,0,0.25), + border2-bg: rgba(255,255,255,0.2) + ), + + accent5: ( + bg: #505393, + fg-bold: #ffffff, + fg: mix(#505393, #ffffff, 25%), + fg-light: mix(#505393, #ffffff, 40%), + border: rgba(0,0,0,0.125), + border-bg: rgba(255,255,255,0.075), + border2: rgba(0,0,0,0.25), + border2-bg: rgba(255,255,255,0.2) + ), + + accent6: ( + bg: #ed4933, + fg-bold: #ffffff, + fg: mix(#ed4933, #ffffff, 25%), + fg-light: mix(#ed4933, #ffffff, 40%), + border: rgba(0,0,0,0.125), + border-bg: rgba(255,255,255,0.075), + border2: rgba(0,0,0,0.25), + border2-bg: rgba(255,255,255,0.2) + ), + + accent7: ( + bg: #ffffff, + fg-bold: #2E3842, + fg: #4E4852, + fg-light: #8E8892, + border: #dfdfdf, + border-bg: rgba(0,0,0,0.0375), + border2: #bfbfbf, + border2-bg: rgba(0,0,0,0.1) + ) + ); \ No newline at end of file diff --git a/src/assets/sass/libs/_vendor.scss b/src/assets/sass/libs/_vendor.scss new file mode 100644 index 0000000..6599a3f --- /dev/null +++ b/src/assets/sass/libs/_vendor.scss @@ -0,0 +1,376 @@ +// vendor.scss v1.0 | @ajlkn | MIT licensed */ + +// Vars. + + /// Vendor prefixes. + /// @var {list} + $vendor-prefixes: ( + '-moz-', + '-webkit-', + '-ms-', + '' + ); + + /// Properties that should be vendorized. + /// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org + /// @var {list} + $vendor-properties: ( + + // Animation. + 'animation', + 'animation-delay', + 'animation-direction', + 'animation-duration', + 'animation-fill-mode', + 'animation-iteration-count', + 'animation-name', + 'animation-play-state', + 'animation-timing-function', + + // Appearance. + 'appearance', + + // Backdrop filter. + 'backdrop-filter', + + // Background image options. + 'background-clip', + 'background-origin', + 'background-size', + + // Box sizing. + 'box-sizing', + + // Clip path. + 'clip-path', + + // Filter effects. + 'filter', + + // Flexbox. + 'align-content', + 'align-items', + 'align-self', + 'flex', + 'flex-basis', + 'flex-direction', + 'flex-flow', + 'flex-grow', + 'flex-shrink', + 'flex-wrap', + 'justify-content', + 'order', + + // Font feature. + 'font-feature-settings', + 'font-language-override', + 'font-variant-ligatures', + + // Font kerning. + 'font-kerning', + + // Fragmented borders and backgrounds. + 'box-decoration-break', + + // Grid layout. + 'grid-column', + 'grid-column-align', + 'grid-column-end', + 'grid-column-start', + 'grid-row', + 'grid-row-align', + 'grid-row-end', + 'grid-row-start', + 'grid-template-columns', + 'grid-template-rows', + + // Hyphens. + 'hyphens', + 'word-break', + + // Masks. + 'mask', + 'mask-border', + 'mask-border-outset', + 'mask-border-repeat', + 'mask-border-slice', + 'mask-border-source', + 'mask-border-width', + 'mask-clip', + 'mask-composite', + 'mask-image', + 'mask-origin', + 'mask-position', + 'mask-repeat', + 'mask-size', + + // Multicolumn. + 'break-after', + 'break-before', + 'break-inside', + 'column-count', + 'column-fill', + 'column-gap', + 'column-rule', + 'column-rule-color', + 'column-rule-style', + 'column-rule-width', + 'column-span', + 'column-width', + 'columns', + + // Object fit. + 'object-fit', + 'object-position', + + // Regions. + 'flow-from', + 'flow-into', + 'region-fragment', + + // Scroll snap points. + 'scroll-snap-coordinate', + 'scroll-snap-destination', + 'scroll-snap-points-x', + 'scroll-snap-points-y', + 'scroll-snap-type', + + // Shapes. + 'shape-image-threshold', + 'shape-margin', + 'shape-outside', + + // Tab size. + 'tab-size', + + // Text align last. + 'text-align-last', + + // Text decoration. + 'text-decoration-color', + 'text-decoration-line', + 'text-decoration-skip', + 'text-decoration-style', + + // Text emphasis. + 'text-emphasis', + 'text-emphasis-color', + 'text-emphasis-position', + 'text-emphasis-style', + + // Text size adjust. + 'text-size-adjust', + + // Text spacing. + 'text-spacing', + + // Transform. + 'transform', + 'transform-origin', + + // Transform 3D. + 'backface-visibility', + 'perspective', + 'perspective-origin', + 'transform-style', + + // Transition. + 'transition', + 'transition-delay', + 'transition-duration', + 'transition-property', + 'transition-timing-function', + + // Unicode bidi. + 'unicode-bidi', + + // User select. + 'user-select', + + // Writing mode. + 'writing-mode', + + ); + + /// Values that should be vendorized. + /// Data via caniuse.com, github.com/postcss/autoprefixer, and developer.mozilla.org + /// @var {list} + $vendor-values: ( + + // Cross fade. + 'cross-fade', + + // Element function. + 'element', + + // Filter function. + 'filter', + + // Flexbox. + 'flex', + 'inline-flex', + + // Grab cursors. + 'grab', + 'grabbing', + + // Gradients. + 'linear-gradient', + 'repeating-linear-gradient', + 'radial-gradient', + 'repeating-radial-gradient', + + // Grid layout. + 'grid', + 'inline-grid', + + // Image set. + 'image-set', + + // Intrinsic width. + 'max-content', + 'min-content', + 'fit-content', + 'fill', + 'fill-available', + 'stretch', + + // Sticky position. + 'sticky', + + // Transform. + 'transform', + + // Zoom cursors. + 'zoom-in', + 'zoom-out', + + ); + +// Functions. + + /// Removes a specific item from a list. + /// @author Hugo Giraudel + /// @param {list} $list List. + /// @param {integer} $index Index. + /// @return {list} Updated list. + @function remove-nth($list, $index) { + + $result: null; + + @if type-of($index) != number { + @warn "$index: #{quote($index)} is not a number for `remove-nth`."; + } + @else if $index == 0 { + @warn "List index 0 must be a non-zero integer for `remove-nth`."; + } + @else if abs($index) > length($list) { + @warn "List index is #{$index} but list is only #{length($list)} item long for `remove-nth`."; + } + @else { + + $result: (); + $index: if($index < 0, length($list) + $index + 1, $index); + + @for $i from 1 through length($list) { + + @if $i != $index { + $result: append($result, nth($list, $i)); + } + + } + + } + + @return $result; + + } + + /// Replaces a substring within another string. + /// @author Hugo Giraudel + /// @param {string} $string String. + /// @param {string} $search Substring. + /// @param {string} $replace Replacement. + /// @return {string} Updated string. + @function str-replace($string, $search, $replace: '') { + + $index: str-index($string, $search); + + @if $index { + @return str-slice($string, 1, $index - 1) + $replace + str-replace(str-slice($string, $index + str-length($search)), $search, $replace); + } + + @return $string; + + } + + /// Replaces a substring within each string in a list. + /// @param {list} $strings List of strings. + /// @param {string} $search Substring. + /// @param {string} $replace Replacement. + /// @return {list} Updated list of strings. + @function str-replace-all($strings, $search, $replace: '') { + + @each $string in $strings { + $strings: set-nth($strings, index($strings, $string), str-replace($string, $search, $replace)); + } + + @return $strings; + + } + +// Mixins. + + /// Wraps @content in vendorized keyframe blocks. + /// @param {string} $name Name. + @mixin keyframes($name) { + + @-moz-keyframes #{$name} { @content; } + @-webkit-keyframes #{$name} { @content; } + @-ms-keyframes #{$name} { @content; } + @keyframes #{$name} { @content; } + + } + + /// Vendorizes a declaration's property and/or value(s). + /// @param {string} $property Property. + /// @param {mixed} $value String/list of value(s). + @mixin vendor($property, $value) { + + // Determine if property should expand. + $expandProperty: index($vendor-properties, $property); + + // Determine if value should expand (and if so, add '-prefix-' placeholder). + $expandValue: false; + + @each $x in $value { + @each $y in $vendor-values { + @if $y == str-slice($x, 1, str-length($y)) { + + $value: set-nth($value, index($value, $x), '-prefix-' + $x); + $expandValue: true; + + } + } + } + + // Expand property? + @if $expandProperty { + @each $vendor in $vendor-prefixes { + #{$vendor}#{$property}: #{str-replace-all($value, '-prefix-', $vendor)}; + } + } + + // Expand just the value? + @elseif $expandValue { + @each $vendor in $vendor-prefixes { + #{$property}: #{str-replace-all($value, '-prefix-', $vendor)}; + } + } + + // Neither? Treat them as a normal declaration. + @else { + #{$property}: #{$value}; + } + + } \ No newline at end of file diff --git a/src/assets/sass/main.scss b/src/assets/sass/main.scss new file mode 100644 index 0000000..37b1103 --- /dev/null +++ b/src/assets/sass/main.scss @@ -0,0 +1,1933 @@ +@import 'libs/vars'; +@import 'libs/functions'; +@import 'libs/mixins'; +@import 'libs/vendor'; +@import 'libs/breakpoints'; +@import 'libs/html-grid'; +@import 'fontawesome-all.min.css'; +@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,800,800italic'); + +/* + Spectral by HTML5 UP + html5up.net | @ajlkn + Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +*/ + +// Breakpoints. + + @include breakpoints(( + xlarge: ( 1281px, 1680px ), + large: ( 981px, 1280px ), + medium: ( 737px, 980px ), + small: ( 481px, 736px ), + xsmall: ( null, 480px ), + )); + +// Reset. +// Based on meyerweb.com/eric/tools/css/reset (v2.0 | 20110126 | License: public domain) + + html, body, div, span, applet, object, + iframe, h1, h2, h3, h4, h5, h6, p, blockquote, + pre, a, abbr, acronym, address, big, cite, + code, del, dfn, em, img, ins, kbd, q, s, samp, + small, strike, strong, sub, sup, tt, var, b, + u, i, center, dl, dt, dd, ol, ul, li, fieldset, + form, label, legend, table, caption, tbody, + tfoot, thead, tr, th, td, article, aside, + canvas, details, embed, figure, figcaption, + footer, header, hgroup, menu, nav, output, ruby, + section, summary, time, mark, audio, video { + margin: 0; + padding: 0; + border: 0; + font-size: 100%; + font: inherit; + vertical-align: baseline; + } + + article, aside, details, figcaption, figure, + footer, header, hgroup, menu, nav, section { + display: block; + } + + body { + line-height: 1; + } + + ol, ul { + list-style:none; + } + + blockquote, q { + quotes: none; + + &:before, + &:after { + content: ''; + content: none; + } + } + + table { + border-collapse: collapse; + border-spacing: 0; + } + + body { + -webkit-text-size-adjust: none; + } + + mark { + background-color: transparent; + color: inherit; + } + + input::-moz-focus-inner { + border: 0; + padding: 0; + } + + input, select, textarea { + -moz-appearance: none; + -webkit-appearance: none; + -ms-appearance: none; + appearance: none; + } + +/* Basic */ + + @-ms-viewport { + width: device-width; + } + + // Set box model to border-box. + // Based on css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice + html { + box-sizing: border-box; + } + + *, *:before, *:after { + box-sizing: inherit; + } + + body { + background: _palette(bg); + + // Stops initial animations until page loads. + &.is-preload { + *, *:before, *:after { + @include vendor('animation', 'none !important'); + @include vendor('transition', 'none !important'); + } + } + + } + + body, input, select, textarea { + color: _palette(fg); + font-family: _font(family); + font-size: 15pt; + font-weight: _font(weight); + letter-spacing: _size(letter-spacing); + line-height: 1.65em; + + @include breakpoint('<=xlarge') { + font-size: 13pt; + } + + @include breakpoint('<=large') { + font-size: 12pt; + } + + @include breakpoint('<=small') { + font-size: 11pt; + letter-spacing: _size(letter-spacing) * 0.5; + } + } + + a { + @include vendor('transition', ('color #{_duration(transitions)} ease', 'border-bottom-color #{_duration(transitions)} ease')); + border-bottom: dotted 1px; + color: inherit; + text-decoration: none; + + &:hover { + border-bottom-color: transparent; + } + } + + strong, b { + color: _palette(fg-bold); + font-weight: _font(weight-bold); + } + + em, i { + font-style: italic; + } + + p { + margin: 0 0 _size(element-margin) 0; + } + + h1, h2, h3, h4, h5, h6 { + color: _palette(fg-bold); + font-weight: _font(weight-extrabold); + letter-spacing: _size(letter-spacing-alt); + line-height: 1em; + margin: 0 0 (_size(element-margin) * 0.5) 0; + text-transform: uppercase; + + a { + color: inherit; + text-decoration: none; + } + } + + h2 { + font-size: 1.35em; + line-height: 1.75em; + + @include breakpoint('<=small') { + font-size: 1.1em; + line-height: 1.65em; + } + } + + h3 { + font-size: 1.15em; + line-height: 1.75em; + + @include breakpoint('<=small') { + font-size: 1em; + line-height: 1.65em; + } + } + + h4 { + font-size: 1em; + line-height: 1.5em; + } + + h5 { + font-size: 0.8em; + line-height: 1.5em; + } + + h6 { + font-size: 0.7em; + line-height: 1.5em; + } + + sub { + font-size: 0.8em; + position: relative; + top: 0.5em; + } + + sup { + font-size: 0.8em; + position: relative; + top: -0.5em; + } + + hr { + border: 0; + border-bottom: solid 2px _palette(border); + margin: (_size(element-margin) * 1.5) 0; + + &.major { + margin: (_size(element-margin) * 2.25) 0; + } + } + + blockquote { + border-left: solid 4px _palette(border); + font-style: italic; + margin: 0 0 _size(element-margin) 0; + padding: 0.5em 0 0.5em 2em; + } + + code { + background: _palette(border-bg); + border-radius: 3px; + font-family: _font(family-fixed); + font-size: 0.9em; + letter-spacing: 0; + margin: 0 0.25em; + padding: 0.25em 0.65em; + } + + pre { + -webkit-overflow-scrolling: touch; + font-family: _font(family-fixed); + font-size: 0.9em; + margin: 0 0 _size(element-margin) 0; + + code { + display: block; + line-height: 1.75em; + padding: 1em 1.5em; + overflow-x: auto; + } + } + + .align-left { + text-align: left; + } + + .align-center { + text-align: center; + } + + .align-right { + text-align: right; + } + +/* Row */ + + .row { + @include html-grid(1.5em); + + @include breakpoint('<=xlarge') { + @include html-grid(1.5em, 'xlarge'); + } + + @include breakpoint('<=large') { + @include html-grid(1.5em, 'large'); + } + + @include breakpoint('<=medium') { + @include html-grid(1.5em, 'medium'); + } + + @include breakpoint('<=small') { + @include html-grid(1.5em, 'small'); + } + + @include breakpoint('<=xsmall') { + @include html-grid(1.5em, 'xsmall'); + } + } + +/* Section/Article */ + + section, article { + &.special { + text-align: center; + } + } + + header { + p { + color: _palette(fg-light); + position: relative; + top: -0.25em; + } + + h2 + p { + } + + h3 + p { + font-size: 1.1em; + } + + h4 + p, + h5 + p, + h6 + p { + font-size: 0.9em; + } + + &.major { + margin: 0 0 (_size(element-margin) * 1.75) 0; + + h2, h3, h4, h5, h6 { + border-bottom: solid 2px _palette(border); + display: inline-block; + padding-bottom: 1em; + position: relative; + + &:after { + content: ''; + display: block; + height: 1px; + } + } + + p { + color: _palette(fg); + top: 0; + } + + @include breakpoint('<=small') { + margin: 0 0 _size(element-margin) 0; + } + } + + @include breakpoint('<=medium') { + br { + display: none; + } + } + } + +/* Form */ + + form { + margin: 0 0 _size(element-margin) 0; + } + + label { + color: _palette(fg-bold); + display: block; + font-size: 0.9em; + font-weight: _font(weight-bold); + margin: 0 0 (_size(element-margin) * 0.5) 0; + } + + input[type="text"], + input[type="password"], + input[type="email"], + select, + textarea { + @include vendor('appearance', 'none'); + background-color: _palette(border-bg); + border-radius: 3px; + border: none; + color: inherit; + display: block; + outline: 0; + padding: 0 1em; + text-decoration: none; + width: 100%; + + &:invalid { + box-shadow: none; + } + + &:focus { + box-shadow: 0 0 0 2px _palette(accent1, bg); + } + } + + select { + background-size: 1.25em; + background-repeat: no-repeat; + background-position: calc(100% - 1em) center; + height: _size(element-height); + padding-right: _size(element-height); + text-overflow: ellipsis; + + &:focus { + &::-ms-value { + background-color: transparent; + } + } + + &::-ms-expand { + display: none; + } + } + + input[type="text"], + input[type="password"], + input[type="email"], + select { + height: _size(element-height); + } + + textarea { + padding: 0.75em 1em; + } + + input[type="checkbox"], + input[type="radio"], { + @include vendor('appearance', 'none'); + display: block; + float: left; + margin-right: -2em; + opacity: 0; + width: 1em; + z-index: -1; + + & + label { + @include icon(false, solid); + color: _palette(fg); + cursor: pointer; + display: inline-block; + font-size: 1em; + font-weight: _font(weight); + padding-left: (_size(element-height) * 0.6) + 0.75em; + padding-right: 0.75em; + position: relative; + + &:before { + background: _palette(border-bg); + border-radius: 3px; + content: ''; + display: inline-block; + font-size: 0.8em; + height: (_size(element-height) * 0.75); + left: 0; + line-height: (_size(element-height) * 0.75); + position: absolute; + text-align: center; + top: 0; + width: (_size(element-height) * 0.75); + } + } + + &:checked + label { + &:before { + background: _palette(bg); + color: _palette(fg-bold); + content: '\f00c'; + } + } + + &:focus + label { + &:before { + box-shadow: 0 0 0 2px _palette(accent1, bg); + } + } + } + + input[type="checkbox"] { + & + label { + &:before { + border-radius: 3px; + } + } + } + + input[type="radio"] { + & + label { + &:before { + border-radius: 100%; + } + } + } + + ::-webkit-input-placeholder { + color: _palette(fg-light) !important; + opacity: 1.0; + } + + :-moz-placeholder { + color: _palette(fg-light) !important; + opacity: 1.0; + } + + ::-moz-placeholder { + color: _palette(fg-light) !important; + opacity: 1.0; + } + + :-ms-input-placeholder { + color: _palette(fg-light) !important; + opacity: 1.0; + } + +/* Box */ + + .box { + border-radius: 3px; + border: solid 2px _palette(border); + margin-bottom: _size(element-margin); + padding: 1.5em; + + > :last-child, + > :last-child > :last-child, + > :last-child > :last-child > :last-child { + margin-bottom: 0; + } + + &.alt { + border: 0; + border-radius: 0; + padding: 0; + } + } + +/* Icon */ + + .icon { + @include icon; + border-bottom: none; + position: relative; + + > .label { + display: none; + } + + &:before{ + line-height: inherit; + } + + &.solid { + &:before { + font-weight: 900; + } + } + + &.brands { + &:before { + font-family: 'Font Awesome 5 Brands'; + } + } + + &.major { + @include vendor('transform', 'rotate(-45deg)'); + border-radius: 3px; + border: solid 2px _palette(border); + display: inline-block; + font-size: 1.35em; + height: calc(3em + 2px); + line-height: 3em; + text-align: center; + width: calc(3em + 2px); + + &:before { + @include vendor('transform', 'rotate(45deg)'); + display: inline-block; + font-size: 1.5em; + } + + @include breakpoint('<=small') { + font-size: 1em; + } + } + + &.style1 { + color: _palette(accent2, bg); + } + + &.style2 { + color: _palette(accent3, bg); + } + + &.style3 { + color: _palette(accent4, bg); + } + } + +/* Image */ + + .image { + border-radius: 3px; + border: 0; + display: inline-block; + position: relative; + + img { + border-radius: 3px; + display: block; + } + + &.left { + float: left; + margin: 0 2em 2em 0; + top: 0.25em; + } + + &.right { + float: right; + margin: 0 0 2em 2em; + top: 0.25em; + } + + &.left, + &.right { + max-width: 40%; + + img { + width: 100%; + } + } + + &.fit { + display: block; + margin: 0 0 _size(element-margin) 0; + width: 100%; + + img { + width: 100%; + } + } + } + +/* List */ + + ol { + list-style: decimal; + margin: 0 0 _size(element-margin) 0; + padding-left: 1.25em; + + li { + padding-left: 0.25em; + } + } + + ul { + list-style: disc; + margin: 0 0 _size(element-margin) 0; + padding-left: 1em; + + li { + padding-left: 0.5em; + } + + &.alt { + list-style: none; + padding-left: 0; + + li { + border-top: solid 1px _palette(border); + padding: 0.5em 0; + + &:first-child { + border-top: 0; + padding-top: 0; + } + } + } + } + + dl { + margin: 0 0 _size(element-margin) 0; + } + +/* Actions */ + + ul.actions { + @include vendor('display', 'flex'); + cursor: default; + list-style: none; + margin-left: (_size(element-margin) * -0.5); + padding-left: 0; + + li { + padding: 0 0 0 (_size(element-margin) * 0.5); + vertical-align: middle; + } + + &.special { + @include vendor('justify-content', 'center'); + width: 100%; + margin-left: 0; + + li { + &:first-child { + padding-left: 0; + } + } + } + + &.stacked { + @include vendor('flex-direction', 'column'); + margin-left: 0; + + li { + padding: (_size(element-margin) * 0.5) 0 0 0; + + &:first-child { + padding-top: 0; + } + } + } + + &.fit { + width: calc(100% + #{_size(element-margin) * 0.5}); + + li { + @include vendor('flex-grow', '1'); + @include vendor('flex-shrink', '1'); + width: 100%; + + > * { + width: 100%; + } + } + + &.stacked { + width: 100%; + } + } + + @include breakpoint('<=xsmall') { + &:not(.fixed) { + @include vendor('flex-direction', 'column'); + margin-left: 0; + width: 100% !important; + + li { + @include vendor('flex-grow', '1'); + @include vendor('flex-shrink', '1'); + padding: (_size(element-margin) * 0.5) 0 0 0; + text-align: center; + width: 100%; + + > * { + width: 100%; + } + + &:first-child { + padding-top: 0; + } + + input[type="submit"], + input[type="reset"], + input[type="button"], + button, + .button { + width: 100%; + + &.icon { + &:before { + margin-left: -0.5em; + } + } + } + } + } + } + } + +/* Icons */ + + ul.icons { + cursor: default; + list-style: none; + padding-left: 0; + + li { + display: inline-block; + padding: 0 1em 0 0; + + &:last-child { + padding-right: 0 !important; + } + } + + &.major { + padding: 1em 0; + + li { + padding-right: 3.5em; + + @include breakpoint('<=small') { + padding: 0 1em !important; + } + } + } + } + +/* Table */ + + .table-wrapper { + -webkit-overflow-scrolling: touch; + overflow-x: auto; + } + + table { + margin: 0 0 _size(element-margin) 0; + width: 100%; + + tbody { + tr { + border: solid 1px _palette(border); + border-left: 0; + border-right: 0; + + &:nth-child(2n + 1) { + background-color: _palette(border-bg); + } + } + } + + td { + padding: 0.75em 0.75em; + } + + th { + color: _palette(fg-bold); + font-size: 0.9em; + font-weight: _font(weight-bold); + padding: 0 0.75em 0.75em 0.75em; + text-align: left; + } + + thead { + border-bottom: solid 2px _palette(border); + } + + tfoot { + border-top: solid 2px _palette(border); + } + + &.alt { + border-collapse: separate; + + tbody { + tr { + td { + border: solid 1px _palette(border); + border-left-width: 0; + border-top-width: 0; + + &:first-child { + border-left-width: 1px; + } + } + + &:first-child { + td { + border-top-width: 1px; + } + } + } + } + + thead { + border-bottom: 0; + } + + tfoot { + border-top: 0; + } + } + } + +/* Button */ + + input[type="submit"], + input[type="reset"], + input[type="button"], + button, + .button { + @include vendor('appearance', 'none'); + @include vendor('transition', ('background-color #{_duration(transitions)} ease-in-out', 'color #{_duration(transitions)} ease-in-out')); + background-color: transparent; + border-radius: 3px; + border: 0; + box-shadow: inset 0 0 0 2px _palette(border); + color: _palette(fg-bold); + cursor: pointer; + display: inline-block; + font-size: 0.8em; + font-weight: _font(weight-bold); + height: 3.125em; + letter-spacing: _size(letter-spacing-alt); + line-height: 3.125em; + max-width: 30em; + padding: 0 2.75em; + text-align: center; + text-decoration: none; + text-transform: uppercase; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + + &:hover { + background-color: _palette(border-bg); + } + + &:active { + background-color: _palette(border2-bg); + } + + &.icon { + &:before { + margin-right: 0.5em; + } + } + + &.fit { + width: 100%; + } + + &.small { + font-size: 0.8em; + } + + &.large { + font-size: 1.35em; + } + + &.primary { + background-color: _palette(accent6, bg); + box-shadow: none !important; + color: _palette(accent6, fg-bold) !important; + + &:hover { + background-color: lighten(_palette(accent6, bg), 5) !important; + } + + &:active { + background-color: darken(_palette(accent6, bg), 5) !important; + } + } + + &.disabled, + &:disabled { + @include vendor('pointer-events', 'none'); + opacity: 0.25; + } + + @include breakpoint('<=small') { + height: 3.75em; + line-height: 3.75em; + } + } + +/* Features */ + + .features { + @include vendor('display', 'flex'); + @include vendor('flex-wrap', 'wrap'); + @include vendor('justify-content', 'center'); + list-style: none; + padding: 0; + width: 100%; + + li { + @include padding(4em, 4em, (0,0,0,2em)); + display: block; + position: relative; + text-align: left; + width: 50%; + + @for $i from 1 through _misc(max-features) { + $j: 0.035 * $i; + + &:nth-child(#{$i}) { + background-color: rgba(0,0,0, $j); + } + } + + &:before { + display: block; + color: _palette(accent2, bg); + position: absolute; + left: 1.75em; + top: 2.75em; + font-size: 1.5em; + } + + &:nth-child(1) { + border-top-left-radius: 3px; + } + + &:nth-child(2) { + border-top-right-radius: 3px; + } + + &:nth-last-child(1) { + border-bottom-right-radius: 3px; + } + + &:nth-last-child(2) { + border-bottom-left-radius: 3px; + } + + @include breakpoint('<=medium') { + @include padding(3em, 2em); + text-align: center; + + &:before { + left: 0; + margin: 0 0 (_size(element-margin) * 0.5) 0; + position: relative; + top: 0; + } + } + + @include breakpoint('<=small') { + @include padding(3em, 0); + background-color: transparent !important; + border-top: solid 2px _palette(border); + width: 100%; + + &:first-child { + border-top: 0; + } + } + } + } + +/* Spotlight */ + + .spotlight { + @include vendor('align-items', 'center'); + @include vendor('display', 'flex'); + + .image { + @include vendor('order', '1'); + border-radius: 0; + width: 40%; + + img { + border-radius: 0; + width: 100%; + } + } + + .content { + @include padding(2em, 4em); + @include vendor('order', '2'); + max-width: 48em; + width: 60%; + } + + &:nth-child(2n) { + @include vendor('flex-direction', 'row-reverse'); + } + + @for $i from 1 through _misc(max-spotlights) { + $j: 0.075 * $i; + + &:nth-child(#{$i}) { + background-color: rgba(0,0,0, $j); + } + } + + @include breakpoint('<=large') { + .image { + width: 45%; + } + + .content { + width: 55%; + } + } + + @include breakpoint('<=medium') { + display: block; + + br { + display: none; + } + + .image { + width: 100%; + } + + .content { + @include padding(4em, 3em); + max-width: none; + text-align: center; + width: 100%; + } + } + + @include breakpoint('<=small') { + .content { + @include padding(3em, 2em); + } + } + } + +/* Wrapper */ + + @mixin wrapper($p) { + background-color: _palette($p, bg); + color: _palette($p, fg); + + // Basic + + strong, b { + color: _palette($p, fg-bold); + } + + h2, h3, h4, h5, h6 { + color: _palette($p, fg-bold); + } + + hr { + border-color: _palette($p, border); + } + + blockquote { + border-color: _palette($p, border); + } + + code { + background: _palette($p, border-bg); + } + + // Section/Article + + header { + p { + color: _palette($p, fg-light); + } + + &.major { + h2, h3, h4, h5, h6 { + border-color: _palette($p, border); + } + + p { + color: _palette($p, fg); + } + } + } + + // Form + + label { + color: _palette($p, fg-bold); + } + + input[type="text"], + input[type="password"], + input[type="email"], + select, + textarea { + background-color: _palette($p, border-bg); + } + + select { + background-image: svg-url(""); + + option { + color: _palette($p, fg-bold); + background: _palette($p, bg); + } + } + + input[type="checkbox"], + input[type="radio"], { + & + label { + color: _palette($p, fg); + + &:before { + background: _palette($p, border-bg); + } + } + + &:checked + label { + &:before { + background: _palette($p, fg-bold); + color: _palette($p, bg); + } + } + } + + ::-webkit-input-placeholder { + color: _palette($p, fg-light) !important; + } + + :-moz-placeholder { + color: _palette($p, fg-light) !important; + } + + ::-moz-placeholder { + color: _palette($p, fg-light) !important; + } + + :-ms-input-placeholder { + color: _palette($p, fg-light) !important; + } + + .formerize-placeholder { + color: _palette($p, fg-light) !important; + } + + // Icon + + .icon { + &.major { + border-color: _palette($p, border); + } + } + + // List + + ul { + &.alt { + li { + border-color: _palette($p, border); + } + } + } + + // Table + + table { + tbody { + tr { + border-color: _palette($p, border); + + &:nth-child(2n + 1) { + background-color: _palette($p, border-bg); + } + } + } + + th { + color: _palette($p, fg-bold); + } + + thead { + border-color: _palette($p, border); + } + + tfoot { + border-color: _palette($p, border); + } + + &.alt { + tbody { + tr { + td { + border-color: _palette($p, border); + } + } + } + } + } + + // Button + + input[type="submit"], + input[type="reset"], + input[type="button"], + button, + .button { + box-shadow: inset 0 0 0 2px _palette($p, border); + color: _palette($p, fg-bold); + + &:hover { + background-color: _palette($p, border-bg); + } + + &:active { + background-color: _palette($p, border2-bg); + } + } + + // Features + + .features { + li { + @include breakpoint('<=small') { + border-top-color: _palette($p, border); + } + } + } + + } + + .wrapper { + @include padding(6em, 0); + + > .inner { + width: 60em; + margin: 0 auto; + + @include breakpoint('<=large') { + width: 90%; + } + + @include breakpoint('<=medium') { + width: 100%; + } + } + + &.alt { + padding: 0; + } + + &.style1 { + @include wrapper(accent1); + } + + &.style2 { + background-color: _palette(bg); + } + + &.style3 { + @include wrapper(accent5); + } + + &.style4 { + background-color: transparent; + } + + &.style5 { + @include wrapper(accent7); + } + + @include breakpoint('<=medium') { + @include padding(4em, 3em); + } + + @include breakpoint('<=small') { + @include padding(3em, 2em); + } + } + +/* Page Wrapper + Menu */ + + #page-wrapper { + @include vendor('transition', 'opacity #{_duration(menu)} ease'); + opacity: 1; + padding-top: 3em; + + &:before { + background: rgba(0,0,0,0); + content: ''; + display: block; + display: none; + height: 100%; + left: 0; + position: fixed; + top: 0; + width: 100%; + z-index: _misc(z-index-base) + 1; + } + } + + #menu { + @include vendor('transform', 'translateX(20em)'); + @include vendor('transition', 'transform #{_duration(menu)} ease'); + -webkit-overflow-scrolling: touch; + background: _palette(accent1, bg); + color: _palette(accent1, fg-bold); + height: 100%; + max-width: 80%; + overflow-y: auto; + padding: 3em 2em; + position: fixed; + right: 0; + top: 0; + width: 20em; + z-index: _misc(z-index-base) + 2; + + ul { + list-style: none; + padding: 0; + + > li { + border-top: solid 1px _palette(accent1, border); + margin: 0.5em 0 0 0; + padding: 0.5em 0 0 0; + + &:first-child { + border-top: 0 !important; + margin-top: 0 !important; + padding-top: 0 !important; + } + + > a { + border: 0; + color: inherit; + display: block; + font-size: 0.8em; + letter-spacing: _size(letter-spacing-alt); + outline: 0; + text-decoration: none; + text-transform: uppercase; + + @include breakpoint('<=small') { + line-height: 3em; + } + } + } + } + + .close { + background-image: url('images/close.svg'); + background-position: 4.85em 1em; + background-repeat: no-repeat; + border: 0; + cursor: pointer; + display: block; + height: 3em; + position: absolute; + right: 0; + top: 0; + vertical-align: middle; + width: 7em; + } + + @include breakpoint('<=small') { + padding: 3em 1.5em; + } + } + + body.is-menu-visible { + #page-wrapper { + opacity: 0.35; + + &:before { + display: block; + } + } + + #menu { + @include vendor('transform', 'translateX(0)'); + } + } + +/* Header */ + + #header { + @include vendor('transition', 'background-color #{_duration(transitions)} ease'); + background: _palette(bg); + height: 3em; + left: 0; + line-height: 3em; + position: fixed; + top: 0; + width: 100%; + z-index: _misc(z-index-base); + + h1 { + @include vendor('transition', 'opacity #{_duration(transitions)} ease'); + height: inherit; + left: 1.25em; + line-height: inherit; + position: absolute; + top: 0; + + a { + border: 0; + display: block; + height: inherit; + line-height: inherit; + + @include breakpoint('<=small') { + font-size: 0.8em; + } + } + } + + nav { + height: inherit; + line-height: inherit; + position: absolute; + right: 0; + top: 0; + + > ul { + list-style: none; + margin: 0; + padding: 0; + white-space: nowrap; + + > li { + display: inline-block; + padding: 0; + + > a { + border: 0; + color: _palette(fg-bold); + display: block; + font-size: 0.8em; + letter-spacing: _size(letter-spacing-alt); + padding: 0 1.5em; + text-transform: uppercase; + + &.menuToggle { + outline: 0; + position: relative; + + &:after { + background-image: url('images/bars.svg'); + background-position: right center; + background-repeat: no-repeat; + content: ''; + display: inline-block; + height: 3.75em; + vertical-align: top; + width: 2em; + } + + @include breakpoint('<=small') { + padding: 0 1.5em; + + span { + display: none; + } + } + } + + @include breakpoint('<=small') { + padding: 0 0 0 1.5em; + } + } + + &:first-child { + margin-left: 0; + } + } + } + } + + &.alt { + background: transparent; + + h1 { + @include vendor('pointer-events', 'none'); + opacity: 0; + } + } + } + +/* Banner */ + + #banner { + @include vendor('display', 'flex'); + @include vendor('flex-direction', 'column'); + @include vendor('justify-content', 'center'); + cursor: default; + height: 100vh; + min-height: 35em; + overflow: hidden; + position: relative; + text-align: center; + + h2 { + @include vendor('transform', 'scale(1)'); + @include vendor('transition', ('transform 0.5s ease', 'opacity 0.5s ease')); + display: inline-block; + font-size: 1.75em; + opacity: 1; + padding: 0.35em 1em; + position: relative; + z-index: 1; + + &:before, &:after { + @include vendor('transition', 'width 0.85s ease'); + @include vendor('transition-delay', '0.25s'); + background: _palette(fg-bold); + content: ''; + display: block; + height: 2px; + position: absolute; + width: 100%; + } + + &:before { + top: 0; + left: 0; + } + + &:after { + bottom: 0; + right: 0; + } + } + + p { + letter-spacing: _size(letter-spacing-alt); + text-transform: uppercase; + + a { + color: inherit; + } + } + + .more { + @include vendor('transition', ('transform 0.75s ease', 'opacity 0.75s ease')); + @include vendor('transition-delay', '3.5s'); + @include vendor('transform', 'translateY(0)'); + border: none; + bottom: 0; + color: inherit; + font-size: 0.8em; + height: 8.5em; + left: 50%; + letter-spacing: _size(letter-spacing-alt); + margin-left: -8.5em; + opacity: 1; + outline: 0; + padding-left: _size(letter-spacing-alt); + position: absolute; + text-align: center; + text-transform: uppercase; + width: 16em; + z-index: 1; + + &:after { + background-image: url('images/arrow.svg'); + background-position: center; + background-repeat: no-repeat; + background-size: contain; + bottom: 4em; + content: ''; + display: block; + height: 1.5em; + left: 50%; + margin: 0 0 0 -0.75em; + position: absolute; + width: 1.5em; + } + } + + &:after { + @include vendor('pointer-events', 'none'); + @include vendor('transition', 'opacity #{_duration(fadein)} ease-in-out'); + @include vendor('transition-delay', '1.25s'); + content: ''; + background: _palette(bg); + display: block; + width: 100%; + height: 100%; + position: absolute; + left: 0; + top: 0; + opacity: 0; + } + + @include breakpoint('<=small') { + @include padding(7em, 3em); + height: auto; + min-height: 0; + + h2 { + font-size: 1.25em; + } + + br { + display: none; + } + + .more { + display: none; + } + } + } + + body.is-preload { + #banner { + h2 { + @include vendor('transform', 'scale(0.95)'); + opacity: 0; + + &:before, &:after { + width: 0; + } + } + + .more { + @include vendor('transform', 'translateY(8.5em)'); + opacity: 0; + } + + &:after { + opacity: 1; + } + } + } + +/* CTA */ + + #cta { + .inner { + @include vendor('display', 'flex'); + max-width: 45em; + + header { + @include vendor('order', '1'); + padding-right: 3em; + width: 70%; + + p { + color: inherit; + } + } + + .actions { + @include vendor('order', '2'); + width: 30%; + } + + @include breakpoint('<=medium') { + display: block; + text-align: center; + + header { + padding-right: 0; + width: 100%; + } + + .actions { + margin-left: auto; + margin-right: auto; + max-width: 20em; + width: 100%; + } + } + + @include breakpoint('<=small') { + .actions { + max-width: none; + } + } + } + } + +/* Main */ + + #main { + > header { + @include padding(12em, 0); + @include vendor('background-image', ('linear-gradient(top, rgba(0,0,0,0.5), rgba(0,0,0,0.5))', 'url("../../images/banner.jpg")')); + background-attachment: fixed; + background-position: center center; + background-repeat: no-repeat; + background-size: cover; + text-align: center; + + h2 { + font-size: 1.75em; + margin: 0 0 (_size(element-margin) * 0.25) 0; + } + + p { + color: inherit; + letter-spacing: _size(letter-spacing-alt); + text-transform: uppercase; + top: 0; + + a { + color: inherit; + } + } + + @include breakpoint('<=xlarge') { + @include padding(10em, 0); + } + + @include breakpoint('<=large') { + @include padding(8em, 3em); + } + + @include breakpoint('<=medium') { + @include padding(10em, 3em); + } + + @include breakpoint('<=small') { + @include padding(5em, 3em); + + h2 { + font-size: 1.25em; + margin: 0 0 (_size(element-margin) * 0.5) 0; + } + } + } + } + + body.is-mobile { + #main { + > header { + background-attachment: scroll; + } + } + } + +/* Footer */ + + #footer { + @include padding(6em, 0); + background-color: darken(_palette(bg), 8); + text-align: center; + + .icons { + font-size: 1.25em; + + a { + color: _palette(fg-light); + + &:hover { + color: _palette(fg); + } + } + } + + .copyright { + color: _palette(fg-light); + font-size: 0.8em; + letter-spacing: _size(letter-spacing-alt); + list-style: none; + padding: 0; + text-transform: uppercase; + + li { + border-left: solid 1px _palette(fg-light); + display: inline-block; + line-height: 1em; + margin-left: 1em; + padding-left: 1em; + + &:first-child { + border-left: 0; + margin-left: 0; + padding-left: 0; + } + + a { + color: inherit; + + &:hover { + color: _palette(fg); + } + } + + @include breakpoint('<=xsmall') { + border: 0; + display: block; + line-height: 1.65em; + margin: 0; + padding: 0.5em 0; + } + } + } + + @include breakpoint('<=medium') { + @include padding(4em, 3em); + } + + @include breakpoint('<=small') { + @include padding(3em, 2em); + } + } + +/* Landing */ + + body.landing { + #page-wrapper { + @include vendor('background-image', ('linear-gradient(top, rgba(0,0,0,0.5), rgba(0,0,0,0.5))', 'url("../../images/banner.jpg")')); + background-attachment: fixed; + background-position: center center; + background-repeat: no-repeat; + background-size: cover; + padding-top: 0; + } + + #footer { + background-color: darken(transparentize(_palette(bg), 0.1), 8); + } + } + + body.is-mobile { + &.landing { + #page-wrapper { + background: none; + } + + #banner, + .wrapper.style4 { + @include vendor('background-image', ('linear-gradient(top, rgba(0,0,0,0.5), rgba(0,0,0,0.5))', 'url("../../images/banner.jpg")')); + background-position: center center; + background-repeat: no-repeat; + background-size: cover; + } + + #footer { + background-color: darken(_palette(bg), 8); + } + } + } \ No newline at end of file diff --git a/src/assets/sass/noscript.scss b/src/assets/sass/noscript.scss new file mode 100644 index 0000000..770de19 --- /dev/null +++ b/src/assets/sass/noscript.scss @@ -0,0 +1,36 @@ +@import 'libs/vars'; +@import 'libs/functions'; +@import 'libs/mixins'; +@import 'libs/vendor'; +@import 'libs/breakpoints'; +@import 'libs/html-grid'; + +/* + Spectral by HTML5 UP + html5up.net | @ajlkn + Free for personal and commercial use under the CCA 3.0 license (html5up.net/license) +*/ + +/* Banner */ + + body.is-preload { + #banner { + h2 { + @include vendor('transform', 'none'); + opacity: 1; + + &:before, &:after { + width: 100%; + } + } + + .more { + @include vendor('transform', 'none'); + opacity: 1; + } + + &:after { + opacity: 0; + } + } + } \ No newline at end of file diff --git a/src/assets/webfonts/fa-brands-400.eot b/src/assets/webfonts/fa-brands-400.eot new file mode 100644 index 0000000..cba6c6c Binary files /dev/null and b/src/assets/webfonts/fa-brands-400.eot differ diff --git a/src/assets/webfonts/fa-brands-400.svg b/src/assets/webfonts/fa-brands-400.svg new file mode 100644 index 0000000..b9881a4 --- /dev/null +++ b/src/assets/webfonts/fa-brands-400.svg @@ -0,0 +1,3717 @@ + + + + +Created by FontForge 20201107 at Wed Aug 4 12:25:29 2021 + By Robert Madole +Copyright (c) Font Awesome + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/webfonts/fa-brands-400.ttf b/src/assets/webfonts/fa-brands-400.ttf new file mode 100644 index 0000000..8d75ded Binary files /dev/null and b/src/assets/webfonts/fa-brands-400.ttf differ diff --git a/src/assets/webfonts/fa-brands-400.woff b/src/assets/webfonts/fa-brands-400.woff new file mode 100644 index 0000000..3375bef Binary files /dev/null and b/src/assets/webfonts/fa-brands-400.woff differ diff --git a/src/assets/webfonts/fa-brands-400.woff2 b/src/assets/webfonts/fa-brands-400.woff2 new file mode 100644 index 0000000..402f81c Binary files /dev/null and b/src/assets/webfonts/fa-brands-400.woff2 differ diff --git a/src/assets/webfonts/fa-regular-400.eot b/src/assets/webfonts/fa-regular-400.eot new file mode 100644 index 0000000..a4e5989 Binary files /dev/null and b/src/assets/webfonts/fa-regular-400.eot differ diff --git a/src/assets/webfonts/fa-regular-400.svg b/src/assets/webfonts/fa-regular-400.svg new file mode 100644 index 0000000..463af27 --- /dev/null +++ b/src/assets/webfonts/fa-regular-400.svg @@ -0,0 +1,801 @@ + + + + +Created by FontForge 20201107 at Wed Aug 4 12:25:29 2021 + By Robert Madole +Copyright (c) Font Awesome + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/webfonts/fa-regular-400.ttf b/src/assets/webfonts/fa-regular-400.ttf new file mode 100644 index 0000000..7157aaf Binary files /dev/null and b/src/assets/webfonts/fa-regular-400.ttf differ diff --git a/src/assets/webfonts/fa-regular-400.woff b/src/assets/webfonts/fa-regular-400.woff new file mode 100644 index 0000000..ad077c6 Binary files /dev/null and b/src/assets/webfonts/fa-regular-400.woff differ diff --git a/src/assets/webfonts/fa-regular-400.woff2 b/src/assets/webfonts/fa-regular-400.woff2 new file mode 100644 index 0000000..5632894 Binary files /dev/null and b/src/assets/webfonts/fa-regular-400.woff2 differ diff --git a/src/assets/webfonts/fa-solid-900.eot b/src/assets/webfonts/fa-solid-900.eot new file mode 100644 index 0000000..e994171 Binary files /dev/null and b/src/assets/webfonts/fa-solid-900.eot differ diff --git a/src/assets/webfonts/fa-solid-900.svg b/src/assets/webfonts/fa-solid-900.svg new file mode 100644 index 0000000..00296e9 --- /dev/null +++ b/src/assets/webfonts/fa-solid-900.svg @@ -0,0 +1,5034 @@ + + + + +Created by FontForge 20201107 at Wed Aug 4 12:25:29 2021 + By Robert Madole +Copyright (c) Font Awesome + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/webfonts/fa-solid-900.ttf b/src/assets/webfonts/fa-solid-900.ttf new file mode 100644 index 0000000..25abf38 Binary files /dev/null and b/src/assets/webfonts/fa-solid-900.ttf differ diff --git a/src/assets/webfonts/fa-solid-900.woff b/src/assets/webfonts/fa-solid-900.woff new file mode 100644 index 0000000..23ee663 Binary files /dev/null and b/src/assets/webfonts/fa-solid-900.woff differ diff --git a/src/assets/webfonts/fa-solid-900.woff2 b/src/assets/webfonts/fa-solid-900.woff2 new file mode 100644 index 0000000..2217164 Binary files /dev/null and b/src/assets/webfonts/fa-solid-900.woff2 differ diff --git a/src/components/Parallax.tsx b/src/components/Parallax.tsx index 25a0b7e..3c4dbb9 100644 --- a/src/components/Parallax.tsx +++ b/src/components/Parallax.tsx @@ -1,4 +1,4 @@ -import {useState, useEffect, useRef, PropsWithChildren, CSSProperties} from 'react'; +import {useState, useEffect, useRef, PropsWithChildren, CSSProperties, HTMLAttributes} from 'react'; export enum eParallaxStyle { FIXED, @@ -9,11 +9,15 @@ interface ParallaxProps { height?: string; backgroundImage?: string; parallaxStyle?: eParallaxStyle; + style?: CSSProperties, + className?:string } const Parallax: React.FC> = ( { height = '50vh', + className = '', + style = {}, backgroundImage, children, parallaxStyle = eParallaxStyle.FIXED @@ -46,16 +50,17 @@ const Parallax: React.FC> = ( return () => window.removeEventListener('scroll', handleScroll); }, []); - let style: CSSProperties = { + let parallaxStyles: CSSProperties = { backgroundImage: `url(${backgroundImage})`, backgroundAttachment: parallaxStyle === eParallaxStyle.FIXED ? 'fixed' : 'scroll', + backgroundColor: 'rgba(0, 0, 0, 0.1)', backgroundRepeat: 'no-repeat', backgroundSize: 'cover', - backgroundColor: 'transparent', height: height, display: 'flex', alignItems: 'center', justifyContent: 'center', + ...style, }; const parallaxSpeed = 0.2; @@ -63,22 +68,24 @@ const Parallax: React.FC> = ( switch (parallaxStyle) { case eParallaxStyle.FIXED: - style.backgroundPosition = 'center'; + parallaxStyles.backgroundPosition = 'center'; // style.backgroundPositionY = `calc( ${offset * parallaxSpeed}px)`; break; case eParallaxStyle.SCROLL: // This value affects the speed of the parallax effect // You might need to adjust the multiplier to get the desired effect - style.backgroundPositionY = `calc(25% + ${offset * parallaxSpeed}px)`; - style.backgroundSize = '125%' + parallaxStyles.backgroundPositionY = `calc(50% + ${offset * parallaxSpeed}px)`; + parallaxStyles.backgroundSize = '200%' break; } return ( -
+
+ {children} +
); }; diff --git a/src/data/allies.tsx b/src/data/allies.tsx index e69de29..def8f2d 100644 --- a/src/data/allies.tsx +++ b/src/data/allies.tsx @@ -0,0 +1,62 @@ +import {IconDefinition} from "@fortawesome/free-regular-svg-icons"; +import {faHeart} from "@fortawesome/free-solid-svg-icons"; +import CSL from "src/assets/images/allies/staffing_csl.webp" +import Culinaire from "src/assets/images/allies/staffing_culinaire.webp" +import Grassroots from "src/assets/images/allies/staffing_grassroots.webp" +import ModernCulture from "src/assets/images/allies/staffing_guidehouse.jpeg" +import NCW from "src/assets/images/allies/staffing_ncw.jpeg" +import PremierStaffing from "src/assets/images/allies/staffing_premier_staffing_inc.jpeg" +import Proclinical from "src/assets/images/allies/staffing_proclinical.webp" +import SalesFit from "src/assets/images/allies/staffing_sales_fit.webp" +import TQL from "src/assets/images/allies/staffing_tql.webp" + + +interface iAlly { + name: string, + image: any, + icon: IconDefinition; +} + + +const Allies: iAlly[] = [ + { + name: 'CSL', + image: CSL, + icon: faHeart + }, { + name: 'Culinaire', + image: Culinaire, + icon: faHeart + }, { + name: 'Grassroots', + image: Grassroots, + icon: faHeart + }, { + name: 'ModernCulture', + image: ModernCulture, + icon: faHeart + }, { + name: 'NCW', + image: NCW, + icon: faHeart + }, { + name: 'Premier Staffing', + image: PremierStaffing, + icon: faHeart + }, { + name: 'Proclinical', + image: Proclinical, + icon: faHeart + }, { + name: 'Sales Fit', + image: SalesFit, + icon: faHeart + }, { + name: 'TQL', + image: TQL, + icon: faHeart + }, +] + + +export default Allies \ No newline at end of file diff --git a/src/data/media.tsx b/src/data/media.tsx new file mode 100644 index 0000000..87732da --- /dev/null +++ b/src/data/media.tsx @@ -0,0 +1,28 @@ +import Disrupt from "assets/allies/media_disrupt.webp" +import Redx from "assets/allies/media_redx.webp" +import RoyalPost from "assets/allies/media_the_royal_heir_post.webp" + + +interface iMedia { + name: string, + image: any, +} + + +const Media: iMedia[] = [ + { + name: 'Disrupt Magazine', + image: Disrupt + }, + { + name: 'Redx', + image: Redx + }, + { + name: 'The Royal Heir Post', + image: RoyalPost + }, +] + + +export default Media \ No newline at end of file diff --git a/src/data/services.tsx b/src/data/services.tsx index 13f9bde..7de0ae6 100644 --- a/src/data/services.tsx +++ b/src/data/services.tsx @@ -1,57 +1,61 @@ import {IconProp} from "@fortawesome/fontawesome-svg-core"; -import {faChess} from "@fortawesome/free-solid-svg-icons"; -import Apply from "assets/services/apply.webp"; -import Consulting from "assets/services/consulting.webp"; -import Mock from "assets/services/mock.webp"; -import Money from "assets/services/money.webp"; -import Search from "assets/services/search.webp"; -import Optimization from "assets/services/optimization.webp"; +import {IconDefinition, IconName} from "@fortawesome/free-regular-svg-icons"; +import {faHeart, faFlag, faPaperPlane, faSearch, faPeopleGroup, faArrowUp} from "@fortawesome/free-solid-svg-icons"; +import dalle5 from 'src/assets/images/dalle5.webp'; +import dalle6 from 'src/assets/images/dalle6.webp'; +import dalle8 from 'src/assets/images/dalle8.webp'; + + interface iService { title: string; description: string; link: string; image: string; - icon: IconProp; + icon: IconDefinition; } -export const serviceList: iService[] = [ + +const serviceList: iService[] = [ { title: 'Resume & Cover Letter Optimization', description: 'We 1. Analyze, 2. Consult, and 3. Enhance your Resume and Cover Letter. We thoroughly craft ATS-compliant resumes and cover letters that resonate with your target industries, ensuring you stand out in a competitive job market.', link: '#', - image: Optimization, - icon: faChess + image: dalle5, + icon: faArrowUp }, { title: 'Job Searching', description: 'We take care of the entire Job Searching process for you with 5-Star results. Our dedicated team leverages their deep industry knowledge an expansive network to connect you with exclusive job opportunities. We provide personalized guidance, assisting you in identifying the perfect position.', link: '#', - image: Search, - icon: faChess + image: dalle6, + icon: faSearch }, { title: 'Job Applying', description: 'Our team of experts meticulously tailor each application to the unique requirements of each job, showcasing your qualifications and experience in the best light. We automate the entire job application process and increase your chances of landing your dream position.', link: '#', - image: Apply, - icon: faChess + image: dalle8, + icon: faPaperPlane }, { title: 'Career Consulting', description: 'With our personalized approach, we\'ll work closely with you to understand your unique strengths, interests, and career goals. From there, we\'ll provide you with tailored advice and services to help you succeed.', link: '#', - image: Consulting, - icon: faChess + image: dalle8, + icon: faHeart }, { title: 'Mock Interviews', description: 'Our mock interview services are unparalleled. With a keen eye for detail, we provide comprehensive feedback and guidance, helping you refine your interview skills, boost your confidence, and sharpen your responses. ', link: '#', - image: Mock, - icon: faChess + image: dalle6, + icon: faPeopleGroup }, { title: '60 Day Money Back Guarantee', description: 'If for some extraordinary reason, you don\'t get results after 60 days of continued services, we\'ll deliver 100% free unlimited services for the remainder of your job search. No questions asked!', link: '#', - image: Money, - icon: faChess + image: dalle5, + icon: faFlag } ] + + +export default serviceList diff --git a/src/hoc/isLocal.tsx b/src/hoc/isLocal.tsx new file mode 100644 index 0000000..60ea4c8 --- /dev/null +++ b/src/hoc/isLocal.tsx @@ -0,0 +1,2 @@ + +export default process.env.NODE_ENV === 'development'; diff --git a/src/index.html b/src/index.html index d513df1..693ef52 100644 --- a/src/index.html +++ b/src/index.html @@ -1,18 +1,35 @@ - - + + + - - - ProfessionMate.com - - - - - + + + + - -
- + + + +
+ +
+ + +
+ + + + + + + + + + - + \ No newline at end of file diff --git a/src/index.tsx b/src/index.tsx index 5c28637..d8c68ac 100644 --- a/src/index.tsx +++ b/src/index.tsx @@ -1,8 +1,11 @@ - - +import Footer from "src/Footer"; +import Header from "src/Header"; +import isLocal from "src/hoc/isLocal"; import isTest from "src/hoc/isTest"; import {ppr} from "src/hoc/passPropertiesAndRender"; -import Home, {HOME} from "src/Home"; +import Elements, {ELEMENTS} from "src/pages/Examples/Elements"; +import Generic, {GENERIC} from "src/pages/Examples/Generic"; +import Home, {HOME} from "src/pages/Home/Home"; import {createRoot} from 'react-dom/client'; import {BrowserRouter, HashRouter, MemoryRouter, Navigate, Route, Routes} from "react-router-dom"; import Allies, {ALLIES} from "src/pages/Allies/Allies"; @@ -10,7 +13,6 @@ import Contact, {CONTACT} from "src/pages/Contact/Contact"; import Pricing, {PRICING} from "src/pages/Pricing/Pricing"; import Review, {REVIEWS} from "src/pages/Reviews/Reviews"; import Services, {SERVICES} from "src/pages/Services/Services"; -import Wrapper from "src/Wrapper"; const root = createRoot(document.getElementById('app') as HTMLElement); @@ -27,15 +29,23 @@ const reactRouterContext = (children: any) => { } -root.render(reactRouterContext( +root.render(reactRouterContext(<> +
- - - - - - - - }/> - - )); + + + + + + + {isLocal + ? <> + + + + : ''} + + }/> + +