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

/* ----------------------------------------------------------
    UA Online Responsive CSS
    Version 1.0 - September 27, 2021

    TABLE OF CONTENTS

	01 - BASE STYLES
	02 - BACKGROUND & TEXT COLORS
	03 - BUTTONS
	04 - LAYOUT
	05 - HEADER STYLES
	06 - NAVIGATION STYLES
	07 - CONTENT STYLES
	08 - FORM STYLES
	09 - FOOTER STYLES
	10 - VIDEO PLAYER STYLES
	11 - CONTENT DROPDOWN
	12 - BLOCK QUOTE
    
---------------------------------------------------------- */

/* 01 = BASE STYLES
---------------------------------------------------------- */

body,
html {
	margin: 0;
	overflow-x: hidden;
	transition: background-color .5s;
}

body {
	background-color: #ffffff;
	color: #5e5249;
	font-family: 'Helvetica', 'Arial', 'Verdana', sans-serif;
	font-size: 62.5%;
}

h1 {
	font-size: 36px;
}

h2 {
	font-size: 26px;
}

h3 {
	font-size: 22px;
}

p {
	font-size: 20px;
	line-height: 1.4;
}

sub {
	vertical-align: sub;
	font-size: 12px;
}

.left,
.align-left {
	float: left;
}

.right,
.align-right {
	float: right;
}

.center,
.align-center {
	text-align: center;
}

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

.cf:after {
	content: "";
	display: table;
	clear: both;
}

/* 02 = BACKGROUND & TEXT COLORS
---------------------------------------------------------- */

.bkgd-white {
	background-color: #ffffff;
}

.bkgd-red {
	background-color: #990000;
}

.bkgd-dark-gray {
	background-color: #2f2d2b;
}

.bkgd-light-gray {
	background-color: #dddddd;
}

.bkgd-lighter-gray {
	background-color: #eeeeee;
}

.font-color-white {
	color: #ffffff;
}

.font-color-dark-gray {
	color: #2f2d2b
}

.font-color-red {
	color: #990000;
}

/* 03 = BUTTONS
---------------------------------------------------------- */

.button {
	background-color: #990000;
	color: #ffffff;
	padding: 15px 32px;
	text-align: center;
	display: inline-block;
	font-size: 20px;
	margin: 4px 2px;
	cursor: pointer;
	width: 34%;
	float: none;
	border: 2px solid #ffffff;
}

.button:hover {
	border: 2px solid #990000;
	background-color: #ffffff;
	color: #990000;
}

.button a {
	color: #ffffff;
}

.button:hover a {
	color: #990000;
}



/* 04 = LAYOUT
---------------------------------------------------------- */

.global-width, .section-width {
	margin: 0 auto;
	position: relative;
	width: 1045px;
}

.wrapper {
	height: 100%;
	left: 0;
	position: relative;
	width: 100%;
	-webkit-transition:  left 0.4s ease-in-out;
	-moz-transition:  left 0.4s ease-in-out;
	-ms-transition:  left 0.4s ease-in-out;
	-o-transition:  left 0.4s ease-in-out;
	transition:  left 0.4s ease-in-out;
}

/* 05 = HEADER STYLES
---------------------------------------------------------- */

.logo_wrap {
	margin: 0;
	padding: 15px 30px 15px 30px;
}

.logo {
	display: inline;
}

.logo img {
	height: 40px;
}

.logo-phone-number {
	font-size: 22px;
	font-weight: bold;
	color: #ffffff;
	display: inline;
	padding-top: 8px;
}

.logo-phone-number a {
	color: #ffffff;
}

.logo-phone-number img {
	margin-right: 7px;
	height: 18px;
}

/* 07 = CONTENT STYLES
---------------------------------------------------------- */

#hero-01 {
	width: 100%;
	background-size: cover;
	overflow: hidden; 
	background-repeat: no-repeat;
	background-color: #000000;
	background-image: linear-gradient(rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), url("https://online.ua.edu/landing/_images/hero-01.jpg");
}

