

.container,
.searchform,
footer,
header {
  position: relative;
}
html {
    overflow-x: hidden;
}
.container,
.searchform,
footer,
header {
  position: relative;
}

#hero {
  position: relative;
  overflow: hidden;
  height: 700px !important; /* Set the height of the hero section */
  background: url('images/gutter cleaning process.JPG') center center;
  background-size: cover;
}

#hero2 {
      height: 700px !important; /* Set the height of the hero section */

}











#hero-wrapper {
  position: relative;
  height: 100%;
}

.carousel-item img {
  width: 100%;
  max-height: 700px; /* Adjust this value to control the maximum height of the images */
  object-fit: cover;
  margin-top: 1rem;
  margin-bottom: 2rem;

}


.hero-overlay {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 20px;
  background-color: rgba(0, 0, 0, 0.5);
  color: white;
  margin-bottom: 10% !important;
  width: 100%;
  box-sizing: border-box;
  height: fit-content;
}
.parallax-container {
  position: relative;
  height: 700px; /* Adjust the height as needed */
  overflow: hidden;
}
.banner-overlay {
  color: white !important;
  font-size: 72px !important;
  font-weight: 200;
  font-family: "Open Sans", sans-serif;
  border-right: .7px solid rgba(119, 136, 153, 0.356);
  padding-left: 1rem !important;

}

.parallax-container .parallax {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: translateZ(0);
}

.hero-overlay {
  position: absolute;
  top: 80%;
  bottom: 0;
  left: 0;
  padding: 5px;
  color: #fff; /* Adjust text color as needed */
  background-color: rgba(39, 38, 38, 0.5); /* Adjust background color and opacity as needed */
}

.bottom-left {
  align-items: flex-start;
}

.hero-overlay h1 {
  margin: 0;
  font-size: 2rem;
}

.hero-overlay p {
  margin: 0;
  font-size: 1rem;
}

@media (min-width: 768px) {
  /* Parallax effect */
  #hero {
      background-attachment: fixed;
  }
 
}


.su-extra {
    display: none !important;
}

.full-height {
    height: 100vh; /* 100% of the viewport height */
  }

html {
    overflow-x: hidden;
}
.menu li:last-child {
    border-bottom: 0rem !important; /* Remove the border from the last item */
    
}


#access ul ul li:last-child {
    border-bottom: none !important;  /* Remove the border from the last item */
}
.borp {
    top: 15%;
text-align: center;
margin-left: auto;
margin-right: auto;
width: 100%;
margin-top: 1rem;

}

.borp li a {
    color: rgba(102, 101, 101, 0.788) !important;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    border-right: .7px solid rgba(119, 136, 153, 0.356);
    padding-left: 1rem !important;
}

.hamburger {
    display: none;
    background-color: transparent;
    border: none;
    color: white;
    font-size: 24px;
    cursor: pointer;
}

@media (min-width: 768px) and (max-width: 1200px) {

.container .navy{
       display: none !important;
        margin-left: none !important;
        margin-right: none !important;
    

}

 .hero-overlay {
  bottom: 8% !important;
}

.carousel-item img {
    height: 400px !important;
}
}

@media (max-width: 463px) {
    header {
    height: 130px !important;
}
}


@media (max-width: 768px) {
.borp {
    position: absolute;
    top: 20px; /* Adjust top position as needed */
    right: auto; /* Align menu to the right */
    width: 100%;
    background-color: transparent;
    color: rgba(255, 255, 255, 0.712);
    z-index: 1000;
    padding: 10px 20px;
    box-sizing: border-box;

}



#hero2 {
    margin-top: 0rem !important;
}

 .hero-overlay {
  top: 70% !important;
}

.carousel-item img {
    height: 400px !important;
}

span.not-block {
    display: inline-block; /* or inline-block */
  }

.borp .sub-menu li a {
    color: rgba(124, 122, 122, 0.671) !important;
    width: 100% !important;
    text-transform: ital;
    font-style: italic;

}

