/**********************************************************************************************
	Title: styles.css
	Author: U! Creative: Jerritte Couture
	Date: 2010
	Copyright: U! Creative
	URL: http://www.ucreate.us

***********************************************************************************************
	1. General
	2. Container
	3. Navigation
		3.1  Shared globalnav & topnav
		3.2  Globalnav
		3.3  Topnav
			3.3A  Sub-nav
			3.3B  Search form
	4. Middle
	5. Footer
	6. Botnav
		6.1  Teaser image insertion
	7. Slide (Carousel)
	8. Pages (specific page styles)
	9. jQuery
		9.1  jQuery: Qtip
		9.2  jQuery: Tabs
		
		


/**#@+ classes */
.clear {}
.clear.both { clear: both; }
.clear.left { clear: left; }
.clear.right { clear: right; }



.clpse,
.collapse {
	height: 0;
	overflow: hidden;
	font-size: 0;
	line-height: 0.0;
}





.outdent {
	line-height: 0.0;
	font-size: 0%;
	text-align: left;
	text-indent: -9999em;
}

.button {
	outline: none;
}


.bold {
	font-weight: bold;
}



/**#@-*/

/**#@+ elements */


a:hover {

	text-decoration: none;
}

a img {
	border: 0;
	padding: 2px;
}

a:hover img {
}



dt {
	margin-bottom: .50em;
}



ul.nav,
ul.nav ul,
ul.nav li,
dl.nav,
dl.nav dt,
dl.nav dd,
dl.nav ul,
dl.nav li {
    list-style: none;
    margin: 0;
    padding: 0;
}

ul.hori li {
    display: inline;
    list-style: none;
}

ul.nav a,
dl.nav a {
	outline: none;
}







dl.form {
	font-size: 100%;
	padding: 0px;
}

fieldset dl.form {
	margin: 0em;
}

dl.form dt,
dl.form dd {
	margin-top: 18px;
}

dl.form dt {
	float: left;
	clear: left;
	width: 14em;
	text-align: right;
	position: relative;
}

dl.form dt label,
dl.form dt label span {
	display: block;
}

dl.form dt label {
	line-height: 1.60;
}

dl.form dt label span {
	margin: 0 0 0 0;
}

dl.form dd {
	clear: right;
	position: relative;
	/*margin-left: 14.5em;*/
	padding-left: 0.5em
}



dl.form input,
dl.form select,
dl.form textarea {
	font-size: 95%;
	padding: .25em .50em;
}

dl.form input.action {
	border: 1px solid #535A68;
}


/**#@-*/
/**#@-*/
		
		
		
***********************************************************************************************/
/* 1. General styles
-----------------------------------------------------------------------------------------------*/	





	.button {
		color: #fff;
		text-align: center;
		cursor: pointer;
	}

	.button.indigo {
		background: #3B3E7A url(../images/header/indigo.gif) repeat-x 0 0;
	}

	.button.grey {
		background: #5B5B5B url(../images/header/grey.gif) repeat-x 0 0;
	}

	.button.grey:hover {
		background-color: #3B3E7A;
		background-image: url(../images/header/indigo.gif);
	}

	.button.greySmall { /* Search button */
		background: #5B5B5B url(../images/header/greySmall.gif) repeat-x 0 0;
		border: none;
	}

	.button.greySmallHover { /* Search button */
		background: #5B5B5B url(../images/header/greySmall.gif) repeat-x 0 -19px;
		border: none;
	}



/* 2. Container styles
-----------------------------------------------------------------------------------------------*/	



	#container div#header,
	


