/*
*
* !DO NOT EDIT THE CSS FILES, THEY ARE BUILT WITH THE LESS CSS!
* less/header/header.less
*
* ---------------------------
* Styles associated with the document header
* ---------------------------
*/
@import "../_mixins/all.less";
@import "../_mixins/spriteSheet.less";

@dir: '../';

#header {
    background: -moz-linear-gradient(top, rgba(0,0,0,0) 90%, rgba(100,100,100,0.40) 95%, rgba(114,114,114,0.60) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(90%,rgba(0,0,0,0)), color-stop(98%,rgba(100,100,100,0.40)), color-stop(100%,rgba(114,114,114,0.60))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, rgba(0,0,0,0) 90%,rgba(100,100,100,0.40) 95%,rgba(114,114,114,0.60) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, rgba(0,0,0,0) 90%,rgba(100,100,100,0.40) 95%,rgba(114,114,114,0.60) 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, rgba(0,0,0,0) 90%,rgba(100,100,100,0.40) 95%,rgba(114,114,114,0.60) 100%); /* IE10+ */
	background: linear-gradient(to bottom, rgba(0,0,0,0) 90%,rgba(100,100,100,0.40) 95%,rgba(114,114,114,0.60) 100%); /* W3C */
	padding: 4px;
	font-family: @brandFont;
	min-height: 40px;  /* Used to retain height for old #titelgraphic markup */
    -webkit-font-smoothing: antialiased;
	
	> a {
	    text-decoration: none;
	    height: 35px;
	    float: left;
	}
	
	#logo {
        #wdnSprite > .n_40(@dir);
        .text-hidden();
    }
}

#wdn_institution_title {
    display: none;
}

#wdn_site_title {
    display: block;
    font-size: 2em;
    line-height: 1.2;
    margin: 7px 0 -3px 45px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 70%;
    letter-spacing: -1px;
    
    a {
        text-decoration: none;
        color: #000;
    }
    
    span {
        display: none;
    }
    
    abbr {
        letter-spacing: 0;
        
        &:after {
            display: none;
        }
    }
}

/* Retain styles for old markup. Remove August 1, 2012*/
#titlegraphic {
    position: absolute;
    top: 4px;
    width: 66%;
    
    h1 {
        display: block;
        font-size: 2em;
        line-height: 1.2;
        margin: 7px 0 -3px 45px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        font-family: @brandFont;
        color: #000;
        
        a {
            text-decoration: none;
            color: #000;
        }
        
        span {
            display: none;
        }
    }
}

@media (min-width: 320px) {
    
}
@media (min-width: 480px) {

}
@media (min-width: 600px) {

}
@media (min-width: 768px) {
    #header {
        background: transparent;
        > a {
            position: relative;
            z-index: 1;
            margin-right: 2px;
        }
        
        #logo {
            #wdnSprite > .n_55(@dir);
        }
    }
    #wdn_institution_title {
        display: block;
        text-transform: uppercase;
        line-height: 0;
        font-weight: normal;
        margin: 13px 0 0 0;
    }
    
    #wdn_site_title {
        color:#555;
        font-size: 2em;
        
        a {
            color: #555;
        }
        
        span {
            display:block;
            font-size:25%;
            color:#6E6E6E;
            margin-top:-0.8em;
            letter-spacing:0em;
            text-transform:uppercase;
            font-family: @impactFont;
            line-height: 0.8;
        }
        
        abbr {
            color: #fff;
            
            &:before {
                color:#555;
                content: attr(title);
                height: auto;
                letter-spacing: -1px;
            }
        }
    }
    
    /* Retain styles for old markup. Remove August 1, 2012*/
    #titlegraphic {
        top: 17px;
        left: 16px;
        width: 66%;
    }
}
@media (min-width: 960px) {

}
@media (min-width: 1040px) {
    #header {
        margin: -53px -12px 0 -16px;
        background: none;
        min-height: 95px; /* Used to retain height for old #titelgraphic markup */
        
        > a {
            .border-radius(5px);
            margin: 12px 0 0 0;
            padding: 12px 12px 0 12px;
            position: inherit;
            
            &:after {
                content: '';
            }
            
            > img {
                width: auto;
            }
        }
        
        #logo {
            #wdnSprite > .sprite(@dir, @logo_x + 12, @logo_y + 10, 66px, 67px);
            background-color: #fff;
        }
        
        .corner-fix-bottom-left {
            #wdnSprite > .bottomLeftCorner(@dir);
            position: absolute;
            top: -5px;
            left: 90px;
        }
        
        .corner-fix-top-right {
            #wdnSprite > .topRightCorner(@dir);
            position: absolute;
            top: 0;
            right: 0;
        }
    }
    
    #wdn_institution_title {
        height: 0; /* Safari */
        margin: 13px 0 0 90px;
        padding: 12px 10px;
        color: #3e3e3e;
        font-size: 1.5em;
        text-shadow: 0 0 3px #fff;
    }
    
    #wdn_site_title {
        position: inherit;
        display: block;
        margin: 12px 0 0 99px;
        font-size: 2.5em;
        text-shadow: 0 0 3px #fff;
        font-weight: normal;
        line-height: 1.1;
        width: 71%;
    }
    
    /* Retain styles for old markup. Remove August 1, 2012*/
    #titlegraphic {
        top: 5px;
        left: 53px;
        font-size: 1.25em;
        text-shadow: 0 0 3px #fff;
        font-weight: normal;
        
        > h1 {
            letter-spacing: -1px;
            line-height: 1.1;
            color:#555;
        
            span {
                display:block;
                font-size:25%;
                color:#6E6E6E;
                margin-top:-0.6em;
                letter-spacing:0em;
                text-transform:uppercase;
                font-family: @impactFont;
                line-height: 0.8;
            }
            
            > a {
                color:#555;
            }
        }
    }
}