/*
Theme Name: Peter J Harrison
Theme URI: http://peterjharrison.me/
Description: New Design For Peter J Harrison
Version: 3.0
Author: Peter J Harrison
Author URI: http://peterjharrison.me/
Tags: red, custom header, fixed width, two columns, widgets

*/

/*********************************************************************************************************/
/* Global Settings */

* { padding: 0; margin: 0; font-family: Tahoma, Geneva, sans-serif; }

body { background: url(images/body_bg2.jpg) top left; }

#wrap { padding: 20px 0; }

#container { position: relative; width: 940px; margin: 0 auto; background: #FFF; border: 20px solid #FFF; }

.hidden_content { display: none; }

/*********************************************************************************************************/
/* Header */

#header { position: relative; height: 285px; }

/*********************************************************************************************************/
/* Menu */

  #header #menu { position: absolute; top: 0; left: 0; width: 940px; height: 34px; background: url(images/menu_bg.jpg) repeat-x top left; }

    #header #menu ul { list-style: none; }

      #header #menu ul li { float: left; line-height: 2em; border-right: 1px solid #000; }
      
        #header #menu ul li a { font-size: 12px; color: #FFF; text-decoration: none; text-transform: uppercase; display: block; padding: 0 30px; }
  
        #header #menu ul li a:hover { background: #000; }

/*********************************************************************************************************/
/* Header Image */

  #header #headerimg { position: absolute; top: 34px; left: 0; width: 940px; height: 189px; background: url(images/header_bg_new.jpg) no-repeat top left; }
  
    #header #headerimg h1, #headerimg .description { display: none; }
  
/*********************************************************************************************************/
/* Category Menu */
  
  #header .cat_menu { position: absolute; top: 223px; left: 0; width: 940px; height: 46px; background: url(images/cat_bg.jpg) repeat-x top left; }
  
    #header .cat_menu ul { list-style: none; }
    
      #header .cat_menu ul li { float: left; line-height: 3.2em; font-size: 14px; color: #333; padding: 0 30px; }
      
        #header .cat_menu ul li a { color: #333; text-decoration: none; }
        
        #header .cat_menu ul li a:hover { text-decoration: underline; }

/*********************************************************************************************************/
/* Search Form */

  #header #searchform { position: absolute; top: 0; right: 0; }
  
    #header #searchform label { display: none; }
    
    #header #searchform #searchsubmit { display: none; }
    
    #header #searchform input { padding: 3px; margin: 4px 10px 0 0; }

/*********************************************************************************************************/
/* Sidebar */

#sidebar { float: right; width: 440px; }

  #sidebar #side_right { float: right; }

  #sidebar .holder { margin: 0 0 20px 0; }
    
      #sidebar .holder .sidebar_footer { background: #343434; text-align: center; font-size: 12px; padding: 5px; }
      
        #sidebar .holder .sidebar_footer a { color: #FFF; }
  
  #sidebar .clear { clear: left; }

  #sidebar .wide { width: 436px; background: #F7F7F7; border: 2px solid #D7D7D7; padding: 0 0 10px 0; }
  
    #sidebar .wide h2 { font-size: 20px; font-weight: normal; margin: 15px; }
    
    #sidebar .wide p { font-size: 14px; color: #444; line-height: 1.5em; margin: 5px 15px; }
  
  #sidebar .narrow { width: 210px; }
  
      #sidebar .narrow h2 { font-size: 16px; font-weight: normal; margin: 0 0 10px 0; line-height: 2em; }
      
      #sidebar .narrow ul { list-style: none; }
      
        #sidebar .narrow ul li { background: #F7F7F7; border-bottom: 2px solid #D7D7D7; padding: 10px; font-size: 14px; color: #444; line-height: 1.5em; }
        
        #sidebar .narrow ul li a { color: #444; text-decoration: none; }
        
        #sidebar .narrow ul li a:hover { text-decoration: underline; }
        
        #sidebar .narrow ul li .contact_ids li { border: none; font-size: 12px; text-align: right; padding: 5px 0 0 0; }

