html,
body {
  background-color: #dddede;
  background: url("/assets/images/backgrounds/main-background.jpg");
}

@font-face {
  font-family: MavenProRegular;
  src: url("/assets/fonts/Maven%20Pro%20Regular.otf") format("opentype");
}

a {
  color: inherit; /* blue colors for links too */
  text-decoration: inherit; /* no underline */
}
.centralWrapper {
  margin: 0 auto;
  width: 1170px;
}
.leftNavWrapper {
  width: 270px;
  height: 816px;
  float: left;
}

.left-nav {
  background-color: #2d343e;
  width: 270px;
  height: 1000px;
  float: left;
  position: relative;
}
.left-nav > ul > li {
  width: 270px;
  height: 37px;
  line-height: 37px;
  font-family: "maven pro", sans-serif;
  text-indent: 31px;
  color: #f7fcff;
}
.left-nav > ul > li:hover {
  cursor: pointer;
  cursor: hand;
  background-color: #f7fcff;
  color: #2e343e;
  background-image: url("/assets/images/elements/nav-button.jpg");
  background-repeat: no-repeat;
  background-position: right;
}
.left-nav > ul > li.selected {
  background-color: #f7fcff;
  color: #2e343e;
  background-image: url("/assets/images/elements/nav-button.jpg");
  background-repeat: no-repeat;
  background-position: right;
}
.left-nav > ul > li > a {
  width: 270px;
  height: 37px;
  display: block;
}
.left-nav > .adding-value-to-your-business {
  position: absolute;
  bottom: 10px;
  left: 10px;
  width: 250px;
  height: 18px;
  font-family: "maven pro", sans-serif;
  color: #f7fcff;
  text-align: center;
}

.left-nav-default-style {
  height: 100%;
  padding: 0;
  position: fixed;
  top: 270px;
  min-height: 800px;
}
.left-nav-about-style {
  height: 1000px;
}
.left-nav-services-style {
  height: 1113px;
}

.background-logo {
  background-color: #f15d43;
  height: 270px;
  width: 270px;
  position: fixed;
}
.cpy-logo {
  background: url("/assets/images/icons/cpy-logo.png") no-repeat;
  position: absolute;
  top: 62px;
  left: 41px;
  width: 191px;
  height: 158px;
}

.main-display {
  width: 900px;
  height: 423px;
  background: url("/assets/images/backgrounds/blue-hands-large.jpg") no-repeat;
  position: relative;
  float: left;
}
.main-display > .top-area > .catherine-image {
  position: absolute;
  top: 43px;
  right: 32px;
  background: url("/assets/images/icons/catherine-pyman.png");
  width: 183px;
  height: 183px;
}
.main-display > .top-area > .catherine-image-assist {
  position: absolute;
  top: 125px;
  right: 211px;
  background-color: #f7fcff;
  width: 633px;
  height: 5px;
}
.main-display > .top-area > h1.catherine-main-text {
  margin-top: 60px;
  margin-left: 55px;
}
.main-display > .top-area > h1.catherine-main-text > .name {
  font-size: 55px;
  font-family: "Maven Pro", sans-serif;
  color: #f7fcff;
  color: #f7fcff;
}
.main-display > .top-area > h1.catherine-main-text > .descriptor {
  font-size: 30px;
  line-height: 30px;
  font-family: "MavenProRegular", sans-serif;
  color: #f7fcff;
}

.main-display > .top-area > .banner-text {
  position: absolute;
  width: 865px;
  height: 120px;
  border-left: 6px solid #0faba7;
  right: 0;
  top: 270px;
  background-color: #f7fcff;
}
.main-display > .top-area > .banner-text > .banner-text-content {
  margin-left: 23px;
  width: 810px;
  height: 100px;
  display: block;
  margin-top: 37px;
  font-size: 17px;
  font-family: "maven pro", sans-serif;
  font-weight: 300;
  line-height: 22px;
}

