/*   
Theme Name: Alan on the Roof
Theme URI: http://www.vfxdude.com/downloads/
Description: a product of moving to a great new house!
Author: Alan Laidlaw
Author URI: http://www.vfxdude.com
Template: missioncommander
Version: 1.0.2
*/

/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video{ display: block; }
mark, rp, rt, ruby, summary, time{ display: inline }

* {text-rendering: optimizeLegibility !important;}
a {text-decoration: none;}

@font-face {
	font-family: 'Cleopatra';
	src: url('../../fonts/vonnes/cleopatra-webfont.eot');
	src: local('☺'), url('../../fonts/vonnes/cleopatra-webfont.woff') format('woff'), url('../../fonts/vonnes/cleopatra-webfont.ttf') format('truetype'), url('../../fonts/vonnes/cleopatra-webfont.svg') format('svg');
	font-weight: normal;
	font-style: normal; }
    
@font-face {
	font-family: 'Vonnes-LightExt';
	src: url('../../fonts/vonnes/vonnes-lightextended-webfont.eot');
	src: local('☺'), url('../../fonts/vonnes/vonnes-lightextended-webfont.woff') format('woff'), url('../../fonts/vonnes/vonnes-lightextended-webfont.ttf') format('truetype'), url('../../fonts/vonnes/vonnes-lightextended-webfont.svg') format('svg');
	font-weight: normal;
	font-style: normal; }

@font-face {
	font-family: 'Vonnes-Thin';
	src: url('../../fonts/vonnes/vonnes-thin-webfont.eot');
	src: local('☺'), url('../../fonts/vonnes/vonnes-thin-webfont.woff') format('woff'), url('../../fonts/vonnes/vonnes-thin-webfont.ttf') format('truetype'), url('../../fonts/vonnes/vonnes-thin-webfont.svg') format('svg');
	font-weight: normal;
	font-style: normal; }

@font-face {
	font-family: 'Vonnes-LightCon';
	src: url('fonts/vonnes/vonnes-lightcondensed-webfont.eot');
	src: local('☺'), url('fonts/vonnes/vonnes-lightcondensed-webfont.woff') format('woff'), url('fonts/vonnes/vonnes-lightcondensed-webfont.ttf') format('truetype'), url('fonts/vonnes/vonnes-lightcondensed-webfont.svg') format('svg');
	font-weight: normal;
	font-style: normal; }

@font-face {
	font-family: 'Vonnes-BookComp';
	src: url('../../fonts/vonnes/vonnes-bookcompressed-webfont.eot');
	src: local('☺'), url('../../fonts/vonnes/vonnes-bookcompressed-webfont.woff') format('woff'), url('../../fonts/vonnes/vonnes-bookcompressed-webfont.ttf') format('truetype'), url('../../fonts/vonnes/vonnes-bookcompressed-webfont.svg') format('svg');
	font-weight: normal;
	font-style: normal; }

@font-face {
	font-family: 'Vonnes-BookExt';
	src: url('fonts/vonnes/vonnes-bookextended-webfont.eot');
	src: local('☺'), url('fonts/vonnes/vonnes-bookextended-webfont.woff') format('woff'), url('fonts/vonnes/vonnes-bookextended-webfont.ttf') format('truetype'), url('fonts/vonnes/vonnes-bookextended-webfont.svg') format('svg');
	font-weight: normal;
	font-style: normal; }
	