/* 3. Navigation
-----------------------------------------------------------------------------------------------*/


	/* 3.1 Shared globalnav & topnav
	-----------------------------------------------------------------------------------------------*/

		#header ul#globalnav,
		#header ul#topnav {
			position: relative;
			z-index: 1;
			width: 926px;
                        font-family: Calibri; 
		}

		#topnav li,
		#globalnav li {
			float: left;
			position: relative;
			z-index: 1;
		}

		#topnav li.clear,
		#globalnav li.clear {
			float: none;
			position: static;
			display: block;
		}



		/* 3.2 Globalnav
	-----------------------------------------------------------------------------------------------*/

		#globalnav {
			font-size: x-small;
		}

		#globalnav li:first-child {
			margin-left: 20px;
		}

		#globalnav a {
			display: block;
			float: left;
			padding: 18px 15px 18px 0;
			color: #8a8a8a;
			text-decoration: none;
                        font-size: 1.0em
                        

		}

		#globalnav a:hover {
			color: #676767;
		}

		#globalnav #btnTech,
		#globalnav #btnMarketing {
			margin: 12px 0 0 0;
		}

		/* Local nav "toggle" buttons/links */
		#globalnav #btnTech,
		#globalnav #btnTech img,
		#globalnav #btnMarketing,
		#globalnav #btnMarketing img {
			padding: 0;
			float: left;
		}



		/* 3.3 Topnav
	-----------------------------------------------------------------------------------------------*/

		#topnav {
			position: relative;
			max-height: 91px;
			background: #ffffff url(../images/header/topnav.gif) no-repeat 0 0;
                        padding-bottom: 0px;
		}

		#topnav h1 {
			margin: 0;
			padding: 0;
		}

		#topnav h2 a {
			width: 185px !important;
			height: 87px !important;
			padding: 0 !important;
			background: transparent url(../images/header/logo-crown-main.gif) no-repeat 0 0;
		}

		#topnav li {
			float: left;
			position: static;
		}

		#topnav a { /* main menu item styles */
			display: block;
			float: left;
			color: #fafafa;
			padding: 25px 15px 20px 15px;
			text-decoration: none;
			font-weight: bold;
                        font-size: 1.0em;
		}

		#topnav li#nav-item1 a { /* space "Products" menu item correctly */
			padding-left: 20px;
                   
		}

		#topnav a:hover,
		.menuHover { /* main menu hover style */
			background-color: #8aa83a;
                        color: #fafafa; 
		}

		#topnav h2 a:hover { /* ensures Crown logo does not get the hover effect above */
			background-color: transparent;
		}



		/* 3.3A Topnav: Sub-nav
		-----------------------------------------------------------------------------------------------*/

			#topnav li ul { /* hide sub-menus and style */
				float: left;
				clear: left;
				position: absolute;
				z-index: 10;
				top: 59px;
				left: -9999em;
				width: 230px;
				background: transparent url(../images/header/bg-subnav.png) repeat;
			}
			
			#topnav ul li.subnavbottom { 
			    background-image: url(../images/header/bottom-subnav.png);
			    background-repeat: no-repeat;
			    height: 14px;
			    width: 253px;
			    position: relative;
                            top:23px;
                            left:-10px;
			}
			

			#topnav li:hover ul,
			#topnav li.sfhover ul { /* positions the drop down right below the corresponding menu item */
				display: block;
				left: auto;
				float: left;
                                margin-left: -5px; 
			}

			#topnav ul {
				padding: 10px;
			}

			#topnav ul li {
				width: 100%;
				float: left;
				margin-left: 0;
			}
			
			#topnav ul li.bold {
				margin: 0;
				padding: 5px 5px !important;
				width: 100%;
				display: block;
				font-weight: bold;
				text-transform: uppercase;
                                color: #fafafa;
                                font-size: 1.0em;
			}
		

			#topnav ul li a {
				margin: 0;
				padding: 3px 10px !important;
				width: 100%;
				display: block;
				font-weight: normal;
                                color: #fafafa; 
			}
			
			#topnav ul li a.bold {
				margin: 0px;
				padding: 5px 5px !important;
				width: 100%;
				display: block;
				font-weight: bold;
				text-transform: uppercase;
                                color: #fafafa; 
			}
			
			#topnav ul li a.bottombold {
				margin-left: 10px;
                margin-top: -20px;
				padding: 5px 5px !important;
				width: 100%;
				display: block;
				font-weight: bold;
				text-transform: uppercase;
                color: #fafafa; 
			}			

			#topnav ul a:hover {
			        color: #303a85;
				background: none;
			}



		/* 3.3B Topnav: Search form
		-----------------------------------------------------------------------------------------------*/

			#topnav li#search-form {
				margin: 3px 15px 0 0;
				float: right;
				z-index: 0;
			}

			#topnav input {
				color: #818080;

			}

			#topnav input.button {
				color: #fff;

			}


			
                        #search {
				float: left;
		                background: #fff url(../images/header/input.gif) repeat-x 0 0;
		                border: 1px solid #E8E8E8;
                                width: 110px; 
			}

			#searchbutton {
				float: left;
		                border: 0px solid #E8E8E8;
                        }


			#search-form input.action {}

			#search-form dt {
				display: none;
			}