@import url('https://fonts.googleapis.com/css2?family=Anton&family=Bodoni+Moda:ital,opsz,wght@0,6..96,400..900;1,6..96,400..900&family=Bungee&family=Meow+Script&family=Outfit:wght@100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Roboto+Mono:ital,wght@0,100..700;1,100..700&family=Tilt+Warp&display=swap');

html,
body {
    position: relative;
    margin: 0;
    padding: 0;
    width: 100vw;
    min-height: 100vh;
    height: auto;
    /*overflow-x: hidden;*/
    font-family: 'Outfit', sans-serif;
    scroll-behavior: auto;
    user-select: none;
    background: #000;
    overflow-x: hidden;
}

html {
    font-size: 16px;
}

body {
    font-size: 1rem;
}

/* Reset general styles */
* {
    position: relative;
    float: left;
    margin: 0;
    padding: 0;
}

strong,
span,
em,
br,
a {
    position: unset;
    float: unset;
    margin: unset;
    padding: unset;
}

.hideMe {
    display: none;
}

/*pulsante animazione*/
.circle-set {
    position: absolute;
    top: 25vh;
    left: calc((100vw - 50vh) / 2);
    right: calc((100vw - 50vh) / 2);
    box-sizing: border-box;
    border-radius: 1500px;
    opacity: 0.3;
}

.circle-1 {
    width: 50vh;
    height: 50vh;
    border: 20px solid #000;
    transform: scale(1.5)
}

.circle-2 {
    width: 50vh;
    height: 50vh;
    border: 20px solid #000;
    transform: scale(2.5)
}

.circle-3 {
    width: 50vh;
    height: 50vh;
    border: 40px solid #000;
    transform: scale(3.5)
}

.circle-4 {
    width: 50vh;
    height: 50vh;
    border: 40px solid #000;
    transform: scale(5)
}

.pulse {
    background-color: #9000FF;
    height: 2.5vw;
    width: 2.5vw;
    border-radius: 250px;
    position: relative;
}

.ring {
    position: absolute;
    background-color: inherit;
    height: 2.5vw;
    width: 2.5vw;
    border-radius: 250px;
    opacity: 0.8;
}

/*GESTIONE DELLE SEZIONI*/
.entry-studios-competence {
    width: 100vw;
    height: 100vh;
    background: #FFF;
    color: #000;
    visibility: hidden;
    opacity: 0;
}

.entry-studios-competence-title-container {
    width: 100vw;
    height: 25vh;
    position: absolute;
    top: 37.5vh;
    left: 0;
    display: grid;
    align-items: center;
    justify-content: center;
}

.entry-effect-mobile {
    display: none;
}

.entry-studios-competence-title-p1,
.entry-studios-competence-title-p2 {
    font-size: 7rem;
    width: 100vw;
    height: auto;
    color: #000;
    font-weight: 900;
    line-height: 6rem;
    text-align: center;
    text-transform: uppercase;
}

.studios-competence-img-1,
.studios-competence-img-2,
.studios-competence-img-3,
.studios-competence-img-4,
.studios-competence-img-5,
.studios-competence-img-6,
.studios-competence-img-7,
.studios-competence-img-8,
.studios-competence-img-9,
.studios-competence-img-10,
.studios-competence-img-11,
.studios-competence-img-12 {
    object-fit: cover;
    object-position: center;
    border-radius: 2rem;
    position: absolute;
}

.studios-competence-img-1 {
    width: 14vw;
    height: 10vh;
    min-width: 14vw;
    min-height: 10vh;
    top: 39vh;
    left: 26vw;
    object-position: bottom;
}

.studios-competence-img-2 {
    width: 20vw;
    height: 25vh;
    min-width: 20vw;
    min-height: 25vh;
    top: 13vh;
    left: 40vw;
}

.studios-competence-img-3 {
    width: 20vw;
    height: 10vh;
    min-width: 20vw;
    min-height: 10vh;
    top: 50vh;
    left: 40vw;
}

.studios-competence-img-4 {
    width: 10vw;
    height: 55vh;
    min-width: 15vw;
    min-height: 55vh;
    top: 8vh;
    left: 61vw;
}

.studios-competence-img-5 {
    width: 11vw;
    min-width: 11vw;
    max-width: 11vw;
    height: 11vw;
    min-height: 11vw;
    max-height: 11vw;
    top: 15vh;
    left: 28vw;
}

.studios-competence-img-6 {
    width: 11vw;
    height: 45vh;
    top: 42vh;
    left: 77vw;
}

.studios-competence-img-7 {
    width: 25vw;
    height: 20vh;
    top: 72vh;
    left: 27vw;
}

.studios-competence-img-8 {
    width: 10vw;
    height: 40vh;
    min-width: 10vw;
    min-height: 40vh;
    top: 20vh;
    left: 15vw;
    object-position: bottom;
}

.studios-competence-img-9 {
    width: 10vw;
    height: 40vh;
    min-width: 10vw;
    min-height: 40vh;
    top: 21vh;
    left: 88.7vw;
    object-position: bottom;
}

.studios-competence-img-10 {
    width: 23vw;
    height: 15vh;
    min-width: 23vw;
    max-width: 23vw;
    min-height: 15vh;
    max-height: 15vh;
    top: 72vh;
    left: 53vw;
    object-position: bottom;
}

.studios-competence-img-11 {
    width: 30vw;
    height: 20vh;
    min-width: 30vw;
    max-width: 35vw;
    min-height: 10vh;
    max-height: 20vh;
    top: 79vh;
    left: -4vw;
    object-position: bottom;
}

.studios-competence-img-12 {
    width: 7vw;
    height: 35vh;
    top: 42vh;
    left: 7vw;
}

.entry-studios-tags {
    color: #000;
    font-size: 2rem;
    letter-spacing: 0.2rem;
    text-transform: uppercase;
    position: absolute;
}

.tags1 {
    top: 39vh;
    left: 25.8vw;
    font-family: 'Bodoni Moda';
    letter-spacing: -0.3rem;
    font-size: 4rem;
}

.tags2 {
    top: 64vh;
    left: 61vw;
    font-family: 'Anton', sans-serif;
    font-size: 3rem;
    letter-spacing: -0.05rem;
}

.tags3 {
    top: 26.4vh;
    left: 0.8vw;
    font-family: 'Bodoni Moda', serif;
    font-size: 3.5rem;
}

.tags4 {
    top: 35.4vh;
    left: 77vw;
    font-family: 'Bungee';
    letter-spacing: -0.1rem;
    font-size: 3rem;
}

.tags5 {
    top: 84.6vh;
    left: 63vw;
    font-family: 'Bodoni Moda', serig;
    letter-spacing: -0.3rem;
    font-size: 5.5rem;
    font-weight: 750;
}

.tags6 {
    top: 14vh;
    left: 76.6vw;
    letter-spacing: -0.3rem;
    font-size: 3.5rem;
}

.tags7 {
    top: 91vh;
    left: 27vw;
    font-weight: 100;
    font-size: 4rem;
}

.tags8 {
    top: 87vh;
    left: 53.2vw;
}

.tags9 {
    top: 31vh;
    left: 2.6vw;
    letter-spacing: -0.05rem;
    font-family: 'Anton', sans-serif;
    font-size: 5rem;
}



/*GESTIONE DEL CONTAINER E DELLE DIVERSE SEZIONI*/
.container {
    width: auto;
    min-width: 100vw;
    max-width: 100vw;
    min-height: 100vh;
    height: auto;
    background: #FFF;
    /*display: none;*/
    /*padding-bottom: 100vh;*/
}

.slider-wrapper {
    overflow-x: hidden;
    position: relative;
}

.slider-container {
    width: 400vw;
    height: 100vh;
    display: flex;
}

.slide-content {
    width: 100vw;
    height: 100vh;
    background: #000;
    display: flex;
    align-items: center;
    flex-shrink: 0;
    /* Evita che si ridimensionino */
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
}

#insert-container-005-001-001-videoproduction {
    position: absolute;
    bottom: 12vh;
    left: 35vh;
    width: 57.2vh;
    height: 30vh;
    border-radius: 25px;
    opacity: 1;
}

.insert-vp-video {
    width: 57.2vh;
    height: 30vh;
    position: absolute;
    right: 0;
    top: 0;
    border-radius: 25px;
    opacity: 1;
    object-fit: cover;
}

.insert-vp-feature-container {
    width: 57.2vh;
    height: 30vh;
    position: absolute;
    left: 0;
    bottom: 0;
    box-sizing: border-box;
    opacity: 1;
}

.vp-insert-text-container {
    width: 47.2vh;
    position: absolute;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
    height: auto;
}

.insert-vp-title-img {
    width: 47.2vh;
    height: auto;
    font-family: 'Anton', sans-serif;
    font-size: 3rem;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: -2px;
    color: #FFF;
    margin: 0rem;
    margin-left: 1rem;
    margin-bottom: -1rem;
    line-height: 3rem;
    box-sizing: border-box;
    opacity: 1;
}

.insert-vp-subtitle-img {
    width: 47.2vh;
    height: auto;
    font-family: 'Outfit', sans-serif;
    font-size: 1rem;
    font-weight: 100;
    letter-spacing: 2px;
    color: #FFF;
    margin: 1rem;
    box-sizing: border-box;
    opacity: 1;
}

.vp-insert-icon-container {
    position: absolute;
    bottom: 2rem;
    right: 0;
    margin-right: 1rem;
}

.ph-slide-bg-video,
.vp-slide-bg-video,
.gd-slide-bg-video,
.infl-slide-bg-video {
    width: 100vw;
    height: 100vh;
    left: 0;
    object-fit: cover;
    object-position: center;
    opacity: 0.15;
    filter: blur(5px);
}

.slide-title {
    width: 80vw;
    text-align: center;
    color: #FFF;
    font-size: 10rem;
    font-weight: 400;
    letter-spacing: 2rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 45vh;
    left: 10vw;
    opacity: 1;
}

.slide-text {
    width: 30vw;
    position: absolute;
    bottom: 20vh;
    left: 10vw;
    color: #FFF;
    font-weight: 100;
    font-size: 1rem;
    letter-spacing: 2px;
    line-height: 1.1rem;
    opacity: 1;
}

.gd-slide-text {
    width: 20vw;
    bottom: 11vh;
}

.photography-slide-title {
    letter-spacing: 0.5rem;
    top: 40vh;
}

.photography-slide-title-2 {
    letter-spacing: -0.5rem;
    top: 40vh;
}

