html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, small, strike, strong, sub, sup, dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;outline:0;font-size:100.01%;background:transparent} ol, ul {list-style: none} :focus {outline:0} table {border-collapse:collapse;border-spacing:0} label, input[type=checkbox]{cursor:pointer}

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on July 5, 2010 06:05:26 PM America/New_York */



@font-face {
	font-family: 'TitilliumText22LThin';
	src: url('../fonts/TitilliumText22L001-webfont.eot');
	src: local('☺'), url('../fonts/TitilliumText22L001-webfont.woff') format('woff'), url('../fonts/TitilliumText22L001-webfont.ttf') format('truetype'), url('../fonts/TitilliumText22L001-webfont.svg#webfontHIqteXlE') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'TitilliumText22LLight';
	src: url('../fonts/TitilliumText22L002-webfont.eot');
	src: local('☺'), url('../fonts/TitilliumText22L002-webfont.woff') format('woff'), url('../fonts/TitilliumText22L002-webfont.ttf') format('truetype'), url('../fonts/TitilliumText22L002-webfont.svg#webfonthJHMIxiW') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'TitilliumText22LRegular';
	src: url('../fonts/TitilliumText22L003-webfont.eot');
	src: local('☺'), url('../fonts/TitilliumText22L003-webfont.woff') format('woff'), url('../fonts/TitilliumText22L003-webfont.ttf') format('truetype'), url('../fonts/TitilliumText22L003-webfont.svg#webfontCVZ9BHQN') format('svg');
	font-weight: normal;
	font-style: normal;
}



html {min-height:100%}
body {

  background-color: #f7f7f7;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#c3c3c3)); 
  background-image: -webkit-linear-gradient(top, #f7f7f7, #c3c3c3); 
  background-image:    -moz-linear-gradient(top, #f7f7f7, #c3c3c3); 
  background-image:     -ms-linear-gradient(top, #f7f7f7, #c3c3c3); 
  background-image:      -o-linear-gradient(top, #f7f7f7, #c3c3c3); 
  background-image:         linear-gradient(top, #f7f7f7, #c3c3c3);
            filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f7f7f7', EndColorStr='#c3c3c3'); 

color:#fff;
font:normal 15px TitilliumText22LRegular, sans-serif;
min-width:960px
}
@-webkit-keyframes rotator {
 from {
-webkit-transform: scale(0.1) rotate(0deg);
left:450px;
top:-50px
}
to {
-webkit-transform: scale(1.0) rotate(360deg);
left:10px;
top:15px
}
}
#logosmall {
-webkit-animation-name: rotator;
-webkit-animation-duration: 2s;
-webkit-animation-direction: alternate;
-webkit-animation-timing-function: linear;
-webkit-animation-iteration-count:1;
height:120px;
left:10px;
position:absolute;
top:15px;
z-index:1
}
#canvasLogo {
height:710px;
left:50%;
margin:-355px 0 0 -355px;
position:fixed;
top:50%;
width:710px;
z-index:1
}
#container {
margin:0 auto;
position:relative;
width:1180px;
z-index:2
}
#logo {
padding:0 0 20px;
position:relative;
z-index:3
} 
#content {
display:table;
margin-left:260px;
padding:20px 0 0;
position:relative;
/*width:525px;*/
z-index:2
}
.section_holcer {
display:table-row
}
section {
display:block;

 display: table-cell;
   vertical-align: middle;
}
small {font-size:13px}


h1 {
color:#fff;
font-family:TitilliumText22LThin, sans-serif;
font-size:60px;
font-weight:100;
line-height:1.3;
text-shadow:#000 0px 0px 10px;
}
h1 a {
display:block
}
h2 {
color:#fff;
font:normal 40px/1.3 TitilliumText22LThin, sans-serif;
padding:0 0 20px;
text-shadow:#222222 5px 5px 12px;
}
h3 {
color:gold;
font:normal 24px/1.3 TitilliumText22LRegular, sans-serif;
padding:0 0 10px;
text-shadow:#000 0px 0px 15px;
}
p {
color:#111;
line-height:1.5;
padding-bottom:15px
}
#navigation {
background-color:#999;
background-color:rgba(0,0,0,0.25);
-moz-border-radius:120px;
-webkit-border-radius:120px;
border-radius:120px;
height:200px;
left:0;
padding:20px 0;
position:absolute;
top:300px;
width:240px;
     -moz-transition: all 0.3s ease-out;  
       -o-transition: all 0.3s ease-out;  
  -webkit-transition: all 0.3s ease-out;  
      -ms-transition: all 0.3s ease-out;  
          transition: all 0.3s ease-out;  

}
#navigation:hover {
background-color:rgba(0,0,0,0.5);

     -moz-transition: all 0.3s ease-out;  
       -o-transition: all 0.3s ease-out;  
  -webkit-transition: all 0.3s ease-out;  
      -ms-transition: all 0.3s ease-out;  
          transition: all 0.3s ease-out;  

}
#navigation a {
display:block;
font:bold 14px Verdana,sans-serif;
margin:auto;
padding:15px 0;
position:relative;
text-align:center;
text-decoration:none;
width:172px
}
#navigation .active {
color:gold;
}
#navigation em {
position:relative;
z-index:10
}
a {
color:#fff;
text-decoration:none;

     -moz-transition: all 0.3s ease-out;  
       -o-transition: all 0.3s ease-out;  
  -webkit-transition: all 0.3s ease-out;  
      -ms-transition: all 0.3s ease-out;  
          transition: all 0.3s ease-out;  

}
a:hover {
color:gold;

     -moz-transition: all 0.3s ease-out;  
       -o-transition: all 0.3s ease-out;  
  -webkit-transition: all 0.3s ease-out;  
      -ms-transition: all 0.3s ease-out;  
          transition: all 0.3s ease-out;  

}

#work {
overflow:hidden
}
#work hr {
display:none
}
.workItem {
background-color:rgba(0,0,0,0.05);
float:left;
height:253px;
margin:0 20px 30px 10px;
outline:10px solid rgba(0,0,0,0.05);
overflow:hidden;
position:relative;
width:410px;

     -moz-transition: all 0.3s ease-out;  
       -o-transition: all 0.3s ease-out;  
  -webkit-transition: all 0.3s ease-out;  
      -ms-transition: all 0.3s ease-out;  
          transition: all 0.3s ease-out;  

}
.workItem:hover {
background-color:rgba(0,0,0,0.15);
outline:10px solid rgba(0,0,0,0.15);

     -moz-transition: all 0.3s ease-out;  
       -o-transition: all 0.3s ease-out;  
  -webkit-transition: all 0.3s ease-out;  
      -ms-transition: all 0.3s ease-out;  
          transition: all 0.3s ease-out;  

}
.workItem:last-child {margin-bottom:0}
.workItem time {
position:absolute;
right:0;
top:0
}
.workItem span {
bottom:0;
display:block;
left:0;
position:absolute;
width:410px
}
.workItem h3 {
padding-bottom:15px
}
.workItem img {
left:0;
position:absolute;
top:0;
width:410px;
z-index:1
}

.skillType {
display:inline-block;
vertical-align:top;
width:220px
}
.skillType ul {
color:white;
font-size:18px;
padding-bottom:20px
}
.skillType li {
padding:4px 0
}
.skillType ul span {
color:#666
}
#contact {padding-left:200px}
#contact h2 {}
#contact img {margin-right:4px;vertical-align:middle}


@media all and (max-width: 1200px) {
  #container {
  width:960px
  }
  #contact {padding-left:100px}
}