:root {
    --red-01: #1A0404;
    --red-02: #1C0505;
    --red-03: #230605;
    --red-04: #2D0707;
    --red-05: #3A0908;
    --red-06: #4F0706;
    --red-07: #640806;
    --red-08: #7B0A07;
    --red-09: #960B06;
    --red-10: #B20C05;
    --red-11: #D00C04;
    --red-12: #FF0000;
    --red-13: #FE1A10;
    --red-14: #FB372F;
    --red-15: #FA544D;
    --red-16: #F96E69;
    --red-17: #F88784;
    --red-18: #F99D9B;
    --red-19: #EFBBBA;
    --red-20: #F2CAC9;
    --red-21: #F5D6D6;
    --red-22: #F7DFDF;
    --red-23: #F8E5E5;
    --red-24: #F9E7E7;

    --yellow-01: #161604;
    --yellow-02: #151504;
    --yellow-03: #161704;
    --yellow-04: #181804;
    --yellow-05: #1C1C04;
    --yellow-06: #222205;
    --yellow-07: #2C2C06;
    --yellow-08: #3A3B07;
    --yellow-09: #555701;
    --yellow-10: #717500;
    --yellow-11: #969A00;
    --yellow-12: #C3C900;
    --yellow-13: #FFFF00;
    --yellow-14: #F9FF30;
    --yellow-15: #FAFE59;
    --yellow-16: #F9FD75;
    --yellow-17: #F9FC7F;
    --yellow-18: #F8FB87;
    --yellow-19: #F8FA8D;
    --yellow-20: #F7F991;
    --yellow-21: #F7F894;
    --yellow-22: #F6F796;
    --yellow-23: #F6F697;
    --yellow-24: #F5F598;

    --blue-01: #050517;
    --blue-02: #040418;
    --blue-03: #040419;
    --blue-04: #05041B;
    --blue-05: #05051F;
    --blue-06: #060525;
    --blue-07: #070630;
    --blue-08: #030246;
    --blue-09: #04015E;
    --blue-10: #04007F;
    --blue-11: #0500A8;
    --blue-12: #0700DA;
    --blue-13: #0000FF;
    --blue-14: #504BFF;
    --blue-15: #7B77FE;
    --blue-16: #9D9BFE;
    --blue-17: #BBBAFA;
    --blue-18: #D1D0F9;
    --blue-19: #DFDFF9;
    --blue-20: #E8E8FA;
    --blue-21: #EDEDFA;
    --blue-22: #F0F0FB;
    --blue-23: #F1F1FB;
    --blue-24: #EFEFFA;
    
    --orange-01: #170E05;
    --orange-02: #180E04;
    --orange-03: #190F04;
    --orange-04: #1B1004;
    --orange-05: #1F1205;
    --orange-06: #251605;
    --orange-07: #301C06;
    --orange-08: #462602;
    --orange-09: #5E3301;
    --orange-10: #7F4300;
    --orange-11: #A85900;
    --orange-12: #DA7400;
    --orange-13: #FF8000;
    --orange-14: #FFAB4B;
    --orange-15: #FEBF77;
    --orange-16: #FECF9B;
    --orange-17: #FADCBA;
    --orange-18: #F9E5D0;
    --orange-19: #F9ECDF;
    --orange-20: #FAF1E8;
    --orange-21: #FAF4ED;
    --orange-22: #FBF6F0;
    --orange-23: #FBF6F1;
    --orange-24: #FBF5F0;

    --black-01: #000000;
    --black-02: #0F0C0C;
    --black-03: #100D0D;
    --black-04: #110E0E;
    --black-05: #131010;
    --black-06: #171414;
    --black-07: #1E1919;
    --black-08: #272121;
    --black-09: #342C2C;
    --black-10: #453B3B;
    --black-11: #5B4E4D;
    --black-12: #766564;
    --black-13: #948281;
    --black-14: #AC9E9E;
    --black-15: #C0B5B5;
    --black-16: #D0C8C8;
    --black-17: #D8D2D1;
    --black-18: #E2DDDD;
    --black-19: #E9E5E5;
    --black-20: #EDEAEA;
    --black-21: #F0EDED;
    --black-22: #F1EFEF;
    --black-23: #F2F0F0;
    --black-24: #F2EFEF;

    /* dark */
    --red-01-dark: #430909;
    --red-02-dark: #440b0b;
    --red-03-dark: #4c0c0a;
    --red-04-dark: #560c0c;
    --red-05-dark: #630e0c;
    --red-06-dark: #7b0a08;
    --red-07-dark: #910a07;
    --red-08-dark: #a80c08;
    --red-09-dark: #c40c06;
    --red-10-dark: #e10d04;
    --red-11-dark: #fd0f05;
    --red-12-dark: #ff2e2e;
    --red-13-dark: #e00900;
    --red-14-dark: #fa0c02;
    --red-15-dark: #fb271e;
    --red-16-dark: #f9413b;
    --red-17-dark: #f75b57;
    --red-18-dark: #f8716e;
    --red-19-dark: #e89593;
    --red-20-dark: #eaa5a3;
    --red-21-dark: #edb0b0;
    --red-22-dark: #efb9b9;
    --red-23-dark: #efc0c0;
    --red-24-dark: #f1c2c2;

    --yellow-01-dark: #3e3e0a;
    --yellow-02-dark: #3c3c0b;
    --yellow-03-dark: #3c3f0a;
    --yellow-04-dark: #40400a;
    --yellow-05-dark: #454509;
    --yellow-06-dark: #4b4b0a;
    --yellow-07-dark: #55550b;
    --yellow-08-dark: #63650b;
    --yellow-09-dark: #838600;
    --yellow-10-dark: #9da300;
    --yellow-11-dark: #c3c800;
    --yellow-12-dark: #f0f700;
    --yellow-13-dark: #ffff2e;
    --yellow-14-dark: #f8ff02;
    --yellow-15-dark: #faff2a;
    --yellow-16-dark: #f9fe46;
    --yellow-17-dark: #f9fd50;
    --yellow-18-dark: #f7fb59;
    --yellow-19-dark: #f7fa5f;
    --yellow-20-dark: #f5f864;
    --yellow-21-dark: #f5f767;
    --yellow-22-dark: #f4f56a;
    --yellow-23-dark: #f4f46b;
    --yellow-24-dark: #f3f36d;

    --blue-01-dark: #0c0c3d;
    --blue-02-dark: #0a0a40;
    --blue-03-dark: #0a0a41;
    --blue-04-dark: #0c0944;
    --blue-05-dark: #0b0b47;
    --blue-06-dark: #0c0a4e;
    --blue-07-dark: #0c0a5a;
    --blue-08-dark: #040274;
    --blue-09-dark: #05008d;
    --blue-10-dark: #0500ad;
    --blue-11-dark: #0600d6;
    --blue-12-dark: #1109ff;
    --blue-13-dark: #2e2eff;
    --blue-14-dark: #231dff;
    --blue-15-dark: #4e48ff;
    --blue-16-dark: #6f6cff;
    --blue-17-dark: #908ef8;
    --blue-18-dark: #a8a6f5;
    --blue-19-dark: #b8b8f3;
    --blue-20-dark: #c2c2f3;
    --blue-21-dark: #c8c8f1;
    --blue-22-dark: #cbcbf2;
    --blue-23-dark: #cdcdf1;
    --blue-24-dark: #cbcbf0;

    --orange-01-dark: #3d250c;
    --orange-02-dark: #40250a;
    --orange-03-dark: #41270a;
    --orange-04-dark: #442809;
    --orange-05-dark: #47290b;
    --orange-06-dark: #4e2e0a;
    --orange-07-dark: #5a340a;
    --orange-08-dark: #743e02;
    --orange-09-dark: #8d4c00;
    --orange-10-dark: #ad5b00;
    --orange-11-dark: #d67100;
    --orange-12-dark: #ff8c09;
    --orange-13-dark: #ff972e;
    --orange-14-dark: #ff961d;
    --orange-15-dark: #ffaa48;
    --orange-16-dark: #ffb96c;
    --orange-17-dark: #f8c68e;
    --orange-18-dark: #f5cfa6;
    --orange-19-dark: #f3d5b8;
    --orange-20-dark: #f3dac2;
    --orange-21-dark: #f1dec8;
    --orange-22-dark: #f2e0cb;
    --orange-23-dark: #f1dfcd;
    --orange-24-dark: #f2ddcb;

    --black-01-dark: #171616;
    --black-02-dark: #292020;
    --black-03-dark: #2a2121;
    --black-04-dark: #2b2222;
    --black-05-dark: #2d2424;
    --black-06-dark: #302828;
    --black-07-dark: #382d2d;
    --black-08-dark: #413535;
    --black-09-dark: #4e4040;
    --black-10-dark: #5f4e4e;
    --black-11-dark: #766160;
    --black-12-dark: #917977;
    --black-13-dark: #7f6968;
    --black-14-dark: #998383;
    --black-15-dark: #ad9a9a;
    --black-16-dark: #bcaeae;
    --black-17-dark: #c4b9b7;
    --black-18-dark: #cec3c3;
    --black-19-dark: #d5cbcb;
    --black-20-dark: #d9d0d0;
    --black-21-dark: #dcd3d3;
    --black-22-dark: #dcd6d6;
    --black-23-dark: #ddd7d7;
    --black-24-dark: #ded5d5;
    /* alpha 80 */
    --red-01-80: #1a040480;
    --red-02-80: #1c050580;
    --red-03-80: #23060580;
    --red-04-80: #2d070780;
    --red-05-80: #3a090880;
    --red-06-80: #4f070680;
    --red-07-80: #64080680;
    --red-08-80: #7b0a0780;
    --red-09-80: #960b0680;
    --red-10-80: #b20c0580;
    --red-11-80: #d00c0480;
    --red-12-80: #ff000080;
    --red-13-80: #fe1a1080;
    --red-14-80: #fb372f80;
    --red-15-80: #fa544d80;
    --red-16-80: #f96e6980;
    --red-17-80: #f8878480;
    --red-18-80: #f99d9b80;
    --red-19-80: #efbbba80;
    --red-20-80: #f2cac980;
    --red-21-80: #f5d6d680;
    --red-22-80: #f7dfdf80;
    --red-23-80: #f8e5e580;
    --red-24-80: #f9e7e780;

    --yellow-01-80: #16160480;
    --yellow-02-80: #15150480;
    --yellow-03-80: #16170480;
    --yellow-04-80: #18180480;
    --yellow-05-80: #1c1c0480;
    --yellow-06-80: #22220580;
    --yellow-07-80: #2c2c0680;
    --yellow-08-80: #3a3b0780;
    --yellow-09-80: #55570180;
    --yellow-10-80: #71750080;
    --yellow-11-80: #969a0080;
    --yellow-12-80: #c3c90080;
    --yellow-13-80: #ffff0080;
    --yellow-14-80: #f9ff3080;
    --yellow-15-80: #fafe5980;
    --yellow-16-80: #f9fd7580;
    --yellow-17-80: #f9fc7f80;
    --yellow-18-80: #f8fb8780;
    --yellow-19-80: #f8fa8d80;
    --yellow-20-80: #f7f99180;
    --yellow-21-80: #f7f89480;
    --yellow-22-80: #f6f79680;
    --yellow-23-80: #f6f69780;
    --yellow-24-80: #f5f59880;

    --blue-01-80: #05051780;
    --blue-02-80: #04041880;
    --blue-03-80: #04041980;
    --blue-04-80: #05041b80;
    --blue-05-80: #05051f80;
    --blue-06-80: #06052580;
    --blue-07-80: #07063080;
    --blue-08-80: #03024680;
    --blue-09-80: #04015e80;
    --blue-10-80: #04007f80;
    --blue-11-80: #0500a880;
    --blue-12-80: #0700da80;
    --blue-13-80: #0000ff80;
    --blue-14-80: #504bff80;
    --blue-15-80: #7b77fe80;
    --blue-16-80: #9d9bfe80;
    --blue-17-80: #bbbafa80;
    --blue-18-80: #d1d0f980;
    --blue-19-80: #dfdff980;
    --blue-20-80: #e8e8fa80;
    --blue-21-80: #ededfa80;
    --blue-22-80: #f0f0fb80;
    --blue-23-80: #f1f1fb80;
    --blue-24-80: #efeffa80;

    --orange-01-80: #170e0580;
    --orange-02-80: #180e0480;
    --orange-03-80: #190f0480;
    --orange-04-80: #1b100480;
    --orange-05-80: #1f120580;
    --orange-06-80: #25160580;
    --orange-07-80: #301c0680;
    --orange-08-80: #46260280;
    --orange-09-80: #5e330180;
    --orange-10-80: #7f430080;
    --orange-11-80: #a8590080;
    --orange-12-80: #da740080;
    --orange-13-80: #ff800080;
    --orange-14-80: #ffab4b80;
    --orange-15-80: #febf7780;
    --orange-16-80: #fecf9b80;
    --orange-17-80: #fadcba80;
    --orange-18-80: #f9e5d080;
    --orange-19-80: #f9ecdf80;
    --orange-20-80: #faf1e880;
    --orange-21-80: #faf4ed80;
    --orange-22-80: #fbf6f080;
    --orange-23-80: #fbf6f180;
    --orange-24-80: #fbf5f080;

    --black-01-80: #00000080;
    --black-02-80: #0f0c0c80;
    --black-03-80: #100d0d80;
    --black-04-80: #110e0e80;
    --black-05-80: #13101080;
    --black-06-80: #17141480;
    --black-07-80: #1e191980;
    --black-08-80: #27212180;
    --black-09-80: #342c2c80;
    --black-10-80: #453b3b80;
    --black-11-80: #5b4e4d80;
    --black-12-80: #76656480;
    --black-13-80: #94828180;
    --black-14-80: #ac9e9e80;
    --black-15-80: #c0b5b580;
    --black-16-80: #d0c8c880;
    --black-17-80: #d8d2d180;
    --black-18-80: #e2dddd80;
    --black-19-80: #e9e5e580;
    --black-20-80: #edeaea80;
    --black-21-80: #f0eded80;
    --black-22-80: #f1efef80;
    --black-23-80: #f2f0f080;
    --black-24-80: #f2efef80;

    --red-01-dark-80: #43090980;
    --red-02-dark-80: #440b0b80;
    --red-03-dark-80: #4c0c0a80;
    --red-04-dark-80: #560c0c80;
    --red-05-dark-80: #630e0c80;
    --red-06-dark-80: #7b0a0880;
    --red-07-dark-80: #910a0780;
    --red-08-dark-80: #a80c0880;
    --red-09-dark-80: #c40c0680;
    --red-10-dark-80: #e10d0480;
    --red-11-dark-80: #fd0f0580;
    --red-12-dark-80: #ff2e2e80;
    --red-13-dark-80: #e0090080;
    --red-14-dark-80: #fa0c0280;
    --red-15-dark-80: #fb271e80;
    --red-16-dark-80: #f9413b80;
    --red-17-dark-80: #f75b5780;
    --red-18-dark-80: #f8716e80;
    --red-19-dark-80: #e8959380;
    --red-20-dark-80: #eaa5a380;
    --red-21-dark-80: #edb0b080;
    --red-22-dark-80: #efb9b980;
    --red-23-dark-80: #efc0c080;
    --red-24-dark-80: #f1c2c280;

    --yellow-01-dark-80: #3e3e0a80;
    --yellow-02-dark-80: #3c3c0b80;
    --yellow-03-dark-80: #3c3f0a80;
    --yellow-04-dark-80: #40400a80;
    --yellow-05-dark-80: #45450980;
    --yellow-06-dark-80: #4b4b0a80;
    --yellow-07-dark-80: #55550b80;
    --yellow-08-dark-80: #63650b80;
    --yellow-09-dark-80: #83860080;
    --yellow-10-dark-80: #9da30080;
    --yellow-11-dark-80: #c3c80080;
    --yellow-12-dark-80: #f0f70080;
    --yellow-13-dark-80: #ffff2e80;
    --yellow-14-dark-80: #f8ff0280;
    --yellow-15-dark-80: #faff2a80;
    --yellow-16-dark-80: #f9fe4680;
    --yellow-17-dark-80: #f9fd5080;
    --yellow-18-dark-80: #f7fb5980;
    --yellow-19-dark-80: #f7fa5f80;
    --yellow-20-dark-80: #f5f86480;
    --yellow-21-dark-80: #f5f76780;
    --yellow-22-dark-80: #f4f56a80;
    --yellow-23-dark-80: #f4f46b80;
    --yellow-24-dark-80: #f3f36d80;

    --blue-01-dark-80: #0c0c3d80;
    --blue-02-dark-80: #0a0a4080;
    --blue-03-dark-80: #0a0a4180;
    --blue-04-dark-80: #0c094480;
    --blue-05-dark-80: #0b0b4780;
    --blue-06-dark-80: #0c0a4e80;
    --blue-07-dark-80: #0c0a5a80;
    --blue-08-dark-80: #04027480;
    --blue-09-dark-80: #05008d80;
    --blue-10-dark-80: #0500ad80;
    --blue-11-dark-80: #0600d680;
    --blue-12-dark-80: #1109ff80;
    --blue-13-dark-80: #2e2eff80;
    --blue-14-dark-80: #231dff80;
    --blue-15-dark-80: #4e48ff80;
    --blue-16-dark-80: #6f6cff80;
    --blue-17-dark-80: #908ef880;
    --blue-18-dark-80: #a8a6f580;
    --blue-19-dark-80: #b8b8f380;
    --blue-20-dark-80: #c2c2f380;
    --blue-21-dark-80: #c8c8f180;
    --blue-22-dark-80: #cbcbf280;
    --blue-23-dark-80: #cdcdf180;
    --blue-24-dark-80: #cbcbf080;

    --orange-01-dark-80: #3d250c80;
    --orange-02-dark-80: #40250a80;
    --orange-03-dark-80: #41270a80;
    --orange-04-dark-80: #44280980;
    --orange-05-dark-80: #47290b80;
    --orange-06-dark-80: #4e2e0a80;
    --orange-07-dark-80: #5a340a80;
    --orange-08-dark-80: #743e0280;
    --orange-09-dark-80: #8d4c0080;
    --orange-10-dark-80: #ad5b0080;
    --orange-11-dark-80: #d6710080;
    --orange-12-dark-80: #ff8c0980;
    --orange-13-dark-80: #ff972e80;
    --orange-14-dark-80: #ff961d80;
    --orange-15-dark-80: #ffaa4880;
    --orange-16-dark-80: #ffb96c80;
    --orange-17-dark-80: #f8c68e80;
    --orange-18-dark-80: #f5cfa680;
    --orange-19-dark-80: #f3d5b880;
    --orange-20-dark-80: #f3dac280;
    --orange-21-dark-80: #f1dec880;
    --orange-22-dark-80: #f2e0cb80;
    --orange-23-dark-80: #f1dfcd80;
    --orange-24-dark-80: #f2ddcb80;

    --black-01-dark-80: #17161680;
    --black-02-dark-80: #29202080;
    --black-03-dark-80: #2a212180;
    --black-04-dark-80: #2b222280;
    --black-05-dark-80: #2d242480;
    --black-06-dark-80: #30282880;
    --black-07-dark-80: #382d2d80;
    --black-08-dark-80: #41353580;
    --black-09-dark-80: #4e404080;
    --black-10-dark-80: #5f4e4e80;
    --black-11-dark-80: #76616080;
    --black-12-dark-80: #91797780;
    --black-13-dark-80: #7f696880;
    --black-14-dark-80: #99838380;
    --black-15-dark-80: #ad9a9a80;
    --black-16-dark-80: #bcaeae80;
    --black-17-dark-80: #c4b9b780;
    --black-18-dark-80: #cec3c380;
    --black-19-dark-80: #d5cbcb80;
    --black-20-dark-80: #d9d0d080;
    --black-21-dark-80: #dcd3d380;
    --black-22-dark-80: #dcd6d680;
    --black-23-dark-80: #ddd7d780;
    --black-24-dark-80: #ded5d580;
}

