Как объединить несколько блоков css?

Совсем ещё ничего не знаю в этой теме, хочу объединить несколько стилизованных блоков css в один (?), чтобы при смене данных в одном (например, тень на словах), не менялась визуальная составляющая на сайте другого объекта. Хочу затемнить только фон, но при этом затемняется и шапка вверху страницы.

#header {
    width: 1920px;
    height: 100px;
    position: absolute;
    top: 0;
    left: 0;
    margin-bottom: 0 auto;
    background-image: url(images/455.jpg);}
    
    h1{
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    color:#d3cbcc;
    font-size:35px;
    margin-left:910px;
    font-family:'Franklin Gothic Medium';
    position: absolute;
    top: 5px;}

    img{
    position: absolute;
    top: 10px;
    left: 20px;
    width: 80px;
    height: 80px;
    border-radius: 50px;}
    
    .descript{
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
     position: absolute;
     top:15px;
     left:115px;    
    color: #d3cbcc; 
    font-family: 'Franklin Gothic Medium';
    font-size:22px;}