.App{align-items:center;display:flex;justify-content:center;text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{-webkit-animation:App-logo-spin 20s linear infinite;animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@-webkit-keyframes App-logo-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes App-logo-spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}.displayweather{display:flex;flex-flow:column nowrap;margin-top:20px}.displayweather .maincard{align-self:center;background:#f5f2f2;border:1px solid #000;border-radius:20px;margin-top:20px;padding:50px;position:relative;width:500px}.displayweather .maincard .cardtitle{font-size:1.5rem;left:10px;position:absolute;top:10px}.displayweather .maincard .cardsubtitle{color:grey;left:10px;margin-top:-8px;position:absolute}.displayweather h1{font-size:5rem;margin:-10px -10px -10px -150px}.displayweather .weather-icon{position:absolute;top:50px;width:100px}.displayweather .weather-main{font-size:1.2rem;font-weight:500;left:310px;position:absolute;top:120px}.displayweather .weather-description{font-size:1.4rem;left:10px;position:absolute}.displayweather .weatherdetails{grid-gap:20px;display:grid;grid-template-columns:50% 50%;grid-template-rows:auto;margin-left:50px;margin-right:50px}.displayweather .weatherdetails .section1{justify-self:right;width:300px}h4{font-size:1.2rem;margin-right:30px;text-align:left}td{border-bottom:2px solid grey}.displayweather .weatherdetails span{font-size:1.2rem}.weather{border:3px solid grey;border-radius:20px;margin:2rem 0;padding:0 20px 20px;width:-webkit-max-content;width:max-content}.weather .title{font-family:Times New Roman,Times,serif;font-size:4rem}.weather form{margin-top:30px}.weather form input{border:none;border-bottom:2px solid #023958;margin-right:10px;padding:10px}.weather form input:focus{border-bottom:3px solid #023958;outline:none}.weather .getweather{background:rgba(2,57,88,.8);border:2px solid #000;border-radius:20px;color:#f5f5f5;cursor:pointer;font-size:1.3rem;margin-left:10px;padding:8px}.weather .getweather:hover{background:transparent;color:#000}.weather .getweather:focus{outline:none}
/*# sourceMappingURL=main.cf78b756.css.map*/