From 884db125e05889d8c01abf3f79e539fa11c0b814 Mon Sep 17 00:00:00 2001 From: Sara Vieira Date: Thu, 14 Sep 2017 12:26:57 +0100 Subject: [PATCH] feat(my-joyent): fetch packages and implement filters --- packages/cloudapi-gql/package.json | 4 +- packages/cloudapi-gql/src/index.js | 4 + packages/my-joyent/.yarnclean | 0 packages/my-joyent/package.json | 5 +- .../__snapshots__/filters.spec.js.snap | 1219 ++ .../filters/__tests__/filters.spec.js | 21 + .../src/components/filters/filters.js | 72 + .../my-joyent/src/components/filters/index.js | 1 + .../__tests__/__snapshots__/home.spec.js.snap | 1183 +- .../components/home/__tests__/home.spec.js | 18 +- .../my-joyent/src/components/home/home.js | 28 +- .../__tests__/__snapshots__/list.spec.js.snap | 7727 ++++++++++++ .../packages/__tests__/list.spec.js | 21 + .../src/components/packages/index.js | 1 + .../my-joyent/src/components/packages/list.js | 80 + .../__snapshots__/index.spec.js.snap | 10031 ++++++++++++++++ .../containers/home/__tests__/index.spec.js | 6 +- .../my-joyent/src/containers/home/index.js | 22 +- .../__snapshots__/index.spec.js.snap | 7727 ++++++++++++ .../packages/__tests__/index.spec.js | 23 + .../src/containers/packages/index.js | 25 + packages/my-joyent/src/data/packages.json | 146 + .../my-joyent/src/graphql/data-centers.gql | 5 + packages/my-joyent/src/graphql/packages.gql | 10 + packages/my-joyent/src/state/actions.js | 8 + packages/my-joyent/src/state/filterReducer.js | 13 + packages/my-joyent/src/state/state.js | 9 +- packages/my-joyent/src/state/store.js | 6 +- packages/my-joyent/test/mocks/filters.js | 18 + packages/my-joyent/test/mocks/index.js | 2 + packages/my-joyent/test/mocks/packages.js | 50 + packages/ui-toolkit/.eslintrc | 3 +- packages/ui-toolkit/.yarnclean | 0 packages/ui-toolkit/package.json | 22 +- packages/ui-toolkit/src/card/card.js | 13 +- packages/ui-toolkit/src/card/footer.js | 44 + packages/ui-toolkit/src/card/index.js | 1 + packages/ui-toolkit/src/card/usage.md | 30 + packages/ui-toolkit/src/index.js | 4 +- packages/ui-toolkit/src/message/index.js | 2 +- packages/ui-toolkit/src/slider/Readme.md | 25 + packages/ui-toolkit/src/slider/index.js | 147 + packages/ui-toolkit/src/slider/inputStyles.js | 61 + packages/ui-toolkit/src/theme/index.js | 5 +- packages/ui-toolkit/styleguide.config.js | 3 +- yarn.lock | 20 +- 46 files changed, 27671 insertions(+), 1194 deletions(-) create mode 100644 packages/my-joyent/.yarnclean create mode 100644 packages/my-joyent/src/components/filters/__tests__/__snapshots__/filters.spec.js.snap create mode 100644 packages/my-joyent/src/components/filters/__tests__/filters.spec.js create mode 100644 packages/my-joyent/src/components/filters/filters.js create mode 100644 packages/my-joyent/src/components/filters/index.js create mode 100644 packages/my-joyent/src/components/packages/__tests__/__snapshots__/list.spec.js.snap create mode 100644 packages/my-joyent/src/components/packages/__tests__/list.spec.js create mode 100644 packages/my-joyent/src/components/packages/index.js create mode 100644 packages/my-joyent/src/components/packages/list.js create mode 100644 packages/my-joyent/src/containers/packages/__tests__/__snapshots__/index.spec.js.snap create mode 100644 packages/my-joyent/src/containers/packages/__tests__/index.spec.js create mode 100644 packages/my-joyent/src/containers/packages/index.js create mode 100644 packages/my-joyent/src/data/packages.json create mode 100644 packages/my-joyent/src/graphql/data-centers.gql create mode 100644 packages/my-joyent/src/graphql/packages.gql create mode 100644 packages/my-joyent/src/state/actions.js create mode 100644 packages/my-joyent/src/state/filterReducer.js create mode 100644 packages/my-joyent/test/mocks/filters.js create mode 100644 packages/my-joyent/test/mocks/packages.js create mode 100644 packages/ui-toolkit/.yarnclean create mode 100644 packages/ui-toolkit/src/card/footer.js create mode 100644 packages/ui-toolkit/src/slider/Readme.md create mode 100644 packages/ui-toolkit/src/slider/index.js create mode 100644 packages/ui-toolkit/src/slider/inputStyles.js diff --git a/packages/cloudapi-gql/package.json b/packages/cloudapi-gql/package.json index 404167d1..bbdd0a37 100644 --- a/packages/cloudapi-gql/package.json +++ b/packages/cloudapi-gql/package.json @@ -7,7 +7,8 @@ "main": "src/index.js", "scripts": { "lint": "eslint . --fix", - "lint-ci": "eslint . --format junit --output-file $CIRCLE_TEST_REPORTS/lint/cloudapi-gql.xml", + "lint-ci": + "eslint . --format junit --output-file $CIRCLE_TEST_REPORTS/lint/cloudapi-gql.xml", "test": "echo 0", "test-ci": "echo 0", "start": "node src/index.js", @@ -15,6 +16,7 @@ }, "dependencies": { "bunyan": "^1.8.12", + "cors": "^2.8.4", "dotenv": "^4.0.0", "express": "^4.15.4", "express-graphql": "^0.6.11", diff --git a/packages/cloudapi-gql/src/index.js b/packages/cloudapi-gql/src/index.js index 23e347ec..7c94809a 100644 --- a/packages/cloudapi-gql/src/index.js +++ b/packages/cloudapi-gql/src/index.js @@ -1,7 +1,11 @@ const express = require('express'); +const cors = require('cors'); const app = express(); +app.use(cors()); +app.options('*', cors()); + app.use('/graphql', require('./endpoint')); const server = app.listen(4000, err => { diff --git a/packages/my-joyent/.yarnclean b/packages/my-joyent/.yarnclean new file mode 100644 index 00000000..e69de29b diff --git a/packages/my-joyent/package.json b/packages/my-joyent/package.json index f5d9d13b..e613fa61 100644 --- a/packages/my-joyent/package.json +++ b/packages/my-joyent/package.json @@ -6,7 +6,7 @@ "main": "build/", "scripts": { "dev": - "REACT_APP_GQL_PORT=3000 PORT=3069 REACT_APP_GQL_PROTOCOL=http react-scripts start", + "REACT_APP_GQL_PORT=4000 PORT=3069 REACT_APP_GQL_PROTOCOL=http react-scripts start", "start": "PORT=3069 react-scripts start", "build": "NODE_ENV=production react-scripts build", "lint:css": "stylelint './src/**/*.js'", @@ -18,7 +18,8 @@ "lint-ci": "redrun -p lint-ci:*", "test": "NODE_ENV=test ./test/run --env=jsdom", "test-ci": - "echo 0 `# NODE_ENV=test JEST_JUNIT_OUTPUT=$CIRCLE_TEST_REPORTS/test/cp-frontend.xml ./test/run --env=jsdom --coverage --coverageDirectory=$CIRCLE_ARTIFACTS/cp-frontend --testResultsProcessor=$(node -e \"console.log(require.resolve('jest-junit'))\")`" + "echo 0 `# NODE_ENV=test JEST_JUNIT_OUTPUT=$CIRCLE_TEST_REPORTS/test/cp-frontend.xml ./test/run --env=jsdom --coverage --coverageDirectory=$CIRCLE_ARTIFACTS/cp-frontend --testResultsProcessor=$(node -e \"console.log(require.resolve('jest-junit'))\")`", + "prepublish": "node scripts/postinstall" }, "dependencies": { "apollo": "^0.2.2", diff --git a/packages/my-joyent/src/components/filters/__tests__/__snapshots__/filters.spec.js.snap b/packages/my-joyent/src/components/filters/__tests__/__snapshots__/filters.spec.js.snap new file mode 100644 index 00000000..a51f5efc --- /dev/null +++ b/packages/my-joyent/src/components/filters/__tests__/__snapshots__/filters.spec.js.snap @@ -0,0 +1,1219 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`renders without throwing 1`] = ` +.c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c3 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c3 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c3 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c3 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c3 .disabled .track { + background: #D8D8D8; +} + +.c3 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c3 .min, +.c3 .max { + display: none; +} + +.c3 .value { + top: 0.5rem; + position: absolute; +} + +.c3 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c3 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c3 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c4 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +.c2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; +} + +.c2 > div { + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; +} + +.c2 > div:not(:last-child) { + margin-right: 2.25rem; +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 100%; + -ms-flex-basis: 100%; + flex-basis: 100%; + max-width: 100%; + display: block; + } +} + +
+ .c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + + + .c3 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c1 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c1 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c1 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c1 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c1 .disabled .track { + background: #D8D8D8; +} + +.c1 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c1 .min, +.c1 .max { + display: none; +} + +.c1 .value { + top: 0.5rem; + position: absolute; +} + +.c1 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c1 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c1 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c2 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +.c0 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; +} + +.c0 > div { + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; +} + +.c0 > div:not(:last-child) { + margin-right: 2.25rem; +} + +
+ .c2 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c0 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c0 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c0 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c0 .disabled .track { + background: #D8D8D8; +} + +.c0 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c0 .min, +.c0 .max { + display: none; +} + +.c0 .value { + top: 0.5rem; + position: absolute; +} + +.c0 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c0 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c0 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c1 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +
+ .c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + + +
+ + + 0.256 + + +
+
+ + + + 0.256 + + +
+ + + + + 50.688 + + +
+ +
+ + + 50.688 + + +
+
+ .c2 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c0 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c0 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c0 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c0 .disabled .track { + background: #D8D8D8; +} + +.c0 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c0 .min, +.c0 .max { + display: none; +} + +.c0 .value { + top: 0.5rem; + position: absolute; +} + +.c0 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c0 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c0 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c1 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +
+ .c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + + +
+ + + 0.25 + + +
+
+ + + + 0.25 + + +
+ + + + + 3.25 + + +
+ +
+ + + 3.25 + + +
+
+ .c2 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c0 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c0 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c0 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c0 .disabled .track { + background: #D8D8D8; +} + +.c0 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c0 .min, +.c0 .max { + display: none; +} + +.c0 .value { + top: 0.5rem; + position: absolute; +} + +.c0 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c0 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c0 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c1 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +
+ .c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + + +
+ + + 0.01 + + +
+
+ + + + 0.01 + + +
+ + + + + 107.26 + + +
+ +
+ + + 107.26 + + +
+
+ .c2 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c0 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c0 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c0 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c0 .disabled .track { + background: #D8D8D8; +} + +.c0 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c0 .min, +.c0 .max { + display: none; +} + +.c0 .value { + top: 0.5rem; + position: absolute; +} + +.c0 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c0 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c0 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c1 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +
+ .c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + + +
+ + + 0.016 + + +
+
+ + + + 0.016 + + +
+ + + + + 0.525 + + +
+ +
+ + + 0.525 + + +
+
+
+
+`; diff --git a/packages/my-joyent/src/components/filters/__tests__/filters.spec.js b/packages/my-joyent/src/components/filters/__tests__/filters.spec.js new file mode 100644 index 00000000..218ca321 --- /dev/null +++ b/packages/my-joyent/src/components/filters/__tests__/filters.spec.js @@ -0,0 +1,21 @@ +/** + * @jest-environment jsdom + */ + +import React from 'react'; +import renderer from 'react-test-renderer'; +import 'jest-styled-components'; + +import { Router, FiltersMock } from '@mocks/'; +import Filters from '../filters'; + +it('renders without throwing', () => { + const tree = renderer + .create( + + + + ) + .toJSON(); + expect(tree).toMatchSnapshot(); +}); diff --git a/packages/my-joyent/src/components/filters/filters.js b/packages/my-joyent/src/components/filters/filters.js new file mode 100644 index 00000000..63f5b61a --- /dev/null +++ b/packages/my-joyent/src/components/filters/filters.js @@ -0,0 +1,72 @@ +import React from 'react'; +import { Col } from 'react-styled-flexboxgrid'; +import styled from 'styled-components'; +import remcalc from 'remcalc'; +import { Slider, FormLabel } from 'joyent-ui-toolkit'; + +const FilterWrapper = styled.section` + display: flex; + width: 100%; + + > div { + flex-grow: 1; + + &:not(:last-child) { + margin-right: ${remcalc(36)}; + } + } +`; + +const Filters = ({ + filters: { cpu, cost, ram, disk }, + ramSliderChange, + cpuSliderChange, + diskSliderChange, + costSliderChange +}) => { + return ( + + Choose a package + + ramSliderChange(value)} + > + GB RAM + + cpuSliderChange(value)} + > + vCPUs + + diskSliderChange(value)} + > + TB Disk + + costSliderChange(value)} + > + $/hr + + + + ); +}; + +export default Filters; diff --git a/packages/my-joyent/src/components/filters/index.js b/packages/my-joyent/src/components/filters/index.js new file mode 100644 index 00000000..7ade0668 --- /dev/null +++ b/packages/my-joyent/src/components/filters/index.js @@ -0,0 +1 @@ +export { default as Filters } from './filters'; diff --git a/packages/my-joyent/src/components/home/__tests__/__snapshots__/home.spec.js.snap b/packages/my-joyent/src/components/home/__tests__/__snapshots__/home.spec.js.snap index b90e5e33..c8a68949 100644 --- a/packages/my-joyent/src/components/home/__tests__/__snapshots__/home.spec.js.snap +++ b/packages/my-joyent/src/components/home/__tests__/__snapshots__/home.spec.js.snap @@ -1,1163 +1,28 @@ // Jest Snapshot v1, https://goo.gl/fbAQLP exports[`renders without throwing 1`] = ` -.c13 { - background-color: transparent; - text-decoration-skip: objects; - color: ; -} - -.c16 { - font-family: sans-serif; - font-size: 100%; - line-height: 1.15; - margin: 0; - overflow: visible; - text-transform: none; - -webkit-appearance: button; - -moz-appearance: button; - appearance: button; - min-width: 7.5rem; - box-sizing: border-box; - display: inline-block; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - margin: 0; - padding: 0.9375rem 1.125rem; - position: relative; - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - font-size: 0.9375rem; - text-align: center; - font-style: normal; - font-stretch: normal; - line-height: normal; - -webkit-letter-spacing: normal; - -moz-letter-spacing: normal; - -ms-letter-spacing: normal; - letter-spacing: normal; - text-decoration: none; - white-space: nowrap; - vertical-align: middle; - touch-action: manipulation; - cursor: pointer; - color: ; - background-image: none; - background-color: ; - border-radius: 0.25rem; - border: solid 0.0625rem; -} - -.c16::-moz-focus-inner, -.c16[type='button']::-moz-focus-inner, -.c16[type='reset']::-moz-focus-inner, -.c16[type='submit']::-moz-focus-inner { - border-style: none; - padding: 0; -} - -.c16:-moz-focusring, -.c16[type='button']:-moz-focusring, -.c16[type='reset']:-moz-focusring, -.c16[type='submit']:-moz-focusring { - outline: 0.0625rem dotted ButtonText; -} - -.c16:focus { - outline: 0; - text-decoration: none; - background-color: ; - border-color: ; -} - -.c16:hover { - background-color: ; - border: solid 0.0625rem; -} - -.c16:active, -.c16:active:hover, -.c16:active:focus { - background-image: none; - outline: 0; - background-color: ; - border-color: ; -} - -.c16[disabled] { - cursor: not-allowed; - pointer-events: none; -} - -.c16 + button { - margin-left: 1.25rem; -} - -.c10 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 0.9375rem; -} - -.c4 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 1.5rem; - font-weight: 400; - color: ; - margin: 1.25rem 0 1.125rem 0; - display: inline-block; -} - -.c5 { - border: solid; - border-width: 0 0.125rem 0.125rem 0; - display: inline-block; - padding: 0.125rem; - -webkit-transform: rotate(-45deg); - -ms-transform: rotate(-45deg); - transform: rotate(-45deg); - margin: 0.1875rem 0.625rem 0.1875rem 0.625rem; -} - -.c0 { - box-sizing: border-box; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex: 0 1 auto; - -ms-flex: 0 1 auto; - flex: 0 1 auto; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-flex-wrap: wrap; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - margin-right: -0.5rem; - margin-left: -0.5rem; -} - -.c12 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - line-height: 1.5rem; - font-size: 0.9375rem; -} - -.c15 { - background-color: #FFFFFF; - padding: 0.75rem; - min-width: auto; - border: none; - box-shadow: none; -} - -.c15:hover, -.c15:focus, -.c15:active, -.c15:active:hover, -.c15:active:focus { - background-color: #FFFFFF; - border: none; - box-shadow: none; -} - -.c6 { - position: relative; - margin-bottom: 0.75rem; - background-color: ; - box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); - border: 0.0625rem solid; -} - -.c7 { - position: absolute; - top: 0; - left: 0; - width: 2.25rem; - height: 100%; - background-color: ; -} - -.c8 { - padding: 0.75rem 0 0.84375rem 0; -} - -.c9 { - margin: 0 3.375rem 0.09375rem 3.375rem; - font-weight: 600; -} - -.c11 { - margin: 0.09375rem 3.375rem 0 3.375rem; -} - -.c14 { - position: absolute; - right: 0.1875rem; - top: 0.1875rem; -} - -.c2 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - display: inline-block; - font-size: 0.9375rem; - line-height: 1.6; - margin-right: 1.4375rem; -} - -.c3 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - color: ; - text-decoration: none; - cursor: pointer; -} - -.c3.active { - color: ; - cursor: default; -} - -.c1 { - list-style-type: none; - padding: 0; - margin: 0; -} - -
- .c0 { - box-sizing: border-box; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex: 0 1 auto; - -ms-flex: 0 1 auto; - flex: 0 1 auto; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-flex-wrap: wrap; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - margin-right: -0.5rem; - margin-left: -0.5rem; -} - -.c2 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - display: inline-block; - font-size: 0.9375rem; - line-height: 1.6; - margin-right: 1.4375rem; -} - -.c3 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - color: ; - text-decoration: none; - cursor: pointer; -} - -.c3.active { - color: ; - cursor: default; -} - -.c1 { - list-style-type: none; - padding: 0; - margin: 0; -} - -
- .c1 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - display: inline-block; - font-size: 0.9375rem; - line-height: 1.6; - margin-right: 1.4375rem; -} - -.c2 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - color: ; - text-decoration: none; - cursor: pointer; -} - -.c2.active { - color: ; - cursor: default; -} - -.c0 { - list-style-type: none; - padding: 0; - margin: 0; -} - -
    - .c0 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - display: inline-block; - font-size: 0.9375rem; - line-height: 1.6; - margin-right: 1.4375rem; -} - -.c1 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - color: ; - text-decoration: none; - cursor: pointer; -} - -.c1.active { - color: ; - cursor: default; -} - -
  • - .c0 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - color: ; - text-decoration: none; - cursor: pointer; -} - -.c0.active { - color: ; - cursor: default; -} - - - Instances - -
    • - .c0 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - display: inline-block; - font-size: 0.9375rem; - line-height: 1.6; - margin-right: 1.4375rem; -} - -
  • - Custom images -
    • - .c0 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - display: inline-block; - font-size: 0.9375rem; - line-height: 1.6; - margin-right: 1.4375rem; -} - -
  • - Docker images -
    • - .c0 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - display: inline-block; - font-size: 0.9375rem; - line-height: 1.6; - margin-right: 1.4375rem; -} - -
  • - Docker registries -
    • -
