/***********************************************************************
	Official UNIVERSITY OF HOUSON stylesheet for audience gateway pages.  
	This stylesheet is imported into official UH audience gateways.
	Created: July 2007, by the IT Web Technologies Group.  
	Last Updated: July 2007

 CONTENTS: 
	
	ELEMENTS
	---------
	h2


 	CLASSES
	---------
	gateway columns, borders
	
	IDs
	---------
	announcements, audiences, columns, content well, gateways, home-banner*, inset box, news, tabs
	
	PLACEHOLDERS
	--------------
	half-columns, headlines, spiffs, widgets
	
/************************************************************************/

@import url(fonts-min.css);
@import url(header.css);
@import url(main-web.css);
	
/*****************************************

                 ELEMENTS
				   
*****************************************/
h2{
	padding: 10px 0 0 0;
}
	
	
	
/*************************************************

				     CLASSES 
					 
*************************************************/

/* ========      GATEWAY CLASSES    ======== */

.gateway-one-column, .gateway-two-column, .gateway-half-three-column, .gateway-three-column{
	clear: none;
	float: right;
	margin: 0;
	overflow: auto;
	padding: 0;
	}
	
.gateway-half-three-column{
	width: 320px;
	}
	
.gateway-one-column{
	width: 210px;
	}

	
.gateway-one-column .spiff, .gateway-one-column .spiff img{
	width: 205px;
	}
.gateway-one-column .spiff{
    margin: 10px 0 0 0;
}

.gateway-three-column{
	width: 648px;
	}

.gateway-two-column{
	width: 428px;
	}

.gateway-content{
  padding: 6px 10px;
}

/* ========      borders    ======== */

.border-top {
	border-top: #000 1px dashed;
	}
	
.border-bottom {
	border-bottom: #000 1px dashed;
	}

h2.border-top{
margin: 20px 0px 0px 0px;
padding: 10px 0px 6px 0px;
}

h2.border-top-yellow {
	border-top: #000 1px dashed;
	margin: 20px 0px 0px 0px;
	padding: 10px 0px 6px 10px;
	background-color:#FCF5C1;
	}

/* ========      HEADER CLASSES    ======== */

.header-yellow {
	background-color:#FCF5C1;
	 padding-left: 10px; 
	 padding-bottom: 5px;
	}

/*************************************************

				     IDs
					 
*************************************************/


/* ========      ANNOUNCEMENTS    ======== */
#announcement{
	background: transparent;
	height: 200px;
	left: 7px;
	margin: 0 0 0 0;
	overflow: auto;
	position: relative;
	top: -322px;
	width: 265px;
	z-index: 4;
	}

#announcement-copy{
	color: #333333;
	margin: 4px 10px 7px 5px;
	}

#announcement-headline{
	color: #cc0000;
	margin: 4px 10px 7px 5px;
	}
	
#announcement-photo{
	border: 1px #000000;
	border-style: none none dashed none;
	display: block;
	padding: 0 0 1px 0;
	}






/* ========      AUDIENCES    ======== */

#audience{
	color: #cc0000;
	font-size: 152%;
	margin: 15px auto 0 auto;
	padding: 0 0 0 20px;
	text-transform: uppercase;
	width: 945px;
	}

#audiences li{
	margin: .8em 0 0 0;
	}

#audiences li a{
	text-decoration: none;
	color: #cc0000;
	}
	
	
	
	
	
/* ========      COLUMNS    ======== */


	
#adaptive-right-column{
	float: right;
	margin: 2px 10px 0 0px; 
	overflow: show;
	padding: 0;
	width: 660px;
	}
	
#fixed-left-column{
	float: left;
	margin: 2px 0 0 0; 
	padding: 0 0 0 10px;
	width: 240px;
	}

#fixed-left-column .spiff, #fixed-left-column .spiff img{
width: 230px;
}

#fixed-left-column .spiff{
margin: 0 0 0 2px;
}

#inset-box-columns{
	background: transparent url(/images/inset-box-wide-sides.gif);
	background-repeat: repeat-y;
	overflow: auto;
	padding: 4px 0 0 0;
	width: 935px;
	}
	
#right-column-items{ /*mod from main-web.css*/
	height: 365px;
	padding: 70px 10px 0 0;
	width: 226px;
	}

#right-column-items h2{
	border: 1px #000000;
	border-style: none none dashed none;
	color: #cc0000;
	padding: 0 0 3px 35px;
	}
	
	
	
	
	
/* ========      CONTENT WELL    ======== */

#content-well {  /*mod from main-web.css*/
	padding: 0 20px;
	z-index: 4;
	}
	
	
	
	
	
/* ========      GATEWAYS    ======== */
	
#gateway-tabs {
	background: url(/images/gateway-tab-bg.gif);
	background-repeat: no-repeat;
	height: 45px;
	margin: 0 0 0 0;
	padding: 0;
	width: 935px;
	}

