*{
    margin: 0;
    padding: 5px;
    box-sizing: border-box;
}
body{background: url('assets/pexels-takenbytablo-680940.jpg'); background-size:cover ; background-repeat: no-repeat; height: 100vh;}
.container{
    margin: 0 auto;
    width: 400px;
    
}
.card{padding: 0; background: rgba(255, 255, 255, 0.05); box-shadow: 0 20px 30px rgba(0,0,0,.65); border-radius: 20px;}
.sec{
    text-align: center;
    width: 100%;
    height: 100%;
    max-width: 400px;
    padding: 0;
    
}
input{width: 230px; border: none; outline: none; border-radius: 16px 0px 16px 0px; background-color: rgba(129, 64, 64, 0.7); 
    padding: 5px; margin-top: 5px;}
.top{width: 100%;height: 55vh; /* background:url("pexels-jose-vega-3801030_resize_23.jpg"); background-size: cover; background-repeat: no-repeat;*/ position: relative; padding: 0;}
h1{color: white; margin-bottom: 2px; margin-top: 20px; line-height: 0.7;}
#country{ margin: 0; font-size: 20px; color: white; font-weight: bold;}
.info{color: white; width: 100%; margin: 1px; padding: 0; position: absolute; bottom: 0;
     background: linear-gradient(rgba(0, 0, 0, 0.25),rgba(0,0,0,0.25)); border-radius: 10px; }
.whole{text-align: left; margin: 0; padding: 0;}
.degree{ font-size: 40px; font-weight: bold;}
strong{font-size: 24px;}
.desp{padding: 2px; margin:0.5px;  margin-bottom: 0; border-radius: 10px; color: white; background: linear-gradient(rgba(0, 0, 0, 0.25),rgba(0,0,0,0.25));}

.first{margin-left: 2px;}
.g{margin-left:2px ;}
hr{margin-top: 5px; margin-bottom: 5px;}
.b,.icon{width:60px; background-color: #c5bcbc; padding: 0; margin: 0;} 
#svg{width:100%; height: auto;}
#dayicon{width:60px;}
.degree{padding: 0;}
.forecst{background: linear-gradient(rgba(0, 0, 0, 0.25),rgba(0,0,0,0.25)); margin-top: 2px; border-radius: 12px; margin: 2px;}
#f22,#f32,#f42,#f52,#f11 {width: 65px; padding: 0;}
#ft2 span{font-size: 18px; padding: 2px;}
.ed{padding: 2.5px; color: white; font-weight: bold;}
.ef{padding: 1.7px;}
.b2,.b3,.b4{margin: 0; padding: 1px;}
.b2{max-width: 110px}
.g span {font-weight: bold; text-transform: capitalize;}
.b2 span {font-weight: bold; text-transform: capitalize; margin: 0; }
.b3 span {font-weight: bold; text-transform: capitalize;}
#b2 span{max-width: 30px; font-size: 10px;}
h1 span img{width:40px;}
#plus{position: absolute; right:20px; top: 5px;}