/*
Theme Name: 3D
Theme URI: http://legendthemes.com
Description: A Legend Theme
Author: Nathan Barry
Author URI: http://legendthemes.com
Version: 0.1

This theme is released under GPL: http://www.gnu.org/licenses/gpl.html
*/


/* CSS Reset
-------------------------------------------------------------- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}


body { line-height: 1.7; margin:1.5em 0; }

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight:400; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

a img { border: none; }


/* General Styles
-------------------------------------------------------------- */


body {
	margin: 0px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 14px;
	background: #599ED7;
        background: -webkit-gradient(radial, 50% 50%, 700, 50% 50%, 100, from(#407aab), to(#599ED7)) center center;
        color: #111;
	}


	
a {
	color: #024472;
	text-decoration: none;
	}
			
	a:visited {
			color: #245170;
			}
	
	a:hover {
			color: #195884;
			}

/* Header
-------------------------------------------------------------- */

#header {
    background: #eee;
    background: -webkit-gradient(
                    linear,
                    left bottom,
                    left top,
                    color-stop(0.09, rgb(217,221,224)),
                    color-stop(1, rgb(255,255,255))
                );
    background: -moz-linear-gradient(
                    center bottom,
                    rgb(217,221,224) 9%,
                    rgb(255,255,255) 100%
                );
    height: 40px;
    border-top: solid 3px #000;
    -webkit-box-shadow: -5px 5px 5px rgba(0,0,0,.4);
    -moz-box-shadow: -5px 5px 5px rgba(0,0,0,.4);
    text-shadow: 0px 1px 0px #fff;
    }


#logo { display: block; float: left; padding: 2px 15px; font-size: 24px; font-weight: bold; color: #000; }
.description {
    position: absolute;
    right: 10px;
    top: 9px;
    font-family: Georgia, Times, serif;
    color: #3c78ab;
    font-size: 18px;
    font-style: italic;
    }

#nav {
    height: 40px;
    margin: 0px;
    padding: 0px;
    list-style: none;
    }


    #nav li a {
            float: left;
            display: block;
            color: #333;
            padding: 11px 30px 9px;
            text-transform: uppercase;
            font-size: 12px;
            letter-spacing: 1px;
            }

        #nav li a:hover { color: #222; }


/* Rotator Styles
-------------------------------------------------------------- */
.safari body.home { overflow: hidden; }

/* For Firefox and IE */
#page { width: 800px; margin: 50px auto; clear: both;}

.safari #page { width: 100%; margin: 0; }

#controls {
        display: none;
        }

.safari #controls {
        position: absolute;
        left: 40px;
        top: 70px;
        width: 120px;
        height: 95px;
        z-index: 1000;
        -webkit-transition: width 1s;
        display: block;
        }

        .safari #controls .control-container {
            background: #9dbeda;
            position: absolute;
            left: 65px;
            border-top: solid #fff 5px;
            border-bottom: solid #fff 5px;
            height: 85px;
            overflow: hidden;
            -webkit-transition: width 1s;
            }
                .safari #controls .final-container {
                    width: 240px;
                    overflow: hidden;
                    position: absolute;
                    }

    .safari #controls .front {
            display: block;
            width: 60px;
            height: 95px;
            text-align: center;
            position: absolute;
            right: 0px;
            background: url('img/controls.png') right bottom;
            }

    .safari #controls .title {
            display: block;
            width: 70px;
            height: 65px;
            text-align: right;
            position: absolute;
            left: -30px;
            background: url('img/controls.png') -13px top;
            z-index: 9001;
            padding: 30px 5px 0px 20px;
            text-transform: uppercase;
            color: #b0c5d6;
            line-height: 18px;
            }


    .safari #controls .title:first-line {
            font-weight: bold;
            color: #fff;
            }

    .safari #controls a {
            display: none;
            float: left;
            width: 80px;
            line-height: 80px;
            height: 100px;
            text-align: center;
            }
    .safari #controls:hover { width: 365px;}
    .safari #controls:hover .control-container{ width: 240px;}
    .safari #controls:hover a { display: block; }
    .safari #controls:hover .front { background-position: left bottom; }
    .safari #controls:hover a:hover { background: #c4ddf2; }
    .safari #controls:hover a.active { background: #fff; }

