
/**//*/home/olive/public_html/pdx-home-repair/styles/site/global.css*//**
 * Base styles for the site.  These styles are used on ever page on the site.
 */
:root {
  /*Colors*/
  --color-blue: #20409a;
  /*rgb(32, 64, 154); hsl(224, 66%, 36%)*/
  --color-dark-blue: #2e4663;
  /*rgb(255, 123, 0); hsl(29, 100%, 50%)*/
  --color-green: #88b06a;
  /*rgb(18, 89, 37); hsl(136, 66%, 21%)*/
  --color-green-logo: #2e3d32;
  /*rgb(46, 61, 50); hsl(136, 14%, 21%)*/
  --color-gold: #ffde16;
  /*rgb(251, 176, 59); hsl(37, 96%, 61%)*/
  --color-red: #981f21;
  /*rgb(152, 31, 33); hsl(359, 66%, 36%)*/
  --color-light-blue: hsl(244,20%,65%);
  /*End Colors*/
  /*Template Settings*/
  --color-primary: var(--color-blue);
  --font-color-primary-light: white;
  /*End Template Settings*/
  --content-width: 1366px;
  /*Primary Menu*/
  --menu-primary-icon-color: var(--color-blue);
  --menu-primary-menu-background: white;
  --menu-primary-header-background: white;
  --menu-primary-0-border-color: var(--color-gold);
  --menu-primary-0-color: hsl(0,0%,23%);
  --menu-primary-0-divider-color: var(--color-gold);
  --menu-primary-0-font-size: 1.1rem;
  --menu-primary-0-font-weight: 700;
  --menu-primary-1-color: var(--color-blue);
  --menu-primary-1-font-size: 1rem;
  --menu-primary-1-font-weight: 400;
  /*Primary Menu Mobile*/
  --menu-primary-mobile-background: #006;
  --menu-primary-mobile-icon-color: white;
  /*Main Section*/
  /**Font**/
  --main-font-color: var(--dark-blue);
  --main-heading-font-color: var(--color-blue);
  /**End Fonts**/
  /*End Main Section*/
}

