/*Effects Page Banner*/
.effects_section_container {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    max-width: 1300px;
    padding-right: 16px;
    padding-left: 16px;
    margin-right: auto;
    margin-left: auto;
}

.artsEffects_container_images {
    -moz-box-flex: 1;
    flex: 1 1 50%;
    max-width: 55rem;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    display: -moz-box;
    display: flex;
    position: relative;
}

.artsEffects_imageCarouseBox {
    border-radius: 12px;
    overflow: hidden;
    height: -webkit-min-content;
    height: -moz-min-content;
    height: min-content;
    margin-left: 32px;
    position: absolute;
    width: 640px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-box-shadow: 0 20px 20px rgba(0, 0, 0, .1);
    box-shadow: 0 20px 20px rgba(0, 0, 0, .1);
}

.responsive_effects_image {
    position: absolute;
    bottom: 15px;
    left: 0;
    z-index: 1;
    width: 100%;
    height: unset;
    pointer-events: none;
    border-radius: 8px;
}

/*How to Apply ArtsFlick Photo Effects*/
.effects_section_intro {
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
    margin-top: 30px;
}

.effects_section_intro_reverse {
    -moz-box-orient: horizontal;
    -moz-box-direction: reverse;
    flex-direction: row-reverse;
}

.effects_section_intro_container {
    display: -moz-box;
    display: flex;
    -moz-box-align: center;
    align-items: center;
    -moz-box-pack: justify;
    justify-content: space-between;
}

.effects_section_intro__image {
    -moz-box-flex: 1;
    flex: 1 1 50%;
    margin-right: 64px;
    border-radius: .5rem;
    overflow: hidden;
}

.effects_section_intro__image img {
    display: block;
    width: 100%;
    height: auto !important;
}

.effects_section_intro_container.effects_section_intro_reverse .effects_section_intro__image {
    margin-right: 0;
    margin-left: 64px;
}

.effectsImage_image {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: unset;
    pointer-events: none;
}

.artsIntroSection_addImageBg {
    background-color: #f4f5f6;
}

.effects_section_intro__body {
    -moz-box-flex: 1;
    flex: 1 1 50%;
    max-width: 495px;
}

.effects_section_intro__body h2 {
    font-size: 2rem;
    line-height: 3rem;
    font-weight: 500;
    margin: 0;
    font-family: Poppins, helvetica, PingFang SC, Arial;
}

.effects_font_black {
    color: #fff !important;
}

.effects_section_intro_content {
    margin-top: 1.5rem;
}

.effects_section_intro_content>p {
    margin-top: .5rem;
    font-size: 1rem;
}

.effects_section_intro_content p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.8rem;
    letter-spacing: .3px;
}

.text_section_intro {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

.text_section_intro_body {
    max-width: 56.25rem;
    margin: .5rem auto auto;
}

.text_section_intro_body h3 {
    margin-top: 2rem;
    margin-bottom: 1rem;
    font-size: 1rem;
    line-height: 1.5rem;
    color: #fff;
    letter-spacing: .3px;
}

.text_section_intro_body p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.8rem;
    letter-spacing: .3px;
    color: #fff;
}

.artsGroup_artsGroup {
    width: 100%;
    max-width: 56.25rem;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
}

.artsGroup_artsGroup h2 {
    color: #fff;
    font-size: 2rem;
    line-height: 3rem;
    font-weight: 500;
    font-family: Poppins, helvetica, PingFang SC, Arial;
}

/*FAQ For Effects*/
.effect_info_FAQ {
    padding: 0;
    margin: 2rem auto auto;
    border-radius: 4px;
    overflow: hidden;
}

.effect_info_FAQ_entry {
    border-bottom: 1px solid rgba(223 211 211 / 46%);
}

.effect_info_FAQ_entry_question {
    -moz-box-pack: justify;
    justify-content: space-between;
    width: 100%;
    min-height: 4rem;
    padding: 20px 0;
}

.effect_info_FAQ_entry_question,
.effect_info_FAQ_entry_question .effect_info_FAQ_row {
    display: -moz-box;
    display: flex;
    -moz-box-align: center;
    align-items: center;
}

.effect_info_FAQ_entry_title {
    margin-right: .5rem;
    font-weight: 600;
    line-height: 16px;
    color: #fff;
    text-align: left;
    font-size: 1rem;
}

