@charset "utf-8";
/* CSS Document */

hr {
	border-top: unset;
	border-bottom: 3px solid #C9BFA4;
	width: 28rem;
	margin: 0 auto;
}

#header-main {
	z-index: 10000;
}

#header-main.tucked {
	top: 0px;
}

p {
	font-size: 18px;
}

.other-units,
.footer-search,
#footer-main,
#extended-nav {
	z-index: 9999;
}



/*************************
NAV JUMP HOVER ANIMATIONS
**************************/

@keyframes up {
	50% {
		transform: translate(0px, -10px);
	}
}

@keyframes down {
	50% {
		transform: translate(0px, 10px);
	}
}


/******************
NAV THROUGHOUT
******************/
.next-unit:hover {
	transform: scale(1.3);
}

.next-unit:hover i {
	animation: down 1s ease infinite;
}



/*****************************
MAIN SCREEN
******************************/
.wrapper {
	height: 100vh;
	background-image: linear-gradient(to bottom right, #002F6C, rgba(0,0,0,0.8)), url("/Portals/1/Interactive/2019/05-military-units/backgrounds/navy-camo.jpg");
	background-size: cover;
	background-repeat: no-repeat;
}

.wrapper .dgov-grid {
	margin: 0;
}

.left-seal {
	text-align: right;
}

.right-seal {
	text-align: left;
}

.top-description {
	padding-bottom: 10px;
}

.top-description p {
	text-transform: uppercase;
	font-size: 18px;
	font-weight: 600;
	letter-spacing: 2px;
	margin-bottom: 0;
}

.top-description p::before {
	content: "";
    display: inline-block;
    border-top: 3px solid #FFB81C;
    width: 2rem;
    margin: 0 1rem;
    transform: translateY(-6px);
}

.top-description p::after {
	content: "";
    display: inline-block;
    border-top: 3px solid #FFB81C;
    width: 2rem;
    margin: 0 1rem;
    transform: translateY(-6px);
}

.wrapper hr {
	border: 4px solid #FFB81C;
    width: 600px;
    margin: 0 auto; 
}

.loader-content {
	color: #fff;
	text-align: center;
	display: flex;
	justify-content: center;
	flex-direction: column;
	height: 100vh;
}

.loader-content h1 {
	color: #fff;
	font-size: 8rem;
	font-weight: 800;
	margin-bottom: 0;
	letter-spacing: 8px;
	text-shadow: 6px 6px #998542;
}

.unit-blurb {
	max-width: 1000px;
	min-width: 50%;
    margin: 1.5rem auto .5rem;
	color: #fff;
	padding: 0 2rem;
}

.loader-content p:nth-child(5) {
	margin: 0 auto 3rem;
}

.wrapper .smooth-scroll {
	display: block;
	position: absolute;
	bottom: 0;
	left: 50%;
	transform: translate(-50%, -10%);;
}

.wrapper .smooth-scroll a {
	text-decoration: none;
}

.wrapper .next-unit {
	width: 250px;
	transition: .3s;
}

.wrapper .next-unit span {
	color: #fff;
	font-family: 'Oswald', sans-serif;
	font-weight: 400;
	display: block;
	font-size: 1.5rem;
	transition: .3s;
}

.wrapper i {
	font-size: 70px;
	color: #9EA2A2;
	margin-top: 20px;
	line-height: 0;
	animation: down 1s ease infinite;
}

.responsive-title ul {
	display: inline-flex;
}

.responsive-seal {
	width: 9rem;
	padding-left: 15px;
}

.wrapper .seal {
	width: 175px;
}




/********************************************************
SIDE NAV BAR
*********************************************************/
.side-nav {
	position: fixed;
	top: 50%;
    transition: 0.5s;
    padding: 15px 25px 30px;
    text-decoration: none;
	text-align: center;
    font-size: 40px;
    border-radius: 5px 5px 0 0;
	text-transform: uppercase;
	font-weight: 800;
	cursor: pointer;
	z-index: 999;
	opacity: 0;
}

.side-nav span {
	display: block;
	font-size: 25px;
}

#admin-side-btn {
	right: 0;
	transform: rotate(-90deg) translate(50px, 190px);
	background-color: #998542;
}

