MediaWiki:Foreground.css

/* ============================= */
/* DV-Wiki Rot Theme (#e2001a)   */
/* ============================= */

/* komplette obere Leiste */
.top-bar,
.top-bar-section > ul,
.top-bar-section > ul > li,
.contain-to-grid,
.tab-bar,
.fixed {
    background: #e2001a !important;
    border: 0 !important;
    box-shadow: none !important;
}

/* ============================= */
/* Nur Untermenü Hover tauschen */
/* ============================= */

/* Dropdown normal */
.top-bar-section .dropdown li > a {
    background: #e2001a !important;
    color: #ffffff !important;
    opacity: 1 !important;
}

/* Dropdown Hover: Farben tauschen */
.top-bar-section .dropdown li > a:hover,
.top-bar-section .dropdown li:hover > a {
    background: #ffffff !important;
    color: #e2001a !important;
    opacity: 1 !important;
}

/* aktiver Dropdown-Eintrag */
.top-bar-section .dropdown li.active > a {
    background: #ffffff !important;
    color: #e2001a !important;
    opacity: 1 !important;
}

/* Hover nur in der ersten Menüebene */
.top-bar-section > ul > li:not(.has-form) > a:hover {
    background: #e2001a !important;
    opacity: 0.85;
}

/* ============================= */
/* Suchfeld Styling              */
/* ============================= */
/* Container */
.top-bar .has-form form {
    display: flex !important;
    align-items: center !important;
    margin: 0 !important;
}

/* Eingabefeld */
.top-bar input,
.top-bar input[type="text"],
.top-bar input[type="search"],
#searchInput {
    height: 30px !important;
    line-height: 30px !important;
    padding: 0 14px !important;
    margin: 0 !important;
    width: 280px !important;   /* +20px breiter */

    border: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
    color: #444 !important;

    border-top-left-radius: 15px !important;
    border-bottom-left-radius: 15px !important;
    border-top-right-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

/* Suchbutton */
.top-bar .button.search,
.top-bar button.search,
#searchButton {
    height: 30px !important;
    line-height: 30px !important;
    padding: 0 16px !important;
    margin: 0 0 0 -1px !important;

    border: 0 !important;
    box-shadow: none !important;
    background: #fff !important;
    color: #e2001a !important;

    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-top-right-radius: 15px !important;
    border-bottom-right-radius: 15px !important;
}
#searchform {
    padding-top: 7px !important;
}

/* Foreground/Foundation-Defaults überall überschreiben */
@media only screen and (min-width: 40.0625em) {
    .top-bar {
        background: #e2001a !important;
        overflow: visible;
    }

    .top-bar-section .has-form {
        background: #e2001a !important;
        height: 2.8125rem;
        padding: 0 0.9375rem;
    }
}

.top-bar-section ul li {
    background: #e2001a !important;
}

@media only screen and (min-width: 40.0625em) {
    .top-bar-section .has-form form {
        display: flex !important;
        align-items: center !important;
        margin: 0 !important;
    }

    .top-bar input,
    .top-bar input[type="text"],
    .top-bar input[type="search"],
    #searchInput {
        height: 30px !important;
        line-height: 30px !important;
        padding: 0 14px !important;
        margin: 0 !important;
        width: 280px !important;
        border: 0 !important;
        box-shadow: none !important;
        background: #fff !important;
        color: #444 !important;
        border-top-left-radius: 15px !important;
        border-bottom-left-radius: 15px !important;
        border-top-right-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }

    .top-bar .button.search,
    .top-bar button.search,
    #searchButton {
        height: 30px !important;
        line-height: 30px !important;
        padding: 0 16px !important;
        margin: 0 0 0 -1px !important;
        border: 0 !important;
        box-shadow: none !important;
        background: #fff !important;
        color: #e2001a !important;
        border-top-left-radius: 0 !important;
        border-bottom-left-radius: 0 !important;
        border-top-right-radius: 15px !important;
        border-bottom-right-radius: 15px !important;
    }
}