/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

/*
	Name: login.css
	Description: Styles used on elements found on the new login screen
	Date Created: 01/03/2020 #18383 John Salman
	Modified:
*/

html, body {
	width: 100%;
	overflow-x: hidden;
	min-height: 100%;
	font-family: 'Open Sans', sans-serif;
}

body {
	background-image: -o-linear-gradient( rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) ), url("../images/BG-login.jpg");
	background-image: -webkit-gradient( linear, left top, left bottom, from(rgba(0, 0, 0, 0.3)), to(rgba(0, 0, 0, 0.3)) ), url("../images/BG-login.jpg");
	background-image: linear-gradient( rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3) ), url("../images/BG-login.jpg");
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	margin: 0;
	color:#003263;
	font-family: 'Open Sans', sans-serif;
}

.flex-row
{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.flex-row.flex-wrap
{
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.flex-col
{
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.flex-col.flex-center-vertical
{
  -webkit-box-pack: center;
     -ms-flex-pack: center;
   justify-content: center;
}

a {
	color: #003263;
}

a:hover {
	color: #549DCC;
}

a:focus {
	color: #549DCC;
}

div#content-wrapper {
	width: 95vw;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: auto;
    margin-top: 8vh;
    background-color: #ffffff;
    min-height: 88vh;
    height: auto;
    height: intrinsic;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

div#content-wrapper.no-flex {
	display:block;
}

li.nodot {
	list-style-type: none;
}

div.signup-footer {
	color: #FFFFFF;
	font-size: 0.8rem;
	margin-top:10px;
	text-align: center;
	width: 100%;
}

.wrapper-border {
	-webkit-box-shadow: 4px 6px 5px rgba(0, 0, 0, 0.5);
	        box-shadow: 4px 6px 5px rgba(0, 0, 0, 0.5);
	border-radius: 2px;
}

div#login-wrapper, div#news-wrapper {
/*	height: 63vh;*/
	min-height: 587px;
	max-height: 63vh;

	overflow-x: hidden;

	background: white;

	display: -webkit-box;

	display: -ms-flexbox;

	display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
}

div#signup-wrapper {
	overflow-y: hidden;
}

.signup-wrapper {
	border-right: 1px solid #C8C8C8;
	width: 33vw;
	-webkit-box-flex: 1;
	    -ms-flex: 1 1 33vw;
	        flex: 1 1 33vw;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	padding: 0 35px;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

ul#sectionSelection {
	overflow-x:wrap;
}

.signup-wrapper:last-child
{
	border: none;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}

img#signup-logo {
	width: 57.5%;
	max-width: 264px;
	height: auto;
	min-height: auto;
	margin: 0 auto;
	padding-top: 12%;
}

/*div.signup-welcome {
	padding-top:6%;
}*/

span.signup-welcome-bold {
	color:#003263;
	font-weight: bold;
}

h1#signup-title {
	padding-top: 6%;
}

h1#signup-title {
	width: 100%;
	padding-top: 12%;

	text-align: center;
	font-family: roboto-slab, sans-serif;
	font-size: 35px;
	font-weight: normal;
	color: #549DCC;
}

form#signup-form {
	width: 82%;

	margin: 0 auto;
	padding-top: 8%;
}

div.signup-form-header {
	color: #407aa0;
	font-size: 28px;
	line-height: 28px;
    margin-bottom: 20px;
}

div.confirmation-form-header {
	color: #549DCC;
	font-size: 28px;
	/*margin-top: 20px;*/
	margin-bottom: 20px;
}

img.lab-icon-confirm {
	float: left;
    padding-right: 5px;
    padding-top: 4px;
}

div.question-header {
	color: #549DCC;
    font-size: 28px;
    margin-bottom: 20px;
}

h1.confirmation-header {
	color: #003263;
	font-size: 28px;
}

div.question-answer-row {
	min-height: 250px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    -webkit-box-pack: normal;
        -ms-flex-pack: normal;
            justify-content: normal;
    margin-bottom: 10px;
}

div.example-question {
	border: 1px solid #D9D8D8;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	margin-bottom: 10px;
	width: 50%;
}

div.example-question p {
	padding-left: 20px;
    padding-right: 20px;
}

p.question {
	padding-left:20px;
	padding-top:15px;
}

div.example-answer {
	background-color: #F3F3F3;
	margin-bottom: 10px;
	margin-right: 40px;
	padding-right: 20px;
	width: 50%;
}

