

#tablet-indicator,
#mobile-indicator {
    display: none;
}


.main {
    position: relative;
    /* min-height: 100%; */
    padding-top: 9rem;
    background-color: #1f1f1f;
}
    .main .main-menu-wrap{
        top: 0;
        position: fixed;
        width: 100%;
        background-color: white;
        color: #555;
        border-radius: 0;

        border: none;
        padding: 0;
        transition: none;
        -webkit-box-shadow: 0 1px 10px -6px rgb(0 0 0 / 42%), 0 1px 10px 0 rgb(0 0 0 / 12%), 0 4px 5px -2px rgb(0 0 0 / 10%);
        box-shadow: 0 1px 10px -6px rgb(0 0 0 / 42%), 0 1px 10px 0 rgb(0 0 0 / 12%), 0 4px 5px -2px rgb(0 0 0 / 10%);

    }
        .main .menu{
            display: flex;
            flex-direction: row;
            justify-content: flex-end;
        }
            .main .menu ul{
                display: flex;
            }
                .main .menu li{
                    display: flex;
                    width: 10rem;
                    text-underline: none;
                    list-style:none;

                }
                    .main .menu li a{
                        text-decoration:none;
                        color: #1f1f1f;
                        font-weight: bold;

                    }



.section {
    position: relative;
    background-color: #1f1f1f;
}

.inner {
    position: relative;
    width: 100%;
    max-width: 1170px;
    margin: 0 auto;
    padding: 0 2.5rem;
    z-index: 10;
    /* background-color: #fee; */
    /* outline: 1px solid pink; */
}

.content {
    float: left;
    width: 66%;
    padding-left: 2.5rem;
}

.content-full {
    width: 100%;
//padding-left: 2.5rem;
}

.relative {
    position: relative;
    z-index: 10;
    padding-top: 2rem;
}
.animation{
    height: 12000px;
    width: 100%;
}
    .animFixed{
        width: inherit;
        position: fixed;
        top: 0vh;
        left: 50vw;
        transform: translate(-50vw, 40vh);

    }
#container{
    overflow: hidden;
    z-index: 5;
}

.inner {
    width: 100%;

}
.inner img{
    aspect-ratio: 3.225 / 1;
    width: 60vw;
    left: 20vw;
    height: auto;
    position: absolute;
    overflow: hidden;

}
.inner .logo{
    aspect-ratio: auto;
    width: 50vw;
    left: 25vw;
    top: -16vh;
}
#number_plate{
    transform: translate(0,100%);
}


.fix_text_cams{
    aspect-ratio: 3.225 / 1;
    width: 150vw;
    left: 50vw;
    height: 28vh;
    position: absolute;
    display: flex;
    top: -25vh;
}

.fix_text{
    aspect-ratio: 3.225 / 1;
    width: 176vw;
    left: 0vw;
    height: 28vh;
    position: absolute;
    display: flex;
    top: -25vh;
    justify-content: center;
}
.fix_text_cams div{
    width: 30vw;
    height: 100%;
    margin: auto;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.fix_text div {
    width: auto;
    height: 100%;
    margin-left: 2vw;
    margin-right: 2vw;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.fix_text div:nth-child(4){
    width: 111vw;
}

.fix_text > * {
    flex: 1 1 auto;
}

.fix_text div span,
.fix_text_cams div span{
    color: white;
    line-height: 3vh;
    font-size: 2vh;
    text-align: justify;
}

.fix_text div h1{
    color: #C4003D;
    font-family: Vipnagorgialla !important;
    line-height: 6vh;
    font-size: 5vh;
}


.output {
    overflow: inherit;
    background-color: var(--background-primary);
    padding: 0;
    aspect-ratio: 3.225 / 1;
    width: 60vw;
    left: 20vw;
    height: auto;
    position: absolute;
}

#default-example {
    perspective: 15vw;
    perspective-origin: center;
    width: inherit;
    position: relative;
    height: auto;
    aspect-ratio: 3.225 / 1;
}

.output section {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    text-align: center;
}

#example-element {
    transform-style: flat;
    position: absolute;
    right: 11.5vw;
    top: 29%;
}

