body {
	grid-template-rows: max-content minmax(max-content, 2fr) minmax(max-content, min-content);
	/* IE Fix */
	-ms-grid-rows: max-content minmax(max-content, 2fr) minmax(max-content, min-content);
}

main {
    padding-bottom: 3rem;
}

abbr {
    text-decoration: none;
}

.logo__icon {
	width: 120px;
	margin-left: 1rem;
}

.landing-page__section {
    margin: 1rem auto;
    max-width: 1800px;
    padding: 0 30px;
}

.sign-in__options {
	padding: 0;
	margin: 0;
	list-style: none;
}

.header {
	height: 80px;
}

.header--landing_page, .header__logo {
	background-color: #ffffff;
	z-index: 1;
}

.header__logo__agency:before {
    content: '';
    background: url(https://nfc.usda.gov/images/sprite.svg) -14px -23px no-repeat;
    background-size: 107px 67px;
    height: 54px;
    width: 77px;
    position: absolute;
    top: -1px;
    left: 0;
}

.header__logo__agency {
    font-size: 1.2rem;
    margin: 0 0 3px 0;
    padding: 0 0 0 88px;
    font-weight: normal;
    position: relative;
}

.header__logo__deptartment {
    font-size: 1rem;
    margin: 0;
    padding: 0 0 0 88px;
    font-style: normal;
    font-weight: normal;
    text-transform: uppercase;
}

.header__logo {
    display: block;
    margin: 1rem 1rem 1rem 2.3rem;
}

.header--landing_page__menu {
    margin: 0 2rem;
    padding: 0;
    list-style: none;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    height: 100%;
}

.header--landing_page__menu__menu-item {
    display: inline-block;
    margin: 0 1rem;
    padding: 5px 0;
    flex-shrink: 0;
}

.button.button--blue {
    background-color: #016e98;
    color: #ffffff;
}

.button--blue:hover, .button--blue:focus {
    background-color: #185a71;
}

.button:hover:before, .button:focus:before {
    opacity: 1;
}

.button.button--purple, .header--landing_page__menu__menu-item .button.button--purple{
    padding: 10px 30px;
    background-color: #412b4c;
    color: #ffffff;
    border: 1px solid transparent;
    text-decoration: none;
    border-radius: 3px;
    display: inline;
    margin: 10px auto;
    cursor: pointer;
    font-size: .8rem;
    position: relative;
    transition: ease background .3s, color .3s;
}

.button.button--purple:hover, .button.button--purple:focus, .header--landing_page__menu__menu-item .button.button--purple:hover, .header--landing_page__menu__menu-item .button.button--purple:focus {
    background-color: #ffffff;
    color: #016e98;
}

.header--landing_page__menu__menu-item a:link, .header--landing_page__menu__menu-item a:visited {
    color: #767676;
    text-decoration: none;
    padding: 8px 5px;
    background: none;
    font-size: 1rem;
    border: none;
    display: inline-block;
    width: auto;
    height: auto;
    transition: .3s ease all;
    position: relative;
}

.header--landing_page__menu__menu-item a:not(.button):before {
    content: '';
    width: 0;
    max-width: 0;
    height: 1px;
    background-color: #767676;
    transition: .3s ease width;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.header--landing_page__menu__menu-item a:hover:before, .header--landing_page__menu__menu-item a:focus:before {
    width: 100%;
    max-width: 100%;
}

.landing-page__container {
	padding: 0;
    overflow: hidden;
    padding: 2rem 0;
	background-color: #d7ebf3;
}

.landing-page__container__banner {
    padding: 0 16px;
    margin: 0 auto;
    max-width: 1850px;
    position: relative
}

.landing-page__container__banner__content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-height: 500px;
}

.landing-page__banner__agency {
    font-size: 1.5rem;
    line-height: 1.5rem;
    margin: 0;
}

.landing-page__banner__app {
    font-size: 2.5rem;
    line-height: 3rem;
    margin: 0;
    font-weight: bold;
}

.landing-page__banner__text {
    padding: 0 24px;
	max-width: 1000px;
}

.landing-page__banner__image {
    max-width: 300px;
    width: 100%;
    height: auto;
	margin: auto;
}

#did_you_know {
    margin: 2rem 0 0 0;
}

.news-box {
    padding: 0;
    margin: 2rem auto;
    list-style: none;
    display: flex;
    align-items: flex-start;
    justify-content: space-evenly;
    flex-wrap: wrap;
}

.news-box__article {
    margin: auto 1rem;
    padding: 2rem;
    max-width: 350px;
}

.news-box__article:last-child {
    border: none;
}

.news-box__article img {
    border-radius: 10px;
    box-shadow: 0 8px 6px -6px #7d7d7d;
    max-width: 100%;
}

.flex-box {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-wrap: wrap;
}

.graphic-list {
    padding: 0;
    margin: 0;
    list-style: none;
}

