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

html
{
	height: 100%;
}

body
{
	font-family: 'Roboto', sans-serif;
}

.body-content
{
	background-color: #fff;
	padding-bottom: 45px;
	min-height: calc(100% - 98px);
}

.text-pre
{
	white-space:pre-line;
}

.btn-round
{
	border-radius:50%;
}

.btn-floating
{
	background-color: #4285f4;
	color: #FFFFFF;
}

	.btn-floating:hover
	{
		color: #c2c2c2;
	}

.btn-circle.btn-sm
{
	width: 30px;
	height: 30px;
	padding: 6px 0px;
	border-radius: 15px;
	font-size: 8px;
	text-align: center;
}

.btn-circle.btn-md
{
	width: 50px;
	height: 50px;
	padding: 7px 10px;
	border-radius: 25px;
	font-size: 22px;
	text-align: center;
}

.badge-counter
{
	z-index: 15;
	position: relative;
	left: -5px;
	top: -10px;
	font-weight: lighter;
	font-size: .5em;
}

.IFrame-Content
{
	height: calc(100% - 98px);
}

div.formItems > div.row:nth-child(2n)
{
	background-color: #c2c2c2;
}

.bg-psu
{
	background-color: #001a4f;
}

.bg-psu > a {
	color: white;
}

.bg-nittany {
	background-color: #001E44;
}

.bg-beaver-blue {
	background-color: #1E407C;
}

.bg-pa-sky {
	background-color: #099CDE;
}

.bg-psu-creek {
	background-color: #3EA39E;
}

.bg-psu-slate {
	background-color: #314d64;
}

.bg-psu-limestone {
	background-color: #91959C;
}

.bg-psu-land-grant {
	background-color: #6a3028;
}

.bg-psu-lion-shrine {
	background-color: #B88965;
}

.bg-psu-lion-roar {
	background-color: #bf8226;
}

.bg-psu-penn-forest {
	background-color: #4A7729;
}

.bg-psu-pugh-blue {
	background-color: #96bee6;
}

.bg-psu-stately-atherton {
	background-color: #ac8dce;
}

.bg-psu-old-coaly {
	background-color: #54585A;
}

.bg-psu-old-coaly a {
	color: #FFD37A
}

.bg-psu-original-1887 {
	background-color: #bc204b;
}

.bg-psu-dawn {
	background-color: #f2665e;
}

.bg-psu-invent-orange {
	background-color: #E98300;
}

.bg-psu-bright-keystone {
	background-color: #FFD100;
}

.bg-psu-future {
	background-color: #99cc00;
}

.bg-psu-green-opportunity {
	background-color: #008755;
}

.bg-psu-perpetual-wonder {
	background-color: #491d70;
}

.bg-shagbark {
	background-color: #574D47;
}

.psu-card-img
{
	max-height: 150px;
	max-width: 150px;
}

.psu-admin-page-link {
	font-weight: 700;
}

.psu-hidden {
    display: none;
}

div.psu-product-filters {
    background-color: #ebebeb;
}

div.psu-product-category:nth-child(even) {
    background-color: #f7f3ea;
}

td.psu-active-checkbox-column {
    vertical-align: middle;
}

a.psu-no-underline {
	text-decoration-line: none;
}

div.skip-to-main-content > a {
    color: #ffff00 !important;
}

div.psu-software-card-header {
    padding: 0.25rem;
    min-height: 4.5em;
}

div.psu-software-card-body {
    padding: 0;
}

div.psu-software-card-body-container {
    position: relative;
    margin-bottom: 0.75rem;
    padding-top: 0.75rem;
}

div.psu-software-card-footer {
    padding: 0.25rem 0.5rem;
}

div.psu-software-card-header, div.psu-software-card-footer {
    background-color: rgba(0, 0, 0, 0.05);
}

h2.psu-software-version {
    font-weight: 700;
    margin-top: 0;
    margin-bottom: 0;
}

div.psu-software-info {
    width: 16px;
    height: 16px;
    right: 3px;
    top: 3px;
    line-height: 16px;
}

div.psu-justification-container {
    background-color: #e9ecef;
    padding: 1rem;
    margin: 1rem 0;
}

div.psu-software-card-button {
    margin-top: 0.25rem;
    margin-bottom: 0.25rem;
}

div.psu-order-agreement-text, div.psu-order-agreement-text > p {
    margin-top: 0.75rem;
    margin-bottom: 0.75rem;
}

div.psu-order-level-1 {
    background-color: var(--lions-roar-light);
    padding: 0.5em;
    margin-bottom: 0.75em;
}

div.psu-order-level-2 {
    border-left: 6px solid var(--pugh-blue);
    margin: 0.5rem;
    padding: 0.5em;
    padding-left: 0.75em;
    margin-bottom: 1em;
}