.borp .sub-menu li a:hover {
    color: rgba(28, 157, 243, 0.945) !important;
    width: 100% !important;
    text-transform: ital;
    font-style: italic;

}



.sub-menu li:hover {
background-color: #333 !important;
}

.sub-menu li a::before {
    content: '-';
    padding-right: .5rem;
    color: #00aeef;
}

#access li {
    width: 100% !important;
}


.menu-item-has-children .sub-menu {
}

.menu-item-has-children.active .sub-menu {
    display: block !important;
}
  
.plus {
    margin-top: 1rem;

}

.plus::after {
    content: "+"; /* Add the plus sign here */
    color: rgb(17, 150, 202);
    vertical-align: -.09rem; /* Adjust vertical alignment */
    padding-left: .5rem;
}

#access ul ul {
    position  : absolute;
    z-index   : 99999;
    top       : 1rem !important;
    left      : auto;
    display   : none;
    float     : left;
    width     : 300px;
    margin    : 0;
    
  }


#access li a:hover {
background-color: transparent !important;  }

#hero  {
margin-top: 0rem !important; 
}

#access li:hover {
    background-color: transparent !important;  

}
    
#access a:focus, #access li:hover > a {
    background-color: transparent !important;  

}


  .space {
      padding-left: 1rem !important;
  }

  .sub-menu.active {
    display: block;
}

  .sub-menu {
background-color: rgba(170, 166, 166, 0.096);
width: 100% !important;
border: 0 0 1px solid rgba(33, 185, 231, 0.301);
overflow: hidden;
box-shadow: 5px 4px 4px rgba(86, 144, 177, 0.452) !important; /* Apply box shadow to all sides except top */
border-radius: 5%;
border-top-left-radius: 0; /* Remove border radius from top left corner */
border-top-right-radius: 0; /* Remove border radius from top right corner */
  border-top-left-radius: -10px; /* Adjust the radius as needed */
  border-bottom-right-radius: 0; /* Adjust the radius as needed */


  }
  .menu li:hover {
      border-bottom: none !important;
  }

  .sub-menu li {
      border-bottom: none !important;
  }

.menu {
    display: flex;
    flex-direction: column;
    list-style-type: none;
    padding: 0;
    margin: 0;
    width: 50% !important;
    border-radius: 5px;
    border-top-left-radius: 5px; /* Remove border radius from top left corner */
border-top-right-radius: 0; /* Remove border radius from top right corner */
border-bottom-right-radius: 0; /* Remove border radius from top right corner */

    background-color: rgba(254, 254, 254, 0.884);
    box-shadow: -3px 0px 4px 0px rgba(54, 55, 56, 0.219), 0px 4px 4px 0px rgba(86, 143, 177, 0.219);


}

#access ul ul li {
    border-bottom: 1px solid rgba(93, 94, 95, 0.548);  /* Change the border color and style as needed */
}


#access ul ul li:last-child {
    border-bottom: none !important;  /* Remove the border from the last item */
}

.sub-menu {
    padding-bottom: 1rem;

}

.menu li {
    border-bottom: 1px solid rgba(145, 140, 140, 0.233);

    padding: 10px 0;
    border-radius: 5px;
}


.menu li a {
    color: white;
    text-decoration: none;
    text-align: left;
    border-right: 0rem !important;
}

.hamburger {
    display: none ;
    background-color: transparent;
    border: none;
    color: white;
    font-size: 24px;
    cursor: pointer;
}

#access ul {
    padding-left: 0rem !important;
    padding-right: 0rem !important;
}

#menu-item-122 > a:first-child {
    pointer-events: none !important;
  }
 #menu-item-147 > a:first-child {
    pointer-events: none !important;
  }

#menu-item-140 > a:first-child {
    pointer-events: none !important;
  }

#menu-item-135 > a:first-child {
    pointer-events: none !important;
  }

#menu-item-127  > a:first-child {
    pointer-events: none !important;
  }

#access ul ul a {
    width        : 180px;
    padding      : 10px;
    padding-top: 0rem;
    color        : #666;
    border-bottom: none !important;
    background   : transparent !important;
  }

  .su-extra {
      display: inline-block !important;
  }


