/*
Stylesheet      External Home
Theme Name      University of St Andrews 2008
URI             http://www.st-andrews.ac.uk
Version         5.0.2
Authors         gjms1
Description     Main University homepage
Last Updated    13 July 2009
*/

/* --------------- WELCOME TEXT --------------------------------------------- */

/* DESIGN Pushes whole section away from header and category columns */
#welcomewrapper {
    margin: 1em 0;
    }

/* DESIGN General background colour and height for all elements */
#welcomewrapper-inner, #welcometext, #welcomeimage {
    background-color: #c0d7ec;
    height: 250px;
    }

/* DESIGN Scotland's First University background colour and image */
#welcometext {
    background-image: url('http://www.st-andrews.ac.uk/media/v2-img_home_crestbg.gif');
    background-position: -60px -10px;
    background-repeat: no-repeat;
    display: inline;
    float: left;
    height: 250px;
    margin-right: 10px;
    max-width: 232px;
    width: 232px;
    }

/* DESIGN Scotland's First University introductory text */
#welcometext-inner {
    display: inline;
    float: left;
    height: 230px;
    margin: 10px 0 0 10px;
    width: 220px;
    max-width: 220px;
    }

/* DESIGN Adjust spaces between lines in #welcometext */
#welcometext-inner h2 {
    margin-bottom: 0.5em;
    }

p.welcometext-p1 {
    margin-bottom: 0.75em;
    }

/* FIX for IE6 that prevents welcometext box from growing too large */
.welcometext-p2 {
    margin: 0;
    padding: 0;
    }

/* --------------- WELCOME IMAGES ------------------------------------------- */

/* DESIGN Big image with text overlay */
#welcomeimage {
    display: inline;
    float: left;
    height: 250px;
    margin-right: 0;
    margin-left: 0px;
    max-width: 718px;
    overflow: hidden;
    position: relative;
    width: 718px;
    }

/* IMAGE This is necessary for IE5/6, otherwise it moves positioned text down 8px */
#welcomeimage img {
    height: 250px;
    position: absolute;
    top: 0;
    width: 718px;
    }

.featurecontainer {
    position: relative; /* creates positioning context */
    height: 250px;
    top: 0;
    width: 718px;
    }

/* DESIGN Dark glass effect on welcome image text */
.welcomeimage-text {
    background-image: url('http://www.st-andrews.ac.uk/media/v2-img_darkglass.png');
    background-repeat: repeat;
    bottom: 0;
    color: #fff;
    height: auto;
    left: 0;
    position: absolute;
    width: 718px;
    }

/* IMAGE Alternative background image for IE6 */
* html .welcomeimage-text {
    background-image: url('http://www.st-andrews.ac.uk/media/v2-img_darkglass.gif');
    }

/* HEADING Formatting for welcome-image text */
.welcomeimage-text h3 {
    color: #fff;
    font-weight: bold;
    margin: 0;
    padding: 10px 10px 5px 10px;
    }

.welcomeimage-text h3 a:link,
.welcomeimage-text h3:visited {
    color: #fff !important;
    text-decoration: underline !important;
    }

.welcomeimage-text h3 a:hover,
.welcomeimage-text h3:active {
    color: #fff !important;
    text-decoration: none !important;
    }

.welcomeimage-text a:link,
.welcomeimage-text a:visited {
    color: #fff;
    text-decoration: underline;
    }

.welcomeimage-text p {
    padding: 0 70px 10px 10px;
    margin: 0;
    }

.welcomeimage-text p a:hover,
.welcomeimage-text a:active {
    color: #fff !important;
    text-decoration: none !important;
    }

.welcomeimage-text acronym {
    color: #fff;
    font-size: 0.875em;
    }

/* positioning context */
#welcomewrapper-inner {
    position: relative;
    }

/* HACK! Fixes buggy IE6 absolute position bottom issue for navigation arrows
This makes the container too wide by 3px and changes the background colour to white
to disguise this! It's a fudge that Cadbury's would be proud of. */
* html #welcomewrapper-inner {
    background-color: #fff;
    width: 963px;}

#featurenav {
    background-color: transparent;
    bottom: 10px;
    color: #fff;
    height: 20px;
    position: absolute;
    right: 0;
    width: 50px;
    z-index: 9999 !important;
    }

/* In test -- until we decide where to stick the nav arrows */
/*.welcomeimage-text p {padding: 0 10px 10px 10px;}*/

/* Removes dotted marquee around link when arrow is clicked */
#featurenav a {outline-style: none !important;}

/* --------------- CAMPAIGN BUTTONS --------------------------------------------
3 Columns beneath welcome image and above four categories for fund-raising and
publicity buttons */

#campaignbuttons {
    margin-bottom: 1em;
    }

