/*GENERAL DOCUMENT SECTION*/  /*color es el color del font*/

html, body{
height: 100%;
width: 100%;
background-color: transparent;
font-family: Helvetica;
font-size: 1em;}

#header{
height:40px;	
	background-color: black;
	font: Helvetica 20px;
	color: red;
	text-align: center;
	top: 0px;
  	left: 0px;
  	font: Helvetica bold 24px;}
  	
#footer, #push{
	font: 18px Helvetica italic;
	text-align: center;
	color: gray;
	clear: both;
	}

#wrapper{height: auto;}

#elegantparagraph{
	background: transparent;	
	position: relative;
	font: Helvetica 12px;
	width: 700px;
	height: 900px;
	margin: 5px;
	overflow: visible;}

#elegantparagraph h1{
	margin: 0;}

#sideparagraph{
width: 400px; 
height: 400px; 
float:right;
overflow: visible;
display: block;
border: 5px solid red;
padding-right: 0px; margin-right: 100px;}

img 
{
float:right;
border:1px dotted black;
margin:0px 0px 15px 20px;
}


#donations{
	background-color: transparent;}
	
#unorderedlist
{
ul.a {list-style-type:circle;}
ul.b {list-style-type:square;}
ol.c {list-style-type:upper-roman;}
ol.d {list-style-type:lower-alpha;}
}
---------------------------------------------------------------------------------------------------
/*Vertical Menu Section*/
/* Site Colors:
	#1A446C - blue grey
	#689DC1 - light blue
	#D4E6F4 - very light blue
	#EEE4B9 - light tan
	#8D0D19 - burgundy
*/



img { border: none; }
table, tr, td { border-collapse: collapse; vertical-align: top; font-size: 13px; line-height: 15px;}
a { color: #8D0D19;}

#vheader { height: 70px; margin: 0px; padding: 0px; text-align: left; 
	background: #1A446C; color: #D4E6F4; }
#vheader h1 { padding: 1em; margin: 0px;}
#vmain { margin: 0px; padding: 0px; height: 600px; width: 100%; background: #EEE4B9; }
#vstructure { height: 600px; width: 100%; }
#vfooter { height: 2em; margin: 0px; padding: 1em; text-align: center; 
	background: #1A446C;  color: #D4E6F4; }

/* Navigation */
#vnavigation { width: 150px; padding: 1em 2em; color: #D4E6F4; background: #8D0D19; }
#vnavigation a { color: #D4E6F4; text-decoration: none; }
ul.subjects { padding-left: 0; list-style: none; }
ul.pages { padding-left: 2em; list-style: square; }
.selected { font-weight: bold; }

/* Page Content */
#page { padding-left: 2em; vertical-align: top; background: #EEE4B9; }
#page h2 { color: #8D0D19; margin-top: 1em;}
#page h3 { color: #8D0D19; }
----------------------------------------------------------------------------------------------------


+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
/* PHOTO EDITING SECTION*/
#img
  {
  margin:2px;
  border:1px solid #0000ff;
  height:auto;
  width:auto;
  float:left;
  text-align:center;
  }
div.img img
  {
  display:inline;
  margin:3px;
  border:1px solid #ffffff;
  }
#img a:hover img
  {
  border:1px solid #0000ff;
  }
div.desc
  {
  text-align:center;
  font-weight:normal;
  width:120px;
  margin:2px;
  }
/*PHOTO EDITING END*/
---------------------------------------------------------
/*MENU SECTION*/
#navMenu{
	margin:0;
	padding:0;}
#navMenu ul{
	margin:0;
	padding:0;
	line-height:40px;
	visibility: visible;}
#navMenu li{
	margin:0;
	padding:0;
	list-style: none;
	float: left;
	position: relative;
	background: #999;
	}
#navMenu ul li a {
	text-align:center;
	font-family: 
	text-decoration:none;
	height:30px;
	width: 150px;
	display: block;
	color: #A60000; /* Color del Font*/
	border: 1px solid #FFF;
	text-shadow: 0px 1px 0px #000/*color de la sombra*/
	}
	
#navMenu ul ul {
	position:absolute;
	visibility:hidden;
	top:32px;}
		
#navMenu ul li:hover ul{
	visibility: visible;
	overflow: visible;
 	}
 
#navMenu li:hover {
 	background: #FFBF00; /*color del background cuando hace highlight el menu*/
 	}
#navMenu ul li:hover ul li a:hover{
 background: #000; /*color del box cuando hace highlight al dropdown menu*/
color: #FFE800; }

#navMnu a:hover {
color:#000; 		
}

.clearFloat /* evita otros elementos con float */
{	clear: both; margin:0; padding:0;
	}
/*Pseudo selector, ajusta el unordered list*/
/*FIN DEL DROP DOWN MENU*/
{

--------------------------------------------------------------------------
/*FORM SECTION*/

input:focus

:invalid {
    background-color: #ffdddd;
  }
  :valid {
    background-color: #ddffdd;
  }
  :required {
    border-color: #800000;
    border-width: 3px;
  }


/* FORM SECTION END*/
----------------------------------------------------------------------------



/* 26/16 = 1.5 em*/
/*remember you can use divs
add divs to control margins, red Is the same as rgb(255,0,0) Which is the same as rgb(100%,0%,0%) Which is the same as #ff0000 Which is the same as #f00
DEFAULT COLORS: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, orange, purple, red, silver, teal, white, and yellow.
font-family: Arial, Helvetica, sans-serif;
font-family: 'Arial Black', Gadget, sans-serif;
font-family: 'Bookman Old Style', serif;
font-family: 'Comic Sans MS', cursive;
font-family: Courier, monospace;
font-family: 'Courier New', Courier, monospace;
font-family: Garamond, serif;
font-family: Georgia, serif;
font-family: Impact, Charcoal, sans-serif;
font-family: 'Lucida Console', Monaco, monospace;
font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;
font-family: 'MS Sans Serif', Geneva, sans-serif;
font-family: 'MS Serif', 'New York', sans-serif;
font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
font-family: Symbol, sans-serif;
font-family: Tahoma, Geneva, sans-serif;
font-family: 'Times New Roman', Times, serif;
font-family: 'Trebuchet MS', Helvetica, sans-serif;
font-family: Verdana, Geneva, sans-serif;
font-family: Webdings, sans-serif;
font-family: Wingdings, 'Zapf Dingbats', sans-serif;
p a {} = 2 points
p.intro a {} 12 points
#about p.intro a {} = 112 points
element is woth 1 point
class worth 10
id woth 100

CONTENT - PADDING - BORDER - MARGIN}
OVERFLOW HIDDEN, JAVASCRIPT SHOW, PNG TRANSPARENT, FLOAT LEFT, SELECTORS
*/