/* Buttons */
.button, .button.primary,
.button:visited,
.button:visited.primary,
button,
button.primary,
input[type=button],
input[type=button].primary,
input[type=reset],
input[type=reset].primary,
input[type=submit],
input[type=submit].primary {
  background: var(--color-green);
  border-color: var(--color-green);
}
.button:hover, .button:focus, .button:active, .button.primary:hover, .button.primary:focus, .button.primary:active,
.button:visited:hover,
.button:visited:focus,
.button:visited:active,
.button:visited.primary:hover,
.button:visited.primary:focus,
.button:visited.primary:active,
button:hover,
button:focus,
button:active,
button.primary:hover,
button.primary:focus,
button.primary:active,
input[type=button]:hover,
input[type=button]:focus,
input[type=button]:active,
input[type=button].primary:hover,
input[type=button].primary:focus,
input[type=button].primary:active,
input[type=reset]:hover,
input[type=reset]:focus,
input[type=reset]:active,
input[type=reset].primary:hover,
input[type=reset].primary:focus,
input[type=reset].primary:active,
input[type=submit]:hover,
input[type=submit]:focus,
input[type=submit]:active,
input[type=submit].primary:hover,
input[type=submit].primary:focus,
input[type=submit].primary:active {
  background: white;
  color: var(--color-green);
}
.button.blue,
.button:visited.blue,
button.blue,
input[type=button].blue,
input[type=reset].blue,
input[type=submit].blue {
  background: var(--color-blue);
  border-color: var(--color-blue);
}
.button.blue:hover, .button.blue:focus, .button.blue:active,
.button:visited.blue:hover,
.button:visited.blue:focus,
.button:visited.blue:active,
button.blue:hover,
button.blue:focus,
button.blue:active,
input[type=button].blue:hover,
input[type=button].blue:focus,
input[type=button].blue:active,
input[type=reset].blue:hover,
input[type=reset].blue:focus,
input[type=reset].blue:active,
input[type=submit].blue:hover,
input[type=submit].blue:focus,
input[type=submit].blue:active {
  background: white;
  color: var(--color-blue);
}
.button.green,
.button:visited.green,
button.green,
input[type=button].green,
input[type=reset].green,
input[type=submit].green {
  background: var(--color-green);
  border-color: var(--color-green);
}
.button.green:hover, .button.green:focus, .button.green:active,
.button:visited.green:hover,
.button:visited.green:focus,
.button:visited.green:active,
button.green:hover,
button.green:focus,
button.green:active,
input[type=button].green:hover,
input[type=button].green:focus,
input[type=button].green:active,
input[type=reset].green:hover,
input[type=reset].green:focus,
input[type=reset].green:active,
input[type=submit].green:hover,
input[type=submit].green:focus,
input[type=submit].green:active {
  background: white;
  color: var(--color-green);
}
.button.gold,
.button:visited.gold,
button.gold,
input[type=button].gold,
input[type=reset].gold,
input[type=submit].gold {
  background: var(--color-gold);
  border-color: var(--color-gold);
}
.button.gold:hover, .button.gold:focus, .button.gold:active,
.button:visited.gold:hover,
.button:visited.gold:focus,
.button:visited.gold:active,
button.gold:hover,
button.gold:focus,
button.gold:active,
input[type=button].gold:hover,
input[type=button].gold:focus,
input[type=button].gold:active,
input[type=reset].gold:hover,
input[type=reset].gold:focus,
input[type=reset].gold:active,
input[type=submit].gold:hover,
input[type=submit].gold:focus,
input[type=submit].gold:active {
  background: white;
  color: var(--color-gold);
}
.button.red,
.button:visited.red,
button.red,
input[type=button].red,
input[type=reset].red,
input[type=submit].red {
  background: var(--color-red);
  border-color: var(--color-red);
}
.button.red:hover, .button.red:focus, .button.red:active,
.button:visited.red:hover,
.button:visited.red:focus,
.button:visited.red:active,
button.red:hover,
button.red:focus,
button.red:active,
input[type=button].red:hover,
input[type=button].red:focus,
input[type=button].red:active,
input[type=reset].red:hover,
input[type=reset].red:focus,
input[type=reset].red:active,
input[type=submit].red:hover,
input[type=submit].red:focus,
input[type=submit].red:active {
  background: white;
  color: var(--color-red);
}

/* End Buttons */
/* Cards */
.card {
  border-bottom: 0.5rem solid var(--color-blue);
  border-top: 2px solid var(--color-gold);
}
.card:visited, .card:hover, .card:focus, .card:active {
  color: var(--main-font-color);
}

/* End Cards */
/* Rows */
.contentRow {
  width: 100%;
}
.contentRow.default {
  margin: auto;
  max-width: var(--content-width);
}

/* End Rows */
main img.inline {
  max-width: 100%;
}
main img.inline.left {
  margin: 0.5rem 1rem 0.5rem 0;
}
main img.inline.right {
  margin: 0.5rem 0 0.5rem 1rem;
}
main img.inline.top {
  margin-top: 0;
}
@media screen and (min-width: 481px) {
  main img.inline {
    max-width: 50%;
  }
}

