/*
Theme Name      School of International Relations
Theme URI       http://www.st-andrews.ac.uk
Description     School of International Relations, University of St Andrews
Version         1.0
Authors         gjms1 & sde1
Last updated    Monday 12 November 2007
*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p{
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
}

body {
    background-color: #808080;
    color: #000;
    font-family: Verdana, Arial, Helvetica, "sans-serif";
    font-weight: normal;
    font-size: 12px;
    line-height: 16px;
    margin: 0 auto;
    padding: 0 0 0 0;
    text-align: center; /* Centers the page content container in IE 5 browsers. */
    }

p{
margin-top:5px;
margin-bottom:5px;
}

/* =headings ===================================================================

h1
    see #container #header h1 below */

h2 {
  font-family: Verdana, Arial, Helvetica, "sans-serif";
  color: #000;
  font-size: 18px;
  font-weight: bold;
  line-height: 22px;
  margin-bottom: 1.28em;    /* font-size divided by line-height in ems */
}

h3 {
  font-family: Verdana, Arial, Helvetica, "sans-serif";
  color: #000;
  font-size: 14px;
  font-weight: bold;
  line-height: 14px;
  margin: 20px 0 10px 0; 
}

h4 {
  font-family: Verdana, Arial, Helvetica, "sans-serif";
  color: #000;
  font-size: 12px;
  font-weight: bold;
  line-height: 14px;
}

/* =links ====================================================================*/
/* Sets the style for unvisited links. */
a,  a:link {
  color:  #3F82BD;
  font-weight: bold;
  text-decoration: underline;
}
/* Sets the style for visited links. */
a:visited {
  color:  #3F82BD;
  font-weight: bold;
  text-decoration: underline;
}
/* Sets the style for links on mouseover. */
a:hover {
  color:  #3F82BD;
  text-decoration: none;
}
/* Sets the style for a link that has focus. */
a:focus {
  color: #3F82BD;
}
/* Sets the style for a link that is being activated/clicked. */
a:active {
  color:  #3F82BD;
}

/* =tables ===================================================================*/

table {
    border-collapse: collapse;
    border-top: 1px solid #a7b0c9;          /* Blue Nowhere (rgb 167, 176, 201) */
    border-bottom: 1px solid #a7b0c9;
    margin: 10px 0;
    padding: 0;
    text-align: left;
    vertical-align: top;
    width: 100%;
    }

    caption {
        caption-side: top;
        color: #000;
        font-weight: bold;
        margin-top: 15px;
        text-align: left;
        }

    thead, th {
        background-color: #a7b0c9;              /* Blue Nowhere (rgb 167, 176, 201) */
        color: #fff;
        }

    th[scope="row"] {
        background-color: transparent;
        width: 300px;
		color:black;
        }

    tr {
        text-align: left;
        vertical-align: top;
        }

    tr.even {
        background-color: #f1f1ee;          /* Warm Grey (rgb 241, 241, 281) */
        }

    td, th {
        padding: 2px;
        text-align: left;
        vertical-align: top;
        }

    tfoot {
        font-style: italic;
        }

table.noborder{
    border-top: 1px solid white;          /* Blue Nowhere (rgb 167, 176, 201) */
    border-bottom: 1px solid white;
}


/* =container ================================================================*/
#container {
    background: transparent url('http://www.st-andrews.ac.uk/media/IR/images/background.gif') repeat-y top left;
    clear: both;
    height: auto;
    margin: 0 auto;
    padding: 0;
    position: relative;
    text-align: left; /* Redefines the text alignment defined by the body element. */
    width: 1000px;
    }

/* #container is relatively positioned which means that other elements can be
absolutely positioned relative to it.  I've applied a background image to the
container, and then absolutely positioned images top and bottom, effectively on
a layer above the container.

So you have to take these into account when positioning stuff in the header and
footer as these images are taking up some of the space there.
*/

    #container img#top {
        top: 0;
        position: absolute;
        z-index: 1;
        }

    #container img#bottom {
        bottom: -1px;   /* hack for IE6 - gap shows if bottom: 0;*/
        left: 0;
        position: absolute;
        z-index: 1;
        }


