.agent-benefits--page { .hero { .bg { background-image: url('/assets/img/agents/agents-hero.jpg'); } } .panel { width: 100%; background: #fff; @extend %defaultBorderRadius; padding: 20px; @include boxSizing(border-box); &.not-logged-in { text-align: center; a { color: $theme; } } &.is-agent { text-align: center; a { color: $theme; } } } .s1 { .txtBox { overflow: hidden; h3 { margin-bottom: 20px; } ul { li { list-style: disc; margin-right: 20px; margin-bottom: 10px; p { a { color: $theme; } } } } } .links { margin-top: 50px; display: flex; flex-wrap: wrap; justify-content: space-around; .item { flex-basis: 32%; overflow: hidden; @include boxSizing(border-box); @extend %defaultBorderRadius; @extend %defaultBoxShadow; @media (max-width: 768px) { flex-basis: 100%; margin-bottom: 15px; } button, a { display: block; width: 100%; height: 100%; padding: 50px 15px; border: none; background: rgba(#000, 0.05); text-align: center; color: #000; font-size: 16px; font-family: 'iranYekanR'; cursor: pointer; @extend %defaultTransition; &:hover { background: $theme; color: #fff; } } } } } }