html {
  /*font-size:15.33px /*18px for largest font size*/
}
@media screen and (max-width: 480px) {
  html {
    font-size: calc(var(--font-size) * 1);
  }
}
@media screen and (min-width: 481px) and (max-width: 800px) {
  html {
    font-size: calc(var(--font-size) * var(--font-size-multiplier));
  }
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
  html {
    font-size: calc(var(--font-size) * var(--font-size-multiplier) * var(--font-size-multiplier));
  }
}
@media screen and (min-width: 1025px) {
  html {
    font-size: calc(var(--font-size) * var(--font-size-multiplier) * var(--font-size-multiplier) * var(--font-size-multiplier));
  }
}
@media screen and (max-width: 480px) {
  html body {
    font-size: calc(var(--font-size) * 1);
  }
}
@media screen and (min-width: 481px) and (max-width: 800px) {
  html body {
    font-size: calc(var(--font-size) * var(--font-size-multiplier));
  }
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
  html body {
    font-size: calc(var(--font-size) * var(--font-size-multiplier) * var(--font-size-multiplier));
  }
}
@media screen and (min-width: 1025px) {
  html body {
    font-size: calc(var(--font-size) * var(--font-size-multiplier) * var(--font-size-multiplier) * var(--font-size-multiplier));
  }
}
@media screen and (max-width: 480px) {
  html body h1 {
    font-size: calc(1.6rem + .6rem / 4 * 1);
  }
}
@media screen and (min-width: 481px) and (max-width: 800px) {
  html body h1 {
    font-size: calc(1.6rem + .6rem / 4 * 2);
  }
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
  html body h1 {
    font-size: calc(1.6rem + .6rem / 4 * 3);
  }
}
@media screen and (min-width: 1025px) {
  html body h1 {
    font-size: calc(1.6rem + .6rem / 4 * 4);
  }
}
@media screen and (max-width: 480px) {
  html body h2 {
    font-size: calc(1.5rem + .5rem / 4 * 1);
  }
}
@media screen and (min-width: 481px) and (max-width: 800px) {
  html body h2 {
    font-size: calc(1.5rem + .5rem / 4 * 2);
  }
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
  html body h2 {
    font-size: calc(1.5rem + .5rem / 4 * 3);
  }
}
@media screen and (min-width: 1025px) {
  html body h2 {
    font-size: calc(1.5rem + .5rem / 4 * 4);
  }
}
@media screen and (max-width: 480px) {
  html body h3 {
    font-size: calc(1.4rem + .4rem / 4 * 1);
  }
}
@media screen and (min-width: 481px) and (max-width: 800px) {
  html body h3 {
    font-size: calc(1.4rem + .4rem / 4 * 2);
  }
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
  html body h3 {
    font-size: calc(1.4rem + .4rem / 4 * 3);
  }
}
@media screen and (min-width: 1025px) {
  html body h3 {
    font-size: calc(1.4rem + .4rem / 4 * 4);
  }
}
@media screen and (max-width: 480px) {
  html body h4 {
    font-size: calc(1.3rem + .3rem / 4 * 1);
  }
}
@media screen and (min-width: 481px) and (max-width: 800px) {
  html body h4 {
    font-size: calc(1.3rem + .3rem / 4 * 2);
  }
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
  html body h4 {
    font-size: calc(1.3rem + .3rem / 4 * 3);
  }
}
@media screen and (min-width: 1025px) {
  html body h4 {
    font-size: calc(1.3rem + .3rem / 4 * 4);
  }
}
@media screen and (max-width: 480px) {
  html body h5 {
    font-size: calc(1.2rem + .2rem / 4 * 1);
  }
}
@media screen and (min-width: 481px) and (max-width: 800px) {
  html body h5 {
    font-size: calc(1.2rem + .2rem / 4 * 2);
  }
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
  html body h5 {
    font-size: calc(1.2rem + .2rem / 4 * 3);
  }
}
@media screen and (min-width: 1025px) {
  html body h5 {
    font-size: calc(1.2rem + .2rem / 4 * 4);
  }
}
@media screen and (max-width: 480px) {
  html body h6 {
    font-size: calc(1.1rem + .1rem / 4 * 1);
  }
}
@media screen and (min-width: 481px) and (max-width: 800px) {
  html body h6 {
    font-size: calc(1.1rem + .1rem / 4 * 2);
  }
}
@media screen and (min-width: 801px) and (max-width: 1024px) {
  html body h6 {
    font-size: calc(1.1rem + .1rem / 4 * 3);
  }
}
@media screen and (min-width: 1025px) {
  html body h6 {
    font-size: calc(1.1rem + .1rem / 4 * 4);
  }
}
/*# sourceMappingURL=global.css.map */@charset "utf-8";
/**
* Base styles for the website
*/

