/* css UNSW Bookshop Website 2010 */
/* All associated graphics copyright 2010, Anthony Cummins. Red Ant Media */
/* Added: February 2010 */

body{
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif; 
	background: #9CB0BB;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	}
	
.container{
	width: 1000px;
	background: none;
	margin: auto;
	padding: 0 0 0 0;
	}
	
.floatleft{
	float:left;
	width: auto;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
.floatright{
	float:right;
	width: auto;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
.clearboth{
	clear:both;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#tophold{
	float: left;
	width: 100%;
	height: 200px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	}
	
#header{
	width: 1000px;
	height: 200px;
	background: url(images/unswhdr.gif) repeat-x;
	margin: auto;
	padding: 0 0 0 0;
	}
	
#header img.banner{
	margin: 15px 0 0 10px;
	padding: 0 0 0 0;
	}
	
#logo{
	float: left;
	width: 400px;
	background: none;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
a.unswhome{
	display: block;
	width: 150px;
	height: 50px;
	margin: 0 0 0 20px;
	padding: 25px 0 0 0;
	}
	
a.unswhome img{
	border: none;
	}
	
#tnav{
	float: right;
	width: 560px;
	height: 68px;
	background: none;
	font-size: 1.1em;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#tnav ul{
	float: right;
	height: 68px;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#tnav ul li{
	float: left;
	display: block;
	font-size: 0.9em;
	height: 68px;
	background: url(images/topnav.gif) no-repeat;
	padding: 53px 15px 0 10px;
	margin: 0 0 0 0;
	}
	
#tnav ul li.basket{
	background: url(images/basket3.jpg) no-repeat;
	padding-left: 43px;
	}
	
#tnav ul li a{
	color: #FFF;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: normal;
	}
	
#tnav ul li a:hover{
	color: #ffc80b;
	}
	
#search{
	float: right;
	text-align: right;
	padding: 10px 10px 10px 10px;
	margin: 20px 20px 0 0;
	background: #00314f;
	border: 2px solid #FFF;
	}
	

#mainhold{
	float: left;
	width: 100%;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	}
	
#main{
	width: 1000px;
	background: #00314F;
	border-top: 3px solid #9CB0BB;
	margin: auto;
	padding: 0 0 0 0;
	}
	
#main p{
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	}
	
#search2{
	float: left;
	width:250px; 
	padding: 0 0 0 0;
	margin:  20px 20px 0px 20px;
	background:#28526C url(images/menubgr.jpg) no-repeat;
	}
	
#sform{
	width: 240px;
	background: #4C6E84;
	text-align: left;
	padding: 15px 0 15px 10px;
	margin: 0 0 0 0;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	}
	
#sform form{
	padding: 0 0 0 0;
	margin: 0 0 0 0px;
	}
	
#sform form #quicksubmit{
	margin-top: 5px;
	}
	
#s2foot{
	float: left;
	width:250px;
	background: #28526B url(images/menubgr2.jpg) no-repeat;
	height: 12px;
	padding: 0 0 0 0;
	margin: 0 0 0 20px;
	}

#menuhold{
	float: left;
	width:250px; 
	padding: 0 0 0 0;
	margin:  20px 20px 20px 20px;
	background:#28526C url(images/menubgr.jpg) no-repeat;
	}
	
#menuhold p, #search2 p{
	font-size: 0.9em;
	color: #FFF;
	padding: 0 0 0 0;
	margin:  5px 0 6px 10px;
	}
	
#menuhold p span, #search2 p span{
	font-size: 1.6em;
	font-weight: normal;
	text-transform: capitalize;
	}
	
#menu {
	font-size: 1.0em;
	height: auto;
	position:relative;
	}

#menu ul {
	width:250px;
	margin:0 0 0 0; 
	list-style:none; 
	white-space:nowrap; 
	text-align:left; 
	padding:0 0 0 0; 
	border-top: 1px solid #97a5b0;
	}

#menu li {
	margin:0; 
	padding:0; 
	list-style:none;
	}
	
#menu li.head{
	display:block; 
	color:#FFF; 
	font-weight: bold;
	background:#28526C;
	line-height:30px; 
	text-decoration:none;
	padding:0 20px 0 10px;
	border-bottom: 1px solid #97a5b0;
	}
	
#menu li {
	display:inline;
	}
	
#menu ul ul {
	position:absolute; 
	left:-9999px;
	}
	
#menu ul ul ul li a{
	background:#28526C;
	}
	
#menu ul#toplevel {
	position:absolute; 
	left:0; 
	top:0;
	}

