(HTML - CSS) Yardım

Merhabalar,
Arkadaşlar css kodu konusunda yardıma ihtiyacım var. Ücretli/ücretsiz yardımcı olabilecek arkadaşlar ulaşırsa çok sevinirim.

Hali hazırda bu css kodları sitede mevcut.

.Hero.WelcomeHero {
    margin-top: -1px;
    background: #f8f8f8;
    color: #333;
    background-image: url([url]https://********************.png);[/url]
    background-repeat: no-repeat;
    background-size: cover;
    background-position: bottom;
}

.Hero.WelcomeHero h2 {
    
    line-height: 42px;
    color: white;
    font-size: 30px;
    font-weight: 700;
    text-transform: uppercase;
    
}

.WelcomeHero .Hero-subtitle {
    line-height: 1.5em;
    color: white;
    font-style: normal;
    font-size: 16px;
    line-height: 24px;
}
.Hero-close {color: #fff}

.Hero-subtitle_buttons {
    margin-top: 20px;
}

.Button.Button--secondary {
    background: transparent;
    color: #34C5F3;
    border: 1px solid #34C5F3;
}

.Hero-subtitle_buttons .Button:not(:first-child) {
    margin-left: 5px;
}


.DiscussionListItem-info .username {display: none}

@media (min-width: 768px){
.sideNav .Dropdown--select .Dropdown-menu {
border: 1px solid #e4ebf6;
    padding-right: 15px;
    padding-left: 15px;
    border-radius: 4px;
}}


.sideNav .Dropdown--select .Dropdown-menu>.Dropdown-separator {
    border-bottom: 1px solid #e4ebf6;
}

body when (@config-dark-mode = true) {


.DiscussionListItem-content {
       border-bottom: 1px solid #1b2028;
}

@media (min-width: 768px){
.sideNav .Dropdown--select .Dropdown-menu {
border: 1px solid  #1b2028;
    
}}


.sideNav .Dropdown--select .Dropdown-menu>.Dropdown-separator {
    border-bottom: 1px solid #1b2028;
}
}


.DiscussionListItem-content {
       border-bottom: 1px solid #e4ebf6;
}

.DiscussionListItem-title {
        font-weight: 600 !important;
}
.item-discussion-language code {display: none}


.DiscussionListItem-count {display: none}

@media (min-width: 768px){
.IndexPage .DiscussionListItem-info>.item-tags, .UserPage .DiscussionListItem-info>.item-tags {
right: 20px !important;
}}

.fa-comments::before {
font-family: 'Font Awesome 5 Free';
    font-weight: 600;
    font-size: 17px;
content: "\f0ac" !important;
}

.item-privateDiscussions {display: none !important}

Bu sitede bulunan html kodlarını siteye ekleyeceğim. Burada bulunan css kodlarını da eklemem gerekiyor.
İki css kodunu da eklediğim zaman sitede çok fazla kayma oluyor. Bunu düzenlemenin bir yolu var mı ?

Pm atıldı

Merhabalar, detay verirseniz ücretli olarak yardımcı olabilirim.

merhaba iş verildimi hocam

Kayma olmasının sebebi muhtemelen aynı isimdeki classlar,idler birbirini eziyor. Yani şöyle söyleyeyim sen iki tane class tanımladın, eğer aynı isimdeyse ikiside çalışır, ikisinde de aynı şeyler yazıyorsa sonrakindeki komutlar çalışır. Eğer Farklı isimde iki class varsa ve aynı komut ikisinde de yazıyorsa yine sonraki çalışır sağ tıklayıp kayma olan şeyleri incelemen lazım hocam, bence birine yaptırmak yerine kendin çözmeye çalışırsan olayı öğrenirsin

Misal body{} , h1{} bu tarz CSS kodları tüm sayfaya veya tüm h1 etiketlerine etki eder, bunlarada dikkat ederseniz sizde cozebilirsiniz arkadaşın dediği gibi, yapamazsaniz yardımcı olurum

@soxiety_; Mehmet hocama iş verildi teşekkür ederim arkadaşlar.