/*=====================*/
/*Cloud Carpenters CSS*/
/*====================*/
/*Colors
	1 - #429bc5 - CC Blue
	2 - #E6E6DE - Light Brown (Mid Box BG Color)
	3 - #83796E - Medium Brown (Site Link BG)	
	4 - #5b574b - Dark Brown (Text color)
	5 - #7AA47A - Green (Grass BG Color)
*/


body,html {
	background:#7AA47A url(http://cdn.cloudcarpenters.com/images/grassbg.png);
	color:#454545;
	font-family:"trebuchet ms",tahoma,arial,verdana,sans-serif;
	font-size:1em;
	line-height:1.4em;
	min-height:100%;
	height:100%;
	margin:0;
	padding:0;
    min-width:1010px;
    width:100%;
}

/*Links and other default elements*/
a {
    border-bottom:1px dotted #429bc5;
	_border:none;
	color:#429bc5;
	font-weight:bold !important;
	padding:2px 4px 2px 4px;
	text-decoration:none;
}
a:hover {
	background-color:#429bc5;
	background:rgba(200,200,200,0.5);
    border:none;
	color:#7AA47A;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
}
h1 {
	color:#7AA47A;
	margin:0 0 10px 0;
	text-align:left;
}
h2 {
	color:#aaaaaa; 
	font-size:1.5em; 
	font-style:italic; c
	margin:0 0 10px 0;
}
h3 {
    border-bottom:1px solid #dedede;
    color:#5b574b;
    margin:5px 0 10px 0;
    padding:0 0 10px 0;
}
img {border:0;}
p {
	margin:5px 0 15px 5px;
}
hr {
	border:none;
	background:#cdcdcd;
	height:1px;
}
blockquote {
    background:#ffffff;
    border:1px solid #cdcdcd;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
ul {line-height:1.6em;}
li {
        margin:5px 0 0;
}
/*=======================
Site Container 
=========================*/
/*Site Spacer*/
#cloudCarpenters {
    background:#ffffff;
	font-size:.9em;
	padding:0;
	position:relative;
}

/*=======================
Header
=========================*/
#headerWrapper {
	background:#429BC5 url(http://cdn.cloudcarpenters.com/images/headerbg.png);
	height:140px;
	margin:0 auto;
	position:relative;
	text-align:center;
	
}
	#header {
		margin:0 auto;
		position:relative;
		text-align:left;
		width:974px;
                z-index:99;
	}
	/*Parallax StfusuFfu*/
		#cloudForeground {background:url(http://cdn.cloudcarpenters.com/images/cloudforeground.png) repeat 10% 10%;;
			bottom:0;
			height:40px;
			position:absolute;
			width:100%;
			z-index:10;
		}
		#cloudMidground {background:url(http://cdn.cloudcarpenters.com/images/cloudmid.png) repeat -50% 50%;;
			bottom:0;
			height:60px;
			position:absolute;
			width:100%;
			z-index:9;
		}
		#cloudBackground {background:url(http://cdn.cloudcarpenters.com/images/cloudback.png) repeat 100% 100%;;
			bottom:0;
			height:100px;
			position:absolute;
			width:100%;
			z-index:8;
		}
	/*Logo*/
	#logo {
		position:relative;
		top:35px;
		width:400px;
	}
        #logo a {text-decoration:none;border:none}
	/*=======================
    Nav Links
    =========================*/
	#navLinks {
		right:0;
		position:absolute;
		top:10px;
                z-index:42;
	}
		#navLinkList li {
			float:left;
			list-style-image:none;
			list-style-position:outside;
			list-style-type:none;		
		}
		#navLinkList li a {
			background:#ffffff;
			border:none;
			color:#429bc5;
			height:100%;
			float:left;
			font-size:1.2em	;
			margin:5px;
			-moz-border-radius:3px;
			-webkit-border-radius:3px;
			padding:3px 10px;
		}
		#navLinkList li a:hover {
			background:#E6E6DE;
			color:#343434;
		}
		.activePageLink {
			background:#83796E !important;
			color:#E6E6DE !important;
		}
		.activePageLink:hover {
			background:#BCB5AE !important;
			color:#E6E6DE !important;
		}