#gateway-tabs li{
	display: inline;
	float: left;
	height: 39px;
	list-style-type: none;
	margin: 0;
	padding: 6px 0 0 0;
	}
	
#gateway-tabs li a:hover{
	color: #ffffff;
	}

#gateway-tabs li.first a{
	border-style: none;
	}
	
#gateway-tabs li a.active, #gateway-tabs li a.active:hover{
	color: #666666;
	}
	
	
	
	
	
/* ========      HOME BANNER    ======== */

#home-banner{
	margin: -59px auto 0px  auto;
	position: relative;
	top: 0px;
	left: 240px;
	padding: 0 0 0 0;
	width: 945px;
	height: 61px;
	/*background-image: url("/images/gateway-banner.jpg");
	background-repeat: no-repeat;*/
	}
	
#home-banner-caption{
	border: 1px #999999;
	border-style: none none solid none;
	color: #cc0000;
	font-size: 114%;
	left: 660px;
	line-height: 100%;
	padding: 3px;
	position: relative;
	text-align: right;
	top: 0px;
	width: 275px;
	}





/* ========      INSET BOX    ======== */

#inset-box{
	margin: 0 0 0 0;
	padding: 0;
	width:935px;
	}
#inset-box-header{
background: #ffffff url(../images/inset-box-wide-top.gif);
	background-repeat: no-repeat;
	height: 21px;
	margin: 0 0 0 0;
	padding: 0;
	width: 935px;
}
#inset-box-footer{
	background: transparent url(../images/inset-box-wide-bottom.gif);
	background-repeat: no-repeat;
	height: 21px;
	margin: 0 0 0 0;
	padding: 0;
	width: 935px;
	}
	
	
	
	
	
/* ========      NEWS    ======== */

#news-controls{
	border: 1px #00cc00 solid;
	height: 20px;
	margin: 10px 0 0 0;
	padding: 0 0 0 35px;
	width: 185px;
	}
	
#news-headlines{
	border: 1px #00cc00 solid;
	height: 290px;
	padding: 10px 0 3px 35px;
	width: 185px;
	}
	
	
	
	
	
/* ========      TABS    ======== */

.three-tab .one a{ 
	background-position: 0px -106px; 
	}
.three-tab .one a:hover{ 
	background-position: 0px -206px; 
	}
.three-tab .one a.active{ 
	background-position: 0px -6px; 
	}
.three-tab .one a.active:hover{ 
	background-position: 0px -6px; 
	}
	

.three-tab .two a{ 
	background-position: -312px -106px; 
	}
.three-tab .two a:hover{ 
	background-position: -312px -206px; 
	}
.three-tab .two a.active{ 
	background-position: -312px -6px; 
	}
.three-tab .two a.active:hover{ 
	background-position: -312px -6px; 
	}

.three-tab .three a{ 
	background-position: -623px -106px; 
	}
.three-tab .three a:hover{ 
	background-position: -623px -206px; 
	}
.three-tab .three a.active{ 
	background-position: -623px -6px; 
	}
.three-tab .three a.active:hover{ 
	background-position: -623px -6px; 
	}
.four-tab .one a{ 
	background-position: 0px -106px; 
	}
.four-tab .one a:hover{ 
	background-position: 0px -206px; 
	}
.four-tab .one a.active{ 
	background-position: 0px -6px; 
	}
.four-tab .one a.active:hover{ 
	background-position: 0px -6px; 
	}
	

.four-tab .two a{ 
	background-position: -232px -106px; 
	}
.four-tab .two a:hover{ 
	background-position: -232px -206px; 
	}
.four-tab .two a.active{ 
	background-position: -232px -6px; 
	}
.four-tab .two a.active:hover{ 
	background-position: -232px -6px; 
	}

.four-tab .three a{ 
	background-position: -465px -106px; 
	}
.four-tab .three a:hover{ 
	background-position: -456px -206px; 
	}
.four-tab .three a.active{ 
	background-position: -465px -6px; 
	}
.four-tab .three a.active:hover{ 
	background-position: -456px -6px; 
	}

.four-tab .four a{ 
	background-position: -700px -106px; 
	}
.four-tab .four a:hover{
	background-position: -700px -206px; 
	}
.four-tab .four a.active{ 
	background-position: -700px -6px; 
	}
.four-tab .four a.active:hover{ 
	background-position: -700px -6px; 
	}

.five-tab .one a{ 
	background-position: 0px -106px; 
	}
.five-tab .one a:hover{ 
	background-position: 0px -206px; 
	}
.five-tab .one a.active{ 
	background-position: 0px -6px; 
	}
.five-tab .one a.active:hover{ 
	background-position: 0px -6px; 
	}

