archeryTarget

Archery Target

Build an Archery Target

• Match the example
• Center on the page
• No need to make responsive
• Hint:
  • These are four circles layered on top of one another, and each circle is centered within a larger circle.

Provided code

HTML

<div class="rings">
    <div class="ring ring-1">
        <div class="ring ring-2">
            <div class="ring ring-3">
                <div class="ring ring-4"></div>
            </div>
        </div>
    </div>
</div>

CSS

:root {
    --black: #282828;
    --blue: #2892f9;
    --red: #fb2f27;
    --yellow: #fdfe29;
}

html, body {
    margin: 0;
    padding: 0;
}