/* =header ===================================================================*/
#container #header {
    background-color: #fff;
    height: 74px;   /* remember to take into account height of the container top image */
    margin: 0px 20px 0 20px; /* accounts for container's gradient image L and R */
    padding: 0px;
    position: relative;
    top: 20px;
    width: 960px;
    }

    /* text: University of St Andrews */
    #container #header h1 {
      font-family: "Book Antiqua", "Georgia", Times, serif;
      color: #000;
      font-size: 26px;
      font-weight: bold;
      line-height: 34px;
      padding-left: 65px;	/* indent from left for text "University of St Andrews" */
      position: absolute;
      top: 1px;
      }

    /* image: University crest */
    #container #header img {
		border:none;
        left: 10px;
        position: absolute;
        top: -5px;
        z-index: 99;    /* positions image above #container's top gradient - doesn't work in IE!? */
        }

    #container #header a {
        color: #000099;
        text-decoration: none;
        }

    #container #header form {
	    background-color: white;
        line-height: 1em;
        margin: 0;
        padding: 0;
        position: absolute; /* positions form at top, right of #header (which is relative) */
		right: 10px;
        top: 5px;
        width: 270px;
        }

    #container #header form p {
        padding: 0;
        margin: 10px 0;
        }

    #container #header input {
        line-height: 1.2em;
        margin: 0;
        padding: 0;
        }

    input#q {
        margin-left: 57px;
        width: 200px;
        }

    input#btnG {
        width: 62px;
        }

	#search_options{
		font-size:11px;
	}

	input.radio{
		width:15px;
		color:red;
	}


/* =menu ======================================================================*/
#menu {
    /* background-color: set in internal.css, current_students.css or current_staff.css */
    /*height: contained in internal.css or external.css */
    background-color: #88b3d9;
	height:36px;
	line-height:36px;
    margin: 0 20px;
    max-width: 960px;
    padding: 0;
    position: relative;
    width: 960px;
    }

#menu h1 {
    font-family: "Book Antiqua", "Georgia", Times, serif;
	display: inline;
    font-size: 1.8em;
    font-weight: normal;
    position: absolute;
    }

#menu h1 a:link, #menu h1 a:visited, #menu h1 a:hover, #menu h1 a:active, #menu h1 a:focus {
    background: #4895d9 url("http://www.st-andrews.ac.uk/media/IR/images/menu_arrow_staff.gif") no-repeat center right;    /* Staff Blue (rgb 72, 149, 217) */
    padding: 0 100px 0 32px;
    }

#menu h1 a:hover, #menu h1 a:active, #menu h1 a:focus {
    color: #00529b;         /* Blue Nowhere a7b0c9 (rgb 167, 176, 201) */
    }


#menu ul {
	list-style: none;
	margin: 0;
	padding: 0;
	float:right;
	width:auto;
	font-size:14px;
	position:absolute;
	right:20px;
	}

#menu li {
    display: inline;
    float: left;
	position: relative;
	}

#menu a:link, #menu a:visited {
	color: #fff;
	display: block;
	font-weight: normal;
    padding: 0 2px;
	border-right:17px solid #88b3d9;
	text-decoration: none;
	min-height:36px;
	}

#menu li a:hover, #menu a:active, #menu a:focus{
background:transparent url(border.png) no-repeat scroll center bottom;
    color: white;
	font-weight:normal;
	}
/*

#menu a:hover, #menu a:active, #menu a.current {
background:transparent url(border.png) repeat scroll center top;
text-decoration: none;
padding: 0 14px;
display: block;
color: white;
min-height:36px;
}
#menu a.current {
cursor: default;
}
*/

/* =contentwrapper ===========================================================
This wraps sidebar and all main content */
#container #contentWrapper {
    margin: 0 30px;
    position: relative;
    width: 940px;
    }

/* =content ==================================================================*/
#container #contentWrapper #content {
    float: right;   /* floats content div right, allows other content to flow around it */
    text-align: left;
    position: relative;
    width: 760px;   /* essential to specify width with floats */
    }

    #container #contentWrapper #content #main {
        float: left;    /* floats image left WITHIN #content */
        margin: 20px 0 20px 0;
        width: 400px;   /* essential to specify width with floats */
        }

    #container #contentWrapper #content #related {
        left: 420px;    /* floats text right WITHIN #content */
        float: right;
        margin: 20px 20px 10px 0;
        top: 10px;
        width: 310px;   /* essential to specify width with floats */
        }

	#container #contentWrapper #content #related p{
		margin-bottom:25px;
	}

	#container #contentWrapper #content #related #news ul{
		padding:0;
		margin:0;
		list-style:none;
	}

	#container #contentWrapper #content #related #news li{
		padding-bottom:10px;
	}

	#container li{
		padding-bottom:5px;
	}

