﻿/*
Theme Name:		Future City 2023
Theme URI:		https://futurecity.co.uk/
Author:			Lei Ma
Author URI:		http://www.thehousemedia.com
Version:		2.0
*/

/*-----------------------------------------------------------------------------------
	= Table of Contents

	1. = Body, Typography and some main Elements
	2. = Structure
	3. = Header styling
	4. = Footer styling
	5. = Home Page styling
	6. = Page styling
	7. = Contact Page styling
	8. = News Page styling
	9. = Projects Page styling
	10.= About Page styling
	

/*-----------------------------------------------------------------------------------*/
/* 1. = Body, Typography and some main Elements
/*-----------------------------------------------------------------------------------*/

@import url(css/fonts.css);


html * { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; -webkit-font-smoothing:antialiased; -moz-font-smoothing:antialiased; }
body { font-size:16px; color:#383838; font-family:'HelveticaNeue', Arial, Helvetica, sans-serif; overflow-x:hidden; font-weight:400; }
input, textarea, select, label { font-family:'HelveticaNeue', Arial, Helvetica, sans-serif; outline:0; border-radius:0; box-shadow:none; }
input:focus, input:hover { outline:0; }
::-webkit-input-placeholder { color:#000; opacity:1; }
:-moz-placeholder { color:#000; opacity:1; }
::-moz-placeholder { color:#000; opacity:1; }
:-ms-input-placeholder { color:#000; opacity:1; }
h1, h2, h3, h4, h5, h6 { padding:0; margin:0 0 25px 0; line-height:1.3; font-weight:700; font-family:'Gotham', Arial, Helvetica, sans-serif; }
h1 { font-size:40px; }
h2 { font-size:40px; }
h3 { font-size:32px; }
h4 { font-size:24px; }
h5 { font-size:16px; }
h6 { font-size:16px; }
img { display:block; max-width:100%; height:auto; }
ul,ol { margin:0; padding:0; list-style:none; }
a, a:visited, a:active { color:#383838; text-decoration:none; transition:all .3s ease-out; }
a:focus, a:hover { color:#91AB00 text-decoration:none; outline:0; }
a:active { color:#AECC0A; }
:focus, :hover { text-decoration:none; outline:0; }
p { margin:0 0 15px 0; line-height:1.5; }
a span { transition:all .3s ease-out; }

.button { border:2px solid #B5D500; color:#B5D500; padding:4px 20px 3px 20px; text-decoration:none; display:inline-block; font-size:25px; text-transform:uppercase; }
.button:visited { background:#B5D500; color:#B5D500; }
.button:active { color:#C8EB00; border-color:#C8EB00; }
.button:hover { color:#C8EB00; border-color:#C8EB00; }
.button.large { padding-left:40px; padding-right:40px; min-width:285px; }



/*-----------------------------------------------------------------------------------*/
/* 2. = Structure
/*-----------------------------------------------------------------------------------*/

.container { width:1500px; margin:0 auto; padding-left:0; padding-right:0; max-width:none; }
.view-mobile { display:none; }



/*-----------------------------------------------------------------------------------*/
/* 3. = Header styling
/*-----------------------------------------------------------------------------------*/

#header { background:rgba(0,0,0,0.7); position:fixed; width:100%; left:0; top:0; z-index:9999; padding:17px 0 18px 0; transition:all .35s linear; height:74px; }
#header .container { display:flex; justify-content:space-between; align-items:center; }
#header .logo { transition:all .5s linear; }

#header nav { margin:0 0 0 auto; transition:all .5s linear; }
#header nav > ul { display:flex; }
#header nav li { margin:0 30px 0 0; position:relative; }
#header nav li:last-child { margin:0; }
#header nav li a { color:#FFF; }
#header nav li a:hover { color:#B5D500; }
#header nav li ul { display:none; position:absolute; left:-15px; width:250px; top:38px; background:rgba(0,0,0,0.7); padding:10px 15px; border-top:3px solid #B5D500; }
#header nav li ul li { margin:0 0 8px 0; float:none; padding:0; line-height:1.1; }
#header nav li ul li:last-child { margin:0; }
#header nav li.back { display:none; }
#header nav li.view-mobile { display:none; }

#header form { float:left; position:absolute; top:25px; left:50%; margin:0 0 0 -10px; transition:all .5s linear; }
#header form input[type=text] { border:none; float:left; position:relative; background:none; font-size:14px; color:#FFF; border:none; width:0; height:25px; line-height:25px; transition:all .5s linear; }
#header form input[type=text]::-webkit-input-placeholder { color:#999; }
#header form input[type=text]:-moz-placeholder { color:#999; }
#header form input[type=text]::-moz-placeholder { color:#999; }
#header form input[type=text]:-ms-input-placeholder { color:#999; }
#header form input[type=submit] { width:21px; height:21px; cursor:pointer; border:none; background:url(images/icon-form-search-light.png) no-repeat; float:left; margin:4px 0 0 0; }
#header form .search-icon { display:block; width:21px; height:21px; cursor:pointer; background:url(images/icon-form-search-light.png) no-repeat; float:left; margin:4px 0 0 0; }
#header form .close-icon { z-index:100; width:10px; height:10px; position:absolute; right:5px; top:5px; display:none; background:url(images/icon-cross.svg) no-repeat center center / 100% 100%; }

#header.form-active { height:100%; }
#header.form-active .logo { opacity:0; visibility:0; }
#header.form-active nav { opacity:0; visibility:0; }
#header.form-active form { margin:0 0 0 -120px; }
#header.form-active form input[type=text] { width:200px; margin:0 0 0 20px; padding:0 20px 0 0; border-bottom:1px solid #FFF; }
#header.form-active .close-icon { display:block; }

#mobile-header { height:70px; padding:16px 20px; top:0; left:0; background:rgba(0,0,0, 0.7); position:fixed; width:100%; z-index:9999; display:none; justify-content:space-between; align-items:center; }
#mobile-header .header-menu { position:absolute; top:0; right:0; z-index:900;  }
#mobile-header .header-menu .menu-icon { width:70px; height:70px; float:right; display:block; background:#B5D500 url(images/icon-form-search-dark.png) no-repeat 24px center; transition:all 0.3s ease-in-out; }
#mobile-header .header-menu .menu-icon:hover { background-color:#A7C400 !important; }
#mobile-header .header-menu nav { background:#B5D500; border-top:1px solid #DAEA80; display:block; width:0; height:calc(100vh - 70px); position:absolute; right:0; top:70px; z-index:1000; overflow:hidden; transition:width 0.3s ease-in-out; }
#mobile-header .header-menu nav li { border-bottom:1px solid #DAEA80; }
#mobile-header .header-menu nav li.parent > a, 
#mobile-header .header-menu nav li.menu-item-has-children > a { background:url(images/nav-right-arrow.png) no-repeat 95% center; background-position-x:calc(100% - 20px); }
#mobile-header .header-menu nav > ul li a { display:block; padding:12px 20px; font-size:14px; text-decoration:none; color:#000; text-transform:uppercase; }
#mobile-header .header-menu nav > ul li a:hover { background-color:#A7C400; }
#mobile-header .header-menu nav > ul li.current_page_item > a { background-color:#A7C400; }

#mobile-header .header-menu nav ul ul { position:absolute; z-index:2000; right:0; top:0; width:0; height:calc(100vh - 70px); background:#B5D500; transition:width 0.3s ease-in-out; }
#mobile-header .header-menu nav li.active ul { width:100%; }

#mobile-header form { position:absolute; display:flex; justify-content:space-between; align-items:center; z-index:1000; top:0; right:-72px; height:100%; width:72px; background:#88A000; cursor:pointer; opacity:0; transition:all .3s ease-out; }
#mobile-header form input[type=text] { width:0; height:30px; line-height:30px; font-size:16px; padding:0; background:none; border:none; margin:0; overflow:hidden; opacity:0; transition:all .3s ease-out; }
#mobile-header form input[type=submit] { cursor:pointer; border:none; width:21px; height:21px; background:url(images/icon-form-search.png) no-repeat; margin:0 0 0 auto; } 

#mobile-header.active .header-menu .menu-icon { width:100vw; max-width:500px; }
#mobile-header.active .header-menu nav { width:calc(100% - 70px); }
#mobile-header .header-menu:hover .menu-icon { background-color:#A7C400; }
#mobile-header.active .header-menu:hover .menu-icon { background-color:#B5D500; }
#mobile-header.active form { opacity:1; right:0; width:calc(100% - 70px); cursor:default; max-width:430px; }
#mobile-header.active form input[type=text] { width:140px; padding:0 24px; opacity:1; }



/*-----------------------------------------------------------------------------------*/
/* 4. = Footer styling
/*-----------------------------------------------------------------------------------*/



/*-----------------------------------------------------------------------------------*/
/* 5. = Home Page styling
/*-----------------------------------------------------------------------------------*/

.home-hero-content { opacity:1; visibility:visible; transition:all 1s ease-out !important; }
.home-hero-content.hide-hero { opacity:0; visibility:hidden; }

.article-item .elementor-widget-wrap { padding:62.55% 0 0 0 !important; height:0; }
.article-item .elementor-widget-wrap .elementor-widget-heading { position:static; }
.article-item .elementor-widget-wrap .elementor-widget-heading .elementor-widget-container { position:static; }
.article-item .elementor-widget-wrap h3 { top:0; left:0; position:absolute; width:100%; height:100%; }
.article-item .elementor-widget-wrap h3:before { background:rgba(0,0,0,0.45); content:""; position:absolute; top:0; left:0; width:100%; height:100%; transition:background 0.3s ease-in-out; }
.article-item .elementor-widget-wrap h3:hover:before { background:rgba(0,0,0,0.75); border:2px solid #B1CF01; }
.article-item .elementor-widget-wrap a { width:100%; height:100%; display:flex; justify-content:center; align-items:center; position:relative; padding:0 20px; }

.news-list-container.adjust-margin { margin:0 -10px; }
.news-list-container ul { display:flex; flex-wrap:wrap; }
.news-list-container ul li { width:calc(33.333333% - 20px); margin:0 10px 20px 10px; background-size:cover; background-repeat:no-repeat; background-position:center center; position:relative; }
.news-list-container ul li:before { background:rgba(0,0,0,0.45); content:""; position:absolute; top:0; left:0; width:100%; height:100%; transition:background 0.3s ease-in-out; }
.news-list-container ul li:hover:before { background:rgba(0,0,0,0.75); border:2px solid #B1CF01; }
.news-list-container ul li .news-item { padding:62.55% 0 0 0; height:0; }
.news-list-container ul li a { width:100%; height:100%; display:flex; justify-content:center; align-items:center; position:absolute; top:0; left:0; padding:20px; }
.news-list-container ul li .content { text-align:center; color:#FFF; }
.news-list-container ul li .content h3 { font-size:24px; color:#FFF; margin:0 0 3px 0; text-transform:uppercase; }
.news-list-container ul li .content p { margin:0; }
.news-list-container ul li .content .date { position:relative; margin:0 auto; text-align:center; }
.news-list-container ul li .content .date p { margin:0; background:none; padding:0 5px; display:inline-block; vertical-align:middle; color:#FFF; }
.news-list-container ul li .content .divider { width:40px; height:2px; background:#FFF; margin:0 auto; display:inline-block; vertical-align:middle; transition:background 0.3s linear; }
.news-list-container ul li a:hover .divider { background:#B1CF01; }

.news-list-container .button-container { text-align:center; margin:30px 0 0 0; }
.news-list-container .button-container .button { color:#B5D500; padding-left:40px; padding-right:40px; }
.news-list-container .button-container .button:hover { color:#C8EB00; }
.news-list-container .button-container .loading-button i { float:right; width:32px; height:32px; background:url(images/loading.gif) no-repeat center center / 100% 100%; margin:3px 0 0 9px; }



/*-----------------------------------------------------------------------------------*/
/* 6. = Page styling
/*-----------------------------------------------------------------------------------*/

.elementor-section .elementor-widget-text-editor p:last-child { margin:0; }
.elementor-section .elementor-widget-text-editor a { text-decoration:underline; }
.elementor-section .elementor-widget-text-editor ul { margin:0 0 20px 0; }
.elementor-section .elementor-widget-text-editor ol { margin:0 0 20px 0; }



/*-----------------------------------------------------------------------------------*/
/* 7. = Contact Page styling
/*-----------------------------------------------------------------------------------*/

.newsletter-form .field { margin:0 0 10px 0; display:flex; justify-content:space-between; }
.newsletter-form .submit-field { margin:0; }
.newsletter-form input[type=email],
.newsletter-form input[type=text] { display:block; width:100%; margin:0; border:1px solid #CCC; color:#000; font-weight:300; font-size:16px; height:40px; line-height:40px; padding:0 12px; }
.newsletter-form input[type=email]:hover,
.newsletter-form input[type=text]:hover { border:1px solid #A2A2A2; }
.newsletter-form input[type=email]:focus,
.newsletter-form input[type=text]:focus { border:1px solid #666 !important; }
.newsletter-form input[type=submit] { border:2px solid #5E5E5E !important; background:#515151 !important; padding:6px 20px !important; cursor:pointer; color:#FFF !important; font-size:16px !important; transition:background 0.3s linear; text-transform:uppercase; }
.newsletter-form input[type=submit]:hover { background:#2A2A2A !important; }
.newsletter-form input[type=submit]:active { background:#515050 !important; }
.newsletter-form input::-webkit-input-placeholder { color:#999; }
.newsletter-form input:-moz-placeholder { color:#999; } 
.newsletter-form input::-moz-placeholder { color:#999; } 
.newsletter-form input:-ms-input-placeholder { color:#999; }
.newsletter-form .half { width:50%; padding-right:20px; }
.newsletter-form .half-last { width:50%; padding-left:20px; }



/*-----------------------------------------------------------------------------------*/
/* 8. = News Page styling
/*-----------------------------------------------------------------------------------*/

.latest-news-container { text-align:center; color:#FFF; } 
.latest-news-container .content { max-width:1150px; margin:0 auto 20px auto;  }
.latest-news-container h1 { color:#FFF !important; margin:0 0 20px 0; text-transform:uppercase; }
.latest-news-container img { margin:0 auto 20px auto; }
.latest-news-container .button { padding-left:40px; padding-right:40px; color:#B5D500; }
.latest-news-container .button:hover { color:#C8EB00; }
.latest-news-container .date { position:relative; margin:0 auto 25px auto; text-align:center; }
.latest-news-container .date p { margin:0; background:none; padding:0 5px; display:inline-block; vertical-align:middle; color:#FFF; }
.latest-news-container .divider { width:40px; height:2px; background:#FFF; margin:0 auto; display:inline-block; vertical-align:middle; transition:background 0.3s linear; }

.filter-by-container { margin:0 0 47px 0; transition:margin 0.5s linear; text-align:center; }
.filter-by { margin:0 auto; text-align:center; display:inline-block; transition:margin 0.5s linear; }
.filter-by span { font-size:12px; float:left; color:#FFF; background:#2A2A2A; padding:7px 10px 5px 10px; display:block; margin:0 1px 0 0; transition:all 0.3s linear; }
.filter-by i { width:32px; height:30px; padding:0; background:#2A2A2A url(images/arrow-up-white.png) no-repeat center center; display:block; float:left; transition:all 0.3s linear; }
.filter-by:hover span { background:#1C1C1C; }
.filter-by:hover i { background-color:#1C1C1C; }
.filter-by:active span { background:#010101; }
.filter-by:active i { background-color:#010101; }
.filter-by-container.active { margin:0 0 37px 0; }
.filter-by-container.active .filter-by {  }
.filter-by-container.active .filter-by i { transform: scale(-1, -1); }
.filter-by-container .filter-category { text-align:center; background:#2A2A2A; padding:10px 0 0 0; display:none; margin:20px 0 0 0; }
.filter-by-container .filter-category a { display:inline-block; text-transform:uppercase; text-decoration:none; font-size:12px; margin:0 3px 10px 3px; color:#FFF; background:#383838; padding:7px 10px 5px 10px; transition:all 0.5s linear; }
.filter-by-container .filter-category a.selected { color:#2A2A2A; background:#FFF !important; }
.filter-by-container .filter-category a:hover { text-decoration:none; background:#1C1C1C; color:#FFF; }
.filter-by-container .filter-category a:active { background:#010101; color:#FFF; }

.post-information-container { color:#FFF; text-align:center; position:relative; }
.post-information-container h1 { color:#FFF !important; margin:0 auto 15px auto; max-width:680px; line-height:1; text-transform:uppercase; }
.post-information-container .date { position:relative; margin:0 auto 20px auto; text-align:center; }
.post-information-container .date p { margin:0; background:none; padding:0 5px; display:inline-block; vertical-align:middle; color:#FFF; }
.post-information-container .divider { width:40px; height:2px; background:#FFF; margin:0 auto; display:inline-block; vertical-align:middle; transition:background 0.3s linear; }
.post-information-container .share-link-container { display:flex; justify-content:center; }
.post-information-container .share-link-container a { display:inline-block; color:#FFF; padding:8px 62px 7px 22px; text-transform:uppercase; color:#FFF; font-size:16px; background:#2A2A2A; position:relative; }
.post-information-container .share-link-container a:hover,
.post-information-container .share-link-container a:active { background-color:#1C1C1C; color:#FFF; }
.post-information-container .share-link-container a:before { display:block; width:39px; height:39px; position:absolute; top:0; right:0; border-left:1px solid #383838; content:""; transition:all .3s ease-out; }
.post-information-container .share-link-container a:hover:before,
.post-information-container .share-link-container a:active:before { background-color:#1C1C1C; }
.post-information-container .share-link-container .facebook-button { margin-right:15px; }
.post-information-container .share-link-container .facebook-button:before { background:#2A2A2A url(images/icon-facebook.png) no-repeat center 11px; }
.post-information-container .share-link-container .twitter-button:before { background:#2A2A2A url(images/icon-twitter.png) no-repeat center 13px; }
.post-information-container .previous-post { position:absolute; left:0; top:50%; margin:-13px 0 0 0; }
.post-information-container .previous-post a { background:url(images/post-previous-arrow.png) no-repeat; padding-left:32px; display:inline-block; line-height:24px; transition:none; text-indent:-9999px; }
.post-information-container .previous-post a:hover { background-position:0 -44px; color:#94AE01; text-indent:0; }
.post-information-container .previous-post a:active { background-position:0 -88px; text-indent:-9999px; }
.post-information-container .next-post { position:absolute; right:0; top:50%; margin:-13px 0 0 0; }
.post-information-container .next-post a { background:url(images/post-next-arrow.png) no-repeat right 0; padding-right:32px; display:inline-block; line-height:24px; transition:none; text-indent:-9999px; }
.post-information-container .next-post a:hover { background-position:right -44px; color:#94AE01; text-indent:0; }
.post-information-container .next-post a:active { background-position:right -88px; text-indent:-9999px; }



/*-----------------------------------------------------------------------------------*/
/* 9. = Projects Page styling
/*-----------------------------------------------------------------------------------*/

.projects-filters-container { padding:0 0 50px 0; border-bottom:1px solid #CCC; margin:0 auto 50px auto; text-align:center; display:flex; justify-content:center; }
.projects-filters-container .filter-dropdown-container { display:block; margin:0 5px 0 0; position:relative; cursor:pointer; padding:0; width:16.6666%; }
.projects-filters-container .filter-dropdown-container:last-child { margin-right:0; }
.projects-filters-container .filter-dropdown-container .current { font-size:10px; color:#FFF; text-transform:uppercase; height:33px; text-align:left; width:100%; background:#2A2A2A; padding:8px 46px 7px 12px; display:block; margin:0 1px 0 0; position:relative; }
.projects-filters-container .filter-dropdown-container .current.active { color:#B5D500; }
.projects-filters-container .filter-dropdown-container .current:after { content:""; width:33px; height:33px; position:absolute; top:0; right:0; padding:0; background:#2A2A2A url(images/icon-category-arrow.png) no-repeat center center; display:block; border-left:1px solid #FFF; }
.projects-filters-container .filter-dropdown-container:hover .current { background:#1C1C1C; }
.projects-filters-container .filter-dropdown-container:active .current { background:#2A2A2A; }
.projects-filters-container .filter-dropdown-container ul { position:absolute; z-index:-1; left:0; top:33px; width:100%; height:130px; padding:5px 0 0 0; overflow-y:scroll; text-align:left; background:#FFF; border-bottom:3px solid #B5D500; opacity:0; transition:all 0.3s linear; }
.projects-filters-container .filter-dropdown-container li { padding:2px 12px 2px 12px; margin:0; display:block; width:100% !important; color:#383838; font-size:12px; cursor:pointer; float:none !important; border:none !important; }
.projects-filters-container .filter-dropdown-container li.child { padding-left:25px; }
.projects-filters-container .filter-dropdown-container li:hover { background:#B5D500; }
.projects-filters-container .filter-dropdown-container.active ul { z-index:100; opacity:1; }

.project-information-container { text-align:center; position:relative; }
.project-information-container h1 { margin:0 auto 15px auto; max-width:850px; line-height:1; text-transform:uppercase; }
.project-information-container .previous-post { position:absolute; left:0; top:50%; margin:-13px 0 0 0; }
.project-information-container .previous-post a { background:url(images/post-previous-arrow.png) no-repeat; padding-left:32px; display:inline-block; line-height:24px; transition:none; text-indent:-9999px; }
.project-information-container .previous-post a:hover { background-position:0 -44px; color:#94AE01; text-indent:0; }
.project-information-container .previous-post a:active { background-position:0 -88px; text-indent:-9999px; }
.project-information-container .next-post { position:absolute; right:0; top:50%; margin:-13px 0 0 0; }
.project-information-container .next-post a { background:url(images/post-next-arrow.png) no-repeat right 0; padding-right:32px; display:inline-block; line-height:24px; transition:none; text-indent:-9999px; }
.project-information-container .next-post a:hover { background-position:right -44px; color:#94AE01; text-indent:0; }
.project-information-container .next-post a:active { background-position:right -88px; text-indent:-9999px; }
.project-information-container .project-information { margin:0 auto; max-width:850px; color:#000; line-height:1.8 }
.project-information-container .project-information h1 { color:#000; }
.project-information-container .project-information span { display:inline-block; margin:0 5px; }
.project-information-container .project-information a { text-decoration:underline; }

.project-gallery-container { padding:50px 0 0 0; border-top:1px solid #CCC; margin:50px 0 0 0; }
.project-gallery-container .gallery-slider { position:relative; }
.project-gallery-container .slides li { width:100%; }
.project-gallery-container .slides li .content { display:flex; align-items:center; justify-content:center; height:600px; width:100%; }
.project-gallery-container .slides li img { max-height:570px; margin:0 auto 10px auto; }
.project-gallery-container .slides li p { margin:0 auto; width:100%; max-width:600px; font-size:14px; text-align:center; }
.project-gallery-container .flex-direction-nav a { position:absolute; display:block; width:50%; height:100%; top:0; text-indent:-9999px; z-index:10; }
.project-gallery-container .flex-direction-nav a:hover { opacity:0.85; }
.project-gallery-container .flex-direction-nav .flex-prev { background:url(images/portfolio-previous-arrow.png) no-repeat 10% center / auto 30px; left:0; }
.project-gallery-container .flex-direction-nav .flex-next { background:url(images/portfolio-next-arrow.png) no-repeat 90% center / auto 30px; right:0; }
.project-gallery-container .flex-control-nav { position:absolute; bottom:10px; left:0; width:100%; z-index:10; text-align:center; display:none; }
.project-gallery-container .flex-control-nav li { display:inline-block; vertical-align:middle; margin:0 5px; }
.project-gallery-container .flex-control-nav li a { display:block; width:10px; height:10px; border-radius:50%; text-indent:-9999px; background:#88A000; cursor:pointer; }
.project-gallery-container .flex-control-nav li .flex-active { background:#B5D500; }

.related-projects-container { padding:50px 0 0 0; border-top:1px solid #CCC; margin:50px 0 0 0; }
.related-projects-container h2 { text-align:center; margin:0 0 25px 0; text-transform:uppercase; }
.related-projects-container img { margin:0 auto 40px auto; }

.video-container { padding:56.25% 0 0 0; position:relative; margin:0 0 20px 0; }
.video-container iframe { position:absolute; top:0; left:0; width:100%; height:100%; }
.project-content p span { font-weight:700; }



/*-----------------------------------------------------------------------------------*/
/* 10. = About Page styling
/*-----------------------------------------------------------------------------------*/

.approach-item { cursor:pointer; overflow:hidden; }
.approach-item .elementor-widget-wrap { aspect-ratio:1 / 1; }
.approach-item .elementor-widget-wrap:before { position:absolute; top:0; left:0; width:100%; height:100%; content:""; border:2px solid #B5D500; opacity:0; transition:all .3s ease-out; z-index:10; }
.approach-item .elementor-widget-text-editor { position:absolute; top:calc(100% - 80px); height:80px; left:0; width:100%; background:rgba(0,0,0,0.8); display:flex; align-items:start; transition:all .3s ease-out; }
.approach-item .elementor-widget-text-editor h4 { color:#FFF !important; font-size:18px; margin:0 0 10px 0; text-transform:uppercase; }
.approach-item .elementor-widget-text-editor h4:after { content:""; width:50px; height:2px; background:#FFF; display:block; margin:10px auto 0 auto; }
.approach-item .elementor-widget-text-editor .elementor-widget-container { position:relative; z-index:50; }
.approach-item .elementor-widget-text-editor .elementor-widget-container p { opacity:0; transition:all .3s ease-out; }
.approach-item .elementor-widget-text-editor .elementor-widget-container div { opacity:0; transition:all .3s ease-out; }
.approach-item:hover .elementor-widget-wrap:before { opacity:1; }
.approach-item:hover .elementor-widget-text-editor h4:after { background:#B5D500; }
.approach-item.active .elementor-widget-text-editor { top:0; height:100%; align-items:center; }
.approach-item.active .elementor-widget-text-editor .elementor-widget-container p { opacity:1; }
.approach-item.active .elementor-widget-text-editor .elementor-widget-container div { opacity:1; }
.approach-item.active .elementor-widget-text-editor h4:after { background:#B5D500; }

.team-item { cursor:pointer; overflow:hidden; }
.team-item .elementor-widget-wrap { aspect-ratio:1 / 1; }
.team-item .elementor-widget-wrap:before { position:absolute; top:0; left:0; width:100%; height:100%; content:""; border:2px solid #B5D500; opacity:0; transition:all .3s ease-out; z-index:10; }
.team-item .elementor-widget-text-editor { position:absolute; top:calc(100% - 85px); height:85px; left:0; width:100%; background:rgba(0,0,0,0.8); display:flex; align-items:start; transition:all .3s ease-out; }
.team-item .elementor-widget-text-editor h4 { color:#FFF !important; font-size:18px; margin:0 0 4px 0; text-transform:uppercase; }
.team-item .elementor-widget-text-editor .elementor-widget-container { position:relative; z-index:50; }
.team-item .elementor-widget-text-editor .elementor-widget-container p { opacity:0; transition:all .3s ease-out; }
.team-item .elementor-widget-text-editor .elementor-widget-container div { opacity:0; transition:all .3s ease-out; }
.team-item .elementor-widget-text-editor .elementor-widget-container .position { margin:0 auto 5px auto; text-align:center; opacity:1; }
.team-item .elementor-widget-text-editor .elementor-widget-container .position p { margin:0; padding:0 5px; vertical-align:middle; display:inline-block; font-size:14px; opacity:1; }
.team-item .elementor-widget-text-editor .elementor-widget-container .position .divider { vertical-align:middle; display:inline-block; width:20px; height:2px; background:#FFF; transition:all .3s ease-out; opacity:1; }
.team-item .elementor-widget-text-editor .elementor-widget-container a { display:inline-block; margin:10px 0 0 0; color:#B5D500; text-decoration:none; }
.team-item .elementor-widget-text-editor .elementor-widget-container a:hover { color:#91AB00; }

.team-item:hover .elementor-widget-wrap:before { opacity:1; }
.team-item:hover .elementor-widget-text-editor .elementor-widget-container .position .divider { background:#B5D500; }
.team-item.active .elementor-widget-text-editor { top:0; height:100%; align-items:center; }
.team-item.active .elementor-widget-text-editor .elementor-widget-container p { opacity:1; }
.team-item.active .elementor-widget-text-editor .elementor-widget-container div { opacity:1; }
.team-item.active .elementor-widget-text-editor h4:after { background:#B5D500; }
.team-item.active .elementor-widget-text-editor .elementor-widget-container .position .divider { background:#B5D500; }

.no-results-heading { padding:100px 0; text-align:center; }




