.DNA_cont {
        display: inline-block;
        position: relative;
        transform: rotate(90deg);
        left: 50%;
    }

    html[dir="rtl"] .DNA_cont {
        left: auto;
    }

    .nucleobase {
        display: inline-block;
        position: relative;
        vertical-align: middle;
    }

    .nucleobase:not(:last-child) {
        margin-right: 4.86vh;
    }

    .nucleobase:before,
    .nucleobase:after {
        content: "";
        display: inline-block;
        width: 3vh;
        height: 3vh;
        border-radius: 1.25rem;
        position: absolute;
    }

    .nucleobase:nth-child(1) {
        -webkit-animation-delay: -2.759s;
        animation-delay: -2.759s;
    }

    .nucleobase:nth-child(1):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -2.759s;
        animation-delay: -2.759s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(1):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -2.759s;
        animation-delay: -2.759s;
        background-color: #fbfde1;
    }

    .nucleobase:nth-child(2) {
        -webkit-animation-delay: -5.518s;
        animation-delay: -5.518s;
    }

    .nucleobase:nth-child(2):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -5.518s;
        animation-delay: -5.518s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(2):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -5.518s;
        animation-delay: -5.518s;
        background-color: #fbfde1;
    }

    .nucleobase:nth-child(3) {
        -webkit-animation-delay: -8.277s;
        animation-delay: -8.277s;
    }

    .nucleobase:nth-child(3):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -8.277s;
        animation-delay: -8.277s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(3):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -8.277s;
        animation-delay: -8.277s;
        background-color: #fbfde1;
    }

    .nucleobase:nth-child(4) {
        -webkit-animation-delay: -11.036s;
        animation-delay: -11.036s;
    }

    .nucleobase:nth-child(4):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -11.036s;
        animation-delay: -11.036s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(4):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -11.036s;
        animation-delay: -11.036s;
        background-color: #fbfde1;
    }

    .nucleobase:nth-child(5) {
        -webkit-animation-delay: -13.795s;
        animation-delay: -13.795s;
    }

    .nucleobase:nth-child(5):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -13.795s;
        animation-delay: -13.795s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(5):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -13.795s;
        animation-delay: -13.795s;
        background-color: #fbfde1;
    }

    .nucleobase:nth-child(6) {
        -webkit-animation-delay: -16.554s;
        animation-delay: -16.554s;
    }

    .nucleobase:nth-child(6):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -16.554s;
        animation-delay: -16.554s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(6):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -16.554s;
        animation-delay: -16.554s;
        background-color: #fbfde1;
    }

    .nucleobase:nth-child(7) {
        -webkit-animation-delay: -19.313s;
        animation-delay: -19.313s;
    }

    .nucleobase:nth-child(7):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -19.313s;
        animation-delay: -19.313s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(7):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -19.313s;
        animation-delay: -19.313s;
        background-color: #fbfde1;
    }

    .nucleobase:nth-child(8) {
        -webkit-animation-delay: -22.072s;
        animation-delay: -22.072s;
    }

    .nucleobase:nth-child(8):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -22.072s;
        animation-delay: -22.072s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(8):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -22.072s;
        animation-delay: -22.072s;
        background-color: #fbfde1;
    }

    .nucleobase:nth-child(9) {
        -webkit-animation-delay: -24.831s;
        animation-delay: -24.831s;
    }

    .nucleobase:nth-child(9):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -24.831s;
        animation-delay: -24.831s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(9):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -24.831s;
        animation-delay: -24.831s;
        background-color: #fbfde1;
    }

    .nucleobase:nth-child(10) {
        -webkit-animation-delay: -27.59s;
        animation-delay: -27.59s;
    }

    .nucleobase:nth-child(10):before {
        -webkit-animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animBefore 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -27.59s;
        animation-delay: -27.59s;
        background-color: #b4d6c1;
    }

    .nucleobase:nth-child(10):after {
        -webkit-animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        animation: animAfter 3.1s cubic-bezier(0.42, 0, 0.58, 1) infinite;
        -webkit-animation-delay: -27.59s;
        animation-delay: -27.59s;
        background-color: #fbfde1;
    }

    @-webkit-keyframes animBefore {
        0% {
            top: -6vh;
            z-index: 1;
        }

        25% {
            transform: scale(1.2);
            z-index: 1;
        }

        50% {
            top: 6vh;
            z-index: -1;
        }

        75% {
            background-color: #fdfd97;
            transform: scale(0.8);
            z-index: -1;
        }

        100% {
            top: -6vh;
            z-index: -1;
        }
    }

    @keyframes animBefore {
        0% {
            top: -6vh;
            z-index: 1;
        }

        25% {
            transform: scale(1.2);
            z-index: 1;
        }

        50% {
            top: 6vh;
            z-index: -1;
        }

        75% {
            background-color: #fdfd97;
            transform: scale(0.8);
            z-index: -1;
        }

        100% {
            top: -6vh;
            z-index: -1;
        }
    }

    @-webkit-keyframes animAfter {
        0% {
            top: 6vh;
            z-index: -1;
        }

        25% {
            background-color: #f3f392;
            transform: scale(0.8);
            z-index: -1;
        }

        50% {
            top: -6vh;
            z-index: 1;
        }

        75% {
            transform: scale(1.2);
            z-index: 1;
        }

        100% {
            top: 6vh;
            z-index: 1;
        }
    }

    @keyframes animAfter {
        0% {
            top: 6vh;
            z-index: -1;
        }

        25% {
            background-color: #f3f392;
            transform: scale(0.8);
            z-index: -1;
        }

        50% {
            top: -6vh;
            z-index: 1;
        }

        75% {
            transform: scale(1.2);
            z-index: 1;
        }

        100% {
            top: 6vh;
            z-index: 1;
        }
    }

    @-webkit-keyframes animDotBar {
        0% {
            height: 8.25vh;
        }

        25% {
            height: 0;
        }

        50% {
            height: 8.25vh;
        }

        75% {
            height: 0;
        }

        100% {
            height: 8.25vh;
        }
    }

    @keyframes animDotBar {
        0% {
            height: 8.25vh;
        }

        25% {
            height: 0;
        }

        50% {
            height: 8.25vh;
        }

        75% {
            height: 0;
        }

        100% {
            height: 8.25vh;
        }
    }

    @-webkit-keyframes superscript {
        0% {
            opacity: 0;
            transform: translateY(-1em);
        }

        100% {
            opacity: 1;
            transform: translateY(0em);
        }
    }

    @keyframes superscript {
        0% {
            opacity: 0;
            transform: translateY(-1em);
        }

        100% {
            opacity: 1;
            transform: translateY(0em);
        }
    }

    @media only screen and (max-width: 1200px) {
        .DNA_cont {
            transform: rotate(180deg) !important;
            position: relative;
            /* left: 50%; */
            top: 50%;
            margin: 50px 0;
            transform: translate(-55%, -50%) !important;
        }

        html[dir="rtl"] .DNA_cont {
            left: 50% !important;
            /* transform: translate(3%, -50%) !important; */
        }
    }

    svg#freepik_stories-dna:not(.animated) .animable {
        opacity: 0;
    }

    svg#freepik_stories-dna.animated #freepik--background-simple--inject-31 {
        animation: 1s 1 forwards cubic-bezier(.36, -0.01, .5, 1.38) zoomOut;
        animation-delay: 0s;
    }

    svg#freepik_stories-dna.animated #freepik--Clock--inject-31 {
        animation: 1s 1 forwards cubic-bezier(.36, -0.01, .5, 1.38) lightSpeedRight;
        animation-delay: 0s;
    }

    svg#freepik_stories-dna.animated #freepik--Device--inject-31 {
        animation: 1s 1 forwards cubic-bezier(.36, -0.01, .5, 1.38) slideUp;
        animation-delay: 0s;
    }

    svg#freepik_stories-dna.animated #freepik--Microscope--inject-31 {
        animation: 1s 1 forwards cubic-bezier(.36, -0.01, .5, 1.38) slideRight;
        animation-delay: 0s;
    }

    svg#freepik_stories-dna.animated #freepik--Circles--inject-31 {
        animation: 1s 1 forwards cubic-bezier(.36, -0.01, .5, 1.38) zoomOut;
        animation-delay: 0s;
    }

    svg#freepik_stories-dna.animated #freepik--Character--inject-31 {
        animation: 1s 1 forwards cubic-bezier(.36, -0.01, .5, 1.38) lightSpeedLeft;
        animation-delay: 0s;
    }

    svg#freepik_stories-dna.animated #freepik--DNA--inject-31 {
        animation: 1s 1 forwards cubic-bezier(.36, -0.01, .5, 1.38) slideDown;
        animation-delay: 0s;
    }

    svg#freepik_stories-dna.animated #freepik--Bottles--inject-31 {
        animation: 1s 1 forwards cubic-bezier(.36, -0.01, .5, 1.38) zoomIn;
        animation-delay: 0s;
    }

    svg#freepik_stories-dna.animated #freepik--Table--inject-31 {
        animation: 1s 1 forwards cubic-bezier(.36, -0.01, .5, 1.38) slideLeft;
        animation-delay: 0s;
    }

    @keyframes zoomOut {
        0% {
            opacity: 0;
            transform: scale(1.5);
        }

        100% {
            opacity: 1;
            transform: scale(1);
        }
    }

    @keyframes lightSpeedRight {
        from {
            transform: translate3d(50%, 0, 0) skewX(-20deg);
            opacity: 0;
        }

        60% {
            transform: skewX(10deg);
            opacity: 1;
        }

        80% {
            transform: skewX(-2deg);
        }

        to {
            opacity: 1;
            transform: translate3d(0, 0, 0);
        }
    }

    @keyframes slideUp {
        0% {
            opacity: 0;
            transform: translateY(30px);
        }

        100% {
            opacity: 1;
            transform: inherit;
        }
    }

    @keyframes slideRight {
        0% {
            opacity: 0;
            transform: translateX(30px);
        }

        100% {
            opacity: 1;
            transform: translateX(0);
        }
    }

    @keyframes lightSpeedLeft {
        from {
            transform: translate3d(-50%, 0, 0) skewX(20deg);
            opacity: 0;
        }

        60% {
            transform: skewX(-10deg);
            opacity: 1;
        }

        80% {
            transform: skewX(2deg);
        }

        to {
            opacity: 1;
            transform: translate3d(0, 0, 0);
        }
    }

    @keyframes slideDown {
        0% {
            opacity: 0;
            transform: translateY(-30px);
        }

        100% {
            opacity: 1;
            transform: translateY(0);
        }
    }

    @keyframes zoomIn {
        0% {
            opacity: 0;
            transform: scale(0.5);
        }

        100% {
            opacity: 1;
            transform: scale(1);
        }
    }

    @keyframes slideLeft {
        0% {
            opacity: 0;
            transform: translateX(-30px);
        }

        100% {
            opacity: 1;
            transform: translateX(0);
        }
    }

    .custom-shape-divider-top-1647131725 {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        overflow: hidden;
        line-height: 0;
        transform: rotate(180deg);
    }

    .custom-shape-divider-top-1647131725 svg {
        position: relative;
        display: block;
        width: calc(300% + 1.3px);
        height: 190px;
    }

    .custom-shape-divider-top-1647131725 .shape-fill {
        fill: #FFFFFF;
    }