#admin-side-btn:hover {
	right: 35px;
	opacity: 1;
}

.admin-side-btn-responsive {
	right: -215px;
	opacity: 1;
}

#admin-side-btn a {
    color: rgba(0, 47, 108, 0.4);
}

#admin-side-btn a:hover {
	color: #002F6C;
	text-decoration: none;
}

#op-side-btn:hover a {
	color: #002F6C;
}

#op-side-btn {
	left: 0;
	transform: rotate(90deg) translate(-50px, 160px);
	background-color: #5d5d5d;
}

#op-side-btn:hover {
	left: 35px;
	opacity: 1;
	background-color: #939393;
}

.op-side-btn-responsive {
	left: -200px;
	opacity: 1;
}

#op-side-btn a {
	color: #493200;
}

#op-side-btn a:hover {
	color: #002F6C;
	text-decoration: none;
}

#op-side-btn:hover a {
	color: #002F6C;
}

.sticky {
	top: 50%;
	opacity: .4;
}

.stick-point {
	position: absolute;
}



/********************************************************
OPERATIONAL or ADMINISTRATIVE
*********************************************************/
.operational {
	background-color: #939393;
	padding: 6rem 2rem;
}

.administrative {
	background-color: #998542;
	padding: 6rem 2rem;
}

.command-options .content {
	text-align: center;
}

.command-options h1 {
	text-transform: uppercase;
	font-weight: 800;
}

.command-options .btn,
.last-section .btn {
	background-color: #fff;
	transition: .3s;
}

.last-section .smooth-scroll {
	text-align: center;
	padding: 30px 0;
}

.operational h1,
.operational .btn,
.last-section .operational-button .btn {
	color: #002F6C;
}

.operational .btn:hover,
.last-section .operational-button .btn:hover {
	background-color: #FFB81C;
	color: #fff;
}

.administrative h1,
.administrative .btn,
.last-section .administrative-button .btn {
	color: #002F6C;
}

.administrative .btn:hover,
.last-section .administrative-button .btn:hover {
	background-color: #002F6C;
	color: #fff;
}

.command-options .content p {
	max-width: 600px;
	color: #fff;
	margin: 0 auto 30px;
}



/*********************************************************
OPS SECTION
*********************************************************/

/**GENERIC**/
#op-side,
#admin-side {
	position: relative;
}

.title-break {
	border-bottom: 5px solid #fff;
	width: 60%;
}

.section {
	padding: 1rem 2rem 5rem;
	position: relative;
}

.section h1 {
	text-transform: uppercase;
	font-weight: 800;
	font-size: 5rem;
	padding-top: 35px;
}

.section h2 {
	text-align: center;
	text-transform: uppercase;
	font-weight: 800;
	font-size: 3rem;
	margin-bottom: 0;
	padding-top: 25px;
}

.command-title {
	color: #fff;
	text-transform: uppercase;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 45px;
}

.arrow {
	width: 50px;
}

.solo {
	position: relative;
	left: 50%;
	transform: translate(-25px, 0);
	padding: 25px 0 0;
}

.both-arrow {
	position: absolute;
	z-index: 999;
}

.bottom {
	left: 50%;
	bottom: -22px;
	transform: translate(-25px, 0);
}

.line {
	height: 400px;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translate(0, -50%);
}

.seal img {
	width: 125px;
	transition: .3s;
}

.seal img:hover {
	transform: scale(1.2);
}

.seal a:hover {
	text-decoration: none;
}

.seal a:hover p {
	color: #FFB81C;
}

.sub-blurb,
.ending-blurb {
	color: #fff;
	max-width: 900px;
	margin: 0 auto;
	padding: 25px 1rem 0;
	text-align: center;
}

.ending-blurb {
	padding-bottom: 50px;
}

.top-seal {
	position: relative;
	z-index: 2;
}

.bottom-seal {
	position: relative;
	top: 40px;
	left: -30px;
	z-index: 1;
}

.combatant-grid,
.commander-grid,
.fleet-grid {
	padding: 50px 0;
}

.acronym {
	display: block!important;
	font-weight: 400;
}