.front {
    //background: rgba(90,90,90,.7);
    transform: translateZ(0);
    //background-image: url("http://localhost/69/wp-content/themes/sixtynine/images/front.png");
}

.right {
    background: rgba(210,0,0,0);
    /*transform: rotateY(90deg);*/
}

.c1{
    transform: rotateY(90deg) translateZ(-0.10vw);
    background-image: url("https://testweb.69components.com/wp-content/themes/sixtynine/images/vacka3D/1.svg");
}
.c2{
    transform: rotateY(90deg) translateZ(-0.08vw);
    background-image: url("https://testweb.69components.com/wp-content/themes/sixtynine/images/vacka3D/2.svg");
}
.c3{
    transform: rotateY(90deg) translateZ(-0.06vw);
    background-image: url("https://testweb.69components.com/wp-content/themes/sixtynine/images/vacka3D/3.svg");
}
.c4{
    transform: rotateY(90deg) translateZ(-0.04vw);
    background-image: url("https://testweb.69components.com/wp-content/themes/sixtynine/images/vacka3D/4.svg");
}
.c5{
    transform: rotateY(90deg) translateZ(-0.02vw);
    background-image: url("https://testweb.69components.com/wp-content/themes/sixtynine/images/vacka3D/5.svg");
}
.c6{
    transform: rotateY(90deg) translateZ(-0.0vw);
    background-image: url("https://testweb.69components.com/wp-content/themes/sixtynine/images/vacka3D/6.svg");
}
.c7{
    transform: rotateY(90deg) translateZ(0.02vw);
    background-image: url("https://testweb.69components.com/wp-content/themes/sixtynine/images/vacka3D/7.svg");
}
.c8{
    transform: rotateY(90deg) translateZ(0.04vw);
    background-image: url("https://testweb.69components.com/wp-content/themes/sixtynine/images/vacka3D/8.svg");
}
.c9{
    transform: rotateY(90deg) translateZ(0.06vw);
    background-image: url("https://testweb.69components.com/wp-content/themes/sixtynine/images/vacka3D/9.svg");
}
.c10{
    transform: rotateY(90deg) translateZ(0.08vw);
    background-image: url("https://testweb.69components.com/69/wp-content/themes/sixtynine/images/vacka3D/10.svg");
}
.c11{
    transform: rotateY(90deg) translateZ(0.10vw);
    background-image: url("https://testweb.69components.com/69/wp-content/themes/sixtynine/images/vacka3D/11.svg");
}
.c12{
    transform: rotateY(0deg) translateZ(0.10vw);
    background-image: url("https://testweb.69components.com/69/wp-content/themes/sixtynine/images/vacky/vacky69_web2-01.svg");
}
.c13{
    transform: rotateY(0deg) translateZ(0.10vw);
    background-image: url("https://testweb.69components.com/69/wp-content/themes/sixtynine/images/vacky/vacky69_web2-02.svg");
}
.c14{
    transform: rotateY(0deg) translateZ(0.10vw);
    background-image: url("https://testweb.69components.com/69/wp-content/themes/sixtynine/images/vacky/vacky69_web2-04.svg");
}
.c15{
    transform: rotateY(0deg) translateZ(0.10vw);
    background-image: url("https://testweb.69components.com/69/wp-content/themes/sixtynine/images/vacky/vacky69_web2-05.svg");
}

.face {
    width: 3.4vw;
    height: auto;
    position: absolute;
    backface-visibility: inherit;
    font-size: 60px;
    color: #fff;
    background-size: contain;
    aspect-ratio: 1/1;
}

.grip{
    aspect-ratio: 3.225 / 1;
    width: 60vw;
    left: 20vw;
    height: auto;
    position: absolute;

}
.grip.left img{
    aspect-ratio: auto;
    left: 0;
    height: 100%;
    width: auto;
    position: absolute;
}
.grip.right img{
    aspect-ratio: auto;
    right: 0;
    height: 100%;
    width: auto;
    position: absolute;
    left: auto;
}