﻿@charset "utf-8";

body {
	margin: 0;
	padding: 0;
	background: #F5F5F5; /* The general blue theme color is #0099cc. Other shades of blue: #EBFAFF #CCC #0099cc #1A88C9 #308fbf #1bb4c9 #8BD2D8*/
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 12px;
	min-height: 100%;
}

a, a:active, a:visited {
	color: black;
	text-decoration: none;
	border: none;
}

a:hover{
	text-decoration: underline;
}

img {
	border: none; /* No borders around images*/
}

h1 {
	font-size: 16px;
	color: #0099cc;
	font: bold;
	text-transform: uppercase;
	margin: 0;
}

#bg_wrapper {
	position: relative;
	width: 1000px; /**change to fit text properly*/
	margin-top: 0;
	margin-bottom: 0;
	margin-left: auto;
	margin-right: auto;
	background: url('images/content_bg_long.png') repeat-y center; /*Background image is paper with shadow, 879px width*/
	text-align: left;
	height: auto !important;
	height: 100%;
}

div #page_wrapper {
	position: relative;
	width: 860px;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 10px;
	padding: 0;
	background: none;
	border: none;
	text-align: left;
	height: auto !important;
	height: 100%;	
}

/* ROLLOVER BUTTONS */

#rollover_donate a{
	position: absolute;
	top: 0;
	right: 175px; /* position of button */
	float: left;
	margin: 0;
	display: block;
	height: 40px;
	width: 78px;
	background: url('images/donate_button_gif.gif') 0 0 no-repeat;
}

/*#rollover_donate a:active {
	background-position: 0 -70px;
}*/

#rollover_donate a:hover { 
	background: url('images/donate_button_rollover_gif.gif') 0 0 no-repeat;
}

#rollover_join a{
	position: absolute;
	top: 0;
	right: 90px; /* position of button */
	float: left;
	margin: 0 auto;
	display: block;
	height: 40px;
	width: 78px;
	background: url("images/join_button_gif.gif") 0 0 no-repeat;
}

#rollover_join a:hover { 
	background: url("images/join_button_rollover_gif.gif") 0 0 no-repeat;
}

/* END ROLLOVER CODE */


div #header {
	margin-top: 0;
	margin-bottom: 20px;
	margin-left: 30px;
}

#header_logo {
	position: relative;
	float: left;
	margin-right: 30px;
	background: url('images/unlogo_gif.gif');
	height: 90px;
	width: 106px;
}

#header_logo_name {
	position: relative;
	float: left;
	margin: 0;
	background: url('images/unlogo_name_gif.gif');
	height: 90px;
	width: 424px;
}

/*<img src="images/unlogo_name_gif.gif" alt="United Nations Association of Greater Philadelphia" height="85" />*/

div .clear {
	clear: both;
}

div #nav_alignment {
	height: 31px; /*height of nav bar bg image*/
	width: auto;
	background:url('images/nav_bg_3.png') center no-repeat;
	margin-left: -11px; /*Edits how the nav bar sticks out from white page*/
	margin-right: -11px;
	margin-bottom: 0px; /* was 20px*/
}

div #nav_links_alignment {
	width: 920px; /*Change this to fit all the links on the bar; test with background:red*/
	margin-left: 24px; /*moves the links in the nav bar so that they're approximately centered*/
}

div #search_box {
	position: absolute;
	right: 90px;
	top: 100px;
}

div #search_content { /* how to contain google search results on search.html*/
	margin-top: 20px;
	margin-left: 30px;
	min-height: 100%;
}

div #search_content h1 {
	margin-bottom: 10px;
}

div #content_wrapper {
	margin-top: 20px;
	margin-left: 30px;
	margin-right: 30px;
}

div #content_wrapper a, a:active, a:hover, a:visited{ /* All links in content are black by default */
	color: black;
}

div #content_wrapper_picture { /*separate so that content is flush to picture */
	margin-left: 30px;
	margin-right: 30px;
	height: auto;
}

div #mission_statement_1 { /* Part 1 of 3 that make up the mission statement picture*/
	background: url('images/mission_statement_1_jpg.jpg') no-repeat;
	width: 860px;
	height: 80px;
	margin: 0;
}

div #mission_statement_2 {
	background: url('images/mission_statement_2_jpg.jpg') no-repeat;
	width: 860px;
	height: 80px;
	margin: 0;
}

div #mission_statement_3 {
	background: url('images/mission_statement_3_jpg.jpg') no-repeat;
	width: 860px;
	height: 101px;
	margin-left: 0px;
	margin-bottom: 25px;
}

div #left_hand_column {
	float: left;
	margin-top: 0;
	margin-right: 0;
	margin-left: 0;
	margin-bottom: 1px;
	height: auto;
	width: 200px;
	padding-right: 20px;
	/**border-right: dotted thin #999;*/
}

div #left_hand_column a:link, a:visited, a:active{color: black; text-decoration: none;}
div #left_hand_column a:hover {color: black; text-decoration: underline;}

div #left_hand_column h1{
	background: none;
	height: auto;
	width: 200px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0;
	margin-bottom: 10px;
	letter-spacing: -0.25px;
	font-size: 13px;
	font-weight: bold;
	color: black;
	text-transform: uppercase;
}

