CSSBattle Target#3

Hey everyone,
I am back with the CSSBattle Series!
This one is over the Target#3 "Push Button" on CSSBattle

The best approach I could come up with is stated below

<p></p>
<style>
*{background:#6592CF;margin:37.5 25 37.5 25}
body{background:#243D83}
p{
position:fixed;
border-radius:50%;
background:radial-gradient(
#EEB850 24.5px,
#243D83 25.5px);
width:150;height:150;
left:50;top:-13;
border:50px solid #6592CF;}

This one was by far, my shortest solution condensing to 237 characters.

Explanation

The p element is one with the dark blue color.
In the background colour of p , I provided a radial gradient through which the inner yellow circle was made.
And the p has a light-blue border of 50px thickness.

I was amazed to see that the top solution was just 108 characters, I wonder how they were able to do it in such small amount of code!!

Comment down your way of doing the same.
Stay Tuned for daily updates regarding all the challenges on CSSBattle.

Want to connect?

You can connect with me here