@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&display=swap");.square{position:relative;margin:0 10px;width:100%;height:350px;max-height:400px;max-width:350px;display:flex;justify-content:center;align-items:center}.blob-h2{color:#282828}.blob-para{color:#3f3f3f}.square:hover .blob-h2{color:#fff}.square:hover .blob-para{color:#fcfcfc}.square span:first-child{position:absolute;top:0;left:0;width:100%;height:100%;border:2px solid #0f0f0f;border-radius:32% 58% 69% 43%/48% 32% 59% 55%;transition:.5s;animation:animate 15s linear infinite}.twitter:hover span:first-child{border:none;background:#fe9600}.square span:nth-child(2){position:absolute;top:0;left:0;width:100%;height:100%;border:2px solid #616161;border-radius:38% 62% 63% 37%/41% 44% 56% 59%;transition:.5s;animation:animate 18s linear infinite}.twitter:hover span:nth-child(2){border:none;background:#fbe201}.square span:nth-child(3){position:absolute;top:0;left:0;width:100%;height:100%;border:2px solid #414141;border-radius:31% 45% 74% 35%/38% 56% 51% 87%;transition:.5s;animation:animate2 20s linear infinite}.twitter:hover span:nth-child(3){border:none;background:#ffad4fb9}.content{position:relative;padding:40px 60px;text-align:center;transition:.5s;z-index:90}.hover-image{display:none}.square:hover .hover-image{display:block}.square:hover .default-image{display:none}@keyframes animate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes animate2{0%{transform:rotate(1turn)}to{transform:rotate(0deg)}}@media (max-width:540px){.square{height:300px;max-height:300px;max-width:300px}.content{padding:40px 20px}.square span:first-child{border-radius:40% 30% 35% 40%/48% 32% 59% 55%}.square span:nth-child(2){border:2px solid #616161;border-radius:38% 62% 63% 37%/41% 44% 56% 59%}.square span:nth-child(3){border-radius:31% 35% 44% 55%/38% 56% 51% 57%}}