.do-square{flex-basis:33%;box-sizing:border-box}.do-square:before{content:"";display:block;padding-top:34vw}.do-square .content{position:absolute;top:0;left:0;height:100%;width:100%}.do-square .overlay{z-index:10;background-color:#0c1d3980}.do-square .bg{position:absolute;width:100%;height:100%;inset:0;z-index:0}.do-square .bg img{height:100%;width:100%;-o-object-fit:cover;object-fit:cover}.do-square .main{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;font-size:22px;z-index:20;transition:opacity .5s;opacity:0}.do-square .main.hover{opacity:100}.do-square .main.hover div:last-child{margin-top:-16px}.do-square .main.hover .chevron{width:50%;height:66.66667%}.do-square .main.hover .chevron svg{transform:rotate(90deg) scale(.5);height:100%;width:100%;fill:#fff}.do-square .main.hover div{display:flex;justify-content:center;align-items:center;flex-shrink:1;height:unset;width:100%}.do-square:hover .main.hover{opacity:100}.do-square:hover .main:not(:hover){opacity:0}@media (min-width: 768px){.do-square:before{padding-top:100%}.do-square .main{font-size:32px;opacity:100}.do-square .main.hover{opacity:0}.do-square .main.hover .chevron svg{transform:rotate(90deg) scale(1)}.do-square .main.hover div:last-child{margin-top:0}}