diff --git a/website/assets/images/homepage-all-platforms-welcome-320-249@2x.png b/website/assets/images/device-management-all-platforms-welcome-320-249@2x.png
similarity index 100%
rename from website/assets/images/homepage-all-platforms-welcome-320-249@2x.png
rename to website/assets/images/device-management-all-platforms-welcome-320-249@2x.png
diff --git a/website/assets/images/homepage-bento-logos-320x295@2x.png b/website/assets/images/device-management-bento-logos-320x295@2x.png
similarity index 100%
rename from website/assets/images/homepage-bento-logos-320x295@2x.png
rename to website/assets/images/device-management-bento-logos-320x295@2x.png
diff --git a/website/assets/images/homepage-realtime-visibility-320x294@2x.png b/website/assets/images/device-management-realtime-visibility-320x294@2x.png
similarity index 100%
rename from website/assets/images/homepage-realtime-visibility-320x294@2x.png
rename to website/assets/images/device-management-realtime-visibility-320x294@2x.png
diff --git a/website/assets/images/homepage-fleet-ui-536x389@2x.png b/website/assets/images/homepage-fleet-ui-536x389@2x.png
new file mode 100644
index 0000000000..923896e087
Binary files /dev/null and b/website/assets/images/homepage-fleet-ui-536x389@2x.png differ
diff --git a/website/assets/images/homepage-hero-background-1921x555@2x.png b/website/assets/images/homepage-hero-background-1921x555@2x.png
new file mode 100644
index 0000000000..763e548de0
Binary files /dev/null and b/website/assets/images/homepage-hero-background-1921x555@2x.png differ
diff --git a/website/assets/images/homepage-hero-gitops-547x302@2x.png b/website/assets/images/homepage-hero-gitops-547x302@2x.png
deleted file mode 100644
index 97e92cc649..0000000000
Binary files a/website/assets/images/homepage-hero-gitops-547x302@2x.png and /dev/null differ
diff --git a/website/assets/images/homepage-hero-ribbon.svg b/website/assets/images/homepage-hero-ribbon.svg
deleted file mode 100644
index dab431c87f..0000000000
--- a/website/assets/images/homepage-hero-ribbon.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-
-
diff --git a/website/assets/images/homepage-icon-deploy-64x64@2x.png b/website/assets/images/homepage-icon-deploy-64x64@2x.png
new file mode 100644
index 0000000000..8592235655
Binary files /dev/null and b/website/assets/images/homepage-icon-deploy-64x64@2x.png differ
diff --git a/website/assets/images/homepage-icon-documentation-64x64@2x.png b/website/assets/images/homepage-icon-documentation-64x64@2x.png
new file mode 100644
index 0000000000..6dba184ff6
Binary files /dev/null and b/website/assets/images/homepage-icon-documentation-64x64@2x.png differ
diff --git a/website/assets/images/homepage-icon-explore-data-64x64@2x.png b/website/assets/images/homepage-icon-explore-data-64x64@2x.png
new file mode 100644
index 0000000000..6f94228ce5
Binary files /dev/null and b/website/assets/images/homepage-icon-explore-data-64x64@2x.png differ
diff --git a/website/assets/images/homepage-icon-free-48x64@2x.png b/website/assets/images/homepage-icon-free-48x64@2x.png
new file mode 100644
index 0000000000..9e2f228f28
Binary files /dev/null and b/website/assets/images/homepage-icon-free-48x64@2x.png differ
diff --git a/website/assets/images/homepage-icon-good-neighbors-64x64@2x.png b/website/assets/images/homepage-icon-good-neighbors-64x64@2x.png
new file mode 100644
index 0000000000..94e7beb800
Binary files /dev/null and b/website/assets/images/homepage-icon-good-neighbors-64x64@2x.png differ
diff --git a/website/assets/images/homepage-icon-modular-64x64@2x.png b/website/assets/images/homepage-icon-modular-64x64@2x.png
new file mode 100644
index 0000000000..ebfc17dce5
Binary files /dev/null and b/website/assets/images/homepage-icon-modular-64x64@2x.png differ
diff --git a/website/assets/images/homepage-icon-one-agent-64x64@2x.png b/website/assets/images/homepage-icon-one-agent-64x64@2x.png
new file mode 100644
index 0000000000..ca6f2fd944
Binary files /dev/null and b/website/assets/images/homepage-icon-one-agent-64x64@2x.png differ
diff --git a/website/assets/images/homepage-icon-openness-80x64@2x.png b/website/assets/images/homepage-icon-openness-80x64@2x.png
new file mode 100644
index 0000000000..7b3bb47465
Binary files /dev/null and b/website/assets/images/homepage-icon-openness-80x64@2x.png differ
diff --git a/website/assets/images/homepage-icon-play-well-64x64@2x.png b/website/assets/images/homepage-icon-play-well-64x64@2x.png
new file mode 100644
index 0000000000..1b41e6fda5
Binary files /dev/null and b/website/assets/images/homepage-icon-play-well-64x64@2x.png differ
diff --git a/website/assets/images/homepage-icon-transparency-54x64@2x.png b/website/assets/images/homepage-icon-transparency-54x64@2x.png
new file mode 100644
index 0000000000..59c6f2bd11
Binary files /dev/null and b/website/assets/images/homepage-icon-transparency-54x64@2x.png differ
diff --git a/website/assets/images/homepage-osquery-management-543x371@2x.png b/website/assets/images/homepage-osquery-management-543x371@2x.png
new file mode 100644
index 0000000000..bd6bae766b
Binary files /dev/null and b/website/assets/images/homepage-osquery-management-543x371@2x.png differ
diff --git a/website/assets/images/homepage-platform-aws-54x48@2x.png b/website/assets/images/homepage-platform-aws-54x48@2x.png
new file mode 100644
index 0000000000..cd861ffc30
Binary files /dev/null and b/website/assets/images/homepage-platform-aws-54x48@2x.png differ
diff --git a/website/assets/images/homepage-platform-azure-24x24@2x.png b/website/assets/images/homepage-platform-azure-24x24@2x.png
new file mode 100644
index 0000000000..716c1b59c1
Binary files /dev/null and b/website/assets/images/homepage-platform-azure-24x24@2x.png differ
diff --git a/website/assets/images/homepage-platform-chromeos-48x48@2x.png b/website/assets/images/homepage-platform-chromeos-48x48@2x.png
new file mode 100644
index 0000000000..ebc3c11a7b
Binary files /dev/null and b/website/assets/images/homepage-platform-chromeos-48x48@2x.png differ
diff --git a/website/assets/images/homepage-platform-datacenters-48x48@2x.png b/website/assets/images/homepage-platform-datacenters-48x48@2x.png
new file mode 100644
index 0000000000..94b1586df2
Binary files /dev/null and b/website/assets/images/homepage-platform-datacenters-48x48@2x.png differ
diff --git a/website/assets/images/homepage-platform-docker-48x48@2x.png b/website/assets/images/homepage-platform-docker-48x48@2x.png
new file mode 100644
index 0000000000..897647b8fc
Binary files /dev/null and b/website/assets/images/homepage-platform-docker-48x48@2x.png differ
diff --git a/website/assets/images/homepage-platform-google-cloud-48x48@2x.png b/website/assets/images/homepage-platform-google-cloud-48x48@2x.png
new file mode 100644
index 0000000000..2cdce3b878
Binary files /dev/null and b/website/assets/images/homepage-platform-google-cloud-48x48@2x.png differ
diff --git a/website/assets/images/homepage-platform-iot-38x48@2x.png b/website/assets/images/homepage-platform-iot-38x48@2x.png
new file mode 100644
index 0000000000..7ecfa02d1a
Binary files /dev/null and b/website/assets/images/homepage-platform-iot-38x48@2x.png differ
diff --git a/website/assets/images/homepage-platform-linux-41x48@2x.png b/website/assets/images/homepage-platform-linux-41x48@2x.png
new file mode 100644
index 0000000000..2e8075e4e9
Binary files /dev/null and b/website/assets/images/homepage-platform-linux-41x48@2x.png differ
diff --git a/website/assets/images/homepage-platform-macos-42x48@2x.png b/website/assets/images/homepage-platform-macos-42x48@2x.png
new file mode 100644
index 0000000000..1a640a5417
Binary files /dev/null and b/website/assets/images/homepage-platform-macos-42x48@2x.png differ
diff --git a/website/assets/images/homepage-platform-windows-40x48@2x.png b/website/assets/images/homepage-platform-windows-40x48@2x.png
new file mode 100644
index 0000000000..cd8740ef73
Binary files /dev/null and b/website/assets/images/homepage-platform-windows-40x48@2x.png differ
diff --git a/website/assets/images/homepage-report-cta-background.svg b/website/assets/images/homepage-report-cta-background.svg
deleted file mode 100644
index 7d0a05d4f3..0000000000
--- a/website/assets/images/homepage-report-cta-background.svg
+++ /dev/null
@@ -1,19 +0,0 @@
-
-
-
-
-
-
-
-
-
-
diff --git a/website/assets/images/homepage-security-compliance-520x337@2x.png b/website/assets/images/homepage-security-compliance-520x337@2x.png
new file mode 100644
index 0000000000..1c300395c9
Binary files /dev/null and b/website/assets/images/homepage-security-compliance-520x337@2x.png differ
diff --git a/website/assets/images/homepage-vulnerability-management-530x458@2x.png b/website/assets/images/homepage-vulnerability-management-530x458@2x.png
new file mode 100644
index 0000000000..259b688f9b
Binary files /dev/null and b/website/assets/images/homepage-vulnerability-management-530x458@2x.png differ
diff --git a/website/assets/images/logo-segment-139x30@2x.png b/website/assets/images/logo-segment-139x30@2x.png
new file mode 100644
index 0000000000..eab641a1db
Binary files /dev/null and b/website/assets/images/logo-segment-139x30@2x.png differ
diff --git a/website/assets/images/logo-snowflake-167x40@2x.png b/website/assets/images/logo-snowflake-167x40@2x.png
new file mode 100644
index 0000000000..87437a988a
Binary files /dev/null and b/website/assets/images/logo-snowflake-167x40@2x.png differ
diff --git a/website/assets/images/logo-uber-dark-84x30@2x.png b/website/assets/images/logo-uber-dark-84x30@2x.png
new file mode 100644
index 0000000000..5c5b5c04ec
Binary files /dev/null and b/website/assets/images/logo-uber-dark-84x30@2x.png differ
diff --git a/website/assets/images/logo-wayfair-color-147x32@2x.png b/website/assets/images/logo-wayfair-color-147x32@2x.png
new file mode 100644
index 0000000000..c534782c22
Binary files /dev/null and b/website/assets/images/logo-wayfair-color-147x32@2x.png differ
diff --git a/website/assets/js/pages/fleet-mdm.page.js b/website/assets/js/pages/fleet-mdm.page.js
index 6d626c7d55..2d8559e1d1 100644
--- a/website/assets/js/pages/fleet-mdm.page.js
+++ b/website/assets/js/pages/fleet-mdm.page.js
@@ -3,26 +3,7 @@ parasails.registerPage('device-management', {
// ║║║║║ ║ ║╠═╣║ ╚═╗ ║ ╠═╣ ║ ║╣
// ╩╝╚╝╩ ╩ ╩╩ ╩╩═╝ ╚═╝ ╩ ╩ ╩ ╩ ╚═╝
data: {
- formData: { /* … */ },
- // For tracking client-side validation errors in our form.
- // > Has property set to `true` for each invalid property in `formData`.
- formErrors: { /* … */ },
-
- // Form rules
- formRules: {
- fullName: {required: true },
- emailAddress: {required: true, isEmail: true},
- jobTitle: {required: true },
- numberOfHosts: {required: true },
- },
- cloudError: '',
- // Syncing / loading state
- syncing: false,
- showSignupFormSuccess: false,
- // Modal
-
- modal: '',
},
// ╦ ╦╔═╗╔═╗╔═╗╦ ╦╔═╗╦ ╔═╗
@@ -39,28 +20,10 @@ parasails.registerPage('device-management', {
// ║║║║ ║ ║╣ ╠╦╝╠═╣║ ║ ║║ ║║║║╚═╗
// ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝
methods: {
-
- clickOpenSignupModal: function() {
- this.modal = 'beta-signup';
- },
- closeModal: async function () {
- this.modal = '';
- await this._resetForms();
- },
- typeClearOneFormError: async function(field) {
- if(this.formErrors[field]){
- this.formErrors = _.omit(this.formErrors, field);
+ clickOpenChatWidget: function() {
+ if(window.HubSpotConversations && window.HubSpotConversations.widget){
+ window.HubSpotConversations.widget.open();
}
},
- submittedForm: function() {
- this.showSignupFormSuccess = true;
- },
- _resetForms: async function() {
- this.cloudError = '';
- this.formData = {};
- this.formRules = {};
- this.formErrors = {};
- await this.forceRender();
- },
}
});
diff --git a/website/assets/js/pages/homepage.page.js b/website/assets/js/pages/homepage.page.js
index 7a541f77fb..b708b02530 100644
--- a/website/assets/js/pages/homepage.page.js
+++ b/website/assets/js/pages/homepage.page.js
@@ -17,10 +17,7 @@ parasails.registerPage('homepage', {
//…
},
mounted: async function(){
- await this.updateNumberOfTweetPages(); // Update the number of pages for the tweet page indicator.
- const tweetsDiv = document.querySelector('div[purpose="tweets"]');
- tweetsDiv.addEventListener('scroll', this.updatePageIndicator, {passive: true}); // Add a scroll event listener to update the tweet page indicator when a user scrolls the div.
- window.addEventListener('resize', this.updateNumberOfTweetPages); // Add an event listener to update the number of tweet pages based on how many tweet cards can fit on the screen.
+
},
// ╦╔╗╔╔╦╗╔═╗╦═╗╔═╗╔═╗╔╦╗╦╔═╗╔╗╔╔═╗
@@ -28,54 +25,6 @@ parasails.registerPage('homepage', {
// ╩╝╚╝ ╩ ╚═╝╩╚═╩ ╩╚═╝ ╩ ╩╚═╝╝╚╝╚═╝
methods: {
- updateNumberOfTweetPages: async function() {
- // Get the width of the first tweet card.
- let firstTweetCardDiv = document.querySelector('div[purpose="tweet-card"]');
- this.tweetCardWidth = firstTweetCardDiv.clientWidth + 16;
- // Find out how may entire cards can fit on the screen.
- this.numberOfTweetsPerPage = Math.floor(window.innerWidth / this.tweetCardWidth);
- // Find out how many pages of tweet cards there will be.
- this.numberOfTweetPages = Math.ceil(this.numberOfTweetCards / this.numberOfTweetsPerPage);
- if(this.numberOfTweetPages < 1){
- this.numberOfTweetPages = 1;
- } else if (this.numberOfTweetPages > this.numberOfTweetCards) {
- this.numberOfTweetPages = this.numberOfTweetCards;
- }
- // Update the current page indicator.
- this.updatePageIndicator();
- await this.forceRender();
- },
-
- updatePageIndicator: function() {
- // Get the tweets div.
- let tweetsDiv = document.querySelector('div[purpose="tweets"]');
- // Find out the width of a page of tweet cards
- let tweetPageWidth;
- if(this.numberOfTweetPages === 2 && this.numberOfTweetsPerPage > 3){
- tweetPageWidth = this.tweetCardWidth;
- } else {
- tweetPageWidth = this.tweetCardWidth * this.numberOfTweetsPerPage;
- }
- // Set the maximum number of pages as the maximum value
- let currentPage = Math.min(Math.round(tweetsDiv.scrollLeft / tweetPageWidth), (this.numberOfTweetPages - 1));
- // Update the page indicator
- this.currentTweetPage = currentPage;
- },
-
- scrollTweetsDivToPage: function(page) {
- // Get the tweets div.
- let tweetsDiv = document.querySelector('div[purpose="tweets"]');
- // Find out the width of a page of tweet cards
- let pageWidth = this.tweetCardWidth * this.numberOfTweetsPerPage;
- // Figure out how much distance we're expecting to scroll.
- let baseAmountToScroll = (page - this.currentTweetPage) * pageWidth;
- // Find out the actual distance the div has been scrolled
- let amountCurrentPageHasBeenScrolled = tweetsDiv.scrollLeft - (this.currentTweetPage * pageWidth);
- // subtract the amount the current page has been scrolled from the baseAmountToScroll
- let amountToScroll = baseAmountToScroll - amountCurrentPageHasBeenScrolled;
- // Scroll the div to the specified 'page'
- tweetsDiv.scrollBy(amountToScroll, 0);
- },
clickOpenChatWidget: function() {
if(window.HubSpotConversations && window.HubSpotConversations.widget){
diff --git a/website/assets/styles/pages/fleet-mdm.less b/website/assets/styles/pages/fleet-mdm.less
index 3c1c1d6b55..3eb07fcfbe 100644
--- a/website/assets/styles/pages/fleet-mdm.less
+++ b/website/assets/styles/pages/fleet-mdm.less
@@ -3,7 +3,7 @@
h1 {
font-weight: 800;
font-size: 64px;
- line-height: 54px;
+ line-height: 76px;
}
h2 {
font-weight: 800;
@@ -17,18 +17,13 @@
line-height: 32px;
}
h4 {
- color: @core-fleet-black-75;
- font-weight: 500;
+ font-family: 'Roboto Mono';
+ font-style: normal;
+ font-weight: 400;
font-size: 18px;
line-height: 24px;
- /* Text gradient */
- background: linear-gradient(90deg, #FF5C83 0%, #6A67FE 100%);
- -webkit-background-clip: text;
- -webkit-text-fill-color: transparent;
- background-clip: text;
- text-fill-color: transparent;
- display: inline-block;
- /* End text gradient */
+ color: @core-fleet-black-75;
+ margin-bottom: 4px;
}
p {
font-size: 16px;
@@ -38,34 +33,33 @@
[purpose='hero-background'] {
background: linear-gradient(180deg, #E8F1F7 3.37%, #FFFFFF 60%);
padding-top: 120px;
- padding-bottom: 60px;
+ padding-bottom: 40px;
}
[purpose='hero-container'] {
max-width: 1200px;
}
[purpose='hero-text'] {
text-align: center;
- max-width: 560px;
- margin-bottom: 80px;
+ max-width: 940px;
+ padding: 0 40px;
h1 {
margin-bottom: 32px;
}
p {
font-size: 18px;
line-height: 27px;
- margin-bottom: 32px;
+ max-width: 640px;
+ margin: 0 auto 32px;
}
}
- [purpose='hero-image'] {
- max-width: 1000px;
- }
- [purpose='button-row'] {
+
+ [purpose='button-row'] {
a {
font-weight: 700;
font-size: 16px;
line-height: 24px;
}
- [purpose='mdm-beta-button'] {
+ [purpose='cta-button'] {
cursor: pointer;
margin-right: 32px;
background: @core-vibrant-red;
@@ -78,8 +72,9 @@
align-items: center;
color: #FFF;
position: relative;
+ text-decoration: none;
}
- [purpose='mdm-beta-button']::before {
+ [purpose='cta-button']::before {
background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
opacity: 1;
content: ' ';
@@ -91,7 +86,7 @@
transform: skew(-10deg);
transition: left 0.5s ease-in, opacity 0.50s ease-in, width 0.5s ease-in;
}
- [purpose='mdm-beta-button']:hover:before {
+ [purpose='cta-button']:hover:before {
opacity: 0;
left: 160px;
width: 110%;
@@ -137,19 +132,15 @@
}
}
}
+
[purpose='page-container'] {
padding-left: 40px;
padding-right: 40px;
+ padding-bottom: 120px;
}
- [purpose='section'] {
- margin-top: 120px;
- margin-bottom: 120px;
- }
- [purpose='section']:first-of-type {
- margin-top: 60px;
- }
+
[purpose='feature'] {
- margin-top: 60px;
+ margin-top: 120px;
max-width: 960px;
h3 {
margin-bottom: 24px;
@@ -160,25 +151,28 @@
}
[purpose='feature-image'] {
- height: 100%;
img {
max-height: 300px;
}
}
+ [purpose='large-feature-image'] {
+ img {
+ max-height: 250px;
+ }
+ }
[purpose='checklists'] {
margin-top: 40px;
margin-bottom: 80px;
}
-
[purpose='checklist'] {
p {
- padding-left: 24px;
- text-indent: -24px;
+ padding-left: 28px;
+ text-indent: -28px;
}
p::before {
content: ' ';
- background-image: url('/images/icon-checkmark-purple-circle-12x12@2x.png');
+ background-image: url('/images/icon-checkmark-circle.svg');
background-size: 16px 16px;
display: inline-block;
position: relative;
@@ -192,75 +186,18 @@
[purpose='tweets-container'] {
padding-top: 120px;
padding-bottom: 120px;
- background-color: @ui-off-white;
}
- [purpose='logos'] {
- height: 80px;
- max-width: 1200px;
- margin-left: auto;
- margin-right: auto;
+ [purpose='bottom-gradient'] {
+ background: linear-gradient(180deg, #FFFFFF 0%, #E9F4F4 100%);
+ }
+ [purpose='bottom-cloud-city-banner'] {
+ background: linear-gradient(180deg, #E9F4F4 0%, #FFFFFF 100%);
img {
- margin-top: 23.5px;
- margin-bottom: 23.5px;
- padding-left: 35px;
- padding-right: 35px;
- }
- [purpose='snowflake-logo'] {
- height: 30px;
- }
- [purpose='wayfair-logo'] {
- height: 33px;
- }
- [purpose='uber-logo'] {
- height: 29px;
- }
- [purpose='atlassian-logo'] {
- height: 22px;
- }
- [purpose='segment-logo'] {
- height: 32px;
+ width: 100%;
}
}
- [purpose='modal-form'] {
- input {
- border-radius: 6px;
- height: 48px;
- }
- // Disable default buttons on type="number" inputs
- input::-webkit-outer-spin-button, input::-webkit-inner-spin-button {
- -webkit-appearance: none;
- margin: 0;
- }
- input[type='number'] {
- -moz-appearance: textfield;
- }
- label {
- font-weight: 700;
- }
- width: 100%;
- max-width: 450px;
- }
-
- [purpose='submit-button'] {
- border-radius: 8px;
- }
-
- [purpose='modal-dialog'] {
- max-width: 800px;
- }
-
- [purpose='modal-content'] {
- padding-top: 80px;
- padding-left: 80px;
- padding-right: 80px;
- padding-bottom: 120px;
- max-width: 100%;
- }
-
-
-
@media (min-width: 1200px) {
[purpose='page-container'] {
padding-left: 120px;
@@ -298,34 +235,19 @@
}
@media (max-width: 991px) {
- [purpose='hero-text'] {
- text-align: center;
- max-width: 680px;
- }
[purpose='button-row'] {
margin-right: auto;
margin-left: auto;
}
- [purpose='modal-content'] {
- padding-top: 60px;
- padding-left: 60px;
- padding-right: 60px;
- padding-bottom: 120px;
- }
-
[purpose='hero-background'] {
padding-top: 120px;
- padding-bottom: 120px;
+ padding-bottom: 80px;
padding-left: 0px;
padding-right: 0px;
}
- [purpose='hero-image'] {
- max-width: 100%;
- }
-
[purpose='logos'] {
height: 58px;
margin-left: 20px;
@@ -355,7 +277,11 @@
margin-bottom: 40px;
}
- [purpose='feature-image'] {
+ [purpose='feature'] {
+ margin-top: 80px;
+ }
+
+ [purpose='feature-image'], [purpose='large-feature-image'] {
margin-bottom: 40px;
img {
max-height: 100%;
@@ -363,15 +289,6 @@
}
}
- [purpose='hero-image'] {
- width: 100%;
- }
-
- [purpose='section'] {
- margin-top: 80px;
- margin-bottom: 80px;
- }
-
[purpose='hero-background'] {
padding-top: 60px;
padding-bottom: 60px;
@@ -379,18 +296,16 @@
padding-right: 20px;
}
- [purpose='modal-content'] {
- padding-top: 60px;
- padding-left: 40px;
- padding-right: 40px;
- padding-bottom: 80px;
+ [purpose='hero-text'] {
+ text-align: center;
+ max-width: 480px;
}
[purpose='tweets-container'] {
padding-top: 80px;
padding-bottom: 80px;
- padding-left: 20px;
- padding-right: 20px;
+ padding-left: 40px;
+ padding-right: 40px;
}
[purpose='logos'] {
@@ -402,30 +317,31 @@
[purpose='button-row'] {
max-width: 100%;
- [purpose='mdm-beta-button'] {
+ [purpose='cta-button'] {
margin-right: 0px;
width: 100%;
margin-bottom: 24px;
}
}
+ [purpose='feature'] {
+ margin-top: 60px;
+ }
+
[purpose='page-container'] {
padding-left: 20px;
padding-right: 20px;
}
- [purpose='hero-background'] {
- padding-top: 120px;
+ [purpose='tweets-container'] {
+ padding-left: 20px;
+ padding-right: 20px;
}
- [purpose='section']:first-of-type {
- margin-top: 0;
- }
-
- [purpose='modal-content'] {
+ [parasails-component='scrollable-tweets'] [purpose='tweets'] {
margin-top: 40px;
- padding: 40px 20px 80px 20px;
}
}
+
}
diff --git a/website/assets/styles/pages/homepage.less b/website/assets/styles/pages/homepage.less
index 6e4f2b31f0..e7fcb01298 100644
--- a/website/assets/styles/pages/homepage.less
+++ b/website/assets/styles/pages/homepage.less
@@ -32,41 +32,34 @@
a {
color: @core-vibrant-blue;
}
+
[purpose='hero-container'] {
- background: linear-gradient(115.34deg, #FBFDFF 24.56%, #E8F1F7 48.6%, #FFFFFF 88.68%);
+ background: #E4F4F4;
overflow: hidden;
}
+
+ [purpose='hero-background-image'] {
+ background: url('/images/homepage-hero-background-1921x555@2x.png');
+ background-size: 1921px auto;
+ background-position: center bottom;
+ background-repeat: no-repeat;
+ }
+
[purpose='homepage-hero'] {
padding-top: 40px;
padding-left: 40px;
padding-right: 40px;
padding-bottom: 40px;
max-width: 1200px;
- max-height: 550px;
- }
- [purpose='homepage-hero-image'] {
- img {
- max-height: 300px;
- }
- }
- [purpose='hero-ribbon'] {
- [purpose='ribbon-banner'] {
- display: none;
- }
- height: 80px;
- z-index: 2;
- position: relative;
- background: url('/images/homepage-hero-ribbon.svg');
- background-size: cover;
- background-position: center bottom;
- background-repeat: no-repeat;
- filter: drop-shadow(0px -8.73361px 29.9438px rgba(58, 220, 255, 0.25));
+ height: 850px;
}
+
[purpose='hero-text'] {
- padding-top: 24px;
+ padding-top: 20px;
min-width: 540px;
+ text-align: center;
h1 {
- margin-bottom: 40px;
+ margin-bottom: 16px;
}
p {
margin-bottom: 40px;
@@ -77,9 +70,10 @@
margin-bottom: 40px;
}
}
+
[purpose='hero-logos'] {
+ margin-top: 32px;
margin-bottom: 120px;
- opacity: 0.75;
[purpose='snowflake-logo'] {
height: 30px;
}
@@ -99,36 +93,71 @@
display: none;
}
}
+
[purpose='logo-column'] {
img {
margin-right: 35px;
margin-left: 35px;
}
}
+
[purpose='homepage-content'] {
max-width: 1200px;
- padding-right: 60px;
- padding-left: 60px;
}
+
[purpose='homepage-text-block'] {
- margin-bottom: 100px;
- max-width: 758px;
- }
- [purpose='feature'] {
- margin-bottom: 100px;
- p {
- margin-bottom: 0px;
+ margin-top: 160px;
+ margin-bottom: 160px;
+ max-width: 872px;
+ h2 {
+ font-weight: 800;
+ font-size: 32px;
+ line-height: 48px;
+ margin-bottom: 24px;
+ }
+ p {
+ font-weight: 400;
+ font-size: 16px;
+ line-height: 24px;
}
- max-width: 960px;
}
- [purpose='feature-left-text-block'] {
+
+ [purpose='platform-block'] {
+ margin-bottom: 100px;
+ h3 {
+ font-weight: 800;
+ font-size: 24px;
+ line-height: 32px;
+ }
+ p {
+ margin-bottom: 24px;
+ color: #515774;
+ font-size: 16px;
+ line-height: 24px;
+ }
+ max-width: 1080px;
+ }
+ [purpose='platform-left-text-block'] {
max-width: 480px;
+ margin-right: 80px;
}
- [purpose='feature-right-text-block'] {
+ [purpose='platform-right-text-block'] {
max-width: 480px;
+ margin-left: 80px;
}
- [purpose='feature-image'] {
- width: 360px;
+ [purpose='platform-small-text-block'] {
+ max-width: 320px;
+ margin-right: 80px;
+ }
+ [purpose='platform-image'] {
+ width: 520px;
+ img {
+ width: 100%;
+ height: auto;
+ }
+ }
+ [purpose='platform-large-image'] {
+ width: 620px;
img {
width: 100%;
height: auto;
@@ -144,184 +173,238 @@
}
}
[purpose='button-row'] {
- a {
- font-weight: 700;
- font-size: 16px;
- line-height: 24px;
- text-decoration: none;
- }
- [purpose='cta-button'] {
- cursor: pointer;
- margin-right: 32px;
- background: @core-vibrant-red;
- border-radius: 8px;
- padding-left: 32px;
- padding-right: 32px;
- height: 48px;
- display: flex;
- justify-content: center;
- align-items: center;
- color: #FFF;
- position: relative;
- }
- [purpose='cta-button']::before {
- background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
- opacity: 1;
- content: '';
- position: absolute;
- top: 0;
- left: -5px;
- width: 50%;
- height: 100%;
- transform: skew(-10deg);
- transition: left 0.5s ease-in, opacity 0.50s ease-in, width 0.5s ease-in;
- }
- [purpose='cta-button']:hover:before {
- left: 160px;
- width: 110%;
- }
- }
- [purpose='animated-arrow-button-red'] {
- display: inline;
- padding-right: 40px;
- cursor: pointer;
- position: relative;
- width: fit-content;
- min-width: 125px;
- font-weight: bold;
- user-select: none;
- transition: 0.2s ease-in-out;
- -o-transition: 0.2s ease-in-out;
- -ms-transition: 0.2s ease-in-out;
- -moz-transition: 0.2s ease-in-out;
- -webkit-transition: 0.2s ease-in-out;
- color: @core-fleet-black;
- text-decoration: none;
- &:after {
- content: url('/images/arrow-right-red-16x16@2x.png');
- transform: scale(0.5);
- position: absolute;
- top: -5px;
- left: 80%; // <--- here
- transition: 0.2s ease-in-out;
- -o-transition: 0.2s ease-in-out;
- -ms-transition: 0.2s ease-in-out;
- -moz-transition: 0.2s ease-in-out;
- -webkit-transition: 0.2s ease-in-out;
- /* opacity: 0; */
- }
- &:hover:after {
- left: 82%; // <--- here
- transition: 0.2s ease-in-out;
- -o-transition: 0.2s ease-in-out;
- -ms-transition: 0.2s ease-in-out;
- -moz-transition: 0.2s ease-in-out;
- -webkit-transition: 0.2s ease-in-out;
- /* opacity:1; */
- }
- }
- [purpose='scrollable-tweets'] {
- font-size: 13px;
- line-height: 20px;
- margin-top: 79px;
- margin-bottom: 80px;
-
- [purpose='tweets']::-webkit-scrollbar {
- display: none;
+ a {
+ font-weight: 700;
+ font-size: 16px;
+ line-height: 24px;
+ text-decoration: none;
}
-
- [purpose='tweets'] {
- overflow-x: scroll;
- scroll-behavior: smooth;
- padding-left: 120px;
- padding-right: 120px;
- padding-bottom: 16px;
- padding-top: 1px; //« makes the top of the card border visible
- scrollbar-width: none;
- -ms-overflow-style: none;
- }
-
- [purpose='tweet-card'] {
- max-width: 367px;
- min-width: 367px;
- display: flex;
- flex-direction: column;
- justify-content: center;
- margin-left: 8px;
- margin-right: 8px;
- margin-bottom: 8px;
- text-align: left;
- padding: 40px;
- background: linear-gradient(180deg, rgba(255, 255, 255, 0.6) 0%, rgba(255, 255, 255, 0.4) 100%);
- border: none;
- box-shadow: 0px 0px 1px 1px #E2E4EA, inset 0px 0px 0px 2px #FFFFFF;
- border-radius: 16px;
- }
- [purpose='tweets-page-indicator'] {
- margin-bottom: 40px;
+ [purpose='cta-button'] {
cursor: pointer;
- li {
- padding: 2px;
- height: 16px;
- width: 16px;
- border-radius: 100%;
- margin-right: 8px;
- [purpose='page-item-dot'] {
- display: inline-block;
- width: 100%;
- height: 100%;
- border-radius: 50%;
- background-color: @core-vibrant-blue-15;
- }
+ margin-right: 32px;
+ background: @core-vibrant-red;
+ border-radius: 8px;
+ padding-left: 32px;
+ padding-right: 32px;
+ height: 48px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ color: #FFF;
+ position: relative;
+ }
+ [purpose='cta-button']::before {
+ background: linear-gradient(180deg, rgba(255, 255, 255, 0.2) 0%, rgba(255, 255, 255, 0) 100%);
+ opacity: 1;
+ content: '';
+ position: absolute;
+ top: 0;
+ left: -5px;
+ width: 50%;
+ height: 100%;
+ transform: skew(-10deg);
+ transition: left 0.5s ease-in, opacity 0.50s ease-in, width 0.5s ease-in;
+ }
+ [purpose='cta-button']:hover:before {
+ left: 160px;
+ width: 110%;
+ }
+ }
+ [purpose='animated-arrow-button-red'] {
+ display: inline;
+ padding-right: 34px;
+ cursor: pointer;
+ position: relative;
+ width: fit-content;
+ min-width: auto;
+ font-weight: bold;
+ user-select: none;
+ transition: 0.2s ease-in-out;
+ -o-transition: 0.2s ease-in-out;
+ -ms-transition: 0.2s ease-in-out;
+ -moz-transition: 0.2s ease-in-out;
+ -webkit-transition: 0.2s ease-in-out;
+ color: @core-fleet-black;
+ text-decoration: none;
+ &:after {
+ content: url('/images/arrow-right-red-16x16@2x.png');
+ transform: scale(0.5);
+ position: absolute;
+ top: -5px;
+ right: -5px; // <--- here
+ transition: 0.2s ease-in-out;
+ -o-transition: 0.2s ease-in-out;
+ -ms-transition: 0.2s ease-in-out;
+ -moz-transition: 0.2s ease-in-out;
+ -webkit-transition: 0.2s ease-in-out;
+ /* opacity: 0; */
+ }
+ &:hover:after {
+ right: -10px; // <--- here
+ transition: 0.2s ease-in-out;
+ -o-transition: 0.2s ease-in-out;
+ -ms-transition: 0.2s ease-in-out;
+ -moz-transition: 0.2s ease-in-out;
+ -webkit-transition: 0.2s ease-in-out;
+ /* opacity:1; */
+ }
+ }
+
+ [purpose='supported-platforms'] {
+ margin-left: auto;
+ margin-right: auto;
+ max-width: 824px;
+ margin-bottom: 160px;
+ h2 {
+ font-size: 32px;
+ line-height: 48px;
+ text-align: center;
+ margin-bottom: 40px;
+ }
+ [purpose='supported-platform-row'] {
+ justify-content: center;
+ padding-bottom: 24px;
+ }
+ [purpose='supported-platform'] {
+ width: 120px;
+ margin: 12px;
+ img {
+ margin-left: auto;
+ margin-right: auto;
+ height: 48px;
+ width: auto;
}
- li.selected {
- [purpose='page-item-dot'] {
- background-color: @core-fleet-black-50;
+ p {
+ line-height: 21px;
+ font-size: 14px;
+ margin-bottom: 0px;
+ text-align: center;
+ span {
+ font-size: 11px;
+ line-height: 16.5px;
}
}
}
}
- @media (min-width: 1600px) {
- [purpose='hero-ribbon'] {
- background-image: none;
- height: auto;
- [purpose='ribbon-banner'] {
- display: block;
- height: auto;
- width: 100%;
+ [purpose='two-column-features'] {
+ max-width: 1080px;
+ margin-bottom: 160px;
+ [purpose='feature-row'] {
+ margin-bottom: 80px;
+ [purpose='feature'] {
+ max-width: 510px;
+ p {
+ font-size: 16px;
+ line-height: 24px;
+ }
}
}
}
+ [purpose='three-column-features'] {
+ margin-bottom: 160px;
+ max-width: 1080px;
+ [purpose='feature-row'] {
+ [purpose='feature'] {
+ max-width: 320px;
+ p {
+ font-size: 14px;
+ line-height: 21px;
+ }
+ }
+ }
+ h2 {
+ font-size: 32px;
+ line-height: 48px;
+ margin-bottom: 40px;
+ }
+ }
+
+ [purpose='feature'] {
+ margin-left: 30px;
+ margin-right: 30px;
+
+ img {
+ height: 64px;
+ width: auto;
+ margin-bottom: 16px;
+ }
+ h5 {
+ font-weight: 800;
+ font-size: 18px;
+ line-height: 27px;
+ margin-bottom: 16px;
+ }
+ }
- @media (min-width: 1200px) {
- [purpose='homepage-hero'] {
- padding-left: 80px;
- padding-right: 80px;
- padding-bottom: 80px;
- padding-top: 80px;
- max-width: 1300px;
+ [purpose='homepage-cards'] {
+ margin-top: 160px;
+ margin-bottom: 120px;
+ [purpose='homepage-card'] {
+ background: #FFFFFF;
+ box-shadow: 0px 4px 32px rgba(0, 0, 0, 0.1);
+ border-radius: 16px;
+ padding: 40px;
+ width: 390px;
+ margin-left: 30px;
+ margin-right: 30px;
+ border: none;
+ }
+ }
+
+
+
+ @media (min-width: 1400px) {
+ [purpose='hero-background-image'] {
+ background-size: 100% auto;
+ background-position: center bottom;
+ background-repeat: no-repeat;
}
[purpose='homepage-content'] {
max-width: 1200px;
- padding-right: 0px;
- padding-left: 0px;
+ padding-right: 60px;
+ padding-left: 60px;
+ }
+ [purpose='homepage-hero'] {
+ max-width: 1080px;
+ height: 900px;
+ }
+ }
+
+
+ @media (max-width: 1200px) {
+
+ [purpose='hero-background-image'] {
+ background-size: 1600px auto;
+ background-position: center bottom;
+ background-repeat: no-repeat;
+ }
+
+ [purpose='homepage-hero'] {
+ max-width: 1080px;
+ height: 726px;
+ }
+
+ [purpose='homepage-content'] {
+ max-width: 1200px;
+ padding-right: 60px;
+ padding-left: 60px;
}
}
@media (max-width: 991px) {
- [purpose='hero-text'] {
- h1 {
- font-size: 48px;
- }
+ [purpose='hero-background-image'] {
+ background-size: 1400px auto;
+ background-position: center bottom;
+ background-repeat: no-repeat;
}
[purpose='homepage-hero'] {
- padding-left: 60px;
- padding-right: 0px;
- padding-bottom: 10px;
+ max-width: 100%;
+ height: 720px;
}
[purpose='hero-logos'] {
+ margin-top: 24px;
img {
display: inline;
}
@@ -351,49 +434,49 @@
margin-left: 20px;
}
}
- [purpose='feature-left-text-block'] {
- max-width: 440px;
- padding-right: 40px;
+
+ [purpose='platform-left-text-block'] {
+ max-width: 357px;
+ margin-right: 80px;
}
- [purpose='feature-right-text-block'] {
- max-width: 440px;
- padding-left: 40px;
+ [purpose='platform-right-text-block'] {
+ max-width: 357px;
+ margin-left: 80px;
}
+ [purpose='platform-small-text-block'] {
+ max-width: 357px;
+ margin-right: 80px;
+ }
+
+ [purpose='platform-large-image'] {
+ width: 453px;
+ img {
+ width: 100%;
+ height: auto;
+ }
+ }
+
+
+
[purpose='bottom-cloud-city-banner'] {
max-height: 375px;
height: auto;
width: 100%;
}
- [purpose='scrollable-tweets'] {
- margin-top: 60px;
- margin-bottom: 60px;
- [purpose='tweets'] {
- padding-left: 80px;
- padding-right: 80px;
- }
- }
}
@media (max-width: 767px) {
+ [purpose='hero-background-image'] {
+ background-size: 1200px auto;
+ background-position: center bottom;
+ background-repeat: no-repeat;
+ }
+
[purpose='homepage-hero'] {
- padding-left: 40px;
- padding-right: 40px;
- max-height: unset;
- }
- [purpose='homepage-hero-image'] {
- max-height: 280px;
- display: flex;
- flex-direction: column;
- align-items: center;
- justify-content: start;
- width: 100%;
- margin-bottom: -20px;
- img {
- max-width: 100%;
- height: auto;
- }
+ height: 650px;
}
+
[purpose='homepage-content'] {
padding-right: 40px;
padding-left: 40px;
@@ -411,7 +494,184 @@
}
}
[purpose='hero-logos'] {
+ margin-top: 32px;
margin-bottom: 80px;
+ [purpose='snowflake-logo'] {
+ height: 30px;
+ }
+ [purpose='wayfair-logo'] {
+ height: 33px;
+ }
+ [purpose='uber-logo'] {
+ height: 30px;
+ }
+ [purpose='atlassian-logo'] {
+ height: 21px;
+ }
+ [purpose='segment-logo'] {
+ height: 32px;
+ }
+ [purpose='bottom-row-uber-logo'] {
+ display: none;
+ }
+ }
+ [purpose='homepage-text-block'] {
+ margin-bottom: 80px;
+ p {
+ max-width: 527px;
+ margin: 0 auto;
+ }
+ }
+
+ [purpose='platform-left-text-block'] {
+ max-width: 100%;
+ margin-right: 0px;
+ margin-bottom: 80px;
+ }
+ [purpose='platform-right-text-block'] {
+ max-width: 100%;
+ margin-left: 0px;
+ margin-bottom: 80px;
+ }
+ [purpose='platform-small-text-block'] {
+ max-width: 100%;
+ margin-right: 0px;
+ margin-bottom: 80px;
+ }
+ [purpose='platform-image'] {
+ width: 100%;
+ }
+ [purpose='platform-large-image'] {
+ width: 100%;
+ img {
+ width: 100%;
+ height: auto;
+ }
+ }
+ [purpose='supported-platforms'] {
+ margin-bottom: 100px;
+ }
+
+ [purpose='platform'] {
+ margin-bottom: 80px;
+ }
+ [purpose='homepage-cards'] {
+ margin-bottom: 100px;
+ [purpose='homepage-card'] {
+ background: #FFFFFF;
+ box-shadow: 0px 4px 32px rgba(0, 0, 0, 0.1);
+ border-radius: 16px;
+ padding: 40px;
+ width: 100%;
+ margin-left: auto;
+ margin-right: auto;
+ border: none;
+ &:first-of-type {
+ margin-bottom: 60px;
+ }
+ }
+ }
+ [purpose='three-column-features'] {
+ margin-bottom: 120px;
+ }
+ }
+
+ @media (max-width: 575px) {
+
+ [purpose='hero-background-image'] {
+ background-size: 960px auto;
+ background-position: center bottom;
+ background-repeat: no-repeat;
+ }
+
+ [purpose='homepage-hero'] {
+ height: 625px;
+ padding-left: 24px;
+ padding-right: 24px;
+ }
+ h1 {
+ font-weight: 800;
+ font-size: 40px;
+ line-height: 60px;
+ }
+ [purpose='hero-text'] {
+ padding-bottom: 260px;
+ h1 {
+ font-size: 40px;
+ line-height: 60px;
+ }
+ h4 {
+ font-size: 14px;
+ }
+ p {
+ font-size: 16px;
+ }
+ }
+
+ [purpose='homepage-content'] {
+ padding-right: 24px;
+ padding-left: 24px;
+ }
+
+ [purpose='platform-left-text-block'], [purpose='platform-right-text-block'] {
+ text-align: left;
+ }
+ [purpose='button-row'] {
+ [purpose='cta-button'] {
+ cursor: pointer;
+ margin-right: 0px;
+ width: 100%;
+ margin-bottom: 24px;
+ }
+ }
+ [purpose='platform-image'] {
+ width: 100%;
+ img {
+ width: 100%;
+ height: auto;
+ }
+ }
+ [purpose='supported-platform'] {
+ margin-bottom: 24px;
+ }
+
+ [purpose='two-column-features'] {
+ margin-bottom: 100px;
+ [purpose='feature-row'] {
+ margin-bottom: 60px;
+ [purpose='feature'] {
+ margin-left: 0px;
+ margin-right: 0px;
+ max-width: 100%;
+ margin-bottom: 60px;
+ text-align: center;
+ img {
+ margin-right: auto;
+ margin-left: auto;
+ }
+ }
+ }
+ }
+ [purpose='three-column-features'] {
+ margin-bottom: 100px;
+ h2 {
+ text-align: center;
+ }
+ [purpose='feature-row'] {
+ [purpose='feature'] {
+ max-width: 100%;
+ margin-left: 0px;
+ margin-right: 0px;
+ margin-bottom: 60px;
+ text-align: center;
+ img {
+ margin-right: auto;
+ margin-left: auto;
+ }
+ }
+ }
+ }
+ [purpose='hero-logos'] {
img {
display: inline;
}
@@ -435,107 +695,23 @@
height: 24px;
}
}
- [purpose='homepage-text-block'] {
- margin-bottom: 80px;
- p {
- max-width: 527px;
- margin: 0 auto;
- }
- }
- [purpose='feature'] {
- margin-bottom: 80px;
- }
- [purpose='feature-left-text-block'], [purpose='feature-right-text-block'] {
- max-width: 527px;
- padding-right: 0px;
- padding-left: 0px;
- text-align: center;
- }
- [purpose='feature-image'] {
- max-width: 327px;
- width: 100%;
- margin-bottom: 40px;
- img {
- width: 100%;
- height: auto;
- }
- }
- [purpose='scrollable-tweets'] {
- margin-top: 60px;
- margin-bottom: 60px;
- [purpose='tweets'] {
- padding-left: 40px;
- padding-right: 40px;
- }
- }
- }
- @media (max-width: 575px) {
-
- h1 {
- font-size: 36px;
- line-height: 54px;
- }
- [purpose='scrollable-tweets'] {
- [purpose='tweets'] {
- padding-left: 20px;
- padding-right: 20px;
- }
- [purpose='tweet-card'] {
- min-width: 280px;
- padding: 20px;
- border-radius: 16px;
- }
- [purpose='tweets-page-indicator'] {
- li {
- width: 24px;
- height: 24px;
- padding: 6px;
- margin-right: 0;
- }
- }
- }
- [purpose='homepage-hero'] {
- padding-left: 24px;
- padding-right: 24px;
- }
- [purpose='homepage-content'] {
- padding-right: 24px;
- padding-left: 24px;
- }
- [purpose='hero-text'] {
- text-align: center;
- h1 {
- font-size: 36px;
- line-height: 48px;
- margin-bottom: 20px;
- }
- p {
- margin-bottom: 30px;
- }
- }
- [purpose='feature-left-text-block'], [purpose='feature-right-text-block'] {
- text-align: left;
- }
- [purpose='button-row'] {
- [purpose='cta-button'] {
- cursor: pointer;
- margin-right: 0px;
- width: 100%;
- margin-bottom: 24px;
- }
- }
}
@media (max-width: 375px) {
- [purpose='homepage-hero-image'] {
- max-height: 360px;
+
+ [purpose='hero-background-image'] {
+ background-size: 800px auto;
+ background-position: center bottom;
+ background-repeat: no-repeat;
}
+
[purpose='hero-text'] {
+ padding-bottom: 260px;
h1 {
- font-size: 30px;
- line-height: 46px;
+ font-size: 35px;
+ line-height: 60px;
}
h4 {
font-size: 14px;
@@ -544,6 +720,16 @@
font-size: 16px;
}
}
+
+ [purpose='homepage-hero'] {
+ height: 647px;
+ }
+
+ [purpose='homepage-content'] {
+ padding-right: 20px;
+ padding-left: 20px;
+ }
+
[purpose='hero-logos'] {
img {
display: inline;
diff --git a/website/views/layouts/layout-sandbox.ejs b/website/views/layouts/layout-sandbox.ejs
index 914e904c85..c86e0a2aec 100644
--- a/website/views/layouts/layout-sandbox.ejs
+++ b/website/views/layouts/layout-sandbox.ejs
@@ -158,6 +158,7 @@
Platform
+ 
+ 
+ 
- 
- 
- 
- 
+ 
+ 
+ 
- 
+ 
+ 
+ 
+ <%/* Vulnerability management block */%>
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
- 
- 
- 
- 
- 
-