﻿/*
	Layout style for USBSP
	Adam Horcica, Data3s, 2009
*/

/* === GLOBAL LAYOUT ======================================================= */


body {
	font-family: Tahoma, 'Lucida Grande CE', lucida, sans-serif;
	text-align: center;
	font-size: 90%;
	background-color: #F7F7F7;
}

#frame{
  width: 980px;
  margin: 0 auto;
  text-align: left;
}

hr.layout-separator{
  display: none;
}

div.cleaner{
	height: 0px;
	clear: both;
	overflow: hidden;
}

a img{
	border: none;
}

/* --- HEADER --- */

#header{
  height: 112px;
  position: relative;
	z-index: 10;
}

#logo{
  position: absolute;
  margin: 0;
  padding: 0;
  top: 0;
  left: 0;
  width: 110px;
  height: 110px;
	overflow: hidden;
  }
    
  #logo span{
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    z-index: 1;
    width: 110px;
    height: 110px;
    background-image: url(images/logo.png);
    background-repeat: no-repeat;
  }
  
#slogan{
  position: absolute;
  top: 26px;
  left: 130px;
  width: 211px;
  height: 35px;
	overflow: hidden;
  }
  
  #slogan span{
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 211px;
    height: 35px;
    background-image: url(images/slogan.png);
    background-repeat: no-repeat;
  }

#lang{
    position: absolute;
    right: 200px;
    top: 27px;
    }
	#lang a{
		display: block;
		position: relative;
		width: 27px;
		height: 27px;
		margin-right: 15px;
		float: left;
		text-align: center;
		overflow: hidden;
	}
	#lang a span{
		display: block;
		position: absolute;
        width: 27px;
        height: 27px;
		top: 0;
		left: 0;
        z-index: 10;
		background-repeat: none;
	}
	#lang a.en span{
		background-image: url(images/en.png);
	}
    #lang a.cs span{
        background-image: url(images/cs.png);
    }
	
#search{
	position: absolute;
	right: 0;
	top: 27px;
}

#menu{
  position: absolute;
  bottom: 0;
  left: 118px;
  display: block;

  height: 40px;
  width: 862px;
  background-image: url(images/menu-bg.png);
  background-repeat: repeat-x;
  }
  
  #menu ul{
    list-style: none;
    margin: 0;
    padding: 0;
  }
	
	#menu li{
		list-style: none;
		position: relative;
    margin: 0;
    padding: 0;
	}
	
	#menu a{
		text-decoration: none;
		padding: 0;
		margin: 0;
	}
  
	/* level 1 */
	
  #menu li.level1{
    display: block;
    margin: 0 3px 0 0;
		padding: 9px 0 0 0;
    float: left;
    height: 31px;
		/*background-image: url(images/menu-bg.png);*/
    }
    
    #menu li.left,
    #menu li.right{
    	margin: 0;
      width: 10px;
			height: 40px;
			float: left;
      overflow: hidden;
      background-repeat:no-repeat;
    }
    
    #menu li.left{
      background-image: url(images/menu-left.png);
      background-position: left top;
    }

    #menu li.right{
      background-image: url(images/menu-right.png);
      background-position: right top;
      position: absolute;
      top: 0;
      right: 0;
    }

   
  #menu a.level1{
    height: 40px;
    padding: 0 13px;
    font-size: 80%;
    color: #854603;
    font-weight: bold;
    }
  
    #menu a.level1 span{
    }
  
    #menu li.level1:hover
    #menu li.level1.hover,
		#menu li.level1.section,
		#menu li.level1.current,
		#menu li.level1.active{
      color: #fff;
      background-image: url(images/menu-bg-hover.png);
      background-position: center top;   
    }
		
		#menu li.level1:hover a.level1,
		#menu li.level1.hover a.level1,
		#menu li.level1.section a.level1,
		#menu li.level1.current a.level1,
		#menu li.level1.active a.level1{
      color: #fff;
		}
		
		/* level 2 */
		
		#menu li.level1 ul{
			position: absolute;
			width: 180px;
			background-color: #FDF4D9;
			border: solid #E3A400 1px;
			display: none;
		}
		
		#menu li.level1 li{
			width: 180px;
		}
		
		#menu ul.level2{			
			top: 36px;
			left: 0;
		}
		
		#menu li.level2{
			}
			
			#menu li.level2 a{
				display: block;
				margin: 0;
				width: 145px; /* 180 - (20 + 18) */
				padding: 5px 20px 5px 15px;
				margin: 0;
				/* border-top: solid #FFFFFF 1px; */
				border-bottom: solid #FCD27A 1px;
				font-size: 85% !important;
				color: #5A5A5A;
				background-repeat: no-repeat;
				background-position: 165px center;
			}
			
			#menu li.level2 a span{
				margin: 0;
				padding: 0;
			}
			
			#menu li.level2 a.menu{
				background-image: url(images/menu-sub-arrow.png);
			}
			
			#menu li.level2 a:hover,
			#menu li.level2 a.active{
				background-color: #EFA308;
				color: #fff;
			}
			
			#menu li.level2 a.menu:hover,
			#menu li.level2 a.menu.active{
				background-image: url(images/menu-sub-arrow-active.png);
			}
		
		/* level 3 */
		
		#menu ul.level3{
			position: absolute;
			left: 180px;
			top: -2px;
		}

		/* level 4 */
		
		#menu ul.level4{
			position: absolute;
			left: 180px;
			top: -1px;
		}

		/* menu end */
		
