Document

:root{--card-width: 17rem; --grid-gap: 32px; --listing-width: calc((3 * var(--card-width)) + (2 * var(--grid-gap)) + 32px);}

.plugins-page-container{display: flex; flex-direction: column; height : 100%; width: 100%;}

.plugins-hero-section{background: linear-gradient(180deg, #DCE3E4 0%, #D3DBDC 100%); padding: 48px 32px; min-height: 338px !important; width: 100%; max-width: var(--listing-width); box-sizing: border-box; margin-bottom: 24px; margin-left: auto; margin-right: auto; display: flex; align-items: center; justify-content: space-between; gap: 32px;}

.plugins-hero-copy{display: flex; flex-direction: column; gap: 10px; justify-content: center !important; max-width: 60%;}

.plugins-hero-title{margin: 0 !important; font-size: 2.4rem !important; font-weight: 700 !important; color: #00CC76 !important; text-shadow: -0.25px 0 #111, 0 0.25px #111, 0.25px 0 #111, 0 -0.25px #111 !important;}

.plugins-hero-subtext{margin: 10px 0 0 0 !important; font-size: 1rem; line-height: 1.5; color: #374151; max-width: 720px;}

.plugins-hero-graphic{width: 160px; height: auto; flex-shrink: 0; margin-right: 12px;}

.plugins-listing-container{display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: var(--grid-gap); width: 100%; max-width: var(--listing-width); margin: 0 auto; grid-auto-rows: 1fr;}

.plugin-card{width : 100%; aspect-ratio: 1 / 1; border : 1px solid #ccc; display : flex; flex-direction: column; justify-content: space-between; padding : 12px 12px; border-radius : 14px; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12); background: #f7f7f8; gap: 10px; height: 100% !important; box-sizing: border-box;}

.plugin-heading{
display : flex;
flex-direction: column;
line-height: 1.5rem;
margin : 10px;
gap: 8px;

}

.plugin-title {font-size : 1.4rem; font-weight : 600;}

.plugin-subsections-container{display: grid !important; grid-template-columns: repeat(2, 1fr) !important; column-gap: 10px !important; row-gap: 12px !important; grid-auto-rows: 1fr !important; width: 100% !important;}

.plugins-subsection{background: #fff; border: 1px solid #e5e7eb; color: #4b6b5a; border-radius: 12px; padding: 6px 10px !important; width: 100% !important; box-sizing: border-box !important; display: flex !important; align-items: center !important; justify-content: center !important; text-align: center !important; position: relative !important; cursor: pointer !important; text-decoration: none !important; transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;}

.plugins-subsection p{margin: 0; font-weight: 600; font-size: 0.9rem !important; text-decoration: none !important;}

@media (max-width: 900px){.plugins-hero-section{ flex-direction: column; align-items: center; } .plugins-hero-copy{ max-width: 100%; } .plugins-hero-graphic{ width: 140px; margin-right: 0; } .plugins-listing-container{ gap: 20px; grid-auto-rows: auto; } .plugin-card{ aspect-ratio: auto; height: auto !important; }}

@media (max-width: 640px){.plugins-hero-section{ padding: 32px 20px; } .plugins-hero-title{ font-size: 2rem !important; } .plugins-hero-subtext{ max-width: 100%; } .plugins-hero-graphic{ width: 120px; display: none; }}

.plugins-subsection:hover{background: #f3f4f6; border-color: #d1d5db; color: #3f5b4e;}

.plugins-subsection::after{content: attr(data-tooltip); position: absolute; left: 100%; bottom: calc(100% + 8px); transform: translateX(12px); background: #374151; color: #f9fafb; padding: 6px 10px; border-radius: 6px; font-size: 0.85rem; width: 220px; max-width: 260px; white-space: normal; text-align: left; opacity: 0; pointer-events: none; transition: opacity 0.15s ease; box-shadow: 0 8px 18px rgba(0, 0, 0, 0.15); z-index: 10;}

.plugins-subsection::before{content: ""; position: absolute; left: 100%; bottom: calc(100% + 12px); width: 10px; height: 10px; transform: translateX(6px) rotate(45deg); background: #374151; border-radius: 2px; opacity: 0; transition: opacity 0.15s ease; pointer-events: none; z-index: 9;}

.plugins-subsection:hover::after,
.plugins-subsection:hover::before{opacity: 1;}

.plugin-logo img{width : 3rem; height : auto; object-fit : contain; margin-right : 10px;}

.plugin-logo .vcloud-logo{width: 3rem; height: auto; object-fit: contain;}

Industry-leading Integrations

Cohesity provides ready-to-use integrations with the automation and orchestration tools of your choice to streamline your operations. Under the hood, all integrations are powered by the Cohesity REST API.