/*

UI Press Main CSS File
by Surface 51

- Created 8/27/11
- Updated 9/3/11
- Updated 1/4/12 (DP--addition of 4.A.ii. seeall, moved catalog to 4.A.iii.)

----------------------------------------

1. global (html, body, h1-h6, etcâ€¦)
 
2. header
 A. logo
 B. iblock
 C. quicklinks
 D. menu
 E. searchform

3. featured
 A. slideshow

-- for homepage --

4. wrapper
 A. sidebar
  i.  browse
  ii. catalog
 B. content
  i. newbooks
  ii. triptych
   a.triptych_first
   b. triptych_second

-- for book product page --

4. wrapper
 A. sidebar
  i. purchase
  ii.  meta
  iii. browse
  iv. moreinfo
  v. versions
 B. content
  i. book info
  ii. newbooks

-- for inside page --

4. wrapper
 A. sidebar (inherited from homepage styles)
 B. content
  i. inside page

5. footer
 A. footer_first
 B. footer_second
 C. footer_third
 D. footer_fourth


 
----------------------------------------

*/


.order_info {

  visibility:hidden;
  display:none

}


/* 1. global */

html {
	font-family:Arial, Helvetica, sans-serif;
}

body {
	margin:0px;
	background:url("../imgs/attributes/colorbar.gif") repeat-x;
	
	background: url("../imgs/attributes/colorbar.gif") top center repeat-x,
				url("../imgs/attributes/colorbar.gif") bottom center repeat-x;
	margin-bottom:30px;
	font-family:Arial, Helvetica, sans-serif;
}

body.inside {
	background:url("../imgs/attributes/colorbar_inside.gif") repeat-x;
	
	background: url("../imgs/attributes/colorbar_inside.gif") top center repeat-x,
	url("../imgs/attributes/colorbar.gif") bottom center repeat-x;
}


h1 {}
h2 {}
h3 {
	border-bottom:5px #375a5a solid;
	font-size:15px;
	margin-bottom:10px;
}
h4 {}
h5 {}

blockquote {}

a {}

a:hover {}

a.button {
	display:block;
	margin-bottom:10px;
	background-color:#375a5a;
	color:#fff;
	text-shadow:1px 1px 1px #000;
	padding:5px 8px;
	border-radius:5px;
	float:left;
	clear:both;
	text-decoration:none;
	font-weight:600;
	font-size:11px;
}

a.button:hover {
	background-color:#213d3d;
}

a img {
	border:0;
}

.clearfix {
	clear:both;
}

/* 2. header */

#header {
	margin:20px auto 0px auto;
	width:960px;
}


/* 2. header => A. logo */

#logo {
	height:48px;
	margin:0px;
	padding:0px;
	float:left;
	margin-top:10px;
}

#logo h1 {
	margin:0px;
	padding:0px;
	float:left;
}

#logo h1 a {
	background:url("../imgs/attributes/ui_logo.gif");
	display:block;
	width:509px;
	height:48px;
	float:left;
}

#logo h1 a span {
	display:none;
}

#logo h1 a:hover {
	background-position:0 -48px;
}


/* 2. header => B. iblock */

#header #iblock {
	float:right;
}

#header #iblock a {
	display:block;
	width:40px;
	height:52px;
	background:url("../imgs/attributes/iblock.gif");
}

#header #iblock a:hover {
	background-position:0px 52px;
} 

#header #iblock a span {
	display:none;
}


/* 2. header => C. quicklinks */

#header #quicklinks {
	font-size:10px;
	clear:both;
	width:666px;
	margin-left:51px;
	margin-left:71px;
	text-align:right;
}

#header #quicklinks a {
	color:#999;
	font-size:11px;
	text-transform:uppercase;
	text-decoration:none;
}

#header #quicklinks a:hover {
	text-decoration:underline;
}


/* 2. header => D. menu */

#header #menu a, h3 {
	font-family: futura-pt,Arial, Helvetica, sans-serif;
	font-weight:100;
	text-transform:uppercase;
	letter-spacing:0px;
}