.effect_info_FAQ_entry_question .effect_info_FAQ_arrow {
    width: 10px;
    fill: #fff;
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='29' fill='none' viewBox='0 0 28 29'%3E%3Cpath fill='%23fff' d='M6.84 21.83c-.47-.6-1.05-1.82-2.07-3.34-.58-.83-2.01-2.41-2.45-3.23a2.1 2.1 0 0 1-.25-1.67 2.2 2.2 0 0 1 2.39-1.67c.85.18 1.63.6 2.25 1.2.43.41.82.85 1.18 1.32.27.34.33.47.63.85.3.39.5.77.35.2-.11-.83-.31-2.23-.6-3.48-.21-.95-.26-1.1-.46-1.82s-.32-1.32-.54-2.13c-.2-.8-.35-1.62-.46-2.44a4.7 4.7 0 0 1 .43-3.08c.58-.55 1.44-.7 2.17-.37a4.4 4.4 0 0 1 1.57 2.17c.43 1.07.72 2.19.86 3.33.27 1.67.79 4.1.8 4.6 0-.61-.11-1.91 0-2.5.12-.6.54-1.1 1.12-1.33.5-.15 1.02-.19 1.53-.1.52.1.98.4 1.29.83.38.98.6 2 .63 3.05.04-.91.2-1.82.47-2.7.28-.39.68-.67 1.15-.8.55-.1 1.11-.1 1.66 0 .46.15.85.44 1.14.82.35.88.56 1.82.63 2.77 0 .23.12-.65.48-1.24a1.67 1.67 0 1 1 3.17 1.07v3.77c-.06.97-.2 1.94-.4 2.9-.29.85-.7 1.65-1.2 2.38-.8.9-1.48 1.92-1.98 3.02a6.67 6.67 0 0 0 .03 3.2c-.68.07-1.37.07-2.05 0-.65-.1-1.45-1.4-1.67-1.8a.63.63 0 0 0-1.13 0c-.37.64-1.18 1.79-1.75 1.85-1.12.14-3.42 0-5.23 0 0 0 .3-1.66-.39-2.27-.68-.6-1.38-1.3-1.9-1.76l-1.4-1.6Z'/%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.25' d='M6.84 21.83c-.47-.6-1.05-1.82-2.07-3.34-.58-.83-2.01-2.41-2.45-3.23a2.1 2.1 0 0 1-.25-1.67 2.2 2.2 0 0 1 2.39-1.67c.85.18 1.63.6 2.25 1.2.43.41.82.85 1.18 1.32.27.34.33.47.63.85.3.39.5.77.35.2-.11-.83-.31-2.23-.6-3.48-.21-.95-.26-1.1-.46-1.82s-.32-1.32-.54-2.13c-.2-.8-.35-1.62-.46-2.44a4.7 4.7 0 0 1 .43-3.08c.58-.55 1.44-.7 2.17-.37a4.4 4.4 0 0 1 1.57 2.17c.43 1.07.72 2.19.86 3.33.27 1.67.79 4.1.8 4.6 0-.61-.11-1.91 0-2.5.12-.6.54-1.1 1.12-1.33.5-.15 1.02-.19 1.53-.1.52.1.98.4 1.29.83.38.98.6 2 .63 3.05.04-.91.2-1.82.47-2.7.28-.39.68-.67 1.15-.8.55-.1 1.11-.1 1.66 0 .46.15.85.44 1.14.82.35.88.56 1.82.63 2.77 0 .23.12-.65.48-1.24a1.67 1.67 0 1 1 3.17 1.07v3.77c-.06.97-.2 1.94-.4 2.9-.29.85-.7 1.65-1.2 2.38-.8.9-1.48 1.92-1.98 3.02a6.67 6.67 0 0 0 .03 3.2c-.68.07-1.37.07-2.05 0-.65-.1-1.45-1.4-1.67-1.8a.63.63 0 0 0-1.13 0c-.37.64-1.18 1.79-1.75 1.85-1.12.14-3.42 0-5.23 0 0 0 .3-1.66-.39-2.27-.68-.6-1.38-1.3-1.9-1.76l-1.4-1.6Z' clip-rule='evenodd'/%3E%3Cpath fill='%23000' d='M20.65 22.3v-6.24c0-.38-.31-.68-.7-.68-.37 0-.68.3-.68.68v6.23c0 .38.3.68.69.68.38 0 .69-.3.69-.68ZM17.2 22.3l-.04-6.25a.67.67 0 1 0-1.34.01l.04 6.24a.67.67 0 1 0 1.34 0ZM12.37 16.07l.04 6.22c0 .38.3.68.67.68.37 0 .67-.3.67-.68l-.04-6.23c0-.38-.3-.68-.67-.68-.37 0-.67.31-.67.69Z'/%3E%3C/svg%3E"), auto;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    transform: rotate(90deg);
}

