h1 {
    font-size: 42px;
}

h2 {
    font-size: 32px;
}
.angel-cards-outter {
    padding: 48px 5px;
}
/* @media (max-width: 1150px) {
    h1 {
        font-size: 37px;
    }

    h2 {
        font-size: 27px;
    }
} */

@media (max-width: 767px) {
    h1 {
        font-size: 32px;
    }

    h2 {
        font-size: 28px;
    }
}

.transform {
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
    transform-style: preserve-3d;
}

/* ************************************ */
.angel-cards {
    background: url("./images/thumbnail-bg.jpg");
    background-position: top;
    background-size: cover;
    background-repeat: no-repeat;
}
.bg-attachment {
    background-attachment: fixed;
}
h1, h2 {
    color: #fff;
    text-shadow: 2px 2px 3px #000, 2px 2px 0px #fff;
}
.angel-container {
    background-image: url(./images/angel-wings-white.png);
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
.result-img {
    background: url(./images/wings.png);
    background-repeat: no-repeat;
    /* background-position: center; */
    background-position: top;
    height: 275px;
    margin-bottom: 25px;
}
.angel-main-section-inner {
    width: 800px;
    height: 800px;
    position: relative;
    /* border: 1px solid black; */
    margin: 50px auto;
}
.result-img p {
    font-weight: 600;
    color: #999
}
.image-item-outter {
    width: 150px;
    height: 150px;
    position: absolute;
    /* background-color: red; */
}
.image-item-outter a {
    display: inline-block;
    max-width: 100%;
}
.image-item-outter a img:hover{
    /* padding: 10px; */
    margin-top: -10px;
}
.image-item-outter a img {
    max-width: 100%;
}
.result-img {
    text-align: center;
}
.result-img img{
    max-width: 100%;
    max-height: 250px;
}
.reading {
    margin: auto;
    margin-top: 25px;
    max-width: 950px;
    color: #fff;
}
.reading .content {
    margin-top: 15px;
    background: #00000040;
    padding: 15px;
    border-radius: 4px;
    box-shadow: 1px 1px 2px 1px #00000040;
}

.button{ font-size: 18px; color: #fff; background-color: #000; padding: 15px 30px; border-radius: 50px; text-decoration: none; text-align: center; display: inline-block; transition: 0.5s; box-shadow: 1px 1px 6px 1px #393939; }
.button:hover{ background-color: #750000 !important; color: #fff; }

@media only screen and (max-width:840px) {
    .angel-main-section-inner {
        width: 95%;
        height: auto;
        margin: auto;
        text-align: center;
        margin-top: 25px;
    }
    .image-item-outter {
        position: unset;
        display: inline-block;
        margin: 5px;
        width: 130px;
        height: 130px;
    }

}
@media only screen and (max-width:490px) {
    .image-item-outter {
        width: calc(100% / 3.5);
        height: auto;
    }
}