<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">.maincontent{
    max-width:100%;
    margin:0;
    padding:0;
}

html, body{
    padding:0;
    margin:0;
    box-sizing:border-box;
   
}
h1 {
    font-family: 'Noto Sans JP', sans-serif;
   
    margin:0;
}

h2 {
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 1.2px;
    
    margin:0;
    padding:0;
    line-height:48px;
}
h3 {
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 1.2px;
   
    font-weight:400;
    margin:0;
    padding:0;
}
h4,
h5 {
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 1.2px;
}

p {
    font-family: 'Noto Sans JP', sans-serif;
    font-weight:100;
}
.heavy{
    font-weight:900;
}
.thin{
    font-weight:100;
}
img{
    width:100%;
}
.myButton {
	box-shadow: 3px 4px 0px 0px #1564ad;
	background:linear-gradient(to bottom, #79bbff 5%, #378de5 100%);
	background-color:#79bbff;
	border-radius:5px;
	border:1px solid #337bc4;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:Arial;
	font-size:17px;
	font-weight:bold;
	padding:12px 44px;
	text-decoration:none;
  transition:.3s;
}
.col-lg-7{
    margin:0;
    padding:0;
    flex:0 0 57%;
    width:57%;
}
.row{
    margin-right:0;
    margin-left:0;
}
.myButton:hover {
	background-color:#378de5;
    color:#000;
    transform:scale(.98);
    transition:.3s;
}
.myButton:active {
	position:relative;
	top:1px;
}

.hero{
    position: relative;
    max-height:90vh;
    overflow:hidden;
}
.hero-img{
    position: relative;
    max-width:2200px;
    object-fit:cover;
  
}
.hero-h1{
    position: absolute;
    bottom:30%;
    left:15%;
    color:#fff;
    /* overflow-x:hidden;     */
}
#hero-h1{
    position: relative;
    color:#fff;
    /* overflow-x:hidden;     */
}
#hero-h3{
    position: relative;
    color:#fff;
    /* overflow-x:hidden;     */
}
.hero-logo{
    position: absolute;
    top:5%;
    left:5%;
    max-width:clamp(50px, 8vw, 8vw);;
}
.header-main{
    background:#ededed;
    padding:5% 20vw;
}
.header-container{
    position: relative;
}
.header-container::before{
    content:"";
    position: absolute;
    z-index:2;
    top:0;
    left:-15px;
    height:100%;
    width:2px;
    background:#000;
}
.section1{
  position: relative;
}
#tline-content{
    padding:10%5%;
}

.section1-content{
  padding:50% 8% 0;
}

.section2{
    background:#ededed;
    padding-bottom:5%;
}
#product-header{
    text-align:center;
    padding:5% 0;
}
 .boxes{
    max-width:90%;
    display:grid;
    grid-gap: 20px;
    grid-template-columns:repeat(auto-fit, minmax(275px, 1fr));
    justify-content:center;
    margin:0 auto;
}
.box p{
    font-weight:900;
    margin-top:10px;
    background:#fff;
    margin:0;
    padding:10px 0;
}
.box a{
    text-decoration: none;
}
.box img{
    max-width:250px;
    transition:.5s;
}
.box1{
    background-image:url('/imageserver/Reusable/GAF/canada21/house-lrg.jpeg');
    background-repeat: no-repeat;
    background-size: cover;
}
.box:hover.box img{
    opacity:0;
    transition:.5s;
}
.boxes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
  
  .box {
    text-align: center;
    flex: 250px 0 1;
    color: #000;
    border:2px solid #000;
  }
  .expandable-section {
	background-image:linear-gradient(to bottom, rgba(74,74,74,0.3) 0%, rgba(74,74,74,0.3)100% ), url("/imageserver/Reusable/GAF/canada21/timberline-scroll-min.jpg");
	background-position: center center;
	background-repeat: no-repeat; 
    -webkit-background-size: cover;
    background-size: cover;
    max-width:1000px;
    
    
}
.expandable-section .panel {
	background-color: transparent;
}
.expandable-section .panel-group {
	margin-bottom: 0;
	padding: 65px 0;
}
.expandable-section .panel-group .panel{
	border-radius: 0;
	margin-bottom: 0;
	padding: 0;
	box-shadow: none;
	border: none;
}
.expandable-section  .panel-default &gt; .panel-heading {
	background-color: transparent;
	padding: 0;
	border-radius: 0;
}
.expandable-section .panel-title  a {
	position: relative;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight: 700;
	font-size:2.2rem;
	font-style: italic;
	color: #fff;
	display: inline-block;
	text-decoration: none;
	width: 100%;
}
.panel-subtitle{
    color:#fff;

}


.expandable-section .panel-group .panel-heading + .panel-collapse &gt; .panel-body {
	padding-left: 0;
	color: #fff;
    font-weight:900;
	font-family: 'Open Sans', sans-serif;
	padding-top: 65px;
}
.panel-body p{
    color: #fff;
    font-weight:400;
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 24.98px;
}
.panel-subtitle{
    font-family: 'Noto Sans JP', sans-serif;
    letter-spacing: 1.2px;
    font-size:1.2rem;
    font-weight:400;
}
.expandable-section .panel-group .panel-heading + .panel-collapse &gt; .list-group,
.expandable-section .panel-group .panel-heading + .panel-collapse &gt; .panel-body {
	border-top: none;
}
.expandable-section-1 {
	background-image:linear-gradient(to bottom, rgba(74,74,74,0.3) 0%, rgba(74,74,74,0.3)100% ), url("/imageserver/Reusable/GAF/canada21/designer-scroll.jpg");
}
.expandable-section-2 {
	background-image:linear-gradient(to bottom, rgba(74,74,74,0.3) 0%, rgba(74,74,74,0.3)100% ), url("/imageserver/Reusable/GAF/canada21/3tab-scroll.jpg");
}

.section3{
    padding:3% 10%;
    
}
	
.virtual-remodeler{
    padding:5%;
    
}
.warranty{
    padding:5%;
}
.video{
    text-align:center;
}
.videoWrapper {
	position: relative;
	padding-top: 25px;
        padding-bottom: 56.25%;
	max-width:560px;
        max-height:500px;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
        max-width:560px;
        max-height:315px;
}





/* ============ Media Queries =========== */

@media screen and (max-width:600px) {
    #hero-logo{
        max-width:50px;
    }
    #hero-h1{
        width:100%;
        bottom:10%;
        left:0;
        text-align:center;
    }
    .header-container{
        padding:5% 5vw;
        text-align:center;
    
    }
}
@media (max-width: 479px) {	
	

	
	.expandable-section .panel-group .panel-heading + .panel-collapse &gt; .panel-body {
		padding-top: 50px;
	}
	
}
@media screen and (max-width:400px) {
  h1{
      font-size:22px;
  }
}</pre></body></html>