*/
/**
* Load the page mobile first.
*
* Page Main Width:1366px //most common in 2021
*
* Website Colors:
* - primary: #027bc9 (blueish)
* - secondary: #abd7f0 (light blueish)
* - tertiary: #fa7025 (orangish)
* - quaternary: #b4b4b4 (grayish)
*
* Font Colors:
* - primary: #232326 (black)
* - secondary: # ()
* - tertiary: # ()
* - quaternary: # ()
*
* Font Specifics:
* - Headers:
* -- color:
* -- family:
* -- size:
* -- weight:
* - Navigation:
* -- color:
* -- family:
* -- size:
* -- weight:
* -- Content
* -- color:
* -- family:
* -- size:
* -- weight:
* - Footer
* -- color:
* -- family:
* -- size:
* -- weight:
* - Links
* -- color:
* -- color hover:
* -- family:
* -- size:
* -- weight:
*
* Design:
*	- Design mobile-first
*	- Design for content, not device or screen resolution
* -- Smallest screen resolution is 240 x 320 pixels
* - The font size is what drives the content size.
*	-- Theoretically a column should be between 45 and 75 characters or an average of ten words per line.  This doesn't translate well into pixels or percent.  Using a standards Ariel font . . .
*	-- Smaller screen resolutions should also use a smaller font as the screen is held closer to the person's face making it larger
*
*	Break points:
* - Minimum of 45 characters wide & max of 75 characters
* - 3 breakpoints:
* -- Above 1000px wide (1024 and larger) - desktop
* -- Between 798px and 1000px wide (800 to 1024) – desktop/ tablet
* -- Below 797px (smaller than 800px) – mobile
* - Column width:
* -- 0px to 650px for one column
* -- 651px to 975px for two columns
* -- 976px or more for three columns
* -- Max width of all columns side-by-side:1366px*
*	Font Size:
* - Loosely based on screen size (to loosely coorelate with device and distance held from the face)
* - 10% smaller than next size up or 10% larger than next size down; 1.1:1 ratio.  Round to the nearest common fraction (.0, .25, .33, .5, .66, .75)
* -- 240 px to 320px – 82% - 100%
* -- 320 px to 480px – 86% - 105%
* -- 480px to 800px – 90% - 111%
* -- 800px to 1024px – 95% - 117%
* -- 1024px and above – 100% - 123%
* - Font size should use the same 1.1:1 ratio; px are round, % and rem more accurate
* -- http://www.modularscale.com/?18&px&1.1&web&table for table
* -- 7px - 38.6% - .386rem
* -- 8px - 42.4% - .424rem
* -- 8px - 46.7% - .467rem
* -- 9px - 51.3% - .513rem
* -- 10px - 56.4% - .564rem
* -- 11px - 62.1% - .621rem
* -- 12px - 68.3% - .683rem
* -- 14px - 75.1% - .751rem
* -- 15px - 82.6% - .826rem
* -- 16px - 9.09% - .909rem
* -- 18px - 100% - 1rem
* -- 20px - 110% - 1.1rem
* -- 22px - 121% - 1.21rem
* -- 24px - 133.1% - 1.331rem
* -- 26px - 146.4% - 1.454rem
* -- 29px - 161% - 1.61rem
* -- 32px - 177.2% - 1.772rem
* -- 35px - 194.9% - 1.949rem
* -- 39px - 214.4% - 2.145rem
* -- 42px - 235.8% - 2.348rem
* -- 47px - 259.3% - 2.593rem
* -- 51px - 285.3% - 2.853rem
* -- 56px - 313.8% - 3.138rem
*
* Links:
* - It is important that padding and other spacing involving links be specified on the link making it more easily clickable by touch
*
* Final Processing:
* - Make all styling universially compatable
* -- Information: https://github.com/postcss/autoprefixer
* -- Formatter: http://autoprefixer.github.io/
*/

/*import other stylesheets*/
/*@import url('global.css');*/
/*@import url('nav.css');*/

/**
* Absolute Styles:
* Styles that apply to all content in this section go here.
*/
/*change box sizing to include width, padding, border in width property*/

html {
  -webkit-box-sizing: border-box !important;
          box-sizing: border-box !important;
}