#header #menu {
	margin-left:53px;
	float:left;
	height:27px;
}

#header #menu ul {
	margin:0px;
	padding:0px;
	list-style:none;
	
}

#header #menu ul li {
	margin:0px;
	padding:0px;
	display:block;
	float:left;
	position:relative;
}

#header #menu ul li > ul {
	display:none;
	position:absolute;
	top:25px;
	z-index: 1000;
	background-color:#fff;
	padding:10px;
	padding-right:30px;
	text-shadow: 1px 1px 4px rgba(0,0,0,.4);
}

#header #menu ul li > ul li {
	float:none;
}

#header #menu ul li > ul a {
	text-transform:none;
	font-family:arial;
	font-size:13px;
	letter-spacing:0px;
}

#header #menu ul li:hover > ul {
	display:block;
	border:1px solid #666;
	box-shadow:0px 5px 10px #333;
	border-top:0px;
}

#header #menu ul li ul li ul {
	margin-left:135px;
	float:left;
	position:absolute;
	top:0px;
	border:1px solid #666 !important;
}

#header #menu a {
	color:#333;
	display:block;
	text-decoration:none;
	padding:2px 10px;
	padding:1px 10px;
	border-bottom:5px transparent solid;
	font-size:14px;
	letter-spacing:1px;
	white-space:nowrap;	
}


@-moz-document url-prefix() {
    #header #menu a {
		padding:1px 10px;
	}
}

#header #menu a:hover {
	border-bottom:5px #8ab8b8 solid;
}

#header #menu a.selected {
	border-bottom:5px #375a5a solid;
}


/* 2. header => E. searchform */

#header #searchform {
	float:right;
}


/* 3. featured */

#featured {

}

/* 3. featured => A. slideshow */

#featured #slideshow {
	background-color:#000;
}

#slideshow .slide {
	display:block;

	position:relative;
}

#slideshow .slide .slidecontent {
	position:absolute;
	bottom:0;
	background-color:rgba(0,0,0,.7);
	color:#fff;
}

#slideshow .slide .slidecontent h2 {
	font-family: futura-pt,Arial, Helvetica, sans-serif;
	font-weight:100;
	float:left;
	margin:10px 20px 0px 40px;	
}

#slideshow .slide .slidecontent p {
	float:left;
	font-size:12px;
	line-height:15px;
	margin:10px 20px 10px 40px;	
}

#slideshow .slide .slidecontent .links {
	display:block;
	width:150px;
	position:absolute;
	bottom:0;
	right:0;
	padding-bottom:10px;
}



#slideshow .slide .slidecontent .links a:hover {
	background-color:#979465;
}

#slideshow .slide .slidecontent {
	display:none;
}

#slideshow .slide.active .slidecontent {
	display:block;
}

#slideshow .slide {
	float:left;
	width:100px;
	margin-right:1px;
}

#slideshow .slide.active {
	width:658px;
}

#slideshow {
	text-align: center;
}


/* 4. wrapper */

#wrapper {
	width:960px;
	margin:0px auto;
	margin-bottom:20px;
}

/* homepage info */

/* 4. wrapper => A. sidebar */

#sidebar {
	width:270px;
	float:left;	
}

/* 4. wrapper => A. sidebar => i. browse */

#browse {
	width:210px;
	margin-left:20px;
}

#browse h3 {
	padding-top:0px;
	float:left;
}

#browse a {
	margin-left:-10px;
	display:block;
	font-size:14px;
	color:#333;
	padding-bottom:6px;
	font-family:  futura-pt,Arial, Helvetica, sans-serif;
	text-decoration:none;
	clear:both;
	padding:3px 10px;
	border-radius:5px;
}


#browse a.more {
	margin-top:15px;
	text-decoration:underline;
}

#browse a:hover {
	color:#555;
	text-decoration:underline;
	background-color:#375a5a;
	color:#fff;
}

