/*
 * CSSMin
 * CSS Compressor
 * http://foohack.com/
 * http://www.smallsharptools.com/Projects/Packer/
*/

/* C:\Builds\8\Project Member Centre\MC.RC.Web\src\Releases\21.02RC02\MemberCentre.Web\MemberCentre.Web.Public\css/membercentre.responsive.css */
 @media(max-width:1024px){body.mjol_body{font-size:14px;-webkit-text-size-adjust:100%}.mjol_body div#container{width:100%}.mjol_body #container div#wrapper{width:100%;padding:0;margin:0}.mjol_body div#headersContainer h1{font-size:16px;line-height:20px}.mjol_body #mainContent{padding:15px 10px}.mjol_body #content{width:100%;border-top:2px solid #777;padding:0}.mjol_body input,.mjol_body select,.mjol_body textarea,.mjol_body input#ApplicationId{overflow:visible!important;border:1px solid #bababa!important}.mjol_body #divClassifications LABEL{-webkit-padding-start:0}.mjol_body #lblMemberText{padding-left:0}.mjol_body div#header{width:100%}.mjol_body .pageHeader A#homeLink{position:absolute}.mjol_body A#homeLink{background-size:160px;top:25px;height:60px;width:55%;left:10px;position:absolute}.mjol_body #header .pageHeader{height:100px;padding:0;margin:0;width:100%;position:relative}.mjol_body #header .pageHeader h1{padding:0;margin:15px 10px 0 0;font-size:18px;float:right}.mjol_body #topMenu{position:initial;top:initial;text-align:right;font-size:12px;padding:10px 10px 0 0}.mjol_body #topMenu .fontSizeBox{display:none}.stepHeader{font-size:13px}div#mjolContainer{margin:0}div#mjolContainer .breadcrumbs{width:100%;display:inline-block;position:relative;min-height:45px}#mjolNavBar{width:65%;float:left;padding:0}#mjolContainer #mjolNavBar li{display:none;border:none!important;text-align:left}#mjolNavBar li .stepProgressText{margin-left:19px;display:block;font-size:14px;color:#333}#mjolContainer .breadcrumbs #mjolNavBar li.highlight{display:block;padding:0;background:none;position:absolute;font-size:1.2em;color:#000}.progress-wrapper{display:block;width:35%;float:right}.progress-wrapper .progress-bar{position:relative;height:80px;width:80px}.progress-wrapper .progress-bar div{position:absolute;height:80px;width:80px;border-radius:50%}.progress-wrapper .progress-bar div span{position:absolute;font-family:Arial;font-size:15px;line-height:65px;height:64px;width:64px;left:7.5px;top:7.5px;text-align:center;border-radius:50%;background-color:#fff;font-weight:700}.progress-wrapper .progress-bar .background{background-color:#b3cef6}.progress-wrapper .progress-bar .rotate{clip:rect(0 37px 100px 0);background-color:#4b86db}.progress-wrapper .progress-bar .left{clip:rect(0 43px 100px 0);opacity:1;background-color:#b3cef6}.progress-wrapper .progress-bar .right{clip:rect(0 43px 100px 0);transform:rotate(180deg);opacity:0;background-color:#4b86db}.position{float:right!important;margin:0!important}#mjolContainer div#validationSummary{padding:5px;margin:10px 0}#mjolContainer div#validationSummary ul li{list-style:none}td.ioPerfText p{margin:0}#mjolContainer h1{line-height:15px;margin:20px 0;padding:0;font-size:20px;font-weight:700}#mjolContainer h2{font-size:1.2em;margin:0 0 15px}#mjolMemberProfileSummaryContainer .dataGroup,.moduleSummaryContainer .dataGroup{width:100%}#mjolCommunicationDetails DIV.fiLabel,#mjolCommunicationDetails DIV.fiElem{width:auto!important}#mjolButtonContainer{float:none;width:100%;text-align:right}.mjolModule{padding:10px}.mjolModule #divFollowUpContent{overflow:auto}#stepContainer #frmClassifications br{display:none}div#divFollowUpContent #btnCancel{margin:20px 0 0}a#btnPrev{float:left}.mjolModule table td{line-height:18px}#divClassifications .SelectedClassificationColumn1{padding:6px 2px 0 0}#frmInvestment TR.rowHeading TD{font-size:1em}table#mjolDefaultInvestmentOptionsTable tr td#ioTransferSplitSum{text-align:left}#frmInvestment .ioInvestOptions,#frmInvestment .ioTransferSplit{width:35%}.total #ioTransferSplitSum{text-align:left}.valueValid{color:#82AC45}#tfn .formItem .fiLabel .display-label{margin-top:15px;display:block}#mjolContainer .tfnCheckbox p{margin-bottom:0}#mjolContainer .tfnCheckbox ul{margin-left:20px}#mjolContainer #stepContainer #IsTfnConsentOptIn{margin-right:0}#mjolContainer .tfnCheckbox label{display:block;padding-left:20px;text-indent:-20px}#mjolContainer .tfnCheckbox input#IsTfnConsentOptIn{width:15px;height:15px;padding:0;margin:0;position:relative;top:2px;float:none}#mjolContainer #frmDeclaration TABLE{margin-left:0}#mjolContainer #frmDeclaration td{padding:2px 0 5px}#mjolContainer #frmDeclaration td.td1{width:20px}#mjolContainer #stepContainer #IsTermsAndConditionsAccepted{margin-right:0}#mjolContainer #frmDeclaration label{display:block;padding-left:20px;text-indent:-20px}#mjolContainer #frmDeclaration input#IsTermsAndConditionsAccepted{width:15px;height:15px;padding:0;margin:0;position:relative;top:2px;float:none}#mjolContainer #frmCaptcha .intro{padding-bottom:10px}#mjolContainer #frmCaptcha input#CaptchaCode{width:160px}#frmMemberProfile SELECT,#frmMemberProfile input,.fiElem input#Password,input#ConfirmPassword,#mjolContainer #frmCaptcha input#CaptchaCode,#frmInvestment .ioTransferSplit input{overflow:visible!important;border:1px solid #bababa}#subscriptionContainer .inputStyle{margin:5px 0}#mjolContainer #frmBeneficiaries div p{margin:5px}#mjolContainer #mjolDefaultInvestmentOptionsTable{width:100%!important;margin-bottom:20px}#mjolContainer #mjolInvestmentOptionsTable{width:100%!important;margin-bottom:20px}#frmBeneficiaries #beneDetailsContainer #beneficiariesTable thead th{text-align:left;padding:10px}#frmBeneficiaries #beneDetailsContainer #beneficiariesTable.dataTable tbody tr.child td{padding-left:43px}#frmBeneficiaries #beneDetailsContainer #beneficiariesTable thead th.benefit.all.sorting_disabled{text-align:center}#beneficiariesTable tr:not(.child) td:last-child:not(.dataTables_empty){text-align:center;padding-left:8px}table#beneficiariesTable tbody tr td{padding:10px 5px}table.dataTable>tbody>tr.child ul{width:100%}table#beneficiariesTable th.givenNames{padding:10px}table#beneficiariesTable tbody tr td{padding:8px;padding-left:10px}#beneDetailsContainerSummary table#beneficiariesTable tbody tr td{padding:8px 30px}table#beneficiariesTable th.givenNames{padding:8px;text-align:left}table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child,table.dataTable.dtr-inline.collapsed>tbody>tr>th:first-child{padding-left:30px}#superListContainer .fundselectionlistbody tr td{border-bottom:1px solid #ccc;padding:5px 2px}table.dataTable.no-footer{border-color:#ccc}div#superDetailsContainer{margin:0}#FundNameToSearch{width:100%}div#superDetailsSubContainer legend{width:100%}p#previousNameContainer{width:100%}.summaryEditContainer{text-align:right;padding:0;margin:0 0 15px}.summaryHeader h2{text-align:left;font-size:16px!important;padding-top:30px!important;display:block}#addressContainer .fiElem p{margin:0}#stepContainer .iconCell{width:5px}#btnResumeContainer .oc-button{vertical-align:middle}#btnResumeContainer{padding:15px 0;float:none;text-align:right}form#frmResumeApplication,form#frmForgotApplication{padding:0 2%}div#superDetailsContainer{margin:0}#FundNameToSearch{width:175px}div#superDetailsSubContainer legend{width:100%}p#previousNameContainer{width:100%}img.ui-datepicker-trigger{margin-top:5px}#frmInvestment .ioTransferSplit,#frmInvestment .ioPerfText{width:100%}table#beneficiariesTable{margin-top:30px}div.simplemodal-container{padding:15px 12px 12px}div#simplemodal-overlay{background-color:#000;width:100%!important;height:100%!important}div#simplemodal-container{width:92%!important;left:50%!important;right:auto;padding:2%!important;top:50%!important}div.simplemodal-container A.modalCloseImg{display:inline!important}#dialogContainer{padding:5px}#mjolPopupContainer h3{padding-bottom:10px;font-size:1.2em;margin:0}#simplemodal-container .oc-button span{border-bottom:none;margin:0 0 10px;color:#fff}#btnSaveContainer{text-align:left}div#mjolPopupContainer #btnSaveContainer a#btnCancel.oc-button{margin-left:0}div#mjolPopupContainer #frmSave fieldset{width:100%}div#mjolPopupContainer #frmSave fieldset div.fiLabel{width:100%;font-size:90%}.mjol_body #loadingSpinner{left:45%}#mjolContainer fieldset div.fiLabel{width:100%}#mjolContainer .fiElem{width:100%}#frmMemberProfile SELECT,#frmMemberProfile input{width:91%;padding:5px}.mjol_body img.emailTooltip{margin-left:2px!important}.mjol_body img#imgPasswordTooltip{margin:0;padding:0}.fiElem input#Password,input#ConfirmPassword{width:85%;padding:5px}input#IsTfnConsentOptIn{float:left;width:10px;margin:0 5px 0 0}input#IsTermsAndConditionsAccepted{margin-left:0;margin-bottom:0}#frmInvestment .ioInvestOptions,#frmInvestment .ioTransferSplit{width:20%;text-align:left}#frmInvestment .ioPerfText{width:30%}table#mjolDefaultInvestmentOptionsTable th{font-size:.85em;text-align:left}fieldset#fldsetAdditionOptions .formItem .additionalOptionContainer .fiLabel,#frmCaptcha .fiLabel{width:100%}fieldset#fldsetAdditionOptions .formItem .additionalOptionContainer label input[type="radio"]{width:5%;float:left}#mjolContainer .pwdHint{width:100%;padding:5px 0}#confirmPasswordUnmatch,#confirmPasswordMatch,form#frmPassword fieldset .formItem .fiElem #confirmPasswordUnmatch,#confirmPasswordMatch{padding-left:0!important}#validationSummary{margin:3% 5% 5%}div#beneButtonContainer{margin:5% 0 0}.summaryEditContainer .mjolEditButton{font-size:1em;background:#777;padding:5px 15px;text-align:center}.mjol_body #contactUsContainer .label{width:100%}.mjol_body #contactUsContainer .fiLabel{width:100%}.mjol_body #contactUsContainer textarea{width:75%}.mjol_body #contactUsContainer input[type=text]{width:75%;padding:5px}.mjol_body #contactUsContainer select#FeedbackType{padding:5px;width:75%}.mjol_body #frmContactUs .fiElem{width:75%}.mjol_body #contactUsContainer .formAction{text-align:left;margin-left:0}.mjol_body DIV.pageBlurb{width:100%}.mjol_body img.ui-datepicker-trigger{margin-top:5px}.mjol_body #footer{margin:1em 0}.mjol_body ul.footer{width:100%;padding:0;text-align:center}.mjol_body div#footer ul li{float:none}.mjol_body .outro{font-size:.80em;line-height:17px}.mjol_body ul.footer li{line-height:20px}.vertical_mjol #frmContactUs .fiElem{width:100%}.vertical_mjol #frmContactUs .fiElem input{width:100%}.vertical_mjol #frmContactUs #Comment{width:100%}.vertical_mjol #contactUsContainer .formAction{margin-left:0}.vertical_mjol #contactUsContainer .formAction .btnLinkToFullPage{margin:7px 0 0;float:left}.vertical_mjol #contactUsContainer .formAction .oc-button{margin:0}.vertical_mjol #content{width:100%;border-top:2px solid #e2e5ea}.vertical_mjol #mainContent{padding:0 15px}.vertical_mjol #header{margin-bottom:0}.vertical_mjol #topMenu .ContactUs .btnLinkToContainer{margin-left:0;padding:0}#btnResumeContainer a{float:left;margin-top:7px}#btnResumeContainer a#btnResume{float:right;margin-top:0}.vertical_mjol #progression{position:initial;top:initial;left:initial;margin:15px 0 25px}.vertical_mjol #progression #progressBar{width:98%;padding:1%;position:initial;top:initial;left:initial;margin:0;border:0}.verticalMjolContainer #progression span#progressPercentage{margin-left:0;line-height:20px}.vertical_mjol #mainContent ul{margin:0!important}.vertical_mjol #topVerticalPanels{margin:0!important}.vertical_mjol #topVerticalPanels .visitedStep{font-size:16px;padding:10px}.vertical_mjol #currentStepHeader{font-size:23px}.vertical_mjol #stepContainer .accordionGroupHeader{font-size:16px;padding:12px 0 10px}.vertical_mjol #stepContainer .accordionGroupHeader:before{padding-right:0}.vertical_mjol #stepContainer .accordionGroupHeader.ui-accordion-header-active{padding:15px 20px 5px 0}.vertical_mjol #stepContainer .accordionGroupHeader.ui-accordion-header-active:before{padding-right:0}.vertical_mjol #bottomVerticalPanels li{font-size:16px;padding:10px}.vertical_mjol #stepContainer .accordionGroupBody{padding-left:0}.vertical_mjol #mjolContainer div.fiLabel{text-align:left;width:100%}.vertical_mjol #mjolContainer div.fiElem{width:100%}.vertical_mjol #mjolContainer div.fiElem input{width:90%}.vertical_mjol #DateOfBirth{width:165px!important}.vertical_mjol #mjolButtonContainer{float:left}.vertical_mjol #mjolButtonContainer #btnPrev,.vertical_mjol #mjolButtonContainer #btnSave,.vertical_mjol .btnLinkToContainerNoHistory{padding:0}.vertical_mjol #mjolButtonContainer #btnPrev span,.vertical_mjol #mjolButtonContainer #btnSave span,.vertical_mjol .btnLinkToContainerNoHistory span{padding:0;background:none!important;font-size:15px}.vertical_mjol #mjolButtonContainer #btnPrev span:before{background:none!important}.vertical_mjol #mjolButtonContainer #btnSave span{margin-right:10px}.vertical_mjol #classificationsAccordion .ui-accordion-content{height:auto;padding:0 15px 5px 30px}table#mjolDefaultInvestmentOptionsTable{width:100%!important}th.ioTransferSplit.all.sorting_disabled,th.ioInvestOptions.all.sorting_disabled{width:100%!important;text-transform:inherit;text-align:center;font-size:1em}table#mjolDefaultInvestmentOptionsTable tfoot td{padding:10px}table#mjolInvestmentOptionsTable{width:100%!important}.vertical_mjol #stepContainer #frmSummary .summaryHeader h2{padding:0!important;margin:0!important}.summaryEditContainer{float:right}.summaryEditContainer .mjolEditButton{background:#fff;border-radius:5px;border:1px solid #b1b1b1}.vertical_mjol #stepContainer #frmSummary .dataGroup{padding-left:0}.vertical_mjol #stepContainer #frmSummary .beneSummaryContainer{padding-left:0}.vertical_mjol #stepContainer #frmSummary .dataGroup{padding-left:0}.vertical_mjol #stepContainer #mjolCommPrefSummaryContainer #mjolCommunicationDetails{padding:0}.vertical_mjol #stepContainer #mjolCommPrefSummaryContainer #mjolCommunicationDetails .formItem .fiLabel{width:100%}th.ioInvestOptions.sorting_disabled{width:100%}table#mjolDefaultInvestmentOptionsTable thead tr th{font-size:1em}.vertical_mjol #stepContainer #confirmPasswordMatch{position:static;margin-left:0}#confirmPasswordUnmatch,#confirmPasswordMatch,form#frmPassword fieldset .formItem .fiElem #confirmPasswordUnmatch,#confirmPasswordMatch{position:static;margin-left:0}.vertical_mjol #stepContainer .accordionGroupBody .pwdHint{position:static;margin-left:0}.vertical_mjol #footer{padding:20px 15px 40px}.vertical_mjol div#footer ul li{font-size:1em;line-height:25px}.mjol_body div#footer ul li{list-style:none;font-size:.90em}.mjol_body SPAN.version{width:100%;clear:both}.mjol_body .desktop{display:none}.mjol_body .tablet{display:inherit}.summaryHeader{padding:10px 0;margin:10px 0}.summaryHeader h2{padding:0!important}#mjolContainer #frmSummary h2{width:70%;float:none;display:inline-block;margin:0!important}.summaryHeader{padding:10px 0;margin:10px 0}.summaryHeader h2{padding:0!important}.summaryEditContainer .mjolEditButton{padding:0;display:inline-block}.summaryEditContainer .mjolEditButton span{padding:5px 15px;display:block}.tfnCheckbox{margin:10px 0 0}.tfnCheckbox input{width:auto!important}}@media(max-width:768px){.mjol_body #loadingSpinner{left:33%}.mjol_body #transfer-details td{display:block}.mjol_body #mjolDefaultInvestmentOptionsTable thead tr th,table#mjolInvestmentOptionsTable thead tr th{width:100%!important}#tbFundList #trTemplate td{width:30%!important;float:left;display:inline-block;text-align:left;margin-right:10px;font-size:.90em;padding-left:5px}table.fundselectionlistheader tr th{width:30%!important;text-align:left;padding:10px 0 10px 5px}table.fundselectionlistheader tr th:nth-child(1){width:90px!important}table.fundselectionlistheader tr th:nth-child(3){width:80px!important}table#fundTable ul li{padding:7px 0;margin-left:0}#superListContainer .fundselectionlistbody tr td{border:none}}@media(max-width:720px){.mjol_body #contactUsContainer textarea{width:100%}.mjol_body #contactUsContainer input[type=text]{width:100%;padding:5px}.mjol_body #contactUsContainer select#FeedbackType{padding:5px;width:100%}.mjol_body #frmContactUs .fiElem{width:100%}#tbFundList #trTemplate td{width:26%!important}table.fundselectionlistheader tr th{width:26%!important}}@media(max-width:480px){form#frmResumeApplication h1{font-size:1.6em;margin-bottom:10px}.mjol_body fieldset{width:100%}div#simplemodal-container #btnSaveContainer .oc-button{padding-right:0;width:100%}div#simplemodal-container .oc-button span{width:80%}.alignLeft{left:5px!important}}@media(max-width:380px){#frmInvestment .ioTransferSplit{text-align:center}.mjol_body #frmInvestment .ioTransferSplit input{width:50px}}@media(max-width:320px){form#frmResumeApplication label{width:100%}form#frmResumeApplication label#Passcode{margin-bottom:10px}div#beneButtonContainer{padding-bottom:45px}table#mjolDefaultInvestmentOptionsTable th{font-size:11px}table.dataTable thead th,table.dataTable thead td,table.dataTable tfoot th,table.dataTable tfoot td{padding:5px}.fundselectionlistheader tr th:first-child{width:90px!important}#superDetailsContainer .fiLabel{width:100%!important}.editLink{padding-left:0}.editLink,.removeLink{font-size:12px}.alignLeft{left:5px!important}}
/* C:\Builds\8\Project Member Centre\MC.RC.Web\src\Releases\21.02RC02\MemberCentre.Web\MemberCentre.Web.Public\css/DataTables/responsive.dataTables.css */
table.dataTable.dtr-inline.collapsed>tbody>tr>td.child,table.dataTable.dtr-inline.collapsed>tbody>tr>th.child,table.dataTable.dtr-inline.collapsed>tbody>tr>td.dataTables_empty{cursor:default!important}table.dataTable.dtr-inline.collapsed>tbody>tr>td.child:before,table.dataTable.dtr-inline.collapsed>tbody>tr>th.child:before,table.dataTable.dtr-inline.collapsed>tbody>tr>td.dataTables_empty:before{display:none!important}table.dataTable.dtr-inline.collapsed>tbody>tr>td:first-child,table.dataTable.dtr-inline.collapsed>tbody>tr>th:first-child{position:relative;padding-left:30px;cursor:pointer}table.dataTable.dtr-inline.collapsed>tbody>tr>td:not([colspan]):first-child:before,table.dataTable.dtr-inline.collapsed>tbody>tr>th:not([colspan]):first-child:before{top:8px;left:4px;height:16px;width:16px;display:block;position:absolute;color:#fff;border:2px solid white;border-radius:16px;box-shadow:0 0 3px #444;box-sizing:content-box;text-align:left;font-family:'Courier New',Courier,monospace;text-indent:4px;line-height:16px;content:'+';background-color:#31b131}table.dataTable.dtr-inline.collapsed>tbody>tr.parent>td:first-child:before,table.dataTable.dtr-inline.collapsed>tbody>tr.parent>th:first-child:before{content:'-';background-color:#d33333}table.dataTable.dtr-inline.collapsed>tbody>tr.child td:before{display:none}table.dataTable.dtr-inline.collapsed.compact>tbody>tr>td:first-child,table.dataTable.dtr-inline.collapsed.compact>tbody>tr>th:first-child{padding-left:27px}table.dataTable.dtr-inline.collapsed.compact>tbody>tr>td:first-child:before,table.dataTable.dtr-inline.collapsed.compact>tbody>tr>th:first-child:before{top:5px;left:4px;height:14px;width:14px;border-radius:14px;line-height:14px;text-indent:3px}table.dataTable.dtr-column>tbody>tr>td.control,table.dataTable.dtr-column>tbody>tr>th.control{position:relative;cursor:pointer}table.dataTable.dtr-column>tbody>tr>td.control:before,table.dataTable.dtr-column>tbody>tr>th.control:before{top:50%;left:50%;height:16px;width:16px;margin-top:-10px;margin-left:-10px;display:block;position:absolute;color:#fff;border:2px solid white;border-radius:16px;box-shadow:0 0 3px #444;box-sizing:content-box;text-align:left;font-family:'Courier New',Courier,monospace;text-indent:4px;line-height:16px;content:'+';background-color:#31b131}table.dataTable.dtr-column>tbody>tr.parent td.control:before,table.dataTable.dtr-column>tbody>tr.parent th.control:before{content:'-';background-color:#d33333}table.dataTable>tbody>tr.child{padding:.5em 1em}table.dataTable>tbody>tr.child:hover{background:transparent!important}table.dataTable>tbody>tr.child ul{display:inline-block;list-style-type:none;margin:0;padding:0}table.dataTable>tbody>tr.child ul li{border-bottom:1px solid #efefef;padding:.5em 0}table.dataTable>tbody>tr.child ul li:first-child{padding-top:0}table.dataTable>tbody>tr.child ul li:last-child{border-bottom:none}table.dataTable>tbody>tr.child span.dtr-title{display:inline-block;min-width:75px;font-weight:700}div.dtr-modal{position:fixed;box-sizing:border-box;top:0;left:0;height:100%;width:100%;z-index:100;padding:10em 1em}div.dtr-modal div.dtr-modal-display{position:absolute;top:0;left:0;bottom:0;right:0;width:50%;height:50%;overflow:auto;margin:auto;z-index:102;overflow:auto;background-color:#f5f5f7;border:1px solid black;border-radius:.5em;box-shadow:0 12px 30px rgba(0,0,0,0.6)}div.dtr-modal div.dtr-modal-content{position:relative;padding:1em}div.dtr-modal div.dtr-modal-close{position:absolute;top:6px;right:6px;width:22px;height:22px;border:1px solid #eaeaea;background-color:#f9f9f9;text-align:center;border-radius:3px;cursor:pointer;z-index:12}div.dtr-modal div.dtr-modal-close:hover{background-color:#eaeaea}div.dtr-modal div.dtr-modal-background{position:fixed;top:0;left:0;right:0;bottom:0;z-index:101;background:rgba(0,0,0,0.6)}@media screen and (max-width:767px){div.dtr-modal div.dtr-modal-display{width:95%}}
/* C:\Builds\8\Project Member Centre\MC.RC.Web\src\Releases\21.02RC02\MemberCentre.Web\MemberCentre.Web.Public\css/jQuery-plugin-progressbar.css */
.position{float:left;margin:100px 20px}.progress-bar{position:relative;height:200px;width:200px}.progress-bar div{position:absolute;height:200px;width:200px;border-radius:50%}.progress-bar div span{position:absolute;font-family:Arial;font-size:25px;line-height:175px;height:175px;width:175px;left:12.5px;top:12.5px;text-align:center;border-radius:50%;background-color:#fff}.progress-bar .background{background-color:#b3cef6}.progress-bar .rotate{clip:rect(0 100px 200px 0);background-color:#4b86db}.progress-bar .left{clip:rect(0 100px 200px 0);opacity:1;background-color:#b3cef6}.progress-bar .right{clip:rect(0 100px 200px 0);transform:rotate(180deg);opacity:0;background-color:#4b86db}@keyframes toggle{0%{opacity:0}100%{opacity:1}}