body {
	font-family:"Helvetica Neue",Helvetica,Arial,sans-serif
}
form{
	margin-left:10%;
	margin-right:10%;
	margin-top:3%;
	
}

h1{
	text-align: center;
}

a{
	color:#428bca;
}


.mouseButton{
	border:none;
	outline:none;
	background:none;
	cursor:pointer;
}

.center{
	margin:auto;
}

.div-center{
	margin-left:10%;
	margin-right:10%;
	margin-top:3%;
	text-justify:distribute !important;
	line-height: 140%;
}

.step-div{
	margin:auto;
	display:flex;
	width:75%;
}

.step{
	text-align:center;
	margin:10px;
	padding:15px;
	width:30%;
	color:white;
	background-color: #306A91;
}

.active-step{
	text-align:center;
	margin:10px;
	padding:15px;
	width:30%;
	border-style: solid;
	border-color: #FFD200;
	background-color: #306A91;
	color:white;
}
.num{
	overflow: hidden;
	border-color: #000489;
    background-color: #FFD200;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    text-align: center;
    color: black;
    border-style: solid;
    border-width: thin;
	display:inline-block;
	min-width: 20px;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif
}

.accept{
	color:green;
}

.reject{
	color:red;
}

.wrapper{
	display:flex;
}

.text{
	width:96%;
	margin-left:1%;
}

.inactive{
	
	display:none;
}

.active{
	display:block;
}
.low{
	margin-top:80% !important;
}

.high {margin-top:-450px !important}

/* The Modal (background) */
.modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content/Box */
.modal-content {
  background-color:white;
  margin: 45% auto; /* 15% from the top and centered */
  padding: 20px;
  border: 1px solid #888;
  width: 80%; /* Could be more or less, depending on screen size */
}

/* The Close Button */
.close {
  color: #0B0000;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.debug{
	background-color: antiquewhite;
    border-width: medium;
    border-style: groove;
	font-family: "Helvetica Neue",Helvetica,Arial,sans-serif
}

#localLIHEAPModalLink {cursor:pointer;}
#tribalLIHEAPModalLink {cursor:pointer;}
#localLIHEAPModalLink1 {cursor:pointer;}
#localLIHEAPModalLink2 {cursor:pointer;}
#tribalLIHEAPModalLink1 {cursor:pointer;}
#localLIHEAPModalLink3 {cursor:pointer;}

@media only screen and (max-width: 1200px) {
	#page-title{
		text-align:center !important;
	}
	
	h1{
		font-size: 1.2em;
	}
	
	.modal-content{
		position:sticky;
		top:50%;
	}
	
	.step-div{
		margin:auto;
		display:flex;
	
	}
	
}

@media only screen and (max-width:450px){
	.active-step{
		padding:15px 0px 15px 0px;
		min-width:90px;
	}
	.step{
		padding:15px 0px 15px 0px;
		min-width:90px;
	}
	.step-div{
		
		margin:0px;
	}
	li{
		display:list-item !important;
	}
}