/*
Theme Name: Super Power Creative
Description: Child theme for Uncode theme
Author: Undsgn™
Author URI: http://www.undsgn.com
Template: uncode
Version: 1.0.1.0
Text Domain: uncode
*/


:root {
	--theme-color-main: #666600;
	--theme-color-olive: #999966;
}

/* Typography */
@font-face {
	font-family: 'Helvetica Neue';
	src: local('Helvetica Neue Medium'), local('HelveticaNeue-Medium'),
		url('./assets/font/HelveticaNeue-Medium.woff2') format('woff2'),
		url('./assets/font/HelveticaNeue-Medium.woff') format('woff');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Helvetica Neue';
	src: local('Helvetica Neue Light'), local('HelveticaNeue-Light'),
		url('./assets/font/HelveticaNeue-Light.woff2') format('woff2'),
		url('./assets/font/HelveticaNeue-Light.woff') format('woff');
	font-weight: 300;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Helvetica Neue';
	src: local('Helvetica Neue Italic'), local('HelveticaNeue-Italic'),
		url('./assets/font/HelveticaNeue-Italic.woff2') format('woff2'),
		url('./assets/font/HelveticaNeue-Italic.woff') format('woff');
	font-weight: normal;
	font-style: italic;
	font-display: swap;
}

@font-face {
	font-family: 'Helvetica Neue';
	src: local('Helvetica Neue Bold'), local('HelveticaNeue-Bold'),
		url('./assets/font/HelveticaNeue-Bold.woff2') format('woff2'),
		url('./assets/font/HelveticaNeue-Bold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Helvetica Neue';
	src: local('Helvetica Neue'), local('HelveticaNeue'),
		url('./assets/font/HelveticaNeue.woff2') format('woff2'),
		url('./assets/font/HelveticaNeue.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}



/* Menu */
.main-menu-container .menu-cta-inner .menu-item span {
	text-transform: none!important;
}

@media (min-width: 960px){
	#menu-main-navigation .menu-item a:before {
		border-radius: 100vh;
		content: '';
		text-decoration: none;
		transition: transform 0.4s cubic-bezier(0.25, 0.45, 0.4, 1);
		position: absolute;
		width: calc( 100% - 28px );
		height: 0.075em;
		background: currentColor;
		top: 65%;
		left: 14px;
		pointer-events: none;
		
		transform-origin: 100% 50%;
		transform: scale3d(0, 1, 1);
	}

	#menu-main-navigation .menu-item {
		&:first-child a:before {
			width: calc( 100% - 14px );
			left: 0;
		}
		&:last-child a:before {
			width: calc( 100% - 14px );
			left: 14px;
		}
	}
		
	#menu-main-navigation .menu-item a:hover:before{
		transform-origin: 0% 50%;
		transform: scale3d(1, 1, 1);
	}
}


@media (max-width: 959px) {
	body.menu-mobile-off-canvas .main-menu-container {
		width: 100%;
	}
	
	header .menu-container .menu-smart li.menu-item a {
		font-weight: 400!important;
	}
	
	.menu-mobile-off-canvas.menu-mobile-centered .main-menu-container .menu-horizontal .menu-horizontal-inner {
		padding-top: 20vh;
	}
	
	body.open-overlay-menu #main-logo {
		z-index: 1000;
	}
	
	body.open-overlay-menu #main-logo .main-logo.logo-dark {
		position: absolute;
		top: 0;
	}

	body.opening-overlay-menu #main-logo .main-logo.logo-dark {
		opacity: 0;
		transition: 0.5s all ease-in;
	}

	body.open-overlay-menu #main-logo .main-logo.logo-light {
		opacity: 0;
		display: block!important;
		transition: 0.5s all ease-in;
	}

	body.opening-overlay-menu #main-logo .main-logo.logo-light {
		opacity: 1;
		display: block!important;
		transition: 0.5s all ease-in;
	}
	
	.main-menu-container .uncode-menu-additional-text {
		position: absolute;
		bottom: 27px;
	}
	
}



/* Header */
body:not(.menu-force-opacity):not(.navbar-hover) .style-dark-override:not(.is_stuck:not(.menu-desktop-transparent)):not(.is_mobile_open).menu-transparent .menu-horizontal-inner > .nav > .menu-smart > li > a:hover {
	color:#fff!important;
}

.menu-light .menu-smart > .menu-item > a:hover {
	color: #000!important;
}

body:not(.open-overlay-menu) .menu-wrapper.menu-sticky {
	mix-blend-mode: difference;
	z-index: 1000;
}


/* Footer */
.footer-scroll-top i {
	width: 1.5em;
	height: 1.5em;
	line-height: 1.5em;
}

.footer-scroll-top .scroll-top .btn-default {
	background-image:url(./assets/image/copyright_logo_white.svg);
	background-repeat: no-repeat;
	background-size: contain;
	background-color: transparent!important;
	border-color: transparent!important;
}

.footer-scroll-top .scroll-top .btn-default:before {
	display: none;
}


/* General */
.grey-image img {
	filter: grayscale(1);
}

.box-wrapper .main-wrapper .row.row-parent {
	padding-left: var(--uncode-space-2x);
	padding-right: var(--uncode-space-2x);
}


/* : Accordion */
.uncode-accordion {
	.panel-group {
		.panel {		
			.panel-heading {
				
			}
			.panel-collapse {
				&:before {
					border-bottom: 0;
				}
				.panel-body {
					padding-top: 0;
				}
			}
		}
	}
}


@media (max-width: 959px) {
	.main-container .post-wrapper .post-body .post-content .row-container:last-child > .row.exa-bottom-padding {
		padding-bottom: 144px;
	}
	
	.box-wrapper .main-wrapper .row.row-parent {
		padding-left: var(--uncode-space-1x);
		padding-right: var(--uncode-space-1x);
	}
}


/* : Single Media / Video */
.uncode-single-media-wrapper {
	.mejs-video {
		.mejs-inner {
			.mejs-controls {
				display: none;
			}	
		}
	}
}



/* Homepage */
.custom-grid-container.homepage-grid {
	.vc_row .wpb_row {
		.wpb_column {
			.uncell {
				.tmb {
					transition: all 0.3s ease-in-out;
					&:hover {
						transform: scale(1.1);
					}
				}
			}
		}
	}
}


/* Portfolio (Index) */
.hover-zoom-grid .grid-container {
	.tmb {
		.t-inside {
			.t-entry-visual {
				transition: all 0.3s ease-in-out;
				&:hover {
					transform: scale(1.1);
				}
			}
		}
	}
}


/* Portfolio (Single) */
.row-portfolio-info .info-content .detail-container {
	width: 100%;
		padding: 9px 0;
		display: flex;
		border-bottom: 1px solid rgba(255, 255, 255, 1);
}

@media (min-width: 960px){
	.single-portfolio {
		.main-container {
			.vc_row.column-45-55 {
				.row .wpb_row{
					.wpb_column:nth-child(1) {
						width: 45%;
					}
					.wpb_column:nth-child(2) {
						width: 55%;
					}
				}
			}	
		}
	}
}