/*=======================
Body
=========================*/	
#midWrapper {
	background:#ffffff;
	min-height:90%;
	height:auto !important;
	height:90%;
	margin:0;
	padding:10px 0 0% 0;
	position:relative;
	text-align:center;
}
	#mid {
		margin:0 auto;
		padding:10px;
		position:relative;
		width:974px;
	}

	/*=============================
	Index Page
	===============================*/
	#homePageWrapper {
		margin:0 0 20px 0;
		position:relative;
	}
	
	/*Abot Cloud Carpenters*/
	#introTextWrapper {
		height:100%;
		position:relative;
	}
		#introText {
			position:relative;
			text-align:left;
		}
		#ccSamplesPricing {text-align:center;}
	#homePageServicesIntro {
		background:#efefef;
		font-size:1.1em;
		margin:20px 0;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
		padding:10px;
	}
	/*Fancy Graphics*/
	#graphicsWrapper {
		float:left;
		height:100%;
		position:relative;
		width:55%;
	}
		#graphics {

		}
		#panelSelector {
			bottom:2px;
			margin:0 auto;
			position:absolute;
			text-align:center;
			width:100%;
		}

		/*Blog Roll*/
		#blogRollWrapper {background:url(http://cdn.cloudcarpenters.com/images/rssicon.png) top right no-repeat;
			float:left;
			margin:0 5% 0 0;
			min-height:150px;
			position:relative;
			width:45%;
			text-align:left;
		}
			#blogRoll {
				font-size:1em;
				margin:10px 0 0;
			}
			.blogRollAuthor{
				font-style:italics;
				margin:2px 0 0;
			}
			#blogRoll ul li {
				margin:0 0 0;
			}
		/*Twitter*/
		#latestTweetWrapper {background:url(http://cdn.cloudcarpenters.com/images/twitterbird.png) top right no-repeat;
			float:left;
			min-height:130px;
			width:49%;
			text-align:left;
		}
			#latestTweet {
				margin:10px 0 0;
			}
				#tweetText {
					font-size:1.1em;
					line-height:1.4em;
				}
					#tweetText a {
						border-bottom:1px dotted #429bc5; 
                        color:#429bc5;
						font-size:.9em;
					}
						#tweetText a:hover {
                            border:none;
       						color:#429bc5;
						}
				#tweetDate {
					font-style:italic;
					text-align:right;
					margin-top:5px;
					margin-bottom:25px;
				}
		#indexSpacer {
			clear:both;
			height:30px;
		}
			/*===================
			Main Pages
			=====================*/
			.mainCCDivWrapper {
				margin:0 2% 0 0;
				position:relative;
				width:100%;
			}
			.mainCCDiv {
			    margin:0 0 40px 0;
				padding:0;
				position:relative;
				text-align:left;
			}
			/*===================
			About
			=====================*/
			.teamMemberImageContainer {
				height:100px;
				float:left; 
				margin:0 10px 0 0;
				width:100px; 
			}
			.aboutUl {line-height:1.3em;}
			/*===================
			Contact
			=====================*/
			.threeColumns {
				float:left;
				margin:0 2% 0 0;
				position:relative;
				width:31%;
			}
			#contactFormWrapper {
				float:left;
				margin:0 0 80px 0;
				position:relative;
				text-align:left;
				width:55%;
			}
			#teamContact {text-align:left;}
			#contactForm {
				margin:14px 0 15px;
			}
			.contactLabel {
				color:#429BC5;
				cursor:pointer;
				font-size:1.2em;
				font-weight:bold;
			}
			.contactInput {
				background:#E6E6DE;
				border:1px dotted #83796E;
				color:#5b574b;
				font:inherit;
				width:100%;
			}	
			#contactNameField {
				float:left;
				margin:0 5% 0 0;
				width:47%;
			}	
			#contactEmailField {
				float:left;
				width:47%;
			}
			#contactMessageField {
				margin:10px 0 0 0;
			}
			#contactSubmit {
				bottom:0;
				position:absolute;
				right:0;
			}

