/*
Theme Name: twentyseventeen-child
Theme URI: http://example.com/twentyseventeen-child/
Description: Twenty Seventeen Child Theme
Author: Your Name
Author URI: http://example.com
Template: twentyseventeen
Version:1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html

Tags: one-column, two-columns, right-sidebar, flexible-header, accessibility-ready, custom-colors, custom-header, custom-menu, custom-logo, editor-style, featured-images, footer-widgets, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
Text Domain: twentyseventeen-child

*/
        
        .banner_background--image{
            min-height: 100%; 
            min-width: 100%; 
            object-fit: cover;  
            object-position: 50% 50%;
        }

        .banner__container--page,
 	.banner__container--post{
            overflow:hidden;
        }
        
        .banner__title{
            color: white;
            font-family: 'Roboto', Sans-Serif;
        }
        
        .banner__title--main{
            font-size: 3em; 
            font-weight: 500; 
            line-height: 1.2;
            margin-bottom: 0.25em;
        }
        
        .banner__title--sub{
            font-size: 1.4em; 
            font-weight: 300;
        }
        
        .banner__overlay, .banner__overlay--post{
            left: 50%; 
            min-height: 100%; 
            min-width: 100%;
            position: absolute; 
            top: 50%; 
            transform: translate(-50%, -50%); 
            background-image: linear-gradient(to bottom left, rgba(000,152,219,0), rgba(0, 152, 219, 0.8)); 
        }
        
        .banner__overlay{
            padding-top: 25vh;
        }
        
        .banner__overlay--post{
            padding-top: 15vh;
        }
    
        .boxes__title--link .elementor-button {
            text-align: left;
        }
        
        .elementor-tab-content, .elementor-tab-content p {
            font-size: 14px;
        }
        
        .fa-search{
            opacity: 1;
            transition: opacity .2s;
        }
        .fa-search:hover{
            opacity: 0.7;
        }
        
        /* tablet styling*/
        @media (min-width: 768px) and (max-width: 1224px) {
            html{
                font-size: 14px ;
            }
            .banner__title--sub, .banner__title--main { 
                padding: 0% 10% 0% 10%  ;
            }
        }
        
        /* mobile styling*/
        @media (max-width: 768px) {
            html{
                font-size: 11px;
            }
            .banner__title--sub, .banner__title--main { 
                padding: 0% 10% 0% 10%  ;
            }
            .banner__title--main{
                font-size: 2.8em;
                margin-bottom: .5em;
            }
            
            .banner__title--sub{
                font-size: 1.2em;
            }
        }
        
        /* screen styling*/
        @media (min-width: 1224px) {
            html{
                font-size: 16px  ;
            }
            .banner__title--sub, .banner__title--main { 
                padding: 0% 50% 0% 10% ;
            }
        }