/*
Theme Name: House of Youth Theme
Theme URI: http://example.com/page-builder-framework/
description: >-
  Page Builder Framework Theme
Author: Natthan Senteni
Author URI: http://example.com
Template: page-builder-framework
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
Text Domain: page-builder-framework
*/

/*Menu*/

#content {
	margin-top: -12.1vw;
}

.wpbf-logo {
	padding:2% 0;
}

.wpbf-navigation {
	background-color:transparent;
	border-bottom:solid 1px;
	mix-blend-mode:difference;
	color:#fff !important;
}

.wpbf-navigation .wpbf-logo-container {
	width:95% !important;
	text-align:center;
	border-right:solid 1px;
}

.wpbf-navigation .wpbf-logo-container img {
	width:90%;
}

/*Hamburger Menu*/

.wpbff-hamburger {
	transform:rotate(-90deg);
	transition:150ms linear;
	padding-bottom:1vw !important;
}

.wpbf-menu-container:hover {
	background-color:#000;
	transition:150ms linear;
	
}

.wpbf-menu-container:hover .wpbff-hamburger {
	color:#fff !important;
}

.wpbff-hamburger:before {
	font-family:AauxPro-Light;
	content:"menu";
	text-transform:uppercase;
}

/*Menu interaction*/

.wpbf-menu-full-screen.wpbf-visible-large {
	display:block !important;
	transform:translateY(120%);
	transition:transform 300ms linear;
	opacity:1 !important;
	will-change: transform;
	max-width:100vw;
}

.wpbf-menu-full-screen.wpbf-visible-large.active {
	opacity:1 !important;
	transform:translateY(0);
	transition:transform 300ms linear;
}

#menu-main-menu li:hover a{
	text-decoration:underline;
	text-decoration-thickness: 2px;
}

.menu-item a{
	transform:translateY(100%);
	transition:transform 100ms linear;
	line-height:1.2;
}

.wpbf-visible-large.active .menu-item a,
.wpbf-mobile-menu-container.active a{
	transform:translateY(0);
	transition:transform 200ms linear;
}

.wpbf-visible-large.active .menu-item:nth-child(1) a
{
	transition-delay:150ms;
}

.wpbf-visible-large.active .menu-item:nth-child(2) a {
	transition-delay:300ms;
}

.wpbf-visible-large.active .menu-item:nth-child(3) a {
	transition-delay:450ms;
}

.wpbf-visible-large.active .menu-item:nth-child(4) a {
	transition-delay:600ms;
}

.wpbf-visible-large .fl-module-hy-info-bar {
	position:absolute;
	bottom:40px;
	color:#fff;
}


.wpbf-visible-large .fl-builder-content-1342 {
    max-width:100%;
}

/*Full Screen Menu*/
.fullscreenMenuLogo {
	width:3%;
}

.wpbf-menu-full-screen .wpbf-menu {
	top:325px;
	left:400px;
	text-align:left;
}

.menu-item {
	overflow:hidden;
}

.wpbff-times:before {
	font-size:30px;
}

#menu-main-menu li:hover {
	text-decoration:underline;
	text-decoration-thickness: 2px;
}

/* New Menu */
.custom-menu-class {
	text-align:right;
	position:absolute;
	bottom:15%;
	right:5%;
	font-family:AauxPro-Regular;
	font-weight:700;
}

.custom-menu-class a {
	color:#fff;
	padding:5px;
}

.custom-menu-class a:hover {
	color:#000;
	background-color:#fff;
}

.custom-menu-class .menu-item {
	margin-bottom:5px;
}

/*Typography & Styling*/ 

#header .fl-module-hy-info-bar {
	width:100%;
}

h3 a {
	display:block;
}

.uppercase {
	text-transform:uppercase !important;
}

.borderTop {
	border-top:solid 1px;
}

.borderBottom {
	border-bottom:solid 1px;
}

.bottomAligned {
	align-content: flex-end;
	flex: 1;
	display: grid;
}

.colorBlend,
.colorBlend a,
.colorBlend h2,
.colorBlend h3 {
	color:#fff;
	mix-blend-mode:difference;
}

.CTAVideo a.contactCTA {
	font-size:1vw !important;
	text-decoration:underline;
	text-decoration-thickness:2px;
}

.fl-post-feed .fl-post-feed-more, .fl-post-grid .fl-post-grid-more,
.cta {
	transition:200ms;
	font-size:12px;
	text-transform:uppercase;
	font-family:AauxPro-Regular;
}

.fl-post-feed:hover .fl-post-feed-more, .fl-post-grid:hover .fl-post-grid-more,
.ctaSection:hover .cta,
.cta:hover,
.hy-project-gallery .project-wrapper:hover .cta{
	background-color:#000;
	color:#fff;
	padding-left:5%;
	transition:200ms;
} 

.ctaSection:hover .cta a,
.cta:hover a{
	color:#fff;
}

.hy-archives table {
	font-size:calc(1vw);
}

li.lang-item {
	font-size:12px;
}

#wpbf-menu-toggle {
	color:#fff !important;
}

.wpbf-menu-full-screen.wpbf-visible-large .wpbf-menu a {
	font-size:80px;
}

.wpbf-menu-full-screen.wpbf-visible-large .wpbf-menu a {
	color:#fff;
}

p {
	margin-bottom:0;
}

h3 {
	font-size:4vw !important;
}

