/* .css - Alpine ACF */

/*----------------------------------------------------------------------------------
 * DEBUGGING SECTION
 *----------------------------------------------------------------------------------
 */

/* DEBUG INFORMATION
   "#wrapper input" makes things red and ugly. This is to search for things that needs to be added/removed in this css.
   If you find that some button/input turns red, pleace see what needs to be changed in your code or in this css.
   When using the html.form[]() to create inputs/buttons/fields then everything should work just fine.
   When manually wringing a <input... or something like that, see if you need to add class='whatever' or something like it.
*/

#content input { /* DEBUG: Search for uncategorized buttons/inputs */
	background:	red;
}
.leader {
	border:		0px solid yellow;
}

.tailer {
	border:		0px solid magenta;
}

/*----------------------------------------------------------------------------------
 * GENERAL
 *----------------------------------------------------------------------------------
 */

.hide {
	display:			none;
}

a {
	text-decoration:		none;
	color:			#072966;
}
a:visited {
	color:			#072966;
}
a:hover {
	color:			red;
}
input {
	border:			1px solid #ccc;
}
hr {
	background-color:		#ff9933;
	height: 			3px;
}
.error {
/*	height:			0px; */
	font-size: 		11pt;
	font-weight: 		bold;
	color: 			#f33;
	margin: 			0;
	padding: 			0;
}
.mute {
	color: 			#777;
}

/*----------------------------------------------------------------------------------
 * BODY & PAGE
 *----------------------------------------------------------------------------------
 */
body {
	margin: 			0px 0px 0px 0px;
	padding: 			0px 0px 0px 0px;
	font-family: 		Helvetica, Geneva, Arial, SunSans-Regular, sans-serif, Verdana, "Trebuchet MS", SunSans-Regular;
	font-size:		12pt;
	background-image: 		url("/static/watermark.jpg");
	background-repeat: 		no-repeat;
	background-position:	400px 140px;
}
#page { 
	position:			relative;
	left:			0px;
	top:			0px;
	margin:			10px 5% 0% 5%;
}

/*----------------------------------------------------------------------------------
 * PAGE > HEADER
 *----------------------------------------------------------------------------------
 */
#header {
	width: 			100%;
	height: 			75px;
	margin: 			0px 0px 0px 0px;
	padding: 			0px 0px 0px 0px;

	background-image: 		url("/static/alpine.jpg");
	background-repeat: 		repeat-x;
	border: 			1px solid #ddd;
	padding: 			0px 0px 0px 0px;
	margin: 			0px 0px 0px 0px;
}
#header p {
	position:			absolute;
	top:			10px;
	right:			10px;
	font-size:		14px;
	padding: 			0px 0px 0px 0px;
	margin: 			0px 0px 0px 0px;
}
#header .tailer {
	position:			absolute;
	background-image: 		url(shadow-top.png);
	background-repeat: 		repeat-x;
	top:			76px;
	height:			10px;
	width:			100%;
	margin: 			0px 0px 0px 0px;
	padding: 			0px 0px 0px 0px;
}
/*----------------------------------------------------------------------------------
 * PAGE > HEADER > LOGO
 *----------------------------------------------------------------------------------
 */
#logo h1 {
	font-size:		40px;
	padding: 			0px 0px 0px 10px;
	margin: 			0px 0px 0px 0px; 
}
#logo p {
	position:			absolute;
	top:			60px;
	left:			10px;
	font-size:		14px;
	padding: 			0px 0px 0px 0px;
	margin: 			0px 0px 0px 0px; 
}

/*----------------------------------------------------------------------------------
 * PAGE > MAIN
 *----------------------------------------------------------------------------------
 */
#main {
	left: 			0px;
	top: 			0px;
	width: 			100%;
	padding: 			0px 0px 0px 0px;
	margin: 			17px 0px 0px 0px; 
/*	background:	green; */
}

/*----------------------------------------------------------------------------------
 * PAGE > MAIN > NAV
 *----------------------------------------------------------------------------------
 */
#nav {
	width: 			180px;
	margin: 			0px 0px 0px 9px;
	background:		white;
	/*background:	blue;	*/

	padding: 			0px 10px 0px 0px;
	background-image: 		url(shadow-side.png);
	background-repeat: 		repeat-y;
	background-position: 	right;
}
#nav ul {
	list-style-type: 		none;
	padding: 			0px 0px 0px 0px;
	margin: 			0px 0px 0px 0px;
}
#nav ul li {
	color: 			white;
	font-size: 		16px;
	font-weight: 		bold;
	white-space: 		nowrap;
	overflow: 		hidden;
	background:		#6688AA;
	padding: 			1px 0px 0px 4px;
	margin: 			0px 0px 0px 0px;
	border-top: 		1px solid #7799BB;
}
#nav ul li ul {
	padding: 			2px 0px 0px 0px;
	margin: 			0px 0px 0px -4px;
}
#nav ul li ul li {
	font-weight: 		normal;
	font-size:		10pt;
	height: 			21px;
	white-space: 		nowrap;
	overflow: 		hidden;
	border-bottom: 		1px solid #cacaca;
	border-top: 		1px solid #ccc;
	border-left: 		1px solid #ddd;
	background-image: 		url(menu_item.png);
	padding:			0px 0px 0px 0px;
	margin:			0px 0px 0px 0px;
}
#nav ul li ul li.selected {
	background: 		#dff;
	font-weight:		bold;
}
#nav ul li ul li a {
	display: 			block;
	height:			19px;
	padding:			2px 0px 0px 5px;
}
#nav ul li ul li a:hover {
	background-image: 		url(menu_item_hover.png);
}
#nav ul li ul li.selected a:hover {
	background-image: 		none;
}

