/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/***/

.elementor-menu-toggle {
  margin-right: 0 !important;
}
.pic {
	position: relative;
}
.pic2::after, .pic::after {
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	height: 100%;
	width: 100%;
	border: 2px solid #4e282d;
	transform: rotate(3deg);
	border-radius: 20px;
	box-shadow: 0 0 10px -5px rgba(0,0,0,0.3);
}
.pic2.white::after, .pic.white::after {
	border: 2px solid #fff;	
}
.pic2::after {
	transform: rotate(-3deg);	
}

.img-l,
.img-r {
	transition: all 1s;
	transition-delay: 1s;
}
.in-viewport .img-l {
	transform: translateY(-30px);
}

.img-r {
	transition: all 0.5s;
}
.in-viewport .img-r {
	transform: translateY(30px);
}

.btn {
	position: relative;
	z-index: 10;
}
.btn a {
	position: relative;
}
.btn a::before {
	content: '';
	width: 100%;
	height: 100%;
	transform: translate(0, 0);
	transition: all 0.5s;
	display: table;
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
}
.btn a::after {
	content: '';
	width: 100%;
	height: 100%;
	transform: translate(0, 0);
	transition: all 0.5s;
	display: table;
	position: absolute;
	z-index: -1;
	top: 0;
	left: 0;
}
.btn a:hover::before {
	transform: translate(-10px, -10px);
}
.btn a:hover::after {
	transform: translate(10px, 10px);
}

.btn-dark a::before {
	background: #612E336B;
}
.btn-dark a::after {
	background: #633F31A1;
}

.btn-light a::before {
	background: #f1ede4;
	opacity: 0.2;
}
.btn-light a::after {
	background: #fff;
		opacity: 0.5;
}

body:not(.elementor-editor-active) .main-title {
	opacity: 0;
	transform: translateY(100px);
	transition: all 1s !important;
}

body:not(.elementor-editor-active) .in-viewport .main-title {
	opacity: 1;
	transform: translateY(0px);
}


body:not(.elementor-editor-active) .community-title {
	opacity: 0;
	transform: translateY(50px);
	transition: all 1s !important;
}

body:not(.elementor-editor-active) .in-viewport .community-title {
	opacity: 1;
	transform: translateY(0px);
}

body:not(.elementor-editor-active) .community-gallery {
	opacity: 0;
	transform: translateY(-50px);
	transition: all 1s !important;
}

body:not(.elementor-editor-active) .in-viewport .community-gallery {
	opacity: 1;
	transform: translateY(0px);
}

/**/

header .menu-item a:hover {  color: #ccc !important; }
.menu-item {
  display: flex;
  align-items: baseline;
}

.menu-item p {
  margin: 0;
}

/* name wrapper = first widget — grows to fill the gap, unless .nodots */
.menu-item > div:first-child:not(.nodots) {
  flex: 1 1 auto;
  overflow: hidden;
  white-space: nowrap;
  padding-right: 6px;
}
                                                         
/* target the <p> itself so ::after sits right after the text */
.menu-item > div:first-child:not(.nodots) p {
  position: relative;
  overflow: hidden;
  white-space: nowrap;
}

.menu-item > div:first-child:not(.nodots) p::after {
  content: " . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ";
  color: #999;
}
.nodots p::after {
	display: none !important;
}
/* price wrapper = second widget — stays fixed width, doesn't shrink */
.menu-item > div:last-child {
  flex: 0 0 auto;
  padding-left: 6px;
}
#strelica-dole {
    position: relative;
    width: 60px;
    height: 60px;
    cursor: pointer;
}

.circle-svg {
    width: 100%;
    height: 100%;
    transform: rotate(-90deg);
}

/* grey static background */
.circle-bg {
    fill: none;
    stroke: grey;        /* default stroke */
    stroke-width: 2;
}

.icon-wrap {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 24px;
	height: 24px;
	transform: translate(-50%, -50%);
	display: flex;
	align-items: center;
	justify-content: center;
}

/* animated white stroke */
.circle {
    fill: none;
    stroke: #fff;
    stroke-width: 2;
    vector-effect: non-scaling-stroke;

    stroke-dasharray: 302;
    stroke-dashoffset: 302;
    transition: stroke-dashoffset 1.5s linear;
}

#strelica-dole:hover .circle {
    stroke-dashoffset: 0;
}

.iko::before {
	height: 40px;
	width: 40px;
	background: #fff;
	border-radius: 50%;
	content: '';
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%) scale(0.5);
	opacity: 0;
	transition: all 0.3s;
	z-index: 0;
	pointer-events: none;
}
.iko:hover {
	color: #000;
}
.iko:hover::before {
	transform: translate(-50%, -55%) scale(1);
		opacity: 1;
}


@media all and (max-width: 640px) {
	  header .elementor-menu-toggle svg {
		  transform: scale(2);
		}
		header nav {
			position: fixed;
			top: 0;
			left: 0;
			z-index: 235235;
			width: 100%;
			height: 100vh;
			display: flex;
			align-self: center;
			justify-content: center;
			text-align: center;
		}
		header nav > ul {
			margin: 0 !important;
			display: flex !important;
			align-items: center;
			flex-direction: column;
			align-self: center;
		}
	.elementor-nav-menu--dropdown {
		background-color: #00000059;
		font-size: 13px;
		backdrop-filter: blur(7px);
	}
	.elementor-item.elementor-item-active {
		background: transparent !important;
	}
}
