.login-tabs-wrapper {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
    justify-content: space-evenly;
    border-bottom: 1px solid #e0e0e0;
    background-color: #fff;
}

.login-tab {
    width: 50%;
    text-align: center;
    position: relative;
    padding: 1rem .375rem;
}

.swap .login-tab--org {
    order: 0;
}

.swap .login-tab--email {
    order: 1;
}

/* pointer events none so parent gets the click */
.login-tab span {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	display: block;
	pointer-events: none;
}

.login-shrunk .login-tab {
	text-align: left;
	width: 100%;
	padding: 1rem;
}

.login-shrunk .login-tabs-wrapper {
	border-radius: 3px 3px 0 0;
}

.login-tab::before {
	content:'';
	-webkit-transform: scale(0);
	-ms-transform: scale(0);
	transform: scale(0);
	-webkit-transition: -webkit-transform .35s ease-in;
	transition: -webkit-transform .35s ease-in;
	transition: transform .35s ease-in;
}

/* z-index required as org panel has pos relative and covers part of the active underline */
.login-tab.is-active::before {
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
    position: absolute;
    width: 100%;
    background-color: #404040;
    height: 3px;
    right: 0;
    bottom: -2px;
	border-radius: 9px;
	z-index: 1;
}

@media (min-width:68.75em) {
    /* big landscape tablets, laptops, and desktops */
    .login-tabs-wrapper {
        display: none;
    }
}