.techno-container {
    margin-top: 60px;
    margin-bottom: 60px;
}

.display-flex{display: flex}

.image-overflowing-br {
    position: bottom right !important;  
    background-position: bottom 100px right 0% !important; 
    background-size: auto 90% !important;
    background-repeat: no-repeat !important;
    background-clip: border-box !important; 
    overflow: visible !important; 
}

.image-overflowing-bl {
    position: bottom left !important;  
    background-position: bottom 50px left 0% !important; 
    background-size: auto 90% !important;
    background-repeat: no-repeat !important;
    background-clip: border-box !important; 
    overflow: visible !important; 
}

.text-justify {
    text-align: justify;
    text-justify : auto;
}

.align-content{
    align-content: center;
}

.manta-anim{
    position:absolute;
    width:181px;
    height: 129px;
    transform-origin: bottom right;
    bottom:-800px;
    right:900px;
}
.mticket-anim{
    position:absolute;
    height: 818px;
    width:748px;
    transform-origin: middle;
    bottom:-2700px;
    left:350px;
}

.synergy-background{
    background-image: url(../images/Leikir/synergy-art1.jpg);
    background-repeat: no-repeat;
    background-origin: middle middle;
    background-size: 100% auto;
    background-position: 50% 50%;
}

.spacing-30px{
    row-gap: 30px;
}

.bg-tl{
    background-origin: top left !important;
    background-position: top left !important;
}
.bg-br{
    background-origin: bottom right !important;
    background-position: bottom right !important;
}
.bg-bc{
    background-origin: bottom center !important;
    background-position: bottom center !important;
}
.bg-cr{
    background-origin: center right !important;
    background-position: center right !important;
}

/* Attempt at animating a carrousel of background images */

.bg-fade-wrapper{
    position: relative;
    overflow: hidden;
}
.bg-fade{
    position: absolute;
    content :'';
    width: 100%;
    height: 100%;
    inset: 0;
    background-size: cover;
    background-position: center center;
    opacity: 0;
    animation-name: fade;
    animation-duration:18s;
    animation-iteration-count: infinite;
}
.bg-fade::after{
    position: absolute;
    content :'';
    width: 100%;
    height: 100%;
    inset: 0;
    background-size: contain;
    background-color: rgba(0,0,0,0.0);
}
.bg-fade:nth-child(1){
    animation-delay: 0s;
}
.bg-fade:nth-child(2){
    animation-delay: 6s;
}
.bg-fade:nth-child(3){
    animation-delay: 12s;
}

@keyframes fade {
    0% {opacity: 0;}
    16.66% {opacity: 1;}
    33.33% {opacity: 1;}
    49.99% {opacity: 0;}
    100% {opacity: 0;}
}