/*DEFAULT FRAMEWORK */

html{
    height:100%;
}
body {
  text-align: center;
  min-width: 1044px;
  background-color: #000000;
  font-family:Georgia, Times New Roman, Times, Serif;
  font-size:.9em;
  color:#3b3b3b;
  }
#wallpaper{
    position:absolute;
    left:50%;
    top:0px;
    margin-left:-1000px;
    width:2000px;
    height:1454px;
    background-image:url(../images/wallpaper_rococo.jpg);
    background-repeat:no-repeat;
} 
#wallpapermask{
    position:absolute;
    left:0px;
    width:100%;
    height:2000px;
    overflow:hidden;
}

#canvas {
	position:relative;
	top:0px;
	width:1044px;
	height:100%;
	overflow:visible;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	z-index:2;
}
#iewarning{
    position:absolute;
    right:40px;
    top:30px;
    z-index:200;
    }
#header{
    position:relative;
    width:1044px;
    height:325px;
    background-image:url(../images/bed_header_tree.png);
    background-repeat:no-repeat;
    z-index:1;
    }
#body{
    position:relative;
    width:1044px;
    min-height:400px;
    padding-top:20px;
    background-image:url(../images/bed_body.png);
    background-repeat:repeat-y;
    z-index:2;
    }
#footer{
    position:relative;
    width:1044px;
    padding-left:40px;
    padding-top:3px;
    height:66px;
    z-index:3px;
    background-image:url(../images/bed_footer.png);
    background-repeat:no-repeat;
    }
    
/*TIPTOOL  */ 
#tiptool{
    position:absolute;
    width:264px;
    height:132px;
    background-image:url(../images/bed_tiptool.png);
    z-index:1000;
}
#tiptoolText{
    position:absolute;
    width:224px;
    height:90px;
    left:30px;
    top:30px;
    text-align:left;
}
    
/*INFOBOX LARGE  */   
#info{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    z-index:999;
}
#infoCover{
    position:absolute;
    top:0px;
    left:0px;
    width:110%;
    height:1000px;
    margin-left:-20px;
    background-color:#000000;
    opacity: 0.8;
	-moz-opacity: 0.8;
	filter: alpha(opacity=80);
    z-index:1;
}
#infoHolder{
    position:absolute;
    width:630px;
    height:660px;
    left:50%;
    top:50%;
    margin-left:-320px;
    margin-top:-330px;
    text-align:left;
    background-image:url(../images/bed_infobox_large.png);
    z-index:2;
}
h1.infoHeading{
    position:absolute;
    color:#CCCAAE;
    left:25px;
    top:24px;
    font-size:1.3em;
    letter-spacing:0.1em;
    }
div.infoTextarea{
    position:absolute;
    left:30px;
    top:90px;
    width:570px;
    height:450px;
    margin-bottom:20px;
    }
#infoClosebutton{
    position:absolute;
    right:20px;
    top:20px;
    }
img.infoClosebuttonimage{
    border:none;
    cursor:pointer;
}
#downloadbrowserpad{
    position:absolute;
    top:490px;
    left:40px;
    }

/*YOUTUBEPLAYER  */   
#youtubeplayer{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    z-index:999;
}
#youtubeCover{
    position:absolute;
    top:0px;
    left:0px;
    width:110%;
    height:1000px;
    margin-left:-20px;
    background-color:#000000;
    opacity: 0.8;
	-moz-opacity: 0.9;
	filter: alpha(opacity=90);
    z-index:1;
}
#youtubeHolder{
    position:absolute;
    width:831px;
    height:700px;
    left:50%;
    margin-left:-415px;
    text-align:left;
    background-image:url(../images/bed_youtube.png);
    z-index:2;
}
#youtubeswfHolder{
    position:absolute;
    left:16px;
    top:50px;
    width:800px;
    height:481px;
    z-index:3;
}
h1.youtubeHeading{
    position:absolute;
    color:#CCCAAE;
    left:25px;
    top:24px;
    font-size:1.3em;
    letter-spacing:0.1em;
    }
#youtubeClosebutton{
    position:absolute;
    right:20px;
    top:20px;
    }
img.youtubeClosebuttonimage{
    border:none;
    cursor:pointer;
}   
    
/*DEFAULT TAGS */
A:link{
    color:#3b3b3b;
    } 
A:visited{
    color:#747474;
    }    
A:hover{
    color:#3b3b3b;
    }    




/*GENERIC CLASSES AND ELEMENTS */
#iewarningimg{
    cursor:pointer;
    } 
   
   
   
/*FOOTER ELEMENTS AND CLASSES */

#footerAddress{
    position:relative;
    float:left;
    height:20px;
    width:887px;
    color:#d2d0c0;
    text-align:center;
    padding-top:10px;
    letter-spacing:1px;
    }
