:root{--app-body-background: hsl(0, 0%, 90%);--app-container-background-color: hsl(0, 0%, 75%);--app-text-color: hsl(0, 0%, 0%);--app-button-background-color: hsl(0, 0%, 50%);--app-button-text-color: hsl(0, 0%, 100%);--app-button-background-color-caution: var(--brand-color);--app-control-background-color: hsl(0, 0%, 0%);--app-control-text-color: hsl(0, 0%, 0%);--app-message-text-color: hsl(0, 0%, 0%);--app-panel-background-color: hsl(0, 3%, 75%);--app-panel-text-color: hsl(0, 0%, 0%);--background-color: hsl(0, 2%, 95%);--card-background: hsl(0, 100%, 100%);--card-text: var(--primary-color);--text-color: hsl(0, 0%, 0%);--form-field-label: hsl(0, 100%, 0%);--form-field-background: hsl(0, 0%, 80%);--form-field-text: hsl(0, 100%, 0%);--form-separator: var(--primary-color);--heading-color: hsl(0, 0%, 20%);--brand-color: hsl(27, 100%, 45%);--brand-dark: hsl(27, 100%, 35%);--brand-light: hsl(27, 100%, 60%);--link-color: hsl(27, 100%, 35%);--header-background-color: hsl(0, 0%, 20%);--header-nav-link-color: hsl(0, 100%, 100%);--footer-background-color: hsl(0, 0%, 20%);--footer-nav-link-color: hsl(0, 100%, 100%);--table-background-color: hsl(0, 0%, 90%);--table-heading-background-color: hsl(220, 30%, 50%);--table-heading-text-color: hsl(0,0,0);--table-border-color: hsl(0, 0%, 0%);--primary-color: hsl(0, 0%, 20%);--primary-light: hsl(0, 0%, 30%);--primary-dark: hsl(0, 0%, 10%);--danger-color: hsl(0, 100%, 50%);--warn-color: hsl(54, 100%, 50%);--info-color: hsl(220, 30%, 50%);--success-color: hsl(144, 93%, 16%);--main-radius: .5rem;--btn-radius: .1rem;--btn-round-radius: 50%;--gap-size-large: 5rem;--gap-size-medium: 3rem;--gap-size-small: 1rem;--gap-size-micro: .3rem}#theme-switch{display:flex;justify-content:center;align-items:center;margin:1rem;height:50px;width:50px;padding:0;background-color:var(--header-background-color);border:1px solid var(--brand-color);border-radius:50%}#theme-switch svg{fill:var(--brand-color)}#theme-switch svg:first-child{display:none}.dark-mode #theme-switch svg:last-child{display:none}.dark-mode #theme-switch svg:first-child{display:block}.dark-mode{--app-body-background: hsl(0, 0%, 40%);--app-container-background: hsl(0, 0%, 25%);--app-text-color: hsl(0, 0%, 100%);--app-button-color: var(--brand-color);--app-button-color-caution: var(--brand-color);--app-control-color: hsl(0, 3%, 75%);--app-control-text-color: hsl(0, 0%, 0%);--app-message-text: hsl(0, 0%, 100%);--app-panel-background-color: hsl(0, 3%, 30%);--background-color: hsl(0, 1%, 13%);--card-background: hsl(0, 1%, 40%);--card-text: hsl(0, 100%, 100%);--header-background-color: hsl(0, 1%, 30%);--text-color: hsl(0, 16%, 96%);--heading-color: hsl(0, 40%, 98%);--brand-color: hsl(27, 100%, 45%);--form-field-label: hsl(0, 0%, 100%);--form-field-background: hsl(0, 1%, 30%);--form-field-text: hsl(0, 0%, 100%);--form-separator: var(--form-field-text);--link-color: hsl(27, 100%, 45%);--header-nav-link-color: hsl(0, 100%, 100%);--footer-nav-link-color: hsl(0, 100%, 100%);--primary-color: hsl(0, 0%, 20%);--primary-light: hsl(0, 0%, 30%);--primary-dark: hsl(0, 0%, 10%);--form-field-background-color: hsl(0, 2%, 95%);--form-field-text-color: hsl(0, 0%, 0%);--table-background-color: hsl(0, 0%, 90%);--table-heading-background-color: hsl(220, 30%, 50%);--table-heading-text-color: hsl(0,0,0);--table-border-color: hsl(0, 0%, 0%)}*{box-sizing:border-box;margin:0;padding:0}body{display:flex;flex-direction:column;min-height:100vh;font-size:100%;font-family:Roboto,Arial,Helvetica,sans-serif;margin:0;padding:0;background-color:var(--background-color);color:var(--text-color)}main{flex-grow:1;width:90%;max-width:1200px;margin:2rem auto}p{color:var(--text-color);margin:1rem auto}a{text-decoration:none;color:var(--nav-link-color)}a:hover{text-decoration:none;color:var(--brand-color)}h1,h2,h3,h4,h5,h6{color:var(--heading-color);margin:1rem auto}hr{margin:1rem 0;color:var(--form-separator)}ul li{margin:auto 1.5rem}button{cursor:pointer;width:fit-content}.btn{background-color:var(--info-color);border:none;border-radius:.3rem;color:#fff;cursor:pointer;font-weight:700;margin:.2rem;padding:.5rem;text-decoration:none}.btn-branded{background-color:var(--brand-color);color:#fff;&:hover{background-color:var(--brand-dark)}}.btn-delete{background-color:red;color:#fff}.btn-delete:hover{background-color:#c00;color:#fff}.btn-cancel{background-color:gray;color:#fff;padding:.5rem}.btn-cancel:hover{background-color:#666}.btn-save{background-color:#666;color:#fff;padding:.5rem;&:hover{background-color:#4d4d4d}}.btn-nav{background-color:var(--brand-color);color:#fff;padding:.3rem 1rem;width:fit-content}.alert{height:fit-content;width:60%;font-size:1rem;margin:0 auto;text-align:center;border-radius:.3rem;padding:.75rem 1.5rem}.alert-success{background-color:#125422;color:#fff}.alert-error{background-color:#f65555;color:#fff;height:fit-content}.alert-warn{background-color:#f6f655;color:#fff}.card{background-color:var(--card-background);color:var(--card-text);border-radius:8px;overflow:hidden;box-shadow:0 4px 6px #0000001a;display:flex;flex-direction:column;width:calc(33.333% - 20px);min-width:280px;max-width:350px;flex-grow:1;min-height:400px}.card__img{width:100%;height:180px;object-fit:cover}.card__body{padding:.7rem;display:flex;flex-direction:column;flex-grow:1}.card__title{font-size:1.2rem;text-align:center}.card__text{margin-bottom:.2rem}.card__button{background-color:var(--brand-color);color:#fff;padding:.5rem;border:.1rem solid var(--brand-color);border-radius:.5rem;margin:1rem}footer{background:var(--primary-color);color:var(--background-color);padding:1rem 0;margin-top:1rem}.footer__nav{display:flex;align-items:center;justify-content:center}.footer__nav ul{display:flex;gap:1rem}.footer-nav__item{list-style:none}.footer-nav__link{color:var(--footer-nav-link-color)}.footer-nav__link[aria-current=page]{color:var(--brand-light)}.footer__copyright{border-top:1px solid rgba(255,255,255,.2);margin:1.5rem auto 3rem;padding-top:15px;text-align:center}.footer-copyright__text{color:#fff;font-size:.8rem}.img__sm{height:100px;width:100px}.img__med{height:300px;width:300px}.img__lg{height:500px;width:500px}.img__xlg{height:800px;width:800px}.header{background-color:var(--header-background-color)}.header-actions{display:flex;align-items:center;justify-content:right;max-width:75rem;margin:0 auto}.header-actions-search__input{margin:.5rem 0;min-width:5rem}.header-actions-search__button{margin:.5rem 1rem .5rem 0;padding:.3rem .1rem;border:none;background-color:var(--brand-color);color:#fff;font-weight:700;cursor:pointer;min-width:5rem}.header__navbar{display:flex;align-items:center;justify-content:space-between;max-width:75rem;margin:0 auto}.header-navbar__brand{display:flex;align-items:center;justify-content:space-between;max-width:75rem}.header-navbar-brand__img{width:5rem;height:5rem}.header-navbar-brand__name{color:var(--brand-color)}.header-navbar__toggler{display:none;cursor:pointer;background:none;border:none;margin-right:1rem}.header-navbar__toggler span{display:block;width:2rem;height:.2rem;margin:.3rem;background:var(--brand-color)}.header-navbar__nav{list-style:none;display:flex;gap:.3rem;align-items:center;margin-right:1rem}.header-navbar-nav .show{display:flex}.header-navbar-nav__item{display:inline-block}.header-navbar-nav__link{text-decoration:none;color:var(--header-nav-link-color);font-size:1.5;padding:.3rem;transition:color .3s ease}.header-navbar-nav__link:hover{color:var(--brand-color)}.header-navbar-nav__link[aria-current=page]{color:var(--brand-light)}@media(max-width:768px){.header__navbar{flex-wrap:wrap}.header-navbar__nav{margin-top:1rem;display:none;flex-direction:column;width:100%;background:var(--header-background-color);padding:10px;position:absolute;top:50px;left:0;right:0;box-shadow:0 2px 5px #0000001a;align-items:flex-start}.header-navbar__nav.show{display:flex}.header-navbar__toggler{display:inline-block}}.links__legal,.links__page{font-weight:700;color:var(--link-color)}table{width:100%;background-color:var(--table-background-color)}th{margin:0;padding:0;background-color:var(--table-heading-background-color);color:var(--form-field-text)}td{padding:.3rem;margin:0;font-size:.8rem}table,tr,th,td{border:1px solid var(--table-border-color);border-collapse:collapse}.page__title{text-align:center;margin-bottom:2rem}.page__notfound{width:50%;text-align:center;margin:0 auto}.page__notfound-image{width:100px;height:100px;display:block;margin:0 auto}