/* project.css (media queries included)  */

/* ========================================================
   Elements
   ======================================================== */
   
/* --------------------------------------------------------
   Base (Mobile)
   -------------------------------------------------------- */
#logo, #logo-alternate{
    width:100%;
}

#content #navigation {
    width: 100%;
}

#content #navigation ul {
    text-align: center;
    margin-left: 0;
    margin-top: 1em;
}

#content #navigation li {
    list-style-type: none;
    padding-left: 0;
    padding-right: 4.5%;
}

#content #navigation li::before {
    content: "";
}

#navigation li a {
    font-size: 1.7em;
    font-weight: 400;
    text-transform: uppercase;
}

.icon-arrow-right:after{
    content: "=";
    display: inline-block;
    font-family: "mb-icons";
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    line-height: 1em;
    margin-left: 0.2em;
    margin-right: 0.2em;
    margin-top: 0.2em;
    text-align: center;
    text-decoration: inherit;
    text-transform: none;
    width: 1em;
    float:right;
}

#content .border{
    margin-bottom: 1.8em;
}

/* Global */

/* --------------------------------------------------------
   Tablet
   -------------------------------------------------------- */
@media (min-width: 768px) {

   #content #navigation{
       padding-top: 12em;
   }
   
   #content #navigation ul {
        margin-top: 0;
    }
    
   #content #navigation li {
        display: inline;
    }
    
    #content #navigation li {
        padding-right: 2.3%;
    }
    
    #navigation li a {
        font-size: 1.05em;
    }
    
    body.en #content #navigation li {
        padding-right: 2.7%;
    }
    
    body.en #navigation li a {
        font-size: 1.1em;
    }
    
    #content #navigation li a.last{
        padding-right:0;
    }
} /*@media Tablet */
   
/* --------------------------------------------------------
    Screen
   -------------------------------------------------------- */
@media (min-width: 1108px) {

    #content #navigation{
       padding-top: 17em;
   }
    
    body.de #content #navigation li {
        padding-right: 4.3%;
    }
    
    body.de #navigation li a {
        font-size: 1.5em;
    }
    
    body.en #content #navigation li {
        padding-right: 4.4%;
    }
    
    body.en #navigation li a {
        font-size: 1.6em;
    }
    
    h2{
        font-size: 3em;    
    }

} /*@media Screen */

/* --------------------------------------------------------
    Widescreen
   -------------------------------------------------------- */
@media (min-width: 1780px) {
    #content #navigation{
       padding-top: 28em;
   }
    
    body.de #content #navigation li {
        padding-right: 4.6%;
    }
    
    body.de #navigation li a {
        font-size: 1.9em;
    }
    
    body.en #content #navigation li {
        padding-right: 4.9%;
    }
    
    body.en #navigation li a {
        font-size: 2em;
    }

} /*@media Widescreen */
   
/* ========================================================
   new Colors
   ========================================================

   Primär:      #8091A0 (Taubenblau)
   Sekundär:    #0058a2 (Blau)
   Tertiär:     #000000 (Schwarz)
   Icons:       #0058a2
   Links:       #0058a2
   Schrift:     #000000
   H3:          #8091A0 (Taubenblau)
   Highlight:   #E4E4E4
   
   ======================================================== */

/* Base */

body.home {
    background-color: #fff;
}

header {
    background-color: transparent;
}

#side-panel li a {
    background-color: #0058a2;
    color: #fff; 
}

a .icon-side-home-item1,
a .icon-side-home-item3,
a .icon-side-home-item5 {
	background-color: #000;
}

a .icon-side-home-item2,
a .icon-side-home-item7 {
    background-color: #e4e4e4;
}
a .icon-side-home-item4,
a .icon-side-home-item6,
a .icon-side-home-item8,
a .icon-side-home-item9 {
    background-color: #fff; 
}

