Profile Picture
Akshay Joshi

Metric – Header with Mega Menu

Header featuring a mega menu with an optional inverted color scheme.
Copy component
Download JSON
{"id":791,"name":"metric-header-with-css","title":"Metric Header WITH CSS","date":"2025-05-24 13:32:20","date_formatted":"May 24, 2025","author":{"name":"AK_Developer_25","avatar":"https:\/\/secure.gravatar.com\/avatar\/4895fa216fc2f1ee16e6575899e50eb2388264a879a9791a3ad02c7bed840715?s=60&d=mm&r=g","url":"https:\/\/gallopbiz.in\/ak-dev"},"permalink":"https:\/\/gallopbiz.in\/ak-dev\/template\/metric-header-with-css\/","thumbnail":null,"bundles":[],"tags":[],"type":"header","header":[{"id":"278c1a","name":"section","parent":0,"children":["00c011"],"settings":{"_cssGlobalClasses":["plfkyu"],"_background":{"color":{"hex":"#ffffff","id":"kozymr","name":"White"}},"_padding:small_display_laptop":{"top":"20","bottom":"20"},"_zIndex":"9999"},"label":"Header WITH CSS"},{"id":"00c011","name":"container","parent":"278c1a","children":["ccfc6e","485827","dbcb09"],"settings":{"_direction:mobile_landscape":"row","_flexWrap:mobile_landscape":"nowrap","_justifyContent:mobile_landscape":"space-between","_padding:mobile_landscape":{"right":"0","top":"0","bottom":"0","left":"0"},"_cssGlobalClasses":["qresdr","zkwsfn"]}},{"id":"ccfc6e","name":"image","parent":"00c011","children":[],"settings":{"image":{"id":755,"filename":"Logo-1-1.svg","size":"full","full":"https:\/\/gallopbiz.in\/ak-dev\/wp-content\/uploads\/2025\/05\/Logo-1-1.svg","url":"https:\/\/gallopbiz.in\/ak-dev\/wp-content\/uploads\/2025\/05\/Logo-1-1.svg"},"_cssGlobalClasses":["uqudug"],"link":"url","url":{"type":"meta","useDynamicData":"https://bricksboard.com"}},"label":"logo","themeStyles":[]},{"id":"485827","name":"block","parent":"00c011","children":["5ab475"],"settings":{"_alignItems:small_display_laptop":"flex-end","_cssGlobalClasses":["exozjy"]},"label":"Menu"},{"id":"5ab475","name":"nav-nested","parent":"485827","children":["f2ef17","cb322c"],"settings":{"_cssGlobalClasses":["hqjezt"],"mobileMenu":"tablet_portrait","itemPadding:small_display_laptop":{"top":"10","bottom":"10"},"itemTypographyActive":{"font-weight":"500"}},"themeStyles":[]},{"id":"f2ef17","name":"block","parent":"5ab475","children":["3edb0b","676385","38232f","0168fc","1e2fc1"],"settings":{"tag":"ul","_hidden":{"_cssClasses":"brx-nav-nested-items"},"_cssGlobalClasses":["zuutde"],"_display:mobile_landscape":"flex","_rowGap:small_display_laptop":"15","_justifyContent:tablet_portrait":"flex-start"},"label":"Nav items","cloneable":false,"deletable":false},{"id":"3edb0b","name":"dropdown","parent":"f2ef17","children":["34a3b5"],"settings":{"text":"Services","megaMenu":true,"_cssGlobalClasses":["sklipq"]},"label":"Service mega menu 2","themeStyles":[]},{"id":"34a3b5","name":"div","parent":"3edb0b","children":["a44e17"],"settings":{"_cssGlobalClasses":["fkeknx"],"_hidden":{"_cssClasses":"brx-dropdown-content"}},"label":"Content","cloneable":false,"deletable":false},{"id":"a44e17","name":"block","parent":"34a3b5","children":["c03de1","2a4f8e","f604b1"],"settings":{"_cssGlobalClasses":["zlpzls"]}},{"id":"c03de1","name":"div","parent":"a44e17","children":["548015"],"settings":{"_cssGlobalClasses":["eazkma"],"tag":"a","link":{"type":"meta","postId":"497","useDynamicData":"#"}},"label":"Consulting On-Demand"},{"id":"548015","name":"heading","parent":"c03de1","children":[],"settings":{"text":"Implementation","tag":"custom","customTag":"span","_cssGlobalClasses":["diqwyd"]}},{"id":"2a4f8e","name":"div","parent":"a44e17","children":["5a0aa9"],"settings":{"_cssGlobalClasses":["eazkma"],"tag":"a","link":{"type":"meta","postId":"497","useDynamicData":"#"}},"label":"Consulting On-Demand"},{"id":"5a0aa9","name":"heading","parent":"2a4f8e","children":[],"settings":{"text":"Implementation","tag":"custom","customTag":"span","_cssGlobalClasses":["diqwyd"]}},{"id":"f604b1","name":"div","parent":"a44e17","children":["9c391f"],"settings":{"_cssGlobalClasses":["eazkma"],"tag":"a","link":{"type":"meta","postId":"497","useDynamicData":"#"}},"label":"Consulting On-Demand"},{"id":"9c391f","name":"heading","parent":"f604b1","children":[],"settings":{"text":"Implementation","tag":"custom","customTag":"span","_cssGlobalClasses":["diqwyd"]}},{"id":"676385","name":"text-link","parent":"f2ef17","children":[],"settings":{"text":"About","_cssGlobalClasses":["sklipq"],"link":{"type":"internal","url":"#","postId":"493"}},"label":"About","themeStyles":[]},{"id":"38232f","name":"text-link","parent":"f2ef17","children":[],"settings":{"text":"Insights","_cssGlobalClasses":["sklipq"],"link":{"type":"external","url":"#"}},"label":"Resources","themeStyles":[]},{"id":"0168fc","name":"text-link","parent":"f2ef17","children":[],"settings":{"text":"Customer","_cssGlobalClasses":["sklipq"],"link":{"type":"external","url":"#"}},"label":"Customer","themeStyles":[]},{"id":"1e2fc1","name":"button","parent":"f2ef17","children":[],"settings":{"text":"Get your campaign analysis","_cssGlobalClasses":["ulikfi","crzekv","gyltsw"],"link":{"type":"external","url":"#"},"_display":"none","_display:mobile_portrait":"block"},"label":"Mobile Button"},{"id":"cb322c","name":"toggle","parent":"5ab475","children":[],"settings":{"animation":"spring","_cssGlobalClasses":["ocvzwn"],"icon":{"library":""}},"label":"Toggle Mobile bar with CSS","themeStyles":[]},{"id":"dbcb09","name":"button","parent":"00c011","children":[],"settings":{"text":"Get your campaign analysis","_cssGlobalClasses":["ulikfi","crzekv","gyltsw"],"link":{"type":"external","url":"#"},"_display:mobile_portrait":"none"},"label":"Web Button"}],"templateType":"header","global_classes":[{"id":"ulikfi","name":"metric-btn_dark","settings":{"_background":{"color":{"hex":"#171717"}},"_padding":{"top":"10","right":"32","bottom":"10","left":"32"},"_typography":{"color":{"hex":"#ffffff"},"font-size":"16","font-weight":"500"},"_border":{"radius":{"top":"50","right":"50","bottom":"50","left":"50"}},"_heightMin":"56","_background:hover":{"color":{"hex":"#000000","rgb":"rgba(0, 0, 0, 0.73)","hsl":"hsla(0, 0%, 0%, 0.73)"}},"_heightMin:mobile_portrait":"48"}},{"id":"qresdr","name":"metric-default-container","settings":{"_width":"1728","_rowGap":"45"}},{"id":"crzekv","name":"metric-btn_border","settings":{"_border":{"width":{"left":"1","top":"1","right":"1","bottom":"1"},"style":"solid","radius":{"top":"E1E1E1"},"color":{"hex":"#e1e1e1"}},"_background":{"color":{"hex":"#000000","rgb":"rgba(0, 0, 0, 0)","hsl":"hsla(0, 0%, 0%, 0)"}},"_typography":{"color":{"hex":"#171717"}},"_typography:hover":{"color":{"hex":"#ffffff"}}}},{"id":"uqudug","name":"cust-header-logo","settings":{"_width":"200","_order:tablet_portrait":"1","_width:tablet_portrait":"150","_width:mobile_landscape":"110"},"modified":1748033073,"user_id":1,"_exists":false},{"id":"hqjezt","name":"cust-nestable-nav","settings":{"itemTypography:hover":{"color":{"id":"acss_import_tertiary-ultra-dark","name":"tertiary-ultra-dark","raw":"var(--tertiary-ultra-dark)"}},"itemTypography:active":{"color":{"id":"acss_import_tertiary-ultra-dark","name":"tertiary-ultra-dark","raw":"var(--tertiary-ultra-dark)"},"font-weight":"600"},"itemTypography":{"font-size":"15","font-weight":"400","color":{"hex":"#4c4c4c"}},"mobileMenuJustifyContent:small_display_laptop":"flex-start","gap:small_display_laptop":"35","itemTypographyActive":{"font-size":"16","font-weight":"500","color":{"hex":"#171717"}},"itemPadding":{"top":"10","bottom":"10"},"dropdownTypography:tablet_portrait":{"font-size":"20","font-weight":"400"},"itemTypography:tablet_portrait":{"font-size":"28","font-weight":"400"},"iconPosition:tablet_portrait":"left","itemTypography:mobile_portrait":{"font-size":"24"},"dropdownTypography:mobile_portrait":{"font-size":"16"},"itemPadding:tablet_portrait":{"bottom":"40","top":"40"},"itemTypographyActive:tablet_portrait":{"font-weight":"400","font-size":"28"},"dropdownTypography":{"font-weight":"400"},"itemTypographyActive:mobile_portrait":{"font-size":"24"}},"modified":1748088078,"user_id":1,"_exists":false},{"id":"zuutde","name":"nav-item-cust","settings":{"_padding:mobile_landscape":{"left":"20","right":"20","bottom":"20"},"_display":"flex","_margin:small_display_laptop":{"top":"73"},"_padding:small_display_laptop":{"left":"40","right":"40","top":"30"},"_margin:tablet_portrait":{"top":"100"},"_padding:tablet_portrait":{"left":"5%","right":"5%","top":"5%"},"_typography:tablet_portrait":{"font-weight":"400"}},"modified":1747746386,"user_id":1,"_exists":false},{"id":"sklipq","name":"cust-nav-item","settings":{"_alignItems:tablet_portrait":"flex-start","_border:tablet_portrait":{"style":"solid","color":{"hex":"#313131"},"width":{"bottom":"1"}},"_typography:tablet_portrait":{"font-weight":"400"},"_width:tablet_portrait":"100%"},"_exists":false,"modified":1748088078,"user_id":1},{"id":"fkeknx","name":"cust-mega-menu-content","settings":{"_direction":"row","_padding":{"top":"30","right":"30","bottom":"30","left":"30"},"_boxShadow":{"values":{"offsetX":"0","offsetY":"12","blur":"10","spread":"4"},"color":{"hex":"#150417","rgb":"rgba(21, 4, 23, 0.15)","hsl":"hsla(294, 70%, 5%, 0.15)"}},"_background":{"color":{"hex":"#ffffff","id":"kozymr","name":"White"}},"_width":"400","_widthMax":"400","_padding:mobile_landscape":{"top":"30","left":"20","right":"30","bottom":"20"},"_widthMin:small_display_laptop":"100%","_width:small_display_laptop":"100%","_widthMax:small_display_laptop":"auto","_cssCustom":"@media only screen and (min-width:1200px){\n.cust-mega-menu-content{\nmin-width: auto!important;\n left:0!important;\n}\n}","_direction:mobile_landscape":"column","_border":{"radius":{"top":"8px","right":"8px","bottom":"8px","left":"8px"},"width":{"top":"1","left":"1","right":"1","bottom":"1"},"style":"solid","color":{"hex":"#ececfd","rgb":"rgba(236, 236, 253, 0.45)","hsl":"hsla(240, 81%, 96%, 0.45)"}},"_columnGap":"30","_boxShadow:tablet_portrait":{"values":{"offsetX":"0","offsetY":"0","blur":"0","spread":"0"}},"_border:tablet_portrait":{"width":{"top":"0","right":"0","bottom":"0","left":"0"},"radius":{"right":"0","bottom":"0","top":"0","left":"0"}},"_padding:tablet_portrait":{"left":"42"},"_width:tablet_portrait":"100%","_widthMax:tablet_portrait":"100%"},"_exists":false,"modified":1747751736,"user_id":1},{"id":"zlpzls","name":"cust-mega-menu-block","settings":{"_rowGap":"20"},"_exists":false},{"id":"eazkma","name":"cust-mega-menu-submenu-navitem","settings":{"_display":"flex","_alignItems":"flex-start","_columnGap":"10"},"_exists":false},{"id":"diqwyd","name":"cust-mega-menu-nav-heading","settings":[],"_exists":false},{"id":"ocvzwn","name":"cust-menu-toggle","settings":{"_zIndex:small_display_laptop":"999999","_border":{"radius":{"top":"50%","right":"50%","bottom":"50%","left":"50%"},"width":{"left":"1","right":"1","top":"1","bottom":"1"},"style":"solid","color":{"hex":"#e1e1e1"}},"_width:tablet_portrait":"40","_height:tablet_portrait":"40","_justifyContent:tablet_portrait":"center","_alignItems:tablet_portrait":"center","_alignSelf:tablet_portrait":"center","iconSize:tablet_portrait":"11","_cssCustom:tablet_portrait":".cust-menu-toggle span.brxa-inner {\n width: 0 !important;\n}\n.cust-menu-toggle .brxa-inner:after, .cust-menu-toggle .brxa-inner:before{\nwidth:21px;\n}\n.cust-menu-toggle .brxa-inner:before {\n top: 5px;\n left: 9px;\n}\n.cust-menu-toggle .brxa-inner:after {\n top: 14px;\n left: 9px;\n}\n"},"_exists":false},{"id":"plfkyu","name":"metric-header","settings":{"_padding":{"left":"5%","right":"5%","top":"10","bottom":"10"},"_cssCustom":".cust-nestable-nav.brxe-nav-nested .brx-nav-nested-items > li:active > a {\n\n font-weight: 400!important;\n}","_cssCustom:tablet_portrait":".no-scroll .metric-header .brx-submenu-toggle {\n width: 100%;\n display: flex;\n justify-content: flex-end!important\n}\n .metric-header_btn {\n padding: 10px !important;\n font-size: 16px !important;\n width: max-content !important;\n}\n .metric-header .cust-nestable-nav.brxe-nav-nested .brx-nav-nested-items > li:active > a {\n \n font-weight: 400!important;\n}\n.no-scroll .metric-header .brx-submenu-toggle span {\n font-weight: 400 !important;\n}\n\/**BELOW---black background and white text**\/\n\/***comment this style completely if you want white background and black text**\/\n\nbody.no-scroll {\n background: #171717 !important;\n}\n.no-scroll .metric-header button, \n.no-scroll .metric-header li, \n.no-scroll .metric-header a,\n.no-scroll .metric-header span{\n color: white!important;\n}\n.no-scroll .cust-mega-menu-content a,\n.no-scroll .cust-mega-menu-content li,\n.no-scroll .cust-mega-menu-content button{\ncolor:#909090 !important\n}\n\n.no-scroll .metric-header {\n background-color: #171717!important;\n}\n.no-scroll .cust-header-logo {\n filter: invert(100%);\n}\n\n.no-scroll .nav-item-cust,\n.no-scroll .cust-mega-menu-content {\nbackground-color:#171717!important;\n}\n\n.no-scroll .metric-header_btn {\n background-color: #232323 !important;\n z-index: 1111;\n color: white!important;\n}\n.no-scroll .metric-header .brx-submenu-toggle {\n width: 100%;\n display: flex;\n justify-content: flex-end!important\n}\n\n.no-scroll .metric-header .cust-menu-toggle {\n background-color: #232323;\n}\n\n@media only screen and (max-width:478px){\n.no-scroll .metric-header_btn {\n padding: 10px !important;\n font-size: 16px !important;\n width: max-content !important;\n border: 1px solid #fff !important;\nbackground-color: #232323!important;\n}\n}\n\/************************\n************************\/\n"},"modified":1748093496,"user_id":1},{"id":"zkwsfn","name":"metric-header_container","settings":{"_alignSelf":"center","_justifyContent":"space-between","_alignItems":"center","_direction":"row"}},{"id":"exozjy","name":"metric-menu","settings":{"_alignSelf":"center","_justifyContent":"center","_alignItems":"center","_order:tablet_portrait":"3","_widthMax:tablet_portrait":"51","_alignItems:tablet_portrait":"flex-end"},"modified":1748033073,"user_id":1},{"id":"gyltsw","name":"metric-header_btn","settings":{"_widthMin":"max-content","_order:tablet_portrait":"2","_typography:mobile_landscape":{"font-size":"15"},"_padding:mobile_landscape":{"left":"20","right":"20"},"_padding:mobile_portrait":{"top":"10","bottom":"10"},"_margin:mobile_portrait":{"top":"40"}},"modified":1748033073,"user_id":1}]}

