@charset "UTF-8";

/*
Theme Name: Guardian Capital
Theme URI: https://wordpress.org/themes/twentytwentyone/
Author: the WordPress team
Author URI: https://wordpress.org/
Description: Twenty Twenty-One 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.
Requires at least: 5.3
Tested up to: 6.8
Requires PHP: 5.6
Version: 2.5
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: twentytwentyone
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, blog, portfolio

Twenty Twenty-One WordPress Theme, (C) 2020 WordPress.org
Twenty Twenty-One is distributed under the terms of the GNU GPL.
*/

/**
 * SETTINGS
 * File-header..........The file header for the themes style.css file.
 * Fonts................Any font files, if the project needs specific fonts.
 * Global...............Project-specific, globally available variables.
 *
 * TOOLS
 * Functions............Global functions.
 * Mixins...............Global mixins.
 *
 * GENERIC
 * Normalize.css........Normalise browser defaults.
 * Breakpoints..........Mixins and variables for responsive styles
 * Vertical-margins.....Vertical spacing for the main components.
 * Reset................Reset specific elements to make them easier to style in other contexts.
 * Clearings............Clearings for the main components.
 *
 * ELEMENTS
 * Blockquote...........Default blockquote.
 * Forms................Element-level form styling.
 * Headings.............H1–H6
 * Links................Default links.
 * Lists................Default lists.
 * Media................Images, Figure, Figcaption, Embed, iFrame, Objects, Video.
 *
 * BLOCKS
 * Audio................Specific styles for the audio block.
 * Button...............Specific styles for the button block.
 * Code.................Specific styles for the code block.
 * Columns..............Specific styles for the columns block.
 * Cover................Specific styles for the cover block.
 * File.................Specific styles for the file block.
 * Gallery..............Specific styles for the gallery block.
 * Group................Specific styles for the group block.
 * Heading..............Specific styles for the heading block.
 * Image................Specific styles for the image block.
 * Latest comments......Specific styles for the latest comments block.
 * Latest posts.........Specific styles for the latest posts block.
 * Legacy...............Specific styles for the legacy gallery.
 * List.................Specific styles for the list block.
 * Media text...........Specific styles for the media and text block.
 * Navigation...........Specific styles for the navigation block.
 * Paragraph............Specific styles for the paragraph block.
 * Pullquote............Specific styles for the pullquote block.
 * Quote................Specific styles for the quote block.
 * Search...............Specific styles for the search block.
 * Separator............Specific styles for the separator block.
 * Table................Specific styles for the table block.
 * Verse................Specific styles for the verse block.
 * Video................Specific styles for the video block.
 * Utilities............Block alignments.
 *
 * COMPONENTS
 * Header...............Header styles.
 * Footer...............Footer styles.
 * Comments.............Comment styles.
 * Archives.............Archive styles.
 * 404..................404 styles.
 * Search...............Search styles.
 * Navigation...........Navigation styles.
 * Footer Navigation....Footer Navigation styles.
 * Pagination...........Pagination styles.
 * Single...............Single page and post styles.
 * Posts and pages......Misc, sticky post styles.
 * Entry................Entry, author biography.
 * Widget...............Widget styles.
 * Editor...............Editor styles.
 *
 * UTILITIES
 * A11y.................Screen reader text, prefers reduced motion etc.
 * Color Palette........Classes for the color palette colors.
 * Editor Font Sizes....Editor Font Sizes.
 * Measure..............The width of a line of text, in characters.
 */

/* Categories 01 to 03 are the basics. */