.hero-01-overlay-wrapper {
	float: right;
	width: 62%;
	margin-top: 2%;
	margin-bottom: 5%;
}

.hero-01-overlay a	{
	color: #ffffff;
}

.padded-multiline { 
	padding: 2px 0; 
	margin: 0 0 2% 0;
	overflow: hidden;
}

.padded-multiline span {
	display: inline;
	padding-top: 0.275rem;
	padding-bottom: 0.275rem;
	padding-left: 0.6rem;
	padding-right: 0.6rem;

	/* Needs prefixing */
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.padded-multiline h1 {
	line-height: 1.5;
	text-transform: uppercase;
	font-size: 52px;
	margin-bottom: 15px;
	margin-right: 0;
}

.padded-multiline h2 {
	line-height: 1.510;
	font-size: 20px;
	margin-left: 0;
	margin-right: 0;
	margin-top: 0;
	margin-bottom: 5px;
}

.padded-multiline h3 {
	line-height: 1.510;
	font-size: 18px;
	margin-left: 0;
	margin-right: 0;
	margin-top: 0;
	margin-bottom: 5px;
}

.padded-multiline p {
	line-height: 1.61;
	font-size: 17px;
	padding-left: 11px;
	margin-right: 0;
}

.padded-multiline a {
	color: #ffffff;
}

#section-horizontal-center {
	background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url("https://online.ua.edu/landing/_images/graduation-bkg.jpg");
	background-size: cover;
	width: 100%;
	overflow: hidden; 
	background-repeat: no-repeat;
	background-color: #ffffff;
	padding-top: 0.50%;
	padding-bottom: 3%;
	text-align: center;
}

.padded-multiline-section-horizontal-center { 
	overflow: hidden;
}

.padded-multiline-section-horizontal-center span { 
	background-color: #2f2d2b;
	color: #fff; 
	display: inline;
	padding-top: 0.275rem;
	padding-bottom: 0.275rem;
	padding-left: 0.6rem;
	padding-right: 0.6rem;

	/* Needs prefixing */
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.padded-multiline-section-horizontal-center h2 {
	font-size: 40px;
	margin-top: 30px;
	margin-bottom: 20px;
	line-height: 1.6;
}

.padded-multiline-section-horizontal-center h3 {
	font-size: 32px;
	margin-top: 10px;
	margin-bottom: 30px;
	line-height: 1.8;
}

#section-horizontal-center-1 {
	background-image: url("https://online.ua.edu/landing/_images/paper-bkg.jpg");
	background-size: cover;
	width: 100%;
	overflow: hidden; 
	background-repeat: no-repeat;
	background-color: #ffffff;
	padding-top: 1%;
	padding-bottom: 3%;
	text-align: center;
}

.padded-multiline-section-horizontal-center-1 { 
	overflow: hidden;
}

.padded-multiline-section-horizontal-center-1 span { 
	display: inline;
	padding-top: 0.275rem;
	padding-bottom: 0.275rem;
	padding-left: 0.6rem;
	padding-right: 0.6rem;

	/* Needs prefixing */
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.padded-multiline-section-horizontal-center-1 h2 {
	font-size: 45px;
	margin-top: 30px;
	margin-bottom: 10px;
	line-height: 1.6;
}

.padded-multiline-section-horizontal-center-1 h3 {
	font-size: 40px;
	margin-top: 10px;
	margin-bottom: 30px;
	line-height: 1.8;
}

#section-horizontal-center-1 ul {
	font-size: 20px;
	text-align: center;
	list-style-position: inside;
	line-height: 1.61;
}

#section-horizontal-center-1 a {
	color: #2f2d2b;
}