/*********************************************************************************************************/
/* Sidebar About Me */

  #sidebar #aboutme #profile_img { float: right; margin: 15px 10px 10px 10px; position: relative; }
  
	  #sidebar #aboutme #profile_img span { background: url(images/sprite.png) no-repeat -195px 0px; display: block; height: 85px; position: absolute; right: 0; top: 0; width: 85px; }
  
  #sidebar #aboutme .show_content, #sidebar #aboutme .hide_content { font-size: 14px; color: #4E95B3; text-decoration: none; margin: 5px 15px; }
  
  #sidebar #aboutme .show_content:hover, #sidebar #aboutme .hide_content:hover { text-decoration: underline; }
  
/*********************************************************************************************************/
/* Sidebar Freelance */

  #sidebar #freelance p { background: url(images/freelance.png) no-repeat top left; text-indent: -99999px; overflow: hidden; direction: ltr; width: 440px; height: 77px; margin-bottom: 20px; } 

/*********************************************************************************************************/
/* Sidebar Twitter */

  #sidebar #twitter h2 span { display: block; width: 32px; height: 32px; float: left; background: url(images/sprite.png) no-repeat 0 0; margin-right: 10px; }

  #sidebar #twitter ul li { font-size: 12px; }
  
    #sidebar #twitter ul li a { color: #4E95B3; }
    
    #sidebar #twitter .sidebar_footer a { color: #FFF; }
    
    #sidebar #twitter ul .tweet small { display: block; }
    
      #sidebar #twitter ul .tweet small span { text-transform: lowercase; }
      
/*********************************************************************************************************/
/* Sidebar Xbox Live */

  #sidebar #xboxlive h2 { font-size: 16px; font-weight: normal; margin: 0 0 10px 0; line-height: 2em; background: url(images/xboxlive_header.jpg) no-repeat left center; padding: 0 0 0 36px; }

/*********************************************************************************************************/
/* Sidebar Pages */

  #sidebar #pages h2 span { display: block; width: 32px; height: 32px; float: left; background: url(images/sprite.png) no-repeat -128px 0; margin-right: 10px; }
  
/*********************************************************************************************************/
/* Sidebar Categories */

  #sidebar #categories h2 span { display: block; width: 32px; height: 32px; float: left; background: url(images/sprite.png) no-repeat -96px 0; margin-right: 10px; }

/*********************************************************************************************************/
/* Sidebar Categories */

  #sidebar #bookmarks h2 span { display: block; width: 32px; height: 32px; float: left; background: url(images/sprite.png) no-repeat -32px 0; margin-right: 10px; }
  
/*********************************************************************************************************/
/* Sidebar Find ME */

  #sidebar #mysociallinks h2 span { display: block; width: 32px; height: 32px; float: left; background: url(images/sprite.png) no-repeat -160px 0; margin-right: 10px; }
  
/*********************************************************************************************************/
/* Sidebar Archive */

  #sidebar #archive h2 span { display: block; width: 32px; height: 32px; float: left; background: url(images/sprite.png) no-repeat -64px 0; margin-right: 10px; }


/*********************************************************************************************************/
/* Main Content */

#content { width: 480px; margin: 0 20px 0 0; }

  #content .pagetitle { font-size: 22px; color: #4E95B3; font-weight: normal; margin: 0 0 30px 0; }