:root {
  /*backgrounds*/
  /*--background-overlay:hsla(0,0%,100%,.65);*/
  --background-subliminal:hsl(226, 10%, 99%);

  /*bordres*/
  --borderDark: 1px solid hsl(0, 0%, 77%);
  --borderGold: 1px solid #FBB03B;
  --borderRadius: .5rem;

  /*box shadows*/
  --boxShadowDark: 0 5px 15px 1px rgba(0,0,0,.4);
  --boxshadow-dark: 0 5px 15px 1px rgba(0,0,0,.4);
  --boxShadowLight: 0 5px 15px 1px hsla(0,0%,100%,.4);

  --color-green: #88b06a /*green*/;
  --color-gold: #ffde16; /*rgb(251, 176, 59); hsl(37, 96%, 61%)*/
  --color-blue: #20409a; /*rgb(0, 60, 180); hsl(226, 68%, 95%)*/
  --color-light-blue: hsl(244,20%,65%);
  --color-dark-blue: #2e4663; /*rgb(255, 123, 0); hsl(29, 100%, 50%)*/
  
  /*--overlay-dark:hsla*/
  --text-shadow-dark:1px 1px 1px rgba(0, 0, 0, 0.65);
  --text-shadow-dark-double:1px 1px 1px rgba(0, 0, 0, 0.65), 0 0 12px rgba(0, 0, 0, 0.65);

  --z-index-top:    999999999;
  --z-index-header: 100;
}

*,
*::before,
*::after {
  -webkit-box-sizing: border-box; /*inherit not working*/
          box-sizing: border-box; /*inherit not working*/
}

html {
/**
* Background for the site declared here.
* Font color, family, and weight declared here.
*/
  background:rgba(0,0,0,.01) url('/')   no-repeat fixed;background-size:cover;  color:hsl(0,0%,14%);
  font-family:Lato, sans-serif;
  font-size:14.5px; /*18px for largest font size*/
  }

a, a:visited {
  color:#88b06a /*green*/;
  transition:color .3s ease-out
}

a:hover, a:active, a:focus {
  color:rgb(120, 138, 163) /*Shadow Blue*/}

a[target="_blank"]::after {
  content: ' \f08e';
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: var(--fa-display, inline-block);
  font-style: normal;
  font-variant: normal;
  line-height: 1;
  text-rendering: auto;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  display:inline-block;
  margin-left:.25rem;
  font-size:14px;
}

h1, h2, h3, h4, h5, h6 {
  color:#88b06a /*green*/;  font-family:Lato, sans-serif;  font-weight:700;  font-variant:small-caps;
}

td, th {
  padding:.5rem;
  vertical-align:top
}

form .formFieldInfo,
form .error {
  font-size:.8em;
  font-weigh:400
}

form .error {
	color:#cc0000;
}

form .required {
  color:red;
  font-size:.8rem;
  font-weight:700;
}

form input[type=text],
form input[type=password],
form textarea,
form select {
  /*width:16.667rem /*300px for 18px font-size*/
}

form textarea {
  height:200px
}

form input[type=submit] {
  width:5.556rem /*100px for 18px font-size*/
}

/*15px width of 'M' char for 18px font-size*/
form input.size2 {
  width:1.944rem /*35px for 18px font-size*/
}

form input.size4 {
  width:3.611rem /*65px for 18px font-size*/
}

form input.size5 {
  width:4.444rem /*80px for 18px font-size*/
}

form input.size10 {
  width:8.611rem /*155px for 18px font-size*/
}

/*contact form main*/
#contact {
}

#contact .contactTd1 {
  border:none;
  white-space:nowrap
}

#contact .contactTd2 {
  border:none;
  margin-bottom:1rem;
  white-space:nowrap
}

#contact #hideform {
  visibility:hidden
}

#contact #nameTd {
  position:fixed;
  top:-100px
}

#contact #emailTd {
  display:none
}

.clear {
  clear:both
}

.contentBlock {
  margin:0 auto;
  max-width:1366px;
  padding:0 2rem;
  position:relative;
  width:100%
}

.highlight {
  color:#f57714;
  font-weight:700
}

.invoiceList {
  list-style:none;
  margin:0;
  padding:0
}

.invoiceList ul {
  background:#efefef;
  border:#666;
  display:flex;
  justify-content:space-between;
  padding:1rem
}

