:root {
    font-size: 10px;
    --gmg: #469DB3;
    --light-blue: #f1fbfd;
    --light-gmg: #eef8fa;
    --yellow-gmg: #F7A302;
    --light-yellow: #FDF6E7;
    --violet-gmg: #6B3176;
    --light-violet: #efeaf1;
    --black-gmg: #111D4E;
    --light-black: #e4e7ec;
    --green-gmg: #39AB8D;
    --light-green: #edf8f4;
    --orange-gmg: #E35204;
    --light-orange: #fbece5;
    --black-text-gmg: #828282;
    --regular: 400;
    --medium: 500;
    --semibold: 600;
    --bold: 700;
    --black: 800;
    --size-body: 1.8rem;
    --size-body-s: 1.6rem;
    --size-heading: 3rem;
    --size-heading-s: 2.8rem;
    --size-subheading: 2.4rem;
    --size-subheading-s: 2.2rem;
    --size-textvideo: 2.2rem;
    --size-textvideo-s: 2rem;
    --size-extras: 1.4rem;
    --size-extras-s: 1.2rem;
    --size-spacing: 3.5rem;
    --size-spacing-s: 2.5rem;
    --line-height: 1.4;
    --line-height-header: 1;
}

.light-blue {
    background-color: var(--light-blue);
}

.light-gmg {
    background-color: var(--light-gmg);
}

.light-violet {
    background-color: var(--light-violet);
}

.light-yellow {
    background-color: var(--light-yellow);
}

.light-black {
    background-color: var(--light-black);
}

.light-green {
    background-color: var(--light-green);
}

.light-orange {
    background-color: var(--light-orange);
}

.miastenia-gravis-gmg .text-gmg {
    color: var(--gmg);
}

.miastenia-gravis-gmg .text-yellow-gmg {
    color: var(--yellow-gmg);
}

.miastenia-gravis-gmg .text-violet-gmg {
    color: var(--violet-gmg);
}

.miastenia-gravis-gmg .text-black-gmg {
    color: var(--black-gmg);
}

.miastenia-gravis-gmg .text-green-gmg {
    color: var(--green-gmg);
}

.miastenia-gravis-gmg .text-orange-gmg {
    color: var(--orange-gmg);
}


.miastenia-gravis-gmg .text-left {
    text-align: left;
}

.miastenia-gravis-gmg .icon-content-container {
    margin-block: var(--size-spacing)
}

.miastenia-gravis-gmg .icon-content-item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    padding: 2rem;
    min-height: 330px;


    p {
        font-size: var(--size-extras);
        margin-top: var(--size-spacing);
    }

    &.icon-content-item-inci {
        min-height: 455px;
        p {
            margin-top: 0;
        }
    }
    figure {
        margin: 0;

        img {
            max-width: 15rem;
        }
    }
}

.miastenia-gravis-gmg .border-group {
    border: 1px solid var(--gmg);
    border-radius: 1rem;
    padding: 1rem 10rem;
    text-align: center;
    position: relative;
    justify-self: left;
    margin: 2rem 0;
  }

.miastenia-gravis-gmg .border-group::before {
  content: "";
  width: 10px;
  height: 10px;
  position: absolute;
  z-index: 3;
  background-color: var(--gmg);
  top: 50%;
  top: 50%;
  transform: translateY(-50%);
  display: block;
  left: -5px;
  border-radius: 50%;
}

.miastenia-gravis-gmg .accordion-ref h4 a {
    color: var(--gmg) !important;
}

.miastenia-gravis-gmg {
    padding: 0;

    @media (min-width: 768px) and (max-width: 1000px) {
        margin-left: 20px;
        padding-left: 40px;
    }
    @media (min-width: 768px) and (max-width: 1000px)  {
        margin-left: 20px;
    }
}

.miastenia-gravis-gmg .sect-1,
.miastenia-gravis-gmg .sect-5 {
    padding: 0;
}

.miastenia-gravis-gmg .sect-5 {
    margin-top: 2rem;
}

.miastenia-gravis-gmg small {
    color: var(--black-text-gmg);
}

.miastenia-gravis-gmg .sect-1 h2 {
    color: var(--gmg);
}

.miastenia-gravis-gmg .sect-1 h2 {
    color: var(--gmg);
}

.miastenia-gravis-gmg .sect-1 p {
    font-weight: var(--semibold);
}

.miastenia-gravis-gmg .img-1,
.miastenia-gravis-gmg #sect-3 .img-2 {
    max-width: 100%;
    height: auto;
    width: 90rem;
    margin: 2rem 0;
}

.miastenia-gravis-gmg .accordion-ref .panel-title .collapsed .fa::after {
    content: '';
    position: relative;
    top: 0;
    width: 20px;
    height: 20px;
    transition: transform 0.3s ease, top 0.3s ease;
    transform: rotate(180deg);
    display: inline-block;
    left: 0;
    background: url("/content/dam/multibrand/ar/es/epof/miastenia-gravis/img/miastenia-arrow.png") no-repeat center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.miastenia-gravis-gmg .accordion-ref .panel-title .fa::after {
    content: '';
    position: relative;
    top: 0;
    width: 20px;
    height: 20px;
    transition: transform 0.3s ease, top 0.3s ease;
    transform: rotate(0deg);
    display: inline-block;
    left: 0;
    background: url("/content/dam/multibrand/ar/es/epof/miastenia-gravis/img/miastenia-arrow.png") no-repeat center;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.miastenia-gravis-gmg p {
    font-size: 2rem;
    color: var(--black-text-gmg);
}

.miastenia-gravis-gmg .bg-at {
    padding: 5rem;
    background-color: var(--light-gmg);
    margin-block: var(--size-spacing);
}

.miastenia-gravis-gmg .bg-at h3,
.miastenia-gravis-gmg h3 {
    color: var(--gmg);
    line-height: var(--line-height);
    font-size: var(--size-heading) !important;
}

.miastenia-gravis-gmg .bg-at h5 {
    color: var(--gmg);
    text-align: center;
    line-height: var(--line-height)
}

.miastenia-gravis-gmg #sect-3 .stat-col-container .stat-col-img {
    width: 100%;
    margin: 2rem auto;
    max-width: 23rem;
}

.miastenia-gravis-gmg .stat-col-container > .row {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}

.miastenia-gravis-gmg .stat-text {
    font-size: 5rem;
    font-weight: var(--black);
    line-height: var(--line-height);
    color: var(--black-gmg);
}

.miastenia-gravis-gmg .medicamento-section-container {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-block: var(--size-spacing);
    gap: 1rem 5rem;
}

.miastenia-gravis-gmg .medicamento-section-container .medicamento-section-item {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    padding: 1rem;
    p {
        font-size: var(--size-subheading);
        margin-top: var(--size-spacing);
        color: var(--gmg);
    }
    figure {
        margin: 0;

        img {
            max-width: 20rem;
        }
    }
}

.miastenia-gravis-gmg .icon-content-sint-container {

    .icon-content-sint-item {
        background-color: transparent;
        min-height: 345px;
        &.light-blue {
            border: 5px solid var(--black-gmg);
        }

        &.light-yellow {
            border: 5px solid var(--yellow-gmg);

            @media screen and (max-width: 767px) {
                margin-top: var(--size-spacing);
            }
        }
    }
}