/* =photo menu list ==========================================================*/
    #container #contentWrapper #content #photomenu {
        clear: both;
        height: auto;
        left: 0;
        margin: 0 0 0 0px;
        padding: 10px 0 0 0;
        width: 760px;
        }

    #container #contentWrapper #content #photomenu ul {
        list-style: none;
        margin: 0;
        padding: 0;
		}

    #container #contentWrapper #content #photomenu ul li {
		background-color:#4895d9;
        float: left;
        margin-right: 15px;
		margin-bottom:25px;
        }

    #container #contentWrapper #content #photomenu p{
		color:white;
		padding:2px 5px 5px 5px;
	}

    #container #contentWrapper #content #photomenu a{
		text-decoration:none;
	}

	#m_prospective a img, #m_ug a img, #m_pg a img, #m_research a img{border:0}



/* =sidebar===================================================================*/
#container #contentWrapper #sidebar {
    float: left;    /* sidebar floated left within #contentWrapper */
    margin-top: 20px;
    position: relative;
    width: 170px;   /* IE6 has problems with width 200px */
	font-family: Arial, Helvetica, sans-serif;
	font-size:13px;
    }

/* =submenu ==================================================================*/
/* Create gap above and below entire list */
#submenu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    list-style-type: none;
    width: 165px; /* fix for IE6 to allow hover borders  */
    }

    /* Spacer below list items */
    #submenu li, #submenu ul ul li {
        padding: 4px 0 0 0;         /* GAP BETWEEN LIST ITEMS */
		}

/* Indent sub list */
#submenu ul ul {
    margin: 0 0 0 0;
	padding:0 0 3px 0;
    width: 165px; /* fix for IE6 */
		background-color:#DDEBF9;
    }

    /* Selected item in sub-list -- class applied to the list item tag: <li class="selected"> */
    #submenu ul ul li.selected, .currentbranch3 {
        color: #5f5f5f;                     /* Dark Grey (rgb 95, 95, 95) */
        font-weight: bold;
        padding-left: 5px;
       }

    #submenu ul ul ul li a {  /* Fix for #sidebar spilling contents */
		padding-top:1px;
		padding-left: 25px;
        padding-bottom: 1px;
        width: 137px;
        }

/* Border and padding control left-hand 'tick' marker */
#submenu li a {
    /* Coloured padding found in sidebar colour css file */
    padding: 3px 3px 3px 5px;
	color: #000;
    display: block;
	font-weight: normal;
    width: 157px;  /* fix for IE6 to allow hover borders */
	}

    #submenu li a:link, #submenu li a:visited {
    	text-decoration: none;
    	}

    #submenu li a:hover, #submenu li a:active {
    	text-decoration: none;
		color:white;
		background-color:#4895d9;
		font-weight:normal;
    	}

    /* Selected item on list -- class applied to <a> tag: <a href="#" class="selected"> */
    #submenu a.selected, #submenu li a.selected {
        color: white;
        font-weight: bold;
		background-color:#4895d9;
        }

/* Start added by T4 for SiteManager link menu code */
	#submenu li .currentbranch0 {
		display: block;
		width: 158px;                           /* fix for IE6 to allow hover borders */
        color: white;
		background-color:#4895d9;
        font-weight: bold;
		padding:3px 3px 3px 5px;
	}

	#submenu li .currentbranch0 a{
        color: white;
        font-weight: bold;
		width:153px;
		padding:0;
 	}	
	
	#submenu li .currentbranch0 a:hover{
        color: white;
        font-weight: bold;
 	}

	#submenu li .currentbranch1 {
		color: #2F608C;
		font-weight: bold;
		display: block;
		padding:0 0 0 5px;
	}

	#submenu li .currentbranch1 a{
		color: #2F608C;
        font-weight: bold;
		padding:3px 3px 3px 0px;
 	}

	#submenu li .currentbranch1 a:hover{
		color:white;
	}

	#submenu li .currentbranch2 {
        color: #5f5f5f;
		font-weight: bold;
		display: block;
		padding-left:25px;
	}

	#submenu li .currentbranch2 a {
        color: #5f5f5f;
        font-weight: bold;
		padding-left:0px;
 	}

	#submenu li .currentbranch2 a:hover{
		color:white;
	}

	#submenu li .currentbranch3 {
        color: #334499;
		font-weight: bold;
		display: block;
		padding-left:25px;
	}

	#submenu li .currentbranch3 a {
        color: #5f5f5f;
        font-weight: bold;
	}

	#submenu li .currentbranch3 a:hover{
		color:white;
	}


/* End added by T4 */

        #submenu p a:link, #submenu p a:visited {
            border: 0;
            color: #5f5f5f;                 /* Dark Grey (rgb 95, 95, 95) */
            display: inline;
            margin: 0;
            padding: 0;
            text-decoration: none;
            }

        #submenu p a:hover, #submenu p a:active {
            text-decoration: underline;
            }


