@charset "UTF-8";

html { height:100%; font-size:62.5%; }
body { 
position:relative;
margin-left:auto; margin-right:auto; width:auto; height:auto; 
background:#000; 
color:#666;
font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;
font-weight:100;
-webkit-text-size-adjust: 100%;
}
section {
background:#FFF;
}
a, a:hover {
text-decoration:none;
}
h1 {
font-size:60px;
font-weight:100;
-webkit-margin-before: 0;
-webkit-margin-after: 0;
margin:0;
line-height:100px;
}
p {
font-size:32px;
font-weight:100;
-webkit-margin-before: 0;
-webkit-margin-after: 0;
margin:0;
}
.DSmenu {
width:300px; 
background:#FFF; 
-webkit-transform:translateX(-300px);	
transform:translateX(-300px);	
-webkit-transition:ease .5s;
transition:ease .5s;
position:absolute; 
position:fixed; 
top:0; 
left:0;
z-index:9999;
}
.DSmenu.action {
width:300px; 
background:#FFF; 
-webkit-transform:translateX(0);	
transform:translateX(0);	
}
.DSmenu .DSbtn {
position:absolute; top:0; 
right:-100px; 
background:#FFC800; 
width:100px; 
height:100px; 	
-webkit-transition:ease .5s;
transition:ease .5s;
cursor:pointer;
}
.DSmenu .DSbtn:hover {
position:absolute; 
top:0; 
right:-100px; 
background:#FFC800; 
width:100px; 
height:100px;	
}
.DSmenu.action .DSbtn {
}

ul {
width:100%;	
-webkit-margin-before: 0;
-webkit-margin-after: 0;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-start: 0px;
}
ul li {
padding:10px 20px;
background:#FFF;
width:100%;
font-size:24px;
}
ul a li {
color:#999;
}
ul li:hover {
background:#F6F6F6;
width:100%;
}

.DSmenu .DSbtn .hambarg:nth-child(1) {
position:absolute;
top:30%;
left:50%;
-webkit-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
height:1px;
width:60px;
background:#333;
-webkit-transition:ease .5s;
transition:ease .5s;
}
.hambarg:nth-child(2) {
position:absolute;
top:50%;
left:50%;
-webkit-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
height:1px;
width:60px;
background:#333;
-webkit-transition:ease .5s;
transition:ease .5s;
}
.hambarg:nth-child(3) {
position:absolute;
top:70%;
left:50%;
-webkit-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
height:1px;
width:60px;
background:#333;
-webkit-transition:ease .5s;
transition:ease .5s;
}
.DSmenu.action .DSbtn .hambarg:nth-child(1) { 
top:50%;
-webkit-transform:translate(-50%,-50%) rotate(45deg);
transform:translate(-50%,-50%) rotate(45deg);
 }
.DSmenu.action .DSbtn .hambarg:nth-child(2) { 
top:50%;
-webkit-transform:translate(-50%,-50%);
transform:translate(-50%,-50%);
opacity:0;
 }
.DSmenu.action .DSbtn .hambarg:nth-child(3) { 
top:50%;
-webkit-transform:translate(-50%,-50%) rotate(-45deg);
transform:translate(-50%,-50%) rotate(-45deg);
 }
.head-bar {
background:#333; 
position:absolute; 
position:fixed; 
top:0; 
left:0; 
width:100%; 
height:100px; 
overflow:hidden;
}

.section {
-webkit-transition:ease .5s;
transition:ease .5s;	
}
.section.blur {
opacity:0.25;
transform:translateX(100px);
-webkit-filter: blur(5px);
filter: blur(5px);
}

@media (max-width:767px){
h1 {
font-size:32px;
line-height:50px;
}
p {
font-size:24px;
}
.DSmenu .DSbtn {
position:absolute; top:0; 
right:-50px; 
background:#FFC800; 
width:50px; 
height:50px; 	
-webkit-transition:ease .5s;
transition:ease .5s;
}
.DSmenu .DSbtn:hover {
position:absolute; 
top:0; 
right:-50px; 
background:#FFC800; 
width:50px; 
height:50px;	
}
.DSmenu .DSbtn .hambarg:nth-child(1) {
height:1px;
width:30px;
}
.hambarg:nth-child(2) {
height:1px;
width:30px;
}
.hambarg:nth-child(3) {
height:1px;
width:30px;
}
.head-bar {
height:50px; 
}

}