.features-area {
  float: left;
  width: 900px;
  height: 273px;
  position: relative;
  background-color: #f7fcff;
}
.features-area > .box-one {
  top: 59px;
  left: 30px;
}
.features-area > .box-two {
  top: 59px;
  left: 248px;
}
.features-area > .box-three {
  top: 59px;
  left: 468px;
}
.features-area > .box-four {
  top: 59px;
  left: 684px;
}
.features-area > .feature-box {
  background-color: #f7fcff;
  width: 186px;
  height: 158px;
  position: absolute;
}
.features-area > .feature-box > .name {
  color: #f15d42;
  font-family: "Maven Pro", sans-serif;
  font-size: 18px;
  line-height: 18px;
  margin-left: 65px;
  margin-top: 12px;
  margin-bottom: 10px;
}
.features-area > .feature-box > .desc {
  font-size: 12px;
  color: #2e343e;
  line-height: 12px;
  width: 110px;
  height: 90px;
  margin-left: 65px;
  font-family: "maven pro", sans-serif;
}
.features-area > .feature-box > .left-bar {
  width: 56px;
  height: 152px;
  position: absolute;
  left: 0;
  top: 0;
  background-color: #f15d42;
}
.features-area > .feature-box > .bottom-bar {
  width: 186px;
  height: 6px;
  position: absolute;
  bottom: 0;
  left: 0;
  background-color: #f15d42;
}

.icon-position {
  position: absolute;
  top: 11px;
  left: 13px;
  width: 28px;
  height: 28px;
  background-repeat: no-repeat;
}
.pen-icon {
  background: url("/assets/images/icons/pen-icon.jpg");
}
.graph-icon {
  background: url("/assets/images/icons/graph-icon.jpg");
}
.vat-form-icon {
  background: url("/assets/images/icons/vat-form-icon.jpg");
}
.star-icon {
  background: url("/assets/images/icons/star-icon.jpg");
}

.working-with {
  width: 900px;
  height: 163px;
  float: left;
  background-color: #f7fcff;
}
.working-with > .container {
  width: 840px;
  height: 105px;
  border: 1px solid #dee2e5;
  margin-left: 30px;
  position: relative;
}
.working-with > .container > .working-with-text {
  font-size: 18px;
  width: 69px;
  height: 37px;
  font-family: "maven pro";
  margin-left: 27px;
  margin-top: 32px;
  color: #f15d42;
}
.working-with > .container > .partner-one {
  background: url("/assets/images/icons/the-institute-of-certified-book-keepers.jpg")
    no-repeat;
  position: absolute;
  top: 9px;
  left: 156px;
  width: 78px;
  height: 86px;
}
/*.working-with > .container > a > .partner-one:hover { background:url('/assets/images/icons/the-institute-of-certified-book-keepers-hover.jpg') no-repeat;}*/
.working-with > .container > .partner-two {
  background: url("/assets/images/icons/sage-logo.jpg") no-repeat;
  position: absolute;
  top: 34px;
  left: 306px;
  width: 111px;
  height: 47px;
}
/*.working-with > .container > a > .partner-two:hover { background:url('/assets/images/icons/sage-logo-hover.jpg') no-repeat;}*/
.working-with > .container > .partner-three {
  background: url("/assets/images/icons/unnamed.png") no-repeat;
  position: absolute;
  top: 30px;
left: 466px;
width: 150px;
height: 150px;
background-size: contain;
mix-blend-mode: multiply;
}
/*.working-with > .container > a > .partner-three:hover { background:url('/assets/images/icons/catch-logo-hover.jpg') no-repeat;}*/
.working-with > .container > .partner-four {
  background: url("/assets/images/icons/creative-vein-logo.jpg") no-repeat;
  position: absolute;
  top: 32px;
  left: 672px;
  width: 125px;
  height: 44px;
}
/*.working-with > .container > a > .partner-four:hover { background:url('/assets/images/icons/creative-vein-logo-hover.jpg') no-repeat;}*/

