body {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.m40 {
    margin: 40px !important;
}

.mt10 {
    margin-top: 10px !important;
}

.mt15 {
    margin-top: 15px !important;
}

.mt20 {
    margin-top: 20px !important;
}

.mt25 {
    margin-top: 25px !important;
}

.mt30 {
    margin-top: 30px !important;
}

.mtm5 {
    margin-top: -5px !important;
}

.mtm7 {
    margin-top: -7px !important;
}

.mtm10 {
    margin-top: -10px !important;
}

.mtm15 {
    margin-top: -15px !important;
}

.mb100 {
    margin-bottom: 100px !important;
}

.mb10 {
    margin-bottom: 10px !important;
}

.mb20 {
    margin-bottom: 20px !important;
}

.mb30 {
    margin-bottom: 30px !important;
}

.mb40 {
    margin-bottom: 40px !important;
}

.pl15 {
    padding-left: 15px !important;
}

.p10 {
    padding-top: 10px !important;
}

.p0 {
    padding: 0px;
}

.mlm25mrm15 {
    margin-left: -30px !important;
    margin-right: -15px;
}

.m5 {
    margin: 5px !important;
}

.mr5 {
    margin-right: 5px;
}

.img-footer {
    width: 90%;
    margin: 20px 20px 20px 0;
}

.img-mobile {
    width: 200px;
    margin-top: -15px;
    margin-left: 0px;
}

.login-mobile {
    font-size: 16px;
    color: #fff;
    margin: 10px 10px 0 0;
}

.login-mobile:hover {
    color: #fff;
}

a:hover {
    text-decoration: none;
    color: #333;
}

#share {
    list-style-type: none;
    float: left;
    padding: 0px !important;
}

#share li {
    display: inline;
}

.border-red {
    border: #ff0000 1px solid !important;
    color: #03a9f4;
}

.validation-advice {
    color: #ff0000;
    font-size: 14px;
}

.h-register {
    color: #fff;
    margin-top: 10px !important;
}

.h-register i {
    color: #fff;
}

.btn-edit {
    position: relative;
    bottom: 30px;
    right: 10px;
}

.txtleft {
    text-align: left;
}

.content-box-title {
    min-height: 40px;
    line-height: 20px;
}

.w100-100 {
    width: 100%;
}

.w80 {
    width: 80px;
}

.w100 {
    width: 100px !important;
}

.w120 {
    width: 120px !important;
}

.w150 {
    width: 150px !important;
}

.w160-pasi {
    width: 160px !important;
}

.w100chest {
    width: 100px;
    height: 35px;
}

.w50chest-account {
    width: 50px;
    height: 20px;
    line-height: 1.2;
    text-align: center;
    font-size: 16px;
    color: #0099da;
}


.panel-title-account {
    margin-top: 0;
    margin-bottom: 0;
    color: inherit;
}

.content-box-account {
    display: block;
    text-align: center;
    overflow: hidden;
    padding: 2px;
    margin-bottom: 20px;
    box-shadow: 0 3px 8px rgb(0 0 0 / 25%);
}


.content-box-account.box-primary {
    background-color: #0099da;
    color: #fff;
    border: solid 1px #005174;
}

.content-box-account.box-success {
    background-color: #02c66c;
    color: #fff;
    border: solid 1px #016135;
}

.content-box-account.box-info {
    background-color: #54c8eb;
    color: #fff;
    border: solid 1px #179bc2;
}

.content-box-account.box-warning {
    background-color: #f0ad4e;
    color: #fff;
    border: solid 1px #c77c11;
}

.content-box-account.box-danger {
    background-color: #d9534f;
    color: #fff;
    border: solid 1px #a02622;
}

.content-box-account.box-royal {
    background-color: #ac60d0;
    color: #fff;
    border: solid 1px #792e9c;
}

.content-box-account.box-primary:hover {
    background-color: #0087c1;
}

.content-box-account.box-success:hover {
    background-color: #02ad5e;
}

.content-box-account.box-info:hover {
    background-color: #3dc1e8;
}

.content-box-account.box-warning:hover {
    background-color: #eea236;
}

.content-box-account.box-danger:hover {
    background-color: #d43f3a;
}

.content-box-account.box-royal:hover {
    background-color: #a24cca;
}


.mh50 {
    min-height: 50px !important;
}

.mh90 {
    min-height: 90px !important;
}

.mh120 {
    min-height: 120px !important;
}

.mh130 {
    min-height: 130px !important;
}




.m20tc {
    margin: 20px !important;
    text-align: center;
}

.mtb20tc {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
    text-align: center;
}

.mtb30tc {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
    text-align: center;
}

.mtb20 {
    margin-top: 20px !important;
    margin-bottom: 20px !important;
}

.mtb30 {
    margin-top: 30px !important;
    margin-bottom: 30px !important;
}

.mb20tc {
    margin-bottom: 20px !important;
    text-align: center;
}

.p5 {
    margin-bottom: -5px !important;
    padding: 5px !important;
}

.mlr15 {
    margin-left: 15px;
    margin-right: 15px;
}

.mlr10 {
    margin-left: 10px;
    margin-right: 10px;
}

.mlr5 {
    margin-left: 5px;
    margin-right: 5px;
}

.mlr0 {
    margin-left: 0px;
    margin-right: 0px;
}

.mlr-5 {
    margin-left: -5px;
    margin-right: -5px;
}

.mlr-10 {
    margin-left: -10px;
    margin-right: -10px;
}

.mlr-15 {
    margin-left: -15px;
    margin-right: -15px;
}

.mlrt-video {
    margin-left: -19px;
    margin-right: -19px;
    margin-top: -4px;
}

.plr5 {
    padding-left: 5px;
    padding-right: 5px;
}

.plr0-chestaccount {
    padding-left: 0px;
    padding-right: 0px;
}

.plr5-chestaccount {
    padding-left: 5px;
    padding-right: 5px;
}

.ptb2 {
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}

.maxw200 {
    max-width: 200px !important;
}

.maxw150 {
    max-width: 150px !important;
}

.ptext {
    color: #000;
    width: 100% !important;
}

.progress {
    position: relative;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .25);
}

.progress span {
    position: absolute;
    display: block;
    width: 100%;
    color: black;
}

.sendanswer {
    margin-right: 20px;
}

.answer {
    padding: 5px 5px 5px 5px;
    margin-bottom: 20px;
    cursor: pointer;
    border: solid 1px;
    border-radius: 5px;
    border-color: #c5c5c5;
}

.answer-questionnaire {
    padding: 5px 5px 5px 5px;
    margin-bottom: 20px;
    border-radius: 5px;
}

.selected {
    background: #54c8eb;
}

.btn {
    margin-bottom: 10px !important;
}

.passed-block {
    border: #b0b0b0 1px solid;
    padding: 0px 5px 0px 5px;
    ;
    margin-bottom: 10px;
    border-radius: 5px;
}

.passed-block:last-child {
    margin-bottom: 0px !important;
}

.bg-white {
    background: #fff !important;
    border: 1px solid #0087c1;
}

.badge-list {
    min-width: 30px !important;
    margin: 5px !important;
    background: #fff !important;
    border: 1px solid #0087c1;
    color: #000;
}

.badge-answer {
    min-width: 30px !important;
    margin: 5px !important;
}

.badge-sumar {
    min-width: 40px !important;
    margin: 5px !important;
}

.badge-questionar {
    min-width: 100% !important;
    margin: 5px 5px 5px 0px !important;
    line-height: 1.2;
    font-size: 13px;
}

.font-black {
    color: #000 !important;
}

.results {
    padding: 5px 5px 5px 5px;
    margin-bottom: 10px;
    border: solid 1px;
    border-radius: 5px;
    border-color: #c5c5c5;
}

.fsize9 {
    font-size: 9px !important;
}

.fsize10 {
    font-size: 10px !important;
}

.fsize11 {
    font-size: 11px !important;
}

.fsize12 {
    font-size: 12px !important;
}

.fsize13 {
    font-size: 13px !important;
}

.fsize14 {
    font-size: 14px !important;
}

.fsize15 {
    font-size: 15px !important;
}

.fsize18 {
    font-size: 18px !important;
}

.panel-box {
    background: #0099da !important;
    color: #fff !important;
}

.box-text {
    line-height: 1.3em;
    height: 55px !important;
}

.title-questionnaires {
    border-bottom: #ccc 1px solid;
    padding-bottom: 5px;
    margin: 15px;
}

.h30 {
    height: 30px;
}

.h50 {
    height: 50px;
}

.lh50 {
    line-height: 50px !important;
}

.hidden {
    display: none;
}

.label-answer {
    float: left;
    width: 50px;
    margin-top: 16px;
    margin-right: 5px;
    margin-left: 5px;
}

.clear-form-comment {
    cursor: pointer;
    font-size: 12px;
}

.panel-info-2 {
    background: #a4a4a4;
}

.text {
    color: #333;
}

.panel-title {
    font-size: 22px !important;
}

.panel-chestionar {
    font-size: 16px !important;
}

.panel-chestionar-account {
    font-size: 18px !important;
}

.panel-chestionare {
    margin-bottom: 20px;
    padding-left: 0px;
    padding-right: 0px;
    background-color: #fff;
    border: 1px solid #d9534f;
    box-shadow: 0 3px 8px rgb(0 0 0 / 25%);
}

.info-blue {
    padding: 0px 5px 5px 5px;
    margin-top: 10px;
    margin-bottom: 15px;
    border: 1px solid;
    border-color: #7dd4ff;
    border-radius: 5px;
    background-color: #cfefff;
    box-shadow: 0 3px 8px rgb(0 0 0 / 25%)
}

.success {
    background: #5ca43f;
}

.info {
    background: #54c8eb;
}

.danger {
    background: #d9534f;
}

.warning {
    background: #eea236;
}

.royal {
    background: #ac60d0;
}

.question-title {
    color: #333;
    font-weight: bold;
    text-align: center;
}

.answer {
    font-size: 1.1em;
}

.fsize14 {
    font-size: 14px !important;
}

.fsize16 {
    font-size: 16px !important;
}

.fsize18 {
    font-size: 18px !important;
}

.fsize20 {
    font-size: 20px !important;
}

.fsize25 {
    font-size: 24px !important;
}

.fsize30 {
    font-size: 30px !important;
}

.fsize40 {
    font-size: 40px !important;
}

.btn-reset {
    margin-top: 40px;
}

.info-text {
    color: #54c8eb;
}

.img-center {
    margin: 0px auto;
    display: block;
}

.list-item-done {
    color: #ddd !important;
}

.panel-warning {
    border-color: #f0ad4e !important;
}