/* Variables */
:root {

	/* Font Family */
	--global--font-primary: var(--font-headings, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);
	--global--font-secondary: var(--font-base, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif);

	/* Font Size */
	--global--font-size-base: 1.25rem;
	--global--font-size-xs: 1rem;
	--global--font-size-sm: 1.125rem;
	--global--font-size-md: 1.25rem;
	--global--font-size-lg: 1.5rem;
	--global--font-size-xl: 2.25rem;
	--global--font-size-xxl: 4rem;
	--global--font-size-xxxl: 5rem;
	--global--font-size-page-title: var(--global--font-size-xxl);
	--global--letter-spacing: normal;

	/* Line Height */
	--global--line-height-body: 1.7;
	--global--line-height-heading: 1.3;
	--global--line-height-page-title: 1.1;

	/* Headings */
	--heading--font-family: var(--global--font-primary);
	--heading--font-size-h6: var(--global--font-size-xs);
	--heading--font-size-h5: var(--global--font-size-sm);
	--heading--font-size-h4: var(--global--font-size-lg);
	--heading--font-size-h3: calc(1.25 * var(--global--font-size-lg));
	--heading--font-size-h2: var(--global--font-size-xl);
	--heading--font-size-h1: var(--global--font-size-page-title);
	--heading--letter-spacing-h6: 0.05em;
	--heading--letter-spacing-h5: 0.05em;
	--heading--letter-spacing-h4: var(--global--letter-spacing);
	--heading--letter-spacing-h3: var(--global--letter-spacing);
	--heading--letter-spacing-h2: var(--global--letter-spacing);
	--heading--letter-spacing-h1: var(--global--letter-spacing);
	--heading--line-height-h6: var(--global--line-height-heading);
	--heading--line-height-h5: var(--global--line-height-heading);
	--heading--line-height-h4: var(--global--line-height-heading);
	--heading--line-height-h3: var(--global--line-height-heading);
	--heading--line-height-h2: var(--global--line-height-heading);
	--heading--line-height-h1: var(--global--line-height-page-title);
	--heading--font-weight: normal;
	--heading--font-weight-page-title: 300;
	--heading--font-weight-strong: 600;

	/* Block: Latest posts */
	--latest-posts--title-font-family: var(--heading--font-family);
	--latest-posts--title-font-size: var(--heading--font-size-h3);
	--latest-posts--description-font-family: var(--global--font-secondary);
	--latest-posts--description-font-size: var(--global--font-size-sm);
	--list--font-family: var(--global--font-secondary);
	--definition-term--font-family: var(--global--font-primary);

	/* Colors */
	--global--color-black: #000;
	--global--color-dark-gray: #28303d;
	--global--color-gray: #39414d;
	--global--color-light-gray: #f0f0f0;
	--global--color-green: #d1e4dd;
	--global--color-blue: #d1dfe4;
	--global--color-purple: #d1d1e4;
	--global--color-red: #e4d1d1;
	--global--color-orange: #e4dad1;
	--global--color-yellow: #eeeadd;
	--global--color-white: #fff;
	--global--color-white-50: rgba(255, 255, 255, 0.5);
	--global--color-white-90: rgba(255, 255, 255, 0.9);
	--global--color-primary: var(--global--color-dark-gray); /* Body text color, site title, footer text color. */
	--global--color-secondary: var(--global--color-gray); /* Headings */
	--global--color-primary-hover: var(--global--color-primary);
	--global--color-background: var(--global--color-green); /* Mint, default body background */
	--global--color-border: var(--global--color-primary); /* Used for borders (separators) */

	/* Spacing */
	--global--spacing-unit: 20px;
	--global--spacing-measure: unset;
	--global--spacing-horizontal: 25px;
	--global--spacing-vertical: 30px;

	/* Elevation */
	--global--elevation: 1px 1px 3px 0 rgba(0, 0, 0, 0.2);

	/* Forms */
	--form--font-family: var(--global--font-secondary);
	--form--font-size: var(--global--font-size-sm);
	--form--line-height: var(--global--line-height-body);
	--form--color-text: var(--global--color-dark-gray);
	--form--color-ranged: var(--global--color-secondary);
	--form--label-weight: 500;
	--form--border-color: var(--global--color-secondary);
	--form--border-width: 3px;
	--form--border-radius: 0;
	--form--spacing-unit: calc(0.5 * var(--global--spacing-unit));

	/* Cover block */
	--cover--height: calc(15 * var(--global--spacing-vertical));
	--cover--color-foreground: var(--global--color-white);
	--cover--color-background: var(--global--color-black);

	/* Buttons */
	--button--color-text: var(--global--color-background);
	--button--color-text-hover: var(--global--color-secondary);
	--button--color-text-active: var(--global--color-secondary);
	--button--color-background: var(--global--color-secondary);
	--button--color-background-active: var(--global--color-background);
	--button--font-family: var(--global--font-primary);
	--button--font-size: var(--global--font-size-base);
	--button--font-weight: 500;
	--button--line-height: 1.5;
	--button--border-width: 3px;
	--button--border-radius: 0;
	--button--padding-vertical: 15px;
	--button--padding-horizontal: calc(2 * var(--button--padding-vertical));

	/* entry */
	--entry-header--color: var(--global--color-primary);
	--entry-header--color-link: currentColor;
	--entry-header--color-hover: var(--global--color-primary-hover);
	--entry-header--color-focus: var(--global--color-secondary);
	--entry-header--font-size: var(--heading--font-size-h2);
	--entry-content--font-family: var(--global--font-secondary);
	--entry-author-bio--font-family: var(--heading--font-family);
	--entry-author-bio--font-size: var(--heading--font-size-h4);

	/* Header */
	--branding--color-text: var(--global--color-primary);
	--branding--color-link: var(--global--color-primary);
	--branding--color-link-hover: var(--global--color-secondary);
	--branding--title--font-family: var(--global--font-primary);
	--branding--title--font-size: var(--global--font-size-lg);
	--branding--title--font-size-mobile: var(--heading--font-size-h4);
	--branding--title--font-weight: normal;
	--branding--title--text-transform: uppercase;
	--branding--description--font-family: var(--global--font-secondary);
	--branding--description--font-size: var(--global--font-size-sm);
	--branding--logo--max-width: 300px;
	--branding--logo--max-height: 100px;
	--branding--logo--max-width-mobile: 96px;
	--branding--logo--max-height-mobile: 96px;

	/* Main navigation */
	--primary-nav--font-family: var(--global--font-secondary);
	--primary-nav--font-family-mobile: var(--global--font-primary);
	--primary-nav--font-size: var(--global--font-size-md);
	--primary-nav--font-size-sub-menu: var(--global--font-size-xs);
	--primary-nav--font-size-mobile: var(--global--font-size-sm);
	--primary-nav--font-size-sub-menu-mobile: var(--global--font-size-sm);
	--primary-nav--font-size-button: var(--global--font-size-xs);
	--primary-nav--font-style: normal;
	--primary-nav--font-style-sub-menu-mobile: normal;
	--primary-nav--font-weight: normal;
	--primary-nav--font-weight-button: 500;
	--primary-nav--color-link: var(--global--color-primary);
	--primary-nav--color-link-hover: var(--global--color-primary-hover);
	--primary-nav--color-text: var(--global--color-primary);
	--primary-nav--padding: calc(0.66 * var(--global--spacing-unit));
	--primary-nav--border-color: var(--global--color-primary);

	/* Pagination */
	--pagination--color-text: var(--global--color-primary);
	--pagination--color-link-hover: var(--global--color-primary-hover);
	--pagination--font-family: var(--global--font-secondary);
	--pagination--font-size: var(--global--font-size-lg);
	--pagination--font-weight: normal;
	--pagination--font-weight-strong: 600;

	/* Footer */
	--footer--color-text: var(--global--color-primary);
	--footer--color-link: var(--global--color-primary);
	--footer--color-link-hover: var(--global--color-primary-hover);
	--footer--font-family: var(--global--font-primary);
	--footer--font-size: var(--global--font-size-sm);

	/* Block: Pull quote */
	--pullquote--font-family: var(--global--font-primary);
	--pullquote--font-size: var(--heading--font-size-h3);
	--pullquote--font-style: normal;
	--pullquote--letter-spacing: var(--heading--letter-spacing-h4);
	--pullquote--line-height: var(--global--line-height-heading);
	--pullquote--border-width: 3px;
	--pullquote--border-color: var(--global--color-primary);
	--pullquote--color-foreground: var(--global--color-primary);
	--pullquote--color-background: var(--global--color-background);
	--quote--font-family: var(--global--font-secondary);
	--quote--font-size: var(--global--font-size-md);
	--quote--font-size-large: var(--global--font-size-xl);
	--quote--font-style: normal;
	--quote--font-weight: 700;
	--quote--font-weight-strong: bolder;
	--quote--font-style-large: normal;
	--quote--font-style-cite: normal;
	--quote--line-height: var(--global--line-height-body);
	--quote--line-height-large: 1.35;
	--separator--border-color: var(--global--color-border);
	--separator--height: 1px;

	/* Block: Table */
	--table--stripes-border-color: var(--global--color-light-gray);
	--table--stripes-background-color: var(--global--color-light-gray);
	--table--has-background-text-color: var(--global--color-dark-gray);

	/* Widgets */
	--widget--line-height-list: 1.9;
	--widget--line-height-title: 1.4;
	--widget--font-weight-title: 700;
	--widget--spacing-menu: calc(0.66 * var(--global--spacing-unit));

	/* Admin-bar height */
	--global--admin-bar--height: 0px;
}

