/*
Theme Name: OnePress Child
Theme URI: https://www.famethemes.com/themes/onepress/
Template: onepress
Author: FameThemes
Author URI: http://www.famethemes.com
Description: OnePress is an outstanding creative and flexible WordPress one page theme well suited for business website, portfolio, digital agency, product showcase, freelancers and everyone else who appreciate good design. The theme overall is an elegant and classic one, a fine example of Bootstrap 4 WordPress theme which compatibility with latest version of WooCommerce. (Live preview : https://demos.famethemes.com/onepress)
Tags: one-column,two-columns,left-sidebar,right-sidebar,custom-menu,featured-images,full-width-template,sticky-post,theme-options,threaded-comments,translation-ready,e-commerce,blog,portfolio
Version: 2.2.5.1598755279
Updated: 2020-08-30 02:41:19
*/

*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
}

html {
  font-size: 62.5%; /* 16px * 0.625 = 10px */
}

body {
  box-sizing: border-box;
  color: #5b5b5b;
}

.breadcrumbs {
  display: none;
}

.border {
  border-top: 1.5rem solid;
  border-bottom: 1.5rem solid;
}

.hero {
  background-image: url(/wp-content/uploads/2020/10/header-image.png);
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  height: 90vh;
  position: relative;
}

.hero__heading {
  position: absolute;
  top: 24%;
  right: 5%;
  background-color: rgba(235, 235, 235, 0.5);
  padding: 2.4rem;
  border-radius: 2.4remx;
  transform: translateY(-50%);
}

.hero__heading h1 {
  font-size: 10rem;
  font-weight: 300;
  color: #335980;
  text-shadow: 0 0 4rem #ffffff;
}

.hero__heading h2 {
  font-size: 3rem;
  padding-left: 0.7rem;
}

.section-header h2 {
  font-weight: 400;
  font-size: 4rem;
  text-align: center;
  color: #335980;
  margin-bottom: 3rem;
}

[class*="section__"] {
  background-blend-mode: color;
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  padding: 10rem 0;
}

@media only screen and (max-width: 1200px) {
  [class*="section__"], .hero {
    background-attachment: unset;
  }
}

.section__about {
  background-image: linear-gradient(#6699CC, #6699CC), url(/wp-content/uploads/2020/10/header-image.png);
}

.section__services {
  background-image: linear-gradient(#805E26, #805E26), url(/wp-content/uploads/2020/10/header-image.png);
}

.section__rates {
  background-image: linear-gradient(#99CCFF, #99CCFF), url(/wp-content/uploads/2020/10/header-image.png);
}

.section__location {
  background-image: linear-gradient(#CCA666, #CCA666), url(/wp-content/uploads/2020/10/header-image.png);
  /*background-image: linear-gradient(#335980, #335980), url(/wp-content/uploads/2020/10/header-image.png);*/
}

.gradient-left {
  background-image: linear-gradient(to left, transparent 33%, #bdbdbd);
}

.gradient-right {
  background-image: linear-gradient(to right, transparent 33%, #bdbdbd);
}

.image--left, 
.image--right {
  border-radius: 4rem;
  display: block;
  overflow: hidden;
  width: 90%;
  max-width: 50rem;
  max-height: 50rem;
  border-width: 1rem;
  border-style: solid;
}

.image--left {
  border-color:#6699cc;
}

.image--right {
  border-color: #805E26;
}

[class*="image--credit"] {
  position: relative;
}

[class*="image--credit"]::after {
  position: absolute;
  bottom: 1rem;
  right: 50%;
  transform: translateX(50%);
  font-size: 1.2rem;
  color: #ebebeb;
  background-color: #6b6b6b;
  padding: 0 1rem;
  border-radius: .4rem;
}

.image--credit-header::after {
  content: "Photo by Aaron Huber";
}   
.image--credit-1::after {
  content: "Photo by Josh Hild";
}

.image--credit-2::after {
  content: "Photo by Vincent Ledvina";
}

.image--credit-3::after {
	content: "Photo by Jennie Eukel";
}

.text--left,
.text--right {
  width: 90%;
  font-size: 1.6rem;
  padding: 4rem;
  border-radius: 4rem;
  background: rgba(255, 255, 255, 0.95)
}

/* .text--left {
  padding: 0 0 0 30px;
} */

/* .text--right {
  padding: 0 30px 0 0;
} */

[class*="--left"] {
  margin: 0 0 0 auto;
}

[class*="--right"] {
  margin: 0 auto 0 0;
}

@media only screen and (max-width: 48.75em) { /* 780px ÷ 16rem = 48.75em */
  html {
    font-size: 56.25%; /* 16px * 0.5625 = 9px */
  }
  .hero {
    height: 60vh;
  }
  .hero__heading h1 {
    font-size: 7.5rem;
  }
  [class*="--left"], [class*="--right"] { 
    margin: 0 auto;
  }
}
@media only screen and (max-width: 37.5em) { /* 600px ÷ 16rem = 37.5em */
  html {
    font-size: 50%; /* 16px * .5 = 8px */
  }
  .hero__heading h1 {
    font-size: 5.5rem;
  }
  .hero__heading h2 {
    font-size: 2.5rem;
  }
  .text--left, .text--right {
    padding: 2rem;
  } 
}

