@media screen {
    body {
        overflow-x: hidden;
        background-image: url(../images/star.png);
    }
}

@media screen and (max-width:767px) {

    html,
    body {
        overflow-x: hidden;
    }
}
.portfolio-link{
    font-size: 1.2vw;
}

.headers {
    top: 33%;
    position: absolute;
    left: 32%;
    width: 34%;
    min-width: 186px;
    height: auto;
    font-family: monospace;
}

@media screen and (min-width:600px) {
    .skills {
        min-width: 519px;
    }
}

.skills {
    position: absolute;
    top: 0px;
}

.name {
    top: 12%;
    left: 31.5%;
    min-width: 50%;
    position: absolute;
    font-size: 34px;
    font-family: monospace;
}

.job {
    font-size: 1.4vw;
    margin-top: -4%;
    top: 117%;
    left: 0.5%;
    position: absolute;
    font-family: monospace;
}

.menuItem {
    margin-top: 2px;
    position: absolute;
    color: #f31065;
}

.open {
    transition: .99s ease-in-out;
}

.container {
    width: 100%;
    height: 17px;
    background-color: #ddd;
}

.bar {
    height: 100%;
    text-align: right;
    color: white;
}

.percent-90 {
    width: 90%;
    background-color: pink;
}

.percent-80 {
    width: 80%;
    background-color: pink;
}

.percent-85 {
    width: 85%;
    background-color: pink;
}

.percent-75 {
    width: 75%;
    background-color: pink;
}

.gif {
    transform: rotate(90deg) scaleY(-1);
    top: 30%;
    left: 24%;
    width: 185px;
    position: absolute;
    transition: top .99s;
}

@media screen and (max-width:420px) {
    .job {
        font-size: calc(1.2rem + 0.5vw);
        top: 64%;
        margin-top: auto;
        padding-right: 34%;
    }
}

@media screen and (min-width:420px) and (max-width: 751px) {
    .name {
        top: 12%;
        left: 31.5%;
        min-width: 100%;
        position: absolute;
        font-size: 34px;
        font-family: monospace;
    }

    .job {
        font-size: calc(1rem);
        padding-right: 30%;
        top: 58%;
        margin-top: auto;
    }
}

@media screen and (min-width:751px) and (max-width:900px) {
    .name {
        top: 12%;
    }

    .job {
        font-size: calc(1rem + 0.4vw);
        padding-right: 30%;
        top: 58%;
        margin-top: auto;
    }
}

@media screen and (min-width:900px) and (max-width:1180px) {
    .name {
        top: 12%;
    }
}