.graphic-list__item {
    display: flex;
    align-items: flex-start;
    margin: 1rem 0;
}

.graphic-list__item div {
    max-width: 400px;
}

.graphic-list__item__image {
    max-width: 50px;
    height: auto;
    margin: 0 2rem 0 0;
}

.menu, .card {
    font-size: 1rem;
}

.menu__container {
    background-color: #efe8e9;
    color: #564451;
}

.menu__item + dd, .menu__item > .submenu {
    background-color: #886e81;
}

.menu__item .icon {
    /*fill: #71586a;*/
    fill: #584661;
}

.menu__item:hover, .menu__item:focus, .menu__item--active {
    background-color: #886e81;
    color: #ffffff;
}

.menu__item:hover .icon, .menu__item:focus .icon, .menu__item--active .icon {
    fill: #ffffff;
}

.submenu__item > a:hover {
    color: #ffffff;
    background-color: #584661;
}

.masonry-grid {
	padding: 20px;
}

.card__heading {
    /*background-color: #71586a;*/
    background-color: #584661;
}

.card__heading abbr {
	margin: 0 5px;
}

.my-dates, .latest-EL {
	list-style: none;
	padding: 0
}

.my-dates li, .latest-EL li {
	margin: 1rem 0;
	display: flex;
	align-items: center;
}

.my-dates .icon {
	margin: 0 1rem;
    width: 30px;
    height: 30px;
    fill: #767676;
}

.latest-EL {
    margin: 0 0 2rem;
}

.latest-EL li {
    border-bottom: 1px solid #e1e1e1;
    padding: 0 0 1rem;
    margin: 0;
    flex-wrap: wrap;
    justify-content: center;
}

.latest-EL__value {
    margin: 1rem 1rem 0;
    font-size: 1rem;
    text-align: right;
}

.latest-EL__value--leave {
    font-size: .8rem;
    color: #4d4d4d;
}

.latest-EL__value__accrued {
    display: block;
    color: #000000;
    font-size: 1rem;
}

.latest-EL__property {
    margin: 1rem auto 0 0;
    display: flex;
    align-items: center;
}

.latest-EL__icon {
    margin: 0 1rem;
    width: 40px;
    height: 40px;
    padding: 7px;
    fill: #ffffff;
    background-color: #1bbf78;
    border-radius: 90%;
    flex-shrink: 0;
    overflow: visible;
    box-shadow: 0 3px 11px -3px rgb(88, 88, 88);
}

.latest-EL__icon--blue {
    background-color: #2496c1;
}

.latest-EL__timeframe {
    text-align: center;
    color: #767676;
}

.self-service-history {
    margin: 1rem;
    padding: 0;
}

.self-service-history__action--applied .self-service-history__action__icon {
    background-color: #1bbf78;
}

.self-service-history__action--applied .self-service-history__action__info {
    color: #000000;
}

.self-service-history__action {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 0;
    background-color: #ffffff;
    border-bottom: 1px solid #eaeaea;
    border-radius: 3px;
    color: #767676;
    margin: 0 0 10px;
    position: relative;
}

.self-service-history__action:last-child {
    border: none;    
}

.self-service-history__action__icon {
    margin: 0 1rem 0 0;
    width: 40px;
    height: 40px;
    padding: 7px;
    fill: #ffffff;
    background-color: #767676;
    border-radius: 90%;
    flex-shrink: 0;
    box-shadow: 0 3px 11px -3px rgb(88, 88, 88);
}

.self-service-history__action__info {
    margin: 10px auto 10px 0 !important;
    color: #767676;
    font-size: 1rem;
}

.self-service-history__action__name, .self-service-history__action__status {
    margin: 0;
    padding: 0 !important;
}

.self-service-history__button {
    margin: 0 0 1rem;
}

.page__header .button {
	margin: 10px 0 0;
}

.allotment-list {
	margin: 1rem;
	list-style-position: inside;
	counter-reset: list-cards;
	padding: 0;
}

.allotment-list--no-boxshadow .allotment-list__allotment {
    box-shadow: none;
}

.allotment-list__allotment {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-wrap: wrap;
	padding: 8px 10px 8px 45px;
	background-color: #ffffff;
	border: 1px solid #eaeaea;
	border-radius: 3px;
	box-shadow: 0 8px 6px -6px rgb(189, 189, 189);
	color: #767676;
	margin: 0 0 10px;
	position: relative;
}

.allotment-list__allotment__name {
	font-size: 1.2rem;
	color: #333333;
	margin: 0;
}

.allotment-list p {
	margin: 0;
}

.allotment-list__allotment__amount {
	font-size: 1.5rem;
	color: #333333;
	margin-right: 10px;
}

.allotment-list__allotment:before {
	content: counter(list-cards);
	counter-increment: list-cards;
	text-align: center;
	background-color: #584661;
	color: #ffffff;
	font-size: 1.2rem;
	margin: 0 20px 0 0;
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: center;
	padding: 0 12px;
}

