/**
 * This stylesheet handles
 * the mobile layout for our 
 * theme
 *
 * @version 1
 *          
 */

/**
 * Extra Small Devices
 * Phones (max-width: )
 */
@media (max-width: 550px){
	/**
	 * Masonry Entries
	 */
    
	.news-hub-entries-list{
		/*width: 80%;*/
		/*margin-left: 10%;*/
	}

    #video-carousel ul.video-entry-list {
        width: 100%;
        margin: 0 auto;
    }

    #video-carousel li.news-hub-entries-list
    {
        width: 85%;
        margin: 0 auto;
    }

    
	/**
	 * Mailchimp Form
	 */
	.news-hub-entries-list .widget.widget_mc4wp_widget form.mc4wp-form{
       width: 100%;
	}
    .news-hub-entries-list .newshub-subscription-form-wrap {
        width: 100%;
        margin-left: 13%;
    }

    /**
     * Post Format Video
     */
    .post-format-video-play{
        position: absolute;
        top: 15px;
        left: 30px;
        z-index: 9;
    }

    /**
     * VC Row
     */
     .vc_row {
        margin-top: 15px;
        margin-bottom: 15px;
     }

     .wpb_column  {
        margin-top: 15px;
        margin-bottom: 30px;
     }
     /**
      * Home Version 3
      */
     
     .news-hub-content-section {
        padding: 0 15px;
     }

     body .review-details.rm-padding-left {
        padding-left: 15px;
     }

     .page-template-page-templateshome-version-3-php .news-hub-grey-wrap {
        padding: 0;
        margin: 30px 0;
        background: none;
     }

     .news-hub-archive article img.avatar,
     .news-hub-recent-articles .entry-post img.avatar,
     .news-hub-post-list li.entry-post img.avatar {
        max-width: 32px;
        height: auto;
     }

     /**
      * Footer Widgets
      */
     #footer-widgets {
        padding: 0 30px;
     }

}
/**
 * Small Devices
 * Tablets (≥768px)
 */
