body{
    padding-top: 100px;
} 

h1{
	font-size : 300%;
	color : #555;
    font-family : "Segoe UI", "Helvetica Neue",  Helvetica, Arial, sans-serif;
	font-weight : 200;

	
}

h2 a:hover{
	border-bottom: thin solid #337ABD;
	text-decoration: none;
	color: #337ABD;
}


h2{
	font-size : 250%;
	color : #555;
		font-family : "Segoe UI", "Helvetica Neue",  Helvetica, Arial, sans-serif;
	font-style : thin;
	font-weight : 200;
	
}

h3{
	font-size : 200%;
	color : #555;
		font-family : "Segoe UI", "Helvetica Neue",  Helvetica, Arial, sans-serif;
	font-style : thin;
	font-weight : 300;
	
	}

h3 a:hover{
	color: #337ABD;
	border-bottom: 1px solid #337ABD;
	text-decoration: none;
	
}

p{
	font-size : 125%;
	color : #555;
	font-family: Muli, "Segoe UI", Helvetica, Arial, sans-serif;
	font-weight : 100;
}

blockquote{
	font-size : 100%;

}

.row-spacer{
	margin-top:40px;
	}

.footer{
	
	padding: 20px;
	border-top: thin dotted grey;
	text-align: center;
	}
	
.footer p{
	font-size : 90%;
	
	}	
	
.same-as-p{
	font-size : 125%;
	color : #555;
	font-family: Muli, "Segoe UI", Helvetica, Arial, sans-serif;
	font-weight : 100;
}


.smallprint{
	font-size : 80%;
	color : #555;
	font-family: Muli, "Segoe UI", Helvetica, Arial, sans-serif;
	font-weight : 100;
}

.thumb-label{
	text-align: center;
}

.thumb{
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	        display: block;
        margin-left: auto; 
        margin-right: auto;
	}


.centered
{
    display: inline-block;
    vertical-align: middle;
}

.code-red{
	color: red;
}

/*  ************************INDEX PAGE*********************************  */

.index-first{
 background-image: url("assets/images/index/shingle-plants.webp"); 
    /*background-size: cover;*/
background-position: center top; 
background-repeat: no-repeat;
height: 500px;
}


.index-promo{
 background-image: url("assets/images/viridian-mega2-ff.jpg"); 
    /*background-size: cover;*/
background-position: center top; 
background-repeat: no-repeat;
height: 500px;
}

.index-xmas{
 background-image: url("assets/images/Snowy-Alpine-Solar.jpg"); 
background-size: cover;
background-position: center top; 
background-repeat: no-repeat;
height: 500px;
}



/*  ************************PRODUCTS PAGE*********************************  */

