.blog-home {
    /* position: relative; */
}

.blog-logo-spinning {
    position: absolute;
    top: 2.8rem;
    left: -2rem;
    z-index: 2;
    height: 4rem;
    width: 4rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.blog-logo-spinning .logo-text {
    animation: rotate 10s infinite linear;
    color: var(--dark-choclate);
    width: 100%;
    transition: all ease-in-out;
    transition-delay: 0.4s;
}

@-webkit-keyframes rotate {
    from {
        -webkit-transform: rotate(0deg);
    }
    to {
        -webkit-transform: rotate(359deg);
    }
}

.blog-logo-spinning .spinning-top {
    position: absolute;
    color: var(--dark-choclate);
    padding: 0.9rem;
    width: 100%;
    transition: all ease-in-out;
    transition-delay: 0.4s;
}

.blog-category {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 3;
    padding: 0.6rem;
}

.blog-category ul {
    padding: 0;
    margin: 0;
}

a.category-item {
    font-family: "Manrope";
    font-size: 0.3rem;
    font-weight: 600;
    color: var(--dark-choclate);
}

.blog-row {
    display: flex;
    /* align-items: center; */
    /* justify-content: space-between; */
    height: calc(100vh - 0px);
}

.blog-col-left {
    width: 75%;
    background: var(--light-pink-bg);
    position: relative;
    height: 100%;
}

.blog-col-left .blog-content-container {
    height: 100%;
    /* display: flex; */
    /* flex-direction: column; */
    /* justify-content: center; */
    /* width: 22rem; */
    padding-left: 3.2rem;
    padding-top: 2.2rem;
    padding-bottom: 3.4rem;
    padding-right: 1.8rem;
}

.blog-col-right {
    width: 36%;
    height: auto;
    background: white;
    position: relative;
    z-index: -1;
    overflow: hidden;
    text-align: center;
    vertical-align: middle;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blog-col-right img {
    width: 100%;
    height: 15rem;
    object-fit: contain;
}

.blog-col-left .blog-content-container .title {
    font-size: 2.6rem;
    font-family: "Deutschlander 2.0";
    line-height: 2.2rem;
    color: var(--dark-choclate);
    margin-bottom: 0.3rem;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.blog-col-left .blog-content-container .sub-title {
    font-size: 2.8rem;
    color: var(--dark-pink);
    font-weight: normal;
    line-height: 2.5rem;
    text-transform: uppercase;
}

.category-name {
    font-family: "Manrope";
    display: flex;
    align-items: center;
    font-size: .4rem;
    color: var(--dark-choclate);
    font-weight: 600;
}

.posted-info {
    display: flex;
    align-items: center;
    gap: 15px;
}

.author-tag {
    font-family: "Manrope";
    border-radius: 10rem;
    padding: .1rem .4rem .1rem .1rem;
    display: flex;
    align-items: center;
    font-size: .3rem;
    gap: 6px;
    width: fit-content;
}

.section:nth-child(odd) .author-tag {
    background-color: #ffffff60;
}

.section:nth-child(even) .author-tag {
    background-color: #f5effa;
}

.posted-date {
    font-family: "Manrope";
    border-radius: 10rem;
    padding: .1rem .4rem;
    display: flex;
    align-items: center;
    font-size: .3rem;
    gap: 6px;
    width: fit-content;
    color: #333333;
    font-weight: 600;
}

.section:nth-child(odd) .posted-date {
    background-color: #ffffff60;
}

.section:nth-child(even) .posted-date {
    background-color: #f5effa;
}

.author-img {
    border-radius: 10rem;
    width: .6rem;
    height: .6rem;
    background-color: #ffffff90;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.author-tag .author-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.author-tag .author-name span:first-child {
    color: #999999;
}

.author-tag .author-name span:last-child {
    color: #333333;
    font-weight: 600;
}

.blog-para-group {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 1.5rem;
    text-align: justify;
}

.blog-para-group .btn-read {
    /* background: var(--dark-choclate); */
    color: var(--dark-choclate);
    /* padding: 5px 8px; */
    font-size: .5rem;
    letter-spacing: 1px;
}

.blog-para-group p {
    font-family: "Manrope";
    color: var(--dark-choclate);
    font-size: .36rem;
    font-weight: lighter;
    line-height: .63rem;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 9;
    -webkit-box-orient: vertical;
}

.blog-para-group .right p {
    margin-bottom: 15px;
}

.category-header {
    /* font-weight: bold;
    text-decoration: underline;
    font-size: .5rem; */
    color: #403143;
    text-transform: uppercase;
    font-size: .5rem;
    letter-spacing: .9px;
    font-family: unset;
    /* font-weight: 600; */
}

.blog-share-icons {
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    align-items: center;
    gap: .4rem;
    padding-left: 3.2rem;
    padding-bottom: .5rem;
}

.blog-share-icons a {
    font-size: .5rem;
    color: var(--dark-choclate);
}

.blog-share-icons p {
    font-family: "Manrope";
    font-size: .25rem;
}

.blog-title {
    font-size: 1rem;
    text-transform: uppercase;
    color: var(--dark-choclate);
    margin-top: -1.6rem;
    margin-bottom: .5rem;
    font-weight: bold;
}

body.fp-viewing-firstPage .main-text,
body.fp-viewing-firstPage .menu-icon svg,
body.fp-viewing-secondPage .blog-logo-spinning .spinning-top,
body.fp-viewing-secondPage .blog-logo-spinning .logo-text,
body.fp-viewing-3rdPage .main-text,
body.fp-viewing-3rdPage .menu-icon svg,
body.fp-viewing-4thPage .blog-logo-spinning .spinning-top,
body.fp-viewing-4thPage .blog-logo-spinning .logo-text,
body.fp-viewing-5thPage .main-text,
body.fp-viewing-5thPage .menu-icon svg,
body.fp-viewing-6thPage .blog-logo-spinning .spinning-top,
body.fp-viewing-6thPage .blog-logo-spinning .logo-text,
body.fp-viewing-7thPage .main-text,
body.fp-viewing-7thPage .menu-icon svg,
body.fp-viewing-8thPage .blog-logo-spinning .spinning-top,
body.fp-viewing-8thPage .blog-logo-spinning .logo-text {
    color: var(--digital-coffe);
}

#section2 .blog-row .blog-col-left {
    background-color: white;
}

#section2 .blog-row .blog-col-right {
    background: #C8E7EA;
}

#section3 .blog-row .blog-col-left {
    background: #D5DAEF;
}