/* Formatting of lists in related content */

	#container #contentWrapper #content #related ul{
		list-style:none;
		margin:0;
		padding:0;
	}

	#container #contentWrapper #content #related li{
		margin-bottom:10px;
	}

	#container #contentWrapper #content #related h3{
		color:#5F5F5F;
	
	}

/* =footer ====================================================================*/
#container #footer {
    height: 35px;
    margin: 10px 30px;
    padding-bottom: 10px;
    position: relative;
    width: 940px;
	color:#999;
	font-size:12px;
	text-align:center;
    }

#container #footer a{
	font-weight:normal;
	color:#999;
}

.clear {
    clear: both;
}

/* 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. */

.hide a {
    display: inline;
    font-size: 1.2em;
    left: -200em;
    padding: 0 0.5em;
	position: absolute;
    text-decoration: none;
    width: 14em;
    z-index: 2;
	}

    .hide a:focus, .hide a:active {
        position: absolute;
        left: 0.5em;
        border: solid #00529b 2px;
        color: #000;
        background: #fff;
        }

		.hidden{
		display:none;
		}



/*style for staff profile*/
table.staff{
	margin-top:10px;
	margin-bottom:10px;
	border-bottom:1px solid black;
}

h3.staff {
		font-weight: bold;
		color: black;		
		font-size: 110%;
		margin:0em 0em 0em 0em;
		}

p.staff{
		margin-top:5px;
		margin-bottom:5px;
}

p.publications_title{
		margin-top:20px;
		margin-bottom:5px;
		font-weight:bold;
}


p.publications{
		margin-top:5px;
		margin-bottom:5px;
}

div.staff{
		clear: both;
		margin-top:10px;
		border-top:2px solid black;
		padding-top:10px;
		padding-bottom:5px;
}

div.floatimage{
	float: right;
	margin-top:0;
	padding-top:0;
	padding-left: 10px;
	margin-bottom: 5px;
	margin-left: 5px;
	width: 100px;
	/*temporary fix until IR staff have photos - originally 125px*/
	height:0px;
	font-size: 80%;
	color:#003399;
	text-align:right;
}

p.Centres{
	text-align:left;
	padding-left:10px;
	padding-top:10px;
	padding-bottom:5px;
	font-weight:bold;
	margin:0;
}

/** style for module information **/

div.modules{
	border-top:2px solid black;
	padding-top:10px;
	padding-bottom:10px;
}

p.module_title{
	margin:0;
	padding-top:5px;
	padding-bottom:5px;
	font-weight:bold;
}

p.module_description {
	margin-top:5px;
	margin-bottom:10px;
	padding-bottom:15px;
	border-bottom:1px solid #aaa;
}

table.module_info{
	padding-bottom:0;
	margin-top:0;
}

div.floatright_credits{
	float: right;
	margin-top:5px;
	padding-top:0;
	padding-left: 10px;
	margin-bottom: 5px;
	margin-left: 5px;
	color:black;
	text-align:right;
}

.short_loan{
	font-weight:bold;
	padding-top:15px;
	padding-bottom:0;
}

/** style for degree options **/

div.message{
	padding-top:0;
	padding-bottom:10px;
}

table.listing{
/* The default table for document listings. Contains name, document types, modification times etc in a file-browser-like fashion */
width:600px;
border-collapse: collapse;
border-left: 1px solid #8CACBB;
border-bottom: 1px solid #8CACBB;
font-size: 90%;
margin: 1em 0em 1em 0em;
clear: both;
}

table.listing th {
background: #E1EBFF ;
border-top: 1px solid #8CACBB;
border-bottom: 1px solid #8CACBB;
border-right: 1px solid #8CACBB;
border-left: 1px solid #8CACBB;
color:#336699;
font-weight: bold;
padding: 0em 0.4em 0em 0.4em;
/* text-transform: lowercase; */
white-space: nowrap;
}

table.listing td.top {
border-left: 1px solid White;;
border-top: 1px solid White; ! important;
border-right: 1px solid White; ! important;
text-align: right ! important;
padding: 0em 0em 1em 0em;
/* insane IE row bug workaround */
position: relative;
left: -1px;
top: -1px;
}

table.listing tr.odd {
/*every second line should be shaded */
background: #FFFFFF;
}

table.listing tr.even {
background-color: #F7F9FA;
}

table.listing td{
border-right: 1px solid #8CACBB;
border-left: 1px solid #8CACBB;
text-align: left;
padding: 0em 0.4em;
}

