/*
Theme Name: Rife Free Child
Theme URI: https://apollo13themes.com/rife/free/
Template: rife-free
Author: Apollo13Themes
Author URI: https://apollo13themes.com/
Description: Rife Free is a great portfolio and photography WP theme with 7 ready-to-use demo layouts. It is also perfect for business, blogging websites and for your shop because it is WooCommerce compatible. More cool features in the Rife theme are the: ✓ Writing Effect ✓ One Page Mode ✓ Mobile/Touch Friendly Image & Video Slider ✓ Bricks Gallery for Photographers ✓ Mega Menu ✓ Post Grid ✓ Google Fonts ✓ Hidden Sidebar and many more. Over 450 options to change in the Customizer and much more in each page, post, album or work. We also integrate Schema.org which helps your website be more visible to search engines. Elementor compatibility will help you make your great website even more natural. The theme is RTL and translation-ready (WPML). ★ Check our demos for more details: https://apollo13themes.com/rife/designs/
Tags: e-commerce,portfolio,photography,two-columns,three-columns,left-sidebar,right-sidebar,grid-layout,translation-ready,sticky-post,post-formats,custom-colors,custom-menu,featured-images,footer-widgets,full-width-template,theme-options,threaded-comments,rtl-language-support
Version: 2.4.14.1654619660
Updated: 2022-06-07 16:34:20

*/



/* ==========================================================================
   Header menu horizontal
   ========================================================================== */
.header-horizontal .navigation-bar{
	width: 100%;
	padding: 0 15px;
	position: relative; /* so submenus can be positioned properly */
}
.header-horizontal .top-menu{
	text-align: left;
	font-size: 0;/* no space between items */
}
.header-horizontal .top-menu li {
	white-space: nowrap;
}
/* sub menu mark */
.header-horizontal .top-menu i.sub-mark{
	left: 0;
	height: 100%;
}

/* First level */
.header-horizontal .top-menu > li{
	float: none;
	display: inline-block;
	vertical-align: bottom;
	text-align: right;
}
.header-horizontal .top-menu > li > a,
.header-horizontal .top-menu > li > span.title{
	padding: 0 10px; /* spacing in most top level */
}
.header-horizontal .top-menu.opener-icons-on li.menu-parent-item{
	padding-left: 26px; /* menu opener */
}
.header-horizontal .top-menu.opener-icons-on > li.menu-parent-item > a,
.header-horizontal .top-menu.opener-icons-on > li.menu-parent-item > span.title{
	padding-left: 4px;
}

/* next levels */
.header-horizontal .top-menu ul{
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 250;
	min-width: 200px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.07);
}
.header-horizontal .desktop_menu .top-menu ul{
	visibility: hidden;
	opacity: 0;
	transform: translateY(-50px);
	transition: opacity 0.5s, visibility 0s 0.5s, transform 0.5s;
}
.header-horizontal .desktop_menu .top-menu ul.measure{
	visibility: hidden;
	opacity: 0;
	transition: none;
	display: block;
}
.header-horizontal .desktop_menu .menu-parent-item.open > ul{
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
	transition: opacity 0.5s, transform 0.5s;
}
.header-horizontal .desktop_menu .mega-menu > ul ul{
	visibility: visible;
	opacity: 1;
	transform: none;
}
.header-horizontal .top-menu ul ul{
	top: -30px;
	right: 100%;
	border-top: none;
	margin-top: 0;
}
.header-horizontal .mega-menu > ul ul{
	position: static;
	box-shadow: none;
}
.header-horizontal .top-menu li li{
	padding: 0; /* reset side padding */
}
.header-horizontal .top-menu.opener-icons-on li li.menu-parent-item{
	padding-left: 51px; /* 25px of link side padding + 26px for arrow */
}
.header-horizontal .top-menu li li a,
.header-horizontal .top-menu li li span.title{ /* span.title only to gain color and block */
	line-height: 25px;
	padding: 0 30px;
}
.header-horizontal .top-menu ul i.sub-mark{
	left: 25px;
}

