html {
    font-family: sans-serif;
}
body {
    font-family: 'Raleway',sans-serif !important;
    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: none repeat scroll 0 0 transparent;
}
a:active, a:hover {
    outline: 0 none;
}
abbr[title] {
    border-bottom: 1px dotted;
}
b, strong {
    font-weight: bold;
}
dfn {
    font-style: italic;
}
h1 {
    font-size: 2em;
    margin: 0.67em 0;
}
mark {
    background: none repeat scroll 0 0 #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 none;
}
svg:not(:root) {
    overflow: hidden;
}
figure {
    margin: 0;
}
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"] {
    cursor: pointer;
}
button[disabled], html input[disabled] {
    cursor: default;
}
button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0 none;
    padding: 0;
}
input {
    line-height: normal;
}
input[type="checkbox"], input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
}
input[type="search"] {
    box-sizing: content-box;
}
fieldset {
    border: 1px solid #c0c0c0;
    margin: 0 2px;
    padding: 0.35em 0.625em 0.75em;
}
legend {
    border: 0 none;
    padding: 0;
}
textarea {
    overflow: auto;
}
optgroup {
    font-weight: bold;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
td, th {
    padding: 0;
}
html {
    box-sizing: border-box;
}
*, *:before, *:after {
    box-sizing: inherit;
}
body {
    color: #312845;
    font-size: 18px;
    font-style: normal;
    font-variant: normal;
    font-weight: 400;
    height: 100%;
    line-height: 1.52em;
    min-height: 100%;
}
#content {
    font-size: 1em;
}
a {
    color: #e94054;
}
img {
    display: block;
    margin: 0;
    vertical-align: baseline;
}
p {
    line-height: 1.52em;
}
table {
    border: 1px solid #d9d9e1;
}
table td {
    border: 1px solid #d9d9e1;
    padding: 1em;
}
.sozo-content a {
    font-weight: 400;
    text-decoration: none;
}
.sozo-content a:hover {
    text-decoration: none;
}
.sozo-message {
    border: 1px solid #fff;
    border-radius: 3px;
    color: #fff !important;
    font-size: 0.88889em;
    font-weight: bold;
    height: auto;
    padding: 0.83333em 0.83333em 0.83333em 2.5em;
    width: auto;
}
.sozo-error {
    background: url("/images/icons/sozo-messages/function-alert.png") no-repeat scroll 0.55556em 0.55556em #de4343 !important;
    font-weight: bold !important;
}
.sozo-success {
    background: url("/images/icons/sozo-messages/function-tick.png") no-repeat scroll 0.55556em 0.55556em #61b832 !important;
}
.sozo-warning {
    background: url("/images/icons/sozo-messages/function-information.png") no-repeat scroll 0.55556em 0.55556em #e47742 !important;
}
.sozo-information {
    background: url("/images/icons/sozo-messages/function-help.png") no-repeat scroll 0.55556em 0.55556em #4c98e5 !important;
}
.sozo-message a {
    color: #fff !important;
}
#sozo-protection {
    display: none;
}
.diag1.cta2, .project-intro, .project-list .secondary-list, .reviews .alternating-items article:nth-of-type(4n+4) {
    background-color: #25eefe;
}
.csstransforms #header .primary-nav:before, .diag1.cta1, .project-article .quote-wrapper, .csstransitions .home .mega-circle:before {
    background-color: #d62956;
    background-image: linear-gradient(44deg, #e94054, #d62956);
}
.diag2.cta1, .reviews .alternating-items article:nth-of-type(4n+2), .about-landing .quote-wrapper, .contact .contact-details {
    background-color: #d62956;
    background-image: linear-gradient(84deg, #d62956, #e94054);
}
.services.service-children .project-list, .reviews .alternating-items article:nth-of-type(4n+1), .blog-list-simple {
    background: linear-gradient(24deg, #d9d9e1, #ffffff) repeat scroll 0 0 #ededf1;
}
.reviews .alternating-items article:nth-of-type(4n+3) {
    background: linear-gradient(44deg, #1c1c38, #382447) repeat scroll 0 0 #1c1c38;
}
.csstransforms3d .diag1 {
    backface-visibility: hidden;
    transform: translateZ(0px) skew(0deg, 4deg);
}
.csstransforms3d .diag1 .wrapper {
    transform: translateZ(0px) skew(0deg, -4deg);
}
.diag2, .fake-btm1:after, .csstransforms .portfolio.index .project-hero:before, .about .moving-gallery, .home .moving-gallery {
    backface-visibility: hidden;
    transform: skew(0deg, -3deg);
}
.csstransforms3d .diag2 .wrapper, .csstransforms3d .about .moving-gallery div, .csstransforms3d .home .moving-gallery div {
    transform: translateZ(0px) skew(0deg, 3deg);
}
.diag2.fake-btm:after {
    backface-visibility: hidden;
    transform: skew(0deg, 6deg);
}
.diag1.fake-btm:after {
    backface-visibility: hidden;
    transform: skew(0deg, -6deg);
}
.diag1 {
    backface-visibility: hidden;
    transform: skew(0deg, 4deg);
}
.diag1 .wrapper {
    transform: skew(0deg, -4deg);
}
.diag2 .wrapper, .about .moving-gallery div, .home .moving-gallery div {
    transform: skew(0deg, 3deg);
}
.title-header .heading1:after, .title-border1 .heading2:after, .services.service-children .project-list .title.heading3:after, .about-landing .quote-wrapper .title.heading3:after, .info-article .secondary .related .heading3:after, .contact .contact-details .unit .heading3:after {
    background-color: #fff;
    content: "";
    display: block;
    height: 0.1em;
    margin: 0.5em auto 0;
    opacity: 0.3;
    width: 1.6em;
}
.project-article.watch-gecko .alternating-items .item.even, .project-article.videomybusiness .alternating-items .item.even, .project-article.mosaic .alternating-items .item.even, .project-article.skygarden .alternating-items .item.even, .project-article.gocompare .alternating-items .item.even, .project-article.adtech .alternating-items .item.even, .project-article.threecounties .alternating-items .item.even, .project-article.plunkett .alternating-items .item.even, .project-article.imagin .alternating-items .item.even, .project-article.sophie-everett .alternating-items .item.even, .project-article.mccarthy .alternating-items .item.even, .project-article.smarthomesounds .alternating-items .item.even, .project-article.tritech .alternating-items .item.even, .project-article.benjamin-chocolatier .alternating-items .item.even, .project-article.annette-rose .alternating-items .item.even, .project-article.jumping-spider .alternating-items .item.even, .project-article.cotswold-grange .alternating-items .item.even, .project-article.turtle-homes .alternating-items .item.even, .project-article.katie-bonas .alternating-items .item.even, .project-article.rubbertech .alternating-items .item.even, .project-article.just-fabrics .alternating-items .item.even {
    background-position: right 32%;
    background-repeat: no-repeat;
    background-size: 50% auto;
}
body {
}
a {
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}
p {
    margin-bottom: 1em;
    margin-top: 1em;
}
ul {
    list-style: none outside none;
    padding: 0;
}
ul li {
    background-image: none;
    margin: 0;
    padding: 0;
}
.svg ul li {
    background-image: none;
}
blockquote {
    color: #222;
    line-height: 1.52em;
    margin-left: 0;
    margin-right: 0;
}
.quote-wrapper .quote blockquote {
    font-style: italic;
    margin: 0.5em 0;
    padding: 0;
}
h1, h2, h3, h4, h5, h6 {
    font-size: 1em;
    font-weight: normal;
    margin: 1em 0;
    padding: 0;
}
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
    text-decoration: none;
}
.heading1, .heading2, .heading3, .heading4, .heading5, .heading6, .heading7, .heading8 {
    line-height: 1.4em;
    margin: 0.5em 0;
}
.heading1, .heading2, .heading3, .heading4 {
    font-style: normal;
    font-weight: 300;
}
.heading5, .heading6 {
    font-weight: 400;
}
.heading1 {
    font-size: 3.44444em;
    line-height: 1.1em;
}
.heading2 {
    color: #222;
    font-size: 2.44444em;
}
.heading3 {
    color: #222 !important;
    font-size: 0.77778em;
    font-weight: bold;
    opacity: 0.42;
    text-transform: uppercase;
}
.heading4 {
    font-size: 1.66667em;
    line-height: 1.3em;
}
.heading5 {
    font-size: 1.66667em;
}
.heading6 {
    font-size: 1.22222em;
}
.icon1:before, .icon1 a, .icon1 span {
    display: inline-block;
    vertical-align: middle;
}
.icon1:before {
    background: url("../images/icons/sprite-service-icons-lightbg1.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    content: "";
    height: 28px;
    margin-right: 0.5em;
    width: 28px;
}
.svg .icon1:before {
    background-image: url("../images/icons/sprite-service-icons-lightbg1.svg?v=1");
}
.icon1.web-design:before {
    background-position: 0 0;
}
.icon1.cms:before {
    background-position: 7.14286% 0;
}
.icon1.web-dev:before {
    background-position: 14.2857% 0;
}
.icon1.responsive:before {
    background-position: 21.4286% 0;
}
.icon1.seo:before {
    background-position: 28.5714% 0;
}
.icon1.marketing:before {
    background-position: 35.7143% 0;
}
.icon1.hosting:before {
    background-position: 42.8571% 0;
}
.icon1.e-commerce:before {
    background-position: 50% 0;
}
.icon1.ppc:before {
    background-position: 57.1429% 0;
}
.icon1.facebook:before {
    background-position: 64.2857% 0;
}
.icon1.logo-design:before {
    background-position: 71.4286% 0;
}
.icon1.advertising:before {
    background-position: 78.5714% 0;
}
.icon1.corporate-id:before {
    background-position: 85.7143% 0;
}
.icon1.brochure:before {
    background-position: 92.8571% 0;
}
.icon1.packaging:before {
    background-position: 100% 0;
}
.services-diag1 .item-wrapper ul a:before {
    background: url("../images/icons/sprite-service-diag-icons1.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    content: "";
    height: 72px;
    left: 50%;
    margin-left: -36px;
    margin-top: -46.8px;
    position: absolute;
    top: 50%;
    width: 72px;
}
.svg .services-diag1 .item-wrapper ul a:before {
    background-image: url("../images/icons/sprite-service-diag-icons1.svg?v=1");
}
.services-diag1 .item-wrapper ul a.design-parent:before {
    background-position: 0 0;
}
.services-diag1 .item-wrapper ul a.responsive:before {
    background-position: 9.09091% 0;
}
.services-diag1 .item-wrapper ul a.web-dev:before {
    background-position: 18.1818% 0;
}
.services-diag1 .item-wrapper ul a.e-commerce:before {
    background-position: 27.2727% 0;
}
.services-diag1 .item-wrapper ul a.branding-parent:before {
    background-position: 36.3636% 0;
}
.services-diag1 .item-wrapper ul a.logo-design:before {
    background-position: 45.4546% 0;
}
.services-diag1 .item-wrapper ul a.corporate-id:before {
    background-position: 54.5454% 0;
}
.services-diag1 .item-wrapper ul a.brochures:before {
    background-position: 63.6364% 0;
}
.services-diag1 .item-wrapper ul a.marketing-parent:before {
    background-position: 72.7273% 0;
}
.services-diag1 .item-wrapper ul a.strategy:before {
    background-position: 81.8182% 0;
}
.services-diag1 .item-wrapper ul a.seo:before {
    background-position: 90.9091% 0;
}
.services-diag1 .item-wrapper ul a.email:before {
    background-position: 100% 0;
}
.icon2 {
    background: url("sprite-social-icons-darkbg1.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    content: "";
    height: 24px;
    width: 24px;
}
.svg .icon2 {
    background-image: url("sprite-social-icons-darkbg1.svg?v=1");
}
.icon2.twitter {
    background-position: 0 0;
}
.icon2.linkedin {
    background-position: 25% 0;
}
.icon2.gplus {
    background-position: 50% 0;
}
.icon2.vimeo {
    background-position: 75% 0;
}
.icon2.youtube {
    background-position: 100% 0;
}
.btn {
    border-radius: 3px;
    box-sizing: border-box;
    display: inline-block;
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    font-size: 0.77778em;
    font-style: normal;
    font-weight: 700;
    margin-bottom: 1em;
    margin-top: 1em;
    padding: 0.65em 1.235em;
    position: relative;
    text-transform: uppercase;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.btn1 {
    border: 1px solid #e94054;
    color: #e94054;
}
.btn1:hover {
    background: none repeat scroll 0 0 #e94054;
    color: #fff;
}
.btn2 {
    border: 1px solid #fff;
    color: #fff;
}
.btn2:hover {
    background: none repeat scroll 0 0 #fff;
    color: #e94054;
}
.btn3 {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #fff;
    color: #e94054;
}
.btn3:hover {
    background: none repeat scroll 0 0 transparent;
    color: #fff;
}
.btn4 {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #fff;
    color: #44b5d5;
}
.btn4:hover {
    background: none repeat scroll 0 0 transparent;
    color: #fff;
}
input[type="number"], input[type="text"], input[type="tel"], input[type="email"], textarea {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: #fff;
    border-color: -moz-use-text-color -moz-use-text-color #312845;
    border-image: none;
    border-style: none none solid;
    border-width: medium medium 1px;
    box-shadow: none;
    color: #473b65;
    font-family: "ff-tisa-web-pro",Georgia,Times,"Times New Roman",serif;
    font-style: italic;
    padding: 0.65em 0;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
input[type="number"]:focus, input[type="text"]:focus, input[type="tel"]:focus, input[type="email"]:focus, textarea:focus {
    background-color: #fff;
    color: #312845;
    outline: medium none;
}
input[type="submit"], button {
    border: medium none;
    outline: medium none;
}
fieldset {
    border: medium none;
    margin: 0;
    padding: 0;
}
label {
    display: block;
    font-size: 0.88889em;
    line-height: 1.3em;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.form label, .form input, .form textarea {
    float: left;
    margin-bottom: 1em;
    margin-top: 1em;
}
.form input, .form textarea {
    font-size: 1em;
}
.form textarea {
    border: 1px solid #312845;
    height: 12em;
    padding: 0.65em 1.235em;
}
.form .btn {
    color: #fff;
    margin: 0;
    outline: medium none;
    width: auto;
}
.lt-ie9 input[type="radio"], .lt-ie9 input[type="checkbox"] {
    display: inline-block;
    margin-right: 5px;
    position: relative;
    top: 23px;
    width: auto;
}
.lt-ie9 input[type="radio"] + label, .lt-ie9 input[type="checkbox"] + label {
    display: inline-block;
}
form:not(#idonotexist) input[type="radio"], form:not(#idonotexist) input[type="checkbox"] {
    left: 0;
    margin: 0;
    opacity: 0;
    position: absolute;
    top: 1.6em;
    z-index: -1;
}
form:not(#idonotexist) input[type="checkbox"] + label {
    cursor: pointer;
    padding-left: 36px;
    position: relative;
}
form:not(#idonotexist) input[type="checkbox"] + label:before {
    background: url("/images/icons/sprite-icons1.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    content: "";
    height: 28px;
    left: 0;
    position: absolute;
    top: -0.2em;
    width: 28px;
}
.svg form:not(#idonotexist) input[type="checkbox"] + label:before {
    background-image: url("/images/icons/sprite-icons1.svg");
}
form:not(#idonotexist) input[type="radio"] + label {
    cursor: pointer;
    padding-top: 40px;
    position: relative;
    text-align: center;
}
form:not(#idonotexist) input[type="radio"] + label:before {
    background: url("/images/icons/sprite-icons1.png") no-repeat scroll -56px 0 rgba(0, 0, 0, 0);
    content: "";
    height: 28px;
    left: 50%;
    margin-left: -14px;
    margin-top: -14px;
    position: absolute;
    top: 18px;
    width: 28px;
}
.svg form:not(#idonotexist) input[type="radio"] + label:before {
    background-image: url("/images/icons/sprite-icons1.svg");
}
form:not(#idonotexist) input[type="checkbox"]:checked + label {
    color: #e94054;
}
form:not(#idonotexist) input[type="checkbox"]:checked + label:before {
    background-position: -28px 0;
}
form:not(#idonotexist) input[type="radio"]:checked + label {
    color: #e94054;
}
form:not(#idonotexist) input[type="radio"]:checked + label:before {
    background-position: -84px 0;
}
.project-list .secondary-list .unit, #footer .unit {
    margin-left: 2.6506%;
    width: 21.6868%;
}
.project-list .secondary-list .unit:nth-child(4n+1), #footer .unit:nth-child(4n+1) {
    clear: left;
}
.project-hero .copy, .project-intro .work li, .project-list .primary-list .unit, .alternating-items .item .copy, .alternating-items .item .media {
    margin-left: 2.6506%;
    width: 46.0241%;
}
.project-hero .copy:nth-child(2n+1), .project-intro .work li:nth-child(2n+1), .project-list .primary-list .unit:nth-child(2n+1), .alternating-items .item .copy:nth-child(2n+1), .alternating-items .item .media:nth-child(2n+1) {
    clear: left;
}
.title-header.left-align .copy, .reviews .item .media {
    margin-left: 2.6506%;
    width: 29.7992%;
}
.title-header.left-align .copy:nth-child(3n+1), .reviews .item .media:nth-child(3n+1) {
    clear: left;
}
.reviews .item .copy {
    margin-left: 2.6506%;
    width: 62.249%;
}
.reviews .item .copy:nth-child(3n+1) {
    clear: left;
}
.results .unit {
    margin-left: 1.3253%;
    width: 23.3434%;
}
.results .unit:nth-child(4n+1) {
    clear: left;
}
.contact .form .about-you input, .contact .contact-details .unit {
    margin-left: 4.88889%;
    width: 42.6667%;
}
.contact .form .about-you input:nth-child(2n+1), .contact .contact-details .unit:nth-child(2n+1) {
    clear: left;
}
.contact .form .service .col {
    margin-left: 4.88889%;
    width: 18.8889%;
}
.contact .form .service .col:nth-child(4n+1) {
    clear: left;
}
@keyframes scroll1 {
0% {
    transform: translateY(0.01%);
}
30% {
    transform: translateY(0.01%);
}
40% {
    transform: translateY(-36%);
}
50% {
    transform: translateY(-36%);
}
60% {
    transform: translateY(-74%);
}
80% {
    transform: translateY(-74%);
}
100% {
    transform: translateY(0.01%);
}
}
@keyframes scroll1 {
0% {
    transform: translateY(0.01%);
}
30% {
    transform: translateY(0.01%);
}
40% {
    transform: translateY(-36%);
}
50% {
    transform: translateY(-36%);
}
60% {
    transform: translateY(-74%);
}
80% {
    transform: translateY(-74%);
}
100% {
    transform: translateY(0.01%);
}
}
@keyframes scroll2 {
0% {
    transform: translateY(0.01%);
}
40% {
    transform: translateY(0.01%);
}
50% {
    transform: translateY(-59%);
}
90% {
    transform: translateY(-59%);
}
100% {
    transform: translateY(0.01%);
}
}
@keyframes scroll2 {
0% {
    transform: translateY(0.01%);
}
40% {
    transform: translateY(0.01%);
}
50% {
    transform: translateY(-59%);
}
90% {
    transform: translateY(-59%);
}
100% {
    transform: translateY(0.01%);
}
}
@keyframes scroll3 {
0% {
    transform: translateY(0.01%);
}
40% {
    transform: translateY(0.01%);
}
50% {
    transform: translateY(-45%);
}
90% {
    transform: translateY(-45%);
}
}
@keyframes scroll3 {
0% {
    transform: translateY(0.01%);
}
40% {
    transform: translateY(0.01%);
}
50% {
    transform: translateY(-45%);
}
90% {
    transform: translateY(-45%);
}
}
@keyframes bounce {
0%, 84%, 90.6%, 96%, 80%, 100% {
    transform: translateY(0.01%);
}
88%, 88.6% {
    transform: translateY(-30px);
}
94% {
    transform: translateY(-15px);
}
98% {
    transform: translateY(-4px);
}
}
@keyframes bounce {
0%, 84%, 90.6%, 96%, 80%, 100% {
    transform: translateY(0.01%);
}
88%, 88.6% {
    transform: translateY(-30px);
}
94% {
    transform: translateY(-15px);
}
98% {
    transform: translateY(-4px);
}
}
.sozo-content ol li, .sozo-content ul li {
    margin: 0.3em 0;
}
.sozo-content ul {
    margin-bottom: 1em;
    margin-top: 1em;
}
.sozo-content ul li {
    background: url("/images/bg/bullet1.png") no-repeat scroll left 0.65em rgba(0, 0, 0, 0);
    display: block;
    padding-left: 12px;
}
.svg .sozo-content ul li {
    background-image: url("../images/../images/bg/bullet1.svg?v=1");
}
.sozo-content a {
    font-weight: 400;
    text-decoration: none;
}
.sozo-content a:hover {
    text-decoration: none;
}
.sozo-content ol {
    padding-left: 1.5em;
    padding-right: 0;
}
.sozo-content blockquote {
    font-family: "ff-tisa-web-pro",Georgia,Times,"Times New Roman",serif;
    font-size: 1.22222em;
    font-style: italic;
    line-height: 1.4em;
    margin: 1em 0;
    padding: 1em 2.5em;
    position: relative;
}
.sozo-content blockquote:before, .sozo-content blockquote:after {
    color: #d3d3dd;
    display: block;
    font-family: "ff-tisa-web-pro",Georgia,Times,"Times New Roman",serif;
    font-size: 5em;
    font-style: italic;
    position: absolute;
}
.sozo-content blockquote:before {
    content: "“";
    left: 0;
    top: 0.4em;
}
.sozo-content blockquote:after {
    bottom: -0.1em;
    content: "”";
    right: 0.15em;
}
.sozo-content img {
    margin-bottom: 2.3em;
    margin-top: 2.3em;
}
.sozo-content h1, .sozo-content h2, .sozo-content h3, .sozo-content h4, .sozo-content h5 {
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    font-style: normal;
    font-weight: 300;
    line-height: 1.52em;
}
.sozo-content h1 {
    font-size: 2em;
}
.sozo-content h2 {
    font-size: 1.77778em;
}
.sozo-content h3 {
    font-size: 1.55556em;
}
.sozo-content h4 {
    font-size: 1.44444em;
}
.sozo-content h5 {
    font-size: 1.33333em;
}
.main-content {
    overflow: hidden;
    width: 100%;
}
.wrapper {
    clear: both;
    margin: 0 auto;
    max-width: 92.2222em;
    position: relative;
    width: 100%;
}
.wrapper:after {
    clear: both;
    content: "";
    display: table;
}
.main-content .wrapper {
    padding-bottom: 5.55556em;
    padding-top: 5.55556em;
}
.unit {
    float: left;
    margin-bottom: 1.3253%;
    margin-left: 2.6506%;
    margin-top: 1.3253%;
}
.start {
    clear: both;
}
.media img {
    height: auto;
    width: 100%;
}
.js-cwhidereveal {
    cursor: pointer;
}
.js .cw-hidden {
    display: none;
}
canvas {
    overflow: visible;
}
.lt-ie9 .ie8-hide {
    display: none;
}
#header {
    font-style: normal;
    font-weight: 300;
    left: 0;
    position: fixed;
    top: 0;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
    z-index: 10;
}
.Google_partner{
    position: absolute;
    width: 170px;
    height: 77px;
    top: 8px;
    right: 145px;
}
#header .project-nav {
    position: fixed;
    right: -128px;
    top: 61px;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
#header .project-nav a {
    background: none repeat scroll 0 0 rgba(28, 28, 56, 0.9);
    display: block;
    height: 64px;
    overflow: hidden;
    position: relative;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 64px;
}
#header .project-nav a span {
    border: 0 none;
    clip: rect(0px, 0px, 0px, 0px);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
#header .project-nav a:after {
    background: url("../images/icons/sprite-icons1.png?v=1") no-repeat scroll -112px 0 rgba(0, 0, 0, 0);
    content: "";
    height: 42px;
    margin-top: -21px;
    position: absolute;
    top: 50%;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 19px;
}
.svg #header .project-nav a:after {
    background-image: url("../images/icons/sprite-icons1.svg?v=1");
}
#header .project-nav a.next:after {
    background-position: -131px 0;
    right: 21px;
}
#header .project-nav a.next:hover:after {
    right: 18px;
}
#header .project-nav a.prev:after {
    left: 21px;
}
#header .project-nav a.prev:hover:after {
    left: 18px;
}
#header .project-nav a:hover {
    background: none repeat scroll 0 0 #1c1c38;
}
#header.scrolled {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.97);
    min-height: 90px;
    border-bottom: 1px solid #eee;
}
#header.scrolled .Google_partner{
    top:10px !important;
}
#header.scrolled .showm{
    margin-top: 14px;
}
#header.scrolled > .wrapper {
    padding-bottom: 10px;
    padding-top: 10px;
}
#header.scrolled .logo {
    background: url("../images/sozo-logo-light-bg.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.lt-ie10 #header.scrolled .logo {
    background: url("../images/sozo-logo-light-bg.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
}
.svg #header.scrolled .logo {
    background-image: none;
}
#header.scrolled .logo img {
    display: none;
}
.lt-ie10 #header.scrolled .logo img {
    display: none !important;
}
.svg #header.scrolled .logo img {
    display: block;
}
#header.scrolled .logo .ozo path {
    fill: #312845 !important;
}
#header.scrolled .project-nav {
    right: 0;
}
#header.active {
    background: none repeat scroll 0 0 #fff;
}
#header.active .logo {
    background: url("../images/sozo-web-design-cheltenham.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.lt-ie10 #header.active .logo {
    background: url("../images/sozo-web-design-cheltenham.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
}
.svg #header.active .logo {
    background-image: none;
}
#header.active .logo img {
    display: none;
}
.lt-ie10 #header.active .logo img {
    display: none !important;
}
.svg #header.active .logo img {
    display: block;
}
#header.active .logo .ozo path {
    fill: #fff !important;
}
#header.active .project-nav {
    right: -128px;
}
#header .logo {
    display: block;
    float: left;
    margin-left: 2.6506%;
    z-index: 15;
}
.csstransforms #header .logo {
    float: none;
}
#header .logo a {
    display: block;
    overflow: hidden;
    width: 55%;  
    z-index: 9999;
}
#header .logo img, #header .logo svg {
    height: auto;
    width: 100%;
    z-index: 9999;
}
#header .logo .ozo path {
    fill: #fff;
    transition: all 2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
