@charset "utf-8";
/*@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Merriweather:wght@300;400;700;900&display=swap');

@font-face {
    font-family: 'Conv_FoundersGrotesk-Light';
    src: url('../fonts/FoundersGrotesk-Light.eot');
    src: local(''), url('../fonts/FoundersGrotesk-Light.woff') format('woff'), url('../fonts/FoundersGrotesk-Light.ttf') format('truetype'), url('../fonts/FoundersGrotesk-Light.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Conv_FoundersGrotesk-Regular';
    src: url('../fonts/FoundersGrotesk-Regular.eot');
    src: local(''), url('../fonts/FoundersGrotesk-Regular.woff') format('woff'), url('../fonts/FoundersGrotesk-Regular.ttf') format('truetype'), url('../fonts/FoundersGrotesk-Regular.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Conv_FoundersGrotesk-Medium';
    src: url('../fonts/FoundersGrotesk-Medium.eot');
    src: local(''), url('../fonts/FoundersGrotesk-Medium.woff') format('woff'), url('../fonts/FoundersGrotesk-Medium.ttf') format('truetype'), url('../fonts/FoundersGrotesk-Medium.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Conv_FoundersGrotesk-Bold';
    src: url('../fonts/FoundersGrotesk-Bold.eot');
    src: local(''), url('../fonts/FoundersGrotesk-Bold.woff') format('woff'), url('../fonts/FoundersGrotesk-Bold.ttf') format('truetype'), url('../fonts/FoundersGrotesk-Bold.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Conv_FoundersGrotesk-Semibold';
    src: url('../fonts/FoundersGrotesk-Semibold.eot');
    src: local(''), url('../fonts/FoundersGrotesk-Semibold.woff') format('woff'), url('../fonts/FoundersGrotesk-Semibold.ttf') format('truetype'), url('../fonts/FoundersGrotesk-Semibold.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}
 

*{
    outline:none;
    padding:0px;
    margin:0px;
}
body{
    margin: 0px;
    padding: 0px;
    font-family: 'Conv_FoundersGrotesk-Regular';
    color: #4d4e4e;
    font-size: 15px;
    font-style: normal;
    font-weight: normal;
    letter-spacing: normal;
}   
.clear{ clear:both; }

img{max-width:100%;}
.logo {
    text-align: left;
}

p {
    font-size: 15px;
    line-height: 22px;
    color:#4d4e4e;
    margin: 10px auto;
    font-family: 'Conv_FoundersGrotesk-Light';
}
.navbar.navbar-light.top-menu {
    padding: 0;
}
.topheader {
    padding: 5px 0;
    position: relative;
}
.wyn-logo img {
    width: 200px;
}

.top-menu.navbar-light  .navbar-nav > li > a {
    color: #4d4e4e;
    padding: 6px 15px;
    margin-right: 5px;
    font-size: 17px;
    text-align: center;
    font-weight: 500;
    border-radius: 0px;
}
.top-menu.navbar-light  .navbar-nav > li > a:hover {
    background: transparent;
    color: #13b89d;
    outline: none;
    font-weight: 500;
} 

.top-menu.navbar-light .navbar-nav > li.active > a, 
.top-menu.navbar-light .navbar-nav > li > a:focus {
    background: transparent;
    color: #13b89d;
    outline: none;
    font-weight: 800;
} 


.head-slider {
    position: relative;
    padding-bottom: 10px;
    margin: 10px;
}
.head-box {
    width: 100%;
    height: 400px;
}
.head-box img {
    width: 100%;
    height: 100%;
    /* max-height: 400px; */
    object-fit: fill;
    border-radius: 10px;
}

.owl-theme .owl-dots {
    position: absolute;
    right: 0;
    bottom: 10px;
    left: 0;
    z-index: 15;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-left: 0;
    margin-right: 15%;
    margin-left: 15%;
    list-style: none;
}

.owl-theme .owl-dots .owl-dot span {
    width: 12px;
    height: 12px;
    border-radius: 100px;
    border: 1px #028fb0 solid;
    line-height: 12px;
}

.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    border: 1px #028fb0 solid;
    background: #028fb0;
}

.head-slider .head-prev {
    left: 0px;
}
.head-slider .head-next {
    right: 0px;
}

.head-slider .owl-prev, .head-slider .owl-next {
    text-indent: -99999px;
    visibility: hidden;
}
.head-slider .owl-prev:before, 
.head-slider .owl-next:before{
    content:'';
    font-family: Font Awesome\ 5 Free;
    font-weight: 900;
    position: absolute;
    top: 50%;
    text-indent: 0px;
    visibility: visible;
    margin-top:-30px;
}
.head-slider .owl-prev:before {content:'\f053'; left:10px }

.head-slider .owl-next:before {content:'\f054';right: 10px;} 

.owl-theme .owl-nav {
    margin: auto;
    height: 0;
}

/*.carousel-item {
    width: auto; 
}

.carousel-control-next, .carousel-control-prev {
   width: 45px;
   opacity: .5;
   background: #fff;
   height: 60px;
   top: 50%;
   margin-top: -60px;
   color: #000;
   font-size: 30px;
   line-height: 30px;
   text-align: center;
}


.carousel-control-next-icon, .carousel-control-prev-icon {
    background-image: none !important;
    background: transparent;
    line-height: 0;
    height: auto;
    width: auto;
    text-align: center;
}
.carousel-control-next:focus, .carousel-control-next:hover, .carousel-control-prev:focus, .carousel-control-prev:hover {
    color: #13b89d;
}

.carousel-indicators li {
    width: 12px;
    height: 12px;
    border-radius: 100px;
    border: 1px #028fb0 solid;
    line-height: 12px;
}

.carousel-indicators .active {
    border: 1px #028fb0 solid;
    background: #028fb0;
} 
.carousel-indicators {
    bottom: 0; 
    margin-bottom: 0;
    position: inherit !important;
}*/

.contentPanel {
    padding: 0 0;
    position: relative;
}

.user-leftPanel {
    background: #13b89d;
    border-radius: 10px;
    padding: 10px 10px;
    position: relative;
    /* min-height: 720px; */
    margin: 10px;
}
.userinfo {
    text-align: center;
    position: relative;
    margin: auto;
    padding: 10px 0;
}
.changephoto  {
    color: #484848;
    text-decoration: underline;
    position: absolute;
    bottom: 5px;
    right: 5px;
    width: 30px;
    height: 30px;
    background: #b8bcbb;
    border-radius: 100%;
    font-size: 13px;
    line-height: 32px;
    border: 1px #dadedd solid;
} 


.user-img {
    border-radius: 100%;
    width: 130px;
    height: 130px;
    max-width: 100%;
    position: relative;
    margin: auto;
}

