GeneratePress Divider between Menu Items

@media (min-width: 769px) {
    .main-navigation .main-nav > ul > li:not(:last-child) {
        position: relative;
    }

    .main-navigation .main-nav > ul > li:not(:first-child) > a:after {
        content: " \007C";
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        font-size: 10px;
    }
}

GeneratePress Fixed Footer

.inside-article {
	min-height: 100%;
	min-height: 100vh;
	padding-top: 65px;
	position: relative;
	z-index: 1;
	margin-bottom: calc(30vh + 141px)!important; /*an Höhe #footer-widgets anpassen*/
}

#footer-widgets {
	height: 30vh!important; /*an margin-bottom .inside-article anpassen*/
	position: fixed;
	left: 0;
	right: 0;
	bottom: 63px; /*an Höhe .site-info anpassen*/
	overflow: scroll;
}

.site-info {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
}

GeneratePress Off Canvas Panel Width

.offside--right.is-open {
  transform: translate3d(-565px,0,0); /* gewünschte Breite */
}

.main-navigation.offside {
  width: 565px; /* gewünschte Breite */
}

.offside--right {
  right: -565px; /* gewünschte Breite */
}

GP: Sticky Navi colors

Background:
.main-navigation.navigation-clone {
  background-color: rgba(74,94,155,0.7);
}
Menu Items
.main-navigation.navigation-stick .main-nav ul li a {
  color: #000000;
}

GP: Trigger specific Menu Item

Dem Menu Item die class
nav-button 
geben.

@media (min-width:769px) {
  .main-navigation .main-nav ul li.nav-button a {
    background-color: #ffffff;
    border: 2px solid #000000;
    color: #000000;
    line-height: 35px; /*this number will likely need to be adjusted*/
  }
}

Elementor: Gallery Masonry

Elementor Gallery ID beachten.

.gallery-icon img{
  width: 100%;
}

@media (min-width: 1024px) {
  #gallery-1 {
    -webkit-column-count: 4;
            column-count: 4;
    -webkit-column-gap: 0px;
            column-gap: 0px;
  }
}

@media (min-width:361px) and (max-width:1024px) {
  #gallery-1 {
    -webkit-column-count: 3;
            column-count: 3;
    -webkit-column-gap: 0px;
            column-gap: 0px;      
  }  
}

@media (max-width:360px) {
  #gallery-1 {
    -webkit-column-count: 3;
            column-count: 3;
    -webkit-column-gap: 0px;
            column-gap: 0px;      
  }  
}

Weiterlesen ...

Elementor: column wrap

Der Section die class
mw-column-wrap 
geben.

@media (min-width: 1024px) {
  .mw-column-wrap .elementor-row {
    -webkit-flex-wrap: wrap;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
  }
  .mw-column-wrap .elementor-column {
    -webkit-box-flex: 1;
    -webkit-flex: 1 1 33% ;
        -ms-flex: 1 1 33% ;
            flex: 1 1 33% ;
  }
}

Weiterlesen ...

Post Navigation – INLINE

.post-navigation {
  display: flex;
}

.post-navigation .nav-next {
  width: 50%;
  text-align: right;
}

.post-navigation .nav-previous {
  width: 50%;
}

.post-navigation .nav-next .next:before {
  display: none;
}

.post-navigation .nav-next .next:after {
  font-family: GeneratePress;
  text-decoration: inherit;
  position: relative;
  margin-left: .6em;
  width: 13px;
  text-align: center;
  display: inline-block;
  content: "\f105";
   -moz-osx-font-smoothing: grayscale;
     -webkit-font-smoothing: antialiased;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
  speak: none;
}

Mit GP SVG

.post-navigation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
	margin-top: 20px;
	font-size: 120%;
	text-decoration: underline;
}

.post-navigation .nav-next, .post-navigation .nav-previous {
  width: 50%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.post-navigation .nav-previous {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.entry-meta .nav-next .gp-icon {
  margin-right: 0;
  margin-left: .6em;
}

.entry-meta .gp-icon {
	font-size: 20px;
}

Button: slide color on hover

Dem Button die class
mw-btn-slide-hover
geben.

Individuelle Positionierung: custom 204 px (ggf. an Text anpassen)

.mw-btn-slide-hover .elementor-button {
  -webkit-box-shadow: inset 0 0 0 0 #7a90a4;
          box-shadow: inset 0 0 0 0 #7a90a4;
  -webkit-transition: -webkit-box-shadow 1s ease!important;
  transition: -webkit-box-shadow 1s ease!important;
  -o-transition: box-shadow 1s ease!important;
  transition: box-shadow 1s ease!important;
  transition: box-shadow 1s ease, -webkit-box-shadow 1s ease!important;
}

.mw-btn-slide-hover .elementor-button:hover {
  -webkit-box-shadow: inset 204px 0 0 0 #7a90a4;
          box-shadow: inset 204px 0 0 0 #7a90a4;
}

Weiterlesen ...