:root {
    --siteColorTheme: rgb(0, 68, 255);
    --windowTitleColor: white;
    --windowParagraphColor: rgb(255, 255, 255);
    --windowParagraphFontSize: 20px;    
    --windowWidth: 1200px;
    --windowImageSize: 500px;
    --windowBorderImage: url(img/gallery/border.png);
    --windowBackground: url(img/gallery/windowbg.gif);
    --cursor: url('img/gallery/cursor.cur');
    --Background: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(0, 0, 69)50%, rgb(0, 0, 0) 100%);
}

.sidebar h1 {
    animation: SideBarTitlePulse 7.5s alternate infinite;
}

.title h1 {
    animation: MainTitlePulse 7.5s alternate infinite;
}

.mainpage {
    animation: IntroMainPage 1.5s forwards;
}

.window img {
    align-items: center;
    width: auto;
    height: 200px;
    left: 50%;
    margin-top: 20px;
    margin-bottom: 20px;
    box-shadow: 0 0 15px rgb(0, 0, 0);
    border: solid 5px black;
    transition: 0.1s;
    background-color: black;
}

.window img:hover {
    transform: scale(2);
}

@keyframes IntroSidebarLeft {
    from {
        margin-left: -30%;
    }
    to {
        margin-left: 0%;
    }
}

@keyframes IntroSidebarRight {
    from {
        margin-right: -30%;
    }
    to {
        margin-right: 0%;
    }
}

@keyframes IntroMainPage {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0%);
    }
}

@keyframes IntroWebRingsAndMusicCredits {
    from {
        transform: translateY(-500%);
    }
    to {
        transform: translateX(0%);
    }
}

@keyframes MoveText {
    0% {
        transform: translateX(0%);
    }
    100% {
        transform: translateX(-14.4%);
    }
}

@keyframes SideBarTitlePulse {
    from {
          color:rgb(255, 255, 255);
    }
    to {
          color: var(--siteColorTheme)
    }
}

@keyframes MainTitlePulse {
    from {
        color:rgb(255, 255, 255);
        transform: scale(1.6);
  }
  to {
        color:var(--siteColorTheme);
        transform: scale(2);
  }
}