/* Ausklapp-Mobil-Navigation */
.mobile-nav-toggle, 
.mobile-search-button {
    color: #000;
}

.nav-mobile-wrap {
    background: #000;
}

.mobile-nav-toggle.mobile-nav-toggle-active {
    color: #8091A0;
}

a {
    color: #0058a2;
}

a.link-highlight, 
a.link-highlight-block {
    background-color: #363d36;
    color:#fff;
}

#navigation {
    background: #0058a1;
}
#navigation li a {
    color:#fff;
}

p, li, table {
    color: #000;
}

h2 {
    color: #0058a1;
}

h3 {
    color: #237523;
}

.col-highlight h3,
#content .highlight h3,
.border h3 {
    color: #000;
}

h4, h5 {
    color: #000;
}

#content hr,
.downloadcenter-category {
    border-bottom-color: #000;
}

/* Cookie-Hinweis */
.cookie-confirm {
	background-color: #0058a1;
}

.cookie-confirm:hover {
	background-color: #237523;
}

/* Forms */
.form-control:focus {
    border-color:#000;
}
    
label {
    color: #000;
}

legend {
    color: #000;
}

.form-control {
    background-color: #E4E4E4;
    border-color: #E4E4E4;
    color: #000;
}

/* Tabellen */
.table-responsive{
    border-color: #cbcbcb;
}

.table > thead > tr > th {
    background-color: #E4E4E4;
    color: #000;
}

.table-color > thead > tr > th {
    background-color: #8091A0;
    color: #fff;
}

.table > tbody > tr > th, 
.table > tfoot > tr > th, 
.table > thead > tr > td, 
.table > tbody > tr > td, 
.table > tfoot > tr > td {
    color: #000;
    background-color: #fff;
}

.table-color > tbody > tr > th, 
.table-color > tfoot > tr > th, 
.table-color > thead > tr > td, 
.table-color > tbody > tr > td, 
.table-color > tfoot > tr > td {
    background-color: #E4E4E4;
    color: #000;
}

.table-striped > tbody > tr > td, 
.table-striped > tbody > tr > th {
    background-color: #E4E4E4;
}

.table-striped > tbody > tr:nth-child(2n+1) > td, 
.table-striped > tbody > tr:nth-child(2n+1) > th {
    background-color: #fff;
}

.table-striped > tbody > tr:nth-child(2n) > td, 
.table-striped > tbody > tr:nth-child(2n) > th {
    background-color: #E4E4E4;
}

.table-color.table-striped > tbody > tr:nth-child(2n+1) > td, 
.table-color.table-striped > tbody > tr:nth-child(2n+1) > th {
    background-color: #fff;
}

.table-color.table-striped > tbody > tr:nth-child(2n) > td, 
.table-color.table-striped > tbody > tr:nth-child(2n) > th {
    background-color: #E4E4E4;
}

.table > tbody > tr > th, 
.table > tbody > tr > td {
    border-bottom-color: #000;
}

/* Content */
#content blockquote {
    border-left-color: #8091A0;
}

#content li:before {
    color: #237523;
}

#content ul ul li:before {
    color: #000;
}
 
.col-highlight,
#content .highlight,
#content .ui-tabs-panel .highlight,
#content .accordion-navigation .highlight{
    background-color: #deeaf1;
}
#content .col-highlight .highlight{
    background-color: #fff;
}

.text-success a,
.text-error a,
a.gsa-spellcheck-link b {
    color: #000;
}

#content .anchor-links li a {
    background-color: #E4E4E4;
    border-color: #E4E4E4;
    color: #000;
}

#content .anchor-links-color li a {
    background-color: #8091A0;
    border-color: #8091A0;
    color: #fff;
}

.img-border img,
#content .border{
    border-color: #0058a1;
}


#nav-meta ul li a, 
#nav-lang ul li a, 
#nav-footer ul li a,
#nav-social ul li a,
#footer-copyright {
    color: #000;
}