-
- .c1 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 1.5rem; - font-weight: 400; - color: ; - margin: 1.25rem 0 1.125rem 0; - display: inline-block; -} - -.c2 { - border: solid; - border-width: 0 0.125rem 0.125rem 0; - display: inline-block; - padding: 0.125rem; - -webkit-transform: rotate(-45deg); - -ms-transform: rotate(-45deg); - transform: rotate(-45deg); - margin: 0.1875rem 0.625rem 0.1875rem 0.625rem; -} - -.c0 { - box-sizing: border-box; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex: 0 1 auto; - -ms-flex: 0 1 auto; - flex: 0 1 auto; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-flex-wrap: wrap; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - margin-right: -0.5rem; - margin-left: -0.5rem; -} - -
- .c0 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 1.5rem; - font-weight: 400; - color: ; - margin: 1.25rem 0 1.125rem 0; - display: inline-block; -} - -.c1 { - border: solid; - border-width: 0 0.125rem 0.125rem 0; - display: inline-block; - padding: 0.125rem; - -webkit-transform: rotate(-45deg); - -ms-transform: rotate(-45deg); - transform: rotate(-45deg); - margin: 0.1875rem 0.625rem 0.1875rem 0.625rem; -} - -
- .c0 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 1.5rem; - font-weight: 400; - color: ; - margin: 1.25rem 0 1.125rem 0; - display: inline-block; -} - -

