/*
 * FREMO-NET
 * Copyright 2009 Valentin Funk
 *
 * The main stylesheets for the site.
 */

/*
 * The real basics.
 */

* {
    font-family: Verdana, Arial, Helvetica, sans-serif;
}

html {
}

body {
    background-image: url(../../Images/background.png);
    background-repeat: repeat-y;
    background-position: center top;
    background-color: #dcdcdc;
    font-size: 11px;
}

/* Images */

img {
    border: 0;
}

/* Links */

a {
    text-decoration: underline;
    color: #355cb9;
}

a:visited {
    color: #629ae4;
}

a:hover, a:focus {
    text-decoration: none;
    color: #355cb9;
}


/*
 * Special elements or containers.
 */

#subtitle {
    font-style: italic;
}

#last-change {
    font-style: italic;
}


/*
 * Content elements
 */

/* Headings */

#content h1, #content h2, #content h3, #content h4 {
    padding: 0;
    color: #555;
    font-weight: bold;
    font-family: Arial, Helvetica, sans-serif;
}

#content h1 {
    margin: 16px 0 12px 0;
    font-size: 18px;
}

#content h2 {
    margin: 16px 0 12px 0;
    font-size: 16px;
}

#content h3 {
    margin: 12px 0 8px 0;
    font-size: 15px;
}

#content h4 {
    margin: 12px 0 8px 0;
    font-size: 13px;
}

/* Paragraphs, list elements */

#content p {
    line-height: 16px;

    margin: 0 0 8px 0;
    padding: 0;
}

#content li {
    margin-left: 16px;
    padding: 0;

    line-height: 16px;
}

#content ul {
    margin: 8px 0 8px 0;
    padding: 0 0 0 0px;
}

#content ol {
    margin: 8px 0 8px 0;
    padding: 0 0 0 26px;
}

#content ul li {
    list-style-type: square;
}

/* Other specials */

#content pre {
    font-family: "Lucida Console", Courier, "Courier New";
    font-size: 12px;
    color: #355cb9;
}

/* Tables */

#content table {

}

#scrollToTopBtn {
    position: fixed;
    bottom: 20px; /* Abstand zum unteren Rand */
    right: 20px; /* Abstand zum rechten Rand */
    z-index: 99; /* Sorgt dafür, dass der Button über dem Inhalt liegt */
    border: none;
    outline: none;
    background-color: #333; /* Deine Wunschfarbe (z. B. TYPO3-Orange: #ff8700) */
    color: white;
    cursor: pointer;
    padding: 15px;
    border-radius: 50%; /* Macht den Button kreisrund */
    font-size: 18px;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.3s, transform 0.3s; /* Weicher Übergang beim Einblenden */
    opacity: 0; /* Standardmäßig unsichtbar */
    pointer-events: none; /* Klicks ignorieren, solange unsichtbar */
    box-shadow: 0px 4px 10px rgba(0,0,0,0.3);
}

    /* Hover-Effekt */
    #scrollToTopBtn:hover {
        background-color: #555;
        transform: scale(1.1); /* Wird beim Drüberfahren minimal größer */
    }

    /* Klasse zum Einblenden per JavaScript */
    #scrollToTopBtn.show {
        opacity: 1;
        pointer-events: auto; /* Klickbar machen */
    }