@import url('../css/globals.css');

/* Page global CSS */
.floatingImg{
    border-radius: var(--border-radius);
    box-shadow: 0 0 30px 4px rgba(0, 0, 0, 1.0);
    height: 15rem;
    position: relative;
    transition: 0.5s;
}
.floatingTxt{
    border-radius: var(--border-radius);
    background-color: #3e4058;
    box-shadow: 0 0 30px 4px rgba(0, 0, 0, 1.0);
    position: absolute;
    padding: 1rem;
    width: 18rem;
    max-height: 10rem;
    text-align: center;
    line-height: 30px;
    font-size: large;
}
video{
    height: 40rem;
    border-radius: var(--border-radius);
    box-shadow: 0 0 30px 4px rgba(0, 0, 0, 0.6);
}
p{
    margin: 0;
}

/* Version 1 section */
#sectionVersion1{
    margin-top: 4rem;
}
#V1{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    position: relative;
}
#V1_Render{
    height: 40rem;
    width: 348px;
    padding-right: 3rem;
}
#V1_Handles{
    left: 1rem;
    top: 3rem;
}
#V1_Feet{
    align-self: flex-end;
    right: 2rem;
    bottom: -2rem;
}
#V1_Text{
    left: 51.2rem;
    top: -2rem;
}

/* Version 2 section */
#sectionVersion2{
    margin-top: 10rem;
    margin-bottom: 10rem;
}
#V2{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    position: relative;
}
#V2_Render{
    height: 40rem;
    transform: scaleX(-1);
    padding-left: 3rem;
}
#V2_Video{
    width: 45rem;
    height: auto;
    align-self: center;
    position: relative;
    right: 6rem;
}
#V2_Feet{
    width: 25rem;
    height: auto;
    right: 2rem;
    position: absolute;
}
#V2_Handles{
    align-self: flex-end;
    z-index: 2;
}
#V2_Text{
    align-self: flex-end;
    right: 1rem;
    width: 15rem;
    bottom: 1rem;
}

/* Version 3 section */
#sectionVersion3{

}
#V3{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: row;
    position: relative;
    width: 100%;
}
#V3_Render{
    height: 40rem;
    padding-left: 3rem;
    transform: scaleX(-1);
}
#V3_Video{
    width: 50rem;
    height: auto;
    position: relative;
    align-self: center;
    left: 2rem;
}
#V3_Text{
    right: 6rem;
    top: 2rem;
}