/* 4. wrapper => A. sidebar => ii. seeall */

#seeall {
	margin-left:20px;
	margin-bottom:40px;
	margin-top:10px;
	width:200px;
	padding-bottom:40px;
	
	
        
	margin-bottom:-20px;
	padding-bottom:0px;
	min-height:0px;
	overflow:auto;
}

#seeall a {
	float:left;
}

#seeall a.button {
	display:block;
	width:90px;
	width:90px;
	margin-bottom:10px;
	background-color:#375a5a;
	color:#fff;
	text-shadow:1px 1px 1px #000;
	padding:5px 8px;
	border-radius:5px;
	float:left;
	clear:both;
	text-decoration:none;
	font-weight:600;
	font-size:11px;
}

#seeall a.button:hover {
	background-color:#213d3d;
}

/* 4. wrapper => A. sidebar => iii. catalog */

#catalog {
	padding-left:20px;
	border-top:#aaa 1px solid;
	width:200px;
	padding-top:20px;
	margin-top:20px;
	margin-bottom:20px;
}

#catalog img {
	border:1px solid #aaa;
	margin-bottom:20px;
}

#catalog a {
	float:left;
}

#catalog .cataloglink {
	float:left;
	width:80px;
	font-size:12px;
	padding-left:10px;
	padding-top:40px;
/*	color:#979465; */
	color:#444; 
	text-decoration:none;
	text-transform:uppercase;
	font-family: futura-pt,Arial, Helvetica, sans-serif;
}

#catalog .cataloglink:hover {
	text-decoration:underline;

}



/* 4. wrapper => B. content */

#content {
	float:left;
	width:687px;
	margin-bottom:10px;
}

#content h3 {
	float:left;
}
.inside #content h3 {
        width:100%;
}

/* 4. wrapper => B. content => i. newbooks */

#newbooks .bookcover .info {
	display:none;
	width:220px;
	padding-left:18px;
	padding-right:16px;
	float:left;
	font-size:12px;
	margin-top:16px;
	border:1px solid #aaa;
	border-left:0px;
	padding-bottom:10px;
}


#newbooks .bookcover .info a {
	color:#375a5a;
	font-size:18px;
	margin:0px;
	margin-top:10px;
	display:block;
	font-family: futura-pt,Arial, Helvetica, sans-serif;
	font-weight:100;
	text-decoration:none;
}

#newbooks .bookcover .smaller a {
	font-size:14px;
}

#newbooks .bookcover .smaller p {
	font-size:10px;
}


#newbooks .bookcover .info a:hover {
	text-decoration:underline;
}

#newbooks .bookcover .info p {
	margin:5px 0;
}

#newbooks .bookcover.active .info {
	display:block;
}

#newbooks .bookcover {
	float:left;
	margin:0px 10px 0px 0px;
}

#newbooks .bookcover.lastchild {
	margin-right:0px;
}

#newbooks .bookcover img {
	float:left;
}

#newbooks #bookcovers {
	clear:both;
	position:relative;
}

#newbooks #bookfeed {
	margin-left:20px;
	width:650px;
	height:136px;
	overflow:hidden;
}

#newbooks #bookwrapper {
	width:9999px;
}

#newbooks #bookcovers .control {
	float:left;
	display:block;
	width:18px;
	height:136px;
	position:absolute;
	background:url(../imgs/attributes/arrows.gif);
}

#newbooks #bookcovers .control span {
	display:none;
}

#newbooks #bookcovers .prevbook {
	
}

#newbooks #bookcovers .prevbook:hover {
	background-position:-18px 0px;
}


#newbooks #bookcovers .nextbook {
	right:0;
	background-position:-36px 0px;
}

#newbooks #bookcovers .nextbook:hover {
	background-position:-54px 0px;
	
}

/* 4. wrapper => B. content => ii. triptych */

#triptych {
	padding-top:20px;
}


/* 4. wrapper => B. content => ii. triptych => a. triptych_first  */

