/* A style sheet by Oliver loosely modeled on Drupal's Danland */

#body_background
{
	/* the body comprises the entirety of the browser window */
	/* this style sets a gradient in the background */
	/* online gradient generator: http://gradients.glrzad.com/ */
	
	/* linear gradient from grey on top to white on bottom */
	background: #fff; /* old browsers */
	background-image: linear-gradient(bottom, rgb(255,255,255) 56%, rgb(219,219,219) 91%); /* W3C */
	background-image: -o-linear-gradient(bottom, rgb(255,255,255) 56%, rgb(219,219,219) 91%); /* Opera 11.10+ */
	background-image: -moz-linear-gradient(bottom, rgb(255,255,255) 56%, rgb(219,219,219) 91%); /* FF3.6+ */
	background-image: -webkit-linear-gradient(bottom, rgb(255,255,255) 56%, rgb(219,219,219) 91%); /* Chrome10+, Safari5.1+ */
	background-image: -ms-linear-gradient(bottom, rgb(255,255,255) 56%, rgb(219,219,219) 91%); /* IE10+ */
	background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0.56, rgb(255,255,255)), color-stop(0.91, rgb(219,219,219))); /* Chrome, Safari4+ */
	/* this is the default font */
	font-size: 84%;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #000;
	margin: 0;
	padding: 0;
	line-height: 1.4em;
}

#container_outer
{
	/* an overarching container for all content */
	
	/* margin defines the space OUTSIDE the border of the elt */
	margin-top:4px;
	margin-bottom:50px;
	/* setting the left and right margin to auto will automatically center the elt */
	margin-right: auto;
	margin-left: auto; 
	
	width: 970px;
	/* if you comment out the height, height will not be fixed & accomodate however many elts you have */
	/*
	height: 1000px;   
	*/
		
	/* the rgba, as opposed to rgb, includes alpha for opacity */
	/*
	background-color:rgba(230,230,230,1.0);
	*/
}

#title_bar
{

	/* container for the title */

/* 	margin-top:0.5%;
	margin-right:0.5%;
	margin-left:0.5%; 
	width: 100 %; 
	border-style:solid;
	border-width:1px;
	border-color:black;	*/
	
	/* border: black solid 1px; */
	
 	margin-top:4px;
 	margin-bottom:4px;
	margin-right:4px;
	margin-left:4px; 
	width: 962px;
	/* height: 65px; */
	
	position: relative; 
	
	/*
	background-color:rgba(255,255,255,1.0);
	*/
}

#title_logo1
{

	/* logo */
	
 	margin: 4px 0px 0px 0px;
	
	width: 90px;
	height: 90px;
	background-image:url('../images/ColumbiaCrown4.png'); 
	
	float:left;
	
	position: relative;
	top: -8px;
	left: 0px;
	
	/*border: 1px solid red;*/
	
	background-repeat:no-repeat;	 
	
	/*
	background-color:rgba(255,255,255,1.0);
	*/
}



#navigation
{
	/* navigation bar */
	
 	margin-top: 0; /* element above already has a bottom margin this will see */
 	margin-bottom:6px;
	margin-right:4px;
	margin-left:4px; 
	width: 962px; 
	height: 35px;

    /* add shadow */
    -webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
    -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
    box-shadow: 0px 1px 5px 0px #4a4a4a;		
}

#navigation ul
{
	list-style-type:none;
	margin:0;
	padding:0;	
}

#navigation li
{
	text-transform: uppercase;
	/* "By default, <li> elements are block elements. Removing the line breaks before and after each list item displays them on one line" */
	display: block;
	float: left;
	/* 
	border-right: 1px solid #fff; 
	border-right: 1px solid rgba(28,119,199,1.0);
	border-right: 2px solid rgba(8,88,158,1.0); 
	*/
	border-right: 1px solid rgba(28,119,199,0.6);
	padding: 8.1px 10px; /* top-bot right-left */
	/* is there a better way to vertically center ??? */
}