.user-img img {
    border: 5px rgb(255 255 255 / 25%) solid;
    border-radius: 100%;
    width: 130px;
    height: 130px;
    max-width: 100%;
    object-fit: fill;
    -o-object-fit: fill;
}

h3.welcomeMsg {
    color: #fff;
    font-size: 1.5rem;
    font-weight: 500;
    padding: 20px 0 0;
    text-align: center;
    margin: auto;
}

.user-leftPanel h4 {
    text-transform: uppercase;
    font-weight: 500;
    font-size: 1rem;
    color: #fff;
    vertical-align: middle;
    margin: 5px auto;
    letter-spacing: 0.5px;
    text-align: center;
    line-height: normal;
    vertical-align: middle;
}

.user-pnts {
    color: #fff;
    padding: 5px 0;
    margin: auto;
}


.badges-list h4 span, .user-ranking h4 span {
    display: inline-block;
    text-align: right;
    float: right;
    font-size: 14px;
    text-transform: none;
    vertical-align: middle;
    font-weight: 300;
    font-family: 'Conv_FoundersGrotesk-Light';
}

.badges-list h4 span i, .user-ranking h4 span i {
    vertical-align: middle;
}

.badges-list {
    position: relative;
    padding: 10px 0;
} 
.badges-list ul li {
    width: 25%;
    list-style: none;
    display: inline-block;
    text-align: center;
    color: #fff;
    margin: 5px 7px;
    vertical-align: top;
}

.badges-list ul li span {
    display: block;
    text-align: center;
    margin: auto;
}

.badges-list ul li h5 {
    font-size: 14px;
    font-weight: 300;
    margin: 7px auto;
}

.badges-list ul li span img {
    width: 40px;
    vertical-align: top;
}

.list-group-item {
    background: #ffffff;
    border: 0;
    margin: 3px 0;
    width: 100%;
    border-radius: 5px;
    /*box-shadow: 0px 0px 2px 0px rgb(0 0 0 / 35%);*/
    text-align: left;
    padding: 0px 0px;
    -webkit-transition: box-shadow,transform .25s ease-in-out;
    -moz-transition: box-shadow,transform .25s ease-in-out;
    -ms-transition: box-shadow,transform .25s ease-in-out;
    -o-transition: box-shadow,transform .25s ease-in-out;
    transition: box-shadow,transform .25s ease-in-out;
}

.list-group-item a {
    color: #333;
    display: block;
    height: 100%;
    vertical-align: middle;
    text-decoration:none;
}
.list-group-item h5 {
    font-weight: 400;
    font-size: 15px;
    display: inline-block;
    padding: 15px 10px 10px;
    margin: auto;
    font-family: 'Conv_FoundersGrotesk-Medium';
    vertical-align: middle;
}

.list-group-item a span {
    float: right;
    background: #FE0000;
    display: inline-block;
    width: 43px;
    height: 43px;
    text-align: center;
    padding: 5px 10px;
    color: white;
    text-transform: uppercase;
    font-weight: 700;
    vertical-align: middle;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    font-size: 20px;
    line-height: 42px;
}
li.list-group-item:hover {
    background: #f2f9fb;
    box-shadow: 0 2px 4px 0 hsla(0,0%,58.8%,.6);
     -webkit-transform: scale(1.04);
    -moz-transform: scale(1.04);
    -ms-transform: scale(1.04);
    -o-transform: scale(1.04);
    transform: scale(1.04);
}
.list-group-item a:hover{
    color:#237abd;
}
.list-group-item a:hover {
    color: #13b89d;
}
.greencolor{
    background: #8ec641 !important;
} 

.yellowcolor {
    background: #e9e430 !important;
    color: #333 !important;
}

.block {
    border-radius: 10px;
    background-color: #f2f9fb;
    margin: 10px auto;
    padding: 15px 15px;
    position: relative;
    display: inline-block;
    width: 100%;
}

h2.heading {
    color: #333333;
    font-weight: normal;
    font-size: 1.2rem;
    /*margin: 10px auto;*/
    text-align: center;
    font-family: 'Conv_FoundersGrotesk-Semibold';
}

.whatsnew-sec {
    width: 98%;
    margin: auto;
    text-align: center;
    position: relative;
}
.whatsnew-second {
    width: 70%;
    margin: auto;
    text-align: center;
    position: relative;
    max-width: 100%;
} 
.whatsnew-card {
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 2px 4px 1px rgba(0, 0, 0, 0.13);
    text-align: center;
    position: relative;
    min-height: 200px;
    margin: 10px auto;
    cursor:pointer;
    -webkit-transition: box-shadow,transform .25s ease-in-out;
    -moz-transition: box-shadow,transform .25s ease-in-out;
    -ms-transition: box-shadow,transform .25s ease-in-out;
    -o-transition: box-shadow,transform .25s ease-in-out;
    transition: box-shadow,transform .25s ease-in-out;
    width: 235px;
    max-width: 100%;
    min-height: 210px;
} 
.whatsnew-card:hover {
     background: #fff;
    box-shadow: 0 2px 3px 0 hsla(0,0%,58.8%,.6);
    -webkit-transform: scale(1.04);
    -moz-transform: scale(1.04);
    -ms-transform: scale(1.04);
    -o-transform: scale(1.04);
    transform: scale(1.04);
}

.whatsnew-icon {
    padding: 0px 0px;
    text-align: center;
    border-bottom: 2px #d9dbdc solid;
}

.whatsnew-icon img {
     height: 130px;
    width: 100%;
    border-radius: 10px 10px 0px 0px;
    width: 100%;
    object-fit: fill;
    -o-object-fit: fill;
    max-width: 100%;
}
.whatsnew-title {
    padding: 10px 10px;
}
.whatsnew-title h3 {
    margin: 8px auto;
    font-size: 1rem;
    font-weight: 700;
}
.whatsnew-card:hover .whatsnew-title h3 {
    color: #13b89d;
}
 
.owl-theme .owl-nav [class*=owl-] {
    /* position: absolute; */
    /* top: 50%; */
    background: transparent;
    color: #333333;
    font-size: 32px;
    /* margin-top: -16px; */
}
.owl-theme .owl-nav [class*=owl-]:hover {
    background: transparent;
     color: #13b89d;
}

.whatsnew-sec .owl-prev {
    left: -35px;
}
.whatsnew-sec .owl-next {
    right: -35px;
}

.whatsnew-sec .owl-theme .owl-nav [class*=owl-] {
    position: absolute; 
    top: 50%;  
     margin-top: -16px;
}