#nav-level2 ul li.nav-level2-li-active a.nav-level2-current, 
#nav-level2 ul li.nav-level2-li-active span, 
#nav-level3 ul li.nav-level3-li-active span {
    background-color: #000;
    color: #fff;
}

#nav-level2 ul li a { 
    color:#000;
}

#nav-level3 ul li a {
    color: #000;
}

#nav-level2, 
#nav-level3 {
    border-bottom-color: #E4E4E4;
}

#nav-main ul li span {
    color: #000;
    border-bottom-color: #000;
}

.news, 
.news-noscript,
.news-button {
    background-color: #E4E4E4;
}

.news-content-slider li p {
    color: #000;
}

.news-content-slider li p a {
    color: #0058a2;
}

.icon-news-left:before, 
.icon-news-right:before {
    color: #000;
}

h2.news-header {
    background-color: #000;
    color: #fff;
}

.icon-gallery-zoom:before {
    color: #0058a2;
}

.pressphoto-img {
    background-color: #000;
}

.quotation {
    background: #8091A0;
}

.quotation p{
    color: #fff;
}

.quotation .icon-news-left:before, 
.quotation .icon-news-right:before {
    color: #fff;
}

/* Fancybox */
#fancybox-loading, 
.fancybox-close, 
.fancybox-prev span,
.fancybox-next span,
#fancybox-buttons ul {
    background-color: #0058a2;
}

/* Tiles */
.tile {
    background-color: #000;
    border-color: #000;
    color: #fffv;
}

#tile-big;
#tile-event {
    background-color: transparent;
}

/* Tile Links */
a.tile-text-link {
    background: #000;
    color: #fff;
}

/* Tile Search */
#tile-search {  
    background-color: #8091A0;
    border-color: #8091A0;
}

/* Suche */
.gsa-search input {
    background-color: #fff;
    color: #0058a2;
}

.tile .tile-search-inner {
    border-color: #8091A0;
    background-color: #8091A0;
}

.nav-level2-search .tile-search-inner {
    border-color: #8091A0;
    background-color: #8091A0;
}

.tile-search-content h3 {
    background-color: #fff;
    color: #0058a2;
}

.gsa-search-mobile {
    background-color: #8091A0;
}

input.gsa-search-mobile-input {
    color: #0058a2;
    text-transform: none;
}

.gsa-search-mobile-button {
    background-color: #8091A0;
    color: #fff;
}

.gsa-spellcheck, 
.gsa-related-queries, 
.gsa-keymatch, 
.gsa-result {
    border-bottom-color: #000;
}

/* GSA Content Search */
.gsa-content-search,
#content .gsa-content-search-option,
#content button.gsa-content-search-button,
#content .gsa-content-search-button:hover {
    background-color: #000;
}

#content #gsa-content-search-select {
    background-color: #E4E4E4;
    color: #000;
}

#content .gsa-content-search-button {
    color: #fff;
}

/* Tab-Navigation */
#content .ui-tabs .ui-tabs-panel {
    background-color: #fff;
    border-color: #000;
}

#content ul.ui-tabs-nav .ui-state-active {
    background-color: #fff;
    border-color: #000;    
}

#content .tab-navigation .ui-state-default {
    background-color: #000;
    border-color: #000;
}

#content .tab-navigation-colored .ui-state-default {
    background-color: #8091A0;
    border-color: #8091A0;
}

#content .tab-navigation .ui-state-default a {
    color: #fff;
    background-color: #000;
}

#content .tab-navigation-colored .ui-state-default a {
    color: #fff;
    background-color: #8091A0;
}

#content .tab-navigation-colored .ui-widget-header .ui-state-active a, 
#content .tab-navigation .ui-widget-header .ui-state-active a{
    background: #fff;
    color: #000;
}

/* Akkordeon-Navigation */

