/*
Theme Name: Web Design Agency
Theme URI: 
Author: Nova Themes
Author URI: 
Description: Web Design Agency is a free theme created for agencies, studios, freelancers, and service-based businesses. It provides a structured layout suitable for presenting services, projects, team members, and company information. The homepage includes sections such as a hero banner with call-to-action, client logo area, service overview, project showcase, and process section. It also provides areas for displaying statistics, testimonials, and contact details. The theme is responsive and designed to work across different screen sizes including desktops, tablets, and mobile devices. Customization options are available through the site Customizer for adjusting colors, typography, and other basic appearance settings without editing code.
Requires at least: 6.4
Requires PHP: 7.4
Tested up to: 6.9
Version: 1.0.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: web-design-agency
Tags: wide-blocks, block-styles, blog, full-site-editing
*/


html {
	scroll-behavior: smooth;
}

.short-title ,.right-title{
    display: inline-block;
}
.brand-box {
    position: absolute;
    top: -40px;
    box-shadow: 0px 4px 4px 0px #00000040;
    left: -30px;
}
.image-box{
	position: relative;
}
.image-box .center-image {
    text-align: center;
}
.image-box .center-image img {
    position: relative;
    z-index: 1;
    bottom: 0px;
    height: 400px;
    width: 75%;
}
.right-title {
    position: absolute;
    bottom: -18px;
    z-index: 2;
    left: 0px;
    right: 0px;
    margin: 0 auto;
    width: 59%;
}
.header-btn a:focus,.banner-btn a:focus{
	outline-color: red
}
.banner-btn a:hover,.header-btn a:hover{
    background: var(--wp--preset--gradient--primary-gradient-color) !important;
}
.banner-btn a:hover, .header-btn a:hover
.header-main{
	box-shadow: 0px 3px 6px 0px #00000029;
}


/*Media CSS*/

@media screen and  (min-width: 320px) and (max-width: 781px){
	.top-header p{
		text-align: center;
	}
	.top-header .wp-block-social-links {
		justify-content: center;
	}
	.banner-content{
		text-align: center;
	}
	.logo-text h1{
		text-align: center;
	}
	.header-btn,.banner-btn{
		justify-content: center !important;
	}
	.short-title{
		padding-right: 10px !important;
	    padding-left: 10px !important;
	}
	.banner-content h2,.banner-content p{
		text-align: center;
	}
	.brand-box {
	    position: relative;
	    top: 0px;
	    box-shadow: 0px 4px 4px 0px #00000040;
	    left: 0px;
	}
	.right-title {
	    position: relative;
	    bottom: 0px;
	    z-index: 2;
	    left: 0px;
	    display: inline;
	    right: 0px;
	    font-size: 11px !important;
	    margin: 0 auto;
	    width: 100%;
	}
	.logos-box img,.logos-box figure{
		text-align: center;
	}
}