body {
 
    margin: 0;
    padding: 0; 

    /*background-image: url('stars2.gif');*/
    background-repeat: no-repeat;       
    background-position: 50% 50px;        
    background-size: 800px 1600px;             
    background-attachment: scroll;  
    background-color: #f8f8f8;
    cursor: url('cursor.png'), auto;

    
    
    font-family: 'neptunnik2','neptunnik', sans-serif;
    
    width: 100vw;
    min-height: 100vh;


    background-image: url('main-wallpaper.jpg');
    background-size: cover;
}
    body.other-page {
    background-image: url('stars2.gif'); 
    background-repeat: no-repeat;       
    background-position: 50% 50px;        
    background-size: 800px 1600px;             
    background-attachment: scroll;  
    background-color: #f8f8f8;
}
     body.other-page2 {
    background-image: url('image8.png'); 
    background-repeat: repeat;       
    background-position: 50% 50px;        
    background-size: 20% auto;             
    background-attachment: scroll;  
    background-color: #f8f8f8;
}

a, button, .clickable {
   cursor: url('cursor2.png') 16 0, pointer;
}

@font-face {
    font-family: 'neptunnik';
    src: url('fonts/neptunnik.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'neptunnik2';
    src: url('fonts/neptunnik2.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

footer {
    text-align: center; 
    padding: 20px 0;   
    margin-top: 1020px; 
}

footer2 {
    text-align: center;
    padding: 50px 0;    
    margin-top: 1000px;  
}

#splash-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #f8f8f8; 
    z-index: 9999;             
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;          
    transition: opacity 1.5s ease, visibility 1.5s ease; 
    opacity: 1;
    visibility: visible;
}

.splash-text {
    font-family:'neptunnik2','neptunnik', sans-serif;
    font-size: 50px;
    color: #c5c8d0;
    user-select: none;        
}

#splash-screen.hidden {
    opacity: 0;               
    visibility: hidden;       
}


.footer-container {
    width: 100px;
    display: flex;
    justify-content: center; 
    align-items: flex-start;           
    box-sizing: border-box;
    margin-top: 190px;
    position: absolute; 
    top: 0;           
    left: 51%;          
    transform: translateX(-50%); 
}

.top-center-img {
    width: 400px; 
    height: auto;  
    z-index: 10; 
    pointer-events: none; 

    animation: floatImage 3s ease-in-out infinite;
}

.footer-container2 {
    width: 60px;
    display: flex;
    justify-content: center; 
    align-items: flex-start;           
    box-sizing: border-box;
    margin-top: 996px;
    position: absolute; 
    top: 0;             
    left: 50%;        
    transform: translateX(-50%); 
}

.top-center-img2 {
    width: 70px; 
    height: auto;  
    z-index: 9; 
    pointer-events: none; 

}


@keyframes floatImage {
    0% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-6px); 
    }
    100% {
        transform: translateY(0px); 
    }
}

.title {
    font-family: 'neptunnik2','neptunnik', sans-serif;
    letter-spacing: 5px;
    font-size: 100px;
    color: #ac776b;
    font-weight: 900;
    text-align: center;
    margin-top: 60px;
}


.text {
    /*padding: 300px 50px;*/
    margin-top: 600px;
    margin-left: 250px;
    color: #8193bd;
    font-size: 40px;
    letter-spacing: 0.5px;
    line-height: 1px;
    text-decoration: none; 
    transition: all 0.4s ease; 
}
.link {
    margin-top: 50px ;
    color: #3d2a1e;

    letter-spacing: 0.5px;
    line-height: 20px;
    text-decoration: none; 
    transition: all 0.4s ease; 
}
.link:hover {
    color: #dd9e40;          
    text-decoration: underline; 
    box-shadow: 0 5px 15px rgba(255, 220, 66, 0.409);
    background-color: rgba(255, 190, 190, 0);
}


.links-container {
    display: flex;
    flex-wrap: wrap;          
    justify-content: space-between; 
    width: 400px;             
    margin: 10px auto;        
    row-gap: 5%;            
}
.link-top {
    margin-top: 950px;
    width: 100%;              
    text-align: center;   
    font-size: 25px;           
}
.link-left, .link-right {
    width: 45%;
    font-size: 25px;               
    text-align: center;      
}







/*--------------------------------------*/ /* TECHNICALWORKS.PAGE */ /*-----------------------------------------*/

.soon-img {
    width: 500px;
    margin-top: 50px;
    margin-left: 300px;  
}

.text-soon {
    position: absolute;
    z-index: 3;               
    top: -1%;
    left: 50%;
    transform: translate(-120%, 150%);
    width: 60%;              
    text-align: center;       
    padding: 0px;
}

.link-back {
    position: absolute;              
    top: 650px;
    left: 650px;              
    text-align: center;
    font-size: 30;       
}

/*-----------------------------------------------------------------------------------------------------*/





/*--------------------------------------*/ /* ABOUTME.PAGE */ /*-----------------------------------------*/

.aboutme-img{
    z-index: 2;
    width: 600px; 
     
}
.aboutme-img2{
    position: absolute;
    z-index: 4;
    width: 320px; 
    margin-left: -300px; 
    margin-top: 400px;  
}
.aboutme-img3{
    position: absolute;
    z-index: 5;
    width: 250px; 
    margin-left: 450px;  
    margin-top: 1300px; 
}

.link-back-aboutme{
    position: absolute;
    font-size: 30px;
    z-index: 3;               
    top: 200px;
    left: 50%;
    transform: translate(-50%, -50%);            
    text-align: center;       
    padding: 0px;   
}

.container-aboutme {
    position: relative;
    max-width: 1000px;       
    margin: 50px auto;        
    display: flex;
    justify-content: center;
}


.aboutme-text-block1 {
    position: absolute;
    z-index: 3;               
    top: 17%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 60%;              
    text-align: center;       
    padding: 0px;
}
.aboutme-text-block2 {
    position: absolute;
    z-index: 3;               
    top: 25%;
    left: 50%;
    transform: translate(-20%, -40%);
    width: 35%;               
    text-align: right;       
    padding: 0px;
}
.aboutme-text-block3 {
    position: absolute;
    z-index: 3;               
    top: 50%;
    left: 50%;
    transform: translate(-30%, -150%);
    width: 40%;               
    text-align: right;       
    padding: 0px;
}
.aboutme-text-block4 {
    position: absolute;
    z-index: 3;              
    top: 50%;
    left: 50%;
    transform: translate(-50%, -20%); 
    width: 59%;               
    text-align: center;     
    padding: 0px;
}
.aboutme-text-block5 {
    position: absolute;
    z-index: 3;               
    top: 50%;
    left: 50%;
    transform: translate(-70%, 50%);
    width: 40%;              
    text-align: left;       
    padding: 0px;
}

.text-aboutme {
    color: #8b9eca;
    font-size: 30px;         
    letter-spacing: 0.2px;
    line-height: 1.5;        
    margin-bottom: 15px;      
}

/*-----------------------------------------------------------------------------------------------------*/