#crumb-line{
  position: relative;
  margin: 7px 3px 8px 3px;
  font-size: 85%;
  }
  
  #sitemap-link{
    position: absolute;
    right: 0;
    top: 0;
    }
      
  #crumb-line a{
    color: #F5A702;
  }
  
  #crumb-line #crumb a{
    font-weight: bold;
  }
  
  #crumb-line a:hover,
  #crumb-line a:focus{
    text-decoration: none;
  }
  
  #crumb-line a:visited{
    color: #76787B;
  }
  
  
/* --- BODY --- */

#body{
  position: relative;
	z-index: 0;
}
  
/* content */
  
#content{
	position: relative;
  width: 747px;
  background-repeat: repeat-y;
  background-position: center;
  background-image: url(images/content-bg.png);
  
  }
  
  #content-top{
    height: 116px;
    background-repeat: no-repeat;
    background-position: center top;
    /* from template: background-image: url(../images/headers/usbsp-building-header.jpg); /*url(images/content-home-top.jpg);*/
		background-color: #DBD7BA;
    }
		
		.home-page #content-top{
	    height: 155px;
			background-image: url(images/content-home-top-1.jpg);
		}
    
    #content-top h2{
			position: absolute;
			margin: 0;
			padding: 0;
			top: 74px;
			left: 20px;
			color: #fff;
			font-weight: normal;
			font-size: 27px;
    }
		
		.home-page #content-top h2{
			display: none;
		}
  
  #content-text{
    background-position: center bottom;
    background-repeat: no-repeat;
    background-image: url(images/content-text-bg.png);    
    padding: 10px 30px 30px 30px;
		
		min-height: 300px;
		height: auto !important; /* IE */
		_height: 300px; /* IE */
  }

/* sidebar */  

