@import url('https://fonts.googleapis.com/css2?family=Ballet:opsz@16..72&family=Great+Vibes&family=Lobster&family=Londrina+Outline&family=Meddon&family=Monoton&family=My+Soul&family=Neonderthaw&family=Norican&family=Roboto:ital,wght@0,100..900;1,100..900&family=Splash&family=UnifrakturMaguntia&family=WindSong:wght@400;500&family=Yesteryear&display=swap');


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;

}

:root {
    --neon-green: #4bfb04;
    --neon-purple: #4f04fb;
}

body {
    background: black;
}

body::-webkit-scrollbar {
    display: none;
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateY(100vw);
        -webkit-transform: translateY(100vw);
        -moz-transform: translateY(100vw);
        -ms-transform: translateY(100vw);
        -o-transform: translateY(100vw);
}
    to {
        opacity: 1;
        transform: translateY(0vw);
        -webkit-transform: translateY(0vw);
        -moz-transform: translateY(0vw);
        -ms-transform: translateY(0vw);
        -o-transform: translateY(0vw);
}
}

@keyframes slideInLeft {
    from {
    
        transform: translateX(-100vw);
        -webkit-transform: translateX(-100vw);
        -moz-transform: translateX(-100vw);
        -ms-transform: translateX(-100vw);
        -o-transform: translateX(-100vw);
}
    to {
      
        transform: translateX(0vw);
        -webkit-transform: translateX(0vw);
        -moz-transform: translateX(0vw);
        -ms-transform: translateX(0vw);
        -o-transform: translateX(0vw);
}
}

@keyframes slideInRight {
    from {
        transform: translateX(100vw);
        -webkit-transform: translateX(100vw);
        -moz-transform: translateX(100vw);
        -ms-transform: translateX(100vw);
        -o-transform: translateX(100vw);
}
    to {
        transform: translateX(0vw);
        -webkit-transform: translateX(0vw);
        -moz-transform: translateX(0vw);
        -ms-transform: translateX(0vw);
        -o-transform: translateX(0vw);
}
}

.container-one {
    display: flex;
    justify-content: center;
    align-items: center;

}

.hero-section {
    width: 100vw;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.inner-hero-one {
    height: 60vh;
    width: auto;
    animation: slideIn 2s ease-in-out;
    -webkit-animation: slideIn 2s ease-in-out;
}

.inner-hero-one img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.contact-list {
    width: 20vw;
    list-style-type: none;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    animation: slideInLeft 2.5s ease-in-out;
    -webkit-animation: slideInLeft 2.5s ease-in-out;
}

.contact-list li a {
    font-size: 3rem;
    color: var(--neon-green);
    text-decoration: none;
    transition: 1s;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    -ms-transition: 1s;
    -o-transition: 1s;
}

.contact-list li a:hover {
    font-size: 2.6rem;
}

.inner-hero-two {
    color: var(--neon-purple);
    font-family: 'Roboto', cursive;
    margin-top: 5vh;
    animation: slideInRight 2.5s ease-in-out;
    -webkit-animation: slideInRight 2.5s ease-in-out;
}

.inner-hero-two h1 {
    font-size: 3rem;
    font-weight: 800;
    margin-bottom: 2vh;   
}

.inner-hero-two p {
    font-size: 1.5rem;
  
}