﻿
/*#region Base */

.personal-split-section {
    height: 480px;
    grid-template-columns: 50% 50%;
    display: grid;
    width: 100%;
}

.personal-button {
    background-color: white !important;
    color: #00a1e4 !important;
    border: solid 0.5px #00a1e4 !important;
    border-radius: 10px !important;
    font-family: 'Gotham' !important;
    font-weight: 700 !important;
}

.personal-split-section > .info-block {
    align-items: center;
    display: inline-grid;
    padding-left: 68px;
    padding-right: 68px;
    grid-template-rows: 50% 50%;
}

    .personal-split-section > .info-block > .header {
        display: flex;
        align-items: flex-end;
        height: 100%;
        color: white;
        font-family: Gotham;
        font-size: 35px;
        line-height: normal;
        font-weight: 700;
        text-align: left;
        align-content: end;
        padding-bottom: 40px;
    }

    .personal-split-section > .info-block > .text {
        color: white;
        font-family: Gotham;
        font-size: 23px;
        line-height: normal;
        font-weight: 100;
        align-content: center;
        display: flex;
        align-items: flex-start;
        height: 100%;
    }

/*#endregion*/

/*#region Section 1*/

.personal-section-1-image {
    background-image: url('../../assets/Personal/Personal 1920.webp');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.personal-section-1-text {
    width: 100%;
    background-color: #2E51C4;
}

/*#endregion Section 1*/


/*#region Social Media*/

.personal-section-end {
    position: relative;
}

.personal-link-section {
    display: inline-flex;
    height: 100%;
}

    .personal-range-image {
        background-image: url('../../assets/Personal/Personal Range.webp');
        background-size: contain;
        background-position: center;
        background-repeat: no-repeat;
        height:400px;
    }


.personal-link-section {
    display: grid;
    width: 100%;
    height: 400px;
}

.circles {
    background-image: url(../../assets/circles.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

    .personal-link-section > .social-media-block {
        padding: 5% 10% 5% 10%;
    }

        .personal-link-section > .social-media-block > .header {
            font-family: 'Gotham';
            font-weight: 800;
            font-size: 50px;
            padding: 0 20%;
            text-align: center;
        }

        .personal-link-section > .social-media-block > .text {
            font-family: 'Gotham';
            font-size: large;
            padding: 0 20%;
            text-align: center;
            align-content: center;
        }

        .personal-link-section > .social-media-block > .button-container {
            display: flex;
            justify-content: center;
            padding: 0 30%;
        }

            .personal-link-section > .social-media-block > .button-container > .button {
                background-color: white !important;
                color: #00a1e4 !important;
                border: solid 0.5px #00a1e4 !important;
                border-radius: 10px !important;
                font-family: 'Gotham' !important;
                font-weight: 800 !important;
                height: 100%;
                font-size: 40px;
                text-align: center;
                min-width: 55%;
                padding: 0 20px;
            }

        .personal-link-section > .social-media-block > .social-media-container {
            display: flex;
            justify-content: center;
            column-gap: 20px;
        }

            .personal-link-section > .social-media-block > .social-media-container > div {
                cursor: pointer;
            }

            .personal-link-section > .social-media-block > .social-media-container > .facebook-icon {
                background-image: url('../../assets/Icons Logos/facebook.webp');
                height: 37px;
                width: 37px;
                margin-top: 30px;
            }

            .personal-link-section > .social-media-block > .social-media-container > .youtube-icon {
                background-image: url('../../assets/Icons Logos/youtube.webp');
            }

            .personal-link-section > .social-media-block > .social-media-container > .tiktok-icon {
                background-image: url('../../assets/Icons Logos/tiktok.webp');
                height: 37px;
                width: 37px;
                margin-top: 30px;
            }

.icon {
    background-color: white;
    background-repeat: no-repeat;
    background-size: contain;
}





/*#endregion*/
