﻿/* styles.css
	This document contains elements that are used on specific pages.
*/

/* Special Navigation Considerations */

    #top ul .donate_bg { background: #FF8900 url(/App_Images/en-us/bg_btndonate.gif) bottom no-repeat;}

/* Banners */

	#mid .banners .orange { background: url(/App_Images/en-us/banner_Orange.gif) no-repeat; height: 73px; }
	#mid .banners .blue { background: url(/App_Images/en-us/banner_Blue.gif) no-repeat; height: 85px; }
	#mid .banners .green { background: url(/App_Images/en-us/banner_Green.gif) no-repeat; height: 82px; }
	#mid .banners .tan { background: url(/App_Images/en-us/banner_Tan.gif) no-repeat; height: 82px; }


/* 1.0 Homepage */

 	.pg_homepage #invader { z-index: 2000; position: absolute; top: 120px; left: 150px; z-index: 1001;} 
    .pg_homepage #invader .main_link { display: block; cursor: pointer; background: url(/App_Images/en-us/bg_invader_Soraya.png) no-repeat; width: 640px; height: 411px}
    .pg_homepage #invader .close_link { position: absolute; top: 8px; right: 8px; z-index: 1002; width: 25px; height: 25px; background: #fff; filter: alpha(opacity=0); opacity:0}

    .pg_homepage .colA { float: left; width: 480px; background: #dbd6d2; padding: 14px}
    .pg_homepage .colB { float: right; width: 376px; position: relative; }
        .pg_homepage .colB h1 { position: absolute; width: 346px; top: 10px; left: 0px;background: #24547d; padding: 0px 15px }
    
    #mid .spacer { height: 20px; width: 900px; float: left; }
    .pg_homepage .colC { clear: left; float: left; width: 276px; margin: 0px 15px 0px 12px; display: inline }
    .pg_homepage .colC li { width: 261px; height: 42px; margin-bottom: 15px}
        .pg_homepage .colC li.a { background: url(/App_Images/en-us/bigbtn_Home1.gif) no-repeat; }
        .pg_homepage .colC li.b { background: url(/App_Images/en-us/bigbtn_Home2.gif) no-repeat; }
        .pg_homepage .colC li.c { background: url(/App_Images/en-us/bigbtn_Home3.gif) no-repeat; }

    .pg_homepage .colD { float: left; width: 296px; margin-right: 15px; display: inline; position: relative;}
        .pg_homepage .colD h2 { margin-bottom: 10px; }
        .pg_homepage .colD li { float: left; }
        .pg_homepage .colD .image { float: left; width: 97px }
        
        .pg_homepage .colD .info { float: right; width: 189px}
        .pg_homepage #mid .colD .info h3 { margin-top: 2px; margin-left: -4px; }
        .pg_homepage .colD .info .r { display: block; text-align: right; line-height: 16px; }
        .pg_homepage .colD .buttons { position: absolute; top: 0px; width: 155px; z-index: 10; right: 0px;}
            .pg_homepage .colD .buttons a { float: right; margin-right: 2px;}
            .pg_homepage .colD .buttons .arrow { width: 26px; height: 22px;}
            .pg_homepage #mid .all { float: left; font-size: 11px; color: #666; display: inline; margin-right: 15px; padding-top: 7px; }
            .pg_homepage #mid .all:hover { color: #000; }
            



/* 2.0 Movies */

	/* Landing Page */
    .pg_movies .left_side div.a,.pg_movies .left_side div.b,.pg_movies .left_side div.c { position: relative; margin-bottom: 15px; float: left; margin-right: 10px; width: 191px; display: inline;}
    .pg_movies .left_side div.a p,.pg_movies .left_side div.b p,.pg_movies .left_side div.c p { color: #747474; line-height: 18px; margin: 10px 4px; }
    .pg_movies .left_side div.c {  margin-right:0px}
	
    .pg_movies #mid .topheading {  width: 916px; padding-left: 18px; }
	.pg_movies #mid h1.landing { padding-left: 0px; width: 934px; }
    .pg_movies .topheading span { float: left; margin-right: 20px; display: inline; height: 28px;}
    .pg_movies .topheading span.a { background: url(/App_Images/en-us/bigbtn_Movies1.gif) no-repeat; width: 122px;}
    .pg_movies .topheading span.b { background: url(/App_Images/en-us/bigbtn_Movies2.gif) no-repeat; width: 186px; }
    .pg_movies .topheading span.c { background: url(/App_Images/en-us/bigbtn_Movies3.gif) no-repeat; width: 102px;}

	.pg_movies .left_side .image { float: left; width: 191px; }
	.pg_movies .left_side .h { height: 312px; }
	.pg_movies .left_side .info { float: left; display: inline; position: relative; width: 171px; margin: -35px 10px 10px;}
	.pg_movies #mid .left_side .info h3 { margin-top: 2px; margin-left: -4px; }
	.pg_movies .left_side .info .r { display: block; text-align: right; line-height: 16px; }
	.pg_movies .left_side .how { padding: 10px; background: #e8e8e8; }
	.pg_movies .left_side .how p { margin-bottom: 0px; }
	.pg_movies #mid .left_side .how .tanbutton1 { float: right; }

    /* Movie Detail */
    
	.pg_movies #mid h1.details { width: 916px; padding: 12px 0px 10px 18px; color: #000; font-size: 10px}
	.pg_movies h1.details a { font-size: 10px; color: #666; }
	.pg_movies h1.details a:hover { color: #000; }
		
	.pg_movies .details_left { float: left; width: 254px; margin-right: 20px; }
		.pg_movies .details_left .image { float: left; width: 254px }
		.pg_movies .details_left .hdnlink { display: none; }
		.pg_movies .details_left li { width: 78px; height: 27px; margin-bottom: 15px}
			.pg_movies .details_left li.a { float: left; background: url(/App_Images/en-us/bigbtn_Prev.gif) no-repeat; }
			.pg_movies .details_left li.b { float: right; background: url(/App_Images/en-us/bigbtn_Next.gif) no-repeat; }
		.pg_movies .details_left .gallery, .pg_movies .details_left .website, .pg_movies .details_left .trailer { width: 181px; float: left; margin-left: 35px; display: inline}
			.pg_movies .details_left .gallery { margin-bottom: 10px; }
			.pg_movies .details_left .website { margin-bottom: 10px; }

	.pg_movies .details_center { float: left; width: 311px}
	.pg_movies #mid .details_center h3, .pg_movies #mid .details_center h4 { margin-left: -4px; }
	.pg_movies #mid .details_center h4 { margin-bottom: 10px; }
	.pg_movies .details_center dl { float: left; margin-bottom: 15px; }
	.pg_movies .details_center dt { float: left; margin-right: 15px; display: inline; }
	.pg_movies .details_center dd { float: left; width: 238px; }
	.pg_movies .details_center dd h5 { font-weight: bold; font-size: 12px; color: #000; margin-bottom: 4px; }
	.pg_movies .details_center dd h6 { font-weight: normal; font-size: 11px; color: #7c7c7c; margin-bottom: 4px; }
	.pg_movies .details_center dd p span { white-space: nowrap; }
	.pg_movies .details_center dd p a { color: #666; }
	.pg_movies .details_center dd p a:hover { color: #000; }

/* 3.0 Donate */

	/* Step 1 */
    .pg_donate .step1 #donate_other { display: none; clear: left; float: left; margin-top: -2px}
    .pg_donate .step1 .amount p { margin-bottom: 3px; }
    .pg_donate .step1 .dollar { float: left; }
    .pg_donate .step1 .bottomarea { float: left; width: 599px; margin-top: 20px; }
    .pg_donate .step1 .p_reoccur { float: left; width: 370px; margin-right 20px; }
    .pg_donate .step1 .right { float: right; width: 200px; }
    .pg_donate .step1 .paypal { margin-top: -65px; float: right; }
    .pg_donate #mid .step1 .btn { float: right; }


	/* Step 2*/
	.pg_donate .step2 { position: relative;  }
    .pg_donate .step2 h3 { float: left; width: 599px; }
    .pg_donate .step2 .form p { clear: left; float: left; width 599px; white-space: nowrap}
    .pg_donate .step2 .form { margin-top: -20px; float: left; }
    .pg_donate #mid .form .req { width: 175px; margin-top: 5px; text-align: right; float: right; z-index: 5; position: relative}
    .pg_donate .step2 .paypal { float: right; margin-top: -51px  }
    .pg_donate .step2 .paypal img { display: block; float: right; margin-bottom: -10px}
    .pg_donate .step2 .paypal .txt { clear: right; float: right; }
    .pg_donate #mid .step2 .form #error { display: none; clear: both; float: left; padding: 10px 0px 6px; width: 400px;}
    .pg_donate .step2 .form .slash { float:left;padding: 7px 10px 0px }
    .pg_donate .step2 table { width: 599px; float: left; }
    .pg_donate .step2 td { vertical-align: top; }
        .pg_donate .step2 td.ptop3 { padding-top: 3px  }
        .pg_donate .step2 td.pbtm3 { padding-bottom: 3px  }
        .pg_donate .step2 td.ptop6 { padding-top: 6px  }
        .pg_donate .step2 td.pbtm6 { padding-bottom: 6px  }

	.pg_donate .step2 .sm { font-size: 11px; display: block; }
    .pg_donate #mid .step2 .bluebutton1 { float: right; }

	/* Step 3*/
	.pg_donate #mid .step3 .form { margin-top: -8px; }
    .pg_donate #mid .step3 .form .txt, #mid .step3 .form .txtarea, #mid .step3 .form .select { color: #808080; background: #bfcfd9; }


/* 4.0 Movements */
    
	.pg_movements .left_side .movement { float: left; width: 549px; height: 225px}
	.pg_movements .left_side .image { float: left; width: 203px }
	.pg_movements .left_side .info { float: right; width: 326px}
	.pg_movements #mid .left_side .info h3 { margin-top: 2px; margin-left: -4px; }
	.pg_movements .left_side .info .r { display: block; text-align: right; line-height: 16px; }
	.pg_movements .left_side .how { padding: 10px; background: #e8e8e8; }
	.pg_movements .left_side .how p { margin-bottom: 0px; }
	.pg_movements #mid .left_side .how .tanbutton1 { float: right; }
    
    
    /* Movement Detail */
    
	.pg_movements #mid h1.details { width: 916px; padding: 12px 0px 10px 18px; color: #000; font-size: 10px}
	.pg_movements h1.details a { font-size: 10px; color: #666; }
	.pg_movements h1.details a:hover { color: #000; }
		
	.pg_movements .details_left { float: left; width: 203px; margin-right: 20px; }
		.pg_movements .details_left .image { float: left; width: 203px }
		.pg_movements .details_left .hdnlink { display: none; }
		.pg_movements .details_left li { width: 78px; height: 27px; margin-bottom: 15px}
			.pg_movements .details_left li.a { float: left; background: url(/App_Images/en-us/bigbtn_Prev.gif) no-repeat; }
			.pg_movements .details_left li.b { float: right; background: url(/App_Images/en-us/bigbtn_Next.gif) no-repeat; }
		.pg_movements .details_left .gallery, .pg_movements .details_left .website { width: 181px; float: left; margin-left: 10px; display: inline}
			.pg_movements .details_left .gallery { margin-bottom: 10px; }

	.pg_movements .details_center { float: left; width: 366px}
	.pg_movements #mid .details_center h3, .pg_movements #mid .details_center h4 { margin-left: -4px; }
	.pg_movements #mid .details_center h4 { margin-bottom: 10px; }
	.pg_movements .details_center dl { float: left; margin-bottom: 15px; }
	.pg_movements .details_center dt { float: left; margin-right: 15px; display: inline; }
	.pg_movements .details_center dd { float: left; width: 293px; }
	.pg_movements .details_center dd h5 { font-weight: bold; font-size: 12px; color: #000; margin-bottom: 4px; }
	.pg_movements .details_center dd h6 { font-weight: normal; font-size: 11px; color: #7c7c7c; margin-bottom: 4px; }
	.pg_movements .details_center dd p span { white-space: nowrap; }
	.pg_movements .details_center dd p a { color: #666; }
	.pg_movements .details_center dd p a:hover { color: #000; }

    
/* 5.0 Volunteer */

    .pg_volunteer #mid h3 { margin: -5px 0px 10px}
	.pg_volunteer #mid .form .info { width: 460px; }
    .pg_volunteer #mid .form .types { float: left; width: 599px; margin-bottom: 10px;  }
    .pg_volunteer #mid .form .types p { float: left; width: 599px; margin-bottom: 4px; }
    .pg_volunteer #mid .form .types li { float: left; width: 200px; margin-left: 5px; }
    .pg_volunteer #mid .form .types li .check { float: left; width: 20px; }
    .pg_volunteer #mid .form .types li .lbl { padding-top: 2px; clear: none; float: left; width: 150px; cursor: pointer; }
/* 6.0 Contact */


   
/* News Details Pages */

    #mid .news .image { float: left; width: 60px; margin-right: 10px; display: inline; }
    #mid .news h3 { float: left; width: 500px; margin-top: 15px}
    #mid .news h4, #mid .news h5, #mid .news h6, #mid .news p { float: left; width: 599px;  }
    #mid .news h4 { margin-left: -3px; }
	#mid .news h5 { font-weight: bold; font-size: 14px; color: #000; margin-bottom: 4px; }
	#mid .news h6 { font-weight: normal; font-size: 12px; color: #7c7c7c; margin-bottom: 4px; }
	#mid .news p img { float: right; width: 200px; margin: 0px 0px 8px 8px; background: #fff; padding: 4px; border: 1px solid #ccc  }


