.block-type-21{
    align-items: center;
    align-content: center;
    padding-top: 75px;
    padding-bottom: 75px;
    justify-content: space-between;
    
    
    
    
    @media(max-width:1100px){
        flex-direction: column;
        padding:15px;
    }
    .text-center{
        text-align: center!important;
    }
    .text-md-left{
        @media (min-width: 768px){
            text-align: left!important;
        }
    }
    .mb-4{
        margin-bottom: 8rem!important;
    }
    .image{
        z-index: 9999;;
        /* z-index: 9; */
        border-radius: 100%;
       position:relative;
                z-index: 99;;

       .wrapp-buttons{
            z-index: 999;
              position: absolute;
              top: 0;
              right: -40px;
              @media(max-width:1700px){
                  right: 20px;
              }

                 @media(max-width:1500px){
                  right: 50px;
              }
              bottom: 0;
              display: flex;
              justify-content: center;
              align-items: center;
              flex-direction: column;
              gap:60px;
                    @media(max-width:1100px){
                        position: static;
                    flex-direction: row;
                    gap: 15px;
                    margin: 20px auto;
                    }
             .button-circle{
                cursor: pointer;
                z-index: 9999;;
                &:hover, &.active{
                    img{
                    border-radius: 100%;
                        box-shadow: 0px 0px 20px 0rem white;
                         }
                    }
                    @media(min-width:1100px){
 &:nth-child(1){
                    transform:translate(-70px, 0);
                }
                &:nth-child(2){
                    transform:translate(0,0);
                }
                &:nth-child(3){
                    transform:translate(30px,0);
                }
                &:nth-child(4){
                    transform:translate(0px,0);
                }
                &:nth-child(5){
                    transform:translate(-70px,0);
                }
                    }
               
             }
         }
        .image-wrapper{
            position: relative;
            z-index: 0;
            svg{
                position: absolute;
                top: -8rem;
                left: -18rem;
                width: calc(45vw + 16rem);
                height: calc(45vw + 16rem);
                z-index: 1;
            }
            .mask1, .mask2{
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                z-index: -1
            }
            .mask1{
                width: 900px;
                left: unset;
                right: 0;
                top: -200px;
                          @media(max-width:1100px){
                            max-height:400px;
                            width: 300px;
                left: 45%;
                top: -100px;
                            }
            }
            .mask2{
                    width: 800px;
                left: -300px;
                bottom: -248px;
                top: unset;
                 @media(max-width:1100px){
                            max-height:400px;
                            bottom: -100px;
                            }
            }
            .obvosvg{
                @media(max-width:1100px){
                    display: none;
                }
            }
            video{
                min-height: 95vh;
                min-width: 35vw;
                @media(max-width:1100px){
                    min-height: 40vh;
                    min-width: 100%;
                }
            }
            img, video{
            border-radius: 100%;
            display: block;
            width: 45vw;
            height: auto;
            object-fit: cover;
            aspect-ratio: 1/1;
            /* max-height: 1000px; */
            height: 45vw;
            position: relative;
            left: -20rem;
            min-height: auto;
            min-width: auto;
            
            
            @media(max-width:1100px){
       left:0;
       right:0;
       max-height:400px;
    }
        }
        }
    }
    .content-block-type-21{
        z-index: 9;
        width: 100%;
        position: absolute;
        top: 50%;
        right: 0;
        transform: translate(0, -50%) !important;
        
        
        @media(min-width: 991px){
            width:50%;
        }
		@media screen and (max-width: 991px) {
			transform: none !important;

			.eyebrow {
				display: none;
			}
		}
        .content{
        max-width:580px;
        margin:0 auto;
        }
    }

    .content-to-dynamic-change{
        margin-top: 80px;
        margin-bottom: 70px;
		@media screen and (max-width: 991px) {
	        margin-top: 40px;
	        margin-bottom: 30px;
		}
        
        .dynamic-content{
            &.active{
                display: block!important;
            }
        }
        .icon_second{
            width: 30px;
    height: 30px;
    object-fit: contain;
    margin-bottom: 10px;
        }
        .custom-button{
            margin-bottom: 40px;
            display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    color: white;
    text-decoration: none;
    @media(max-width:1100px){
       justify-content: center;
       align-items: center;
    }
    svg{
        margin-bottom: 10px;
    }
    .title-link{
        color:#A4D6E5;
        font-style: italic;
    }
    .link{
        font-family: "STIX Two Text";
        text-transform: uppercase;
        font-weight: bold;
    }
        }
    }
}

.block-type-21 {
	position: relative;
	border-bottom: 1px solid #575757;
	text-align: center;
}

.block-type-21:before {
	content: '';
	width: 100%;
	height: 100%;
	background: url(../images/pattern-1.png) center -60px;
	position: absolute;
	top: 0;
	left: 0;
	opacity: .4;
	mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 15%, rgba(0, 0, 0, 1) 19%, rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 1) 81%, rgba(0, 0, 0, 0.8) 85%, rgba(0, 0, 0, 0) 100%);
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.block-type-21 .vertical-lines {
	width: 92rem;
	position: absolute;
	left: 60%;
	margin-left: -46rem;
	top: 0;
	height: 100%;
}

.block-type-21 .vertical-lines .line {
	height: 100%;
	width: .1rem;
	background: rgba(87, 87, 87, .4);
	position: absolute;
	top: 0;
	mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 15%, rgba(0, 0, 0, 1) 19%, rgba(0, 0, 0, 1) 20%, rgba(0, 0, 0, 1) 50%, rgba(0, 0, 0, 1) 80%, rgba(0, 0, 0, 1) 81%, rgba(0, 0, 0, 0.8) 85%, rgba(0, 0, 0, 0) 100%);
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.block-type-21 .vertical-lines .line-1 {
	left: -35rem;
}

.block-type-21 .vertical-lines .line-1:before {
	content: '';
	width: .1rem;
	height: 11rem;
	background: var(--red);
	top: 50%;
	left: 0;
	position: absolute;
}

.block-type-21 .vertical-lines .line-2 {
	right: -35rem;
}

.block-type-21 .vertical-lines .line-2:before {
	content: '';
	width: .1rem;
	height: 11rem;
	background: var(--red);
	top: 30%;
	left: 0;
	position: absolute;
}