.safari #home-wrapper {
  -webkit-perspective: 800; /* For compatibility with iPhone 3.0, we leave off the units here */
  -webkit-perspective-origin: 50% 150px;
  height: 100%;
  margin-top: 100px;
  -webkit-transition: -webkit-perspective-origin 1s;
}


@-webkit-keyframes spin {
      from { -webkit-transform: rotateY(0); }
      to   { -webkit-transform: rotateY(-360deg); }
    }


.safari #home-wrapper #post-container {
    width: 200px;
    height: 200px;
    -webkit-backface-visibility: visible;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    list-style: none;
    left: 50%;
    position: absolute;
    margin-left: -100px;
    margin-top: 100px;
    -webkit-animation: spin 30s infinite linear;
    -webkit-transform: translateZ(-200px);
    -webkit-transform-style: preserve-3d;
    -webkit-transition: -webkit-perspective-origin 1s;
    z-index: 1;
    }

#home-wrapper .post {
    height: 200px;
    width: 200px;
    -webkit-border-radius: 3px;
    -webkit-box-sizing: border-box;
    -moz-border-radius: 3px;
    -moz-box-sizing: border-box;
    background-color: rgba(230,230,230,1);
    -webkit-transition: -webkit-transform 3s, opacity .4s, background-color 2s;
    -webkit-backface-visibility: visible;
    font-size: 10px;
    padding: 0px;
    overflow: hidden;
    opacity: .8;
    cursor: pointer;
    border: solid #fff 5px;
    float: left;
    margin: 10px;
    }

.safari #home-wrapper .post {
    position: absolute;
    }
    #home-wrapper .featured-image { display: block; background: #555; height: 100px; width: 270px; }

    #home-wrapper .post .title { font-size: 18px; color: #222; font-weight: bold; display: block; padding: 1px 5px; line-height: 22px; }
    #home-wrapper .post .date, .post .author { color: #444; padding: 0px 5px; font-size: 9px; text-transform: uppercase; display: block;}
    #home-wrapper .post:hover { opacity: 1; }



 .safari .box #post-1.post { -webkit-transform: rotateX(90deg) translateZ(100px); }
 .safari .box #post-2.post { -webkit-transform: translateZ(100px); }
 .safari .box #post-3.post { -webkit-transform: rotateY(90deg) translateZ(100px); }
 .safari .box #post-4.post { -webkit-transform: rotateY(180deg) translateZ(100px); }
 .safari .box #post-5.post { -webkit-transform: rotateY(-90deg) translateZ(100px); }
 .safari .box #post-6.post { -webkit-transform: rotateX(-90deg) translateZ(100px) rotate(180deg); }

 .safari .ring #post-1.post { -webkit-transform: translateZ(200px); }
 .safari .ring #post-2.post { -webkit-transform: rotateY(60deg) translateZ(200px); }
 .safari .ring #post-3.post { -webkit-transform: rotateY(120deg) translateZ(200px); }
 .safari .ring #post-4.post { -webkit-transform:  rotateY(180deg) translateZ(200px); }
 .safari .ring #post-5.post { -webkit-transform:  rotateY(240deg) translateZ(200px); }
 .safari .ring #post-6.post { -webkit-transform:  rotateY(300deg) translateZ(200px); }


 .safari #home-wrapper.invert { -webkit-perspective-origin: 50% -200px; -webkit-transition: -webkit-perspective-origin 1s; }
 .safari .invert #post-1.post { -webkit-transform: translateZ(-500px); }
 .safari .invert #post-2.post { -webkit-transform: rotateY(60deg) translateZ(-500px); }
 .safari .invert #post-3.post { -webkit-transform: rotateY(120deg) translateZ(-500px); }
 .safari .invert #post-4.post { -webkit-transform:  rotateY(180deg) translateZ(-500px); }
 .safari .invert #post-5.post { -webkit-transform:  rotateY(240deg) translateZ(-500px); }
 .safari .invert #post-6.post { -webkit-transform:  rotateY(300deg) translateZ(-500px); }



   #home-wrapper .post.hide {
                  opacity: .1;
   		 }

   .safari #home-wrapper .post.hide {
		  background-color: rgba(256,256,256,.6);
		  -webkit-transform: translateY(1000px);
                  opacity: .9;
   		 }

