#elementor-panel-category-nori_elements .elementor-element .icon:after, .elementor-panel .elementor-element .icon:after{
    right: 4px;
    top: 4px;
    position: absolute;
    content: 'Nori';
    font-size: 9px;
    border: none;
    @extend .bg-color-main;
    padding: 2px 4px;
    border-radius: 2px;
    color: #fff;
    font-weight: bold;
}
.elementor-panel .elementor-element-wrapper{
	@extend .bg-color-main;
}
.elementor-column-gap-default>.elementor-column>.elementor-element-populated {
    padding-top: 0 !important;
	padding-bottom: 0 !important;
}
.elementor-widget-text-editor, .elementor-widget-mo-heading-block{
	margin-bottom: 0 !important;
}
.e-con.e-flex > .e-con-inner {
    max-width: 100%;
}
/* divider */
section[data-section-divider="style1_top"], section[data-section-divider="style1_bottom"]{ 
	&:before{
		content: "";
		display: block;
        position: absolute;
		left: 0px;
		bottom: -2px;
		width: 100%;
		height: 54px;
		z-index: 9;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: top center;
		background-image: url(../images/bg/shape-1.svg);
	}
}
section[data-section-divider="style1_top"]{ 
	&:before{ left:-1px; top:-1px; @include rotate(180);}
}
section[data-section-divider="style2_top"], section[data-section-divider="style2_bottom"]{ 
	&:before{
		content: "";
		display: block;
        position: absolute;
	 	background-image: url(../images/bg/shape-2.svg);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: bottom;
		left: 0;
		right: 0;
		z-index: 1;
		width: 101%;
		height: 50px;
	}
}
section[data-section-divider="style2_top"]{ 
	&:before{ top:-5px; @include rotate(180); } 
}
section[data-section-divider="style2_bottom"]{ 
	&:before{ bottom:0;} 
}
.rotat-divider:before{ transform:rotate(180deg); }

section[data-section-divider="style3_top"], section[data-section-divider="style3_bottom"]{ 
	&:before{
		content: "";
		display: block;
        position: absolute;
	 	background-image: url(../images/bg/shape-3.svg);
		background-repeat: no-repeat;
		background-size: contain;
		background-position: bottom;
		left: 0;
		right: 0;
		z-index: 9;
        width: 100%; 
        height: 190px;
	}
}
section[data-section-divider="style3_top"]{ 
	&:before{ 
		top: -190px;
		left: 0;
	 } 
}
section[data-section-divider="style4_top"], section[data-section-divider="style4_bottom"]{
	&:before{
		content: "";
		display: block;
        position: absolute;
		background-image: url(../images/bg/shape-4.svg);
		//background-image: url('data:image/svg+xml;utf8,<svg height="200" width="100%" viewBox="0 0 1440 461" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none"><path d="m0 131.906 34.4-20.017c34.4-19.9 103.2-59.936 171.68-82.979 68.64-23.043 136.8-29.328003 205.44-4.306 68.48 25.022 137.28 81.35 205.76 80.768 68.64-.582 136.8-58.074 205.44-84.608 68.48-26.535 137.28-22.345 205.76-16.06 68.64 6.168 136.8 14.315 205.44 22.811 68.48 8.612 137.28 17.457 171.68 22l34.4 4.422v396.851h-1440z" fill-opacity=".09"><animate repeatCount="indefinite" fill="freeze" attributeName="d" dur="10s" values="M0 131.906L34.4 111.889C68.8 91.989 137.6 51.953 206.08 28.91C274.72 5.867 342.88 -0.418001 411.52 24.604C480 49.626 548.8 105.954 617.28 105.372C685.92 104.79 754.08 47.298 822.72 20.764C891.2 -5.771 960 -1.581 1028.48 4.704C1097.12 10.872 1165.28 19.019 1233.92 27.515C1302.4 36.127 1371.2 44.972 1405.6 49.515L1440 53.937V450.788H0L0 131.906Z; M0 122.906L36.5 109C71.5 96.372 102.52 67.98 171 44.937C239.64 21.894 354.36 51.478 423 76.5C491.48 101.522 546.52 19.097 615 18.515C683.64 17.933 799.36 58.534 868 32C936.48 5.46499 1039.52 54.715 1108 61C1176.64 67.168 1190.36 -6.996 1259 1.5C1327.48 10.112 1371.2 35.972 1405.6 40.515L1440 44.937V441.788H0L0 122.906Z; M0 131.906L34.4 111.889C68.8 91.989 137.6 51.953 206.08 28.91C274.72 5.867 342.88 -0.418001 411.52 24.604C480 49.626 548.8 105.954 617.28 105.372C685.92 104.79 754.08 47.298 822.72 20.764C891.2 -5.771 960 -1.581 1028.48 4.704C1097.12 10.872 1165.28 19.019 1233.92 27.515C1302.4 36.127 1371.2 44.972 1405.6 49.515L1440 53.937V450.788H0L0 131.906Z"></animate> </path><path class="elementor-shape-fill" d="M0 154.75L34.4 142.201C68.8 129.53 137.6 104.433 206.08 99.072C274.72 93.833 342.88 108.453 411.52 122.099C480 135.622 548.8 148.293 617.28 142.811C685.92 137.329 754.08 113.693 822.72 113.693C891.2 113.693 960 137.329 1028.48 152.68C1097.12 168.153 1165.28 175.463 1233.92 184.966C1302.4 194.591 1371.2 206.287 1405.6 212.257L1440 218.105V452.025H0L0 154.75Z" fill-opacity=".28"><animate repeatCount="indefinite" fill="freeze" attributeName="d" dur="8s" values="M0 154.75C0 154.75 12.8 142.902 34.4 142.201C56 141.5 140.02 160.111 208.5 154.75C277.14 149.511 334.36 112.57 403 126.216C471.48 139.739 552.52 190.448 621 184.966C689.64 179.484 745.36 116 814 116C882.48 116 950.52 161.149 1019 176.5C1087.64 191.973 1154.36 123.997 1223 133.5C1291.48 143.125 1371.2 206.287 1405.6 212.257L1440 218.105V452.025H0L0 154.75Z; M0 154.75C0 154.75 33.4 177.201 55 176.5C76.6 175.799 137.52 110.361 206 105C274.64 99.761 332.86 141.104 401.5 154.75C469.98 168.273 527.52 206.982 596 201.5C664.64 196.018 747.86 75 816.5 75C884.98 75 956.52 118.149 1025 133.5C1093.64 148.973 1163.36 87.497 1232 97C1300.48 106.625 1371.2 206.287 1405.6 212.257L1440 218.105V452.025H0L0 154.75Z; M0 154.75C0 154.75 12.8 142.902 34.4 142.201C56 141.5 140.02 160.111 208.5 154.75C277.14 149.511 334.36 112.57 403 126.216C471.48 139.739 552.52 190.448 621 184.966C689.64 179.484 745.36 116 814 116C882.48 116 950.52 161.149 1019 176.5C1087.64 191.973 1154.36 123.997 1223 133.5C1291.48 143.125 1371.2 206.287 1405.6 212.257L1440 218.105V452.025H0L0 154.75Z"></animate></path> <path class="elementor-shape-fill" d="M0 340.22L34.4 333.92C68.8 327.52 137.6 314.92 206.08 312.22C274.72 309.52 342.88 316.92 411.52 319.72C480 322.52 548.8 320.92 617.28 318.92C685.92 316.92 754.08 314.52 822.72 316.02C891.2 317.52 960 322.92 1028.48 309.42C1097.12 295.92 1165.28 263.52 1233.92 251.02C1302.4 238.52 1371.2 245.92 1405.6 249.52L1440 253.22V453.22H0L0 340.22Z"><animate repeatCount="indefinite" fill="freeze" attributeName="d" dur="6.5s" values="M0 340.22L34.4 333.92C68.8 327.52 139.02 281.2 207.5 278.5C276.14 275.8 351.86 331.12 420.5 333.92C488.98 336.72 554.52 289 623 287C691.64 285 756.86 332.42 825.5 333.92C893.98 335.42 960 322.92 1028.48 309.42C1097.12 295.92 1163.36 236 1232 223.5C1300.48 211 1371.2 245.92 1405.6 249.52L1440 253.22V453.22H0L0 340.22Z; M0 340.22L37.5 323C71.9 316.6 137.52 336.62 206 333.92C274.64 331.22 339.86 272.2 408.5 275C476.98 277.8 551.02 304 619.5 302C688.14 300 759.36 266.5 828 268C896.48 269.5 962.02 336.5 1030.5 323C1099.14 309.5 1156.36 232.5 1225 220C1293.48 207.5 1364.1 249.62 1398.5 253.22L1440 253.22V453.22H0L0 340.22Z; M0 340.22L34.4 333.92C68.8 327.52 139.02 281.2 207.5 278.5C276.14 275.8 351.86 331.12 420.5 333.92C488.98 336.72 554.52 289 623 287C691.64 285 756.86 332.42 825.5 333.92C893.98 335.42 960 322.92 1028.48 309.42C1097.12 295.92 1163.36 236 1232 223.5C1300.48 211 1371.2 245.92 1405.6 249.52L1440 253.22V453.22H0L0 340.22Z"></animate></path> <path class="elementor-shape-fill" d="M1440 337.719L1405.6 340.219C1371.2 342.719 1302.4 347.719 1233.92 350.419C1165.28 353.019 1097.12 353.419 1028.48 352.219C960 351.019 891.2 348.419 822.72 357.019C754.08 365.719 685.92 385.719 617.28 395.919C548.8 406.019 480 406.419 411.52 395.919C342.88 385.419 274.72 364.019 206.08 359.419C137.6 354.719 68.8 366.719 34.4 372.719L0 378.719V460.719H1440V337.719Z"><animate repeatCount="indefinite" fill="freeze" attributeName="d" dur="5.5s" values="M1440 337.719L1405.6 340.219C1371.2 342.719 1303.98 362.8 1235.5 365.5C1166.86 368.1 1090.14 324.2 1021.5 323C953.02 321.8 889.48 383.4 821 392C752.36 400.7 678.64 368.519 610 378.719C541.52 388.819 473.48 414.5 405 404C336.36 393.5 273.64 342.319 205 337.719C136.52 333.019 68.8 366.719 34.4 372.719L0 378.719V460.719H1440V337.719Z; M1440 337.719L1405.6 340.219C1371.2 342.719 1295.98 326.3 1227.5 329C1158.86 331.6 1081.64 391.2 1013 390C944.52 388.8 874.48 364.119 806 372.719C737.36 381.419 675.14 296.3 606.5 306.5C538.02 316.6 471.48 383.219 403 372.719C334.36 362.219 272.64 320.6 204 316C135.52 311.3 68.8 366.719 34.4 372.719L0 378.719V460.719H1440V337.719Z; M1440 337.719L1405.6 340.219C1371.2 342.719 1303.98 362.8 1235.5 365.5C1166.86 368.1 1090.14 324.2 1021.5 323C953.02 321.8 889.48 383.4 821 392C752.36 400.7 678.64 368.519 610 378.719C541.52 388.819 473.48 414.5 405 404C336.36 393.5 273.64 342.319 205 337.719C136.52 333.019 68.8 366.719 34.4 372.719L0 378.719V460.719H1440V337.719Z"></animate></path> </svg>');
		background-repeat: no-repeat;
		background-size: contain;
		background-position: bottom;
		left: 0;
		right: 0;
		z-index: 9;
		width: calc(100% + 1px);
		height: 200px;
		bottom:-1px;
	}
}
section[data-section-divider="style4_top"]{ 
	&:before{ top:-1px; @include rotate(180); } 
}
section[data-section-divider="style5_top"], section[data-section-divider="style5_bottom"]{
	position: relative;
	border-radius: 15px;
	z-index: 2;
	.elementor-container{
		border-top-right-radius:15px;
		border-top-left-radius:15px;
		background: #fff;
	}
	&:before, &:after{
		content: '';
		position: absolute;
		bottom: 5px;
		background: #fff;
		border-radius: 15px;
		opacity: .7;
	}
	&:before{
		left: 40px;
		right: 40px;
		top: -20px;
		z-index: -2;
	}
	&:after{
		left: 20px;
		right: 20px;
		top: -10px;
		z-index: -1;
	}
}
section[data-section-divider="style5_bottom"]{ 
	.elementor-container{ border-bottom-right-radius:15px; border-bottom-left-radius:15px; }
	&:before{ top:0; bottom:-20px; }
	&:after { top:0; bottom:-10px; }
	
}
section[data-section-divider-color="black"][data-section-divider="style5_top"], section[data-section-divider-color="black"][data-section-divider="style5_bottom"]{
	.elementor-container{ background: var(--color-dark); }
	&:before, &:after{ background: var(--color-dark); }
}
section[data-section-divider-color="black"][data-section-divider="style1_top"]:before{background-image: url(../images/bg/shape-b1.svg);}
section[data-section-divider-color="black"][data-section-divider="style1_bottom"]:before{background-image: url(../images/bg/shape-b1.svg);}
section[data-section-divider-color="black"][data-section-divider="style2_top"]:before{background-image: url(../images/bg/shape-b2.svg);}
section[data-section-divider-color="black"][data-section-divider="style2_bottom"]:before{background-image: url(../images/bg/shape-b2.svg);}
section[data-section-divider-color="black"][data-section-divider="style3_top"]:before{background-image: url(../images/bg/shape-b3.svg);}
section[data-section-divider-color="black"][data-section-divider="style3_bottom"]:before{background-image: url(../images/bg/shape-b3.svg);}
section[data-section-divider-color="black"][data-section-divider="style4_top"]:before{background-image: url(../images/bg/shape-b4.svg);}
section[data-section-divider-color="black"][data-section-divider="style4_bottom"]:before{background-image: url(../images/bg/shape-b4.svg);}

section[data-section-hidden="true"]{ display:none;}
section[data-section-overflow-Hidden="true"]{ overflow:hidden;}

