/*** Header stylesheet for manchester.ac.uk v2 (2013) ***/
/*** Copyright: (c) 2013 The University of Manchester, UK, all rights reserved. ***/
/*** Authors: Robert J Lambert ***/
/*** Thanks: Zurb Foundation, foundation.zurb.com; paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/; ***/

/*********** Table of Contents **************
:: Page Header - Logo, Page Title, Search
:: Fluid, Responsive Layouts
::: Tablet Layout
::: Mobile 320 Layout
::: Mobile 240 Layout
*/


/***********************************************************
 * Page Header - Logo, Title, Search, Mobile Navigation
*************************************************************/
#PageHeader { /* position: relative; */ padding: 20px 0 10px 0; /* z-index: 9999999999; */ }
#PageHeader a:hover { margin: 0; padding: 0; text-decoration: none; background: none; border-bottom: none; }
#PageHeader #Logo { margin: 0 0 10px 0; padding: 0; max-width: 180px; }
#PageHeader #Title { float:left; color: #660099; font-size: 1.8em; line-height: 2em; vertical-align:middle; }
#PageHeader #Title a { color: #660099; }
#PageHeader #Title a:hover { color: #7711aa; }
#PageHeader #MobileBtns #MobileSideNav_btn { margin-right: 6%; }
/* .lt-ie9 #PageHeader #Title { line-height: 1.1em; } */
/*******/


/* @media only screen and (max-width: 1600px) {
	#PageHeader #Title {  line-height: 1.1em;  }
} */
/******************************************
 * Tablet Landscape Layout: 1024px
************************************************/
@media only screen and (max-width: 1024px) {
}
@media only screen and (max-width: 900px) {
#PageHeader #Search #SearchOptions label, #PageHeader #SearchOptions a { margin: 0 1px; font-size: 11px; }
}

/*******  Fix page header / title to prevent vertical jump on page load  *******/
@media only screen and (min-width: 768px) {
#PageHeader { height: 110px; }
}

/******************************************
 * Tablet Portrait Layout: 768px
************************************************/
@media only screen and (max-width: 768px) {
/*#PageHeader { height: 100px; }*/
}

/******************************************
 * Mobile Layout: 767px-
************************************************/
@media only screen and (max-width: 767px) {
#PageHeader #Title { font-size: 175%; }
#PageHeader #MobileBtns { padding: 0; }
}
@media only screen and (max-width: 700px) {
#PageHeader #Title { font-size: 150%; width: 40%;/*  background: #890; */ }
}
@media only screen and (max-width: 650px) {
#PageHeader #Title { font-size: 150%; }
}
@media only screen and (max-width: 600px) {
#PageHeader #Title { font-size: 140%; }
}
@media only screen and (max-width: 550px) {
#PageHeader #Title { font-size: 130%; }
}

/******************************************
 *	Mobile Layout: 1px up to 480px
************************************************/
@media only screen and (max-width: 500px) {
#PageHeader #Title { font-size: 120%; }
}
@media only screen and (max-width: 450px) {
#PageHeader #Title { font-size: 110%; }
}
@media only screen and (max-width: 400px) {
}
@media only screen and (max-width: 320px) {
#PageHeader #Logo { min-width: 30% !important; max-width: 34% !important; margin-bottom: 10px; }
#PageHeader #Title { min-width: 66% !important; max-width: 70% !important; font-size: 90%; line-height: 1.1em; }
/*  #PageHeader #Logo { min-width: 100px !important; padding-right: 5px !important; }  */
/*  #PageHeader #Title { font-size: 90%; margin: 0px 0 0 0px; max-width: 60% !important; padding-left: 5px !important; padding-right: 5px !important; }  */
/*  #PageHeader #Search { max-width: 15% !important; padding-left: 5px !important; }  */
#PageHeader #Search { padding: 0; }
#PageHeader #Search #SearchOptions label, #PageHeader #SearchOptions #Search a, #PageHeader #Search input { margin: 0; font-size: 90%; }
#PageHeader #Search input[type="radio"] { width: 10px; height 10px;
}
#PageHeader #Search span { margin: 0; padding: 0; }
#PageHeader #MobileBtns { padding-right: 0 px; padding-left: 0px; }
#PageHeader #MobileBtns a { margin: 0; padding: 0; }
#PageHeader #MobileBtns #MobileSideNav_btn { margin-right: 0%; }
}
@media only screen and (max-width: 320px) and (orientation:landscape) {
#PageHeader #MobileBtns #MobileSideNav_btn { margin-right: 4%; }
}
@media only screen and (max-width: 280px) {
}