/*
Theme Name: Matt Craig Design v4
Theme URI: http://www.mattcraigdesign.com
Description: Matt Craig Design v4 Theme
Version: 4.0
Author: Matthew Craig
/* --------------------------------------------- */

/* TABLE OF CONTENTS

00 - Global Elements - Used in every page
01 - Homepage - Used in the home page
02 - Main Structure - The core of the header, content, and footer
03 - Header - Navigation and Jobs
04 - Posts - Post and Pages styles
05 - Sidebar - Sidebar (sub-left and sub-right)

/* ----------------------------------------------*/


/* 00 - GLOBAL ELEMENTS
/* ----------------------------------------------*/

.body {
	background-color:#2e2e2e;
	font: 12px Georgia; color:#d1d1d1;
	margin:0; padding:0;
	width:auto; height:auto;
}

a {
	color: #808080; text-decoration: none;
}

a:hover {
	color: #505050; text-decoration: none;
}


.hdr-1 {
	background-color:#222;
	height: 55px;
	background-repeat:repeat-x;
}

.hdr-1_logo {
	float:left;
	margin: 14px 0 0 0;
	padding: 0 0 0 0;
	height: 55px;
	width: 326px;
	font:22px Arial; color:#FFF; font-weight: 500; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase; 
}

.navigation a:link, .navigation a:active, .navigation a:visited {
	margin: 0; padding: 0;
	font:12px Arial; color:#fff; font-weight: 500;
	text-decoration:none; text-transform:uppercase;
	line-height: 55px;
} 

.navlink a {
	width: 100%;
	height: 55px;
	padding: 0;
	display: block;
}

.navlink a:hover {
	background-color: #111;
}

.hdr-1_grey {
	background-color:#e2e2e2;
	height: 8px;
}

.hdr-1_sep_bkg {
	background-color:#222;
}

.hdr-2 {
	background-color:#222;
	height: 305px;
}

.hdr-2_middle_h2 {
	font:14px Georgia; color:#777; line-height: 24px; font-style: italic;
	margin: 0; padding: 10px 0 0 0;
	width: 355px;
}

.hdr-2_middle_h2 a:link, .hdr-2_middle_h2 a:active, .hdr-2_middle_h2 a:visited {
	color:#444;
	text-decoration:none;
} 

.hdr-2_middle_h2 a:hover {
	color:#444;
	text-decoration:underline;
} 

.hdr-2_middle_wd-blue_h3 a:link, .hdr-2_middle_wd-blue_h3 a:active, .hdr-2_middle_wd-blue_h3 a:visited {
	color:#2c70a4;
	text-decoration:none;
} 

.hdr-2_middle_wd-blue_h3 a:hover {
	color:#3f88c0;
	text-decoration:none;
} 

.hdr-2_middle_green_h3 a:link, .hdr-2_middle_green_h3 a:active, .hdr-2_middle_green_h3 a:visited {
	color:#28b424;
	text-decoration:none;
} 

.hdr-2_middle_green_h3 a:hover {
	color:#3fd43b;
	text-decoration:none;
} 

.hdr-2_middle_red_h3 a:link, .hdr-2_middle_red_h3 a:active, .hdr-2_middle_red_h3 a:visited {
	color:#c41111;
	text-decoration:none;
} 

.hdr-2_middle_red_h3 a:hover {
	color:#e34949;
	text-decoration:none;
} 

.hdr-2_middle_grey_h1 {
	font:36px Arial; color:#9e9e9e; font-weight: bold; letter-spacing: -4px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-2_middle_grey_h2 {
	font:16px Arial; color:#9e9e9e; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-2_middle_wd-blue_h3, .hdr-2_middle_green_h3, .hdr-2_middle_red_h3 {
	font:27px Arial; color:#9e9e9e; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
}


.hdr-2_middle_grey_h4 {
	font:14px Arial; color:#8e8e8e; font-weight: bold; letter-spacing: -1px;
	text-decoration:none; text-transform:uppercase;
}

.hdr-3 {
	background-color:#222;
	height: 21px;
}

.hdr-5 {
	background-color:#2e2e2e;
}

.hdr-5_grey {
	background-color:#e2e2e2;
}

.hdr-5_content {
	background-color:#d1d1d1;
	font:14px Georgia; color:#777777; line-height: 24px; font-style: italic;
	margin: 0; padding: 0;
}

.hdr-5_content2 {
	background-color:#d1d1d1;
	font:14px Georgia; color:#777777; line-height: 24px; font-style: italic;
	margin: 0; padding: 0 0 0 30px;
}

.hdr-7 {
	background-color:#111;
}

.hdr-7_2 {
	background-image:url(../images/hdr/hdr-7_2_bkg.png);
	margin:0; padding:0;
	width:271px; height:132px;
	background-repeat:no-repeat;
}

.hdr-7_2_font {
	margin:0; padding:0;
	font:12px Georgia; color:#a1a1a1; font-style: italic; line-height: 16px;
}

.hdr-7_2_font a:link, .hdr-7_2_font a:active, .hdr-7_2_font a:visited {
	color: #fff;
	text-decoration:none;
} 

.hdr-7_3 {
	background-image:url(../images/hdr/hdr-7_3_bkg.png);
	margin:0; padding:0;
	width:264px; height:132px;
	background-repeat:no-repeat;
}

.hdr-7_3_font1 {
	font:11px Arial; color:#fff; font-weight: 500; line-height: 10px;
}

.hdr-7_3_font2 {
	font:11px Arial; color:#a1a1a1; font-weight: 500; line-height: 10px;
}

.hdr-7_3_font1 a:link, .hdr-7_3_font1 a:active, .hdr-7_3_font1 a:visited {
	color: #fff;
	text-decoration:none;
} 

.hdr-7_3_font2 a:link, .hdr-7_3_font2 a:active, .hdr-7_3_font2 a:visited {
	color: #a1a1a1;
	text-decoration:none;
} 

.hdr-7_1-2 {
	background-image:url(../images/hdr/hdr-7_1-2.png);
	margin:0; padding:0;
	width:265px; height:22px;
	background-repeat:no-repeat;
	font:10px Arial; color:#999; font-weight: 500; text-align:center;
}

.hdr-7_1-2 a:link, .hdr-7_1-2 a:active, .hdr-7_1-2 a:visited {
	color: #999;
	text-decoration:none;
} 

.contain{
	width:800px;
	margin:0 auto;
}

.hdr-2_middle_blue_h1 a:link, .hdr-2_middle_blue_h1 a:active, .hdr-2_middle_blue_h1 a:visited {
	font:36px Arial; color:#2c70a4; font-weight: bold; letter-spacing: -4px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-2_middle_green_h1 a:link, .hdr-2_middle_green_h1 a:active, .hdr-2_middle_green_h1 a:visited {
	font:36px Arial; color:#28b424; font-weight: bold; letter-spacing: -4px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-2_middle_red_h1 a:link, .hdr-2_middle_red_h1 a:active, .hdr-2_middle_red_h1 a:visited {
	font:36px Arial; color:#c41111; font-weight: bold; letter-spacing: -4px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-2_middle_blue_h2 a:link, .hdr-2_middle_blue_h2 a:active, .hdr-2_middle_blue_h2 a:visited {
	font:16px Arial; color:#2c70a4; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-2_middle_green_h2 a:link, .hdr-2_middle_green_h2 a:active, .hdr-2_middle_green_h2 a:visited {
	font:16px Arial; color:#28b424; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-2_middle_red_h2 a:link, .hdr-2_middle_red_h2 a:active, .hdr-2_middle_red_h2 a:visited {
	font:16px Arial; color:#c41111; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-2_middle_blue_h1 a:hover {
	color:#3f88c0;
	text-decoration:none;
} 

.hdr-2_middle_green_h1 a:hover {
	color:#3fd43b;
	text-decoration:none;
} 

.hdr-2_middle_red_h1 a:hover {
	color:#e34949;
	text-decoration:none;
} 

.hdr-2_middle_blue_h2 a:hover {
	color:#3f88c0;
	text-decoration:none;
} 

.hdr-2_middle_green_h2 a:hover {
	color:#3fd43b;
	text-decoration:none;
} 

.hdr-2_middle_red_h2 a:hover {
	color:#e34949;
	text-decoration:none;
} 

/* 01 - HOMEPAGE
/* ----------------------------------------------*/

.blue {
	color:#68a5d4;
}

.navigation-blue a:hover { 
	color:#68a5d4;
}