/* submenu opened other way */
.header-horizontal .top-menu ul.otherway{
	right: auto;
	left: 0;
}
.header-horizontal .top-menu ul ul.otherway{
	right: auto;
	left: 100%;
}



/* ==========================================================================
   Header menu vertical
   ========================================================================== */
.header-vertical .top-menu ul{
	padding: 10px 0;
}
.header-vertical .top-menu li a,
.header-vertical .top-menu li span.title{
	min-height: 27px;
	line-height: 27px;
	padding: 0 40px;
}
.header-vertical .top-menu > li.hidden-icon > a,
.header-vertical .top-menu > li.hidden-icon > span.title{
	height: 1.5em; /* so we have height that we can relate to in effects */
}
.header-vertical .top-menu.with-effect > li > a > span,
.header-vertical .top-menu.with-effect > li > span.title > span{
	display: inline-block;
}
/* sub menu mark */
.header-vertical .top-menu i.sub-mark{
	left: 14px;
}

/* next levels */
.header-vertical .top-menu li li a,
.header-vertical .top-menu li li span.title{ /* span.title only to gain color and block */
	min-height: 17px;
	line-height: 17px;
}
.header-vertical .top-menu li li i.sub-mark{
	height: 17px;
	line-height: 17px;
}
.header-vertical .top-menu li li li a,
.header-vertical .top-menu li li li span.title{ /* span.title only to gain color and block */
	padding-right: 50px;
}

/********/
/* MEGA MENU STYLE */
.header-vertical .mega-menu > ul{
	right: 100%;
	top: 0;
}
.header-vertical .top-menu .mega-menu li a,
.header-vertical .top-menu .mega-menu li span.title{
	padding: 0 30px;
	line-height: 25px;
}
.header-vertical .mega-menu > ul ul{
	padding: 0 0 30px;
}



/* ==========================================================================
   Logo
   ========================================================================== */
a.logo{
	display: block;
	max-width: 200px;
	word-wrap: break-word;
	white-space: nowrap;
	padding: 10px 0;
	opacity: 1;
	vertical-align: middle;
	background: transparent 50% 50% no-repeat;
	background-size: contain;
	background-origin: content-box;
	transition: max-width .5s, padding .5s, color .5s, opacity .5s;
}
a.logo img{
	opacity: 0;/* we have image so its display when no styles are applied */
	width: 100%;
	height: auto;
	display: block;
}
a.logo.text-logo{
	/* reset user.css styles */
	background-image: none;
	height: auto;
	line-height: 40px; /* min height of header part */
}
a.logo.image-logo{
	/* reset user.css styles */
	font-size: 0;
}
/* SVG logos */
.svg-logo .scaling-svg{
	display: block;
	width: 100%;
	height: 0;
	padding: 0;
	position: relative;
}
.svg-logo svg{
	position: absolute;
	top: 0;
	right: 0;
	max-width: 100%;
	width: 100%;
}
a.logo.svg-logo{
	background: none!important;
}

a.hidden-logo{
	clip: rect(1px, 1px, 1px, 1px);
	height: 1px;
	overflow: hidden;
	position: absolute !important;
	width: 1px;
	opacity: 0;
}



/* ==========================================================================
   Header vertical
   ========================================================================== */
.header-vertical #header{
	position: absolute;
	top: 0;
	right: 0;
	width: 280px;
	min-height: 100%;
	color: #000;
	z-index: 9;/* below footer */ /* bg-color is for hover, rest for "to-move" class */
	transition: transform .5s, background-color .5s;
}
.header-vertical.site-layout-bordered #header{
	margin-top: 30px;
	margin-left: 30px;
	margin-bottom: 30px;
}
.header-vertical.site-layout-bordered.no-border-left #header{margin-left: 0; }
.header-vertical.site-layout-bordered.no-border-top #header{ margin-top: 0; }
.header-vertical.site-layout-bordered.no-border-bottom #header{ margin-bottom: 0; }

