@media only screen and (max-width:1800px) {
    .design-in:after{width: 850px;height: 150px;top: 55%;}
    .construction-in figure img {width: 100%;height: auto;object-fit: cover;}
    .banner-right figure img{width: 100%; height: auto; object-fit: cover;}
    .system:after {width: 900px; height: 160px;}
	.banner.ellis .banner-right figure img { width: 475px; height: 498px;}
    
}
@media only screen and (max-width:1650px) {
    .system:after {width: 900px; height: 160px;}
	.banner.ellis .banner-right figure img { width: 475px; height: 498px;}
}

@media only screen and (max-width:1456px) {
    .cape-in h1:after{right:0; }
    .logo:after{top: 170px;}
    .septic p{max-width: 600px;}
    .container{padding: 0px 15px}
    .header-right figure img {width: 400px;height: auto;object-fit: cover;}
    .logo{padding:  100px 0px 0px 48px;}
    .septic p{font-size: 24px; letter-spacing: 0; line-height: 35px;}
    .cape-in h1{padding: 0 90px 0 0;margin: 0 0 60px;}
    .cape-in {padding: 0 0 20px 0;}
    .cape-in p br{display: none;}
    .septic{padding: 45px 0 0 0;}
    .nav ul li a{font-size: 24px;}
    .design-in:after{width: 792px;height: 140px;left: 0;top:560px;}
    .design{width: 100%; height: auto; object-fit: cover;}
    .banner-right{width: 40%;}
    .banner-left{width: 60%;}
    footer{padding: 30px 0 0 0;}
    .footer-in {padding: 0 0 50px;}
    footer:after{width: 694px;}
    .footer-right-in h2{font-size: 35px;}
    .footer-right-in h2:after{width: 284px; top: 64px; left: -42px;}
    .footer-left-in figure img {margin: 22px 0 0 0px;}
    .banner.ellis {padding: 50px 0 0 0;}
    .banner.ellis .logo:after {top: 187px;}
    .banner.ellis figure img {width: 70%;}
    .logo.spec{padding: 125px 0px 0px 48px; }
    .banner.ellis .septic {padding: 30px 0 0 51px;}
nav ul li { padding: 0 15px;}
    .system:after {width: 806px;height: 147px;top: 567px;}
    .banner.ellis .banner-right figure img {width: 100%;height: auto;object-fit: cover;}
    .construction.house figure img {width: 100%; height: auto; object-fit: cover;}
    .cape-in p {padding: 0 90px 0 90px;}
    .logo:before{bottom: -34px;}
    .cape-in h1:before{right: 33px;}
    .footer-right-in h2:before{bottom: 26px;left: -9px;}
    .logo.spec:before{bottom: -33px;}
    .footer-right-in.sign h2:after {width: 284px;top: 66px;left: -27px;}
    .banner.ellis nav {padding: 174px 0 0 48px;}

}
   
@media only screen and (max-width:1367px) {
    .septic {padding: 45px 0 0 45px;}
    .logo{padding: 86px 0 0px 48px; width: 80%;}
    .logo:after {top: 150px;}
    nav ul li a{font-size: 24px;}
    nav ul li:hover a{font-size: 30px;}
    nav ul li.active a {font-size: 30px;}
    .design-in:after{width: 690px;height: 125px;left: 0;top:530px;}
    .cape-in p{letter-spacing: 0;}
    .cape-in h1{font-size: 45px;}
    .cape-in h1:after{width: 534px;bottom: -15px;}
    .cape {padding: 70px 0 20px 0;}
    .contact a{font-size: 28px;}
    .address-in p{font-size: 28px;}
    .jason {padding: 0 0 40px 0;}
    .logo.spec {padding: 94px 0px 0px 48px;}
    .banner.ellis .logo:after{top: 136px;
    width: 357px;}
    .system:after {width: 693px;height: 123px;top: 500px;}
    .banner.ellis .septic {padding: 30px 0 0 43px;}
    .services {padding: 75px 0 0px 0;}
    .services-in h1:after {width: 524px;right: 0;}
    .services-in h1 {padding: 0 90px 0 0px;margin: 0 0 49px 0;}
    .footer-in.cell {padding: 9px 0 50px 0;}
    .services-in p {padding: 0 90px 31px 90px;}
    .logo:before {bottom: -36px;}
    .cape-in h1:before{bottom: -30px;}
    .footer-right-in h2:after{left: -35px;}
    .logo.spec:before {bottom: -28px;}
    .services-in h1:before{bottom: -40px; right: 25px;}
    
}

