/* styles.css
	This document contains elements that are used on specific pages.
*/

/* 1.0 Homepage */

    .pg_homepage #mid { height: 635px; }
    
    /* Links for homepage bubbles */
    
    .pg_homepage .jpark, .pg_homepage .porter, .pg_homepage .darkwoods, .pg_homepage .flamingos 
        { z-index: 800; position: absolute; outline: none; }
    .pg_homepage .jpark { top: 70px; left: 5px; position: absolute; width: 175px; height: 160px; }
    .pg_homepage .porter { top: 70px; left: 185px; position: absolute; width: 140px; height: 140px; }
    .pg_homepage .darkwoods { top: 150px; left: 327px; position: absolute; width: 140px; height: 135px; }
    .pg_homepage .flamingos { top: 295px; left: 327px; position: absolute; width: 120px; height: 110px; }
    
    /* Intro text */
    .pg_homepage .intro { float: right; width: 300px; position: relative; z-index: 100}
        .pg_homepage .intro a { border-bottom: 1px solid #EB3824; text-decoration: none; font-weight: bold}
    .pg_homepage h1 { margin-bottom: 10px; margin-top: 15px}
    .pg_homepage .visit { padding-top: 5px; position: relative; z-index: 100;}
        .pg_homepage .visit img { margin: 5px 0px; }
        .pg_homepage .visit a { border: 0px; float: left; width: 100px; position: relative}
        
    /* The pose of Mark */
    .pg_homepage .pose { left: 0px; bottom: 0px; width: 456px; height: 586px;background: url(/images/poses/pose_homepage.png) no-repeat; behavior: url(/App_Css/iepngfix.htc); }
    
    /* Faded microphone image */
    .pg_homepage .microphone { display: none; position: absolute; z-index: 90; right: 0px; bottom: 0px; width: 121px; height: 249px;  background: url(/images/img_microphone.gif) no-repeat; }

/* 2.0 Bio */

    .pg_bio #mid { float: left; width: 779px; padding-bottom: 60px; }
        .pg_bio #mid .left { float: left; }
        .pg_bio #mid .left img { behavior: url(/App_Css/iepngfix.htc); height: 985px; width: 402px;}
        .pg_bio #mid .right { float: left; width: 350px; margin-left: 10px; display: inline; }
		.pg_bio #mid .right p{ margin-bottom: 25px; }

/* 3.0 Reels */

    .pg_reels #mid { float: left; width: 779px; padding-bottom: 75px;  }
    .pg_reels #mid .reel_cont { float: left; display: inline; padding: 10px; width: 779px; margin-left: -10px; margin-right: -10px; border-bottom: 2px solid #1d1a11; }
    .pg_reels #mid .reel { float: left; font-size: 0px; margin-right: -15px; margin-top: 10px }
    .pg_reels #mid .info { float: left; display: inline; width:290px; height: 280px; margin-left: 10px; }
        .pg_reels #mid .m { margin-left: 0px; margin-right: 10px; }
    .pg_reels #mid h2 { margin-left: -4px; }
    .pg_reels #mid .nob { border: 0px; }
    .pg_reels #mid .thumb { float: left; }
    .pg_reels #mid .thumb_info { float:left; margin-right: -10px; letter-spacing: 0px; width: 150px; white-space: nowrap; padding-left: 5px; font-size: 10px; line-height: 13px }
        .pg_reels #mid .thumb_info strong { font-size: 11px; }
    .pg_reels #mid .info p { float: left; width: 290px }
        .pg_reels #mid p.p10 { padding-top: 0px; }
        
    .pg_reels #mid .contL { width: 375px; border-right: 2px solid #000 }
    .pg_reels #mid .contR { width: 360px; margin-left: 10px }    
    .pg_reels #mid .icoL { position:absolute; left: 250px; top: 280px }
    .pg_reels #mid .icoR { position:absolute; left: 250px; top: 240px }
    .pg_reels #mid em { font-style: italic; }
    .pg_reels #mid th { line-height: 1.6em; padding-top: 11px; letter-spacing: 1px; font-weight: bold; text-decoration: underline; }
    .pg_reels #mid td { line-height: 1.5em; letter-spacing: 1px; }
        
/* 4.0 Clips */

    .clips_landing #mid { float: left; width: 779px; }
    
        .clips_landing #mid .categories { margin-top: -30px; margin-right: -10px; float: right; display: inline; position: relative; width: 480px; height: 475px; border-left: 2px solid #1d1a11;}
        .clips_landing #mid ul { padding-top: 2px; cursor: pointer;}
            .clips_landing #mid ul h2 { margin-left: -4px; margin-top: 0px; margin-bottom: 4px;display: block; cursor: pointer}
            .clips_landing #mid ul li { position: relative; height: 31px; padding: 10px 8px; border-bottom: 2px solid #1d1a11; cursor: pointer; white-space: nowrap}
                .clips_landing #mid ul li:hover, .clips_landing #mid ul li.menuhover { background: #54596A; }
                .clips_landing #mid ul li.nob { border: 0px; }
            .clips_landing #mid ul a { position: absolute; left: 0px; top: 0px; width: 480px; height: 51px; cursor: pointer}
            .clips_landing #mid ul p { line-height: 1.2em; cursor: pointer}
            
    /* The pose of Mark */
    .clips_landing .pose { left: 30px; bottom: 0px; width: 264px; height: 382px; background: url(/images/poses/pose_clips.png) no-repeat; behavior: url(/App_Css/iepngfix.htc); }

/* 4.x Clip Category */

    .clips_category #mid { float: left; width: 779px; padding-bottom: 40px;}
    .clips_category #mid ul { margin: 10px; }
    .clips_category #mid li { clear: left; float: left; width: 739px; background: url(/images/ico_fire_gray.gif) no-repeat; padding: 2px 0px 10px 20px; }

/* 4.x.x Clip Specific */

 .clips_specific #mid { float: left; width: 779px;  }
        .clips_specific #mid h2 { margin-left: -2px; }
        .clips_specific #mid .block { float: left; display: inline; }
        .clips_specific #mid .A { position: relative; text-align: center; margin: -10px 0px 0px -10px;  padding:  33px 10px 120px 10px; width: 216px; border-right: 2px solid #1d1a11; }
      
            .clips_specific #mid .A .clips_listing { margin-top: 30px; }
            .clips_specific #mid .A .clips { visibility: hidden; }
            .clips_specific #mid .A .clips li { width: 180px; line-height: 1.4em; background: url(/images/ico_bullet.gif) 0px 5px no-repeat; padding: 0px 0px 10px 20px;  }
            .clips_specific #mid .A .clips li.on { background: url(/images/ico_bullet_blue.gif) 0px 5px no-repeat; }
            .clips_specific #mid .A  .clips_listing .on, .clips_specific #mid .A  .clips_listing .on a{  color: #8ADDF9; text-decoration: none; }

            .clips_specific #mid .A .up, 
            .clips_specific #mid .A .down { position: absolute; display: block; padding: 10px; right: 5px; cursor: pointer; filter: alpha(opacity=100); opacity: 1 }

            .clips_specific #mid .A .disabled { display: none; /*cursor: not-allowed; filter: alpha(opacity=50); opacity: .5*/ }

        .clips_specific #mid .B { margin: -10px -10px 0px -2px; border-left: 2px solid #1d1a11; padding: 10px; width: 541px; padding-bottom: 100px; }
            .clips_specific .B h1 { text-align: right; }
            .clips_specific #mid .B .snippet { margin: 10px 0px; }
            .clips_specific #mid .B .snippet p { font-size: .9em; color: #999; margin-top: 2px; }
        
            .clips_specific #mid .separator { height: 2px; line-height: 2px; font-size: 2px; background: #1d1a11; margin: 10px -10px 10px -10px;}
            
            .clips_specific .B h2 { margin-top: 5px; }
            .clips_specific .B .quote p { background: url(/images/ico_quoteL.gif) left top no-repeat; }
            .clips_specific .B .quote p span { padding: 0px 25px; display: block; line-height: 1.6em; background: url(/images/ico_quoteR.gif) right bottom no-repeat; }

        /* Contact Stuff */
            
            .clips_specific .clip_contact { width:216px; float: left; }
            .clips_specific .clip_list { float: left; margin: 18px 0px 0px 20px;}
            .clips_specific .clip_list ul { list-style: disc; margin-left: 20px; }
            
            .clips_specific #mid .B p { margin-bottom: 5px; }
            .clips_specific #mid .B .txt, .clips_specific #mid .B .txtarea { margin-bottom: 2px; background: #43614B; border: 1px solid #23482D; font: normal 1em arial; color: #9FF0B5; padding: 2px 6px; width: 202px; }
                .clips_specific #mid .B .txtarea { height: 40px; }
       
            .clips_specific .clip_list textarea { margin-bottom: 2px; background: #43614B; border: 1px solid #23482D; font: normal 1em arial; color: #9FF0B5; padding: 2px 6px; width: 250px; height: 85px;  }
            
            
            /* Error styles */
            .clips_specific .txt_ERROR, .clips_specific .txtarea_ERROR { margin-bottom: 2px; font: normal 1em arial;  padding: 2px 6px; width: 202px; background: #FFFFCB; color: #930; border: 1px solid #930; }
                .clips_specific .txtarea_ERROR { height: 40px; }


/* 5.0 Testimonials */

    .pg_testimonials #mid { float: left; width: 779px; min-height: 575px; height: auto!important; height: 575px;}
    .pg_testimonials .listing { display: inline; float: left; width: 679px; padding: 20px 60px; margin: 0px -10px; position: relative;  border-bottom: 2px solid #1D1A11}
    .pg_testimonials a.previous, .pg_testimonials a.next { position: absolute; top: 36px; width: 22px; height: 35px; }
        .pg_testimonials a.previous { left: 10px; cursor: pointer; filter: alpha(opacity=100); opacity: 1 }
        .pg_testimonials a.next { right: 10px; cursor: pointer; filter: alpha(opacity=100); opacity: 1 }
        
        .pg_testimonials .slider li { margin-right: 0px; }
        .pg_testimonials .slider li div { line-height: 1.8em; margin-bottom: 10px; padding-left: 20px; padding-top: 2px; background: url(/images/ico_bullet.gif) 0px 5px no-repeat;  }
        .pg_testimonials .slider a { color: inherit }
        .pg_testimonials .slider a:hover { color: #fff; }
        .pg_testimonials .slider .on a, .pg_testimonials .slider .on { color: #8ADDF9; text-decoration: none; }
        .pg_testimonials .slider li div.on { background: url(/images/ico_bullet_blue.gif) 0px 5px no-repeat;}

        .pg_testimonials .testimonial { display: none; float: right; width: 380px; margin-top: 20px; padding-bottom: 45px; overflow: hidden}
            .pg_testimonials .testimonial h2 { margin-left: -4px }        
            .pg_testimonials .testimonial p { margin: 5px 0px 15px 0px; }
            .pg_testimonials .testimonial .left { float: left; }
            .pg_testimonials .testimonial .right { float: right; line-height: 1.3em}


        .pg_testimonials a.disabled { display: none; /*cursor: not-allowed; filter: alpha(opacity=50); opacity: .5 */}

        
        /* The pose of Mark */
        .pg_testimonials .pose { left: 0px; bottom: 0px; width: 413px; height: 425px; background: url(/images/poses/pose_homage.png) no-repeat; behavior: url(/App_Css/iepngfix.htc); }

/* 6.0 Services */

        .pg_services #mid { float: left; width: 779px; padding-bottom: 0px; }
        .pg_services .block { float: left; width: 368px; display: inline; padding: 10px;  }
        .pg_services .voiceovers { border-right: 2px solid #1d1a11; margin: -10px 0px 0px -10px; border-bottom: 2px solid #1d1a11; height: 220px; }
            .pg_services .voiceovers h1 { text-align: right; }
            .pg_services .voiceovers img { margin: -28px 5px 5px -10px; display: inline; behavior: url(/App_Css/iepngfix.htc); width: 146px; height: 175px; float: left; }
            .pg_services .voiceovers p { }
            
        .pg_services .composing { position: relative; height: 210px; border-bottom: 2px solid #1d1a11; padding-top: 20px; margin-top: -10px; margin-right: -10px; width: 389px; }    
            .pg_services .composing img { position: absolute; width: 239px; height: 239px; behavior: url(/App_Css/iepngfix.htc); top: 0px; left: 0px; }
            .pg_services .composing p { margin-bottom: 0px; }
            .pg_services .composing span { display: block; line-height: 1.6em }
            .pg_services .composing span.hdn { display: none; }
            
            
        .pg_services .script { padding-bottom: 20px; clear: left; float: left; height: 280px; margin-left: -10px; border-right: 2px solid #1d1a11; }
            .pg_services .script p { position: relative;  }
            .pg_services .script img { margin: 12px 5px 0px -10px; bottom: 0px; position: absolute; behavior: url(/App_Css/iepngfix.htc); width: 221px; height: 141px; }
    
        .pg_services .comedy { padding-bottom: 0px; width: 369px; margin-left: -2px; border-left: 2px solid #1d1a11}
        .pg_services .comedy img { position: relative; margin: 20px -30px 0px 0px; display: inline; behavior: url(/App_Css/iepngfix.htc); width: 218px; height: 273px; float: right; }
            .pg_services .comedy p { margin-bottom: 0px; }
/* 7.0 Contact */

        .pg_contact #mid { float: left; width: 779px; padding-bottom: 20px; height: 550px;}
            .pg_contact .pose { left: 25px; top: 0px; width: 336px; height: 574px; background: url(/images/poses/pose_contact.png) no-repeat; behavior: url(/App_Css/iepngfix.htc); }
            .pg_contact .contact { float: right; width: 400px; min-height: 570px; height: auto!important; height: 570px; border-left: 2px solid #1d1a11; padding-left: 10px; margin-top: -10px; padding-top: 10px; }
            .pg_contact .contact p span, .pg_contact .contact p strong { display: block; margin-bottom: 4px; }
    
            .pg_contact #mid .txt, .pg_contact #mid .txtarea { margin-bottom: 2px; background: #5A3F5A; border: 1px solid #352035; font: normal 1em arial; color: #A18FA1; padding: 2px 6px; width: 386px; }
                .pg_contact #mid .txtarea { height: 120px; }
       
            /* Error styles */
            .pg_contact .txt_ERROR, .pg_contact .txtarea_ERROR { margin-bottom: 2px; font: normal 1em arial;  padding: 2px 6px; width: 386px; background: #FFFFCB; color: #930; border: 1px solid #930; }
                .pg_contact .txtarea_ERROR { height: 120px;}