#section-horizontal-center-2 {
	background-image: url("https://online.ua.edu/landing/_images/red-bkg.jpg");
	background-size: cover;
	width: 100%;
	overflow: hidden; 
	background-repeat: no-repeat;
	background-color: #990000;
	padding-top: 1%;
	padding-bottom: 2%;
	text-align: center;
}

.padded-multiline-section-horizontal-center-2 { 
	overflow: hidden;
}

.padded-multiline-section-horizontal-center-2 span { 
	display: inline;
	padding-top: 0.275rem;
	padding-bottom: 0.275rem;
	padding-left: 0.6rem;
	padding-right: 0.6rem;

	/* Needs prefixing */
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.padded-multiline-section-horizontal-center-2 h2 {
	font-size: 40px;
	margin-top: 30px;
	margin-bottom: 10px;
	line-height: 1.6;
}

.padded-multiline-section-horizontal-center-2 h3 {
	font-size: 32px;
	margin-top: 10px;
	margin-bottom: 30px;
	line-height: 1.8;
}

#section-horizontal-center-2 a {
	color: #ffffff;
}

#section-why-choose {
	background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url("https://online.ua.edu/landing/_images/graduation-bkg.jpg");
	background-color: #000000;
	width: 100%;
	background-size: cover;
	overflow: hidden; 
	background-repeat: no-repeat;
	display: table;
	padding-top: 2%;
	padding-bottom: 2%;
}

.section-why-choose-row {
	display: table-row;
}

.section-why-choose-left {
	float: left;
	width: 47%;
	margin-bottom: 1%;
}

.section-why-choose-right {
	float: right;
	width: 47%;
	margin-bottom: 1%;
}

#section-why-choose img {
	float: left;
	padding-right: 5%;
	padding-bottom: 15%;
	padding-top: 5%;
	width: 10%;
}

#section-why-choose h2 {
	font-size: 22px;
	margin-bottom: 10px;
}

#section-why-choose p {
	font-size: 14px;
	line-height: 20px;
}

#section-horizontal-center-3 {
	background-image: url("https://online.ua.edu/landing/_images/paper-bkg.jpg");
	background-size: cover;
	width: 100%;
	overflow: hidden; 
	background-repeat: no-repeat;
	background-color: #ffffff;
	padding-top: 1%;
	padding-bottom: 3%;
	text-align: center;
}

#section-horizontal-center-3 a {
	color: #2f2d2b;
}

.padded-multiline-section-horizontal-center-3 { 
	overflow: hidden;
}

.padded-multiline-section-horizontal-center-3 span { 
	display: inline;
	padding-top: 0.275rem;
	padding-bottom: 0.275rem;
	padding-left: 0.6rem;
	padding-right: 0.6rem;

	/* Needs prefixing */
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.padded-multiline-section-horizontal-center-3 h2 {
	font-size: 40px;
	margin-top: 30px;
	margin-bottom: 10px;
	line-height: 1.6;
}

.padded-multiline-section-horizontal-center-3 h3 {
	font-size: 32px;
	margin-top: 10px;
	margin-bottom: 30px;
	line-height: 1.8;
}

#section-horizontal-center-4 {
	background-image: url("https://online.ua.edu/landing/_images/red-bkg.jpg");
	background-color: #000000;
	width: 100%;
	background-size: cover;
	overflow: hidden; 
	background-repeat: no-repeat;
	padding-top: 1%;
	padding-bottom: 2%;
	text-align: center;
}

#section-horizontal-center-4 h2 {
	font-size: 40px;
	margin-top: 30px;
	margin-bottom: 10px;
	line-height: 1.6;
}

#section-horizontal-center-4 h3 {
	margin-bottom: -15px;
}

#section-horizontal-center-4 a {
	color: #ffffff;
}

.padded-multiline-section-horizontal-center-4 { 
	overflow: hidden;
}

