/*-----------------------------------------------------------------------------------------------*/
/*                                  Foundation4Life Version 2                                    */
/*-----------------------------------------------------------------------------------------------*/

/*-----------------------------------------------------------------------------------------------*/
/*                      CSS Reset (Modified version of Eric Meyer's CSS Reset)                   */
/*-----------------------------------------------------------------------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, 
big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center,
dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;}
	
body {
    background-color: #0e346b;
    color: #7a7978;
	font-family: 'Trebuchet MS', Helvetica, sans-serif;
	font-size: 13px;
	line-height: 1;}
	
a {
    color: #4dc5e2;
    text-decoration: none;
    cursor: pointer;}

ol, ul {list-style: none;}

blockquote, q {quotes: none;}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;}

:focus {outline: 0;}                    /* remember to define focus styles! */

ins {text-decoration: none;}            /* remember to highlight inserts somehow! */
del {text-decoration: line-through;}

table {                                 /* tables still need 'cellspacing="0"' in the markup */
	border-collapse: collapse;
	border-spacing: 0;}

/*-----------------------------------------------------------------------------------------------*/
/*                                         Global Styles                                         */
/*-----------------------------------------------------------------------------------------------*/
h1 {
    color: #0e346b;
    font-size: 26px;
    font-weight: normal;
    line-height: 1.1em;
    margin-bottom: 34px;
    text-align: center;}
    
h2 {
    font-size: 17px;
    font-weight: bold;
    margin-bottom: 22px;}
    
    h2.bigBlue {  
        color:#0e346b;   
        font-size: 26px;
        font-weight: normal;
        line-height: 1.1em;
        margin: 25px 0 20px 0;}

h3, .h3 {
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 20px;}
    
h4 {
    font-size: 1em;
    font-weight: bold;
    margin-bottom: 20px;}
    
p, label {
    color: #7a7978;
    line-height: 1.3em;
    margin-bottom: 10px;}
    
p.blue {
    color:#0e346b;
    margin-bottom: 1.1em;
    margin-top: 1.1em;}
    
p.bigBlue {  
        color:#0e346b;   
        font-size: 21px;
        line-height: 1.1em;
        margin-bottom: 25px;}

p.bigGray {    
        color: #7a7978;    
        font-size: 18px;
        line-height: 1.1em;}
        
p.signature {margin-top: 20px;}

    .signature img {
        margin-bottom: 3px;
        width: 180px;}
    
sup {
    font-size: .65em;
    vertical-align: text-top;}
    
hr {
    color: #0e346b;
    margin-top: 22px;
    margin-bottom: 22px;}

.floatLeft {float: left;}           /* take these out if they don't ever end up getting used */
.floatRight {float: right;}         /* take these out if they don't ever end up getting used */
.centerText {text-align: center;}   /* take these out if they don't ever end up getting used */

.clear {
	clear: both;
	font-size: 0px;
	height: 0px;
	line-height: 0px;}

/*-----------------------------------------------------------------------------------------------*/
/*                                   Layout Styles (Masterpage)                                  */
/*-----------------------------------------------------------------------------------------------*/
.page {
    background-color: #ffffff;
    margin: 0 auto;
    width: 996px;}

#header {
    background-image: url(../images/Header.png);
    height: 271px;
    position: relative;
    z-index: 46;}
    
#homepageHeader {
    background-image: url(../images/homepageHeader.png);
    height: 271px;}

#logo {float:left;}

/*#language {
    background: url(../images/language-background-2.gif) no-repeat;
    display:block; 
    padding:10px; 
    position: absolute;
    top: 270px;
    width:240px;}*/
    
/*#language {
    background: url(../images/language-background-8.gif) no-repeat; 
    //color:#0e346b;//
    color: #ffffff;
    display:block; 
    height: 38px;
    line-height: 18px;
    left: 30px;
    padding:10px; 
    position: absolute;
    text-align: center;
    //top: 245px;//
    top: 0px;
    width:240px;}*/
    
    #language {
    background: url(../images/language-background-8.gif) no-repeat; 
    /*color:#0e346b;*/
    color: #ffffff;
    display:block; 
    height: 38px;
    line-height: 18px;
    left: 20px;
    padding:10px; 
    position: relative;
    text-align: center;
    /*top: 245px;*/
    /*top: 0px;*/
    top: 10px;
    width:240px;}
    
    #language a {
        /*color:#0e346b;*/
        color: #ffffff;}
        
        #language a:hover {text-decoration: underline;}

#topNav {
    background: url(../images/topNavBg.png) repeat-x;
    float: right;
    height: 30px;
    width: 614px;}

    #topNav #roundedEnd {
        background: url(../images/topNavRoundedEnd.png) no-repeat;
        float:left;
        height: 30px;
        width: 18px;}

    #topNav #menu a {
        color: #0e346b;
        float:left;
        height: 30px;
        line-height: 30px;
        padding-right: 18px;}
        
    #topNav #menu a span {
        display:block;
        padding-left: 18px;}
        
    #topNav #menu a.active, #topNav #menu a:hover {
        background: url(../images/topNavRightTab.png) no-repeat right top;}
               
        #topNav #menu a.active span, #topNav #menu a:hover span {
            background: url(../images/topNavLeftTab.png) no-repeat left top;}            
    
#footer {height: 46px;}

    #footer #leftCorner {
        background: url(../images/footerLeftCorner.png) no-repeat left bottom;
        float:left;
        height: 46px;
        width: 38px;}
        
    #footer #footerNav {
        background: url(../images/footerNavBg.png) repeat-x;
        float: right;
        height: 31px;
        width: 332px;}
        
        #footer #footerNav #footerRoundedEnd {
            background: url(../images/footerNavRoundedEnd.png) no-repeat top;
            float:left;
            height: 31px;
            width: 18px;}
            
            #footer #footerNav #footerMenu a {
                color: #0e346b;
                float:left;
                height: 31px;
                line-height: 31px;
                padding-right: 16px;}
            
                #footer #footerNav #footerMenu a span {
                    display:block;
                    padding-left: 16px;}
                    
                #footerNav #footerMenu a.active span, #footerNav #footerMenu a:hover span {
                    background: url(../images/footerNavLeftTab.png) no-repeat left top;}
                    
                #footerNav #footerMenu a.active, #footerNav #footerMenu a:hover {
                    background: url(../images/footerNavRightTab.png) no-repeat right top;}
                      
    #footer #copyright {
        background: #8ed2c5;
        color: #ffffff;
        float: right;
        font-size:11px;
        height: 15px;
        line-height: 14px;
        text-align: center;
        width: 920px;}
    
    #footer #rightCorner {        
        background: url(../images/footerRightCorner.png) no-repeat right bottom;
        float:right;
        height: 46px;
        width: 38px;}
        
/*-----------------------------------------------------------------------------------------------*/
/*                                         Homepage Styles                                       */
/*-----------------------------------------------------------------------------------------------*/

#hpMainImage {
    float: left;
    height: 546px;
    margin-top: -200px;
    margin-bottom: -31px !important;
    margin-bottom: -37px; /* for IE 6 */
    position: relative;
    width: 651px;
    z-index: 48;}
    
#hpMainContent {
    float: right;
    left: -60px;
    position: relative;
    top: -25px;
    width: 345px;
    z-index: 49;}
    
    #hpMainContent h1 {
        font-size: 26px;
        line-height: 1.1em;
        margin-bottom: 18px;
        text-align:left;}
        
    #hpMainContent p {
        line-height: 1.1em;
        margin-bottom: 10px;}
        
    #hpMainContent sup {
        font-size: .65em;
        vertical-align: text-top;}
    
/*-----------------------------------------------------------------------------------------------*/
/*                           Styles for pages that contain side content                          */
/*-----------------------------------------------------------------------------------------------*/