.allotment-list .button {margin: 0;width:50px;position: relative}

.allotment-list__info {
	margin: 10px auto 10px 0 !important;
}

.allotment-list__allotment--pending:before {
    background-color: #767676;
}

.allotment-list__allotment--pending {
    box-shadow: none;
}

.allotment-list__allotment--pending .allotment-list__allotment__name, .allotment-list__allotment--pending .allotment-list__allotment__amount {
	color: #767676;
}

.button--icon__text {
	background-color: #333333c2;
	font-size: .9rem;
	white-space: nowrap;
	padding: 7px 8px;
	color: #ffffff;
	border-radius: 5px;
	position: absolute;
	bottom: -36px;
	left: -15px;
	right: -15px;
	transition: .3s ease transform;
	transform-origin: center;
	transform: scale(0);
	z-index: 1;
}
.button--icon:hover .button--icon__text, .button--icon:focus .button--icon__text {
	transform: scale(1);
}

.button--icon:hover .icon, .button--icon:focus .icon {
	fill: #016e98;
}

.form__steps {
	margin: 10px auto 0;
	padding: 0;
	list-style: none;
	display: inline-block;
	position: relative;
}
.form__steps__step {
	display: inline-block;
	padding: 5px 25px 5px 11px;
	color: #767676;
	vertical-align: middle;
	position: relative;
}
.form__steps__step__icon {
	display: inline;
	width: 30px;
	height: 30px;
	vertical-align: middle;
}
.form__steps__step__icon .check {
	fill: #09be81;
	display: none;
}
.form__steps__step__icon .circle {
	fill: none;
	stroke: #e1e1e1;
	stroke-miterlimit: 10;
}
.form__steps__step__label {
	vertical-align: middle;
	margin-left: 10px;
}
.form__steps__step--complete .form__steps__step__icon .circle {
	stroke: #09be81;
}

.form__steps__step--complete .form__steps__step__icon .check {
	background-color: #09be81;
	display: block;
}
.required {
	color: #8a0303;
}
.check {display: none}

.footer {
    background: #eceae7;
    border-top: 1px solid #68696A;
    position: relative;
    overflow: hidden;
    grid-column-start: 1;
    grid-column-end: span 2;
    grid-row-start: 3;
    -ms-grid-column-span: 2;
    -ms-grid-row: 3;
    z-index: 100;
}

.footer__menu {
    max-width: 1800px;
    margin: 2rem auto;
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
}

.footer__menu__item {
    margin: .5rem 1rem;
    font-size: .8rem;
}

.footer__menu__item a:link, .footer__menu__item a:visited {
    color: #68696A;
}

@media (max-width: 1620px) {
    #did_you_know {
        margin: 2rem 0 0 4%;
    }
}

@media (max-width: 1230px) {
    .landing-page__banner__image {
        max-width: 300px;
    }
}

@media (max-width: 1030px) {
    .landing-page__banner__image {
        max-width: 300px;
    }
}

@media (max-width: 895px) {
	header .header__logo {
		width: 80px;
		overflow: hidden;
	}
	.logo__icon {
		margin-left: .5rem;
	}
	.logo__icon__no-mobile {
		display: none;
	}
}

@media (max-width: 760px) {
    .landing-page__banner__image {
        max-width: 200px;
    }
    .landing-page__banner__agency {
        font-size: 1.2rem;
        line-height: 1.2rem;
    }

    .landing-page__banner__app {
        font-size: 2rem;
        line-height: 2rem;
    }
    .news-box__article {
        padding: 0;
    }
}

@media (max-width: 535px) {
	.form__steps__step {
		width: 100%;
	}
}
@media (max-width: 500px) {
    .latest-EL__property {
        width: 100%;
    }

    .latest-EL__value {
        margin: .5rem 1rem 0 auto;
        text-align: right;
    }
    
	#dd__menu__custom-select[data-icon]:before {
		content: attr(data-icon);
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		bottom: 0;
		margin: auto;
		text-align: center;
		font-size: 1.3rem;
		line-height: 60px;
		background-color: #856B7C;
		color: #ffffff;
		font-weight: bold;
		transition: .3s ease color, .3s ease background;
	}

	#dd__menu__custom-select[data-icon]:hover:before, #dd__menu__custom-select[data-icon]:focus:before {
		background-color: #71586a;
		color: #ffffff;
	}
    .header--landing_page__menu {
        margin: 0 1rem 0 0;
    }
    .landing-page__container__banner__content {
        margin: 2rem 0;
    }
    .landing-page__banner__image {
        opacity: 0.2;
        position: absolute;
        top: 13px;
        right: -60px;
    }
    .header--landing_page__menu__menu-item {
        margin: 0 .5rem;
    }
}

@media all and (display-mode: standalone) {
    .no-standalone {
        display: none;
    }
}