.padded-multiline-section-horizontal-center-4 span { 
	display: inline;
	padding-top: 0.275rem;
	padding-bottom: 0.275rem;
	padding-left: 0.6rem;
	padding-right: 0.6rem;

	/* Needs prefixing */
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.padded-multiline-section-horizontal-center-4 h2 {
	font-size: 48px;
	margin-top: 30px;
	margin-bottom: 1px;
	line-height: 1.6;
}

.padded-multiline-section-horizontal-center-4 h3 {
	font-size: 42px;
	margin-top: 1px;
	margin-bottom: 1px;
	line-height: 1.8;
}

.grant-container {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	grid-gap: 10px;
	padding: 10px;
}

.grant-container > div {
	text-align: center;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-top: -20px;
	background-color: #ffffff;
}

.grant-container h3 {
	font-size: 32px;
}

.grant-container-2 {
	display: grid;
	grid-template-columns: repeat(1, minmax(0, 1fr));
	grid-gap: 10px;
	padding: 10px;
}

.grant-container-2 > div {
	text-align: center;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-top: -20px;
	background-color: #ffffff;
}

.grant-container-2 h3 {
	font-size: 32px;
}

#section-horizontal-center-5 {
	background-image: url("https://online.ua.edu/landing/_images/paper-bkg.jpg");
	background-size: cover;
	width: 100%;
	overflow: hidden; 
	background-repeat: no-repeat;
	background-color: #ffffff;
	padding-top: 1%;
	padding-bottom: 3%;
	text-align: center;
}

.section-horizontal-center-5-a {
	color: #2f2d2b;
}

.padded-multiline-section-horizontal-center-5 { 
	overflow: hidden;
}

.padded-multiline-section-horizontal-center-5 span { 
	display: inline;
	padding-top: 0.275rem;
	padding-bottom: 0.275rem;
	padding-left: 0.6rem;
	padding-right: 0.6rem;

	/* Needs prefixing */
	box-decoration-break: clone;
	-webkit-box-decoration-break: clone;
}

.padded-multiline-section-horizontal-center-5 h2 {
	font-size: 46px;
	margin-top: 30px;
	margin-bottom: 10px;
	line-height: 1.6;
}

.padded-multiline-section-horizontal-center-5 h3 {
	font-size: 32px;
	margin-top: 10px;
	margin-bottom: 30px;
	line-height: 1.8;
}

#section-video {
	background-image: url("https://online.ua.edu/landing/_images/streak-bkg.jpg");
	background-color: #ffffff;
	width: 100%;
	background-size: cover;
	overflow: hidden; 
	background-repeat: no-repeat;
	display: table;
	padding-top: 1%;
	padding-bottom: 1%;
}

#section-video-left {
	width: 49%; 
	float: left;
}

#section-video-right {
	width: 49%; 
	float: right;
}

#section-video h2 {
	text-align: center;
	font-size: 48px;
	padding-left: 10px;
	padding-right: 10px;
}

#section-video h3 {
	text-align: center;
	font-weight: bold;
	font-style: normal;
	font-size: 28px;
}

#section-video h4 {
	font-weight: bold;
	font-style: normal;
	font-size: 24px;
	margin: 15px 0 15px 0;
}

#section-video p {
	font-style: normal;
	font-size: 16px;
	line-height: 1.4;
}

.ranking-logo-wrapper {
	margin-top: 0px;
}

.ranking-logo {
	text-align: center;
	display: inline-block;
	width: 100%;
}

.ranking-logo img {
	width: 14%;
	padding: 5px;
}

/* 08 = FORM STYLES
---------------------------------------------------------- */

.slate-form {
	float: right;
	margin-right: -30px;
	width: 85%;
}