.userKudo {
    background: #fff;
    border-radius: 3px;
    padding: 15px 15px;
    margin: 10px auto;
    box-shadow: 0px 3px 1px 0px rgba(0, 0, 0, 0.15);
    -moz-transition: 0.25s ease-in-out;
    -ms-transition: 0.25s ease-in-out;
    -o-transition: 0.25s ease-in-out;
    -webkit-transition: 0.25s ease-in-out;
    transition: 0.25s ease-in-out;
}

.userKudo h3 {
    color: #333;
    font-size: 1.2rem;
    font-weight: 400;
    font-family: 'Conv_FoundersGrotesk-Medium';
}


h5.kudosby {
    text-align: right;
    font-size: 13px;
    font-weight: 500;
    font-style: italic;
    color: #4d4e4e;
    padding-top: 10px;
    border-top: 1px solid #d9dbdc;
}

#footer {
    background: #4d4e4e;
    padding: 20px 0;
    position: relative;
}

.footerlinks {
    position: relative;
    vertical-align: middle;
    display: inline-block;
    padding: 25px 0;
}

.footerlinks a {
    display: block;
    color: #fff;
    font-weight: 300;
    text-decoration: none;
    font-size: 13px;
    padding: 3px 0;
}

.foot-logo {
    text-align: right;
}

.copywrite {
    color: #fff;
    text-align: right;
    padding: 15px 0 0;
    font-size: 13px;
    line-height: 25px;
}

.btn-secondary {
    color: #ffffff !important;
    border: 1px #b8bcbb solid !important;
    padding: 9px 15px 5px !important;
    line-height: 17px;
    border-radius: 50px !important;
    background: #b8bcbb; 
     font-family: 'Conv_FoundersGrotesk-Regular';
    -webkit-transition: all 0.2s ease;
    -moz-transition: all 0.2s ease;
    -ms-transition: all 0.2s ease;
    -o-transition: all 0.2s ease;
    transition: all 0.2s ease;
}
.btn-secondary:hover,
.btn-secondary:not(:disabled):not(.disabled).active, 
.btn-secondary:not(:disabled):not(.disabled):active, 
.show>.btn-secondary.dropdown-toggle {
    color: #fff !important;
    background:#4d4e4e !important;
    border: 1px #4d4e4e solid !important;
    outline: none;
} 

.btn-secondary.focus, .btn-secondary:focus {
    color: #fff !important;
    background:#4d4e4e !important;
    border: 1px #4d4e4e solid !important;
    outline: none; 
} 


.btn-outline-primary {
     color: #4d4e4e !important;
    border: 1px #4d4e4e solid !important;
    padding: 9px 15px 5px !important;
    line-height: 17px;
    border-radius: 50px !important;
    background: #fff;
}


.btn-outline-primary:hover,
.btn-outline-primary:not(:disabled):not(.disabled).active, 
.btn-outline-primary:not(:disabled):not(.disabled):active, 
.show>.btn-outline-primary.dropdown-toggle {
    color: #fff !important;
    background:#4d4e4e !important;
    border: 1px #4d4e4e solid !important;
}

.btn-outline-primary i,
.btn-secondary i{
    font-size: 13px; 
    padding-left:5px;
}

 .modal-header {
    border: 0;
}

button.close {
    width: 30px;
    height: 30px;
    background: #333333;
    opacity: 1;
    border-radius: 100px;
    line-height: 30px;
    text-align: center;
    padding: 0.2rem !important;
    margin: 0.1rem 0.1rem 0.1rem auto !important;
}

button.close span {
    line-height: 15px;
    display: inline-block;
    font-size: 20px;
    color: #fff;
}


.newsfeed-img {
    padding: 10px 10px;
    text-align: center;
}
 
.newsfeed-desc h3 {
    color: #333333;
    font-weight: normal;
    font-family: 'Conv_FoundersGrotesk-Semibold';
    font-size: 1.3rem;
}

.newsfeed-desc h5 {
    color: #028fb0;
    font-family: 'Conv_FoundersGrotesk-Medium';
    font-size: 1rem;
}

.newsfeed-desc h6 {
    font-style: italic;
    color: #9a9797;
    padding: 20px 0 0;
    font-size: 0.9rem;
}

.carousel-item img {
    width: 100%;
    height:90vh;
    max-height: 100%;
    object-fit: fill;
}

.popup-form .form-control {
    border:1px #e4e4e4 solid !important;
    background: #f2f2f2 !important;
    font-size: 15px !important;
    height: 40px !important;
    margin: auto !important;
    display: block;;
}

.popup-form label {
    text-align: left;
    display: block !important;
    font-size: 12px !important;
    color: #4c4b4b;
}

.popup-form .input-group {
    position: relative;
    display: table;
    border-collapse: separate;
}
.popup-form .input-group .form-control, 
.popup-form .input-group-addon,
.popup-form .input-group-btn {
    display: table-cell;
}
.popup-form .input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0;
}
.popup-form .input-group-addon {
    padding: 3px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.popup-form .input-group-addon,
.popup-form .input-group-btn {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}


.popup-form .btn-primary {
  background: #fff;
  border:1px #818181 solid;
  color:#4e4e4e;
   margin: 10px auto;
}

 
.popup-form .btn-primary:hover, 
.popup-form .btn-primary:active:hover, 
.popup-form .btn-primary:active:focus, 
.popup-form .btn-primary:active, 
.popup-form .btn-default:focus, 
.popup-form .btn-4e4e4e:active:focus {
    background: #4e4e4e;
    color: #fff;
    outline: none;
    border-color: #818181;
}

.popup-form .btn-default {
    background: #0a76b7;
    border: 0px;
    border: 1px #0a76b7 solid;
    color: #fff;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    margin: 0px auto;
    padding: 6px 20px;
    transition: all 0.2s ease;
    border-radius:3px;
    letter-spacing: normal;
} 
 
.popup-form .btn-default:hover, 
.popup-form .btn-default:active:hover, 
.popup-form .btn-default:active:focus, 
.popup-form .btn-default:active, 
.popup-form .btn-default:focus, 
.popup-form .btn-default:active:focus {
    background: #0069d9;
    color: #fff;
    outline: none;
    border-color: #0069d9;
}

.popup-avatar {
    display: inline-block;
    vertical-align: middle;
    width: 70px;
    height: 70px;
    background: #eee;
    border-radius: 100%;
    border: 2px #ccc solid;
    text-align: center;
    overflow: hidden;
    line-height: 70px;
}

.profile-upload {
    display: inline-block;
    vertical-align: middle;
    margin-left: 5px;
    color: #000;
    font-family: 'Conv_FoundersGrotesk-Light' !important;
    /* width: 50%; */
}


.profile-upload a {
    color: #000;
    text-decoration: none;
    font-size: 12px;
    display: block;
    font-family: 'Conv_FoundersGrotesk-Light' !important;
}

.avatar-block {
    text-align: left;
    padding: 5px 0;
    position: relative;
}



.profile-btns {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
    background: #e1e1e1;
    padding: 8px 10px;
    border-radius: 3px;
    color: #000;
    font-family: 'Conv_FoundersGrotesk-Light' !important;
    min-width: 120px !important;
    max-width: 100%;
    text-align: center;
}

.popup-avatar .rounduser_image {
    margin: 0 !important;
}

.popup-form {
    max-height: 450px !important;
}

.profile_intials {
    margin: 10px auto;
    font-size: 50px;
    line-height: 155px;
    font-weight: 500;
    color: rgb(10, 118, 183);
    letter-spacing: 3px;
    position: relative;
    background-color: #eff5f5;
    border-radius: 100px !important;
    text-align: center;
    max-width: 130px;
    height: 130px;
    width: 130px;
    font-family: 'Conv_FoundersGrotesk-Bold';
}

.profile_intials_popup {
  margin: 10px auto;
  font-size: 40px;
  line-height: 61px;
  font-weight: 500;
  color: rgb(10, 118, 183);
  letter-spacing: 3px;
  font-family: 'Conv_FoundersGrotesk-Bold';
  position: relative;
  background-color: #eff5f5;
  border-radius: 100px !important;
  text-align: center;
  max-width: 104px;
  height: 104px;
  width: 72;
}

.form-group {
    margin-bottom: 6px !important;
}
.file_picker_upload {
display:none;
}

.popup-form .profile {
    display: inline-block!important;
    vertical-align: middle!important;
    text-align: left!important;
    padding: 11px!important;
}

.popup-form  a#picker_upload_link {
    position: relative;
    color: #007bff !important;
}
.sweet-overlay {
  opacity: 1.04;
  display: block;
  z-index: 9 !important;
}
.showSweetAlert {
  display: block;
  margin-top: -350px;
  z-index: 100 !important;
}
.user-ranking h4 {
    text-align: left;
}