/*----------------------------------------------------------------------------------
 * PAGE > MAIN > POSTNAV
 *----------------------------------------------------------------------------------
 */
#postnav h2 {
	position: 		absolute;
	top:			95px;
	left:			200px;
	right:			9px; 
	color: 			white;
	font-size: 		16px;
	font-weight: 		bold;
	white-space: 		nowrap;
	overflow: 		hidden;
	background:		#6688AA;
	padding: 			2px 0px 2px 5px;
	margin: 			0px 0px 0px 0px;
}
#postnav p {
	position: 		absolute;
	top:			80px;
	left:			0px;
	width:			100%;
	color: 			#999;
	font-size: 		11px;
	font-weight:		verdana, arial;
	font-weight: 		bold;
	white-space: 		nowrap;
	overflow: 		hidden;
	background:		transparent;
	padding: 			0px 5px 0px 10px;
	margin: 			0px 0px 0px 0px;
/*	background:	blue;	*/
}

/*----------------------------------------------------------------------------------
 * PAGE > MAIN > SUBNAV
 *----------------------------------------------------------------------------------
 */
#subnav {
	position:			absolute;
	top:			56px;
	height:			40px;
	left:			200px;
	padding: 			0px 0px 0px 0px;
	margin: 			0px 0px 0px 0px;
/*	background:	blue; */
}
#subnav a {
	height:			40px;
	margin: 			0px 0px 5px 0px;
	padding: 			3px 5px 2px 5px;
	font-size:		12px;
	background-image: 		url(menu_item.png);
	border: 			1px solid #bbb;
	border-bottom: 		none;
}

#subnav a.selected {
	background:		#dff;
}

/*----------------------------------------------------------------------------------
 * PAGE > MAIN > CONTENT
 *----------------------------------------------------------------------------------
 */
#content {
	display:			block;
	position: 		absolute;
	top: 			117px;
	left:			200px;
	right:			0px;

	background-image: 		url(shadow-side.png);
	background-repeat: 		repeat-y;
	background-position: 	right;
	font-size:		12px;
	border-left:		1px solid #cacaca;
	margin: 			0px 0px 0px 0px;
	padding: 			0px 10px 0px 5px;
}
#content h1 { 
	display:			block;
	clear: 			both;
	height: 			18px;
	padding: 			2px 0px 0px 5px;
	margin: 			0px 0px 2px -5px;
	text-decoration:		none;
	font-size: 		14px;
	font-weight: 		bold;
	white-space: 		nowrap;
	overflow: 		hidden;
	border-bottom: 		1px solid #cacaca;
	border-top: 		1px solid #ccc;
	background-image: 		url(h1.png);
	color: 			#5c7b99;
}

#content h2 { 
	display:			block;
	clear: 			both;
	height: 			18px;
	padding: 			2px 0px 0px 10px;
	margin:			0px 0px 2px -5px;
	text-decoration:		none;
	font-size:		14px;
	font-weight:		bold;
	white-space:		nowrap;
	overflow:			hidden;
	border-bottom:		1px solid #cacaca;
	border-top:		1px solid #ccc;
	background-image:		url(h2.png);
	color:			#5c7b99;
}
#content h3 { 
	display:			block;
	clear: 			both;
	height:			14px;
	padding:			0px 0px 0px 15px;
	margin:			0px 0px 2px -5px;
	text-decoration:		none;
	font-size:		12px;
	font-weight:		thin;
	white-space:		nowrap;
	overflow:			hidden;
	border-bottom:		1px solid #cacaca;
	border-top:		1px solid #ccc;
	background-image:		url(h3.png);
	color:			#5c7b99;
}

#content p {
	clear:			both;
	display:		block;
}
#content p.error {
	clear:			both;
	display:		block;
}

#content dt {
	float: 			left;
	clear: 			left;
	width: 			30%;
	color: 			#000;
	font-size: 		12px;
	text-align:		left;
	margin:			0px 5px 0px 0px;
	padding:			5px 0px 5px 0px;
	border-top:		1px solid #ddd;
	font-weight:		bold;
/*	background:	blue;	*/

}

#content dd {
	display: 		block;
	float: 			left;
	width: 			68%;
	color: 			#444;
	font-size: 		12px;
	margin:			0px 5px 0px 0px;
	padding:			5px 0px 5px 0px;
	font-weight:		 light;
/*	background:	green; */
}
#content dd p {
	display: 		inline;
	margin-left:	10px;
	font-style:	italic;
/*	background:	green;  */
}


#content dd.error {
	color: 			red;
}

#content textarea {
	width: 			99%;
	height: 			300px;
	border-right: 		1px solid #cacaca;
	border-bottom: 		1px solid #cacaca;
}
#content input.text {
/*	background: 	cyan; */
}

#content form {
	display:			inline;
}

#content dd select {
	width:			100%;
	border-right:		1px solid #cacaca;
	border-bottom:		1px solid #cacaca;
}

#content .submit {
	width: 			100px;
	border-right:		1px solid #cacaca;
	border-bottom:		1px solid #cacaca;
	background:		#eee;
}
#content .text {
	width: 			100%;
	border-right:		1px solid #cacaca;
	border-bottom:		1px solid #cacaca;
	background:		white;
}
#content table {
	width: 			99%;
}
#content .tailer {
	clear: 			both;
	border-bottom:		3px solid #cacaca;
	margin-left: 		-5px;
}

/*----------------------------------------------------------------------------------
 * PAGE > FOOTER
 *----------------------------------------------------------------------------------
 */
#footer {
	position:			relative;
	clear: 			left;
	border-top:		1px solid #d6d6d6;
	width: 			180px;
	padding:			5px 0px 5px 0px;
	margin:			15px 0px 0px 10px;
	font-size:		10px;
	text-align:		center; 
	color: 			#aaa;
}