#sidebar{
  position: absolute;
  top: 0;
  right: 0;
  width: 222px;
  }
  
	#sidebar.home-page{
		top: 2px;
	}
	  
  #sidebar .box{
    width: 222px;
		margin-bottom: 11px;
    background-repeat: repeat-y;
    background-position: center top;
    background-image: url(images/sidebar-box-bg.png);
	  }
		
	  #sidebar .box h3{
	    margin: 0;
	    padding: 5px 0 6px 0;
	    font-size: 100%;
	    color: #fff;
	    font-weight: normal;
	    text-align: center;
	    background-repeat: no-repeat;
	    background-position: center top;
	    background-image: url(images/sidebar-box-top.png);
	  }
	  
		#sidebar .box.navigation h3{
	    background-image: url(images/sidebar-navbox-top.png);		
		}
		
	  #sidebar .box .text{
	    min-height: 70px;
	    padding: 10px 16px;
	    background-repeat: no-repeat;
	    background-position: center bottom;
	    background-image: url(images/sidebar-box-text-bg.png);
		}
	
	#sidebar .button{
		width: 224px;
		margin-bottom: 11px;
		}
		
		#sidebar .button a{
			display: block;
			width: 224px;
			height: 49px;
		  background-repeat: no-repeat;
		  background-position: center top;
		  background-image: url(images/hp-btn-bg.png);
			color: #fff;
			text-decoration: none;
			text-align: center;
		}
		
		#sidebar .button span{
			display: block;
			padding-top: 14px;
		}
		
		#sidebar .button.pitt-btn span{
			display: block;
			padding-top: 7px;
		}
		
/* --- navigation box --- */

.box.navigation li{
	margin: 7px 0;
	line-height: 100%;
}


.box.navigation a{
	display: block;
	background-position: left center;
	background-repeat: no-repeat;
	
	text-decoration: none;
	background-image: url(images/nav-dash.png);
	color: #787777;
	_height: 1em;
}

.box.navigation a:hover,
.box.navigation a:focus{
	text-decoration: underline;	
}

.box.navigation a.current{
	text-decoration: none;
	color: #F8BD25 !important;
	/*font-weight: bold*/;
}

.box.navigation li.level-1{
		margin: 0 0 15px 0 !important;
		padding: 0 0 0 0;
	}
		
	.box.navigation a.level-1{
		padding-left: 17px;
		/*color: #869FDD;*/
		font-weight: bold;
		font-size: 100%;
	}	
	
	.box.navigation a.level-1:visited{
		/*color: #aaa;*/
	}	
	
	.box.navigation a.level-1.current{
		background-image: url(images/nav-arrow-right.png);
	}
	
	.box.navigation a.level-1.section{
		background-image: url(images/nav-arrow-down.png);
	}
	
	
.box.navigation li.level-2{
		margin: 7px 0 !important;	
	}
	
	.box.navigation a.level-2{
		padding-left: 15px;
		margin-left: 13px;
		font-size: 95%;	
	}
	
	.box.navigation a.level-2.current{
		background-image: url(images/nav-arrow-right.png);

	}
	/*
	.box.navigation a.level-2.section{
		background-image: url(images/nav-arrow-down.png);
	}
	*/

.box.navigation li.level-3{
	}

	.box.navigation a.level-3{
		padding-left: 15px;
		margin-left: 26px;
		font-size: 90%;
	}
	
	.box.navigation a.level-3.current{
		background-image: url(images/nav-arrow-right.png);
	}
	/*
	.box.navigation a.level-3.section{
		background-image: url(images/nav-arrow-down.png);
	}
	*/
  
  
/* --- FOOTER --- */

#footer{
  margin: 8px 0 0 0;
	position: relative;
  height: 55px;
  background-repeat: no-repeat;
  background-position: center top;
  background-image: url(images/footer-bg.png);
  }
  
  #footer p{
    margin: 0;
    padding: 20px;
    color: #5e5e5e;
    font-size: 90%;
  }
	
  #d3s-logo{
		position: absolute;
		display: block;
		right: 18px;
		top: 13px;
		width: 80px;
		font-size: 12px;
		color: #5e5e5e;
		text-align: right;
	}
  
	
/* === INDIVIDUAL PAGES ==================================================== */
  
  
/* --- HomePage --- */

.home-page #content-text{
	padding: 0 20px;
}

.hp-main-content{
	width: 330px;
	margin-top: 2.1em;
	float: left;
}
  
.hp-links-content{
	width: 330px;
	float: right;
}  
  
.hp-content-text-inner{
	margin: 0;
	width: 705px;
	
	background-image: url(images/hp-col-separator.png);
	background-repeat: no-repeat;
	background-position: top center; 
}

.home-page #content-text h3{
	margin-top: 0.2em !important;
	font-size: 200%;
}
  