div.answer {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

div.answer {
	color: #7D7D7D;
	font-size: 16px;
	font-weight:700;
	padding-top: 10px;
	padding-left:20px;
}

div.example-answers {
    margin-top: 62px;
}



/*div.signup-form-header-section-form {
	margin-top: 2%;
	margin-left:auto;
	margin-right:auto;
	padding-top: 2%;
	width: 90%;
	padding-left:5%;
	padding-right: 5%;
	min-height:100px;
}

div.signup-form-header-section-school {
	min-height: 100px;
	margin-top: 2%;
    padding-top: 2%;
}*/


.header-row
{
	padding: 15px 35px 45px 35px
}

.header-row .flex-col
{
	-webkit-box-flex: 0;
	    -ms-flex: 0 0 calc(100% / 3);
	        flex: 0 0 calc(100% / 3);
}

.header-row a:hover
{
	color: #0056b3;
}

.content-row
{
	-webkit-box-flex: 1;
	    -ms-flex: 1 1 100%;
	        flex: 1 1 100%;
	position: relative;
}

.signup-logo
{
	padding: 10px 10px 10px 0;
}

.signup-form
{
	height: 100%;
   /* -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;*/
}

.signup-form-block {
	margin: 20px 0;
}

/*.margin-bottom-295
{
	margin-bottom: 295px;
}*/

.narrow-block
{
	margin-left: 10px;
	max-width: 450px;
	width: 100%
}

.signup-form-label
{
    font-size: 12px;
	font-family: open-sans, sans-serif;
}

.narrow-block .signup-form-label
{
	margin-top: 5px;
	position: relative;
	top: 5px;
}

.radio-control
{
	color: #000;
}

div.signup-form-row {
	/*border-right: 1px solid #C8C8C8;
	padding-top: 2%;
	width: 90%;
	padding-left:5%;
	padding-right: 5%;*/
	padding: 0 20px;
}

div.signup-form-row.extended-col {
	-webkit-box-flex: 1;
	    -ms-flex: 1 1 100%;
	        flex: 1 1 100%;
}

/*div.signup-form-row.padding-bottom {
	min-height: 55px;
}*/

div.signup-form-row.no-right-border {
	border:0;
}

div.signup-form-row.small-field {
	width: 40%;
	padding:0
}

div.signup-form-row.no-left-pad {
	padding-left:0;
}

div.signup-form-label-right {
	color: #999999;
}

div.signup-form-input input {
	border: 1px solid #CBCBCB;
	height: 36px;
	margin-top: 5px;
	width: 100%;
}

div.split-label {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	/*width:90%;*/
}

label.signup-form-label {
	color: #003263;
	font-family: open-sans, sans-serif;
	font-size: 12px;
}

h1.signup-header {
	color: #003263;
	font-size: 28px;
	padding-top:14px;
}

div.final-row {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	margin-top: 10px;
	padding-top: 20px;
}

div.final-row.login-line {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	width:100%;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

div.final-row.full-center {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

div.final-logo {
	padding-left: 20px;
}

h1.final-header {
	color: #003263;
	font-size: 28px;
	float:right;
}

div.final-links {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: distribute;
	    justify-content: space-around;
	min-height:100px;
	padding-left: 35%;
    padding-right: 3%;
    width: 55%;
}

div.final-congrats {
	color: #549DCC;
	font-size: 28px;
	text-align:center;
	width:100%
}

div.final-info {
	width:100%;
}

div.final-info p {
	color: #003263;
	text-align:center;
	width:100%;
}

div.final-user-info {
	color: #003263;
	font-size: 14px;
	font-weight:bold;
	text-align:center;
	width:100%;
}

span.username-display {
	font-size: 24px;
	font-weight: 600;
}

img.lab-icon-final {
	float:left;
	padding-top:4px;
}



li.dd-menu-item {
	padding-left: 4px;
	text-align: left;
}

li.dd-menu-item a {
	color: #003263;
	text-decoration: none;
}

li.dd-menu-item:hover {
	background-color: #003263;
}

li.dd-menu-item:hover a {
	color:#FFFFFF;
}

img.lab-icon {
	float:left;
	padding-right: 5px;
	padding-top: 3px;
}

input.signup-form-input {
	width: inherit;
	height: 30px;
	padding: 4px;
	border: 1px solid #CBCBCB;
}

div.school-select-region {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	width:100%;
	height: 40%;
}

div.school-select-maine .btn-light {
	border: 1px solid #999999;
	background-color: #FFFFFF;
	color: #003263;
	width: calc(100% - 5px);
    font-size: 13px;
    font-weight: 700;
    font-family: open-sans, sans-serif;
    padding: 5px;
    height: 40px;
}

div.school-select-maine .btn-light:hover
{
	background-color: #549DCC;
	border-color: #549DCC;
	color: #fff;
}

div.school-select-maine .btn-light.is-active
{
	background-color: #003263;
	border-color: #003263;
    color: #FFFFFF;
}

div.school-select-left,
div.school-select-right {
	width: 50%;
}

.btn-maine {
	cursor: pointer;
	background-color:#003263;
	color: #FFFFFF;
	text-transform: uppercase;
	font-family: open-sans, sans-serif;
	font-size: 12px;
    padding: 10px 20px;
    min-width: 110px;
    border-radius: 1px;
    border: none;
}

a.btn-finish {
	text-transform: none;
}

.btn-maine:hover {
	background-color: #549DCC;
	color: #FFFFFF;
}

.btn-maine.disabled:hover
{
	background-color: #003263;
	color: #FFFFFF;
}

div.section-selection-container {
	min-height: 70%;
	margin-bottom:20px;
	padding-right: 45px;
}

div.signup-form-row.bottom
{
	padding-bottom: 20px;
}

.validBar {
	color: green;
}

.invalidBar {
	color: rgb(172, 0, 0);
	font-weight: bold;
}

div.signup-form-row.bottom.center {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

/*div.signup-links {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-pack: distribute;
	    justify-content: space-around;
	min-height:100px;
	padding-left: 35%;
    margin-top: 2%;
    padding-top: 2%;
    padding-right: 3%;
    width: 100%;
}*/

.signup-links .flex-row
{
	-ms-flex-item-align: end;
	    align-self: flex-end;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	max-width: 400px;
	width: 100%;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

input.example-text-box {
	width:58%;
}

div.confirmation-wrapper-left {
	width:33%;
}

div.confirmation-wrapper-right {
	width: 66%;
}

div.controls {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
			justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
		align-items: center;
}

div.radio-controls {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	    -ms-flex-direction:column;
	        flex-direction:column;
	font-weight:700;
	min-height: 100px;
	width:100%;
}

p.bold {
	font-weight:700;
}

div.confirmation-form {
	padding: 0 35px 20px 35px;
}

div.confirmation-body {
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	    -ms-flex-direction: column;
	        flex-direction: column;
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
	min-height: 600px;
}

.dropdown-menu {
	width: 100%
  }

  .btn-group{
	background: transparent -o-linear-gradient(top, #FFFFFF 0%, #EFEFEF 100%) 0% 0% no-repeat padding-box;
	background: transparent -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EFEFEF)) 0% 0% no-repeat padding-box;
	background: transparent linear-gradient(180deg, #FFFFFF 0%, #EFEFEF 100%) 0% 0% no-repeat padding-box;
	border: 1px solid #999999;
	border-radius: 5px;
	min-height: 40px;
	-webkit-box-pack: left;
	    -ms-flex-pack: left;
	        justify-content: left;
  }

  .dropdown-toggle {
	  display:-webkit-box;
	  display:-ms-flexbox;
	  display:flex;
	  -webkit-box-pack: justify;
	      -ms-flex-pack: justify;
	          justify-content: space-between;
	  -webkit-box-align: center;
	      -ms-flex-align: center;
	          align-items: center;
	  overflow-x: hidden;
  }

  .btn-95 {
	width: calc(100% - 5px);
    float: right;
  }

  .btn-88 {
	  width: 100%;
  }

.error {
	background-color: rgba(255, 77, 77, 0.44)
}

div.signup-form-row-error {
	margin: 0 auto;
	padding-top: 0.5%;
	width: 100%;
}

div#signup-additional-error {
	margin: 0 auto;
	padding-top: 5.3%;
	padding-bottom: 3%;
}

.signup-form-submit a
{
	line-height: 38px;
}

input#signup-form-submit {
	width: 28%;
	height: 34px;

	margin-top: 4%;

	background-color: #003263;
	border: 1px solid #003263;
	border-radius: 1px;

	font-family: open-sans, sans-serif;
	font-size: 12px;


	color: #FFF;
	text-align: center;

	float: right;

	-webkit-appearance: none; /* Dont use native styling in iOS*/
}

input#signup-form-submit:active {
	background-color: #549DCC;
	border: 1px solid #549DCC;
}

input#signup-form-submit:hover {
	background-color: #549DCC;
	border: 1px solid #549DCC;
}


p#signup-error {
	font-family: open-sans, sans-serif;
	font-size: 14px;
	color: #ff4d4d;
}

