@charset "utf-8";
/*
                                                                                                                                                                                                                                                                   
`7MMM.     ,MMF'         mm     mm   `7MM"""Yp,                     *MM                 `7MM                      
  MMMb    dPMM           MM     MM     MM    Yb                      MM                   MM                      
  M YM   ,M MM   ,6"Yb.mmMMmm mmMMmm   MM    dP `7Mb,od8 `7MM  `7MM  MM,dMMb.   ,6"Yb.    MM  ,MP'.gP"Ya `7Mb,od8 
  M  Mb  M' MM  8)   MM  MM     MM     MM"""bg.   MM' "'   MM    MM  MM    `Mb 8)   MM    MM ;Y  ,M'   Yb  MM' "' 
  M  YM.P'  MM   ,pm9MM  MM     MM     MM    `Y   MM       MM    MM  MM     M8  ,pm9MM    MM;Mm  8M""""""  MM     
  M  `YM'   MM  8M   MM  MM     MM     MM    ,9   MM       MM    MM  MM.   ,M9 8M   MM    MM `Mb.YM.    ,  MM     
.JML. `'  .JMML.`Moo9^Yo.`Mbmo  `Mbmo.JMMmmmd9  .JMML.     `Mbod"YML.P^YbmdP'  `Moo9^Yo..JMML. YA.`Mbmmd'.JMML.   

*/
@font-face {
    font-family: 'mattbru';
    src:url('/assets/fonts/mattbru.eot?7zri04');
    src:url('/assets/fonts/mattbru.eot?#iefix7zri04') format('embedded-opentype'),
    url('/assets/fonts/mattbru.woff?7zri04') format('woff'),
    url('/assets/fonts/mattbru.ttf?7zri04') format('truetype'),
    url('/assets/fonts/mattbru.svg?7zri04#mattbru') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* old color:  B1E40A  */
:root {
    --primary: #44ff00;
    --primary-rgb: 68,255,0;
    --secondary: #EAFF00;
    --dark: #1c1e23;
    --med:  #292c31
}

::-moz-selection { background-color: var(--dark); color: var(--primary); }
::selection { background-color: var(--dark); color: var(--primary); }

::placeholder { color: #555; }
::-webkit-input-placeholder { color: #555; }
:-ms-input-placeholder {color: #555; }

*, *:before, *:after {
	box-sizing: border-box;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {

}

html { height: 100%; overflow-y: scroll; }

body {
    height: 100%;
    margin: 0; padding: 0;
    font: 100% Arial, Helvetica, sans-serif;
    font-family: 'Noto Sans', sans-serif; 
    font-size: 20px;
    line-height: 24px;
    text-align: center;
    position: relative;
    /*background: url('/assets/images/darkcloth.jpg') 0 0 repeat #292c31;*/
    background: url('/assets/images/bg-left-code-overlay.png') 0 -50px no-repeat,
              url('/assets/images/bg-right-code-overlay.png') 100% -50px no-repeat,
              url('') 0 0 repeat var(--dark);
              /*url('/assets/images/darkcloth.jpg') 0 0 repeat #292c31;*/
	color: #efefef;
}
.touch { /*overflow-x:hidden; -webkit-overflow-scrolling: touch;*/ }
.touch .body { overflow-x:hidden; }

a:link, a:visited, a:active, acronym { color: #efefef; text-decoration: none; display: inline-block; border-bottom: 1px dotted #41464D; }
a:hover { color: var(--primary); border-bottom: 1px dotted var(--primary); }

/* buttons */
.rarr:after { display: inline-block; margin-left: 10px; font-family: 'mattbru'; content: '\e64b'; 
position: relative; top: 1px; right: 3px; 
          transition: all 1s ease-out;
          backface-visibility: hidden;
}

.btn.rarr:hover:after { right: -6px; 
          transition: all .2s ease-out;
}
.btn,
a.btn { 
  cursor: pointer;
  display: inline-block;
  background: rgba(28,30,35,0.3);
  border: 1px solid #40464f; border-color: rgba(28,30,35,0.4);
  color: #fff;
  padding: 8px 22px;
  outline: none;
}
.btn:hover {
  text-decoration: none;
  border-style: solid;
  border-color: var(--primary);
  color: var(--primary);
  background: rgba(28,30,35,0.8);
}
.btn.dark {
  background-color: rgba(16,17,22,0.7);
  border-color: rgba(16,17,22,0.9);
}
.btn.lrg { padding: 18px 50px; font-size: 20px; border-width: 3px; }


ul, ul li { list-style-type: none; }

h1,h2,h3,h4,h5,h6 { 
    text-transform: uppercase; 
    font-family: "Montserrat", sans-serif;
    color: #fff; 
    text-align: left; 
}
h2 { max-width: 1230px; margin: 0 auto 30px; }
h2 { color: var(--primary); }
h2+p { text-align: left; }
h2[class^="i-"] span { display: inline-block; margin-left: 12px; }
.np { padding: 0; }
h3 { font-size: 16px; margin-top: 0; text-transform: none; } 
h4 { font-size: 14px; text-transform: none; } 

/* Home */
.hero h3, .hero h2, .hero h1 { margin: 0 auto; text-align: center!important; position: relative;  top: 0; }
.hero h2, .hero h1 { background: rgba(10,10,10,0.8); display: inline-block; text-align: center; padding: 15px 50px;
  overflow: hidden;
	max-width: 100%;
	transform: skew(-45deg);
}
.hero h1 {
	margin-top: 4px;
    font-size:  20px;
}
.hero h3 { 
      color: #fff;
      font-weight: bold;
      font-size: 90px; 
      padding: 0; 
      opacity: 0;
      /*border: 6px solid var(--primary);*/
      width: 68%; 
      max-width: 860px;
      margin: 0 auto;
/*text-shadow: rgba(30,30,30,0.2) .01em .01em 0,
			rgba(30,30,30,0.2) .02em .02em 0,
			rgba(30,30,30,0.2) .03em .03em 0,
			rgba(30,30,30,0.2) .04em .04em 0,
			rgba(30,30,30,0.2) .05em .05em 0,
			rgba(30,30,30,0.2) .06em .06em 0,
			rgba(30,30,30,0.2) .07em .07em 0,
			rgba(30,30,30,0.2) .08em .08em 0,
			rgba(30,30,30,0.2) .09em .09em 0,
			rgba(30,30,30,0.2) .1em .1em 0;*/

}
.shine-mask { top: -999em; }
.shine-letter { 
  position: relative; 
  z-index: 1000; 
      backface-visibility: hidden;
}
.hero h3 > div { font-size: inherit; }
/*.hero h3 span {display: inline-block; }*/
.hero h3 span span {
        transform: skew(0deg);
    }
.hero h2 { font-size: 40px; opacity: 0; width: 1066px; }
.hero h1 { font-size: 25px; opacity: 0; width: 916px; font-weight: normal;  color: #fff; }
.hero h2 span,
.hero h1 span {
	display: block;
	transform: skew(45deg);
}
.hero h2 span i { color: #EAFF00; }
.hero h2 span i,
.hero h1 span i { font-style: normal; }

.hero { position: relative; 
          backface-visibility: hidden;
}
.hero header { background: url('/assets/images/bg_topline.png') center 0 repeat-x #111; position: relative; overflow: hidden; height: 100%; }
.hero hgroup { position: absolute; top: 50%; left: 0; right: 0; z-index: 150; }

.hero img.main { width: 100%; margin-top: 6px; margin-bottom: -7px;
    position: relative;
    z-index: 1;
    filter: blur(40px);
    transition: all 2s ease-out;
    backface-visibility: hidden;
}
/*.hero.noblur,*/
.hero.noblur img.main {
    filter: blur(0);
    transition: none;
    transition: all 0s ease-out;
}

.parawrapper { position: absolute; width: 100%; height: 100%; /*background: url('/assets/images/home-hero1.jpg') center center no-repeat; background-size: cover;*/ }
.overlays { list-style-type: none; width: 100%; height: 100%; margin: 0; padding: 0; position: relative; z-index: 10; display: block;  overflow: hidden; }
.overlays li { list-style-type: none; /*position: absolute;*/ /*width: 100%; */ }
.overlays li img { position: relative; /*position: absolute;*/ }

.overlays li.lle img { bottom: -100px; left: -10%; }
.overlays li.lri img { bottom: -50px; left: 80%; }
.overlays li.lmi img { bottom: 0; left: 0; right: 0; }
.overlays li.dei img { top: 25%; left: 30%; }
.overlays li.ait img { top: 15%; right: 30%; }
.overlays li.pst img { top: 15%; left: 20%; }
.overlays li.at2 img { top: 20%; right: 20%; }

.overlays li img { opacity: 0; }

h2 { font-size: 32px; }

[class^="i-"]:before, [class*=" i-"]:before {
  font-family: 'mattbru';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.i-hex:before {content: "\e640"; }
.i-home:before {content: "\e600"; }
.i-pencil:before {content: "\e601"; }
.i-pen:before {content: "\e602"; }
.i-image:before {content: "\e603"; }
.i-image2:before {content: "\e604"; }
.i-camera:before {content: "\e605"; }
.i-dice:before {content: "\e606"; }
.i-book:before {content: "\e607"; }
.i-books:before {content: "\e608"; }
.i-file:before {content: "\e609"; }
.i-folder-open:before {content: "\e60a"; }
.i-tag:before {content: "\e60b"; }
.i-tags:before {content: "\e60c"; }
.i-ticket:before {content: "\e60d"; }
.i-bubbles:before {content: "\e60e"; }
.i-bubbles2:before {content: "\e60f"; }
.i-spinner:before {content: "\e610"; }
.i-zoomin:before {content: "\e611"; }
.i-zoomout:before {content: "\e612"; }
.i-expand:before {content: "\e613"; }
.i-contract:before {content: "\e614"; }
.i-expand2:before {content: "\e615"; }
.i-contract2:before {content: "\e616"; }
.i-wrench:before {content: "\e617"; }
.i-cog:before {content: "\e618"; }
.i-pie:before {content: "\e619"; }
.i-trophy:before {content: "\e61a"; }
.i-rocket:before {content: "\e61b"; }
.i-globe:before {content: "\e61c"; }
.i-earth:before {content: "\e61d"; }
.i-link:before {content: "\e61e"; }
.i-flag:before {content: "\e61f"; }
.i-eye:before {content: "\e620"; }
.i-bookmark:before {content: "\e621"; }
.i-star:before {content: "\e622"; }
.i-star2:before {content: "\e623"; }
.i-star3:before {content: "\e624"; }
.i-info:before {content: "\e625"; }
.i-close:before {content: "\e626"; }
.i-checkmark:before {content: "\e627"; }
.i-checkmark2:before {content: "\e628"; }
.i-minus:before {content: "\e629"; }
.i-plus:before {content: "\e62a"; }
.i-play:before {content: "\e62b"; }
.i-filter:before {content: "\e62c"; }
.i-facebook:before {content: "\e62d"; }
.i-github:before {content: "\e62e"; }
.i-wordpress:before {content: "\e62f"; }
.i-skype:before {content: "\e630"; }
.i-pinterest:before {content: "\e631"; }
.i-file-pdf:before {content: "\e632"; }
.i-file-openoffice:before {content: "\e633"; }
.i-file-word:before {content: "\e634"; }
.i-file-excel:before {content: "\e635"; }
.i-file-zip:before {content: "\e636"; }
.i-file-powerpoint:before {content: "\e637"; }
.i-file-xml:before {content: "\e638"; }
.i-file-css:before {content: "\e639"; }
.i-html5:before {content: "\e63a"; }
.i-html52:before {content: "\e63b"; }
.i-css3:before {content: "\e63c"; }
.i-chrome:before {content: "\e63d"; }
.i-firefox:before {content: "\e63e"; }
.i-IE:before {content: "\e63f"; }
.i-lightning:before {content: "\e64d"; }
.i-checkbox-checked:before {content: "\e64e"; }
.i-checkbox-unchecked:before {content: "\e64f"; }
.i-checkbox-partial:before {content: "\e650"; }
.i-radio-checked:before {content: "\e651"; }
.i-radio-unchecked:before {content: "\e652"; }
.i-code:before {content: "\e641"; }
.i-facebook2:before {content: "\e642"; }
.i-facebook3:before {content: "\e643"; }
.i-github2:before {content: "\e644"; }
.i-wordpress2:before {content: "\e645"; }
.i-skype2:before {content: "\e646"; }
.i-linkedin:before {content: "\e647"; }
.i-paperplane:before {content: "\e653"; }
.i-heart:before {content: "\e654"; }
.i-tools:before {content: "\e655"; }
.i-tag2:before {content: "\e656"; }
.i-palette:before {content: "\e657"; }
.i-book2:before {content: "\e658"; }
.i-briefcase:before {content: "\e659"; }
.i-network:before {content: "\e65a"; }
.i-battery:before {content: "\e65b"; }
.i-clipboard:before {content: "\e65c"; }
.i-info2:before {content: "\e65d"; }
.i-arrow-left:before {content: "\e648"; }
.i-arrow-down:before {content: "\e649"; }
.i-arrow-up:before {content: "\e64a"; }
.i-arrow-right:before {content: "\e64b"; }
.i-linkedin2:before {content: "\e64c"; }


.home .burger + section {
  background: url('/assets/images/bg-left-code-overlay.png') 0 -50px no-repeat,
              url('/assets/images/bg-right-code-overlay.png') 100% -50px no-repeat;
              padding-top: 30px;
}
.burger + section { padding-top: 60px; }

/* nav */

.navbar { /*border-bottom: 1px solid #40464f;*/ background: rgba(28,30,35,0.3); top: 0; }
body:not(.home) .navbar { width: 100%!important; position: fixed; z-index: 100; }
.navbar ul li a { 
    transition: all 0.3s ease-out;
    font-family: 'Montserrat';
    letter-spacing: 1px;
  }
.scrolled .navbar ul li a { padding: 4px 16px; }

.navbar nav { max-width: 1230px; margin: 0 auto; position: relative;}

.navbar nav:before { display: block; opacity: 0; content: ''; width: 400px; height: 140px; background-color: var(--primary); background-color: rgba(28,30,35,0.7); position: absolute; 
    top: -150px; left: 50%; margin-left: -245px;
    transition: all 0.3s ease-out;
    backface-visibility: hidden;
    transform: skew(-65deg, 28deg) ;
}
.scrolled .navbar nav:before {
  top: -220px;
}
.noblur + .navbar nav:before { opacity: 1; }

.navbar nav:after { content: ''; display: table; width: 100%; clear:both; }
.navbar ul { list-style-type: none; display: block; float: left; padding: 0; margin: 0; }
.navbar ul li { list-style-type: none; display: inline-block;/* margin-right: 15px;*/ }
.navbar ul li:last-of-type { margin-right: 0; }
.navbar ul li a { text-transform: uppercase; padding: 18px 16px; display: block; position: relative; z-index: 50; text-decoration: none; border-bottom: none; }
.navbar ul li a:hover { color: #000;  }
.navbar ul li a:before,
.navbar ul li a:after {
    display: block; height: 0; content: ''; width: 100%; position: absolute; top: 0; left: 0; z-index: -1;
            transition: all 0.3s ease-out;
     backface-visibility: hidden;
}
.navbar ul li a:after { bottom: 0; top: auto; }
.navbar ul li:hover a:before,
.navbar ul li:hover a:after { background-color: var(--primary); height: 100%; }

.navbar .cube { 
    width: 129px; height: 148px; 
    background: url('/assets/images/m-cube.png') 50% 50% no-repeat; 
    background-size: 100%; position: absolute; top: -60px; left: 50%; margin-left: -59px; z-index: 50; cursor:pointer; 

            transition: all 0.3s ease-out;
            backface-visibility: hidden;
}
.navbar .cube div { 
    width: 100%; height: 100%; background: url('/assets/images/m.png') 50% 50% no-repeat; background-size: 100%; position: absolute; top: 0; 
    filter:  invert(1) saturate(1.5);
}
.navbar .cube a { display: block; width: 100%; height: 100%; border-bottom: none; }
.navbar .cube a:hover { text-decoration: none; border-bottom:none; }
.home .navbar .cube, .home .navbar .cube div { opacity: 0; }
.navbar .cube + ul { float: right; }
.navbar .cube:hover { 
    /*-webkit-filter: brightness(1.25) hue-rotate(15deg) contrast(1.5); */
    filter: brightness(1.25) hue-rotate(15deg) contrast(1.5); 
    top: -60px; 
    text-decoration: none; 
}

/* mobile menu */
.mmenu { display: none; }
.mm-menu { background-color: var(--dark); width: 200px; /*z-index: 500;*/ }
html.mm-opening .mm-page, html.mm-opening #mm-blocker, html.mm-opening .mm-fixed-top, html.mm-opening .mm-fixed-bottom { left: 200px; }
#mm-blocker { cursor: pointer; }


nav.mmenu a { 
    font-family: 'Noto Sans', sans-serif; text-transform: uppercase; text-align: left; padding-left: 40px; border-bottom: transparent;  
    transition: all 0.3s ease-out;
    backface-visibility: hidden;
}
nav.mmenu a:before { 
    position: absolute; left: 12px; top: 12px; 
    transition: all 0.3s ease-out;
    backface-visibility: hidden;
}
backface-visibility: hidden;
html:not(.touch) nav.mmenu a:hover { color: var(--primary); border-bottom: transparent; background-color: rgba(16,17,22,0.8); padding-left: 50px; }
html:not(.touch) nav.mmenu a:hover:before { color: var(--primary); left: 16px; }
.mm-list > li:not(.mm-subtitle):not(.mm-label):not(.mm-noresults):after { margin-left: 0; }
.row { width: auto; }

.home .row h2 { 
    font-size: 26px; margin: 20px auto; }
.home .row h2 span { 
    display: inline-block; padding: 0 20px; background-color: var(--dark); position: relative; z-index: 2; }
.home .row h2:before { 
    display: block; width: 100%; height: 1px; content: ''; 
    position: relative; top: 16px; z-index: 1; 
    background-color: #40464f; 
    background: linear-gradient(to right,  rgba(64,70,79,0) 0%,rgba(64,70,79,0.8) 15%,rgba(64,70,79,1) 19%,rgba(64,70,79,1) 50%,rgba(64,70,79,1) 81%,rgba(64,70,79,0.8) 85%,rgba(64,70,79,0) 100%); /* W3C */

} 
.home .dark h2 span { background-image: none; background-color: var(--dark); /*background-color: rgba(24,27,31,0.7);*/ } 
.dark { background-color: var(--primary);  background-color: rgba(24,27,31,0.7);  }

section > div { padding: 90px 0; }


/* home : portfolio ----------------------  */
.home h2 { text-align: center; }
.home .portfolio h2 { margin-top: 0; }
.home .portfolio h4 { font-size: 16px; text-align: left; padding-left: 10px; }
.home .portfolio .twelve { max-width: 100%!important; }
.home .portfolio .twelve,
.home .portfolio .ten { padding: 0; }
.home .portfolio .mix { width: 19.5%; display: inline-block!important; margin-bottom: 0; opacity: 0; 
  backface-visibility: hidden;
}
.home .portfolio small { position: absolute; top: 115px; left: 50%; margin-left: -35px; color: #60687b; font-size: 12px; }
.home .portfolio .mix img { width: 100%; }

.by-cat { display: block; clear: both; }
.by-cat h4 { display: inline-block; }
.by-cat ul { list-style-type: none; display: inline-block; }
.by-cat ul li { display: inline-block; }
.by-cat ul li a { display: block;
  background: rgba(28,30,35,0.3); border: 1px solid #40464f; border-color: rgba(28,30,35,0.4); color: #fff; padding: 5px 12px; 
}
.by-cat ul li a:hover { background: rgba(28,30,35,0.9); color: var(--primary); border: 1px solid #000; }


.home .block-grid.one-up li { margin: 0 0 6px; padding-bottom: 0; }
.home .block-grid.one-up a {
  position: relative;
  display: block;
  background: rgba(28,30,35,0.3); border: 1px solid #40464f; border-color: rgba(28,30,35,0.4); color: #fff; padding: 5px 12px; 
}
.home .block-grid.one-up a:hover { background: rgba(28,30,35,0.9); color: var(--primary); }
.home .two,
.home .ten .three { padding: 0; }

.btn.primary,
.by-cat ul li a.primary,
.home .block-grid.one-up a.primary { 
    border-color: var(--primary); 
    color: #333; 
    color: var(--primary); 
    &:hover {
        background-color:  var(--dark);
        background-color:  #000;
    }
}

.columns b { color: var(--primary); }

.block > li{
  display: block;
  text-align: left;
  background: rgba(28,30,35,0.3);
  border: 1px solid #40464f; border-color: rgba(28,30,35,0.4);
  border-color: rgba(28,30,35,0.4);
  color: #fff;
  position: relative;
  padding: 15px;
  margin-bottom: 15px;
}
.block li:after { display: block; content: ''; clear: both; }
.block .th.fl { padding-right: 15px; float: left; }

/*.block h5 { display: block; }*/
.block h5,
.block h5 a { color: var(--primary); font-weight: normal; text-transform: none; }
.block .column,
.block .columns { padding: 0; }

.home .intro h3 { text-align: center; font-size: 20px; margin: 25px 0 45px; color: var(--primary); }
.home .intro h3:after { 
    display: inline-block; content: ''; 
    width: 84px; height: 67px; 
    background: url('/assets/images/site-arrow.png') 0 0 no-repeat; 
    position: relative; top: 15px; left: 15px; 
}
.home .intro p { max-width: 67%; margin: 0 auto; font-size: 21px; line-height: 2; text-align: center; }

section > .row > .twelve,
footer > .row > .twelve { max-width: 1230px; margin: 0 auto; float: none; }
.row.recent .twelve { max-width: 1282px; padding-left: 34px; }
.row.recent .twelve h2 { margin-top: 0; }
.row.recent .twelve:before,
.row.recent .twelve:after { display: block; clear: both; width: 100%; content: ''; }
.row.recent .three { overflow: hidden; padding: 0 12px; cursor: pointer; }
.row.recent .three img { 
      transform: rotate(0deg) scale(1.04);
            transition: all 0.2s ease-out;
          backface-visibility: hidden;
}
.row.recent .three.hover img {
      transform: rotate(0deg) scale(1.40);
}
.row.recent figure { overflow: hidden; width: 100%; position: relative; }
.row.recent figure > a { display: block; border:none!important; overflow: hidden; width: 100%; }
.row.recent figcaption {
  display: block;
  color : #fff;
  text-align: center;
  width: 100%;
  padding: 10px 10px 30px;
  background: rgba(0,0,0,0.8);
  position: absolute;
  bottom: -90px;
  z-index: 50;
}
.row.recent figcaption > span {
  display: inline-block; position: relative; bottom: -50px;
}
.row.recent figcaption > span a {
  text-decoration: none;
  color: var(--primary);
  display: inline-block;
  border-width: 0;
  padding-bottom: 0;
transition: all 0.2s ease-out;
}
.row.recent figcaption > span a:hover {
  padding-bottom: 4px;
  border-bottom: 2px solid #ff0099;
  color: #ff0099;
}

/* swiper */
.swiper-container {
    width: 100%;
    height: 650px;
    height: auto;
}
.swiper-container:before,
.swiper-container:after { width: 20%; content: ''; position: absolute; left: 0; top: 0; bottom: 0; z-index: 8;
  pointer-events: none;
  background: linear-gradient(to right,  rgba(28,31,36,1) 0%,rgba(28,31,36,1) 2%,rgba(28,31,36,0) 100%); /* W3C */

}
.swiper-container:after { left: auto; right: 0; 

  background: linear-gradient(to right,  rgba(28,31,36,0) 0%,rgba(28,31,36,1) 99%,rgba(28,31,36,1) 100%); /* W3C */
    pointer-events: none;
}
.swiper-wrapper>div a { border-bottom: none; max-width: 100%; }
.swiper-wrapper img { max-width: 100%; }
.swiper-container.swiper-container-horizontal > .swiper-pagination { bottom: 0; }
.swiper-slide a span { color: #60687b; display: block; }
.swiper-slide a:hover span { color: var(--primary); }
.swiper-slide a:hover img { filter: brightness(120%); }
.swiper-slide a span { color: #fff; }
.swiper-pagination .swiper-pagination-bullet { background-color: #60687b; }
.swiper-pagination .swiper-pagination-bullet-active { background: #fff; }
.swiper-container { padding-bottom: 60px; }

.swiper-container .swiper-button-prev, 
.swiper-container .swiper-container-rtl .swiper-button-next,
.swiper-container .swiper-button-next, 
.swiper-container .swiper-container-rtl .swiper-button-prev { background-image: none; }

.swiper-container .swiper-button-prev:before, 
.swiper-container .swiper-container-rtl .swiper-button-next:before,
.swiper-container .swiper-button-next:before, 
.swiper-container .swiper-container-rtl .swiper-button-prev:before { 
    background-image: none;
    content: '';
    font-family: 'mattbru';
    display: block;
    color: var(--primary);
    position: relative;
    z-index: 15;
    right: -14px;
    top: 2px;
    font-size: 40px;
}
.swiper-container .swiper-button-next:before { content: '\e64b'; right: 0; }
.swiper-container .swiper-button-prev { left: -15px; }
.swiper-container .swiper-button-prev:before { content: '\e648'; }

.testimonials {
  padding: 100px 0;
  .row .twelve {
    max-width:  1400px;
  }
}
.testimonials blockquote { 
  padding: 32px;
  background-color: #1d2025;
  border:none;
    padding-top: 100px;
    margin-top: 100px;
    margin-top: clamp(60px,6vw,100px);
    position: relative;
    img {
        display: block;
        margin-bottom:  16px;
    }
}
.testimonials blockquote:before { 
    display:block;
    content: '';
    background: url('/assets/images/quote-green.png');
    background-size:  100%;
    height: 153px;
    width: 187px;
    position: absolute;
    left: 50%;
    top: -40px;
    transform: translateX(-50%);
}
.testimonials blockquote mark {
    background-color:  #0b3908;
    color:  var(--primary);
}

.eyebrow {
    text-transform: uppercase;
    letter-spacing: 4px;
    margin-bottom: 20px!important;
    font-size: 16px!important;
    background-color: #0b3908;
    display: inline-block;
    padding: 8px 12px;
}
.eyebrow:after {
    display:none!important;
}
blockquote cite { color: #949494; display: block; margin-top: 20px; font-style: normal; } 
blockquote cite strong { color: var(--primary); font-weight: bold; display: block; font-weight: normal; }
blockquote cite span { display: block; font-weight: normal; color: var(--primary); opacity: 0.8; }
blockquote img {
    display: block;
    margin-bottom:  16px;
}
.testimonials cite { color: #677283; }


.th img { border: none; border-radius: 0; box-shadow: none; outline: none; }
ul.breadcrumbs { background: none; border: none; }
ul.breadcrumbs li a { opacity: 0.35; text-decoration: none; }
ul.breadcrumbs li a:hover { opacity: 1; }
ul.breadcrumbs li,
ul.breadcrumbs li a { font-size: 11px; text-transform: uppercase; }
/*ul.breadcrumbs .bc0:before { content: "\e600"; font-family: 'mattbru'; display: inline-block; }*/
ul.breadcrumbs .bc0:before { display: none; }
/*ul.breadcrumbs li:last-of-type:before { margin-right: 10px; }*/

.link-block li a {
  display: block;
  background: rgba(28,30,35,0.3);
  border: 1px solid #40464f; 
  border-color: rgba(28,30,35,0.4);
  color: #fff;
  position: relative;
  padding: 12px 16px;
  outline:none; 
  font-size: 16px;
}
.link-block li a:after { 
  display: inline-block; 
  font-family: 'mattbru'; 
  content: '\e64b'; 
  color: #40464f; 
  font-size: 20px; 
  position: absolute; 
  right: 10px; 
  top: 8px;  
}
.link-block li a:hover { border-color: var(--primary); background: rgba(28,30,35,0.8); }
.link-block li a:hover:after { color: var(--primary); }

.dark .link-block li a { border-color: rgba(37,40,49,0.9); }
.dark .link-block li a:hover { border-color: var(--primary); }

.pg-portfolio .promo,
.pg-portfolio .footer-wrap { opacity: 0; }

.pg-resources .link-block a { margin-bottom: 6px; text-align: left; border-color: rgba(28,30,35,0.4); }
.pg-resources .link-block a span { font-size: 12px; opacity: 0.4; }
.pg-resources .link-block a img { display: inline-block; margin-right: 10px; position: relative; top: 3px; }

.pg-resources .link-block .header h3 { margin-top: 25px; }
.pg-resources .link-block .header h3 { color: var(--primary); text-transform: none; font-size: 18px; font-weight: normal; }
.pg-resources .th img {
  cursor: pointer;
  display: block;
  backface-visibility: hidden;
  border-radius: 0 4px 4px 0;
  transition: transform .5s ease 0s;
  transform-origin: 0 0;
  perspective : 0;
}
.pg-resources .th img:hover {
  box-shadow: none;
transform: rotateY(-20deg) perspective(-400px); 
}
.rating { font-family: 'mattbru'; font-weight: normal; }

.wordcount h5 { text-align: center; }

.pg-resume ul,
.pg-resume ul li { text-align: left; }

.leftalign h2 { font-size: 20px; margin-top: 0; text-align: right; }
.leftalign h3 { font-size: 16px; margin-top: 0; text-transform: none; line-height: 1.5; }
.leftalign h3:not(:first-of-type) { margin-top: 40px; }
.nine,
.three { padding-top: 20px; }
.leftalign p { max-width: 800px; }
time { font-weight: normal; display: inline-block; margin-left: 12px; color: var(--primary); }
time+time, p time { margin-left: 0; }
.leftalign p, 
.leftalign li { color: #ccc; }

 .pg-about svg.about { float: right; }
 .pg-about svg { max-width: 100%; }

progress[value] {
    -webkit-appearance: none;
   appearance: none;
  width: 100%;
  max-width: 250px;
  height: 8px;
}
progress[value]::-webkit-progress-bar {
  background-color: #555;
}
progress[value]::-webkit-progress-value {
  background-color: var(--primary);
}

/* portfolio */
/*.portfolio > div {  display: none; }*/
.portfolio .fail-message {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  text-align: center;
  opacity: 0;
  pointer-events: none;
  transition: 150ms;
}

.portfolio .fail-message:before{
  content: '';
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}

.portfolio .fail-message span{
  display: inline-block;
  vertical-align: middle;
  font-size: 20px;
  font-weight: 700;
}

.portfolio.fail .fail-message{
  opacity: 1;
  pointer-events: auto;
}

.filter-box { margin-bottom: 20px; text-align: left;}
button { 
  display: inline-block;
  background: rgba(28,30,35,0.3);
  border: 1px solid #40464f; border-color: rgba(28,30,35,0.4);
  color: #fff;
  padding: 5px 12px;outline:none;
}
.filter.active,
.filter.active:hover { background-color: var(--primary); color: #000; cursor: default; }
.filter-box p {
  margin-bottom: 5px;
} 
.filter-box p:before { margin-right: 10px; }
.filter-box div { 
  cursor: pointer;
  display: inline-block;
  background: rgba(28,30,35,0.3);
  border: 1px solid #40464f; border-color: rgba(28,30,35,0.4);
  color: #fff;
  padding: 5px 12px;outline:none;
  margin-top: 8px;
}
.filter-box div.active { background-color: var(--primary); color: #000; border-color: var(--primary); }
.filter-box div:hover { border-color: var(--primary); color: var(--primary); background: rgba(28,30,35,0.8); }

.portfolio .mix { width: 24.5%; display: none; overflow: hidden; margin-bottom: -2px;/* margin-bottom: -0.6em;*/
      position: relative;
          backface-visibility: hidden;
}
.portfolio .mix > a { display: block; 
          backface-visibility: hidden;
}
.portfolio img { 
    transform: scale(1.1);
    transition: all 0.2s ease-out;
    backface-visibility: hidden;
}
.portfolio a:hover { text-decoration: none; border: none; }
.portfolio .mix div { 
  display: block;
  color: #fff;
  text-align: center;
  width: 100%;
  padding: 10px 10px 30px;
  /*background: rgba(0,0,0,0.8);*/
  bottom: -80px;
  position: absolute;
  z-index: 1000;
  background: linear-gradient(to bottom, rgba(28,30,35,0) 0%, rgba(28,30,35,0.8) 75%);
          backface-visibility: hidden;
}
.portfolio .mix div a {
  display: inline-block;
  position: relative;
  bottom : -50px;
  z-index: 1000;
  text-decoration: none;
  color: var(--primary);
  display: inline-block;
  border-width: 0;
  padding-bottom: 0;
  transition: all 0.2s ease-out;
  backface-visibility: hidden;
}
.portfolio .mix div a:after {
   display: inline-block; margin-left: 10px; font-family: 'mattbru'; content: '\e64b';
}
.portfolio .mix div a:hover {
  border-bottom: 2px solid var(--primary);
}

.mix figure {
  position: relative;
  z-index: 1;
  display: block;
  text-align: center;
  cursor: pointer;
}
.mix figure img {
  position: relative;
  display: block;
          backface-visibility: hidden;
 
}

.mix figure figcaption {
  height: 100%;
  /*padding: 2em;*/
  color: #fff;
  text-transform: uppercase;
  font-size: 1.25em;
  backface-visibility: hidden;
}

.mix figure figcaption::before,
.mix figure figcaption::after {
  pointer-events: none;
}

.mix figure figcaption,
.mix figure a {
  position: absolute;
  top: -2px;
  left: -2px;
  width: 102%;
  height: 102%;
  backface-visibility: hidden;
}

.mix figure figcaption::before {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, rgba(28,30,35,0) 0%, rgba(28,30,35,0.8) 75%);
  content: '';
  opacity: 0;
  transform: translate3d(0,50%,0);
}

.mix figure h2 {
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  color: #484c61;
  transition: transform 0.35s, color 0.35s;
  transform: translate3d(0,-50%,0);
}

.mix figure figcaption::before,
.mix figure p {
  transition: opacity 0.35s, transform 0.35s;
  margin-bottom: 0;
}

.mix figure p {
  text-align: center;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 2em 2em 2.6em;
  width: 100%;
  opacity: 0;
  transform: translate3d(0,10px,0);
}

.mix:hover figcaption::before ,
.mix:hover p {
  opacity: 1;
  transform: translate3d(0,0,0);
}
.mix:hover img {
  transform: scale(1.15);
}

/* fancybox */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner { border: none!important; box-shadow: none; }
.fancybox-title-over-wrap { background: rgba(28,30,35,0.7); padding: 3px 12px; }
.fancybox-inner .fancybox-title a { margin-left: 6px; padding: 3px 12px; background-color: rgba(31,34,39,0.7); color: var(--primary); border-bottom: 0; position: relative; bottom: 0!important; right: -2px; }
.fancybox-inner .fancybox-title a:hover { background-color: var(--primary); color: rgb(31,34,39); }
body .fancybox-overlay { background-image: none; background: rgba(28,30,35,0.7); }
.fancybox-close { background: #333; background-image: none!important; /*background: rgba(10,10,10,0.8);*/ background: transparent; width: 36px; height: 36px; /*border-radius: 50%;*/ border-bottom: none!important; }
.fancybox-close:before { color: #fff; content: '\e626'; font-family: 'mattbru'; position: absolute; top: 8px; left: 12px; z-index: 15; }
.fancybox-close:hover:before { color: var(--primary); }
.fancybox-close:after { content: '\e640'; font-family: 'mattbru'; opacity: 0.9; color: #111; font-size: 50px; position: relative; z-index: 5; top: 8px; right: 2px; }
.fancybox-close:hover { border:none; }

.fancybox-nav { border:none!important; }
.fancybox-prev, 
.fancybox-next { overflow: hidden; }
.fancybox-prev span, 
.fancybox-next span { background-image: none!important; display: block!important; visibility: visible!important;
          transition: all .3s ease-out;
          backface-visibility: hidden;
}
.fancybox-prev span:hover, 
.fancybox-next span:hover {
          transition: all .2s ease-out;
}
.fancybox-prev span { left: -20px!important; }
.fancybox-next span { right: -20px!important; }
.fancybox-prev:hover span { left: 10px!important; }
.fancybox-next:hover span { right: 10px!important; }

.fancybox-prev span:after, 
.fancybox-next span:after { content: '\e640'; font-family: 'mattbru'; opacity: 0.8; color: #111; font-size: 70px; position: relative; z-index: 5; top: -22px; right: -15px; }
.fancybox-prev span:after { right: 40px; }
.fancybox-prev span:before, 
.fancybox-next span:before { background-image: none; content: ''; font-family: 'mattbru'; display: block; color: var(--primary); position: relative; z-index: 15;
  right: -14px;
  top: 2px;
  font-size: 22px;
}
.fancybox-prev span:before { content: '\e648'; right: auto; left: -14px; }
.fancybox-next span:before { content: '\e64b'; }

/* forms */

form input, form input[type="text"], form input[type="email"], form textarea { background: rgba(28,30,35,0.3); border: 1px solid #40464f; border-color: rgba(28,30,35,0.4); color: #60687b; max-width: 100%; min-width: 100%; padding: 10px; }
input:focus , textarea:focus,form input[type="text"]:focus,  form input[type="email"]:focus { background: rgba(28,30,35,0.6); border-color: var(--primary); outline: none; }

form.wordcount h5 { color: #fff; }
form.wordcount li div { background: rgba(28,30,35,0.3); padding: 15px 15px 0; }
form.wordcount li span { color: var(--primary); font-size: 55px; }


/* contact */
label { text-align: left; color: #fff; }
fieldset { border:none; background-color: rgba(28,30,35,0.3); }
.contact-form textarea { min-height: 200px; max-height: 300px; min-width: 100%; max-width: 100%; color: #60687b; }
.btn-submit { display: block; float: right; position: relative; }
.btn-submit input { display: inline-block; text-align: left;  width: 200px; background-color: var(--primary); color: #333; font-weight: bold; padding-left: 35px; }
.btn-submit input:hover { 
    /*background-color: #c8ff14; */
    color:  var(--primary);
    border-color: var(--primary);
    background-color: rgba(24, 27, 31, 1);
}
.btn-submit.rarr:after { 
  color: #333; display: block; position: absolute; top: 12px; right: 32px; font-weight: bold; 
  content: '\e653';
  transition: all 1s ease-out;
  backface-visibility: hidden;
}
.btn-submit.rarr:hover:after { 
  right: 20px;
  transform: rotate(30deg);
  transition: all .3s ease-out;
}

.btn-submit { 
  display: inline-block; 
  text-align: left; 
  width: auto; 
  background-color: var(--primary); 
  color: #333; 
  font-weight: bold; 
  padding: 12px 60px 12px 24px;
}
.btn-submit:hover { 
     color:  var(--primary);
    border-color: var(--primary);
    background-color: rgba(24, 27, 31, 1);
}
.btn-submit.disabled:hover,
.btn-submit.disabled { cursor: default; opacity: 0.8; background-color: #41464D; pointer-events: none; }
.btn-submit.rarr.disabled:after { top: 6px!important; right: 40px!important; } 

.pg-contact .ten.columns { padding-left: 0; }
.pg-contact .ten > p:first-of-type:after {
  display: inline-block; content: ''; width: 60px; height: 53px; background: url('/assets/images/green_arrow.png') 0 0 no-repeat; position: relative; top: 15px; left: 15px; 
}
.error input { border-color: #c60f13!important; }
.error input, input.error, .error textarea, textarea.error, .error input:focus, input.error:focus, .error textarea:focus, textarea.error:focus {
  border-color: #c60f13;
  background-color: rgba(198,15,19,0.1)!important;
}
.errorbox { color: #c60f13; text-align: left; width: 60%; float: left; padding: 3px 0 0 10px; }
.errorbox.success { color: var(--primary);  }
.two h4 { color: var(--primary); }
.two ul li { margin-bottom: 8px; }
.two a:link { border-bottom: none; text-align: left; display: block; }
.two a:link:before { display: inline-block; margin-right: 12px; position: relative; top: 1px; }
a.i-linkedin { border-bottom: none; text-align: left;  }
.i-linkedin:before { display: inline-block; margin-right: 12px; }

.spinner {
  opacity: 0;
  height: 25px;
  width: 25px;
  margin: 0 auto;
  position: absolute;
  bottom: 35px;
  right: 245px;
  margin-left: -30px;
  animation: rotation .6s infinite linear;
  /*border-top: 6px solid rgba(193,253,0,.8);*/
  border-left: 6px solid rgba(var(--primary-rgb, 0.15));
  border-right: 6px solid rgba(var(--primary-rgb, 0.15));
  border-bottom: 6px solid rgba(var(--primary-rgb, 0.15));
  border-top: 6px solid rgba(var(--primary-rgb, 0.8));
  border-radius: 100%;
}

@keyframes rotation {
  from {transform: rotate(0deg);}
  to {transform: rotate(359deg);}
}


.mm-page { height: 100%; }
main { min-height: 100%; margin-bottom: -370px; overflow: hidden; }
main:after { content: ''; display: block; }
main:after, .footer-wrap { height: 370px; }

.pg-sitemap ul { text-align: left; }
.pg-referral .promo { display: none; }
.pg-referral .i-pencil {
  transition: all 0.4s ease-out;
    backface-visibility: hidden;
}
.pg-referral .i-pencil:before { display: inline-block; margin-right: 10px; }
.pg-referral .terms h4 { margin-top: 0; }
.pg-referral ul li { text-align: left; }
.terms { display: none; }
.tab { background-color: #000; background-color: rgba(28,30,35,0.4); position: relative; top: 17px; padding: 12px; margin-top: 10px; border-bottom: 1px solid transparent; }
.tab:hover { border-color: transparent; }

.pg-encoded-link-generator small { text-align: left; font-size: 11px; display: block; opacity: 0.5; }

.pg-client-testimonials {
    h3 {
        text-wrap: balance;
        line-height:  1.25;
    }
}

/* footer */

.promo { background-color: var(--primary); color: #333; background-color: rgba(24,27,31,0.7); color: var(--primary); position: relative; }
.promo > .row > .twelve { text-align: left; }
.promo h3 { color: var(--primary); display: inline-block; padding: 12px 24px 0 0 ; margin-bottom: 0; }
.promo p { color: #fff; margin: 0; display: inline-block; }
.promo .btn { position: absolute; top: 0; right: 0; border-color: transparent; background-color: rgba(16,17,22,0.7); }
.promo .btn:hover { border-color: var(--primary); background-color: rgba(24,27,31,1);  }
.pg-encoded-link-generator .promo,
.home .promo,
.promo { border-top: 1px solid #33363b; }

.footer-wrap { background-color: rgba(16,17,22,0.8); border-top: 1px solid var(--primary); }
.footer-wrap footer { height: 100%; position: relative;  padding: 40px 0; color: #60687b;}
footer h3 { color: #fff; }
.bottom, footer { color: #272b32; }

footer .contact { text-align: left; }
footer .contact .btn:before { display: inline-block; margin-right: 12px; }
footer .contact .btn:hover { border-color: var(--primary); background-color: rgba(24,27,31,1); }

footer h3 { color: var(--primary); }
footer ul li a:link,
footer ul li a:visited,
footer p { 
    color: #60687b; 
    color:  #939cb1;
    display: block; 
    border-bottom : none;
}

footer ul li a:link { position: relative; }
footer ul li a:hover { color: var(--primary); }
footer ul li a:link:after { font-family: 'mattbru'; content: '\e64b'; display: block; position: absolute; top: 0; right: 245px; opacity: 0; 

    transition: all 0.4s ease-out;
    backface-visibility: hidden;
}
footer ul li a:hover:after { display: block; position: absolute; opacity: 1; right: 100px; }

footer ul li a { display: block; }

footer ul li a,
footer p { font-size: 12px; }

footer ul,
footer ul li { text-align: left; }

.bottom { color: #60687b; padding: 20px; position: absolute; bottom: 0; left: 0; right: 0; background-color: rgba(16,17,22,1); font-size: 12px; }
.bottom span { font-size: 12px; }
.bottom .row { margin: 0; padding: 0;}
.bottom a:link { border-bottom: none; margin-left: 25px; }
.bottom a:link:before { margin-right: 12px; display: inline-block; }
.bottom .six { text-align: left; }
.bottom .six + .six { text-align: right; }



/*
                                 ,,    ,,                                                      ,,                  
                               `7MM    db                                                      db                  
                                 MM                                                                                
`7MMpMMMb.pMMMb.  .gP"Ya    ,M""bMM  `7MM   ,6"Yb.       ,dW"Yvd `7MM  `7MM  .gP"Ya `7Mb,od8 `7MM  .gP"Ya  ,pP"Ybd 
  MM    MM    MM ,M'   Yb ,AP    MM    MM  8)   MM      ,W'   MM   MM    MM ,M'   Yb  MM' "'   MM ,M'   Yb 8I   `" 
  MM    MM    MM 8M"""""" 8MI    MM    MM   ,pm9MM      8M    MM   MM    MM 8M""""""  MM       MM 8M"""""" `YMMMa. 
  MM    MM    MM YM.    , `Mb    MM    MM  8M   MM      YA.   MM   MM    MM YM.    ,  MM       MM YM.    , L.   I8 
.JMML  JMML  JMML.`Mbmmd'  `Wbmd"MML..JMML.`Moo9^Yo.     `MbmdMM   `Mbod"YML.`Mbmmd'.JMML.   .JMML.`Mbmmd' M9mmmP' 
                                                              MM                                                   
                                                            .JMML. 
                                                            */




@media only screen and (max-width: 1370px) {

  nav > ul:nth-child(1) { padding-left: 60px; }

}

@media only screen and (max-width: 1280px){
  .promo .btn { right: 20px; }
}

@media only screen and (max-width: 1150px){
  .hero hgroup { top: 40%; }
  .promo p { display: block; }
  .block-grid.two-up>li { width: 100%; }
}

@media only screen and (max-width: 1050px){
  .hero hgroup { top: 30%; }
}

@media only screen and (max-width: 1000px){
  .promo .btn { position: static; margin-top: 10px; }
}

@media only screen and (max-width: 860px) {

  .hero { 
    height: 50vh;
    background: url('/assets/images/home-hero.jpg') 50% no-repeat;  background-size: cover; 
  }
  .hero header { background-color: transparent; }
  .noblur + .navbar nav:before,
  .hero img { display: none; }

  .home .portfolio .mix { width: 24%; }
  .home .portfolio small { top: 125px; }
  .home .burger + section { 
    background: 
      url('/assets/images/bg-left-code-overlay.png') 0 -50px no-repeat; 
      /*url('/assets/images/bg-right-code-overlay.png') 100% -50px no-repeat;*/
   }
  .home .intro p { max-width: 95%; }

  .home nav > ul:nth-child(1) { padding-left: 0; }
  .navbar nav { min-height: 60px; }
  .navbar .cube { width: 85px; margin-left: -37px; }
  .navbar ul li a { font-size: 12px; }
  .filter-box div { width: 24.5%; }

  .pg-contact .ten { width: 66.66%; }
  .pg-contact .two { width: 33.33%; }

}

@media only screen and (max-width: 767px) {

  h2 { margin: 0 auto 20px; }
  section > div { padding: 15px 0; }

    .hero h1 { margin: -7px 0px 0px; }
    .hero h3 { text-shadow: 1px 2px 5px rgba(0,0,0,0.8); }
    .hero h2 span, .hero h1 span,
    .hero h2, .hero h1 { 
    transform: skew(0deg);
  }
    .hero h3,
    .hero h2,
    .hero h1 { line-height: 1.25; } 
    .hero h3 { width: 100%; font-size: 30px; }
    .hero h2 { font-size: 22px; }
    .hero h1 { font-size: 18px; }
    .hero h2, .hero h1 { padding: 8px 0; }

    .hero hgroup { top: 16%; }

	.home .burger + section {
		background: none;
		background: url('/assets/images/bg-left-code-overlay.png') 0 -50px no-repeat;
		padding-top: 10px;
	}
	.home .intro p { max-width: 100%; font-size: 16px; }
	.home .row h2 { text-align: center; }

	.home .portfolio .two { display: none; }
	.home .portfolio .twelve, .home .portfolio .ten { padding-left: 0; }
	.row.recent figcaption { display: none; }

	.scrolled .navbar nav { min-height: 0; }
	.navbar { top: 0; }
	.navbar .cube + ul { display: none; }
	.navbar ul { height: 60%; }
	.navbar ul li { width: 5%; }
	.navbar ul li a { visibility: hidden; padding: 0; }
	/*body:not(.home) .navbar { width: 100%!important; position: fixed; z-index: 150; }*/

	h2[class^="i-"] { /*padding-left: 15px;*/ margin-top: 20px; }
	.pg-tools .six + .six { padding: 0; }
	.pg-resume main .three.columns {/* padding: 0 15px;*/ }
	.pg-resume main .nine.columns { padding: 0; }

	.leftalign h2:not(:first-of-type) { margin-top: 25px; }
	.leftalign h3:not(:first-of-type) { margin-top: 0; }

	.filter-box div { width: 32.7%; }
	.portfolio .mix { width: 32.5%; }

	.footer-wrap { height: auto; }
	.leftalign h2 { text-align: left; }

  .by-cat { display: none; }
  .home .portfolio .mix { width: 48%; }

	.footer-wrap footer { padding: 0; }
	footer ul {
		margin: 0 -15px;
		display: block;
		overflow: hidden;
		padding: 0;
	}

	footer ul li {
		width: 50%;
		padding: 0 15px 6px;
		display: block;
		height: auto;
		float: left;
	}
	footer ul li:nth-child(odd) { padding-right: 7px; }
	footer ul li:nth-child(even) { padding-left: 7px; }
	footer ul li a {
		padding: 10px;
		background-color: rgba(16,17,22,0.8);
	}
	footer ul li a:link:after { right: 20px; top: 8px; }
	footer ul li a:link:hover:after { right: 10px; }
	footer h3 { margin: 20px 0 12px 10px; }
	footer .contact { margin-bottom: 105px; }

}

@media only screen and (max-width: 600px) {

	.navbar nav:before { width: 250px; height: 100px; top: -82px; margin-left: -137px; }
	.home .intro a.btn { margin-bottom: 10px; }
	.btn.lrg { padding: 12px 40px; }
	.pg-resources .block h5 { padding-top: 20px; clear: both; }

}

@media only screen and (max-width: 490px) {

	h1, h2, h3 { text-align: center; }
	footer h3,
	.pg-resume h2,
	.pg-resume h3 { text-align: left; }

	h2 { font-size: 22px; }
	.filter-box div,
	.portfolio .mix { width: 49.5%; }
	.hero h1 { display: none; }
	.filter-box div,
	.portfolio .mix { width: 49%; }
	.recent { padding-top: 0; }
	.row.recent .twelve,
	.row.recent .three { padding: 0; }
	.row.recent .three:nth-of-type(odd) { padding-right: 1%; }

}

@media only screen and (max-width: 400px) {

	footer ul li {width: 100%; }
	footer ul li:nth-child(odd) { padding-right: 15px; }
	footer ul li:nth-child(even) { padding-left: 15px; }
	footer .bottom .six,
	footer .bottom .six + .six { text-align: left; }

}


@media only screen and (max-width: 350px) {
	.navbar nav:before{ display: none; }
	.navbar .cube { width: 50px; margin-left: -24px; }
	.navbar nav {min-height: 36px; }
}