.accordion-navigation-link,
.ui-accordion .ui-accordion-header {
    background-color: #E4E4E4;
    border-color: #E4E4E4;
    color: #000;
}

.accordion-navigation-colored .accordion-navigation-link, 
.accordion-navigation-colored .ui-accordion-header {
    background-color: #8091A0;
    border-color: #8091A0;
    color: #fff;
}

.ui-accordion .ui-accordion-header.ui-state-active {
    background-color: #fff;
    border-color:#000;
    color: #000;
}

.accordion-navigation-box{
    border-color: #000;
}

.accordion-category {
    background-color: #0058a2;
    color: #fff;
}

.accordion-navigation .ui-state-default .ui-icon {
    background-image: url(/Funkturm-Berlin/Layout/Images/ft_accordion_down.svg);
}

.accordion-navigation-colored .ui-state-default .ui-icon {
    background-image: url(/Funkturm-Berlin/Layout/Images/ft_accordion_down_color.svg);
}
 
.accordion-navigation .ui-state-active .ui-icon,
.accordion-navigation-colored .ui-state-active .ui-icon {
    background-image: url(/Funkturm-Berlin/Layout/Images/ft_accordion_up.svg);
}

/* A-Z-Liste */
#content .page-navigation li span {
    background-color: #E4E4E4;
    border-color: #E4E4E4;
    color: #000;
}

#content .page-navigation li a {
    background-color: #8091A0;
    border-color: #8091A0;
    color: #fff;
}

#content .page-navigation li span.page-navigation-active {
    background-color: #fff;
    border-color: #000;
    color: #000;
}

/* Sitemap */
#content .sitemap ul.sitemap-level1 li a {
    background-color: #000;
    color: #fff;
}

#content .sitemap ul.sitemap-level1 ul.sitemap-level2 li a {
    background-color: #E4E4E4;
    color:#000;
}

#content .sitemap ul.sitemap-level1 ul.sitemap-level2 ul.sitemap-level3 li a {
    background-color: #fff;
    color: #000;
}

/* Buttons */
#content button {
    background-color: #E4E4E4;
    color: #000;
}

#content button.btn-colored,
a.button-link {
    background-color: #8091A0;
    color: #fff;
}

/* Blätterkatalog */
.b-controls {
    color: #000;
}

.b-selector .b-current,
.b-selector ul,
.booklet .b-tab,
.booklet .b-counter {
    background-color: #E4E4E4;
    color: #000;
}

.b-selector a {
    color: #0058a2;
}

/* Pressemitteilungen */
.pressreleases-date,
.pressreleases-details-date,
.pressreleases-archive-date {
    color: #000;
}

.col-options,
.pressreleases-archive-options {
    border-bottom-color: #000;
    border-top-color: #000;
}

/* Progress Bar */
progress {
    background-color: #8091A0;
}

progress[role],
progress[aria-valuenow]:before {
    background-color: #000;
}

progress[aria-valuenow] {
    background: #8091A0;
}

progress::-moz-progress-bar {
    background-color: #000; 
}

progress::-webkit-progress-bar {
    background-color: #8091A0;
}

progress::-webkit-progress-value {
    background-color: #000;
}

progress[aria-valuenow]:before {
    background-color: #000;
}

/* Loader */
.icon-loader-animation {
    border-color: #8091A0 #8091A0 #8091A0 #000;
}

/* Usercentrics Overlay / Embedding wrapper */
#content .uc-embedding-wrapper h3 {
  color: #0058a1;
}

#content .uc-embedding-wrapper button.uc-embedding-accept {
  background-color: #8091A0;
  border-color: #8091A0;
  color: #ffffff;
}

