h1, h2, h3, h4 {
  font-family: 'Yanone Kaffeesatz', sans-serif; }

p, span {
  font-family: 'Lato', sans-serif;
  font-size: 1.25rem; }

.main-logo {
  transition-duration: 0.3s; }
  .main-logo:hover {
    opacity: 0.7; }

.menu li a {
  padding: 1.9rem 1rem;
  font-family: 'Yanone Kaffeesatz', sans-serif;
  line-height: 1;
  text-transform: uppercase;
  color: #3d3d3b;
  font-size: 1.8rem;
  font-weight: bold; }
  .menu li a:hover {
    background-color: #e8cb27; }
.menu li a.active {
  background-color: #3d3d3b;
  color: #FFF; }

.mobile-menu-reveal {
  font-size: 1.8rem;
  padding: 20px;
  color: #3d3d3b; }

.mobile-navigation {
  width: 100%;
  display: none;
  transition-duration: 0.5s; }
  .mobile-navigation .mobile-nav {
    list-style: none;
    margin: 0;
    width: 100%; }
    .mobile-navigation .mobile-nav li {
      padding: 10px 0;
      background-color: #3d3d3b; }
      .mobile-navigation .mobile-nav li a {
        color: #FFF;
        font-size: 1.2rem; }

.footer-roofs {
  max-width: 850px;
  width: 100%;
  margin: 0 auto;
  display: block;
  margin-top: 60px; }

footer {
  background-color: #3d3d3b;
  text-align: center;
  padding: 60px 0; }
  footer img {
    max-width: 500px;
    width: 100%;
    margin: 0 auto;
    display: block;
    padding-bottom: 20px; }
  footer h2 {
    color: #FFF;
    font-size: 3rem;
    margin-bottom: 20px; }
  footer p {
    margin-bottom: 20px;
    color: #FFF; }
  footer span {
    color: #e8cb27; }

#hero {
  position: relative; }
  #hero .bx-wrapper {
    box-shadow: none;
    border: 0px !important;
    margin-bottom: 0px; }
    #hero .bx-wrapper .slider {
      margin: 0px; }
      #hero .bx-wrapper .slider img {
        width: 100%; }
  #hero .trapezium {
    width: 0;
    height: 0;
    border-left: 50vw solid transparent;
    border-right: 50vw solid transparent;
    border-bottom: 160px solid #fefefe;
    position: absolute;
    bottom: -1px;
    z-index: 9; }

#main-content-home {
  margin-top: -100px;
  position: relative;
  z-index: 999; }
  #main-content-home .introduction {
    text-align: center;
    margin: 30px 0 60px; }
    #main-content-home .introduction h1 {
      font-size: 5rem;
      color: #e8cb27; }
    #main-content-home .introduction h2 {
      color: #3d3d3b; }
  #main-content-home .usp {
    text-align: center;
    padding: 0 20px; }
    #main-content-home .usp h3 {
      color: #e8cb27;
      font-size: 2.3rem;
      line-height: 1;
      padding: 20px 0; }
    #main-content-home .usp .icon-3 {
      margin-bottom: -23px;
      margin-top: -25px; }
  #main-content-home .years {
    margin: 40px 0; }
    #main-content-home .years .lhs {
      background-image: url("../images/skylark-roofing-van.jpg");
      background-position: center center;
      background-repeat: no-repeat; }
    #main-content-home .years .rhs {
      background-color: #3d3d3b;
      padding: 75px 100px; }
      #main-content-home .years .rhs h2 {
        color: #e8cb27;
        font-size: 4rem; }
      #main-content-home .years .rhs p {
        color: #FFF;
        font-size: 1.25rem;
        line-height: 1.6; }
      #main-content-home .years .rhs a.yel-btn {
        background-color: #e8cb27;
        color: #3d3d3b;
        transition-duration: 0.4s;
        display: inline-block;
        padding: 15px 35px;
        font-family: 'Yanone Kaffeesatz', sans-serif;
        font-weight: bold;
        font-size: 1.6rem;
        margin-top: 15px; }
        #main-content-home .years .rhs a.yel-btn:hover {
          background-color: #FFF; }
  #main-content-home .reviews .a-review {
    text-align: center; }
    #main-content-home .reviews .a-review .star-rating {
      padding: 20px 0;
      color: #e8cb27; }
    #main-content-home .reviews .a-review h4 {
      font-size: 1.75rem; }
    #main-content-home .reviews .a-review span {
      font-size: 1.2rem;
      color: #e8cb27;
      font-weight: bold;
      padding: 10px 0; }

@media screen and (max-width: 1215px) {
  #main-content-home {
    margin-top: -50px; } }
#about-page-content .entry-title {
  text-align: center;
  margin: 20px 0; }
  #about-page-content .entry-title h1 {
    font-size: 4.5rem;
    color: #3d3d3b; }
  #about-page-content .entry-title h2 {
    color: #e8cb27; }
#about-page-content .row-of-content {
  padding: 20px 0; }
  #about-page-content .row-of-content p {
    font-size: 1.25rem; }
  #about-page-content .row-of-content.lower-level {
    margin-top: 30px; }

#page-about #page-hero img, #page-services #page-hero img, #page-gallery #page-hero img, #page-contact #page-hero img, #page-reviews #page-hero img {
  width: 100%; }

