@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,400i,700);*{margin:0;padding:0;outline:none;text-decoration:none;list-style:none;font-family:Open Sans,sans-serif}body{display:flex;align-items:center;justify-content:center;background:linear-gradient(-45deg,#ee7752,#e73c7e,#23a6d5,#23d5ab);margin:100px;animation:Gradient 15s ease infinite}.list{width:339px;height:790px;padding-top:20px;padding-bottom:25px;background:#f7f9fd;border-radius:35px}.list .card{width:309px;height:132px;margin-left:15.5px;margin-bottom:2px;padding-top:17px;border-radius:8px;transition:.3s;cursor:pointer}.list .card.active{background:#fff;box-shadow:0 5px 27px rgba(52,87,220,.131454);margin-top:11px;margin-bottom:10px}.list .card:first-child{padding-bottom:23px}.list .card:hover{background:#fff;box-shadow:0 5px 27px rgba(52,87,220,.131454)}.list .card .chip{background:rgba(144,207,2,.1);border-radius:12.5px;width:106px;height:25px;display:flex;align-items:center;justify-content:center;font-family:Open Sans;font-style:normal;font-weight:400;font-size:12px;line-height:16px;margin-left:13.5px;color:#202842;margin-bottom:10px}.list .card .chip.two{background:rgba(255,163,12,.2)}.list .card .chip.three{background:#f2dfe3}.list .card h3{font-weight:700;font-size:16px;line-height:22px;color:#202842;margin-left:14px;padding-bottom:10px}.list .card h3,.list .card small{font-family:Open Sans;font-style:normal;margin-top:10px}.list .card small{font-weight:400;font-size:14px;line-height:19px;margin-left:13.5px;color:#5d698d}.card-one{width:100%;padding-top:35px;background:#fff;box-shadow:0 5px 27px rgba(52,87,220,.131454);border-radius:5px}.card-one h3{margin-left:50px;font-family:Open Sans;font-style:normal;font-weight:700;font-size:56px;line-height:30px;color:#202842;margin-bottom:45px}.card-one .container{margin:0 50px 0;margin-top:20px;margin-bottom:85px}.card-one .container .topLabels{width:100%;display:flex;justify-content:space-between}.card-one .container .topLabels label{font-family:Open Sans;font-style:normal;font-weight:400;font-size:36px;line-height:42px;color:#202842}.card-one .container .progress{margin-top:4px;margin-bottom:4px;width:100%;height:26px;background:#f7f9fd;border-radius:7.5px;overflow:hidden}.card-one .container .progress .bar{height:22px;background:#202842;border-radius:7.5px;margin-left:3px;margin-top:3px}.card-one .container label{font-family:Open Sans;font-style:normal;font-weight:400;font-size:22px;line-height:19px;color:#202842;margin-left:2px}.cont{font-size:32px}.bar{width:0;transition:width .5s linear}.cards{display:flex;justify-content:center}.cards .card{width:100%;height:117px;background:#fff;border:1px solid #f7f9fd;box-sizing:border-box;border-radius:5px;margin-right:15px;display:flex;align-items:center}.cards .card .icon{width:60px;height:60px;display:flex;justify-content:center;align-items:center;margin-left:25px;margin-right:17px;background:#eaefff;border-radius:50%}.cards .card .icon.two{background:#f9eaff}.cards .card .icon.three{background:#ffeaef}.cards .card .icon label{font-weight:400;font-size:18px;line-height:25px;margin-bottom:4px}.cards .card .icon h3,.cards .card .icon label{font-family:Open Sans;font-style:normal;color:#202842}.cards .card .icon h3{font-weight:700;font-size:28px;line-height:38px}@keyframes Gradient{0%{background-position:0 50%}50%{background-position:100% 50%}to{background-position:0 50%}}h1,h6{font-family:Open Sans;font-weight:300;text-align:center;position:absolute;top:45%;right:0;left:0}.shake{animation:shake-animation 4.72s ease infinite;transform-origin:50% 50%}.element{margin:0 auto;width:150px;height:150px;background:red}@keyframes shake-animation{0%{transform:translate(0)}1.78571%{transform:translate(5px)}3.57143%{transform:translate(0)}5.35714%{transform:translate(5px)}7.14286%{transform:translate(0)}8.92857%{transform:translate(5px)}10.71429%{transform:translate(0)}to{transform:translate(0)}}.backdrop{box-shadow:0 2px 10px #111;border-radius:190px}