#triptych_first {
	float:left;
	width:416px;
	margin-right:10px;
	padding-right:10px;
	border-right:1px solid #aaa;
}

#recentnews {
	clear:both;
	float:left;
	font-size:12px;
}

#recentnews p {
	margin:0px;
	padding:0px;
}

#recentnews .newsitem {
	margin-bottom:10px;
}
#recentnews .newsitem a {
	color:#333;
	font-weight:600;
	text-decoration:none;
}

#recentnews .newsitem a:hover {
	text-decoration:underline;
}


/* 4. wrapper => B. content => ii. triptych => b. triptych_second  */

#triptych_second {
	float:left;
	width:250px;
}

#eventscalendar {
	clear:both;
	float:left;
	font-size:12px;
}

#eventscalendar .eventitem {
	margin-bottom:10px;
}

#eventscalendar .eventitem a {
	color:#333;
	font-weight:600;
	text-decoration:none;
}

#eventscalendar .eventitem a:hover {
	text-decoration:underline;
}


/* product page info */
/* 4. wrapper => A. sidebar */

#sidebar .links {
	padding:20px;
	border-top:1px solid #aaa;
}

#sidebar .links a {
	display:block;
	font-size:12px;
	color:#333;
	text-decoration: none;
	margin-bottom:6px;
	font-weight:600;
}

#sidebar .links a:hover {
	text-decoration: underline;
}

/* 4. wrapper => A. sidebar => i. purchase  */

#purchase {
	background-color:#cccccd;
	padding-left:20px;
	padding-top:8px;
	padding-bottom:8px;
	margin-right:20px;
	margin-top:20px;
}

#purchase h3 {
	font-family:arial;
	text-transform:none;
	font-size:18px;
	margin:0px;
	padding:0px;
	padding-top:10px;
	border:0;
}

#purchase h3 strong {
	font-weight:700;
}

#purchase p {
	margin:0px;
	padding:0px;
	font-size:12px;
}

#purchase form {
	padding-top:5px;
	margin-bottom:6px;
}


/* 4. wrapper => A. sidebar => ii. meta  */

#meta {
	font-size:12px;
	padding-left:20px;
	padding-bottom:20px;
	border-bottom:1px solid #aaa;
	margin-right:20px;
	padding-top:20px;
}

#meta dl {
	margin:0px;
	padding:0px;
}

#meta dt {
	margin:0px;
	padding:0px;
	font-weight:700;
}

#meta dd {
	margin:0px;
	padding:0px;
	margin-bottom:10px;
}

#meta a {
	margin-left:-10px;
	display:block;
	font-size:12px;
	color:#333;
	padding-bottom:6px;
	text-decoration:underline;
	clear:both;
	padding:3px 10px;
	border-radius:5px;
}

#meta a:hover {
	color:#555;
	text-decoration:underline;
	background-color:#375a5a;
	color:#fff;
}



/* 4. wrapper => A. sidebar => iii. browse  */

.inside #browse {
	padding-top:20px;
	margin-right:20px;
	padding-bottom:20px;
}


/* 4. wrapper => A. sidebar => iv. moreinfo  */

#moreinfo {
	margin-right:20px;
	font-size:0.8em;
}


/* 4. wrapper => A. sidebar => v. versions  */

#versions {
	margin-right:20px;
}


/* 4. wrapper => B. content => i. bookinfo  */

#bookinfo {
	margin-top:20px;
	font-size:13px;
}

#bookinfo #icons {
  height:40px;
}

#bookinfo #google_viewer {
	float:left;
	margin-right:10px;
}
#bookinfo #ebook {
	float:left;
	margin-right:10px;
}

#bookinfo .addthis_default_style {
	float:left;
	width:200px;
	padding-top:7px;
}

#bookinfo #icons {

}

#bookinfo img.bookcover {
	float:left;
	margin-right:15px;
	margin-bottom:10px;
}

