#custom_example{background-image:radial-gradient(#4c6b9b,#90aaca,#fff);padding:30px 0;min-height:100vh}#custom_example p{font-size:22px;color:#00036d;text-align:center}#custom_example .container{max-width:768px}#custom_example .circles-wrapper{position:relative;width:100%;height:375px}#custom_example .circle{width:71%;height:100%;border-radius:50%;position:absolute;display:flex;flex-direction:column;align-items:center;text-align:center;border:2px solid #335179}#custom_example .circle.circle-1{top:0;left:0}#custom_example .circle.circle-2{top:0;right:0}#custom_example .answers-wrapper{width:100%;padding:20px}#custom_example .answers-wrapper .item{cursor:pointer;text-align:center;display:inline-block;border:1px solid #939dbe;margin:10px;border-radius:3px;background-color:#cbdaff;color:#454867;padding:5px 13px;font-size:12px;position:relative;max-width:100px;box-shadow:0 0 6px -1px rgba(0,0,0,.38)}#custom_example .answers-wrapper .item span{position:absolute;top:0;right:0;transform:translate(50%,-50%);font-size:14px;border-radius:12px;width:20px;height:20px;color:#fff;text-align:center;display:none;line-height:19px}#custom_example .answers-wrapper .item.w-answer.publish{border-color:#b43838}#custom_example .answers-wrapper .item.w-answer.publish span{display:inline;background-color:#3e0707}#custom_example .answers-wrapper .item.r-answer.publish{border-color:#7abeae}#custom_example .answers-wrapper .item.r-answer.publish span{display:inline;background-color:#125312}#custom_example .img-wrapper img{max-width:140px}#custom_example .circle.ui-droppable-hover{border:2px solid #244283;background-color:rgba(0,102,255,.137)}#custom_example .ui-draggable-dragging{z-index:999!important}#custom_example .btn-disabled-start{pointer-events:none;opacity:.65}#custom_example button:focus{box-shadow:none!important}#custom_example .btn-disabled-end{pointer-events:none}#custom_example .img-wrapper h2{font-size:16px;margin-top:10px;color:#131948}@media (max-width:575px){#custom_example .img-wrapper h2{font-size:16px}#custom_example .img-wrapper img{max-width:80px}#custom_example .circles-wrapper{height:250px}#custom_example .answers-wrapper .item{font-size:9px}}#drag_drop_swap{background-image:radial-gradient(#4c6b9b,#90aaca,#fff);padding:20px 0;min-height:100vh}#drag_drop_swap .container{max-width:768px}#drag_drop_swap p{font-size:22px;color:#00036d;text-align:center}#drag_drop_swap .circles-wrapper{position:relative;width:100%}#drag_drop_swap .circles-wrapper img.placeholder-img{width:100%;display:block;margin:0 auto;opacity:0}#drag_drop_swap .circles-wrapper .circle img{max-width:100%}#drag_drop_swap .circle{width:22%;height:23%;border-radius:50%;position:absolute;border:1px solid transparent;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;text-shadow:0 0 3px #fff;font-weight:500;background-size:cover;background-repeat:no-repeat;background-position:center;overflow:hidden}#drag_drop_swap .circle.circle-1{top:0;left:33%}#drag_drop_swap .circle.circle-2{left:12%;top:24%}#drag_drop_swap .circle.circle-3{left:24%;bottom:11%}#drag_drop_swap .circle.circle-4{top:10%;right:17%}#drag_drop_swap .circle.circle-5{top:34%;right:36%}#drag_drop_swap .answers-wrapper{width:100%;padding:20px;display:flex;flex-direction:row;justify-content:center;flex-wrap:wrap;align-items:flex-start}#drag_drop_swap .answers-wrapper .item{border:1px solid #d3d3d3;padding:3px 10px;border-radius:5px;cursor:pointer;background-color:#e3e3e3;margin:0 5px;font-size:14px;display:flex;align-items:center;text-align:center;box-shadow:0 0 6px -3px rgba(0,0,0,.4)}#drag_drop_swap .answers-wrapper .item.item-dropped{border-radius:3px;border-color:transparent;background-color:#fff}#drag_drop_swap .answers-wrapper .item span.detector{font-family:Arial;position:absolute;top:0;right:0;width:17px;height:17px;border-radius:50%;font-size:12px;transform:translate(50%,-50%);color:#fff;display:none}#drag_drop_swap .answers-wrapper .item.w-answer.publish span.detector{background-color:#a71e1e;font-size:15px;line-height:17px;display:block}#drag_drop_swap .answers-wrapper .item.r-answer.publish span.detector{background-color:#226d17;display:block}#drag_drop_swap .ui-droppable-hover{opacity:.7}#drag_drop_swap .ui-droppable-hover.full{opacity:1}#drag_drop_swap .ui-draggable-dragging{z-index:999!important}#drag_drop_swap .btn-disabled-start{pointer-events:none;opacity:.65}#drag_drop_swap button:focus{box-shadow:none!important}#drag_drop_swap .btn-disabled-end{pointer-events:none}