/*=======================
Blog Posts
=======================*/
#blogPostEntries {
	float:left;
	margin:0 2% 0 0;
	width:75%;
}
	#blogPostEntries h1 {
		margin:0 0 10px 0;
	}
	#blogPostEntries h1 a {
		border-bottom:1px dotted #7AA47A;
		color:#7AA47A;
	}
	#blogPostEntries h1 a:hover{color:#429BC5;}
        #blogPostEntries .paragraphStyle1 {
               margin:0 0 40px 0;
        }
       
    .blogListingWrapper {
        margin:0 0 10px 0;
        position:relative;
        width:100%;
    }
        .blogListingTitle {
            
        }
        .blogListingCat {
            font-size:.9em;
            position:absolute;
            top:0;
            right:0;
        }
    .listingHeader {font-size:1.5em;}
    /*No Blog Posts*/
    #noBlogPosts {
        font-size:1.2em;
        margin:30px 0 0 0;
    }
/*=========
Blog Post Styles
==========*/
.blogPost {
     background:#efefef;
     margin:10px 0 30px 0;
     -moz-border-radius:5px;
     -webkit-border-radius:5px;
     padding:10px;
}
	.blogPost h1 {
		margin:5px 0 30px 0 !important;
	}
.blogPostAuthor {
     font-size:.9em;
     text-align:right;
}
blockquote.codeBlock {
    font-family:monospace;
    font-size:1em;
    color:#BBBBBB;
    background-color:#222222;
    padding:5px;
}
/*Code block stuff*/
.code_block_class {
    background-color:#ffffff;
	border:1px solid #cdcdcd;
    border-left:20px solid #dedede;
    line-height:1.5em;
    padding:5px 5px 5px 10px;
	margin:5px 20px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
	overflow:auto;
}
.code_block_class ol {
	background:#efefef;
	margin:0px;
}
	.code_block_class ol li {
		background:#ffffff;
		margin:0px;
		padding:5px;
	}
    .code_block_class a:hover {background:#eeeeee;}
.activeBlogLink {
	background:#83796E !important;
	border:none !important;
	color:#E6E6DE !important;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
}
.activeBlogLink:hover {
	background:#BCB5AE !important;
	border:none !important;
	color:#E6E6DE !important;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
}
    /*============
    Blog Comments
    ==============*/
    .blogComment {
        background:#cdcdcd;
        margin:5px 0 0;
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
        padding:3px 10px;
    }
        .authorComment {
            background:#429bc5 !important;
            color:#efefef !important;
        }
    .blogCommentAuthor {
        float:left;
        margin:0 20px 0 0;
        position:relative;
        width:140px;
    }
        .commentDate {font-size:.8em;}
    .blogCommentText {
        float:left;
        position:relative;
    }
        .blogCommentText p {
            margin:0;
            padding:0;
        }
    /*Form*/
    #comment_form {
        color:#4C4940;
        margin:0;
        padding:0;
    }
    /*Div */
    #commentForm {
        background:#7AA47A;
        margin:20px 0 0;
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
        padding:10px;
    }
        #newUserInfo {
            margin:5px 0 10px 0;
            position:relative;
            width:100%;
        }
        #newUserInfo input {
            background:#E6E6DE ;
            border:1px solid #5b574b;
            color:#5b574b;
            font-family:"trebuchet ms",tahoma,arial,verdana,sans-serif;
            font-size:.9em;
            margin:0 20px 0 0;
        }
        .inputLabel {font-weight:bold;}
        #newUserName {
            
        }
        #newUserEmail {
            position:absolute;
            right:0;
            top:0;
        }
    #blogCommentInput {
        background:#E6E6DE ;
        border:1px solid #5b574b;
        color:#5b574b;
        font-family:"trebuchet ms",tahoma,arial,verdana,sans-serif;
        font-size:.9em;
        width:100%;
    }
    /*Header for Comments*/
    #commentForm h3 {color:#efefef;}
    #commentForm hr {background:#4C744C;}
    #commentForm p {
        margin:0;
        padding:0;
    }
    #commentSubmitButtons {text-align:right;}

    /*=============
    Right Side Styling
    ==============*/
    /*Wrapper*/
    #blogRightWrapper {
	    float:left;
	    width:23%;
        position:relative;
    }
    #blogRightWrapper h3 {
        color:#429bc5;
        font-size:1.3em;
	    margin:0 0 10px 0;
	    text-align:left;
    }
    /*Categories*/
    #blogPostCategories {

    }
           #blogPostCategories .paragraphStyle1 {
                   margin:0 0 40px 0;
            }
           #blogCats {
                    background:#efefef;
                    -moz-border-radius:5px;
                    -webkit-border-radius:5px;
                    padding:0 0 1px 0;
           }
           #blogCats a {
                border-bottom:1px dotted #7aa47a;
                color:#7aa47a;
           }
           #blogCats a:hover {
				border:none;
				color:#429bc5;
           }
		    .blogLinkInCat {
			    padding:4px 0 0 10px;
		    }
		    #blogCats ul {
			    margin:0 0 10px 0;
		    }

        /*============
        Calendar
        =============*/
        .calendarBG {
            background:#efefef;
            font-size:.9em;
            -moz-border-radius:3px;
            -webkit-border-radius:3px;
            padding:0 0 1px 0;
        }
                .calendarCell a{
                    background-color:#429bc5;
	                border:none !important;
                    color:#efefef;
                    -moz-border-radius:3px;
                    -webkit-border-radius:3px;
                    padding:3px;
                }
                .calendarCell a:hover{
                    background-color:#83796E;
                    color:#efefef;
                }
                #calendarDayNameRow {
                    background-color:#83796E;
                    color:#efefef;
                    font-weight:bold;
                    -moz-border-radius:3px;
                    -webkit-border-radius:3px;
                    width:100%;
                }
                .calendarToday {
                    background-color:#83796E;
                    color:#efefef;
                    font-weight:bold;
                    -moz-border-radius:3px;
                    -webkit-border-radius:3px;
                }
                .calendarBlank {
                    color:#83796E;
                    font-style:italic;
                }
                
                .calendarMonthText {
                    font-size:1.2em;
                    font-weight:bold;
                }
                .calendarMonthLinks a {
                    background:#cdcdcd;
                    border:none;
                    color:#83796E;
                    margin:0 2px;
                    -moz-border-radius:3px;
                    -webkit-border-radius:3px;
                }
                    .calendarMonthLinks a:hover {
                        background:#dedede;
                        color:#429BC5;
                    }
                /*Table Replacements*/
                .calendarMonthName {
                    padding:2% 0;
                    text-align:center;
                    width:100%;
                }
                    .calendarMonthName .calendarHeader {width:33%;}
                .calendarHeader {
                    font-weight:bold;
                    float:left;
                }
                .calendarHeaderColumn {
                    float:left;
                    margin:1% 1% 1% 0;
                    width:13%
                }
                .calendarHeaderRow {width:100%;}
                
    /*429bc5 E6E6DE 	1 - #429bc5 - CC Blue
	        2 - #E6E6DE - Light Brown (Mid Box BG Color)
	        3 - #83796E - Medium Brown (Site Link BG)	
	        4 - #5b574b - Dark Brown (Text color)
	        5 - #7AA47A - Green (Grass BG Color)*/