#bookinfo h2 {
	font-weight:100;
	font-family: futura-pt,Arial, Helvetica, sans-serif;
	font-size:24px;
	margin:0px;
	padding:0px;
}

#bookinfo h5 {
	font-size:13px;
	margin:0px;
	padding:0px;
}

#bookinfo h6 {
	font-size:12px;
	font-family: futura-pt,Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	letter-spacing:1px;
	font-weight:100;
	margin:0px;
	padding:0px;
	margin-top:10px;
}
#bookinfo .handle {
font-size:1.2em;
color:#375a5a;
}

#bookinfo .awards {
	color:#375a5a;
	margin-top:0px;
	padding-top:0px;
}


/* 4. wrapper => B. content => ii. newbooks  */

.inside #newbooks {
}

/* inside page info */
/* 4. wrapper => B. content => i. inside page  */
#insidepage {
	font-size:.9em;
}
#insidepage #purchase {
	background-color:#cccccd;
	padding-left:20px;
	padding-top:8px;
	padding-bottom:8px;
	margin-left:100px;
	margin-right:300px;
	margin-top:20px;
}

#insidepage #purchase h3 {
	font-family:arial;
	text-transform:none;
	font-size:16px;
	margin:0px;
	padding:0px;
	padding-top:0px;
	border:0;
}

#insidepage #purchase h3 strong {
	font-weight:700;
}

#insidepage #purchase p {
	margin-top:5px;
	margin-bottom:0px;
	padding:0px;
	font-size:10px;
}

#insidepage #purchase form {
	padding-top:0px;
	padding-left:0px;
	margin-bottom:6px;
}

#insidepage h1{font-size: 30px;}
#insidepage h2{font-size: 24px;}
#insidepage h3{font-size: 22px;}
#insidepage h4{font-size: 20px;}
#insidepage h5{font-size: 18px;}
#insidepage h6{font-size: 16px;}

#insidepage a, #insidepage a:visited{color: #2c5c99;}

#insidepage p, 
#insidepage ol,
#insidepage ul,
#insidepage table,
#insidepage pre,
#insidepage dd{margin-bottom: 14px;}

#insidepage ol,
#insidepage ul,
#insidepage blockquote,
#insidepage pre{margin-left: 25px;}

#insidepage ol, #insidepage ul{list-style-type:circle; list-style-position:inside;}
/*
#insidepage ol ol, #insidepage ul ul{font-style:roman; font-size: 13px; margin-bottom:0;}
*/
#insidepage ol ol, #insidepage ul ul{ font-size: 13px; margin-bottom:0;}
#insidepage ol{list-style-type:decimal;}
#insidepage ol ol{list-style-type:lower-latin;}

#insidepage blockquote{padding: 5px 25px 5px 0; font-style:italic;}
#insidepage blockquote p{border-left: 2px solid #eee; padding-left: 25px;}


/* 4. wrapper => A. sidebar => i. purchase  */


/* Table Styling */

#insidepage table{border-top: 1px solid #b4b4b4; border-left: 1px solid #b4b4b4;}
#insidepage table th{background: #efefef;}
#insidepage table td, 
#insidepage table th{border-bottom: 1px solid #b4b4b4; border-right: 1px solid #b4b4b4; padding: 5px 7px;}

/* Definition List */
#insidepage dt{
margin: 0;
padding: 0;
font-weight: bold;
}

#insidepage dd
{
padding: 0;
}



/* 5. footer */

#footer {
	clear:both;
	width:960px;
	margin:0px auto;
	border-top:1px solid #aaa;
	padding-top:30px;
	margin-top:30px;
	font-size:11px;
	padding-bottom:70px;
}

#footer a {
	display:block;
	color:#284545;
	
}

#footer a:hover {
	display:block;
	color:#000;
}


/* 5. footer => A. footer_first */

#footer #footer_first {
	float:left;
	width:270px;
}

#iblock {
	float:left;
}