.header-vertical #header.stick_to_bottom,
.admin-bar.header-vertical #header.stick_to_bottom{
	position: fixed;
	bottom: 0;
	top: auto;
}
.header-vertical #header.stick_to_top{
	position: fixed;
	bottom: auto;
	top: 0;
}
.admin-bar.header-vertical #header{
	top: 32px;
}
.header-vertical.site-layout-bordered.no-border-bottom.no-border-top #header{
	min-height: 100%;
}
.header-vertical.site-layout-bordered.no-border-top #header,
.header-vertical.site-layout-bordered.no-border-bottom #header{
	min-height: calc(100% - 30px);
}
.header-vertical.site-layout-bordered #header{
	min-height: calc(100% - 60px);
}

.admin-bar.header-vertical #header,
.admin-bar.header-vertical.site-layout-bordered.no-border-bottom.no-border-top #header{
	min-height: calc(100% - 32px);
}
.admin-bar.header-vertical.site-layout-bordered.no-border-top #header,
.admin-bar.header-vertical.site-layout-bordered.no-border-bottom #header{
	min-height: calc(100% - 62px);
}
.admin-bar.header-vertical.site-layout-bordered #header{
	min-height: calc(100% - 92px);
}
.header-vertical .logo-container .logo{
	display: inline-block;
}
.header-vertical .logo-container .logo.svg-logo{
	width: 200px;
}
.header-vertical #header-tools{
	padding: 0 30px 0 40px;
	margin-top: 20px;
}
.header-vertical #mid{
	padding: 0 280px 0 0;
}
.header-vertical #header.scrollable-menu{
	position: absolute;
}
.header-vertical .navigation-bar{
	position: relative;
}
.header-vertical .logo-container{
	padding: 0 40px;
}
.header-widgets{
	padding: 0 40px;
}

.header-vertical #header.centered,
#header.centered .widget h3.title{
	text-align: center;
}

/* vertical mid */
.header-vertical .variant-content_in_mid .navigation-bar{
	display: table;
	width: 100%;
}
.variant-content_in_mid div.menu-container{
	display: table-cell;
	vertical-align: middle;
}



/* ==========================================================================
   Header vertical variant right
   ========================================================================== */
/* GENERAL LAYOUT */
.header-side-right.header-vertical #header{
	left:  auto;
	right: 0;
}
.header-side-right.header-vertical.site-layout-bordered #header{
	margin-left: 0;
	margin-right: 30px;
}
.header-side-right.header-vertical.site-layout-bordered.no-border-right #header{
	margin-right: 0;
}
.header-side-right #mid{
	padding: 0 280px 0 0;
}

/* HEADER MENU */
.header-side-right .mega-menu > ul{
	left: auto;
	right: 100%;
}



/* =============================================================================
   Header horizontal general
   ========================================================================== */
.header-horizontal #header{
	width: 100%;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 11;/* above footer */ /* bg-color is for hover, rest for "to-move" class */
	transition: transform .5s, background-color .5s;
}
.header-horizontal #header.no-fixed,
.header-horizontal #header.default-sticky{/* overwritten in JS */
	position: absolute;
}
.mobile-menu-open.header-horizontal #header.default-sticky{
	position: fixed;
	/* if we are at top of page we don't want header to jump around while scrolling down */
}
#header.a13-horizontal{ /* removed from above rules too be easier overwritten */
	border-bottom: 1px solid #E5E5E5;
}

