.i-modal {
	display: none;
	position: fixed;
	z-index: 1;
	padding-top: 2.5em;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgba(0,0,0,0.4);
}

.i-modal-content {
	position: relative;
	background-color: #fefefe;
	margin: auto;
	padding: 0;
	border: 1px solid #888;
	width: 60%;
	height: 85%;
	box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
	-webkit-animation-name: animatetop;
	-webkit-animation-duration: 0.4s;
	animation-name: animatetop;
	animation-duration: 0.4s
}

@-webkit-keyframes animatetop {
	from {top:-300px; opacity:0} 
	to {top:0; opacity:1}
}

@keyframes animatetop {
	from {top:-300px; opacity:0}
	to {top:0; opacity:1}
}

/* input[type=text], select, input[type=email], input[type=password] { */
.i-modal-body input, .i-modal-body select {
	padding: 8px 16px;
	border: 2px solid #aaa;
	border-radius: 20px;
}

/* input[type=text]:focus, select:focus, input[type=email]:focus, input[type=password]:focus { */
.i-modal-body input:focus, .i-modal-body select:focus {
	outline : none;
}

.E_container {
	margin-block-start: 1em;
    margin-block-end: 1em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

.error {
	border : 2px solid red;
	padding : 6px;
	border-radius : 10px;
}

.close {
	color: white;
	float: right;
	font-size: 28px;
	font-weight: bold;
}

.close:hover,
.close:focus {
	color: #000;
	text-decoration: none;
	cursor: pointer;
}

.i-modal-header, .i-modal-footer {
	background-color: #ee7b00;
	color: white;
	height : 10%;
	padding: 2px 8px;
}

.i-modal-header {
	position : relative;
}

.i-modal-header h2 {
	position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.i-modal-tabs {
	background-color: #ee7b00;
	color: white;
	width : 100%;
	display : flex;
	text-align : center;
}

.i-modal-tabs .i-modal-button {
	width : 50%;
}

.i-modal-tabs .i-modal-tab {
	width : 50%;
	float : left;
	text-align : center;
	cursor : pointer;
}

.i-modal-tab .active {
	color: lightgrey;
    border-bottom: 1px solid;
    cursor: auto;
}

.i-modal-body {
	height : 82%;
	padding: 2px 8px;
	text-align: center;
	overflow : auto;
}

.i-modal-footer {
	text-align : center;
	display:flex;
	justify-content:center;
	align-items:center;
	position : relative;
}

.i-modal-button {
  background-color: white;
  color: black;
  padding: 4px 8px;
  display: inline-block;
  font-size: 16px;
  margin: 4px 2px;
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
  cursor: pointer;
  border: 2px solid #555555;
}

.i-modal-button:hover {
  background-color: #555555;
  color: white;
}

.i-modal-desc {
	display: block;
    position: absolute;
    height: 90%;
    width: 75%;
    left: 0;
    top: 0;
    text-align: left;
    padding: 1%;
}

.i-modal-desc p {
	
}

.i-button-container {
	display: block;
    position: absolute;
    height: 100%;
    width: 20%;
    right: 0;
    top: 0;
}

.i-button-container .i-modal-button {
	padding: 2px 4px;
    display: block;
    font-size: 15px;
	width: 80%;
	height: 40%;
    margin: 3% 10%;
}