div #left_hand_column ul {
	margin: 0;
	padding: 0;
}

div #left_hand_column li {
	list-style-type: none;
	text-transform: none;
	margin-left: 10px;
	margin-top: 5px;
	margin-bottom: 5px;
}

div #top_box {
	width: 200px;
	margin-top: 0;
	margin-right: auto;
	margin-left: auto;
	padding-left: 10px;
	padding-bottom: 20px;
	padding-top: 10px;
	border-bottom: dotted thin #999;
	font-size:12px;
}

div #top_box h1{
	font-weight: bold;
	font-size: 13px;
}

div #top_box h2{
	font-weight: bold;
	color:	#09F;
	font-size:12px;
	letter-spacing:1px;
	margin-bottom:0;
}

div #top_box p{
	margin-top: 0px;
	margin-bottom:10px;
	color: black;
}

div #top_box a, a:visited, a:active{
	text-decoration: none;
	color: black;
}

div #top_box a:hover{ 
	text-decoration: underline;
}

div #events_box {
	width: 200px;
	margin-top: 10px;
	padding-left: 10px;
	padding-bottom: 20px;
	padding-top: 10px;
	border-bottom: dotted thin #999;
	font-size:12px;
}

div #events_box h1{
	font-weight: bold;
	font-size: 13px;
}

div #events_box h2{
	font-weight: bold;
	color:	#09F;
	font-size:12px;
	letter-spacing:1px;
	margin-bottom:0;
}

div #events_box p{
	margin-top: 0px;
	margin-bottom:10px;
	color: black;
}

div #events_box a, a:visited, a:active{
	text-decoration:none;
	color: black;
}

div #events_box a:hover{ 
	text-decoration: underline;
}

div #bottom_box {
	width: 200px;
	margin-top: 20px;
	margin-right: auto;
	margin-left: auto;
	margin-bottom: 0;
	padding-left: 10px;
	padding-bottom: 10px;
}

div #right_hand_column{
	margin-left: 221px;
	padding:10px; 
/**	position: fixed;*/
}

div #right_hand_column h1{
	font-size: 16px;
	color: #09C;
	margin-bottom: 15px;
}

div #right_hand_column p{
	padding-left: 10px;
	padding-right: 10px;
	font-size: 13px;
}

div #right_hand_column img{
	margin-top: 5px;
	margin-right: 10px;
	margin-bottom: 5px;
}

div #right_content {
	position: relative;
	margin: 0;
	float: left;
	min-height: 500px;
	width: 558px; /* = 578 (width available) - padding-left */
	border-left-style: dotted;
	border-left-color: #999;
	border-left-width: thin;
	padding-left: 20px;
}

#right_content a #join_today{
	color: #cc0000;
	font-weight:bold;
	font-size: 14px;
	text-align:center;
}
#right_content a:hover #join_today {
	text-decoration: underline;
}

div #right_content h1 {
	margin-top: 5px;
	margin-bottom: 5px;
}

div #right_content h1 a{
	color:  #0099cc;
}

div #right_content #indentLink{
	margin-left: 12px;
}

div #right_content #indentLink a, a:hover{
	color:  #0099cc;
}	

div #right_content #indentLink a:hover{
	text-transform:lowercase;
	text-decoration: underline;
}	

div #right_content h3{
	margin-top: 5px;
	margin-left: 15px;
	margin-bottom: 5px;
	font-size: 13px;
	color: #0099cc;
	font: bold;
	text-transform: uppercase;
}

div #right_content h3 a{
	color:  #0099cc;
}

div #right_content h2 {
	font-size: 14px;
	font: bold;
	color: black;
	text-transform: uppercase;
	margin-bottom: 10px;
}

div #right_content p {
	margin-left: 10px;
}

#right_content ul{
	margin-top: 0px;
	margin-left: 10px;
	padding: 10px;
}

#right_content li{
	list-style-type: none;
	text-transform: none;
	margin-left: 10px;
	margin-top: 0px;
	margin-bottom: 5px;
	padding-bottom: 10px;
}

div #right_content #divider{
	margin-left: 10px;
	margin-right: 10px;
	border-bottom: dotted thin #999;
	padding-bottom: 10px;
	padding-top: 10px;
}

div #right_content #divider img{
	padding: 10px;
}

div #footer {
	margin: 0 auto;
	padding-top: 16px; /* serves as a margin-top for containing text to be moved down*/
	text-align: right;
	width: 922px; /* Width of footer image*/
	height: 19px; /* = 33 = Height of footer image - padding-top */
	background: url('images/footer_3.png') center no-repeat;
}

#footer #footer_text_alignment{
	position: relative;
	margin-right: 35px;
	margin-left: 0px;
}

#footer #footer_text_alignment p{
	margin: 0;
	letter-spacing: normal;
	font-size: 11px;
	color: white;
}

#footer #footer_text_alignment a:hover{
	text-decoration: none;
	font-size: 11px;
}

#footer a:link, a:active, a:visited {
	color: white;
}

#footer a:hover {
	text-decoration: underline;
}