.admin-bar {
	--global--admin-bar--height: 32px;
}


/* header */
html {scroll-padding-top: 100px;}
.custom-header { background-color: #0F0F2C; padding: 60px 30px; display: flex; align-items: center; justify-content: center; position: relative; height: 600px;}
.custom-logo { display: flex; gap: 180px;}
.custom-logo img {height: 180px;}
.custom-tagline { font-size: 24px; color: #FFFFFF; line-height: 40px; font-weight: 600; text-transform: uppercase;  letter-spacing: 10px;}
.menu-toggle {position: absolute;top: 4px;right: 31px;color: white;font-size: 41px; cursor: pointer;}


/* footer */

footer.footer-section {padding: 59px 150px 152px 150px;background: linear-gradient(0deg, rgba(157,156,162,1) 0%, #605d69 100%);}
.footer-contact h2 { font-size: 30px; text-align: center; color: #FFFFFF; margin: 0 0 12px; line-height: 40px; font-weight: 700; text-transform: uppercase;}
.footer-info { display: flex; justify-content: center; gap: 132px; padding: 30px 0px;}
.footer-info p{color: #fff; font-weight: 700; margin-bottom: 8px;}
.footer-map { text-align: center; padding-bottom: 50px;}
.footer-bottom { text-align: center; background: #12122e;}
.footer-map iframe { margin-top: -124px;}
.footer-map iframe { filter: grayscale(100%) invert(100%) contrast(85%);}
.copyright {padding-top: 50px;}
.copyright a{ font-size: 20px; color: #fff; text-decoration: none; font-weight: 600;}
.copyright p{ font-size: 12px; color: #fff; margin-top: 18px;}


/* Services */

.services_row {background: linear-gradient(0deg, rgba(157,156,162,1) 0%, #605d69 100%);}
.title_alignment{text-align: center;}
.title_alignment h3.widget-title {font-size: 30px;font-weight: 700;margin-bottom: 0px;}
.teammembers_img{background: #fff; padding: 50px 50px 20px 50px;}
.teammembers_img h3 { font-size: 15px; font-weight: 700; margin-top: 35px; margin-bottom: 18px;}
.teammembers_img .textwidget p a { display: flex; gap: 15px; padding: 10px 0; color: #a4a0a0; font-size: 15px; font-weight: 700; display: inline-block; vertical-align: top; margin: 0 5px 0 0px; text-decoration: none;}
 
.teammembers_img .textwidget p{font-size: 15px;}

.entry-title{display: none;}

.impressum_row h3 { font-size: 40px; line-height: 40px; margin-bottom: 20px; font-style: normal; font-weight: 300;}


@media only screen and (max-width: 1536px){
	/* .services_row{ overflow: hidden;}
	.services_row .service_column{position: relative;}
	.services_row .service_column .servise_texts h3.widget-title {position: absolute;top: 50%;width: 100%;left: 0;color: #fff;font-size: 20px;text-shadow: 10px 11px 13px black;text-transform: uppercase;letter-spacing: 2px;transition-delay: 0s;transition-duration: 0.5s;font-weight: bold;z-index: 99999;text-align: center;z-index: 1;}
	.services_row .service_column:hover .servise_texts h3.widget-title {transform: translateY(-70px);-webkit-transform: translateY(-70px);top: 26%;}
	.services_row .service_column .servise_img img {transition-delay: 0s;transition-duration: 0.5s;}
	.services_row .service_column:hover .servise_img img {transform: translateY(-270px);-webkit-transform: translateY(-270px);filter: grayscale(1);}
	.services_row .service_column .servise_texts .textwidget{width: 100%;padding: 15px 15px 50px;background: #fff;color: #040308;font-size: 14px;line-height: 20px;position: absolute;top: 550px;opacity: 0;transition-delay: 0s;transition-duration: 0.5s;}
	.service_column:hover .servise_texts .textwidget{opacity: 1;transform: translateY(-294px);-webkit-transform: translateY(-294px);align-items: center;overflow: auto;    height: 100%;} */
	.services_row .service_column:hover .servise_texts .textwidget { opacity: 1; transform: translateY(-294px); -webkit-transform: translateY(-294px); align-items: center; overflow-y: auto; height: 548px; max-height: 100%; display: flex; flex-direction: column; top: 439px;}
	#pg-7-1> .panel-row-style, #pg-7-3> .panel-row-style { padding: 0px 150px 0px 150px; min-height: 75vh !important;}
	.services_row .service_column .servise_img img {position: relative;}
	.servise_img:before { content: ''; position: absolute; bottom: 0; width: 100%; height: 100%; background: #fff; z-index: 0;}
	.services_row .service_column:hover .servise_texts h3.widget-title {top: 20%;}
	.services_row{padding: 0px 30px 80px 30px !important;}
	.footer-map iframe { width: 80%;}
	  

}

@media only screen and (max-width: 1024px){

	.servise_img:before {background: none;}
	.services_row .service_column:hover .servise_texts .textwidget {height: 461px;max-height: 100%;top: 422px;}
	.services_row .service_column:hover .servise_texts h3.widget-title {top: 25%;}
	#pg-7-1> .panel-row-style, #pg-7-3> .panel-row-style {min-height: 60vh!important;}
	.services_row {padding: 0px 30px 80px 30px !important;}
	.footer-map iframe { width: 80%;}
}

@media only screen and (max-width: 991px) {
	.services_row {padding: 0px 40px;}
	footer.footer-section {padding: 30px 50px 122px 50px;}
	.footer-map {text-align: center;padding-bottom: 18px;}
	.copyright {padding-top: 22px;}
	.footer-map iframe {width: 85%;}
	.services_row {padding: 0px 30px!important;}
    .teammembers_img {padding: 20px 20px 1px 20px!important;}
    .impressum_row.panel-row-style {padding: 30px !important;}
}


@media only screen and (max-width: 782px) {
	.admin-bar {--global--admin-bar--height: 46px;}
}

@media only screen and (max-width: 767px) {
	.services_row {padding: 0px!important;}
	.title_alignment h3.widget-title {font-size: 24px;}
	.servise_img::after { position: absolute; content: ' \002B'; font-size: 88px; font-weight: 100; top: 108px; right: 12px; color: #fff; text-shadow: 10px 11px 13px black;}
	.footer-contact h2 {font-size: 24px;}
	footer.footer-section {padding: 30px 50px 146px 50px;}
	.footer-map iframe { padding-bottom: 23px;}

	
	.services_row .service_column .servise_img img { transform: none; filter: none; width: 100%; height: auto; display: block;}
	.services_row .service_column .servise_texts .textwidget { position: static; opacity: 1 !important; transform: none; background: #fff; color: #000; padding: 15px; height: auto; overflow: visible;}
	.services_row .service_column:hover .servise_texts h3.widget-title,
	.services_row .service_column:hover .servise_img img,
	.services_row .service_column:hover .servise_texts .textwidget {transform: none !important; }
}


@media only screen and (max-width: 676px) {

	/* header */
	.custom-header {height: 300px;}
	.teammembers_img {background: #fff;padding: 20px 20px 0px 20px;}

	/* footer */
	.footer-map iframe { text-align: center; padding-bottom: 50px; height: 300px;}
	.copyright {padding-top: 0px;}
	.footer-info { display: flex; justify-content: center; gap: 5px; padding: 0px 0px; flex-direction: column; align-items: left;}
	.footer-map { text-align: center; padding-bottom: 12px;}
	.footer-info p {text-align: center;}

	
}


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

	:root {
		--global--font-size-xl: 2.5rem;
		--global--font-size-xxl: 6rem;
		--global--font-size-xxxl: 9rem;
		--heading--font-size-h3: 2rem;
		--heading--font-size-h2: 3rem;
	}
}

/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */
