/******************************
 * CSS for PoseTwo.com        *
 * by Josh Cunningham         *
 * joshcanhelp.com            * 
 ******************************/
 
 /* Notes
 
 MaxxMoses heading text is 48pt Cambria at +50 letter spacing (in Adobe Photoshop)
 Images should be under 465px wide to stay within the allotted space
 */   

/** CSS RESET **/


body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul,
ol, li, dl, dt, dd, form, a, fieldset, input, th, td
{
margin: 0; padding: 0; border: 0;
}

h1, h2, h3, h4, h5, h6
{
font-size: 100%;
}

body
{
line-height: 1;
font-size: 88%;
}

h1, h2, h3, h4, h5, h6
{
font-size: 100%;
}

ul, ol
{
list-style: none;
}

img
{
border: 0;
}


/* Main reusables */
    
    h1 {font-size: 2em}
    h2 {font-size: 1.8em}
    h3 {font-size: 1.6em}
    h4 {font-size: 1.4em}
    h5 {font-size: 1.2em; font-weight: bold}
    h6 {font-size: 1.05em; font-weight: bold}
    
    a:hover {color: #e75a0b;}
  
    .center {text-align: center}
    .right {text-align: right;}

/* Structure elements */

html {background: black;}

body {background: url(../images/black_500.jpg) 0 0 repeat-y;}

#out_wrap {height: auto; text-align: center; padding: 0 0 0 15px;}

  #in_wrap {width: 1120px; margin: 0 auto;}
    #in_wrap p {font-size: 0.9em; line-height: 2.1em; }

/* General styles */
        
    .center {margin: 6px auto; }
    .left {float: left; clear: both;}
    .right {float: right; clear: both;}
 
    /* Nav middle */  
    
    #nav_wrap {width: 80px; float: left; background: white url(../images/nav_bg.jpg) 0 0 repeat-y; }
    
      #nav {width: 100%; height: 320px; background: url(../images/nav_sprite_04.jpg); position: relative; margin: 0px 0 0 0;}
      #nav li, #nav a {display: inline; height: 80px; width: 80px; position: absolute; left: 0; }
        
        .about_btn {top: 0; background: url(../images/nav_sprite_04.jpg) 0 0 no-repeat;}
        .about_btn a:hover {background: url(../images/nav_sprite_04.jpg) -80px 0 no-repeat;}
        
        .work_btn {top: 80px; background: url(../images/nav_sprite_04.jpg) 0 -80px no-repeat;}
        .work_btn a:hover {background: url(../images/nav_sprite_04.jpg) -80px -80px no-repeat;} 
        
        .classes_btn {top: 160px; background: url(../images/nav_sprite_04.jpg) 0 -160px no-repeat;}
        .classes_btn a:hover {background: url(../images/nav_sprite_04.jpg) -80px -160px no-repeat;}   
      
        .blog_btn {top: 240px; background: url(../images/nav_sprite_04.jpg) 0 -240px no-repeat;}
        .blog_btn a:hover {background: url(../images/nav_sprite_04.jpg) -80px -240px no-repeat;} 
        
        #contact_btn {top: 320px; background: url(../images/nav_sprite_04.jpg) 0px -320px no-repeat;}
        #contact_btn a, .contact_btn li {height: 40px;}
        #contact_btn a:hover {background: url(../images/nav_sprite_04.jpg) -80px -320px no-repeat;} 
        
        .about_active {background: url(../images/nav_sprite_04.jpg) -80px 0 no-repeat;}
        .classes_active {background: url(../images/nav_sprite_04.jpg) -80px -160px no-repeat;}
        .work_active {background: url(../images/nav_sprite_04.jpg) -80px -80px no-repeat;} 
        
    /* Pose side */
  
      #pose_main {width: 500px; float: left; background-color: black; color: white;}
        #pose_main a {color: #ffb556;}
      
        #pose_head {height: 150px; width: 500px;}
             
          #pose_logo {height: 150px; width: 300px; float: left;}
          #pose_logo a {height: 150px; width: 300px; display: block; background: url(../images/pose/pose2_logo.jpg) 5px 0 no-repeat;}
          #pose_logo a:hover {background: url(../images/pose/pose2_logo.jpg) 5px -150px no-repeat;}
        
        #pose_city {height: 199px; width: 100%; background: black url(../images/pose/citybg_nyc.jpg) 0 0 no-repeat}       
    
    /* Content section - Pose */
        
    #pose_content {width: 540px; height: auto; color: white; font-family: arial, helvetica, verdana, geneva, sans-serif; text-align: left; background-color: black; float: left; padding: 20px 0 75px 0;}
      #pose_content h1, #pose_content h2, #pose_content h3, #pose_content h4, #pose_content h5, #pose_content h6 {letter-spacing: -1px; display: block; clear: both; float: left; margin: 22px 0 10px 15px;}
      #pose_content p, #pose_content ul, #pose_content ol {float: left; clear: both; line-height: 2.1em;}      
      #pose_content p {width: 480px; padding-top: 10px; padding-bottom: 10px;}
      #pose_content a {color: #efefef;}
      #pose_content a:hover {color: #e75a0b;}
      #pose_content h2 {margin: 50px 0 10px 0;}
      
      .section_head_p {margin: 50px 0 0 0;display: block; float: left; clear: both;}

    /* Maxx side */
      
    #maxx_main {width: 530px; float: left; background-color: white; }
    
        #maxx_head {height: 150px; width: 100%;}
        
          #maxx_logo {height: 150px; width: 300px; float: right; margin-right: 50px;}
          #maxx_logo a {height: 150px; width: 300px; display: block; background: url(../images/maxx/maxx_logo.jpg) 0 0 no-repeat;}
          #maxx_logo a:hover {background: url(../images/maxx/maxx_logo.jpg) 0 -150px no-repeat;}
        
        #maxx_city {height: 199px; width: 100%; background: white url(../images/maxx/city-bg-03.jpg) 0 0 no-repeat}

    /* Content section - Maxx */

    #maxx_content {width: 570px; height: auto; color: black; font-family: cambria, palatino, 'Palatino Linotype', serif; text-align: left;  float: left; padding: 20px 0 120px 0;; background: white url(../images/maxx/content_bottom.jpg) 0 100% no-repeat;}
      #maxx_content h1, #maxx_content h2, #maxx_content h3, #maxx_content h4, #maxx_content h5, #maxx_content h6 {float: right; display: block; clear: both; margin: 22px 15px 10px 0;}
      #maxx_content p, #maxx_content ul, #maxx_content ol, #maxx_content img {margin-left: 60px;  margin-right: 50px; clear: both;}
      #maxx_content p {width: 460px; padding-top: 10px; padding-bottom: 10px; line-height: 1.8em;}
      #maxx_content a {color: #393939;}
      #maxx_content a:hover {color: #e75a0b;}
      #maxx_content h2 {margin: 50px 60px 0 0; }
      
      .section_head_m {margin: 50px 0 0 0 ; display: block; float: right; clear: both;}
      
    /* Splash page */
    
    .home_links_p, .home_links_m {font-size: 1.3em; padding: 0;}
    .home_links_p a, .home_links_m a {text-decoration: none;}
    
    .home_links_p {float: right; margin-right: -10px}
    .home_links_m {float: left; margin-left: -10px}
      
    
    /* Body of Work page */

    .work_img_p {margin: 60px 0 0 0;}
    .work_imgs_p {margin: 20px 0 0 0;}
    .art_info_p {width: 200px; margin-top: 10px; padding: 0 0 0 20px; border-left: 1px solid #333; }
    

    .work_img_m {float: right; clear: both;  border: 1px solid #444; margin: 60px 0 0 0 ;}
    .work_imgs_m {float: right; clear: both;  border: 1px solid #444; margin: 20px 0 0 0 ;}
    .art_info_m {width: 200px; margin-top: 10px; padding: 0 20px 0 0 ; border-right: 1px solid #444; float: right; clear: both; text-align: right;}
    
    .work_title {font-size: 1.2em; font-weight: bold; }

    /* Class page */
    
    .class_img {margin: 0 0 15px 40px; float: left; border: solid 1px #555; display: inline;}
    
    /* Footer */
    
    #foot {float: left; clear: both; height: 240px; width: 100%; background: #342F29 url(../images/foot_bg02.jpg) repeat-x;}
    
    #foot-wrap {width: 60%; margin: 0 auto; color: white; padding: 50px 0 20px 0; font-family: helvetica, arial, verdana, sans-serif; letter-spacing: -1px; text-align: center; }
      #foot-wrap span {color: orange; margin: 0 4px; letter-spacing: 0; padding: 40px 0 20px 0; font-size: 1.2em; }
      #foot-wrap p {margin: 8px 0 0 0; }
      #foot-wrap ul {margin: 12px auto; padding: 12px 0 0 0; border-top: #777777 1px solid; font-weight: bold; }
      #foot-wrap li {display: inline; margin: 0 30px 0 0; }
      #foot-wrap li a {color: white; text-decoration: none; }
        #foot-wrap li a:hover {text-decoration: underline; }