/* Tablet Colors */
@media (min-width: 768px) {     
    /* Funkturm-Landingpage */
   
    body.content {
        background: #fff url(/Funkturm-Berlin/Layout/Images/ft_background_tablet.jpg) center top no-repeat;
    } 
    
    #navigation{
        background: transparent;
    }
    #navigation li a {
        color:#0058a1;
    }
    
    /* Side-Panel */
    #side-panel li a:hover {
        background-color: #237523;
        color: #fff;
    }
    
    a:hover .icon-side-home-item1,
    a:hover .icon-side-home-item3,
    a:hover .icon-side-home-item5 {
        background-color: #E4E4E4;
     }
    
    a:hover .icon-side-home-item2,
    a:hover .icon-side-home-item7 {
        background-color: #000;
    }
    a:hover .icon-side-home-item4,
    a:hover .icon-side-home-item6,
    a:hover .icon-side-home-item8,
    a:hover .icon-side-home-item9 {
        background-color: #fff; 
    }
    
    /* Tiles */
    .tile:hover {
        border-color: #fff;
    }
    
    a.tile-text-link:hover {
        background-color: #fff;
        color: #000;
    }
    
    /* Navigation */

    #nav-main ul li a.nav-main-current, 
    #nav-main ul li a.nav-main-active, 
    #nav-main ul li span {
        color: #000;    
        border-bottom-color: #000; 
    }

    #nav-main ul li a {
        color: #000;
    }
    
    #nav-meta ul li a:hover, 
    #nav-lang ul li a:hover, 
    #nav-social ul li a:hover,
    #nav-footer ul li a:hover {
        color: #0058a2;
    }
    
    #nav-main ul li a:hover {
        color: #8091A0;     
        border-bottom-color: #8091A0; 
    }

    #nav-level2 ul li {
        border-color: #fff;
    }

    #nav-level2 ul li:hover {       
        border-color: #8091A0;
    }
    
    #nav-level2 ul li.nav-level2-li-active {
        border-color: #000;
    }

    #nav-level2 ul li a {
        background-color: #fff;
        color: #000;
    }

    #nav-level2 ul li a:hover {
        background-color: #8091A0;  
        color: #000;
    }

    #nav-level2 ul li span,
    #nav-level2 ul li.nav-level2-li-active a.nav-level2-current, 
    #nav-level2 ul li.nav-level2-li-active span {
        background-color: #000;
        color: #fff;
    }
    
    #nav-level3 ul li a {
        color: #000;
    }

    #nav-level3 ul li a:hover {
        background-color:#8091A0;
        color: #000;
    }

    #nav-level3 ul li.nav-level3-li-active span {
        background-color: #000;
        color: #fff;
        font-weight: 700;
    }
    
    #content .page-navigation li a:hover {
        background-color: #E4E4E4;
        border-color: #E4E4E4;
        color: #000; 
    }

    #content .anchor-links li a:hover,
    #content .anchor-links-color li a:hover {
        background-color: #fff;
        border-color: #000;
        color: #000;
    }
    
    a.link-highlight:hover, 
    a.link-highlight-block:hover {
        background-color: #000;
        color: #fff;
    }
    
    /* Forms */
    .form-control {
        background-color: #fff;
        border-color: #fff;
    }
    
    .form-elements {
        background-color: #E4E4E4;
    }

    legend,
    label,
    #content p.help-block {
        color: #000;
    }
    
    .bahn-widget label,
    .bahn-widget legend {
        color: #000;
    }
    
    .captcha-group a {
        color: #0058a2;
    }
    
    /* Tabellen */
    .table-hover > tbody > tr:hover > td,
    .table-hover > tbody > tr:hover > th {
        background-color: #ddd;
    }
    .table-hover.table-color > tbody > tr:hover > td {
        background-color: #ddd;
    }
        
    /* Akkordeon */
    .accordion-category {
        background-image: url(/Funkturm-Berlin/Layout/Images/ft_accordion_category.png);
        background-color: #E4E4E4;
        color: #fff;
    } 
    
    .accordion-navigation-colored .accordion-category {
        background-color: #8091A0;
    }
    
    .ui-accordion-header.ui-state-active .accordion-category, 
    .ui-accordion-header:hover .accordion-category {
        background-image: url(/Funkturm-Berlin/Layout/Images/ft_accordion_category.png);
    }
    
    .ui-accordion.accordion-navigation .ui-accordion-header:hover, 
    .ui-accordion.accordion-navigation .ui-state-hover,
    .ui-accordion.accordion-navigation-colored .ui-accordion-header:hover, 
    .ui-accordion.accordion-navigation-colored .ui-state-hover {
        background-color: #fff;
        border-color: #000;
        color: #000;
    }

    .accordion-navigation .ui-state-default.ui-accordion-header:hover .ui-icon,
    .accordion-navigation-colored .ui-state-default.ui-accordion-header:hover .ui-icon {
        background-image: url(/Funkturm-Berlin/Layout/Images/ft_accordion_down.svg);
    }
    
    .accordion-navigation .ui-state-default.ui-state-active.ui-state-hover .ui-icon,
    .accordion-navigation-colored .ui-state-default.ui-state-active.ui-state-hover .ui-icon {
        background-image: url(/Funkturm-Berlin/Layout/Images/ft_accordion_up.svg);        
    }
    
    /* Tab-Navigation */
   
   #content .tab-navigation .ui-state-hover {
        border-color: #E4E4E4;
    }
    
    #content .tab-navigation .ui-state-default.ui-state-hover a,
    #content .tab-navigation-colored .ui-state-default.ui-state-hover a {
        background-color: #E4E4E4;
        color: #000;
    }
    
    #content .tab-navigation .ui-state-active.ui-state-hover a,
    #content .tab-navigation-colored .ui-state-active.ui-state-hover a {
        background-color: #fff;
        color: #000;
    }

    #content ul.ui-tabs-nav .ui-state-active.ui-state-hover {
        border-color: #000;
    }
    
    /* Pressemitteilungen */
    .pressreleases-item {
        background-color: #E4E4E4;
    }

    #content .pressreleases-item h3 a, 
    #content .pressreleases-archive-item h3 a {
        color: #8091A0;
    }
    
} /*@media Tablet Colors */