.projectPageInfo p {
	margin-top:2%;
}

/*Infinite Scroll*/ 

.infiniteScrollSection::-webkit-scrollbar {
  display: none;
}

.infiniteScrollSection {
	height:100vh;
	overflow:scroll;
	  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

/*Content*/

.full-screen .fl-col-content {
	max-height:100vh;
	overflow:hidden;
}

.pageLinksBoxes .fl-col {
	overflow:hidden;
}

.pageLinksBoxes .fl-col:hover {
	background-color:#000;
}

.pageLinksBoxes .fl-col:hover a {
	color:#fff;
}

.pageLinksBoxes .discover {
	transform:translate(-50%,12vh);
	color:#fff;
}

.pageLinksBoxes .fl-col:hover .discover {
	transform:translate(0,12vh);
	transition:transform 300ms;
}

.singlePost .fl-post-grid-content p, .singlePost .fl-post-grid-content a {
	padding:10px 0 10px 20px
}

.singlePost .fl-post-grid-title,
.fullWidthPost .fl-post-feed-header {
	display:none;
}

.singlePost .fl-post-grid-more {
	border-top:solid 1px;
	border-bottom:solid 1px;
	display:block;
}

.fl-post-feed-more:hover, .fl-post-grid-more:hover {
	background-color:#000;
	color:#fff;
	will-change:background;
}

.fl-post-grid-text {
	padding:0 !important;
}


.fl-post-grid-post .fl-post-grid-image {
	overflow:hidden;
	border-bottom:solid 1px;
}

.fl-post-grid-post .fl-post-grid-image:hover img,
.hy-project-gallery .projects:hover img,
.hy-multi-post img {
	transform:scale(105%);
	transition:transform 200ms linear;
}

/*Project Pages*/

.projectPageInfo .left p {
	border-bottom:solid 1px;
	padding:0 0 2% 5%;
}

.projectPageInfo .left p:nth-last-child(1) {
	margin-bottom:0;
	border:none;
}

/*Marquee*/ 
.marquee{
	font-size:200px;
	text-transform:uppercase;
	white-space: nowrap;
  	overflow: hidden;
 	box-sizing: border-box;
	color:#000;
}

.marquee span {
    display: inline-block;
    animation: marquee 15s linear infinite;
}
@keyframes marquee {
    0%   { transform: translate(0, 0); }
    100% { transform: translate(-100%, 0); }
}

.marqueeTwo {
   animation-delay: 7.5s;
}

/*Mobile*/
@media (max-width: 1000px) {
	
	.wpbf-navigation {
	mix-blend-mode:normal;
	color:#000 !important;
}
	
	.CTAVideo a.contactCTA {
		font-size:4vw !important;
	}
	
	.fl-post-grid .fl-post-column {
		padding:0 !important;
	}
	
	.hy-archives table {
	font-size:calc(6px + 1vw);
}
	
	.fl-row-bg-video .fl-bg-video iframe, .fl-row-bg-embed .fl-bg-embed-code iframe {
		min-width:100vw;
	}
	
	#content {
		margin-top:0;
	}
	
	.fl-row-bg-embed {
		overflow:hidden;
		height:56.25vw;
		border-bottom:solid 1px;
	}
	
	.fl-bg-embed-code iframe {
		width:100%;
		min-width:100% !important;
		top:28vw !important;
	}
	
	.wpbf-mobile-logo {
		padding:0 10%;
		transform:translateX(10%);
	}
	
	.wpbf-mobile-logo a {
		margin:0;
	}
	
	.wpbf-mobile-menu-container .menu-item a {
		transition:300ms linear;
	}
	
	.wpbf-mobile-menu-container.active .menu-item:nth-child(1) a
{
	transition-delay:150ms;
}

.wpbf-mobile-menu-container.active .menu-item:nth-child(2) a {
	transition-delay:300ms;
}

.wpbf-mobile-menu-container.active .menu-item:nth-child(3) a {
	transition-delay:450ms;
}

.wpbf-mobile-menu-container.active .menu-item:nth-child(4) a {
	transition-delay:600ms;
}
	
	.fl-col-small:not(.fl-col-small-full-width) {
    max-width: 100vw; 
}
	.wpbf-mobile-menu-toggle {
		transform:none;
		margin-right:10px;
		font-size:24px !important;
	}
	
	.wpbf-mobile-menu-toggle:before {
	content: "";
		font-family: "page-builder-framework" !important;
}
	.wpbf-close:before {
		font-size:4vw;
	}
	
	#mobile-navigation {
		margin:10vh 5vw;
	}
	
#mobile-navigation .wpbf-mobile-menu > .current-menu-item > a {
		text-decoration:underline;
		text-decoration-thickness:1px;
	}
	
	.wpbf-mobile-menu-container .custom-menu-class {
		bottom:5%;
		font-size:16px;
	}
	
	.wpbf-mobile-menu-container .fullscreenMenuLogo{
		width:8vw;
		top:20px;
		left:3%;
		position:absolute;
	}
	
	.wpbf-mobile-menu-off-canvas .wpbf-close {
		left:85%;
	}
	
	.wpbf-inner-footer-left img {
		display:none;
	}
	/*This is for the three boxes on the home page who turn to black on hover and reveal the word "learn"*/
	.mobile .discover {
		color:#000;
		transform:none;
		font-size:12px !important;
		font-family:Aauxpro-Regular;
		font-weight:700;
	}
}