#sideContent {
    float: left;
    margin-top: -60px;
    width: 281px;}
    
    #sideContent img {
        margin-left: 44px;
        margin-bottom: 20px;
    }
    
#mainContent {
    float: right;
    margin-bottom: 25px;
    margin-top: -60px;
    padding-left: 38px;
    padding-right: 38px;    
    width: 639px;}
    
#wideContent {
    margin-left: 50px;
    margin-right: 50px;
    width: 896px;}

/*-----------------------------------------------------------------------------------------------*/
/*                                     Building a Difference                                     */
/*-----------------------------------------------------------------------------------------------*/

#sideContent ul {
    margin-top: 60px;
    padding-left: 52px;}
    
#sideContent ul li {margin-bottom: 1px;}

    #sideContent ul li a {
     background: url(../images/sideNavBgOver.png) repeat-x;
     color: #0e346b;
     display: block;
     font-size: 17px;
     height: 32px;
     line-height: 32px;
     width: 229px;
    }
    
        #sideContent ul li a.active, #sideContent ul li a:hover {
            background: url(../images/sideNavBgOver-4.png);}
            
        #sideContent ul li a span {
            margin-left: 10px;
            margin-right: 18px;
            padding-left: 35px;
            width: 25px;}
            
                #sideContent ul li a span.australia {background: url(../images/flags/australia.jpg) no-repeat left center;}
                #sideContent ul li a span.chile {background: url(../images/flags/chile.jpg) no-repeat left center;}
                #sideContent ul li a span.colombia {background: url(../images/flags/colombia.jpg) no-repeat left center;}
                #sideContent ul li a span.dominicanrepublic {background: url(../images/flags/dominicanrepublic.jpg) no-repeat left center;}
                #sideContent ul li a span.fiji {background: url(../images/flags/fiji.jpg) no-repeat left center;}
                #sideContent ul li a span.haiti {background: url(../images/flags/haiti.jpg) no-repeat left center;}
                #sideContent ul li a span.hongkong {background: url(../images/flags/hongkong.jpg) no-repeat left center;}
                #sideContent ul li a span.india {background: url(../images/flags/india.jpg) no-repeat left center;}
                #sideContent ul li a span.japan {background: url(../images/flags/japan.jpg) no-repeat left center;}
                #sideContent ul li a span.korea {background: url(../images/flags/korea.jpg) no-repeat left center;}
                #sideContent ul li a span.malaysia {background: url(../images/flags/malaysia.jpg) no-repeat left center;}
                #sideContent ul li a span.mexico {background: url(../images/flags/mexico.jpg) no-repeat left center;}
                #sideContent ul li a span.newzealand {background: url(../images/flags/newzealand.jpg) no-repeat left center;}
                #sideContent ul li a span.singapore {background: url(../images/flags/singapore.jpg) no-repeat left center;}
                #sideContent ul li a span.southafrica {background: url(../images/flags/southafrica.jpg) no-repeat left center;}
                #sideContent ul li a span.spain {background: url(../images/flags/spain.jpg) no-repeat left center;}
                #sideContent ul li a span.taiwan {background: url(../images/flags/taiwan.jpg) no-repeat left center;}
                #sideContent ul li a span.thailand {background: url(../images/flags/thailand.png) no-repeat left center;}
                #sideContent ul li a span.unitedstates {background: url(../images/flags/unitedstates.jpg) no-repeat left center;}
                #sideContent ul li a span.otherprojects {background: url(../images/flags/otherprojects.png) no-repeat left center;}
                #sideContent ul li a span.peru {background: url(../images/flags/peru.png) no-repeat left center;}
				#sideContent ul li a span.philippines {background: url(../images/flags/philippines.png) no-repeat left center;}
                        
    a.news {
        background: url(../images/building-a-difference/news.jpg) no-repeat top center;
        cursor: pointer;
        margin-left: 20px;
        margin-right: 20px;
        padding-top: 26px;}
    
        a.news span {cursor: pointer;}
        
    a.photos {
        background: url(../images/building-a-difference/photos.jpg) no-repeat top center;
        cursor: pointer;
        margin-left: 20px;
        margin-right: 20px;
        padding-top: 26px;}
        
        a.photos span {cursor: pointer;}
        
    a.video {
        background: url(../images/building-a-difference/videos.jpg) no-repeat top center;
        cursor: pointer;
        margin-left: 20px;
        margin-right: 20px;
        padding-top: 26px;}
        
        a.video span {cursor: pointer;}
        
    .container a.active, a.news:hover, a.photos:hover, a.video:hover {text-decoration: underline;}
        

.building-a-difference .container {padding-bottom: 30px;}
       
    .building-a-difference .container div.news {margin-top: 17px;}

        .building-a-difference .container div.news img.newsImage {
            float: left;
            margin-right: 12px;
            width: 140px;}
            
        img.tall-newsImage {
            float: left;
            margin-right: 12px;
            height: 93px;}
            
        a.pdf {
            background: url(../images/building-a-difference/PDF.jpg) no-repeat left top;
            margin-right: 55px;
            padding-left: 22px;}
            
    .building-a-difference .container div.photos {margin-top: 17px;}

        .building-a-difference .container div.photos img.photosImage {
            float:left;
            margin-right:17px;
            margin-bottom:17px;}

    .building-a-difference .container div.video {
        margin-top: 17px;
        padding-bottom: 20px;}
        
        .building-a-difference .container div.video img.videoImage {
            float:left;
            margin-right:17px;
            margin-bottom:17px;}

    .building-a-difference .container div.tab {display: none;}

#mainContent img.newsImage {float: left; margin-right: 12px; width: 140px;}
        
#mainContent a.highslide img.photosImage {float:left; margin-right: 17px; margin-bottom: 17px; margin-top: 17px; height: 70px;}
#mainContent a.highslide img.photosImage {float:left; margin-right: 17px; margin-bottom: 17px; margin-top: 17px; height: 70px;}

.my-highslide-content { margin-top: 15px; }

.highslide-close {
    float:right;
    margin-bottom:10px;}
       
       
/*-----------------------------------------------------------------------------------------------*/
/*                                            About                                              */
/*-----------------------------------------------------------------------------------------------*/

img.bianca {
    float: left;
    padding-bottom: 3px;
    padding-right: 11px;}
    
    
/*-----------------------------------------------------------------------------------------------*/
/*                                          Lights 4Life                                         */
/*-----------------------------------------------------------------------------------------------*/

