*{box-sizing:border-box}html{font-size:100%}.orbit{float:left;width:100%}.orbit-icon{width:1.6em;height:1.6em;line-height:1.6em;font-size:1.2em;border-radius:50%;background:#ccc;color:#fff;text-align:center;display:flex;align-items:center;justify-content:center;padding:8px}.orbit-wrap{height:20em;list-style:none;font-size:1.3em}.orbit-wrap>li{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%)}.orbit-wrap>li:hover ul{border-width:2px;border-color:#fff}.orbit-wrap>li:hover~li ul{border-color:rgba(255, 255, 255, 0.2)}.orbit-wrap>li:hover~li ul li{opacity:0.4}ul[class^=ring]{transition:all 300ms ease-in-out}ul[class^=ring] li{transition:all 300ms ease-in-out}.ring-0{width:25em;height:25em;animation:clockwiseRotate 35s linear infinite}.ring-0 i{animation:counterClockwiseRotate 35s linear infinite}.ring-0>*:nth-of-type(1){transform:rotate(95deg) translate(12.5em) rotate(-95deg)}.ring-0>*:nth-of-type(2){transform:rotate(190deg) translate(12.5em) rotate(-190deg)}.ring-0>*:nth-of-type(3){transform:rotate(285deg) translate(12.5em) rotate(-285deg)}.ring-0>*:nth-of-type(4){transform:rotate(380deg) translate(12.5em) rotate(-380deg)}.ring-1{width:20em;height:20em;animation:clockwiseRotate 30s linear infinite}.ring-1 i{animation:counterClockwiseRotate 30s linear infinite}.ring-1>*:nth-of-type(1){transform:rotate(126.6666666667deg) translate(10em) rotate(-126.6666666667deg)}.ring-1>*:nth-of-type(2){transform:rotate(253.3333333333deg) translate(10em) rotate(-253.3333333333deg)}.ring-1>*:nth-of-type(3){transform:rotate(380deg) translate(10em) rotate(-380deg)}.ring-2{width:15em;height:15em;animation:clockwiseRotate 25s linear infinite}.ring-2 i{animation:counterClockwiseRotate 25s linear infinite}.ring-2>*:nth-of-type(1){transform:rotate(95deg) translate(7.5em) rotate(-95deg)}.ring-2>*:nth-of-type(2){transform:rotate(190deg) translate(7.5em) rotate(-190deg)}.ring-2>*:nth-of-type(3){transform:rotate(285deg) translate(7.5em) rotate(-285deg)}.ring-2>*:nth-of-type(4){transform:rotate(380deg) translate(7.5em) rotate(-380deg)}.ring-3{width:10em;height:10em;animation:clockwiseRotate 20s linear infinite}.ring-3 i{animation:counterClockwiseRotate 20s linear infinite}.ring-3>*:nth-of-type(1){transform:rotate(95deg) translate(5em) rotate(-95deg)}.ring-3>*:nth-of-type(2){transform:rotate(190deg) translate(5em) rotate(-190deg)}.ring-3>*:nth-of-type(3){transform:rotate(285deg) translate(5em) rotate(-285deg)}.ring-3>*:nth-of-type(4){transform:rotate(380deg) translate(5em) rotate(-380deg)}ul[class^=ring]{border:solid 1px rgba(33, 150, 243, 0.8);position:relative;padding:0;border-radius:50%;list-style:none;box-sizing:content-box}ul[class^=ring] li{display:block;position:absolute;top:50%;left:50%;width:1.6em;height:1.6em;margin:-0.8em}.orbit-center{z-index:5;font-size:2em;width:1.8em;height:1.8em;line-height:1em;text-align:center;background:#ffffff;border-radius:50%;display:flex;align-items:center;justify-content:center}.orbit-center:hover .orbit-center__icon{transform:rotateZ(0deg)}.orbit-center__icon{transform:rotateZ(-360deg);transition:all 300ms ease-in-out;height:1em}.orbit-wrap>li.orbit-center:hover~li>ul{width:0;height:0}.orbit-wrap>li.orbit-center:hover~li>ul *{transform:translate(0, 0)}@keyframes clockwiseRotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes counterClockwiseRotate{0%{transform:rotate(0deg)}100%{transform:rotate(-360deg)}}.shield-icon{background-color:#0023B0}.shield-icon img{height:1em}.lock-icon{background-color:#0031F7;color:#1947FF}.lock-icon img{height:0.8em}.lock-icon-2{background-color:#001876;color:#1947FF}.fa-heart-o{background:#b71c1c;color:white}.fa-coffee{background:#4CAF50;color:#CDDC39}.fa-safari{background:white;color:darkslateblue}.fa-firefox{background:#1565c0;color:#ff8f00}.fa-chrome{background:#fbc02d;color:#ef6c00}.fa-edge{background:#03a9f4;color:white}.fa-android{background:snow;color:limegreen}.fa-apple{background:#444;color:white}.fa-linux{background:white;color:#222}.fa-windows{background:white;color:#03a9f4}.fa-terminal{background:#222;color:#fff}.fa-html5{background:white;color:#e65100}.fa-css3{background:white;color:#2196f3}.fa-git{background:#222;color:white}.fa-free-code-camp{background:green;color:white}.fa-meetup{background:red;color:white}.fa-shield{background:red;color:white}.fa-lock{background:#000F4B;color:#1947FF}