.effect_info_FAQ_entry_question .effect_info_FAQ_arrow_active {
    fill: #d09eff;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    transform: rotate(270deg);
}

.effect_info_FAQ_entry_answer {
    padding: .5rem 2rem 2rem;
    font-size: .875rem;
    line-height: 1.5rem;
    letter-spacing: .25px;
}

.effect_info_FAQ_entry_answer p {
    color: #fff;
    font-size: .875rem;
    line-height: 1.5rem;
}

/*The Best Photo Effect Tools*/
.artsIntroduceSection_section {
    padding: 48px 0;
}

.artsIntroduceSection_section h2 {
    font-size: 36px;
    font-weight: 600;
    line-height: 52px;
    text-align: center;
    letter-spacing: .39px;
    color: #fff;
    margin-bottom: 36px;
    font-family: Poppins, helvetica, PingFang SC, Arial;
}

.artsIntroduceSection_section .artsIntroduceSection_block p {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    letter-spacing: .3px;
    color: inherit;
    font-family: Poppins, helvetica, PingFang SC, Arial;
}

.section_effects_container_row {
    display: -moz-box;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin-right: -16px;
    margin-left: -16px;
}

.section_effects_container_row.artsTool_Container_column3>.container-grid {
    -moz-box-flex: 1;
    flex: 1 1 33.3333333333%;
    max-width: 33.3333333333%;
}

.start-editing-btn-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 35px;
}

#start-editing-btn {
    width: 100%;
    max-width: 250px;
    padding: .75rem 0;
    border-radius: 6px;
    background-color: hsl(from #d09eff h 100% 75%);
    color: hsl(from #d09eff h 100% 10%);
    outline: none;
    box-shadow: none;
    border: none;
    font-weight: 600;
    font-family: Arial, sans-serif;
    font-size: 16px;
    transition: background-image 0.3s, color 0.3s;
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='29' fill='none' viewBox='0 0 28 29'%3E%3Cpath fill='%23fff' d='M6.84 21.83c-.47-.6-1.05-1.82-2.07-3.34-.58-.83-2.01-2.41-2.45-3.23a2.1 2.1 0 0 1-.25-1.67 2.2 2.2 0 0 1 2.39-1.67c.85.18 1.63.6 2.25 1.2.43.41.82.85 1.18 1.32.27.34.33.47.63.85.3.39.5.77.35.2-.11-.83-.31-2.23-.6-3.48-.21-.95-.26-1.1-.46-1.82s-.32-1.32-.54-2.13c-.2-.8-.35-1.62-.46-2.44a4.7 4.7 0 0 1 .43-3.08c.58-.55 1.44-.7 2.17-.37a4.4 4.4 0 0 1 1.57 2.17c.43 1.07.72 2.19.86 3.33.27 1.67.79 4.1.8 4.6 0-.61-.11-1.91 0-2.5.12-.6.54-1.1 1.12-1.33.5-.15 1.02-.19 1.53-.1.52.1.98.4 1.29.83.38.98.6 2 .63 3.05.04-.91.2-1.82.47-2.7.28-.39.68-.67 1.15-.8.55-.1 1.11-.1 1.66 0 .46.15.85.44 1.14.82.35.88.56 1.82.63 2.77 0 .23.12-.65.48-1.24a1.67 1.67 0 1 1 3.17 1.07v3.77c-.06.97-.2 1.94-.4 2.9-.29.85-.7 1.65-1.2 2.38-.8.9-1.48 1.92-1.98 3.02a6.67 6.67 0 0 0 .03 3.2c-.68.07-1.37.07-2.05 0-.65-.1-1.45-1.4-1.67-1.8a.63.63 0 0 0-1.13 0c-.37.64-1.18 1.79-1.75 1.85-1.12.14-3.42 0-5.23 0 0 0 .3-1.66-.39-2.27-.68-.6-1.38-1.3-1.9-1.76l-1.4-1.6Z'/%3E%3Cpath stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='2.25' d='M6.84 21.83c-.47-.6-1.05-1.82-2.07-3.34-.58-.83-2.01-2.41-2.45-3.23a2.1 2.1 0 0 1-.25-1.67 2.2 2.2 0 0 1 2.39-1.67c.85.18 1.63.6 2.25 1.2.43.41.82.85 1.18 1.32.27.34.33.47.63.85.3.39.5.77.35.2-.11-.83-.31-2.23-.6-3.48-.21-.95-.26-1.1-.46-1.82s-.32-1.32-.54-2.13c-.2-.8-.35-1.62-.46-2.44a4.7 4.7 0 0 1 .43-3.08c.58-.55 1.44-.7 2.17-.37a4.4 4.4 0 0 1 1.57 2.17c.43 1.07.72 2.19.86 3.33.27 1.67.79 4.1.8 4.6 0-.61-.11-1.91 0-2.5.12-.6.54-1.1 1.12-1.33.5-.15 1.02-.19 1.53-.1.52.1.98.4 1.29.83.38.98.6 2 .63 3.05.04-.91.2-1.82.47-2.7.28-.39.68-.67 1.15-.8.55-.1 1.11-.1 1.66 0 .46.15.85.44 1.14.82.35.88.56 1.82.63 2.77 0 .23.12-.65.48-1.24a1.67 1.67 0 1 1 3.17 1.07v3.77c-.06.97-.2 1.94-.4 2.9-.29.85-.7 1.65-1.2 2.38-.8.9-1.48 1.92-1.98 3.02a6.67 6.67 0 0 0 .03 3.2c-.68.07-1.37.07-2.05 0-.65-.1-1.45-1.4-1.67-1.8a.63.63 0 0 0-1.13 0c-.37.64-1.18 1.79-1.75 1.85-1.12.14-3.42 0-5.23 0 0 0 .3-1.66-.39-2.27-.68-.6-1.38-1.3-1.9-1.76l-1.4-1.6Z' clip-rule='evenodd'/%3E%3Cpath fill='%23000' d='M20.65 22.3v-6.24c0-.38-.31-.68-.7-.68-.37 0-.68.3-.68.68v6.23c0 .38.3.68.69.68.38 0 .69-.3.69-.68ZM17.2 22.3l-.04-6.25a.67.67 0 1 0-1.34.01l.04 6.24a.67.67 0 1 0 1.34 0ZM12.37 16.07l.04 6.22c0 .38.3.68.67.68.37 0 .67-.3.67-.68l-.04-6.23c0-.38-.3-.68-.67-.68-.37 0-.67.31-.67.69Z'/%3E%3C/svg%3E"), auto;
}

#start-editing-btn:hover {
    background-image: linear-gradient(90deg, #4A00E0, #8E2DE2);
    color: #d1bee2;
}

#start-editing-btn:focus,
#start-editing-btn:active {
    box-shadow: none;
    outline: none;
    transform: none;
    text-align: center;
}

