Specialized
CommunicationS for Mission-Critical Environments
When it matters most, our systems
keep you connected.
Hero Type5
Specialized
When it matters most, our systems
The above block is copied from the site: Cognicom – https://cognicominc.wpenginepowered.com/
Pattern HTML
<!-- wp:group {"metadata":{"name":"Hero Section"},"align":"full","style":{"spacing":{"padding":{"top":"0"}},"border":{"top":{"width":"0px","style":"none"},"right":{"width":"0px","style":"none"},"bottom":{"width":"32px","color":"var:preset|color|six"},"left":{"width":"0px","style":"none"}}},"layout":{"type":"default"}} -->
<div class="wp-block-group alignfull" id="hero-section" style="border-top-style:none;border-top-width:0px;border-right-style:none;border-right-width:0px;border-bottom-color:var(--wp--preset--color--six);border-bottom-width:32px;border-left-style:none;border-left-width:0px;padding-top:0"><!-- wp:cover {"url":"https://cognicominc.wpenginepowered.com/wp-content/uploads/2025/09/home-video.mp4","id":39,"dimRatio":0,"customOverlayColor":"#FFF","isUserOverlayColor":false,"backgroundType":"video","focalPoint":{"x":0.45,"y":0},"minHeight":800,"isDark":false,"sizeSlug":"full","align":"full","layout":{"type":"constrained","contentSize":"1420px"}} -->
<div class="wp-block-cover alignfull is-light" style="min-height:800px"><video class="wp-block-cover__video-background intrinsic-ignore" autoplay muted loop playsinline src="https://cognicominc.wpenginepowered.com/wp-content/uploads/2025/09/home-video.mp4" style="object-position:45% 0%" data-object-fit="cover" data-object-position="45% 0%"></video><span aria-hidden="true" class="wp-block-cover__background has-background-dim-0 has-background-dim" style="background-color:#FFF"></span><div class="wp-block-cover__inner-container"><!-- wp:columns {"verticalAlignment":"top","style":{"spacing":{"blockGap":{"left":"0"}}}} -->
<div class="wp-block-columns are-vertically-aligned-top"><!-- wp:column {"verticalAlignment":"top","width":"55%","style":{"spacing":{"padding":{"top":"var:preset|spacing|200"}}}} -->
<div class="wp-block-column is-vertically-aligned-top" style="padding-top:var(--wp--preset--spacing--200);flex-basis:55%"><!-- wp:heading {"level":1,"style":{"typography":{"textTransform":"uppercase"},"elements":{"link":{"color":{"text":"var:preset|color|one"}}},"spacing":{"margin":{"top":"0"}}},"textColor":"one"} -->
<h1 class="wp-block-heading has-one-color has-text-color has-link-color" style="margin-top:0;text-transform:uppercase">Specialized <br>CommunicationS for Mission-Critical Environments</h1>
<!-- /wp:heading -->
<!-- wp:heading {"level":4,"style":{"typography":{"textTransform":"uppercase","fontStyle":"normal","fontWeight":"400"},"elements":{"link":{"color":{"text":"var:preset|color|five"}}}},"textColor":"five","fontFamily":"one"} -->
<h4 class="wp-block-heading has-five-color has-text-color has-link-color has-one-font-family" style="font-style:normal;font-weight:400;text-transform:uppercase">When it matters most, our systems <br>keep you connected.</h4>
<!-- /wp:heading --></div>
<!-- /wp:column -->
<!-- wp:column {"verticalAlignment":"top","width":"45%"} -->
<div class="wp-block-column is-vertically-aligned-top" style="flex-basis:45%"><!-- wp:image {"id":38,"sizeSlug":"large","linkDestination":"none"} -->
<figure class="wp-block-image size-large"><img src="https://cognicominc.wpenginepowered.com/wp-content/uploads/2025/09/communication-device-873x1024.png" alt="" class="wp-image-38"/></figure>
<!-- /wp:image --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div></div>
<!-- /wp:cover --></div>
<!-- /wp:group -->
Pattern CSS
#hero-section {
overflow:hidden;
}
#hero-section h1 {
background: linear-gradient(90deg, #B6D5DA 0%, #58C0DB 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
background-clip: text;
color: transparent;
letter-spacing:0;
}
#hero-section .wp-block-image {
width:655px;
position: relative;
z-index: 999;
top: -20px;
right:50px;
}
#hero-section .wp-block-cover {
overflow:unset;
}
#hero-section .wp-block-cover__video-background {
transform: scale(1.3);
}
@media only screen and (max-width: 1300px) {
#hero-section .wp-block-cover {
min-height:auto !important;
height:auto;
}
}
@media only screen and (max-width: 980px) {
#hero-section .wp-block-cover__video-background {
transform: scale(1.2);
}
#hero-section .wp-block-cover {
min-height:auto !important;
}
#hero-section .wp-block-cover {
height:600px;
}
}
@media only screen and (max-width: 780px) {
#hero-section .wp-block-cover__inner-container {
padding-top:100px;
}
}
@media only screen and (max-width: 500px) {
#hero-section .wp-block-cover {
height: 370px;
}
#hero-section .wp-block-image {
width: 230px;
position:relative;
top: -110px;
right: -35px;
float: right;
z-index: 9;
}
#hero-section h1 {
font-size:27px;
}
#hero-section h4 {
font-size:19px;
margin-top: 15px;
position: relative;
z-index: 99;
}
}