.invoiceList ul li:nth-child[1],
.invoiceList ul li:nth-child[2] {
  width:25%
}

.invoiceList ul li:nth-child[3] {
  width:50%
}

/*main section button,
.button,*/
.buttonSlideshow,
.eventsMore {
  border-radius:3px;
  cursor: pointer;
  display:inline-block;
  font-size:.826rem;
  padding:.25rem 1.5rem;
  position: relative;
  text-align:center;
}

/*main section button,
.buttonPrimary,*/
a.buttonPrimary,
a.buttonPrimary:visited,
a.buttonSlideshow,
a.eventsMore {
  background:hsla(76, 15%, 76%, 1);
  border:2px solid hsla(76, 15%, 76%, 1);
  color:hsla(209, 88%, 16%, 1);
  /*font-family:'Open Sans Condensed', sans-serif;*/
  font-size:0.751rem;
  font-weight:600;
  text-decoration: none !important;
  text-transform: uppercase;
  transition:all .3s ease-out
}

/*main section button:hover,
.buttonPrimary:hover,
a.buttonPrimary:hover,
a.buttonPrimary:active,
a.buttonPrimary:focus,*/
a.buttonSlideshow:hover,
a.eventsMore:hover,
a.eventsMore:focus {
  background:white;
  color:hsla(76, 15%, 76%, 1)}

/**************
* Star Rating *
**************/

.ratingContainer .star.unrated::before {
  color:<div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Undefined variable $STYLES' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 390:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div>      <style>
        .error_backtrace {
          background: white;
          border-radius: 7px;
          box-shadow: 1px 2px 4px #856404;
          color: #856404;
          display: inline-block;
          font-family: 'Courier New', Courier, Monospace;
          font-weight:400;
          max-width:100%;
          margin: 1rem;
          padding: 1rem;
          position: relative;
          text-align: left;
          text-shadow: 1px 1px 1px #efefef;
          text-transform: none;
          word-wrap: break-word;
          overflow-wrap: break-word;
          word-break: break-word;
          z-index: 9999999999999;
        }

        .error_backtrace.fatal {
          box-shadow: 1px 2px 4px #860404;
          color:#860404;
        }
      </style>
      <div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 390:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div><div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 390:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div>;
}

.ratingContainer .star.full::before {
  color:<div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Undefined variable $STYLES' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 394:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div><div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 394:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div><div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 394:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div>;
}

.ratingContainer .star.none::before {
  color:<div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Undefined variable $STYLES' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 398:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div><div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 398:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div><div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 398:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div>;
}

.ratingContainer .star.partial::before {
  color:<div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Undefined variable $STYLES' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 402:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div><div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 402:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div><div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 402:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div>;
}

.ratingContainer .star.partial::after {
  color:<div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Undefined variable $STYLES' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 406:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div><div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 406:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div><div class="error_backtrace warning">Backtrace from <strong>WARNING Error</strong> 'Trying to access array offset on value of type null' at /home/olive/public_html/pdx-home-repair/styles/site/site.css 406:<ol><li>/home/olive/public_html/pdx-home-repair/styles/site-styles.php<ul><li>line: 62 </li><li>Function: _require()</li></ul></li><li>/home/olive/public_html/tommarrowws-cms-0.81/library/cms.class.php<ul><li>line: 2002 </li><li>Function: require_once()</li></ul></li></ol></div>;
}

/******************
* End Star Rating *
******************/

/******************
* Slideshows *
******************/
.contentSection .flexslider {
  border:none
}

.contentSection .flexslider .slides {
}

.contentSection .flexslider .slides > li {
  position: relative
}

.contentSection .flexslider .slides > li::before {
  background:rgba(0, 0, 0, 0.45);
  content:'';
  inset:0;
  position:absolute;
}

.contentSection .flexslider .flex-control-nav {
  bottom:0
}

.contentSection .flexslider .flex-control-nav a {
  /*background:hsla(209, 88%, 16%, 1);
  border:1px solid hsla(76, 15%, 76%, 1);
  opacity: .65*/
}

