/*****************************/
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: local('Poppins Light'), local('Poppins-Light'), url(https://fonts.gstatic.com/s/poppins/v5/pxiByp8kv8JHgFVrLDz8Z11lFc-K.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: local('Poppins Light'), local('Poppins-Light'), url(https://fonts.gstatic.com/s/poppins/v5/pxiByp8kv8JHgFVrLDz8Z1JlFc-K.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: local('Poppins Light'), local('Poppins-Light'), url(https://fonts.gstatic.com/s/poppins/v5/pxiByp8kv8JHgFVrLDz8Z1xlFQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: local('Poppins Regular'), local('Poppins-Regular'), url(https://fonts.gstatic.com/s/poppins/v5/pxiEyp8kv8JHgFVrJJbecmNE.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: local('Poppins Regular'), local('Poppins-Regular'), url(https://fonts.gstatic.com/s/poppins/v5/pxiEyp8kv8JHgFVrJJnecmNE.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: local('Poppins Regular'), local('Poppins-Regular'), url(https://fonts.gstatic.com/s/poppins/v5/pxiEyp8kv8JHgFVrJJfecg.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* devanagari */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: local('Poppins Medium'), local('Poppins-Medium'), url(https://fonts.gstatic.com/s/poppins/v5/pxiByp8kv8JHgFVrLGT9Z11lFc-K.woff2) format('woff2');
  unicode-range: U+0900-097F, U+1CD0-1CF6, U+1CF8-1CF9, U+200C-200D, U+20A8, U+20B9, U+25CC, U+A830-A839, U+A8E0-A8FB;
}
/* latin-ext */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: local('Poppins Medium'), local('Poppins-Medium'), url(https://fonts.gstatic.com/s/poppins/v5/pxiByp8kv8JHgFVrLGT9Z1JlFc-K.woff2) format('woff2');
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: local('Poppins Medium'), local('Poppins-Medium'), url(https://fonts.gstatic.com/s/poppins/v5/pxiByp8kv8JHgFVrLGT9Z1xlFQ.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/*****************************/

.modal-content {
  background: rgb(250, 250, 250);
  box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.1);
  border: none;
  padding: 0px;
  border-radius: 20px !important;
  overflow: hidden;
}
.modal h3.form-title {
  color: #333333;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 2px !important;
  font-size: 16px !important;
  margin-bottom: 20px !important;
  font-family: 'Poppins';
  line-height: 16px;
  margin-top:  0px !important;
}
.modal {padding-top: 2.5%; width: 100% !important;
    left: 0px !important;
    margin-left: 0px !important;
    background-color: transparent !important}

.modal.fade.in {
    top: 0%;
    box-shadow: none !important;
    border: none !important;
}
.modal.fade {
    box-shadow: none !important;
}
.button-close { position: absolute;
    top: 10px;
    right: 10px;
    background: #e6474b;
    border-radius: 50px !important;
    width: 30px;
    height: 30px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
    color: white; }
.button-close:hover { color: white }
.form-body .form-actions {
    background-color: transparent !important;
    margin-top: 10px !important;
    margin-bottom: 0px !important;
}
.modal .ui-widget-content {box-shadow: none !important;}
.modal#membrecy { padding-top: 10px }
.modal .form-body {text-align: center !important;position: relative;}
.modal .btn {
  background: red;
  letter-spacing: 2px !important;
  border-radius: 20px;
  padding: 10px 35px;
  width: 160px;
  margin-top: 10px;
  color: white !important;
  border: none;
  font-family: 'Poppins';
  font-weight: 300;
  text-transform: uppercase;
  font-size: 11px;}
.modal .btn.red {background-color: #d20e0e;
}

.modal-content form { margin-bottom: 0px !important }
.modal .btn.green {background-color: #39941d;}
.modal input {width: 100%;font-weight: 400 !important;outline: none !important;box-shadow:none !important;border: none;padding: 0px 20px;border-radius: 20px !important;font-size: 13px !important;letter-spacing: 0.3px;background: rgba(255, 255, 255, 0.9) !important;text-align: center;height: 44px;line-height: 40px;font-family: 'Poppins' !important;}
.modal hr {width: 20%;margin-top: 15px !important;margin-bottom: 15px !important;border-color: #bfbfbf00 !important;border-style: solid;display: block;position: relative;margin: 0px auto;}
.modal-dialog {width: 0% !important;margin: 0px auto;}
input:focus { outline: none !important; box-shadow: none !important }
select:focus { outline: none !important; box-shadow: none !important }
input::placeholder { color: #3a3a3a !important; font-weight: 500; font-family: 'Poppins' }
.modal .btn:focus { outline: none !important }
.modal select {width: 100%;outline: none !important;box-shadow:none !important;border: none;padding: 0px 5px 0px 20px;border-radius: 20px !important;font-size: 13px !important;letter-spacing: 0.3px;background: rgba(255, 255, 255, 0.9) !important;text-align: center !important;height: 45px !important;font-weight: 400 !important;color: #3c3c3c !important;text-align-last: center;font-family: 'Poppins' !important;}
.button.button-reveal.login-fcbk {background: linear-gradient(90deg, #5d8af3, #1f45a5) !important;width: 100%;margin-bottom: 2px !important;padding: 0px !important;}
.button.button-reveal.login-instgrm {background: linear-gradient(90deg, #f3645d, #9f1fa5) !important;width: 100%;margin-bottom: 10px !important;padding: 0px !important;}
.button {
  display: inline-block;
  position: relative;
  cursor: pointer;
  outline: none !important;
  white-space: nowrap;
  margin: 0px;
  padding: 0 22px !important;
  font-size: 14px;
  height: 44px;
  line-height: 44px;
  background: linear-gradient(90deg, #5d8af3, #6e5bdc);
  color: #FFF !important;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0.4px;
  border: none;
  border-radius: 50px !important;
  text-shadow: none;
  font-family: 'Roboto';
}
.button.button-reveal {
    padding: 0 50px !important;
    overflow: hidden;
}
.button.button-reveal span {
    display: inline-block;
    position: relative;
    left: 0;
}
.button.button-reveal.tright i {
    left: auto;
    right: -50px;
}
.button.button-reveal i {
    display: block;
    position: absolute;
    top: 0px !important;
    left: -50px;
    width: 44px;
    height: 44px;
    line-height: 44px;
    margin: 0;
    text-align: center;
    border-radius: 50px;
    font-size: 18px;
    background-color: rgba(0,0,0,0.1) !important;
    box-shadow:  none !important;
    border: none !important;
    margin-top:  0px !important;
    padding: 0px;
}
.button.button-reveal:hover i {
    left: 0;
}
.button.button-reveal:hover span {
    left: 16px;
}
.button.button-reveal.tright:hover span {
    left: -16px;
}
.button.button-reveal.tright:hover i {
    left: auto;
    right: 0;
}
body:not(.device-touch) .button.button-reveal i, body:not(.device-touch) .button.button-reveal span {
    -webkit-transition: left 0.3s ease, right 0.3s ease;
    -o-transition: left 0.3s ease, right 0.3s ease;
    transition: left 0.3s ease, right 0.3s ease;
}
.modal.fade.show { opacity: 1 }
.modal.locked { opacity: 1; display: block;  }
.modal.locked .modal-dialog { width: 40% !important; opacity: 1 !important }
ul.tab-nav {
    padding: 0px;
    border-bottom: 1px solid #bfbfbf;
    padding-bottom: 0px;
    margin-bottom: 35px;
}
.button.button-reveal:hover span {
    right: -16px;
}
ul.tab-nav li.ui-state-default {display: inline-block;margin-bottom: -1px;padding: 10px 15px;width: auto !important;height: auto !important;top: 0px !important;background: none !important;}
ul.tab-nav li a {color: black;font-size: 13px;letter-spacing: 0.4px;font-family:  'Poppins';font-weight: 400;}
ul.tab-nav li.ui-state-active {border-bottom: 1px solid #6770e6 !important;}
ul.tab-nav li.ui-state-active a {color: #6d60df;}
ul.tab-nav li a:hover {text-decoration: none}

.form-group.with-icon {position: relative;overflow: hidden;border-radius: 35px !important;font-family: 'Roboto';margin-bottom: 10px !important;height: 40px !important;}
.form-group.with-icon i {position: absolute;left: -45px;transition: left 0.3s ease;height: 29px;line-height: 29px;top: 5px;font-size: 18px;width: 43px;color: #5d5d65;border-right: 1px solid #6770e6;}
.form-group.with-icon:hover i {left: 5px;}
.form-group.with-icon input {padding: 0px !important;}
.form-group.with-icon select {  }
.modal a:hover { text-decoration: none }

.form-group.with-icon input {}
.form-group.with-icon:hover input {}
.form-row input { text-align: left !important }
.button.red { background: linear-gradient(90deg, #f35d5d, #e84646) !important }
.modal p {
    font-size: 13px;
    font-family: 'Poppins';
    letter-spacing: 0.4px;
    font-weight: 500;
    margin-bottom: -10px;
    margin-top: -10px;
    color: #7d7e86;
    text-align: center;
    }
.invitecode h3 { margin-top: 25px !important;  font-size: 20px; }
input , textarea { font-family: 'Poppins'}
input:required:focus {
    background: #ffe1e1 !important;
    border: none !important;
    color: #cc4c4c !important;
}
select:required:focus {
    background: #ffe1e1 !important;
    border: none !important;
    color: #cc4c4c !important;}
.modal button { float: none;
    display: inline-table;
    vertical-align: top; }

.modal.show .modal-dialog {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  width: 40% !important;
  opacity: 1;
}

.modal-dialog-centered {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  min-height: calc(100% - (0.5rem * 2));
}

.modal-content {
  padding: 45px 40px 40px !important;
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  pointer-events: auto;
  background-color: #fafafa;
  background-clip: padding-box;
  border: none;
  border-radius: 0px;
  outline: 0;
  margin-left: 0px !important;
}

.modal-atachment .modal-dialog {
    width: 35% !important; 
}
.modal-atachment {
    padding-top: 2.5% !important;
}


::placeholder { font-family: 'Poppins' !important; font-weight: 400 !important }

.dblock { display: block !important }

.modal-dialog {
    width: 35% !important;
    position: relative !important;
    display: flex;
  }

  .modal select::placeholder { text-align: center !important; font-family: 'Poppins' !important; font-weight: 400 !important }

  .close-tab {
    color: white;
    background: #da3737;
    position: absolute;
    right: 8px;
    top: 8px;
    border-radius: 40px !important;
    height: 30px;
    width: 30px;
    line-height: 30px;
    text-align: center;
    cursor: pointer;
    }

.modal-atachment .modal-dialog.modal-login { top: 0px !important }
.modal.fade.modal-atachment .modal-dialog { transform: translate(0,0%) !important }

a.close-tab { color: white !important }
a.close-tab:hover { color: white !important }

.help-inline {height: 30px;line-height: 30px;margin-bottom: 5px;margin-top: -5px;color: #ea4a4a; font-family: 'Poppins'}

.modal-atachment {
    display: block;
    top: 0px;
    z-index: 1026;
    opacity: 1;
    height: 100%;
    background: rgba(0, 0, 0, 0.75) !important;
}

/******************** RESPONSIVE SETTINGS ***************************/

@media (max-width: 1024px) {
  .modal-dialog {
    width: 50% !important;
  }
  .modal-atachment .modal-dialog {
    width: 50% !important;
  }
}
@media (max-width: 600px) {
  .modal-dialog {
    width: 70% !important;
  }
  .modal-atachment .modal-dialog {
    width: 70% !important;
  }
  .modal-login .form-group {
    height: auto !important;
  }
}

@media (max-width: 568px) {
  .modal-dialog {
    width: 90% !important;
  }
  .modal-atachment .modal-dialog {
    width: 90% !important;
  }
  .margin-login {
    overflow: auto !important;
  }
  .modal-atachment .modal-dialog.modal-login {
    top: 60px !important;
  }
}

@media (max-width:400px) {
  .modal-atachment .modal-dialog.modal-login {
    top: 115px !important;
    width: 90% !important;
  }
  .modal-content {
    padding: 30px 25px 30px !important;
  }
  .modal-login .form-group {
    height: auto!important;
  }
  .modal h3.form-title {
    line-height: 20px;
    margin-bottom: 10px !important;
  }
  .modal {
    padding-top: 4%;
  }
}
