:root{
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif
}

body{
    margin: 0;
    padding: 0;
    color:white;
}
    .info{
        justify-content: center;
    }
    /* footer element */
    footer{
        padding: 30px;
        background-color:rgb(36, 36, 36);
    }
    /* Flex class for flex display */
    .flex{
        display: flex;
        gap: 0.75rem;
    }
    /* info section */

    /* All section */
    h2{
        color: orange;
    }

    /*  About Section */
    .personalInfo{
        padding: 1.5rem;
    }
        .personalInfo p{
            margin-left: 0.25rem;
        }

    .aboutInfo{
        padding: 1.5rem;
    }
        .about-us{
            margin-bottom: 2rem;
            margin-top: -2rem;
        }

    /* Support section */
    .support{
        /* width: 43rem; */
        flex-wrap: wrap;
        padding: 1.5rem;
        justify-content:space-between;
        /* align-items:center; */
    }
    .information{
        padding: 1.5rem;
    }
    .anchar{
        display:flex;
        flex-direction: column;
        gap:.5rem;
    }
        .anchar a{
            text-decoration: none;
            color: white;
        }

    .links{
        padding: 1.5rem;
    }

    /* subscribe */
    .subscribe{
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .email{
        padding: 1.5rem;
    }
    #email{
        height: 2.5rem;
        min-width: 15rem;
    }
    #submit{
        margin-top: 1rem;
        background-color: orange;
        color: white;
        padding: .5rem;
        width:50%;
        border: none;
        border-radius: 5px;
        cursor:pointer;
    }

    /* Social Icons */
    .social-account{
        /* width: 80%; */
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1rem;
    }


    @media (max-width: 60rem){
        .flex{
            flex-direction: column;
            justify-content: center;
            align-items:center;
        }
    }