Similar components

Profile Picture
Zoltan Zsamboki

TE-section-Header_75

Client First Component
View now
Copy now
{ "content": [ { "id": "ztklof", "name": "heading", "parent": "tpsoui", "children": [], "settings": { "text": "Medium length hero heading goes here", "tag": "h1", "_cssGlobalClasses": [ "mrfggnxw" ] } }, { "id": "hvvnin", "name": "block", "parent": "tpsoui", "children": [], "settings": { "_cssGlobalClasses": [ "qpyjgedr" ] } }, { "id": "gyuhor", "name": "text-basic", "parent": "tpsoui", "children": [], "settings": { "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.", "tag": "p", "_cssGlobalClasses": [ "hzawzqiv" ] } }, { "id": "kkbabs", "name": "block", "parent": "tpsoui", "children": [], "settings": { "_cssGlobalClasses": [ "nlmvphvd" ] } }, { "id": "hricpn", "name": "button", "parent": "aidtbv", "children": [], "settings": { "text": "Button", "tag": "a", "style": "primary", "link": { "type": "external", "url": "#" }, "_cssGlobalClasses": [ "hzwjakto" ] } }, { "id": "dlpelh", "name": "button", "parent": "aidtbv", "children": [], "settings": { "text": "Button", "tag": "a", "style": "primary", "link": { "type": "external", "url": "#" }, "_cssGlobalClasses": [ "hzwjakto", "edoieiwq" ] } }, { "id": "aidtbv", "name": "block", "parent": "tpsoui", "children": [ "hricpn", "dlpelh" ], "settings": { "_cssGlobalClasses": [ "gnugotce", "mxysikdo" ] } }, { "id": "tpsoui", "name": "block", "parent": "fcufnq", "children": [ "ztklof", "hvvnin", "gyuhor", "kkbabs", "aidtbv" ], "settings": { "_cssGlobalClasses": [ "xoholkbd", "wlcrxsjn" ] } }, { "id": "fcufnq", "name": "block", "parent": "lekfpy", "children": [ "tpsoui" ], "settings": { "_cssGlobalClasses": [ "nmbhjrnv" ] } }, { "id": "lekfpy", "name": "block", "parent": "advdjw", "children": [ "fcufnq" ], "settings": { "_cssGlobalClasses": [ "ijcqbuwu" ] } }, { "id": "ybskqy", "name": "image", "parent": "ebafqo", "children": [], "settings": { "tag": "figure", "image": { "url": "https://uploads-ssl.webflow.com/624380709031623bfe4aee60/6243807090316216244aee67_PlaceholderVideo-Landscape.svg", "external": true }, "_cssGlobalClasses": [ "ojqsbrtn" ] } }, { "id": "zkzaqk", "name": "svg", "parent": "lsproz", "children": [], "settings": { "source": "code", "code": "\n\n", "_cssGlobalClasses": [ "szqnyzcq" ] } }, { "id": "lsproz", "name": "block", "parent": "ebafqo", "children": [ "zkzaqk" ], "settings": { "_cssGlobalClasses": [ "htcdwvfj" ] } }, { "id": "xwljgt", "name": "block", "parent": "ebafqo", "children": [], "settings": { "_cssGlobalClasses": [ "exxsedhv" ] } }, { "id": "ebafqo", "name": "div", "parent": "evflph", "children": [ "ybskqy", "lsproz", "xwljgt" ], "settings": { "_cssGlobalClasses": [ "roraurti" ] } }, { "id": "evflph", "name": "block", "parent": "advdjw", "children": [ "ebafqo" ], "settings": { "_cssGlobalClasses": [ "eaecqhmw" ] } }, { "id": "rjqtzq", "name": "block", "parent": "advdjw", "children": [], "settings": { "_cssGlobalClasses": [ "pyegpxtr" ] } }, { "id": "advdjw", "name": "block", "parent": "blttfr", "children": [ "lekfpy", "evflph", "rjqtzq" ], "settings": { "_cssGlobalClasses": [ "udloxwtg" ] } }, { "id": "blttfr", "name": "block", "parent": "tgskpg", "children": [ "advdjw" ], "settings": { "_cssGlobalClasses": [ "mznhcctf" ] } }, { "id": "tgskpg", "name": "block", "parent": "igsrev", "children": [ "blttfr" ], "settings": { "_cssGlobalClasses": [ "liifplmi" ] } }, { "id": "igsrev", "name": "block", "parent": 0, "children": [ "tgskpg" ], "settings": { "_cssGlobalClasses": [ "glrsnysk" ] } } ], "source": "bricksCopiedElements", "sourceUrl": "converted-from-webflow", "version": "2.3.2", "globalClasses": [ { "id": "glrsnysk", "name": "section_header75", "settings": {}, "_exists": false }, { "id": "liifplmi", "name": "padding-global", "settings": { "_padding": { "right": "5%", "left": "5%" } }, "_exists": false }, { "id": "mznhcctf", "name": "container-large", "settings": { "_width": "100%", "_widthMax": "80rem", "_margin": { "right": "auto", "left": "auto" } }, "_exists": false }, { "id": "udloxwtg", "name": "header75_component", "settings": { "_position": "relative", "_display": "flex", "_direction": "column" }, "_exists": false }, { "id": "ijcqbuwu", "name": "header75_content", "settings": { "_position": "sticky", "_zIndex": "0", "_display": "flex", "_widthMax": "48rem", "_justifyContent": "center", "_alignItems": "center", "_padding": { "top": "7rem", "bottom": "7rem" }, "_margin": { "right": "auto", "left": "auto" }, "_padding:tablet_portrait": { "top": "6rem", "bottom": "6rem" }, "_padding:mobile_landscape": { "top": "4rem", "bottom": "4rem" } }, "_exists": false }, { "id": "nmbhjrnv", "name": "text-align-center", "settings": { "_typography": { "text-align": "center" } }, "_exists": false }, { "id": "xoholkbd", "name": "max-width-xlarge", "settings": { "_width": "100%", "_widthMax": "64rem" }, "_exists": false }, { "id": "wlcrxsjn", "name": "align-center", "settings": {}, "_exists": false }, { "id": "mrfggnxw", "name": "heading-style-h1", "settings": { "_typography": { "font-size": "3.5rem", "line-height": "1.2", "font-weight": "700" }, "_typography:mobile_landscape": { "font-size": "2.5rem" }, "_typography:tablet_portrait": { "font-size": "3.25rem" } }, "_exists": false }, { "id": "qpyjgedr", "name": "spacer-small", "settings": { "_width": "100%", "_padding": { "top": "1.5rem" }, "_padding:mobile_landscape": { "top": "1.25rem" } }, "_exists": false }, { "id": "hzawzqiv", "name": "text-size-medium", "settings": { "_typography": { "font-size": "1.125rem" }, "_typography:mobile_landscape": { "font-size": "1rem" } }, "_exists": false }, { "id": "nlmvphvd", "name": "spacer-medium", "settings": { "_width": "100%", "_padding": { "top": "2rem" }, "_padding:mobile_landscape": { "top": "1.5rem" } }, "_exists": false }, { "id": "gnugotce", "name": "button-group", "settings": { "_display": "flex", "_flexWrap": "wrap", "_alignItems": "center", "_columnGap": "1rem", "_rowGap": "1rem" }, "_exists": false }, { "id": "mxysikdo", "name": "is-center", "settings": { "_justifyContent": "center" }, "_exists": false }, { "id": "hzwjakto", "name": "button", "settings": { "_padding": { "top": "0.75rem", "right": "1.5rem", "bottom": "0.75rem", "left": "1.5rem" }, "_typography": { "color": { "hex": "#ffffff", "id": "REPLACE_ME", "name": "White" }, "text-align": "center" }, "_background": { "color": { "hex": "#000000", "id": "REPLACE_ME", "name": "Primary Color" } } }, "_exists": false }, { "id": "edoieiwq", "name": "is-secondary", "settings": { "_typography": { "color": { "hex": "#000000", "id": "REPLACE_ME", "name": "Primary Color" } } }, "_exists": false }, { "id": "eaecqhmw", "name": "header75_content-bottom", "settings": { "_position": "sticky", "_zIndex": "1", "_display": "flex", "_direction": "column", "_justifyContent": "flex-start", "_justifyContent:tablet_portrait": "center" }, "_exists": false }, { "id": "roraurti", "name": "header75_lightbox", "settings": { "_position": "relative", "_display": "flex", "_width": "100%", "_justifyContent": "center", "_alignItems": "center" }, "_exists": false }, { "id": "ojqsbrtn", "name": "header75_lightbox-image", "settings": { "_width": "100%", "_objectFit": "cover" }, "_exists": false }, { "id": "htcdwvfj", "name": "lightbox-play-icon", "settings": { "_position": "absolute", "_zIndex": "2", "_display": "flex", "_justifyContent": "center", "_alignItems": "center", "_typography": { "color": { "hex": "#ffffff", "id": "REPLACE_ME", "name": "White" } } }, "_exists": false }, { "id": "szqnyzcq", "name": "icon-embed-large", "settings": { "_display": "flex", "_width": "5rem", "_direction": "column", "_justifyContent": "center", "_alignItems": "center" }, "_exists": false }, { "id": "exxsedhv", "name": "video-overlay-layer", "settings": { "_position": "absolute", "_zIndex": "1", "_background": { "color": { "hex": "#000000", "id": "REPLACE_ME", "name": "Primary Color" } } }, "_exists": false }, { "id": "pyegpxtr", "name": "header75_ix-trigger", "settings": { "_position": "absolute", "_zIndex": "-1", "_margin": { "top": "100vh" } }, "_exists": false } ] }
Profile Picture
Zoltan Zsamboki