#footerAddressEmblem{
    position:relative;
    float:left;
    width:38px;
    height:34px;
    }
A.footerAddressLink:link{
    color:#d2d0c0;
    }   
A.footerAddressLink:visited{
    color:#d2d0c0;
    } 
    
    
/* CLEARING CLASS */
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.clearfix {
	display: inline-block;
}

html[xmlns] .clearfix {
	display: block;
}

* html .clearfix {
	height: 1%;
}
   
    
/*---------------------------------------------*/    
/*PROJECT ELEMENTS AND CLASSES */
/*---------------------------------------------*/
#project{
    float:left;
    width:629px;
    min-height:200px;
    padding-left:21px;
    padding-right:22px;
    z-index:20;
}
#projectList{
    position:relative;
    width:100%;
    min-height:100px;
}
div.projectImageFrame{
    float:left;
    background-color:#515033;
    width:250px;
    height:230px;
    background-image:url(../images/bed_imageframe.png);
    }
img.projectImageFrameImage{
    float:left;
    margin-left:9px;
    margin-top:10px;
    margin-bottom:5px;
    border:1px solid #5f5e3d !important;
    z-index:2;
}    
p.projectCopyright{
    color:#898871;
    font-size:.8em;
    font-style:italic;
    margin-left:10px;
    margin-right:10px;
    }
div.projectTextArea{
    float:left;
    width:358px;
    min-height:200px;
    padding-left:20px;
    padding-bottom:30px;
}
div.projectStatistics{
    position:relative;
    width:318px;
    background-color:#c4c3a5;
    padding:20px;
    }
h1.projectTitle{
    font-size:1.6em;
    letter-spacing:.2em;
    margin-bottom:0px;
    margin-top:0px;
    }
p.projectText{
    font-size:1.1em;
    margin-top:0px;
    margin-bottom:4px;
}
ol.projectTextList{
    font-size:1.1em;
}
li.projectTextList{
    margin-bottom:4px;
    }
p.projectClient{
    margin-top:0px;
    margin-bottom:0px;
}
p.projectClient:before{
    content:"Client: ";
    font-weight:bold;
    }
p.projectTechnology{
    margin-top:0px;
    margin-bottom:0px;
}
p.projectTechnology:before{
    content:"Tools used: ";
    font-weight:bold;
    }
span.projectTechnologyItem{
    font-size:.7em;
    background-color:#515033;
    color:#FFFFFF;
    margin-left:1px;
    margin-right:1px;
    padding-left:2px;
    padding-right:2px;
}
p.projectDate{
    margin-top:0px;
    margin-bottom:0px;
    text-transform:capitalize;
}
p.projectDate:before{
    content:"When: ";
    font-weight:bold;
    }
p.projectType{
    margin-top:0px;
    margin-bottom:0px;
}
p.projectType:before{
    content:"Project type: ";
    font-weight:bold;
    }




/*BLOG ELEMENTS AND CLASSES */
#blog{
    float:left;
    width:350px;
    min-height:200px;
    right:22px;
    z-index:1;
}
#blogOrnament
{
	position:absolute;
	top:40px;
	left:608px;
	width:64px;
	height:622px;
	background-image:url(../images/element_rightpane_ornament.png);
}
#blogList{
    position:relative;
    width:350px;
    right:0px;
    padding-bottom:20px;
    background-color:#d8d7c3;
    
}
H1.blogHeader{
  width:350px;
  height:32px;
  background-color:#515033;
  color:#dbdac6;
  font-size:1em;
  font-weight:normal;
  letter-spacing:1px;
  padding-top:0px;
  margin-top:0px;
  vertical-align:top;
}  
A.blogMoreButton:link{
    font-style:italic;
    color:#3b3b3b;
    }
A.blogMoreButton:visited{
    font-style:italic;
    color:#3b3b3b;
    }
p.blogMoreButtonPosition{
    width:340px;
    text-align:right;
    padding-right:10px;
    }
img.blogHeaderIcon{
    vertical-align:middle;
}
p.twitterPost{
    font-size:20px;
    font-style:italic;
    padding-left:20px;
    padding-right:5px;
}
p.twitterPost:before{
    content: open-quote;
    }
p.twitterPost:after{
    content: close-quote;
    }
img.flickrIcon{
    position:relative;
    float:left;
    width:75px;
    height:75px;
    margin:6px;
    }
img.flickrIcon:hover{
    position:relative;
    float:left;
    width:75px;
    height:75px;
    margin:6px;
    }
#youtubeThumbnailHolder{
    position:relative;
    width:350px;
    height:260px;
}
img.youtubeThumbnailImage{
    position:relative;
    width:350px;
    height:260px;
    }
img.youtubeClicktoplaybutton{
    position:absolute;
    left:65px;
    top:90px;
    cursor:pointer;
}