.contentSection .flexslider .flex-control-nav a.flex-active {
  opacity:.95
}

.contentSection .flexslider .slideshowCaptionBlock {
  /*background:hsla(209, 88%, 16%, 1);
  border-top: 2px solid hsla(50, 84%, 69%, 1);
  color:white;
  padding: 1rem 1.5rem;
  text-align: center;
  text-shadow:1px 1px 1px rgba(0,0,0,.65);*/
}

.contentSection .flexslider .slideshowCaptionBlock h1 {
  color:white;
  font-size: 3rem;
  text-align:center;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.65), 0 0 12px rgba(0, 0, 0, 0.65);
}

.contentSection .flexslider .slideshowCaptionBlock .buttonSlideshow,
.eventContainer .eventsMore,
.articleContainer button {
  /*
  background-color:hsla(215, 19%, 55%, 1);
  box-shadow: 0 5px 15px 1px rgba(0,0,0,.4);
  border-color:rgba(255,255,255,.65);
  bottom:-.25rem;
  color:white;
  left:50%;
  position: absolute;
  transform:translate(-50%,50%);
  */
}

/******************
* End Slideshows *
******************/


/* End Absolute Styles */

/**
* Relative Styles:
* Styles that column based go here.
*/

/* One Column */
@media screen and (max-width:650px) {
/**
* Styles that are only for one column go here.
*/
.contentSection .flexslider .slideshowCaption h1 {
  font-size: 1.611rem;
}
}

/* One and Two Columns */
@media screen and (max-width:975px) {
/**
* Styles that are only for two columns go here.
*/

.contentSection .flexslider .slideshowCaptionBlock .buttonSlideshow {
  bottom:auto;
  left:auto;
  position:unset;
  transform:none;
}
}

/* Two Columns */
@media screen and (min-width:651px) and (max-width:975px) {
/**
* Styles that are only for two columns go here.
*/
}

/* Two & Three Columns */
@media screen and (min-width:651px) {
/**
* Styles that are for two and three columns go here.
*/
}

/* Three Columns */
@media screen and (min-width:976px) {
/**
* Styles that are for three columns go here.
*/

.contentSection .flexslider .slideshowCaption {
  max-width:1366px;
  left: 50%;
  position: absolute;
  top: 50%;
  transform:translate(-50%, -50%);
  width:calc(100% - 4rem)
}

.contentSection .flexslider .slideshowCaptionBlock {
  /*
  border-bottom: .5rem solid hsla(215, 19%, 55%, 1);
  bottom:0;
  box-shadow: 0 5px 15px 1px rgba(0,0,0,.4);
  position:absolute;
  right:0;
  transform:translateY(50%);
  */
}

/*contact*/
#contact .contactTable {
  border:none;
  border-collapse:collapse;
  display:table;
  width:100%
}

#contact .contactTr {
  display:table-row
}

#contact .contactTd1,
#contact .contactTd2 {
  display:table-cell;
  padding:.5rem;
  vertical-align:top
}
}

/**
* Relative Styles:
* Styles that device based go here.
*/

/* QVGA Screen */
@media screen and (max-width:320px) {
}

/* HVGA Screen */
@media screen and (min-width:321px) { /* and (max-width:480px) {*/
html {
  font-size:15.33px /*18px for largest font size*/
}
}

/* WVGA Screen */
@media screen and (min-width:481px) {/* and (max-width:800px) {*/
html {
  font-size:16.15px /*18px for largest font size*/
}
}

/* Large Screen */
@media screen and (min-width:801px) { /* and (max-width:1041px) { */
html {
  font-size:17px /*18px for largest font size*/
}
}

/* Extra Large Screen */
@media all and (min-width:1042px) {
html {
  font-size:18px
}
}

/* End Relative Styles */

/* Print Styles */

body.print {
  background:white;
  color:black;
  font-family:sans-serif !important;
  font-size:10pt;
  padding:.75in
}

body.print .contentBlock {
  margin:0;
  max-width:none;
  padding:0;
  width:100%
}

