Certainly, Roman. Here is ALL of the Additional CSS code (the site suffers greatly without it:)
@media only screen and (max-width: 1024px) {
.header-contact {
padding-top: 3px;
padding-bottom: 3px;
}
.header-contact .social-links {
margin-top: 0;
}
}
.header-contact,
.header-contact a,
.header-contact .fa,
.has-hero .header-contact,
.has-hero .header-contact a,
.has-hero .header-contact .fa {
color: #000000;
}
.social-links a[href*=“google.com”]::before {
content: ‘\f0d5’;
}
.header-contact .fa,
.has-hero .header-contact .fa {
color: #000D80;
}
.social-navigation a {
color: #000D80 !important;
}
.social-navigation a:hover {
color: #ffffff !important;
}
@media only screen and (max-width: 767px) {
header#masthead div.col-md-4.col-sm-8.col-xs-12 {
max-width: 72%;
}
header#masthead div.col-md-4.col-sm-8.col-xs-12,
header#masthead div.col-md-8.col-sm-4.col-xs-12 {
width: auto;
}
header#masthead div.col-md-8.col-sm-4.col-xs-12 {
float: right;
padding: 1px 20px;
}
header#masthead nav#mainnav-mobi {
left: -215px;
width: 250px;
}
}
@media (max-width: 767px) {
#masthead {
padding: 5px 0 9px;
}
}
.btn-menu {
line-height: 28px;
}
.mainnav ul.menu .current-menu-item > a,
.mainnav ul.menu .current-menu-ancestor > a {
color: #000D80 !important;
}
#mainnav-mobi ul > li > a {
color: #ffffff;
}
#mainnav-mobi {
background-color: #b5b5b5;
}
#slideshow .text-slider {
animation-delay: 2s;
}
.text-slider h2.maintitle {
background-color: rgba(0,13,128,0.5);
padding-bottom: 20px;
padding-top: 15px;
padding-left: 15px;
padding-right: 15px;
border-radius: 3px;
line-height: 1;
}
.text-slider p.subtitle {
display: table;
padding-bottom: 5px;
padding-top: 5px;
padding-left: 10px;
padding-right: 10px;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
background-color: rgba(0,13,128,0.3);
border-radius: 3px;
}
.page-template-elementor_header_footer .page-wrap,
.page.page-template-elementor_header_footer .page-wrap .content-wrapper{
padding-top: 0;
padding-bottom: 0;
}
html,
body {
overflow-x: hidden;
}
@media only screen and (max-width: 760px) {
div[data-id="b0f104c"] {
background-color: #fff;
border-radius: 4px;
}
a.elementor-button {
display: block !important;
text-align: center;
}
a.elementor-button .elementor-align-icon-left {
float: none;
}
a.elementor-button *,
a.elementor-button a {
display: inline !important;
}
}
a.elementor-button span.elementor-button-icon.elementor-align-icon-left {
float: unset;
}
.site-info {
font-size: 12px;
}
Here is how the button looks on the three pages where I use it - with ALL CSS Code REMOVED:
The button appears normally. Quite well. But here is how the button looks on all three pages where I have used it - with ALL CSS Code REMOVED:
So I don’t believe it is the excessive CSS Code that is causing this bug. I have reinstalled the above CSS Code on the site. The site is beginning to rank and suffers without the additional code.
Is there another way? I am willing. To create somethings that looks like a button? With the phone icon? Disabled as a link on a computer, but auto-call features on a mobile device?
Thank you, Roman. I am trying.