/*----------------- FONT FACE TYPOGRAPHY ----------------- */
#headerfeatures .blog-title a, ul.navigation li a {font: 14px 'Vonnes-LightExt', Arial, sans-serif; color: black; line-height: .6; text-transform: inherit;}
.post.photoblog .post-title h2 a {font: 26px 'Vonnes-LightExt'; color: #eee /*#6c2c76; text-shadow:1px 1px 0 #F1F1F1, 2px 2px 0 #666666;*/ text-transform: uppercase;text-decoration: none; }
h1, h2, h3, .post .post-title a, a.thumb-link { font: 20px 'Vonnes-LightExt', Arial, sans-serif; line-height: 1; letter-spacing: -.3px; /*text-shadow: #fff 2px 2px 1px;*/}

.clearfix { *zoom:1;}
.clearfix:after {content: ""; display: block; clear: both; visibility: hidden; font-size: 0; height: 0;}

html body {	background-color: /*#fef4f2*/ #fff;background: url("http://alanlaidlaw.com/wp-content/uploads/2010/07/spaceBackgroundWhite.jpg") right no-repeat; background-position-y: -50px; background-attachment: fixed; font-size: 14px/1.8;}
#container {background: none; padding: 0 10px 50px 10px; }
#header { margin-bottom: 0; }
#topheader { height: 130px; background-color: none;  }
#topheader .inside { position: relative; }

post-title h2 a {color:#00C9ED; }
#headerfeatures { float:left; margin-top: 10px; width: 100%; position: relative;}
#headerfeatures .blog-title a {color: black;text-decoration: none; font-size: 25px; margin: 40px 0 0 20px;}

#headerfeatures p.description { font: 12px 'Vonnes-Thin', Arial, sans-serif; letter-spacing: 2px;color:#a92502 ; border: none; padding: 0; margin: 20px 0 0; float: left; position: absolute; bottom: 0; left: 110px;}
#headerfeatures p.description em {font: 14px "Century";letter-spacing: 0px; margin-left: -3px; color: #222; /*color:#00e0fe;*/}

ul.navigation {margin-top: -30px; float:right; width: auto;}
ul.navigation.navboxes { margin-top: 12px; }
ul.navigation.navboxes li {}
ul.navigation.navboxes li a { color: #999; font-weight:normal; }
#topheader ul.navigation.navboxes li a:hover { background-color:#444; text-decoration:none; }
#topheader ul.navigation.navboxes li.current_page_item a { color: #00c9ed; }
ul.navigation li.current_page_item a, ul.navigation li.current-menu-item a, ul.navigation li.current-cat a { color: #660000; }


ul.navigation li a{ color: #a92502; }

#social { position: absolute; right: 0px; top: 5px; }
#social ul.navigation.navboxesbg li a { padding: 4px 12px; background-color: #444; color: #ddd; font-weight:normal; font-size:12px; }
#social ul.navigation.navboxesbg li a:hover { background-color:#555; text-decoration:none; }
#footer { margin: 0; background-color:#333; padding: 20px 0;}
#footer .inside, #topheader .inside { width: 848px; }
#footer-widgets a { color: #eee; }
#footer-widgets h2 { color: #eee; }
#footer-widgets ul li ul li { border-bottom: 1px #666 solid; }
#footer-widgets { border-top: none;	margin-top: 0; color: #eee;	padding-bottom: 40px; }

article.three_column {-moz-column-count:3; -moz-column-gap:14px; column-count:3; column-gap:14px;
padding:20px 12px;}
.single aside {clear: both; width: 100%; background: rgba(0, 224, 253, 0.7); padding: 10px;}

/* Site-wide properties ======================================================== */
body{font: normal normal 14px/14px Tahoma, Arial, Helvetica, Verdana, sans-serif; line-height: 1.8; color: #140036; background: white;}
    
    /* Fibonacci based heading scale ratio */
    h1{ font-size: 4.4em; font-weight: normal; }
    h2{ font-size: 2.8em; font-weight: bold; }
    h3{ font-size: 1.6em; font-weight: bold; }
    h4{ font-size: 1.2em; font-weight: bold; }

/* Reusable classes ============================================================ */

/* Left & Right alignment */
.left{ float: left; }
.right{ float: right; }

/* The inside class provides consistent padding. To be used often! */
.inside{ padding: 20px; }

/* The fraction classes are useful for column lists */
.half, .quarter, .fifth, .sixth{ width: 100%; }

.third {padding-top: 51px; overflow: hidden;}

.half li, .third li, .quarter li, .fifth li, .sixth li{ float: left; }
.half li{ padding-left:20px; margin:0; width: 45% }
.third li{  padding-left:20px; margin: 0;width: 28.3% }
.quarter li{  padding-right: 5%; width: 20% }
.fifth li{  padding-right: 5%; width: 15% }
.third li.last {padding-right: none;}

/* For when a <br /> just ain't enough */
.separator{
    clear: both;
    float: left;
    height: 5px;
    display: block;
    z-index: 4;
    background: url(dot.png);
    border-bottom: none;
    width: 100%;
    margin-bottom: 40px; }

/* Basic Structure ============================================================= */
.wrap, header{
    margin: 0 auto;
    position: relative;
    width: 810px;
    display: block;
    overflow: hidden;
    /*background: transparent url(../img/24_col.gif) repeat-y;*/
    }

    /* Header */

    
    /* Content 
    article{
        float: right;
        width: 66.7%;
         }*/
    article ul {display: block; float: left;}
    
    .article {width: 710px; display: block; margin-left: 110px; font-size: 12px; line-height: 2.1em;}
    /* Sidebar */
    aside{
        float: left;
        width: 33.3%; }
        
    /* Footer */
    footer{
        float: left;
        width: 100%; }
    
/* Project specifics =========================================================== */
/* Pour some CSS below ========================================================= */

header { overflow: hidden; padding-top: 25px; display: block;}
#logo a{background: ; width: 82px; height: 82px; display: block; }
#title { margin-left: 30px; padding-top: 48px; }
h1 a {color: black;text-decoration: none; }

#container a img:hover {background:/*#00dbfc*/ #f1f1f1; -moz-box-shadow: inset 0 0 5px #7e3680; -webkit-box-shadow: inset 0 0 5px #7e3680; box-shadow: inset 0 0 5px #7e3680;}

nav {clear: both; text-align: right; width: 100px; margin-top: 20px; }
	nav li {margin-left: 0px; padding-right: 10px; overflow: hidden;}
	li a {line-height: 1.8;font-size: 14px; padding-right: 10px; width: 100%; display: block; color: #a92502;}
	li a:hover, .selected {/*background: #00e0fe; background: rgba(0, 224, 253, 0.7);*/ color: #660000; }
.call_to_action {background: #666; display: block; overflow: hidden; width: 60px; height: 60px; padding: 10px;}

.portfolio {overflow: hidden; width: 370px; padding: 10px;background: #666; display: block; margin-top: 20px; margin-left: 20px; margin-right: 30px;}
.portfolio article{padding: 15px;}
.review {position: relative;width: 230px; margin-top: 25px; font-size: 12px; line-height: 2.1em;}

#photo {background: #8e7e93; border: black 1px solid;  padding: 5px; margin-top: 20px;float: right;}
#photo a * { display: none;}
#photo a, #photo a .hover{height: 228px; width: 150px; position: relative; display: block;background: url(../img/photoOfMeFull.jpg) 0 0 no-repeat;}
#photo a .hover {background-position: bottom;}
/* The H1 declarations - for @font-face presentational purposes only */

.intro { background: rgba(0, 224, 253, 0.7) /*rgba(0,179,244,0.5)*/; display: block; position: absolute; top: 75px; width: 50%; right: 0; padding: 15px 0 20px 75px;z-index: 2; }
.intro aside {width: 460px; margin-left: -55px; }

.intro aside, .single aside {font: 24px 'Vonnes-LightExt', Arial, sans-serif; color: white; line-height: 1.1; letter-spacing: 1.2px; text-shadow: #00bad3 0 1px 0; }
.intro aside em {font-family: 'Vonnes-BookExt'; font-style: normal; color: /*rgba(255, 187, 243,.7)  rgba(255, 74, 0, .5) rgba(255, 29, 174, .5) #673b86*/; }
.call_to_action a {font: 32px 'Vonnes-BookComp', Arial, sans-serif; color: white; text-transform: uppercase;letter-spacing: 1.4px; line-height: .95; text-shadow: #140036 0px 1px 0; -webkit-text-stroke: 1px transparent; }
.fancy {font-size: 22px; letter-spacing: -.05em; text-transform: uppercase; color: #8c3123;text-shadow: #fff 0px 1px 0;}
.cleo {font-family: 'Cleopatra';}
.bookComp {font-family: 'Vonnes-BookComp';}
.dropcap1{ font-size: 60px; color:#eee; float:left; line-height:25px; margin-bottom:-10px;margin-right:10px;  padding:20px 1px; text-align:center; text-shadow: #140036 0px 1px 0; width:40px; background: #666;}
.dropcap2{ font-size: 90px; color:rgba(255, 187, 243,.7); float:left; height:60px; line-height:30px; margin-bottom:-10px;margin-right:10px; padding-left:1px; padding-top:25px; text-align:center; text-shadow: #140036 0px 1px 0; width:45px;}
.textwidget p {opacity: .5;color: #1e1e1e;  font-size: .9em; }
.textwidget p:hover {opacity: 1;}
#sidebar .widgetheading h2 {
background:none repeat scroll 0 0 #00d4fc;
color:#FFFFFF;
display:inline;
font-family:Arial,Helvetica,sans-serif;
font-size:13px;
padding:3px 10px;
text-decoration:none;
}