.head { 
    font-family: "mestiza", sans-serif;
    font-weight: 700;
    font-style: normal;
    font-size: 70pt;
    text-align: center;
    color: goldenrod;
}

.Studio {
    font-family: "mestiza", sans-serif;
font-weight: 400;
font-style: normal;
text-align: center;
font-size: 35pt;
color:rgb(7, 48, 7);

}

#studio { 
    text-align:center;
    text-wrap:nowrap;
}

#lab { 
    text-align:center;
    text-wrap:nowrap;
}

a { 
    text-decoration: none;
    color:darkgreen;
}

#project1 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color:rgb(7, 48, 7) ;
    position: relative;
    left: 20%;
    top: 100px;
    text-align: center;
    color: rgb(0, 100, 0, 0);
}
#project1:hover { 
    color: rgb(0, 100, 0, 1);
}
#project2 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color:rgb(7, 48, 7) ;
    position: relative;
    left: 40%;
    text-align: center;
    color: rgb(0, 100, 0, 0);
}
#project2:hover { 
    color: rgb(0, 100, 0, 1);
}

#project3 {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color:rgb(7, 48, 7) ;
    position: relative;
    left: 70%;
    text-align: center;
    color: rgb(0, 100, 0, 0); } 

    #project3:hover { 
        color: rgb(0, 100, 0, 1);
    }

#work1 { 
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color:goldenrod ;
    position: relative;
    left: 30%;
    text-align: center;
    color: rgb(0, 100, 0, 0);
}

#work1:hover { 
    color: rgb(0, 100, 0, 1);
}

#work2 { 
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color:goldenrod ;
    position: relative;
    left: 50%;
    top: 40px;
    text-align: center;
    color: rgb(0, 100, 0, 0);
}
#work2:hover { 
    color: rgb(0, 100, 0, 1);
}

#work3 { 
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color:goldenrod ;
    position: relative;
    left: 60%;
    text-align: center;
    color: rgb(0, 100, 0, 0);
}
#work3:hover { 
    color: rgb(0, 100, 0, 1);
}

#work { 
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color:goldenrod ;
    position: relative;
    left: 10%;
    top: 150px;
    text-align: center;
    color: rgb(0, 100, 0, 0);
}
#work:hover { 
    color: rgb(0, 100, 0, 1);
}

#work4 { 
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color:goldenrod ;
    position: relative;
    left: 80%;
    text-align: center;
    color: rgb(0, 100, 0, 0);
}
#work4:hover { 
    color: rgb(0, 100, 0, 1);
}

#work5 { 
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background-color:goldenrod ;
    position: relative;
    left: 90%;
    text-align: center;
    color: rgb(0, 100, 0, 0);
}
#work5:hover { 
    color: rgb(0, 100, 0, 1);
}

/* --------
            LAB
                ------- */

                #projectA {
                    width: 40px;
                    height: 40px;
                    border-radius: 50%;
                    background-color:rgb(7, 48, 7) ;
                    position: relative;
                    left: 17%;
                    top: 80px;
                    text-align: center;
                    color: rgb(0, 100, 0, 0);
                }
                #projectA:hover { 
                    color: rgb(0, 100, 0, 1);
                }                

                #workA { 
                    width: 25px;
                    height: 25px;
                    border-radius: 50%;
                    background-color:goldenrod ;
                    position: relative;
                    left: 25%;
                    text-align: center;
                    color: rgb(0, 100, 0, 0);
                }
                
                #workA:hover { 
                    color: rgb(0, 100, 0, 1);
                }

                #projectB {
                    width: 40px;
                    height: 40px;
                    border-radius: 50%;
                    background-color:rgb(7, 48, 7) ;
                    position: relative;
                    left: 32%;
                    text-align: center;
                    color: rgb(0, 100, 0, 0);
                }
                #projectB:hover { 
                    color: rgb(0, 100, 0, 1);
                }
                #workB { 
                    width: 25px;
                    height: 25px;
                    border-radius: 50%;
                    background-color:goldenrod ;
                    position: relative;
                    left: 39%;
                    top: 45px;
                    text-align: center;
                    color: rgb(0, 100, 0, 0);
                }
                #workB:hover { 
                    color: rgb(0, 100, 0, 1);
                }
                
#project4 {

    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color:rgb(7, 48, 7) ;
    position: relative;
    left: 46%;
    top: 70px;
    text-align: center;
    color: rgb(0, 100, 0, 0); } 

    #project4:hover { 
        color: rgb(0, 100, 0, 1);
    }

    #project5 {

        width: 40px;
        height: 40px;
        border-radius: 50%;
        background-color:rgb(7, 48, 7) ;
        position: relative;
        left:62%;
        top: -100px;
        text-align: center;
        color: rgb(0, 100, 0, 0); } 
    
        #project5:hover { 
            color: rgb(0, 100, 0, 1);
        }

    #work6 { 
        width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color:goldenrod ;
        position: relative;
        left: 55%;
        text-align: center;
        color: rgb(0, 100, 0, 0);
    }
    #work6:hover { 
        color: rgb(0, 100, 0, 1);
    }

    #work7 { 
        width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color:goldenrod ;
        position: relative;
        left: 69%;
        top: -180px;
        text-align: center;
        color: rgb(0, 100, 0, 0);
    }
    #work7:hover { 
        color: rgb(0, 100, 0, 1);
    }

    #workC { 
        width: 25px;
        height: 25px;
        border-radius: 50%;
        background-color:goldenrod ;
        position: relative;
        left: 82%;
        top: -120px;
        text-align: center;
        color: rgb(0, 100, 0, 0);
    }
    #workC:hover { 
        color: rgb(0, 100, 0, 1);
    }

    #project6 {

        width: 40px;
        height: 40px;
        border-radius: 50%;
        background-color:rgb(7, 48, 7) ;
        position: relative;
        left:75%;
        top: -160px;
        text-align: center;
        color: rgb(0, 100, 0, 0); } 
    
        #project6:hover { 
            color: rgb(0, 100, 0, 1);
        }

    
        #project7 {

            width: 40px;
            height: 40px;
            border-radius: 50%;
            background-color:rgb(7, 48, 7) ;
            position: relative;
            left:89%;
            top: -180px;
            text-align: center;
            color: rgb(0, 100, 0, 0); } 
        
            #project7:hover { 
                color: rgb(0, 100, 0, 1);
            }  
            

/* --------
            iFRAME
                   ------- */

.iframe { 
    width: 80%;
    height: 80%;
    position: relative;
    left: 10%;
    box-shadow: 0px 0px 15px 3px #000000b1;
    border: none;
    border-radius: 20px;

} 
   
.frametext {
    text-align: center;
    position: relative;
    text-decoration: none;
    margin-left: 43%;
    font-size: 17pt;
}

a { 
    font-family: "mestiza", sans-serif;
    font-weight: 400;
    font-style: normal;

}

#center { 
    text-align: center;
    margin-left: 40%;
    font-size: 17pt;

}