#menu a {
	display:block; 
	color:#FFF; 
	background:#4c6e84;
	line-height:30px; 
	text-decoration:none;
	padding:0 20px 0 10px;
	border-bottom: 1px solid #97a5b0;
	} 
	
#menu ul ul li a{
	color: #28526C;
	background:#9cb0bb;
	}
	
#menu ul ul ul a{
	color: #FFF;
	}

#menu li a:hover {
	background-color:#9cb0bb; 
	color:#ffc80b;
	}
	
#menu li:hover > a {
	background-color:#9cb0bb; 
	color:#ffc80b;
	}
	
#menu ul ul li a:hover {
	background-color:#28526C; 
	color:#ffc80b;
	}
	
#menu ul ul li:hover > a {
	background-color:#28526C; 
	color:#ffc80b;
	}

#menu ul li:hover > ul {
	left:100%; 
	margin-top:-32px; 
	margin-left:0px;
	}

#menu a:hover ul, #menu a:hover a:hover ul, #menu a:hover a:hover a:hover ul {
	left:100%;
	}
	
#menu a:hover ul ul, #menu a:hover a:hover ul ul {
	left:-9999px;
	}

#menu table {
	position:absolute; 
	left:99%; 
	height:0; 
	width:0; 
	border-collapse:collapse; 
	margin-top:-7px; 
	margin-left:-1px;
	}
	
#menu li.last{
	display:block;
	background: #28526B url(images/menubgr2.jpg) no-repeat;
	height: 12px;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#menu li.last img{
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#unswrhs{
	float:left;
	width:684px;
	padding:0 0 0 0;
	margin:0 0 0 0;
	color:#FFF;
	background:none;
	border-left: 3px solid #9CB0BB;
	}
	
#picks{
	height: 270px;
	background:#28526C url(images/pickbgr.jpg) no-repeat;
	padding: 0 0 0 0;
	margin: 20px 0 0 20px;
	overflow: hidden;
	}

#picks h1, .social h1{
	font-size: 1.6em;
	font-weight: normal;
	text-transform: capitalize;
	padding: 5px 0 0 10px;
	margin: 0 0 0 0;
	}

.recbooktab {
	font-size: 0.85em;
}
	
.recbook{
	height: 220px;
	background: #4c6e84;

	}

.recbooktext{
	font-size:1.2em;
}
	
.recbook a{
	color: #FFC80B;
	text-decoration: none;
	font-weight: bold;
	
	}
	
.recbook a:hover{
	color: #00314F;	
	}
	
.recbook img{
	display: inline;
	float: left;
	margin-right: 10px;
	border: 1px solid #28526C;
	}

.recbook a:hover img {
	border: 1px solid #FFC80B;
	}
	
.recbook h2{
	font-size: 1.2em;
	color: #FFC80B;
	padding: 0 0 0 0;
	margin: 0 0 5px 0;
	}
	
/* Caution! Ensure accessibility in print and other media types... */
@media projection, screen { /* Use class for showing/hiding tab content, so that visibility can be better controlled in different media types... */
    .ui-tabs-hide {
        display: none;
    }
}

/* Hide useless elements in print layouts... */
@media print {
    .ui-tabs-nav {
        display: none;
    }
}

/* Skin */
.ui-tabs-nav, .ui-tabs-panel {
    font-size: 0.8em;
}

.ui-tabs-nav {
    list-style: none;
    margin: 0;
    padding: 0 0 0 0;
}

.ui-tabs-nav:after { /* clearing without presentational markup, IE gets extra treatment */
    display: block;
    clear: both;
    content: " ";
}

.ui-tabs-nav li {
    float: left;
    margin: 0 0 5px 0;
    min-width: 84px; /* be nice to Opera */
}

.ui-tabs-nav a, .ui-tabs-nav a span {
    display: block;
    padding: 0 10px;
    background: none;
}

.ui-tabs-nav a {
    margin: 1px 0 0; /* position: relative makes opacity fail for disabled tab in IE */
    padding-left: 0;
    color: #FFC80B;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: nowrap; /* required in IE 6 */    
    outline: 0; /* prevent dotted border in Firefox */
}

.ui-tabs-nav a:hover{
    color: #00314F;
	}

.ui-tabs-nav .ui-tabs-selected a {
    position: relative;
    top: 1px;
    z-index: 2;
    margin-top: 0;
    color: #CCC;
}

.ui-tabs-nav a span {
    width: 64px; /* IE 6 treats width as min-width */
    min-width: 64px;
    height: 18px; /* IE 6 treats height as min-height */
    min-height: 18px;
    padding-top: 6px;
    padding-right: 0;
}

