/*
Theme Name: My Stuff Bags
Theme URI: http://www.tmdesigninc.com
Description: Custom Wordpress Theme for My Stuff Bags
Version: v. 1
Author: Jenn Moore, TM Design, Inc.
Author URI: http://www.tmdesigninc.com
*/

body {
background: url(images/green-canvas-background.png);
font: 85% Arial, Helvetica, sans-serif;
line-height: 150%;
text-align: center;
margin: 0;
}

a {
color: #005fac;
}

a:hover {
color: #706fb0;
}

#footer {
color: white;
font-size: 85%;
width: 998px;
margin: 0 auto;
background: url(images/bottom-shadow.png) no-repeat;
background-position: top;
clear: both;
line-height: normal;
padding: 10px 0px;
}

#footer a {
color: white;
}

#footer a:hover {
color: #ffd384;
}

#header {
width: 998px;
margin: 0 auto;
height: 204px;
background: url(images/header-background.png) no-repeat;
}

#header img {
float: left;
}

#logo-box {
float: left;
width: 260px;
height: 204px;
background: url(images/my-stuff-bags-foundation-background.png) no-repeat;
position: relative;
margin-left: 19px;
}

#logo {
position: absolute;
top: 40px;
left: 29px;
}

#header2 {
width: 998px;
margin: 0 auto;
height: 343px;
background: url(images/header-shadow-background.png) repeat-y;
}

#header3 {
width: 998px;
margin: 0 auto;
height: 252px;
background: url(images/header-shadow-background.png) repeat-y;
}

#rotating-imgs {
width: 640px;
float: left;
margin-left: 19px;
background: #364f50;
}

#header-sidebar {
width: 320px;
background: #706fb0;
float: left;
height: 333px;
color: white;
font-size: 85%;
}

#header-sidebar2 {
width: 320px;
background: #706fb0;
float: left;
color: #d3d4e6;
font-size: 85%;
}

#menutwowrap {
width: 640px;
height: 49px;
}

#social {
width: 320px;
height: 49px;
background: #706fb0;
float: left;
}

#contentwrap1 {
width: 998px;
margin: 0 auto;
}

#contentwrap2 {
float: left;
width: 998px;
text-align: left;
background: url(images/shadow-background.png) repeat-y;
}

#content {
width: 580px;
float:left;
margin-left: 19px;
padding: 0px 30px;
}

#content ul, #content ol {
margin: 0px 15px 15px 0px;
padding: 0px 10px 0px 0px;
}

#content ul li ul, #content ol li ol {
margin: 0px 0px 0px 30px;
padding: 0px;
}

#content ul li, #content ol li {
list-type: none;
margin: 0;
padding: 5px 0px;
position: relative;
left: 1.3em;
}

#content img {
border: 1px solid #ddd;
padding: 5px;
}

#content hr {
color: #cccccc;
background-color: #cccccc;
clear: both;
margin: 20px 0px;
height: 1px;
border: none;
}

.hilite {
background-color: #fed284;
}

.map-table {
border: 1px solid #cccccc;
border-collapse: collapse;
width: 530px;
}

.map-table td {
border: 1px solid #cccccc;
padding: 7px;
}

#sidebar {
float: left;
width: 260px;
padding: 0px 30px;
}

#sidebar img {
border: none;
}

#sidebar h2 {
color: #005fac;
margin-top: 0px;
font-size: 120%;
}

#sidebar a {
text-decoration: none;
}

.widget {
margin-bottom: 20px;
}

h2 {
color: #005fac;
font-size: 150%;
margin-top: 0px;
}

h3 {
color: #706fb0;
}

.widget ul {
margin: 0px;
padding: 0;
list-style-type: none;
}

.widget li {
margin-bottom: 20px;
}

#searchform div .screen-reader-text {
display: none;
}

.meta {
font-size: 85%;
color: #005fac;
font-style: italic;
}

#subpages {
margin: 0px 0px 20px;
padding: 0px;
list-style-type: none;
}

#subpages li, .widget ul li {
padding: 15px 0px;
border-bottom: 1px solid #cccccc;
margin: 0px;
}

/* BEGIN WORDPRESS IMAGES */

.aligncenter, div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}

.alignleft {
float: left;
margin-right: 10px;
}

.alignright {
float: right;
margin-left: 10px;
}

