img {
    width: auto;
}

.character {
    margin-bottom: 70px;
}

.character_even {
    background-image: url(../image/leon-bground.jpg);
    background-size: cover;
    background-position: center;
}

.character_even2 {
    background-image: url(../image/ada-bground.jpg);
    background-size: cover;
    background-position: center;
}

.character_even3 {
    background-image: url(../image/luis-bground.jpg);
    background-size: cover;
    background-position: center;
}

.character_even4 {
    background-image: url(../image/ashley-bground.jpg);
    background-size: cover;
    background-position: center;
}

.character_even5 {
    background-image: url(../image/jack-bground.jpg);
    background-size: cover;
    background-position: center;
}

.character_even6 {
    background-image: url(../image/saddler-bground.jpg);
    background-size: cover;
    background-position: center;
}


.content {
    padding: 125px;
    display: flex;
    position: relative;
    justify-content: space-between;
    align-items: center;
}

.content.mobile {
    display: none;
}

.character_photo_even {
    position: absolute;
    left: 42%;
    bottom: 0px;
    display: flex;

}

.character_photo {
    position: absolute;
    right: 48%;
    bottom: 0px;
    display: flex;
}

.character_photo_saddler {
    position: absolute;
    right: 40%;
    bottom: 0px;
    display: flex;
}


.character_info_even {
    text-align: right;
    width: 40%;
}

.character_info_even h1,
.character_info h1 {
    color: #C1182B;
}

.character_info_even h3 {
    margin: 0px;
}

.character_img_even {
    display: flex;
    flex-direction: column;
    gap: 20px;
    z-index: 1;
}

.character_img_even img {
    border: #fff 1px solid;
}

.character_img {
    display: flex;
    flex-direction: column;
    gap: 20px;
    z-index: 1;
}


.character_info {
    text-align: left;
    width: 40%;
}