@media (max-width: 768px) {

     /**
      * Edit Link
      */
    .edit-link {  
        margin-bottom: 50px;
    }
	/**
	 * Typography
	 */
	h1, .h1{
		font-size: 18px;
	}

    /**
     * Header
     */
    #header-left .site-branding,
    #masthead {
        max-height: 100%;
        border-bottom: 0;
    }
    #header-right{
        width: 100%;
        border-bottom: 0;
        margin-bottom: -6px; /*Remove the extra space caused by display property*/
    }

    /**
     * Archives
     */
    .news-hub-archive .page-header .page-title {
        line-height: 140%;
    }
	/**
	 * Menu
	 */
        .main-navigation {
            margin-bottom: 0;
        }

        .nav-menu > li > a {
            background: #222;
        }

        .main-navigation li.menu-item-has-children > a:after {
            display: none;
        }

        .main-navigation li.menu-item-has-children > a .fa {
            float: right;
            padding: 23px 26px;
            display: block;
            margin: -22px -28px;
            background: rgba(255,255,255,.10);
        }

        .main-navigation li.menu-item-has-children > a .fa:focus{
             background: rgba(255,255,255,.90);
        }

        .menu > li > a{
            border-bottom-width: 1px;
            padding: 20px 27px;
        }

		button.menu-toggle {
            margin: 0 0 -4px 0;
            padding: 20px 24px;
            float: right;
            font-size: 14px;
            width: 100%;
            text-align: right;
        }
        button.menu-toggle .fa {
            display: inline-block;
            border-left: 1px solid rgba(0,0,0,0.10);
            margin: -38px -25px -37px 0;
            padding: 30px;
        }
        .main-navigation {
            width: 100%;
            max-height: 100%;
            border-bottom: 0;
        }

        .menu > li.menu-item-has-children:hover > a::before{
            display: none;
        }


	/**
	 * Navigation 
	 */
		.main-navigation li{
			width: 100%;
		}

    
        .main-navigation .nav-menu {
            display: none;
        }

		.news-hub .menu-toggle,
		.news-hub .main-navigation.toggled .nav-menu {
			display: block;
		}

        .main-navigation ul.sub-menu {
            position: static;
            border-bottom-width: 1px;
            width: 100%;
            display: none;
        }

        .menu ul.sub-menu {
            border-bottom: 0;
        }

        .menu ul.sub-menu > li > a {
            width: 100%;
            margin-right: 8px;
            padding: 20px 27px;
            border-bottom: 1px solid #eee;
            padding-left: 3em;
        }

        .menu ul.sub-menu > li > ul.sub-menu > li  > a{
            padding-left: 4em;
        }

        .menu ul.sub-menu > li  > ul.sub-menu > li > ul.sub-menu > li > a{
            padding-left: 5px;
        }

        .menu ul.sub-menu > li > ul.sub-menu > li > ul.sub-menu > li > ul.sub-menu > li > a{
            padding-left: 6px;
        }

        .news-hub .main-navigation ul.sub-menu-mega > li.mega-menu-list .mega-menu-content .category-tabs.vertical .category-tab-tabs {
            margin-left: 0;
        }

        .news-hub .main-navigation ul.sub-menu-mega > li.mega-menu-list .mega-menu-content .category-tabs.vertical .category-tab-tabs li > a {
            padding: 10px;
            padding-right: 30px;
        }

        .news-hub .main-navigation ul.sub-menu-mega > li.mega-menu-list .mega-menu-content .category-tabs.vertical .category-tab-post-list {
            margin-left: 148px;
            border-left: 0;
        }

        .news-hub .main-navigation ul.sub-menu-mega > li.mega-menu-list .mega-menu-content ul.category-tab-tabs {
            float: left;
            width: 40%;
            padding-left: 8px;
        }
        .news-hub .main-navigation ul.sub-menu-mega > li.mega-menu-list .mega-menu-content .category-tabs .clearfix{ display: none;}
        .news-hub .main-navigation ul.sub-menu-mega > li.mega-menu-list .mega-menu-content .category-tabs .category-tab-post-list {
            float: left;
            width: 60%;
            padding-top: 20px;
            border-left: 1px solid #dadada;
        }

	/*Single blog & page*/
    .single .site-content {
        padding-top: 0;
    }

    .page .site-main, 
    .single .site-main 
    {
        padding-right: 0;
    }

    #page-heading{
    	padding: 30px 30px;
    }

    #page-heading .breadcrumbs{
    	float: left;
    	margin-top: 15px;
    }

    	/**
    	 * Author
    	 */
    	#author-bio-social-media{
    		display: block;
    		margin: 20px 0;
    		float: none;
    	}

    	#author-details-right{
    		text-align: center;
    	}

    	#author-area .pull-left{
    		float: none;
    		display: block;
    		width: 100%;
    	}

    	.entry-post .entry-footer img.avatar{
    		margin-bottom: 15px;
    	}

    /**
     * Featured image & left paddings
     * for pages and single post
     */
    article.page, .entry-post article.post, .comments-area, .entry-post .w-featured-image-entry-header
    {
    	padding: 0 30px 0 30px;
    }

    /**
     * Carousel Caption
     */
    .carousel-caption{
    	bottom: 20px;
    }

    /**
     * Shortcode: Recent Articles;
     */
     .news-hub-recent-article-shortcode.carousel-indicators{
        right: auto;
        left: auto;
        width: 100%;
    }

    .recent-article-carousel .item .entry-post {
     
    }

  

    
}

/**
 * Larger devices that needs trimming
 * @max-width (991px) 
 */
 @media (max-width: 991px) and (min-width: 768px) {
 	.widget.widget_newshubrecentposts .col-md-8.col-sm-12{
 		padding-left: 0;
 		margin-top: 20px;
 	}

 	.widget.widget_newshubpopularvideos h6{
 		display: none;
 	}

    .news-hub-recent-article-shortcode.carousel-indicators{
        right: auto;
        left: 15px;
        width: 80%;
    }

    .recent-article-carousel .item .entry-post {
        padding-bottom: 120px;
    }

      /**
     * Plugins
     */
    body .social-count-plus li{
        width: 50%;
    }
 }

/**
 * Large display
 * Adjust font size to 14px for large 
 * display monitor to make the text more
 * readable
 */
@media only screen 
and (min-width : 1632px) {   
    body {
        font-size: 14px;
        line-height: 1.42857142857;
    }
    /**
     * Adjust the top position
     * since we have changed the 
     * font size and line height
     */
    .main-navigation ul ul {
        top: 65px;
    }
 }