div#signup-additional {
	width: 100%;

	padding-bottom: 3%;
	margin-top: auto;

	text-align: center;
}

a.signup-additional-link {
	padding-right: 20px;
	text-decoration: none;
	font-family: open-sans, sans-serif;
	font-size: 13px;
	color: #003263;
}

#courseDropDownText {
	white-space:normal;
}

a.signup-additional-link:hover {
	text-decoration: underline;
}

a.signup-additional-link:focus {
	text-decoration: underline;
}

div#news-wrapper {
	width: 31vw;
	overflow-y: auto;
}

h2#news-title {
	padding-left: 7%;
	padding-top: 5.5%;
	margin: 0;

	font-family: roboto-slab, sans-serif;
	font-size: 28px;
	font-weight: normal;
	color: #549DCC;
}
div#news-content {
	width: 86%;
	-ms-flex-negative: 0;
	    flex-shrink: 0;

	padding-top: 2%;
	margin: 0 auto;

	font-family: open-sans, sans-serif;
	font-size: 12px;
	color: #003263;
}

p#news-update {
	padding-left: 7%;
	padding-bottom: 14%;

	font-family: open-sans, sans-serif;
	font-size: 10px;
	font-style: italic;
	color: #003263;
}

div#news-documents-wrapper {
	width: 88%;

	padding-bottom: 4%;
    padding-left: 7%;

    margin-top: auto;

	font-family: open-sans, sans-serif;
	font-size: 11px;
	font-style: italic;
	color: #003263;
}