@media only screen and (max-width:1220px) {
    .logo:after{top: 123px; width: 310px; left: -6px;}
    .logo{padding: 76px 0 0px 48px; width: 70%;}
    .septic p{font-size: 20px; line-height: 30px;}
    .septic{padding: 35px 0 0 0;}
    nav ul li{padding:0 17px 0 0;}
    .design-in:after {width: 559px;height: 100px;top:460px;}
    .septic{padding: 35px 0px 0 33px;}
    .banner{padding: 40px 0 0 0;}
    .cape-in h1{font-size: 35px;padding: 0 50px 0 0;margin: 0 0 50px;}
    .cape-in h1:after {width: 400px;bottom: -8px;}
    .cape{padding: 60px 0 20px 0;}
   .footer-in {padding: 0px 0 80px 0;}
    footer:after {width: 600px;}
    .contact{padding: 0;}
    .footer-right{width: 70%;}
    .footer-left{width: 30%;}
    .footer-right-in {padding: 0 0px 0 150px;}
    nav ul li.active a {font-size: 30px;line-height: 40px;}
    nav ul li {padding: 0 15px;line-height: 40px;}
    .banner.ellis nav ul li{padding: 0 15px;}
    nav ul li a{font-size: 19px;}
    nav ul li:hover a{font-size: 25px;}
    nav ul li.active a {font-size: 25px;}
    .system:after { width: 557px;height: 104px;top: 475px;}
    .services-in h1{font-size: 45px;padding: 0 50px 0 0px;}
    .services-in h1:after {width: 423px;bottom: -7px;}
     h2 {padding:0 50px 31px 50px}
    .footer-in.cell figure img {width: 100%; height: auto; object-fit: cover;}
    .cell .footer-right-in h2 {padding: 4px 0px 20px 18px;}
    .footer-in.cell {padding: 9px 0 75px 0;}
    .cape-in p {padding: 0 50px 0 50px;}
    .services-in p {padding: 0 50px 31px 50px;}
    .logo:before{bottom: -33px;}
    .cape-in h1:before{bottom: -23px; right: 13px;}
    .footer-right-in h2:before{bottom: 26px;left: -23px;}
    .logo.spec:before {bottom: -36px;}
    .footer-right-in h2:before {bottom: 26px;}
    .footer-right-in.sign h2:after{left: -53px;}
    .footer-right-in.sign h2:before {bottom: 0px;}
	.services-in ul { list-style:disc;font-family: 'Lato', sans-serif;font-weight: 400;font-size: 17px;color: #333333;text-align:left;line-height: 30px;padding: 0 84px 31px 90px;letter-spacing: -0.2px;}

}

@media only screen and (max-width:991px) {
    .logo{width: 70%; padding: 63px 0 0px 43px;}
	.logo:after {top: 100px;width: 309px;left: 17px;}
    .septic{padding: 30px 0px 0 33px;}
    nav ul li a{font-size: 19px;}
    .cape-in h1{font-size: 30px;padding: 0 40px 0 0;margin: 0 0 30px;}
    .cape-in p{font-size: 17px;}
    nav{padding: 135px 0 0 53px;}
    .design-in:after{top: 422px;}
    .cape-in h1:after{width: 344px;/* right: 13px; */}
    .cape-in{padding: 0;}
    .septic p {font-size: 16px;line-height: 25px;}
    .design-in:after{top: 415px;}
    nav {padding: 170px 0 0 53px;}
    .footer-right-in h2{font-size: 25px;}
    .contact a {font-size: 20px;}
    .contact p{font-size: 20px;}
    .footer-right-in h2:after {width:100%;top: 56px;left: -42px;}
    .footer-right-in h2{padding: 7px 0px 15px 18px;}
    .jason {padding: 0 0 20px 0;}
    .address-in p{line-height: 20px;}footer:after {width: 500px;}
    .footer-in {padding: 0px 0 45px 0;}
    .banner.ellis figure img{width: 613px;}
    .logo.spec {padding: 56px 0px 0px 48px;}
    .banner.ellis .logo:after {top: 89px;width: 228px;}
    nav ul li a {font-size: 17px;}
    nav ul li:hover a{font-size: 20px;}
    nav ul li.active a {font-size: 20px;}
    nav ul li {padding: 0 15px 0 0px;}
    .banner.ellis nav ul li {padding: 0 15px 0 0px;}
    .system:after {width: 448px;height: 78px;top: 423px;}
    .services-in h1:after {width: 335px;top: 58px;}
    .services-in h1 {padding: 0 40px 0 0px;margin: 0 0 30px 0;}
    .services-in p{padding: 0 0px 25px 0px; font-size: 17px;}
    .logo:after{width: 304px; left: -6px;}
    .footer-right-in.sign h2{font-size: 23px;}
   .cape-in p {padding: 0 40px 0 40px;}
    .services-in p {padding: 0 40px 31px 40px;}
    .logo:before{bottom: -33px;}
    .cape-in h1:before{right: 16px;}
    .footer-right-in h2:before{bottom: 26px;left: -23px;}
    .logo:before {bottom: -30px;}
    .footer-right-in h2:before {bottom: 2px;left: -27px;}
    .logo.spec:before {bottom: -27px;}
    .services-in h1:before {bottom: -17px;right: 8px;}
    .footer-right-in h2:before {bottom: 0px;}
    .footer-right-in.sign h2:before {left: -44px;}
     h2 {padding:0 40px 31px 40px}

    
}
   

@media only screen and (max-width:767px) {
    .cape-in p{padding: 15px 0 0 0;}
    .banner.ellis{padding: 20px 0 0 0;}
    .banner.ellis .septic {padding:0;}
    .logo:after {top: 72px;width: 100%; left: 0;}
	.septic p {font-size: 19px;line-height: 23px;}
    .septic {padding:0px 0px 30px 0px;text-align: center;width: 100%;display: inline-block;}
    .logo {padding:0 0 0 35px;margin:  0 0 40px 0;float: left;}
    .design-in:after{display: none;}
    nav{display: none;}
    .banner-left{width: 100%; float: none;}
    .banner-right{width: 100%; float: none;}
	.banner-right figure img {width: 45%; height: auto; object-fit: cover; margin: auto;}
    .logo:after {top: auto;width:304px;left:0;bottom: -15px;}
    .cape {padding: 50px 0 20px 0;}
    .cape-in h1{font-size: 21px;padding: 0 0;line-height: 21px;text-align: center;}
    .cape-in h1:after {width: 268px;bottom: -17px;}
    .cape-in p{font-size: 15px; line-height: 26px; text-align: center; padding: 0;}
    .footer-left{width: 100%; float: none;}
    .footer-right{width: 100%; float: none;}
    .footer-left-in figure img{margin: 0 auto;}
    .footer-left {padding: 0 0 20px 0;}
    .footer-in {padding: 0px 0 80px 0;}
    .footer-right-in h2 { padding: 7px 0px 15px 0px;}
    
    .menu{display: block;margin:0px 0 0 0;background: none;border: 0 none;outline: none;cursor: pointer;float: right;}
    .menu span {width: 35px; height: 3px; background: #333333; position: relative; display: block;}
    .menu span + span {margin: 6px 0 0 0;}
    .side_bar {width: 250px; height: 100%; position: fixed; right: -250px; top: 0; background: #efefef; display: block; z-index: 9; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; overflow: auto;}
    
     .wrapper{position: relative; left: 0; transition: all 0.3s ease-in-out; -webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out;}
    .open-menu .side_bar {right: 0}
    .open-menu .wrapper{left:-250px;}
    .open-menu .menu span:nth-child(1){transform: rotate(45deg); top: 9px;}
    .open-menu .menu span:nth-child(2){opacity: 0;}
    .open-menu .menu span:nth-child(3){transform: rotate(-45deg); top: -9px;}
    
    .banner.ellis .banner-left{width: 100%; float: none;}
    .banner.ellis .banner-right{width: 100%; float: none;}
    .system:after{display: none;}
    .banner.ellis .logo:after{width:238px; bottom: -54px; top:auto; margin: 0 0 40px 0;
    float: left; left: -10px;}
    .logo.spec {padding: 0 0px 0px 30px; width: 304px;}
    .logo.spec:before {bottom: -29px; left: -5px;}
    .banner.ellis .banner-left{padding: 0 0 20px 0;}
    .services-in h1 {padding: 0 63px 0 0px;margin: 0 0 20px 0;
text-align: right;font-size: 25px;}
    .services-in h1:after{width: 250px; right: 0; top: 55px;}
    .services-in h1:before {bottom: -14px;}
	 h2 {padding: 0 0px 20px 0px;font-size: 20px;line-height: 25px;}
    .services-in p {padding: 0 0px 20px 0px;font-size: 16px;line-height: 25px;}
    .services {padding: 35px 0 0px 0;}
    .cape-in h1:after{width: 300px;right: -72px; bottom: -12px;}
    .side_bar nav {display: block !important; padding: 40px 0 0 0px;}
    nav ul{margin: 0;}
    nav ul li{float: none; display: block; padding: 0 0 20px 0;} 
    nav ul li a{padding: 0 15px;}
    .banner{padding: 20px 0 0 0;}
    .cape-in{text-align: center; }
    .cape-in h1{display: inline-block;}
    .contact.north {padding: 0;}
     .banner-right figure {float: none;}
    .septic p {max-width: 100%;}
    .cape-in h1:before {bottom: -27px; right: -66px;}
		.services-in ul { list-style:disc;font-family: 'Lato', sans-serif;font-weight: 400;font-size: 16px;color: #333333;text-align:left;line-height: 30px;padding: 0 84px 31px 50px;letter-spacing: -0.2px;}
    .banner.ellis .banner-right figure img {width: 53%; height: auto; object-fit: cover; margin:auto;}

    
}

@media only screen and (max-width:599px) {
    .menu{margin: 0px 0 0 0;}
    .cape-in p {font-size: 14px;line-height: 25px;}
    .cape {padding: 20px 0;}
    .footer-in {padding: 0px 0 48px 0;}
    .footer-right-in {text-align: center; padding: 0;}
    .footer-right-in h2 {padding: 0px 0px 20px 0px;}
    .contact{padding: 0; text-align: center;}
     .logo:before{width: 11px;
    height: 18px; bottom: -23px;}
    .footer-left-in {padding: 0 0 15px 0;}
    .septic p {font-size: 18px;}
    .footer-in:after {width: 430px;height: 88px;bottom:0px;}
    .footer-left-in figure img {width: 100%;}
    .footer-right {padding: 0 0 80px 0;}
    .footer-right-in h2:before {bottom: -1px;left: -36px;}
    .cape-in h1:before {right: -12px; width: 11px; height: 18px; bottom: -20px;}
    .cape-in h1:after {width: 266px;right: -19px;}
    .footer-right-in h2:before{width: 11px; height: 18px; bottom: 16px;}
    .footer-right-in h2:after{top: 47px; }
    .logo.spec:before {bottom: -22px;}
    .services-in h1:before {right: 13px; width: 11px; height: 18px; bottom: 1px;}
    .services-in h1:after{top: 47px;}
    .footer-right-in.sign h2:after {width: 218px;top: 57px;}
    .footer-in.cell {padding: 9px 0 15px 0;}
	 .column {width: 100%;}
}
}

@media only screen and (max-width:479px) {
    .logo.spec{width: 190px;}
    .banner.ellis .logo:after {width: 160px;bottom: -49px;}
    .septic{padding: 0px 0px 30px 0px;}
   .menu{margin: 5px 0 0 0;}
    .cape-in h1 {font-size: 20px;padding: 0 0 10px 0;}
    .cape-in h1:after { top: 45px;bottom: 0;}
    .cape-in p {font-size: 13px;line-height: 21px;}
    .septic p {font-size: 14px;line-height: 20px;}
    .footer-right-in h2 {font-size: 15px;}
    .contact a {font-size: 15px; margin: 0 0 4px 0;}
    .address-in p {font-size: 15px; line-height: 15px;}
    .cape-in h1:after{width: 243px; right: -23px;}
    .footer-right-in h2 {padding: 0px 0px 10px 0px;}
    .footer-in {padding: 0px 0 20px 0;}
    .services-in h1 {font-size: 20px;}
    .logo:before{width: 11px;
    height: 18px; bottom: -19px;}
    .logo:after {top: auto;width: 168px;left: 0;bottom: -11px;}
    .services-in h1:before{width: 11px; height: 18px; bottom: 1px; right: 10px;}
    .footer-right-in h2:before{width: 11px; height: 18px; bottom: 7px;}
    .footer-right-in.sign h2:after{top: 46px; }
    .logo.spec:before {bottom: -17px;}
.menu {margin: 0px 0 0 0;}
    .services-in h1:after {width: 194px;}
    .footer-right-in.sign h2:before { width: 11px;height: 18px;bottom: 20px;left: -5px;}
    .footer-right-in.sign h2:after {
        width: 190px; left: -12px; top: 53px; }
    .cape-in h1:before {bottom: -3px;}
    .footer-right-in.sign h2 {font-size: 17px;}
    
}