.character_info h1 {
    color: #C1182B;
    display: inline-block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.character_info h3 {
    margin: 0px;
}

.character_img {
    display: flex;
    flex-direction: column;
    gap: 20px;
    z-index: 1;
}

.character_img_even.mobile,
.character_img_even1.mobile {
    display: none;
    display: flex;
    flex-direction: row;
    justify-content: center;
    gap: 0px;
}

.character_img_even.mobile img,
.character_img_even1.mobile img {
    display: none;
    width: 100%;
}

.character_info_even.mobile {
    text-align: right;
}

.character_info.mobile {
    text-align: left;
}

.character_beg2_ashley img {
    width: 40%;
}

.page-navigation img,
.back-to-top img {
    width: 100%;
}

.next-page {
    position: absolute;
    right: 2%;
}

/*laptop*/
@media screen and (max-width: 1150px) {

    .content {
        padding: 50px;
    }

    .character_info h3,
    .character_info_even h3 {
        margin: 0px;
        line-height: 50px;
    }

    .character_info h1,
    .character_info_even h1 {
        font-size: 90px;
    }

    .character_photo img,
    .character_photo_even img,
    .character_photo_saddler img {
        width: 100%;
    }

    .character_photo,
    .character_photo_even,
    .character_photo_saddler {
        height: 90%;
    }

    .character_photo {
        right: 40%;
    }

    .character_photo_even {
        left: 39%;
    }

    .character_photo_saddler {
        right: 25%;
    }

    .character_beg img {
        width: 100%;
    }

    .footer-logo img {
        width: 100%;
    }
}

/*Tablet*/
@media screen and (max-width: 900px) {

    .character_even.mobile {
        display: block;
        background-image: url("../image/leon background m.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .character_even2.mobile {
        display: block;
        background-image: url("../image/ada background m.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .character_even3.mobile {
        display: block;
        background-image: url("../image/luis background m.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .character_even4.mobile {
        display: block;
        background-image: url("../image/ashley background m.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .character_even5.mobile {
        display: block;
        background-image: url("../image/jack background m.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .character_even6.mobile {
        display: block;
        background-image: url("../image/saddler background m.jpg");
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .content {
        display: none;
    }

    .content.mobile {
        display: flex;
        position: relative;
        justify-content: space-between;
        align-items: center;
        padding: 20px;
    }

    .character_info.mobile {
        display: flex;
        flex-direction: column;
    }

    .character_info.mobile h1 {
        word-break: break-word;
        line-height: 0.8;
    }

    .character_info.mobile h3 {
        white-space: nowrap;
        margin-bottom: 90px;
        margin-top: 10px;
    }

    .character_text.mobile {
        z-index: 3;
        text-align: right;
        margin: 0px;
        margin-top: 230px;
        margin-left: 90px;
        width: 45%;
    }

    .character_text_even.mobile {
        z-index: 3;
        text-align: left;
        margin: 0px;
        margin-top: 230px;
        margin-right: 90px;
        width: 45%;
    }

    .character_beg.mobile,
    .character_beg2.mobile {
        margin-bottom: 60px;
        gap: 20px;
    }

    .character_beg.mobile img {
        width: 85%;
    }

    .character_beg2.mobile img {
        width: calc(50%-20px);
    }

    .character_photo.mobile {
        position: absolute;
        left: 36%;
        bottom: 0px;
        display: flex;
    }

    .character_img_even.mobile {
        margin-bottom: 15px;
        display: flex;
        justify-content: flex-end;
    }

    .character_img_even1.mobile {
        margin-bottom: 15px;
        display: flex;
        justify-content: flex-start;
    }

    .character_img_even.mobile img,
    .character_img_even1.mobile img {
        display: block;
        border: #fff 1px solid;
    }

    .character_photo_even.mobile {
        position: absolute;
        right: 36%;
        bottom: 0px;
        display: flex;
        justify-content: end;
    }

    .character_photo_saddler.mobile {
        position: absolute;
        right: 30%;
        bottom: 0px;
        display: flex;
        justify-content: end;
    }

    .character_info2.mobile h1 {
        color: #C1182B;
        display: inline-block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        word-break: break-word;
        line-height: 0.8;
    }

    .character_info2.mobile h3 {
        white-space: nowrap;
        margin-top: 10px;
        margin-bottom: 20px;
    }

    .footer img {
        width: 100%;
        gap: 20px;
    }

    .character_beg2_ashley img {
        width: 100%;
    }

    .character_photo img,
    .character_photo_even img,
    .character_photo_saddler img {
        width: auto;
    }

    .character_photo_even.mobile,
    .character_photo.mobile {
        right: 42%;
    }
}

@media screen and (max-width: 797px) {
    .previous-page {
        margin-left: 3%;
    }
}

/*Mobile Character*/
@media screen and (max-width:571px) {
    p {
        font-size: 10px;
    }

    img {
        width: auto;
    }

    .character_info.mobile {
        font-size: 12px;
    }

    .character_info.mobile h1 {
        font-size: 50px;
    }

    .character_info.mobile h3 {
        font-size: 20px;
    }

    .character_text.mobile,
    .character_text_even.mobile {
        width: 70%;
    }

    .character_beg.mobile img {
        width: 95%;
    }

    .character_photo.mobile {
        position: absolute;
        left: 36%;
        bottom: 0px;
        display: flex;
    }

    .character_img_even.mobile {
        margin-bottom: 15px;
    }

    .character_img_even.mobile img {
        display: block;
    }

    .character_photo_even.mobile {
        position: absolute;
        right: 36%;
        bottom: 0px;
        display: flex;
        justify-content: end;
    }

    .character_photo_saddler.mobile {
        position: absolute;
        right: 30%;
        bottom: 0px;
        display: flex;
        justify-content: end;
    }

    .character_beg2.mobile {
        margin-bottom: 60px;
    }

    .character_beg2.mobile img {
        width: 45%;
    }

    .character_info2.mobile h1 {
        color: #C1182B;
        display: inline-block;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        font-size: 50px;
        word-break: break-word;
        line-height: 0.8;
    }

    .character_info2.mobile h3 {
        font-size: 20px;
        white-space: nowrap;
        margin-top: 10px;
        margin-bottom: 20px;
    }

}