main{display:flex;height:100vh}button{border-style:none;background-color:var(--accent-color)}.editing-area{background-color:var(--accent-color);width:60%;flex-grow:1;overflow-y:scroll;scrollbar-color:var(--accent-color);direction:rtl;padding-top:5rem;padding-right:1rem;display:flex;flex-direction:column;gap:2rem}.editing-area>*{direction:ltr}.editing-area h1{margin:0;text-align:center}.hidden{display:none}.toggle-expand{font-size:3rem}.expanded{transform:rotate(180deg)}.input-section{background-color:var(--main-color);border-top-right-radius:1.2rem;border-bottom-right-radius:1.2rem;padding:1.2rem;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));align-items:center;gap:2rem}.input-section h2{font-size:1rem;margin:0}.inputGroup{display:flex;align-items:center;flex-wrap:wrap;gap:1rem;padding:1rem;border-radius:1rem;background-color:var(--accent-color);width:100%}.input-field{min-width:30%;flex-grow:1}input{width:100%;height:1.7em;font-size:1rem;border-style:none;padding:0 1em}.add-group{width:100%;min-height:40px;height:100%;font-size:1.4rem;border-radius:1rem;cursor:pointer;transition:transform .2s}.add-group:hover{transform:scale(.9)}.remove{height:1.4rem;border-radius:6px}.input-section h1{font-weight:500}.preview-area{background-color:var(--background-color);min-width:50%;flex-grow:1;padding-bottom:1rem;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:auto;padding:5rem}.zoom-control{width:50px;height:50px;margin:2rem;border-radius:10px;font-size:2rem}.a4-sheet{height:297mm;aspect-ratio:210 / 297;background-color:#fff;box-shadow:4px 7px 10px 2px #0000001a;transform-origin:top;display:grid;gap:2rem;grid-template-columns:1fr 1.8fr;grid-template-rows:1fr 1fr;padding-left:2rem}p{margin:0;font-weight:300}li h3{margin-bottom:0}em{font-weight:300;margin-right:3rem}.name{background-color:var(--accent-color);height:100%;display:flex;align-items:flex-end;justify-content:center}.name h1{text-align:center;font-size:40px}.bio{grid-row-start:2;grid-row-end:3}.bio-container{border:solid 2px var(--accent-color);width:100%;padding:1rem}.edu{margin-top:4rem}li{list-style:none;padding:0;margin:0;position:relative;padding-left:2rem}li:before{content:"";position:absolute;left:0;width:2px;height:100%;background-color:var(--accent-color)}body,#root{height:100vh;margin:0;padding:0}*{box-sizing:border-box;font-family:var(--main-font)}#root{height:100%;--accent-color: rgb(255, 197, 131);--background-color: rgb(247, 243, 238);--main-color: rgb(243, 220, 192);--dark-font-color: rgb(80, 45, 0);--main-font: "Lato", sans-serif}