/* last news box */

.box ul{
	list-style: none;
	margin: 0;
	padding: 0;
}


#news-list-box{
	line-height: 100%
	}
	
	#news-list-box li{
		font-size: 90%;
		margin: 0 0 10px 0;
		clear: both;
		}
	
	#news-list-box a{
		color: #6986D4;
		font-weight: bold;
		display: block;
	}
	
	#news-list-box span{
		float: right;
		font-size: 90%;
	}
	
	#news-list-box div.news-summary{
		margin: 5px 0 0 0 ;
		}
	
		#news-list-box div.news-summary p{
			margin: 0 0 5px 0;
		}

  
/* --- Faculty Person --- */
	
.faculty-person .photo{
	float: right;
	}
 
	.faculty-person .photo img{
		border: solid #E0E0E0 1px;
	}
	
/* --- Faculty List --- */

.faculty-list{
	}
	
	.faculty-list .person{
		clear: left;
		margin: 10px;
		border-top: solid #eee 1px;
	}
	
	.faculty-list .photo{
		float: left;
		margin: 10px 5px 5px 0;
	}
	
	.faculty-list .info{
		margin-left: 80px;
		}
		
		.faculty-list .info h4{
			font-size: 105%;
			margin: 10px 0 2px 0;
		}
		
			.faculty-list .info h4 a{
				color: #77787B;
			}
			.faculty-list .info h4 a:visited{
				color: #aaa;
			}  
			
		.faculty-list .info p{
			margin: 0;
		}
			
/* --- Open Enrollment Courses --- */

.courses-list{
	
}

	.courses-list table{
		border-collapse: collapse;
		border: solid #f2f2f2;
	}

	.courses-list td{
		font-size: 105%;
	}

	.courses-list tr.p1 td{
		background-color: #eee;
		font-size: 85%;
	}
	
div.course-info{
	border: solid #bbb 2px;
	background-color: #bbb;
	margin: 12px 0 10px 0;	
	}
	
	div.course-info table{
		border: none;
		width: 100%;
		border-collapse: separate;
	}
	
	div.course-info td{
		margin: 2px;	
		background-color: #fafafa;
		width: 35%;
	}
	
	div.course-info th{
		border: none;
		background-color: #f2f2f2;
		color: #787777;
		width: 100px;
		text-align: left;
		font-size: 90%;
		font-weight: bold;	
		width: 15%;
	}
	
	div.course-info td{
		border: none;
	}

	
/* --- News List --- */

.news-list{
	
	}
	
	.news-list .item{
		margin: 10px 0;
		border-top: solid #eee 1px;
	}
	
	.news-list .item h4{
		font-size: 105%;
		margin: 10px 0 2px 0;
	}
	
	.news-list .itme span{
		display: block;
	}
	
.typography div.date{
	font-size: 80%;
	margin: 3px 0;
}

.typography div.summary{
	border: solid #F7F7F7 1px;
	background-color: #FDFDFD;
	padding: 1px 10px 0 10px;
	margin: 12px 0 10px 0;	
}

	
/* --- Video Page --- */

.video-box{
	margin: 30px 23px 20px 23px;
	}
	
/* --- SiteMap Page --- */

#sitemap-list {padding:0 0 0 10px; margin:0; list-style:none; font-weight:bold; line-height:150%} /*1st level list*/
#sitemap-list li {padding:10px; margin-top:10px; font-size:13px; background:#f0f0f0;} /*1st level items*/
 
#sitemap-list ul {margin:5px 10px 5px 10px; padding:5px 10px; font-weight:normal; background:#f8f8f8;} /*2nd level lists*/
#sitemap-list li li {padding:0; margin:0; list-style:none; font-weight:bold; font-size:11px; line-height:18px; background:none} /*2nd level items*/
 
#sitemap-list ul ul {margin-left:10px;padding:5px 10px;  background:#fff;} /*3rd level lists*/
#sitemap-list li li li {font-size:11px; font-weight:normal;} /*3rd level items*/

  
  