/* This rule resets a core set of elements so that they will appear consistent across browsers. Without this rule, content styled with an h1 tag, for example, would appear in different places in Firefox and Internet Explorer because each browser has a different top margin default value. By resetting these values to 0, the elements will initially be rendered in an identical fashion and their properties can be easily defined by the designer in any subsequent rule. */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6 {
	border: 0;
	outline: 0;
	padding-top: 0;
	padding-right: 0;
	padding-left: 0;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0px;
	margin-left: 0;
}
 
/*This removes the border from around images.  This is done because the img attribute border is depreciated and won't validate WGAC but still shows the boder in images in some browsers*/
img{
	border:0px;
	}

/*This formats the entire web page.  It sets the colour and the background image, sets its repeat value and initial margin padding.  Some of this may be redundant from the intial settings.  I'm going to experiment with this and remove any redundant code from here.  The background colour is the blue, the background image is the stripes.  The font is set as verdana and sized in ems so the fonts remain in proportion when resized either by our mechanisim or any external method.*/
body{
	background-color: #025798;
	background-repeat: repeat;
	color: #000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.75em;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
	text-align: center;
	background-image: url(http://www.broward.edu/imagesglobal/background.gif);
	background-attachment: fixed;
	background-position: top center;
}

/*This deals with the specific pod page title colour.  The #podTitle h1 deals with the size and the weight of the font.  The classes set the colour based on which pod section is being used. */
#mainContentArea  #contentWrapper  #content  #bodyText  #podTitle h1 {
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-style:italic;
	line-height: 20px;
	font-weight: bold;
}

.futurePodTitle {
	color: #015697;
}
.successPodTitle {
	color: #d38400;
}
.careerPodTitle {
	color: #00bc00;
}
.campusPodTitle {
	color: #721bba;
}
.publicPodTitle {
	color: #b00300;
}

.defaultPodTitle {
	color: #000000;
}

/*This sets the formatting for h2 tags.  Colour is set to black here by default.  If this needs to be changed on a page DO NOT CHANGE IT HERE style the tag in the page in which its being used. */

h2 {
	color: #000;
	font-size: 1.5em;
	font-weight: bold;
	line-height: 14px;
}
/*This sets the properties for the mainContent Area (the overarching page content-body).  There is a default width here even tho the width is actually set in the page code just to make sure that in case of accidental deletion of that line from the jsp page there is still a set width here in the CSS.*/

#mainContentArea {
	background-color: #FFFFFF;
	margin: 0 auto 0 auto;
	text-align: left;
	width: 800px;
}


/*This controls the header text links (Text Only, Jobs, and Contact Us.  The text is styled yellow as active links.  They underline when moused over.  The #headerTextLinks handles the formatting of the text links and the rest format the links for active, visited and hover.*/

#mainContentArea #header #headerTextLinks {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #0000FF;
	width: 270px;
	position: absolute;
	top: 72px;
	left: 0px;
	float: none;
	height: auto;
	font-weight: bold;
	z-index: 0;
}
/*This foramts the headerTextLinks when they are active links */
#headerRightContent #headerTextLinks a:link {
	color: #FFFF00;
	text-decoration: none;
	font-weight: bold;
}
/*This foramts the headerTextLinks when they are visited links.  The colour is set here as well so the links maintain the same colour even after they've been clicked on. */
#headerRightContent #headerTextLinks a:visited {
	color:#FFFF00;
	text-decoration: none;
}
/*This foramts the headerTextLinks when they are moused over.*/
#headerRightContent #headerTextLinks a:hover {
	text-decoration: underline;
}


/*This handles all the content for the header. The holiday image in the header will be changed using the header template and changing the URL reference in the background-image property from headerbkgrnd.jpg to correct seasonal image. */

#mainContentArea #header {
	background-color: #0000ee;
	background-image: url(http://www.broward.edu/imagesglobal/headerbkgrnd.jpg);
	background-repeat:repeat-x;
	height: 257px;
	position: relative;
	overflow: visible;
}

/*This is the Broward College block image in white Logo. */
#mainContentArea #header #headerLogo {
	height: 96px;
	width: 279px;
	position: absolute;
	top: 4px;
	right: 0px;
	float: right;
}

/*This is the main outter div for the header right content (search boxes, tools, text links, translate */
#mainContentArea #header #headerRightContent {
	height: 150px;
	position: absolute;
	right: 305px;
	top: 94px;
	left: 539px;
	width: 250px;
}

/*This is the outter div for all the pod buttons. This serves as the boundry so the pod buttons could be positioned in absolute terms within a defined area (rather than the entire header) */
#buttons {
	width: 531px;
	height: 257px;
	position: relative;
}

/*These are the individual divs for the pod buttons.  */
#buttons #futurePodButton {
	width: 132px;
	height: 132px;
	clear: none;
	z-index: 4;
	left: -4px;
	position: absolute;
	top: 0px;
}
#buttons #successPodButton {
	z-index: 5;
	top: 78px;
	position: absolute;
	left: 71px;
	width: 126px;
	height: 137px;
	float: left;
	clear: none;
}
#buttons #careerPodButton {
	float: left;
	height: 126px;
	width: 132px;
	position: absolute;
	z-index: 6;
	top: 114px;
	left: 180px;
	clear: none;
}
#buttons #campusPodButton {
	float: left;
	height: 126px;
	width: 132px;
	top: 114px;
	position: absolute;
	left: 292px;
	z-index: 7;
	clear: none;
}
#buttons #publicPodButton {
	float: left;
	height: 125px;
	width: 132px;
	z-index: 8;
	top: 114px;
	position: absolute;
	left: 403px;
	clear: none;
}

/*This handles the hidden descriptive text of the pod buttons.  It only serves to keep the descriptive text in the code and off the page and visible to Google */
#buttons #descriptiveText {
	visibility:hidden;
}

/*This formated and postiions the font resizer tool.  This is relative positioned so it floats a bit off the left side regardless of the page width set in mainContent.  This also keeps it from wrapping when the page text is increased. */
#content #fontResizer  {
	width: 150px;
	position: relative;
	height: 20px;
	font-size: smaller;
	left: 588px;
	top: -10px;
	visibility: visible;
}

/* This is the outter div for the header drop down search section. */
#mainContentArea #header #headerSearch {
	width: 260px;
	position: absolute;
	left: 4px;
	top: 26px;
	clear: none;
}

/*This is the outter wrapper for the translate section.  */
#mainContentArea #header #headerTranslate {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #FFFFFF;
	width: 280px;
	position: absolute;
	top: 91px;
	left: 0px;
}

/*This is the outter wrapper div for the header tools section */
#mainContentArea #header #headerTools {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.8em;
	color: #FFFFFF;
	width: 280px;
	position: absolute;
	top: 122px;
	left: 0px;
}


/*This is the primary outter wrapper for the body content.  It supplies the background edge on the left side in blue with shadow and keeps the body content line with the header */
#mainContentArea #contentWrapper {
	background-color: #FFFFFF;
	background-image: url(http://www.broward.edu/imagesglobal/bodyBackground.jpg);
	background-repeat: repeat-y;
}

/*This is the content wrapper.  It's a child of the contentWrapper div and holds the body content (page content) div */
#mainContentArea #contentWrapper #content {
	margin-left: 51px;
	background-image: none;
	overflow: hidden;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 5px;
	font-size: 1em;
	clear: right;
}

/*This is the container div for the footer */
#mainContentArea #footer {
	background-color: #FFFFFF;
	background-image: url(http://www.broward.edu/imagesglobal/bodyBackground.jpg);
	padding-top: 5px;
	padding-left: 64px;
	background-repeat: repeat-y;
}


/* This is the code for the left nav */
#leftNavigation {
	width: 180px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #FFFFFF;
	overflow: hidden;
}
#leftNavigation #letNavigationHead {
	background-position: top;
	height: auto;
	overflow: visible;
}
#leftNavigation #letNavigationHead #navTitleText {
	font-weight: bold;
	padding-top: 28px;
	top: 25px;
	padding-bottom: 5px;
	padding-left: 50px;
	padding-right: 10px;
}

#leftNavigation #letNavigationHead #navTitleText a {
		color:#FFFFFF;
		text-decoration:none;
}

#leftNavigation #letNavigationHead #navTitleText a:hover {
		color: #FFFF00;
		text-decoration:underline;
}

#leftNavigation #letNavigationHead #navTitleText a:visited {
		color:#FFFFFF;
		text-decoration:none;
}

#leftNavigation #leftNavitationBody {
	position: relative;
	top: 0px;
	height: auto;
	background-image: url(http://www.broward.edu/imagesglobal/nav/nav_main_back.gif);
}
#leftNavigation #leftNavitationBody #leftNavBodyText {
	position: relative;
	padding-bottom: 3px;
	padding-top: 1px;
	margin-left: -30px;
}
#leftNavigation #leftNavitationBody #leftNavBodyText ul {
	list-style-type: none;
	line-height: 13pt;
	margin-top: 4px;
}
#leftNavigation   #leftNavitationBody   #leftNavBodyText   ul   li  ul  li {
	text-indent: -25px;
}
#leftNavigation   #leftNavitationBody   #leftNavBodyText a {
	color: #FFFFFF;
	text-decoration: none;
}
#leftNavigation   #leftNavitationBody   #leftNavBodyText a:hover {
	color: #FFFF00;
}



/*This handles the positioning of the body content inside the content div */
#mainContentArea #contentWrapper #content #bodyText {
	padding-right: 5px;
	padding-left: 5px;
}


/* formats the text links in the header.  They are put in as an unorderd list as an attempt to work around the google translate bug. */
#mainContentArea #header #headerRightContent #headerTextLinks ul {
	list-style-type: none;
	margin-right: 0px;
	margin-left: 0px;
	text-align: left;
	display: inline;
	list-style-position: outside;
}
#mainContentArea #header #headerRightContent #headerTextLinks li {
	white-space: nowrap;
	display: inline;
}

#mainContentArea #contentWrapper #content #bodyText #bodyUL ul {
	list-style-type: none;
}
/*#mainContentArea #contentWrapper #content #bodyText #bodyUL li {
	display: inline;
}*/
#dropdownSearchArea /*Style code for expanding search area. . the height property here is the defualt (closed) size.  It's changed via javascript in the page on the div mouseover.*/
 {
	width: 258px;
	background-image: url(http://www.broward.edu/imagesglobal/searchdropbkgrnd.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	color: #FFFFFF;
	height: 45px;
	display: inline-block;
	top: 112px;
	padding-left: 7px;
	position: absolute;
	overflow: hidden;
	z-index: 1000;
	left: 533px;
	clear: both;
}

#dropdownSearchArea a:link {
	color: #FFFF00;
	font-weight: bold;
}

#dropdownSearchArea a:visited {
	color: #FFFF00;
	font-weight: bold;
}

/*this is the test script for the tool tips for the pod buttons.  DO NOT CHANGE. */

#dhtmltooltip{
	position: absolute;
	left: -300px;
	width: 150px;
	border: 1px solid black;
	padding: 2px;
	background-color: #e8e8e8;
	visibility: hidden;
	z-index: 100;
	}
	
#dhtmlpointer{
position:absolute;
left: -300px;
z-index: 101;
visibility: hidden;
}
/*Remove below line to remove shadow. Below line should always appear last within this CSS.  This is commented out because it uses an IE specific filter to create the shadow and it breaks the W3C Validation of the CSS.
filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);*/




/*This formats the wheel graphic on the athletics pod page.  This may move to the athletics page to keep page specific styling out of the main.css file */

#mainContentArea #contentWrapper #content #bodyText #athleticsWheel {
	background-image: url(/campuslife/sports/images/athleticsWheel.jpg);
	height: 456px;
	width: 459px;
	background-repeat: no-repeat;
	background-position: center top;
	position: relative;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.92em;
}

#mainContentArea #contentWrapper #content #bodyText #athleticsWheel #athleticsWheelTextOne {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .96em;
	height: 88px;
	width: 157px;
	position: absolute;
	left: 158px;
	top: 15px;
}
#mainContentArea #contentWrapper #content #bodyText #athleticsWheel #athleticsWheelTextTwo {
	height: 100px;
	width: 157px;
	position: absolute;
	top: 245px;
	left: 15px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .96em;
}

#mainContentArea #contentWrapper #content #bodyText #athleticsWheel #textThree {
	height: 126px;
	width: 157px;
	position: absolute;
	left: 310px;
	top: 240px;
}
/*This formats the athletics buttons.  This may move to the athletics page */
#mainContentArea #contentWrapper #content #bodyText #athleticsButtons {
	height: auto;
	width: auto;
	float: right;
	clear: left;
	padding-top: 15px;
}


/*This sets the float for graphics on the right side of the pod landing page layouts.  */
#mainContentArea #contentWrapper #content #bodyText #rightSideGraphics {
	float: right;
}


/*Items for Homepage These may move to the home page.*/

#actionMenu {
	width: 340px;
	height: auto;
	float: right;
}
#actionMenu #actionMenuTop #actionMenuButtons {
	text-align: center;
	padding: 15px;
}
#actionMenu #actionmenuMiddle #actionMenuText {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-weight: bold;
	width: 310px;
	margin-right: 5px;
	margin-left: 5px;
}
#actionMenu #actionMenuTop {
	background-image: url(http://www.broward.edu/imagesglobal/homePage/actionlist_topback.gif);
	width: 330px;
	height: 170px;
	background-repeat: no-repeat;
}
#actionMenu #actionmenuMiddle {
	background-image: url(http://www.broward.edu/imagesglobal/homePage/actionlist_midback.gif);
	height: auto;
	width: 330px;
	background-repeat: no-repeat;
}
#actionMenu #actionmenubottom {
	background-image: url(http://www.broward.edu/imagesglobal/homePage/actionlist_botback.gif);
	background-repeat: no-repeat;
	height: 31px;
	width: 340px;
}

#mainContentArea #contentWrapper #content #bodyText #leftCol {
	float: left;
	position: relative;
	width: 49%;
	height: 500px;
	clear: left;
	left: 0;
}
#askUs    {
	height: 78px;
	width: 258px;
	/*background-image: url(/images/homePage/askusbox_prospective.gif);*/
	background-repeat: no-repeat;
	background-position: left top;
}
#mainContentArea #header #dropdownSearchArea #askus {
	position: absolute;
	top: 300px;
	left: 0px;


}
#mainContentArea #header #dropdownSearchArea #Advanced #advSearch {
	position: absolute;
	left: 0px;
	top: 80px;
	width: 247px;
}
#mainContentArea #header #dropdownSearchArea #Advanced {
	position: absolute;
	top: 0px;
	width: 258px;
	left: 0px;
}

#mainContentArea #header #dropdownSearchArea #find {
	position: absolute;
	top: 160px;
	left: 0px;
	visibility: visible;
}

#askUs #askUsForm #Form_ps #askusFormField {
}
#askUs #askUsForm #Form_ps #askusFormField input {
	width: 25px;
}
#askUs #askUsForm {
	position: relative;
	width: 80%;
	left: 50px;
	top: 25px;
}
#mainContentArea #header #dropdownSearchArea #askus #askusText {
	position: relative;
	width: 200px;
	left: 56px;
	top: -12px;
}

#askUsFuture   {
	height: 78px;
	width: 258px;
	background-image: url(http://www.broward.edu/imagesglobal/homePage/askusbox_prospective.gif);
	background-repeat: no-repeat;
	background-position: left top;
	
}

#askUsFuture #askUsFutureForm #Form_ps #askusFormField input {
	width: 50%;
}
#askUsFuture  #askUsFutureForm {
	position: relative;
	width: 90%;
	left: 70px;
	top: 30px;
}


/*These handle text and backgrounds for the footer */
#mainContentArea #footer #footerTextLinks {
	font-size: smaller;
	line-height:18px;
	text-align: center;
}
#mainContentArea  #footer  #footerTextLinks a:link {
	font-style: normal;
	text-align: center;
	
}

#mainContentArea #footer #footerImage {
	background-image: url(http://www.broward.edu/imagesglobal/footer_backgroundA.gif);
	background-repeat: repeat-x;
}

/*This sets the position of the sidebar graphic.  the path of the image is set in the jsp page */
#mainContentArea #contentWrapper #content #sidebarGraphic {
	position: relative;
	float:left;
	width:38px;
	top: 10px;
	margin-left: -50px;
	
	
	
}

/*These were an attempt to do dual column layouts in the main body.  I may use them for something else so I'm leaving them for right now but they may go away */
#mainContentArea #contentWrapper #content #bodyText #leftside {
	float: left;
	width: 405px;
	padding-right: 10px;
	height: 400px;
}
#mainContentArea #contentWrapper #content #bodyText #rightside {
	float: right;
	width: 350px;
}

/*This is the revised CSS code for the myBC login */
#myBCLogin #logon2 .formfield {
	clear: right;
}
#myBCLogin label {
	text-align: left;
	clear: left;
	float: left;
	width: 10%;
	margin-left: 0px;
	padding-left: 6px;
	padding-right: 12px;
}
.buttons {
	float: right;
	clear: left;
}
#myBCLogin {
	background-image: url(http://www.broward.edu/imagesglobal/homePage/mybc_back3.gif);
	background-repeat: no-repeat;
	background-position: center top;
	height: 150px;
	width: 370px;
	position: relative;
}
#myBCLogin #myBCLoginForm {
	width: 200px;
	position: relative;
	left: 160px;
	top: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}
#myBCLogin #myBCLoginForm #logon2 #myBCLoginLinks {
	padding-bottom: 20px;
}

#myBCLogin #myBCLoginForm #myBCForm #myBCLoginTitle {
	position: relative;
	top: 10px;
}

table {
	font-size:12px;
}


.contentClass {
	margin-left: 51px;
	background-image: none;
	overflow: hidden;
	padding-top: 10px;
	padding-bottom: 10px;
	padding-left: 5px;
	font-size: 1em;
	clear: right;
}

/*This sets the line height of the ADA nav to 0 so it doesn't appear in the page but does if the css is turned off */
#hiddenNav {line-height:0px;}

.buttonbar {
	display:block;
	text-align:center;
	margin-right: auto;
	margin-left: auto;
	width: 650px;
}

/*This is the style code for the tables with icons.  It sets the text smaller than the main body text */
.icontext {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
}


/* This is the formatting style code for the legend tables for the google maps.  */

.mapLegend  {
	font-size: 12px;
}

.mapLegend a:hover {
	color: #FF0000;
}

/*This is the style code that was set in the /success/lrc/index.jsp page. . it's moved here for uniformity */
.tiny {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
}
.titlesmall {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: italic;
	font-weight: bold;
	color: #EA8C00;
}

/*This is some basic styling for forms.  */

#formRow {
	clear:both;
	padding-top:5px;
}

#formLabel {
	width:100px;
	float:left;
	text-align:right;
	font-weight:bold;
}

#formElement {
	width:250px;
	float:right;
	text-align:left;
}

#formButtons {
	text-align:center;
	width:auto;
	margin-left:auto;
	margin-right:auto;
}

/*generic styles for links.  Used as a class so it can be applied to any links */
.ActiveLinks {
	text-decoration: none;
}

.ActiveLinks a:hover {
	text-decoration:underline;
	color:#F00;