.seperator-one {
  height: 105px;
  position: absolute;
  width: 1px;
  top: 0;
  left: 120px;
  background-color: #dee2e5;
}
.seperator-two {
  height: 105px;
  position: absolute;
  width: 1px;
  top: 0;
  left: 271px;
  background-color: #dee2e5;
}
.seperator-three {
  height: 105px;
  position: absolute;
  width: 1px;
  top: 0;
  left: 454px;
  background-color: #dee2e5;
}
.seperator-four {
  height: 105px;
  position: absolute;
  width: 1px;
  top: 0;
  left: 629px;
  background-color: #dee2e5;
}

.experience-in-numbers {
  width: 900px;
  height: 1000px;
  background: url("/assets/images/backgrounds/experience-in-numbers.jpg")
    no-repeat;
  position: relative;
  float: left;
  margin-top: 18px;
  background-color: #f7fcff;
}
.experience-in-numbers > h1 {
  margin-top: 455px;
  margin-bottom: 30px;
  font-size: 30px;
  font-family: "maven pro", sans-serif;
  text-indent: 31px;
  color: #0faba7;
}
.experience-in-numbers > .underline {
  width: 467px;
  height: 6px;
  position: absolute;
  top: 496px;
  left: 0;
  background-color: #0faba7;
}
.experience-in-numbers > .left-content {
  line-height: 14px;
  margin-left: 30px;
  margin-right: 18px;
  width: 445px;
  height: 254px;
  float: left;
  display: inline-block;
}
.experience-in-numbers > .right-content {
  line-height: 14px;
  width: 380px;
  height: 254px;
  float: left;
  display: inline-block;
}
.experience-in-numbers > div {
  font-family: "maven pro", sans-serif;
  font-size: 12px;
}
.experience-in-numbers > div > span {
  color: #f15d42;
}

.what-my-clients-say {
  width: 871px;
  height: 247px;
  position: absolute;
  right: 0px;
  background: url("/assets/images/backgrounds/what-my-clients-say.jpg");
  top: 730px;
}
.what-my-clients-say > .content {
  font-family: "maven pro", sans-serif;
  color: #0faba7;
  font-size: 17px;
  text-align: center;
  margin-left: 112px;
  margin-top: 70px;
  width: 680px;
  height: 100px;
}
.what-my-clients-say > .content > span {
  color: #f15d42;
  font-weight: bold;
}
.what-my-clients-say > .buttons > .selected-button {
  width: 9px;
  height: 9px;
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: url("/assets/images/elements/selected-button-9x9.jpg");
}
.what-my-clients-say > .buttons > .unselected-button {
  width: 9px;
  height: 9px;
  position: absolute;
  bottom: 10px;
  right: 10px;
  background: url("/assets/images/elements/unselected-button-9x9.jpg");
}
.what-my-clients-say > .buttons > .unselected-button:hover {
  cursor: hand;
  cursor: pointer;
}
.what-my-clients-say > .buttons > .button-one {
  right: 450px;
  bottom: 25px;
}
.what-my-clients-say > .buttons > .button-two {
  right: 435px;
  bottom: 25px;
}
.what-my-clients-say > .buttons > .button-three {
  right: 420px;
  bottom: 25px;
}
.what-my-clients-say > .buttons > .button-four {
  right: 405px;
  bottom: 25px;
}

