@charset "UTF-8";

/*
Theme Name: Twenty Twenty-One
Theme URI: https://wordpress.org/themes/twentytwentyone/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Twenty-One is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Requires at least: 5.3
Tested up to: 5.6
Requires PHP: 5.6
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyone
Tags: one-column, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready

Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org
Twenty Twenty-One is distributed under the terms of the GNU GPL.
*/
*{
    min-height: 0;
    min-width: 0;
}
@charset "utf-8"; /* CSS Document */
.aligncenter,.gallery-item a{display:block}
.alignleft{float:left; margin-right:15px; margin-bottom:10px}
.alignright{float:right; margin-left:15px; margin-bottom:10px}
.aligncenter{margin-left:auto; margin-right:auto}
.wp-caption{max-width:100%;padding:4px}
.entry-caption, .gallery-caption, .wp-caption .wp-caption-text{font-style:italic; font-size:12px; font-size:.857142857rem; line-height:2; color:#757575}
ul:before, ul:after{ content:''; display:table;}
ul:after{ clear:both;}
.full-img img{ width:100%; height:auto;}
img.img-crop { display:block; max-width:none }
.table-cell {display:table-cell; vertical-align:middle; padding:0;}
.table-div{ display:table; height:100%; width:100%; }

.intro-bg{ min-height:100vh; background:#86209d;
    background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjEwMCUiIHkyPSIwJSI+CiAgICA8c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSIjODYyMDlkIiBzdG9wLW9wYWNpdHk9IjEiLz4KICAgIDxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2RmMWU4YSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgPC9saW5lYXJHcmFkaWVudD4KICA8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2dyYWQtdWNnZy1nZW5lcmF0ZWQpIiAvPgo8L3N2Zz4=);
    background:-moz-linear-gradient(45deg,  #86209d 0%, #df1e8a 100%);
    background:-webkit-linear-gradient(45deg,  #86209d 0%,#df1e8a 100%);
    background:linear-gradient(45deg,  #86209d 0%,#df1e8a 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#86209d', endColorstr='#df1e8a',GradientType=1 );}
.page-bg{ background:url(./images/background-light-gradient.svg) no-repeat center top; background-size:cover; min-height:100vh}
html, body {height:100%;}
.container-height {height:100%;}
.intro-logo{ margin:0 auto 60px;}
.intro-logo span{ display:block; font-size:28pt; letter-spacing:0;}
.login-form{ max-width:282px; margin:0 auto; background:#fff; padding:47px 18px 15px; position:relative; border-radius:12px; box-shadow:0 3px 6px rgba(0,0,0,0.2); -webkit-box-shadow:0 3px 6px rgba(0,0,0,0.2);}
.login-form .logo{ position:absolute; width:78px; left:50%; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); transform:translateX(-50%); top:-40px;}
.login-form .or{ position:relative; margin:34px 0; text-align:center; font-size:17px; color:#000;}
.login-form .or span{ position:relative; padding:2px 10px; background:#fff; display:inline-block; z-index:10;}
.login-form .or:after{ height:1px; width:100%; left:0; right:0; top:50%; -webkit-transform:translateY(-50%); -ms-transform:translateY(-50%); transform:translateY(-50%); content:''; position:absolute; z-index:1; background:#000;}
.login-form form .form-control, .login-form form .form-control:focus{ background:#DF1E8A; border:2px solid #fff; border-radius:12px; letter-spacing:2px; height:42px;}

.login-form form .form-control::-webkit-input-placeholder { color:#fff; opacity:1; }
.login-form form .form-control::-moz-placeholder { color:#fff; opacity:1; }
.login-form form .form-control:-ms-input-placeholder { color:#fff; opacity:1; }
.login-form form .form-control::-ms-input-placeholder { color:#fff; opacity:1; }
.login-form form .form-control::placeholder { color:#fff; opacity:1; }
.login-form form input[type=submit]{ background:#DF1E8A; border-radius:41px; height:41px; border:none; cursor:pointer; text-align:center; width:94px; color:#fff; letter-spacing:2px;}
.msg-content a{ color:#000; text-decoration:underline; display:block;}
.msg-content a:hover{ color:#DF1E8A; text-decoration:none;}
.intro-content{ padding:15px 0;}
.page-header{ padding:50px 0 105px; position:relative; color:#fff; text-align:center;}
.page-header h1{ font-size:58px; color:#fff; text-shadow:0 3px 6px rgba(0,0,0,0.29);}
.page-header h4{color:#fff; text-shadow:0 3px 6px rgba(0,0,0,0.29);}
.page-header .mpc-separator{ position:absolute; bottom:0; left:0; right:0;}
.wrapper{ padding-bottom:105px; padding-top:100px; position:relative;}
.wrapper .mpc-separator{ position:absolute; bottom:0; left:0; right:0;}
.avatar-slider .img-box-content{ margin:10px; background:#fff; border-radius:12px; box-shadow:0 3px 6px rgba(0,0,0,0.2); -webkit-box-shadow:0 3px 6px rgba(0,0,0,0.2); padding:15px; -moz-transition:all 0.5s ease;  -webkit-transition:all 0.5s ease;  -o-transition:all 0.5s ease; transition:all 0.5s ease;}
.avatar-slider .tap-icon{ background:url(./images/tap-to-interact.png) no-repeat; background-size:90px 20px; height:20px; display:block;}
.avatar-slider .slick-current .img-box-content{-webkit-transform:-webkit-scale(1.3) -webkit-rotate(0deg); transform:scale(1.3) rotate(0deg);}
.avatar-slider a.d-block{ padding:40px 15px; outline:0; box-shadow:none;}
.avatar-slider a.d-block:hover, .avatar-slider a.d-block:focus{ text-decoration:none; outline:none; box-shadow:none;}
.avatar-slider .name{ display:block; font-size:32px; font-weight:700; padding-top:20px; color:#000000;  text-shadow:0 3px 6px rgba(0,0,0,0.29); text-align:center; -moz-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease; text-transform:uppercase;}
.avatar-slider .slick-current .name{padding-top:50px;}
.avatar-slider-lg a.d-block{ padding:45px;}

/*.custom-modal{ position:fixed; top:0; left:0; z-index:1050; bottom:0; right:0; overflow:hidden; outline:0; overflow-y:auto;}
.custom-modal-dialog{ padding:20px; transition:-webkit-transform 0.3s ease-out; transition:transform 0.3s ease-out; transition:transform 0.3s ease-out, -webkit-transform 0.3s ease-out; -webkit-transform:translate(0, -50px); transform:translate(0, -50px);}
.custom-modal-dialog-centered { display:-ms-flexbox; display:flex; -ms-flex-align:center; align-items:center; min-height:calc(100% - 1rem);}
.custom-modal-inner{ position:relative; display:-ms-flexbox; display:flex; -ms-flex-direction:column; flex-direction:column; width:100%; max-width:1110px; pointer-events:auto; background-clip:padding-box; margin:0 auto;  min-height:calc(100% - 3.5rem);}*/
.modal.custom-modal{overflow:hidden; overflow-y:auto;}
.modal-dialog.custom-modal-dialog{ margin:24px;}
.modal-content.custom-modal-content{ border-radius:0; background:none; box-shadow:none;}
.modal-body.custom-modal-content{ border-radius:12px; box-shadow:0 3px 6px rgba(0,0,0,0.2); -webkit-box-shadow:0 3px 6px rgba(0,0,0,0.2); outline:0; padding:46px 24px 10px;  background-color:#fff; border:none}
.modal-action .button{ color:#fff; letter-spacing:1px; border-radius:12px; box-shadow:0 3px 6px rgba(0,0,0,0.2); -webkit-box-shadow:0 3px 6px rgba(0,0,0,0.2); float:left; display:block; line-height:48px; padding:0 20px; background:#DF1E8A; margin-top:15px;}
.modal-action .button:hover{ color:#fff; background:#000; text-decoration:none;}
.modal-action .continue, .modal-action .continue:hover{ background:url(./images/continue-small-black.png) no-repeat top center; background-size:57px 56px; padding-top:62px; color:#000; font-weight:700; display:block; float:right; font-size:13px; text-decoration:none;}
.modal-body.custom-modal-content .tap-icon{ background:url(./images/tap-to-interact.png) no-repeat; background-size:90px 20px; height:20px; display:block;}
.modal-dialog.custom-modal-dialog .name{ display:block; font-size:32px; font-weight:700; padding-top:5px; color:#000000;  text-shadow:0 3px 6px rgba(0,0,0,0.29); text-align:center; -moz-transition:all 0.5s ease; -webkit-transition:all 0.5s ease; -o-transition:all 0.5s ease; transition:all 0.5s ease; text-transform:uppercase;}
@media (min-width: 576px){.modal-dialog.custom-modal-dialog{ margin:24px auto;}}


.wrapper-vh{ min-height:100vh; background:#faebf6;
    background:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZhZWJmNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNmOWU4ZjQiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background:-moz-linear-gradient(left,  #faebf6 0%, #f9e8f4 100%);
    background:-webkit-linear-gradient(left,  #faebf6 0%,#f9e8f4 100%);
    background:linear-gradient(to right,  #faebf6 0%,#f9e8f4 100%);
    filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#faebf6', endColorstr='#f9e8f4',GradientType=1 );}
.wrapper-content{ padding:80px 0;}

.character-list{border-radius:12px; box-shadow:0 3px 6px rgba(0,0,0,0.2); -webkit-box-shadow:0 3px 6px rgba(0,0,0,0.2); background:#fff; overflow:hidden; margin:0 auto; max-width:325px;}
.character-list h5{ background:#DF1E8A; color:#fff; padding:10px; text-align:center; margin:0;}
.character-list ul{ margin:0; padding:0; list-style:none;}
.character-list ul li{ padding:10px 30px 10px 10px; position:relative; display:block; font-weight:700;}
.character-list ul li:nth-child(even){ background:#EDF3FD;}
.character-list ul li a{ display:inline-block; background:url(./images/info.svg) no-repeat top center; background-size:100%; height:18px; width:18px; vertical-align:middle; position:relative; top:-2px; margin-right:6px;}

.character-list ul li input[type="checkbox"] { display:none;}
.character-list ul li input[type="checkbox"] + label {color:#005691; cursor:pointer; position:absolute; right:10px; top:50%; margin-top:-12px;}
.character-list ul li input[type="checkbox"] + label span {display:inline-block; width:25px; height:25px; margin:-1px 6px 0 0; vertical-align:middle; cursor:pointer; border:2px solid #000; border-radius:50%; position:relative;}
.character-list ul li input[type="checkbox"]:checked + label span:after{ background:url(./images/checked.svg) no-repeat right 50%; background-size:80%; height:25px; width:25px; top:-4px; right:-4px; content:''; position:absolute;}

.character-listing .continue, .character-listing .continue:hover{ background:url(./images/continue-small-black.png) no-repeat top center; background-size:57px 56px; padding-top:62px; color:#000; font-weight:700; display:block; font-size:13px; text-decoration:none; display:block; text-align:center;}
.wrapper-content-line [class*=col-]:first-child{ border-right:2px solid #d8d8d8;}
.body-title{ border-radius:12px; box-shadow:0 3px 6px rgba(0,0,0,0.2); -webkit-box-shadow:0 3px 6px rgba(0,0,0,0.2); background:#fff; padding:30px; text-align:center; max-width:90%; margin:100px 0;}
.body-title h2{ color:#DF1E8A;}
.page-header-pb-5{ padding-bottom:150px;}

/* New Css */

.start {
  display: block;
  font-size: 60px;
  color: #fff;
}
.bottom-image {
  margin-top: 50px;
}

.login-form a {
  color: #000000;
}

.login-form form .input,
.login-form form .input:focus {
  background: #df1e8a;
  border: 2px solid #fff;
  border-radius: 12px;
  letter-spacing: 2px;
  height: 42px;
  color: #fff;
}

body .lrm-form .lrm-fieldset-wrap {
  padding: 0px !important;
}
body .lrm-font-svg .lrm-form label.lrm-password,
.lrm-font-svg .lrm-form .lrm-ficon-key {
  background-image: none;
}
body .lrm-font-svg .lrm-form label.lrm-email,
.lrm-font-svg .lrm-form .lrm-ficon-mail {
  background-image: none;
}
body .lrm-form input.has-padding {
  padding: 0.6rem 0.75rem;
}

@media only screen and (min-width: 600px) {
  body .lrm-user-modal-container {
    width: 100%;
  }
}
body .lrm-form button,
.lrm-form button[type="submit"] {
  background: #df1e8a;
  border-radius: 41px;
  height: 41px;
  border: none;
  cursor: pointer;
  text-align: center;
  width: 94px !important;
  color: #fff;
  letter-spacing: 2px;
  font-weight: 400;
  font-size: 16px;
  padding: 0px;
}

body .lrm-user-modal-container {
  margin: 20px 0px;
}
body .lrm-font-svg .lrm-form label.lrm-username,
.lrm-font-svg .lrm-form .lrm-ficon-user {
  display: none;
}

.lrm-signup-section .image-replace {
  display: none;
}
body .lrm-form .fieldset {
  margin: 0px;
}
.slick-track {
  /*margin-top: 0;*/
  /*  padding-top: 40px;*/
}

/*.modal-action {
  height: 0px;
  overflow: hidden;
}
.modal-action.active {
  height: auto;
}*/
.avatar-text.active {
  height: auto;
}
.avatar-text {
  height: 0px;
  overflow: hidden;
  font-size: 14px;
  line-height: 16px;
}


ul.line1 {
    list-style: none;
    width: 100%;
    text-align: center;
    padding: 0px;
}
ul.line2 {
    list-style: none;
    text-align: center;
    width: 100%;
    padding: 0px;
}

ul.line2 li {
    display: inline-block;
    width: 32%;
}
@media (max-width: 767px) {
    .oc-padding {
        padding: 0rem 3rem;
    }
}

@media (min-width: 768px) {
    .oc-padding {
        padding: 0rem 10rem;
    }
}

@media all and (device-width: 1024px) and (device-height: 768px) and (orientation: landscape) {
    .oc-padding {
        padding: 0rem 5rem;
    }
}

.hd-oc {
    font-size: 30px !important;
    font-weight: 400 !important;
    color: #707070 !important;
    border: 1px solid #707070;
    padding: 10px;
}

.hide-section {
    visibility: hidden;
    height: 0px;
}
/*
#congratulations h2 {
    font-size: 35px;
    font-weight: 400;
    color: #707070;
}
*/
/*#congratulations h3 {
    font-size: 30px;
    font-weight: 400;
    color: #707070;
}*/

#congratulations ul li {
    padding: 15px 10px;
    border: 1px solid;
    border-radius: 10px;
    margin-bottom: 15px;
    line-height: 1;
}
#congratulations ul {
    background: url("images/dotted-bg.png") repeat-y 0px top;
    max-width: 320px;
    margin: 0px auto;
    list-style: none;
}
.congralutions-bottom {
    font-size: 21px;
    color: #707070;
    background: url("images/congralutions-bottom.png") no-repeat top center;
    max-width: 320px;
    margin: 0px auto;
    height: 170px;
}
.congralutions-bottom p {
    font-size: 20px;
    padding-left: 20px;
    padding-top: 25px;
}
#enroll .cirlce {
    width: 32px;
    height: 32px;
    border: 1px solid;
    border-radius: 50%;
}
#enroll .green {
    background-color: green;
    top: 50px;
}
#enroll .orange {
    background-color: orange;
    top: 0px;
    left: 110px;
}
#enroll ul {
    list-style: none;
    max-width: 500px;
    margin: 0px auto;
    position: relative;
    padding: 0px;
}
#enroll ul li {
    display: inline-block;
    margin-right: 20px;
}

#enroll .cirlce {
    width: 32px;
    height: 32px;
    border: 1px solid;
    border-radius: 50%;
    margin: 0px auto;
}
#enroll li.interest {
    width: 32px;
    height: 32px;
}
#enroll span.cirlce {
    display: block;
}
.cirlce .fa {
    font-size: 22px;
    line-height: 32px;
    text-align: center;
    padding-left: 3px;
    color: purple;
}
#enroll .gift {
    width: 100%;
    margin-top: 50px;
    font-size: 150px;
    margin: 0px auto;
    display: block;
    text-align: center;
}

@media (max-width: 767px) {
    #enroll ul {
        margin-top: 100px;
    }
}
.enroll-btn {
    width: 100%;
}
.enroll-btn .btn {
    font-size: 30px;
    border: 1px solid #707070;
    border-radius: 12px;
    margin: 0px auto;
    max-width: 150px;
    display: block;
}

.nav-tabs {
    display: none;
}

@media (min-width: 768px) {
    .nav-tabs {
        display: flex;
        flex-flow: column nowrap;
    }
    .nav-tabs {
        border-bottom: none;
        border-right: 1px solid #ddd;
        display: flex;
    }
    .nav-tabs {
        margin: 0 15px;
    }
    .nav-tabs .nav-item + .nav-item {
        margin-top: 0.25rem;
    }
    .nav-tabs .nav-link {
        transition: border-color 0.125s ease-in;
        white-space: nowrap;
    }
    .nav-tabs .nav-link:hover {
        background-color: #f7f7f7;
        border-color: transparent;
    }
    .nav-tabs .nav-link.active {
        border-bottom-color: #ddd;
        border-right-color: #fff;
        border-bottom-left-radius: 0.25rem;
        border-top-right-radius: 0;
        margin-right: -1px;
    }
    .nav-tabs .nav-link.active:hover {
        background-color: #fff;
        border-color: #0275d8 #fff #0275d8 #0275d8;
    }

    .card {
        border: none;
    }

    .card .card-header {
        display: none;
    }

    .card .collapse {
        display: block;
    }
}

@media (max-width: 767px) {
    .tab-pane {
        display: block !important;
        opacity: 1;
    }
}

@charset "UTF-8";
/*** START BS OVERRIDES ***/
.features {
    padding: 50px 0;
}
.features.light-brown {
}
.features h2.section-title {
    color: #333333;
    font-size: 22px;
    margin: 0;
    text-align: center;
}
.features .v-tabs .v-tab-head a,
.features .v-tabs a.v-tab-head {
    color: #292929;
    cursor: pointer;
    display: block;
    padding: 15px 30px 15px 15px;
    border-right: 1px solid #707070;
    margin: 0;
    text-align: right;
    font: 20px "Raleway", "franklin-gothic-urw", "Helvectica Neue", helvetica,
    clean, sans-serif;
}
.features .v-tabs .v-tab-head a.active,
.features .v-tabs .v-tab-head a:hover,
.features .v-tabs a.v-tab-head.active,
.features .v-tabs a.v-tab-head:hover {
    font-weight: bold;
    text-decoration: none;
}
.features .v-tabs .v-tab-head a {
    position: relative;
    display: block;
}
.features .v-tabs .v-tab-head a.active::after,
.features .v-tabs .v-tab-head a.active::before {
    content: "";
    border-style: solid;
    border-width: 15px;
    position: absolute;
    right: 0;
    top: 15px;
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
}
.features .v-tabs .v-tab-head a.active::before {
    border-color: #707070 transparent transparent;
}
.features .v-tabs .v-tab-head a.active::after {
    margin-right: -1px;
    border-color: #fff transparent transparent;
}
.features .v-tabs a.v-tab-head {
    border: none;
    padding: 15px 0;
    text-align: left;
    position: relative;
}
.features .v-tabs a.v-tab-head:after {
    color: #e2dcd6;
    content: "";
    font-family: FontAwesome;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}
.features .v-tabs a.v-tab-head.active::after {
    color: #3c6;
    content: "";
}
.features .v-tabs .v-tab-pane {
    padding: 15px;
    border-top: 1px solid #707070;
    border-right: 1px solid #707070;
    border-bottom: 1px solid #707070;
}
.features .v-tabs .v-tab-pane ul {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.features .v-tabs .v-tab-pane ul li {
    border-bottom: 1px solid #e2dcd6;
    color: #292929;
    font-size: 16px;
    padding: 15px 0;
}
.features .v-tabs .v-tab-pane ul li i {
    color: #4c81b6;
    cursor: pointer;
    font-size: 14px;
}
.features .v-tabs .v-tab-pane .in {
    border-top: none;
    padding-top: 0;
}
.features .v-tabs .v-tab-pane .popover {
    border: 1px solid #014d7e !important;
    border-radius: 0;
    width: auto;
    margin: 10px 0 0 0;
    max-width: 276px;
    left: auto;
    box-shadow: none;
}
.features .v-tabs .v-tab-pane .popover.bottom .arrow {
    border-bottom-color: #014d7e;
}
.features .v-tabs .v-tab-pane .popover .popover-content {
    font-size: 14px;
    padding: 15px;
    text-align: center;
}

@media screen and (max-width: 768px) {
    .features.light-brown {
        border-top: 0 none;
    }
    .features h2.section-title {
        font-size: 32px;
    }
    .features .v-tabs .v-tab-pane .in {
        border-top: 1px solid #ddd;
        border-bottom: 2px solid #ddd;
    }
    .features .popover {
        margin: 10px 5% 0;
        max-width: none;
        width: 90%;
    }
}

.no-divider [class*="col-"]:first-child {
    border-right: none !important;
}
.v-tab-head {
    padding: 0px !important;
}
.v-tabs p {
    font-size: 24px;
    text-align: center;
}
.vertical-center {
    margin: 0;
    position: absolute;
    top: 50%;
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    left: 0px;
    padding: 10px;
}

/* My Css */
/*background-image: linear-gradient(195deg,  #df1e8a 10%, #86209d 30%, #FDF0F9 20%);*/
body{background: none!important;}
.main-container{display:none;background: url(./images/background-light-gradient.svg) no-repeat center top;background-size: cover;}
.sub-container{min-height: 100vh;}
.wrapper {padding-top: 0;padding-bottom: 0;position: relative;}
#avatar-modal{    background: url(./images/background-light-gradient.svg) no-repeat center top;background-size: cover;}
.page-header.header-absolute{position: absolute;top: 10%;padding: 0!important;z-index: 1;}
.avatar-slider{padding-top: 100px;}
.main-container.visible{display: block;}
#entry-screen.main-container{    background: linear-gradient(45deg, #86209d 0%,#df1e8a 100%);}

.modal-content.custom-modal-content{transform: scale(0);transition-timing-function: ease-in;transition: 0.5s;opacity: 0;}
.modal-content.custom-modal-content.card-is-shown {transition: 0.25s;transition-timing-function: ease-out;transform: scale(1);opacity: 1;}
.body-title h2{text-transform: uppercase;}
.body-title h4{text-transform: uppercase;color: #4B4B4B;}
.mybe-card{border-radius: 12px;box-shadow: 0 3px 6px rgb(0 0 0 / 20%);-webkit-box-shadow: 0 3px 6px rgb(0 0 0 / 20%);background: #fff;padding: 40px 50px;text-align: center;margin-left: 45px;}
.null-card{background: transparent;box-shadow: none;}
.mybe-card .card-text{font-weight: 700;font-size: 24px;}
.mybe-card .card-text.card-shadow{border-radius: 12px;box-shadow: 0 3px 6px rgb(0 0 0 / 20%);-webkit-box-shadow: 0 3px 6px rgb(0 0 0 / 20%);background: #fff;padding: 15px;text-align: center;}
.mybe-card .slider .round-slider{margin: 25px auto 0;}
body .rs-handle{background-color: transparent;}
.continue-btn,.continue-btn:hover{background: url(./images/continue-small-black.png) no-repeat top center;background-size: 57px 56px;padding: 1px;padding-top: 62px;color: #000;font-weight: 700;display: block;font-size: 13px;text-decoration: none;text-align: center;}
.continue-btn.white,.continue-btn.white:hover{background: url(./images/continue-large-white.png) no-repeat top center;background-size: 57px 56px;padding-top: 62px;color: #fff;font-weight: 700;display: block;font-size: 13px;text-decoration: none;text-align: center;}
.page-header.page-top{top:10px;z-index: 1;left: 50%;transform: translate(-50%, 0px);padding-top: 10px;padding-bottom: 0}
.assessment-options{position: relative;    min-height: 325px;overflow: hidden;transition-timing-function: ease-in;transition: 1s;}
.assessment-options.expanded{  transition-timing-function: ease-in;transition: 1s;  min-height: calc(100vh - 80px); }
.assessment-options .items{display: flex;    justify-content: space-around;}
.assessment-options .items .item{padding: 3px;top: 0;transition-timing-function: ease-in;transition: 0.5s;}
.assessment-options .items .item .item-name,.assessment-options .items .item .content,.assessment-options .items .item .barriers_heading{display: none;}
.assessment-options .item img {max-width: 42px;}
.assessment-options .item.active {position: absolute;width: 100%;top: 55px;transition: 0.25s;transition-timing-function: ease-out;}
.assessment-options .items .item.active .item-name{display: block;color: #DD1D89;font-size: 34px;}
.assessment-options .items .item.active .barriers_heading{display: block;    color: black;}
.assessment-options .item.active img {max-width: 100px;    margin-bottom: 5px;}
.assessment-options .content{color: black;display: none;}
.assessment-options .content .row{min-height: 300px;position: relative;}
.assessment-options .content .bubble-desc-text{position: absolute;top: 50%;padding: 10px;padding-right: 25px;padding-top: 40px;transform: translate(0, -50%);font-style: italic;}
.body-title.gate-3{margin: 60px auto;max-width: 460px;}
.text-shadow{font-family: "Segoe UI",sans-serif;text-transform: uppercase;font-weight: 600;text-shadow: 0 3px 6px #00000029}

.card-outline{border: 1px solid #707070;color: #707070;}
.rect-card{background: white;padding:30px; text-align:center;margin-bottom:50px;margin-top:25px;border: 1px solid #707070;}
.page-header .rect-card h5{color: #707070;text-transform: uppercase;font-size: 34px;font-weight: 400;}
.wrapper-bg-pink-gradient{background: linear-gradient(45deg, #86209d 0%,#df1e8a 100%);}
.gate-3n {margin-top: 15px;margin-bottom: 10px;}
.page-header .gate-3n h4{font-size: 44px;text-shadow: none}
.gate-3n p {font-size: 26px;text-shadow: none;font-weight: 600;line-height: 1.2em;}
.text-pink{color: #DF1D89;}
.traffic-light {border-radius: 100%;border: 3px solid transparent;background-image: linear-gradient(45deg, #86209d 0%,#df1e8a 100%);width: 74px;height: 74px;margin: 0 auto;margin-bottom: 30px;}
.traffic-light .light {background: #FFC053;border-radius: 100%;height: 100%;}
.type-1 div{font-size: 32px;font-weight: 600;text-transform: initial;line-height: 1.3em;}
.type-1 h4.text-shadow.text-pink {font-size: 30px;margin-top: 20px;margin-bottom: 15px;}
span.avatar-name {text-transform: uppercase;}
.wrapper-bg-white{background: white;}
#gate-4 .assessment-options .items .item.active .item-name{color: #1D90DD;}
.empty-space{height: 220px;background: white;}
.mybe-card.pink-card{background: #F9E8F4;color: #DB1D8A}
.mybe-card.pink-card p{font-size: 36px;}
.mybe-card.pink-card h4{font-size: 3rem;}
.text-blue{color: #1D90DD;}
.text-violet{color: #634BFF;}
body .normal-case{text-transform: inherit;}
.button-border {border: 1px solid #707070;display: inline-block;padding: 5px 10px;border-radius: 12px;}
#gate-5-demo .assessment-options .items .item.active .item-name {color: #634BFF;font-size: 24px;font-weight: bold;}
#gate-5-demo .body-title {margin-right: 20px;max-width: initial;}
#gate-5-demo .empty-space {height: 180px;}
#gate-5-demo .assessment-options .content{font-size: 20px;}
#gate-5-demo  h3{font-size: 2.5rem;}
.body-title.full-width{max-width: 100%;padding: 50px;}


.assessment-options-selection{position:relative;/*min-height:300px;*/overflow:hidden;}
.assessment-options-selection .items{display:flex;justify-content:space-around;padding: 12px 15px;border: 2px solid #707070; border-radius: 108px;}
/*.assessment-options-selection .items .item{padding:3px;top:0;transition-timing-function:ease-in;transition:0.5s;}*/
.assessment-options-selection .items .item .item-name{display:none;}
.assessment-options-selection .item img{max-width:100px;transition: none;}
.gate-5 .assessment-options-selection .content{margin-top: 80px;}
.gate-5 .assessment-options-selection .content{position: relative;    min-height: 190px;}
.gate-5 .assessment-options-selection .continue-btn.next-btn{position: absolute;right: 10px;top: 0;opacity: 0.25;pointer-events: none;}
.gate-5 .assessment-options-selection .content.selected .continue-btn.next-btn{opacity: 1;pointer-events: auto;}
.gate-5 .barriers_desc {color: #000000;font-weight: 600;font-size: 24px;}
.assessment-details{display: flex;}
.assessment-icon{max-width: 100px;margin:auto;margin-right: 20px;}
.assessment-body{flex: 1;align-items: center;justify-content: center;}
.assessment-options-selection .item.active img{visibility: hidden;}
/*.assessment-options-selection .items .item.active .item-name{display:block;color:#DD1D89;font-size:34px;}*/
/*.assessment-options-selection .item.active img{max-width:100px;margin-bottom:5px;}*/
/*.assessment-options-selection .content{color:black;display:none;}*/
.empty-space{height:220px;background:white;}
.normal-case{text-transform:inherit;}
.assessment-body h3.text-violet.mb-3{font-size: 1.3rem;}
.back-btn, .back-btn:hover{background:none;font-size:28px;}

/* Changes 8 May 2021 */
.intro-content .next-btn- img{max-width: 100px;}
#entry-screen .row.no-gutters, .intro-bg{background: url("./images/avatar-group.png");background-repeat: no-repeat;background-size: cover;}
body.page-id-5{     background: linear-gradient(45deg, #86209d 0%,#df1e8a 100%) !important;}
.pos-abs{position: absolute;}
.pos-top-left{left: 10%; top: 5%;}
.pos-top-right{right: 10%; top: 5%;}
.pos-bottom-left{left: 20%; bottom: 15%;}
.pos-bottom-right{right: 13%; bottom: 15%;}
.text-bubble {width: 300px;height: 200px;background: url(./images/bubble-bottom-right-new.png);background-size: contain;background-repeat: no-repeat;display: flex;align-items: center;padding-left: 10px;padding-right: 55px;padding-bottom: 45px;}
.text-bubble.left{background: url(./images/bubble-bottom-left-new.png);background-size: contain;background-repeat: no-repeat;}
.bubble-text{font-style: italic;}

.page-header p{ font-size: 21px;}
.modal-box{border: 2px solid black;    padding: 10px;margin-bottom: 10px;}
.modal-body.custom-modal-content{    padding: 20px 20px 10px;}
#avatar-continue {font-weight: bold;color: black;text-transform: uppercase;}
#avatar-continue img{margin-left:5px;width: 50px;}
.modal-dialog.custom-modal-dialog .name{padding-top: 0;}


.new-character-list input[type="checkbox"] { display:none;}
.new-character-list input[type="checkbox"] + label {color:#005691; cursor:pointer;}
.new-character-list input[type="checkbox"] + label span {display:inline-block; width:25px; height:25px; margin:0px 6px 3px 0px; vertical-align:middle; cursor:pointer; border:2px solid #E386CE; border-radius:50%; position:relative;background: white;}
.new-character-list input[type="checkbox"]:checked + label span:after{ background:url(./images/checked.svg) no-repeat right 50%; background-size:80%; height:25px; width:25px; top:-4px; right:-4px; content:''; position:absolute;}

.new-character-list .carousel-control-next-icon{background-image: url("./images/right-arrow-b.svg");}
.new-character-list .carousel-control-prev-icon{background-image: url("./images/left-arrow-b.svg");}
.new-character-list .carousel-control-next,.new-character-list .carousel-control-prev{opacity: 1;width: 10%;}
.new-character-list .carousel-item{padding: 15px 35px;text-align: center;}
.new-character-list .ch-title {background: #F9DEF0;    font-weight: bold;padding: 5px;border-radius: 12px 12px 0 0;}
.new-character-list .ch-title label{margin-bottom: 0;font-size: 20px;}
.new-character-list {background: white;border-radius: 10px;box-shadow: 0 3px 6px rgb(0 0 0 / 20%);-webkit-box-shadow: 0 3px 6px rgb(0 0 0 / 20%);margin-bottom: 20px;}
#gate-1 .next-btn,#gate-2 .next-btn,.fixed-btn .next-btn{position: fixed;    bottom: 20px;right: 20px;text-align: center;color: black;font-weight: bold;}
.mybe-heading{margin-bottom: 20px;}
.mybe-heading h1{color:white;text-transform: none;text-align: center;}
.mybe-heading h4{color:white;text-align: center;font-size: 18px;font-weight: normal;text-transform: none;}
h1 span.question{display: none;}

#info-modal .modal-content{    border-radius: 0.5rem;border: 1px solid black;}
#info-modal .modal-body{ padding: 10px;}
body .modal-backdrop.show {opacity: 0.7;background-color: #fff;}
#info-heading{color: #DF1E8A;font-size: 35px;font-weight: bold;text-align: center;    line-height: 40px;text-transform: none;margin-top: 15px;margin-bottom: 15px;}
div#info-heading.color-blue{color: #0087E4;}
div#info-text {font-size: 14px;}
#info-modal button.close{position: absolute;top: -10px;right: -10px;background: white;color: black;border: 1px solid black;border-radius: 100%;width: 20px;height: 20px;opacity: 1;line-height: 16px;font-size: 16px;}
#info-modal .modal-dialog{margin: 20px;}
.wrapper-content-line-selector .wrapper-content-line-here{ border-right:2px solid #d8d8d8;}
.identifying-heading h1{font-size: 4rem;}
.more-examples,.more-examples-1{font-weight: bold;text-decoration:underline;color: black;}
#gate-4 .assessment-options .content .row{min-height: unset;}
/* The Modal (background) */
.img-modal {display: none; /* Hidden by default */position: fixed; /* Stay in place */z-index: 2100; /* Sit on top */padding-top: 50px; /* Location of the box */padding-bottom: 50px;left: 0;top: 0;width: 100%; /* Full width */height: 100%; /* Full height */overflow: auto; /* Enable scroll if needed */background-color: rgb(0,0,0); /* Fallback color */background-color: rgba(0,0,0,0.9); /* Black w/ opacity */}
/* Modal Content (Image) */
.img-modal-content {margin: auto;display: block;width: auto;height: 100%;}
/* The Close Button */
.img-close {position: absolute;top: 15px;right: 35px;color: #f1f1f1;font-size: 40px;font-weight: bold;transition: 0.3s;}
.img-close:hover, .img-close:focus {color: #bbb;text-decoration: none;cursor: pointer;}
.ch-content .carousel-inner{min-height: 10em;display: flex;align-items: center;}
.mybe-card.simple-card{padding: 20px 20px;margin-left: 0;margin-bottom: 40px;    font-size: 20px;cursor: pointer;}
.mybe-card.simple-card.selected{border: 10px solid green;padding: 10px;}

.img-box-content .full-img.mb-4 {width: 100%;padding-top: 100%;position: relative;}
.img-box-content .full-img img {width: 100%;position: absolute;top: 0;bottom: 0;right: 0;left: 0;height: 100%;object-fit: contain;}
.bubble-desc-text-1{position: absolute;top: 50%;padding: 30px;padding-right: 90px;padding-top: 40px;transform: translate(0, -50%);font-style: italic;font-size: 22px;}
#screen-5b .avatar-img-1{ min-height: 600px;  object-fit: contain;}
#screen-5b .container{position: relative;}
#screen-5b.wrapper-bg-pink{background: #faebf6!important;}
.chat-bot{position: relative;bottom: 10px;left: -60px;font-weight: bold;}
#screen-5b .fixed-btn .next-btn{font-size: 15px;}
#screen-6a .sub-container{position: relative;}
#screen-6a .sub-container .w-100{z-index: 2;}
#screen-6a .avatar-img-1{min-height: 600px;  object-fit: contain;}
#screen-6a .sub-container:after{content: "";z-index:1;position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: .4; background-image: url("/wp-content/themes/mybeapp/images/mountain.png");background-size: cover;background-repeat: no-repeat;background-position: -180px 40%;}
#screen-6a .bubble-desc-text-1{padding-top: 85px;font-size: 30px;}
#screen-6a .mybe-card.type-1,#gate-3-feedback .mybe-card:not(.null-card), #gate-4-feedback .mybe-card:not(.null-card){max-width: 400px;margin: 0 15px 15px auto;    padding: 30px 30px;    position: absolute;bottom: 0;right: 0;    z-index: 3;}

#gate-2 input[type="radio"] { display:none;}
#gate-2 input[type="radio"] + label {color:#005691; cursor:pointer;    position: absolute;bottom: 0;right: 0;z-index: 10000;}
#gate-2 input[type="radio"] + label span {display:inline-block; width:25px; height:25px; margin:0px 6px 3px 0px; vertical-align:middle; cursor:pointer; border:2px solid #000; border-radius:50%; position:relative;background: white;}
#gate-2 input[type="radio"]:checked + label span:after{ background:url(./images/checked.svg) no-repeat right 50%; background-size:80%; height:25px; width:25px; top:-4px; right:-4px; content:''; position:absolute;}

.assessment-options .item-name span.question{display: none;}
#gate-3-feedback .sub-container{background-image: url("/wp-content/themes/mybeapp/images/hands.png");    background-size: 80%;background-repeat: no-repeat;background-position: right 25%;}
.support-feedback{    color: #B6008C;font-size: 2.5rem;}
.what-mean .what-head{color: black;font-weight: bold;font-size: 1.5rem;text-decoration: underline;margin-top: 20px;margin-bottom: 30px;}
.what-mean .what-con{font-size: 20px;font-weight: normal;}

.gate-3-heading{padding: 15px;padding-top: 45px;color: white;}
.gate-3-heading h1{    font-size: 3.5rem;    margin-bottom: 25px;}
.gate-3-heading .sub-text{font-size: 2.5rem;font-weight: bold;}
#gate-4-feedback .gate-3-heading .sub-text{font-size: 3rem;text-align: center;margin-bottom: 50px;}
#gate-4-feedback .mybe-card.null-card{max-width: 400px;margin: auto;margin-bottom: 40px;}
#gate-4-feedback .sub-container {background-image: url("/wp-content/themes/mybeapp/images/tree-bg-t.png");background-size: contain;background-repeat: no-repeat;background-position: 80% center;}
#gate-4 .assessment-options ul {    padding-left: 20px;}

.t-2{display: none;}
.video-shown .t-1{display: none;}
.video-shown .t-2{display: inline}

@media only screen and (max-width: 767px){
    .body-title.gate-5{padding: 15px;margin-top: 15px;}
    .assessment-options-selection .item img{max-width:30px;}
    .assessment-options-selection .items{    padding: 12px 10px;}
    .assessment-details{display: block;}
    .assessment-icon{margin: auto;margin-bottom: 10px;max-width: 60px;}
    .gate-5 .assessment-options-selection .content{margin-top: 25px;}
    .gate-5 .assessment-options-selection .continue-btn.next-btn{position: static;}
    .gate-5 .barriers_desc{font-size: 18px;}
    /*.assessment-options-selection .item.active img{max-width:80px;}*/
    /*.assessment-options-selection{min-height:180px;}*/
    /*.assessment-options-selection .items .item.active .item-name{font-size:28px;}*/
    /*.empty-space{height:160px;}*/

    #entry-screen .row.no-gutters{background-size: contain;background-position: bottom;}
    .text-bubble {width: 125px;height: 110px;padding-left: 5px;padding-right: 5px;padding-bottom: 30px;font-size: 10px;}
    .pos-top-left{top: 12%;}
    .pos-bottom-right{display: none;}
    .pos-bottom-left {right: 10%;bottom: 10%;}
    .pos-bottom-left .text-bubble{background: url(./images/bubble-top-left.png);background-size: contain;background-repeat: no-repeat;    padding-top: 10px;padding-bottom: 0;}
    #gate-1 .next-btn, #gate-2 .next-btn, .fixed-btn .next-btn{position: static;}
    #gate-1 .next-btn img, #gate-2 .next-btn img, .fixed-btn .next-btn img{display: block;margin: 0 auto;}
    .mybe-heading h1, .header-absolute h1{ position: relative;font-size: 4rem;}
    h1 span.question {display: block;position: absolute;font-size: 15px;top: 50%;right: 0;transform: translate(-10px, -50%);background: white;color: black;border-radius: 100%;width: 18px;height: 18px;}
    .intro-bg{    background-size: contain;background-position: bottom;}
    #avatar-modal .modal-dialog.custom-modal-dialog{margin: 15px;margin-bottom:0;flex-direction: column;}
    .modal-body.custom-modal-content{padding: 20px 5px 10px;}
    .modal-box{border: 0;    margin-bottom: 0;}
    #avatar-continue img{width: 30px;}
    p#avatar-content {max-height: calc(100vh - 360px);overflow: scroll;}
    .mybe-heading h4{display: none;}
    .mybe-heading h1 { font-size: 40px;   padding-bottom: 15px;padding-top: 20px;}
    .assessment-options .content .bubble-desc-text{
        position: relative;transform: none;
        padding: 0;padding-right: 0;padding-top: 0;
    }
    .bubble-img{display: none;  padding-right: 15px;padding-top: 15px;}
    .assessment-options .content .bubble-desc-text p,.assessment-options .content .bubble-desc-text a {font-size: 15px;}
    .img-modal-content {width: 100%;}
    .img-modal{padding-left: 50px; padding-right: 50px}
    .img-close{top: -10px;right: 20px;}
    .ch-content .carousel-inner{min-height: auto;}
    .bubble-desc-text-1 {position: relative;top: 50%;padding: 0;padding-top: 10px;margin-bottom: 10px;transform: none;font-style: italic;font-size: 14px;}
    .chat-bot {position: fixed;bottom: 10px;right: 5px;left: auto;}
    #screen-5b .fixed-btn .next-btn {position: fixed;left: 0;width: 100px;}
    #screen-5b .fixed-btn .next-btn img{    max-width: 50px;}
    #screen-6a .mybe-card.type-1,#gate-3-feedback .mybe-card:not(.null-card), #gate-4-feedback .mybe-card:not(.null-card){max-width: 210px;padding: 10px;}
    #screen-6a .mybe-card .card-text div,#gate-3-feedback .mybe-card:not(.null-card) .card-text div{font-size: 20px;}
    #gate-4-feedback .mybe-card:not(.null-card) .card-text div{font-size: 17px;}
    #screen-6a .mybe-card .continue-btn, #screen-6a .mybe-card .continue-btn:hover{    background-size: 31px 30px;    padding-top: 35px;}
    #gate-3-feedback .mybe-card:not(.null-card) .continue-btn,#gate-4-feedback .mybe-card:not(.null-card) .continue-btn,
    #gate-3-feedback .mybe-card:not(.null-card) .continue-btn:hover, #gate-4-feedback .mybe-card:not(.null-card) .continue-btn:hover{    background-size: 31px 30px;    padding-top: 35px;}
    #screen-6a .sub-container:after{z-index: -1;}
    #screen-6a .bubble-img{display: block;}
    #gate-4 .bubble-img{display: block;width: 100%;}
    #screen-6a .bubble-desc-text-1, #gate-4 .bubble-desc-text{position: absolute;    padding-top: 0;font-size: 15px;transform: translate(0, -50%);    padding-right: 40px;padding-left: 15px;text-align: center;}
    #gate-4 .bubble-desc-text{padding-top: 45px;}
    #screen-6a .col-10.d-md-none{margin-left: auto;}
    #screen-6a .avatar-img-1{min-height: 425px;}

    .mybe-heading.small h1{font-size: 34px;padding-bottom: 0;}
    .mybe-heading.small h1 span.question{display: none;}
    .mybe-heading.small h4{display: block;font-size: 16px;}
    #gate-2 .next-btn img{    max-width: 35px;}
    #gate-2 .mybe-card{margin-left: 0;padding: 0;}
    #gate-2 .mybe-card.type-1 div{font-size: 16px;font-weight: normal;}

    #gate-2  .carousel-control-next-icon{background-image: url("./images/right-arrow-b.svg");}
    #gate-2  .carousel-control-prev-icon{background-image: url("./images/left-arrow-b.svg");}
    #gate-2  .carousel-control-next,#gate-2  .carousel-control-prev{opacity: 1;width: 10%;}
    #gate-2 .carousel-item{padding: 25px;padding-bottom: 35px;}
    #gate-3 .mybe-card:not(.reponsive-same), #gate-4 .mybe-card:not(.reponsive-same){    padding: 25px 15px;}

    .assessment-options .item-name{ position: relative;}
    .assessment-options .item-name span.question{display: block;position: absolute;font-size: 15px;top: -5px;right: 0;background: white;color: black;border-radius: 100%;width: 18px;height: 18px;border: 1px solid black;line-height: 15px;}
    .support-feedback{font-size: 1.5rem;}
    .what-mean .what-head{    font-size: 1rem;    margin-top: 15px;margin-bottom: 15px;}
    .what-mean .what-con {font-size: 16px;}
    #gate-3-feedback .sub-container{background-size: cover;    background-position: 95% 300px;}
    .gate-3-heading{padding: 15px;padding-top: 45px;color: white;}
    .gate-3-heading h1{    font-size: 40px;    margin-bottom: 25px;}
    .gate-3-heading .sub-text{font-size: 27px;font-weight: bold;}
    .no-br-sm br{font-size: 0;display: none;}
    #gate-4-feedback .gate-3-heading .sub-text {font-size: 1.5rem;text-align: left;margin-bottom: 0;}
    #gate-4-feedback .support-feedback {font-size: 2.5rem;}
    #gate-4 .empty-space{height: 150px;}
    #gate-3-feedback .mybe-card:not(.reponsive-same), #gate-4-feedback .mybe-card:not(.reponsive-same){    padding: 15px 15px;}
}
@media (min-width: 576px) {
    .modal-dialog.custom-modal-dialog {max-width: 750px;}
}
@media (min-width: 1200px) {
    .modal-dialog.custom-modal-dialog {
        max-width: 1140px;
    }
}
@media (min-width: 768px) {
    .no-br br{font-size: 0;display: none;}
}
@media (min-width: 768px) and (max-width: 1600px) {
    .page-header.header-absolute{top: 2%;}
    .page-header p {font-size: 18px;}
}

/* New Css */

.slick-prev:before, .slick-next:before { font-family: "Font Awesome 5 Free",sans-serif;font-weight: 900; font-size: 40px; line-height: 1; color: black; opacity: 0.75; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.slick-prev:before { content: "\f053"; }
[dir="rtl"] .slick-prev:before { content: "\f054"; }

[dir="rtl"] .slick-next { left: -10px; top: 70px; right: auto; }
.slick-next:before { content: "\f054"; }
[dir="rtl"] .slick-next:before { content: "\f053"; }

.question-heading{font-size: 18px;text-align: center;}
.circle-container {position: relative;width: 15em;height: 15em;border-radius: 50%;padding: 0;list-style: none;margin: 7em auto 7em;border: solid 8px #FF50B3;box-shadow: 0 0 3px;}
.circle-container > li {display: block;position: absolute;top: 50%;left: 50%;margin: -3em;width: 20em;cursor: pointer;}
.circle-container > li.active{border: 1px solid black;}
.circle-container > li.completed{filter: grayscale(100%);}
.circle-container > *:nth-of-type(1) {transform: rotate(15deg) translate(11em) rotate(-15deg);}
.circle-container > *:nth-of-type(2) {transform: rotate(60deg) translate(11em) rotate(-60deg);}
.circle-container > *:nth-of-type(3) {transform: rotate(150deg) translate(20.5em) rotate(-150deg);}
.circle-container > *:nth-of-type(4) {transform: rotate(170deg) translate(24.5em) rotate(-170deg);}
.circle-container > *:nth-of-type(5) {transform: rotate(188deg) translate(24.5em) rotate(-188deg);}
.circle-container > *:nth-of-type(6) {transform: rotate(207deg) translate(21em) rotate(-207deg);}
.circle-container > *:nth-of-type(7) {transform: rotate(290deg) translate(10.5em) rotate(-290deg);}
.circle-container > *:nth-of-type(8) {transform: rotate(335deg) translate(11em) rotate(-335deg);}

.circle-container img { max-width: 28%;object-fit: contain;margin-right: 10px;}
.circle-container  .circle-left img{margin-right: 0;margin-left: 10px;}
.circle-inner.circle-left {text-align: right;}
.circle-inner{display: flex;align-items: center;}
.circle-content{ flex: 1; }
.circle-content h3 {font-size: 18px;font-weight: 500;margin-bottom: 0;text-transform: uppercase;}
.circle-content p {font-size: 12px;}
.circle-container > li.center{    margin: 0;width: 13em;transform: translate(-50%, -50%);text-align: center;}
.circle-container > li.center h4{    font-size: 1rem;font-weight: 500;text-transform: uppercase;margin-top: 10px;margin-bottom: 0;}
.circle-container > li.center img{ max-width: 7em;}
/*.circle-container p.learner_support {max-width: 80%;margin: auto;}*/

@media (max-width: 767px) {
    .circle-content{display: none;}
    .circle-container{width: 11em;height: 11em;}
    .circle-container img{max-width: 100%;margin-right:0;    margin-left: 0;}
    .circle-container > li {width: 5em;}
    .circle-container > li.center h4 { font-size: 13px; }
    .circle-container > *:nth-of-type(1) {transform: rotate(18deg) translate(9em) rotate(-18deg);}
    .circle-container > *:nth-of-type(2) {transform: rotate(60deg) translate(9em) rotate(-60deg);}
    .circle-container > *:nth-of-type(3) {transform: rotate(105deg) translate(9em) rotate(-105deg);}
    .circle-container > *:nth-of-type(4) {transform: rotate(145deg) translate(9em) rotate(-145deg);}
    .circle-container > *:nth-of-type(5) {transform: rotate(190deg) translate(8em) rotate(-190deg);}
    .circle-container > *:nth-of-type(6) {transform: rotate(245deg) translate(8em) rotate(-245deg);}
    .circle-container > *:nth-of-type(7) {transform: rotate(290deg) translate(8.5em) rotate(-290deg);}
    .circle-container > *:nth-of-type(8) {transform: rotate(338deg) translate(9em) rotate(-338deg);}
    .wrapper-bg-pink{background: #faebf6!important;}
    .circle-container p.learner_support {font-size: 14px;line-height: 1em;margin-top: 5px;}
    .circle-container > li.center{    width: 10em;}
}

.mybe-help{position: fixed;top: 20px;right: 20px;background: white;border: 1px solid black;box-shadow: 1px 1px 3px grey;;border-radius: 6px;padding: 23px 20px;z-index: 2000;cursor: pointer;}
.help-enabled .mybe-help{width: 85%;padding: 8px 15px;}
.mybe-help-text{position: relative;padding: 10px;min-height: 190px;display: none;}
.help-enabled .mybe-help-text{display: block;}
.question-mark {position: absolute;top: 7px;right: 11px;font-size: 20px;color: #F00087;}
.main-container.visible.help-enabled:after{content:'';width: 100%;height: 100%;background: #ffffff82;top: 0;    position: absolute;}

.mybe-popup{z-index: 1072;position: fixed;top: 0;right: 0;bottom: 0;left: 0;display:none;}
.mybe-popup .mybe-dialog{transition: -webkit-transform .3s ease-out;transition: transform .3s ease-out;-webkit-transition: .3s ease-out;-webkit-transform: translate(0,-25%);transform: translate(0,-25%);max-width: 600px;margin: 1.75rem auto;min-height: calc(100% - (1.75rem * 2));display: flex;align-items: center;}
.popup-enabled .mybe-popup{display: block;}
.popup-enabled .mybe-popup .mybe-dialog{-webkit-transform: translate(0,0);transform: translate(0,0);}

.mybe-content{background: white;    border: 1px solid #828080;border-radius: 8px;margin: auto;}
.mybe-top {border-bottom: 1px solid #aca8a8;text-align: center;padding: 20px;}
.mybe-bottom {padding: 20px 10px;width: 80%;margin: 0 auto;}
.mybe-bottom h4{font-size: 1em;}

.mybe-icon{text-align: center;}
.mybe-icon img{    margin-top: -30px;max-width: 60px;}
.mybe-dialog h3{font-size: 1.3em;text-transform: uppercase;margin-bottom: 0;}
.mybe-dialog h6{font-weight: 600;margin-bottom: 10px;}
.mybe-dialog .ital{font-weight: 400;font-style: italic;color: #3e3d3d}
.mybe-dialog h4{font-weight: 600;margin-bottom: 30px;text-align: center;}
.mybe-dialog button{    border: 0;box-shadow: 0 3px 6px #bcbcbc;border-radius: 7px;text-transform: uppercase;font-weight: 600;font-size: 18px;padding: 3px 10px;background: white;}

.mybe-dialog input[type="radio"]{visibility: hidden;height: 0;display: block;}
.mybe-dialog input[type="radio"]+label{display: block;cursor: pointer;padding-left: 26px;position: relative; margin-bottom: 15px;font-size: 16px;}
.mybe-dialog input[type="radio"]+label span {display: inline-block;width: 10px;height: 10px;border: 1px solid #5d5d5d;border-radius: 50%;position: absolute;top: 50%;transform: translate(0, -50%);left: 10px;box-shadow: 1px 1px 2px #9d9d9d;}
.mybe-dialog input[type="radio"]:checked + label span{background-color: #5d5d5d;}

.main-container.visible.popup-enabled:after{content:'';width: 100%;height: 100%;background: #ffffff82;top: 0;    position: absolute;}
.more-examples, .more-examples-1{cursor: pointer;}
.mybe-dialog .more-examples, .mybe-dialog .more-examples-1{font-weight: normal;}

#gate-4 .mybe-bottom{width: 95%;}
#gate-4 .mybe-dialog input[type="radio"]+label{padding-left: 33px;}
#gate-4 .mybe-popup .mybe-dialog{max-width: 700px;}
#gate-4 .mybe-top{border-bottom:none;}

.btn-fixed{    position: fixed;bottom: 20px;right: 20px;}

.mybe-heading h1.active{font-size: 2.5em;}
.simple-card.selected.negative-red{border: 10px solid #D61E22;}
.simple-card.selected.negative-orange{border: 10px solid #FFC367;}
a.continue.next-btn.end-btn {right: 100px;}

#capable-popup{border: 1px solid #bcbcbc;box-shadow: 0 2px 1px #bcbcbc;border-radius: 7px;text-transform: uppercase;font-weight: 400;font-size: 16px;padding: 3px 10px;background: white;margin-top: 20px;    margin-bottom: 20px;}
#congratulations .mybe-popup .mybe-dialog{    max-width: 850px;}
#congratulations .mybe-bottom {padding: 45px 10px;width: 85%;}
#congratulations .mybe-popup h5{font-weight: 600;font-size: 1.35em;    margin-bottom: 40px;}
#congratulations .selection-box {border: 2px solid #bcbcbc;margin-bottom: 25px;border-radius: 8px;padding: 12px;box-shadow: 2px 1px 3px #bcbcbc;cursor: pointer;}
#congratulations .selection-box h4 {text-align: left;font-size: 1.1em;}
#congratulations .selection-box h4 a{color: black;}
#congratulations .selection-box.selected{ border: 4px solid #000;box-shadow:none; }
.capable-form [class*=col-]{text-align: right;}
.capable-form label{ margin-right: 5px; }
.capable-form input{ height: 30px;border: 2px solid #bcbcbc;margin-bottom: 5px;}
.course-list p span.course-key{display: none;}
.show-key .course-list p span.course-key{display: block;}
.key-text{display: none;}
.show-key-text .key-text{display: block;}

.need-more-support{border: 1px solid;box-shadow: 1px 3px 6px #bcbcbc;border-radius: 7px;font-weight: 600;font-size: 12px;padding: 0 5px;background: white;line-height: 25px;float: right;margin-top: 5px;}
.need-more-support i{color: red;}
#avatar-modal #avatar-img{max-height: 400px;}

@media (max-width: 767px) {
    .mybe-help{top: 10px;right: 11px;    padding: 15px 14px;}
    .help-enabled .mybe-help   {    width: 93%;}
    .question-mark {top: 5px;right: 9px;font-size: 13px;color: #F00087;}
    .mybe-popup .mybe-dialog{padding: 10px;min-height:auto;    margin-top: 50px;}
    .mybe-top{padding: 20px 5px;}
    .mybe-bottom{width: 100%;padding-bottom: 0;}
    .mybe-dialog h3 {font-size: 1.2em;}
    .mybe-dialog h6 {font-size: 14px;}
    .mybe-dialog .ital{font-size: 14px;}
    .mybe-dialog h4{margin-bottom: 20px;font-size: 14px;}
    .mybe-dialog input[type="radio"]+label{padding-left: 18px;font-size: 13px;}
    .mybe-dialog input[type="radio"]+label span{left: 0;}
    #gate-4 .mybe-bottom {width: 98%;}
    #gate-4 .mybe-dialog input[type="radio"]+label {padding-left: 15px;font-size: 12px;    margin-bottom: 8px;}
    #gate-4 .mybe-popup .mybe-dialog{margin-top: 40px;}
    #gate-4 .mybe-bottom{padding-top: 0;}
    #gate-4 .mybe-content .mb-4{margin-bottom: 1rem !important;}
    #gate-4 .mybe-dialog h6 {font-size: 13px;}
    a.continue.next-btn.end-btn {bottom: 105px;}
    .need-more-support{margin-top: -5px;    font-size: 7px;}
}

@media (min-width: 1400px) {
    .container.container-enlarged{max-width: 1250px;}
}

.intro-bg.expand-container .login-form{max-width: unset;}
.intro-bg.expand-container .lrm-user-modal-container{max-width: unset;}
.intro-bg.expand-container .facebook-btn img{max-width: 300px;}
.login-form > .msg-content{display: none;}
.intro-logo{margin: 0 auto 10px;}
.expand-container .intro-logo img{max-height: 200px;}
.login-form .or{    margin: 20px 0;}
.expand-container .lrm-user-modal-container{margin: 0;margin-bottom: -40px;}
.expand-container .lrm-form button[type="submit"]{width: 175px !important;}
.login-form form .form-control, .login-form form .form-control:focus{color: white;    padding-left: 12px;}
.lrm-signup-section .lrm-fieldset-wrap{display: flex;flex-wrap: wrap;margin-right: -5px;margin-left: -5px;}
.lrm-signup-section .fieldset{position: relative;width: 100%;padding-right: 5px!important;padding-left: 5px!important;flex: 0 0 50%;max-width: 50%;}
body .lrm-signup-section .lrm-form .fieldset, .lrm-integrations--register{margin-bottom: 10px;}
.lrm-signup-section .lrm-integrations.lrm-integrations--register{flex: 0 0 15%;max-width: 15%;}
.fieldset.fieldset--title,.fieldset.fieldset--address_line_1,
.fieldset.fieldset--highest_qualification, .fieldset.fieldset--submit{ flex: 0 0 100%;max-width: 100%;}
.lrm-signup-section .lrm-fieldset-wrap .fieldset:nth-of-type(2){display: none;}
.lrm-signup-section .lrm-fieldset-wrap .fieldset:nth-of-type(3){flex: 0 0 35%;max-width: 35%;}
.fieldset.fieldset--city, .fieldset.fieldset--postcode{flex: 0 0 25%;max-width: 25%;}
.fieldset.fieldset--religion, .fieldset.fieldset--ethnic_origin, .fieldset.fieldset--marital_status{flex: 0 0 33.33%;max-width: 33.33%;}
body .lrm-form input.has-padding {height: 52px!important;}
body .lrm-user-modal-container{margin-bottom: 0;}

.login-form form .form-control::placeholder {opacity: 0.8;}
.login-form form .form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */opacity: 0.8;}
.login-form form .form-control::-ms-input-placeholder { /* Microsoft Edge */opacity: 0.8;}
.login-form form select.placeholder {color: #ffffffcc;}
#logout-btn{position: fixed;top: 20px;left: 20px;background: white;border: 1px solid black;box-shadow: 1px 1px 3px grey;border-radius: 6px;padding: 5px 10px;z-index: 2000;cursor: pointer;font-weight: 700;font-size: 18px;}
#logout-btn a{color: black;}

/* New Modifications */
.lrm-user-modal-container .lrm-form button[type="submit"] {width: 170px !important;    min-height: 41px;height: auto;}
.lrm-reset-password-section button.full-width {width: 170px !important;}
#congratulations h1,#courses h1 {background: #BD1B8E;color: #fff;text-transform: capitalize;padding: 10px 50px;}
#congratulations .section-ss .heading-ss {background: #B02294; color: #fff;text-align: center;padding: 10px;}
#congratulations .section-ss .paragraph-ss {background: #F7E1F0;padding: 15px;}
#congratulations .section-ss #congratulations .section-ss .box_ss {max-width: 320px;}
#congratulations .section-ss .heading-ss h5 {max-width: 200px;margin: auto;}
#congratulations .section-ss .left-ss.mt-5 { position: relative;}
#congratulations .section-ss .info-ss {border: 20px solid #DB8AC5;margin-top: 50px;max-width: 400px;padding: 35px;margin: auto;max-height: 400px;}
#congratulations .section-ss .progression-level-ss span {width: 30px;height: 30px;background: #fff;display: inline-block;border-radius: 100%;margin: 0 2px;}
#congratulations .section-ss .progression-level-ss {background: #F7E1F0;text-align: center;line-height: normal;padding: 10px;max-width: 170px;margin: 20px auto;}
#congratulations .section-ss .image-ss {position: absolute;left: -9%;top: 55%;max-width: 360px;}
#congratulations .section-ss .blockHead:after {color: #B02294;border-left: 40px solid;border-top: 40px solid transparent;border-bottom: 40px solid transparent;display: inline-block;content: '';position: absolute;right: -40px; top: -19px;}
#congratulations .section-ss .blockHead {background-color: #B02294;width: 72px;height: 40px;line-height: 40px;display: inline-block;position: absolute;right: 11%;z-index: 1;}
#congratulations .section-ss .blocktext {color: white;font-weight: bold;padding-left: 10px;position: absolute;z-index: 1;right: -7px;} 
 /* popover */
#congratulations .section-ss details[data-popover] {display: inline;position: relative;}
#congratulations .section-ss details[data-popover] > summary:focus {outline: none;}
#congratulations .section-ss details[data-popover] > summary::-webkit-details-marker {display: none;}
#congratulations .section-ss details[data-popover] > summary {list-style: none;text-decoration: underline dotted #F7E1F0;}
#congratulations .section-ss details[data-popover] > summary + * {position: absolute;display: block;z-index: 1;border: solid 4px #B02294;border-radius: 70px;padding: 10px;background: #F7E1F0;}
#congratulations .section-ss details[data-popover] > * + * {/* hide detail elements that would ruin the popover */display: none;}
#congratulations .section-ss details[data-popover="up"] > summary + * {bottom: calc(1.5rem + 100%);right: 0;width: 300px;min-height: 75px;transform: translateX(70%);display: flex;justify-content: center;align-items: center;}
#congratulations .section-ss details div:after {position: absolute;z-index: -1;content: "";left: 19%;bottom: -10px;border-style: solid;border-width: 0 10px 10px 10px;border-color: transparent transparent #B02294 transparent;transition-duration: 0.3s;transition-property: transform;transform: rotate(180deg);} 
#congratulations .section-ss .other-info-ss .prog-level {font-size: 20px;font-weight: bold;color: #BD1B8E;max-width: 160px;margin: auto;}
#congratulations .section-ss .other-info-ss .progress-img {max-width: 128px;margin-top: 20px;}
#congratulations .section-ss .center-ss {margin-top: 50px;}
#congratulations .section-ss .other-info-ss h6 ,.other-info-ss .prog-level {font-size: 20px;font-weight: 700;text-transform: capitalize;}
#congratulations .section-ss .progression-level-ss .Medium-ss.active {background: #DB8AC5;}
#congratulations .section-ss .progression-level-ss .High-ss.active {background: #d444ae;}
#congratulations .section-ss .progression-level-ss .Extreme-ss.active {background: #BD1B8E;}

#courses .title-ss {text-align: center;background: #F7E1F0;height: 110px;}
#courses .right-img-ss {padding: 0px 170px;position: relative;margin: 20px 0;}
#courses .right-img-ss:after {content: "";width: 235px;height: 235px;background: url(/wp-content/themes/mybeapp/images/2-new.svg);top: 58%;right: -2%;position: absolute;display: inline-block;background-size: contain;background-repeat: no-repeat;}
#courses .right-img-ss:before {content: "";width: 205px;height: 340px;background: url(/wp-content/themes/mybeapp/images/2-male-new.png);left: 0%;top: 28%;position: absolute;display: inline-block;z-index: 1;background-size: contain;background-repeat: no-repeat;}
#courses .title-ss h4 {font-size: 14px;    display: flex;height: 100%;justify-content: center;align-items: center;text-transform: capitalize;padding: 0 15px;}
#courses .course {flex: 0 0 33.333333%;margin-top: 20px;padding: 0 15px;}
#courses .course-list {display: flex;flex-wrap: wrap;}
#courses .course a {color: #6c757d;;text-decoration: none;}
.width-ss {width: 65%;}
.no_courses_ssc {display: flex;align-items: center;justify-content: center;}
#congratulations .section-ss .progression-level-ss button.need-more-support { background: transparent;border: none;width: 97px;display: inline-block;box-shadow: none;font-size: 9px;margin-bottom: 1rem;}

  @media (max-width: 767px){
  #congratulations .section-ss .box_ss {max-width: 100%;}

   /* NEw */
   #congratulations .section-ss {display: block;}
   #courses .right-img-ss {padding: 0;}
   #congratulations .section-ss .image-ss img {top: auto;left: auto;position: relative;}
   #courses .course{margin-top: 15px;flex: 0 0 100%;}
   #congratulations .section-ss .box_ss { max-width: auto;}
   #congratulations .section-ss .image-ss {position: inherit;margin: auto;}
   #courses .right-img-ss:before,#courses .right-img-ss:after{display: none;}
   #congratulations .section-ss .left-ss {margin-top: 0px !important;}
}
  

@media (max-width:991px) and (min-width:768px) {
    #congratulations .section-ss .heading-ss h5 ,#congratulations .section-ss p {font-size: 14px;}
    #congratulations .section-ss .heading-ss h4 { font-size: 20px;}
    #congratulations .section-ss .other-info-ss h6, .other-info-ss .prog-level,#congratulations .section-ss .other-info-ss .prog-level {font-size: inherit;}
    #congratulations .section-ss .image-ss {left: -30%;}
    #congratulations .section-ss .other-info-ss .progress-img {max-width: 90px;margin-top: 10px;}
    #courses .right-img-ss:after {width: 195px;height: 195px;top: auto;bottom: 0%;left: auto;right: -9%;background-size: contain;background-repeat: no-repeat;}
    #courses .right-img-ss:before{width: 290px;height: 290px;bottom: 0%;top: auto;left: -9%;background-size: contain;background-repeat: no-repeat;}
    #courses .right-img-ss {padding: 0px 70px;}
    #courses .course {flex: 0 0 50%;}
    #congratulations .section-ss .image-ss {left: -14%;width: 85%;}
   
}

@media (max-width:1200px) and (min-width:991px) {
    #congratulations .section-ss .image-ss {left: -12%;}
    #courses .course {flex: 0 0 50%;}
    #courses .right-img-ss:before{top:auto;bottom: 0%;}
}

@media (max-width: 448px){
    #congratulations .section-ss .progression-level-ss {margin: auto;margin-bottom: 20px;}
    #congratulations .section-ss .other-info-ss .progress-img {margin-top: 10px;max-width: 80px;}
    #congratulations .section-ss .info-ss {min-height: auto;min-width: auto;width: 350px;height: 350px;display: flex;align-items: center;justify-content: center;}
    
}

@media (max-width: 360px){
#congratulations .section-ss .info-ss { width: 300px;height: 300px;}
#congratulations .section-ss .progression-level-ss {margin-bottom: 0;margin-top: 20px;}
#congratulations .section-ss .other-info-ss h6, .other-info-ss .prog-level {font-size: 17px;}
}






/* Remove css */
.plan-box {display: none !important;}
#congratulations .section-ss #support_objectives:after{display: none;
}
#congratulations .section-ss #support_objectives {border-right: none;}