*{ font-family:'Roboto', Arial; box-sizing:border-box; }
html, body{ height:100%; }
body{ padding:0; margin:0; }
b{ font-weight:500; }
a{ text-decoration:none; color:#3498db; }
.empty-box{ 
    display:flex;
    /*height:100%;*/
    justify-content:center;
    align-items:center;
    flex-flow:column nowrap;
}

.empty-icon{ margin-bottom:30px; }
.empty-icon > i{ font-size:78px; color:#777;  }
.empty-title{  font-size:22px; color:#333; line-height:1.3em; font-weight:500; margin-bottom:10px; }
.empty-desc{ font-size:20px; color:#444; line-height:1.3em;  }

.content-box{ background-color:#fff; padding:16px; border-radius:3px; box-shadow:0 0 3px rgba(0,0,0,0.2); }
.inside-box{ border-radius:8px; border:1px solid #d2d2d2; padding:18px; }

.form-box{ 
    padding:40px;
    background-size: cover;
    background-position: center top;
    background-attachment: fixed;
    box-sizing: border-box;
    min-height: 100%;
}
.form-content{ max-width:650px; margin:auto; border-radius:3px; box-shadow:0 0 6px rgba(0,0,0,0.4); }
.form-content-header{ background-color:rgba(0,0,0,0.6); padding:40px; border-radius:3px 3px 0 0; }
.form-content-body{ padding:40px 60px; background-color:#fff; }

.form-title{ font-size:24px; color:#333; line-height:1.3em; margin-bottom:4px; font-weight:500; }
.form-subtitle{ font-size:16px; color:#555; line-height:1.3em; letter-spacing:0.011em; margin-bottom:20px; }
.login-subtitle {
    font-size:14px; 
    font-weight:400; 
    color:#333;
    margin-bottom: 24px;
}

#loginForm a {
    color: var(--event-color);
    text-decoration: underline;
}

.field{ padding:6px 0 12px 0;  }
.field-title{ font-weight:500; font-size:14px; color:#333; line-height:1.4em; margin-bottom:4px;}
.field-value{ color:#888; font-size:16px; }
.field-input{ 
    width:100%;
    box-sizing:border-box;
    padding:10px;
    line-height: 1.3em;
    color: #333;
    margin: 6px 0;
    border-radius: 5px;
    border: solid 1px #e2e8f0;
    font-size: 12px;
}

.field label {
    font-size: 12px;
}

.field-multiple > .flex + .flex{
    margin-top: 6px;
}

.btn-send-join{ padding: 6px 26px; }
.shape-photo{
    display:inline-flex; width:48px; height:48px;
    background-position:top center;
    background-size:cover;
    border:1px solid #d2d2d2; border-radius:50%;
}

.link-privacy{ color:rgba(255,255,255,0.7); margin:0 0 0 12px;; text-decoration:none; font-size:14px; cursor:pointer; font-weight:400; }
.link-privacy:hover{ color:#fff; }
.link-privacy.on{ color:#fff; font-weight:500; }

.lnk{ font-size:13px; margin:4px; }

.m-box{
    display:flex;
    flex-flow:row nowrap;
    align-items:stretch;
    min-height:100%;
}

.m-box-event{
    width:40%;
    /* min-height: 50vh; */
    background-color:#3498db;
    padding:40px;
    display:flex;
    flex-flow:column nowrap;
    justify-content:space-between;
}

.m-box-main{
    width:60%;
    display:flex;
    justify-content:space-between;
    flex-direction:column;
    align-items:center;
}   

.m-box-cont{  max-height:100vh; overflow:auto; padding:40px; width:100%; }
.m-box-logo{ max-height:65px; max-width:170px; }
.m-box-event-title{ color:#fff; line-height:1.4em; font-size:22px; font-weight:500; margin-bottom:2px; letter-spacing:0.011em; }
.m-box-event-date{ color:#fff; line-height:1.4em; font-size:15px; font-weight:400; margin-bottom:20px; letter-spacing:0.011em; }
.m-box-event-text{ color:#fff; line-height:1.4em; font-size:15px; letter-spacing:0.011em;  }
.img-powered-meetmaps{ height:14px; }

@media(max-width:850px){
    .m-box-logo--logo-only{ width: 100%; text-align: center; }
}

@media(min-width:850px){
    .m-box-logo--logo-only{ display: none; }
}

@media(max-width:850px){
    .m-box{ flex-direction:column; }
    .m-box-event{ width:100%; }
    .m-box-main{ width:100%; }
    .m-box-event-body{ margin:20px 0; }
    .m-box-event.bg-event-color {background-image: none !important;}
    .m-box-event-footer { display: none; }
}

/* *** Modal *** */
.m-modal{ 
    display:none;
    z-index:3;
    position:fixed; 
    top:0; left:0; 
    width:100%; height:100vh; 
    background-color:rgba(0,0,0,0.5); 
}
.m-modal > .flex{ width:100%; height:100vh; justify-content:center; }
.modal-cont{ background-color:#fff; width:100%; max-width:620px; border-radius:5px; box-shadow:0 1px 6px #333; }
.modal-cont.md-s{ max-width:460px; }
.modal-cont.md-l{ max-width:860px; }
.modal-header{ background-color:#fff; display:flex; flex-flow:row nowrap; align-items:center; border-radius:5px 5px 0 0; border-bottom:1px solid #e2e2e2; padding-right:12px; }
.modal-header > i{ width:48px; min-width:48px; line-height:48px; text-align:center; cursor:pointer; font-size:16px; color:#777; }
.modal-title{ width:100%; font-weight:500; font-size:16px; color:#555; text-align:left; padding-left:30px; }
.modal-body-cont{ padding:12px 30px; max-height:78vh; overflow:auto; }
.modal-footer{ display:flex; flex-flow:row nowrap; border-top:1px solid #e2e2e2; padding:12px 25px; justify-content:flex-end; align-items:center; }

@media screen and (max-width: 850px) {
    .m-box-event-footer{
        flex-direction: column;
    }

    .m-box-event-footer__langs {
        margin-top: 1rem;
    }

    .m-box-event-footer__langs .langs {
        text-align: center;
    }

    .m-box-event-footer__langs .link-privacy{
        display: inline-block;
        margin-top: .4rem;
    }
} 

.modal-text-title{ font-size:18px; color:#333; line-height:1.3em; font-weight:500; margin-bottom:4px; }
.modal-text{ font-size:16px; color:#333; line-height:1.3em; }
.modal-text-icon{ font-size:42px; color:#3498db; }

.join__gdpr-info {
    font-size: 12px;
    margin-top: 36px;
    color: #333;
}

.join__gdpr-info__title {
    margin-bottom: 0.5rem;
    font-weight: 500;
    font-size: 16px;
    text-transform: uppercase;
}

.join__gdpr-info__content {
    display: grid;
    grid-template-columns: 1fr 3fr;
    border: 1px solid #CBD5E0;
    border-radius: 5px;
}

.join__gdpr-info__name {
    font-weight: 500;
    font-size: 13px;
    border-right: 1px solid #E2E8F0;
    border-top: 1px solid #E2E8F0;
    padding: 8px;
}

.join__gdpr-info__name:first-child,
.join__gdpr-info__value:nth-child(2) {
    border-top: 0;
}

.join__gdpr-info__value {
    line-height: 1.3;
    border-top: 1px solid #E2E8F0;
    padding: 8px;
}

.join__gdpr-info__value ul {
    margin: 0;
    padding-left: 1rem;
} 

.join__gdpr-info__value a {
    text-decoration: underline;
} 

/* *** Tooltip jquery *** */
div.ui-tooltip{ box-shadow:0 0 3px rgba(0,0,0,0.4); padding:0px; border:0px; border-radius:4px; }
div.ui-tooltip div{ padding:8px; background-color:#f8f8f8; border-radius:4px; color:#333; display:inline-block; width:auto; line-height:1.4em; font-size:14px; }

/* Join description */
.form-desc{ color: #888; font-size: 14px; line-height: 1.4em; margin-top: 4px; word-break: break-word; }

.full_page--spinner{
    position: fixed;
    height: 100%;
    width: 100%;
    inset: 0;
    background-color: #FFF;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 10;
}

.spinner {
    border: 4px solid rgba(0, 0, 0, 0.1);
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border-left-color: #09f;
  
    animation: spin 1s ease infinite;
  }
  
  @keyframes spin {
    0% {
      transform: rotate(0deg);
    }
  
    100% {
      transform: rotate(360deg);
    }
  }

  
.shape-photo {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    transition: 0.2s;
    /* cursor: pointer; */
    border-style: solid;
    background-size: cover;
    background-origin: border-box;
    background-position: top left;
  }
  /* .shape-photo:hover {
    background-color: #e8e8e8;
  } */
  
  .field-avatar {
    position: relative;
    display: inline-block;
  }
  
  .avatar-holder {
    box-shadow: 0 0 13px 0 rgba(0, 0, 0, .1);
    border-radius: 50%;
    width: 120px;
    height: 120px;
    background-repeat: no-repeat;
    background-size: cover;
  }
  
  .avatar-upload {
    right: 0;
    top: 5px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background-color: #fff;
    box-shadow: 0 0 13px 0 rgba(0, 0, 0, .1);
    transition: all .3s;
  }
  
  .avatar-upload i {
    color: var(--event-color);
    font-size: .9rem;
  }
  
  .avatar-upload:hover {
    background-color: var(--event-color);
    transition: all .3s;
  }
  
  .avatar-upload:hover i, .avatar-rotate:hover i {
    color: #fff;
  }

  .recover-text-wrapper{
    font-size: 14px;
  }

.mod-html span span, .mod-html p span span  {
    font-family: inherit;
}