.five-tab .two a{ 
	background-position: -186px -106px; 
	}
.five-tab .two a:hover{ 
	background-position: -186px -206px; 
	}
.five-tab .two a.active{ 
	background-position: -186px -6px; 
	}
.five-tab .two a.active:hover{ 
	background-position: -186px -6px; 
	}

.five-tab .three a{ 
	background-position: -372px -106px; 
	}
.five-tab .three a:hover{ 
	background-position: -372px -206px; 
	}
.five-tab .three a.active{ 
	background-position: -372px -6px; 
	}
.five-tab .three a.active:hover{ 
	background-position: -372px -6px; 
	}

.five-tab .four a{ 
	background-position: -558px -106px; 
	}
.five-tab .four a:hover{ 
	background-position: -558px -206px; 
	}
.five-tab .four a.active{ 
	background-position: -558px -6px; 
	}
.five-tab .four a.active:hover{ 
	background-position: -558px -6px; 
	}

.five-tab .five a{ 
	background-position: -746px -106px; 
	}
.five-tab .five a:hover{ 
	background-position: -746px -206px; 
	}
.five-tab .five a.active{ 
	background-position: -746px -6px; 
	}
.five-tab .five a.active:hover{ 
	background-position: -746px -6px; 
	}
	
.four-tab li, .four-tab li a{
	width: 233px;
	}
.three-tab li, .three-tab li a{
	width: 311px;
}
	
.three-tab, .four-tab, .five-tab{
	background: url(/images/gateway-tab-bg.gif);
	background-repeat: no-repeat;
	height: 45px;
	margin: 0 0 0 0;
	padding: 0;
	width: 935px;
	}

.three-tab li, .four-tab li, .five-tab li{
	display: inline;
	float: left;
	height: 39px;
	list-style-type: none;
	margin: 0;
	padding: 6px 0 0 0;
	}
	
.three-tab li a, .four-tab li a, .five-tab li a{
	background: url(/images/gateway-tab-bg.gif);
	border: 1px #a5a5a5;
	border-style: none none none solid;
	color: #ffffff;
	display: block;
	font-size: 136%;
	height: 35px;
	margin: 0 0 0 0;
	overflow: hide;
	padding: 10px 0 0 0;
	text-align: center;
	text-decoration: none;
	}

.three-tab li a:hover, .four-tab li a:hover, .five-tab li a:hover{
	color: #ffffff;
	}

.three-tab .one a, .four-tab .one a, .five-tab .one a{
	border-style: none;
	}
	
.three-tab li a.active, .three-tab li a.active:hover, .four-tab li a.active, .four-tab li a.active:hover, .five-tab li a.active, .five-tab li a.active:hover{
	color: #666666;
	}

.five-tab li, .five-tab li a{
	width: 186px;
	}

.five-tab li.three, .five-tab li.three a{
	width: 187px;
	}

.three-tab li.two, .three-tab li.two a{
 width: 311px;
}	







/*************************************************      

     THESE STYLES ARE FOR PLACEHOLDERS ONLY.      

*************************************************/


/* ========      HALF COLUMN    ======== */
.half-column-filler{
	background: #ffffff;
	border: 1px #cc00cc solid;
	height: 285px;
	margin: 10px 0 10px 3px;
	overflow: auto;
	padding: 0;
	width: 300px;
	}
	
.half-column-header{
	background: #ffffff;
	border: 1px #cc9900 solid;
	height: 40px;
	margin: 10px 0 10px 3px;
	overflow: auto;
	padding: 0;
	width: 300px;
	}
	
	
	
	
	
/* ========      HEADLINES    ======== */

#headlines, #headlines-two{
	margin: 0;
	padding: 0;
	}

#headlines .headline-item, #headlines-two .headline-item{
	border: 1px #cc0000 solid;
	height: 65px;
	margin: 0 10px 10px 10px;
	padding: 0 10px 0 10px;
	width: 386px;
	}
	
	
	
	
	
	
/* ========      SPIFFs    ======== */

.spiff-bank-filler{
	border: 1px #00ff00 solid;
	height: 300px;
	margin: 10px 10px 0 10px;
	width: 628px;
	}
	
.spiff-filler{
	background: #ffffff;
	border: 1px #000000 solid;
	height: 220px;
	margin: 0 10px 10px 10px;
	width: 190px;
	}

.spiff-filler-right{
	background: #ffffff;
	border: 1px #000000 solid;
	height: 265px;
	margin: 10px 0 10px 3px;
	overflow: auto;
	padding: 0;
	width: 190px;
	}
	
	
	
	
	
/* ========      WIDGETs    ======== */

.widget-filler{
	border: 1px #cccc00;
	border-style: solid;
	height: 180px;
	margin: 0 10px 10px 10px; 
	padding: 0 0 0 0;
	width: 228px;
	}