#section3 .blog-row .blog-col-right {
    background-color: white;
}

#section4 .blog-row .blog-col-left {
    background-color: white;
}

#section4 .blog-row .blog-col-right {
    background: #E4D8D0;
}

#section5 .blog-row .blog-col-left {
    background: #efeef3;
}

#section5 .blog-row .blog-col-right {
    background: white;
}

#section6 .blog-row .blog-col-left {
    background: white;
}

#section6 .blog-row .blog-col-right {
    background: #BFD6E9;
}

#section7 .blog-row .blog-col-left {
    background: #E3E3E3;
}

#section7 .blog-row .blog-col-right {
    background: white;
}

#section8 .blog-row .blog-col-left {
    background: white;
}

#section8 .blog-row .blog-col-right {
    background: #CAE7E0;
}

.blog-pagination {
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    padding-bottom: .5rem;
    text-align: center;
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
}

.blog-pagination .page-number {
    border: 1px solid gray;
    color: gray;
    width: .8rem;
    height: .8rem;
    border-radius: .1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-family: "Manrope";
}

.blog-pagination .page-number.active,
.blog-pagination .page-number:hover {
    font-weight: 600;
    color: white;
    background: var(--dark-choclate);
    border: 2px solid var(--dark-choclate);
    cursor: pointer;
}

.blogger-icon {
    display: flex;
}

.blogger-icon svg {
    height: .5rem;
    width: auto;
    color: var(--dark-choclate);
}

[data-title="Gantry Advertising's Role in Connecting Highways and Brands"] .blog-col-right {
    justify-content: flex-end;
}

[data-title="Gantry Advertising's Role in Connecting Highways and Brands"] .blog-col-right img {
    width: 11rem;
}

[data-title="Gantry Advertising''s Role in Connecting Highways and Brands"] .blog-col-right img {
    width: 100%;
}

[data-route="Science-of-Attention-Grabbing-Ads-Techniques-from-Elyts-Ad-Film-Experts"] .blog-col-right {
    align-items: end;
}

[data-title="The impact of Digital OOH services on the education sector in Bangalore"] .blog-col-right img {
    width: 100%;
}