body.eg-auth-page {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-family: "Noto Sans", "Object Sans", sans-serif;
    font-size: 15px;
}

body.eg-auth-page a:link, a:visited {
    color: #566db1;
}

.eg-auth-content a.button,
body.eg-auth-page .eg-auth-content a.button {
    background-color: #029b17;
    text-decoration: none;
    color: #fff;
    border-radius: 15px;
    padding: 10px;
    display: inline-block;
    box-sizing: border-box;
    height: auto;
}

.eg-auth-wrapper {
    margin: 0 auto;
    width: 100%;
    max-width: 500px;
    box-sizing: border-box;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 10px;
    text-align: left;
}

.eg-auth-header {
    min-height: 50px;
    text-align: center;
}

.eg-auth-header.no-logo.no-header-template {
    min-height: auto;
    display: none;
}

.eg-auth-header .eg-auth-logo {
    width: 100%;
    height: 80px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    margin-bottom: 20px;
}

.eg-auth-content .steps h2 {
    font-size: 2rem;
    text-align: center;
}

.eg-auth-content .steps .step {
    display: none;
}

.eg-auth-content .steps .step-0 {
    display: block;
    margin-top: 10px;
}

.eg-auth-content .steps small {
    display: block;
    text-align: center;
    margin-top: 10px;
}

.eg-auth-content .steps .step-email h2 span {
    display: none;
}

.eg-auth-content .steps .step-email h2 span.sign-in {
    display: inline-block;
}

.eg-auth-content .steps .step-email.register h2 span.sign-in {
    display: none;
}

.eg-auth-content .steps .step-email.register h2 span.register {
    display: inline-block;
}

.eg-auth-footer {
    opacity: 0.5;
}

.eg-auth-footer .terms-and-conditions {
    text-align: center;
    margin-top: 10px;
}


/* -- Messages --- */
.eg-auth-content .messages .message {
    text-align: left;
    padding: 10px;
    display: none;
    border-radius: 5px;
    margin-bottom: 10px;
    box-sizing: border-box;
    width: 100%;
}

.eg-auth-content .messages .message .icon {
    display: table-cell;
    vertical-align: top;
    padding-right: 10px;
    font-size: 1.2rem;
}

.eg-auth-content .messages .message .message-content {
    display: table-cell;
    vertical-align: top;
    line-height: 1.2rem;
}

.eg-auth-content .messages .message-info {
    background-color: #80cb8a;
    color: #000;
}

.eg-auth-content .messages .message-error {
    background-color: #e44837;
    color: #fff;
}

.eg-auth-content .messages .message-warning {
    background-color: #ffd87d;
    color: #000;
}

.eg-auth-content .messages .message-system {
    background-color: #f0f0f005;
    color: #1f6191;
    font-size: 1.5rem;
    text-align: center;
}

.eg-auth-content .messages .message-system .icon {
    display: none;
}



/* -- Social icons -- */

.thirdparty-line {
	margin: 39px 0 27px;
	font-style: normal;
	font-weight: 700;
	font-size: 14px;
	font-family: "Noto Sans", "Object Sans", sans-serif;
	line-height: 21px;
	text-align: center;
	color: #000
	text-transform: none;
	overflow: hidden;
	white-space: nowrap;	
}
.thirdparty-line span {
	position: relative;
	display: inline-block;
}	
	
.thirdparty-line span::before, .thirdparty-line span::after {
	background-color: #000;
	width: 500px;
	content: "";
	height: 1px;
	position: absolute;
	top: 50%;	
}
	
.thirdparty-line span::before{
	right: 100%;
	margin-right: 20px;
}
.thirdparty-line span::after{
	left: 100%;
	margin-left: 20px;
}	

.eg-auth-content .social-logins-buttons {
    width: 80%;
    margin: 0 auto;
    height: auto;
    display: table;
    box-sizing: border-box;
}

.eg-auth-content .social-logins-buttons > a {
    display: table-cell;
}

.eg-auth-content .social-logins-buttons label {
    display: none;
}

.eg-auth-content .social-logins-buttons.big {
    width: 80%;
    margin: 0 auto;
    height: auto;
    display: grid;
    grid-template-columns: 100%;
}

.eg-auth-content .social-logins-buttons.big label {
    display: inline-block;
}

.eg-auth-content .social-logins-buttons.big button.social-icon {
    width: 90%;
    height: 50px;
    margin-bottom: 10px;
}

.eg-auth-content button.social-icon {
    position: relative;
    width: 48px;
    height: 48px;
    padding: 13px;
    border-radius: 4px;
    margin: 0 12px;
    border: none;
}
  
.eg-auth-content button.social-icon:hover{
    opacity: 0.7;
}

.eg-auth-content button.social-icon > i,
.eg-auth-content button.social-icon > img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin: 0;
    color:#fff;
    font-size: 1.5rem;	
}

.eg-auth-content button.social-icon > img {
    height: 40%;
}

.eg-auth-content .social-logins-buttons.big button.social-icon > img,
.eg-auth-content .social-logins-buttons.big button.social-icon > i {
    left: 20px;
}


.eg-auth-content button.social-icon.login-facebook {
    background-color: #3b5998;
    color: #fff;
}

.eg-auth-content button.social-icon.login-twitter {
    background-color: #1d9bf0;
    color: #fff;
}

.eg-auth-content button.social-icon.login-google {
    background-color: #e44133;
    color: #fff;
}

.eg-auth-content button.social-icon.login-apple {
    background-color: #000;
    color: #fff;
}

.eg-auth-content button.social-icon.login-linkedin {
    background-color: #0a66c2;
    color: #fff;
}
  
  
@media (max-width: 400px) {
    .eg-auth-content .social-logins-buttons {
        width: 80%;
        margin: 0 auto;
        height: auto;
        display: grid;
        grid-template-columns: 100%;
    }

    .eg-auth-content .social-logins-buttons button.social-icon {
        width: 90%;
        height: 50px;
        margin-bottom: 10px;
    }

    .eg-auth-content .social-logins-buttons button.social-icon > i,
    .eg-auth-content .social-logins-buttons button.social-icon > img {
        left: 20px;
    }

    .eg-auth-content .social-logins-buttons button.social-icon label {
        display: inline-block;
    }
}

@media (max-width: 300px) {
    .eg-auth-content .social-logins-buttons label {
        padding-left: 20px;
    }    
}