.showmore {
        width: 100%;
		text-align: center;
		margin-bottom: 40pt;
    }
	
	.showmore a {
		font-style: italic;
		color: rgb(53, 83, 23);
    }
	
	.pattern-container {
        position: relative;
        width: 100%;
        background-color: #f4f4f4;
        overflow: hidden;
        margin: 0;
    }

    .pattern-container::before {
        content: "";
        position: absolute;
        top: -100%;
        left: -100%;
        width: 300%;
        height: 300%;
        transform: rotate(-45deg);
        
        background-image:
            linear-gradient(0deg, rgba(0,0,0,0.02) 25%, transparent 25%, transparent 75%, rgba(0,0,0,0.02) 75%),
            linear-gradient(90deg, rgba(255,255,255,0.9) 25%, transparent 25%, transparent 75%, rgba(255,255,255,0.9) 75%),
            linear-gradient(to bottom, rgba(0,0,0,0.015) 50%, transparent 50%),
            linear-gradient(to right, rgba(255,255,255,0.6) 50%, transparent 50%);
        
        background-size: 200pt 200pt, 200pt 200pt, 100pt 100pt, 100pt 100pt;
        background-position: 0 0, 50pt 50pt, 0 0, 0 0;
        z-index: 1;
    }

    .pattern-container::after {
        content: "";
        position: absolute;
        inset: 0;
        background: 
            radial-gradient(circle at 30% 20%, rgba(0,0,0,0.05) 0%, transparent 60%),
            radial-gradient(circle at 80% 80%, rgba(0,0,0,0.08) 0%, transparent 60%);
        pointer-events: none;
        z-index: 2;
    }

    .pattern-content {
        position: relative;
        z-index: 10;
        padding: 20px;
    }
	
	.campaign-logo {
		display: flex;
		justify-content: center;
		margin-bottom: 60pt;
	}
	
	.campaign-logo img {
		height: 100pt;
		max-width: 90%;
	}
	
	.campaign-dates {
		display: flex;
		justify-content: center;
		margin-bottom: 60pt;
		
	}
	
	.campaign-dates img {
		height: 90pt;
		max-width: 95%;
	}
	
    .events-container {
		margin-left: auto;
		margin-right: auto;
        display: flex;
        flex-direction: column;
        width: 100%;
        max-width: 1200px;
    }

	:root {
	  --heightx-slant-sect: 120pt;
	  --skewx-slant-sect: 15deg;
	} 
	
	.slanted-container {
		position: relative;
		flex: 1 1 0px;
	}

    .slanted-section {
		display: flex;
		align-items: center;
		justify-content: right;
        color: white;
        height: var(--heightx-slant-sect);
		padding: 0pt 22pt;
		flex: 1 1 0px;
        transform: skewX(calc(var(--skewx-slant-sect) * -1));
    }
	
	.tilted-base {
		height: calc(var(--heightx-slant-sect) + 80pt);
		float: right;
		width: 30pt;
		background-color: black;
		shape-outside: inset(calc(100% - 100px) 0 0);
		rotate: var(--skewx-slant-sect);
	}

    .slanted-section-fr::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: -50pt;
		right:-50pt;
		transform: skewX(calc(var(--skewx-slant-sect) * 1));
        background-image:url('../images/100jahre/100Jahre-BG-Box1.jpg');
		background-size: cover;
		background-position: 50% 50%;
    }
	
    .slanted-section-fr {
		overflow: hidden;
    }
	
    .slanted-section-sa::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: -50pt;
		right:-50pt;
		transform: skewX(calc(var(--skewx-slant-sect) * 1));
        background-image:url('../images/100jahre/100Jahre-BG-Box2.jpg');
		background-size: cover;
		background-position: 50% 50%;
    }
	
    .slanted-section-sa {
        overflow: hidden;
    }
	
    .slanted-section-so::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: -50pt;
		right:-50pt;
		transform: skewX(calc(var(--skewx-slant-sect) * 1));
        background-image:url('../images/100jahre/100Jahre-BG-Box3.jpg');
		background-size: cover;
		background-position: 50% 50%;
    }
    
    .slanted-section-so {
        overflow: hidden;
    }

    /* The content inside the box */
    .content {
        /* Un-skews the text so it remains straight */
        transform: skewX(var(--skewx-slant-sect));
        text-align: right;
    }

    .content h2 {
        margin-top: 0;
        font-size: 1.5rem;
    }

    .content p {
        line-height: 1.6;
        margin-bottom: 0;
    }
	
	.event-day-desc {
		font-size: 15pt;
		margin-right: 14pt;
	}
	
	.event-day-circle
	    {
		position:absolute;
		top: -10pt;
		left: 10pt;
	    width:30pt;
	    height:30pt;
	    border-radius:15pt;
	    font-size:12pt;
	    color:#fff;
	    line-height: 30pt;
	    text-align:center;
	    background:#000;
		font-weight: 900;
		font-style: italic;
		z-index:9999;
		
	   }
	   
	
    /* Correct slanting for mobile screens */
    @media (max-width: 767px) {
		
			.campaign-logo {
				margin-bottom: 35pt;
			}
			
			.campaign-dates {
				margin-bottom: 35pt;
			}
		
			.slanted-section{
				flex: unset;
			}
		
			.slanted-section-fr {
				margin-left: calc(var(--heightx-slant-sect) * tan(var(--skewx-slant-sect)));
				margin-right: calc(var(--heightx-slant-sect) * tan(var(--skewx-slant-sect)) * -1);
			}
    
			.slanted-section-sa {
			    background-color: #8b82e9;
			}
    
			.slanted-section-so {
			    margin-left: calc(var(--heightx-slant-sect) * tan(var(--skewx-slant-sect)) * -1);
				margin-right: calc(var(--heightx-slant-sect) * tan(var(--skewx-slant-sect)));
			}
			
			.event-day-circle-fr {
				left: 40pt;
			}
			
			.event-day-circle-sa {
				left: 10pt;
			}
			
			.event-day-circle-so {
				left: -20pt;
			}
			
			
			
    }

    /* Media Query for larger screens */
    @media (min-width: 768px) {
        .events-container {
            flex-direction: row; /* Display next to each other horizontally */
            /* No gap applied here either */
        }
    }