@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono&family=IBM+Plex+Sans:wght@400;600;700&display=swap');

body, html {
    font-family: 'IBM Plex Sans', sans-serif;
    font-size: 18px; 
}

.sticky {
  background-color: transparent;
}


a {
    color: rgb(21, 21, 21);
    border-bottom: 1px solid rgba(21, 21, 21, 0.25);
}

a:hover {
    color: rgb(44, 199, 95);
    border-bottom: 1px solid rgba(44, 199, 95, 0.25);
    background: rgba(255, 255, 255, 0);
}

.module_navigation_link, .module_navigation_link:hover {
    border:0px;   
}

.module_progress {
    width: 100%;
    background-color:#f2f2f2;
    border-radius:8px;
    padding:10px;
    padding-left:15px;
    padding-right:15px;
    margin-bottom:20px;
}

div.disagree a {
    text-decoration: none;
    color: var(--secondary-color);
}
.disagree_textarea {
    height:140px;
}

.btn {
    padding: 1em 2em;
    font-weight: bold;
}
.btn_payment_return {
    padding: 0.7em 2em;
    font-weight: normal;
}

.btn-login {
    background-color:#26D15F;
    border-color:#26D15F;
    color:var(--font-color);
}

.btn-login:hover {
    background-color: #2C9C51;
    border-color:#2C9C51;
    color: var(--white);
}


.hljs {
    background: var(--background-color);
}

.btn.btn-ghost {
    border: 1px solid rgba(21, 21, 21, 0.25);
    border-radius: 10px;
    /* border: 1px solid rgba(21, 21, 21, 0.075);
    background: white;
    box-shadow: 0px 5px 15px rgba(21, 21, 21, 0.15); */
}

.btn.btn-ghost:hover {
    border: 1px solid rgba(21, 21, 21, 0.25);
    color: rgb(21, 21, 21);
    background-color: rgba(21, 21, 21, 0.05);
    /* border: 1px solid rgba(44, 199, 95, 0.15);
    color: rgba(44, 199, 95, 1);
    box-shadow: 0px 5px 15px rgba(44, 199, 95, 0.33); */
}

.task_context img {
    box-shadow: 0px 6px 18px rgba(21, 21, 21, 0.15);
}

.btn-success {
    background-color: #2CC75F;
}

.btn-email-form {
    padding: 0.87em;
    margin-top:8px;
    width: 30%;
}

label {
    opacity: 1 !important;
}

.logo__do {
    color: #2CC75F;
}

div.logo a {
    color: var(--font-color);
    text-decoration: none;
    border:0px;
}

div.logo a:hover{
    color: var(--font-color);
    background-color: none;
    text-decoration: none;
    border:0px;
}

div.teachers_comment_incorrect {
    color: #FF3037;
}

div.incorrect-answer {
    border-left: 5px solid #FF3037;
}

div.correct-answer {
    border-left: 5px solid #2CC75F;
}

div.no-show-correct-answer {
    border-left: 5px solid #BFBFBF;
}

.active-lang {
    background-color: #2CC75F;
}

.correct_color {
    color: #2CC75F;
}

.incorrect_color {
    color: #FF3037;  
}

div.disagree a:hover {
    color: #2CC75F;
}

span.persona_title {
    color: #aaa;
}

.correct_answer_label, .green_label {
    border-color: #2CC75F;
    background-color:#2CC75F;
}

.wrong_answer_label, .red_label {
    border-color: #FF3037;
    background-color:#FF3037;
}

button.correct_answer {
    background-color:#2CC75F;
}

button.wrong_answer {
    background-color:#FF3037;
}

.code {
    font-weight: bold;
    color: inherit;
}

code {
    color: inherit;
}

.codeblock {
    background-color: rgba(21, 21, 21, 0.05);
    color: rgb(21, 21, 21);
    font-family: 'IBM Plex Mono', monospace;
    box-shadow: inset 0px 4px 8px rgba(21, 21, 21, 0.05);
    border: 0px;
}

.module_block {
    background-color: #DDDDDD;
}


a.certificate_button {
    color: var(--success);
    font-size: 0.8rem;
    margin-bottom: 10px;
}

a.certificate_button:hover {
    color: white;
    background-color: var(--success);
}

input.payment_input {
    border-color: #343434;
    margin-top:6px;
}


.payment_btn {
    background-color: var(--background-color);
    font-size: 0.8rem;
}

.btn.show_response_button {
    background-color: #EDEDED;
}

.btn.disabled, .btn:disabled {
    opacity: .85;
}

@media only screen and (max-width : 768px) {
    .module_progress {
        display: none;
    }

    .btn-email-form {
        width: 80%;
  }
  .payment_btn_coupon {
    font-size: 0.7rem;
  }
  .btn-next {
    max-width: 100%;
    min-width: 50%;
    margin-top: 10px;
    white-space: normal;
    font-size: 18px;
  }
}


pre code {
   word-break: break-word;
}