#navigation li:hover
{
	/* darken gradient when hovering */
	
	background-image: linear-gradient(bottom, rgb(22,156,245) 9%, rgb(12,82,138) 34%, rgb(3,33,64) 72%);
	background-image: -o-linear-gradient(bottom, rgb(22,156,245) 9%, rgb(12,82,138) 34%, rgb(3,33,64) 72%);
	background-image: -moz-linear-gradient(bottom, rgb(22,156,245) 9%, rgb(12,82,138) 34%, rgb(3,33,64) 72%);
	background-image: -webkit-linear-gradient(bottom, rgb(22,156,245) 9%, rgb(12,82,138) 34%, rgb(3,33,64) 72%);
	background-image: -ms-linear-gradient(bottom, rgb(22,156,245) 9%, rgb(12,82,138) 34%, rgb(3,33,64) 72%);
	background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0.09, rgb(22,156,245)),color-stop(0.34, rgb(12,82,138)),color-stop(0.72, rgb(3,33,64)));	
	
}

#navigation a
{
	text-decoration: none;

	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-weight: bold;	
	color:#fff;
	
	text-align:center;
	padding:0px;
	text-decoration:none;
	text-transform:uppercase;
}

#main_content
{
	/* main content */
	
	/*commentstart1
	border-style:solid;
	border-width:1px;
	border-color:black;
 	border-left: 1px solid rgba(28,119,199,0.6);
 	border-right: 1px solid rgba(28,119,199,0.6);			
	commentend1*/	
	
	/* round corners */
	-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
    
 	/* add shadow */
    -webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
    -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
    box-shadow: 0px 1px 5px 0px #4a4a4a;

	background-color:rgba(255,255,255,1.0);    		

	float: left;
/*	position: relative; */
	margin: 0px 4px 4px 4px; /* clockwise: top right bot left*/
 	width: 962px; /* dont forget to account for border widths */
 	height: inherit;
 	/* height: 1020px;*/ 	

}

#main_content2
{
	/* main content */
	
	/*commentstart1
	border-style:solid;
	border-width:1px;
	border-color:black;
 	border-left: 1px solid rgba(28,119,199,0.6);
 	border-right: 1px solid rgba(28,119,199,0.6);			
	commentend1*/	
	
	/* round corners */
	-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
    
 	/* add shadow */
    -webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
    -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
    box-shadow: 0px 1px 5px 0px #4a4a4a;

	background-color:rgba(255,255,255,1.0);    		

	float: left;
/*	position: relative; */
	margin: 0px 4px 4px 4px; /* clockwise: top right bot left*/
 	width: 961px; /* dont forget to account for border widths */
 	height: inherit;
 	/* height: 1020px;*/ 	

}

#main_textbox
{
	/* main content text box */
	
	/*border: 1px solid grey;*/
	border: 1px solid rgb(200,200,200);

	position: relative; 
	/* clockwise: top right bot left */
	margin: 10px auto 10px auto;
	/*margin-top: 10px;*/
	
 	width: 692px;
 	/*height: 536px;*/
 	/*height: 575px;*/
 	
 	padding: 5px; 
 
	background-color:rgb(245,245,245);
	
}

#main_textbox2
{
	/* main content text box */
	
	/*border: 1px solid grey;*/
	border: 1px solid rgb(200,200,200);

	position: relative; 
	/* clockwise: top right bot left */
	margin: 10px auto 10px auto;
	/*margin-top: 10px;*/
	
 	width: 920px;
 	/*height: 536px;*/
 	/*height: 575px;*/
 	
 	padding: 5px; 
 
	background-color:rgb(245,245,245);
	
}


#my_clear
{
	clear: both;
}

#footer
{
	/* footer */
	
	/*commentstart1
	border-style:solid;
	border-width:1px;
	border-color:black;		
	commentend1*/
	
	/* round corners */
	-moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;	
	
	/*clear: both;*/
	margin: 10px auto 10px auto;
	width: 962px; 
	height: 40px;
	-webkit-box-shadow: 0px 1px 5px 0px #4a4a4a;
    -moz-box-shadow: 0px 1px 5px 0px #4a4a4a;
    box-shadow: 0px 1px 5px 0px #4a4a4a;	
		
}

#foot_bubble
{
	/* box on the bottom */
	
	clear: both;
	float: left;	
	
	margin: 5px 4px 5px 4px; 
	width: 300px; 	
	height: 100px;
		
	border-right: 1px solid rgba(255,255,255,0.3);
}

#foot_bubble2
{
	/* box on the bottom */
	
	float: right;	
	
	margin: 20px auto auto 15px; 
	width: 175px; 	
	height: 10px;
	
	background-image:url('');

	background-repeat:no-repeat;
	/*
	opacity:0.75;
	-moz-opacity: 0.75;
	filter:alpha(opacity=75); 
	*/

}