.admin-bar.header-horizontal #header{
	margin-top: 32px;
}
.header-horizontal #header .head{
	padding: 0 40px;
	margin: 0 auto;
	width: 100%;
	box-sizing: border-box;
}
.header-horizontal #header.narrow-header{
	max-width: 1240px;
	right: 50%;
	-webkit-transform: translateX(50%);
		-ms-transform: translateX(50%);
			transform: translateX(50%);
}
#header.narrow .head,
#header.narrow .top-bar{
	max-width: 1240px;
}
.header-horizontal .logo-container{
	transition:  max-width .5s, min-width .5s;
}
.header-horizontal .logo-container,
.header-horizontal .navigation-bar,
.header-horizontal #header-tools,
.header-horizontal header .socials {
	display:        table-cell;
	vertical-align: middle;
}
.header-horizontal #header-tools,
.header-horizontal header .socials {
	white-space: nowrap;
	text-align: left;
}
.header-horizontal #header-tools{
	padding-left: 15px;
}
.header-horizontal #header-tools::before,
.header-horizontal .head .socials::before{
	content: "";
	display: inline-block;
	height: 25px;
	width: 1px;
	background-color: #E5E5E5;
	margin-left: 15px;
	vertical-align: middle;
}
.header-horizontal .head .socials a{
	vertical-align: middle;
}

/* STICKY HEADER */
#header.sticky-values{
	box-shadow: 0 0 12px rgba(0, 0, 0, 0.09);
}
.header-horizontal #header.sticky-hide,
.header-horizontal #header.hide-until-scrolled-to{
	-webkit-transform: translateY(-102%);
		-ms-transform: translateY(-102%);
			transform: translateY(-102%);
	/* 102% cause it leaves one pixel behind when doing 3d transforms */
}
.mobile-menu-open.header-horizontal #header.sticky-hide{
	-webkit-transform: none !important;
		-ms-transform: none !important;
			transform: none !important;
	/* it makes sure menu will not run away while scrolling on mobile menu */
}
.site-layout-bordered.header-horizontal #header{
	top: 30px;
	right: 30px;
	left: 30px;
	width: auto;
}
.no-border-top.header-horizontal #header{ top: 0; }
.no-border-right.header-horizontal #header{right: 0; }
.no-border-left.header-horizontal #header{left: 0; }

/* narrow overwrites */
.header-horizontal #header.narrow-header{
	right: 50%;
	-webkit-transform: translateX(50%);
		-ms-transform: translateX(50%);
			transform: translateX(50%);
}
.header-horizontal #header.sticky-hide.narrow-header,
.header-horizontal #header.hide-until-scrolled-to.narrow-header{
	-webkit-transform: translate(50%, -102%);
		-ms-transform: translate(50%, -102%);
			transform: translate(50%, -102%);
	/* 102% cause it leaves one pixel behind when doing 3d transforms */
}
.site-layout-bordered.header-horizontal #header.narrow-header{
	width: 100%;
	left: auto;
}
.no-border-right.header-horizontal #header.narrow-header,
.no-border-left.header-horizontal #header.narrow-header{
	/* not fully supported, as no one should use such configuration */
	left: 50%;
	right: auto;
}

/* header scrollable menu */
.header-horizontal #header.scrollable-menu{
	position: absolute !important;/* so it overwrites any inline style for hiding sticky header */
}



/* =============================================================================
   Header horizontal variants
   ========================================================================== */
/* ONE LINE */
.header-type-one_line .head{
	display: table;
}


/* ONE LINE MENU CENTERED */
.header-variant-one_line_menu_centered .top-menu{
	text-align: center;
}


