.row-fluid .style-tile{display:flex;flex-direction:column;min-width:12.5rem;padding:1rem}.style-container{max-width:1380px}.typography-breadown{font-size:.85rem}.row-fluid.style-row{gap:0}.col.style-col{padding:0 1.5rem}.logo-wrapper{line-height:0;position:relative;text-align:center;width:100%}.subsection-title{margin-bottom:1rem}.style-section .row-fluid{flex-wrap:wrap;justify-content:flex-start}.menu-col,.tile-header{position:relative}.tile-header{padding-bottom:.75rem}.tile-header.typography-layouts{gap:1.5rem}.tile-header.typography-layouts,.typography-layouts .layout{display:flex;flex-direction:column}#color-ratios .tile-header,#correct-logos .tile-header,#fonts .tile-header,#logo-intro .tile-header{flex:1}.section.style-section:after{max-width:none}.tile-header h4{color:var(--purple-text);font-size:1.25rem}.tile-header h5{font-weight:600}.tile-header li,.tile-header p{font-size:.9rem;margin-top:.75rem}.tile-image{align-items:center;background:var(--white-sub);display:flex;justify-content:center;overflow:hidden;position:relative}.tile-image.font-example{align-items:flex-start;flex-direction:column;font-size:1.9rem;gap:1rem;padding:1.5rem}.row-fluid.subsection-container{flex-direction:column;gap:3rem}#incorrect-logos .tile{flex:1}#incorrect-logos .tile-image{flex-grow:1;height:7.5rem;padding:1.5rem}#correct-logos .tile-image{height:15rem}#logo-intro .tile-image img{width:100%}.guide-logo{height:auto;max-width:7.5rem;position:relative;width:100%;z-index:1}.correct-logo{max-width:15rem;width:100%}.logomark .correct-logo{max-width:7.5rem;width:100%}#incorrect-logos .tile-image:after,#incorrect-logos .tile-image:before{border:1px solid var(--purple-dark);bottom:50%;content:"";display:block;left:0;margin:auto;opacity:.1;position:absolute;right:0;top:50%;width:100%;z-index:0}#incorrect-logos .tile-image:before{transform:rotate(23deg)}#incorrect-logos .tile-image:after{transform:rotate(-23deg)}#menu a{display:block;font-family:var(--header);font-weight:500;padding:.25rem 1rem}#menu a.active{font-weight:700}.color-code{font-size:.85rem}.color-breakdown{align-items:center;display:flex}.color-codes{margin-left:1rem}.color-tile{height:4rem;width:4rem}.color-shade .color-tile{height:2.5rem;width:2.5rem}.style-tile.border .color-tile{border:1px solid var(--gray)}.color-shades{display:flex;margin-top:1.5rem}.color-shades .color-name{font-size:.85rem;font-weight:600}.color-shades .color-codes{margin-left:.75rem}#colors .pre-header{font-size:.7rem}.color-tier{position:relative}.color-tier:not(:last-child){margin-bottom:2rem;padding-bottom:2rem}.color-tier:not(:last-child):after{background:var(--purple-dark);bottom:0;content:"";height:2px;left:0;margin:0 auto;opacity:.1;position:absolute;right:0}#color-ratios .tile-image img{width:100%}@media screen and (min-width:768px){#menu{min-width:10rem;position:sticky;top:calc(3rem + var(--top-nav-height))}#colors .pre-header,.menu-col:after{position:absolute;right:0}.menu-col:after{background:var(--purple-dark);bottom:0;content:"";margin:0 auto;opacity:.1;top:0;width:2px}#color-ratios .tile,#colors .tile,#correct-logos .tile,#fonts .tile,#logo-intro .tile{flex:1;min-width:25rem}#ui .tile{flex:none}.tile-header.typography-layouts{padding:1.5rem}}@media screen and (max-width:767px){.section.style-section{padding:3rem 0}}