#home-wrapper .post.featured {
    position: absolute;
    height: 250px;
    width: 280px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    background-color: rgba(230,230,230,.9);
    -webkit-transition: -webkit-transform 3s, opacity .4s, top 2s;
    font-size: 10px;
    overflow: hidden;
    top: 2000px;
    left: 50%;
    margin-left: -150px;
    opacity: 1;
    padding: 0px;
    z-index: 8000;
    border: solid #fff 5px;
    -webkit-box-shadow: 1px 1px 10px rgba(0,0,0,.4);
    -moz-box-shadow: 1px 1px 10px rgba(0,0,0,.4);
    display: none;
    }

    .safari #home-wrapper .post.featured { display: block; }

    #home-wrapper .post-featured .featured-image { display: block; background: #555; height: 100px; width: 270px; border: solid #fff 1px; border-bottom: solid #fff 6px; }
    #home-wrapper .post.featured .title { font-size: 18px; color: #333; font-weight: bold; display: block; padding: 5px 10px;}
    #home-wrapper .post.featured .view-post { -webkit-transition: background .1s; padding: 5px 10px; background: #832323;
                                              -webkit-border-radius: 10px; -moz-border-radius: 10px; font-size: 14px; color: #eee; font-weight: bold; display: block;
                                              position: absolute; bottom: 10px; right: 10px;}
    #home-wrapper .post.featured .view-post:hover { background: #a41818;}
    #home-wrapper .post.featured .date, .post .author { color: rgba(0,0,0,.6); padding: 1px 10px; font-size: 9px; text-transform: uppercase; display: block;}
    #home-wrapper .post.featured:hover { opacity: 1; }

    #home-wrapper .post.featured.visible { top: 180px; z-index: 9999; display: block; }

/* Footer Styles
-------------------------------------------------------------- */

.safari .home #categories {
    position: fixed;
    bottom: 0px;
    width: 100%;
    }
    
#categories {
    height: 90px;
    margin: 0px;
    padding: 0px;
    background: #346a98 url('img/pattern.png');
    list-style: none;
    border-top: solid 1px #6292bb;
    -webkit-box-shadow: 0px -1px 0px #2c618e;
    -moz-box-shadow: 0px -1px 0px #2c618e;
    }

    #categories li a {
            float: left;
            display: block;
            width: 109px;
            height: 44px;
            background: url('img/cat-background.png') no-repeat;
            color: #444;
            padding: 15px 20px;
            position: relative;
            margin: 10px;
            }


#footer { margin: 100px 0px 0px 0px; clear: both; }


/* Regular Site Styles
-------------------------------------------------------------- */

#wrapper {
    margin: 30px auto;
    width: 660px;
    background: #fff;
    padding: 20px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.3);
    -moz-box-shadow: 0px 0px 10px rgba(0,0,0,.3);
    }


/* Layout
-------------------------------------------------------------- */

.container {
  width: 1000px;
  margin: 0 auto;
}

.clear { display: inline-block; }
.clear:after, .container:after, .comment-details:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
* html .clear { height: 1%; }
.clear { display: block; }


/* Content Formatting
-------------------------------------------------------------- */

p { margin-bottom: 15px; }

blockquote  { margin: 20px; font-style: italic; }
strong      { font-weight: bold; }
em,dfn      { font-style: italic; }
dfn         { font-weight: bold; }
pre,code    { margin: 15px 0; white-space: pre; }
pre,code,tt { font: 12px 'andale mono', 'monotype.com', 'lucida console', monospace; line-height: 1.5; }
tt          { display: block; margin: 50px 0; line-height: 1.5; }