span.ps-slide-title-p1,
.vs-slide-title-p2 {
    display: inline-block;
    font-weight: 600;
}

span.ps-slide-title-p2,
.vs-slide-title-p1 {
    display: inline-block;
    visibility: hidden;
    font-family: 'Bodoni Moda', sans-serif;
}

/*GESTIONE TITOLO */
.vp-slide-title,
.gd-slide-title,
.infl-slide-title {
    line-height: 8rem;
}

.vp-slide-title {
    letter-spacing: -0.5rem;
    top: 33vh;
    opacity: 1;
    font-size: 7rem;
    line-height: 6rem;
}

.vp-slide-title-p1,
.vp-slide-title-p2,
.vp-slide-title-p3 {
    font-size: 7rem;
    line-height: 6rem;
    color: #FFF;
    font-weight: 750;
    letter-spacing: -0.5rem;
    position: absolute;
    top: 55vh;
    width: 100vw;
    text-align: center;
    text-transform: uppercase;
}

.vp-slide-text {
    left: 47vw;
    opacity: 1;
}

.gd-slide-title {
    top: 25vh;
    opacity: 1;
    letter-spacing: 0rem;
}

/*GESTIONE CONTENUTI DA NW*/
#insert-container-002-002-001-modelmanagement,
#insert-container-002-002-002-modelmanagement,
#insert-container-002-002-003-modelmanagement,
#insert-container-002-002-004-modelmanagement,
#insert-container-002-002-005-modelmanagement,
#insert-container-002-002-006-modelmanagement {
    z-index: 9;
}

.cursor-pointer-element {
    cursor: pointer;
}

#insert-container-002-002-001-modelmanagement,
#insert-container-002-002-002-modelmanagement {
    position: absolute;
    top: 22vh;
    left: 10vh;
    min-width: 22vw;
    min-height: 26vh;
    max-width: 22vw;
    max-height: 26vh;
    border-radius: 1rem;
}

iframe.video-videobook,
.video-videobook,
iframe.video-videobook-002-002-002,
.video-videobook-002-002-002,
.img-002-002-002 {
    width: 22vw;
    height: 26vh;
    object-fit: cover;
    object-position: center;
    border-radius: 1rem;
}

#insert-container-002-002-003-modelmanagement,
#insert-container-002-002-006-modelmanagement {
    position: absolute;
    top: 56vh;
    left: 10vh;
    min-width: 15vw;
    min-height: 40vh;
    max-width: 15vw;
    max-height: 40vh;
    border-radius: 1rem;
}

#insert-container-002-002-004-modelmanagement,
#insert-container-002-002-005-modelmanagement {
    position: absolute;
    top: 66vh;
    left: 21vw;
    min-width: 28.5vw;
    min-height: 25vh;
    max-width: 28.5vw;
    max-height: 25vh;
    border-radius: 1rem;
}

#insert-container-002-002-005-modelmanagement {
    left: unset;
    right: 21vw;
}

#insert-container-002-002-002-modelmanagement,
#insert-container-002-002-006-modelmanagement {
    left: unset;
    right: 10vh;
}

iframe.video-videobook .video-videobook,
iframe.video-videobook-002-002-003,
.video-videobook-002-002-003,
iframe.video-videobook-002-002-006,
.video-videobook-002-002-006,
.img-002-002-003,
.img-002-002-006 {
    width: 15vw;
    height: 40vh;
    max-width: 15vw;
    max-height: 40vh;
    object-fit: cover;
    object-position: center;
    border-radius: 1rem;
    border-radius: 1rem;
}

.video-videobook-002-002-001,
iframe.video-videobook-002-002-001,
.img-002-002-001 {
    object-fit: cover;
    object-position: center;
    width: 22vw;
    height: 25vh;
    min-height: 25vh;
    min-width: 22vw;
    max-height: 25vh;
    max-width: 22vw;
    border-radius: 1rem;
}

.video-videobook-002-002-004,
iframe.video-videobook-002-002-004,
.video-videobook-002-002-005,
iframe.video-videobook-002-002-005,
.img-002-002-004,
.img-002-002-005 {
    object-fit: cover;
    object-position: center;
    width: 28.5vw;
    /*prima 22vw*/
    height: 26vh;
    min-height: 26vh;
    min-width: 28.5vw;
    /*prima 22vw*/
    max-height: 26vh;
    max-width: 28.5vw;
    /*prima 22vw*/
    border-radius: 1rem;
}

.media-info {
    margin-top: 0.2rem;
    font-size: 0.65rem;
    color: #FFF;
    opacity: 0.5;
    font-weight: 200;
}

/*GESTIONE IMMAGINI E VIDEO SLIDE GRAPHIC DESIGN*/
.gd-img-slide {
    width: 30vw;
    height: 20vh;
    object-fit: cover;
    object-position: center;
    border-radius: 1rem;
    position: absolute;
}

.gd-img-slide-1 {
    left: 11vw;
    top: 10vh;
    width: 22vw;
    height: 26vh;
    object-fit: cover;
    object-position: center;
    border-radius: 1rem;
    position: absolute;
}

.gd-img-slide-2 {
    left: 34vw;
    top: 38vh;
    width: 15vw;
    height: 50vh;
    object-fit: cover;
    object-position: center;
    border-radius: 1rem;
    position: absolute;
}

.gd-img-slide-3 {
    left: 34vw;
    top: 6vh;
    width: 30vw;
    height: 30vh;
    object-fit: cover;
    object-position: center;
    border-radius: 1rem;
    position: absolute;
}

.gd-img-slide-4 {
    left: 76vw;
    top: 38vh;
    width: 15vw;
    height: 20vh;
    object-fit: cover;
    object-position: center;
    border-radius: 1rem;
    position: absolute;
}

.gd-img-slide-5 {
    left: 50vw;
    top: 38vh;
    width: 25vw;
    height: 40vh;
    object-fit: cover;
    object-position: center;
    border-radius: 1rem;
    position: absolute;
}

.infl-slide-title {
    top: 15vh;
    letter-spacing: -1rem;
    opacity: 1;
}

/*icone social slide influencer*/
.slide-infl-icon-container {
    width: 30vw;
    position: absolute;
    left: 35vw;
    bottom: 40vh;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
    display: visible;
}

.single-infl-icon-content {
    width: calc(30vw / 4);
    height: calc(30vw / 4);
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.empty-heart-icon,
.filled-heart-icon,
.empty-message-icon,
.empty-send-icon,
.empty-save-icon {
    width: 6vw;
    min-width: 6vw;
    max-height: 6vw;
    fill: #FFF;
    opacity: 1;
}

.empty-heart-icon,
.filled-heart-icon {
    width: 6vw;
    min-width: 6vw;
    position: absolute;
    opacity: 1;
}

/*icone di notifica slide influencer*/
.notify-allert {
    width: 2.5vw;
    height: 2.5vw;
    border-radius: 250px;
    position: absolute;
    top: 0vw;
    right: 0vw;
    background: #f31e3e;
    color: #FFF;
    font-size: 1.5rem;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
}

/*contenitore dinamico per influencer*/
.slide-influencer-container {
    width: 90vw;
    position: absolute;
    bottom: 0;
    left: 5vw;
    height: 35vh;
}

.slide-insert-text-container {
    width: 15vw;
    max-width: 15vw;
    height: 35vh;
    max-height: 35vh;
    position: absolute;
    left: 0;
}

.slide-infl-cont-title {
    font-weight: 900;
    font-size: 6rem;
    letter-spacing: -1rem;
    color: #FFF;
    line-height: 3rem;
    text-transform: uppercase;
    text-align: right;
    position: absolute;
    top: -5vw;
    left: -10vw;
}

span.slide-text-infl-bold {
    font-weight: 900;
}

span.slide-infl-cont-title-thin {
    text-transform: lowercase;
    font-weight: 100;
    font-size: 2rem;
    letter-spacing: 0;
}

.slide-insert-container {
    position: absolute;
    width: 50vw;
    max-width: 50vw;
    min-width: 50vw;
    left: 20vw;
}

#insert-container-006-001-001-influencer,
#insert-container-006-001-002-influencer,
#insert-container-006-001-003-influencer {
    width: 14vw;
    height: 14vw;
    border-radius: 500px;
    margin-left: 1.3vw;
    margin-right: 1.3vw;
    background: linear-gradient(to right, orange, red, purple);
    cursor: pointer;
    transition: 0.2s;
    opacity: 0;
    visibility: visible;
}

.insert-infl-video,
.insert-infl-img {
    width: 13vw;
    max-width: 13vw;
    height: 13vw;
    max-height: 13vw;
    border-radius: 500px;
    position: absolute;
    top: 0.25vw;
    left: 0.25vw;
    border: 0.25vw solid #000;
    visibility: visible;
    opacity: 1;
}

.insert-infl-feature-container {
    position: absolute;
    bottom: -1.5vw;
    width: 13vw;
    opacity: 1;
    visibility: visible;
    opacity: 1;
}

.insert-infl-title-img {
    width: 13vw;
    height: auto;
    color: #FFF;
    font-weight: 900;
    font-size: 1.5rem;
    letter-spacing: -0.01rem;
    text-align: center;
    margin-bottom: 0.2rem;
    text-shadow: 0 0 15px rgba(0, 0, 0, 0.8);
    visibility: visible;
    opacity: 1;
}

.insert-infl-subtitle-img {
    width: 13vw;
    height: auto;
    color: #FFF;
    font-weight: 100;
    font-size: 1.2rem;
    letter-spacing: 0.1rem;
    text-align: center;
    visibility: visible;
    opacity: 1;
}

.arrow-container {
    width: 7vw;
    height: 7vw;
    border-radius: 500px;
    border: 0.5px solid #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 5vw;
    right: 5vw;
    cursor: pointer;
    transition: 0.2s;
    z-index: 10;
}

.infl-arrow-container {
    width: 7vw;
    height: 7vw;
    border-radius: 500px;
    border: 0.5px solid #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    bottom: 5vw;
    right: 5vw;
    cursor: pointer;
    z-index: 10;
    width: 14vw;
    height: 14vw;
    right: 10vw;
    bottom: 5.6vw;
}

.infl-arrow-cont-text {
    font-size: 1.5rem;
    font-weight: 100;
    text-transform: uppercase;
    letter-spacing: -0.5px;
    color: #FFF;
    opacity: 0;
    visibility: hidden;
    transform: translateX(2rem);
    transition: 0.2s;
}

.infl-slider-arrow {
    position: absolute;
    left: calc((14vw - 2rem) / 2);
}