.lights4life .container a.tab {
    background: url(../images/lights4lifeRightTab.png) no-repeat right top;
    color: #8ed2c5;
    cursor: pointer;
    float:left;
    font-size: 22px;
    font-weight: bold;
    height: 38px;
    line-height: 38px;
    margin-right: 3px;
    padding-right: 26px;
    text-decoration: none;}
        
    .lights4life .container a.tab span {
        background: url(../images/lights4lifeLeftTab.png) no-repeat left top;
        display:block;
        padding-left: 26px;}
    
    .lights4life .container a.active {color: #0e346b;}
    
    .lights4life .container a.active, .lights4life .container a.tab:hover {
        background: url(../images/lights4lifeRightTabOver.png) no-repeat right top;}
               
        .lights4life .container a.active span, .lights4life .container a.tab:hover span {
            background: url(../images/lights4lifeLeftTabOver.png) no-repeat left top;}
            
.lights4life .container p {padding: 13px;}
.lights4life .container div.lights-4life {float:left; width: 448px;}
.lights4life .container .lights-4life ul {margin: 0 auto; width: 225px;}
.lights4life .container .lights-4life ul li {line-height: 1.5em;}
/*.lights4life .container img {margin-bottom: 46px; width: 896px;}*/


.lights4life .container .atTheHeartOfIt div.video {margin: 0 auto 30px auto; width: 500px;}
.lights4life .container .atTheHeartOfIt img {float: left; width: 124px; margin: 10px 15px 10px 10px; padding: 6px; border: solid 1px #7a7978; }
.lights4life .container .atTheHeartOfIt div.winner {float: left; width: 446px;}
.lights4life .container .atTheHeartOfIt div.winner div {margin: 10px;}
.lights4life .container .atTheHeartOfIt div.winner span {line-height: 1.4em;}
.lights4life .container .atTheHeartOfIt div.winner p {margin: 12px 15px 0 20px; padding: 0;}

.lights4life div.tab {display: none;}

#nominationButton {
    margin: 0 auto;
    width: 300px;}
    
.nominationForm {display: none; padding-top: 10px;}

    .nominationForm #leftColumn {float: left; margin-right: 25px; width: 320px;}
    .nominationForm #rightColumn {float: left; width: 320px;}
    

    .nominationForm .formDiv { padding-bottom: 20px; }
        
        .nominationForm .formDiv input { width: 320px; }
        .nominationForm .formDivWide textarea { width: 665px; height: 80px; margin-top: 5px;}
        
        /*#nominationForm .formDiv label { padding-bottom: 10px; }*/
        
    .ui-dialog .ui-state-error { padding: .3em; }
    .validateTips { border: 1px solid transparent; padding: 0.3em;}


/*-----------------------------------------------------------------------------------------------*/
/*                                          Media Center                                         */
/*-----------------------------------------------------------------------------------------------*/

.toggle div.tab {display:none; padding: 0 10px; margin-bottom: 15px;}
.toggle div.active {display:block;}

.toggle h4 {padding-left: 10px; margin: 15px 0 10px 0;}

.toggle ul {padding-left: 25px;}
    .toggle li {line-height: 1.5em;}

.toggle div a.highslide img.tall-newsImage {
    margin: 5px;
    width: 140px;}

p.bullet {
    background: url(../images/sun-small.gif) no-repeat top left;
    padding-left: 30px;
    margin-top: 5px;
    margin-left: 5px;}
    
.media-center p.bullet {
    background: url(../images/sun-small.gif) no-repeat left;
    line-height: 2em;
    height: 2em;
    padding-left: 30px;
    margin-bottom: 5px;}

/* OVERIDDEN JQUERY UI CLASSES
-------------------------------------- */
/*.ui-widget-header { border: 1px solid #aaaaaa; background: #cccccc url(crm-ui/images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x; color: #222222; font-weight: bold; }*/
/*.ui-widget-header { background: #003768 url(crm-ui/images/ui-bg_highlight-soft_75_003768_1x100.png) 50% 50% repeat-x; color: #ffffff; font-weight: bold; }*/

/*.ui-widget-header {background: none; }*/


/* Overlays
----------------------------------*/
.ui-widget-overlay {background: #000000 50% 50% repeat-x; opacity: .30; filter: Alpha(Opacity=50);}

/* Dialog
----------------------------------*/
.ui-dialog { padding: 0; }
.ui-dialog .ui-dialog-titlebar { padding: .5em 0 .5em .5em; background: none; border: none; background-color: #0e346b; }
.ui-dialog .ui-dialog-titlebar-close { background-color: #dddddd; }
.ui-dialog .ui-dialog-title { margin: 0 16px 0 0; font-size: 1em; color: #ffffff;} 

.ui-dialog .ui-dialog-content { position: relative; border: 0; padding: 1.2em; background: none; overflow: auto; zoom: 1; }
.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; }
.ui-dialog .ui-dialog-buttonpane button { float: right; margin: .5em .4em .5em 0; cursor: pointer; padding: .2em .6em .3em .6em; line-height: 1.4em; width:auto; overflow:visible; }
.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }


/* ------------------------------------ jQuery Slider (not currently used) ------------------------------------------ */
        
    /* #scrollbar {
        bottom: 8px;
        left: 48px;
        margin: 0 auto;
        position: absolute;
        width: 800px;} */
        
   /*.scrollbar {
        top: 21px;
        margin: 0 auto;
        position: relative;
        width: 800px;}*/