Skip to content

Instantly share code, notes, and snippets.

/CSS Secret

Created August 2, 2017 15:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save anonymous/150df2513e8cedc6fcb12d00e0ab31dc to your computer and use it in GitHub Desktop.
Save anonymous/150df2513e8cedc6fcb12d00e0ab31dc to your computer and use it in GitHub Desktop.
body {
background-color: #FFFFFF;
margin: 0;
padding: 0;
height: 100%;
font-family: "Montserrat";
}
.content {
width:300px;
height: 300px;
position: absolute;
top: 50%;
left: 50%;
margin-top: -150px;
margin-left: -150px;
}
.tak {
width: 600px;
height: 600px;
background-color:#FFFFFF;
position: absolute;
top: 50%;
left: 50%;
margin-top: -300px;
margin-left: -300px;
}
.circles .circle {
display: block;
width: 2px;
height: 2px;
}
.circles .content {
-webkit-animation: rotateContent 40s linear infinite;
animation: rotateContent 40s linear infinite;
}
.circle-container {
position: absolute;
top: 50%;
margin-top: -5px;
left: 50%;
margin-left: -5px;
}
.circle-container .circle {
-webkit-transform: translate3D(-300px,0,0);
transform: translate3D(-300px,0,0);
}
.circle-container.color1 .circle{
background: rgba(64,64,64, 1);
}
.circle-container-2 {
-webkit-transform: rotate(3deg);
transform: rotate(3deg);
}
.circle-container-3 {
-webkit-transform: rotate(6deg);
transform: rotate(6deg);
}
.circle-container-4 {
-webkit-transform: rotate(9deg);
transform: rotate(9deg);
}
.circle-container-5 {
-webkit-transform: rotate(12deg);
transform: rotate(12deg);
}
.circle-container-6 {
-webkit-transform: rotate(15deg);
transform: rotate(15deg);
}
.circle-container-7 {
-webkit-transform: rotate(18deg);
transform: rotate(18deg);
}
.circle-container-8 {
-webkit-transform: rotate(21deg);
transform: rotate(21deg);
}
.circle-container-9 {
-webkit-transform: rotate(24deg);
transform: rotate(24deg);
}
.circle-container-10 {
-webkit-transform: rotate(27deg);
transform: rotate(27deg);
}
.circle-container-11 {
-webkit-transform: rotate(30deg);
transform: rotate(30deg);
}
.circle-container-12 {
-webkit-transform: rotate(33deg);
transform: rotate(33deg);
}
.circle-container-13 {
-webkit-transform: rotate(36deg);
transform: rotate(36deg);
}
.circle-container-14 {
-webkit-transform: rotate(39deg);
transform: rotate(39deg);
}
.circle-container-15 {
-webkit-transform: rotate(42deg);
transform: rotate(42deg);
}
.circle-container-16 {
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
.circle-container-17 {
-webkit-transform: rotate(48deg);
transform: rotate(48deg);
}
.circle-container-18 {
-webkit-transform: rotate(51deg);
transform: rotate(51deg);
}
.circle-container-19 {
-webkit-transform: rotate(54deg);
transform: rotate(54deg);
}
.circle-container-20 {
-webkit-transform: rotate(57deg);
transform: rotate(57deg);
}
.circle-container-21 {
-webkit-transform: rotate(60deg);
transform: rotate(60deg);
}
.circle-container-22 {
-webkit-transform: rotate(63deg);
transform: rotate(63deg);
}
.circle-container-23 {
-webkit-transform: rotate(66deg);
transform: rotate(66deg);
}
.circle-container-24 {
-webkit-transform: rotate(69deg);
transform: rotate(69deg);
}
.circle-container-25 {
-webkit-transform: rotate(72deg);
transform: rotate(72deg);
}
.circle-container-26 {
-webkit-transform: rotate(75deg);
transform: rotate(75deg);
}
.circle-container-27 {
-webkit-transform: rotate(78deg);
transform: rotate(78deg);
}
.circle-container-28 {
-webkit-transform: rotate(81deg);
transform: rotate(81deg);
}
.circle-container-29 {
-webkit-transform: rotate(84deg);
transform: rotate(84deg);
}
.circle-container-30 {
-webkit-transform: rotate(87deg);
transform: rotate(87deg);
}
.circle-container-31 {
-webkit-transform: rotate(90deg);
transform: rotate(90deg);
}
.circle-container-32 {
-webkit-transform: rotate(93deg);
transform: rotate(93deg);
}
.circle-container-33 {
-webkit-transform: rotate(96deg);
transform: rotate(96deg);
}
.circle-container-34 {
-webkit-transform: rotate(99deg);
transform: rotate(99deg);
}
.circle-container-35 {
-webkit-transform: rotate(102deg);
transform: rotate(102deg);
}
.circle-container-36 {
-webkit-transform: rotate(105deg);
transform: rotate(105deg);
}
.circle-container-37 {
-webkit-transform: rotate(108deg);
transform: rotate(108deg);
}
.circle-container-38 {
-webkit-transform: rotate(111deg);
transform: rotate(111deg);
}
.circle-container-39 {
-webkit-transform: rotate(114deg);
transform: rotate(114deg);
}
.circle-container-40 {
-webkit-transform: rotate(117deg);
transform: rotate(117deg);
}
.circle-container-41 {
-webkit-transform: rotate(120deg);
transform: rotate(120deg);
}
.circle-container-42 {
-webkit-transform: rotate(123deg);
transform: rotate(123deg);
}
.circle-container-43 {
-webkit-transform: rotate(126deg);
transform: rotate(126deg);
}
.circle-container-44 {
-webkit-transform: rotate(129deg);
transform: rotate(129deg);
}
.circle-container-45 {
-webkit-transform: rotate(132deg);
transform: rotate(132deg);
}
.circle-container-46 {
-webkit-transform: rotate(135deg);
transform: rotate(135deg);
}
.circle-container-47 {
-webkit-transform: rotate(138deg);
transform: rotate(138deg);
}
.circle-container-48 {
-webkit-transform: rotate(141deg);
transform: rotate(141deg);
}
.circle-container-49 {
-webkit-transform: rotate(144deg);
transform: rotate(144deg);
}
.circle-container-50 {
-webkit-transform: rotate(147deg);
transform: rotate(147deg);
}
.circle-container-51 {
-webkit-transform: rotate(150deg);
transform: rotate(150deg);
}
.circle-container-52 {
-webkit-transform: rotate(153deg);
transform: rotate(153deg);
}
.circle-container-53 {
-webkit-transform: rotate(156deg);
transform: rotate(156deg);
}
.circle-container-54 {
-webkit-transform: rotate(159deg);
transform: rotate(159deg);
}
.circle-container-55 {
-webkit-transform: rotate(162deg);
transform: rotate(162deg);
}
.circle-container-56 {
-webkit-transform: rotate(165deg);
transform: rotate(165deg);
}
.circle-container-57 {
-webkit-transform: rotate(168deg);
transform: rotate(168deg);
}
.circle-container-58 {
-webkit-transform: rotate(171deg);
transform: rotate(171deg);
}
.circle-container-59 {
-webkit-transform: rotate(174deg);
transform: rotate(174deg);
}
.circle-container-60 {
-webkit-transform: rotate(177deg);
transform: rotate(177deg);
}
.circle-container-61 {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
.circle-container-62 {
-webkit-transform: rotate(183deg);
transform: rotate(183deg);
}
.circle-container-63 {
-webkit-transform: rotate(186deg);
transform: rotate(186deg);
}
.circle-container-64 {
-webkit-transform: rotate(189deg);
transform: rotate(189deg);
}
.circle-container-65 {
-webkit-transform: rotate(192deg);
transform: rotate(192deg);
}
.circle-container-66 {
-webkit-transform: rotate(195deg);
transform: rotate(195deg);
}
.circle-container-67 {
-webkit-transform: rotate(198deg);
transform: rotate(198deg);
}
.circle-container-68 {
-webkit-transform: rotate(201deg);
transform: rotate(201deg);
}
.circle-container-69 {
-webkit-transform: rotate(204deg);
transform: rotate(204deg);
}
.circle-container-70 {
-webkit-transform: rotate(207deg);
transform: rotate(207deg);
}
.circle-container-71 {
-webkit-transform: rotate(210deg);
transform: rotate(210deg);
}
.circle-container-72 {
-webkit-transform: rotate(213deg);
transform: rotate(213deg);
}
.circle-container-73 {
-webkit-transform: rotate(216deg);
transform: rotate(216deg);
}
.circle-container-74 {
-webkit-transform: rotate(219deg);
transform: rotate(219deg);
}
.circle-container-75 {
-webkit-transform: rotate(222deg);
transform: rotate(222deg);
}
.circle-container-76 {
-webkit-transform: rotate(225deg);
transform: rotate(225deg);
}
.circle-container-77 {
-webkit-transform: rotate(228deg);
transform: rotate(228deg);
}
.circle-container-78 {
-webkit-transform: rotate(231deg);
transform: rotate(231deg);
}
.circle-container-79 {
-webkit-transform: rotate(234deg);
transform: rotate(234deg);
}
.circle-container-80 {
-webkit-transform: rotate(237deg);
transform: rotate(237deg);
}
.circle-container-81 {
-webkit-transform: rotate(240deg);
transform: rotate(240deg);
}
.circle-container-82 {
-webkit-transform: rotate(243deg);
transform: rotate(243deg);
}
.circle-container-83 {
-webkit-transform: rotate(246deg);
transform: rotate(246deg);
}
.circle-container-84 {
-webkit-transform: rotate(249deg);
transform: rotate(249deg);
}
.circle-container-85 {
-webkit-transform: rotate(252deg);
transform: rotate(252deg);
}
.circle-container-86 {
-webkit-transform: rotate(255deg);
transform: rotate(255deg);
}
.circle-container-87 {
-webkit-transform: rotate(258deg);
transform: rotate(258deg);
}
.circle-container-88 {
-webkit-transform: rotate(261deg);
transform: rotate(261deg);
}
.circle-container-89 {
-webkit-transform: rotate(264deg);
transform: rotate(264deg);
}
.circle-container-90 {
-webkit-transform: rotate(267deg);
transform: rotate(267deg);
}
.circle-container-91 {
-webkit-transform: rotate(270deg);
transform: rotate(270deg);
}
.circle-container-92 {
-webkit-transform: rotate(273deg);
transform: rotate(273deg);
}
.circle-container-93 {
-webkit-transform: rotate(276deg);
transform: rotate(276deg);
}
.circle-container-94 {
-webkit-transform: rotate(279deg);
transform: rotate(279deg);
}
.circle-container-95 {
-webkit-transform: rotate(282deg);
transform: rotate(282deg);
}
.circle-container-96 {
-webkit-transform: rotate(285deg);
transform: rotate(285deg);
}
.circle-container-97 {
-webkit-transform: rotate(288deg);
transform: rotate(288deg);
}
.circle-container-98 {
-webkit-transform: rotate(291deg);
transform: rotate(291deg);
}
.circle-container-99 {
-webkit-transform: rotate(294deg);
transform: rotate(294deg);
}
.circle-container-100 {
-webkit-transform: rotate(297deg);
transform: rotate(297deg);
}
.circle-container-101 {
-webkit-transform: rotate(300deg);
transform: rotate(300deg);
}
.circle-container-102 {
-webkit-transform: rotate(303deg);
transform: rotate(303deg);
}
.circle-container-103 {
-webkit-transform: rotate(306deg);
transform: rotate(306deg);
}
.circle-container-104 {
-webkit-transform: rotate(309deg);
transform: rotate(309deg);
}
.circle-container-105 {
-webkit-transform: rotate(312deg);
transform: rotate(312deg);
}
.circle-container-106 {
-webkit-transform: rotate(315deg);
transform: rotate(315deg);
}
.circle-container-107 {
-webkit-transform: rotate(318deg);
transform: rotate(318deg);
}
.circle-container-108 {
-webkit-transform: rotate(321deg);
transform: rotate(321deg);
}
.circle-container-109 {
-webkit-transform: rotate(324deg);
transform: rotate(324deg);
}
.circle-container-110 {
-webkit-transform: rotate(327deg);
transform: rotate(327deg);
}
.circle-container-111 {
-webkit-transform: rotate(330deg);
transform: rotate(330deg);
}
.circle-container-112 {
-webkit-transform: rotate(333deg);
transform: rotate(333deg);
}
.circle-container-113 {
-webkit-transform: rotate(336deg);
transform: rotate(336deg);
}
.circle-container-114 {
-webkit-transform: rotate(339deg);
transform: rotate(339deg);
}
.circle-container-115 {
-webkit-transform: rotate(342deg);
transform: rotate(342deg);
}
.circle-container-116 {
-webkit-transform: rotate(345deg);
transform: rotate(345deg);
}
.circle-container-117 {
-webkit-transform: rotate(348deg);
transform: rotate(348deg);
}
.circle-container-118 {
-webkit-transform: rotate(351deg);
transform: rotate(351deg);
}
.circle-container-119 {
-webkit-transform: rotate(354deg);
transform: rotate(354deg);
}
.circle-container-120 {
-webkit-transform: rotate(357deg);
transform: rotate(357deg);
}
@-webkit-keyframes movingFirstColor {
0% {
-webkit-transform: translate3D(-100px,0,0);
transform: translate3D(-100px,0,0);
width: 10px;
opacity: 1;
box-shadow: 0px 0px 0px 0px rgba(255,214,70,1);
}
33% {
-webkit-transform: translate3D(-100px,0,0);
transform: translate3D(-100px,0,0);
width: 10px;
opacity: 1;
box-shadow: 0px 0px 0px 0px rgba(255,214,70,1);
}
50% {
width: 30px;
opacity: 0.7;
box-shadow: 3px 0px 5px 0px rgba(255,214,70,1);
}
66% {
-webkit-transform: translate3D(100px, 0, 0);
transform: translate3D(100px, 0, 0);
width: 10px;
box-shadow: 0px 0px 0px 0px rgba(255,214,70,1);
}
100% {
width: 10px;
opacity: 1;
-webkit-transform: translate3D(100px,0,0);
transform: translate3D(100px,0,0);
box-shadow: 0px 0px 0px 0px rgba(255,214,70,1);
}
}
@keyframes movingFirstColor {
0% {
-webkit-transform: translate3D(-100px,0,0);
transform: translate3D(-100px,0,0);
width: 10px;
opacity: 1;
box-shadow: 0px 0px 0px 0px rgba(255,214,70,1);
}
33% {
-webkit-transform: translate3D(-100px,0,0);
transform: translate3D(-100px,0,0);
width: 10px;
opacity: 1;
box-shadow: 0px 0px 0px 0px rgba(255,214,70,1);
}
50% {
width: 30px;
opacity: 0.7;
box-shadow: 3px 0px 5px 0px rgba(255,214,70,1);
}
66% {
-webkit-transform: translate3D(100px, 0, 0);
transform: translate3D(100px, 0, 0);
width: 10px;
box-shadow: 0px 0px 0px 0px rgba(255,214,70,1);
}
100% {
width: 10px;
opacity: 1;
-webkit-transform: translate3D(100px,0,0);
transform: translate3D(100px,0,0);
box-shadow: 0px 0px 0px 0px rgba(255,214,70,1);
}
}
@-webkit-keyframes rotateContent {
from {
-webkit-transform: rotate(0);
transform: rotate(0);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes rotateContent {
from {
-webkit-transform: rotate(0);
transform: rotate(0);
}
to {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
<!DOCTYPE html>
<html class="circles">
<head>
<meta charset="UTF-8">
<title>CSS Circles crossing</title>
<link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css.css">
</head>
<body>
<div class="tak">
<img src="449461.jpg" align="middle">
<div class="content">
<div class="circle-container color1 circle-container-1"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-2"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-3"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-4"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-5"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-6"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-7"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-8"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-9"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-10"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-11"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-12"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-13"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-14"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-15"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-16"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-17"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-18"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-19"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-20"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-21"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-22"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-23"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-24"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-25"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-26"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-27"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-28"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-29"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-30"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-31"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-32"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-33"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-34"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-35"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-36"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-37"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-38"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-39"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-40"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-41"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-42"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-43"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-44"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-45"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-46"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-47"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-48"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-49"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-50"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-51"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-52"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-53"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-54"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-55"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-56"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-57"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-58"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-59"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-60"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-61"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-62"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-63"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-64"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-65"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-66"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-67"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-68"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-69"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-70"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-71"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-72"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-73"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-74"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-75"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-76"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-77"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-78"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-79"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-80"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-81"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-82"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-83"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-84"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-85"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-86"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-87"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-88"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-89"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-90"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-91"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-92"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-93"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-94"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-95"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-96"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-97"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-98"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-99"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-100"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-101"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-102"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-103"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-104"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-105"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-106"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-107"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-108"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-109"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-110"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-111"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-112"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-113"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-114"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-115"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-116"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-117"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-118"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-119"><span class="circle"></span></div>
<div class="circle-container color1 circle-container-120"><span class="circle"></span></div>
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment