/**
 * SPRITESHEET DEFINITIONS
 * Assign spritesheet.png backgrounds in bulk.
 * Background-positions should be assigned per ID
 **/
#ucfhb-mobile-toggle,
#ucfhb-logo a,
#ucfhb-signon-logo .ucfhb-hidden,
#ucfhb-services > div > .ucfhb-service,
#ucfhb-search form #ucfhb-search-submit,
#ucfhb-search-minimal {
	background-image: url('../img/spritesheet.png');
	background-repeat: no-repeat;
}
@media 
 	(-webkit-min-device-pixel-ratio: 2), 
 	(min-resolution: 192dpi) { 
 		#ucfhb-mobile-toggle,
 		#ucfhb-logo a,
 		#ucfhb-signon-logo .ucfhb-hidden,
 		#ucfhb-services > div > .ucfhb-service,
 		#ucfhb-search form #ucfhb-search-submit,
 		#ucfhb-search-minimal {
 			background-image: url('../img/spritesheet-r.png');
 			background-size: 350px 160px;
 		}
}


/**
 * FULL-WIDTH STYLING
 **

/* Main wrapper */
#ucfhb { height: 50px; width: 100%; margin: auto; background: #000; position: relative; z-index: 10000; }
/* Foundation CSS Framework overrides */
#ucfhb,
#ucfhb:before,
#ucfhb:after,
#ucfhb *,
#ucfhb *:before,
#ucfhb *:after {
	box-sizing: content-box !important;
	-moz-box-sizing: content-box !important;
	-webkit-box-sizing: content-box !important;
}
/* Common miscellaneous overrides */
#ucfhb a { border: 0; }

/* Inner wrap (fixed 940px width) */
/* display: block is added to override display:none inline styles, which prevent 
 * plaintext content flicker if the header css hasn't appended before the bar content. */
#ucfhb-inner { display: block !important; width: 940px; margin: auto; height: 50px; position: relative; z-index: 1000; }

/* The left-hand portion of the header */
#ucfhb-left { float: left; padding-top: 11px; width: 320px; }
#ucfhb-mobile-toggle { 
	display: none;
	width: 30px;
	height: 30px;
	text-indent: -9999px;
	position: absolute;
	right: 2px;
	background-position: -166px -136px;
}
#ucfhb-mobile-toggle.ucfhb-mobileslide { background-position: -198px -136px; }
#ucfhb-mobile-toggle:focus { outline: 0; }
#ucfhb-logo { float: left; padding-top: 2px; }
#ucfhb-logo a {
	width: 284px;
	height: 24px;
	max-width: 284px;
	display: block;
	text-indent: -9999px;
	background-position: -2px -9px;
}

/* The right-hand portion of the header */
#ucfhb-right { float: right; position: relative; width: 600px; height: 50px; overflow: hidden; }

/* MyUCF: button */
#ucfhb-signon { 
	float: left; 
	position: absolute;
	top: 0;
	right: 50px;
	width: 360px;
	height: 50px;
}

#ucfhb-signon-logo { 
	display: block; 
	font-size: 14px; 
	color: #ffc904; 
	text-decoration: none; 
	width: 85px; 
	height: 50px; 
	position: absolute;
	right: 195px;
	top: 0;
	transition: right 0.4s ease-in-out; /* 'move' left */
	-webkit-transition: right 0.4s ease-in-out;
	-ms-transition: right 0.4s ease-in-out;
	z-index: 2;
}
#ucfhb-signon-logo:hover,
#ucfhb-signon-logo:focus,
#ucfhb-signon-logo:active,
#ucfhb-signon-logo.ucfhb-shiftleft { color: #fff !important; }
#ucfhb-signon-logo.ucfhb-shiftleft {
	right: 215px;
}
#ucfhb-signon-logo .ucfhb-hidden {
	float: left;
	margin-top: 14px;
	width: 60px;
	height: 23px;
	text-indent: -9999px;
	background-position: -120px -106px;
}
#ucfhb-signon-logo:hover .ucfhb-hidden,
#ucfhb-signon-logo.ucfhb-shiftleft .ucfhb-hidden {
	background-position: -180px -106px;
}
.ucfhb-icon { font-family: 'Helvetica-Neue', sans-serif; line-height: 14px; }
#ucfhb-signon-logo .ucfhb-icon { padding: 19px 0 0 8px; display: block; float: left; }
#ucfhb-signon-logo #ucfhb-icon-close { display: none; }
#ucfhb-signon-logo.ucfhb-shiftleft #ucfhb-icon-open { display: none; }
#ucfhb-signon-logo.ucfhb-shiftleft #ucfhb-icon-close { display: block; }

/* MyUCF: login form */
#ucfhb-services { position: absolute; top: 0; right: 5px; width: 340px; height: 50px; z-index: 1; overflow: hidden; }
#ucfhb-services > div {
	display: block;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: all 0s linear 0s; /* Force immediate hide of children */
	-ms-transition: all 0s linear 0s;
	transition: all 0s linear 0s;
	height: 0;
	width: 0;
	position: absolute;
	top: 3px;
	right: 0;
}
.ucfhb-shiftleft + #ucfhb-services > div { 
	opacity: 1;
	visibility: visible;
	height: auto;
	width: 210px;
	-webkit-transition: opacity 0.2s ease-in 0.4s; /* Show the form field after the button has 'moved' left */
	-ms-transition: opacity 0.2s ease-in 0.4s;
	transition: opacity 0.2s ease-in 0.4s;
}
#ucfhb-services > div > .ucfhb-service {
	display: block;
	float: left;
	text-indent: -9999px;
	margin: 5px 6px 0 6px;
	width: 55px;
	height: 34px;
	padding: 0;
}
#ucfhb-services > div > #ucfhb-myucf { background-position: -177px -35px; }
#ucfhb-services > div > #ucfhb-knightsmail { background-position: -232px -35px; }
#ucfhb-services > div > #ucfhb-webcourses { background-position: -292px -35px; }
#ucfhb-services > div > #ucfhb-myucf:hover { background-position: -177px -69px; }
#ucfhb-services > div > #ucfhb-knightsmail:hover { background-position: -232px -69px; }
#ucfhb-services > div > #ucfhb-webcourses:hover { background-position: -292px -69px; }

@media 
 	(-webkit-min-device-pixel-ratio: 2), 
 	(min-resolution: 192dpi) { 
 		#ucfhb-services > div > #ucfhb-myucf:hover { background-position: -177px -70px; }
 		#ucfhb-services > div > #ucfhb-knightsmail:hover { background-position: -232px -70px; }
 		#ucfhb-services > div > #ucfhb-webcourses:hover { background-position: -292px -70px; }
}


/* Search */
#ucfhb-search { 
	position: absolute;
	top: 0;
	right: 4px;
	margin-top: 9px; 
	padding-left: 10px; 
	border-left: 1px solid #454545;
	z-index: 2;
	width: 220px;
	height: 32px;
	transition: width 0.4s ease-in-out; /* shrink to the right */
	-webkit-transition: width 0.4s ease-in-out;
	-ms-transition: width 0.4s ease-in-out;
}
#ucfhb-search form { 
	width: 220px;
	height: 29px;
	margin-bottom: 0;
	position: relative;
	text-align: left;
}
#ucfhb-search form label {
	display: block;
	position: absolute;
	width: 1px;
	height: 1px;
	text-indent: -9999px;
	margin: 0;
	padding: 0;
	line-height: 0 !important;
	font-size: 0;
}
#ucfhb-search-field { 
	width: 160px !important; 
	height: 25px !important; 
	border-radius: 30px; 
	border: 0;
	margin: 0;
	padding: 2px 45px 2px 15px;
	position: absolute;
	top: 2px;
	left: 0;
	font-family: 'Helvetica-Neue', sans-serif;
	font-size: 13px;
	font-style: normal;
	font-weight: normal;
	color: #000;
	letter-spacing: 0.1px;
	background-size: 20px 19px;
	-webkit-appearance: none;
	box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, 0.25), 0 0 0 0 transparent;
	transition: all 0.2s ease-in-out; /* glow effect */
	-webkit-transition: all 0.2s ease-in-out;
	-ms-transition: all 0.2s ease-in-out;
}
#ucfhb-search-field:focus {
	outline: none;
	box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, 0.25), 0px 0px 5px 2px rgba(253, 240, 183, 0.6);
}
/* Can't comma-separate these... */
#ucfhb-search-field::-webkit-input-placeholder {
   font-family: 'Helvetica-Neue', sans-serif;
   font-size: 13px;
   font-style: normal;
   font-weight: normal;
   color: #666;
}
#ucfhb-search-field:-moz-placeholder { /* Firefox 18- */
   font-family: 'Helvetica-Neue', sans-serif;
   font-size: 13px;
   font-style: normal;
   font-weight: normal;
   color: #555; 
}
#ucfhb-search-field::-moz-placeholder {  /* Firefox 19+ */
   font-family: 'Helvetica-Neue', sans-serif;
   font-size: 13px;
   font-style: normal;
   font-weight: normal;
   color: #555;
}
#ucfhb-search-field:-ms-input-placeholder {  
   font-family: 'Helvetica-Neue', sans-serif;
   font-size: 13px;
   font-style: normal;
   font-weight: normal;
   color: #555;
}

#ucfhb-search form #ucfhb-search-submit {
	position: absolute;
	right: 0;
	top: 2px;
	height: 29px;
	width: 28px;
	*width: 40px;
	padding: 0 6px;
	margin: 0;
	border-radius: 0 30px 30px 0;
	border: 0;
	text-indent: -9999px;
	display: block;
	background-color: #ffc904;
	background-position: 10px -136px;
}

#ucfhb-search-autocomplete-srhelp {
	display: block;
	text-indent: -9999px;
	position: absolute;
	width: 1px;
	height: 1px;
	margin: 0;
	padding: 0;
}

#ucfhb-search.ucfhb-shiftleft {
	width: 32px;
	overflow: hidden;
}

#ucfhb-search.ucfhb-shiftleft form { 
	display: block;
	width: 0;
	opacity: 0;
	height: 0;
	overflow: hidden;
	transition: width 0.4s ease-in-out; /* grow back to the left */
	-webkit-transition: width 0.4s ease-in-out;
	-ms-transition: width 0.4s ease-in-out;
}

#ucfhb-search-minimal {
	display: none;
	width: 20px;
	height: 25px;
	padding: 3px 6px;
	border-radius: 5px; 
	position: absolute;
	top: 0;
	-webkit-transition: all 0.2s ease-in 0.4s; /* Show the search button after myucf has 'moved' left */
	-ms-transition: all 0.2s ease-in 0.4s;
	transition: all 0.2s ease-in 0.4s;
	background-color: #ffc904;
	background-position: 7px -136px;
	text-indent: -9999px;
}
#ucfhb-search form #ucfhb-search-submit:hover,
#ucfhb-search-minimal:hover { background-color: #ffeba4; }
#ucfhb-search-minimal.ucfhb-shiftleft { 
	display: block;
	-webkit-transition: all 0s linear 0s; /* Force immediate hide when myUCF is shifted back right */
	-ms-transition: all 0s linear 0s;
	transition: all 0s linear 0s;
}


#ucfhb-search-autocomplete { 
	display: none;
	list-style-type: none;
	margin: 0;
	position: absolute;
	right: 4px;
	top: 44px;
	width: 218px;
	z-index: 10001;
	border-radius: 4px;
	border: 1px solid #ddd;
	padding: 0;
	min-height: 30px;
	background: #fff url('../img/ajax-loader.gif') center center no-repeat;
}
#ucfhb-search-autocomplete:before { /* Up Carat */
	position: relative;
	top: -10px;
	display: block;
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 0 10px 10px 10px;
	border-color: transparent transparent #ddd transparent;
	margin: auto;
}
#ucfhb-search-autocomplete.ucfhb-shiftleft { display: none; }
#ucfhb-search-autocomplete.search-is-active { display: block; }
#ucfhb-search-autocomplete li {
	display: block;
	padding: 0;
	margin: 0;
	border-top: 1px solid #ddd;
	background: #fff;
}
#ucfhb-search-autocomplete li:first-child { border-top: 0; margin-top: -10px; *margin-top: 0; }
#ucfhb-search-autocomplete li.ucfhb-search-autocomplete-more {
	text-align: right;
}
#ucfhb-search-autocomplete li.ucfhb-search-autocomplete-more a { font-size: 11px; padding-right: 5px; }
#ucfhb-search-autocomplete li a {
	font-family: Helvetica, sans-serif; 
	font-size: 14px; 
	line-height: 20px; 
	color: #0088CC;
	text-decoration: none;
	display: block;
	padding: 4px 35px 4px 8px;
}
#ucfhb-search-autocomplete li a:hover,
#ucfhb-search-autocomplete li a:focus,
#ucfhb-autocomplete-selected a {
	background: #efefef;
}
#ucfhb-search-autocomplete li a:hover { text-decoration: underline; color: #005580; }
#ucfhb-search-autocomplete li a.ucfhb-search-autocomplete-url { 
	font-size: 11px; 
	text-align: left; 
	line-height: 16px; 
	font-family: Helvetica, sans-serif; 
	color: #008000;
	text-decoration: none;
	width: 100%;
	display: block;
}
#ucfhb-search-autocomplete li a.ucfhb-search-autocomplete-url:hover { text-decoration: underline; }


#ucfhb-search-autocomplete li span { text-align: left; display: block; }
#ucfhb-search-autocomplete li span.ucfhb-search-autocomplete-name {
	font-family: Helvetica, sans-serif;
	font-size: 13px;
	line-height: 17px;
	font-weight: bold;
	margin-bottom: 0;
}
#ucfhb-search-autocomplete li span.ucfhb-search-autocomplete-org {
	font-family: Helvetica, sans-serif;
	font-size: 11px;
	line-height: 15px;
	margin-bottom: 0;
	color: #666;
}
#ucfhb-search-autocomplete li span.ucfhb-search-autocomplete-phone {
	font-family: Helvetica, sans-serif;
	font-size: 11px;
	line-height: 15px;
	margin-bottom: 0;
	margin-top: 2px;
}

#ucfhb-search-autocomplete-close {
	display: none;
	width: 30px;
	height: 30px;
	position: absolute;
	right: 4px;
	bottom: -24px;
	border-radius: 0 0 0 10px;
	margin: 0;
	padding: 0;
	text-align: center;
	background: #ddd;
	font-size: 20px;
	line-height: 24px;
	font-weight: bold;
	color: #333;
	z-index: 10002;
	text-decoration: none;
}
#ucfhb-search-autocomplete-close:hover { text-decoration: none; }
#ucfhb-search-autocomplete.search-is-active + #ucfhb-search-autocomplete-close { display: block; }


/**
 * RESPONSIVE STYLING
 * Designed to match Bootstrap 2.x breakpoints
 **/

/* Tablet size (768-979px) */ 
@media (max-width: 979px) {
	#ucfhb-inner { width: 768px; }
	#ucfhb-logo { padding-left: 10px; }
	#ucfhb-right { width: 448px; }
	#ucfhb-services { width: 335px; right: 10px; }
	#ucfhb-search { right: 9px; }
	#ucfhb-search-field { width: 155px !important; }
	#ucfhb-search-autocomplete { right: 10px; }
	#ucfhb-search-autocomplete-close { right: 10px; }
}

/* Small tablet size (>=767px) */ 
@media (max-width: 767px) {
	#ucfhb {
		height: 100px;
		margin-top: -50px;
		transition: margin 0.4s ease-in-out; /* expand down */
		-webkit-transition: margin 0.4s ease-in-out;
		-ms-transition: margin 0.4s ease-in-out;
	}
	/* Prevent transition animations onload until .preload class is removed. */
	#ucfhb.preload {
		transition: none !important;
		-webkit-transition: none !important;
		-ms-transition: none !important;
	}
	#ucfhb.ucfhb-mobileslide {
		margin-top: 0;
	}
	#ucfhb-inner { 
		width: 100%;
		height: 50px;
	}
	#ucfhb-logo { padding-left: 3px; }
	#ucfhb-left { width: 100%; height: 39px; position: absolute; top: 50px; float: none; } /* height accounts for padding-top */
	#ucfhb-mobile-toggle { display: block; }

	/* Shift the right-hand portion to the top of ucfhb-inner */
	#ucfhb-right {
		position: absolute;
		width: 100%;
		visibility: visible;
		height: 49px; /* Accomodate for border-bottom */
		border-bottom: 1px solid #454545;
		top: 0;
		float: none;
	}
	#ucfhb-signon,
	#ucfhb-search {
		width: 50%;
		position: static;
		float: left;
		padding: 0;
		margin: 3px 0 0 0;
		right: 0;
		left: 0;
		border: 0;
	}
	#ucfhb-signon { height: auto; overflow: auto; }
	#ucfhb-signon-logo { display: none; }
	#ucfhb-services {
		position: static;
		padding: 0;
		width: auto;
		height: auto;
		text-align: center;
	}
	#ucfhb-services > div {
		position: static;
		height: auto;
		width: 210px;
		margin: auto;
		visibility: visible;
		opacity: 1;
		left: auto;
		right: auto;
		overflow: auto;
	}
	#ucfhb-services > div > a { line-height: 30px; margin: 0; }
	#ucfhb-search { height: 38px; margin-top: 4px; }
	#ucfhb-search form { padding: 0 10px; margin: auto; height: 38px; }
	#ucfhb-search-field { font-size: 16px; padding-top: 4px; padding-bottom: 8px; }
	/* Can't comma-separate these... */
	#ucfhb-search-field::-webkit-input-placeholder {
	   font-size: 16px;
	}
	#ucfhb-search-field:-moz-placeholder { /* Firefox 18- */
	   font-size: 16px; 
	}
	#ucfhb-search-field::-moz-placeholder {  /* Firefox 19+ */
	   font-size: 16px;
	}
	#ucfhb-search-field:-ms-input-placeholder {  
	   font-size: 16px;
	}
	#ucfhb-search form #ucfhb-search-submit {
		height: 37px;
		right: 14px;
		background-position: 10px -132px;
	}

	#ucfhb-search-autocomplete {
		width: 50%;
		right: 0;
		top: 46px;
	}
	#ucfhb-search-autocomplete-close { height: 30px; right: 0; bottom: -26px; }

	/* Fixes for screen resizing */
	.ucfhb-shiftleft + #ucfhb-services > div { margin: auto; }
	#ucfhb-search.ucfhb-shiftleft { overflow: visible; width: 50%; }
	#ucfhb-search.ucfhb-shiftleft form {
		overflow: visible;
		opacity: 1;
		width: 220px !important;
		float: none;
		left: auto;
		right: auto;
	}
	#ucfhb-search-minimal.ucfhb-shiftleft { display: none; }
	#ucfhb-search-autocomplete.search-is-active,
	#ucfhb-search-autocomplete.search-is-active + #ucfhb-search-autocomplete-close {
		display: none;
	}
	#ucfhb.ucfhb-mobileslide #ucfhb-search-autocomplete.search-is-active,
	#ucfhb.ucfhb-mobileslide #ucfhb-search-autocomplete.search-is-active + #ucfhb-search-autocomplete-close {
		display: block; /* Don't let results stack on top of the bar when resized down */
	}
}

/* Phone size (>=480px) */
@media (max-width: 480px) {
	#ucfhb {
		height: 150px;
		margin-top: -100px;
	}
	#ucfhb-inner { height: 100px; }
	#ucfhb-left { top: 100px; } /* height accounts for padding-top */
	#ucfhb-logo a img { width: 234px; height: 13px; max-width: 234px; }
	#ucfhb-right { height: 99px; } /* Accounts for border-bottom */
	#ucfhb-signon,
	#ucfhb-search {
		width: 100% !important;
	}
	#ucfhb-search { margin-top: 10px; }

	#ucfhb-search-autocomplete { width: 100%; right: 0; top: 93px; }
	#ucfhb-search-autocomplete-close { bottom: -23px; }
}


/**
 * GOLD BAR: FULL-WIDTH OVERRIDES
 * These styles are for use ONLY on UCF.edu.
 **/
#ucfhb.ucfhb-gold { background: #ffc904; }
.ucfhb-gold #ucfhb-mobile-toggle { background-position: -102px -136px; }
.ucfhb-gold #ucfhb-mobile-toggle.ucfhb-mobileslide { background-position: -133px -136px; }
.ucfhb-gold #ucfhb-logo { padding-top: 9px; }
.ucfhb-gold #ucfhb-logo a {
	width: 254px;
	height: 14px;
	max-width: 254px;
	background-position: 0 3px;
}

.ucfhb-gold #ucfhb-signon-logo { color: #aa8912; }
.ucfhb-gold #ucfhb-signon-logo:hover,
.ucfhb-gold #ucfhb-signon-logo.ucfhb-shiftleft { color: #fff; }
.ucfhb-gold #ucfhb-signon-logo .ucfhb-hidden { background-position: 0 -106px; }
.ucfhb-gold #ucfhb-signon-logo:hover .ucfhb-hidden,
.ucfhb-gold #ucfhb-signon-logo.ucfhb-shiftleft .ucfhb-hidden {
	background-position: -60px -106px;
}
.ucfhb-gold #ucfhb-services > div > #ucfhb-myucf { background-position: 3px -35px; }
.ucfhb-gold #ucfhb-services > div > #ucfhb-knightsmail { background-position: -52px -35px; }
.ucfhb-gold #ucfhb-services > div > #ucfhb-webcourses { background-position: -112px -35px; }
.ucfhb-gold #ucfhb-services > div > #ucfhb-myucf:hover { background-position: 3px -69px; }
.ucfhb-gold #ucfhb-services > div > #ucfhb-knightsmail:hover { background-position: -52px -69px; }
.ucfhb-gold #ucfhb-services > div > #ucfhb-webcourses:hover { background-position: -112px -69px; }

.ucfhb-gold #ucfhb-search { border-left: 1px solid #caa31b; }
.ucfhb-gold #ucfhb-search form #ucfhb-search-submit {
	background-color: #DBAC04;
	background-position: 10px -136px;
}
.ucfhb-gold #ucfhb-search-minimal {
	background-color: #DBAC04;
	background-position: 7px -136px;
}
.ucfhb-gold #ucfhb-search form #ucfhb-search-submit:hover,
.ucfhb-gold #ucfhb-search-minimal:hover { background-color: #ffeba4; }



/**
 * GOLD BAR: RESPONSIVE OVERRIDES
 **/
@media (max-width: 767px) {
	.ucfhb-gold #ucfhb-logo { padding-left: 17px; }
 	.ucfhb-gold #ucfhb-right { border-bottom: 1px solid #E5BA1D; }
 	.ucfhb-gold #ucfhb-search { border-left: 0; }
 	.ucfhb-gold #ucfhb-search form #ucfhb-search-submit { background-position: 10px -132px; }
}