#iblock a {
	display:block;
	width:160px;
	height:93px;
	margin-left:20px;
	margin-top:-15px;
	background:url("../imgs/attributes/UofI-logo-blue3.sm.gif");
}

#iblock a:hover {
	background-position:0px 93px;
} 

#iblock a span {
	display:none;
}

#socialmedia {
	height:65px;
	position:relative;
	margin-top:0px;
	margin-left:20px;
}

#socialmedia ul {
	margin:0px;
	padding:0px;
	list-style:none;
}

#socialmedia ul li {
	float:left;
	margin:0px;
	padding:0px;
}

#socialmedia ul li a {
	font-family: futura-pt,Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	width:32px;
	height:41px;
	display:block;
	float:left;
	padding-right:6px;
	background-repeat: no-repeat !important;
	text-decoration:none !important;
}

#socialmedia ul li a.facebook {
	background:url(../imgs/attributes/social_media.gif);
	background-position:0px 0px;
}

#socialmedia ul li a.facebook:hover {
	background:url(../imgs/attributes/social_media.gif);
	background-position:0px -41px;
}

#socialmedia ul li a.rss {
	background:url(../imgs/attributes/social_media.gif);
	background-position:-38px 0px;
}

#socialmedia ul li a.rss:hover {
	background:url(../imgs/attributes/social_media.gif);
	background-position:-38px -41px;
}

#socialmedia ul li a.twitter {
	background:url(../imgs/attributes/social_media.gif);
	background-position:-76px 0px;
}

#socialmedia ul li a.twitter:hover {
	background:url(../imgs/attributes/social_media.gif);
	background-position:-76px -41px;
}

#socialmedia ul li a.tellfriend {
	background:url(../imgs/attributes/social_media.gif);
	background-position:-115px 0px;
}

#socialmedia ul li a.tellfriend:hover {
	background:url(../imgs/attributes/social_media.gif);
	background-position:-115px -41px;
}

#socialmedia ul li a.emaillist {
	background:url(../imgs/attributes/social_media.gif);
	background-position:-154px 0px;
}

#socialmedia ul li a.emaillist:hover {
	background:url(../imgs/attributes/social_media.gif);
	background-position:-154px -41px;
}

#socialmedia ul li a:hover {
	
}

#socialmedia ul li a span {
	display:none;
	position:absolute;
	left:0;
		text-align:center;

	bottom:0;
	width:166px;
	background-color:#333;
	padding:5px 10px;
	color:#fff;
	text-decoration:none;
}

#socialmedia ul li a:hover span {
	display:block;
}

/* 5. footer => B. footer_second */

#footer #footer_second {
	float:left;
	width:220px;
	
}


/* 5. footer => C. footer_third */

#footer #footer_third {
	float:left;
	width:220px;
	
}


/* 5. footer => D. footer_fourth */

#footer #footer_fourth {
	float:left;
	width:200px;
	
}
.twitter_link {

 text-decoration:none;
 color:black;

}
.twitter_link:hover{
	text-decoration:underline;
}

p.twitter_tweet {
	border:1px solid #444;
}
.twitter_tweet {
	border:0px solid #444;
/*	width:420px;*/
}


/* Google Book Preview Styling */
/* --------------------------- */

.xbutton{
   width:20px;
   height:20px;
   border:1px solid #ccc;
   margin-left:10px;
   margin-right:-4px;
   padding:0px;
   padding-right:5px;
   padding-left:5px;
   background-color:#bbb;
   color:#eee;
   font-weight:bold;
   font-size:1.1em;
 }
.pane { position:relative: left:-300; top:0; background-color:rgba(255,255,255,0.6);
   display:none;
   width:610px; height:715px;
   z-index:2000
}

.vc { position:absolute; left:300; top:300; height:680px; width:600px; display:none;
    border:2px solid red;
    z-index:10;
}
.hide_G_bar{
    position:absolute; top:1; left:1; border:0px solid red;
  margin-top:682px;
  z-index:4000; width:610px; height:40px;
  background-color:#fff;
  display:block;
 }