#header .logo .ozo path.trans {
    fill: transparent;
}
#header > .wrapper {
    padding-bottom: 2%;
    padding-top: 2%;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
#header .nav-wrapper {
    float: right;
    width: 500px;
}
.csstransforms #header .nav-wrapper {
    float: none;
    width: auto;
}
#header .primary-nav {
    float: right;
    padding-left: 2.6506%;
}
.csstransforms #header .primary-nav {
    float: none;
    padding-left: 0;
}
#header .primary-nav .nav-links li {
    float: left;
    padding-right: 1.5em;
    width: auto;
}
.csstransforms #header .primary-nav .nav-links li {
    float: none;
    padding-right: 0;
}
#header .primary-nav .nav-links .contact {
    display: none;
}
#header .showm {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    box-sizing: content-box;
    display: none;
    float: right;
    height: 41px;
    margin-right: 2.6506%;
    padding-left: 2.8em;
    position: relative;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 41px;
    z-index: 12;
}
.lt-ie10.csstransforms #header .showm {
    display: block;
    overflow: hidden;
}
#header .showm:after, #header .showm:before, #header .showm span:before {
    background: none repeat scroll 0 0 #e94054;
    content: "";
    height: 2px;
    left: 18px;
    position: absolute;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 27px;
}
#header .showm:before {
    top: 11px;
    transform-origin: 25px 50% 0;
}
#header .showm:after {
    bottom: 10px;
    transform-origin: 25px 50% 0;
}
#header .showm span {
    font-size: 20px;
    font-weight: 400;
    line-height: 40px;
    text-transform: uppercase;
}
#header .showm span:before {
    top: 20px;
}
#header .showm span b {
    position: relative;
    right: 0.4em;
}
#header .showm.active {
    color: #fff;
}
#header .showm.active:after, #header .showm.active:before, #header .showm.active span:before {
    background: none repeat scroll 0 0 #fff;
}
body:after {
    background: none repeat scroll 0 0 rgba(50, 50, 56, 0.9);
    content: "";
    height: 100%;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
    z-index: -1;
}
.lt-ie9 body:after {
    display: none;
}
body.nav-active:after {
    opacity: 1;
    z-index: 9;
}
.csstransforms #header .logo {
    margin-top: -2%;
    position: absolute;
    top: 40%;
}
.csstransforms #header .showm {
    display: block;
}
.csstransforms #header .nav-wrapper {
    height: 100%;
    position: fixed;
    right: -100%;
    top: 0;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
    z-index: 10;
}
.csstransforms #header .nav-wrapper.active {
    right: 0;
    visibility: visible;
}
.csstransforms #header .nav-wrapper.active .primary-nav {
    opacity: 1;
}
.csstransforms #header .nav-wrapper.active .primary-nav:before {
    opacity: 1;
}
.csstransforms #header .nav-wrapper.active .primary-nav .nav-links li {
    opacity: 1;
    transform: translateX(0px);
}
.csstransforms #header .nav-wrapper.active .primary-nav .nav-links li:nth-child(1) {
    transition-delay: 0.04s;
}
.csstransforms #header .nav-wrapper.active .primary-nav .nav-links li:nth-child(2) {
    transition-delay: 0.08s;
}
.csstransforms #header .nav-wrapper.active .primary-nav .nav-links li:nth-child(3) {
    transition-delay: 0.12s;
}
.csstransforms #header .nav-wrapper.active .primary-nav .nav-links li:nth-child(4) {
    transition-delay: 0.16s;
}
.csstransforms #header .nav-wrapper.active .primary-nav .nav-links li:nth-child(5) {
    transition-delay: 0.2s;
}
.csstransforms #header .nav-wrapper.active .primary-nav .nav-links li:nth-child(6) {
    transition-delay: 0.24s;
}
.csstransforms #header .nav-wrapper.active .primary-nav .nav-links li:nth-child(7) {
    transition-delay: 0.28s;
}
.csstransforms #header .nav-wrapper.active .primary-nav .nav-links li:nth-child(8) {
    transition-delay: 0.32s;
}
.csstransforms #header .primary-nav {
    height: 100%;
    position: relative;
    right: 0;
    top: 0;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
    z-index: 11;
}
.csstransforms #header .primary-nav:before {
    backface-visibility: hidden;
    content: "";
    height: 100%;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transform: translateZ(0px) translateX(45%) skew(28deg);
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 51%;
    z-index: 11;
}
.csstransforms #header .primary-nav .nav-links {
    left: 50%;
    margin: auto;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    z-index: 11;
}
.csstransforms #header .primary-nav .nav-links li {
    clear: both;
    float: none;
    height: auto;
    margin: 0;
    opacity: 0;
    padding: 0 2.6506% 0 0;
    position: relative;
    text-align: right;
    transform: translateX(30%);
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
}
.csstransforms #header .primary-nav .nav-links li a {
    color: #fff;
    display: inline-block;
    font-size: 1.66667em;
    font-weight: 300;
    padding: 0.6em 0;
    position: relative;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    z-index: 14;
}
.csstransforms #header .primary-nav .nav-links li a:hover {
    color: #1c1c38;
}
.csstransforms #header .primary-nav .nav-links li:before, .csstransforms #header .primary-nav .nav-links li:after {
    content: "";
    left: -20%;
    opacity: 0;
    pointer-events: none;
    width: 140%;
}
.csstransforms #header .primary-nav .nav-links li.contact {
    display: block;
}
.csstransforms #header .primary-nav .nav-links li.contact a {
    font-size: 0.88889em;
    font-weight: 700;
    opacity: 0.5;
    padding: 0;
}
.csstransforms #header .primary-nav .nav-links li.contact a:hover {
    color: #fff;
    opacity: 1;
}
.csstransforms #header .primary-nav .nav-links li.contact.tel {
    margin-top: 2em;
}
.csstransitions #header .showm.active:before {
    top: 12px;
    transform: rotate3d(0, 0, 1, -45deg);
}
.csstransitions #header .showm.active:after {
    bottom: 11px;
    transform: rotate3d(0, 0, 1, 45deg);
}
.csstransitions #header .showm.active span:before {
    opacity: 0;
    transform: scale(0, 0);
}
.no-touch .csstransitions #header .showm.active:hover:after, .no-touch .csstransitions #header .showm.active:hover:before {
    left: 19.5px;
    width: 11.3px;
}
.no-touch .csstransitions #header .showm.active:hover:after {
    bottom: 10px;
    transform: rotate3d(0, 0, 1, 40deg);
}
.no-touch .csstransitions #header .showm.active:hover:before {
    top: 11px;
    transform: rotate3d(0, 0, 1, -40deg);
}
.no-touch .csstransitions #header .showm.active:hover span:before {
    opacity: 1;
    transform: scale(1, 1);
}
.person-thumb, .person-thumb:after {
    border-radius: 30px;
    height: 60px;
    overflow: hidden;
    width: 60px;
}
.person-thumb {
    position: relative;
    z-index: 2;
}
.person-thumb img {
    position: relative;
    z-index: 1;
}
.person-thumb:after {
    box-shadow: 0 3px 0.5px rgba(0, 0, 0, 0.1) inset;
    content: "";
    left: 0;
    position: absolute;
    top: 0;
    z-index: 3;
}
.loader-wrapper {
    background: none repeat scroll 0 0 #ededf1;
    padding-bottom: 2.77778em;
    padding-top: 2.77778em;
    text-align: center;
}
.loader-wrapper .btn {
    display: inline-block;
}
.infinite-load.btn.hide {
    opacity: 0;
}
.meta.blog {
    padding: 0 0 0.25em;
}
.meta.blog .person-thumb, .meta.blog .tags {
    display: inline-block;
    margin: 0 0.5em;
    vertical-align: middle;
}
.meta.blog .tags a {
    color: #312845;
}
.meta .tags a {
    color: inherit;
    font-weight: 300;
}
.meta .tags a, .meta .tags span, .meta .tags cite, .meta .tags a:before, .meta .tags span:before, .meta .tags cite:before {
    display: inline-block;
    vertical-align: middle;
}
.meta .tags span:before, .meta .tags cite:before, .meta .tags a:before {
    background: none repeat scroll 0 0 #312845;
    content: "";
    height: 2.22222em;
    margin: 0 1em 0 0.5em;
    opacity: 0.55;
    transform: skew(518deg, 0deg);
    width: 1px;
}
.meta .tags cite {
    font-style: normal;
    font-weight: 700;
}
.meta .tags span:first-child, .meta .tags a:first-child {
    position: relative;
    top: -0.11111em;
}
.meta .tags span:first-child:before, .meta .tags a:first-child:before {
    display: none;
}
.lt-ie9 .diag1.cta1 {
    background: none repeat scroll 0 0 #e94054;
}
.lt-ie9 .diag1.cta2 {
    background: none repeat scroll 0 0 #44b5d5;
}
.diag1.fake-btm {
    padding-bottom: 10em;
    position: relative;
}
.diag1.fake-btm:after {
    background: none repeat scroll 0 0 #1c1c38;
    bottom: -10em;
    content: "";
    height: 20em;
    left: -20%;
    position: absolute;
    width: 140%;
}
.lt-ie9 .diag2.cta1 {
    background: none repeat scroll 0 0 #e94054;
}
.diag2.fake-btm {
    padding-bottom: 8em;
    position: relative;
}
.diag2.fake-btm:after {
    background: none repeat scroll 0 0 #1c1c38;
    bottom: -8em;
    content: "";
    height: 16em;
    left: -20%;
    position: absolute;
    width: 140%;
}
.cta1, .cta2, .quote-wrapper {
    color: #fff;
    text-align: center;
}
.cta1 .wrapper, .cta2 .wrapper, .quote-wrapper .wrapper {
    max-width: 50em;
    padding-left: 1.3253%;
    padding-right: 1.3253%;
}
.cta1 .sozo-content, .cta2 .sozo-content {
    margin-left: auto;
    margin-right: auto;
    max-width: 35.5556em;
}
.fake-btm1 {
    padding-bottom: 2.5em;
    position: relative;
}
.fake-btm1 .wrapper {
    z-index: 3;
}
.fake-btm1:after {
    background: none repeat scroll 0 0 #1c1c38;
    bottom: 4em;
    content: "";
    height: 20em;
    left: -20%;
    position: absolute;
    width: 140%;
    z-index: 1;
}
.service-list1 li {
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    font-size: 0.88889em;
    font-weight: 300;
    padding: 0.2em 0;
}
.service-list1 li a {
    color: #312845;
}
.title-header {
    background: none repeat scroll 0 0 #fff;
    color: black;
    min-height: 708px;
    text-align: center;
}
.title-header .wrapper {
    max-width: 56.8889em;
    padding: 7.10417em 1.3253% 4.55556em;
}
.title-header .heading1 span {
    color: #e94054;
    display: inline-block;
    font-weight: 700;
    width: 100%;
}
.title-header .sozo-content {
    font-size: 1.22222em;
    margin-left: auto;
    margin-right: auto;
    max-width: 29.0909em;
}
.title-header .sozo-content a {
    color: inherit;
}
.contact .title-header .sozo-content a {
    color: #e94054;
}
.title-header.left-align .wrapper {
    max-width: 92.2222em;
    padding-left: 0;
    padding-right: 0;
}
.title-header.left-align .copy {
    text-align: left;
}
.title-header.left-align .copy .heading1:after {
    margin-left: 0;
}
.title-header.left-align .sozo-content {
    font-size: 1em;
}
.title-border1 .heading3 {
    margin-bottom: 2.5em;
}
.moving-gallery {
    box-shadow: 0 3px 6px #aaa;
    box-sizing: content-box;
    float: left;
    height: 365px;
    overflow: hidden;
    position: relative;
    width: 100%;
    z-index: 1;
}
.moving-gallery div {
    background: url("team-photos1.jpg") repeat scroll center top / 2229px 365px rgba(0, 0, 0, 0);
    height: 365px;
    left: -150%;
    position: absolute;
    top: 0;
    width: 400%;
}
.scroll-down {
    border: 1px solid #fff;
    border-radius: 30px;
    display: block;
    height: 60px;
    overflow: hidden;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 60px;
    z-index: 40;
}
.scroll-down:before {
    background: url("../images/icons/sprite-icons1.png?v=1") no-repeat scroll -150px 0 rgba(0, 0, 0, 0);
    bottom: 30px;
    content: "";
    height: 20px;
    left: 50%;
    margin-bottom: -14px;
    margin-left: -21px;
    position: absolute;
    width: 42px;
}
.svg .scroll-down:before {
    background-image: url("../images/icons/sprite-icons1.svg?v=1");
}
.project-hero {
    background: none repeat scroll 0 0 #1c1c38;
    color: #fff;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.project-hero .wrapper {
    display: table;
    height: 38.8889em;
}
.no-touch .project-hero .wrapper {
    height: 94vh;
}
.project-hero .copy {
    display: table-cell;
    padding-left: 5.3012%;
    vertical-align: middle;
}
.project-hero .heading2:after {
    margin-left: 0;
}
.project-hero .heading2 a {
    color: #fff;
}
.project-hero .meta span:before {
    background: none repeat scroll 0 0 #fff;
}
.lt-ie9 .devices-ipad-iphone1, .lt-ie9 .devices-imac-iphone1 {
    display: none;
}
.devices-imac-iphone1 {
    left: 50%;
    margin-top: -335.455px;
    max-height: 738px;
    max-width: 870px;
    padding-bottom: 44.4578%;
    position: absolute;
    top: 50%;
    width: 52.4096%;
    z-index: 1;
}
.devices-imac-iphone1:after {
    background: url("../images/bg/devices/imac-iphone-large1.png?v=1") no-repeat scroll 0 0 / cover rgba(0, 0, 0, 0);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 3;
}
.devices-imac-iphone1 .desktop, .devices-imac-iphone1 .phone {
    overflow: hidden;
    position: absolute;
}
.devices-imac-iphone1 .desktop img, .devices-imac-iphone1 .phone img {
    left: 0;
    position: absolute;
    top: 0;
    z-index: 2;
}
.devices-imac-iphone1 .desktop:before, .devices-imac-iphone1 .phone:before {
    background: none repeat scroll 0 0 #333;
    content: "";
    height: 104%;
    left: -2%;
    position: absolute;
    top: -2%;
    width: 104%;
    z-index: 1;
}
.devices-imac-iphone1 .phone {
    height: 34.2105%;
    left: 8.75%;
    top: 53.454%;
    width: 16.3889%;
    z-index: 2;
}
.devices-imac-iphone1 .phone.animated img {
    animation: 8s cubic-bezier(0.075, 0.82, 0.165, 1) 0s normal none infinite scroll1;
}
.devices-imac-iphone1 .desktop {
    height: 65.1316%;
    left: 4.30556%;
    top: 4.60526%;
    width: 91.8056%;
    z-index: 1;
}
.devices-imac-iphone1 .desktop.animated img {
    animation: 9.5s ease 0s normal none infinite scroll2;
}
.devices-ipad-iphone1 {
    left: 50%;
    margin-top: -325.455px;
    max-height: 716px;
    max-width: 640px;
    padding-bottom: 43.1325%;
    position: absolute;
    top: 50%;
    width: 38.5542%;
    z-index: 1;
}
.devices-ipad-iphone1:after {
    background: url("../images/bg/devices/ipad-iphone-large1.png?v=1") no-repeat scroll 0 0 / cover rgba(0, 0, 0, 0);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 3;
}
.devices-ipad-iphone1 .ipad, .devices-ipad-iphone1 .phone {
    overflow: hidden;
    position: absolute;
}
.devices-ipad-iphone1 .ipad img, .devices-ipad-iphone1 .phone img {
    left: 0;
    position: absolute;
    top: 0;
    z-index: 2;
}
.devices-ipad-iphone1 .ipad:before, .devices-ipad-iphone1 .phone:before {
    background: none repeat scroll 0 0 #333;
    content: "";
    height: 104%;
    left: -2%;
    position: absolute;
    top: -2%;
    width: 104%;
    z-index: 1;
}
.devices-ipad-iphone1 .phone {
    height: 42.1053%;
    left: 5.52486%;
    top: 45.2303%;
    width: 27.256%;
    z-index: 2;
}
.devices-ipad-iphone1 .phone.animated img {
}
.devices-ipad-iphone1 .ipad {
    height: 66.2829%;
    left: 29.2818%;
    top: 7.56579%;
    width: 55.8011%;
    z-index: 1;
}
.devices-ipad-iphone1 .ipad.animated img {
}
.project-intro {
    color: #555;
}
.lt-ie9 .project-intro {
    background: none repeat scroll 0 0 #44b5d5;
}
.project-intro .wrapper {
    padding-left: 1.3253%;
    padding-right: 1.3253%;
}
.project-intro .copy, .project-intro .work {
    display: inline-block;
    float: left;
    vertical-align: middle;
    width: 50%;
}
.csstransforms .project-intro .copy, .csstransforms .project-intro .work {
    margin-bottom: 10em;
    margin-top: -10em;
}
.csstransforms .project-intro .copy {
    margin-top: -5em;
}
.project-intro .copy .inner {
    margin-left: auto;
    margin-right: auto;
    max-width: 24.4444em;
}
.project-intro .copy .heading2:after {
    margin-left: 0;
}
.project-intro .work li {
    display: inline-block;
    margin-bottom: 1.3253%;
    margin-top: 1.3253%;
    vertical-align: middle;
}
.project-intro .work li a:hover img {
    transform: scale(1.05, 1.05);
}
.project-intro .work li a img {
    border: 8px solid #25eefe;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.project-intro .work .media {
    overflow: hidden;
}
.project-intro .work .more {
    margin-bottom: 0;
    margin-top: 0;
    text-align: center;
}
.project-intro .work .more .btn {
    margin: 0;
}
.project-intro .work .more .btn:hover {
    color: #3ad2b7;
}
.js .portfolio.index #header .logo {
    background: url("../images/sozo-logo-light-bg.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.js.svg .portfolio.index #header .logo {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: red;
}
.js .portfolio.index #header .logo img, .lt-ie10.js.svg .portfolio.index #header .logo img {
    display: none;
}
.portfolio.index #header .logo .ozo path {
    fill: #312845;
}
.portfolio.index .title-header {
    background: none repeat scroll 0 0 #fff;
    color: #312845;
}
.portfolio.index .title-header .heading1:after {
    background: none repeat scroll 0 0 #1c1c38;
}
.csstransforms .portfolio.index .title-header .wrapper {
    padding-bottom: 0;
}
.csstransforms .portfolio.index .project-hero:before {
    background: none repeat scroll 0 0 #fff;
    content: "";
    height: 11em;
    left: -20%;
    position: absolute;
    top: -5em;
    width: 140%;
}
.csstransforms .portfolio.index .project-hero {
    padding-top: 10em;
}
.portfolio.index .project-hero .wrapper {
    height: 32.2222em;
}
.portfolio.index .project-hero .wrapper .copy {
    position: relative;
    top: -2.44444em;
}
.project-list .title {
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    font-size: 0.77778em;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2em;
    text-transform: uppercase;
}
.project-list .unit a:hover .media img {
    transform: scale(1.05, 1.05);
}
.project-list .unit .media img {
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.project-list .primary-list {
    background: none repeat scroll 0 0 #fff;
}
.project-list .primary-list .wrapper {
    margin-top: -5em;
    padding-bottom: 20.8333em;
    padding-top: 0;
}
.project-list .primary-list .unit {
    text-align: left;
}
.project-list .primary-list .unit .media {
    display: block;
    overflow: hidden;
    position: relative;
    z-index: 3;
}
.project-list .primary-list .unit .title {
    bottom: 0;
    color: #312845;
    display: block;
    font-size: 1em;
    left: 0;
    padding: 1em 1.25em;
    position: absolute;
    text-shadow: 0 0 3px #fff;
    width: 100%;
    z-index: 4;
}
.project-list .primary-list .unit .title:before {
    background-image: linear-gradient(transparent, rgba(255, 255, 255, 0.6));
    bottom: 0;
    content: "";
    height: 4.6em;
    left: 0;
    position: absolute;
    width: 100%;
    z-index: -1;
}
.project-list .primary-list .unit.dark-bg .title {
    color: #fff;
    text-shadow: 0 0 3px #000;
}
.project-list .primary-list .unit.dark-bg .title:before {
    background-image: linear-gradient(transparent, rgba(0, 0, 0, 0.6));
}
.project-list .secondary-list {
    margin-top: 0;
    text-align: center;
}
.lt-ie9 .project-list .secondary-list {
    background: none repeat scroll 0 0 #44b5d5;
}
.project-list .secondary-list > .wrapper {
    margin-top: -12.2222em;
    padding-bottom: 0;
    padding-top: 0;
    position: relative;
    top: -9.27778em;
}
.project-list .secondary-list ul {
    clear: both;
}
.project-list .secondary-list ul:after {
    clear: both;
    content: "";
    display: table;
}
.project-list .secondary-list .unit {
    text-align: center;
}
.project-list .secondary-list .unit .media {
    position: relative;
}
.project-list .secondary-list .unit .title {
    color: #fff;
    font-size: 0.88889em;
    padding: 1em 1.25em 0;
}
.project-list .secondary-list .btn {
    margin-top: 3em;
}
.project-list .secondary-list .btn2:hover {
    color: #44b5d5;
}
.project-list .cta1 .wrapper {
    margin-top: -6.66667em;
    padding-top: 0;
}
.project-list .cta1 .wrapper .btn3 {
    color: #44b5d5;
}
.project-list .cta1 .wrapper .btn3:hover {
    color: #fff;
}
.browser-screen1 {
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    display: block;
    margin-top: 0;
}
.browser-screen1 i {
    border-radius: 5px;
    display: block;
    height: 10px;
    left: 5px;
    position: absolute;
    top: 5px;
    width: 10px;
}
.browser-screen1 i:nth-child(2) {
    left: 19px;
}
.browser-screen1 i:nth-child(3) {
    left: 32px;
}
.browser-screen1 i:after {
    content: "";
    height: 2px;
    left: -1px;
    position: absolute;
    top: 1px;
    width: 10px;
}
.lt-ie9 .browser-screen1 i {
    display: none;
}
.browser-screen1:before {
    border-image: none;
    content: "";
    display: block;
    height: 1.16667em;
    overflow: hidden;
    width: 100%;
}
.lt-ie9 .browser-screen1:before {
    display: none;
}
.browser-screen1 .inner {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #c5c5d1;
    display: block;
    overflow: hidden;
    width: 100%;
}
.lt-ie9 .browser-screen1 .inner {
    border: medium none;
}
.browser-screen1.no-top:before, .browser-screen1.no-top i {
    display: none;
}
.alternating-items .item {
    position: relative;
}
.alternating-items .item:first-child {
    z-index: 2;
}
.csstransforms .alternating-items .item:first-child {
    margin-top: -6em;
    padding-bottom: 10em;
}
.csstransforms .alternating-items .item:first-child .media {
    left: 10%;
    top: 15%;
}
.alternating-items .item .title-border1 .heading2:after {
    background-color: #312845;
    margin-left: 0;
}
.alternating-items .item .copy .inner {
    max-width: 26.6667em;
    width: 100%;
}
.alternating-items .item .browser-screen1 {
    position: absolute;
}
.alternating-items .item.odd {
    background: none repeat scroll 0 0 #fff;
}
.alternating-items .item.odd .copy {
    float: right;
    margin-right: 2.6506%;
    padding-left: 2.6506%;
}
.alternating-items .item.even {
    background: none repeat scroll 0 0 #d9d9e1;
    z-index: 3;
}
.csstransforms .alternating-items .item.even {
    margin-top: -10em;
}
.alternating-items .item.even .media {
    right: 1.3253%;
}
.alternating-items .item.even .copy {
    float: left;
    padding-right: 2.6506%;
}
.alternating-items .item.even .copy .inner {
    float: right;
}
.alternating-items .item:nth-child(2), .alternating-items .item:nth-child(3), .alternating-items .item:nth-child(4) {
    overflow: hidden;
}
.alternating-items .item:nth-child(2) .browser-screen1, .alternating-items .item:nth-child(3) .browser-screen1, .alternating-items .item:nth-child(4) .browser-screen1 {
    top: 0;
}
.alternating-items .item:nth-child(2) .browser-screen1 .inner, .alternating-items .item:nth-child(3) .browser-screen1 .inner, .alternating-items .item:nth-child(4) .browser-screen1 .inner {
    border-top: medium none;
}
.js .project-article.dark-bg #header .logo {
    background: url("../images/sozo-web-design-cheltenham.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.js.svg .project-article.dark-bg #header .logo {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.js .project-article.dark-bg #header .logo img, .lt-ie10.js.svg .project-article.dark-bg #header .logo img {
    display: none;
}
.js.svg .project-article.dark-bg #header .logo .ozo path {
    fill: #fff;
}
.project-article.dark-bg .project-hero {
    color: #fff;
}
.project-article.dark-bg .project-hero .heading2:after {
    background-color: #fff;
}
.project-article.dark-bg .project-hero .meta span:before {
    background: none repeat scroll 0 0 #fff;
}
.project-article .project-hero {
    background: none repeat scroll 0 0 #ededf1;
    color: #312845;
    padding-bottom: 3em;
}
.backgroundsize .project-article .project-hero {
    background: url("../images/bg/texture-light1-large.jpg?v=1") no-repeat scroll center top / cover #fff;
}
.project-article .project-hero .heading2:after {
    background-color: #312845;
}
.project-article .project-hero .meta span:before {
    background: none repeat scroll 0 0 #312845;
}
.project-article .alternating-items {
    position: relative;
    z-index: 3;
}
.project-article .alternating-items .item.last {
    padding-bottom: 10em;
}
.project-article .alternating-items .item .sozo-content {
    display: inline;
}
.project-article .alternating-items .browser-screen1 img {
}
.project-article .quote-wrapper {
    margin-bottom: -11em;
    margin-top: -7.5em;
    padding-bottom: 10em;
    position: relative;
    z-index: 4;
}
.lt-ie9 .project-article .quote-wrapper {
    background: none repeat scroll 0 0 #e94054;
}
.project-article .quote-wrapper .meta .tags cite:before {
    background: none repeat scroll 0 0 #fff;
}
.project-article .results {
    background: none repeat scroll 0 0 #1c1c38;
    color: #e94054;
    margin-top: -10em;
    position: relative;
    text-align: center;
    z-index: 5;
}
.project-article .results .title-border1 .heading2:after {
    background-color: #e94054;
}
.project-article .results .btn1:hover {
    color: #1c1c38;
}
.project-article .cta1 {
    padding-bottom: 10em;
    position: relative;
    z-index: 6;
}
.project-article .no-results .quote-wrapper {
    background: none repeat scroll 0 0 #1c1c38;
}
.project-article .no-results.no-review .diag2.cta1 {
    margin-top: -11em;
}
.results {
    text-align: center;
}
.results .unit {
    display: inline-block;
    float: none;
    margin-left: 0.66265%;
    margin-right: 0.66265%;
    position: relative;
}
.js .results .unit.animate-me {
    opacity: 0;
}
.results .unit p {
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    font-weight: 300;
    line-height: 1.3em;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.results .unit p > span {
    color: #e94054;
    font-family: "Oswald",Helvetica,Arial,sans-serif;
    font-size: 48px;
    font-weight: 300;
    left: 0;
    margin-top: -41px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 100%;
}
.results .unit p > span i {
    font-style: normal;
}
.js .results .unit.search1 p span {
    display: none;
}
.results .unit.search1 svg text {
    color: #e94054;
    font-family: "Oswald",Helvetica,Arial,sans-serif;
    font-size: 48px;
    font-weight: 300;
}
.services.services-landing .scroll-down {
    bottom: -3.2em;
    left: 50%;
    margin-left: -30px;
    opacity: 0.5;
    position: absolute;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.services.services-landing .scroll-down.animate-me {
    opacity: 0;
}
.touch .services.services-landing .scroll-down {
    display: none;
}
.services.services-landing .title-header .wrapper {
    margin-bottom: -3em;
    padding-bottom: 0;
}
.services.services-landing .cta1.fake-btm:after {
    background: none repeat scroll 0 0 #fff;
}
.services.services-landing .services-diag1 {
    margin: -14.6em 0 -6em;
}
.services.services-landing .services-diag1 a.parent:before {
    display: none;
}
.services.services-landing .services-diag1 .scroll-down {
    bottom: 7em;
}
.services.service-children #header .logo .ozo path {
    fill: #fff;
}
.services.service-children #particles1 {
    top: 50%;
    transform: translate(0px, -50%);
    z-index: 2;
}
.services.service-children .title-header {
    background: none repeat scroll 0 0 #1c1c38;
    color: #fff;
    padding-bottom: 8em;
    position: relative;
    z-index: 3;
}
.backgroundsize .services.service-children .title-header:after {
    background: url("../images/bg/angle-white1.png?v=1") no-repeat scroll center bottom rgba(0, 0, 0, 0);
    bottom: -2px;
    content: "";
    display: block;
    left: -5%;
    padding-bottom: 7.83133%;
    position: absolute;
    width: 110%;
    z-index: 4;
}
.svg.backgroundsize .services.service-children .title-header:after {
    background-image: url("../images/bg/angle-white1.svg?v=1");
    background-size: 100% auto;
}
.services.service-children .title-header .copy {
    position: relative;
    width: 27.5em;
    z-index: 5;
}
.services.service-children .title-header .heading1:after {
    background: none repeat scroll 0 0 #fff;
}
.services.service-children .title-header .sozo-content ul li {
    background-image: url("../images/bg/bullet2.png?v=1");
}
.svg .services.service-children .title-header .sozo-content ul li {
    background-image: url("../images/bg/bullet2.svg?v=1");
}
.services.service-children .title-header .sozo-content a {
    color: #e94054;
}
.services.service-children .project-list {
    position: relative;
    z-index: 2;
}
.services.service-children .project-list .title.heading3 {
    font-size: 0.88889em;
    margin-bottom: 3em;
    opacity: 0.6;
    text-align: center;
}
.services.service-children .project-list .title.heading3:after {
    background: none repeat scroll 0 0 #312845;
}
.lt-ie9 .services.service-children .project-list .title.heading3 {
    color: #1c1c38;
}
.backgroundsize .services.service-children .project-list .primary-list {
    margin-top: -10em;
}
.services.service-children .project-list .primary-list .wrapper {
    margin-top: 0;
    padding-top: 5.55556em;
}
.backgroundsize .services.service-children .project-list .primary-list .wrapper {
    padding-top: 12em;
}
.services.service-children .diag-wrapper, .services.service-children .item-wrapper {
    left: 47.7711%;
    margin-top: -241.277px;
    padding-bottom: 567px;
    padding-top: 0;
    position: absolute;
    top: 50%;
    width: 613px;
}
.services.service-children .diag-wrapper svg {
    left: 0;
    position: absolute;
    top: 0;
}
.services.service-children .item-wrapper > ul li a {
    z-index: 5;
}
.backgroundsize .services.service-children .item-wrapper > ul li a {
    padding-bottom: 29.5269%;
    width: 29.5269%;
}
.lt-ie10 .services.service-children .item-wrapper > ul li a {
    display: block;
    overflow: hidden;
}
.services.service-children .item-wrapper .parent {
    left: 27.2431%;
    margin-top: 31.6476%;
}
.backgroundsize .services.service-children .item-wrapper .parent {
    padding-bottom: 45.8401%;
    width: 45.8401%;
}
.services.service-children .item-wrapper .parent.design-parent {
    background: url("../images/bg/service-web1-no-icon.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.svg .services.service-children .item-wrapper .parent.design-parent {
    background-image: none;
}
.services.service-children .item-wrapper .parent.marketing-parent {
    background: url("../images/bg/service-marketing1-no-icon.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.svg .services.service-children .item-wrapper .parent.marketing-parent {
    background-image: none;
}
.services.service-children .item-wrapper .parent.branding-parent {
    background: url("../images/bg/service-branding1-no-icon.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.svg .services.service-children .item-wrapper .parent.branding-parent {
    background-image: none;
}
.services.service-children .item-wrapper .responsive, .services.service-children .item-wrapper .logo-design, .services.service-children .item-wrapper .seo {
    left: 35.5628%;
    margin-top: 7.17781%;
}
.services.service-children .item-wrapper .web-dev, .services.service-children .item-wrapper .corporate-id, .services.service-children .item-wrapper .email {
    left: 63.4584%;
}
.services.service-children .item-wrapper .e-commerce, .services.service-children .item-wrapper .brochures, .services.service-children .item-wrapper .strategy {
    left: 7.17781%;
}
.services.service-children .item-wrapper .web-dev, .services.service-children .item-wrapper .e-commerce, .services.service-children .item-wrapper .corporate-id, .services.service-children .item-wrapper .email, .services.service-children .item-wrapper .brochures, .services.service-children .item-wrapper .strategy {
    margin-top: 344px;
}
#service-diag1 {
    overflow: visible !important;
}
.no-mix-blend-mode #service-diag1 .circle {
    filter: url("#color-dodge");
}
.mix-blend-mode #service-diag1 .circle {
}
#service-diag1 .children circle:hover {
    opacity: 1 !important;
}
.services-diag1 {
    position: relative;
}
.services-diag1 #particles1 {
    left: 0;
    position: absolute;
    top: 0;
    transition: all 4s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.services-diag1 #particles1.animate-me {
    opacity: 0;
}
.services-diag1 .diag-outer, .services-diag1 .item-wrapper > ul {
    margin-left: auto;
    margin-right: auto;
    max-width: 820px;
    width: 100%;
}
.services-diag1 .diag-wrapper, .services-diag1 .item-wrapper {
    display: inline-block;
    padding-bottom: 95.1219%;
    position: relative;
    vertical-align: middle;
    width: 100%;
}
.services-diag1 .diag-wrapper svg, .services-diag1 .item-wrapper svg {
    display: block;
    left: 0;
    overflow: visible;
    position: absolute;
    top: 0;
    width: 100%;
}
.services-diag1 .item-wrapper {
    height: 100%;
    left: 0;
    padding-bottom: 5.55556em;
    padding-top: 5.55556em;
    position: absolute;
    top: 0;
    width: 100%;
}
.services-diag1 .item-wrapper ul {
    margin-bottom: 0;
    margin-top: 0;
}
.js .services-diag1 .item-wrapper ul .animate-me {
    opacity: 0;
}
.services-diag1 .item-wrapper ul a:before {
    opacity: 0.77;
}
.services-diag1 .item-wrapper ul a.parent:before {
    opacity: 1;
}
.services-diag1 .item-wrapper > ul {
    position: relative;
}
.services-diag1 .item-wrapper > ul li a {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    border-radius: 50%;
    display: block;
    overflow: hidden;
    padding-bottom: 180px;
    position: absolute;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 180px;
}
.backgroundsize .services-diag1 .item-wrapper > ul li a {
    padding-bottom: 21.9512%;
    width: 21.9512%;
}
.services-diag1 .item-wrapper > ul li a span {
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    font-size: 0.72222em;
    font-weight: 700;
    left: 0;
    line-height: 1.2em;
    margin-top: 2em;
    padding: 0 1.8em;
    position: absolute;
    text-align: center;
    text-transform: uppercase;
    top: 50%;
    width: 100%;
}
.services-diag1 .item-wrapper .parent {
    padding-bottom: 289px;
    width: 289px;
}
.backgroundsize .services-diag1 .item-wrapper .parent {
    padding-bottom: 35.2439%;
    width: 35.2439%;
}
.services-diag1 .item-wrapper .parent span {
    font-size: 0.88889em;
    margin-top: 36px;
    top: 50%;
}
.services-diag1 .item-wrapper .parent.design-parent {
    background: url("../images/bg/service-web1.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.svg .services-diag1 .item-wrapper .parent.design-parent {
    background-image: none;
}
.services-diag1 .item-wrapper .parent.marketing-parent {
    background: url("../images/bg/service-marketing1.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.svg .services-diag1 .item-wrapper .parent.marketing-parent {
    background-image: none;
}
.services-diag1 .item-wrapper .parent.branding-parent {
    background: url("../images/bg/service-branding1.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.svg .services-diag1 .item-wrapper .parent.branding-parent {
    background-image: none;
}
.services-diag1 .item-wrapper .web-design a {
    color: #ed3952;
}
.services-diag1 .item-wrapper .web-design > a {
    left: 32.439%;
    margin-top: 18.2927%;
}
.services-diag1 .item-wrapper .marketing a {
    color: #5cc4ca;
}
.services-diag1 .item-wrapper .marketing > a {
    left: 18.2927%;
    margin-top: 42.9268%;
}
.services-diag1 .item-wrapper .branding a {
    color: #4f96ed;
}
.services-diag1 .item-wrapper .branding > a {
    margin-top: 42.9268%;
    right: 18.1707%;
}
.services-diag1 .item-wrapper .responsive {
    left: 23.0488%;
    margin-top: 5.89744%;
}
.services-diag1 .item-wrapper .web-dev {
    left: 39.0244%;
    margin-top: 0;
}
.services-diag1 .item-wrapper .e-commerce {
    margin-top: 5.89744%;
    right: 23.1707%;
}
.services-diag1 .item-wrapper .email {
    left: 0.38462%;
    margin-top: 45.2564%;
}
.services-diag1 .item-wrapper .seo {
    left: 3.33333%;
    margin-top: 62.1795%;
}
.services-diag1 .item-wrapper .strategy {
    left: 16.2821%;
    margin-top: 73.2051%;
}
.services-diag1 .item-wrapper .logo-design {
    margin-top: 45.2564%;
    right: 0.25641%;
}
.services-diag1 .item-wrapper .corporate-id {
    margin-top: 62.0513%;
    right: 3.33333%;
}
.services-diag1 .item-wrapper .brochures {
    margin-top: 73.2051%;
    right: 16.2821%;
}
.services-landing #process-diag text, .about-landing #process-diag text {
    display: none;
}
.process-diag {
    color: #fff;
}
.process-diag .heading2 {
    text-align: center;
}
.process-diag .heading2:after {
    background: none repeat scroll 0 0 #fff;
}
.process-diag .wrapper.title-border1 {
    padding-bottom: 0;
    padding-top: 0;
}
.process-diag .wrapper.diag {
    padding-bottom: 16em;
    padding-top: 0;
}
.process-diag .diag-outer.process {
    margin-left: auto;
    margin-right: auto;
    max-width: 67.3333em;
}
.process-diag .diag-outer.process .diag-wrapper {
    display: inline-block;
    padding-bottom: 72.9373%;
    position: relative;
    vertical-align: middle;
    width: 100%;
}
.process-diag .diag-outer.process .diag-wrapper svg {
    display: block;
    left: 0;
    overflow: visible;
    position: absolute;
    top: 0;
    width: 100%;
}
.process-diag .item-wrapper {
    background: url("../images/bg/process-diag.jpg?v=1") no-repeat scroll center top rgba(0, 0, 0, 0);
    counter-reset: list-counter;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.svg .process-diag .item-wrapper {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.process-diag .item-wrapper .item {
    counter-increment: list-counter;
    max-width: 17.7778em;
    position: absolute;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.js .process-diag .item-wrapper .item.animate-me {
    opacity: 0;
    transform: translate(0px, 1em);
}
.process-diag .item-wrapper .item .sozo-content {
    font-size: 0.88889em;
    font-weight: 300;
}
.process-diag .item-wrapper .item .heading3 {
    font-size: 0.88889em;
    font-weight: 700;
    opacity: 1;
    position: relative;
}
.process-diag .item-wrapper .item .heading3:before {
    content: counter(list-counter, decimal);
    display: block;
    font-size: 1.44444em;
    font-style: italic;
    font-weight: 400;
    left: -1.8em;
    opacity: 0.4;
    position: absolute;
    top: -0.5em;
    width: 1em;
}
.process-diag .item-wrapper .item .heading3:after {
    background: none repeat scroll 0 0 #312845;
    content: "";
    height: 2.22222em;
    left: -0.9em;
    opacity: 0.5;
    position: absolute;
    top: -0.6em;
    transform: skew(518deg, 0deg);
    width: 1px;
}
.process-diag .item-wrapper .item.discover {
    left: 25.3012%;
    top: 7%;
}
.process-diag .item-wrapper .item.discover .heading3 {
    color: #3ad2b7;
}
.process-diag .item-wrapper .item.discover .heading3:after {
    background: none repeat scroll 0 0 #3ad2b7;
}
.process-diag .item-wrapper .item.design {
    right: 2.6506%;
    top: 10%;
}
.process-diag .item-wrapper .item.design .heading3 {
    color: #44b5d5;
}
.process-diag .item-wrapper .item.design .heading3:after {
    background: none repeat scroll 0 0 #44b5d5;
}
.process-diag .item-wrapper .item.develop {
    right: 22.2892%;
    top: 43%;
}
.process-diag .item-wrapper .item.develop .heading3 {
    color: #5572cf;
}
.process-diag .item-wrapper .item.develop .heading3:after {
    background: none repeat scroll 0 0 #5572cf;
}
.process-diag .item-wrapper .item.refine {
    left: 5.3012%;
    top: 56%;
}
.process-diag .item-wrapper .item.refine .heading3 {
    color: #764bb3;
}
.process-diag .item-wrapper .item.refine .heading3:after {
    background: none repeat scroll 0 0 #764bb3;
}
.process-diag .item-wrapper .item.deploy {
    left: 50%;
    margin-left: -8.88889em;
    top: 76%;
}
.process-diag .item-wrapper .item.deploy .heading3 {
    color: #e94054;
}
.process-diag .item-wrapper .item.deploy .heading3:after {
    background: none repeat scroll 0 0 #e94054;
}
.csstransforms .reviews .title-header {
    padding-bottom: 10em;
}
.reviews .quote {
    font-style: italic;
}
.csstransforms .reviews .item:first-child .media {
    top: 50%;
}
.reviews .item.even {
    margin-top: 0;
}
.csstransforms .reviews .item.even {
    margin-top: 0;
}
.reviews .item.even:nth-child(2) {
    margin-top: -10em;
}
.reviews .item .copy .inner {
    max-width: 35.5556em;
}
.reviews .item .copy figcaption {
    display: block;
    margin-top: 2em;
}
.reviews .item .media .inner {
    overflow: hidden;
    padding-bottom: 75%;
    position: relative;
}
.reviews .item .media .inner img {
    bottom: 0;
    left: 0;
    position: absolute;
}
.reviews .item .browser-screen1 {
    margin-bottom: 0;
    margin-top: 0;
    transform: translate(0px, -50%);
}
.csstransforms .reviews .item .browser-screen1 {
    top: 50%;
}
.reviews .item .browser-screen1 .inner {
    background: none repeat scroll 0 0 transparent;
    padding-bottom: 63.2609%;
}
.reviews .item .browser-screen1 .inner img {
    bottom: auto;
    top: 0;
}
.reviews .alternating-items .heading2 a {
    color: inherit;
}
.reviews .alternating-items article .meta .tags a {
    color: #312845;
}
.reviews .alternating-items article:nth-of-type(4n+2), .reviews .alternating-items article:nth-of-type(4n+3), .reviews .alternating-items article:nth-of-type(4n+4) {
    color: #fff;
}
.reviews .alternating-items article:nth-of-type(4n+2) .heading2:after, .reviews .alternating-items article:nth-of-type(4n+3) .heading2:after, .reviews .alternating-items article:nth-of-type(4n+4) .heading2:after {
    background: none repeat scroll 0 0 #fff;
}
.reviews .alternating-items article:nth-of-type(4n+2) .meta .tags a, .reviews .alternating-items article:nth-of-type(4n+3) .meta .tags a, .reviews .alternating-items article:nth-of-type(4n+4) .meta .tags a {
    color: #fff;
}
.reviews .alternating-items article:nth-of-type(4n+2) .meta .tags a:before, .reviews .alternating-items article:nth-of-type(4n+2) .meta .tags span:before, .reviews .alternating-items article:nth-of-type(4n+3) .meta .tags a:before, .reviews .alternating-items article:nth-of-type(4n+3) .meta .tags span:before, .reviews .alternating-items article:nth-of-type(4n+4) .meta .tags a:before, .reviews .alternating-items article:nth-of-type(4n+4) .meta .tags span:before {
    background: none repeat scroll 0 0 #fff;
}
.reviews .alternating-items article:nth-of-type(4n+2) .meta .tags cite:before, .reviews .alternating-items article:nth-of-type(4n+3) .meta .tags cite:before, .reviews .alternating-items article:nth-of-type(4n+4) .meta .tags cite:before {
    background: none repeat scroll 0 0 #fff;
}
.reviews .alternating-items article:nth-of-type(4n+2) .heading3, .reviews .alternating-items article:nth-of-type(4n+3) .heading3, .reviews .alternating-items article:nth-of-type(4n+4) .heading3 {
    opacity: 0.6;
}
.reviews .alternating-items article:nth-of-type(4n+2) .btn, .reviews .alternating-items article:nth-of-type(4n+3) .btn, .reviews .alternating-items article:nth-of-type(4n+4) .btn {
    border: 1px solid rgba(255, 255, 255, 0.5);
    color: #fff;
}
.reviews .alternating-items article:nth-of-type(4n+2) .btn:hover, .reviews .alternating-items article:nth-of-type(4n+3) .btn:hover, .reviews .alternating-items article:nth-of-type(4n+4) .btn:hover {
    background: none repeat scroll 0 0 #fff;
    border-color: #fff;
}
.reviews .alternating-items article:nth-of-type(4n+2) .browser-screen1 {
    box-shadow: 0 0 15px rgba(120, 23, 48, 0.6);
}
.reviews .alternating-items article:nth-of-type(4n+2) .browser-screen1 i {
    background-image: radial-gradient(12px 12px, #e8374c, #9d1222);
    border: 1px solid #dd1931;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 0 #981221 inset;
}
.reviews .alternating-items article:nth-of-type(4n+2) .browser-screen1 i:after {
    background-image: radial-gradient(2px 10px, rgba(255, 255, 255, 0.5), transparent);
}
.reviews .alternating-items article:nth-of-type(4n+2) .browser-screen1:before {
    background: linear-gradient(#ed6575, #e94054) repeat scroll 0 0 #e94054;
    border: 1px solid #e52037;
}
.reviews .alternating-items article:nth-of-type(4n+2) .browser-screen1 .inner {
    border: 1px solid #dd1931;
}
.reviews .alternating-items article:nth-of-type(4n+2) .btn:hover {
    color: #e94054;
}
.reviews .alternating-items article:nth-of-type(4n+3) .browser-screen1 {
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.6);
}
.reviews .alternating-items article:nth-of-type(4n+3) .browser-screen1 i {
    background-image: radial-gradient(12px 12px, #191931, #000000);
    border: 1px solid #0b0b16;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.18), 0 1px 0 #000 inset;
}
.reviews .alternating-items article:nth-of-type(4n+3) .browser-screen1 i:after {
    background-image: radial-gradient(2px 10px, rgba(255, 255, 255, 0.3), transparent);
}
.reviews .alternating-items article:nth-of-type(4n+3) .browser-screen1:before {
    background: linear-gradient(#343468, #232346) repeat scroll 0 0 #1c1c38;
    border: 1px solid #101020;
}
.reviews .alternating-items article:nth-of-type(4n+3) .browser-screen1 .inner {
    border: 1px solid #0b0b16;
}
.reviews .alternating-items article:nth-of-type(4n+3) .btn:hover {
    color: #1c1c38;
}
.reviews .alternating-items article:nth-of-type(4n+4) .browser-screen1 {
    box-shadow: 0 0 15px rgba(31, 114, 138, 0.6);
}
.reviews .alternating-items article:nth-of-type(4n+4) .browser-screen1 i {
    background-image: radial-gradient(12px 12px, #32d0b4, #1b7766);
    border: 1px solid #28b198;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), 0 1px 0 #1a7263 inset;
}
.reviews .alternating-items article:nth-of-type(4n+4) .browser-screen1 i:after {
    background-image: radial-gradient(2px 10px, rgba(255, 255, 255, 0.5), transparent);
}
.reviews .alternating-items article:nth-of-type(4n+4) .browser-screen1:before {
    background: linear-gradient(#5bdac3, #3ad2b7) repeat scroll 0 0 #44b5d5;
    border: 1px solid #2bbda3;
}
.reviews .alternating-items article:nth-of-type(4n+4) .browser-screen1 .inner {
    border: 1px solid #28b198;
}
.reviews .alternating-items article:nth-of-type(4n+4) .btn:hover {
    color: #44b5d5;
}
.about .moving-gallery, .home .moving-gallery {
    display: none;
    margin-top: -10em;
    padding-bottom: 10em;
}
.csstransforms .about .moving-gallery, .csstransforms .home .moving-gallery {
    display: block;
}
.about .moving-gallery div, .home .moving-gallery div {
}
.js .blog.blog-landing #header .logo, .js .blog.article #header .logo, .js .project-article #header .logo {
    background: url("../images/sozo-logo-light-bg.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.js.svg .blog.blog-landing #header .logo, .js.svg .blog.article #header .logo, .js.svg .project-article #header .logo {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
    color: red;
}
.js .blog.blog-landing #header .logo img, .lt-ie10.js.svg .blog.blog-landing #header .logo img, .js .blog.article #header .logo img, .lt-ie10.js.svg .blog.article #header .logo img, .js .project-article #header .logo img, .lt-ie10.js.svg .project-article #header .logo img {
    display: none;
}
.blog.blog-landing #header .logo .ozo path, .blog.article #header .logo .ozo path, .project-article #header .logo .ozo path {
    fill: #312845;
}
.blog-list-simple {
    text-align: center;
}
.lt-ie9 .blog-list-simple {
    background: none repeat scroll 0 0 #ededf1;
}
.blog-list-simple .wrapper {
    max-width: 50em;
}
.blog-list-simple .title-border1 {
    padding: 0 1.3253% 0.25em;
}
.blog-list-simple .title-border1 .heading2:after {
    background-color: #312845;
}
.blog-list-simple .item {
    border-top: 1px solid #d9d9e1;
    margin: 0.5em 0;
    padding-left: 1.3253%;
    padding-right: 1.3253%;
}
.blog-list-simple .item a {
    color: #312845;
}
.blog-list-simple .item > a {
    display: block;
    padding: 1em 2.6506% 0;
}
.home #particles1 {
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
}
.home #particles1.show-me {
    opacity: 1;
}
.home .title-header .heading1.one span:nth-child(1) {
    color: #fff;
    font-weight: 300;
}
.home .title-header {
    padding-bottom: 5.55556em;
    padding-top: 4.556em;
}
.csstransitions .home #particles1 {
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
}
.csstransitions .home #particles1.show-me {
    opacity: 1;
}
.csstransitions .home .title-header {
    position: relative;
}
.csstransitions .home .title-header .wrapper {
    left: 50%;
    max-width: 100%;
    padding-bottom: 0;
    padding-top: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}
.csstransitions .home .title-header .heading1 {
    margin: 0;
    width: 100%;
}
.csstransitions .home .title-header .heading1.one {
    position: relative;
    z-index: 3;
}
.csstransitions .home .title-header .heading1.one:after {
    display: none;
}
.csstransitions .home .title-header .heading1.one span {
    position: relative;
    transition: all 4.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.csstransitions .home .title-header .heading1.one span:before, .csstransitions .home .title-header .heading1.one span:after {
    background: none repeat scroll 0 0 #1c1c38;
    content: "";
    display: block;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 6%;
    transition: all 2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
}
.csstransitions .home .title-header .heading1.one span:before {
    left: -100%;
}
.csstransitions .home .title-header .heading1.one span:after {
    right: -100%;
}
.csstransitions .home .title-header .heading1.one span:nth-child(1) {
    color: #fff;
    font-weight: 300;
}
.csstransitions .home .title-header .heading1.one span:nth-child(2) {
    transition-delay: 0.3s;
    z-index: -1;
}
.csstransitions .home .title-header .heading1.one span:nth-child(2):before, .csstransitions .home .title-header .heading1.one span:nth-child(2):after {
    transition-delay: 0.3s;
}
.csstransitions .home .title-header .heading1.one.animate-me1 span {
    transform: scale(1.2, 1.2);
}
.csstransitions .home .title-header .heading1.one.animate-me1 span:before {
    left: -45%;
}
.csstransitions .home .title-header .heading1.one.animate-me1 span:after {
    right: -45%;
}
.csstransitions .home .title-header .heading1.one.animate-me2 {
    transform: translate(0px, 14em) scale(0);
    transition: all 0.5s cubic-bezier(0.6, -0.28, 0.735, 0.045) 0s;
}
.csstransitions .home .title-header .heading1.two {
    transition: all 2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.csstransitions .home .title-header .heading1.two:after {
    display: none;
}
.csstransitions .home .title-header .heading1.two > span {
    transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.csstransitions .home .title-header .heading1.two > span:nth-child(1) {
    transition-delay: 0.2s;
}
.csstransitions .home .title-header .heading1.two.animate-me1 {
    opacity: 0;
}
.csstransitions .home .title-header .heading1.two.animate-me2 > span {
}
.csstransitions .home .title-header .heading1.three .scroll-down {
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.csstransitions .home .title-header .heading1.three .scroll-down.animate-me1 {
    opacity: 1;
}
.csstransitions .home .title-header .heading1.hide-seek > span {
    color: #fff;
    font-weight: 300;
}
.csstransitions .home .title-header .heading1.hide-seek .pop {
    color: #e94054;
    display: inline-block;
    font-weight: 700;
    transition: all 0.2s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0s;
    width: auto;
}
.csstransitions .home .title-header .heading1.hide-seek .pop:nth-child(2) {
    transition-delay: 0.1s;
}
.csstransitions .home .title-header .heading1.hide-seek .pop:nth-child(3) {
    transition-delay: 0.15s;
}
.csstransitions .home .title-header .heading1.hide-seek .pop:nth-child(4) {
    transition-delay: 0.2s;
}
.csstransitions .home .title-header .heading1.hide-seek .pop:nth-child(5) {
    transition-delay: 0.25s;
}
.csstransitions .home .title-header .heading1.hide-seek .pop:nth-child(6) {
    transition-delay: 0.3s;
}
.csstransitions .home .title-header .heading1.hide-seek .pop.animate-me1 {
    opacity: 0;
    transform: translate(0px, 1.3em);
}
.csstransitions .home .title-header .wrapper.final {
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.csstransitions .home .title-header .wrapper.final.animate-me2:before {
    padding-bottom: 160%;
    width: 160%;
}
.csstransitions .home .title-header .wrapper.final .heading1, .csstransitions .home .title-header .wrapper.final .sozo-content, .csstransitions .home .title-header .wrapper.final .scroll-down {
    opacity: 0;
}
.csstransitions .home .title-header .wrapper.final.animate-me3 {
    opacity: 1;
}
.csstransitions .home .title-header .wrapper.final.animate-me3 .heading1, .csstransitions .home .title-header .wrapper.final.animate-me3 .sozo-content, .csstransitions .home .title-header .wrapper.final.animate-me3 .scroll-down {
    opacity: 1;
}
.csstransitions .home .title-header .wrapper.final.animate-me3:before {
    opacity: 0;
    transition: all 3s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.csstransitions .home .title-header .wrapper.final.animate-me3 {
    opacity: 1;
}
.csstransitions .home .title-header .wrapper.final.unhide {
    opacity: 1;
}
.csstransitions .home .title-header .wrapper.final.unhide .heading1:after {
    opacity: 0.3;
}
.csstransitions .home .title-header .wrapper.final .sozo-content {
    margin-top: 1em;
    text-align: center;
    transition: all 1.2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
}
.csstransitions .home .title-header .wrapper.final .sozo-content.animate-me1 {
    opacity: 0;
}
.csstransitions .home .title-header .wrapper.final .scroll-down {
    bottom: -3.5em;
}
.csstransitions .home .title-header .wrapper.final .scroll-down.animate-me1 {
    opacity: 0;
}
.csstransitions .home .title-header .single-statements {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
}
.csstransitions .home .title-header .single-statements.animate-me1 {
    opacity: 0;
}
.csstransitions .home .title-header .single-statements p {
    text-align: center;
}
.csstransitions .home .title-header .single-statements .bold span {
    color: #1c1c38;
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    font-size: 6.66667em;
    font-style: normal;
    font-weight: 700;
    left: 50%;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    z-index: 2;
}
.csstransitions .home .title-header .single-statements .bold.animate-me1:before {
    padding-bottom: 160%;
    width: 160%;
}
.csstransitions .home .title-header .single-statements .different {
    position: absolute;
    right: 0;
    transform: translate(-140%, 0px);
    transition: all 0.2s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
    z-index: 3;
}
.csstransitions .home .title-header .single-statements .different:before {
    background: none repeat scroll 0 0 #fff;
    content: "";
    display: block;
    left: 40%;
    padding-bottom: 140%;
    position: absolute;
    top: 50%;
    transform: translateZ(0px) translate(-50%, -50%) skew(-18deg);
    transition: all 0.4s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 140%;
}
.csstransitions .home .title-header .single-statements .different span, .csstransitions .home .title-header .single-statements .different:after {
    color: #1c1c38;
    font-size: 120px;
    left: 50%;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translateZ(0px) translate(-50%, -50%);
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
    z-index: 4;
}
.csstransitions .home .title-header .single-statements .different:after {
    color: #fff;
    content: "NEW";
    font-family: "Oswald",Helvetica,Arial,sans-serif;
    font-weight: 300;
    opacity: 0;
    transition: opacity 2s cubic-bezier(0.19, 1, 0.22, 1) 0s, letter-spacing 4.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    z-index: 5;
}
.csstransitions .home .title-header .single-statements .different.animate-me1 {
    transform: translate(0px, 0px);
}
.csstransitions .home .title-header .single-statements .different.animate-me1:before {
    left: 50%;
}
.csstransitions .home .title-header .single-statements .different.animate-me2:before {
    opacity: 0;
}
.csstransitions .home .title-header .single-statements .different.animate-me2 span {
    opacity: 0;
}
.csstransitions .home .title-header .single-statements .different.animate-me2:after {
    letter-spacing: 0.25em;
    opacity: 1;
}
.csstransitions .home .title-header .single-statements #different-canvas1 {
    background: none repeat scroll 0 0 transparent;
    left: 0;
    margin-top: 0;
    position: absolute;
    top: 0;
}
.csstransitions .home .title-header .scroll-down {
    bottom: 5px;
    left: 50%;
    margin-left: -30px;
    position: absolute;
}
.csstransitions .home .mega-circle:before {
    border-radius: 50%;
    content: "";
    display: block;
    left: 50%;
    padding-bottom: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.35s cubic-bezier(0.95, 0.05, 0.795, 0.035) 0s;
    width: 0;
    z-index: 0;
}
.lt-ie9 .csstransitions .home .mega-circle:before {
    background: none repeat scroll 0 0 #e94054;
}
.home .project-intro, .home .moving-gallery, .home .blog-list-simple {
    position: relative;
}
.home .project-intro {
    z-index: 6;
}
.home .moving-gallery {
    margin-bottom: -4em;
    padding-bottom: 0;
    z-index: 7;
}
.home .blog-list-simple {
    position: relative;
    z-index: 8;
}
.home .line {
    background: none repeat scroll 0 0 #1c1c38;
    position: absolute;
    transform: translateZ(0px) scale(0.2) translate(0px, -2000%) skew(-18deg);
    transition: all 0s ease 0s, all 0.5s ease 0s, all 0s cubic-bezier(0.95, 0.05, 0.795, 0.035) 0s, all 0.3s ease 0s;
    width: 1px;
    z-index: 4;
}
.home .line.animate-me1 {
    transform: scale(1) translate(0px, -120%) skew(-18deg);
}
.home .line.animate-me2 {
    opacity: 0;
    z-index: -1;
}
.fade-slideshow {
    position: relative;
}
.fade-slideshow .item {
    position: absolute;
    transform: scale(0.8) translateY(-32%);
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.csstransforms .fade-slideshow .item {
    top: 50%;
}
.js .fade-slideshow .item {
    opacity: 0;
}
.fade-slideshow .item.active {
    opacity: 1;
    transform: scale(1) translateY(-50%);
}
.slide-nav {
    text-align: center;
}
.slide-nav a {
    background: none repeat scroll 0 0 #fff;
    border-radius: 7px;
    display: inline-block;
    height: 14px;
    margin: 0 0.27em;
    opacity: 0.4;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 14px;
}
.slide-nav a.active {
    opacity: 1;
}
.content-block {
    background: none repeat scroll 0 0 #fff;
}
.content-block .wrapper {
    padding-left: 1.3253%;
    padding-right: 1.3253%;
}
.content-block .title-border1 {
    text-align: center;
}
.content-block .title-border1 .heading2 {
    margin-left: auto;
    margin-right: auto;
    max-width: 25em;
}
.content-block .title-border1 .heading2:after {
    background: none repeat scroll 0 0 #312845;
}
.content-block .sozo-content {
    margin-left: auto;
    margin-right: auto;
    max-width: 35.5556em;
}
.timeline {
    background: none repeat scroll 0 0 #ededf1;
}
.timeline .wrapper {
    padding-bottom: 1.38889em;
    padding-top: 1.85185em;
}
.timeline .timeline-diag {
    left: 0;
    position: absolute;
    top: 8.8em;
}
.timeline #timeline-diag2 {
    display: none;
}
.timeline .item {
    float: left;
    padding: 1.3253%;
    text-align: center;
    width: 25%;
}
.timeline .item .date {
    border-bottom: 1px solid #312845;
    display: inline-block;
    font-style: italic;
    opacity: 0.68;
    padding-bottom: 0.4em;
}
.lt-ie9 .timeline .item .date {
}
.timeline .item .heading3 {
    font-weight: 700;
    margin-top: 0.4em;
    opacity: 1;
}
.svg .timeline .item .heading3 {
    padding-bottom: 31.3253%;
}
.lt-ie9 .timeline .item .heading3 {
}
.timeline .item .copy {
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    font-size: 0.88889em;
}
.timeline .item.one .date, .timeline .item.one .heading3 {
    border-color: #30958c;
    color: #30958c;
}
.timeline .item.two .date, .timeline .item.two .heading3 {
    border-color: #43b8d2;
    color: #43b8d2;
}
.timeline .item.three .date, .timeline .item.three .heading3 {
    border-color: #6451c5;
    color: #6451c5;
}
.timeline .item.four .date, .timeline .item.four .heading3 {
    border-color: #dd3256;
    color: #dd3256;
}
.about-landing .person-list {
    padding-bottom: 10em;
}
.about-landing .quote-wrapper {
    padding-bottom: 12.5em;
}
.lt-ie9 .about-landing .quote-wrapper {
    background: none repeat scroll 0 0 #e94054;
}
.about-landing .quote-wrapper .slide-nav {
    margin-top: 1.5em;
}
.about-landing .quote-wrapper .title.heading3 {
    font-size: 0.88889em;
    opacity: 0.6;
}
.about-landing .quote-wrapper .meta .heading3 {
    opacity: 0.6;
}
.about-landing .quote-wrapper .meta cite:before {
    background: none repeat scroll 0 0 #fff;
}
.about-landing .quote-wrapper.fake-btm:after {
    background: none repeat scroll 0 0 #fff;
}
.about-landing .moving-gallery {
    margin-bottom: -13.5em;
    margin-top: -13.5em;
}
.about-landing .content-block {
    margin-top: -7.5em;
    position: relative;
    z-index: 2;
}
.about-landing .process-diag {
    padding-top: 2.77778em;
}
.dropdown-filter {
    padding-bottom: 2.77778em;
    padding-top: 2.77778em;
}
.dropdown-filter .title, .dropdown-filter nav {
    display: inline-block;
    margin: 0 10px;
    vertical-align: top;
}
.dropdown-filter .btn:hover {
    background: none repeat scroll 0 0 transparent;
}
.dropdown-filter .title {
    color: #7c7295;
    font-family: "ff-tisa-web-pro",Georgia,Times,"Times New Roman",serif;
    font-size: 1.22222em;
    font-style: italic;
    position: relative;
    top: 0.38em;
}
.dropdown-filter nav {
    cursor: pointer;
    max-height: 3.4375em;
    padding-right: 2.40625em;
    position: relative;
    text-align: left;
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
.dropdown-filter nav .inner {
    max-height: 2em;
    overflow: hidden;
    transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    width: 100%;
}
.dropdown-filter nav.active {
    max-height: 40em;
}
.dropdown-filter nav.active .inner {
    max-height: 40em;
}
.dropdown-filter nav.active a:hover {
    color: #1c1c38;
}
.dropdown-filter nav:after, .dropdown-filter nav:before {
    content: "";
    position: absolute;
    right: 1.03125em;
}
.dropdown-filter nav:after {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: transparent transparent #e94054;
    border-image: none;
    border-style: solid;
    border-width: 0.33333em;
    top: 0.92125em;
}
.dropdown-filter nav:before {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    border-color: #e94054 transparent transparent;
    border-image: none;
    border-style: solid;
    border-width: 0.33333em;
    top: 1.7875em;
}
.dropdown-filter nav a {
    clear: both;
    display: block;
    float: left;
    line-height: 1.2em;
    padding: 0.43em 0;
    width: 100%;
}
.blog-list {
    text-align: center;
}
.blog-list.wrapper {
    padding-bottom: 2.77778em;
    padding-top: 2.77778em;
}
.blog-list .item {
    display: inline-block;
    margin: 1.3253% 0;
    max-width: 24.4444em;
    padding: 0 1.3253%;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
    vertical-align: middle;
    width: 100%;
}
.blog-list .item a {
    color: #312845;
}
.js.csstransitions .blog-list .item.animate-me {
    opacity: 0;
    transform: translateY(1em);
}
.blog-list .item .desc {
    background: none repeat scroll 0 0 #fff;
    height: 21.7778em;
    padding: 0.8em 1.6em;
    position: relative;
    text-align: left;
}
.blog-list .item .desc .heading4 {
    margin-top: 0.3em;
}
.blog-list .item .desc .sozo-content {
    font-size: 0.88889em;
}
.blog-list .item .desc .meta {
    border-top: 1px solid #d9d9e1;
    bottom: 5.3012%;
    left: 6.62651%;
    padding-top: 1em;
    position: absolute;
    width: 86.747%;
}
.blog-list .item .desc .meta .media {
    margin-left: 0;
}
.blog-list .item.image {
    max-width: 440px;
}
.blog-list .item.image .media {
    display: block;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.blog-list .item.image figcaption {
    background: none repeat scroll 0 0 rgba(28, 28, 56, 0.9);
    bottom: 0;
    color: #fff;
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    font-weight: 700;
    left: 0;
    line-height: 1.3em;
    padding: 1em 1.2em;
    position: absolute;
    text-align: left;
    width: 100%;
}
.blog-list .item.image figcaption a {
    color: #e94054;
}
.blog-list .item.has-img {
    max-width: 56.8889em;
    overflow: hidden;
    position: relative;
}
.blog-list .item.has-img > .media, .blog-list .item.has-img .desc {
    display: inline-block;
}
.blog-list .item.has-img > .media {
    position: relative;
    width: 59.0313%;
}
.blog-list .item.has-img > .media:after, .blog-list .item.has-img > .media:before {
    background: none repeat scroll 0 0 #d9d9e1;
    height: 6em;
    position: absolute;
    transform: skew(0deg, 3deg);
    width: 140%;
}
.blog-list .item.has-img .desc {
    margin-top: -10.8889em;
    position: absolute;
    top: 50%;
    width: 42.9688%;
}
.blog-list .item.has-img > .media {
    float: left;
}
.blog-list .item.has-img > .media:after {
    bottom: -4.7em;
    content: "";
    right: 0;
}
.blog-list .item.has-img .desc {
    right: 2%;
}
.blog-list .item.has-img:nth-child(2n) > .media {
    float: right;
}
.blog-list .item.has-img:nth-child(2n) > .media:before {
    content: "";
    left: 0;
    top: -4.7em;
}
.blog-list .item.has-img:nth-child(2n) .desc {
    left: 2%;
}
.info-article .primary {
    background: none repeat scroll 0 0 #fff;
    float: right;
    margin-right: 26.506%;
    padding: 1.3253% 2.6506%;
    width: 46.9879%;
}
.info-article .primary .sozo-content {
    font-size: 1.11111em;
}
.info-article .primary .sozo-content img {
    margin-left: -6.35838%;
    width: 112.717%;
}
.info-article .secondary {
    float: left;
    padding-left: 2.6506%;
    padding-right: 2.6506%;
    width: 26.506%;
}
.info-article .secondary .meta, .info-article .secondary .related {
    padding-bottom: 2.77778em;
    padding-top: 2.77778em;
}
.info-article .secondary .meta {
    border-bottom: 1px solid #d9d9e1;
}
.info-article .secondary .related .heading3 {
    font-size: 0.88889em;
    margin-bottom: 1.5em;
    margin-top: 0;
}
.info-article .secondary .related .heading3:after {
    background: none repeat scroll 0 0 #030305;
    margin-left: 0;
}
.info-article .secondary .related ul li {
    margin: 1em 0;
}
.blog #disqus_thread {
    margin-top: 4em;
}
.blog.blog-landing {
    text-align: center;
}
.blog.blog-landing .main-content {
    background: none repeat scroll 0 0 #d9d9e1;
}
.blog.blog-landing .title-header {
    color: #312845;
}
.blog.blog-landing .title-header .wrapper {
    padding-bottom: 0;
    padding-top: 0;
}
.blog.blog-landing .btn.more {
    margin-top: 2em;
}
.blog.blog-landing .main-content .wrapper {
    max-width: none;
}
.blog.article {
    background: url("../images/bg/primary-secondary-fullwidth1.png?v=1") repeat-y scroll center center #fff;
}
.blog.article .info-article .img-hero {
    background: none repeat scroll 0 0 #1c1c38;
    overflow: hidden;
    padding-bottom: 28.3449%;
    position: relative;
    width: 100%;
}
.blog.article .info-article .img-hero img {
    left: 0;
    position: absolute;
    top: 0;
}
.blog.article .info-article .vid-hero {
    background: none repeat scroll 0 0 #1c1c38;
    float: left;
    width: 100%;
}
.blog.article .info-article .vid-hero .wrapper.media {
    margin-bottom: 0;
    max-width: 1280px;
    padding-bottom: 0;
    padding-top: 141px;
}
.js .blog.article.has-hero-img #header .logo {
    background: url("../images/sozo-web-design-cheltenham.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.js.svg .blog.article.has-hero-img #header .logo {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.js .blog.article.has-hero-img #header .logo img, .lt-ie10.js.svg .blog.article.has-hero-img #header .logo img {
    display: none;
}
.js.svg .blog.article.has-hero-img #header .logo .ozo path {
    fill: #fff;
}
.blog.article.has-hero-img .info-article {
    padding-bottom: 4em;
}
.blog.article.has-hero-img .info-article .wrapper {
    padding-top: 0;
}
.blog.article.has-hero-img .info-article .primary {
    margin-bottom: -5.16667em;
    margin-top: -5.16667em;
}
.js .blog.article.has-hero-vid #header .logo {
    background: url("../images/sozo-web-design-cheltenham.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.js.svg .blog.article.has-hero-vid #header .logo {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
}
.js .blog.article.has-hero-vid #header .logo img, .lt-ie10.js.svg .blog.article.has-hero-vid #header .logo img {
    display: none;
}
.js.svg .blog.article.has-hero-vid #header .logo .ozo path {
    fill: #fff;
}
.blog.article.has-hero-vid .info-article > .wrapper {
    padding-top: 0;
}
.tv.blog-landing .main-content {
    text-align: center;
}
.person .main-content .blog-list header {
    padding-top: 5.55556em;
}
.person .main-content .blog-list header .tags {
    opacity: 1;
}
.person .main-content .blog-list header .tags span, .person .main-content .blog-list header .tags a:before {
    opacity: 0.42;
}
.person .main-content .blog-list header .tags a {
    color: #e94054;
}
.person .main-content .blog-list .title-border1 .heading2:after {
    background: none repeat scroll 0 0 #1c1c38;
}
.contact .title-header {
    background: none repeat scroll 0 0 #1c1c38;
}
.contact .title-header .sozo-content {
    padding-bottom: 1em;
}
.contact .title-border1 {
    text-align: center;
}
.contact .title-border1 .heading2:after {
    background-color: #312845;
}
.contact .sozo-message p {
    margin: 0;
}
.contact .feedback.wrapper {
    padding-bottom: 1em;
    padding-top: 4em;
}
.contact .form {
    background: none repeat scroll 0 0 #fff;
    counter-reset: list-counter;
    padding-bottom: 12em;
}
.contact .form .wrapper {
    max-width: 50em;
}
.contact .form .title-border1.wrapper {
    padding-bottom: 0;
    padding-top: 2.77778em;
}
.contact .form .required {
    color: rgba(49, 40, 69, 0.3);
    content: "*";
    font-size: 1.44444em;
    font-style: italic;
    left: -0.9em;
    position: absolute;
    top: -0.6em;
}
.contact .form textarea, .contact .form input {
    background: none repeat scroll 0 0 transparent;
}
.contact .form textarea {
    margin-left: 4.88889%;
    width: 90.2222%;
}
.contact .form .btn {
    background: none repeat scroll 0 0 #e94054;
    color: #fff;
    margin-left: 4.88889%;
    margin-top: 1em;
}
.contact .form .item {
    background: none repeat scroll 0 0 #fff;
    counter-increment: list-counter;
}
.contact .form .item.odd {
    background: none repeat scroll 0 0 #ededf1;
}
.contact .form .item .wrapper {
    padding: 1.5em 0;
}
.contact .form .item .heading3 {
    color: #e94054;
    font-weight: 700;
    margin-left: 4.88889%;
    opacity: 1;
    position: relative;
}
.contact .form .item .heading3:before {
    color: rgba(233, 64, 84, 0.3);
    content: counter(list-counter, decimal);
    display: block;
    font-size: 1.44444em;
    font-style: italic;
    font-weight: 400;
    left: -1.8em;
    position: absolute;
    top: -0.5em;
    width: 1em;
}
.contact .form .item .heading3:after {
    background: none repeat scroll 0 0 #e94054;
    content: "";
    height: 2.22222em;
    left: -0.9em;
    opacity: 0.3;
    position: absolute;
    top: -0.6em;
    transform: skew(518deg, 0deg);
    width: 1px;
}
.lt-ie9 .contact .form .item .heading3 {
}
.contact .form .about-you input {
    float: left;
}
.contact .form .about-you input:nth-child(2n+1) {
    clear: none;
}
.contact .form .service .col {
    float: left;
    position: relative;
}
.contact .form .service .col:nth-child(4n+1) {
    clear: none;
}
.contact .form .budget .col-wrapper {
    position: relative;
}
.contact .form .budget .col-wrapper:before {
    background: none repeat scroll 0 0 #d3d3db;
    content: "";
    height: 3px;
    left: 4.88889%;
    position: absolute;
    top: 32px;
    width: 90.2222%;
    z-index: 1;
}
.contact .form .budget .col {
    float: left;
    position: relative;
    text-align: center;
    width: 20%;
    z-index: 2;
}
.contact .form .budget .col label {
    float: none;
    width: 100%;
}
.contact .contact-details {
    color: #fff;
    margin-top: -7.5em;
    position: relative;
}
.lt-ie9 .contact .contact-details {
    background: none repeat scroll 0 0 #e94054;
}
.contact .contact-details .wrapper {
    max-width: 50em;
}
.contact .contact-details .placemarker {
    position: absolute;
    right: -400px;
    top: -130px;
}
.contact .contact-details .unit {
    font-family: "ars-maquette-web",Helvetica,Arial,sans-serif;
    text-align: center;
}
.contact .contact-details .unit .heading3 {
    font-size: 0.88889em;
    margin-bottom: 2em;
    opacity: 0.62;
}
.contact .contact-details .unit .heading3:after {
    background: none repeat scroll 0 0 #fff;
}
.contact .contact-details .unit .btn {
    margin-top: 2.5em;
}
.contact .contact-details .cinfo {
    float: left;
    font-size: 0.88889em;
    opacity: 0.62;
    padding-left: 4.88889%;
    padding-right: 4.88889%;
    padding-top: 1.5em;
    text-align: center;
    width: 100%;
}
.errors #particles1 {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.sitemap .main-content .sozo-content ul li {
    background-position: 0 1em;
    padding: 0.2em 0.2em 0.2em 0.8em;
}
.sitemap .main-content .sozo-content ul a {
    color: #312845;
}
.sitemap .main-content .sozo-content ul a:hover {
    color: #e94054;
}
.sitemap .main-content .sozo-content > ul > li > a {
    color: #e94054;
}
.project-article .diag1.cta1, .blog.article.diag2.cta1, .contact .diag1.contact-details, .blog.article .diag2, .services-landing .diag1 {
    padding-bottom: 12em;
}
.service-children .project-list .cta1, .portfolio.index .project-list .cta1 {
    padding-bottom: 12em;
}
.service-children #footer .accreditations, .portfolio.index #footer .accreditations, .project-article #footer .accreditations, .blog.article #footer .accreditations, .contact #footer .accreditations, .services-landing #footer .accreditations {
    margin-top: -12em;
}
#footer {
    background: none repeat scroll 0 0 #013483;
    color: #1fe7fa;
    position: relative;
    z-index: 9;
}
#footer .accreditations {
    background: none repeat scroll 0 0 #fff;
    padding: 1.66667em 1.3253%;
    text-align: center;
}
#footer .accreditations li {
    display: inline-block;
    margin: 0.55556em;
    vertical-align: middle;
}
#footer .accreditations .gad {
    width: 150px;
}
#footer .accreditations .gcert {
    width: 124px;
}
#footer .accreditations .bingad {
    width: 137px;
}
#footer .accreditations .rar {
    width: 86px;
}
#footer .accreditations .ukwda {
    width: 120px;
}
#footer .accreditations .idm {
    width: 102px;
}
#footer .accreditations img {
    height: auto;
    width: 100%;
}
#footer a {
    color: #fff;
    transition: all 0.5s cubic-bezier(0.19, 1, 0.22, 1) 0s;
}
#footer a:hover {
    color: #e94054;
}
#footer ul, #footer nav {
    margin-bottom: 0;
    margin-top: 0;
}
#footer .wrapper {
    padding-bottom: 5.55556em;
    padding-top: 5.55556em;
}
#footer .unit:nth-child(4n+1) {
    clear: none;
}
#footer .unit a {
    display: block;
    padding: 0.2em 0;
}
#footer .social-icons {
    clear: both;
    padding-left: 2.6506%;
    padding-right: 2.6506%;
    padding-top: 2.77778em;
    text-align: center;
    width: 100%;
}
#footer .social-icons:after {
    clear: both;
    content: "";
    display: table;
}
#footer .social-icons li {
    display: inline-block;
}
#footer .social-icons a {
    background-color: #777891;
    display: block;
    margin: 0.4em;
    overflow: hidden;
}
#footer .social-icons a:hover {
    background-color: #e94054;
}
#footer .social-icons a span {
    border: 0 none;
    clip: rect(0px, 0px, 0px, 0px);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
