

:root{
    --main-background:rgb(12, 116, 43);
    --green-color:rgb(12, 116, 43); 
    --light-color:#fff;
    --main-font-size:20px;
    --font-35-size:35px;
    --media-font-size:13px;
    --tablet-size:15px;
}


   
#header{
    background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
    url('../img/image_2.jpeg') no-repeat; background-size: cover; height:600px;width: 100%;
   
}
   
#header_2{
    background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
    url('../img/image_1.jpg') no-repeat; background-size: cover; height:600px;width: 100%;

}

#header_3{
    background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
    url('../img/governor\ 3.jpg') no-repeat; background-size: cover; height:600px;width: 100%;

}
#header_4{
    background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
    url('../img/governor\ 4.jpeg') no-repeat; background-size: cover; height:600px;width: 100%;

}



.blog_head_container{
    margin-top: 6em;
}
 
.blog_head{
    color: var(--light-color);
    font-weight: 700;
    font-size: 35px;
    
    text-align: center;
    
    }
.welcome_text{
    color: var(--light-color);
    font-weight: 500;
    font-size: 20px;
    width: 800px;
    text-align: center;
    
}

    
  
   #search_modal{
         margin-top: 8em;
         padding: 15px;
        opacity: 0.9;
        backdrop-filter: blur(4px);


   }
 
    @media (max-width:576px){
          
#header{
    background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
    url('../img/image_2.jpeg') no-repeat; background-size: cover;
     height: 250px;width: 100%;

    }
    #header_2{
        background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
        url('../img/image_1.jpg') no-repeat; background-size: cover;
         height: 250px;width: 100%;
    
        }

#header_3{
    background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
    url('../img/governor\ 3.jpg') no-repeat; background-size: cover;
     height: 250px;width: 100%;

    }
#header_4{


    background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
    url('../img/governor\ 4.jpeg') no-repeat; 
    background-size: cover;
     height: 250px;width: 100%;

}
    .blog_head_container{
        margin-top: -20px;
    }
    .blog_head{
       font-size:18px;
        color: #fff;
    } 

    .welcome_text{
        color: var(--light-color);
        font-weight: 500;
        font-size: 13px;
        width: 300px;
        text-align: center;
        
    }
    
    

}


@media (min-width:577px) and (max-width:1020px){
    #header{
        background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
    url('../img/image_2.jpeg') no-repeat; background-size: cover;
       
     height: 400px;width: 100%;

        }
        #header_2{
            background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
        url('../img/image_1.jpg') no-repeat; background-size: cover;
            /* background-size: 600px; */
         height: 400px;width: 100%;
    
            }
         #header_3{
                background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
            url('../img/governor\ 3.jpg') no-repeat; background-size: cover;
                /* background-size: 600px; */
             height: 400px;width: 100%;
        
                }
                #header_4{
                    background:linear-gradient(rgba(51, 80, 51, 0.582),rgba(2, 95, 2, 0.603)),
                url('../img/governor\ 4.jpeg') no-repeat; background-size: cover;
                    /* background-size: 600px; */
                 height: 400px;width: 100%;
            
                    }
        .blog_head_container{
            margin-top: 50px;
        }
        .blog_head{
            font-size:18px;
             color: #fff;
         } 
     
         .welcome_text{
             color: var(--light-color);
             font-weight: 500;
             font-size: 13px;
             width: 300px;
             text-align: center;
             
         }
      
    
}