/*
Theme Name: Twenty Twenty-One Child
Theme URI: https://wordpress.org/themes/twentytwentyone/
Template: twentytwentyone
Author: HIlson Designs
Author URI: https://www.hilsondesigns.com/
Description: Twenty Twenty-One Child Theme is a blank canvas for your ideas and it makes the block editor your best brush. With new block patterns, which allow you to create a beautiful layout in a matter of seconds, this theme’s soft colors and eye-catching — yet timeless — design will let your work shine. Take it for a spin! See how Twenty Twenty-One elevates your portfolio, business website, or personal blog.
Tags: one-column,accessibility-ready,custom-colors,custom-menu,custom-logo,editor-style,featured-images,footer-widgets,block-patterns,rtl-language-support,sticky-post,threaded-comments,translation-ready

*/

:root {
	--branding--logo--max-width: 400px;

	--branding--logo--max-height: 200px;

	--branding--logo--max-width-mobile: 150px;

	--branding--logo--max-height-mobile: 150px;
	
	--top-widgets-color-link: #6b8599;
	
	--widgets-color-background: #081f3b;
	
	--footer-color-background: #233c56;
	
	--footer--color-text: #6b8599;
	
	--footer--color-link: #ffffff;

	--footer--color-link-hover: #e8e8e8;
}

.site a:focus:not(.wp-block-button__link):not(.wp-block-file__button) {

	/* Only visible in Windows High Contrast mode */

	outline: 2px solid transparent;
	text-decoration: underline 1px dotted currentColor;
	text-decoration-skip-ink: none;
	/*background: rgba(255, 255, 255, 0.9);*/
	background: inherit;
}

#header-wrapper { background: var(--widgets-color-background);}

/************************
* Top Bar
**/
#top-header-wrapper .header-top{ 
	postion: relative;
	color: var(--footer--color-link);
	background: var(--widgets-color-background);
	padding: 10px 10px;
	border-bottom: #102f48 1px solid;
}
.header-top {
	font-size: 16px;
}
.auto-container {
    position: static;
    max-width: 1140px;
    padding: 0px 15px;
    margin: 0 auto;
}
#top-header-wrapper .header-top .inner {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.header-top .top-left, 
.header-top .top-right {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.header-top a {
	color: var(--top-widgets-color-link);
	text-decoration: none;
}
.header-top a:hover {
	color: #87b3d6;
}

/************************
* Navigation
**/
.primary-navigation > div > .menu-wrapper {
    justify-content: center;
}

#nav-wrapper {align-content: center;}
/*.primary-navigation a:hover, .primary-navigation a:link, .primary-navigation a:visited {
    color: #e8e8e8;
}*/



.elementor-heading-title {
    padding: 0 0 0.6em 0 !important;
}

.menu-button-container .button.button {
    display: flex;
    font-size: var(--primary-nav--font-size-button);
    font-weight: var(--primary-nav--font-weight-button);
    background-color: transparent;
    border: none;
    color: #e8e8e8;
}
.primary-navigation-open .menu-button-container {
    background-color: #081f3b;
}
.primary-navigation > .primary-menu-container {
    background-color: #e8e8e8;
}
.menu-button-container #primary-mobile-menu {
    margin-left: auto;
    padding: calc(var(--button--padding-vertical) - (0.05 * var(--global--spacing-unit))) calc(0.9 * var(--button--padding-horizontal));
}

#widget-wrapper {
	background-color: var(--widgets-color-background);
	margin-top: calc(2 * var(--global--spacing-vertical));
}

.social-media-header {
	text-align: center;
	color: #6b8599;
	padding-top: var(--global--spacing-vertical);
}

.consultation-btn {
	background-color: #fd4a36;
    margin-right: 10px;
    line-height: 1em;
    padding: 2px 10px;
    border-radius: 30px;
}

.consultation-btn a:link {
	color: #fff;
}

#site-footer-wrapper {
	background-color: var(--footer-color-background);
}

.footer-navigation {
    padding-top: calc(0.2 * var(--global--spacing-vertical));
    padding-bottom: var(--global--spacing-vertical);
    color: var(--footer--color-text);
    font-size: var(--global--font-size-xs);
    font-family: var(--footer--font-family);
	margin-top: unset;
    margin-bottom: unset;
}

.site-footer > .site-info {
	border-top: none;
}

.site-info .powered-by {
    margin-top: initial;
    /* margin-left: auto; */
    margin: 0 auto;
}

.no-widgets .site-footer {
    margin-top: unset;
}

.menu-button-container {
	top: 130px;
}

.menu-button-container #primary-mobile-menu {
	color: var(--global--color-background);
}

@media only screen and (min-width: 822px) {
	.site-header {
		padding-top: calc(0.4 * var(--global--spacing-vertical));
	}	
}

@media (max-width: 740px) {
	#top-header-wrapper .top-left,
	#top-header-wrapper .top-right {
		text-align: center;
		display: block;
		width: 100%;
	}
	.site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo {
		position: relative;
	}
}

@media only screen and (max-width: 481px){
	
	.site-header.has-logo:not(.has-title-and-tagline).has-menu .site-logo img {
		max-height: calc(var(--button--padding-vertical) - (0.25 * var(--global--spacing-unit)) + 3em);		
	}
	.site-branding:last-child {
		text-align: left;
	}
	.primary-navigation > .primary-menu-container {
	padding-top: calc(var(--button--line-height) * var(--primary-nav--font-size-button) + 175px + 5px);
}
}

@media only screen and (min-width: 482px) {

	.site-header {
    	padding-bottom: calc(0.4 * var(--global--spacing-vertical));
	}
	
	.primary-navigation .primary-menu-container {
		margin-right: calc(15px - var(--primary-nav--padding));
		margin-left: calc(15px - var(--primary-nav--padding));
	}
}



