$yellow: #ff0; $orange: #f70; $yellow2: #FAB002; mapicon { border: 2px solid $yellow2; background-color: $yellow2; margin: 8px; background-position: center; background-size: cover; aspect-ratio: 1; width: 350px; cursor: pointer; opacity: 1; color: $yellow2; border-radius: 10px; left: 40px; &:hover { transform: scale( 1.02 ); opacity: 1; } .votes { position: absolute; bottom: 8px; right: 8px; background-color: rgba( black,1); border: 1px solid $yellow2; padding: 10px 15px; border-radius: 3px; font-weight: bolder; font-family: Teko-SemiBold; font-size: 22px; min-height: 54px; justify-content: center; align-items: center; } .info { position: absolute; bottom: 8px; left: 8px; background-color: rgba( black, 1 ); border: 1px solid $yellow2; flex-direction: column; padding: 5px; border-radius: 3px; .orgavatar { position: absolute; left: 5px; bottom: 10px; width: 40px; height: 40px; border-radius: 4px; background-color: black; background-position: center; background-size: cover; mix-blend-mode: lighten; } .title { font-family: Teko-SemiBold; font-weight: bolder; margin-left: 50px; font-size: 20px; mix-blend-mode: lighten; } .orgname { font-family: Teko-Light; font-weight: bolder; margin-left: 50px; font-size: 13px; opacity: 1; mix-blend-mode: lighten; } } }