.hidden {display:none} fieldset {border: 1px solid #049dff; padding-left: 40px; padding-right: 20px} legend {width: auto;text-align: left !important; padding: 10px; color: #049dff;} fieldset.sub_block {border: 1px solid black; margin:-20px 0px 20px -15px} fieldset.sub_block legend {color: black} h1 { color: #049dff; margin-top:50px;} a.stop {font-weight:bold; text-decoration:none; font-size:30px} table {border: 1px solid #049dff; width:100%;} table th {padding-left: 20px; color: #049dff; width: 25%;} table td {padding-left: 20px; text-align:left; width: 25%;} label {text-align: left !important;} body#scan{ /* background-color: #7E57C2; */ } .red {color: red} .green {color: green} .mt-100{ margin-top: 100px; } .progress { width: 150px; height: 150px !important; float: left; line-height: 150px; background: none; margin: 20px; box-shadow: none; position: relative; } .progress:after { content: ""; width: 100%; height: 100%; border-radius: 50%; border: 12px solid #fff; position: absolute; top: 0; left: 0; } .progress>span { width: 50%; height: 100%; overflow: hidden; position: absolute; top: 0; z-index: 1; } .progress .progress-left { left: 0; } .progress .progress-bar { width: 100%; height: 100%; background: none; border-width: 12px; border-style: solid; position: absolute; top: 0; } .progress .progress-left .progress-bar { left: 100%; border-top-right-radius: 80px; border-bottom-right-radius: 80px; border-left: 0; -webkit-transform-origin: center left; transform-origin: center left; } .progress .progress-right { right: 0; } .progress .progress-right .progress-bar { left: -100%; border-top-left-radius: 80px; border-bottom-left-radius: 80px; border-right: 0; -webkit-transform-origin: center right; transform-origin: center right; animation: loading-1 4.8s linear forwards; } .progress .progress-value { width: 90%; height: 90%; border-radius: 50%; background: #000; font-size: 24px; color: #fff; line-height: 135px; text-align: center; position: absolute; top: 5%; left: 5%; } .progress.blue .progress-bar { border-color: #049dff; } .progress.blue .progress-left .progress-bar { animation: loading-1 4.5s linear forwards 4.8s; } @keyframes loading-1 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(180deg); transform: rotate(180deg); } } @keyframes loading-2 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(144deg); transform: rotate(144deg); } } @keyframes loading-3 { 0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); } 100% { -webkit-transform: rotate(135deg); transform: rotate(135deg); } }