#footer .legal {
    clear: both;
    font-size: 0.77778em;
    padding-left: 2.6506%;
    padding-right: 2.6506%;
    text-align: center;
    width: 100%;
}
#footer .legal:after {
    clear: both;
    content: "";
    display: table;
}
#footer .legal a, #footer .legal span {
    display: inline-block;
    line-height: 1.3em;
    padding: 0 0.6em;
}
.project-list .project-hero.play-audio {
    background: url("../images/web-design/play-audio-web-design-6-1.jpg?v=1") no-repeat scroll center top / cover #1c1c38;
}
.project-article.watch-gecko .alternating-items .item.even {
    background-image: url("../images/projects/watch-gecko/bg/isometric-ipad.jpg?v=1");
}
.project-article.videomybusiness .alternating-items .item.even {
    background-image: url("../images/projects/videomybusiness/bg/isometric-ipad.jpg?v=1");
}
.project-article.mosaic .alternating-items .item.even {
    background-image: url("../images/projects/mosaic/bg/isometric-ipad.jpg?v=1");
}
.project-article.skygarden .alternating-items .item.even {
    background-image: url("../images/projects/skygarden/bg/isometric-ipad.jpg?v=1");
}
.project-article.gocompare .alternating-items .item.even {
    background-image: url("../images/projects/gocompare/bg/isometric-ipad.jpg?v=1");
}
.project-article.adtech .alternating-items .item.even {
    background-image: url("../images/projects/adtech/bg/isometric-ipad.jpg?v=1");
}
.project-article.threecounties .alternating-items .item.even {
    background-image: url("../images/projects/threecounties/bg/isometric-ipad.jpg?v=1");
}
.project-article.plunkett .alternating-items .item.even {
    background-image: url("../images/projects/plunkett/bg/isometric-ipad.jpg?v=1");
}
.project-article.imagin .alternating-items .item.even {
    background-image: url("../images/projects/imagin/bg/isometric-ipad.jpg?v=1");
}
.project-article.sophie-everett .alternating-items .item.even {
    background-image: url("../images/projects/sophie-everett/bg/isometric-ipad.jpg?v=1");
}
.project-article.mccarthy .alternating-items .item.even {
    background-image: url("../images/projects/mccarthy/bg/isometric-ipad.jpg?v=1");
}
.project-article.smarthomesounds .alternating-items .item.even {
    background-image: url("../images/projects/smarthomesounds/bg/isometric-ipad.jpg?v=1");
}
.project-article.tritech .alternating-items .item.even {
    background-image: url("../images/projects/tritech/bg/isometric-ipad.jpg?v=1");
}
.project-article.benjamin-chocolatier .alternating-items .item.even {
    background-image: url("../images/projects/benjamin-chocolatier/bg/isometric-ipad.jpg?v=1");
}
.project-article.annette-rose .alternating-items .item.even {
    background-image: url("../images/projects/annette-rose/bg/isometric-ipad.jpg?v=1");
}
.project-article.jumping-spider .alternating-items .item.even {
    background-image: url("../images/projects/jumping-spider/bg/isometric-ipad.jpg?v=1");
}
.project-article.cotswold-grange .alternating-items .item.even {
    background-image: url("../images/projects/cotswold-grange/bg/isometric-ipad.jpg?v=1");
}
.project-article.jumping-spider .alternating-items .item.even {
    background-image: url("../images/projects/jumping-spider/bg/isometric-ipad.jpg?v=1");
}
.project-article.turtle-homes .alternating-items .item.even {
    background-image: url("../images/projects/turtle-homes/bg/isometric-ipad.jpg?v=1");
}
.project-article.katie-bonas .alternating-items .item.even {
    background-image: url("../images/projects/katie-bonas/bg/isometric-ipad.jpg?v=1");
}
.project-article.rubbertech .alternating-items .item.even {
    background-image: url("../images/projects/rubbertech/bg/isometric-ipad.jpg?v=1");
}
.project-article.just-fabrics .alternating-items .item.even {
    background-image: url("../images/projects/just-fabrics/bg/isometric-ipad.jpg?v=1");
}
.project-article.gocompare .devices-imac-iphone1:after, .project-article.rubbertech .devices-imac-iphone1:after, .project-article.just-fabrics .devices-imac-iphone1:after {
    background-image: url("../images/bg/devices/imac-large1.png?v=1");
}
.project-article.gocompare .devices-imac-iphone1 .phone, .project-article.rubbertech .devices-imac-iphone1 .phone, .project-article.just-fabrics .devices-imac-iphone1 .phone {
    display: none;
}
.project-article.play-audio .quote-wrapper {
    background: none repeat scroll 0 0 #401c5f;
}
.project-article.barnbury .project-hero {
    background: url("../images/projects/barnbury/bg/texture-brand1-large.jpg?v=1") no-repeat scroll center top / cover #fff;
}
.project-article.barnbury .quote-wrapper {
    background: none repeat scroll 0 0 #7c5364;
}
.project-article.watch-gecko .project-hero {
    background: url("../images/projects/watch-gecko/bg/texture-leather1-large.jpg?v=1") repeat scroll center top #f2edda;
}
.project-article.watch-gecko .quote-wrapper {
    background: none repeat scroll 0 0 #331900;
}
.project-article.maitland-walker .project-hero {
    background: url("../images/projects/maitland-walker/bg/texture-folds1-large.jpg?v=1") no-repeat scroll center top / cover #dcdfe2;
}
.project-article.maitland-walker .quote-wrapper {
    background: none repeat scroll 0 0 #1e384b;
}
.project-article.axonex .project-hero {
    background: url("../images/projects/axonex/bg/texture-shard1-large.jpg?v=1") no-repeat scroll center top / cover #d6d6d6;
}
.project-article.axonex .alternating-items .item.even {
    background: none repeat scroll 0 0 #d6d6d6;
}
.project-article.axonex .quote-wrapper {
    background: none repeat scroll 0 0 #282727;
}
.backgroundsize .project-article.janeplan .project-hero {
    background-image: url("../images/projects/janeplan/bg/texture-wood1.jpg?v=1");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}