#services-page-content .entry-title {
  text-align: center;
  margin: 20px 0; }
  #services-page-content .entry-title h1 {
    font-size: 4.5rem;
    color: #3d3d3b; }
  #services-page-content .entry-title h2 {
    color: #e8cb27; }
#services-page-content .row-of-content {
  padding: 20px 0; }
  #services-page-content .row-of-content p {
    font-size: 1.25rem; }
  #services-page-content .row-of-content.lower-level {
    margin-top: 30px; }
#services-page-content .service-blocks .service-block {
  position: relative; }
  #services-page-content .service-blocks .service-block img {
    position: relative;
    max-width: 100%;
    width: 100%; }
  #services-page-content .service-blocks .service-block h3 {
    background: rgba(0, 0, 0, 0.7);
    position: absolute;
    bottom: -8px;
    color: #e8cb27;
    width: 100%;
    padding: 10px 20px;
    font-size: 2.6rem; }

#page-gallery .gallery-row {
  margin-top: 20px; }
#page-gallery footer {
  margin-top: 0px; }
#page-gallery .gallery-project-title {
  padding: 40px 0; }

.global-cta {
  background-color: #e8cb27;
  padding: 60px 0;
  margin-top: 50px; }
  .global-cta h2 {
    font-size: 3.2rem; }
  .global-cta h4 {
    font-size: 2.3rem; }
  .global-cta p {
    font-size: 1.6rem; }

#page-contact .reasons {
  padding-top: 20px; }
  #page-contact .reasons .usp {
    text-align: center; }
  #page-contact .reasons .icon-2 {
    margin-bottom: -23px;
    margin-top: -25px; }
  #page-contact .reasons h3 {
    padding-top: 20px;
    color: #e8cb27; }

#page-reviews .reviews .a-review {
  text-align: center;
  margin-bottom: 40px; }
  #page-reviews .reviews .a-review .star-rating {
    padding: 20px 0;
    color: #e8cb27; }
  #page-reviews .reviews .a-review h4 {
    font-size: 1.75rem; }
  #page-reviews .reviews .a-review span {
    font-size: 1.2rem;
    color: #e8cb27;
    font-weight: bold;
    padding: 10px 0; }

#page-contact .yel-btn {
  background-color: #e8cb27;
  color: #3d3d3b;
  transition-duration: 0.4s;
  display: inline-block;
  padding: 10px 25px;
  font-family: 'Yanone Kaffeesatz', sans-serif;
  font-weight: bold;
  font-size: 1.6rem;
  margin-top: 15px;
  margin-bottom: 20px; }
  #page-contact .yel-btn:hover {
    background-color: #3d3d3b;
    color: #FFF; }

@media screen and (max-width: 1280px) {
  #hero .trapezium {
    border-bottom: 120px solid #fefefe; } }
@media screen and (max-width: 900px) {
  #hero .trapezium {
    border-bottom: 80px solid #fefefe; } }
@media screen and (max-width: 440px) {
  #hero .trapezium {
    border-bottom: 40px solid #fefefe; } }
@media screen and (max-width: 1200px) {
  .main-logo {
    max-width: none;
    height: 80px; } }
@media screen and (max-width: 960px) {
  .main-logo {
    height: 60px;
    margin-top: 13px; } }
@media screen and (max-width: 875px) {
  .main-logo {
    height: 50px;
    margin-top: 17px; } }
@media screen and (max-width: 810px) {
  .menu li a {
    font-size: 1.4rem; } }
@media screen and (max-width: 730px) {
  .menu li a {
    padding: 1.9rem 0.6rem;
    font-size: 1.2rem; } }
@media screen and (max-width: 265px) {
  .main-logo {
    height: 30px;
    margin-top: 27px; } }
@media screen and (max-width: 900px) {
  #main-content-home .introduction {
    margin: 30px 0 60px; }
    #main-content-home .introduction h1 {
      font-size: 4rem;
      color: #e8cb27; }
    #main-content-home .introduction h2 {
      color: #3d3d3b;
      font-size: 2rem; } }
@media screen and (max-width: 710px) {
  #main-content-home .years .rhs {
    background-color: #3d3d3b;
    padding: 25px 35px 50px; } }
@media screen and (max-width: 640px) {
  #main-content-home .years {
    margin: 40px 0; }
    #main-content-home .years .lhs {
      background-image: url("../images/skylark-roofing-van.jpg");
      background-position: center center;
      background-repeat: no-repeat;
      background-size: cover;
      height: 300px !important; } }
@media screen and (max-width: 440px) {
  #main-content-home .introduction {
    margin: 40px 0 60px; }
    #main-content-home .introduction h1 {
      font-size: 3rem;
      color: #e8cb27; }
    #main-content-home .introduction h2 {
      color: #3d3d3b;
      font-size: 1.6rem; } }
@media screen and (max-width: 1023px) and (min-width: 640px) {
  #page-gallery .item-3, #page-gallery .item-4 {
    margin-top: 20px; } }
@media screen and (max-width: 640px) {
  .item-2, .item-3, .item-4 {
    margin-top: 20px; } }

/*# sourceMappingURL=main.css.map */