*>.ui-tabs-nav a span { /* hide from IE 6 */
    width: auto;
    height: auto;
}

.ui-tabs-nav .ui-tabs-selected a span {
    padding-bottom: 1px;
}

.ui-tabs-nav .ui-tabs-selected a, .ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active {
    background-position: 100% -150px;
}

.ui-tabs-nav a, .ui-tabs-nav .ui-tabs-disabled a:hover, .ui-tabs-nav .ui-tabs-disabled a:focus, .ui-tabs-nav .ui-tabs-disabled a:active {
    background-position: 100% -100px;
}

.ui-tabs-nav .ui-tabs-selected a span, .ui-tabs-nav a:hover span, .ui-tabs-nav a:focus span, .ui-tabs-nav a:active span {
    background-position: 0 -50px;
}
.ui-tabs-nav a span, .ui-tabs-nav .ui-tabs-disabled a:hover span, .ui-tabs-nav .ui-tabs-disabled a:focus span, .ui-tabs-nav .ui-tabs-disabled a:active span {
    background-position: 0 0;
}

.ui-tabs-nav .ui-tabs-selected a:link, .ui-tabs-nav .ui-tabs-selected a:visited, .ui-tabs-nav .ui-tabs-disabled a:link, .ui-tabs-nav .ui-tabs-disabled a:visited { /* @ Opera, use pseudo classes otherwise it confuses cursor... */
    cursor: text;
}

.ui-tabs-nav a:hover, .ui-tabs-nav a:focus, .ui-tabs-nav a:active,
.ui-tabs-nav .ui-tabs-deselectable a:hover, .ui-tabs-nav .ui-tabs-deselectable a:focus, .ui-tabs-nav .ui-tabs-deselectable a:active { /* @ Opera, we need to be explicit again here now... */
    cursor: pointer;
}

.ui-tabs-disabled {
    opacity: .4;
    filter: alpha(opacity=40);
}

.ui-tabs-panel {
    border-top: 1px solid #97a5b0;
    padding: 1em 8px;
    background: #4c6e84; /* declare background color for container to avoid distorted fonts in IE while fading */
}

.ui-tabs-loading em {
    padding: 0 0 0 20px;
    background: url(loading.gif) no-repeat 0 50%;
}

/* Additional IE specific bug fixes... */
* html .ui-tabs-nav { /* auto clear, @ IE 6 & IE 7 Quirks Mode */
    display: inline-block;
}
*:first-child+html .ui-tabs-nav  { /* @ IE 7 Standards Mode - do not group selectors, otherwise IE 6 will ignore complete rule (because of the unknown + combinator)... */
    display: inline-block;
}

#pfoot{
	width:664px;
	height: 15px;
	background: url(images/pickbgr2.jpg) no-repeat;
	padding: 0 0 0 0;
	margin: 0 0 20px 20px;
	}

#news{
	float: left;
	width: 380px;
	background: none;
	padding: 0 0 0 0;
	margin: 0 0 0 20px;
	}
	
#news h2{
	display: block;
	width: 390px;
	font-size: 1.6em;
	font-weight: normal;
	text-transform: capitalize;
	border-bottom: 1px solid #FFF;
	margin: 0 0 15px 0;
	padding: 0 0 5px 0;
	}
	
#news h3{
	font-size: 1.2em;
	font-weight: normal;
	color: #9CB0BB;
	text-transform: capitalize;
	margin: 0 0 5px 0;
	padding: 0 0 5px 0;
	}
	
#news p{
	font-size: 0.9em;
	padding: 0 0 0 0;
	margin: 0 0 10px 0;
	}
	
#news p.more{
	margin: 0 0 20px 0;
	}
	
#news a{
	color: #FFC80B;
	text-decoration: none;
	}
	
#news a:hover{
	color: #4C6E84;
	}
	
#news img{
	float: left;
	padding: 0 0 0 0;
	margin: 0 10px 5px 0;
	}

#shold{
	float: right;
	width:250px; 
	padding: 0 0 0 0;
	margin:  0 0 0px 20px;
	background: none;
	}
.social{
	float: right;
	width:250px; 
	padding: 0 0 0 0;
	margin:  0 0 0 0;
	background: #28526B url(images/menubgr.jpg) no-repeat;
	}
	
#shold p{
	font-size: 0.9em;
	color: #FFF;
	padding: 0 0 0 0;
	margin:  5px 10px 6px 10px;
	}
	
#shold a{
	color: #FFC80B;
	text-decoration: none;
	}
	
#shold a:hover{
	color: #00314F;
	}
	
.social p span{
	font-size: 1.4em;
	font-weight: bold;
	}
	
