@charset "UTF-8";*{box-sizing:border-box}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}:focus{outline:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}[hidden]{display:none}html{font-size:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}a:focus{outline:thin dotted}a:active,a:hover{outline:0}img{border:0;-ms-interpolation-mode:bicubic}figure{margin:0}form{margin:0}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;*margin-left: -7px}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;*vertical-align: middle;border:none}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;*overflow: visible}button[disabled],html input[disabled]{cursor:default}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}html,button,input,select,textarea{color:#222}::-moz-selection{background:#b3d4fc;text-shadow:none}::selection{background:#b3d4fc;text-shadow:none}img{vertical-align:middle}fieldset{border:0;margin:0;padding:0}.chromeframe{margin:.2em 0;background:#ccc;color:#000;padding:.2em 0}html{height:100%;box-sizing:content-box}body{box-sizing:content-box;background-color:#666;font-family:Roboto,sans-serif;font-weight:400;font-style:normal;font-size:24px;line-height:28px}.content{background-color:#fff;margin:50px auto 0;padding:12px;width:621px;height:457px}.wrapper{display:flex;flex-direction:column;border:1px solid #000;width:600px;height:435px}.search .search-input{width:100%;height:45px;padding:11px 0 13px 16px;border-bottom:1px solid #000;background-color:transparent;background:url(https://pail4.github.io/WeatherReact/assets/search.674a229d.svg) no-repeat right;transition:background-color .2s}.search .search-input.error{background-color:#db414152}.blocks{box-sizing:content-box;display:flex;height:100%}.weather{display:flex;flex-direction:column;justify-content:space-between;width:50%}.tab{height:100%;display:none}.tab .grad:after{content:"\b0"}.tab-now{flex-direction:column}.tab-now.active{display:flex}.tab-now .temperature{margin:20px;height:95px;font-size:70px;line-height:82px}.tab-now .img-wrap{align-self:center}.tab-now .weather-img{display:inline-block;object-fit:cover;width:150px;height:150px;filter:drop-shadow(0px 0px 3px rgba(0,0,0,.7))}.tab-now .bottom{margin-top:auto;min-height:50px;display:flex;justify-content:space-between;align-items:flex-end}.tab-now .bottom .location-name{margin:0 0 17px 12px}.tab-now .bottom .like-btn{padding:0;margin:0 26px 23px 0;display:inline-block;width:25px;height:25px;background:url(https://pail4.github.io/WeatherReact/assets/like.de388d47.svg) no-repeat center}.tab-now .bottom .like-btn:hover{background:url(https://pail4.github.io/WeatherReact/assets/like_active.bfe42b97.svg) no-repeat center}.tab-now .bottom .like-btn.active{background:url(https://pail4.github.io/WeatherReact/assets/like_active.bfe42b97.svg) no-repeat center}.tab-now .bottom .like-btn.active:hover{background:url(https://pail4.github.io/WeatherReact/assets/like.de388d47.svg) no-repeat center}.tab-details{text-align:left}.tab-details.active{display:flex;flex-direction:column}.tab-details .location-name{margin:33px 0 42px 17px}.tab-details .details-list{margin-left:15px;line-height:28px}.tab-forecast{padding:33px 16px 0 14px;flex-direction:column;max-height:345px;overflow-y:auto}.tab-forecast.active{display:flex}.tab-forecast .time-block{font-size:18px;line-height:21px;margin-bottom:9px;padding:6px 12px 13px 10px;border:1px solid #000;width:265px;height:120px;display:flex;flex-direction:column;justify-content:space-between}.tab-forecast .time-block_bot,.tab-forecast .time-block_top{width:100%;display:flex;justify-content:space-between}.tab-forecast .time-block-weather{text-align:center}.tab-forecast .weather-img{margin:-10px;width:40px;height:40px;filter:drop-shadow(0px 0px 2px rgba(0,0,0,.7))}.tab-nav{display:flex;justify-self:flex-end}.tab-nav button{border-top:1px solid #000;display:inline-block;width:100%;background-color:#fff;vertical-align:middle;font-size:18px;line-height:21px;text-decoration:none;color:#000;height:41px;border-right:1px solid #000}.tab-nav button:last-child{border-right:none}.tab-nav button:hover{background-color:#8685853d}.tab-nav .active{color:#fff;background-color:#000}.tab-nav .active:hover{background-color:#000}.locations{width:50%;text-align:left;border-left:1px solid #000}.locations .block-name{padding:33px 0 7px 18px;border-bottom:1px solid #000}.locations .locations-list{margin:35px 18px 0;height:100%;max-height:250px;overflow:auto}.locations .locations-list li{display:flex;justify-content:space-between}.locations .locations-list li .liked-location{background:transparent;margin:0;padding:0;text-align:left;width:100%}.locations .locations-list li .delete-location{vertical-align:middle;width:27px;height:27px;background:url(https://pail4.github.io/WeatherReact/assets/cross.028ebb15.svg) no-repeat center}.locations .locations-list li .delete-location:hover,.locations .locations-list li:hover{background-color:#8685853d}footer{position:fixed;bottom:0;width:100%;text-align:center;background-color:#bd8cf3;font-size:14px;color:#ffffff80}