.services-display {
  background: url("/assets/images/backgrounds/keywords.jpg");
  background-repeat: no-repeat;
  float: left;
  width: 900px;
  height: 423px;
  margin-top: 18px;
  position: relative;
  background-color: #f7fcff;
}
.services-area {
  float: left;
  background-color: #f7fcff;
}
.services-area > .spacer {
  height: 60px;
  width: 900px;
  float: left;
}
.services-area > .box-row > .box-left {
  width: 384px;
  height: 315px;
  float: left;
  margin-left: 38px;
  margin-right: 78px;
  float: left;
}
.services-area > .box-row > .box-right {
  width: 384px;
  height: 315px;
  float: left;
}
.services-area > .box-row > div {
  position: relative;
}
.services-area > .box-row > div > .line-circle > .title-text {
  color: #f15d42;
  font-size: 24px;
  position: absolute;
  top: 0;
  left: 0;
  font-family: "maven pro", sans-serif;
}
.services-area > .box-row > div > .line-circle {
  background: url("/assets/images/backgrounds/line-circle.jpg");
  position: absolute;
  width: 384px;
  height: 78px;
  top: 0px;
  left: 0px;
}
.services-area > .box-row > div > .line-circle > .selected-position {
  position: absolute;
  top: 23px;
  left: 330px;
  width: 28px;
  height: 28px;
}
.services-area > .box-row > div > .text-display {
  margin-top: 85px;
  width: 384px;
  font-family: "Helvetica";
  line-height: 18px;
  font-size: 12px;
}
.services-area > .box-row > div > .read-more-text {
  width: 384px;
  font-family: "Helvetica";
  line-height: 18px;
  font-size: 12px;
  margin-top: 10px;
  display: none;
}
.services-area > .box-row > div > .read-more {
  background: url("/assets/images/elements/search-more.jpg");
  width: 97px;
  height: 22px;
  position: absolute;
  bottom: 12px;
  right: 12px;
}
.services-area > .box-row > div > .read-more:hover {
  cursor: hand;
  cursor: pointer;
}

.contact-us-banner {
  background: url("/assets/images/backgrounds/get-in-touch-banner.jpg");
  width: 1170px;
  height: 148px;
  margin-top: 18px;
  position: relative;
}
.contact-us-banner > h1 {
  font-family: "maven pro";
  font-size: 40px;
  position: absolute;
  left: 29px;
  bottom: 22px;
  color: #f7fcff;
}
.contact-form-area {
  width: 1171px;
  height: 480px;
  float: left;
  display: block;
  background-color: #f7fcff;
}
.contact-form-area > h2 {
  text-indent: 29px;
  font-size: 30px;
  font-family: "maven pro";
  margin-top: 39px;
}

.contact-form-area > form {
  height: 411px;
  width: 1103px;
  margin-left: 29px;
  margin-top: 30px;
}
.contact-form-area > form > .form-left-column {
  width: 551px;
  height: 371px;
  float: left;
  display: block;
  position: relative;
}
.contact-form-area > form > .form-right-column {
  width: 552px;
  height: 371px;
  float: left;
  display: block;
  position: relative;
}
.contact-form-area > form > div > .form-input-wrapper {
  width: 470px;
  height: 50px;
  background-color: #e3e8eb;
  margin-bottom: 21px;
  position: relative;
}
.contact-form-area > form > div > .form-textarea-wrapper {
  width: 470px;
  height: 160px;
  background-color: #e3e8eb;
  margin-bottom: 21px;
  position: relative;
}
.contact-form-area > form > div > .form-input-wrapper > input {
  border: none;
  padding: 0;
  margin-left: 10px;
  width: 450px;
  height: 50px;
  font-family: "maven pro", sans-serif;
  font-size: 14px;
  background-color: transparent;
}
.contact-form-area > form > div > .form-input-wrapper > input:focus {
  outline-width: 0;
}
.contact-form-area > form > div > .form-textarea-wrapper > textarea {
  background-color: transparent;
  border: none;
  padding: 0;
  margin-left: 10px;
  width: 450px;
  height: 144px;
  font-family: "maven pro", sans-serif;
  font-size: 14px;
  margin-top: 5px;
}
.contact-form-area > form > div > .form-textarea-wrapper > textarea:focus {
  outline-width: 0;
}
.contact-form-area > form > div > .highlighted-fields {
  color: #f15d42;
  font-family: "maven pro", sans-serif;
  font-weight: lighter;
}
.contact-form-area > form > div > .send-message {
  background: url("/assets/images/elements/send-message.jpg");
  width: 143px;
  height: 44px;
  position: absolute;
  bottom: 12px;
  right: 78px;
  padding: 0;
  border: none;
}
.contact-form-area > form > div > .send-message:hover {
  cursor: pointer;
}

