/*
Theme Name: Syo
Text Domain: syo
Version: 1.2
Requires at least: 4.7
Requires PHP: 5.2.4
Description: Simple wordpress theme
Author: the WordPress team
Author URI: http://syoware.com/
Theme URI: http://syoware.com/

*/

/*===========================
    1. COMMON css 
===========================*/
/* @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@100;300;400;500;700;900&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Jost:ital,wght@0,100..900;1,100..900&display=swap');

body { font-family: "Jost", sans-serif; font-style: normal; background: #fff; color: #0c0c0c; font-size: 16px; }
img { max-width: 100%; }
a:focus, input:focus, textarea:focus, button:focus { text-decoration: none; outline: none; background: none; }
a:focus, a:hover { text-decoration: none; }
h1, h2, h3, h4, h5, h6 { font-family: "Jost", sans-serif; font-weight: normal; color: $heading-color; margin: 0px; }
h1 { font-size: 32px; }
h2 { font-size: 28px; }
h3 { font-size: 22px; }
h4 { font-size: 18px; }
h5 { font-size: 16px; }
h6 { font-size: 16px; }
ul, ol { margin: 0px; padding: 0px; list-style-type: none; }
p { color: rgb(0 26 64 / 69%); margin: 0px 0px 20px; font-family: "Jost", sans-serif; }
.pt-20 { padding: 20px 0px; }
.pt-25 { padding: 25px 0px; }
.pt-30 { padding: 30px 0px; }
.pt-35 { padding: 35px 0px; }
.pt-40 { padding: 40px 0px; }
.pt-45 { padding: 45px 0px; }
.pt-50 { padding: 50px 0px; }
.pt-55 { padding: 55px 0px; }
.pt-60 { padding: 60px 0px; }
.pt-65 { padding: 65px 0px; }
.pt-70 { padding: 70px 0px; }
.pt-75 { padding: 75px 0px; }
.pt-80 { padding: 80px 0px; }
.pt-85 { padding: 85px 0px; }
.pt-90 { padding: 90px 0px; }
.pt-95 { padding: 95px 0px; }
.pt-100 { padding: 100px 0px; }

/* * {padding: 0; margin: 0;color: #001a40b0;} */
a, a:link, a:active, a:visited { color: #444244; text-decoration: none; }
a:hover, a.active, .active a { color: #444244; }
.none { display: none; }
em { font-style: italic; }
img.alignnone { display: block; margin-bottom: 10px; }
img.alignleft { float: left; margin: 0em 1em 0.5em 0; }
img { height: auto; max-width: 100%; }
img.alignright { float: right; margin: 0 0 0.5em 1em; }
img.aligncenter { display: block; margin-left: auto; margin-right: auto; margin-bottom: 10px; }
.white-text h1, .white-text h2, .white-text h3, .white-text h4, .white-text h5, .white-text p, .white-text { color: #fff; }
::placeholder { color: rgba(0, 0, 0, 0.5); opacity: 1; }
:-ms-input-placeholder { color: rgba(0, 0, 0, 0.5); }
::-ms-input-placeholder { color: rgba(0, 0, 0, 0.5); }
.col-3 .elementor-element .elementor-element { width: 33%; margin-bottom: 20px; }
.col-3 .elementor-element .elementor-element .elementor-widget-container { margin: 0 10px; padding: 2px; height: 100%; }
.col-4 .elementor-element .elementor-element { width: 25%; margin-bottom: 20px; }
.col-4 .elementor-element .elementor-element .elementor-widget-container { margin: 0 10px; padding: 2px; height: 100%; }
.col-5 .elementor-element .elementor-element { width: 20%; margin-bottom: 20px; }
.col-5 .elementor-element .elementor-element .elementor-widget-container { margin: 0 10px; padding: 2px; height: 100%; }
.col-6 .elementor-element .elementor-element { width: 16.6%; margin-bottom: 20px; }
.col-6 .elementor-element .elementor-element .elementor-widget-container { margin: 0 10px; padding: 2px; height: 100%; }

.header .logo a { display: block; }
#main-content .btn:hover, #main-content .btn:focus, #main-content  .btn:active { color: #0077b4; }
.btn:hover:before, .btn:focus:before, .btn:active:before { -webkit-transform: scaleX(1); transform: scaleX(1); }
.flex-row { display: flex; }
.header .logo img { width: 300px; }
#main-menu ul { margin: 0; }
.top-space h1 { margin: 0; font-size: 42px; }
.top-space.has-img { padding-top: 0; }
.header .container { display: flex; justify-content: space-between; }

/*.top-space.has-img .title-wrap { position: absolute; z-index: 3; width: 100%; top: 40%; text-align: center; }
.top-space.has-img .title-wrap h1 { display: inline-block; background: #000000a1; padding: 16px 40px; color: #fff; font-weight: 300; font-size: 60px; }*/
.top-space.has-img { min-height: 500px; position: relative; }
.top-space.has-img .featured-thumbnail { max-height: 500px; min-height: 500px; overflow: hidden; display: flex; justify-content: center; flex-direction: column; text-align: center; }
.top-space.has-img .featured-thumbnail img { object-fit: cover; object-position: center; }
.top-space.has-img .title-wrap { background: #0000005c; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; flex-direction: column; text-align: center; }
.container { width: 90%; }
#site-content { min-height: 600px; padding-top: 76px; }
.home #site-content { padding-top: 0; }
.featured-thumbnail img { width: 100%; height: auto; }
#main-container.left-side #left-sidebar { width: 25%; float: left; min-height: 100px; }
#main-container.left-side #left-sidebar .widget-area { margin-right: 40px; }
#main-container.left-side #main-content { width: 70%; float: left; }
#main-container.right-side #right-sidebar { width: 25%; float: left; min-height: 100px; }
#main-container.right-side #right-sidebar .widget-area { margin-left: 40px; }
#main-container.left-side #main-content, #main-container.right-side #main-content { width: 75%; float: left; min-height: 400px; }
#main-container.right-side.left-side #main-content { width: 50%; float: left; }
#footer-container .sub-wrapper { padding: 20px 0; }
.clear { clear: both; }
.sidenav-trigger { cursor: pointer; width: 40px; float: right; }
.sidenav-trigger span { display: none; }
.sidenav-trigger hr { border: none; display: block; background: #333; height: 2px; width: 40px; }
#footer { color: #fff; padding: 40px 0; clear: both; }
#footer a { color: #fff; }
#footer .container { display: flex; flex-wrap: wrap; }
#footer .container .widget { padding: 10px 20px; }
#footer h3 { font-size: 20px; margin: 0 0 10px; }
#back-top { display: none; }
#copyright-wrapper { background: #000; color: #fff; text-align: center; padding: 12px 0; }
#copyright-wrapper a { color: #fff }
#copyright-wrapper p { margin: 0; }
ul.dot li { padding: 2px; padding-left: 30px; position: relative; }
ul.dot li:before { content: ''; display: block; width: 6px; height: 6px; background: #6b6b6b; position: absolute; top: 11px; left: 13px; border-radius: 50%; }

#navigation ul >li { line-height: normal; }
#navigation ul >li >ul a { color: #333; line-height: normal; border-bottom: 1px solid #e9e9e9; height: auto; padding: 14px 20px; }



/*------- Main title ------*/
.top-space { min-height: 180px; background: #691312; display: flex; justify-content: center; flex-direction: column; text-align: center; /* background: #f2f2f2 url(assets/images/hero-bg-2.png) no-repeat ; background-size: cover; */ }
.top-space h1 { font-size: calc(12px + 2vw); font-weight: 500; color: #fff; }

/*---button-hover----*/
.btn { background: none; box-shadow: none; border: 1px solid #000; border-radius: 0; font-weight: 500; position: relative; display: inline-block; -webkit-transform: translateZ(0); transform: translateZ(0); overflow: hidden; }
.btn:hover { background: none; box-shadow: none; color: #fff; border: 1px solid #518432; }
.btn:before { content: ""; position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; background: #518432; -moz-transition: all .4s ease; transition: all .4s ease; transform: translate(0px, -40px); }
.btn:hover:before { transform: translate(0px, 0px); }
#main-content { padding-top: 40px; }
#main-container.right-side #right-sidebar { padding-top: 40px; }
#footer h3.widget-title { font-size: 16px; }
#footer h3.widget-title:after { content: ''; display: block; height: 1px; width: 60px; background: #000; margin-top: 10px }
#footer ul li a { display: block; padding: 6px 0; }






/* ========== elementor =========*/

.overlaytext .elementor-image-box-img, .overlaytext .elementor-image-box-img img { display: block !important; }
.overlaytext .elementor-image-box-wrapper { position: relative; }
.overlaytext .elementor-image-box-content { background: rgb(0 0 0 / 30%); position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; justify-content: center; flex-direction: column; text-align: center; }
.overlaytext .elementor-widget-image-box .elementor-image-box-content { padding: 0px 25%; }
.overlaytext .elementor-image-box-img { max-height: 300px; overflow: hidden; display: flex; flex-flow: row nowrap; justify-content: stretch; align-items: flex-end; }
.overlaytext .elementor-image-box-img img { object-fit: cover; object-position: left; min-width: 100%; height: auto; min-height: 100%;border-radius: 0; }
.overlaytext .elementor-image-box-content h3, .overlaytext .elementor-image-box-content p { max-width: 600px; margin: 0 auto }
.overlaytext .elementor-image-box-content h3 { margin-bottom: 16px; font-size:52px; line-height:normal; }





/* -------- Responsive --------*/
@media (min-width:740px) { }
@media (min-width:992px) {
	.header { position: absolute; z-index: 99; width: 100%; top: 0; left: 0; }
	body.fixed-header .header { position: fixed; }
	body.fixed-header .header .logo img { width: 300px; }
	body.fixed-header #navigation #main-menu { margin: 0; }
	body.fixed-header .header { padding: 4px 0px; }
	body.fixed-header #wpadminbar + .header { top: 30px; }

	/*	.top-space.has-img { height: 100vh; overflow-y: hidden; position: relative; }*/
	.header .sidenav-trigger { display: none; }
	.header .sidenav { position: relative; -webkit-transform: none !important; transform: none !important; left: auto; height: auto; background: none; width: auto !important; box-shadow: none; padding: 0; overflow: visible; }

	/*	.header { position: fixed; width: 100%; top: 0; left: 0; z-index: 9; } */
	.header { padding: 10px 0px; }
	body.admin-bar .header { top: 32px; }
	body.elementor-template-full-width.elementor-editor-active  .header { position: relative; top: 0; }
	.header .sidenav li>a { font-size: 18px; padding: 0 20px; color:#fff; font-weight:normal; }
	.sidenav li>a:hover { background: none; }
	#navigation ul >li { position: relative; }
	#navigation ul >li >ul { position: absolute; background: #fff; width: 230px; top: 48px; left: 0; display: none; -webkit-box-shadow: 0 19px 35px rgba(0, 0, 0, .11); box-shadow: 0 19px 35px rgba(0, 0, 0, .11); }
	#navigation ul >li:hover >ul { display: block; }
	#navigation ul >li >ul a { color: #333; }
	#slide-out { float: right; }
	#main-menu ul { display: flex; }
	#navigation #main-menu { display: flex; }
	#navigation #main-menu ul li >ul { left: 228px; top: 0; }
	#footer .container .widget { flex: 1; }
}
@media(max-width:992px) {
	#navigation .subarrow { width: 50px; height: 50px; display: block; position: absolute; top: -1px; right: 0; z-index: 9; cursor: pointer; background: #eee; }
	#navigation ul li { position: relative; }
	#navigation ul li >ul { display: none; }
	#navigation  li.show > ul { display: block; }
	#footer .container .widget { width: 50%; }
	.header { background: linear-gradient(90deg, #6b1fcd 0%, #374ede 100%); }
}
@media(max-width:740px) {
	#main-container.left-side #left-sidebar, #main-container.right-side.left-side #main-content, #main-container.right-side #right-sidebar { float: none; width: auto; }
	.top-space.has-img .title-wrap h1 { font-size: 22px; padding: 10px; }
	.elementor-widget-heading .elementor-heading-title { font-size: 24px; }
	.elementor-widget-wrap>.elementor-element { margin-bottom: 8px; }
	#footer .container .widget { width: 100%; }
	.h1, h1 { font-size: 35px; line-height: 1.2; }
	.h2, h2 { font-size: 30px; line-height: 1.2; }
	.h3, h3 { font-size: 25px; line-height: 1.2; }
	.header .logo img { width: 76px; }
	.col-3 .elementor-element .elementor-element { width: 100%; margin-bottom: 20px; }
	.col-4 .elementor-element .elementor-element { width: 100%; margin-bottom: 20px; }
	.col-5 .elementor-element .elementor-element { width: 50%; margin-bottom: 20px; }
	.col-6 .elementor-element .elementor-element { width: 50%; margin-bottom: 20px; }
}
body.fixed-header .header { -webkit-animation: headerAnim 1s ease; -moz-animation: headerAnim 1s ease; -ms-animation: headerAnim 1s ease; -o-animation: headerAnim 1s ease; animation: headerAnim 1s ease; }
@keyframes headerAnim {
	0% { top: -150px; }
	100% { top: 0px; }
}
@-webkit-keyframes headerAnim {
	0% { top: -150px; }
	100% { top: 0px; }
}

/* ======== alchemytest ======== */

.header {background: #691312;}
#footer {background: #691312;}
.header .wc-block-mini-cart__button .wc-block-mini-cart__icon { height: 40px;width: 40px; }
.dropdown-content li>a, .dropdown-content li>span {color: #333;}
#main-container.left-side #left-sidebar {padding: 60px 0;}
.wp-block-social-links .wp-social-link svg {height: 30px; width: 43px;}