@charset "UTF-8";
/* CSS Document */

@media all and (min-width : 0px)

{
	
	
	/*
HEADLINES
*/
	
	h1 {font-size: 40px;
	line-height: 100%}
	
	h2 {font-size: 28px;}
	
	h3 {font-size: 28px;}
	
	h4 {font-size: 24px;}
	
	h5 {font-size: 24px;}
	
	h6 {font-size: 42px;}

	.red-headline {font-size: 42px;
	line-height: 100%}
	
	
	/*
HOME PAGE TOP AND MENU 
*/

	
	
.video-container {
  position:relative;
  top: 0;
  bottom: 0;
  width: 100%;
  height: 450px; 
  overflow: hidden;
  background-image: url("../video/poster.jpg");
	background-size: cover;
	background-position: center;

}	
	
	video {
    display: none;
  }
	

.overlay {

  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  margin: auto;
  box-sizing: border-box;
  padding-top:  50px;
  line-height: 1.5;
  text-align: center;
  :last-child { margin-bottom: 0; }
}

	
.homepage-logo-overlay {width:330px;
	height: 150px;
	background-image: url("../images/2026-Logo-homepage-small.png");
	background-position: center;
	background-size: 330px;
	background-repeat: no-repeat;
	margin: auto;}


	#overlay-quote-button {width:300px;
	height: 75px;
	background-image: linear-gradient( #b96431, #975126);
	border-radius: 10px;
	margin:auto;
	margin-top: 20px;
	font-family: "alegreya", sans-serif;
	font-weight: 600;
	font-style: normal;
	font-size: 33px;
	color:white;
	padding-top: 10px;
	box-sizing: border-box;
	border: 1px solid #E6E6E6;
	box-shadow: 1px 1px 3px black;
		text-align: center;
	}	
	
	#overlay-quote-button:hover {background-image: linear-gradient( #b96431, #77421f);
	text-decoration: none;}
	#overlay-quote-button a:link {text-decoration: none;
	color:#E6E6E6;}
	#overlay-quote-button a:hover {text-decoration: none;
	color:white;}
	#overlay-quote-button a:active {text-decoration: none;
	color:#E6E6E6;}
	#overlay-quote-button a:visited {text-decoration: none;
	color:#E6E6E6;}
	
	
	.quote-button {width:300px;
	height: 68px;
	background-image: linear-gradient( #b96431, #975126);
	border-radius: 10px;
	margin:auto;
	margin-top: 30px;
	font-family: "alegreya", sans-serif;
	font-weight: 900;
	font-style: normal;
	font-size: 30px;
	color:white;
	padding-top: 15px;
	box-sizing: border-box;
	border: 1px solid white;
	box-shadow: 1px 1px 3px black;
		text-align: center;
	}	
	
	.quote-button:hover {background-image: linear-gradient( #b96431, #77421f);
	text-decoration: none;}
	.quote-button a:link {text-decoration: none;
	color:#E6E6E6;}
	.quote-button a:hover {text-decoration: none;
	color:#E6E6E6;}
	.quote-button a:active {text-decoration: none;
	color:#E6E6E6;}
	.quote-button a:visited {text-decoration: none;
	color:#E6E6E6;}
	
	
	
	.home-page-phone {width:300px;
	height:100px;
	margin: auto;
	margin-top:15px;
	font-family: "alegreya", serif;
font-weight: 700;
font-style: normal;
font-size: 55px;
color:#E6E6E6;
text-shadow: 1px 1px #000000; }
	
	
	
	
	.home-page-phone a:link {text-decoration: none;
	color:#E6E6E6;}
	
	.home-page-phone a:hover {text-decoration: none;
	color:white;}
	
	.home-page-phone a:active {text-decoration: none;
	color:white;}
	
	.home-page-phone a:visited {text-decoration: none;
	color:white;}
	
	
	
	.before-after-learnmore {width:250px;
	height:60px;
	background-color: #b96431;
	text-align: center;
	color:white;
	font-family: effra, sans-serif;
    font-weight: 700;
	font-size: 20px;
	line-height: 60px;
	border: solid 1px #ffffff;
	margin: auto;
	margin-top: 50px;}
	
	

	
	.before-after-learnmore a:link {color:white; text-decoration: none;}
	
	.before-after-learnmore a:active {color:white; text-decoration: none;}

	
	.before-after-learnmore a:visited {color:white; text-decoration: none;}
	
	
	.before-after-learnmore a:hover {text-decoration: none;
	color:white;}
	
	
		.before-after-learnmore:hover {background-color:#975126;
	 /* Firefox */
    -moz-transition: all .25s ease-in;
    /* WebKit */
    -webkit-transition: all .25s ease-in;
    /* Opera */
    -o-transition: all .25s ease-in;
    /* Standard */
    transition: all .25s ease-in;
			
	text-decoration: none;}
	
	
	
	
	
	
	
	
	
	
	/*
FOOTER
*/
	
	
	
	.footer-wrapper {width:100%;
	height:auto;
	background-image: linear-gradient( #2b3440, #12131a)
	}
	
	
	
	.footer-top {width:340px;
		height:510px;
	    margin:auto;
		box-sizing: border-box;
	}
	
	
	
    .footer-middle {width:340px;
		height:auto;
	    margin:auto;
	}
	
	
	.footer-bottom-wrapper {width:100%;
		height:130px;
	    margin:auto;
		background-color:#975126;
	}
	
		
	.footer-social {width:340px;
	height:260px;
	float:left;}
	
	
	
	.footer-social-button {
	width:190px;
	height:60px;
    margin: auto;
	}
	
	.footer-social-icons {width:100px;
	height:100px;
	background-color: blanchedalmond;
	float:left;
	margin-left: 10px;}
	
	
	
	.footer-social-facebook {
	display: block;
	width: 50px;
	height: 50px;
	border-radius: 10px;
	background: url('../images/facebook.png') bottom;
	text-indent: -99999px;
}
	
.footer-social-facebook:hover {
	background-position: 0 0;
}


.footer-social-pintrest {
	display: block;
	width: 50px;
	height: 50px;
	border-radius: 10px;
	background: url('../images/pintrest.png') bottom;
	text-indent: -99999px;
}
	
.footer-social-pintrest:hover {
	background-position: 0 0;
}

.footer-social-youtube {
	display: block;
	width: 50px;
	height: 50px;
	border-radius: 10px;
	background: url('../images/you-tube.png') bottom;
	text-indent: -99999px;
}
	
.footer-social-youtube:hover {
	background-position: 0 0;
}
	
		
	
	.footer-email {width:340px;
	height:200px;
	float:right;}
	
	
	
	.footer-menu-divider-contact {width:340px;
	height:420px;
	float: none;
	display: block;}
	
	.footer-menu-divider {width:340px;
	height:400px;
	float: none;
	display: none;}
	
	
	.footer-menu-divider-sub {width: 100%;
	height:50%;
	float:left;
	font-family: effra, sans-serif;
    font-weight: 400;
    font-style: normal;
	font-size: 14px;
		padding-left: 40px;
		box-sizing: border-box;
		display: none;
	}
	
	
	.footer-menu-divider-sub li {color: white;
	line-height: 1.5em;}
	
	
	.footer-menu-divider-sub a:link {color: white;
	text-decoration: none;}
	
	.footer-menu-divider-sub a:visited {color: white;
	text-decoration: none;}
	
	.footer-menu-divider-sub a:active {color: white;
	text-decoration: none;}
	
	.footer-menu-divider-sub a:hover {color: white;
	text-decoration: underline;}
	
	
	.footer-copyright {width:340px;
	height: 50px;
	float:none;
	color:white;
	font-family: effra, sans-serif;
    font-weight: 400;
    font-style: normal;
	font-size: 16px;
	padding-top: 28px;
	padding-left: 0px;
	box-sizing: border-box;
	letter-spacing: 1px;
		text-align: center;
	margin: auto;}
	
	
	.footer-policy {width:340px;
	height: 80px;
	float: none;
	text-align: center;
	color:white;
	font-family: effra, sans-serif;
    font-weight: 400;
    font-style: normal;
	font-size: 12px;
	padding-top: 10px;
	padding-right: 0px;
	box-sizing: border-box;
	letter-spacing: 1px;
	margin: auto;}
	
	.footer-policy a:link {color: white;
	text-decoration: none;}
	
	.footer-policy a:visited {color: white;
	text-decoration: none;}
	
	.footer-policy a:active {color: white;
	text-decoration: none;}
	
	.footer-policy a:hover {color: white;
	text-decoration: underline;}
	
	
	.footer-google-reviews {width:100%;
	height:180px;
	background-image:url("../images/Google-Reviews.png");
	background-size: 300px;
	background-repeat: no-repeat;
	background-position: center;
	margin-top: 20px;}
	
	
	
	.footer-logo {width:100%;
	    height:150px;
		background-image: url("../images/2026-Logo-homepage.png");
		background-size:contain;
		background-repeat: no-repeat;
		background-position: center;}
	
	.footer-contact {width:100%;
	height:180px;
	text-align: center;
	font-family: "alegreya", serif;
    font-weight: 700;
    font-style: normal;
	color:#E6E6E6;
	font-size: 20px;}
	
	
	.footer-contact-phone {font-size: 36px;
	color:white;}
	
	.footer-contact a:link {color: #E6E6E6;
	text-decoration: none;}
	
	.footer-contact a:visited {color:  #E6E6E6;
	text-decoration: none;}
	
	.footer-contact a:active {color:  #E6E6E6;
	text-decoration: none;}
	
	.footer-contact a:hover {color:  #E6E6E6;
	text-decoration: underline;}
	
	
		#footer-quote-button {width:230px;
	height: 50px;
	background-image: linear-gradient( #b96431, #975126);
	border-radius: 10px;
	margin:auto;
	margin-top: 15px;
	font-family: "alegreya", sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 22px;
	color:white;
	padding-top: 6px;
	box-sizing: border-box;
	border: 1px solid white;
	box-shadow: 1px 1px 3px black;
	}	
	

	#footer-quote-button a:link {text-decoration: none;
	color:white;}
	#footer-quote-button a:hover {text-decoration: none;
	color:white;}
	#footer-quote-button a:active {text-decoration: none;
	color:white;}
	#footer-quote-button a:visited {text-decoration: none;
	color:white;}
	#footer-quote-button:hover {background-image: linear-gradient( #b96431, #77421f);  text-decoration: none;}
	
	
/*
Generic Page Stuff
*/	
	
	
	
	
	.page-content {width:340px;
	height:auto;
	margin: auto;
	padding-top: 35px; }
	
	
	.generic-header-wrapper
	
	{width: 100%;
	height:200px;
	background-image:url("../images/page-bg.jpg");
	}
	
	.generic-header-headline {width:auto;
	height:auto;
	font-family: effra, sans-serif;
font-weight: 800;
font-style: normal;
font-size: 52px;
color:#bf1e2e;
text-shadow: 1px 1px #000000; 
	}
	
	.generic-header-subheadline {font-family: effra, sans-serif;
font-weight: 800;
font-style: normal;
font-size: 20px;
color:black; }
	
	
	
	.large-page-photo {width:340px;
	margin:auto;
	margin-top: 50px;
	margin-bottom: 50px;
	height:300px;
	background-size: cover;
	}
	
	
	.page-photo-array-block {width:340px;
	margin: auto;}
	
	
	
	.page-photo-array-wrapper {width:342px;
	height:255px;
	margin-bottom: 20px;}
	
	.page-photo-array-photo {width:340px;
	height:200px;
	background-size: cover;
	background-position: center;}
	
	.page-photo-array-caption {width:340px;
	height: 53px;
	padding: 8px;
	box-sizing: border-box;
	font-family: effra, sans-serif;
	font-size: 15px;
	text-align: center;
	color:#BE1E2C;}
	
	
	.youtube-video {width:100%;
	height:200px;
	margin-bottom: 20px;}
	
	
	
		
	.learnmore-button {width:250px;
	height:60px;
	background-color: #bf1e2e;
	text-align: center;
	color:white;
	font-family: effra, sans-serif;
    font-weight: 700;
	font-size: 20px;
	line-height: 60px;
	border: solid 1px #ffffff;
	margin-top: 50px;
	margin-bottom: 25px;}
	
	
	.learnmore-button a:link {color:white; text-decoration: none;}
	
	.learnmore-button a:active {color:white; text-decoration: none;}

	
	.learnmore-button a:visited {color:white; text-decoration: none;}
	
	
	.learnmore-button a:hover {text-decoration: none;
	color:white;}
	
	
	.learnmore-button:hover {background-color:#991824;
	 /* Firefox */
    -moz-transition: all .25s ease-in;
    /* WebKit */
    -webkit-transition: all .25s ease-in;
    /* Opera */
    -o-transition: all .25s ease-in;
    /* Standard */
    transition: all .25s ease-in;
			
	text-decoration: none;}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
/*
Promo Literature
*/
	
	
	
	
	.promo-wrapper {width:330px;
	height:330px;
	background-color: #4a4a4a;
	border-radius: 15px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
	float: left;
	margin-left: 10px;
	margin-bottom: 10px;}
	

	.promo-photos {width:330px;
	height:250px;
	background-size: cover;
	background-position: top;
	margin-bottom: 10px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
		background-repeat: no-repeat;}
	
	
	
	.promo-caption {width:340px;
	height:auto;
	font-family: effra, sans-serif;
	font-style: normal;
	font-size: 18px;
	line-height:120%;
	color:white;
	float:left;
	padding:20px;
	box-sizing: border-box;
	}
	
		.promo-caption a:link {color:white;}
		.promo-caption a:visited {color:white;}
		.promo-caption a:hover {color:white;}
		.promo-caption a:active {color:white;}
	
	
	.brochure {background-image: url("../pdf/promo/thm/Under-Deck-Oasis-Brochure-1.jpg")}
	
	.product-guide {background-image: url("../pdf/promo/thm/Product-Guide.jpg")}
	
	.color-match-woodgrain {background-image: url("../pdf/promo/thm/color-match---woodgrain.jpg")}
	
	.color-match-solid {background-image: url("../pdf/promo/thm/color-match--solid.jpg")}
	
	.graph-paper {background-image: url("../pdf/promo/thm/UDO-Graph-Paper.jpg");
	background-position: bottom;}
	
	.installation-warranty {background-image: url("../pdf/promo/thm/UDO-Limited-Lifetime-Warranty.jpg")}
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	
	/*
submit testimonials
*/
	
	
	.mug-girl {width:340px;
	height:250px;
	background-image: url("../images/mug-girl.jpg");
	margin-top: 30px;
	margin-bottom: 30px;}
	
	
	
	
	
	
	
/*
Become a dealer
*/
	
	
	
	.dealers-profit {width:340px;
	height:480px;
}
	
	.dealers-profit-image {width: 340px;
	height:260px;
	background-image: url("../images/profit-graphic.jpg");
	background-repeat: no-repeat;
	background-position: center;}

	.dealers-profit-text {width:340px;
	height:200px;}
	
	.dealers-profit-text ul {font-family: alegreya, serif;
font-weight: 600;
font-style: normal;
font-size: 24px;
color:#bf1e2e;}
	
	
	
		.dealers-marketing {width:340px;
	height:auto;}
	
	.dealers-marketing-image {width: 340px;
	height:200px;
	background-image:url("../images/marketing-materials.jpg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 340px;;}

	.dealers-marketing-text {width:340px;
	height:auto;}
	
	.dealers-marketing-text ul {font-family: alegreya, serif;
font-weight: 600;
font-style: normal;
font-size: 20px;
color:#bf1e2e;}
	
	
	.training-image {width:340px;
	height:200px;
	background-image: url("../images/underdeck-installer.jpg");
	background-repeat: no-repeat;}
	
	.dealers-signmeup {width:340px;
	height:300px;
	background-image: url("../images/contractor-thumbs.png");
	background-size: 340px;
	margin: auto;}
	
	
	/*
Choosing a color
*/
	
	
	
	.choosing-white1 {background-image: url("../images/choosing-color/white1.jpg")}
	
	.choosing-white2 {background-image: url("../images/choosing-color/white2.jpg")}
	
	.choosing-pewter {background-image: url("../images/choosing-color/pewter.jpg")}
	
	.choosing-teak {background-image: url("../images/choosing-color/teak2.jpg")}
	
	.choosing-clay {background-image: url("../images/choosing-color/clay1.jpg")}
	
	.choosing-florida1 {background-image: url("../images/choosing-color/florida1.jpg")}
	
	.choosing-florida2 {background-image: url("../images/choosing-color/florida2.jpg")}
	
	
	
		
/*
What is is
*/
	
	
.what-list {font-family: effra, sans-serif;
font-size: 16px;
font-style: normal;
color:#606060;}	
	
	
	.what-is-it-photos {width:340px;
	height:250px;
	background-size: cover;
	background-position: center;
	margin-bottom: 20px;}
	
	
	.what1 {background-image:url("../images/what-is-it/what1.jpg")}
	
	.what2 {background-image:url("../images/what-is-it/what2.jpg")}
	
	.what3 {background-image:url("../images/what-is-it/what3.jpg")}
	
	.what4 {background-image:url("../images/what-is-it/what4.jpg")}
	
	.what5 {background-image:url("../images/what-is-it/what5.jpg")}
	
	.gas-station {background-image:url("../images/what-is-it/gas-station-ceiling.jpg")}
	
	
	
	
/*
Tools needed 
*/
	
	
	.tools-installer {background-image:url("../images/tools-install.jpg")}
	
	
	
	/*
Testimonials 
*/
	
	
	
	
	.testimonial-wrapper {width:330px;
	height:640px;
	background-color: #4a4a4a;
	border-radius: 15px;
	border-bottom-left-radius: 15px;
	border-bottom-right-radius: 15px;
	float: left;
	margin-left: 10px;
	margin-bottom: 10px;}
	

	.testimonials-photos {width:330px;
	height:250px;
	background-size: cover;
	background-position: top;
	margin-bottom: 10px;
	border-top-left-radius: 15px;
	border-top-right-radius: 15px;
		background-repeat: no-repeat;}
	
	
	
	.testimonials-photos img {
            width: 100%;
            transition: 0.5s all ease-in-out;
        }
	
	
	.testimonials-photos:hover {
		transform: scale(1.5);
		background-position: contain;}
	
	
	
	.testimonials-stars {width: 320px;
	height: 30px;
	background-image: url("../images/5-stars.png");
	background-size:contain;
	background-repeat: no-repeat;
	float:right;}
	
	
	.testimonials-caption {width:340px;
	height:auto;
	font-family: effra, sans-serif;
	font-style: normal;
	font-size: 18px;
	line-height:120%;
	color:white;
	float:left;
	padding:20px;
		box-sizing: border-box;
	}
	
	
	
	
	
	
	.debruyn {background-image:url("../images/testimonials/deburn-VA.jpg") }
	
	.bucherie {background-image:url("../images/testimonials/Bucherie-NC.jpg") }
	
	.Mackle {background-image:url("../images/testimonials/Mackle-CA.jpg") }
	
	.schorzmann {background-image:url("../images/testimonials/Schorzmann-MN.jpg") }
	
	.joure {background-image:url("../images/testimonials/Joure-MI.jpg") }
	
	.picart {background-image:url("../images/testimonials/Picart-NC.jpg") }
	
	.buckley {background-image:url("../images/testimonials/Buckley-MI.jpg") }
	
	.jenkins {background-image:url("../images/testimonials/Jenkins-MD.jpg") }
	
	.lovely {background-image:url("../images/testimonials/Lovely-MA.jpg") }
	
	.berg {background-image:url("../images/testimonials/Berg-MD.jpg") }
	
	.wejrowski {background-image:url("../images/testimonials/Werjoski-MI.jpg") }
	
	.barger {background-image:url("../images/testimonials/Barger-NC.jpg") }
	
	.strubois {background-image:url("../images/testimonials/Sturbois-OH.jpg") }
	
	.myers {background-image:url("../images/testimonials/Myers-WI.jpg") }
	
	.weiss{background-image:url("../images/testimonials/Weiss-VA.jpg") }
	
	.izzle {background-image:url("../images/testimonials/Izze.jpg") }
	
	.oniell {background-image:url("../images/testimonials/Oneill-MI.jpg") }
	
	.waugh {background-image:url("../images/testimonials/Waugh-IN.jpg") }
	
	.thorburn {background-image:url("../images/testimonials/Thorburn-FL.jpg") }
	
	.meltzer {background-image:url("../images/testimonials/Meltzer.jpg") }
	
	.westerman {background-image:url("../images/testimonials/Westerman-mi.jpg") }
	
	.lepenski {background-image:url("../images/testimonials/Lepanski-MN.jpg") }
	
	.prestopine {background-image:url("../images/testimonials/Prestopine1.jpg") }
	
	.salb {background-image:url("../images/testimonials/salb.jpg") }
	
	.mulloy {background-image:url(../images/testimonials/mulloy1.jpg); }
	
	.kollet {background-image:url(../images/testimonials/kollet1.jpg); }
	
	.mclean {background-image:url(../images/testimonials/mclean1.jpg); }
	
	.christensson {background-image:url(../images/testimonials/christensson1.jpg); }
	
	.everest {background-image:url(../images/testimonials/everest1.jpg);}
	
	.dunleavy {background-image:url(../images/testimonials/dunleavy1.jpg);}
	
	.manley {background-image:url(../images/testimonials/manley1.jpg); }
	
	.jerrym {background-image:url(../images/testimonials/jerryM.jpg); }
	
	.suk {background-image:url(../images/testimonials/suk1.jpg); }
	
	.chrisb {background-image:url(../images/testimonials/chrisb1.jpg); }
	
	.danR {background-image:url(../images/testimonials/danR1.jpg); }
	
	.brenden {background-image:url(../images/testimonials/brenden1.jpg); }
	
	.johns {background-image:url(../images/testimonials/johnS.jpg); }
	
	.messman {background-image:url(../images/testimonials/messman1.jpg); }
	
	.rosiland {background-image:url(../images/testimonials/rosiland.png); }
	
	.sullivan {background-image:url(../images/testimonials/sullivan2.jpg); }
	
	.puccetti {background-image:url(../images/testimonials/puccetti.jpg); }
	
	.dupree {background-image:url(../images/testimonials/dupree.jpg); }
	
	.alderson {background-image:url(../images/testimonials/alderson1.jpg); }
	
	.terry {background-image:url(../images/testimonials/terry1.jpg); }
	
	.farmer {background-image: url(../images/testimonials/farmer.jpg); }
	
	.herdere {background-image: url(../images/testimonials/herdere.jpg); }	
	
	.laquatra {background-image:url(../images/testimonials/laquatra2.jpg); }
	
	.tiberio {background-image:url(../images/testimonials/tiberio1.jpg); }
	
	.prestopine {background-image:url(../images/testimonials/Prestopine1.jpg); }
	
	.fritz {background-image:url(../images/testimonials/fritz1.jpg); }
	
	.wittig {background-image:url(../images/testimonials/wittig1.jpg); }	
	
	.oneill {background-image:url(../images/testimonials/kevin-oneill1.jpg); }	
	
	.jenovai {background-image:url(../images/testimonials/jenovai1.jpg); }	
	
	
	
	
/*
Warranty
*/
	
	
	.warranty-seals {width:200px;
	height:200px;
	background-size: cover;
	background-repeat: no-repeat;}
	
	
	.warranty-seal-material {background-image: url("../images/Warranty-Material-Seal.jpg")}
	
	.warranty-seal-install {background-image: url("../images/Warranty-Installation-Seal.jpg")}
	
	
	
	
	
/*
Service Area
*/
	
	
	
	.service-area-banner {width:100%;
	height:200px;
	background-image: url("../images/nationwide-graphic.jpg");
	background-repeat: no-repeat;
	background-size:100%;}
	
	 
	
	
	/*
Maintenance
*/
	
	
	
	.maintenance-photos {width:340px;
	height:340px;
	background-size: cover;
	background-position: center;}
	
	
	
	.maintenance-clogging {background-image: url("../images/maintenance/clogging.jpg")}
	
	
	.maintenance-prevention {background-image: url("../images/maintenance/drain-guard.jpg")}
	
	
	.maintenance-cleaning {background-image: url("../images/maintenance/cleaning.jpg")}
	
	
	.maintenance-powerwashing {background-image: url("../images/maintenance/power-washing.jpg")}
	
	
	.maintenance-staining {background-image: url("../images/maintenance/staining.jpg")}
	
	
	.maintenance-mold {background-image: url("../images/maintenance/mold.jpg")}
	
	
	
	
/*
Color Matching System
*/
	
	
	
	.system-matching-wrapper {width:340px;
	height:100%;}
	

	.system-matching-udo {width:40%;
	background-color:#D7D7D7;
	margin-bottom: 5px;
	float:left;
	padding:5px;
	box-sizing: border-box;
	font-family: effra, sans-serif;
	}
	
	
	.system-matching-paint {width:59%;
	background-color:#BABABA;
	float:right;
	padding:5px;
	box-sizing: border-box;
	font-family: effra, sans-serif;}
	
	
	.color-match-logo {width:125px;
	height:65px;}
	
	
	.behr {background-image: url("../images/behr-logo.png")}
	
	.sherwin-williams {background-image: url("../images/sherwin-williams-logo.png")}
	
	.benjamin-moore {background-image: url("../images/benjamin-moore-logo.png")}
	
	
	
	
	
	
	/*
Color Visualizer
*/
		
	
	.visualizer-container {height:1400px;}
	
	
	
	
	
	/*
Colors
*/
	
		.colors-header {width:100%;
	height:100px;
	background-image:url("../images/color-options-solid.jpg");
	background-size: cover;}
	
	
	
	.color-swatch-wrapper {width:340px;
	height:170px;
	font-family: effra, sans-serif;
font-style: normal;
font-size: 20px;
color:#606060;
	margin-bottom: 20px;}
	
	.color-swatch {width: 340px;
	height:130px;
	margin-bottom: 5px;}
	
	
	.rustic-comparison {width:340px;
	height:225px;
	background-image: url("../images/color-swatches/smooth-vs-rustic.jpg");
	background-size: 100%;}
	
	
	.rustic-photo {width:340px;
	height:200px;
	background-image: url("../images/color-swatches/texture-close-up.jpg");
	background-size: 100%;}
	
	.brown{background-image: url("../images/color-swatches/solid/brown.jpg")}
	
	
	.pewter{background-image: url("../images/color-swatches/solid/pewter.jpg")}
	
	.champagne{background-image: url("../images/color-swatches/solid/champagne.jpg")}
	
	.clay{background-image: url("../images/color-swatches/solid/clay.jpg")}
	
	
	.white{background-color: white;
		border: 1px solid black;}
	
	
	.sandy-beige{background-image: url("../images/color-swatches/solid/sandybeige.jpg")}
	
	
	.black{background-image: url("../images/color-swatches/solid/black.jpg")}
	
	.haint-blue{background-image: url("../images/color-swatches/solid/haint-blue.jpg")}
	
		.light-cherry{background-image:url("../images/color-swatches/solid/cherry.jpg")}
	
		.karri{background-image: url("../images/color-swatches/solid/karri.jpg")}
	
		.mahogany{background-image: url("../images/color-swatches/solid/mahogany.jpg")}
	
	.teak{background-image: url("../images/color-swatches/solid/teak.jpg")}
	
	
	.maple{background-image: url("../images/color-swatches/solid/rockmaple.jpg")}
	
	
	
	
	
	.brown-rustic{background-image:url("../images/color-swatches/rustic/brown-rustic.jpg")}
	
	.pewter-rustic{background-image:url("../images/color-swatches/rustic/pewter-rustic.jpg")}
	
	.champagne-rustic{background-image:url("../images/color-swatches/rustic/champagne-rustic.jpg")}
	
	.clay-rustic{background-image:url("../images/color-swatches/rustic/clay-rustic.jpg")}
	
    .white-rustic{background-image:url("../images/color-swatches/rustic/white-rustic.jpg")}
	
	.sandybeige-rustic{background-image:url("../images/color-swatches/rustic/sandybeige-rustic.jpg")}
	
	.black-rustic{background-image:url("../images/color-swatches/rustic/black-rustic.jpg")}
	
	.haintblue-rustic{background-image:url("../images/color-swatches/rustic/haintblue-rustic.jpg")}
	
	
	.light-cherry-rustic {background-image:url("../images/color-swatches/rustic/cherry-rustic.jpg")}
	
	.karri-rustic {background-image:url("../images/color-swatches/rustic/karri-rustic.jpg")}
	
	.mahogany-rustic {background-image:url("../images/color-swatches/rustic/mahogany-rustic.jpg")}
	
	.teak-rustic {background-image:url("../images/color-swatches/rustic/teak-rustic.jpg")}
	
	.maple-rustic {background-image:url("../images/color-swatches/rustic/rockmaple-rustic.jpg")}
	
	
	
	
	
	
	
/*
Before and After Gallery
*/
	
	
	.slider-container {margin-bottom: 20px; }
	
	
	
	
	
	
	
		/*
Quote my Deck 
*/
	
	
	
	.photo-examples {width:100%;
	height:330px;
		background-image: url("../images/example-photos2024.jpg");
		background-size:100%;	
	background-repeat: no-repeat;}
	
	
		
	.sketch-examples {width:100%;
	height:130px;
		background-image:url("../images/example-sketches.jpg");
		background-size:100%;	
	background-repeat: no-repeat;}
	
	
	
	
	/*
how it works 
*/
	
	
	.howitworks-graphic {background-image: url("../images/pages/how-it-works-graphic.jpg");
	background-position: center;}
	
	
	.eightwest {width:100%;
	height:200px;
	margin-bottom: 50px;}
	
	.clearance {width:100%;
	height:200px;
	background-image:url("../images/pages/drop.jpg");
	background-size: cover;}
	
	
/*
FAQ 
*/
	
	.faq1{background-image:url("../images/pages/faq-oilcanning.jpg")}
	
		.faq2{background-image:url("../images/pages/faq-twisted-beam.jpg")}
	
		.faq3{background-image:url("../images/pages/faq-twisted-post.jpg")}
	
	
	
	
	
	
	
	/*
Electrical
*/
	
	.electrical-photo {width:100%;
	height:250px;
	background-position: center;
	background-size: cover;}
	
	.electrical1{background-image:url("../images/pages/electrical1.jpg")}
	
	.electrical2{background-image:url("../images/pages/electrical2.jpg")}
	
	.electrical3{background-image:url("../images/pages/electrical3.jpg")}
	
	.electrical4{background-image:url("../images/pages/electrical4.jpg")}
	
	
	.electrical-video {width:100%;
	height:200px;
	margin-bottom: 50px;}
	
	
/*
Compare to Vinyl
*/
	
	.compare-to-vinyl-sagging {background-image: url("../images/pages/vinyl-sagging.jpg")}
	
	.compare-to-vinyl-leaking {background-image: url("../images/pages/vinyl-leaking.jpg")}
	
	.compare-to-vinyl-aluminum {background-image: url("../images/pages/vinyl-aluminum.jpg")}
	
	.compare-to-vinyl-melted {background-image: url("../images/pages/vinyl-melted.jpg")}
	
	.bad-steel1 {background-image: url("../images/pages/bad-steel1.jpg")}
	
	.bad-steel2 {background-image: url("../images/pages/bad-steel2.jpg")}
	
	.bad-steel3 {background-image: url("../images/pages/bad-steel3.jpg")}
	
	.wire-mesh {background-image: url("../images/pages/wire-mesh.jpg")}
	
	
	
	.compare-chart-container {width:100%;
	height:auto;
	margin-bottom: 30px;}
	
	.compare-chart-headline {width:50%;
	height: 20px;
	font-family: effra, sans-serif;
	color:red;}
	
	.compare-chart-wrapper {width:50%;
	height:40px;}
	
	.compare-chart-icon {width:30px;
	height:40px;
	float:left;}
	
	.compare-chart-text {width:170px;
	height:30px;
	font-family: effra, sans-serif;
	padding-top: 10px;}
	
	
	
	
.green-check {background-image: url(../images/green_check.jpg);
background-position:center;
background-repeat:no-repeat; }

.red-x {background-image:url(../images/red_x.jpg); 
background-position:center;
background-repeat:no-repeat; }
	
	
	
	/*
Ideas For Usage
*/
	
	
	.ideas1 {background-image: url("../images/pages/ideas1.jpg")}
	
	.grill1 {background-image: url("../images/pages/ideas-grill-1.jpg")}
	
	.grill2 {background-image: url("../images/pages/ideas-grill-2.jpg")}
	
	.grill3 {background-image: url("../images/pages/ideas-grill-3.jpg")}
	
	
	
	.tv1 {background-image: url("../images/pages/ideas-tv-1.jpg")}
	
    .tv2 {background-image: url("../images/pages/ideas-tv-2.jpg")}
	
	.tv3 {background-image: url("../images/pages/ideas-tv-3.jpg")}
	
	
	.hottub1 {background-image: url("../images/pages/ideas-hottub-1.jpg")}
	
    .hottub2 {background-image: url("../images/pages/ideas-hottub-2.jpg")}
	
	.hottub3 {background-image: url("../images/pages/ideas-hottub-3.jpg")}
	
	
	.storage1 {background-image: url("../images/pages/ideas-storage-1.jpg")}
	
    .storage2 {background-image: url("../images/pages/ideas-storage-2.jpg")}
	
	.storage3 {background-image: url("../images/pages/ideas-storage-3.jpg")}
	
	
	.entertain1 {background-image: url("../images/pages/ideas-entertain-1.jpg")}
	
    .entertain2 {background-image: url("../images/pages/ideas-entertain-2.jpg")}
	
	.entertain3 {background-image: url("../images/pages/ideas-entertain-3.jpg")}
	
	
	
/*
Accessories
*/
	
	
	.lights-fans {width:340px;
	height: 255px;
	margin-top: 20px;
	float:left;
	background-image:url("../images/pages/light-fan.jpg");
	background-size:340px;}
	
	
	.lights-fans-text {width:340px;
	height:auto;
	float:right;
	margin-top: 20px;}
	
	.nighttime-headline {
   font-family: effra, sans-serif;
   font-weight: 900;
    font-style: normal;
    font-size: 32px;
    color:#bf1e2e;
    line-height: 150%;
    text-shadow: 1px 1px 1px #000000;
    letter-spacing: .10em;
		text-align: center;
		margin-bottom: 35px;
}

	
	.accessories1  {background-image: url("../images/pages/accessories1.jpg");}
	
		.accessories2  {background-image: url("../images/pages/accessories2.jpg");}
	
		.accessories3  {background-image: url("../images/pages/accessories3.jpg");}
	
	.accessories4  {background-image: url("../images/pages/accessories4.jpg");}
	
	.accessories5  {background-image: url("../images/pages/accessories5.jpg");}
	
	.accessories6  {background-image: url("../images/pages/accessories6.jpg");}
	
	.accessories-heaters  {background-image: url("../images/pages/accessories-heater.jpg");
	background-size: cover;
	background-position: center;}
	
	.accessories-pullup  {background-image: url("../images/pages/accessories-pullup.jpg");
	background-size: cover;
	background-position: center;}
	
	.accessories-camera  {background-image: url("../images/pages/accessories-camera.jpg");
	background-size: cover;
	background-position: center;}
	
	.accessories-curtains  {background-image: url("../images/pages/accessories-curtains.jpg");
	background-size: cover;
	background-position: center;}
	
	.accessories-hooks  {background-image: url("../images/pages/accessories-hooks.jpg");
	background-size: cover;
	background-position: center;}
	
	
	
	
/**************************
additional resources
**************************/	

.resources-wrapper {width: 350px;
height: auto; 
margin-bottom: 20px;
float:left;}

.resources-icons {width: 150px;
height: 100px; 
margin-right:10px;
float: none; 
border: solid 1px black;
box-sizing:border-box;}

.resources-headline {font-family:alegreya;
font-size:20px;
padding-bottom:20px; }

.resources-description {width: 300px;
float: none; 
height: auto;
margin-bottom:10px;
font-family:alegreya;}

.americanrainware {background-image:url(../images/americanrainware-logo.jpg); 
background-size: 150px; }

.gutterhood {background-image:url(../images/gutter-hood-logo.jpg); 
background-size: 150px; }

.drainguard {background-image:url(../images/drain-guard-logo.jpg); 
background-size: 150px; }

.guttergraphics {background-image:url(../images/gutter-graphics.jpg); 
background-size: 150px; }
	

	.ags-logo {background-image:url(../images/AGS-logo.jpg); 
background-size: 150px; }
	
	
	.UDOomaha-logo { background-image:url(../images/UDO-omaha.jpg);
	background-size: 150px; }
	
	.UDO-TN { background-image:url(../images/UDO-of-TN.jpg);
background-size: 150px; }
	
	.UDO-NW { background-image:url(../images/NWUDO-logo.jpg);
background-size: 150px; }

	
	
.h2o-designs { background-image:url("../images/h2o-logo.png");
	background-size: 100px; 
	background-repeat: no-repeat;
	background-position: center;}
	
	
	.aics { background-image:url("../images/aics-logo.png");
	background-size: 100px; 
	background-repeat: no-repeat;
	background-position: center;}
	
	
	.udo-co {background-image:url("../images/udo-of-co-logo.jpg");
	background-size: 100%; 
	background-repeat: no-repeat;
	background-position: center;}
	
	
	
		
/**************************
Contact Us
**************************/	
	
	.map-block{width:340px;
		height:450px;
	}
	
	
	.google-review-icon {width:300px;
	height:150px;
	background-image: url("../images/Google-Review-Icon.jpg");
	margin-bottom: 30px;
		margin-right: 50px;
	float:left;}
	
	.facebook-review-icon {width:300px;
	height:150px;
	background-image: url("../images/Facebook-Review-Icon.jpg");
	margin-bottom: 30px;
	float:left;}
	
	
	.contact-coffee-mugs {width:338px;
	height:200px;
		background-image: url("../images/coffee-mugs.jpg");
		background-size: cover;
		background-position: center;
		border: 1px gray solid;
	}
	
	
/*
HOME PAGE
*/
	
	
	.page-wrapper {width:100%;
	height:auto;
	margin: auto;}

	
	.overview-wrapper {width:100%;
	height:auto;margin-bottom: 20px;}
	
	
	.overview {width:340px;;
	height:auto;
	margin: auto;
	padding-top: 35px; }
	
	
	
	.overview-text {width:100%;
	height:auto;
	float:left;
	margin-left: 0px;
	margin-top: 20px;
	font-family: effra, sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 18px;
	line-height:200%;
	color:#606060;
	margin-bottom: 30px;
	}
	
	
	.overview-video {width:100%;
	height:300px;
		background-image: url("../images/under-deck-oasis-photo.jpg");
		background-size: cover;
		background-position: center;
	float:left;
	border: solid 1px black;
	box-sizing: border-box;}
	
	
	
	
	.ideas-for-usage-wrapper {width:100%;
	height:auto;
	margin-bottom: 35px;
	margin-top: 70px;}
	
	
	.ideas-for-usage {width:340px;
	height:auto;
	margin: auto;}
	
	
	.ideas-for-usage-icon-wrapper {width:48%;
	height:150px;
	margin-bottom: 10px;
	border: 1px solid black;
	box-sizing: border-box;}
	
	.ideas-for-usage-icon {width:100%;
	height:120px;}
	
	.ideas-for-usage-icon-caption {width:100%;
	height:28px;
	background-color:antiquewhite;
	padding-left: 5px;
	box-sizing: border-box;
	font-family: effra, sans-serif;}
	
	
	.dry-patio {background-image: url("../images/usage-icones/relax.jpg");
	background-position: center;
	background-size: cover;}
	
	
	.hottub {background-image: url("../images/usage-icones/hottub.jpg");
	background-position: center;
	background-size: cover;}
	
	.bar {background-image: url("../images/usage-icones/bar.jpg");
	background-position: center;
	background-size: cover;}
	
	.kitchen {background-image: url("../images/usage-icones/kitchen.jpg");
	background-position: center;
	background-size: cover;}
	
	.theater {background-image: url("../images/usage-icones/theater.jpg");
	background-position: center;
	background-size: cover;}
	
	.storage {background-image: url("../images/usage-icones/storage.jpg");
	background-position: center;
	background-size: cover;}
	
	.three-seasons {background-image: url("../images/usage-icones/three-seasons.jpg");
	background-position: center;
	background-size: cover;}
	
	.garden {background-image: url("../images/usage-icones/garden.jpg");
	background-position: center;
	background-size: cover;}
	
	
	.features-wrapper {width:100%;
	height:auto;
	padding-bottom: 50px;
	background-image: linear-gradient(#975126, #501c1d);}
	
	
	.getting-started-wrapper {width:100%;
	height:auto;
	background-image: url("../images/deck-background.jpg");
	background-size: cover;}


	
	.testimonials-wrapper {width:100%;
	height:auto;
		background-image: url("../images/testimonials-bg.jpg");
		background-position: right;
		background-repeat: no-repeat;
		background-size: 1500px;}
	
	.badges-wrapper {width:100%;
	height:auto;}
	
	
	.features {width:340px;
	height:auto;
	margin: auto;
    padding-top: 35px;
	}
	
	
	.features-list-block
	
	{float:none;
	font-family: alegreya, serif;
	color:white;
	width:auto;
	font-size: 20px;
	margin-right: 0px;
		
	}
	
	
	.features-list-block ul {
list-style-image: url("../images/green-check-box.png");
}
	
	


	
	.color-options-wrapper {width:100%;
	height:auto;
	margin-bottom: 50px;}
	
	
	.color-options {width:340px;
	height:auto;
	margin: auto;
	background-image:none;
	background-size: 80%;
	background-repeat: no-repeat;
	background-position: bottom right;
	padding-top: 50px;}
	
	
	.color-option-text {width:100%;
	margin-bottom: 25px;}
	
	.color-option-text-images {width:100%;
	margin-bottom: 25px;}
	
	.color-options-solid {width:95%;
	height:200px;
	background-image: url("../images/color-options-solid.jpg");
	background-size: cover;
	background-position: center;
	border: 1px black solid;
	box-sizing: border-box;}
	
	.color-options-woodgrain {width:95%;
	height:200px;
	background-image: url("../images/color-options-woodgrain.jpg");
	background-size: cover;
	background-position: center;
	border: 1px black solid;
	box-sizing: border-box;}
	
	.color-options-finishes {width:95%;
	height:200px;
	background-image: url("../images/color-options-rustic.jpg");
	background-size: cover;
	background-position: center;
	border: 1px black solid;
	box-sizing: border-box;}
	
	
	
	.getting-started {width:340px;
	height:auto;
	margin: auto;}
	
	
	.getting-started-left-block {width:100%;
	height:auto;
	margin-top: 20px;
	float:left;}
	
	.getting-started-right-block {width:100%;
	height:100%;
	margin-top: 20px;
	margin-bottom: 40px;
	float:right;
	color:white;
	font-family: effra, sans-serif;
    font-weight: 400;
    font-style: normal;
	font-size: 18px;
	line-height:160%;}
	
	.getting-started-video {width:340px;
	height:200px;
	margin-top: 30px;}
	
	
	.getting-started-steps {width:100%;
	height:75px;
	background-color: rgba(51, 170, 51, .2)    /*  40% opaque green */ ;
	color:white;
	font-family: effra, sans-serif;
    font-weight: 400;
    font-style: normal;
	font-size: 17px;
	line-height:140%;
	margin-top: 10px;
	padding-right: 10px;
	box-sizing: border-box;}
	
	.getting-started-steps-icon {width:75px;
	height:75px;
	margin-right: 20px;
	float:left;}
	
	.getting-started-quote-button {width:250px;
	height:60px;
	background-color: #b96431;
	float:left;
	text-align: center;
	color:white;
	font-family: effra, sans-serif;
    font-weight: 700;
	font-size: 20px;
	line-height: 60px;
	margin-top: 20px;
	border: solid 1px #ffffff;}
	
	.getting-started-quote-button:hover {background-color:#975126;
	 /* Firefox */
    -moz-transition: all .25s ease-in;
    /* WebKit */
    -webkit-transition: all .25s ease-in;
    /* Opera */
    -o-transition: all .25s ease-in;
    /* Standard */
    transition: all .25s ease-in;}
	
	.getting-started-icon-submit {background-image: url("../images/submit-icon.jpg");
	background-size: 75px;}
	
	.getting-started-icon-schedule {background-image: url("../images/schedule-icon.jpg");
	background-size: 75px;}
	
	.getting-started-icon-install {background-image: url("../images/install-icon.jpg");
	background-size: 75px;}
	
	.getting-started-icon-enjoy {background-image: url("../images/enjoy-icon.jpg");
	background-size: 75px;}
	
	
	
	
	
	.installation-process-wrapper {width:100%;
	height:auto;
	background-image: url("../images/page-bg.jpg");
	background-size: cover}
	

	.installation-process {width:340px;
	height: auto;
	margin: auto;
	padding-top: 60px;
	padding-bottom: 60px;}
	
	
	.installation-process-graphic {
		width:340px;;
		height:125px;
		background-image: url("../images/nationwide-graphic.jpg");
		background-size: 340px;	
		border: 1px black solid;
		box-sizing: border-box;
	}
	

	.installation-process-video {width:340px;
	height:200px;
	margin-top: 20px;}
	
	
	
	
	.before-and-after-wrapper {width:100%;
	height:auto;
	background-image: url("../images/deck-background.jpg");
	background-size: cover;
	padding-bottom: 50px;
	}
	
	
	.before-and-after {width:340px;
	height:auto;
	margin: auto;
	text-align: center;
	padding-top: 20px;}
	
	.before-and-after a:link {text-decoration: none;}
	
	.before-and-after a:hover {text-decoration: underline;}
	
	.before-and-after a:active {text-decoration: none;}
	
	.before-and-after a:visited {text-decoration: none;}
	
	
	.slider-wrapper {margin-top: 30px;}
	
	
	.testimonials {width:340px;
	height:1100px;
	margin: auto;}
	
	.testimonials-container {width:320px;
	height:900px;
	margin-top: 100px;
	float:left;
	box-shadow: 0px 0px 15px 0px #000000;
	background-color: #dedede;}
	
	.testimonials-text {width:100%;
	height:700px;
	padding:20px;
	box-sizing: border-box;}
	
	.testimonials-video {width:100%;
	height:200px;
	background-image: url("../images/testimonial-homepage.jpg");
	background-size: cover;
	background-position: center;}
	
	.testimonials-more {width:250px;
	height:60px;
	background-color: white;
	float:left;
	margin-right: 20px;
	border: solid 1px #b96431;
	box-sizing: border-box;
	text-align: center;
	color:#606060;
	font-family: effra, sans-serif;
    font-weight: 700;
	font-size: 20px;
	line-height: 60px;}
	
	.testimonials-more:hover {background-color: #b96431;
		color:white;
		 /* Firefox */
    -moz-transition: all .25s ease-in;
    /* WebKit */
    -webkit-transition: all .25s ease-in;
    /* Opera */
    -o-transition: all .25s ease-in;
    /* Standard */
    transition: all .25s ease-in;}
	
	
	.testimonials-submit {width:250px;
	height:60px;
	background-color: #b96431;
	float:left;
	text-align: center;
	color:white;
	font-family: effra, sans-serif;
    font-weight: 700;
	font-size: 20px;
	line-height: 60px;}
	
	.testimonials-submit:hover {background-color:#975126;
	 /* Firefox */
    -moz-transition: all .25s ease-in;
    /* WebKit */
    -webkit-transition: all .25s ease-in;
    /* Opera */
    -o-transition: all .25s ease-in;
    /* Standard */
    transition: all .25s ease-in;}
	
	
	.badges {width:360px;
	height:auto;
	margin: auto;
	padding-top: 20px;
	padding-bottom: 20px;}
	
	
	
	
	.measuring {width:340px;}
	
	
	
/*
Neighbor Discount
*/
	
	
	.neighbor-discount-banner {width:340px;
	height:215px;
		background-image:url("../referral/images/happy-neighbors.jpg");
		background-size: 340px;
	}
	
	
	
/*
Jenison Campaign
*/
	
	
	.jenison-page-header {background-image: url("../images/jenison-page-header.jpg")}
	
	
	
	
	
	
	
}