.style_title3{
	font-size: 20px;
	color: #383838;
	padding: 0px 0px 0px 0px; /* top, rig, bot, lef */
}

.style_title2{
	font-size: 18px;
	color: #383838;
	padding: 0px 0px 0px 0px; /* top, rig, bot, lef */
}
.style_title1{
	font-size: 16px;
	color: #ac4d13;
	padding: 0px 0px 0px 0px; /* top, rig, bot, lef */
}
.style_title0{
	font-size: 14px;
	color: #383838;
	padding: 0px 0px 0px 0px; /* top, rig, bot, lef */
}

.body_font{
	font-size: 18px;
	color: #ac4d13;
	padding: 0px 0px 0px 0px; /* top, rig, bot, lef */
}
.footer_font{
	font-size: 18px;
	color: #ac4d13;
	padding: 0px 0px 0px 0px; /* top, rig, bot, lef */
}
.center_image{
	text-align: center;
}

.background_image{
	background-color: #ffffff; 
	height:500px;
	background-size: auto;
	background-repeat: no-repeat;
}

.box_text{
	float:left;
	height: 175px;
	width: 250px;
	border: 2px solid #ffffff;
	border-color:#005360;
	margin: auto;
}

.stepcarousel{
	position: relative; /*leave this value alone*/
	border: 10px solid navy;
	overflow: scroll; /*leave this value alone*/
	width: 100%;
	height: 200px; /*Height should enough to fit largest content's height*/
	-webkit-box-sizing: border-box; /* set box model so container width and height value includes any padding/border defined */
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.center_img {
  padding:0px 30px 0px 30px;
  float:center;
  text-align:center;
}
.calender{
	float:left;
	padding: 0px 5px 0px 5px; 
	width:12%;
	height: 120px;
	vertical-align: top;
	border:1px solid #fffffe;
	font-size: 12px;
}

/* CSS for specific carousel container called #mybgcarousel. ==================================================  */
#mybgcarousel{ 
	width:100%;
	height:500px;
}

/* ######### Shared CSS for various parts of carousel (in the event of multiple carousels) ######### */

div.bgcarousel{ /* shared CSS for main carousel container */
	background: black url(./java/ajaxload.gif) center center no-repeat; /* loading gif while caoursel is loading */
}

div.bgcarousel img.navbutton{ /* CSS for the nav buttons */
}

div.bgcarousel div.slide{ /* CSS for each image's DIV container within main container */
	background-color: black;
	background-position: center center; /* center image within carousel */
	background-repeat: no-repeat;
	background-size: cover; /* CSS3 property to scale image within container? "cover" or "contain" */
	color: black;
}

div.bgcarousel div.selectedslide{ /* CSS for currently selected slide */
}

div.bgcarousel div.slide div.desc{ /* DIV that contains the textual description inside .slide */
	position: absolute;
	color: white;
	left: 20px;
	top: 50px;
	width:200px;
	padding: 10px;
	font: bold 16px sans-serif, Arial;
	text-shadow: 0 -1px 1px #8a8a8a; /* CSS3 text shadow */
	z-index:5;
}

div.bgcarousel div.selectedslide div.desc{ /* CSS for currently selected slide's desc div */
}

div.bgcarousel div.slide div.desc h2{
	font-size:150%;
	margin:0;
}

div.bgcarousel div.slide div.desc a{
	color:yellow;
	text-decoration:none;
}

@media (min-width: 1240px) {
	#mybgcarousel{ 
		width:100%;
		height:720px;
	}

}