/*********************************************************************************************************/
/* Post Listing */

  #content .post { margin: 0 0 35px 0; }

    #content .post h2 a { font-size: 22px; color: #000; text-decoration: none; font-weight: normal; }
    
      #content .post h2 a:hover { color: #4E95B3; }
    
    #content a { text-decoration: none; color: #4E95B3; }
    
      #content a:hover { text-decoration: underline; }
      
    #content .post .wp-post-image { border: 2px solid #D7D7D7; margin: 10px 0 0 0; }
    
    #content .post .entry { font-size: 14px; color: #444; line-height: 1.5em; margin: 20px 0 0 0; }
      
      #content .post .entry h3 { font-weight: normal; margin: 20px 0 10px 0; text-transform: capitalize; border-bottom: 2px solid #D7D7D7; }
    
      #content .post .entry p { margin: 10px 0; }
      
      #content .post .entry p .note { background: #FEF1F1; padding: 10px; border: 2px solid #F23E3E; display: block; text-align: center; font-weight: bold; }
      
      #content .post .entry pre { background: #F7F7F7; padding: 10px; border: 2px dashed #D7D7D7; font-family: "Courier New", Courier, monospace; white-space: pre-wrap; /* css-3 */  white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */ white-space: -pre-wrap;      /* Opera 4-6 */ white-space: -o-pre-wrap; /* Opera 7 */  word-wrap: break-word; /* Internet Explorer 5.5+ */ }
      
      #content .post .entry ul { margin: 10px 30px; }
      
        #content .post .entry ul li { margin: 5px 0; }
      
      #content .post .entry ol { margin: 10px 30px; }
      
        #content .post .entry ol li { margin: 5px 0; }

                        #content .post .entry blockquote { margin: 10px 30px; font-size: 12px; background: #F7F7F7; font-style: italic; padding: 10px 0; }
        
                                #content .post .entry blockquote p { margin: 0 10px; }

                                #content .post .entry img { border: 2px solid #D7D7D7; margin: 10px 0; }
    
    #content .post .postmetadata { margin: 10px 0 0 0; font-size: 14px; background: #F7F7F7;  padding: 10px; border-top: 2px solid #D7D7D7; border-bottom: 2px solid #D7D7D7; }
    
      #content .post .postmetadata .read_more span { background: url(images/sprite.png) no-repeat -16px -32px; display: inline-block; height: 7px; margin: 0 5px 0 0; width: 13px; }
      
      #content .post .postmetadata .comment_icon span { background: url(images/sprite.png) no-repeat 0 -32px; display: inline-block; height: 13px; margin: 0 0 0 3px; width: 16px; }

/*********************************************************************************************************/
/* Page Listing */

  #content .page { margin: 0 0 35px 0; }

    #content .page h2 a { font-size: 22px; color: #000; text-decoration: none; font-weight: normal; }
    
      #content .page h2 a:hover { color: #4E95B3; }
    
    #content .page .entry { font-size: 14px; color: #444; line-height: 1.5em; margin: 20px 0 0 0; }
      
      #content .page .entry h3 { font-weight: normal; margin: 20px 0 10px 0; text-transform: capitalize; border-bottom: 2px solid #D7D7D7; }
      
      #content .page .entry p { margin: 10px 0; }
      
      #content .page .entry ul { margin: 10px 30px; }
      
        #content .page .entry ul li { margin: 5px 0; }
      
      #content .page .entry table { width: 100%; }
      
      #content .page .entry .smalltable { width: 150px; }
      
        #content .page .entry .smalltable img { padding: 2px; border: 3px solid #D7D7D7; width: 150px; }
      
      #content  .page .entry blockquote { padding: 0 10px; display: block; text-align: center; }
    
    #content .page .postmetadata { margin: 10px 0 0 0; font-size: 14px; background: #F7F7F7;  padding: 10px 0; border-top: 2px solid #D7D7D7; border-bottom: 2px solid #D7D7D7; }
    
      #content .page .postmetadata .read_more span { background: url(images/sprite.png) no-repeat -16px -32px; display: inline-block; height: 7px; margin: 0 5px 0 0; width: 13px; }
      
      #content .page .postmetadata .comment_icon span { background: url(images/sprite.png) no-repeat 0 -32px; display: inline-block; height: 13px; margin: 0 0 0 3px; width: 16px; }