- Instances -

- .c0 { - border: solid; - border-width: 0 0.125rem 0.125rem 0; - display: inline-block; - padding: 0.125rem; - -webkit-transform: rotate(-45deg); - -ms-transform: rotate(-45deg); - transform: rotate(-45deg); - margin: 0.1875rem 0.625rem 0.1875rem 0.625rem; -} - -
-
- .c0 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 1.5rem; - font-weight: 400; - color: ; - margin: 1.25rem 0 1.125rem 0; - display: inline-block; -} - -.c1 { - border: solid; - border-width: 0 0.125rem 0.125rem 0; - display: inline-block; - padding: 0.125rem; - -webkit-transform: rotate(-45deg); - -ms-transform: rotate(-45deg); - transform: rotate(-45deg); - margin: 0.1875rem 0.625rem 0.1875rem 0.625rem; -} - -
- .c0 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 1.5rem; - font-weight: 400; - color: ; - margin: 1.25rem 0 1.125rem 0; - display: inline-block; -} - -

- Create Instance -

- .c0 { - border: solid; - border-width: 0 0.125rem 0.125rem 0; - display: inline-block; - padding: 0.125rem; - -webkit-transform: rotate(-45deg); - -ms-transform: rotate(-45deg); - transform: rotate(-45deg); - margin: 0.1875rem 0.625rem 0.1875rem 0.625rem; -} - -
-
-
- .c8 { - background-color: transparent; - text-decoration-skip: objects; - color: ; -} - -.c11 { - font-family: sans-serif; - font-size: 100%; - line-height: 1.15; - margin: 0; - overflow: visible; - text-transform: none; - -webkit-appearance: button; - -moz-appearance: button; - appearance: button; - min-width: 7.5rem; - box-sizing: border-box; - display: inline-block; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - margin: 0; - padding: 0.9375rem 1.125rem; - position: relative; - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - font-size: 0.9375rem; - text-align: center; - font-style: normal; - font-stretch: normal; - line-height: normal; - -webkit-letter-spacing: normal; - -moz-letter-spacing: normal; - -ms-letter-spacing: normal; - letter-spacing: normal; - text-decoration: none; - white-space: nowrap; - vertical-align: middle; - touch-action: manipulation; - cursor: pointer; - color: ; - background-image: none; - background-color: ; - border-radius: 0.25rem; - border: solid 0.0625rem; -} - -.c11::-moz-focus-inner, -.c11[type='button']::-moz-focus-inner, -.c11[type='reset']::-moz-focus-inner, -.c11[type='submit']::-moz-focus-inner { - border-style: none; - padding: 0; -} - -.c11:-moz-focusring, -.c11[type='button']:-moz-focusring, -.c11[type='reset']:-moz-focusring, -.c11[type='submit']:-moz-focusring { - outline: 0.0625rem dotted ButtonText; -} - -.c11:focus { - outline: 0; - text-decoration: none; - background-color: ; - border-color: ; -} - -.c11:hover { - background-color: ; - border: solid 0.0625rem; -} - -.c11:active, -.c11:active:hover, -.c11:active:focus { - background-image: none; - outline: 0; - background-color: ; - border-color: ; -} - -.c11[disabled] { - cursor: not-allowed; - pointer-events: none; -} - -.c11 + button { - margin-left: 1.25rem; -} - -.c5 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 0.9375rem; -} - -.c0 { - box-sizing: border-box; - display: -webkit-box; - display: -webkit-flex; - display: -ms-flexbox; - display: flex; - -webkit-flex: 0 1 auto; - -ms-flex: 0 1 auto; - flex: 0 1 auto; - -webkit-flex-direction: row; - -ms-flex-direction: row; - flex-direction: row; - -webkit-flex-wrap: wrap; - -ms-flex-wrap: wrap; - flex-wrap: wrap; - margin-right: -0.5rem; - margin-left: -0.5rem; -} - -.c7 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - line-height: 1.5rem; - font-size: 0.9375rem; -} - -.c10 { - background-color: #FFFFFF; - padding: 0.75rem; - min-width: auto; - border: none; - box-shadow: none; -} - -.c10:hover, -.c10:focus, -.c10:active, -.c10:active:hover, -.c10:active:focus { - background-color: #FFFFFF; - border: none; - box-shadow: none; -} - -.c1 { - position: relative; - margin-bottom: 0.75rem; - background-color: ; - box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); - border: 0.0625rem solid; -} - -.c2 { - position: absolute; - top: 0; - left: 0; - width: 2.25rem; - height: 100%; - background-color: ; -} - -.c3 { - padding: 0.75rem 0 0.84375rem 0; -} - -.c4 { - margin: 0 3.375rem 0.09375rem 3.375rem; - font-weight: 600; -} - -.c6 { - margin: 0.09375rem 3.375rem 0 3.375rem; -} - -.c9 { - position: absolute; - right: 0.1875rem; - top: 0.1875rem; -} - -
- .c7 { - background-color: transparent; - text-decoration-skip: objects; - color: ; -} - -.c10 { - font-family: sans-serif; - font-size: 100%; - line-height: 1.15; - margin: 0; - overflow: visible; - text-transform: none; - -webkit-appearance: button; - -moz-appearance: button; - appearance: button; - min-width: 7.5rem; - box-sizing: border-box; - display: inline-block; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - margin: 0; - padding: 0.9375rem 1.125rem; - position: relative; - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - font-size: 0.9375rem; - text-align: center; - font-style: normal; - font-stretch: normal; - line-height: normal; - -webkit-letter-spacing: normal; - -moz-letter-spacing: normal; - -ms-letter-spacing: normal; - letter-spacing: normal; - text-decoration: none; - white-space: nowrap; - vertical-align: middle; - touch-action: manipulation; - cursor: pointer; - color: ; - background-image: none; - background-color: ; - border-radius: 0.25rem; - border: solid 0.0625rem; -} - -.c10::-moz-focus-inner, -.c10[type='button']::-moz-focus-inner, -.c10[type='reset']::-moz-focus-inner, -.c10[type='submit']::-moz-focus-inner { - border-style: none; - padding: 0; -} - -.c10:-moz-focusring, -.c10[type='button']:-moz-focusring, -.c10[type='reset']:-moz-focusring, -.c10[type='submit']:-moz-focusring { - outline: 0.0625rem dotted ButtonText; -} - -.c10:focus { - outline: 0; - text-decoration: none; - background-color: ; - border-color: ; -} - -.c10:hover { - background-color: ; - border: solid 0.0625rem; -} - -.c10:active, -.c10:active:hover, -.c10:active:focus { - background-image: none; - outline: 0; - background-color: ; - border-color: ; -} - -.c10[disabled] { - cursor: not-allowed; - pointer-events: none; -} - -.c10 + button { - margin-left: 1.25rem; -} - -.c4 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 0.9375rem; -} - -.c6 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - line-height: 1.5rem; - font-size: 0.9375rem; -} - -.c9 { - background-color: #FFFFFF; - padding: 0.75rem; - min-width: auto; - border: none; - box-shadow: none; -} - -.c9:hover, -.c9:focus, -.c9:active, -.c9:active:hover, -.c9:active:focus { - background-color: #FFFFFF; - border: none; - box-shadow: none; -} - -.c0 { - position: relative; - margin-bottom: 0.75rem; - background-color: ; - box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); - border: 0.0625rem solid; -} - -.c1 { - position: absolute; - top: 0; - left: 0; - width: 2.25rem; - height: 100%; - background-color: ; -} - -.c2 { - padding: 0.75rem 0 0.84375rem 0; -} - -.c3 { - margin: 0 3.375rem 0.09375rem 3.375rem; - font-weight: 600; -} - -.c5 { - margin: 0.09375rem 3.375rem 0 3.375rem; -} - -.c8 { - position: absolute; - right: 0.1875rem; - top: 0.1875rem; -} - -
- .c0 { - position: absolute; - top: 0; - left: 0; - width: 2.25rem; - height: 100%; - background-color: ; -} - -
- .c5 { - background-color: transparent; - text-decoration-skip: objects; - color: ; -} - -.c2 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 0.9375rem; -} - -.c4 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - line-height: 1.5rem; - font-size: 0.9375rem; -} - -.c0 { - padding: 0.75rem 0 0.84375rem 0; -} - -.c1 { - margin: 0 3.375rem 0.09375rem 3.375rem; - font-weight: 600; -} - -.c3 { - margin: 0.09375rem 3.375rem 0 3.375rem; -} - -
- .c1 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 500; - font-size: 0.9375rem; -} - -.c0 { - margin: 0 3.375rem 0.09375rem 3.375rem; - font-weight: 600; -} - -

- Choosing deployement data center -

- .c2 { - background-color: transparent; - text-decoration-skip: objects; - color: ; -} - -.c1 { - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - line-height: 1.5rem; - font-size: 0.9375rem; -} - -.c0 { - margin: 0.09375rem 3.375rem 0 3.375rem; -} - -

- .c0 { - background-color: transparent; - text-decoration-skip: objects; - color: ; -} - -

- Not all data centres have all configurations of instances available. Make sure that you choose the data center that suits your requirements. - .c0 { - background-color: transparent; - text-decoration-skip: objects; - color: ; -} - - - Learn More - -

-