/*=======================
Footer
=========================*/	
#footerWrapper {background:url(http://cdn.cloudcarpenters.com/images/grassbg.png) bottom left repeat-x;
	clear:both;
    font-size:.9em;
	height:auto;
	position:relative;
	text-align:left;
	vertical-align:middle;
	width:100%;
	z-index:18;
}	

    #footer {
        background:#83796e url(http://cdn.cloudcarpenters.com/images/footercolumnbg.png);
		color:#efefef;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
		height:110px;
		margin:0 auto;
		opacity:.92;
		position:relative;
		top:10px;
	    width:974px;
	    z-index:18;
    }  
	/*Parallax For Footer*/
		#grassForeground {background:url(http://cdn.cloudcarpenters.com/images/grassfore.png) repeat-x 10% 10%;
			bottom:0;
			height:92px;
			position:absolute;
			width:100%;
			z-index:20;
		}
		#grassMidground {background:url(http://cdn.cloudcarpenters.com/images/grassmid.png) repeat -50% 50%;
			bottom:20px;
			height:130px;
			position:absolute;
			width:100%;
			z-index:9;
		}
		#grassBackground {background:url(http://cdn.cloudcarpenters.com/images/grassback.png) repeat 100% 100%;
			bottom:0;
			height:100px;
			position:absolute;
			bottom:0;
			width:100%;
			z-index:8;
		}
		
		/*Bottom Link Container*/
		#siteLinks {
		    position:relative;
		    width:100%;
			z-index:18;
		}
		#siteLinks2 {
			position:absolute;
			width:100%;
			z-index:420;
		}
			/*Site Bottom Column Class*/
			.siteLinksColumnWrapper {
				float:left;
				margin:0 2% 0 0;
				position:relative;
				width:341px;
			}
			.siteLinksColumn{
				color:#efefef;
			    padding:10px;
			    width:100%;
			}
                .siteLinksColumn h3 {
                    border:none;
                    color:#dedede;
                    margin:0;
                    padding:0;
                }
			.siteLinksColumn a {
				background:#83796E;
				color:#E6E6DE;
				border-bottom:none;
				margin:5px 2px !important;
				-moz-border-radius:2px;
				-webkit-border-radius:2px;
				padding:3px 5px !important;
				position:relative;
			}
				.siteLinksColumn a:hover{
					background:#efefef;
					color:#343434;
				}
			.siteLinksColumn3Wrapper {
				float:left;
				height:140px;
				position:relative;
				width:250px;
			}
			.siteLinksColumn3{
				background:transparent;
				color:#efefef;
				height:90px;
				-moz-border-radius:5px;
				-webkit-border-radius:5px;
			    padding:10px;
				right:0;
				width:100%;
			}
			.siteLinksColumn3 a{
				background:transparent;
				border:none;
			}
		/*============
		Links
		=============*/
		.activeFooterPageLink {
			background:#7AA47A !important;
			color:#E6E6DE !important;
			-moz-border-radius:3px;
			-webkit-border-radius:3px;
		}
	       
		/*=============
		Legal
		=============*/
		.legalText {
			color:#524d45;
			font-size:.8em;
			font-style:italic;
			margin:0 auto;
			padding:0;
			position:relative;
			text-align:right;
			width:974px;
			z-index:999999;
		}
		
