@charset "UTF-8";

@font-face {
    font-family: 'Geomanist';
    src: url('/fonts/geomanist-regular-webfont.eot');
    src: url('/fonts/geomanist-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/geomanist-regular-webfont.woff2') format('woff2'),
         url('/fonts/geomanist-regular-webfont.woff') format('woff'),
         url('/fonts/geomanist-regular-webfont.ttf') format('truetype'),
         url('/fonts/geomanist-regular-webfont.svg#geomanistregular') format('svg');
    font-weight: 400;
    font-style: normal;

}

@font-face {
    font-family: 'Geomanist';
    src: url('/fonts/Geomanist-Light.eot');
    src: url('/fonts/Geomanist-Light.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Geomanist-Light.woff2') format('woff2'),
        url('/fonts/Geomanist-Light.woff') format('woff'),
        url('/fonts/Geomanist-Light.svg#Geomanist-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Harabara';
    src: url('/fonts/Harabara.eot');
    src: url('/fonts/Harabara.eot?#iefix') format('embedded-opentype'),
        url('/fonts/Harabara.woff2') format('woff2'),
        url('/fonts/Harabara.woff') format('woff'),
        url('/fonts/Harabara.svg#Harabara') format('svg');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'BR Candor';
    src: url('/fonts/BRCandor-Black.eot');
    src: local('BR Candor Black'), local('BRCandor-Black'),
        url('/fonts/BRCandor-Black.eot?#iefix') format('embedded-opentype'),
        url('/fonts/BRCandor-Black.woff2') format('woff2'),
        url('/fonts/BRCandor-Black.woff') format('woff'),
        url('/fonts/BRCandor-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'BR Candor';
    src: url('/fonts/BRCandor-Bold.eot');
    src: local('/fonts/BR Candor Bold'), local('BRCandor-Bold'),
        url('/fonts/BRCandor-Bold.eot?#iefix') format('embedded-opentype'),
        url('/fonts/BRCandor-Bold.woff2') format('woff2'),
        url('/fonts/BRCandor-Bold.woff') format('woff'),
        url('/fonts/BRCandor-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: 'BR Candor';
    src: url('/fonts/BRCandor-Medium.eot');
    src: local('BR Candor Medium'), local('BRCandor-Medium'),
        url('/fonts/BRCandor-Medium.eot?#iefix') format('embedded-opentype'),
        url('/fonts/BRCandor-Medium.woff2') format('woff2'),
        url('/fonts/BRCandor-Medium.woff') format('woff'),
        url('/fonts/BRCandor-Medium.ttf') format('truetype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'BR Candor';
    src: url('/fonts/BRCandor-SemiBold.eot');
    src: local('BR Candor Semi Bold'), local('BRCandor-SemiBold'),
        url('/fonts/BRCandor-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('/fonts/BRCandor-SemiBold.woff2') format('woff2'),
        url('/fonts/BRCandor-SemiBold.woff') format('woff'),
        url('/fonts/BRCandor-SemiBold.ttf') format('truetype');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'BR Candor';
    src: url('/fonts/BRCandor-Regular.eot');
    src: local('BR Candor'), local('BRCandor-Regular'),
        url('/fonts/BRCandor-Regular.eot?#iefix') format('embedded-opentype'),
        url('/fonts/BRCandor-Regular.woff2') format('woff2'),
        url('/fonts/BRCandor-Regular.woff') format('woff'),
        url('/fonts/BRCandor-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'BR Candor';
    src: url('/fonts/BRCandor-Light.eot');
    src: local('BR Candor Light'), local('BRCandor-Light'),
        url('/fonts/BRCandor-Light.eot?#iefix') format('embedded-opentype'),
        url('/fonts/BRCandor-Light.woff2') format('woff2'),
        url('/fonts/BRCandor-Light.woff') format('woff'),
        url('/fonts/BRCandor-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

chtml, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, 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; }

audio, canvas, video {
  display: inline-block;
  *display: inline;
  *zoom: 1; }

audio:not([controls]) {
  display: none; }

[hidden] {
  display: none; }

strong {
  font-weight: bold; }

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%; }

body {
  background: #fff; }

.content {
  width: 980px;
  margin: 0 auto; }

.clearfix:before, .clearfix:after {
  content: "";
  display: table; }

.clearfix:after {
  clear: both; }

.clearfix {
  *zoom: 1; }
  
/* Header
–––––––––––––––––––––––––––––––––––––––––––––––––– */
header {padding: 1rem 0; overflow: auto; background-color: rgba(21, 21, 21, 0.5); position: absolute; top: 0; left: 0; width: 100%;}
  
  /* Logo
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #logo img {width: 152px;}
  
  /* Contact Details
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  .contactDetails p a {color: #ebedea;}
  .contactDetails p a:hover {color: #fff;}
  
  /* Burger Menu
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  .burgerMenu {display: none;}
  .burgerMenu button {width: auto; background-color: transparent; margin: 0; padding: 0; border: none; height: auto;}
  .burgerMenu button i {font-size: 25px; vertical-align: middle; color: #fff;}
  
  /* Nav
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  .header nav {margin: 0 auto; display: inline-block;}
  .header nav ul {margin: 0;}
  .header nav ul li {list-style: none; display: inline-block;}
  .header nav ul li a {color: #d3d5d2; font-size: 18px; font-family: 'BR Candor'; letter-spacing: 0px; font-weight: 300;}
  .header nav ul li#selected a {color: #fff;}
  .header nav ul li a:hover {color: #fff;}
  .header nav ul span {color: #a4a5a3;}
  
/* Text
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1 {margin: 0; font-family: 'BR Candor'; font-size: 45px; line-height: 50px; color: #151515; letter-spacing: 1px; font-weight: bold;}
h2 {margin: 0; font-family: 'BR Candor'; font-size: 40px; line-height: 45px; color: #151515; letter-spacing: 1px; font-weight: bold;}
h3 {margin: 0; font-family: 'BR Candor'; font-size: 30px; line-height: 35px; color: #151515; letter-spacing: 1px; font-weight: bold;}
h4 {margin: 0; font-family: 'BR Candor';}
h5 {margin: 0; font-family: 'BR Candor'; font-size: 15px; line-height: 20px; color: #151515; letter-spacing: 0px; font-weight: bold;}
h6 {margin: 0; font-family: 'BR Candor';}
p {margin: 0; font-family: 'BR Candor'; color: #151515; font-size: 15px; line-height: 23px; margin-bottom: 1rem; font-weight: 300;}
a {text-decoration: none; color: #151515; font-weight: 300;}
strong {font-weight: bold; color: #000; font-family: 'BR Candor'; letter-spacing: 2px;}

.h1 {margin: 0; font-family: 'BR Candor'; font-size: 45px; line-height: 50px; color: #151515; letter-spacing: 1px; font-weight: bold;}
.h2 {margin: 0; font-family: 'BR Candor'; font-size: 40px; line-height: 45px; color: #151515; letter-spacing: 1px; font-weight: bold;}
.h3 {margin: 0; font-family: 'BR Candor'; font-size: 30px; line-height: 35px; color: #151515; letter-spacing: 1px; font-weight: bold;}
.h4 {margin: 0; font-family: 'BR Candor'; font-weight: bold;}
.h5 {margin: 0; font-family: 'BR Candor'; font-size: 15px; line-height: 20px; color: #151515; letter-spacing: 0px; font-weight: bold;}
.h6 {margin: 0; font-family: 'BR Candor'; font-weight: bold;}

/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.btn {padding: 14px 25px; border-radius: 30px; font-size: 22px; font-family: 'BR Candor'; font-weight: 300; transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out;}

.btn-text {padding: 0; border-radius: 0; text-align: left;}
.btn-text img {width: 20%; display: inline-block; vertical-align: middle;}

.btn-text-large {font-size: 45px; line-height: 50px;}
.btn-text-large img {width: 13%;}

/* Offcanvas
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.offcanvas-end {border: none; width: 65%; background-color: #4b4b4b;}

.offcanvas-end .offcanvas-header {padding: 1.5rem 3rem 5rem 3rem;}
.offcanvas-end .offcanvas-header #logo img {width: 150px;}
.offcanvas-end .offcanvas-header button {width: auto; background-color: transparent; margin: 0; padding: 0; border: none; height: auto;}
.offcanvas-end .offcanvas-header button i {font-size: 25px; vertical-align: middle;}

.offcanvas-end .offcanvas-body {padding: 0 3rem;}
.offcanvas-end .offcanvas-body nav ul {margin: 0;}
.offcanvas-end .offcanvas-body nav ul li {list-style: none; margin-bottom: 3rem; text-align: center;}
.offcanvas-end .offcanvas-body nav ul li:last-child {margin-bottom: 0;}
.offcanvas-end .offcanvas-body nav ul li a {color: #fff; font-size: 18px; font-family: 'BR Candor'; letter-spacing: 0.5px; font-weight: 300;}
.offcanvas-end .offcanvas-body nav ul li#selected a {color: #fff;}
.offcanvas-end .offcanvas-body nav ul li a:hover {color: #fff;}

/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="text"]:focus, input[type="tel"]:focus, input[type="email"]:focus, textarea:focus {
    outline:none; border: none; border-bottom: 1px solid #151515;
}

input[type="text"], input[type="tel"], input[type="email"] {width: 100%; border: none; border-bottom: 1px solid #151515; border-radius: 0; padding: 0; height: 50px; margin-bottom: 2.5rem;}

textarea {width: 100%; border: none; border-bottom: 1px solid #151515; border-radius: 0; padding: 0; height: 130px; margin-bottom: 2.5rem;}

button, [type=submit] {background-color: transparent; border: none; color: #151515; font-size: 50px; line-height: 55px; font-family: 'BR Candor'; text-transform: none; padding: 0; text-align: right; margin: 0; margin-top: 1rem; letter-spacing: 0px; font-weight: 500;}

button img, [type=submit] img {width: 8%; display: inline-block; vertical-align: middle;}

.wpcf7-list-item {width: 100%; position: relative; display: inline; margin: 0 !important;}
.wpcf7-list-item input[type=checkbox] {width: auto; opacity: .00000001; position: absolute; left: 0; margin-left: 8px; margin-top: 14px;}
.wpcf7-list-item input[type=checkbox]:checked~.wpcf7-list-item-label::before {color: #fff;}
.wpcf7-list-item input[type=checkbox]:checked~.wpcf7-list-item-label::after {transform: rotate(-45deg) scale(1);}
.wpcf7-list-item input[type=checkbox]:focus+label::before {outline: 0;}
.wpcf7-list-item label {position: relative; min-height: 34px; display: inline-flex; align-items: center; padding-left: 40px; font-weight: 400; cursor: pointer; vertical-align: sub; font-family: inherit; font-size: 0.8rem; font-weight: 300; margin-top: 0;}
.wpcf7-list-item label:before {content: ''; position: absolute; left: 0; top: 0; margin: 4px; width: 22px; height: 22px; transition: transform .28s ease; border-radius: 0px; border: 1px solid #151515; background-color: #fff;}
.wpcf7-list-item .wpcf7-list-item-label:after {content: ''; display: block; width: 10px; height: 5px; border-bottom: 2px solid #151515; border-left: 2px solid #151515; transform: rotate(-45deg) scale(0); transition: transform ease .25s;will-change: transform; position: absolute; top: 12px; left: 10px;}
.wpcf7-list-item .wpcf7-list-item-label span {font-size: 12px; color: #151515; vertical-align: text-bottom; text-transform: none; font-family: 'BR Candor'; font-weight: 300; vertical-align: baseline;}
.wpcf7-list-item .wpcf7-list-item-label span a {color: #151515; text-decoration: none;}
.wpcf7-list-item .wpcf7-list-item-label span a:hover {color: #151515;}

/* Colours
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.bg-dark-grey {background-color: #151515;}
.bg-black {background-color: #151515;}

.text-black {color: #151515;}
.text-blue {color: #2a2f75;}
.text-white {color: #fff;}
.text-grey {color: #4b4b4b;}
.text-light-grey {color: #ebedea;}
.text-off-grey {color: #aaa9ab;}

/* Sections
–––––––––––––––––––––––––––––––––––––––––––––––––– */

  /* About Section
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #aboutSection {padding: 6rem 0; overflow: auto;}
  #aboutSection .heading {display: block; overflow: auto; margin-bottom: 1rem;}
  #aboutSection .heading img {width: 2%; display: inline-block;}
  #aboutSection .heading h1 {display: inline-block; vertical-align: top; float: right;}
  #aboutSection .text {display: block; width: 81%;}
  #aboutSection .text p {font-size: 45px; line-height: 50px;}
  
  /* Welcome Section
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #welcomeSection {padding: 6rem 0; overflow: auto;}
  #welcomeSection h2 {margin-bottom: 1.5rem;}
  #welcomeSection .text {display: block; width: 81%;}
  #welcomeSection .text p {font-size: 45px; line-height: 50px;}
  
  /* Work Section
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #workSection {padding-bottom: 6rem; overflow: auto;}
  
  /* Sub Banner
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #subBanner {padding: 6.5rem 0;}
  #subBanner .heading {margin-top: 3rem; margin-bottom: 6rem; overflow: auto;}
  #subBanner .heading h1 {float: right;}
  #subBanner .text p {font-size: 45px; line-height: 50px; width: 70%;}
  #subBanner .right {margin-top: 6rem; overflow: auto;}
  #subBanner .right p {float: right;}
  #subBanner .right p a {width: 60%; float: right;}
  #subBanner .right .arrowDown {width: 3%; float: right; margin-top: 1rem;}
  
  /* Service One
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #serviceOne {padding: 6rem 0;}
  #serviceOne h2 {margin-bottom: 11rem;}
  #serviceOne h3 {margin-bottom: 3rem;}
  #serviceOne .padding {padding-right: 5rem;}
  
  /* Service Two
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #serviceTwo h2 {margin-bottom: 11rem;}
  #serviceTwo h3 {margin-bottom: 3rem;}
  #serviceTwo .padding {padding-left: 5rem;}
  
  /* Testimonial
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #testimonial {padding-bottom: 6rem; overflow: auto;}
  #testimonial h2 {width: 70%; margin: 0 auto; display: block;}
  
  /* Contact Services
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #contactServices {padding-bottom: 6rem; overflow: auto;}
  #contactServices .padding {padding-right: 15rem;}
  #contactServices h2 {font-weight: 300; font-size: 46px; line-height: 54px; letter-spacing: 0;}
  
  /* Clients
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #clients h2 {margin-bottom: 4rem;}
  #clients .imgBox img {width: 70%; margin: 0 auto; display: block; margin-bottom: 4rem;}
  
  /* More This
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #morethis {padding-bottom: 6rem; overflow: auto;}
  #morethis h2 {margin-bottom: 3rem;}
  
  /* Contact Details
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #contactDetails {padding: 6rem 0; overflow: auto;}
  #contactDetails h3 {margin-bottom: 3rem;}
  #contactDetails .padding {padding-right: 5rem;}
  
  /* Contact
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #contact {padding-bottom: 6rem; overflow: auto;}
  #contact .padding {padding-right: 15rem;}
  #contact h2 {font-weight: 300; font-size: 46px; line-height: 54px; letter-spacing: 0;}
  
  /* Terms
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  #terms {padding: 6rem 0; margin-top: 93px;}
  #terms .container {width: 50%;}
  #terms h3 {margin-top: 3rem; margin-bottom: 0.5rem;}
  #terms ol, #terms ul {margin: 0; padding-left: 17px;}
  #terms ol li, #terms ul li {margin-bottom: 1rem; list-style-position: outside; color: #151515; font-size: 15px; line-height: 20px;}
  #terms ul li {list-style: disc;}

/* Footer
–––––––––––––––––––––––––––––––––––––––––––––––––– */
footer {overflow: auto; padding: 3rem 0;}
  
  /* Footer Top
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  .arrowImg {width: 6%;}
  .footerTop p, .footerTop h5 {color: #fff;}
  
  /* Footer Logo
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  .footerLogo {overflow: auto;}
  .footerLogo img {width: 85%; float: right;}
  .footerTop .links h5 {margin-bottom: 1rem;}
  .footerTop .links h5 a {font-weight: bold;}
  .footerTop .links p {margin-bottom: 0.3rem;}
  .footerTop .links .right {text-align: right;}
  
  /* Footer Bottom
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  .footerBottom {padding-top: 5rem; overflow: auto;}
  .footerBottom p {text-transform: uppercase; font-size: 13px;}
  .footerBottom a {color: #aaa9ab;}
  .footerBottom .right {margin-left: auto;}