.user-pnts h4 a {
    color: #ffffff;
    display: block;
    vertical-align: middle;
    line-height: normal;
    text-decoration: none;
}
.user-pnts h4 {
     display: inline-block;
     border: 1px #ffffff solid;
     background: #b8bcbb;
     border-radius: 50px;
     padding: 10px 15px 3px;
     text-transform: uppercase;
     font-weight: 500;
     font-size: 15px;
     color: #1aaaa2;
     vertical-align: middle;
     margin: 0px auto;
     letter-spacing: 0.5px;
}

.user-pnts h4 a span {
    display: inline-block;
    line-height: normal;
}

.user-pnts h4:hover {
    background: #4D4E4E;
}

.changephoto:hover {
    background: #4d4e4e;
    color: #fff !important;
}
.dropdown-item:focus, .dropdown-item:hover {
    color: #13b89d !important;
}

.dropdown-item.active, .dropdown-item:active{
     background: #13b89d !important;
      color: #fff !important;
}

.dropdown:hover>.dropdown-menu {
  display: block;
}

#survey_modal {
    z-index: 9999;
} 

#survey_modal .modal-header {
    padding:5px 10px;
    /*display: block !important;*/
}
#survey_modal .modal-content {
    background: #efefef;
}
#survey_modal button.close {
    background: transparent;
    border-radius:0px;
    color: #4e4e4e !important;
    box-shadow:none;
    line-height: 40px;
    opacity:1;
    /* position: relative; */
    top: 0;
    right: 10px;
    margin: auto;
    padding: 0;
}

#survey_modal .close:focus, #survey_modal .close:hover {
    opacity: 1;
    color: #000;
}

#survey_modal button.close span {
    display: inline-block;
    line-height: 40px;
    font-size: 25px;
}
 
.survey-ques {
    padding: 0;
    position: relative;
}

.survey-ques ol {
    padding-left: 0px;
    list-style: none;
}

.survey-ques ol li h4 {
    font-weight: 500;
    font-size: 17px;
    color: #4d4e4e;
    display: inline-block;
    vertical-align: middle;
    line-height: normal;
    margin: 10px auto;
}

.survey-ques ol li {
    font-weight: 500;
    font-size: 18px;
    color: #4d4e4e;
    padding-left: 0;
    vertical-align: top;
}

.survey-ques ol li ol li {
    font-weight: 400;
    color: #4d4e4e;
    font-size: 14px;
    margin: 5px auto;
    border: 1px #e5e5e5 solid;
    background: #fff;
    padding: 10px 15px;
    list-style-position: inside;
    border-radius: 3px;
    position: relative;
    font-weight: 300 !important;
    list-style: none;
    padding-left: 39px;
}

.survey-ques ol li ol {
    padding-left: 0px;
}

.survey-ques ol li ol li:hover {
    background: #59d3d3;
    color: #fff;
}  
.survey-ques li.fib {
    /*padding-left: 15px !important;*/
    padding: 5px 5px;
}

.survey-ques .form-control { 
    margin: auto;
    border: 1px solid #ccc !important;
    box-shadow: none;
    font-size: 14px;
    font-weight: 300 !important;
}
.checkbox, .radio {
    margin: 2px auto;
}
input[type=checkbox], input[type=radio] {
    border: 1px solid #acacac !important;
    margin: 0px 10px 0px -30px !important;
    padding: 0 !important;
    font-size: 14px;
    line-height: 20px;
    width: 18px !important;
    height: 18px;
    background: #fff;
    -webkit-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    -o-appearance: none;
    border-radius: 100% !important;
    vertical-align: text-top;
    display: inline-block;
    cursor: pointer;
    box-shadow: none;
}

input[type=radio] {
    -webkit-border-radius: 2em; 
    -moz-border-radius: 2em; 
    -ms-border-radius: 2em; 
    -o-border-radius: 2em;  
    border-radius: 2em; 
}

input[type=checkbox]:checked::after {
    content:"\f00c";
    font-family:'FontAwesome';
    font-weight: 900;
    display: block;
    text-align: center;
    height: 18px;
    line-height: 18px;
    font-size: 11px;
    color: #59d3d3;
}

input[type=radio]:checked::after {
    content: "\f111";
    display: block;
    line-height: 16px;
    font-size: 10px;
    text-align: center;
    color: #59d3d3;
    font-family: Font Awesome\ 5 Free;
    font-style: normal;
    font-weight: 900;
    padding: 0px 0px 0px 1px !important;
} 

input[type=checkbox]:focus, input[type=radio]:focus {
    outline:none;
}