TE-section-Header_7

Client First Component
View now
Copy now
{ "content": [ { "id": "bztcsx", "name": "heading", "parent": "rnbnse", "children": [], "settings": { "text": "Medium length hero heading goes here", "tag": "h1", "_cssGlobalClasses": [ "qilifcek" ] } }, { "id": "haqiez", "name": "block", "parent": "rnbnse", "children": [], "settings": { "_cssGlobalClasses": [ "kojdpiyp" ] } }, { "id": "luuwnv", "name": "text-basic", "parent": "rnbnse", "children": [], "settings": { "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.", "tag": "p", "_cssGlobalClasses": [ "kqxixqrq" ] } }, { "id": "qmztph", "name": "block", "parent": "rnbnse", "children": [], "settings": { "_cssGlobalClasses": [ "girwzljf" ] } }, { "id": "lhnwmw", "name": "button", "parent": "veyryw", "children": [], "settings": { "text": "Button", "tag": "a", "style": "primary", "link": { "type": "external", "url": "#" }, "_cssGlobalClasses": [ "vqpmgurn", "dcadtzpa" ] } }, { "id": "nbtbxo", "name": "button", "parent": "veyryw", "children": [], "settings": { "text": "Button", "tag": "a", "style": "primary", "link": { "type": "external", "url": "#" }, "_cssGlobalClasses": [ "vqpmgurn", "qxvsuyqe", "pijvvjnl" ] } }, { "id": "veyryw", "name": "block", "parent": "rnbnse", "children": [ "lhnwmw", "nbtbxo" ], "settings": { "_cssGlobalClasses": [ "rtlybbxp" ] } }, { "id": "rnbnse", "name": "block", "parent": "tjjvwp", "children": [ "bztcsx", "haqiez", "luuwnv", "qmztph", "veyryw" ], "settings": { "_cssGlobalClasses": [ "vsxogvzg" ] } }, { "id": "tjjvwp", "name": "block", "parent": "kvwtix", "children": [ "rnbnse" ], "settings": { "_cssGlobalClasses": [ "hmcejxli" ] } }, { "id": "kvwtix", "name": "block", "parent": "qxzpqx", "children": [ "tjjvwp" ], "settings": { "_cssGlobalClasses": [ "ilbsimmr" ] } }, { "id": "qxzpqx", "name": "block", "parent": "ohyztg", "children": [ "kvwtix" ], "settings": { "_cssGlobalClasses": [ "vnnooueq" ] } }, { "id": "ohyztg", "name": "block", "parent": "objift", "children": [ "qxzpqx" ], "settings": { "_cssGlobalClasses": [ "iqoasjvk" ] } }, { "id": "wbgnpb", "name": "block", "parent": "cfkudi", "children": [], "settings": { "_cssGlobalClasses": [ "kdbkwzdu" ] } }, { "id": "dwhaus", "name": "block", "parent": "cfkudi", "children": [], "settings": { "_cssGlobalClasses": [ "btbebwwq" ] } }, { "id": "cfkudi", "name": "block", "parent": "objift", "children": [ "wbgnpb", "dwhaus" ], "settings": { "_cssGlobalClasses": [ "imhevdpv" ] } }, { "id": "objift", "name": "block", "parent": 0, "children": [ "ohyztg", "cfkudi" ], "settings": { "_cssGlobalClasses": [ "uniedvjt", "tylhjiaw" ] } } ], "source": "bricksCopiedElements", "sourceUrl": "converted-from-webflow", "version": "2.3.2", "globalClasses": [ { "id": "uniedvjt", "name": "section_header7", "settings": { "_position": "relative" }, "_exists": false }, { "id": "tylhjiaw", "name": "text-color-white", "settings": {}, "_exists": false }, { "id": "iqoasjvk", "name": "padding-global", "settings": { "_padding": { "right": "5%", "left": "5%" } }, "_exists": false }, { "id": "vnnooueq", "name": "container-large", "settings": { "_width": "100%", "_widthMax": "80rem", "_margin": { "right": "auto", "left": "auto" } }, "_exists": false }, { "id": "ilbsimmr", "name": "header7_content", "settings": { "_position": "relative", "_zIndex": "1", "_display": "flex", "_alignItems": "center" }, "_exists": false }, { "id": "hmcejxli", "name": "padding-section-large", "settings": { "_padding": { "top": "7rem", "bottom": "7rem" }, "_padding:tablet_portrait": { "top": "6rem", "bottom": "6rem" }, "_padding:mobile_landscape": { "top": "4rem", "bottom": "4rem" } }, "_exists": false }, { "id": "vsxogvzg", "name": "max-width-medium", "settings": { "_width": "100%", "_widthMax": "35rem" }, "_exists": false }, { "id": "qilifcek", "name": "heading-style-h1", "settings": { "_typography": { "font-size": "3.5rem", "line-height": "1.2", "font-weight": "700" }, "_typography:mobile_landscape": { "font-size": "2.5rem" }, "_typography:tablet_portrait": { "font-size": "3.25rem" } }, "_exists": false }, { "id": "kojdpiyp", "name": "spacer-small", "settings": { "_width": "100%", "_padding": { "top": "1.5rem" }, "_padding:mobile_landscape": { "top": "1.25rem" } }, "_exists": false }, { "id": "kqxixqrq", "name": "text-size-medium", "settings": { "_typography": { "font-size": "1.125rem" }, "_typography:mobile_landscape": { "font-size": "1rem" } }, "_exists": false }, { "id": "girwzljf", "name": "spacer-medium", "settings": { "_width": "100%", "_padding": { "top": "2rem" }, "_padding:mobile_landscape": { "top": "1.5rem" } }, "_exists": false }, { "id": "rtlybbxp", "name": "button-group", "settings": { "_display": "flex", "_flexWrap": "wrap", "_alignItems": "center", "_columnGap": "1rem", "_rowGap": "1rem" }, "_exists": false }, { "id": "vqpmgurn", "name": "button", "settings": { "_padding": { "top": "0.75rem", "right": "1.5rem", "bottom": "0.75rem", "left": "1.5rem" }, "_typography": { "text-align": "center" } }, "_exists": false }, { "id": "dcadtzpa", "name": "is-alternate", "settings": {}, "_exists": false }, { "id": "qxvsuyqe", "name": "is-secondary", "settings": {}, "_exists": false }, { "id": "pijvvjnl", "name": "is-alternate", "settings": {}, "_exists": false }, { "id": "imhevdpv", "name": "header7_background-video-wrapper", "settings": { "_position": "absolute", "_zIndex": "0" }, "_exists": false }, { "id": "kdbkwzdu", "name": "video-overlay-layer", "settings": { "_position": "absolute", "_zIndex": "1" }, "_exists": false }, { "id": "btbebwwq", "name": "header7_background-video", "settings": { "_zIndex": "0", "_width": "100%", "_objectFit": "cover" }, "_exists": false } ] }
Profile Picture
Zoltan Zsamboki

