#PresentationSec{
display: flex;
justify-content: center;
    }

    /* #PreLeft{
        width: 50%;
    } */
    #PreRight{
        width: 35%;
        display: flex;
         justify-content: center; 
    }
    #PreRight img{
        width: 50%;
    }
    #PreLeft{
        justify-content: center;
        display: flex ;
        flex-direction: column;
    }
    @media (max-width: 1250px) {
        /* 1250px'den küçük ekranlar için stiller buraya yazılacak */
        #PresentationSec{
            justify-content: center  !important;
        }
        #PreRight{
            display: none;
        }
    }
    


    .d-btn-container{
       
    display: flex;
    justify-content: center;

    }
    .button.dark-single {
        --background: none;
        --rectangle: #242836;
        --success: #4bc793;
   }
    .button.white-single {
        --background: none;
        --rectangle: #f5f9ff;
        --arrow: #275efe;
        --success: #275efe;
        --shadow: rgba(10, 22, 50, .1);
   }
    .button.dark {
        --background: #242836;
        --rectangle: #1c212e;
        --arrow: #f5f9ff;
        --text: #f5f9ff;
        --success: #2f3545;
   }
    .button {
        --background: #275efe;
        --rectangle: #184fee;
        --success: #4672f1;
        --text: #fff;
        --arrow: #fff;
        --checkmark: #fff;
        --shadow: rgba(10, 22, 50, .24);
        display: flex;
        overflow: hidden;
        text-decoration: none;
        -webkit-mask-image: -webkit-radial-gradient(white, black);
        background: var(--background);
        border-radius: 8px;
        box-shadow: 0 2px 8px -1px var(--shadow);
        transition: transform 0.2s ease, box-shadow 0.2s ease;
   }
    .button:active {
        transform: scale(0.95);
        box-shadow: 0 1px 4px -1px var(--shadow);
   }
    .button ul {
        margin: 0;
        padding: 16px 40px;
        list-style: none;
        text-align: center;
        position: relative;
        backface-visibility: hidden;
        font-size: 16px;
        font-weight: 500;
        line-height: 28px;
        color: var(--text);
   }
    .button ul li:not(:first-child) {
        top: 16px;
        left: 0;
        right: 0;
        position: absolute;
   }
    .button ul li:nth-child(2) {
        top: 76px;
   }
    .button ul li:nth-child(3) {
        top: 136px;
   }
    .button > div {
        position: relative;
        width: 60px;
        height: 60px;
        background: var(--rectangle);
   }
    .button > div:before, .button > div:after {
        content: '';
        display: block;
        position: absolute;
   }
    .button > div:before {
        border-radius: 1px;
        width: 2px;
        top: 50%;
        left: 50%;
        height: 17px;
        margin: -9px 0 0 -1px;
        background: var(--arrow);
   }
    .button > div:after {
        width: 60px;
        height: 60px;
        transform-origin: 50% 0;
        border-radius: 0 0 80% 80%;
        background: var(--success);
        top: 0;
        left: 0;
        transform: scaleY(0);
   }
    .button > div svg {
        display: block;
        position: absolute;
        width: 20px;
        height: 20px;
        left: 50%;
        top: 50%;
        margin: -9px 0 0 -10px;
        fill: none;
        z-index: 1;
        stroke-width: 2px;
        stroke: var(--arrow);
        stroke-linecap: round;
        stroke-linejoin: round;
   }
    .button.loading ul {
        animation: text calc(var(--duration) * 1ms) linear forwards calc(var(--duration) * .065ms);
   }
    .button.loading > div:before {
        animation: line calc(var(--duration) * 1ms) linear forwards calc(var(--duration) * .065ms);
   }
    .button.loading > div:after {
        animation: background calc(var(--duration) * 1ms) linear forwards calc(var(--duration) * .065ms);
   }
    .button.loading > div svg {
        animation: svg calc(var(--duration) * 1ms) linear forwards calc(var(--duration) * .065ms);
   }
    @keyframes text {
        10%, 85% {
            transform: translateY(-100%);
       }
        95%, 100% {
            transform: translateY(-200%);
       }
   }
    @keyframes line {
        5%, 10% {
            transform: translateY(-30px);
       }
        40% {
            transform: translateY(-20px);
       }
        65% {
            transform: translateY(0);
       }
        75%, 100% {
            transform: translateY(30px);
       }
   }
    @keyframes svg {
        0%, 20% {
            stroke-dasharray: 0;
            stroke-dashoffset: 0;
       }
        21%, 89% {
            stroke-dasharray: 26px;
            stroke-dashoffset: 26px;
            stroke-width: 3px;
            margin: -10px 0 0 -10px;
            stroke: var(--checkmark);
       }
        100% {
            stroke-dasharray: 26px;
            stroke-dashoffset: 0;
            margin: -10px 0 0 -10px;
            stroke: var(--checkmark);
       }
        12% {
            opacity: 1;
       }
        20%, 89% {
            opacity: 0;
       }
        90%, 100% {
            opacity: 1;
       }
   }
    @keyframes background {
        10% {
            transform: scaleY(0);
       }
        40% {
            transform: scaleY(0.15);
       }
        65% {
            transform: scaleY(0.5);
            border-radius: 0 0 50% 50%;
       }
        75% {
            border-radius: 0 0 50% 50%;
       }
        90%, 100% {
            border-radius: 0;
       }
        75%, 100% {
            transform: scaleY(1);
       }
   }
    html {
        box-sizing: border-box;
        -webkit-font-smoothing: antialiased;
   }

   .content {
     position: relative;
    /* top: 50%;
    left: 50%;  */
    /* transform: translate(-50%, -50%); */
    height: 110px;
    overflow: hidden;
    font-family: 'Lato', sans-serif;
    font-size: 35px;
    line-height: 40px;
    color: #ecf0f1;
}
.content__container {
    font-weight: 600;
    /* overflow: hidden; */
    height: 40px;
    padding: 0 40px;
}
.content__container:before {
    content: '[';
    left: 0;
}
.content__container:after {
    content: ']';
    position: absolute;
    right: 0;
}
.content__container:after, .content__container:before {
    position: absolute;
    top: 0;
    color: #16a085;
    font-size: 42px;
    line-height: 40px;
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    animation-name: opacity;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}
.content__container__text {
    display: inline;
    float: left;
    margin: 0;
}
.content__container__list {
    margin-top: 0;
    padding-left: 110px;
    text-align: left;
    list-style: none;
    -webkit-animation-name: change;
    -webkit-animation-duration: 10s;
    -webkit-animation-iteration-count: infinite;
    animation-name: change;
    animation-duration: 10s;
    animation-iteration-count: infinite;
}
.content__container__list__item {
    line-height: 40px;
    margin: 0;
}
@-webkit-keyframes opacity {
    0%, 100% {
        opacity: 0;
   }
    50% {
        opacity: 1;
   }
}
@-webkit-keyframes change {
    0%, 12.66%, 100% {
        transform: translate3d(0, 0, 0);
   }
    16.66%, 29.32% {
        transform: translate3d(0, -25%, 0);
   }
    33.32%, 45.98% {
        transform: translate3d(0, -50%, 0);
   }
    49.98%, 62.64% {
        transform: translate3d(0, -75%, 0);
   }
    66.64%, 79.3% {
        transform: translate3d(0, -50%, 0);
   }
    83.3%, 95.96% {
        transform: translate3d(0, -25%, 0);
   }
}
@-o-keyframes opacity {
    0%, 100% {
        opacity: 0;
   }
    50% {
        opacity: 1;
   }
}
@-o-keyframes change {
    0%, 12.66%, 100% {
        transform: translate3d(0, 0, 0);
   }
    16.66%, 29.32% {
        transform: translate3d(0, -25%, 0);
   }
    33.32%, 45.98% {
        transform: translate3d(0, -50%, 0);
   }
    49.98%, 62.64% {
        transform: translate3d(0, -75%, 0);
   }
    66.64%, 79.3% {
        transform: translate3d(0, -50%, 0);
   }
    83.3%, 95.96% {
        transform: translate3d(0, -25%, 0);
   }
}
@-moz-keyframes opacity {
    0%, 100% {
        opacity: 0;
   }
    50% {
        opacity: 1;
   }
}
@-moz-keyframes change {
    0%, 12.66%, 100% {
        transform: translate3d(0, 0, 0);
   }
    16.66%, 29.32% {
        transform: translate3d(0, -25%, 0);
   }
    33.32%, 45.98% {
        transform: translate3d(0, -50%, 0);
   }
    49.98%, 62.64% {
        transform: translate3d(0, -75%, 0);
   }
    66.64%, 79.3% {
        transform: translate3d(0, -50%, 0);
   }
    83.3%, 95.96% {
        transform: translate3d(0, -25%, 0);
   }
}
@keyframes opacity {
    0%, 100% {
        opacity: 0;
   }
    50% {
        opacity: 1;
   }
}
@keyframes change {
    0%, 12.66%, 100% {
        transform: translate3d(0, 0, 0);
   }
    16.66%, 29.32% {
        transform: translate3d(0, -25%, 0);
   }
    33.32%, 45.98% {
        transform: translate3d(0, -50%, 0);
   }
    49.98%, 62.64% {
        transform: translate3d(0, -75%, 0);
   }
    66.64%, 79.3% {
        transform: translate3d(0, -50%, 0);
   }
    83.3%, 95.96% {
        transform: translate3d(0, -25%, 0);
   }
}