body{
	margin: 0;
	color: #232323;
	background-image: url(images/clouds1.png);
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
	--themeColor: #8c0000;
	--logoColor: #dc0000;
	--classHeaderFont: #d2d2d2;
	--mainTextBackground: #f3f3f3;
	
	}
	
	
@media only screen and (min-width : 999px) 
 {
  body#test { 
  background-image: url(images/clouds1.png);
  }
}


@media only screen and
(min-width : 1000px) 
{
	body#test{
	background-image: url(images/drone3.png);
    background-repeat: no-repeat;
	background-attachment: fixed;
	background-size: cover;
  }
}




 .welcome {
	 padding-top:550px;
	 padding-left: 10px;
	 font-family: arial;
	 font-size: 24px;
	 color: var(--themeColor);
	 
 }

 .wrapper_right {
  width: 1000px;
  height: 500px;
  left: 400px;
  top: 155px;
  background-color: white;
  opacity: .6;
  position: absolute;

}





/* Style the header 
Color of top Bar

*/
.header {
  background-image: url(images/carbon_bg.png);
  padding: 8px;
  width: 100%;
  height: 50px;
  text-align: center;
  position: fixed;
  margin-top: none;
  font-family: arial;
  font-size: 26px;
  color:  var(--logoColor);
  /*color: #2ed800;*/

}





 /* The navbar container */
.topnav {

  overflow: hidden;
  display: block;
  padding: 5px;
  padding-right: 30px;
  background-image: url(images/carbon_bg.png);
  position: fixed;
  width: 100%;
  margin-top:38px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #f2f2f2; /* text color */
  text-decoration: none;
  text-align: center;
  font-family: arial;


}

.topnav_alt {


  width: 500px:
  justify-content: center;
  align-items: center;
  color: #f2f2f2; /* text color */
  text-decoration: none;
  text-align: center;
  font-family: arial;
  font-size: 14px;


}

.topnav_lower01{
  overflow: hidden;
  background-color: var(--themeColor);
  position: fixed;
  width: 100%;
  height: 10;
  margin-top: 64px;

/* Previos bg colors
background-color: 2ed800;
*/

		
	}
	
	
	
/* Don't know what this is - added red to test */
	
.topnav_lower02{
  overflow: hidden;
  background-color: red;
  position: fixed;
  width: 100%;
  height: 20;
  margin-top:73px;
		
	}




/* Lower footer colors -  */

.footer01{
  overflow: hidden;
  background-color: var(--themeColor);
  position: fixed;
  width: 100%;
  height: 8;
  bottom: 20px;
		
	}



.footer{
  overflow: hidden;
  background-image: url(images/carbon_bg.png);
  position: fixed;
  width: 100%;
  height: 20;
  bottom: 0px;
		
	}

/* END Lower footer colors */













.footer02{
  overflow: hidden;
  background-color: white;
  position: fixed;
  width: 100%;
  height: 15;
  bottom: 18px;
		
	}




.main_body{
  display: flex;
  justify-content: center;
	
	
	}





 /* Create three equal columns that floats next to each other
This is actually row under top green bar
*/
.column {
  width: 65%;
  margin-right: 10px;
  padding-left: 280px;
  padding-right: 100px;
  padding-top: 70px;
  text-align: left;
  font-family: arial;
  font-size: 13px;
}



 /* Create three equal columns that floats next to each other */
.column_left {
  float: left;
  margin-top: 40px;
  width: 200px;
  padding-left: 0px;
  justify-content: left;
  position: fixed;
  font-family: arial;
  font-size: 13px;
  z-index: 5;
}






/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Responsive layout - makes the three columns stack on top of each other instead of next to each other on smaller screens (600px wide or less) */
@media screen and (max-width: 600px) {
  .column {
    width: 100%;
  }
} 



.pad_header{
	padding-left: 45px;
	
	}

.pad01{
	padding-top:	0px;
	padding-left: 120px;
	
	}




.class_head_wrapper{
	
  overflow: hidden;
  background-color:  var(--themeColor);
  position: fixed;
  width: 100%;
  height: 90;
  margin-top: 0px;
  padding-left: 20px;
  opacity: 1;
  color: var(--classHeaderFont);
	
	
}

.class_header
{
font-size: 26px;
font-weight: bold;

}


 
 .class_wrapper {

  margin-top: -30px;
  margin-right: 0px;
  margin-left: 50px;
  padding-top: 130px;
  padding-left: 30px;
  padding-right: 30px;
  background-color: var(--mainTextBackground);
  opacity: .9;
  position: absolute;
  z-index: -5;

}




 .box_left {
  width: 270px;
  height: 600px;
  margin-top: 45px;
  padding-top: 30px;
  padding-left: 30px;
  background-color: var(--mainTextBackground);
  opacity: .8;
  position: absolute;
  z-index: -10;
  font-size: 12px;
  letter-spacing: 2px;
  line-height: 20px;
  

}