/*************FIRST SECTION*************/
.first-section {
	background-color: #939393;
	box-shadow: 0px -5px 15px -5px rgba(0, 0, 0, .6);
}

.first-section h1 {
	color: #002F6C;
	text-align: center;
}

.first-section .sec-def .left-side {
	text-align: center;
}

.first-section .sec-def .left-side img {
	width: 200px;
}

.first-section .sec-def .left-side .title {
	font-family: 'Oswald', sans-serif;
	font-size: 25px;
	text-transform: uppercase;
	color: #002F6C;
	font-weight: 600;
	margin-bottom: 25px;
	padding: 15px 0 0;
}

.first-section .sec-def .right-side p {
	color: #fff;
}

.first-section h2 {
	color: #002F6C;
}

.combatant-grid .seal {
	text-align: center;
}

.commander-grid .seal {
	text-align: center;
}


/*************SECOND SECTION*************/
.second-section {
	background-color: #002F6C;
}

.second-section h2 {
	color: #FFB81C;
}



/*************THIRD SECTION*************/
.third-section {
	background-color: #939393;
	position: relative;
}

.third-section .right-side .both-arrow {
	top: 42%;
	left: -45px;
}

.third-section .right-side .both-arrow .arrow {
	width: unset;
	height: 50px;
}

.third-section h2 {
	color: #002F6C;
	padding-bottom: 15px;
}

.third-section .fleet-grid .seal {
	padding-bottom: 0;
}

.third-section .left-side,
.third-section .right-side {
	text-align: center;
	color: #fff;
}

.third-section .left-side p,
.third-section .right-side p {
	margin: 25px 0;
}

.third-section .right-side {
	background-color: #002F6C;
	margin-left: 50px;
	padding: 1rem 2rem;
}

.third-section .right-side p {
	text-transform: uppercase;
	font-weight: 600;
}

.third-section .right-side p span {
	display: block;
}

.third-section .right-side .fleet-icon {
	display: inline;
	align-self: flex-end;
}

.third-section .fine-print {
	text-transform: none;
	font-size: 14px;
}

.third-section .fleet-title {
	font-family: 'Oswald', sans-serif;
	font-size: 30px;
	font-weight: 600;
	color: #FFB81C;
}

.third-section .responsive-arrow {
	position: absolute;
	top: -48px;
	left: 50%;
	transform: translate(-50%, 0);
}

.task-grid {
	margin: 25px 2rem;
}

.single-task {
	height: 300px;
	position: relative;
}

.single-task::after {
	content:'';
	width: 0;
	height: 0;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translate(0, -50%);
}

.tasks hr {
	border-bottom: 5px solid #FFB81C;
	width: 200px;
}

.task-title {
	color: #fff;
	font-family: 'Oswald', sans-serif;
	font-size: 25px;
	font-weight: 600;
	text-transform: uppercase;
	text-align: center;
	padding: 10px;
	margin-bottom: 0;
}

.task-content {
	color: #fff;
	padding: 15px 30px;
	font-size: 16px;
	line-height: 1.3;
}

#task1 {
	background-color: #002F6C;
}

#task1::after {
	content:'';
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid #19437A;
}

#task2 {
	background-color: #19437A;
}

#task2::after {
	content:'';
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid #325889;
}

#task3 {
	background-color: #325889;
}

#task3::after {
	content:'';
	border-top: 20px solid transparent;
	border-bottom: 20px solid transparent;
	border-right: 20px solid #4C6D98;
}

#task4 {
	background-color: #4C6D98;
}

.third-section .unit-options {
	position: relative;
	margin: 30px 10px 30px 0;
}

.unit-options .unit-list {
	padding: 0;
}

.unit-list .nav-item {
	position: relative;
	cursor: pointer;
	background-color: rgba(255, 255, 255, 0.5);
	padding: 15px;
	text-align: center;
	margin: 0;
	font-size: 16px;
	color: #002F6C;
	font-weight: 800;
	text-transform: uppercase;
	transition: .5s;
}

.unit-list .nav-item a {
	text-decoration: none;
	color: #002F6C;
}

.unit-list .nav-item:hover {
	background-color: #FFB81C;
}

.unit-options .unit-list .unit span {
	display: inline-block;
}