#access ul ul a {
    width        : 180px;
    padding      : 10px;
    padding-top: 0rem;
    color        : #666;
    border-bottom: none !important;
    background   : transparent !important;
  }

 
    .borp {
        padding: 0;
    }

    .menu {
        display: none;
        position: absolute;
        top: 75px;
        right: 0; /* Align menu to the right */
        width: 100%;
        background-color: rgba(255, 255, 255, 0.979);
        color: ;
        z-index: 999;
        padding: 20px;
        box-sizing: border-box;
        animation: slideInRight 1.5s ease forwards;
    }

    #access ul li:hover > ul {
        display: block;
        position: inherit;
        z-index: 0;
            transition: transform 0.5s;

    }

    .menu.active {
        display: flex;
        flex-direction: column;
    }

    .hamburger {
        display: block;
        position: absolute;
        top: 20px;
        right: 20px; /* Align hamburger menu to the right */
    }
}

@keyframes slideInRight {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(0);
    }
}




h2 {
    font-size: 21px;
    font-family: "Open Sans", sans-serif;
}

p {
    color: rgb(89, 101, 114) !important;
    font-size: 14px;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-family: "Open Sans", sans-serif;
}

input, label  {
    color: rgb(89, 101, 114) !important;
    font-size: 14px;
    padding-top: 1rem;
    font-family: "Open Sans", sans-serif;

}

body {
  font-family     : 'Open Sans',sans-serif;
  font-size       : 14px;
  line-height     : 1.5em;
  color           : #666;
  background-color: #fefefe;
}
::marker {
    display: none !important;
    color: transparent;
}

footer,
header {
  width: 100%;
}

header {
  padding-top   : 12px;
  padding-bottom: 7px;
}






.sibling-pages li:hover {
    opacity: 1;
    color: rgba(48, 51, 54, 0.808);
}

.sibling-pages li a {
    position: relative;
    text-decoration: none !important;
    color: rgb(20, 162, 228) !important;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    

}

.sibling-pages .acty {
    position: relative;
    text-decoration: none !important;
    color: rgba(48, 51, 54, 0.808) !important;
    
}



.sibling-pages li {
    position: relative;
    transition: transform 0.5s;
}
.circle::before {
    content: "\2022";
    border-radius: 50%;
    width: 5px;
    height: 5px;
    margin: .2rem;
    color:black; /* Text color inside the circle */
}

.circle {
    color: rgba(102, 101, 101, 0.904) !important;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;

}

.circle1 {
  color: rgba(102, 101, 101, 0.904) !important;
  font-size: 14px;
  font-family: "Open Sans", sans-serif;
  padding: 5px;

}

.sibling-pages li a::before {
    content: '➤';
    position: absolute;
    left: -20px;
    color: #666;
    opacity: 0;
    transition: opacity 0.8s;
}

.sibling-pages li a.acty::before {
    display: none !important;
    transform: translateX(19px); /* Adjust the value to change the amount of sliding */
}

.sibling-pages li a.acty:hover {
    transition: 0 ;
}

.sibling-pages li:hover {
    transform: translateX(19px); /* Adjust the value to change the amount of sliding */

}

.sibling-pages li:hover {
    transform: translateX(19px); /* Adjust the value to change the amount of sliding */
    color: rgba(48, 51, 54, 0.808) !important;

}



.sibling-pages li a:hover::before {
    opacity: 1;
    color: rgba(48, 51, 54, 0.808);
}

.container header {
  margin-bottom : 20px;
  padding-top   : 20px;
  padding-bottom: 0;
}

