body
{
        font-family: "Roboto", "Open Sans", sans-serif;
        font-size: 14px;
        background-color: #1E202B; 

        
}
.navbar
{
        background-color: #1E202B;
}
.navbar a
{
        color: #fff;
        padding-top: 2px;
        padding-bottom: 2px; 
}
.nav-item {
        padding: 0 17px;
        border: 2px solid transparent;
        margin-left: 10px;
        border-radius: 30px; 
        transition: 0.3s ease;
        cursor: pointer;
        overflow: hidden;
}
.active
{
        border-color: #009AD8; 
}
.active a
{
        color: #009AD8;
}
.nav-item:hover
{
        border-color: #009AD8;  
}
.nav-item:hover a
{
        color: #009AD8;
}
.logo h1
{
        font-size: 16px;
        font-weight: 600;
        color: white;
}
.logo h6
{
        font-size:10px;
        color: #bfc1c8;
}

.bg
{
        background-image: url("../images/banner.png");
        background-repeat: no-repeat;
}

.search input
{
        background-color: #1E202B;
         border-color: transparent;
         border-radius: 30px;
         padding: 15px;
         width: 100%;
         outline: none;
         color: #ffff;
}
.search input::placeholder
{
        font-size: 14px;
        /* background-color: #1E202B; */
  
}
.search button
{
        position: absolute;
        right: 5px;
        background-color:  #009AD8;
        color: #fff;
        border: none;
        border-radius: 30px;
}
.btn-content
{
        padding: 11px 35px;
}

.item
{
        background-color: #323544;
        color: #fff;
        border-radius: 5px;
}
 .weather-head
{
        background-color: #2D303D;
        color: #bfc1c8;
        border-radius: 5px;
}

.weather-content .location
{
        font-size: 18px;
        color: #bfc1c8;
}
.degree .num
{
        font-size: 5rem;
        font-weight: 600;
}
.weather-content .custom
{
        color:  #009AD8; 
}
.weather-content span ,.d-small
{
        color: #bfc1c8;
}
.degree-small
{
        font-size: 1.7em;
        color: white;
        font-weight: 700;
}
footer
{
        background-color: #262936;
}
.icon a
{
        width: 40px;
        height: 40px;
        border-radius: 50%;
        display: inline-block;
        line-height: 40px;
        text-align: center;
        margin-left: 2px;
        background-color: #1e202b;
        color: #009ad8 !important;
        font-size: 18px;
        cursor: pointer;
        transition: all .3s;
}
.icon a:hover
{
        background-color: #009AD8;
       
}
.icon a:hover i
{
        color: #fff;
}
.btn-foot
{
        padding: 11px 20px;
}
footer p
{
        color: #bfc1c8;
}

.navbar-toggler-icon i
{
        color: #fff;
        transition:all .3s;
        padding: 15px;
        border: 2px solid transparent;
        border-radius: 50%;
}
.navbar-toggler-icon i:hover
{
        color: #009AD8;
        border-color: #009AD8;
}
@media screen and (max-width:991px)
{
.nav-item 
        {
                background-color: #262936;
                border-radius: 0%;
                text-align: center;
                border-bottom: 1px solid #3c3f4d;
                padding: 15px;
            
        }
.navbar-nav
{
        margin-bottom: 30px;
}
.nav-item:hover
{
        border-color: #3c3f4d;  
}
.nav-item:hover a
{
        color:#fff;
}
.active
{
        border-color: transparent; 
        border-bottom: 1px solid #3c3f4d;
        padding: 15px;
}
.active:hover a
{
        border-color: #009AD8;; 
        color: #009AD8;
}
footer{
        text-align: center
}
}