.slider-arrow {
    fill: #FFF;
    font-size: 1rem;
    width: 2rem;
    transition: 0.2s;
}

.arrow-container:hover .slider-arrow {
    padding-left: 2vw;
    transition: 0.2s;
}

/*gestione management*/
.container-video {
    position: absolute;
    bottom: 5vw;
    left: 5vw;

}

/*gestione di talent management*/
.talent-management-content {
    width: 100vw;
    height: 100vh;
    margin-top: 5vh;
    margin-bottom: 5vh;
}

.explode-me {
    width: 100vw;
    height: 100vh;
    position: absolute;
    top: 0vh;
    left: 0vw;
    opacity: 1;
}

.tm-text-container-sx,
.tm-text-container-dx {
    width: 30vw;
    height: 30vh;
    position: absolute;
    bottom: 5vh;
}

.tm-text-container-sx {
    left: 5vw;
    text-align: right;
}

.tm-text-container-dx {
    right: 5vw;
    text-align: left;
}

.tm-content-title {
    width: 100%;
    font-size: 3rem;
    font-weight: 900;
    letter-spacing: -2px;
    color: #6c00aa;
    margin-bottom: 2rem;
    opacity: 1;
}

.tm-content-text {
    width: 100%;
    font-size: 1rem;
    font-weight: 300;
    letter-spacing: 1px;
    color: #9000ff;
    opacity: 1;
}

span.anton-character {
    font-family: 'Anton', sans-serif;
}

span.bodoni-character {
    font-family: 'Bodoni Moda', serif;
    font-weight: 900;
}

/*sezione graphic design*/
.graphic-design-section,
.gs-container,
.background-left,
.background-right,
.background-element {
    min-width: 100vw;
    min-height: 100vh;
}

.background-left,
.background-right,
.background-element {
    background-position: center !important;
    background-size: cover !important;
    background-repeat: no-repeat !important;
    position: absolute;
    top: 0;
    left: 0;
}

.gd-title {
    position: absolute;
    top: 15vh;
    left: 15vw;
    color: #FFF;
    font-size: 12rem;
    font-weight: 900;
    line-height: 0.8em;
    opacity: 1;
}

.gd-text {
    width: 30vw;
    /*prima del testo 20vw*/
    height: auto;
    position: absolute;
    bottom: 10vh;
    /*prima del nuovo testo 25vh*/
    left: 15vw;
    color: #FFF;
    font-weight: 200;
    letter-spacing: 1.5px;
    font-size: 1rem;
    line-height: 1.1em;
    opacity: 1;
    text-shadow: 0 0 0.5rem #000;
}

.gd-text strong {
    font-weight: 900;
}

.gd-arrow-container {
    width: 16vw;
    height: 4vw;
    border: 0.5px solid #FFF;
    position: absolute;
    bottom: 41vh;
    left: 15vw;
    border-radius: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.gd-slider-arrow {
    font-size: 3rem;
    width: 3rem;
    fill: #FFF;
}

/*sezione hair styling*/
.hair-stylist-section {
    width: 100vw;
    height: auto;
    min-height: 100vh;
    margin-top: 0vh;
}

.hs-title-wrapper {
    width: auto;
    min-width: 100vw;
    font-size: 7.5rem;
    color: #FFF;
    letter-spacing: 15px;
    font-weight: 900;
    background: #000;
    height: 10rem;
    position: absolute;
    top: 0;
    left: 0;
    text-transform: uppercase;
    white-space: nowrap;
    display: inline-block;
}

.hs-pre-title {
    width: cacl(100vw - 135vh - 5vw);
    background: #000;
    color: #FFF;
    font-size: 1.5rem;
    font-weight: 300;
    letter-spacing: 1px;
    line-height: 0.8em;
    position: absolute;
    top: calc(10rem + 7rem + 2.5vh);
    right: 135vh;
    padding: 15px;
    opacity: 1;
    text-align: center;
}

.hs-title,
.hs-second-title {
    font-size: 5rem;
    color: #000;
    position: absolute;
    top: calc(10rem + 7rem + 7vh);
    right: 135vh;
    font-weight: 900;
    opacity: 1;
}

.hs-second-title {
    top: calc(10rem + 14rem + 2.5vh);
    right: 135vh;
}

.hs-img,
.insert-vp-img {
    height: 70vh;
    width: 133vh;
    position: absolute;
    right: 0;
    top: calc(14rem + 5vh);
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    opacity: 1;
    max-width: 133vh;
    object-fit: contain;
}

.mua-insert-feature-container {
    width: 20vw;
    position: absolute;
    bottom: 0.5vh;
    left: 86vh;
    display: flex;
    align-items: center;
    opacity: 1;
    height: 15vh;
}

.mua-insert-text-container {
    width: 15vw;
}

.hs-description-img-title {
    min-width: 15vw;
    font-weight: 100;
    color: #FFF;
    font-size: 1.2rem;
    line-height: 1.1rem;
    letter-spacing: 2px;
    margin-bottom: 0.2rem;
    font-weight: 900;
}

.hs-description-img-subtitle {
    min-width: 15vw;
    font-weight: 100;
    color: #FFF;
    font-size: 1rem;
    line-height: 1.1rem;
    letter-spacing: 2px;
}

.icon-container {
    width: 2.5vw;
    height: 2.5vw;
    border-radius: 250px;
    background: #9000FF;
    cursor: pointer;
    opacity: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 0;
}

.open-hightlights-icon {
    fill: #FFF;
}

@keyframes shadown-appear {
    from {
        box-shadow: 0 0 0 rgba(0, 0, 0, 0.5);
    }

    to {
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
    }
}

.hs-img-animation {
    animation: shadown-appear;
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
}

.hs-text {
    width: 25vw;
    position: absolute;
    right: 135vh;
    bottom: 25vh;
    opacity: 1;
}

.section-arrow-container {
    width: 7vw;
    height: 7vw;
    border-radius: 250px;
    border: 5px solid #FFF;
    position: absolute;
    right: calc(133vh - 3.5vw);
    bottom: 5vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgb(109, 0, 0);
    opacity: 1;
    cursor: pointer;
}

.section-arrow-container:hover .slider-arrow {
    padding-left: 2vw;
    transition: 0.2s;
}

.mua-iframe-container {
    position: absolute;
    top: calc(14rem + 5vh);
    right: -55vw;
    width: 55vw;
    height: 70vh;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.2);
    display: none;
}

#mua-iframe {
    position: absolute;
    top: 0;
    right: 0;
    width: 55vw;
    height: 70vh;
    border-radius: 25px;
    border: none;
}

.closing-iframe {
    position: absolute;
    top: 15px;
    left: 25px;
    fill: #FFF;
    padding: 10px;
    cursor: pointer;
    background: #6500B4;
    border-radius: 50px;
}

/*sezione influencer*/
.influencer-section {
    width: 100vw;
    min-height: 100vh;
    margin-top: 5vh;
}

.infl-title-wrapper {
    width: auto;
    min-width: 100vw;
    font-size: 7.5rem;
    color: #FFF;
    letter-spacing: 15px;
    font-weight: 900;
    background: #6c00aa;
    height: 10rem;
    position: absolute;
    top: 0;
    left: 0;
    text-transform: uppercase;
    white-space: nowrap;
    display: inline-block;
    z-index: 2;
}

.infl-title {
    font-size: 10rem;
    font-weight: 900;
    color: #9000ff;
    letter-spacing: -5px;
    line-height: 0.8em;
    position: absolute;
    width: 40vw;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: start;
    opacity: 1;
    top: 35vh;
    left: 30vw;
    z-index: 4;
}

.infl-title-p1 {
    top: 28vh;
    font-size: 7rem;
    left: 43vw;
    color: #000;
    letter-spacing: 0px;
    z-index: 4;
}

.infl-title-p3 {
    top: 50vh;
    left: 33vw;
    color: #480080;
    z-index: 4;
}

.infl-img {
    width: 40vw;
    height: auto;
    position: absolute;
    top: 10vh;
    left: 30vw;
    opacity: 1;
    z-index: 3;
}

.infl-second-title {
    /*
    font-size: 3rem;
    font-weight: 700;
    line-height: 0.8em;
    letter-spacing: 2px;
    position: absolute;
    top: 65vh;
    left: 59vw;
    color: #6c00aa;
    opacity: 1;
    z-index: 4;
    */
    font-size: 3rem;
    font-weight: 700;
    line-height: 0.8em;
    letter-spacing: 2px;
    position: absolute;
    top: 50vh;
    left: 76vw;
    color: #6c00aa;
    opacity: 1;
    z-index: 4;
    width: 20vw;
    text-align: right;
}

.infl-second-title-p2 {
    left: 59vw;
    top: 69vh;
}

.infl-sub-title {
    font-size: 3rem;
    font-weight: 900;
    line-height: 0.8em;
    letter-spacing: 2px;
    position: absolute;
    top: 50vh;
    left: 6vw;
    color: #605ab4;
    opacity: 1;
    z-index: 4;
    width: 21vw;
}

.infl-third-title {
    font-size: 15rem;
    font-weight: 900;
    line-height: 0.7em;
    text-align: center;
    color: #9000FF;
    width: 100vw;
    left: 0vw;
    top: 25vh;
    z-index: 4;
}

p.infl-text {
    font-size: 1rem;
    letter-spacing: 2px;
    font-weight: 100;
    width: 30vw;
    position: absolute;
    left: 5vw;
    top: 65vh;
    color: #000;
    opacity: 1;
    z-index: 4;
    padding: 1.5rem;
    background: linear-gradient(133deg, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 0.74) 60%, rgba(255, 255, 255, 0) 100%);
    border-radius: 1rem;
}

span.fuxia {
    color: #BC00FF;
}

/*GESTIONE INFLUENCER IN SECTION INFLUENCER*/
#insert-container-006-001-004-influencer,
#insert-container-006-001-005-influencer,
#insert-container-006-001-006-influencer {
    width: 10vw;
    height: 30vh;
    position: absolute;
    bottom: 5vh;
    border-radius: 1rem;
}

#insert-container-006-001-004-influencer {
    right: 33vw;
}

#insert-container-006-001-005-influencer {
    right: 20vw;
}

#insert-container-006-001-006-influencer {
    right: 7vw;
}

#insert-container-006-001-004-influencer video,
iframe {
    object-fit: cover;
    object-position: center;
    width: 10vw;
    height: 30vh;
    min-height: 30vh;
    min-width: 10vw;
    max-height: 30vh;
    max-width: 10vw;
}