ul, ol      { margin:0 15px 15px 15px; }
ul          { list-style-type: square; }
ol          { list-style-type: decimal; }
dl          { margin: 0 0 15px 0; }
dl dt       { font-weight: bold; }
dd          { margin-left: 15px;}

#content img { border: none; margin: 10px 10px 10px 0px; }

.navigation {
		clear: both;
		height: 20px;
		}


.alignleft { float: left; }
.alignright { float: right; }

#breadcrumbs {
		padding: 5px 0px 15px 20px;
		background: url('img/icons/home.png') no-repeat 0px 6px;
                display: none;
		}
/* Widgets */

.widgets {
        width: 980px;
        margin: 0px;
        }

        .widget {
                float: left;
                width: 300px;
                list-style: none;
                margin-right: 26px;
                }

        .image {

            background: #fff url('img/shadow.png') no-repeat bottom center;
            padding-bottom: 9px;
            }

            .image img, .image .no-image {
                -moz-box-shadow: 0 0 1px #aaa;
                padding: 5px;
            }


/* WP Calendar */
#wp-calendar {
        width: 100%;


}

    #wp-calendar caption {
            text-align: center;
            padding: 3px;
            font-weight: bold;
            }

    #wp-calendar thead {
            }

            #wp-calendar th {
                    font-weight: bold;
                    padding: 5px;
                    text-align: center;
                    }

            #wp-calendar td {
                    text-align: center;

            }

            #wp-calendar td {
                    padding: 5px;
                    }

                    #wp-calendar #prev, #wp-calendar #next {
                            padding: 5px;
                            text-align: left;
                            }
                    #wp-calendar #next {
                            text-align: right;
                            }




/* Post List formatting
-------------------------------------------------------------- */

.post {
        border-top: dotted #aaa 1px;
        padding: 20px 0px 5px;
        float: left;
        }

        .post-thumbnail {
		float: left;
		margin: 0px 25px 10px 0px;
		width: 295px;
		text-align: center;
                padding-bottom: 0px;
		}

                .post-thumbnail .no-image {
                        width: 285px;
                        height: 170px;
                        background: #eee;
                        display: block;
                        margin: 5px;
                        }
                        
        .post h2 {margin-bottom: 0px;}
        .post h2 a {
                color: #1b1b1b;
                border-bottom: 0px;
                display: block;
        }
        .post .author {
            font-size: 12px;
            color: #6d6d6d;
            font-family: "Lucida Grande", "Lucida Sans", Helvetica, Arial, sans-serif;
        }

		.post-content {
				float: left;
				width: 430px;
				}
		.home .post-content { width: 640px; }

		.read-more {
				text-align: right;
				}


/* Headings
-------------------------------------------------------------- */

h1,h2,h3,h4,h5,h6 {
    font-weight: normal;
    color: #141313;
    font-family: "Lucida Grande", "Lucida Sans", Helvetica, Arial, sans-serif;
    }

h1 { font-size: 32px; line-height: 1; margin-bottom: 10px; font-weight: bold; }
h2 { font-size: 28px; margin-bottom: 10px; }
h3 { font-size: 20px; line-height: 1; margin-bottom: 10px; }
h4 { font-size: 16px; line-height: 1.25; margin-bottom: 8px; color: #375a90; letter-spacing: 1px; text-transform: uppercase; display: inline-block; }
h5 { font-size: 14px; font-weight: bold; margin-bottom: 5px; }
h6 { font-size: 14px; font-weight: bold; }

.page-title {
    margin: 0px 10px 20px 0px;
    text-shadow: 0px 1px 0px #fff;
    line-height: 40px;
}

/* Comments
-------------------------------------------------------------- */

#post-comments {
	width: 700px;
	margin: 15px auto;
	}

#comments {
    padding: 10px 0px;
    color: #375a90;
    text-shadow: 0px 1px 0px rgba(256,256,256,.5);
    }

	#comments textarea {
			width: 480px;
			}

