.communicate-wrap {
	padding: 1em 0;
	margin: 3em 0;
}
input[type='text'],input[type='email'],input[type='password'],
input[type='text']:hover,input[type='email']:hover,input[type='password']:hover,
input[type='text']:active,input[type='email']:active,input[type='password']:active,
input[type='text']:focus,input[type='email']:focus,input[type='password']:focus {
	border-top-style: hidden;
	border-right-style: hidden;
	border-left-style: hidden;
	border-bottom-style: groove;
	background-color: transparent;
}
.email-wrap {
	background-color:white;
	width:70%;
	margin: 0 auto;
	padding:1em;
	
}
.btn-div {
	text-align:right;
}
button[type='button'].send-btn.pure {
	visibility: hidden;
	background-color:transparent;
	height:auto;
	width:auto;
}
button[type='button'].send-btn.pure:disabled:hover {
	background-color:transparent;
	
}

.email-wrap table {width:100%;}
.email-wrap table tr td {vertical-align:middle; padding-top:1em; padding-bottom:1em;}
.email-wrap table tr:last-child td:first-child {vertical-align:top;}
.email-wrap table tr td:first-child{width:20%;}
/*@media *****************************************************/
@media screen and (max-width:980px) {
	.email-wrap {padding:1em 0;width:80%;}
}
@media screen and (max-width:736px) {
	.email-wrap {font-size:.8em;width:95%;}
}
@media screen and (max-width:480px) {
	.email-wrap {font-size:.7em;width:95%;}
	.email-wrap h5 {font-size:1.3em;}
}

/*********************************************************** LOGIN CSS */
.arrow-left {
	text-align:right;
}
.arrow-left svg, .arrow-right svg {
	width:2em;height:2em;
}
.arrow-left svg {
	fill:rgba(219,219,291,.7);
}
.arrow-left svg:hover, .arrow-right svg:hover {
	cursor:pointer;
}
.login-wrap {	
	margin: 6em auto 1em auto;
	padding-left:1em;
}
.entry-grid {
	display:grid;
	grid-template-columns:8fr 1fr;
}
.entry-grid input {
	margin: .5em auto .5em auto;
	width: 90%;
}
.message {
	text-align:center;
	font-size:.8em;
	color:rgba(212,46,18,1);
}
#enter-div, #pwd-input-div {
	display:none;
}

svg.circle-btn {width:3em;height:3em;transform:translateY(1em);}
svg.enter{fill:green; transform:translateX(3em);}
svg.enter.circle-btn {width:5em;height:5em;}

input[type='text'],input[type='email'],input[type='password'],
input[type='text']:hover,input[type='email']:hover,input[type='password']:hover,
input[type='text']:active,input[type='email']:active,input[type='password']:active,
input[type='text']:focus,input[type='email']:focus,input[type='password']:focus {
	border-top-style: hidden;
	border-right-style: hidden;
	border-left-style: hidden;
	border-bottom-style: groove;
	background-color: transparent;
}
button[type='button'].login, button[type='button'].login:hover {
	background-color:transparent;
	border: none;
}

/*@media *****************************************************/
@media screen and (max-width: 980px) {
	.login-wrap {margin: 1em auto 1em;}
}
@media screen and (max-width: 736px) {
	.login-wrap {font-size:.8em;}
	svg.circle-btn {width:3.6em;height:3.6em;}
	input[type='text'],input[type='email'],input[type='password']{font-size:1.05em;}
}
@media screen and (max-width: 480px) {
	.login-wrap, .email-wrap {font-size:.7em;}
	svg.circle-btn {width:4em;height:4em;}
	input[type='text'],input[type='email'],input[type='password']{font-size:1.2em;}
	.entry-grid {grid-template-columns:1fr;}
	.entry-grid .gridbox:last-child {text-align:right;}
	.message {text-align:left;}
}

/*************************************************************** side panel class */
.login-side-panel {
	position: fixed;
	display: none;
	right: 0;
	top: 3em;
	width: 450px;
	height: calc(100% - 3em);
	height:-moz-calc(100% - 3em);
	height:-webkit-calc(100% - 3em);
	background-color: rgba(255,255,255,1);
	background-image:url('../image/login-doorway.png');
	background-repeat: no-repeat;
	background-size:cover;
	border: .5px solid rgba(153,143,36,.5); /* pantone 619  green*/;
	overflow-y: auto;
/*	transform: translateX(100%);*/
	transition: transform 0.2s ease-in-out, visibility 0.2s ease-in-out;
	z-index: 19;
}
.login-side-panel .photoby {
	position:fixed;
	bottom:0;
}
/*@media *****************************************************/
@media screen and (max-width: 480px) {
	.login-side-panel {width: 320px;}
}