#insert-container-006-001-005-influencer video,
iframe {
    object-fit: cover;
    object-position: center;
    width: 10vw;
    height: 30vh;
    min-height: 30vh;
    min-width: 10vw;
    max-height: 30vh;
    max-width: 10vw;
}

#insert-container-006-001-006-influencer video,
iframe {
    object-fit: cover;
    object-position: center;
    width: 10vw;
    height: 30vh;
    min-height: 30vh;
    min-width: 10vw;
    max-height: 30vh;
    max-width: 10vw;
}

.influencer-competence-text-container {
    width: 8.5vw;
    position: absolute;
    bottom: 0.5rem;
    left: -1.5rem;
    height: auto;
}

.influencer-competence-name {
    padding: 0.5rem;
    background: #6c00aa;
    color: #FFF;
    font-size: 1.2rem;
    line-height: 1rem;
    letter-spacing: 0.1rem;
    font-weight: 500;
    border-radius: 0.5rem;
    margin-bottom: -0.5rem;
    z-index: 9;
}

.influencer-competence {
    background: #fffffdd5;
    color: #000;
    font-size: 1rem;
    letter-spacing: 0.05rem;
    line-height: 1rem;
    padding: 0.5rem;
    border-radius: 0.5rem;
    font-weight: 300;
    width: 8.5vw;
    padding-top: 1.5rem;
}

/* GESTIONE ICONE INFLUENCER DA RIPRENDERE IN SECONDO MOMENTO

    .icons-container{
        width: 100vw;
        height: 5vh;
        display: flex;
        position: absolute;
        bottom: -15vh;
        left: 0;
    }
    img.icons{
        width: 3vw;
        height: 3vw;
        opacity: 1;
    }
    img.normal-icon{
        width: 5vw;
        height: 5vw;
        opacity: 1;
    }
    img.fast-icon{
        width: 6vw;
        height: 6vw;
        opacity: 1;
    }
    .mokup{
        width: 15vw;
        height: auto;
        position: absolute;
        border-radius: 15px;
        box-shadow: 0 0 15px rgba(0,0,0,0.5);
    }
    .mokup-1{
        bottom: -50vh;
        left: 5vw;
    }
    .mokup-2{
        bottom: -50vh;
        left: 35vw;
    }
    .mokup-3{
        bottom: -50vh;
        left: 55vw;
    }
    .mokup-4{
        bottom: -50vh;
        left: 85vw;
    }
    .hide-icon{
        display: none;
}
*/
/*video production section*/
.video-production-section {
    width: 100vw;
    height: auto;
    margin-top: 5vh;
    background: rgb(20, 20, 20);
    /*padding-bottom: 50vh;*/
}

.video-production-single-sec {
    width: 100vw;
    min-height: 100vh;
    height: auto;
    clear: both;
}

.vp-video {
    width: 100vw;
    height: auto;
    min-height: 100vh;
    opacity: 0.7;
    top: 0vh;
    /*50vh*/
}

.vp-title-wrapper {
    width: auto;
    min-width: 100vw;
    font-size: 7.5rem;
    color: #FFF;
    letter-spacing: 15px;
    font-weight: 900;
    height: 10rem;
    position: absolute;
    top: 0;
    left: 0;
    text-transform: uppercase;
    white-space: nowrap;
    display: inline-block;
    opacity: 1;
}

.vp-title,
.vp-showreel-title,
.vp-emotional-title {
    width: 50vw;
    position: absolute;
    top: calc(7.5rem + 25vh);
    /*calc(7.5rem + 85vh)*/
    left: 25vw;
    text-align: center;
    color: #FFF;
    text-transform: uppercase;
    font-size: 10rem;
    text-transform: uppercase;
    line-height: 0.7em;
    font-weight: 100;
    letter-spacing: 10px;
    opacity: 1;
}

.vp-vp-more-button {
    background: #FFF;
    padding: 5px;
    text-align: center;
    position: absolute;
    width: 10vw;
    left: 45vw;
    bottom: 45vh;
    color: #000;
    letter-spacing: 1.5px;
    cursor: pointer;
    transition: 0.2s;
    opacity: 1;
}

.video-reel {
    width: 15vw;
    height: auto;
    max-height: 26.5vw;
    border-radius: 25px;
    position: absolute;
    bottom: 15vh;
    object-fit: cover;
    opacity: 1;
}

.vp-showreel-title {
    font-size: 12rem;
    color: #FFF;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 700;
    text-shadow: 0 0 25px rgba(0, 0, 0, 0.8);
}

.reel1 {
    left: 8vw;
}

.reel2 {
    left: calc(8vw + 15vw + 8vw);
}

.reel3 {
    left: calc(16vw + 30vw + 8vw);
}

.reel4 {
    left: calc(24vw + 45vw + 8vw);
}

.vp-emotional-title {
    top: calc(7.5rem + 29vh);
}

.video-emo {
    position: absolute;
    width: 70vw;
    max-height: 60vh;
    height: auto;
    left: 15vw;
    bottom: 20vh;
    border-radius: 25px;
    object-fit: cover;
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.8);
    opacity: 1;
}

.vp-cinema-azienda-title {
    position: absolute;
    width: 60vw;
    height: auto;
    bottom: 45vh;
    left: 5vw;
    text-align: left;
    font-size: 9rem;
    line-height: 0.8em;
    color: #FFF;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-weight: 900;
    text-shadow: 0 0 25px rgba(0, 0, 0, 0.8);
    opacity: 1;
}

.video-azienda {
    width: 15vw;
    min-height: 26.5vw;
    max-height: 26.5vw;
    max-height: 26.5vw;
    border-radius: 25px;
    position: absolute;
    bottom: 15vh;
    object-fit: cover;
    opacity: 1;
}

.vidazie1 {
    right: 5vw;
}

.vidazie2 {
    right: calc(5vw + 15vw + 2.5vw);
}

.vidazie3 {
    right: calc(7.5vw + 30vw + 2.5vw);
}

.vidazie4 {
    right: calc(9.5vw + 45vw + 2.5vw);
}

.vp-cinema-azienda-text {
    position: absolute;
    bottom: 17vh;
    left: 5vw;
    font-size: 2rem;
    line-height: 1.2em;
    font-family: "Outfit", sans-serif;
    font-weight: 100;
    width: 35vw;
    height: auto;
    color: #FFF;
}

.vp-arrow-container {
    width: 8.5vw;
    height: 4.5vw;
    border: 0.5px solid #FFF;
    transition: 0.2s;
    position: absolute;
    bottom: 34vh;
    left: 1vw;
    border-radius: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    visibility: hidden;
    opacity: 0;
}

.vp-slider-arrow {
    font-size: 3rem;
    width: 3rem;
    transition: 0.2s;
    fill: #FFF;
}

.vp-arrow-container:hover .vp-slider-arrow {
    transition: 0.2s;
    margin-right: -8vw;
}

/*GESTIONE TITOLO GUARDA HIGHLIGHTS*/
.call-to-action-highlights {
    height: auto;
    min-height: 100vh;
    width: 100vw;
    min-width: 100vw;
    background: #FFF;
}

.slider-arrow-container {
    display: flex;
    border: 0.5px solid #000;
    justify-content: center;
    align-items: center;
    padding: 7rem;
    position: absolute;
    cursor: pointer;
    border-radius: 15rem;
    top: 40vh;
    left: 75vw;
}

.cta-highlights-arrow {
    width: 3vw;
    height: 3vw;
    top: 0;
    right: 0;
    fill: #000;
    padding: 0;
    border-radius: 12rem;
}

.cta-highlights-title-container {
    position: absolute;
    top: calc(50vh - 7rem);
    left: 5vw;
    width: 90vw;
    height: 26rem;
    display: grid;
    justify-content: start;
}

.cta-highlights-title {
    width: 90vw;
    height: 9rem;
    clear: both;
    color: #000;
    font-weight: 800;
    letter-spacing: 2rem;
    font-size: 9rem;
    line-height: 7rem;
    text-transform: uppercase;
    margin-right: 5vw;
    ;
}

.cta-highlights-button {
    padding: 1rem;
    font-size: 1.2rem;
    line-height: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    color: #FFF;
    background: #6c00aa;
    margin-top: 1rem;
    border-radius: 3rem;
    font-weight: 100;
    letter-spacing: 0.2rem;
    border: none;
    position: absolute;
    top: calc(15vh + 30rem);
    left: 5vw;
    cursor: pointer;
    text-transform: uppercase;
    font-family: 'Outfit', sans-serif;
    visibility: visible;
    opacity: 1;
}

/***************/
/*STEPS PROJECT*/
/***************/
.project-steps-container {
    width: 100vw;
    height: auto;
    min-height: 100vh;
    position: relative;
    background: #FFF;
    box-shadow: inset 0 0 200px rgba(0, 0, 0, 0.2);
    overflow: hidden;
}

.single-step {
    width: 100vw;
    height: auto;
    min-height: 100vh;
    margin-bottom: 5vh;
    overflow-y: hidden;
    overflow-x: hidden;
    position: relative;
}

.brief-step-content {
    width: 100%;
    min-width: 100vw;
    height: auto;
    min-height: 100vh;
    max-height: unset;
    position: relative;
}

.cube-container {
    width: 700px;
    height: 700px;
    margin: 80px;
    perspective: 1400px;
    position: absolute;
    top: 0;
    right: 0vw;
}

.cube {
    width: 700px;
    height: 700px;
    position: relative;
    transform-style: preserve-3d;
    transform: translateZ(-100px) rotateX(0deg) rotateY(0deg);
    transition: transform 1s;
    opacity: 0;
}

.cube.show-front {
    transform: translateZ(-350px) rotateY(0deg);
    background: #000;
}

.cube.show-right {
    transform: translateZ(-350px) rotateY(-90deg);
    background: #000;
}

.cube.show-back {
    transform: translateZ(-350px) rotateY(-180deg);
    background: #000;
}

.cube.show-left {
    transform: translateZ(-350px) rotateY(90deg);
    background: #000;
}

.cube.show-top {
    transform: translateZ(-350px) rotateX(-90deg);
    background: #000;
}

.cube.show-bottom {
    transform: translateZ(-350px) rotateX(90deg);
    background: #000;
}

.cube__face {
    position: absolute;
    width: 700px;
    height: 700px;
    line-height: 700px;
    font-size: 40px;
    font-weight: bold;
    color: white;
    text-align: center;
    background: #FFF
}

.cube-video {
    width: 700px;
    height: 700px;
    object-fit: cover;
    opacity: 0.45;
}

.cube__face--front {
    transform: rotateY(0deg) translateZ(350px);
}

