/*
*
* Author :  Alyshirali
* Github :  https://github.com/shiraliali
* Twitter : https://twitter.com/alyshirali
*
*/
@import url("https://fonts.googleapis.com/css2?family=Ubuntu:wght@700&display=swap");

body,
html {
    background-color: #f9f7f5 !important;
    /* background-color: rgb(244, 244, 244); */
    height: 100%;
    margin: 0;
    overflow: hidden;
}

i {
    margin: 0.5rem;
    font-size: 1.5rem;
    transition: 0.3s;
}

i#youtube:hover {
    transform: scale(1.2);
    transition: 0.3s;
    color: crimson;
}

i#medium:hover {
    transform: scale(1.2);
    transition: 0.3s;
    color: dimgray;
}

i#email:hover {
    transform: scale(1.2);
    transition: 0.3s;
    color: cadetblue;
}

i#twitter:hover {
    transform: scale(1.2);
    transition: 0.3s;
    color: dodgerblue;
}

i#linkedin:hover {
    transform: scale(1.2);
    transition: 0.3s;
    color: blue;
}

i#github:hover {
    transform: scale(1.2);
    transition: 0.3s;
    color: purple;
}

i#stackoverflow:hover {
    transform: scale(1.2);
    transition: 0.3s;
    color: orange;
}

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

.info-section {
    padding-top: 70px;
    margin-left: 20px;
}

.social-links {
    margin-top: 25px;
    margin-left: 100px;
}

.name_farshid {
    font-family: "Ubuntu", sans-serif;
    font-size: 5rem;
    /*background: #61dafb;*/
    background: #ae1d22;
    background: -webkit-linear-gradient(to left, #ae1d22 0%, #f30f18 100%);
    background: -moz-linear-gradient(to left, #ae1d22 0%, #f30f18 100%);
    background: linear-gradient(to left, #ae1d22 0%, #f30f18 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: -5px;
}


@media (max-width: 800px) {
    .info-section {
        padding-top: 20px;
        margin-left: 20px;
    }

    .name_farshid {
        font-size: 3.5rem;
    }
}


.name_mahyar {
    font-family: "Ubuntu", sans-serif;
    font-size: 3.5rem;
    background: #61dafb;
    background: -webkit-linear-gradient(to left, #193d20 0%, #07b627 100%);
    background: -moz-linear-gradient(to left, #193d20 #fff 0%, #07b627 100%);
    background: linear-gradient(to left, #193d20 0%, #07b627 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: -5px;
    margin-top: 20%;
}

span {
    font-family: "Cario", sans-serif;
    font-weight: 100;
    font-size: 1.5rem;
    letter-spacing: 0.3em;
}

h2 {
    font-family: "Cario", sans-serif;
    letter-spacing: 0.267em;
    font-weight: 100;
    font-size: 1.2rem !important;
}

.farshid_img {
    background-image: url("mahdifarshid.png");
    height: 100vh;
    background-position: 1%;
    background-repeat: no-repeat;
    background-size: contain;
    /*-webkit-filter: drop-shadow(0px 119px 130px #61dafb);*/
    /*filter: drop-shadow(0px 119px 130px #61dafb);*/

    -webkit-filter: drop-shadow(0px 119px 130px rgba(63, 15, 24, 0.89));
    filter: drop-shadow(0px 119px 130px #580e0f);
}

.mahyar_img {
    background-image: url("mahyar_macbook2.png");
    height: 40vh;
    background-position: 1%;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-filter: drop-shadow(0px 119px 130px #61dafb);
    filter: drop-shadow(0px 119px 130px #61dafb);
}

@media screen and (max-width: 1080px) {
    .mahyar_img {
        display: none;
    }

    #mahyar {
        display: none;
    }

    #farshid {
        top: -30px;
    }

    #mahyar {
        top: -30px;
    }
}

#farshid {
    margin-top: 25px;
    margin-right: 30px;
}

#mahyar {
    margin-top: -50vh;
    margin-right: 30px;
}

.footer {
    margin-left: 50px;
    position: absolute;
    bottom: 40px;
    opacity: 0.6;
    z-index: 1000;
}

.footer > font > i {
    color: brown;
    margin: 0;
    font-size: 10px;
}

/* Media Query for Responsive Font Size */
@media (max-width: 768px) {
    .App-header {
      font-size: calc(6px + 2vmin); /* Adjust font size for smaller screens */
    }
    .name_farshid{
        font-size: 2.5rem;
    }
    h2 {
        font-size: 0.9rem !important;
    }
    .social-links {
        margin-top: 25px;
        margin-left: 20px;
    }
  }