.unit-list .nav-item.active {
	background-color: #002F6C;
}

.unit-list .nav-item.active a {
	color: #fff;
}

.unit-options .unit-list .active::before {
	content: '';
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 20px solid #002F6C;
    position: absolute;
    top: 50%;
    right: -20px;
    transform: translate(0, -50%);
	z-index: 99;
}

.unit-options .unit-list .active::after {
	content: '';
	width: 0;
	height: 0;
	border-top: 20px solid transparent;
    border-bottom: 20px solid transparent;
    border-left: 20px solid #939393;
    position: absolute;
    top: 50%;
    right: -35px;
    transform: translate(0, -50%);
    z-index: 9;
}

.unit-options .unit-info {
	position: relative;
	background-color: #002F6C;
	color: #fff;
}

.unit-info .tab-content .tab-pane {
	padding: 15px 25px 0;
}

.third-section .unit-options .deployable-units-tabs .dgov-col-5 {
	padding-top: 0;
}

.unit-list div:nth-child(1) {
	margin-top: 0;
}

.third-section hr {
	width: 10rem;
	border-bottom: 3px solid #FFB81C;
}

.nav-tabs {
	border-bottom: none;
}



/*************FOURTH SECTION*************/
.fourth-section {
	background-color: #002F6C;
	text-align: center;
}

.fourth-section h2 {
	color: #fff;
	margin-bottom: 0;
}

.fourth-section p {
	color: #fff;
}

.fourth-section .right-side .both-arrow {
	top: 10%;
	left: -35px;
}

.fourth-section .right-side .both-arrow .arrow {
	width: unset;
	height: 50px;
}

.fourth-section .icons {
	padding: 50px 0;
}

.fourth-section .fleet-icon {
	width: 200px;
}

.fourth-section .fleet-icon:nth-child(3) {
	width: 125px;
}

.fourth-section .sailor {
	width: 100px;
}

.vessel-hierarchy {
	background-color: #939393;
	position: relative;
	padding: 25px 30px;
}

.vessel-hierarchy i {
	color: #FFB81C;
	font-size: 50px;
}

.vessel-hierarchy p {
	text-align: left;
}

.vessel-hierarchy img {
	width: 200px;
	padding: 20px 0;
}

.vessel-hierarchy .responsive-arrow {
	position: absolute;
	top: -70px;
	left: 50%;
	transform: translate(-25px, 0);
}

.vessel-hierarchy .vessel-title {
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	color: #fff;
	font-weight: 600;
}

#vessel5 {
	font-size: 22px;
}

#vessel6 {
	font-size: 35px;
}

#vessel7 {
	font-size: 50px;
}



/*********************************************************
ADMIN SECTION
*********************************************************/

/************FIFTH SECTION*********/
.fifth-section {
	background-color: #998542;
	box-shadow: 0px -5px 15px -5px rgba(0, 0, 0, .6);
}

.fifth-section h1 {
	color: #002F6C;
	text-align: center;
}

.fifth-section p {
	color: #fff;
}

.fifth-section .leader-grid {
	margin: 4rem 0 6rem;
}

.fifth-section .leader-grid .flag {
	width: 250px;
	padding-bottom: 50px;
}

.fifth-section .command-header {
	color: #fff;
	font-size: 20px;
	font-weight: 600;
	text-transform: uppercase;
	margin-bottom: 0;
}

.fifth-section .command-title {
	color: #002F6C;
	height: 60px;
	font-family: 'Oswald', sans-serif;
	text-transform: uppercase;
	font-size: 25px;
	font-weight: 600;
}

.first-section .left-side .acronym,
.fifth-section .command-title .acronym {
	font-size: 16px;
	font-family: 'Lato', sans-serif;
	font-weight: 600;
}

.fifth-section .left-side .line {
	border-right: 5px solid #002F6C;
	height: 550px;
	top: 70%;
}

.fifth-section .leader-grid .left-side,
.fifth-section .leader-grid .right-side {
	text-align: center;
}

.fifth-section .leader-grid .left-side {
	padding-right: 2rem;
}

.fifth-section .leader-grid .right-side {
	padding-left: 2rem;
}