/* LEFT - Animation for fading in the emoji from the left */
.effects_animatefadeinLeft {
    -webkit-animation-duration: .8s;
    -moz-animation-duration: .8s;
    animation-duration: .8s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: .3s;
    -moz-animation-delay: .3s;
    animation-delay: .3s;
    -webkit-animation-name: effects_animatefadeinLeft_animation;
    -moz-animation-name: effects_animatefadeinLeft_animation;
    animation-name: effects_animatefadeinLeft_animation;
}

@keyframes effects_animatefadeinLeft_animation {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-18%, 0, 0);
        -moz-transform: translate3d(-18%, 0, 0);
        transform: translate3d(-18%, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        transform: none;
    }
}


/* RIGHT - Animation for fading in the emoji from the right */
.effects_animatefadeinRight {
    -webkit-animation-duration: .5s;
    -moz-animation-duration: .5s;
    animation-duration: .5s;
    -webkit-animation-fill-mode: both;
    -moz-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-delay: .1s;
    -moz-animation-delay: .1s;
    animation-delay: .1s;
    -webkit-animation-name: effects_animatefadeinRight_animation;
    -moz-animation-name: effects_animatefadeinRight_animation;
    animation-name: effects_animatefadeinRight_animation;
}

@keyframes effects_animatefadeinRight_animation {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(18%, 0, 0);
        -moz-transform: translate3d(18%, 0, 0);
        transform: translate3d(18%, 0, 0);
    }

    100% {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        transform: none;
    }
}

@media only screen and (max-width: 964px) {
    .artsEffects_imageCarouseBox {
        margin-left: 0;
        position: inherit;
        width: auto;
        -webkit-transform: translateY(0);
        -moz-transform: translateY(0);
        transform: translateY(0);
    }

    .artsEffects_container_images {
        max-width: none;
        width: 100%;
        margin-bottom: 24px;
    }

    .effects_section_intro_container {
        display: block;
    }

    .effects_section_intro__image {
        max-width: 100%;
        margin: 0 !important;
    }

    .effects_section_intro__body {
        max-width: 100%;
        margin-top: 20px;
    }

    .effects_section_intro_container.effects_section_intro_reverse .effects_section_intro__image {
        margin-right: 0;
        margin-left: 0;
    }

    .artsGroup_artsGroup h2 {
        line-height: 2rem;
        font-size: 1.5rem;
    }
}