.ques-submit {
    text-align: right;
}
#survey_modal .modal-body {
    padding:0px;
} 
.modal-logo{
    text-align: center;margin: auto;display: block;
}
.modal-logo img {
    width: 170px;
}
#survey_modal h4.modal-title {
    font-size: 18px;
    padding: 10px 0px;
    color: #000;
    text-align: center;
    margin: auto;
    width: 100% !important;
}

.btn-default {
    background: #0a76b7;
    border: 0px;
    border: 1px #0a76b7 solid;
    color: #fff;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    margin: 0px auto;
    padding: 6px 20px;
    transition: all 0.2s ease;
    border-radius:3px;
    letter-spacing: normal;
} 
 
.btn-default:hover, .btn-default:active:hover, .btn-default:active:focus, .btn-default:active, .btn-default:focus, .btn-default:active:focus {
    background: #0069d9;
    color: #fff;
    outline: none;
    border-color: #0069d9;
}

.whatsnew_long_description ol {
    padding-left: 40px;
}
.whatsnew_long_description li { 
    padding: 3px 0;
    border: 0px;
    margin: 0px auto;
    position: relative;
    text-align: left;
    width: 100%;
}

.whatsnew_long_description ul {
  padding-left: 20px;
}
.sweet-alert {
    z-index: 999 !important;
}

.select2-container--open {
    z-index: 99999 !important;
    top: 260.031px !important;
    left: 444px !important;
}

table td.fr-thick, table th.fr-thick {
    padding: 6px 12px !important;
    border: 3px solid #b6b6b6 !important;
    vertical-align: middle !important;
    font-size: 14px !important;
}
.clubelite-sec1 {
    width: 100px;
    /* height: auto; */
    position: relative;
    display: table;
    margin: auto;
    border: 1px #7a7878 solid;
    background: #959595;
    border-radius: 6px;
    text-align: left;
    padding: 3px 6px;
    outline: none;
}
.eliteimg img {
    max-width: 100%;
}
.clubelite-sec1 h5 {
    font-size: 13px;
    font-weight: bold;
    color: #2d2d2d;
    margin: auto;
}
.role_box {
    width:100%;
    float:left;
}
.promotionList {
    text-align: center; 
    text-decoration: none !important;
    background-color: #4d4e4e;
    color: #fff; 
    border-radius:  10px;
}
.promotionList:hover { 
    background-color: #008eb0;
    color: #fff; 
    font-weight:bold;
}
.box_text_white {
    margin-bottom:0;
}

.box_text_white:hover {
    color:#fff;
    text-decoration:none;
}
.box_text_white {
    color:#fff;
    width:100%;
    float:left;
    font-size:20px;
    padding:20px 0;
}

.space_bottom {
    margin-bottom:12px;
}

.bg_white , .white_bg {
    /*background-color:#fff;
     padding:20px; 
     margin-bottom: 15px;
    */
    padding: 4px 26px;
    float: left;
    width: 100%;
    
}

.white_bg input, .white_bg textarea{
    background-color: #eeefef;
}
.background_grey {
    background-color: #efefef;
}
.radius-border {
    border-radius: 0;
}
.no-margin {
    margin: 0 !important;
}



/*.resourcesContainer > div {
  width:31%;
  margin-left:1.5%;
}*/
.resourcesContainer  table {
  width:100%;
  background-color:#fff
}
.resourcesContainer  table th {
  background-color: #1b75bc !important;
  color:#fff;
  font-size: 16px;
  font-family: 'Conv_FoundersGrotesk-Medium';
  font-weight: 500;
}
.resourcesContainer td, .resourcesContainer th {
    border: 1px solid #dee2e6;
}
 
.resourcesContainer  tbody tr{
  border: 1px solid rgba(0,0,0,.125);
}

.resourcesContainer  tbody tr a{
  text-decoration:none;
}

.top-breadcrumb {
    border-top: 1px #bec5c9 solid;
    border-bottom: 1px #bec5c9 solid;
    vertical-align: middle;
    position: relative;
    margin: 10px auto;
}

ol.breadcrumb {
    margin: auto;
    background: transparent;
    vertical-align: middle;
}

ol.breadcrumb li.breadcrumb-item a {
    color: #6c757d;
    vertical-align: middle;
    display: block;
    font-size: 15px;
}

ol.breadcrumb li.breadcrumb-item.active {
    color: #237abd;
}

.breadcrumb-item+.breadcrumb-item::before {content: '\f054';font-family: Font Awesome\ 5 Free;font-weight: 900;vertical-align: middle;line-height: 20px;}

.points_history {
   position: relative;
}

.points_history .table thead th {
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    vertical-align: middle;
    background: #008eb0;
    color: #fff;
    padding: 12px 12px;
    border: 0;
    text-transform: uppercase;
    width: 33%;
    max-width: 100%;
    float: left;
    height: 100%;
    min-height: 100%;
}

.points_history .table>tbody>tr>td {
    padding: 12px 12px;
    font-size: 13px;
    text-align: left;
    color: #4d4e4e;
    background: #fff;
    width: 33%;
    max-width: 100%;
    float: left;
    height: 100%;
    min-height: 100%;
    vertical-align: middle;
}

.points_history thead, .points_history tbody, .points_history  tr, .points_history td, .points_history th  {
    display: block;
}
.points_history tbody {
    max-height: 300px;
    overflow-y: auto;
    width: 100%;
    background: #fff;
} 
.points_history .table-responsive>.table {
    height: 100%;
}

.points_history tr:after {
    content: ' ';
    display: block;
    visibility: hidden;
    clear: both;
}

a.pnts {
    background: #fff;
    display: inline-block;
    padding: 5px 15px;
    color: #008eb0;
    border-radius: 5px; 
    margin: 0px auto;
    font-size: 16px;
}