.fusion-first{
 background-image: url(assets/images/products/roof-integrated-solar-pv-panels-mega.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;
height: 500px;
}

.fusion-second{
 background-image: url(assets/images/products/flush-fitting-integrated-solar-pv-mega.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;

}

.fusion-forest{
 background-image: url("assets/images/viridian-mega2-ff.jpg"); 
    background-size: cover;
background-position: center top; 
background-repeat: no-repeat;
height: 500px;
}

.benefits{
 background-image: url(assets/images/products/benefits-of-roof-integrated-solar-panels.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;

}

.panels{
 background-image: url(assets/images/products/solar-panels-for-roof-integration.jpg); 
    background-size: cover;
background-position: top center; 
background-repeat: no-repeat;

}

.roofwindow{
 background-image: url("assets/images/products/VELUX-solar-roof.jpg"); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;

}

.fusionforest{
 background-image: url("assets/images/products/fusion-forest/fusion-forest-header.jpg"); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;

}

.clearline-ev{
 background-image: url(assets/images/products/clearline-ev/electric-vehicle-charger.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;
height: 500px;
}

.clearline-ev2{
 background-image: url("assets/images/products/clearline-ev/Clearline-EV-wall-mount.png"); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;
height: 700px;
}

.clearline-ev3{
 background-image: url("assets/images/products/clearline-ev/electric-vehicle-charger.jpg"); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;
height: 500px;
}

.endorsements{
 background-image: url(assets/images/products/inline-solar-panels-endorsements.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;
height: 500px;
}

.text-box-black{
	
	background-color: rgba(0,0,0,0.75);
	width: 300px;
		padding: 10px;
	position: absolute;
	
}

.text-box-white{
	
	background-color: rgba(255,255,255,0.85);
	width: 300px;
	padding: 10px;
	position: absolute;
	
}


.arcbox-first{
 background-image: url("assets/images/products/arcbox/arcbox-bg.jpg"); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;
height: 700px;
}

.inverter-first{
 background-image: url("assets/images/products/clearline-inverter/solar-inverter-hero.jpg"); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;
height: 400px;
}

.clearline-second{
 background-image: url(assets/images/products/flush-fitting-integrated-solar-thermal-mega.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;

}


/*  ************************TECHNICAL PAGE*********************************  */

.drawing-register table{
	border-collapse: collapse;
	}
	
.drawing-register tr td {
	border-bottom: solid 1px #999;
	padding: 2px 10px;
	font-size : 110%;
	color : #555;
	font-family: Muli, "Segoe UI", Helvetica, Arial, sans-serif;
	font-weight : 100;
	}
	
.drawing-register th {
	border-bottom: solid 1px #999;
	border-top: solid 1px #999;
	padding: 5px 10px;;
	font-size : 100%;
	color : #555;
	font-family: Muli, "Segoe UI", Helvetica, Arial, sans-serif;
	font-weight : 100;
	}


/*  ************************   CASE STUDIES  *********************************  */


.case-study-box{
		 border: solid thin #DDD; 
	padding: 20px;
	box-shadow: 5px 5px 8px #EEE;
	
	
}




.CF001{
 background-image: url(case-studies/case-study-assets/CF001-top.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;

}

.CF002{
 background-image: url(case-studies/case-study-assets/CF002-top.jpg); 
    background-size: cover;
background-position: left center; 
background-repeat: no-repeat;

}


.CF003{
 background-image: url(case-studies/case-study-assets/CF003-top.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;

}


.CF004{
 background-image: url(case-studies/case-study-assets/CF004-top.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;

}


.CF007{
 background-image: url(case-studies/case-study-assets/CF007-top.jpg); 
    background-size: cover;
background-position: left center; 
background-repeat: no-repeat;

}

.CF008{
 background-image: url(case-studies/case-study-assets/CF008-top.jpg); 
    background-size: cover;
background-position: center center; 
background-repeat: no-repeat;

}

.CF009{
 background-image: url(case-studies/case-study-assets/CF009-top.jpg); 
    background-size: cover;
background-position: left center; 
background-repeat: no-repeat;

}

.CF010{
 background-image: url(case-studies/case-study-assets/CF010-top.jpg); 
    background-size: cover;
background-position: left center; 
background-repeat: no-repeat;

}

.CF011{
 background-image: url(case-studies/case-study-assets/CF011-top.jpg); 
    background-size: cover;
background-position: left center; 
background-repeat: no-repeat;

}


.CF014{
 background-image: url(case-studies/case-study-assets/CF014-top.jpg); 
    background-size: cover;
background-position: left center; 
background-repeat: no-repeat;

}

/*  ************************   CASE STUDY VIDEOS  *********************************  */


video {
  object-fit: cover;
  width: 100vw;
  height: 500px;
  position: absolute;
  top: 25;
  left: 0;
}

.vid-text-over {
  position: relative;
  height: 100vh;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}



/*  ************************DISTRIBUTOR PAGE*********************************  */

.row-dist{
	padding-top:10px;
	padding-bottom:10px;
	border-bottom: thin solid #BBB;
	min-height: 150px;
	
}

.dist-sub{
	max-height: 125px;	
}


/*  ************************NEWS PAGE*********************************  */

.row-news{
	
	padding-top:10px;
	padding-bottom:10px;
	border-top: thin solid #BBB;
	min-height: 150px;
	
}

.row-archive{
	padding-top:10px;
	padding-bottom:10px;
	border-top: thin solid #BBB;
	
}

.art-news{
	padding-top:10px;
	padding-bottom:10px;
	border-top: thin solid #BBB;
	
}

.news-sub{
	display: flex;
  justify-content: center;
  align-items: center;
  height: 200px;
	/*max-height: 150px;
	max-width: 250px;
	vertical-align:middle;
	 margin: auto;
  	display: block; */
}


.news-text{
	padding-left: 30px;
	padding-right: 30px;
	padding-top: 10px;
	
}

.news-image{
	
	max-width: 300px;
}

.news-line{
	max-height: 125px;	
	max-width: 200px;
}


/*  ************************ABOUT US PAGES*********************************  */


.flag-table{
	height: 100px;
	padding: 10px 20px;	
	overflow: hidden;
}

.flag{
	height: 100px;
	float: left;
	padding: 10px 20px;	
}



/*  ************************THE READER*********************************  */

.reader-image-right{
	float: right;
	padding: 20px 0px 20px 20px;
	
	
}


.reader-image-left{
	float: left;
	padding: 20px 20px 20px 0px;	
}


.reader-tab{
	border-radius: 0px 0px 0px 0px;	
	/*background-color: #7ac4f7;  /*#1664DC*/
	height: 20px;
	font-family: arial;
	font-size: 14px;
	color: #FFF;
	padding: 0px 10px 0px 10px;
	/*border-top: solid 1px rgba(0,0,0,0.25);*/
	
}


.table-section{
	
	
	background-color: #ddd;
}


.reader-tab a {
	
	color: #FFF;
}


.reader-box{
		
	background-color: #eee;  /*#1664DC*/
	color: #FFF;
	padding: 10px 10px 10px 10px;
	border: solid 1px rgba(0,0,0,0.25)
	
}
.reader-box p{
		
	font-size: 90%;
	color: #111;
	
}


/*  ************************NAVBAR*****************************  */

.navbar-left{
			
			height: 80px;
	
			}

.navbar-new {
    background-color: rgba(255,255,255,0.95); /*26, 83,173*/
    border-color: none;
    min-height:100px;
	font-size: 100%;
	padding-top: 7px;
}

.navbar-new .navbar-brand,
.navbar-new .navbar-brand:hover,
.navbar-new .navbar-brand:focus {
    color: #FFF;


}

.navbar-new .navbar-nav > li > a {
    color: #999;

    padding-top: 0px; 
    padding-bottom: 0px;  
    height: 80px; 
    line-height: 80px;
	
    
}

.navbar-new .navbar-nav > li > a:hover,
.navbar-new .navbar-nav > li > a:focus {
    

    color: #000;
    background-color: #FFF;
    
}

/*Active Menu Item Styling */



.navbar-new .navbar-nav > .active > a,
.navbar-new .navbar-nav > .active > a:hover,
.navbar-new .navbar-nav > .active > a:focus {
    color: #000;

}


.navbar-new .navbar-text {
    color: #eee;
  }

/*collapsed nav box styling */




.navbar-new .navbar-toggle {
    border-color: #ccc;
   
}

.navbar-new .navbar-toggle:hover,
.navbar-new .navbar-toggle:focus {
    background-color: #eee;
    
}

.navbar-new .navbar-toggle .icon-bar {
    background-color: #888;
}

/* dropdown menu styling*/
.dropdown-menu > li > a {
	font-size: 110%;
    color: #666;
	
    
}
.dropdown-menu > li > a:hover,
.dropdown-menu > li > a:focus {
    background-color: #FFF;

    
}


/*  ************************  PHONE SCREEN  *****************************  */

@media only screen and (max-width: 767px) {
			
	
			body{
    		padding-top: 75px;
			}
	
			.navbar-new {
    		background-color: rgba(255,255,255,0.95); /*26, 83,173*/
    		border-color: none;
    		min-height: 75px;
				font-size: 120%;
			padding-top: 7px;
			}
	
			.navbar-left{
			
			height: 60px;
			}
			
	


			h1{
			font-size : 300%;
			color : #555;
			font-family : "Segoe UI", "Helvetica Neue",  Helvetica, Arial, sans-serif;
			font-weight : 300;
	
			}

			p{
			font-size : 125%;
			color : #555;
			font-family:"Helvetica-Light", "Segoe UI", Helvetica, Arial, sans-serif;
			font-weight: 400;
			}
    
            h2{
	        font-size : 300%;
            color : #555;
            font-family : "Helvetica-Light", "Segoe UI", Helvetica, Arial, sans-serif;
                font-style : normal;
                font-weight : 400;
	
            }
			
			 h3{
	        font-size : 200%;
            color : #555;
            font-family : "Helvetica-Light", "Segoe UI", Helvetica, Arial, sans-serif;
                font-style : normal;
                font-weight : 400;
	
            }
			
			.index-first{
 			background-image: url("assets/images/index/shingle-plants.webp".jpg); 
    		background-position: center top; 
			background-repeat: no-repeat;
			height: 500px;
			}  
	
			.fusion-first{
 			background-image: url(assets/images/products/roof-integrated-solar-pv-panels-megamob.jpg); 
    		background-position: left top; 
			background-repeat: no-repeat;
			height: 500px;
			} 
			
			.footer p{
				font-size : 100%;
	
			}
			.same-as-p{
			font-size : 125%;
			color : grey;
			font-family:"Helvetica-Light", "Segoe UI", Helvetica, Arial, sans-serif;
			font-weight: 400;
			}
	
			.hide-mobile{
			display: none;
			}
		
		}