.social .copy{
	background: #4C6E84;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding: 5px 0 5px 0;
	margin: 5px 0 5px 0;
	}
	
.social .tweethead{
	background: #4C6E84;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding: 5px 0 5px 0;
	margin: 5px 0 0px 0;
	}
	
.social .tweet_odd{
	background: #829aa9;
	border-bottom: 1px solid #CCC;
	padding: 5px 0 5px 0;
	margin: 0px 0 0px 0;
	}
	
.social .tweet_even{
	background: #9dafbb;
	border-bottom: 1px solid #CCC;
	padding: 5px 0 5px 0;
	margin: 0px 0 0px 0;
	}
	
.social img{
	display: inline;
	float: left;
	margin: 7px 10px 0 10px;
	border: none;
	}
	
.sfoot{
	float: right;
	width:250px;
	height:12px;
	padding: 0 0 20px 0;
	margin:  0 0 0 0;
	background: url(images/menubgr2.jpg) no-repeat;
	}

#foothold{
	float: left;
	width: 100%;
	height: 30px;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	}
	
#footer{
	width: 1000px;
	height: 30px;
	background: #5A798D;
	border-top: 3px solid #9CB0BB;
	margin: auto;
	padding: 0 0 0 0;
	}
	
#footer p{
	font-size: 0.7em;
	color: #FFF;
	margin: 8px 20px 0 20px;
	padding: 0 0 0 0;
	}
	
#footer a{
	color: #FFC80B;
	text-decoration: none;
	}
	
#footer a:hover{
	color: #00314F;
	}
	
/*-- PAGE STYLING --*/

#pagehead{
	width: 1000px;
	height: 57px;
	background: url(images/phead.gif) repeat-x;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#pagehead img{
	border: none;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#pagelogo{
	float:left;
	width: 315px;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#pnav{
	float: right;
	width: 680px;
	height: 40px;
	background: none;
	font-size: 1.1em;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#pnav ul{
	float: right;
	height: 40px;
	padding: 0 0 0 0;
	margin: 0 0 0 0;
	}
	
#pnav ul li{
	float: left;
	display: block;
	font-size: 0.9em;
	height: 40px;
	background: url(images/pnav.gif) no-repeat;
	padding: 23px 15px 0 10px;
	margin: 0 0 0 0;
	}
	
#pnav ul li.basket{
	background: url(images/basket2.jpg) no-repeat;
	padding-left: 43px;
	}
	
#pnav ul li a{
	color: #FFF;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: normal;
	}
	
#pnav ul li a:hover{
	color: #ffc80b;
	}
	
#pagecontent{
	width: 1000px;
	background: #FFF;
	color: #00314F;
	padding: 0 0 0 0;
	margin: 3px 0 0 0;
	}
#pagecontent1{
	float: left;
	width: 500px;
	}
#pagecontent2{
	width:500px;
}


#pagecontent h1{
	font-size: 1.6em;
	color: #28526C;
	font-weight: normal;
	text-transform: capitalize;
	padding: 10px 0 5px 10px;
	margin: 0 0 0 0;
	}

#pagecontent h2{
	font-size: 1.4em;
	font-weight: normal;
	color: #28526C;
	text-transform: capitalize;
	padding: 10px 0 5px 10px;
	margin: 0 0 0 0;
	}
	
#pagecontent h3{
	font-size: 1.2em;
	font-weight: normal;
	color: #28526C;
	text-transform: capitalize;
	padding: 10px 0 5px 10px;
	margin: 0 0 0 0;
	}
	
#pagecontent p{
	font-size: 0.9em;
	padding: 0 10px 5px 10px;
	margin: 0 0 0 0;
	}
	
#pagecontent a{
	color: #28526C;
	text-decoration: underline;
	}

#pagecontent a:hover{	
	color: #FFC80B;
	}
	
#hhold{
	float: left;
	width:250px; 
	padding: 0 0 0 0;
	margin:  40px 10px 10px 3px;
 
	}
#hhold p{
	font-size: 0.9em;
	color: #FFF;
	padding: 0 0 0 0;
	margin:  5px 0 6px 10px;
	}
	
.hour{
	float: right;
	width:250px; 
	padding: 0;
	margin:  0;
	
	background: #28526B url('images/menubgr.jpg') no-repeat;
	}
	
.hour .copy{
	background: #4C6E84;
	border-top: 1px solid #CCC;
	border-bottom: 1px solid #CCC;
	padding: 5px 0 5px 0;
	margin: 5px 0 5px 0;
	}
	
.hour p span{
	font-size: 1.4em;
	font-weight: bold;
	}