.panel-warning .panel-heading {
    background: #f0ad4e !important;
}

.panel-warning .panel-title {
    color: #fff;
}

.box-opacity {
    opacity: 0.2 !important;
}



.label-warning-2 {
    background-color: #f0ad4e !important;
}

.wrong-img,
.correct-img {
    z-index: -1;
    position: absolute;
    /*bottom:-32px;*/
}

.bg-questionnaire {
    /*background: url(../../img/frontend/background_exam.jpg) top center repeat-x #e1e1e1;
    border: 1px solid #959595;*/
    padding: 10px;
    margin: 10px 0;
}

.question-title-drpciv {
    font-weight: bold;
}

.pltext50 {
    padding-left: 50px !important;
}

.div-video {
    width: 300 !important;
    height: 600px !important;
}

.pl50 {
    padding-left: 50px;
}

.panel-title-result {
    background: #d9d9d9;
    border-top: solid 1px;
    border-bottom: solid 1px;
    border-color: #bfbfbf;
    padding: 5px !important;
    margin-bottom: 5px !important;
    font-size: 18px;
    margin: -5px -5px;
}

.account-button-menu {
    padding: 10px;
}

.answer .badge,
.answers .badge {
    font-size: 28px;
}

.step {
    background-color: #ff0000;
    font-weight: bold;
    padding: 5px;
    border-radius: 2px;
}

.step-success {
    background-color: #5ca43f;
    font-weight: bold;
    padding: 5px;
    border-radius: 2px;
}

.step-warning {
    background-color: #f0ad4e;
    font-weight: bold;
    padding: 5px;
    border-radius: 2px;
}

.step-info {
    background-color: #54c8eb;
    font-weight: bold;
    padding: 5px;
    border-radius: 2px;
}

.step-danger {
    background-color: #d9534f;
    font-weight: bold;
    padding: 5px;
    border-radius: 2px;
}

.step-royal {
    background-color: #ac60d0;
    font-weight: bold;
    padding: 5px;
    border-radius: 2px;
}

.panel-info-3 {
    border-color: #ac60d0;
    background-color: #f7eeff;
}

.panel-info-3>.panel-heading {
    background: #ac60d0;
    color: #fff;
}

.panel-footer-wrong-qest {
    padding: 10px 15px;
    background-color: #dbaef1;
    border-top: 1px solid #ac60d0;
}

.context-result-pred {
    height: 150px;
}

.context-result-gen {
    height: 100px;
}

.border-img {
    border: #ccc 1px solid;
    border-radius: 5px;
}

.img-general {
    height: 150px !important;
}

.h130 {
    height: 100px !important;
    line-height: 18px;
}

.donate {
    background: #FFC439;
    color: #000;
    padding: 3px;
    border-radius: 2px;
}

.video-left {
    width: 320px;
}

.video {
    width: 800px;
}

.progress-text {
    font-weight: bold;
}

.box-quiz-text {
    background: #f9f9f9 !important;
    border: #ccc 1px solid;
    padding: 5px;
}

.panel-body br {
    display: block;
    /* makes it have a width */
    content: "";
    /* clears default height */
    margin-top: 0;
    /* change this to whatever height you want it */
}

.link-account {
    display: block;
    padding: 1px 3px;
    ;
}

.account-dropdown>a:after {
    display: none !important;
}

.label-text-danger {
    background-color: #d9534f;
    color: #fff;
    font-weight: bold;
    border-radius: 2px;
    padding-left: 3px;
    padding-right: 3px;
}

.btn-img:hover {
    opacity: 0.5;
}

.progress-text-left {
    float: left;
    text-align: left;
    padding-left: 5px;
}

.progress-subcategory {
    background: #337ab7 !important;
    border-radius: 5px;
}

.text-white {
    color: #fff !important;
    line-height: 2.5em;
    font-size: 14px !important;
}

.progress-subcategory:hover {
    background: #286090 !important;
}

.progress-bar-primary-subcategory {
    background: #337ab7 !important;
}

.h40 {
    height: 40px;
}

.h35 {
    height: 35px;
}


.comments-box {
    padding: 5px 5px 5px 20px;
    border: solid 1px;
    border-radius: 5px;
    border-color: #c5c5c5;
    margin-bottom: 20px;
    background-color: #ececec;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .25);
}

.comments-userphoto {
    height: 45px;
    width: 45px;
    float: left;
}