TE-section-Header_5

Client First Component
View now
Copy now
{ "content": [ { "id": "tzqiju", "name": "heading", "parent": "rwdthq", "children": [], "settings": { "text": "Medium length hero heading goes here", "tag": "h1", "_cssGlobalClasses": [ "xrkkoddi" ] } }, { "id": "lxhyjc", "name": "block", "parent": "rwdthq", "children": [], "settings": { "_cssGlobalClasses": [ "fbhqffji" ] } }, { "id": "asutml", "name": "text-basic", "parent": "rwdthq", "children": [], "settings": { "text": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat.", "tag": "p", "_cssGlobalClasses": [ "ikyasift" ] } }, { "id": "jdrszx", "name": "block", "parent": "rwdthq", "children": [], "settings": { "_cssGlobalClasses": [ "koeaqlls" ] } }, { "id": "qjiwwr", "name": "button", "parent": "dpobss", "children": [], "settings": { "text": "Button", "tag": "a", "style": "primary", "link": { "type": "external", "url": "#" }, "_cssGlobalClasses": [ "zykvtzrn", "vckmzthq" ] } }, { "id": "pzwxry", "name": "button", "parent": "dpobss", "children": [], "settings": { "text": "Button", "tag": "a", "style": "primary", "link": { "type": "external", "url": "#" }, "_cssGlobalClasses": [ "zykvtzrn", "adwdkqfv", "yulbrohl" ] } }, { "id": "dpobss", "name": "block", "parent": "rwdthq", "children": [ "qjiwwr", "pzwxry" ], "settings": { "_cssGlobalClasses": [ "tkqukrwl" ] } }, { "id": "rwdthq", "name": "block", "parent": "rylbhy", "children": [ "tzqiju", "lxhyjc", "asutml", "jdrszx", "dpobss" ], "settings": { "_cssGlobalClasses": [ "ntnicrdf" ] } }, { "id": "rylbhy", "name": "block", "parent": "uixxhs", "children": [ "rwdthq" ], "settings": { "_cssGlobalClasses": [ "gsslmsof" ] } }, { "id": "uixxhs", "name": "block", "parent": "pbupkb", "children": [ "rylbhy" ], "settings": { "_cssGlobalClasses": [ "vochzxdn" ] } }, { "id": "pbupkb", "name": "block", "parent": "yaxygi", "children": [ "uixxhs" ], "settings": { "_cssGlobalClasses": [ "azzqmmvt" ] } }, { "id": "yaxygi", "name": "block", "parent": "svmrfp", "children": [ "pbupkb" ], "settings": { "_cssGlobalClasses": [ "hyrkpnpx" ] } }, { "id": "bnbdsg", "name": "block", "parent": "gkwega", "children": [], "settings": { "_cssGlobalClasses": [ "wlqkwiki" ] } }, { "id": "paywwc", "name": "image", "parent": "gkwega", "children": [], "settings": { "tag": "figure", "image": { "url": "https://uploads-ssl.webflow.com/624380709031623bfe4aee60/6243807090316203124aee66_placeholder-image.svg", "external": true }, "_cssGlobalClasses": [ "vdmywykn" ] } }, { "id": "gkwega", "name": "block", "parent": "svmrfp", "children": [ "bnbdsg", "paywwc" ], "settings": { "_cssGlobalClasses": [ "glplbyma" ] } }, { "id": "svmrfp", "name": "block", "parent": 0, "children": [ "yaxygi", "gkwega" ], "settings": { "_cssGlobalClasses": [ "cmeqzndm", "rppgsgbk" ] } } ], "source": "bricksCopiedElements", "sourceUrl": "converted-from-webflow", "version": "2.3.2", "globalClasses": [ { "id": "cmeqzndm", "name": "section_header5", "settings": { "_position": "relative" }, "_exists": false }, { "id": "rppgsgbk", "name": "text-color-white", "settings": {}, "_exists": false }, { "id": "hyrkpnpx", "name": "padding-global", "settings": { "_padding": { "right": "5%", "left": "5%" } }, "_exists": false }, { "id": "azzqmmvt", "name": "container-large", "settings": { "_width": "100%", "_widthMax": "80rem", "_margin": { "right": "auto", "left": "auto" } }, "_exists": false }, { "id": "vochzxdn", "name": "header5_content", "settings": { "_position": "relative", "_zIndex": "1", "_display": "flex", "_justifyContent": "flex-start", "_alignItems": "center" }, "_exists": false }, { "id": "gsslmsof", "name": "padding-section-large", "settings": { "_padding": { "top": "7rem", "bottom": "7rem" }, "_padding:tablet_portrait": { "top": "6rem", "bottom": "6rem" }, "_padding:mobile_landscape": { "top": "4rem", "bottom": "4rem" } }, "_exists": false }, { "id": "ntnicrdf", "name": "max-width-medium", "settings": { "_width": "100%", "_widthMax": "35rem" }, "_exists": false }, { "id": "xrkkoddi", "name": "heading-style-h1", "settings": { "_typography": { "font-size": "3.5rem", "line-height": "1.2", "font-weight": "700" }, "_typography:mobile_landscape": { "font-size": "2.5rem" }, "_typography:tablet_portrait": { "font-size": "3.25rem" } }, "_exists": false }, { "id": "fbhqffji", "name": "spacer-small", "settings": { "_width": "100%", "_padding": { "top": "1.5rem" }, "_padding:mobile_landscape": { "top": "1.25rem" } }, "_exists": false }, { "id": "ikyasift", "name": "text-size-medium", "settings": { "_typography": { "font-size": "1.125rem" }, "_typography:mobile_landscape": { "font-size": "1rem" } }, "_exists": false }, { "id": "koeaqlls", "name": "spacer-medium", "settings": { "_width": "100%", "_padding": { "top": "2rem" }, "_padding:mobile_landscape": { "top": "1.5rem" } }, "_exists": false }, { "id": "tkqukrwl", "name": "button-group", "settings": { "_display": "flex", "_flexWrap": "wrap", "_alignItems": "center", "_columnGap": "1rem", "_rowGap": "1rem" }, "_exists": false }, { "id": "zykvtzrn", "name": "button", "settings": { "_padding": { "top": "0.75rem", "right": "1.5rem", "bottom": "0.75rem", "left": "1.5rem" }, "_typography": { "text-align": "center" } }, "_exists": false }, { "id": "vckmzthq", "name": "is-alternate", "settings": {}, "_exists": false }, { "id": "adwdkqfv", "name": "is-secondary", "settings": {}, "_exists": false }, { "id": "yulbrohl", "name": "is-alternate", "settings": {}, "_exists": false }, { "id": "glplbyma", "name": "header5_background-image-wrapper", "settings": { "_position": "absolute", "_zIndex": "0" }, "_exists": false }, { "id": "wlqkwiki", "name": "image-overlay-layer", "settings": { "_position": "absolute", "_zIndex": "1" }, "_exists": false }, { "id": "vdmywykn", "name": "header5_background-image", "settings": { "_position": "absolute", "_width": "100%", "_objectFit": "cover" }, "_exists": false } ] }

Categories

Headers

Nice, you've downloaded this template! Now let's get it on your website...

To use this component, go to your 'Templates', click 'Import', and upload the file you just downloaded! It's that simple. You can then copy/paste it to other sections of your website.
Close & continue

Nice, you've copied this component! Now let's paste it...

To paste this component, simply go to any Bricks page or component and click paste! Simple as that.
Close & continue