div.psu-complete-order-downloads {
    background-color: var(--pa-slate-max-light);
    border: 1px solid var(--pa-slate);
    border-left-width: 0;
    border-right-width: 0;
    padding: 1em;
    margin-bottom: 1em;
}

div.psu-complete-order-subsection {
    padding-left: 0.5em;
    margin-bottom: 1rem;
}

div.psu-complete-order-subsection blockquote {
    margin-left: 1rem;
    padding-left: 1rem;
    border-left: 4px solid var(--pugh-blue);
}

p.psu-order-agreement-notice {
    font-size: 1.25em;
    margin-top: 0.75em;
}

/* Headings are from bootstrap-reboot.css but sized down one level for consistency with previous software request versions 
    (for example, h1 here matches h2 in bootstrap-reboot.css) */
h1 {
    font-size: calc(1.325rem + 0.9vw);
}

@media (min-width: 1200px) {
    h1 {
        font-size: 2rem;
    }
}

h2 {
    font-size: calc(1.3rem + 0.6vw);
}

@media (min-width: 1200px) {
    h2 {
        font-size: 1.75rem;
    }
}

h3 {
    font-size: calc(1.275rem + 0.3vw);
}

@media (min-width: 1200px) {
    h3 {
        font-size: 1.5rem;
    }
}

h4 {
    font-size: 1.25rem;
}

h5 {
    font-size: 1.15rem;
}

h6 {
    font-size: 1rem;
}

nav.navbar-psu {
    background-color: #001a4f;
}

.navbar-dark .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-link:link,
.navbar-dark .navbar-nav .nav-link:visited,
.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:active {
    color: rgba(255, 255, 255, 1);
}

/* 
    For nav-link:hover:
        Transform works well when the navbar is expanded, but pushes the text off the screen when it's collapsed. 
        Font-size works well when the navbar is collapsed, but shifts the other menu items when it's expanded.
*/
@media screen and (max-width:991px) {
    .nav-link:hover {
        font-size: 110%;
    }
}

@media screen and (min-width: 992px) {
    .nav-link:hover {
        transform: scale(1.1);
    }
}

/* using font-size looks nicer than the transform in the submenu */
.nav-dropdown-link:hover {
    font-size: 110%;
}

.w-15
{
	width: 14%;
	padding: .5%;
	max-width: 14%;
}

table.fixed
{
	table-layout: fixed;
	word-wrap: break-word;
}

	table.fixed th, table.fixed td
	{
		overflow: hidden;
		display: inline-block;
		text-overflow: ellipsis;
		white-space: nowrap;
	}

	.large-checkbox
	{
		transform:scale(1.5);
	}

@media screen and (min-width: 200px) and (max-width:767px)
{
	.content-container
	{
		max-width: 100vw;
		padding: 0;
		margin: 0;
	}
}

@media screen and (min-width: 768px)
{
	.content-container
	{
		max-width: 80vw;
		margin: 0 auto;
	}
}

#snackbar
{
	visibility: hidden;
	width: 100%;
	text-align: center;
	padding: 16px;
	position: fixed;
	z-index: 1;
	left: 0;
	bottom: 40px;
}

	#snackbar.show
	{
		visibility: visible;
		-webkit-animation: fadein 1.0s ease-in, fadeout 1.0s ease-out 6s;
		animation: fadein 1.0s ease-in, fadeout 1.0s ease-out 6s;
	}

#snackbar-error
{
	visibility: hidden;
	width: 100%;
	text-align: center;
	padding: 16px;
	position: fixed;
	z-index: 1;
	left: 0;
	bottom: 40px;
}

	#snackbar-error.show
	{
		visibility: visible;
		-webkit-animation: fadein 1.0s ease-in, fadeout 1.0s ease-out 6s;
		animation: fadein 1.0s ease-in, fadeout 1.0s ease-out 6s;
	}

@-webkit-keyframes fadein
{
	0%
	{
		opacity: 0;
	}

	50%
	{
		opacity: .5;
	}

	100%
	{
		opacity: 1;
	}
}

@keyframes fadein
{
	0%
	{
		opacity: 0;
	}

	50%
	{
		opacity: .5;
	}

	100%
	{
		opacity: 1;
	}
}

@-webkit-keyframes fadeout
{
	0%
	{
		opacity: 1;
	}

	50%
	{
		opacity: .5;
	}

	100%
	{
		opacity: 0;
	}
}

@keyframes fadeout
{
	0%
	{
		opacity: 1;
	}

	50%
	{
		opacity: .5;
	}

	100%
	{
		opacity: 0;
	}
}

#loading_data_icon
{
	position:absolute;
	display: block;
	right: 25px;
	top: 3px;
	height:16px;
	width:16px;
	opacity:0.7;
}
.ui-autocomplete
{
	/* style for showing scrollbar if there are lot of list of suggestions max-height: 300px; */
	overflow-y: auto;
	overflow-x: hidden;
	padding-right: 20px;
	max-height:200px;
}