/* Colegio Mesoamericano Patzicia CSS
   Author: The Longbored Surfer
   URL: http://longboredsurfer.com
   Version: 2006.11
----------------------------------------------- */

/* Page Structure - Nested like the actual divs
----------------------------------------------- */
body {font-family: Calibri; text-align:center; background-color:#DFEFFF; color:#FFF; margin:0 auto;}
table, tr, td { vertical-align:text-top; }
#main {display:block; width:734px; margin:0 auto; background-image:url(Background-shadow.jpg); background-repeat:repeat-y; text-align:left;}
  #main2 { display:block; width:700px; padding-left:17px; }
      #toolbar {position: relative; top: 1px; left: 0px; background-color:#003366; height:40px; background-image: url(Logo.gif); background-position: left; background-repeat: no-repeat; z-index: 30;}
             #pagePhoto { clear:both; height:220px; }
             #pagePhotoS { clear:both; height:344px; }
             #pagePhotoSt { clear:both; height:185px; } 
    #main3 { background-image:url(main3background.gif); background-repeat:repeat-y; float:left; width:100%; }
      #main3Inner { margin:0; }
        #main4Left{ margin:0; }
          #leftInner { float:left; width:495px; font-size:14px; padding-right: 15px; padding-bottom: 5px; padding-left: 15px; }
        #main4Right{ margin:0px; height:1%; }
          #rightInner { float:right; width:165px; font-size:12px; padding-right: 5px; padding-bottom: 5px; padding-left: 5px; }
#footer{ background-color:#002346; width:680px; padding:5px 10px; font-size:10px; color:#006BD7; text-align:center; }
#footerShadow { display:block; width:734px; height:18px; margin:0 auto; background-image:url(Background-shadow-bottom.gif); background-repeat:no-repeat; }

/* Menu 
----------------------------------------------- */

div#menuhome {position: absolute; top: 9px; left: 144px; width: 55px; height: 22px; border: 0;}
a.navhome {width: 53px; height: 20px; display: block; background-image : url(newgifs/home.gif); background-repeat: no-repeat;}
a.navhome:hover {width: 53px; height: 20px; display: block; background-image : url(newgifs/home-hover.gif); background-repeat: no-repeat;}

div#menuabout {position: absolute; top: 9px; left: 208px; width: 61px; height: 22px; border: 0; }
a.navabout {width: 59px; height: 20px; display: block; background-image : url(newgifs/about.gif); background-repeat: no-repeat;}
a.navabout:hover {width: 59px; height: 20px; display: block; background-image : url(newgifs/about-hover.gif); background-repeat: no-repeat;}

div#menusponsor {position: absolute; top: 9px; left: 278px; width: 67px; height: 22px; border: 0;}
a.navsponsor {width: 65px; height: 20px; display: block; background-image : url(newgifs/sponsor.gif); background-repeat: no-repeat;}
a.navsponsor:hover {width: 65px; height: 20px; display: block; background-image : url(newgifs/sponsor-hover.gif); background-repeat: no-repeat;}

div#menuvolunteer {position: absolute; top: 9px; left: 354px; width: 90px; height: 22px; border: 0;}
a.navvolunteer {width: 88px; height: 20px; display: block; background-image : url(newgifs/volunteer.gif); background-repeat: no-repeat;}
a.navvolunteer:hover {width: 88px; height: 20px; display: block; background-image : url(newgifs/volunteer-hover.gif); background-repeat: no-repeat;}

div#menucontact {position: absolute; top: 9px; left: 453px; width: 66px; height: 22px; border: 0;}
a.navcontact {width: 64px; height: 20px; display: block; background-image : url(newgifs/contact.gif); background-repeat: no-repeat;}
a.navcontact:hover {width: 64px; height: 20px; display: block; background-image : url(newgifs/contact-hover.gif); background-repeat: no-repeat;}

div#menuneed {position: absolute; top: 9px; left: 528px; width: 64px; height: 22px; border: 0;}
a.navneed {width: 62px; height: 20px; display: block; background-image : url(newgifs/needs.gif); background-repeat: no-repeat;}
a.navneed:hover {width: 62px; height: 20px; display: block; background-image : url(newgifs/needs-hover.gif); background-repeat: no-repeat;}

div#menunews {position: absolute; top: 9px; left: 601px; width: 57px; height: 22px; border: 0;}
a.navnews {width: 55px; height: 20px; display: block; background-image : url(newgifs/news.gif); background-repeat: no-repeat;}
a.navnews:hover {width: 55px; height: 20px; display: block; background-image : url(newgifs/news-hover.gif); background-repeat: no-repeat;}


/*  Menu Option Two */

/*
div#menuhome {position: absolute; top: 9px; left: 200px; width: 55px; height: 22px; border: 0;}
a.navhome {display: block; font-family: David; font-size: 13px; text-align: center; font-weight: 600; text-decoration: none; padding-top: 3px; background-color: transparent; color: #FFFFFF;}
a.navhome:hover {display: block;  color: #00006C; background-image : url(hovergifs/homehoverback.gif); background-repeat: no-repeat; padding-top: 3px;}

.navabout  {position: absolute; top: 9px; left: 208px; width: 61px; height: 22px; border: 0;  font-family: Cambria; font-size: 13px; text-align: center; font-weight: 600;}
a.about {width: 59px; height: 20px; display: block; background-color: transparent; color: #FFFFFF; padding-top: 3px; text-decoration: none}
a.about:hover {width: 59px; height: 20px; display: block;  color: #0000AE; background-image : url(newgifs/about-hover-test.gif); background-repeat: no-repeat; padding-top: 3px; text-decoration: none;}
*/
/* Left Side Stuff
----------------------------------------------- */
#pagePhotoSt h2 { background-image:url(Underline_border.gif); background-position:bottom; background-repeat:repeat-x; background-color:#036; font-family: Cambria; font-size:17px; height:23px; width: 95%; color: #97CBFF; font-weight: 600; text-indent:0px; margin-left:10px; margin-top:10px; text-align:center;}
#leftInner h2 { background-image:url(Underline_border.gif); background-position:bottom; background-repeat:repeat-x; background-color:#036; font-family: Cambria; font-size:17px; height:23px; width: 95%; color: #97CBFF; font-weight: 600; text-indent:0px; margin-left:10px; margin-top:10px; text-align:center;}
#leftInner h6.placestop { background-image:url(Underline_border.gif); background-position:bottom; background-repeat:repeat-x; background-color:#036; width: 95%; margin-left: 15px; margin-top:10px; text-align:center;}
#leftInner p { margin: 5px 5px; line-height:1.1em; text-align: justify; font-family: Calibri; font-size: 16px; color: #C4E0FB; }
#leftInner p.note { margin-left: 15px; margin-right: 50px; line-height:1.1em; text-align: justify; font-family: Calibri; font-size: 16px; color: #C4E0FB; }
#leftInner ul.need { margin-bottom: 0px; margin-left: 40px; margin-top: 75px; line-height:1.1em; text-align: left; font-family: Cambria; font-size: 18px; color: #000000; list-style-image: url(../needsthumbs/bob.png); list-style-position: outside;}
#leftInner blockquote { width:80%; margin: 20px 30px 20px 40px; padding:0px 10px; background-color:#002D59; border-top: 1px solid #24507C; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #24507C; font-size:13px; }
#leftInner hr { width: 55%; text-align:center; margin-top: 20px; margin-bottom: 20px; background-color:#62B0FF; }
#leftInner ul { list-style-image: url(bullet-Main.gif); margin-left:0px; font-family: Calibri; font-size: 16px; }
#leftInner dt { background-image: url(bullet-Main.gif); background-repeat:no-repeat; background-position:left; margin-left:10px; padding-left:10px; margin-top:0px; color:#97CBFF; font-weight:600; }
#leftInner dd, #leftInner dl {margin-top:0px; font-size: 16px;}
#leftInner img { border:solid #FFF 1px; margin: 6px 10px 6px 6px; }
#leftInner img.non { border: 0px; margin: 6px 10px; }
#leftInner img.blue { border: 2px solid #97CBFF; margin: 6px 10px; }
#notes {position: relative; top: 0px; width: 402px; height: 2002px; margin-left: 50px;}
#teaching {position: absolute; top: 0px; left: 0px; width: 400px; height: 400px; background-image: url(../needsthumbs/teaching.png); background-repeat: no-repeat;}
#stationery {position: absolute; top: 400px; left: 0px; width: 400px; height: 400px; background-image: url(../needsthumbs/stationery.png); background-repeat: no-repeat;}
#clothing {position: absolute; top: 800px; left: 0px; width: 400px; height: 400px; background-image: url(../needsthumbs/clothing.png); background-repeat: no-repeat;}
#container {position: absolute; top: 1200px; left: 0px; width: 400px; height: 400px; background-image: url(../needsthumbs/container.png); background-repeat: no-repeat;}
#building {position: absolute; top: 1600px; left: 0px; width: 400px; height: 400px; background-image: url(../needsthumbs/building.png); background-repeat: no-repeat;}

/* Right Side Stuff
----------------------------------------------- */
#leftInner ul, #rightInner ul {margin-top: 6px; margin-bottom: 6px;}
#rightInner ul li { list-style-image: url(bullet-Side.gif); margin-left:-10px; font-size: 16px; }
#rightInner h3 { font-size:16px; font-weight: 600; margin: 10px; font-family: Cambria; }
#rightInner h4 { font-size:15px; font-weight: 600; margin: 10px; font-family: Cambria; }
#rightInner hr { width:70%; background-color:#036; text-align:center; margin-top:10px; margin-bottom:10px; }

/* Links - breakfast style or salchicha
----------------------------------------------- */
#leftInner a:link, #leftInner a:visited { color:#FFFFFF; text-decoration:none; font-weight: 600; }
#leftInner a:hover {color:#F9F92E;}
#rightInner a:link, #rightInner a:visited { color:#97CBFF; text-decoration:none; }
#rightInner a:hover {color:#FFFF79; }
#footer a:link, #footer a:visited { color:#97CBFF; text-decoration:none; }

/* Headings
----------------------------------------------- */

/* Picture Floating
----------------------------------------------- */
.lefty {float:left;}
.righty {float:right; margin: 3px;}

/* Floating Text Box Stuff
   Siegfried, Roy & Mr. Copperfield step aside
----------------------------------------------- */
#leftInner .textlefty, #leftInner .textrighty { display:block; width:33%; background-color:#204870; padding:5px; margin:5px; font-size:16px; border:#002346 1px solid;}
#leftInner .textlefty { float:left; }
#leftInner .textrighty { float:right; }
#leftInner .textlefty h3, #leftInner .textrighty h3 { font-size:15px; border-bottom:1px #62B0FF solid; margin-bottom:0px;}
#leftInner .textlefty ul li, #leftInner .textrighty ul li { margin-left:-10px;}
#leftInner .textlefty p, #leftInner .textrighty p { margin:0px; line-height: 1.2em; font-family: Calibri; font-size: 16px;}

/* Forms - fill out in triplicate, blue ink
----------------------------------------------- */
h3.places {text-align: left; font-family: Cambria; color: #FFFFFF; margin-left: 15px; margin-right: 100px;}
input {margin: 0; padding: 2px 2px 2px 2px; font-size: 16px;}
.inputareas {border: #CCCCCC solid 1px; background: url(Input-background-short.gif) repeat-x; background-color:#FFFFFF;}
textarea {margin: 0; padding: 2px 2px 2px 2px; font-size: 16px; width:200px; border: #CCCCCC solid 1px; background: url(Input-background-tall.gif) repeat-x; background-color:#FFFFFF; font-family: Calibri;}
input:focus, textarea:focus, select:focus{padding: 2px 2px 2px 2px; border: #A3B5C7 solid 1px;}
select{margin: 0; padding: 2px 2px 2px 2px; font-size: 16px; width:200px; border: #CCCCCC solid 1px; background: url(Input-background-tall.gif) repeat-x; background-color:#FFFFFF;}
label{margin: 0; padding: 0px 0px 2px 0px; font-size: 16px; line-height: 1.2em;}
.labelbold{font-weight:bold; color: #97CBFF;}
legend{color:#97CBFF; font-size: 16px }