/* Screen Colors */
@media (min-width: 1108px) {

    /* Global */
    #screen-fixed {
        background-color: transparent;
    }    
    
    #screen-fixed.on-scrolling {
        display: none;
    }     
    
    body.content {
        background-image: url(/Funkturm-Berlin/Layout/Images/ft_background_screen.jpg);
    }   

    #nav-main ul.nav-second {
        background-color: #fff;
    }    
    
    #nav-main ul.nav-second li a, 
    #nav-main ul.nav-second li span {
        color: #000;
    }

    .quotation button:hover .icon-news-left:before, 
    .quotation button:hover .icon-news-right:before {
        color: #8091A0;
    }
    
    #content .quotation button:hover {
        background-color: #000;
        color: #8091A0;
    }
    
    h2.news-header:hover {
        background-color: #000;
        color: #fff;
    }

    /* Buttons */
    #content button:hover {
        background-color: #000;
        color:#fff;
    }
    
    #content button.btn-colored:hover,
    a.button-link:hover {
        background-color: #000;
        color: #fff;
    }

    /* Suche */
    .gsa-dynamic-navigation-headline {
        background-color: #E4E4E4;
        color:#000;
    }

    #content .gsa-content-search-button:hover{
        color:#8091A0;
    }
    
    /* Blätterkatalog */
    .booklet .b-tab:hover {
        background-color: #8091A0;
        color: #fff;
    }

    .b-selector a:hover {
        color: #000;
    }
    
} /*@media Screen Colors */

/* --------------------------------------------------------
    Widescreen
   -------------------------------------------------------- */
@media (min-width: 1780px) {
    
    body.content {
        background-image: url(/Funkturm-Berlin/Layout/Images/ft_background_wide.jpg);
    } 
}
