﻿.content-top {
    position:absolute;
    top:8%;
    left:4%;
    width:94%;
}

.content-bottom {
    position: absolute;
    bottom: 15%;
    left: 4%;
}

.tp {
    position: absolute;
    bottom: 10%;
    left:50%;
    transform:translateX(-50%);
}

.gs {
    position: absolute;
    bottom: 0px;
    left: 50%;
    transform: translateX(-50%);
}

.gs a {
    padding:10px 50px;
    font-size:22px;
}

h1, .sec-main h2, .sec-main h3 {
    font-family: var(--font-h);
    font-weight: 400;
    line-height: 1em;
    color: var(--white);
}

h1 {
    font-size: 60px;
}

.sec-main h2 {
    font-size: 32px;
}

.sec-main h3 {
    font-size: 28px;
}

.btn-green-b {
    background:linear-gradient(90deg,#0bfe00,#000000);
    color:var(--white);
}

.about-h4 {
    font-size:32px;
    font-weight:500;
    background:var(--grey-to-black);
}

.about-h4.sweep-text-5 {
    background: linear-gradient(90deg,#555555,#000000,#000000,#ffffff);
}

.mkt-box {
    border:solid 1px #a6a6a6;
    border-radius:30px;
    text-align:left;
    min-height:200px;
    padding:15px;
}

.about-left {
    width: 32%;
}

.about-right {
    flex-grow:1;
    display: flex;
    flex-direction: column;
    height: auto; /* Or a fixed height if you prefer */
}

.about-right-half {
    display: flex;
    flex: 1; /* This makes them each take up 50% of the parent's width */
}

.about-right-top {
    flex:1;
}

.about-right-bottom-left {
    width:36%;
}

.about-right-bottom-right {
    flex-grow:1;
}

.mkt-box h3 {
    font-family:var(--font-h);
    font-size: 72px;
    font-weight: 400;
    line-height: 1em;
}

.mkt-box h5 {
    font-size:44px;
    font-weight:500;
    line-height:1em;
}

.mkt-box h5 span {
    font-weight: 300;
    display:block;
}

.mkt-box p {
    font-size:18px;
    font-weight:300;
    line-height:1em;
}

.mkt-box p.big {
    font-size: 20px;
}

.about-left img {
    width:70%;
}

.about-blue, .btn-blue {
    background:linear-gradient(90deg,#000000,#3533cd,#00c2ff);
}

.about-orange {
    background:linear-gradient(180deg,#000000,#ff4500,#fe8216,#fdaa63);
}

.about-right-bottom-right h3, .about-glance .about-h4 {
    background:linear-gradient(90deg,#0bfe00,#ffffff);
}

.about-right-bottom-right img {
    width: 60%;
}

.about-edge .container {
    position:absolute;
    width:90%;
    height:100%;
    top:0%;
    left:5%;
}

.about-edge h3 {
    background: linear-gradient(85.3706deg, rgb(51, 114, 227) 27.9874%, rgb(255, 0, 0) 100%);
    font-size:48px;
    font-weight:500;
}

.prd-acc-comp {
    padding-top:60px;
    padding-bottom:0px;
}

.about-h5 {
    font-size: 24px;
    font-weight: 600;
    line-height: 1em;
}

.about-glance .h-100 {
    border:solid 1px #545454;
}

.about-img div {
    flex-basis:28%;
    text-align:center;
}

.about-img img {
    width:75%;
}

.about-img .img-small {
    flex-basis:16%;
}

.about-img .img-small img {
    max-width: 90px;
}

@media (min-width:1600px) {
    .gs a {
        font-size:26px;
    }

    .about-edge .container {
        padding-top:190px;
    }

    .mh-700 {
        min-height:700px;
    }

    .about-h5 {
        font-size:28px;
    }

    .mh-700 p {
        font-size:18px;
    }
}

@media (max-width:1199.98px) {
    .gs a {
        font-size: 18px;
    }

    .about-left {
        width:100%;
    }
}

@media (max-width:1099.98px) {
    .gs a {
        font-size: 14px;
    }
}

@media (max-width:991.98px) {
    h1 {
        font-size:40px;
    }

    .sec-main {
        padding-bottom:0px;
    }

    .sec-main h2 {
        font-size: 24px;
    }

    .sec-main h3 {
        font-size: 20px;
    }

    .tp svg:first-child{
        width:92px;
        height:22px;
    }

    .tp svg:nth-child(2) {
        width: 107px;
        height: 20px;
    }

    .gs a {
        padding:5px 30px;
    }

    .mkt-box h3 {
        font-size: 54px;
    }
    
    .about-edge .container {
        padding-top:60px;
        padding-bottom:60px;
    }

    .about-edge h3 {
        font-size:40px;
    }

    .about-right-bottom-left {
        width: 42%;
    }
}

@media (max-width:575.98px) {
    h1, .about-edge h3 {
        font-size:24px;
        text-align:center;
    }

    .content-top {
        flex-direction:column;
        align-items:center!important;
    }

    .content-top .d-flex {
        justify-content:center;
        margin-right:0px!important;
    }

    .content-top a, .about-edge a, .btn-sleeker {
        font-size:14px;
        padding:5px 20px;
    }

    .content-bottom {
        display:none;
    }

    .sec-main h3 {
        font-size: 18px;
        margin-top: 1rem;
    }

    .sec-main h3 br, h1 br {
        display:none;
    }

    .tp svg:first-child {
        width: 64px;
        height: 15px;
    }

    .tp svg:nth-child(2) {
        width: 72px;
        height: 14px;
    }

    .gs {
        bottom:-10px;
    }

    .about-h4, .mkt-box h5 {
        font-size:24px;
    }

    .mkt-box {
        min-height:150px;
    }

    .mkt-box h3 {
        font-size:36px;
    }

    .mkt-box p {
        font-size:14px;
    }

    .mkt-box p.big {
        font-size: 16px;
    }

    .about-left img {
        width:80%;
    }

    .about-right-half {
        flex-direction:column;
    }

    .about-right-bottom-left {
        width:100%;
    }

    .about-edge .container {
        align-items:center!important;
    }

    .prd-acc-comp {
        padding: 50px 0px;
    }

    .about-img div {
        flex-basis:50%;
    }
}

@media (max-width:575.98px) {
    h1, .about-edge h3 {
        font-size: 22px;
    }

    .sec-main h3 {
        font-size: 16px;
    }
}