@import url("reset.css");

/* ------ layout
-----------------------------------------------*/

@font-face {
    font-family: 'MelbourneRegular';
    src: url('../font/melbourne_reg-webfont.eot');
    src: url('../font/melbourne_reg-webfont-.eot#iefix') format('embedded-opentype'),
         url('../font/melbourne_reg-webfont.woff') format('woff'),
         url('../font/melbourne_reg-webfont.ttf') format('truetype'),
         url('../font/melbourne_reg-webfont.svg#MelbourneRegular') format('svg');
}
html, body {
margin:0;
padding:0;
overflow:hidden;
}

body {
font-family:Arial, Verdana, Helvetica, sans-serif;
font-size:13px;
color:#e5e7e2;
height:100%;
width:100%;
background:#fff;
}

.loader {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:#fff;
}

#background {
position:fixed;
z-index:-1;
visibility:hidden;
}


#content {
position:fixed;
z-index:5;				
overflow:hidden; 			
height:100%;
width:100%;
}

.home {
position:fixed;
top:0;
left:50%;
width:320px;
margin-left:-160px;
height:100%;
background:rgba(0, 0, 0, .8);
}

.home .homeback {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:url(../images/homeback.png) no-repeat center;
}

.home .copyrights {
position:absolute;
left:0;
bottom:10px;
width:320px;
color:#888;
font-size:9px;
text-transform:uppercase;
text-align:center;
} 

.home .inside {
position:absolute;
top:50%;
margin-top:-180px;
left:0;
width:100%;
text-align:center;
}

.home .logo, .home .slogan {
clear:both;
display:inline-block;
text-indent:-9999px;
outline:none;
background-repeat:no-repeat;
margin-bottom:70px;
}

.home .logo {
width:165px;
height:93px;
background-image:url(../images/logo.png);
}

.home .slogan {
width:280px;
height:52px;
background-image:url(../images/slogan.png);
}

.home .box {
float:left;
clear:both;
width:100%;
}

.home .menu {
margin-bottom:50px;
}

.home .menu a {
font-family:'MelbourneRegular', Arial, Verdana, Helvetica, sans-serif;
text-shadow:1px 1px 0 #444;
font-size:16px;
text-transform:uppercase;
outline:none;
color:#fff;
}

.home .menu a:hover {
color:#eee;
}

.home .menu li {
padding-bottom:15px;
margin-bottom:15px;
background:url(../images/line.png) no-repeat center bottom;
}

.home .menu .last {
margin-bottom:0;
padding-bottom:0;
background:none;
}

.home .social li {
display:inline-block;
margin-right:5px;
}

.home .social .last {
margin-right:0;
}

.home .social a {
display:inline-block;
width:32px;
height:32px;
text-indent:-9999px;
outline:none;
background-repeat:no-repeat;
}

.home .social .twitter {
background-image:url(../images/icons/twitter.png);
}

.home .social .facebook {
background-image:url(../images/icons/facebook.png);
}

.home .social .google {
background-image:url(../images/icons/google.png);
}

.home .social .forrst {
background-image:url(../images/icons/forrst.png);
}

.home .social .dribbble {
background-image:url(../images/icons/dribbble.png);
}

.home .social span {
font-family:'Georgia', 'Times New Roman', Arial, Helvetica, sans-serif;
font-size:11px;
font-style:italic;
position:absolute;
left:0;
bottom:-25px;
width:100%;
display:none;
}
.slide {
position:fixed;
top:0;
left:-100%;
height:100%;
}

.slide .close {
position:absolute;
top:70px;
right:70px;
width:12px;
height:12px;
outline:none;
text-indent:-9999px;
background:url(../images/close.gif) no-repeat center;
padding:1px;
}

.slide .main {
position:absolute;
top:0;
left:0;
width:360px;
padding:70px;
color:#171717;
background:#f9f9f9;
line-height:24px;
}

.slide .main p a {
text-decoration:underline;
}

.slide .side {
position:absolute;
top:-100%;
left:500px;
padding:70px;
width:140px;
background:rgba(0, 0, 0, .8);
}

.side ul li {
margin-bottom:20px;
padding-bottom:20px;
border-bottom:1px solid #333;
}

.side .last {
margin-bottom:0;
padding-bottom:0;
border:none;
}

.side li a {
color:#f5f5f5;
font-family:'Georgia', 'Times New Roman', Arial, Helvetica, sans-serif;
font-style:italic;
}

.side li a:hover {
color:#eee;
}

.form .text, .form .textarea, .form .select {
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-o-box-sizing:border-box;
box-sizing:border-box;
}

.form label {
float:left;
width:30%;
margin-right:5;
padding:10px 0;
text-align:right;
font-weight:bold;
}

.form .text, .form .textarea, .form .select {
padding:10px;
border:1px solid #eee;
width:65%;
}

.skills li {
font-size:11px;
text-transform:uppercase;
line-height:18px;
}

.skills .percent {
float:right;
width:50%;
position:relative;
}

.skills span {
position:absolute;
top:0;
right:0;
background:#eee;
color:#aaa;
text-align:center;
height:17px;
}

/* ------ heading
-----------------------------------------------*/

h2, h3, h4, h5 {
font-family:'MelbourneRegular', Arial, Verdana, Helvetica, sans-serif;
text-transform:uppercase;
font-weight:normal;
}

h2, h3 {
padding-bottom:20px;
margin-bottom:20px;
border-bottom:1px solid #eee;
}

h2 {
font-size:28px;
}

h3 {
text-transform:none;
font-size:22px;
color:#aaa;
line-height:26px;
}

h3.btop {
padding-top:20px;
margin-top:20px;
border-top:1px solid #eee;
}

.side h2 {
color:#f5f5f5;
border-color:#333;
}


/* ------ links
-----------------------------------------------*/
a:link, a:visited {
color:#111;
text-decoration:none;
}

a:hover {
text-decoration:none;
}

/* Localized */