/* button */
.button{
	@extend .font-family;
    display: inline-flex;
	position: relative;
    overflow: hidden;
    margin: 0 0 10px 0;   
    vertical-align: middle;
	background: $color-black;
	color:#fff;
	text-align: center;
	font-size: 15px;
	font-weight: 700;
    text-transform: capitalize;
	min-height: 50px;
	letter-spacing: 0.5px;
    padding-left: 30px;
	padding-right: 30px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition:all 300ms linear;
    &:hover , &:active , &:focus { color:#ccc; }
}
.button > span { 
    position: relative;
	z-index: 1;
	vertical-align: middle;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
}
.button > i  { 
	padding-left: 8px;
    max-height: 10px;
    display: inline-block;
    font-size: 100%;
    line-height: 60%;
    text-decoration: none;
    position: relative;
	z-index: 1;
}
.button > i[class^="pe-7s-"], .button > i[class*=" pe-7s-"]{
    font-size: 25px;
}
.inline-btn.e-flex {
    --flex-direction: none !important;
}

.text-left .button{ float:left; margin:0 15px 10px 0; }
.text-right .button{ float:right; margin:0 0 10px 15px; }
/* button size */
.button.small { padding-left: 20px; padding-right: 20px; padding-top: 8px; padding-bottom: 8px; min-height: 40px; }
.button.large { font-size: 17px;  padding: 17px 50px;}

/* button color */
.button.primary  { @extend .color-main; }
.button.dark     { color: $color-content;}
.button.light    { color: #fff; }
.button.hr_primary  { &:hover , &:active , &:focus { @extend .color-main; }}
.button.hr_light    { &:hover , &:active , &:focus { color: #fff; }}
.button.hr_dark     { &:hover , &:active , &:focus { color: $color-black; }}

/* button background color */
.button.bg_gradient { @extend .bg-color-main; }
.button.bg_primary  { @extend .bg-color-main;  }
.button.bg_dark     { background: $color-black; }
.button.bg_light    { background: #fff; }
.button.bg_grey     { background: $color-gray; }
.button.bg_transparent{background:transparent;}
.button.bg_hr_gradient { &:hover , &:active , &:focus { @extend .bg-color-main; }}
.button.bg_hr_primary  { &:hover , &:active , &:focus { @extend .bg-color-main; }}
.button.bg_hr_light    { &:hover , &:active , &:focus { background:#fff; }}
.button.bg_hr_dark     { &:hover , &:active , &:focus { background: $color-black; }}
.button.bg_hr_grey     { &:hover , &:active , &:focus { background: $color-gray; }}
.button.bg_hr_transparent { &:hover , &:active , &:focus { background:transparent; }}

.button.hover-grow{
    -webkit-transition: all .3s;
    -o-transition: all .3s;
	transition: all .3s;
}
.button.hover-grow:hover {
    transform: scale(1.1);
}
/* button outline */
.button.btn-border{
    border: 1px solid rgb(228, 228, 228);
}
.button.outline_primary  { @extend .border-color-main; }
.button.outline_light    { border-color:#fff; }
.button.outline_dark     { border-color: $color-black; }
.button.outline_hr_primary  { &:hover , &:active , &:focus { @extend .border-color-main; }}
.button.outline_hr_light    { &:hover , &:active , &:focus { border-color:#fff; }}
.button.outline_hr_dark     { &:hover , &:active , &:focus { border-color:$color-black; }}

/* button txt */
.button.btn-txt{
	font-size: 13px !important;
	font-weight: 500;
	line-height: 1.4;
	min-height: auto;
	letter-spacing: .04em;
    text-transform: uppercase;
}
.button.btn-txt-arrow{
	padding: 0;
	margin: 0;
	position: relative;
	background-color: transparent !important;
	border: 0;
	padding-left: 0;
	transition: all 0.5s ease-in-out;
	.mo_btn_text{
		position: relative;
		z-index: 1;
		display: inline-block;
		padding-bottom: 0px;
		text-decoration: none;
		transition: all 0.5s ease-in-out;
	}
	svg.svg-arrow{
		width: 10px;
		height: 10px;
		margin-left: 8px;
		path{
			fill: none;
			stroke-miterlimit: 10;
			stroke: $color-content;
		}
		path:nth-of-type(1) {
			transform: translate(0,0);
			transition: transform .2s ease-out .2s;
		}
		path:nth-of-type(2) {
			transform: translate(-12px,12px);
			transition: transform .2s ease-in;
		}
	}
	&:hover{
		svg.svg-arrow path{
		    @extend .stroke-color-main;
		}
		svg.svg-arrow path:nth-of-type(1) {
			transform: translate(12px,-12px);
			transition: transform .2s ease-in;
		}
		svg.svg-arrow path:nth-of-type(2) {
			transform: translate(0,0);
			transition: transform .2s ease-out .2s;
		}
	}
	&.larg{
		svg.svg-arrow{
			width: 20px;
			height: 20px;
		}
	}
}
.button.btn-txt-arrow.primary .mo_btn_text{
	color: $color-black; 
}

.button.btn-txt-arrow2{
	background-color: transparent !important;
	border: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: inline-flex;
    padding:0;
	.arrows {
		display: inline-flex;
		margin-left: 13px;
		position: relative;
		overflow: hidden;
		width: 15px;
		.arrow {
			display: inline-flex;
			flex-direction: row;
			flex-wrap: nowrap;
			width: 32px;
			-moz-transform: translateX(-17px);
			-ms-transform: translateX(-17px);
			-webkit-transform: translateX(-17px);
			transform: translateX(-17px);
			transition: all 0.25s cubic-bezier(0.37, 0.31, 0.2, 0.85);
			svg {
				width: 15px;
				height: auto;
				@extend .fill-main;
			}
			svg+svg {
				margin-left: 2px;
			}
		}
    } 
	&:hover{
		.arrow {
			-moz-transform: translateX(0);
			-ms-transform: translateX(0);
			-webkit-transform: translateX(0);
			transform: translateX(0);
		}
	}  
}

.button.btn-txt-arrow3{
	background-color: transparent !important;
	border: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: inline-flex;
    padding:0;
	.mo_module_button__cover.front{
		transition: all 0.3s ease-out 0.15s;
		float: left;
		display: flex;
		align-items: center;
		line-height: 32px;
		&:before{
			content: "";
			border-radius: 50%;
			border: 1px solid currentcolor;
			text-indent: -32px;
			width: 9px;
			height: 9px;
			line-height: 30px;
			display: inline-block;
			overflow: hidden;
			margin-right: 12px;
			text-align: center;
			transition: width 0.3s ease-in 0.15s, height 0.3s ease-in 0.15s, background-color 0.3s ease-in 0.15s, text-indent 0.3s ease-in, color 0.3s ease-out;
		}
		&:after{
			content: "\f061";
            font-family: "FontAwesome";
			font-weight: 900;
			font-size: 14px;
			position: absolute;
            left: 9px;
			text-align: center;
			text-indent: -32px;
			transition: color 0.3s ease-out, text-indent 0.3s ease-in;
		}
	}
	&:hover{
		.mo_module_button__cover.front {
			&:before{
				width: 32px;
				height: 32px;
				line-height: 30px;
				background-color: currentcolor;
				color: currentColor;
				text-indent: 0;
			}
			&:after{
				color: #fff;
				text-indent: 0;
			}
		}
	}  
}
.button.btn-txt-arrow3.hr_light:hover{.mo_module_button__cover.front:after{color:$color-font;}}

.btn-arrow{
	width: 50px;
    height: 31px;
    overflow: hidden;
    position: relative;
    display: block;
	svg{
		width: 25px;
		height: 25px;
		line-height: 25px;
		overflow: hidden;
		position: relative;
		-webkit-transition: all .4s ease;
		-ms-transition: all .4s ease;
		transition: all .4s ease;
		will-change: transform;
		border: 1px solid rgba(255,255,255,0.4);
		-webkit-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-border-radius: 50%;
		-ms-border-radius: 50%;
		border-radius: 50%;
		padding: 5px;
	}
	&:hover{
		svg{ margin-left: 0;}
	}
}

.btn-circle-icon{
	padding: 19px 20px 23px 22px;
    @extend .radius50;
	@extend .border;
	svg{
		-webkit-transform: rotateZ(0);
		-ms-transform: rotateZ(0);
		transform: rotateZ(0);
		-webkit-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;
		transition: all 0.3s ease;
		opacity: 0.7;
	}
	&:hover{
		svg{
			-webkit-transform: rotateZ(-45deg);
			-ms-transform: rotateZ(-45deg);
			transform: rotateZ(-45deg);
		}
	}
}
.btn_more_link{
	position: relative;
    display: inline-block;
    top: auto;
    left: auto;
    height: auto;
    width: auto;
    font-size: 15px;
    line-height: 21px;
    font-weight: 500;
    z-index: 1;
    overflow: hidden;
	.mo_btn_text {
		position: relative;
		margin-right: 0;
		display: inline-block;
		vertical-align: middle;
		text-indent: -110px;
		visibility: hidden;
		white-space: nowrap;
		opacity: 0;
		-webkit-transition: visibility .4s ease,margin-right .4s ease-out,text-indent .5s ease-out,opacity .4s ease;
		-ms-transition: visibility .4s ease,margin-right .4s ease-out,text-indent .5s ease-out,opacity .4s ease;
		transition: visibility .4s ease,margin-right .4s ease-out,text-indent .5s ease-out,opacity .4s ease;
		will-change: visibility,margin-right,text-indent,opacity;
	}
	.link_icon {
		position: relative;
		display: inline-block;
		vertical-align: middle;
		overflow: hidden;
		width: 1.4em;
		height: 1.4em;
		line-height: 1.4em;
		text-align: center;
		border: 1px solid #C9D9D3;
		width: 29px;
		height: 28px;
		line-height: 25px;
		-webkit-box-sizing: border-box;
		-ms-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-border-radius: 50%;
		-ms-border-radius: 50%;
		border-radius: 50%;
		svg{
			width: 15px;
			height: 15px;
		}
	}
	&:hover{
		.mo_btn_text {
			opacity: 1;
			text-indent: 0;
			margin-right: 6px;
			visibility: visible;
			-webkit-transition: visibility .4s ease,margin-right .3s ease-out,text-indent .4s ease-out,opacity .4s ease;
			-ms-transition: visibility .4s ease,margin-right .3s ease-out,text-indent .4s ease-out,opacity .4s ease;
			transition: visibility .4s ease,margin-right .3s ease-out,text-indent .4s ease-out,opacity .4s ease;
		}
	}
}
.btn-absolute{
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	text-indent: -9999px;
	z-index: 999;
	background-color: transparent !important;
}
/* button underlined */
.button.btn-txt-underlined{
	position: relative;
	background-color: transparent !important;
	border: 0;
	margin: 13px 0;
	padding-bottom: 3px;
	padding-left: 0;
	padding-right: 0;
	min-height: auto;
    @include border-radius(0);
	.button-arrow{display: none; }
	&:before, &:after{
		content: "";
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 1px;
		background-color: currentColor;
	}
	&:before{
		-webkit-transform-origin: right;
		transform-origin: right;
		-webkit-transition: -webkit-transform .6s cubic-bezier(.165,.84,.44,1);
		transition: -webkit-transform .6s cubic-bezier(.165,.84,.44,1);
		transition: transform .6s cubic-bezier(.165,.84,.44,1);
		transition: transform .6s cubic-bezier(.165,.84,.44,1),-webkit-transform .6s cubic-bezier(.165,.84,.44,1);
		-webkit-transition-delay: .16s;
		transition-delay: .16s;
	}
	&:after{
        -webkit-transform: scaleX(0);
		transform: scaleX(0);
		-webkit-transform-origin: left;
		transform-origin: left;
		-webkit-transition: -webkit-transform .6s cubic-bezier(.165,.84,.44,1);
		transition: -webkit-transform .6s cubic-bezier(.165,.84,.44,1);
		transition: transform .6s cubic-bezier(.165,.84,.44,1);
		transition: transform .6s cubic-bezier(.165,.84,.44,1),-webkit-transform .6s cubic-bezier(.165,.84,.44,1);
		-webkit-transition-delay: 0s;
		transition-delay: 0s;
	}
	&:hover{
		&:before{
			-webkit-transform: scaleX(0);
			transform: scaleX(0);
			-webkit-transition-delay: 0s;
			transition-delay: 0s;
		}
		&:after{
			-webkit-transform: scaleX(1);
			transform: scaleX(1);
			-webkit-transition-delay: .16s;
			transition-delay: .16s;
		}
	}
}
/* button icon */
.button.button_icon{
	.mo_btn_icon{ 
		padding-left: 5px;
		padding-right: 5px;
	}
	.btn_icon_container{font-size:10px;}
}
.button.effect-icon{
	.mo_btn_text{
		position: relative;
		-webkit-transition: all .3s;
		-o-transition: all .3s;
		transition: all .3s;
		transform: translateX(0);
		padding: 0 15px;
		display: inline-block;
	}
	.mo_btn_icon{
		-webkit-transition: all .3s;
		-o-transition: all .3s;
		transition: all .3s;
		line-height: 16px;
		position: absolute;
		right: 35px;
		transform: translateY(50%);
		opacity: 0;
		font-size: 12px;
	}
	&:hover{
		.mo_btn_text{
			transform: translateX(-10px);
		}
		.mo_btn_icon{
			right: 8px;
            opacity: 1;
		}
	}
}
.button.effect-icon.btn_icon_position_left{
	.mo_btn_icon {
		left: 35px;
		right: auto;
	}
	&:hover .mo_btn_icon {
		right: auto;
		left: 0;
	}
	&:hover .mo_btn_text {
		transform: translateX(10px);
	}
}

/* button roll */
.button.roll, .button.btn-txt-underlined{
	.mo_btn_text, .mo_module_button__container{
		transition: opacity .6s,transform .8s;
		transition-timing-function: cubic-bezier(.15,.85,.31,1);
	}
	.mo_btn_text svg{
		position: relative;
		right: -5px;
        top: 0;
	}
	.mo_btn_text.back {
		display: inline-block;
		position: absolute;
		width: 100%;
		top: 50%;
		left: 50%;
		transform: translate(-50%,80%);
		opacity: 0;
	}
}
.button.roll:hover{
	.mo_module_button__container{
		transform: translateY(-100%);
	}
	.mo_btn_text.front {
		opacity: 0;
		transform: translateY(-150%);
	}
	.mo_btn_text.back {
		transform: translate(-50%,110%);
		opacity: 1;
	}
} 
.button.large.roll:hover .mo_btn_text.back {
    transform: translate(-50%, 50%);
}
.button.btn-txt-underlined:hover{
	.mo_module_button__container{
		transform: translateY(-100%);
	}
	.mo_btn_text.front {
		opacity: 0;
		transform: translateY(-150%);
	}
	.mo_btn_text.back {
		transform: translate(-50%,55%);
		opacity: 1;
	}
} 
.button.roll.bg_hr_primary  { &:hover:before { @extend .bg-color-main;}}
.button.roll.bg_hr_light    { &:hover:before{ background:#fff; }}
.button.roll.bg_hr_dark     { &:hover:before{ background: $color-black; }}
.button.roll.bg_hr_grey     { &:hover:before{ background: $color-gray; }}

.btn-no-icon .button.btn-txt-underlined{
	&:before, &:after{content:none;}
	svg{display:none;}
}
/* button scaleup */
.button.scaleup{
	overflow:hidden;
	span{position:relative;z-index:10;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;}
	&::before{position:absolute;content:'';width:120%;height:0;padding-bottom:120%;top:-110%;left:-10%;border-radius:50%;transform:translate3d(0,68%,0) scale3d(0,0,0)}
    &::after{position:absolute;content:'';transform:translate3d(0,-101%,0);transition:transform 0.4s cubic-bezier(.1,0,.3,1)}
}
.button.scaleup:hover{
	span{animation:MoveScaleUpIn 0.3s forwards,MoveScaleUpEnd 0.3s forwards 0.3s}
	&::before{transform:translate3d(0,0,0) scale3d(1,1,1);transition:transform 0.4s cubic-bezier(.1,0,.3,1)}
    &::after{transform:translate3d(0,0,0);transition-duration:0.05s;transition-delay:0.4s;transition-timing-function:linear}
}

@keyframes MoveScaleUpIn{to{transform:translate3d(0,-105%,0) scale3d(1,2,1);opacity:0}}
@keyframes MoveScaleUpEnd{from{transform:translate3d(0,100%,0) scale3d(1,2,1);opacity:0}to{transform:translate3d(0,0,0);opacity:1}}

.button.scaleup.bg_hr_primary  { &:hover:before { @extend .bg-color-main;}}
.button.scaleup.bg_hr_light    { &:hover:before{ background:#fff; }}
.button.scaleup.bg_hr_dark     { &:hover:before{ background: $color-black; }}
.button.scaleup.bg_hr_grey     { &:hover:before{ background: $color-gray; }}

.btn-box-wh .mo-element-mo-button{
	position: relative;
	width: fit-content;
    background: #fff;
    padding: 10px 10px 0px 10px;
    border-radius: 32px 32px 0px 0px;
	&:after, &:before{
		content: "";
		-webkit-mask-size: contain;
		-webkit-mask-position: bottom right;
		-webkit-mask-repeat: no-repeat;
		width: 33px;
		height: 33px;
		position: absolute;
		bottom: 0;
		top: revert-layer;
		background: #fff;
		-webkit-mask-image: url(../images/btn-box-left.svg);
	}
	&:before{
		right: -30px;
		transform: rotate(90deg);
	}
	&:after {
		left: -30px; 
	}
}
.btn-center .mo-element-mo-button{
    margin: auto;
}
/* button store */
.google-store-btn, .app-store-btn{
	display: block;
	height: 65px;
    width: 215px;
    background-size: 65%;
    background-color: #fff;
    border-radius: 50px;
    background-repeat: no-repeat;
    text-indent: -100000px;
    overflow: hidden;
    background-position: center;
	transition: all 0.5s ease-in-out;
	&.right{float: right;}
	&.left {float: left;}
}
.google-store-btn{
   background-image: url(../images/app/googleplay-dark.svg);
   &:hover{ background-color:var(--color-dark); background-image: url(../images/app/googleplay-light.svg);}
}
.app-store-btn{
	background-image: url(../images/app/appstore-dark.svg);
	&:hover{ background-color:var(--color-dark); background-image: url(../images/app/appstore-light.svg);}
}
.google-store-btn.black{ background-image: url(../images/app/googleplay-light.svg); }
.app-store-btn.black   { background-image: url(../images/app/appstore-light.svg); }

 .google-store-btn.black, .app-store-btn.black{
	background-color:var(--color-dark);
     transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
	&:hover{
		-webkit-transform: translateY(-5px);
		transform: translateY(-5px);
	}
}

.left-btn{
	float: left;
    display: inline-block;
    width: auto !important;
}
/* hover slide animattion */
.slide {
   position: relative;
    &:before{
		content: '';
		width: 0;
		height: 100%;
		position: absolute;
		bottom: 0;
		left: 100%;
		-webkit-transition: all 0.3s ease;
		transition: all 0.4s ease;
	}
	span, i { position: relative; z-index: 1; }
	&:hover:before {
		width: 100%;
		left: 0;
		-webkit-transition: width 0.3s ease;
		transition: width 0.3s ease;
	}
}

.slide.bg_hr_primary:hover  { &:after, &:before{ @extend .bg-color-main;  }}
.slide.bg_hr_dark:hover     { &:after, &:before{ background: $color-font; }}
.slide.bg_hr_light:hover    { &:after, &:before{ background: #fff; }}
.slide.bg_hr_grey:hover     { &:after, &:before{ background: $color-gray; }}

.link-btn{
	 position: relative;
     z-index: 2;
	 font-size: 13px;
     font-weight: 500;
	 overflow: hidden;
     display: inline-block;
	 &:before , &:after{
	    content: '';
		position: absolute;
		left: -1px;
		bottom: 0;
		width: 100%;
		height: 1px;
		background: rgba(0, 0, 0, 0.2);
	    @include single-transition(all, .4s, ease-in-out);
	}
	&:before{
		content: '';
		position: absolute;
		transition: transform .5s ease;
		left: -1px;
		bottom: 0;
		width: 100%;
		height: 1px;
		background: rgba(255, 255, 255, 0.3);
	    @include single-transition(all, .4s, ease-in-out);
	}
	 &:after{
        @include translateX(-100%);
	 }
	&:hover{
		@extend .color-main;
	    &:after{ @extend .bg-color-main; @include translateX(0);}
	}
}
/* circle btn */
.circle-btn {
    position: absolute;
    z-index: 2;
    height: 46px;
    width: 46px;
    border-radius: 50%;
	border: 1px solid rgba(255,255,255,0.5);
    text-indent: 100%;
    white-space: nowrap;
    transition: opacity .2s ease-out,-webkit-transform .7s ease-out;
    -webkit-transition: opacity .2s ease-out,-webkit-transform .7s ease-out;
    transition: transform .7s ease-out,opacity .2s ease-out;
    transition: transform .7s ease-out,opacity .2s ease-out,-webkit-transform .7s ease-out;
    right: 30px;
    bottom: 30px;
}
.circle-btn span {
    display: block;
    width: 12px;
    left: 15px;
    position: relative;
    top: 21px;
    height: 2px;
    background: #fff;
	@include single-transition(all, 0.2s, ease-in-out);
	&:after{
		content: '';
        display: block;
		position: absolute;
		border-bottom: 2px solid;
		border-left: 2px solid;
		height: 6px;
		transform: rotate(-130deg);
		width: 6px;
		right: -2px;
		top: -2px;
		color: #fff;
	}
}
.circle-btn svg {
    position: absolute;
    top: -3px;
    left: -3px;
}
.circle-btn circle {
    -webkit-transition: stroke-dashoffset .6s ease-out .4s,stroke-width .2s ease-out,stroke-opacity .2s ease-out;
    transition: stroke-dashoffset .6s ease-out .4s,stroke-width .2s ease-out,stroke-opacity .2s ease-out;
    stroke: #fff;
    stroke-width: 1;
}
.circle-btn:hover circle {
    stroke-dashoffset: 0;
    stroke-opacity: 1;
}
/* -------------landing page------------ */
.brand-logo{
	margin-top:15px;
    img{
		border:1px solid rgba(255, 255, 255, 0.2) !important;
		border-radius:50% !important;
		padding:7px;
		width:50px;
	}
}
.demo_txt{margin-top:15px}
.demo-nember{
	color: #fff;
	margin-bottom: 0;
    left: auto;
    right: auto;
    width: 100%;
    text-align: center;
    font-size: 440px !important;
    font-weight: 800 !important;
    line-height: 0.9 !important;
    display: block;
    letter-spacing: -8.8px;
    text-transform: uppercase;
    -webkit-text-fill-color: transparent;
    z-index: -1;
    background: -webkit-linear-gradient(86deg, white 5%, rgb(255, 255, 255) 25%, rgba(14, 15, 17, 0.1) 100%) text;
    opacity: 0.2;
}
.demo_img{
	display: flex;
    flex-direction: column;
    position: relative;
    height: 100%;
    transition: transform 0.5s ease-out;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.13);
    padding: 1.5px;
	border-radius: 25px !important;
	&:after{
		content: "";
		position: absolute;
		left: 0px;
		width: 100%;
		height: 100%;
		bottom: -35px;
		z-index: 1;
		opacity: 0;
		transition: transform 0.6s ease-in-out;
		background: linear-gradient(transparent 1%, rgba(27, 117, 253, 0.1) 40%, var(--color-primary) 60%, transparent 100%);
	}
	.demo_img_bg{
		height: 100%;
		background: var(--color-vdark);
		border-radius: 25px;
		padding: 20px 20px 15px;
		z-index: 2;
		> h6{
			color: #fff;
			padding-top: 15px;
			margin-bottom: 0;
			text-align: center;
		}
	}
	.demo-dots{
		display: flex !important;
		align-items: center;
		margin-bottom: 15px;
		gap: 5px;
		span {
			width: 5px;
			height: 5px;
			background: rgba(255, 255, 255, 0.3);
			border-radius: 50%;
		}
	}
	img{ border-radius:10px !important; transition: all 0.3s ease;}
	a.demo-link{
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		z-index: 1;
	}
	.button{
		z-index: 9;
	}
	.demo-detail {
		display: flex;
		align-items: flex-end;
		justify-content: center;
		position: absolute;
		inset: 0;
		padding-bottom: 30px;
		background: linear-gradient(180deg, #fff0 35%, var(--color-primary) 75%);
		opacity: 0;
		visibility: hidden;
		transition: all 0.3s ease;
		transform: scaleY(0);
		-webkit-transform-origin: bottom left;
		transform-origin: bottom left;
       .demo-btns{
			flex-wrap: wrap;
			display: flex;
			gap: 1rem;
			justify-content: center;
		}
	}
	&:hover {
		&::after{transform:translateY(-250px);opacity:1;}
		img{ transform: scale(1.04);}
		.demo-detail{opacity:1;visibility:visible;transform: scaleY(1);}
	}
}

.tutor-icon .icon-wrap:before {
    content: "";
    width: 30px;
    height: 30px;
    background-color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: -1;
    transform: translate(-50%, -50%);
    border-radius: 50%;
}
.demo_link{text-align:center;margin-top:20px;font-size:16px}
.demo_link .button.btn-txt-underlined .button-text{font-size:16px!important;text-transform:capitalize}.facebook{background:#42599e}
.bg-dark-grey {
    position: relative;
	&:after{
		background: linear-gradient(to bottom, #f7f8fd, #d6daec);
		content: "";
		position: absolute;
		width: 100%;
		height: 100%;
		display: block;
		top: 0;
		left: 0;
		z-index: -1;
	}
}
/* social icon color */
.facebook   {background:#42599e; }
.twitter    {background:#55acee; }
.instagram  {
	background: #e73b7a;
	background: -webkit-radial-gradient(30% 107%,circle,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
	background: -moz-radial-gradient(30% 107%,circle,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
	background: -o-radial-gradient(30% 107%,circle,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
	background: radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
}
.flickr     { background:#0063DC; }
.linkedin   { background:#0798cf; }
.dribbble   { background:#e40079; }
.pinterest  { background:#fc3030; }
.behance    { background:#1769ff; }
.youtube    { background:#bf0918; }
.deviantart { background:#bf0918; }
.rss        { background:#ff6600; }
.tumblr     { background:#32506d; }
.vimeo      { background:#aad450; }
.skype      { background:#00aff0; }
.soundcloud { background:#ff8c00; }
.whatsapp   { background:#34af23; }
.tripadvisor{ background:#00AF87; }
 .social-color-hr li:hover{
	.facebook   {background:#42599e; color:#fff; }
	.twitter    {background:#55acee; color:#fff; }
	.instagram  {
		color:#fff;
		background: #e73b7a;
		background: -webkit-radial-gradient(30% 107%,circle,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
		background: -moz-radial-gradient(30% 107%,circle,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
		background: -o-radial-gradient(30% 107%,circle,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
		background: radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%);
	}
	.flickr     {background:#0063DC; color:#fff; }
	.linkedin   {background:#0798cf; color:#fff; }
	.dribbble   {background:#e40079; color:#fff; }
	.pinterest  {background:#fc3030; color:#fff; }
	.behance    {background:#1769ff; color:#fff; }
	.youtube    {background:#bf0918; color:#fff; }
	.deviantart {background:#bf0918; color:#fff; }
	.rss        {background:#ff6600; color:#fff; }
	.tumblr     {background:#32506d; color:#fff; }
	.vimeo      {background:#aad450; color:#fff; }
	.skype      {background:#00aff0; color:#fff; }
	.soundcloud {background:#ff8c00; color:#fff; }
	.whatsapp   {background:#34af23; color:#fff; }
	.tripadvisor{background:#00AF87; color:#fff; }
}
ul.social-links {
    list-style: none;
	padding: 0;
	li { display: inline;}
}
.social-icons{
	display: block;
    clear: both;
	a{
		position: relative;
		display: inline-block;
		text-align: center;
		overflow: hidden;
		margin: 1px;
		width: 48px;
		height: 48px;
		line-height: 50px;
		font-size: 16px;
		background-color: transparent;
		@include single-transition(all, .3s, ease-in-out);
		i{ position:relative; z-index:3; }
		i.fa-facebook, i.fa-twitter, i.fa-instagram, i.fa-pinterest, i.fa-linkedin{ font-family: "Font Awesome 6 Brands" !important; }
		i.fa-share-nodes{font-family: "Font Awesome 6 Free" !important;}
		i.fa-twitter:before{ content:"\e61b";}
		&::before, &::after {
			content: "";
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
		}
		&::before {
			-webkit-animation: BtnBlur .6s forwards;
			-moz-animation: BtnBlur .6s forwards;
			-ms-animation: BtnBlur .6s forwards;
			-o-animation: BtnBlur .6s forwards;
			animation: BtnBlur .6s forwards;
			z-index: 1;
		}
		&::after {
			background:transparent;
			z-index: 2;
		}
		&:hover{
			&::before {
				-webkit-animation: BtnHover;
				animation: BtnHover;
			}
	    } 
	}
}

.social-icons.right { float:right; }
.social-icons.left { float:left; }

.social-icons.primary a{@extend .bg-color-main; color:#fff;}
.social-icons.gradient a{ @extend .bg-color-main; }
.social-icons.dark a{ background: $color-black; color:#fff;}
.social-icons.white a{ background: #fff; @extend .color-main; }
.social-icons.grey a{ @extend .bg-grey; color:$color-black; }
.social-icons.transparent a{ background-color: transparent;}

.social-icons.primary-hr a:before, .social-icons.primary-hr a:hover{@extend .bg-color-main; color:#fff;}
.social-icons.gradient-hr a::before, .social-icons.gradient-hr a:hover{@extend .bg-color-main; color:#fff;}
.social-icons.white-hr a::before, .social-icons.white-hr a:hover{ background:#fff; color:$color-black; }
.social-icons.grey-hr a::before, .social-icons.grey-hr a:hover{ @extend .bg-grey; color:$color-black; }
.social-icons.dark-hr a::before, .social-icons.dark-hr a:hover{ background:$color-black; color:#fff;}
.social-icons.transparent-hr a::before, .social-icons.transparent-hr a:hover{ background-color: transparent; }

.social-icons.colors, .social-icons.colors-hr:hover::before{
	a.facebook   {background:#42599e; color:#fff;}
	a.twitter    {background:#55acee; color:#fff;}
	a.instagram  {background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%); color:#fff;}
	a.flickr     {background:#0063DC; color:#fff;}
	a.linkedin   {background:#0798cf; color:#fff;}
	a.dribbble   {background:#e40079; color:#fff;}
	a.pinterest  {background:#fc3030; color:#fff;}
	a.behance    {background:#1769ff; color:#fff;}
	a.youtube    {background:#bf0918; color:#fff;}
	a.deviantart {background:#bf0918; color:#fff;}
	a.rss        {background:#ff6600; color:#fff;}
	a.tumblr     {background:#32506d; color:#fff;}
	a.vimeo      {background:#aad450; color:#fff;}
	a.skype      {background:#00aff0; color:#fff;}
    a.soundcloud {background:#ff8c00; color:#fff;}
    a.whatsapp   {background:#34af23; color:#fff;}
	a.tripadvisor{background:#00AF87; color:#fff;}
}
/* social-share  */
.social-share a {
	display: inline-block;
	font-size: 18px;
	text-align: center;
	padding: 10px;
	margin-right: 10px;
	cursor: pointer;
	line-height: 1;
	margin-right: 5px;
	background-color: #222;
	color: #fff;
	transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	-ms-transition: all 0.3s linear;
}
.social-share a i {
	width: 1em;
	height: 1em;
	position: relative;
	display: block;
}
.social-share a:hover {
	transition: all 0.3s linear;
	-webkit-transition: all 0.3s linear;
	-moz-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	-ms-transition: all 0.3s linear;
	-webkit-transform: translateY(-5px);
	-ms-transform: translateY(-5px);
	transform: translateY(-5px);
}
.social-share a:last-child {
	margin-right: 0px;
}
.social-share {
	a.facebook  { background-color: #4661c5; }
	a.twitter   { background-color: #44b1e4; }
	a.google    { background-color: #dd4b39; }
	a.pinterest { background-color: #ff2e2e; }
	a.linkedin  { background-color: #0073B0; }
	a.buffer    { background-color: #000000; }
	a.digg      { background-color: #005be2; }
	a.reddit    { background-color: #ff4500; }
	a.tumbleupon{ background-color: #eb4924; }
	a.tumblr    { background-color: #35465c; }
	a.vk        { background-color: #45668e; }
	a.yummly    { background-color: #E16120; }
	a.email     { background-color: #E84231; }
	a.print     { background-color: #4982C3; }
}
.social-share.shape-rounded a {
	border-radius: 10%;
	-webkit-border-radius: 10%;
	-moz-border-radius: 10%;
}
.social-share.shape-circle a {
	border-radius: 50%;
	-webkit-border-radius: 50%;
	-moz-border-radius: 50%;
}
.social-icons.style2 {
	a{
		background-color: transparent !important;
		color: $color-content;
		&::before, &::after {
			content: "";
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			background-color: transparent !important;
		}
		&:after {
			@extend .border;
			border-radius: 50%;
			box-sizing: border-box;
			z-index: 2;
		}
		&:before {
			z-index: 1;
		}
		&:hover{
			&:after {
				animation: mo-menu-circle-border 1s forwards;
			}
		}
	}
}
/* rev_slider arrow zeus */
.zeus-3.tparrows {
	border:1px solid rgba(255, 255, 255, 0.2) !important;
	min-width: 70px;
    min-height: 70px;
	border-radius: 2px !important;   
	cursor:pointer;
	position:absolute;
	display:block;
	z-index:100;
	overflow:hidden;
	background:rgba(0,0,0,0.1) !important;
	border-radius: 50% !important;
	transition: all 0.3s;
	-webkit-transition:all 0.3s;
	-moz-transition:all 0.3s;
  }
  .zeus-3.tparrows.rs-touchhover {
	 border:1px solid rgba(255, 255, 255, 0.4) !important;
  }
  #rev_slider_23_1 .tp-leftarrow.tparrows.zeus-3 {
	  left: 60px !important;
  }
  .zeus-3.tparrows:before {
	font-family: "revicons";
   font-size: 20px;
    color: #ffffff;
    display: block;
    line-height: 70px;
	text-align: center;    
	z-index:2;
	position:relative;
  }
  .zeus-3.tparrows.tp-leftarrow:before {
	content: "\e824";
  }
  .zeus-3.tparrows.tp-rightarrow:before {
	content: "\e825";
  }
  .zeus-3.tparrows.rs-touchhover:before {
	  -webkit-animation: moBtnHover ease-out .4s;
	  -moz-animation: moBtnHover ease-out .4s;
	  -ms-animation: moBtnHover ease-out .4s;
	  -o-animation: moBtnHover ease-out .4s;
	  animation: moBtnHover ease-out .4s;
  }
  .zeus-3 .tp-title-wrap {
	opacity:0;
   }
  





/* heading-fancy */
.heading-fancy  , .mo-title-box{
   display: block;
   clear: both;
   .split-text-applied{ color: inherit; }
	[data-split-text=true] { visibility: hidden; font-size: inherit !important; }
	[data-split-text=true].split-text-applied { visibility: visible; }
	[data-split-text] .split-inner {
	  transition: -webkit-transform 0.45s cubic-bezier(0.35, 0.95, 0.4, 1);
	  transition: transform 0.45s cubic-bezier(0.35, 0.95, 0.4, 1);
	  transition: transform 0.45s cubic-bezier(0.35, 0.95, 0.4, 1), -webkit-transform 0.45s cubic-bezier(0.35, 0.95, 0.4, 1);
	  -webkit-transform: translateY(-150%);
			  transform: translateY(-150%);
	}
	[data-split-text].split-text-applied .split-inner{
	  transition: -webkit-transform 0.6s cubic-bezier(0.1, 0.9, 0.4, 1);
	  transition: transform 0.6s cubic-bezier(0.1, 0.9, 0.4, 1);
	  transition: transform 0.6s cubic-bezier(0.1, 0.9, 0.4, 1), -webkit-transform 0.6s cubic-bezier(0.1, 0.9, 0.4, 1);
	  -webkit-transform: translateY(0);
			  transform: translateY(0);
	}
	.split-unit:nth-child(0) .split-inner { transition-delay: 0s; }
	.split-unit:nth-child(1) .split-inner { transition-delay: 0.0769230769s; }
	.split-unit:nth-child(2) .split-inner { transition-delay: 0.1538461538s; }
	.split-unit:nth-child(3) .split-inner { transition-delay: 0.2307692308s; }
	.split-unit:nth-child(4) .split-inner { transition-delay: 0.3076923077s; }
	.split-unit:nth-child(5) .split-inner { transition-delay: 0.3846153846s; }
	.split-unit:nth-child(6) .split-inner { transition-delay: 0.4615384615s; }
	.split-unit:nth-child(7) .split-inner { transition-delay: 0.5384615385s; }
	.split-unit:nth-child(8) .split-inner { transition-delay: 0.6153846154s; }
	.split-unit:nth-child(9) .split-inner { transition-delay: 0.6923076923s; }
	.split-unit:nth-child(10) .split-inner{ transition-delay: 0.7692307692s; }
}
.mo-title-box[data-split-text=true] h3{ -webkit-text-fill-color: inherit; }

.elementor-element-edit-mode .heading-fancy [data-split-text=true]{ 
	visibility: visible;
	.txt-rotate-keyword{opacity: 0;}
	.txt-rotate-keyword.active{opacity: 1;}
}

.heading-fancy{
    letter-spacing: 0;
	max-width: 656px;
    margin-bottom: 30px;
	@extend .font-l-title;
	h3, .tlt ul li{
		font-family: $font-primary;
		font-size: inherit;
		text-align:inherit;
		text-transform:inherit;
		font-weight:inherit; 
		display: inline-block;
		line-height: inherit;
		margin: 0 0 .2em;
		color:$color-black; 
	}
	.mo-highlight {
		background-color: transparent;
		position: relative;
	}
	.mo-highlight-txt svg {
		position: absolute;
		top: 50%;
        left: 50%;
	}
	.mo-lines {
		display: block;
		clear: both;
	}
	a:hover{
		color: inherit;
	}
}

/* nori_heading-style */
.mo-title-box{
	.title{
		position: relative;
		font-style: normal;
		text-transform: none;
		font-style: normal;
		text-decoration: none;
		text-transform: none;
		padding-left:0; 
		padding-right:0;
		margin-bottom: 0;
		letter-spacing: -1.4px;
		font-size: 46px !important;
       line-height: 55px !important;
	}
	.sub-title{
		position: relative;
		margin-top: 0px;
		font-style: normal;
		text-transform: uppercase;
		font-size: 12px;
		line-height: 1.2em;
		font-weight: 600;
		letter-spacing: 1px;
		@extend .font-family;
	}
	.title-desc{margin-top: 20px;}
	.content{
		clear: both;
		float: inherit;
		margin-top: 20px;
		line-height: 30px;
		letter-spacing: 0px;
		font-weight: 400;
		font-style: normal;
		font-size: 16px;
	}
	&.text-center{
		.content-inner {margin: auto;}
		.title, .sub-title{ margin-left:auto; margin-right:auto; float:none; }
		.title{padding-left:25px;padding-right:25px;}
		.content{ margin-left:auto; margin-right:auto; }
	}
	&.text-right{
	    width: 100%;
	    text-align:right;
		.content-inner {float: right;}
		.title{ text-align:right; clear:both; display: contents; padding-left:100px; padding-right:0;}
		.sub-title{ text-align:right; }
	}
}
.title-box-style-1{
	.sub-title{ 
		padding-left: 0;
		text-decoration: none;
		position: relative;
		overflow: hidden;
		will-change: transform;
		-ms-word-wrap: break-word;
		word-wrap: break-word;
		@extend .color-main; 
		&:before {
			content: attr(data-title);
			height: 100%;
			position: absolute;
			width: 100%;
			top: 0;
			left: 0;
			transform: translateY(110%);
			transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
		}
		span {
			display: inline-block;
			transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
			will-change: transform;
		}
	}
	&:hover{
		h5:before { transform:translateY(0); }
		h5 span { transform:translateY(-125%); }
	}
}

.title-box-style-2{
	position:relative; margin:15px 0 0;
	padding-bottom: 15px;
	margin-left: 0;
	.title{margin-top:10px;}
	.sub-title{ 
		display: inline;
		text-transform: uppercase;
		padding: 5px 15px 5px 25px !important;
        border-radius: 50px;
	    @extend .border;
		@extend .color-main;
		svg{
			margin-right: -5px;
			margin-top: -3px;
			animation-name: float-pin;
			animation-duration: 2s;
			animation-iteration-count: infinite;
			animation-timing-function: linear;
			width: 12px;
            height: 12px;
			path{ @extend .fill-main; }
		}
	}
	&.text-left h5 { left:0; right:auto; margin-left:0; } 
	&.text-right h5 { right:40px;left:auto;max-width:none;display:block;}
}
@keyframes float-pin{
	0%  { transform: translateX(-15px);}
	50% { transform: translateX(-5px); }
	100%{ transform: translateX(-15px);}
}

.title-box-style-3{
	position:relative; margin:0px auto 20px;
	.sub-title{ 
		position: relative;
		max-width: 300px;
		display: inline-block !important;
		margin-bottom: 12px;
		color:var(--color-primary);
		@extend .bold-weight;
		span {
			position: relative;
			z-index: 2;
		}
		.mo-wave-con{
			position: absolute;
			left: 0;
			right: 0;
			bottom: -10px;
			display: block;
			width: 100%;
			overflow: hidden;
			opacity: 0.3;
		}
		svg.mo-wave-zigzag{
			position: relative;
			display: block;
			line-height: 1;
			font-size: 1px;
			color: currentColor;
			will-change:transform
			g:nth-of-type(1) path{ animation-play-state:paused;transform-origin:center}
			path {
				fill: none;
				stroke: currentColor;
				stroke-miterlimit: 10;
				stroke-width: 2;
				animation: zigzag-move 1.8s infinite linear;
				animation-play-state: paused;
			}		
		}
	 }
	.title{ margin-bottom:15px;	}
	&.text-center{
		.mo-wave-con{margin:auto;}
	}
	&.text-right{
		text-align: right;
		margin-right: 0;
		.title{display:block;}
	}
	&:hover{
		svg.mo-wave-zigzag{
			g:nth-of-type(1) path{animation-play-state:running}
			path{animation-play-state:running}
		}
	}
}
@keyframes zigzag-move{
	0%   { transform: translateX(0); }
	100%{ transform: translateX(-28px); }
}

.sub-title3{
	position: relative;
	&:before{
		content: "";
		position: absolute;
		left: 0;
		//z-index: -1;
		width: calc(100% + 6px);
		background: linear-gradient(90deg,var(--color-primary) 0%,transparent 100%);
		width: 100%;
		bottom: -1px;
		height: 8px;
		opacity: 0.5;
	}
}

.title-box-style-4 {
	width: 100%;
	clear: both;
	display: table;
	position: relative;
	.title{ 
		position: relative;
		float: left;
		letter-spacing: 0;
	}
	.sub-title{ 
		span{
			position: relative;
			max-width: 300px;
			display: inline-block !important;
			padding: 8px 15px 8px 30px  !important;
			font-size: 12px;
			line-height: 1em;
			letter-spacing: 0.7px;
			overflow: hidden;
			display: inline-flex;
			border-radius: 4px;
			border: 1px solid;
			border-image: linear-gradient(270deg, rgba(198, 176, 255, 0.03) 0%, var(--color-primary) 50%, rgba(197.64, 175.88, 255, 0.03) 100%) 1;
			@extend .bold-weight;
			@extend .color-main;
			&:after {
				content: "";
				width: 100%;
				height: 100%;
				background: currentColor;
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				opacity: 0.03;
			}
		}
		svg{
			position: absolute;
			top: 10px;
            margin-left: 15px;
			animation: spin_animat 8s ease-out infinite;
			-webkit-animation: spin_animat 8s ease-out infinite;
			opacity: 1;
			path{ fill:var(--color-primary);}
		}
	 }
	&.text-right{
		h3{ float:right; }
	}
}
.title-box-style-4.text-left h3{max-width:700px;padding-bottom:15px;}
.title-box-style-5{
	.sub-title{ 
		position: relative;
		display: block;
		@extend .color-main;
        svg{
			position: relative;
			left: 0;
			top: -2px;
			height: 15px;
			width: 15px;
			animation: push_animat2 05s infinite linear;
			animation-delay: 2s;
			path{fill: currentcolor;}
		}
	}
	&.text-center{
		.sub-title{ 
			padding:0; 
			span{ padding: 0 0 0 2px;}
			&:before, &:after { display: inline-block; }
			&:after{ margin-left: 10px;}
			&:before{ margin-right: 10px;}
		}
	}
	&.text-right{
	  .sub-title{ 
		  padding-left:0; width: auto;
		  &:after{ display: inline-block; margin-left: 10px; }
		  &:before {top:2px;float:right;right:-9px;}
	    }
	}
	&.text-left{
		h5:before{ display: inline-block; margin-right: 10px; }
	    .content{float:left; display:block; clear:both;}
	}
	&:hover svg{
		animation-play-state: running !important;
		opacity: 1;
	}
}
@keyframes move{from{background-position:2px bottom}to{background-position:500px bottom}}

.title-box-style-6{
	margin-bottom: 15px;
	.sub-title{ 
		position: relative;
		max-width: 300px;
		display: inline-block !important;
		padding: 7px 15px 9px 15px !important;
		margin-bottom: 12px;
		font-weight: 300;
		z-index: 1;
		&:after{
			content: "";
			width: 100%;
			height: 100%;
			display: block;
			left: 0;
			top: -1px;
			position: absolute;
			border-radius: 50px;
			z-index: -1;
			opacity: 0.05;
			@extend .bg-color-main; 
		}
		&:before {
			position: relative;
			top: -1px;
			border-radius: 50% 50% 50% 50%;
			content: "";
			border-radius: 50%;
			border-width: 1px;
            border-style: solid;
			text-indent: -32px;
			width: 7px;
			height: 7px;
			display: inline-block;
			overflow: hidden;
			margin-right: 7px;
			animation: flickerAnimation 0.75s infinite;
			@extend .bg-color-main; 
			@extend .border-color-main;
		}
	}
	&.text-center{
		.sub-title{ padding:0; display:inline-block; }
	}
	&.text-right{
	  .title{display: block;}
	  .sub-title{ padding-left:0; width: auto; }
	  .sub-title:before{top:3px;margin-right:0px;float:right;margin-left:7px;}
	}
}

.mo-bord-tilte{ 
	padding: 0 10px;
	display: inline-block;
	background: var(--color-primary);
	color: #fff;
	font-weight: 700;
	font-size: 45px;
	border-radius: 40px;
	-webkit-transform: rotate(-2deg);
	-ms-transform: rotate(-2deg);
	transform: rotate(-2deg);
}
.mo-bord-l-tilte{ 
	padding: 0 10px;
	display: inline-block;
	background: var(--color-primary);
	color: #fff;
	font-weight: 700;
	border-radius: 40px;
	height: 50px;
	-webkit-transform: rotate(-2deg);
	-ms-transform: rotate(-2deg);
	transform: rotate(-2deg);
}

.mo-title-box.text-right:after {
      visibility: hidden;
	  display: block;
	  font-size: 0;
	  content: " ";
	  clear: both;
	  height: 0;
}

@keyframes flickerAnimation{
	0%  {opacity: 1; }
	50% {opacity: 0; }
	100%{opacity: 1; }
}
/* fancy-image */
.fancy-image h6{
	font-size: 18px !important;
    font-weight: 500;
    line-height: 24px;
    text-transform: none;
    letter-spacing: 0;
    margin: 20px auto;
}
.fancy-image[data-shadow-style] .mo-img-container-inner figure {
	@extend .box-shadow2;
}
.fancy-image[data-roundness] .mo-img-container-inner figure {
	overflow: hidden;
	@include border-radius(4px);
}

.mo-img-group-single .ld-parallax-wrap, .mo-img-group-single figure {
    width: 100%;
}
.mo-img-container-inner {
    width: 100%;
    position: relative;
}
.block-revealer__element {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background:var(--color-grey);
    pointer-events: none;
    opacity: 0;
}
/* ------------------------------------- */
/* 3. about ............................ */
/* ------------------------------------- */
.iconbox{
  margin: 0 auto;
  overflow: hidden;
  @extend .radius25;
  h6{ 
	  text-transform: none;
      letter-spacing: 0;
	  margin: 10px auto;
	  @extend .font-l-subtitle;
   }
   .content{
	  @extend .font-family;
	  color: $color-content;
	  margin: 10px auto;
      display: block;
	  font-weight: 400;
	  font-style: normal;
	  font-size: 15px !important;
	  line-height: 25px;
	  text-transform: none;
	  letter-spacing: 0;
	  padding-top: 5px;
   }
  .thumb-service img{max-width:100%;}
  .icon-wrap{
	  line-height: 50px;
	  font-size: 50px;
	  overflow: hidden;
	   svg{ max-width:60px; max-height:60px;}
	    &:before{ @extend .bg-color-main; }
		i { @extend .color-main; }
		i.vc_li , i[class^="ion-"], i[class*=" ion-"]{ @extend .txt-fill-main; }
	}
}
.iconbox .iconbox-icon-container img[src$=".svg"],
.iconbox .iconbox-icon-container object,
.iconbox .iconbox-icon-container > svg {
  display: inline-block;
  width: 45px;
  height: 45px; 
  line-height: 0;
}
.left-align{
	.service, .image_box{ margin: 15px 0;}
}
/* nori_icon_box */
.icon-box-style1 {
	position: relative;
	max-width: 420px;
	width: 100%;
	float: left;
	padding-top: 15px;
	@include single-transition(all, .500ms, ease);
	.title-wrap{ 
		position: relative;
		padding-bottom: 10px;
		margin-top: 25px;
		h6{ text-align:center; margin-bottom:10px; margin-top:0; }
		.content{ text-align:center; }
	}
	.icon-wrap{ 
		position: relative;
		margin: auto;
		@extend .center_vertical;
		.icon{
			width: 56px;
			height: 56px;
			z-index: 1;
			text-align: center;
			svg, svg path, svg rect, svg ellipse, svg circle, svg polygon, svg polyline, svg line{ 
				stroke:var(--color-dark); 
			}
		}
		i { z-index:2; color:var(--color-dark); }
		i.vc_li , i[class^="ion-"], i[class*=" ion-"]{ z-index:2; -webkit-text-fill-color:var(--color-dark); }
	}
	.background-icon{
		position: absolute;
		z-index: -1;
		top: 40px;
		left: 50%;
		width: 80px;
		height: 80px;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		line-height: normal;
		fill: var(--color-primary);
		opacity: 0.2;
		@include single-transition(all, .500ms, ease);
	}
	.btn-arrow{
		margin: auto;
		float: none;
		display: block;
		text-align: center;
	}
	 &:hover{
		.background-icon{opacity: 1;}
		.icon-wrap{ 
			.icon{ svg, svg path, svg rect, svg ellipse, svg circle, svg polygon, svg polyline, svg line{ stroke:#fff; }}
			svg.e-font-icon-svg{fill:#fff;}
			i { color:#fff; }
			i.vc_li , i[class^="ion-"], i[class*=" ion-"]{ -webkit-text-fill-color:#fff; }
	    }
		.btn-arrow svg{ margin-left:0; }
	}
  }
.icon-box-style2 {
  @include single-transition(all, .4s, ease);
  .title-wrap{ padding-left:70px; }
  .btn-arrow svg{ margin-left: -25px; }
  .icon-wrap, .iconbox-icon-container{ 
	   position: relative;
	   overflow: hidden;
	   float:left; 
	   text-align:center;
	   vertical-align: top;
	   width: 50px;
       @include single-transition(background, .4s, ease-in-out);
	   i{@extend .color-main; font-size: 45px;}
    }
	&:hover{
		.btn-arrow svg { margin-left:0; }
	}
}
.icon-box-style2.right, .right .icon-box-style2{
  .icon-wrap{float:right; }
  .title-wrap{ padding-left:0; padding-right:75px;  }
  .content, .title-wrap h6{text-align: right; }
}
.border-left-light:after{
	content:"";
    position: absolute;
	height: 250px;
	width: 1px;
	height: 50%;
    top: 25%;
    left: 25px;
	background: rgba(255,255,255,0.2);
}
.narrow{
	.icon-box-style2 .title-wrap {padding-left: 60px;}
	.icon-box-style2 h6{ margin: 10px auto 0;}
	.icon-box-style2 .content{padding-top:0; margin-top:0;}
}
.icon-box-style3 { 
  position:relative;
  max-width: 360px;
  margin: 0;
  @include single-transition(all, 0.4s, ease-in-out);
  .title-wrap { margin-top:20px; padding-left:115px; } 
  .button.btn-txt{ padding-bottom: 0; padding-top: 0; }
  .icon-wrap{ 
	   position: relative;
	   width: 100px;
	   height: 90px;
	   float: left;
	   overflow: hidden;
	   @extend .center_vertical;
	   @include single-transition(all, .4s, ease-in-out);
	   i { @extend .color-main; @include single-transition(all, .4s, ease-in-out); }
    }
	.icon{z-index: 2;}
	.background-icon {
		position: absolute;
		z-index: 1;
		top: 65px;
		left: 50px;
		width: 100px;
		height: 100px;
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		transform: translate(-50%, -50%);
		line-height: normal;
		fill: var(--color-primary);
		opacity: 0.2;
		-webkit-transition: all 0.3s ease;
		-ms-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
	.btn_more_link .link_icon{
		width: 25px;
		height: 25px;
		line-height: 22px;
		svg{ 
			width: 25px;
			height: 25px;
			line-height: 25px;
			padding: 4px 8px 5px 6px;
		} 
	}
    &:hover{
		.btn-arrow svg{ width:30px;transition: width .3s; } 
		.mo_btn_text {
			opacity: 1;
			text-indent: 0;
			margin-right: 6px;
			visibility: visible;
			-webkit-transition: visibility .4s ease,margin-right .3s ease-out,text-indent .4s ease-out,opacity .4s ease;
			-ms-transition: visibility .4s ease,margin-right .3s ease-out,text-indent .4s ease-out,opacity .4s ease;
			transition: visibility .4s ease,margin-right .3s ease-out,text-indent .4s ease-out,opacity .4s ease;
		}
    }
}
.right .icon-box-style3{
	text-align: right;
	.title-wrap{ padding-left:0; padding-right:115px; } 
	.icon-wrap{ float:right; }
	.background-icon{ right: 49px;left: auto; transform: translate(50%, -50%) rotate(190deg);}
}

.icon-box-style4{ 
   position:relative;
   padding: 20px 30px 15px;
   z-index:1;
   background: #fff;
   overflow: hidden;
   @extend .box-shadow;
   &:before {
	    background:var(--color-primary);
		opacity: 0.1;	
		border-radius: inherit;
		position: absolute;
		content: '';
		z-index: -1;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		transform: scaleY(0);
		transform-origin: 50% 100%;
		transition: transform 0.4s ease-out;
		width: 110%;
	}
   .title-wrap{
		position: relative;
		padding-left: 75px;
		h6{
			text-decoration: none;
			position: relative;
			overflow: hidden;
			will-change: transform;
			-ms-word-wrap: break-word;
			word-wrap: break-word;
			margin: 10px auto 0;
			span {
				display: inline-block;
				transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
				will-change: transform;
			}
			&:before {
				content: attr(data-title);
				height: 100%;
				position: absolute;
				width: 100%;
				top: 0;
				left: 0;
				transform: translateY(110%);
				transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
			}
		}
	}
	.content { margin:0 0 10px; }
	.button{padding-top:0; padding-bottom:0; margin-bottom:0;}
	.icon-wrap{ 
		position: relative;
		width: 57px;
		height: 57px;
		float: left;
		overflow: hidden;
		@extend .center_vertical;
	}
	&:hover{
		.title-wrap h6:before { transform: translateY(0);}
	    .title-wrap h6 span { transform: translateY(-125%); }
		&:before{
			transform-origin: center top;
			-webkit-transform: scaleY(1);
			transform: scaleY(1);
		 }
	}
}
.bg-dark{
	.icon-box-style4{ background: rgba(255,255,255,.07); }
	.icon-box-style4:before { background: rgba(255,255,255,.05); }
}
.icon-box-style5{
	position: relative;
    overflow: visible;
    min-height: 200px;
	max-width: 400px;
	padding:20px 0 0;
	margin: 0 10px;
	-webkit-transition: all 0.5s cubic-bezier(.645,.045,.355,1);
    -o-transition: all 0.5s cubic-bezier(.645,.045,.355,1);
    transition: all 0.5s cubic-bezier(.645,.045,.355,1);
	&::before{
		content: "";
		width: 0%;
		height: 3px;
		background: var(--color-primary);
		position: absolute;
		top: 0;
		left: auto;
		right: 0;
		-webkit-transition: all 1s cubic-bezier(0.55, 0.085, 0, 0.99);
		transition: all 1s cubic-bezier(0.55, 0.085, 0, 0.99);
	}
	&::after {
		content: "";
		width: 100%;
		height: 3px;
		background: var(--color-primary);
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		opacity: 12%;
	}
	.title-wrap{
	  max-width: 320px;
	}
	.icon-wrap{ 
		position: relative;
		min-width: 27px;
		font-size: 27px;
		width: 55px;
		height: 55px;
		text-align: left !important;
		icon i{color:var(--color-primary); }
		svg path{ fill: var(--color-primary);}
	 }
   .iconbox-icon-container{ text-align:center; }
   .btn-arrow svg{ width:0; vertical-align:text-top;} 
	&:hover{
		z-index: 999;
		&::before {
			right: auto;
			left: 0;
			width: 100%;
		}
	   .mo_btn_text {
			opacity: 1;
			text-indent: 0;
			margin-right: 6px;
			visibility: visible;
			-webkit-transition: visibility .4s ease,margin-right .3s ease-out,text-indent .4s ease-out,opacity .4s ease;
			-ms-transition: visibility .4s ease,margin-right .3s ease-out,text-indent .4s ease-out,opacity .4s ease;
			transition: visibility .4s ease,margin-right .3s ease-out,text-indent .4s ease-out,opacity .4s ease;
		}
       .btn-arrow svg{ width:30px; transition: width .3s; } 
	}
  }
.bg-dark .icon-box-style5 { background:rgba(255,255,255,.07); }

.icon-box-style6 {
	position: relative;
    overflow: hidden;
	min-height: 175px;
    padding: 30px;
	background:transparent;
	@extend .border;
    transition: all 500ms ease;
    -moz-transition: all 500ms ease;
    -webkit-transition: all 500ms ease;
    -ms-transition: all 500ms ease;
    -o-transition: all 500ms ease;
	.icon-wrap {
		width: 60px;
		height: 60px;
		float: right;
		position: relative;
		@extend .center_vertical;
		&:before {
			border-radius: inherit;
			position: absolute;
			content: '';
			width: 60px;
			height: 60px;
			left: 0;
			top: 0;
			opacity: 0.1;
			-webkit-transition: all 0.5s ease;
			-o-transition: all 0.5s ease;
			transition: all 0.5s ease;
			border-radius: 50%;
			@extend .bg-color-main;
		}
	}
	.title-wrap{
		margin: auto;
		h6.title{ margin: 10px auto 0;}
	}
	.content{
		margin-top: 0;
        margin-bottom: 5px;
	}
	.icon-wrap , .title-wrap{
		-webkit-transition: -webkit-transform .35s;
		-moz-transition: -webkit-transform .35s;
		-ms-transition: -webkit-transform .35s;
		transition: transform .35s;
	}
    .button.btn-txt {	
		-webkit-transform: translate3d(0,100%,0);
		transform: translate3d(0,100%,0);
		opacity: 0;
		color:#fff;
		position: absolute;
		margin-top: 5px;
	}
	&:hover{
		  @include translateY(-20px);
		  @extend .box-shadow2;
		  @extend .bg-color-main;
		  h6{ opacity:1; color:#fff; }
		 .content{ opacity:1; color:rgba(255,255,255,0.8); }
		 svg path{fill:#fff;}
		 .icon-wrap{
				-webkit-transform: translate3d(0,-120%,0) translate3d(0,-120px,0);
				-moz-transform: translate3d(0,-120%,0) translate3d(0,-120px,0);
				-ms-transform: translate3d(0,-120%,0) translate2d(0,-120px,0);
				transform: translate3d(0,-120%,0) translate3d(0,-120px,0);
		  }
		.title-wrap{ transform:translateY(-15px); }
		.button.btn-txt {		
		 	opacity: 1;
			-webkit-transform: translateZ(0);
			transform: translateZ(0);
		}
	}
}
.bg-dark .icon-box-style6{ background:rgba(255,255,255,.07); }
.bg-dark .icon-box-style6:hover:before{ background:rgba(255,255,255,.05); }

.icon-box-style7{
	position: relative;
	min-height: 130px;
	@include single-transition(all, .4s, ease);
    .icon-wrap{ 
	   font-size:60px; 
	   margin-bottom:20px; 
	   position: relative;
	   width: 60px;
	   height: 60px;
       margin-top: 15px;
	   border-radius: 0;
	   margin-bottom: 0;
	   svg{z-index: 2;}
	   i { z-index: 2; @include single-transition(background, .4s, ease-in-out); }
	}
	.button{
		margin-top: 5px;
	}
	.title-wrap {
		position: relative;
		 h6{
			text-decoration: none;
			position: relative;
			will-change: transform;
			-ms-word-wrap: break-word;
			word-wrap: break-word;
			border-bottom:2px solid rgba(0,0,0,0.05);
			border-radius: 0px;
			padding-bottom: 20px;
			-webkit-transition: all .25s cubic-bezier(.645,.045,.355,1);
			-moz-transition: all .25s cubic-bezier(.645, .045, .355, 1);
			-ms-transition: all .25s cubic-bezier(.645, .045, .355, 1);
			-o-transition: all .25s cubic-bezier(.645, .045, .355, 1);
			transition: all .25s cubic-bezier(.645,.045,.355,1);
			span {
				display: inline-block;
				transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
				will-change: transform;
				
			}
		}
	}
	&:hover{
		.btn-arrow svg{ margin-left:0; }
		.title-wrap h6{ border-color: var(--color-primary);}
		.icon-wrap svg, .icon-wrap i{ animation: bounceIn 1.2s linear;}
	}
}
.bg-dark .icon-box-style7{ background:rgba(255,255,255,.07); }
.bg-dark .icon-box-style7:before{ background:rgba(255,255,255,.05); }

.icon-box-style8 {
	position: relative;
	background: #fff;
	padding: 20px 30px;
	min-height: 150px;
	overflow: visible;
	transition: box-shadow 0.3s ease, background 0.3s ease;
	@extend .box-shadow;
	.icon-wrap, .title-wrap, .content{ position:relative; z-index:2; }
	.title-wrap{ margin-right:50px; }
	.button{ padding-top:0; padding-bottom:0; margin: 0; }
	.icon-wrap{ 
		font-size:50px;
		float: left; 
		width: 100px;
		height: 100px;
		background: linear-gradient(99deg, #F8F8F8 6.12%, #FFF 96.98%);
		border-radius: 50%;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		-o-border-radius: 50%;
		margin-right: 10px;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-top: -10px;
		margin-bottom: 30px
	}
	.title-wrap h6{margin: 10px auto 5px;}
	.content{ margin-top: 5px;}
	.btn-arrow{
		position: absolute;
		top: 50%;
		right: -55px;
		width: 50px;
		height: 50px;
		border-radius: 50%;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		-ms-border-radius: 50%;
		-o-border-radius: 50%;
		align-items: center; 
		justify-content: center;
		-webkit-transform: translateY(-50%) rotate(-50deg);
		-ms-transform: translateY(-50%) rotate(-50deg);
		transform: translateY(-50%) rotate(-50deg);
		-webkit-transition: 0.3s cubic-bezier(0.67, 0.04, 0.3, 0.91);
		-o-transition: 0.3s cubic-bezier(0.67, 0.04, 0.3, 0.91);
		transition: 0.3s cubic-bezier(0.67, 0.04, 0.3, 0.91);
		.mo_btn_text{
			position: relative;
			left: 28px;
			top: 15px;
			svg{
				width: 30px;
				height: 30px;
				top: -5px;
				right: 18px;
				opacity: 0.6;
			}
		}
		&:hover svg { margin-left:-10px }
		&:after{
			content: "";
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			display: block;
			opacity: 0.05;
			@extend .bg-color-main; 
		}
	}
	&:hover{
	   @extend .box-shadow2;
	}
}
.bg-dark .icon-box-style8{ background:rgba(255,255,255,.07);}

.icon-box-style9{ 
   position:relative;
   z-index:1;
   overflow: hidden;
   padding: 40px;
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
	&:after{
		content: "";
		width: 100%;
		height: 100%;
		opacity: 0.05;
		z-index: -1;
		position: absolute;
		left: 0;
		top: 0;
		@extend .bg-color-main;
	}
  .icon-wrap{
	position: relative;
    float: none;
    display: block;
    text-align: left;
	line-height: 50px;
	i { @extend .color-main;  @include single-transition(background, .4s, ease-in-out); }
	i.vc_li , i[class^="ion-"], i[class*=" ion-"]{ @extend .txt-fill-main; }
  }
 .iconbox-icon-container { svg, svg path, svg rect, svg ellipse, svg circle, svg polygon, svg polyline, svg line{ @extend .stroke-color-main; }}
  .button{margin: 0;}
  .title-wrap{ 
	  position:relative;
      h6{
		text-decoration: none;
		position: relative;
		overflow: hidden;
		will-change: transform;
		-ms-word-wrap: break-word;
		word-wrap: break-word;
		span {
			display: inline-block;
			transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
			will-change: transform;
		}
		&:before {
			content: attr(data-title);
			height: 100%;
			position: absolute;
			width: 100%;
			top: 0;
			left: 0;
			transform: translateY(110%);
			transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
		}
	 }
  }
  &:hover {
	-moz-transform: translateY(-20px);
    -o-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px); 
	.title-wrap h6:before { transform: translateY(0); @extend .color-main; }
	.title-wrap h6 span { transform: translateY(-125%); }
	}
}
.bg-dark .icon-box-style9{
	  border-color:rgba(255,255,255,0.2);
	  .title-wrap h6, .title-wrap .content{ color:#fff;}
}

.icon-box-style10{ 
	position:relative;
	z-index:1;
    padding: 44px 15px 41px 15px;
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #C6C6C6;
	text-align: center;
	@include border-radius(20px);
	transition:all .3s ease;
	&:before{
		content: '';
		display: inline-block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 0;
		opacity: 0.05;
		border-radius: inherit;
		background:var(--color-primary);
	 }
    .icon-wrap{
		position: relative;
		float: none;
		display: block;
		text-align: left;
		line-height: 50px;
		text-align: center;
		margin: auto;
		display: block;
		i { @extend .color-main;  @include single-transition(background, .4s, ease-in-out); }
		i.vc_li , i[class^="ion-"], i[class*=" ion-"]{ @extend .txt-fill-main; }
    }
   .iconbox-icon-container { svg, svg path, svg rect, svg ellipse, svg circle, svg polygon, svg polyline, svg line{ @extend .stroke-color-main; }}
   .button{margin: 0;}
   .title-wrap{ 
	   position:relative;
	   h6{
		 text-decoration: none;
		 position: relative;
		 overflow: hidden;
		 will-change: transform;
		 -ms-word-wrap: break-word;
		 word-wrap: break-word;
		 span {
			 display: inline-block;
			 transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
			 will-change: transform;
		 }
		 &:before {
			 content: attr(data-title);
			 height: 100%;
			 position: absolute;
			 width: 100%;
			 top: 0;
			 left: 0;
			 transform: translateY(110%);
			 transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
		 }
	  }
   }
   &:hover {
	 border-color:var(--color-primary);
	 .title-wrap h6:before { transform: translateY(0); @extend .color-main; }
	 .title-wrap h6 span { transform: translateY(-125%); }
	}
}
.bg-dark .icon-box-style10{
	background: var(--color-font);
	&:before{background: var(--color-font);}
	&:hover{ background: var(--color-font);}
}
.iconbox.icon-box-style1, .iconbox.icon-box-style4, .iconbox.icon-box-style6, .iconbox.icon-box-style7{
	.icon-wrap { font-size:35px; }
	.iconbox-icon-container > svg{ width:35px; height:35px; }
}
.iconbox.icon-box-style5{
	.icon-wrap { font-size:35px; text-align:center; padding-top: 5px;}
	.iconbox-icon-container > svg{ width:45px; height:45px; }
}
/* iconbox-icon svg*/
.iconbox .iconbox-icon-container i,
.iconbox .iconbox-icon-container img,
.iconbox .iconbox-icon-container object,
.iconbox .iconbox-icon-container > svg {
  position: relative;
  z-index: 2;
}
.iconbox .iconbox-icon-container img[src$=".svg"] stop,
.iconbox .iconbox-icon-container object stop,
.iconbox .iconbox-icon-container > svg stop {
  transition: stop-color 0.3s ease;
}

.iconbox .iconbox-icon-container > svg,
.iconbox .iconbox-icon-container > svg path,
.iconbox .iconbox-icon-container > svg rect,
.iconbox .iconbox-icon-container > svg ellipse,
.iconbox .iconbox-icon-container > svg circle,
.iconbox .iconbox-icon-container > svg polygon,
.iconbox .iconbox-icon-container > svg polyline {
  transition: fill 0.3s, stroke 0.3s;
}

.iconbox .iconbox-icon-container i {
  display: inline-block;
  font-size: 1em;
}

.iconbox .iconbox-icon-container[data-plugin-animated-icon] {
  font-size: 1em;
  line-height: 1em !important;
}
.iconbox .iconbox-icon-container[data-plugin-animated-icon] > svg,
.iconbox .iconbox-icon-container[data-plugin-animated-icon] object {
  opacity: 0;
}
.iconbox-square .iconbox-icon-container i,
.iconbox-square .iconbox-icon-container img[src$=".svg"],
.iconbox-square .iconbox-icon-container object,
.iconbox-square .iconbox-icon-container > svg,
.iconbox-circle .iconbox-icon-container i,
.iconbox-circle .iconbox-icon-container img[src$=".svg"],
.iconbox-circle .iconbox-icon-container object,
.iconbox-circle .iconbox-icon-container > svg,
.iconbox-lozenge .iconbox-icon-container i,
.iconbox-lozenge .iconbox-icon-container img[src$=".svg"],
.iconbox-lozenge .iconbox-icon-container object,
.iconbox-lozenge .iconbox-icon-container > svg {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}
.iconbox-circle .iconbox-icon-container img[src$=".svg"],
.iconbox-circle .iconbox-icon-container object,
.iconbox-circle .iconbox-icon-container > svg,
.iconbox-lozenge .iconbox-icon-container img[src$=".svg"],
.iconbox-lozenge .iconbox-icon-container object,
.iconbox-lozenge .iconbox-icon-container > svg,
.iconbox-hexagon .iconbox-icon-container img[src$=".svg"],
.iconbox-hexagon .iconbox-icon-container object,
.iconbox-hexagon .iconbox-icon-container > svg,
.iconbox-square .iconbox-icon-container img[src$=".svg"],
.iconbox-square .iconbox-icon-container object,
.iconbox-square .iconbox-icon-container > svg {
  width: 50px;
}
[data-animate-icon=true] .iconbox-icon-container > svg,
[data-animate-icon=true] .iconbox-icon-container > object {
  opacity: 0;
}

[data-animate-icon=true].iconbox-icon-animating .iconbox-icon-container > svg,
[data-animate-icon=true].iconbox-icon-animating .iconbox-icon-container > object {
  opacity: 1;
}

/* process box */
.process-box{
	h6 {
		text-transform: none;
		@extend .font-subtitle;
	}
	.number-icon-wrap {
		position: relative;
	}
	.icon-wrap{
		svg {
			width: 43px;
			height: 43px;
			max-width: 50px;
			max-height: 50px;
		}
		i {
			font-size: 47px;
		}
	}
	.content {
		color: $color-content;
		margin: 10px auto;
		display: block;
		font-weight: 400;
		font-style: normal;
		font-size: 15px;
		line-height: 25px;
		text-transform: none;
		letter-spacing: 0;
		padding-top: 5px;
	}
}

.process-box-style1 {
  position: relative;
  margin-top: 20px;
  margin-bottom: 20px;
  padding-right: 15px;
  @include single-transition(all, .4s, ease);
  .process-wrap{
		max-width: 320px;
		&:before, &:after{
		    display: block;
			position: absolute;
			content: '';
			top: 20px;
			left: 40px;
			width: 100%;
			height: 2px;
			z-index: 1;
		}
	    &:before{
			background-color: #e6e4ef;
		}
		&:after{
 			background: -webkit-linear-gradient(0,var(--color-primary) 0%,#e6eaef 77%);
			transform-origin: top left;
			-moz-transform: scale(0, 1);
			-ms-transform: scale(0, 1);
			-webkit-transform: scale(0, 1);
			transform: scale(0, 1);
			-webkit-transition: all 300ms linear;
			-moz-transition: all 300ms linear;
			-ms-transition: all 300ms linear;
			-o-transition: all 300ms linear;
			transition: all 300ms linear;
		}
		.icon-wrap{
			float: left;
			margin-right: 17px;
		}
		.button{ padding-top: 0; padding-bottom: 0; margin-top: 10px; }
	 }
	.number-step{
		position: relative;
		z-index: 1;
		width: 42px;
		height: 42px;
		margin-bottom: 15px;
		overflow: hidden;
		@extend .radius50;
		&:before {
			position: absolute;
			content: '';
			z-index: -1;
			width: 100%;
			height: 100%;
			@extend .bg-color-main;
			@include single-transition(all, .4s, ease-in-out); 
		}
		&:after {
			font: normal normal normal 14px/1 FontAwesome;
			font-size: inherit;
			text-rendering: auto;
			content: "\f00c";
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			color: #fff;
			width: 100%;
			height: 100%;
			line-height: 2.5;
			padding-left: 13px;
			opacity: 0;
			@extend .bg-color-main;
			@include single-transition(all, .4s, ease-in-out); 
		}
		h3{   
			line-height: 42px;
			text-align: center;
			display: block;
			color:#fff;
			font-weight: 500;
			font-size: 18px;
			@include single-transition(all, .4s, ease-in-out); 
		}
	}
	&:hover{
		.process-wrap:after{
			-moz-transform: scale(1, 1);
			-ms-transform: scale(1, 1);
			-webkit-transform: scale(1, 1);
			transform: scale(1, 1);
		} 
		.number-step:after{ opacity:1; }
		.btn-arrow svg {margin-left: 0;}
	}
}
.bg-dark .process-box-style1 .process-wrap:before { background-color: rgba(255,255,255,0.1); }
/* process box 2 */
.process-box-style2 {
  position: relative;
  max-width: 300px;
  min-height: 380px;
  width: 100%;
  float: left;
  padding: 50px 20px;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  border-color: rgba(10, 29, 53, 0.1);
  border-image: initial;
  border-radius: 166px;
  text-align: center;
  background: rgba(255,255,255,0.3);
  @include single-transition(all, .2s, ease);
  .number-icon-wrap{
	position: relative;
	.icon-wrap{ 
		position: relative;
		width: 90px;
		height: 90px;
		opacity:1;
		margin:20px auto;
		border-radius: 50%;
		@extend .center_vertical;
		@include single-transition(all, .35s, ease-in-out);
		&:before {
		   border-radius: inherit;
		   position: absolute;
		   content: '';
		   z-index:1;
		   width: 100%;
		   height: 100%;
		   left: 0;
		   top: 0;
		   opacity: 0.1;
		   @extend .bg-color-main;
		   @include scale(1.1);	
	   }
	   i { @extend .color-main; }
	}	
	.number-step{
		position: absolute;
		height: 35px;
		width: 35px;
		line-height: 35px;
		border-radius: 50%;
		left: -60px;
		right: 0;
		top: 0;
		z-index: 2;
		margin: auto;
		overflow: hidden;
		text-align: center;
        background: var(--color-primary);
		h3{
		    margin-bottom:0; 
			font-weight: 500;
			font-size: 16px;
			line-height: 36px;
			color: #fff;
		}
	}
  }
  .btn-arrow {
	margin:auto; 
	svg{border: 1px solid rgba(0, 0, 0, 0.1);}
  }
  &:hover{
	border-color:var(--color-primary);
	.btn-arrow svg {margin-left: 0;}
  }
}
.elementor-section .elementor-column:last-child .process-box-style2 .process-wrap:before{ content: none; }

/* process box 3 */
.process-box-style3 {
	position: relative;
	padding: 40px 40px 38px 40px;
	background: #fff;
	@extend .border;
	@extend .radius25;
	@include single-transition(all, .35s, ease-in-out);
	&:before{
		content: "\f061";
		font-family: "FontAwesome";
		font-weight: 900;
		font-size: 14px;
		position: absolute;
		top: calc( 50% - 20px );
		right: -30px;
		z-index: 1;
		width: 52px;
		height: 52px;
		color: #fff;
		padding: 11px 18px;
		font-size: 20px;
		display: block;
		@extend .radius50;
		@extend .bg-color-main;
	}
	.number-step, .icon-wrap{
		position: relative;
		width: 65px;
		height: 65px;
		padding: 9px;
		margin-bottom: 15px;
		@extend .border;
		@extend .radius50;
		@include single-transition(all, .4s, ease-in-out);
		h3 { 
			margin-bottom: 0;
			font-weight: 500;
			font-size: 30px;
			line-height: 44px;
			text-align: center;
			@extend .color-main;
		}
	}
	.icon-wrap{
		position: absolute;
        top: 0;
		opacity: 0;
		i{@extend .color-main;}
	}
	.process-link{ margin-top:10px; }
	&:hover{		
		.number-step{ 
			-ms-transform: rotateY(-180deg);
			-webkit-transform: rotateY(-180deg);
			transform: rotateY(-180deg);
			opacity:0;
		 }
		.icon-wrap{ opacity:1; }
		.btn-arrow svg {margin-left: 0;}
	}
}
.elementor-section .elementor-column:last-child .process-box-style3:before{ content: none; }
.elementor-column-gap-no .process-box-style3{ border-right: 0;}
.elementor-section .elementor-column:last-child .process-box-style3{ 
	border-right-width: 1px;
	border-right-style: solid;
	@extend .borde-color;
}
.elementor-widget-mo-process_box {
    margin-bottom: 0;
    margin-block-end: 0 !important;
}
/* process box 4 */
.process-box-style4 {
	.process-wrap{
		display: grid;
		-ms-grid-columns: 0.7fr 2fr 2.5fr 1fr;
		grid-template-columns: 0.7fr 2fr 2.5fr 0.5fr;
		-webkit-box-align: center;
		-ms-flex-align: center;
		align-items: center;
		padding: 15px 0;
		border-bottom-width: 1px;
		border-bottom-style: solid;
		@extend .borde-color;
		-webkit-transition: all 0.3s;
		transition: all 0.3s;
		&::before{ display:none;}
		&::after{
			content: "";
			position: absolute;
			width: 0;
			right: 0;
			top: -1px;
			height: 1px;
			transition: all 0.2s ease-in-out 0s;
			@extend .bg-color-main;
		}
		.title{ margin-left: 40px;}
		.process-link {
			text-align: right;
		}
		.icon-wrap{
		  position: absolute;
		  right: -30px;
          top: -3px;
		  svg { width: 32px; height: 34px }
		  i { font-size: 28px;}
		}
	}
	.number-step {
		margin-bottom: 15px;
		@include single-transition(all, .4s, ease-in-out);
		h3 { 
			margin-bottom: 0;
			font-size: 18px;
			line-height: 26px;
			text-align: center;
			@extend .color-main;
		}
	}
	&:hover {
		.process-wrap::after {
			right: auto;
			width: 100%;
			left: 0;
		}
		.button.btn-txt-arrow svg.svg-arrow path:nth-of-type(1) {
			transform: translate(12px, -12px);
			transition: transform .2s ease-in;
		}
		.button.btn-txt-arrow svg.svg-arrow path:nth-of-type(2) {
			transform: translate(0, 0);
			transition: transform .2s ease-out .2s;
		}
	}
}
.elementor-widget-wrap .elementor-widget-mo-process_box:first-child .process-box-style4 .process-wrap{ 
	border-top-width: 1px;
	border-top-style: solid;
	@extend .borde-color;
}
/* img perspective */
.img-perspective {
    position: absolute;
    position: relative;
    height: 100%;
    width: 100%;
    display: block;
	box-sizing: border-box;
}
.img-perspective img {
    margin: 0;
    width: 100%;
    height: 100% !important;
	object-fit: cover;
    display: block;
	transition: transform .65s cubic-bezier(.23,1,.32,1);
}
.perspective_overlay{
    width: 100%;
    height: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
	left: 0;
	z-index: 0;
    pointer-events: none;
	@extend .bg-overlay;
	@include single-transition(all, .4s, ease-in-out);
}
.no_overlay .perspective_overlay{
	background-color: transparent;
}
.perspective-caption{
	width: 100%;
    padding: 50px;
    bottom: 0;
    height: auto;
	color:#fff;
    box-sizing: border-box;
    position: absolute;
	pointer-events: none;
	-webkit-transition: all .5s cubic-bezier(0.25, 0.8, 0.25, 1);
    transition: all .5s cubic-bezier(0.25, 0.8, 0.25, 1);
	.perspective-title {
		position: relative;
		z-index: 3;
		color: #fff;
   }
}
.vc_col-sm-3{
	.perspective-caption { 
		 padding: 25px 35px; 
		.perspective-title { font-size:18px !important; }
	}
}

/* img-paper effect */
.img-paper {
    //width: 633px;
  //  height: 575px;
    position: relative;
    background: url(../images/paper-shape.png) no-repeat 100%;
    background-size: cover;
    //margin-left: -100px;
	img{
		mix-blend-mode: lighten; 
		max-width: 100%;
		object-fit: cover;
		display: block;
		//width: 633px;
		//height: 575px;
	}
}
/* nori_image_box  */
.image-box {
    @extend .radius25;
	.title-wrap h6 , .perspective-caption .perspective-title{
		margin-top: 0;
		@extend .font-l-subtitle;
	}
	.icon-wrap {
		line-height: 50px;
		font-size: 50px;
		> svg{
			width: 42px;
			height: 42px;
		}
	}
	.sup-title{
		@extend .font-family;
		font-style: normal;
		font-size: 12px;
		//text-transform: uppercase;
		line-height: 1.2em;
		font-weight: 600;
		letter-spacing: 1px;
		text-decoration: none;
		position: relative;
		overflow: hidden;
		will-change: transform;
		-ms-word-wrap: break-word;
		word-wrap: break-word;
		margin-bottom: 8px;
		@extend .color-main; 
		span {
			display: inline-block;
			transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
			will-change: transform;
		}
		&:before{
			content: attr(data-title);
			height: 100%;
			position: absolute;
			width: 100%;
			top: 0;
			left: 0;
			transform: translateY(110%);
			transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
		}
	
	}
	.content{ 
		margin:0;
		font-size: 15px;
		line-height: 25px;
		@extend .font-family;
	}
	&:hover{
		.sup-title{ 
			span { transform: translateY(-125%); }
			&:before{transform: translateY(0);}
		}
	}
}

.image-box-style1 { 
	position: relative;
    overflow: hidden;
	min-height: 350px;
	transition: transform .65s cubic-bezier(.23,1,.32,1);
	.img-perspective img{min-height: 350px;}
	.perspective-caption {
		pointer-events: visible;
	}
	.perspective_overlay{
		height: 80%;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, var(--color-dark) 100%);
	}
	.perspective-title{ 
		margin-top:10px;
		pointer-events: none;
	 }
	.icon-wrap{ margin-bottom:10px; transition:all 0.4s ease-out; }
	.icon-wrap {
		i{ color:#fff; }
		> svg {
			stroke: #fff;
			rect, path, polyline{ stroke: #fff; }
			g, path{fill:#fff; }
		}
	}
	.sup-title{ opacity:.7; transition: opacity .3s; color:#fff;}
	.content{opacity:0; display:none; margin-bottom:15px; margin-top:10px;}
	.btn_more_link{
		color:#fff;
		svg path{fill: #fff;}
	}
	&:hover{
		transform: scale3d(1.09,1.09,1);
		@extend .box-shadow2;
		.img-perspective img {
			-webkit-transform: scale(1);
			transform: scale(1);
			opacity: 1;
		}
		.perspective-caption {
			-moz-transform: translateY(-65px);
			-ms-transform: translateY(-65px);
			-webkit-transform: translateY(-65px);
			transform: translateY(-10px);
		}
		.content {opacity: 0.9; display:block; }
	}
}

.image-box-style2{
    -webkit-perspective: 1000;
    -moz-perspective: 1000;
    -ms-perspective: 1000;
    perspective: 1000;
    -webkit-transform: perspective(1000px);
    -moz-transform: perspective(1000px);
    -ms-transform: perspective(1000px);
    transform: perspective(1000px);
    -moz-transform-style: preserve-3d;
    position: relative;
	width: 100%;
	height: 350px;
	.box, .box2 {
		width: 100%;
		height: 100%;
		background-size: cover;
		background-position: center center;
		-ms-transition: transform .6s cubic-bezier(.5,.3,.3,1);
		transition: transform .6s cubic-bezier(.5,.3,.3,1);
		-webkit-transition: transform .6s cubic-bezier(.5,.3,.3,1);
		overflow: hidden;
		position: absolute;
		top: 0;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
		transform-style: preserve-3d;
		z-index: 1;
		@extend .radius25;
	}
	.box {
		-webkit-transform: rotateY(0deg);
		-moz-transform: rotateY(0deg);
		-o-transform: rotateY(0deg);
		-ms-transform: rotateY(0deg);
		transform: rotateY(0deg);
	}
	.box2 {
		-webkit-transform: rotateY(180deg);
		-moz-transform: rotateY(180deg);
		-o-transform: rotateY(180deg);
		-ms-transform: rotateY(180deg);
		transform: rotateY(180deg);
	}
	.box-container, .box-container2 {
		padding: 30px 40px 30px 40px;
		position: absolute;
		top: auto;
		bottom: 0;
		transform-style: preserve-3d;
		z-index: 2;
		text-align: center;
		left: 0;
		right: 0;
		h6{color:#fff;}
		.content{margin-bottom:10px; color:rgba(255,255,255,.8);}
		.button.btn-txt-underlined{ margin:0;}
	}
	.box-container {
        -ms-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
		transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
		-webkit-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
	}
	.box-container2 {
		-ms-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
		transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
		-webkit-transition: transform 0.60s cubic-bezier(.5,.3,.3,1);
		-webkit-transform: translateY(0) translateX(650px) translateZ(60px) scale(.88);
		-ms-transform: translateY(0) translateX(650px) translateZ(60px) scale(.88);
		transform: translateY(0) translateX(650px) translateZ(60px) scale(.88);
	}
	.box-overlay {
		display: block;
		width: 100%;
		position: absolute;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, var(--color-dark) 100%);
		height: 80%;
		bottom: 0;
		top: auto;
	}
	.title-wrap h6{ @extend .font-subtitle; }
	.sup-title{ @extend .color-main; }
	.button.btn-txt-arrow svg.svg-arrow path{ @extend .stroke-color-main; }
	.icon-wrap {
		position: relative;
		width: 50px;
		height: 50px;
		color:#fff;
		margin: 10px auto;
		@extend .center_vertical;
		@include border-radius(5px);
		@include single-transition(all, .4s, ease-in-out);
	}
	.icon-wrap {
		i{ color:#fff; }
		> svg {
			stroke: #fff;
			rect, path, polyline{ stroke: #fff; }
		}
	}
	&:hover{
		.box {
			-webkit-transform: rotateY(-180deg);
			-moz-transform: rotateY(-180deg);
			-o-transform: rotateY(-180deg);
			-ms-transform: rotateY(-180deg);
			transform: rotateY(-180deg);
			transform-style: preserve-3d;
		}
		.box2 {
			-webkit-transform: rotateY(0deg);
			-moz-transform: rotateY(0deg);
			-o-transform: rotateY(0deg);
			-ms-transform: rotateY(0deg);
			transform: rotateY(0deg);
			transform-style: preserve-3d;
		}
		.box-container {
			-webkit-transform: translateY(0%) translateX(-650px) scale(.88);
			-ms-transform: translateY(0%) translateX(-650px) scale(.88);
			transform: translateY(0%) translateX(-650px) scale(.88);
			transform-style: preserve-3d;
		}
		.box-container2 {
			-webkit-transform: translateY(0) translateX(0) translateZ(0) scale(1);
			-ms-transform: translateY(0) translateX(0) translateZ(0) scale(1);
			transform: translateY(0) translateX(0) translateZ(0) scale(1);
			transform-style: preserve-3d;
		}
	}
}
.bg-dark .image-box-style2 .box-container2 .content p {
    color: rgba(255, 255, 255, 1);
}
.image-box-style3 {
	position: relative;
	overflow: hidden;
	background: #fff;
	min-height: 320px;
	-webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
	@extend .box-shadow;
	.image-bg{
		height: 100%;
		left: 0;
		position: absolute;
		top: 0;
		width: 100%;
		z-index: 1;
		@include single-transition(all, .3s, ease-in-out);
		&:after, &:before {
			content: "";
			height: 100%;
			left: -5%;
			position: absolute;
			top: 0;
			width: 120%;
		}
		&:before {
			opacity:1; transform: translateX(0);
            opacity: 0.05; 
			@extend .bg-color-main;
		}
		&:after { 
			opacity: 0;
			z-index: 0;
			background: rgba(0, 0, 0, 0.6);
		}
	}
	.thumb-service img{opacity:0;}	
	.title-wrap{
		width: 100%;
		box-sizing: border-box;
		position: absolute;
		z-index: 1;
		pointer-events: none;
		padding: 40px 40px 0;
		top: 0;
		height: 100%;
		.icon-wrap {
			position: relative;
			text-align: left;
			line-height: 35px;
			font-size: 35px;
			display: inline-block;
			margin-bottom: 20px;
			@extend .center_vertical;
			@include single-transition(all, .4s, ease-in-out);
			i{ @extend .color-main; }
			> svg {
				width: 35px;
				height: 35px;
				@extend .stroke-color-main;
				rect, path, polyline{ @extend .stroke-color-main; }
			}
		}
		.button{ 
			margin-top:15px;
			pointer-events:auto;
			position: absolute;
			bottom: 30px;
			@include single-transition(all, .0s, ease-in-out);
		}
	}
	.thumb-service img{
		-webkit-transform: scale(1.08) translate3d(0, -10px, 0);
		-moz-transform: scale(1.08) translate3d(0, -10px, 0);
		transform: scale(1.08) translate3d(0, -10px, 0);
		-webkit-transition: -webkit-transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
		-moz-transition: -moz-transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
		transition: transform 0.6s cubic-bezier(0.23, 1, 0.32, 1);
		will-change: transform;
		width: 100%;
		height: 100% !important;
		object-fit: cover;
		display: block;
		min-height: 320px;
	}	
	&:hover {
		transform: scale(1.08) translateZ(0);
		@extend .box-shadow2;
		.title-wrap{
			h6{color: #fff;}
			.content{color: rgba(255,255,255,0.8);}
			.button{ color:#fff;}
		}
		.thumb-service img{
			opacity: 1;
			transition-duration: 7s;
			transform: scale(1.2);
			-webkit-transition: -webkit-transform 1s cubic-bezier(0.23, 1, 0.32, 1);
			-moz-transition: -moz-transform 1s cubic-bezier(0.23, 1, 0.32, 1);
			transition: transform 1s cubic-bezier(0.23, 1, 0.32, 1);
		}
		.image-bg:after{ opacity:1; }
		.icon-wrap:after { background: rgba(0,0,0,0.1); }
		.image-bg:before {
			animation-delay: 0s;
			animation-direction: normal;
			animation-duration: .3s;
			animation-fill-mode: both;
			animation-iteration-count: 1;
			animation-name: translateY-hover;
			animation-timing-function: cubic-bezier(.215,.61,.355,1);
		}
		.image-bg:after {
			-webkit-transform: scaleY(1);
			transform: scaleY(1);
		}
	}
}
@keyframes translateY-hover{
	0%{transform:translateY(0);transform-origin:100% 0}
	to{transform:translateY(100%);transform-origin:100% 0}
}
@keyframes translateY-hover2{
	0%{transform:translateY(-100%);transform-origin:0 0}
	to{transform:translateY(0);transform-origin:0 0}
}
.image-box-style4{
	position: relative;
	margin-left: auto;
    margin-right: auto;
	overflow: hidden;
	text-align: center;
	transition: transform 0.65s cubic-bezier(0.23, 1, 0.32, 1), background 0.4s;
	.img-perspective2{
		overflow: hidden;
		height: 400px;
		object-fit: cover;
        min-height: 100%;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
		-webkit-transition: all .3;
		transition: all .3s;
		background-clip: content-box;
		filter:grayscale(60%); 
	}
	.perspective-caption {
		padding: 40px 30px;
		.content{text-align: center;}
	}
	.perspective_overlay{
		background: linear-gradient(0deg, var(--color-primary) 0%, rgba(0, 0, 0, 0.2) 45%);
	}
	.perspective-title{
		text-align: center;
		top: 0;
	}
	.icon-wrap {
		margin-bottom: 10px;
		i{color:#fff; }
		svg, svg path, svg rect, svg ellipse, svg circle, svg polygon, svg polyline, svg line{ stroke:#fff; }
	}
	.sup-title{color:rgba(255,255,255,0.7);}
	.content{
        text-align: left;
		margin-bottom: 10px;
		@include single-transition(all, .3s, ease-in-out);
	}
	.button { 
		pointer-events:auto;
		svg.svg-arrow {
			width: 15px;
			height: 15px;
			margin-left: 0;
			path { stroke: #fff; }
		}
		&:hover svg.svg-arrow path{stroke: #fff;}
	}
	&:hover{
		@extend .box-shadow2;
		.sup-title{color:var(--color-primary);}
		.img-perspective2 { transform: scale3d(1,1,1); filter:grayscale(0); }
		.perspective_overlay{
			background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, var(--color-dark) 80%) !important;
		}
	} 
} 
.image-box-style5{
	position: relative;
	margin-left: auto;
    margin-right: auto;
	overflow: hidden;
	@include single-transition(all, .4s, ease-in-out);
	.img-perspective2{
		overflow: hidden;
		height: 400px;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
		background-clip: content-box;
		-webkit-transition: all 1.5s cubic-bezier(0, 0, 0.2, 1);
        transition: all 1.5s cubic-bezier(0, 0, 0.2, 1);
	}
	.perspective_overlay{
		height: 75%;
        opacity: 1;
		background:linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, var(--color-primary) 100%);
	}
	.perspective-caption {
		padding: 40px 40px 30px;
		pointer-events: auto;
	}
	.sup-title{ color:#fff;}
	.btn-arrow{
		svg path{ fill:#fff;}
	}
	.perspective-caption .icon-wrap {
			font-size: 35px;
			position: relative;
			text-align: center;
			width: 75px;
			height: 75px;
		&:after, &:before{
			content: "";
			width: 75px;
			height: 75px;
			position: absolute;
			border-radius: 50%;
			box-sizing: border-box;
			display: block;
			left: 1px;
			top: -13px;
		}
		&:after{
			border: 1px solid rgba(255,255,255,0.5);
		}
		&:before{
			border: 1px solid transparent;
		}
		i{
			position: relative;
			z-index: 99;
			color:#fff;
		}
		svg{
			position: relative;
			z-index: 999;
		}
		svg, svg path, svg rect, svg ellipse, svg circle, svg polygon, svg polyline, svg line {
			stroke: #fff;
		}
	}
	.content{
        text-align: left;
		opacity: 0.9;
		@include single-transition(all, .3s, ease-in-out);
	}
	&:hover{
		box-shadow: 4px 25px 46px 3px rgba(0, 0, 0, 0.5);
		.perspective-caption .icon-wrap:before {
	    	animation: mo-menu-circle-border-wh 1s forwards;
		}
		.img-perspective2 { 
			filter: grayscale(80%);
			-webkit-transform: scale3d(1.1, 1.1, 1.1);
            transform: scale3d(1.1, 1.1, 1.1);
		}
	}
} 

.image-box-style6 {
	-webkit-transition: transform 0.5s cubic-bezier(0.8, 0.8, 0.8, 0.8);
    -moz-transition: transform 0.5s cubic-bezier(0.8, 0.8, 0.8, 0.8);
    transition: transform 0.5s cubic-bezier(0.8, 0.8, 0.8, 0.8);
	.thumb-service{
		position: relative; 
		min-height: 200px;
		max-height: 450px;
		overflow: hidden;
		transition-duration: .3s;
		transition-property: transform;
		transition-timing-function: ease-out;
		@include border-radius(25px);
		img{
			display:block; 
			width: 100%;
			object-fit: cover;
		}
	}
	.title-wrap{
		position: absolute;
		display: block;
		bottom: -50px;
		width: calc( 100% - 60px);
		margin-left: 30px;
		margin-right: 30px;
		background-color: #fff;
		padding: 25px 20px 10px;
		z-index: 2;
		max-width: 360px;
		@include border-radius(25px);
		@extend .box-shadow;
		.sup-title{ text-align:center; overflow:hidden;}
		h6{ text-align: center;}
		.content { margin-bottom:15px; text-align:center; color:$color-content;}
		.button{margin:auto; display:block;}
		.icon-wrap {
			position: absolute;
			width: 70px;
			height: 70px;
			top: -50px;
			left: calc( 50% - 35px);
			line-height: 35px;
			font-size: 35px;
			color:#fff;
			@include border-radius(50px);
			@extend .center_vertical;
			@extend .box-shadow;
			@extend .bg-color-main;
			svg, svg path, svg rect, svg ellipse, svg circle, svg polygon, svg polyline, svg line{ stroke:#fff; }
			> svg { width: 35px; height: 35px; } 
		}
		.icon-space{ height:15px; }
	}
	.title-wrap, .sup-title, .button {
		-webkit-transition: all .2s ease-in-out 0s;
		-moz-transition: all .2s ease-in-out 0s;
		-ms-transition: all .2s ease-in-out 0s;
		-o-transition: all .2s ease-in-out 0s;
		transition: all .2s ease-in-out 0s;
	}
	&:hover{
		.thumb-service{ transform: translateY(-8px);}
	}
}

.image-box-style7 {
	overflow: hidden;
	display: flex;
    flex-direction: row-reverse;
    background: #fff;
	@include border-radius(25px);
	@include single-transition(all, .3s, ease-in-out);
	.content-wrap {
		padding: 40px;
		position: relative;
		width: 50%;
		display: flex;
		flex-direction: column;
		gap: 15px;
		justify-content: flex-end;
		&:after {
			content: '';
			width: 100%;
			height: 100%;
			opacity: 0.05;
			position: absolute;
			left: auto;
			right: 0;
			bottom: 0;
			@extend .bg-color-main;
		}
		.button{
			margin-top: 10px;
			margin-bottom: 0;
			padding-bottom: 0;
			padding-top: 0;
		}
		.icon-wrap {
			text-align: left;
            display: block;
			flex-grow: 1;
		}
		h6{
			flex-grow: 1;
		}
	}
	.caption{
		position: relative;
		width: 50%;
		overflow: hidden;
		.thumb-service{
			position: relative;
			overflow: hidden;
			width: 100%;
			height: 100% !important;
			object-fit: cover;
			will-change: transform;
			transition: 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) 0s;
		}
	}
	&:hover{
		.thumb-service{ 
			-webkit-transform: scale(1.05) translateX(2%);
			    -ms-transform: scale(1.05) translateX(2%);
			        transform: scale(1.05) translateX(2%);
		}
	}
}
.img-left .image-box-style7{
	flex-direction: row;
}

.image-box.image-box-style8 {
	position:relative;
	padding: 15px;
	.image-wrapper{
		position: relative;
		overflow: hidden;
		@include border-radius(25px);
		&:before{
			content: "";
			background: linear-gradient(0deg, var(--color-primary) 0%, rgba(0, 0, 0, 0.2) 45%);
			background-position: bottom left;
			background-repeat: repeat-x;
			position: absolute;
			bottom: 0px;
			left: 0px;
			width: 100%;
			height: 100%;
			z-index: 1;
			transition: 0.5s ease-in-out;
			-ms-transition: 0.5s ease-in-out;
			-moz-transition: 0.5s ease-in-out;
			-o-transition: 0.5s ease-in-out;
			opacity: 0.6;
			z-index: 2;
			@include border-radius(25px);
		}
	}
	.thumb-service {
		position: relative;
		height: inherit;
		overflow: hidden;
		width: 100%;
        object-fit: cover;
		@include border-radius(25px);
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0);
		-webkit-transition: -webkit-transform .35s cubic-bezier(.25,.46,.45,.94);
		transition: -webkit-transform .35s cubic-bezier(.25,.46,.45,.94);
		-o-transition: transform .35s cubic-bezier(.25,.46,.45,.94);
		transition: transform .35s cubic-bezier(.25,.46,.45,.94);
		transition: transform .35s cubic-bezier(.25,.46,.45,.94),-webkit-transform .35s cubic-bezier(.25,.46,.45,.94);
	}
   .thumb-service, .title-wrap , .image-wrapper{
		z-index: 1;
		border-radius: inherit;
		-webkit-transition: transform 0.5s cubic-bezier(0.8, 0.8, 0.8, 0.8);
		-moz-transition: transform 0.5s cubic-bezier(0.8, 0.8, 0.8, 0.8);
		transition: transform 0.5s cubic-bezier(0.8, 0.8, 0.8, 0.8);
	}
	.icon-wrap {
		display: inline-block;
        margin-bottom: 10px;
		line-height: 35px;
		font-size: 35px;
		@include single-transition(all, .4s, ease-in-out);
		i{ color:#fff; }
		> svg {
			stroke: #fff;
			rect, path, polyline{ stroke: #fff; }
			g, path{fill:#fff; }
		}
	}
	.title-wrap{
		background: var(--color-primary);
		position: relative;
		right: 0;
		width: 90%;
		top: 0;
		display: flex;
		flex-direction: column;
		float: right;
		margin: -27% 19px 0 0;
		padding:20px 35px;
		z-index: 10;
		text-align: center;
		-webkit-box-shadow: 0 12px 32px 0 rgba(25, 41, 66, .07);
		box-shadow: 0 12px 32px 0 rgba(25, 41, 66, .07);	
		h6{ color:#fff !important; margin-bottom:0; }
		.sup-title{ color:rgba(255,255,255,0.7) !important}
		.content{ color: rgba(255,255,255,0.8)!important; }	
	}
	.btn-arrow{
		transform: rotate(-45deg);
	}
	&:hover {
		.image-wrapper{ 
			-webkit-transform: translateY(-5px);
			-ms-transform: translateY(-5px);
			transform: translateY(-5px);
		}
		.title-wrap{
		    -webkit-transform: translateY(10px);
			-ms-transform: translateY(10px);
			transform: translateY(10px);
		}
		.btn-arrow{ transform:translate(3px, -3px) rotate(-45deg);}
	 }
}

.image-box-style9{
	position: relative;
	overflow: hidden;
	display: flex;
	background: #fff;
	flex-direction: row-reverse;
	-webkit-transition: all 0.4s ease-in-out;
    -moz-transition: all 0.4s ease-in-out;
    -o-transition: all 0.4s ease-in-out;
    transition: all 0.4s ease-in-out;
	@extend .box-shadow;
	.image-wrapper{
		position: relative;
        width: 50%;
	}
	.thumb-service{
		position: relative;
		overflow: hidden;
		width: 100%;
		height: 100%;
		object-fit: cover;
		background-size: cover;
		background-repeat: no-repeat;
		background-clip: content-box;
		-webkit-transition: all .2s;
		transition: all .2s;
	}
	.icon-wrap {
		position: absolute;
		overflow: hidden;
		color:#fff;
		text-align: center;
		float: none;
		margin: auto;
		width: 70px;
		height: 70px;
		padding: 0 !important;
		line-height: 35px;
		font-size: 35px;
		left: 0;
		right: 0;
		z-index: 1;
		top: 20%;
		@extend .center_vertical;
		@include border-radius(50%);
		@include single-transition(all, .4s, ease-in-out);
		> svg {
			width: 35px;
			height: 35px;
			stroke: #fff;
		}
	}
	.icon-wrap:after {
		border-radius: inherit;
		position: absolute;
		content: '';
		z-index: -1;
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		-webkit-transition: all 0.5s ease;
		-o-transition: all 0.5s ease;
		transition: all 0.5s ease;
		@extend .bg-color-main;
	}
	.title-wrap{ 
		position: relative;
		padding: 40px;
        width: 50%;
		background: #fff;
		> h6{
			text-decoration: none;
			position: relative;
			z-index: 2;
			overflow: hidden;
			will-change: transform;
			-ms-word-wrap: break-word;
			word-wrap: break-word;
			font-size: 17px;
			line-height: 22px;
			&:before {
				content: attr(data-title);
				height: 100%;
				position: absolute;
				width: 100%;
				top: 0;
				left: 0;
				transform: translateY(110%);
				transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
			}
			span{
				display: inline-block;
				transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
				will-change: transform;
			}
		}
     	h5.sup-title{
			font-size: 12px;
			text-transform: uppercase;
			line-height: 15px;
	   		letter-spacing: 1px;
    	}
		.content{
	    	margin-top: 15px;
			position: relative;
            z-index: 2;
		}
		.btn-arrow {
			padding-top:3px; height:31px; 
		    svg {transform: rotate(-45deg);}
			&:hover svg { transform: translate(3px, -3px) rotate(-45deg); }
		}
	 }
	&:hover{
		-webkit-transform: translateY(-3px);
		transform: translateY(-3px);
		@extend .box-shadow2;
		.btn-arrow:hover svg {
			transform: translate(5px, -3px) rotate(-45deg);
		}
	}
}

.image-box-style10{
	position: relative;
	margin-left: auto;
    margin-right: auto;
	overflow: hidden;
	display: flex;
	@extend .box-shadow;
	@include single-transition(all, .4s, ease-in-out);
	.img-perspective2{
		position: absolute;
		overflow: hidden;
		height: 100%;
		width: 100%;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
		background-clip: content-box;
		transition: 0.5s cubic-bezier(.25,.8,.25,1) 0s;
	}
	.perspective_overlay{
		height: 100%;
        opacity:1;
		background:#fff;
	}
	.perspective-caption {
		padding: 38px;
		position: relative;
		display: flex;
		flex-direction: column;
		gap: 5px;
		justify-content: flex-end;
		color: $color-content;
		.perspective-title{ flex-grow: 1; color:$color-black;  margin-bottom:15px; }
	}
	.perspective-title{
		width: 80%;
		float: left;
	}
	.button {
		pointer-events: auto;
		float: right;
		opacity: 0;
		margin-bottom: 0;
		position: absolute;
		left: 40px;
		bottom: 40px;
		transform: rotate(135deg);
		transition: all 0.2s ease-in-out 0s;
		svg.svg-arrow {
			width: 15px;
			height: 15px;
			path{ stroke:#fff;}
		}
	}
	.icon-wrap{
		position: absolute;
		right: 40px;
		top: 40px;
		z-index: 2;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: all 0.2s ease-in-out 0s;
		&:after {
			content: "";
			width: 60px;
			height: 60px;
			background-color: #fff;
			position: absolute;
			left: 50%;
			top: 50%;
			z-index: -1;
			transform: translate(-50%,-50%);
			border-radius: 50%;
		}
		i, svg{transition: all 0.2s ease-in-out 0s;}
	}
	.content{
        text-align: left;
		margin-top: 15px;
		transition: all 0.2s ease-in-out 0s;
	}
	&:hover{
		@extend .box-shadow2;
		.perspective_overlay{
			opacity: 1;
			background:rgba(0, 0, 0, 0.4);
		}
		.perspective-title{ color:#fff;}
		.content {color: rgba(255,255,255,0.8); transform: translateY(-30px);}
		.button {
			opacity: 1;
			transform: rotate(0);
		}
		.icon-wrap { 
			i, svg{ transform: scale(.8);}
		}
		.img-perspective2 { 
			transform: scale(1.1) rotate(3deg);
		 }
	}
} 

.image-box-style11{
	padding: 30px;
	background:transparent;
	@extend .border;
	transition: box-shadow 0.3s ease, background 0.3s ease;
	.thumb-service{
		position: relative; 
		min-height: 200px;
		max-height: 450px;
		transition-duration: .3s;
		transition-property: transform;
		transition-timing-function: ease-out;
		margin-bottom: 15px;
		img{
			display:block; 
			width: 100%;
			object-fit: cover;
		}
	}
	.title-wrap{
		position: relative;
		display: block;
		.sup-title{ margin-top:15px; text-align:center; overflow:hidden;}
		h6{ text-align: center;}
		.content { margin-bottom:15px; text-align:center; color:$color-content;}
		.button{
			margin:auto; display:block;
			> span{ overflow: hidden; display: inline-block; }
		}
		.icon-wrap {
			position: relative;
			width: 70px;
			height: 70px;
			top: -20px;
			left: calc( 50% - 35px);
			line-height: 35px;
			font-size: 35px;
			color:#fff;
			@include border-radius(50px);
			@extend .center_vertical;
			@extend .box-shadow;
			@extend .bg-color-main;
			svg, svg path, svg rect, svg ellipse, svg circle, svg polygon, svg polyline, svg line{ stroke:#fff; }
			> svg { width: 35px; height: 35px; } 
		}
		.icon-space{ height:15px; }
	}
	.title-wrap, .sup-title, .button {
		-webkit-transition: all .2s ease-in-out 0s;
		-moz-transition: all .2s ease-in-out 0s;
		-ms-transition: all .2s ease-in-out 0s;
		-o-transition: all .2s ease-in-out 0s;
		transition: all .2s ease-in-out 0s;
	}
	&:hover{
		@extend .box-shadow2;
		.thumb-service{ transform: translateY(-8px);}
	}
}

.image-box-style12{
	padding: 30px;
	background:transparent;
	@extend .border;
	-webkit-transition: all 0.5s cubic-bezier(0.8, 0.8, 0.8, 0.8);
    -moz-transition: all 0.5s cubic-bezier(0.8, 0.8, 0.8, 0.8);
    transition: all 0.5s cubic-bezier(0.8, 0.8, 0.8, 0.8);
	.thumb-service{
		position: relative; 
		max-height: 450px;
		padding: 30px;
		transition-duration: .3s;
		transition-property: transform;
		transition-timing-function: ease-out;
		overflow: hidden;
		@include border-radius(20px);
		&:after{
			content:'';
			position: absolute;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			z-index: -1;
			opacity: 0.1;
			@extend .bg-color-main;
		}
		img{
			display:block; 
			width: 100%;
			object-fit: cover;
		}
	}
	.title-wrap{
		position: relative;
		display: block;
		padding-top:25px;
		.sup-title{ text-align:center; overflow:hidden;}
		h6{ text-align: center;}
		.content{ margin-bottom:15px; text-align:center; color:$color-content;}
		.button{
			margin:auto; display:block;
			> span{ overflow: hidden; display: inline-block; }
		}
		.icon-wrap {
			position: absolute;
			width: 70px;
			height: 70px;
			top: -50px;
			left: calc( 50% - 35px);
			line-height: 35px;
			font-size: 35px;
			color:#fff;
			@include border-radius(50px);
			@extend .center_vertical;
			@extend .box-shadow;
			@extend .bg-color-main;
			svg, svg path, svg rect, svg ellipse, svg circle, svg polygon, svg polyline, svg line{ stroke:#fff; }
			> svg { width: 35px; height: 35px; } 
		}
		.icon-space{ height:15px; }
	}
	.title-wrap, .sup-title, .button {
		-webkit-transition: all .2s ease-in-out 0s;
		-moz-transition: all .2s ease-in-out 0s;
		-ms-transition: all .2s ease-in-out 0s;
		-o-transition: all .2s ease-in-out 0s;
		transition: all .2s ease-in-out 0s;
	}
	&:hover{
		@extend .border-color-main;
	}
}

/* menu-box */
.menu-box{
	 margin-bottom: 30px;
	 margin-top: 30px;
	 max-width: 400px;
	.menu-image {
		float: left;
		margin-right: 15px;
		width: 80px;
        height: 80px;
        border-radius: 50%;
        overflow: hidden;
		background-size: cover;
   	    background-repeat: no-repeat;
        background-clip: content-box;
		background-position: center;
	}
	.menu-caption{
	    min-height: 90px;  
	}
	.menu-title{
		 margin-top: 15px;
         display: table;
		 min-width: 150px;
		.title{ 
			margin-top: 0;
			line-height: 1;
			margin-bottom: 12px;
			padding-right: 10px;
			display: table-cell;
			width: 1%;
			white-space: nowrap;
		}
		.dots{
			position: relative;
			display: table-cell;
			border-bottom: 1px dashed #999;
			width: 70%;
			height: 3px;
			top: -12px;
		}
		.price{
			display: table-cell;
			text-align: right;
			min-width: 70px;
			font-weight: 500;
			@extend .color-main;
		}
	}
}

/* image-flip-box */
.image-flip-box{
	position:relative;
	perspective:1000px;
}
.image-flip-box__front-side, .image-flip-box__back-side{
	height:300px; 
	position:relative;
	background-size:cover;background-position:center;
	transition:transform 0.7s cubic-bezier(0.4, 0.2, 0.2, 1);
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	@extend .radius25;
	overflow: hidden;
}
.image-flip-box__back-side{position:absolute;top:0;left:0;width:100%}
.image-flip-box[data-flip-direction="horizontal_to_left"] .image-flip-box__front-side{transform:rotateY(0deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="horizontal_to_left"] .image-flip-box__back-side{transform:rotateY(180deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="horizontal_to_left"]:hover .image-flip-box__front-side{transform:rotateY(-180deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="horizontal_to_left"]:hover .image-flip-box__back-side{transform:rotateY(0deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="horizontal_to_right"] .image-flip-box__front-side{transform:rotateY(0deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="horizontal_to_right"] .image-flip-box__back-side{transform:rotateY(-180deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="horizontal_to_right"]:hover .image-flip-box__front-side{transform:rotateY(180deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="horizontal_to_right"]:hover .image-flip-box__back-side{transform:rotateY(0deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="vertical_to_bottom"] .image-flip-box__front-side{transform:rotateX(0deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="vertical_to_bottom"] .image-flip-box__back-side{transform:rotateX(-180deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="vertical_to_bottom"]:hover .image-flip-box__front-side{transform:rotateX(180deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="vertical_to_bottom"]:hover .image-flip-box__back-side{transform:rotateX(0deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="vertical_to_top"] .image-flip-box__front-side{transform:rotateX(0deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="vertical_to_top"] .image-flip-box__back-side{transform:rotateX(180deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="vertical_to_top"]:hover .image-flip-box__front-side{transform:rotateX(-180deg);transform-style:preserve-3d}
.image-flip-box[data-flip-direction="vertical_to_top"]:hover .image-flip-box__back-side{transform:rotateX(0deg);transform-style:preserve-3d}
.image-flip-box .image-flip-box__content{
	position:relative;-webkit-backface-visibility:hidden;backface-visibility:hidden;display:-ms-flexbox;display:flex;padding:40px;-ms-flex-direction:column;flex-direction:column;position:absolute;top:0;bottom:0;left:0;right:0;z-index:3;transform:translateZ(60px);perspective:inherit;backface-visibility:hidden;
	h6, .content, .link-btn, .icon-wrap i{ color:#fff; }
	h6{ 
		@extend .font-subtitle;
		margin-bottom: 7px;
	 }
	.sup_title{	
		position: relative;
		margin-bottom: 6px;
		font-size: 12px;
		text-transform: uppercase;
		line-height: 1.2em;
		font-weight: 600;
		letter-spacing: 1px;
		color: rgba(255, 255, 255, 0.7);
		padding: 5px 10px;
		&:after{
			content: "";
			width: 100%;
			height: 100%;
			display: block;
			left: 0;
			top: -1px;
			position: absolute;
			border-radius: 50px;
			z-index: -1;
			opacity: 1;
			background: var(--color-primary);
		}
	}
	.content, .content p{ margin: 0; font-size: 15px; line-height: 26px; }
	.content{ margin-bottom: 5px; opacity: .9; }
	.button.btn-txt-arrow { margin-top: 10px; }
	.icon-wrap{ font-size:40px; margin-bottom: 15px;}
}
.image-flip-box[data-horizontal-align="center"] .image-flip-box__content{-ms-flex-align:center;align-items:center;text-align:center}
.image-flip-box[data-horizontal-align="left"] .image-flip-box__content{-ms-flex-align:start;align-items:flex-start}
.image-flip-box[data-horizontal-align="right"] .image-flip-box__content{-ms-flex-align:end;align-items:flex-end;text-align:right}
.image-flip-box[data-vertical-align="center"] .image-flip-box__content{-ms-flex-pack:center;justify-content:center}
.image-flip-box[data-vertical-align="top"] .image-flip-box__content{-ms-flex-pack:start;justify-content:flex-start}
.image-flip-box[data-vertical-align="bottom"] .image-flip-box__content{-ms-flex-pack:end;justify-content:flex-end}

.image-flip-box__front-side[data-is-bg-overlay="true"]:before, .image-flip-box__back-side[data-is-bg-overlay="true"]:before{
	content:"";display:block;position:absolute;top:0;right:0;left:0;bottom:0;z-index:2;
}
.image-flip-box__front-side[data-opacity-bg-overlay="1"]:before  , .image-flip-box__back-side[data-opacity-bg-overlay="1"]:before  { opacity: 1;   } 
.image-flip-box__front-side[data-opacity-bg-overlay="0.9"]:before, .image-flip-box__back-side[data-opacity-bg-overlay="0.9"]:before{ opacity: 0.9; } 
.image-flip-box__front-side[data-opacity-bg-overlay="0.8"]:before, .image-flip-box__back-side[data-opacity-bg-overlay="0.8"]:before{ opacity: 0.8; } 
.image-flip-box__front-side[data-opacity-bg-overlay="0.7"]:before, .image-flip-box__back-side[data-opacity-bg-overlay="0.7"]:before{ opacity: 0.7; } 
.image-flip-box__front-side[data-opacity-bg-overlay="0.6"]:before, .image-flip-box__back-side[data-opacity-bg-overlay="0.6"]:before{ opacity: 0.6; } 
.image-flip-box__front-side[data-opacity-bg-overlay="0.5"]:before, .image-flip-box__back-side[data-opacity-bg-overlay="0.5"]:before{ opacity: 0.5; } 
.image-flip-box__front-side[data-opacity-bg-overlay="0.4"]:before, .image-flip-box__back-side[data-opacity-bg-overlay="0.4"]:before{ opacity: 0.4; } 
.image-flip-box__front-side[data-opacity-bg-overlay="0.3"]:before, .image-flip-box__back-side[data-opacity-bg-overlay="0.3"]:before{ opacity: 0.3; } 
.image-flip-box__front-side[data-opacity-bg-overlay="0.2"]:before, .image-flip-box__back-side[data-opacity-bg-overlay="0.2"]:before{ opacity: 0.2; } 
.image-flip-box__front-side[data-opacity-bg-overlay="0.1"]:before, .image-flip-box__back-side[data-opacity-bg-overlay="0.1"]:before{ opacity: 0.1; } 
.image-flip-box__front-side[data-opacity-bg-overlay="0"]:before  , .image-flip-box__back-side[data-opacity-bg-overlay="0"]:before  { opacity: 0;   }
.bg_overlay_dark:before       { background: #000; }
.bg_overlay_gradient:before   { @extend .bg-color-main; }
.bg_overlay_color-main:before { @extend .bg-color-main; }
.bg_overlay_secondary:before  { @extend .bg-color-main; }

/* image-carousel */
.image-carousel{
	.owl-item img {
		max-width: 100%;
		margin: auto;
		display: block;
	}
	.owl-item {
		position: relative;
		opacity: .6;
		@include single-transition(all, 0.4s, ease-in-out);
	}
	.owl-item:hover {
		opacity: 1;
	}
}
.no-opacity .image-carousel .owl-item{
	opacity: 1;
}
.with-border .owl-item img,  .with-border .wpb_column img{
   border: 1px solid #eaeaea;
   opacity: 0.4;
   @include single-transition(all, 0.4s, ease-in-out);
   &:hover { opacity:1; }
}
/* black_list */
 .black_list {
	position:relative;
	z-index:99;
    &:after , &:before {
		content: "";
		display: block;
		width: 100%;
		height: 20px;
		position: absolute;
		z-index: -1;
		left: 0;
	}
	&:after {top: 0; background: #fff;}
	&:before {bottom:0;  background-color:$color-gray;}
}

.wpb_single_image.img_border_shadow{
		-webkit-box-shadow: 0 15px 34px rgba(0,0,0,0.18);
		-moz-box-shadow: 0 15px 34px rgba(0,0,0,0.18);
		box-shadow: 0 15px 34px rgba(0,0,0,0.18);
		@include border-radius(15px);
		img{
		    @include border-radius(15px);
		}
	}
	
.rev-slider{
	.icon-wrap i{ color:#fff;}
	.title-wrap h6{ color:#fff; }
	.content p{ color:rgba(255,255,255,0.9);}
}
/* image-layers */
.image-layers{
	position: relative;
	.image-layer{  position: relative; }
}
.image-layers .image-layer:not(:first-child) {
    position: absolute;
    top: 0;
    left: 0;
}
.img_about{
	position: relative;
	img{ 
		@include border-radius(15px);
		-webkit-transition: all 8s linear;
		-o-transition: all 8s linear;
		transition: all 8s linear;
	}
	&:after , &:before{ content: ""; position: absolute; width: 100%; display: block; @include border-radius(15px);}
    &:after{
		height: 118%;
		left: -27px;
		top: -25px;
		background: $color-gray;
		z-index: -1;
	}
	&:before{
		height: 100%;
		left: -55px;
		top: 0;
		@extend .bg-color-main;
		z-index:-2;
	}
	&:hover{
		img{
			@include border-radius(15px);
		    -webkit-transform: scale(1.4);
			transform: scale(1.4);
			}
	}
}
/* list-style */
.list-style{
	display: flex;
	flex-flow: row wrap;
	margin-left: 0;
	ul{ list-style:none; }
	li { 
		position: relative;
		width:100%;
		text-transform: none;
		letter-spacing: 0;
		margin-bottom: 5px;
		max-width: 450px;
		h4{
			@extend .font-l-subtitle;
		}
		.descrption{ 
			color:$color-content; 
			padding-bottom: 5px;
			max-width: 350px;
		 }
	 }
}
ul.list-style { padding-left: 0; }
.sm-title-list .list-style li h4 {
    font-size: 16px;
    font-weight: 300;
	line-height: 23px;
}
.list-style.list-style1, .list-style.list-style2  {
	list-style: none;
	li{
		position: relative;
		h4{	margin-left:40px; margin-top:0; }
		.descrption{ margin-left: 40px; }
	}
	li::after {
    	display: block;
	    position: absolute;
		top:0;
	}
}

.list-style.list-style1{
	padding-left: 0;
	li::after{ 
		float: left;
		left: 0;
		display: block;
		border-radius: 50%;
		width: 20px;
		height: 20px;
		line-height: 20px;
		text-align: center;
		color: #fff;
		font-family:FontAwesome;
		content:"\f00c"; 
		font-size:12px; 
		margin-top: 5px;
		@extend .bg-color-main;
	}
	li::before{ 
		display: block;
		position: absolute;
		content: '';
		top: 35px;
		left: 10px;
		width: 1px;
		height: 100%;
		z-index: -1;
		background: -webkit-linear-gradient(top, var(--color-primary) 0%, #e6eaef 60%);
		transform-origin: top left;
	}
}

.list-style.list-style2{
	padding-left: 0;
	li h4{
		font-weight: 400;
		font-size: 16px;
		line-height: 23px;
		margin-left: 30px;
	}
	li::after, li::before{ 
		float: left;
		left:0; 
		display: block;
		border-radius: 50%;
		width: 15px;
		height: 15px;
		line-height: 15px;
		margin-top: 3px;
		text-align: center;
	}
	li::after{ 
		font-family:FontAwesome;
		content:"\f00c"; 
		font-size:10px; 
		color:#fff;
	}
	li::before{ 
		content: "";
		@extend .bg-color-main;
	}
}

.list-style.list-style3{
	list-style: none;
	padding-left: 0;
	li{ 
		h4{
			position: relative;
			display: inline-block;
			padding:0 0 3px 25px;
			-webkit-transition: all 0.6s ease;
			transition: all 0.6s ease;
			&:after, &:before{ 
				content: '';
				display: inline-block;
				width: 100%;
				height: 1px;
				position: absolute;
				bottom: 0;
				left: 0;
				background-color: $color-black;
				-webkit-transform-origin: right center;
				transform-origin: right center;
				-webkit-transform: scaleX(0);
				transform: scaleX(0);
				-webkit-transition: -webkit-transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98);
				transition: -webkit-transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98);
				transition: transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98);
				transition: transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98),-webkit-transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98);
			}
		}
		&:hover h4:before {
			-webkit-transform-origin: right center;
			transform-origin: right center;
			-webkit-transform: scaleX(0);
			transform: scaleX(0);
		}
		&:hover h4:after {
			-webkit-transform-origin: left center;
			transform-origin: left center;
			-webkit-transform: scale(1);
			transform: scale(1);
		}
	 }
	 li::after{ 
		position: absolute;
		left:0; 
		top:0;
		font-family:FontAwesome;
		content:"\f00c"; 
		font-size:14px; 
	}
}
.list-style.list-style4{ 
	margin-left: 10px;
	li{
		width: calc( 100% - 40px);
		padding: 5px;
		margin-bottom: 0;
		color: #fff;
		h4{ 
			margin-left: 10px;
			position: relative;
			padding: 10px 8px 10px 0;
			font-size: 15px;
			&:before{ 
				content: "";
				position: absolute;
				float: left;
				top: 6px;
				left: -42px;
				display: block;
				width: 30px;
				height: 30px;
				line-height: 30px;
				text-align: center;
				z-index: -1;
				@extend .radius4;
				@extend .bg-color-main;
			}
			&:after{ 
				content: "";
				position: absolute;
				top: 0;
				width: 100%;
				height: 100%;
				left: -50px;
				width: calc(100% + 30px );
				z-index: -1;
				-webkit-transition: all 0.4s ease-in-out;
				-moz-transition: all 0.4s ease-in-out;
				-o-transition: all 0.4s ease-in-out;
				transition: all 0.4s ease-in-out;
				opacity: 0.05;
				@extend .radius4;
				@extend .bg-color-main;
			}
		 }
		p{ color:$color-content; }
	}
}
 .list-style.list-style5{ 
	li{
		h4{ margin-left:15px; }
		h4:before{ 
			position: absolute;
			float: left;
			top: 2px;
			left: -24px;
			display: block;
			width: 25px;
			height: 25px;
			line-height: 27px;
			text-align: center;
			content: "";
			z-index: -1;
			@extend .bg-color-main;
			opacity: 0.1;
		}
		.descrption{ padding-left:15px; }
	}
 }

 .list-style.list-style6{
	li{ 
		color:$color-font; 
		h4{
			position: relative;
			display: inline-block;
			padding:0 0 3px;
			-webkit-transition: all 0.6s ease;
			transition: all 0.6s ease;
			&:after, &:before{ 
				content: '';
				display: inline-block;
				width: 100%;
				height: 1px;
				position: absolute;
				bottom: 0;
				left: 0;
				background-color: $color-font;
				-webkit-transform-origin: right center;
				transform-origin: right center;
				-webkit-transform: scaleX(0);
				transform: scaleX(0);
				-webkit-transition: -webkit-transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98);
				transition: -webkit-transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98);
				transition: transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98);
				transition: transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98),-webkit-transform 0.5s cubic-bezier(0.32, 0.96, 0.4, 0.98);
			}
			&:before {
				background-color: rgba(159,159,159,0.5);
				-webkit-transform-origin: left center;
				transform-origin: left center;
				-webkit-transform: scale(1);
				transform: scale(1);
			}
		}
		&:hover h4:before {
			-webkit-transform-origin: right center;
			transform-origin: right center;
			-webkit-transform: scaleX(0);
			transform: scaleX(0);
		}
		&:hover h4:after {
			-webkit-transform-origin: left center;
			transform-origin: left center;
			-webkit-transform: scale(1);
			transform: scale(1);
		}
		.descrption{ color:$color-content; }
	 }
}
.list-col2 ul li , .list-col2 ol li{ width: 50%; }
/* page-404 */
.page-404{ 
	min-height: 100vh;
	height: 100%;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    justify-content: center;
	background-image: linear-gradient(180deg, #E4EDF5 0%, #FFFFFF00 100%);
	&:after{
		background-image: url(../images/error.png);
		background-size: contain;
		background-repeat: no-repeat;
		height: 430px;
		width: 430px;
		content: "";
		position: absolute;
		top: 15%;
		right: 0;
		left: 0;
		margin: auto;
		--float-animation-ease: ease;
		--float-animate-from: 0%;
		--float-animate-to: 3%;
		--float-delay: 0s;
		animation: moFloatImg 1s var(--float-animation-ease) infinite alternate;
		animation-delay: var(--float-delay);
	}
	h4{ 
		clear: both;
		display:block; 
		font-size: 37px;
        margin-bottom: 12px;
		margin-top: 17%;
		@extend .bold-weight;
	}
	.content{
		max-width: 505px;
        margin: auto;
		color: $color-content;
	}
	.button{ margin-top:30px; }
}
.search-content {
  text-align: center;
  margin-top: 30px;
  margin-bottom: 50px;
  form {
    position: relative;
	width: 50%;
	max-width: 350px;
    margin: auto;
	input[type="submit"]{  
		width: 45px;
		height: 40px;
		position: absolute;
		top: 1px;
		right: 1px;
		background-color: transparent;
		border: 0px;
		text-indent: 100px;
		z-index: 2;
	}
	.fa-search{ 
		position: absolute;
		right: 5px;
        top: 17px;
	 }
    input[type="search"]{
      width: 100%;
	  background: 0 0;
	  outline: 0;
      border: none;
      box-shadow: inset 0 -1px 0 rgba(255,255,255,0.3);
      height: 5rem;
      font-size: 1.5rem;
      font-weight: 500;
      display: block;
	  -webkit-transition: .4s all;
      transition: .4s all;
	  padding: 0;
	 }
	 input[type=search]:focus {
		box-shadow: inset 0 -2px 0 transparent;
		font-weight: 400;
		background-size: 100% 2px;
		width: 100%;
	}
     input:focus + label {
        top: -3rem;
        font-size: 1.2rem; }
     label {
        width: 100%;
        height: 100%;
      }
    }
}
/* ------------------------------------- */
/* search widget ....................... */
/* ------------------------------------- */
.widget.search-box{
	.main-search{   
		position: relative;
		opacity: 1;
		visibility: visible;
		color: #000;
		display: flex;
		.control-search{
			position: absolute;
			right: 20px;
			top: 12px;
			z-index: 9;
			color: #fff;
		}
		.search-content{ 
			display: inline-flex;
			margin: auto;
			position: relative;
			form{
				margin: 0;
				min-width: 300px;
				input[type="search"] {
					box-shadow: none;
					border-radius: 50px;
					height: 55px;
					padding-right: 60px;
					border: 1px solid #e8e9f1;
					padding: 0 20px;
				}
				input[type="submit"]{
					top: calc( 50% - 3px );
					transform: translateY(-50%);
					width: 54px;
					height: 54px;
					color: #fff;
					border-radius: 50%;
					color: #fff;
					padding: 0;
					@extend .bg-color-main;
				}
				.fa-search{display: none;}
				input[type=search]:focus { box-shadow: none;}
		    }
     	}
    }
}
/* ------------------------------------- */
/* 4. timeline  ........................ */
/* ------------------------------------- */
.timeline-year {
	padding-top: 15px;
    margin-right: 10px;
    float: left;
    width: 90px;
    text-align: right;
    p{font-size:18px ;font-weight: 500; width:45px; @extend .color-main; }
}
.timeline{
	position:relative;
	&:before{
		position:absolute; content:''; 
		width:4px;
		background-color:rgba(0,0,0,0.1);
		height: calc(100% - 50px );
		left: 112px;
		top: 50px;
	}
}
.timeline-details{display:inline-block; padding-bottom:15px;}
.timeline-title{
	 position:relative;
	 h3{
		font-size: 20px;
		font-weight: 500;
		margin-bottom: 15px;
		line-height: 1.15;
        letter-spacing: .2px;
	}
	 i{font-size:32px; padding-right:16px; line-height:40px; float:left; margin-top:-6px; }
	 span{font-style:italic;}
	 &:before , &:after {
		position:absolute;
		content:'';
		border-radius:100%;
		transition:.3s all ease-in-out;
	}
	 &:before {
		height:15px; 
		width:15px;
		left: -44px;
        top: 3px;
		z-index: 1;
		@extend .bg-color-main;
	}
	&:after {
		height:30px; 
		width:30px;
		left: -52px;
        top: -5px;
		border: 8px solid rgba(0,0,0,0);
		z-index: 0;
	}
}
.timeline-text{ 
	max-width:400px;
    font-size: 14px;
    line-height: 23px;
    letter-spacing: 0;
}
.timeline-text-content{
	display:table; position:relative; padding-left:50px; margin-top:15px;
	&:after {
		position: absolute;
		content: '';
		width: 4px;
		height: 0;
		top: 34px;
		left: 12px;
		transition: .5s all ease-in-out;
		@extend .bg-color-main;
	}
}
.timeline-details:hover{
	.timeline-text-content:after { height: calc(100% - 11px); }
     .timeline-title:after{
		border: 8px solid rgba(0, 0, 0, 0.2);
		-webkit-animation:timelinePointAnimation 2s infinite;
		-moz-animation:timelinePointAnimation 2s infinite;
		-ms-animation:timelinePointAnimation 2s infinite;
		-o-animation:timelinePointAnimation 2s infinite;
		animation:timelinePointAnimation 2s infinite;
	}
}

.bg-dark{
	.timeline:before{ background-color:rgba(255, 255, 255, 0.1); }
	.timeline-details:hover .timeline-title:after { border:8px solid rgba(255, 255, 255, 0.2); }
}

@keyframes timelinePointAnimation{
    0%{-webkit-transform:scale(0, 0);-moz-transform:scale(0, 0);-ms-transform:scale(0, 0);-o-transform:scale(0, 0);transform:scale(0, 0);filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=80);opacity:.8;}
	100%{-webkit-transform:scale(2, 2);-moz-transform:scale(2, 2);-ms-transform:scale(2, 2);-o-transform:scale(2, 2);
	transform:scale(2, 2);filter:progid:DXImageTransform.Microsoft.Alpha(Opacity=0);opacity:0;}
}
/* ------------------------------------- */
/* 5.  portifolio ...................... */
/* ------------------------------------- */
.project_filters {
	  list-style: none;
	  text-align: center;
	  margin: 20px auto;
	  padding: 0 15px;
	  position: relative;
      z-index: 4;
	  &.left { text-align: left; }
	  &.right{ text-align: right; }
	  a {
		@extend .font-family;
		position: relative;
		overflow: hidden;
	    display: inline-block;
	    margin-right: 30px;
		line-height: 29px;
		letter-spacing: 0px;
		font-weight: 500;
		color: $color-font;
		font-size: 16px;
		will-change: transform;
		-ms-word-wrap: break-word;
		word-wrap: break-word;
		span {
			display: inline-block;
			transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
			will-change: transform;
		}
		&:before {
			content: attr(data-title);
			height: 100%;
			position: absolute;
			width: 100%;
			top: 0;
			left: 0;
			transform: translateY(110%);
			transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
		}
		&:hover , &:active , &:focus, &.active{ 
			@extend .color-main;
			&:before { transform: translateY(0); @extend .color-main; }
			span { transform: translateY(-125%); }
		}
	}
}
.portfolio-link i{
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
	&:before{ 
	   content: "\f0c1"; 
   }
}
.lightbox-video i {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
	&:before{
      content: "\f04b";
    }
}
.lightbox-gallery i{
    @include rotate(90);
	&:before{ content: "\f065";}
}
p.portfolio-cates span:last-child {
    display: none;
}

 /* projects-grid */
.projects-grid, .project-slider {
	position: relative;
	margin: -15px;
  }
  .projects-grid:after {
	content: "";
	display: block;
	clear: both;
  }
  .project-item {
	float: left;
	width: 33.3333333333%;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 15px;
	padding-right: 15px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
  }
  .projects-grid.pf_5_cols .project-item,.pgrid.pf_5_cols .pgrid-box {
	width: 20%;
  }
  .projects-grid.pf_4_cols .project-item,.pgrid.pf_4_cols .pgrid-box {
	width: 25%;
  }
  .projects-grid.pf_2_cols .project-item,.pgrid.pf_2_cols .pgrid-box {
	width: 50%;
  }
  /* Isotope Filtering **/
  .project_filters li a:hover, .project_filters li a.selected {
    @extend .color-main; 
  }
	.project_filters li:last-child a {
	margin-right: 0;
  }
	.project_filters.right a{
	margin-right: 0;
	margin-left: 30px;
  }
  .project-filter-wrapper{
	overflow: visible;
  }
  .project_filters {
	position: relative;
	width: 100%;
	text-align: center;
	padding-left: 0;
	padding-right: 0;
  }
  .project_filters:after {
	content: "";
	display: block;
	clear: both;
  }
  .project_filters li {
	display: inline-block;
	text-align: center;
  }
  .project_filters li:last-child {
	margin-right: 0;
  }
  .project_filters li:first-child {
	margin-left: 0;
  }
  /* Isotope Filtering styles */
  .isotope-item {
	z-index: 2;
  }
  .isotope-hidden.isotope-item {
	pointer-events: none;
	z-index: 1;
  }
  .isotope, .isotope .isotope-item {
	-webkit-transition-duration: 0.6s;
	-moz-transition-duration: 0.6s;
	-ms-transition-duration: 0.6s;
	-o-transition-duration: 0.6s;
	transition-duration: 0.6s;
  }
  .isotope {
	-webkit-transition-property: height, width;
	-moz-transition-property: height, width;
	-ms-transition-property: height, width;
	-o-transition-property: height, width;
	transition-property: height, width;
  }
  .isotope .isotope-item {
	-webkit-transition-property: -webkit-transform, opacity;
	-moz-transition-property: -moz-transform, opacity;
	-ms-transition-property: -ms-transform, opacity;
	-o-transition-property: -o-transform, opacity;
	transition-property: transform, opacity;
  }
  .isotope.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {
	-webkit-transition-duration: 0s;
	-moz-transition-duration: 0s;
	-ms-transition-duration: 0s;
	-o-transition-duration: 0s;
	transition-duration: 0s;
  }
  @media only screen and (max-width: 991px) {
	.project-item,.projects-grid.pf_4_cols .project-item,.projects-grid.pf_5_cols .project-item,.pgrid-box,.pgrid.pf_4_cols .pgrid-box,.pgrid.pf_5_cols .pgrid-box {
	  width: 50%;
	}
  }
  @media only screen and (max-width: 600px) {
	.project-item,.projects-grid.pf_5_cols .project-item,.projects-grid.pf_4_cols .project-item,.projects-grid.pf_2_cols .project-item,.pgrid-box,.pgrid.pf_4_cols .pgrid-box,.pgrid.pf_2_cols .pgrid-box,.pgrid.pf_5_cols .pgrid-box {
	  width: 100%;
	}
  }
  @media only screen and (max-width: 767px) {
	.pgrid .entry-media img {
	  width: 100%;
	}
  }
.zigzag .owl-item:nth-child(odd) .mo-portfolio-carousel{margin-top: 50px;}

/* portfolio-effect1 */
.portfolio-effect1 {
    overflow: hidden;
	position: relative;
	&.full .img-inner{ height: 350px; }
	&.nori-medium .img-inner{ height: 400px; }
	&.thumbnail{ border: 0; padding: 0; margin: 0; background:transparent;
		.img-inner{ height: 450px; }
	}
	&.nori-lg-height .img-inner{ height: 500px; }
	.img-inner {
		height:400px;
		position: relative;
		overflow: hidden;
		transform: scale(1) translateZ(0);
		perspective: 1200px;
		border-radius: 20px;
		.img-portfolio{
			height: 100%;
			background-position: center;
			background-size: cover;
			overflow: hidden;
			-webkit-transform: scale(1.05);
			transform: scale(1.05);
			-webkit-transition: all 0.6s cubic-bezier(0.38, 0.005, 0.215, 1);
			transition: all 0.6s cubic-bezier(0.38, 0.005, 0.215, 1);
			&:before{
				content: "";
				position: absolute;
				background-color: rgba(255, 255, 255, 0);
				-webkit-backdrop-filter: blur(14px) brightness(92%);
				backdrop-filter: blur(14px) brightness(92%);
				content: "";
				width: 100%;
				height: 100%;
				opacity: 0;
				transition: opacity 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);

			}
			a.portfolio-link {
				display: block;
				width: 100%;
				height: 100%;
				position: absolute;
				bottom: 0;
				right: 0;
				z-index: 999;
			}
	    }
	}
	.caption-inner {
		padding: 20px 5px 0;
		text-align: center;
		h5 { 
			@extend .font-subtitle;
			margin-bottom: 5px;
			font-style: normal;
			text-transform: capitalize;
			display: inline-block;
			-webkit-transition: all 0.3s ease-in-out;
			-moz-transition: all 0.3s ease-in-out;
			-o-transition: all 0.3s ease-in-out;
			transition: all 0.3s ease-in-out;
		}
		.portfolio-cates{
			position: relative;
			overflow: hidden;
			will-change: transform;
			-ms-word-wrap: break-word;
			word-wrap: break-word;
			line-height: 1;
			.term{ 
				position: relative;
				color: rgba(0, 0, 0, 0.8);
				font-size: 14px;
				font-weight: 400;
				font-style: normal;
				letter-spacing: 1px;
				line-height: 1;
				@extend .font-family;
				&:before{
					content: attr(data-title);
					height: 100%;
					position: absolute;
					width: 100%;
					top: 0;
					left: 0;
					transform: translateY(110%);
					transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
				}
				span{
					display: inline-block;
					transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
					will-change: transform;
				}
				.divider { font-size:12px; padding:3px;}
			}
		}
	}
    &:hover {
		.img-inner .img-portfolio {
			-webkit-transform: scale(1);
			transform: scale(1);
			&::before{opacity:1;}
		}
		.portfolio-cates .term:before{ transform: translateY(0);}
		.portfolio-cates .term span{ transform: translateY(-125%);}
    }
}

/* portfolio-effect2 */
.portfolio-effect2 { 
  .img-inner{
	position:relative;
	z-index: 1;
	overflow: hidden;
	border-radius: 20px;
	@extend .center_vertical;
	&:before{
		content: "";
		position: absolute;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 1;
		display: -webkit-box;
		display: -webkit-flex;
		display: -ms-flexbox;
		display: flex;
		bottom: 0;
		-webkit-transition: all 0.4s ease-in-out;
		-moz-transition: all 0.4s ease-in-out;
		-o-transition: all 0.4s ease-in-out;
		transition: all 0.4s ease-in-out;
	}
	a{
		width: 100%;
		height: 100% !important;
		object-fit: cover;
		position: relative;
		z-index: 5;
	}
	img{ 
		width: 100%;
		height: 100% !important;
		object-fit: cover;
		-webkit-transition: all cubic-bezier(0.4,0,0.2,1) .4s;
		-o-transition: all cubic-bezier(0.4,0,0.2,1) .4s;
		transition: all cubic-bezier(0.4,0,0.2,1) .4s;
	}
  }
  .content-block {
	position: absolute;
    padding: 15px 25px;
    z-index: 2;
    max-width: calc(100% - 40px);
	width: max-content;
    left: 30px;
    right: auto;
    bottom: 30px;
    top: auto;
    overflow: hidden;
    opacity: 0;
    will-change: scroll-position;
    h4 { 
		cursor: pointer;
		text-decoration: none;
		color:#fff;
		margin-bottom: 3px;
		padding:6px 20px;
		@extend .bg-color-main;
		@extend .font-l-subtitle;
		@extend .radius20;
		@include single-transition(all, 0.3s, ease-in-out); 
	}
    .portfolio-cates {
		padding:5px 15px;
        display: inline-block;
		font-size: 14px;
		font-weight: 400;
		font-style: normal;
		line-height: 1.5em;
		letter-spacing: 1px;
		margin-bottom: 0;
		color: rgba(255,255,255,0.8);
		background-color: rgba(255, 255, 255, 0);
		-webkit-backdrop-filter: blur(14px) brightness(92%);
		backdrop-filter: blur(14px) brightness(92%);
		border: 1px solid rgba(255, 255, 255, 0.1);
		@extend .radius20;
		@extend .font-family;
		a{color: inherit;}
	}
  }
  &:hover{
	 .img-inner {
	     img{ 
			-webkit-transform: scale3d(1.1,1.1,1);
			transform: scale3d(1.1,1.1,1);
		 }
	}
    .content-block { 
		clip-path: inset(0 0 0 0);
		-webkit-clip-path: inset(0 0 0 0);
		-webkit-transition: -webkit-clip-path .3s cubic-bezier(.63,.24,.26,.91) .1s;
		transition: -webkit-clip-path .3s cubic-bezier(.63,.24,.26,.91) .1s;
		-o-transition: clip-path .3s cubic-bezier(.63,.24,.26,.91) .1s;
		transition: clip-path .3s cubic-bezier(.63,.24,.26,.91) .1s;
		transition: clip-path .3s cubic-bezier(.63,.24,.26,.91) .1s,-webkit-clip-path .3s cubic-bezier(.63,.24,.26,.91) .1s;
	 }
   }
}
/* portfolio-effect3 */
.portfolio-effect3 {
	overflow: hidden;
	@extend .radius25;
	@extend .box-shadow;
	.wrapper{ position: relative; overflow:hidden; }
	img {
		width: 100%;
		height: 100% !important;
		object-fit: cover;
		-webkit-transform: scale(1.05);
		transform: scale(1.05);
		-webkit-transition: all 0.6s cubic-bezier(0.38, 0.005, 0.215, 1);
		transition: all 0.6s cubic-bezier(0.38, 0.005, 0.215, 1);
    }
	.details{
		position: absolute;
		display: block;
		overflow: hidden;
		width: calc(100% - 50px);
		height: auto;
		bottom: 0;
		right: 0;
		padding: 25px 30px;
		margin-right: 25px;
		margin-bottom: 25px;
		border-radius: 20px;
		z-index: 3;
		box-sizing: border-box;
		-webkit-transform: translateY(123%);
		-ms-transform: translateY(123%);
		transform: translateY(123%);
		background-color:rgba(255,255,255,0);
		-webkit-backdrop-filter:blur(14px) brightness(92%);
		backdrop-filter:blur(14px) brightness(92%);
		border:1px solid rgba(255,255,255,.1);
		-webkit-transition: .5s cubic-bezier(.26,.53,.58,1);
		-o-transition: .5s cubic-bezier(.26,.53,.58,1);
		transition: .5s cubic-bezier(.26,.53,.58,1);
		h5 {
			position: relative;
			overflow: hidden;
			will-change: transform;
			-ms-word-wrap: break-word;
			word-wrap: break-word;
			margin-bottom: 0;
			color:#fff;
			@extend .font-l-subtitle;
			a{ 
				color:inherit;
				&:before{
					content: attr(data-title);
					height: 100%;
					position: absolute;
					width: 100%;
					top: 0;
					left: 0;
					transform: translateY(110%);
					transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
				}
				span{
					display: inline-block;
					transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
					will-change: transform;
				}
			}
		}
		.portfolio-cates{ margin-bottom: 0;}
		.divider{color:#fff;padding-right:5px;font-size:12px;}
		h5, .portfolio-cates{
			-webkit-transform: translateY(-300%);
			-ms-transform: translateY(-300%);
			transform: translateY(-300%);
			-webkit-transition: .5s cubic-bezier(.21,.53,.58,1);
			-o-transition: .5s cubic-bezier(.21,.53,.58,1);
			transition: .5s cubic-bezier(.21,.53,.58,1);
		}
		&:hover{
			h5 a:before{ transform: translateY(0);}
			h5 span{ transform: translateY(-125%);}
		}
	}
	.portfolio-cates{
		.term{ 
			position: relative;
			color: rgba(255, 255, 255, 0.8);
			font-size: 14px;
			font-weight: 400;
			font-style: normal;
			letter-spacing: 1px;
			line-height: 1;
			@extend .font-family;
			a{ color:inherit;}
		}
	}
    &:hover {
		img{
			-webkit-transform: scale(1);
            transform: scale(1);
		}
		.details{
			-webkit-transform: translateY(0);
			-ms-transform: translateY(0);
			transform: translateY(0);
			h5, .portfolio-cates{
				-webkit-transform: translateY(0);
				-ms-transform: translateY(0);
				transform: translateY(0);
			}
		}
    }
}
/* portfolio-effect4 */
.portfolio-effect4 {
	position: relative;
    overflow: hidden;
	z-index: 1;
	-webkit-box-shadow: 0 18px 50px rgba(0, 0, 0, 0.07);
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.07);
	@include single-transition(all, .4s, ease-in-out);
	@extend .radius25;
	&.nori-medium .img-inner{ height:300px; }
	&.thumbnail{ border: 0; padding: 0; margin: 0; .img-inner{ height:400px;}}
	&.full .img-inner{ height:400px; }
	.img-inner{ height:400px; }
	.overlay-inner{
		-webkit-backdrop-filter: blur(14px) brightness(92%);
		backdrop-filter: blur(14px) brightness(92%);
		content: "";
		background: linear-gradient(0deg, var(--color-primary) 0%, rgba(0, 0, 0, 0.2) 45%);
		background-position: bottom left;
		background-repeat: repeat-x;
		position: absolute;
		bottom: 0px;
		left: 0px;
		width: 100%;
		height: 100%;
		z-index: 1;
		opacity: 0;
		transition: 0.5s ease-in-out;
		-ms-transition: 0.5s ease-in-out;
		-moz-transition: 0.5s ease-in-out;
		-o-transition: 0.5s ease-in-out;
	}
	.img-inner .img-perspective{
		width: 100%;
		height:100%;
		background-position: center;
		background-size: cover;
		background-clip: content-box;
		&:before{
			content: "";
			position: absolute;
			left: 0;
			width: 100%;
			height: 100%;
			z-index: 1;
			display: -webkit-box;
			display: -webkit-flex;
			display: -ms-flexbox;
			display: flex;
			bottom: 0;
			-webkit-transition: all 0.4s ease-in-out;
			-moz-transition: all 0.4s ease-in-out;
			-o-transition: all 0.4s ease-in-out;
			transition: all 0.4s ease-in-out;
		}
	}
	.perspective-caption{
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-ms-flex-direction: column;
		flex-direction: column;
		justify-content: flex-end;
		-ms-flex-wrap: nowrap;
		position: absolute;
		left: 0;
		bottom: -38px;
		width: 100%;
		height: 100%;
		padding: 0 35px 30px;
		z-index: 2;
		opacity: 0;
		transition: .5s ease;
		h5 { 
			@extend .font-subtitle;
			color:#fff;
			pointer-events: auto;
			margin-bottom: 0;
		}
		.term{ 
			font-size: 14px;
			font-weight: 500;
			font-style: normal;
			letter-spacing: 1px;
			line-height: 1;
			color:rgba(255,255,255,0.8); 
			margin:0px; 
			@extend .font-family;
		}
		.term a , .term a:hover{ color:rgba(255,255,255,0.9); }
		.divider { font-size:12px; padding:3px;}
	}
    &:hover {
		z-index: 3;
		transform: scale(1.02) translateZ(0);
		@extend .box-shadow2;
		.img-perspective{ transform:scale(1.15); -webkit-transform:scale(1.15);}
		.img-inner .img-perspective:before{ background: linear-gradient(180deg, transparent, #000); opacity: 0.8;}
		.perspective-caption{  
			opacity: 1;
            bottom: 0;
		}
		.overlay-inner{opacity:1;}
    }
}
@-webkit-keyframes toRightFromLeft{49%{-webkit-transform:translate(100%)} 50%{opacity:0;-webkit-transform:translate(-100%)} 51%{opacity:1}}
@-moz-keyframes toRightFromLeft{49%{-moz-transform:translate(100%)}50%{opacity:0;-moz-transform:translate(-100%)}51%{opacity:1}}
@keyframes toRightFromLeft{49%{transform:translate(100%)}50%{opacity:0;transform:translate(-100%)}51%{opacity:1}}
	
.mo-portfolio-carousel{
	.img-inner, .wrapper {
		height: 400px;
		width: 100%;
		.img-portfolio{
			height: 100%;
			width: 100%;
			background-position: center;
			background-size: cover;
			-webkit-transition: all cubic-bezier(.4,0,.2,1) .4s;
			-o-transition: all cubic-bezier(.4,0,.2,1) .4s;
			transition: all cubic-bezier(.4,0,.2,1) .4s;
		}
	}
	.owl-item:hover{
		z-index: 3;
		position: relative;
	}
}

.mo-portfolio-carousel.portfolio-effect3, .mo-portfolio-carousel.portfolio-effect4{
	-webkit-box-shadow:none;
		box-shadow: none;
}
.mo-element-mo-portfolio-carousel .owl-stage-outer{
	padding-top: 15px;
	padding-bottom: 15px;
}
.mfp-iframe-holder .mfp-close, .mfp-image-holder .mfp-close {@extend .bg-color-main;}
/* ------------------------------------- */
/* 6. vedio ............................ */
/* ------------------------------------- */
.mo-video-fancybox .video-button.dir_left, .mo-video-fancybox.left{
    float: left;
}
.mo-video-fancybox .video-button.dir_right, .mo-video-fancybox.right{
    float: right;
}
.mo-video-fancybox.style-1{
	a.video-button {
		display: block;
		position: relative;
		margin: auto;
		width: 90px;
		height: 90px;
		-webkit-transition: all 0.3s;
		-moz-transition: all 0.3s;
		transition: all 0.3s;
		border-radius: 100%;
		text-align: center;
		background-color: rgba(255, 255, 255, 0);
		-webkit-backdrop-filter: blur(14px) brightness(92%);
		backdrop-filter: blur(14px) brightness(92%);
		&:after {
			position: absolute;
			content: '';
			z-index: -1;
			opacity: 0.02;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			border-radius: inherit;
		}
		i { 
			text-align: center;
			color: currentColor;
			position: absolute;
			top: 37%;
			left: 0;
			right: 0;
			font-size: 25px;
			margin-left: 6px;
		}
		svg {
			width: 90px;
			height: 90px;
			.mo-stroke {
				stroke-dashoffset: 0;
				stroke-dasharray: 300;
				stroke-width: 3px;
				opacity: 0;
			}
			.mo-stroke-solid {
				stroke-dashoffset: 300;
				stroke-dasharray: 300;
				stroke-width: 3px;
				-webkit-transition: stroke-dashoffset 1s ease,opacity 1s ease;
				-moz-transition: stroke-dashoffset 1s ease,opacity 1s ease;
				-ms-transition: stroke-dashoffset 1s ease,opacity 1s ease;
				-o-transition: stroke-dashoffset 1s ease,opacity 1s ease;
				transition: stroke-dashoffset 1s ease,opacity 1s ease;
			}
		}
	}
	&:hover {
		a.video-button{ 
		    svg .mo-stroke-solid { stroke-dashoffset: 0; }
		}	
	}
	&.dark  a.video-button  { @extend .color-dark; &:after{ background:$color-black; }}
	&.primary a.video-button{ @extend .color-main; &:after{ background: var(--color-primary); }}
	&.light a.video-button  { color:#fff; &:after{ background:#fff; }}
	&.grey a.video-button   { color: var(--color-grey); &:after{ background: var(--color-grey); }}
}

.mo-video-fancybox.style-2{
	.video-button{
		width: 100px;
		height: 100px;
		line-height: 100px;
		padding: 0;
		font-size: 14px;
		font-weight: 500;
		letter-spacing: 2px;
		color: #818a91;
		margin: auto;
        background-color: transparent;
		transition-duration: .3s;
        transition-property: transform;
        transition-timing-function: ease-out;
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		background-color: rgba(255, 255, 255, 0);
		-webkit-backdrop-filter: blur(14px) brightness(92%);
		backdrop-filter: blur(14px) brightness(92%);
		border: 0;
		@include border-radius(50%);
		&:after{
			content: "PLAY";
			background-color: transparent !important;
		}
	}
	.video-button svg, i{display:none;}
	&:hover{
		.video-button{ transform: translateY(8px); }
	}
	&.dark a.video-button   { color:var(--color-dark); border-color:var(--color-dark); }
	&.primary a.video-button{ @extend .color-main; @extend .border-color-main;}
	&.light a.video-button  { color:#fff; border-color:#fff; }
	&.grey a.video-button   { color:var(--color-grey); border-color:var(--color-grey);}
}

.mo-video-fancybox.style-3{
	padding: 5px;
	.video-button{
		height: 65px;
        width: 65px;
		border-radius: 50%;
		position: relative;
		display: block;
		-webkit-box-align: center;
		align-items: center;
		display: inline-flex;
		height: 55px;
		width: 55px;
		border-radius: 50%;
		-webkit-box-pack: center;
		justify-content: center;
		&:before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;border:solid 6px;border-color:inherit;}
		svg{display: none;}
		i{color: #fff;}
	}
	&:hover{
		.video-button:before{-webkit-animation:border-pop 1s ease-in-out;animation:border-pop 1s ease-in-out;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}
	}
	&.dark a.video-button   { color:var(--color-dark); background:var(--color-dark);}
	&.primary a.video-button{ @extend .color-main; @extend .bg-color-main;}
	&.light a.video-button  { color:#fff; background:#fff; i{@extend .color-dark;}}
	&.grey a.video-button   { color:var(--color-grey); background:var(--color-grey);i{@extend .color-dark;}}
}
@-webkit-keyframes border-pop{100%{top:-12px;right:-12px;bottom:-12px;left:-12px;opacity:0;}}
@keyframes border-pop{100%{top:-12px;right:-12px;bottom:-12px;left:-12px;opacity:0;}}
.mo-element-mo-rev-slider .mo-video-fancybox.style-3{ padding:15px;}
/* mo-circle */
.mo-circle{
	width: 200px;
	height: 200px;
	position: relative;
	border-radius: 50%;
	&.text-center{ margin: auto; }
	&.text-right { float: right; }
	.mo-circle-box{
		width: 200px;
		height: 200px;
		position: relative;
		border-radius: 50%;
		&:after{
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			background: rgba(255, 255, 255, 0.01);
			-webkit-backdrop-filter: blur(10px);
			backdrop-filter: blur(10px);
			border-radius: 50%;
			z-index: -1;
		}
		svg{margin: 20px;}
	}
	.mo-circle-icon{
		position: absolute;
		top: 50%;
		left: 50%;
		margin-right: -50%;
		transform: translate(-50%,-50%);
		i{color:#fff; font-size: 50px;transform: rotate(-270deg);}
		svg{
			width: 50px;
			height: 50px;
			path{fill:#fff;}
		}
	}
	&.circle-small{
		width:150px; height:150px;
		.mo-circle-box{width:150px; height:150px;}
		i{font-size:40px;}
		.mo-circle-icon svg{ width:30px; height:30px;}
		.mo-circle-box svg{margin:15px;}
		text{font-size: 21px; letter-spacing: 5px;}
	}
	&.circle-dark{
		.mo-circle-box:after{ background:rgba(0, 0, 0, 0.02);}
		.mo-circle-icon{
			i{color:var(--color-dark);}
			svg path{fill:var(--color-dark);}
		}
	}
	&.circle-primary{
		.mo-circle-box:after{background:var(--color-primary);-webkit-backdrop-filter:none; backdrop-filter:none;}
	}
	text {
		fill:#fff;
		transform-origin: 50% 50% 0;
		transform: rotate(0deg);
		-webkit-animation: rotateIt 15s linear infinite;
		-moz-animation: rotateIt 15s linear infinite;
		animation: rotateIt 15s linear infinite;
		font-size: 16px;
		text-transform: uppercase;
		letter-spacing: 4px;
		font-weight: 500;
	}
}
@keyframes rotateIt { to { transform: rotate(-360deg); }}
/* ------------------------------------- */
/* 7. team ............................. */
/* ------------------------------------- */
.mo-team {
    position: relative;
	.team-img{
		@extend .radius25;
	}
	.team-member{
		max-width: 420px;
		margin-top: 15px;
        margin-bottom: 15px;
	}
	.social-icons a {
		margin: 0;
		width: 45px;
		height: 45px;
		line-height: 45px;
	}
}
.team-title {
	h5 { 
		display: block;
		margin-bottom: 0;
		font-style: normal;
		text-transform: capitalize;
		@extend .font-l-subtitle;
		a { color:inherit; }
	}
	h6 {
		margin-bottom: 0;
		font-weight: 400;
		font-size: 15px;
		line-height: 26px;
		letter-spacing: 0;
		font-style: normal;
		text-transform: capitalize;
		@extend .font-family;
	}
}
.mo-team .team-member:hover .team-social:hover a{opacity:.3 !important}
.mo-team .team-member:hover .team-social a:hover{opacity:1 !important}
/* team member tpl1 */
.mo-team.tpl1 {
	position: relative;
	padding: 0;
   .team-member{
		position:relative;
		overflow:hidden;
		height: 270px;
		width: 270px;
		@include single-transition(all, .4s, ease-in-out);
		.team-img{ 
			position: relative; 
			overflow: hidden;
			border-radius: 50%;
            height: 270px;
            width: 270px;
		}
		img {
			position: relative;
			display: block;
			-webkit-transition: opacity 0.55s cubic-bezier(.15,.75,.5,1) 0.25s, transform 0.45s cubic-bezier(.15,.75,.5,1) 0s;
            transition: transform 0.45s cubic-bezier(.15,.75,.5,1) 0s, opacity 0.55s cubic-bezier(.15,.75,.5,1) 0.25s;
		}
		.overlay{
			content: "";
			height: 100%;
			width: 100%;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 1;
			background-color: rgba(255, 255, 255, 0);
			-webkit-backdrop-filter: blur(14px) brightness(92%);
			backdrop-filter: blur(14px) brightness(92%);
			display: flex;
			justify-content: flex-start;
			align-items: flex-end;
			opacity: 0;
			transition: opacity .6s cubic-bezier(.22,.61,.36,1);
		}
	    .team-social{
			position: absolute;
			z-index: 3;
			top: 25px;
			top: 20px;
			right: 0;
			display: flex;
			flex-direction: column;
			a.mo-team-icon{ 
				opacity: 0;
				visibility: hidden;
				transition: all 0.5s ease;
				-webkit-transform: translateY(100%);
				-ms-transform: translateY(100%);
				transform: translateY(100%);
				background-color: transparent;
				color: #fff;
				font-size: 12px;
				margin: 0 20px;
				width: 35px;
				height: 35px;
				line-height: 40px;
				i{padding-left: 5px;}
				&:after{
					content: "";
					position: absolute;
					width: 30px;
					height: 30px;
					display: block;
					left: 5px;
					top: 5px;
					z-index: -1;
					border: 1px solid rgba(255, 255, 255, 0.2);
					border-radius: 50%;
					box-sizing: border-box;
				}
				&:hover:after{ animation: mo-menu-circle-border-wh 1s forwards; }
		    }
		    .mo-team-icon-opener a{
				position: relative;
				top: 0;
				right: -20px;
				display: block;
				float: none;
				z-index: 1;
				overflow: hidden;
				margin-bottom: 5px;
				@extend.radius50;
				background-color: rgba(255, 255, 255, 0);
				-webkit-backdrop-filter: blur(14px) brightness(92%);
				backdrop-filter: blur(14px) brightness(92%);
				border-radius: 20px;
				border: 1px solid rgba(255, 255, 255, .1);
				color:#fff;
			}
			&:hover a.mo-team-icon{
				opacity: 1!important;
				transform: translateX(0)!important;
				pointer-events: auto!important;
				visibility: visible;
				&:first-child  { -webkit-transition-delay: .07s; transition-delay: .07s; }
				&:nth-child(2) { -webkit-transition-delay: .15s; transition-delay: .15s; }
				&:nth-child(3) { -webkit-transition-delay: .23s; transition-delay: .23s; }
				&:nth-child(4) { -webkit-transition-delay: .30s; transition-delay: .30s; }
				&:nth-child(5) { -webkit-transition-delay: .38s; transition-delay: .38s; }
				&:nth-child(6) { -webkit-transition-delay: .46s; transition-delay: .46s; }
				&:nth-child(7) { -webkit-transition-delay: .53s; transition-delay: .53s; }
				&:nth-child(8) { -webkit-transition-delay: .61s; transition-delay: .61s; }
				&:nth-child(9) { -webkit-transition-delay: .69s; transition-delay: .69s; }
			}
        }
	
	    .team-title{ 
		    position: absolute;
			z-index: 2;
			width: 100%;
			bottom: 0px;
			padding: 0 55px 55px;
			opacity: 0;
			visibility: hidden;
			-webkit-transform: translateY(10px);
			transform: translateY(10px);
			-webkit-transition: all 0.45s cubic-bezier(0.23, 0.88, 0.34, 0.99);
			transition: all 0.45s cubic-bezier(0.23, 0.88, 0.34, 0.99);
			h6{ color:rgba(255,255,255,.8); }
			h5{
				color:#fff; 
				margin-bottom:2px;
				text-decoration: none;
				position: relative;
				overflow: hidden;
				will-change: transform;
				-ms-word-wrap: break-word;
				word-wrap: break-word;
				span {
					display: inline-block;
					transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
					will-change: transform;
				}
				&:before {
					content: attr(data-title);
					height: 100%;
					position: absolute;
					width: 100%;
					top: 0;
					left: 0;
					transform: translateY(110%);
					transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
				}
				&:hover { 
					&:before { transform: translateY(0); }
					span { transform: translateY(-125%); }
				}
			}
		}
		&:hover{
			z-index: 1;
			transform: scale(1.08) translateZ(0);
			.team-title{ 
				opacity: 1;
				visibility: visible;
				-webkit-transform: translateY(0);
				transform: translateY(0);
				h5{ -webkit-transition-delay: 0.25s; transition-delay: 0.25s; }
                h6{ -webkit-transition-delay: 0.33s; transition-delay: 0.33s; }
			}
			.overlay{
				opacity: 1;
			}
			img {
				-webkit-transform: scale(1.04);
				-ms-transform: scale(1.04);
				transform: scale(1.04);
			}
			.team-title h5 { 
				&:before { transform: translateY(0); }
				span { transform: translateY(-125%); }
			}
		}
	}
}
.mo-team.tpl1 .testimonial-carousel .team-member:hover {
	box-shadow: none;
}
/* team member temp2 */
.mo-team.tpl2 {
  position: relative;
  overflow: visible;
  .team-member{
	  position: relative;
	  overflow: visible;
	  @include single-transition(all, .4s, ease-in-out);
	    img{
		   width: 100%;
	    }
		.team-img{ 
			position: relative; 
			overflow: hidden;
			img{ @include single-transition(all, .4s, ease-in-out);}
			.overlay{
				content: "";
				height: 100%;
				left: 0;
				position: absolute;
				top: 0;
				width: 100%;
				z-index: 1;
				-webkit-transition: -webkit-transform 1.5s cubic-bezier(0.19,1,0.22,1);
				transition: transform 1.5s cubic-bezier(0.19,1,0.22,1);
				-webkit-transform: scaleY(0);
				transform: scaleY(0);
				-webkit-transform-origin: bottom left;
				transform-origin: bottom left;
				background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 5%, rgba(0, 0, 0, 0.31) 50%, rgba(0, 0, 0, 0.65) 100%);
			}
		}
	    .team-title{ 
			position: absolute;
			z-index: 1;
			left: 20px;
			bottom: 15px;
			width: calc( 100% - 40px );
			padding: 18px 20px 14px;
			background-color: #fff;
			display: -webkit-box;
			display: -ms-flexbox;
			display: flex;
			-webkit-box-orient: vertical;
			-webkit-box-direction: normal;
			-ms-flex-direction: column;
			flex-direction: column;
			@extend .radius25;
			background-color:rgba(255,255,255,0);
			-webkit-backdrop-filter:blur(14px) brightness(92%);
			backdrop-filter:blur(14px) brightness(92%);
			border:1px solid rgba(255,255,255,.1);
			border-radius:20px;
			h5{ color: #fff; }
			h6{ color: #fff; opacity: 0.8; }
		}
	    .team-social{
			position: absolute;
			z-index: 2;
			top: 20px;
			right: 0;
			display: flex;
			flex-direction: column;
			opacity: 0;
			transition: opacity .3s ease-out;
			z-index: 3;
			a{
				background-color: transparent;
				color:#fff;
				position: relative;
				padding: 9px;
				margin: 0 20px 10px;
				font-size: 16px;
				width: 35px;
                height: 35px;
				line-height: 1;
				text-align: center;
				transform: translateY(-15px);
				transition: .45s cubic-bezier(.5,1,.89,1);
				&:first-child  { -webkit-transition-delay: .50ms; transition-delay: .50ms; }
				&:nth-child(2) { -webkit-transition-delay: .1s; transition-delay: .1s; }
				&:nth-child(3) { -webkit-transition-delay: .15s; transition-delay: .15s; }
				&:nth-child(4) { -webkit-transition-delay: .2s; transition-delay: .2s; }
				&:nth-child(5) { -webkit-transition-delay: .25s; transition-delay: .25s; }
				&:nth-child(6) { -webkit-transition-delay: .3s; transition-delay: .3s; }
				&:nth-child(7) { -webkit-transition-delay: .35s; transition-delay: .35s; }
				&:nth-child(8) { -webkit-transition-delay: .4s; transition-delay: .4s; }
				&:nth-child(9) { -webkit-transition-delay: .45s; transition-delay: .45s; }
				&:after{
					content: "";
					position: absolute;
					width: 35px;
					height: 35px;
					display: block;
					left: 0;
					top: 0;
					z-index: -1;
					border: 1px solid rgba(255, 255, 255, 0.2);
					border-radius: 50%;
					box-sizing: border-box;
				}
			}
		}
		&:hover{
		  .overlay{
			-webkit-transform: scaleY(1);
			transform: scaleY(1);
			opacity: 1;
		  }
		  .team-social{ 
			opacity:1;
				a{ 
					-webkit-transform: translate3d(0,0,0);
					-moz-transform: translate3d(0,0,0);
					transform: translate3d(0,0,0);
			    	&:hover:after{ animation: mo-menu-circle-border-wh 1s forwards; }
				}
			}
	    }
    }
}

/* team member tpl3 */
.mo-team.tpl3 {
	.team-member{
		overflow: visible;
		@include single-transition(all, 0.4s , ease-in-out);
		.team-img{
			position: relative;
			overflow: hidden;
			display: block;
			z-index: 1;
			width: 270px;
			height: 270px;
			border-radius: 50%;
			margin: auto;
			img{ min-width:100%; transition: all 1s cubic-bezier(.19,1,.22,1); }
		     &::after{
				content: "";
				position: absolute;
				width: 100%;
				height: 100%;
				z-index: 2;
				top: 0;
				left:0;
				opacity: 0;
				background-color: rgba(255, 255, 255, 0);
				-webkit-backdrop-filter: blur(14px) brightness(92%);
				backdrop-filter: blur(14px) brightness(92%);
				@include single-transition(all, 0.4s , ease-in-out);
			}
	    }
	}
	.team-title{
		padding: 15px 0;
		text-align: center;
		h5{
			text-align: center;
		    text-decoration: none;
			position: relative;
			overflow: hidden;
			will-change: transform;
			-ms-word-wrap: break-word;
			word-wrap: break-word;
			span {
				display: inline-block;
				transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
				will-change: transform;
			}
			&:before {
				content: attr(data-title);
				height: 100%;
				position: absolute;
				width: 100%;
				top: 0;
				left: 0;
				transform: translateY(110%);
				transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
			}
			&:hover { 
				&:before { transform: translateY(0); @extend .color-main; }
				span { transform: translateY(-125%); }
			}
		}
		h6{
			text-align: center;
			right: 0;
			left: 0;
			color: $color-dark-gray;
		}
	}
	.team-social{
		position:absolute;
		z-index: 2;
		left: 50%;
		transform: translate(-50%,-50%);
		display: flex;
		justify-content: center;
		a{ 
			width: 40px;
			height: 40px;
			line-height: 40px;
			color: #fff;
			margin: 0 3px;
			opacity: 0;
			font-size: 14px;
			visibility: hidden;
			transition: all 0.5s ease;
			transform: translateY(-90px);
			&:after{
				content: "";
				position: absolute;
				width: 40px;
				height: 40px;
				display: block;
				left: 0;
				top: 0;
				z-index: -1;
				border: 1px solid rgba(255,255,255,0.2);
				border-radius: 50%;
				box-sizing: border-box;
			}
			&:hover{background-color: transparent;}
	    }
	}
	.team-member:hover{
		.team-img{ 
			&:after{ opacity:1;}
			img{ transform: scale(1.15); }
		}
		.team-title h5{
			&:before { transform: translateY(0); @extend .color-main; }
			span { transform: translateY(-125%); }
		}
		.team-social a{  
			opacity: 1;
			visibility: visible;
			//transform: translateY(-50px);
			&:first-child  { transform: translateY(-60px); -webkit-transition-delay: .07s; transition-delay: .07s; }
			&:nth-child(2) { transform: translateY(-40px); -webkit-transition-delay: .15s; transition-delay: .15s; }
			&:nth-child(3) { transform: translateY(-40px); -webkit-transition-delay: .23s; transition-delay: .23s; }
			&:nth-child(4) { transform: translateY(-60px); -webkit-transition-delay: .30s; transition-delay: .30s; }
			&:nth-child(5) { display:none; -webkit-transition-delay: .38s; transition-delay: .38s; }
			&:nth-child(6) { display:none; -webkit-transition-delay: .46s; transition-delay: .46s; }
			&:nth-child(7) { display:none; -webkit-transition-delay: .53s; transition-delay: .53s; }
			&:nth-child(8) { display:none; -webkit-transition-delay: .61s; transition-delay: .61s; }
			&:nth-child(9) { display:none; -webkit-transition-delay: .69s; transition-delay: .69s; }
			&:hover:after{ animation: mo-menu-circle-border-wh 1s forwards; }
		 }
	}
}
.mo-team.tpl3 .owl-item .team-member .team-img{
	box-shadow: none;
}
.zigzag.mo-team .owl-item:nth-child(odd) .team-member, .zigzag .mo-team .owl-item:nth-child(odd) .team-member{
	margin-top: 50px;
}
.mo-teams-carousel .owl-carousel .owl-stage-outer{
	overflow: visible;
}
.team-empty{
	width: 270px !important;
    height: 270px !important;
	border-radius: 50%;
}
/* ------------------------------------- */
/* 8. pricing .......................... */
/* ------------------------------------- */
.pricing-item{
	position:relative;
	float: none;
	margin: 20px;
	float: none;
    margin: 0 auto;
    max-width: 360px;
	@extend .radius25;
	@include single-transition(all, .4s, ease-in-out);
	.pricing-title{
		position: relative;
		z-index: 1;
	}	
	.pricing .currency, .pricing .price{ @extend .bold-weight; }
	h3.title{ @extend .font-l-subtitle; }
    .package-img img {
		max-width: 60px;
		margin: auto;
		float: none;
		display: block;
	}
	ul li .icon {
		display: block;
		position: relative;
		top: 0;
		left: 0;
		font-size: 14px;
		float: left;
		margin-right: 10px;
		width: 10px;
		opacity: 0.5;
		svg{ @extend .fill-main;}
	}
}

.pricing-item.style1{
	background-color:#fff;
	overflow: hidden;
	padding: 50px 30px 30px;
	.pricing-title{
		h3{ 
			font-size: 18px;
			margin-bottom: 25px;
		}
	}
	span.pricing-best-label.style1 {
		top: 30px;
        right: 20px;
	}
	.pricing{
		position: relative;
		.pricing-currency{ 
			float: none;
			display: block;
			margin-right: 15px;
			color:$color-black;
			font-size:40px; 
			line-height:1; 
		}
		.pricing-period{ font-size:13px; display:block; font-weight: 500; margin-bottom: 15px; } 
	}
	.package-img{
		width: 70px;
		height: 70px;
		padding: 0;
		display: block;
		position: relative;
		margin: 0;
		background-size: 100%;
		background-repeat: no-repeat;
		float: none;
		img{max-width: 50px;}
	}
	.button{ 
		width:100%;
		margin-bottom: 0;
		display: block;
		padding: 10px;
		color:#fff;
		@extend .bg-dark;
		span.button-text{text-align:center; margin:auto;}
	}
	.button.roll:hover .mo_btn_text.back {
		transform: translate(-50%, 50%);
	}
	.content { 
		padding:30px 0px;
		width: 100%;
		border-top: 1px solid #eee;
	 }
	ul{  padding:0;  margin: 0; 
		li{ 
			position: relative;
			list-style:none;
			line-height: 30px;
			font-size: 15px;
			font-weight: 400;
			padding-left: 10px;
			margin-left: 30px;
			color: $color-content;
			.icon {
				display: block;
				position: absolute;
				top: 0;
				font-size: 12px;
				left: -15px;
				width: 10px;
				height: 10px;
				opacity: 0.3;
				@extend .color-main;

			}
		}
	}
}
.pricing-item.style1.depth, .pricing-item.style1.pricing-best{
    z-index: 3;
	margin: 0;
	-webkit-transform: translateY(-5px) scale(1.13);
	transform: translateY(-5px) scale(1.13);
	@extend .box-shadow2;
	.button{ color:#fff; @extend .bg-color-main; }
}

.pricing-item.style2{
	padding: 50px 40px 40px !important;
	text-align:center;
	margin: 20px auto;
	background: #fff;
	@extend .box-shadow;
	@include scale(0.97);
	 .package-img{
		width: 90px;
		height: 90px;
		padding: 20px;
		display: block;
		position: relative;
		margin: 0 auto 20px;
		background-size: 100%;
		background-repeat: no-repeat;
		float: none;
		img{max-width:100%;}
		&:after{
			width: 100%;
			height: 100%;
			text-align: center;
			content: "";
			position: absolute;
			left: 0;
			z-index: -1;
			top: 0;
			border-radius: 50%;
			opacity: 0.1;
			@extend .bg-color-main;
		}
	}	
	.pricing{
		display: inline-block;
		width: 100%;
		margin-bottom: 0.2em;
		.pricing-currency{
			 display: inline-block;
			 font-size: 40px;
			 @extend .bold-weight;
			 @extend .font-primary;
			 @include single-transition(all, .4s, ease-in-out);	
			 color: var(--color-primary); 
		 }
		.pricing-period{
	     	padding-left: 5px;
            margin-top: 15px;
            display: inline-block;
			font-size: 11px;
            line-height: 14px;
			color: $color-font;
		}
	}
	.button{
		width: 100%;
		margin-bottom: 0;
		display: block;
		padding: 10px;
		span.button-text{text-align:center; margin:auto;}
		&:hover{ color:#fff; @extend .bg-color-main;}
	 }
	.button.roll:hover .mo_btn_text.back {
		transform: translate(-50%, 50%);
	}
    .content { 
		margin:25px 0 0;
		padding: 25px 0;
		width: 100%;
		color:$color-content;
		text-align: left;
		text-align: left;
		border-top: 1px solid #e8e9f1;
	}
	ul{ padding:0; margin:0; 
		li{ 
			position: relative;
			list-style:none;
			line-height: 29px;
			font-size: 15px;
			font-weight: 400;
			padding-right: 10px;
			.icon {
				display: block;
				position: relative;
				top: 0;
				left: 0;
				font-size: 14px;
				float: left;
                margin-right: 10px;
				width: 10px;
				opacity: 0.5;
				svg{ @extend .fill-main;}
			}
		}
	}
}
.pricing-item.style2.active {
    transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    z-index: 40;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
	-ms-backface-visibility: hidden;
	@extend .box-shadow2;
	opacity: 1;
   .button{ @extend .bg-color-main; color:#fff; }
   .content-img{ opacity:1; }
}
.pricing-item.style2.depth {
    z-index: 3;
    margin: 0;
    -webkit-transform: translateY(-10px) scale(1.1);
    transform: translateY(-10px) scale(1.1);
}

.pricing-item.style3{
	padding: 40px;
	text-align: left;
	overflow: hidden;
	@extend .bg-grey;
	@include single-transition(all, .4s, ease-in-out);
	.pricing-title{
		position: relative;
		overflow: hidden;
		z-index: 1;
	}
	h3.title{
        margin: auto;
		text-align: center;
		font-weight: 400;
	}
	.pricing{
		position: relative;
		text-align: center;
		.pricing-currency{ color:$color-black; display:inline-block; font-size:40px; line-height:51px; font-weight:500; }
		.pricing-period{ font-size:13px; display:inline-block; } 
	}
	.package-img{
		width: 90px;
		height: 90px;
		padding: 20px;
		display: block;
		position: relative;
		margin: 0 auto 10px;
		background-size: 100%;
		background-repeat: no-repeat;
		float: none;
		img{max-width:50px;}
		&:after{
			width: 100%;
			height: 100%;
			text-align: center;
			content: "";
			position: absolute;
			left: 0;
			z-index: -1;
			top: 0;
			border-radius: 50%;
			background-color: #fff;
			@include single-transition(all, .4s, ease-in-out);
		}
	}	
	ul.content{ 
		list-style:none;
		padding: 25px 0;
        margin-top: 25px;
		margin-bottom: 0;
		border-top: 1px solid #eee;
		li{ 
			position: relative;
			list-style:none;
			line-height: 24px;
			font-size: 15px;
			font-weight: 400;
			padding-left: 10px;
			margin: 8px 0 8px 30px;
			color: $color-content;
			.icon {
				display: block;
				position: absolute;
				top: 0;
				font-size: 12px;
				left: -20px;
				@extend .color-main;
			}
		}
	}
	.button{
		width: 100%;
		margin-bottom: 0;
		display: block;
		padding: 10px;
		color:#fff;
		@extend .bg-dark;
		span.button-text{text-align:center; margin:auto;}
		&:hover{ @extend .bg-color-main;}
	 }
	.button.roll:hover .mo_btn_text.back {
		transform: translate(-50%, 50%);
	}
}
.pricing-item.style3.active{
	z-index: 3;
	-webkit-transform: translateY(-10px) scale(1.1);
	transform: translateY(-10px) scale(1.1);
	background: #fff;
	@extend .box-shadow2;	
	.package-img:after{@extend .bg-grey;}
}
.pricing-item.style3.pricing-best{
	.button{ @extend .bg-color-main; color:#fff;}
}

.pricing-item.style4{
	padding: 30px;
    @extend .border;
	@include single-transition(all, .4s, ease-in-out);
	span.style4.pricing-best-label{ 
		position: relative;
		right: 0;
		top: 0;
		display: inline-block;
		margin-bottom: 30px;
	}
	.package-img{
		margin-bottom:15px;
		position: absolute;
        right: 0;   
		img{max-width:60px;}
	}
	h3.title {
	   font-size: 18px;
	   margin-bottom: 30px;
	}
	.pricing{
		position: relative;
		width: 75%;
		.pricing-currency{ 
			margin: auto;
			float: none;
			display: inline-block;
 			color: var(--color-primary);
			font-size:40px; 
			line-height:1; 
			letter-spacing: -1px;
		 }
		.pricing-period{ font-size:13px; margin-bottom:0; line-height:1.3; display:inline-block; font-weight: 500; } 
	}
	ul.content{  
		list-style: none;
		padding: 0;
		margin: 0;
		&:before{
			position: relative;
			top: 0;
			display: block;
			content: "";
			width: calc( 100% + 60px);
			height: 1px;
			background: rgba(10, 29, 53, 0.1);
            margin: 0 0 30px -30px;
		}
		li{ 
			position: relative;
			list-style:none;
			line-height: 30px;
			font-size: 15px;
			font-weight: 400;
			padding-left: 10px;
			color: $color-content;
			padding-bottom: calc(12px/2);
			.icon {
				@extend .color-main;
				display: block;
				position: relative;
				top: 0;
				left: 0;
				font-size: 14px;
				float: left;
				margin-right: 10px;
				width: 10px;
				opacity: 0.5;
				.fa-check-circle{width: 1.25em; font-size: 18px;}
			}
		}
	}
	.button{
		width: 100%;
		margin-bottom: 0;
		display: block;
		padding: 12px;
		margin-top: 15px;
		color:#fff;
		@extend .bg-dark;
		span.button-text{text-align:center; margin:auto;}
		&:hover{ @extend .bg-color-main;}
	 }
	.button.roll:hover .mo_btn_text.back {
		transform: translate(-50%, 50%);
	}
}
 .pricing-item.style4.depth {
	@extend .border-color-main;
	.button{ @extend .bg-color-main; color:#fff;}
}

.pricing-item span.pricing-best-label.style1, .pricing-item span.pricing-best-label.style4 {
	position: absolute;
	right: 20px;
    top: 30px;
	z-index: 1;
	display: block;
	margin: 0;
	padding: 0px 10px 0 10px;
	font-size: 11px;
    line-height: 0.1em;
    letter-spacing: 0.9px;
	@include border-radius(25px);
	@extend .bold-weight;
	@extend .color-main; 
	&::before{
		border-radius: inherit;
		position: absolute;
		content: '';
		width: 100%;
		height: 20px;
		left: 0;
		top: -10px;
		opacity: 0.1;
		@extend .bg-color-main; 
	}
}
.pricing-item span.pricing-best-label.style3 {
    z-index: 99999999;
    display: block;
    font-size: 11px;
    letter-spacing: 0.9px;
    color: #fff;
	width: 210px;
    position: absolute;
    top: 15px;
    right: -48px;
    transform: rotate(27deg);
    text-align: center;
	@extend .bold-weight;
	@extend .bg-color-main; 
}
.pricing-item span.pricing-best-label.style2 {
	position: absolute;
	right: -9px;
	top: 20px;
	z-index: 1;
	display: block;
	margin: 0;
	padding: 0px 15px;
	font-size: 11px;
	line-height: 25px;
    letter-spacing: 0.9px;
	text-transform: uppercase;
	border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    border-top-right-radius: 4px;
	background: #fff;
	@extend .bold-weight;
	@extend .color-main; 
	&::before{
		border-radius: inherit;
		position: absolute;
		content: '';
		width: 100%;
		height: 100%;
		left: 0;
		top: 0;
		opacity: 0.1;
		@extend .bg-color-main; 
	}
	&::after{
		position: absolute;
		top: 100%;
		right: 0;
		content: " ";
		width: 0;
		height: 0;
		border-style: solid;
		border-width: 10px 10px 0 0;
		border-color: rgba(0, 0, 0, 0.75) transparent transparent transparent;
	}
}
.pricing-item ul li.false {opacity: 0.5;}
.pricing-item ul li.false:after { content:"\f00d";}
.pricing-item.style3 ul li.false:after {
    content: "";
    display: block;
    width: 50%;
    height: 2px;
    background: #ccc;
    position: absolute;
    top: 50%;
    right: 25%;
    left: 25%;
}
/* ------------------------------------- */
/* 9. testimonial ...................... */
/* ------------------------------------- */
.mo-testimonial{
	.testimonial-title {
		h5{ 
			font-size: 17px;
			margin-bottom: 0;
			line-height: 1;
			letter-spacing: -0.02em;
			text-transform: capitalize;
			@extend .font-l-subtitle;
			text-decoration: none;
			position: relative;
			overflow: hidden;
			will-change: transform;
			-ms-word-wrap: break-word;
			word-wrap: break-word;
			margin-bottom:5px;
			span{
				display: inline-block;
				transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
				will-change: transform;
			}
			&:before {
				content: attr(data-title);
				height: 100%;
				position: absolute;
				width: 100%;
				top: 0;
				left: 0;
				transform: translateY(110%);
				transition: transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95), -webkit-transform 1.05s cubic-bezier(0.3, 0.86, 0.36, 0.95);
			}
		 }
		 h6{
			font-size: 14px;
			line-height: 1.5;
			font-weight: 400;
			padding-bottom: 20px;
			margin: 2px auto;
			opacity: 0.6;
			color: $color-black;
			text-transform: capitalize;
			@extend .font-family;
		}
	}
	.item:hover {
		.testimonial-title h5 span{ transform: translateY(-125%); }
		.testimonial-title h5:before{ transform: translateY(0); }
    }
	.content{  
		font-weight: 400;
		font-size: 16px;
		text-transform: none;
		line-height: 30px;
		letter-spacing: 0;
		max-width: 750px;
		h4{ @extend .font-subtitle; } 
	}
	.testimonial-avatar{
		width: 60px;
        height: 60px;
		overflow: hidden;
		@include border-radius(50%);
		position: relative;
		z-index: 2;
		margin-bottom: 30px;
		figure{
			width: 100%;
			height: 100% !important;
			object-fit: cover;
			img{ min-width:100%; height: 100% !important; object-fit: cover;}
		}
	}	
	.testimonial-avatar.sec{
		float: left;
		display: inline-block; 
		margin-right: 15px;
        margin-top: -8px;
	}	
}
.mo-star-rating{
	padding: 0;
    margin: 0;
    list-style: none;
	li{
		display: inline-flex;
		font-size: 1em;
		line-height: 1.5em;
		color: #e2eaff;
		letter-spacing: .1em;
		margin: 0;
		svg{
			width: 15px;
            height: 15px;
		}
	}
	.active {
		color: #fc0;
	}
}

.mo-testimonial.tpl1{
   .testimonial-details{
	   h5{ color:$color-font; }
	   h6 { color:$color-content; }
	   .content p { color:$color-font; }
	}
	.testimonial-title{margin-top:10px;text-align:left;}
	svg.quote{
		margin-bottom: 15px;
		path{stroke:var(--color-primary);}
	}
	.content{ 
	  position: relative;
	  margin: 0;
	  font-size: 26px;
      line-height: 44px;
      font-weight: 500;
	  color: $color-font;
	  text-align: left; 
	  padding-bottom: 10px;
	  margin-bottom: 30px;
	  border-bottom: 1px solid #E9E9E9;
	  h4{ @extend .color-main;}
   }
   .testimonial-avatar.top{display:none;}
   .testimonial-avatar.sec {
		position: relative;
		figure{
			float: left;
			display: inline-block;
			margin-right: 15px;
		    margin-top: -8px;
			@include border-radius(50%);
		}
   }
   .owl-dots {
		text-align: left;
		margin-left: 15px;
   }
}
/* mo-testimonial-carousel.tpl2 */
.mo-testimonial.tpl2{ 
	svg path{ fill: var(--color-primary);}
	.content{ 
		position: relative;
		margin: 0 auto 10px;
		font-size: 24px;
		line-height: 38px;
		font-weight: 400;
		@extend .font-primary;
		p{ padding: 0 40px; margin-top:20px; }
		h4{ @extend .color-main; font-style: italic;}
   }
	.testimonial-avatar.top{
		position: relative;
		margin: auto;
		width: 90px !important;
		height: 90px;
		margin-bottom: -24px;
		overflow: hidden;
		@extend .box-shadow;
		figure{ @include border-radius(50%); }
	}
    .testimonial-avatar.sec{
		display:none;
	}
	.testimonial-item {
		padding-top: 50px
	}
    .testimonial-details{ 
         position: relative; margin:0 auto; text-align:center; display:block;
		.testimonial-title{
			margin-top: 20px; 
	        h6{ margin-bottom: 25px; }
		}
   }
}
.mo-testimonial.nav-middle.tpl2 {
    max-width: 900px;
    margin: auto;
    float: none;
}
/* mo-testimonial-carousel.tpl3 */
.mo-testimonial.tpl3{
   .item{
	    text-align: left;
		position: relative;
		padding: 50px 40px 20px 40px;
		background: #fff;
	    overflow: hidden;
		box-shadow: 0px 30px 40px rgba(2, 45, 62, 0.08);
		backdrop-filter: blur(14px) brightness(.92);
		-webkit-backdrop-filter: blur(14px) brightness(.92);
		@include border-radius(25px);
		@include single-transition(all, .4s, ease-in-out);	
		.mo-star-rating{margin-bottom:5px;}
		.testimonial-avatar{
			width: 50px;
			height: 50px;
			margin-bottom: 0;
		}
	}
   .testimonial-avatar.top{display:none;}
   .testimonial-title{
	   position: relative;
	   margin-bottom: 10px;
	   h6{ padding-bottom: 0; margin: 2px auto 0;}
    }
	.content{ 
		margin-bottom: 25px;
		padding-bottom: 15px;
		border-bottom: 1px solid rgba(10, 29, 53, 0.1);
	}
	.testimonial-details{
		.content p{ font-size:16px; line-height:27px;}
		.content h4{ font-weight:500; @extend .font-l-subtitle; @extend .color-main; }
	}
	.star-rating{
		position: relative;
		&:before { @extend .color-main;  }
	}
	.item:hover{
		transform: scale(1.08) translateZ(0);
	}
}
.mo-testimonial.tpl3 .item{ opacity:.2; }
.mo-testimonial.tpl3 .owl-item.active .item{ opacity:1; }
.mo-testimonial.tpl3 .owl-stage-outer{ overflow: visible;}

.mo-testimonial.tpl3 .owl-item:nth-child(4n+1){ transform: rotate(5deg); }
.mo-testimonial.tpl3 .owl-item:nth-child(4n+3){ transform: rotate(-5deg); }

/* mo-testimonial-carousel.tpl4 */
.mo-testimonial.tpl4{
	.testimonial-content{
		position: relative;
		padding: 45px;
		@extend .radius25;
		&::before{
			content: "";
			position: absolute;
			width: 100%;
			height: 100%;
			opacity: 0.07;
			left: 0;
			top: 0;
			@extend .radius25;
			@extend .bg-color-main;
		}
		&::after {
			display: block;
			position: absolute;
			left: 50%;
			margin-left: -5px;
			width: 0;
			height: 0;
			border-style: solid;
			border-width: 10px 10px 0 10px;
			bottom: -10px;
			content: '';
			border-color: var(--color-primary) transparent transparent transparent;
			left: 70px;
			border-right-width: 40px;
			margin-left: calc(40px/-2);
			border-top-width: 20px;
			bottom: -20px;
			border-left-width: 0px;
			opacity: 0.07;
		}
	}
	.item{
		position: relative;
	    overflow: hidden;
		max-width: 800px;
		@include single-transition(all, .4s, ease-in-out);	
   }
   .star-rating { text-align: left; }
   .testimonial-avatar.top{ display:none;}
   .testimonial-title{
		position: relative;
		padding-top: 40px;
		text-align: left; 
		.testimonial-avatar{ margin-top: 0; }
    }
	.content {
		font-size: 16px;
		line-height: 27px;
		margin-top: 15px;
		text-align: left; 
		h4{ 
			font-size: 18px;
			line-height: 23px;
			font-weight: 500;
			margin-bottom: 15px;
			font-style: italic;
			@extend .color-main;
		}
	}
	.item:hover {
		-webkit-transform: translate(0, -3px);
        transform: translate(0, -3px);
	}
}
/* mo-testimonial-carousel.tpl5 */
.mo-testimonial.tpl5{
	.item{
		position: relative;
		margin: auto;
		padding: 70px 50px 20px;
		background: #fff;
		overflow: hidden;
		max-width: 800px;
		text-align: left;
		@extend .radius25;
		@extend .border;
		@include single-transition(all, .4s, ease-in-out);
	}
  	.testimonial-avatar{
		position: relative;
		z-index: 1;
		@include border-radius(50%);
	}
	.top.testimonial-avatar{ display:none; }
	.testimonial-details{
		position: relative;
		svg.quote path{ stroke: var(--color-primary);}
		.testimonial-title{ 
			margin-top:25px;
			margin-top: 25px;
			border-style: solid;
			border-width: 1px 0px 0px 0px;
			border-color: rgba(0,0,0,0.07);
			padding-top: 30px;
		}
		.content{
			font-size: 16px;
			line-height: 27px;
			position: relative;
			margin: 0;
			font-weight: 400;
			@extend .font-primary;
			h4{
				font-size: 18px;
				line-height: 23px;
				font-weight: 500;
				margin-bottom: 15px;
				font-style: italic;
			 }
		}
	}
	.item:hover{
		@extend .border-color-main;
	}
}

.mo-testimonial.tpl5 .testimonial-carousel[data-col_lg="1"] .owl-nav{
	max-width: 850px;
    margin: auto;
    left: 0;
    right: 0;
}
.mo-testimonial.tpl5 .testimonial-carousel[data-col_lg="1"]{
	overflow: hidden;
 }
.mo-testimonial.tpl5 .item{ opacity:.2; }
.mo-testimonial.tpl5 .owl-item.active .item{  opacity:1; }
.mo-testimonial.tpl5 .owl-stage-outer{ overflow: visible;}

.mo-testimonial.style-2 .item{ opacity:1; margin-top:15px; margin-bottom:15px;}

section[data-section-bgcolor="dark"]{ 
	.mo-testimonial.tpl1 .content{border-bottom:1px solid rgba(255,255,255,0.1);}
}
/* mo-testimonial-grid */
.mo-testimonial-grid {
    position: relative;
	overflow: hidden;
}
.btn-testimonial-grid {
	text-align: center;
	margin: auto;
	z-index: 5;
	position: relative;
	line-height: 47px;
}
.overlay-testimonial-grid{
	position: relative;
	&::after {
		position: absolute;
		bottom: -146px;
		left: -25%;
		width: 150%;
		bottom: 0;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0) 6.66%, rgba(255, 255, 255, 0.91) 48.38%, #FFF 85.73%);
		content: "";
		height: 450px;
		z-index: 1;
		pointer-events: none;
	}
	.btn-testimonial-grid{margin-top:-100px;}
}
.button-overlay-testimonial-grid{min-height:150px;}

section[data-section-bgcolor="dark"]{ 
	.overlay-testimonial-grid:after{background:linear-gradient(180deg, rgba(0, 0, 0, 0) 6.66%, rgba(0, 0, 0, 0.91) 48.38%, #000 85.73%);}
}
/* map-style1 */
.map-style1{
	position: absolute !important;
    height: 170px;
    z-index: 1;
    bottom: 0;
	&:before , &:after {
		content: " ";
		width: 100%;
		z-index: 3;
		display: block;
		position: absolute;
		-webkit-box-shadow: 0 15px 34px rgba(0,0,0,0.18);
		-moz-box-shadow: 0 15px 34px rgba(0,0,0,0.18);
		box-shadow: 0 15px 34px rgba(0,0,0,0.18);
	}
	&:before {
		top: 60px;
        left: -5%;
        height: 170px;
		@extend .bg-color-main;
	}
	&:after {
		background: $color-gray;
		height: 170px;
		bottom: 0;
		right: -5%;
		z-index: 2;
	}
}
.map-style1 .container {
    opacity: 0;
}

/* mo-ad-banner */
.mo-ad-banner{
    position: relative;
	overflow: hidden;
	margin-top: 15px;
    margin-bottom: 15px;
	@include single-transition(all, .6s, ease-in-out);
    figure img{ 
		opacity: 1 !important;
		min-width:100%;
		@include single-transition(all, .6s, ease-in-out);
	}
	.link-btn:hover:after{ background:#fff !important; }
	.overlay-effect {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 50%;
        opacity: 1;
        visibility: visible;
		overflow: hidden;
		background: -moz-linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, 0.9) 100%);
		background: -webkit-linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, 0.9) 100%);
		background: linear-gradient(to bottom, transparent 0, rgba(0, 0, 0, 0.9) 100%);
    	@include single-transition(all, .6s, ease-in-out);
	    .overlay-inner {
			position: absolute;
			bottom: 0;
			left: 0;
			right: 0;
	        opacity: 1;
			z-index: 2;
		    padding: 50px;
		    visibility: visible;
			text-align: center;
			h4.title{ 
				@extend .bold-weight; font-size:20px; line-height:29px; margin-bottom:5px; color:#fff;
				background-image: linear-gradient(to right, currentcolor 0%, currentcolor 100%);
				background-size: 0px 2px;
				display: inline;
				box-sizing: border-box;
				background-position: 0px calc(100% - 0.1em);
				transition: background-size 0.25s cubic-bezier(0.785, 0.135, 0.15, 0.86) 0s;
				padding: 3px 0px;
				background-repeat: no-repeat;
			}
			.content{ margin-top:10px; color:#fff; font-size:14px; line-height:26px;} 
			.sup-title{ color:#fff; font-weight: 500; font-style: normal; font-size: 10px; text-transform: uppercase; line-height: 14px; letter-spacing: 1px;  margin-bottom: 7px; }
		}
		&:hover h4.title{ background-size: 100% 2px; }
	}
	&:hover{
		transform: translateY(-4px);
		@extend .box-shadow;
	}
}
/* marquee-item */
.elementor-widget-mo-marquee{
	margin-left: -10px;
    margin-right: -10px;
	overflow: hidden;
	width: auto !important;
}
.mo-element-mo-marquee{
	.mo-marquee-container.tpl1{
		position: relative;
		width: calc(100% + 2px);
		left: -1px;
		transform: rotate(1.5deg);
		margin-top: 25px;
		@extend .bg-color-main;
		.mo-marquee{animation: marquee-reverse 50s linear infinite;}
	 }
	 .mo-marquee-container.double-tpl1{
		position: relative;
		width: calc(100% + 2px);
		left: -1px;
		margin-top: -50px;
		margin-bottom: 25px;
        transform: rotate(-1.5deg);
		@extend .bg-dark;
		svg path{@extend .fill-main; }
		.mo-marquee{animation: marquee 50s linear infinite;}
	 }
	 .mo-marquee-container.tpl1, .mo-marquee-container.double-tpl1{
		padding-top: 25px;
		padding-bottom: 25px;
		svg{
			position: relative;
			left: 24px;
			top: 3px;
			height: 30px;
			width: 30px;
			animation: push_animat 5s linear infinite;
		}
	}
	.mo-marquee{
		position: relative;
		width: 100%;
		//height: 100%;
		z-index: 1;
		display: flex;
		box-sizing: content-box;
		will-change: transform;
		transition-property: transform;
		animation: marquee 50s linear infinite;
		.marquee-item {
			display: flex;
			width: auto;
			flex-shrink: 0;
			height: 100%;
			position: relative;
		}
		.marquee-title{
			position: relative;
			margin:0;
			font-size: 16px;
			font-weight:bold; 
			white-space:nowrap;
			margin-left:50px;
			color:#fff;
		}
		&.tpl2{
			font-size: 12vw;
			line-height: 1.2;
			font-weight: 700;
			height: 270px;
			.marquee-title{
				@extend .color-main;
				font-size: inherit;
				line-height: inherit;
				font-weight: inherit;
				margin-bottom: 0;
				opacity: 0.8;
			}
		}
		&.tpl3{
			font-size: 110px;
			font-weight: 700;
			line-height: 130%;
			.marquee-title{
				font-family:'Inter'!important;
				font-weight: 700;
				font-size: inherit;
				line-height: inherit;
				white-space: nowrap;
				-webkit-text-stroke-color: #000;
				-webkit-text-stroke-width: 1px;
				color: transparent;
				transition: transform 1s cubic-bezier(.22,.61,.36,1);
				span{
					&::before{ 
						position:absolute;
						top:0;left:0;
						width:100%;
						overflow:hidden;
						white-space:nowrap;
						content:attr(data-text);
						transition:max-width .8s cubic-bezier(.22,.61,.36,1);
						-webkit-text-fill-color:var(--color-primary);
						-webkit-text-stroke:transparent;
						max-width:0; 
				    }
			    }
				&:hover{
					-webkit-text-stroke-color: var(--color-primary);
					span::before{ max-width: 100%; }
				}
			}
			svg{
				width: 80px;
				height: 80px;
				margin-left: 50px;
				margin-top: 42px;
				animation: spin_animat 8s ease-out infinite;
				-webkit-animation: spin_animat 8s ease-out infinite;
				path{ stroke:var(--color-primary); }
			}
		}
		&.tpl4{
			font-size: 30vw;
			line-height: 1.2;
			font-weight: 700;
			opacity: 0.1;
			.marquee-title{
				@extend .color-main;
				font-size: inherit;
				line-height: inherit;
				font-weight: inherit;
				margin-bottom: 0;
			}
		}
	}
}
.mo-marquee-container.tpl2{
	position: relative;
	svg{display:none;}
	&:before {
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		width: 100%;
		height: 100%;
		content: "";
		z-index: 2;
		background-color: transparent;
        background-image: linear-gradient(0deg, #fff 19%, #04011C00 100%);
	}
}

.spin_animat_svg svg, .spin_animat_svg img{
	animation: spin_animat 8s ease-out infinite;
	-webkit-animation: spin_animat 8s ease-out infinite;
}
.push_animat2_svg svg, .push_animat2_svg img{
	-webkit-animation: push_animat2 05s infinite linear;
	animation: push_animat2 05s infinite linear;
    animation-delay: 2s;
}
@keyframes spin_animat{
   0% { transform: rotate(0); }
   100% { transform: rotate(-360deg);}
}
@keyframes push_animat {
	0%  { opacity: .7;transform: scale(.7);}
	50% { opacity: 1; transform: scale(1); }
	100%{ opacity: .7;transform: scale(.7);}
}
@keyframes push_animat2{
    0%  { transform: scale(0.6); opacity: 0; }
	1%  { opacity: 1;}
	50% { transform: scale(1) rotate(45deg); }
	100%{ transform: scale(0.6); }
}
@keyframes marquee {
	0% { transform: translateX(0); }
	100% { transform: translateX(-100%); }
}
@keyframes marquee-reverse {
	0% { transform: translateX(-100%); }
	100% { transform: translateX(0); }
}

/* nori-instagram */
.nori-instagram-wrapper {
    display: inline-block;
    width: 100%;
    position: relative;
}
.title-insta-block {
    position: absolute;
    left: 50%;
    top: 50%;
    z-index: 3;
    background: rgba(255, 255, 255, 0.8);
    padding: 15px 50px;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -o-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    color: #000;
    font-size: 14px;
    line-height: 21px;
}
.nori-instagram-wrapper a {
    display: grid;
    width: 100%;
    position: relative;
    overflow: hidden;
}
.nori-instagram-wrapper a img {
	max-width: 100%;
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .5s ease;
}
.nori-instagram-wrapper a:hover img {
    -webkit-transform: scale3d(1.1,1.1,1);
    transform: scale3d(1.1,1.1,1);
    -webkit-transition: all .3s ease;
    -moz-transition: all .3s ease;
    -ms-transition: all .3s ease;
    -o-transition: all .3s ease;
    transition: all .5s ease;
}
.nori-instagram-wrapper a.instagram_item:hover {
    -webkit-transform: scale(1.099);
    -ms-transform: scale(1.099);
    transform: scale(1.099);
    box-shadow: 0 5px 30px rgba(0,0,0,0.05), 0 15px 35px rgba(0,0,0,0.1), 0 5px 15px rgba(0,0,0,0.05);
    z-index: 2;
}
.mo-maps-info-content {
    padding: 10px 0;
	h5 {
		font-size: 16px;
		line-height: 25px;
		font-weight: 500;
	}
}
/* pagination */
.mo-pagination-numeric{
    position: relative;
    display: inline-block;
    width: 100%;
    text-align: center;
	padding: 30px 0;
	> a ,  > span{ margin-bottom:30px !important }
}
.vl-pagination-buttons {
  display: flex;
  justify-content: space-between;
  position: relative;
  width: 100%;
}
.grid-masonry .vl-pagination-buttons {
  padding: 30px 17px;
}
 .grid-masonry .mo-pagination-numeric {
  padding: 0 15px;
}
.vl-pagination-buttons .prev-page, .vl-pagination-buttons .next-page {
  line-height: 1;
  display: inline-flex;
  align-items: center;
  font-weight: 500;
  max-width: 33.333%;
  width: 100%;
  @extend .color-main;
	i{
	  display: inline-flex;
	  font-size: 14px;
	  margin-top: 2px;
	}
	span { transition: transform 250ms ease; }
	&.inactive { color: #ccc; cursor: not-allowed; }
}
.vl-pagination-buttons .next-page {
  justify-content: flex-end;
}
.vl-pagination-buttons .next-page i {
  margin-left: 6px;
}
.vl-pagination-buttons .prev-page i {
  margin-right: 6px;
}
.vl-pagination-buttons .prev-page:not(.inactive):hover {
   i { animation: animateLeft 500ms ease forwards; }
   span { transform: translateX(15px); }
}
.vl-pagination-buttons .next-page:not(.inactive):hover {
   i { animation: animateRight 500ms ease forwards; }
   span { transform: translateX(-15px); }
}

@media (max-width: 575px) {
  .vl-pagination-buttons .prev-page, .vl-pagination-buttons .next-page {
    max-width: 50%;
  }
}
@-moz-keyframes animateLeft {
  49% {
    transform: translateX(-100%);
  }
  50% {
    opacity: 0;
    transform: translateX(100%);
  }
  51% {
    opacity: 1;
  }
}
@-webkit-keyframes animateLeft {
  49% {
    transform: translateX(-100%);
  }
  50% {
    opacity: 0;
    transform: translateX(100%);
  }
  51% {
    opacity: 1;
  }
}
@-o-keyframes animateLeft {
  49% {
    transform: translateX(-100%);
  }
  50% {
    opacity: 0;
    transform: translateX(100%);
  }
  51% {
    opacity: 1;
  }
}
@keyframes animateLeft {
  49% {
    transform: translateX(-100%);
  }
  50% {
    opacity: 0;
    transform: translateX(100%);
  }
  51% {
    opacity: 1;
  }
}
@-moz-keyframes animateRight {
  49% {
    transform: translateX(100%);
  }
  50% {
    opacity: 0;
    transform: translateX(-100%);
  }
  51% {
    opacity: 1;
  }
}
@-webkit-keyframes animateRight {
  49% {
    transform: translateX(100%);
  }
  50% {
    opacity: 0;
    transform: translateX(-100%);
  }
  51% {
    opacity: 1;
  }
}
@-o-keyframes animateRight {
  49% {
    transform: translateX(100%);
  }
  50% {
    opacity: 0;
    transform: translateX(-100%);
  }
  51% {
    opacity: 1;
  }
}
@keyframes animateRight {
  49% {
    transform: translateX(100%);
  }
  50% {
    opacity: 0;
    transform: translateX(-100%);
  }
  51% {
    opacity: 1;
  }
}
@keyframes animationFramesOne{
0%{transform:translate(0px,0px) rotate(0deg);}
20%{transform:translate(73px,-1px) rotate(36deg);}
40%{transform:translate(141px,72px) rotate(72deg);}
60%{transform:translate(83px,122px) rotate(108deg);}
80%{transform:translate(-40px,72px) rotate(144deg);}
100%{transform:translate(0px,0px) rotate(0deg);}
}
@-webkit-keyframes animationFramesOne {
0%{-webkit-transform:translate(0px,0px) rotate(0deg);}
20%{-webkit-transform:translate(73px,-1px) rotate(36deg);}
40%{-webkit-transform:translate(141px,72px) rotate(72deg);}
60%{-webkit-transform:translate(83px,122px) rotate(108deg);}
80%{-webkit-transform:translate(-40px,72px) rotate(144deg);}
100%{-webkit-transform:translate(0px,0px) rotate(0deg);}
}
@keyframes animationFramesTwo{
0%{transform:translate(0px,0px) rotate(0deg) scale(1);}
20%{transform:translate(73px,-1px) rotate(36deg) scale(0.9);}
40%{transform:translate(141px,72px) rotate(72deg) scale(1);}
60%{transform:translate(83px,122px) rotate(108deg) scale(1.2);}
80%{transform:translate(-40px,72px) rotate(144deg) scale(1.1);}
100%{transform:translate(0px,0px) rotate(0deg) scale(1);}
}
@-webkit-keyframes animationFramesTwo {
0%{-webkit-transform:translate(0px,0px) rotate(0deg) scale(1);}
20%{-webkit-transform:translate(73px,-1px) rotate(36deg) scale(0.9);}
40%{-webkit-transform:translate(141px,72px) rotate(72deg) scale(1);}
60%{-webkit-transform:translate(83px,122px) rotate(108deg) scale(1.2);}
80%{-webkit-transform:translate(-40px,72px) rotate(144deg) scale(1.1);}
100%{-webkit-transform:translate(0px,0px) rotate(0deg) scale(1);}
}
@keyframes animationFramesThree{
0%{transform:translate(165px,-179px);}
100%{transform:translate(-346px,617px);}
}
@-webkit-keyframes animationFramesThree {
0%{-webkit-transform:translate(165px,-179px);}
100%{-webkit-transform:translate(-346px,617px);}
}
@keyframes animationFramesFour{
0%{transform:translate(-300px,151px) rotate(0deg);}
100%{transform:translate(251px,-200px) rotate(180deg);}
}
@-webkit-keyframes animationFramesFour {
0%{-webkit-transform:translate(-300px,151px) rotate(0deg);}
100%{-webkit-transform:translate(251px,-200px) rotate(180deg);}
}
@keyframes animationFramesFive{
0%{transform:translate(61px,-99px) rotate(0deg);}
21%{transform:translate(4px,-190px) rotate(38deg);}
41%{transform:translate(-139px,-200px) rotate(74deg);}
60%{transform:translate(-263px,-164px) rotate(108deg);}
80%{transform:translate(-195px,-49px) rotate(144deg);}
100%{transform:translate(-1px,0px) rotate(180deg);}
}
@-webkit-keyframes animationFramesFive {
0%{-webkit-transform:translate(61px,-99px) rotate(0deg);}
21%{-webkit-transform:translate(4px,-190px) rotate(38deg);}
41%{-webkit-transform:translate(-139px,-200px) rotate(74deg);}
60%{-webkit-transform:translate(-263px,-164px) rotate(108deg);}
80%{-webkit-transform:translate(-195px,-49px) rotate(144deg);}
100%{-webkit-transform:translate(-1px,0px) rotate(180deg);}
}@keyframes animationFramesOne{
0%{transform:translate(0px,0px) rotate(0deg);}
20%{transform:translate(73px,-1px) rotate(36deg);}
40%{transform:translate(141px,72px) rotate(72deg);}
60%{transform:translate(83px,122px) rotate(108deg);}
80%{transform:translate(-40px,72px) rotate(144deg);}
100%{transform:translate(0px,0px) rotate(0deg);}
}
@-webkit-keyframes animationFramesOne {
0%{-webkit-transform:translate(0px,0px) rotate(0deg);}
20%{-webkit-transform:translate(73px,-1px) rotate(36deg);}
40%{-webkit-transform:translate(141px,72px) rotate(72deg);}
60%{-webkit-transform:translate(83px,122px) rotate(108deg);}
80%{-webkit-transform:translate(-40px,72px) rotate(144deg);}
100%{-webkit-transform:translate(0px,0px) rotate(0deg);}
}
@keyframes animationFramesTwo{
0%{transform:translate(0px,0px) rotate(0deg) scale(1);}
20%{transform:translate(73px,-1px) rotate(36deg) scale(0.9);}
40%{transform:translate(141px,72px) rotate(72deg) scale(1);}
60%{transform:translate(83px,122px) rotate(108deg) scale(1.2);}
80%{transform:translate(-40px,72px) rotate(144deg) scale(1.1);}
100%{transform:translate(0px,0px) rotate(0deg) scale(1);}
}
@-webkit-keyframes animationFramesTwo {
0%{-webkit-transform:translate(0px,0px) rotate(0deg) scale(1);}
20%{-webkit-transform:translate(73px,-1px) rotate(36deg) scale(0.9);}
40%{-webkit-transform:translate(141px,72px) rotate(72deg) scale(1);}
60%{-webkit-transform:translate(83px,122px) rotate(108deg) scale(1.2);}
80%{-webkit-transform:translate(-40px,72px) rotate(144deg) scale(1.1);}
100%{-webkit-transform:translate(0px,0px) rotate(0deg) scale(1);}
}
@keyframes animationFramesThree{
0%{transform:translate(165px,-179px);}
100%{transform:translate(-346px,617px);}
}
@-webkit-keyframes animationFramesThree {
0%{-webkit-transform:translate(165px,-179px);}
100%{-webkit-transform:translate(-346px,617px);}
}
@keyframes animationFramesFour{
0%{transform:translate(-300px,151px) rotate(0deg);}
100%{transform:translate(251px,-200px) rotate(180deg);}
}
@-webkit-keyframes animationFramesFour {
0%{-webkit-transform:translate(-300px,151px) rotate(0deg);}
100%{-webkit-transform:translate(251px,-200px) rotate(180deg);}
}
@keyframes animationFramesFive{
0%{transform:translate(61px,-99px) rotate(0deg);}
21%{transform:translate(4px,-190px) rotate(38deg);}
41%{transform:translate(-139px,-200px) rotate(74deg);}
60%{transform:translate(-263px,-164px) rotate(108deg);}
80%{transform:translate(-195px,-49px) rotate(144deg);}
100%{transform:translate(-1px,0px) rotate(180deg);}
}
@-webkit-keyframes animationFramesFive {
0%{-webkit-transform:translate(61px,-99px) rotate(0deg);}
21%{-webkit-transform:translate(4px,-190px) rotate(38deg);}
41%{-webkit-transform:translate(-139px,-200px) rotate(74deg);}
60%{-webkit-transform:translate(-263px,-164px) rotate(108deg);}
80%{-webkit-transform:translate(-195px,-49px) rotate(144deg);}
100%{-webkit-transform:translate(-1px,0px) rotate(180deg);}
}
/*================================================
OWL Carousel
================================================*/
@media (max-width: 991.98px) {
	.tparrows {
	  display: none !important;
	}
  }
  
  .owl-carousel, .flex-control-nav, .ctf-tweets {
	position: relative;
	max-height: 300px;
	overflow: hidden;
  }
  
  .owl-carousel:after, .flex-control-nav:after, .ctf-tweets:after {
	content: "";
	background: url("../images/preloader.gif") no-repeat center center #fff;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	height: 100%;
  }
  
  .owl-carousel.owl-loaded, .flex-control-nav.owl-loaded, .ctf-tweets.owl-loaded {
	max-height: none;
	overflow: visible;
  }
  
  .owl-carousel.owl-loaded:after, .flex-control-nav.owl-loaded:after, .ctf-tweets.owl-loaded:after {
	display: none !important;
  }
  
  .owl-carousel .owl-nav, .flex-control-nav .owl-nav, .ctf-tweets .owl-nav {
	opacity: 0;
	filter: alpha(opacity=0);
  }
  
  .owl-carousel .owl-nav > button, .flex-control-nav .owl-nav > div, .ctf-tweets .owl-nav > div {
	position: absolute;
	top: 50%;
	margin-top: -25px;
	z-index: 99;
	line-height: 45px;
	text-align: center;
	width: 50px;
	height: 50px;
	background: #fff;
	@extend .border;
	@extend .radius50;
	@extend .color-dark;
	transition: .35s;
  }
  
  .owl-carousel .owl-nav > button span, .flex-control-nav .owl-nav > div span, .ctf-tweets .owl-nav > div span {
	position: relative;
	z-index: 11;
  }
  
  .owl-carousel .owl-nav > button i, .flex-control-nav .owl-nav > div i, .ctf-tweets .owl-nav > div i {
	margin: 0;
	font-size: 16px;
  }
  
  .owl-carousel .owl-nav > button.disabled, .flex-control-nav .owl-nav > div.disabled, .ctf-tweets .owl-nav > div.disabled {
	opacity: 0.3;
	filter: alpha(opacity=30);
  }
  
  .owl-carousel .owl-nav > button.owl-prev, .flex-control-nav .owl-nav > div.owl-prev, .ctf-tweets .owl-nav > div.owl-prev {
	left: -20px;
  }
  
  .owl-carousel .owl-nav > button.owl-next, .flex-control-nav .owl-nav > div.owl-next, .ctf-tweets .owl-nav > div.owl-next {
	right: -20px;
  }
  
  .owl-carousel .owl-nav > button.owl-next:after, .flex-control-nav .owl-nav > div.owl-next:after, .ctf-tweets .owl-nav > div.owl-next:after {
	right: unset;
	left: 0;
  }
  
  .owl-carousel .owl-nav > button:hover, .owl-carousel .owl-nav > div:focus, .flex-control-nav .owl-nav > div:hover, .flex-control-nav .owl-nav > div:focus, .ctf-tweets .owl-nav > div:hover, .ctf-tweets .owl-nav > div:focus {
	opacity: 1;
	filter: alpha(opacity=100);
	cursor: pointer;
	color: #fff;
	svg{ fill:#fff;}
	@extend .bg-color-main;
	@extend .border-color-main;
  }
  
  .owl-carousel .owl-nav > button:hover:after, .owl-carousel .owl-nav > div:focus:after, .flex-control-nav .owl-nav > div:hover:after, .flex-control-nav .owl-nav > div:focus:after, .ctf-tweets .owl-nav > div:hover:after, .ctf-tweets .owl-nav > div:focus:after {
	width: 100%;
	height: 100%;
  }
  
  .owl-carousel .owl-dots, .flex-control-nav .owl-dots, .ctf-tweets .owl-dots {
	margin-top: 15px;
	width: 100%;
	text-align: center;
	line-height: 1;
  }
  
  .owl-carousel .owl-dots .owl-dot, .flex-control-nav .owl-dots .owl-dot, .ctf-tweets .owl-dots .owl-dot {
	display: inline-block;
	margin: 5px;
	position: relative;
	border: none;
	padding: 0;
	width: 8px;
	height: 8px;
	background: #B2B5BC;
	border-radius: 50%;
  }
  
  .owl-carousel .owl-dots .owl-dot.active, .flex-control-nav .owl-dots .owl-dot.active, .ctf-tweets .owl-dots .owl-dot.active {
	-webkit-transform: scale(1.5, 1.5);
    -ms-transform: scale(1.5, 1.5);
    transform: scale(1.5, 1.5);
	 @extend .bg-color-main;
  }
  
  .owl-carousel .owl-dots .owl-dot:hover, .flex-control-nav .owl-dots .owl-dot:hover, .ctf-tweets .owl-dots .owl-dot:hover {
	cursor: pointer;
  }
  
  .owl-carousel:hover .owl-nav, .flex-control-nav:hover .owl-nav, .ctf-tweets:hover .owl-nav {
	opacity: 1;
	filter: alpha(opacity=100);
  }
  
  .owl-carousel:hover .owl-nav > div.disabled, .flex-control-nav:hover .owl-nav > div.disabled, .ctf-tweets:hover .owl-nav > div.disabled {
	opacity: 0.6;
	filter: alpha(opacity=60);
	pointer: disabled;
	color: #1b1f2e;
  }
  
  .owl-carousel:hover .owl-nav > div.disabled:hover, .flex-control-nav:hover .owl-nav > div.disabled:hover, .ctf-tweets:hover .owl-nav > div.disabled:hover {
	cursor: no-drop;
  }
  
  .owl-carousel .owl-item img {
	width: 100%;
    height: 100% !important;
    object-fit: cover;
	display: inline-block;
	transform-style: unset !important;
	-webkit-transform-style: unset !important;
	-o-transform-style: unset !important;
	-ms-transform-style: unset !important;
  }
  .owl-carousel .owl-item img.emoji{ height:auto !important;}
  
  .owl-carousel {
	margin: 0 -15px;
	width: auto !important;
  }
  
  .owl-carousel .owl-item {
	padding-left: 15px;
	padding-right: 15px;
  }
  
  .owl-carousel.dot-left .owl-dots {
	position: absolute;
	width: 50px;
	left: -50px;
	top: 50%;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
  }
  
  .owl-carousel.dot-left .owl-dots .owl-dot {
	display: block;
	margin-bottom: 10px;
  }
  
  .owl-carousel.dot-right .owl-dots {
	position: absolute;
	width: 50px;
	right: -50px;
	top: 50%;
	-webkit-transform: translate(0, -50%);
	transform: translate(0, -50%);
  }
  
  .owl-carousel.dot-right .owl-dots .owl-dot {
	display: block;
	margin-bottom: 10px;
  }
  
  .owl-carousel.dot-bottom-left .owl-dots {
	margin-top: 20px;
	text-align: left;
  }
  
  .owl-carousel.dot-bottom-right .owl-dots {
	margin-top: 20px;
	text-align: right;
  }
  
  .owl-carousel.dot-bottom-center .owl-dots {
	margin-top: 20px;
	float: none;
	text-align: center;
  }
  
  .small-gutter .owl-carousel {
	margin: 0 -1px;
	width: auto !important;
  }
  
  .small-gutter .owl-carousel .owl-item {
	padding-left: 1px;
	padding-right: 1px;
  }
  
  .init-carousel-owl-theme.owl-carousel .owl-nav > div.owl-prev, .init-carousel-owl-theme .flex-control-nav .owl-nav > div.owl-prev {
	left: 0;
  }
  
  .init-carousel-owl-theme.owl-carousel .owl-nav > div.owl-next, .init-carousel-owl-theme .flex-control-nav .owl-nav > div.owl-next {
	right: 0;
  }
  /* 
 *  Owl Carousel - Animate Plugin
 */
.owl-carousel .animated {
	-webkit-animation-duration: 1000ms;
	animation-duration: 1000ms;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both; }
  .owl-carousel .owl-animated-in {
	z-index: 0; }
  .owl-carousel .owl-animated-out {
	z-index: 1; }
  .owl-carousel .fadeOut {
	-webkit-animation-name: fadeOut;
	animation-name: fadeOut; }
  
  @-webkit-keyframes fadeOut {
	0% {
	  opacity: 1; }
  
	100% {
	  opacity: 0; } }
  
  @keyframes fadeOut {
	0% {
	  opacity: 1; }
  
	100% {
	  opacity: 0; } }
  
  /* 
   * 	Owl Carousel - Auto Height Plugin
   */
  .owl-height {
	-webkit-transition: height 500ms ease-in-out;
	-moz-transition: height 500ms ease-in-out;
	-ms-transition: height 500ms ease-in-out;
	-o-transition: height 500ms ease-in-out;
	transition: height 500ms ease-in-out; }
  
  /* 
   *  Core Owl Carousel CSS File
   */
  .owl-carousel, .flex-control-nav, .ctf-tweets{
	display: none;
	width: 100%;
	-webkit-tap-mo-highlight-color: transparent;
	/* position relative and z-index fix webkit rendering fonts issue */
	position: relative;
	z-index: 1; }
	.owl-carousel .owl-stage, .flex-control-nav .owl-stage, .ctf-tweets .owl-stage{
	  position: relative;
	  -ms-touch-action: pan-Y; }
	.owl-carousel .owl-stage:after,
	.ctf-tweets .owl-stage:after {
	  content: ".";
	  display: block;
	  clear: both;
	  visibility: hidden;
	  line-height: 0;
	  height: 0; }
	.owl-carousel .owl-stage-outer, .flex-control-nav .owl-stage-outer, .ctf-tweets .owl-stage-outer{
	  position: relative;
	  overflow: hidden;
	  /* fix for flashing background */
	  -webkit-transform: translate3d(0px, 0px, 0px); }
	.owl-carousel .owl-item, .flex-control-nav .owl-item, .ctf-tweets .owl-item{
	  position: relative;
	  min-height: 1px;
	  float: left;
	  -webkit-backface-visibility: hidden;
	  -webkit-tap-mo-highlight-color: transparent;
	  -webkit-touch-callout: none; }
	.owl-carousel .owl-item img,
	.ctf-tweets .owl-item img {
	  display: block;
	  width: 100%;
	  -webkit-transform-style: preserve-3d; }
	.owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled,
	.ctf-tweets .owl-nav.disabled, .ctf-tweets .owl-dots.disabled {
	  display: none; }
	.owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot 
	.flex-control-nav .owl-nav .owl-prev, .flex-control-nav .owl-nav .owl-next, .flex-control-nav .owl-dot,
	.ctf-tweets .owl-nav .owl-prev, .ctf-tweets .owl-nav .owl-next, .ctf-tweets .owl-dot
	 {
	  cursor: pointer;
	  cursor: hand;
	  -webkit-user-select: none;
	  -khtml-user-select: none;
	  -moz-user-select: none;
	  -ms-user-select: none;
	  user-select: none; }
	.owl-carousel.owl-loaded, .flex-control-nav.owl-loaded, .ctf-tweets.owl-loaded {
	  display: block; }
	.owl-carousel.owl-loading, .flex-control-nav.owl-loading, .ctf-tweets.owl-loading {
	  opacity: 0;
	  display: block; }
	.owl-carousel.owl-hidden, .flex-control-nav.owl-hidden, .ctf-tweets.owl-hidden {
	  opacity: 0; }
	.owl-carousel.owl-refresh .owl-item, .ctf-tweets.owl-refresh .owl-item{
	  display: none; }
	.owl-carousel.owl-drag .owl-item, .ctf-tweets.owl-drag .owl-item {
	  -webkit-user-select: none;
	  -moz-user-select: none;
	  -ms-user-select: none;
	  user-select: none; }
	.owl-carousel.owl-grab, .ctf-tweets.owl-grab {
	  cursor: move;
	  cursor: -webkit-grab;
	  cursor: -o-grab;
	  cursor: -ms-grab;
	  cursor: grab; }
	.owl-carousel.owl-rtl, .ctf-tweets.owl-rtl {
	  direction: rtl; }
	.owl-carousel.owl-rtl .owl-item, .ctf-tweets.owl-rtl .owl-item {
	  float: right; }
  
  /* No Js */
  .no-js .owl-carousel, .no-js .ctf-tweets {
	display: block; }
  
  /* 
   * 	Owl Carousel - Lazy Load Plugin
   */
  .owl-carousel .owl-item .owl-lazy, .ctf-tweets .owl-item .owl-lazy {
	opacity: 0;
	-webkit-transition: opacity 400ms ease;
	-moz-transition: opacity 400ms ease;
	-ms-transition: opacity 400ms ease;
	-o-transition: opacity 400ms ease;
	transition: opacity 400ms ease; }
  .owl-carousel .owl-item img, .ctf-tweets .owl-item img {
	transform-style: preserve-3d; }
	.brand-item .brand-item-content:nth-child(2){margin-top:15px;}
  /* 
   * 	Owl Carousel - Video Plugin
   */
  .owl-carousel .owl-video-wrapper, .ctf-tweets .owl-video-wrapper {
	position: relative;
	height: 100%;
	background: #000; }
  .owl-carousel .owl-video-play-icon, .ctf-tweets .owl-video-play-icon {
	position: absolute;
	height: 80px;
	width: 80px;
	left: 50%;
	top: 50%;
	margin-left: -40px;
	margin-top: -40px;
	background: url("owl.video.play.png") no-repeat;
	cursor: pointer;
	z-index: 1;
	-webkit-backface-visibility: hidden;
	-webkit-transition: scale 100ms ease;
	-moz-transition: scale 100ms ease;
	-ms-transition: scale 100ms ease;
	-o-transition: scale 100ms ease;
	transition: scale 100ms ease; }
  .owl-carousel .owl-video-play-icon:hover, .ctf-tweets .owl-video-play-icon:hover {
	-webkit-transition: scale(1.3, 1.3);
	-moz-transition: scale(1.3, 1.3);
	-ms-transition: scale(1.3, 1.3);
	-o-transition: scale(1.3, 1.3);
	transition: scale(1.3, 1.3); }
  .owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon,
  .ctf-tweets .owl-video-playing .owl-video-tn, .ctf-tweets .owl-video-playing .owl-video-play-icon {
	display: none; }
  .owl-carousel .owl-video-tn ,
  .ctf-tweets .owl-video-tn {
	opacity: 0;
	height: 100%;
	background-position: center center;
	background-repeat: no-repeat;
	-webkit-background-size: contain;
	-moz-background-size: contain;
	-o-background-size: contain;
	background-size: contain;
	-webkit-transition: opacity 400ms ease;
	-moz-transition: opacity 400ms ease;
	-ms-transition: opacity 400ms ease;
	-o-transition: opacity 400ms ease;
	transition: opacity 400ms ease; }
  .owl-carousel .owl-video-frame,
  .ctf-tweets .owl-video-frame {
	position: relative;
	z-index: 1;
	height: 100%;
	width: 100%; }




/* mo-brand */
.item.brand-item img.brand-img-dark, .brand-item img.brand-img-back-dark{display: none;}
.brand-item.style1{
	.brand-item-content{
		height: 150px;
		padding-left:5px;
		padding-right: 5px;
		display:flex;align-items:center;justify-content:center;flex-shrink:0;
		> span{
			margin: 5px;
		}
	   .brand-img{
		   margin: auto;
		   -webkit-transition: all .4s ease-in-out;
		   -moz-transition: all .4s ease-in-out;
		   -o-transition: all .4s ease-in-out;
		   transition: all .4s ease-in-out;
		}
	}
}
.brand-item.style2{
	.brand-item-content{
		overflow: hidden;
		position: relative;
		padding-left:5px;
		padding-right: 5px;
		display:flex;align-items:center;justify-content:center;flex-shrink:0;
	}
	.brand-img{
		transform: translateY(0%);
	}
	.brand-img-back{
		position: absolute;
		z-index: 1;
		top: 0;
		left: 0;
		right: 0;
		transform: translateY(-100%);
	}
	.brand-img, .brand-img-back{
		width: auto;
		margin: auto;
		-webkit-transition: -webkit-transform .4s ease;
		transition: -webkit-transform .4s ease;
		-o-transition: transform .4s ease;
		transition: transform .4s ease;
		transition: transform .4s ease,-webkit-transform .4s ease;
	}
	&:hover{
		.brand-img{
			transform: translateY(100%);
		}
		.brand-img-back{
			visibility: visible;
			transform: translateY(0%);
		}
	}
}
.mo-brand-carousel.style3{
	.owl-item{
		height: 150px;
		padding-left:5px;
		padding-right: 5px;
		display:flex;align-items:center;justify-content:center;flex-shrink:0;
		.item{
			border-radius: 20px;
			border: 1px solid rgba(153, 153, 153, 0.2666666667);
			margin: 5px;
			padding: 30px;
			width:288px;
			text-align: center;
		    height: 150px;
			display:flex;
			align-items:center;
			margin: auto;
		}
	}
	.brand-item-content .brand-img{
		margin: auto;
		max-width: 100%;
		max-height:100%;
		width: auto;
		height: auto !important;
		-webkit-transition: all .4s ease-in-out;
		-moz-transition: all .4s ease-in-out;
		-o-transition: all .4s ease-in-out;
		transition: all .4s ease-in-out;
	}
}


/* mo-heading-fancy */	
.mo-heading-fancy{
	h3{margin-bottom:0; @extend .bold-weight;}
	.mo-highlight {
		background-color: transparent;
		display: inline-block;
		position: relative;
		color: inherit;
		padding: 0;
	}
	.mo-highlight-txt { 
		position: relative;
		z-index: 1;
	}
	.mo-highlight, .mo-highlight-txt {
	    background: inherit;
	}
	a:hover { color: inherit;}
	svg {
		color: inherit;
		position: absolute;
		top: auto;
		width: 106%;
		margin-left: -3%;
		height: auto;
		bottom: 0;
		z-index: -1;
		@extend .fill-main;
		@extend .stroke-color-main;
	}
	.mo-highlight-classic, .mo-gradient-heading .split-unit {
		position: relative;
		display: inline-block;
	}
    .mo-gradient-heading, .mo-gradient-heading .split-unit , .mo-gradient-heading .mo-highlight-txt{
		background-color: transparent;
		-webkit-background-clip: text!important;
		background-clip: text!important;
		-webkit-text-fill-color: transparent!important;
	}
	svg.mo-highlight-style1{
		path {
			stroke-width: 40;
			stroke-dasharray: 1500;
			animation-delay: 3s;
		}
	}
	svg.mo-highlight-style2{ 
		width: calc(100% + 30px); 
		bottom:-19px;
	}
	svg.mo-highlight-pen{
		width: 30px;
		height: 30px;
		position: absolute;
		top: calc(100% - 30px);
		right: calc(100% - 30px);
		opacity: 0;
	}
	svg.mo-highlight-style3{ 
		bottom: -10px;
		width: 100%;
		path {
			stroke-width: 2.7px;
			@extend .stroke-color-main;
			animation: highlight-dash .8s linear both;
		}
	}
	svg.mo-highlight-style5{ 
		height: 50px;
		path { stroke-width:20px; fill:none !important;}
	}
}
.mo-animations-done, .mo-unit-animation-done {
	.mo-highlight-pen {
		opacity: 1;
		animation: penAnimation .85s cubic-bezier(.22,.61,.36,1) forwards;
	}
}
@keyframes penAnimation {
	0% {right: calc(100% - 15px); transform: translateY(-7px) rotateZ(-45deg);}
	25% {transform: translateY(-12px) rotateZ(-15deg);}
	100% { transform: translateY(0) rotateZ(0);right: -25px;}
}
// animation highlight
.split-text-applied{
	.mo-highlight-txt { 
		svg {opacity: 0;}
		svg.mo-highlight-style2 > path, svg.mo-highlight-style4 > path{
		    -webkit-clip-path: polygon(0 0,0 0,0 100%,0 100%);
			clip-path: polygon(0 0,0 0,0 100%,0 100%);
			transition: clip-path .85s cubic-bezier(.22,.61,.36,1);
			transition-delay: inherit;
		}
	}
}
.mo-animations-done, .mo-unit-animation-done  {
	.mo-highlight-txt{
		svg {opacity: 1;}
		svg.mo-highlight-style1, svg.mo-highlight-style5 { 
			> path { animation: highlight-line 2s cubic-bezier(.29,1.11,.74,1.04) forwards;}
		}
		svg.mo-highlight-style2, svg.mo-highlight-style4 {
			> path{ -webkit-clip-path: polygon(0 0,100%0,100% 100%,0 100%); clip-path: polygon(0 0,100%0,100% 100%,0 100%); }
		}
	}
}
@keyframes highlight-line{0%{stroke-dasharray:0 1500}to{stroke-dasharray:1500 1500}}
@keyframes highlight-dash {
	0%{stroke-dashoffset: 3200;stroke-dasharray: 0;}
	to{stroke-dashoffset: 0px; stroke-dasharray: 3000;}
}
// animation split
.split-inner,.split-unit{text-decoration:inherit}.split-inner{display:block}
.mo-split-chars .mo-words>.split-inner{display:inline-flex;flex-wrap:wrap}
.mo-split-chars .mo-words>.split-inner .split-unit{grid-row:1}
@media screen and (min-width:480px){.mo-lines{white-space:nowrap}}
.mo-words{display:inline-flex!important}
.txt-rotate-keyword,.txt-rotate-keywords{transform:translate3d(0,0,0);-webkit-backface-visibility:hidden;backface-visibility:hidden}
.txt-rotate-keywords{display:inline-block;position:relative;white-space:nowrap;transition:width .8s cubic-bezier(.86,0,.07,1)}
.txt-rotate-keywords span{background:inherit}.txt-rotate-keyword{position:absolute;top:auto;left:0;opacity:0}
.txt-rotate-keyword,.txt-rotate-keyword .mo-words>.split-inner,.txt-rotate-keyword span{display:inline-block}
.txt-rotate-keyword:first-child{position:relative;top:auto;left:auto;opacity:1}
.text-rotator-activated .txt-rotate-keyword{position:absolute;top:0;left:0;right:0;opacity:0}
.text-rotator-activated .txt-rotate-keyword.active{position:relative;opacity:1}
@media screen and (max-width:479px){.txt-rotate-keywords{white-space:normal;min-width:100%}
.txt-rotate-keywords .mo-keyword-slide-out:not(.active):not(.is-next){white-space:nowrap}}
.txt-rotator-basic .txt-rotate-keyword{display:none;position:relative;top:auto;left:auto;opacity:1}
.txt-rotator-basic .txt-rotate-keyword.active{display:inline-block}
.txt-rotate-keyword.mo-keyword-slide-out{animation:moKeywordSlideOut .8s cubic-bezier(.86,0,.07,1) both}
.txt-rotate-keyword.mo-keyword-slide-in{animation:moKeywordSlideIn .8s cubic-bezier(.86,0,.07,1) both}[data-typewriter] kbd{padding:0;border-radius:0;background:0 0;box-shadow:none;font:inherit;color:inherit}[data-typewriter] del,[data-typewriter] ins{text-decoration:none}
@keyframes moKeywordSlideIn{0%{transform:translateY(65%) rotateX(-95deg);opacity:0}to{transform:translateY(0) rotateX(0);opacity:1}}
@keyframes moKeywordSlideOut{0%{transform:translateY(0) rotateX(0);opacity:1}to{transform:translateY(-65%) rotateX(95deg);opacity:0}}@keyframes slideshowFigureOut{0%{opacity:1}65%{opacity:0}to{opacity:0;transform:translate3d(1.5%,0,0)}}
/* mo-img-fancy */	
.mo-img-fancy{
	transition:transform .65s cubic-bezier(.05,.7,.2,1),opacity .3s;border-radius:inherit; display:inline-block;
	.mo-img-fancy-container {
		display: inline-flex;
		figure{
			display:inline-block;margin:0!important;border-radius:inherit;
			img{width:100%;border-radius:inherit}
		}
		figure:empty{display:none}
		.mo-img-fancy-content{transition:opacity .65s,visibility .65s,transform 1s;transition-timing-function:cubic-bezier(.19,1,.22,1);transition-delay:.2s}
		.mo-img-fancy-content-fixed{
			writing-mode:vertical-rl;bottom:0;min-width:1em;max-height:50%;color:#000;
			.mo-img-fancy-content-inner{transform:rotate(180deg)}
			p{flex-grow:1}
		}
	}
	.mo-img-fancy-container.align-items-center{display:block;}
}
@media screen and (max-width:991px){
	.mo-img-content{order:2;margin-top:1em}
	.mo-img-content:not(.mo-img-fancy-content-fixed-in).mo-img-fancy-content-fixed{writing-mode:inherit;position:relative;top:auto;bottom:auto;left:auto;right:auto;transform:none!important}
	.mo-img-content:not(.mo-img-fancy-content-fixed-in).mo-img-fancy-content-fixed .mo-img-content-inner{transform:none}
}
.align-items-start {align-items: flex-start !important; }
.align-items-end { align-items: flex-end !important;}
.align-items-center { align-items: center !important; }
.transform-style-3d { transform-style: preserve-3d; }

[data-reveal] .mo-img-content{opacity:0;visibility:hidden}
.element-uncovered .mo-img-content{opacity:1;visibility:visible}
[data-reveal]:not(.element-uncovered) .mo-img-fancy-content-fixed-left .mo-img-content-inner{transform:rotate(180deg) translateY(-4em) translateX(1em)}
.mo-img-fancy-content-fixed-left{left:0;margin-block-start:.75em}
[data-reveal]:not(.element-uncovered) .mo-img-fancy-content-fixed-right .mo-img-content-inner{transform:rotate(180deg) translateY(-4em) translateX(-1em)}
.mo-img-fancy-content-fixed-right{order:1;right:0;margin-block-end:.75em}
.mo-img-fancy-content-fixed-in{justify-content:flex-start;margin:0;min-height:45%;max-height:100%;position:absolute;z-index:3;background-color:var(--color-primary)}
.mo-img-fancy-content-fixed-in p{padding:1.25em .65em}
[data-reveal]:not(.element-uncovered) .mo-img-fancy-content-fixed-in.mo-img-fancy-content-fixed-left .mo-img-content-inner{transform:translateX(-1em)}
[data-reveal]:not(.element-uncovered) .mo-img-fancy-content-fixed-in.mo-img-fancy-content-fixed-right .mo-img-content-inner{transform:translateX(1em)}

.mo-img-fancy[data-animate-shadow][data-shadow-style="1"].is-in-view figure,.mo-img-fancy[data-shadow-style="1"] figure{box-shadow:0 25px 30px rgba(0,0,0,.07)}.mo-img-fancy[data-animate-shadow][data-shadow-style="2"].is-in-view figure,.mo-img-fancy[data-shadow-style="2"] figure{box-shadow:0 30px 50px rgba(0,0,0,.15)}
.mo-img-fancy[data-animate-shadow][data-shadow-style="3"].is-in-view figure,.mo-img-fancy[data-shadow-style="3"] figure{box-shadow:0 30px 70px rgba(0,0,0,.15)}.mo-img-fancy[data-animate-shadow][data-shadow-style="4"].is-in-view figure,.mo-img-fancy[data-shadow-style="4"] figure{box-shadow:0 30px 100px rgba(0,0,0,.17)}
.mo-img-fancy[data-animate-shadow] figure{box-shadow:0 0 0 rgba(0,0,0,.3);transition:box-shadow .5s cubic-bezier(.7,0,.3,1)}
.mo-img-fancy[data-animate-shadow] img{opacity:.00000001;transition:opacity .65s cubic-bezier(.5,1,.5,1)}
.mo-img-fancy[data-animate-shadow].is-in-view img{opacity:1;transition-delay:.35s}
.mo-img-fancy[data-animate-shadow].is-in-view img.ld-lazyload{opacity:.00000001}
.mo-overlay{position:absolute;top:0;left:0;width:100%;height:100%}

.mo-img-fancy[data-float]{--float-animation-ease:ease;--float-animate-from:0%;--float-animate-to:3%;--float-delay:0s;animation:moFloatImg 1s var(--float-animation-ease) infinite alternate;animation-delay:var(--float-delay)}
@keyframes moFloatImg{
	0%{transform:translateY(var(--float-animate-from, 0%))}
	to{transform:translateY(var(--float-animate-to, 7%))}
}

/* mo-instagram */
.mo-instagram{
	&.layout1{
		.col-grid {
			padding: 0 10px;
			.instagram-item{
				border-radius: 10px;
				overflow: hidden;
			}
		}
	}
	&.layout2{
		.col-grid{padding: 0 !important;}
	}
	&.layout3{
		.instagram-item{
			border-radius: 20px;
			width: 245px;
			height: 245px;
			max-width: 100%;
		}
	}
	.instagram-item img {
		min-height: 100%;
		min-width: 100%;
		width: 100%;
		height: 100% !important;
		object-fit: cover;
		display: block;
	}
	&.instagram-1{
		.instagram-item{
			position: relative;
			overflow: hidden;
			&:before {
				position: absolute;
				content: "";
				height: calc(100% + 4px);
				width: calc(100% + 4px);
				right: -2px;
				bottom: -2px;
				z-index: 1;
				background-color: rgba(255, 255, 255, 0);
				-webkit-backdrop-filter: blur(14px) brightness(92%);
				backdrop-filter: blur(14px) brightness(92%);
				transition: opacity 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
				opacity: 0;
			}
			img{ 
				transition: all 1s cubic-bezier(0.19, 1, 0.22, 1);
			}
			&:hover {
				&:before { opacity: 1;}
				img { transform: scale(1.15); }
		   }
		}
		.icon-instagram {
			position: absolute;
			z-index: 2;
			top: 50%;
			left: 50%;
			-webkit-transform: translate(-50%, -50%);
			-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
			margin: 0;
			padding: 0;
			-webkit-border-radius: 50%;
			-ms-border-radius: 50%;
			border-radius: 50%;
			background-color: #FFFFFF;
			min-width: 102px;
			height: 102px;
			line-height: 102px;
			i{
				font-size: 32px;
				display: block;
				text-align: center;
			    vertical-align: middle;
				line-height: 102px;
			}
        }
	}
	&.instagram-2{
		.icon-instagram{
			@extend .font-subtitle;
			text-align: center;
			display: block;
			margin-bottom: 30px;
		}
		.instagram-item{
			position: relative;
			overflow: hidden;
			height: 250px;
			&:before {
				content: ' ';
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				bottom: 0;
				opacity: 0;
				pointer-events: none;
				-webkit-transition: opacity 0.3s ease;
				-ms-transition: opacity 0.3s ease;
				transition: opacity 0.3s ease;
				background-color: rgba(0, 0, 0, 0.2);
			}
			img{
				transition:transform 1s ease, opacity .5s ease;
			}
			.middel.icon-instagram{
				text-align: center;
				display: block;
				font-size: 22px;
				margin-bottom: 30px;
				i{ margin-right: 10px;}
			}
			.icon-instagram {
				position: absolute;
				top: 50%;
				left: 50%;
				z-index: 1;
				top: 50%;
				left: 50%;
				-webkit-transform: translate(-50%, -50%);
				-ms-transform: translate(-50%, -50%);
				transform: translate(-50%, -50%);
				margin: 0;
				padding: 0;
				-webkit-border-radius: 50%;
				-ms-border-radius: 50%;
				border-radius: 50%;
				background-color: #FFFFFF;
				min-width: 55px;
				height: 55px;
				line-height: 55px;
				display: flex;
				align-items: center;
				justify-content: center;
				opacity: 0;
				transition: all 0.3s;
				transform: translate(-50%, -30%);
				i{
					font-size: 20px;
					display: block;
					text-align: center;
					vertical-align: middle;
					line-height: 55px;
				}
			}
			&:hover{
				.icon-instagram {opacity: 1;transform: translate(-50%, -50%);}
				img{transform: scale3d(1.1, 1.1, 1.1);}
			}
		}       
	}

	&.instagram-3{
		.instagram-item{
			position: relative;
			overflow: hidden;
			&::before{
				position: absolute;
				content: "";
				height: calc(100% + 4px);
				width: calc(100% + 4px);
				right: -2px;
				bottom: -2px;
				z-index: 1;
				background-color: rgba(255, 255, 255, 0);
				-webkit-backdrop-filter: blur(14px) brightness(92%);
				backdrop-filter: blur(14px) brightness(92%);
				transition: opacity 0.6s cubic-bezier(0.22, 0.61, 0.36, 1);
				opacity: 0;
			}
			img{transition: all 1s cubic-bezier(0.19, 1, 0.22, 1)}
			&:hover{
				&:before{opacity:1;}
				img{transform: scale(1.15);}
			}
		}
		.icon-instagram {
			position: absolute;
			z-index: 2;
			top: 50%;
			left: 50%;
			-webkit-transform: translate(-50%, -50%);
			-ms-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
			margin: 0;
			padding: 0;
			-webkit-border-radius: 50%;
			-ms-border-radius: 50%;
			border-radius: 50%;
			background-color: #FFFFFF;
			width: 115px;
			height: 115px;
			overflow: hidden;
			i {
				font-size: 32px;
				display: block;
				text-align: center;
				vertical-align: middle;
				position: relative;
				top: 15px;
			}
			span.follow-title{
				text-transform: uppercase;
				font-size: 12px;
				position: relative;
				bottom: -25px;
				font-weight: 600;
				line-height: 1.5;
				text-align: center;
				display: block;
			}
		}
	}
}
/* buddypress */
.activity-list.bp-list {
	border-radius: 20px;
	margin-bottom: 100px;
	.activity-item{
		@extend .border;
		box-shadow: none;
		border-radius: 20px;
	}
}
.buddypress-wrap form#group-members-search, .buddypress-wrap form.bp-dir-search-form, .buddypress-wrap form.bp-messages-search-form, .buddypress-wrap form[data-bp-search].bp-invites-search-form, .buddypress-wrap.bp-dir-hori-nav:not(.bp-vertical-navs) nav:not(.tabbed-links), .buddypress-wrap .activity-comments .acomment-content{
	@extend .border;
    box-shadow: none;
    border-radius: 25px;
}
.buddypress-wrap .select-wrap, .activity-update-form #whats-new-submit input{
	@extend .border;
    border-radius: 25px !important;
    padding: 5px 15px;
}
body #buddypress * a{font-weight:600;}
.activity-list .activity-item div.item-avatar img{ border-radius:20px;}
.activity-update-form #whats-new-avatar img { border-radius: 25px;}
body #buddypress div, body #buddypress dl, body #buddypress input[type=reset], body #buddypress input[type=search], body #buddypress input[type=submit], body #buddypress li, body #buddypress select, body #buddypress textarea{ border-radius: 20px;}
.buddypress-wrap form#group-members-search button[type=submit], .buddypress-wrap form.bp-dir-search-form button[type=submit], .buddypress-wrap form.bp-messages-search-form button[type=submit], .buddypress-wrap form[data-bp-search].bp-invites-search-form button[type=submit]{padding:12px .5em !important;}
body #buddypress .bp-list .action{ background: transparent;}
.activity-update-form #whats-new-textarea textarea{border-radius:25px;padding:15px;}
.buddypress .buddypress-wrap .generic-button a{@extend .border; border-radius: 5px;}
.buddypress-wrap .standard-form input:not(.small), .buddypress-wrap .standard-form textarea{border-radius: 25px;}
.buddypress-wrap .bp-feedback:not(.custom-homepage-info){ @extend .border;border-radius: 15px; box-shadow: none; padding: 15px;}
.buddypress-wrap .bp-feedback.help .bp-icon, .buddypress-wrap .bp-feedback.info .bp-icon{border-radius: 15px;}
.register-page .signup-form .wp-pwd button { border: 0; padding: 15px; border-radius: 25px; background: transparent !important;}
.buddypress-wrap #pass-strength-result.strong{ border-radius:25px;}
.buddypress-wrap .standard-form div.submit input {@extend .border; border-radius: 25px !important;padding: 15px; margin-bottom: 30px;}
.register-section .bp-heading{font-size:20px;line-height:29px;}
.register-page .signup-form .description.indicator-hint { padding:15px; border-radius:5px;}