.commentlist {
	margin: 0px;
	padding: 0px;
	}

	.commentlist li {
			clear: left;
			padding: 10px 0px;
			list-style: none;
	}

	.comment-details {
			}

	.vcard {
			display: block;
			float: left;
			width: 130px;
			background: url('img/avatar-bg.jpg') no-repeat;
			}

			.vcard a {
				border: none;
                                color: #375A90;
					}

			.vcard img.avatar {
					margin: 0 40px 0 0;
					-moz-box-shadow:1px 1px 4px rgba(0,0,0,0.4);
					-webkit-box-shadow:1px 1px 4px rgba(0,0,0,0.4);
					border:5px solid #FFFFFF;
					margin:0 40px 5px 0;
			}

		.vcard .fn {
				font-weight: bold;
                                text-shadow: 0px 1px 0px rgba(256,256,256,.5);
				font-style: normal;
				white-space: nowrap;
				display: block;
				}

		.vcard .says {
				display: none;
				}

		.commentmetadata {
				display: block;
				float: left;
				width: 130px;
				}

	.comment-text {
			display: block;
			float: left;
			width: 400px;
			background: #cacaca;
			border: solid #fff 1px;
			padding: 20px;
			position: relative;
			margin: 0px 0px 10px;
			text-shadow: 0px 1px 0px #ddd;
			border: solid #fff 1px;
			-moz-border-radius: 10px;
			-webkit-border-radius: 10px;
			-moz-box-shadow: 1px 1px 0px #bbb;
			-webkit-box-shadow: 1px 1px 0px #bbb;
			}

			#talk-image {
					position: absolute;
					left: -20px;
					top: 10px;
					}

	#comment-reply {
			margin-left: 150px;
			clear: left;
			padding: 10px 0px;
			}

					.commentlist .children {
						border-left: solid #999 1px;
						margin-left: 0px;
						}

						.commentlist .children li {
							padding-left: 25px;
							background: url('img/child-comment-line.gif') no-repeat 0px 25px;
							}

/* Respond Styles */

#respond {
		background: #cacaca;
		padding: 20px 20px 10px;
		width: 530px;
		position: relative;
		margin: 20px 0px 10px;
		border: solid #fff 1px;
		-moz-border-radius: 10px;
		-webkit-border-radius: 10px;
		-moz-box-shadow: 1px 1px 0px #bbb;
		-webkit-box-shadow: 1px 1px 0px #bbb;
		}

		#respond h3 {
				text-shadow: 0px 1px #fff;
				}

		#respond-image {
				position: absolute;
				top: -20px;
				left: 10px;
				}


			#comment {
					width: 508px;
					padding: 10px;
					-moz-border-radius: 5px;
					-webkit-border-radius: 5px;
					border: solid #999 1px;
					-moz-box-shadow: 0px 1px 0px #fff;
					-webkit-box-shadow: 0px 1px 0px #fff;
					}

		#respond #gravatar-preview {
				width: 128px;
				height: 128px;
				float: left;
				border: solid #fff 5px;
				-moz-box-shadow: 2px 2px 2px rgba(0,0,0,.4);
				-webkit-box-shadow: 2px 2px 2px rgba(0,0,0,.4);
				margin: 0px 25px 0px 0px;
				}

		#comment-details {
				width: 367px;
				float: left;
				}

			#respond label {
					width: 80px;
					font-weight: bold;
					text-shadow: 0px 1px 0px #fff;
					display: block;
					float: left;
					text-align: right;
					padding: 8px 10px;
					}

			#respond input.text {
					border: solid #999 1px;
					-moz-border-radius: 5px;
					-webkit-border-radius: 5px;
					padding: 8px;
					width: 249px;
					-moz-box-shadow: 0px 1px 0px #fff;
					-webkit-box-shadow: 0px 1px 0px #fff;
					}

			#respond #submit {
					width: 293px;
					height: 40px;
					background: url('img/submit-comments.png') no-repeat left top;
					border: none;
					text-indent: -9999px;
					margin: 10px 0px 0px 235px;
					cursor: pointer;
					}

					#respond #submit:hover {
							background-position: left center;
							}


					#respond #submit:active {
							background-position: left bottom;
							}