-
- .c2 { - font-family: sans-serif; - font-size: 100%; - line-height: 1.15; - margin: 0; - overflow: visible; - text-transform: none; - -webkit-appearance: button; - -moz-appearance: button; - appearance: button; - min-width: 7.5rem; - box-sizing: border-box; - display: inline-block; - -webkit-box-pack: center; - -webkit-justify-content: center; - -ms-flex-pack: center; - justify-content: center; - -webkit-align-items: center; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - margin: 0; - padding: 0.9375rem 1.125rem; - position: relative; - font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; - font-weight: 400; - font-size: 0.9375rem; - text-align: center; - font-style: normal; - font-stretch: normal; - line-height: normal; - -webkit-letter-spacing: normal; - -moz-letter-spacing: normal; - -ms-letter-spacing: normal; - letter-spacing: normal; - text-decoration: none; - white-space: nowrap; - vertical-align: middle; - touch-action: manipulation; - cursor: pointer; - color: ; - background-image: none; - background-color: ; - border-radius: 0.25rem; - border: solid 0.0625rem; -} - -.c2::-moz-focus-inner, -.c2[type='button']::-moz-focus-inner, -.c2[type='reset']::-moz-focus-inner, -.c2[type='submit']::-moz-focus-inner { - border-style: none; - padding: 0; -} - -.c2:-moz-focusring, -.c2[type='button']:-moz-focusring, -.c2[type='reset']:-moz-focusring, -.c2[type='submit']:-moz-focusring { - outline: 0.0625rem dotted ButtonText; -} - -.c2:focus { - outline: 0; - text-decoration: none; - background-color: ; - border-color: ; -} - -.c2:hover { - background-color: ; - border: solid 0.0625rem; -} - -.c2:active, -.c2:active:hover, -.c2:active:focus { - background-image: none; - outline: 0; - background-color: ; - border-color: ; -} - -.c2[disabled] { - cursor: not-allowed; - pointer-events: none; -} - -.c2 + button { - margin-left: 1.25rem; -} - -.c1 { - background-color: #FFFFFF; - padding: 0.75rem; - min-width: auto; - border: none; - box-shadow: none; -} - -.c1:hover, -.c1:focus, -.c1:active, -.c1:active:hover, -.c1:active:focus { - background-color: #FFFFFF; - border: none; - box-shadow: none; -} - -.c0 { - position: absolute; - right: 0.1875rem; - top: 0.1875rem; -} - - -
-
-
+ + + `; diff --git a/packages/my-joyent/src/components/home/__tests__/home.spec.js b/packages/my-joyent/src/components/home/__tests__/home.spec.js index 4da477ed..8731f32f 100644 --- a/packages/my-joyent/src/components/home/__tests__/home.spec.js +++ b/packages/my-joyent/src/components/home/__tests__/home.spec.js @@ -3,19 +3,19 @@ */ import React from 'react'; -import renderer from 'react-test-renderer'; +import ShallowRenderer from 'react-test-renderer/shallow'; import 'jest-styled-components'; -import { Router } from '@mocks/'; +import { Router, FiltersMock } from '@mocks/'; import Home from '../home'; it('renders without throwing', () => { - const tree = renderer - .create( - - - - ) - .toJSON(); + const renderer = new ShallowRenderer(); + renderer.render( + + + + ); + const tree = renderer.getRenderOutput(); expect(tree).toMatchSnapshot(); }); diff --git a/packages/my-joyent/src/components/home/home.js b/packages/my-joyent/src/components/home/home.js index cde4f5b5..bf26178e 100644 --- a/packages/my-joyent/src/components/home/home.js +++ b/packages/my-joyent/src/components/home/home.js @@ -1,6 +1,8 @@ import React, { Component } from 'react'; import { Row } from 'react-styled-flexboxgrid'; import { SectionNav } from '@components/navigation'; +import { Filters } from '@components/filters'; +import PackagesHOC from '@containers/packages'; import { Message, Breadcrumb, BreadcrumbItem, Anchor } from 'joyent-ui-toolkit'; class Home extends Component { @@ -12,6 +14,7 @@ class Home extends Component { }; this.closeMessage = this.closeMessage.bind(this); + this.changeValue = this.changeValue.bind(this); } closeMessage() { @@ -20,8 +23,18 @@ class Home extends Component { }); } + changeValue(key, value) { + const filters = this.props.filters; + this.props.onFilterChange({ + ...filters, + [key]: value + }); + } + render() { - const _msg = this.state.showMessage ? ( + const { showMessage } = this.state; + const { filters } = this.props; + const _msg = showMessage ? ( ) : null; + return (
@@ -41,6 +55,18 @@ class Home extends Component { Create Instance {_msg} + + this.changeValue('ram', value)} + cpuSliderChange={value => this.changeValue('cpu', value)} + diskSliderChange={value => this.changeValue('disk', value)} + costSliderChange={value => this.changeValue('cost', value)} + /> + + + +
); } diff --git a/packages/my-joyent/src/components/packages/__tests__/__snapshots__/list.spec.js.snap b/packages/my-joyent/src/components/packages/__tests__/__snapshots__/list.spec.js.snap new file mode 100644 index 00000000..9fd3e067 --- /dev/null +++ b/packages/my-joyent/src/components/packages/__tests__/__snapshots__/list.spec.js.snap @@ -0,0 +1,7727 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`renders without throwing 1`] = ` +.c3 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c5 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c4 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c7 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c9 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c10 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +.c0 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; + list-style: none; + padding: 0; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-pack: space-between; + -webkit-justify-content: space-between; + -ms-flex-pack: space-between; + justify-content: space-between; + margin-top: 2.25rem; +} + +@media only screen and (min-width:0em) { + .c3 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
  • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.256 + GB RAM + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.25 + vCPUs + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.1 + TB disk + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
    +
    +
    +
    +
    +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
  • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.768 + GB RAM + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.5 + vCPUs + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.25 + TB disk + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
    +
    +
    +
    +
    +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
  • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 1.8 + GB RAM + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 1 + vCPUs + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.5 + TB disk + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
    +
    +
    +
    +
    +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
  • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 3.8 + GB RAM + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 2 + vCPUs + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 1 + TB disk + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
    +
    +
    +
    +
    +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
  • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 7.8 + GB RAM + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 4 + vCPUs + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 2 + TB disk + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
    +
    +
    +
    +
    +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
  • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 15.8 + GB RAM + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 8 + vCPUs + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 4 + TB disk + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
    + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
    + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
    +
    +
    +
    +
    +
    • +
+`; diff --git a/packages/my-joyent/src/components/packages/__tests__/list.spec.js b/packages/my-joyent/src/components/packages/__tests__/list.spec.js new file mode 100644 index 00000000..1c4cbe5d --- /dev/null +++ b/packages/my-joyent/src/components/packages/__tests__/list.spec.js @@ -0,0 +1,21 @@ +/** + * @jest-environment jsdom + */ + +import React from 'react'; +import renderer from 'react-test-renderer'; +import 'jest-styled-components'; + +import { Router, PackagesMock, FiltersMock } from '@mocks/'; +import { Packages } from '../'; + +it('renders without throwing', () => { + const tree = renderer + .create( + + + + ) + .toJSON(); + expect(tree).toMatchSnapshot(); +}); diff --git a/packages/my-joyent/src/components/packages/index.js b/packages/my-joyent/src/components/packages/index.js new file mode 100644 index 00000000..e5c91307 --- /dev/null +++ b/packages/my-joyent/src/components/packages/index.js @@ -0,0 +1 @@ +export { default as Packages } from './list'; diff --git a/packages/my-joyent/src/components/packages/list.js b/packages/my-joyent/src/components/packages/list.js new file mode 100644 index 00000000..87caf40b --- /dev/null +++ b/packages/my-joyent/src/components/packages/list.js @@ -0,0 +1,80 @@ +import React, { Component } from 'react'; +import remcalc from 'remcalc'; +import styled from 'styled-components'; +import { + Card, + CardSubTitle, + CardTitle, + CardView, + CardFooter, + CardMeta +} from 'joyent-ui-toolkit'; + +const ListStyled = styled.ul` + display: flex; + width: 100%; + list-style: none; + padding: 0; + flex-wrap: wrap; + justify-content: space-between; + margin-top: ${remcalc(36)}; +`; +class Packages extends Component { + constructor(props) { + super(props); + const { filters: { ram, cpu, cost, disk }, packages } = props; + this.state = { + ram, + cpu, + cost, + disk, + packages + }; + } + + componentWillReceiveProps(nextProps) { + const { filters: { ram, cpu, cost, disk }, packages } = nextProps; + this.setState({ + ram, + cpu, + cost, + disk, + packages: packages + .filter(pack => pack.memory >= ram.min && pack.memory <= ram.max) + .filter( + pack => pack.disk / 1000 >= disk.min && pack.disk / 1000 <= disk.max + ) + .filter(pack => pack.vcpus >= cpu.min && pack.vcpus <= cpu.max) + .filter(pack => pack.price >= cost.min && pack.price <= cost.max) + }); + } + + _packages() { + return ( + + {this.state.packages.map(pack => ( +
  • + + + + ${pack.price} per hour + {pack.memory} GB RAM + {pack.vcpus} vCPUs + {pack.disk / 100} TB disk + SSD + + {pack.group} + + + +
    • + ))} +     + ); + } + render() { + return this._packages(); + } +} + +export default Packages; diff --git a/packages/my-joyent/src/containers/home/__tests__/__snapshots__/index.spec.js.snap b/packages/my-joyent/src/containers/home/__tests__/__snapshots__/index.spec.js.snap index 3efffa48..59d93d35 100644 --- a/packages/my-joyent/src/containers/home/__tests__/__snapshots__/index.spec.js.snap +++ b/packages/my-joyent/src/containers/home/__tests__/__snapshots__/index.spec.js.snap @@ -20,6 +20,24 @@ exports[`renders without throwing 1`] = ` margin-left: -0.5rem; } +.c18 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c26 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + .c0 { margin-right: auto; margin-left: auto; @@ -183,6 +201,18 @@ exports[`renders without throwing 1`] = ` box-shadow: none; } +.c19 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + .c7 { position: relative; margin-bottom: 0.75rem; @@ -219,6 +249,269 @@ exports[`renders without throwing 1`] = ` top: 0.1875rem; } +.c21 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c21 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c21 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c21 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c21 .disabled .track { + background: #D8D8D8; +} + +.c21 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c21 .min, +.c21 .max { + display: none; +} + +.c21 .value { + top: 0.5rem; + position: absolute; +} + +.c21 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c21 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c21 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c22 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +.c28 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c29 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c24 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c25 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c27 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c31 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c30 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c32 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c33 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + .c3 { font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; font-weight: 400; @@ -247,6 +540,62 @@ exports[`renders without throwing 1`] = ` margin: 0; } +.c20 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; +} + +.c20 > div { + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; +} + +.c20 > div:not(:last-child) { + margin-right: 2.25rem; +} + +.c23 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; + list-style: none; + padding: 0; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-pack: space-between; + -webkit-justify-content: space-between; + -ms-flex-pack: space-between; + justify-content: space-between; + margin-top: 2.25rem; +} + +@media only screen and (min-width:0em) { + .c18 { + -webkit-flex-basis: 100%; + -ms-flex-basis: 100%; + flex-basis: 100%; + max-width: 100%; + display: block; + } +} + +@media only screen and (min-width:0em) { + .c26 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + @media only screen and (min-width:48em) { .c0 { width: 46rem; @@ -287,6 +636,24 @@ exports[`renders without throwing 1`] = ` margin-left: -0.5rem; } +.c17 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c25 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + .c13 { background-color: transparent; text-decoration-skip: objects; @@ -437,6 +804,18 @@ exports[`renders without throwing 1`] = ` box-shadow: none; } +.c18 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + .c6 { position: relative; margin-bottom: 0.75rem; @@ -473,6 +852,269 @@ exports[`renders without throwing 1`] = ` top: 0.1875rem; } +.c20 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c20 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c20 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c20 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c20 .disabled .track { + background: #D8D8D8; +} + +.c20 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c20 .min, +.c20 .max { + display: none; +} + +.c20 .value { + top: 0.5rem; + position: absolute; +} + +.c20 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c20 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c20 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c21 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +.c27 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c28 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c23 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c24 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c26 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c30 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c29 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c31 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c32 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + .c2 { font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; font-weight: 400; @@ -501,6 +1143,62 @@ exports[`renders without throwing 1`] = ` margin: 0; } +.c19 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; +} + +.c19 > div { + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; +} + +.c19 > div:not(:last-child) { + margin-right: 2.25rem; +} + +.c22 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; + list-style: none; + padding: 0; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-pack: space-between; + -webkit-justify-content: space-between; + -ms-flex-pack: space-between; + justify-content: space-between; + margin-top: 2.25rem; +} + +@media only screen and (min-width:0em) { + .c17 { + -webkit-flex-basis: 100%; + -ms-flex-basis: 100%; + flex-basis: 100%; + max-width: 100%; + display: block; + } +} + +@media only screen and (min-width:0em) { + .c25 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} +
    .c0 { box-sizing: border-box; @@ -1426,6 +2124,9339 @@ exports[`renders without throwing 1`] = ` + .c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; +} + +.c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c4 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c4 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c4 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c4 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c4 .disabled .track { + background: #D8D8D8; +} + +.c4 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c4 .min, +.c4 .max { + display: none; +} + +.c4 .value { + top: 0.5rem; + position: absolute; +} + +.c4 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c4 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c4 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c5 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +.c3 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; +} + +.c3 > div { + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; +} + +.c3 > div:not(:last-child) { + margin-right: 2.25rem; +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 100%; + -ms-flex-basis: 100%; + flex-basis: 100%; + max-width: 100%; + display: block; + } +} + +
    + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c3 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c3 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c3 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c3 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c3 .disabled .track { + background: #D8D8D8; +} + +.c3 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c3 .min, +.c3 .max { + display: none; +} + +.c3 .value { + top: 0.5rem; + position: absolute; +} + +.c3 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c3 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c3 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c4 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +.c2 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; +} + +.c2 > div { + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; +} + +.c2 > div:not(:last-child) { + margin-right: 2.25rem; +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 100%; + -ms-flex-basis: 100%; + flex-basis: 100%; + max-width: 100%; + display: block; + } +} + +
    + .c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + + + .c3 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c1 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c1 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c1 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c1 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c1 .disabled .track { + background: #D8D8D8; +} + +.c1 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c1 .min, +.c1 .max { + display: none; +} + +.c1 .value { + top: 0.5rem; + position: absolute; +} + +.c1 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c1 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c1 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c2 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +.c0 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; +} + +.c0 > div { + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; +} + +.c0 > div:not(:last-child) { + margin-right: 2.25rem; +} + +
    + .c2 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c0 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c0 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c0 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c0 .disabled .track { + background: #D8D8D8; +} + +.c0 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c0 .min, +.c0 .max { + display: none; +} + +.c0 .value { + top: 0.5rem; + position: absolute; +} + +.c0 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c0 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c0 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c1 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +
    + .c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + + +
    + + + 0.256 + + +
    +
    + + + + 0.256 + + +
    + + + + + 50.8 + + +
    + +
    + + + 50.8 + + +
    +
    + .c2 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c0 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c0 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c0 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c0 .disabled .track { + background: #D8D8D8; +} + +.c0 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c0 .min, +.c0 .max { + display: none; +} + +.c0 .value { + top: 0.5rem; + position: absolute; +} + +.c0 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c0 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c0 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c1 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +
    + .c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + + +
    + + + 0 + + +
    +
    + + + + 0 + + +
    + + + + + 10 + + +
    + +
    + + + 10 + + +
    +
    + .c2 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c0 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c0 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c0 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c0 .disabled .track { + background: #D8D8D8; +} + +.c0 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c0 .min, +.c0 .max { + display: none; +} + +.c0 .value { + top: 0.5rem; + position: absolute; +} + +.c0 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c0 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c0 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c1 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +
    + .c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + + +
    + + + 0.01 + + +
    +
    + + + + 0.01 + + +
    + + + + + 122.88 + + +
    + +
    + + + 122.88 + + +
    +
    + .c2 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 .input-range { + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: 0.625rem; +} + +.c0 .slider { + -webkit-appearance: none; + -moz-appearance: none; + appearance: none; + background: #FFFFFF; + border: 2px solid #bdbdbd; + border-radius: 50%; + cursor: pointer; + display: block; + height: 0.875rem; + width: 0.875rem; + -webkit-transform: translateY(-50%) translateX(-50%); + -ms-transform: translateY(-50%) translateX(-50%); + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: 0.125rem; +} + +.c0 .slider::active { + -webkit-transform: scale(1.3); + -ms-transform: scale(1.3); + transform: scale(1.3); +} + +.c0 .slider::focus { + box-shadow: 0 0 0 5px rgba(63,81,181,0.2); +} + +.c0 .disabled .track { + background: #D8D8D8; +} + +.c0 .disabled .slider { + background: #CCC; + border: 1px solid #CCC; + box-shadow: none; + -webkit-transform: none; + -ms-transform: none; + transform: none; +} + +.c0 .min, +.c0 .max { + display: none; +} + +.c0 .value { + top: 0.5rem; + position: absolute; +} + +.c0 .value .label-container { + font-weight: 600; + font-size: 0.625rem; + color: #464646; + left: -50%; + position: relative; +} + +.c0 .track { + background: #D8D8D8; + cursor: pointer; + display: block; + height: 0.25rem; + position: relative; +} + +.c0 .active-track { + background: #364ACD; + height: 100%; + position: absolute; +} + +.c1 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + +
    + .c1 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.9375rem; + font-style: normal; + font-stretch: normal; + display: block; + color: ; + margin-right: 0.75rem; + font-weight: bold; +} + +.c0 { + margin-bottom: 0.625rem; + margin-top: 0.75rem; +} + + +
    + + + 0.016 + + +
    +
    + + + + 0.016 + + +
    + + + + + 0.525 + + +
    + +
    + + + 0.525 + + +
    +
    +
    +
    +
    + .c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; +} + +.c4 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c6 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c5 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c8 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c10 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c11 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +.c1 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; + list-style: none; + padding: 0; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-pack: space-between; + -webkit-justify-content: space-between; + -ms-flex-pack: space-between; + justify-content: space-between; + margin-top: 2.25rem; +} + +@media only screen and (min-width:0em) { + .c4 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    + .c3 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c5 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c4 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c7 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c9 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c10 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +.c0 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; + list-style: none; + padding: 0; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-pack: space-between; + -webkit-justify-content: space-between; + -ms-flex-pack: space-between; + justify-content: space-between; + margin-top: 2.25rem; +} + +@media only screen and (min-width:0em) { + .c3 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.256 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.25 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.1 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.768 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.5 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.25 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 1.8 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 1 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.5 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 3.8 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 2 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 1 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 7.8 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 4 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 2 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 15.8 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 8 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 4 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • +
    +
    `; diff --git a/packages/my-joyent/src/containers/home/__tests__/index.spec.js b/packages/my-joyent/src/containers/home/__tests__/index.spec.js index b41669ff..446bd761 100644 --- a/packages/my-joyent/src/containers/home/__tests__/index.spec.js +++ b/packages/my-joyent/src/containers/home/__tests__/index.spec.js @@ -7,13 +7,15 @@ import renderer from 'react-test-renderer'; import 'jest-styled-components'; import HomeHOC from '../'; -import { Router } from '@mocks/'; +import { Router, Store } from '@mocks/'; it('renders without throwing', () => { const tree = renderer .create( - + + + ) .toJSON(); diff --git a/packages/my-joyent/src/containers/home/index.js b/packages/my-joyent/src/containers/home/index.js index 689618bc..aea71996 100644 --- a/packages/my-joyent/src/containers/home/index.js +++ b/packages/my-joyent/src/containers/home/index.js @@ -1,11 +1,27 @@ import React from 'react'; +import { connect } from 'react-redux'; +import changeFilters from '../../state/actions'; import { LayoutContainer } from '@components/layout'; import { Home } from '@components/home'; -const HomeHOC = () => ( +const HomeHOC = ({ filters, onFilterChange }) => ( - + ); -export default HomeHOC; +const mapStateToProps = state => { + return { + filters: state.filters + }; +}; + +const mapDispatchToProps = dispatch => { + return { + onFilterChange: filters => { + dispatch(changeFilters(filters)); + } + }; +}; + +export default connect(mapStateToProps, mapDispatchToProps)(HomeHOC); diff --git a/packages/my-joyent/src/containers/packages/__tests__/__snapshots__/index.spec.js.snap b/packages/my-joyent/src/containers/packages/__tests__/__snapshots__/index.spec.js.snap new file mode 100644 index 00000000..72b6fbbc --- /dev/null +++ b/packages/my-joyent/src/containers/packages/__tests__/__snapshots__/index.spec.js.snap @@ -0,0 +1,7727 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`renders without throwing 1`] = ` +.c3 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c5 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c4 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c7 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c9 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c10 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +.c0 { + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + width: 100%; + list-style: none; + padding: 0; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + -webkit-box-pack: space-between; + -webkit-justify-content: space-between; + -ms-flex-pack: space-between; + justify-content: space-between; + margin-top: 2.25rem; +} + +@media only screen and (min-width:0em) { + .c3 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.256 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.25 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.1 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.768 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.5 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.25 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 1.8 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 1 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 0.5 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 3.8 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 2 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 1 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 7.8 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 4 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 2 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
    • + .c2 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c4 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + position: relative; + height: auto; + min-height: 7.875rem; + margin-bottom: 0.625rem; + border: 0.0625rem solid; + background-color: ; + box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05); + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + margin-right: 0rem; + margin-left: 0rem; + border-radius: 0.25rem background: border:1px solid; + background: ; + box-shadow: 0px 2px 0px rgba(0,0,0,0.05); + min-height: 11.5625rem; + min-width: 200px; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c3 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c6 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c8 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c9 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c2 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c3 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + -webkit-flex: 1; + -ms-flex: 1; + flex: 1; + margin: 0; + height: auto; + padding-top: 0; + min-width: auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; +} + +.c2 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c5 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c7 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c8 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c1 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c0 { + box-sizing: border-box; + -webkit-flex: 0 0 auto; + -ms-flex: 0 0 auto; + flex: 0 0 auto; + padding-right: 0.5rem; + padding-left: 0.5rem; +} + +.c2 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c3 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c1 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c5 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c4 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c6 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c7 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +@media only screen and (min-width:0em) { + .c0 { + -webkit-flex-basis: 50%; + -ms-flex-basis: 50%; + flex-basis: 50%; + max-width: 50%; + display: block; + } +} + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +.c0 { + box-sizing: border-box; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex: 0 1 auto; + -ms-flex: 0 1 auto; + flex: 0 1 auto; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-flex-wrap: wrap; + -ms-flex-wrap: wrap; + flex-wrap: wrap; + margin-right: -0.5rem; + margin-left: -0.5rem; + display: block; + height: 100%; + position: absolute; + top: 50%; + -webkit-transform: translateY(-50%); + -ms-transform: translateY(-50%); + transform: translateY(-50%); +} + +.c4 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c3 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +.c5 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c6 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c1 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + -webkit-box-pack: center; + -webkit-justify-content: center; + -ms-flex-pack: center; + justify-content: center; +} + + + $0.016 per hour + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 15.8 + GB RAM + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 8 + vCPUs + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + 4 + TB disk + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + +.c0 { + display: inline-block; + padding: 0 1.125rem; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-style: normal; + font-stretch: normal; + font-size: 0.875rem; + -webkit-box-pack: end; + -webkit-justify-content: flex-end; + -ms-flex-pack: end; + justify-content: flex-end; +} + + + SSD + +
      + .c1 { + font-size: 0.9375rem; + line-height: 1.5; + color: ; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 600; + display: -webkit-box; + display: -webkit-flex; + display: -ms-flexbox; + display: flex; + -webkit-flex-direction: row; + -ms-flex-direction: row; + flex-direction: row; + -webkit-box-pack: start; + -webkit-justify-content: flex-start; + -ms-flex-pack: start; + justify-content: flex-start; + -webkit-flex-grow: 2; + -ms-flex-grow: 2; + flex-grow: 2; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; + width: 100%; + padding: 0.75rem 1.125rem 0 1.125rem; +} + +.c0 { + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + -webkit-flex-grow: 1; + -ms-flex-grow: 1; + flex-grow: 1; + -webkit-flex-basis: 5.625rem; + -ms-flex-basis: 5.625rem; + flex-basis: 5.625rem; +} + +.c2 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + +
      + .c0 { + display: inline-block; + -webkit-flex-direction: column; + -ms-flex-direction: column; + flex-direction: column; + font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif; + font-weight: 400; + font-size: 0.8125rem; + font-weight: 500; + text-transform: uppercase; + color: rgba(73,73,73,0.5); +} + + + Compute Optimized + +
      +
      +
      +
      +
      +
      • +
    +`; diff --git a/packages/my-joyent/src/containers/packages/__tests__/index.spec.js b/packages/my-joyent/src/containers/packages/__tests__/index.spec.js new file mode 100644 index 00000000..05f7bd26 --- /dev/null +++ b/packages/my-joyent/src/containers/packages/__tests__/index.spec.js @@ -0,0 +1,23 @@ +/** + * @jest-environment jsdom + */ + +import React from 'react'; +import renderer from 'react-test-renderer'; +import 'jest-styled-components'; + +import PackagesHOC from '../'; +import { Router, Store } from '@mocks/'; + +it('renders without throwing', () => { + const tree = renderer + .create( + + + + + + ) + .toJSON(); + expect(tree).toMatchSnapshot(); +}); diff --git a/packages/my-joyent/src/containers/packages/index.js b/packages/my-joyent/src/containers/packages/index.js new file mode 100644 index 00000000..a6173196 --- /dev/null +++ b/packages/my-joyent/src/containers/packages/index.js @@ -0,0 +1,25 @@ +import React from 'react'; +import { connect } from 'react-redux'; +// import { graphql } from 'react-apollo'; +import { Packages } from '@components/packages'; +// import packagesQuery from '@graphql/packages.gql'; +import data from '../../data/packages'; + +const PackagesHOC = ({ packages, filters }) => ( + +); + +// const PackagesHOCWithData = graphql(packagesQuery, { +// props: ({ data: { packages = [], loading = true } }) => ({ +// packages, +// loading +// }) +// })(PackagesHOC); + +const mapStateToProps = state => { + return { + filters: state.filters + }; +}; + +export default connect(mapStateToProps)(PackagesHOC); diff --git a/packages/my-joyent/src/data/packages.json b/packages/my-joyent/src/data/packages.json new file mode 100644 index 00000000..ab79dc18 --- /dev/null +++ b/packages/my-joyent/src/data/packages.json @@ -0,0 +1,146 @@ +[ + { + "name": "High CPU 0.25", + "vcpus": 0.25, + "memory": 0.256, + "disk": 10, + "group": "Compute Optimized", + "price": "0.016" + }, + { + "name": "High CPU 0.75", + "vcpus": 0.5, + "memory": 0.768, + "disk": 25, + "group": "Compute Optimized", + "price": "0.033" + }, + { + "name": "High CPU 1.75", + "vcpus": 1, + "memory": 1.8, + "disk": 50, + "group": "Compute Optimized", + "price": "0.066" + }, + { + "name": "High CPU 3.75", + "vcpus": 2, + "memory": 3.8, + "disk": 100, + "group": "Compute Optimized", + "price": "0.131" + }, + { + "name": "High CPU 7.75", + "vcpus": 4, + "memory": 7.8, + "disk": 200, + "group": "Compute Optimized", + "price": "0.263" + }, + { + "name": "High CPU 15.75", + "vcpus": 8, + "memory": 15.8, + "disk": 400, + "group": "Compute Optimized", + "price": "0.525" + }, + { + "name": "General 3.75", + "vcpus": 1, + "memory": 3.8, + "disk": 50, + "group": "General Purpose", + "price": "0.084" + }, + { + "name": "General 7.75", + "vcpus": 2, + "memory": 7.8, + "disk": 100, + "group": "General Purpose", + "price": "0.166" + }, + { + "name": "General 15.75", + "vcpus": 4, + "memory": 15.8, + "disk": 200, + "group": "General Purpose", + "price": "0.333" + }, + { + "name": "General 31.75", + "vcpus": 8, + "memory": 31.8, + "disk": 400, + "group": "General Purpose", + "price": "0.665" + }, + { + "name": "High RAM 15.75", + "vcpus": 2, + "memory": 15.8, + "disk": 100, + "group": "Memory Optimized", + "price": "0.259" + }, + { + "name": "High RAM 31.75", + "vcpus": 4, + "memory": 31.8, + "disk": 200, + "group": "Memory Optimized", + "price": "0.52" + }, + { + "name": "High RAM 63.75", + "vcpus": 8, + "memory": 63.8, + "disk": 400, + "group": "Memory Optimized", + "price": "1.039" + }, + { + "name": "Fast Disk 31.75", + "vcpus": 4, + "memory": 31.8, + "disk": 800, + "group": "Storage Optimized", + "price": "1.066" + }, + { + "name": "Fast Disk 63.75", + "vcpus": 8, + "memory": 63.8, + "disk": 1600, + "group": "Storage Optimized", + "price": "2.31" + }, + { + "name": "Big Disk 15.75", + "vcpus": 2, + "memory": 15.8, + "disk": 1200, + "group": "Storage Optimized", + "price": "0.413" + }, + { + "name": "Big Disk 31.75", + "vcpus": 4, + "memory": 31.8, + "disk": 2400, + "group": "Storage Optimized", + "price": "0.825" + }, + { + "name": "Big Disk 63.75", + "vcpus": 8, + "memory": 63.8, + "disk": 4900, + "group": "Storage Optimized", + "price": "1.75" + } +] diff --git a/packages/my-joyent/src/graphql/data-centers.gql b/packages/my-joyent/src/graphql/data-centers.gql new file mode 100644 index 00000000..20667c41 --- /dev/null +++ b/packages/my-joyent/src/graphql/data-centers.gql @@ -0,0 +1,5 @@ +query Portal { + datacenters { + name + } +} diff --git a/packages/my-joyent/src/graphql/packages.gql b/packages/my-joyent/src/graphql/packages.gql new file mode 100644 index 00000000..81a96797 --- /dev/null +++ b/packages/my-joyent/src/graphql/packages.gql @@ -0,0 +1,10 @@ +query Portal { + packages { + name + vcpus + memory + disk + version + group + } +} diff --git a/packages/my-joyent/src/state/actions.js b/packages/my-joyent/src/state/actions.js new file mode 100644 index 00000000..c72df6e7 --- /dev/null +++ b/packages/my-joyent/src/state/actions.js @@ -0,0 +1,8 @@ +const changeFilters = filters => { + return { + type: 'CHANGE_FILTERS', + filters + }; +}; + +export default changeFilters; diff --git a/packages/my-joyent/src/state/filterReducer.js b/packages/my-joyent/src/state/filterReducer.js new file mode 100644 index 00000000..9904272c --- /dev/null +++ b/packages/my-joyent/src/state/filterReducer.js @@ -0,0 +1,13 @@ +const filterReducer = (state = [], action) => { + switch (action.type) { + case 'CHANGE_FILTERS': + return { + ...state, + ...action.filters + }; + default: + return state; + } +}; + +export default filterReducer; diff --git a/packages/my-joyent/src/state/state.js b/packages/my-joyent/src/state/state.js index 4110b168..ba82b7b0 100644 --- a/packages/my-joyent/src/state/state.js +++ b/packages/my-joyent/src/state/state.js @@ -1,3 +1,10 @@ -const state = {}; +const state = { + filters: { + cpu: { min: 0.25, max: 8 }, + cost: { min: 0.016, max: 2.131 }, + ram: { min: 0.256, max: 63.8 }, + disk: { min: 0.01, max: 4.9 } + } +}; export default state; diff --git a/packages/my-joyent/src/state/store.js b/packages/my-joyent/src/state/store.js index 067be2ae..8a354ae8 100644 --- a/packages/my-joyent/src/state/store.js +++ b/packages/my-joyent/src/state/store.js @@ -1,6 +1,7 @@ import { createStore, combineReducers, applyMiddleware, compose } from 'redux'; import { reducer as formReducer } from 'redux-form'; import { ApolloClient, createNetworkInterface } from 'react-apollo'; +import filterReducer from './filterReducer'; import state from './state'; const GLOBAL = @@ -37,14 +38,15 @@ export const client = new ApolloClient({ return `${o.__typename}:${id}`; }, networkInterface: createNetworkInterface({ - uri: `${GQL_PROTOCOL}://${GQL_HOSTNAME}:${GQL_PORT}/api/graphql` + uri: `${GQL_PROTOCOL}://${GQL_HOSTNAME}:${GQL_PORT}/graphql` }) }); export const store = createStore( combineReducers({ apollo: client.reducer(), - form: formReducer + form: formReducer, + filters: filterReducer }), state, // Initial state compose( diff --git a/packages/my-joyent/test/mocks/filters.js b/packages/my-joyent/test/mocks/filters.js new file mode 100644 index 00000000..26a8eebb --- /dev/null +++ b/packages/my-joyent/test/mocks/filters.js @@ -0,0 +1,18 @@ +export default { + cpu: { + min: 0.25, + max: 3.25 + }, + cost: { + min: 0.016, + max: 0.525 + }, + ram: { + min: 0.256, + max: 50.688 + }, + disk: { + min: 0.01, + max: 107.26 + } +}; diff --git a/packages/my-joyent/test/mocks/index.js b/packages/my-joyent/test/mocks/index.js index cf9bab85..d6573ba2 100644 --- a/packages/my-joyent/test/mocks/index.js +++ b/packages/my-joyent/test/mocks/index.js @@ -1,3 +1,5 @@ export { default as Router } from './router'; export { default as Store } from './store'; +export { default as PackagesMock } from './packages'; +export { default as FiltersMock } from './filters'; export { default as Theme } from './theme'; diff --git a/packages/my-joyent/test/mocks/packages.js b/packages/my-joyent/test/mocks/packages.js new file mode 100644 index 00000000..9e26eec4 --- /dev/null +++ b/packages/my-joyent/test/mocks/packages.js @@ -0,0 +1,50 @@ +export default [ + { + name: 'High CPU 0.25', + vcpus: 0.25, + memory: 0.256, + disk: 10, + group: 'Compute Optimized', + price: '0.016' + }, + { + name: 'High CPU 0.75', + vcpus: 0.5, + memory: 0.768, + disk: 25, + group: 'Compute Optimized', + price: '0.033' + }, + { + name: 'High CPU 1.75', + vcpus: 1, + memory: 1.8, + disk: 50, + group: 'Compute Optimized', + price: '0.066' + }, + { + name: 'High CPU 3.75', + vcpus: 2, + memory: 3.8, + disk: 100, + group: 'Compute Optimized', + price: '0.131' + }, + { + name: 'High CPU 7.75', + vcpus: 4, + memory: 7.8, + disk: 200, + group: 'Compute Optimized', + price: '0.263' + }, + { + name: 'High CPU 15.75', + vcpus: 8, + memory: 15.8, + disk: 400, + group: 'Compute Optimized', + price: '0.525' + } +]; diff --git a/packages/ui-toolkit/.eslintrc b/packages/ui-toolkit/.eslintrc index e7ea524f..f6ae023e 100644 --- a/packages/ui-toolkit/.eslintrc +++ b/packages/ui-toolkit/.eslintrc @@ -1,6 +1,7 @@ { "extends": "joyent-portal", "rules": { - "new-cap": 0 + "new-cap": 0, + "jsx-a11y/href-no-hash": 0 } } diff --git a/packages/ui-toolkit/.yarnclean b/packages/ui-toolkit/.yarnclean new file mode 100644 index 00000000..e69de29b diff --git a/packages/ui-toolkit/package.json b/packages/ui-toolkit/package.json index d6cc9fb8..d12e7c70 100644 --- a/packages/ui-toolkit/package.json +++ b/packages/ui-toolkit/package.json @@ -10,16 +10,22 @@ "lint:css": "echo 0", "lint-ci:css": "echo 0", "lint:js": "eslint . --fix", - "lint-ci:js": "eslint . --format junit --output-file $CIRCLE_TEST_REPORTS/lint/ui-toolkit.xml", + "lint-ci:js": + "eslint . --format junit --output-file $CIRCLE_TEST_REPORTS/lint/ui-toolkit.xml", "lint": "redrun -s lint:*", "lint-ci": "redrun -s lint-ci:*", "test": "echo 0", "test-ci": "echo 0", - "copy-fonts": "rm -rf dist; mkdir -p dist/es/typography; mkdir -p dist/umd/typography; cp -r src/typography/libre-franklin dist/es/typography; cp -r src/typography/libre-franklin dist/umd/typography", - "compile-watch:es": "NODE_ENV=development babel src --out-dir dist/es --source-maps inline --watch", - "compile:es": "NODE_ENV=development babel src --out-dir dist/es --source-maps inline", - "compile:umd": "cross-env NODE_ENV=test babel src --out-dir dist/umd --source-maps inline", - "compile-watch:umd": "cross-env NODE_ENV=test babel src --out-dir dist/umd --source-maps inline --watch", + "copy-fonts": + "rm -rf dist; mkdir -p dist/es/typography; mkdir -p dist/umd/typography; cp -r src/typography/libre-franklin dist/es/typography; cp -r src/typography/libre-franklin dist/umd/typography", + "compile-watch:es": + "NODE_ENV=development babel src --out-dir dist/es --source-maps inline --watch", + "compile:es": + "NODE_ENV=development babel src --out-dir dist/es --source-maps inline", + "compile:umd": + "cross-env NODE_ENV=test babel src --out-dir dist/umd --source-maps inline", + "compile-watch:umd": + "cross-env NODE_ENV=test babel src --out-dir dist/umd --source-maps inline --watch", "compile": "redrun -p compile:*", "watch": "redrun copy-fonts && redrun -p compile-watch:*", "styleguide:build": "cross-env NODE_ENV=production styleguidist build", @@ -47,6 +53,7 @@ "polished": "^1.6.1", "prop-types": "^15.5.10", "react-broadcast": "^0.1.2", + "react-input-range": "^1.2.1", "react-styled-flexboxgrid": "^2.0.3", "redrun": "^5.9.16", "reduce-css-calc": "^2.0.5", @@ -81,7 +88,8 @@ "stylelint": "^8.0.0", "stylelint-config-primer": "^2.0.1", "stylelint-config-standard": "^17.0.0", - "stylelint-processor-styled-components": "styled-components/stylelint-processor-styled-components#2a33b5f", + "stylelint-processor-styled-components": + "styled-components/stylelint-processor-styled-components#2a33b5f", "svgo": "^0.7.2", "tinycolor2": "^1.4.1", "title-case": "^2.1.1", diff --git a/packages/ui-toolkit/src/card/card.js b/packages/ui-toolkit/src/card/card.js index e731c522..1de0849c 100644 --- a/packages/ui-toolkit/src/card/card.js +++ b/packages/ui-toolkit/src/card/card.js @@ -35,6 +35,16 @@ const StyledCard = Row.extend` box-shadow: none; `}; + ${is('transparent')` + border-radius: ${remcalc(4)} + background: + border: 1px solid ${props => props.theme.grey}; + background: ${props => props.theme.background}; + box-shadow: 0px 2px 0px rgba(0, 0, 0, 0.05); + min-height: ${remcalc(185)}; + min-width: 200px; + `}; + ${is('stacked')` ${paperEffect} `}; @@ -85,7 +95,8 @@ Card.propTypes = { collapsed: PropTypes.bool, headed: PropTypes.bool, flat: PropTypes.bool, - stacked: PropTypes.bool + stacked: PropTypes.bool, + transparent: PropTypes.bool }; export default Baseline(Card); diff --git a/packages/ui-toolkit/src/card/footer.js b/packages/ui-toolkit/src/card/footer.js new file mode 100644 index 00000000..e7b711e2 --- /dev/null +++ b/packages/ui-toolkit/src/card/footer.js @@ -0,0 +1,44 @@ +import { Subscriber } from 'react-broadcast'; +import styled from 'styled-components'; +import Baseline from '../baseline'; +import typography from '../typography'; +import remcalc from 'remcalc'; +import PropTypes from 'prop-types'; +import Title from './title'; +import React from 'react'; + +const StyledTitle = Title.extend` + ${typography.fontFamily}; + ${typography.normal}; + + flex-grow: 1; + flex-basis: ${remcalc(90)}; +`; + +const Span = styled.span` + display: inline-block; + flex-direction: column; + + ${typography.fontFamily}; + ${typography.normal}; + font-size: ${remcalc(13)}; + font-weight: 500; + text-transform: uppercase; + + color: rgba(73, 73, 73, 0.5); +`; +const Footer = ({ children }) => { + const render = () => ( + + {children} + + ); + + return {render}; +}; + +Footer.propTypes = { + children: PropTypes.node +}; + +export default Baseline(Footer); diff --git a/packages/ui-toolkit/src/card/index.js b/packages/ui-toolkit/src/card/index.js index 2ddc34b4..31c71459 100644 --- a/packages/ui-toolkit/src/card/index.js +++ b/packages/ui-toolkit/src/card/index.js @@ -9,3 +9,4 @@ export { default as CardSubTitle } from './subtitle.js'; export { default as CardTitle } from './title.js'; export { default as CardView } from './view.js'; export { default as CardInfo } from './info.js'; +export { default as CardFooter } from './footer.js'; diff --git a/packages/ui-toolkit/src/card/usage.md b/packages/ui-toolkit/src/card/usage.md index 061b7648..60b5bb4a 100644 --- a/packages/ui-toolkit/src/card/usage.md +++ b/packages/ui-toolkit/src/card/usage.md @@ -52,6 +52,36 @@ const { ``` +#### `transparent` +``` +const { + CardDescription, + CardHeader, + CardMeta, + CardOptions, + CardOutlet, + CardSubTitle, + CardTitle, + CardView, + CardGroupView, + CardFooter +} = require('./'); + + + + + $0.016 per hour + 0.256 GB RAM + 0.25 vCPUs + 0.01 TB disk + SSD + + Compute Optimise + + + +``` + #### `headed` ``` diff --git a/packages/ui-toolkit/src/index.js b/packages/ui-toolkit/src/index.js index d0966930..a6df6e0c 100644 --- a/packages/ui-toolkit/src/index.js +++ b/packages/ui-toolkit/src/index.js @@ -27,6 +27,7 @@ export { export { Dropdown } from './dropdown'; export { default as StatusLoader } from './status-loader'; export { default as Message } from './message'; +export { default as Slider } from './slider'; export { default as Progressbar, @@ -69,7 +70,8 @@ export { CardSubTitle, CardTitle, CardView, - CardInfo + CardInfo, + CardFooter } from './card'; export { diff --git a/packages/ui-toolkit/src/message/index.js b/packages/ui-toolkit/src/message/index.js index f11d07d5..96816a80 100644 --- a/packages/ui-toolkit/src/message/index.js +++ b/packages/ui-toolkit/src/message/index.js @@ -72,7 +72,7 @@ const Message = ({ title, message, onCloseClick, children, ...type }) => { Message.propTypes = { title: PropTypes.string, - message: PropTypes.string.isRequired, + message: PropTypes.string, onCloseClick: PropTypes.func, error: PropTypes.boolean, warning: PropTypes.boolean, diff --git a/packages/ui-toolkit/src/slider/Readme.md b/packages/ui-toolkit/src/slider/Readme.md new file mode 100644 index 00000000..643f7110 --- /dev/null +++ b/packages/ui-toolkit/src/slider/Readme.md @@ -0,0 +1,25 @@ +### Double Range Slider + +``` + console.log(value)} + onChange={value => console.log(value)} + >vCPUs +``` + +### Normal Slider + +``` + console.log(value)} + onChange={value => console.log(value)} + >Price +``` diff --git a/packages/ui-toolkit/src/slider/index.js b/packages/ui-toolkit/src/slider/index.js new file mode 100644 index 00000000..e919f5ef --- /dev/null +++ b/packages/ui-toolkit/src/slider/index.js @@ -0,0 +1,147 @@ +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import styled from 'styled-components'; +import InputRange from 'react-input-range'; +import remcalc from 'remcalc'; + +import theme from '../theme'; +import FormLabel from '../form/label'; +import { + sliderStyles, + disabledStyles, + trackStyles, + activeStyles, + rangeStyles +} from './inputStyles'; + +const SliderStyled = styled.div` + .input-range { + ${rangeStyles}; + } + + .slider { + ${sliderStyles}; + } + .disabled { + ${disabledStyles}; + } + + .min, + .max { + display: none; + } + + .value { + top: ${remcalc(8)}; + position: absolute; + + .label-container { + font-weight: 600; + font-size: ${remcalc(10)}; + color: ${theme.secondary}; + left: -50%; + position: relative; + } + } + + .track { + ${trackStyles}; + } + + .active-track { + ${activeStyles}; + } +`; + +const Label = styled(FormLabel)` + margin-bottom: ${remcalc(10)}; + margin-top: ${remcalc(12)}; +`; + +class Slider extends Component { + constructor(props) { + super(props); + + this.state = { + minValue: this.props.minValue, + maxValue: this.props.maxValue, + value: this.props.value + }; + + this.changeValue = this.changeValue.bind(this); + } + + changeValue(value) { + this.setState({ value }, () => this.props.onChange(value)); + } + + render() { + const { minValue, maxValue, value } = this.state; + const { children, ...rest } = this.props; + return ( + + + this.changeValue(value)} + /> + + ); + } +} + +Slider.propTypes = { + minValue: PropTypes.number, + maxValue: PropTypes.number, + step: PropTypes.number, + value: PropTypes.oneOfType([PropTypes.number, PropTypes.shape()]), + onChangeComplete: PropTypes.func, + onChange: PropTypes.func, + formatLabel: PropTypes.func, + ariaLabelledby: PropTypes.string, + ariaControls: PropTypes.string, + classNames: PropTypes.shape({ + activeTrack: PropTypes.string, + disabledInputRange: PropTypes.string, + inputRange: PropTypes.string, + labelContainer: PropTypes.string, + maxLabel: PropTypes.string, + minLabel: PropTypes.string, + slider: PropTypes.string, + sliderContainer: PropTypes.string, + track: PropTypes.string, + valueLabel: PropTypes.string + }), + disabled: PropTypes.bool, + draggableTrack: PropTypes.bool, + onChangeStart: PropTypes.func, + children: PropTypes.node +}; + +Slider.defaultProps = { + onChangeComplete: () => {}, + onChange: () => {}, + formatLabel: value => + (value.toString().split('.')[1] || []).length > 3 + ? Math.round(value).toFixed(3) + : value, + onChangeStart: () => {}, + step: 1, + classNames: { + activeTrack: 'active-track', + disabledInputRange: 'disabled-range', + inputRange: 'input-range', + labelContainer: 'label-container', + maxLabel: 'max', + minLabel: 'min', + sliderContainer: 'slider-container', + track: 'track', + valueLabel: 'value', + slider: 'slider' + } +}; + +export default Slider; diff --git a/packages/ui-toolkit/src/slider/inputStyles.js b/packages/ui-toolkit/src/slider/inputStyles.js new file mode 100644 index 00000000..32c4a553 --- /dev/null +++ b/packages/ui-toolkit/src/slider/inputStyles.js @@ -0,0 +1,61 @@ +import { css } from 'styled-components'; +import remcalc from 'remcalc'; + +import theme from '../theme'; + +export const sliderStyles = css` + appearance: none; + background: ${theme.white}; + border: 2px solid ${theme.greyLight}; + border-radius: 50%; + cursor: pointer; + display: block; + height: ${remcalc(14)}; + width: ${remcalc(14)}; + transform: translateY(-50%) translateX(-50%); + outline: none; + position: absolute; + top: 50%; + margin-top: ${remcalc(2)}; + + &::active { + transform: scale(1.3); + } + + &::focus { + box-shadow: 0 0 0 5px rgba(63, 81, 181, 0.2); + } +`; + +export const disabledStyles = css` + .track { + background: ${theme.grey}; + } + .slider { + background: ${theme.greyDark}; + border: 1px solid ${theme.greyDark}; + box-shadow: none; + transform: none; + } +`; + +export const trackStyles = css` + background: ${theme.grey}; + cursor: pointer; + display: block; + height: ${remcalc(4)}; + position: relative; +`; + +export const activeStyles = css` + background: ${theme.blue}; + height: 100%; + position: absolute; +`; + +export const rangeStyles = css` + position: relative; + width: calc(100% - 18px); + margin: auto; + min-height: ${remcalc(10)}; +`; diff --git a/packages/ui-toolkit/src/theme/index.js b/packages/ui-toolkit/src/theme/index.js index 3a422be9..21510e2e 100644 --- a/packages/ui-toolkit/src/theme/index.js +++ b/packages/ui-toolkit/src/theme/index.js @@ -50,6 +50,8 @@ export const base = { ...tertiary, text: '#494949', // used grey: '#D8D8D8', // used + greyDark: '#CCC', + greyLight: '#bdbdbd', // used disabled: '#FAFAFA', // used background: '#FAFAFA', // used green: '#00AF66', // used @@ -57,7 +59,8 @@ export const base = { orange: '#E38200', // used orangeDark: '#CB7400', // not used - BORDER red: '#DA4B42', // used - redDark: '#CD251B' // not used - BORDER + redDark: '#CD251B', // not used - BORDER + blue: '#364ACD' }; /** ********************************** HEADER ********************************** */ diff --git a/packages/ui-toolkit/styleguide.config.js b/packages/ui-toolkit/styleguide.config.js index db8354f7..d1f13bae 100644 --- a/packages/ui-toolkit/styleguide.config.js +++ b/packages/ui-toolkit/styleguide.config.js @@ -70,7 +70,8 @@ module.exports = snapguidist({ 'src/tooltip/tooltip.js', 'src/close-button/index.js', 'src/icon-button/index.js', - 'src/message/index.js' + 'src/message/index.js', + 'src/slider/index.js' ] }, { diff --git a/yarn.lock b/yarn.lock index d002c46e..1d49e293 100644 --- a/yarn.lock +++ b/yarn.lock @@ -684,6 +684,10 @@ auto-bind@^1.1.0: version "1.1.0" resolved "https://registry.yarnpkg.com/auto-bind/-/auto-bind-1.1.0.tgz#93b864dc7ee01a326281775d5c75ca0a751e5961" +autobind-decorator@^1.3.4: + version "1.4.3" + resolved "https://registry.yarnpkg.com/autobind-decorator/-/autobind-decorator-1.4.3.tgz#4c96ffa77b10622ede24f110f5dbbf56691417d1" + automated-readability@^1.0.0: version "1.0.1" resolved "https://registry.yarnpkg.com/automated-readability/-/automated-readability-1.0.1.tgz#5cf9111efcead6fe13b8c954d425b0068d59949d" @@ -2960,6 +2964,13 @@ cors@2.8.1: dependencies: vary "^1" +cors@^2.8.4: + version "2.8.4" + resolved "https://registry.yarnpkg.com/cors/-/cors-2.8.4.tgz#2bd381f2eb201020105cd50ea59da63090694686" + dependencies: + object-assign "^4" + vary "^1" + cosmiconfig@^2.1.0, cosmiconfig@^2.1.1, cosmiconfig@^2.1.3: version "2.2.2" resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-2.2.2.tgz#6173cebd56fac042c1f4390edf7af6c07c7cb892" @@ -8565,7 +8576,7 @@ oauth-sign@~0.8.1: version "0.8.2" resolved "https://registry.yarnpkg.com/oauth-sign/-/oauth-sign-0.8.2.tgz#46a6ab7f0aead8deae9ec0565780b7d4efeb9d43" -object-assign@4.1.1, object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1: +object-assign@4.1.1, object-assign@^4, object-assign@^4.0.1, object-assign@^4.1.0, object-assign@^4.1.1: version "4.1.1" resolved "https://registry.yarnpkg.com/object-assign/-/object-assign-4.1.1.tgz#2109adc7965887cfc05cbbd442cac8bfbb360863" @@ -9934,6 +9945,13 @@ react-icons@^2.2.5: dependencies: react-icon-base "2.0.7" +react-input-range@^1.2.1: + version "1.2.1" + resolved "https://registry.yarnpkg.com/react-input-range/-/react-input-range-1.2.1.tgz#10ff5fc1ec6ab9d95e15cddebe6f6879db2c3386" + dependencies: + autobind-decorator "^1.3.4" + prop-types "^15.5.8" + react-redux@^5.0.6: version "5.0.6" resolved "https://registry.yarnpkg.com/react-redux/-/react-redux-5.0.6.tgz#23ed3a4f986359d68b5212eaaa681e60d6574946"