Blog

Hi there.
I copied a blog from the old website but the customizer doesn't work or maybe I don't use well.
I put the website below these lines.
I change the settings in customizer-design-blog and typography but I don't like it.
I also eliminate the CSS code of this theme, now I have that.
How can I do a new setting or create shortcode entries in the blog?
Thanks for your time and patience.

/* GeneratePress Site CSS */ /* Typography styling */

/* Text highlighter on Underline Text Decoration on Elementor Headings and anchor links */
u {
text-decoration: none;
position: relative;
z-index: 2;
font-style: italic;
}

u:before {
position: absolute;
content: '';
bottom: 5px;
left: 0;
width: 100%;
height: 12px;
background-color: rgba(0, 158, 226, 0.3);
z-index: -1;
}

.text-highlighter .elementor-heading-title,
a.text-highlighter {
display: inline;
background-color: #22222f;
color: #fff;
padding: 0.2em 0.5em;
box-decoration-break: clone;
-webkit-box-decoration-break: clone;
}
.main-navigation ul ul {
color: #fff !important;
}

/*--- WP Show Posts ---*/

a.wp-show-posts-read-more,
a.wp-show-posts-read-more:hover {
padding: 0;
border: 0;
}

/*--- Primary Navigation - Mega Menu ---*/

@media (min-width: 769px) {
nav .main-nav .mega-menu {
position: static;
}

/* nav .main-nav, .inside-navigation {
position: static;
}*/
nav .main-nav .mega-menu>ul {
position: absolute;
width: 100%;
left: 0 !important;
padding: 20px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

nav .main-nav .mega-menu>ul>li>a {
font-weight: bold;
}

nav .main-nav .mega-menu>ul>li {
display: inline-block;
width: 25%;
vertical-align: top;
border-right: 1px solid;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

nav .main-nav .mega-menu>ul>li:last-child {
border-right: 0;
}

nav .main-nav .mega-menu.mega-menu-col-2>ul>li {
width: 50%;
}

nav .main-nav .mega-menu.mega-menu-col-3>ul>li {
width: 33.3333%;
}

nav .main-nav .mega-menu.mega-menu-col-5>ul>li {
width: 20%;
}

nav .main-nav .mega-menu>ul>li:hover>a,
nav .main-nav .mega-menu>ul>li:focus>a,
nav .main-nav .mega-menu>ul>li[class*="current-"]>a,
nav .main-nav .mega-menu ul ul {
background-color: transparent !important;
color: inherit;
}

nav .main-nav .mega-menu ul .sub-menu {
position: static;
display: block;
opacity: 1;
visibility: visible;
width: 100%;
-webkit-box-shadow: 0 0 0;
box-shadow: 0 0 0;
left: 0;
height: auto;
}

nav .main-nav .mega-menu ul.toggled-on .sub-menu {
pointer-events: auto;
}

nav .main-nav .mega-menu .sub-menu .menu-item-has-children .dropdown-menu-toggle {
display: none;
}

.header-wrap+#page {
-webkit-transition: all 0.3s;
transition: all 0.3s;
-webkit-backface-visibility: hidden;
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);

}
}

/*--- Elementor Custom styling */

/* Remove Shadow from buttons when not hovered */

.no-hover-shadow .elementor-button:not(:hover) {
-webkit-box-shadow: 0px 7px 10px -6px rgba(0, 0, 0, 0) !important;
box-shadow: 0px 7px 10px -6px rgba(0, 0, 0, 0) !important;
}

/* Reduce distance of FadeInUp and SlideIn Up Animations in Elementor */

@-webkit-keyframes fadeInUp {
from {
opacity: 0;
-webkit-transform: translate3d(0, 30%, 0);
transform: translate3d(0, 30%, 0)
}

to {
opacity: 1;
-webkit-transform: none;
transform: none
}
}

@-webkit-keyframes slideInUp {
from {
-webkit-transform: translate3d(0, 80%, 0);
transform: translate3d(0, 80%, 0);
visibility: visible
}

to {
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0)
}
}

/* Style Click Box custom element for desktop */

@media (min-width: 769px) {
.click-box {
position: relative;
}

body:not(.elementor-editor-active) .click-box .elementor-widget-button {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}

body:not(.elementor-editor-active) .click-box .elementor-widget-button>.elementor-widget-container,
body:not(.elementor-editor-active) .click-box .elementor-widget-button>.elementor-widget-container>.elementor-button-wrapper,
body:not(.elementor-editor-active) .click-box .elementor-widget-button>.elementor-widget-container>.elementor-button-wrapper>.elementor-button {
width: 100%;
height: 100%;
color: transparent;
border: 0;
background-color: transparent;
}

.click-box:hover .elementor-widget-text-editor,
.click-box:hover .elementor-widget-heading {
color: #fff;
}

body:not(.elementor-editor-active) .click-box-image:not(:hover) .elementor-widget-container {
opacity: 0;
}
}

/* Overflow hidden class on columns to stop animations outside of element - optional */

.overflow-hidden {
overflow: hidden;
}

/* End GeneratePress Site CSS */`