@import"https://fonts.googleapis.com/css2?family=Island+Moments&display=swap";:root{font-family:Inter,Avenir,Helvetica,Arial,sans-serif;background-color:#ccc}body,#root{margin:0;padding:0}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.Header-wrapper{height:10vh;width:100%;display:flex;align-items:center;background-color:#662799}.Header-container{display:block;margin:0 auto;width:50%}.Header-menu{display:flex;justify-content:space-between;font-size:1.5rem;list-style-type:none}.Header-menu-link{text-decoration:none;color:#aaa;cursor:pointer}.Header-menu-link:after{content:"";background-color:red;width:0;height:.2rem;display:block;margin-top:2px;transition:.3s ease-out}.Header-menu-link:hover:after{width:100%}.Header-menu-link:hover{color:#fff}@media screen and (max-width: 480px){.Header-container{display:block;margin:0 auto;width:100%}.Header-menu{display:flex;padding-left:0;justify-content:space-around;font-size:1rem;list-style-type:none}}@media screen and (min-width: 481px) and (max-width: 768px){.Header-container{display:block;margin:0 auto;width:100%}.Header-menu{display:flex;padding:0 10%;justify-content:space-between;font-size:1.5rem;list-style-type:none}}.active{color:#fff}.Loader-wrapper{height:10vh;width:100%;display:flex;align-items:center;color:#662799;font-size:3rem;font-family:Island Moments,cursive}.Loader-wrapper p{padding-left:10%}.HeroHome-wrapper{height:60vh;width:auto;background-image:url(/assets/868-8686204_pet-rules-cute-pets-together.7438eb63.png);background-repeat:no-repeat;background-size:contain;background-position:center;background-color:#fff}.Pets-wrapper{width:auto;padding:20px;text-align:center}.Pets-text{display:block;margin:0 auto;width:50%;padding-bottom:10px}.Pets-text h1{font-size:2.5rem;color:#662799}.Pets-container{display:grid;grid-template-areas:"first first second" "third third second" "fourth fifth fifth";grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);gap:20px;width:100%;height:100vh}.Pet-element{background-repeat:no-repeat;background-size:cover;background-position:center;border-radius:10px;background-color:#fff;box-shadow:0 0 5px #000}.Pet-element:nth-child(1){grid-area:first;background-image:url(https://grandvalleyvet.com/wp-content/uploads/2016/10/GVAH-Blog-Header1.jpg)}.Pet-element:nth-child(2){grid-area:second;background-image:url(https://www.lonetreevet.com/blog/wp-content/uploads/2017/02/LoneTree_iStock-106396236.jpg)}.Pet-element:nth-child(3){grid-area:third;background-image:url(https://cityofgp.com/sites/default/files/styles/inner_banner/public/2022-01/animals-pets-banner.jpg?itok=46ObneDJ)}.Pet-element:nth-child(4){grid-area:fourth;background-image:url(https://inspection.gc.ca/DAM/DAM-animals-animaux/STAGING/images-images/bringing_animals_to_canada_banner_facebook_1656079036158_eng.jpg)}.Pet-element:nth-child(5){grid-area:fifth;background-image:url(https://av.sc.com/sg/content/images/sg-pet-owner-article-masthead-1800x564.jpg)}@media screen and (max-width: 480px){.Pets-wrapper{padding:10px}.Pets-text{display:block;margin:0 auto;width:50%;padding-bottom:10px}.Pets-text h1{font-size:1.5rem;color:#662799}.Pets-container{display:grid;grid-template-areas:"first" "second" "third" "fourth" "fifth";grid-template-columns:repeat(1,1fr);grid-template-rows:repeat(5,1fr);gap:20px;width:100%;height:100vh}}.HeroCats-wrapper{height:60vh;width:auto;background-image:url(/assets/johner_linda-pauline_arousell_sca30486.d0562754.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;background-color:#fff;display:flex;align-items:center}.HeroCats-wrapper p{font-size:3rem;color:#fff;margin:0 auto}.Cats-wrapper{width:auto;padding:0 10% 10%;text-align:center;display:block;align-items:center}.Cats-text{display:block;margin:0 auto;width:80%;padding-bottom:10px;text-align:center}.Cats-text h1{font-size:2rem;color:#662799}.Cats-container{display:grid;grid-template-columns:repeat(5,1fr);gap:30px;width:100%;padding-bottom:10px}.Cat-element{height:300px;text-align:left;padding:0;margin:0}.Cat-info{height:40%;line-height:5px}.Cat-info p{white-space:normal}.Cat-button{color:#662799;text-decoration:none}.Cat-image{width:100%;height:60%;background-repeat:no-repeat;background-size:cover;background-position:center}.Cat-image:hover{background-position:50%}.Cat-element:hover{box-shadow:0 0 10px #662799;transition:.5s ease;padding:5px;height:280px}.Cat-button:hover{text-decoration:underline}@media screen and (max-width: 480px){.Cats-wrapper{width:auto;padding:0 5% 10%;text-align:center;display:block;align-items:center}.Cats-text{display:block;margin:0 auto;width:80%;padding-bottom:10px;text-align:center}.Cats-text h1{font-size:1.5rem;color:#662799}.Cats-container{grid-template-columns:repeat(2,1fr);column-gap:20px;padding-bottom:10px}.Cat-element{height:250px}.Cat-info p{font-size:.9rem}.Cat-button{color:#662799;text-decoration:none}.Cat-image:hover{background-position:50%}.Cat-element:hover{box-shadow:0 0 10px #662799;transition:.5s ease;padding:10px;height:230px}}@media screen and (min-width: 481px) and (max-width: 768px){.Cats-wrapper{width:auto;padding:0 5% 10%;text-align:center;display:block;align-items:center}.Cats-text{display:block;margin:0 auto;width:80%;padding-bottom:10px;text-align:center}.Cats-text h1{font-size:1.5rem;color:#662799}.Cats-container{grid-template-columns:repeat(4,1fr);column-gap:20px;padding-bottom:10px}.Cat-element{height:250px}.Cat-info p{font-size:.9rem}.Cat-button{color:#662799;text-decoration:none}.Cat-image:hover{background-position:50%}.Cat-element:hover{box-shadow:0 0 10px #662799;transition:.5s ease;padding:10px;height:230px}}.Footer-wrapper{background-color:#662799;height:20vh;display:flex;align-items:center;padding:0 10%;justify-content:space-between;color:#ccc}.Footer-sns ul{list-style-type:none}.Footer-sns a{text-decoration:none;color:#ccc}.Footer-sns a:hover{text-decoration:none;color:#fff}.Cats-Details-wrapper{height:80vh;display:grid;grid-template-columns:25% 75%}.Cats-sidebar{height:71vh}::-webkit-scrollbar{width:5px}::-webkit-scrollbar-thumb{border-radius:20px;background-color:#fff}::-webkit-scrollbar-track{box-shadow:inset 0 0 5px gray;border-radius:10px}.Cats-menu{height:100%;overflow-y:auto}.Cats-sidebar h3{color:#683899;text-align:center}.Cats-image-content{height:30px;width:30px;border-radius:50px;display:flex;align-items:center;overflow:hidden;background-color:#aaa}.Cats-image{height:100%}.Cats-link-group{display:flex;height:50px;align-items:center;background-color:#683899;padding:0 10%;border-bottom:1px solid#AAA}.Cats-name{font-size:1rem;padding-left:5%}.Cats-link{text-decoration:none;color:#aaa}.Cats-sidebar .active{color:#fff}.active .Cats-link-group,.Cats-link-group:hover{background-color:#6838aa}.Cats-content{background-color:#999;display:flex;align-items:center}.Content-image{height:80vh;width:60%;background-position:center;background-size:cover;background-repeat:no-repeat;background-color:#fff}.Content-text{width:40%;padding:20px}.Content-text h1,h3{color:#683899}.Content-text p{text-align:justify;color:#fff;margin-bottom:30px}.Content-text a{text-decoration:none;border:1px solid #683899;padding:10px 20px;color:#683899}.Content-text a:hover{border:1px solid #683899;background-color:#683899;color:#fff;transition:.5s ease}@media screen and (max-width: 480px){.Cats-Details-wrapper{height:80vh;display:grid;grid-template-columns:100%}.Cats-sidebar{display:none}.Cats-content{background-color:#999;display:block;align-items:center}.Content-image{height:35vh;width:100%;background-position:center;background-size:cover;background-repeat:no-repeat;background-color:#fff}.Content-text{width:80%;height:45vh;padding:0 20px}.Content-text h1,h3{color:#683899}.Content-text p{text-align:justify;color:#fff;margin-bottom:30px}.Content-text a{text-decoration:none;border:1px solid #683899;padding:10px 20px;color:#683899}.Content-text a:hover{border:1px solid #683899;background-color:#683899;color:#fff;transition:.5s ease}}@media screen and (min-width: 481px) and (max-width: 768px){.Cats-Details-wrapper{height:80vh;display:grid;grid-template-columns:35% 65%}.Cats-sidebar{height:74vh}.Cats-menu{height:100%;overflow-y:auto}.Cats-sidebar h3{color:#683899;text-align:center}.Cats-image-content{height:30px;width:30px;border-radius:50px;display:flex;align-items:center;overflow:hidden;background-color:#aaa}.Cats-image{height:100%}.Cats-link-group{display:flex;height:50px;align-items:center;background-color:#683899;padding:0 10%;border-bottom:1px solid#AAA}.Cats-name{font-size:1rem;padding-left:5%}.Cats-link{text-decoration:none;color:#aaa}.Cats-sidebar .active{color:#fff}.active .Cats-link-group,.Cats-link-group:hover{background-color:#6838aa}.Cats-content{background-color:#999;display:block}.Content-image{height:40vh;width:100%;background-position:center;background-size:cover;background-repeat:no-repeat;background-color:#fff}.Content-text{height:30vh;width:80%;padding:20px}.Content-text h1,h3{color:#683899}.Content-text p{text-align:justify;color:#fff;margin-bottom:30px}.Content-text a{text-decoration:none;border:1px solid #683899;padding:10px 20px;color:#683899}.Content-text a:hover{border:1px solid #683899;background-color:#683899;color:#fff;transition:.5s ease}}