h3#news-documents-title {
    margin-bottom: 3px;
	font-family: roboto-slab, sans-serif;
	font-size: 13px;
	font-weight: normal;
	font-style: normal;
	color: #549DCC;
}

a.news-document-link {
	text-decoration: none;
	/*border-right: .85px solid #003263;*/
	padding-left: 0.2em;
	padding-right: 0.5em;
	line-height: 1.7em;
}

/*a.news-document-link:after {
  content: '';
  height: 100%;
  width: 1px;

  position: absolute;
  right: 0;
  top: 0;

  background-color: #000000;
}*/

a.news-document-link:last-child {
	border-right: none;
	padding-right: 0;
}

a.news-document-link:hover {
	text-decoration: underline;
}

a.news-document-link:focus {
	text-decoration: underline;
}

div#copyright {
	width: 100%;
	white-space: pre;
	padding-top: 7.5%;
	padding-bottom: 5px;

	text-align: center;

	font-family: open-sans, sans-serif;
	font-size: 10px;
	color: #FFF;

}

@media only screen and (max-width:1600px)
{
	div.school-select-region {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-pack: justify;
		    -ms-flex-pack: justify;
		        justify-content: space-between;
		height: 20%;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		padding-bottom:20%;
	}

	div.school-select-left {
		width:60%;
		padding-bottom:10px;
	}

	div.school-select-maine button {
		width: 95%;
	}
}

@media only screen and (max-width: 1440px) {
	.header-row, .content-row {
		-webkit-box-orient: vertical !important;
		-webkit-box-direction: normal !important;
		    -ms-flex-direction: column !important;
		        flex-direction: column !important;
		-webkit-box-pack: start;
			-ms-flex-pack: start;
			justify-content: flex-start;
	}

	.header-row .flex-col {
		-webkit-box-flex: 0;
		    -ms-flex: none;
		        flex: none;
	}

	.signup-wrapper {
		width: 100%;
		border: none;
		-webkit-box-flex: 0;
		    -ms-flex: none;
		        flex: none;
	}

	div.question-header {
		padding: 0 35px 20px 35px;
	}

	div.example-questions {
		padding: 0 35px 20px 35px;
	}
}

@media only screen and ( max-width: 1250px)
{
	div#content-wrapper {
		width: 78vw;
	}

	/* div#signup-wrapper {
		width: 31vw;
	} */

	div.confirmation-wrapper-left {
		width:100%;
	}

	div.confirmation-wrapper-right {
		width:100%;
	}

	div#news-wrapper {
		width: 43vw;
	}
}

@media only screen and ( max-width: 1024px )
{
	body {
		-webkit-text-size-adjust: 100%;
		-ms-text-size-adjust: 100%;
	}

	div#content-wrapper {
		width: 100%;

		-webkit-box-orient: vertical;

		-webkit-box-direction: normal;

		    -ms-flex-direction: column;

		        flex-direction: column;

		padding-top: 1%;
	}


	div#signup-wrapper, div#news-wrapper {
		/*width: 90%;*/
		margin: 15px auto;
		overflow-y: visible;
		max-height: none;
	}

	span.signup-welcome-bold {
		color:#003263;
	}

	img.signup-logo {
		padding-bottom: 6%;
	}

	h1#signup-title {
		padding-top: 6%;
	}

	form#signup-form {
		padding-top: 0;
	}

	div#news-documents-wrapper {
		padding-bottom: 19px;
	}

	div#copyright {
		padding-top: 2.5%;
		padding-bottom: 1%;
	}
}