.wp-caption {
border: 1px solid #cccccc;
padding-top: 5px;
text-align: center;
color: #666666;
}

.wp-caption img {
border: 0 none !important;
margin: 0;
padding: 0px 0px 5px 0px !important;
}

.wp-caption p.wp-caption-text {
font-size: 90%;
margin: 0;
padding: 0 5px 5px;
font-style: italic;
}

img.no-border {
border: none !important;
padding: none !important;
}

/* BEGIN BOTTOM LINKS */

#bottomlinks {
width: 998px;
background: url(images/shadow-background-no-line.png) repeat-y;
margin: 0 auto;
height: 197px;
clear: both;
}

#bottomlinks div {
margin-top: 30px;
}

#bottomlinks a {
text-decoration: none;
}

#urgentneeds1 {
background: url(images/urgent-needs-image2.jpg) center no-repeat #cadfee;
width: 179px;
height: 167px;
border-right: 1px solid #bdcee5;
float: left;
margin-left: 19px;
font-size: 110%;
font-weight: bold;
text-align: left;
padding: 0px 30px 0px 29px;
}

a #urgentneeds1, a #upcomingevents1, a #recentupdates1, a #ourheroes1 {
text-decoration: none;
}

#urgentneeds1 p {
margin: 0;
padding: 8px 0px;
}

#urgentneeds1:hover {
background: url(images/urgent-needs-image2-roll.jpg) center no-repeat #005194;
}

#urgentneeds1:hover p, #upcomingevents1:hover p, #recentupdates1:hover p {
color: white;
}

#upcomingevents1 {
width: 179px;
height: 167px;
border-right: 1px solid #bdcee5;
float: left;
font-size: 110%;
font-weight: bold;
text-align: left;
padding: 0px 30px;
background: url(images/upcoming-events-image.jpg) center no-repeat #d4d4e7;
}

#upcomingevents1 p {
margin: 0;
padding: 8px 0px;
color: #5d5c9f;
}

#upcomingevents1:hover {
background: url(images/upcoming-events-image-roll.jpg) center no-repeat #5d5c9f;
}

#recentupdates1 {
width: 179px;
height: 167px;
border-right: 1px solid #bdcee5;
float: left;
font-size: 110%;
font-weight: bold;
text-align: left;
padding: 0px 30px;
background: url(images/recent-updates-image.jpg) center no-repeat #c3d1d1;
}

#recentupdates1 p {
margin: 0;
padding: 8px 0px;
color: #537a7b;
}

#recentupdates1:hover {
background: url(images/recent-updates-image-roll.jpg) center no-repeat #537a7b;
}

#ourheroes1 {
background: url(images/our-heroes-image.jpg) center no-repeat #ffedce;
width: 180px;
height: 167px;
float: left;
font-size: 110%;
font-weight: bold;
text-align: left;
padding: 0px 30px;
border-right: 1px solid #ffedce;
}

#ourheroes1 p {
margin: 0;
padding: 8px 0px;
color: #e58900;
}

#ourheroes1:hover {
background: url(images/our-heroes-image-roll.jpg) center no-repeat #ffd384;
border-right: 1px solid #ffd384;
}

#ourheroes1:hover p {
color: #005194;
}

/* BEGIN SUB PAGE BOTTOM LINKS */

#bottomlinks2 {
width: 998px;
background: url(images/shadow-background-no-line.png) repeat-y;
margin: 0 auto;
height: 80px;
clear: both;
}

#bottomlinks2 div {
margin-top: 30px;
}

#bottomlinks2 a {
text-decoration: none;
}

#urgentneeds2 {
background: center no-repeat #cadfee;
width: 179px;
height: 50px;
border-right: 1px solid #bdcee5;
float: left;
margin-left: 19px;
font-size: 110%;
font-weight: bold;
text-align: left;
padding: 0px 30px 0px 29px;
}

a #urgentneeds2, a #upcomingevents2, a #recentupdates2, a #ourheroes2 {
text-decoration: none;
}

#urgentneeds2 p, #upcomingevents2 p, #recentupdates2 p, #ourheroes2 p {
margin: 0;
padding: 0px;
line-height: 50px;
}

#urgentneeds2:hover {
background: #005194;
}

#urgentneeds2:hover p, #upcomingevents2:hover p, #recentupdates2:hover p {
color: white;
}