/*********************************************************************************************************/
/* Contact Form */

  #content .page .entry .wpcf7-form { margin: 0 0 35px 0; }
    
      #content .page .entry .wpcf7-form input { margin: 5px 0; padding: 3px; width: 440px; font-size: 14px; }
    
      #content .page .entry .wpcf7-form textarea { margin: 5px 0; padding: 3px; width: 440px; font-size: 14px; }
    
    #content .page .entry .wpcf7-form .sendbutton { background: url(images/cat_bg.jpg) repeat-x top left; border: 2px solid #D7D7D7; width: 445px; padding: 6px 0; cursor: pointer; }
    
  #content .page .entry .success { background: #F6FAF1; border: 2px solid #85B440; padding: 10px; margin: 10px 0; }

/*********************************************************************************************************/
/* Comment Form */

  #content #comment_holder h2 { font-size: 22px; color: #000; font-weight: normal; margin: 5px 0 15px 0; }

  #content #comment_holder #commentform { margin: 20px 0; }
  
    #content #comment_holder #commentform input { margin: 5px 0; padding: 3px; width: 440px; font-size: 14px; }
    
    #content #comment_holder #commentform textarea { margin: 5px 0; padding: 3px; width: 440px; font-size: 14px; }
    
    #content #comment_holder #commentform #submit { background: url(images/cat_bg.jpg) repeat-x top left; border: 2px solid #D7D7D7; width: 445px; padding: 6px 0; cursor: pointer; }
    
    #content #comment_holder #commentform #submit:hover { border: 2px solid #FFF; }

  #content #comment_holder .commentlist { list-style: none; }

    #content #comment_holder .commentlist .comment-body { font-size: 14px; color: #444; line-height: 1.5em; margin: 20px 0; }

/*********************************************************************************************************/
/* Comment Listing */

  #content #comment_holder .commentlist li { margin: 20px 0; padding: 5px 10px 0 10px; background: #FFF; border-bottom: 2px solid #D7D7D7; }
  
  #content #comment_holder .commentlist .even { background: #F7F7F7; }
  
    #content #comment_holder .commentlist li img.avatar { float: right; border: 2px solid #F7F7F7; }
    
      #content #comment_holder .commentlist .even img { border-color: #FFF; }
    
    #content #comment_holder .commentlist li p { margin: 10px 0; }
    
    #content #comment_holder .commentlist li .comment-meta { font-size: small; }

/*********************************************************************************************************/
/* Footer */

#footer { position: relative; background: url(images/menu_bg.jpg) repeat-x bottom left; clear: both; height: 80px; padding: 10px 0 0 0; }

/*********************************************************************************************************/
/* Category Menu */

  #footer .cat_menu { position: absolute; top: 10px; left: 0; width: 940px; height: 46px; background: url(images/cat_bg.jpg) repeat-x top left; }
    
      #footer .cat_menu ul { list-style: none; }
      
        #footer .cat_menu ul li { float: left; line-height: 3.2em; font-size: 14px; color: #333; padding: 0 30px; }
      
          #footer .cat_menu ul li a { color: #333; text-decoration: none; }
          
          #footer .cat_menu ul li a:hover { text-decoration: underline; }

/*********************************************************************************************************/
/* Footer Links */

  #footer #poweredby { position: absolute; bottom: 10px; left: 10px; color: #FFF; font-size: 12px; }
  
    #footer #poweredby a { color: #FFF; }
  
  #footer #copyright { position: absolute; bottom: 10px; right: 10px; color: #FFF; font-size: 12px; }

    #footer #copyright a { color: #FFF; }

/*********************************************************************************************************/


/*********************************************************************************************************/
/* Media Queries for Mobile Devices & Print **************************************************************/
/*********************************************************************************************************/


/*********************************************************************************************************/
/* iPad - Land */

@media screen and (max-width: 1024px) {

}

/*********************************************************************************************************/
/* iPad - Port */

@media screen and (max-width: 768px) {

}
  
/*********************************************************************************************************/
/* iPhone - Land */