body.print h1,
body.print h2,
body.print h3,
body.print h4,
body.print h5,
body.print h6 {
  color:black !important;
  font-family:sans-serif !important;
}
/*File: /home/olive/public_html/pdx-home-repair/styles/site/animations.css*/
/** created:20160212 modified:20160212
* All styling for the header section goes here.
*/

/**
* Absolute Styles:
* Styles that apply to all content in this section go here.
*/

/* Button */
/*
.button,
.button:visited {
  background:rgba(234, 87, 41, .75);
  border-radius:10px;
  color:white;
  display:inline-block;
  font-size:1.222rem /*22px for 18px font-size*//*;
  padding:.75rem 1.5rem;
  text-decoration:none;
  text-shadow:none;
  -webkit-transition:background 0.3s ease-out;
  transition:background 0.3s ease-out
}

.button:hover,
.button:active,
.button:focus {
  background:#216a95;
  color:white
}
*/
/* Float Shadow */
.hvr-float-shadow-black,
.hvr-float-shadow-white {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  -webkit-transition-property:-webkit-transform;
  transition-property:-webkit-transform;
  transition-property:transform;
  transition-property: transform, -webkit-transform;
}

.hvr-float-shadow-black:before,
.hvr-float-shadow-white:before {
  pointer-events: none;
  position: absolute;
  z-index: -1;
  content: '';
  top: 100%;
  left: 5%;
  height: 10px;
  width: 90%;
  opacity: 0;
  /* W3C */
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform, opacity;
  -webkit-transition-property:opacity, -webkit-transform;
  transition-property:opacity, -webkit-transform;
  transition-property:transform, opacity;
  transition-property: transform, opacity, -webkit-transform;
}

.hvr-float-shadow-black:hover, 
.hvr-float-shadow-black:focus, 
.hvr-float-shadow-black:active,
.hvr-float-shadow-white:hover, 
.hvr-float-shadow-white:focus, 
.hvr-float-shadow-white:active {
  -webkit-transform: translateY(-5px);
  -ms-transform: translateY(-5px);
      transform: translateY(-5px);
  /* move the element up by 5px */
}

.hvr-float-shadow-black:hover:before, 
.hvr-float-shadow-black:focus:before, 
.hvr-float-shadow-black:active:before,
.hvr-float-shadow-white:hover:before, 
.hvr-float-shadow-white:focus:before, 
.hvr-float-shadow-white:active:before {
  opacity: 1;
  -webkit-transform: translateY(5px);
  -ms-transform: translateY(5px);
      transform: translateY(5px);
  /* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */
}

/* Float Shadow White */
.hvr-float-shadow-black:before {
  background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  background: -webkit-radial-gradient(center ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
}

/* Float Shadow White */
.hvr-float-shadow-white:before {
  background: -webkit-radial-gradient(center, ellipse, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 80%);
  background: -webkit-radial-gradient(center ellipse, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 80%);
  background: radial-gradient(ellipse at center, rgba(255, 255, 255, 0.35) 0%, rgba(255, 255, 255, 0) 80%);
}

/* End Absolute Styles */

/**
* Relative Styles: 
* Styles that column based go here.
*/

/* One Column */
@media screen and (max-width:650px) {
/**
* Styles that are only for one column go here.
*/
}

/* Two Columns */
@media screen and (min-width:651px) and (max-width:975px) {
/**
* Styles that are only for two columns go here.
*/
}

/* Two & Three Columns */
@media screen and (min-width:651px) {
/**
* Styles that are for two and three columns go here.
*/
}

/* Three Columns */
@media screen and (min-width:976px) {
/**
* Styles that are for three columns go here.
*/ 
}

/**
* Relative Styles: 
* Styles that device based go here.
*/

/* QVGA Screen */
@media screen and (max-width:320px) {
}

/* HVGA Screen */
@media screen and (min-width:321px) { /* and (max-width:480px) {*/
}

/* WVGA Screen */
@media screen and (min-width:481px) {/* and (max-width:800px) {*/
}

/* Large Screen */
@media screen and (min-width:801px) { /* and (max-width:1041px) { */
}

/* Extra Large Screen */
@media all and (min-width:1042px) { 
}

/* End Relative Styles */