header.gradient {
  background: #00d3f6;
  background: -moz-linear-gradient(top,#00d3f6 0,#00aeef 100%);
  background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#00d3f6),color-stop(100%,#00aeef));
  background: -webkit-linear-gradient(top,#00d3f6 0,#00aeef 100%);
  background: -o-linear-gradient(top,#00d3f6 0,#00aeef 100%);
  background: -ms-linear-gradient(top,#00d3f6 0,#00aeef 100%);
  background: linear-gradient(to bottom,#00d3f6 0,#00aeef 100%);
  filter:progid:DXImageTransform.Microsoft.gradient( startColorstr=  '#00d3f6', endColorstr='#00aeef', GradientType=0);
}

.searchform {
  float: right;
}

.searchform input[type=text] {
  font                 : 12px/1em 'Open Sans',sans-serif;
  position             : relative;
  z-index              : 1;
  width                : 90px;
  padding              : 1px 5px 2px;
  color                : #666;
  border               : none;
  -webkit-border-radius: 10px;
  -moz-border-radius   : 10px;
  border-radius        : 10px;
  -webkit-box-shadow   : inset 0 1px 2px rgba(0,0,0,.5);
  -moz-box-shadow      : inset 0 1px 2px rgba(0,0,0,.5);
  box-shadow           : inset 0 1px 2px rgba(0,0,0,.5);
}

#access a,
.top-nav a,
.top-nav span {
  line-height    : 1.5em;
  text-decoration: none;
}

#access ul ul,
.shadowed {
}

 blockquote {
    color: rgb(89, 101, 114) !important;
    font-size: 14px;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-family: "Open Sans", sans-serif;

 }

.searchform input[type=submit] {
  position   : absolute;
  z-index    : 2;
  right      : 5px;
  bottom     : 10px;
  display    : block;
  width      : 12px;
  height     : 12px;
  text-indent: -9001px;
  border     : none;
  background : url("siteart/btn-search-button.png") no-repeat;
}

#access li,
#logo,
#logo a,
#page-hero,
.top-nav li {
  position: relative;
}

#access {
    display: flex;
    justify-content: center; /* Center items horizontally */
    align-items: center; /* Center items vertically */
    height: 10px; /* Adjust the height as needed */

}

#access ul {
  margin      : 0;
  padding-left: 0;
  list-style  : none;
}

#access li {
  float: left;
  text-align: left;
}

#access a {
  display: block;
  padding: 0 1.2125em 5px 0;
  color  : #999;
}

#access li li a {
  padding: 0 1.2125em;
}

#access .current-menu-ancestor > a,
#access .current-menu-item > a,
#access .current_page_ancestor > a,
#access .current_page_item > a,
#access a:hover {
  color: #00aeef;
}

#access ul ul {
  position  : absolute;
  z-index   : 99999;
  top       : 1.5em;
  left      : 0;
  display   : none;
  float     : left;
  margin    : 0;
  box-shadow: 0 0 4px rgba(0,0,0,.5);
}

#access ul ul ul {
  top : 0;
  left: 100%;
}

#access ul ul a {
  width        : 180px;
  padding      : 10px;
  color        : #666;
  border-bottom: 1px dotted #ccc;
  background   : rgba(254,254,254,.8);
}

#access a:focus,
#access li:hover > a,
#access ul ul:hover > a {
  background: #efefef;
}

#access a:focus,
#access li:hover > a {
  color     : #00aeef;
  background: rgba(255,255,255,1);
}

#access ul li:hover > ul {
  display: block;
}

#logo,
#logo a {
  display: block;
  float  : left;
  width  : 150px;
  height : 80px;
}

#logo a {
  text-indent: -9001px;
  background : url("images/logo.png") no-repeat;
}

footer {
  margin-top      : -20px;
  padding-top     : 20px;
  padding-bottom  : 20px;
  color           : #999;
  background-color: #f2f2f2;
}

.containerr {
    margin: 2rem;

}

#page .container {
    width: 100%;
    margin: none !important;
    margin-bottom: 5rem;
}

.main-content a {
  -webkit-transition : all 250ms linear;
  -moz-transition    : all 250ms linear;
  transition         : all 250ms linear;
  text-decoration    : none;
  border-bottom-width: 1px;
  border-bottom-style: dotted;
}

.main-content a:link,
.main-content a:visited {
  color              : #00aeef;
  border-bottom-color: #fff;
}



