@charset "UTF-8";._resultScore_i7f20_1{width:50%;background:linear-gradient(to bottom,#7857ff,#2e2be9);color:#fff;border-radius:24px;display:flex;flex-direction:column;align-items:center;text-align:center}@media(max-width:767.98px){._resultScore_i7f20_1{border-top-left-radius:0;border-top-right-radius:0;width:100%}}._resultScore_i7f20_1 ._scoreCircle_i7f20_18{width:clamp(15rem,133.6448598131px + 4.3613707165vw,22rem);height:clamp(15rem,133.6448598131px + 4.3613707165vw,22rem);background:linear-gradient(to bottom,#4e21ca,#2421ca00);color:inherit;margin:3.2rem 0;border-radius:50%;display:flex;justify-content:center;align-items:center;flex-direction:column}._resultScore_i7f20_1 ._scoreCircle_i7f20_18 ._score_i7f20_18{font-size:7.4rem;font-weight:800}._resultScore_i7f20_1 ._scoreCircle_i7f20_18 ._total_i7f20_34{color:#c8c7ff}._resultScore_i7f20_1 ._grade_i7f20_37{margin-bottom:1.2rem;font-size:3.2rem}._resultScore_i7f20_1 ._description_i7f20_41{width:70%;color:#c8c7ff}._resultsSummaryCard_121tm_1{width:73rem;min-height:50rem;border-radius:2rem;background-color:#fff;box-shadow:0 1.2rem 6rem #27009120;display:flex;flex-direction:row}@media(max-width:767.98px){._resultsSummaryCard_121tm_1{width:100%;align-items:center;flex-direction:column}}._item_1pvgt_1{width:100%;height:100%;padding:1.6rem 1.4rem;border-radius:1.2rem;display:flex;align-items:center;flex-direction:row}._item_1pvgt_1 ._itemCategory_1pvgt_10{display:flex;flex-direction:row;gap:1.2rem}._item_1pvgt_1 ._itemScore_1pvgt_15{color:#000;margin-left:auto;font-weight:700}._item_1pvgt_1 ._itemScore_1pvgt_15 span{color:#303b5a;opacity:.5}._summaryList_z7d6e_1{width:50%;padding-inline:4.2rem;display:flex;flex-direction:column;gap:2.8rem}@media(max-width:767.98px){._summaryList_z7d6e_1{width:80%;min-width:400px}}._summaryList_z7d6e_1 ._list_z7d6e_14{display:flex;flex-direction:column;gap:1.6rem}._summaryList_z7d6e_1 ._button_z7d6e_19{position:relative;background-color:#303b5a;color:#fff;font-weight:700;width:100%;padding:1.8rem 0;border-radius:3.2rem;z-index:1}._summaryList_z7d6e_1 ._button_z7d6e_19:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to bottom,#7857ff,#2e2be9);border-radius:inherit;opacity:0;transition:opacity .3s;z-index:-1}._summaryList_z7d6e_1 ._button_z7d6e_19:hover:after{opacity:1}html{font-size:62.5%;box-sizing:border-box;scroll-behavior:smooth}body{width:100%;min-height:100vh;font-family:HankenGrotesk,sans-serif;font-size:1.8rem;font-weight:500;color:#303b5a;display:flex;justify-content:center;align-items:center}@media(max-width:767.98px){#root{width:100%;height:100%}}@font-face{font-family:HankenGrotesk;src:url(/My-practices-in-the-frontend-mentor/demo/newbie/results-summary-component-demo/assets/HankenGrotesk-Medium-Xu500KWa.ttf);font-style:normal;font-weight:500;font-display:wrap}@font-face{font-family:HankenGrotesk;src:url(/My-practices-in-the-frontend-mentor/demo/newbie/results-summary-component-demo/assets/HankenGrotesk-Bold-DkRj-xgz.ttf);font-style:normal;font-weight:700;font-display:wrap}@font-face{font-family:HankenGrotesk;src:url(/My-practices-in-the-frontend-mentor/demo/newbie/results-summary-component-demo/assets/HankenGrotesk-ExtraBold-BLQq7doA.ttf);font-style:normal;font-weight:800;font-display:wrap}*{padding:0;margin:0}*,*:before,*:after{box-sizing:border-box}a,a:link,a:visited,a:hover{text-decoration:none;cursor:pointer}aside,nav,footer,header,section,main{display:block}ul,ol{list-style:none}li{list-style-type:none}img{vertical-align:top;max-width:100%;height:auto}svg{max-width:100%;height:auto}address{font-style:normal}input,textarea,button,select{font-family:inherit;font-size:inherit;color:inherit;background-color:transparent}input::-ms-clear{display:none}button,input[type=submit]{display:inline-block;box-shadow:none;background:none;cursor:pointer}input[type=file]{max-width:100%}input[type=text]:focus,textarea[type=text]:focus,button[type=button]:focus,select:focus{outline:none}button{border:none}.no-display{display:none}.diaply-block{display:block}.vertical-padding-24{padding-top:3.8rem;padding-bottom:3.8rem}.title{font-size:2.4rem}.title--light-lavender{color:#c8c7ff}
