/* ========================================================================== HubSpot Migrations Services - COS Boilerplate v2.0.0 ========================================================================== */ /* ========================================================================== Table of Contents: 1. EXTERNAL RESOURCES 2. BASE STYLES 3. COS STRUCTURE 4. MAIN NAVIGATION 5. BLOG 6. FORMS 7. BUTTONS 8. MISCELLANEOUS 9. MOBILE MEDIA QUERIES ========================================================================== */ /* ========================================================================== 1. EXTERNAL RESOURCES ========================================================================== */ /* =============== @import, @font-face, and CSS File Includes =============== */ /* EX: @import url('http://example.com/example_style.css'); */ /* */ /* * The Typekit service used to deliver this font or fonts for use on websites * is provided by Adobe and is subject to these Terms of Use * http://www.adobe.com/products/eulas/tou_typekit. For font license * information, see the list below. * * proxima-nova: * - http://typekit.com/eulas/00000000000000007735e602 * - http://typekit.com/eulas/00000000000000007758cf7c * - http://typekit.com/eulas/00000000000000007735e603 * - http://typekit.com/eulas/00000000000000007758cf7d * - http://typekit.com/eulas/00000000000000007735e611 * - http://typekit.com/eulas/00000000000000007758cf8c * - http://typekit.com/eulas/00000000000000007735e601 * - http://typekit.com/eulas/00000000000000007758cf8d * - http://typekit.com/eulas/00000000000000007735e60d * - http://typekit.com/eulas/00000000000000007758cf8e * - http://typekit.com/eulas/00000000000000007735e609 * - http://typekit.com/eulas/00000000000000007758cf8f * - http://typekit.com/eulas/00000000000000007735e606 * - http://typekit.com/eulas/00000000000000007758cf90 * - http://typekit.com/eulas/00000000000000007735e605 * - http://typekit.com/eulas/00000000000000007735e60e * * © 2009-2025 Adobe Systems Incorporated. All Rights Reserved. */ /*{"last_published":"2025-09-16 10:28:31 UTC"}*/ @import url("https://p.typekit.net/p.css?s=1&k=doo8dbg&ht=tk&f=137.138.139.140.169.170.171.172.173.174.175.176.5474.5475.25136.25137&a=86967255&app=typekit&e=css"); @font-face { font-family: "proxima-regular"; src: url("https://use.typekit.net/af/846224/00000000000000007735e602/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff2"), url("https://use.typekit.net/af/846224/00000000000000007735e602/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff"), url("https://use.typekit.net/af/846224/00000000000000007735e602/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("opentype"); font-weight: 100; } @font-face { font-family: "proxima-light"; src: url("https://use.typekit.net/af/846224/00000000000000007735e602/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff2"), url("https://use.typekit.net/af/846224/00000000000000007735e602/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff"), url("https://use.typekit.net/af/846224/00000000000000007735e602/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("opentype"); font-weight: 100; } @font-face { font-family: "proxima-semibold"; src: url("https://use.typekit.net/af/846224/00000000000000007735e602/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff2"), url("https://use.typekit.net/af/846224/00000000000000007735e602/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff"), url("https://use.typekit.net/af/846224/00000000000000007735e602/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("opentype"); font-weight: 600; } @font-face { font-family: "proxima-bold"; src: url("https://use.typekit.net/af/846224/00000000000000007735e602/31/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff2"), url("https://use.typekit.net/af/846224/00000000000000007735e602/31/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("woff"), url("https://use.typekit.net/af/846224/00000000000000007735e602/31/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n9&v=3") format("opentype"); font-weight: 700; } /* @font-face { font-family: proxima-regular; src: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-regular-webfont-5b474fa1.ttf") format("truetype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-regular-webfont-5b474fa1.eot") format("embedded-opentype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-regular-webfont-5b474fa1.woff") format("woff"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-regular-webfont-5b474fa1.woff2") format("woff2"); } @font-face { font-family: proxima-light; src: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-light-webfont-05b9d8bf.otf") format("opentype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-light-webfont-f1fb760a.ttf") format("truetype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-light-webfont-e044cde1.eot") format("embedded-opentype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-light-webfont-adbd4346.woff") format("woff"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-light-webfont-113cfff2.woff2") format("woff2"); } @font-face { font-family: proxima-semibold; src: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-semibold-webfont-11f74446.ttf") format("truetype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-semibold-webfont-11f74446.eot") format("embedded-opentype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-semibold-webfont-11f74446.woff") format("woff"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-semibold-webfont-11f74446.woff2") format("woff2"); } @font-face { font-family: proxima-bold; src: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/original-proximanova-bold-webfont-b7161039-1.ttf") format("truetype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-bold-webfont-b7161039-1-1.eot") format("embedded-opentype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-bold-webfont-b7161039-1.woff") format("woff"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/proximanova-bold-webfont-b7161039-1-1.woff2") format("woff2") } */ @font-face { font-family: PT Serif Caption; src: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/PT_Serif-Caption-Web-Regular-4c474a08.ttf") format("truetype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/PT_Serif-Caption-Web-Regular-4c474a08.eot") format("embedded-opentype"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/PT_Serif-Caption-Web-Regular-4c474a08.woff") format("woff"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/PT_Serif-Caption-Web-Regular-4c474a08.woff2") format("woff2"); } @font-face { font-family: "circular-stdbold"; font-style: normal; font-weight: normal; src: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/CircularStd-Bold.eot"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/CircularStd-Bold.woff") format("woff"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/CircularStd-Bold.ttf") format("truetype") } @font-face { font-family: "circular-stdbook"; font-style: normal; font-weight: normal; src: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/CircularStd-Book.eot"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/CircularStd-Book.woff") format("woff"), url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/fonts/CircularStd-Book.ttf") format("truetype") } /* HubSpot_Boilerplate-modules.css is required to address style issues with the default modules and responsive grid layout */ /* Images */ img { max-width: 100%; height: auto; border: 0; -ms-interpolation-mode: bicubic; vertical-align: bottom; /* Suppress the space beneath the baseline */ } img.alignRight, img.alignright{ margin: 0 0 5px 15px; } img.alignLeft, img.alignleft{ margin: 0 15px 5px 0; } /* Reduces min-height on bootstrap structure */ .row-fluid [class*="span"] { min-height: 1px; } /* Blog Social Sharing */ .hs-blog-social-share .hs-blog-social-share-list { margin: 0; list-style: none !important; } .hs-blog-social-share .hs-blog-social-share-list .hs-blog-social-share-item { height: 30px; list-style: none !important; } @media (max-width: 479px){ .hs-blog-social-share .hs-blog-social-share-list .hs-blog-social-share-item:nth-child(2) { float: none !important; /* Stack social icons into two rows on phones */ } } .hs-blog-social-share .hs-blog-social-share-list .hs-blog-social-share-item .fb-like > span{ vertical-align: top !important; /* Aligns Facebook icon with other social media icons */ } /* Captcha */ #recaptcha_response_field { width: auto !important; display: inline-block !important; } /* line height fix for reCaptcha theme */ #recaptcha_table td {line-height: 0;} .recaptchatable #recaptcha_response_field { min-height: 0;line-height: 12px; } @media all and (max-width: 400px) { /* beat recaptcha into being responsive, !importants and specificity are necessary */ #captcha_wrapper, #recaptcha_area, #recaptcha_area table#recaptcha_table, #recaptcha_area table#recaptcha_table .recaptcha_r1_c1 { width: auto !important; overflow: hidden; } #recaptcha_area table#recaptcha_table .recaptcha_r4_c4 { width: 67px !important; } #recaptcha_area table#recaptcha_table #recaptcha_image { width:280px !important; } } /* Videos */ video { max-width: 100%; height: auto; } /* Date Picker */ #calroot { width: 202px !important; line-height: normal; } #calroot, #calroot *, #calroot *:before, #calroot *:after { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; } #calroot select { min-height: 0 !important; padding: 1px 2px !important; font-family: "Lucida Grande", "Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet MS", Verdana, sans-serif !important; font-size: 10px !important; line-height: 18px !important; font-weight: normal !important; } #caldays { margin-bottom: 4px; } /* Responsive Embed Container (iFrame, Object, Embed) */ .hs-responsive-embed, .hs-responsive-embed.hs-responsive-embed-youtube, .hs-responsive-embed.hs-responsive-embed-wistia, .hs-responsive-embed.hs-responsive-embed-vimeo { position: relative; height: 0; overflow: hidden; padding-bottom: 56.25%; padding-top: 30px; padding-left: 0; padding-right: 0; } .hs-responsive-embed iframe, .hs-responsive-embed object, .hs-responsive-embed embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; } .hs-responsive-embed.hs-responsive-embed-instagram { padding-top: 0px; padding-bottom: 116.01%; } .hs-responsive-embed.hs-responsive-embed-pinterest { height: auto; overflow: visible; padding: 0 0 0 0; } .hs-responsive-embed.hs-responsive-embed-pinterest iframe { position: static; width: auto; height: auto; } iframe[src^="http://www.slideshare.net/slideshow/embed_code/"] { width: 100%; max-width: 100%; } @media (max-width: 568px) { iframe { max-width: 100%; } } /* Forms */ textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"] select { display: inline-block; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } /* Fix radio button and check box fields in multi column forms*/ .hs-form fieldset[class*="form-columns"] input[type="checkbox"].hs-input, .hs-form fieldset[class*="form-columns"] input[type="radio"].hs-input { width: auto; } /* System Template Forms */ #email-prefs-form .email-edit { width: 100% !important; max-width: 507px !important; } #hs-pwd-widget-password { height: auto !important; } /* Menus */ .hs-menu-wrapper ul { padding: 0; } /* Horizontal Menu ========================================================================== */ .hs-menu-wrapper.hs-menu-flow-horizontal ul { list-style: none; margin: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: inline-block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul:before { content: " "; display: table; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul:after { content: " "; display: table; clear: both; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-1 { float: left; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a { display: inline-block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children { position: relative; } .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s; position: absolute; z-index: 10; left: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { display: block; white-space: nowrap; } .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper li.hs-item-has-children ul.hs-menu-children-wrapper { left: 100%; top: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 1; visibility: visible; } .row-fluid-wrapper:last-child .hs-menu-wrapper.hs-menu-flow-horizontal > ul { margin-bottom: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch { position: relative; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul { margin-bottom: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children { position: static; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children ul.hs-menu-children-wrapper { display: none; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper { display: block; visibility: visible; opacity: 1; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper:before { content: " "; display: table; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper:after { content: " "; display: table; clear: both; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li { float: left; } .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li a { display: inline-block; } /* Vertical Menu ========================================================================== */ .hs-menu-wrapper.hs-menu-flow-vertical { width: 100%; } .hs-menu-wrapper.hs-menu-flow-vertical ul { list-style: none; margin: 0; } .hs-menu-wrapper.hs-menu-flow-vertical li a { display: block; } .hs-menu-wrapper.hs-menu-flow-vertical > ul { margin-bottom: 0; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-menu-depth-1 > a { width: auto; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children { position: relative; } /* Flyouts */ .hs-menu-wrapper.hs-menu-flow-vertical.flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: hidden; opacity: 0; -webkit-transition: opacity 0.4s; position: absolute; z-index: 10; left: 0; } .hs-menu-wrapper.hs-menu-flow-vertical > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { display: block; white-space: nowrap; } .hs-menu-wrapper.hs-menu-flow-vertical.flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper { left: 100%; top: 0; } .hs-menu-wrapper.hs-menu-flow-vertical.flyouts > ul li.hs-item-has-children:hover > ul.hs-menu-children-wrapper { opacity: 1; visibility: visible; } @media (max-width: 767px) { .hs-menu-wrapper, .hs-menu-wrapper * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display: block; width: 100%; } .hs-menu-wrapper.hs-menu-flow-horizontal ul { list-style: none; margin: 0; display: block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul { display: block; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-menu-depth-1 { float: none; } .hs-menu-wrapper.hs-menu-flow-horizontal > ul li a, .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a, .hs-menu-wrapper.hs-menu-flow-horizontal.hs-menu-show-active-branch > ul li.hs-item-has-children.active-branch > ul.hs-menu-children-wrapper > li a { display: block; } /* Stacking Horizontal Nav for Mobile */ .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children ul.hs-menu-children-wrapper { visibility: visible !important; opacity: 1 !important; position: static !important; } .hs-menu-wrapper.hs-menu-flow-horizontal ul ul ul { padding: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal>ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { white-space: normal; } /* Stacking Vertical Nav for Mobile */ .hs-menu-wrapper.hs-menu-flow-vertical.flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper { position: static; opacity: 1; visibility: visible; } } .hs-menu-wrapper.hs-menu-flow-vertical.no-flyouts .hs-menu-children-wrapper { visibility: visible; opacity: 1; } .hs-menu-wrapper.hs-menu-flow-horizontal.no-flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper { display: block; visibility: visible; opacity: 1; } /* Space Module */ .widget-type-space { visibility: hidden; } /* Blog Author Section */ .hs-author-social-links { display: inline-block; } .hs-author-social-links a.hs-author-social-link { width: 24px; height: 24px; border-width: 0px; border: 0px; line-height: 24px; background-size: 24px 24px; background-repeat: no-repeat; display: inline-block; text-indent: -99999px; } .hs-author-social-links a.hs-author-social-link.hs-social-facebook { background-image: url("//static.hubspot.com/final/img/common/icons/social/facebook-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-linkedin { background-image: url("//static.hubspot.com/final/img/common/icons/social/linkedin-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-twitter { background-image: url("//static.hubspot.com/final/img/common/icons/social/twitter-24x24.png"); } .hs-author-social-links a.hs-author-social-link.hs-social-google-plus { background-image: url("//static.hubspot.com/final/img/common/icons/social/googleplus-24x24.png"); } /* Fix for CTA border box issue */ .hs-cta-wrapper a { box-sizing: content-box; -moz-box-sizing: content-box; -webkit-box-sizing: content-box; } /* * jQuery FlexSlider v2.0 * http://www.woothemes.com/flexslider/ * * Copyright 2012 WooThemes * Free to use under the GPLv2 license. * http://www.gnu.org/licenses/gpl-2.0.html * * Contributing author: Tyler Smith (@mbmufffin) */ /* Wrapper */ .hs_cos_wrapper_type_image_slider { display: block; overflow: hidden } /* Browser Resets */ .hs_cos_flex-container a:active, .hs_cos_flex-slider a:active, .hs_cos_flex-container a:focus, .hs_cos_flex-slider a:focus {outline: none;} .hs_cos_flex-slides, .hs_cos_flex-control-nav, .hs_cos_flex-direction-nav {margin: 0; padding: 0; list-style: none;} /* No JavaScript Fallback */ /* If you are not using another script, such as Modernizr, make sure you * include js that eliminates this class on page load */ /* FlexSlider Default Theme *********************************/ .hs_cos_flex-slider {margin: 0 0 60px; padding: 0; background: #fff; border: 0; position: relative; -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px; zoom: 1;} .hs_cos_flex-viewport {max-height: 2000px; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; transition: all 1s ease;} .loading .hs_cos_flex-viewport {max-height: 300px;} .hs_cos_flex-slider .hs_cos_flex-slides {zoom: 1;} .carousel li {margin-right: 5px} /* FlexSlider Necessary Styles *********************************/ .hs_cos_flex-slider .hs_cos_flex-slides > li {display: none; -webkit-backface-visibility: hidden; position: relative;} /* Hide the slides before the JS is loaded. Avoids image jumping */ .hs_cos_flex-slider .hs_cos_flex-slides img {width: 100%; display: block; border-radius: 0px;} .hs_cos_flex-pauseplay span {text-transform: capitalize;} /* Clearfix for the .hs_cos_flex-slides element */ .hs_cos_flex-slides:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;} html[xmlns] .hs_cos_flex-slides {display: block;} * html .hs_cos_flex-slides {height: 1%;} /* Direction Nav */ .hs_cos_flex-direction-nav {*height: 0;} .hs_cos_flex-direction-nav a {width: 30px; height: 30px; margin: -20px 0 0; display: block; background: url("//cdn2.hubspotqa.com/local/hub/124/file-52894-png/bg_direction_nav.png") no-repeat 0 0; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 0; -webkit-transition: all .3s ease;} .hs_cos_flex-direction-nav .hs_cos_flex-next {background-position: 100% 0; right: -36px; } .hs_cos_flex-direction-nav .hs_cos_flex-prev {left: -36px;} .hs_cos_flex-slider:hover .hs_cos_flex-next {opacity: 0.8; right: 5px;} .hs_cos_flex-slider:hover .hs_cos_flex-prev {opacity: 0.8; left: 5px;} .hs_cos_flex-slider:hover .hs_cos_flex-next:hover, .hs_cos_flex-slider:hover .hs_cos_flex-prev:hover {opacity: 1;} .hs_cos_flex-direction-nav .hs_cos_flex-disabled {opacity: .3!important; filter:alpha(opacity=30); cursor: default;} /* Direction Nav for the Thumbnail Carousel */ .hs_cos_flex_thumbnavs-direction-nav { margin: 0px; padding: 0px; list-style: none; } .hs_cos_flex_thumbnavs-direction-nav {*height: 0;} .hs_cos_flex_thumbnavs-direction-nav a {width: 30px; height: 140px; margin: -60px 0 0; display: block; background: url("//cdn2.hubspotqa.com/local/hub/124/file-52894-png/bg_direction_nav.png") no-repeat 0 40%; position: absolute; top: 50%; z-index: 10; cursor: pointer; text-indent: -9999px; opacity: 1; -webkit-transition: all .3s ease;} .hs_cos_flex_thumbnavs-direction-nav .hs_cos_flex_thumbnavs-next {background-position: 100% 40%; right: 0px; } .hs_cos_flex_thumbnavs-direction-nav .hs_cos_flex_thumbnavs-prev {left: 0px;} .hs-cos-flex-slider-control-panel img { cursor: pointer; } .hs-cos-flex-slider-control-panel img:hover { opacity:.8; } .hs-cos-flex-slider-control-panel { margin-top: -30px; } /* Control Nav */ .hs_cos_flex-control-nav {width: 100%; position: absolute; bottom: -40px; text-align: center;} .hs_cos_flex-control-nav li {margin: 0 6px; display: inline-block; zoom: 1; *display: inline;} .hs_cos_flex-control-paging li a {width: 11px; height: 11px; display: block; background: #666; background: rgba(0,0,0,0.5); cursor: pointer; text-indent: -9999px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; border-radius: 20px; box-shadow: inset 0 0 3px rgba(0,0,0,0.3);} .hs_cos_flex-control-paging li a:hover { background: #333; background: rgba(0,0,0,0.7); } .hs_cos_flex-control-paging li a.hs_cos_flex-active { background: #000; background: rgba(0,0,0,0.9); cursor: default; } .hs_cos_flex-control-thumbs {margin: 5px 0 0; position: static; overflow: hidden;} .hs_cos_flex-control-thumbs li {width: 25%; float: left; margin: 0;} .hs_cos_flex-control-thumbs img {width: 100%; display: block; opacity: .7; cursor: pointer;} .hs_cos_flex-control-thumbs img:hover {opacity: 1;} .hs_cos_flex-control-thumbs .hs_cos_flex-active {opacity: 1; cursor: default;} @media screen and (max-width: 860px) { .hs_cos_flex-direction-nav .hs_cos_flex-prev {opacity: 1; left: 0;} .hs_cos_flex-direction-nav .hs_cos_flex-next {opacity: 1; right: 0;} } .hs_cos_flex-slider .caption { background-color: black; position: static; font-size: 2em; line-height: 1.1em; color: white; padding: 0px 5% 0px 5%; width: 100%; top: 40%; text-align: center; } .hs_cos_flex-slider .superimpose .caption { color: white; font-size: 3em; line-height: 1.1em; position: absolute; padding: 0px 5% 0px 5%; width: 90%; top: 40%; text-align: center; background-color: transparent; } @media all and (max-width: 400px) { .hs_cos_flex-slider .superimpose .caption { background-color: black; position: static; font-size: 2em; line-height: 1.1em; color: white; width: 90%; padding: 0px 5% 0px 5%; top: 40%; text-align: center; } } .hs_cos_flex-slider h1, .hs_cos_flex-slider h2, .hs_cos_flex-slider h3, .hs_cos_flex-slider h4, .hs_cos_flex-slider h5, .hs_cos_flex-slider h6, .hs_cos_flex-slider p { color: white; } /* Thumbnail only version of the gallery */ .hs-gallery-thumbnails li { display: inline-block; margin: 0px; padding: 0px; margin-right:-4px; } .hs-gallery-thumbnails.fixed-height li img { max-height: 150px; margin: 0px; padding: 0px; border-width: 0px; } /* responsive pre elements */ pre { overflow-x: auto; } /* responsive pre tables */ table pre { white-space: pre-wrap; } /* Corrects width issues in table elements created via the wysiwyg editor */ table tr td img { max-width: initial; } /* adding minimal spacing for blog comments */ .comment { margin: 10px 0 10px 0; } /* make sure lines with no whitespace don't interefere with layout */ .hs_cos_wrapper_type_rich_text, .hs_cos_wrapper_type_text, .hs_cos_wrapper_type_header, .hs_cos_wrapper_type_section_header, .hs_cos_wrapper_type_raw_html, .hs_cos_wrapper_type_raw_jinja, .hs_cos_wrapper_type_page_footer { word-wrap: break-word; } /* HTML 5 Reset */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section { display: block; } audio, canvas, video { display: inline-block; *display: inline; *zoom: 1; } audio:not([controls]) { display: none; } /* Support migrations from wordpress */ .wp-float-left { float: left; margin: 0 20px 20px 0; } .wp-float-right { float: right; margin: 0 0 20px 20px; } /* Responsive Google Maps */ #map_canvas img, .google-maps img { max-width: none; } /* ========================================================================== 2. BASE STYLES ========================================================================== */ /* =============== Base =============== */ *, *:before, *:after { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; outline: 0; } html, body { min-height: 100%; margin: 0; padding: 0; } body { background: #fff; font-family: 'proxima-regular', Helvetica, Arial, sans-serif; font-size: 16px; line-height: 1.42857; color: #5d5d5d; position: relative; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } /* Page Center */ .container-fluid .row-fluid .page-center { float: none; max-width: 1100px; margin: 0 auto; } /* Highlighted Text */ ::-moz-selection { color: #fff; background: #39f; text-shadow: none; } ::selection { color: #fff; background: #39f; text-shadow: none; } /* =============== Typography =============== */ /* Basic text */ p { font-size: 20px; line-height: 34px; margin-top: 0; margin-bottom: 30px; color: #585858; } small {} strong {} em {} cite {} code {} pre {} sup, sub { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* Headings */ h1, h2, h3, h4, h5, h6 {} h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-weight: 100; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {} h1 { font-size: 35px; } h2 { font-size: 30px; color: #585858; line-height: 1.2; margin: 0 0 15px 0; padding: 0; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } h3 { font-size: 28px; color: #585858; line-height: 40px; margin: 0 0 20px; font-weight: 400; } h4 { font-size: 24px; font-weight: 400; margin: 0 0 10px; color: #585858; } h5 { font-size: 20px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } h6 { font-size: 18px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } /* Anchor Links */ a,a:visited { color: #08a145; text-decoration: none; } a:hover, a:focus { color: #08a145; text-decoration: none; } /* Lists */ ul, ol { list-style: none; margin: 0; padding: 0; } ul ul, ul ol, ol ol, ol ul {} li {} /* Block Quotes */ blockquote {} blockquote p {} blockquote small {} /* Horizontal Rules */ hr { margin-top: 20px; margin-bottom: 20px; border: 0; border-top: 1px solid #eeeeee; -webkit-box-sizing: content-box; box-sizing: content-box; height: 0; } .default-page .body-container ul, .default-page .body-container ol { list-style: disc; padding-left: 20px; margin-bottom: 15px; } /* =============== EU Cookie Confirmation Bar =============== */ /* Confirmation Outer Wrapper*/ #hs-eu-cookie-confirmation {} /* Confirmation Inner Wrapper*/ #hs-eu-cookie-confirmation-inner {} #hs-eu-cookie-confirmation-inner p{} /* Confirmation Button */ #hs-en-cookie-confirmation-buttons-area {} a#hs-eu-confirmation-button {} /* ========================================================================== 3. COS STRUCTURE ========================================================================== */ /* =============== Structure =============== */ /* The outer wrappers of your website */ .header-container-wrapper, .body-container-wrapper, .footer-container-wrapper {} /* The inner wrappers of your website */ .header-container, .body-container, .footer-container {} /* =============== Header =============== */ .header-container-wrapper {} .header-container {} #header { padding: 0 10px; background: #0c0e1a url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/masthead-bg3-e2ea3e6b.jpg) 0 0 repeat; position: fixed; color: #fff; border: none; top: 0; left: 0; width: 100%; z-index: 1000; -webkit-transition: height 0.3s; transition: height 0.3s; } #header .logo { text-align: left; } #header .page-center { text-align: center; padding: 15px 0; max-width: 1200px; } .header-col { width: auto !important; margin-left: 0 !important; } #header .black-logo { display: none; } #header .logo a img { width: 130px !important; -webkit-transition: height 0.5s cubic-bezier(0, 0, 0.3, 1); transition: height 0.5s cubic-bezier(0, 0, 0.3, 1); } #header.fixedNav { background: #fff; -webkit-transition: all 0.5s cubic-bezier(0, 0, 0.3, 1); transition: all 0.5s cubic-bezier(0, 0, 0.3, 1); height: 60px; top: 0; -webkit-box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2); box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2); } #header.fixedNav .white-logo { display: none; } #header.fixedNav .black-logo { display: inline-block; } #header .logo.logoAnimation img { height: 30px; -webkit-transition: height 0.5s; transition: height 0.5s; } #header.fixedNav .page-center { padding: 15px 0 0; } /* =============== Content =============== */ .body-container-wrapper {} .banner .banner-text { text-align: center; } .banner h2 { color: #fff; } .banner p { color: #fff; font-size: 16px; } .banner .get-started { padding: 0 10px; text-align: center; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .banner .get-started .g-s-button { display: inline-block; width: 100%; margin: 0; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; max-width: 500px; vertical-align: top; } .banner .get-started .g-s-button:hover { background: #08a145; } .desktop { display: none; } .banner .banner-img { position: relative; margin: 0 0 0 auto; } .content-wrapper {} .main-content {} .sidebar{} .sidebar.right{} .sidebar.left{} #site-wrapper { overflow: hidden; } /* =============== Footer =============== */ .footer-container-wrapper {} .footer-container {} #footer { padding: 50px 10px 30px; background-color: #0c0e1a; } .footer-bg .page-center { max-width: 1200px !important; } .footer-menu .hs-menu-wrapper>ul { display: block; } .footer-menu .hs-menu-wrapper>ul>li>a { color: #fbfbfb; font-size: 14px; margin-bottom: 13px; padding: 0; line-height: 24px; text-align: center; font-weight: 600; letter-spacing: 0; font-family: proxima-semibold, Helvetica, Arial, sans-serif; cursor: auto; } .footer-menu .hs-menu-wrapper>ul ul { opacity: 1 !important; visibility: visible !important; position: relative !important; display: block !important; } .footer-menu .hs-menu-wrapper>ul ul li { margin: 2px 0; padding: 2px 0; line-height: 1.42857; } .footer-menu .hs-menu-wrapper>ul ul li a { color: #a3a3a3; font-size: 14px; text-decoration: none; -webkit-transition: color 300ms; transition: color 300ms; font-family: proxima-regular, Helvetica, Arial, sans-serif; white-space: normal !important; } .footer-menu .hs-menu-wrapper>ul ul li a:hover { color: #0abe51; } .footer-social { float: right !important; text-align: center; } .footer-social ul li { display: inline-block; float: none; margin: 0px 10px; } .footer-social ul li a { color: #a3a3a3; font-size: 14px; text-decoration: none; -webkit-transition: color 300ms; transition: color 300ms; font-family: proxima-regular, Helvetica, Arial, sans-serif; display: block; } .footer-sprite { display: block; margin: 0 auto 5px; background-image: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/footer-social-icons-7c34bb2f.svg); background-size: 48px; background-repeat: no-repeat; width: 42px; height: 42px; } .facebook-flock { background-position: -3px -3px } .facebook-flock:hover { background-position: -3px -147px } .twitter-flock { background-position: -3px -51px } .twitter-flock:hover { background-position: -3px -195px } .linkedin-flock { background-position: -3px -99px } .linkedin-flock:hover { background-position: -3px -243px } .footer-copyright { padding-top: 15px; text-align: center; color: #f9f9f8; font-size: 14px; font-family: proxima-regular, Helvetica, Arial, sans-serif; float: none; line-height: 24px; } .footer-copyright a { display: inline-block; margin: 0 auto; text-decoration: none; -webkit-transition: color 300ms; transition: color 300ms; font-size: 14px; color: #a3a3a3; } .footer-copyright a:hover { color: #0abe51; } .footer-copyright span { display: block; width: 100%; } .footer-copyright span#date-elm { display: inline; } /* ========================================================================== 4. MAIN NAVIGATION ========================================================================== */ /* =============== Custom Menu Primary =============== */ /* Parent List */ .custom-menu-primary { position: fixed; height: 100%; width: 0; right: 0; top: 0; float: none; z-index: 10; -webkit-transition: width 0.5s cubic-bezier(0, 0, 0.3, 1); transition: width 0.5s cubic-bezier(0, 0, 0.3, 1); } .custom-menu-primary .hs-menu-wrapper>ul { display: block; } .custom-menu-primary .hs-menu-wrapper>ul>li { padding-bottom: 15px; } .custom-menu-primary .hs-menu-wrapper>ul>li>a { display: inline-block; color: #fff; font-size: 14px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; padding: 3px 6px; -webkit-transition: all 0.5s; transition: all 0.5s; text-decoration: none; outline: 0; text-transform: uppercase; } .custom-menu-primary .hs-menu-wrapper > ul > li > a:hover{} /* Child List */ .custom-menu-primary .hs-menu-wrapper > ul ul{ } .custom-menu-primary .hs-menu-wrapper > ul ul li{} .custom-menu-primary .hs-menu-wrapper > ul ul li a{} .custom-menu-primary .hs-menu-wrapper > ul ul li a:hover{} /* Override max width on menu links */ .custom-menu-primary .hs-menu-wrapper > ul li a, .hs-menu-wrapper.hs-menu-flow-horizontal > ul li.hs-item-has-children ul.hs-menu-children-wrapper li a { overflow: visible !important; max-width: none !important; width: auto !important; } /* Fix menu disappearing on desktop after toggling mobile menu */ @media screen and (min-width:1000px) { .custom-menu-primary .hs-menu-wrapper, .custom-menu-primary .hs-menu-wrapper > ul ul { display:block !important; } } /* =============== Mobile Toggle Menu =============== */ /* Hide button on Desktop */ .mobile-trigger, .child-trigger{ display: none; } @media (max-width: 999px){ /* Menu Reset */ .custom-menu-primary, .custom-menu-primary .hs-menu-wrapper > ul, .custom-menu-primary .hs-menu-wrapper > ul li, .custom-menu-primary .hs-menu-wrapper > ul li a{ display: block; float: none; position: static; top: auto; right: auto; left: auto; bottom: auto; padding: 0px; margin: 0px; background-image: none; background-color: transparent; border: 0px; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; max-width: none; width: 100%; height: auto; line-height: 1; font-weight: normal; text-decoration: none; text-indent: 0px; text-align: left; color:#fff; } } /* ========================================================================== 5. BLOG ========================================================================== */ /* =============== General Blog Styles =============== */ /* Blog Post and Listing Body Class */ .blog {} /* Blog Post */ .hs-blog-post {} /* Blog Listing */ .hs-blog-listing {} /* Blog Columns Wrapper */ .blog .content-wrapper {} /* =============== Blog Content Column =============== */ .blog .blog-content {} /* Use this to style the main wrapper for the blog listing pages */ .blog-listing-wrapper {} /* Use this to style the main wrapper for the blog post pages */ .blog-post-wrapper {} /* Blog Title */ .hs-blog-header h1 {} .hs-blog-header h1 a{} /* Blog Post Title */ .post-header h2 {} .post-header h2 a { text-decoration: none; } /* Blog Author and Avatar */ #hubspot-author_data {} #hubspot-author_data:after { content: ''; display: block; clear: both; } #hubspot-author_data a.author-link {} #hubspot-author_data .hs-author-avatar {} #hubspot-author_data .hs-author-avatar img { width: 50px; float: left; margin-right: 15px; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; } /* Use this to set up different styling for your blog posts */ .blog-listing-wrapper .post-listing .post-item { border-bottom: 1px solid #cccccc; padding: 0 0 20px; margin: 0 0 20px; } .blog-listing-wrapper .post-listing .post-item .post-body {} .blog-post-wrapper .post-body {} /* Post Featured Image on Listings Page */ .hs-featured-image-wrapper {} .hs-featured-image-wrapper .hs-featured-image-link {} .hs-featured-image-wrapper .hs-featured-image-link img.hs-featured-image{ border-width: 0; max-height: 170px; max-width: 210px; height: auto; width: auto; display: inline-block !important; float: right; margin: 20px 0 20px 20px; } /* Read More Link */ a.more-link { display: inline-block; padding-top: 20px; } /* Blog Topics List */ #hubspot-topic_data {} #hubspot-topic_data a.topic-link {} /* Blog Social Sharing Icons */ .hs-blog-social-share { margin-top: 20px; padding: 10px 0 0 0; border-top: 1px solid #cccccc; border-bottom: 1px solid #cccccc; height: auto; } /* Blog Commments */ #comments-listing { border-bottom: 1px solid #ccc; margin-bottom: 30px; margin-top: 30px; } .custom_listing_comments { border: 1px solid #ccc; padding: 10px; margin: 10px 0; } .comment { margin: 10px 0; border-top: 1px solid #ccc; padding: 15px 0; } .comment-date { font-size: 13px; text-align: right; } .comment-from { font-weight: bold; } .comment-body { padding: 10px 0; } /* Pagination */ .blog-pagination {} .blog-pagination a { display: block; } .blog-pagination a.previous-posts-link {} .blog-pagination a.all-posts-link {} .blog-pagination a.next-posts-link {} /* Blog All Posts Page */ .hs-content-path-blog-all {} div.post-listing-simple {} div.post-listing-simple .post-item {} h2.post-listing-simple {} h2.post-listing-simple a {} /* =============== Blog Sidebar =============== */ .blog .blog-sidebar {} /* Blog Modules */ .blog .blog-sidebar .widget-span { margin-bottom: 30px; } /* =============== Blog Author Page and Author Bio =============== */ .hs-blog-listing .hs-author-profile { border-bottom: 1px solid #ccc; padding: 0 0 20px 0; margin: 0 0 20px 0; } .hs-blog-post .hs-author-profile { border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; padding: 20px 0 20px 0; margin: 20px 0 20px 0; } .hs-author-profile .hs-author-profile:after { content: ''; display: block; clear: both; } /* Author Avatar */ .hs-author-profile .hs-author-avatar { float: left; margin-right: 15px; max-width: 100px; } .hs-author-profile .hs-author-avatar img{ -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; max-width: 100%; } /* Author Bio Wrapper*/ .hs-author-profile .hs-author-bio { overflow: hidden; } /* Author Name */ .hs-author-profile h2.hs-author-name { margin: 0 0 10px 0; } /* Author Social Follow Me */ .hs-author-profile .hs-author-social-section {} .hs-author-profile .hs-author-social-label {} .hs-author-profile .hs-author-social-links {} .hs-author-profile .hs-author-social-link {} .hs-author-profile .hs-social-facebook {} .hs-author-profile .hs-social-linkedin {} .hs-author-profile .hs-social-twitter {} .hs-author-profile .hs-social-google-plus {} /* -------------- Default Code for comment ------------ */ #comments-listing { border: 1px solid #ccc; margin-bottom: 30px; margin-top: 30px; } .comment.depth-0 { border-bottom: 1px solid #000 !important; border-top: medium none !important; margin: 0 10px 10px !important; padding: 0 15px !important; } .comment-body { border-bottom: medium none; color: inherit; display: block; font-family: inherit; font-size: inherit; line-height: inherit; padding: 0; } .comment-reply-to{ margin-bottom: 15px; } .comment-from h4 { margin: 0; padding-top: 15px; } .comment-date { color: inherit !important; display: block !important; text-align: left; } /* -------------------- Ends ----------- */ /* -------------- Default Code for Author Bio ------------ */ #hubspot-author_data .hs-author-avatar { max-width: 70px; padding: 10px 10px 10px 0; } #hubspot-author_data .hs-author-avatar img { height: auto !important; max-width: 100%; } .hs-blog-social-share { border-bottom: 1px solid #cccccc; border-top: 1px solid #cccccc; height: auto; margin-top: 10px; padding: 10px 0 0; } #comments-listing.no-comments { border: none; } .subscribe-options label { display: block; } input[type="search"]{ -webkit-appearance: none; } input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration { display: none; } #hs-pwd-widget-password { margin: 0 0 15px 0 !important; } .blog span.IN-widget { vertical-align: unset !important; } /*========= Search Suggestions/Result Style =========*/ .body-container .hs-search-field--open .hs-search-field__suggestions { list-style: none; padding: 10px; } .body-container .hs-search-field--open .hs-search-field__suggestions a{ padding: 1px 5px; } .body-container .hs-search-results .hs-search-results__listing { padding: 10px 0; } .body-container .hs-search-field--open .hs-search-field__suggestions li:before { display: none; } .body-container .hs-search-field--open .hs-search-field__suggestions li { margin-bottom: 6px; } .body-container .hs-search-field--open .hs-search-field__suggestions li#results-for { margin-bottom: 10px; } .section.post-body img { float: none !important; display: block; margin: 10px auto !important; } /* -------------------- Ends ----------- */ /* ========================================================================== 6. FORMS ========================================================================== */ /* =============== Global Form Styles =============== */ /* Form Field */ .hs-form-field { margin-bottom: 20px; } /* Descriptions */ .hs-field-desc {} /* Labels and Legends */ label {} .hs-form-field > label {} /* One Line Inputs */ input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], input[type="file"], textarea, select { font-family: inherit; display: block; width: 100%; margin: 0; line-height: 30px; font-size: inherit; border: 1px solid #dbdbdb; padding: 10px 15px; background: #fff; color: #585858; border-radius: 6px; outline: none; max-width: 500px; } input[type="text"]:focus, input[type="password"]:focus, input[type="datetime"]:focus, input[type="datetime-local"]:focus, input[type="date"]:focus, input[type="month"]:focus, input[type="time"]:focus, input[type="week"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="url"]:focus, input[type="search"]:focus, input[type="tel"]:focus, input[type="color"]:focus, input[type="file"]:focus, textarea:focus, select:focus {} /* Separate Styles for Multiple Line Inputs */ textarea {} textarea:focus {} /* Separate Styles for Drop Downs */ select {} select:focus {} /* Multiple Selection Inputs */ form.hs-form .hs-form-field ul.inputs-list { list-style: none; padding: 0; margin: 0; } form.hs-form .hs-form-field ul.inputs-list li input {} input[type="radio"] {} input[type="checkbox"] {} /* Required */ input:focus:required:invalid, textarea:focus:required:invalid, select:focus:required:invalid {} input:focus:required:invalid:focus, textarea:focus:required:invalid:focus, select:focus:required:invalid:focus {} /* Error */ .hs-error-msgs { margin: 0; font-size: 12px; color: #ff3b47; line-height: 34px; text-align: left; } .hs-error-msgs label{} /* Placeholder Text */ ::-webkit-input-placeholder {} /* Webkit Browsers */ :-moz-placeholder {} /* Firefox 18- */ ::-moz-placeholder {} /* Firefox 19+ */ :-ms-input-placeholder {} /* IE10 */ /* =============== Multi Column Form =============== */ .hs-form fieldset.form-columns-1 {} .hs-form fieldset.form-columns-1 .hs-form-field {} .hs-form fieldset.form-columns-2 {} .hs-form fieldset.form-columns-2 .hs-form-field {} .hs-form fieldset.form-columns-3 {} .hs-form fieldset.form-columns-3 .hs-form-field {} /* Multiple Selection Inputs */ form.hs-form .hs-form-field ul.inputs-list li input {} input[type="radio"] {} input[type="checkbox"] {} form.hs-form fieldset { max-width: none; } form.hs-form fieldset .hs-form-field { padding: 0 10px 0 0; } form.hs-form fieldset[class*="form-columns"] .input { margin-right: 0; } form.hs-form fieldset[class*="form-columns"] .hs-input { width: 100%; } form.hs-form fieldset[class*="form-columns"] .hs-input[type="checkbox"] { width: auto; } form.hs-form fieldset.form-columns-3 .hs-form-field { width: 33.33%; } @media (max-width: 400px) { form.hs-form fieldset .hs-form-field { padding: 0; } form.hs-form fieldset.form-columns-3 .hs-form-field, form.hs-form .form-columns-2 .hs-form-field .hs-input, form.hs-form .form-columns-3 .hs-form-field .hs-input { width: 100%; } form.hs-form .form-columns-3 .hs-form-field .hs-input[type="checkbox"] { width: auto; } } /* =============== Blog Comment Form =============== */ /* Label */ #comment-form .hs-form-field > label {} #comment-form label {} /* Inputs */ #comment-form input[type="text"] {} #comment-form input[type="text"]:focus {} #comment-form textarea {} #comment-form textarea:focus {} #comment-form input[type="checkbox"] {} /* =============== Blog Subscription Form =============== */ /* Label */ #hs_form_target_blog_subscription .hs-form-field > label {} #hs_form_target_blog_subscription label {} /* Inputs */ #hs_form_target_blog_subscription input[type="email"] {} #hs_form_target_blog_subscription input[type="email"]:focus {} #hs_form_target_blog_subscription input[type="radio"], #hs_form_target_blog_subscription input[type="checkbox"] { width: auto; margin-right: 10px; } /* =============== Google Search Form =============== */ /* Label */ .widget-type-google_search label {} /* Input */ .widget-type-google_search input[type="text"] {} .widget-type-google_search input[type="focus"] {} /* ========================================================================== 7. BUTTONS ========================================================================== */ /* =============== All Global Buttons (Excluding CTAs) =============== */ .hs-button.primary, input[type="submit"], input[type="button"] { cursor: pointer; -webkit-appearance: none; text-decoration: none !important; display: inline-block; margin: 0 0 15px; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; font-family: inherit; } .hs-button.primary:hover, input[type="submit"]:hover, input[type="button"]:hover { background: #08a145; } .hs-button.primary:focus, input[type="submit"]:focus, input[type="button"]:focus {} /* =============== Form Module Button =============== */ .hs_cos_wrapper_type_form .hs-button.primary.large {} .hs_cos_wrapper_type_form .hs-button.primary.large:hover {} .hs_cos_wrapper_type_form .hs-button.primary.large:focus {} /* =============== Blog Comment Button =============== */ #add-comment-button.hs-button.primary {} #add-comment-button.hs-button.primary:hover {} #add-comment-button.hs-button.primary:focus {} /* =============== Blog Subscription Button =============== */ #hs_form_target_blog_subscription .hs-button.primary.large {} #hs_form_target_blog_subscription .hs-button.primary.large:hover {} #hs_form_target_blog_subscription .hs-button.primary.large:focus {} /* =============== Google Search Button =============== */ .widget-type-google_search .hs-button.primary {} .widget-type-google_search .hs-button.primary:hover {} .widget-type-google_search .hs-button.primary:focus {} @media only screen and (min-width: 1000px){ input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], input[type="file"], textarea, select { padding: 14px 20px; font-size: 20px; } .hs-button.primary, input[type="submit"], input[type="button"] { display: inline-block; width: auto; padding: 15px 20px; font-size: 22px; vertical-align: top; } } /* ========================================================================== 8. MISCELLANEOUS ========================================================================== */ [role="button"] { cursor: pointer } .slick-slider { position: relative; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-touch-callout: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent } .slick-list { position: relative; overflow: hidden; display: block; margin: 0; padding: 0 } .slick-list:focus { outline: none } .slick-list.dragging { cursor: pointer; cursor: hand } .slick-slider .slick-track,.slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0) } .slick-track { position: relative; left: 0; top: 0; display: block; margin-left: auto; margin-right: auto } .slick-track:before,.slick-track:after { content: ""; display: table } .slick-track:after { clear: both } .slick-loading .slick-track { visibility: hidden } .slick-slide { float: left; height: 100%; min-height: 1px; display: none } [dir="rtl"] .slick-slide { float: right } .slick-slide img { display: block } .slick-slide.slick-loading img { display: none } .slick-slide.dragging img { pointer-events: none } .slick-initialized .slick-slide { display: block } .slick-loading .slick-slide { visibility: hidden } .slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent } .slick-arrow.slick-hidden { display: none } .slick-arrow { display: none } .slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before { opacity: 1 } .slick-prev.slick-disabled:before,.slick-next.slick-disabled:before { opacity: .25 } .slick-prev,.slick-next { font-size: 0; line-height: 0; position: absolute; display: block; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; width: 30px; height: 60px; -webkit-transform: scale(0.7); -ms-transform: scale(0.7); transform: scale(0.7); top: 37%; bottom: auto } .slick-next { right: -27px } .slick-next:before { content: ""; background: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/arrow-1c6ffa88.png") no-repeat 0 0; width: 19px; height: 38px; display: inline-block; background-size: 100%; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg) } .slick-prev { left: -27px } .slick-prev:before { content: ""; background: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/arrow-1c6ffa88.png") no-repeat 0 0; width: 19px; height: 38px; display: inline-block; background-size: 100% } .flock-vs-slack2 .hs-flock-hdr .fixed-product-keys { background: transparent; } /* .flock-vs-slack2 .about-flock h3 { margin: 0; text-align: center; } .flock-vs-slack2 .about-flock h3+p { text-align: center; } */ .flock-vs-slack2 .bottom-get-started form { width: auto; } .flock-vs-slack2 .bottom-get-started form ul.no-list.hs-error-msgs.inputs-list { top: auto; } .flock-vs-slack2 .bottom-get-started form li { line-height: 1; } .why-flock5 #header { background: #fff !important; } .why-flock5 #header.fixedNav { background: #fff !important; } .why-flock5 { padding: 0; } .why-flock5 .case-study-videos img.video-play-btn.play-video { transform: none; } .why-flock5 ._get-started .hs_error_rollup { left: 0; } .why-flock5 .hs-get-work-done form>.hs_error_rollup { position: absolute; left: 0; bottom: -30px; } .why-flock5 .hs-get-work-done form ul.no-list.hs-error-msgs.inputs-list { position: absolute; bottom: -15px; width: 100%; text-align: left; line-height: 1; } .why-flock5 .hs-get-work-done form>.hs_error_rollup ul.no-list.hs-error-msgs.inputs-list { position: relative; bottom: 0; } .why-flock5 .two-columns ul { max-width: 100%; } .why-flock-rmkt .two-col-slider .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-slide p:first-child { font-weight: 100; padding: 0 0 4px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .why-flock-rmkt #header { background: #fff !important; } .flock-vs-slack2 .hs-get-work-done form .hs-button { background: #0c8e45; } .close-video-modal2 { background: #fff; border-radius: 50%; color: #000; width: 25px; height: 25px; position: fixed; top: 20px; right: 20px; cursor: pointer; } .close-video-modal2:before { content: 'x'; display: block; position: relative; top: -3px; left: 7px; font-size: 20px; } .comparison-table-wrapper .download-block { background: #fff; max-height: 450px; padding: 15px 15px 15px 10px; overflow-y: auto; border-radius: 5px; } .comparison-table-wrapper .download-block ul { text-align: left; list-style-type: decimal; padding: 0 0 0 20px; } .comparison-table-wrapper .download-block ul li { margin: 0 0 10px; text-align: left; } .hipchat-page .custom-menu-primary .hs-menu-wrapper>ul>li.signin, .stride-migration .custom-menu-primary .hs-menu-wrapper>ul>li.signin{ display: none; } .hipchat-page .custom-hipchat-bottom-form .hs_email { margin: 0; vertical-align: middle; } .hipchat-page .custom-hipchat-bottom-form .hs_submit.hs-submit { display: inline-block; vertical-align: middle; } .hipchat-page .custom-hipchat-bottom-form .actions { position: static; } /* .customer-page .customer-middle-section .customer-section-middle-flexi .content-block a { text-decoration: underline; } */ .hs-signup-layout form._g-s-form .hs-error-msgs { position: absolute; left: 0; top: 100%; } .hs-signup-layout form._g-s-form .hs_error_rollup .hs-error-msgs { position: static; } .hs-signup-layout form._g-s-form .hs_error_rollup { position: absolute; top: 100%; margin: 13px 0 0; left: 0; } .hs-signup-layout .customers-logo .logo-box { margin: 0; } .team-collaboration-page ._get-started .hs_error_rollup { left: 0; } .team-collaboration-page .team-collaboration-banner .get-started-v2 form { padding: 0; margin: 0 0 60px; } .hs-why-flock4-page .case-study-videos .video-play-btn { -webkit-transform: none; transform: none; } .hs-why-flock4-page { padding: 0; } .hs-why-flock4-page .header-section { margin-top: 73px; } .hs-why-flock4-page .get-started-v2 ._get-started .hs_error_rollup { left: 0; } .cm-two-col-startups-mod.right-block a[href=''] { cursor: auto; } .cm-startups-copyright p a:hover { color: #ddd; } .hs-startups-layout a.knowmore-btn:hover { color: #fff; background: #08a145; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .hs-startups-layout .bottom-get-started ._get-started .hs_error_rollup { left: 93px; } .why-flock-rmkt #security-priority .soc { width: 120px; height: 50px; } .why-flock-rmkt #security-priority .left-block { margin: 0 0 30px; } .green-button:hover { background: #08a145; color: #fff; } .hs-apps-layout .unit-wrap:after { content: ''; display: block; clear: both; } .signup-pro ._get-started .hs_error_rollup { left: auto; right: auto; } .signup-pro .bottom-get-started form { display: inline-block; width: auto; } .offer-banner .left-section form ul.no-list.hs-error-msgs.inputs-list { line-height: 1; position: absolute; margin: 2px 0 0; top: 100%; } .offer-banner .left-section form .hs-form-field { position: relative; } .offer-banner .left-section form .hs_error_rollup ul.no-list.hs-error-msgs.inputs-list { position: static; } .custom-error-page .body-container { padding: 0; } .custom-error-message-wrapper.page-center { padding: 62px 10px 40px 10px; min-height: 302px; text-align: center; font-family: proxima-regular,Helvetica, Arial, sans-serif; } /* .hs-home-layout.hs-home-layout.hipchat-migration #main-area { min-height: 718px; } */ @media (min-width: 700px) { .mail .col-row h3 { line-height: normal !important; } } @media (min-width: 1000px) { .signup-pro .customers-logo .logo-box { padding: 70px 10px; } .signup-pro .logo-box h2 { padding: 0; margin: 0 0 60px; } .hs-apps-layout .unit-wrap .left-unit:first-child:last-child { float: left; } .why-flock-rmkt .two-col-slider .csm-slider-with-thumbnail-content .api-img-slider { width: 800px; left: 0; } .hs-why-flock4-page .header-section { margin-top: 97px; } .hs-signup-layout.signup-pro .signup-feature-unit .single-row { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .customer-page .params-block { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .customer-page .parameter-section .params-unit:not(:last-child) { margin-right: 140px; } .hipchat-page .custom-hipchat-bottom-form-wrapper { text-align: center; } .hs-hipchat-layout.hipchat-page .custom-hipchat-bottom-form-content, .hs-hipchat-layout.hipchat-page .custom-hipchat-bottom-form { display: inline-block !important; float: none !important; margin: 0 !IMPORTANT; } .comparison-table-wrapper .download-block { max-width: 600px; max-height: inherit; padding: 50px; } .why-flock-rmkt .why-flock-fb1 .csm-slider-with-thumbnail-content .link-and-arrow { display: block; margin: 80px 0 0; margin-top: 40px; text-align: left; padding-left: 25px; } .why-flock5 .case-study-videos .video-block { max-width: 330px; } .why-flock5 .case-study-videos .video-block p { font-size: 18px; line-height: 26px; } .flock-vs-slack2-row1 .bottom-get-started .hs-form-field { margin: 0; } .flock-vs-slack2-row1 .bottom-get-started .hs-form-field .hs-input { margin: 0 -4px 0 0; border-radius: 6px 0 0 6px; border: 1px solid #dbdbdb; height: 62px; } .flock-vs-slack2-row1 .bottom-get-started .hs-submit { margin: 0; } .flock-vs-slack2-row1 .bottom-get-started .hs-submit .hs-button { border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; background: #0c8e45; } .flock-vs-slack2-row1 .bottom-get-started .g-s-download { margin-top: 15px; } } @media (min-width: 1100px) { .why-flock-rmkt .two-col-slider .csm-slider-with-thumbnail-content .api-img-slider { left: -50px; } } @media (max-width: 1200px) and (min-width: 900px) { .flock-vs-slack2.hipchat-migration #main-area h2 { font-size: 54px !important; padding: 0 !important; } } @media (max-width: 1200px) and (min-width: 1000px) { .why-flock-rmkt .two-col-slider .csm-slider-with-thumbnail-content .api-img-slider { width: 100%; } .hs-indexa-page ._get-started .hs-form-field { width: 232px; } .hs-indexa-page div#main-area { min-height: 672px !important; } .flock-vs-slack2.hipchat-migration .home-page .block-content { padding-top: 72px; padding-left: 10px; padding-right: 10px; } .why-flock2-row1 .about-flock{ padding-left: 10px; padding-right: 10px; } div#hs_cos_wrapper_module_15547268782173059 .banner .banner-img { left: -55px !important; } .csm-hipchat-page #main-area { padding: 0px 10px; } .csm-hipchat-page .unit.custom-need-more { padding: 0px 10px; } } @media (max-width: 1200px) and (min-width: 1101px) { .why-flock-rmkt .banner-with-text-slider .mast-head.mast-head3 { max-width: 700px !important; height: 420px !important; } } @media (max-width: 1100px) and (min-width: 1000px) { .why-flock-rmkt .banner-with-text-slider .mast-head.mast-head3 { max-width: 600px !important; height: 360px !important; } } @media (max-width: 999px) { .custom-error-message-wrapper.page-center { padding: 87px 10px 40px 10px; min-height: 326px; } .why-flock-fb .fixed-product-keys:not(.show) { height: 0; } .why-flock4-gtr.gartner-wrap .gartner-section .gartner-badge { width: 100px; height: 100px; } .flock-vs-slack2-row1 .bottom-get-started ._get-started .g-s-mobile { margin: 0; } .flock-vs-slack2-row1 .bottom-get-started ._get-started .g-s-button { background: #0c8e45; } .flock-vs-slack2.hipchat-migration #main-area h2 { padding: 20px 10px 15px 10px !important; } .hs-get-work-done .title p { text-align: center; } .hipchat-page ._g-s-mobile a._g-s-button.js-mobile-download { background: #0abe51; } .hipchat-page ._g-s-mobile a._g-s-button.js-mobile-download:hover { background: #08a145; } .comparison-table-wrapper .download-block { height: calc(100vh - 110px); } .hs-signup-layout.signup-pro .header-section .header-wrap { padding-top: 86px; } .hs-signup-layout.signup-pro .header-section { min-height: 576px; } .hs-signup-layout ._g-s-mobile a._g-s-button.js-mobile-download:not(:hover) { background: #0abe51; } .hs-indexa-page.hipchat-migration .home-page .block-content .right-section ._g-s-label { font-size: 18px; } } @media (max-width: 767px) { .download .large_screen_wrapper .left_block .mac_app_img { DISPLAY: BLOCK !important; FLOAT: NONE; margin: 20px auto !important; } } @media (max-width: 699px) { .single-block { max-width: 100%; } .single-block span.formula-row { max-width: 100%; display: block; white-space: normal; min-width: 1px; } } @media (max-width: 412px) { .why-flock-rmkt #security-priority .soc { height: 0; padding-bottom: 14%; } } @media (max-width: 399px) { .table-pricing * { font-size: 11px !important; } } /* Usecases Page */ .usecase-page .body-container, .video-page .body-container, .customer-page .body-container{ padding: 0; } .section-wrapper { padding: 25px 0; margin: 0 auto; } .usecase-section1-flexi .hs_cos_wrapper_type_module:first-child .section-wrapper { padding-top: 0; } .usecase-section1-flexi .hs_cos_wrapper_type_module:last-child .section-wrapper { padding-bottom: 0; } .section-wrapper .content-text h6 { margin: 0 0 20px; letter-spacing: -1px; text-align: center; } .section-wrapper .content-text ul { margin: 0 0 30px; } .section-wrapper .content-text li { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/engineering-img-bullet-ca752315.png) no-repeat 0px 3px; background-size: 12px; padding: 0 0 0 20px; margin: 0 0 15px; font-size: 12px; } .section-wrapper .content-img .slick-dots { text-align: center; margin-top: 5px; } .section-wrapper .content-img .slick-dots li { position: relative; display: inline-block; margin: 0 5px; padding: 0; cursor: pointer; } .section-wrapper .content-img .slick-dots li button { font-size: 0; line-height: 0; width: 20px; height: 3px; padding: 0; border: none; background: #e1e1e1; cursor: pointer; border-radius: 0; outline: none; } .section-wrapper .content-img .slick-dots li.slick-active button { background: #0abe51; } .integration-tools { text-align: center; } .integration-tools h6 { margin: 0 0 20px; } .integration-tools .integration-logo { display: inline-block; margin: 0 15px 20px; vertical-align: top; } .integration-tools span { background-size: contain; width: 60px; -webkit-box-shadow: 0 1px 6px 0 rgba(138,138,138,0.5); box-shadow: 0 1px 6px 0 rgba(138,138,138,0.5); height: 60px; display: block; border-radius: 7px; margin: 0 0 10px; background-repeat: no-repeat; background-position: center; background-color: #fff; } .integration-tools span:hover { -webkit-box-shadow: 0 1px 6px 2px rgba(138,138,138,0.5); box-shadow: 0 1px 6px 2px rgba(138,138,138,0.5); } .integration-tools p { font-size: 12px; margin: 0; line-height: normal; } .integration-tools .more-apps-btn { font-size: 14px; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; padding: 7px 12px; margin: 10px 0 0; border: 1px solid #0abe51; border-radius: 5px; color: #0abe51; display: inline-block; } .integration-tools .more-apps-btn:hover { background: #0abe51; color: #fff; } .testimonial .testimonial-wrapper { text-align: center; max-width: 870px !important; } .testimonial p { font-size: 12px; line-height: 1.5; } .testimonial p.testimonial-name { margin-bottom: 0; } .testimonial .testimonial-name { font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; } .testimonial .testimonial-quote { margin: 0 0 15px; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; } .testimonial .testimonial-quote:before, .testimonial .testimonial-quote:after { content: " "; display: inline-block; line-height: 1.2; height: 6px; width: 6px; position: relative; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/quotes-3fffa6e8.svg) no-repeat 0 0; background-size: 100%; } .testimonial .testimonial-quote:after { right: -4px; top: -4px; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .testimonial .testimonial-quote:before { left: -4px; top: -4px; } .testimonial .slick-prev { left: -40px; top: 0; } .testimonial .slick-next { right: -40px; top: 0; } .bottom-get-started{ background: #f7f7f7; } ._get-started { padding: 0 10px; text-align: center; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .bottom-get-started ._get-started { padding: 40px 10px; } .bottom-get-started p, .bottom-get-started .g-s-download, .bottom-get-started .g-s-download a{ color: inherit; } ._get-started .form-title { margin: 0; } ._get-started .hs-form-field>label { display: block; } ._get-started .hs-form-required { display: none; } ._get-started .hs-input { display: block; width: 100%; margin: 0; padding: 10px 15px; line-height: 30px; border: 0; background: #fff; color: #585858; font-family: inherit; outline: none; border: 1px solid #dbdbdb; border-radius: 6px; overflow: hidden; -webkit-transition: all 300ms; transition: all 300ms; } .hs-input.error { border-color: #ff3b47; } ._get-started .hs-button { display: inline-block; width: 100%; margin: 0; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; font-family: inherit; text-transform: none; letter-spacing: normal; } ._get-started .hs-form-field { position: relative; width: 100%; margin-bottom: 10px; } ._get-started .hs-submit { display: inline-block; margin-left: 4px; } ._get-started .hs-button:hover{ background: #08a145; } .bottom-get-started .g-s-download a { color: #585858; } .hs-home-main .bottom-get-started .g-s-download p a:hover { opacity: 0.8; } .hs-home-main .brands-inline .brands-wrap { border-top: 1px solid rgba(0,0,0,0.1); } ._get-started .g-s-label { display: inline-block; color: #fff; font-size: 22px; position: relative; line-height: 1.4; letter-spacing: -0.8px; } .bottom-get-started .g-s-label { color: #585858; } .bottom-get-started form { position: relative; display: inline-block; max-width: 700px; margin: 0 auto; text-align: center; width: 100%; } .bottom-get-started ul.hs-error-msgs { margin: 0; padding: 0; list-style: none; text-align: left; } .bottom-get-started ul.hs-error-msgs label { font-size: 22px; line-height: 34px; } .videos { display: block; width: 100%; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .videos.video-section .slick-list { padding: 0 10% 0 0; } .videos .slick-track { margin-left: 0; } .videos .video-block { padding: 0 25px 0 0; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .videos .video-block .screen { width: 240px; height: 144px; background: #f1f1f1; -webkit-box-sizing: border-box; box-sizing: border-box; cursor: pointer; overflow: hidden; position: relative; } .videos img.video-play-btn { position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: 90px; z-index: 2; } .videos .video-block .screen:after { content: " "; position: absolute; top: 0; width: 100%; height: 100%; background: transparent; -webkit-transition: background 0.3s ease-in; transition: background 0.3s ease-in; } .videos .video-block .screen:hover:after { background: rgba(0,0,0,0.2); -webkit-transition: background 0.3s ease-in; transition: background 0.3s ease-in; } .videos .video-block .content { display: block; padding-top: 25px; } .videos p { font-size: 18px; line-height: 1.3; margin-bottom: 0; color: #888; } .videos .page-center { padding: 50px 20px; } .video-page .hs_cos_wrapper_type_module:nth-child(1) .videos .page-center { padding-bottom: 20px; } .videos .video-block a { color: #0abe51; padding-top: 15px; display: inline-block; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; } .videos-banner { display: block; width: 100%; background-color: #000; position: relative; color: #fff; background-repeat: repeat; background-position: 0 0; } .top-section .flockos-wrap { text-align: center; padding-top: 50px; } body.video-page { padding-top: 0; } .top-section h5 { padding-top: 20px; letter-spacing: -0.6px; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .videos .slick-prev, .videos .slick-next { top: 37px; } .video-modal { position: absolute; top: 0; bottom: 0; width: 100%; height: 100%; z-index: 1000000 } .video-bg { background: rgba(0,0,0,0.8); height: 100%; width: 100%; position: fixed; top: 0; bottom: 0; left: 0; right: 0 } body.body--fixed { overflow: hidden; } .video-blurb { position: fixed; top: 50%; left: 50%; min-width: 300px; min-height: 300px; text-align: center; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .video-blurb:before { content: ''; position: absolute; top: 50%; left: 50%; background: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock%20Website%20Media/loader-white.gif") no-repeat 0 0; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: inline-block; width: 30px; height: 30px; background-size: 100%; z-index: -1 } .video-box { padding: 0 15px; max-width: 600px; margin: 0 auto 25px } .video { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden } .video iframe,.video object,.video embed { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .close-video-modal { background: #fff; border-radius: 50%; color: #000; width: 25px; height: 25px; position: fixed; top: 20px; right: 20px; cursor: pointer } .close-video-modal:before { content: 'x'; display: block; position: relative; top: -3px; left: 7px; font-size: 20px } .videos-banner .page-center { padding: 70px 40px; } .video-section .slick-slide { outline: none; padding-right: 10px; } /* ====== Customer======= */ .header-section { display: block; position: relative; min-height: 650px; background-color: #0c0e1a; background-repeat: repeat; background-position: 0 0; } .header-section .header-wrap { max-width: 1100px; margin: 0 auto; padding: 130px 10px 0; } .header-section .header-content-detail { display: block; position: relative; background: #fff; padding: 40px 20px 30px 20px; -webkit-box-sizing: border-box; box-sizing: border-box; } body.customer-page { padding: 0; } .header-section .left-block { display: block; width: 100%; text-align: center; margin-bottom: 40px; } /* .header-section .left-block img { max-width: 142px; } */ .header-section .left-block h1.heading { font-family: proxima-regular, Helvetica, Arial, sans-serif; font-size: 30px; font-weight: 600; color: #585858; margin: 30px 0 0 0; padding: 0; letter-spacing: -0.8px; line-height: 1.19; } .header-section .left-block a.link { display: inline-block; text-decoration: none; color: #585858; font-family: proxima-regular, Helvetica, Arial, sans-serif; font-size: 18px; margin: 40px 0 0 0; padding: 0; font-weight: 600; line-height: 1.55; } .header-section .left-block a.link:hover { color: #444; } .header-section .right-block { display: block; width: 100%; position: relative; } .header-section .right-block .video-screenshot { width: 100%; display: inline-block; min-height: 200px; background-size: cover; background-repeat: no-repeat; background-position: 0 0; } .header-section .right-block .video-play-btn { position: absolute; top: 50%; left: 50%; height: 77px; margin: auto; cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(0.9); -webkit-transform: translate(-50%, -50%) scale(0.9); transform: translate(-50%, -50%) scale(0.9); z-index: 4; } .header-section .right-block .video-play-btn:hover { opacity: 1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .parameter-section { background: #f9f9f9; display: block; width: 100%; padding: 50px 10px; } .parameter-section .block-wrapper { max-width: 1100px; margin: 0 auto; padding: 0; } .params-block { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .params-unit { display: inline-block; text-align: center; margin-bottom: 40px; } .params-unit:last-child { margin-bottom: 0; } .params-unit span.tag { display: block; color: #585858; font-size: 16px; padding-bottom: 10px; font-family: proxima-regular, Helvetica, Arial, sans-serif; line-height: 1.19; text-transform: uppercase; } .params-unit span.tag-value { display: inline-block; color: #0abe51; font-size: 22px; font-family: proxima-regular, Helvetica, Arial, sans-serif; line-height: 1.43; } .customer-middle-section { display: block; width: 100%; padding: 50px 10px; } .customer-middle-section .inner-block { display: block; margin: 0 auto 50px auto; padding: 0 10px; text-align: center; } .customer-middle-section .hs_cos_wrapper_type_module:last-child .inner-block{ margin: 0 auto; } .testimonail-block { max-width: 950px; } .testimonail-block p.testimonial-text { display: block; font-family: PT Serif Caption, Helvetica, Arial, sans-serif; font-size: 28px; margin-bottom: 30px; line-height: 1.39; color: #585858; } .testimonail-block span.designation { display: inline-block; font-size: 22px; line-height: 1.55; color: #585858; font-family: proxima-regular, Helvetica, Arial, sans-serif; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/yellow-highlight-0482deb3.png) no-repeat 0 0; background-size: 100% 100%; } .customer-middle-section .content-block { max-width: 800px; text-align: left; } .customer-middle-section .content-block a { text-decoration: underline; } .customer-page .customer-middle-section .content-block a { text-decoration: none; } .customer-middle-section .content-block p { display: block; font-size: 18px; color: #585858; text-align: left; padding: 0 0 20px 0; margin: 0; line-height: 26px; } .customer-middle-section .content-block h5 { text-align: left; color: #585858; padding: 0 0 20px 0; } .customer-middle-section .image-content { max-width: 1000px; text-align: center; } .image-content img { width: 100%; max-width: 470px; display: inline-block; padding: 10px; } .customer-section-bottom-flexi .bottom-get-started .g-s-download a { text-decoration: none; } .customer-section-bottom-flexi .bottom-get-started .g-s-download a span { text-decoration: underline; } .more-stories-wrapper { display: block; width: 100%; padding: 50px 10px; } .more-stories-block { max-width: 1100px; margin: 0 auto; text-align: center; padding: 0 10px; } .more-stories-block h2 { display: block; width: 100%; text-align: center; color: #585858; font-size: 30px; line-height: 1.2; margin: 0 0 30px 0; padding: 0; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .more-stories-block .stories-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .more-stories-block .stories-unit { display: inline-block; width: 100%; max-width: 530px; border-radius: 5px; margin: 0 auto 15px; padding: 15px; background-color: #f9f9f9; } .more-stories-block .image-wrap { display: inline-block; padding: 0; width: 100%; max-width: 300px; min-height: 150px; background: #fff; text-align: center; position: relative; } .more-stories-block .image-wrap img { display: inline-block; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .more-stories-block .right-box { float: right; width: 100%; padding: 20px 0 0 0; text-align: center; } .more-stories-block .right-box p { display: block; width: 100%; padding: 0; margin: 0 0 20px 0; color: #585858; font-size: 28px; min-height: 130px; line-height: 1.21; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .more-stories-block .right-box .read-story { display: block; text-decoration: none; color: #0abe51; padding: 0; margin: 0; font-size: 22px; line-height: 1.55; -webkit-transition: background 300ms; transition: background 300ms; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .more-stories-block .right-box .read-story:hover { color: #08a145; -webkit-transition: background 300ms; transition: background 300ms; } .customer-middle-section .more-stories-wrapper { padding: 0; } .customer-banner .client-video-box { position: relative; } .customer-banner .slick-dots li { display: inline-block; padding: 0 5px; outline: none; } .customer-banner .slick-dots li button { font-size: 0; width: 40px; height: 6px; background-color: #ffffff; border: none; font-family: inherit; line-height: inherit; outline: none; } .customer-banner .slick-dots li.slick-active button { background-color: #0abe51; } .customer-banner .slick-dots { position: absolute; bottom: 10px; text-align: center; width: 100%; } .drivezy-videos { display: block; width: 100%; padding: 50px 10px; } .drivezy-videos .params-block { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .drivezy-videos .params-unit { text-align: center; margin-bottom: 35px; position: relative; } .drivezy-videos .video-play-btn { position: absolute; top: 43%; left: 50%; height: 77px; margin: auto; cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(0.9); -webkit-transform: translate(-50%, -50%) scale(0.9); transform: translate(-50%, -50%) scale(0.9); z-index: 4; } .drivezy-videos .video-play-btn:hover { opacity: 1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .drivezy-videos .params-unit p { font-size: 18px; padding: 5px 0 0 0; margin: 0; } .drivezy-videos .params-unit:last-child { margin-bottom: 0; } /* ====================== features start ======================= */ .csm-features-page { padding: 0px !important; } .csm-features-page .body-container { padding: 0px; margin-top:-1px; } .csm-features-page .banner-content { max-width: 100%; } .fixed-product-keys { position: fixed; z-index: 2; width: 100%; top: -72px; background: #fff; border-bottom: 1px solid rgba(88,88,88,0.2); text-align: center; text-transform: uppercase; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; display: none; } .product-keys { display: none; text-align: center; } .fixed-product-keys.show{ top: 0; -webkit-transition: all .2s ease-in-out; transition: all .2s ease-in-out; } .custom-banner-section { padding: 100px 0 0; color: #fff; text-align: center; } .custom-banner-section .page-center{ padding: 50px 10px; } .custom-banner-section h1{ margin: 0 0 40px; } .product-keys .page-center { padding: 50px 0; } .fixed-product-keys .page-center { padding: 80px 0 20px; } .product-keys .category { padding: 45px; display: inline-block; } .product-keys .csm-col1 { border-right: 1px solid #dedede; } .product-keys .csm-col3 { border-left: 1px solid #dedede; } .product-keys img { width: 80px; margin-bottom: 25px; } .product-keys span { font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; font-size: 20px; margin: 0; display: block; text-transform: uppercase; color: #585858; } .product-keys .category:hover span { color: #0abe51; } .fixed-product-keys .category { padding: 10px 70px; } .fixed-product-keys img { width: 30px; margin: 0 20px 0 0; vertical-align: middle; } .fixed-product-keys span { display: inline-block; } .fixed-product-keys .category:hover { color: #0abe51; } .csm-feature-group .page-center { padding: 50px 0; } .csm-feature-group .heading-block { padding: 0 10px; } .csm-feature-group .heading-block h5 { font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; padding-bottom: 50px; } .csm-feature-group .slider section { padding: 25px 5px; } .content-section-wrapper .img-block img { margin-bottom: 40px; } .mobile-screen{ display: block; } .content-section-wrapper .text-block p.category-name { font-size: 16px; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; text-transform: uppercase; color: #999999; letter-spacing: 2px; margin: 0 0 5px; } .content-section-wrapper .text-block h6 { margin: 0 0 30px; font-size: 24px; } .content-section-wrapper .text-block p { font-size: 18px; margin: 0; line-height: 1.56; } .csm-slider-with-thumbnail-content { background: #f8f8f8; text-align: center; } .csm-slider-with-thumbnail-content .page-center, .csm-features-sec3 .page-center{ padding: 50px 0; } .csm-slider-with-thumbnail-content .heading-block { margin: 0 0 50px; padding: 0 10px; } .csm-slider-with-thumbnail-content .heading-block p { font-size: 18px; line-height: 28px; } .csm-slider-with-thumbnail-content.api-block img { padding: 0 10px; } .api-img-slider .slick-dots{ text-align: center; position: absolute; bottom: -15px; width: 100%; position: relative; padding: 0 0 30px; } .csm-feature-group .slick-dots { text-align: center; } .api-img-slider .slick-dots li, .csm-feature-group .slick-dots li{ display: inline-block; margin: 0 7px 0 0; } .api-img-slider .slick-dots button, .csm-feature-group .slick-dots button{ border: none; width: 10px; height: 10px; border-radius: 50%; background: #dedede; font-size: 0; padding: 0; } .api-img-slider .slick-dots .slick-active button, .csm-feature-group .slick-dots .slick-active button{ background: #0abe51; } .csm-features-sec3 { display: block; width: 100%; font-family: proxima-regular,Helvetica, Arial, sans-serif; } .csm-two-column-equal { padding-top: 50px; } .csm-two-column-equal .csm-col { display: inline-block; width: 100%; } .csm-two-column-equal .left-block { padding-right: 20px; vertical-align: bottom; margin-bottom: 0; text-align: left; padding-left: 0; } .csm-two-column-equal .left-block img{ max-width: 425px; width: 100%; } .csm-two-column-equal .right-block { text-align: left; padding-left: 20px; } .csm-two-column-equal .right-block ul{ display: block; margin: 0px; padding: 0 10px 30px 30px; list-style: initial; overflow: hidden; } .csm-two-column-equal .right-block ul li{ float: left; width: 100%; margin: 0; padding: 15px 0; text-align: left; font-size: 18px; color: #0abe51; line-height: 1.3; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .csm-two-column-equal .right-block ul li span{ float: left; width: 90%; line-height: 1.2; color: #585858; } .csm-two-column-equal .right-block p{ width: 100%; margin: 0px; padding: 0 0 0 30px; text-align: left; font-size: 20px; color: #585858; } a.link { text-decoration: none; cursor: pointer; margin: 0; padding: 0; color: #0abe51; } .desktop-screen { display: none; } /* ====== Customers ========= */ .customer-testimonial { display: block; width: 100%; background-color: #0c0e1a; min-height: 560px; font-family: proxima-regular, Helvetica, Arial, sans-serif; background-position: 0 0; background-repeat: repeat; } .customer-testimonial .page-center { padding-top: 130px; } body.customers-page { padding-top: 0; } .customer-testimonial .outer-wrap { padding-top: 20px; } .customer-testimonial .slick-topsection h2.title { display: inline-block; max-width: 800px; font-size: 22px; color: #fff; line-height: 1.4; margin: 0 0 40px 0; padding: 0 10px; position: relative; letter-spacing: -0.5px; font-family: PT Serif Caption, Helvetica, Arial, sans-serif; } .customer-testimonial .slick-topsection h2.title:before { content: ''; top: 0; left: -3px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/quotes-white-51e8c59e.png) no-repeat 0 0; width: 25px; height: 23px; background-size: 100%; display: inline-block; position: relative; } .customer-testimonial .slick-topsection h2.title:after { content: ""; position: relative; top: -3px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/quotes-white-51e8c59e.png) no-repeat 0 -21px; width: 25px; height: 23px; display: inline-block; background-size: 100%; left: 10px; } .customer-testimonial .slick-topsection p.name { display: block; font-size: 22px; color: #fff; margin-bottom: 10px; line-height: 24px; position: relative; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .customer-testimonial .slick-topsection p.name:before { content: ''; position: absolute; top: -15px; left: 50%; width: 100px; height: 1px; background: #eee; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .customer-testimonial .slick-topsection p.name span { opacity: 0.5; } .customer-testimonial .content { text-align: center; } .customer-testimonial .slick-prev, .customer-testimonial .slick-next { font-size: 0; line-height: 0; position: absolute; display: block; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; top: 30%; width: 50px; height: 50px; -webkit-transform: scale(0.6); -ms-transform: scale(0.6); transform: scale(0.6); } .customer-testimonial .slick-next:before { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/slick-arrors-5f3b44c9.png) no-repeat 0 -5px; width: 34px; height: 50px; display: inline-block; } .customer-testimonial .slick-prev:before { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/slick-arrors-5f3b44c9.png) no-repeat -5px 0; width: 34px; height: 50px; display: inline-block; } body.customers-page .body-container { padding: 0; } .customers-logo { text-align: center; } .customer .unit { width: 100%; padding: 40px 20px; text-align: center; margin: 0 auto; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .customers-logo .page-center { max-width: 1200px !important; width: 100%; } .customers-logo .logo-box { display: block; background: #fff; padding: 60px 20px 30px 20px; margin-bottom: 70px; margin-top: -130px; } .customer h2. .customers-logo h2{ display: block; margin: 0; padding-bottom: 35px; font-size: 26px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; line-height: 1.2; } .customers-logo { text-align: center; } .company-wrap { display: block; text-align: center; vertical-align: middle; } .company-logo { display: inline-block; width: 150px; height: 70px; margin: 0 0 20px 0; -webkit-transform: scale(0.8); -ms-transform: scale(0.8); transform: scale(0.8); } .company-logo-indian { background-repeat:no-repeat; background-position: center; } .company-logo-20 { background-size: 200px; } .customers-section1 { background: #f9f9f9; } .customers-section1-flexi .unit.customer-two-col-wrapper { padding: 0; } .customer-two-col-wrapper .wrap-content { max-width: 1100px; margin: 0 auto; } .customer .description-block .left-block { display: inline-block; width: 100%; text-align: left; vertical-align: middle; margin-bottom: 20px; } .customer .description-block .right-block { display: inline-block; width: 100%; vertical-align: middle; margin-bottom: 0; } .customer .description-block .left-block h2 { padding-bottom: 30px; } .customer .description-block h2 span.green-txt { color: #0abe51; } .customer h3 { display: inline-block; font-size: 18px; margin: 0 0 15px 0; color: #585858; line-height: 26px; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .customer .view-result-btn { display: inline-block; margin: 0; padding: 15px 25px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .customer .view-result-btn:hover { background: #08a145; } .twitter-unit { background: #dff4ff; display: block; } .twitter-unit .unit-wrap { display: inline-block; max-width: 1100px; width: 100%; margin: 0 auto; font-family: proxima-regular,Helvetica, Arial, sans-serif; } .twitter-logo { display: inline-block; margin-bottom: 40px; } .twitter-slider { padding: 10px; text-align: left; } .twitter-slider .slider-wrap { background-color: #effaff; border: 1px solid #fff; border-radius: 5px; padding: 25px 20px; margin: 10px; } .twitter-slider p { display: block; margin: 0 0 20px 0; padding: 0; font-size: 18px; color: #333; min-height: 160px; text-align: left; line-height: 1.4; letter-spacing: -0.4px; font-family: proxima-regular,Helvetica, Arial, sans-serif; } .twitter-slider span.name { color: #181818; display: block; font-size: 22px; margin: 0; padding: 0 0 2px 0; letter-spacing: -0.4px; font-family: proxima-regular,Helvetica, Arial, sans-serif; } .twitter-slider span.hashtag_id { display: block; font-size: 22px; margin: 0; padding: 0 0 10px 0; color: #24a9df; letter-spacing: -0.4px; } .twitter-slider .bule { color: #008bd0; text-decoration: none; cursor: default; } .customer-success-stories { background: #fff; } .customer-success-stories .wrap-content { max-width: 1100px; margin: 0 auto; } .customer-testimonial-slider { text-align: left; margin: 50px 0; } .customer-testimonial-slider .profile-text, .customer-testimonial-slider .profile-img { display: inline-block; vertical-align: top; } .customer-testimonial-slider .profile-text { padding: 0 20px 20px 20px; -webkit-box-sizing: border-box; box-sizing: border-box; } .customer-testimonial-slider .profile-text p.txt, .customer-testimonial-slider .profile-img p.txt { color: #585858; position: relative; font-size: 24px; padding: 0; margin: 0 0 30px 0; line-height: 1.6; font-family: PT Serif Caption, Helvetica, Arial, sans-serif; } .customer-testimonial-slider .profile-text p.txt:before, .customer-testimonial-slider .profile-img p.txt:before { content: ""; display: inline-block; line-height: 1.2; height: 25px; width: 20px; left: 0; top: -3px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/quotes-3fffa6e8.svg) no-repeat 0px 0; position: relative; font-family: PT Serif Caption, Helvetica, Arial, sans-serif; background-size: 100%; } .customer .customer-testimonial-slider .profile-text p.txt:after, .customer .customer-testimonial-slider .profile-img p.txt:after { content: ""; display: inline-block; line-height: 1.2; height: 25px; width: 20px; left: 5px; top: -3px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/quotes-3fffa6e8.svg) no-repeat 0px 0; position: relative; font-family: PT Serif Caption, Helvetica, Arial, sans-serif; background-size: 100%; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .customer-testimonial-slider span.divider { opacity: 0.5; } .customer-testimonial-slider .profile-text span.divider, .customer-testimonial-slider .profile-img span.divider { margin-bottom: 30px; } .customer-testimonial-slider .customer-detail { font-size: 18px; color: #585858; padding: 0; line-height: 1.6; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .customer-testimonial-slider .read-story-btn { display: inline-block; font-size: 22px; padding: 10px 15px; margin: 0 0 20px 0; text-align: center; color: #ffffff; border: none; border-radius: 5px 5px; background: #0abe51; font-family: proxima-semibold, Helvetica, Arial, sans-serif; cursor: pointer; -webkit-transition: background 300ms; transition: background 300ms; } .customer-testimonial-slider .read-story-btn:hover { background: #08a145; -webkit-transition: background 300ms; transition: background 300ms; } .customer-testimonial-slider .profile-img { margin-bottom: 20px; } .customer-testimonial-slider .profile-wrap { display: inline-block; position: relative; } .customer-testimonial-slider .customer-pic { display: inline-block; max-width: 471px; width: 100%; } .customer-testimonial-slider .video-play-btn { position: absolute; top: 50%; left: 50%; margin: auto; cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(0.9); -webkit-transform: translate(-50%, -50%) scale(0.9); transform: translate(-50%, -50%) scale(0.9); z-index: 4; } .customer-testimonial-slider .video-play-btn:hover { opacity: 1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .customer-testimonial-thumbnail-slider { width: 90%; margin: 0 auto; } .customer-testimonial-thumbnail-slider .slide { text-align: center; } .customer-testimonial-thumbnail-slider .customer-thumbnail-img { display: inline-block; width: 210px; height: 75px; cursor: pointer; background-repeat: no-repeat; background-position: center; -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.6; } .customer-testimonial-thumbnail-slider .customer-thumbnail-img:hover, .customer-testimonial-thumbnail-slider .slick-current .customer-thumbnail-img { -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 1; } .customer-testimonial-thumbnail-slider .slick-prev { top: 24px; left: -40px; } .customer-testimonial-thumbnail-slider .slick-next { top: 10px; right: -40px; } .customer-testimonial-thumbnail-slider .slick-prev:before { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/arrow-1c6ffa88.png) no-repeat 0 0; width: 34px; height: 57px; display: inline-block; } .customer-testimonial-thumbnail-slider .slick-next:before { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/arrow-1c6ffa88.png) no-repeat 0 0; width: 34px; height: 57px; display: inline-block; -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); transform: rotate(180deg); } .customer h2 { display: block; margin: 0; padding-bottom: 35px; font-size: 26px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; line-height: 1.2; } .company-wrap { display: inline-block; width: 200px; text-align: center; } /* ====== Offer ======= */ body.offer-page { padding: 0; } .offer-page #header { background: no-repeat; } .offer-page #header.fixedNav { background: #fff; } .offer-banner { margin-top: -1px; background-size: cover; display: block; width: 100%; min-height: 600px; background-repeat: no-repeat; background-position: 0 0; } .offer-banner .page-center { padding: 100px 10px 0 10px; text-align: center; -webkit-box-sizing: border-box; box-sizing: border-box; } .offer-banner .left-section { display: inline-block; width: 100%; max-width: 390px; background: #fff; text-align: center; border-radius: 0 0 4px 4px; -webkit-box-shadow: 0 0 6px #999; box-shadow: 0 0 6px #999; vertical-align: top; } .offer-banner .left-section form{ background: #efefef; width: 100%; padding: 20px 20px 30px 20px; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 0; } .offer-banner .right-section { display: inline-block; width: 100%; max-width: 400px; padding: 0 20px; margin: 40px 0; text-align: center; } .offer-banner .right-section h1 { color: #fff; margin: 0; padding: 0; line-height: 35px; font-size: 34px; } .offer-banner .right-section ul { margin: 0; padding: 0 0 0 22px; list-style: none; } .offer-banner .right-section ul li { font-size: 18px; color: #ddd; margin: 0; padding: 0 0 10px 0; text-align: left; position: relative; } .offer-banner .right-section ul li:before { content: ''; width: 6px; height: 6px; background: #fff; border-radius: 50% 50%; position: absolute; left: -25px; top: 10px; } .offer-banner .left-section .form-title { padding: 0; } .offer-banner .hs-form-required { display: none; } .offer-banner .hs-input { max-width: 100%; width: 100%; background: #fff; color: #585858; font-size: 14px; margin: 0; padding: 14px 15px; border: 1px solid #d9d9d9; border-radius: 4px 4px; line-height: inherit; font-family: inherit; } .offer-banner input.hs-button.primary.large { background: #0abe51; color: #fff; font-size: 18px; margin: 10px 0 0 0; padding: 15px; cursor: pointer; border: none; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; width: 100%; border-radius: 4px 4px; font-family: inherit; line-height: inherit; font-weight: normal; } .offer-banner input.hs-button.primary.large:hover { background: #08a145; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; } .offer-banner .hs-input.invalid { border-color: red; } .offer-banner .hs-error-msgs { text-align: left; font-size: 12px; margin: 1px 10px 2px; color: red; padding: 0; } .offer-banner .hs-form-field { margin-bottom: 20px; } .offer-page .body-container { padding: 0; } .offer-page .customers-logo .logo-box { margin: 0; padding: 0; } .offer-page .customers-logo .logo-box h2 { font-size: 16px; color: #585858; opacity: 0.5; margin: 0 0 40px 0; text-transform: uppercase; line-height: 50px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; padding: 0; } .offer-page .customers-logo .page-center { padding: 40px 20px 20px 20px; text-align: center; max-width: 1100px !important; } .left-section h3 { font-size: 14px; color: #585858; font-weight: bold; margin: 0; padding: 14px 0; line-height: 22px; } .right-section h3 { color: #fff; margin: 40px 0 20px 0; padding: 0; font-size: 18px; text-transform: uppercase; font-weight: 600; line-height: 26px; } .offers-footer-bg { display: block; width: 100%; padding: 20px 0 15px 0; background: #eeeeee; text-align: center; } .offers-footer-bg ul { margin: 0; padding: 0; list-style: none; } .offers-footer-bg ul li { display: inline-block; margin: 0 10px; padding: 0; } .offers-footer-bg ul li span.footer-sprite { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/offers-sprite-33102996.png); display: inline-block; width: 35px; height: 35px; margin: 0; padding: 0; opacity: 0.8; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; } .offers-footer-bg ul li span.facebook-flock { background-position: -73px -5px; } .offers-footer-bg ul li span.twitter-flock { background-position: -118px -5px; } .offers-footer-bg ul li span.linkedin-flock { background-position: -163px -5px; } .offers-footer-bg ul li span.footer-sprite:hover { opacity: 1; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; } .hipchat-migration.stride-migration .custom-hipchat-section ._get-started .hs-button { padding: 15px 15px; border-radius: 0 6px 6px 0; letter-spacing: 1px; background: #0c8e45; } .section-bottom-border { border-bottom: 1px solid #dedede; } .icon-section { padding: 31px 0 0; text-align: center; margin-bottom: 100px; } .icon-section .wrapper { max-width: 1200px; margin: 0 auto; } .icon-section .icon-wrapper { text-align: center; padding: 0 10px; } .icon-section .icons { display: block; margin: 0 auto 30px; } .icon-section .icon-wrapper img { vertical-align: middle; margin: 4px auto 37px; display: inline-block; } .stride-migration .custom-flock-banner-area.unit { margin-bottom: 0; } .stride-migration .custom-hipchat-section .bottom-get-started { background: #fff; } .stride-migration .custom-hipchat-section .bottom-get-started ._get-started { padding: 0; margin-bottom: 100px; } .hipchat-migration.stride-migration .custom-flock-banner-area ._get-started .hs-button { font-size: 16px; padding: 15px 20px; } body.hs-hipchat-layout.stride-migration .custom-hipchat-section .hs_error_rollup { bottom: -18px; left: 93px; } body.hs-hipchat-layout.stride-migration .custom-hipchat-section .no-list.hs-error-msgs.inputs-list { bottom: -30px; } /* .hipchat-migration .custom-menu-primary .hs-menu-wrapper>ul>li:last-child { display: none; } */ body.flock-setup-page { padding: 0; } .flock-setup-page .body-container { padding: 0; } .flock-setup-page .body-container .page-center { max-width: 1000px !important; text-align: center; background: #fff; padding: 50px 10px; } .flock-setup-page .main-content p { color: #585858; font-size: 16px; display: inline-block; line-height: 24px; font-family: Helvetica, Arial, sans-serif; } .flock-setup-page .main-content p a { font-size: 16px; text-decoration: underline; margin: 0; padding: 0; color: #0abe51; } /* ========= Why Flock =========== */ #header.why-flock-header { background: no-repeat; text-align: center; } #header.why-flock-header.fixedNav { background: #fff; } .why-flock-header:not(.fixedNav) .header-col.hs-logo { width: 100% !important; text-align: center; } body.why-flock-page { padding: 0; } .why-flock-banner .page-center { padding: 110px 0 0; } .why-flock-banner .heading { text-align: center; margin: 0 auto; } .why-flock-banner .heading h2 { letter-spacing: -1px; margin: 0 10px 15px; } .why-flock-banner .heading-top-part { font-family: proxima-regular, Helvetica, Arial, sans-serif; } .why-flock-banner .heading span.block { display: block; font-family: proxima-bold, Helvetica, Arial, sans-serif; } .why-flock-banner p { margin-bottom: 0; letter-spacing: -0.5px; line-height: 1.59; } .why-flock-banner .mobile-banner { padding-top: 40px; display: block; } .why-flock-banner .get-started { padding-top: 50px; } .why-flock-banner .get-started form { background: #f3f3f3; } .why-flock-banner ._get-started .hs-form-field { width: 470px; } .why-flock-banner ._get-started .hs-input { border: none; } .why-flock-banner ._get-started ._g-s-sublable { color: #333333; font-size: 16px; text-align: center; margin-top: 15px; letter-spacing: -0.4px; display: block; } .why-flock-banner ._get-started span.disc { background: #333333; border-radius: 50%; display: inline-block; height: 5px; margin: 0 5px 0 10px; vertical-align: middle; width: 5px; } .why-flock-banner .desktop-banner { display: none; } .product-feature { background: #f0f0f0; overflow: hidden; } .why-flock-page .why-flock-banner .hs-error-msgs { position: absolute; left: 0; bottom: -28px; } .why-flock-page .why-flock-banner .hs_error_rollup { left: 0; position: absolute; width: 100%; bottom: 0; left: 8px; } .why-flock-page .body-container { padding: 0; } .why-flock-banner { margin-bottom: 50px; } .why-flock-page .bottom-get-started ._get-started .hs_error_rollup { left: 89px; } .why-flock-page .homepage-variant { padding: 50px 10px !important; } .product-feature .page-center { padding: 40px 20px; } .two-col-equal-image-wrap .unit { padding: 40px 0; position: relative; } .two-col-equal-image-wrap .unit .text { display: block; } .two-col-equal-image-wrap .unit .image { max-width: 370px !important; margin: 0 auto; } .two-col-equal-image-wrap .unit .text h4 { font-weight: 600; margin-bottom: 10px; } .two-col-equal-image-wrap .unit .text p { line-height: 27px; } .two-col-equal-image-wrap .separator:after { content: " "; display: inline-block; height: 1px; width: 70%; background: #dedede; position: absolute; bottom: 0; right: 50%; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); } .why-flock-page .bottom-get-started { background: #333333; color: #fff; } .why-flock-page .bottom-get-started ._get-started { padding: 40px 10px; text-align: center; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .why-flock-page .bottom-get-started .g-s-label { color: #fff; } .why-flock-row2 .custom-brand-name { background: #fff; } .why-flock-row2 .custom-brand-name .brands-inline .brand-title { font-size: 22px; color: #333333; } .why-flock-row2 .custom-brand-name .brands-inline .brand-title:before, .why-flock-row2 .custom-brand-name .brands-inline .brand-title:after { content: " "; display: inline-block; height: 2px; background: #dedede; width: 100px; border: none; vertical-align: middle; margin: 0 18px; } .homepage-variant { font-family: 'PT Serif Caption', 'Helvetica', 'Arial', sans-serif; background: #f9f9f9; background-size: cover; text-align: center; margin: 0 auto; width: 100%; padding: 50px 10px; overflow: hidden; } .homepage-variant .wrap-content { max-width: 1000px; margin: 0 auto; } .homepage-variant .testimonial-variant-slider { text-align: left; } .homepage-variant .testimonial-variant-slider .profile-text, .homepage-variant .testimonial-variant-slider .profile-img { display: inline-block; vertical-align: top; position: relative; } .homepage-variant .testimonial-variant-slider .profile-text { padding: 0 20px; -webkit-box-sizing: border-box; box-sizing: border-box; } .homepage-variant .testimonial-variant-slider .profile-text p.txt, .homepage-variant .testimonial-variant-slider .profile-img p.txt { color: #585858; position: relative; font-size: 24px; padding: 0; margin: 0 0 30px 0; line-height: 1.6; font-family: 'PT Serif Caption', 'Helvetica', 'Arial', sans-serif; } .homepage-variant .testimonial-variant-slider .profile-img { margin-bottom: 20px; min-width: 300px; min-height: 100px; } .homepage-variant .testimonial-variant-slider .profile-text p.txt:before, .homepage-variant .testimonial-variant-slider .profile-img p.txt:before { content: ""; display: inline-block; line-height: 1.2; height: 25px; width: 20px; left: 0; top: -3px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/quotes-3fffa6e8.svg) no-repeat 0px 0; position: relative; font-family: 'PT Serif Caption', 'Helvetica', 'Arial', sans-serif; background-size: 100%; } .homepage-variant .testimonial-variant-slider .profile-text p.txt:after, .homepage-variant .testimonial-variant-slider .profile-img p.txt:after { content: ""; display: inline-block; line-height: 1.2; height: 25px; width: 20px; left: 5px; top: -3px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/quotes-3fffa6e8.svg) no-repeat 0px 0; position: relative; font-family: 'PT Serif Caption', 'Helvetica', 'Arial', sans-serif; background-size: 100%; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .homepage-variant span.divider { display: inline-block; background: #585858; width: 120px; height: 2px; opacity: 0.5; } .homepage-variant .testimonial-variant-slider .customer-detail { font-size: 18px; color: #585858; padding: 0; line-height: 1.6; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; } .homepage-variant .testimonial-variant-slider .customer-pic { display: inline-block; max-width: 471px; width: 100%; } .homepage-variant .testimonial-variant-slider .video-play-btn { position: absolute; top: 50%; left: 50%; margin: auto; cursor: pointer; -webkit-transition: all .5s ease; transition: all .5s ease; -ms-transform: translate(-50%, -50%) scale(0.9); -webkit-transform: translate(-50%, -50%) scale(0.9); transform: translate(-50%, -50%) scale(0.9); z-index: 4; } .homepage-variant .testimonial-variant-slider .slick-dots { text-align: center; } .homepage-variant .testimonial-variant-slider .slick-dots li { position: relative; display: inline-block; margin: 0 5px; padding: 0; cursor: pointer; } .homepage-variant .testimonial-variant-slider .slick-dots li button { font-size: 0; line-height: 0; width: 40px; height: 6px; padding: 0; border: 1px solid #fff; background: #e1e1e1; cursor: pointer; border-radius: 0; outline: none; } .homepage-variant .testimonial-variant-slider .slick-dots li.slick-active button { background: #0abe51; } @media only screen and (min-width: 1000px){ .homepage-variant .testimonial-variant-slider .slick-list { height: 388px !important; } } .why-flock-page .custom-footer-signup.hs_flock_footer { background: #666666; } .why-flock-page .custom-footer-signup.hs_flock_footer .custom-footer-menu-signup p { color: #fff; } .hs_cos_wrapper_type_module:last-of-type .two-col-equal-image-wrap .unit { padding-bottom: 0; } .hs_cos_wrapper_type_module:first-of-type .two-col-equal-image-wrap .unit { padding-top: 0; } body.hs-team-layout { padding: 0; } .hs-team-layout .body-container { padding-top: 20px; padding-bottom: 20px; } /* ===== Flock Vs Slack ====== */ body.flock-vs-slack3-page { padding: 0; } body.flock-vs-slack3-page .body-container { padding: 0; } .flock-vs-slack3-page #header { background: no-repeat; } .flock-vs-slack3-page #header.fixedNav { background: #fff; } .flock-vs-slack-banner #main-area { background: #fff; min-height: 670px; position: relative; } .flock-vs-slack-banner .block-content { display: inline-block; max-width: 1200px; margin: 0 auto; width: 100%; position: relative; direction: rtl; } .flock-vs-slack-banner .block-content .left-section { display: inline-block; width: 48.5%; padding-right: 20px; padding-top: 0; margin-bottom: 0; vertical-align: middle; } .flock-vs-slack-banner .block-content .left-section { vertical-align: top; text-align: right; padding-right: 0; } .flock-vs-slack-banner .block-content .mast-head { display: inline-block; width: 100%; max-width: 300px; height: 300px; background-size: 100% 100%; } .flock-vs-slack-banner .block-content .right-section { display: inline-block; width: 100%; text-align: center; } .flock-vs-slack-banner .heading-wrap { display: block; min-height: 65px; } .flock-vs-slack-banner .block-content h1 { display: block; padding: 20px 10px 15px 10px; opacity: 1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.1; letter-spacing: -2.5px; color: #585858; } .flock-vs-slack-banner .block-content .right-section ._get-started { padding-bottom: 50px; } .flock-vs-slack-banner .block-content .right-section ._g-s-label { color: #585858; letter-spacing: -0.8px; } .flock-vs-slack-banner ._get-started .hs-form-field { margin-right: 0; } .flock-vs-slack-banner ._get-started .hs-submit { margin-left: 0; } .flock-vs-slack-banner ._get-started .hs-input { margin: 0 -4px 0 0; border-radius: 6px 0 0 6px; } .flock-vs-slack-banner ._get-started .hs-button { border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; background: #0c8e45; padding: 15px 20px; } .flock-vs-slack-banner ._get-started .hs-button:hover { background: #0c8e45; } .flock-vs-slack-banner .get-started-v2 form { margin-bottom: 10px; } .flock-vs-slack-banner .icon-section { border: none; padding: 0; text-align: left; margin: 0; } .flock-vs-slack-banner .icon-section .wrapper p { text-align: left; font-size: 16px; text-transform: uppercase; } .flock-vs-slack-banner .icons.flock-users-icon { height: 55px; background-repeat: no-repeat; background-position: center; background-size: contain; } .flock-vs-slack3-page .cm-smart-block .page-center { padding: 85px 20px 0; } .flock-vs-slack3-page .cm-smart-block { padding: 0; } .flock-vs-slack3-page .cm-smart-block .top-content { text-align: center; } .flock-vs-slack3-page .cm-smart-block .top-content h3 { margin-bottom: 30px; } .flock-vs-slack3-page .cm-smart-rgt-block, .flock-vs-slack3-page .cm-smart-lft-block { width: 100%; display: inline-block; vertical-align: middle; } .flock-vs-slack3-page .cm-smart-rgt-block ul { margin: 0 0 50px; } .flock-vs-slack3-page .cm-smart-rgt-block ul li { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/right-tick-5447a8a0-3.png) no-repeat; background-position: 0 12px; background-size: 12px; padding: 0 0 0 30px; line-height: 30px; margin: 0 0 20px; font-size: 22px; } .flock-vs-slack3-page .cm-smart-block .cm-smart-lft-block img { width: 830px; height: 600px; margin-left: 40px; max-width: none; } .flock-vs-slack3-page .testimonial-section { padding: 85px 20px 0; } .flock-vs-slack3-page .other-awards .section { padding: 0; } .flock-vs-slack3-page .award-section-wrapper .page-center { padding: 85px 20px 0; } .hipchat-migration.flock-vs-slack3-page .unit { margin-bottom: 0; } .flock-vs-slack3-page .testimonial-section .testimonial-block { padding: 0 15px; } .flock-vs-slack3-page .unit .testimonial-section .wrapper { max-width: 1100px !important; } .flock-vs-slack3-page .other-awards .section .company-logo { background-size: 100%; } .range-block { text-align: center; } .range-block .page-center { padding: 85px 20px 0; } .range-block .range-wrap { display: block; padding: 0; margin-top: 100px; } .container { padding: 0 25px; max-width: 1000px; margin: 0 auto; } .range-block .html-inupt-range { position: relative; } .range-block input[type='range'] { width: 100%; font-family: inherit; font-size: inherit; line-height: inherit; } .range-block .html-inupt-range input[type='range'] { -webkit-appearance: none; height: 35px; margin: 0; -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.24); box-shadow: 0 0 3px rgba(0,0,0,0.24); border-radius: 2px; outline: none; cursor: pointer; top: -7px; position: relative; z-index: 990; position: relative; z-index: 999; opacity: 0; cursor: pointer; } .range-block .html-input-range-custom .hir-tracker-bg { top: 2px; left: 0; width: calc(100%); height: 20px; background-color: #f2f2f2; border-radius: 10px; } .range-block .html-input-range-custom .hir-tracker-bg { position: absolute; -webkit-box-shadow: 0 0 3px rgba(0,0,0,0.24); box-shadow: 0 0 3px rgba(0,0,0,0.24); } .range-block .html-input-range-custom .hir-tracker-thumb, .range-block .html-input-range-custom .hir-tracker-thumb:after { position: absolute; background-color: #0c8e45; } .range-block .html-input-range-custom .hir-tracker-thumb { top: 2px; left: 0; width: 0; height: 20px; -webkit-transition: width 0ms linear; transition: width 0ms linear; border-radius: 8px 0 0 8px; } .range-block .html-input-range-custom .hir-tracker-thumb:after { content: ''; z-index: 2; top: -11px; right: -21px; width: 40px; height: 40px; border-radius: 50%; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/pricing-slider-circle-d8dcecb4.svg); background-size: 100%; } .range-block .html-inupt-range .tooltip, .range-block .html-inupt-range .tooltip::after, .range-block .html-inupt-range .tooltip::before { position: absolute; } .range-block .html-inupt-range .tooltip { z-index: 0; top: -55px; left: 0; width: 105px; padding: 5px 12px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); font-size: 14px; border-radius: 10px; color: #0c8e45; font-weight: 600; -webkit-transition: left 0ms linear; transition: left 0ms linear; } .range-block .html-inupt-range .tooltip::after, .range-block .html-inupt-range .tooltip::before { content: ''; width: 0; height: 0; } .range-block .html-inupt-range .tooltip::before { bottom: -5px; left: calc(50% - 5px); border-left: 5px solid transparent; border-right: 5px solid transparent; border-top: 5px solid #f1f1f1; } .range-block .html-inupt-range .tooltip::after { bottom: -4px; left: calc(50% - 4px); border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid #0c8e45; } .range-paramenter { float: left; width: 100%; margin: 0 0 20px 0; } .range-paramenter .initial-state { float: left; display: inline-block; line-height: 1.2; } .range-paramenter .initial-state span { display: block; } .range-paramenter .initial-state span.value { font-weight: 600; font-size: 28px; } .range-paramenter .initial-state span.user { font-size: 16px; } .range-paramenter .initial-state { float: left; display: inline-block; line-height: 1.2; } .range-paramenter .final-state { float: right; } .saving-block { font-size: 22px; color: #333; margin-top: 30px; } .saving-elm { color: #0abe51; font-size: 22px; font-weight: 600; } .saving-elm-amount { font-size: 36px; } .amount-block { display: block; text-align: center; font-size: 0; margin-top: 40px; } .single-block { display: inline-block; padding: 20px; border: 1px solid #dedede; } .single-block img { height: 30px; } .price-elm { display: block; font-size: 18px; line-height: 40px; padding-top: 15px; color: #333; } .cmpy-price { font-size: 28px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .formula-row { display: inline-block; font-size: 16px; color: #888; line-height: 26px; min-width: 240px; } .single-block { display: inline-block; padding: 20px; border: 1px solid #dedede; } .flock-vs-slack3-page .unit.custom-Migrate-wrapper .page-center { max-width: 1100px !important; } .flock-vs-slack3-page .unit.custom-Migrate-wrapper .page-center { padding: 85px 20px 40px 20px; } .flock-vs-slack3-page #securityBlock .left-block { display: inline-block; width: 100%; margin-bottom: 50px; text-align: left; padding-right: 20px; padding-left: 20px; vertical-align: bottom; text-align: center } .flock-vs-slack3-page #securityBlock .left-block .security-img-flockvsslack { width: 100%; } .flock-vs-slack3-page #securityBlock .right-block { display: inline-block; width: 100%; text-align: left; padding-left: 20px; } .flock-vs-slack3-page #securityBlock .right-block p { padding: 0; } .flock-vs-slack3-page .bottom-get-started ._get-started .hs-form-field { margin: 0 -4px 0 0; } .flock-vs-slack3-page .bottom-get-started ._get-started .hs-input { border-radius: 6px 0 0 6px; } .flock-vs-slack3-page .bottom-get-started ._get-started .hs-button { background: #0c8e45; border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; } .flock-vs-slack3-page .bottom-get-started ._get-started span.disc { background: #333333; border-radius: 50%; display: inline-block; height: 5px; margin: 0 5px 0 10px; vertical-align: middle; width: 5px; } /* start of team layout */ .custom-tean-section p { font-size: 15px; line-height: 22px; margin-bottom: 30px; color: #585858; font-family: proxima-regular, Helvetica, Arial, sans-serif; padding-left: 30px; } .custom-tean-section h6 { font-size: 15px; line-height: 22px; margin-bottom: 30px; color: #585858; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .custom-tean-section ol { list-style-type: decimal; padding-left: 40px; font-size: 15px; line-height: 22px; } .custom-tean-section ol li { margin-bottom: 20px; padding-left: 15px; color: #333; } .custom-tean-section a { color: #0abe51; text-decoration: underline; } .custom-tean-section ul { list-style-type: disc; padding-left: 40px; font-size: 15px; line-height: 22px; } .custom-tean-section ul li { margin-bottom: 20px; padding-left: 15px; color: #333; } /* start of team layout */ /* Start of hipchat-migration */ /* #main-area{ height: 100%; text-align: center; color: #fff; } .home-page #main-area { min-height: 760px; position: relative; background-color: #0c0e1a; background-repeat: repeat; background-position: 0 0; } */ .hipchat-migration #main-area, .stride-migration #main-area { min-height: 562px; } .hipchat-migration .home-page .block-content, .stride-migration .home-page .block-content { direction: rtl; } .hipchat-migration .home-page .block-content { padding-top:42px; width: 100%; } .hipchat-migration .home-page .block-content { display: inline-block; max-width: 1200px !important; margin: 0 auto; } .hipchat-migration .home-page .block-content .left-section { display: inline-block; width: 48.5%; padding-right: 20px; padding-top: 0; margin-bottom: 0; vertical-align: middle; } .hipchat-migration .home-page .block-content .right-section { width: 50.5%; text-align: left; vertical-align: middle; display: inline-block; } .hipchat-migration .home-page .block-content .mast-head { display: inline-block; width: 100%; height: 400px; max-width: 400px; background-size: 100% 100%; } .hipchat-migration .home-page .heading-wrap { display: block; min-height: 65px; } .hipchat-migration #main-area h2, .stride-migration #main-area h2 { color: #fff; font-size: 56px; line-height: 62px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; margin: 0 0 15px 0; padding: 0; } .hipchat-migration .home-page .block-content .right-section ._g-s-label { font-size: 25px; } .hipchat-migration ._get-started ._g-s-label { font-size: 28px; margin: 20px 0 50px 0; text-align: left; line-height: 1.2; font-family: proxima-regular, Helvetica, Arial, sans-serif; display: inline-block; color: #fff; letter-spacing: -0.8px; position: relative; } .hipchat-migration .header-wrap ._get-started ._g-s-label { display: block; text-align: center; } .hipchat-migration #main-area .small-font, .stride-migration #main-area .small-font { font-size: 40px; } .hipchat-migration .home-page .block-content .right-section ._get-started { text-align: left; padding-bottom: 0; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .hipchat-migration ._get-started ._g-s-form { position: relative; display: inline-block; max-width: 700px; padding: 8px; margin: 0 auto; text-align: center; border-radius: 6px; background-color: #1f2237; } .hipchat-migration .home-page .block-content .right-section, .stride-migration .home-page .block-content .right-section { direction: ltr; } .hipchat-migration ._get-started .hs-button { font-size: 16px; padding: 15px 16px; } .hipchat-migration ._get-started .hs-input { padding: 14px 19px 14px; font-size: 20px; } .hipchat-migration ._get-started .hs-input::-webkit-input-placeholder { color: #585858; } .hipchat-migration ._g-s-mobile { display: none; } .hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable { display: block; font-size: 22px; color: #fff; margin-top: 15px; text-align: left; letter-spacing: -0.4px; margin-top: 10px; } .hipchat-migration span.party-pooper { display: inline-block; margin: 0 3px; width: 18px; height: 18px; background-size: 16px 16px; background-repeat: no-repeat; background-position: 0 3px; } .custom-home-banner span.party-pooper { background-image: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/party-pooper-fd13c4e2-2.png); } .custom-home-banner .hs-error-msgs { text-align: left; } .custom-home-banner .hs_error_rollup { left: 0px; } .hipchat-migration .unit{ margin-bottom: 100px; } .hipchat-migration .custom-flock-banner-area.unit { margin-bottom: 0; } .award-section .gartner-award { max-width: 1100px; border-radius: 4px; background-color: #f6f6f6; padding: 30px 40px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .hipchat-migration .award-section .gartner-award, .stride-migration .award-section .gartner-award { margin-bottom: 40px; } .award-section img.gartner-img { width: 120px; margin-bottom: 20px; display: inline-block; } .award-section img.double-quotes { width: 30px; height: 24.6px; display: block; margin-bottom: 20px; } .award-section p { font-size: 18px; line-height: 26px; margin: 0; color: #333; } .award-section .gartner-award p { max-width: 775px; vertical-align: middle; text-align: center; } .award-section .gartner-award strong { display: block; } .hs-hipchat-layout .body-container, .hs-hipchat-layout .section { padding: 0 !important; } body.hs-hipchat-layout .no-list.hs-error-msgs.inputs-list { position: absolute; bottom: -23px; margin: 0; font-size: 12px; color: #ff3b47; line-height: 34px; } body.hs-hipchat-layout .hs_error_rollup { position: absolute; width: 100%; margin: 0; font-size: 12px; color: #ff3b47; line-height: 34px; bottom: -3px; } body.hs-hipchat-layout .hs_error_rollup { left: 0; bottom: -10px; } .testimonial-section .testimonial-txt { font-size: 18px; margin: 0 0 10px; line-height: 26px; min-height: 104px; color: #585858; } .unit .testimonial-section .wrapper { max-width: 1200px !IMPORTANT; } .testimonial-section .testimonial-block { width: 33.33%; float: left; padding: 0 25px; margin: 0; text-align: center; } .testimonial-section .yellow-bg-txt { background-repeat: no-repeat; background-position: center; background-size: 100% 100%; font-size: 16px; font-family: "proxima-semibold", "Helvetica", "Arial", sans-serif; padding: 10px 0px; display: inline-block; margin: 0; letter-spacing: 1.5px; text-transform: uppercase; } .testimonial-section .logo { width: 230px; height: 45px; display: inline-block; background-repeat: no-repeat; background-position: 0 0; background-size: contain; margin: 10px 0 0; } .testimonial-section { padding-top: 40px; } .testimonial-section .wrapper { overflow: hidden; } .testimonial-section .testimonial-img { text-align: center; } .testimonial-section .testimonial-img img { border: 1px solid #dedede; border-radius: 50%; width: 80px; } .testimonial-section .link-and-arrow { padding-bottom: 50px; } .link-and-arrow { text-align: center; margin: 40px 0 0; } .link-and-arrow a { font-family: proxima-semibold, Helvetica, Arial, sans-serif; font-size: 18px; line-height: 1.44; color: #0abe51; } .link-and-arrow a:after { content: ' '; background: url('/img/arrow-pointing-right.png') no-repeat center; background-size: contain; display: inline-block; height: 12px; width: 12px; position: relative; left: 5px; } .flock-vs-slack2 .flock-pricing-benefit .pricing-benefit-section, .hipchat-migration .flock-pricing-benefit .pricing-benefit-section, .stride-migration .flock-pricing-benefit .pricing-benefit-section{ display: inline-block; vertical-align: middle; } .flock-vs-slack2 .flock-pricing-benefit h3, .hipchat-migration .flock-pricing-benefit h3, .stride-migration .flock-pricing-benefit h3 { text-align: center; letter-spacing: -0.5px; margin-bottom: 50px; font-size: 42px; line-height: 50px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .flock-vs-slack2 .flock-pricing-benefit ul li, .hipchat-migration .flock-pricing-benefit ul li, .stride-migration .flock-pricing-benefit ul li { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/right-tick-5447a8a0.png) no-repeat; background-position: 0 12px; background-size: 12px; padding: 0 0 0 30px; line-height: 30px; margin: 0 0 20px; font-size: 22px; } #securityBlock h3 { text-align: center; } #securityBlock .subtitle, .hipchat-migration #securityBlock .subtitle, .stride-migration #securityBlock .subtitle { text-align: center; } #securityBlock .left-block{ display: inline-block; } #securityBlock .left-block .security-img-flockvsslack { max-width: 300px; width: 100%; } #securityBlock .right-block{ display: inline-block; } #securityBlock .right-block p { width: 100%; margin: 0px; padding: 0 0 0 30px; text-align: left; font-size: 20px; color: #585858; } .hipchat-migration #securityBlock .right-block p, .stride-migration #securityBlock .right-block p { padding: 0; } #securityBlock .mobile-dark-solid-btn { display: inline-block } #securityBlock .desktop-dark-solid-btn { display: none; } #securityBlock .dark-solid-btn { display: inline-block; font-size: 16px; padding: 16px; background: #0c8e45; letter-spacing: 1px; border-radius: 4px; color: #fff; margin: 30px 0 0 0; line-height: normal; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } @media only screen and (min-width: 1000px) { #securityBlock .mobile-dark-solid-btn { display: none; } #securityBlock .desktop-dark-solid-btn { display: inline-block; } } .hipchat-migration #securityBlock .dark-solid-btn, .stride-migration #securityBlock .dark-solid-btn { margin: 30px 0 30px 0; } #securityBlock .content-wrap { padding-top: 50px; } .unit.custom-hipchat-two.flock-pricing-benefit .page-center , .unit.custom-Migrate-wrapper .page-center , .custom-need-more .page-center ,.award-section-wrapper .page-center{ max-width: 1200px !important; } #securityBlock .link { text-decoration: none; cursor: pointer; margin: 0; padding: 0; color: #0abe51; } .about-flock .about-flock-block { width: 100%; display: inline-block; vertical-align: middle; } .about-flock ul li { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/right-tick-5447a8a0.png) no-repeat; background-position: 0 12px; background-size: 12px; padding: 0 0 0 30px; line-height: 30px; margin: 0 0 20px; font-size: 22px; } .about-flock .about-flock-img { background-position: 0 0; background-repeat: no-repeat; background-size: contain; height: 196px; } .award-section { text-align: center; } .award-section .gartner-award { max-width: 1100px; border-radius: 4px; background-color: #f6f6f6; padding: 30px 40px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .award-section img.gartner-img { width: 120px; margin-bottom: 20px; display: inline-block; } .award-section img.double-quotes { width: 30px; height: 24.6px; display: block; margin-bottom: 20px; } .other-awards .section-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; max-width: 920px; margin: 0 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding:0; } .other-awards { text-align: center; } .other-awards .section { margin: 0 0 50px; } .other-awards .section .star-wrapper { margin: 0 0 20px; } .other-awards .section p { margin: 0 0 20px; } .other-awards .section .company-logo { background-repeat: no-repeat; background-position: center; background-size: 100%; width: 160px; height: 40px; margin: auto; transform: none; } .other-awards .section span.star { display: inline-block; width: 24px; height: 24px; position: relative; } .other-awards .section span.filled-star { background-repeat: repeat-x; width: 97px; } .other-awards .section span.half-star { left: -5px; background-repeat: repeat-x; } .custom-hipchat-bottom-form-wrapper { margin-bottom: 100px; } .custom-hipchat-bottom-form-content p { font-size: 36px; line-height: 50px; margin: 0 20px 0px 0; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; vertical-align: middle; display: inline-block; letter-spacing: -0.8px; } .custom-hipchat-bottom-form .hs-input::-webkit-input-placeholder { color: #585858; } .custom-hipchat-bottom-form .hs-input { display: block; width: 100%; margin: 0; padding: 10px 15px; line-height: 30px; border: 0; background: #fff; color: #585858; padding: 0 20px; font-size: 20px; height: 60px; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .custom-hipchat-bottom-form .input { margin: 0 -4px 0 0; border-radius: 6px 0 0 6px; border: 1px solid #dbdbdb; border-right: none; display: inline-block; width: 305px; } .custom-hipchat-bottom-form .hs-button { margin: 0; font-weight: 600; line-height: 32px; border: 0; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; max-width: 500px; display: inline-block; width: auto; padding: 15px 17px; vertical-align: top; border-radius: 0 6px 6px 0; letter-spacing: 1px; font-size: 16px; background: #0c8e45; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .custom-hipchat-bottom-form form { position: relative; } .custom-hipchat-bottom-form .hs_email { display: inline-block; } .custom-hipchat-bottom-form .hs_submit.hs-submit { display: inline-block; } .custom-hipchat-bottom-form .actions { position: absolute; top: 0; } .custom-hipchat-bottom-form span.hs-form-required { display: none; } .widget-span.custom-hipchat-bottom-form-content { width: auto !important; padding-top: 6px; } .widget-span.custom-hipchat-bottom-form { width: auto !important; margin-left: 4px !important; } body.hs-hipchat-layout .custom-hipchat-bottom-form .no-list.hs-error-msgs.inputs-list { bottom: -24px; } body.hs-hipchat-layout .custom-hipchat-bottom-form .hs_error_rollup { bottom: -12px; } .custom-hipchat-bottom-form-wrapper .page-center { position: relative; } /* start of Signup Pro layout */ body.hs-signup-layout { padding-top: 0; } body.hs-signup-layout .header-col { width: 100% !important; text-align: center; } body.hs-signup-layout #header .page-center { padding-top: 70px; } body.hs-signup-layout #header.fixedNav .page-center{ padding: 15px 0 0; } .signup-pro .header-section { min-height: 650px; position: relative; background-repeat:repeat; background-position:0 0; } .signup-pro h1 { font-size: 45px; color: #fff; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.1; letter-spacing: -2.5px; padding: 0 10px 20px 10px; } .signup-pro .header-section .header-wrap { text-align: center; padding-top: 219px; } .hipchat-migration.signup-pro ._get-started .hs-button { display: inline-block; width: auto; padding: 15px 14px; font-size: 22px; vertical-align: top; } .signup-pro .header-section:before { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/vector-banner-left-4b14b9db.png) no-repeat 0 0; display: inline-block; width: 268px; height: 320px; background-size: 100% 100%; position: absolute; bottom: -15%; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .signup-pro .section-unit { display: block; width: 100%; text-align: center; background: #fff; } .signup-pro .signup-feature-unit { padding-top: 90px; } .signup-pro .section-unit .page-center { padding: 84px 10px 70px; } .signup-pro h2 { font-size: 30px; color: #585858; line-height: 1.2; margin: 0 0 15px 0; padding: 0; letter-spacing: -0.5px; text-align: center; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .signup-pro .signup-feature-unit .properties-block { display: block; width: 100%; margin-top: 80px; overflow: hidden; text-align: center; } .signup-pro .signup-feature-unit .single-row { float: left; width: 100%; } .signup-pro .signup-feature-unit .individual-unit { float: left; width: 100%; padding: 0 0 60px 0; -webkit-box-sizing: border-box; box-sizing: border-box; } .signup-pro .signup-feature-unit .left-block { display: block; width: 100%; margin-bottom: 30px; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; } .hs-signup-layout .body-container, .hs-signup-layout .section{ padding:0; } .signup-pro .signup-feature-unit .right-block { display: block; width: 100%; } .signup-pro .signup-feature-unit .left-block img { max-width: 93px; } .signup-pro h3 { display: block; margin: 0; font-size: 28px; font-weight: 600; line-height: 1.21; text-align: left; color: #585858; text-align: center; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .signup-pro p { display: block; padding: 0; font-size: 18px; line-height: 26px; text-align: center; color: #585858; } .signup-pro .section-unit { display: block; width: 100%; text-align: center; background: #fff; } .signup-pro .security-unit { background: #f9f9f9; padding-bottom: 6px; } .signup-pro .section-unit.security-unit .page-center { padding: 70px 10px; } .signup-pro .security-unit .security-left-block { display: inline-block; width: 100%; text-align: left; } .signup-pro .security-unit .security-right-block { display: inline-block; width: 100%; } .signup-pro .security-unit .security-right-block ul { display: block; margin: 0px; padding: 0 10px 0 30px; list-style: initial; overflow: hidden; } .signup-pro .security-unit .security-right-block li { float: left; width: 100%; margin: 0; padding: 15px 0; text-align: left; font-size: 18px; color: #0abe51; line-height: 1.3; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .signup-pro .security-unit .security-right-block span { float: left; width: 90%; line-height: 1.2; color: #585858; } .signup-pro .signup-feature-unit .properties-block h3 { padding: 0 0 20px 0; } .signup-pro .signup-feature-unit .individual-unit.unit-ass3 { padding: 0; } .signup-pro .signup-feature-unit .individual-unit.unit-ass4 { padding: 0; } .signup-pro .section-unit.logo-unit .page-center , .signup-pro .section-unit.award-section-unit .page-center { padding: 70px 10px; } .signup-pro .award-section-unit .award-unit { display: block; width: 100%; margin-top: 60px; } .signup-pro .award-section-unit .award-unit { display: block; width: 100%; margin-top: 60px; } .signup-pro .award-section-unit .left-unit { display: block; width: 100%; margin-bottom: 30px; } .signup-pro .award-section-unit .left-unit img { max-width: 131px; } .signup-pro .award-section-unit .right-unit { display: block; width: 100%; } .signup-pro .award-section-unit .right-unit p { text-align: center; } .signup-pro .award-section-unit .left-unit { display: block; width: 100%; margin-bottom: 30px; } .hs-signup-layout form._g-s-form .hs-error-msgs { position: absolute; left: 0; top: 100%; } .hs-signup-layout form._g-s-form .hs_error_rollup .hs-error-msgs { position: static; } .hs-signup-layout form._g-s-form .hs_error_rollup { position: absolute; top: 100%; margin: 13px 0 0; left: 0; } /* footer */ .custom-footer-signup { background: #3b454b; display: block; width: 100%; text-align: center; padding-bottom: 6px; } .custom-footer-signup .page-center { padding: 30px 10px 25px 10px !important; } .custom-footer-copyright-signup p { float: left; display: inline-block; font-size: 14px; margin: 0 0 20px 0; line-height: 1.43; text-align: center; color: #ffffff; margin: 0; } .custom-footer-menu-signup p a { font-size: 14px; line-height: 1.43; display: inline-block; color: #fff; } .custom-footer-menu-signup p { font-size: 14px; line-height: 1.43; display: inline-block; color: #fff; margin: 0; } .custom-footer-menu-signup { text-align: right; } body.hs-signup-layout .bottom-get-started { background: #1a5db0; color: #fff; } /* body.hs-signup-layout .bottom-get-started .g-s-label { color: #fff; } body.hs-signup-layout .bottom-get-started .g-s-download { color: #fff; } body.hs-signup-layout .bottom-get-started .g-s-download a { color: #fff; } */ /* footer */ /* Start of Appes */ .custom-app-banner { background-size: cover; min-height: 0 !important; background-repeat: no-repeat; background-position: center center; margin-top: -1px; } .custom-app-banner .page-center { padding: 85px 40px 0; } .custom-app-banner .top-content{ padding-top: 90px; } .custom-app-banner .app-img { display: block; width: 100%; float: left; margin-bottom: 30px; } .custom-app-banner .app-img { opacity: 0; -webkit-transform: translate3d(-140px, 0, 0); transform: translate3d(-140px, 0, 0); -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; } .custom-app-banner .app-content { display: block; float: left; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; } .custom-app-banner h1 { font-size: 40px; line-height: 70px; letter-spacing: -2.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .hs-apps-layout #header { background: transparent; } .hs-apps-layout #header.fixedNav { background: #fff; } body.hs-apps-layout { padding-top: 0; } .custom-app-banner .app-content p { margin: 20px 0 30px 0; color: #fff; } .green-button { padding: 13px 35px; color: #fff; background: #0abe51; font-size: 18px; cursor: pointer; display: inline-block; border-radius: 6px; margin: 0 0 30px 0; -webkit-transition: background 0.5s ease; transition: background 0.5s ease; } .green-button:hover { background: #08a145; } .title-wrap .caption { font-size: 26px; line-height: 36px; } body.hs-apps-layout .body-container, body.hs-apps-layout .section { padding: 0; } .custom-webhooks-wrapper .page-center { padding: 80px 40px 0; } .apps-wrap .left-block { float: left; width: 100%; } .apps-wrap .right-block { float: left; width: 100%; } .apps-icon { display: block; margin: 0 auto 20px auto; width: 90px; height: 91px; background-repeat: no-repeat; background-position: 0 0; } .apps-outgoing-webhooks-icon { background-position: 0 -455px; } .custom-webhooks-wrapper .left-block h3 { font-size: 26px; margin: 0 0 20px; font-weight: 400; } .apps-wrap { position: relative; overflow: hidden; margin-bottom: 40px; } .apps-icon { display: block; margin: 0 auto 20px auto; width: 90px; height: 91px; background-repeat: no-repeat; background-position: 0 0; } .apps-beta .apps-icon { display: block; margin-bottom: 20px; } .apps-beta .title-wrap .caption { color: #1c1c1c; font-size: 26px; } .custom-app-flock .title-wrap h3 { font-size: 26px; color: #585858; margin: 0 0 20px; font-weight: 400; } .custom-app-flock .page-center { padding: 80px 40px 0; text-align: center; } .apps-line { display: block; width: 100%; height: 1px; background: #e2e2e2; margin: 80px 0 70px 0; text-align: center; } .apps-line span { background: #fff; padding: 0 30px; display: inline-block; position: relative; top: -14px; font-size: 20px; } .unit-wrap { display: block; width: 100%; } .unit-wrap .unit { width: 100%; display: inline-block; vertical-align: top; margin-bottom: 55px; } .unit-wrap:last-child .unit { margin-bottom: 0; } .unit-wrap .unit img { margin-bottom: 40px; } body.hs-apps-layout h3 { font-size: 26px; } .custom-indexb--wrapper .get-started-v2.get-started-inline { background: #fff; } /* Start of Appes */ /* Start of Index B */ .custom-full-banner.header-section .header-wrap { padding-top: 82px; text-align: center; } .custom-full-banner.header-section .header-wrap h1 { color: #fff; } .hipchat-migration .custom-full-banner ._get-started ._g-s-label { font-size: 22px; } .custom-full-banner ._g-s-sublable p { display: block !important; text-align: center; color: #fff; margin-bottom: 10px; } .custom-full-banner ._g-s-sublable p a { color: #0ab54d; cursor: pointer; font-size: 20px; } .custom-full-banner .video-play-btn { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; max-width: 100px; cursor: pointer; z-index: 9; -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } .custom-full-banner #flock-introduction-video:after { content: ''; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: black; opacity: 0; -webkit-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; } .custom-full-banner #flock-introduction-video:hover:after { opacity: 0.3; -webkit-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out; } .custom-full-banner #flock-introduction-video:hover .video-play-btn { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } .custom-full-banner .header-video-wrap { z-index: 9; } .hs-indexb-layout .testimonial-box span.yellow-txt{ display: inline-block; padding: 20px 15px; font-size: 13px; color: #585858; line-height: 1.2; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/yellow-highlight-0482deb3-2.png) no-repeat 0 0; background-size: 100% 100%; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; } .hs-indexb-layout .testimonial-box { display: block; text-align: center; padding: 30px 0 0 0; } .hs-indexb-layout .testimonial-box .content-wrap { display: block; max-width: 800px; margin: 0 auto; } .hs-indexb-layout .testimonial-box p.testimonial-text { display: inline-block; margin: 10px 0 20px 0; padding: 0; font-size: 28px; line-height: 1.4; color: #585858; position: relative; font-family: PT Serif Caption, Helvetica, Arial, sans-serif; } .hs-indexb-layout .testimonial-box p.testimonial-text:before { content: ""; display: inline-block; line-height: 1.2; height: 25px; width: 25px; left: 0px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/quotes-3fffa6e8.svg) no-repeat 0 0; position: relative; top: -9px; font-family: 'PT Serif Caption', 'Helvetica', 'Arial', sans-serif; background-size: 100%; } body.hs-indexb-layout .body-container, .hs-indexb-layout .section { background: #f9f9f9; } body.hs-indexb-layout .body-container, .hs-indexb-layout .section { padding: 0; } .hs-indexb-layout .unit.testimonial-top-unit { padding: 0 10px 470px 10px; padding-bottom: 0; text-align: center; margin: 0 auto; width: 100%; } .hs-indexb-layout .body-container .page-center { padding: 0 10px 100px 10px; } .hs-indexb-layout .testimonial-block { padding: 0 10px 50px; } .hs-indexb-layout .testimonial-block { display: block; border-top: 10px solid #0abe51; padding: 0 10px 0 10px; background: #fff; margin-top: -120px; z-index: 1; position: relative; } .hs-indexb-layout .testimonial-box span.client-name { display: inline-block; font-size: 18px; color: #585858; opacity: 0.5; margin-bottom: 10px; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; } .hs-indexb-layout span.divider { display: inline-block; background: #585858; width: 120px; height: 2px; opacity: .2; } .testimonialBox3 span.divider { display: none; } .hs-indexb-layout .testimonial-box.testimonialBox3 { padding-bottom: 0; } .hs-indexb-layout h2.title { font-size: 30px; color: #585858; line-height: 1.2; margin: 0 0 15px 0; padding: 0; letter-spacing: -0.5px; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; color: #333333; } .hs-indexb-layout h3.sub_heading { display: inline-block; max-width: 850px; font-size: 18px; margin: 0 0 15px 0; color: #585858; line-height: 1.55; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; color: #333333; } .screenImage1Text { text-align: center; } .hs-indexb-layout .screenImage1Text h2.title { font-size: 42px; } .hs-indexb-layout .screenImage1Text h2.title .next-line { display: block; } .hs-indexb-layout .screenImage1Text h3.sub_heading { font-size: 22px; margin: 0 0 15px 0; color: #585858; } .screenImage1Text .screenImage1 { max-width: 900px; -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,0.2); box-shadow: 0 0 20px 0 rgba(0,0,0,0.2); } .screen-image-block .screen-image { max-width: 900px; -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,0.2); box-shadow: 0 0 20px 0 rgba(0,0,0,0.2); max-height: 660px; float: none; margin: 20px 0 0 0; display: inline-block; width: 100%; } .screen-image-block { max-width: 1200px; width: 100%; margin: 0 auto; float: none; } .screen-image-block { position: relative; } div#product { padding: 0; } .hs-indexb-layout.hipchat-migration .unit { margin-bottom: 0; } .hs-indexb-layout .unit.award-section-wrapper { background: #fff; padding: 0; } .hs-indexb-layout .other-awards .section { background: transparent; } .hs-indexb-layout .unit.award-section-wrapper .page-center { padding: 0; } .case-study-videos { padding: 50px 20px; background: #f9f9f9; text-align: center; } .case-study-videos .video-block-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-around; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .case-study-videos .video-block { width: 100%; max-width: 300px; vertical-align: top; margin-bottom: 50px; } .case-study-videos .video-thumbnail { margin: 0 0 30px; position: relative; -webkit-box-shadow: -10px 10px 0px #ade9c5; box-shadow: -10px 10px 0px #ade9c5; } .case-study-videos .page-center { max-width: 1200px !important; padding: 0 !important; } .case-study-videos .video-play-btn { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; max-width: 100px; cursor: pointer; z-index: 9; -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; width: 50px; height: 50px; } .link-and-arrow a { font-family: proxima-semibold, Helvetica, Arial, sans-serif; font-size: 18px; line-height: 1.44; color: #0abe51; } .link-and-arrow a:after { content: ' '; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/arrow-pointing-right-a2aa0f51.png) no-repeat center; background-size: contain; display: inline-block; height: 12px; width: 12px; position: relative; left: 5px; } .custom-full-banner.header-section .get-started-v2 { position: relative; z-index: 1; } .hipchat-migration .custom-full-banner ._get-started .hs-input { padding: 0 20px; font-size: 20px; } .hipchat-migration .custom-full-banner ._get-started .hs-form-field { margin-right: 0; } .hipchat-migration .custom-full-banner ._get-started .hs-button { border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; background: #0c8e45; } .hipchat-migration .custom-full-banner ._get-started .hs-input { margin-right: 0; margin: 0 -4px 0 0; border: 1px solid #dbdbdb; border-right: none; border-radius: 6px 0 0 6px; min-height: 62px; } .hipchat-migration .custom-full-banner ._get-started .hs-submit { margin-left: 0; } .hipchat-migration .custom-full-banner .no-list.hs-error-msgs.inputs-list { position: absolute; bottom: -26px; margin: 0; font-size: 12px; color: #ff3b47; line-height: 34px; } .hipchat-migration .custom-full-banner .hs_error_rollup { position: absolute; width: 100%; margin: 0; font-size: 12px; color: #ff3b47; line-height: 34px; bottom: -3px } .hipchat-migration .custom-full-banner ._get-started .hs-button { border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; background: #0c8e45; } .hs-indexb-layout .body-container .custom-main-testimonial-group .page-center { padding-bottom: 0; } .custom-brand-name { background: #f9f9f9; } .index .custom-brand-name { background: #ffffff; } .brands-inline { padding: 40px 0 25px; background: #fff; } .brands-inline .brand-title { padding-top: 30px; } .custom-brand-name .brand-title { border-top: 1px solid rgba(0,0,0,0.1); margin: 0; max-width: initial; } .brands-inline .brand-title { display: block; color: #999; font-size: 14px; margin: 0 auto; padding: 0 10px; text-align: center; font-family: proxima-semibold, Helvetica, Arial, sans-serif; font-weight: normal; } .brands-inline .brands-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .brands-inline .wrap { width: 200px; display: inline-block; position: relative; height: 80px; text-align: left; } .brands-inline .brand-icon { margin: auto; -webkit-transform: scale(0.94); -ms-transform: scale(0.94); transform: scale(0.94); width: 250px; height: 80px; display: inline-block; background-repeat: no-repeat; background-size: 100%; visibility: hidden; opacity: 0; -webkit-transition: all 0.5s ease-in; transition: all 0.5s ease-in; position: absolute; width: 100%; height: 100%; } .brands-inline .brand-icon-1 { background-position: center -679px } .brands-inline .brand-icon-2 { background-position: center -291px } .brands-inline .brand-icon-3 { background-position: center -377px } .brands-inline .brand-icon-4 { background-position: center -220px } .brands-inline .brand-icon-5 { background-position: center -55px } .brands-inline .brand-icon-6 { background-position: center -130px } .brands-inline .brand-icon-7 { background-position: center -455px } .brands-inline .brand-icon-8 { background-position: center -523px } .brands-inline .brand-icon-9 { background-position: center -593px } .brands-inline .brand-icon-10 { background-position: center -1062px } .brands-inline .brand-icon-11 { background-position: center -755px } .brands-inline .brand-icon-12 { background-position: center -836px } .brands-inline .brand-icon-13 { background-position: center -911px } .brands-inline .brand-icon-14 { background-position: center -987px } .brands-inline .brand-icon-15 { background-position: center -1461px; height: 91px } .brands-inline .brand-icon-16 { background-position: center 3px } .brands-inline .brand-icon-17 { background-position: center -1199px; background-size: 150px } .brands-inline .brand-icon-18 { background-position: center -1332px } .brands-inline .brand-icon-19 { background-position: center -1387px } .brands-inline .brand-icon-20 { background-position: center -1692px } .brands-inline .brand-icon-21 { background-position: center -1534px } .brands-inline .brand-icon-22 { background-position: center -523px } .brands-inline .brand-icon-23 { background-position: center -1498px; background-size: 170px } .brands-inline .brand-icon-24 { background-position: center -755px } .brands-inline .brand-icon-25 { background-position: center -912px; background-size: 150px } .brands-inline .brand-icon.select { -webkit-transition: all 0.5s ease-in; transition: all 0.5s ease-in; opacity: 1; visibility: visible } .brands-inline.international-brands .brand-icon { background-repeat: no-repeat; background-size: 100% } .brands-inline.international-brands .brand-icon-1 { background-position: center -697px } .brands-inline.international-brands .brand-icon-2 { background-position: center -266px } .brands-inline.international-brands .brand-icon-3 { background-position: center -401px } .brands-inline.international-brands .brand-icon-4 { background-position: center -207px } .brands-inline.international-brands .brand-icon-5 { background-position: center -469px } .brands-inline.international-brands .brand-icon-6 { background-position: center -330px } .brands-inline.international-brands .brand-icon-7 { background-position: center -72px } .brands-inline.international-brands .brand-icon-8 { background-position: center -542px } .brands-inline.international-brands .brand-icon-9 { background-position: center -619px } .brands-inline.international-brands .brand-icon-10 { background-position: center -6px } .brands-inline.international-brands .brand-icon-11 { background-position: center -765px } .brands-inline.international-brands .brand-icon-12 { background-position: center -1302px } .brands-inline.international-brands .brand-icon-13 { background-position: center -139px } .brands-inline.international-brands .brand-icon-14 { background-position: center -985px } .brands-inline.international-brands .brand-icon-15 { background-position: center -909px } .brands-inline.international-brands .brand-icon-16 { background-position: center -1265px; background-size: 220px } .brands-inline.international-brands .brand-icon-17 { background-position: center -1230px } .brands-inline.international-brands .brand-icon-18 { background-position: center -619px } .brands-inline.international-brands .brand-icon-19 { background-position: center -139px } .brands-inline.international-brands .brand-icon-20 { background-position: center -542px } /* start of Index E */ .hs-indexe-layout .unit.custom-flock-banner-area { padding: 0; } .hs-indexe-layout.hipchat-migration #main-area h2 { font-size: 54px; display: block; opacity: 1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.1; letter-spacing: -2.5px; margin: 0; padding: 0; } .hs-indexe-layout.hipchat-migration #main-area { min-height: 760px; position: relative; } .hs-indexe-layout.hipchat-migration #main-area .small-font { font-size: 54px; } .hs-indexe-layout.hipchat-migration .home-page .block-content { padding-top: 42px; } .hs-indexe-layout.hipchat-migration ._get-started .hs-input { border-radius: 6px 0 0 6px; min-height: 62px; } .hs-indexe-layout ._get-started .hs-form-field { margin-right: 0; } .hs-indexe-layout.hipchat-migration ._get-started .hs-button { background: #0c8e45; letter-spacing: 1px; border-radius: 0 6px 6px 0; } .hs-indexe-layout ._get-started .hs-submit { margin-left: 0; } .hs-indexe-layout .custom-main-testimonial-group .page-center { max-width: 1000px !important; padding: 0 !important; } .hs-indexe-layout.hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable p { color: #fff; margin-bottom: 10px; } .hs-home-layout.hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable p { color: #fff; margin-bottom: 10px; } .hs-indexe-layout.hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable { margin-top: 10px; } .hs-home-layout.hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable { margin-top: 10px; } .hs-home-layout.hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable p a { color: #0ab54d; } .default-page .hs-error-msgs { list-style: none; margin: 0 !important; padding: 0 !important; } .hs-indexe-layout.hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable p a { color: #0ab54d; } .hs-indexe-layout.hipchat-migration .unit { margin-bottom: 100px; } .hs-indexe-layout.hipchat-migration .custom-main-testimonial-group .unit { margin-bottom: 0; } .hs-indexe-layout .testimonial-block { margin-top: -170px; } .hs-indexe-layout.hipchat-migration #main-area { min-height: 662px; position: relative; } .hs-indexe-layout .custom-brand-name .page-center { max-width: 1000px !important; padding: 0 !important; } .hs-indexe-layout .custom-brand-name .brand-title { border: none; } .brands-inline .brand-title img { height: 13px; vertical-align: middle; } .hs-indexe-layout .custom-brand-name { background: #f9f9f9; padding-bottom: 50px; } .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider { background: #fff; padding-top: 100px; } .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider .page-center { max-width: 1200px !important; padding: 85px 0 0; } .custom-slider-subheading a { color: #0ab54d; cursor: pointer; font-size: 20px; display: inline-block; } .custom-slider-subheading span { border-bottom: 1px solid #0ab54d; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .heading-block { margin-bottom: 0; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide p { padding: 0 0 4px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide p.slider-topic { font-family: proxima-regular, Helvetica, Arial, sans-serif; padding: 0; line-height: 26px; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .link-and-arrow { margin-top: 40px; text-align: left; padding-left: 25px; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .api-img-slider .slick-dots { display: none !important; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider { margin-bottom: 50px; } body.hs-indexe-layout .body-container, .hs-indexe-layout .section { background: #fff; } .hs-indexe-layout .other-awards .wrapper { padding: 0 !important; } .hs-indexe-layout .unit.award-section-wrapper .page-center{ padding: 0 !important; } .custom-main-testimonial-group { background: #f9f9f9; } a.cm-pro-btn { color: #ffffff; font-size: 22px; letter-spacing: -0.24px; font-weight: 600; padding: 10px 20px; background: #13bc4c; border-radius: 3px 3px; cursor: pointer; display: inline-block; white-space: normal !important; } /* start of Index E */ /* start of Home Page */ .hs-home-layout.hipchat-migration .home-page .block-content { direction: inherit; } .hs-home-layout.hipchat-migration .home-page .heading-wrap h1 { font-size: 56px; margin: 0; padding: 0; line-height: 1.1; } .hs-home-layout.hipchat-migration ._get-started .hs-button { display: inline-block; width: auto; padding: 15px 14px; font-size: 22px; vertical-align: top; } .hs-home-layout.hipchat-migration #main-area { min-height: 662px; } .hs-home-main.hs-home-layout.hipchat-migration #main-area { padding-top: 97px; min-height: 760px; } .chevron { display: none; height: 15px; width: 30px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/grey-chevron.svg) no-repeat 0 0; /*//cdn2.hubspot.net/hubfs/4323997/Flock_April2019/images/chevron-3c7c1f40.svg */ background-size: 100% 100%; bottom: 150px; } .down-cursor { position: absolute; left: 50%; -ms-transform: translateX(-50%); -webkit-transform: translateX(-50%); transform: translateX(-50%); opacity: 0.7; cursor: pointer; } .down-cursor:hover { opacity: 1; } .hs-home-layout .custom-brand-name .brand-title { border: none; } .hs-home-layout #hs_cos_wrapper_widget_1555409583571 .custom-top-video-section.unit { padding-top: 10px; padding-bottom: 0; } .hs-home-layout div#hs_cos_wrapper_widget_1555409583571 .custom-top-video-section.unit .screenImage1Text h2.title{ font-size: 56px; } .hs-indexb-layout .screenImage1Text h2.title { margin: 0 0 15px 0; } .hs-home-layout .screenImage1Text h2.title { margin: 0 0 15px 0; color: #585858; } .custom-top-video-section .video-wrap { margin-top: 35px; } .custom-top-video-section .image-box { margin: 0 auto; min-width: 600px; min-height: 400px; max-width: 900px; position: relative; -webkit-box-shadow: 0 3px 30px rgba(0,0,0,0.5); box-shadow: 0 3px 30px rgba(0,0,0,0.5); float: none; } .custom-top-video-section .video-wrap .image-box:after { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 1s; -webkit-transition: all 1s; z-index: 1; background: rgba(0,0,0,0.01); } .custom-top-video-section .video-wrap .video-play-btn { position: absolute; top: 50%; left: 50%; margin: auto; cursor: pointer; -webkit-transition: all .5s ease; transition: all .5s ease; -ms-transform: translate(-50%, -50%) scale(0.9); -webkit-transform: translate(-50%, -50%) scale(0.9); transform: translate(-50%, -50%) scale(0.9); z-index: 4; } .custom-top-video-section .video-wrap .video-play-btn:hover, .custom-top-video-section .video-wrap .image-box:hover .video-play-btn { opacity: 1; -webkit-transition: all .5s ease; transition: all .5s ease; -ms-transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .custom-top-video-section .video-wrap .image-box:hover:after { background: rgba(0,0,0,0.3); cursor: pointer; } .hs-home-layout.hs-indexb-layout .close-video-modal:before { left: 7px; } .custom-top-video-section .try-demo-block { display: none; text-align: center; padding: 50px 0 0 0; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .custom-top-video-section .try-demo-block span.txt { font-size: 20px; } .custom-top-video-section .try-demo-block .demoTeamLink { color: #0ab54d; cursor: pointer; font-size: 20px; display: block; } .custom-top-video-section .try-demo-block .demoTeamLink:hover { opacity: 0.8; } .custom-top-video-section .try-demo-block .demoTeamLink span { border-bottom: 1px solid #0ab54d; } .hs-home-layout .screen-image-block .screen-image { max-width: 1200px; box-shadow: none; margin: 20px 0 0; } .hs-home-layout.hipchat-migration .home-page .heading-wrap h1 { padding: 20px 10px 15px 10px; opacity: 1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.1; letter-spacing: -2.5px; } body.team-collaboration-page { padding: 0; } body.team-collaboration-page .body-container { padding: 0; } .team-collaboration-page #header { background: transparent; } .team-collaboration-page #header.fixedNav { background: #fff; } .team-collaboration-page .custom-menu-primary .hs-menu-wrapper>ul>li>a { color: #585858; } .team-collaboration-page #header .page-center { padding-left: 10px; padding-right: 10px; } .team-collaboration-page #header.fixedNav .page-center { padding-left: 0; padding-right: 0; } .team-collaboration-page .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children:after { border-top-color: #585858; } .team-collaboration-banner #main-area { min-height: 760px; background: #fff; position: relative; } .team-collaboration-banner .block-content { padding-top: 170px; } .team-collaboration-banner .block-content .left-section { display: inline-block; width: 100%; padding-top: 90px; margin-bottom: 10px; } .team-collaboration-banner .block-content .mast-head3 { height: 180px; background-size: 100%; -webkit-box-shadow: -1px 2px 20px #ccc; box-shadow: -1px 2px 20px #ccc; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; position: relative; } .team-collaboration-banner .video-play-btn { position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; cursor: pointer; z-index: 9; width: 100px; -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } .team-collaboration-banner .block-content .mast-head3:hover .video-play-btn { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } .team-collaboration-banner .block-content .mast-head3:after { content: ''; position: absolute; left: 0; width: 100%; height: 100%; background: transparent; -webkit-transition: background .3s ease-in-out; transition: background .3s ease-in-out; } .team-collaboration-banner .block-content .mast-head3:hover:after { background: rgba(0,0,0,0.3); -webkit-transition: background .3s ease-in-out; transition: background .3s ease-in-out; } .team-collaboration-banner .try-demo-block { display: none; text-align: center; padding: 20px 0 0 0; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .team-collaboration-banner .try-demo-block p { font-size: 20px; color: #585858; line-height: 1.42857; } .team-collaboration-banner .try-demo-block a { color: #0ab54d; cursor: pointer; font-size: 20px; display: block; } .team-collaboration-banner .try-demo-block a:hover { opacity: 0.8; } .team-collaboration-banner .try-demo-block a span { border-bottom: 1px solid #0ab54d; } .team-collaboration-banner .block-content .right-section { display: inline-block; width: 100%; text-align: center; } .team-collaboration-banner .heading-wrap { display: block; min-height: 65px; } .team-collaboration-banner .block-content h1 { display: block; padding: 20px 10px 15px 10px; opacity: 1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.1; letter-spacing: -2.5px; color: #585858; } .team-collaboration-banner .block-content .right-section ._get-started { padding-bottom: 60px; } .team-collaboration-banner .block-content .right-section ._g-s-label { color: #585858; } .team-collaboration-banner ._get-started .hs-submit { margin: 0; } .team-collaboration-banner ._get-started .hs-input { margin: 0 -4px 0 0; border-radius: 6px 0 0 6px; } .team-collaboration-banner ._get-started .hs-button { background: #0c8e45; border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; padding: 15px 20px; } .team-collaboration-banner ._get-started .hs-form-field { width: 240px; margin-right: 0; } .team-collaboration-banner ._get-started .hs-button:hover { background: #0c8e45; } .team-collaboration-banner .get-started-v2 form { padding-bottom: 60px; } .team-collaboration-banner .icon-section { padding: 0; margin: 0; border: none; text-align: left; } .team-collaboration-banner .icon-section .wrapper { max-width: 1100px; } .team-collaboration-banner .icon-section p { margin: 0 0 10px; font-size: 16px; } .team-collaboration-banner .icon-section .icon-wrapper { text-align: left; } .team-collaboration-banner .icons.flock-users-icon { height: 40px; background-size: cover; background-position: center; margin-right: 20px; background-repeat: no-repeat; } .custom-Signup-wrapper .bottom-get-started .g-s-download, .custom-Signup-wrapper .bottom-get-started .g-s-download a { color: #fff; } ._get-started span.disc { background: #333333; border-radius: 50%; display: inline-block; height: 5px; margin: 0 5px 0 10px; vertical-align: middle; width: 5px; } .img-bounce-up { opacity: .9; -webkit-transform: translate3d(0, 140px, 0); transform: translate3d(0, 140px, 0); -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out } .img-bounce-left { -webkit-transform: translate3d(-140px, 0, 0); transform: translate3d(-140px, 0, 0); -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .img-bounce-right { -webkit-transform: translate3d(140px, 0, 0); transform: translate3d(140px, 0, 0); -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .text-bounce-up { opacity: 1; -webkit-transform: translate3d(0, 140px, 0); transform: translate3d(0, 140px, 0); -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out } .bounceInUp { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 } .bounceInRight { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 } .textAnimation { opacity: 0; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; -webkit-transform: translate3d(80px, 0, 0); transform: translate3d(80px, 0, 0) } .textAnimation2 { opacity: 0; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; -webkit-transform: translate3d(-80px, 0, 0); transform: translate3d(-80px, 0, 0) } .textAnimation3 { opacity: 0; -webkit-transition: all .5s ease-in-out; transition: all .5s ease-in-out; -webkit-transform: translate3d(0, 80px, 0); transform: translate3d(0, 80px, 0) } .bounceInUpText { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 } .modal-opacity { opacity: 1; transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0) } .hs-flock-vs-slack-row3 .cm-power-features .page-center { padding: 85px 20px 0; } @-webkit-keyframes bounce { 0% { bottom: 15px } 25%, 75% { bottom: 5px } 50% { bottom: 20px } 100% { bottom: 10px } } @keyframes bounce { 0% { bottom: 15px } 25%, 75% { bottom: 5px } 50% { bottom: 20px } 100% { bottom: 10px } } @-webkit-keyframes boxBounce { 0% { opacity: 0; transform: translate3d(0, 40px, 0); -webkit-transform: translate3d(0, 40px, 0) } 100% { opacity: 1; transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0) } } @keyframes boxBounce { 0% { opacity: 0; transform: translate3d(0, 40px, 0); -webkit-transform: translate3d(0, 40px, 0) } 100% { opacity: 1; transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0) } } .boxBounce { -webkit-backface-visibility: visible !important; backface-visibility: visible !important; -webkit-animation-name: boxBounce; animation-name: boxBounce; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-fill-mode: both; animation-fill-mode: both } .page-animation .animate-load { -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); opacity: 1 } .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide{ cursor: pointer } @media only screen and (min-width: 800px){ .team-collaboration-banner .try-demo-block { display: block; } .team-collaboration-banner .try-demo-block a { display: inline-block; } } @media only screen and (min-width: 1000px){ .link-and-arrow { margin: 30px 0 0; } .team-collaboration-banner .block-content { max-width: initial; margin: 0; padding-top: 70px; padding-left: 10px; } .team-collaboration-banner .block-content .block-content-wrap { position: relative; max-width: 1200px; width: 100%; margin: 0 auto; } .team-collaboration-banner .block-content .left-section { padding-right: 0; width: 100%; max-width: 900px; position: absolute; top: 60px; right: -250px; display: inline-block; padding-top: 0; margin-bottom: 0; vertical-align: middle; } .team-collaboration-banner .block-content .right-section, .team-collaboration-banner .block-content .left-section { direction: ltr; } .team-collaboration-banner .block-content .mast-head3 { height: 540px; max-width: 900px; background: url(/img/header-video-image-d1452a33.jpg); background-size: 100% 100%; display: inline-block; width: 100%; } .team-collaboration-banner .video-play-btn { width: 159px; } .team-collaboration-banner .try-demo-block { padding-right: 140px; } .team-collaboration-banner .block-content .right-section { text-align: left; vertical-align: middle; float: left; padding-top: 110px; width: 100%; max-width: 450px; } .team-collaboration-banner .block-content h1 { font-size: 56px; margin: 0; padding: 0; } .team-collaboration-banner .block-content .right-section ._get-started { text-align: left; padding-bottom: 0; } .team-collaboration-banner .block-content .right-section ._g-s-label { font-size: 22px; line-height: 36px; margin: 20px 0 50px 0; text-align: left; font-family: proxima-regular, Helvetica, Arial, sans-serif; letter-spacing: -0.8px; } .team-collaboration-banner ._get-started ._g-s-mobile { display: none; } .hs-home-layout .bottom-get-started .g-s-label { font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .custom-home-wrapper .bottom-get-started p.g-s-label { font-size: 28px; letter-spacing: -0.8px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; margin: 0 0 50px 0; line-height: 1.02; } .hs-home-main .custom-home-wrapper .bottom-get-started p.g-s-label { font-size: 42px; } .custom-home-wrapper .bottom-get-started .g-s-download { font-size: 18px; } .custom-home-wrapper .bottom-get-started .g-s-download p { font-size: 20px; } } @media (min-width: 1500px){ .team-collaboration-banner .try-demo-block { padding-right: 0; } } /* ====================== features end ======================= */ @media (min-width: 800px){ .custom-top-video-section .try-demo-block { display: block; } .custom-top-video-section .try-demo-block .demoTeamLink { display: inline-block; } } @media only screen and (min-width: 1000px) { .desktop-screen { display: block; } .mobile-screen{ display: none; } .csm-two-column-equal .csm-col { width: 49%; } .csm-two-column-equal .right-block ul li{ font-size: 22px; } .csm-slider-with-thumbnail-content .page-center, .csm-features-sec3 .page-center{ padding: 100px 0; } .csm-slider-with-thumbnail-content .heading-block p { font-size: 22px; line-height: 34px; } .content-section-wrapper .text-block h6{ font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .csm-slider-with-thumbnail-content .heading-block { margin-bottom: 100px; text-align: center; } .custom-banner-section{ padding-bottom: 100px; } .custom-banner-section .page-center{ padding: 100px 0 0; } .fixed-product-keys { display: block; } .product-keys { display: block; } .section-wrapper { max-width: 100%; padding: 50px 0; } .csm-feature-group .heading-block h3 { font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; } .csm-feature-group .heading-block h5 { padding-bottom: 60px; } .section-wrapper .content-text { max-width: 454px; } .csm-feature-group .slider section, .csm-slider-with-thumbnail-content .slider-container{ padding: 70px 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .csm-slider-with-thumbnail-content .slider-container{ padding:0px; -webkit-box-align: normal; -ms-flex-align: normal; align-items: normal; } .csm-feature-group .slider section .content-section-wrapper, .csm-slider-with-thumbnail-content .slider-container .content{ width:50%; } .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-list { overflow: visible; padding: 0px !important; } .csm-slider-with-thumbnail-content.api-block .api-key-slider { width: 470px; padding-left: 70px; } .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-track { -webkit-transform: translate3d(0, 0, 0) !important; -ms-transform: translate3d(0, 0, 0) !important; transform: translate3d(0, 0, 0) !important; width: 100% !important; text-align: left; } .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-slide { outline: none !important; } .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-slide p{ text-align: left; width: 100% !important; margin: 0; padding: 30px 0; } .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-current p { color: #0abe51; } .csm-slider-with-thumbnail-content.api-block .api-img-slider { width: 600px; margin: 0 0 0 70px; } .csm-slider-with-thumbnail-content.api-block img { padding: 0; } .csm-slider-with-thumbnail-content .api-img-slider .slick-dots { display: block !important; } .api-block .api-img-slider li { padding: 0 7px; } .api-block .api-img-slider button { height: 6px; width: 40px; border-radius: 0; } .content-section-wrapper .img-block { margin-right: 30px; width: 600px; float: right; } .csm-feature-group section.csm-right .img-block{ margin-left: 30px; float: none; margin-right: 0px; } .content-section-wrapper .img-block img { margin-bottom: 0px; } .content-section-wrapper .text-block { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/icon-collaboration-87171a27-1.svg) no-repeat 0 7px; background-size: 40px; margin-left: 30px; padding: 0 0 0 70px; width: 470px; text-align: left; } #productivity .text-block{ background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/icon-productivity-5059e103-1.svg) no-repeat 0 7px; background-size: 40px; } #integrations .text-block { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/icon-integrations-36a3f683-1.svg) no-repeat 0 7px; background-size: 40px; } .csm-feature-group section.csm-right .text-block{ margin-left: 0px; margin-right: 0px; } .csm-feature-group section.csm-right .csm-col1 { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .csm-feature-group section.csm-right .csm-col2 { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } .section-wrapper .content-text h6 { text-align: left; } .section-wrapper .content-text li { background-size: 16px; font-size: 18px; padding: 0 0 0 22px; } .section-wrapper .content-img { width: 680px; max-width: 680px; } .section-wrapper .content-img .slick-dots li button { width: 40px; height: 6px; } .section-wrapper.left { direction: rtl; } .section-wrapper.left .content-img, .section-wrapper.left .content-text { direction: ltr; } .integration-tools h6 { margin: 0 0 57px; font-size: 42px; } .integration-tools .integration-logo { display: inline-block; margin: 0 6px 20px; } .integration-tools span { width: 100px; height: 100px; display: block; margin: 0 20px 20px; } .integration-tools p { font-size: 18px; } .integration-tools .more-apps-btn { font-size: 23px; padding: 9px 25px; margin: 50px 0 0; } .testimonial .testimonial-quote { font-size: 30px; font-family: 'PT Serif Caption', 'Helvetica', 'Arial', sans-serif; margin: 0 0 80px; } .testimonial .testimonial-quote:before, .testimonial .testimonial-quote:after { height: 14px; width: 14px; } .testimonial .testimonial-quote:after { top: -10px; } .testimonial .testimonial-quote:before { top: -10px; } .testimonial .testimonial-name { font-size: 26px; } .testimonial .slick-prev { left: -102px; top: 50px; } .testimonial .slick-next { right: -102px; top: 50px; } ._get-started { max-width: 800px; margin: 0 auto; padding: 0; } .bottom-get-started ._get-started { padding: 50px 0 50px; } ._get-started .hs-button { display: inline-block; width: auto; padding: 15px 14px; font-size: 22px; vertical-align: top; } ._get-started .hs-input { padding: 15px 20px; font-size: 20px; } ._get-started .hs-form-field { display: inline-block; width: 305px; margin-bottom: 0; vertical-align: top; margin-right: 10px; } .bottom-get-started .g-s-download { display: block; font-size: 18px; color: #585858; margin-top: 20px; text-align: center; letter-spacing: -0.4px; } .bottom-get-started .g-s-download a { text-decoration: underline; text-align: center; } ._get-started .g-s-mobile { display: none; } ._get-started .g-s-label { font-size: 28px; margin: 20px 0 50px 0; text-align: left; line-height: 1.2; font-family: proxima-regular, Helvetica, Arial, sans-serif; } ._get-started .hs_error_rollup { position: absolute; bottom: -20px; left: 76px; } .customer-page ._get-started .hs_error_rollup { left: 83px; } .custom-home-banner .hs_error_rollup { left: 0px; } .bottom-get-started .g-s-label { font-size: 28px; margin: 0 0 50px 0; line-height: 1.02; } .bottom-get-started ul.hs-error-msgs label { margin: 0; font-size: 12px; color: #ff3b47; line-height: 34px; } .integration-tools br { display: none; } .videos .slider-box { padding-top: 30px; } .videos .slick-list { overflow: hidden; } .videos .video-block .screen { width: 280px; height: 156px; } .videos .video-block .screen img { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .videos .video-block .screen:hover img { -webkit-transform: scale(1.02); -ms-transform: scale(1.02); transform: scale(1.02); -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .videos .page-center { padding: 80px 40px; } .top-section .flockos-wrap { padding-top: 80px; } .videos-banner .page-center { padding: 120px 40px; } .top-section .div-minimum { max-width: 900px; display: inline-block; } .videos .slick-prev, .videos .slick-next { top: 50px; } .inner-customer-content .header-section .header-wrap { padding: 231px 0 0 0; } .inner-customer-content .header-section .header-content-detail { padding: 40px; min-height: 420px; } body.customer-page { padding: 0; } .inner-customer-content .header-section .left-block { display: inline-block; width: 35%; margin-bottom: 0; text-align: left; vertical-align: top; } .inner-customer-content .header-section .left-block h1.heading { font-size: 42px; } .inner-customer-content .header-section .left-block a.link { cursor: pointer; font-size: 22px; } .inner-customer-content .header-section .right-block { display: inline-block; width: 64%; vertical-align: top; position: absolute; top: -40px; right: -40px; } .inner-customer-content .header-section .right-block .video-screenshot { min-height: 420px; } .inner-customer-content .header-section .right-block .video-play-btn { height: 140px; } .params-block { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .params-unit { max-width: 300px; text-align: left; margin-bottom: 0; } .params-unit span.tag { padding-bottom: 15px; } .testimonail-block p.testimonial-text { font-size: 36px; } .customer-middle-section .image-content { margin-top: 90px; } .image-content img.elevated { position: relative; top: -50px; } .customer-section-bottom-flexi ._get-started .hs-button { padding: 15px 20px; } .more-stories-block h2 { font-size: 42px; margin: 0 0 55px 0; } .more-stories-block .stories-wrap { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .more-stories-block .stories-unit { margin-bottom: 0; } .more-stories-block .image-wrap { max-width: 35%; } .more-stories-block .right-box { width: 60%; padding: 0 20px; text-align: left; } .drivezy-videos .params-block { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .drivezy-videos .params-unit { max-width: 100%; margin-bottom: 0; } .drivezy-videos .video-play-btn { height: 100px; } .csm-features-sec2 .integration-tool.section { padding-left: 0px; padding-right: 0px; } .csm-features-page .integration-tools h6 { font-size: 32px; } .customer-testimonial .slick-topsection h2.title { font-size: 36px; } .customer-testimonial .slick-topsection h2.title:before { top: -12px; left: -10px; } .customer-testimonial .slick-topsection h2.title:after { top: -8px; left: 10px; } .customer-testimonial { min-height: 880px; } .customer-testimonial .outer-wrap { padding-top: 140px; } .customer-testimonial .slick-next { right: -53px; } .customer-testimonial .slick-prev { left: -48px; } .customer-testimonial .slick-arrow { display: block; } .customer-testimonial .slick-prev, .customer-testimonial .slick-next { top: 43%; bottom: auto; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } .customer .unit, .customers-logo.unit{ padding: 70px 20px; } .customers-logo .logo-box { padding: 80px 20px; margin-top: -300px; margin-bottom: 130px; } .customer h2, .customers-logo h2{ font-size: 42px; padding-bottom: 50px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; line-height: 1.2; margin: 0; } .customer .description-block .left-block { width: 49%; } .customer .description-block .right-block { width: 49%; margin-bottom: 20px; } .customer h3 { font-size: 22px; line-height: 1.2; } .customer .right .description-block .desktop-left-block { display: none; padding-left: 30px; } .customer .right .description-block .mobile-left-block { display: inline-block; } .customer .left .description-block .desktop-left-block { display: inline-block; padding-left: 30px; } .customer .left .description-block .mobile-left-block { display: none; } .twitter-slider p { font-size: 22px; } .customer-testimonial-slider .profile-text, .customer-testimonial-slider .profile-img { text-align: center; width: 49.5%; } .customer-testimonial-slider .profile-text { text-align: left; padding: 0 20px 0 30px; } .customer-testimonial-slider .profile-text p.txt { font-size: 28px; } .customer-testimonial-slider .customer-detail { font-size: 22px; } .customer-testimonial-thumbnail-slider { width: 100%; margin: 0; } .customer-testimonial-thumbnail-slider .slick-track { margin-left: 0; } .customer-testimonial-thumbnail-slider .slick-prev { top: 20px; left: -60px; } .customer-testimonial-thumbnail-slider .slick-next { top: 0; right: -60px; } .offer-banner { min-height: 700px; } .offer-banner .page-center { padding-top: 160px; } .offer-banner .left-section { float: left; display: block; width: 50%; position: relative; top: 10px; } .offer-banner .left-section h3 { font-size: 14px; color: #585858; font-weight: bold; margin: 0; padding: 14px 0; line-height: 22px; } .offer-banner .left-section form { border-radius: 0 0 4px 4px; } .offer-banner .right-section { float: right; display: block; width: 50%; max-width: 50%; padding: 0; margin: 0 0 10px 0; text-align: left; } .offer-banner .right-section h1 { font-size: 42px; line-height: 50px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; letter-spacing: -0.5px; } .offer-banner .right-section h3 { color: #fff; margin: 40px 0 20px 0; padding: 0; font-size: 18px; text-transform: uppercase; font-weight: 600; line-height: 26px; } .offer-banner .right-section ul li { font-size: 20px; } .offer-page .customers-logo .page-center { padding: 115px 0 45px 0; } .icon-section .icons { display: inline-block; } .stride-migration .custom-hipchat-section .bottom-get-started ._get-started { padding: 0; margin-bottom: 100px; } .stride-migration .custom-hipchat-section ._get-started .hs-form-field { margin: 0 -4px 0 0; } .stride-migration .custom-hipchat-section ._get-started .hs-input { border-radius: 6px 0 0 6px; padding: 15px 19px 15px; } .why-flock-banner .page-center { padding: 150px 20px 30px; } .why-flock-banner .mobile-banner { display: none; } .why-flock-banner .get-started form{ position: relative; display: inline-block; max-width: 700px; padding: 8px; margin: 0 auto; text-align: center; border-radius: 6px; } .why-flock-banner ._get-started ._g-s-mobile { display: none; } .why-flock-banner .desktop-banner { display: block; padding-top: 25px; } .product-feature .page-center { padding: 110px 40px 85px; position: relative; border-top: 4px solid #0abe51; margin-top: -35px !important; } .two-col-equal-image-wrap .unit { padding: 85px 0; } .two-col-equal-image-wrap .unit .text h4 { margin-bottom: 60px; } .two-col-equal-image-wrap .separator:after { height: 2px; } .two-col-equal-image-wrap.left .unit .right { float: left; } .two-col-equal-image-wrap.left .unit .left { float: right; } .hs_cos_wrapper_type_module:last-of-type .separator:after { display: none; } .why-flock-page .bottom-get-started ._get-started { max-width: 950px; padding: 50px 0 50px; margin: 0 auto; } .why-flock-page .bottom-get-started .g-s-label { font-size: 49px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .why-flock-page .bottom-get-started .g-s-download { color: #fff; font-size: 15px; text-align: center; } .why-flock-page .bottom-get-started .g-s-download span.disc { background: #fff; border-radius: 50%; display: inline-block; height: 5px; margin: 0 5px 0 10px; vertical-align: middle; width: 5px; } .why-flock-page .homepage-variant { padding: 100px 10px !important; } .why-flock-row2 .custom-brand-name { padding: 30px 0; } .why-flock-row2 .custom-brand-name .brands-inline .brand-title { color: #333333; margin-bottom: 30px; padding: 40px 10px 0 10px; border: none; } .homepage-variant { padding: 120px 10px; } .homepage-variant .testimonial-variant-slider .profile-text, .homepage-variant .testimonial-variant-slider .profile-img { width: 49.5%; } .homepage-variant .testimonial-variant-slider .profile-text { padding: 0 20px 0 30px; } .homepage-variant .testimonial-variant-slider .profile-text p.txt { font-size: 28px; } .homepage-variant .testimonial-variant-slider .profile-text span.divider, .homepage-variant .testimonial-variant-slider .profile-img span.divider { margin-bottom: 30px; } .homepage-variant .testimonial-variant-slider .customer-detail { font-size: 22px; } .flock-vs-slack-banner .block-content { padding: 140px 10px 0; } .flock-vs-slack-banner .block-content .mast-head { display: inline-block; width: 100%; max-width: 450px; height: 450px; background-size: 100% 100%; } .flock-vs-slack-banner .block-content .right-section { width: 50.5%; text-align: left; vertical-align: middle; direction: ltr; } .flock-vs-slack-banner .block-content h1 { font-size: 56px; margin: 0; padding: 0; } .flock-vs-slack-banner .block-content .right-section ._get-started { text-align: left; } .flock-vs-slack-banner .block-content .right-section ._g-s-label { font-size: 25px; margin: 20px 0 50px 0; text-align: left; line-height: 1.2; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .flock-vs-slack-banner ._get-started ._g-s-mobile { display: none; } .flock-vs-slack-banner .icon-section .icon-wrapper { padding: 0; text-align: left; } .flock-vs-slack3-page .cm-smart-block .page-center, .flock-vs-slack3-page .award-section-wrapper .page-center{ padding: 75px 40px; } .flock-vs-slack3-page .testimonial-section { padding: 75px 0 20px; } .hipchat-migration.flock-vs-slack3-page .custom-Migrate-wrapper .page-center { padding: 85px 40px 40px 40px; } .range-block .page-center { padding: 75px 40px; } .range-block .container { padding: 0 80px 0 60px; } .flock-vs-slack3-page .unit.custom-Migrate-wrapper .page-center { padding: 85px 40px 40px 40px; } .flock-vs-slack3-page #securityBlock .left-block { width: 49%; margin-bottom: 0; text-align: left; padding-left: 0; } .flock-vs-slack3-page #securityBlock .right-block { vertical-align: middle; width: 49%; } .flock-vs-slack3-page .bottom-get-started .g-s-label { font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .flock-vs-slack3-page .bottom-get-started ._get-started { max-width: 870px; } .flock-vs-slack-banner .block-content .mast-head.mobile { display: none !important; } .award-section .gartner-award { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .award-section img.gartner-img { margin-bottom: 0px; } .award-section img { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .award-section img.double-quotes { margin-bottom: 0; } .award-section .gartner-award p { text-align: left; } .award-section p { -webkit-box-flex: 6; -ms-flex: 6; flex: 6; } .testimonial-section .testimonial-txt { margin: 0 0 20px; } .testimonial-section .yellow-bg-txt { margin: 0 0 20px; } .testimonial-section .logo { margin: 35px 0 0; } .flock-vs-slack2 .flock-pricing-benefit .direction-rtl, .hipchat-migration .flock-pricing-benefit .direction-rtl, .stride-migration .flock-pricing-benefit .direction-rtl { direction: rtl; } .flock-vs-slack2 .flock-pricing-benefit .flock-screenshot, .hipchat-migration .flock-pricing-benefit .flock-screenshot, .stride-migration .flock-pricing-benefit .flock-screenshot { width: 670px; margin: 0 50px 0 0; } .flock-vs-slack2 .flock-pricing-benefit .pricing-benefit-section, .hipchat-migration .flock-pricing-benefit .pricing-benefit-section, .stride-migration .flock-pricing-benefit .pricing-benefit-section { width: 49%; } .flock-vs-slack2 .flock-pricing-benefit .pricing-benefit-txt, .hipchat-migration .flock-pricing-benefit .pricing-benefit-txt, .stride-migration .flock-pricing-benefit .pricing-benefit-txt { margin: 0; } .flock-vs-slack2 .flock-pricing-benefit h3, .hipchat-migration .flock-pricing-benefit h3, .stride-migration .flock-pricing-benefit h3 { text-align: left; } .flock-vs-slack2 #securityBlock .left-block, .hipchat-migration #securityBlock .left-block, .stride-migration #securityBlock .left-block { width: 45%; text-align: right; padding-right: 70px; vertical-align: middle; } #securityBlock .right-block, .hipchat-migration #securityBlock .right-block, .stride-migration #securityBlock .right-block { width: 53%; vertical-align: middle; } .about-flock .about-flock-txt { margin: 0; } .about-flock ul { margin: 0 0 50px; } .award-section h3 { margin-bottom: 50px; } .award-section .gartner-award { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .award-section img.gartner-img { margin-bottom: 0px; } .award-section img { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .award-section img.double-quotes { margin-bottom: 0; } .other-awards .section-wrapper { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .other-awards .section { margin-bottom: 0; } .mast-head-mobile{ display: none !important; } .signup-pro h1 { font-size: 64px; padding: 0 10px; } .signup-pro .header-section:before { left: 1%; width: 325px; height: 387px; -webkit-transform: translateX(-1%); -ms-transform: translateX(-1%); transform: translateX(-1%); } .signup-pro .header-section:after { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/vector-banner-right-89871f8a.png) no-repeat 0 0; display: inline-block; width: 325px; height: 345px; background-size: 100% 100%; position: absolute; bottom: -8%; right: 1%; } .signup-pro h2 { font-size: 42px; } .signup-pro .signup-feature-unit .properties-block { text-align: left; } .signup-pro .signup-feature-unit .individual-unit { float: left; width: 50%; padding: 0 60px 60px 0; -webkit-box-sizing: border-box; box-sizing: border-box; } .signup-pro .signup-feature-unit .left-block { display: inline-block; width: 25%; margin-bottom: 0; padding-right: 20px; vertical-align: top; text-align: left; -webkit-box-sizing: border-box; box-sizing: border-box; } .signup-pro .signup-feature-unit .right-block { display: inline-block; width: 73%; min-height: 180px; } .signup-pro h3 { font-size: 22px; } .signup-pro .signup-feature-unit .right-block h3, .signup-pro .signup-feature-unit .right-block p { text-align: left; } .signup-pro .security-unit .security-left-block { float: left; width: 30%; margin-top: 50px; } .signup-pro .security-unit .security-right-block { float: right; width: 50%; } .signup-pro .security-unit .security-right-block li { font-size: 22px; } .signup-pro .security-unit .security-left-block h2 { text-align: left; } .signup-pro .award-section-unit .award-unit { display: inline-block; width: 49%; vertical-align: top; } .signup-pro .award-section-unit .award-unit { display: inline-block; width: 49%; vertical-align: top; } .signup-pro .award-section-unit .left-unit { float: left; display: inline-block; text-align: left; width: 30%; margin-bottom: 0; } .signup-pro .award-section-unit .right-unit { float: left; display: inline-block; width: 69%; } .signup-pro .award-section-unit .right-unit p { text-align: left; } body.hs-signup-layout .bottom-get-started .g-s-label { color: #fff; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .custom-app-banner .top-content{ padding-top: 80px; padding-bottom: 80px; } .custom-app-banner .app-img { margin-bottom: 0; width: 50%; } .custom-app-banner .app-content { width: 50%; padding-left: 55px; display: block; text-align: left; } .custom-app-banner .newline { display: block; } .custom-app-banner .app-content p { margin: 20px 0 40px 0; font-size: 22px; line-height: 34px; } .title-wrap .caption { line-height: 65px; padding-bottom: 60px; font-size: 32px; } .newline { display: block; } .apps-wrap .left-block { float: left; width: 40%; padding-right: 30px; -webkit-box-sizing: border-box; box-sizing: border-box; } .apps-wrap .right-block { float: left; width: 60%; } .custom-webhooks-wrapper .left-block h3 { font-size: 30px; line-height: 45px; } .apps-beta .apps-icon { display: inline-block; } .apps-beta .title-wrap .caption { padding-bottom: 20px; display: block; font-size: 32px; line-height: 65px; } .custom-app-flock .title-wrap h3 { font-size: 30px; line-height: 45px; } .apps-line { margin: 80px 0 100px 0; } .unit-wrap { width: 95%; margin: 0 auto 50px auto; } .unit-wrap .unit { width: 48%; padding: 0 20px 0 0; margin-bottom: 40px; text-align: left; -webkit-box-sizing: border-box; box-sizing: border-box; } body.hs-apps-layout h3 { font-size: 30px; line-height: 45px; } .unit-wrap .unit.right-unit { padding: 0 0 0 20px; } .unit-wrap:last-child { margin: 0 auto; } .custom-app-flock.apps-wrap { margin-bottom: 10px; } .custom-full-banner ._get-started ._g-s-sublable { display: block; font-size: 22px; color: #fff; margin-top: 15px; text-align: left; letter-spacing: -0.4px; } .custom-full-banner.header-section:after { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/why-flock4-hero-cbbfc4f4.png) no-repeat 53% 0; background-size: 1250px 100%; width: 100%; height: 475px; position: absolute; top: 102px; } .custom-full-banner .header-video-wrap { padding: 100px 10px 220px; } .custom-full-banner .video-play-btn { max-width: 150px; } .hs-indexb-layout .testimonial-block { padding: 0 10px 50px; } .hs-indexb-layout .testimonial-box span.yellow-txt { padding: 20px 40px; font-size: 16px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/yellow-highlight-0482deb3-2.png) no-repeat 0 0; background-size: 100% 100%; } .hs-indexb-layout .testimonial-box { padding: 30px 0; } .hs-indexb-layout .testimonial-box p.testimonial-text { margin: 10px 0 20px 0; font-size: 36px; } .hs-indexb-layout .testimonial-box span.client-name { font-size: 22px; } .hs-indexb-layout .unit { padding: 120px 10px 120px 10px; } .hs-indexb-layout .screen-image-block { max-width: 1200px; width: 100%; text-align: center; display: block; } .hs-indexb-layout .other-awards .wrapper { padding: 30px 40px 94px 40px !important; } .case-study-videos { padding: 100px 20px; } .case-study-videos .video-block-wrapper { -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .case-study-videos .video-block { max-width: 350px; text-align: left; margin-bottom: 0; } .case-study-videos h3 { margin-bottom: 80px; } .case-study-videos .video-play-btn { max-width: 150px; } .case-study-videos .link-and-arrow { margin: 80px 0 0; } .brands-inline { position: relative; padding: 0; } .custom-brand-name .brands-inline .brand-title { padding-top: 40px; } .brands-inline .brand-title { padding: 40px 10px 0 10px; } .brands-inline .brands-wrap { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; margin: 0 auto; height: 140px; padding: 20px 0; } .custom-slider-subheading p { margin: 0 0 80px; } .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider { padding-left: 0 !important; width: 445px !important; } .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide { padding: 20px; width: 100% !important; border-left: 5px solid #fff; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide p.slider-topic { font-size: 18px; font-family: proxima-regular, Helvetica, Arial, sans-serif; padding: 0; line-height: 26px; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider { margin-bottom: 100px; } .hs-indexe-layout .unit.award-section-wrapper { margin-bottom: 94px; } .hs-indexe-layout .case-study-videos .page-center { padding: 0 10px !important; } .hs-indexe-layout .get-started-v2.get-started-inline ._get-started { padding-bottom: 85px; } .chevron { display: inline-block; } .custom-top-video-section .video-wrap .image-box .video-play-btn { max-width: 159px; } .hs-home-layout.hipchat-migration .home-page .heading-wrap h1 { font-size: 56px; margin: 0; padding: 0; } } @media only screen and (min-width: 1020px){ .flock-vs-slack3-page .cm-smart-rgt-block, .flock-vs-slack3-page .cm-smart-lft-block { width: 49%; } .about-flock h2, .about-flock h3 { text-align: left; margin: 0 0 50px; } .about-flock .about-flock-block { width: 49%; } .about-flock .about-flock-img { width: 920px; height: 600px; margin-left: 40px; } } @media (min-width: 1100px){ .apps-icon { margin: 0 0 40px; } } @media only screen and (min-width: 1200px){ .product-feature { background: #f0f0f0; overflow: inherit; } .product-feature .page-center { background: #fff; max-width: 1200px !important; text-align: center; } .two-col-equal-image-wrap .unit { width: 100%; overflow: hidden; } .two-col-equal-image-wrap .unit .left { float: left; } .two-col-equal-image-wrap .unit .right { float: right; } .two-col-equal-image-wrap .unit .text { max-width: 543px; text-align: left; } .two-col-equal-image-wrap .unit .image { max-width: 500px !important; } .two-col-equal-image-wrap .unit .text p { font-size: 18px; } .range-paramenter .initial-state { position: relative; top: -43px; left: -25px; } .range-paramenter .initial-state { position: relative; top: -43px; left: -25px; } .range-paramenter .final-state { left: auto; right: -32px; } .range-paramenter .initial-state span.value { font-weight: 600; font-size: 28px; } .custom-full-banner #flock-introduction-video { max-width: 1000px; margin: 0 auto !important; float: none; } } @media (max-width: 1024px) and (min-width: 600px){ .flock-vs-slack3-page .cm-smart-rgt-block, .flock-vs-slack3-page .cm-smart-lft-block { max-width: 500px; margin: 0 auto; display: block; } .flock-vs-slack3-page .cm-smart-block .cm-smart-lft-block img { width: auto; height: 330px; margin: 0; } } @media (max-width: 1024px) and (min-width: 700px){ .customer .slick-topsection .slick-prev { left:-13px } .customer .slick-topsection .slick-next { right: -13px } .customer .slick-topsection { width: 90%; margin: 0 auto; padding: 0 50px } } @media (max-width: 1000px) and (min-width: 790px){ .offer-banner .page-center { padding: 130px 10px 15px 10px; } .offer-banner .right-section { text-align: left; margin-top: 10px; } } @media (max-width: 1024px) and (min-width: 1000px){ .offer-banner .page-center { padding: 160px 40px 0 40px; } } @media only screen and (max-width: 1200px) and (min-width: 900px){ .flock-vs-slack-banner .block-content h1 { font-size: 54px; } .hs-home-layout.hipchat-migration .home-page .heading-wrap h1, .team-collaboration-banner .block-content h1{ font-size: 54px; } } @media only screen and (max-width: 1200px) and (min-width: 1100px){ .team-collaboration-banner .block-content .right-section { padding-top: 90px; } .team-collaboration-banner .block-content .mast-head3 { height: 530px; max-width: 880px; } .team-collaboration-banner #main-area { min-height: 750px; } } @media only screen and (max-width: 1200px) and (min-width: 1000px){ .hipchat-migration .custom-flock-banner-area ._get-started .hs-form-field, .flock-vs-slack-banner ._get-started .hs-form-field, .team-collaboration-banner ._get-started .hs-form-field, .custom-home-banner ._get-started .hs-form-field{ width: 232px; } } @media only screen and (max-width: 1250px) and (min-width: 1000px){ .customer .customer-testimonial-thumbnail-slider .slick-prev { left: -20px; } .customer .customer-testimonial-thumbnail-slider .slick-next { right: -20px; } } @media only screen and (max-width: 1100px) and (min-width: 1000px){ .testimonial .slick-prev { left: -70px; } .testimonial .slick-next { right: -70px; } } @media only screen and (min-width: 1200px) { .content-section-wrapper .img-block { margin-right: 80px; } .csm-feature-group section.csm-right .img-block{ margin-left: 80px; margin-right: 0px; } .content-section-wrapper .text-block { margin-left: 80px; } .csm-feature-group section.csm-right .text-block{ margin-left: 0px; margin-right: 0px; } } @media only screen and (max-width: 1060px) and (min-width: 1000px){ .videos .video-block .screen { width: 260px; height: 146px; } } @media (min-width: 1450px){ .signup-pro h1 { margin-bottom: 0; } .signup-pro .header-section:before { bottom: -15%; left: 10%; } .signup-pro .header-section:after { bottom: -8%; right: 10%; } } @media only screen and (max-width: 1100px) and (min-width: 1000px){ .team-collaboration-banner .block-content .right-section { padding-top: 52px; } .team-collaboration-banner .block-content .left-section { right: -300px; } .team-collaboration-banner .block-content .mast-head3 { max-width: 800px; height: 472px; } .team-collaboration-banner #main-area { min-height: 700px; } } /* Styles that do not fit into any of the available sections above can go here. */ /* ========================================================================== 9. MEDIA QUERIES ========================================================================== */ /* =============== Screen sizes smaller than .page-center =============== */ @media only screen and (min-width: 600px){ h1 { font-size: 64px; } } @media (min-width: 1000px){ .custom-hipchat-bottom-form-mobile-button .mobilw-green-button { display: none; } p { font-size: 22px; line-height: 34px; } h1 { font-size: 64px; line-height: 70px; letter-spacing: -2.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } h2 { font-size: 56px; line-height: 62px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } h3 { font-size: 42px; line-height: 50px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } h4 { font-size: 36px; line-height: 40px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } h5 { font-size: 28px; line-height: 40px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } h6 { font-size: 32px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } #header { -webkit-transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); } #header .page-center { padding: 25px 0; -webkit-transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); text-align: left; } #header .logo a img { width: 140px !important; -webkit-transition: height 0.3s; transition: height 0.3s; } .custom-menu-primary { /* float: right !important; */ width: auto; margin-top: 8px; -webkit-transition: all 300ms; transition: all 300ms; position: static; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .custom-menu-primary .hs-menu-wrapper>ul>li { display: inline; margin: 0 6px; -webkit-transition: all 0.3s; transition: all 0.3s; line-height: 25px; float: none !important; } .custom-menu-primary .hs-menu-wrapper>ul>li.signin>a { line-height: 15px; padding: 8px 12px; border: 1px solid #d9d9d9; border-radius: 6px; } .custom-menu-primary .hs-menu-wrapper>ul>li.bookademo>a { padding: 3px 6px; background: #0abe51; border-radius: 4px; color: #ffffff !important; } .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children { margin-right: 20px; } .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children:after { content: ''; position: absolute; width: 0; height: 0; top: 9px; right: -3px; border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 4px solid #fff; } .custom-menu-primary .hs-menu-wrapper>ul ul { display: none !important; min-width: 157px; height: auto; left: -5px !important; top: 35px; background: #fff; border-radius: 5px; border: solid 1px #d5dadf; -webkit-box-shadow: 0 8px 10px 0 rgba(0,0,0,0.2); box-shadow: 0 8px 10px 0 rgba(0,0,0,0.2); -webkit-transition: width 0.5s cubic-bezier(0, 0, 0.3, 1) !important; transition: width 0.5s cubic-bezier(0, 0, 0.3, 1) !important; } .custom-menu-primary .hs-menu-wrapper>ul>li:hover ul { display: block !important; } .custom-menu-primary .hs-menu-wrapper>ul ul:before { content: ''; position: absolute; width: 0; height: 0; top: -7px; right: 56px; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 7px solid #fff; z-index: 1; } .custom-menu-primary .hs-menu-wrapper>ul ul:after { content: ''; position: absolute; width: 0; height: 0; top: -9px; right: 55px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #d5dadf; } .custom-menu-primary .hs-menu-wrapper>ul ul li { display: block; margin: 0; padding: 0; line-height: 25px; cursor: pointer; } .custom-menu-primary .hs-menu-wrapper>ul ul li:hover { background-color: #f0f0f0; } .custom-menu-primary .hs-menu-wrapper>ul ul li a { font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; text-transform: none; padding: 5px 10px 5px 15px; display: block; color: #585858; font-size: 14px; transition: all 0.5s; text-decoration: none; outline: 0; } .custom-menu-primary .hs-menu-wrapper>ul>li.customers ul { left: 5px !important; } .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.learnmore ul ul, .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.whyflock ul ul, .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.features ul ul{ position: relative !important; opacity: 1 !important; visibility: visible !important; left: auto !important; background: transparent; box-shadow: none; transition: none !important; border: none; border-radius: 0; min-width: 1px !important; } .custom-menu-primary .hs-menu-wrapper>ul> li.learnmore > ul >li, .custom-menu-primary .hs-menu-wrapper>ul> li.whyflock > ul >li, .custom-menu-primary .hs-menu-wrapper>ul> li.features > ul >li{ width: 140px; float: left !important; display: inline-block; } .custom-menu-primary .hs-menu-wrapper>ul> li.learnmore > ul >li>a, .custom-menu-primary .hs-menu-wrapper>ul> li.whyflock > ul >li>a, .custom-menu-primary .hs-menu-wrapper>ul> li.features > ul >li>a{ display: block; font-size: 14px; text-transform: uppercase; font-family: proxima-semibold, Helvetica, Arial, sans-serif; letter-spacing: 1.5px; line-height: 25px; padding: 6px 10px 0 15px; color: rgba(88,88,88,0.3); } .custom-menu-primary .hs-menu-wrapper>ul> li.features > ul >li>a{ color: #0abe51; } .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.learnmore ul ul:before, .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.learnmore ul ul:after, .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.whyflock ul ul:before, .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.whyflock ul ul:after, .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.features ul ul:before, .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.features ul ul:after{ display: none; } .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.learnmore > ul, .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.whyflock > ul{ left: -45px !important; min-width: 300px; } .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children.features > ul { left: -140px !important; min-width: 446px; } .custom-menu-primary .hs-menu-wrapper>ul> li.learnmore > ul >li:last-child, .custom-menu-primary .hs-menu-wrapper>ul> li.whyflock > ul >li:last-child, .custom-menu-primary .hs-menu-wrapper>ul> li.features > ul >li:last-child{ float: right !important; } .custom-menu-primary .hs-menu-wrapper>ul> li.features > ul >li:nth-child(1), .custom-menu-primary .hs-menu-wrapper>ul> li.features > ul >li:nth-child(2), .custom-menu-primary .hs-menu-wrapper>ul> li.features > ul >li:nth-child(3){ float: left !important; } .custom-menu-primary .hs-menu-wrapper>ul> li.features > ul >li:nth-child(1){ width: 162px; } .custom-menu-primary .hs-menu-wrapper>ul li.learnmore ul:before, .custom-menu-primary .hs-menu-wrapper>ul li.whyflock ul:before{ left: 138px; } .custom-menu-primary .hs-menu-wrapper>ul li.features ul:before{ left: 216px; } .custom-menu-primary .hs-menu-wrapper>ul li.learnmore ul:after, .custom-menu-primary .hs-menu-wrapper>ul li.whyflock ul:after{ left: 137px; } .custom-menu-primary .hs-menu-wrapper>ul li.features ul:after{ left: 215px; } .custom-menu-primary .hs-menu-wrapper>ul> li.learnmore > ul >li:hover, .custom-menu-primary .hs-menu-wrapper>ul> li.whyflock > ul >li:hover, .custom-menu-primary .hs-menu-wrapper>ul> li.features > ul >li:hover{ background: transparent; } .custom-menu-primary .hs-menu-wrapper>ul >li.learnmore ul ul li:hover, .custom-menu-primary .hs-menu-wrapper>ul >li.whyflock ul ul li:hover, .custom-menu-primary .hs-menu-wrapper>ul >li.features ul ul li:hover{ background-color: #f0f0f0; } .custom-menu-primary .hs-menu-wrapper>ul>li.bookademo ul { left: 12px !important; } .banner { padding: 62px 40px 0; } .content-block-wrapper { width: 49.5%; display: inline-block; vertical-align: middle; } .banner .banner-text { text-align: left; max-width: 451px; } .banner h2 { letter-spacing: -1.9px; } .banner p { font-size: 28px; } .banner .get-started { max-width: 800px; margin: 0 auto; padding: 0; } .banner .get-started .g-s-button { font-size: 22px; padding: 12px 32px; max-width: 290px; margin-bottom: 15px; } .desktop { display: inline-block; } .banner .banner-img { max-width: 865px; left: -55px; width: 865px; bottom: -59px; } .fixedNav .custom-menu-primary .hs-menu-wrapper>ul>li>a { color: #585858; } .fixedNav .custom-menu-primary { margin-top: -2px; } .fixedNav .custom-menu-primary .hs-menu-wrapper>ul>li.hs-item-has-children:after { border-top-color: #585858; } .banner .g-s-mobile { display: none; } .footer-block { display: inline-block; float: left; width: 75% !important; margin: 0; } .footer-right-column { width: 25% !important; float: right; padding-left: 4%; margin-left: 0 !important; margin-bottom: 30px; color: #f9f9f8; font-size: 14px; } .footer-menu .hs-menu-wrapper>ul>li { float: left; width: auto; margin: 0 25px; display: inline-block; text-align: left; color: #f9f9f8; font-size: 14px; vertical-align: top; } .footer-menu .hs-menu-wrapper>ul>li>a { text-align: left; } .footer-social ul li { float: right; width: 42px; } .footer-sprite { margin-bottom: 10px; } .footer-copyright { text-align: right; float: right; padding-top: 64px; } .footer-copyright a { display: inline; } .footer-menu .hs-menu-wrapper>ul li:last-child li:last-child { display: none; } .slick-arrow { display:block } .slick-dots { display: block !important } .slick-prev,.slick-next { width: 60px; top: 37%; bottom: auto; -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1) } .slick-next { right: -60px } .slick-prev { left: -60px } } @media only screen and (min-width: 1200px){ .banner .banner-img { left: -114px; } } @media only screen and (max-width: 1200px) and (min-width: 1000px){ .footer-menu .hs-menu-wrapper>ul>li { margin: 0 15px; } } @media only screen and (max-width: 1199px){ .hs-home-main.hs-indexb-layout .testimonial-block { margin-top: -60px; } } /* =============== Landscape tablet and smaller devices =============== */ @media (min-width: 1000px) { .custom-menu-primary.mobile-menu { display: none; } .header-right { float: right !important; } } @media (max-width: 1000px) { .video-modal video,.video-modal iframe { width:600px !important; height: 320px !important } .calendly-inline-widget video,.calendly-inline-widget iframe { width: 400px !important; height: 400px !important } } @media (max-width: 600px) { .video-modal video,.video-modal iframe { width:300px !important; height: 167px !important } .calendly-inline-widget video,.calendly-inline-widget iframe { width: 300px !important; height: 400px !important } } @media (max-width: 370px) { .calendly-inline-widget video,.calendly-inline-widget iframe { width:300px !important; height: 300px !important } } @media (max-width: 999px) { .custom-menu-primary.desktop-menu { display: none; } .custom-menu-primary.mobile-menu { display: block; } .footer-bg .page-center { padding-left: 25px; padding-right: 25px; } .footer-block { margin-bottom: 30px; width: 100% !important; } .footer-menu .hs-menu-wrapper>ul li a { text-align: center; display: block; } .footer-social { float: none !important; } .footer-right-column { margin-bottom: 30px; text-align: center; width: 100% !important; margin-left: 0 !important; } .footer-sprite { margin-bottom: 4px; } .footer-menu .hs-menu-wrapper>ul >li > a { margin-bottom: 15px; } .footer-menu .hs-menu-wrapper>ul li:last-child li:first-child, .footer-menu .hs-menu-wrapper>ul li:last-child li:nth-child(2) { display: none; } .footer-menu .hs-menu-wrapper>ul>li { vertical-align: top; } #header { text-align: center; } .header-col { float: none !important; } .footer-menu .hs-menu-wrapper>ul>li { width: 16%; margin-bottom: 0; min-height: auto; } .banner { padding: 26px 30px 0; } .banner .g-s-mobile { margin-bottom: 28px; } /* ===== Mobile Toggle Button ===== */ .mobile-trigger { display: inline-block !important; position: fixed; z-index: 9999; right: 1px; top: 21px !important; cursor: pointer; width: 30px; height: 30px; } .mobile-trigger em { margin-bottom: 3px; display: block; width: 20px; height: 2px; background: #fff; } .mobile-open { overflow: hidden; } /* Make child lists appear below parent items */ .custom-menu-primary ul.hs-menu-children-wrapper { visibility: visible !important; opacity: 1 !important; position: static !important; } /* Mobile Menu Styles */ .custom-menu-primary.js-enabled .hs-menu-wrapper { position: fixed; height: 100%; width: 60%; right: -60%; top: 0; float: none; z-index: 10; -webkit-transition: width 0.5s cubic-bezier(0, 0, 0.3, 1); transition: right 0.5s cubic-bezier(0, 0, 0.3, 1); overflow-y: auto !important; background: #000; } .mobile-open .custom-menu-primary.js-enabled .hs-menu-wrapper { display: block; width: 60%; background: #000; right: 0; transition: right 0.5s cubic-bezier(0, 0, 0.3, 1); } .custom-menu-primary .hs-menu-wrapper > ul { margin-top: 0px !important; } /* Level 1 Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul > li { display: block; line-height: 45px; padding-bottom: 15px; text-align: left; } .custom-menu-primary .hs-menu-wrapper > ul > li:last-child { display: none !important; } .custom-menu-primary .hs-menu-wrapper > ul > li a { font-size: 22px; /* Font size of top level list items */ line-height: 45px; overflow: visible; } .custom-menu-primary .hs-menu-wrapper > ul li a { color: #fff; font-size: 14px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; padding: 3px 6px; -webkit-transition: all 0.5s; transition: all 0.5s; text-decoration: none; outline: 0; text-transform: uppercase; display: block; padding-left: 20px; text-align: left; } .custom-menu-primary .hs-menu-wrapper .close-nav { color: #fff; cursor: pointer; padding: 8px 10px 7px 20px; margin-bottom: 10px; background: #313030; } .custom-menu-primary .hs-menu-wrapper > ul > li.hs-item-has-children > a:after { content: ''; position: absolute; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock-June2018/Images/plus-sign-0a63f51f.svg?t=1536756616381) no-repeat 0 0; width: 12px; right: 25px; color: #fff; height: 10px; top: 20px; font-size: 20px; display: none; } .mobile-open .custom-menu-primary .hs-menu-wrapper > ul > li.hs-item-has-children > a:after { display: block; } .custom-menu-primary .hs-menu-wrapper > ul li a:hover { color: #fff; } /* Level 2 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul ul { } .custom-menu-primary .hs-menu-wrapper > ul ul li.close-second-menu.first { display: block; line-height: 45px; text-align: left; color: #fff; cursor: pointer; padding: 8px 10px 7px 20px; margin-bottom: 10px; background: #313030; } .custom-menu-primary .hs-menu-wrapper > ul ul li.close-nav { display: block; line-height: 45px; text-align: left; padding-bottom: 15px; } .custom-menu-primary .hs-menu-wrapper > ul ul li a { display: block; text-align: left; color: #fff; font-size: 14px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; padding: 3px 6px; -webkit-transition: all 0.5s; transition: all 0.5s; text-decoration: none; outline: 0; text-transform: uppercase; padding-left: 20px; } /* Level 3 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul ul ul li a { } /* Level 4 and Higher Menu List Styles */ .custom-menu-primary .hs-menu-wrapper > ul ul ul ul li a { } .custom-menu-primary .hs-menu-wrapper ul > li.hs-menu-item.hs-item-has-children > ul { position: fixed !important; height: 100% !important; width: 0px !important; right: 0; left: auto !important; top: 0; float: none; z-index: 10; -webkit-transition: width 0.5s cubic-bezier(0, 0, 0.3, 1) !important; transition: width 0.5s cubic-bezier(0, 0, 0.3, 1) !important; z-index: 999999 !important; overflow-y: auto !important; } .custom-menu-primary .hs-menu-wrapper ul > li.hs-menu-item.hs-item-has-children > ul { width: 60% !important; right: -60%; transition: right 0.5s cubic-bezier(0, 0, 0.3, 1)!important; } .custom-menu-primary .hs-menu-wrapper ul li.hs-menu-item.hs-item-has-children.clicked > ul { right: 0; } .hs-menu-wrapper.hs-menu-flow-horizontal.flyouts > ul li.hs-item-has-children ul.hs-menu-children-wrapper { z-index: 11 !important; } .custom-menu-primary .hs-menu-wrapper ul > li.hs-menu-item.hs-item-has-children > ul { position: fixed !important; height: 100% !important; width: 0px !important; right: 0; left: auto !important; top: 0; float: none; z-index: 10; -webkit-transition: width 0.5s cubic-bezier(0, 0, 0.3, 1) !important; transition: width 0.5s cubic-bezier(0, 0, 0.3, 1) !important; z-index: 999999 !important; overflow-y: auto !important; } .custom-menu-primary .hs-menu-wrapper ul li.hs-menu-item.hs-item-has-children.clicked > ul { width: 60% !important; display: block; width: 60%; background: #000; } .custom-menu-primary .hs-menu-wrapper > ul ul { background: #000; } .back-arrow { display: inline-block; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock-June2018/Images/back-white-2745de08.svg?t=1536756616381) no-repeat 0 0; width: 17px; height: 20px; padding: 5px; position: relative; top: 6px; } .custom-menu-primary .hs-menu-wrapper ul > li.hs-menu-item.hs-item-has-children > ul > li > ul { position: static !important; width: 100% !important; height: 100%; } .custom-menu-primary .hs-menu-wrapper ul > li.hs-menu-item.hs-item-has-children > ul > li > ul > li.close-second-menu.first { display: none !important; } .custom-menu-primary .hs-menu-wrapper ul > li.hs-menu-item.hs-item-has-children > ul > li.custom-parent-link { display: none !important; } .custom-menu-primary .hs-menu-wrapper > ul > li > ul > li > ul > li > a { display: block; font-size: 14px; text-transform: uppercase; padding: 10px 10px 0 20px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; letter-spacing: 1.5px; color: #ffffff; line-height: 25px; cursor: text } .custom-menu-primary .hs-menu-wrapper > ul > li > ul > li > ul > li > ul > li { padding-bottom: 0; line-height: 30px; } .custom-menu-primary .hs-menu-wrapper > ul > li > ul > li > ul > li > ul > li > a { text-align: left; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; text-transform: none; color: #fff; font-size: 14px; padding: 3px 6px; -webkit-transition: all 0.5s; transition: all 0.5s; text-decoration: none; outline: 0; display: block; padding-left: 20px; line-height: 30px; } .custom-menu-primary .hs-menu-wrapper > ul > li > ul > li > ul > li { margin-bottom: 10px; } .custom-menu-primary .hs-menu-wrapper>ul ul li { padding-bottom: 15px; } .custom-menu-primary .hs-menu-wrapper>ul>li.learnmore>ul>li>a, .custom-menu-primary .hs-menu-wrapper>ul>li.whyflock>ul>li>a { display: block; font-size: 14px; text-transform: uppercase; padding: 10px 10px 0 20px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; letter-spacing: 1.5px; color: #ffffff; line-height: 25px; } .custom-menu-primary .hs-menu-wrapper>ul>li.features>ul>li>a{ color: #0abe51; } .custom-menu-primary .hs-menu-wrapper>ul>li.learnmore>ul ul li a, .custom-menu-primary .hs-menu-wrapper>ul>li.whyflock>ul ul li a, .custom-menu-primary .hs-menu-wrapper>ul>li.features>ul ul li a{ display: block; text-align: left; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; text-transform: none; color: #fff; font-size: 14px; padding: 3px 6px 3px 20px; transition: all 0.5s; text-decoration: none; outline: 0; line-height: 30px; letter-spacing: 0; } .custom-menu-primary .hs-menu-wrapper>ul>li.learnmore>ul ul li, .custom-menu-primary .hs-menu-wrapper>ul>li.whyflock>ul ul li, .custom-menu-primary .hs-menu-wrapper>ul>li.features>ul ul li{ padding-bottom: 0; line-height: 30px; margin: 0; } .custom-menu-primary .hs-menu-wrapper>ul > li.learnmore>ul>li, .custom-menu-primary .hs-menu-wrapper>ul > li.whyflock>ul>li, .custom-menu-primary .hs-menu-wrapper>ul > li.features>ul>li{ padding-bottom: 10px; } .body__backdrop { position: fixed; top: 0; left: 0; width: 0; height: 0; background: rgba(0,0,0,0.8); z-index: -100000; } .mobile-open .body__backdrop { width: 100%; height: 100%; z-index: 9; } .bottom-get-started form, .bottom-get-started .g-s-download { display: none; } .bottom-get-started ._get-started .g-s-mobile { margin-bottom: 28px; } .bottom-get-started ._get-started .g-s-button { display: inline-block; width: 100%; margin: 0; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; max-width: 500px; } .bottom-get-started ._get-started .g-s-button:hover{ background: #08a145; } .testimonial.section { padding: 50px 40px; } .banner { padding-bottom: 0 !important; padding-top: 26px !important; } .banner .banner-img { max-width: 290px !important; width: 290px !important; position: relative; bottom: -10px !important; margin: 0 0 0 auto; left: 0 !important; } .customer-section-bottom-flexi .bottom-get-started ._get-started .g-s-mobile { margin-bottom: 0; } .custom-banner-section h1 br { display: none; } .csm-feature-group .slider section{ padding:25px 0px; } .content-section-wrapper.csm-col1 { padding: 0px 25px; } .content-section-wrapper.csm-col2 { padding: 0px 35px; } .csm-slider-with-thumbnail-content .heading-block { text-align: left; } .api-key-slider .slick-list { padding: 0px !important; } .csm-two-column-equal .left-block { display: inline-block; width: 100%; margin-bottom: 50px; text-align: left; padding-right: 20px; padding-left: 20px; vertical-align: bottom; text-align: center; } .customer .slick-topsection .slick-next { right: -63px; } .customer .slick-topsection .slick-prev { left: -63px; } .customer-two-col-wrapper .wrap-content h2 { font-size: 26px; padding-bottom: 50px; } .desktop-left-block { display: none !important; } .customers-page .bottom-get-started ._get-started .g-s-mobile { margin-bottom: 0; } .offer-page .customers-logo .logo-box h2 { line-height: 40px; font-weight: 400; letter-spacing: 0; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .hipchat-migration.stride-migration .home-page .block-content { width: auto; } .hipchat-migration.stride-migration .home-page .block-content .right-section ._get-started { padding-bottom: 0; } .hipchat-migration.stride-migration #main-area, .stride-migration #main-area { min-height: 585px; } .icon-section .icon-wrapper { display: block; } .icon-section .icon-wrapper img { display: block; margin: 5px auto 45px; } .icon-section { margin-bottom: 60px; } .stride-migration .custom-hipchat-section .bottom-get-started ._get-started { margin-bottom: 60px; } .stride-migration ._g-s-mobile a._g-s-button.js-mobile-download { background: #0abe51; } .stride-migration ._g-s-mobile a._g-s-button.js-mobile-download:hover { background: #08a145; } .stride-migration .bottom-get-started ._get-started .g-s-mobile { padding: 0 10px; } .why-flock-banner ._get-started ._g-s-sublable, .why-flock-banner ._get-started form { display: none; } .why-flock-banner ._g-s-mobile a._g-s-button.js-mobile-download { background: #0abe51; max-width: 490px; } .product-feature { padding-top: 20px; } .why-flock-page .bottom-get-started .g-s-label { font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .why-flock-page .bottom-get-started ._get-started .g-s-button { max-width: 490px; } .why-flock-page .bottom-get-started ._get-started .g-s-mobile { margin-bottom: 0; } .why-flock-row2 .custom-brand-name .brands-inline .brand-title { border: none; padding: 0; } .why-flock-row2 .custom-brand-name .brands-inline .brand-title:before, .why-flock-row2 .custom-brand-name .brands-inline .brand-title:after { display: none; } .why-flock-page .hs_flock_footer.custom-footer-signup .page-center { padding: 11px 20px 0 !important; } .why-flock-banner .heading { padding: 0 10px; } .flock-vs-slack-banner .block-content .mast-head { display: inline-block !important; } .flock-vs-slack-banner .block-content .left-section { padding-top: 90px; margin-bottom: 10px; text-align: center; } .flock-vs-slack-banner .get-started-v2 form { display: none; } .flock-vs-slack-banner .block-content .right-section ._g-s-label { font-size: 22px; } .flock-vs-slack-banner .icon-section .wrapper p { text-align: center; } .flock-vs-slack3-page .bottom-get-started ._get-started .g-s-mobile { margin-bottom: 0; } .flock-vs-slack3-page .bottom-get-started ._get-started .g-s-button, .flock-vs-slack3-page .bottom-get-started ._get-started .g-s-button:hover { background: #0c8e45; } .flock-vs-slack-banner .block-content .mast-head.desktop { display: none !important; } .flock-vs-slack-banner .block-content { direction: ltr; width: auto; } .flock-vs-slack-banner .block-content .left-section { width: 100%; display: block; } .video-page .hs_cos_wrapper_type_module:nth-child(1) .videos .page-center { padding-bottom: 0; } .team-collaboration-banner .block-content { padding: 0; } .team-collaboration-banner #main-area { min-height: 670px; background: #fff; } .team-collaboration-banner .block-content .mast-head3 { display: inline-block !important; display: inline-block; width: 100%; max-width: 300px; } .team-collaboration-banner .block-content { max-width: 1200px; display: inline-block; margin: 0 auto; } .team-collaboration-banner .try-demo-block p { margin-bottom: 0; } .team-collaboration-banner .block-content .right-section ._g-s-label { font-size: 22px; line-height: 1.4; letter-spacing: -0.8px; } .team-collaboration-banner .get-started-v2 form { display: none; } .team-collaboration-banner .icon-section p { text-align: center; } .team-collaboration-banner .block-content .right-section ._get-started { padding-bottom: 40px; } .team-collaboration-banner .icons.flock-users-icon { display: inline-block; width: 75px !important; height: 30px !important; margin: 0; background-size: contain; } .team-collaboration-banner .icon-section .icon-wrapper { text-align: center; } .team-collaboration-banner .icon-section { padding-bottom: 40px; } .team-collaboration-header .mobile-trigger em { background: #585858 !important; } .team-collaboration-header .logo { text-align: left; } } @media only screen and (max-width: 1000px) and (min-width: 500px){ .videos .video-block .screen { width: 220px; height: 125px; } } @media only screen and (max-width: 800px) and (min-width: 500px){ .banner .banner-img { width: 600px !important; max-width: 600px !important; bottom: -41px; } .section-wrapper { max-width: 454px; } } @media (max-width: 767px) { .blog .blog-sidebar { padding-top: 40px; } .post-body img { display: block; float: none !important; margin: 10px auto !important; } .hs-featured-image-wrapper .hs-featured-image-link img.hs-featured-image { max-width: 100%; max-height: 100%; display: block !important; float: none; margin: 9px auto; } .footer-menu .hs-menu-wrapper>ul>li { float: left !important; } .footer-social ul li { margin: 0 9.5px; } .footer-menu .hs-menu-wrapper>ul>li:nth-child(2n+1) { clear: left; } .footer-menu .hs-menu-wrapper>ul>li { min-height: 220px; } .footer-menu .hs-menu-wrapper>ul>li:last-child { min-height: 130px; } .footer-menu .hs-menu-wrapper>ul>li:nth-last-child(2) { min-height: auto !important; } .footer-block { margin-bottom: 0; } .footer-menu .hs-menu-wrapper>ul>li { display: inline-block; float: left; width: 50%; margin-bottom: 15px; } .customer .slick-topsection .slick-prev { left: -38px; } .customer .slick-topsection .slick-next { right: -36px; } .customer .slick-topsection { text-align: center; padding: 0 25px; } .twitter-unit .slick-next { right: -17px; top: 37% } .twitter-unit .slick-prev { left: -17px; top: 39% } .customer-testimonial-slider { text-align: left; margin: 50px 0 } .customer .twitter-unit .slick-next:before { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/slick-arrors-5f3b44c9.png) no-repeat 0 -5px; width: 34px; height: 50px; display: inline-block; } .customer .twitter-unit .slick-prev:before { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/slick-arrors-5f3b44c9.png) no-repeat -5px 0; width: 34px; height: 50px; display: inline-block; } input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], input[type="file"], textarea, select { max-width: 100%; } } @media (max-width: 599px) { .flock-vs-slack3-page .cm-smart-block .cm-smart-lft-block img { height: 256px; width: auto; margin-left: 0; } } /* =============== Landscape phones and smaller devices =============== */ @media (max-width: 479px) { .video-block { padding: 0; } /* .videos.video-section .slick-list { padding: 0; } */ .videos .video-block { padding: 0; } .videos .video-block .screen { width: 100%; } .customer-testimonial-thumbnail-slider .slick-prev { left: -30px; } .customer-testimonial-thumbnail-slider .slick-next { right: -30px; } table.pric-plan-updat-tbl2 tr td { padding: 20px 5px 20px 5px !important; font-size: 12px !important; } .banner-content { padding: 0px 10px; } } @media (max-width: 399px) { .company-wrap { display: block; text-align: center; vertical-align: middle; width: auto; } } @media (max-width: 349px) { .flock-vs-slack3-page .cm-smart-block .cm-smart-lft-block img { height: 196px; } .table-pricing td.td-first { font-size: 13px; } .table-pricing td { font-size: 12px; } } @media (max-width: 1199px){ .hs-indexb-layout #flock-introduction-video { max-width: 900px; margin: 0 auto; float: none; } } @media (max-width: 999px){ .flock-vs-slack2 .unit, .hipchat-migration .unit, .stride-migration .unit { margin-bottom: 60px; } .hipchat-migration #main-area, .stride-migration #main-area { min-height: 643px; } .hipchat-migration .home-page .block-content .left-section { display: inline-block; width: 100%; padding-top: 16px; margin-bottom: 10px; padding-right: 0; } .home-page .block-content .mast-head-mobile { display: inline-block; width: 100%; max-width: 300px; height: 300px; background-size: 100% 100%; } .hipchat-migration .home-page .block-content .right-section { display: inline-block; width: 100%; text-align: center; } .hipchat-migration #main-area h2, .stride-migration #main-area h2 { font-size: 30px; line-height: 1.2; margin: 0 0 15px 0; padding: 0; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .hipchat-migration ._get-started ._g-s-label{ display: inline-block; color: #fff; font-size: 22px; position: relative; line-height: 1.4; letter-spacing: -0.8px; margin-bottom: 30px; margin-top: 0; } .hipchat-migration .home-page .block-content { padding-top: 0; } .hipchat-migration ._get-started ._g-s-form , .hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable{ display:none; } .hipchat-migration .home-page .block-content .right-section ._g-s-label{ font-size: 22px; text-align: center; } .hipchat-migration .home-page .block-content .right-section ._get-started { text-align: center; padding-bottom: 100px; } ._get-started ._g-s-button, ._get-started a._g-s-button { display: inline-block; width: 100%; margin: 0; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; max-width: 500px; } .hipchat-migration ._g-s-mobile { display: block; } .testimonial-section .testimonial-block { text-align: center; width: 100%; margin-bottom: 60px; float: none; } .flock-vs-slack2 .flock-pricing-benefit .flock-screenshot, .hipchat-migration .flock-pricing-benefit .flock-screenshot, .stride-migration .flock-pricing-benefit .flock-screenshot { margin: 0 0 40px; } .testimonial-section .testimonial-block:last-child { margin-bottom: 0; } .flock-vs-slack2 .flock-pricing-benefit h3, .hipchat-migration .flock-pricing-benefit h3, .stride-migration .flock-pricing-benefit h3 { text-align: center; letter-spacing: -0.5px; margin-bottom: 50px; font-size: 28px; line-height: 40px; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .hipchat-migration .flock-pricing-benefit .pricing-benefit-txt { margin-bottom: 0; } #securityBlock .left-block { display: inline-block; width: 100%; margin-bottom: 50px; text-align: left; padding-right: 20px; padding-left: 20px; vertical-align: bottom; text-align: center; } .flock-vs-slack2 #securityBlock .right-block, .hipchat-migration #securityBlock .right-block, .stride-migration #securityBlock .right-block { padding: 0; } body.hs-hipchat-layout .page-center { padding: 0 10px; } .about-flock .about-flock-block { width: 100%; display: inline-block; vertical-align: middle; } .about-flock .about-flock-txt { margin: 0 0 40px; } .award-section h3 { margin-bottom: 30px; } .other-awards .section:last-child { margin-bottom: 0; } .widget-span.custom-hipchat-bottom-form { display: none !important; } .widget-span.custom-hipchat-bottom-form-content { width: 100% !important; text-align: center; } .custom-hipchat-bottom-form-content p { display: inline-block; color: #fff; font-size: 22px; position: relative; line-height: 1.4; letter-spacing: -0.8px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; margin: 0 0 30px 0; vertical-align: middle; } .custom-hipchat-bottom-form-mobile-button a { display: inline-block; width: 100%; margin: 0; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; background: #0c8e45; max-width: 500px; } .custom-hipchat-bottom-form-mobile-button a:hover { background: #08a145; } .custom-hipchat-bottom-form-mobile-button { text-align: center; } .custom-hipchat-bottom-form-wrapper { margin-bottom: 60px; } /* start of Signup Pro layout */ body.hs-signup-layout #header .page-center { padding-top: 15px; } body.hs-signup-layout { padding-top: 73px; } .signup-pro .header-section .header-wrap { padding-top: 159px; text-align: center; } .signup-pro .section-unit .page-center { padding: 39px 10px 40px; } .signup-pro .signup-feature-unit .individual-unit.unit-ass3 { padding: 0 0 60px 0; } .signup-pro .section-unit.security-unit .page-center { padding: 40px 10px; } body.hs-signup-layout .bottom-get-started ._get-started .g-s-mobile { margin-bottom: 0; } .widget-span.custom-footer-copyright-signup { width: auto !important; } .widget-span.custom-footer-menu-signup { width: auto !important; float: right !important; } .custom-footer-copyright-signup p { float: none; margin: 0 0 20px 0; } body.hs-signup-layout .bottom-get-started .g-s-label { font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .signup-pro .section-unit.logo-unit .page-center, .signup-pro .section-unit.award-section-unit .page-center { padding: 40px 10px; } /* start of Signup Pro layout */ /* start of Apps layout */ .custom-app-banner h1 { font-size: 64px; font-family: proxima-regular, Helvetica, Arial, sans-serif; line-height: 1.42857; letter-spacing: normal; } .custom-webhooks-wrapper .page-center , .custom-app-flock .page-center { padding: 85px 40px 0; } .custom-app-flock .title-wrap h3 { text-align: left; } .apps-beta .title-wrap .caption { text-align: left; } .custom-app-flock .page-center { text-align: left; } .custom-app-flock .apps-wrap { margin-bottom: 0; } .custom-app-flock .unit-block3 .left-unit p { margin-bottom: 0; } .unit-wrap.js-unit-block3 p { margin-bottom: 18px; } .custom-full-banner.header-section .header-wrap h1 { font-size: 45px; color: #fff; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.1; letter-spacing: -2.5px; padding: 0 10px 20px 10px; } .custom-full-banner.header-section .header-wrap { padding-top: 56px; } .hs-indexb-layout ._g-s-sublable { display: none; } .hs-indexb-layout ._get-started ._g-s-button, ._get-started a._g-s-button{ background: #0c8e45; } .hs-indexb-layout .header-video-wrap { padding: 40px 10px 110px; } .hs-indexb-layout #flock-introduction-video { max-width: 600px; margin: auto; position: relative; float: none; } .hs-indexb-layout .body-container .page-center { padding: 50px 10px; padding-left: 0; padding-right: 0; } .custom-top-content.unit { width: 100%; padding: 50px 10px; text-align: center; margin: 0 auto; } .hs-indexb-layout .screenImage1Text h2.title { font-size: 30px; line-height: 1.2; margin: 0 0 15px 0; padding: 0; letter-spacing: -0.5px; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; } .hs-indexb-layout .screenImage1Text h2.title .next-line { display: inline-block; } .hs-indexb-layout .screenImage1Text h3.sub_heading { display: inline-block; font-size: 18px; margin: 0 0 15px 0; color: #585858; line-height: 1.55; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; } .hs-indexb-layout .award-section .wrapper { padding: 40px; } .hs-indexb-layout .unit.award-section-wrapper { padding: 40px; } .hs-indexb-layout .unit .other-awards .page-center { padding: 40px 40px 50px 40px; } .case-study-videos .video-block:last-child { margin-bottom: 0; } .brands-inline .brand-title { padding-top: 30px; } .hs-indexb-layout .body-container .custom-brand-name .page-center { padding-top: 0; } .hs-indexe-layout.hipchat-migration .home-page .block-content { padding-top: 0px; } .hs-indexe-layout.hipchat-migration #main-area h2 { padding: 20px 10px 15px 10px; } .hs-indexe-layout .brands-inline .brand-title { padding-top: 0; } .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider { padding-top: 0; } .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider .page-center { padding: 50px 0 0 0; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .heading-block { text-align: center; } .csm-slider-with-thumbnail-content .heading-block p { font-size: 20px; line-height: 34px; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .api-img-slider .slick-dots { display: block !important; } .hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .link-and-arrow { text-align: center; } .hs-indexb-layout .unit.award-section-wrapper { padding: 0; } .hs-indexb-layout .unit.award-section-wrapper .page-center { padding: 0 10px !important; } .case-study-videos .video-block:last-child { margin-bottom: 40px; } .hs-home-layout .custom-main-testimonial-group .page-center { padding: 0; } .hs-home-layout.hipchat-migration .home-page .block-content .right-section ._get-started { padding-bottom: 150px; } .hs-home-layout.hipchat-migration.hs-home-main .home-page .block-content .right-section ._get-started{ padding-bottom: 60px; } .hs-home-layout ._g-s-mobile a._g-s-button.js-mobile-download { background: #0abe51; } .hs-home-layout ._g-s-mobile a._g-s-button.js-mobile-download:hover { background: #08a145; } .hs-home-layout .custom-top-video-section .image-box { max-width: 900px; min-width: 300px; min-height: 200px; display: inline-block; position: relative; -webkit-box-shadow: 0 3px 30px rgba(0,0,0,0.5); box-shadow: 0 3px 30px rgba(0,0,0,0.5); } .hs-home-layout.hs-indexb-layout #flock-introduction-video { max-width: 900px; } .hs-home-layout div#hs_cos_wrapper_widget_1555409583571 .custom-top-video-section.unit .screenImage1Text h2.title { font-size: 35px; } } @media (max-width: 1024px) and (min-width: 600px){ .testimonial-section .testimonial-block { max-width: 50%; margin: 0 auto 60px; padding: 0 15px; } .flock-vs-slack2 .flock-pricing-benefit .pricing-benefit-section, .hipchat-migration .flock-pricing-benefit .pricing-benefit-section, .stride-migration .flock-pricing-benefit .pricing-benefit-section { max-width: 500px; margin: 0 auto; display: block; } .about-flock .about-flock-block { max-width: 500px; margin: 0 auto; display: block; } .about-flock .about-flock-block { max-width: 500px; margin: 0 auto; display: block; } .about-flock h3 { margin: 0 0 30px; text-align: center; } .about-flock .about-flock-img { height: 330px; } } @media (max-width: 1000px) and (min-width: 600px){ .case-study-videos .video-block { max-width: 350px; } } @media (max-width: 1024px) and (min-width: 768px){ .signup-pro .header-section:after, .signup-pro .header-section:before { width: 252px; height: 297px; } } @media (max-width: 767px){ .hipchat-migration .home-page .block-content .right-section ._get-started{ padding-left: 0; padding-right:0; } .testimonial-section .testimonial-block { padding-left: 0; padding-right: 0; } .hs-signup-layout.hipchat-migration ._get-started ._g-s-label { text-align: center; } .hs-signup-layout.hipchat-migration .header-section ._get-started { padding-left: 0; padding-right: 0; } .widget-span.custom-footer-menu-signup { width: 100% !important; text-align: center; } .custom-footer-signup { padding-bottom: 0; } .custom-app-banner h1 { font-size: 35px; } .hipchat-migration .custom-full-banner ._get-started ._g-s-label { text-align: center; } .hs-indexb-layout .header-video-wrap { padding-left: 0; padding-right: 0; } .hs-indexb-layout #flock-introduction-video { width: 100% !important; } .hs-indexb-layout .header-video-wrap .slick-track { width: 100% !important; } } @media (max-width: 640px){ .hs-indexe-layout.hipchat-migration #main-area h2 { font-size: 35px; } .hs-indexe-layout.hipchat-migration #main-area .small-font { font-size: 35px; } .hipchat-migration .home-page .block-content .right-section ._get-started { padding-left: 10px; padding-right: 10px; } .hs-home-layout.hipchat-migration .home-page .heading-wrap h1 { font-size: 35px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.1; letter-spacing: -2.5px; padding: 20px 10px 15px 10px; } } @media (max-width: 350px){ .about-flock .about-flock-img { height: 196px; } } .hs-startups-layout { padding-top: 0; } .hs-startups-layout .top-section { padding: 120px 0; background: #0e1025; position: relative; } .cm-startups-banner-mod { display: inline-block; width: 49%; margin: 0; } .cm-startups-banner-mod.right-block { vertical-align: top; padding-left: 60px; color: #fff; } .cm-startups-banner-mod.right-block h1 { font-size: 56px; padding: 0 0 20px 0; letter-spacing: -0.5px; color: #fff; font-weight: 300; line-height: 1.3; } .cm-startups-banner-mod.right-block p { color: #fff; text-align: justify; } .hs-startups-layout .body-container { padding: 0; } .hs-startups-layout .cm-two-col-startups-wrap .page-center { max-width: 1500px !important; padding: 80px 20px; float: none !important; overflow: hidden; } .cm-two-col-startups-wrap h2 { font-size: 42px; font-weight: 600; line-height: 1.19; letter-spacing: -0.8px; margin: 0; color: #585858; padding: 0 0 20px 0; } .cm-two-col-startups-wrap h4 { font-size: 22px; color: #585858; margin: 0; padding: 0; font-family: proxima-regular, Helvetica, Arial, sans-serif; font-weight: 300; line-height: 1.57; } .cm-two-col-startups-wrap {} .cm-two-col-startups-wrap .cm-two-col-startups-inner { margin-top: 60px; position: relative; } .cm-two-col-startups-mod { float: left; width: 50%; display: inline-block; margin: 0; vertical-align: middle; } .cm-two-col-startups-mod.left-block { padding-right: 30px; } .cm-two-col-startups-mod.right-block { padding-left: 60px; position: static; } .cm-two-col-startups-mod.right-block img { -webkit-box-shadow: 0 3px 30px rgba(0,0,0,0.5); box-shadow: 0 3px 30px rgba(0,0,0,0.5); } .cm-two-col-startups-mod.left-block p { display: block; margin: 0; padding: 0 0 20px 0; font-size: 18px; color: #585858; line-height: 1.44; text-align: justify; } .cm-two-col-startups-mod a { text-decoration: underline; } .cm-two-col-startups-mod a:hover { color: #555; } a.knowmore-btn { padding: 10px 15px; font-size: 20px; font-weight: 600; background: #0abe51; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; font-family: proxima-regular, Helvetica, Arial, sans-serif; display: inline-block; text-decoration: none; margin-top: 40px; } .hs-startups-layout .get-started.bottom-get-started { background: #1a5db0; color: #fff; } .hs-startups-layout .get-started.bottom-get-started p.g-s-label { color: #fff; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .hs-startups-layout .get-started.bottom-get-started .g-s-download , .hs-startups-layout .get-started.bottom-get-started .g-s-download a { color: #fff; opacity: 1; } .cm-startups-footer { background: #3b454b; } .cm-startups-copyright p { text-align: right; padding: 20px 10px; margin: 0 auto; font-size: 14px; color: #fff; text-decoration: none; line-height: 22.8571px; } .cm-startups-copyright p a { /* border-right: 1px solid #fff; */ line-height: .9; /* padding: 0 10px 0 0; */ /* margin-right: 5px; */ font-size: 14px; color: #fff; display: inline-block; } .cm-startups-copyright p a.contact-sale { border-right: 1px solid #fff; line-height: 0.9; padding: 0 10px 0 0; margin-right: 5px; } .cm-startups-footer .page-center { max-width: 1500px !important; } /*-------------------flock-vs-microsoft-teams -----------*/ .hs-microsoft-hdr:not(.fixedNav) .header-col.hs-logo { width: 100% !important; display: block !important; text-align: center; } .flock-vs-microsoftbnr-area {} .flock-vs-microsoftbnr-area .header-wrap { text-align: center; padding-top: 62px !important; color: #fff; display: block; width: 100%; max-width: 820px !important; text-align: center; margin: 0 auto !important; float: none !important; } .flock-vs-microsoftbnr-area .header-wrap p._g-s-label { font-size: 28px; line-height: 40px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #fff; margin-bottom: 56px; } .flock-vs-microsoftbnr-area .header-wrap h1 { margin-bottom: 30px; } .flock-vs-microsoftbnr-area-btm p { display: block; font-size: 22px; color: #fff; margin: 2px 0 0; letter-spacing: -0.4px; } img.flock-vs-microsoftbnr-area-btm-img { margin-top: -144px; } .flock-vs-microsoftbnr-area .hs-error-msgs { text-align: left; } .flock-vs-microsoftbnr-area ._get-started .hs_error_rollup { left: 0; } .hs-flock-vs-microsoft-layout .body-container { padding: 0; } .cm-smart-block { padding: 0 10px; } .cm-smart-block .page-center { padding-top: 100px; padding-bottom: 100px; padding-left: 10px; padding-right: 10px; } .cm-smartmod { width: 49.1%; display: inline-block; padding: 0px; vertical-align: middle; font-size: 16px; color: #5d5d5d; } .cm-smartmod.cm-smart-lft-block img { max-width: 450px; display: block; margin: 0 auto 0px; } .cm-smartmod.cm-smart-rgt-block h3 { margin-bottom: 30px; font-size: 42px; line-height: 50px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .cm-smartmod.cm-smart-rgt-block p { font-size: 18px; line-height: 1.44; margin: 0; } .cm-power-features.power-features.bg-color-shade { background: #f8f8f8; text-align: center; } .cm-power-features .page-center { padding-top: 100px; padding-bottom: 100px; } .cm-power-features .aspect { width: 29%; display: inline-block; vertical-align: top; margin: 0 auto 0; } .cm-power-features .aspect.side-margin { margin: 0 51px; } .cm-power-features h3 { margin-bottom: 60px; } .cm-power-features .aspect img { /* width: 60px; height: 60px; */ /*hidden by Gaurang - giving Hubspot precedence in sizing" */ margin-bottom: 20px; } .cm-power-features .aspect h5 { margin-bottom: 15px; } .cm-power-features .aspect p { font-size: 18px; text-align: left; margin-bottom: 0; line-height: 1.44; } .cm-compare-table.bg-color-shade { background: #f8f8f8; } .cm-compare-table.bg-color-shade .page-center { padding-top: 100px; padding-bottom: 100px; } .cm-compare-table.bg-color-shade h3 { text-align: center; } .custom-accordion-title { padding: 13px 60px; background: #fff; overflow: hidden; border-bottom: 1px solid #f8f8f8; cursor: pointer; font-size: 22px; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; text-align: left; } .custom-accordion-title span.up-arrow { width: 20px; height: 20px; margin-top: 6px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/upside-arrow-5f6892aa.svg) no-repeat center; background-size: contain; float: right; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .custom-accordion-title.active span.up-arrow { -webkit-transform: none; -ms-transform: none; transform: none; } .custom-accordion-body { background: rgba(255,255,255,0.5); display: block; padding: 0 15px; } .custom-accordion-body-inner table { width: 100%; border-collapse: collapse; border-spacing: 0; } .custom-accordion-body-inner table th.first-cell { width: 50%; padding-left: 45px; font-size: 22px; text-align: left; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; font-weight: normal; color: #0abe51; } .custom-accordion-body-inner table th { padding: 40px 0 25px; } .custom-accordion-body-inner table th.center-cell { width: 10%; } .custom-accordion-body-inner table th.last-cell { width: 30%; } .custom-accordion-body-inner table td.first-cell { padding-left: 45px; } .custom-accordion-body-inner table td { padding: 17px 0; font-size: 18px; border-bottom: 1px solid #eee; } .custom-accordion-body-inner table td ul { padding-left: 20px; list-style: disc; } .custom-accordion-body-inner table td span { display: block; } .custom-accordion-body-inner table .green-text { color: #0abe51; font-size: 14px; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; } .custom-accordion-body-inner table th img { width: 30px; } .custom-accordion-body-inner table td.green-text { font-size: 22px; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; color: #0abe51; } .custom-accordion-body-inner table td.center-cell { text-align: center; } .custom-accordion-body-inner table .bold-txt { font-size: 22px; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; } td.center-cell.bold-txt {} .custom-accordion-body-inner table td.last-cell { padding-right: 60px; color: #999; } .custom-accordion-body-inner table td img { width: 15px; max-width: 100%; vertical-align: middle; } .custom-accordion-body-inner table .tool-tip { display: inline-block; margin-left: 5px; position: relative; cursor: pointer; } .custom-accordion-body-inner table .tool-tip span.help { display: inline-block; background-image: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/tool-tip-icon-f44e6037-1.svg); background-repeat: no-repeat; background-position: 0 0; background-size: 100%; width: 20px; height: 20px; vertical-align: middle; } .custom-accordion-body-inner table .tool-tip-content { position: absolute; width: 220px; background: #fff; padding: 20px; margin-top: 14px; margin-left: -17px; border-top: 5px solid #0abe51; -webkit-box-shadow: 3px 1px 15px rgba(0,0,0,0.4); box-shadow: 3px 1px 15px rgba(0,0,0,0.4); display: none; cursor: default; z-index: 1; } .tool-tip:hover .tool-tip-content { display: block; } .tool-tip .tool-tip-content:before { content: ''; border-width: 15px; border-style: solid; border-color: transparent transparent #0abe51 transparent; top: -35px; position: absolute; left: 12px; } .hs-flock-vs-microsoft-layout .bottom-get-started { background: #fff; } .cm-power-featuresv2.bg-color-shade { background: #ffffff !important; } .cm-smart-block-bg { background: #f8f8f8 !important; } .custom-accordion-body-inner table td.last-row { padding-bottom: 45px; } .hs-flock-vs-microsoft-layout a.getStartedBtn { float: right; padding: 6px 10px 5px 10px; margin-right: 10px; color: #fff; font-size: 15px; border-radius: 3px; font-weight: 600; cursor: pointer; background: #0abe51; -webkit-transition: background 300ms; transition: background 300ms; font-family: proxima-regular, Helvetica, Arial, sans-serif; line-height: 1.42857; text-transform: none; } .hs-flock-vs-microsoft-layout .fixed-product-keys.show { border: 0; text-align: right; position: static; width: calc(100% - 140px) !important; margin-left: 0 !important; float: right !important; } .hs-flock-vs-microsoft-layout ._g-s-mobile { display: none; } .hs-flock-vs-microsoft-layout .custom-footer-signup.hs_flock_footer { background: #666666; } /*------------------pricing-plan-updates---------*/ .hs-pricing-plan-updates-layout { background-color: #e8e8e8; border-collapse: collapse; margin: 0; padding: 0 10px; font-family: 'Open Sans', Arial, Helvetica, sans-serif; border-bottom: 10px solid #0abe51; } table.pric-plan-updat-tbl { border-collapse: collapse; width: 100%; max-width: 960px; -webkit-border-radius: 8px; -moz-border-radius: 8px; border-radius: 8px; margin: 50px auto; } .hs-pricing-plan-updates-layout .body-container { padding: 0; } table.pric-plan-updat-tbl table { padding: 0 30px; display: inline-block; border-collapse: collapse; border-spacing: 0; font-size: 16px; color: #5d5d5d; } table.pric-plan-updat-tbl table p { padding: 0 0 15px 0; margin: 0; color: #000; line-height: 26px; font-weight: 400; font-size: 15px; font-family: 'Open Sans',Arial, Helvetica, sans-serif; } table.pric-plan-updat-tbl2 tr:first-child td { padding: 10px 0; font-size: 16px; color: #fff; background: #0abe51; font-weight: 600; } table.pric-plan-updat-tbl2 { padding: 0 !important; text-align: center; } table.pric-plan-updat-tbl2 tr td { font-size: 15px; color: #000; letter-spacing: -0.3px; font-weight: 400; padding: 20px 5px 20px 15px; } table.pric-plan-updat-tbl2 tr:not(:first-child) td { text-align: center; } table.pric-plan-updat-tbl2 tbody { width: 100%; display: table; } table.pric-plan-updat-tbl2 tr:nth-child(odd) { background: #ebebeb; } table.pric-plan-updat-tbl2 tr:last-child { background: transparent; } table.pric-plan-updat-tbl2 tr td:first-child { text-align: left; font-weight: 600; } table.pric-plan-updat-tbl3 h1 { padding: 35px 0 15px 0; margin: 0; color: #000; line-height: 26px; font-weight: 600; font-size: 20px; letter-spacing: -0.3px; font-family: 'Open Sans',Arial, Helvetica, sans-serif; } table.pric-plan-updat-tbl3 h2 { padding: 40px 0; margin: 0; color: #000; line-height: 22px; font-size: 22px; font-weight: 600; font-family: 'Open Sans',Arial, Helvetica, sans-serif; } table.pric-plan-updat-tbl3 h3 { padding: 0 0 10px 0; margin: 0; color: #000; line-height: 26px; font-weight: 600; font-size: 20px; letter-spacing: -0.3px; font-family: 'Open Sans',Arial, Helvetica, sans-serif; } table.pric-plan-updat-tbl3 p { padding: 0 0 25px 0 !important; margin: 0 !important; color: #000; line-height: 26px !important; font-weight: 400 !important; font-size: 15px !important; font-family: 'Open Sans',Arial, Helvetica, sans-serif !important; } .hs-why-flock-layout .get-started-v2.get-started-inline { background: #fff; } .hs-why-flock-layout .get-started-inline ._get-started ._g-s-download { display: block; clear: left; } .hs-why-flock-layout ._g-s-download a { text-decoration: none !important; } .hs-why-flock-layout .custom-full-banner.header-section:after { top: 77px; } .hs-why-flock-layout .input .hs-input { border-radius: 6px !important; padding: 0 20px !important; font-size: 20px !important; min-height: 60px !important; display: block; background: #fff; } .hs-why-flock-layout .actions .hs-button.primary.large { padding-left: 10px; font-size: 22px; vertical-align: top; letter-spacing: 0; margin-left: 15px; border-radius: 6px; line-height: 32px; background: #0abe51; } .hs-why-flock-layout .actions .hs-button.primary.large:hover { background: #08a145; } .hs-why-flock-layout .header-section { min-height: 552px; } .hs-why-flock-layout.hs-indexb-layout .testimonial-block { margin-top: -105px; z-index: 1; } /*-------------------------------------------------------*/ /*-------------------------------------------------------*/ @media (max-width:1000px){ .cm-startups-banner-mod { display: block; width: 100%; margin: 0 0 30px; } .hs-startups-layout .top-section { padding: 60px 20px 80px 20px; } .cm-startups-banner-mod.right-block { padding-left: 0; } .cm-startups-banner-mod.right-block h1 { font-size: 40px; color: #fff; margin: 0; padding: 0 0 20px 0; font-family: proxima-semibold, Helvetica, Arial, sans-serif; letter-spacing: -0.8px; font-weight: 300; line-height: 1.3; } .cm-startups-banner-mod img { margin: 0 0 30px; } .hs-startups-layout .cm-two-col-startups-wrap .page-center { padding: 40px 20px; } .cm-two-col-startups-mod.left-block { padding-right: 0; } .cm-two-col-startups-mod { float: none; width: 100%; display: block; margin: 0 0 20px; vertical-align: middle; } .cm-two-col-startups-wrap h2 { display: block; font-size: 36px; font-weight: 600; line-height: 1.19; letter-spacing: -0.8px; margin: 0; color: #585858; padding: 0 0 20px 0; } .cm-two-col-startups-wrap .cm-two-col-startups-inner { margin-top: 40px; position: relative; } a.knowmore-btn { margin: 40px 0; } .cm-two-col-startups-mod.right-block { padding-left: 0; position: static; } .cm-startups-copyright p { text-align: center; padding: 40px 0; } .cm-startups-copyright p a { text-decoration: none; font-size: 14px; line-height: 1.43; display: block; color: #fff; } .cm-startups-copyright p a.contact-sale { border-right: none; line-height: 0.9; padding: 0 0 15px 0; margin-right: 0; } .hs-flock-vs-microsoft-layout form._g-s-form { display: none; } .hs-flock-vs-microsoft-layout ._g-s-mobile { display: block; } .flock-vs-microsoftbnr-area-btm { display: none; } .flock-vs-microsoftbnr-area .header-wrap { padding-top: 16px !important; } .flock-vs-microsoftbnr-area .header-wrap p._g-s-label { font-size: 20px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; margin-bottom: 50px; } .flock-vs-microsoftbnr-area .header-wrap h1 { margin-bottom: 24px; } img.flock-vs-microsoftbnr-area-btm-img { margin-top: 0; } .flock-vs-microsoftbnr-area ._g-s-mobile a._g-s-button.js-mobile-download { background: #0abe51; border: 0; } .flock-vs-microsoftbnr-area ._g-s-mobile a._g-s-button.js-mobile-download:hover { background: #08a145; } .cm-smartmod { width: 100%; display: inline-block; padding: 0px; vertical-align: middle; } .cm-smart-block .page-center { padding-top: 50px; padding-bottom: 50px; } .cm-smartmod.cm-smart-lft-block img { max-width: 386px; margin: 0 auto 30px; } .cm-smartmod.cm-smart-rgt-block h3 { font-size: 28px; color: #585858; line-height: 40px; margin: 0 0 30px; font-weight: 400; font-family: proxima-regular,Helvetica, Arial, sans-serif; letter-spacing: 0; } .cm-smartmod.cm-smart-rgt-block p { font-size: 16px; line-height: 1.44; } .cm-power-features .page-center { padding-top: 50px; padding-bottom: 50px; } .cm-power-features .aspect.side-margin { margin: 0 15px; } .cm-power-features .aspect p { font-size: 16px; line-height: 1.44; text-align: center; } .custom-accordion-title { padding: 11px 20px; background: #fff; overflow: hidden; border-bottom: 1px solid #f8f8f8; cursor: pointer; font-size: 14px; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; text-align: left; margin: 0; line-height: 1.44; } .cm-compare-table.bg-color-shade .page-center { padding-top: 50px; padding-bottom: 50px; padding-left: 10px; padding-right: 10px; } .custom-accordion-title span.up-arrow { width: 10px; height: 10px; float: right; margin-top: 5px; } .custom-accordion-body-inner table td.first-cell { width: 40%; text-align: left; padding-left: 7px; font-size: 14px; } .custom-accordion-body-inner table td.center-cell { width: 20%; } .custom-accordion-body-inner table th img { width: 20px; } .custom-accordion-body-inner table th.last-cell { width: 20%; } .custom-accordion-body-inner table td { padding: 14px 0; font-size: 13px !important; } .custom-accordion-body-inner table td.last-cell { padding-right: 7px; color: #999; } .custom-accordion-body-inner table th.first-cell { width: 40%; text-align: left; padding-left: 7px; font-size: 14px; } .custom-accordion-body-inner table td.green-text { font-size: 14px; } .custom-accordion-body-inner table .bold-txt { font-size: 13px; } .custom-accordion-body-inner table td img { width: 10px; } .cm-power-features .page-center { padding-left: 15px; padding-right: 15px; } } @media (max-width:550px) { .cm-power-features .aspect.side-margin { margin: 0 0 40px; } .cm-power-features .aspect { width: 100%; display: block; vertical-align: top; margin: 0 auto 40px; } .cm-power-features .aspect:last-child { margin-bottom: 0; } .cm-smartmod.cm-smart-lft-block img { max-width: 100%; margin: 0 auto 30px; } } .why-flock-capterra div#header { background: #fff; } .why-flock-capterra .home-page #main-area { background: #fff; } .hipchat-migration #main-area h2 span { display: block; } .why-flock-capterra.hipchat-migration #main-area h2 { color: #585858; letter-spacing: -2.5px; line-height: 1.1; margin: 0; } .why-flock-capterra .home-page .block-content .right-section ._g-s-label { color: #585858; margin-bottom: 80px; } .why-flock-capterra ._get-started ._g-s-form { background: transparent !important; padding: 0 !important; } .get-started-v2.get-started-inline ._get-started .hs-form-field { margin: 0; max-width: 305px; } .get-started-v2.get-started-inline ._get-started .hs-input, .why-flock-capterra .custom-flock-banner-area .hs-input{ padding: 15px 19px 15px; margin: 0 -4px 0 0; border-radius: 6px 0 0 6px; border: 1px solid #dbdbdb; border-right: none; } .get-started-v2.get-started-inline ._get-started .hs-submit { margin-left: 0px; } .get-started-v2.get-started-inline ._get-started .hs-button, .why-flock-capterra .custom-flock-banner-area .hs-button{ background: #0c8e45; border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; padding: 15px 20px; text-transform: uppercase; } .get-started-v2.get-started-inline ._get-started .hs-button:hover, .why-flock-capterra .custom-flock-banner-area .hs-button:hover{ background: #0c8e45; } .why-flock-capterra.hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable { color: #333; font-size: 16px; margin-top: 20px; } .why-flock-capterra.hipchat-migration .home-page .block-content .mast-head { height: 500px; max-width: 500px; } .why-flock-capterra.hipchat-migration .home-page .block-content { padding-top: 52px; } .why-flock-capterra #header.fixedNav .page-center { padding: 11px 0 0; } .hs-flock-hdr .fixed-product-keys { border: 0; text-align: right; position: static; width: calc(100% - 140px) !important; margin-left: 0 !important; background: transparent; } .hs-flock-hdr .fixed-product-keys a.getStartedBtn { opacity: 0; } .hs-flock-hdr .fixed-product-keys a.getStartedBtn{ padding: 6px 20px 5px 20px; font-size: 18px; margin-right: 10px; color: #fff; background: #0c8e45; -webkit-transition: all 300ms; transition: all 300ms; opacity: 0; text-transform: initial; } .hs-flock-hdr .fixed-product-keys.show a.getStartedBtn { display: block; opacity: 1; border-radius: 3px; font-weight: 600; cursor: pointer; } .hs-flock-hdr .fixed-product-keys a.getStartedBtn:hover { background: #08a145; -webkit-transition: all 300ms; transition: all 300ms; } .why-flock-capterra .testimonial-unit .page-center { padding: 40px 20px; } .why-flock-capterra .testimonial-unit { background: #f8f8f8; margin-bottom: 40px; } .why-flock-capterra .body-container, .why-flock-capterra .section{ padding: 0px; } .unit.compare-section .section-wrapper { padding: 0; } .unit.compare-section .section-wrapper .section { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; max-width: 600px; margin: 0 auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .unit.compare-section .section-wrapper .section h3 { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; margin-bottom: 10px; text-align: center; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .unit.compare-section .section-wrapper .section p { -webkit-box-flex: 1.8; -ms-flex: 1.8; flex: 1.8; margin: 0; position: relative; font-size: 16px; line-height: 26px; text-align: center; } .form-with-left-wrapper { background: #f8f8f8; padding-top: 100px; padding-bottom: 100px; } .form-with-left-wrapper ._get-started { max-width: 100%; vertical-align: middle; } .why-flock-capterra.hipchat-migration .form-with-left-wrapper ._get-started ._g-s-label { font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; vertical-align: middle; line-height: 50px; display: inline-block; margin: 0 20px 0px 0; } .form-with-left-wrapper span#hs_cos_wrapper_widget_1555322202009_ { display: inline-block; vertical-align: middle; } .form-with-left-wrapper ._get-started .form-title { font-size: 0; } .hs_flock_footer.custom-footer-signup .page-center { padding: 11px 40px 0 !important; max-width: 1200px !important; } .custom-footer-signup.hs_flock_footer { background: #0c0e1a; padding-bottom: 10px; } .custom-footer-copyright-signup a { text-decoration: none; font-size: 14px; color: #ffffff; line-height: 34px; } .custom-footer-signup.hs_flock_footer p { font-size: 14px; margin: 0; color: #ffffff; line-height: 34px; } ._get-started.locale-in { max-width: 1100px; } .hipchat-migration .get-started-inline ._get-started ._g-s-label { color: #585858; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .get-started-inline ._get-started .hs-form-wrap { float: right; margin: 10px 0 0; } .get-started-inline ._get-started ._g-s-download { font-size: 18px; text-align: left; display: inline-block; } .get-started-v2.get-started-inline ._g-s-download a { text-decoration: underline; color: #373737; } .get-started-v2 .try-demo-block { padding: 15px 0 0 0; text-align: left; font-family: proxima-regular, Helvetica, Arial, sans-serif; font-size: 20px; } .try-demo-block .demoTeamLink { color: #0ab54d; cursor: pointer; font-size: 20px; } .why-flock-capterra .get-started-v2.get-started-inline { background: #f8f8f8; } .hipchat-migration .get-started-v2.get-started-inline ._get-started ._g-s-label { font-size: 28px; display: inline-block; margin: 0; position: relative; top: 5px; } .why-flock-capterra .get-started-v2.get-started-inline ._get-started .hs-button, .why-flock-capterra .custom-flock-banner-area .hs-button{ text-transform: inherit; } .why-flock-capterra .get-started-v2.get-started-inline ._get-started.locale-in { text-align: center; } .why-flock-capterra .get-started-v2.get-started-inline ._get-started .hs-form-field { max-width: 240px; } .why-flock-capterra .get-started-v2.get-started-inline ._get-started .hs-input, .why-flock-capterra .custom-flock-banner-area .hs-input{ padding: 15px 20px 15px; } .why-flock-capterra .other-awards .section .company-logo { background-size: 160px; } .why-flock-capterra .custom-flock-banner-area ._get-started .hs-form-field { margin: 0 -4px 0 0; max-width: 240px; } .why-flock-capterra.hipchat-migration .custom-flock-banner-area ._get-started .hs-input { padding: 15px 20px 15px; } .why-flock-capterra.hipchat-migration .custom-flock-banner-area .hs-button { padding: 15px 20px; font-weight: 600; } .why-flock-capterra.hipchat-migration .custom-flock-banner-area { margin-bottom: 96px; } .try-demo-block .demoTeamLink span { border-bottom: 1px solid #0ab54d; } .why-flock3-testimonial { padding-top: 40px; position: relative; text-align: center; } .why-flock3-testimonial:before { display: inline-block; content: ''; position: absolute; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/quote-start-34eac330.png) no-repeat 0 0; background-size: 100%; left: 50%; top: 0; width: 30px; height: 30px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); } .why-flock3-testimonial .testimonial-text { display: inline-block; color: #585858; font-size: 24px; max-width: 500px; line-height: 34px; } .why-flock3-testimonial span.name { display: block; color: #302f48; font-size: 16px; } .why-flock3-testimonial span.designation { display: block; color: #302f48; font-size: 14px; } .why-flock3-testimonial .slick-prev, .why-flock3-testimonial .slick-next { width: 60px; top: auto; left: 38px; bottom: -60px; height: 60px; position: absolute; cursor: pointer; z-index: 9; transform: none; } .why-flock3-testimonial .slick-next { right: auto; left: 70px; transform: none; } .why-flock3-testimonial .slick-next:before { content: ""; width: 19px; height: 19px; transform: none; } .why-flock3-testimonial .slick-arrow:before { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/arrow-horizontal-50cee7af.svg) no-repeat 0 0; width: 19px; height: 17px; } .slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity: .25; } .why-flock3-testimonial .slick-prev:before { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .why-flock-capterra .testimonial-unit { background: #f8f8f8; } .why-flock-capterra .testimonial-unit .wrapper { padding: 40px 20px; } .why-flock-capterra .testimonial-unit .icon-section { text-align: left; margin-bottom: 0px; } .why-flock-capterra .testimonial-unit .icon-section p { text-align: left; padding-left: 50px; font-size: 16px; line-height: 34px; color: #585858; margin-bottom: 30px; } .why-flock-capterra .testimonial-unit .icon-section .icon-wrapper { text-align: left; } .why-flock-capterra .testimonial-unit .icon-section .icon-wrapper img { margin: 0; } .why-flock-capterra .testimonial-unit .icon-section .icons { margin: 0; } .hs-flock-3-page.why-flock-capterra .custom-flock-banner-area .page-center { padding-left: 0; padding-right: 0; position: relative; } .why-flock-capterra #header.fixedNav { z-index: 99998; } .why-flock-capterra.hipchat-migration.hs-flock-3-page .custom-flock-banner-area { padding-left: 10px; padding-top: 19px; margin: 0; } .why-flock-capterra.hipchat-migration.hs-flock-3-page .home-page .block-content { padding-top: 0; } .why-flock-capterra.hipchat-migration.hs-flock-3-page .home-page .block-content .mast-head { height: 580px; max-width: 719px; background-size: 100% 100%; -webkit-box-shadow: -1px 2px 20px #ccc; box-shadow: -1px 2px 20px #ccc; } .why-flock-capterra.hs-flock-3-page .home-page .block-content .right-section ._g-s-label { margin-bottom: 50px; } body.why-flock-capterra.hs-flock-3-page { padding: 0; } .why-flock-capterra.hs-flock-3-page .home-page #main-area { min-height: 730px; } .why-flock-capterra.hs-flock-3-page .body-container .page-center { max-width: 1100px !important; } .why-flock-capterra.hs-flock-3-page .testimonial-unit .icon-section .wrapper { max-width: 1100px; } .why-flock-capterra.hs-flock-3-page .testimonial-unit { margin: 0; } .hs-flock-3-page .about-flock { background-position: 0 84%; background-size: 46%; background-repeat: no-repeat; } .hs-flock-3-page .about-flock .page-center.wrapper { padding: 40px 20px; } .hs-flock-3-page .about-flock ul li { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/check-mark-da109850.svg) no-repeat; background-position: 0 12px; } .hs-flock-3-page .about-flock ul li:last-child { margin-bottom: 0px; } .hs-flock-3-page .other-awards .page-center.wrapper { padding: 40px 20px; } .hs-flock-3-page .about-flock .about-flock-img { margin-left: 43px; } .hs-flock-3-page .unit.award-section-wrapper { margin: 0; } .hs-flock-3-page .get-started-v2.get-started-inline ._get-started { padding: 85px 40px; } .why-flock-capterra.hs-flock-3-page .get-started-v2.get-started-inline { background: #fff; } .custom-footer-signup.hs_flock3_footer.hs_flock_footer { background: #f8f8f8; } .custom-footer-signup.hs_flock3_footer.hs_flock_footer a { color: #000; } .custom-footer-signup.hs_flock3_footer .custom-footer-menu-signup p { color: #000; } .hs-two-column-content-with-image .page-center { padding-bottom: 50px; } .features-sided-container .block-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .features-sided-container .block { max-width: 460px; } .features-sided-container .text { text-align: center; } .features-sided-container h4 { margin-bottom: 20px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .hs-flock3-features .cm-power-features.power-features.bg-color-shade .page-center { padding-top: 0; } .hs-flock3-features .cm-power-features.power-features.bg-color-shade { background: #fff; } .hs-flock3-features .aspect-wrapper { max-width: 600px; display: -webkit-box; display: -ms-flexbox; display: flex; text-align: center; margin: auto; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .hs-flock3-features .cm-power-features .aspect { width: 100%; display: block; vertical-align: top; margin: 0 0 40px !important; } .hs-flock3-features .cm-power-features .aspect:last-child { margin-bottom: 0 !important; } .hs-flock3-features .cm-power-features .aspect img { width: 35px; height: 35px; display: inline-block; margin-bottom: 16px; } .hs-flock3-features .cm-power-features .aspect h4 { font-size: 20px; line-height: 34px; margin-bottom: 10px; color: #585858; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .hs-flock3-features .cm-power-features .aspect p { font-size: 16px; line-height: 26px; margin-bottom: 0; text-align: center; } .hs-indexe-f.hs-indexb-layout.hipchat-migration .custom-menu-primary .hs-menu-wrapper > ul > li:last-child { display: inline-block; } .hs-indexe-f.hs-indexe-layout.hipchat-migration ._get-started .hs-button { text-transform: uppercase; padding: 15px 20px !important; } .hipchat-migration .home-page .block-content .right-section ._get-started ._g-s-sublable p a:hover, .custom-slider-subheading a:hover{ opacity: 0.8; } .why-flock-capterra ul.no-list.hs-error-msgs.inputs-list { text-align: left; } .why-flock-capterra ._get-started .hs_error_rollup { left: 0; } form { position: relative; } /**********Deepak***********/ .hs-microsoft-hdr.hs-flock-hdr .fixed-product-keys { background: transparent; } .hs-flock-vs-microsoft-layout .flock-vs-microsoftbnr-area .header-wrap p._g-s-label { margin-bottom: 50px; } .hs-flock-vs-microsoft-layout .flock-vs-microsoftbnr-area-btm { margin-top: 15px; } .hs-flock-vs-microsoft-layout .flock-vs-microsoftbnr-area form._g-s-form { max-width: 700px; padding: 8px; margin: 0 auto; display: inline-block; background-color: #1f2237; } .hs-flock-vs-microsoft-layout .home-page #main-area { padding-bottom: 0 !important; } .hs-flock-vs-microsoft-layout .home-page .block-content .full-section { background: url('https://4323997.fs1.hubspotusercontent-na1.net/hub/4323997/hubfs/flock-vs-microsoft-banner-2dedfd1a.png?width=1906&height=828&name=flock-vs-microsoft-banner-2dedfd1a.png') no-repeat center 100%; background-size: 100%; max-width: 800px; margin: auto; display: block; padding-bottom: 210px; } .csm-indexd-page.hs-indexe-layout.hipchat-migration #main-area { min-height: 760px; } .csm-indexd-page.hs-indexe-layout.hipchat-migration .home-page .block-content { padding: 0px; } .hs-indexe-layout.hipchat-migration ._get-started .hs-button { text-transform: uppercase; padding-right: 9px; } .csm-indexd-page.hs-indexe-layout.hipchat-migration .unit{ margin:0px; } .csm-indexd-page .csm-indexd-sec1 .custom-brand-name { border-bottom: 1px solid #dedede; padding: 0px; background: #fff; } .csm-indexd-page .csm-indexd-sec1 .custom-brand-name p.brand-title { padding-top: 31px; font-size: 16px; font-family: proxima-regular, Helvetica, Arial, sans-serif; color: #585858; } .csm-indexd-page .csm-indexd-sec1 .custom-brand-name .brands-wrap { padding: 0; height: auto; } .csm-indexd-page.hs-indexe-layout .testimonial-block { margin-top: 0; border: 0px; padding-bottom: 0px; } .hs-indexb-layout .csm-indexd-sec1 .unit{ padding-top:50px; } .csm-indexd-page .testimonial-section { padding: 0px; } .csm-indexd-page .testimonial-section .link-and-arrow{ text-align:center; margin: 40px 0 0; } .csm-indexd-page.hs-indexb-layout .body-container .csm-indexd-sec1 .page-center{ padding: 0; } .testimonial-section .person-post { font-size: 14px; color: #585858; } .testimonial-section span { display: block; } .testimonial-block span.person-name { font-family: "proxima-semibold", "Helvetica", "Arial", sans-serif; font-size: 18px; } .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider{ padding-top: 0; } .csm-indexd-page .two-col-slider .csm-slider-with-thumbnail-content h3{ font-size: 28px; color: #585858; line-height: 40px; margin: 0 0 20px; font-weight: 400; } .csm-indexd-page .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider .page-center{ padding-top:0px; } .csm-indexd-page.hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .heading-block{ margin: 0 0 50px; padding: 0 10px; } .csm-three-col-img-cap .text-wrapper { padding: 0 10px 40px; } .csm-three-col-img-cap .text-wrapper h3 { position: relative; } .csm-three-col-img-cap { text-align: center; padding-left: 0px !important; padding-right: 0px !important; } .csm-three-col-img-cap .text-wrapper p { margin-bottom: 0px; } .csm-indexd-page .csm-three-col-img-cap .page-center { max-width: 1200px; padding: 0 10px !important; } .csm-three-col-img-cap .image-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 0 10px; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .csm-three-col-img-cap .block { margin: 0 0 50px; width: 100%; max-width: 300px; display: inline-block; } .csm-three-col-img-cap .block .image-block { -webkit-box-shadow: -3px 4px 5px 0 rgba(0,0,0,0.2); box-shadow: -3px 4px 5px 0 rgba(0,0,0,0.2); margin: 0 0 30px; display: inline-block; overflow: hidden; -webkit-transition: -webkit-transform 0.3s ease-in; transition: -webkit-transform 0.3s ease-in; transition: transform 0.3s ease-in; transition: transform 0.3s ease-in, -webkit-transform 0.3s ease-in; width: 100%; } .csm-three-col-img-cap .block h5 {} .csm-three-col-img-cap .block .image-block:hover { -webkit-transform: scale(1.03); -ms-transform: scale(1.03); transform: scale(1.03); -webkit-transition: -webkit-transform 0.3s ease-in; transition: -webkit-transform 0.3s ease-in; transition: transform 0.3s ease-in; transition: transform 0.3s ease-in, -webkit-transform 0.3s ease-in; cursor: pointer; } .csm-business-page span.down-cursor.chevron { display: none; } .hs-home-layout .custom-brand-name { padding-bottom: 470px; } .hs-home-layout #hs_cos_wrapper_widget_1555409583571 .custom-top-video-section.unit { margin-top: -580px; padding-top: 120px; } .hs-home-layout #hs_cos_wrapper_widget_1555314460221 .custom-top-content { margin-top: -310px; padding-top: 420px; } .csm-indexd-sec2 .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider { padding-top: 50px; } .hs-home-main #mail-header { position: relative; top: 0; } body.hs-home-main { padding-top: 0px; } .hs-home-main div#header { top: auto; position: absolute; } .hs-home-main.fixed div#header { position: fixed; top: 0; } @media (min-width: 1000px) { .csm-indexd-sec2 .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider { padding-top: 100px; } .why-flock-capterra.hipchat-migration .get-started-v2.get-started-inline ._get-started ._g-s-label { font-size: 28px; } .hs-two-column-content-with-image .page-center { padding-bottom: 100px; } .why-flock-capterra.hs-flock3-features .get-started-v2.get-started-inline ._get-started .hs-form-field { max-width: 240px; } .hs-flock3-features .cm-power-features .aspect p { font-size: 18px; } .hs-flock3-features .cm-power-features .aspect h4 { font-size: 22px; line-height: 34px; margin-bottom: 20px; } .hs-flock3-features .cm-power-features .aspect img { width: 70px; height: 70px; margin-bottom: 40px; } .hs-flock3-features .cm-power-features .aspect { margin-bottom: 0 !important; max-width: 330px; } .hs-flock3-features .aspect-wrapper { max-width: 100%; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .features-sided-container.left .block-wrapper { flex-direction: row-reverse; } .features-sided-container.left .image { margin-right: 80px; } .features-sided-container .block-wrapper { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .features-sided-container .block { max-width: 100%; } .features-sided-container .text { text-align: left; width: 450px; } .features-sided-container h4 { margin-bottom: 40px; } .features-sided-container .image { width: 750px; margin-left: 80px; } .features-sided-container.right .image { margin-left: 80px; } .why-flock-capterra.hs-flock-3-page #header .page-center { padding-left: 0; } .hipchat-migration.hs-flock-3-page .home-page .block-content .right-section { width: 40.5%; max-width: 450px; float: left; padding-top: 180px; } .hipchat-migration.hs-flock-3-page .home-page .block-content .left-section { padding-right: 0; width: 100%; max-width: 719px; position: absolute; top: 60px; right: -150px; } .why-flock-capterra.hs-flock-3-page .custom-flock-banner-area ._get-started .hs-form-field { max-width: 230px; } .hs-flock-3-page .about-flock .about-flock-block { width: 60%; } .why-flock-capterra .get-started-v2.get-started-inline ._get-started .hs-form-field { max-width: 230px; } .hs-flock-3-page .about-flock-block.about-flock-img-block { width: 39%; } .hs-flock-3-page .other-awards .page-center.wrapper { padding: 85px 0; } .hs-flock-3-page .about-flock .page-center.wrapper { padding: 85px 40px; } .hs-flock-3-page .about-flock .about-flock-img { margin-left: 43px; } .why-flock-capterra #header .page-center { padding-left: 10px; } .why-flock-capterra .testimonial-unit .icon-section .wrapper { padding: 85px 40px 100px; } .why-flock3-testimonial .testimonial-text { max-width: initial; font-size: 32px; } .why-flock3-testimonial:before { top: auto; left: 0px; width: 50px; height: 50px; } .why-flock3-testimonial { padding-top: 0; padding-left: 60px; text-align: left; } .why-flock-capterra .get-started-inline ._get-started .hs-form-wrap { float: none; display: inline-block; margin: 0; vertical-align: middle; } .get-started-v2.get-started-inline ._get-started.locale-in { max-width: 1100px; text-align: left; } .get-started-v2.get-started-inline ._get-started { margin: 0 auto; } .hipchat-migration .get-started-v2.get-started-inline ._get-started ._g-s-label { font-size: 36px; line-height: 50px; margin: 0 20px 0 0; } .unit.compare-section .section-wrapper .section h3 { text-align: left; margin-bottom: 0; } .unit.compare-section .section-wrapper .section p { text-align: left; padding: 20px 0 20px 40px; border-left: 5px solid #0abe51; } .unit.compare-section .section-wrapper .section { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; max-width: 1000px; } .why-flock-capterra .testimonial-unit { margin-bottom: 100px; } .why-flock-capterra .testimonial-unit .page-center { padding: 100px 40px 0px; } .why-flock-capterra .testimonial-unit .icon-section .wrapper .why-flock-capterra #header .page-center { padding-left: 10px; } .why-flock-capterra .page-center { padding-left: 40px; padding-right: 40px; } .why-flock-capterra .body-container .page-center { max-width: 1200px !important; } .why-flock-capterra .home-page .block-content { padding-top: 50px; } .hs-indexe-f .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide.slick-current { border-color: #0abe51; background: #f9f9f9; } .hs-indexe-f .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-current p:first-of-type { color: #0abe51 !important; } .why-flock-capterra .get-started-v2.get-started-inline .hs-form-field ul.no-list.hs-error-msgs.inputs-list { position: absolute; bottom: -28px; } .why-flock-capterra .get-started-v2.get-started-inline .hs_error_rollup { bottom: -44px; } .hs-indexe-f .hipchat-migration ._get-started .hs-button { padding: 15px 20px !important; } .hs-indexe-f.hs-indexe-layout.hipchat-migration .home-page .block-content { padding-top: 48px; } .hs-indexe-f .csm-slider-with-thumbnail-content .slider-container .content { width: auto; } .hs-indexe-f .csm-slider-with-thumbnail-content.api-block .api-img-slider { margin: 0 0 0 24px; } .hs-indexe-f .csm-slider-with-thumbnail-content.api-block .slick-list.draggable { overflow: visible; } .hs-indexe-f .csm-slider-with-thumbnail-content.api-block img { max-width: 800px; } .hs-indexe-f .csm-slider-with-thumbnail-content .slider-container { padding-left: 3px; } .hs-indexe-f .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide { padding-left: 21px; } .hs-indexe-f.hipchat-migration .get-started-v2.get-started-inline ._get-started ._g-s-label { margin: -5px 20px 5px 0 !important; } .hs-indexe-f .custom-flock-banner-area .block-content-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .hs-indexe-f.hipchat-migration .home-page .block-content .left-section { padding-right: 13px; } .hs-indexe-f.hipchat-migration .home-page .block-content .right-section { padding-left: 8px; margin-top: -6px; } body.csm-indexd-page { padding: 0px; } .csm-indexd-page .testimonial-section .link-and-arrow{ text-align:center; margin: 80px 0 0; } .csm-indexd-page.hs-indexe-layout.hipchat-migration #main-area { min-height: 650px; } .csm-indexd-page.hs-indexe-layout.hipchat-migration .home-page .block-content{ padding-top: 140px; width: 100%; } .hs-indexb-layout .csm-indexd-sec1 .unit{ padding-top:100px; padding-bottom: 0px; } .csm-indexd-page .two-col-slider .csm-slider-with-thumbnail-content h3{ font-size: 42px; line-height: 50px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .csm-indexd-page.hs-indexe-layout .csm-slider-with-thumbnail-content.custom-indexe-slider .heading-block{ margin-bottom: 100px; text-align: center; } .csm-three-col-img-cap .text-wrapper{ padding: 0 0 80px; } .csm-three-col-img-cap .text-wrapper h3 span{ background: #fff; padding: 0 20px; position: relative; display: inline-block; z-index: 1; } .text-horizontal-line:after { content: ' '; display: block; height: 2px; width: 100%; background: #ededed; position: absolute; top: 25px; z-index: 0; } .csm-indexd-page .csm-three-col-img-cap .page-center{ padding: 0 !important; } .csm-three-col-img-cap .image-wrap{ -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .csm-three-col-img-cap .block{ margin: 0; } .csm-three-col-img-cap .block.side-margin{ margin: 0 50px; } .hs-indexb-layout.hipchat-migration .custom-full-banner .hs_error_rollup { left: 0px; bottom: -15px; } } @media (min-width: 1000px) and (max-width: 1225px) { .case-study-videos .video-block { max-width: 320px !important; padding-right: 23px; } } @media (max-width: 1200px) and (min-width: 900px) { .why-flock-capterra.hipchat-migration #main-area h2 { font-size: 54px; } } @media (max-width: 1198px) { .hipchat-migration .get-started-v2.get-started-inline ._get-started ._g-s-label { display: block; text-align: center; } .get-started-v2.get-started-inline ._get-started .hs-form-wrap { float: none; margin-top: 40px; max-width: 700px; display: inline-block; } .get-started-v2.get-started-inline ._get-started.locale-in { text-align: center; } .get-started-v2.get-started-inline ._get-started ._g-s-download { display: block; text-align: center; padding-top: 40px; } } @media (max-width: 1198px) and (min-width: 999px) { .why-flock-capterra.hipchat-migration .get-started-v2.get-started-inline ._get-started ._g-s-label { display: inline-block; font-size: 28px; margin: 0 20px 0px 0; } .why-flock-capterra .get-started-v2.get-started-inline ._get-started .hs-form-wrap { margin-top: 0; max-width: 100%; } } @media (max-width: 1024px) and (min-width: 601px) { .why-flock-capterra .about-flock .about-flock-img { height: 330px; } } @media (max-width: 999px) { .hs_flock_footer.custom-footer-signup .page-center { padding: 11px 20px 0 !important; } .hs-flock3-features .cm-power-features.power-features.bg-color-shade .page-center { padding-bottom: 40px; } .hs-flock3-features .cm-power-features.power-features.bg-color-shade { margin-top: -10px; } .hs-flock3-features .cm-power-features .aspect p br { display: none; } .why-flock-capterra .testimonial-unit .icon-section .icons { margin: 0; padding-top: 5px; } .hs-flock-3-page .about-flock { background: none !important; } .why-flock-capterra.hs-flock-3-page .about-flock .about-flock-img { width: 176px; height: 372px; margin-left: auto; margin-right: auto; } .why-flock-capterra.hs-flock-3-page .home-page #main-area { min-height: inherit; } .why-flock-capterra.hipchat-migration.hs-flock-3-page .custom-flock-banner-area { padding-top: 0; padding-left: 0; } .why-flock-capterra.hs-flock-3-page .home-page .block-content .mast-head-mobile { height: 242px; background-size: 100%; -webkit-box-shadow: -1px 2px 20px #ccc; box-shadow: -1px 2px 20px #ccc; -webkit-transition: all ease 0.5s; transition: all ease 0.5s; } .hs-flock-3-page.why-flock-capterra.hipchat-migration .home-page .block-content .left-section { padding-top: 89px; } .why-flock-capterra .hipchat-migration .award-section .gartner-award { margin-bottom: 0; } .why-flock-capterra .other-awards { padding-top: 20px; } .why-flock-capterra .unit.compare-section { margin-bottom: 40px; } .why-flock-capterra .unit.compare-section .section-wrapper .section h3 { padding-top: 10px; } .why-flock-capterra .unit.award-section-wrapper { margin-bottom: 25px; } .why-flock-capterra .other-awards .section { margin: 0 0 0; } .why-flock-capterra .unit.custom-hipchat-two.flock-pricing-benefit .page-center, .why-flock-capterra .unit.custom-Migrate-wrapper .page-center, .why-flock-capterra .custom-need-more .page-center, .why-flock-capterra .award-section-wrapper .page-center { padding: 0px 20px; } .why-flock-capterra .testimonial-unit .wrapper { padding-bottom: 10px; } .why-flock-capterra.hipchat-migration .custom-flock-banner-area { margin: 0; } .why-flock-capterra.hipchat-migration .home-page .block-content .right-section ._get-started { padding-bottom: 60px; padding-left: 10px; padding-right: 10px; } .why-flock3-testimonial .slick-prev { left: 45%; -webkit-transform: translate(-45%, 0); -ms-transform: translate(-45%, 0); transform: translate(-45%, 0); } .why-flock3-testimonial .slick-next { left: 55%; -webkit-transform: translate(-55%, 0); -ms-transform: translate(-55%, 0); transform: translate(-55%, 0); } .why-flock-capterra .testimonial-unit .icon-section p { text-align: center; padding: 0; } .why-flock-capterra .testimonial-unit .icon-section .icon-wrapper { text-align: center; } .why-flock-capterra .testimonial-unit .icon-section .icon-wrapper img { margin: 0 auto 30px; } .why-flock-capterra.hipchat-migration .custom-flock-banner-area { margin: 0; } .hipchat-migration .home-page .block-content .right-section ._get-started { padding-bottom: 60px; } .hs-flock-hdr .fixed-product-keys a.getStartedBtn { font-size: 15px; padding: 5px 10px; } .why-flock-capterra.hipchat-migration .home-page .block-content .left-section { padding-top: 4px; } .why-flock-capterra.hipchat-migration .home-page .heading-wrap { padding: 20px 10px 15px 10px; } .why-flock-capterra.hipchat-migration .home-page .block-content .right-section ._g-s-label { margin-bottom: 30px; } /* .why-flock-capterra .custom-flock-banner-area ._g-s-mobile a._g-s-button.js-mobile-download { max-width: 382px; } */ .hs-flock-hdr .fixed-product-keys a.getStartedBtn { font-size: 15px; padding: 5px 10px; } .unit.compare-section .section-wrapper .section h3 br { display: none; } .unit.compare-section { margin-bottom: 40px; } .why-flock-capterra #header { text-align: left; } .why-flock-capterra #header .page-center { text-align: left; padding: 10px 10px 0px; } .why-flock-capterra #header.fixedNav .page-center { padding-top: 15px; } #header.fixedNav.hs-flock-hdr .header-col { width: 140px !important; float: left !important; } .unit.compare-section .section-wrapper .section h3 br { display: none; } .unit.compare-section { margin-bottom: 40px; } .hipchat-migration .get-started-v2.get-started-inline ._get-started ._g-s-label { margin: 0 0 30px 0; font-size: 22px; display: block; top: 0; } .why-flock-capterra .get-started-v2.get-started-inline ._get-started.locale-in { padding: 40px 20px; } .get-started-inline ._get-started .hs-form-wrap, .get-started-inline ._get-started ._g-s-download { display: none !important; } ._g-s-mobile { text-align: center; } ._g-s-mobile a._g-s-button { display: inline-block; width: 100%; margin: 0; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; max-width: 500px; } ._g-s-mobile a._g-s-button:hover { background: #08a145; } .why-flock-capterra.hipchat-migration .custom-flock-banner-area .block-content-wrap { display: inline-block; } .why-flock-capterra .about-flock h3 { text-align: center; } .unit.compare-section { padding-left: 20px; padding-right: 20px; } .hs-indexe-f.hs-indexe-layout .custom-slider-subheading .demoTeamLink.js-demo-team-link { display: inline-block; } .hs-indexe-f .api-key-slider .slick-slide p.slider-topic { font-size: 16px !important; line-height: 26px !important; } .hs-indexe-f .api-img-slider { padding: 0 20px !important; } .hs-indexe-f .api-key-slider .slick-slide p { margin-bottom: 0 !important; } .hs-indexe-f .api-img-slider .slick-slide img { padding: 0px !important; } .hs-indexe-f .api-img-slider .slick-dots { padding-top: 30px; padding-bottom: 30px; bottom: 0 !important; } .hs-home-layout .custom-brand-name { padding-bottom: 0px; } .hs-home-layout #hs_cos_wrapper_widget_1555409583571 .custom-top-video-section.unit { margin-top: 0px; padding-top: 50px; background-color: #fff !important; } .hs-home-layout #hs_cos_wrapper_widget_1555314460221 .custom-top-content { margin-top: 0px; padding-top: 50px; } #header.fixedNav.why-flock-header .logo { text-align: left; } #header.fixedNav.why-flock-header .page-center { padding-top: 15px; } #header.fixedNav.why-flock-header .logo a img { width: 120px !important; } .thank-you .top-section .wrapper { padding-top: 85px; } .hs-flock3-features .hs-flock-hdr .fixed-product-keys a.getStartedBtn, .why-flock-fb .hs-flock-hdr .fixed-product-keys a.getStartedBtn { font-size: 15px; padding: 5px 10px; } } @media (max-width: 900px) { .why-flock-capterra.hipchat-migration #main-area h2 { font-size: 64px; } } @media (max-width: 767px) { .hs-flock-hdr .fixed-product-keys { width: 100% !important; } .hs-indexe-f.hs-indexe-layout .custom-slider-subheading .demoTeamLink.js-demo-team-link { display: none; } } @media (max-width: 600px) { .why-flock-capterra .about-flock .about-flock-img { height: 256px; } .why-flock-capterra.hipchat-migration #main-area h2 { font-size: 35px; } } @media (max-width: 350px) { .why-flock-capterra .about-flock .about-flock-img { height: 196px; } } .flock-vs-slack2.hipchat-migration #main-area { min-height: 572px; padding-top: 30px; } .flock-vs-slack2.hipchat-migration #main-area h2 { line-height: 1.1; letter-spacing: -2.5px; } .flock-vs-slack2.hipchat-migration #main-area .hs-button { text-transform: uppercase; } .flock-vs-slack2 .custom-flock-banner-area.unit { margin: 0; } .testimonial-section h3 { text-align: center; margin-bottom: 30px; } .flock-vs-slack2-row1 .testimonial-section { padding: 0; } .hs-get-work-done { margin-bottom: 60px; } .hs-get-work-done .title { letter-spacing: -0.8px; display: inline-block; position: relative; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; margin: 0 0 30px 0; vertical-align: middle; text-align: left; } .hs-get-work-done .form { padding: 0; background: #fff; vertical-align: middle; } .hs-get-work-done .title p { margin: 0; font: inherit; } .hs-get-work-done .hs-form-field>label { display: none; } .hs-get-work-done form>div { display: inline-block; vertical-align: middle; } .hs-get-work-done form>div.hs_email .hs-input { border-radius: 6px 0 0 6px; margin: 0 -4px 0 0; } .hs-get-work-done form .hs-button { border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; background: #0c8e45; text-transform: uppercase; margin: 0; } .hs-get-work-done { text-align: center; } .hs-get-work-done h3:empty { display: none; } .flock-vs-slack2-row1 .hs_error_rollup .hs-error-msgs.inputs-list { top: 10px; margin: 0; padding: 0; left: 0; } .security-block ol li { width: 100%; margin: 0; padding: 15px 0; text-align: left; font-size: 18px; color: #0abe51; line-height: 1.3; font-family: proxima-regular, Helvetica, Arial, sans-serif; color: #585858; line-height: 1.2; } .security-block ol { counter-reset: numbers; } .security-block ol li:before { counter-increment: numbers; content: counter(numbers) "."; width: 6%; display: inline-block; } .hs-flock-loved { } .hs-flock-loved h3 { text-align: center; margin: 0 0 50px; } .teams .teams-wrapper { text-align: center; } .teams .teams-block { padding: 30px; border: 1px solid #dedede; text-align: left; } .teams .teams-header { margin: 0 0 30px; } .teams .teams-header img { width: 40px; height: 40px; margin-right: 20px; } .teams .teams-header h6 { font-family: "proxima-semibold", "Helvetica", "Arial", sans-serif; font-size: 24px; line-height: 40px; display: inline; } .teams .double-quotes { width: 17px; height: 14px; margin: 0 0 10px; display: block; } .teams .teams-paragraph { font-size: 18px; line-height: 30px; margin: 0 0 30px; min-height: 150px; } .teams .teams-company-logo { height: 30px; display: block; } .teams .teams-green-txt { color: #0c8e45; font-family: "proxima-semibold", "Helvetica", "Arial", sans-serif; font-size: 18px; line-height: 26px; margin: 0; } .hs-flock-loved .page-center { padding: 0 !important; max-width: 1200px !important; } .flock-vs-slack2-row1 .get-started .g-s-download ul li { display:inline; } .flock-vs-slack2-row1 .get-started .g-s-download ul li+li:before { content: ''; background: #333333; border-radius: 50%; display: inline-block; height: 5px; margin: 0 5px 0 10px; vertical-align: middle; width: 5px; } .hs-get-work-mobile-btn a{ display: inline-block; width: 100%; margin: 0; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; max-width: 500px; background: #0c8e45; } .flock-vs-slack2 ._g-s-mobile a._g-s-button.js-mobile-download { background: #0abe51; } .flock-vs-slack2 ._g-s-mobile a._g-s-button.js-mobile-download:hover { background: #08a145; } .flock-vs-slack2 { padding: 0; } .gartner-section-wrapper .page-center { position: relative; max-width:1200px !important; } .gartner-section { position: absolute; top: -98px; right: 0; z-index: 999999; width: 122px; } .why-flock2-row1 .icon-section.section-bottom-border { margin: 0; } .why-flock2-row1 .unit { padding: 50px 0; margin: 0 !important; } .container-fluid .row-fluid .why-flock-fb1 .page-center { max-width: 1200px !important; padding: 50px 10px; } .two-col-slider .csm-slider-with-thumbnail-content h3 { margin: 0 0 15px 0; padding: 0; color: #333333; margin-bottom: 0; text-align: center; } .two-col-slider .csm-slider-with-thumbnail-content .text-wrapper p { margin: 0 0 40px; } .two-col-slider .csm-slider-with-thumbnail-content .slick-slide { cursor: pointer; margin-bottom: 0; } .two-col-slider .csm-slider-with-thumbnail-content .text-section { padding: 20px; width: 100% !important; border-left: 5px solid #fff; } .why-flock2-row1 .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-slide p:not(.slider-topic) { padding: 0 0 4px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .two-col-slider .csm-slider-with-thumbnail-content p { margin: 0; } .two-col-slider .csm-slider-with-thumbnail-content .slider-topic { font-size: 16px; line-height: 26px; } .two-col-slider .csm-slider-with-thumbnail-content .slider-topic { font-size: 16px; line-height: 26px; } .two-col-slider .csm-slider-with-thumbnail-content .api-img-slider .slick-list { margin: 0 0 30px; } .two-col-slider .csm-slider-with-thumbnail-content .slick-dots { display: block; text-align: center; width: 100%; } .two-col-slider .csm-slider-with-thumbnail-content .content.desktop-screen { display: inline-block !important; } .two-col-slider .csm-slider-with-thumbnail-content .api-key-slider { margin: 30px 0 0; } .two-col-slider .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-slide p { padding:0; } .two-col-slider .csm-slider-with-thumbnail-content.api-block .features-carousel .api-key-slider .slick-list .slick-current .text-section { border-color: #0abe51; } .two-col-slider .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide.slick-current { border-color: #0abe51; background: #f9f9f9; } .two-col-slider .csm-slider-with-thumbnail-content .slider-topic { color: inherit !important; } .hs-progressbar-carousel h2 { color: #333333; margin-bottom: 30px; text-align: center; } .progressbar-carousel { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .progressbar-carousel .image-slider,.progressbar-carousel .slider-key { width: 100%; max-width: 600px } .progressbar-carousel .image-slider { margin-bottom: 40px } .progressbar-carousel .slider-key .slide { text-align: center; cursor: pointer; outline: none; } .progressbar-carousel .slide-heading { font-family: proxima-semibold, Helvetica, Arial, sans-serif; font-size: 18px; line-height: 26px; color: #585858; margin-bottom: 5px } .progressbar-carousel .slide-paragraph { font-size: 16px; line-height: 26px; color: #585858; margin-bottom: 20px } .progressbar-carousel .slide-paragraph .green-text { color: #0abe51; font-family: proxima-semibold, Helvetica, Arial, sans-serif; text-transform: capitalize; } .progressbar-carousel .progress-bar { width: 100%; height: 2px; background: #efefef; position: relative; } .progressbar-carousel .progress-bar .progress-level { height: 100%; background: #0abe51; display: block } .progressbar-carousel-revrse { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .why-flock-fb1 h2 { /*color: #333333;*/ margin-bottom: 30px; text-align: center; } .why-flock-fb1 .hs-tabber-group h2 + p { text-align: center; margin-bottom: 40px; } .hs-tabber-group .wrapper { padding: 85px 10px 0 } .hs-tabber-group h3 { display: block; text-align: center; margin-bottom: 40px } .hs-tabber-group .tabs-block { display: block; text-align: center } .hs-tabber-group .tabs-block span { display: inline-block; padding: 10px 15px; color: rgba(51, 51, 51, 0.3); font-size: 16px; border-radius: 6px 6px 0 0; cursor: pointer; text-transform: uppercase } .hs-tabber-group .tabs-block span.active { color: #0abe51; background: #f9f9f9 } .hs-tabber-group .unit-content { display: none; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 20px 40px; background: #f9f9f9; -webkit-box-sizing: border-box; box-sizing: border-box } .hs-tabber-group .unit-content .img-content { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding-bottom: 20px } .hs-tabber-group .unit-content .img-content, .hs-tabber-group .unit-content .description-content { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex } .hs-tabber-group .unit-content .description-content { -webkit-box-align: center; -ms-flex-align: center; align-items: center } .hs-tabber-group .unit-content .description-content ul { list-style: disc; padding: 0; margin: 0 } .hs-tabber-group .unit-content .description-content li { font-size: 16px; color: #333; padding: 0 0 10px 0; margin: 0 } .hs-tabber-group.wide .tabs-block span { position: relative; color: #697178 } .hs-tabber-group.wide .tabs-block span:after { content: ''; position: absolute; display: block; width: 0; height: 2px; background: #697178; left: 50%; bottom: 0; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); -webkit-transition: width 0.3s; transition: width 0.3s } .hs-tabber-group.wide .tabs-block span.active { font-weight: 600; background: #ffffff } .hs-tabber-group.wide .tabs-block span.active:after { width: 100% } .why-flock-fb .body-container, .why-flock-fb .section { padding: 0; } .why-flock-fb #header { background-image: none; } .why-flock-fb1 .case-study-videos .link-and-arrow { display: none; } .why-flock-fb1 .get-started-v2 { background: #f9f9f9; } .why-flock-fb1 .csm-slider-with-thumbnail-content .link-and-arrow { display: none; } @-webkit-keyframes widthZeroToHundred { from { width: 0%; } to { width: 100%; ; } } @keyframes widthZeroToHundred { from { width: 0%; } to { width: 100%; ; } } .progressbar-carousel .slick-current .progress-bar .progress-level { -webkit-animation-name: widthZeroToHundred; animation-name: widthZeroToHundred; -webkit-animation-duration: 4s; animation-duration: 4s; } .progressbar-carousel .progress-bar .progress-level { width: 0; } .why-flock-fb1 .case-study-videos { background: transparent; padding: 0; } .why-flock-fb1 .get-started-v2 h3 { font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; margin: 0 0 30px 0; vertical-align: middle; letter-spacing: -0.8px; } .why-flock-fb1 .get-started-v2 ._g-s-mobile { display: none; } .why-flock-fb1 .get-started-v2 a { text-decoration: none !important; cursor: pointer; } .why-flock-fb1 .get-started-v2 a:hover { color: #23527c !important; } .why-flock-fb1 .get-started-v2 p._g-s-label { display: none; } .why-flock-fb1 .case-study-videos .page-center.wrapper { padding: 50px 10px !important; } .container-fluid .row-fluid .why-flock-fb1 .hs-tabber-group .page-center { padding: 40px 10px; } .main-area.why-flock-fb-banner { background: #0c0e1a; text-align: center; position: relative; color:#fff; } .main-area.why-flock-fb-banner .wrapper.page-center { padding: 90px 0 50px; position: relative; z-index: 9; max-width: 1200px; } .main-area.why-flock-fb-banner h1 { color: #ffffff; margin-bottom: 10px; } .main-area.why-flock-fb-banner p._g-s-label { letter-spacing: -0.8px; display: inline-block; color: #fff; text-align: center; font-size: 18px; margin: 0 0 40px; } .main-area.why-flock-fb-banner form .hs-form-field, .main-area.why-flock-fb-banner form .hs-submit { margin: 0; } .main-area.why-flock-fb-banner form .hs-submit .hs-button { border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; background: #0c8e45; padding: 15px 20px; } .main-area.why-flock-fb-banner form .hs-form-field .hs-input { border-radius: 6px 0 0 6px; } .main-area.why-flock-fb-banner .icon-section p { margin: 0 0 10px; color: #969696; letter-spacing: 1px; text-transform: uppercase; font-size: 16px; } .main-area.why-flock-fb-banner .icon-section .flock-users-icon { margin: 0; width: auto; height: auto; margin-right: 17px; } .main-area.why-flock-fb-banner .icon-section .flock-users-icon img { margin: 0; } .main-area.why-flock-fb-banner .icon-section .flock-users-icon:last-child { margin: 0; } .main-area.why-flock-fb-banner .icon-section { border: 0; margin: 0; padding: 0; } .why-flock-fb1 .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider .page-center { padding: 50px 10px; } .why-flock-fb1 .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider { padding:0; } .csm-indexd-sec2 .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider .slick-slide.slick-current > p { color: #0abe51; } @media (min-width: 600px) { .flock-vs-slack2.hipchat-migration #main-area h2 { font-size: 64px; } } @media (min-width: 601px) { .hs-tabber-group .img-content img { width: 512px; height: 310px } } @media (min-width: 1000px) { .two-col-slider .csm-slider-with-thumbnail-content .content { width: 49.5%; display: inline-block; vertical-align: top; } .two-col-slider .csm-slider-with-thumbnail-content .content.mobile-screen { display: none !important; } .why-flock-fb1 .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider .page-center { padding: 75px 20px 0; } .main-area.why-flock-fb-banner ._get-started.locale-in { margin-bottom: 80px; max-width: 800px; } .visible999 { display: none !important; } .main-area.why-flock-fb-banner form { position: relative; display: inline-block; max-width: 700px; margin: 0 auto; text-align: center; border-radius: 6px; padding: 8px; background: rgba(151,151,151,0.1); } .main-area.why-flock-fb-banner p._g-s-label { line-height: 1.2; font-family: proxima-regular, Helvetica, Arial, sans-serif; font-size: 22px; } .main-area.why-flock-fb-banner .wrapper.page-center { padding-top: 42px; } .main-area.why-flock-fb-banner h1 { margin-bottom: 20px; } .main-area.why-flock-fb-banner .mast-head { display: none; } .why-flock-fb-banner-bg { height: 475px; position: absolute; width: 100%; top: 80px; left: 0; top: 42px; background-repeat: no-repeat; background-position: 50% 0; background-size: 1250px 100%; } .main-area.why-flock-fb-banner { min-height: 602px; } .why-flock-fb1 .get-started-v2 ._get-started .hs_error_rollup { left: 0; } .why-flock-fb-banner ._get-started .hs_error_rollup { left: 8px; bottom: -8px; } .why-flock-fb-banner ._get-started .hs-error-msgs { text-align: left; } .why-flock-fb1 .get-started-inline ._get-started ._g-s-download p { font-size: 18px; margin: 0; line-height: 1.42857; } .container-fluid .row-fluid .why-flock-fb1 .hs-tabber-group .page-center { padding: 150px 40px 0; } .why-flock-fb1 .case-study-videos .page-center.wrapper { padding: 80px 20px 150px !important; } .why-flock-fb1 .get-started-v2 h3 { font-size: 36px; line-height: 50px; margin: 0 20px 0px 0; } .hs-tabber-group .wrapper { padding: 85px 40px 0 } .hs-tabber-group h3 { margin-bottom: 80px } .hs-tabber-group .tabs-block span { padding: 10px 30px } .hs-tabber-group .unit-content { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; padding: 40px 30px } .hs-tabber-group .unit-content .img-content, .hs-tabber-group .unit-content .description-content { -webkit-box-flex: 0.45; -ms-flex: 0.45; flex: 0.45 } .hs-tabber-group .unit-content .img-content { padding-bottom: 0 } .hs-tabber-group.wide .tabs-block span { padding: 10px 60px } .hs-tabber-group.wide .tabs-block span.active { background: #f9f9f9 } .hs-tabber-group.wide .tabs-block span.active:after { content: none } .why-flock-fb1 h2 { margin-bottom: 60px; margin-top: 20px; /*added by Gaurang for Why Flock PRO h2 top spacing with chevron*/ } .why-flock-fb1 .hs-tabber-group h2 { margin-bottom: 0px; } .why-flock-fb1 .hs-tabber-group h2 + p { margin-bottom: 80px; } .hs-progressbar-carousel h2 { margin-bottom: 80px; } .progressbar-carousel { -webkit-box-orient:horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .progressbar-carousel .image-slider { max-width: 600px; margin-bottom: 0px } .progressbar-carousel .slider-key { margin-left: 30px; max-width: 400px } .progressbar-carousel .slider-key .slick-track { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .progressbar-carousel .slider-key .slick-slide { width: 100% !important; margin-bottom: 30px } .progressbar-carousel .slider-key .slick-slide:last-child { margin-bottom: 0 } .progressbar-carousel .slider-key .slide { text-align: left } .progressbar-carousel-revrse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse } .two-col-slider .csm-slider-with-thumbnail-content .api-img-slider .slick-dots { display: none !important; } .two-col-slider .csm-slider-with-thumbnail-content .api-img-slider { width: 800px; left: -120px; margin-left: 0px; } .two-col-slider .csm-slider-with-thumbnail-content .slider-topic { font-size: 18px; text-align: left; color:#585858!important; /*color added by Gaurang*/ } .two-col-slider .csm-slider-with-thumbnail-content .slider-heading /*added by Gaurang*/ { font-family:proxima-semibold; padding: 0px 0px 4px!important; } .two-col-slider .csm-slider-with-thumbnail-content .api-key-slider p { text-align: left; } .two-col-slider .csm-slider-with-thumbnail-content .api-key-slider .slick-list .slick-slide { width: 100% !important; } .two-col-slider .api-key-slider .slick-track { -webkit-transform: translate3d(0, 0, 0) !important; -ms-transform: translate3d(0, 0, 0) !important; transform: translate3d(0, 0, 0) !important; width: 100% !important; } .two-col-slider .api-key-slider .slick-list { overflow: visible; } .two-col-slider .csm-slider-with-thumbnail-content .api-key-slider { width: 445px; margin: 0; } .two-col-slider .csm-slider-with-thumbnail-content .content.mobile-screen { display: none !important; } .two-col-slider .csm-slider-with-thumbnail-content .text-wrapper p { margin: 0 0 80px; } .two-col-slider .csm-slider-with-thumbnail-content h3 { font-size: 56px; line-height: 62px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .container-fluid .row-fluid .why-flock-fb1 .page-center { padding: 80px 20px 0; } .flock-vs-slack2 .header-container { padding-top: 97px; } .hs-get-work-mobile-btn { display:none; } .flock-vs-slack2.hipchat-migration #main-area h2 { margin: 0; font-size: 56px; } .flock-vs-slack2.hipchat-migration #main-area .hs-button { padding: 15px 20px; } .hs-get-work-done { margin-bottom: 100px; } .hs-get-work-done .title { font-size: 36px; line-height: 50px; margin: 0 20px 0px 0; } .hs-get-work-done .form { position: relative; display: inline-block; max-width: 700px; margin: 0 auto; text-align: center; border-radius: 6px; } .hs-get-work-done form>div.hs_email { width: 305px; margin: 0; } .teams .teams-block { width: 30.51%; margin: 0 15px; display: inline-block; } .flock-vs-slack2-row1 .get-started p.g-s-label { font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .flock-vs-slack2-row1 .bottom-get-started ._get-started { max-width: 870px !important; } .custom-accordion-body-inner table .green-text { font-size: 22px; } } @media (max-width: 1200px) and (min-width: 900px) { .flock-vs-slack2.hipchat-migration #main-area h2 { font-size: 54px; } } @media (max-width: 1024px) and (min-width: 600px) { .teams .teams-block { width: 50%; margin: 0 auto; } .flock-vs-slack2.hipchat-migration #main-area h2 { font-size: 64px; padding: 20px 10px 15px 10px; margin: 0; } .flock-vs-slack2.hipchat-migration #main-area { padding-top: 0; } } @media (max-width: 999px) { .why-flock-fb1 .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider h3 { font-size: 30px; line-height: 1.2; margin: 0 0 15px 0; padding: 0; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; margin: 0; } .why-flock-fb1 .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider h3 + div>p { font-size: 20px; line-height: 34px; margin: 0 0 40px; letter-spacing: 0; text-align: center; } .why-flock-fb1 .get-started-v2 ._g-s-download { display: block !important; padding: 0 !important; } .why-flock-fb1 .get-started-v2 ._g-s-download ._g-s-download { display: none !important; } .why-flock-fb1 .get-started-v2 h3 { font-size: 22px; position: relative; line-height: 1.4; letter-spacing: -0.8px; } .why-flock-fb1 .case-study-videos .video-block:last-child { margin: 0; } .why-flock-fb1 .case-study-videos .video-block p { margin: 0 0 20px; } .why-flock-fb1 .get-started-v2 ._g-s-mobile { display: block; } .two-col-slider .csm-slider-with-thumbnail-content .content.desktop-screen { display: none !important; } .main-area.why-flock-fb-banner .mast-head { background-size: 100% 100%; display: inline-block !important; width: 100%; max-width: 200px; height: 200px; margin-bottom: 10px; max-width: 300px; height: 300px; } .main-area.why-flock-fb-banner { text-align: center; } .main-area.why-flock-fb-banner .wrapper.page-center { padding-top: 16px; } .main-area.why-flock-fb-banner p._g-s-label { line-height: 1.4; } .main-area.why-flock-fb-banner ._get-started.locale-in { margin-bottom: 30px; } .main-area.why-flock-fb-banner .icon-section .flock-users-icon { display: inline-block; } .main-area.why-flock-fb-banner .icon-section .flock-users-icon img { width: auto !important; height: 30px; } .hidden999 { display:none !important; } .hs-flock-loved .page-center { padding: 0 10px !important; } .hs-get-work-done .form { display:none; } .hs-get-work-done .title p { font-size: 22px; position: relative; line-height: 1.4; letter-spacing: -0.8px; } .flock-vs-slack2 .header-container { padding-top: 73px; } .gartner-section { top: -74px; width: 100px; } .gartner-section-wrapper .page-center { max-width:706px !important; } .cm-smart-block.cm-two-col-right-img-wrap .page-center .smart-block-col { width: 100% !important; display: block !important; } .why-flock-fb1 .get-started-inline ._get-started ._g-s-download p { display: none; } } @media (max-width: 600px) { .hs-tabber-group .img-content img { width: 200px; height: 121px } } @media (max-width: 599px) { .flock-vs-slack2.hipchat-migration #main-area h2 { font-size: 35px; padding: 20px 10px 15px 10px; margin: 0; } .flock-vs-slack2.hipchat-migration #main-area { padding: 0; } } @media (max-width: 399px) { .main-area.why-flock-fb-banner .mast-head { max-width: 200px; height: 200px; } } body.csm-pricing-page, body.csm-security-page, .csm-thank-page{ padding-top: 0px !important; } .csm-pricing-page .body-container, body.csm-security-page .body-container, .csm-thank-page .body-container{ padding: 0px 0px 0px 0px; margin-top:-1px; } .custom-banner-section.csm-pricing-banner { height: 100%; text-align: center; color: #fff; position: relative; min-height: 650px; background-color: rgb(12, 14, 26); padding: 0px; } .custom-banner-section.csm-pricing-banner .page-center { padding: 205px 0 0; } .csm-paricing-table { width: 100%; padding: 50px 10px; -webkit-box-sizing: border-box; box-sizing: border-box; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .csm-paricing-table .plan-wrap { position: relative; margin-top: -420px; z-index: 2; } .csm-paricing-table .plan-wrap .plan-box { float: left; display: inline-block; max-width: 365px; width: 100%; background-color: #fefefe; text-align: center; border-radius: 3px 0 0 0; position: relative; z-index: 1; border: solid 1px #ededed; } .csm-paricing-table .plan-wrap .plan-box.pro-plan { float: left; display: inline-block; max-width: 365px; width: 100%; background-color: #fefefe; text-align: center; border-radius: 3px 0 0 0; position: relative; z-index: 1; border: solid 1px #ededed; } .csm-paricing-table .plan-wrap .plan-box.pro-plan{ background: #fff; border-radius: 3px 3px 0 0; margin-top: -9px; -webkit-box-shadow: 0 0 17px rgba(0,0,0,0.1); box-shadow: 0 0 17px rgba(0,0,0,0.1); border-top: 5px solid #0abe51; padding-top: 4px; z-index: 2; } .csm-paricing-table .plan-wrap .csm-col3 { border-radius: 0 3px 0 0; } .csm-paricing-table .plan-wrap h3 { font-size: 14px; padding: 0; font-weight: bold; line-height: 20px; margin: 20px 0 5px 0; color: #585858; text-transform: uppercase; letter-spacing: 1.5px; } .csm-paricing-table .plan-wrap .outer-wrap { width: 100%; display: block; overflow: hidden; } .csm-paricing-table .plan-wrap span.price { font-size: 60px; position: relative; left: -15px; font-weight: bold; } .csm-paricing-table .plan-wrap .dollar-symbol { font-size: 24px; left: 0.6em; } .csm-paricing-table .plan-wrap sup { top: -0.2em; } .csm-paricing-table .plan-wrap a.price { font-size: 32px; left: 0; padding: 20px 0; display: inline-block; color: #585858; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; } .csm-paricing-table .plan-wrap a.price:hover { color: #0abe51; } .csm-paricing-table .plan-wrap span.txt.lifetime-txt { opacity: 0.5; font-size: 16px; color: #585858; display: inline-block; } .csm-paricing-table .plan-wrap span.divider { width: 155px; height: 1.1px; background: #e6e6e6; display: inline-block; } .csm-paricing-table .plan-wrap p { font-size: 18px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; margin: 0; padding: 11px 12px 20px; max-width: 333px; display: inline-block; text-align: left; } .csm-paricing-table .plan-wrap ul { max-width: 320px; text-align: left; margin: auto; padding-left: 10px; } .csm-paricing-table .plan-wrap ul li { padding-left: 30px; font-size: 18px; color: #585858; margin-bottom: 10px; position: relative; } .csm-paricing-table .plan-wrap ul li img { max-width: 15px; position: absolute; left: 0; top: 7px; } .csm-paricing-table .plan-wrap ul li span.bold-txt { font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; } .csm-paricing-table .plan-wrap a.getstarted-btn { padding: 13px 35px; color: #fff; background: #0abe51; font-size: 18px; cursor: pointer; display: inline-block; border-radius: 4px; margin: 20px 0 19px 0; display: none; } .csm-paricing-table .plan-wrap span.strip { display: block; height: 40px; } .csm-pricing-sec2, .csm-pricing-sec3, .csm-pricing-sec4, .csm-pricing-sec5, .csm-pricing-sec7{ width: 100%; padding: 50px 10px; -webkit-box-sizing: border-box; box-sizing: border-box; font-family: proxima-regular, Helvetica, Arial, sans-serif; background: #f8f8f8; display: block; } .csm-pricing-sec2 h3 { text-align: center; margin-bottom: 50px; } .csm-pricing-sec2 h3 { text-align: center; margin-bottom: 50px; } table.table-pricing { width: 100%; padding: 0; text-align: left; table-layout: fixed; background: #fff; border: 10px solid #fff; } .csm-pricing-sec2 table { border-collapse: collapse; border-spacing: 0; } .table-pricing th { margin: 0; padding: 15px 0 10px 0; font-family: proxima-semibold, Helvetica, Arial, sans-serif; font-size: 18px; color: #585858; font-weight: 100; -webkit-box-sizing: border-box; box-sizing: border-box; word-wrap: break-word; } .table-pricing th.th-title1 { width: 40%; } .table-pricing th.th-title2, .table-pricing th.th-title3, .table-pricing th.th-title4 { width: 20%; text-align: center; } .table-pricing .table-title { margin: 0; padding: 15px 0 15px 10px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; font-size: 18px; color: #585858; font-weight: 100; text-transform: uppercase; -webkit-box-sizing: border-box; box-sizing: border-box; } .table-pricing td.grey-bg { background: #efefef; } .table-pricing td.bottom-border { border-bottom: 1px solid #efefef; } .table-pricing td { margin: 0; padding: 12px 0 12px 10px; font-family: proxima-regular, Helvetica, Arial, sans-serif; font-size: 16px; color: #585858; -webkit-box-sizing: border-box; box-sizing: border-box; word-wrap: break-word; } .table-pricing td.td-center { text-align: center; } .table-pricing td.td-last { color: #585858; word-wrap: break-word; text-align: center; } .table-pricing td.last-cell { padding-bottom: 30px; } .table-pricing td.td-first { font-size: 16px; } .table-pricing td.td-center { text-align: center; } .table-pricing td.bottom-border { border-bottom: 1px solid #efefef; } .table-pricing td span.dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #b4b8bc; } .table-pricing td span.dot i{ display:none; } .table-pricing td img { max-width: 15px; width: 100%; } .table-pricing .tool-tip { display: inline-block; margin-left: 5px; position: relative; cursor: pointer; } .table-pricing .tool-tip .help{ display: inline-block; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/tool-tip-icon-f44e6037.svg) 0 0 no-repeat; background-size: 100%; width: 20px; height: 20px; vertical-align: middle; } .table-pricing .tool-tip .tool-tip-content { position: absolute; width: 220px; background: #fff; padding: 20px; margin-top: 14px; margin-left: -17px; border-top: 5px solid #0abe51; -webkit-box-shadow: 3px 1px 15px rgba(0,0,0,0.4); box-shadow: 3px 1px 15px rgba(0,0,0,0.4); display: none; cursor: default; z-index: 1; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; font-size: 16px; text-transform: none; } .table-pricing .tool-tip:hover .tool-tip-content { display: block; } .table-pricing .tool-tip .tool-tip-content:before { content: ''; border-width: 15px; border-style: solid; border-color: transparent transparent #0abe51 transparent; top: -35px; position: absolute; left: 12px; } .table-pricing .plan-features .getstarted-btn { font-size: 18px; padding: 13px 29px; display: none; } .table-pricing .getstarted-btn { padding: 13px 35px; color: #fff; background: #0abe51; font-size: 18px; cursor: pointer; display: inline-block; border-radius: 4px; margin: 20px 0 19px 0; } .csm-pricing-sec3 h5 { text-align: center; margin-bottom: 50px; } .csm-pricing-sec3 .csm-two-column-equal{ padding-top: 0px; } .csm-pricing-sec3 .csm-two-column-equal .left-block { vertical-align: top; } .csm-pricing-sec3 .csm-two-column-equal h6 { font-size: 18px; line-height: 1.3; margin-bottom: 20px; } .csm-pricing-sec3 .csm-two-column-equal h6 { font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .csm-pricing-sec3 .csm-two-column-equal p { margin-bottom: 30px; font-size: 18px; line-height: 1.3; margin-bottom: 20px; } .csm-pricing-sec3 .csm-two-column-equal .right-block p{ padding: 0 ; } .csm-pricing-sec3 .csm-two-column-equal .right-block p a { color: #0abe51; } .csm-pricing-sec3, .csm-pricing-sec5{ background:#fff; } .csm-pricing-sec5 .customers-logo .logo-box { margin: 0px; padding: 0px; } .csm-pricing-sec5 .customers-logo h2 { margin-bottom: 70px; padding-bottom: 0px; } .compliant-block { width: 100%; margin-top: 60px; text-align: center; } .compliant-block .compliant-wrap { display: inline-block; width: 100%; padding: 25px; max-width: 750px; border: 1px solid #cccccc; -webkit-box-sizing: border-box; box-sizing: border-box; } .compliant-block .soc-img { width: 70px; margin-top: 10px; } .compliant-block .content { float: right; width: 100%; text-align: left; padding-left: 0; padding-top: 30px; } .compliant-block .content p { font-size: 15px; margin-bottom: 0; line-height: 1.73; } .csm-pricing-sec6 .bottom-get-started { background: #1a5db0; color: #fff; } .csm-pricing-sec6 .bottom-get-started p { color: #fff; } .csm-pricing-sec6 .bottom-get-started .g-s-download, .csm-pricing-sec6 .bottom-get-started .g-s-download a { color: #fff; } .csm-pricing-sec6 .bottom-get-started .g-s-mobile, .csm-pricing-sec6 .bottom-get-started .g-s-mobile a { color: #fff; } .csm-pricing-sec7{ text-align: center; background-color: #fff; } .csm-pricing-sec7 h2{ font-size: 32px; color: #585858; line-height: 1.2; margin: 0 0 15px 0; padding: 0; letter-spacing: -0.5px; text-align: center; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .csm-pricing-sec7 .drivezy-videos { margin-top: 35px; margin-bottom: 70px; padding: 0px; text-align: center; } .csm-pricing-sec7 .drivezy-videos .page-center { max-width: 100% !important; } .csm-pricing-sec7 .drivezy-videos .params-unit { max-width: 900px; min-width: 300px; min-height: 200px; display: inline-block; position: relative; -webkit-box-shadow: 0 3px 30px rgba(0,0,0,0.5); box-shadow: 0 3px 30px rgba(0,0,0,0.5); } .csm-pricing-sec7 .drivezy-videos .params-block { display: block; } .csm-pricing-sec7 .drivezy-videos .params-unit .video-play-btn { max-width: 100px; position: absolute; top: 50%; left: 50%; margin: auto; cursor: pointer; -webkit-transition: all .5s ease; transition: all .5s ease; -ms-transform: translate(-50%, -50%) scale(0.9); -webkit-transform: translate(-50%, -50%) scale(0.9); transform: translate(-50%, -50%) scale(0.9); z-index: 4; height: auto; } .csm-pricing-sec7 .drivezy-videos .params-unit .video-play-btn:hover, .csm-pricing-sec7 .drivezy-videos .params-unit:hover .video-play-btn { opacity: 1; -webkit-transition: all .5s ease; transition: all .5s ease; -ms-transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .csm-pricing-sec7 .drivezy-videos .params-unit:after{ content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 1s; -webkit-transition: all 1s; z-index: 1; background: rgba(0,0,0,0.01); } .csm-pricing-sec7 .drivezy-videos .params-unit:hover:after{ background: rgba(0,0,0,0.3); cursor: pointer; } .csm-feature-with-top-icon .feature-unit { display: block; width: 100%; padding: 0 15px 60px; -webkit-box-sizing: border-box; box-sizing: border-box; vertical-align: top; text-align: left; } .csm-feature-with-top-icon .feature-unit h3 { display: block; font-size: 28px; margin: 0 0 15px 0; color: #585858; line-height: 1.3; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .csm-feature-with-top-icon .feature-unit p { display: block; margin: 0; padding: 0; color: #585858; font-size: 18px; line-height: 26px; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .csm-feature-with-top-icon .feature-unit .icon { display: inline-block; width: 90px; height: 75px; margin-bottom: 15px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/pricing-feature-icons-68f36c05.png) no-repeat 0 0; } .csm-feature-with-top-icon .feature-unit .group-conversation { background-position: -25px -77px; } .csm-feature-with-top-icon .feature-unit .file-sharing { background-position: -36px -216px; } .csm-feature-with-top-icon .feature-unit .video-calling { background-position: -24px -503px; } .csm-feature-with-top-icon .feature-unit .productivity-apps { background-position: -29px -356px; } .csm-feature-with-top-icon .feature-unit .apps-integration { background-position: -29px -643px; } .csm-feature-with-top-icon .feature-unit .everywhere-icon { background-position: -25px -782px; } .csm-security-page div#header, .csm-thank-page div#header{ background: transparent; } .csm-security-page #header.fixedNav, .csm-thank-page div#header.fixedNav { background: #fff; } .custom-banner-section.csm-security-banner{ background-size: cover; min-height: 450px; position: relative; display: block; width: 100%; background-color: rgb(243, 243, 243); padding: 0px; } .custom-banner-section.csm-security-banner .page-center { padding: 85px 40px 0; } .custom-banner-section.csm-security-banner .banner-content { width: 100%; position: absolute; top: 50%; left: 50%; display: inline-block; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); text-align: center; padding: 0 10px; } .custom-banner-section.csm-security-banner .banner-content h1{ font-size: 40px; color: #fff; margin: 0; padding: 0; font-family: proxima-light,Helvetica, Arial, sans-serif; letter-spacing: -0.8px; font-weight: 300; line-height: 1.57; } .custom-banner-section.csm-security-banner .banner-content p{ font-size: 22px; color: #fff; margin: 0; padding: 0; font-family: proxima-regular,Helvetica, Arial, sans-serif; font-weight: 300; line-height: 1.57; } .csm-two-column-with-security.security-description { display: block; padding: 0 10px; } .csm-two-column-with-security .page-center { padding: 40px 0; } .csm-two-column-with-security .unit-row { display: block; overflow: hidden; padding-bottom: 0px; } .csm-two-column-with-security .unit-row .security-unit{ float: left; display: inline-block; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; padding-bottom: 60px; } .csm-two-column-with-security .unit-row .security-unit p { display: block; font-size: 18px; margin: 0; padding: 0; color: #585858; font-family: proxima-regular,Helvetica, Arial, sans-serif; line-height: 26px; text-align: justify; } .csm-two-column-with-security .unit-row .security-unit h4 { display: block; font-size: 22px; margin: 0; padding: 0 0 15px 0; color: #585858; text-align: left; font-family: proxima-regular,Helvetica, Arial, sans-serif; } .csm-two-column-with-security .unit-row .security-unit a { text-decoration: none; color: #0abe51; margin: 0; padding: 0; cursor: pointer; font-family: proxima-semibold,Helvetica, Arial, sans-serif; } .csm-two-column-with-security .security-unit .title-box { width: 100%; margin-bottom: 20px; } .csm-two-column-with-security .security-unit .title-box p{ display: block; font-size: 18px; margin: 0; padding: 0; color: #585858; font-family: proxima-regular,Helvetica, Arial, sans-serif; line-height: 26px; text-align: justify; } .csm-two-column-with-security .security-unit .icon{ background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/security-sprite-69e9702d.svg) no-repeat; width: 60px; height: 54px; margin-bottom: 10px; display: inline-block; background-size: cover; vertical-align: middle; } .csm-two-column-with-security .security-unit .icon-data-center-security { background-position: -67px 0; } .csm-two-column-with-security .security-unit .icon-data-encryption { background-position: 0 0; } .csm-two-column-with-security .security-unit .icon-privacy { background-position: -135px 0; } .csm-two-column-with-security .security-unit .icon-software-security { background-position: -205px 0; } .csm-two-column-with-security .security-unit .icon-employee-access { background-position: -273px 0; } .csm-two-column-with-security .security-unit h3{ display: inline-block; font-size: 32px; margin: 0; padding: 0 0 20px 10px; color: #585858; vertical-align: middle; font-family: proxima-semibold,Helvetica, Arial, sans-serif; } .thank-you-content .page-center { padding: 50px 20px; } .csm-banner-with-video { background-size: cover; display: block; width: 100%; text-align: center; background-color: #000; background-repeat: no-repeat; } .csm-banner-with-video .page-center { padding: 85px 40px 0; } .csm-banner-with-video h1 { color: #fff; font-size: 42px; font-family: proxima-semibold,Helvetica, Arial, sans-serif; letter-spacing: -0.5px; } .csm-banner-with-video .video-wrap { max-width: 988px; margin: 25px auto 0 auto; position: relative; } .csm-banner-with-video .image-box .content { -webkit-transition: all 0.5s ease; transition: all 0.5s ease; max-width: 825px; width: 100%; } .csm-banner-with-video .image-box .video-play-btn { position: absolute; top: 50%; left: 50%; margin: auto; cursor: pointer; z-index: 4; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1); } .thank-you-content .quide-btn { text-decoration: none; display: inline-block; padding: 15px; margin: 0; color: #585858; font-size: 18px; border: 1px solid #585858; border-radius: 4px 4px; cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .thank-you-content .bottom-section { display: block; width: 100%; padding-top: 45px; } .thank-you-content .bottom-section p.txt { display: inline-block; color: #585858; font-size: 22px; padding: 35px 40px 5px 40px; margin: 0; opacity: 0.5; border-top: 2px solid #eee; line-height: 26px; } .thank-you-content .bottom-section h3 { display: block; color: #585858; font-size: 22px; padding: 10px 0 30px 0; margin: 0; font-weight: 600; line-height: 26px; } .thank-you-content .bottom-section .phone-wrap { display: block; width: 100%; text-align: center; } .thank-you-content .bottom-section a.phone-unit { text-decoration: none; display: inline-block; font-size: 16px; color: #585858; opacity: 0.5; width: 135px; margin: 0 10px 15px 10px; padding: 6px 0 10px; border: 1px solid #ccc; border-radius: 5px 5px; -webkit-box-shadow: inset 1px 1px 3px #ddd; box-shadow: inset 1px 1px 3px #ddd; cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .thank-you-content .bottom-section .icon{ display: inline-block; width: 29px; height: 33px; margin-right: 10px; vertical-align: sub; } .thank-you-content { width: 100%; text-align: center; } .thank-you-content .quide-btn:hover { background: #4c4c4c; border-color: #4c4c4c; color: #fff; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; } .why-flock-capterra.hs-flock-3-page div#header { background: transparent; } .why-flock-capterra.hs-flock-3-page div#header.fixedNav { background: #fff; } @media (max-width: 1125px) and (min-width: 1000px){ .hs-home-main.hs-home-layout.hipchat-migration #main-area { padding-top: 97px; min-height: 760px; padding-bottom: 180px; } } @media (max-width: 1132px) and (min-width: 1121px){ .csm-paricing-table .plan-wrap .plan-box { float: none !important; width: 33%; margin: 0px -3px; } .csm-paricing-table .plan-wrap { text-align: center; } } @media (max-width: 1120px){ .csm-paricing-table .plan-wrap { margin-left: auto; margin-right: auto; max-width: 400px; } .csm-paricing-table .plan-wrap .plan-box { max-width: 100% !important; } } @media (max-width: 999px) and (min-width: 768px){ .hs-indexe-f .api-key-slider .slick-track { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100% !important; padding-left: 5px; padding-right: 5px; transform: none !important; } } @media (max-width: 1000px) and (min-width: 600px){ .csm-feature-with-top-icon .feature-unit{ display: inline-block; width: 33%; } } @media (max-width: 999px) { .mobile--disable { display: none; } .custom-banner-section.csm-pricing-banner .page-center { padding-top: 124px; } .custom-banner-section.csm-pricing-banner h1 { display: block; font-size: 40px; margin: 0; padding: 0; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.3; font-weight: normal; letter-spacing: -2.5px; color: #fff; } .csm-pricing-sec3 .csm-two-column-equal > div { text-align: left; padding: 0px; margin-bottom: 0px; } .csm-paricing-table .plan-wrap a.getstarted-btn { display: inline-block; } } @media (max-width: 700px){ .table-pricing th.th-title2, .table-pricing th.th-title3, .table-pricing th.th-title4 { width: 28%; } .table-pricing th.th-title1 { width: 32%; } .table-pricing th { font-size: 14px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; vertical-align: top; } .table-pricing td { font-size: 14px; } } @media (max-width: 420px){ .table-pricing td.grey-bg .tool-tip-content { left: -120px; } .table-pricing td.grey-bg .tool-tip-content:before { left: 132px; } } @media (min-width: 1000px){ .thank-you-content .bottom-section a.phone-unit { margin: 0 10px; } .thank-you-content .quide-btn { padding: 15px 30px; font-size: 22px; } .csm-banner-with-video{ min-height: 600px; } .csm-banner-with-video .video-wrap{ margin: 25px auto 0 auto; } .csm-banner-with-video .video-wrap .image-box{ display: inline-block; position: relative; } .thank-you-content .page-center { padding: 80px 20px; } .csm-banner-with-video .page-center{ padding: 120px 20px 0 20px; } .csm-banner-with-video .video-wrap .image-box:after { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 1s; -webkit-transition: all 1s; z-index: 1; background: rgba(0,0,0,0.01); } .csm-banner-with-video .video-wrap .image-box:hover:after { background: rgba(0,0,0,0.3); cursor: pointer; } .csm-two-column-with-security .security-unit .title-box { width: 100%; margin-bottom: 30px; } .csm-two-column-with-security .security-unit h3{ max-width: 70%; font-size: 36px; padding: 0 0 0 20px; } .csm-two-column-with-security .security-unit .icon { margin-bottom: 0; } .custom-banner-section.csm-security-banner .banner-content h1{ font-size: 56px; padding: 0 0 20px 0; font-family: proxima-semibold,Helvetica, Arial, sans-serif; letter-spacing: -0.5px; } .custom-banner-section.csm-security-banner .banner-content p{ font-size: 28px; line-height: 1.2; font-weight: 400; letter-spacing: -0.7px; } .custom-banner-section.csm-security-banner .banner-content{ width: 900px; padding: 0; } body.csm-pricing-page, .csm-security-page, .csm-thank-page{ padding-top: 0px !important; } .csm-feature-with-top-icon .feature-unit{ display: inline-block; width: 33%; } .csm-pricing-sec7 .drivezy-videos .params-unit .video-play-btn{ max-width: 159px; } .csm-pricing-sec7 .drivezy-videos{ margin-bottom: 120px; } .csm-pricing-sec7 .drivezy-videos .params-unit{ min-width: 600px; min-height: 400px; } .csm-pricing-sec7 h4{ display: inline-block; font-size: 22px; margin: 0 0 15px; line-height: 40px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .csm-pricing-sec7 h2 { font-size: 42px; margin-bottom: 15px; } .csm-pricing-sec6 .bottom-get-started p{ font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .compliant-block{ margin-top: 120px; } .compliant-block .soc-img { float: left; width: 70px; margin-top: 10px; } .compliant-block .content { float: right; width: 85%; padding-left: 30px; padding-top: 0; } .csm-paricing-table { padding: 120px 10px 120px 10px; } .csm-paricing-table .plan-wrap span.txt.lifetime-txt { min-height: 50px; } .csm-paricing-table .plan-wrap a.getstarted-btn{ display: inline-block; } .csm-pricing-sec2, .csm-pricing-sec3, .csm-pricing-sec4, .csm-pricing-sec5, .csm-pricing-sec7{ padding: 120px 10px 120px 10px; } .csm-pricing-sec7{ padding-bottom: 60px; } .table-pricing .table-title { padding: 15px 0 15px 30px; } .table-pricing td.td-first { font-size: 18px; } .table-pricing td { padding: 18px 15px 18px 30px; } .table-pricing td.td-last { padding-left: 15px; } .table-pricing td.last-cell { padding-bottom: 40px; } .table-pricing td.td-last { padding-left: 15px; } .table-pricing td.td-first { font-size: 18px; } .table-pricing .tool-tip .tool-tip-content { width: 235px; border-top: none; border-left: 5px solid #0abe51; bottom: 50%; -webkit-transform: translate(0, 50%); -ms-transform: translate(0, 50%); transform: translate(0, 50%); margin: 0; left: 34px; font-size: 18px; } .table-pricing .tool-tip .tool-tip-content:before { border-color: transparent #0abe51 transparent transparent; left: -34px; top: 50%; margin-top: -15px; } .table-pricing .plan-features .getstarted-btn { display: inline-block; } .csm-pricing-sec3 .csm-two-column-equal .left-block h6{ font-size: 18px; line-height: 1.3; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .csm-pricing-sec3 .csm-two-column-equal .left-block p { font-size: 18px; line-height: 1.3; } .custom-banner-section.csm-security-banner{ min-height: 600px; background-repeat: no-repeat; background-position: 0px 0px; background-size: 100% 100%; } .csm-two-column-with-security .page-center{ padding: 80px 0; } .csm-two-column-with-security .unit-row{ padding-bottom: 60px; } .csm-two-column-with-security .unit-row:last-child { padding-bottom: 0px; } .csm-two-column-with-security .unit-row .security-unit{ width: 50%; padding-bottom: 0px; } .csm-two-column-with-security .unit-row .security-unit.unit1{ padding-right: 40px; } .csm-two-column-with-security .unit-row .security-unit.unit2{ padding-left: 40px; } .csm-two-column-with-security .unit-row .security-unit h4 { font-size: 28px; padding: 0 0 15px 0; } } @media (min-width: 1600px){ .custom-banner-section.csm-security-banner{ background-size: cover; } } /* ===== Mail ======= */ .mail .wrapper { margin: 0 auto; max-width: 1100px; padding: 85px 40px 0; zoom: 1; } .mail { font-family: 'circular-stdbook', Helvetica, Arial, sans-serif; color: #112950; padding: 0; } .mail #content { padding-top: 49px } .mail h1 { font-size: 32px; line-height: 40px; margin-bottom: 10px; font-family: 'circular-stdbold', Helvetica, Arial, sans-serif; letter-spacing: normal } .mail h2 { font-size: 26px; margin: 0; max-width: 800px; font-family: 'circular-stdbold', Helvetica, Arial, sans-serif; letter-spacing: normal } .mail h3 { font-size: 22px; margin: 0; font-family: 'circular-stdbold',Helvetica,Arial,sans-serif; letter-spacing: normal; font-weight: 600; } .mail h4 { font-size: 16px; line-height: 24px; margin: 0 0 22px; letter-spacing: normal; color: #112950; font-family: 'circular-stdbook', Helvetica, Arial, sans-serif } .mail h5 { font-size: 14px; line-height: 24px; color: #112950; font-family: 'circular-stdbook', Helvetica, Arial, sans-serif } .mail p { font-size: 14px; line-height: 24px; margin: 0; letter-spacing: normal; color: #112950; font-family: 'circular-stdbook', Helvetica, Arial, sans-serif } .mail .wrapper { max-width: 1000px; padding: 40px 20px } .mail .heading-holder { margin: 0 0 40px } .mail .heading-holder h2 { max-width: 800px } .mail .font-color-black { color: #000000 } .mail .font-color-blue { color: #216ff3 } .mail .font-color-yellow { color: #feb600 } .mail .font-color-red { color: #e3473a } .mail .font-color-dark-blue { color: #112950 } .mail .font-color-purple { color: #4d3185 } .mail .btn { display: inline-block; font-size: 14px; line-height: normal; padding: 10px 25px; border-radius: 25px; font-weight: 400 } .mail .rqt-demo-btn { background-color: #216ff3; color: #ffffff } .mail .ghost-video-btn { border: 1px solid #216ff3; color: #216ff3; display: none } .mail .col-row { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin-bottom: 0 } .mail .coming-content { margin-top: 40px } .mail .coming-content .coming-soon { margin-bottom: 14px; font-size: 12px; text-transform: uppercase; color: rgba(17, 41, 80, 0.5); display: block; letter-spacing: 1px } .mail .coming-content .c-s-list { padding-left: 10px } .mail .coming-content .c-s-list li { font-size: 14px; line-height: 24px; color: rgba(17, 41, 80, 0.5); position: relative; padding-left: 25px } .mail .coming-content .c-s-list li:after { content: ""; position: absolute; width: 6px; height: 6px; top: 50%; left: 0; background: rgba(17, 41, 80, 0.5); -webkit-transform: translateY(-50%); transform: translateY(-50%); border-radius: 50% } .mail section .unit { margin-bottom: 60px } .mail section .unit:last-child { margin-bottom: 0 } .mail .f-m-main .main-heading { margin-bottom: 60px; display: -webkit-box; display: -ms-flexbox; display: flex } .mail .f-m-main .main-heading .subsection-left { width: 100%; text-align: center; max-width: 350px; margin: auto } .mail .f-m-main .main-heading .subsection-left h5 { max-width: 550px } .mail .f-m-main .main-heading .subsection-right { width: 43.75%; display: none } .mail .f-m-main .main-heading .subsection-right .image-holder { margin-right: -40px; margin-left: -20px } .mail .f-m-main .section-img { position: relative } .mail .f-m-main .section-img .video-thumbnail { -webkit-box-shadow: 0 2px 17px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 17px 5px rgba(0, 0, 0, 0.1); border-radius: 5px } .mail .f-m-main .section-img .video-play-btn { position: absolute; left: 50%; top: 50%; width: 50px; height: 50px; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: -webkit-transform 0.7s ease-in-out; transition: -webkit-transform 0.7s ease-in-out; transition: transform 0.7s ease-in-out; transition: transform 0.7s ease-in-out, -webkit-transform 0.7s ease-in-out; z-index: 2; cursor: pointer } .mail .f-m-main .section-img:after { content: ""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; background: transparent; border-radius: 5px; -webkit-transition: background 0.7s ease-in-out; transition: background 0.7s ease-in-out; z-index: 1 } .mail .f-m-main .section-img:hover .video-play-btn { -webkit-transform: translate(-50%, -50%) scale(1.1); transform: translate(-50%, -50%) scale(1.1); -webkit-transition: -webkit-transform 0.7s ease-in-out; transition: -webkit-transform 0.7s ease-in-out; transition: transform 0.7s ease-in-out; transition: transform 0.7s ease-in-out, -webkit-transform 0.7s ease-in-out } .mail .f-m-main .section-img:hover:after { background: rgba(0, 0, 0, 0.2); -webkit-transition: background 0.7s ease-in-out; transition: background 0.7s ease-in-out } .mail .f-m-main h1 { margin-bottom: 10px } .mail .f-m-main h5 { margin-bottom: 22px } .mail .f-m-mail h2, .mail .f-m-mail h3 { color: #216ff3 } .mail .f-m-mail .heading-holder h2 { max-width: 850px } .mail .f-m-mail .feature-list1 .row { margin-bottom: 30px } .mail .f-m-mail .feature-list1 .row:last-child { margin-bottom: 0 } .mail .f-m-mail .feature-list1 .image-holder { margin-left: -20px; margin-right: -20px; position: relative } .mail .f-m-mail .feature-list1 .backdrop:after { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/search-dots-4b5f0fdc.png) no-repeat; background-size: contain; position: absolute; width: 45%; height: 47%; right: -10%; top: -8%; z-index: -1 } .mail .f-m-mail .feature-list2 .image-holder { margin-bottom: 30px } .mail .f-m-mail .feature-list2 .text-holder { text-align: center; max-width: 800px; margin: auto } .mail .f-m-mail .feature-list3 .col-row .row { margin-bottom: 60px } .mail .f-m-mail .feature-list3 .col-row .row:last-child { margin-bottom: 0 } .mail .f-m-mail .feature-list3 .col-row .row .list-content { margin-bottom: 60px } .mail .f-m-mail .feature-list3 .col-row .row .list-content:last-child { margin-bottom: 0 } .mail .f-m-mail .feature-list3 .image-holder { margin-bottom: 30px; margin-left: -20px; margin-right: -20px; position: relative } .mail .f-m-calender h2, .mail .f-m-calender h3 { color: #feb600 } .mail .f-m-calender .feature-list1 img { -webkit-box-shadow: 0 2px 17px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 17px 5px rgba(0, 0, 0, 0.1); border-radius: 5px } .mail .f-m-calender .feature-list2 .col-row .row { margin-bottom: 60px } .mail .f-m-calender .feature-list2 .col-row .row:last-child { margin-bottom: 0 } .mail .f-m-conversation h2, .mail .f-m-conversation h3 { color: #e3473a } .mail .f-m-conversation .heading-holder h2 { max-width: 850px } .mail .f-m-conversation .feature-list1 .col-row .row, .mail .f-m-conversation .feature-list2 .col-row .row { margin-bottom: 30px } .mail .f-m-conversation .feature-list1 .col-row .row .image-holder img, .mail .f-m-conversation .feature-list2 .col-row .row .image-holder img { -webkit-box-shadow: 0 2px 17px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 17px 5px rgba(0, 0, 0, 0.1); border-radius: 5px } .mail .f-m-conversation .background-card { position: relative; width: auto; height: auto } .mail .f-m-conversation .background-card:after { content: ""; position: absolute; left: 25px; right: 25px; top: 3px; bottom: 3px; background: #e7e7e7; z-index: -2; display: block; border-radius: 6px; -webkit-transform: rotate(6deg) translateY(25px); transform: rotate(6deg) translateY(25px) } .mail .f-m-conversation .background-card:before { content: ""; position: absolute; left: 15px; right: 15px; top: 3px; bottom: 3px; background: #cecece; z-index: -1; display: block; border-radius: 6px; -webkit-transform: rotate(4deg) translateY(16px); transform: rotate(4deg) translateY(16px) } .mail .f-m-conversation .unit { margin-bottom: 90px } .mail .f-m-conversation .feature-list3 .image-holder { width: calc(100% - 10.623%); margin: 0 auto 50px; position: relative } .mail .f-m-conversation .feature-list3 .image-holder img { -webkit-box-shadow: 0 2px 17px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 2px 17px 5px rgba(0, 0, 0, 0.1); border-radius: 5px } .mail .f-m-conversation .feature-list3 .image-holder:before { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/female-caller-5a25f295.png) no-repeat; background-size: cover; background-position: center; width: 23.4%; height: 47.2%; position: absolute; bottom: -17%; left: -8% } .mail .f-m-conversation .feature-list3 .image-holder:after { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/male-caller-6cdcad94.png) no-repeat; background-size: cover; background-position: center; width: 23.4%; height: 47.2%; position: absolute; top: -17%; right: -8% } .mail .f-m-conversation .feature-list3 .text-holder { max-width: 500px; margin: auto; text-align: center } .mail .f-m-conversation .image-width { max-width: 330px } .mail .f-m-contacts h2, .mail .f-m-contacts h3 { color: #4d3185 } .mail .f-m-contacts .image-holder { margin-bottom: 30px; margin-left: -5px; margin-right: -5px } .mail .f-m-contacts .text-holder { max-width: 800px; margin: auto; text-align: center } .mail .f-m-device h2 { color: #112950 } .mail .f-m-device .heading-holder { text-align: center; margin-bottom: 10px } .mail .f-m-device .heading-holder h2 { max-width: 100% } .mail .f-m-device .text-holder { text-align: center; margin-left: auto; margin-right: auto; margin-bottom: 20px; max-width: 860px } .mail .f-m-device .os-icons { max-width: 200px; margin: auto; margin-bottom: 20px } .mail .f-m-benefit h2 { color: #112950 } .mail .f-m-benefit .heading-holder { margin-bottom: 10px; text-align: center } .mail .f-m-benefit .heading-holder h2 { margin: auto } .mail .f-m-benefit .text-holder { text-align: center; margin-left: auto; margin-right: auto; margin-bottom: 30px; max-width: 860px } .mail .f-m-benefit .list-holder h5 { margin-bottom: 14px; text-align: center } .mail .f-m-better-together { background: #216ff3 } .mail .f-m-better-together h2, .mail .f-m-better-together p { color: #ffffff } .mail .f-m-better-together .heading-holder { margin-bottom: 20px } .mail .f-m-better-together .heading-holder h2 { max-width: 100% } .mail .f-m-better-together .list-holder { max-width: 307px } .mail .f-m-better-together .list-holder li p { position: relative; font-size: 16px; padding-left: 20px; line-height: 30px } .mail .f-m-better-together .list-holder li p:before { content: ""; position: absolute; width: 6px; height: 6px; background: #ffffff; border-radius: 50%; top: 13px; left: 0 } .mail .f-m-action h3 { margin-bottom: 10px; color: #112950 } .mail .f-m-action p { margin-bottom: 20px } .mail .f-m-action .text-holder { max-width: 300px } .mail .f-m-action .wrapper { position: relative } .mail .f-m-footer { background: #112950 } .mail .f-m-footer .wrapper { padding-top: 14px; padding-bottom: 14px } .mail .f-m-footer p { font-size: 10px; color: #ffffff; line-height: normal } .mail .f-m-footer p a { font-size: 10px; color: #ffffff } .mail .image-holder { position: relative } .mail .backdrop-rectangle-rotate:after { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/search-dots-4b5f0fdc.png) no-repeat; background-size: contain; position: absolute; width: 42%; height: 47%; left: -11%; top: -8%; z-index: -1; -webkit-transform: rotate(259deg); transform: rotate(259deg) } .mail .backdrop-circle-blue:after { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/reminders-circle-e45306ef.png) no-repeat; background-size: contain; position: absolute; width: 15%; height: 15%; right: 5%; top: -6%; z-index: -1 } .mail .backdrop-line .after { content: ""; background-repeat: no-repeat; background-size: contain; position: absolute; width: 40%; height: 40%; right: -14%; top: -5%; z-index: 0 } .mail .backdrop-circle-yellow:after { content: ""; background: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/video-circle-681c094f.png") no-repeat; background-size: contain; position: absolute; width: 15.11%; height: 16.14%; left: -7%; top: -8%; z-index: -1 } .mail .backdrop-circle-purple:after { content: ""; background: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/contacts-circle-6f80ab37.png") no-repeat; background-size: contain; position: absolute; width: 8.1%; height: 13.1%; left: 5%; bottom: -1%; z-index: -1 } .mail .backdrop-sqiggles:before { content: ""; background: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/contacts-sqiggles-e6920ff8.png") no-repeat; background-size: contain; position: absolute; width: 25%; height: 34%; right: -5%; top: -12%; z-index: -1 } .mail .backdrop-calendar-man:after { content: ""; background: url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/calendar-man-38d31b78.png") no-repeat; background-size: contain; position: absolute; width: 23.96%; height: 34%; right: 2%; top: -15.7%; z-index: 0 } .mail .body-container, .mail .section { padding: 0; } .mail-header { color: #fff; border: none; width: 100% !important; z-index: 1000; position: fixed; left: 0; top: 0; -webkit-transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); transition: all 0.3s cubic-bezier(0, 0, 0.3, 1); background-image: none; background-color: #fff; padding: 0; } .mail .mail-logo img { vertical-align: middle; float: left; } .mail-header .page-center { max-width: 1000px !important; padding: 25px 20px; } .mail .mail-logo p { color: #585858; font-size: 13px; text-align: left; margin-left: 10px; position: relative; padding-left: 10px; float: left; line-height: 1.42857; } .mail .mail-logo p:after { content: ""; position: absolute; width: 1px; height: 100%; background: #585858; left: 0; top: 0; bottom: 0; } .scrolled .mail-header .page-center { padding: 12px 20px 11px !important; } .scrolled .mail-header { background: #fff; -webkit-transition: all 0.5s cubic-bezier(0, 0, 0.3, 1); transition: all 0.5s cubic-bezier(0, 0, 0.3, 1); top: 0; -webkit-box-shadow: 0 1px 4px 0 rgba(0,0,0,0.2); box-shadow: ; } .scrolled.mail .mail-logo img { height: 30px; -webkit-transition: height 0.5s; transition: height 0.5s; margin-top: 7px; } .mail-logo .hs_cos_wrapper_type_rich_text { display: block; } .mail-logo .hs_cos_wrapper_type_rich_text:after { content: ''; display: block; clear: both; } .mail-logo { width: auto !important; float: left !important; margin: 0 !important; } .mail-header-cta { float: right !important; width: auto !important; margin: 0 !important; } .mail-header-cta a.btn { display: none; border: 1px solid #216ff3; color: #216ff3; margin: 0; } .scrolled .mail-header-cta a.btn { display: inline-block; } .mail .feature-list3 .list-content:not(:first-child) .backdrop-rectangle-rotate:after { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/read-lines-8d0ea786.png) no-repeat; background-size: contain; position: absolute; width: 40%; height: 40%; right: -14%; top: -5%; z-index: 0; left: auto; transform: none; } .text-holder h6 { margin-bottom: 14px; font-size: 12px; text-transform: uppercase; color: rgba(17,41,80,0.5); display: block; letter-spacing: 1px; margin-top: 40px; font-family: inherit; } .mail .c-s-list li { font-size: 14px; line-height: 24px; color: rgba(17,41,80,0.5); position: relative; padding-left: 25px; } .mail .c-s-list li:after { content: ""; position: absolute; width: 6px; height: 6px; top: 50%; left: 0; background: rgba(17,41,80,0.5); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border-radius: 50%; } .mail .f-m-conversation .feature-list2 .background-card:after { transform: none; content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/video-circle-681c094f.png) no-repeat; background-size: contain; position: absolute; width: 15.11%; height: 16.14%; left: -7%; top: -8%; z-index: -1; } .mail .f-m-conversation .feature-list2 .background-card:before { display:none; } .mail-footer .page-center { max-width: 1000px !important; padding: 40px 20px !important; } .mail .mail-copyright p { font-size: 10px ; color: #ffffff; line-height: normal; line-height: normal; } .mail .mail-copyright p a { color:#fff; } .mail-footer { background: #112950; line-height: 1.42857 ; } .mail .col-row h3 { font-weight: 600; line-height: 1.5; } .custom-indexb--wrapper.two-col-slider .csm-slider-with-thumbnail-content h3 { font-size: 28px; color: #585858; line-height: 40px; margin: 0 0 20px; font-weight: 400; } .custom-indexb--wrapper.two-col-slider .csm-slider-with-thumbnail-content .custom-slider-subheading { margin: 0 0 40px; } .custom-indexb--wrapper.two-col-slider .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-slide p:first-child { padding: 0 0 4px; } .custom-indexb--wrapper.two-col-slider .csm-slider-with-thumbnail-content .api-img-slider { margin-left: 0; left: 0; } .custom-indexb--wrapper.two-col-slider .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-slide.slick-current p:first-child { color: #0abe51; } .hs-flock-vs-microsoft-layout .custom-Signup-wrapper .bottom-get-started .g-s-download, .hs-flock-vs-microsoft-layout .custom-Signup-wrapper .bottom-get-started .g-s-download a { color: #585858; } .banner-with-button .banner-bottom-image { margin-top: -135px; } .banner-with-button .banner-content > *:not(img) { position: relative; z-index: 1; } .hs-flock-vs-microsoft-layout .custom-banner-section.banner-with-button .page-center { padding-top: 62px !important; } @media (min-width: 400px) { .mail .f-m-mail .feature-list1 .row { margin-bottom: 0 } .mail .f-m-mail .feature-list1 .image-width { max-width: 354px } .mail .f-m-mail .feature-list3 .image-width, .mail .f-m-mail .feature-list3 .image-width2 { max-width: 374px } } @media (min-width: 500px) { .mail .f-m-better-together .heading-holder { text-align: center } .mail .f-m-better-together .list-holder { margin: auto } } @media (min-width: 550px) { .mail .f-m-action .wrapper .after { position: absolute; display: inline-block; width: 330px; height: 173px; background-repeat: no-repeat; background-size: 100% 100%; bottom: 0; z-index: 2; right: 0 } } @media (min-width: 600px) { .mail .col-row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } } @media (min-width: 700px) { .mail .f-m-action .wrapper .after { width: 370px; height: 194px; } .mail-copyright p { font-size: 14px !important; } .mail-footer .page-center { padding: 24px 20px 40px !important; } .mail .c-s-list li:after { width: 8px; height: 8px; } .mail .c-s-list li { font-size: 18px; line-height: 26px; position: relative; padding-left: 25px; } .mail .c-s-list { padding-left: 10px; } .text-holder h6 { margin-top: 60px; font-size: 14px; margin-bottom: 10px; } .mail #content { padding-top: 69px } .mail h1 { font-size: 56px; line-height: 64px; margin: 0 0 30px } .mail h2 { font-size: 50px; line-height: normal } .mail h3 { font-size: 28px; line-height: normal; margin: 0 } .mail h4 { font-size: 28px; line-height: normal; margin: 0 0 20px } .mail h5 { font-size: 22px; line-height: 36px } .mail p { font-size: 18px; line-height: 29px } .mail .heading-holder { margin: 0 0 100px } .mail .wrapper { padding: 80px 20px } .mail .btn { font-size: 18px; margin-right: 10px } .mail .rqt-demo-btn { padding: 14px 30px } .mail .ghost-video-btn { display: inline-block; padding: 13px 30px } .mail section .unit { margin-bottom: 150px } .mail .col-row { margin-left: -50px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row } .mail .col-row .row { width: 50%; margin-bottom: 0; padding-left: 50px } .mail .coming-content { margin-top: 60px } .mail .coming-content .coming-soon { margin-bottom: 10px; font-size: 14px } .mail .coming-content .c-s-list { padding-left: 10px } .mail .coming-content .c-s-list li { font-size: 18px; line-height: 26px; position: relative; padding-left: 25px } .mail .coming-content .c-s-list li:after { width: 8px; height: 8px } .mail .f-m-main .wrapper { padding-top: 60px } .mail .f-m-main .main-heading { margin-bottom: 100px } .mail .f-m-main .main-heading .subsection-left { max-width: 600px } .mail .f-m-main h1 { margin-bottom: 30px } .mail .f-m-main h5 { margin-bottom: 60px } .mail .f-m-main .section-img .video-play-btn { width: 70px; height: 70px } .mail .f-m-mail .feature-list1 .col-row { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse } .mail .f-m-mail .feature-list1 .image-holder { margin: 0 } .mail .f-m-mail .feature-list1 .image-width { margin-left: auto; margin-right: auto; margin-top: -20px } .mail .f-m-mail .feature-list2 .image-holder { margin-bottom: 50px } .mail .f-m-mail .feature-list3 .col-row .row { margin-bottom: 0 } .mail .f-m-mail .feature-list3 .col-row .row .list-content { margin-bottom: 150px } .mail .f-m-mail .feature-list3 .image-holder { margin: 0 auto 50px } .mail .f-m-mail .feature-list3 .image-width { margin-left: auto; margin-right: auto; margin-top: -20px } .mail .f-m-mail .feature-list3 .image-width2 { margin-left: auto; margin-right: auto; margin-top: -7px } .mail .f-m-calender .feature-list1 { margin-bottom: 50px } .mail .f-m-calender .feature-list2 .col-row .row { margin-bottom: 0 } .mail .f-m-conversation .background-card:after { -webkit-transform: rotate(6deg) translateY(30px); transform: rotate(6deg) translateY(30px) } .mail .f-m-conversation .background-card:before { -webkit-transform: rotate(4deg) translateY(20px); transform: rotate(4deg) translateY(20px) } .mail .f-m-conversation .feature-list2 .col-row { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse } .mail .f-m-conversation .unit { margin-bottom: 190px } .mail .f-m-conversation .feature-list3 .image-holder { margin: 0 auto 110px } .mail .f-m-conversation .image-width { max-width: none } .mail .f-m-contacts .image-holder { margin-bottom: 50px; margin-left: -20px; margin-right: -20px } .mail .f-m-better-together .wrapper { padding-top: 50px; padding-bottom: 50px } .mail .f-m-better-together .heading-holder { margin-bottom: 30px } .mail .f-m-better-together .list-holder { max-width: 382px; margin: auto } .mail .f-m-better-together .list-holder li p { font-size: 22px; padding-left: 30px; line-height: 40px } .mail .f-m-better-together .list-holder li p:before { width: 8px; height: 8px; top: 18px } .mail .f-m-device .heading-holder { margin-bottom: 20px } .mail .f-m-device .text-holder { margin-bottom: 50px } .mail .f-m-device .os-icons { max-width: 425px; margin-bottom: 45px } .mail .f-m-benefit .wrapper { padding-bottom: 150px } .mail .f-m-benefit .heading-holder { margin-bottom: 20px } .mail .f-m-benefit .text-holder { margin-bottom: 50px } .mail .f-m-action .wrapper { padding-top: 150px; padding-bottom: 60px } .mail .f-m-action .wrapper:after { width: 370px; height: 194px } .mail .f-m-action .text-holder { max-width: 500px } .mail .f-m-action p { margin-bottom: 25px } .mail .f-m-footer .wrapper { padding-top: 24px; padding-bottom: 40px } .mail .f-m-footer p { font-size: 14px } .mail .f-m-footer p a { font-size: 14px } } @media (min-width: 900px) { .mail .f-m-main .main-heading .subsection-left { text-align: left; width: 72.916%; max-width: none } .mail .f-m-main .main-heading .subsection-right { display: block } .mail .f-m-benefit .list-wrapper { position: relative } .mail .f-m-benefit .list-wrapper .before { position: absolute; background-repeat: no-repeat; background-size: contain; left: 0; top: 0; width: 165px; height: 242px } .mail .f-m-benefit .list-wrapper .after { position: absolute; background-repeat: no-repeat; background-size: contain; right: 0; top: 0; width: 173px; height: 295px } } @media (min-width: 950px) { .mail .f-m-better-together .list-holder { max-width: 940px; margin: auto; overflow: hidden; text-align: center } .mail .f-m-better-together .list-holder li { display: inline-block; padding-left: 45px } .mail .f-m-better-together .list-holder li:first-child { padding-left: 0px } .mail .f-m-better-together .list-holder li p { padding-left: 30px } .mail .f-m-better-together .list-holder li p:before { width: 8px; height: 8px } } @media (min-width: 1000px) { .hs-flock-vs-slack-row3 .cm-power-features .page-center { padding: 75px 40px; } .custom-indexb--wrapper.two-col-slider .csm-slider-with-thumbnail-content .api-img-slider { margin-left: 0; left: -130px; } .custom-indexb--wrapper.two-col-slider .csm-slider-with-thumbnail-content .custom-slider-subheading { margin: 0 0 80px; } .custom-indexb--wrapper.two-col-slider .csm-slider-with-thumbnail-content h3 { font-size: 42px; line-height: 50px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .mail .f-m-action .wrapper .after { width: 421px; height: 222px; } .mail .mail-logo p { font-size: 15px; padding-bottom: 3px; padding-left: 15px; margin-left: 15px; display: inline-block; vertical-align: middle; } .mail .col-row { margin-left: -150px } .mail .col-row .row { padding-left: 150px } .mail .f-m-conversation .feature-list1 .image-holder { margin-right: -105px } .mail .f-m-conversation .background-card:after { -webkit-transform: rotate(6deg) translateY(40px); transform: rotate(6deg) translateY(40px) } .mail .f-m-conversation .background-card:before { -webkit-transform: rotate(4deg) translateY(27px); transform: rotate(4deg) translateY(27px) } .mail .f-m-conversation .feature-list2 .image-holder { margin-left: -65px } .mail .f-m-action .wrapper:after { width: 421px; height: 222px } } @media (max-width:999px) { .hs-flock-vs-microsoft-layout .custom-banner-section.banner-with-button .page-center { padding-top: 16px !important; } .hs-flock-vs-microsoft-layout .home-page .block-content .full-section { padding-bottom: 140px; } .banner-with-button .banner-bottom-image { margin: 0; } .mail .mail-logo img { width: 89px; float: left; -webkit-transition: height 0.3s ease-in-out; transition: height 0.3s ease-in-out; } .mail-header .page-center { padding: 15px 20px !important; } .scrolled.mail .mail-logo img {margin: 0;} .mail-header-cta a.btn { padding: 8px 20px; } .scrolled .mail-header .page-center { padding: 12px 20px 8px !important; } .hs-indexe-layout.hipchat-migration .home-page .block-content .right-section ._get-started { padding-bottom: 100px; } .case-study-videos .page-center.wrapper { padding-left: 10px !important; padding-right: 10px !important; } .case-study-videos .video-block p { margin-bottom: 20px; } .hs-indexe-layout .custom-slider-subheading .demoTeamLink.js-demo-team-link { display: none; } .two-col-slider .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide.slick-current { background: transparent; } .two-col-slider .csm-slider-with-thumbnail-content .slick-slide { margin: 0 10px 10px; background: transparent; } .custom-indexb--wrapper.two-col-slider .csm-slider-with-thumbnail-content.api-block .api-key-slider .slick-slide.slick-current p:first-child { color: #585858; } .hs-flock-vs-microsoft-layout .flock-vs-microsoftbnr-area form._g-s-form { display: none; } .hs-flock-vs-microsoft-layout .flock-vs-microsoftbnr-area .header-wrap p._g-s-label { line-height: 1.42857; } .flock-vs-microsoftbnr-area .header-wrap h1 { margin: 0 0 30px; } .flock-vs-microsoftbnr-area { min-height: 1px; } .hs-microsoft-hdr.hs-flock-hdr .fixed-product-keys { display: none; } .widget-span.custom-footer-copyright-signup { float: left !important; } .widget-span.custom-footer-menu-signup { width: auto !important; float: right !important; } } @media (max-width:699px) { .scrolled .mail-header .page-center { padding: 12px 20px 13px !important; } .scrolled.mail .mail-logo p { display: none; } ul.c-s-list { padding-left: 10px; } .mail-footer .page-center { padding: 14px 20px !important; } } .container-fluid #mail-header .row-fluid .page-center { padding: 10px 20px; } .custom-home-top-logo { width: auto !important; float: none !important; } .custom-home-find-more { width: auto !important; margin: 0 !important; float: none !important; } .mail-top-banner>div>div { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-left: -15px; } .custom-home-top-logo{ display:none !important; } .custom-home-top-logo p { padding-left: 15px; font-size: 22px; line-height: 34px; color: #585858; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; font-size: 13px; line-height: 14px; display: none; } #mail-header img { width: 68px !important; margin-left: 11px; display: inline-block; vertical-align: middle; } .custom-home-find-more p { color: #585858; font-family: 'proxima-regular', 'Helvetica', 'Arial', sans-serif; font-size: 13px; line-height: 14px; padding-left: 21px; margin: 0; display: inline-block; } .mail-top-banner { padding: 0 0 0 16px; } .custom-home-find-more { position: relative; } .custom-home-find-more:before { height: 30px; width: 1px; background: #585858; margin-left: 10px; border: none; content: ""; display: inline-block; position: absolute; top: 3px; } .custom-home-find-more a { display: inline-block; padding: 5px; text-transform: uppercase; border: 1px solid #585858; border-radius: 5px; font-size: 12px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; margin-left: 11px; } @media (min-width: 700px){ .custom-home-find-more a { font-size: 13px; padding: 8px; } .custom-home-find-more p{ font-size: 15px; line-height: 16px; } .mail-top-banner>div>div { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .custom-home-top-logo{ display:block !important; } .container-fluid #mail-header .row-fluid .page-center { padding: 11px 20px 9px; } .custom-home-top-logo p{ font-size: 15px; line-height: 16px; display: block; display: inline-block; margin: 0; } } @media (max-width: 699px){ .mail-top-banner>div>div{ margin-left: 0; } .mail-top-banner { padding: 0; } .custom-home-find-more a { float: right; } .mail-top-banner { padding: 0; } .container-fluid #mail-header .row-fluid .page-center { padding: 10px 20px 8px; } .custom-home-find-more p { padding: 0; max-width: 160px; margin-left: -5px; } .custom-home-find-more { width: 100% !important; } .custom-home-find-more:before{ display:none !important; } } .hs-case-study-page .custom-banner-section .page-center { padding: 19px 0 0; } .hs-case-study-page .custom-banner-section p { font-size: 28px; padding: 0; color: #fff; line-height: 67px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; margin: 0; } .hs-case-study-page .custom-banner-section h1 { margin: 0 0 30px; } .hs-case-study-page .custom-banner-section { min-height: 502px; } .hs-case-study-page .body-container { padding: 0; } .hs-case-study-page .body-container .page-center { padding: 100px 10px; } .hs-case-study-page .content-wrap-bg { background: #f9f9f9; } .hs-case-study-page .content-wrap-bg .col-row{ font-size: 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; flex-wrap: wrap; } .hs-case-study-page .content-wrap-bg .col-3{ width: 32%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background: #fff; border-radius: 8px; padding: 25px; margin-bottom: 25px; } .cm-case-studies-play-video{ margin: -25px; margin-bottom: 25px; position: relative; cursor: pointer; overflow: hidden; border-radius: 8px 8px 0 0; } .cm-case-studies-play-video img{ border-radius: 8px 8px 0 0; } .cm-case-studies-play-video .video-play-btn { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; width: 90px; z-index: 2; } .hs-case-study-page .col-row .play-video:after { content: " "; position: absolute; top: 0; width: 100%; height: 100%; background: transparent; -webkit-transition: background 0.3s ease-in; transition: background 0.3s ease-in; } .hs-case-study-page .col-row .play-video:hover:after { background: rgba(0,0,0,0.2); -webkit-transition: background 0.3s ease-in; transition: background 0.3s ease-in; } .cm-case-studies-video-column .name-caption { margin: 0 0 15px; } .hs-case-study-page .col-row .play-video:hover img { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-transform: scale(1.02); -ms-transform: scale(1.02); transform: scale(1.02); border-radius: 8px 8px 0 0; } .cm-case-studies-video-column p { font-size: 18px; font-weight: 600; } .hs-case-study-page .col-footer { margin: 30px -25px -25px; } .hs-case-study-page .col-footer .col-footer-link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 25px; border-top: 1px solid rgba(151,151,151,0.4); font-size: 18px; color: #0abe51; font-weight: 600; position: relative; } .hs-case-study-page .col-footer .col-footer-link:before { content: ""; position: absolute; right: 26px; height: 2px; width: 20px; background: #0abe51; top: 50%; -webkit-transform: translateY(50%); -ms-transform: translateY(50%); transform: translateY(50%); } .hs-case-study-page .col-footer .col-footer-link:after { content: ""; position: absolute; top: 50%; right: 30px; display: block; height: 11px; width: 11px; border-left: 2px solid #0abe51; border-bottom: 2px solid #0abe51; -webkit-transform: rotate(-135deg) translateY(50%); -ms-transform: rotate(-135deg) translateY(50%); transform: rotate(-135deg) translateY(50%); } .custom-btn-wrapper{ padding-top: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; align-items: center; justify-content: space-around; } .custom-btn-wrapper a{ font-weight: 600; line-height: 32px; padding: 15px 20px; border: none; display: inline-block; font-size: 22px; border: 1px solid #0abe51; border-radius: 6px; background: transparent; color: #0abe51; text-decoration: none; } .custom-btn-wrapper a:hover{ text-decoration: none; } .custom-case-study-row2 .customers-logo .logo-box { padding: 0; margin-top: 0; margin-bottom: 0; } .custom-case-study-row3 h3 { text-align: center; padding-bottom: 40px; } .custom-content-image { margin-bottom: 25px; min-height: 75px; display: table; width: 100%; } .custom-content-with-top-img-item p { font-size: 18px; } .hs-case-study-page .profile-name { font-weight: 600; } .hs-case-study-page .profile-details { font-size: 14px; } .hs-case-study-page .col-3 .profile-details { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .hs-case-study-page .bottom-get-started { background: #fff; } .hs-testimonial-page .custom-banner-section .page-center { padding: 32px 0 0; } .customer-twitter-feed { text-align: center; } .custom-twitter-feed-wrapper { margin-top: 60px; margin-bottom: -60px; } .custom-twitter-feed-wrapper .col-row { margin-bottom: 60px; font-size: 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; flex-wrap: wrap; } .custom-twitter-feed-wrapper .col-3 { width: 32%; max-width: 30%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin-bottom: 60px; } .custom-twitter-feed-wrapper .twitter-pic { background-repeat: no-repeat; background-position: center; background-size: cover; display: block; margin: 0 auto; width: 60px; height: 60px; margin-bottom: 25px; border-radius: 50%; } .custom-twitter-feed-wrapper .col-row p { font-size: 22px; } .hs-testimonial-page .block-caption { font-weight: 600; font-size: 22px; } .custom-twitter-feed-wrapper .col-3:nth-child(2) .twitter-pic, .custom-twitter-feed-wrapper .col-3:nth-child(4) .twitter-pic { background-position: center; } .custom-testimonial-content-wrapper .col-2 { max-width: 48.5%; } .custom-testimonial-content-wrapper .col-content { background: #fff; margin: 0 0 30px; padding: 25px 40px; } .custom-testimonial-content-wrapper .col-row p { font-size: 18px; } .hs-flock-vs-slack-page .body-container, .hs-flock-vs-slack-page .section { padding: 0; } .custom-banner-section.banner-with-button { padding: 0 10px; min-height: 600px; } .custom-banner-section.banner-with-button .page-center { padding: 0 !important; padding-top: 52px !important; } .custom-banner-section.banner-with-button .banner-content { display: inline-block; width: 100%; max-width: 820px; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; } .custom-banner-section.banner-with-button h1 { margin: 0 0 30px; } .custom-banner-button { max-width: 800px; margin: 0 auto; padding: 0; } .custom-banner-section.banner-with-button { padding: 0 10px; min-height: 502px; } .custom-banner-section.banner-with-button .page-center { padding: 0 !important; padding-top: 52px !important; } .banner-content { display: inline-block; width: 100%; max-width: 820px; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: center; } .custom-banner-button { max-width: 800px; margin: 0 auto; padding: 0; } .custom-banner-button a { font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; max-width: 500px; width: auto; padding: 15px 20px; font-size: 22px; vertical-align: top; display: inline-block; margin-top: 50px; } .custom-banner-button a:hover { background: #08a145; } .hs-flock-vs-slack-row1 .cm-power-features .page-center { padding: 75px 40px; } .hs-flock-vs-slack-row1 .cm-power-features.power-features.bg-color-shade { background: #fff; text-align: center; } .hs-flock-vs-slack-row2 .cm-smart-block { padding: 0 10px; background: #f8f8f8; } span.tnc-text { font-size: 16px; display: block; padding-top: 10px; color: #585858; opacity: 0.5; text-align: left; } .hs-flock-vs-slack-row3 .cm-power-features.power-features.bg-color-shade { background: #fff; text-align: center; } .hs-flock-vs-slack-row4.bg-color-shade { background: #f8f8f8; padding: 0 10px; } .hs-flock-vs-slack-row4 .cm-smart-block .page-center { padding-top: 75px; padding-bottom: 75px; padding-left: 40px; padding-right: 40px; } .cm-smart-block .page-center .smart-block-col { display: inline-block; padding: 0px; vertical-align: middle; width: 49.5%; } .cm-smart-block .cm-smart-lft-block img { margin-bottom: 0; display: block; height: auto; /* max-width: 290px; */ margin: 0 auto; } .cm-smart-block .cm-smart-rgt-block p { font-size: 18px; line-height: 1.44; } .cm-smart-block .cm-smart-rgt-block h3 { margin-bottom: 30px; } .ghost-btn { color: #0abe51; font-size: 22px; border: 1px solid #0abe51; border-radius: 6px; padding: 11px 20px; display: inline-block; } .ghost-btn:hover { background: #0abe51; color: #fff; } .hs-flock-vs-slack-row7 .custom-Migrate-wrapper .page-center { padding: 75px 40px; } .why-flock5 .body-container { padding: 0; } .why-flock5 .custom-flock5-row-wrapper .page-center { padding: 150px 20px 0; max-width: 1200px !important; } .why-flock5 .custom-flock5-row-wrapper h3, .why-flock5 .custom-flock5-row-wrapper .sub-heading { text-align: center; color: #333333; } .why-flock5 .custom-flock5-row-wrapper .sub-heading { margin-bottom: 60px; font-size: 20px; line-height: 30px; } .why-flock5 .flex-block { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .why-flock5 .flex-block { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .why-flock5 .flex-block .col { width: 100%; text-align: center; } .why-flock5 .two-columns .list-block { width: 500px; } .why-flock5 .two-columns ul { width: 400px; margin: 0; text-align: left; padding: 0 0 0 40px; list-style: none; } .why-flock5 .two-columns ul li { position: relative; font-size: 20px; line-height: 30px; margin-bottom: 20px; } .why-flock5 .two-columns ul li:before { content: ''; display: inline-block; width: 11px; height: 8px; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/check-mark-green-db5c3be6.svg) center; background-size: contain; position: absolute; left: -30px; top: 8px; } .why-flock5 .two-columns .video-block { width: 680px; } .why-flock5 .flex-block video { width: 100%; display: inline-block; vertical-align: baseline; } .why-flock5 .rtl-direction { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .why-flock5 .rtl-direction.two-columns ul { float: right; } .why-flock5 h3 { text-align: left; color: #333 } .why-flock5 .two-columns p { margin-bottom: 0; text-align: left;333; } .why-flock5 .flex-block video { width: 100%; } .why-flock5 .flock-vs-slack-banner .block-content h1 { font-size: 56px; padding: 0; line-height: 62px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; margin: 0 0 15px 0; padding: 0; } .why-flock5 .flock-vs-slack-banner .block-content .right-section ._g-s-label { max-width: 470px; margin-top: 0px; color: #585858; } .why-flock5 .flock-vs-slack-banner .icon-section .wrapper p { text-transform: uppercase; font-size: 14px; margin: 0; padding: 0 0px 14px; } .why-flock5 .flock-vs-slack-banner .block-content .right-section ._get-started { padding-bottom: 30px; } .why-flock5 .flock-vs-slack-banner .icons.flock-users-icon { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); margin-right: 20px; margin-bottom: 0; } .cm-two-col-with-video.hs-vid-sec1 { margin-top: -67px; } .cm-two-col-with-video.hs-vid-sec2 p.sub-heading > span { max-width: 820px; display: inline-block; } .cm-two-col-with-video.hs-vid-sec2 { padding-bottom: 150px; } .hs-vid-sec3 .flex-block.two-columns, .hs-vid-sec4 .flex-block.two-columns{ -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .hs-vid-sec3 .flex-block.two-columns .list-block, .hs-vid-sec4 .flex-block.two-columns .list-block{ width: 50%; max-width: 490px; } .hs-vid-sec3 .flex-block.two-columns .video-block , .hs-vid-sec4 .flex-block.two-columns .video-block { width: 550px; } .hs-vid-sec3 .flex-block.two-columns .list-block h3, .hs-vid-sec4 .flex-block.two-columns .list-block h3{ text-align: left; } .why-flock5 .cm-power-features.power-features.bg-color-shade { background: #fff; text-align: center; } .why-flock5 .cm-two-col-with-video:last-child { padding-bottom: 150px; } .why-flock5 .cm-power-features.power-features.bg-color-shade { padding-bottom: 150px; } .why-flock5 .cm-power-features .aspect p { text-align: center; } .why-flock5 .link-and-arrow { display: none !important; } .why-flock5 .case-study-videos { padding: 0; } .why-flock5 .body-container .case-study-videos .page-center { padding: 150px 20px !important; } .why-flock5 .hs-get-work-done .page-center { padding: 100px 10px !important; } .why-flock5 .hs-get-work-done { margin-bottom: 0; } .banner-with-text-slider .mast-head.mast-head3 { height: 540px !important; max-width: 900px !important; background-size: 100% 100% !important; -webkit-box-shadow: -1px 2px 20px #ccc; box-shadow: -1px 2px 20px #ccc; transition: all ease .5s; position: relative; } .banner-with-text-slider .left-section { display: block !important; padding-right: 0 !important; width: 100% !important; max-width: 900px; position: absolute; top: 50px; right: -230px; text-align: center !important; } .banner-with-text-slider .right-section { float: left; padding-top: 0; width: 100% !important; max-width: 450px; } .banner-with-text-slider img.video-play-btn.play-video { position: absolute; left: 0; right: 0; top: 0; bottom: 0; margin: auto; cursor: pointer; z-index: 9; width: 100px; -webkit-transform: scale(0.9); -ms-transform: scale(0.9); transform: scale(0.9); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; width: 159px; } .why-flock-rmkt .block-content .mast-head3:hover .video-play-btn { -webkit-transform: scale(1); -ms-transform: scale(1); transform: scale(1); -webkit-transition: -webkit-transform 0.3s ease-in-out; transition: -webkit-transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out; } .banner-with-text-slider .mast-head.mast-head3:after { content: ''; position: absolute; left: 0; width: 100%; height: 100%; background: transparent; -webkit-transition: background .3s ease-in-out; transition: background .3s ease-in-out; } .banner-with-text-slider .mast-head.mast-head3:hover:after { background: rgba(0,0,0,0.3); -webkit-transition: background .3s ease-in-out; transition: background .3s ease-in-out; } .banner-with-text-slider ._get-started .hs-form-field { width: 54%; } .why-flock-rmkt .body-container, .why-flock-rmkt .section { padding: 0; } .why-flock-rmkt .flock-vs-slack-banner .block-content .right-section ._g-s-label { font-size: 22px; line-height: 36px; margin-top: 10px; } .why-flock-rmkt .flock-vs-slack-banner .block-content h1 { font-size: 52px; min-height: 63px; } .why-flock-rmkt .flock-vs-slack-banner .block-content { padding: 100px 20px 0; } .why-flock-rmkt .flock-vs-slack-banner ._get-started .hs-input { font-size: 18px; padding: 15px 15px; } .why-flock-rmkt .flock-vs-slack-banner .icon-section .wrapper p { text-transform: initial; line-height: 1.3; } .why-flock-rmkt .why-flock-fb1 .csm-slider-with-thumbnail-content.api-block.custom-indexe-slider .page-center { padding: 75px 20px; } .why-flock-rmkt .two-col-slider .csm-slider-with-thumbnail-content h3 { font-size: 42px; line-height: 50px; color: #585858; margin: 0 0 20px; } #security-priority h3 { text-align: center; margin-bottom: 50px; } #security-priority .page-center { padding: 75px 20px; } #security-priority .main-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } #security-priority .left-block { -webkit-box-flex: 0.3; -ms-flex: 0.3; flex: 0.3; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0; -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; display: -webkit-box; display: -ms-flexbox; display: flex; } #security-priority .security_icon { display: inline-block; vertical-align: middle; } #security-priority .tls { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/tls-4353a8da.svg); width: 70px; height: 55px; background-size: 100% 100%; } #security-priority .aws { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/aws-2-1682d0ec.jpg); width: 70px; height: 41px; background-size: 100% 100%; margin: 0 40px; } #security-priority .soc { background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/soc-2-type-5f4391cf.jpg); width: 120px; height: 60px; background-size: 100%; } #security-priority .right-block { display: -webkit-box; display: -ms-flexbox; display: flex; } #security-priority .right-block { -webkit-box-flex: 0.63; -ms-flex: 0.63; flex: 0.63; } #security-priority .right-block p { margin: 0; font-size: 18px; } .why-flock-rmkt .body-container .page-center { max-width: 1200px !important; padding-left: 40px !important; padding-right: 40px !important; padding-top: 75px !important; padding-bottom: 75px !important; } .why-flock-rmkt .other-awards .section .company-logo { background-size: 100%; width: 160px; height: 40px; margin: auto; background-position: 0 -7px; } .why-flock-rmkt .other-awards .section:nth-child(2) .company-logo { background-position: 0 -60px; } .why-flock-rmkt .other-awards .section:nth-child(3) .company-logo { background-position: 0 -114px; } .why-flock-rmkt .case-study-videos { padding: 0; background: #fff; } .why-flock-rmkt .case-study-videos { background: #fff; } .why-flock-rmkt .team-unit.wide.hs-tabber-group h2 { font-size: 42px; line-height: 50px; letter-spacing: -0.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; text-align: center; margin-bottom: 80px; } .why-flock-rmkt .hs-tabber-group.wide .tabs-block span.active { color: #0abe51; background: #f9f9f9; font-weight: normal; } .why-flock-rmkt .hs-tabber-group.wide .tabs-block span { color: rgba(51,51,51,0.3); } .why-flock-rmkt .body-container .team-unit.wide.hs-tabber-group .page-center { max-width: 1100px !important; padding-bottom: 0 !important; } .why-flock-rmkt .hs-tabber-group.wide .tabs-block span { padding: 10px 30px; } .why-flock-rmkt .get-started-v2 p._g-s-label { font-size: 36px; line-height: 50px; margin: 0 20px 0px 0; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; letter-spacing: -0.8px; display: inline-block; } .why-flock-rmkt .get-started-v2.get-started-inline ._get-started .hs-button { text-transform: initial; } .why-flock-rmkt .get-started-v2.get-started-inline ._get-started .hs-form-field { margin: 0; max-width: 240px; } .why-flock-rmkt .get-started-v2.get-started-inline a._g-s-button.js-mobile-download { display: none !important; } .why-flock-rmkt .get-started-v2.get-started-inline ._g-s-download a { text-decoration: none; color: #373737; } .why-flock-rmkt .get-started-v2.get-started-inline ._get-started .hs-input, .why-flock-rmkt .why-flock-capterra .custom-flock-banner-area .hs-input { padding: 15px ; font-size: 18px; } .hs-flock-vs-slack-page .full-section { max-width: 820px; display: block !important; margin: auto; } .hs-flock-vs-slack-page .home-page h1 { } .hs-flock-vs-slack-page .cm-compare-table.bg-color-shade .page-center { padding-top: 75px; padding-bottom: 75px; padding-left: 40px; padding-right: 40px; } .hs-flock-vs-slack-page .cm-compare-table.bg-color-shade h3 { margin-bottom: 60px; } .hs-flock-vs-slack-page #securityBlock .subtitle { text-align: center; font-size: 28px; line-height: 40px; margin: 0; } .hs-flock-vs-slack-page #securityBlock .left-block { display: inline-block; padding-right: 20px; width: 49%; text-align: center; vertical-align: middle; } .hs-flock-vs-slack-page #securityBlock .left-block .security-img-flockvsslack { max-width: 394px; } .hs-flock-vs-slack-page #securityBlock .right-block { width: 49%; } .hs-flock-vs-slack-page #securityBlock .right-block p { color: #585858; font-size: 18px; padding: 15px 0; line-height: 1.3; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .hs-flock-vs-slack-page .unit.custom-Migrate-wrapper .page-center{ max-width: 1100px !important; } .hs-flock-vs-slack-page .videos .slider-box { padding-top: 0; } .hs-flock-vs-slack-page .cm-smartmod.cm-smart-lft-block img, .hs-flock-vs-slack-page .cm-smart-lft-block img{ display: block; margin: 0 auto 30px; max-height: 300px; } .custom-content-with-top-img-wrapper .customer-sprite { display: table-cell; width: 210px; height: 75px; vertical-align: middle; } .hs-indexb-layout .get-started-v2.get-started-inline ._get-started .hs-button { text-transform: none; } .flock-vs-slack3-page .bottom-get-started ._get-started .hs_error_rollup { left: 101px; } @media (min-width: 1000px) { .banner-with-text-slider .left-section.for_mobile{ display: none !important; } .hs-flock-vs-slack-page .home-page h1 { font-size: 64px; line-height: 70px; letter-spacing: -2.5px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .hs-flock-vs-slack-page .cm-smartmod.cm-smart-lft-block img, .hs-flock-vs-slack-page .cm-smart-lft-block img{ max-height: 350px; margin-bottom: 0; max-width: 100%; width: auto; } } @media (max-width: 999px) { .banner-with-text-slider .left-section.for_desktop{ display: none !important; } .custom-banner-button a { width: 100%; padding: 10px 15px; font-size: 20px; } .custom-banner-section.banner-with-button .page-center { padding-top: 16px !important; } .custom-banner-section.banner-with-button { min-height: 476px; } .hs-flock-vs-slack-row1 .cm-power-features .page-center { padding: 85px 20px; } .hs-flock-vs-slack-page .cm-power-features .aspect p { line-height: 1.44; font-size: 16px; line-height: 1.44; text-align: center; } .why-flock5 .flock-vs-slack-banner .block-content h1 { font-size: 35px; line-height: 1.1; letter-spacing: -2.5px; padding: 20px 10px 15px 10px!important; } .flock-vs-slack-banner .icons.flock-users-icon { display: block; display: block; margin: 0 auto 20px; } .why-flock5 .custom-flock5-row-wrapper .sub-heading { font-size: 18px; line-height: 26px; margin-bottom: 30px; } .why-flock5 .two-columns .list-block { width: 100%; } .why-flock5 .two-columns .video-block { width: 100%; } .why-flock5 .flex-block { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .why-flock5 .two-columns ul { width: 550px; margin: 0 auto 40px; } .why-flock5 .flex-block video { width: 550px; } .why-flock5 .custom-flock5-row-wrapper .page-center { padding: 75px 20px 0; } .cm-two-col-with-video.hs-vid-sec2 { padding-bottom: 75px; } .why-flock5 .rtl-direction.two-columns ul { float: none; } .why-flock5 .hs-vid-sec3 .flex-block.two-columns .list-block, .why-flock5 .hs-vid-sec4 .flex-block.two-columns .list-block { width: 100%; max-width: 100%; } .why-flock5 .hs-vid-sec3 .flex-block.two-columns .list-block h3, .why-flock5 .hs-vid-sec4 .flex-block.two-columns .list-block h3 { text-align: center; } .why-flock5 .two-columns p { text-align: center; } .why-flock5 .cm-two-col-with-video:last-child { padding-bottom: 75px; } .why-flock5 .cm-power-features .aspect.side-margin { margin: 0 auto 30px; width: 100%; } .why-flock5 .cm-power-features .aspect { width: 100%; margin: 0 auto 30px; max-width: 300px; display: block; } .why-flock5 .cm-power-features.power-features.bg-color-shade { padding-bottom: 75px; } .why-flock5 .cm-power-features .aspect p { text-align: center; font-size: 18px; line-height: 26px; color: #333333; } .why-flock5 .cm-power-features .aspect:last-child { margin-bottom: 0; } .why-flock5 .body-container .case-study-videos .page-center { padding: 75px 20px !important; } .why-flock5 .case-study-videos .video-block:last-child { margin-bottom: 0; } .why-flock5 .flock-vs-slack-banner .block-content h1 { padding: 0 10px; } .why-flock5 .two-columns p { margin-bottom: 30px; } .cm-power-features h3 { margin-bottom: 30px; } .banner-with-text-slider .left-section { display: block !important; width: 100% !important; position: relative; top: 0; right: 0; } .why-flock-rmkt .flock-vs-slack-banner .block-content .left-section { padding-top: 0; margin-bottom: 0; margin-bottom: 10px; padding: 0 0 30px 0; } .why-flock-rmkt .flock-vs-slack-banner .block-content { padding: 20px 0px 0; } .why-flock-rmkt .banner-with-text-slider .right-section { float: none; } .why-flock-rmkt .flock-vs-slack-banner .block-content h1 { font-size: 49px; } .why-flock-rmkt .flock-vs-slack-banner .block-content .right-section ._g-s-label { font-family: proxima-regular, Helvetica, Arial, sans-serif; margin-right: 0; margin-bottom: 30px; } .banner-with-text-slider .mast-head.mast-head3 { height: 180px !important; max-width: 300px !important; } #security-priority .main-wrap { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin-bottom: 0; } .why-flock-rmkt .get-started-v2 p._g-s-label { font-size: 22px; position: relative; line-height: 1.4; letter-spacing: -0.8px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; margin: 0 0 30px 0; vertical-align: middle; } .why-flock-rmkt .get-started-v2.get-started-inline a._g-s-button.js-mobile-download { display: inline-block !important; } .why-flock-rmkt .two-col-slider .csm-slider-with-thumbnail-content.custom-indexe-slider .api-key-slider .slick-slide.slick-current { background: #fff; } span.tnc-text { text-align: center; } .hs-flock-vs-slack-page .hs-flock-vs-slack-row2 .cm-smart-block { padding: 0 20px; } .hs-flock-vs-slack-page .cm-smartmod.cm-smart-lft-block img { max-width: 300px; } .hs-flock-vs-slack-page .hs-flock-vs-slack-row4.bg-color-shade { padding: 0 20px; } .cm-smart-block { padding: 0; } .hs-flock-vs-slack-page .cm-smart-block .page-center { padding-left: 0; padding-right: 0; } .hs-flock-vs-slack-page .cm-smart-block.cm-two-col-right-img-wrap .page-center>div { display: block; width: 100%; } .hs-flock-vs-slack-page .cm-smart-block.cm-two-col-right-img-wrap .cm-smart-rgt-block p { font-size: 16px; line-height: 1.44; } .hs-flock-vs-slack-page #securityBlock .subtitle { font-size: 20px; line-height: 1.42857; } .hs-flock-vs-slack-page #securityBlock .left-block .security-img-flockvsslack { max-width: 300px; } .hs-flock-vs-slack-page #securityBlock .left-block { padding-right: 0; width: 100%; padding-left: 0; } .hs-flock-vs-slack-page #securityBlock .content-wrap { padding-top: 0; } .hs-flock-vs-slack-page #securityBlock .right-block { width: 100%; } } @media (max-width: 767px) { .hs-case-study-page .content-wrap-bg .col-3 { width: 100%; margin-bottom: 30px; } .hs-case-study-page .body-container .page-center { padding: 50px 10px; } .cm-case-studies-video-column p { font-size: 20px; } .hs-case-study-page .content-wrap-bg .col-row { font-size: 16px; } .cm-case-studies-video-column p { margin: 0; } .hs-case-study-page .custom-banner-section { padding: 0; } .hs-case-study-page .custom-banner-section p { font-size: 19px; padding: 10px 0 0; margin: 0; color: #fff; line-height: 1.2; } .hs-case-study-page .custom-banner-section .page-center { padding: 36px 10px; } .hs-case-study-page .custom-banner-section h1 { margin: 0; } .hs-case-study-page .custom-banner-section { min-height: 226px; } .custom-twitter-feed-wrapper .col-3 { width: 100%; max-width: 100%; display: block; margin-bottom: 0; } .custom-twitter-feed-wrapper { margin-bottom: 0; } .custom-testimonial-content-wrapper .col-2 { max-width: 100%; } .custom-testimonial-content-wrapper .col-row p { font-size: 20px; } .why-flock5 .two-columns ul { width: 300px; } .why-flock5 .flex-block video { width: 300px; } .banner-with-text-slider .right-section { float: none; width: 100% !important; max-width: 100%; } .why-flock-rmkt ._g-s-mobile a._g-s-button.js-mobile-download { max-width: 400px; } .why-flock-rmkt .custom-slider-subheading a { display: none !important; } div#security-priority .page-center { padding-bottom: 0 !important; } .why-flock-rmkt .body-container .other-awards .page-center { padding-top: 0 !important; padding-bottom: 0 !important; } .why-flock-rmkt .body-container .page-center { padding-left: 10px !important; padding-right: 10px !important; padding-top: 85px !important; padding-bottom: 85px !important; } .why-flock-rmkt .team-unit.wide.hs-tabber-group h2 { font-size: 28px; line-height: 40px; } .why-flock-rmkt .body-container .team-unit.wide.hs-tabber-group .page-center { padding-top: 0 !important; } .why-flock-rmkt .case-study-videos .video-block:last-child { margin-bottom: 0; } div#security-priority .page-center { padding-left: 40px !important; padding-right: 40px !important; } .why-flock-rmkt .body-container .unit.range-block .page-center { padding-left: 40px !important; padding-right: 40px !important; } .hs-testimonial-page .bottom-get-started ._get-started .g-s-mobile { margin-bottom: 0; } .hs-flock-vs-slack-page .cm-compare-table.bg-color-shade .page-center { padding-left: 20px; padding-right: 20px; } .hs-flock-vs-slack-row7 .custom-Migrate-wrapper .page-center { padding: 75px 20px; } .hs-flock-vs-slack-page .bottom-get-started ._get-started .g-s-mobile { margin-bottom: 0; } .custom-content-image { margin-bottom: 0; min-height: auto; } .hs-flock-vs-slack-page .custom-banner-section .custom-banner-button a { margin-bottom: 20px; } } /* ===== Alok ======== */ .home-page-3 #main-area { min-height: 760px; position: relative; } body.in_moveover.in_moveover_index { padding: 0; } .home-page-3 .typed-cursor,.home-page-3 .typed-cursor .typed-cursor--blink { display: none !important; height: 0 } .home-page-3 .heading-wrap { display: block; min-height: 65px } .home-page-3 ._get-started ._g-s-button, ._get-started a._g-s-button { display: inline-block; width: 100%; margin: 0; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; max-width: 500px; } .home-page-3 h1 { display: block; padding: 20px 10px 15px 10px; opacity: 1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.1; letter-spacing: -2.5px } .home-page-3 .block-content { display: inline-block; max-width: 1200px; margin: 0 auto } .home-page-3 .block-content .left-section { display: inline-block; width: 100%; padding-top: 90px; margin-bottom: 10px } .home-page-3 .block-content .mast-head { display: inline-block; width: 100%; max-width: 300px; height: 300px; background-size: 100% 100% } .custom-moveover-row8 .bottom-content p { font-size: 18px; margin: 0; line-height: 1.42857; color: #5d5d5d; } .custom-moveover-row8 .hs-error-msgs { position: absolute; bottom: -28px; left: 0; } .custom-moveover-row8 .hs_error_rollup { position: absolute; width: 100%; bottom: -18px; } .moveover .custom-hipchat-bottom-form-content p{ color: #585858; } .custom-moveover-row8 .bottom-content { margin-top: -22px; font-size: 18px; } .custom-hipchat-bottom-form-wrapper .page-center { position: relative; padding-left: 10px !important; padding-right: 10px !important; } .custom-moveover-row8 .custom-hipchat-bottom-form .actions { position: absolute; top: 0; right: 0; } .custom-moveover-row8 .custom-hipchat-bottom-form .hs-input{ height: 62px; } .custom-moveover-row8 .custom-hipchat-bottom-form form{ position: static; } .moveover .custom-hipchat-bottom-form .hs_email { display: inline-block; margin: 0; } .custom-hipchat-bottom-form .hs-input.error { border-color: #ff3b47; } .custom-moveover-row8 .custom-hipchat-bottom-form .input { border: none; } .custom-moveover-row8 .custom-hipchat-bottom-form .hs-input { border: 1px solid #dbdbdb; } .moveover .widget-span.custom-hipchat-bottom-form { width: auto !important; margin-left: 4px !important; float: right; padding-right: 156px; margin-top: 16px; position: relative; } .custom-moveover-row1 .custom-brand-name { border-bottom: 1px solid #dedede; background: #fff; } .home-page-3 .block-content .banner-img { width: 90%; display: none; max-width: 400px; vertical-align: text-bottom } .custom-moveover-row1 .brands-inline.all-brands { background: transparent; } .home-page-3 .block-content .banner-img-mobile { display: inline-block; width: 55% } .home-page-3 .block-content .right-section { display: inline-block; width: 100%; text-align: center } .home-page-3 .block-content .right-section ._get-started { padding-bottom: 100px } .home-page-3 .block-content .right-section ._get-started ._g-s-sublable { margin-top: 10px; display: block; font-size: 22px; color: #fff; margin-top: 15px; text-align: left; letter-spacing: -0.4px; margin-top: 10px; } .home-page-3 .block-content .right-section ._get-started ._g-s-sublable p { color: #fff; margin-bottom: 10px; display: block !important } .home-page-3 .block-content .right-section ._get-started ._g-s-sublable p a { color: #0ab54d } .home-page-3.white-theme #main-area,.home-page-3.white-theme ._get-started ._g-s-sublable { color: #585858 } .home-page-3.white-theme h1 { margin-bottom: 22px } @media only screen and (min-width: 1000px) { .home-page-3 h1 { font-size:56px; margin: 0; padding: 0 } .custom-hipchat-bottom-form-mobile-button { display: none !important; } .home-page-3 .block-content { padding-top: 140px; width: 100% } .home-page-3 ._get-started ._g-s-form { position: relative; display: inline-block; max-width: 700px; padding: 8px; margin: 0 auto; text-align: center; border-radius: 6px; background-color: #1f2237; } .home-page-3 ._get-started ._g-s-mobile { display: none; } .home-page-3 .block-content .left-section { display: inline-block; width: 48.5%; padding-right: 20px; padding-top: 0; margin-bottom: 0; vertical-align: middle } .home-page-3 .block-content .mast-head { display: inline-block; width: 100%; height: 400px; max-width: 400px; background-size: 100% 100% } .home-page-3 .block-content .mast-head2 { background-size: 100% 100% } .home-page-3 .block-content .banner-img { max-width: 400px } .home-page-3 .block-content .banner-img-desktop { display: inline-block } .home-page-3 .block-content .banner-img-mobile { display: none } .home-page-3 .block-content .right-section { width: 50.5%; text-align: left; vertical-align: middle } .home-page-3 .block-content .right-section ._g-s-label { font-size: 25px } .home-page-3 .block-content .right-section ._get-started { text-align: left; padding-bottom: 0 } } @media screen and (min-width: 900px) and (max-width: 1200px) { .home-page-3 h1 { font-size:60px } .home-page-3 .locale-ru ._g-s-form,.home-page-3 .locale-es ._g-s-form,.home-page-3 .locale-br ._g-s-form { background: none; padding: 8px 0; text-align: left } .home-page-3 .locale-ru ._g-s-input,.home-page-3 .locale-es ._g-s-input,.home-page-3 .locale-br ._g-s-input { margin-bottom: 20px } } @media screen and (max-width: 450px) { .home-page-3 #main-area { min-height:700px } .home-page-3 #main-area.locale-ru { min-height: 750px } } @media screen and (max-width: 320px) { .home-page-3 #main-area { min-height:650px } .home-page-3 #main-area.locale-es,.home-page-3 #main-area.locale-ru,.home-page-3 #main-area.locale-br { min-height: 770px } } @media (-webkit-min-device-pixel-ratio: 2) { .home-page-3 .block-content .mast-head { background-size: 100% 100% } } @media (-webkit-min-device-pixel-ratio: 2) and (min-width: 1000px) { .home-page-3 .block-content .mast-head { background-size: 100% 100% } .home-page-3 .block-content .mast-head2 { background-size: 100% 100% } } .hs-moveover .body-container.container-fluid { padding: 0; } .moveover h3,.moveover p { color: #333333 } .moveover .wrapper, .hs-moveover .container-fluid .row-fluid .wrapper{ max-width: 1140px; padding: 50px 20px; margin:0 auto; float:none; } .moveover .unit { text-align: center } .moveover .gray-background { background-color: #f9f9f9 } .moveover #btn { padding: 15px 17px; font-size: 16px; letter-spacing: -0.37px; background-color: #0abe51; border-radius: 4px; color: #ffffff; display: inline-block } .moveover .heading-block { margin-bottom: 30px } .moveover .heading-block h3 { text-align: center } .moveover .heading-block p{ margin: 0; font-size: 20px } .moveover .bold-text, .custom-bolded-text p{ font-family: proxima-semibold, Helvetica, Arial, sans-serif; margin-bottom: 5px } .moveover .small-text, .custom-bolded-text h5{ font-size: 18px; line-height: 26px; max-width: 817px; margin: auto; font-weight: normal; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .moveover .inline-link { color: #0abe51; text-decoration: underline } .award-section .no-background { background-color: transparent; } .moveover .flex-block { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .moveover .flex-block .row { margin-bottom: 30px } .moveover .flex-block .row:last-child { margin-bottom: 0 } .moveover .home-page h2 { color: #ffffff } .moveover .home-page #main-area { min-height: 0 } .moveover .home-page .small-font { font-size: 22px; line-height: 34px; font-family: proxima-regular } .moveover .home-page .block-content { padding-bottom: 50px; direction: rtl; width: 100%; max-width: 1200px; } .moveover .home-page .block-content .right-section,.moveover .home-page .block-content .left-section { direction: ltr } .moveover .home-page .block-content .right-section ._get-started { padding-bottom: 0px } .moveover .home-page .block-content .mast-head5 { background-size: 100% 100%; width: 100%; height: 170px } .moveover .home-page ._get-started ._g-s-sublable a { color: #ffffff; text-decoration: underline } .moveover .migration-block { text-align: center } .moveover .migration-block .cards-block { max-width: 1090px; margin: 0 auto 40px } .moveover .migration-block .cards-block .card { max-width: 500px; text-align: left; background-color: #f9f9f9; padding: 20px } .moveover .migration-block .cards-block .purple-shadow { -webkit-box-shadow: -5px 5px 0 rgba(155,181,226,0.3); box-shadow: -5px 5px 0 rgba(155,181,226,0.3) } .moveover .migration-block .cards-block .blue-shadow { -webkit-box-shadow: -5px 5px 0 rgba(181,217,247,0.4); box-shadow: -5px 5px 0 rgba(181,217,247,0.4) } .moveover .migration-block .cards-block .card-img { width: 43px; height: 40px; margin-bottom: 15px } .moveover .migration-block .cards-block .heading { color: #585858 } .moveover .migration-block .cards-block .text { color: #585858; margin-bottom: 25px } .moveover .integration-block { text-align: center } .moveover .integration-block .icon-block { max-width: 1090px; margin: 0 auto 40px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .moveover .integration-block .icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border-radius: 8px; margin-bottom: 0; width: 50px; height: 50px } .moveover .integration-block img { display: block; height: 20px } .moveover .integration-block .jira-color { background-color: #264970 } .moveover .integration-block .trello-color { background: -webkit-gradient(linear, left top, left bottom, from(#0091e6), to(#0079bf)); background: linear-gradient(to bottom, #0091e6, #0079bf) } .moveover .integration-block .bitbucket-color { background-color: #205081 } .moveover .integration-block .ops-genie-color { background-color: #fc8e2e } .moveover .integration-block .github-color { background-color: #191717 } .hs-moveover .container-fluid .row-fluid .moveover .features-block .wrapper { padding-bottom: 0 } .moveover .features-block .block-container { width: 100% } .other-awards .section { padding: 0 !important; } .moveover .features-block ul { padding-left: 30px; max-width: 428px; margin: auto } .moveover .features-block ul li { margin-bottom: 20px; position: relative; text-align: left; font-size: 20px; line-height: 26px } .moveover .features-block ul li:before { content: ''; background-image: url('https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/check-mark-green-db5c3be6.svg'); background-size: 100%; position: absolute; width: 12px; height: 8px; display: block; left: -28px; top: 9px } .moveover .features-block ul li:last-child { margin-bottom: 0px } .moveover .features-block .image-container { max-width: 500px; margin: auto } .moveover .community-block .content-block { max-width: 486px } .moveover .community-block p { color: #585858 } .moveover .community-block p:last-child { margin-bottom: 50px } .moveover .namecheap-testimonial .content { width: 100%; position: relative } .moveover .namecheap-testimonial .video-screenshot { width: 280px; display: inline-block; height: 160px } .moveover .namecheap-testimonial .video-screenshot-namecheap-2 { background-size: cover } .moveover .namecheap-testimonial .award-section .wrapper { padding: 0 !important; } .moveover .namecheap-testimonial .award-section .gartner-award { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 0 } .moveover .namecheap-testimonial .award-section img.gartner-img,.moveover .namecheap-testimonial .award-section img.double-quotes { display: none } .moveover .namecheap-testimonial .video-play-btn { position: absolute; top: 50%; left: 50%; height: 77px; margin: auto; cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(0.9); -webkit-transform: translate(-50%, -50%) scale(0.9); transform: translate(-50%, -50%) scale(0.9); z-index: 4 } .moveover .namecheap-testimonial .video-play-btn:hover { opacity: 1; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(1); -webkit-transform: translate(-50%, -50%) scale(1); transform: translate(-50%, -50%) scale(1) } .moveover .brands-inline { border-bottom: 1px solid #dedede } .moveover .brands-inline .brand-title { display: none } .moveover .award-section .wrapper { padding-bottom: 0px !important; } .moveover .other-awards .wrapper { padding: 50px 0 !important; } .why-flock2-row1 .about-flock p, .why-flock2-row1 .about-flock h3 { text-align: center; } .why-flock2-row1 .about-flock h3 { margin: 0; } @media (min-width: 500px) { .moveover .integration-block .icon { width:90px; height: 90px } .moveover .integration-block img { height: 30px } .moveover .migration-block .cards-block .card { padding: 30px } } @media (min-width: 700px) { .moveover .integration-block .icon { width:120px; height: 120px } .moveover .integration-block img { height: 40px } } @media (min-width: 1000px) { .hs-indexe-layout .custom-flock-banner-area ._get-started .hs_error_rollup, .hs-indexe-layout .get-started-v2 ._get-started .hs_error_rollup{ left: 0; } .flock-vs-slack3-page ._get-started .hs_error_rollup { left: 0; } .flock-vs-slack3-page .testimonial-section { padding-bottom: 0; } .moveover .wrapper, .hs-moveover .container-fluid .row-fluid .wrapper{ padding:100px 20px } .custom-hipchat-bottom-form-wrapper.custom-moveover-row8.moveover{ padding: 87px 10px 100px; margin:0; } .moveover .heading-block { margin-bottom: 60px } .moveover .heading-text { margin-bottom: 10px } .moveover .btn-migration-block { padding: 15px 17px } .moveover .btn-integration-block { padding: 15px 17px } .moveover .btn-community-block { padding: 15px 17px } .moveover .bold-text, .custom-bolded-text p{ margin-bottom: 10px } .moveover .flex-block { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .moveover .flex-block .row { margin-bottom: 0 } .moveover .home-page .small-font { font-size: 40px; line-height: 67px } .moveover .home-page .block-content { padding-bottom: 100px } .moveover .home-page .block-content .mast-head5 { max-width: none; width: 720px; height: 473px } .moveover .migration-block .cards-block { margin: 0 auto 80px } .moveover .migration-block .cards-block .card { max-width: 460px; min-height: 461px; padding: 45px 50px } .moveover .migration-block .cards-block .purple-shadow { -webkit-box-shadow: -10px 10px 0 rgba(155,181,226,0.3); box-shadow: -10px 10px 0 rgba(155,181,226,0.3) } .moveover .migration-block .cards-block .blue-shadow { -webkit-box-shadow: -10px 10px 0 rgba(181,217,247,0.4); box-shadow: -10px 10px 0 rgba(181,217,247,0.4) } .moveover .migration-block .cards-block .card-img { width: 86px; height: 81px; margin-bottom: 30px } .moveover .migration-block .cards-block .heading { font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858; margin-bottom: 10px } .moveover .migration-block .cards-block .text { color: #585858; margin-bottom: 50px } .moveover #btn.btn-migration-block { padding: 20px 32px } .moveover #btn.btn-integration-block { padding: 20px 47px } .moveover #btn.btn-community-block { padding: 20px 76px } .moveover .integration-block .icon-block { margin-bottom: 80px } .moveover .integration-block .icon { width: 177px; height: 177px } .moveover .integration-block .icon:hover img { -webkit-transform: scale(1.2); -ms-transform: scale(1.2); transform: scale(1.2); -webkit-transition: -webkit-transform .3s ease-in-out; transition: -webkit-transform .3s ease-in-out; transition: transform .3s ease-in-out; transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out } .moveover .integration-block img { height: 53px; -webkit-transition: -webkit-transform .3s ease-in-out; transition: -webkit-transform .3s ease-in-out; transition: transform .3s ease-in-out; transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out } .moveover .other-awards .wrapper { padding-top: 50px !important; } .moveover .community-block .content-block { text-align: left } .moveover .features-block .block-container { width: 50% } .moveover .features-block ul { margin: 0 } .moveover .features-block ul li { font-size: 22px; line-height: 30px } .moveover .namecheap-testimonial .video-screenshot { width: 400px; height: 225px } } @media (min-width: 1070px) { .moveover .migration-block .cards-block .card { max-width:500px } .moveover .community-block .image-container { width: 650px } .moveover .community-block .content-block { text-align: left } .moveover .community-block .content-block:last-child { max-width: 540px } } @media (min-width: 1371px) { .moveover .features-block .image-container { width:777px; max-width: none; margin-left: -50px } } @media only screen and (max-width: 1200px) and (min-width: 1000px){ .hs-moveover ._get-started .hs-form-field{ width: 232px; } } @media (max-width: 1240px) { .moveover .home-page .block-content { padding-left: 15px; padding-right: 15px; } .customer-testimonial .slick-next{ right: 0; } .customer-testimonial .slick-prev{ left: 0; } } @media (max-width: 999px) { .why-flock5 .flock-vs-slack-banner .icons.flock-users-icon { display: inline-block !important; } .flock-vs-slack-banner #main-area { padding-bottom: 75px; } .why-flock5 .hs-flock-hdr .fixed-product-keys { position: absolute; right: 10px; top: 15px; } .custom-moveover-row8 .bottom-content { display: none; } .signup-pro .bottom-get-started form { display: none; } .hs-indexe-layout.hipchat-migration #main-area .small-font{ font-size: 64px; } .hs-indexa-page .custom-home-wrapper .bottom-get-started p.g-s-label { font-size: 22px !important; } .why-flock2 #header .page-center { text-align: left; } .why-flock2 .gartner-section-wrapper .page-center { max-width: 402px !important; } .why-flock2 #header:not(.fixedNav) .page-center { padding: 10px; } .flock-vs-slack3-page #header:not(.fixedNav) .page-center { text-align: left; padding: 10px; } .moveover .home-page .block-content .right-section ._get-started ._g-s-form, .home-page-3 .block-content .right-section ._get-started ._g-s-sublable{ display: none; } .moveover .home-page .block-content .mast-head5 { background-size: 100% 100%; width: 100%; height: 170px; display: block !important; margin: 0 auto; } .mail-top-banner>div>div{ margin-left: 0; } .hs-home-main.hs-home-layout.hipchat-migration #main-area { padding-top: 73px; } .moveover ._g-s-mobile a._g-s-button.js-mobile-download:hover { background: #08a145; } .moveover ._g-s-mobile a._g-s-button.js-mobile-download { display: inline-block; width: 100%; margin: 0; padding: 10px 15px; font-size: 20px; font-weight: 600; line-height: 32px; background: #0abe51; border: 0; border-radius: 6px; color: #fff; text-align: center; -webkit-transition: background 300ms; transition: background 300ms; max-width: 500px; } .custom-moveover-row8 .bottom-content p { display: none; } .custom-hipchat-bottom-form-wrapper.custom-moveover-row8.moveover { padding: 39px 10px 50px; margin: 0; } /* .hs-why-flock-layout.hs-why-flock4-page .header-section:after { bottom: 30px !important; } */ .why-flock4-gtr.gartner-wrap .gartner-section .gartner-badge { width: 100px !important; height: 100px !important; } .testimonial-section .logo { background-position: center; } .hs-home-main div#header .mobile-trigger em { background: #585858 !important; } .hs-home-main #mail-header { width: calc(100% - 40px) !important; } .scrolled .hs-microsoft-hdr.hs-flock-hdr .fixed-product-keys { display: block; } .hs-flock-vs-microsoft-layout .hs-flock-hdr .fixed-product-keys.show a.getStartedBtn { background: #0abe51; } .hs-flock-vs-microsoft-layout .hs-flock-hdr .fixed-product-keys.show a.getStartedBtn:hover { background: #08a145; -webkit-transition: background 300ms; transition: background 300ms; } .features-sided-container { padding: 0 20px; } .why-flock-capterra .award-section .gartner-award { margin-bottom: 0; } .hs-startups-layout .bottom-get-started ._get-started .g-s-mobile { margin-bottom: 0; } .custom-top-video-section .video-wrap .video-play-btn { max-width: 100px; } .team-collaboration-page .custom-menu-primary .hs-menu-wrapper>ul>li>a{ color: #fff; } .mobile-open .team-collaboration-header .mobile-trigger em{ background: #fff !important; } } /* ======= Download ========== */ .download { font-family: proxima-regular, Helvetica, Arial, sans-serif } .download .mac_env .windows,.download .mac_env .linux { display: none !important } .download .mac_env .mac { display: inline-block !important } .download .windows_env .mac,.download .windows_env .linux { display: none !important } .download .windows_env .windows { display: inline-block !important } .download .linux_env .mac,.download .linux_env .windows { display: none !important } .download .linux_env .linux { display: inline-block !important } .download .large_screen_block { display: block; padding-top: 12px; width: 100%; overflow: hidden } .download .block-unit { width: 100% } .download .large_screen_wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; vertical-align: middle; width: 100%; padding: 70px 0 60px 0; max-width: 1100px; margin: 0 auto; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -ms-flex-pack: distribute; justify-content: space-around; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .download .large_screen_wrapper .left_block { -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 380px } .download .large_screen_wrapper .left_block h2 { display: block; font-size: 18px; color: #585858; line-height: 1.4; margin: 0; padding: 0 0 25px 0; font-weight: 400; letter-spacing: 3px; font-family: proxima-light, Helvetica, Arial, sans-serif } .download .large_screen_wrapper .left_block h2 span { font-size: 30px; letter-spacing: 1px; font-family: proxima-regular, Helvetica, Arial, sans-serif } .download .large_screen_wrapper .left_block .txt { text-decoration: none; display: inline-block; font-size: 18px; color: #585858; margin: 0; padding: 15px 0 0 0 } .download .large_screen_wrapper .left_block .txt span { cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; border-bottom: 1px solid #ddd } .download .large_screen_wrapper .left_block .txt span:hover { color: #000; -webkit-transition: all 0.5s ease; transition: all 0.5s ease } .download .large_screen_wrapper .left_block .download_btn { font-size: 20px; color: #fff; padding: 10px 40px; margin: 0; background: #0abe51; font-family: proxima-semibold, Helvetica, Arial, sans-serif; border-radius: 4px 4px; vertical-align: middle; -webkit-transition: all 0.5s ease; transition: all 0.5s ease } .download .large_screen_wrapper .left_block .download_btn:hover { background: #08a145; -webkit-transition: all 0.5s ease; transition: all 0.5s ease } .download .large_screen_wrapper .left_block .mac.download_btn { padding: 15px 35px 15px 62px; border-radius: 6px 6px; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; background:#0abe51 url("https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/download-icon-8e5f2920.svg") 22px 14px no-repeat } .download .large_screen_wrapper .left_block .mac.download_btn:hover { -webkit-transition: all 0.5s ease; transition: all 0.5s ease } .download .large_screen_wrapper .left_block .linux_app_img { text-decoration: none; display: inline-block; width: 248px; height: 60px; margin: 0; padding: 0; background-size: cover; vertical-align: middle; cursor: pointer } .download .large_screen_wrapper .left_block .mac_app_img { text-decoration: none; display: inline-block; width: 248px; height: 60px; margin: 20px 0 0 0; padding: 0; background-size: cover; vertical-align: middle; cursor: pointer } .download .large_screen_wrapper .left_block .mac_direct_download { font-size: 20px; color: #fff; padding: 14px 31px 14px 70px; margin: 15px 0 0 0; border-radius: 5px 5px; vertical-align: middle; cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; font-family: proxima-regular, Helvetica, Arial, sans-serif } .download .large_screen_wrapper .left_block .mac_direct_download:hover { -webkit-transition: all 0.5s ease; transition: all 0.5s ease } .download .large_screen_wrapper .left_block .mac_app_img.mac_app_img_es { background-size: cover } .download .large_screen_wrapper .left_block .mac_app_img.mac_app_img_ru { background-size: cover } .download .large_screen_wrapper .left_block .mac_app_img.mac_app_img_br { background-size: cover } .download .large_screen_wrapper .install-block { font-family: proxima-regular, Helvetica, Arial, sans-serif; color: #585858 } .download .large_screen_wrapper .install-block .text { display: inline-block; font-size: 18px } .download .large_screen_wrapper .install-block .or-text { margin: 15px 0 10px 0 } .download .large_screen_wrapper .install-block .classic-block { margin: 15px 0 0 0; border: solid 1px #dedede; border-radius: 3px 3px; position: relative } .download .large_screen_wrapper .install-block .classic-text { display: inline-block; width: 220px; padding: 15px 10px; font-size: 16px; border-right: 1px solid #dedede; -webkit-box-sizing: border-box; box-sizing: border-box } .download .large_screen_wrapper .install-block .copy-img { display: inline-block; padding: 15px 30px 15px 10px; background-size: 20px 22px; cursor: pointer; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/icons-copy-9727ccbd.png) 10px 15px no-repeat; background-size: 20px 22px; opacity: 0.8; -webkit-box-sizing: border-box; box-sizing: border-box } .download .large_screen_wrapper .install-block .copy-img:hover { opacity: 1 } .download .large_screen_wrapper .install-block .copied { display: none; position: absolute; bottom: -17px; right: 0px; font-size: 12px; color: #666 } .download .large_screen_wrapper .install-block .copied.show { display: block } .download .large_screen_wrapper .right_block { -webkit-box-align: center; -ms-flex-align: center; align-items: center } .download .large_screen_wrapper .right_block .screen { display: inline-block; width: 100%; max-height: 615px; margin: 0; padding: 0; position: relative; right: -290px } .download .large_screen_wrapper .right_block .mac-img,.download .large_screen_wrapper .right_block .linux-img { max-width: 898px } .download .large_screen_wrapper .right_block .windows-img { max-width: 886px } .download .small_screen_block { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; text-align: center; -webkit-box-shadow: -1px -2px 27px #EAE5E5; box-shadow: -1px -2px 27px #EAE5E5; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row } .download .small_screen_block .left_block,.download .small_screen_block .right_block { display: inline-block; width: 50%; padding: 60px 10px } .download .small_screen_block .left_block h2,.download .small_screen_block .right_block h2 { display: block; font-size: 20px; color: #585858; line-height: 1.4; margin: 0 0 40px 0; padding: 0; font-weight: 400; letter-spacing: 3px; font-family: proxima-light, Helvetica, Arial, sans-serif } .download .small_screen_block .left_block h2 span,.download .small_screen_block .right_block h2 span { font-size: 30px; letter-spacing: 1px; font-family: proxima-regular, Helvetica, Arial, sans-serif } .download .small_screen_block .right_block { background: #f4f4f4 } .download .small_screen_block a.app-store { text-decoration: none; cursor: pointer; margin: 0 0 60px 0; padding: 0; height: 60px; width: 202px; display: inline-block; background-size: cover } .download .small_screen_block a.app-store.app-store-es { background-size: cover } .download .small_screen_block a.app-store.app-store-ru { background-size: cover } .download .small_screen_block a.app-store.app-store-br { background-size: cover } .download .small_screen_block a.google-play { text-decoration: none; cursor: pointer; margin: 0 0 60px 0; padding: 0; height: 60px; width: 202px; display: inline-block; background-size: cover } .download .small_screen_block a.google-play.google-play-es { background-size: cover } .download .small_screen_block a.google-play.google-play-ru { background-size: cover } .download .small_screen_block a.google-play.google-play-br { background-size: cover } .download .small_screen_block img { display: inline-block; } .download .small_screen_block .android-phone { display: inline-block; } .download .mac-process { display: none; padding: 180px 0 60px 0; width: 100%; text-align: center; overflow: hidden } .download .thank-you-block { padding-bottom: 60px } .download .thank-you-img { display: inline-block; background-size: 100%; width: 250px; height: 185px; margin-bottom: 20px } .download .thank-you-text { text-decoration: none; display: inline-block; font-size: 18px; color: #585858; margin: 0; padding: 5px 0 0 0 } .download .thank-you-text .borderDown { border-bottom: 1px solid #ddd } .download .thank-you-text span { cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease } .download .installation-step-block { width: 100%; max-width: 900px; margin: 0 auto; padding-top: 60px; border-top: 1px solid #ccc; overflow: hidden } .download .installation-step-block h5 { margin-bottom: 30px } .download .installation-step-block .unit-block { float: left; width: 100%; max-width: 300px; margin: 15px 0; text-align: left } .download .installation-step-block .count { float: left } .download .installation-step-block .right-content { float: left; width: 93%; padding-left: 10px } .download .installation-step-block .right-content span { font-size: 16px; color: #585858 } .download .installation-step-block .right-content span.title { display: block; font-weight: 600; margin-bottom: 10px } .download .installation-icon { display: inline-block; width: 40px; height: 40px; margin: 0 0 15px 15px } .download .open-file { background-size: 100% } .download .click-open { width: 45px; background-size: 100% } .download .drag-drop { width: 80px; background-size: 100% } .hs-download-page .body-container.container-fluid { padding: 0; } .flock-vs-slack3-page ._get-started .hs_error_rollup { left: 0; } .security-block ol li { padding-left: 26px; position: relative; } .security-block ol li:before { position: absolute; left: 0; } @media (min-width: 1600px) { .download .large_screen_block { margin:0 auto } } @media (max-width: 1150px) { .download .large_screen_wrapper{ padding: 70px 20px 60px 20px; } .download .large_screen_wrapper .right_block .screen{ right: 0; } } @media (min-width: 600px) and (max-width: 1024px) { .download .large_screen_wrapper .left_block { padding-left:15px } } @media (max-width: 767px) { .download .large_screen_wrapper { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .download .large_screen_wrapper .left_block { width: 100%; padding-left: 0; text-align: center; } .download .small_screen_block .left_block, .download .small_screen_block .right_block { display: block; width: 100%; padding: 60px 20px; } .download .small_screen_block { -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; } .widget-span.custom-footer-menu-signup { float: none !important; } /* .hs-home-main .custom-home-find-more a { font-size: 10px; padding: 5px; } */ .hs-home-main .custom-home-find-more p { font-size: 13px; line-height: 14px; } .hs-why-flock-layout.hs-why-flock4-page .header-section:after { bottom: 55px !important; } .hs-indexe-layout.hipchat-migration #main-area .small-font { font-size: 35px; } } @media (max-width: 675px) { .hs-home-layout.hipchat-migration.hs-home-main .home-page .block-content .right-section ._get-started { padding-bottom: 100px; } } @media (max-width: 380px) { .container-fluid #mail-header .row-fluid .page-center { padding: 10px 0px 8px 20px; } } /* ====== Why Flock4 ======== */ .hs-why-flock4-page .custom-menu-primary { display: none; } .why-flock4-gtr.gartner-wrap { position: relative; max-width: 1200px; z-index: 1001; margin: 0 auto; } .why-flock4-gtr.gartner-wrap .gartner-section { right: 10px; position: absolute; } .hs-why-flock4-page p.brand-title { border-top: 1px solid rgba(0,0,0,0.1) !important; } .why-flock4-gtr.gartner-wrap .gartner-section .gartner-badge { width: 122px; height: 112px; background: #262838; background-repeat: no-repeat; background-position: center; background-size: 100% 100%; display: inline-block; } .hs-why-flock4-page div#product { max-width: 900px; /* margin-top: -580px; */ } .hs-why-flock4-page .hs-why-flock4-sce2 .hs_cos_wrapper_type_module:first-child div#product h2.title { margin: 0 0 15px 0; font-size: 56px; } .hs-why-flock4-sce2 {} .hs-why-flock4-sce2 .hs_cos_wrapper_type_module:first-child #product { max-width: 900px; margin-top: -580px; } .hs-why-flock4-sce2 .screen-image-block { max-width: 900px !important; } .hs-why-flock4-sce2 h2.title { font-size: 42px; } .hs-why-flock4-sce2 .screen-image-block img.screen-image.screenImage1 { -webkit-box-shadow: 0 0 20px 0 rgba(0,0,0,0.2); box-shadow: 0 0 20px 0 rgba(0,0,0,0.2); } .hs-home-layout.hs-why-flock4-page #hs_cos_wrapper_widget_1555314460221 .custom-top-content { margin-top: 0; padding-top: 0; } .hs-why-flock4-page .gartner-award { max-width: 1020px !important; } .hs-why-flock4-page .case-study-videos .page-center { max-width: 1100px !important; } .hs-why-flock4-page.hs-why-flock-layout .hs-why-flock4-sce2 .get-started-v2 .actions .hs-button.primary.large{ background: #0c8e45; border-radius: 0 6px 6px 0; font-size: 16px; letter-spacing: 1px; margin-left: 0; text-align: center !important; padding: 15px 15px; } .hs-why-flock4-page.hs-why-flock-layout .hs-why-flock4-sce2 .get-started-v2.get-started-inline ._get-started .hs-input { border-radius: 0 !important; } @media (max-width:1000px){ .hs-indexa-page .custom-home-wrapper .bottom-get-started p.g-s-label { font-family: proxima-semibold, Helvetica, Arial, sans-serif; font-size: 28px; } .hs-why-flock4-page #header .page-center { text-align: left; padding-left: 10px; } .hs-why-flock4-page #header .page-center { text-align: left; padding-left: 10px; } .hs-why-flock-layout.hs-why-flock4-page .header-section:after { content: ""; background: url(https://4323997.fs1.hubspotusercontent-na1.net/hubfs/4323997/Flock_April2019/images/mast-head-3-mobile-1x-4bd3e39e-3.png) no-repeat 0 0; display: inline-block; width: 230px; height: 225px; background-size: 100% 100%; position: absolute; bottom: 55px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: 120px; top: auto !important; } .hs-why-flock-layout.hs-why-flock4-page .header-section { min-height: 645px; position: relative; } .hs-why-flock-layout.hs-why-flock4-page.hs-indexb-layout .testimonial-block { margin-top: -69px; } .hs-why-flock4-sce2 .hs_cos_wrapper_type_module:first-child #product { margin-top: 0; } .hs-why-flock4-page .hs-why-flock4-sce2 .hs_cos_wrapper_type_module:first-child div#product h2.title { font-size: 35px; color: #585858; line-height: 1.2; margin: 0 0 15px 0; padding: 0; font-family: 'proxima-semibold', 'Helvetica', 'Arial', sans-serif; letter-spacing: -0.5px; } .hs-why-flock4-page .award-section { padding: 40px 30px; } .hs-why-flock4-page .hs-why-flock4-sce2 .other-awards .section:last-child { margin-bottom: 50px; } .hs-why-flock4-page.hs-home-layout .hs-why-flock4-sce2 ._g-s-mobile a._g-s-button.js-mobile-download { background: #0c8e45; } .hs-why-flock4-page.hs-home-layout .hs-why-flock4-sce2 ._g-s-mobile a._g-s-button.js-mobile-download:hover { background: #08a145; } .hs-why-flock4-page .hs-why-flock4-sce2 .hs_cos_wrapper_type_module:first-child .custom-top-content.custom-top-video-section.unit { padding-bottom: 70px; } } @media (max-width:419px){ .hs-team-layout .body-container { padding-left: 20px; padding-right: 20px; } } @media (max-width:350px){ .hs-home-main .custom-home-find-more p { max-width: 130px; } } /* ========= News ========== */ .hs-news-page .body-container { padding-left: 0; padding-right: 0; } .hs-press-wrapper { text-align: center; margin-top: -8px; } .hs-press-wrapper h3.caption {} .press-list { display: block; float: left; margin: 20px 0 0; } .hs-press-wrapper .press-list a { float: left; width: 100%; font-size: 1.6em; margin-bottom: 10px; font-weight: 100; color: #585858 !important; -webkit-box-sizing: border-box; box-sizing: border-box; border-bottom: 1px solid #ccc; padding: 15px 0; text-decoration: none; text-align: center; } .hs-press-wrapper .press-list a:hover { text-decoration: underline; } .hs-press-wrapper .press-list a p { margin: 0; padding: 0 10px 20px 10px; font-size: 16px; text-align: center; line-height: 24px; } .hs-press-wrapper .press-list a .divider { display: inline-block; width: 100px; height: 1px; background: #ccc; } .hs-press-wrapper .press-list .logo-block { display: block; width: 100%; } .hs-press-wrapper .logo-wrap { display: block; text-align: center; padding: 32px 0 10px 0; } .hs-press-wrapper .press-list .logo-block .logo-wrap { display: inline-block; } .hs-press-wrapper .press-list .press-icon { background-position: center; background-repeat: no-repeat; background-size: 100%; display: block; height: 70px; width: 200px; margin: 0 auto; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .hs-news-main-content { padding: 0 10px; margin-top: 40px; } .hs-article-wrapper h2.title { text-align: left; border: none !important; font-size: 26px !important; font-weight: 400; padding: 0; color: #585858; } .hs-news-right-col h3 { font-size: 26px !important; margin: 0 0 15px 0; padding: 0; text-align: left; line-height: 1.2; font-weight: 400 !important; } .hs-news-right-col p { display: block; margin: 0 0 35px; padding: 0; font-size: 16px; color: #585858; line-height: 24px; } .hs-news-right-col p a { color: #337ab7; text-decoration: none; } .hs-news-right-col p a:hover { color: #23527c; text-decoration: underline; } .hs-news-main-content .span9.widget-span.widget-type-cell.hs-news-left-col, .hs-news-main-content .span3.widget-span.widget-type-cell.hs-news-right-col { float: none; width: 100%; margin: 0; } .hs-article-wrapper .article-box { display: block; overflow: hidden; margin-bottom: 20px; line-height: 24px; } .hs-article-wrapper .article-item { text-align: left; margin: 0 0 25px; font-weight: 100; } .hs-article-wrapper .article-item a { font-size: 16px; cursor: pointer; line-height: 20px; font-family: proxima-regular, Helvetica, Arial, sans-serif; color: #337ab7; text-decoration: none; } .hs-article-wrapper .article-item a:hover { color: #23527c; text-decoration: underline; } .hs-article-wrapper .article-item p { font-size: 16px; margin: 0; padding: 0; color: #4b4b4b; line-height: 24px; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .hs-article-wrapper .nav-bar { float: left; width: 100%; border-top: 1px solid #ccc; padding-top: 15px } .hs-article-wrapper .nav-bar ul.articles-pag { width: 100%; list-style: none; display: -webkit-box; display: -ms-flexbox; display: flex; list-style: none; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 0; padding: 0; } .hs-article-wrapper .nav-bar li { display: inline-block; vertical-align: top; font-size: 16px; margin: 0; padding: 0; } .hs-article-wrapper .nav-bar li>a { display: inline-block; text-align: center; display: block; width: 40px; height: 35px; line-height: 21px; border: 1px solid #E4E3E3; border-radius: 6px; cursor: pointer } .hs-article-wrapper .nav-bar li>a:hover { border-color: #c1c1c1 } .hs-article-wrapper .nav-bar li>a.pag-total { border: none; font-family: proxima-regular, Helvetica, Arial, sans-serif } .hs-article-wrapper .nav-bar li>a.pag-total:hover { border-color: transparent } .hs-article-wrapper .nav-bar .icon-arrow { display: inline-block; width: 15px; height: 20px; position: relative; cursor: pointer } .hs-article-wrapper .nav-bar .icon-arrow:before { content: ""; position: absolute; width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 10px solid #20BE53; top: 6px; left: 4px } .hs-article-wrapper .nav-bar .icon-arrow:after { content: ""; position: absolute; width: 0; height: 0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 10px solid #fff; top: 6px; left: 2px } .hs-article-wrapper .nav-bar .icon-pag-prev { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg) } .hs-article-wrapper .nav-bar .icon-pag-prev:before { top: -6px; left: 4px } .hs-article-wrapper .nav-bar .icon-pag-prev:after { top: -6px; left: 2px } .hs-article-wrapper .nav-bar li>a.pag-total { width: auto; color: #4b4b4b; cursor: default } .hs-indexa-page .custom-home-banner .hs-error-msgs { bottom: -25px; text-align: left; position: absolute; width: 100%; } .hs-indexa-page .custom-home-banner .hs_error_rollup { left: 0px; width: 100%; bottom: -8px; } @media only screen and (min-width: 1024px){ .hs-press-wrapper .press-list a { display: inline-block; position: relative; color: #4b4b4b !important; border-bottom: 1px solid #ccc; width: 33%; float: left; min-height: 260px; margin-bottom: 50px; padding-left: 1%; padding-right: 1%; padding-bottom: 0; } .hs-press-wrapper .press-list a p { font-size: 18px; padding: 10px 10px 0 10px; min-height: 79px; } .hs-press-wrapper .press-list .logo-block { height: 100px; position: relative; } .hs-press-wrapper .press-list .logo-block .logo-wrap { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); vertical-align: bottom; text-align: center; } .hs-press-wrapper .press-item:nth-child(3n+2):before, .hs-press-wrapper .press-item:nth-child(3n+2):after { content: ""; position: absolute; top: -5px; left: 0; background: #ccc; height: 85%; margin-bottom: 10px; width: 1px; } .hs-press-wrapper .press-item:nth-child(3n+2):after { left: auto; right: 0; } .hs-press-wrapper .press-list a.press-item:nth-child(n+4) { border-bottom: none; } .hs-article-wrapper h2.title { margin: 0 0 30px 0 !important; line-height: 24px !important; } .hs-news-main-content .span9.widget-span.widget-type-cell.hs-news-left-col { float: left; width: 74%; padding-right: 60px; } .hs-news-main-content .span3.widget-span.widget-type-cell.hs-news-right-col { float: right; text-align: left; width: 25%; margin: 0 0 50px 0; } .hs-article-wrapper .article-item { margin: 0 0 35px; } .hs-article-wrapper .article-item a, .hs-article-wrapper .article-item p { font-size: 18px; } } @media only screen and (max-width: 1024px){ .hs-news-page .body-container { padding-top: 30px; } .hs-press-wrapper .press-list a p { padding-bottom: 14px; } .hs-press-wrapper .press-list .logo-block .logo-wrap { padding-top: 34px; padding-bottom: 4px; } .hs-article-wrapper h2.title { margin: 20px 0 30px 0; } .hs-news-main-content .span3.widget-span.widget-type-cell.hs-news-right-col { margin: 50px 0 30px 0; } } @media only screen and (max-width: 1000px){ .hs-news-page .body-container { padding-top: 54px; } .hs-home-main .custom-home-wrapper .bottom-get-started p.g-s-label { font-weight: 700 !important; } } .why-flock5 .get-started-inline h3 { letter-spacing: -0.8px; font-size: 28px; text-align: left; line-height: 1.2; font-family: proxima-semibold, Helvetica, Arial, sans-serif; margin: 0 0 30px 0; vertical-align: middle; color: #585858; } .why-flock5 .get-started-inline p._g-s-label { font-family: proxima-semibold, Helvetica, Arial, sans-serif; color: #585858 !important; margin: 0 0 30px 0; vertical-align: middle; font-size: 22px; position: relative; line-height: 1.4; letter-spacing: -0.8px; } @media (min-width: 1000px) { .why-flock5 .get-started-inline h3 { font-size: 36px; line-height: 50px; margin: 0 20px 0px 0; } .why-flock5 .get-started-inline ._g-s-mobile { display: none; } .why-flock5 .get-started-inline a { font-weight: 600; color: #585858; /*Gaurang: Removed important*/ text-decoration: none!important; } .why-flock5 .get-started-inline p._g-s-label{ display: none; } .flock-vs-slack2 .custom-need-more { padding-left: 10px; padding-right: 10px; } .range-block .wrapper { padding: 75px 40px; } } @media (max-width: 999px) { .flock-vs-slack2 #header:not(.fixedNav) .page-center { text-align: left; padding: 10px; } .why-flock-rmkt .team-unit.wide.hs-tabber-group h2 { font-size: 28px; color: #585858; line-height: 40px; margin: 0 0 40px; font-weight: 400; letter-spacing: normal; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .why-flock5 .flock-vs-slack-banner .icon-section .icons.flock-users-icon { width: 75px !important; height: 30px; margin: 0 4px 0 !important; transform: none !important; background-position: center; } .flock-vs-slack2 #header .logo { text-align: left; } } /* ====== Flockathaon Page ====== */ body.flockathon-page { padding: 0; } .flockathon-page #header { background: transparent; } .flockathon-page #header.fixedNav { background: #fff; } .flockos-banner { display: block; width: 100%; background-size: cover; min-height: 450px; position: relative; background-repeat: no-repeat; background-position: 0 0; margin-top: -1px; } .flockos-banner .flockos-wrap { display: block; max-width: 905px; margin: 0 auto; } .flockos-banner .left-block .logo { display: inline-block; width: 200px; margin-bottom: 10px; } .flockos-banner .flockos-detail { text-align: center; width: 100%; padding-top: 50px; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); display: block; } .flockos-banner .left-block { display: inline-block; padding: 10px; -webkit-box-sizing: border-box; box-sizing: border-box; vertical-align: top; } .flockos-banner .left-block h3 { font-size: 23px; color: #fff; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .flockos-banner .right-block { display: inline-block; padding: 10px; -webkit-box-sizing: border-box; box-sizing: border-box; } .flockos-banner .right-block h1 { font-size: 32px; color: #fff; font-family: proxima-semibold, Helvetica, Arial, sans-serif; line-height: 1.4; } .flockathon-page .body-container { padding: 0; } .flockathon-row-wrapper .page-center { padding: 30px 15px; } .flockathon-flexi .inner-block p { display: block; color: #585858; font-size: 18px; line-height: 26px; padding: 0 0 20px 0; margin: 0; } .flockathon-flexi .inner-block p a { text-decoration: none; color: #0abe51; margin: 0; padding: 0; cursor: pointer; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .flockathon .underline-break { display: block; text-align: center; } .flockathon .underline-break .underline { display: inline-block; width: 100px; height: 2px; margin: 40px 0; background: #0abe51; } .flockathon .upcoming-flockathon { display: block; padding: 20px 0 0 0; overflow: hidden; } .flockathon .form-block { float: left; width: 100%; display: block; padding: 50px 10px 50px; margin-bottom: 20px; background: #f7f7f7; position: relative; } .flockathon .upcoming-flockathon h2 { display: block; font-size: 26px; color: #585858; font-family: proxima-semibold, Helvetica, Arial, sans-serif; padding: 0 0 40px 0; margin: 0; line-height: 1.4; text-align: center; letter-spacing: -0.5px; } .flockathon .form-block form { position: relative; display: block; max-width: 600px; margin: 0 auto; text-align: center; } .flockathon .form-block .hs-form-required { display: none; } .flockathon .form-block .form-title { margin: 0; } .flockathon .form-block .hs-input { display: block; width: 100%; padding: 15px 20px; font-size: 20px; color: #585858; line-height: 30px; background: #fff; border-radius: 6px 6px; font-family: inherit; border-radius: 6px 6px; } .flockathon .form-block .hs-form-field { display: inline-block; float: none; width: 100%; max-width: 400px; margin-bottom: 20px; margin-bottom: 0; position: relative; } .flockathon .form-block .hs_submit { float: none; display: inline-block; } .flockathon .form-block .hs-button { padding: 15px 20px; margin: 0; color: #fff; font-size: 22px; line-height: 32px; font-family: proxima-semibold, Helvetica, Arial, sans-serif; border: none; border-radius: 4px 4px; background: #0abe51; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; cursor: pointer; display: block; min-width: 200px; } .flockathon .form-block .hs-button:hover { opacity: 0.8; } .flockathon .form-block .hs_error_rollup { position: absolute; bottom: -12px; } .flockathon .form-block form:after { content: ""; clear: both; display: table; } .flockathon .form-block .hs-error-msgs { font-size: 12px; color: #d96d6d; } .flockathon .form-block .hs-input.error { border-color: #d96d6d; } .flockathon .video-block { display: block; text-align: center; font-family: proxima-light, Helvetica, Arial, sans-serif; margin: 20px 40px 20px 40px; } .flockathon .video-block h2 { font-size: 22px; color: #585858; margin: 0 0 40px 0; padding: 0; line-height: 1.4; font-family: proxima-semibold, Helvetica, Arial, sans-serif; letter-spacing: -0.5px; } .flockathon .video-wrap { margin: 0 auto; } .flockathon .video-wrap .img-container { z-index: 1; cursor: pointer; } .flockathon .video-wrap .image-box { -webkit-box-shadow: 0px 1px 10px rgba(0,0,0,0.5); box-shadow: 0px 1px 10px rgba(0,0,0,0.5); display: inline-block; position: relative; margin: 5px; } .flockathon .video-wrap .content { max-width: 100%; } .flockathon .video-wrap .video-play-btn { width: 70px; position: absolute; top: 50%; left: 50%; margin: auto; cursor: pointer; -webkit-transition: all 0.5s ease; transition: all 0.5s ease; -ms-transform: translate(-50%, -50%) scale(0.9); -webkit-transform: translate(-50%, -50%) scale(0.9); transform: translate(-50%, -50%) scale(0.9); z-index: 4; } .flockathon .video-wrap .image-box:after { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition: all 1s; -webkit-transition: all 1s; z-index: 1; background: rgba(0,0,0,0.01); } .flockathon .video-wrap .image-box:hover:after { background: rgba(0,0,0,0.3); cursor: pointer; } .flockathon .flockathon-nav-slider { width: 100%; margin: 40px 0 0 0; } .flockathon .flockathon-nav-slider .wrap { position: relative; } .flockathon .flockathon-nav-slider .wrap img { width: 100%; opacity: 0.85; } .flockathon .flockathon-nav-slider .slick-current img { opacity: 1; } .flockathon .flockathon-nav-slider .now-playing { display: none; } .flockathon .flockathon-nav-slider .slick-current .now-playing { display: block; width: 100%; position: absolute; bottom: 0px; border-bottom: 3px solid #0abe51; } .flockathon .flockathon-nav-slider .caption { display: block; text-align: center; font-size: 14px; color: #999; padding: 10px 5px; font-family: proxima-regular, Helvetica, Arial, sans-serif; } .flockathon .flockathon-nav-slider .slick-current .caption { color: #585858; opacity: 0.8; } .flockathon .flockathon-nav-slider .slide { margin: 0px 5px; cursor: pointer; } .flockathon .flockathon-nav-slider .slick-active:hover img { opacity: 1; } .flockathon .step-row { display: block; width: 100%; overflow: hidden; padding: 20px 0; text-align: left; } .flockathon .step-row .step-unit { float: left; display: inline-block; width: 100%; } .flockathon .step-row h3 { font-size: 28px; color: #585858; margin: 0 0 20px 0; padding: 0; line-height: 1.4; font-family: proxima-semibold, Helvetica, Arial, sans-serif; letter-spacing: -0.5px; } .flockathon .step-row ul { display: block; margin: 0; padding: 0 0 0 20px; text-align: left; } .flockathon .step-row ul li { display: list-item; list-style: disc; margin: 0; padding: 0 25px 10px 0; color: #585858; font-size: 18px; line-height: 26px; } .flockathon .step-row ul a { text-decoration: none; color: #0abe51; margin: 0; padding: 0; cursor: pointer; font-family: proxima-semibold, Helvetica, Arial, sans-serif; } .flockathon .step-row .top-content h2 { font-size: 36px; color: #585858; margin: 0 0 40px 0; padding: 0; line-height: 1.4; font-family: proxima-semibold, Helvetica, Arial, sans-serif; letter-spacing: -0.5px; text-align: center; } .flockathon .step-row h3 span { color: #0abe51; } .flockathon .step-row .top-content h2 + p { display: block; color: #585858; font-size: 18px; line-height: 26px; padding: 0 0 20px 0; margin: 0; } .flockathon .step-row ul ul { padding-top: 5px; } .flockathon .step-row ul ul li { color: #999; } .flockathon .step-row ul ul li span { color: #585858; } .flockathon .flockathon-nav-slider .slick-prev, .flockathon .flockathon-nav-slider .slick-next { font-size: 0; line-height: 0; position: absolute; display: block; padding: 0; -ms-transform: translate(0, -50%); -webkit-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; background: transparent; width: 30px; height: 60px; -ms-transform: scale(0.7); -webkit-transform: scale(0.7); transform: scale(0.7); top: 24%; bottom: auto; } .flockathon .flockathon-nav-slider .slick-prev { left: -40px; } .flockathon .flockathon-nav-slider .slick-next { right: -40px; } @media (min-width: 1000px){ .flockos-banner { background-size: cover; min-height: 600px; background-repeat: no-repeat; background-position: 0 0; } .flockos-banner .flockos-detail { padding: 0; } .flockos-banner .left-block { padding: 15px 19px 0 0; text-align: left; } .flockos-banner .left-block .logo { width: 300px; margin: 0; } .flockos-banner .right-block { border-left: 1px solid #fff; padding: 15px 0 15px 19px; text-align: left; } .flockos-banner .right-block h1 { font-size: 57px; line-height: 1.1; } .flockathon-row-wrapper .page-center { padding: 80px 20px 60px; margin: 0 auto; max-width: 1100px; } .flockathon .form-block { padding: 50px 0 50px; } .flockathon .form-block .hs-form-field { float: left; width: 390px; } .flockathon .form-block .hs_submit { margin: 0 0 5px 0; float: right; } .flockathon .video-block h2 { font-size: 36px; margin: 0 0 40px 0; } .flockathon .video-wrap .image-box { -webkit-box-shadow: 0px 2px 20px rgba(0,0,0,0.5); box-shadow: 0px 2px 20px rgba(0,0,0,0.5); margin: 10px 0; } .flockathon .video-wrap .content { max-width: 800px; } .flockathon .video-wrap .video-play-btn { width: 159px; } .flockathon .flockathon-nav-slider { width: 85%; margin: 40px auto 0; } .flockathon .flockathon-nav-slider .caption { font-size: 16px; } .flockathon .step-row .step-unit { width: 50%; } } @media (max-width: 1000px) and (min-width: 768px){ .flockos-banner .right-block { border-left: 1px solid #fff; padding: 20px 0 22px 20px; } .flockathon .video-wrap .video-play-btn { width: 129px } } @media (max-width: 999px){ .flockathon .form-block .hs_submit { display: block; } .flockathon .form-block .hs-form-field { display: block; margin: 0 auto 0; } .flockathon .form-block .hs-button { margin: 30px auto 5px; } .flockathon .step-row .step-unit.left-col { margin-bottom: 20px; } .flockathon .form-block .hs_error_rollup { position: static; max-width: 400px; margin: 0 auto; } }