.main-content a:active,
.main-content a:hover {
  color              : #333;
  border-bottom-color: #ccc;
}



.borp li a {
    color: rgba(102, 101, 101, 0.788) !important;
    font-size: 14px;
    font-family: "Open Sans", sans-serif;
    border-right: .7px solid rgba(119, 136, 153, 0.356);
    padding-left: 1rem !important;
}

.shadowed {
}

.top-nav {
  float: right;
}

.top-nav ul {
  margin    : 0;
  padding   : 0;
  list-style: none;
}

.top-nav li {
  font-size: 16px;
  float    : left;
}

.top-nav a,
.top-nav span {
  display            : block;
  padding            : 0 0 0 1.2125em;
  color              : #fff;
  text-shadow        : 0 -1px 0 rgba(0,0,0,.25);
  -moz-text-shadow   : 0 -1px 0 rgba(0,0,0,.25);
  -webkit-text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}

footer ul,
ul.sidebar {
  padding   : 0;
  list-style: none;
}

.top-nav a:hover {
  color              : #333;
}

.top-nav span {
  font-weight: 700;
}

#hero{
   margin-top: 1rem ;
}

#page-hero {
  display: block;
  float  : left;
  height : 237px;
  margin : 8px 0 20px;
}

.page-parent #page-hero {
  height: 355px;
  
}

#page-hero img {
  position: absolute;
  z-index : 1;
  
}


#page-hero span {
  font        : 300 72px/1em 'Open Sans',sans-serif;
  position    : absolute;
  z-index     : 2;
  bottom      : 10px;
  display     : block;
  float       : left;
  width       : 920px;
  padding-left: 30px;
  color       : #fff;
  background  : rgba(0,0,0,.33);
}

h1 {
  font-family: 'Open Sans',sans-serif;
  font-weight: 700;
  font-size  : 28px;
  margin-top : 10px;
  color      : #00aeef;
}

ul.sidebar {
  margin: 20px 0 0;
}

li.widget {
  margin-bottom: 20px;
}

.widget h2 {
  font         : 700 16px/1em 'Open Sans',sans-serif;
  color        : #666;
  border-bottom: 1px solid #ccc;
}

.lgc_testimonial-widget blockquote {
  margin: 0;
}

.lgc_testimonial-widget cite {
  font-size : 12px;
  font-style: normal;
  display   : block;
  text-align: right;
  color     : #999;
}

.lgc_free_estimate-widget .phone-number {
  font-size  : 16px;
  font-weight: 700;
  color      : #00aeef;
}

.gutter-cleaning span {
  font-family        : Belgrano,serif;
  font-size          : 32px;
  float              : right;
  width              : 630px;
  margin-top         : 20px;
  text-align         : right;
  color              : #fff;
  text-shadow        : 0 -1px 0 rgba(0,0,0,.25);
  -moz-text-shadow   : 0 -1px 0 rgba(0,0,0,.25);
  -webkit-text-shadow: 0 -1px 0 rgba(0,0,0,.25);
}

.gutter-cleaning a {
  text-decoration: none;
  color          : #fff;
}

article h2,
article h2 a:link,
article h2 a:visited,
article h3 {
  color: #00aeef;
}

footer ul {
  line-height: 2;
  margin     : 0 0 20px;
}

h2.search-title,
p.copyright {
  margin-bottom: 0;
}

footer li a {
  font-size      : 12px;
  text-decoration: none;
  color          : #999;
}

p.copyright {
  font-size: 10px;
}

article h2 {
  font: 700 21px 'Open Sans',sans-serif;
}

article h2 a {
  -webkit-transition: all 250ms linear;
  -moz-transition   : all 250ms linear;
  transition        : all 250ms linear;
  text-decoration   : none;
}

article h2 a:active,
article h2 a:hover {
  color: #666;
}

article h3 {
  font: 18px 'Open Sans',sans-serif;
}

article.testimonial {
  padding-bottom: 1em;
  border-bottom : 1px solid #ccc;
}

article.testimonial cite {
  font-size : 12px;
  font-style: normal;
  display   : block;
  text-align: right;
}