.fifth-section .leader-grid .right-side img {
	width: 200px;
	padding-bottom: 25px;
}




/************SIXTH SECTION*********/
.sixth-section {
	background-color: #002F6C;
}

.sixth-section h2 {
	color: #fff;
}

.sixth-section h3 {
	color: #998542;
    text-transform: uppercase;
    font-weight: 800;
    font-family: 'Oswald', sans-serif;
    letter-spacing: 1px;
}

#tab5:checked ~ #content5,
#tab6:checked ~ #content6,
#tab7:checked ~ #content7 {
	display: block;
	transition: .3s;
}

.sixth-section .command-options {
	position: relative;
	text-align: center;
	padding-bottom: 50px;
}

.sixth-section .command-options label {
	cursor: pointer;
	font-family: 'Oswald', sans-serif;
	font-size: 20px;
	background-color: #fff;
	color: #998542;
	text-transform: uppercase;
	padding: 15px;
    margin: 50px 20px;
    border-radius: 10px;
	transition: .3s;
}

.sixth-section .command-options label:hover,
.sixth-section .command-options input:checked + label {
	background-color: #998542;
	color: #fff;
}

.sixth-section .command-options input {
	display: none;
}

.sixth-section .command-options section {
	display: none;
}

.sixth-section .command-options section .sub-blurb {
	text-align: center;
	margin-bottom: 50px;
}

.sixth-section .shore-command {
	padding-bottom: 30px;
}

.sixth-section .shore-command .seal {
	text-align: center;
}

.sixth-section .fleet-icon {
	width: 150px;
	transform: scale(1.3);
	margin: 25px 0 50px;
}

.sixth-section #content7 .type-command div:nth-child(2) .fleet-icon {
	width: 75px;
}

.sixth-section .type-command .command-title {
	font-size: 18px;
}

.sixth-section .type-command .locations a:hover {
	text-decoration: none;
}

.sixth-section .type-command .seal {
	margin-top: 75px;
}

.sixth-section .second-command-title {
	color: #fff;
	text-transform: uppercase;
	font-size: 18px;
	background-color: #998542;
	padding: 5px;
	margin-bottom: 0;
	border-radius: 10px;
	font-weight: 600;
	transition: .3s;
}

.sixth-section .second-command-title i {
	position: relative;
	bottom: 2px;
	font-size: 15px;
	padding-left: 10px;
}

.sixth-section .second-command-title:hover {
	background-color: #fff;
	color: #002F6C;
}

.sixth-section .system-command {
	padding-bottom: 50px;
}


/************LAST SECTION*********/
.last-section {
	background-color: #D6D6D6;
	position: relative;
	padding: 1rem 3rem 5rem;
}

.last-section h2 {
	color: #002F6C;
	padding: 25px 1rem 0;
}

.last-section h3 {
	text-transform: uppercase;
	text-align: center;
	font-weight: 800;
}
.last-section .sub-blurb {
	color: #000;
}

.last-section p {
	color: #fff;
}

.last-section .orders {
	margin: 50px 0;
}

.last-section .orders .left-side {
	background-color: #939393;
	margin-right: 2rem;
	padding: 25px 35px;
}

.last-section .orders .left-side h3 {
	color: #002F6C;
}

.last-section .orders .right-side {
	background-color: #998542;
	margin-left: 2rem;
	padding: 25px 35px;
}

.last-section .orders .right-side h3 {
	color: #002F6C;
}



/**********************************************************************
OTHER UNITS
**********************************************************************/
.other-units {
	background-color: #252525;
	padding-top: 120px;
	padding-bottom: 80px;
	position: relative;
}

.other-units a {
	text-decoration: none;
}

.other-units a:hover img {
	box-shadow: 0 0 10px 5px #fff;
}

.other-units .other-branches {
	text-align: center;
	padding-top: 35px;
}

.other-units h2 {
	color: #fff;
	text-align: center;
	padding: 0 1rem;
}

.other-units p {
	color: #fff;
	text-align: center;
	margin-bottom: 0;
	padding: 0 2rem 5px;
}

.other-branches p {
	text-transform: uppercase;
	font-weight: 700;
	padding-top: 20px;
	color: #fff;
}

