html{box-sizing:border-box;font-size:62.5%}*,*:before,*:after{box-sizing:inherit}*{margin:0;padding:0}body{font-size:1.8rem;font-family:system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol}input,button,textarea,select{font:inherit}h1,h2,h3,h4,h5{font-size:inherit;font-weight:inherit}ul{list-style-type:none}img,picture,video,canvas,svg{display:block}:root{--button-color: rgb(230, 230, 230);--button-hover: rgb(218, 218, 218);--button-active: rgb(204, 204, 204)}#root{padding:20px;display:grid;justify-items:center;gap:20px}h1{font-size:3rem;text-align:center}input,textarea{padding:3px 5px;font-size:1.6rem}select{padding:3px;font-size:1.6rem;background-color:#fff;border:.8px solid rgb(118,118,118);border-radius:2px}input:focus-visible,textarea:focus-visible,select:focus-visible{border-color:transparent;outline:3px solid rgb(12,166,237);border-radius:3px}button:focus-visible{border-color:transparent;outline:3px solid rgb(12,166,237)}#root>p{color:red}.required-line{font-size:2rem;font-weight:700}#root>p:not([class=required-line]){font-size:1.6rem;font-weight:500}form{display:grid;gap:25px}fieldset{padding:25px 20px}fieldset>legend{font-size:2rem;font-weight:700}.school-company-block{margin-bottom:45px;display:grid}.school-company-block>p:not(:last-child),fieldset>p:not(:last-child){margin-bottom:25px}.school-company-block>p,fieldset>p{display:flex;align-items:center;gap:10px;position:relative;width:max-content}.school-company-block>p[class=responsibilities-line]{align-items:flex-start}.school-company-block>p>label,fieldset>p>label{width:150px;flex-shrink:0}.delete-button{margin-bottom:8px;justify-self:center;background-color:#8b0000;color:#fff;padding:5px 12px;border:2px outset silver;border-radius:12px}.delete-button:hover{background-color:#720000}.delete-button:active{background-color:#5b0000;border-style:inset}.invalid{background-color:#ffd9d9}.invalid-select,.invalid-select:focus-visible{border-color:transparent;outline:3px dashed red}.error{font-size:1.5rem;color:red;font-weight:700;position:absolute;right:0;transform:translate(calc(100% + 10px))}.year-line{margin:-5px 0 30px;display:flex;gap:10px;align-items:flex-end}.year-line>span{width:150px;flex-shrink:0}.year-line>div{display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}.month-and-year{display:flex;gap:10px}.month-and-year>div{display:grid;gap:5px}.month-and-year>div>label{padding-left:5px;font-size:1.5rem;color:#00008b}.month-and-year>div>label[class=year-error]{color:red;font-weight:700}.month-and-year input{max-width:100px}.add-button{padding:5px 15px;background-color:var(--button-color);border:2px outset silver;border-radius:12px}.add-button:hover{background-color:var(--button-hover)}.add-button:active{border-style:inset;background-color:var(--button-active)}textarea{line-height:1.5}form>button{margin-top:10px;justify-self:center;font-size:2rem;padding:8px 28px;border-radius:12px;background-color:var(--button-color);border:2px outset silver}form>button:hover{background-color:var(--button-hover)}form>button:active{border-style:inset;background-color:var(--button-active)}@media (max-width: 660px){fieldset{padding-bottom:30px}.school-company-block>p:not(:last-child),fieldset>p:not(:last-child){margin-bottom:35px}.error{font-size:1.4rem;right:auto;bottom:0;transform:translate(165px,calc(100% + 5px))}.year-line{margin-top:10px}}@media (max-width: 715px){.year-line{align-items:flex-start}textarea{width:220px}}.resume{font-size:1.6rem;margin:10px 0;display:grid;gap:28px;line-height:1.5;border:1px solid silver;padding:30px;max-width:625px}section{display:grid;gap:5px}.general-section>p:first-child{font-weight:500;font-size:2.4rem}.general-section>p:not(:first-child){font-size:1.8rem}h2{font-weight:700;font-size:1.8rem;margin-bottom:3px}h3{font-weight:500}section>div:not(:last-child){margin-bottom:8px}.position-title{margin-top:3px}.work-year{margin-bottom:3px}pre{font:inherit;padding-left:10px;white-space:pre-wrap;overflow-wrap:break-word}.edit-button{font-size:2rem;padding:8px 28px;border-radius:12px;background-color:var(--button-color);border:2px outset silver}.edit-button:hover{background-color:var(--button-hover)}.edit-button:active{border-style:inset;background-color:var(--button-active)}