* {
    margin: 0;
    padding: 0;
    scroll-behavior: smooth;
    scrollbar-width: none;
}

a {
    text-decoration: inherit;
    color: inherit;
}

[hidden] {
    display: none!important;
}

.top {
    background-color: #000000;
    width: 40px;
    height: 40px;
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    bottom: 10px;
    right: 0;
    cursor: pointer;
}

.top i {
    font-size: 25px;
    color: #ffffff;
}

#go-top {
    opacity: 0;
    visibility: hidden;
    transition: 0.3s ease;
    transform: translateY(10px);
}

#go-top.show {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.container {
    width: 95%;
    margin: 0 auto;
}

body {
    background: linear-gradient(to top left, var(--orange-10), var(--orange-05));
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

/* start nav */
nav {
    padding: 10px 0;
    position: absolute;
    width: 100%;
    z-index: 100;
}

.nav-container {
    width: 95%;
    margin: 0 auto;
}

.nav-content {
    background: var(--black-10-80);
    backdrop-filter: blur(1px);
    box-shadow: 0px 0px 25px -5px rgba(0, 0, 0, 0.7);
    padding: 20px 30px;
    border-radius: 20px;
    transition: 0.3s;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* .nav-img {
    width: 15%;
    display: flex;
    align-items: center;
}

.nav-img img{
    width: 50px;
    border-radius: 100%;
} */

.mobile-nav-links {
    display: none;
}

.mobile-nav-link {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 25px;
    color: #ffffff;
}

.nav-links {
    /* background: var(--black-09-80); */
    /* backdrop-filter: blur(1px); */
    /* width: 50%; */
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    border: 1px solid var(--black-06);
    border-radius: 50px;
    list-style-type: none;
    color: #ffffff;
}

.nav-links>li>a {
    padding: 5px 10px;
    display: block;
    border-radius: 25px;
    font-weight: 500;
    transition-duration: .5s;
}

.nav-links>li:hover>a{
    background: var(--black-09);
    transform: translateY(-2px) translateX(-2px);
    cursor: pointer;
}

.nav-btns {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 25px;
}

.active {
    color: var(--red-09);
}
/* end nav */

/* start header */
header {
    height: 100vh;    
}

.header-box {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
}

.header-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    padding-top: 150px;
    height: 100%;
}

.header-info {
    width: 50%;
}

.header-img {
    width: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.header-img img {
    width: 50%;
    border-radius: 100%;
}

.header-btns {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 50px;
    /* padding: 50px 0; */
    width: 100%;
}
/* end header */

/* start skills */
.skills {
    /* background: var(--black-07); */
    padding: 50px 0;
}

.skills-content {
    display: flex;
    justify-content: space-between;
}

.skills-text {
    width: 40%;
}

.move {
    position: sticky;
    top: .5px;
}

.skills-items {
    width: 60%;
    list-style-type: none;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.skills-items>li {
    width: 28%;
    padding: 15px 5px;
    background-color: #ffffff;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: all .5s ease-in;
    cursor: pointer;
}
.skills-items>li .svg-size {
    width: 60%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.skills-items>li .svg-size svg {
    width: 100%;
    fill: var(--orange-13);
}

.skills-items>li p {
    font-weight: 900;
}

.skills-items>li:hover {
    box-shadow: 0px 0px 10px 2px #ffffff80;
}
/* end skills */

/* start projects */
.projects {
    padding: 100px 0;
    /* background: var(--orange-07); */
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.projects-content {
    color: #ffffff;
}

.projects-warper {
    /* margin-top: 100px; */
    position: relative;
    width: 100%;
    height: 10px;
    overflow: hidden;
    border-radius: 0 0 25px 25px;
    box-shadow: 0px 20px 20px -20px var(--black-01-80);
}

.projects-warper::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 53%;
    background: linear-gradient(to bottom, transparent 20%, var(--orange-10));
    border-radius: 0 25px 25px 0;
    pointer-events: all;
}

.projects-items {
    margin-top: 100px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.projects-item {
    width: 24%;    
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    transition-duration: .5s;
    border-radius: 25px;
    cursor: pointer;
}

.projects-item-image {
    width: 100%;
    display: flex;
    align-items: center;
}

.projects-item-image img {
    width: 100%;
}

.projects-item-name {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--orange-07-80)!important;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: all .5s ease-in-out;
}

.projects-item:hover .projects-item-name {
    opacity: 1;
}

.projects-btns {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 100px;
}
/* end projects */

/* start about me */
.about-me {
    padding: 50px 0;
}

.about-me-content {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.about-me-texts {
    display: flex;
    justify-content: center;
    color: #ffffff;
    text-shadow: 0px 0px 5px #000000;
    margin: 50px 0;
}

.about-me-texts p {
    font-size: 20px;
    font-weight: 400;
    width: 85%;
    line-height: 1.5;
}

.about-me-btns {
    display: flex;
    justify-content: center;
    gap: 50px;
}
/* end about me */

/* start contact me */
.contact-me {
    padding: 100px 0;
}

.contact-me-content {
    display: flex;
    flex-direction: column;
    align-items: space-between;
    justify-content: center;
}

.contact-me-items {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 100px;
}

.contact-me-right {
    width: 40%;
}

.contact-me-right form {
    padding: 25px;
    background-color: var(--black-08);
    border-radius: 15px;
}

.contact-me-form-inputs {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
}

.contact-me-form-input-btn {
    margin-top: 15px;
    display: flex;
    justify-content: flex-start;
}

.contact-me-left {
    width: 45%;
    padding: 25px 0;
}

.contact-info {
    list-style-type: none;
}

.contact-info>li {
    display: flex;
    flex-direction: column;
    margin-bottom: 50px;
}

.contact-info-title {
    display: flex;
    align-items: baseline;
    font-weight: 700;
    color: #ffffff;
    font-size: 20px;
    gap: 5px;
    margin-bottom: 10px;
}

.contact-info-title>i {
    font-size: 25px;
}

.contact-info-text {
    display: flex;
    justify-content: flex-end;
    color: var(--black-14);
    font-weight: 600;
    direction: ltr;
}
/* end contact me */

/* start donate */
.donate-me {
    background: var(--orange-09-dark);
    padding: 50px 0;
}

.donate-me-content {
    display: flex;
    align-items: center;
    flex-direction: column;
}

.donate-me-content>p {
    display: block;
    font-size: 22px;
    font-weight: 800;
    color: #ffffff;
    text-shadow: 0px 0px 5px #000000;
}

.donate-me-btns {
    margin-top: 45px;
}
/* end donate */

/* start faq */
.faq {
    background-color: none;
}

.faq-content {
    background-color: none;
}
/* end faq */

/* start footer */
footer {
    background: var(--orange-04);
    box-shadow: 0px -2px 10px 2px #00000080;
    color: #ffffff;
}

.footer-content {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: space-between;
    padding: 50px 0;
    position: relative;
}

.footer-brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 50%;
}

.footer-brand-image {
    display: flex;
    justify-content: center;
    align-items: center;
}
.footer-brand-image img {
    width: 100px;
}

.footer-brand-text {
    margin-top: 25px;
    text-align: center;
    width: fit-content;
}

.footer-help-list {
    list-style-type: none;
}

.footer-help-list>li {
    width: fit-content;
    margin: 10px 0;
}

.footer-help-text .text-info-title {
    font-size: 25px;
}

.footer-help {
    display: flex;
    flex-direction: column;
}

.footer-work-list {
    list-style-type: square;
    list-style-position: inside;
}

.footer-work-list>li {
    width: fit-content;
    margin: 10px 0;
}

.footer-work-text .text-info-title {
    font-size: 25px;
}

.footer-work {
    display: flex;
    flex-direction: column;
}

.footer-icon-items {
    display: flex;
    flex-direction: column;
}

.footer-social-icons {
    display: flex;
    justify-content: space-between;
}

.footer-social-text .text-info-title {
    font-size: 25px;
}

.footer-social-icon {
    margin: 10px 0;
    display: block;
    width: fit-content;
    border: 1px solid #ffffff;
    background-color: #ffffff;
    border-radius: 15px;
    transition: all .5s ease;
}

.footer-social-icon i {
    width: 35px;
    height: 35px;
    display: flex;
    padding: 5px;
    justify-content: center;
    align-items: center;
    border-radius: 15px;
    font-size: 30px;
}

.footer-social-icon a {
    display: block;
    width: fit-content;
}

.footer-social-icon.f-s-i-t {
    background-color: #15a9ff;
    border-color: #15a9ff;
}

.footer-social-icon.f-s-i-i {
    background: #dc2743;
    border-color: #dc2743;
    
}

.footer-social-icon.f-s-i-d {
    border-color: #5662f6;
    background-color: #5662f6;
}

.footer-social-icon.f-s-i-g{
    border-color: var(--orange-12);
    background-color: var(--orange-12);
}

.footer-trust-icons {
    display: flex;
    justify-content: space-between;
}
.footer-trust-icon {
    margin: 10px 0;
    display: block;
    width: fit-content;
    border: 1px solid var(--orange-12);
    background-color: var(--orange-12);
    border-radius: 15px;
    transition: all .5s ease;
}

.footer-trust-icon img {
    width: 35px;
    height: 35px;
    display: flex;
    padding: 5px;
    justify-content: center;
    align-items: center;
    border-radius: 15px;
}

.footer-social-icon:hover {
    transform: translateY(-4px) translateX(-4px);
}

.footer-trust-icon:hover {
    transform: translateY(-4px) translateX(-4px);
}

.footer-bottom {
    border-top: 1px solid var(--orange-10);
    padding: 10px 0;
}

.footer-bottom-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-copy>p{
    font-size: 16px;
    font-weight: 900;
}

.footer-mahi>p {
    font-size: 16px;
    font-weight: 900;
}
/* end footer */