/*
 * Undergrad Term Refund Ranges Display
 */

.landing-page .center-list {
    margin-bottom: 2rem;
	width: 100%;
	padding-left: 0;
	margin-left: 0;
}

#undergrad-step1-buttons {
	width: 100%;
}

#undergrad-step1-buttons li:after {
	background: none;
}

#term-dates {
    display: none;
	font-weight: bold;
 	font-size: 20px;
}


/*
 * Summer Class Refund Calculator
 */

#last-drop-date {
	font-weight: bold;
}

.tab-panel h3 {
	margin: 3rem 0 2rem 0
}

.tab-panel h4 {
	margin: 0 0 2rem;
}

#hours-terms-form {
    text-align: center;
}

.form-section {
	margin: 1.5rem 0;
}

.form-section ul {
	width: 25rem;
	/*margin: 0 auto;*/
}

.tab-panel .content-left {
	text-align: left;
}

.tab-panel .content-left ul {
	margin: 0;
}


.tab-panel h4 {
	font: 26px "Poppins Bold",Impact,sans-serif;
	color: #4e2a84;
}

/* start with the first steps visible only */

.form-section {
	display: none;
}

#undergrad-step1,
#grad-step1,
#summer-step1 {
	display: block;
}

.content a.button.active {
	background: #B6ACD1;
}

#summer-session-form {
	text-align: left;
}

#summer-last-drop-date {
	font-weight: bold;
}










.date-picker {
	width: 70px;
	padding: 2px 4px;
}

#cascade-emulator-outer {
	background-color: #4E2A84;
	padding: 35px 75px;
}

#cascade-emulator {
	background-color: #401F68; /* #cbe2fa  #cbe2fa */
	padding: 20px 20px 10px 135px;
	clear: both;
	color: #FFF;
}

#cascade-emulator  .field {
	margin: 0 0 25px;
	clear: both;
	min-height: 10px;
}

#cascade-emulator label {
	float: left;
	font-weight: 600;
	margin-right: 20px;
	width: 120px;
	display: inline-block;
}

#cascade-emulator  .field input {
	padding: 3px 6px;
	float: left;
	display: inline-block;
	border: 1px solid #B7B7B7;
	border-radius: 3px;
}

#cascade-emulator h3 {
	font-weight: 600;
	/*color: #002255;*/
	color: #FFF;
	margin-bottom: 17px;
}

#cascade-emulator .required {
	color: #D85820;
}



#refund-calc {
	min-height: 335px;
}

#refund-calc:after {
	content: "";
	display: table;
	clear: both;
	line-height: 0;
	height: 0;
	overflow: hidden;
}

/*
#refund-calc p {
	padding: 0 .8em;
}
*/

#refund-calc .column-left {
	display: inline-block;
/*
	float: left;
	width: 50%;
*/
	margin: 0 3px 0 0;
	min-height: 196px;
}

#refund-calc .column-right {
	display: inline-block;
/*
	float: left;
	width: 50%;
*/
	margin: 0 0 0 0;
	min-height: 196px;
}


/*
#refund-calc .column-1,
#refund-calc .column-2,
#refund-calc .column-3 {
	display: inline-block;
	  float: left;
	width: 36%;
	margin: 0 0 0 0;
}

#refund-calc .column-3 {
	width: 23%;
}

#refund-calc .column-1 {
	margin: 0 0 0 3%;
}
*/

/*
#refund-calc fieldset {
	border: 0 none;
	margin-bottom: 0;
	padding: 1.7em .7em;
}
*/


#refund-calc  #days-count {
/*
	text-align: center;
	padding: 0 0 2em;
*/
	display: none;
}

#last-drop {
	text-align: center;
	display: none;
}

#refund-calc #days-count {
	margin-bottom: 3px;
}

#refund-calc #days-count span {
	display: inline-block;
	/*margin: 0 0 -8px;*/
}

#refund-calc .result-box {
/*	padding: .5rem 1rem;*/
/*	border: 2px solid #F0F0F0;*/
	min-width: 46px;
	display: inline-block;
	font-weight: bold;
}

#refund-calc .required {
	color: #D85820;
}

#refund-calc .warning {
	color: #D85820;
	text-align: center;
	padding-top: 5px;
}

#refund-calc .info {
	color: #81009B;
	font-size: 107%;
	font-style: italic;
	text-align: center;
	padding-top: 5px;
	}


#action-calc {
/*	text-align: center;*/
    margin-top: 2rem;
}



.calc-header {
	margin: 1.5em 0 .5em 0;
    font-weight: bold;
    text-align: center;
}


