/*Register*/
/*.registration{
padding: 120px 0 240px;
margin: 0 0 60px;
background: linear-gradient(45deg, #1e73b0, #70b4c6);
position: relative;
overflow: hidden;
z-index: 2;
background: url(https://connects.tiao.world/build/assets/AppBundle/img/placeholders/backgrounds/login.b5a57a73.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.registration:after{
content: '';
position: absolute;
background-color: #fff;
display: block;
width: 200%;
height: 205px;
left: 0;
right: 0;
top: 85%;
transform: rotate(-4deg);
}
.registration-heading{
flex-basis: 50%;
padding: 20px 40px;
}*/

.fb-Sign-up {
max-width: 300px;
    margin: 35px auto 0px;
}

.or {
    font-size: 21px;
    font-family: opensans-bold;
    text-align: center;
    padding: 8px;
}
.registration-heading > h1{
color: #fff;
font-size: 3.6rem;
margin-bottom: 2rem;
line-height: 1;
}
.registration-heading > p{
color:#fff;
margin-bottom: 1.6rem;
}
/*.registration-form{
flex-basis: 50%;
position: relative;
background: #fff;
overflow: hidden;
padding: 20px;
max-width: 860px;
box-shadow: 0px 0px 10px 0px #364659;
border-radius: 15px;
margin:auto;
}*/
.section-heading{
border-bottom: 1px dashed lightgrey;
padding-bottom:20px;
/* margin:.5rem;*/
}
.section-heading > h3{
margin: 0;
font-weight: 600;
color: #3c8ab6;
}
.section-info{
padding: 20px 0;
}
.registration-form label{
margin-bottom: .15rem;
font-weight: 500;
}
.grouped{
margin-bottom: 1rem;
position: relative;
}
.grouped.grouped-centered{
text-align: center;
}
.input-custom{
height: 45px;
border: none;
}

/*Code*/
.input-code{
margin: 0 5px;
text-align: center;
line-height: 0;
font-size: 2rem;
border: solid 1px #ccc;
outline: none;
flex: 1;
transition: all .2s ease-in-out;
border-radius: 3px;
border: none;
border: 1px solid lightgrey;
border-radius: 4px;
}
.code-validation-result {
height: 35px;
padding: 5px 7px;
}
.code-validation-result.found{
color:#138513;
}
.code-validation-result.not-found{
color:#f22d2d;
}
.verification-code-info {
font-size: .8rem;
margin: 5px;
color: #666666;
height: 40px;
}
span.verification-timer {
font-weight: 600;
}
.btn-resend {
background: #ffffff;
padding: 3px 10px;
color: #245e34;
font-size: .8rem;
font-weight: 500;
margin: 0 5px;
border: 1px solid;
border-radius: 10rem;
outline: none;
}
.btn-resend:hover{
background: #245e34;
color:#fff;
}


.input-custom:focus,
.input-code:focus{
outline: none;
box-shadow: none;
}
.input-icon{
flex: 95%;
border-radius: 4px;
border:1px solid lightgrey;
}
.input-icon > span:first-child{
height: 100%;
padding: 8px;
border-right: 1px solid lightgrey;
color: #838383;
width: 40px;
text-align: center;
}
.back-img{
max-width: 620px;
width: 100%;
position: absolute;
top: 0;
left: 0;
z-index: 0;
}
.section.hidden{
display: none;
}



/*Buttons*/
div.button{
cursor: pointer;
width: 100%;
padding: 4px 16px;
transition: all 0.25s ease;
max-width: 180px;
}
div.button.back{
max-width: 120px;
}
div.button.action{
visibility: hidden;
}
.btn-step{
background: #f49422;
color: #fff;
border-radius: 10rem;
border:1px solid #f49422;
}
.btn-step:hover{
background: #fff;
color:#f49422;
}
.btn-step i{
font-size: .9rem;
}
.btn-register{
font-size: 1.2rem;
font-weight: 500;
background: #8fcaa3;
color: #23573e;
border-radius: 10rem;
padding: 6px 18px;
border:1px solid #8fcaa3;
}
.btn-register:hover{
background: #fff;
border-color: #23573e;
}
.btn-step i{
font-size: .9rem;
}

/*Successful registration*/
.section.successful-register {
text-align: center;
}
.successful-register .icon{
margin-bottom: 20px;
}
.successful-register .icon i {
font-size: 10rem;
color: #508750;
}
.successful-register  p.message-main{
font-size: 1.2rem;
max-width: 320px;
margin: 0px auto 10px;
line-height: 1.2;
}
.successful-register  p.message-thanks{
font-size:.8rem;
opacity: 0.8;	
}

/*Main Classes*/
.flx{
display: flex;
}
.flx.wr{
flex-wrap: wrap;
}
.flx.nwr{
flex-wrap: nowrap;
}
.flx.jsb{
justify-content: space-between;
}
.flx.jsa{
justify-content: space-around;
}
.flx.c{
align-items: center;
}
.mla{
margin: 25px 10px 0 auto;
}
.form-custom{
position: relative;
margin: 5px;
}
span.input-message {
flex-basis: 5%;
color: green;
text-align: right;
padding: 0 0 0 10px;
}
span.notice{
font-size: .8rem;
}

/*Here*/
.here-suggestions {
position: absolute;
z-index: 1;
background: #fff;
top: 96%;
left: 43px;
right: 31px;
padding: 5px 10px;
border: 1px solid green;
border-top: 0;
font-size: .9rem;
}
.here-suggestions .relevantAddress {
 border-bottom: 1px dashed #d5d5d5;
 cursor: pointer;
}

.input-custom::-webkit-input-placeholder { opacity: .5 }  /* WebKit, Blink, Edge */
.input-custom:-moz-placeholder { opacity: .5 }  /* Mozilla Firefox 4 to 18 */
.input-custom::-moz-placeholder { opacity: .5 }  /* Mozilla Firefox 19+ */
.input-custom:-ms-input-placeholder { opacity: .5 }  /* Internet Explorer 10-11 */
.input-custom::-ms-input-placeholder { color: white; }  /* Microsoft Edge */

@media all and (min-width: 767px){
.registration-inner{
min-height: 700px;

}
}
@media all and (max-width: 767px){
.basis{
flex-basis: 100% !important;
}
.flx.c.already-account{
	display: none;
}
.registration:after{
height:0;
}
.registration-inner{
flex-direction: column;
}
}