html {
font-family: sans-serif;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
}
body {
margin: 0;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
display: block;
}
audio,
canvas,
progress,
video {
display: inline-block;
vertical-align: baseline;
}
audio:not([controls]) {
display: none;
height: 0;
}
[hidden],
template {
display: none;
}
a {
background: 0 0;
}
a:active,
a:hover {
outline: 0;
}
abbr[title] {
border-bottom: 1px dotted;
}
b,
strong {
font-weight: 700;
}
dfn {
font-style: italic;
}
h1 {
font-size: 2em;
margin: 0.67em 0;
}
mark {
background: #ff0;
color: #000;
}
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: 1em 40px;
}
hr {
box-sizing: content-box;
height: 0;
}
pre {
overflow: auto;
}
code,
kbd,
pre,
samp {
font-family: monospace, monospace;
font-size: 1em;
}
button,
input,
optgroup,
select,
textarea {
color: inherit;
font: inherit;
margin: 0;
}
button {
overflow: visible;
}
button,
select {
text-transform: none;
}
button,
html input[type='button'],
input[type='reset'],
input[type='submit'] {
-webkit-appearance: button;
cursor: pointer;
}
button[disabled],
html input[disabled] {
cursor: default;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
border: 0;
padding: 0;
}
input {
line-height: normal;
}
input[type='checkbox'],
input[type='radio'] {
box-sizing: border-box;
padding: 0;
}
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
height: auto;
}
input[type='search'] {
-webkit-appearance: textfield;
box-sizing: content-box;
}
input[type='search']::-webkit-search-cancel-button,
input[type='search']::-webkit-search-decoration {
-webkit-appearance: none;
}
fieldset {
border: 1px solid silver;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
}
legend {
border: 0;
padding: 0;
}
textarea {
overflow: auto;
}
optgroup {
font-weight: 700;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
td,
th {
padding: 0;
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 300;
src: local('Open Sans Light'), local('OpenSans-Light'),
url(//themes.googleusercontent.com/static/fonts/opensans/v8/DXI1ORHCpsQm3Vp6mXoaTaRDOzjiPcYnFooOUGCOsRk.woff)
format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans'), local('OpenSans'),
url(//themes.googleusercontent.com/static/fonts/opensans/v8/cJZKeOuBrn4kERxqtaUH3bO3LdcAZYWl9Si6vvxL-qU.woff)
format('woff');
}
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 700;
src: local('Open Sans Bold'), local('OpenSans-Bold'),
url(//themes.googleusercontent.com/static/fonts/opensans/v8/k3k702ZOKiLJc3WVjuplzKRDOzjiPcYnFooOUGCOsRk.woff)
format('woff');
}
.loader,
.loader:before,
.loader:after {
background: gray;
-webkit-animation: load1 1s infinite ease-in-out;
animation: load1 1s infinite ease-in-out;
width: 1em;
height: 4em;
}
.loader:before,
.loader:after {
position: absolute;
top: 0;
content: '';
}
.loader:before {
left: -1.5em;
}
.loader {
text-indent: -9999em;
margin: 8em auto;
position: relative;
font-size: 11px;
-webkit-animation-delay: -0.16s;
animation-delay: -0.16s;
}
.loader:after {
left: 1.5em;
-webkit-animation-delay: -0.32s;
animation-delay: -0.32s;
}
@-webkit-keyframes load1 {
0%,
80%,
100% {
box-shadow: 0 0 gray;
height: 4em;
}
40% {
box-shadow: 0 -2em gray;
height: 5em;
}
}
@keyframes load1 {
0%,
80%,
100% {
box-shadow: 0 0 gray;
height: 4em;
}
40% {
box-shadow: 0 -2em gray;
height: 5em;
}
}
@-webkit-keyframes animation {
0% {
height: 0%;
width: 0%;
-webkit-transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
3.333333% {
height: 100%;
width: 100%;
-webkit-transform: matrix3d(
0.34323,
0.11487,
0,
0,
0.07506,
0.34323,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.34323,
0.11487,
0,
0,
0.07506,
0.34323,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
6.666667% {
-webkit-transform: matrix3d(
0.65416,
0.2159,
0,
0,
0.14115,
0.65416,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.65416,
0.2159,
0,
0,
0.14115,
0.65416,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
10% {
-webkit-transform: matrix3d(
0.88518,
0.18431,
0,
0,
0.1219,
0.88518,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.88518,
0.18431,
0,
0,
0.1219,
0.88518,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
13.333333% {
-webkit-transform: matrix3d(
1.02792,
0.0976,
0,
0,
0.06496,
1.02792,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.02792,
0.0976,
0,
0,
0.06496,
1.02792,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
16.666667% {
-webkit-transform: matrix3d(
1.09602,
0.02621,
0,
0,
0.01747,
1.09602,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.09602,
0.02621,
0,
0,
0.01747,
1.09602,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
20% {
-webkit-transform: matrix3d(
1.1117,
-0.0094,
0,
0,
-0.00627,
1.1117,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.1117,
-0.0094,
0,
0,
-0.00627,
1.1117,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
23.333333% {
-webkit-transform: matrix3d(
1.09709,
-0.01805,
0,
0,
-0.01203,
1.09709,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.09709,
-0.01805,
0,
0,
-0.01203,
1.09709,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
26.666667% {
-webkit-transform: matrix3d(
1.0698,
-0.0143,
0,
0,
-0.00954,
1.0698,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.0698,
-0.0143,
0,
0,
-0.00954,
1.0698,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
30% {
-webkit-transform: matrix3d(
1.04151,
-0.00794,
0,
0,
-0.0053,
1.04151,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.04151,
-0.00794,
0,
0,
-0.0053,
1.04151,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
33.333333% {
-webkit-transform: matrix3d(
1.01844,
-0.00306,
0,
0,
-0.00204,
1.01844,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.01844,
-0.00306,
0,
0,
-0.00204,
1.01844,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
36.666667% {
-webkit-transform: matrix3d(
1.00277,
-0.00038,
0,
0,
-0.00025,
1.00277,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00277,
-0.00038,
0,
0,
-0.00025,
1.00277,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
40% {
-webkit-transform: matrix3d(
0.99411,
0.00064,
0,
0,
0.00043,
0.99411,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99411,
0.00064,
0,
0,
0.00043,
0.99411,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
43.333333% {
-webkit-transform: matrix3d(
0.99083,
0.00076,
0,
0,
0.0005,
0.99083,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99083,
0.00076,
0,
0,
0.0005,
0.99083,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
46.666667% {
-webkit-transform: matrix3d(
0.991,
0.00053,
0,
0,
0.00035,
0.991,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.991,
0.00053,
0,
0,
0.00035,
0.991,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
50% {
-webkit-transform: matrix3d(
0.99292,
0.00027,
0,
0,
0.00018,
0.99292,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99292,
0.00027,
0,
0,
0.00018,
0.99292,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
53.333333% {
-webkit-transform: matrix3d(
0.99535,
0.00008,
0,
0,
0.00006,
0.99535,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99535,
0.00008,
0,
0,
0.00006,
0.99535,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
56.666667% {
-webkit-transform: matrix3d(
0.99755,
-0.00001,
0,
0,
0,
0.99755,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99755,
-0.00001,
0,
0,
0,
0.99755,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
60% {
-webkit-transform: matrix3d(
0.99919,
-0.00004,
0,
0,
-0.00002,
0.99919,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99919,
-0.00004,
0,
0,
-0.00002,
0.99919,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
63.333333% {
-webkit-transform: matrix3d(
1.0002,
-0.00003,
0,
0,
-0.00002,
1.0002,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.0002,
-0.00003,
0,
0,
-0.00002,
1.0002,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
66.666667% {
-webkit-transform: matrix3d(
1.00068,
-0.00002,
0,
0,
-0.00001,
1.00068,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00068,
-0.00002,
0,
0,
-0.00001,
1.00068,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
70% {
-webkit-transform: matrix3d(
1.00079,
-0.00001,
0,
0,
-0.00001,
1.00079,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00079,
-0.00001,
0,
0,
-0.00001,
1.00079,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
73.333333% {
-webkit-transform: matrix3d(
1.00069,
0,
0,
0,
0,
1.00069,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00069,
0,
0,
0,
0,
1.00069,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
76.666667% {
-webkit-transform: matrix3d(
1.00049,
0,
0,
0,
0,
1.00049,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00049,
0,
0,
0,
0,
1.00049,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
80% {
-webkit-transform: matrix3d(
1.00029,
0,
0,
0,
0,
1.00029,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00029,
0,
0,
0,
0,
1.00029,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
83.333333% {
-webkit-transform: matrix3d(
1.00013,
0,
0,
0,
0,
1.00013,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00013,
0,
0,
0,
0,
1.00013,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
86.666667% {
-webkit-transform: matrix3d(
1.00002,
0,
0,
0,
0,
1.00002,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00002,
0,
0,
0,
0,
1.00002,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
90% {
-webkit-transform: matrix3d(
0.99996,
0,
0,
0,
0,
0.99996,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99996,
0,
0,
0,
0,
0.99996,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
93.333333% {
-webkit-transform: matrix3d(
0.99994,
0,
0,
0,
0,
0.99994,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99994,
0,
0,
0,
0,
0.99994,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
96.666667% {
-webkit-transform: matrix3d(
0.99994,
0,
0,
0,
0,
0.99994,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99994,
0,
0,
0,
0,
0.99994,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
100% {
height: 100%;
width: 100%;
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
}
@keyframes animation {
0% {
height: 0%;
width: 0%;
-webkit-transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: matrix3d(0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
3.333333% {
height: 100%;
width: 100%;
-webkit-transform: matrix3d(
0.34323,
0.11487,
0,
0,
0.07506,
0.34323,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.34323,
0.11487,
0,
0,
0.07506,
0.34323,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
6.666667% {
-webkit-transform: matrix3d(
0.65416,
0.2159,
0,
0,
0.14115,
0.65416,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.65416,
0.2159,
0,
0,
0.14115,
0.65416,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
10% {
-webkit-transform: matrix3d(
0.88518,
0.18431,
0,
0,
0.1219,
0.88518,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.88518,
0.18431,
0,
0,
0.1219,
0.88518,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
13.333333% {
-webkit-transform: matrix3d(
1.02792,
0.0976,
0,
0,
0.06496,
1.02792,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.02792,
0.0976,
0,
0,
0.06496,
1.02792,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
16.666667% {
-webkit-transform: matrix3d(
1.09602,
0.02621,
0,
0,
0.01747,
1.09602,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.09602,
0.02621,
0,
0,
0.01747,
1.09602,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
20% {
-webkit-transform: matrix3d(
1.1117,
-0.0094,
0,
0,
-0.00627,
1.1117,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.1117,
-0.0094,
0,
0,
-0.00627,
1.1117,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
23.333333% {
-webkit-transform: matrix3d(
1.09709,
-0.01805,
0,
0,
-0.01203,
1.09709,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.09709,
-0.01805,
0,
0,
-0.01203,
1.09709,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
26.666667% {
-webkit-transform: matrix3d(
1.0698,
-0.0143,
0,
0,
-0.00954,
1.0698,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.0698,
-0.0143,
0,
0,
-0.00954,
1.0698,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
30% {
-webkit-transform: matrix3d(
1.04151,
-0.00794,
0,
0,
-0.0053,
1.04151,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.04151,
-0.00794,
0,
0,
-0.0053,
1.04151,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
33.333333% {
-webkit-transform: matrix3d(
1.01844,
-0.00306,
0,
0,
-0.00204,
1.01844,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.01844,
-0.00306,
0,
0,
-0.00204,
1.01844,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
36.666667% {
-webkit-transform: matrix3d(
1.00277,
-0.00038,
0,
0,
-0.00025,
1.00277,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00277,
-0.00038,
0,
0,
-0.00025,
1.00277,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
40% {
-webkit-transform: matrix3d(
0.99411,
0.00064,
0,
0,
0.00043,
0.99411,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99411,
0.00064,
0,
0,
0.00043,
0.99411,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
43.333333% {
-webkit-transform: matrix3d(
0.99083,
0.00076,
0,
0,
0.0005,
0.99083,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99083,
0.00076,
0,
0,
0.0005,
0.99083,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
46.666667% {
-webkit-transform: matrix3d(
0.991,
0.00053,
0,
0,
0.00035,
0.991,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.991,
0.00053,
0,
0,
0.00035,
0.991,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
50% {
-webkit-transform: matrix3d(
0.99292,
0.00027,
0,
0,
0.00018,
0.99292,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99292,
0.00027,
0,
0,
0.00018,
0.99292,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
53.333333% {
-webkit-transform: matrix3d(
0.99535,
0.00008,
0,
0,
0.00006,
0.99535,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99535,
0.00008,
0,
0,
0.00006,
0.99535,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
56.666667% {
-webkit-transform: matrix3d(
0.99755,
-0.00001,
0,
0,
0,
0.99755,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99755,
-0.00001,
0,
0,
0,
0.99755,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
60% {
-webkit-transform: matrix3d(
0.99919,
-0.00004,
0,
0,
-0.00002,
0.99919,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99919,
-0.00004,
0,
0,
-0.00002,
0.99919,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
63.333333% {
-webkit-transform: matrix3d(
1.0002,
-0.00003,
0,
0,
-0.00002,
1.0002,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.0002,
-0.00003,
0,
0,
-0.00002,
1.0002,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
66.666667% {
-webkit-transform: matrix3d(
1.00068,
-0.00002,
0,
0,
-0.00001,
1.00068,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00068,
-0.00002,
0,
0,
-0.00001,
1.00068,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
70% {
-webkit-transform: matrix3d(
1.00079,
-0.00001,
0,
0,
-0.00001,
1.00079,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00079,
-0.00001,
0,
0,
-0.00001,
1.00079,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
73.333333% {
-webkit-transform: matrix3d(
1.00069,
0,
0,
0,
0,
1.00069,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00069,
0,
0,
0,
0,
1.00069,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
76.666667% {
-webkit-transform: matrix3d(
1.00049,
0,
0,
0,
0,
1.00049,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00049,
0,
0,
0,
0,
1.00049,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
80% {
-webkit-transform: matrix3d(
1.00029,
0,
0,
0,
0,
1.00029,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00029,
0,
0,
0,
0,
1.00029,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
83.333333% {
-webkit-transform: matrix3d(
1.00013,
0,
0,
0,
0,
1.00013,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00013,
0,
0,
0,
0,
1.00013,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
86.666667% {
-webkit-transform: matrix3d(
1.00002,
0,
0,
0,
0,
1.00002,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
1.00002,
0,
0,
0,
0,
1.00002,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
90% {
-webkit-transform: matrix3d(
0.99996,
0,
0,
0,
0,
0.99996,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99996,
0,
0,
0,
0,
0.99996,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
93.333333% {
-webkit-transform: matrix3d(
0.99994,
0,
0,
0,
0,
0.99994,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99994,
0,
0,
0,
0,
0.99994,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
96.666667% {
-webkit-transform: matrix3d(
0.99994,
0,
0,
0,
0,
0.99994,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
transform: matrix3d(
0.99994,
0,
0,
0,
0,
0.99994,
0,
0,
0,
0,
1,
0,
0,
0,
0,
1
);
}
100% {
height: 100%;
width: 100%;
-webkit-transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1);
}
}
.thumb-container .thumb-unit-wrap .thumb-overlay {
opacity: 0;
transition: opacity 0.2s linear 0s;
height: 100%;
width: 100%;
top: 0%;
}
.thumb-container .thumb-unit-wrap:hover .thumb-overlay,
.clients-belt .client-unit.active-client {
opacity: 1;
}
@font-face {
font-family: 'social';
src: url('fonts/social.eot');
}
@font-face {
font-family: 'social';
src: url(data:application/x-font-ttf;charset=utf-8;base64,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)
format('truetype');
font-weight: normal;
font-style: normal;
}
i {
font-family: 'social';
speak: none;
font-style: normal;
font-weight: normal;
font-variant: normal;
text-transform: none;
line-height: 1;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-bitbucket:before {
content: '\e600';
}
.icon-facebook:before {
content: '\ea8c';
}
.icon-instagram:before {
content: '\ea90';
}
.icon-twitter:before {
content: '\ea91';
}
.icon-flickr:before {
content: '\eaa1';
}
.icon-github:before {
content: '\eab1';
}
.icon-linkedin:before {
content: '\eac9';
}
.gigantic,
.huge,
.large,
.bigger,
.big,
h1,
h2,
h3,
h4,
h5,
h6 {
color: #333;
font-weight: bold;
}
.gigantic {
font-size: 110px;
line-height: 1.09;
letter-spacing: -2px;
}
.huge,
h1 {
font-size: 68px;
line-height: 1.05;
letter-spacing: -1px;
}
.large,
h2 {
font-size: 42px;
line-height: 1.14;
}
.bigger,
h3 {
font-size: 26px;
line-height: 1.38;
}
.big,
h4 {
font-size: 22px;
line-height: 1.38;
}
.small,
small {
font-size: 10px;
line-height: 1.2;
}
p {
margin: 0 0 20px 0;
}
em {
font-style: italic;
}
strong {
font-weight: bold;
}
hr {
border: solid #ddd;
border-width: 1px 0 0;
clear: both;
margin: 10px 0 30px;
height: 0;
}
a {
color: #c99065;
text-decoration: none;
outline: 0;
transition: all 0.3s ease-in-out;
}
a:hover,
a:focus {
color: #e3c6b1;
transition: all 0.1s ease-in-out;
}
::-moz-selection {
background: #fff498;
}
::selection {
background: #fff498;
}
::-moz-selection {
background: #fff498;
}
img::-moz-selection {
background: transparent;
}
img::selection {
background: transparent;
}
img::-moz-selection {
background: transparent;
}
body {
-webkit-tap-highlight-color: #fff498;
}
body {
background: #fff;
font-size: 16px;
line-height: 1.6;
font-family: 'Open Sans' sans-serif;
color: #666;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
}
svg {
height: 100%;
width: 100%;
}
h3 {
color: #e1c184;
text-align: center;
padding-bottom: 30px;
}
fieldset {
padding: 0;
margin: 0;
border: none;
}
main {
margin-top: 50px;
}
figure {
margin: 0;
}
figcaption {
font-style: italic;
font-weight: bold;
text-align: center;
}
svg {
vertical-align: middle;
position: relative;
top: -1px;
}
img {
max-width: 100%;
}
.contact-section h3,
.alt-section h3 {
color: #d7ac5b;
}
.contact-section {
padding: 0 20px;
}
.svg-sprite-wrapper {
display: none;
}
.visuallyhidden {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}
h3,
header nav a,
header .kicker,
footer .lockup .content-wrap nav a {
font-size: 14px;
font-weight: 700;
text-transform: uppercase;
}
header {
position: relative;
height: 450px;
padding-bottom: 50px;
background-image: url(/assets/img/hero-bg.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: 50% 50%;
background-color: black;
}
header .logo {
position: absolute;
top: 30px;
left: 30px;
height: 50px;
width: 50px;
}
header nav {
float: right;
padding: 30px 30px 0 0;
}
header nav a {
position: relative;
display: inline-block;
margin-left: 20px;
color: white;
}
header nav a::after {
transition: width 0.25s;
content: '';
left: 0;
bottom: -1px;
position: absolute;
display: inline-block;
width: 0;
height: 3px;
background-color: white;
}
header nav a:hover::after,
header nav a:focus::after {
width: 100%;
}
header nav a:hover,
header nav a:focus {
color: #fff;
}
header h1 {
text-align: center;
font-size: 72px;
font-weight: 700;
color: white;
text-transform: uppercase;
letter-spacing: 0.05em;
margin-bottom: 20px;
clear: both;
padding-top: 100px;
}
header h1 span {
display: inline-block;
padding: 0.2em 0.5em;
border: white solid 10px;
}
header .kicker {
text-align: center;
letter-spacing: 0.05em;
color: white;
line-height: 1;
}
header.subpage {
height: 80px;
}
@media (min-width: 767px) {
header.subpage {
height: 60px;
}
header.subpage nav {
top: 50%;
right: 30px;
-webkit-transform: translateY(-50%);
transform: translateY(-50%);
position: absolute;
padding: 0;
}
}
@media (max-width: 640px) {
header {
height: 100vh;
display: flex;
flex-direction: column;
justify-content: center;
}
header > .logo {
left: 0;
text-align: center;
display: block;
width: 100%;
position: static;
}
header nav {
float: none;
text-align: center;
}
header h1 {
padding-top: 0px;
}
}
footer {
margin-top: 50px;
position: relative;
background-image: none, url(/assets/img/footer.jpg);
background-repeat: no-repeat;
background-size: cover;
background-color: black;
display: flex;
flex-direction: column;
justify-content: center;
background-position: top;
text-align: center;
height: 200px;
}
footer .logo {
margin-bottom: 10px;
left: 50px;
height: 40px;
width: 40px;
display: inline-block;
}
footer .logo .icon {
fill: #c99065;
}
footer .lockup .content-wrap .copyright {
margin: 0;
text-transform: uppercase;
font-size: 12px;
color: rgba(255, 255, 255, 0.4);
}
footer nav a {
position: relative;
display: inline-block;
margin-right: 30px;
}
footer nav a::after {
transition: width 0.25s;
content: '';
left: 0;
bottom: -1px;
position: absolute;
display: inline-block;
width: 0;
height: 3px;
background-color: #c99065;
}
footer nav a:hover::after,
footer nav a:focus::after {
width: 100%;
}
@media screen and (max-width: 415px) {
footer {
background-position: right;
justify-content: flex-end;
}
footer .lockup {
margin-bottom: 5%;
}
}
footer nav a:hover,
footer nav a:focus {
color: #c99065;
}
footer .lockup .content-wrap nav a:last-child {
margin-right: 0;
}
.face-lockup {
max-width: 780px;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
margin: 0 auto;
}
.face-lockup .face-img {
height: 200px;
width: 200px;
-webkit-order: 3;
-ms-flex-order: 3;
order: 3;
position: relative;
}
.face-lockup .face-img:hover #avatar,
.face-lockup .face-img:focus #avatar {
opacity: 0;
}
.face-lockup .face-img:hover #avatar--alternate,
.face-lockup .face-img:focus #avatar--alternate {
-webkit-transform: translateY(0);
transform: translateY(0);
opacity: 1;
}
.face-lockup .face-img #avatar--alternate {
-webkit-transform: translateY(100%);
transform: translateY(100%);
opacity: 0;
pointer-events: none;
}
.face-lockup .face-img img {
transition: all 0.3s ease-in-out;
border-radius: 50%;
width: inherit;
position: absolute;
left: 0;
}
.face-lockup .icon {
height: 50px;
width: 50px;
fill: #c99065;
margin: auto;
}
.face-lockup [class^='icon-'] {
height: 100px;
width: 100px;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
background-color: #e5eaee;
border-radius: 5px;
box-sizing: border-box;
}
.face-lockup [class^='icon-'] path {
fill: #c99065;
}
.face-lockup [class^='icon-'].icon-pencil {
-webkit-order: 1;
-ms-flex-order: 1;
order: 1;
}
.face-lockup [class^='icon-'].icon-mouse {
-webkit-order: 2;
-ms-flex-order: 2;
order: 2;
}
.face-lockup [class^='icon-'].icon-browser {
-webkit-order: 4;
-ms-flex-order: 4;
order: 4;
}
.face-lockup [class^='icon-'].icon-video {
-webkit-order: 5;
-ms-flex-order: 5;
order: 5;
}
@media screen and (max-width: 650px) {
.face-lockup {
display: block;
text-align: center;
}
.face-lockup div {
display: inline-block;
}
.face-lockup .face-img {
display: block;
background-position: center center;
background-repeat: no-repeat;
margin: 0 auto 30px;
}
.face-lockup [class^='icon-'] {
display: none;
}
}
.blurb {
max-width: 620px;
padding: 0 20px;
margin: 50px auto;
font-size: 24px;
font-weight: 300;
text-align: center;
}
.skill-lockup {
max-width: 540px;
margin: 100px auto;
color: #999;
}
.skill-lockup:after {
content: '';
display: table;
clear: both;
}
.skill-lockup .skill-unit {
width: 270px;
float: left;
}
.skill-lockup .skill-icons {
font-size: 0;
margin: 3px 0 30px;
}
.skill-lockup .skill-icons span {
display: inline-block;
height: 14px;
width: 14px;
background-color: #c99065;
margin-right: 8px;
border-radius: 2px;
}
.skill-lockup .skill-icons span:after {
content: '';
display: block;
height: 10px;
width: 10px;
background: #fff;
border-radius: 2px;
margin: 2px;
}
.skill-lockup .skill-icons.skill-1 span:nth-child(n + 2),
.skill-lockup .skill-icons.skill-2 span:nth-child(n + 3),
.skill-lockup .skill-icons.skill-3 span:nth-child(n + 4),
.skill-lockup .skill-icons.skill-4 span:nth-child(n + 5),
.skill-lockup .skill-icons.skill-5 span:nth-child(n + 6),
.skill-lockup .skill-icons.skill-6 span:nth-child(n + 7),
.skill-lockup .skill-icons.skill-7 span:nth-child(n + 8),
.skill-lockup .skill-icons.skill-8 span:nth-child(n + 9),
.skill-lockup .skill-icons.skill-9 span:nth-child(n + 10),
.skill-lockup .skill-icons.skill-10 span:nth-child(n + 11) {
background: #e5eaee;
}
@media screen and (max-width: 541px) {
.skill-lockup {
width: 220px;
}
.skill-lockup .skill-unit {
width: 220px;
}
}
.footnotes {
border-color: #ddd;
border-style: solid;
border-width: 1px 0 1px 0;
}
.footnotes h3 {
text-align: left;
padding-left: 20px;
padding-bottom: 0;
}
.footnotelist {
font-size: 14px;
text-align: left;
}
.footnote {
font-size: 50%;
}
sup {
font-weight: bold;
}
.section-work {
overflow-x: hidden;
}
.work__detail {
max-width: 620px;
padding: 0 20px;
margin: 50px auto;
}
.work__detail > hr:first-of-type,
.work__detail hr:first-of-type + hr {
display: none;
}
.work__detail figure {
margin-bottom: 20px;
text-align: center;
}
.work__detail .work__image {
display: block;
}
h3 + .work__detail {
margin-top: 0;
}
.work-belt {
transition: all 800ms;
width: 200%;
position: relative;
left: 0%;
}
.work-belt.slided {
-webkit-transform: translate3d(-50%, 0, 0);
transform: translate3d(-50%, 0, 0);
}
.thumb-wrap,
.work-wrap {
width: 50%;
float: left;
}
.thumb-wrap[aria-hidden='true'],
.work-wrap[aria-hidden='true'] {
display: none;
}
.thumb-container {
display: block;
max-width: 960px;
margin: 0px auto;
}
.thumb-container:after {
content: '';
display: table;
clear: both;
}
.thumb-container .thumb-unit-wrap:nth-last-child(4):first-child,
.thumb-container
.thumb-unit-wrap:nth-last-child(4):first-child
~ .thumb-unit-wrap {
width: 25%;
}
@media screen and (max-width: 760px) {
.thumb-container .thumb-unit-wrap:nth-last-child(4):first-child,
.thumb-container
.thumb-unit-wrap:nth-last-child(4):first-child
~ .thumb-unit-wrap {
width: 50%;
}
}
.thumb-container .thumb-unit-wrap {
position: relative;
display: block;
float: left;
width: 33.33333%;
cursor: pointer;
}
.thumb-container .thumb-unit-wrap .thumb-unit {
display: block;
overflow: hidden;
position: relative;
}
.thumb-container .thumb-unit-wrap .thumb-unit img {
display: block;
max-width: 100%;
}
.thumb-container .thumb-unit-wrap .thumb-unit span {
position: absolute;
right: 10px;
bottom: 5px;
font-size: 12px;
color: white;
text-shadow: 1px 0px 3px rgba(0, 0, 0, 0.5);
text-align: right;
}
@media (max-width: 740px) {
.thumb-container .thumb-unit-wrap .thumb-unit span {
position: absolute;
right: 5px;
bottom: 0px;
}
}
@media screen and (max-width: 760px) {
.thumb-container .thumb-unit-wrap {
width: 50%;
}
}
.thumb-container .thumb-unit-wrap .thumb-overlay {
position: absolute;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
background: rgba(201, 144, 101, 0.9);
text-align: center;
}
.thumb-container .thumb-unit-wrap .thumb-overlay strong {
display: block;
padding: 0 9%;
color: white;
font-weight: 300;
font-size: 24px;
text-transform: uppercase;
line-height: 1.2;
}
.thumb-container .thumb-unit-wrap:hover {
z-index: 2;
}
.work-container {
max-width: 600px;
margin: 0px auto;
padding: 0 15px;
box-sizing: border-box;
position: relative;
display: none;
}
.work-container hr {
margin: 0 0 10px 0;
}
.work-container h4,
.work-container noscript h4 {
color: #c99065;
font-weight: 300;
text-transform: uppercase;
font-size: 28px;
line-height: 1.2;
margin: 0 0 20px;
}
.work-container img {
max-width: 100%;
margin-bottom: 20px;
}
.work-container figure {
margin-bottom: 20px;
text-align: center;
}
.work-container figure img {
margin-bottom: 0;
}
.work-container .work-return {
border: 0;
background: none;
cursor: pointer;
opacity: 0.5;
position: absolute;
top: -4px;
left: -60px;
}
.work-container .work-return .icon {
height: 40px;
width: 40px;
fill: rgba(0, 0, 0, 0.4);
}
.work-container .work-return:hover {
opacity: 1;
}
.work-container .work-return--bottom {
position: absolute;
top: auto;
bottom: -12px;
left: -60px;
}
@media (max-width: 740px) {
.work-container .work-return {
left: 0px;
}
.work-container h4 {
margin-left: 60px;
}
}
#slidy figure figcaption {
display: none !important;
}
#slidy-container {
margin-bottom: 1em;
}
.section-clients {
position: relative;
}
.clients-belt {
width: 100%;
position: relative;
}
.clients-belt .client-unit {
max-width: 750px;
margin: 50px auto;
position: relative;
z-index: 1;
display: none;
}
.clients-belt .client-unit.active-client {
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
}
.clients-belt .client-unit .client-face {
min-width: 300px;
text-align: center;
}
.clients-belt .client-unit .client-face img {
max-width: 100px;
border-radius: 50%;
}
.clients-belt .client-unit .client-face .client-name {
display: block;
text-transform: uppercase;
font-weight: 400;
letter-spacing: 1px;
}
.clients-belt .client-unit .client-face .client-title {
font-style: normal;
font-size: 12px;
color: #999;
}
.clients-belt .client-unit .client-content {
font-size: 18px;
font-weight: 300;
line-height: 36px;
margin-top: -10px;
position: relative;
}
.client-logos {
position: relative;
max-width: 750px;
margin: 0px auto 100px;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-align-items: flex-end;
-ms-flex-align: end;
align-items: flex-end;
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
}
.client-logos .client-logo {
cursor: pointer;
margin: 0 20px 20px;
padding-bottom: 20px;
border-bottom: 4px solid transparent;
opacity: 0.5;
}
.client-logos .client-logo.active-client {
border-bottom: 4px solid #c99065;
opacity: 1;
}
.client-quote-mark {
position: absolute;
top: -18px;
left: -15px;
height: 60px;
width: 60px;
z-index: -1;
opacity: 0.3;
}
.client-quote-mark path {
fill: #c99065;
}
.client-controls {
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
z-index: 2;
}
.client-controls > div {
color: #c99065;
font-weight: 100;
font-size: 50px;
margin-top: -20px;
cursor: pointer;
}
.client-controls .client-control-next {
position: absolute;
top: 50%;
right: 10px;
}
.client-controls .client-control-prev {
position: absolute;
top: 50%;
left: 10px;
}
.clients-mobile-nav {
text-align: center;
position: relative;
z-index: 2;
display: none;
}
.clients-mobile-nav span {
display: inline-block;
height: 16px;
width: 16px;
border-radius: 50%;
border: solid 2px #e5eaee;
margin: 0px 10px;
cursor: pointer;
}
.clients-mobile-nav span.active-client {
border-color: #c99065;
}
@media (max-width: 750px) {
.client-controls {
display: none;
}
.clients-belt {
overflow-x: hidden;
}
.clients-belt .client-unit.active-client {
display: block;
position: relative;
margin-left: 0px;
left: auto;
}
.clients-belt .client-unit.active-client .client-face {
margin-bottom: 30px;
}
.clients-belt .client-unit.active-client .client-content {
padding: 0px 30px;
max-width: 400px;
margin: 0 auto;
}
.clients-belt .client-unit.active-client .client-quote-mark {
left: 6px;
}
.client-controls {
display: none;
}
.client-logos {
display: none;
}
.clients-mobile-nav {
display: block;
}
}
.section-contact {
text-align: center;
background-color: #e5eaee;
margin-top: 100px;
}
.social-links {
max-width: 700px;
margin: 0px auto 50px;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-justify-content: space-around;
-ms-flex-pack: distribute;
justify-content: space-around;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.social-links a {
display: block;
background: #c99065;
height: 50px;
width: 50px;
text-align: center;
line-height: 50px;
color: #fff;
border-radius: 50%;
font-size: 28px;
margin: 20px;
transition: all 0.15s ease-out 0s;
}
.social-links a:hover {
-webkit-transform: scale(1.2);
transform: scale(1.2);
}
.social-links a i {
line-height: 50px;
}
.bar {
width: 250px;
height: 0px;
border-top: 4px solid #c99065;
margin: 0 auto 70px;
}
.biglink {
display: inline-block;
font-size: 72px;
font-weight: 300;
line-height: 1;
margin-bottom: 50px;
width: 100%;
}
form {
max-width: 450px;
margin: 0 auto;
}
form input,
form textarea {
border: 1.5px solid #c99065;
width: 100%;
box-sizing: border-box;
padding: 10px;
}
form input:focus,
form textarea:focus {
outline: none;
border-color: #e1c184;
}
form textarea {
height: 10em;
}
form .submit-wrap {
text-align: right;
}
form [type='submit'] {
background: #c99065;
color: #fff;
font-size: 18px;
text-transform: uppercase;
width: 33%;
transition: all 0.25s;
}
form [type='submit']:hover {
background: #e1c184;
}
form .contact-info-group label {
width: 50%;
float: left;
box-sizing: border-box;
}
form .contact-info-group label:nth-child(1) {
padding-right: 5px;
}
form .contact-info-group label:nth-child(2) {
padding-left: 5px;
}
form label {
display: block;
margin-bottom: 20px;
}
form label span {
display: block;
}