#upcomingevents2 {
width: 179px;
height: 50px;
border-right: 1px solid #bdcee5;
float: left;
font-size: 110%;
font-weight: bold;
text-align: left;
padding: 0px 30px;
background: #d4d4e7;
}

#upcomingevents2 p {
margin: 0;
padding: 0px;
line-height: 50px;
color: #5d5c9f;
}

#upcomingevents2:hover {
background: #5d5c9f;
}

#recentupdates2 {
width: 179px;
height: 50px;
border-right: 1px solid #bdcee5;
float: left;
font-size: 110%;
font-weight: bold;
text-align: left;
padding: 0px 30px;
background: #c3d1d1;
}

#recentupdates2 p {
margin: 0;
line-height: 50px;
padding: 0px;
color: #537a7b;
}

#recentupdates2:hover {
background: #537a7b;
}

#ourheroes2 {
background: #ffedce;
width: 180px;
height: 50px;
float: left;
font-size: 110%;
font-weight: bold;
text-align: left;
padding: 0px 30px;
border-right: 1px solid #ffedce;
}

#ourheroes2 p {
margin: 0;
padding: 0px 0px;
line-height: 50px;
color: #e58900;
}

#ourheroes2:hover {
background: #ffd384;
border-right: 1px solid #ffd384;
}

#ourheroes2:hover p {
color: #005194;
}

/* STYLES FOR TOP MENU START HERE */

#menu-background {
width: 998px;
margin: 0 auto;
background: url(images/shadow-background.png) repeat-y;
height: 35px;
}

#menu {
width: 940px;
margin: 0 auto;
height: 35px;
background: url(images/menu-background.jpg) no-repeat;
padding-left: 20px;
}

ul.menu {
list-style: none;
padding: 0;
margin: 0;
float: left;
text-align: left;
z-index: 100;
}

ul.menu li {
float: left;
margin: 0;
padding: 0;
position: relative; /*--Declare X and Y axis base for sub navigation--*/
text-transform: uppercase;
z-index: 100;
}

ul.menu li a {
display: block;
line-height: 35px;
color: white;
text-decoration: none;
float: left;
padding: 0px 8px;
font-size: 90%;
}

ul.menu li a:hover {
background: #706fb0;
color: white;
}

ul.menu li ul.sub-menu {
list-style: none;
position: absolute; /*--Important - Keeps sub-menu from affecting main navigation flow--*/
left: 0; 
top: 35px;
background: #005fac;
margin: 0; 
padding: 0;
display: none;
float: left;
width: 180px;
}

ul.menu li ul.sub-menu li{
margin: 0; 
padding: 0;
clear: both;
text-transform: capitalize;
z-index: 100;
}

html ul.menu li ul.sub-menu li a {
display: block;
width: 164px; /*width of sub menu levels*/
text-decoration: none;
padding: 0px 8px;
border-bottom: 1px solid #004190;
font-size: 90%;
}

/* HOME PAGE SLIDESHOW */

#slideshow {
position:relative;
width: 640px;
height:294px;
}

#slideshow IMG {
position:absolute;
top:0;
left:0;
z-index:8;
opacity:0.0;
}

#slideshow IMG.active {
z-index:10;
opacity:1.0;
}

#slideshow IMG.last-active {
z-index:9;
}

/* 

BEGIN CUSTOM COMMENTS!

*/

ol.commentlist {
margin: 0;
padding: 0;
}

.commentlist li.alt {
background: #fff;
}

.commentlist li.alt cite {
background: url(images/comment-cite-bg-alt.png) no-repeat;
}

.commenttext {
padding: 0px 20px 20px 20px;
}

.commentlist li {
margin-bottom: 5px;
list-style: none;
width: 680px;
background: #ffedce;
}

.commentlist cite {
display: block;
font-weight: bold;
text-transform: uppercase;
font-style: normal;
padding-bottom: 10px;
background: url(images/comment-cite-bg.png) no-repeat;
padding: 20px 20px 0px 20px;
color: #005fac;
}

.commentlist .date {
padding: 3px;
font-size: 80%;
}

li.alt .commenttext {
background: url(images/comments-arrow-alt.png) bottom no-repeat;
}

.commentlist cite img {
float: left;
margin-right: 9px;
}