.slate-form label {
	left: 0;
	top: -500px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.form_label {
	margin-bottom: -7px;
}
		
.slate-form input {
	width: 92%;
	height: 30px;
	box-sizing: border-box;
	border: 2px solid #aaaaaa;
	border-radius: 2px;
	color: #2f2d2b;
	font-size: 13px;
	padding-left: 10px;
	margin-bottom: 2px;
	background: #ffffff;
}

.slate-form textarea {
	width: 92%;
	height: 30px;
	box-sizing: border-box;
	border: 2px solid #aaaaaa;
	border-radius: 2px;
	color: #2f2d2b;
	font-size: 13px;
	padding-left: 10px;
	margin-bottom: 2px;
	background: #ffffff;
}

.slate-form select {
	width: 92%;
	height: 30px;
	box-sizing: border-box;
	border: 2px solid #aaaaaa;
	border-radius: 2px;
	color: #2f2d2b;
	font-size: 13px;
	padding-left: 5px;
	margin-bottom: 2px;
	background: #ffffff;
}

.slate-form fieldset {
	background-color: transparent;
}
		
.action button {
	padding: 10px 15px 10px 15px;
	border: 2px solid #ffffff;
	background-color: #990000;
	color: #ffffff;
	width: 94%;
	font-weight: bold;
	font-size: 16px;
	cursor: pointer;
}

.action button:hover {
	border: 2px solid #990000;
	background-color: #ffffff;
	color: #990000;
}

/* Mobile Phone Number Fields - Some mobile phone fields have different IDs
---------------------------------------------------------- */

.slate-form .form_question_21afd8f5-25c9-402b-9067-95dfdff0a803 {
	margin-left: 10px;
}

.slate-form .form_question_fe04f61e-a7f1-4529-a5f6-3b7a039bb37f {
	margin-left: 10px;
}

/* End Mobile Phone Number Fields
---------------------------------------------------------- */

.slate-form #form_cfc9cbae-b517-47ee-af87-99e790e88a79_country {
 	margin-bottom: 13px; 
}
		
.slate-form #form_cfc9cbae-b517-47ee-af87-99e790e88a79_city {
 	margin-bottom: 13px;
	padding-left: 5px;
}
		
.slate-form #form_cfc9cbae-b517-47ee-af87-99e790e88a79_region {
	margin-bottom: 12px;
	padding-left: 5px;
}
		
.slate-form #form_cfc9cbae-b517-47ee-af87-99e790e88a79_postal {
	padding-left: 5px;
}

/* By providing your number, you consent to receive notifications from UA Online. Reply STOP to unsubscribe. Msg & Data rates may apply. All forms
---------------------------------------------------------- */

.slate-form #form_question_34ea1cd9-837e-4974-a75c-50ed56e8d0ba {
	font-size: 13px;
	padding-bottom: 3px;
	line-height: 1.61;
	width: 93%;
}

.slate-form #form_question_13fc3f7f-f795-417f-bd26-b1369217e928 {
	font-size: 13px;
	padding-bottom: 3px;
	line-height: 1.61;
	width: 93%;
}

.slate-form #form_question_a8752f74-083e-47df-a0e5-32466f8a6b7a {
	font-size: 13px;
	padding-bottom: 3px;
	line-height: 1.61;
	width: 93%;
}

.slate-form #form_question_4cfc6ec2-f033-4a2e-a415-7b4e670be5c7 {
	font-size: 13px;
	padding-bottom: 3px;
	line-height: 1.61;
	width: 93%;
}

.slate-form #form_question_a5b160db-e25b-4404-98a3-b7eb95f235d9 {
	font-size: 13px;
	padding-bottom: 3px;
	line-height: 1.61;
	width: 93%;
}

.slate-form #form_question_8f64a997-b49d-443e-9356-2790e6fcc8f9 {
	font-size: 13px;
	padding-bottom: 3px;
	line-height: 1.61;
	width: 93%;
}

.slate-form #form_question_e39a6538-5113-4154-b380-840578ce7e51 {
	font-size: 13px;
	padding-bottom: 3px;
	line-height: 1.61;
	width: 93%;
}

/* End By providing your number, you consent to receive notifications from UA Online. Reply STOP to unsubscribe. Msg & Data rates may apply. All forms
---------------------------------------------------------- */

