.tab{background-color:#f1f1f1;border:1px solid #ccc;overflow:hidden}.f3{width:100%;max-width:100%;height:700px;max-height:calc(100vh - 80px);margin:auto;position:relative}.f3 .cursor-pointer{cursor:pointer}.f3 svg.main_svg{color:#3b5560;background-color:#3b5560;width:100%;height:100%}.f3 svg.main_svg text{fill:currentColor}.f3 rect.card-female,.f3 .card-female .card-body-rect,.f3 .card-female .text-overflow-mask{fill:#ffb6c1}.f3 rect.card-male,.f3 .card-male .card-body-rect,.f3 .card-male .text-overflow-mask{fill:#add8e6}.f3 .card-genderless .card-body-rect,.f3 .card-genderless .text-overflow-mask{fill:#d3d3d3}.f3 .card_add .card-body-rect{fill:#3b5560;stroke-width:4px;stroke:#fff;cursor:pointer}.f3 g.card_add text{fill:#fff}.f3 .card-main{stroke:#000}.f3 .card_family_tree rect{transition:all .3s}.f3 .card_family_tree:hover rect{transform:scale(1.1)}.f3 .card_add_relative{cursor:pointer;color:#fff;transition:all .3s}.f3 .card_add_relative circle{fill:#0000}.f3 .card_add_relative:hover{color:#000}.f3 .card_edit.pencil_icon{color:#fff;transition:all .3s}.f3 .card_edit.pencil_icon:hover{color:#000}.f3 .card_break_link,.f3 .link_upper,.f3 .link_lower,.f3 .link_particles{transform-origin:50%;transition:all 1s}.f3 .card_break_link{color:#fff}.f3 .card_break_link.closed .link_upper{transform:translate(-140.5px,655.6px)}.f3 .card_break_link.closed .link_upper g{transform:rotate(-58deg)}.f3 .card_break_link.closed .link_particles{transform:scale(0)}.f3 .input-field input{height:2.5rem!important}.f3 .input-field>label:not(.label-icon).active{transform:translateY(-8px)scale(.8)}.tabs button.active{color:#fff;background-color:#111827}.tabcontent{border-top:none;padding:6px 12px;display:none}.tabs{gap:10px;width:80%;margin:auto;display:flex}.tabs button{border:none;border-radius:5px;outline:none;width:100%;padding:13px}.tab button{background-color:inherit;float:left;cursor:pointer;border:none;outline:none;padding:14px 16px;transition:all .3s}.tab button.active{background-color:#ddd}.tabcontent{width:100%;display:none}