.backgroundsize .project-article.skygarden .project-hero {
    background: none repeat scroll 0 0 #1e884c;
}
.project-article.skygarden .project-hero .btn1 {
    border-color: #fff;
    color: #fff;
}
.project-article.skygarden .project-hero .btn1:hover {
    background: none repeat scroll 0 0 #fff;
    border-color: #fff;
    color: #1e884c;
}
.project-article.adtech .project-hero {
    background: radial-gradient(80% 80%, #006b9d 60%, #003258 80%) repeat scroll 0 0 #003258;
}
.project-article.threecounties .project-hero {
    background-color: #ccd4c5;
    background-image: url("../images/projects/threecounties/bg/shapes-bg1.png?v=1");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 100% auto;
}
.project-article.chelsea-pt .alternating-items .item.even {
    background: none repeat scroll 0 0 #f8f1e6;
}
.project-article.plunkett .project-hero {
    background-color: #e96a10;
    background-image: linear-gradient(84deg, #e96a10, #f8b368);
}
.project-article.plunkett .project-hero .btn1 {
    border-color: #fff;
    color: #fff;
}
.project-article.plunkett .project-hero .btn1:hover {
    background: none repeat scroll 0 0 #fff;
    border-color: #fff;
    color: #e96a10;
}
@media not all, not all {
#header .showm span:before {
    top: 20.5px;
}
#header.scrolled .showm span:before {
    top: 19.5px;
}
}
@media screen and (orientation: portrait) {
.touch .home .title-header {
    height: auto;
    padding-bottom: 59%;
    padding-top: 59%;
}
}
@media screen and (max-height: 56.25em) {
.project-hero .devices-imac-iphone1 {
    left: 52%;
    margin-top: -15%;
    padding-bottom: 39.6889%;
    width: 47%;
}
.project-hero .devices-ipad-iphone1 {
    left: 58%;
    margin-top: -18%;
    padding-bottom: 39.1897%;
    width: 35%;
}
}
@media not all, not all {
#header .showm span:before {
    top: 19.5px;
}
}
@media screen and (max-height: 40em) {
.csstransforms #header .primary-nav .nav-links {
    left: 0 !important;
    padding-top: 52.46px;
    position: relative;
    top: 0 !important;
    transform: none;
}
.csstransforms #header .primary-nav .nav-links li a {
    font-size: 2.111em;
    line-height: 50px;
    padding: 0.38em 0;
}
.csstransforms #header .primary-nav .nav-links li.contact {
    font-size: 0.77778em;
}
.csstransforms #header .primary-nav .nav-links li.contact.tel {
    margin-top: 0.5em;
}
#header > .wrapper {
    padding-bottom: 10px;
    padding-top: 10px;
}
.lt-ie10 #header .showm span:before {
    top: 19.5px;
}
.heading1 {
    font-size: 2.66667em;
}
.touch .home .title-header, .no-touch .home .title-header {
    height: auto;
    padding-bottom: 14em !important;
    padding-top: 5em !important;
}
.project-hero .wrapper {
    height: 26.6667em;
}
.portfolio.index .project-hero .wrapper .copy {
    top: auto;
}
.project-list .primary-list .wrapper {
    margin-top: 0;
    padding-top: 2.6506%;
}
}
@media only screen and (orientation: portrait) {
.project-hero .devices-imac-iphone1 {
    height: 432px;
    margin-top: -196.364px;
    padding-bottom: 0;
    width: 512px;
}
.project-hero .devices-ipad-iphone1 {
    height: 470px;
    margin-top: -213.636px;
    padding-bottom: 0;
    width: 420px;
}
}
@media screen and (max-width: 103.75em) {
.blog.article {
    background-image: url("../images/bg/primary-secondary-maxwidth1.png?v=1");
    background-position: 26.506% center;
}
.home .stats .unit.time .days, .home .stats .unit.time .years {
    font-size: 56px;
}
}
@media screen and (max-width: 90em) {
.main-content {
    font-size: 0.88889em;
}
.person-list .item {
    padding-bottom: 33.3333%;
    width: 33.3333%;
}
.info-article .primary {
    margin-right: 0;
    width: 73.494%;
}
.info-article .primary .inner {
    max-width: 35.1111em;
    width: 100%;
}
.info-article .primary .sozo-content img {
    margin-left: 0;
    width: 100%;
}
.backgroundsize .project-article.watch-gecko .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.videomybusiness .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.mosaic .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.skygarden .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.gocompare .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.adtech .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.threecounties .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.plunkett .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.imagin .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.sophie-everett .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.mccarthy .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.smarthomesounds .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.tritech .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.benjamin-chocolatier .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.annette-rose .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.jumping-spider .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.cotswold-grange .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.jumping-spider .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.turtle-homes .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.katie-bonas .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.rubbertech .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.backgroundsize .project-article.just-fabrics .alternating-items .item.even {
    background-position: 140% 39%;
    background-size: 74% auto;
}
.moving-gallery {
    height: 272px;
}
.moving-gallery div {
    background-size: 1660px 272px;
}
}
@media screen and (max-width: 80em) {
.home .title-header .single-statements .bold span, .home .title-header .single-statements .different span, .home .title-header .single-statements .different:after {
    font-size: 76px;
}
.process-diag .item-wrapper .item {
    font-size: 1.11111em;
    max-width: none;
    padding-left: 5.3012%;
    padding-right: 5.3012%;
    width: 50%;
}
.process-diag .item-wrapper .item.discover {
    left: 0;
}
.process-diag .item-wrapper .item.design {
    right: 0;
    top: 6%;
}
.process-diag .item-wrapper .item.develop {
    left: auto;
    right: 0;
    top: 44%;
}
.process-diag .item-wrapper .item.refine {
    left: 0;
    top: 55%;
}
}
@media screen and (max-width: 64em) {
#header .wrapper {
    padding-bottom: 10px;
    padding-top: 10px;
}
.home .stats .unit.time .days, .home .stats .unit.time .years {
    font-size: 42px;
}
.home .stats .unit.graphs .count-val {
    font-size: 52px;
}
.home .title-header .heading1.one.animate-me1 span {
    letter-spacing: 0;
}
.moving-gallery div {
    background-image: url("team-photos1-medium.jpg?v=1");
}
.project-list .primary-list .unit .title {
    color: #1c1c38 !important;
    padding: 1em 1.25em 0;
    position: static;
    text-align: center;
    text-shadow: none !important;
}
.project-list .primary-list .unit .title:before {
    display: none;
}
.project-list .secondary-list .unit {
    margin-left: 2.6506%;
    width: 46.0241%;
}
.project-list .secondary-list .unit:nth-child(2n+1) {
    clear: left;
}
.project-list .project-hero.play-audio {
    background-image: url("../images/web-design/play-audio-web-design-6-2.jpg?v=1");
}
.services.service-children .title-header.left-align .copy {
    margin-left: 2.6506%;
    width: 46.0241%;
}
.services.service-children .title-header.left-align .copy:nth-child(2n+1) {
    clear: left;
}
.services.service-children .diag-wrapper, .services.service-children .item-wrapper {
    height: auto;
    left: auto;
    margin-top: -165px;
    padding-bottom: 407px;
    padding-top: 0;
    right: 0;
    width: 440px;
}
.services.service-children .diag-wrapper svg {
    height: 407px;
}
.services.service-children .item-wrapper .brochures, .services.service-children .item-wrapper .corporate-id, .services.service-children .item-wrapper .web-dev, .services.service-children .item-wrapper .e-commerce, .services.service-children .item-wrapper .strategy, .services.service-children .item-wrapper .email {
    margin-top: 55.9459%;
}
.backgroundsize .project-article.janeplan .project-hero {
    background-image: url("../images/projects/janeplan/bg/texture-wood1-medium.jpg?v=1");
}
.process-diag .item-wrapper .item {
    font-size: 1em;
}
.process-diag .item-wrapper .item.discover {
    left: 0;
}
.process-diag .item-wrapper .item.design {
    right: 0;
}
.process-diag .item-wrapper .item.refine {
    left: 0;
    top: 56%;
}
.reviews .alternating-items .item .copy, .reviews .alternating-items .item .media {
    margin-left: 2.6506%;
    width: 46.0241%;
}
.reviews .alternating-items .item .copy:nth-child(2n+1), .reviews .alternating-items .item .media:nth-child(2n+1) {
    clear: left;
}
.reviews .alternating-items .item .copy .heading6 {
    font-size: 1em;
}
.reviews .alternating-items .item.odd .copy {
    padding-left: 0;
}
.reviews .alternating-items .item.even .copy {
    padding-right: 0;
}
.project-article .browser-screen1 img {
    transform: none !important;
}
.blog.article {
    background-image: url("../images/bg/primary-secondary-maxwidth2.png?v=1");
    background-position: 33.3008% center;
}
.blog.article .info-article .vid-hero .wrapper.media {
    margin-top: 0;
    padding-top: 61px;
}
.info-article .primary {
    width: 66.6667%;
}
.info-article .primary .sozo-content {
    font-size: 1em;
}
.info-article .secondary {
    width: 33.3333%;
}
#footer {
    font-size: 0.88889em;
}
}
@media screen and (max-width: 50em) {
.csstransforms #header .primary-nav:before {
    width: 84%;
}
.csstransforms .reviews .title-header {
    padding-bottom: 5.55556em;
}
.heading1 {
    font-size: 2.66667em;
}
.heading2 {
    font-size: 2em;
}
.heading5 {
    font-size: 1.44444em;
}
.title-header .sozo-content {
    font-size: 1em;
}
#header .project-nav {
    display: none;
}
.project-intro .work, .project-intro .copy {
    width: 100%;
}
.project-intro .copy {
    margin-top: 0;
    padding-bottom: 2.5em;
}
.project-article .alternating-items .copy .heading4 {
    font-size: 1.33333em;
}
.project-article .alternating-items .item:first-child .media {
    top: auto;
}
.home .blog-list-simple .wrapper {
    padding-top: 2.77778em;
}
.home .stats .unit.time .days, .home .stats .unit.time .years {
    font-size: 30px;
}
.home .stats .unit.graphs .count-val {
    font-size: 44px;
}
.alternating-items .item.odd .media.browser-screen1 {
    left: -5%;
}
.alternating-items .item.odd .copy {
    padding-left: 0;
}
.alternating-items .item.even .media.browser-screen1 {
    right: -5%;
}
.alternating-items .item.even .copy {
    padding-right: 0;
}
.process-diag .wrapper.diag {
    padding-bottom: 5.55556em;
}
.process-diag .diag-outer.process .diag-wrapper {
    padding-bottom: 116%;
}
.process-diag .item-wrapper .item.discover, .process-diag .item-wrapper .item.design {
    top: 3%;
}
.process-diag .item-wrapper .item.develop {
    top: 40%;
}
.process-diag .item-wrapper .item.refine {
    top: 53%;
}
.process-diag .item-wrapper .item.deploy {
    top: 71%;
}
.services.service-children .title-header.left-align {
    padding-bottom: 4em;
}
.services.service-children .title-header.left-align .wrapper {
    padding-bottom: 444px;
    position: relative;
}
.services.service-children .title-header.left-align .copy {
    float: none;
    margin-left: auto;
    margin-right: auto;
    max-width: 480px;
    padding-left: 2.6506%;
    padding-right: 2.6506%;
    width: 94.6988%;
}
.services.service-children .title-header.left-align .copy:nth-child(n+1) {
    clear: left;
}
.services.service-children .title-header.left-align .copy .sozo-content {
    padding-left: 0;
    padding-right: 0;
}
.services.service-children .diag-wrapper, .services.service-children .item-wrapper {
    bottom: 0;
    left: 50%;
    margin-left: -240px;
    margin-top: 0;
    max-width: 480px;
    padding-bottom: 444px;
    top: auto;
}
.services.service-children .item-wrapper ul ul a span {
    font-size: 0.56em;
}
.blog-list .item.has-img .desc {
    max-width: 24.4444em;
    position: relative;
    width: 100%;
}
.blog-list .item.has-img:nth-child(2n) .desc {
    float: left;
}
.blog-list .item.has-img:nth-child(2n+1) .desc {
    float: right;
}
.blog.article.has-hero-vid .vid-hero .wrapper {
    padding-bottom: 0;
}
.person-list .item {
    padding-bottom: 50%;
    width: 50%;
}
.process-diag #process-diag {
    margin-left: -30%;
    width: 160%;
}
.process-diag .diag-wrapper {
    padding-bottom: 102.937%;
}
.process-diag .item-wrapper .item.discover {
    top: 7%;
}
.process-diag .item-wrapper .item.design {
    top: 11%;
}
.process-diag .item-wrapper .item.develop {
    left: 0;
    right: auto;
    top: 28%;
}
.process-diag .item-wrapper .item.refine {
    left: auto;
    right: 0;
    top: 54%;
}
.process-diag .item-wrapper .item.deploy {
    left: auto;
    margin-left: 0;
    top: 70%;
}
.timeline .item {
    width: 50%;
}
.timeline .item.third {
    clear: both;
}
.timeline .item.third, .timeline .item.fourth {
    margin-top: -7em;
}
.timeline .split {
    clear: both;
    display: block;
    overflow: hidden;
    position: relative;
}
.timeline .split:after {
    clear: both;
    content: "";
    display: table;
}
.timeline .timeline-diag {
    width: 200%;
}
.timeline #timeline-diag2 {
    display: block;
    left: -100%;
    top: 6.7em;
}
.contact .contact-details .placemarker {
    right: -42%;
}
#footer .unit, .results .unit {
    margin-left: 2.6506%;
    width: 46.0241%;
}
#footer .unit:nth-child(2n+1), .results .unit:nth-child(2n+1) {
    clear: left;
}
}
@media screen and (max-width: 40em) {
.sozo-content h1 {
    font-size: 2em;
}
.sozo-content h2 {
    font-size: 1.44444em;
}
.sozo-content h3 {
    font-size: 1.33333em;
}
.sozo-content h4 {
    font-size: 1.11111em;
}
#header .logo {
    height: 27px;
    margin-top: -13.5px;
    width: 94px;
}
.moving-gallery {
    display: none;
}
.content-block .wrapper {
    padding-left: 5.3012%;
    padding-right: 5.3012%;
}
.services-landing .services-diag1 .wrapper {
    padding-top: 2.77778em !important;
}
.services-landing .services-diag1 .item-wrapper {
    padding-bottom: 2.77778em;
    padding-top: 2.77778em;
}
.services-landing .services-diag1 .item-wrapper .parent span {
    font-size: 0.57em;
    margin-top: 16px;
}
.services.services-landing .services-diag1 {
    margin-top: -9.6em;
}
.home .project-intro {
    padding-top: 5.55556em;
}
.home .services-diag1 .diag-outer.services, .home .services-diag1 .item-wrapper {
    transform: scale(1.3, 1.3);
}
.services-landing .services-diag1 .item-wrapper ul a:before {
    display: none;
}
.services-landing .services-diag1 .item-wrapper ul a span {
    font-size: 10px;
}
.services-landing .services-diag1 .item-wrapper ul ul a span {
    margin-top: -1em;
    padding: 0;
    top: 50%;
}
.process-diag .diag-outer.process {
    display: none;
}
.process-diag .item-wrapper {
    position: relative;
}
.process-diag #process-diag {
    display: none;
}
.process-diag .diag-wrapper {
}
.process-diag .item-wrapper .item {
    bottom: auto !important;
    left: auto !important;
    margin-left: 2.6506%;
    position: relative;
    right: auto !important;
    text-align: center;
    top: auto !important;
    width: 94.6988%;
}
.process-diag .item-wrapper .item:nth-child(n+1) {
    clear: left;
}
.process-diag .item-wrapper .item .heading3:before, .process-diag .item-wrapper .item .heading3:after {
    margin-left: 0.5em;
}
.process-diag .item-wrapper .item:before {
    background: url("../images/icons/sprite-process-diag-icons1.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    content: "";
    display: block;
    height: 92px;
    margin: 1em auto;
    width: 92px;
}
.process-diag .item-wrapper .item.discover:before {
    background-position: 0 0;
}
.process-diag .item-wrapper .item.design:before {
    background-position: 25% 0;
}
.process-diag .item-wrapper .item.develop:before {
    background-position: 50% 0;
}
.process-diag .item-wrapper .item.refine:before {
    background-position: 75% 0;
}
.process-diag .item-wrapper .item.deploy:before {
    background-position: 100% 0;
}
.main-content .wrapper {
    padding-bottom: 2.77778em;
    padding-top: 2.77778em;
}
.title-header .wrapper {
    padding-top: 80.5px;
}
.dropdown-filter .title {
    padding-bottom: 0.8em;
    top: 0;
    width: 100%;
}
.project-hero .copy {
    margin-left: 2.6506%;
    width: 94.6988%;
}
.project-hero .copy:nth-child(n+1) {
    clear: left;
}
.project-hero .devices-imac-iphone1, .project-hero .devices-ipad-iphone1 {
    opacity: 0.3;
}
.project-hero .devices-imac-iphone1 {
    height: 0;
    left: 38%;
    margin-top: -44%;
    padding-bottom: 93.3103%;
    width: 110%;
}
.project-hero .devices-ipad-iphone1 {
    height: 0;
    left: 37%;
    margin-top: -48%;
    padding-bottom: 99.6538%;
    width: 89%;
}
.project-list .primary-list .unit, .project-list .secondary-list .unit {
    margin-bottom: 2.6506%;
    margin-left: 2.6506%;
    margin-top: 2.6506%;
    width: 94.6988%;
}
.project-list .primary-list .unit:nth-child(n+1), .project-list .secondary-list .unit:nth-child(n+1) {
    clear: left;
}
.project-list .project-hero.play-audio {
    background-image: url("../images/web-design/play-audio-web-design-6-3.jpg?v=1");
}
.home .title-header.final .scroll-down {
    bottom: -15px;
    opacity: 0.2;
}
.blog-list .item {
    padding-left: 0;
    padding-right: 0;
}
.blog-list .item .desc {
    height: auto;
}
.blog-list .item .desc .meta {
    bottom: auto;
    left: auto;
    margin-top: 3em;
    position: relative;
}
.blog-list .item.has-img > .media {
    display: none !important;
}
.blog-list .item.has-img .desc {
    float: none !important;
    left: auto !important;
    margin-top: 0;
    right: auto !important;
}
.reviews .alternating-items .item .copy, .reviews .alternating-items .item .media {
    margin-left: 2.6506%;
    overflow: hidden;
    width: 94.6988%;
}
.reviews .alternating-items .item .copy:nth-child(n+1), .reviews .alternating-items .item .media:nth-child(n+1) {
    clear: left;
}
.reviews .alternating-items .item .copy {
    margin-bottom: 0;
    margin-top: 1.4em;
}
.reviews .alternating-items .item .copy .inner {
    max-width: 26.6667em;
    text-align: center;
}
.reviews .alternating-items .item .copy .quote, .reviews .alternating-items .item .copy p, .reviews .alternating-items .item .copy .heading3, .reviews .alternating-items .item .copy .heading2 {
    text-align: left;
}
.reviews .alternating-items .item .media {
    max-width: 540px;
    transform: none;
}
.alternating-items .item .copy, .alternating-items .item .media {
    clear: both !important;
    float: none !important;
    margin-left: auto;
    margin-right: auto;
    width: 94.6988%;
}
.alternating-items .item .copy:nth-child(n+1), .alternating-items .item .media:nth-child(n+1) {
    clear: left;
}
.alternating-items .item .copy:after, .alternating-items .item .media:after {
    clear: both;
    content: "";
    display: table;
}
.alternating-items .item .copy {
    margin-bottom: 2em;
    margin-left: 2.6506%;
}
.alternating-items .item .copy .inner {
    float: none !important;
    margin-left: auto;
    margin-right: auto;
}
.alternating-items .item .media {
    left: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 340px;
    position: relative;
    right: 0 !important;
    top: 0 !important;
    width: 100%;
}
.alternating-items .item .media.no-top:before, .alternating-items .item .media.no-top i {
    display: block;
}
.project-article .alternating-items .items.even {
    background-image: none !important;
}
.blog.article {
    background: none repeat scroll 0 0 #f3f6f8;
}
.blog.article .diag2.fake-btm {
    padding-bottom: 11.2em;
}
.info-article {
    padding-bottom: 0 !important;
}
.info-article .img-hero {
    margin-bottom: -1.11111em;
}
.info-article > .wrapper {
    margin-top: 1.11111em;
}
.info-article .wrapper {
    padding-bottom: 0 !important;
}
.info-article .primary, .info-article .secondary {
    width: 100%;
}
.info-article .primary {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}
.info-article .primary .sozo-content img {
    margin-left: -2.6506%;
    width: 105.301%;
}
.info-article .secondary {
    background: none repeat scroll 0 0 #f3f6f8;
}
.info-article .secondary .meta, .info-article .secondary .related {
    max-width: 26.6667em;
}
.info-article .primary .inner, .info-article .secondary .meta, .info-article .secondary .related {
    float: none;
    margin-left: auto;
    margin-right: auto;
    max-width: 26.6667em;
}
.contact .form .about-you input, .contact .form .contact-details .unit {
    margin-left: 4.88889%;
    width: 90.2222%;
}
.contact .form .about-you input:nth-child(n+1), .contact .form .contact-details .unit:nth-child(n+1) {
    clear: left;
}
.contact .form .service .col {
    margin-left: 4.88889%;
    width: 42.6667%;
}
.contact .form .service .col:nth-child(2n+1) {
    clear: left;
}
.contact .form .service .col:nth-child(2n+1) {
    clear: none;
}
.contact .form .service .col:nth-of-type(2n+1) {
    clear: both;
}
.contact .contact-details .placemarker {
    display: none;
}
.svg .process-diag .item-wrapper .item:before {
    background-image: url("../images/icons/sprite-process-diag-icons1.svg?v=1");
}
}
@media screen and (max-width: 30em) {
.csstransforms #header .primary-nav:before {
    width: 100%;
}
.heading1 {
    font-size: 2em;
}
.heading2 {
    font-size: 1.5em;
}
.heading3 {
    opacity: 1;
}
.heading5 {
    font-size: 1.27778em;
}
.moving-gallery div {
    background: url("../images/bg/team-photos3.jpg?v=1") no-repeat scroll center center / cover rgba(0, 0, 0, 0);
    height: 300px;
    left: 0;
    transform: translateZ(0px) !important;
    width: 100%;
}
.csstransitions .home .title-header .heading1.hide-seek > span span.animate-me1 {
    opacity: 0;
}
.csstransitions .home .title-header .wrapper.final.animate-me2:before, .csstransitions .home .title-header .single-statements .bold.animate-me1:before {
    padding-bottom: 220%;
    width: 220%;
}
.csstransitions .home .title-header .single-statements .different {
    transform: translate(-200%, 0px);
}
.csstransitions .home .title-header .single-statements .different span, .csstransitions .home .title-header .single-statements .different:after {
    font-size: 60px;
}
.csstransitions .home .title-header .single-statements .bold span {
    font-size: 70px;
}
.home .project-intro .wrapper {
    padding-left: 2.6506%;
    padding-right: 2.6506%;
}
.home .title-header.final .heading1 span {
    display: inline;
}
.home .stats .unit {
    float: none;
    margin-left: auto;
    margin-right: auto;
    max-width: 210px;
    width: 100%;
}
.project-hero .wrapper {
    height: auto;
    padding-bottom: 5.55556em;
    padding-top: 5.55556em;
}
.project-hero .copy {
    display: block;
    padding-left: 0;
}
.project-article .alternating-items .item.odd {
    padding-bottom: 9em;
}
.project-article .alternating-items .item.odd .wrapper {
    padding-bottom: 0;
}
.project-article .no-results .alternating-items .item.even {
    margin-top: -5em !important;
}
.project-article .no-review.no-results .alternating-items .item.even {
    margin-bottom: 4em !important;
    margin-top: -5em !important;
}
.backgroundsize .project-article.watch-gecko .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.watch-gecko .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.videomybusiness .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.videomybusiness .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.mosaic .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.mosaic .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.skygarden .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.skygarden .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.gocompare .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.gocompare .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.adtech .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.adtech .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.threecounties .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.threecounties .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.plunkett .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.plunkett .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.imagin .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.imagin .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.sophie-everett .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.sophie-everett .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.mccarthy .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.mccarthy .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.smarthomesounds .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.smarthomesounds .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.tritech .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.tritech .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.benjamin-chocolatier .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.benjamin-chocolatier .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.annette-rose .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.annette-rose .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.jumping-spider .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.jumping-spider .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.cotswold-grange .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.cotswold-grange .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.jumping-spider .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.jumping-spider .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.turtle-homes .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.turtle-homes .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.katie-bonas .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.katie-bonas .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.rubbertech .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.rubbertech .alternating-items .item.even {
    background-image: none;
}
.backgroundsize .project-article.just-fabrics .alternating-items .item {
    padding-bottom: 5em;
}
.backgroundsize .project-article.just-fabrics .alternating-items .item.even {
    background-image: none;
}
.project-list .primary-list .wrapper {
    margin-top: 0;
    padding-bottom: 14.4444em;
    padding-top: 2.6506%;
}
.project-list .secondary-list > .wrapper {
    top: -2.77778em;
}
.project-list .secondary-list .cta1 {
    padding-top: 2.77778em;
}
.project-intro .work li {
    margin-left: 0;
    width: 100%;
}
.project-intro .work li:nth-of-type(4) {
    display: none;
}
.project-intro .work li.more {
    margin-top: 2em;
}
.svg .services-diag1 .item-wrapper .parent.design-parent {
    background-image: linear-gradient(234deg, rgba(233, 64, 84, 0.48), rgba(214, 41, 86, 0.68));
}
.svg .services-diag1 .item-wrapper .parent.marketing-parent {
    background-image: linear-gradient(234deg, rgba(3, 248, 153, 0.48), rgba(0, 204, 217, 0.68));
}
.svg .services-diag1 .item-wrapper .parent.branding-parent {
    background-image: linear-gradient(234deg, rgba(204, 9, 227, 0.48), rgba(0, 68, 194, 0.68));
}
.services-landing .scroll-down {
    display: none;
}
.services-landing #service-diag1, .services-landing .services-diag1 .diag-outer {
    display: none;
}
.services-landing .services-diag1 .item-wrapper {
    padding-bottom: 5.55556em;
    padding-top: 5.55556em;
    position: static;
}
.services-landing .services-diag1 .item-wrapper > ul {
    position: static;
}
.services-landing .services-diag1 .item-wrapper > ul li a {
    border-radius: 60px;
    height: 120px;
    margin: 0;
    opacity: 0.9;
    width: 120px;
}
.services-landing .services-diag1 .item-wrapper > ul li ul a span {
    margin-top: 20px;
    padding-left: 1em;
    padding-right: 1em;
}
.services-landing .services-diag1 .item-wrapper > ul > li {
    clear: both;
    display: inline-block;
    position: relative;
}
.services-landing .services-diag1 .item-wrapper > ul > li:after {
    clear: both;
    content: "";
    display: table;
}
.services-landing .services-diag1 .item-wrapper .parent {
    border-radius: 90px;
    bottom: auto;
    display: block;
    height: 180px;
    left: auto;
    margin: 10px;
    opacity: 1;
    overflow: hidden;
    position: relative;
    right: auto;
    top: auto;
    width: 180px;
}
.services-landing .services-diag1 .item-wrapper .parent span {
    margin-top: 22px;
}
.services-landing .services-diag1 a {
    bottom: auto;
    left: auto;
    margin: 0;
    right: auto;
    top: auto;
}
.services-landing .services-diag1 a:before {
    display: block !important;
}
.services-landing .services-diag1 .web-design {
    float: left;
}
.services-landing .services-diag1 .web-design a {
    background-image: linear-gradient(234deg, rgba(233, 64, 84, 0.48), rgba(214, 41, 86, 0.68));
}
.services-landing .services-diag1 .marketing {
    float: right;
    margin-top: -6em;
}
.services-landing .services-diag1 .marketing a {
    background-image: linear-gradient(234deg, rgba(3, 248, 153, 0.48), rgba(0, 204, 217, 0.68));
}
.services-landing .services-diag1 .marketing .parent {
    float: right;
}
.services-landing .services-diag1 .marketing .strategy {
    left: auto;
    right: 160px;
    top: -40px;
}
.services-landing .services-diag1 .marketing .seo {
    left: auto;
    right: 182px;
    top: 54px;
}
.services-landing .services-diag1 .marketing .email {
    left: auto;
    right: 138px;
    top: 145px;
}
.services-landing .services-diag1 .branding {
    float: left;
    margin-top: -6em;
}
.services-landing .services-diag1 .branding a {
    background-image: linear-gradient(234deg, rgba(204, 9, 227, 0.48), rgba(0, 68, 194, 0.68));
}
.services-landing .services-diag1 .web-design .parent, .services-landing .services-diag1 .branding .parent {
    float: left;
}
.services-landing .services-diag1 .web-design .responsive, .services-landing .services-diag1 .web-design .logo-design, .services-landing .services-diag1 .branding .responsive, .services-landing .services-diag1 .branding .logo-design {
    left: 160px;
    top: -40px;
}
.services-landing .services-diag1 .web-design .web-dev, .services-landing .services-diag1 .web-design .corporate-id, .services-landing .services-diag1 .branding .web-dev, .services-landing .services-diag1 .branding .corporate-id {
    left: 182px;
    top: 54px;
}
.services-landing .services-diag1 .web-design .e-commerce, .services-landing .services-diag1 .web-design .brochures, .services-landing .services-diag1 .branding .e-commerce, .services-landing .services-diag1 .branding .brochures {
    left: 138px;
    top: 145px;
}
.services.service-children .title-header.left-align .wrapper {
    padding-bottom: 296px;
    position: relative;
}
.services.service-children .diag-wrapper, .services.service-children .item-wrapper {
    margin-left: -160px;
    padding-bottom: 296px;
    width: 320px;
}
.services.service-children .diag-wrapper svg {
    height: 296px;
}
.services.service-children .item-wrapper .parent span {
    font-size: 0.7em;
    margin-top: 18px;
}
.services.service-children .services-diag1 .item-wrapper ul a:before {
    background-size: 1200% 100%;
    height: 54px;
    margin-left: -27px;
    margin-top: -33px;
    width: 54px;
}
.services.service-children .services-diag1 .item-wrapper ul ul a span {
    margin-top: 15px;
}
.person-list .item {
    padding-bottom: 100%;
    width: 100%;
}
.svg .timeline .item .heading3 {
    padding-bottom: 0;
}
.timeline .item {
    position: relative;
    width: 100%;
}
.timeline .item:before {
    background: url("../images/icons/sprite-timeline-icons.png?v=1") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
    content: "";
    display: block;
    height: 54px;
    margin: 0 auto;
    width: 54px;
}
.timeline .item.one:before {
    background-position: 0 0;
}
.timeline .item.two:before {
    background-position: 33.3333% 0;
}
.timeline .item.three:before {
    background-position: 66.6667% 0;
}
.timeline .item.four:before {
    background-position: 100% 0;
}
.timeline .item .heading3 {
    padding-bottom: 0;
}
.timeline .timeline-diag {
    display: none !important;
}
.svg .timeline .item:before {
    background-image: url("../images/icons/sprite-timeline-icons.svg?v=1");
}
.contact .form .item .heading3 {
    padding-left: 1.2em;
    text-align: left;
}
.contact .form .item .heading3:before {
    left: -0.7em;
}
.contact .form .item .heading3:after {
    left: 0.2em;
}
.contact .form .budget {
    text-align: center;
}
.contact .form .budget .col-wrapper:before {
    display: none;
}
.contact .form .budget .col {
    display: inline-block;
    float: none;
    width: 33.3333%;
}
#footer .unit, .results .unit {
    margin-left: 2.6506%;
    width: 94.6988%;
}
#footer .unit:nth-child(n+1), .results .unit:nth-child(n+1) {
    clear: left;
}
#footer .unit {
    display: none;
    text-align: center;
}
#footer .unit.contact {
    display: block;
}
}
.title-header h1 {
    background-color: #25eefe;
    font-size: 50px;
    font-weight: 200;
    line-height: 100px;
    margin: 3% 0 0;
    padding: 0 2% 0 0;
    text-align: center;
    transform: rotate(-3deg);
}
.title-header div.paratext {
    color: #555;
    float: right;
    font-size: 28px;
    font-weight: 200;
    line-height: 35px;
    padding: 2% 2% 0 0;
    text-align: right;
    width: 40%;
}
.pinkcolor {
    color: #df3454 !important;
    float: left;
    padding: 2% 0;
}
.bluecolor {
    color: #25edfe !important;
    float: left;
    padding: 2% 0;
}
.greycolor {
    border-bottom: 1px dashed #ddd;
    color: #555;
    float: left;
    font-size: 15px;
    padding: 2% 0;
}
.paragraph {
    color: #555;
    float: left;
    font-size: 16px;
    font-weight: 300;
    padding: 0;
    text-align: left;
}
.contact_us_btn {
    background: none repeat scroll 0 0 #df3454;
    border-radius: 6px;
    color: #fff;
    float: right;
    font-size: 19px;
    font-weight: 300;
    margin: 7% 0 2%;
    padding: 2% 10%;
}
.partner_class {
    left: 3%;
    position: absolute;
    top: 10.3%;
    width: 86px;
}
.footer_left {
    float: right;
    padding-right: 5%;
    text-align: right;
}
@media screen and (max-width: 728px) {
.title-header span {
    float: left;
    width: 100%;
}
.title-header div.paratext {
    float: left;
    width: 100%;
}
.title-header h1 {
    line-height: 50px;
}
.footer_left {
}
#header .logo {
    margin-top: -7% !important;
    width: 65%;
}
#header .logo a {
    width: 100%;
}
#particles1 {
    display: none;
}
.title-header {
    min-height: 1000px;
}
.csstransforms #header .primary-nav .nav-links li a {
    font-size: 1.1em;
    line-height: 32px;
    padding: 0.38em 0;
}
.fullwidth_sec img {
    width: 100% !important;
}
}
.title-header h1.publishers_logo {
    background-color: #fabc3d;
    color: #222;
    font-size: 45px;
    font-weight: 200;
    line-height: 100px;
    margin: 3% 0 0;
    padding: 0 2% 0 0;
    text-align: center;
    transform: rotate(-3deg);
}
.title-header h1.advertisers_logo {
    background-color: #f74a47;
    color: #fff;
    font-size: 45px;
    font-weight: 200;
    line-height: 100px;
    margin: 3% 0 0;
    padding: 0 2% 0 0;
    text-align: center;
    transform: rotate(-3deg);
}
.back_red {
    background: none repeat scroll 0 0 #f74a47 !important;
}
.accreditations .gad span {
    color: #222;
    line-height: 25px;
}
.pink_border {
    border-color: #e04f5f;
    color: #e04f5f;
}
.round_icons_made {
    border: 7px solid;
    border-radius: 150px;
    height: 150px;
    text-align: center;
    width: 150px;
}
.round_icons_made .big_text {
    font-size: 86px;
    font-weight: 200;
    letter-spacing: -7px;
    line-height: 103px !important;
}
.round_icons_made .small_text {
    float: left;
    font-size: 14px;
    font-weight: bold;
    line-height: 2px !important;
    margin-top: -5px;
    text-align: center;
    width: 100%;
}
.pink_border span {
    color: #e04f5f;
}
.green_border {
    border-color: #32bea6;
    color: #32bea6;
}
.round_icons_made img {
    margin-top: 16%;
    width: 100% !important;
}
.yellow_border {
    border-color: #fabc3d;
    color: #fabc3d;
}
.blue_border {
    border-color: #25b7d3;
    color: #25b7d3;
}
.Multichannel_lists li {
    float: left;
    list-style: square outside none;
    width: 100%;
}
.csstransforms #header .primary-nav:before, .diag1.cta1, .project-article .quote-wrapper, .csstransitions .home .mega-circle:before {
    background-color: #f74a47 !important;
    background-image: linear-gradient(44deg, #f74a47, #f74a47) !important;
}
.fullwidth_sec {
    background: none repeat scroll 0 0 #fff;
    float: left;
    text-align: center;
    width: 100%;
}
.fullwidth_sec img {
    width: auto;
}