custom css for social media icons

[JCCMW]

JCCMW

June 8, 2020 at 3:36 pm

Hi
With your help, I have the following custom css to keep the social media icons on the right of the topbar. I’m trying to move the widget to the footer and can’t – I think it’s blocked by the css
can you help?

.topbarmenu ul.sf-menu {
display: block;
}
#topbar .id-kad-mobile-nav, #topbar .mobile-nav-trigger-id {
display: none;
}

@media (max-width: 768px) {
body #topbar .kad-topbar-left {
float: none;
width: 100%;
}
body #topbar .kad-topbar-right {
float: none;
width: 100%;
}
}
.topbar-widgetcontain {
display: inline-block;
}
#topbar-search {
text-align: left;
}

@media (min-width: 992px){
.kad-topbar-right {width:60%;}
.kad-topbar-left {width:40%; padding-left:0;}
.topbar-widgetcontain .kt-image-align-center {
max-width: 150px;
}
.widget-4.widget-last.topbar-widgetcontent.topbar-widgetcontain {
float: right;
margin-top: 8px;
margin-right: 10px;
}
.widget-3.topbar-widgetcontent.topbar-widgetcontain {
float: right;
}
.topbar-widgetcontain {
float: right;
}
.widget-2.topbar-widgetcontent.topbar-widgetcontain {
clear: right;
}
}
.kad-topbar-widget {
margin-top: 8px;
}
#topbar form.form-search {
max-width: 140px;
}
.kad-topbar-right {
padding-right: 0;
}
.topbarmenu ul li a {
font-size: 16px;
}

@media (max-width: 992px) {
#topbar .kad-topbar-left {
float: right;
width: 20%;
}
#topbar .kad-topbar-right {
width: 90%;
float: right;
}
}

@media (min-width: 1200px) {
.topbar-widgetcontain {
float: right;
display: inline-block;
}
.widget-1.widget-first.topbar-widgetcontent.topbar-widgetcontain {
float: none;
margin-top: 0;
}
#topbar-search {
text-align: right;
}

.sidebar ul a {
color: blue;
font-size: 14
font-weight: 700;
}
.sidebar ul a:hover {
background: #81d742;
color: black;
}

@media (min-width: 992px) {
.widget-1.widget-first.header-widget-area-header.widget_media_image {
width: 50%;
float: left;
}
.kad-info-box.kad-info-box-98.clearfix {
float: left;
margin-top: 10px;
}
.widget-2.widget-last.header-widget-area-header.virtue_infobox_widget {
display: inline-block;
width: 50%;
margin-top: 10px;
}
}