/*
Theme Name:     Newspaper Child theme
Theme URI: 	http://themeforest.net/user/tagDiv/portfolio
Description:    Child theme made by tagDiv
Author:         tagDiv
Author URI: 	http://themeforest.net/user/tagDiv/portfolio
Template:       Newspaper
Version:        9.0c
*/


/*  ----------------------------------------------------------------------------
    This file will load automatically when the child theme is active. You can use it
    for custom CSS.
*/


/* Magazine */

.magazine-row {
    display: flex;
    flex-flow: row wrap;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
}

.magazine-row .magazine-card {
    position: relative;
    display: flex;
    flex-direction: row;
    flex-basis: 25%;
    max-width: 25%;
    padding: 0 15px 0 !important;
    margin-bottom: 1em;
}

.magazine-card .magazine-image {
    flex-basis: 100%;
    max-width: 100%;
    padding: 0 15px 0 !important;
}

.magazine-card .magazine-image img {
    box-shadow: 0 4px 12px -6px #000;
}

.magazine-card .magazine-info {
    flex-basis: 100%;
    max-width: 100%;
    padding: 0 15px 0 !important;
    margin-bottom: 1em;
}

.magazine-row .magazine-card h6 {
    font-size: .9em;
    margin: 0;
}

.magazine-row .magazine-card h4 {
    font-family: var(--downtown-serif-font) !important;
    margin-top: 0;
    font-weight: 700;
}

.paged.page-template .pagination {
    display: flex;
    flex-direction: row;
    justify-content: center;
    margin-bottom: 2em;
}

.paged.page-template .pagination .page-numbers {
    width: 2em;
    height: 2em;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ececec;
    border-radius: 50%;
    margin: 0.4em;
    transition: .2s ease;
}

.paged.page-template .pagination .page-numbers:hover {
    background-color: #fcbd42;
}


.paged.page-template .pagination .page-numbers.current {
    background-color: #0c202f;
    color: #fff;
}

/* END - - - Magazine */


/* Magazine - single */

.single-magazines .magazine-image {
    position: relative;
}

.single-magazines span.number-badge {
    position: absolute;
    right: 1rem;
    top: 0;
    color: rgba(12, 32, 47, .1);
    font-size: 8em;
    line-height: 1;
    font-weight: 900;
}

.single-magazines h1 {
    font-family: var(--downtown-serif-font) !important;
    line-height: 1 !important;
    font-size: 42px;
    font-weight: 700 !important;
}

.single-magazines .td-main-content-wrap {
    padding: 4em 0 4em !important;
}

.td-main-content-wrap .tdc-row:first-child .vc_row {
    display: flex;
    align-items: center;
}

.td-main-content-wrap .tdc-row:first-child h6 {
    margin-bottom: 0;
    font-family: var(--downtown-sans-serif-font) !important;
}

.td-main-content-wrap .tdc-row:first-child h1 {
    margin-top: 0;
}

.single-magazines .magazine-image {
    display: flex;
    justify-content: center;
    width: 100%;
}

.single-magazines .magazine-image img {
    max-width: 360px;
    width: 100%;
    box-shadow: 0 4px 16px -8px #000;
}

.single-magazines .magazine-buttons {
    padding-bottom: 2em;
}

.single-magazines .magazine-buttons .btn.main {
    position: relative;
    display: inline-flex;
    align-items: center;
    font-size: 1em;
    background-color: #0c202f;
    color: #fff;
    padding: 0.6em 1em;
    transition: .4s ease;
}

.single-magazines .magazine-buttons .btn.main:after {
    content: "\f5da";
    font-family: "Font Awesome 6 Free";
    font-weight: 600;
    position: absolute;
    right: -2.4em;
    width: 2.4em;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #0c202f;
    color: #fff;
}

.single-magazines .magazine-buttons .btn:hover:after {
    background-color: rgba(12, 32, 47, .85);
}

.single-magazines .magazine-buttons i {
    font-size: 1.2em;
    margin-right: .4em;
}

.single-magazines .magazine-buttons .btn-pdf {
    position: relative;
    display: inline-flex;
    align-items: center;
    font-size: 1em;
    background-color: rgba(12, 32, 47,.2);
    color: #0c202f;
    padding: 0.6em 1em;
    transition: .4s ease;
}

.single-magazines .magazine-buttons .btn-pdf:hover {
    background-color: rgba(12, 32, 47,.1);
}

.single-magazines .magazine-excerpt {
    border-bottom: 1px solid rgba(12, 32, 47, .2);
}

.single-magazines .publication-date {
    margin-top: .2em;
    color: rgba(12, 32, 47, .4);
}



/* END - - - Magazine - single */


@media only screen and (max-width: 767px) {
    /*************** ADD DESKTOP ONLY CSS HERE  ***************/

    .magazine-row .magazine-card {
        display: flex;
        flex-direction: row;
        flex-basis: 100%;
        max-width: 100%;
        padding: 0 15px 0 !important;
        margin-bottom: 1em;
    }

    .td-main-content-wrap .tdc-row:first-child .vc_row {
        display: block;
    }

}