#army-seal img,
#marine-seal img,
#air-force-seal img {
	width: 200px;
	border-radius: 50%;
	transition: .5s;
}

#army-seal img:hover,
#marine-seal img:hover,
#air-force-seal img:hover {
	box-shadow: 0 0 10px 5px #fff;
}



/***************************************************************
SOCIAL ICONS
***************************************************************/

.social-top {
	display: inline-flex;
	margin: 0 auto;
}

.social-inner {
	display: flex;
	font-size: 1.4rem;
}
.social-inner a, .social-inner a:link {
	color: #fff;
	text-decoration: none
}
.social-inner a {
	border: 4px #9EA2A2 solid;
	border-radius: 50%;
	width: 65px;
	height: 65px;
	display: flex;
	justify-content: center;
	align-items: center
}
.social-inner a.addthis_button_facebook {
	margin-right: 15px
}
.social-inner a.addthis_button_facebook:hover span {
	color: #fff;
}
.social-inner a.addthis_button_facebook:hover {
	background-color: #3b5998;
	border-color: #3b5998;
}
.social-inner a.addthis_button_facebook {
	transition: all .2s ease-in;
}
.social-inner a.addthis_button_twitter:hover span {
	color: #fff;
}
.social-inner a.addthis_button_twitter:hover {
	background-color: #00aced;
	border-color: #00aced;
}
.social-inner a.addthis_button_twitter {
	padding-top: 2px;
	transition: all .2s ease-in;
}
.social-inner a.addthis_button_email:hover span {
	color: #fff;
	transition: all .2s ease-in;
}
.social-inner a.addthis_button_email:hover {
	background-color: #DD4B39;
	border-color: #DD4B39;
}
.social-inner a.addthis_button_email {
	margin-left: 15px;
	font-size: .9em;
	transition: all .2s ease-in;
}


/***************************************************************
INTERNET EXPLORER ONLY
***************************************************************/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
	.loader-content {
		display: block;
		position: relative;
		top: 100px;
	}
	.wrapper .smooth-scroll {
		bottom: 130px;
		transform: translate(-50%, 30%);
	}
	.solo {
		display: block;
	}
}



/***************************************************************
RESPONSIVE
***************************************************************/

.responsive-title {
	margin: 0;
	padding-bottom: 10px;
	color: #002F6C;
	font-size: 18px;
	font-weight: 800;
}

@media screen and (max-width: 1218px) {
	.bottom-seal {
		top: -75px;
		left: 75px;
	}
}

@media screen and (min-width: 1200px) {
	.responsive-seal {
		display: none;
	}
	.third-section .left-side p {
		margin: 25px 0 10px;
	}
	.responsive-arrow {
		display: none;
	}
}

@media screen and (max-width: 1200px) {
	.wrapper .seal {
		display: none;
	}
	.wrapper .loader-content h1 {
		font-size: 7.5rem;
		margin-top: -8px;
		padding-left: 10px;
	}
	.side-nav {
		padding: 5px 25px 15px;
		font-size: 25px;
		top: 50%;
	}
	.side-nav span {
		font-size: 20px;
	}
	.sticky {
		top: 50%;
	}
	#admin-side-btn {
		transform: rotate(-90deg) translate(50px, 130px);
	}
	#admin-side-btn:hover {
		right: 30px;
	}
	#op-side-btn {
		transform: rotate(90deg) translate(-50px, 110px);
	}
	#op-side-btn:hover {
		left: 35px;
	}
	.top-seal {
		margin-top: -50px;
	}
	.bottom-seal {
		top: 50px;
		left: -50px;
		padding-bottom: 50px;
	}
	.fleet-grid {
		padding: 25px 0;
	}
	.third-section h2 {
		padding-bottom: 15px;
	}
	.third-section .right-side {
		margin: 100px 1rem 0;
	}
	.third-section .right-side .both-arrow {
		display: none;
	}
	.task-grid {
		margin: 25px 1rem;
	}
	.fifth-section .left-side .line {
		display: none;
	}
	.fifth-section .leader-grid .right-side {
		margin-top: 50px;
	}
	.fifth-section .leader-grid .left-side,
	.fifth-section .leader-grid .right-side {
		padding: 15px 2rem;
	}
	.fifth-section .left-side p,
	.fifth-section .right-side p {
		text-align: left;
	}
	.fifth-section .leader-grid {
		margin: 4rem 0 2rem;
	}
	.fifth-section .leader-grid .command-header,
	.fifth-section .leader-grid .command-title {
		text-align: center;
	}
	.last-section .orders .left-side {
		margin-right: unset;
		margin-bottom: 50px;
	}
	.last-section .orders .right-side {
		margin-left: unset;
	}
}

