:root{font-family:Inter,Avenir,Helvetica,Arial,sans-serif;padding:0;margin:0;font-size:16px;color-scheme:light dark;color:#ffffffde;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%}body{margin:0;min-width:320px;min-height:100vh}header{background-color:#fff;color:#000;width:100%;flex:1}header h1{margin:10px;font-family:Rubik Bubbles;letter-spacing:10px;text-align:center}@font-face{font-family:Rubik Bubbles;src:local("Rubik Bubbles"),url(/assets/RubikBubbles-Regular-b7c8075f.ttf) format("truetype");font-weight:regular}body{height:100vh;margin:0 auto;padding:0}#root{margin:0;padding:0;display:flex;flex-direction:column;height:100vh;background-color:khaki}.App{width:100%;height:100vh;flex:1;display:flex;flex-direction:column;align-items:center;margin:0;padding:0}#create-dog-form{height:500px;color:#fff;font-size:30px;padding:40px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;border-left:18px solid yellowgreen;border-bottom:18px solid khaki;border-right:18px solid tomato;border-top:18px solid teal;margin:10px}#create-dog-form h4{margin:0}#create-dog-form label{margin-top:20px}#create-dog-form input[type=submit]{margin-top:20px;color:#000}#create-dog-form input{color:#000;font-size:30px;margin-left:10px}#create-dog-form input:disabled{opacity:.8}#create-dog-form textarea:disabled{opacity:.8}#create-dog-form select{color:#000;font-size:30px;margin-left:10px}.selectors{display:flex}.selector{-webkit-user-select:none;user-select:none;border:1px solid black;border-radius:400px;padding:4px 10px;margin-left:10px;cursor:pointer}.selector.active{background-color:#000;color:#fff}#main-section{border:2px solid black;background-color:#000;width:80%;height:90%;display:flex;flex:12;flex-direction:column;justify-content:flex-start;align-items:center;margin:0}.container-header{color:#000;width:100%;background-color:#fff;font-size:20px;display:flex;justify-content:space-between;align-items:center;flex:2}.container-header>*{margin-left:10px;margin-right:10px}.content-container{width:100%;display:flex;flex-wrap:wrap;justify-content:space-around;flex:23;overflow-y:auto}.dog-card{width:200px;height:340px;background-color:#fff;border:5px dotted;margin:20px;position:relative}.dog-name{color:#af0;background-color:#00000080;top:0px;margin:0;padding:10px 0;text-align:center;width:100%;font-family:Rubik Bubbles;font-size:25px;-webkit-text-stroke:1px black;text-shadow:1px 5px black}.dog-description{color:#000;margin-top:0;padding:0 10px}.dog-card img{width:100%;max-height:50%;resize:both;border-bottom:5px solid black}.favorite-overlay,.unfavorite-overlay,.loading-overlay{all:unset;width:100%;height:100%;position:absolute;resize:both;background-color:#0000;color:#0000}.loading-overlay{all:unset;width:100%;height:100%;position:absolute;resize:both;background-color:#00000034;color:#fff;display:flex}.favorite-overlay.active{background-color:#0000008d;color:#fff;display:flex;justify-content:center;align-items:center;font-size:80px;font-weight:900}.unfavorite-overlay.active{background-color:#8d000066;color:#fff;display:flex;justify-content:center;align-items:center;font-size:80px;font-weight:900}.description-container{position:relative}.favorite-button,.unfavorite-button{position:absolute;bottom:0;right:0;border:0px solid transparent;background-color:transparent;opacity:.5;cursor:pointer;color:transparent;z-index:2}.favorite-button:hover,.unfavorite-button:hover,.trash-button:hover{opacity:1}.trash-button{position:absolute;bottom:0;left:0;border:0px solid transparent;background-color:transparent;opacity:.5;cursor:pointer;color:transparent;z-index:2}.modal{position:absolute;height:500px;width:1000px;z-index:10;background-color:#fff;left:50%;top:50%;transform:translate(-50%,-50%);border:40px solid purple;color:#000;display:flex;flex-direction:column;align-items:center;justify-content:center}#close-modal-button{all:unset;font-size:40px;background-color:tomato;padding:10px;border-radius:10px;color:#fff;cursor:pointer;border:2px solid gray}#accept-modal-button{all:unset;font-size:40px;background-color:#006400;padding:10px;border-radius:10px;color:#fff;cursor:pointer;border:2px solid gray}#home-page{width:100vw;margin:0;padding:0;height:100vh;background-color:gold;display:flex;justify-content:center;flex-direction:column;align-items:center}.btn{align-items:center;background-color:#fff;border:1px solid rgba(0,0,0,.1);border-radius:.25rem;box-shadow:#00000005 0 1px 3px;box-sizing:border-box;color:#000000d9;cursor:pointer;display:inline-flex;font-family:system-ui,-apple-system,system-ui,Helvetica Neue,Helvetica,Arial,sans-serif;font-size:16px;font-weight:600;justify-content:center;line-height:1.25;margin:0;min-height:3rem;padding:calc(.875rem - 1px) calc(1.5rem - 1px);position:relative;text-decoration:none;transition:all .25s;user-select:none;-webkit-user-select:none;touch-action:manipulation;vertical-align:baseline;width:auto}.btn:hover,.btn:focus{border-color:#00000026;box-shadow:#0000001a 0 4px 12px;color:#000000a6}.btn:hover{transform:translateY(-1px)}.btn:active{background-color:#f0f0f1;border-color:#00000026;box-shadow:#0000000f 0 2px 4px;color:#000000a6;transform:translateY(0)}#home-page>h1{font-size:90px;background-color:#000;border-radius:25px}h1>.one,.six,.eleven{color:tomato}h1>.two,.seven,.twelve{color:orange}h1>.three,.eight{color:#98fb98}h1>.four,.nine{color:#87ceeb}h1>.five,.ten{color:#db7093}