.check_box_section {
    background-color:#f2f9fb;
    padding:15px 15px;
}
/* The container */
.checkcontainer {
    display: block;
    position: relative;
    padding-left: 25px;
    margin-bottom: 12px;
    cursor: pointer; 
  height:auto;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.checkcontainer input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom checkbox */
.c_checkmark {
    position: absolute;
    top: 0px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #fff;
  border: 3px solid #4d4e4e;
}

/* On mouse-over, add a grey background color */
.checkcontainer:hover input ~ .c_checkmark {
    background-color: #fff;
}

/* When the checkbox is checked, add a blue background */
.checkcontainer input:checked ~ .checkmark {
    background-color: #fff; 
}

/* Create the c_checkmark/indicator (hidden when not checked) */
.c_checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the c_checkmark when checked */
.checkcontainer input:checked ~ .c_checkmark:after {
    display: block;
}

/* Style the c_checkmark/indicator */
.checkcontainer .c_checkmark:after {
  left: 5px;
  top: 2px;
  width: 5px;
  height: 10px;
    border: solid #4d4e4e;
    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.search-box {
    position: relative;
    text-align: right;
    /*padding-bottom: 10px;
    vertical-align: middle;*/
    padding: 4px 10px;
    max-width: 100%;
    margin-left: 30px;
}

.blue_row {
    background-color: #333333 !important;
    color: #fff;
    font-size: 18px;
    font-family: 'Conv_FoundersGrotesk-Medium';
    font-weight: 400;
}

.blue_row_leaderboard_groups {
    background-color: #333333 !important;
    color: #fff;
    font-size: 18px;
}

.view_btn {
    background-color:#fff;
    border-color:#4e4e4e;
    color: #4e4e4e;
    text-transform:capitalize;
    font-size:14px;
    border-radius:0;
    padding:8px 14px 4px;
    border-radius: 10px;
}

.learn_btn {
    margin-top:15px;
    text-transform:capitalize;
    background-color:#fff;
    color: #4e4e4e;
    border-color:#4e4e4e;
    border-radius:0;
    font-size:14px;
    border-radius: 10px;
}

.reward_box .view_btn {
    margin-top:6px;
}

.table-webview {
    background: #f2f9fb;
    width: 100%;
}

.table-webview .table thead th {
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    vertical-align: middle;
    background: #4d4e4e;
    color: #fff;
}

.table-webview .table tbody td {
    vertical-align: middle;
    font-size: 12px;
}


.leaderboard-table {
    background: #fff; 
    width: 100%;
    display:none;
}

.leaderboard-table .table thead th {
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    vertical-align: middle;
    background: #008eb0;
    color: #fff;
}

.leaderboard-table .table tbody td {
    vertical-align: middle;
    font-size: 12px;
}
.details h5 {
    font-weight: 500;
    color: #000;
    float: right;
    width: 30%;
    line-height: normal;
    font-size: 12px;
}
 
.leaderboard-table .table tbody td div {
    border-bottom: 1px #cecece solid;
}
.leaderboard-table .table tbody td>table>tbody>tr>td:first-child {
    color: #0976b5;
    font-weight: 400;
}
.homepage-wrapper{
    min-height: 54%;
    margin-bottom: -160px;
}

#groups_details thead th{
  border:0px;
  border-right: 1px solid #dbd9d9;
}

#groups_details .dataTables_filter{
  float:left;
  width:100%;
}

#groups_details .dataTables_filter label{
  width:100%;
  
}

#groups_details .dataTables_filter input, .responsiveSearch {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyAgIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIiAgIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgICB4bWxuczpzdmc9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgICB2ZXJzaW9uPSIxLjEiICAgaWQ9InN2ZzQ0ODUiICAgdmlld0JveD0iMCAwIDIxLjk5OTk5OSAyMS45OTk5OTkiICAgaGVpZ2h0PSIyMiIgICB3aWR0aD0iMjIiPiAgPGRlZnMgICAgIGlkPSJkZWZzNDQ4NyIgLz4gIDxtZXRhZGF0YSAgICAgaWQ9Im1ldGFkYXRhNDQ5MCI+ICAgIDxyZGY6UkRGPiAgICAgIDxjYzpXb3JrICAgICAgICAgcmRmOmFib3V0PSIiPiAgICAgICAgPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+ICAgICAgICA8ZGM6dHlwZSAgICAgICAgICAgcmRmOnJlc291cmNlPSJodHRwOi8vcHVybC5vcmcvZGMvZGNtaXR5cGUvU3RpbGxJbWFnZSIgLz4gICAgICAgIDxkYzp0aXRsZT48L2RjOnRpdGxlPiAgICAgIDwvY2M6V29yaz4gICAgPC9yZGY6UkRGPiAgPC9tZXRhZGF0YT4gIDxnICAgICB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLC0xMDMwLjM2MjIpIiAgICAgaWQ9ImxheWVyMSI+ICAgIDxnICAgICAgIHN0eWxlPSJvcGFjaXR5OjAuNSIgICAgICAgaWQ9ImcxNyIgICAgICAgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoNjAuNCw4NjYuMjQxMzQpIj4gICAgICA8cGF0aCAgICAgICAgIGlkPSJwYXRoMTkiICAgICAgICAgZD0ibSAtNTAuNSwxNzkuMSBjIC0yLjcsMCAtNC45LC0yLjIgLTQuOSwtNC45IDAsLTIuNyAyLjIsLTQuOSA0LjksLTQuOSAyLjcsMCA0LjksMi4yIDQuOSw0LjkgMCwyLjcgLTIuMiw0LjkgLTQuOSw0LjkgeiBtIDAsLTguOCBjIC0yLjIsMCAtMy45LDEuNyAtMy45LDMuOSAwLDIuMiAxLjcsMy45IDMuOSwzLjkgMi4yLDAgMy45LC0xLjcgMy45LC0zLjkgMCwtMi4yIC0xLjcsLTMuOSAtMy45LC0zLjkgeiIgICAgICAgICBjbGFzcz0ic3Q0IiAvPiAgICAgIDxyZWN0ICAgICAgICAgaWQ9InJlY3QyMSIgICAgICAgICBoZWlnaHQ9IjUiICAgICAgICAgd2lkdGg9IjAuODk5OTk5OTgiICAgICAgICAgY2xhc3M9InN0NCIgICAgICAgICB0cmFuc2Zvcm09Im1hdHJpeCgwLjY5NjQsLTAuNzE3NiwwLjcxNzYsMC42OTY0LC0xNDIuMzkzOCwyMS41MDE1KSIgICAgICAgICB5PSIxNzYuNjAwMDEiICAgICAgICAgeD0iLTQ2LjIwMDAwMSIgLz4gICAgPC9nPiAgPC9nPjwvc3ZnPg==);
  background-repeat: no-repeat;
  background-color: #fff;
  background-position: 9px 0px !important;
  padding-left: 40px !important;
  background-size: 26px;
  border: 2px solid #e0e0e0 !important;
} 
#groups_details .dataTables_filter input{
  /*margin-left:0px;*/
    margin-right: 15px;
    width: 99%;
    height: 32px;
}
#groups_details table.dataTable.no-footer {
    border-bottom: none;
    width: 100% !important;
}

.dataTables_scrollBody {
    border-bottom: 0 !important;
}

.dataTables_scrollBody table{
  margin:0 !important;
}

.responsiveSearch{
  display:none;
  margin-bottom: 14px;
}

/*input, textarea {
    width:100% !important;
    padding:8px 15px !important;
    color:#9f9fa0;
    border:1px !important;
    border-radius:1px !important;
}*/

.bread-crum-box span {
    color: #4d4d4d;
}

.search-box input.form-control {
    width: auto !important;
}

.search-box {
    position: relative;
    text-align: right;
    padding-bottom: 10px;
    vertical-align: middle; 
    max-width: 100%; 
}

.leaderboard-table .table tbody td:first-child {
    width: 40%;
}
.carousel-control .glyphicon-chevron-left, 
.carousel-control .glyphicon-chevron-right, 
.carousel-control .icon-prev, 
.carousel-control .icon-next {
    width: 30px;
    height: 30px;
    margin-top: -15px;
}

.swal-index-9999 {
    z-index: 9999 !important;
}

#homepage-overlay {
  position: fixed; /* Sit on top of the page content */
  display: block; /* Hidden by default */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5); /* Black background with opacity */
  z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}

#errorpage-overlay {
    position: relative;
    display: block;
    width: 100%;
    height: 100%;
    /* background-color: rgb(113 60 5 / 95%); */
    z-index: 99;
    cursor: default;
}
#errorpage-overlay:before {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;left: 0;
    background: rgb(0 0 0 / 50%);
    z-index: 99;
}
.top-alert-box h3 {
    padding-left: 20px;
    font-size: 1.3rem;
    margin-bottom: 0;
}

/*select.form-control:not([size]):not([multiple]) {
    font-size: 1rem !important;
    padding-left: 10px !important;
}
select > option .form-control:not([size]):not([multiple]) {
    font-size: 1.5rem !important;
}*/
.sweet-alert h2 {
    font-family: 'Conv_FoundersGrotesk-Regular';
}
/*.popup-form .form-control select {
    font-size: 1rem !important;
}*/

/********/

@media screen and (max-width:991px){
    .whatsnew-second {
        width: 98%;
    }
}

@media screen and (max-width:767px){
    .head-box img {
        height: auto;
    }

    .head-box {
        height: auto;
    }
    .foot-logo {
        text-align: left;
    }
    .copywrite {
        text-align: left;
    }
    .table-webview{
        display:none;
    } 
    .leaderboard-table{
        display:block;
    }
    .table .white_row td {
        border-right:thin solid #dbd9d9;
        font-size:12px !important;
        color:#4d4e4e;
        /*padding-left:25px;*/ 
    }
    .responsiveSearch{
        display:block;
        width: 100%;
        height: 40px;
    }
    .hidden-desktop {
        display: inherit !important;
    }
    .visible-desktop {
      display: none !important;
    }
    .visible-phone {
        display: inherit !important;
    }
    .hidden-phone {
        display: none !important;
    }
    .show-phone {
        display: block !important;
    }
    #groups_details .dataTables_filter{
        width:100%;
    }
    #groups_details .dataTables_filter label{
        width: 95% !important;
        margin: 6px;    
    }
    .carousel-item img {
        height: auto;
    }
    .search-box {
        margin: 5px auto 0;
    }
}


@media screen and (max-width:480px){
  .learn_btn {
    font-size: 12px;
    padding: 7px 10px;
    white-space: normal;
  }
}

/* Survey New CSS */
.survey-ques {
    padding: 15px 15px;
    position: relative;
}
.survey-ques h4 {
   font-size: 1.3rem; 
    font-weight: 500;
    color: #000;
}
.survey-ques ul {
    list-style: none;
}
.survey-ques ul li {
    padding: 7px 7px;
    position: relative;
    font-size: 1rem;
    font-weight:300;
    vertical-align: middle;
    background: #fff;
    margin: 5px 0;
    border-radius: 5px;
}
.survey-ques ul li label {
    font-size: 1rem;
    font-weight:300;
}
.customcheckbox {
    display: block;
}
.customcheckbox label{
  margin: 5px auto;
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  font-size: 14px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  line-height: normal;
  vertical-align: middle;
}
 
/* Hide the browser's default checkbox */
.customcheckbox input{
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
 
/* Create a custom checkbox */
.checkmark {
  position: absolute;
  top: -1px;
  left: 0px;
  height: 18px;
  width: 18px;
  background-color: #fff;
  border: 1px #D4DDE0 solid;
}
/* On mouse-over, add a grey background color */
.checkbox:hover input ~ .checkmark {
  background-color: #ccc;
}
/* When the checkbox is checked, add a blue background */
.checkbox input:checked ~ .checkmark {
  background-color: #fff;
}
/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute; 
}
/* Show the checkmark when checked */
.checkbox input:checked ~ .checkmark:after {
  display: block;
}
/* Style the checkmark/indicator */
.checkbox .checkmark:after {
    content: '\f00c';
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: block;
    text-align: center;
    line-height: 19px;
    font-size: 11px;
    color: #59d3d3;
    left: 2px;
    display: none;
}
  /**** radio button *************/
 
 /* The container */
.customradio label {
  display: inline-block;
  position: relative;
  padding-left: 30px;
  margin: 10px 5px 10px 5px;
  cursor: pointer;
  font-size: 15px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
/* Hide the browser's default radio button */
.customradio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}  
/* Create a custom radio button */
.radiomark {
  position: absolute;
  top: 0;
  left: 0;
  height: 20px;
  width: 20px;
  background-color: #fff;
  border-radius: 50%;
  border: 1px #D4DDE0 solid;
}
/* On mouse-over, add a grey background color */
.customradio:hover input ~ .radiomark {
  background-color: #ccc;
}
/* When the radio button is checked, add a blue background */
.customradio input:checked ~ .radiomark {
  background-color: #fff;
  border-color: #59d3d3;
}
/* Create the indicator (the dot/circle - hidden when not checked) */
.radiomark:after {
  content: "";
  position: absolute; 
}
/* Show the indicator (dot/circle) when checked */
.customradio input:checked ~ .radiomark:after {
  display: block;
}
/* Style the indicator (dot/circle) */
.customradio .radiomark:after {
    content: '\f111';
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    display: block;
    text-align: center;
    line-height: 19px;
    font-size: 10px;
    color: #59d3d3;
    left: 4px;
    display: none;
}
.modal-content {
    background: #efefef;
}
/* Survey New CSS End */
.dominator-badge img {
    width: 100px !important;
}
.survey-ques li.fib input.form-control {
    position: relative;
    opacity: 1;
    width: 100%;
    height: 45px;
}

.popup-form select.form-control {
    background-color: #f2f2f2 !important;
    background-image: url("../img/arrow.png") !important;
    background-position: right 10px center !important;
    background-repeat: no-repeat !important;
    /*background-size: auto 50% !important;*/
    background-size: 2% !important;
    padding: 10px 30px 10px 10px;
    outline: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    font-family: 'Merriweather', serif;
    font-size: 13px !important;
    font-weight: 300;
}

.sa-button-container button {
    font-family: 'Merriweather', serif;
    font-size: 14px;
}

