Hello,
1) This is not needed if you want a dark header.
2) To make the header dark please follow the steps below:
2.1) Change the header-body to:
<div class="header-body header-body-bottom-border-fixed box-shadow-none border-top-0 bg-dark">
* Note bg-dark.
2.2) Change header-nav div to:
<div class="header-nav header-nav-light-text header-nav-links justify-content-end pr-lg-4 mr-lg-3">
* Note header-nav-light-text.
2.3) Change the social icons on header top to:
<ul class="header-social-icons social-icons social-icons-clean social-icons-icon-light social-icons-medium custom-social-icons-divider">
* Note social-icons-icon-light.
2.4) For all remaining dark texts you should change the dark color class to light. For example to change the “CALL US NOW” text colors:
Change this:
<div class="header-extra-info-text line-height-2"> <span class="text-1 font-weight-semibold text-color-default">CALL US NOW</span> <strong class="text-4"><a href="tel:+1234567890" class="text-color-hover-primary text-decoration-none">+123 4567 890</a></strong> </div>
To this:
<div class="header-extra-info-text line-height-2"> <span class="text-1 font-weight-semibold text-color-light">CALL US NOW</span> <strong class="text-4"><a href="tel:+1234567890" class="text-color-light text-color-hover-primary text-decoration-none">+123 4567 890</a></strong> </div>
* Do the same for all remaining dark texts on header.
3) The css/demos/demo-auto-services.css is the CSS file where it’s code of “top panel”. The css/skins/skin-auto-services.css controls only the colors of the demo.
Please try that and let us know if you need further assistance.
Kind Regards,
Rodrigo.
If you are satisfied with Porto HTML and our support, please leave your comment and rating on ThemeForest downloads page. That helps us a lot: https://themeforest.net/downloads