/* --------------- FOUR MAIN CATEGORIES ----------------------------------------
The four main highlighted/featured boxes beneath the main welcome text and image
on the external homepage. */

/* DESIGN Wrapper for four categories. */
#categories {
    clear: both;
    margin: 0;
    padding: 0;
    }

/* CLASS Roughly equivalent to span-8 */
.column1-4, .column2-4, .column3-4, .column4-4 {
    display: inline;
    float:left;
    margin-right: 10px;
    max-width: 232px;
    width: 232px;
    }

/* CLASS Last column needs to be 2 pixels wider as (4*232)+2 = 930px */
.column4-4 {
    margin-right: 0;
    max-width: 234px;
    width: 234px;
    }

/* HEADING - h3 in columns */
.column1-4 h3, .column2-4 h3, .column3-4 h3, .column4-4 h3 {
    color: #00529b;
    margin: 0.5em 0;
    }

/* LIST LINKS - Style links within 4-columns on external homepage */
.column1-4 li a, .column2-4 li a, .column3-4 li a, .column4-4 li a {
    color: #000;
    text-decoration: none;
    }

.column1-4 li a:hover, .column2-4 li a:hover, .column3-4 li a:hover, .column4-4 li a:hover,
.column1-4 li a:active, .column2-4 li a:active, .column3-4 li a:active, .column4-4 li a:active {
    text-decoration: underline !important;
    }

/* HEADING LINKS */
.column1-4 h3 a, .column2-4 h3 a, .column3-4 h3 a, .column4-4 h3 a {
    color: #00529b;
    text-decoration: none;
    }

.column1-4 h3 a:hover, .column2-4 h3 a:hover, .column3-4 h3 a:hover, .column4-4 h3 a:hover,
.column1-4 h3 a:active, .column2-4 h3 a:active, .column3-4 h3 a:active, .column4-4 h3 a:active {
    color: #00529b !important;
    text-decoration: underline !important;
    }

#categories div.column4-4 img {
    height: 150px !important;
    width: 234px !important;
    }

#categories div.column4-4 {overflow: hidden;}

/* Taller footer on external home to accommodate two lines of text: charity and address
Breaks in IE7, so there's an IE7 conditional hack in the body of the page */
#footer {
    height: 36px;
    line-height: 18px;
    margin: 0;
    padding: 0.5em 0;
    }

/* Override for Highlights column */
#newsevents-inner div#announce-list.homecolumn3-3 a:link,
#newsevents-inner div#announce-list.homecolumn3-3 a:visited {
    text-decoration: underline !important;
    }

#newsevents-inner div#announce-list.homecolumn3-3 h4 a:link,
#newsevents-inner div#announce-list.homecolumn3-3 h4 a:visited,
#newsevents-inner div#announce-list.homecolumn3-3 a:hover,
#newsevents-inner div#announce-list.homecolumn3-3 a:active {
    text-decoration: none !important;
    }

#newsevents-inner div#announce-list.homecolumn3-3 h4 a:hover,
#newsevents-inner div#announce-list.homecolumn3-3 h4 a:active {
    text-decoration: underline !important;
    }

/* --------------- ALERT ---------------------------------------------------- */
/* ALERT BOX Formats alert box on Current Staff/Students pages */

/* ALERT Outer box defines background colour and border */
#alert {
    background-color: #fff6bf;
    border: 2px solid #ffd324;
    color: #514721;
    clear: both;
    margin-bottom: 1em;
    position: relative;
    width: 956px;
    }

/* ALERT Inner box creates space for background image icon */
#alert-inner {
    background-color: transparent;
    margin: 10px 10px 10px 60px;
    width: 886px;
    }

/* ALERT Background image icons */
.alert, .emergency {background-image: url('http://www.st-andrews.ac.uk/media/v2-img_icon_alert.gif');}
.computer {background-image: url('http://www.st-andrews.ac.uk/media/v2-img_icon_computer.gif');}
.help {background-image: url('http://www.st-andrews.ac.uk/media/v2-img_icon_help.gif');}
.info {background-image: url('http://www.st-andrews.ac.uk/media/v2-img_icon_info.gif');}
.security {background-image: url('http://www.st-andrews.ac.uk/media/v2-img_icon_security.gif');}
.stop {background-image: url('http://www.st-andrews.ac.uk/media/v2-img_icon_stop.gif');}

.alert, .computer, .emergency, .help, .info, .security, .stop {
    background-repeat: no-repeat;
    background-position: 10px 10px;
    }

/* ALERT Creates margin between paragraphs only if there are more than one paragraph. This does not work in IE6. */
#alert-inner p + p {margin-top: 1em;}

/* ALERT Changes colours for certain classes of alert 8a1f11 */
.emergency, .stop {
    background-color: #fbe3e4 !important;
    border-color: #FBC2C4 !important;
    color: #000 !important;
    }