/* ONE LINE LOGO CENTERED */
.header-variant-one_line_centered .socials-cell,
.header-variant-one_line_centered .tools-cell{
	width: 15%;
	display: table-cell;
	vertical-align: middle;
}
.header-variant-one_line_centered .tools-cell{
	text-align: left;
}
.header-variant-one_line_centered #header-tools,
header.header-variant-one_line_centered .socials{
	white-space: normal;
	padding: 0;
	display: block;
}
header.header-variant-one_line_centered .socials{
	text-align: right;
}
.header-variant-one_line_centered #header-tools::before,
.header-variant-one_line_centered .head .socials::before {
	display: none;
}
.header-variant-one_line_centered .menu-cell{
	width: 70%;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	position: relative;
}
.header-variant-one_line_centered .navigation-bar{
	display: block;
	box-sizing: border-box;
	/* for JS operation */
	transition: min-height .5s;
}
.header-variant-one_line_centered .logo-container{
	display: block;
	max-width: 200px;
	z-index: 1;
	position: absolute;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
			transform: translateX(-50%);
}
.header-variant-one_line_centered .logo-container a.logo{
	margin: 0 auto;
}
.header-variant-one_line_centered .menu-cell .top-menu{
	width: calc(50% - 100px);
	float: right;
	text-align: left;
	/* for JS operation */
	transition: width .5s, line-height .5s;
}
.header-variant-one_line_centered .menu-cell .right-part{
	float: left;
	text-align: right;
}
.header-variant-one_line_centered .top-menu > li,
.header-variant-one_line_centered .top-menu > li > a,
.header-variant-one_line_centered .top-menu > li > span.title{
	line-height: inherit;
}


/* ONE LINE LOGO CENTERED WITH SHIELD  */
.header-variant-one_line_centered .logo-container.shield{
	transition: max-width .5s, min-width .5s, transform .5s;
}
.header-variant-one_line_centered .logo-container .scaling-svg-container{
	width: 100%;
	height: 0;
	padding: 0;
	padding-bottom: 125.6%;
	z-index: -1;
	position: absolute;
	top: 0;
	right: 0;
}
.header-variant-one_line_centered .logo-container > .scaling-svg-container svg{
	width: 100%;
	height: auto;
	position: absolute;
	top: 0;
	right: 0;
}
.header-variant-one_line_centered.with-shield .top-menu > li > a,
.header-variant-one_line_centered.with-shield .top-menu > li > span.title{
	padding-top: 20px;
	padding-bottom: 20px;
	/* below are needed for "show icons" Hover effect of menu */
	height: 25px; /* so icons will move properly in FireFox */
	line-height: 25px; /* text aligned with icons */
}


/* MULTI LINE */
#header.header-type-multi_line.narrow .head{
	max-width: none;
}
#header.header-type-multi_line.narrow .top-head{
	max-width: 1240px;
	margin: 0 auto;
}
#header.header-type-multi_line .head{
	padding: 0;
	display: block;
}
.header-type-multi_line .top-head{
	width: 100%;
	padding: 0 340px;
	box-sizing: border-box;
	position: relative;
	min-height: 40px;
}
.header-type-multi_line .bottom-head{
	padding: 0 40px;
	border-color: #E5E5E5;
	border-top: 1px solid;
}
/*noinspection CssOptimizeSimilarProperties*/
.header-type-multi_line.header-variant-menu_above .bottom-head{
	/* not optimized cause color is set in user.css */
	border-top: none;
	border-bottom-style: solid;
	border-bottom-width: 1px;
}
.header-type-multi_line .logo-container{
	display: block;
	text-align: center;
}
.header-type-multi_line a.logo{
	margin: auto;
}

.header-type-multi_line .navigation-bar,
.header-type-multi_line #header-tools,
.header-type-multi_line .head .socials{
	display: block;
}
.header-type-multi_line #header-tools,
.header-type-multi_line .head .socials{
	position: absolute;
	padding: 0;
	left: 40px;
	top: 50%;
	-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
			transform: translateY(-50%);
}
.header-type-multi_line .head .socials{
	left: auto;
	right: 40px;
}
.header-type-multi_line #header-tools::before,
.header-type-multi_line .head .socials::before{
	display: none;
}
.header-type-multi_line.narrow .navigation-bar{
	max-width: 1160px;
	margin: 0 auto;
}
.header-type-multi_line .top-menu{
	text-align: center;
}
.header-type-multi_line .top-menu > li > a,
.header-type-multi_line .top-menu > li > span.title{
	line-height: 40px;
	height: 40px;
	min-height: 40px;
}


/* ==========================================================================
   独自
   ========================================================================== */