.navbar{grid-column:11 / 13;z-index:3;justify-self:right}.nav__button{border:none;color:#e9eef1;background-color:transparent;font:inherit;font-size:2rem;cursor:pointer}.menu{position:absolute;right:0;padding:0;list-style-type:none;rotate:x 90deg}.menu.open{background-color:#496d6f;rotate:x 0deg}.menu__item{position:relative}.menu__button{border:none;color:#e9eef1;background-color:transparent;font:inherit;cursor:pointer;padding:.5rem;width:100%}.menu__item:hover .menu__button,.menu__item:focus-within .menu__button{background-color:#675d58;color:#fff;text-decoration:underline}.menu__item:hover .submenu,.menu__item:focus-within .submenu{rotate:y 0deg}.submenu{position:absolute;top:0;left:-110%;padding:0;background-color:#507779;list-style-type:none;rotate:y 90deg;transform-origin:right}.submenu__item{padding:0 .25rem}.submenu__link{display:inline-block;padding:.5rem;width:100%;text-decoration:none;color:#e9eef1}.submenu__link:hover,.submenu__link:focus{background-color:#675d58;text-decoration:underline}@media (min-width: 40rem){.nav__button{display:none}.navbar{grid-column:6 / 13;justify-self:normal}.menu{display:flex;position:static;rotate:x 0deg;justify-content:space-around}.menu__item{position:static}.menu__item:hover .submenu,.menu__item:focus-within .submenu{rotate:x 0deg}.submenu{top:initial;left:initial;rotate:x 90deg;transform-origin:top}}.header{display:grid;grid-template-columns:repeat(12,1fr);background-color:#496d6f;align-items:center}.skip-to-content-link{left:50%;top:0;position:absolute;transform:translateY(-300%)}.skip-to-content-link:focus{transform:translateY(0)}.header__logo{grid-column:1 / 2;margin-left:1rem;width:100px}.header__title{grid-column:2 / 11;margin-left:.5rem;color:#e9eef1;text-align:left}@media (min-width: 40rem){.header__title{grid-column:2 / 6}}.footer{padding:2rem 0 4rem;background-color:#496d6f;text-align:center}.footer__nav{display:flex;justify-content:space-around}.button-link{padding:0;border:none;color:#e9eef1;background-color:transparent;font:inherit;text-decoration:underline;cursor:pointer}.footer__content{color:#e9eef1;width:100%}.content__title{margin-top:2rem}.content__text{margin:1rem}.hero-image{grid-column:span 12;position:relative;margin:0 rem;height:600px;max-width:100vw;max-height:70vw;background-image:linear-gradient(rgba(0,0,0,.5),rgba(0,0,0,.5)),url(/PetConnect/assets/heroimage-8b8534a1.jpg);background-position:center;background-repeat:no-repeat;background-size:cover}.hero-text{position:absolute;margin-bottom:.25rem;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;text-align:center}.text-title{margin-bottom:.5rem}.register-button{display:inline-block;margin-top:2rem;border-radius:1rem;border:none;outline:0;padding:10px 25px;color:#000;background-color:#ddd;font-size:1rem;text-align:center;cursor:pointer}.register-button:hover,.register-button:focus{background-color:#555;color:#fff}.gallery{grid-column:span 12}.card{display:flex;flex-direction:column;padding:.5rem;border:1px solid none;background-color:#fff;align-items:center}.card__title{margin:.5rem}.card__pic{width:250px;height:200px;object-fit:cover;margin-bottom:1rem}.card__text{margin:.25rem}.gallery{display:grid;padding:1rem;gap:1rem;background-color:#f1f1f1}.gallery__title{grid-column:span 12;margin-left:0rem;margin-top:.5rem}.gallery__nav{grid-column:span 12;margin-left:0rem}.gallery__card{grid-column:span 12}.gallery__nav-button{margin-right:.5rem;padding:12px 16px;border:none;outline:none;font-size:1rem;background-color:#fff;cursor:pointer}.gallery__nav-button:hover,.gallery__nav-button:focus{background-color:#ddd}.gallery__nav-button.active{background-color:#666;color:#fff}@media (min-width: 40rem){.gallery__card{grid-column:span 4}}.about-section{grid-column:span 12;width:100%;padding:50px;background-color:#474e5d;color:#fff}.about-section.light{background-color:#d3d9e5;color:#000}.theme-button{height:2.5rem;width:5rem;margin-bottom:2rem;font-size:1rem}.about__title{margin-bottom:2rem}.about__subtitle{margin-bottom:1rem}.about__text{margin-bottom:2rem}.breed__title{grid-column:span 12;margin-left:1rem;margin-top:2rem;margin-bottom:1rem}.breed__cards{display:grid;grid-column:span 12;grid-template-columns:repeat(12,1fr);padding:1rem;margin-bottom:3rem;gap:1rem;background-color:#7fa3b0}.breed__name{grid-column:span 12;color:#f1f1f1}.breed-card{grid-column:span 12;display:flex;flex-direction:column;padding:.5rem;border:1px solid none;background-color:#fff;align-items:center}.breed-card__pic{width:250px;height:200px;object-fit:cover;margin-bottom:1rem}.breed-card__text{margin:.25rem}.breed-card__button{display:inline-block;margin-top:2rem;border-radius:1rem;border:none;outline:0;padding:10px 25px;color:#000;background-color:#ddd;font-size:1rem;text-align:center;cursor:pointer}.breed-card__button:hover,breed-card__button:focus{background-color:#555;color:#fff}@media (min-width: 40rem){.breed-card{grid-column:span 4}}.main-register{padding:1rem}.main__form{display:grid;grid-column:span 12;grid-template-columns:repeat(12,1fr);max-width:40rem;margin:0 auto;padding:2rem;border:1px solid black;border-radius:16px;background-color:#fff;align-items:center}.form__title{grid-column:span 12;text-align:center;margin-bottom:1rem}.form__label{grid-column:1 / 6;margin-bottom:.25rem}.form__required{grid-column:10 / 13;font-size:.8rem;justify-self:right}.form__input{grid-column:span 12;margin-bottom:1rem}.form__error{grid-column:1 / 12;margin-bottom:1rem;font-size:.9rem;color:red}.form__label--checkbox{grid-column:1 / 10;margin-bottom:1rem}.form__checkbox{grid-column:10 / 13;margin-bottom:1rem}.form__select{grid-column:span 12}.form__label--source{margin-top:1rem}.form-response-message{margin-top:2rem;grid-column:1 / 8;color:#555}.button.register{grid-column:8 / 13;margin-top:2rem;border-radius:1rem;border:none;padding:1rem 2.5rem;background-color:#ddd;font-size:1rem;text-align:center;cursor:pointer}.button.register:hover,.button.register:focus{background-color:#555;color:#fff}.form{display:grid;grid-template-columns:repeat(12,1fr);padding-top:1rem}.form__input,.form-response-message{grid-column:span 12}.subscribe,.close{margin-top:2rem;border-radius:1rem;border:none;outline:0;display:inline-block;padding:10px 25px;color:#000;background-color:#ddd;font-size:1rem;text-align:center;cursor:pointer}.subscribe:hover,.subscribe:focus,.close:hover,.close:focus{background-color:#555;color:#fff}.subscribe{grid-column:1 / 4}.close{grid-column:10 / 13}.subscribe__title{grid-column:span 11;margin:2rem}.subscribe-open{display:inline-block;grid-column:span 1;margin:2rem;padding:10px 25px;color:#000;background-color:#ddd;border-radius:1rem;border:none;font-size:1rem;text-align:center;cursor:pointer;justify-self:left}.subscribe-open:hover,.subscribe-open:focus{background-color:#555;color:#fff}.response-text{grid-column:span 12;margin:2rem;text-align:center}.modal{max-width:25rem;margin:auto}@media (min-width: 40rem){.subscribe__title{grid-column:1 / 6}.subscribe-open{grid-column:6 / 7;align-self:left}}*,*:before,*:after{box-sizing:border-box;margin:0}html,body{height:100%;font-family:sans-serif,Arial,Helvetica}.root{display:grid;grid-template-rows:auto 1fr auto;height:100%}.main{display:grid;grid-template-columns:repeat(12,1fr);width:100%;background-color:#f1f1f1;line-height:1.2}