@media (max-width: 350px) {
    .comments-panel-parent {
        width: 80%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child {
        width: 78%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-parent-notif {
        width: 80%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child-notif {
        width: 78%;
        float: right;
        margin-right: 10px;
    }
}

@media (min-width: 350px) {
    .comments-panel-parent {
        width: 83%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child {
        width: 80%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-parent-notif {
        width: 82%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child-notif {
        width: 79%;
        float: right;
        margin-right: 10px;
    }
}

@media (min-width: 400px) {
    .comments-panel-parent {
        width: 85%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child {
        width: 82%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-parent-notif {
        width: 84%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child-notif {
        width: 81%;
        float: right;
        margin-right: 10px;
    }
}

@media (min-width: 450px) {
    .comments-panel-parent {
        width: 87%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child {
        width: 83%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-parent-notif {
        width: 86%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child-notif {
        width: 82%;
        float: right;
        margin-right: 10px;
    }
}

@media (min-width: 500px) {
    .comments-panel-parent {
        width: 88%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child {
        width: 84%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-parent-notif {
        width: 87%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child-notif {
        width: 83%;
        float: right;
        margin-right: 10px;
    }
}

@media (min-width: 550px) {
    .comments-panel-parent {
        width: 89%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child {
        width: 85%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-parent-notif {
        width: 88%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child-notif {
        width: 84%;
        float: right;
        margin-right: 10px;
    }
}

@media (min-width: 600px) {
    .comments-panel-parent {
        width: 90%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child {
        width: 86%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-parent-notif {
        width: 89%;
        float: right;
        margin-right: 10px;
    }

    .comments-panel-child-notif {
        width: 85%;
        float: right;
        margin-right: 10px;
    }
}

@media (min-width: 992px) {
    .comments-panel-parent {
        width: 91%;
        float: right;
        margin-right: 15px;
    }

    .comments-panel-child {
        width: 87%;
        float: right;
        margin-right: 15px;
    }

    .comments-userphoto {
        height: 60px;
        width: 60px;
        float: left;
    }
}

@media (min-width: 1200px) {
    .comments-panel-parent {
        width: 91%;
        float: right;
        margin-right: 15px;
    }

    .comments-panel-child {
        width: 87%;
        float: right;
        margin-right: 15px;
    }

    .comments-userphoto {
        height: 75px;
        width: 75px;
        float: left;
    }
}


.panel-comments-parent {
    background-color: #fff;
    border: 1px solid #c5c5c5;
    border-radius: 6px;
    margin-bottom: 5px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .25);
}

.panel-comments-child {
    background-color: #fff;
    border: 1px solid #c5c5c5;
    border-radius: 6px;
    margin-bottom: 5px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .25);
}

.panel-header-comment-parent {
    padding: 5px 5px 5px 5px;
    color: #fff;
    background-color: #54c8eb;
    border-radius: 5px 5px 0px 0px;
    border-bottom: 1px solid #ddd;
}

.panel-header-comment-child {
    padding: 5px 5px 5px 5px;
    color: #333;
    background-color: #f5f5f5;
    border-radius: 5px 5px 0px 0px;
    border-bottom: 1px solid #ddd;
}

.panel-footer-comment-parent {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
}

.img-responsive-userphoto {
    max-width: 100%;
    height: auto;
    border: solid 1px #d0d0d0;
    border-radius: 5px;
    margin-left: 10px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .25);
}

.panel-header-comment span {
    font-size: 12px;
}

.content-box-small {
    display: block;
    text-align: center;
    overflow: hidden;
    padding: 5px;
    margin-bottom: 10px;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .25);
}

.content-box-small.box-default {
    background-color: #ffffff;
    border: solid 1px #c5c5c5;
}

.content-box-small.box-primary .content-box-title,
.content-box-small.box-info .content-box-title,
.content-box-small.box-success .content-box-title,
.content-box-small.box-warning .content-box-title,
.content-box-small.box-danger .content-box-title,
.content-box-small.box-royal .content-box-title {
    color: #fff;
}

.content-box-small.box-primary {
    background-color: #0099da;
    color: #fff;
    border: solid 1px #005174;
}

.content-box-small.box-success {
    background-color: #02c66c;
    color: #fff;
    border: solid 1px #016135;
}

.content-box-small.box-info {
    background-color: #54c8eb;
    color: #fff;
    border: solid 1px #179bc2;
}

.content-box-small.box-warning {
    background-color: #f0ad4e;
    color: #fff;
    border: solid 1px #c77c11;
}

.content-box-small.box-danger {
    background-color: #d9534f;
    color: #fff;
    border: solid 1px #a02622;
}

.content-box-small.box-royal {
    background-color: #ac60d0;
    color: #fff;
    border: solid 1px #792e9c;
}

.content-box-small.box-primary:hover {
    background-color: #0087c1;
}

.content-box-small.box-success:hover {
    background-color: #02ad5e;
}

.content-box-small.box-info:hover {
    background-color: #3dc1e8;
}

.content-box-small.box-warning:hover {
    background-color: #eea236;
}

.content-box-small.box-danger:hover {
    background-color: #d43f3a;
}

.content-box-small.box-royal:hover {
    background-color: #a24cca;
}

.container-full-width {
    padding-left: 0px;
    padding-right: 0px;
    margin-right: auto;
    margin-left: auto;
}

@media (min-width: 768px) {
    .container-full-width {
        width: 750px;
    }
}

@media (min-width: 992px) {
    .container-full-width {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .container-full-width {
        width: 1170px;
    }
}

.panel-questionare {
    background: #f0f2fa;
}

.quiz-list-btn {
    color: #fff;
    background-color: #a10000;
    border-color: #d9534f;
    border-width: 2px;
    -webkit-animation-name: fadequizlogin;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 1s;
}

ul.questionanswers {
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
}

ul.questionanswers li {
    cursor: pointer;
    /*line-height: 34px; */
    /*margin: 5px 0;*/
    padding: 0px !important;
    display: flex;
    align-items: center;
    /* Aliniere la mijlocul vertical al containerului */
    height: 12rem;
    /* �nal?imea de 12 rem */
    width: 100%;
    /* La?imea 100% */

}

ul.questionanswers li.selected-item {
    background: #fbd647;
    border-radius: 0.4em;
}

/*
ul.questionanswers li>.variante {
    background: url(../../img/frontend/grad_button.jpg) top center repeat-x;
    border: 1px solid #B4B4B4;
    color: #324D62;
    font-size: 32px;
    font-weight: bold;
    height: 66px;
    line-height: 66px;
    margin: auto;
    text-align: center;
    width: 83px;
}*/
ul.questionanswers li>.variante {
    background: #dde0e8;
    /*border: 1px solid #B4B4B4;*/
    color: #324D62;
    font-size: 32px;
    font-weight: bold;
    height: 100% !important;
    line-height: 66px;
    margin: auto;
    text-align: center;
    width: 83px;
    border-start-start-radius: 4px;
    border-end-start-radius: 4px;
}

/*
ul.questionanswers li>.variante.selected {
    background: url(../../img/frontend/grad_button_selected.jpg) top center repeat-x;
}
*/
ul.questionanswers li>.variante.selected {
    background: #f9cb3c top center repeat-x;
}

ul.questionanswers li>.variante-text.selected {
    background: #fee38c top center repeat-x;
}



.button-actions {
    text-align: center;
    margin: 3px auto;
}

.button-actions>div,
.button-actions a>div {
    background: url(../../img/frontend/grad_examinare.jpg) top center repeat-x;
    border: 1px solid #A1A1A1;
    border-radius: 0.5em;
    height: 50px;
    margin: 0 auto;
    position: relative;
    width: 220px;
    cursor: pointer;
}

.button-actions>div:hover,
.button-actions a>div:hover {
    background: url(../../img/frontend/grad_examinare_hover.jpg) top center repeat-x;
}

.button-actions img {
    float: left;
    margin: 0 5px;
}

.span-text {
    float: left;
    margin: 5px 5px;
}

.btn-text {
    color: #000000 !important;
    display: inline-block;
    font-weight: bold;
    height: 100%;
    padding-left: 0;
    padding-top: 5px;
    position: relative;
    text-align: center;
    text-decoration: none;
    width: 100%;
}

.btn-text a {
    color: #000000 !important;
}

.button-actions>div>img {
    left: 5px;
    top: 7px;
    position: absolute;
}




.panel-default-2 {
    background: #e1e1e1 !important;
    /*border-bottom: #d9534f 1px solid;
    border-left: #d9534f 1px solid;
    border-right: #d9534f 1px solid;*/
}


/*.panel-danger-dark .panel-heading{background:#d9534f!important;}*/


.flowplayer {
    width: 100%;
    height: 100%;
}

.flowplayer {
    background: url(http://www.scoalarutiera.ro/assets/ups/main_logo_mini.jpg) no-repeat;
}

.flowplayer .fp-logo {
    left: auto;
    /* avoid logo being stuck on left side */
    right: 3%;
}


.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}



/* jQuery Countdown styles 1.6.3. */
.hasCountdown {
    /*width: 45px;*/
    margin-left: 0 !important;
}

.countdown_rtl {
    direction: rtl;
}

.countdown_holding span {
    color: #888;
}

.countdown_row {
    clear: both;
    width: 100%;
    padding: 0px 2px;
    text-align: center;
}

.countdown_show1 .countdown_section {
    width: 98%;
}

.countdown_show2 .countdown_section {
    width: 48%;
}

.countdown_show3 .countdown_section {
    width: 32.5%;
}

.countdown_show4 .countdown_section {
    width: 24.5%;
}

.countdown_show5 .countdown_section {
    width: 19.5%;
}

.countdown_show6 .countdown_section {
    width: 16.25%;
}

.countdown_show7 .countdown_section {
    width: 14%;
}

.countdown_section {
    display: block;
    float: left;
    font-size: 75%;
    text-align: center;
}

.countdown_amount {
    font-size: 200%;
}

.countdown_descr {
    display: block;
    width: 100%;
}

.thumbnail {
    padding: 0px;
}


.panel-comment-parent {
    position: relative;
}

.panel-comment-parent:after,
.panel-comment-parent:before {
    position: absolute;
    top: 11px;
    left: -16px;
    right: 100%;
    width: 0;
    height: 0;
    display: block;
    content: " ";
    border-color: transparent;
    border-style: solid solid outset;
    pointer-events: none;
}

.panel-comment-parent:after {
    border-width: 7px;
    border-right-color: #54c8eb;
    margin-top: 1px;
    margin-left: 2px;
}

.panel-comment-parent:before {
    border-right-color: #54c8eb;
    border-width: 8px;
}

.panel-comment {
    position: relative;
}

.panel-comment:after,
.panel-comment:before {
    position: absolute;
    top: 11px;
    left: -16px;
    right: 100%;
    width: 0;
    height: 0;
    display: block;
    content: " ";
    border-color: transparent;
    border-style: solid solid outset;
    pointer-events: none;
}

.panel-comment:after {
    border-width: 7px;
    border-right-color: #f7f7f7;
    margin-top: 1px;
    margin-left: 2px;
}

.panel-comment:before {
    border-right-color: #ddd;
    border-width: 8px;
}

.content-box-title-index {
    height: 50px;
}

.box-width-100 {
    padding: 0px !important;
}

#quiz-login {
    position: fixed;
    z-index: 1040;
    top: 160px;
    bottom: 0;
    left: -300px;
    display: box;
    width: 340px;
    /*height: 100%;*/
}

#quiz-login #quiz-login-content {
    display: table-cell;
    width: 300px;
    color: #fff;
    border-right: solid 1px #333;
    background-color: #444;
    padding: 10px;
}

#quiz-login #quiz-login-content h4 {
    margin: 0 0 10px 0;
    font-weight: bold;
}

#quiz-login #quiz-login-content p,
#quiz-login #quiz-login-content ul li {
    font-size: 13px;
    line-height: 1.2em;
}

#quiz-login #quiz-login-button {
    display: table-cell;
}

#quiz-login #quiz-login-button #quiz-login-btn {
    position: relative;
    top: 140px;
    width: 36px;
    height: 100px;
    margin-left: -1px;
    color: #fff;
    border: none;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    background-color: #444;
    padding-left: 8px;
    -webkit-animation-name: fadequizlogin;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-duration: 0.5s;
}

#quiz-login #quiz-login-button #quiz-login-btn i {
    font-size: 2.2rem;
    margin-left: -2px;
    line-height: 1.5;
}


@-webkit-keyframes fadequizlogin {
    50% {
        background-color: #d9534f;
    }
}


#quiz-wrong-answers {
    position: fixed;
    z-index: 1040;
    top: 150px;
    bottom: 0;
    right: -300px;
    display: box;
    width: 335px;
    /*height: 100%; */
}

#quiz-wrong-answers #quiz-wrong-answers-content {
    display: table-cell;
    width: 300px;
    color: #fff;
    border-right: solid 1px #333;
    background-color: #337ab7;
    padding: 10px;
}

#quiz-wrong-answers #quiz-wrong-answers-content h4 {
    margin: 0 0 10px 0;
    font-weight: bold;
}

#quiz-wrong-answers #quiz-wrong-answers-content p,
#quiz-wrong-answers #quiz-wrong-answers-content ul li {
    font-size: 13px;
    line-height: 1.2em;
}

#quiz-wrong-answers #quiz-wrong-answers-button {
    display: table-cell;
}

#quiz-wrong-answers #quiz-wrong-answers-button #quiz-wrong-answers-btn {
    position: relative;
    top: 140px;
    width: 36px;
    height: 100px;
    margin-right: -1px;
    color: #fff;
    border: none;
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
    background-color: rgb(51 122 183 / 50%);
    padding-left: 6px;
    /*-webkit-animation-name: fadequizwrong;
  -webkit-animation-iteration-count: 2;  
  -webkit-animation-duration: 2s; */
}



.quiz-wrong-answers-btn-active {
    background-color: #e11610 !important;
}

.quiz-wrong-answers-btn-active-success {
    background-color: #2ccd2c !important;
}

#quiz-wrong-answers #quiz-wrong-answers-button #quiz-wrong-answers-btn i {
    font-size: 2.2rem;
    margin-left: -2px;
    line-height: 1.5;
}

.pointer-size i {
    font-size: 1.5rem !important;
}

@-webkit-keyframes fadequizwrong {
    50% {
        background-color: #d9534f;
    }
}


.navbar-header-full.navbar-dark {
    position: relative;
    z-index: 1045;
}

hr-infonote {
    display: block;
    border-top: 1px solid #7dd4ff;
}

.display-flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.bootbox {
    z-index: 9999999999;
    /*margin-top: 30%;*/
}

.mb50 {
    margin-bottom: 50px !important;
}

.btn-cont-local {
    background-color: #792e9c;
}

/* .btn-black {
    background-color: #000000;
} */

.plr50 {
    padding-left: 50px;
    padding-right: 50px;
}

.modal-header-info {
    background-color: #5bc0de !important;
    color: #fff !important;
    font-size: medium;
    font-family: "Open sans", sans-serif;
}

.modal-header-local {
    background-color: #792e9c !important;
    color: #fff !important;
    font-size: medium;
    font-family: "Open sans", sans-serif;
}

.modal-header-success {
    background-color: #02c66c !important;
    color: #fff !important;
    font-size: medium;
    font-family: "Open sans", sans-serif;
}

.modal-header-danger {
    background: linear-gradient(to bottom, #d43f3a 5%, #d9534f 100%);
    color: #fff !important;
    font-size: medium;
    font-family: "Open sans", sans-serif;
}

.modal-header-info-dark {
    background-color: #337ab7;
    color: #fff !important;
    font-size: medium;
    font-family: "Open sans", sans-serif;
}

.modal-header-local .close,
.modal-header-success .close,
.modal-header-info-dark .close,
.modal-header-danger .close {
    line-height: 0 !important;
    opacity: 1;
    color: #fff !important;
    font-size: 28px;
}

.align-center {
    margin: auto;
    width: 50%;
}

.reset_progress {
    color: rgb(255, 255, 255);
}

@media (min-width: 992px) {

    .pl0 {
        padding-left: 0px !important;
    }

    .pr0 {
        padding-right: 0px !important;
    }

}

.panel-danger-dark {
    border-color: #d9534f;
}

.panel-danger-dark .panel-body {
    border: solid 0px #a94242;
}

.border-danger {
    border: #d9534f 1px solid !important;
}

.border-primary {
    border: #0099da 1px solid !important;
}

.border-warning {
    border: #f0ad4e 1px solid !important;
}

.border-success {
    border: #02c66c 1px solid !important;
}

textarea.form-control {
    height: auto !important;
}

.badge-header {
    padding: 2px 2px !important;
    font-size: 13px;
}

.badge-sidebar {
    padding: 5px 7px !important;
    font-size: 12px;
}

@media (min-width: 992px) {
    .modal-dialog-comments {
        max-width: 85%;
        width: 70%;
        margin: 30px auto;
    }
}


@media (max-width: 991px) {
    .top-nav-social {
        margin-left: 0px;
        margin-top: 5px;
        margin-bottom: 5px;
        margin-right: 5px;
        background: none;
        border: none;
        box-shadow: none;
        text-align: center;
        display: inherit;
    }

    .top-nav-social li {
        display: inline-block;
        float: none;
    }

    .top-nav-social a {
        padding: 7px 0;

    }

    .top-nav-social a i {
        font-size: 30px;
        color: #fff;
        margin: 10px 15px 0 0px;


    }


    .delete_comment {
        margin-right: 30px;
    }
}

.solid {
    margin-left: 15px;
    margin-right: 15px;
}

.mh500 {
    max-height: 500px;
    overflow-y: auto;
    overflow-x: hidden;
}

.mh600 {
    max-height: 600px;
    overflow-y: auto;
    overflow-x: hidden;
}

.mh450 {
    max-height: 450px;
    overflow-y: auto;
    overflow-x: hidden;
}

.mh400 {
    max-height: 400px;
    overflow-y: auto;
    overflow-x: hidden;
}

.mh350 {
    max-height: 350px;
    overflow-y: auto;
    overflow-x: hidden;
}

.username-comment {
    font-weight: bold;
    color: #ccc;
}

.panel-body-comment {}

.bell-mobile {
    font-size: 30px;
    color: #fff;
    margin: 10px 10px 0 0px;
}

.bell-mobile:hover {
    color: #fff;
}

.progress-label {
    position: absolute;
    top: -20px;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 12px;
}

.pt0 {
    padding-top: 0px !important;

}

.modal-header-warning-questions {
    background-color: #d9534f !important;
    border-color: #d9534f !important;
    color: #fff !important;
    font-size: medium;
    font-family: "Open sans", sans-serif;
}

.d-none {
    display: none !important;
}



.show-more.visible {
    max-height: 4000px !important;
}

.show-more-button {
    padding-bottom: 2px;
    display: inline-block;
    margin-top: -20px !important;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 6px;
    border-radius: 5px;
}

.show-less-button {
    padding-bottom: 2px;
    display: inline-block;
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 6px;
    border-radius: 5px;
}


.show-more-button-box {
    padding-bottom: 2px;
    display: inline-block;

    margin-top: -20px !important;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 5px;
}

.show-less-button-box {
    padding-bottom: 2px;
    display: inline-block;
    padding-left: 20px;
    padding-right: 20px;
    border-radius: 5px;
}


/* .show-more-gradient {
    background: -webkit-linear-gradient(#444, #eee);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
} */



.hide {
    display: none !important;
}

.visible {
    display: block !important;
}





@media (min-width: 768px) {
    .header-questionaire {
        border-right: 1px solid #959595;
        line-height: 1.8em;
    }
}

@media (max-width: 767px) {
    .header-questionaire {
        border-right: 1px solid #959595;
        line-height: 1.9em;
    }
}

@media (min-width: 768px) {
    .header-questionaire-left {

        border-left: 1px solid #959595;
        line-height: 1.8em;
    }
}



.header-questionaire-counter-mobile {
    margin-left: -5px;
    margin-right: -5px;
    background: #fff;
    margin-bottom: 35px;
    margin-top: -15px;
    border-bottom: 1px #959595 solid;
}

.answer-new {

    margin-bottom: 20px;
    cursor: pointer;
    border: solid 1px;
    border-radius: 5px;
    border-color: #c5c5c5;
    height: 100%;
    background-color: #ffff;
    width: 100%;
    display: flex;
    box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.1);

}

.answer-new {
    font-size: 1.1em;

}

.answer-new .badge {
    font-size: 36px !important;
    height: 12rem !important;
    width: 90px !important;
    background-color: #c5c5c5;
    color: #333 !important;
    font-weight: 700 !important;
    padding-top: 25px;


}


.answer-new .answer-text {
    width: 100% !important;
    padding: 5px !important;
    overflow-y: auto !important;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    height: 11.9rem;
    border-end-end-radius: 4px;
    border-start-end-radius: 4px;
}

/* .answer-new .answer-text {
    width: 100% !important;
    padding: 5px !important;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    overflow-y: visible !important;
    flex-grow: 1;
} */

.center-block-new {
    display: block;
    margin-right: auto;
    margin-left: auto;
    margin-top: 20px;
}

@media (max-width: 450px) {
    .fontsize14 {
        font-size: 14px !important;
    }
}





.btn.btn-later,
.btn.btn-modify,
.btn.btn-send {
    color: #454e68;
    border: 1px solid #d6dae4;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0px 10px 10px -5px rgba(0, 0, 0, 0.2);
    padding: 25px 40px;
    margin: 0 10px;
}

.btn.btn-later i,
.btn.btn-modify i,
.btn.btn-send i {
    font-size: 18px;
    margin-right: 4px;
}


.btn.btn-later:active,
.btn.btn-modify:active,
.btn.btn-send:active {
    -webkit-box-shadow: inset 0px 2px 6px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0px 2px 6px 2px rgba(0, 0, 0, 0.1);
}

.btn.btn-modify {
    color: #a52525;
    text-transform: uppercase;
}

.btn.btn-send {
    color: #fff;
    text-transform: uppercase;
    background-color: #59b359;
    border-color: #59b359;
}

.btn.btn-send:active {
    -webkit-box-shadow: inset 0px 7px 10px 2px rgba(0, 0, 0, 0.2);
    box-shadow: inset 0px 7px 10px 2px rgba(0, 0, 0, 0.2);
}



@media (max-width: 479px) {
    .buttons-questionnaire .btn:last-child {
        width: 100%;
        margin-bottom: 0;
        text-align: center;
    }
}

.buttons-questionnaire .btn:last-child {
    margin-right: 0;
}

.btn:not(:disabled):not(.disabled) {
    cursor: pointer;
}

@media (max-width: 479px) {
    .buttons-questionnaire .btn {
        width: 48%;
        margin-bottom: 10px;
    }
}

@media (max-width: 767px) {
    .buttons-questionnaire .btn {
        min-width: 31%;
        margin: 0;
        padding: 15px 10px;
        font-size: 11px;
    }
}

@media (max-width: 991px) {
    .buttons-questionnaire .btn {
        padding: 15px;
    }
}

@media (min-width: 991px) {

    .btn.btn-later,
    .btn.btn-modify,
    .btn.btn-send {
        padding: 20px 25px;
        font-size: 18px;

    }
}

@media (min-width: 768px) {
    .bg-questionnaire-top {
        background: #fff;
        border-bottom: 1px #959595 solid;
        margin-top: -35px;
        margin-left: -25px;
        margin-right: -25px;
    }
}

@media (max-width: 767px) {
    .bg-questionnaire-top-mobile {
        background: #fff;
        border-bottom: 1px #959595 solid;
        margin-top: -35px;
        margin-left: -5px;
        margin-right: -5px;

    }
}


.border-img-questionaire {
    box-shadow: 0px 15px 15px -10px rgba(0, 0, 0, 0.4);
}

.badge-questionare {
    border-end-end-radius: 0px;
    border-start-end-radius: 0px;
}

.ml0mr0 {
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.top-nav .dropdown a.btn-block {
    margin: 0 !important;
    padding: 10px;
}

.open>.dropdown-menu {
    margin-right: 0;
}

.top-nav {
    float: none;
    text-align: right;
    display: flex;
    justify-content: flex-end;
}

.theme-checkbox {
    opacity: 0;
    position: absolute;
}

.theme-checkbox-label {
    background-color: #111;
    width: 50px;
    height: 26px;
    border-radius: 50px;
    position: relative;
    padding: 5px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0;
}

.theme-button {
    margin: auto 0 auto 10px;
}

.theme-button input {
    display: none;
}

.theme-button .fa-moon {
    color: #fff;
}

.theme-button .fa-sun {
    color: #f39c12;
}

.theme-checkbox-label .ball {
    background-color: #fff;
    width: 22px;
    height: 22px;
    position: absolute;
    left: 2px;
    top: 2px;
    border-radius: 50%;
    transition: transform 0.2s linear;
}

.theme-checkbox:checked+.theme-checkbox-label .ball {
    transform: translateX(24px);
}

.show-more-gradient {
    position: relative;
}

.show-more-gradient:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 90%;
    opacity: .9;
    background: linear-gradient(357deg, rgba(255, 255, 255, 1) 30%, rgba(255, 255, 255, 0) 100%);
}


.panel-success-dark .panel-heading,
.panel-success-dark .panel-footer {
    background-color: #02C66C;
    color: #fff;
    border: 1px solid #148D56;
}

.panel-heading.panel-plus-link a {
    display: flex;
    align-items: center;
    padding: 5px 40px 5px 10px !important;
    justify-content: space-between;
    min-height: 60px;
    font-size: 16px;
}

.panel-heading.panel-plus-link a .panel-img {
    max-width: 110px;
    max-height: initial;
    border-radius: 5px;
}

.panel-group .panel>.panel-heading.panel-plus-link a:before {
    position: absolute;
    right: 0px;
    font-size: 2em !important;
}

.panel-royal {
    border-color: #c39bd7
}

.content-box.box-default.no-hover:hover {
    background-color: transparent;
}


/*
* Dark CSS
*/

body.dark {
    color: #c3c3c3;
}

body.dark .main-header .page-title,
body.dark h1,
body.dark h2,
body.dark h3,
body.dark h4,
body.dark h5,
body.dark h6 {
    color: #6eb6d3;
}

body.dark .boxed {
    background: #252525;
    color: #c3c3c3;
}

body.dark .content-box.box-default {
    background: #333;
    border-color: #606060;
}

body.dark .text {
    color: #c0c0c0;
}

body.dark .content-box.box-default:hover {
    background: #494949;
}

body.dark .bg-white {
    background: #4c4c4c !important;
    border-color: #4e4e4e;
}

body.dark .progress span {
    color: #fff;
}

body.dark .panel,
body.dark .panel-chestionare,
body.dark .content-box-small.box-default {
    background-color: #393939;
}

body.dark .icon-ar.icon-ar-white {
    background-color: #4b4b4b;
    color: #ddd !important;
}

body.dark .progress {
    background-color: #555555;
}

body.dark .btn-default {
    color: #c3c3c3;
    background-color: #5b5b5b;
    border-color: #6b6b6b;
}

body.dark .btn-default:hover {
    color: #c3c3c3;
    background-color: #797676;
    border-color: #6b6b6b;
}

body.dark .list-group-item {
    background-color: #323232;
    border: 1px solid #5b5b5b;
    color: #c3c3c3 !important;
}

body.dark .thumbnail {
    background-color: #323232;
    border: 1px solid #5b5b5b;
}

body.dark .panel-default .panel-heading,
body.dark .panel-default .panel-footer {
    background-color: #5e5e5e;
    color: #d0d0d0;
}

body.dark .pagination>li>a,
body.dark .pagination>li>span {
    background: #505050;
}

body.dark .panel-footer {
    background-color: #454545;
}

body.dark .panel-footer-wrong-qest {
    padding: 10px 15px;
    background-color: #452d50;
    border-top: 1px solid #623378;
}

body.dark .page-header {
    color: #c3c3c3;
}

body.dark .main-header {
    background-color: #4c4c4c;
}

body.dark .main-header-wrong-qest {
    background-color: #3b264e;
}

body.dark .main-header .page-title {
    color: #e3e3e3;
}

body.dark .main-header-wrong-qest .page-title {
    color: #e3e3e3;
}

.mobile-social {
    display: flex;
    justify-content: center;
}

body.dark .modal-content {
    background: #414141;
}

body.dark .modal-header {
    border-color: #333;
}

body.dark .form-control {
    background: #333;
    border-color: #444;
}

body.dark .panel-chestionar {
    color: #fff !important;
}

body.dark .panel-danger-dark .panel-title,
body.dark .panel-success .panel-title,
body.dark .panel-primary .panel-title,
body.dark .panel-info .panel-title {
    color: #fff;
}

body.dark a:hover {
    color: #fff !important;
}

/* 
body.dark .show-more-gradient {
    background: -webkit-linear-gradient(#eee, #444);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
} */

body.dark .show-more-gradient:before {
    opacity: .95;
    background: linear-gradient(357deg, #393939 30%, rgba(255, 255, 255, 0) 100%);
}

body.dark .question-title {
    color: #c3c3c3;
}

/*body.dark #explication .panel-body span,
body.dark #explication .panel-body div {
    background: #1f1d1d !important;
}*/

body.dark .info-blue {
    border-color: #416474;
    background-color: #31444d;
    color: #fff;
}

body.dark .info-blue hr-infonote {
    border-color: #577c8d;
}

body.dark .info-blue a {
    color: #fff !important;
}

body.dark .panel-header-comment-parent {
    background-color: #387d9b;
}

body.dark .panel-comments-parent {
    background-color: #444;
    color: #ffff;
    border-color: #6c6c6c;
}

body.dark .panel-footer-comment-parent {
    background: #444;
    border-color: #838080;
}

body.dark .panel-comment-parent:before {
    border-right-color: #387d9b;
}

body.dark .panel-comment-parent:after {
    border-right-color: #387d9b;
}

body.dark .panel-header-comment-child {
    background-color: #6a6a6a;
    color: #fff;
}

body.dark .panel-comments-child {
    background-color: #636363;
    color: #fff;
    border-color: #7f7f7f;
}

body.dark .panel-comment:before {
    border-right-color: #6A6A6A;
}

body.dark .panel-comment:after {
    border-right-color: #6A6A6A;
}

body.dark .btn-primary {
    color: #fff;
    background-color: #336691;
    border-color: #315b80
}

body.dark .btn-primary.focus,
body.dark .btn-primary:focus {
    color: #fff;
    background-color: #204c72;
    border-color: #0d202f
}

body.dark .btn-primary:hover {
    color: #fff;
    background-color: #224f76;
    border-color: #183956
}

body.dark .btn-primary.active,
body.dark .btn-primary:active,
body.dark .open>.dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #215079;
    border-color: #193a58
}

body.dark .btn-primary.active.focus,
body.dark .btn-primary.active:focus,
body.dark .btn-primary.active:hover,
body.dark .btn-primary:active.focus,
body.dark .btn-primary:active:focus,
body.dark .btn-primary:active:hover,
body.dark .open>.dropdown-toggle.btn-primary.focus,
body.dark .open>.dropdown-toggle.btn-primary:focus,
body.dark .open>.dropdown-toggle.btn-primary:hover {
    color: #fff;
    background-color: #11283b;
    border-color: #0e2232
}

body.dark .btn-primary.active,
body.dark .btn-primary:active,
body.dark .open>.dropdown-toggle.btn-primary {
    background-image: none
}

body.dark .btn-primary.disabled.focus,
body.dark .btn-primary.disabled:focus,
body.dark .btn-primary.disabled:hover,
body.dark .btn-primary[disabled].focus,
body.dark .btn-primary[disabled]:focus,
body.dark .btn-primary[disabled]:hover,
body.dark fieldset[disabled] .btn-primary.focus,
body.dark fieldset[disabled] .btn-primary:focus,
body.dark fieldset[disabled] .btn-primary:hover {
    background-color: #223647;
    border-color: #284a67
}

body.dark .btn-primary .badge {
    color: #223648;
    background-color: #fff
}

body.dark .btn-success {
    color: #fff;
    background-color: #438743;
    border-color: #306e30
}

body.dark .btn-success.focus,
body.dark .btn-success:focus {
    color: #fff;
    background-color: #255425;
    border-color: #193919
}

body.dark .btn-success:hover {
    color: #fff;
    background-color: #275b27;
    border-color: #235123
}

body.dark .btn-success.active,
body.dark .btn-success:active,
body.dark .open>.dropdown-toggle.btn-success {
    color: #fff;
    background-color: #2c642c;
    border-color: #265626
}

body.dark .btn-success.active.focus,
body.dark .btn-success.active:focus,
body.dark .btn-success.active:hover,
body.dark .btn-success:active.focus,
body.dark .btn-success:active:focus,
body.dark .btn-success:active:hover,
body.dark .open>.dropdown-toggle.btn-success.focus,
body.dark .open>.dropdown-toggle.btn-success:focus,
body.dark .open>.dropdown-toggle.btn-success:hover {
    color: #fff;
    background-color: #255525;
    border-color: #183718
}

body.dark .btn-success.active,
body.dark .btn-success:active,
body.dark .open>.dropdown-toggle.btn-success {
    background-image: none
}

body.dark .btn-success.disabled.focus,
body.dark .btn-success.disabled:focus,
body.dark .btn-success.disabled:hover,
body.dark .btn-success[disabled].focus,
body.dark .btn-success[disabled]:focus,
body.dark .btn-success[disabled]:hover,
body.dark fieldset[disabled] .btn-success.focus,
body.dark fieldset[disabled] .btn-success:focus,
body.dark fieldset[disabled] .btn-success:hover {
    background-color: #326232;
    border-color: #265526
}

body.dark .btn-success .badge {
    color: #254625;
    background-color: #fff
}

body.dark .btn-info {
    color: #fff;
    background-color: #41859a;
    border-color: #2b6e83
}

body.dark .btn-info.focus,
body.dark .btn-info:focus {
    color: #fff;
    background-color: #1b5b6e;
    border-color: #134b5c
}

body.dark .btn-info:hover {
    color: #fff;
    background-color: #144655;
    border-color: #175c70
}

body.dark .btn-info.active,
body.dark .btn-info:active,
body.dark .open>.dropdown-toggle.btn-info {
    color: #fff;
    background-color: #1b6378;
    border-color: #1a6176
}

body.dark .btn-info.active.focus,
body.dark .btn-info.active:focus,
body.dark .btn-info.active:hover,
body.dark .btn-info:active.focus,
body.dark .btn-info:active:focus,
body.dark .btn-info:active:hover,
body.dark .open>.dropdown-toggle.btn-info.focus,
body.dark .open>.dropdown-toggle.btn-info:focus,
body.dark .open>.dropdown-toggle.btn-info:hover {
    color: #fff;
    background-color: #16586c;
    border-color: #144d5e
}

body.dark .btn-info.active,
body.dark .btn-info:active,
body.dark .open>.dropdown-toggle.btn-info {
    background-image: none
}

body.dark .btn-info.disabled.focus,
body.dark .btn-info.disabled:focus,
body.dark .btn-info.disabled:hover,
body.dark .btn-info[disabled].focus,
body.dark .btn-info[disabled]:focus,
body.dark .btn-info[disabled]:hover,
body.dark fieldset[disabled] .btn-info.focus,
body.dark fieldset[disabled] .btn-info:focus,
body.dark fieldset[disabled] .btn-info:hover {
    background-color: #377284;
    border-color: #296b7f
}

body.dark .btn-info .badge {
    color: #397689;
    background-color: #fff
}

body.dark .btn-warning {
    color: #fff;
    background-color: #9c7032;
    border-color: #503714
}

body.dark .btn-warning.focus,
body.dark .btn-warning:focus {
    color: #fff;
    background-color: #50340c;
    border-color: #513207
}

body.dark .btn-warning:hover {
    color: #fff;
    background-color: #402a0c;
    border-color: #58370a
}

body.dark .btn-warning.active,
body.dark .btn-warning:active,
body.dark .open>.dropdown-toggle.btn-warning {
    color: #fff;
    background-color: #56380e;
    border-color: #613d0b
}

body.dark .btn-warning.active.focus,
body.dark .btn-warning.active:focus,
body.dark .btn-warning.active:hover,
body.dark .btn-warning:active.focus,
body.dark .btn-warning:active:focus,
body.dark .btn-warning:active:hover,
body.dark .open>.dropdown-toggle.btn-warning.focus,
body.dark .open>.dropdown-toggle.btn-warning:focus,
body.dark .open>.dropdown-toggle.btn-warning:hover {
    color: #fff;
    background-color: #633e0b;
    border-color: #5e3a08
}

body.dark .btn-warning.active,
body.dark .btn-warning:active,
body.dark .open>.dropdown-toggle.btn-warning {
    background-image: none
}

body.dark .btn-warning.disabled.focus,
body.dark .btn-warning.disabled:focus,
body.dark .btn-warning.disabled:hover,
body.dark .btn-warning[disabled].focus,
body.dark .btn-warning[disabled]:focus,
body.dark .btn-warning[disabled]:hover,
body.dark fieldset[disabled] .btn-warning.focus,
body.dark fieldset[disabled] .btn-warning:focus,
body.dark fieldset[disabled] .btn-warning:hover {
    background-color: #6e5026;
    border-color: #563b15
}

body.dark .btn-warning .badge {
    color: #705126;
    background-color: #fff
}

body.dark .btn-danger {
    color: #fff;
    background-color: #823330;
    border-color: #742421
}

body.dark .btn-danger.focus,
body.dark .btn-danger:focus {
    color: #fff;
    background-color: #6a1a18;
    border-color: #4f1311
}

body.dark .btn-danger:hover {
    color: #fff;
    background-color: #791e1b;
    border-color: #631917
}

body.dark .btn-danger.active,
body.dark .btn-danger:active,
body.dark .open>.dropdown-toggle.btn-danger {
    color: #fff;
    background-color: #91221e;
    border-color: #551513
}

body.dark .btn-danger.active.focus,
body.dark .btn-danger.active:focus,
body.dark .btn-danger.active:hover,
body.dark .btn-danger:active.focus,
body.dark .btn-danger:active:focus,
body.dark .btn-danger:active:hover,
body.dark .open>.dropdown-toggle.btn-danger.focus,
body.dark .open>.dropdown-toggle.btn-danger:focus,
body.dark .open>.dropdown-toggle.btn-danger:hover {
    color: #fff;
    background-color: #691a17;
    border-color: #46110f
}

body.dark .btn-danger.active,
body.dark .btn-danger:active,
body.dark .open>.dropdown-toggle.btn-danger {
    background-image: none
}

body.dark .btn-danger.disabled.focus,
body.dark .btn-danger.disabled:focus,
body.dark .btn-danger.disabled:hover,
body.dark .btn-danger[disabled].focus,
body.dark .btn-danger[disabled]:focus,
body.dark .btn-danger[disabled]:hover,
body.dark fieldset[disabled] .btn-danger.focus,
body.dark fieldset[disabled] .btn-danger:focus,
body.dark fieldset[disabled] .btn-danger:hover {
    background-color: #791916;
    border-color: #421513
}

body.dark .btn-danger .badge {
    color: #541715;
    background-color: #fff
}

body.dark .step-success {
    background-color: #438743;
}

body.dark .progress-bar-success {
    background-color: #438743;
}

body.dark .progress-bar-warning {
    background-color: #9c6d2a;
}

body.dark .box-success {
    background-color: #438743 !important;
    border-color: #306e30 !important;
}

body.dark .box-success:hover {
    background-color: #285128 !important;
    border-color: #193a19 !important;
}

body.dark .step-warning {
    background-color: #9c7032;
}

body.dark .box-warning {
    background-color: #8C6229 !important;
}

body.dark .box-warning:hover {
    background-color: #785727 !important;
}

body.dark .badge-donate {
    background-color: #b87008;
}

body.dark .btn-ar.btn-info {
    background: linear-gradient(to bottom, #224f76 5%, #2d5e6d 100%);
}

body.dark .btn-ar.btn-success {
    background: linear-gradient(to bottom, #5CA43F 5%, #386625 100%);
}

body.dark .panel-info>.panel-heading {
    background-color: #2D485F;
    border-color: #2B6E83;
}

body.dark .panel-royal>.panel-heading {
    background-color: #4f2f5e;
    border-color: #4f2f5e;
}

body.dark .panel-info {
    border-color: #417e91;
}

body.dark .panel-royal {
    border-color: #9a5fb7;
}

body.dark .btn-ar.btn-warning {
    background: linear-gradient(to bottom, #9c7032 5%, #684616 100%);
}

body.dark .btn-ar.btn-primary {
    color: #fff;
    background: linear-gradient(to bottom, #224f76 5%, #183956 100%);
}

body.dark .progress-subcategory {
    background: #2D485F !important;
}

body.dark .progress-subcategory:hover {
    background: #214c5a !important;
}

body.dark .step-info {
    background-color: #336691;
}

body.dark .label-primary {
    background-color: #2D485F;
}

body.dark .label-success {
    background-color: #438743;
}

body.dark .label-warning {
    background-color: #9C7032;
}

body.dark .label-danger {
    background-color: #791916;
}

body.dark .label-info {
    background-color: #377284;
}

body.dark .label-royal {
    background-color: #73418a;
}

body.dark .info {
    background: #4498b1;
}

body.dark .navbar-default.navbar-dark .navbar-nav>.open>a,
body.dark .navbar-default.navbar-dark .navbar-nav>.open>a:hover,
body.dark .navbar-default.navbar-dark .navbar-nav>.open>a:focus {
    background-color: #0a5c7f;
}

body.dark .navbar-default .navbar-nav>li>a:hover,
body.dark .navbar-default .navbar-nav>li>a:active,
body.dark .navbar-default .navbar-nav>li>a:focus,
body.dark .navbar-default .navbar-nav>.active>a:hover,
body.dark .navbar-default .navbar-nav>.active>a {
    background-color: #0a5c7f;
}

body.dark .dropdown-menu .active>a,
body.dark .dropdown-menu li>a:hover,
body.dark .dropdown-menu li>a:focus,
body.dark .dropdown-menu li>a:active {
    background-color: #117fae;
}

body.dark .danger {
    background: #823330;
}

body.dark .step-danger {
    background-color: #823330;
}

body.dark .panel-danger-dark {
    border-color: #823330;
}

body.dark .panel-danger-dark .panel-heading,
body.dark .panel-danger-dark .panel-footer {
    background-color: #823330;
}

body.dark .panel-box {
    background: #08709c !important;
}

body.dark .content-box.box-info {
    background-color: #08709C;
    border-color: #2f7bbe;
}

body.dark .content-box.box-danger {
    background-color: #823330;
    border-color: #a5332f;
}

body.dark .content-box.box-info:hover {
    background-color: #074f6d;
}

body.dark .content-box.box-danger:hover {
    background-color: #662c29;
}

body.dark .answer.selected {
    color: #2b6272;
}

body.dark .panel-info-3 {
    border-color: #623378;
}

body.dark .panel-info-3>.panel-heading {
    background: #623378;
}

body.dark .progress-bar-primary {
    background-color: #336691;
}

body.dark .progress-bar-danger {
    background-color: #823330;
}

body.dark .panel-success>.panel-heading {
    background-color: #438743;
    border-color: #438743;
}

body.dark .panel-success {
    border-color: #438743;
}

body.dark .panel-warning {
    border-color: #9C7032;
}

body.dark .panel-warning .panel-heading {
    border-color: #9C7032;
    background: #9C7032 !important;
}

body.dark .panel-primary {
    border-color: #417e91;
}

body.dark .panel-primary .panel-heading,
body.dark .panel-primary .panel-footer {
    background-color: #2D485F;
    border-color: #2D485F;
}

body.dark .border-primary {
    border-color: #417e91 !important;
}

body.dark .btn-ar.btn-danger {
    background: linear-gradient(to bottom, #823330 5%, #481312 100%);
}

body.dark .content-box-small.box-danger {
    background-color: #823330;
    border-color: #9a100b;
}

body.dark .content-box-small.box-danger:hover {
    background-color: #6d2b28;
    border-color: #7b0905;
}

body.dark .results.selected {
    color: #2b6272;
}

body.dark .panel-title-result {
    background: #909090;
}

body.dark .badge-success {
    background-color: #00723e;
}

body.dark .badge-danger {
    background-color: #b72b27;
}

body.dark .bg-questionnaire-top {
    background: #3d3d3d;
}

body.dark .panel-questionare {
    background: #4d4d4d;
}

body.dark .answer-new {
    background-color: #5f5f5f;
}

body.dark ul.questionanswers li>.variante {
    background: #767676;
    color: #C3C3C3 !important;
}

body.dark .btn.btn-later,
body.dark .btn.btn-modify {
    border-color: #888888;
    background-color: #858585;
}

body.dark .panel-default-2 {
    background-color: #3a3a3a !important;
}

body.dark .badge-list {
    background: #5f5f5f !important;
    border-color: #6a6a6a;
}

body.dark ul.questionanswers li>.variante-text.selected {
    background: #716230 top center repeat-x;
}

body.dark ul.questionanswers li>.variante.selected {
    background: #967c29 top center repeat-x;
}

body.dark .header-questionaire-counter-mobile {
    background: #3d3d3d;
}

body.dark .sendanswerquestionnaire[disabled] {
    background-color: #385337;
}

body.dark .sendanswerquestionnaire {
    background-color: #086f3d;
}

body.dark .question_description div,
body.dark .question_description span {
    background: #252525 !important;
}

body.dark .content-box.box-default.no-hover:hover {
    background-color: #333;
}

.border-black {
    border: #000 5px solid !important;
}

/* .panel-img {
    max-height: 40px;
    overflow: hidden;
    text-align: end;

} */

.panel-img {
    max-width: 40px;
    max-height: 40px;
    width: auto;
    height: auto;
    text-align: end !important;
}

.panel-group .panel>.panel-heading.panel-plus-link a.collapsed:before {
    content: "\f0d7" !important;
}

.panel-group .panel>.panel-heading.panel-plus-link a:before {
    content: "\f0d8" !important;
}

/*.user-photo{min-width:40px!important;}*/


/* Mobile Small Layout */
/*@media (min-width: 360px) and (max-width: 768px) {
 .container{padding-left:10px;padding-right:10px;}
} */


@media (max-width: 399px) {
    .content-box-title-index {
        min-height: 60px;
        font-size: 15px;
        line-height: 15px;
        padding: 0 5px;
    }

    .content-box-title-indicators-index {
        min-height: 50px;
        font-size: 14px;
        line-height: 14px;
        padding: 0 0px;
    }

    .content-box-title-indicator {
        min-height: 45px;
        font-size: 14px;
        line-height: 14px;
        padding: 0 0px;
    }

    .content-box-title-pasi {
        min-height: 20px;
        font-size: 16px;
        line-height: 18px;
        padding: 0 5px;
    }
}

@media (min-width: 400px) {
    .content-box-title-index {
        min-height: 50px;
        font-size: 16px;
        line-height: 16px;
        padding: 0 5px
    }

    .content-box-title-indicators-index {
        min-height: 45px;
        font-size: 15px;
        line-height: 15px;
        padding: 0 0px;
    }

    .content-box-title-indicator {
        min-height: 45px;
        font-size: 15px;
        line-height: 15px;
        padding: 0 0px;
    }

    .content-box-title-pasi {
        min-height: 20px;
        font-size: 18px;
        line-height: 20px;
        padding: 0 5px;
    }
}

@media (min-width: 500px) {
    .content-box-title-index {
        min-height: 40px;
        font-size: 17px;
        line-height: 17px;
        padding: 0 5px;
    }

    .content-box-title-indicators-index {
        min-height: 32px;
        font-size: 16px;
        line-height: 16px;
        padding: 0 0px;
    }

    .content-box-title-indicator {
        min-height: 32px;
        font-size: 15px;
        line-height: 15px;
        padding: 0 0px;
    }
}

@media (min-width: 700px) {
    .content-box-title-index {
        min-height: 40px;
        font-size: 18px;
        line-height: 20px;
        padding: 0 5px;
    }
}

@media (min-width: 768px) {
    .content-box-title-index {
        min-height: 40px;
        font-size: 18px;
        line-height: 20px;
        padding: 0 5px;
    }

    .content-box-title-indicators-index {
        min-height: 35px;
        font-size: 16px;
        line-height: 16px;
        padding: 0 0px;
    }

    .content-box-title-indicator {
        min-height: 50px;
        font-size: 16px;
        line-height: 16px;
        padding: 0 0px;
    }

    .content-box-title-pasi {
        min-height: 60px;
        font-size: 18px;
        line-height: 20px;
        padding: 0 5px;
    }
}

@media (min-width: 992px) {
    .content-box-title-index {
        min-height: 40px;
        font-size: 18px;
        line-height: 20px;
        padding: 0 5px;
    }

    .content-box-title-indicators-index {
        min-height: 35px;
        font-size: 17px;
        line-height: 17px;
        padding: 0 0px;
    }

    .content-box-title-indicator {
        min-height: 53px;
        font-size: 17px;
        line-height: 17px;
        padding: 0 0px;
    }

    .content-box-title-pasi {
        min-height: 42px;
        font-size: 18px;
        line-height: 20px;
        padding: 0 5px;
    }
}

@media (min-width: 1200px) {
    .content-box-title-index {
        min-height: 40px;
        font-size: 18px;
        line-height: 20px;
        padding: 0 5px;
    }

    .content-box-title-pasi {
        min-height: 80px;
        font-size: 18px;
        line-height: 20px;
        padding: 0 5px;
    }
}

@media only screen and (max-width: 340px) {
    .context-result-pred {
        height: 168px;
    }

    .context-result-gen {
        height: 120px;
    }

}

@media only screen and (max-width: 850px) {

    /*.mtb20tc{margin-left:-5px!important;}*/
    .mt30 {
        margin-top: 30px !important;
    }
}

@media only screen and (max-width: 991px) {
    .video-left {
        display: none;
    }

    .video {
        width: 100%;
        height: 505px;
    }

    .navbar-header-full.navbar-dark {
        position: fixed !important;
        width: 100%;
        left: 0;
        top: 0;
    }

    body {
        padding-top: 51px;
    }

    .scrolled-down {
        transform: translateY(-100%);
        transition: all 0.3s ease-in-out;
    }

    .scrolled-up {
        transform: translateY(0);
        transition: all 0.3s ease-in-out;
    }
}

@media (min-width: 768px) and (max-width: 991px) {

    .navbar-toggle,
    .navbar-default .navbar-brand,
    .navbar-dark a,
    .navbar-dark a {
        display: block !important;
    }

    .header-full {
        display: none !important;
    }

    .navbar-collapse {
        width: auto;
        border-top: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .navbar-default .navbar-nav {
        margin-top: 0;
        margin-bottom: 0;
        float: none;
    }

    .dropdown>a::after {
        top: 10px;
        right: 15px;
        content: "\f104";
    }

    .navbar-header {
        float: none;
    }

    .navbar .container.container-header {
        width: 100%;
        padding: 0;
    }

    .navbar-default .navbar-brand {
        margin-left: 45px !important;
    }

    .navbar-dark .dropdown>a {
        border-top: solid 2px #555;
        margin: 0;
    }

    .navbar-nav>li {
        float: none;
    }

    .navbar-collapse.collapse {
        display: none !important;
    }

    .navbar-collapse.collapse.in {
        display: block !important;
    }

    .dropdown-menu a {
        padding-top: 7px !important;
        padding-bottom: 7px !important;
    }

    .navbar-nav .open .dropdown-menu>li>a {
        color: #fff !important;
    }

    .navbar-nav .open>.dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
        display: block !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .video-left {
        width: 160px;
    }

    .video {
        width: 750px;
    }

    .navbar-default .navbar-nav>li {
        margin-left: -5px;
        margin-right: -5px;
    }

    .navbar-default .navbar-nav>li>a {
        font-size: 14px;
        font-weight: 300;
        letter-spacing: -0.5px;
    }
}

@media (min-width: 320px) and (max-width: 350px) {
    .video {
        width: 100%;
        height: 275px;
    }
}

@media (min-width: 350px) and (max-width: 400px) {
    .video {
        width: 100%;
        height: 300px;
    }
}

@media (min-width: 400px) and (max-width: 450px) {
    .video {
        width: 100%;
        height: 325px;
    }
}

@media (min-width: 450px) and (max-width: 500px) {
    .video {
        width: 100%;
        height: 350px;
    }
}

@media (min-width: 500px) and (max-width: 550px) {
    .video {
        width: 100%;
        height: 375px;
    }
}

@media (min-width: 550px) and (max-width: 600px) {
    .video {
        width: 100%;
        height: 400px;
    }
}

@media (min-width: 600px) and (max-width: 650px) {
    .video {
        width: 100%;
        height: 425px;
    }
}

@media (min-width: 650px) and (max-width: 700px) {
    .video {
        width: 100%;
        height: 450px;
    }
}

@media (min-width: 700px) and (max-width: 767px) {
    .video {
        width: 100%;
        height: 475px;
    }
}

@media only screen and (max-width: 767px) {
    .w100chest {
        width: 80px !important;
        height: 20px !important;
    }

    .w150 {
        width: 80px !important;
        height: 20px !important;
    }

    #count-coffees,
    #count-coffees span {
        font-size: 18px;
        line-height: 1.2 !important;
    }

    .icon-result {
        line-height: 1.2 !important;
        font-size: 18px !important;
    }

    .panel-result {
        height: 30px;
        padding: 5px;
    }

    .panel-chestionar {
        font-size: 14px !important;
        padding: 0px;
    }

    .content-result {
        padding: 5px;
    }

    .sendanswer,
    .sendanswerquestionnaire {
        margin-bottom: 10px !important;
    }

    #share {
        margin-top: 20px !important;
    }

    .font-black {
        margin-top: 20px !important;
    }

    .txt-button-result {
        font-size: 12px;
    }

    .btn-reset {
        margin-top: 5px !important;
    }

    .button-actions>div,
    .button-actions a>div {
        width: 60px;
    }

    /*ul.questionanswers li > .variante {margin:auto;}*/
    .button-actions a>div>img {
        left: 5px;
        top: 5px;
        position: absolute;
    }

    .container {
        padding: 10px !important;
    }

    .container-full-width {
        padding: 10px 5px 5px 5px !important;
    }

    .container-for-xs {
        padding: 10px 5px 5px 5px !important;
    }

    .container-header {
        padding-top: 0px !important;
        padding-bottom: 0px !important;
    }

    .main-header {
        margin-bottom: 10px;
    }

    /* .col-xs-6, .col-xs-12{padding:10px!important;}*/
    .passed-block .col-xs-6,
    .passed-block .col-xs-12 {
        padding: 0 15px !important;
    }

    .panel-body {
        padding: 5px !important;
    }

    .page-title {
        font-size: 20px !important;
    }

    .panel-title {
        font-size: 20px !important;
        /*padding:0px!important;*/
    }

    .nopadding {
        padding-top: 0px !important;
        padding-bottom: 0px !important;

    }

    .padding0 {
        padding: 0px !important;
    }

    .bg-questionnaire {
        padding: 0px !important;
    }

    .pl5r5 {
        padding-left: 5px;
        padding-right: 5px;
    }

    .box-text {
        height: 80px !important;
    }

    .box-text-chestionare {
        height: 25px !important;
    }

    body {
        overflow-x: hidden !important;
    }

    .video {
        width: 100%;
        height: 400px;
    }

    .mt30 {
        margin-top: 0px;
    }

    #quiz-wrong-answers,
    #quiz-login {
        top: 100px !important;
    }

    .mt20m {
        margin-top: 20px
    }

    .img-general {
        height: 145px !important;
    }

    .col-xs-4 {
        padding-right: 5px;
        padding-left: 5px;
    }

    .col-xs-6 {
        padding-right: 5px;
        padding-left: 5px;
    }

    .fsize9 {
        margin: 0 0 0px !important;
    }

    .fsize10 {
        margin: 0 0 0px !important;
    }

    .fsize11 {
        margin: 0 0 0px !important;
    }

    .fsize15 {
        margin: 0 0 0px !important;
    }

    .context-result-pred {
        height: 120px;
    }

    .context-result-gen {
        height: 85px;
    }

    body:not(.dark) .navbar-dark,
    body:not(.dark) #footer-widgets {
        background-color: #4d4d4d;
    }

    body:not(.dark) #footer {
        background-color: #4e4e4e;
    }

    ul.questionanswers li {
        height: auto;
        align-items: inherit;
    }

    ul.questionanswers li>.variante {
        height: inherit !important;
        margin: 0;
        display: flex;
        padding: 10px;
        align-items: center;
        justify-content: center;
    }

    .answer-new .answer-text {
        height: auto;
        /* font-size: 14px; */
        padding-left: 10px !important;
    }
}


.border-success {
    border: 1px solid #148D56;
}

@media (max-width: 767px) {
    .navbar-dark .dropdown-li>a {
        border-top: solid 2px #555;
        margin: 0;
    }
}

.vjs-remaining-time {
    display: none;
}

.vjs-playback-rate {
    display: none;
}


.disabled-answer {
    opacity: 1;
    pointer-events: none;
}

.ui-group-buttons .or {
    position: relative;
    float: left;
    width: .3em;
    height: 2.1em;
    z-index: 3;
    font-size: 12px
}

.ui-group-buttons .or:before {
    position: absolute;
    top: 50%;
    left: 50%;
    content: 'sau';
    background-color: #5a5a5a;
    margin-top: -.1em;
    margin-left: -.9em;
    width: 2em;
    height: 2em;
    line-height: 1.7;
    color: #fff;
    font-style: normal;
    font-weight: 400;
    text-align: center;
    border-radius: 500px;
    -webkit-box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
    box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box
}

/* .ui-group-buttons .or:after {
    position: absolute;
    top: 0;
    left: 0;
    content: ' ';
    width: .3em;
    height: 2.84em;
    background-color: rgba(0, 0, 0, 0);
    border-top: .6em solid #5a5a5a;
    border-bottom: .6em solid #5a5a5a
} */

.ui-group-buttons .or:after {
    position: absolute;
    top: 6px;
    left: 0;
    content: ' ';
    width: .3em;
    height: 3.1em;
    background-color: rgba(0, 0, 0, 0);
    border-top: .6em solid #5a5a5a;
    border-bottom: .6em solid #5a5a5a;
}

.ui-group-buttons .or.or-lg {
    height: 1.3em;
    font-size: 16px
}

.ui-group-buttons .or.or-lg:after {
    height: 2.85em
}

.ui-group-buttons .or.or-sm {
    height: 1em
}

.ui-group-buttons .or.or-sm:after {
    height: 2.5em
}

.ui-group-buttons .or.or-xs {
    height: .25em
}

.ui-group-buttons .or.or-xs:after {
    height: 1.84em;
    z-index: -1000
}

.ui-group-buttons {
    display: inline-block;
    vertical-align: middle
}

.ui-group-buttons:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden
}

.ui-group-buttons .btn {
    float: left;
    border-radius: 0
}

.ui-group-buttons .btn:first-child {
    margin-left: 0;
    border-top-left-radius: .25em;
    border-bottom-left-radius: .25em;
    padding-right: 15px
}

.ui-group-buttons .btn:last-child {
    border-top-right-radius: .25em;
    border-bottom-right-radius: .25em;
    padding-left: 15px
}

.mtm25 {
    margin-top: -25px !important;
}

@media (max-width: 767px) {
    .ui-group-buttons {
        width: 100% !important;
    }

    .ui-group-buttons .btn:first-child {
        width: 48% !important;
    }

    .ui-group-buttons .btn:last-child {
        width: 48% !important;
    }

    .mtm25 {
        margin-top: -15px !important;
    }

    .mbm5-xs {
        margin-bottom: -5px !important;
    }

    .mtm30wa-xs {
        margin-top: -30px !important;
    }

    .mtm15wa-xs {
        margin-top: -15px !important;
    }

    .icon-container {
        position: absolute;
        top: 5px;
        right: 10px;
        font-size: 8px;
        width: 40%;
        display: flex;
        z-index: 2;
    }

    .icon-container-premium {
        position: absolute;
        top: 5px;
        left: 10px;
        font-size: 8px;
        width: 40%;
        display: flex;
        z-index: 2;
    }

    .icon-container-demo {
        position: absolute;
        top: 5px;
        left: 10px;
        font-size: 8px;
        width: 40%;
        display: flex;
        z-index: 2;
    }
}

@media (min-width: 768px) {
    .icon-container {
        position: absolute;
        top: 5px;
        right: 20px;
        display: flex;
        z-index: 2;
    }

    .icon-container-premium {
        position: absolute;
        top: 5px;
        left: 20px;
        display: flex;
        z-index: 2;
    }

    .icon-container-demo {
        position: absolute;
        top: 5px;
        left: 20px;
        display: flex;
        z-index: 2;
    }
}

@media (min-width: 376px) {
    .show-more {
        max-height: 200px;
        overflow: hidden;
        position: relative;
        transition: max-height 1s;
        margin-bottom: 20px;
    }
}


@media (max-width: 375px) {
    .show-more {
        max-height: 300px;
        overflow: hidden;
        position: relative;
        transition: max-height 1s;
        margin-bottom: 20px;
    }
}


.pt5mbm5 {
    margin-bottom: -5px !important;
    padding-top: 5px !important;
}

.btn-secondary {
    color: #fff;
    background-color: #6c757d;
    border-color: #6c757d
}

.btn-secondary:hover {
    color: #fff;
    background-color: #5c636a;
    border-color: #565e64
}


.content-box.box-arr {
    background-color: #ffffff;
    border: solid 1px #8f2a2e;
}

.panel-default-dark {
    border-color: #8d8d8d !important;
    border-radius: 5px;
}



.panel-default-dark .panel-heading {
    background-color: #dedede !important;
    color: #333;
    border-color: #8d8d8d;
    border-radius: 5px;
}

body.dark .panel-default-dark .panel-heading {
    background-color: #5e5e5e !important;
    color: #bfbfbf;
    border-color: #8d8d8d;
    border-radius: 5px;
}

body.dark .panel-plus-link a {
    color: #3c3c3c !important;
}

body.dark .panel-plus-link a:hover {
    color: #636363 !important;
}

.mb0 {
    margin-bottom: 0px !important;
}

.br-5 {
    border-radius: 5px !important;
}

.mh45 {
    min-height: 45px !important;
}

.text-black {
    color: #333 !important;
}

.pb6 {
    padding-bottom: 6px !important;
}

.mh80 {
    max-height: 80px !important;
}

.account-container {
    background-color: #f8f9fa;
    border: 1px solid #ddd;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    margin-bottom: 20px;
}

.account-premium,
.account-standard {
    font-size: 20px;
    font-weight: bold;
    /* margin-bottom: 15px; */
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.account-premium i,
.account-standard i {
    margin-right: 8px;
    font-size: 24px;
}

.account-premium {
    color: #ffc107;
}

.account-standard {
    color: #6c757d;
}

.buy_premium_btn {
    font-size: 16px;
    padding: 10px 20px;
}

.buy_premium_btn:hover {
    /* background-color: #ff9900; */
}

/* Stil pentru secțiunea de avantaje premium */
.premium-benefits {
    list-style: none;
    padding-left: 0;
    text-align: left;
    display: inline-block;
}

.premium-benefits li {
    font-size: 18px;
    margin-bottom: 10px;
    color: #4caf50;
}

.premium-benefits li i {
    margin-right: 10px;
    color: #ffcc00;
}

/* Stil pentru box-urile planurilor premium */
/* Stil pentru box-urile planurilor premium */
.content-box-small {
    background-color: #fff;
    border: 1px solid #ddd;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    margin-bottom: 20px;
    transition: box-shadow 0.3s ease;
    position: relative;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.content-box-small:hover {
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

.plan-header {
    padding: 20px;
    color: white;
    border-radius: 8px 8px 0 0;
}

.bg-purple {
    background: linear-gradient(135deg, #6a11cb, #2575fc);
}

.bg-green {
    background: linear-gradient(135deg, #28a745, #218838);
}

.bg-orange {
    background: linear-gradient(135deg, #ff5722, #e64a19);
}

.plan-title {
    font-size: 18px;
    font-weight: bold;
    margin: 0;
    color: #fccc2a
}

.plan-price {
    font-size: 24px;
    font-weight: bold;
}

.plan-features {
    list-style: none;
    padding: 0;
    text-align: left;
    margin: 20px 0;
}

.plan-features li {
    font-size: 14px;
    margin-bottom: 10px;
}

.plan-box .select-plan-btn {
    margin-top: 15px;
    background-color: #ffcc00;
    border: none;
    color: #fff;
    padding: 10px 20px;
    font-weight: bold;
    border-radius: 4px;
}

.plan-box .select-plan-btn:hover {
    background-color: #ff9900;
}

.most-popular {
    position: absolute;
    top: 0px;
    right: 10px;
    background-color: #e12633;
    color: #fff;
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 20px;
    font-weight: bold;
}

.text-orange {
    color: #f0ad4e;
}

.middle-modal {
    width: 60% !important;
    margin: 30px auto;
}

@media only screen and (max-width: 768px) {


    .middle-modal {
        width: 100% !important;
    }
}

.h500 {
    height: 500px;
}



.plan-features li i {
    margin-right: 10px;
    color: #ffcc00;
}



.btn3d {
    position: relative;
    top: -3px;
    border: 0;
    transition: all 40ms linear;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 2px;
    margin-right: 2px;
    font-size: 14px;
}


.btn3d:focus {
    outline: medium none;
    -moz-outline-style: none;
}

.btn3d:active {
    top: 2px;
}

.btn-primary {
    box-shadow: 0 0 0 1px #428bca inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #357ebd, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #428bca;
}

.btn-default {
    box-shadow: 0 0 0 1px #ebebeb inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #adadad, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #fff;
}

.btn-success {
    box-shadow: 0 0 0 1px #5cb85c inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #4cae4c, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #5cb85c;
}

.btn-info {
    box-shadow: 0 0 0 1px #5bc0de inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #46b8da, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #5bc0de;
}

.btn-warning {
    box-shadow: 0 0 0 1px #f0ad4e inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #eea236, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #f0ad4e;
}

.btn-danger {
    box-shadow: 0 0 0 1px #c63702 inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #C24032, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #c63702;
}



.btn-black {
    box-shadow: 0 0 0 1px #090909 inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #000, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #141414;
    color: #ffffff;
}

.btn-black:hover {
    background-color: #000000;
    color: #ffffff;
}


.btn-purple {
    box-shadow: 0 0 0 1px #7d0bad inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #59067c, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #7d0bad;
    color: #ffffff;
}

.btn-purple:hover {
    background-color: #59067c;
    color: #ffffff;
}

.top-nav .dropdown .btn-info,
.top-nav .dropdown .btn-danger,
.top-nav .dropdown .btn-info i,
.top-nav .dropdown .btn-danger i {
    color: #fff;
}

.top-nav .dropdown .btn-info {
    box-shadow: 0 0 0 1px #5bc0de inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #46b8da, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #5bc0de;
}

.top-nav .dropdown .btn-info:hover {
    background-color: #31b0d5;
}

.top-nav .dropdown .btn-danger {
    box-shadow: 0 0 0 1px #c63702 inset, 0 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 4px 0 0 #C24032, 0 4px 0 1px rgba(0, 0, 0, 0.4), 0 4px 4px 1px rgba(0, 0, 0, 0.5);
    background-color: #c63702;
}

.top-nav .dropdown .btn-danger:hover {
    background-color: #9e1b16;
}


.custom-tabs-container {
    display: flex;
    justify-content: center;
    padding: 0;
    border-radius: 10px 10px 0px 0px;
}

.custom-tabs-container .custom-tab {
    flex: 1;
    text-align: center;
    padding: 5px 0px 0px;
    font-weight: bold;
    color: #000000;
    cursor: pointer;
    background: #bed0c6;
    border-bottom: 3px solid transparent;
    transition: all 0.3s ease;
    border-radius: 10px 10px 0px 0px;
}

.custom-tabs-container .custom-tab-success.active {
    background: #27c76e;
}

.tab-success {
    border-top: 3px solid #27c76e;
    border-bottom: 3px solid #27c76e;
    border-left: 3px solid #27c76e;
    border-right: 3px solid #27c76e;
}

.custom-tabs-container .custom-tab-warning.active {
    background: #f0ad4e;
}

.tab-warning {
    border-top: 3px solid #f0ad4e;
    border-bottom: 3px solid #f0ad4e;
    border-left: 3px solid #f0ad4e;
    border-right: 3px solid #f0ad4e;
}

.custom-tabs-container .custom-tab.active::after {
    content: "";
    position: relative;
    display: block;
    margin: 0 auto;
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-right: 15px solid transparent;
    border-top: 15px solid #000000;
}

.custom-tab-content {
    display: none;
    background: #fdfdfd;
    padding: 5px;

}



.custom-tab-content.active {
    display: block;
}


.mh-600 {
    max-height: 600px;
}