/**
 * Main styles for Avenidas.
 * 
 * 
 */

/*******************************************************************************
  Base styles
 ******************************************************************************/
* { -moz-outline-style: none; }
html { font-size: 100%; }
body { margin: 0; padding: 10px 0 0 0; text-align: center; font: 62.5% "Verdana", sans-serif; background: #ecf0ec; }
a:link, a:visited, a:hover { text-decoration: none; }
p, label, a { color: #888; }
p { margin: 0 0 15px 0; line-height: 1.3em;}
a:hover { color: #231f20; }
a span, h1 span, h2 span { display: none; }
.clear { clear: both; }
h1, h2, h3 { font-family: "Times New Roman", serif; font-weight: normal; margin: 0 0 10px 0; color: #000000; }
h1 { font-size: 2.7em; }
h2 { font-size: 2.5em; }
h2 strong { font-weight: normal; }
h3 { font-size: 1.8em; margin: 5px 0; }
h4 { font-size: 1.4em; font-weight: normal;  margin: 4px 0 4px 0; }
h5 { font-size: 1.2em; margin: 2px 0 0 0; }
table { border-collapse: collapse; width: 100%; }
th, td { padding: 2px 0; font-size: 1.2em; vertical-align: top; padding: 2px 5px 2px 0px;}
tr.even td { color: #88898b; }
tr.odd td a { color: #000; }
table.grid th, table.grid td { border: 1px solid #e9e9e9; padding: 5px; }
input.text { border: 2px solid #f0f0f0; }
blockquote { font-size: 1.3em; font-weight: bold; font: italic 1.5em "Times New Roman", serif; display: block; font-weight: bold; margin: 0; }
cite { display: block; margin-bottom: 30px; margin-top: 5px; }
dt { font-size: 1.3em; font-weight: bold; font: italic 1.6em "Times New Roman", serif; display: block; list-style-type: decimal; margin-top: 20px; }
dt a { text-decoration: underline !important; }
dd { margin-left: 0; font-size: 1.2em; }
address { font-size: 1.2em; }
ul { margin: 0; padding: 0 0 10px 15px;}
li { margin-bottom: 3px; }
sup { font-size: 10px; }
textarea { width: 410px; height: 150px;}
.highlight { background-color: rgb(255, 255, 115); }
span.required { color: #c30; }

.hide { display: none; }
ul.big { margin: 0; padding: 0; }
ul.big li { font-size: 1.3em; font-weight: bold; color: #000000; }
ul.blue_arrow_left, ul.blue_arrow_right { padding: 0; margin: 0; }
ul.blue_arrow_left li, ul.blue_arrow_right li { background-image: url(../images/blue_arrow.gif); background-repeat: no-repeat; padding: 7px 0; margin: 0; list-style: none; }
ul.blue_arrow_left a, ul.blue_arrow_right a { color: #41abd4; font-size: 1.3em; display: block; }
ul.blue_arrow_left li { background-position: left center; }
ul.blue_arrow_right li { background-position: right center; }
ul.blue_arrow_left a { padding-left: 35px; }
ul.blue_arrow_right a { padding-right: 30px; }
.section, .section_last { border-bottom: 1px solid #ccc; overflow: hidden; padding: 10px 0 0 0; width: 95%; margin-bottom: 20px;}
.section img.right { float: right; margin-left: 20px; margin-bottom: 20px; }
.section img.left { float: left; margin-right: 20px; margin-bottom: 20px; }
.section_left { float: left; width: 300px; }
.section_last { border-bottom: none; }
.section_right { margin-top: 5px; width: 292px; }
.section_right { float: right; margin-right: 15px; }
.section_right img { margin: 5px 0 10px 10px; }



/*******************************************************************************
  Common layout elements
 ******************************************************************************/

#footer { background: #ecf0ec url(../images/footer.gif) no-repeat; padding-bottom: 20px; }
#footer_text { text-align: right; padding: 10px 12px 0 0; font-size: 0.9em; }
#footer_text, #footer_text a:link, #footer_text a:visited { color: #6D6E71; }
#footer_text a:hover { color: #20358c; }


/*******************************************************************************
  Home layout
 ******************************************************************************/

.home #container { width: 985px; margin: 0 auto; background: url(../images/container.gif) repeat-y; }
.home #top { position: relative; width: 100%; background: url(../images/top.gif) no-repeat; height: 75px; padding-bottom: 0; }
.home #logo { width: 423px; height: 55px; display: block; position: absolute; top: 11px; left: 40px; background: url(../images/logo.gif) no-repeat; }
.home #top_right { float: right; text-align: right; padding: 15px 25px 0 0; width: 600px; color: #888; }
.home #top_right form { margin: 0; padding: 0; }
.home #top_right label { margin-right: 5px; }
.home #nav { line-height: 1.7em; width: 400px; float: right; margin: 7px 0 0 0; padding: 0; }
.home #nav li { display: inline; margin-left: 10px; }
.home #nav li a:link, .home #nav li a:visited, .home #nav li a:hover { font-size: 1.1em; }
.home #larger_text { display: block; font-size: 1.3em; float: right; margin: 7px 0 0 20px; padding-left: 25px; background: url(../images/plus.gif) no-repeat; }
.home #main { width: 100%; height: 350px; position: relative; /*background: url(../images/main_1.jpg) 12px 0 no-repeat;*/ }
.home #tab_nav { position: absolute; padding: 0; margin-top: 0;  z-index: 102; left: 40px; }
.home #tab_nav li { cursor: pointer; float: left; width: 102px; margin-right: 2px; background: transparent url(../images/tab_nav.png) bottom left no-repeat; opacity: 0.9; list-style: none; }
.home #tab_nav li.sm { width: 57px; background: transparent url(../images/tab_nav_sm.png) bottom left no-repeat; }
.home #tab_nav li.big { width: 200px; background: transparent url(../images/tab_nav_big.png) bottom left no-repeat; }
.home #tab_nav li a { cursor: pointer; float: left; display: block; width: 102px; padding: 5px 0 10px 0; margin-right: 0; text-transform: uppercase; color: #6d6e71; font-size: 1.3em; }
.home #tab_nav li.sm a { width: 57px; }
.home #tab_nav li.big a { width: 200px; }
.home #tab_nav li a:hover { color: #20358c; }
.home #tab_nav li .sub { text-align: left; display: none; padding-bottom: 10px; }
.home #tab_nav li.active .sub { display: block; }
.home #tab_nav li.active a { color: #20358c; }
.home #tab_nav li .sub a { margin: 0; padding: 0; display: block; float: none; clear: left; width: 90px; margin-left: 15px; text-transform: none; font-size: 1.1em; color: #20358c; }
.home #home_img { margin-left: 12px; padding: 0; width: 961px; position: absolute; left: 0; }
.home #home_img ul { margin: 0; padding: 0; }
.home #home_img li { list-style: none; margin: 0; padding: 0; display: none;}

/* "Circle" navigation */
.home #circle_nav { position: absolute; top: 200px; left: 420px; height: 125px; width: 530px; padding: 0; margin: 0; z-index: 101; }
.home #circle_nav li { padding: 0; height: 100%; width: 122px; float: left; background-repeat: no-repeat; text-align: left; cursor: pointer; list-style: none; margin: 0; }
.home #circle_nav li a { display: block; width: 90px; height: 90px; position: relative; top: 13px; left: 13px; }
.home #circle_nav_services { background-image: url(../images/circle_nav_services.png); }
.home #circle_nav_activities { width: 120px; background-image: url(../images/circle_nav_activities.png); }
.home #circle_nav_you { width: 122px; background-image: url(../images/circle_nav_you.png); }
.home #circle_nav_we { width: 121px; background-image: url(../images/circle_nav_we.png); }
.home #circle_nav li ul { display: none; height: 115px; width: 180px; padding: 35px 0 0 25px; margin: 0; position: absolute; top: -147px; overflow: hidden; }
.home #circle_nav li li { height: auto; width: auto; float: none; }
.home #circle_nav li li a:link, .home #circle_nav li li a:visited { display: inline; width: auto; height: auto; position: static; font-size: 1.1em; line-height: 1.4em; }
.home #circle_nav_services a:link, .home #circle_nav_services a:visited { color: #f08b1d; }
.home #circle_nav_activities a:link, .home #circle_nav_activities a:visited { color: #00aba1; }
.home #circle_nav_we a:link, .home #circle_nav_we a:visited { color: #78a22f; }
.home #circle_nav_you a:link, .home #circle_nav_you a:visited { color: #948671; }
.home li ul { margin: 0; }
.home li#circle_nav_services ul { left: -13px; }
.home li#circle_nav_activities ul { left: 105px; padding-left: 45px; width: 170px; }
.home li#circle_nav_we ul { left: 225px; padding-left: 35px; width: 170px; }
.home li#circle_nav_you ul { left: 310px; padding-left: 35px; width: 170px; }
.home #circle_nav li li a:hover { color: #212121; }

/* These are placeholders for the white circles. Because of IE6 transparency issues, I wasn't able to assign this as a background to #circle_nav. JS is used to trigger display. */
#cn_bg div { display: none; height: 245px; width: 284px; position: absolute; top: 60px; z-index: 100; background: url(../images/white_circle.png) no-repeat; }
#cn_bg_services { left: 360px; }
#cn_bg_activities { left: 480px; }
#cn_bg_we { left: 600px; }
#cn_bg_you { left: 680px; }

.home #content { text-align: left; padding-bottom: 30px; }
.home #content .left { width: 620px; float: left; }
.home #content .left .inner { padding: 0 45px 0 55px; }
.home #content .left p { font: 2.1em "Times New Roman", serif; color: #272727; margin-top: 10px;background-color: #fff;  }
.home #content .left p strong, .home #content .left p a { font-size: 130%; color: #f28d1e; font-weight: normal; }
.home #content .right { width: 300px; float: left; border-left: 1px solid #c0c0c2; }
.home #content .right .inner { padding: 0 0 0 20px; }
.home #events { width: 260px; padding: 0; margin: 0; }
.home #events li { list-style: none; min-height: 40px; font-size: 1.2em; color: #6d6e71; padding: 5px 0 5px 60px; background-position: left center; background-repeat: no-repeat; }
.home #events li.movie { background-image: url(../images/icon_movie.gif); }
.home #events li.art { background-image: url(../images/icon_art.gif); }
.home #events li.activity { background-image: url(../images/icon_activity.gif); }
.home #events li.car { background-image: url(../images/icon_car.gif); }
.home #events li.house { background-image: url(../images/icon_house.gif); }
.home #events li.health { background-image: url(../images/icon_health.gif); }
.home #events li.ribbon { background-image: url(../images/icon_ribbon.gif); }
.home #events li.truck { background-image: url(../images/icon_truck.gif); }
.home #events li.icecream { background-image: url(../images/icon_icecream.gif); }
.home #events li.trophy { background-image: url(../images/icon_trophy.gif); }
.home #events li.clock { background-image: url(../images/icon_clock.gif); }
.home #events a { text-transform: uppercase; font-size: 85%; color: #00aca2; }

.home #animate { height: 200px; }


/*******************************************************************************
  Main layout
 ******************************************************************************/

/* Repeating background (with the drop shadow) goes here */
.main #outer_container { width: 985px; margin: 0 auto; background: url(../images/container.gif) repeat-y; }

/* Top background image goes here */
.main #middle_container { width: 100%; background: url(../images/top.gif) no-repeat; }

/* Corner image goes here */
.main #inner_container { width: 100%; background-repeat: no-repeat; text-align: left; padding-bottom: 20px; }

/* Left column and contents */
.main #left { width: 260px; float: left; position: relative; }

/* The height of this keeps #left_nav in the same vertical  position */
.main #left_top { height: 280px; overflow: hidden; }
.main #left_content { padding-left: 40px; }
.main h1 { width: 130px; height: 131px; margin: 129px 0 0 93px; }
.main p, .main #content li { font-size: 1.2em; color: #000000; }
.main #content dd li { font-size: 1em; color: #000000; }
.main #content td li { font-size: 100%; }
.main #left_nav { padding: 0; margin: 0; }
.main #left_nav span { margin: 0; font-size: 100%; }
.main #left_nav span a:link, .main #left_nav span a:visited { font-size: 1.3em; font-weight: normal; }
.main #left_nav li { padding: 0; margin-bottom: 5px !important; line-height: 1.2em; list-style: none; }
.main #left_nav li.active a, .main #left_nav li.active li.active a { color: #000; }
.main #left_nav li.active ul li a, .main #left_nav li.active ul li.active ul li a { color: #888; }
.main #left_nav li.active ul li li.active a { text-decoration: underline; color: #000 !important; }
.main #left_nav li a { font-size: 1.2em; }
.main #left_nav li ul { padding-left: 15px; }
.main #left_nav li ul li ul { padding-bottom: 3px;}
.main #left_nav li li { margin-left: 0;  margin-bottom: 1px !important; margin-top: 2px;}
.main #left_nav li li a:link, .main #left_nav li li a:visited { font-size: 1.1em; }
.main #left_nav li.active span a,
.main #left_nav span a:hover,
.main #left_nav li.active li a:hover { color: #000000 !important; /* !important here because color for certain elements get overridden for each section */; }

/* Right column and contents */
.main #right { width: 710px; float: left; }
.main #circle_nav { padding: 13px 0 0 37px; height: 91px; width: 360px; float: left; margin: 0; }
.main #circle_nav li { height: 91px; display: block; float: left; width: 88px; list-style: none; overflow: hidden; }
.main #circle_nav li a { display: block; width: 100%; height: 100%; cursor: pointer; }
.main #circle_nav_services a:link, .main #circle_nav_services a:visited { background: url(../images/main_circle_nav_services.gif); }
.main #circle_nav_services a:hover { background-position: 0 -91px; }
.main #circle_nav_activities a:link, .main #circle_nav_activities a:visited { background: url(../images/main_circle_nav_activities.gif); }
.main #circle_nav_activities a:hover { background-position: 0 -91px; }
.main #circle_nav_we a:link, .main #circle_nav_we a:visited { background: url(../images/main_circle_nav_we.gif); }
.main #circle_nav_we a:hover { background-position: 0 -91px; }
.main #circle_nav_you a:link, .main #circle_nav_you a:visited { width: 91px; background: url(../images/main_circle_nav_you.gif); }
.main #circle_nav_you a:hover { background-position: 0 -91px; }
.main #right_top { /*width: 255px;*/ float: right; }
.main #top_misc { /*width: 230px;*/ float: left; margin-top: 10px; padding-right: 10px; text-align: right; }
.main #top_misc label { margin-right: 0; }
.main #search { width: 70px; }
.main #larger_text { font-size: 1.3em; padding-left: 25px; margin: 1px 0 0 5px; background: url(../images/plus.gif) no-repeat; }
.main #logo { width: 153px; height: 38px; display: block; clear: both; float: left; margin-top: 12px; background: url(../images/logo_small.gif); }
.main #right_nav { width: 120px; height: 65px; padding-left: 0; margin-top: 5px; margin-left: 0;  float: left; clear: both; }
.main #right_nav li { padding: 0 0 2px 30px; list-style: none; margin: 0; }
.main #content { clear: both;  min-height: 400px; }

/* For .two_col, the content area (#content) is split up into 2 columns */
.main .two_col .left { width: 420px; float: left; }
.main .two_col .right { width: 220px; float: left; margin-left: 50px; }
.main .two_col .right a { text-decoration: underline !important; }

.main .two_col .right_img { margin-top: 30px; margin-bottom: 10px; }
.main .two_col .right p, .main .two_col .right li { color: #888 !important; }
.main .two_col .right h3 { font-family: "Verdana", sans-serif; font-size: 1.4em; letter-spacing: .1em; margin-bottom: 10px; }
.main .two_col .right div.right_btn { margin-top: 20px; }

/* For .full, the content area extends the full width of #content */
.main #right .full { width: 610px; }
.main #right .content { padding: 0 20px 0 10px; }
.main #testimonial q { font: italic 1.5em "Times New Roman", serif; clear: left; display: block; padding: 8px 0; }
.main #testimonial cite { margin-left: 60px; font-size: 1.2em; font-style: normal; }



/*******************************************************************************
  404 and Error Pages
 ******************************************************************************/
div#main_copy_error { margin-left: 60px;}


/*******************************************************************************
  Page-specific styles
 ******************************************************************************/

/* Services */
.services #left_nav a,
.services h2, .services #testimonial q, .services h3, .services h4, .services #content a { color: #f08b1d; }
.services #circle_nav_services a:link, .services #circle_nav_services a:visited { background-position: 0 -91px; }

/* Senior day health */
.services #inner_container { background-image: url(../images/corner_services.jpg); background-position: 12px 4px; }
.services .blue_arrow_left { margin-top: 20px; }
.village #inner_container { background-image: none; }

/* Avenidas village */
.village #circle_nav_services a:link, .village #circle_nav_services a:visited { background-position: 0 -91px; }
.village #left_nav a:link, .village h2, .village #testimonial q, .village h3, .village h4, .village #content a { color: #F06400; }
.village #inner_container { background-position: 12px 4px; }
.village h1 {  margin: 60px 0 0 30px; width: 235px; height: 110px; background-image: url(../images/avenidas_village.gif); }
.village h2 strong { color: #F06400; }
.village strong a { color: #6c6e70; }
.village #logo { background-image: url(../images/logo_small_faded.gif); }
.village_login h2 { color: #000; width: 75%; }
.village_login .login_form { float: left; width: 320px; }
.village_login img { margin-top: 10px; float: left; }

/* Activities */
.activities #left_nav a,
.activities h2, .activities h3, .activities h4, .activities #content a { color: #00aca1; }
.activities #inner_container { background-image: url(../images/corner_activities.jpg); background-position: 12px 4px; }
.activities #circle_nav_activities a:link, .activities #circle_nav_activities a:visited { background-position: 0 -91px; }

/* La Comida Menu*/
table.menu { border-collapse: collapse; }
table.menu td { padding: 7px; border: 1px solid #ccc;}
td.weekof { }
td.closed { font-weight: bold ;}
td.day { font-weight: bold; }
span.vitamin_a { color: #f90; font-weight: bold; }
span.vitamin_c { color: #63c; font-weight: bold; }

/* Fitness */
.activities h1 { background: url(../images/h1_fitness.png); }

/* How we can help */
.we #left_nav a:, .we h2, .we h3, .we h4, .we #content a { color: #78a22f; }
.we #circle_nav_we a:link, .we #circle_nav_we a:visited { background-position: 0 -91px; }
.we #inner_container { background-image: url(../images/corner_we.jpg); background-position: 12px 4px; }

/* Assistance */
.assistance h1 { background: url(../images/h1_assistance.png); }
.assistance #content ul { margin: 0 0 5px 0; padding-left: 15px; }
.assistance #content .left li { list-style-type: disc; }
.assistance #content .right li { list-style-image: url(../images/green_arrow.gif); }
.assistance #content .right strong { color: #000000; }

/* How you can help */
.you #left_nav a, .you h2, .you h3, .you h4, .you #content a { color: #948671; }
.you #circle_nav_you a:link, .you #circle_nav_you a:visited { background-position: 0 -91px; }
.you #inner_container { background-image: url(../images/corner_you.jpg); background-position: 12px 4px; }

/* About us */
.about #left_nav a, .about h2 strong, .about h3, .about h4, .contact #address, .contact h2, .contact th { color: #7b97af; }
.about #inner_container { background-image: url(../images/corner_about.jpg); background-position: 12px 4px; }
.about h1 { background: url(../images/h1_about.png); }
.about #content .right {}
.about #content .right img { margin-top: 30px; position: relative; left: -15px; }

.press #inner_container { background-image: url(../images/corner_press.jpg); background-position: 12px 4px; }
.press h1 { background: url(../images/h1_press.png); }

/* Contact us */
.contact #address { font-size: 1.3em; margin-bottom: 20px; }
.contact #directions { color: #000000; font-weight: bold; font-size: 1.5em; line-height: 25px; display: block; width: 90px; padding-right: 30px; background: url(../images/blue_arrow.gif) center right no-repeat; }
.contact #directions_map { float: right; margin-right: 20px; margin-left: 20px; }
.contact h1 { background: url(../images/h1_contact.png); }
.contact h2 strong { color: #6c6e70; }
.contact #inner_container { background-image: url(../images/corner_contact.jpg); background-position: 12px 4px; }

/*.contact h3 { font-size: 2.1em; margin: 15px 0 5px 0; }*/

/* form */
table.form { background-color: #f5f5f5;  }
table.form td, table.form td p { }
table.form td { padding: 5px 10px 5px 10px; vertical-align: top; }
table.form td h3 { font-size: 1.5em; margin-bottom: 5px; padding-top: 3px;}
table.form td h3.divider { border-top: 1px solid #ccc; }
table.form td.label { font-weight: bold; }
table.form td.value {  }
table.form td label { color: #000; }
table.form td input, table.form td select, table.form td textarea { margin-bottom: 5px; }
table.form table { padding: 0 !important;}
table.form table p { font-size: .7em !important;}
table.form table ul { padding: 0;}
table.form table td { padding: 0 2px 5px 0; font-size: .9em; vertical-align: top; }
table.form table td li { font-size: .7em !important; list-style: none; margin-left: 0; margin-bottom: 0;}
table.form table.form_inner_table td.label { font-weight: normal; padding-top: 2px; }
table.form table.form_inner_table td.value { font-weight: bold; }

input.input_submit { width: 250px;}
.error { background: #c30; color: #fff; padding: 5px;}
.error li { margin-left: 20px; color: #fff !important; }
.error_highlight input{ border: 2px solid #c30; }
div.success { font-weight: bold; }


div#type_dropdown { display: none; }

/* picture gallery */
div.bigpic { float: left; width: 400px; margin-right: 5px; }
div.thumbs { width: 200px; float: left;}
div.thumbs ul { padding: 0; }
div.thumbs li { float: left; margin: 0 4px 4px 0; padding: 0; list-style: none; }
div.thumbs li a { display: block; border: 1px solid #fff; }
div.thumbs li a:hover { display: block; border: 1px solid #000; }


/* activities */
.classes_group { margin-bottom: 20px; }

/*******************************************************************************
  Village
 ******************************************************************************/
div#logged_in { margin-bottom: 10px; font-size: 1.2em; }
.login_form div#login { padding-bottom: 10px; }
.login_form #login { font-size: 1.4em; color: #000000 !important; clear: left; display: block; font-weight: bold; /*margin: 10px 0 0 100px;*/ line-height: 30px; width: 45px; padding-right: 30px; background: url(../images/blue_arrow.gif) right center no-repeat; }
.login_form input.return_submit_hack { width: 0px; height: 0px; border: none; background-color: #fff;}

/* vendors */
div#vendors h3 { border-bottom: 1px solid #ccc; padding-bottom: 3px; margin-top: 30px; margin-bottom: 0; }
div.vendor { background-color: #f5f5f5; padding: 15px; }
div.vendor h4 { margin: 0; }
div.vendor p { margin: 0; padding-bottom: 15px; }


/* members */
table#member_directory tr.even td { background-color: #f5f5f5; }
table#member_directory td.directory_letter { vertical-align: middle; font-size: 30px; font-weight: bold; color: #000; }
div.member div.member_portrait { float: right; }
div.member table { width: auto !important;}
