@import url('https://fonts.googleapis.com/css?family=Roboto|Roboto+Slab');


.site-header {
    background-color: black;
	background-color: rgba(0,0,0, 0.5);
}

.site-header .container a:hover {
	text-decoration: none;
	color: black;
}

.site-header .container a {
	color: white;
	font-weight: 500;
}

body, html {
    height: 100%;
    width: 100%;
}

.parallax {
    /* The image used */
    background-image: url('../res/glass_rain.jpg');

    /* Full height */
    height: 25%; 

    /* Create the parallax scrolling effect */
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.carousel {
	position: relative;
}



.freeDemo {

	border-radius: 50%;
	width: 5em;
	height: 5em;
	font-size: 5vh;
	box-shadow: 0 0 3px gray;
	border: 2px solid #f5f5f5;
	padding-top: 30px;
}











/*infoHeading & freeDemo buttons for SMALLER viewports width than 1300px*/
@media only screen and (max-width: 1300px){
	#infoHeading1 {
		position: fixed;
		right: 20%;
		top: 25%;
		background: rgba(0,0,0,0.6);	
		width: 30vw;
		padding: 5vh;
		border-radius: 2vh;
	}
	
	#infoHeading2 {
		position: fixed;
		right: 50%;
		bottom: 28%;
		background: rgba(0,0,0,0.6);
		width: 50vh;
		padding: 5vh;
		border-radius: 2vh;
	}
	
	#infoHeading3 {
		position: fixed;
		right: 15%;
		top: 15%;
		background: rgba(0,0,0,0.6);	
		width: 50vh;
		padding: 5vh;
		border-radius: 2vh;
		font-size: 12px;
	}
	
	
	#freeDemo1{
		position: fixed;
		right: 60%;
		bottom: 32%;
	}
	
	#freeDemo2 {
		position: fixed;
		right: 15%;
		bottom: 32%;
	}
	
	#freeDemo3 {
		position: fixed;
		right: 65%;
		top: 32%;
	}
	
}


/*infoHeading for desktop or LARGER viewports*/
@media only screen and (min-width: 1300px){
	#infoHeading1 {
		position: fixed;
		right: 20%;
		top: 45%;
		background: rgba(0,0,0,0.6);	
		width: 30vw;
		padding: 5vh;
		border-radius: 2vh;
	}
	
	#infoHeading2 {
		position: fixed;
		right: 50%;
		bottom: 28%;
		background: rgba(0,0,0,0.6);
		width: 50vh;
		padding: 5vh;
		border-radius: 2vh;
	}
	
	#infoHeading3 {
		position: fixed;
		right: 25%;
		top: 20%;
		background: rgba(0,0,0,0.6);	
		width: 50vh;
		padding: 5vh;
		border-radius: 2vh;
	}
	
	#freeDemo1{
		position: fixed;
		right: 60%;
		bottom: 32%;
	}
	
	#freeDemo2 {
		position: fixed;
		right: 20%;
		bottom: 32%;
	}
	
	#freeDemo3 {
		position: fixed;
		right: 65%;
		top: 40%;
	}	

}

.information{
	background-color: #E8E8E8; 

}

.infoHeader{
	color: #666666;
	font-family: 'Roboto', serif;
}

.infoText{
	color: #666666;
	font-family 'Roboto', serif;
}



/*Footer CSS*/
#footer {
	background-color: #666666;
	
}

.list-unstyled li a {
	color: #ADADAD;
}

.list-unstyled li a:hover{
	text-decoration: none;
}

.list-header{
	color: white;
}

.icon{
	color: white;
	font-size: 2em;
	
}

.divider{
	border-color: #ADADAD;

}

#contactHeader{
	padding-top: 2em;
}

#contactUs{
	padding-bottom: 2em;
}

.testimonialImages{
	border-radius: 50%;
	height: 160px;
	width: 160px;
	background-size: cover;
	box-shadow: 0 4px 8px 0;
	-moz-box-shadow:0 4px 8px 0;
	-webkit-box-shadow: 0 4px 8px 0;
	margin: 5%;
}

#testimonialContainer{
	padding-bottom: 5%;
	padding-top: 1%;
	background-color: #E8E8E8;
}

#moreInfoContainer{
	padding-top: 1%;
	padding-bottom: 1%;
	font-family: 'Roboto', serif;
	background-color: #E8E8E8;
}

.jumbotron{
	background-color: white;
}