#refund-left, #refund-right {
    float: left;
    width: 48%;
}
#refund-right {
    margin-left: 1rem;
}


#refund-calc.class input:focus,
#refund-calc.term input:focus {
	outline: none;
 	border-color: #B6ACD1;
 	box-shadow: 0 0 10px #B6ACD1;
}



#refund-calc table {
    border: 2px solid #f0f0f0;
    margin-top: 0;
}

#refund-calc table td {
    border: 2px solid #f0f0f0;
    padding: .5rem 1rem;
	text-align: center;
}

#refund-calc table td:nth-child(1) {
	border-right: 0 none;
}

#refund-calc table td:nth-child(2) {
	border-left: 0 none;
	border-right: 0 none;
}

#refund-calc table td:nth-child(3) {
	border-left: 0 none;
}

/*
#refund-calc table {
	background: #F3F3F3;
	width: 92%;
 	margin: 0 4% 1.5em;
	border-radius: 3px;
}

#refund-calc table td {
	text-align: center;
	border-right: 0 none;
	border-bottom: 1px solid #E5E5E5;
}
*/

/*#refund-calc table td:nth-child(3) {*/
	/*text-align: center;*/
/*}*/

/*
#refund-calc table td:last-child {
	text-align: right;
}

#refund-calc table tr:last-child td {
	border-bottom: 0 none;
}
*/

#refund-calc .label-secondary {
  font-size: 11px;
  display: block;
  padding-left: 0;
}

#refund-calc .label-secondary {
  display: block;
  font-size: 12px;
  color: #858585;
/*  text-align: center;*/
  padding-right: 3em;
}

#withdrawal-form {
	border-radius: 5px 5px 0 0;
}

.web-form input[type="text"] {
    width: 90%;
    min-width: initial;
}

#refund-calc #refund-ranges {
	border-radius: 0 0 0 5px;
	display: none;
}

#refund-calc  #last-drop {
	border-radius: 0 0 5px 0;
	display: none;
}

.error_box, .review_box {
	padding: 0px 50px 28px;
	color: #D85820;
	display: none;
	clear: both;
    background: url('/sfs/css/images/error.svg') no-repeat 2px 8px;
    background-size: 28px;
}

.icon-info, .icon-error {
	margin: 0 5px 5px 0;
}

.term #withdrawal-form, .term #refund-ranges, .term #last-drop, .term #days-count {
	margin-bottom: 0;
}

.class #withdrawal-form, .class #refund-ranges, .class #last-drop, .class #days-count {
	margin-bottom: 0;
}

#refund-ranges, #last-drop {
	min-height: 190px;
}

/* date-picker */
.lw-dp {
  position: absolute;
  z-index: 100;
  overflow: hidden;
  cursor: default;
  width: 195px;
  background: #f9f9f9;
  border-width: 1px;
  border-style: solid;
  border-color: #AAAAAA;
  padding: 4px;
  margin: 5px;
  font-family: "Akkurat Pro Bold", Arial, sans-serif;
  -moz-user-select: none;
  -webkit-user-select: none;
  -o-user-select: none;
  user-select: none;
  -moz-box-shadow: rgba(0, 0, 0, 0.3) 0 2px 8px;
  -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 2px 8px;
  -o-box-shadow: rgba(0, 0, 0, 0.3) 0 2px 8px;
  box-shadow: rgba(0, 0, 0, 0.3) 0 2px 8px;
}
.lw-dp-hidden {
  display: none;
  box-shadow: none;
}
.lw-dp-toolbar {
  text-align: center;
  overflow: hidden;
  font-size: 12px;
  line-height: 18px;
  color: #494949;
  padding: 0 0 2.2px;
}
.lw-dp-month {
  display: inline-block;
  width: 120px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
    color: #4E2A84;
}
.lw-dp-previous,
.lw-dp-next {
  position: absolute;
  overflow: hidden;
  top: 8px;
  width: 0;
  height: 0;
  color: #b9b9b9;
  cursor: pointer;
  border-top: 5.938px solid transparent;
  border-bottom: 5.938px solid transparent;
}
.lw-dp-previous {
  left: 8px;
  border-right: 11.875px solid #4E2A84;
}
/*
.lw-dp-previous:hover {
  border-right-color: #494949;
}
*/
.lw-dp-previous:active {
  border-right-color: #acacac;
}
.lw-dp-next {
  right: 8px;
  border-left: 11.875px solid #4E2A84;
}
/*
.lw-dp-next:hover {
  border-left-color: #494949;
}
*/
.lw-dp-next:active {
  border-left-color: #acacac;
}
.lw-dp-dows {
  padding: 0;
  margin: 0;
  overflow: hidden;
}
.lw-dp-dows li,
.lw-dp-week li {
  display: block;
  float: left;
  padding: 0;
  margin: 0;
  text-align: center;
  color: #494949;
}
.lw-dp-dows li {
  font-size: 9px;
  line-height: 7.7px;
  width: 26px;
  height: 8.47px;
  background: #f9f9f9;
  border-width: 0;
  border-left-width: 1px;
  border-style: solid;
  border-color: #f9f9f9;
  padding: 0;
  margin: 0;
}
.lw-dp-week {
  padding: 0;
  margin: 0;
  overflow: hidden;
}
.lw-dp-week li {
  padding: 0;
  margin: 0;
  border-width: 0;
  font-size: 14px;
  width: 26px;
  height: 26px;
  line-height: 26px;
  background: #E4E0EE;
  border-left-width: 1px;
  border-top-width: 1px;
  border-style: solid;
  border-color: #f9f9f9;
  cursor: pointer;
}
.lw-dp-dows-last-column,
.lw-dp-week-last-column {
  border-right-width: 1px;
}
.lw-dp-lastweek li {
  padding: 0;
  margin: 0;
  border-bottom-width: 1px;
}
.lw-dp-firstweek li:first-child {
  -moz-border-radius: 4px 0 0 0;
  -webkit-border-radius: 4px 0 0 0;
  -o-border-radius: 4px 0 0 0;
  -ms-border-radius: 4px 0 0 0;
  -khtml-border-radius: 4px 0 0 0;
  border-radius: 4px 0 0 0;
}
.lw-dp-firstweek li:last-child {
  -moz-border-radius: 0 4px 0 0;
  -webkit-border-radius: 0 4px 0 0;
  -o-border-radius: 0 4px 0 0;
  -ms-border-radius: 0 4px 0 0;
  -khtml-border-radius: 0 4px 0 0;
  border-radius: 0 4px 0 0;
}
.lw-dp-lastweek li:first-child {
  -moz-border-radius: 0 0 0 4px;
  -webkit-border-radius: 0 0 0 4px;
  -o-border-radius: 0 0 0 4px;
  -ms-border-radius: 0 0 0 4px;
  -khtml-border-radius: 0 0 0 4px;
  border-radius: 0 0 0 4px;
}
.lw-dp-lastweek li:last-child {
  -moz-border-radius: 0 0 4px 0;
  -webkit-border-radius: 0 0 4px 0;
  -o-border-radius: 0 0 4px 0;
  -ms-border-radius: 0 0 4px 0;
  -khtml-border-radius: 0 0 4px 0;
  border-radius: 0 0 4px 0;
}
.lw-dp-week li:hover {
  background: #4E2A84;
    color: #fff;
}
li.lw-dp-weekend {
  background: #B6ACD1;
    color: #fff;
}
li.lw-dp-today {
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -o-border-radius: 2px;
  -ms-border-radius: 2px;
  -khtml-border-radius: 2px;
  border-radius: 2px;
}
li.lw-dp-today span {
  display: block;
  width: 26px;
  height: 26px;
  line-height: 26px;
  background: #836EAA;
    color: #fff;
/*    border: 1px solid #acacac;*/
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -o-border-radius: 2px;
  -ms-border-radius: 2px;
  -khtml-border-radius: 2px;
  border-radius: 2px;
}
li.lw-dp-today:hover span {
  color: #fff;
}
li.lw-dp-active-day,
li.lw-dp-active-day:hover {
  position: relative;
  color: #FFF;
  background: #4E2A84;
}
li.lw-dp-active-day:nth-child(n),
li.lw-dp-active-day:hover:nth-child(n) {
  background: none;
}
li.lw-dp-active-day::before,
li.lw-dp-active-day:hover::before {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  content: '';
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  -o-border-radius: 2px;
  -ms-border-radius: 2px;
  -khtml-border-radius: 2px;
  border-radius: 2px;
  background: #4E2A84;
  z-index: -1;
}
li.lw-dp-neighbour-month-day {
  color: #afafaf;
}
li.lw-dp-out-of-interval,
li.lw-dp-out-of-interval:hover {
  background: #ececec;
  cursor: default;
}
/* date-picker - custom */
.lw-dp {
  background: #FFF;
}

@media screen and (max-width: 970px) {
    
    #refund-left, #refund-right {
        float: none;
        width: 100%;
    }

    .web-form input[type="text"] {
        width: 50%;
        min-width: initial;
    }    
    
    #refund-right {
        border-top: 5px solid #f0f0f0;
        padding-top: 1.5rem;
        margin-left: 0;
    }
}