* {padding:0; margin:0;}

html {height: 100%;  min-height: 100%;}

body {
      width: 100%;
      height: 100%; 
      min-height: 100%; 
      font-family: 'Moderat', sans-serif;
      color:#181819; 
      font-size:26px;  
      line-height: 1.4em; 
      background:#fff; 
      }

body {
  -webkit-animation-duration: 0.1s;
  -webkit-animation-name: fontfix;
  -webkit-animation-iteration-count: 1;
  -webkit-animation-timing-function: linear;
  -webkit-animation-delay: 0.1s;
}
@-webkit-keyframes fontfix {
  from { opacity: 1; }
  to { opacity: 1; }
}

@font-face {
   font-family: Moderat;
   src: url(fonts/moderat-regular-webfont.woff);
   src: url(fonts/moderat-regular-webfont.woff2);
}

:focus {outline:none;}
::-moz-focus-inner {border:0;}
a {text-decoration:none; color:#a5a5a5;}
a:visited {
    color: #a5a5a5;
}
a:hover {
    color: #181819;
    border-bottom:1px solid #181819;
}

ul {list-style:none;}
img {border:none;}
h1, h2 ,h3 {font-weight:300; color:#181819;}
h1, h2, .big-text {font-size:26px; line-height:1.4em;}
h1 a {color:#181819;}
h3 {font-size:15px;}
p {margin:18px 0;}

b { 
    font-weight: normal;
    color:#f2f2f2;
}

.image-personal { width:100%; } 

#wrapper {position:relative; width:100%; height:100%;}

#content {position:relative; width: 100%; height: 100%; min-height: 100%;}

.w1, .w2, .w3, .w4, .w5 {position:relative;}

.w1 { width:100%; 
      margin-top: 60px;
} 

.w2 {width:94%;} 

.w3 {width:49.2%;} 

.w4 {width:55%;} 

.w5 {width:55%; color:#a5a5a5;}

.box {overflow:hidden; padding:98px 20px 20px 20px;}

.boxfooter {overflow:hidden; padding:0px 20px 53px 20px;}


.w2 .box {padding:80px 20px 20px 20px;}

.w3 .box {padding:20px 20px 20px 30px;}

.logo {position:absolute; left:20px; top:15px; z-index:99;}

.logo br {display:none;}

/*Menu*/

/*#menu {position:absolute; right:0; top:0; z-index:1000;}*/

#header {position:fixed; width:100%; height:60px; top:0; left:0; /*background:#f5f5f5;*/ opacity: 0.93; transition: top 0.2s ease-in-out; z-index:1001}
.nav-up { top: -60px;}
.hamburger {position:fixed; right:0; top:5px; padding:20px;}

.menu {display:none; position:absolute; right:0; top:0; bottom:0; width:50.8%; height:100%; color: #f5f5f5; z-index:1000;}

.menu li {display:block; line-height:50px;}

.menu a {color:#f5f5f5; font-size:20px; padding-bottom:0.125em; }

.menu a span {font-family: 'Roboto Mono', monospace; font-size:15px; letter-spacing: 0.0625em; color: #888888;}

.menu a:hover {border-bottom:1px solid #f5f5f5;}

/*About*/

#about {display:none; position:absolute; right:0; top:0; bottom:0; width:94%; height:100%; z-index:1003; color:#a5a5a5;}
.about-bg, .menu-bg {display:none; position:fixed; right:0; top:0; bottom:0; width:100%; height:100%; z-index:1001;}
.about-bg {background:#181819;}
.menu-bg {z-index:999; background:#181819; width:50.8%;}

#about .box {}

#about p.big-text {margin-top:0;}

#about li {margin:18px 0;}

#about li span {display:block; font-size:18px;}

/*a.about:link { color:#141414; border-bottom:1px solid #141414!important; }
a.about:hover { border-bottom:1px solid #141414; }
a.about:visited { border-bottom:1px solid #141414!important; }*/

#about a {color: #a5a5a5; border-bottom: 1px solid;}

#about a:hover {color: #f2f2f2; border:none;}

#footer a {color: #f2f2f2;
    border-bottom:1px solid #f2f2f2;}

#about .social a {color:#a5a5a5; border-bottom: 1px solid;}
#about .social a:hover {color: #a5a5a5; border:none;}

#page {width:100%; height:auto; margin-top:100px; left:0;}

.screen {position:relative; width:100%; height:auto; left:0; top:0; right:0; bottom:0; overflow:hidden; margin-bottom:120px;}

/*projects*/

.slider-detail {position:absolute; right:0; top:0; width:94%; height:60px; z-index:23; cursor:pointer;}

.slider-detail .bg {position:absolute; background:#181819; left:0; right:0; top:0; bottom:0; width:100%; height:100%; filter: alpha(opacity=0); opacity: 0; z-index:-1;}

.slider-detail:hover .bg {filter: alpha(opacity=100); opacity: 1.0; color: #f2f2f2;}

.slider-detail .box, .project-detail .box {padding:13px 20px 20px 20px;}

.project-detail {display:none; position:absolute; width:94%; height:100%; right:0; top:0; background:#181819; z-index:22;}
.newcolor {color:#f2f2f2 !important;}

.project-detail .big-text {margin-top:60px; width: 75%; color: #f5f5f5;}

.project-text-margin {margin:66px 0px 12px 0px; font-size:26px; line-height:1.4em; width: 56%; color: #a5a5a5;}

.project-text {font-size:26px; line-height:1.4em; width: 56%; color: #a5a5a5; margin: 12px 0;}

.detail-left {color:#181819; float:left; font-size:26px;}
.detail-left span, .project-detail a {font-size:26px; color:#a5a5a5; }
.project-detail a { border-bottom:1px solid #a5a5a5; }
.project-detail a:hover {color:#a5a5a5; border:none;}
.detail-right {position:relative; float:right;}
.slider-detail:hover .detail-left {color:#f2f2f2;}
.rsSlideCount {position:absolute; right:50px; top:0; font-size:26px; color:#a5a5a5; z-index:11;}

.more {color:#a5a5a5; font-size:26px; margin:5px 0;}
.more a:hover { border-bottom:1px solid #181819; }

.close {
  display:none; 
  position:fixed; 
  border-bottom:0px !important;
  color: #a5a5a5;
  right:0; 
  top:1px; 
  padding:20px;
  width:30px; 
  height:30px; 
  z-index:1004;
}

.close:hover {
  border-bottom:0px !important;
  text-decoration:none !important;
color: #f2f2f2;
  }

.close:before {
  content: '';
  position:fixed; 
  right:20px; 
  top:35px; 
  width: 24px;
  height: 2px;
  background-color: currentColor;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

.close:after {
  content: '';
  position:fixed; 
  right:20px; 
  top:35px; 
  width: 24px;
  height: 2px;
  background-color: currentColor;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}

.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; height: auto; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.btn {position:absolute; width:100%; height:100%; left:0; top:0; right:0; bottom:0; z-index:999;}
.btn.active {}

.default {position:absolute; z-index:-1;}
.fixed {position:fixed; z-index:998;}

.scrollup {display:none; position:fixed; color: #181819; left:7px; top:2px; padding:20px; z-index:999;}
.scrollup span { 
	display:block;
  width: 1px;
  height: 16px;
  background-color: currentColor;
  margin-top: -1px;
}

.scrollup span:before {
  content: '';
  position: absolute;
  left: 15px;
  top: 20px;
  width: 10px;
  height: 10px;
  border-top: solid 1px currentColor;
  border-right: solid 1px currentColor;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.scrollup:hover {border:none !important;}

.white {color:#fff;}

.clear {clear:both; height:0; line-height:0; overflow:hidden; margin:0; padding:0;}
.fl {float:left;}
.fr {float:right;}
.rel {position:relative;}
.abs {position:absolute;}
.fix {position:fixed;}
.tcenter {text-align:center;}
.tleft {text-align:left;}
.tright {text-align:right;}
.marg {margin:30px 0;}
.padd {padding:30px 0;}
.hdd {overflow:hidden;}
.nobg {background:none !important;}
.noborder {border:none !important;}
.nomarg {margin:0 !important;}
.nopadd {padding:0 !important;}

/*Mobile link bug*/
a[href^=tel]{
    color:inherit;
    text-decoration:none;
}

/* disable transitions on container */
.transitions-enabled.infinite-scroll.masonry {
  -webkit-transition-property: none;
     -moz-transition-property: none;
       -o-transition-property: none;
          transition-property: none;
}
::selection {
  background: #000000; /* WebKit/Blink Browsers */
  color:#FFF;
}
::-moz-selection {
  background: #000000; /* Gecko Browsers */
  color:#FFF;
}