@media screen and (max-width: 1050px) {
	.responsive-title {
		padding-bottom: 30px;
	}
}

@media screen and (min-width: 991px) {
	.vessel-hierarchy .responsive-arrow {
		display: none;
	}
}

@media screen and (max-width: 991px) {
	.command-options h1 {
		font-size: 2rem;
	}
	.commander-grid .seal .bottom-seal {
		padding-bottom: 50px;
	}
	.fourth-section .both-arrow {
		display: none;
	}
	.vessel-hierarchy {
		margin-top: 60px;
		padding: 50px 30px 25px;
	}
	.responsive-arrow img {
		width: 50px;
	}
	.sixth-section .command-options label {
		font-size: 18px;
	}
	.single-task {
		height: 200px;
	}
	.single-task::after {
		top: unset;
		right: unset;
		bottom: 0;
		left: 50%;
		transform: translate(-50%, 0);
	}
	#task1::after {
		border-top: unset;
		border-bottom: 20px solid #19437A;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent; 
	}
	#task2::after {
		border-top: unset;
		border-bottom: 20px solid #325889;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
	}
	#task3::after {
		border-top: unset;
		border-bottom: 20px solid #4C6D98;
		border-left: 20px solid transparent;
		border-right: 20px solid transparent;
	}
}

@media screen and (max-width: 860px) {
	.section h1 {
		font-size: 4rem;
	}
	.unit-info .tab-content .tab-pane {
		padding: 15px 15px 0;
	}
}

@media screen and (max-width: 790px) {
	.wrapper {
		justify-content: center;
		display: flex;
	}
	.responsive-title {
		padding-bottom: 10px;
	}
	.wrapper hr {
		width: 80%;
	}
	.loader-content {
		height: unset;
	}
	.loader-content .unit-blurb {
		text-align: center;
		padding: 0 3rem;
	}
}

@media screen and (max-width: 768px) {
	.sixth-section .command-options label {
		width: 140px;
		margin: 50px 10px;
	}
}

@media screen and (max-width: 710px) {
	.wrapper .next-unit {
		width: unset;
	}
	.loader-content p {
		max-width: unset;
		padding: 0 3rem;
	}
	.first-section h1 {
		text-align: center;
		position: unset;
		font-size: 4rem;
	}
	.section h1 {
		font-size: 3rem;
		padding-top: 45px;
	}
}

@media screen and (max-width: 628px) {
	.sixth-section .command-options label {
		margin: 25px auto;
		width: 200px;
	}
	.sixth-section label {
		display: block;
	}
}

@media screen and (max-width: 568px) {
	.loader-content h1 {
		font-size: 7rem;
	}
}

@media screen and (max-width: 510px) {
	.section h1 {
		font-size: 2.5rem;
	}
}

@media screen and (max-width: 480px) {
	.wrapper {
		height: unset;
		padding: 7rem 0 5rem;
		justify-content: center;
		display: flex;
	}
	.loader-content h1 {
		font-size: 5rem;
	}
	.wrapper .smooth-scroll {
		display: none;
	}
}

@media screen and (max-width: 415px) {
	.wrapper .loader-content h1 {
		font-size: 5rem;
		padding-left: 15px;
		margin-top: 15px;
	}
	.third-section .unit-options .deployable-units-tabs .dgov-col-5 {
		padding-left: 0;
	}
	.single-task {
		height: 225px;
	}
	.unit-list .nav-item {
		margin: 15px 0;
		padding: 8px;
	}
	.unit-options .unit-list .unit {
		font-size: 12px;
		text-align: left;
	}
	.last-section .orders .left-side h3,
	.last-section .orders .right-side h3 {
		font-size: 25px;
	}
}