/*=======================
Cloud Carpenter Classes
=========================*/	
	.ccBox {
        background-color:#e6e6de;
		-moz-border-radius:5px;
		-webkit-border-radius:5px;
	}
	.contactLink {
		font-size:1;
		font-style:italic;
		font-weight:normal;
	}
	.pMargin {
		margin:14px 0 15px;
		position:relative;
	}
	.fullPostMargin {
        margin:0 0 20px 0 !important;
    }
    .noMargin {
        margin:0 !important;
    }
	/*Columns*/
	.threeColumnsContainer {
		float:left;
		margin:0 3% 0 0;
		width:30%; 	
	}
	.threeColumnsInner {
		
	}
	
	/*========
	Alignment
	=========*/
	.alignCenter {text-align:center;}
    .alignLeft {text-align:left;}
    .alignRight{text-align:right;}
	
	/*============
	Paragraph
	==============*/
	.paragraphStyle1 {
		color:#999999;
		font-size:1.5em;
		font-style:italic;
		line-height:1.3em;
	}
/*=======================
Generic Classes
=========================*/	
	/*Positioning Stuff*/
	.clear {clear:both;}

/*======================
Date in blog post
========================*/
.postDate {	
	position:absolute;
	height:40px;
	top:-10px;
	width:50px;
}
.day {
	font-size:1.8em;
    font-weight:bold;
	left:0px;
	line-height:2.5em;
	position:absolute;
	top:0;
}
.month {
	font-size:1.5em;
	text-transform:uppercase;
}
.year {
	-moz-transform:rotate(-90deg);
	display:block;
	font-size:1.1em;
	position:absolute;
	right:-22px;
	top:9px;
}
.listingHeaderOffset {
    padding:0 0 15px 80px;
}
