.card-container{width:115px;height:500px;background-color:transparent;border-radius:25px;transition:width .6s ease-in-out;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:space-around;gap:20px;padding:20px 0;font-family:var(--font-prompt);position:relative;overflow:hidden;box-shadow:-10px 10px 25px;transform:translateY(-40px);opacity:0;animation:cardInComingSlide .4s ease-in forwards}@media screen and (max-width:864px){.card-container{width:75%;height:100px;margin:0 25px;flex-direction:row;justify-content:space-around;align-items:center;transition:height .3s ease-in-out}}@media screen and (max-width:480px){.card-container{width:100%;margin:0}}.card-container .card-video-bg{position:absolute;top:0;left:0;object-fit:cover;z-index:-1;scale:1.01}@media screen and (max-width:840px){.card-container .card-video-bg{width:100%;height:auto;object-fit:cover}}.card-container .card-date-day{position:absolute;left:46%;top:48px;display:inline-flex;align-items:center;justify-content:center;text-align:center;font-weight:600;font-size:35px;color:#fff;transform:translateX(-50%);height:15%}@media screen and (max-width:480px){.card-container .card-date-day{left:47%}}.card-container .card-date-full{position:absolute;top:0;right:0;display:inline-flex;align-items:center;justify-content:center;text-align:center;font-weight:600;font-size:clamp(25px,4vw,35px);color:#fff;height:15%;width:100%}@media screen and (max-width:864px){.card-container .card-date-full{top:16px;right:0}}.card-container .card-icon{margin-top:30px;height:45%;display:inline-flex;align-items:center;justify-content:center;text-align:center}@media screen and (max-width:864px){.card-container .card-icon{margin:0;order:2}}.card-container .card-temperature{height:30%;color:#fff;font-size:32px;font-weight:600;text-align:center;transition:font-size .6s ease-in-out,margin-top .3s ease-in-out}.active{width:400px}.mobil-active{height:180px}.slide-to-up-animation{animation:slideToUp .4s ease-in-out forwards}.slide-from-up-animation{animation:slideFromUp .2s ease-in-out forwards}.slide-from-down-animation{animation:slideFromDown .4s ease-in-out .3s forwards}.slide-to-down-animation{animation:slideToDown .2s ease-in-out forwards}.weather-widget-container{padding:10px 15px;display:flex;flex-direction:column;gap:10px;max-width:190px;width:100%;height:135px;border:none;border-radius:15px;background-color:#fff;color:#000;font-family:var(--font-prompt)}.weather-widget-container .widget-title{font-weight:500}.weather-widget-container .widget-value{width:100%;text-align:center;font-size:62px;font-weight:400;margin-top:10px}.weather-widget-container .widget-value .celsius{font-size:45px}.slide-left-to-right-widget{animation:slideLeftToRightWidget .4s ease-in-out forwards;opacity:0;transform:translate(-30px)}.slide-right-to-right-widget{animation:slideRightToRightWidget .4s ease-out forwards;opacity:1;transform:translate(0)}.search-input-group{display:flex;flex-direction:row;align-items:center;justify-content:space-between;max-width:900px;width:100%;border:1px solid #fff;border-radius:40px;padding:10px;background-color:#fff;margin:0 10px}@media screen and (max-width:1024px){.search-input-group{margin-top:65px}}@media screen and (max-width:864px){.search-input-group{margin-top:90px}}.search-input-group .search-input{width:100%;padding:15px 35px;font-family:var(--font-prompt),sans-serif;font-size:18px;font-weight:500;border:none;outline:none;background-color:transparent;text-transform:uppercase}.search-input-group .search-button{background-color:transparent;border:none;cursor:pointer;margin-right:5px}.favorite-locations{max-width:900px;width:100%;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px}.favorite-locations .favorite-location-btn{font-family:var(--font-prompt),sans-serif;font-size:12px;font-weight:500;border:none;border-radius:40px;padding:8px 15px;cursor:pointer;background-color:#fff;transition:background-color .3s ease-in,scale .3s ease-in,color .3s ease-in}.favorite-locations .favorite-location-btn:hover{background-color:#3498db;color:#fff;scale:1.1}@keyframes slide-in{0%{width:0;left:0}to{width:100%;left:0}}@keyframes slide-out{0%{width:100%;right:0}to{width:0;right:0}}@keyframes slideFromUpMain{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translate(0)}}@keyframes cardInComingSlide{0%{opacity:0;transform:translateY(-40px)}to{opacity:1;transform:translate(0)}}@keyframes slideToUp{0%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-20px)}}@keyframes slideFromUp{0%{opacity:0;transform:translate(-50%,-20px)}to{opacity:1;transform:translate(-50%)}}@keyframes slideFromDown{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideToDown{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}@keyframes slideLeftToRight{0%{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}@keyframes slideRightToLeft{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(30px)}}@keyframes slideLeftToRightWidget{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes slideRightToRightWidget{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(30px)}}@keyframes slideUpToDownInAuth{0%{opacity:0;transform:translateY(-40px)}to{opacity:1;transform:translate(0)}}@keyframes slideDownToUpOutAuth{0%{opacity:1;transform:translate(0)}to{opacity:1;transform:translateY(-40px)}}.search-bar-container{gap:25px;align-items:center}.search-bar-container,.weather-cards{width:100%;display:flex;flex-direction:column;justify-content:center}.weather-cards{padding:30px 0;margin:10px 0;align-items:flex-start;gap:15px}@media screen and (max-width:864px){.weather-cards{margin-bottom:40px}}.weather-cards .weather-location-group{width:100%;display:flex;justify-content:center;gap:10px;margin-bottom:30px}.weather-cards .weather-location-group .weather-location{font-family:var(--font-prompt);font-size:50px;color:#fff;font-weight:600;text-align:center;text-shadow:-1px 1px 10px #000}.weather-cards .weather-location-group .favorite-btn{background-color:transparent;border:none;cursor:pointer}.weather-cards .cards-wrapper{width:100%;display:flex;gap:10px;justify-content:center;align-items:center}@media screen and (max-width:864px){.weather-cards .cards-wrapper{flex-direction:column}}.weather-cards .widget-wrapper{width:100%;padding:10px 0;margin-top:20px;display:flex;gap:15px;justify-content:center;align-items:center}.slide-from-up-main-animation{animation:slideFromUpMain .3s ease-in forwards}