* {  box-sizing: border-box; }html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {  margin: 0;  padding: 0;  border: 0;  font-size: 100%;  font: inherit;  vertical-align: baseline; }article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {  display: block; }html, body {  height: 100%; }a img {  border: none; }blockquote {  quotes: none; }blockquote:before, blockquote:after {  content: '';  content: none; }table {  border-collapse: collapse;  border-spacing: 0; }caption, th, td {  text-align: left;  font-weight: normal;  vertical-align: middle; }/* -----------------------------------------  7.0. grid----------------------------------------- *//* ---------------------------------------------- *  Partial: grid  We're using Susy. Please visit http://susy.readthedocs.org/en/latest/install/  Due to using Susy, we're going to need the Ruby gems installed. Please a see a guide here: [TBD].  Usage  =====\* ---------------------------------------------- *//* - Index-------------------------------------------------  - Global defaults     ............................. 1.0.  - Grid makeup         ............................. 2.0.*//* ---------------------------------------------- *  1.0 Global defaults\* ---------------------------------------------- *//* ---------------------------------------------- *  1.0 Grid makeup\* ---------------------------------------------- */.contain {  max-width: 1080px;  margin-left: auto;  margin-right: auto;  padding: 0 1.50169em; }  .contain:after {    content: " ";    display: block;    clear: both; }  @media (min-width: 75em) {    .contain {      padding: 0; } }  .contain--table {    display: table;    width: 100%;    max-width: 1080px;    margin: 0 auto; }/* -----------------------------------------  8.0. base----------------------------------------- *//* ---------------------------------------------- *  Partial: base  Here you place the base defaults to any project\* ---------------------------------------------- */*, *:before, *:after {  box-sizing: border-box; }html {  font-size: 100%;  -webkit-text-size-adjust: 100%;      -ms-text-size-adjust: 100%;          text-size-adjust: 100%; }body {  color: #141414;  font-family: brandon-grotesque, sans-serif; font-weight: 400;  font-size: 14px;  line-height: 1.6;  margin: 0; }  @media (min-width: 30em) {    body {      font-size: 16px; } }html, body, .page-wrapper {  height: 100%;  min-height: 100%; }small {  font-size: 0.85em; }ul li {  list-style: none; }ol li {  list-style: none; }ul.disc {  padding-left: 1em; }  ul.disc li {    list-style-type: disc;    margin-bottom: 0.5em; }img, object, embed {  height: auto;  max-width: 100%; }blockquote {  background: #e3e3e3;  color: #FFFFFF;  font-size: 1.1em;  font-style: italic;  margin: 0 0 1.25em 1.25em;  padding: 0.625em 1.25em 1.25em; }  blockquote p:last-child {    margin-bottom: 0; }button {  -webkit-appearance: none;  -moz-appearance: none;  appearance: none; }input[type="text"] {  -webkit-appearance: none;  -moz-appearance: none;  appearance: none; }/*********************************************  - 2.0 -  LINKS*********************************************//* - 2.1. - BASE LINK STYLES  ------------------------------------------ */a {  color: #f39220;  cursor: pointer;  text-decoration: none;  /* Improve readability when focused and hovered in all browsers: h5bp.com/h */ }  a:hover {    color: #d87705; }  a:focus {    color: #d87705; }  a:focus,  a:active {    outline: none; }/* - 2.2. - HEADER LINKS   ------------------------------------------ */h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,.h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a {  color: #f39220; }/*********************************************  - 3.0 -  Helpers*********************************************/.hide {  display: none; }.tac {  text-align: center; }.divider {  margin-bottom: 0.4em; }  .divider:after {    width: 4rem;    height: 2px;    background-color: #f39220;    display: block;    content: "";    margin: 0.4em 0; }.divider-center:after {  margin: 0.4em auto; }.dots {  background: url("/smarter-web-company-co-uk/_img/images/dot-pattern.jpg") repeat; }.light-dots {  background: url("/smarter-web-company-co-uk/_img/images/white-dot.png") repeat; }.dark-bg {  background: url("/smarter-web-company-co-uk/_img/images/dark-pattern.jpg") repeat; }.grid {  background: url("/smarter-web-company-co-uk/_img/images/grid-pattern.png") repeat #fff; }.striped {  background: url("/smarter-web-company-co-uk/_img/images/pinstripe.png") repeat; }.black {  background: #141414; }  .black h1, .black h2, .black h3, .black h4, .black h5, .black h6, .black p {    color: #fff; }  .black p {    font-family: brandon-grotesque, sans-serif; font-weight: 300;    color: rgba(255, 255, 255, 0.85); }section.black {  border-bottom: 3px solid #f39220; }.blue {  background-color: #f39220; }  .blue h1, .blue h2, .blue h3, .blue h4, .blue h5, .blue h6, .blue p {    color: #fff; }  .blue .divider:after {    background-color: #fff; }.grey {  background-color: #e9e9e9; }.srt {  border: 0;  clip: rect(0 0 0 0);  height: 1px;  margin: -1px;  overflow: hidden;  padding: 0;  position: absolute;  width: 1px; }.white-box {  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);  border-radius: 1px;  background-color: #fff;  padding: 2.5em; }/* -----------------------------------------  9.0. Typography----------------------------------------- *//* ---------------------------------------------- *  Partial: typography  I set all typographic styles here. First we list our variables such as fonts (maybe we're using some @font-face) and  additionally and maps we might want to use. Then we specificy the typographic scales we want.\* ---------------------------------------------- */h1, h2, h3, h4, h5, h6 {  line-height: 1.2;  font-weight: normal;  font-style: normal;  color: #111;  margin-bottom: 0.7em;  padding-top: 0.4em;  font-family: brandon-grotesque, sans-serif; font-weight: 700;  text-transform: uppercase; }h1 {  font-family: brandon-grotesque, sans-serif; font-weight: 900;  font-size: 2.7061em; }  @media (min-width: 30em) {    h1 {      font-size: 3.04436em; } }h2 {  font-family: brandon-grotesque, sans-serif; font-weight: 900;  font-size: 2.40542em; }  @media (min-width: 30em) {    h2 {      font-size: 2.7061em; } }h3 {  font-family: brandon-grotesque, sans-serif; font-weight: 900;  font-size: 2.13815em; }  @media (min-width: 30em) {    h3 {      font-size: 2.40542em; } }h4 {  font-size: 1.90058em; }h5 {  font-size: 1.68941em; }h6 {  font-family: brandon-grotesque, sans-serif; font-weight: 500;  font-size: 1.33484em; }p {  font-family: brandon-grotesque, sans-serif; font-weight: 400;  font-size: 1.18652em;  line-height: 1.6;  font-weight: normal;  font-style: normal;  margin-bottom: 0.8em;  padding-top: 0.2em;  color: #333; }strong {  font-family: brandon-grotesque, sans-serif; font-weight: 700; }/* -----------------------------------------  10.0. Nav----------------------------------------- *//* ---------------------------------------------- *  Partial: nav  All navigation styles here. This is sort that we can try keep things seperated and easy to maintain. You can  include all global navigation styles here. \* ---------------------------------------------- */.main-nav .menu {  display: block; }  .main-nav .menu:before,  .main-nav .menu:after {    content: "";    display: table; }  .main-nav .menu:after {    clear: both; }  .main-nav .menu > li {    position: relative;    display: inline-block;    margin: 0 0.25em;    font-size: 14px; }    @media (min-width: 66.25em) {      .main-nav .menu > li {        text-align: center;        height: 100%;        display: inline-block; }        .main-nav .menu > li:hover > ul {          display: block;          height: auto;          opacity: 1; } }    @media (min-width: 78.125em) {      .main-nav .menu > li {        font-size: 16px;        margin: 0 0.45em; } }    @media (min-width: 66.25em) {      .main-nav .menu > li.liLinkActive:before {        content: "";        display: block;        position: absolute;        bottom: 1px;        height: 5px;        width: 100%;        background-color: #fff; } }    .main-nav .menu > li a {      color: #fff;      display: block;      font-size: 0.9375em;      font-family: brandon-grotesque, sans-serif; font-weight: 700;      text-transform: uppercase;      text-align: center;      padding: 0 0.25em;      line-height: 4;      text-align: right;      -webkit-transition: line-height 350ms cubic-bezier(0.13, 0.68, 0.69, 0.3);              transition: line-height 350ms cubic-bezier(0.13, 0.68, 0.69, 0.3); }      .main-nav .menu > li a.liLinkActive, .main-nav .menu > li a:hover {        color: #f39220; }      .headroom--not-top .main-nav .menu > li a {        line-height: 4rem; }      @media (min-width: 66.25em) {        .main-nav .menu > li a {          line-height: 94px;          text-align: center; } }    .main-nav .menu > li:last-child a {      padding: 0.25em 1em;      background-color: #f39220;      color: #fff;      display: inline-block;      line-height: 2;      border-radius: 1px; }      .main-nav .menu > li:last-child a:hover {        background-color: #d87705; }    .main-nav .menu > li > ul {      display: none;      overflow: hidden; }      @media (min-width: 66.25em) {        .main-nav .menu > li > ul {          position: absolute;          z-index: 100;          top: 98%;          left: -5px;          min-width: 250px;          margin: 0;          background-color: rgba(0, 0, 0, 0.93);          height: 0;          opacity: 0;          -webkit-transition: opacity 0.2s linear;                  transition: opacity 0.2s linear; } }      .main-nav .menu > li > ul li {        border-bottom: 1px solid rgba(255, 255, 255, 0.1);        padding: 0 0.75em;        font-size: 14px; }        .main-nav .menu > li > ul li:hover {          background-color: #000; }        .main-nav .menu > li > ul li a {          text-align: left;          white-space: no-wrap;          line-height: 3 !important;          font-family: brandon-grotesque, sans-serif; font-weight: 500;          font-size: 0.9375em; }.mobile-menu .nav {  padding: 6.5em 0 3em;  overflow: hidden;  height: 100%;  width: 95%; }  .mobile-menu .nav > ul {    overflow-y: auto;    webkit-overflow-scrolling: touch;    font-size: 13px;    padding: 0 2em 0 2.5em;    height: 100%;    width: calc(100% + 18px); }    @media (min-width: 40em) {      .mobile-menu .nav > ul {        padding: 0 17% 0 17%; } }    .mobile-menu .nav > ul > li {      position: relative;      -webkit-transition: -webkit-transform 400ms ease-out;              transition: transform 400ms ease-out; }      .mobile-menu .nav > ul > li:nth-child(1) {        -webkit-transform: translateY(70em);            -ms-transform: translateY(70em);                transform: translateY(70em); }      .mobile-menu .nav > ul > li:nth-child(2) {        -webkit-transform: translateY(75em);            -ms-transform: translateY(75em);                transform: translateY(75em); }      .mobile-menu .nav > ul > li:nth-child(3) {        -webkit-transform: translateY(80em);            -ms-transform: translateY(80em);                transform: translateY(80em); }      .mobile-menu .nav > ul > li:nth-child(4) {        -webkit-transform: translateY(85em);            -ms-transform: translateY(85em);                transform: translateY(85em); }      .mobile-menu .nav > ul > li:nth-child(5) {        -webkit-transform: translateY(90em);            -ms-transform: translateY(90em);                transform: translateY(90em); }      .mobile-menu .nav > ul > li:nth-child(6) {        -webkit-transform: translateY(95em);            -ms-transform: translateY(95em);                transform: translateY(95em); }      .mobile-menu .nav > ul > li:nth-child(7) {        -webkit-transform: translateY(100em);            -ms-transform: translateY(100em);                transform: translateY(100em); }      .mobile-menu .nav > ul > li:nth-child(8) {        -webkit-transform: translateY(105em);            -ms-transform: translateY(105em);                transform: translateY(105em); }      .mobile-menu .nav > ul > li:nth-child(9) {        -webkit-transform: translateY(110em);            -ms-transform: translateY(110em);                transform: translateY(110em); }      .mobile-menu .nav > ul > li:nth-child(10) {        -webkit-transform: translateY(115em);            -ms-transform: translateY(115em);                transform: translateY(115em); }      .mobile-menu .nav > ul > li:nth-child(11) {        -webkit-transform: translateY(120em);            -ms-transform: translateY(120em);                transform: translateY(120em); }      .mobile-menu .nav > ul > li.parent > a:after {        content: "";        background-image: url("/smarter-web-company-co-uk/_img/images/down.svg");        background-repeat: no-repeat;        background-size: contain;        background-position: center;        width: 10px;        height: 20px;        margin-left: 0.5em;        position: relative;        display: inline-block;        -webkit-transition: -webkit-transform 150ms cubic-bezier(0.13, 0.68, 0.69, 0.3);                transition: transform 150ms cubic-bezier(0.13, 0.68, 0.69, 0.3);        -webkit-transform-origin: 50% 50%;            -ms-transform-origin: 50% 50%;                transform-origin: 50% 50%;        top: 4px; }      .mobile-menu .nav > ul > li.parent.open {        background-color: rgba(25, 33, 44, 0.95); }        .mobile-menu .nav > ul > li.parent.open > a {          color: #fff; }          .mobile-menu .nav > ul > li.parent.open > a:after {            -webkit-transform: rotate(180deg);                -ms-transform: rotate(180deg);                    transform: rotate(180deg);            top: 3px; }        .mobile-menu .nav > ul > li.parent.open > ul {          display: block; }      .mobile-menu .nav > ul > li a {        line-height: 2.5;        display: block;        text-transform: uppercase;        color: rgba(255, 255, 255, 0.5);        padding: 0 0 0 0.95em;        font-family: brandon-grotesque, sans-serif; font-weight: 500;        font-size: 1.33484em;        padding-top: 3px; }        @media (min-width: 40em) {          .mobile-menu .nav > ul > li a {            font-size: 1.50169em;            line-height: 3; } }        .mobile-menu .nav > ul > li a.open {          color: #f39220; }          .mobile-menu .nav > ul > li a.open:after {            -webkit-transform: rotate(180deg);                -ms-transform: rotate(180deg);                    transform: rotate(180deg); }        .mobile-menu .nav > ul > li a.linkActive {          color: #fff; }      .mobile-menu .nav > ul > li:hover {        border-bottom-color: #f39220; }        .mobile-menu .nav > ul > li:hover a {          color: rgba(255, 255, 255, 0.9); }      .mobile-menu .nav > ul > li:last-child {        border-bottom: none;        margin-top: 1.5em; }        .mobile-menu .nav > ul > li:last-child a {          line-height: 2.2;          padding: 0.45em 3em;          color: #fff;          background-color: #f39220;          text-align: center; }          @media (min-width: 30em) {            .mobile-menu .nav > ul > li:last-child a {              display: inline-block;              margin-left: 0.95em; } }          .mobile-menu .nav > ul > li:last-child a:hover {            background-color: #d87705; }      .mobile-menu .nav > ul > li ul {        background-color: rgba(30, 41, 54, 0.65);        padding: 0.5em 1em 0.75em;        display: none;        border-left: 1px solid #19212c;        border-right: 1px solid #19212c; }        .mobile-menu .nav > ul > li ul li a {          padding: 0.1em 0.5em;          font-size: 1.05469em;          line-height: 3;          font-family: brandon-grotesque, sans-serif; font-weight: 500; }          .mobile-menu .nav > ul > li ul li a:hover {            color: #f39220; }.show-menu .mobile-menu .nav > ul li {  -webkit-transform: translateY(0);      -ms-transform: translateY(0);          transform: translateY(0); }  .show-menu .mobile-menu .nav > ul li:nth-child(1) {    -webkit-transition-delay: 0.75s;            transition-delay: 0.75s; }  .show-menu .mobile-menu .nav > ul li:nth-child(2) {    -webkit-transition-delay: 0.79s;            transition-delay: 0.79s; }  .show-menu .mobile-menu .nav > ul li:nth-child(3) {    -webkit-transition-delay: 0.83s;            transition-delay: 0.83s; }  .show-menu .mobile-menu .nav > ul li:nth-child(4) {    -webkit-transition-delay: 0.87s;            transition-delay: 0.87s; }  .show-menu .mobile-menu .nav > ul li:nth-child(5) {    -webkit-transition-delay: 0.91s;            transition-delay: 0.91s; }  .show-menu .mobile-menu .nav > ul li:nth-child(6) {    -webkit-transition-delay: 0.95s;            transition-delay: 0.95s; }  .show-menu .mobile-menu .nav > ul li:nth-child(7) {    -webkit-transition-delay: 0.99s;            transition-delay: 0.99s; }  .show-menu .mobile-menu .nav > ul li:nth-child(8) {    -webkit-transition-delay: 1.03s;            transition-delay: 1.03s; }  .show-menu .mobile-menu .nav > ul li:nth-child(9) {    -webkit-transition-delay: 1.07s;            transition-delay: 1.07s; }  .show-menu .mobile-menu .nav > ul li:nth-child(10) {    -webkit-transition-delay: 1.11s;            transition-delay: 1.11s; }  .show-menu .mobile-menu .nav > ul li:nth-child(11) {    -webkit-transition-delay: 1.15s;            transition-delay: 1.15s; }/* -----------------------------------------  11.0. Header----------------------------------------- *//*  *  Owl Carousel - Animate Plugin */.owl-carousel .animated {  -webkit-animation-duration: 1000ms;  animation-duration: 1000ms;  -webkit-animation-fill-mode: both;  animation-fill-mode: both; }.owl-carousel .owl-animated-in {  z-index: 0; }.owl-carousel .owl-animated-out {  z-index: 1; }.owl-carousel .fadeOut {  -webkit-animation-name: fadeOut;  animation-name: fadeOut; }@-webkit-keyframes fadeOut {  0% {    opacity: 1; }  100% {    opacity: 0; } }@keyframes fadeOut {  0% {    opacity: 1; }  100% {    opacity: 0; } }/*  *  Owl Carousel - Auto Height Plugin */.owl-height {  -webkit-transition: height 500ms ease-in-out;  transition: height 500ms ease-in-out; }/*  *  Core Owl Carousel CSS File */.owl-carousel {  display: none;  width: 100%;  -webkit-tap-highlight-color: transparent;  /* position relative and z-index fix webkit rendering fonts issue */  position: relative;  z-index: 1; }.owl-carousel .owl-stage {  position: relative;  -ms-touch-action: pan-Y; }.owl-carousel .owl-stage:after {  content: ".";  display: block;  clear: both;  visibility: hidden;  line-height: 0;  height: 0; }.owl-carousel .owl-stage-outer {  position: relative;  overflow: hidden;  /* fix for flashing background */  -webkit-transform: translate3d(0px, 0px, 0px); }.owl-carousel .owl-controls .owl-nav .owl-prev,.owl-carousel .owl-controls .owl-nav .owl-next,.owl-carousel .owl-controls .owl-dot {  cursor: pointer;  -webkit-user-select: none;  -khtml-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none; }.owl-carousel.owl-loaded {  display: block; }.owl-carousel.owl-loading {  opacity: 0;  display: block; }.owl-carousel.owl-hidden {  opacity: 0; }.owl-carousel .owl-refresh .owl-item {  display: none; }.owl-carousel .owl-item {  position: relative;  min-height: 1px;  float: left;  -webkit-backface-visibility: hidden;  -webkit-tap-highlight-color: transparent;  -webkit-touch-callout: none;  -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;  user-select: none; }.owl-carousel .owl-item img {  display: block;  width: 100%;  -webkit-transform-style: preserve-3d; }.owl-carousel.owl-text-select-on .owl-item {  -webkit-user-select: auto;  -moz-user-select: auto;  -ms-user-select: auto;  user-select: auto; }.owl-carousel .owl-grab {  cursor: move;  cursor: -webkit-grab;  cursor: -o-grab;  cursor: -ms-grab;  cursor: grab; }.owl-carousel.owl-rtl {  direction: rtl; }.owl-carousel.owl-rtl .owl-item {  float: right; }/* No Js */.no-js .owl-carousel {  display: block; }/*  *  Owl Carousel - Lazy Load Plugin */.owl-carousel .owl-item .owl-lazy {  opacity: 0;  -webkit-transition: opacity 400ms ease;  transition: opacity 400ms ease; }.owl-carousel .owl-item img {  -webkit-transform-style: preserve-3d;          transform-style: preserve-3d; }/*  *  Owl Carousel - Video Plugin */.owl-carousel .owl-video-wrapper {  position: relative;  height: 100%;  background: #000; }.owl-carousel .owl-video-play-icon {  position: absolute;  height: 80px;  width: 80px;  left: 50%;  top: 50%;  margin-left: -40px;  margin-top: -40px;  background: url("owl.video.play.png") no-repeat;  cursor: pointer;  z-index: 1;  -webkit-backface-visibility: hidden;  -webkit-transition: scale 100ms ease;  transition: scale 100ms ease; }.owl-carousel .owl-video-play-icon:hover {  -webkit-transition: scale(1.3, 1.3);  transition: scale(1.3, 1.3); }.owl-carousel .owl-video-playing .owl-video-tn,.owl-carousel .owl-video-playing .owl-video-play-icon {  display: none; }.owl-carousel .owl-video-tn {  opacity: 0;  height: 100%;  background-position: center center;  background-repeat: no-repeat;  background-size: contain;  -webkit-transition: opacity 400ms ease;  transition: opacity 400ms ease; }.owl-carousel .owl-video-frame {  position: relative;  z-index: 1; }.owl-dots {  display: block;  margin: 1.5em auto 0;  text-align: center; }  .owl-dots .owl-dot span {    height: 0.75em;    width: 0.75em;    display: block;    background-color: rgba(255, 255, 255, 0.2);    border-radius: 50%; }  .owl-dots .owl-dot:hover span {    background-color: white; }.owl-dot {  display: inline-block;  margin: 0 0.3em; }  .owl-dot.active span {    background-color: #f39220; }  .owl-dot.active:hover span {    background-color: #f39220; }/**********************/ Magnific Popup CSS /************************/.mfp-bg {  top: 0;  left: 0;  width: 100%;  height: 100%;  z-index: 1042;  overflow: hidden;  position: fixed;  background: #0b0b0b;  opacity: 0.8;  filter: alpha(opacity=80); }.mfp-wrap {  top: 0;  left: 0;  width: 100%;  height: 100%;  z-index: 1043;  position: fixed;  outline: none !important;  -webkit-backface-visibility: hidden; }.mfp-container {  text-align: center;  position: absolute;  width: 100%;  height: 100%;  left: 0;  top: 0;  padding: 0 8px;  box-sizing: border-box; }.mfp-container:before {  content: '';  display: inline-block;  height: 100%;  vertical-align: middle; }.mfp-align-top .mfp-container:before {  display: none; }.mfp-content {  position: relative;  display: inline-block;  vertical-align: middle;  margin: 0 auto;  text-align: left;  z-index: 1045; }.mfp-inline-holder .mfp-content, .mfp-ajax-holder .mfp-content {  width: 100%;  cursor: auto; }.mfp-ajax-cur {  cursor: progress; }.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {  cursor: -webkit-zoom-out;  cursor: zoom-out; }.mfp-zoom {  cursor: pointer;  cursor: -webkit-zoom-in;  cursor: zoom-in; }.mfp-auto-cursor .mfp-content {  cursor: auto; }.mfp-close, .mfp-arrow, .mfp-preloader, .mfp-counter {  -webkit-user-select: none;  -moz-user-select: none;  -ms-user-select: none;      user-select: none; }.mfp-loading.mfp-figure {  display: none; }.mfp-hide {  display: none !important; }.mfp-preloader {  color: #CCC;  position: absolute;  top: 50%;  width: auto;  text-align: center;  margin-top: -0.8em;  left: 8px;  right: 8px;  z-index: 1044; }.mfp-preloader a {  color: #CCC; }.mfp-preloader a:hover {  color: #FFF; }.mfp-s-ready .mfp-preloader {  display: none; }.mfp-s-error .mfp-content {  display: none; }button.mfp-close, button.mfp-arrow {  overflow: visible;  cursor: pointer;  background: transparent;  border: 0;  -webkit-appearance: none;  display: block;  outline: none;  padding: 0;  z-index: 1046;  box-shadow: none; }button::-moz-focus-inner {  padding: 0;  border: 0; }.mfp-close {  width: 44px;  height: 44px;  line-height: 44px;  position: absolute;  right: 0;  top: 0;  text-decoration: none;  text-align: center;  opacity: 0.65;  filter: alpha(opacity=65);  padding: 0 0 18px 10px;  color: #FFF;  font-style: normal;  font-size: 28px;  font-family: Arial, Baskerville, monospace; }.mfp-close:hover, .mfp-close:focus {  opacity: 1;  filter: alpha(opacity=100); }.mfp-close:active {  top: 1px; }.mfp-close-btn-in .mfp-close {  color: #333; }.mfp-image-holder .mfp-close, .mfp-iframe-holder .mfp-close {  color: #FFF;  right: -6px;  text-align: right;  padding-right: 6px;  width: 100%; }.mfp-counter {  position: absolute;  top: 0;  right: 0;  color: #CCC;  font-size: 12px;  line-height: 18px;  white-space: nowrap; }.mfp-arrow {  position: absolute;  opacity: 0.65;  filter: alpha(opacity=65);  margin: 0;  top: 50%;  margin-top: -55px;  padding: 0;  width: 90px;  height: 110px;  -webkit-tap-highlight-color: transparent; }.mfp-arrow:active {  margin-top: -54px; }.mfp-arrow:hover, .mfp-arrow:focus {  opacity: 1;  filter: alpha(opacity=100); }.mfp-arrow:before, .mfp-arrow:after, .mfp-arrow .mfp-b, .mfp-arrow .mfp-a {  content: '';  display: block;  width: 0;  height: 0;  position: absolute;  left: 0;  top: 0;  margin-top: 35px;  margin-left: 35px;  border: medium inset transparent; }.mfp-arrow:after, .mfp-arrow .mfp-a {  border-top-width: 13px;  border-bottom-width: 13px;  top: 8px; }.mfp-arrow:before, .mfp-arrow .mfp-b {  border-top-width: 21px;  border-bottom-width: 21px;  opacity: 0.7; }.mfp-arrow-left {  left: 0; }.mfp-arrow-left:after, .mfp-arrow-left .mfp-a {  border-right: 17px solid #FFF;  margin-left: 31px; }.mfp-arrow-left:before, .mfp-arrow-left .mfp-b {  margin-left: 25px;  border-right: 27px solid #3F3F3F; }.mfp-arrow-right {  right: 0; }.mfp-arrow-right:after, .mfp-arrow-right .mfp-a {  border-left: 17px solid #FFF;  margin-left: 39px; }.mfp-arrow-right:before, .mfp-arrow-right .mfp-b {  border-left: 27px solid #3F3F3F; }.mfp-iframe-holder {  padding-top: 40px;  padding-bottom: 40px; }.mfp-iframe-holder .mfp-content {  line-height: 0;  width: 100%;  max-width: 900px; }.mfp-iframe-holder .mfp-close {  top: -40px; }.mfp-iframe-scaler {  width: 100%;  height: 0;  overflow: hidden;  padding-top: 56.25%; }.mfp-iframe-scaler iframe {  position: absolute;  display: block;  top: 0;  left: 0;  width: 100%;  height: 100%;  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);  background: #000; }/* Main image in popup */img.mfp-img {  width: auto;  max-width: 100%;  height: auto;  display: block;  line-height: 0;  box-sizing: border-box;  padding: 40px 0 40px;  margin: 0 auto; }/* The shadow behind the image */.mfp-figure {  line-height: 0; }.mfp-figure:after {  content: '';  position: absolute;  left: 0;  top: 40px;  bottom: 40px;  display: block;  right: 0;  width: auto;  height: auto;  z-index: -1;  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);  background: #444; }.mfp-figure small {  color: #BDBDBD;  display: block;  font-size: 12px;  line-height: 14px; }.mfp-figure figure {  margin: 0; }.mfp-bottom-bar {  margin-top: -36px;  position: absolute;  top: 100%;  left: 0;  width: 100%;  cursor: auto; }.mfp-title {  text-align: left;  line-height: 18px;  color: #F3F3F3;  word-wrap: break-word;  padding-right: 36px; }.mfp-image-holder .mfp-content {  max-width: 100%; }.mfp-gallery .mfp-image-holder .mfp-figure {  cursor: pointer; }@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {  /**       * Remove all paddings around the image on small screen       */  .mfp-img-mobile .mfp-image-holder {    padding-left: 0;    padding-right: 0; }  .mfp-img-mobile img.mfp-img {    padding: 0; }  .mfp-img-mobile .mfp-figure:after {    top: 0;    bottom: 0; }  .mfp-img-mobile .mfp-figure small {    display: inline;    margin-left: 5px; }  .mfp-img-mobile .mfp-bottom-bar {    background: rgba(0, 0, 0, 0.6);    bottom: 0;    margin: 0;    top: auto;    padding: 3px 5px;    position: fixed;    box-sizing: border-box; }  .mfp-img-mobile .mfp-bottom-bar:empty {    padding: 0; }  .mfp-img-mobile .mfp-counter {    right: 5px;    top: 3px; }  .mfp-img-mobile .mfp-close {    top: 0;    right: 0;    width: 35px;    height: 35px;    line-height: 35px;    background: rgba(0, 0, 0, 0.6);    position: fixed;    text-align: center;    padding: 0; } }@media all and (max-width: 900px) {  .mfp-arrow {    -webkit-transform: scale(0.75);    -ms-transform: scale(0.75);        transform: scale(0.75); }  .mfp-arrow-left {    -webkit-transform-origin: 0;    -ms-transform-origin: 0;        transform-origin: 0; }  .mfp-arrow-right {    -webkit-transform-origin: 100%;    -ms-transform-origin: 100%;        transform-origin: 100%; }  .mfp-container {    padding-left: 6px;    padding-right: 6px; } }.mfp-ie7 .mfp-img {  padding: 0; }.mfp-ie7 .mfp-bottom-bar {  width: 600px;  left: 50%;  margin-left: -300px;  margin-top: 5px;  padding-bottom: 5px; }.mfp-ie7 .mfp-container {  padding: 0; }.mfp-ie7 .mfp-content {  padding-top: 44px; }.mfp-ie7 .mfp-close {  top: 0;  right: 0;  padding-top: 0; }/**********************************Bootstrap Modal**********************************/.close {  font-size: 21px;  font-weight: bold;  line-height: 1;  color: #000000;  opacity: 0.2; }.close:hover,.close:focus {  color: #000000;  text-decoration: none;  cursor: pointer;  opacity: 0.5; }button.close {  padding: 0;  cursor: pointer;  background: transparent;  border: 0;  -webkit-appearance: none; }.modal-open {  overflow: hidden; }@-webkit-keyframes modalin {  0% {    -webkit-transform: scale(0);            transform: scale(0);    opacity: 0; }  100% {    -webkit-transform: scale(1);            transform: scale(1);    opacity: 1; } }@keyframes modalin {  0% {    -webkit-transform: scale(0);            transform: scale(0);    opacity: 0; }  100% {    -webkit-transform: scale(1);            transform: scale(1);    opacity: 1; } }.modal {  display: none;  overflow: hidden;  position: fixed;  top: 0;  right: 0;  bottom: 0;  left: 0;  z-index: 1050;  -webkit-overflow-scrolling: touch;  outline: 0; }.modal-open .modal {  overflow-x: hidden;  overflow-y: auto; }.modal-dialog {  position: relative;  width: auto;  margin: 10px; }.modal-content {  position: relative;  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);  background-clip: padding-box;  outline: 0; }.modal-backdrop {  position: fixed;  top: 0;  right: 0;  bottom: 0;  left: 0;  z-index: 1040;  background-color: #000000; }.modal-backdrop.fade {  opacity: 0;  filter: alpha(opacity=0); }.modal-backdrop.in {  opacity: 0.5;  filter: alpha(opacity=50); }.modal-header {  padding: 15px;  border-bottom: 1px solid #e5e5e5;  min-height: 16.42857143px; }.modal-header .close {  margin-top: -2px; }.modal-title {  margin: 0;  line-height: 1.42857143; }.modal-body {  position: relative;  padding: 15px; }.modal-footer {  padding: 15px;  text-align: right;  border-top: 1px solid #e5e5e5; }.modal-footer .btn + .btn {  margin-left: 5px;  margin-bottom: 0; }.modal-footer .btn-group .btn + .btn {  margin-left: -1px; }.modal-footer .btn-block + .btn-block {  margin-left: 0; }.modal-scrollbar-measure {  position: absolute;  top: -9999px;  width: 50px;  height: 50px;  overflow: scroll; }@media (min-width: 768px) {  .modal-dialog {    width: 600px;    margin: 30px auto; }  .modal-content {    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5); }  .modal-sm {    width: 300px; } }@media (min-width: 992px) {  .modal-lg {    width: 900px; } }.clearfix:before,.clearfix:after,.modal-footer:before,.modal-footer:after {  content: " ";  display: table; }.clearfix:after,.modal-footer:after {  clear: both; }.center-block {  display: block;  margin-left: auto;  margin-right: auto; }.pull-right {  float: right !important; }.pull-left {  float: left !important; }.hide {  display: none !important; }.show {  display: block !important; }.invisible {  visibility: hidden; }.text-hide {  font: 0/0 a;  color: transparent;  text-shadow: none;  background-color: transparent;  border: 0; }.hidden {  display: none !important; }.affix {  position: fixed; }@-webkit-keyframes slideUp {  100% {    -webkit-transform: translateY(-100%);            transform: translateY(-100%); } }@keyframes slideUp {  100% {    -webkit-transform: translateY(-100%);            transform: translateY(-100%); } }@-webkit-keyframes slideDown {  0% {    -webkit-transform: translateY(-100%);            transform: translateY(-100%); }  100% {    -webkit-transform: translateY(0);            transform: translateY(0); } }@keyframes slideDown {  0% {    -webkit-transform: translateY(-100%);            transform: translateY(-100%); }  100% {    -webkit-transform: translateY(0);            transform: translateY(0); } }header {  z-index: 100;  width: 100%;  background-color: rgba(0, 0, 0, 0.2);  position: fixed;  top: 0;  left: 0;  right: 0;  border-bottom: 1px solid rgba(255, 255, 255, 0.1);  height: 4rem;  -webkit-transition: all 350ms cubic-bezier(0.13, 0.68, 0.69, 0.3);          transition: all 350ms cubic-bezier(0.13, 0.68, 0.69, 0.3); }  @media (min-width: 66.25em) {    header {      height: 5.875rem; } }  header.headroom--not-top {    position: fixed;    height: 3.6rem;    background-color: rgba(0, 0, 0, 0.85); }    @media (min-width: 66.25em) {      header.headroom--not-top {        height: 4rem; } }    .show-menu header.headroom--not-top {      height: 3.6rem; }  .show-menu header.headroom--top {    height: 4rem; }    @media (min-width: 66.25em) {      .show-menu header.headroom--top {        height: 5.875rem; } }.slideUp {  -webkit-transform: translateY(-100%);      -ms-transform: translateY(-100%);          transform: translateY(-100%); }  .show-menu .slideUp {    -webkit-animation: none;            animation: none;    -webkit-transform: translateY(0);        -ms-transform: translateY(0);            transform: translateY(0); }.slideDown {  -webkit-transform: translateY(0);      -ms-transform: translateY(0);          transform: translateY(0);  -webkit-transition: all 350ms cubic-bezier(0.13, 0.68, 0.69, 0.3);          transition: all 350ms cubic-bezier(0.13, 0.68, 0.69, 0.3); }  .show-menu .slideDown {    -webkit-animation: none;            animation: none;    -webkit-transform: translateY(0);        -ms-transform: translateY(0);            transform: translateY(0); }.header-wrap {  height: 100%;  position: relative; }  .header-wrap:before,  .header-wrap:after {    content: "";    display: table; }  .header-wrap:after {    clear: both; }.logo {  width: 50%;  padding: 1.5em 0 1.5em 1.5em;  max-width: 100%;  position: relative;  top: 50%;  float: left;  -webkit-transform: translateY(-50%);      -ms-transform: translateY(-50%);          transform: translateY(-50%);  line-height: 0;  text-align: left; }  @media (min-width: 66.25em) {    .logo {      width: 16.66667%;      float: left; } }  .logo img {    max-width: 9em; }.logo-mark, .logo-phone {  display: none;  vertical-align: middle; }.logo-mark {  padding-right: 0.5em;  margin-right: 0.5em;  border-right: 2px solid #fff; }  .logo-mark img {    height: 2.5em;    width: 2.5em; }.logo-phone {  color: #fff;  font-size: 0.9375em;  font-family: brandon-grotesque, sans-serif; font-weight: 700; }.headroom--top .main-logo {  display: block; }.headroom--top .logo-mark, .headroom--top .logo-phone {  display: none; }.headroom--not-top .logo {  padding: 1.5em 0 1.5em 0.25em; }.headroom--not-top .main-logo {  display: none; }.headroom--not-top .logo-mark, .headroom--not-top .logo-phone {  display: inline-block; }.main-nav {  height: 100%;  position: relative;  display: none;  -webkit-transition: -webkit-transform 500ms ease-in-out;          transition: transform 500ms ease-in-out; }  @media (min-width: 66.25em) {    .main-nav {      width: 83.33333%;      float: right;      margin-right: 0;      padding-right: 1.5em;      background: transparent;      position: relative;      -webkit-transform: none;          -ms-transform: none;              transform: none;      display: block; } }@media (min-width: 66.25em) {  .nav {    float: right;    padding: 0;    width: auto;    display: block; } }/***************************************************************************Mobile Nav***************************************************************************/.burger {  width: 4em;  height: 4em;  display: inline-block;  position: relative;  -webkit-transition: all 300ms ease-in-out;          transition: all 300ms ease-in-out;  top: -2em;  right: 2em;  -webkit-transition-timing-function: cubic-bezier(0.61, 0.04, 0.17, 1.32);          transition-timing-function: cubic-bezier(0.61, 0.04, 0.17, 1.32); }  .burger .middle {    left: -0.25em;    top: 50%;    width: 4.5em;    height: 0.5em;    position: absolute;    margin-top: -0.25em;    display: inline-block;    border-radius: 0.5em;    -webkit-transition: all 300ms ease-in-out;            transition: all 300ms ease-in-out;    background: #fff; }  .burger:after,  .burger:before {    content: "";    width: 4.5em;    height: 0.5em;    left: -0.25em;    position: absolute;    border-radius: 0.5em;    background: #fff;    -webkit-transform-origin: 50%, 50%, 0;        -ms-transform-origin: 50%, 50%, 0;            transform-origin: 50%, 50%, 0;    -webkit-transition: all 300ms ease-in-out;            transition: all 300ms ease-in-out; }  .burger:after {    bottom: 0; }  .burger:before {    top: 0; }.menu-btn {  font-size: 0.5em;  width: 4em;  height: 4em;  line-height: 1em;  padding: 4em;  margin: 0 auto 0.6em;  display: inline-block;  position: absolute;  border-radius: 50%;  background-color: transparent;  -webkit-transition: all 300ms ease-in-out;          transition: all 300ms ease-in-out;  right: 2em;  top: 50%;  -webkit-transform: translateY(-50%);      -ms-transform: translateY(-50%);          transform: translateY(-50%); }  @media (min-width: 66.25em) {    .menu-btn {      display: none; } }  .menu-btn.active,  .show-menu .menu-btn {    cursor: pointer; }    .menu-btn.active:before,    .show-menu .menu-btn:before {      -webkit-animation: pointer-ball 300ms ease 1;              animation: pointer-ball 300ms ease 1;      -webkit-animation-timing-function: cubic-bezier(0.61, 0.04, 0.17, 1.32);              animation-timing-function: cubic-bezier(0.61, 0.04, 0.17, 1.32); }    .menu-btn.active .burger,    .show-menu .menu-btn .burger {      -webkit-transform: rotateZ(360deg);              transform: rotateZ(360deg); }      .menu-btn.active .burger.arrow .middle,      .menu-btn.active .burger.arrow:after,      .menu-btn.active .burger.arrow:before,      .show-menu .menu-btn .burger.arrow .middle, .show-menu .menu-btn .burger.arrow:after, .show-menu .menu-btn .burger.arrow:before {        background: white; }      .menu-btn.active .burger.arrow .middle,      .show-menu .menu-btn .burger.arrow .middle {        opacity: 1;        left: -0.4em;        top: 51%; }      .menu-btn.active .burger.arrow:after,      .show-menu .menu-btn .burger.arrow:after {        bottom: 0.65em;        width: 3em;        height: 0.55em;        -webkit-transform: translateX(1.7em) rotate(135deg);            -ms-transform: translateX(1.7em) rotate(135deg);                transform: translateX(1.7em) rotate(135deg); }      .menu-btn.active .burger.arrow:before,      .show-menu .menu-btn .burger.arrow:before {        top: 0.65em;        width: 3em;        height: 0.55em;        -webkit-transform: translateX(1.7em) rotate(-135deg);            -ms-transform: translateX(1.7em) rotate(-135deg);                transform: translateX(1.7em) rotate(-135deg); }      .menu-btn.active .burger.arrow.left,      .show-menu .menu-btn .burger.arrow.left {        -webkit-transform: rotateZ(-360deg);                transform: rotateZ(-360deg); }        .menu-btn.active .burger.arrow.left:after,        .show-menu .menu-btn .burger.arrow.left:after {          -webkit-transform: translateX(-0.2em) rotate(45deg);              -ms-transform: translateX(-0.2em) rotate(45deg);                  transform: translateX(-0.2em) rotate(45deg); }        .menu-btn.active .burger.arrow.left:before,        .show-menu .menu-btn .burger.arrow.left:before {          -webkit-transform: translateX(-0.2em) rotate(-45deg);              -ms-transform: translateX(-0.2em) rotate(-45deg);                  transform: translateX(-0.2em) rotate(-45deg); }@-webkit-keyframes pointer-ball {  0%, 100% {    -webkit-transform: scale(1);    -ms-transform: scale(1);    transform: scale(1); }  80% {    -webkit-transform: scale(2);    -ms-transform: scale(2);    transform: scale(2); }  100% {    opacity: 0; } }@keyframes pointer-ball {  0%, 100% {    -webkit-transform: scale(1);    -ms-transform: scale(1);    transform: scale(1); }  80% {    -webkit-transform: scale(2);    -ms-transform: scale(2);    transform: scale(2); }  100% {    opacity: 0; } }.mobile-menu {  position: fixed;  z-index: -1;  top: 0;  left: 0;  height: 100%;  width: 100%;  background-color: #243040;  -webkit-transition: -webkit-transform 750ms cubic-bezier(0.82, 0.01, 0.77, 0.78);          transition: transform 750ms cubic-bezier(0.82, 0.01, 0.77, 0.78);  -webkit-transform: translateX(110%);      -ms-transform: translateX(110%);          transform: translateX(110%);  display: block; }  @media (min-width: 1340) {    .mobile-menu {      display: none; } }  .show-menu .mobile-menu {    -webkit-transform: translateX(0);        -ms-transform: translateX(0);            transform: translateX(0);           }.mobile-login-button {  display: none;  position: absolute;  top: 1.4em;  right: 7em;  -webkit-transition: all 200ms ease;          transition: all 200ms ease;  opacity: 1; }  @media (min-width: 25em) {    .mobile-login-button {      display: inline-block; } }  @media (min-width: 30em) {    .mobile-login-button {      top: 0.75em; } }  @media (min-width: 66.25em) {    .mobile-login-button {      display: none; } }  .mobile-login-button a {    line-height: 1.5;    padding: 0.45em 2em;    color: #fff;    background-color: #f39220;    text-align: center;    text-transform: uppercase;    font-family: brandon-grotesque, sans-serif; font-weight: 500; }    @media (min-width: 30em) {      .mobile-login-button a {        display: inline-block;        margin-left: 0.95em; } }    .mobile-login-button a:hover {      background-color: #d87705; }  .show-menu .mobile-login-button {    opacity: 0; }/***************************************LOGIN STYLES***************************************/.modal {  background-color: rgba(0, 0, 0, 0.5); }  .modal .in .modal-dialog {    -webkit-transform: translateY(50%);        -ms-transform: translateY(50%);            transform: translateY(50%); }  .modal form {    max-width: 28em;    margin: auto; }.modal-dialog {  margin-top: 1em; }  @media (min-width: 30em) {    .modal-dialog {      margin-top: 3em; } }  .modal-open .modal-dialog {    -webkit-animation: modalin 400ms ease-in;            animation: modalin 400ms ease-in; }.modal-content {  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15);  border-radius: 1px;  background-color: #fff;  border-bottom: 8px solid #f39220; }.modal-body {  padding: 1em 1.5em;  text-align: center; }  @media (min-width: 30em) {    .modal-body {      padding: 2em 2.5em; } }  .modal-body h1 {    color: #111;    margin-bottom: 0;    line-height: 1.1; }  .modal-body h3 {    color: #111;    margin-bottom: 0.5em;    line-height: 1.1; }  .modal-body p {    color: #888;    text-transform: uppercase; }  .modal-body a {    color: #888;    text-transform: none; }    .modal-body a:hover {      color: #f39220; }.close {  color: #333;  font-size: 2em;  position: absolute;  right: 0.5em;  top: 0.5em; }#pnlLogin {  margin-top: 1em; }.forgot-password {  margin-top: 1.7em;  padding-top: 1.7em;  border-top: 1px solid #ccc; }#myPasswordForm p {  font-size: 1.05469em;  text-transform: none;  margin-bottom: 1.25em;  line-height: 1.4; }/* -----------------------------------------  12.0. Content----------------------------------------- */.hero.inner-hero {  height: auto; }  .previewFrame .hero.inner-hero {    height: 700px; }.hero.med-hero {  height: auto; }  .previewFrame .hero.med-hero {    height: 600px; }.hero.short-hero {  height: auto; }  .previewFrame .hero.short-hero {    height: 400px; }.hero.full {  height: 100%; }.hero.inner-hero .hero-content, .hero.med-hero .hero-content, .hero.short-hero .hero-content {  padding: 12em 0 8em; }  @media (min-width: 48em) {    .hero.inner-hero .hero-content, .hero.med-hero .hero-content, .hero.short-hero .hero-content {      padding: 12em 0 8em; } }  @media (min-width: 75em) {    .hero.inner-hero .hero-content, .hero.med-hero .hero-content, .hero.short-hero .hero-content {      padding: 14em 0 10em; } }.hero .hero-title h1 {  font-size: 2.7061em;  line-height: 1;  margin: 0;  margin-bottom: 0.1em;  padding-top: 0; }  @media (min-width: 30em) {    .hero .hero-title h1 {      font-size: 3.04436em; } }  @media (min-width: 48em) {    .hero .hero-title h1 {      font-size: 3.42491em; } }  @media (min-width: 66.25em) {    .hero .hero-title h1 {      font-size: 4.87648em; } }.hero .hero-title.small-hero h1 {  font-size: 2.7061em; }  @media (min-width: 30em) {    .hero .hero-title.small-hero h1 {      font-size: 3.04436em; } }  @media (min-width: 48em) {    .hero .hero-title.small-hero h1 {      font-size: 4.33465em; } }  @media (min-width: 66.25em) {    .hero .hero-title.small-hero h1 {      font-size: 4.87648em; } }.extras__hero .hero-content .button {  font-size: 14px;  margin: 0.5em 0.2em 0.1em; }  @media (min-width: 30em) {    .extras__hero .hero-content .button {      margin: 1.5em 0.2em 1em;      font-size: 16px; } }@media (min-width: 30em) {  .inner-intro {    text-align: center; } }.inner-intro .divider-center:after {  margin: 0.4em 0; }  @media (min-width: 30em) {    .inner-intro .divider-center:after {      margin: 0.4em auto; } }.inner-intro h2 {  padding-top: 0; }.section-title {  text-align: center;  margin-bottom: 2em; }  .section-title h6 {    font-family: brandon-grotesque, sans-serif; font-weight: 400;    text-transform: none; }.split-section {  padding: 0; }  .split-section:before,  .split-section:after {    content: "";    display: table; }  .split-section:after {    clear: both; }  @media (min-width: 50em) {    .split-section {      border-bottom: 1px solid #ccc; } }  @media (min-width: 57.5em) {    .split-section {      border-bottom: none; } }.split-image {  padding-bottom: 75%;  height: 0;  z-index: 1;  background-size: cover;  background-repeat: no-repeat;  background-color: #fff;  background-position: center; }  @media (min-width: 43.75em) {    .split-image {      padding-bottom: 65%; } }  @media (min-width: 50em) {    .split-image {      background-position: center;      padding-bottom: 65%; }      .split-image.split-image__right {        width: 33.33333%;        float: right;        margin-right: 0; }      .split-image.split-image__left {        width: 33.33333%;        float: left; } }  @media (min-width: 57.5em) {    .split-image.split-image__right {      width: 50%;      float: right;      margin-right: 0; }    .split-image.split-image__left {      width: 50%;      float: left; } }  @media (min-width: 75em) {    .split-image {      padding-bottom: 50%; } }  @media (min-width: 87.5em) {    .split-image {      padding-bottom: 48%; } }.split-copy {  position: relative;  z-index: 5; }  .split-copy.blue {    background: url("/smarter-web-company-co-uk/_img/images/white-dot.png") repeat #f39220; }  @media (min-width: 50em) {    .split-copy {      padding-bottom: 65%;      height: 0; }      .split-copy.split-copy__right {        width: 66.66667%;        float: right;        margin-right: 0; }      .split-copy.split-copy__left {        width: 66.66667%;        float: left; }      .split-copy__inner {        position: absolute;        top: 0;        bottom: 0;        left: 0;        right: 0;        height: 100%; } }  @media (min-width: 57.5em) {    .split-copy.split-copy__right {      width: 50%;      float: right;      margin-right: 0; }    .split-copy.split-copy__left {      width: 50%;      float: left; } }  @media (min-width: 75em) {    .split-copy {      padding-bottom: 50%; } }  @media (min-width: 87.5em) {    .split-copy {      padding-bottom: 48%; } }  .split-copy .content-wrap {    max-width: 85%;    margin: auto;    position: relative;    padding: 2em 0; }    @media (min-width: 50em) {      .split-copy .content-wrap {        top: 50%;        -webkit-transform: translateY(-50%);            -ms-transform: translateY(-50%);                transform: translateY(-50%); } }    @media (min-width: 57.5em) {      .split-copy .content-wrap {        max-width: 75%; } }  .split-copy p {    font-size: 1.05469em; }    @media (min-width: 93.75em) {      .split-copy p {        font-size: 1.18652em; } }.split-copy:after, .split-copy__cell:after, .reverse-sec .split-copy__cell:after {  border: 25px transparent solid;  border-bottom-color: #fff;  position: absolute;  top: -50px;  left: 50%;  display: block;  content: "";  -webkit-transform: translateX(-50%);      -ms-transform: translateX(-50%);          transform: translateX(-50%); }  @media (min-width: 50em) {    .split-copy:after, .split-copy__cell:after, .reverse-sec .split-copy__cell:after {      -webkit-transform: none;          -ms-transform: none;              transform: none;      border-bottom-color: transparent;      border-left-color: #fff;      left: auto;      top: 50%;      right: -50px;      -webkit-transform: translateY(-50%);          -ms-transform: translateY(-50%);              transform: translateY(-50%); } }@media (min-width: 50em) {  .split-copy__right:after, .split-copy__cell:after {    -webkit-transform: none;        -ms-transform: none;            transform: none;    border-color: transparent;    border-right-color: #fff;    right: auto;    top: 50%;    left: -50px;    -webkit-transform: translateY(-50%);        -ms-transform: translateY(-50%);            transform: translateY(-50%); } }.split-copy__left.blue:after, .split-copy__cell.blue:after {  border-bottom-color: #f39220; }  @media (min-width: 50em) {    .split-copy__left.blue:after, .split-copy__cell.blue:after {      border-color: transparent;      border-left-color: #f39220; } }.split-copy__right.blue:after, .split-copy__cell.blue:after {  border-bottom-color: #f39220; }  @media (min-width: 50em) {    .split-copy__right.blue:after, .split-copy__cell.blue:after {      border-bottom-color: transparent;      border-right-color: #f39220; } }.split-copy__cell.grey:after, .split-copy__right.grey:after {  border-bottom-color: #e9e9e9; }  @media (min-width: 50em) {    .split-copy__cell.grey:after, .split-copy__right.grey:after {      border-bottom-color: transparent;      border-right-color: #e9e9e9; } }.split-copy__left.grey:after {  border-bottom-color: #e9e9e9; }  @media (min-width: 50em) {    .split-copy__left.grey:after {      border-color: transparent;      border-left-color: #e9e9e9; } }.split-copy__cell.black:after, .split-copy__right.black:after {  border-bottom-color: #141414; }  @media (min-width: 50em) {    .split-copy__cell.black:after, .split-copy__right.black:after {      border-bottom-color: transparent;      border-right-color: #141414; } }.split-copy__left.black:after {  border-bottom-color: #141414; }  @media (min-width: 50em) {    .split-copy__left.black:after {      border-color: transparent;      border-left-color: #141414; } }@media (min-width: 50em) {  .split-copy__cell, .split-image__cell {    padding: 4.5em;    display: table-cell;    width: 50%; } }.split-copy__cell p, .split-image__cell p {  font-size: 1.05469em; }.split-image__cell {  height: 20em; }  @media (min-width: 50em) {    .split-image__cell {      height: auto; } }.split-copy__cell {  padding: 3em;  position: relative; }  .split-copy__cell .content-wrap {    display: inline-block; }  @media (min-width: 62.5em) {    .split-copy__cell {      padding: 5.5em; } }@media (min-width: 50em) {  .reverse-sec .split-image__cell {    left: 50%;    position: relative; } }@media (min-width: 50em) {  .reverse-sec .split-copy__cell {    right: 50%;    position: relative; } }.main-content {  border-bottom: 1px solid #ccc; }  .main-content .disc {    padding-left: 1.5em;    margin: 2em 0; }    .main-content .disc li {      font-size: 1.18652em; }.narrow-content-wrap {  max-width: 60em;  margin: auto;  width: 91%; }  .narrow-content-wrap:before,  .narrow-content-wrap:after {    content: "";    display: table; }  .narrow-content-wrap:after {    clear: both; }.main-content-wrap {  max-width: 72em;  margin: auto;  width: 92%; }  .main-content-wrap:before,  .main-content-wrap:after {    content: "";    display: table; }  .main-content-wrap:after {    clear: both; }/*************************************************************************************About History*************************************************************************************/.history-sec .split-copy__cell, .history-sec .split-image__cell {  display: block;  width: 100%; }  @media (min-width: 50em) {    .history-sec .split-copy__cell, .history-sec .split-image__cell {      left: auto;      right: auto; } }  @media (min-width: 62.5em) {    .history-sec .split-copy__cell, .history-sec .split-image__cell {      padding: 3.5em;      display: table-cell;      width: 50%; } }@media (min-width: 40em) {  .history-sec .split-image__cell {    height: 25em; } }@media (min-width: 62.5em) {  .history-sec .split-image__cell {    height: auto;    left: 50%; } }@media (min-width: 62.5em) {  .history-sec .split-copy__cell {    padding: 3.5em 2.25em;    right: 50%; } }@media (min-width: 78.125em) {  .history-sec .split-copy__cell {    padding: 5.5em; } }@media (min-width: 93.75em) {  .history-sec .split-copy__cell {    padding: 7em 5.5em; } }@media (min-width: 62.5em) {  .about-value-sec .split-copy__cell {    padding: 3.5em 2.25em; } }@media (min-width: 78.125em) {  .about-value-sec .split-copy__cell {    padding: 5.5em; } }@media (min-width: 93.75em) {  .about-value-sec .split-copy__cell {    padding: 7em 5.5em; } }.company-link {  margin-top: 1.5em;  display: block; }  .company-link img {    display: inline-block;    vertical-align: middle; }  .company-link::after {    content: "";    background-image: url("/smarter-web-company-co-uk/_img/images/svg/chevron.svg");    background-size: contain;    background-position: center;    background-repeat: no-repeat;    height: 1em;    width: 1em;    display: inline-block;    vertical-align: middle;    margin-left: 1em;    position: relative;    top: 2px;    -webkit-transition: -webkit-transform 300ms cubic-bezier(0.17, 0.67, 0.52, 1.56);            transition: transform 300ms cubic-bezier(0.17, 0.67, 0.52, 1.56); }  .company-link:hover::after {    -webkit-transform: translateX(0.5em);        -ms-transform: translateX(0.5em);            transform: translateX(0.5em); }/*************************************************************************************TEAM LAYOUT*************************************************************************************/.team {  padding: 0; }.team-members:before,.team-members:after {  content: "";  display: table; }.team-members:after {  clear: both; }.team-item {  float: left;  width: 50%;  position: relative;  line-height: 0;  height: 0;  padding-bottom: 72.22222222222223%;  background-size: cover;  background-repeat: no-repeat;  background-position: center; }  @media (min-width: 57.5em) {    .team-item {      width: 25%;      padding-bottom: 36.111111111111114%; } }  .team-item:last-child {    background-color: #003143; }    .team-item:last-child svg {      display: none; }    .team-item:last-child h5, .team-item:last-child p {      opacity: 1;      -webkit-transform: none;          -ms-transform: none;              transform: none;      -webkit-transition: none;              transition: none; }    .team-item:last-child .hover-content {      background: transparent;      opacity: 1; }  .team-item img {    line-height: 0; }  .team-item .hover-content {    position: absolute;    top: 0;    right: 0;    left: 0;    bottom: 0;    background-color: rgba(0, 0, 0, 0.8);    text-align: center;    -webkit-transition: opacity 550ms ease;            transition: opacity 550ms ease;    opacity: 0;    padding: 0;    margin: 0; }  .team-item:hover .hover-content {    opacity: 1; }  .team-item:hover .team-border {    stroke-dashoffset: 0;    stroke-width: 2px; }  .team-item:hover h5, .team-item:hover p {    -webkit-transform: translateY(0%);        -ms-transform: translateY(0%);            transform: translateY(0%);    opacity: 1; }.team-border {  fill: transparent;  stroke-dasharray: 2100;  stroke: rgba(255, 255, 255, 0.6);  stroke-dashoffset: 2100;  -webkit-transition: stroke-dashoffset 750ms linear 100ms, stroke-width 750ms linear 100ms;          transition: stroke-dashoffset 750ms linear 100ms, stroke-width 750ms linear 100ms;  stroke-width: 8px; }.team-item__content {  text-align: center;  padding: 1em;  position: absolute;  top: 50%;  left: 50%;  width: 90%;  -webkit-transform: translate(-50%, -50%);      -ms-transform: translate(-50%, -50%);          transform: translate(-50%, -50%); }  .team-item__content h5, .team-item__content p {    color: #fff;    opacity: 0; }  .team-item__content h5 {    -webkit-transform: translateY(-50%);        -ms-transform: translateY(-50%);            transform: translateY(-50%);    -webkit-transition: -webkit-transform 250ms ease, opacity 400ms ease;            transition: transform 250ms ease, opacity 400ms ease;    -webkit-transition-delay: 100ms;            transition-delay: 100ms;    font-size: 1.33484em; }    @media (min-width: 30em) {      .team-item__content h5 {        font-size: 1.68941em; } }  .team-item__content p {    -webkit-transform: translateY(50%);        -ms-transform: translateY(50%);            transform: translateY(50%);    -webkit-transition: -webkit-transform 350ms ease, opacity 500ms ease;            transition: transform 350ms ease, opacity 500ms ease;    -webkit-transition-delay: 300ms;            transition-delay: 300ms;    line-height: 1.3; }/***************************************************************************Package Pages***************************************************************************/.hero-title.small-hero h1 {  font-size: 2.40542em; }  @media (min-width: 30em) {    .hero-title.small-hero h1 {      font-size: 3.04436em; } }  @media (min-width: 48em) {    .hero-title.small-hero h1 {      font-size: 3.42491em; } }  @media (min-width: 66.25em) {    .hero-title.small-hero h1 {      font-size: 4.33465em; } }.hero.inner-hero.package-hero {  height: auto; }  @media (min-width: 62.5em) {    .hero.inner-hero.package-hero {      height: auto; } }  .previewFrame .hero.inner-hero.package-hero {    height: 700px;    min-height: 0; }.package-hero .hero-content {  position: relative;  left: auto;  top: auto;  -webkit-transform: none;      -ms-transform: none;          transform: none;  padding: 12em 0 8em; }  @media (min-width: 48em) {    .package-hero .hero-content {      padding: 12em 0 8em; } }  @media (min-width: 75em) {    .package-hero .hero-content {      padding: 14em 0 10em; } }  .package-hero .hero-content h6.divider {    -webkit-animation-delay: .4s;            animation-delay: .4s; }    .package-hero .hero-content h6.divider:after {      width: 0;      -webkit-animation: expand 400ms ease-in 0.8s both;              animation: expand 400ms ease-in 0.8s both; }  .package-hero .hero-content .package-details h6 {    -webkit-animation-delay: 1.4s;            animation-delay: 1.4s; }.package-hero h6 {  font-size: 1.05469em; }  @media (min-width: 30em) {    .package-hero h6 {      font-size: 1.33484em; } }.package-hero .button.white-button, .package-hero .solid-button.blue-button {  font-size: 14px;  margin: 0.5em 0.2em 0.1em; }  @media (min-width: 30em) {    .package-hero .button.white-button, .package-hero .solid-button.blue-button {      margin: 1.5em 0.2em 1em;      font-size: 16px; } }.package-details h2, .package-details h6, .package-details .button, .package-details .solid-button {  -webkit-animation: textin 550ms ease-in both;          animation: textin 550ms ease-in both; }.package-details h2 {  -webkit-animation-delay: 1s;          animation-delay: 1s;  margin-bottom: 0;  color: #fff;  font-family: brandon-grotesque, sans-serif; font-weight: 700;  font-size: 2.13815em; }  @media (min-width: 30em) {    .package-details h2 {      font-size: 2.40542em; } }  @media (min-width: 48em) {    .package-details h2 {      font-size: 2.7061em; } }  @media (min-width: 66.25em) {    .package-details h2 {      font-size: 3.42491em; } }.package-details .button:nth-child(1), .package-details .solid-button:nth-child(1) {  -webkit-animation-delay: 1.2s;          animation-delay: 1.2s; }.package-details .button:nth-child(2), .package-details .solid-button:nth-child(2) {  -webkit-animation-delay: 1.25s;          animation-delay: 1.25s; }.package-details .button-text {  padding: 0.65em 1em; }  @media (min-width: 30em) {    .package-details .button-text {      padding: 1em 2em; } }.package-price h2, .package-price h6 {  padding-top: 0; }.package-hero h6.divider:after {  margin: 1.1em auto 1em; }.package-examples p {margin:  0px; padding: 0px;}.package-examples .project-item:nth-child(1), .package-examples .project-item:nth-child(2), .package-examples .project-item:nth-child(3), .package-examples .project-item:nth-child(4) {  width: 100%; }  .package-examples .project-item:nth-child(1) .project-item__inner, .package-examples .project-item:nth-child(2) .project-item__inner, .package-examples .project-item:nth-child(3) .project-item__inner, .package-examples .project-item:nth-child(4) .project-item__inner {    padding-top: 100%; }  @media (min-width: 30em) {    .package-examples .project-item:nth-child(1), .package-examples .project-item:nth-child(2), .package-examples .project-item:nth-child(3), .package-examples .project-item:nth-child(4) {      width: 50%; } }  @media (min-width: 60em) {    .package-examples .project-item:nth-child(1), .package-examples .project-item:nth-child(2), .package-examples .project-item:nth-child(3), .package-examples .project-item:nth-child(4) {      width: 50%; } }  @media (min-width: 78.125em) {    .package-examples .project-item:nth-child(1), .package-examples .project-item:nth-child(2), .package-examples .project-item:nth-child(3), .package-examples .project-item:nth-child(4) {      width: 25%;      font-size: 14px; } }  @media (min-width: 93.75em) {    .package-examples .project-item:nth-child(1), .package-examples .project-item:nth-child(2), .package-examples .project-item:nth-child(3), .package-examples .project-item:nth-child(4) {      font-size: 16px; } }  @media (min-width: 30em) {    .package-examples .project-item:nth-child(1) p, .package-examples .project-item:nth-child(2) p, .package-examples .project-item:nth-child(3) p, .package-examples .project-item:nth-child(4) p {      display: none; } }  @media (min-width: 40em) {    .package-examples .project-item:nth-child(1) p, .package-examples .project-item:nth-child(2) p, .package-examples .project-item:nth-child(3) p, .package-examples .project-item:nth-child(4) p {      display: block; } }  @media (min-width: 60em) {    .package-examples .project-item:nth-child(1) p, .package-examples .project-item:nth-child(2) p, .package-examples .project-item:nth-child(3) p, .package-examples .project-item:nth-child(4) p {      display: block; } }.feature-list {  text-align: center; }  .feature-list:before,  .feature-list:after {    content: "";    display: table; }  .feature-list:after {    clear: both; }  @media (min-width: 40em) {    .feature-list {      text-align: left; } }  .feature-list li {    margin: 3em 0;    position: relative; }    @media (min-width: 40em) {      .feature-list li {        padding-left: 6em; } }    @media (min-width: 48em) {      .feature-list li {        float: left;        width: 50%;        padding-right: 2em;        margin: 2em 0; } }    .feature-list li:before {      content: "";      width: 3em;      height: 3em;      display: inline-block;      margin-bottom: 0.5em;      background-position: center top;      background-repeat: no-repeat;      background-size: contain; }      @media (min-width: 40em) {        .feature-list li:before {          position: absolute;          left: 0.5em;          top: 0;          margin-bottom: 0; } }  .feature-list h6 {    margin-bottom: 0.25em;    font-family: brandon-grotesque, sans-serif; font-weight: 700;    padding-top: 0; }  .feature-list p {    font-size: 1.05469em;    margin-bottom: 0;    line-height: 1.4; }  @media (min-width: 40em) {    .feature-list.no-text li::before {      display: inline-block;      position: relative;      margin-left: -6em;      margin-right: 2em;      vertical-align: middle; }    .feature-list.no-text h6 {      display: inline-block;      vertical-align: middle;      margin-bottom: 0; } }.buy-buttons {  text-align: center;  padding: 9em 0; }  .buy-buttons h4 {    font-family: brandon-grotesque, sans-serif; font-weight: 500; }/*//////////////////////////////////////Logo Gallery/////////////////////////////////////*/.logo-gallery {  padding: 0; }  .logo-gallery .project-item {    width: 100%; }    @media (min-width: 30em) {      .logo-gallery .project-item {        width: 50%; } }    @media (min-width: 60em) {      .logo-gallery .project-item {        width: 25%;        font-size: 14px; }        .logo-gallery .project-item:nth-child(4), .logo-gallery .project-item:nth-child(5), .logo-gallery .project-item:nth-child(6) {          width: 33.333%; } }    @media (min-width: 93.75em) {      .logo-gallery .project-item {        font-size: 16px; } }    .logo-gallery .project-item:hover .hover-content {      opacity: 1;      -webkit-transition: opacity 700ms ease;              transition: opacity 700ms ease; }  .logo-gallery .project-item__inner {    padding-top: 100%;    text-align: center; }  .logo-gallery .button {    font-size: 10px; }/*//////////////////////////////////////SEO/////////////////////////////////////*/.seo-reporting {  text-align: center; }  .seo-reporting img {    margin-bottom: 2em; }@media (min-width: 75em) {  .split-section--seo .split-copy__cell {    padding: 8em 5.5em; } }.table-section {  padding: 3.5em 0.5em; }  .table-section table {    border-collapse: collapse;    margin: auto;    font-size: 13px;    width: 100%; }    @media (min-width: 40em) {      .table-section table {        table-layout: fixed;        font-size: 16px; } }  .table-section th {    font-family: brandon-grotesque, sans-serif; font-weight: 700;    text-align: center;    font-size: 1.33484em;    text-transform: uppercase;    padding: 0.5em;    border: 1px solid #f39220;    line-height: 1;    background-color: #f39220;    background-image: -webkit-linear-gradient(#f39220, #017ba9);    background-image: linear-gradient(#f39220, #017ba9);    color: #fff; }    @media (min-width: 40em) {      .table-section th {        font-family: brandon-grotesque, sans-serif; font-weight: 900;        padding: 1.3em 2em 1.2em; } }  .table-section tr .pro-price {    font-size: 1.33484em;    font-family: brandon-grotesque, sans-serif; font-weight: 700; }  .table-section td {    padding: 0.5em;    font-size: 1.05469em;    font-family: brandon-grotesque, sans-serif; font-weight: 400;    background-color: #fff;    text-align: center;    border: 1px solid #ddd;    line-height: 1; }    @media (min-width: 40em) {      .table-section td {        padding: 1.2em 2em; } }  .table-section svg {    color: #f39220;    height: 1.5em;    width: 1.5em; }    .table-section svg.tick-icon {      fill: #f39220; }    .table-section svg.cross-icon {      fill: #444; }.seo-prices th:first-child {  border: none;  background-color: transparent;  background-image: none; }.seo-prices tr td:nth-child(1) {  text-align: left;  font-family: brandon-grotesque, sans-serif; font-weight: 700;  font-size: 1.18652em;  background-color: #fff;  border-color: #ccc; }.seo-prices .button {  margin: 0; }  .seo-prices .button .button-text {    font-size: 0.83333em;    padding: 0.5em; }    @media (min-width: 25em) {      .seo-prices .button .button-text {        padding: 0.75em 1.5em; } }.email-table {  text-align: center;  margin-top: 3em; }.graph-line {  width: 100%;  fill: transparent;  stroke: rgba(255, 255, 255, 0.2);  stroke-width: 8;  stroke-dasharray: 2600px;  stroke-dashoffset: 2600px;  -webkit-transition: stroke-dashoffset 2000ms linear;          transition: stroke-dashoffset 2000ms linear; }.seo-reporting {  position: relative;  padding-left: 0;  padding-right: 0; }  .seo-reporting svg {    position: absolute;    top: 3em;    left: 0;    width: 100%;    z-index: 1; }  .seo-reporting.inviewport .graph-line {    stroke-dashoffset: 0; }  .seo-reporting .narrow-content-wrap {    z-index: 5;    position: relative; }/*//////////////////////////////////////CMS/////////////////////////////////////*/#s485133 .cms .button {  opacity: 0; }/*//////////////////////////////////////Design Process/////////////////////////////////////*/#s485134 {  counter-reset: process-section; }  #s485134 .process-section {    counter-increment: process-section; }.process-section {  border-bottom: 1px solid #d4d4d4; }  @media (min-width: 50em) {    .process-section .split-image.split-image__right {      width: 50%;      float: right;      margin-right: 0; }    .process-section .split-image.split-image__left {      width: 50%;      float: left; } }  @media (min-width: 50em) {    .process-section .split-copy.split-copy__right {      width: 50%;      float: right;      margin-right: 0; }    .process-section .split-copy.split-copy__left {      width: 50%;      float: left; } }  .process-section .process-icon {    height: 2.4em;    width: 2.4em;    fill: #222;    float: left;    margin-right: 0.75em;    position: relative;    z-index: 2; }  .process-section .divider {    position: relative;    z-index: 2; }  .process-section h3 {    padding-top: 0; }  .process-section.process-support .process-icon {    height: 2.8em;    width: 2.8em; }  .process-section .content-wrap {    padding: 4em 0.5em; }    .process-section .content-wrap:after {      content: "0" counter(process-section);      font-size: 10em;      opacity: 0.08;      color: #9b9b9b;      font-family: brandon-grotesque, sans-serif; font-weight: 900;      position: absolute;      top: -7%;      left: -7%;      z-index: 1;      letter-spacing: -5px; }      @media (min-width: 62.5em) {        .process-section .content-wrap:after {          font-size: 12em;          top: -10%;          left: -10%; } }    .previewFrame .process-section .content-wrap:after {      display: none; }.process-signup .split-image {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/process-signup-img.jpg"); }.process-research .split-image {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/process-research-img.jpg"); }.process-design .split-image {  background-image: url("/smarter-web-company-co-uk/_img/images/bespoke-design.jpg"); }.process-build .split-image {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/process-build-img.jpg"); }.process-launch .split-image {  background-image: url("/smarter-web-company-co-uk/_img/images/case-studies/somerset-house-cs.jpg"); }.process-support .split-image {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/cms-edit.jpg"); }/*//////////////////////////////////////Contact Page/////////////////////////////////////*/#s485138 .split-copy:after {  display: none; }.contact-info, .career-info {  text-align: center; }  @media (min-width: 50em) {    .contact-info, .career-info {      text-align: left; } }  @media (min-width: 50em) {    .contact-info .divider-center:after, .career-info .divider-center:after {      margin: 0.4em 0; } }.contact-info .contact-icon {  position: relative; }  @media (min-width: 50em) {    .contact-info .contact-icon {      margin-left: 2em; } }  .contact-info .contact-icon:before {    height: 1.75em;    width: 1.75em;    display: block;    content: "";    margin: auto;    margin-bottom: 0.25em;    background-size: contain;    background-repeat: no-repeat; }    @media (min-width: 50em) {      .contact-info .contact-icon:before {        height: 1.5em;        width: 1.5em;        position: absolute;        left: -2em;        top: 2px; } }.contact-info .address:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/address-blue-solid.svg"); }.contact-info .phone:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/phone-blue-solid.svg"); }.contact-info .email:before {  top: 0.3em;  background-image: url("/smarter-web-company-co-uk/_img/images/svg/mail-blue-solid.svg"); }.contact-info .whatsapp-button:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/whatsapp.svg"); }#contact-map {  height: 50%;  height: 50vh;  width: 100%;  border-top: 2px solid #ccc;  border-bottom: 2px solid #ccc; }  @media (min-width: 50em) {    #contact-map {      height: 100%; } }.gm-style-iw * {  display: block;  width: 100%; }.gm-style-iw h4, .gm-style-iw p {  margin: 0;  padding: 0; }.gm-style-iw a {  color: #4272db; }.career-info .content-wrap {  padding: 5.5em 0; }.contact-wrap .contact-info {  padding: 5.5em 0; }.custom-form {  text-align: center;  padding: 4em 0; }  @media (min-width: 48em) {    .custom-form {      padding: 9em 0; } }  .custom-form .contact-form__wrap {    padding: 0 1em; }/* CUSTOM DEVELOPMENT */.custom-project__logo {  line-height: 0;  box-shadow: 0 6px 15px 0 rgba(0, 0, 0, 0.15);  display: inline-block;  margin-bottom: 2em; }  @media (min-width: 60em) {    .custom-project__logo {      width: 31.42857%;      float: right;      margin-right: 0; } }.custom-project__content {  font-size: 13px; }  @media (min-width: 25em) {    .custom-project__content {      font-size: 14px; } }  @media (min-width: 60em) {    .custom-project__content {      width: 65.71429%;      float: left;      margin-right: 2.85714%;      font-size: 16px; } }.custom-dev__carousel {  padding-top: 3em; }  .custom-dev__carousel .owl-stage-outer {    box-shadow: 0 10px 35px 0 rgba(0, 0, 0, 0.3), 0 4px 12px 0 rgba(0, 0, 0, 0.3); }  .custom-dev__carousel .owl-prev, .custom-dev__carousel .owl-next {    position: absolute;    top: 50%;    -webkit-transform: translateY(-50%);        -ms-transform: translateY(-50%);            transform: translateY(-50%);    height: 3em;    width: 2em;    opacity: 0.4;    background-size: contain;    background-repeat: no-repeat;    background-position: 50% 50%; }    @media (min-width: 50em) {      .custom-dev__carousel .owl-prev, .custom-dev__carousel .owl-next {        height: 3em; } }    @media (min-width: 66.25em) {      .custom-dev__carousel .owl-prev, .custom-dev__carousel .owl-next {        height: 4em; } }    .custom-dev__carousel .owl-prev:hover, .custom-dev__carousel .owl-next:hover {      opacity: 0.85; }  .custom-dev__carousel .owl-prev {    left: -2em;    top: 50%;    background-image: url("/smarter-web-company-co-uk/_img/images/svg/left-black.svg"); }    @media (min-width: 50em) {      .custom-dev__carousel .owl-prev {        left: -2.5em; } }    @media (min-width: 66.25em) {      .custom-dev__carousel .owl-prev {        left: -3.5em; } }  .custom-dev__carousel .owl-next {    right: -2em;    top: 50%;    background-image: url("/smarter-web-company-co-uk/_img/images/svg/right-black.svg"); }    @media (min-width: 50em) {      .custom-dev__carousel .owl-next {        right: -2.5em; } }    @media (min-width: 66.25em) {      .custom-dev__carousel .owl-next {        right: -3.5em; } }  .black .custom-dev__carousel .owl-prev {    background-image: url("/smarter-web-company-co-uk/_img/images/svg/left-white.svg"); }  .black .custom-dev__carousel .owl-next {    background-image: url("/smarter-web-company-co-uk/_img/images/svg/right-white.svg"); }  .custom-dev__carousel .owl-dots .owl-dot span {    background-color: #999; }    .custom-dev__carousel .owl-dots .owl-dot span:hover {      background-color: #ccc; }  .custom-dev__carousel .owl-dot.active span {    background-color: #f39220; }    .custom-dev__carousel .owl-dot.active span:hover {      background-color: #f39220; }.tim-project {  border-bottom: 3px solid #F8931D; }  .tim-project .divider::after {    background-color: #F8931D; }  .tim-project .owl-dot.active span {    background-color: #F8931D; }    .tim-project .owl-dot.active span:hover {      background-color: #F8931D; }.wastematch-project {  border-bottom: 3px solid #106E31; }  .wastematch-project .divider::after {    background-color: #106E31; }  .wastematch-project .owl-dot.active span {    background-color: #106E31; }    .wastematch-project .owl-dot.active span:hover {      background-color: #106E31; }/* ---------------------------------------------- *  Partial: buttons  This is a work-in-progress. Please deploy your own method or use my exaple below. \* ---------------------------------------------- */.button {  margin: 1em 0.2em;  display: inline-block; }  .button .button-text {    display: inline-block;    font-family: brandon-grotesque, sans-serif; font-weight: 700;    font-size: 1.18652em;    color: #111;    text-transform: uppercase;    line-height: 1;    padding: 1em 2em;    -webkit-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1);            transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1);    text-align: center; }.border-button .button-text {  background: transparent;  border: 3px solid #111; }.border-button.white-button .button-text {  border-color: #fff;  color: #fff; }.border-button.white-button a:hover .button-text {  background-color: #fff;  color: #111; }.border-button.white-button a:hover i {  background-color: #fff; }  .border-button.white-button a:hover i svg {    fill: #111; }.border-button.arrow-button {  display: inline-block;  font-size: 15px; }  .border-button.arrow-button .button-text {    position: relative;    height: 3.2em;    float: left; }  .border-button.arrow-button.white-button i {    border-color: #fff; }    .border-button.arrow-button.white-button i svg {      fill: #fff; }  .border-button.arrow-button i {    display: inline-block;    border: 3px solid #111;    background: transparent;    border-left: none;    height: 3.2em;    width: 3.2em;    float: right;    font-size: 1.18652em;    -webkit-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1);            transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1); }    .border-button.arrow-button i svg {      fill: #111;      height: 1.2em;      width: 1.2em;      position: relative;      top: 50%;      -webkit-transform: translateY(-50%);          -ms-transform: translateY(-50%);              transform: translateY(-50%); }.border-button a:hover .button-text {  background-color: #111;  color: #fff; }.border-button a:hover i {  background-color: #111; }  .border-button a:hover i svg {    fill: #fff; }.solid-button .button-text {  background: #333;  border: 3px solid #333;  color: #fff; }.solid-button:hover .button-text {  background: #111;  border-color: #111; }.solid-button.white-button .button-text {  background-color: #fff;  color: #111;  border-color: #fff; }  .solid-button.white-button .button-text:hover {    background-color: #f39220;    border-color: #f39220;    color: #fff; }.solid-button.blue-button .button-text {  background-color: #f39220;  color: #fff;  border-color: #f39220; }  .solid-button.blue-button .button-text:hover {    background-color: #d87705;    border-color: #d87705;    color: #fff; }/* -----------------------------------------  13.0. Footer----------------------------------------- */.sm-footer {  padding: 3em 1em; }.footer {  padding: 3em 1em 24em;  background-image: url("/smarter-web-company-co-uk/_img/images/footer-bg.jpg");  background-color: #fdfdfd;  background-position: bottom left;  background-repeat: no-repeat; }  @media (min-width: 30em) {    .footer {      padding: 5em 1em 28em; } }  @media (min-width: 50em) {    .footer {      background-position: bottom center; } }  @media (min-width: 93.75em) {    .footer {      background-size: 100% auto; } }  .footer .footer-top {    text-align: center; }  .footer .button.arrow-button {    font-size: 14px;    margin: 1em auto 0; }    @media (min-width: 20em) {      .footer .button.arrow-button {        font-size: 16px; } }    @media (min-width: 60em) {      .footer .button.arrow-button {        margin: 1em auto; } }  .no-touchevents.cssanimations.csstransitions .footer h2 {    -webkit-transform: scale(0.5);        -ms-transform: scale(0.5);            transform: scale(0.5);    opacity: 0; }  .no-touchevents.cssanimations.csstransitions .footer.inviewport h2 {    -webkit-animation: fadein 500ms ease-in forwards;            animation: fadein 500ms ease-in forwards; }.footer-info {  max-width: 100em;  width: 100%;  margin: 2.5em auto 1.95em;  padding-bottom: 1.95em;  border-bottom: 1px solid #ddd;  text-align: center; }  .footer-info:before,  .footer-info:after {    content: "";    display: table; }  .footer-info:after {    clear: both; }  @media (min-width: 20em) {    .footer-info {      padding: 0 1.5em 1.95em; } }  @media (min-width: 66.25em) {    .footer-info {      padding: 0 2.5em 1.95em; } }  .footer-info p {    font-size: 1.05469em;    font-family: brandon-grotesque, sans-serif; font-weight: 700;    margin-bottom: 0; }.footer-contact p {  font-size: 1.05469em;  line-height: 1; }.footer-contact a {  word-wrap: break-word; }@media (min-width: 30em) {  .footer-contact p {    font-size: 1.33484em; } }@media (min-width: 60em) {  .footer-contact {    width: 32.82443%;    float: left;    margin-right: 0.76336%;    text-align: left; }    .footer-contact p {      font-size: 1.18652em; } }.footer-social {  text-align: center;  margin: 1.5em 0; }  @media (min-width: 60em) {    .footer-social {      margin: 0;      width: 31.42857%;      float: left;      margin-right: 2.85714%; } }.footer-address p {  padding-top: 0; }@media (min-width: 60em) {  .footer-address {    text-align: right;    width: 31.42857%;    float: right;    margin-right: 0; } }@-webkit-keyframes spring {  25% {    -webkit-transform: scale(0.8);            transform: scale(0.8); }  50% {    -webkit-transform: scale(1.1);            transform: scale(1.1); }  75% {    -webkit-transform: scale(0.9);            transform: scale(0.9); }  85% {    -webkit-transform: scale(1.03);            transform: scale(1.03); }  95% {    -webkit-transform: scale(0.95);            transform: scale(0.95); }  100% {    -webkit-transform: scale(1);            transform: scale(1); } }@keyframes spring {  25% {    -webkit-transform: scale(0.8);            transform: scale(0.8); }  50% {    -webkit-transform: scale(1.1);            transform: scale(1.1); }  75% {    -webkit-transform: scale(0.9);            transform: scale(0.9); }  85% {    -webkit-transform: scale(1.03);            transform: scale(1.03); }  95% {    -webkit-transform: scale(0.95);            transform: scale(0.95); }  100% {    -webkit-transform: scale(1);            transform: scale(1); } }.social-icon {  height: 3em;  width: 3em;  display: inline-block;  margin: 0 0.25em; }  @media (min-width: 66.25em) {    .social-icon {      margin: 0 0.5em; } }  .social-icon.facebook {    fill: #3b5998; }    .social-icon.facebook:hover {      fill: #3964be; }  .social-icon.twitter {    fill: #55acee; }    .social-icon.twitter:hover {      fill: #6ebdf9; }  .social-icon.google {    fill: #dd4b39; }    .social-icon.google:hover {      fill: #ec5f4e; }  .social-icon.linkedin {    fill: #0976b4; }    .social-icon.linkedin:hover {      fill: #008fe1; }  .social-icon:hover {    -webkit-animation: spring 600ms ease forwards;            animation: spring 600ms ease forwards; }.footer-copy {  max-width: 100em;  width: 96%;  margin: auto;  padding: 0 1em; }  .footer-copy p {    font-size: 0.9375em; }  @media (min-width: 30em) {    .footer-copy {      padding: 0 2.5em; } }.google-code {  height: 0;  overflow: hidden; }/* -----------------------------------------  14.0. Extras----------------------------------------- */input[type="text"], input[type="password"], input[type="submit"], input[type="email"], input[type="tel"], textarea, select, button[type="submit"] {  border-radius: 0;  padding: 1.3em;  border: 1px solid #d4d7da;  margin: 0.5em 0;  -webkit-appearance: none; }input, textarea, select, button {  outline: none;  resize: none;  font-family: brandon-grotesque, sans-serif; font-weight: 400;  -webkit-font-smoothing: antialiased;  width: 100%;  line-height: 1;  font-size: 0.9375em; }  input:focus, textarea:focus, select:focus, button:focus {    border-color: #999;    background-color: #f8f8f8; }  input[type="submit"], textarea[type="submit"], select[type="submit"], button[type="submit"] {    cursor: pointer;    background: #f39220;    color: #fff;    font-size: 1.18652em;    text-transform: uppercase;    font-family: brandon-grotesque, sans-serif; font-weight: 700;    margin-top: 1em;    border: none; }    input[type="submit"]:hover, textarea[type="submit"]:hover, select[type="submit"]:hover, button[type="submit"]:hover {      background: #d87705;      color: #fff; }input[type="radio"] {  -webkit-appearance: radio; }input[type="checkbox"] {  -webkit-appearance: checkbox; }select {  padding: 1em 0.3em;  background-color: #f3f3f3;  -moz-appearance: none; }label {  line-height: 1;  font-family: brandon-grotesque, sans-serif; font-weight: 700;  text-transform: uppercase; }textarea {  height: 12em;  overflow: auto;  max-height: 12em; }.select-wrap {  position: relative;  display: inline; }  .select-wrap:after {    content: "";    position: absolute;    top: 50%;    bottom: auto;    display: inline-block;    -webkit-transform: translateY(-50%);    -ms-transform: translateY(-50%);    transform: translateY(-50%);    right: 15px;    width: 11px;    height: 7px;    background: url("/smarter-web-company-co-uk/_img/images/svg/down-black.svg") no-repeat center center;    background-size: 10px 6px;    pointer-events: none; }.form_error_wrap {  display: none; }.form_error_specific {  color: #f44336;  text-align: left; }.contact-form__wrap {  max-width: 38em;  margin: auto; }/*  .contact-form__wrap label {    display: none; }*/  .contact-form__wrap input[type="text"] {    margin: 0.75em 0; }input[type="checkbox"] {width:  initial;}.contact-form__wrap .inputsetcheck label:first-of-type {display:  block; margin-bottom: 10px;}.alert-error, .payment-errors {  padding: 0.5em 1em;  background-color: firebrick;  color: #fff;  margin: 5px 0; }.alert-error:first-child {  margin: 5px 0 !important; }.alert-error:only-child {  margin: 5px 0 7em !important; }.payment-errors {  display: block; }#s1512455 .payment-errors {  margin: 1em 0;  padding: 0.5em 1.5em; }  @media (min-width: 40em) {    #s1512455 .payment-errors {      padding: 0.5em 2em; } }.payment-errors:empty {  display: none; }.alert-success {  padding: 2em 1.5em;  margin-bottom: 1em;  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15), 0 2px 3px rgba(0, 0, 0, 0.1);  border-radius: 1px;  background-color: #f39220;  color: #fff; }  .alert-success:before,  .alert-success:after {    content: "";    display: table; }  .alert-success:after {    clear: both; }  @media (min-width: 40em) {    .alert-success {      padding: 2em;      font-size: 1.18652em; } }.signup-wrap {  padding: 1.5em 0.25em; }.signup-form, .quote-form {  max-width: 50em;  margin: auto; }  .signup-form h2, .quote-form h2 {    text-align: center;    line-height: 1; }  .signup-form h4, .quote-form h4 {    border-bottom: 1px solid #111;    padding-top: 2em;    margin-bottom: 1em;    font-size: 1.50169em; }  .signup-form p, .quote-form p {    font-size: 1.05469em;    line-height: 1.4; }  .signup-form label, .quote-form label {    font-family: brandon-grotesque, sans-serif; font-weight: 700;    font-size: 14px;    width: 100%;    margin-top: 0.5em;    display: block; }.signUpSection, .quote-form {  padding: 2em 1.5em;  margin-bottom: 2.5em;  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.15), 0 2px 3px rgba(0, 0, 0, 0.1);  border-radius: 1px;  background-color: #fff;  border-bottom: 8px solid #f39220; }  .signUpSection:before,  .signUpSection:after, .quote-form:before,  .quote-form:after {    content: "";    display: table; }  .signUpSection:after, .quote-form:after {    clear: both; }  @media (min-width: 40em) {    .signUpSection, .quote-form {      padding: 3em; } }@media (min-width: 66.25em) {  .signUpSection1, .quote-form {    margin-top: -5em; } }.signUpSection1 h2, .signUpSection3 h2 {  margin-bottom: 1em; }@media (min-width: 40em) {  .packageWrapQuestion {    width: 32.57576%;    float: left;    margin-left: 0.37879%;    margin-right: 0.37879%; }    .packageWrapQuestion.packageWrapQuestionLarge {      width: 49.24242%;      float: left;      margin-left: 0.37879%;      margin-right: 0.37879%; } }#rdlFrequency input, #rdlFrequency label, .checkbox input, .checkbox label {  display: inline-block;  vertical-align: middle;  margin: 0.5em 0; }#rdlFrequency input, .checkbox input {  width: 40px; }#rdlFrequency label, .checkbox label {  width: calc(100% - 40px); }.checkbox {  margin: 1em 0 0.5em; }.web-address p, .web-address input, .web-address select, #owndomaindetails p, #owndomaindetails input, #owndomaindetails select {  display: inline-block;  height: 55px;  line-height: 1; }.web-address p, #owndomaindetails p {  width: 50px;  margin-bottom: 0; }.web-address select, #owndomaindetails select {  width: 70px; }  @media (min-width: 40em) {    .web-address select, #owndomaindetails select {      width: 125px; } }.web-address input, #owndomaindetails input {  width: calc(100% - 115px); }  @media (min-width: 40em) {    .web-address input, #owndomaindetails input {      width: calc(100% - 185px); } }.initialCost {  background-color: #f39220;  border: 1px solid #006890;  margin-bottom: 1em; }  @media (min-width: 40em) {    .initialCost {      width: 48.57143%;      float: left;      margin-right: 2.85714%;      margin-bottom: 0; } }  .initialCost p {    font-family: brandon-grotesque, sans-serif; font-weight: 700;    text-transform: uppercase; }.subsequentCost {  background-color: #141414;  border: 1px solid #000; }  @media (min-width: 40em) {    .subsequentCost {      width: 48.57143%;      float: right;      margin-right: 0; } }.initialCost, .subsequentCost {  padding: 2em;  text-align: center;  color: #fff;  box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.1), 0 4px 8px 0 rgba(0, 0, 0, 0.2); }  @media (min-width: 40em) {    .initialCost, .subsequentCost {      padding: 3em; } }  .initialCost h6, .initialCost p, .subsequentCost h6, .subsequentCost p {    color: #fff; }#initialCostValue, #subsequentCostValue {  position: relative;  font-size: 2.40542em;  font-family: brandon-grotesque, sans-serif; font-weight: 700;  display: inline-block;  line-height: 1.4;  margin-bottom: 0.25em; }  #initialCostValue:after, #subsequentCostValue:after {    content: "";    width: 100%;    height: 3px;    background-color: #fff;    display: inline-block;    -webkit-transition: -webkit-transform 300ms ease-in-out;            transition: transform 300ms ease-in-out;    position: absolute;    bottom: 0;    left: 0;    visibility: hidden;    -webkit-transform: scaleX(0);        -ms-transform: scaleX(0);            transform: scaleX(0); }.costBox:hover #initialCostValue:after, .costBox:hover #subsequentCostValue:after {  -webkit-transform: scaleX(1);      -ms-transform: scaleX(1);          transform: scaleX(1);  visibility: visible; }.message-text {  margin-top: 2em; }  .message-text h6 {    text-align: center;    margin-bottom: 2em; }.costNote {  float: left;  width: 100%;  margin-top: 2em; }  .costNote > * {    display: inline; }  .costNote p {    margin-bottom: 0; }.expiry-date {  width: 65.71429%;  float: left;  margin-right: 2.85714%; }  .expiry-date select, .expiry-date .slash {    display: inline-block; }  .expiry-date .slash {    width: 30px;    text-align: center; }  .expiry-date select {    width: calc(50% - 20px);    height: 55px; }.cvc {  width: 31.42857%;  float: right;  margin-right: 0; }  .cvc input {    height: 55px; }.quote-form .inputset {  width: 100%; }  .quote-form .inputset:before,  .quote-form .inputset:after {    content: "";    display: table; }  .quote-form .inputset:after {    clear: both; }.quote-form .inline {  margin: 1em 0em; }  .quote-form .inline input {    float: left;    width: auto;    margin-right: 5px;    margin-top: 0; }    @media (min-width: 25em) {      .quote-form .inline input {        margin-top: 1px; } }.quote-form .inputsetItem6 {  margin: 1em 0; }  .quote-form .inputsetItem6 label:first-child {    margin-bottom: 1em; }@-webkit-keyframes fadein {  0% {    opacity: 0; }  100% {    opacity: 1;    -webkit-transform: translateY(0) scale(1);            transform: translateY(0) scale(1); } }@keyframes fadein {  0% {    opacity: 0; }  100% {    opacity: 1;    -webkit-transform: translateY(0) scale(1);            transform: translateY(0) scale(1); } }@-webkit-keyframes expand {  0% {    width: 0; }  100% {    width: 5rem; } }@keyframes expand {  0% {    width: 0; }  100% {    width: 5rem; } }.hero {  height: 40em;  width: 100%;  padding: 0;  position: relative;  background-size: cover;  background-repeat: no-repeat;  background-color: #111;  background-position: center; }  @media (min-width: 62.5em) {    .hero {      height: 100%;      height: 100vh; } }  .previewFrame .hero {    height: 700px; }  #s466567 .hero {    background-image: url("/smarter-web-company-co-uk/_img/images/home-hero.jpg"); }.hero-content {  padding-top: 5em;  text-align: center;  width: 83%;  max-width: 56em;  margin: auto;  font-size: 13px; }  .home-hero .hero-content, .hero-content.cs-hero__content {    position: absolute;    top: 50%;    left: 50%;    -webkit-transform: translate(-50%, -50%);        -ms-transform: translate(-50%, -50%);            transform: translate(-50%, -50%); }  @media (min-width: 20em) {    .hero-content {      font-size: 14px; } }  @media (min-width: 60em) {    .hero-content {      font-size: 16px; } }  .hero-content h1, .hero-content h2, .hero-content h3, .hero-content h4, .hero-content h5, .hero-content h6, .hero-content p {    color: #fff; }  .hero-content .button, .hero-content .solid-button {    margin: 0.5em 0.2em; }    @media (min-width: 25em) {      .hero-content .button, .hero-content .solid-button {        margin-top: 1.5em; } }    @media (min-width: 62.5em) {      .hero-content .button, .hero-content .solid-button {        margin-top: 3em; } }  .hero-content h6 {    -webkit-animation: textin 550ms ease-in 1s both;            animation: textin 550ms ease-in 1s both; }  .hero-content .button {    -webkit-animation: textin 650ms ease-in 1.2s both;            animation: textin 650ms ease-in 1.2s both;    font-size: 13px; }    @media (min-width: 25em) {      .hero-content .button {        font-size: inherit; } }  .hero-content .divider:after {    -webkit-animation: expand 400ms ease-in 0.75s both;            animation: expand 400ms ease-in 0.75s both;    margin: 0.25em auto; }    @media (min-width: 48em) {      .hero-content .divider:after {        margin: 0.15em auto; } }@-webkit-keyframes textin {  0% {    opacity: 0;    -webkit-transform: scale(0.25);            transform: scale(0.25); }  100% {    opacity: 1;    -webkit-transform: scale(1);            transform: scale(1); } }@keyframes textin {  0% {    opacity: 0;    -webkit-transform: scale(0.25);            transform: scale(0.25); }  100% {    opacity: 1;    -webkit-transform: scale(1);            transform: scale(1); } }.hero-title h1 {  font-size: 2.40542em;  line-height: 1;  margin: 0;  margin-bottom: 0.1em;  padding-top: 0; }  @media (min-width: 30em) {    .hero-title h1 {      font-size: 3.04436em; } }  @media (min-width: 48em) {    .hero-title h1 {      font-size: 3.85302em; } }  @media (min-width: 66.25em) {    .hero-title h1 {      font-size: 4.87648em; } }.cssanimations.csstransitions .hero-title {  -webkit-transform: translateY(-5%);      -ms-transform: translateY(-5%);          transform: translateY(-5%);  opacity: 0;  -webkit-animation: fadein 500ms ease-in 300ms forwards;          animation: fadein 500ms ease-in 300ms forwards; }section {  padding: 3.5em 1em;  position: relative; }  section:before,  section:after {    content: "";    display: table; }  section:after {    clear: both; }  @media (min-width: 30em) {    section {      padding: 6em 1em; } }.about-us {  background-image: url("/smarter-web-company-co-uk/_img/images/what-we-do.jpg");  background-size: cover;  background-repeat: no-repeat;  background-color: #111; }  @media (min-width: 30em) {    .about-us {      text-align: center; } }  .about-us .content-wrap {    max-width: 55em;    margin: auto;    width: 91%; }  .about-us h2, .about-us h3, .about-us h4, .about-us h5, .about-us h6, .about-us p {    color: #fff; }  .about-us p {    font-family: brandon-grotesque, sans-serif; font-weight: 300;    color: rgba(255, 255, 255, 0.8); }  .about-us .divider-center:after {    margin: 0.4em 0; }    @media (min-width: 30em) {      .about-us .divider-center:after {        margin: 0.4em auto; } }.bespoke-design, .hosted {  padding: 0; }  .bespoke-design:before,  .bespoke-design:after, .hosted:before,  .hosted:after {    content: "";    display: table; }  .bespoke-design:after, .hosted:after {    clear: both; }.bespoke-image {  padding-bottom: 75%;  height: 0;  z-index: 1;  background-image: url("/smarter-web-company-co-uk/_img/images/bespoke-design.jpg");  background-size: cover;  background-repeat: no-repeat;  background-color: #111;  background-position: center; }  @media (min-width: 43.75em) {    .bespoke-image {      padding-bottom: 65%; } }  @media (min-width: 50em) {    .bespoke-image {      width: 33.33333%;      float: right;      margin-right: 0;      background-position: center;      padding-bottom: 78%; } }  @media (min-width: 60em) {    .bespoke-image {      width: 50%;      float: right;      margin-right: 0;      padding-bottom: 70%; } }  @media (min-width: 75em) {    .bespoke-image {      padding-bottom: 60%; } }  @media (min-width: 87.5em) {    .bespoke-image {      padding-bottom: 40%; } }.bespoke-copy {  position: relative;  z-index: 5; }  @media (min-width: 50em) {    .bespoke-copy {      width: 66.66667%;      float: left;      padding-bottom: 78%;      height: 0; }      .bespoke-copy__inner {        position: absolute;        top: 0;        bottom: 0;        left: 0;        right: 0;        height: 100%; } }  @media (min-width: 60em) {    .bespoke-copy {      width: 50%;      float: left;      padding-bottom: 70%; } }  @media (min-width: 75em) {    .bespoke-copy {      padding-bottom: 60%; } }  @media (min-width: 87.5em) {    .bespoke-copy {      padding-bottom: 40%; } }  .bespoke-copy .content-wrap {    max-width: 85%;    margin: auto;    position: relative;    padding: 2em 0; }    @media (min-width: 50em) {      .bespoke-copy .content-wrap {        top: 50%;        -webkit-transform: translateY(-50%);            -ms-transform: translateY(-50%);                transform: translateY(-50%); } }    @media (min-width: 75em) {      .bespoke-copy .content-wrap {        max-width: 75%; } }  .bespoke-copy:after {    border: 25px transparent solid;    border-bottom-color: #fff;    position: absolute;    top: -50px;    left: 50%;    display: block;    content: "";    -webkit-transform: translateX(-50%);        -ms-transform: translateX(-50%);            transform: translateX(-50%); }    @media (min-width: 50em) {      .bespoke-copy:after {        -webkit-transform: none;            -ms-transform: none;                transform: none;        border-bottom-color: transparent;        border-left-color: #fff;        left: auto;        top: 50%;        right: -50px;        -webkit-transform: translateY(-50%);            -ms-transform: translateY(-50%);                transform: translateY(-50%); } }/*******************************************************************************************  Projects*******************************************************************************************/.projects {  padding: 0;  position: relative;  font-size: 14px; }  @media (min-width: 72.5em) {    .projects {      font-size: 16px; } }.project-item {  min-height: 0;  background-repeat: no-repeat;  background-size: cover;  background-position: center;  float: left;  padding: 0;  margin: 0;  display: table; }  .project-item:nth-child(1) {    width: 100%; }    .project-item:nth-child(1) .project-item__inner {      padding-top: 100%; }      @media (min-width: 30em) {        .home-projects .project-item:nth-child(1) .project-item__inner {          padding-top: 60%; } }      @media (min-width: 60em) {        .home-projects .project-item:nth-child(1) .project-item__inner {          padding-top: 100%; } }    @media (min-width: 30em) {      .project-item:nth-child(1) {        width: 50%; } }    @media (min-width: 30em) {      .home-projects .project-item:nth-child(1) {        width: 100%; } }    @media (min-width: 60em) {      .home-projects .project-item:nth-child(1) {        width: 50%; } }  .project-item:nth-child(2), .project-item:nth-child(3) {    width: 100%; }    .project-item:nth-child(2) .project-item__inner, .project-item:nth-child(3) .project-item__inner {      padding-top: 100%; }    @media (min-width: 30em) {      .project-item:nth-child(2), .project-item:nth-child(3) {        width: 50%; } }    @media (min-width: 60em) {      .project-item:nth-child(2) .project-item__inner, .project-item:nth-child(3) .project-item__inner {        padding-top: 50%; }      .project-item:nth-child(2) h3, .project-item:nth-child(3) h3 {        font-size: 1.90058em; } }  .project-item:nth-child(4), .project-item:nth-child(5), .project-item:nth-child(6), .project-item:nth-child(7) {    width: 100%; }    .project-item:nth-child(4) .project-item__inner, .project-item:nth-child(4) .project-link__wrap, .project-item:nth-child(5) .project-item__inner, .project-item:nth-child(5) .project-link__wrap, .project-item:nth-child(6) .project-item__inner, .project-item:nth-child(6) .project-link__wrap, .project-item:nth-child(7) .project-item__inner, .project-item:nth-child(7) .project-link__wrap {      padding-top: 100%; }    @media (min-width: 30em) {      .project-item:nth-child(4), .project-item:nth-child(5), .project-item:nth-child(6), .project-item:nth-child(7) {        width: 50%; } }    @media (min-width: 40em) {      .project-item:nth-child(4) h3, .project-item:nth-child(5) h3, .project-item:nth-child(6) h3, .project-item:nth-child(7) h3 {        font-size: 1.68941em; } }    @media (min-width: 60em) {      .project-item:nth-child(4), .project-item:nth-child(5), .project-item:nth-child(6), .project-item:nth-child(7) {        width: 25%; }        .project-item:nth-child(4) h3:after, .project-item:nth-child(5) h3:after, .project-item:nth-child(6) h3:after, .project-item:nth-child(7) h3:after {          margin-top: 0.7em; }        .project-item:nth-child(4) p, .project-item:nth-child(5) p, .project-item:nth-child(6) p, .project-item:nth-child(7) p {          display: none; } }  .project-item.dark-bg {    background-size: auto;    background-repeat: repeat; }  .project-item .project-item__inner, .project-item .project-link__wrap {    height: 0;    position: relative;    overflow: hidden;    display: block;    width: 100%; }  .no-touchevents.cssanimations.csstransitions .project-item {    -webkit-transform: scale(0.5);        -ms-transform: scale(0.5);            transform: scale(0.5);    opacity: 0; }    .no-touchevents.cssanimations.csstransitions .project-item.inviewport {      -webkit-animation: fadein 500ms ease-in forwards;              animation: fadein 500ms ease-in forwards; }.hover-content, .link-content-wrap {  position: absolute;  top: 0;  right: 0;  left: 0;  bottom: 0; }.hover-content {  margin: 1em;  padding: 1.5em;  background-color: rgba(0, 0, 0, 0.8);  text-align: center;  -webkit-transition: opacity 550ms ease;          transition: opacity 550ms ease;  opacity: 0; }.link-content-wrap {  text-align: center; }  .link-content-wrap h4, .link-content-wrap h5 {    color: #fff; }  @media (min-width: 40em) {    .link-content-wrap {      margin: 2em; } }  @media (min-width: 60em) {    .link-content-wrap {      border: 4px solid rgba(255, 255, 255, 0.6); } }.project-item:hover .hover-content {  opacity: 1;  -webkit-transition: opacity 700ms ease;          transition: opacity 700ms ease; }.project-item:hover h3, .project-item:hover p, .project-item:hover .arrow-button {  -webkit-transform: translateY(0);      -ms-transform: translateY(0);          transform: translateY(0);  opacity: 1; }.project-item__content, .link-content {  position: absolute;  top: 50%;  left: 50%;  -webkit-transform: translate(-50%, -50%);      -ms-transform: translate(-50%, -50%);          transform: translate(-50%, -50%);  width: 90%; }  @media (min-width: 40em) {    .project-item__content, .link-content {      width: 85%; } }  .project-item__content .arrow-button, .link-content .arrow-button {    font-size: 12px;    margin-top: 1.5em;    -webkit-transform: translateY(100%);        -ms-transform: translateY(100%);            transform: translateY(100%);    opacity: 0;    -webkit-transition: all 300ms ease 500ms;            transition: all 300ms ease 500ms;    margin-bottom: 0; }  .project-item__content h3, .link-content h3 {    color: #fff;    line-height: 1.1;    -webkit-transform: translateY(-100%);        -ms-transform: translateY(-100%);            transform: translateY(-100%);    opacity: 0;    -webkit-transition: all 300ms ease 400ms;            transition: all 300ms ease 400ms;    padding-top: 0;    font-size: 1.50169em; }    @media (min-width: 30em) {      .project-item__content h3:after, .link-content h3:after {        margin-top: 0.75em; } }    @media (min-width: 40em) {      .project-item__content h3, .link-content h3 {        font-size: 1.90058em;        -webkit-transform: translateY(-100%);            -ms-transform: translateY(-100%);                transform: translateY(-100%);        opacity: 0; }        .project-item__content h3:after, .link-content h3:after {          margin-top: 0.4em; } }  .project-item__content p, .link-content p {    color: #fff;    -webkit-transform: translateY(-100%);        -ms-transform: translateY(-100%);            transform: translateY(-100%);    opacity: 0;    -webkit-transition: all 300ms ease-in-out 300ms;            transition: all 300ms ease-in-out 300ms;    margin-bottom: 0;    padding-top: 0;    line-height: 1.4; }    @media (min-width: 30em) {      .project-item__content p, .link-content p {        display: none; } }    @media (min-width: 40em) {      .project-item__content p, .link-content p {        display: block; } }.link-content a {  display: inline-block; }  .link-content a:hover i {    background: #fff; }  .link-content a:hover svg {    fill: #111; }  .link-content a:hover h5 {    background: #fff;    color: #111; }    @media (min-width: 60em) {      .link-content a:hover h5 {        background: transparent;        color: #fff; } }@media (min-width: 0em) and (max-width: 60em) {  .link-content h5 {    position: relative;    height: 3em;    float: left;    display: inline-block;    font-family: brandon-grotesque, sans-serif; font-weight: 700;    font-size: 1.18652em;    color: #fff;    text-transform: uppercase;    line-height: 3em;    padding: 0 2em;    border: 3px solid #fff;    margin-bottom: 0;    -webkit-transition: all 300ms cubic-bezier(0.23, 1, 0.32, 1);            transition: all 300ms cubic-bezier(0.23, 1, 0.32, 1); } }.link-arrow {  float: left; }  .link-arrow i {    display: inline-block;    border: 3px solid #fff;    border-left: 0;    background: transparent;    height: 3em;    width: 3em;    font-size: 1.18652em;    -webkit-transition: all 300ms cubic-bezier(0.23, 1, 0.32, 1);            transition: all 300ms cubic-bezier(0.23, 1, 0.32, 1); }  .link-arrow svg {    fill: #fff;    height: 1.2em;    width: 1.2em;    position: relative;    top: 50%;    -webkit-transform: translateY(-50%);    -ms-transform: translateY(-50%);    transform: translateY(-50%); }  @media (min-width: 60em) {    .link-arrow {      float: none; }      .link-arrow i {        border-left: 3px solid #fff; } }/*******************************************************************************************  Processs*******************************************************************************************/.process {  text-align: center; }  .process h6 {    text-transform: none;    font-family: brandon-grotesque, sans-serif; font-weight: 400;    color: rgba(0, 0, 0, 0.7); }.process-wrap {  padding: 0.5em; }  .process-wrap:before,  .process-wrap:after {    content: "";    display: table; }  .process-wrap:after {    clear: both; }  @media (min-width: 40em) {    .process-wrap {      padding: 1.5em; } }  .no-touchevents .process-wrap .process-step {    -webkit-transform: scale(0.1);        -ms-transform: scale(0.1);            transform: scale(0.1);    opacity: 0; }  .no-touchevents .inviewport .process-wrap .process-step:nth-child(1) {    -webkit-animation: fadein 600ms ease-in 0.05s forwards;            animation: fadein 600ms ease-in 0.05s forwards; }  .no-touchevents .inviewport .process-wrap .process-step:nth-child(2) {    -webkit-animation: fadein 600ms ease-in 0.2s forwards;            animation: fadein 600ms ease-in 0.2s forwards; }  .no-touchevents .inviewport .process-wrap .process-step:nth-child(3) {    -webkit-animation: fadein 600ms ease-in 0.35s forwards;            animation: fadein 600ms ease-in 0.35s forwards; }  .no-touchevents .inviewport .process-wrap .process-step:nth-child(4) {    -webkit-animation: fadein 600ms ease-in 0.5s forwards;            animation: fadein 600ms ease-in 0.5s forwards; }  .no-touchevents .inviewport .process-wrap .process-step:nth-child(5) {    -webkit-animation: fadein 600ms ease-in 0.65s forwards;            animation: fadein 600ms ease-in 0.65s forwards; }  .no-touchevents .inviewport .process-wrap .process-step:nth-child(6) {    -webkit-animation: fadein 600ms ease-in 0.8s forwards;            animation: fadein 600ms ease-in 0.8s forwards; }.process-step {  padding: 3.5em 0;  position: relative;  -webkit-transition: all 300ms cubic-bezier(0.23, 1, 0.32, 1);          transition: all 300ms cubic-bezier(0.23, 1, 0.32, 1);  background-position: center top;  background-repeat: no-repeat;  background-size: cover;  width: 47.22222%;  float: left;  margin-left: 1.38889%;  margin-right: 1.38889%; }  @media (min-width: 40em) {    .process-step {      padding: 4em 0;      width: 30.55556%;      float: left;      margin-left: 1.38889%;      margin-right: 1.38889%; } }  @media (min-width: 60em) {    .process-step {      width: 13.88889%;      float: left;      margin-left: 1.38889%;      margin-right: 1.38889%; } }  @media (min-width: 66.25em) {    .process-step {      padding: 5.5em 0; } }  .process-step:last-child:before {    background-image: none;    height: 0;    width: 0;    visibility: hidden; }  .process-step svg {    margin: auto;    width: 5em;    height: 5em;    fill: #111;    -webkit-transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1);            transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1); }    @media (min-width: 60em) {      .process-step svg {        width: 4em;        height: 4em; } }    @media (min-width: 66.25em) {      .process-step svg {        height: 5em;        width: 5em; } }  .process-step h6 {    font-family: brandon-grotesque, sans-serif; font-weight: 700;    text-transform: uppercase;    margin-bottom: 0;    -webkit-transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1);            transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1);    color: #444;    color: rgba(0, 0, 0, 0.75); }  .process-step a {    opacity: 1;    color: #333;    -webkit-transition: all 200ms ease-in;            transition: all 200ms ease-in; }    .process-step a:hover {      text-decoration: underline; }  .process-step:after {    width: 0%;    position: absolute;    bottom: -5px;    left: 0;    content: "";    display: block;    background-color: #f39220;    height: 5px; }  .process-step:before {    content: "";    display: inline-block;    height: 1.5em;    width: 1.5em;    position: absolute;    right: 0;    opacity: 0.8;    -webkit-transform: translate(65%, -125%);        -ms-transform: translate(65%, -125%);            transform: translate(65%, -125%);    -webkit-transition: -webkit-transform 200ms ease-out;            transition: transform 200ms ease-out;    top: 50%;    background-image: url("/smarter-web-company-co-uk/_img/images/svg/arrow-right.svg");    background-size: contain;    background-repeat: no-repeat;    background-position: 50% 50%; }    @media (min-width: 40em) {      .process-step:before {        -webkit-transform: translate(100%, -125%);            -ms-transform: translate(100%, -125%);                transform: translate(100%, -125%); } }  @media (min-width: 0em) and (max-width: 40em) {    .process-step:nth-child(2n):before {      background-image: none;      height: 0;      width: 0;      visibility: hidden; } }  @media (min-width: 40em) and (max-width: 60em) {    .process-step:nth-child(3n):before {      background-image: none;      height: 0;      width: 0;      visibility: hidden; } }  .process-step:hover:after {    width: 100%;    -webkit-transition: all 600ms cubic-bezier(0.23, 1, 0.32, 1);            transition: all 600ms cubic-bezier(0.23, 1, 0.32, 1); }  .process-step:hover:before {    -webkit-transform: translate(140%, -125%);        -ms-transform: translate(140%, -125%);            transform: translate(140%, -125%); }  .process-step:hover svg {    fill: #fff; }  .process-step:hover h6, .process-step:hover a {    color: #fff; }.signup:hover {  background-image: url("/smarter-web-company-co-uk/_img/images/process-signup.jpg"); }.research:hover {  background-image: url("/smarter-web-company-co-uk/_img/images/process-research.jpg"); }.design:hover {  background-image: url("/smarter-web-company-co-uk/_img/images/process-design.jpg"); }.build:hover {  background-image: url("/smarter-web-company-co-uk/_img/images/process-build.jpg"); }.launch:hover {  background-image: url("/smarter-web-company-co-uk/_img/images/process-launch.jpg"); }.support:hover {  background-image: url("/smarter-web-company-co-uk/_img/images/process-marketing.jpg"); }/*******************************************************************************************  Packages*******************************************************************************************/.packages {  text-align: center; }  .packages h2, .packages h6 {    color: #fff; }  .packages .sub-title {    width: 98%;    max-width: 72em;    margin: auto; }    .packages .sub-title:before,    .packages .sub-title:after {      content: "";      display: table; }    .packages .sub-title:after {      clear: both; }    @media (min-width: 60em) {      .packages .sub-title {        width: 85%; } }    .packages .sub-title h6 {      text-transform: none;      font-family: brandon-grotesque, sans-serif; font-weight: 300;      color: rgba(255, 255, 255, 0.7); }.packages-wrap {  padding: 2.5em 0 1.5em;  width: 98%;  max-width: 80em;  margin: auto; }  .packages-wrap:before,  .packages-wrap:after {    content: "";    display: table; }  .packages-wrap:after {    clear: both; }  @media (min-width: 60em) {    .packages-wrap {      width: 94%; } }.package-item {  background: rgba(0, 0, 0, 0.2);  padding: 3em 1em;  box-shadow: inset 0 0 0 3px rgba(255, 255, 255, 0.5);  -webkit-transition: all 200ms ease;          transition: all 200ms ease;  margin-bottom: 6px; }  @media (min-width: 25em) {    .package-item {      width: 48.61111%;      float: left;      margin-left: 0.69444%;      margin-right: 0.69444%;      margin-bottom: 1.2%; }      .package-item:nth-child(5) {        margin-left: 25.2%; } }  @media (min-width: 43.75em) {    .package-item {      width: 32.57576%;      float: left;      margin-left: 0.37879%;      margin-right: 0.37879%;      margin-bottom: 0;      margin-bottom: 0.75%; }      .package-item:nth-child(4) {        margin-left: 16.9%; }      .package-item:nth-child(5) {        margin-left: 0.45455%; } }  @media (min-width: 72.5em) {    .package-item {      width: 19.09091%;      float: left;      margin-left: 0.45455%;      margin-right: 0.45455%; }      .package-item:nth-child(4) {        margin-left: 0.45455%; } }  .package-item:hover {    background: rgba(0, 0, 0, 0.85);    box-shadow: inset 0 0 0 5px #f39220; }  .package-item__title h6 {    font-family: brandon-grotesque, sans-serif; font-weight: 400; }  .package-item__price {    font-size: 3.04436em;    font-family: brandon-grotesque, sans-serif; font-weight: 700;    color: #fff;    line-height: 1; }  .package-item__info {    margin: 2em 0; }    .package-item__info p {      font-family: brandon-grotesque, sans-serif; font-weight: 300;      color: #fff;      font-size: 0.9375em;      text-transform: uppercase;      margin-bottom: 0; }  .package-item__monthly {    font-family: brandon-grotesque, sans-serif; font-weight: 400;    font-size: 0.9375em;    color: #fff;    text-transform: uppercase; }  .package-item .monthly-price {    font-family: brandon-grotesque, sans-serif; font-weight: 700;    font-size: 1.33484em; }  .package-item .divider:after {    width: 3rem;    margin: 1.1em auto; }  .package-item .button-text {    font-size: 0.9375em;    border-width: 2px;    padding: 0.75em 1.2em; }  .package-item .button {    margin: 1.5em 0 1em; }    .package-item .button a:hover .button-text {      background-color: #f39220;      color: #fff;      border-color: #f39220; }  .no-touchevents.cssanimations.csstransitions .package-item {    -webkit-transform: scale(0.5);        -ms-transform: scale(0.5);            transform: scale(0.5);    opacity: 0; }    .no-touchevents.cssanimations.csstransitions .package-item.inviewport {      -webkit-animation: fadein 500ms ease-in forwards;              animation: fadein 500ms ease-in forwards; }      .no-touchevents.cssanimations.csstransitions .package-item.inviewport:nth-child(1) {        -webkit-animation-delay: 200ms;                animation-delay: 200ms; }      .no-touchevents.cssanimations.csstransitions .package-item.inviewport:nth-child(2) {        -webkit-animation-delay: 300ms;                animation-delay: 300ms; }      .no-touchevents.cssanimations.csstransitions .package-item.inviewport:nth-child(3) {        -webkit-animation-delay: 400ms;                animation-delay: 400ms; }      .no-touchevents.cssanimations.csstransitions .package-item.inviewport:nth-child(4) {        -webkit-animation-delay: 500ms;                animation-delay: 500ms; }      .no-touchevents.cssanimations.csstransitions .package-item.inviewport:nth-child(5) {        -webkit-animation-delay: 600ms;                animation-delay: 600ms; }/*******************************************************************************************  Hosted Solution*******************************************************************************************/.hosted {  display: table;  width: 100%;  background-color: #f39220; }.hosted-image {  height: 28em;  z-index: 1;  background-image: url("/smarter-web-company-co-uk/_img/images/hosted-solution.jpg");  background-size: cover;  background-repeat: no-repeat;  background-color: #111;  background-position: center; }  @media (min-width: 53.75em) {    .hosted-image {      display: table-cell;      height: auto;      width: 41.66667%; } }  @media (min-width: 72.5em) {    .hosted-image {      width: 50%; } }.hosted-content {  position: relative;  background-color: #f39220;  z-index: 5;  vertical-align: middle;  height: auto; }  @media (min-width: 53.75em) {    .hosted-content {      width: 58.33333%;      display: table-cell; } }  @media (min-width: 72.5em) {    .hosted-content {      width: 50%; } }  .hosted-content .content-wrap {    max-width: 85%;    margin: auto;    position: relative;    padding: 4em 0; }    @media (min-width: 72.5em) {      .hosted-content .content-wrap {        max-width: 75%;        padding: 9em 0; } }  .hosted-content h2, .hosted-content p, .hosted-content li {    color: #fff; }  .hosted-content h2 {    padding-top: 0; }  .hosted-content ul {    margin-top: 1em; }  .hosted-content li {    font-family: brandon-grotesque, sans-serif; font-weight: 700;    list-style-position: inside; }  .hosted-content .divider:after {    background: #fff; }  .hosted-content:after {    border: 25px transparent solid;    border-bottom-color: #f39220;    position: absolute;    top: -50px;    left: 50%;    display: block;    content: "";    -webkit-transform: translateX(-50%);        -ms-transform: translateX(-50%);            transform: translateX(-50%); }    @media (min-width: 53.75em) {      .hosted-content:after {        -webkit-transform: none;            -ms-transform: none;                transform: none;        border-bottom-color: transparent;        border-right-color: #f39220;        right: auto;        top: 50%;        left: -50px;        -webkit-transform: translateY(-50%);            -ms-transform: translateY(-50%);                transform: translateY(-50%); } }/*******************************************************************************************  CMS*******************************************************************************************/.cms {  background-image: url("/smarter-web-company-co-uk/_img/images/home-cms-bg.jpg");  background-position: center;  background-size: cover;  background-repeat: no-repeat;  text-align: center;  padding: 2em 1em; }  @media (min-width: 48em) {    .cms {      padding: 5em 1em; } }  .cms .sub-title h6 {    text-transform: none;    max-width: 30em;    margin: auto;    padding-top: 0;    color: #444;    color: rgba(0, 0, 0, 0.75); }  .cms .play-icon {    height: 7em;    width: 7em;    margin: 10.5em 0;    border-radius: 50%; }    @media (min-width: 48em) {      .cms .play-icon {        margin: 10em 0;        height: 10em;        width: 10em; } }    .cms .play-icon:hover {      fill: #f39220;      box-shadow: 0 0 10px 2px rgba(255, 255, 255, 0.2);      -webkit-animation: wobble 300ms ease-in-out forwards;              animation: wobble 300ms ease-in-out forwards;      background: #fff; }.cssanimations.csstransitions .cms-video.inviewport .play-icon {  -webkit-animation: wobble 450ms ease-in-out 300ms forwards;          animation: wobble 450ms ease-in-out 300ms forwards; }@-webkit-keyframes wobble {  10% {    -webkit-transform: rotate(60deg);            transform: rotate(60deg); }  25% {    -webkit-transform: rotate(-60deg);            transform: rotate(-60deg); }  50% {    -webkit-transform: rotate(30deg);            transform: rotate(30deg); }  75% {    -webkit-transform: rotate(-30deg);            transform: rotate(-30deg); }  100% {    -webkit-transform: rotate(0deg);            transform: rotate(0deg); } }@keyframes wobble {  10% {    -webkit-transform: rotate(60deg);            transform: rotate(60deg); }  25% {    -webkit-transform: rotate(-60deg);            transform: rotate(-60deg); }  50% {    -webkit-transform: rotate(30deg);            transform: rotate(30deg); }  75% {    -webkit-transform: rotate(-30deg);            transform: rotate(-30deg); }  100% {    -webkit-transform: rotate(0deg);            transform: rotate(0deg); } }/*******************************************************************************************  Testimonials*******************************************************************************************/.testimonials {  padding: 1.5em 1em;  position: relative;  background-image: url("/smarter-web-company-co-uk/_img/images/testimonial-bg.jpg");  background-position: center;  background-size: cover;  background-repeat: no-repeat;  width: 100%; }  @media (min-width: 40em) {    .testimonials {      height: 40em;      padding: 2em;      font-size: 14px; } }  @media (min-width: 62.5em) {    .testimonials {      height: 75%;      height: 75vh;      padding: 2em;      font-size: 16px; } }  .previewFrame .testimonials {    height: 500px; }  .testimonials h2 {    color: #fff;    padding-top: 0;    font-size: 2.13815em; }    @media (min-width: 62.5em) {      .testimonials h2 {        font-size: 2.7061em; } }  @media (min-width: 62.5em) {    .testimonials .divider:after {      margin: 0.6em auto; } }.testimonial-wrap {  border: 3px solid rgba(255, 255, 255, 0.5);  width: 100%;  height: 100%;  padding: 2em;  text-align: center;  position: relative; }  @media (min-width: 62.5em) {    .testimonial-wrap {      padding: 3em; } }.testimonial-content {  position: relative; }  @media (min-width: 40em) {    .testimonial-content {      top: 50%;      -webkit-transform: translateY(-50%);          -ms-transform: translateY(-50%);              transform: translateY(-50%); } }.testimonial-item {  max-width: 65em;  margin: auto; }  .testimonial-item p {    color: #fff;    font-family: brandon-grotesque, sans-serif; font-weight: 300; }    @media (min-width: 30em) {      .testimonial-item p {        font-size: 1.33484em; } }    @media (min-width: 40em) {      .testimonial-item p {        font-size: 1.50169em; } }  .testimonial-item .client-name {    font-size: 1.33484em;    font-family: brandon-grotesque, sans-serif; font-weight: 700;    color: #fff;    text-transform: uppercase;    margin-top: 1em; }    @media (min-width: 62.5em) {      .testimonial-item .client-name {        margin-top: 2em; } }#s538159 .client-quote {  display: none; }.previewFrame .case-studies header {  top: 40px; }.previewFrame .case-studies .cs-styles {  width: 100%;  height: 40px;  display: block; }.case-studies .cs-styles {  visibility: hidden; }.cs-hero {  text-align: center;  text-transform: uppercase;  height: 100%;  height: 100vh;  width: 100%;  padding: 0;  position: relative;  background-size: cover;  background-repeat: no-repeat;  background-position: center; }  .previewFrame .cs-hero {    height: 700px;    margin-top: 30px; }  .cs-hero h1, .cs-hero h2, .cs-hero h3, .cs-hero h4, .cs-hero h5, .cs-hero h6, .cs-hero p {    color: #fff; }  .cs-hero h1, .cs-hero h2, .cs-hero h3 {    line-height: 1; }  .cs-hero h3 {    margin-bottom: 0;    padding-top: 0; }    @media (min-width: 66.25em) {      .cs-hero h3 {        font-size: 3.85302em; } }  @media (min-width: 62.5em) {    .cs-hero h1 {      font-size: 5.48604em; } }  .cs-hero .divider-center:after {    margin: 0.2em auto; }.hero-content.cs-hero__content {  max-width: 60em; }.cs-hero__content {  padding-top: 4em; }  .cs-hero__content .button {    margin-top: 1.5em; }  @media (min-width: 25em) {    .cs-hero__content {      padding-top: 6em; }      .cs-hero__content .button {        margin-top: 3em; } }.case-studies {  counter-reset: cs-section; }  .case-studies .cs-section {    counter-increment: cs-section; }.cs-about, .cs-brief, .client-quote {  padding: 3.5em 1em; }  .cs-about:before,  .cs-about:after, .cs-brief:before,  .cs-brief:after, .client-quote:before,  .client-quote:after {    content: "";    display: table; }  .cs-about:after, .cs-brief:after, .client-quote:after {    clear: both; }  @media (min-width: 30em) {    .cs-about, .cs-brief, .client-quote {      padding: 6em 0; } }  @media (min-width: 106.25em) {    .cs-about, .cs-brief, .client-quote {      padding: 8em 0; } }  .cs-about .content-wrap, .cs-brief .content-wrap, .client-quote .content-wrap {    width: 83.33333%;    margin: auto; }    @media (min-width: 30em) {      .cs-about .content-wrap, .cs-brief .content-wrap, .client-quote .content-wrap {        width: 75%; } }    @media (min-width: 40em) {      .cs-about .content-wrap, .cs-brief .content-wrap, .client-quote .content-wrap {        width: 66.66667%; } }    @media (min-width: 50em) {      .cs-about .content-wrap, .cs-brief .content-wrap, .client-quote .content-wrap {        padding-right: 8.33333%; } }.cs-section h1 {  line-height: 1.1;  font-size: 1.90058em;  position: relative; }  @media (min-width: 30em) {    .cs-section h1 {      font-size: 2.40542em; } }  @media (min-width: 62.5em) {    .cs-section h1 {      font-size: 3.04436em; } }  .cs-section h1:before {    content: "0" counter(cs-section) " / ";    font-size: 15px;    color: #9b9b9b;    font-family: brandon-grotesque, sans-serif; font-weight: 500;    position: absolute;    top: -5px;    left: 0; }    @media (min-width: 30em) {      .cs-section h1:before {        margin-left: -37px;        position: relative;        font-size: 21px;        top: auto; } }.cs-brief p {  font-family: brandon-grotesque, sans-serif; font-weight: 300; }.cs-identity {  padding: 6em 0; }  .cs-identity__top, .cs-identity__info {    width: 83.33333%;    margin: 0 auto; }    .cs-identity__top:before,    .cs-identity__top:after, .cs-identity__info:before,    .cs-identity__info:after {      content: "";      display: table; }    .cs-identity__top:after, .cs-identity__info:after {      clear: both; }  .cs-identity__top {    margin-bottom: 3em; }    @media (min-width: 53.75em) {      .cs-identity__top {        margin-bottom: 6em; } }  @media (min-width: 53.75em) {    .cs-identity__intro, .cs-identity__type {      width: 48.14815%;      float: left;      margin-right: 3.7037%; } }  @media (min-width: 53.75em) {    .cs-identity__logo, .cs-identity__colours {      width: 48.14815%;      float: right;      margin-right: 0; } }  .cs-identity__logo img, .cs-identity__colours img {    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.15); }  .cs-identity__logo {    margin-top: 2em; }    @media (min-width: 53.75em) {      .cs-identity__logo {        margin-top: 0;        padding-top: 1.2em; } }  .cs-identity__images {    margin-bottom: 3em; }    @media (min-width: 53.75em) {      .cs-identity__images {        margin-bottom: 6em; } }    .cs-identity__images:before,    .cs-identity__images:after {      content: "";      display: table; }    .cs-identity__images:after {      clear: both; }    .cs-identity__images img {      display: block; }      @media (min-width: 25em) {        .cs-identity__images img {          width: 50%;          float: left;          height: auto; } }      @media (min-width: 53.75em) {        .cs-identity__images img {          width: 33.33%; } }  .cs-identity__info h2 {    font-size: 1.90058em; }  .cs-identity__type h3 {    color: #666;    font-size: 1.05469em;    margin-bottom: 0.3em; }  .cs-identity__type .divider {    margin-bottom: 0.6em;    padding-top: 0.6em; }  .cs-identity__type .upper {    text-transform: uppercase; }  .cs-identity__type .lower {    text-transform: lowercase; }  .cs-identity__type .webfont {    font-size: 1.68941em;    word-wrap: break-word;    line-height: 1.1;    margin-bottom: 0.25em; }    @media (min-width: 53.75em) {      .cs-identity__type .webfont {        font-size: 1.90058em; } }.primary-font {  margin-bottom: 1.5em; }  .sh .primary-font .font-name, .sh .primary-font .upper {    font-family: 'Montserrat-Bold'; }  .sh .primary-font .lower {    font-family: 'Montserrat-Regular'; }.sh .secondary-font .font-name, .sh .secondary-font .upper {  font-family: 'droid_serifbold'; }.sh .secondary-font .lower {  font-family: 'droid_serifregular'; }.cs-identity__colours {  margin-top: 2em; }  @media (min-width: 53.75em) {    .cs-identity__colours {      margin-top: 0; } }.colour-blocks {  margin-top: 1.5em; }  .colour-blocks:before,  .colour-blocks:after {    content: "";    display: table; }  .colour-blocks:after {    clear: both; }  @media (min-width: 53.75em) {    .colour-blocks {      margin-top: 3em; } }  .colour-blocks span {    width: 20%;    float: left;    height: 0;    padding-bottom: 20%; }  .cssanimations.csstransitions .colour-blocks span {    opacity: 0;    width: 0; }  .cssanimations.csstransitions .colour-blocks.inviewport span {    -webkit-animation: colourfade 300ms linear forwards;            animation: colourfade 300ms linear forwards; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(1) {      -webkit-animation-delay: 250ms;              animation-delay: 250ms; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(2) {      -webkit-animation-delay: 500ms;              animation-delay: 500ms; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(3) {      -webkit-animation-delay: 750ms;              animation-delay: 750ms; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(4) {      -webkit-animation-delay: 1000ms;              animation-delay: 1000ms; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(5) {      -webkit-animation-delay: 1250ms;              animation-delay: 1250ms; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(6) {      -webkit-animation-delay: 1500ms;              animation-delay: 1500ms; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(7) {      -webkit-animation-delay: 1750ms;              animation-delay: 1750ms; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(8) {      -webkit-animation-delay: 2000ms;              animation-delay: 2000ms; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(9) {      -webkit-animation-delay: 2250ms;              animation-delay: 2250ms; }    .cssanimations.csstransitions .colour-blocks.inviewport span:nth-child(10) {      -webkit-animation-delay: 2500ms;              animation-delay: 2500ms; }@-webkit-keyframes colourfade {  0% {    opacity: 0;    width: 0; }  100% {    opacity: 1;    width: 20%; } }@keyframes colourfade {  0% {    opacity: 0;    width: 0; }  100% {    opacity: 1;    width: 20%; } }.cs-designs__wrap {  width: 83.33333%;  margin: 0 auto; }div[class^="concept"] {  margin-top: 2em; }.concept-small {  text-align: center;  display: block; }  @media (min-width: 43.75em) {    .concept-small {      display: none; } }  .previewFrame .concept-small {    display: block; }.concept-large {  display: none; }  @media (min-width: 43.75em) {    .concept-large {      display: block; } }.cs-responsive {  background-color: #f6f6f6; }.cs-responsive__wrap {  width: 83.33333%;  max-width: 85em;  margin: 0 auto; }.cs-responsive__img {  margin-top: 4em;  text-align: center; }.client-name {  font-family: brandon-grotesque, sans-serif; font-weight: 700;  font-size: 1.33484em; }.cs-links {  padding: 0;  font-size: 14px; }  @media (min-width: 62.5em) {    .cs-links {      font-size: 16px; } }  @media (min-width: 53.75em) {    .cs-links > div {      width: 33.33333%;      float: left; } }.project-link, .cs-link {  height: 19em;  position: relative; }.project-link {  position: relative;  background-size: cover;  background-position: center; }  .project-link:before {    position: absolute;    top: 0.75em;    left: 0.75em;    right: 0.75em;    bottom: 0.75em;    display: block;    background-color: transparent;    -webkit-transition: background-color 300ms ease-in-out;            transition: background-color 300ms ease-in-out;    content: ""; }  .project-link:hover:before {    background-color: rgba(0, 0, 0, 0.5); }.link-text {  position: relative;  top: 50%;  -webkit-transform: translateY(-50%);      -ms-transform: translateY(-50%);          transform: translateY(-50%);  text-align: center; }  .link-text a {    color: #fff; }  .link-text:hover {    text-decoration: underline; }  .link-text h4, .link-text h5, .link-text p {    color: #fff;    text-transform: uppercase;    padding-top: 0;    margin-bottom: 0; }.link-image p {  display: none; }.cs-link .link-text a:hover {  text-decoration: none; }#s485112 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/about-hero.jpg"); }#s485115 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/lite-bg.jpg"); }#s485116 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/pro-bg.jpg"); }/* complete */  #s8401670 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/custom-dev-bg.jpg"); }#s485117 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/ecom-bg.jpg"); }#s485128 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/sports-bg.jpg"); }#s485129 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/hospitality-bg.jpg"); }#s6756454 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/hospitality-bg.jpg"); }#s485131 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/financial-bg.jpg"); }#s485126 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/property-bg.jpg"); }#s485125 .hero, #s1515203 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/recruitment-bg.jpg"); }#s485127 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/fashion-bg.jpg"); }#s485130 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/retail-bg.jpg"); }#s485132 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/bar-restaurant-bg.jpg"); }#s485120 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/logo-bg.jpg"); }#s485121 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/seo-bg.jpg"); }#s485133 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/cms-bg.jpg"); }#s485134 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/design-process-bg.jpg"); }#s485135 .hero, .d12936 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/faq-bg.jpg"); }#s485138 .hero, #s545327 .hero, #s853557 .hero, #s1512455 .hero, #s7110744 .hero, #s7110796 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/contact-bg.jpg"); }#s8292953 .hero, #s545327 .hero, #s853557 .hero, #s1512455 .hero, #s7110744 .hero, #s7110796 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/contact-bg.jpg"); }#s485142 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/not-found-bg.jpg"); }#s531396 .hero, #s548369 .hero, #s548408 .hero, #s565912 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/thanks-bg.jpg"); }#s485114 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/micro-bg.jpg"); }#s485122 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/360-bg.jpg"); }#s7565450 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/360-bg.jpg"); }#s485123 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/custom-dev-bg.jpg"); }#s7112439 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/360-bg.jpg"); }#s7010073 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/custom-dev-bg.jpg"); }#s497110 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/email-marketing-bg.jpg"); }#s730296 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/advanced-bg.jpg"); }#s8292808 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/advanced-bg.jpg"); }#s8525921 .hero {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/investors-page.jpg"); }.bg-cover {  background-size: cover;  background-repeat: no-repeat;  background-position: center; }.about-value {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/value-bg.jpg");  background-position: center center; }.about-history {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/history-bg.jpg");  background-position: center center; }.design-bristol {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/design-bristol.jpg");  background-position: bottom center; }.buy-buttons, .custom-form {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/buy-button-bg.jpg"); }.seo-results {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/seo-results.jpg"); }.cms-easy {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/cms-easy.jpg"); }.cms-ecommerce {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/cms-ecommerce.jpg"); }.cms-coding {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/cms-edit.jpg"); }.contact-1 {  display: none;  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/contact-1.jpg"); }  @media (min-width: 50em) {    .contact-1 {      display: block; } }.contact-2 {  display: none;  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/contact-2.jpg"); }  @media (min-width: 50em) {    .contact-2 {      display: block; } }.contact-3 {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/contact-3.jpg"); }.custom-hosting {  background-image: url("/smarter-web-company-co-uk/_img/images/hosted-solution.jpg"); }.custom-support {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/cms-edit.jpg"); }.custom-plan {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/custom-plan-bg.jpg"); }.custom-pricing {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/custom-price-bg.jpg"); }.icon-responsive:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/responsive.svg"); }.icon-pages:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/pages.svg"); }.icon-cms:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/cms.svg"); }.icon-domain:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/domain.svg"); }.icon-email:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/email.svg"); }.icon-form:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/form.svg"); }.icon-video:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/video-image-icon1.svg"); }  .icon-blog:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/blog.svg"); }.icon-pie:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/pie.svg"); }.icon-options:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/options2.svg"); }.icon-payment:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/payment.svg"); }.icon-bespoke:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/bespoke.svg"); }.icon-social:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/social.svg"); }.icon-calc:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/calc.svg"); }.icon-maps:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/map.svg"); }.icon-search:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/search.svg"); }.icon-software:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/software.svg"); }.icon-listing:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/listing.svg"); }.icon-ecommerce:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/ecommerce.svg"); }.icon-design:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/design.svg"); }.icon-uk:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/globe.svg"); }.icon-stationary:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/stationary.svg"); }.icon-vector:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/vector.svg"); }.icon-printer:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/printer.svg"); }.icon-strategy:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/graph.svg"); }.icon-ppc:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/cursor.svg"); }.icon-manage:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/calendar.svg"); }.icon-unsubscribe:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/unsubscribe.svg"); }.icon-broadcast:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/broadcast.svg"); }.icon-templates:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/template.svg"); }.icon-manage-lists:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/manage-lists.svg"); }.icon-payment-gateway:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/payment-gateway.svg"); }.icon-team:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/team.svg"); }.icon-money:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/money.svg"); }.icon-images:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/images.svg"); }.icon-barcode:before {  background-image: url("/smarter-web-company-co-uk/_img/images/svg/barcode.svg"); }.collapse-card {  background-color: #FFFFFF;  border-bottom: 1px solid #ddd;  color: #999;  -webkit-transition: all 0.4s ease;          transition: all 0.4s ease;  margin: 5px 0; }  .collapse-card.active {    box-shadow: 0 8px 15px 0 rgba(0, 0, 0, 0.1), 0 6px 20px 0 rgba(0, 0, 0, 0.08);    z-index: 200;    margin: 1rem -1rem; }  .collapse-card .collapse-card__heading:hover::after {    -webkit-transform: scale(1.02);        -ms-transform: scale(1.02);            transform: scale(1.02); }.collapse-card__heading {  cursor: pointer;  padding: 1rem;  position: relative; }  .collapse-card__heading:before,  .collapse-card__heading:after {    content: " ";    display: table; }  .collapse-card__heading:after {    clear: both; }  .active .collapse-card__heading {    background-color: #aaa; }.collapse-card__title {  font-size: 14px;  line-height: 2rem;  margin: 0 2rem 0 0;  overflow: hidden;  text-overflow: ellipsis;  white-space: nowrap;  font-family: brandon-grotesque, sans-serif; font-weight: 700;  color: #333;  text-transform: uppercase;  -webkit-transition: color 200ms ease;          transition: color 200ms ease; }  .active .collapse-card__title {    color: #fff; }  @media (min-width: 25em) {    .collapse-card__title {      font-size: 16px; } }  @media (min-width: 40em) {    .collapse-card__title {      font-size: 1.05469em; } }.collapse-card__body {  padding: 1.5em;  display: none;  color: #222;  font-size: 1.05469em; }  @media (min-width: 40em) {    .collapse-card__body {      padding: 2em; } }.plus-icon {  fill: #333;  height: 1.5em;  width: 1.5em;  position: absolute;  right: 1em;  top: 50%;  -webkit-transform: translateY(-50%) rotate(0deg);      -ms-transform: translateY(-50%) rotate(0deg);          transform: translateY(-50%) rotate(0deg);  -webkit-transition: all 300ms linear;          transition: all 300ms linear; }  .active .plus-icon {    -webkit-transform: translateY(-50%) rotate(495deg);        -ms-transform: translateY(-50%) rotate(495deg);            transform: translateY(-50%) rotate(495deg);    height: 1.75em;    width: 1.75em;    fill: #fff; }#s545214 {  padding: 3em;  background: #f39220; }.ticketSummary, .ticketFeedback, .ticketNotes, .ticketOriginal, .smarterFeedbackError, .smarterFeedbackSuccess {  width: 100%;  max-width: 75em;  overflow: hidden;  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.2);  margin: 0 auto 2em;  background: #fff;  border-radius: 5px;  -webkit-transition: all 300ms ease-in-out;          transition: all 300ms ease-in-out; }  .ticketSummary h2, .ticketFeedback h2, .ticketNotes h2, .ticketOriginal h2, .smarterFeedbackError h2, .smarterFeedbackSuccess h2 {    margin-bottom: 0; }.ticketSummary:hover, .ticketFeedback:hover, .ticketNotes:hover, .ticketOriginal:hover {  box-shadow: 0 5px 10px 0 rgba(0, 0, 0, 0.35);  -webkit-transition: all 300ms ease-in-out;          transition: all 300ms ease-in-out; }.ticketSummaryRowWrap {  width: 100%;  display: table; }.ticketSummaryLabel {  display: inline-block;  display: table-cell;  vertical-align: middle;  padding: 1em;  width: 40%;  border-bottom: 1px solid #222;  background: #333;  color: #ccc;  font-family: brandon-grotesque, sans-serif; font-weight: 500;  text-transform: uppercase; }.ticketSummaryRowWrap:hover .ticketSummaryLabel {  background: #111;  color: #fff; }.ticketSummaryValue {  display: inline-block;  display: table-cell;  vertical-align: middle;  padding: 1em;  width: 60%;  border-bottom: 1px solid #ddd;  background: #fff;  color: #444;  font-family: brandon-grotesque, sans-serif; font-weight: 400; }.ticketSummaryRowWrap:hover .ticketSummaryValue {  background: #f7f7f7;  color: #111; }.ticketFeedbackInner, .ticketOriginalInner {  padding: 1em 1.5em; }.ticketFeedbackInner p:first-of-type {  margin-top: 0; }.ticketFeedback h2, .ticketNotes h2, .ticketOriginal h2 {  display: block;  padding: 0.7em 1em;  color: #fff;  background: #333;  font-size: 1.6em;  text-align: center; }.ticketFeedback p, .ticketOriginal p {  font-family: brandon-grotesque, sans-serif; font-weight: 400;  color: #222; }.ticketFeedback form {  width: 100%;  margin-top: 2em; }.smarterFormWrap {  padding: 1em;  background: #ebeef1; }.smarterFormItemTitle {  color: #222;  font-family: brandon-grotesque, sans-serif; font-weight: 500;  font-size: 1.6em;  margin-bottom: 0.25em; }.smarterFormItemInput textarea {  min-height: 10em;  width: 100%;  border: 1px solid #ccc;  padding: 1em; }a.smarterFormItemButtonWrapButton {  display: block;  padding: 0.5em 1.25em;  margin: 0.75em auto;  font-family: 'OpenSansSemibold',  Arial,  "Helvetica Neue",  Helvetica,  sans-serif;  font-size: 0.95em;  color: #fff;  text-decoration: none;  border-radius: 5px;  -webkit-transition: -webkit-transform 0.2s ease-in-out;          transition: transform 0.2s ease-in-out;  background-color: #029ed9;  text-align: center; }a.smarterFormItemButtonWrapButton:hover {  background: #32c1f7;  -webkit-transition: -webkit-transform 0.2s ease-in-out;          transition: transform 0.2s ease-in-out; }a.smarterFormItemButtonWrapButton:active {  background: #0272ac;  -webkit-transition: -webkit-transform 0.2s ease-in-out;          transition: transform 0.2s ease-in-out; }.ticketNotes table {  border-collapse: collapse;  width: 100%; }.ticketNotes table tbody {  width: 100%; }.ticketNotes table.concepts.large-only {  display: none; }.ticketNotes table.concepts.small-only {  font-size: 14px; }.stacktable {  width: 100%; }.st-head-row {  padding-top: 1em; }.st-head-row.st-head-row-main {  font-size: 1.5em; }.st-key {  width: 40%;  text-align: right;  padding-right: 1%; }.st-val {  width: 60%;  padding-left: 1%; }.ticketNotes th {  background-color: #888;  font-family: brandon-grotesque, sans-serif; font-weight: 500;  font-size: 1.125em;  color: #fff;  border: 1px solid #555;  padding: 0.5em; }.ticketNotes th:nth-child(1) {  width: 15%; }.ticketNotes th:nth-child(2) {  width: 15%; }.ticketNotes th:nth-child(3) {  width: 70%; }.ticketNotes tr:nth-child(even) {  background: #f2f5f8; }.ticketNotes tr:nth-child(odd) {  background: #fff; }.ticketNotes tr:hover {  background: #d4d9de; }.ticketNotes td {  border: 1px solid #ddd;  padding: 1em 0.8em;  color: #222;  font-family: brandon-grotesque, sans-serif; font-weight: 400; }.ticketNotes td p {  color: #222;  font-family: brandon-grotesque, sans-serif; font-weight: 400;  margin: 0; }.ticketNotes td p + p {  margin-top: 1em; }.ticketNotes tr:hover td {  border-color: #ccc; }.smarterFeedbackError, .smarterFeedbackSuccess {  background: firebrick;  color: #fff;  padding: 1em;  font-family: brandon-grotesque, sans-serif; font-weight: 400; }.smarterFeedbackSuccess {  background: #71C341; }@media only screen and (min-width: 550px) {  #s545214 {    padding: 3em; }  .ticketSummaryLabel {    width: 25%; }  .ticketSummaryValue {    width: 75%; }  .ticketFeedbackInner, .ticketOriginalInner {    padding: 2em; }  .smarterFormWrap {    padding: 1em 2em; }  a.smarterFormItemButtonWrapButton {    display: inline-block;    font-size: 1.125em; }  .ticketFeedback h2, .ticketNotes h2, .ticketOriginal h2 {    text-align: left; }  .ticketNotes table.concepts.small-only {    display: none; }  .ticketNotes table.concepts.large-only {    display: table; } }@font-face {  font-family: 'Elsie-Black';  src: url("/smarter-web-company-co-uk/_img/fonts/ElsieSwashCaps-Black.eot");  src: url("/smarter-web-company-co-uk/_img/fonts/ElsieSwashCaps-Black.eot?#iefix") format("embedded-opentype"), url("/smarter-web-company-co-uk/_img/fonts/ElsieSwashCaps-Black.woff") format("woff"), url("/smarter-web-company-co-uk/_img/fonts/ElsieSwashCaps-Black.ttf") format("truetype"), url("/smarter-web-company-co-uk/_img/fonts/ElsieSwashCaps-Black.svg#ElsieSwashCaps-Black") format("svg");  font-weight: normal;  font-style: normal; }.christmas-banner {  background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/xmas-banner.jpg");  background-repeat: no-repeat;  background-size: cover;  background-color: #fff;  display: -webkit-box;  display: -webkit-flex;  display: -ms-flexbox;  display: flex;  position: relative;  width: 100%;  -webkit-box-align: center;  -webkit-align-items: center;      -ms-flex-align: center;          align-items: center;  -webkit-box-pack: center;  -webkit-justify-content: center;      -ms-flex-pack: center;          justify-content: center;  padding: 5em 0; }  @media (min-width: 72.5em) {    .christmas-banner {      padding: 8em 0; } }.christmas-content {  width: 88%;  max-width: 69em;  margin: auto;  text-align: center; }  .christmas-content h5 {    font-family: brandon-grotesque, sans-serif; font-weight: 400;    line-height: 1.5;    text-transform: none;    font-size: 1.33484em; }    @media (min-width: 40em) {      .christmas-content h5 {        font-size: 1.50169em; } }  .no-flexbox .christmas-content {    position: absolute;    top: 50%;    left: 50%;    -webkit-transform: translate(-50% -50%);        -ms-transform: translate(-50% -50%);            transform: translate(-50% -50%); }.christmas-font {  font-family: 'Elsie-Black', Georgia, Times, "Times New Roman", serif;  color: #e31616;  line-height: 1.1;  text-transform: none;  padding-top: 0.15em;  margin-bottom: 0.25em;  font-size: 2.40542em; }  @media (min-width: 30em) {    .christmas-font {      font-size: 3.04436em; } }  @media (min-width: 48em) {    .christmas-font {      font-size: 3.85302em; } }  @media (min-width: 72.5em) {    .christmas-font {      font-size: 4.87648em; } }  .backgroundcliptext .christmas-font {    -webkit-background-clip: text;    background-clip: text;    color: transparent;    background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/xmas-text.jpg");    background-size: cover;    background-repeat: no-repeat;    background-position: center; }.deer-icon svg {  width: 3em;  height: auto; }@-webkit-keyframes numbers-in {  0% {    -webkit-transform: rotateX(94deg);            transform: rotateX(94deg);    opacity: 0;    letter-spacing: 10px; }  10% {    -webkit-transform: rotateX(82deg);            transform: rotateX(82deg);    opacity: 1; }  100% {    -webkit-transform: rotateX(0deg);            transform: rotateX(0deg);    letter-spacing: -1px; } }@keyframes numbers-in {  0% {    -webkit-transform: rotateX(94deg);            transform: rotateX(94deg);    opacity: 0;    letter-spacing: 10px; }  10% {    -webkit-transform: rotateX(82deg);            transform: rotateX(82deg);    opacity: 1; }  100% {    -webkit-transform: rotateX(0deg);            transform: rotateX(0deg);    letter-spacing: -1px; } }.cms-stat__wrap {  width: 92%;  max-width: 90em;  margin: auto; }.cms-stat__item {  -webkit-perspective: 1000px;  perspective: 1000px;  -webkit-perspective-origin: 50% 50%;  perspective-origin: 50% 50%; }  .cms-stat__item:last-child {    margin-bottom: 0; }    .cms-stat__item:last-child .stat-wrap {      border-bottom: none; }  @media (min-width: 43.75em) and (max-width: 78.125em) {    .cms-stat__item {      width: 32%;      display: inline-block;      margin-bottom: 0; }      .cms-stat__item:nth-child(1) {        display: block;        width: 100%; }      .cms-stat__item:nth-child(3), .cms-stat__item:nth-child(4) {        border-left: 1px solid rgba(255, 255, 255, 0.5); } }  @media (min-width: 78.125em) {    .cms-stat__item {      margin-bottom: 0;      width: 24%;      display: inline-block;      vertical-align: middle; } }  .cms-stat__item .title {    text-align: center;    margin-bottom: 2.5em; }    .cms-stat__item .title h2 {      padding-top: 0; }    @media (min-width: 78.125em) {      .cms-stat__item .title {        text-align: left;        margin-bottom: 0; }        .cms-stat__item .title .divider:after {          margin: 0.4em 0; } }  .cms-stat__item .stat-wrap {    text-align: center;    padding-bottom: 2em; }    @media (min-width: 43.75em) {      .cms-stat__item .stat-wrap {        border-bottom: none;        padding-bottom: 0; } }    @media (min-width: 78.125em) {      .cms-stat__item .stat-wrap {        border-left: 1px solid rgba(255, 255, 255, 0.5); } }  .cms-stat__item .stat-number {    font-size: 3.85302em;    font-family: brandon-grotesque, sans-serif; font-weight: 900;    color: #fff;    text-shadow: 0 6px 15px rgba(0, 0, 0, 0.2);    -webkit-transform-style: preserve-3d;            transform-style: preserve-3d; }    @media (min-width: 43.75em) {      .cms-stat__item .stat-number {        font-size: 2.7061em; } }    @media (min-width: 57.5em) {      .cms-stat__item .stat-number {        font-size: 3.85302em; } }    .inviewport .cms-stat__item .stat-number {      -webkit-animation: numbers-in 1500ms linear both 100ms;              animation: numbers-in 1500ms linear both 100ms; }  .cms-stat__item p {    font-size: 15px;    text-transform: uppercase;    line-height: 1.1;    margin-bottom: 0; }/* New Stripe Styling */#stripePaymentFormIntro p {padding: 15px; background-color: #d9edf7; border:1px solid #31708f; color: #31708f;}#pnlStepSuccess #stripeWrap #stripePaymentForm #stripePaymentFormWrap input#cardholder-name {border: 1px solid #929292 !important;}#cardholder-name {border-radius: 0px !important; border: 1px solid #929292 !important; padding: 15px; width: 100%; background: #fff !important;  margin-bottom: 10px; color: #333 !important; font-family: arial, helvetica, sans-serif !important; text-transform: none !important; font-weight: normal !important;}#cardholder-name:hover {opacity: 1 !important;}#cardholder-name::-webkit-input-placeholder {color: #929292; font-family: arial, helvetica, sans-serif !important; text-transform: none !important; font-weight: normal !important; font-size: 14px; }#cardholder-name::-moz-placeholder {color: #929292; font-family: arial, helvetica, sans-serif !important; text-transform: none !important; font-weight: normal !important; font-size: 14px; }#cardholder-name::-ms-placeholder {color: #929292; font-family: arial, helvetica, sans-serif !important; text-transform: none !important; font-weight: normal !important; font-size: 14px; }#cardholder-name::placeholder {color: #929292; font-family: arial, helvetica, sans-serif !important; text-transform: none !important; font-weight: normal !important; font-size: 14px; }.CardField-number input.InputElement {width: 100% !important; display: block !important; padding: 15px 25px 15px 25px !important; background: #fff !important;}.CardField-expiry input {width: 100%; display: block; padding: 15px 25px 15px 25px; background: #fff;}#card-button {color: #fff; transition: all 0.5s ease 0s;  display: inline-block; padding: 15px 25px; font-size: 19px; font-size: 1.1875em; font-family: 'Barlow', sans-serif; font-weight: 700; border: 0px; background: rgba(27,194,30, 1); border: 2px solid #028f05; text-transform: uppercase;}/*.btnPayPal:after {content:url("/psdesignsglobal-com/_img/img/btn-arrows.svg"); width: 20px; height: 20px; display: inline-block; vertical-align: -1px; margin-left: 30px;}*/#card-button:hover {opacity:0.8;}#card-button {cursor: pointer; border: 0px; padding: 15px 30px 15px 30px; display: inline-block; transition: all 0.5s ease 0s; font-family: brandon-grotesque, sans-serif; font-weight: 700;  font-style: normal; font-size: 20px; font-size: 1.25em; background: #168dd0; color: #fff; }#card-button:hover {background: #fff; opacity: 0.8; color: #168dd0;}#card-element {width: 100%; display: block; padding: 15px 25px; background: #fff; border: 1px solid #929292;}#card-button {margin-top: 25px; }#stripePaymentFormError {padding: 20px; background-color: #f2dede; border: 1px solid #a94442; color: #a94442;}#stripePaymentFormError h2 {color: #a94442;}#stripePaymentFormError p {color: #a94442;}#stripePaymentFormSuccess {padding: 20px; background-color: #dff0d8; border: 1px solid #3c763d; color: #3c763d}#stripePaymentFormSuccess  h2 {color: #3c763d;}#stripePaymentFormSuccess  p {color: #3c763d;}#card-errors.show {padding: 20px; background-color: #f2dede; border: 1px solid #a94442; color: #a94442; margin-bottom: 20px; display: block !important;}#stripeWrap {width: 50%; display: block; margin: 0 auto; border: 1px solid #bdbdbd; background: #f5f5f5; padding: 20px;}#stripeWrap h2 {width: 100%; text-align: center; margin-bottom: 15px; font-size: 25px;}#stripeWrap #pnlStepSuccess form , #stripePaymentForm {width: 100% !important;}#pnlStepSuccess #stripeWrap #stripePaymentFormError p {padding: 0px !important; margin: 0px !important;  border: 0px; background: 0px; width: 100% !important;}#payPalWrap {width: 49%; float: left; border: 1px solid #bdbdbd; background: #f5f5f5; padding: 20px; text-align: center;}#payPalWrap h2 {width: 100%; text-align: center; margin-bottom: 15px; font-size: 25px;}#payPalWrap form {width: 100%;}#payPalWrap .btnPayPal {display: inline-block;}#pnlStepSuccess div#stripeWrap div#stripePaymentFormSuccess p {padding: 0px !important; margin: 0px !important;  border: 0px; background: 0px; width: 100% !important;}/* END New Stripe Styling *//*.blog-item {width: 48%; margin: 0 1% 20px 1%; float: left;  background: #fff; border-bottom: 5px solid #f39220;}*/.blog-title {width: 100%; padding: 10px 20px;}.blog-title h3 {font-size: 25px;  margin-bottom: 0px;}.blog-date {padding: 0 20px; color: #f39220;}.blog-date p { color: #f39220;}.hero-content {position: relative; z-index: 1;}.darken-overlay {background:rgba(0,0,0,0.7); position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 0;}.blog-inner-content ul {margin-left: 20px;}.blog-inner-content ul li {list-style-type: disc; font-size: 18px;}.blog-wrapper {   column-count: 1;  column-gap: 1em;}.blog-item {   display: flex;  margin: 0 0 1em;  width: 100%;  background: #fff; border-bottom: 5px solid #f39220;  align-items: center;}.blog-item:nth-of-type(even) {flex-direction: row-reverse;}.blog-image {width: 50%; background:url('https://www.smarterwebcompany.co.uk:443/smarter-web-company-co-uk/_img/images/placeholder.jpg'); background-size: cover; background-position: center center; min-height: 200px;}.blog-image img {display:  block;}.blog-title-date {width: 50%;}.insights-pullout {background: #e9e9e9;}.insights-pullout-header {text-align: center; margin-bottom: 30px; }.insights-pullout .blog-wrapper {-webkit-column-count:2; -moz-column-count:2; column-count:2; -webkit-column-gap:.0em; -moz-column-gap:.0em; column-gap:.0em; display: flex;}.blog-item.item.Not.Live {display:  none;}.insights-pullout .blog-image {padding-top: 65%;}#s485125 .package-examples .project-item:nth-child(1),#s485125 .package-examples .project-item:nth-child(2),#s485125 .package-examples .project-item:nth-child(3),#s485125 .package-examples .project-item:nth-child(4) {    width: 50.00%;    font-size: 14px;}#s6756454 .package-examples .project-item:nth-child(1),#s6756454 .package-examples .project-item:nth-child(2),#s6756454 .package-examples .project-item:nth-child(3),#s6756454 .package-examples .project-item:nth-child(4) {    width: 50.00%;    font-size: 14px;}#s485130 .package-examples .project-item:nth-child(1),#s485130 .package-examples .project-item:nth-child(2),#s485130 .package-examples .project-item:nth-child(3),#s485130 .package-examples .project-item:nth-child(4) {    width: 50.00%;    font-size: 14px;}#s485117 .package-examples .project-item:nth-child(1),#s485117 .package-examples .project-item:nth-child(2),#s485117 .package-examples .project-item:nth-child(3),#s485117 .package-examples .project-item:nth-child(4) {    width: 50%;    font-size: 14px;}#s485127 .package-examples .project-item:nth-child(1),#s485127 .package-examples .project-item:nth-child(2),#s485127 .package-examples .project-item:nth-child(3),#s485127 .package-examples .project-item:nth-child(4) {    width: 33.33%;    font-size: 14px;}#s485131 .package-examples .project-item:nth-child(1),#s485131 .package-examples .project-item:nth-child(2),#s485131 .package-examples .project-item:nth-child(3),#s485131 .package-examples .project-item:nth-child(4) {    width: 50.00%;    font-size: 14px;}#s485126 .package-examples .project-item:nth-child(1),#s485126 .package-examples .project-item:nth-child(2),#s485126 .package-examples .project-item:nth-child(3),#s485126 .package-examples .project-item:nth-child(4) {    width: 50.00%;    font-size: 14px;}#s485128 .package-examples .project-item:nth-child(1),#s485128 .package-examples .project-item:nth-child(2),#s485128 .package-examples .project-item:nth-child(3),#s485128 .package-examples .project-item:nth-child(4) {    width: 50.00%;    font-size: 14px;}#s485129 .package-examples .project-item:nth-child(1),#s485129 .package-examples .project-item:nth-child(2),#s485129 .package-examples .project-item:nth-child(3),#s485129 .package-examples .project-item:nth-child(4) {    width: 50.00%;    font-size: 14px;}#s485114 .package-examples .project-item:nth-child(1),#s485114 .package-examples .project-item:nth-child(2),#s485114 .package-examples .project-item:nth-child(3),#s485114 .package-examples .project-item:nth-child(4) {    width: 50%;    font-size: 14px;}#s8525921 .package-examples .project-item:nth-child(1),#s8525921 .package-examples .project-item:nth-child(2),#s8525921 .package-examples .project-item:nth-child(3),#s8525921 .package-examples .project-item:nth-child(4) {    width: 50%;    font-size: 14px;}#s485115 .package-examples .project-item:nth-child(1),#s485115 .package-examples .project-item:nth-child(2),#s485115 .package-examples .project-item:nth-child(3),#s485115 .package-examples .project-item:nth-child(4) {    width: 50%;    font-size: 14px;}#s485116 .package-examples .project-item:nth-child(1),#s485116 .package-examples .project-item:nth-child(2),#s485116 .package-examples .project-item:nth-child(3),#s485116 .package-examples .project-item:nth-child(4) {    width: 50%;    font-size: 14px;} @media all and (max-width: 768px) and (min-width: 0px) {.blog-wrapper { /* Masonry container */  column-count: 1;  column-gap: 1em;}} @media all and (max-width: 650px) and (min-width: 0px) {.blog-wrapper { /* Masonry container */  column-count: 1;  column-gap: 1em;}.blog-item,.blog-item:nth-of-type(even) {flex-direction: column;}.blog-image {width:  100%;}.blog-title-date {width:  100%;}.insights-pullout .blog-wrapper {-webkit-column-count:1; -moz-column-count:1; column-count:1; -webkit-column-gap:.0em; -moz-column-gap:.0em; column-gap:.0em; display: block;}#s485125 .package-examples .project-item:nth-child(1),#s485125 .package-examples .project-item:nth-child(2),#s485125 .package-examples .project-item:nth-child(3),#s485125 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s6756454 .package-examples .project-item:nth-child(1),#s6756454 .package-examples .project-item:nth-child(2),#s6756454 .package-examples .project-item:nth-child(3),#s6756454 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485114 .package-examples .project-item:nth-child(1),#s485114 .package-examples .project-item:nth-child(2),#s485114 .package-examples .project-item:nth-child(3),#s485114 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485115 .package-examples .project-item:nth-child(1),#s485115 .package-examples .project-item:nth-child(2),#s485115 .package-examples .project-item:nth-child(3),#s485115 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485116 .package-examples .project-item:nth-child(1),#s485116 .package-examples .project-item:nth-child(2),#s485116 .package-examples .project-item:nth-child(3),#s485116 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485117 .package-examples .project-item:nth-child(1),#s485117 .package-examples .project-item:nth-child(2),#s485117 .package-examples .project-item:nth-child(3),#s485117 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485130 .package-examples .project-item:nth-child(1),#s485130 .package-examples .project-item:nth-child(2),#s485130 .package-examples .project-item:nth-child(3),#s485130 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485127 .package-examples .project-item:nth-child(1),#s485127 .package-examples .project-item:nth-child(2),#s485127 .package-examples .project-item:nth-child(3),#s485127 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485131 .package-examples .project-item:nth-child(1),#s485131 .package-examples .project-item:nth-child(2),#s485131 .package-examples .project-item:nth-child(3),#s485131 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485126 .package-examples .project-item:nth-child(1),#s485126 .package-examples .project-item:nth-child(2),#s485126 .package-examples .project-item:nth-child(3),#s485126 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485128 .package-examples .project-item:nth-child(1),#s485128 .package-examples .project-item:nth-child(2),#s485128 .package-examples .project-item:nth-child(3),#s485128 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}#s485129 .package-examples .project-item:nth-child(1),#s485129 .package-examples .project-item:nth-child(2),#s485129 .package-examples .project-item:nth-child(3),#s485129 .package-examples .project-item:nth-child(4) {    width: 100%;    font-size: 14px;}}.feature-item p a {  color: #ffffff;  border-bottom: 1px dotted #fff;}.inner-intro p a {  color: rgba(255, 255, 255, 0.85);  border-bottom: 1px dotted #fff;}.inner-intro p a:hover {  color: rgba(243, 146, 32, 0.85);  border-bottom: 1px dotted #f39220;}.logo-mark {border-right: 0px !important;}/* Bitcoin banner */.bitcoin-banner {width: 100%; background:url("/smarter-web-company-co-uk/_img/images/bitcoin-banner-bg.jpg"); background-size: cover; padding: 3em 1em !important;}.bitcoin-content {width: 100%; max-width: 1200px; padding: 0 20px; margin: 0 auto; display: flex; align-items: center;}.bitcoin-content img {width: 100%; max-width: 250px; margin: 0 auto; display: block;}.bitcoin-left {width: 30%; margin-right: 2%; text-align: center; }.bitcoin-right {width: 68%; }.bitcoin-right h2,.bitcoin-right p {color: #fff !important;}.hero-content svg {width:  20px;}.hero-content .st0 {fill: #fff; transition: all 0.5s ease 0s;}.hero-content svg:hover .st0 {fill: #f39220;}.previewFrame #full-height-video {height: 500px; position: relative;}#full-height-video {height: 100vh; position: relative; background: url("/smarter-web-company-co-uk/_img/images/white-dot.png") #141414 repeat; ;}#full-height-video .hero-content {padding: 0px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}#training .split-image.bg-img .editItem {width: 100%; min-height: 40px;}.section-split-inner {display:  flex; align-items: center;}.section-split-left {width:  60%; margin-right:  2%; display:  none;}.section-split-left iframe {width:  100%;}.section-split-left p {margin:  0px;}.section-split-right {/*width:  38%;*/ width: 80%; margin: 0 auto; }.training-split-wrapper {width: 100%; display:  flex; padding:  0px;}.training-split-right {width:  50%;}.training-split-left {width:  50%; padding: 6em 0; position:  relative;}.training-split-left .content-wrap {    max-width: 75%;    margin: 0 auto;  }.training-split-left:after {border: 25px transparent solid;    border-bottom-color: transparent;    border-left-color: #fff;  position: absolute;  top: 50%;  right: -50px;  display: block;  content: "";  -webkit-transform: translateY(-50%);  -ms-transform: translateY(-50%);  transform: translateY(-50%);  }.training-split-left .content-wrap ul { font-size: 18px; }.training-split-left .content-wrap ul li {list-style-type: disc !important; list-style-position: inside; font-family: brandon-grotesque, sans-serif;  font-weight: 400;  line-height: 1.6;  font-weight: normal;  font-style: normal;  margin-bottom: 0.8em;  padding-top: 0.2em;  color: #333;}.training-split-left .content-wrap ul li::marker {color: #f39220;}.training-video-section ul { font-size: 18px; }.training-video-section ul li {list-style-type: disc !important; list-style-position: inside; font-family: brandon-grotesque, sans-serif;  font-weight: 400;  line-height: 1.6;  font-weight: normal;  font-style: normal;  margin-bottom: 0.8em;  padding-top: 0.2em;  color: #fff;}.training-video-section ul li::marker {color: #fff;}html {scroll-behavior: smooth;}.accordion {  font-family: Open Sans, sans-serif;  list-style: none;  padding: 0;  /*height: 55vh;*/  min-height: 550px;max-height: 650px;  overflow: hidden;  background: url("/smarter-web-company-co-uk/_img/images/white-dot.png") #000 repeat; position: relative; display: flex;}@media all and (min-width: 0px) {  .accordion > li {    float: right;    display: block;/*    height: 90vh;*//*min-height: 350px;*/    width: 33.33%;    overflow: hidden;    color: #fff;    text-decoration: none;    line-height: 1.5em;    cursor: pointer;position: relative;  }  .accordion > li .accordion__title {    text-transform: uppercase;/*    transform: rotate(90deg);*//*    transform-origin: bottom left;*//*    position: absolute;    top: 20px;*/    font-size: 25px;    font-weight:  700;    text-align: center;  }  .accordion > li:not(.active) .accordion__title:after {display: block;content:"View";padding: 5px 10px;  background-color: #f39220;  color: #fff;  line-height: 2;  border-radius: 1px;margin-top: 10px;font-size: 16px;width:  100px;margin:  10px auto 0 auto;  }.accordion__title {position: absolute; top: 50%; left:  0%; width:  100%; padding: 0 20px; transform: translateY(-50%);}  .accordion > li .accordion__text {    display: flex;    height: 100%;    visibility: hidden;  }  .accordion > li.active {    width: 60%;  }}  .accordion > li .color-overlay {display:  flex; align-items: center; justify-content: center; flex-direction: column; height: 100%;}  .accordion > li.active .color-overlay {/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#f39220+0,0164b5+100 */background: linear-gradient(135deg,  rgba(1,141,194,1) 0%,rgba(1,100,181,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ *//* background:rgba(1, 141, 194, 0.9);*/  display:  block; /*-webkit-backdrop-filter: blur(5px); backdrop-filter: blur(30px);*/}  .accordion > li:not(.active):hover .color-overlay {background:rgba(235, 68, 209, 0.9); /*-webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);*/} .accordion__Technical .color-overlay {background:rgba(0, 0, 0, 0.7); padding: 25px; width: 100%; height: 100%;}.accordion__flexible .color-overlay {background:rgba(0, 0, 0, 0.7); padding: 25px; width: 100%; height: 100%;}.accordion__accreditation .color-overlay {background:rgba(0, 0, 0, 0.7); padding: 25px; width: 100%; height: 100%;}.accordion__Technical {    background-size: cover;  background-position:  center center;}.accordion__flexible {     background-size: cover; background-position:  center center;  border-left: 1px solid #f39220;    border-right: 1px solid #f39220;}.accordion__accreditation {   background-size: cover; background-position:  center center;}.active .color-overlay {display: flex;}li.active .accordion__title {  transform: none;  position: relative !important;  top: initial;  display:  none;}li.active.complete .accordion__text {  display: flex;  position: relative;  left: 0;      visibility: visible;}li.active .accordion__title, li.active .accordion__text { /* margin: 25px;*/}.accordion__text ul li {list-style-type: disc !important; list-style-position: inside; font-family: brandon-grotesque, sans-serif;  font-weight: 300; font-size: 1.18652em; color: rgba(255, 255, 255, 0.85); margin-bottom: 5px;}.accordion__text {padding: 30px; display:  flex; align-items: center;}.accordion__text h2 {margin-bottom:  10px;}.accordion__text li:last-of-type {width:  100% !important;}#s8337301 .accordion {min-height: 650px; max-height:740px;}/* SEO Marketing Banner */.seo-count-up-banner {width: 100%; background: url("/smarter-web-company-co-uk/_img/images/white-dot.png") #111 repeat;}#s466567 .seo-count-up-banner, #s485121 .seo-count-up-banner {background: url("/smarter-web-company-co-uk/_img/images/white-dot.png") #f39220 repeat;}#s466567 .seo-count-up-banner .seo-counter-icon svg, #s485121 .seo-count-up-banner .seo-counter-icon svg {fill: #111; height: 50px;} /*#s466567 .seo-count-up-banner .counter-item .counter, #s485121 .seo-count-up-banner .counter-item .counter {color:#ff397a; }*/.seo-count-up-banner-inner-text p a {color: #fff; border-bottom: 1px dotted #fff; }.seo-count-up-banner-inner-text p a:hover {color: #f39220; border-bottom: 1px dotted #f39220;}.seo-count-up-banner-inner {max-width: 1200px; margin: 0 auto;}.seo-count-up-banner-inner-text {text-align: center;}.seo-count-up-banner-inner-text h2 {color: #fff; padding-top: 0px;}.seo-count-up-banner-inner-text h2:after {width: 4rem; height: 2px; background-color: #fff; display: block; content: ""; margin: 0.4em auto;}.seo-count-up-banner-inner-text p {color: #fff;}.seo-count-up-banner-inner-numbers {display:  flex; margin-top: 35px;}.counter-item {overflow: hidden; width: 24%;  margin-right: 1%; text-align: center;  border-radius: 10px; border: 1px solid #fff; display: flex; flex-direction: column; }.counter-item.grow {/*flex-grow: 2;*/}.counter-item h3 {font-size: 20px; color: #fff; margin: 0px; padding: 0px;}.counter {font-size: 50px; font-weight: 700; color: #111;}.seo-count-up-banner .counter {font-size: 50px; font-weight: 700; color: #f39220;}#s466567 .seo-count-up-banner .counter {font-size: 50px; font-weight: 700; color: #111;}.counter.plus:before {content:"+"; display:  inline-block;}.counter.minus:before {content:"-"; display:  inline-block;}.counter.percent:after {content:"%"; display:  inline-block;}.counter-text {color: #fff; font-size: 16px;}.seo-counter-icon {width: 100%; padding: 10px; text-align: center; background: #fff;}.seo-counter-icon svg {fill: #111; height: 50px;}.seo-counter-text {padding: 20px;}#s485121 .counter-item .seo-counter-text .counter {color: #111;}.split-banner-quote {width:100%; display:flex; padding: 0px; }.split-banner-left {display: flex; /*align-items: center;*/ justify-content: center; color: #fff; width: 50%; padding: 75px 20px; background: ; background: url("/smarter-web-company-co-uk/_img/images/white-dot.png") repeat #141414;}.split-banner-left-inner {width: 100%; max-width: 700px;}.split-banner-left h2 {color:#fff;}.split-banner-left h3 {color:#fff;}.split-banner-left p {color:#fff;}.split-banner-left-inner ul li {font-size:1.18652em; list-style-type: none; position: relative; padding-left: 30px;}.split-banner-left-inner ul li:before {background: url("/smarter-web-company-co-uk/_img/images/svg/logo-icon.svg"); background-repeat: no-repeat; background-size: contain; width: 20px; height: 20px;  content:""; margin-right: 10px; display:  inline-block; position: absolute; left: 0; top: 5px;}.split-banner-right {width: 50%; padding: 75px 20px; display: flex; align-items: center; justify-content: center;}.split-banner-right-inner {width: 100%; max-width: 700px;}.get-quote-banner.hero .hero-title h1 {font-size: 3.876em;}#s853557 .get-quote-banner {background-image: url("/smarter-web-company-co-uk/_img/images/home-hero.jpg"); }#s853557 .get-quote-banner .button.solid-button.blue-button {margin-top:0px;}#s853557 .get-quote-banner .hero-content {padding: 13em 0 7em; max-width: 65em !important;}.split-banner-right-inner label {  font-family: brandon-grotesque, sans-serif;  font-weight: 700;  font-size: 14px;  width: 100%;  margin-top: 0.5em;  display: block;}#s853557 .split-banner-right-inner textarea {height: 7em;}.testimonials-landing {width:100%; display: block; padding: 75px 0px; background-image: url("/smarter-web-company-co-uk/_img/images/testimonial-bg.jpg");  background-size: cover;  background-repeat: no-repeat;  background-color: #111;}.testimonial-new-output {width:100%; max-width: 1200px; padding:0px 20px; margin: 0 auto; display: flex; flex-wrap: wrap; }.testimonial-new-output .testimonial-item {padding:20px; background: #fff; border-radius: 5px; width: 32.33%; margin-right: 1%; margin-top: 0px; margin-bottom: 20px; padding-bottom: 85px; position:relative;}.testimonial-new-output .testimonial-text p {color: #000; font-size: 18px;}.testimonial-new-output .client-name {width:calc(100% - 40px); padding-top: 15px; margin-top:15px !important; border-top: 1px solid #f39220; color: #000 !important; position: absolute; bottom: 20px;}.testimonials-landing-inner-content h2 {color: #fff; text-align:center; margin-bottom: 30px;}.quote-mark {width:70px; height:70px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #f39220; margin-bottom: 20px;}.quote-mark svg {fill: #fff; width: 60%;}.landing-page-work {padding:  75px 0px 80px 0px; background: #f39220;}.landing-page-work h2 {text-align: center; color: #fff; padding-top: 0px;}.landing-page-work h2.divider:after {  width: 4rem;  height: 2px;  background-color: #000;  display: block;  content: "";  margin: 25px auto;}.landing-page-work-item {width: 100%; height: 100%; padding: 0 10px;}.landing-page-work-item-inner {width: 100%; display: flex; height: 100%; background: #fff; border-radius: 5px; overflow: hidden;}.landing-page-work-item-image {width: 50%; padding-top: 50%;}.landing-page-work-item-details {width: 50%; display:  flex; align-items: center; justify-content: center; padding: 40px 20px;}.landing-page-work-item-details-inner {width: 100%; text-align: left;}.landing-page-work-item-details-inner h3:after {margin: 20px 0px !important;}.landing-page-work-item-details-inner .border-button.white-button .button-text {border-color: #333;  color: #333;}.landing-page-work-item-details-inner .border-button.arrow-button.white-button i svg {fill: #333;}.landing-page-work .slick-track{    display: flex !important;}.landing-page-work .slick-slide{    height: inherit !important;}.landing-page-work .slick-slide>div {height: 100%;}.landing-page-work .slick-dots {margin-top: 25px; width: 100%; text-align: center; display:  flex; justify-content: center;}.landing-page-work .slick-dots li button {width: 10px; height: 10px; border-radius: 50%; background: #fff; margin-right: 5px;}.landing-page-work .slick-dots li button:hover {background: #000}.landing-page-work .slick-dots li.slick-active button {background: #000}#s8527126 .hero {background-image: url("/smarter-web-company-co-uk/_img/images/backgrounds/micro-bg.jpg");}.landing-page-work.grey {background: #e9e9e9;}.landing-page-work.grey h2 {color: #111;}.landing-page-work.grey h2:after {background-color: #f39220; }.landing-page-work.grey .slick-dots li button {width: 10px; height: 10px; border-radius: 50%; background: #f39220; margin-right: 5px;}.landing-page-work.grey .slick-dots li button:hover {background: #000}.landing-page-work.grey .slick-dots li.slick-active button {background: #000}#s485123 .black.custom-form label {color: #fff;}.features {background-color: #141414; }.features h2 {color: #f39220; }.feature-list h6 {color: #f39220;}#s8292808 .features,#s8401670 .features {background-color: #f39220;}#s8292808 .feature-list h6, #s8401670 .feature-list h6 {color: #fff;}#s8292808 .features h2, #s8401670 .features h2 {color: #fff;}.seo-count-up-banner {background-color:#f39220; }.seo-count-up-banner .counter {color: #111;}#s8401670 .seo-count-up-banner {background-color:#141414; }#s8401670 .seo-count-up-banner .counter {color: #fff;}.new-work-output>p {margin: 0px; padding: 0px;}@media all and (max-width: 1280px) and (min-width: 0px) {.landing-page-work-item-inner {flex-direction: column;}.landing-page-work-item-image {width: 100%; padding-top: 100%;}.landing-page-work-item-details {width: 100%; }.landing-page-work-item-inner {padding-bottom: 80px; position:relative; }.landing-page-work-item-details .button {position: absolute; bottom: 20px; width: calc(100% - 40px);}.landing-page-work-item-details .button a {width: 100%; display:  block;}.landing-page-work-item-details .button a span {width: 100%;}}@media all and (max-width: 1000px) and (min-width: 0px) {.landing-page-work-inner {padding: 0 20px;}}@media all and (max-width: 900px) and (min-width: 0px) {.split-banner-quote {flex-direction:column-reverse;}.split-banner-left {width:100%;}.split-banner-right {width:100%;}.testimonial-item {width: 49% !important; margin-right: 1%;}}@media all and (max-width: 650px) and (min-width: 0px) {.get-quote-banner.hero .hero-title h1 {font-size: 2.876em;}.testimonial-item {width: 100% !important; margin-right: 0;}}@media all and (max-width: 480px) and (min-width: 0px) {.get-quote-banner.hero .hero-title h1 {font-size: 1.876em;}}@media all and (max-width: 1560px) and (min-width: 0px) {.main-nav .menu > li {margin: 0 0.25em;}.main-nav .menu > li a {font-size: 0.8375em;}}@media all and (max-width: 1450px) and (min-width: 0px) {.accordion {min-height: 650px; max-height: 800px;}}@media all and (max-width: 1340px) and (min-width: 0px) {.main-nav {display:  none;}.mobile-login-button {display: inline-block; vertical-align: middle;}.headroom--top .mobile-login-button {padding-top: 15px;}.menu-btn {display: inline-block; vertical-align: middle;}  .show-menu .mobile-menu {    -webkit-transform: translateX(0);        -ms-transform: translateX(0);            transform: translateX(0);             z-index:  99;          }#s8337301 .accordion {min-height: 650px; max-height: 880px;}}@media all and (max-width: 1250px) and (min-width: 0px) {#s8337300 .accordion {min-height: 650px; max-height: 880px;}}@media all and (max-width: 1200px) and (min-width: 0px) {.accordion {height: initial; min-height: 650px; max-height: 800px;}.counter-item h3 {font-size: 18px;}}@media all and (max-width: 1090px) and (min-width: 0px) {.accordion {flex-direction: column;}.accordion > li {width:  100% !important; min-height: initial;}.accordion__flexible {  border-top: 1px solid #f39220;  border-bottom: 1px solid #f39220;}.accordion > li.active {width:  100% !important;}.accordion > li.active.complete {width:  100% !important; min-height: initial;}.accordion__text {padding: 0px; }.accordion li div.color-overlay {padding: 5%;}.accordion > li .accordion__text {display:  block; visibility: hidden;}.accordion > li.active.complete .accordion__text {display:  block; visibility: visible;}.accordion {  height: initial;max-height: initial;}#s8337300 .accordion {max-height: initial;}#s8337301 .accordion { max-height: initial;}}@media all and (max-width: 1074px) and (min-width: 0px) {.seo-count-up-banner-inner-numbers {flex-wrap: wrap;}.counter-item {width: 49%; margin-right: 1%; margin-bottom: 15px;}}@media all and (max-width: 1060px) and (min-width: 0px) {.headroom--top .mobile-login-button { padding-top: 0px;}}@media all and (max-width: 945px) and (min-width: 0px) {.training-split-wrapper {flex-direction: column; width:  100%;}.training-split-right {width:  100%; height: 350px;}.training-split-left {width:  100%;}.training-split-left:after {display:  none;}}@media all and (max-width: 768px) and (min-width: 0px) {.section-split-inner {flex-direction: column;}.section-split-left {width:  100%; margin-bottom: 25px;}.section-split-right {width:  100%;}}@media all and (max-width: 550px) and (min-width: 0px) {.bitcoin-content {flex-direction: column; align-items: initial; text-align: center;}.bitcoin-left,.bitcoin-right {margin-right: 0px; width: 100%;}.bitcoin-right h2.divider.divider-left:after {margin: 20px auto !important;}.bitcoin-content img {max-width: 165px;}.counter-item {width: 100%; margin-right: 0%;}}.insights-pullout-items .blog-wrapper .blog-item {flex-direction: column; width:  49%; margin-right:  1%;}.insights-pullout-items .blog-image {width:  100%;}.insights-pullout-items .blog-date {width: 100%;}@media all and (max-width: 650px) and (min-width: 0px) {.insights-pullout-items .blog-wrapper .blog-item {width:  100%; margin-right: 0px;}  }
/* */
