@charset "utf-8";
/* CSS Document */
.prerequisite, .advisor, .footnote { font-size: smaller; }

.content-image { height: auto; margin: 0 0 1rem 0; }
.content-image.left { margin-right: 1rem; }
.content-image.right { margin-left: 1rem; }
.content-image.center { display: block; margin-left: auto; margin-right: auto; }
 /*NOTE When using .content-image in conjunction with either .left or .right, you must use CSS to give your image a width.  You might have to give it more than one width for different responsive steps.  Start with the smallest step and procsed upward.*/

.panel.left { margin-right: 1rem; }
.panel.right { margin-left: 1rem; }
.panel.center { display: block; margin-left: auto; margin-right: auto; }
 /*NOTE When using .panel in conjunction with either .left or .right, you must use CSS to give your panel a width.  You might have to give it more than one width for different responsive steps.  Start with thes mallest step and procsed upward.*/


/* Condensed Bold Sans serif */
.side-nav.accordion> dd dd > a:not(.button) { font-family: 'roboto_condensedregular', 'Arial Narrow', 'HelveticaNeue-Condensed', 'Helvetica Narrow', Arial, sans-serif; font-style: normal; font-weight: 700; }

.side-nav.main-menu.accordion dd dd > a { background: #fff /*white*/; color: #3b5998 /*blue*/; padding: 0.375rem 0.75rem; text-decoration: none; }
.side-nav.main-menu.accordion dd dl { margin-bottom: 0; margin-top: 0; }




/* ##### RESPONSIVE STEPS ##### */

/*NOTE: The default step is small*/

.small { display: block; }
.medium, .large, .xlarge, .xxlarge { display: none; }
@media only screen and (min-width: 31.26em) { /*medium and up*/
	.medium { display: block; }
	.small, .large, .xlarge, .xxlarge { display: none; }
}

@media only screen and (min-width: 46.26em) { /*large and up*/
	.large { display: block; }
	.small, .medium, .xlarge, .xxlarge { display: none; }
}

@media only screen and (min-width: 61.26em) { /*x-large and up*/
	.xlarge { display: block; }
	.small, .medium, .large, .xxlarge { display: none; }
}

@media only screen and (min-width: 75.01em) { /*xx-large*/
	.xxlarge { display: block; }
	.small, .medium, .large, .xlarge { display: none; }