.alignleft {
  float       : left;
  margin-right: 10px;
}

.alignright {
  float      : right;
  margin-left: 10px;
}

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

ul.social li {
  position   : relative;
  float      : left;
  margin-left: 10px;
}

ul#menu-sitemap,
ul#menu-sitemap ul {
  list-style: none;
}

.post-meta {
  font-size: 12px;
  color    : #666;
}

.pagination a,
.pagination span {
  display         : block;
  float           : left;
  padding         : 2px 3px;
  background-color: #fff;
}

.pagination .totals {
  font-weight: 700;
}

.search-price.onsale {
  text-decoration: line-through;
}

.search-sale-price {
  color: #ef7c00;
}

.page-template-portfolio-php #page img {
  display           : block;
  float             : left;
  padding           : 5px;
  background        : #fff;
  -webkit-box-shadow: 0 0 4px rgba(0,0,0,.5);
  -moz-box-shadow   : 0 0 4px rgba(0,0,0,.5);
  box-shadow        : 0 0 4px rgba(0,0,0,.5);
}

.wpcf7 input[type=email],
.wpcf7 input[type=submit],
.wpcf7 input[type=text],
.wpcf7 textarea {
  font-family: 'Open Sans',sans-serif;
  font-size  : 14px;
  padding    : 7px 10px;
  border     : none;
}

.page-template-portfolio-php #page a.gallery,
.wpcf7 div {
  margin-bottom: 7px;
}

.wpcf7 label {
  display      : block;
text-align: left;
  width        : 100%;
  margin-bottom: .2rem;
}

.wpcf7 input[type=email],
.wpcf7 input[type=text],
.wpcf7 textarea {
  line-height       : 1.5;
  width             : 690px;
  margin-top        : 0;
  margin-bottom     : 10px;
  -webkit-transition: all 250ms linear;
  -moz-transition   : all 250ms linear;
  transition        : all 250ms linear;
  color             : #999;
  background        : #fff;
  -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,.5);
  -moz-box-shadow   : inset 0 0 2px rgba(0,0,0,.5);
  box-shadow        : inset 0 0 2px rgba(0,0,0,.5);
}

.wpcf7 input[type=email]:focus,
.wpcf7 input[type=text]:focus,
.wpcf7 textarea:focus {
  color             : #666;
  -webkit-box-shadow: inset 0 0 2px rgba(0,0,0,.75);
  -moz-box-shadow   : inset 0 0 2px rgba(0,0,0,.75);
  box-shadow        : inset 0 0 2px rgba(0,0,0,.75);
}

.wpcf7 .human-test input,
.wpcf7 .your-email input,
.wpcf7 .your-name input,
.wpcf7 .your-phone input {
  width: 190px;
}

.wpcf7 input[type=submit] {
  font-weight       : 700;
  float             : right;
  cursor            : pointer;
  -webkit-transition: all 250ms linear;
  -moz-transition   : all 250ms linear;
  transition        : all 250ms linear;
  text-transform    : uppercase;
  color             : #fff;
  background        : #00aeef;
  -webkit-box-shadow: 0 0 4px rgba(0,0,0,.5);
  -moz-box-shadow   : 0 0 4px rgba(0,0,0,.5);
  box-shadow        : 0 0 4px rgba(0,0,0,.5);
}

.wpcf7 input[type=submit]:hover {
  background: #666;
  color: #ccc;
}

a.lgc_gallery {
  position     : relative;
  display      : block;
  float        : left;
  margin-top   : 5px;
  margin-bottom: 5px;
}

h2.price {
  font-size : 48px;
  text-align: right;
  color     : #666;
}

.product {
  text-align: center;
}

.main-content span.product-name a {
  font-weight: 700;
  color      : #333;
}

.main-content span.product-price a {
  font-size  : 14px;
  font-weight: 700;
  color      : #00aeef;
}

.post img.aligncenter.size-large {
  display:   block;
  margin:    0 auto 10px;
  height:    auto;
  max-width: 710px;
}
