/*
  Theme Name: BlogMag
  Theme URI: https://urbanwp.com/blogmag
  Description: A professional looking WordPress Theme for News & Magazine sites wich allows you to create a big, content oriented online newspaper.
  Tags: right-sidebar, grid-layout, custom-background, custom-colors, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready, news
  Author: weartstudio
  Author URI: https://urbanwp.com
  Version: 1.4
  License: Themeforest Licence
  License URI: http://themeforest.net/licenses
  Text Domain: blogmag
  */

/*
Table of Contents - ToC
- The main style file is in the assets/weart.css which is generated by SASS from weart.sass.
- The theme is using Bootstrap 4.0 for framework and all font from Google Fonts except FontAwesome 5.0.7.
*/


/*
    ======================================================
    Global styles
    ======================================================
*/
    #w-4 #video1{
        margin: 70px 0;
    }
    .screen-reader-text {
        border: 0;
        clip: rect(1px, 1px, 1px, 1px);
        clip-path: inset(50%);
        height: 1px;
        margin: -1px;
        overflow: hidden;
        padding: 0;
        position: absolute;
        width: 1px;
        word-wrap: normal !important;
    }
    @media (max-width: 575px){
        .px-0-sm{
            padding-left: 0;
            padding-right: 0;
        }
    }
/*
    ======================================================
    Header
    ======================================================
*/
    .container .widget_media_image .dcadtope{
        width: 100%;
    }
/*
    ======================================================
    Menu
    ======================================================
*/
    .navbar-dark .navbar-nav .nav-link{
        color: #fff;
    }
/*
    ======================================================
    Article list
    ======================================================
*/
    .w_article_list a,
    .w_article_normal .title a{
        font-family: 'Roboto', san-serif;
        font-weight: 600;
        line-height: 1.25;
    }
/*
    ======================================================
    Slider
    ======================================================
*/
    .featured1 .carousel-inner .img{
        filter: blur(0) !important;
        padding-top: 400px;
    }
    .featured1 .carousel-inner .img::after{
        background: rgba(0,0,0,.1) !important;
    }
    .featured-slider{
        display: flex;
    }
    .featured-slider .indicators{
        position: relative;
        left: initial;
        bottom: initial;
        background: initial;
        display: none;
        flex: 0 0 100%;
        max-width: 100%;
    }
    .featured-slider .indicators .carousel-indicators{
        flex-wrap: wrap;
    }
    .featured-slider .indicators .container,
    .featured-slider .indicators .container .carousel-indicators{
        height: 100%;
        min-height: initial !important;
    }
    .featured-slider .indicators .carousel-indicators .col-3{
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        border: 0 !important;
        opacity: 1;
    }
    .featured-slider .indicators .carousel-indicators .col-3:before{
        content: '';
        display: block;
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0,0,0,.3);
    }
    .featured-slider .indicators .carousel-indicators .col-3.active:before{
        background-color: rgba(0,0,0,.1);
    }
    .featured-slider .indicators .carousel-indicators .col-3 .p-4{
        position: absolute;
        bottom: 0;
        width: 100%;
    }
    .featured-slider .indicators .carousel-indicators .col-3 .t-sm{
        font-size: 14px;
    }
    .featured-slider .indicators .carousel-indicators .col-3 .progress .progress-bar.bg-1{
        z-index: 1;
    }
    .featured-slider .carousel-inner .innertext .t-lg,
    .featured-slider .indicators .carousel-indicators .col-3 .t-sm{
      text-shadow: 0 2px 5px rgba(0,0,0,.8);
    }
    @media (min-width: 768px){
        .featured1 .carousel-inner .img{
            padding-top: 500px;
        }
        .featured-slider .indicators{
            display: block;
        }
    }
    @media (min-width: 992px){
        .featured-slider .carousel-inner{
            flex: 0 0 70%;
            max-width: 70%;
        }
        .featured-slider .indicators{
            flex: 0 0 30%;
            max-width: 30%;
            padding-left: 10px;
            padding-top: 0;
        }
        .featured-slider .indicators .carousel-indicators .col-3{
            flex: 0 0 100%;
            max-width: 100%;
        }
        .featured-slider .indicators .carousel-indicators .col-3:not(:last-child){
            margin-bottom: 10px;
        }
        .featured-slider .carousel-inner .innertext{
            justify-content: initial;
            align-items: flex-end;
            padding-left: 30px;
            padding-bottom: 30px;
            text-align: left;
        }
        .featured-slider .carousel-control-prev, .carousel-control-next{
            display: none;
        }
    }
    @media (min-width: 1200px){
        .featured-slider .carousel-inner .innertext .t-lg{
            font-size: 32px;
        }
    }
    @media (max-width: 991px){
        .featured-slider{
            flex-wrap: wrap;
        }
        .featured-slider .carousel-inner,
        .featured-slider .indicators{
            flex: 0 0 100%;
            max-width: 100%;
        }
        .featured-slider .indicators .container{
            max-width: initial;
            padding: 0;
        }
        .featured-slider .indicators .carousel-indicators{
            margin-left: -5px;
            margin-right: -5px;
            margin-top: 5px;
        }
        .featured-slider .indicators .carousel-indicators .col-3{
            flex: 0 0 50%;
            max-width: calc(50% - 10px);
            height: 200px;
            margin: 5px;
        }
        .featured-slider .indicators .carousel-indicators .col-3 .t-sm{
            font-size: 16px;
        }
    }
    @media (max-width: 991px) and (min-width: 768px){
        .carousel-control-prev, .carousel-control-next{
            bottom: 50%;
        }
    }
    @media (max-width: 767px){
        .slider-wrapper .container{
            max-width: 100%;
            padding: 0;
        }
    }