/* Form Elements Specific to Slate Form Called Master Conditional Inquiry Form - /get-distance-degree-nclt/
---------------------------------------------------------- */

.slate-form #form_21e890ac-d116-4050-a0d2-0688d500df23_country {
 	margin-bottom: 13px;
}
		
.slate-form #form_21e890ac-d116-4050-a0d2-0688d500df23_city {
 	margin-bottom: 13px;
	padding-left: 5px;
}
		
.slate-form #form_21e890ac-d116-4050-a0d2-0688d500df23_region {
	margin-bottom: 12px;
	padding-left: 5px;
}
		
.slate-form #form_21e890ac-d116-4050-a0d2-0688d500df23_postal {
	padding-left: 5px;
}

/* End Form Elements Specific to Slate Form Called Master Conditional Inquiry Form - /get-distance-degree-nclt/
---------------------------------------------------------- */

.form_question[data-required="1"] .form_responses::before {
	color: #ffffff;
	content: "*";
	font-size: 20px;
	padding-right: 3px;
	margin-top: 5px;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
  color: #000000;
  opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: #000000;
}

::-ms-input-placeholder { /* Microsoft Edge */
  color: #000000;
}

.form-thank-you {
	margin-right: 30px;
}

/* 09 = FOOTER STYLES
---------------------------------------------------------- */

#footer {
	background-color: #2f2d2b;
	padding-left: 30px;
	padding-right: 30px;
	padding-bottom: 80px;
	padding-top: 10px;
	margin: 0;
}

#footer-left {
	float: left;
	width: 47%;
	display: inline;
}

#footer-left p {
	font-size: 12px;
	line-height: 1.4;
	color: #ffffff;
}

.footer a {
	color: #ffffff;
}

.footer ul {
	list-style: none;
	padding: 0;
}

.footer ul li {
	float: left;
	color: #ffffff;
	font-size: 12px;
}

.footer ul li:after {
	content: '|';
	margin-right: 10px;
	padding-left: 10px;
	font-size: 10px;
}

.footer ul li:nth-last-child(1):after {
	content: '';
	margin-right: 0;
	padding-left: 0;
}

#footer-right {
	float: right;
	width: 47%;
	display: inline;
	margin-top: -5px;
}

#footer-right img {
	float: right;
	height: 40px;
}

/* 10 = VIDEO PLAYER STYLES
---------------------------------------------------------- */

.videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

iframe {
	border: 0;
}

/* 11 = CONTENT DROPDOWN
---------------------------------------------------------- */

details {   
    padding: .75em .75em 0;
	margin-top: 10px;
	background: rgba(255, 255, 255, 0.5)
}

summary {	
    margin: -.75em -.75em .75em;
    padding: .75em;
    color: #2f2d2b;
	font-size: 20px;
	cursor: pointer;
}

details[open] {
    padding: .75em;
}

details[open] summary {
    margin-bottom: 10px;
}

/* 12 = BLOCK QUOTE
---------------------------------------------------------- */

.video-bq {
	background: url("https://online.ua.edu/landing/_images/bg-quote1.png") no-repeat;  
    margin: 5px;
    padding: 30px 30px 30px 50px;    
}

.bq {
	background: url("https://online.ua.edu/landing/_images/bg-quote1.png") no-repeat;  
	border-left: 1px dashed #ccc;
    font-style: italic;
    margin: 5px;
    padding: 30px 30px 30px 50px;    
}

.bq-no-border {
	background: url("https://online.ua.edu/landing/_images/bg-quote1.png") no-repeat;  
    font-style: italic;
    margin: 5px;
    padding: 30px 30px 30px 50px;    
}

.no-bq {  
	border-left: 1px dashed #ccc;
    font-style: italic;
    margin: 5px;
    padding: 30px 30px 30px 50px;    
}

.bq-right {
	float: right;
	font-style: normal;
}

.bq-font-size {
	font-size: 16px;
}