.error,
.success {
  color: #f15d42;
  font-family: "Maven Pro", sans-serif;
  line-height: 2em;
  position: absolute;
  right: 5px;
  z-index: 30;
}
.success {
  left: 0;
}

.form-right-column > .contact-area {
  height: 100px;
  width: 550px;
  position: absolute;
  top: 150px;
  font-family: "maven pro", sans-serif;
}
.form-right-column > .contact-area > p > span.blue-item {
  color: #0faba7;
  width: 15px;
  display: inline-block;
}
.form-right-column > .institute-link {
  bottom: 15px;
  position: absolute;
  right: -10px;
  display: block;
  font-family: sans-serif;
  text-align: center;
  font-size: 10px;
}
.form-right-column > .institute-link span {
  display: block;
  margin-top: 10px;
}

.no-obligation-quote {
  font-family: "maven pro", sans-serif;
}
.no-obligation-quote > span {
  color: #f15d42;
}

.form-right-column > a > .to-top-button {
  background: url("/assets/images/elements/to-top.jpg");
  width: 105px;
  height: 40px;
  position: absolute;
  bottom: 12px;
}
.form-right-column > a > .to-top-button:hover {
  cursor: pointer;
  cursor: hand;
}

.contact-area > .social-network-item {
  display: block;
  float: left;
  height: 30px;
  margin-right: 5px;
  margin-top: 25px;
  position: relative;
  width: 30px;
}
.contact-area > .twitter {
  background: url("/assets/images/icons/social-network-twitter.jpg");
}
.contact-area > .google {
  background: url("/assets/images/icons/social-network-google.jpg");
}
.contact-area > .facebook {
  background: url("/assets/images/icons/social-network-facebook.jpg");
}
.contact-area > .linkedin {
  background: url("/assets/images/icons/social-network-linked-in.jpg");
}
.contact-area > .social-network-item:hover {
  cursor: pointer;
  cursor: hand;
}

.footer-area {
  width: 1170px;
  background-color: #dedede;
  float: left;
}
.footer-links {
  margin-top: 33px;
  font-family: "maven pro", sans-serif;
  color: #2e343e;
  font-size: 17px;
  display: block;
  float: left;
  width: 550px;
  height: 70px;
}
.copyright-notice {
  font-family: "maven pro", sans-serif;
  color: #2e343e;
  font-size: 14px;
  display: block;
  float: left;
  text-align: right;
  margin-top: 33px;
  width: 620px;
  height: 70px;
}

.homepage-content {
  background-color: #f7fcff;
  width: 900px;
  height: 859px;
  float: left;
  position: relative;
  background-color: #f7fcff;
}
.services-content {
  background-color: #f7fcff;
  float: left;
  position: relative;
  height: 1113px;
  width: 900px;
  margin-left: 270px;
}
.about-content {
  background-color: #f7fcff;
  float: left;
  position: relative;
  height: 1000px;
  width: 900px;
  margin-left: 270px;
}
.contact-content {
  position: relative;
  height: 646px;
  width: 1170px;
  float: left;
  padding-top: 18px;
  background-color: #dedede;
}

.contact-content > .overlay {
  background-color: #2d343e;
  height: 300px;
  width: 270px;
  top: -300px;
  left: 0;
  position: absolute;
}

.contact-us-banner {
  margin-top: 0 !important;
}
.services-display {
  margin-top: 0 !important;
}
.experience-in-numbers {
  margin-top: 0 !important;
}

.contact-us-banner > .cpy-logo-transparent {
  background: url("/assets/images/icons/cpy-logo-transparent.png");
  position: absolute;
  top: 30px;
  right: 30px;
  height: 91px;
  width: 92px;
  background-repeat: no-repeat;
}