@charset "UTF-8";
@import url('https://fonts.googleapis.com/css?family=Lato|Open+Sans:400,700&display=swap');

body{
	font-family: 'Open Sans';
color:rgb(40,40,40);
	font-size: 16px;
	/*line-height: 1.5em;*/
	margin: 0;
}

:root {
  --orange: rgb(245, 228, 184);
}
/*hr{
	margin:2em 0;
	border: 1px solid #333;
}*/
.project-background{
	background-color: var(--orange);
	background-color: rgb(245, 228, 184);
	padding:7px;
	border-radius: 5px;
	margin-top:10px;
	margin-bottom:10px;
}
html {
  scroll-behavior: smooth;
}
strong{
		font-weight: bold !important;
	}
a{
	color: #a33f1a;
	text-decoration:none;
	border-bottom: 1px dotted;
	transition:all .3s ease;
	
}
a:hover,
a:focus {
  color: #23527c;
	border-bottom: 1px solid;
  text-decoration: none;
	/*background-color: rgba(0,0,0,0.05);
	padding: 1px;
	margin: -1px;*/
}
a:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}
.jumbotron h1{
	color: rgba(93, 202, 252,1.0);
}
.jumbotron{
	color:#fff;
	padding:5px;
	background:#000 url("https://streaming.missioncollege.edu/mgarrett/media/mission_images/milky-way-starry-sky-night-sky-star-956981-skinny-1920.jpeg") no-repeat center center;
	background-size: cover;
	background-attachment: fixed;
	min-height: 180px;
}

@media (max-width: 767.98px){
	.jumbotron{
		background-attachment: scroll;
		min-height: 140px;
	}
}
.jumbotron_72{
	color:#fff;
	padding:5px;
	background:#000 url(https://streaming.missioncollege.edu/mgarrett/media/mission_images/milky-way-starry-sky-night-sky-star-956981-skinny-1920.jpeg) no-repeat 0px 0px;
			background-size: 100%;
	background-attachment: fixed;
}
h2, h3, h4, h5, h6{
	font-family: "Lato";
	color:rgba(114,110,49,1.00);
}

h5{font-size: 17px;
margin-top: 20px;
	margin-bottom: 4px;
}

.lightborder1{
	border-bottom:2px solid rgba(0,0,0,0.2);
	margin:2em 0;
	padding-bottom: 2em;
}
/* --- Bootstrap 5 compatibility ---------------------------------------
   This page uses .alert-info / .alert-success / .alert-danger on their own
   (on <li> and <span>), without Bootstrap's .alert class. In Bootstrap 3
   the modifier alone supplied the colours. In Bootstrap 5.3 it only sets
   CSS variables that .alert consumes, so on its own it renders nothing.
   The colours below are Bootstrap 3's, hard-coded here so the page no
   longer depends on any Bootstrap version for them.
   (No border: the original had none either, because border-style came
   from .alert, which was never applied.) */
.alert-info{
	padding:5px;
	border-radius: 5px;
	background-color: #d9edf7;
	color: #31708f;
}
.alert-success{
	padding:5px;
	border-radius: 5px;
	background-color: #dff0d8;
	color: #3c763d;
}
.alert-danger{
	padding:5px;
	border-radius: 5px;
	background-color: #f2dede;
	color: #a94442;
}

/* Bootstrap 5 removed .jumbotron entirely. Everything visual for it is
   already defined below in this file; these restore the spacing and type
   scale Bootstrap 3 used to contribute. */
.jumbotron{
	margin-bottom: 30px;
}
.jumbotron p{
	font-size: 21px;
	font-weight: 200;
}
@media (min-width: 768px){
	.jumbotron h1{
		font-size: 63px;
	}
}

/* Bootstrap 5's Reboot zeroes the top margin on all headings; Bootstrap 3
   gave them 20px. This page leans on that breathing room between the
   weekly Topics/Assignment headings. (h2 is handled in online_classes2.css.) */
h3, h4{
	margin-top: 20px;
	margin-bottom: 10px;
}
/* --- end Bootstrap 5 compatibility ---------------------------------- */
ul{
padding-left:1em;	
}
.current_week{
	background-color:rgba(0,0,0,0.04);
	
	}
	/*.current_week h3{
	content:" Current Week";
	color:rgba(255,93,0,0.5);
}*/
.current_week h3:after{
	content:" Current Week";
	color:rgba(255,93,0,0.5);
}
.class_links li{
	/* online_classes2.css sets list-style-image on every "ul li" with
	   list-style-position:outside. These items sit in a ul with padding:0,
	   so the marker is drawn outside the list box and gets clipped at the
	   viewport edge on narrow screens. The bordered, full-width link boxes
	   below already read as list items, so the marker is dropped here.
	   "list-style" (not "list-style-type") is what clears the image too. */
	list-style:none;
	border:1px solid rgba(0,0,0,0.1);
	/*padding:5px;*/
	margin:7px 0;
	border-radius:.3em;
	background-color:rgba(0,0,0,0.05);
	transition:all .3s;
	list-style-image: none;
	list-style-type: none;
}
.class_links li:hover{
	background-color:rgba(0,0,0,0.15);
}
.class_links li a{
	display:block;
	padding:5px;
	outline:0;	
}
ul.class_links{
	padding:0;
	margin:0;
	list-style-image: none;
	list-style-type: none;
}
.point_breakdown{
	width:100%;
	border:1px solid rgba(0,0,0,0.2);
}
.point_breakdown td{
	padding:.5em;
}
.point_breakdown tr:nth-child(odd){
	background-color:rgba(0,0,0,0.1);
}
.point_breakdown td:nth-child(even){
	text-align: right;
}
.topics_accent1{
	color: rgba(114,110,49,1.00);
	font-size: 1.7rem;
}
/* flexnav1 code */

ul.flexnav1{
		display: flex;
	}
ul.flexnav2{
	display: flex;
	flex-wrap: wrap;
}
ul.flexnav2 li{
	margin: .2em;
}
	ul.flexnav1, ul.flexnav2{
		list-style-type: none;
		padding: 0;
		margin: 0;
		text-decoration: none;
	}
	ul.flexnav1 li{
		list-style: none;
		margin: 5px;
		border: 1px solid rgba(0,0,0,0.3);
		border-radius: .2em;
		background-color: rgba(0,0,0,0.1);
		transition: all .2s ease;
	}
	ul.flexnav1 li:hover{
		background-color: rgba(0,0,0,0.2);
		
	}
	ul.flexnav1 li a{
		/*background-color: rgba(0,0,0,0.1);*/
		padding: 5px;
		display: block;
		text-decoration: none;
		
		/*white-space: nowrap;*/
	}
/*ul.flexnav1 li a:hover{
		border-bottom: 1px dotted rgba(0,0,0,0.5);
		
	}
*/