.cube__face--right {
    transform: rotateY(90deg) translateZ(350px);
}

.cube__face--back {
    transform: rotateY(180deg) translateZ(350px);
}

.cube__face--left {
    transform: rotateY(-90deg) translateZ(350px);
}

.cube__face--top {
    transform: rotateX(90deg) translateZ(350px);
}

.cube__face--bottom {
    transform: rotateX(-90deg) translateZ(350px);
}

.brief-cube {
    transform: translateZ(-100px) rotateX(0deg) rotateY(90deg);
    opacity: 1;
}

.single-step-title {
    width: 40vw;
    position: absolute;
    top: 5vw;
    left: 5vw;
    color: #000;
    font-family: 'Outfit', sans-serif;
    font-weight: 600;
    font-size: 8rem;
    line-height: 0.75em;
    letter-spacing: -2px;
    opacity: 1;
}

/*briefing*/
.brief-step-title {
    opacity: 1;
}

.single-step-subtitle {
    width: 40vw;
    font-size: 2rem;
    font-weight: 100;
    padding: 10px;
    position: absolute;
    top: calc(5vw + 10rem + 10vh);
    left: 5vw;
    color: #FFF;
    background: #000;
    letter-spacing: 5px;
}

.single-step-text {
    max-width: 35vw;
    font-weight: 300;
    font-size: 1.5rem;
    color: #303030;
    font-family: 'Outfit', sans-serif;
    text-align: left;
    line-height: 1.5em;
    position: absolute;
    bottom: 12vw;
    left: 5vw;
    opacity: 1;
}

.step-numb {
    position: absolute;
    bottom: 5vw;
    left: 42.5vw;
    font-size: 7rem;
    letter-spacing: -5px;
    border: 10px solid #000;
    color: #000;
    border-radius: 25px;
    font-family: 'Roboto Mono', sans-serif;
    opacity: 1;
}

.st-video,
.selectteam-video {
    width: 100vw;
    height: 110vh;
    object-fit: cover;
    filter: blur(2.5px);
    position: absolute;
    top: -10vh;
    left: 0;
    opacity: 0.45;
}

.selectteam-video {
    opacity: 0.2;
}

.step-numb2,
.step-numb3 {
    left: unset;
    right: 5vw;
}

/*selection talents*/
.selectteam-step-title {
    width: 40vw;
    position: absolute;
    top: 5vw;
    left: 30vw;
    color: #000;
    font-family: 'Outfit', sans-serif;
    text-align: center;
    font-weight: 600;
    font-size: 8rem;
    line-height: 0.75em;
    letter-spacing: -2px;
    opacity: 1;
}

.selectteam-step-subtitle {
    left: 30vw;
    text-align: center;
    background: transparent;
    color: #000;
    top: calc(5vw + 10rem + 5vh);
    opacity: 1;
}

.selectteam-single-step-text {
    max-width: 40vw;
    text-align: center;
    bottom: 22vw;
    left: 30vw;
    opacity: 1;
}

.competence-container {
    width: 100vw;
    height: 100vh;
    position: relative;
}

.st-single-talents {
    width: 15vw;
    min-height: 100vh;
    max-height: 100vh;
    position: absolute;
    border-bottom-right-radius: 25px;
    border-top-right-radius: 25px;
    bottom: 0;
    opacity: 1;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
}

.st-photographer {
    left: 0;
}

.st-videomaker {
    left: 14vw;
}

.st-mua {
    left: 28vw;
}

.st-hairstylist {
    left: 42vw;
}

.st-stylist {
    left: 56vw;
}

.st-copywriter {
    left: 70vw;
}

.st-location {
    left: 84vw;
}

.st-single-talent-link-container {
    width: 15vw;
    height: auto;
    min-height: 10vh;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    color: #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0));
    padding-top: 30vh;
}

.st-arrow-container {
    width: 2vw;
    height: 2vw;
    border-radius: 500px;
    border: 0.5px solid #FFF;
    display: flex;
    align-items: center;
    justify-content: center;
    right: 1vw;
    cursor: pointer;
    transition: 0.2s;
    position: absolute;
    right: 1vw;
}

.little-slider-arrow {
    fill: #FFF;
    font-size: 0.5rem;
    width: 1.5rem;
    transition: 0.2s;
}

.st-single-talent-link {
    width: 11vw;
    color: #FFF;
    font-size: 1.2rem;
    letter-spacing: 0.5px;
    font-weight: 100;
    text-align: center;
    text-transform: uppercase;
    margin-left: -2vw;
}

.st-arrow-container:hover .little-slider-arrow {
    margin-right: -2.5vw;
    transition: 0.2s;
}

/*GESTIONE STEPS*/
.steps-details {
    width: 100vw;
    height: 100vh;
    position: relative;
}

/*PROVA COLLOCAMENTO CONTENITORE ELEMENTO DINAMICO*/
#insert-container-001-001-001-makeup {
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    min-width: 100vw;
    max-width: 100vw;
    height: 100vh;
    min-height: 100vh;
    max-height: 100vh;
}

.st-single-img {
    width: 15vw;
    min-height: 100vh;
    max-height: 100vh;
    object-fit: cover;
    object-position: center;
    border-bottom-right-radius: 25px;
    border-top-right-radius: 25px;
    opacity: 1;
    mix-blend-mode: normal;
}

.st-single-talents-title {
    bottom: 25vw;
    left: 0.5vw;
    position: absolute;
    width: 130%;
    font-weight: 500;
    text-transform: uppercase;
    text-transform: uppercase;
    color: #FFF;
    text-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
    letter-spacing: -4px;
    line-height: 0.8em;
    font-size: 5.2rem;
    text-align: left;
    opacity: 1;
    transform: rotate(-90deg) scale(2.5);
    font-family: 'Anton';
    mix-blend-mode: soft-light;
}

.st-photographer {
    z-index: 7;
}

.st-videomaker {
    z-index: 6;
}

.st-mua {
    z-index: 5;
}

.st-hairstylist {
    z-index: 4;
}

.st-stylist {
    z-index: 3;
}

.st-copywriter {
    z-index: 2;
}

.st-location {
    z-index: 1;
}

.st-stt-ph,
.st-stt-vm,
.st-stt-mua,
.st-stt-hs,
.st-stt-fs,
.st-stt-cr,
.st-stt-lc {
    opacity: 1;
}

/*altre competenze*/
.other-competence-step {
    /*background: #FFF;*/
    margin-bottom: 0;
}

.other-competence-entry-container {
    width: 100vw;
    height: 100vh;
    min-height: 100vh;
}

.oc-title {
    font-size: 8rem;
    width: 100%;
    min-width: 100vw;
    font-weight: 400;
    color: #000;
    text-align: center;
    letter-spacing: -5px;
    position: absolute;
    top: 35vh;
    left: 0;
    opacity: 1;
}

.oc-single-step-alone-text {
    position: absolute;
    top: 40vh;
    left: 20vw;
    width: 60vw;
    height: auto;
    line-height: 0.8em;
    font-size: 2.5rem;
    color: #000;
    font-weight: 100;
    letter-spacing: 2px;
    opacity: 1;
}

/*barra di progressione*/
.progression-bar-container {
    width: 100vw;
    height: 100vh;
    min-height: 100vh;
    max-height: 100vh;
    position: absolute;
    top: 0;
    left: 0;
}

.single-point {
    font-size: 7rem;
    font-weight: 700;
    width: 100%;
    height: auto;
    position: absolute;
    color: #000;
    text-align: center;
    text-transform: uppercase;
    top: 45vh;
    left: 0;
    opacity: 1;
}

.progression-bar-track {
    width: 100vw;
    height: 100vh;
    min-height: 100vh;
    max-height: 100vh;
}

#progress-bar-track {
    transform: scale(0.5);
    position: absolute;
    left: -3vw;
    top: 65vh;
    overflow: visible;
}

.closing-words {
    position: absolute;
    width: 100%;
    left: 0;
    top: 40vh;
    text-align: center;
    font-size: 5rem;
    font-weight: 100;
    letter-spacing: -5px;
    text-transform: uppercase;
    line-height: 0.8em;
    color: #000;
}

.steps-last-detail {
    width: 100vw;
    height: 100vh;
    min-height: 100vh;
    position: relative;
    background: #FFF;
}

.management-single-message {
    position: absolute;
    bottom: 0.5rem;
    left: 0.5rem;
    background: #161616a1;
    color: #FFF;
    padding: 0.5rem;
    border-radius: 0.5rem;
    z-index: 10;
}

/*formati desktop*/
@media (min-width: 1024px) and (max-width: 1279px) {
    html {
        font-size: 9px;
    }
}

@media (min-width: 1280px) and (max-width: 1365px) {
    html {
        font-size: 10px;
    }
}

@media (min-width: 1366px) and (max-width: 1439px) {
    html {
        font-size: 11px;
    }
}

@media (min-width: 1440px) and (max-width: 1679px) {
    html {
        font-size: 12px;
    }
}

@media (min-width: 1680px) and (max-width: 1919px) {
    html {
        font-size: 13px;
    }
}

@media (min-width: 1920px) and (max-width: 2559px) {}

@media (min-width: 2559px) and (max-width: 3839px) {}

@media (min-width: 3840px) and (max-width: 5120px) {}

/*GESTIONE DISPOSITIVI MOBILE*/
@media (min-width: 279px) and (max-width: 823px) {

    .entry-effect-mobile {
        display: block;
        position: absolute;
        top: 9vh;
        min-height: 4rem;
        background: #FFF;
        width: 100vw;
        mix-blend-mode: exclusion;
    }

    .studios-competence-img-1 {
        width: 50vw;
        height: 7vh;
        min-width: 50vw;
        min-height: 7vh;
        top: 30vh;
        left: 2.5vw;
    }

    .studios-competence-img-2 {
        width: 56vw;
        height: 11vh;
        min-width: 56vw;
        min-height: 11vh;
        top: 8vh;
        left: 2.5vw;
    }

    .studios-competence-img-3 {
        display: none;
    }

    .studios-competence-img-4 {
        width: 26vw;
        height: 23vh;
        min-width: 26vw;
        min-height: 23vh;
        top: 8vh;
        left: 61vw;
    }

    .studios-competence-img-5 {
        display: none;
    }

    .studios-competence-img-6 {
        width: 30vw;
        height: 14vh;
        top: 74vh;
        left: 68vw;
    }

    .studios-competence-img-7 {
        width: 32.5vw;
        height: 23vh;
        top: 65vh;
        left: 34vw;
    }

    .studios-competence-img-8 {
        display: none;
    }

    .studios-competence-img-9 {
        width: 10vw;
        height: 29vh;
        min-width: 10vw;
        min-height: 29vh;
        top: 8vh;
        left: 88.7vw;
    }

    .studios-competence-img-10 {
        width: 30vw;
        height: 15vh;
        min-width: 30vw;
        max-width: 50vw;
        min-height: 15vh;
        max-height: 15vh;
        top: 58vh;
        left: 68vw;
        object-position: bottom;
    }

    .studios-competence-img-11 {
        display: none;
    }

    .studios-competence-img-12 {
        width: 30vw;
        height: 25vh;
        top: 71vh;
        left: 2.5vw;
    }

    .tags1 {
        top: 23.2vh;
        left: 2.5vw;
        font-family: 'Bodoni Moda';
        letter-spacing: -0.1rem;
        font-size: 2.8rem;
    }

    .tags2 {
        top: 65vh;
        left: 2.5vw;
        font-size: 2rem;
        letter-spacing: 0;
        display: none;
    }

    .tags3 {
        top: 18.6vh;
        left: 2.5vw;
        font-family: 'Bodoni Moda', serif;
        font-size: 2.5rem;
    }

    .tags4 {
        top: 31vh;
        left: 54.5vw;
        font-family: 'Anton';
        letter-spacing: 0.3rem;
        font-size: 2.5rem;
    }

    .tags5 {
        top: 88.6vh;
        left: 34vw;
        font-family: 'Bodoni Moda', serif;
        letter-spacing: 0.35rem;
        font-size: 1.5rem;
        font-weight: 750;
    }

    .tags6 {
        top: 61vh;
        left: 2.5vw;
        letter-spacing: 0.13rem;
        font-size: 1.9rem;
    }

    .tags7 {
        top: 92.5vh;
        left: 34vw;
        font-weight: 100;
        font-size: 2.1rem;
        line-height: 1.8rem;
    }

    .tags9 {
        top: 63.8vh;
        left: 2.6vw;
        letter-spacing: -0.12rem;
        font-family: 'Anton', sans-serif;
        font-size: 3rem;
    }

    .tags8 {
        display: none;
    }

    .entry-studios-competence-title-container {
        width: 100vw;
        height: 10vh;
        top: 42vh;
    }

    /*ENTRY TITLE*/
    .entry-studios-competence-title-p1,
    .entry-studios-competence-title-p2 {
        font-size: 3rem;
        width: 100vw;
        height: auto;
        color: #000;
        font-weight: 900;
        line-height: 3rem;
        text-align: center;
        text-transform: uppercase;
    }

    /*slider*/
    .slide-title {
        width: 95vw;
        text-align: center;
        color: #FFF;
        font-size: 3rem;
        font-weight: 400;
        letter-spacing: 2rem;
        line-height: 1rem;
        text-transform: uppercase;
        text-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
        position: absolute;
        top: 45vh;
        left: 2.5vw;
        opacity: 1;
    }

    .photography-slide-title {
        letter-spacing: 0rem;
        top: 40vh;
    }

    .photography-slide-title-2 {
        letter-spacing: 0rem;
        top: 40vh;
    }

    .arrow-container {
        width: 27vw;
        height: 27vw;
        border-radius: 500px;
        border: 0.5px solid #FFF;
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        bottom: 15vw;
        right: 5vw;
        cursor: pointer;
        transition: 0.2s;
        z-index: 10;
    }

    /*SLIDER VIDEO*/
    #insert-container-002-002-001-modelmanagement {
        height: 15vh;
        width: 60vw;
        min-height: 15vh;
        min-width: 60vw;
        max-height: 15vh;
        max-width: 60vw;
        position: absolute;
        top: 9vh;
        left: 5vw;
        overflow: hidden;
    }

    .video-videobook-002-002-001,
    iframe.video-videobook-002-002-001 {
        height: 12vh;
        width: 60vw;
        min-height: 12vh;
        min-width: 60vw;
        max-height: 12vh;
        max-width: 60vw;
        object-fit: cover;
        object-position: center;
    }

    #insert-container-002-002-002-modelmanagement {
        height: 15vh;
        width: 60vw;
        min-height: 15vh;
        min-width: 60vw;
        max-height: 15vh;
        max-width: 60vw;
        position: absolute;
        top: 25vh;
        left: 5vw;
        overflow: hidden;
    }

    .video-videobook-002-002-002,
    iframe.video-videobook-002-002-002 {
        height: 12vh;
        width: 60vw;
        min-height: 12vh;
        min-width: 60vw;
        max-height: 12vh;
        max-width: 60vw;
        object-fit: cover;
        object-position: center;
    }

    #insert-container-002-002-003-modelmanagement {
        height: 27vh;
        width: 27vw;
        min-height: 27vh;
        min-width: 27vw;
        max-height: 27vh;
        max-width: 27vw;
        position: absolute;
        top: 9vh;
        left: 68vw;
        overflow: hidden;
    }

    .video-videobook-002-002-003,
    iframe.video-videobook-002-002-003 {
        height: 22vh;
        width: 27vw;
        min-height: 22vh;
        min-width: 27vw;
        max-height: 22vh;
        max-width: 27vw;
        object-fit: cover;
        object-position: center;
    }

    #insert-container-002-002-004-modelmanagement {
        height: 15vh;
        width: 60vw;
        min-height: 15vh;
        min-width: 60vw;
        max-height: 15vh;
        max-width: 60vw;
        position: absolute;
        top: 67vh;
        left: 5vw;
        overflow: hidden;
    }

    .video-videobook-002-002-004,
    iframe.video-videobook-002-002-004,
    .img-002-002-004 {
        height: 12vh;
        width: 60vw;
        min-height: 12vh;
        min-width: 60vw;
        max-height: 12vh;
        max-width: 60vw;
        object-fit: cover;
        object-position: center;
    }

    #insert-container-002-002-005-modelmanagement {
        height: 15vh;
        width: 60vw;
        min-height: 15vh;
        min-width: 60vw;
        max-height: 15vh;
        max-width: 60vw;
        position: absolute;
        top: 83vh;
        left: 5vw;
        overflow: hidden;
    }

    .video-videobook-002-002-005,
    iframe.video-videobook-002-002-005,
    .img-002-002-005 {
        height: 12vh;
        width: 60vw;
        min-height: 12vh;
        min-width: 60vw;
        max-height: 12vh;
        max-width: 60vw;
        object-fit: cover;
        object-position: center;
    }

    #insert-container-002-002-006-modelmanagement {
        height: 27vh;
        width: 27vw;
        min-height: 27vh;
        min-width: 27vw;
        max-height: 27vh;
        max-width: 27vw;
        position: absolute;
        top: 68vh;
        left: 68vw;
        overflow: hidden;
    }

    .video-videobook-002-002-006,
    iframe.video-videobook-002-002-006,
    .img-002-002-006 {
        height: 22vh;
        width: 27vw;
        min-height: 22vh;
        min-width: 27vw;
        max-height: 22vh;
        max-width: 27vw;
        object-fit: cover;
        object-position: center;
    }

    .vp-slide-title {
        letter-spacing: -0.5rem;
        top: 33vh;
        opacity: 1;
        font-size: 5rem;
        line-height: 4rem;
    }

    .vp-slide-title-p1,
    .vp-slide-title-p2,
    .vp-slide-title-p3 {
        font-size: 4.5rem;
        line-height: 3.5rem;
        color: #FFF;
        font-weight: 750;
        letter-spacing: -0.4rem;
        position: absolute;
        top: 55vh;
        width: 100vw;
        text-align: center;
        text-transform: uppercase;
    }

    /*SLIDER GRAPHIC*/
    .gd-img-slide-1 {
        left: 5vw;
        top: 9vh;
        width: 90vw;
        height: 15vh;
        object-fit: cover;
        object-position: center;
        border-radius: 1rem;
        position: absolute;
    }

    .gd-img-slide-2 {
        left: 5VW;
        top: 53.7vh;
        width: 48vw;
        height: 12vh;
        object-fit: cover;
        object-position: center;
        border-radius: 1rem;
        position: absolute;
    }

    .gd-img-slide-3 {
        left: 33vw;
        top: 25vh;
        width: 62vw;
        height: 14vh;
        object-fit: cover;
        object-position: center;
        border-radius: 1rem;
        position: absolute;
    }

    .gd-img-slide-4 {
        left: 55vw;
        top: 58.5vh;
        width: 40vw;
        height: 22vh;
        object-fit: cover;
        object-position: center;
        border-radius: 1rem;
        position: absolute;
    }

    .gd-img-slide-5 {
        left: 55vw;
        top: 52vh;
        width: 40vw;
        height: 18vh;
        object-fit: cover;
        object-position: center;
        border-radius: 1rem;
        position: absolute;
    }

    /*GESTIONE SLIDE TEXT (DI OGNI SLIDER)*/
    .slide-text {
        width: 30vw;
        position: absolute;
        bottom: 9vh;
        left: 10vw;
        color: #FFF;
        font-weight: 100;
        font-size: 1rem;
        letter-spacing: 2px;
        line-height: 1.1rem;
        opacity: 1;
    }

    .gd-slide-title {
        width: 95vw;
        text-align: center;
        color: #FFF;
        font-size: 3.2rem;
        font-weight: 400;
        letter-spacing: 0.3rem;
        line-height: 2.5rem;
        text-transform: uppercase;
        text-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
        position: absolute;
        top: 41vh;
        left: 2.5vw;
        opacity: 1;
    }

    /*INFL-SLIDE-TITLE*/
    .infl-slide-title {
        width: 95vw;
        text-align: center;
        color: #FFF;
        font-size: 3rem;
        font-weight: 400;
        letter-spacing: 0.5rem;
        line-height: 2.7rem;
        text-transform: uppercase;
        text-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
        position: absolute;
        top: 25vh;
        left: 2.5vw;
        opacity: 1;
    }

    .slide-infl-icon-container {
        width: 70vw;
        left: 15vw;
        bottom: 55vh;
        opacity: 1;
        display: visible;
    }

    .single-infl-icon-content {
        width: calc(70vw / 4);
        height: calc(70vw / 4);
    }

    .empty-heart-icon,
    .filled-heart-icon,
    .empty-message-icon,
    .empty-send-icon,
    .empty-save-icon {
        width: 12vw;
        min-width: 12vw;
        max-height: 12vw;
    }

    .notify-allert {
        width: 7.5vw;
        height: 7.5vw;
        font-size: 1.1rem;
    }

    .slide-influencer-container {
        height: 50vh;
    }

    .slide-infl-cont-title {
        top: -20vh;
        left: 0vw;
    }

    .slide-insert-container {
        position: absolute;
        width: 90vw;
        max-width: 90vw;
        min-width: 90vw;
        left: 0;
        bottom: 0;
        margin-bottom: 20vh;
    }

    #insert-container-006-001-001-influencer,
    #insert-container-006-001-002-influencer,
    #insert-container-006-001-003-influencer {
        width: calc((90vw - 7.8vw) / 3);
        height: calc((90vw - 7.8vw) / 3);
        border-radius: 500px;
        margin-left: 1.3vw;
        margin-right: 1.3vw;
        background: linear-gradient(to right, orange, red, purple);
        cursor: pointer;
        transition: 0.2s;
        opacity: 0;
        visibility: visible;
    }

    .insert-infl-video,
    .insert-infl-img {
        width: calc((90vw - 10.8vw) / 3);
        height: calc((90vw - 10.8vw) / 3);
        min-width: calc((90vw - 10.8vw) / 3);
        max-width: calc((90vw - 10.8vw) / 3);
        min-height: calc((90vw - 10.8vw) / 3);
        max-height: calc((90vw - 10.8vw) / 3);
        top: 0.25vw;
        left: 0.25vw;
    }

    .insert-infl-feature-container {
        width: calc((90vw - 7.8vw) / 3);
        bottom: -2vh;
        left: -1vw;
    }

    .insert-infl-title-img {
        width: calc((90vw - 7.8vw) / 3);
        font-size: 1.1rem;
        font-weight: 700;
        letter-spacing: -0.05rem;
        margin-bottom: 0.2rem;
        text-shadow: 0 0 15px rgba(0, 0, 0, 0.8);
    }

    .insert-infl-subtitle-img {
        width: calc((90vw - 7.8vw) / 3);
        font-size: 1rem;
    }

    .infl-arrow-container {
        border: 5px solid #FFF;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 80vw;
        height: 14vw;
        right: 10vw;
        bottom: 14.6vw;
    }

    /*GESTIONE SINGOLE SEZIONI*/
    /*GRAPHIC*/
    .graphic-design-section,
    .gs-container,
    .background-left,
    .background-right,
    .background-element {
        min-width: 100vw;
        min-height: 85vh;
    }

    .background-left,
    .background-right,
    .background-element {
        background-position: 75% center !important;
    }

    .gd-title {
        top: 5vh;
        /*prima 19vh*/
        left: 5vw;
        font-size: 7rem;
    }

    .gd-text {
        width: 70vw;
        bottom: 2.5vh;
        /*prima 5vh*/
        left: 5vw;
        font-size: 1.1rem;
        line-height: 1.2em;
        opacity: 1;
        padding: 1rem;
        background: #000000b8;
        border-radius: 0.6rem;
    }

    .gd-arrow-container {
        width: 46vw;
        height: 13vw;
        border: 2px solid #FFF;
        bottom: 52vh; /*prima 29vh*/
        left: 5vw;
        background: #000000BA;
    }

    /*VIDEO PRODUCTION*/
    .vp-title-wrapper {
        font-size: 2.5rem;
        letter-spacing: 1rem;
    }

    .video-production-single-sec {
        min-height: 45vh;
    }

    .vp-video {
        min-height: 45vh;
        object-position: center;
        object-fit: none;
    }

    .vp-title,
    .vp-showreel-title,
    .vp-emotional-title {
        width: 90vw;
        top: calc(-4.5rem + 25vh);
        left: 5vw;
        font-size: 3.5rem;
        line-height: 0.9em;
        letter-spacing: 0.5rem;
    }

    .vp-showreel-title {
        font-size: 5rem;
        letter-spacing: 0;
        font-weight: 700;
    }

    .video-reel {
        width: 20vw;
        height: 65.5vh;
        max-height: 80vw;
        border-radius: 25px;
        position: absolute;
        bottom: 2.5vh;
        object-fit: cover;
    }

    .reel1 {
        left: 2.5vw;
    }

    .reel2 {
        left: calc(4vw + 20vw + 4vw);
    }

    .reel3 {
        left: calc(8vw + 40vw + 4vw)
    }

    .reel4 {
        left: calc(12vw + 60vw + 4vw);
    }

    /*gestione del terzo settore*/
    .vpsc4 {
        min-height: 70vh;
    }

    .video-emo {
        width: 90vw;
        min-height: 30vh;
        max-height: 30vh;
        left: 5vw;
        bottom: 7.5vh;
    }

    .vp-emotional-title {
        top: calc(7.5rem + 9vh);
    }

    .vp-cinema-azienda-text {
        bottom: unset;
        font-size: 1.5rem;
        line-height: 1.2em;
        width: 70vw;
        position: relative;
        margin-top: 2rem;
    }

    .vp-cinema-azienda-title {
        width: 90vw;
        bottom: unset;
        /*45vh*/
        left: unset;
        /*5vw*/
        font-size: 5rem;
        line-height: 0.8em;
        letter-spacing: -0.1rem;
        position: relative;
        margin-top: 20vh;
        margin-left: 5vw;
    }

    .vp-arrow-container {
        width: 25vw;
        height: 25vw;
        bottom: 5vw;
        left: unset;
        right: 5vw
    }

    .video-azienda {
        width: 20vw;
        min-height: 40vh;
        max-height: 40vh;
        max-height: 40vh;
        border-radius: 25px;
        position: absolute;
        bottom: 35vh;
        object-fit: cover;
        opacity: 1;
    }

    .vidazie1 {
        right: 4vw;
    }

    .vidazie2 {
        right: calc(4vw + 20vw + 4vw);
    }

    .vidazie3 {
        right: calc(4vw + 20vw + 4vw + 20vw + 4vw);
    }

    .vidazie4 {
        right: calc(4vw + 20vw + 4vw + 20vw + 4vw + 20vw + 4vw);
    }

    /*SEZIONE INFLUENCER*/
    .influencer-section {
        width: 100vw;
        min-height: 140vh;
        margin-top: 5vh;
    }

    .infl-title-wrapper {
        font-size: 2.5rem;
        letter-spacing: 0.5rem;
        height: 3.5rem;
        position: relative;
    }

    .infl-img {
        width: 100vw;
        height: auto;
        position: relative;
        top: unset;
        margin-top: -3vh;
        left: unset;
        margin-left: 0;
        opacity: 1;
        z-index: 3;
    }

    .infl-title {
        font-size: 6rem;
        letter-spacing: -5px;
        line-height: 0.8em;
        width: 80vw;
        top: 27vh;
        left: 5vw;
        z-index: 4;
    }

    .infl-title-p1 {
        top: 22vh;
        font-size: 6rem;
        left: 43vw;
        z-index: 4;
    }

    .infl-title-p3 {
        top: 34vh;
        left: 20vw;
        color: #480080;
        z-index: 4;
    }

    .infl-sub-title {
        font-size: 3rem;
        letter-spacing: 0.01rem;
        top: unset;
        left: unset;
        width: 80vw;
        position: relative;
        margin-left: 5vw;
        margin-top: 5vh;
    }

    p.infl-text {
        font-size: 1.5rem;
        letter-spacing: 0.01rem;
        font-weight: 250;
        width: 90vw;
        left: unset;
        top: unset;
        position: relative;
        margin-top: 0.5rem;
        box-sizing: border-box;
        margin-left: 5vw;
    }

    .infl-second-title {
        font-size: 3rem;
        letter-spacing: 0.01rem;
        top: unset;
        left: unset;
        width: 90vw;
        position: relative;
        margin-top: 2rem;
        margin-left: 5vw;
    }

    #insert-container-006-001-004-influencer,
    #insert-container-006-001-005-influencer,
    #insert-container-006-001-006-influencer {
        width: 25vw;
        margin: calc(25vw / 6);
        height: 30vh;
        position: relative;
        bottom: unset;
        margin-top: 1rem;
        border-radius: 1rem;
        margin-bottom: 3rem;
    }

    #insert-container-006-001-004-influencer,
    #insert-container-006-001-005-influencer,
    #insert-container-006-001-006-influencer {
        right: unset;
    }

    #insert-container-006-001-006-influencer video,
    iframe {
        position: relative;
        margin-top: 0;
        width: 25vw;
        min-width: 25vw;
        max-width: 25vw;
        margin-left: 0;
    }

    #insert-container-006-001-005-influencer video,
    iframe {
        position: relative;
        margin-top: 0;
        width: 25vw;
        min-width: 25vw;
        max-width: 25vw;
        margin-left: 0;
    }

    #insert-container-006-001-004-influencer video,
    iframe {
        position: relative;
        margin-top: 0;
        width: 25vw;
        min-width: 25vw;
        max-width: 25vw;
        margin-left: 0;
    }

    .influencer-competence-text-container {
        width: 27vw;
        position: absolute;
        bottom: -1.5rem;
        left: 0;
        height: auto;
    }

    .influencer-competence-name {
        padding: 0.5rem;
        letter-spacing: 0.05rem;
        margin-bottom: -0.5rem;
        width: 27vw;
        box-sizing: border-box;
    }

    .influencer-competence {
        background: #fffffdd5;
        color: #000;
        font-size: 1rem;
        letter-spacing: 0.05rem;
        line-height: 1rem;
        padding: 0.5rem;
        padding-top: 0.5rem;
        border-radius: 0.5rem;
        font-weight: 300;
        width: 27vw;
        box-sizing: border-box;
        padding-top: 1.5rem;
    }

    /*GESTIONE HAIR STYLIST*/
    .hs-title-wrapper {
        position: relative;
        top: unset;
        left: unset;
        font-size: 2.5rem;
        letter-spacing: 0.5rem;
        height: 3.5rem;
        margin-top: 0;
        margin-bottom: 1rem;
    }

    .hs-img {
        height: 33vh;
        width: 63vh;
        right: unset;
        top: unset;
        border-top-left-radius: 2rem;
        border-bottom-left-radius: 2rem;
        max-width: 63vh;
        position: relative;
        margin-right: -40vw;
        float: right;
    }

    .hs-pre-title {
        width: calc(70vw - 0vh - 5vw);
        letter-spacing: 0.01rem;
        top: unset;
        right: unset;
        padding: 1rem;
        opacity: 1;
        text-align: right;
        padding-right: 4rem;
        position: relative;
        float: right;
    }

    .hs-title,
    .hs-second-title {
        position: relative;
        font-size: 3.5rem;
        line-height: 3.5rem;
        top: calc(7rem + 7vh);
        right: unset;
        top: unset;
        float: right;
    }

    .hs-second-title {
        top: unset;
        margin-top: 0;
    }

    .single-step-title {
        width: 90vw;
        top: 5vw;
        left: 5vw;
        font-size: 8rem;
        letter-spacing: -0.01rem;
        position: relative;
    }

    .hs-text {
        width: 90vw;
        position: relative;
        left: unset;
        bottom: unset;
        opacity: 1;
        font-size: 1.5rem;
        margin-left: 5vw;
        right: unset;
        float: left;
        text-align: left;
        margin-top: 2rem;
        line-height: 2.1rem;
        font-weight: 300;
        letter-spacing: 0.1rem;
        margin-bottom: 3rem;
    }

    #insert-container-001-001-001-makeup {
        position: relative;
        top: unset;
        left: unset;
        width: 100vw;
        min-width: 100vw;
        max-width: 100vw;
        height: auto;
        min-height: unset;
        max-height: unset;
        margin-top: 1.5rem;
        margin-bottom: 3rem;
    }

    .single-step-subtitle {
        width: 70vw;
        font-size: 2rem;
        padding: 1.5rem;
        top: unset;
        letter-spacing: 0.1rem;
        line-height: 1.5rem;
        position: relative;
        left: unset;
        margin-top: 4rem;
        padding-top: 2.5rem;
        padding-bottom: 2.5rem;
    }

    .mua-insert-feature-container {
        width: 65vw;
        position: relative;
        bottom: unset;
        left: unset;
        float: right;
        display: flex;
        align-items: center;
        opacity: 1;
        height: auto;
        min-height: 10vh;
        background: transparent;
        padding: 1.9rem;
        padding-top: 1rem;
        padding-bottom: 1rem;
        padding-right: 5vw;
        border-radius: 1rem;
        box-sizing: border-box;
    }

    .mua-insert-text-container {
        width: 60vw;
    }

    .hs-description-img-title {
        min-width: 25vw;
        width: 100%;
        text-align: right;
        color: #000;
        font-size: 1.2rem;
        line-height: 1.1rem;
        letter-spacing: 2px;
        margin-bottom: 0.2rem;
        font-weight: 900;
    }

    .hs-description-img-subtitle {
        min-width: 15vw;
        width: 100%;
        text-align: right;
        font-weight: 100;
        color: #000;
        font-size: 1rem;
        line-height: 1.1rem;
        letter-spacing: 2px;
    }

    .icon-container {
        width: 13vw;
        height: 13vw;
        border-radius: 15rem;
        right: 5vw;
        top: -9vh;
    }

    .section-arrow-container {
        width: 25vw;
        height: 25vw;
        border-radius: 20rem;
        border: 3px solid #FFF;
        left: 0;
        bottom: 0;
    }

    .single-step {
        width: 100vw;
        height: auto;
        min-height: unset;
        position: relative;
    }

    .single-step-text {
        max-width: 90vw;
        font-size: 1.7rem;
        line-height: 1.2em;
        bottom: unset;
        left: unset;
        position: relative;
        margin-left: 5vw;
        margin-top: 2rem;
        font-weight: 300;
        letter-spacing: 0;
    }

    .st-step-title {
        width: 90vw;
        top: unset;
        left: unset;
        font-size: 5rem;
        letter-spacing: -0.01rem;
        margin-top: 3rem;
        margin-left: 5vw;
    }

    .st-single-step-text {
        bottom: unset;
    }

    .selectteam-step-title {
        width: 90vw;
        top: unset;
        left: unset;
        font-size: 6rem;
        letter-spacing: -0.01rem;
        position: relative;
        text-align: center;
        margin-left: 0;
        margin-top: 5rem;
    }

    .selectteam-step-subtitle {
        width: 90vw;
        font-size: 2.5rem;
        padding: 1.5rem;
        top: unset;
        letter-spacing: 0.1rem;
        line-height: 2.3rem;
        position: relative;
        left: unset;
        margin-top: 0;
        padding-top: 0;
        padding-bottom: 0;
    }

    .selectteam-single-step-text {
        min-width: 90vw;
        max-width: unset;
        font-size: 2rem;
        font-weight: 300;
        line-height: 1.2em;
        letter-spacing: 0;
        bottom: unset;
        left: unset;
        position: relative;
        margin-left: 0;
        margin-top: 2rem;
        margin-bottom: 3.5rem;
    }

    .step-numb {
        position: relative;
        bottom: unset;
        margin-right: 5vw;
        left: unset;
        font-size: 5rem;
        letter-spacing: -5px;
        border: 0.5rem solid #000;
        color: #000;
        border-radius: 15px;
        font-family: 'Roboto Mono', sans-serif;
        opacity: 1;
        font-weight: 900;
        background: transparent;
        margin-top: 5rem;
        width: 30vw;
        text-align: right;
        margin-left: 65vw;
        box-sizing: border-box;
        float: right;
        margin-bottom: 2.5rem;
    }

    /*sezione talents*/
    .brief-step-content {
        width: 100%;
        min-width: 100vw;
        height: auto;
        min-height: unset;
        max-height: unset;
        position: relative;
    }

    .project-steps-container {
        margin-top: 2.5rem;
    }

    .brief-step {
        margin-bottom: 0;
    }

    .cube-container {
        width: 110vw;
        height: 110vw;
        margin: 0px;
        perspective: 1400px;
        position: absolute;
        top: 0;
        right: 0vw;
    }

    .competence-container {
        width: 100vw;
        height: auto;
        /*160vh*/
        position: relative;
    }

    .select-team-step-content {
        margin-bottom: 0;
    }

    .st-single-talents {
        width: 100vw;
        min-height: 20vh;
        max-height: 20vh;
        position: relative;
        border-bottom-right-radius: 0;
        border-top-right-radius: 0;
        bottom: 0;
        opacity: 1;
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.7);
    }

    .steps-last-detail {
        height: auto;
        min-height: unset;
        margin-bottom: 0;
    }

    .st-single-img {
        width: 100vw;
        min-height: 20vh;
        max-height: 20vh;
        object-fit: cover;
        object-position: center;
        border-bottom-right-radius: 0;
        border-top-right-radius: 0;
    }

    .st-single-talents-title {
        bottom: 2vw;
        left: 0.5vw;
        position: absolute;
        width: 130%;
        font-weight: 500;
        letter-spacing: -0.01rem;
        line-height: 0.8em;
        font-size: 5.2rem;
        transform: rotate(0deg) scale(1) !important;
    }

    .st-single-talent-link-container {
        width: 100vw;
        height: 5vh;
        min-height: 5vh;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        color: #FFF;
        display: flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(-45deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.1) 74%, rgba(0, 0, 0, 0) 90%);
        padding-top: 15vh;
    }

    .st-arrow-container {
        width: 38vw;
        height: 20vh;
        border-radius: 500px;
        border: none;
        display: flex;
        justify-content: center;
        right: 1vw;
        cursor: pointer;
        transition: 0.2s;
        position: absolute;
        right: 0;
        box-sizing: border-box;
        font-weight: 900;
        top: 2rem;
    }

    .st-single-talent-link {
        width: 85vw;
        color: #FFF;
        font-size: 1.8rem;
        letter-spacing: 0.55rem;
        font-weight: 500;
        text-align: left;
        text-transform: uppercase;
        margin-left: -2vw;
    }

    .st-videomaker,
    .st-mua,
    .st-hairstylist,
    .st-stylist,
    .st-copywriter,
    .st-location {
        left: 0;
    }

    .little-slider-arrow {
        fill: #FFF;
        font-size: 2rem;
        width: 25vw;
        line-height: 2rem;
        transition: 0.2s;
        padding-right: 0;
        height: 20vh;
    }

    .selectteam-video {
        width: 100vw;
        height: 250vh;
        object-fit: cover;
        filter: blur(2.5px);
        position: absolute;
        top: -10vh;
        left: 0;
        opacity: 0.45;
    }

    /*GESTIONE SEZIONE HIGHLIGHTS*/
    .call-to-action-highlights {
        height: auto;
        min-height: 50vh;
        display: flex;
        align-items: center;
    }

    .cta-highlights-title-container {
        position: relative;
        left: 5vw;
        height: 30vh;
        display: grid;
        justify-content: start;
        top: unset;
    }

    .cta-highlights-title {
        width: 90vw;
        height: 15vh;
        clear: both;
        color: #000;
        font-weight: 800;
        letter-spacing: 0.2rem;
        font-size: 4.5rem;
        line-height: 0.3rem;
        text-transform: uppercase;
        margin-right: 5vw;
    }

    .cta-highlights-arrow {
        width: 3vw;
        height: 3vw;
        top: 0;
        right: 0;
        fill: #000;
        padding: 0;
        border-radius: 12rem;
    }

    .cta-highlights-arrow {
        width: 8vw;
        height: 8vw;
        top: 0;
        right: 0;
        fill: #000;
        padding: 0;
        border-radius: 12rem;
    }

    .slider-arrow-container {
        display: flex;
        border: 0.5px solid #000;
        justify-content: center;
        align-items: center;
        padding: 2.7rem;
        position: absolute;
        cursor: pointer;
        border-radius: 15rem;
        top: unset;
        left: unset;
        right: 5vw;
        bottom: 9vh;
    }
}

@media (min-width: 279px) and (max-width: 319px) {
    html {
        font-size: 10px;
    }
}

@media (min-width: 320px) and (max-width: 359px) {
    html {
        font-size: 10.5px;
    }
}

@media (min-width: 360px) and (max-width: 389px) {
    html {
        font-size: 11px;
    }
}

@media (min-width: 390px) and (max-width: 413px) {
    html {
        font-size: 12.75px;
    }
}

@media (min-width: 414px) and (max-width: 429px) {
    html {
        font-size: 13px;
    }
}

@media (min-width: 430px) and (max-width: 479px) {
    html {
        font-size: 13.25px;
    }
}

@media (min-width: 480px) and (max-width: 539px) {
    html {
        font-size: 13.5px;
    }
}

@media (min-width: 540px) and (max-width: 599px) {
    html {
        font-size: 13.75px;
    }
}

@media (min-width: 600px) and (max-width: 679px) {
    html {
        font-size: 13.875px;
    }
}

@media (min-width: 680px) and (max-width: 767px) {
    html {
        font-size: 13.95px;
    }
}

@media (min-width: 768px) and (max-width: 823px) {
    html {
        font-size: 14px;
    }
}