/* Registration Process CSS Styles */
.sweet-alert.reg-profile-modal .sa-button-container button {
    font-family: 'Merriweather', serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px;
    margin: 1rem auto !important;
    color: #fff !important;
    border: 1px #028fb0 solid !important;
    background: #8cd4f5 !important;
    padding: 5px 25px 5px !important;
    line-height: 25px;
    border-radius: 50px !important;
}

.sweet-alert.reg-profile-modal .sa-button-container button:hover,
.sweet-alert.reg-profile-modal .sa-button-container button:not(:disabled):not(.disabled),
.sweet-alert.reg-profile-modal .sa-button-container button:not(:disabled):not(.disabled).active, 
.sweet-alert.reg-profile-modal .sa-button-container button:not(:disabled):not(.disabled):active, 
.show>.sweet-alert.reg-profile-modal .sa-button-container button.dropdown-toggle {
    color: #fff !important;
    background:#028fb0 !important;
    border: 1px #8cd4f5 solid !important;
    outline: none;
} 

.sweet-alert.reg-profile-modal .sa-button-container button.focus, .sweet-alert.reg-profile-modal .sa-button-container button:focus {
    color: #fff !important;
    background:#8cd4f5 !important;
    border: 1px #028fb0 solid !important;
    outline: none; 
} 

.register_popup-form {
    background: #f2f9fb;
    border-radius: .3rem;
}

.swal_register_left_col {
    background: #f2f9fb; /*#f2f9fb;*/
    border-radius: 10px 0 0 0;
    /*padding: 64px 0 0 0;*/
    display: flex;
    align-items: center;
}
 

.swal_register_right_col {
    background: #f2f9fb;
    border-radius: 0 10px 0 0;
    /*border-radius: 0 .3rem .3rem 0;
    padding: 0;*/
}

.register-popup-form {
    padding: 10px !important;
    position: relative;
}

.register-popup-form h4 {
    color: #333333;
    font-weight: normal;
    font-size: 1.2rem;
    text-align: center;
    font-family: 'Merriweather', serif;
    margin-bottom: 1.5rem;
}

.register-popup-form .form-control {
    border: 1px #e4e4e4 solid !important;
    background: #fff !important;
    font-size: 14px !important;
    height: 40px !important;
    margin: auto !important;
    display: block;
    font-family: 'Merriweather', serif;
    padding: 5px !important;
}


.register-popup-form label {
    font-size: 14px !important;
    margin-bottom: 5px;
    margin-top: 1rem;
    text-align: left;
    display: block;
    font-family: 'Merriweather', serif;
    font-weight: 700;
    color: #333;
}

.save-btn {
    background: #cbd9dc;
    position: relative;
    padding: 10px 10px;
    text-align: right;
}

.sweet-alert button[disabled] {
    background: #7ecff4;
}

.sweet-alert-button-disabled {
    background: #7ecff4;
}

.save-btn .btn {
    margin: 0;
    background: #007bff;
}
.reg-popup-avatar {
    display: inline-block;
    vertical-align: middle;
    width: 60px;
    height: 60px;
    background: #eee;
    border-radius: 100%;
    border: 2px #ccc solid;
    text-align: center;
    overflow: hidden;
    line-height: 60px;
}
 

.reg-profile-btns {
    display: block;
    vertical-align: middle;
    color: #000;
    font-family: 'Merriweather', serif !important;
    max-width: 100%;
    text-align: left;
    padding: 3px 0px !important;
}
.reg-profile-btns a i {
    width: 28px;
    height: 28px;
    background: #fff;
    display: inline-block;
    border-radius: 100%;
    line-height: 27px;
    text-align: center;
    margin-right: 5px;
    vertical-align: middle;
    color: #545871;
}

.sweetalert-lg {
    width: 750px !important;
    background: #ffffff !important;
}
.reg-profile-modal {
    background: #abcfd8 !important;
    padding:15px 15px !important;
}

.reg-profile-modal h2 {
    margin: auto !important;
}

.reg-profile-modal .sa-button-container {
    display: block !important;
    background: #f2f9fb;
    height: 85px !important;
    border-radius: 0px 0px 10px 10px;
}

.reg-profile-modal .sa-button-container .sa-confirm-button-container {
    padding: 0px !important;
}

.mandatory_field {
    color: red !important;
    font-size: 12px;
    font-weight: bold !important;
    padding: 3px !important;
}

.profile_intials_register_popup {
  margin: 10px auto;
  font-size: 33px;
  line-height: 50px;
  font-weight: bold;
  color: rgb(10, 118, 183);
  letter-spacing: 0px;
  font-family: 'Conv_FoundersGrotesk-Bold';
  position: relative;
  background-color: #eff5f5;
  border-radius: 100px !important;
  text-align: center;
  max-width: 104px;
  height: 104px;
  width: 72;
}
.popup-logo {
    text-align: center;
    width: 30%;
    margin: auto !important;
    padding: 10px 0 0 0 !important;

}
.reg-profile-btns center a {
    text-align: left;
}

.register_popup-form .btn-default {
    background: #0a76b7;
    border: 0px;
    border: 1px #0a76b7 solid;
    color: #fff;
    text-align: center;
    font-size: 17px;
    font-weight: 500;
    margin: 0px auto;
    padding: 6px 20px;
    transition: all 0.2s ease;
    border-radius:3px;
    letter-spacing: normal;
} 
 
.register_popup-form .btn-default:hover, 
.register_popup-form .btn-default:active:hover, 
.register_popup-form .btn-default:active:focus, 
.register_popup-form .btn-default:active, 
.register_popup-form .btn-default:focus, 
.register_popup-form .btn-default:active:focus {
    background: #0069d9;
    color: #fff;
    outline: none;
    border-color: #0069d9;
}
/* Registration Process CSS Styles END */

#survey_modal_confirm {
    z-index: 9999;
} 

#survey_modal_confirm .modal-header {
    padding:5px 10px;
    /*display: block !important;*/
}
#survey_modal_confirm .modal-content {
    background: #efefef;
}
#survey_modal_confirm button.close {
    background: transparent;
    border-radius:0px;
    color: #4e4e4e !important;
    box-shadow:none;
    line-height: 40px;
    opacity:1;
    /* position: relative; */
    top: 0;
    right: 10px;
    margin: auto;
    padding: 0;
}

#survey_modal_confirm .close:focus, #survey_modal_confirm .close:hover {
    opacity: 1;
    color: #000;
}

#survey_modal_confirm button.close span {
    display: inline-block;
    line-height: 40px;
    font-size: 25px;
}

table th:first-child{
  border-radius:10px 0 0 10px;
}

table th:last-child{
  border-radius:0 10px 10px 0;
}