@media screen and (max-width: 480px) {

  small { font-size: 8px; }  

  #wrap { padding: 0; }

  #container { width: 470px; border: 5px solid #FFF; }

  #header #headerimg { width: 470px; height: 80px; position: relative; top: 0; }

  #header #menu { width: 470px; height: auto; position: relative; }

    #header #menu ul li { border: none; float: none; }

      #header #menu ul li a { background: url("images/menu_bg.jpg") repeat-x left top; padding: 0 15px; }

  #header #searchform { position: relative; display: block; }

    #header #searchform input { border: 1px solid #ccc; margin: 5px 0; width: 464px; }

  #header .cat_menu { display: none; }
  
  #sidebar { float: none; width: 470px; display: none; }

  #home #sidebar { display: block; }

    #sidebar #freelance, #sidebar #side_right, #sidebar #side_left { display: none; }

    #sidebar .wide { width: 466px; }

      #sidebar .wide p { font-size: 8px; }

    #sidebar #aboutme .show_content, #sidebar #aboutme .hide_content { font-size: 8px; }

  #content { width: 470px; }

    #content .post .entry { font-size: 8px; }

    #content .post .wp-post-image { display: none; }

    #content .post h2 a { font-size: 18px; }

    #content .post .postmetadata { font-size: 10px; }

    #content .pagetitle { font-size: 18px; }

    #content #comment_holder h2 { font-size: 18px; }
  
  #content #comment_holder #commentform input { width: 460px; }

  #content #comment_holder #commentform textarea { width: 460px; }

  #content #comment_holder #commentform #submit { width: 466px; }

  #content #comment_holder .commentlist .comment-body { font-size: 8px; }

  #footer { height: auto; }

    #footer .cat_menu { width: 470px; height: auto; left: 0; top: 0; position: relative;  }

      #footer .cat_menu ul { margin: 0 0 5px 0; }

        #footer .cat_menu ul li { float: none; padding: 0 15px; background: url("images/cat_bg.jpg") repeat-x left top; line-height: 2.4em; font-size: 10px; }

    #footer #poweredby { display: none }

    #footer #copyright { bottom: 0; left: 0; position: relative; padding: 0 0 10px 10px; display: block; }

}

/*********************************************************************************************************/
/* iPhone - Port */

@media screen and (max-width: 320px) {
  
  #wrap { padding: 0; }

  #container { width: 310px; border: 5px solid #FFF; }

  #header #headerimg { width: 310px; height: 80px; position: relative; top: 0; }

  #header #menu { width: 310px; height: auto; position: relative; }

    #header #menu ul li { border: none; float: none; }

      #header #menu ul li a { background: url("images/menu_bg.jpg") repeat-x left top; padding: 0 15px; }

  #header #searchform { position: relative; display: block; }

    #header #searchform input { border: 1px solid #ccc; margin: 5px 0; width: 304px; }

  #header .cat_menu { display: none; }
  
  #sidebar { float: none; width: 310px; display: none; }

  #home #sidebar { display: block; }

    #sidebar #freelance, #sidebar #side_right, #sidebar #side_left { display: none; }

    #sidebar .wide { width: 306px; }

      #sidebar .wide p { font-size: 12px; }

  #content { width: 310px; }

    #content .post .entry { font-size: 12px; }

    #content .post .wp-post-image { display: none; }

    #content .post h2 a { font-size: 18px; }

    #content .pagetitle { font-size: 18px; }

    #content #comment_holder h2 { font-size: 18px; }
  
  #content #comment_holder #commentform input { width: 300px; }

  #content #comment_holder #commentform textarea { width: 300px; }

  #content #comment_holder #commentform #submit { width: 306px; }

  #footer { height: auto; }

    #footer .cat_menu { width: 310px; height: auto; left: 0; top: 0; position: relative;  }

      #footer .cat_menu ul { margin: 0 0 5px 0; }

        #footer .cat_menu ul li { float: none; padding: 0 15px; background: url("images/cat_bg.jpg") repeat-x left top; line-height: 2.4em; }

    #footer #poweredby { display: none }

    #footer #copyright { bottom: 0; left: 0; position: relative; padding: 0 0 10px 10px; display: block; }

}