.hdr-1_blue {
	background-color:#68a5d4;
	height: 8px;
}

.hdr-2_middle_blue {
	background-image:url(../images/hdr/hdr-2_middle_blue_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 24px 0 0 28px;
	height: 305px;
	width: 800px;
}

.hdr-2_middle_blue2 {
	background-image:url(../images/hdr/hdr-2_middle_blue2_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 24px 0 0 28px;
	height: 305px;
	width: 800px;
}

.my-services {
	background-color:#111;
	height: 210px;
}

.gallery {
	background-color:#2e2e2e;
	height: 210px;
}

.my-services_hdr1 {
	background-color:#4a4a4a;
	height: 11px;
}

.ldp-image_bkg {
	background-image:url(../images/home/ldp-image_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 0;
	height: 86px;
	width: 259px;
}

.ldp-image {
	margin: 0; padding: 15px 0 0 11px;
	height: 60px;
	width: 237px;
}

.ldp-image_hover {
	margin: 0;
	overflow: hidden;
	float: left;
	position: relative;
}
.ldp-image_hover a {
	text-decoration: none;
	float: left;
}

.ldp-image_hover a img {
	margin: 0;
	border: none;
	padding: 0;
	background: #fff;
}

.ldp-image_hover a:hover .desc {
	display: block;
	background: #e1e1e1;
	font:10px Tahoma; color:#8e8e8e; font-weight:bold; text-transform:uppercase;
	position:absolute;
	bottom: 0px;
	right: 0px;
	padding: 5px;
	text-align:right;
	margin: 0;
	width: 80px;
}

.ldp-image_hover a .desc {
	display: none; 
}
.ldp-image_hover a:hover .more { 
	visibility: hidden;
}

.dtfyn-image_bkg {
	background-image:url(../images/home/dtfyn-image_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 0;
	height: 252px;
	width: 485px;
}

.dtfyn-image {
	margin: 0; padding: 11px 0 0 10px;
	height: 233px;
	width: 467px;
}

.stepcarousel{
position: relative; /*leave this value alone*/
overflow: scroll; /*leave this value alone*/
width: 465px; /*Width of Carousel Viewer itself*/
height: 231px; /*Height should enough to fit largest content's height*/
}

.stepcarousel .belt{
position: absolute; /*leave this value alone*/
left: 0;
top: 0;
}

.stepcarousel .panel{
float: left; /*leave this value alone*/
overflow: hidden; /*clip content that go outside dimensions of holding panel DIV*/
margin: 0px; /*margin around each panel*/
width: 465px; /*Width of each panel holding each content. If removed, widths should be individually defined on each content DIV then. */
}

.atd {
	font:14px Georgia; color:#8e8e8e; line-height: 24px; font-style: italic;
	margin: 0; padding: 0;
}

.pdp-image_bkg {
	background-image:url(../images/home/pdp-image_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 0;
	height: 112px;
	width: 109px;
}

.pdp-image {
	margin: 0; padding: 11px 0 0 9px;
	height: 84px;
	width: 91px;
}

.pdp-image_hover {
	margin: 0;
	overflow: hidden;
	float: left;
	position: relative;
}
.pdp-image_hover a {
	text-decoration: none;
	float: left;
}

.pdp-image_hover a img {
	margin: 0;
	border: none;
	padding: 0;
	background: #fff;
}

.pdp-image_hover a:hover .desc {
	display: block;
	background: #e1e1e1;
	font:10px Tahoma; color:#8e8e8e; font-weight:bold; text-transform:uppercase;
	position:absolute;
	bottom: 0px;
	right: 0px;
	padding: 5px;
	text-align:right;
	margin: 0;
	width: 30px;
}

.pdp-image_hover a .desc {
	display: none; 
}
.pdp-image_hover a:hover .more { 
	visibility: hidden;
}

.pdp-proname {
	font:12px Georgia; color:#8e8e8e; font-style: italic;
	margin: 0; padding: 0;
}

.hdr-7_2_font_blue a:hover {
	color: #67a5d4;
	text-decoration:none;
} 

.hdr-7_3_font1_blue a:hover, .hdr-7_3_font2_blue a:hover {
	color: #67a5d4;
	text-decoration:none;
} 

.hdr-7_1-2_blue a:hover {
	color: #67a5d4;
	text-decoration:none;
} 


/* 02 - BIOGRAPHY - PURPLE
/* ----------------------------------------------*/
.purple {
	color:#b345bd;
}

.navigation-purple a:hover { 
	color:#b345bd;
}

.hdr-1_purple {
	background-color:#7e0d88;
	height: 8px;
}

.hdr-2_middle_purple {
	background-image:url(../images/hdr/hdr-2_middle_purple_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 24px 0 0 28px;
	height: 305px;
	width: 800px;
}

.hdr-2_middle_purple_h1 {
	font:36px Arial; color:#7e0d88; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.about-matt {
	background-color:#505050;
	height: 210px;
}

.about-matt_hdr1 {
	background-color:#4a4a4a;
	height: 11px;
}

.hdr-7_2_font_purple a:hover {
	color: #b345bd;
	text-decoration:none;
} 

.hdr-7_3_font1_purple a:hover, .hdr-7_3_font2_purple a:hover {
	color: #b345bd;
	text-decoration:none;
} 

.hdr-7_1-2_purple a:hover {
	color: #b345bd;
	text-decoration:none;
} 


/* 03 - PORTFOLIO - YELLOW
/* ----------------------------------------------*/
.yellow {
	color:#c0bb3f;
}

.navigation-yellow a:hover { 
	color:#c0bb3f;
}

.hdr-1_yellow {
	background-color:#c0bb3f;
	height: 8px;
}

.hdr-2_middle_yellow {
	background-image:url(../images/hdr/hdr-2_middle_yellow_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 24px 0 0 28px;
	height: 305px;
	width: 800px;
}

.hdr-2_middle_yellow_h1 {
	font:36px Arial; color:#c0bb3f; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-7_2_font_yellow a:hover {
	color: #c0bb3f;
	text-decoration:none;
} 

.hdr-7_3_font1_yellow a:hover, .hdr-7_3_font2_yellow a:hover {
	color: #c0bb3f;
	text-decoration:none;
} 

.hdr-7_1-2_yellow a:hover {
	color: #c0bb3f;
	text-decoration:none;
} 


/* 04 - WEB DESIGN PORTFOLIO - WD-BLUE
/* ----------------------------------------------*/
.wd-blue {
	color:#3f88c0;
}

.navigation-wd-blue a:hover { 
	color:#3f88c0;
}

.hdr-1_wd-blue {
	background-color:#3f88c0;
	height: 8px;
}

.hdr-2_middle_wd-blue {
	background-image:url(../images/hdr/hdr-2_middle_wd-blue_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 24px 0 0 28px;
	height: 305px;
	width: 800px;
}

.hdr-2_middle_wd-blue_h1 {
	font:36px Arial; color:#3f88c0; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.about-matt {
	background-color:#505050;
	height: 210px;
}

.hdr-7_2_font_wd-blue a:hover {
	color: #3f88c0;
	text-decoration:none;
} 

.hdr-7_3_font1_wd-blue a:hover, .hdr-7_3_font2_wd-blue a:hover {
	color: #3f88c0;
	text-decoration:none;
} 

.hdr-7_1-2_wd-blue a:hover {
	color: #3f88c0;
	text-decoration:none;
} 

/* 05 - LOGO DESIGN PORTFOLIO - GREEN
/* ----------------------------------------------*/
.green {
	color:#29b424;
}

.navigation-green a:hover { 
	color:#29b424;
}

.hdr-1_green {
	background-color:#29b424;
	height: 8px;
}

.hdr-2_middle_green {
	background-image:url(../images/hdr/hdr-2_middle_green_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 24px 0 0 28px;
	height: 305px;
	width: 800px;
}

.hdr-2_middle_green_h1 {
	font:36px Arial; color:#29b424; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-7_2_font_green a:hover {
	color: #29b424;
	text-decoration:none;
} 

.hdr-7_3_font1_green a:hover, .hdr-7_3_font2_green a:hover {
	color: #29b424;
	text-decoration:none;
} 

.hdr-7_1-2_green a:hover {
	color: #29b424;
	text-decoration:none;
} 

/* 06 - GRAPHIC DESIGN PORTFOLIO - RED
/* ----------------------------------------------*/
.red {
	color:#c41111;
}

.navigation-red a:hover { 
	color:#c41111;
}

.hdr-1_red {
	background-color:#c41111;
	height: 8px;
}

.hdr-2_middle_red {
	background-image:url(../images/hdr/hdr-2_middle_red_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 24px 0 0 28px;
	height: 305px;
	width: 800px;
}

.hdr-2_middle_red_h1 {
	font:36px Arial; color:#c41111; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-7_2_font_red a:hover {
	color: #c41111;
	text-decoration:none;
} 

.hdr-7_3_font1_red a:hover, .hdr-7_3_font2_red a:hover {
	color: #c41111;
	text-decoration:none;
} 

.hdr-7_1-2_red a:hover {
	color: #c41111;
	text-decoration:none;
} 

/* 07 - MY SERVICES - ORANGE
/* ----------------------------------------------*/
.orange {
	color:#d65611;
}

.navigation-orange a:hover { 
	color:#d65611;
}

.hdr-1_orange {
	background-color:#d65611;
	height: 8px;
}

.hdr-2_middle_orange {
	background-image:url(../images/hdr/hdr-2_middle_orange_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 24px 0 0 28px;
	height: 305px;
	width: 800px;
}

.hdr-2_middle_orange_h1 {
	font:36px Arial; color:#d65611; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-7_2_font_orange a:hover {
	color: #d65611;
	text-decoration:none;
} 

.hdr-7_3_font1_orange a:hover, .hdr-7_3_font2_orange a:hover {
	color: #d65611;
	text-decoration:none;
} 

.hdr-7_1-2_orange a:hover {
	color: #d65611;
	text-decoration:none;
} 

/* 08 - CONTACT ME - PINK
/* ----------------------------------------------*/
.pink {
	color:#c82f9f;
}

.navigation-pink a:hover { 
	color:#c82f9f;
}

.hdr-1_pink {
	background-color:#c82f9f;
	height: 8px;
}

.hdr-2_middle_pink {
	background-image:url(../images/hdr/hdr-2_middle_pink_bkg.png);
	background-repeat:no-repeat;
	font:14px Georgia; color:#9e9e9e; line-height: 16px; font-style: italic;
	margin: 0; padding: 24px 0 0 28px;
	height: 305px;
	width: 800px;
}

.hdr-2_middle_pink_h1 {
	font:36px Arial; color:#c82f9f; font-weight: bold; letter-spacing: -2px;
	text-decoration:none; text-transform:uppercase;
} 

.hdr-7_2_font_pink a:hover {
	color: #c82f9f;
	text-decoration:none;
} 

.hdr-7_3_font1_pink a:hover, .hdr-7_3_font2_pink a:hover {
	color: #c82f9f;
	text-decoration:none;
} 

.hdr-7_1-2_pink a:hover {
	color: #c82f9f;
	text-decoration:none;
} 







.fieldbox { 
	border:1px #CCCCCC solid;  
	background-color:#f4f4f4; 
	padding: 20px; 
}
.fieldbox2 { 
	border:1px #CCCCCC solid;  
	background-color:#f4f4f4; 
	padding: 10px; 
}
.contactfields { 
	width:500px; 
	border:1px #CCCCCC solid; 
	padding:5px; 
	padding-left:10px; 
	background-color:#f4f4f4; 
}
.contactfields3 { 
	width:500px; 
	border:1px #CCCCCC solid; 
	background-color:#ffffff; 
	
}
.contactfield { 
	padding:4px; 
	color: #666666; 
	border:1px #e8e8e8 solid; 
	width:200px; 
	background-color:#ffffff;  
	font-family:Arial, Helvetica, sans-serif; 
	font-size:14px; 
}
.contactfield2 { 
	padding:4px; 
	color: #666666; 
	border:1px #eeeeee solid; 
	width:125px; 
	background-color:#ffffff;  
	font-family:Arial, Helvetica, sans-serif; 
	font-size:14px; 
}
.contactfield3 { 
	color: #666666; 
	border:0px;
	width:200px; 
	padding-left:12px;
	background-color:#ffffff;  
	font-family:Arial, Helvetica, sans-serif; 
	font-size:14px; 

}
.contactfield4 { 
	color: #666666; 
	border:0px;
	width:225px; 
	background-color:#ffffff;  
	font-family:Arial, Helvetica, sans-serif; 
	font-size:14px; 

}
.contactfield5 { 
	border:1px solid #c1c1c1;
	background-color:#ffffff;  
}


