/*! normalize.css v2.0.1 | MIT License | git.io/normalize */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section,
summary {
    display: block
}
audio,
canvas,
video {
    display: inline-block
}
audio:not([controls]) {
    display: none;
    height: 0
}
[hidden] {
    display: none
}
html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%
}
body {
    margin: 0
}
a:focus {
    outline: thin dotted
}
a:active,
a:hover {
    outline: 0
}
h1 {
    font-size: 2em
}
abbr[title] {
    border-bottom: 1px dotted
}
b,
strong {
    font-weight: bold
}
dfn {
    font-style: italic
}
mark {
    background: #ff0;
    color: #000
}
code,
kbd,
pre,
samp {
    font-family: monospace, serif;
    font-size: 1em
}
pre {
    white-space: pre;
    white-space: pre-wrap;
    word-wrap: break-word
}
q {
    quotes: "\201C" "\201D" "\2018" "\2019"
}
small {
    font-size: 80%
}
sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}
sup {
    top: -0.5em
}
sub {
    bottom: -0.25em
}
img {
    border: 0
}
svg:not(:root) {
    overflow: hidden
}
figure {
    margin: 0
}
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: .35em .625em .75em
}
legend {
    border: 0;
    padding: 0
}
button,
input,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    margin: 0
}
button,
input {
    line-height: normal
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer
}
button[disabled],
input[disabled] {
    cursor: default
}
input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0
}
input[type="search"] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none
}
button::-moz-focus-inner,
input::-moz-focus-inner {
    border: 0;
    padding: 0
}
textarea {
    overflow: auto;
    vertical-align: top
}
table {
    border-collapse: collapse;
    border-spacing: 0
}
.header-font {
    font-family: 'Myriad Pro', Arial, sans-serif
}
.body-font {
    font-family: 'Myriad Pro', Arial, sans-serif
}
.clearfix {
    zoom: 1
}
.clearfix:before,
.clearfix:after {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden
}
.clearfix:after {
    clear: both
}
.ir {
    display: block;
    overflow: hidden;
    background-repeat: no-repeat;
    text-align: left;
    text-indent: -999em;
    direction: ltr
}
.ir br {
    display: none
}
.hidden {
    display: none;
    visibility: hidden
}
.visuallyhidden {
    position: absolute;
    margin: -1px;
    padding: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
    border: 0;
    clip: rect(0 0 0 0)
}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    position: static;
    margin: 0;
    height: auto;
    width: auto;
    overflow: visible;
    clip: auto
}
.invisible {
    visibility: hidden
}
.js h1,
.js h2,
.js h3,
.js h4,
.js h5,
.js h6,
.js p,
.js ol,
.js ul,
.js figcaption {
    visibility: hidden
}
.wf-active h1,
.wf-inactive h1,
.wf-active h2,
.wf-inactive h2,
.wf-active h3,
.wf-inactive h3,
.wf-active h4,
.wf-inactive h4,
.wf-active h5,
.wf-inactive h5,
.wf-active h6,
.wf-inactive h6,
.wf-active p,
.wf-inactive p,
.wf-active ol,
.wf-inactive ol,
.wf-active ul,
.wf-inactive ul,
.wf-active figcaption,
.wf-inactive figcaption {
    visibility: visible
}
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 600;
    margin: 0;
    padding: 0
}
h1 {
    font-size: 32px;
    font-size: 3.2rem
}
h2 {
    font-size: 28px;
    font-size: 2.8rem
}
h3 {
    font-size: 24px;
    font-size: 2.4rem
}
h4 {
    font-size: 21px;
    font-size: 1.1rem
}
h5 {
    font-size: 18px;
    font-size: 1.8rem
}
h6 {
    font-size: 16px;
    font-size: 1.6rem
}
a {
    color: #cf2029;
    text-decoration: none
}
a:hover {
    color: #fff;
    text-decoration: none
}
ul {
    margin: 0;
    padding: 0;
    list-style-type: none
}
p {
    font-weight: 300;
    margin: 0;
    padding-top: 10px;
    font-size: 20px;
    font-size: 2rem
}
p:only-child {
    padding: 0
}
strong,
b {
    color: #ccc
}
em {
    font-style: normal;
    color: #cf2029
}
blockquote {
    margin: 0
}
blockquote p::before {
    content: "\201C";
    display: inline
}
blockquote p::after {
    content: "\201D";
    display: inline
}
.text-hl {
    color: #cf2029
}
.skin-nearly-black {
    background: #1a1a1a;
    color: #ccc
}
.skin-dark-grey {
    background: #2a2a2a;
    color: #f2f2f2
}
.skin-dark-grey a {
    color: #cf2029
}
.skin-dark-grey em {
    color: #cf2029;
    font-style: normal
}
.skin-grey {
    background: #666;
    color: #000
}
.skin-grey h2 {
    color: #f2f2f2
}
.skin-lighter-grey {
    background: #eee;
    color: #2a2a2a
}
.skin-etch-red {
    background: #cf2029;
    color: #f2f2f2
}
@font-face {
    font-family: 'FontAwesome';
    src: url("../fonts/fontawesome/fontawesome-webfont.eot");
    src: url("../fonts/fontawesome/fontawesome-webfont.eot-#iefix") format('eot'), url("../fonts/fontawesome/fontawesome-webfont.woff") format('woff'), url("../fonts/fontawesome/fontawesome-webfont.ttf") format('truetype'), url("../fonts/fontawesome/fontawesome-webfont.otf") format('opentype'), url("../fonts/fontawesome/fontawesome-webfont.svg#FontAwesome") format('svg');
    font-weight: normal;
    font-style: normal
}
.the-icons {
    list-style-type: none;
    padding: 0
}
i.icon {
    font-style: normal;
    font-weight: normal;
    font-size: 1em;
    display: inline-block;
    margin: 0 .3em 0 0;
    vertical-align: middle
}
.icon-right {
    margin: 0 0 0 .3em
}
.ie7 .icon-right {
    margin: 0 -15px 0 15px
}
.btn-plain .icon-right {
    margin: 0 0 0 .6em
}
.btn-plain .icon {
    margin: 0 .6em 0 0
}
.list-icons {
    list-style-type: none;
    padding: 0
}
.list-icons .icon:before {
    margin: 0 .3em 0 0;
    width: 1em
}
.icon:before {
    font-family: FontAwesome;
    display: inline-block;
    text-decoration: none
}
.btn .icon:before {
    margin-left: .5em
}
.icon-glass:before {
    content: "\f000"
}
.icon-music:before {
    content: "\f001"
}
.icon-search:before {
    content: "\f002"
}
.icon-envelope:before {
    content: "\f003"
}
.icon-heart:before {
    content: "\f004"
}
.icon-star:before {
    content: "\f005"
}
.icon-star-empty:before {
    content: "\f006"
}
.icon-user:before {
    content: "\f007"
}
.icon-film:before {
    content: "\f008"
}
.icon-th-large:before {
    content: "\f009"
}
.icon-th:before {
    content: "\f00a"
}
.icon-th-list:before {
    content: "\f00b"
}
.icon-ok:before {
    content: "\f00c"
}
.icon-remove:before {
    content: "\f00d"
}
.icon-zoom-in:before {
    content: "\f00e"
}
.icon-zoom-out:before {
    content: "\f010"
}
.icon-off:before {
    content: "\f011"
}
.icon-signal:before {
    content: "\f012"
}
.icon-cog:before {
    content: "\f013"
}
.icon-trash:before {
    content: "\f014"
}
.icon-home:before {
    content: "\f015"
}
.icon-file:before {
    content: "\f016"
}
.icon-time:before {
    content: "\f017"
}
.icon-road:before {
    content: "\f018"
}
.icon-download-alt:before {
    content: "\f019"
}
.icon-download:before {
    content: "\f01a"
}
.icon-upload:before {
    content: "\f01b"
}
.icon-inbox:before {
    content: "\f01c"
}
.icon-play-circle:before {
    content: "\f01d"
}
.icon-repeat:before {
    content: "\f01e"
}
.icon-refresh:before {
    content: "\f021"
}
.icon-list-alt:before {
    content: "\f022"
}
.icon-lock:before {
    content: "\f023"
}
.icon-flag:before {
    content: "\f024"
}
.icon-headphones:before {
    content: "\f025"
}
.icon-volume-off:before {
    content: "\f026"
}
.icon-volume-down:before {
    content: "\f027"
}
.icon-volume-up:before {
    content: "\f028"
}
.icon-qrcode:before {
    content: "\f029"
}
.icon-barcode:before {
    content: "\f02a"
}
.icon-tag:before {
    content: "\f02b"
}
.icon-tags:before {
    content: "\f02c"
}
.icon-book:before {
    content: "\f02d"
}
.icon-bookmark:before {
    content: "\f02e"
}
.icon-print:before {
    content: "\f02f"
}
.icon-camera:before {
    content: "\f030"
}
.icon-font:before {
    content: "\f031"
}
.icon-bold:before {
    content: "\f032"
}
.icon-italic:before {
    content: "\f033"
}
.icon-text-height:before {
    content: "\f034"
}
.icon-text-width:before {
    content: "\f035"
}
.icon-align-left:before {
    content: "\f036"
}
.icon-align-center:before {
    content: "\f037"
}
.icon-align-right:before {
    content: "\f038"
}
.icon-align-justify:before {
    content: "\f039"
}
.icon-list:before {
    content: "\f03a"
}
.icon-indent-left:before {
    content: "\f03b"
}
.icon-indent-right:before {
    content: "\f03c"
}
.icon-facetime-video:before {
    content: "\f03d"
}
.icon-picture:before {
    content: "\f03e"
}
.icon-pencil:before {
    content: "\f040"
}
.icon-map-marker:before {
    content: "\f041"
}
.icon-adjust:before {
    content: "\f042"
}
.icon-tint:before {
    content: "\f043"
}
.icon-edit:before {
    content: "\f044"
}
.icon-share:before {
    content: "\f045"
}
.icon-check:before {
    content: "\f046"
}
.icon-move:before {
    content: "\f047"
}
.icon-step-backward:before {
    content: "\f048"
}
.icon-fast-backward:before {
    content: "\f049"
}
.icon-backward:before {
    content: "\f04a"
}
.icon-play:before {
    content: "\f04b"
}
.icon-pause:before {
    content: "\f04c"
}
.icon-stop:before {
    content: "\f04d"
}
.icon-forward:before {
    content: "\f04e"
}
.icon-fast-forward:before {
    content: "\f050"
}
.icon-step-forward:before {
    content: "\f051"
}
.icon-eject:before {
    content: "\f052"
}
.icon-chevron-left:before {
    content: "\f053"
}
.icon-chevron-right:before {
    content: "\f054"
}
.icon-plus-sign:before {
    content: "\f055"
}
.icon-minus-sign:before {
    content: "\f056"
}
.icon-remove-sign:before {
    content: "\f057"
}
.icon-ok-sign:before {
    content: "\f058"
}
.icon-question-sign:before {
    content: "\f059"
}
.icon-info-sign:before {
    content: "\f05a"
}
.icon-screenshot:before {
    content: "\f05b"
}
.icon-remove-circle:before {
    content: "\f05c"
}
.icon-ok-circle:before {
    content: "\f05d"
}
.icon-ban-circle:before {
    content: "\f05e"
}
.icon-arrow-left:before {
    content: "\f060"
}
.icon-arrow-right:before {
    content: "\f061"
}
.icon-arrow-up:before {
    content: "\f062"
}
.icon-arrow-down:before {
    content: "\f063"
}
.icon-share-alt:before {
    content: "\f064"
}
.icon-resize-full:before {
    content: "\f065"
}
.icon-resize-small:before {
    content: "\f066"
}
.icon-plus:before {
    content: "\f067"
}
.icon-minus:before {
    content: "\f068"
}
.icon-asterisk:before {
    content: "\f069"
}
.icon-exclamation-sign:before {
    content: "\f06a"
}
.icon-gift:before {
    content: "\f06b"
}
.icon-leaf:before {
    content: "\f06c"
}
.icon-fire:before {
    content: "\f06d"
}
.icon-eye-open:before {
    content: "\f06e"
}
.icon-eye-close:before {
    content: "\f070"
}
.icon-warning-sign:before {
    content: "\f071"
}
.icon-plane:before {
    content: "\f072"
}
.icon-calendar:before {
    content: "\f073"
}
.icon-random:before {
    content: "\f074"
}
.icon-comment:before {
    content: "\f075"
}
.icon-magnet:before {
    content: "\f076"
}
.icon-chevron-up:before {
    content: "\f077"
}
.icon-chevron-down:before {
    content: "\f078"
}
.icon-retweet:before {
    content: "\f079"
}
.icon-shopping-cart:before {
    content: "\f07a"
}
.icon-folder-close:before {
    content: "\f07b"
}
.icon-folder-open:before {
    content: "\f07c"
}
.icon-resize-vertical:before {
    content: "\f07d"
}
.icon-resize-horizontal:before {
    content: "\f07e"
}
.icon-bar-chart:before {
    content: "\f080"
}
.icon-twitter-sign:before {
    content: "\f081"
}
.icon-facebook-sign:before {
    content: "\f082"
}
.icon-camera-retro:before {
    content: "\f083"
}
.icon-key:before {
    content: "\f084"
}
.icon-cogs:before {
    content: "\f085"
}
.icon-comments:before {
    content: "\f086"
}
.icon-thumbs-up:before {
    content: "\f087"
}
.icon-thumbs-down:before {
    content: "\f088"
}
.icon-star-half:before {
    content: "\f089"
}
.icon-heart-empty:before {
    content: "\f08a"
}
.icon-signout:before {
    content: "\f08b"
}
.icon-linkedin-sign:before {
    content: "\f08c"
}
.icon-pushpin:before {
    content: "\f08d"
}
.icon-external-link:before {
    content: "\f08e"
}
.icon-signin:before {
    content: "\f090"
}
.icon-trophy:before {
    content: "\f091"
}
.icon-github-sign:before {
    content: "\f092"
}
.icon-upload-alt:before {
    content: "\f093"
}
.icon-lemon:before {
    content: "\f094"
}
.icon-phone:before {
    content: "\f095"
}
.icon-check-empty:before {
    content: "\f096"
}
.icon-bookmark-empty:before {
    content: "\f097"
}
.icon-phone-sign:before {
    content: "\f098"
}
.icon-twitter:before {
    content: "\f099"
}
.icon-facebook:before {
    content: "\f09a"
}
.icon-github:before {
    content: "\f09b"
}
.icon-unlock:before {
    content: "\f09c"
}
.icon-credit-card:before {
    content: "\f09d"
}
.icon-rss:before {
    content: "\f09e"
}
.icon-hdd:before {
    content: "\f0a0"
}
.icon-bullhorn:before {
    content: "\f0a1"
}
.icon-bell:before {
    content: "\f0a2"
}
.icon-certificate:before {
    content: "\f0a3"
}
.icon-hand-right:before {
    content: "\f0a4"
}
.icon-hand-left:before {
    content: "\f0a5"
}
.icon-hand-up:before {
    content: "\f0a6"
}
.icon-hand-down:before {
    content: "\f0a7"
}
.icon-circle-arrow-left:before {
    content: "\f0a8"
}
.icon-circle-arrow-right:before {
    content: "\f0a9"
}
.icon-circle-arrow-up:before {
    content: "\f0aa"
}
.icon-circle-arrow-down:before {
    content: "\f0ab"
}
.icon-globe:before {
    content: "\f0ac"
}
.icon-wrench:before {
    content: "\f0ad"
}
.icon-tasks:before {
    content: "\f0ae"
}
.icon-filter:before {
    content: "\f0b0"
}
.icon-briefcase:before {
    content: "\f0b1"
}
.icon-fullscreen:before {
    content: "\f0b2"
}
.icon-group:before {
    content: "\f0c0"
}
.icon-link:before {
    content: "\f0c1"
}
.icon-cloud:before {
    content: "\f0c2"
}
.icon-beaker:before {
    content: "\f0c3"
}
.icon-cut:before {
    content: "\f0c4"
}
.icon-copy:before {
    content: "\f0c5"
}
.icon-paper-clip:before {
    content: "\f0c6"
}
.icon-save:before {
    content: "\f0c7"
}
.icon-sign-blank:before {
    content: "\f0c8"
}
.icon-reorder:before {
    content: "\f0c9"
}
.icon-list-ul:before {
    content: "\f0ca"
}
.icon-list-ol:before {
    content: "\f0cb"
}
.icon-strikethrough:before {
    content: "\f0cc"
}
.icon-underline:before {
    content: "\f0cd"
}
.icon-table:before {
    content: "\f0ce"
}
.icon-magic:before {
    content: "\f0d0"
}
.icon-truck:before {
    content: "\f0d1"
}
.icon-pinterest:before {
    content: "\f0d2"
}
.icon-pinterest-sign:before {
    content: "\f0d3"
}
.icon-google-plus-sign:before {
    content: "\f0d4"
}
.icon-google-plus:before {
    content: "\f0d5"
}
.icon-money:before {
    content: "\f0d6"
}
.icon-caret-down:before {
    content: "\f0d7"
}
.icon-caret-up:before {
    content: "\f0d8"
}
.icon-caret-left:before {
    content: "\f0d9"
}
.icon-caret-right:before {
    content: "\f0da"
}
.icon-columns:before {
    content: "\f0db"
}
.icon-sort:before {
    content: "\f0dc"
}
.icon-sort-down:before {
    content: "\f0dd"
}
.icon-sort-up:before {
    content: "\f0de"
}
.icon-envelope-alt:before {
    content: "\f0e0"
}
.icon-linkedin:before {
    content: "\f0e1"
}
.icon-undo:before {
    content: "\f0e2"
}
.icon-legal:before {
    content: "\f0e3"
}
.icon-dashboard:before {
    content: "\f0e4"
}
.icon-comment-alt:before {
    content: "\f0e5"
}
.icon-comments-alt:before {
    content: "\f0e6"
}
.icon-bolt:before {
    content: "\f0e7"
}
.icon-sitemap:before {
    content: "\f0e8"
}
.icon-umbrella:before {
    content: "\f0e9"
}
.icon-paste:before {
    content: "\f0ea"
}
.icon-user-md:before {
    content: "\f200"
}
@font-face {
    font-family: "SocialFoundicons";
    src: url("../fonts/social_foundicons/social_foundicons.eot");
    src: url("../fonts/social_foundicons/social_foundicons.eot-#iefix") format("embedded-opentype"), url("../fonts/social_foundicons/social_foundicons.woff") format("woff"), url("../fonts/social_foundicons/social_foundicons.ttf") format("truetype"), url("../fonts/social_foundicons/social_foundicons.svg#SocialFoundicons") format("svg");
    font-weight: normal;
    font-style: normal
}
[class*="foundicon-"] {
    display: inline;
    width: auto;
    height: auto;
    line-height: inherit;
    vertical-align: baseline;
    background-image: none;
    background-position: 0 0;
    background-repeat: repeat
}
[class*="foundicon-"]:before {
    font-family: "SocialFoundicons";
    font-weight: normal;
    font-style: normal;
    text-decoration: inherit
}
.foundicon-thumb-up:before {
    content: "\f000"
}
.foundicon-thumb-down:before {
    content: "\f001"
}
.foundicon-rss:before {
    content: "\f002"
}
.foundicon-facebook:before {
    content: "\f003"
}
.foundicon-twitter:before {
    content: "\f004"
}
.foundicon-pinterest:before {
    content: "\f005"
}
.foundicon-github:before {
    content: "\f006"
}
.foundicon-path:before {
    content: "\f007"
}
.foundicon-linkedin:before {
    content: "\f008"
}
.foundicon-dribbble:before {
    content: "\f009"
}
.foundicon-stumble-upon:before {
    content: "\f00a"
}
.foundicon-behance:before {
    content: "\f00b"
}
.foundicon-reddit:before {
    content: "\f00c"
}
.foundicon-google-plus:before {
    content: "\f00d"
}
.foundicon-youtube:before {
    content: "\f00e"
}
.foundicon-vimeo:before {
    content: "\f00f"
}
.foundicon-flickr:before {
    content: "\f010"
}
.foundicon-slideshare:before {
    content: "\f011"
}
.foundicon-picassa:before {
    content: "\f012"
}
.foundicon-skype:before {
    content: "\f013"
}
.foundicon-steam:before {
    content: "\f014"
}
.foundicon-instagram:before {
    content: "\f015"
}
.foundicon-foursquare:before {
    content: "\f016"
}
.foundicon-delicious:before {
    content: "\f017"
}
.foundicon-chat:before {
    content: "\f018"
}
.foundicon-torso:before {
    content: "\f019"
}
.foundicon-tumblr:before {
    content: "\f01a"
}
.foundicon-video-chat:before {
    content: "\f01b"
}
.foundicon-digg:before {
    content: "\f01c"
}
.foundicon-wordpress:before {
    content: "\f01d"
}
.grid-wrap {
    padding: 0
}
.loaded .grid-wrap,
.loaded .grid-wrap .block-wrap {
    -webkit-transition-duration: .7s;
    -moz-transition-duration: .7s;
    -ms-transition-duration: .7s;
    -o-transition-duration: .7s;
    transition-duration: .7s
}
.loaded .grid-wrap {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -ms-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width
}
.loaded .grid-wrap .block-wrap {
    -webkit-transition-property: left, right, top;
    -moz-transition-property: left, right, top;
    -ms-transition-property: left, right, top;
    -o-transition-property: left, right, top;
    transition-property: left, right, top;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    transform-style: preserve-3d
}
.block-wrap {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0;
    position: relative;
    padding: 5px
}
.block-wrap[data-colspan='2'] {
    width: 100%
}
.block-wrap.minified {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    transform: scale(0)
}
li.block-wrap {
    list-style-type: none
}
.small-screen-double-wide {
    width: 100%
}
@media all and (min-width:40em) {
    .block-wrap {
        float: left;
        width: 50%
    }
    .block-wrap[data-colspan="2"] {
        width: 100%
    }
    .small-screen-double-wide {
        width: 100%
    }
}
@media all and (min-width:62.66em) {
    .block-wrap {
        width: 33.33%;
        padding: 10px
    }
    .block-wrap[data-colspan="2"] {
        width: 66.66%
    }
}
@media all and (min-width:78.32em) {
    .block-wrap {
        width: 25%
    }
    .block-wrap[data-colspan="2"] {
        width: 50%
    }
}
@media all and (min-width:93.98em) {
    .block-wrap {
        width: 20%
    }
    .block-wrap[data-colspan="2"] {
        width: 40%
    }
}
.block {
    display: block;
    background: #2a2a2a;
    position: relative;
    font-size: 20px;
    font-size: 2rem;
    overflow: hidden
}
.block iframe,
.block img {
    width: 100%;
    max-width: 100%;
    display: block;
    height: auto
}
@media all and (min-width:40em) {
    [data-colspan="1"] .block {
        min-height: 12.5em
    }
}
@media all and (min-width:62.66em) {
    [data-colspan="1"] .block {
        min-height: 12.84em
    }
    [data-colspan="2"] .block {
        min-height: 28.15em
    }
}
@media all and (min-width:78.32em) {
    [data-colspan="1"] .block {
        min-height: 12.92em
    }
    [data-colspan="2"] .block {
        min-height: 28.33em
    }
}
@media all and (min-width:93.98em) {
    [data-colspan="1"] .block {
        min-height: 12.2em
    }
    [data-colspan="2"] .block {
        min-height: 26.9em
    }
}
.text-only {
    padding: 20px
}
.text-only b {
    -webkit-text-stroke: 0
}
.text-only h1 {
    margin-bottom: .5em
}
.text-only h2 {
    font-weight: 100
}
.text-only h3 {
    font-weight: 300
}
[data-colspan="2"][data-rowspan="2"] .text-only {
    font-size: 20px;
    font-size: 2rem
}
@media all and (min-width:40em) {
    [data-colspan="2"][data-rowspan="2"] .text-only {
        padding: 40px
    }
    [data-colspan="2"][data-rowspan="2"] .text-only h1,
    [data-colspan="2"][data-rowspan="2"] .text-only h2,
    [data-colspan="2"][data-rowspan="2"] .text-only p {
        line-height: 1em
    }
    [data-colspan="2"][data-rowspan="2"] .text-only h2 {
        font-size: 60px;
        font-size: 6rem
    }
    [data-colspan="2"][data-rowspan="2"] .text-only p {
        font-size: 53px;
        font-size: 5.3rem;
        font-weight: 100
    }
}
@media all and (min-width:62.66em) {
    .text-only p {
        font-size: 24px;
        font-size: 2.4rem
    }
    [data-colspan="2"][data-rowspan="2"] .text-only {
        padding: 40px
    }
    [data-colspan="2"][data-rowspan="2"] .text-only h2 {
        font-size: 60px;
        font-size: 6rem
    }
    [data-colspan="2"][data-rowspan="2"] .text-only p {
        font-size: 53px;
        font-size: 5.3rem
    }
}
.image,
.video-block {
    overflow: hidden
}
.loading {
    background-repeat: no-repeat;
    background-position: center center
}
.loading.img_loaded {
    background-image: none
}
.lt-ie8 .loading {
    background-image: none
}
.image {
    background-repeat: no-repeat;
    background-position: center center
}
.image:before {
    content: "";
    display: block;
    padding-top: 100%;
    height: 0
}
.image.img_loaded {
    background-image: none
}
.image figure:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}
[data-colspan="1"] .video-block {
    min-height: 14.5em
}
.video-block .video-wrapper {
    position: relative
}
.video-block .video-wrapper:before {
    content: "";
    display: block;
    height: 0;
    padding-top: 56.5%
}
.video-block iframe {
    background: #222;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%
}
.video-block figcaption p {
    padding: 20px
}
.video-block figcaption p:empty {
    padding: 0
}
.image>img,
.no-js .image img {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden
}
.with-hidden-caption {
    cursor: pointer;
    z-index: 1;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    overflow: hidden;
    -webkit-transition: background .2s ease-in-out;
    -moz-transition: background .2s ease-in-out;
    -o-transition: background .2s ease-in-out;
    transition: background .2s ease-in-out;
    background: rgba(0, 0, 0, 0.1)
}
.with-hidden-caption figcaption {
    padding: 20px;
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
    bottom: 0;
    left: 0;
    right: 0;
    display: none;
    position: absolute;
    z-index: 1
}
.with-hidden-caption:before {
    background: inherit
}
.with-hidden-caption:hover {
    background: rgba(0, 0, 0, 0)
}
.with-hidden-caption img {
    position: relative;
    box-shadow: 0 1px 2px #000;
    width: 100%;
    max-width: 100%
}
@media all and (min-width:40em) {
    .image {
        overflow: hidden
    }
    [data-colspan="2"][data-rowspan="2"] .image img {
        width: 600px;
        min-width: 100%
    }
    [data-colspan="1"][data-rowspan="1"] .image img {
        width: 290px;
        min-width: 100%
    }
}
@media all and (min-width:62.66em) {
    [data-colspan="1"] .video-block {
        min-height: 0
    }
    .with-hidden-caption figcaption {
        position: static;
        background: 0
    }
}
.team-block {
    border-bottom: 1px solid #1a1a1a;
    border-top: 1px solid #3a3a3a;
    width: 100%;
    overflow: hidden
}
.team-block img {
    float: left;
    margin: 20px;
    width: 20%;
    border-top: 1px solid #1a1a1a;
    border-left: 1px solid #1a1a1a;
    border-bottom: 1px solid #3a3a3a;
    border-right: 1px solid #3a3a3a
}
.team-block h3,
.team-block p {
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
    filter: dropshadow(color=#000000, offx=1, offy=1)
}
.team-block h3 {
    font-weight: 600;
    margin: 20px 0 0 0
}
.team-block h3 a {
    color: #ccc
}
.team-block h3 a:hover {
    color: #fff
}
.team-block p {
    color: #cf2029;
    padding: 0
}
@media all and (min-width:40em) {
    .team-block {
        border: 0 none;
        width: auto
    }
    .team-block:before {
        content: "";
        height: 0;
        padding-top: 100%;
        display: block
    }
    .team-block img {
        position: absolute;
        width: 100%;
        max-width: 100%;
        top: 0;
        left: 0;
        border: 0 none;
        float: none;
        margin: 0
    }
    .team-block h3,
    .team-block p {
        position: absolute
    }
    .team-block h3 {
        bottom: 0;
        left: 0;
        right: 0;
        margin: 0;
        padding: 20px;
        line-height: 100%;
        background: rgba(0, 0, 0, 0.2);
        filter: none
    }
    .team-block h3 a {
        color: #fff
    }
    .team-block p {
        bottom: 1em;
        left: 5%;
        display: none
    }
}
.project-block {
    border-bottom: 1px solid #1a1a1a;
    border-top: 1px solid #2a2a2a
}
.project-block:before {
    content: "";
    height: 0;
    padding-top: 100%;
    display: block
}
.project-block img {
    position: absolute;
    width: 100%;
    max-width: 100%;
    top: 0;
    left: 0
}
.project-block h3,
.project-block p {
    position: absolute;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.8);
    filter: dropshadow(color=#000000, offx=1, offy=1)
}
.project-block h3 {
    font-weight: 600;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0;
    padding: 20px;
    line-height: 100%;
    background: rgba(0, 0, 0, 0.2)
}
.project-block h3 a {
    color: #fff
}
.project-block p {
    color: #cf2029;
    padding: 0;
    bottom: 1em;
    left: 5%;
    display: none
}
@media all and (min-width:40em) {
    .project-block h3 {
        filter: none
    }
}
.hero-banner {
    background-image: url("../img/base/loading.gif");
    background-repeat: no-repeat;
    background-position: center center;
    margin: 10px 5px 5px;
    position: relative;
    background-color: #2a2a2a
}
.hero-banner.img_loaded {
    background-image: none
}
.hero-banner h1,
.hero-banner h2 {
    text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
    filter: dropshadow(color=#000000, offx=1, offy=1);
    line-height: 1.2em
}
.hero-banner h1 {
    font-weight: 900;
    color: #fff
}
.hero-banner h2 {
    font-weight: 300
}
.hero-banner img {
    max-width: 100%;
    width: 100%;
    display: block
}
.hero-banner hgroup {
    padding: 1em
}
.hero-banner b {
    color: #fff
}
@media all and (min-width:40em) {
    .hero-banner {
        margin: 10px 5px
    }
    .hero-banner hgroup {
        position: absolute;
        top: 10px;
        left: 20px
    }
}
@media all and (min-width:62.66em) {
    .hero-banner {
        margin: 10px
    }
    .hero-banner hgroup {
        top: 40px;
        left: 40px
    }
    .hero-banner h1 {
        font-size: 48px;
        font-size: 4.8rem
    }
    .hero-banner h2 {
        font-size: 36px;
        font-size: 3.6rem
    }
}
@media all and (min-width:78.32em) {
    .hero-banner h1 {
        font-size: 60px;
        font-size: 6rem
    }
    .hero-banner h2 {
        font-size: 48px;
        font-size: 4.8rem
    }
}
.quote {
    padding: 20px;
    font-size: 20px;
    font-size: 2rem
}
.quote cite {
    padding-top: 20px;
    font-size: 14px;
    font-size: 1.4rem;
    display: block
}
.link-block {
    -webkit-transition: background .2s ease-in-out;
    -moz-transition: background .2s ease-in-out;
    -o-transition: background .2s ease-in-out;
    transition: background .2s ease-in-out;
    background: rgba(255, 255, 255, 0)
}
.link-block:before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    z-index: 1;
    background: inherit
}
.link-block:hover {
    background: rgba(255, 255, 255, 0.15)
}
[data-colspan="1"] .list-block {
    min-height: 0
}
.list-block ul {
    list-style: none;
    width: 100%;
    height: 100%;
    font-size: 20px;
    font-size: 2rem
}
.list-block ul,
.list-block li {
    margin: 0;
    padding: 0
}
.list-block li {
    height: 25%
}
.list-block a {
    display: block;
    color: #999;
    text-decoration: none;
    padding: 0 1em;
    border-bottom: 1px solid #222;
    vertical-align: middle
}
.list-block a:hover {
    background: #444;
    color: #fff
}
.list-block i.icon {
    width: 1.5em;
    margin: 0;
    font-size: 1.5em
}
@media all and (min-width:40em) {
    .list-block li {
        float: left;
        width: 50%
    }
}
@media all and (min-width:62.66em) {
    .list-block ul {
        display: table
    }
    .list-block li {
        display: table-row;
        float: none;
        width: auto
    }
    .list-block a {
        display: table-cell
    }
    .list-block li:last-child a {
        border: 0
    }
}
html {
    font-size: 10px
}
body {
    -webkit-font-smoothing: subpixel-antialiased !important;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    font-family: 'Myriad Pro', Arial, sans-serif;
    line-height: 1.4;
    font-size: 20px;
    font-size: 2rem;
    font-weight: 300;
    background: #1a1a1a;
    color: #999;
    margin: auto;
    padding-top: 3em;
    max-width: 17em;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility
}
section {
    overflow: hidden;
    clear: both;
    margin-bottom: 10px
}
.js noscript img {
    display: none!important
}
::-webkit-selection {
    background: #3a3a3a;
    color: #f2f2f2;
    text-shadow: none
}
::-moz-selection {
    background: #3a3a3a;
    color: #f2f2f2;
    text-shadow: none
}
::selection {
    background: #3a3a3a;
    color: #f2f2f2;
    text-shadow: none
}
.resize {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}
.no-js .resize {
    display: none
}
@media all and (min-width:40em) {
    body {
        max-width: 31em
    }
    section {
        margin-bottom: 0
    }
}
@media all and (min-width:62.66em) {
    body {
        max-width: 47em
    }
    section {
        overflow: visible;
        clear: none
    }
    .grid-home h1 {
        position: absolute;
        margin: -1px;
        padding: 0;
        height: 1px;
        width: 1px;
        overflow: hidden;
        border: 0;
        clip: rect(0 0 0 0)
    }
}
@media all and (min-width:78.32em) {
    body {
        max-width: 62.66em
    }
}
@media all and (min-width:93.98em) {
    body {
        max-width: 74.65em
    }
}
[role="navigation"] {
    background: rgba(25, 25, 25, 0.8);
    width: 100%;
    height: 3em;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    font-size: 15px;
    font-size: 1.5rem
}
[role="navigation"] .home-wrapper {
    position: relative;
    z-index: 2;
    overflow: hidden;
    float: left
}
[role="navigation"] a {
    color: #fff;
    text-decoration: none;
    opacity: .7;
    outline: 0
}
[role="navigation"] a:hover,
[role="navigation"] a:focus [role="navigation"] a:active,
[role="navigation"] a.current {
    opacity: 1
}
[role="navigation"] a:active {
    background: #333
}
[role="navigation"]>ul {
    overflow: hidden;
    height: 3em;
    position: relative;
    display: inline-block;
    -webkit-transition-duration: .4s;
    -moz-transition-duration: .4s;
    -ms-transition-duration: .4s;
    -o-transition-duration: .4s;
    transition-duration: .4s;
    -webkit-transition-property: left, padding;
    -moz-transition-property: left, padding;
    -ms-transition-property: left, padding;
    -o-transition-property: left, padding;
    transition-property: left, padding;
    -webkit-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
    -moz-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
    -ms-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
    -o-transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
    transition-timing-function: cubic-bezier(0.86, 0, 0.07, 1);
    margin: 0;
    float: left;
    z-index: 1;
    width: 21em
}
[role="navigation"]>ul.open {
    left: 0;
    padding-right: 7em
}
[role="navigation"]>ul li {
    margin: 0;
    display: block;
    float: left
}
[role="navigation"]>ul a {
    height: 3em;
    width: 3em;
    line-height: 2.8em;
    display: block;
    overflow: hidden;
    opacity: .4
}
[role="navigation"]>ul a.nav-home {
    padding: 0 1em;
    background: #cf2029
}
[role="navigation"]>ul span {
    position: absolute;
    right: 0;
    top: 4px;
    opacity: 0;
    width: 6em;
    padding: 0 8em;
    height: 3em;
    display: none;
    font-weight: 600;
}
.no-rgba [role="navigation"] {
    background: #2a2a2a
}
#nav-trigger {
    float: left;
    cursor: pointer;
    display: none;
    position: relative;
    z-index: 2;
    background-color: #cf2029
}
#nav-trigger.active {
    opacity: 1
}
.icon-menu {
    transition: transform .3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -moz-transition: -moz-transform .3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -webkit-transition: -webkit-transform .3s cubic-bezier(0.785, 0.135, 0.15, 0.86);
    -o-transition: -o-transform .3s cubic-bezier(0.785, 0.135, 0.15, 0.86)
}
.active .icon-menu {
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    transform: rotate(90deg)
}
@media all and (min-width:40em) {
    [role=navigation]>ul {
        left: -21.1em;
        padding-right: 9em;
        width: 22em
    }
    [role=navigation]>ul a {
        padding: 0 5px
    }
    [role=navigation]>ul a.nav-home {
        padding-right: 0;
        background: 0
    }
    [role=navigation]>ul .current span {
        opacity: 1;
        display: block
    }
    [role=navigation]>ul:hover .current span {
        display: none
    }
    [role=navigation]>ul a:hover span,
    [role=navigation]>ul:hover .current:hover span {
        opacity: 1;
        display: block
    }
    #nav-trigger {
        display: block
    }
    .no-js [role="navigation"] ul {
        width: 18em;
        padding-right: 6em;
        left: 0
    }
}
@media all and (min-width:40em) {
    [role="navigation"] {
        font-size: 20px;
        font-size: 2rem
    }
}
#nav-home {
    display: none;
    width: 5em;
    height: 3em;
    float: left
}
#nav-home img {
    display: none
}
#nav-home,
#nav-home:active {
    background: url("../img/base/logo.svg") 0 0 no-repeat;
    background-size: 100%
}
.no-svg #nav-home {
    width: 3em
}
.no-svg #nav-home img {
    display: block
}
#nav-contact {
    position: absolute;
    right: 1em;
    width: 3em;
    height: 3em;
    z-index: 1
}
#nav-contact span {
    position: absolute;
    margin: -1px;
    padding: 0;
    height: 1px;
    width: 1px;
    overflow: hidden;
    border: 0;
    clip: rect(0 0 0 0)
}
#nav-contact .menu-icon {
    -webkit-opacity: .6;
    -moz-opacity: .6;
    opacity: .6
}
#nav-contact:hover .menu-icon {
    -webkit-opacity: 1;
    -moz-opacity: 1;
    opacity: 1
}
.menu-icon {
    display: block;
    background: transparent url("../img/base/menu-sprite.svg") no-repeat;
    background-size: auto 100%;
    height: 3em;
    width: 3em
}
.no-svg .menu-icon {
    background-image: url("../img/base/menu-sprite.png")
}
.icon-menu {
    background-position: 0 0
}
.icon-etch {
    background-position: -18em 0
}
.icon-studio {
    background-position: -3em 0
}
.icon-team {
    background-position: -6em 0
}
.icon-work {
    background-position: -9em 0
}
.icon-social {
    background-position: -12em 0
}
.icon-contact {
    background-position: -15em 0
}
.icon-web {
    background-position: -18em 0
}
.nav-contact {
    background: #2a2a2a;
    max-width: 32em;
    margin: 0 20px;
    -webkit-box-shadow: 0 .5em 2em rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0 .5em 2em rgba(0, 0, 0, 0.5);
    box-shadow: 0 .5em 2em rgba(0, 0, 0, 0.5);
    position: absolute;
    top: 3.5em;
    right: 0
}
.nav-contact .inner {
    padding: 1em 2em 2em
}
.nav-contact .inner h4 {
    display: none
}
.nav-contact .inner a {
    -webkit-transition: none;
    -moz-transition: none;
    -o-transition: none;
    transition: none
}
.nav-contact .inner a:hover {
    color: #fff
}
.nav-contact:before {
    content: "";
    display: block;
    position: relative;
    float: right;
    margin: -0.6em .5em 0 0;
    border-bottom: 1em solid #2a2a2a;
    border-right: 1em solid transparent;
    border-left: 1em solid transparent
}
[role=banner] {
    margin-bottom: 5px
}
[role=banner] .background-wrapper {
    position: relative;
    overflow: hidden
}
[role=banner] h1,
[role=banner] h2 {
    position: relative;
    z-index: 2;
    margin: 0
}
[role=banner] h1 {
    color: #fff;
    font-weight: 900
}
[role=banner] h2 {
    color: #cf2029
}
[role=banner] hgroup {
    padding: .7em
}
[role=banner] .background-image {
    width: 100%;
    max-width: 100%;
    z-index: 1
}
@media all and (min-width:30em) {
    [role=banner] .background-wrapper::before {
        content: "";
        display: block;
        height: 0;
        padding-top: 50%
    }
    [role=banner] .background-wrapper hgroup {
        padding: 1.4em;
        position: absolute;
        top: 0;
        left: 0
    }
    [role=banner] .background-image {
        position: absolute;
        top: 0;
        left: 0
    }
}
.subnav {
    max-width: 12em;
    margin: auto
}
.subnav ul {
    list-style-type: none;
    text-align: center;
    width: auto;
    padding: .1em 0
}
.subnav li {
    display: inline-block;
    background: #1a1a1a;
    position: relative;
    z-index: 1
}
.subnav a {
    display: block
}
.subnav img {
    height: 100%;
    max-height: 2.8em;
    max-width: 2.8em;
    width: auto;
    display: block
}
.subnav .current a {
    opacity: 1
}
[role=navigation] .subnav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    max-width: 100%
}
[role=navigation] .subnav ul {
    max-height: 2.8em
}
[role=navigation] .subnav li {
    min-width: 2.8em
}
.jobs {
    position: fixed;
    bottom: 1em;
    right: 0;
    font-weight: 700;
    background: #cf2029;
    z-index: 100000;
    -webkit-transition: all .2s ease-out;
    -moz-transition: all .2s ease-out;
    transition: all .2s ease-out
}
.jobs:hover {
    background: #ff4c4c
}
.jobs a {
    color: #fff;
    display: inline-block;
    padding: .25em 1em
}
[role=contentinfo] {
    background: #2a2a2a;
    color: #666;
    font-size: .5em;
    margin: 0 10px;
    padding: 20px
}
#contact {
    padding: 0 0 20px
}
#contact h4,
#new-contact h4 {
    font-size: 2em
}
#contact h4 a,
#new-contact h4 a {
    color: #f2f2f2;
    font-weight: bold;
    font-size: 1.4em;
    display: block;
    overflow: hidden;
    background-repeat: no-repeat;
    text-align: left;
    text-indent: -999em;
    direction: ltr;
    background-image: url("../img/base/menu-sprite.svg");
    width: 2em;
    height: 2em;
    background-position: -12em 0;
    background-size: auto 100%
}
#contact p,
#new-contact p {
    color: #999;
    padding: 20px 0 0 0
}
#contact .icon,
#new-contact .icon {
    color: #666;
    margin-right: 1em
}
#new-contact .icon {
    color: #cf2029
}
.no-svg #contact h4 a,
.no-svg #new-contact h4 a {
    background-image: url("../img/base/menu-sprite.png");
    background-position: right top;
    height: 45px;
    width: 45px
}
@media all and (min-width:40em) {
    [role=contentinfo] {
        margin: 0 15px
    }
}
@media all and (min-width:62.66em) {
    [role=contentinfo] {
        margin: 0 20px
    }
}
[role=main] {
    zoom: 1;
    padding: 10px;
    margin: 0
}
[role=main]:before,
[role=main]:after {
    content: "\0020";
    display: block;
    height: 0;
    overflow: hidden
}
[role=main]:after {
    clear: both
}
.grid-home .block-wrap {
    padding: 0
}
#intro {
    margin-bottom: 10px
}
#intro h2 {
    font-size: 36px;
    font-size: 2.6rem
}
@media all and (min-width:40em) {
    #intro h2 {
        font-size: 72px;
        font-size: 4.5rem
    }
}
#logo-block {
    display: none
}
.studio {
    background: #2a2a2a
}
.studio>.block-wrap {
    padding: 0
}
.studio .pep-wrapper {
    margin-top: 10px
}
.studio .pep-wrapper li {
    float: left;
    padding: 0 0 20px 20px
}
.studio .pep-wrapper .image:before {
    padding-top: 0
}
.studio .pep-wrapper figure {
    position: relative
}
.projects .block-wrap {
    border-top: 1px solid #3a3a3a;
    border-bottom: 1px solid #1a1a1a
}
.ethos {
    background: #2a2a2a
}
.ethos .block-wrap {
    width: 100%;
    border-top: 1px solid #3a3a3a;
    border-bottom: 1px solid #1a1a1a
}
.blog-preview {
    background: #2a2a2a;
    color: #f2f2f2
}
.blog-preview a {
    color: #cf2029
}
.blog-preview em {
    color: #cf2029;
    font-style: normal
}
.blog-preview p {
    margin-bottom: 1.4em
}
.svg .icon-notebook {
    background: url("../img/base/notebook.svg"/) 0 0 no-repeat;
    background-size: 100% auto;
    width: 1.5em;
    height: 2em;
    float: right;
    color: #1a1a1a
}
@media all and (min-width:40em) {
    #intro {
        margin-bottom: 0
    }
    .grid-home .block-wrap {
        padding: 5px
    }
    .studio {
        background: 0
    }
    .studio>.block-wrap {
        padding: 5px
    }
    .studio .pep-wrapper .image:before {
        padding-top: 100%
    }
    .studio .pep-wrapper figure {
        position: absolute
    }
    .studio .pep-wrapper li {
        padding: 5px
    }
    .projects .block-wrap {
        border: 0 none
    }
    .ethos {
        background: transparent
    }
    .ethos .block-wrap {
        border: 0 none
    }
    .ethos .block-wrap[data-colspan="1"] {
        width: 50%
    }
    .blog-preview {
        margin: 0 5px;
        padding: 40px
    }
}
@media all and (min-width:62.66em) {
    #intro {
        margin: 0
    }
    #logo-block {
        display: block
    }
    .ethos .block-wrap {
        width: 50%
    }
    .grid-home .block-wrap {
        padding: 10px
    }
    .blog-preview {
        margin: 0 10px
    }
    .blog-preview h1 {
        font-size: 42px;
        font-size: 4.2rem
    }
    .blog-preview h2 {
        font-size: 48px;
        font-size: 4.8rem;
        line-height: 1.2;
        margin-bottom: .6em
    }
}
.animated {
    -webkit-animation-duration: .5s;
    -moz-animation-duration: .5s;
    -o-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both
}
@-webkit-keyframes fadeInDown {
    0% {
        opacity: 0;
        -webkit-transform: translateY(-20px)
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
}
@-moz-keyframes fadeInDown {
    0% {
        opacity: 0;
        -moz-transform: translateY(-20px)
    }
    100% {
        opacity: 1;
        -moz-transform: translateY(0)
    }
}
@-o-keyframes fadeInDown {
    0% {
        opacity: 0;
        -o-transform: translateY(-20px)
    }
    100% {
        opacity: 1;
        -o-transform: translateY(0)
    }
}
@keyframes fadeInDown {
    0% {
        opacity: 0;
        transform: translateY(-20px)
    }
    100% {
        opacity: 1;
        transform: translateY(0)
    }
}
.fadeInDown {
    -webkit-animation-name: fadeInDown;
    -moz-animation-name: fadeInDown;
    -o-animation-name: fadeInDown;
    animation-name: fadeInDown
}
@-webkit-keyframes fadeOutDown {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0)
    }
    100% {
        opacity: 0;
        -webkit-transform: translateY(20px)
    }
}
@-moz-keyframes fadeOutDown {
    0% {
        opacity: 1;
        -moz-transform: translateY(0)
    }
    100% {
        opacity: 0;
        -moz-transform: translateY(20px)
    }
}
@-o-keyframes fadeOutDown {
    0% {
        opacity: 1;
        -o-transform: translateY(0)
    }
    100% {
        opacity: 0;
        -o-transform: translateY(20px)
    }
}
@keyframes fadeOutDown {
    0% {
        opacity: 1;
        transform: translateY(0)
    }
    100% {
        opacity: 0;
        transform: translateY(20px)
    }
}
.fadeOutDown {
    -webkit-animation-name: fadeOutDown;
    -moz-animation-name: fadeOutDown;
    -o-animation-name: fadeOutDown;
    animation-name: fadeOutDown
}
.menu-icon2 {
    display: block;
    background: transparent url("../img/base/html-w.png") no-repeat;
    background-size: auto 100%;
    height: 3em;
    width: 3em;
    
}


.menu-icon2.icon-web {
    display: block;
    background: transparent url("../img/base/html-w.png") no-repeat;
    background-size: auto 100%;
    height: 3em;
    width: 3em;
}

.menu-icon2.icon-3d {
    display: block;
    background: transparent url("../img/base/3d-w.png") no-repeat;
    background-size: auto 100%;
    height: 3em;
    width: 3em;
}

.menu-icon2.icon-things {
    display: block;
    background: transparent url("../img/base/things-w.png") no-repeat;
    background-size: auto 100%;
    height: 3em;
    width: 3em;
}