:root {
    --color-font: #212529;
    --color-blue-python: #4989BB;
    --color-white: #e0e0e0;
    --color-yelow-python: #F6BA08;
    --color-background-home: rgb(48, 47, 47);
    --color-background-home1: rgb(71, 71, 71);
    --height-page: 100vh;
    --font-text-long: 1.4rem;
    --font-text-title: 3rem;
    --font-text-list: 1.2rem;
    --subtitle-github: 1.1rem;
}
html body {
    height: var(--height-page);
    background-color: var(--color-background-home);
}

/* header */
#twitter-png {
    width: 50px;
    margin-left: -10px;
}
#kaggle-svg {
    width: 25px;
    height: 25px;
}
#pdf-svg {
    width: 30px;
    margin-left: -10px;
}
.photo {
    width: 30px;
    height: 30px;
    border-radius: 50px;
    margin-right: 10px;
}
#python {
    color: var(--color-blue-python);
}
.align-menu {
    display: inline-block;
    margin-right: 10px;
    margin-top: 10px;
}
#portfolio {
    color: var(--color-yelow-python);
}
/* header-end */

/* index */
#text-title-home {
    font-size: 2rem;
    margin-top: 50px;
    text-align: center;
}
#text-work-home {
    font-size: 1.1rem;
    margin-top: -12px;
    color:  var(--color-yelow-python);
    text-align: center;
}
#text-phrase-home {
    margin-top: 80px;
    font-size: 3.2rem;
    text-align: center;
}
#image-home {
    width: 15%;
}
#image-python-home {
    margin: auto;
}
/* index-end */

/* projects */
#text-title-projects {
    font-size: var(--font-text-title);
    margin-top: 50px;
}
#text-phrase-projects {
    margin-top: 10px;
    font-size: var(--font-text-long);
}
#list-projects {
    margin-top: 70px;
}
#list-color {
    background-color: var(--color-background-home);
}
#color-bnt {
    background-color: var(--color-yelow-python);
}
.image-python-projects {
    margin-top: -5px;
    width: 25px;
    margin-left: -10px;
}
#margin-top-list {
    margin-top: 2px;
}
#margin-top-text {
    margin-top: 10px;
}
/* projects-end */

/* project-base */
#title-project-base {
    font-size: var(--font-text-title);
}
#text-phrase-project-base {
    font-size: var(--font-text-long);
    margin-top: 60px;
}
#margin-image-project-base {
    margin-top: 20px;
}
#subtitle-project-base {
    font-size: var(--font-text-long);
}
#text-list-project-base {
    font-size: var(--font-text-list);
    margin-top: 0px;
}
#text-phrase-project-base-objective {
    margin-top: 0px;
    font-size: var(--font-text-long);
}
#color-link-github {
    color: var(--color-yelow-python);
}
#color-bnt-project-base {
    background-color: var(--color-yelow-python);
}
#subtitle-project-base-github {
    font-size: var(--subtitle-github);
}
/* project-base-end */

/*graphics */
#text-title-graphic {
    font-size: var(--font-text-title);
}
#image-card-graphic {
    margin: auto;
}
#card-graphic {
    background-color: var(--color-background-home);
    font-size: 1.5rem;
}
#text-phrase-graphic {
    font-size: var(--font-text-long);
}
#font-size-card-graphic {
    font-size: 1.4rem;
    text-align: center;
}
#underline {
    text-decoration: none;
    color: var(--color-white);
}
#card-graphic:hover {
     background-color: var(--color-background-home1);
}
/* graphics-end */

/* graphic01 */
#text-title-graphic {
    font-size: var(--font-text-title);
}
#text-phrase-graphic {
    font-size: var(--font-text-long);
}
#color-bnt-graphic {
    background-color: var(--color-yelow-python);
}
#img-graphic {
    margin-top: 70px;
    width: 100%;
}
#text-obs-graphic {
    font-size: var(--font-text-long);
    color: var(--color-yelow-python);
}
#img-graphic-slide {
    margin-top: 70px;
    width: 100%;
}
/* graphic01-end */

/* skills */
#title-skills {
    font-size: var(--font-text-title);
}
#title-card-skills {
    font-size:var(--font-text-long);
}
#card-top-skills {
    background-color: var(--color-background-home);
}   
.image-skills {
    margin-left: 25px; 
    width: 30px;
}                     
.card-width-height-skills {
    width:75px;
    height: 40px;
    display: inline-block;
}
#img-photoshop {
    width:80px;
}
.margin-bottom-skills {
    margin-bottom: 5px;
}

/* skills-end */

/* contacts */
#text-title-contacts {
    font-size: var(--font-text-title);
}
/* contacts */

/* About */

#photo-carlos {
    width: 100px;
    height: 100px;
    border-radius: 50px;
}
.img-center {
    margin-top: 50px;
    text-align: center;
}
#text-phrase-about {
    margin-top: 30px;
    font-size: var(--font-text-long);
}
#about-background {
    background-color: var(--color-background-home);
}
/* About-end */


@media (max-width: 1200px) {

    /* index */
    #text-title-home {
        font-size: 2.5rem;
    }
    #text-work-home {
        font-size: 1.5rem;
    }
    #text-phrase-home {
        margin-top: 30px;
        font-size: 3rem;
    }     
    #image-home {
        width: 100%;
    }
    /* index-end */

    /* projects */

    #text-title-projects {
        margin-top: 20px;
        text-align: center;
    }
    #list-projects {
        margin-top: -30px;
    }

    /* projects-end */

    /* project-base */

    #title-project-base {
        margin-top: -30px;
    }
    #text-phrase-project-base {
        font-size: var(--font-text-long);
        margin-top: -40px;
    }
    #margin-image-project-base {
        margin-top: -20px;
    }

    /* project-base-end */

    /*graphics */

    #text-title-graphic {
        font-size: var(--font-text-title);
        text-align: center;
        margin-top: -30px;
    }
    #text-phrase-graphic {
        font-size: var(--font-text-long);
    }
    #margin-cards {
        margin-top: -100px;
    }

    /* graphics-end */

    /* graphic01 */

    #text-title-graphic01 {
        font-size: var(--font-text-title);
        margin-top: -20px;
        text-align: center;
    }
    #img-center-graphic01 {
        margin-top: -40px;
    }
    #img-graphic {
        margin-top: -30px;
    }
    #img-graphic-slide {
        margin-top: 0px;
    }

    /* graphic01-end */


} 