@charset "utf-8";

/*
/*	Copyright (c) 2023 Marketify
/*	Author: Marketify
/*	This file is made for CURRENT TEMPLATE


01)	ERLING BASE
02) ERLING MOBILE MENU
03) ERLING HEADER
04) ERLING HERO
05) ERLING ABOUT
06) ERLING SERVICES
07) ERLING PORTFOLIO
08) ERLING EXPERIENCE
09) ERLING TESTIMONIALS
10) ERLING NEWS
11) ERLING CONTACT
12) ERLING COPYRIGHT
13) ERLING TOTOP
14) ERLING MEDIA QUERIES (FOR SMALL DEVICES)


/*---------------------------------------------------*/
/*	01) ERLING BASE
/*---------------------------------------------------*/

a{
	text-decoration: none;
}
ul{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
}
ul li{
	margin: 0px;
	padding: 0px;
}
:root{
    --font-syne: 'Syne', sans-serif;
}
html {
	overflow-x: hidden;
	padding: 0px;
	margin: 0px;	
}
body{
	font-family: var(--font-syne);
	font-size: 16px;
	line-height: 27px;
	letter-spacing: 0px;
	word-wrap: break-word;
	font-weight: 400;
	background-color: #fff;
	color: #868a9b;
	overflow-x: hidden;
}

svg{
	fill: currentcolor;
	width: 15px;
	height: 15px;
}
img.svg{
	width: 15px;
	height: 15px;
}
::-webkit-input-placeholder { /* WebKit, Blink, Edge */
   color: #868a9b;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color: #868a9b;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color: #868a9b;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #868a9b;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color: #868a9b;
}

::placeholder { /* Most modern browsers support this now. */
   color: #868a9b;
}

h1, h2, h3, h4, h5, h6{
	font-weight:700;
	line-height: 1.3;
	font-family: var(--font-syne);
	color: #000;
	font-variant-numeric: lining-nums proportional-nums;
}

h1 { font-size: 45px; }
h2 { font-size: 36px; }
h3 { font-size: 30px; }
h4 { font-size: 24px; }
h5 { font-size: 20px; }
h6 { font-size: 16px; }

.h3-about{margin-bottom:80px;
	}
.erling_tm_all_wrap{
	width: 100%;
	height: auto;
	clear: both;
	position: relative;
}
.erling_tm_all_wrap,
.erling_tm_all_wrap *{
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	   -moz-box-sizing: border-box; /* Firefox, other Gecko */
			box-sizing: border-box; /* Opera/IE 8+ */
}
.clearfix:after,
.clearfix:before{
	clear: both;
	display: table;
	content: '';
}
.erling_tm_section{
	width: 100%;
	height:auto;
	clear: both;
}

#preloader{
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    width: 100%;
    z-index: 99999;
    display: flex;d
}
#preloader:before,
#preloader:after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 50%;
    height: 100%;
    z-index: -1;
    background-color: #000;
    -webkit-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}
#preloader:after{
    left: auto;
    right: 0;
}
#preloader .loader_line{
    margin: auto;
    width: 1px;
    height: 250px;
    position: relative;
    overflow: hidden;
    -webkit-transition: all 0.8s ease 0s;
    -o-transition: all 0.8s ease 0s;
    transition: all 0.8s ease 0s;
}
.loader_line:before{
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    width: 1px;
    height: 0%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    background-color: #fff;
    -webkit-animation: lineheight 1000ms ease-in-out 0s forwards;
    -o-animation: lineheight 1000ms ease-in-out 0s forwards;
    animation: lineheight 1000ms ease-in-out 0s forwards;
}
.loader_line:after{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 1px;
    height: 100%;
    background-color: #999999;
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-animation: lineround 1200ms linear 0s infinite;
    -o-animation: lineround 1200ms linear 0s infinite;
    animation: lineround 1200ms linear 0s infinite;
    animation-delay: 2000ms;
}

@keyframes lineheight{
    0%{
        height: 0%;
    }
    100%{
        height: 100%;
    }
}

@keyframes lineround{
    0%{
        -webkit-transform: translateY(-100%);
        -ms-transform: translateY(-100%);
        -o-transform: translateY(-100%);
        transform: translateY(-100%);
    }
    100%{
        -webkit-transform: translateY(200%);
        -ms-transform: translateY(200%);
        -o-transform: translateY(200%);
        transform: translateY(200%);
    }
}

/*hiding all*/
.preloaded .loader_line:after{
    opacity: 0;
}
.preloaded  .loader_line{
    opacity: 0;
    height: 100%!important;
}
.preloaded:before,
.preloaded:after{
    -webkit-animation: preloadedzero 300ms ease-in-out 500ms forwards;
    -o-animation: preloadedzero 300ms ease-in-out 500ms forwards;
    animation: preloadedzero 300ms ease-in-out 500ms forwards;
}
@keyframes preloadedzero{
    0%{
        width: 50%;
    }
    100%{
        width: 0%;
    }
}
.container{
	max-width: 1210px;
	width:100%;
	margin-left: auto;
	margin-right: auto;
	height:auto;
	padding:0px 20px;
	position:relative;
	clear:both;
}
.erling_tm_section{
	width: 100%;
}
.erling_tm_mainpart{
	width: 100%;

	padding-left: 400px;
	background-image:url(../img/logo/bg1200.jpg);
	background-repeat:no-repeat;
	background-position:top;
	background-size:100% auto;
}

@media (max-width: 768px){
  .erling_tm_mainpart{
  
	width: 100%;
	padding-left: 400px;
	background-image:url(../img/logo/bg1200.jpg);
	background-repeat:no-repeat;
	background-position:top;
	background-size:auto ;

  }
}

/*---------------------------------------------------*/
/*	02) ERLING MOBILE MENU
/*---------------------------------------------------*/

.erling_tm_mobile_menu{
	width: 100%;
	height: auto;
	position: fixed;
	top: 0px;
	left: 0px;
	display: none;
	z-index: 10;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.erling_tm_mobile_menu .mobile_menu_inner{
	width: 100%;
	height: auto;
	float: left;
	clear: both;
	background-color: #fff;
	border-bottom: 1px solid rgba(0,0,0,.2);
	padding: 10px 20px 10px 20px;
}
.erling_tm_mobile_menu .mobile_in{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.erling_tm_mobile_menu .mobile_in .logo img{
	max-width: 90px;
	max-height: 70px;
}
.erling_tm_mobile_menu .trigger{
	line-height: 0;
}
.erling_tm_mobile_menu .dropdown{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	background-color: #fff;
	display: none;
}
.erling_tm_mobile_menu .dropdown .dropdown_inner{
	width: 100%;
	height: auto;
	clear: both;
	float: left;
	padding: 20px;
}
.erling_tm_mobile_menu .dropdown .dropdown_inner > ul{
	margin: 0px;
	list-style-type: none;
}
.erling_tm_mobile_menu .dropdown .dropdown_inner > ul > li{
	margin: 0px;
	float: left;
	width: 100%;
}
.erling_tm_mobile_menu .dropdown .dropdown_inner > ul > li a{
	text-decoration: none;
	color: #000;
	display: inline-block;
	padding: 0px 0px;
	font-weight: 500;
}
.erling_tm_mobile_menu .hamburger-box{
	width: 30px;
}
.erling_tm_mobile_menu .hamburger{
	padding: 0px;
}

/*---------------------------------------------------*/
/*	03) ERLING SIDEBAR MENU
/*---------------------------------------------------*/

.erling_tm_sidebar_menu{
	width: 400px;
	left: 0px;
	top: 0px;
	bottom: 0px;
	position: fixed;
	background-color: #fff;
	box-shadow: 0 0 30px rgb(0 0 0 / 5%);
	display: flex;
	align-items: center;
}
.erling_tm_sidebar_menu .sidebar_inner{
	width: 100%;
	padding: 0px 70px;
}
.erling_tm_sidebar_menu .logo{
	margin-bottom: 60px;
}
.erling_tm_sidebar_menu .logo img{
	max-width: 140px;
	max-height: 100px;
}
.erling_tm_sidebar_menu .menu{
	margin-bottom: 55px;
}
.erling_tm_sidebar_menu .menu ul li{
	width: 100%;
}
.erling_tm_sidebar_menu .menu ul li a{
	display: inline-block;
	color: #868a9b;
	padding: 5px 0px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease; 
}
.erling_tm_sidebar_menu .menu ul li.current a,
.erling_tm_sidebar_menu .menu ul li a:hover{
	color: #000;
}
.erling_tm_sidebar_menu .copyright a{
	color: #000;
}

/*---------------------------------------------------*/
/*	03) ERLING HEADER
/*---------------------------------------------------*/

.erling_tm_header{
	position: fixed;
	top: 0px;
	left: 0px;
	right: 0px;
	z-index: 10;

	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.erling_tm_header .header_inner{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 30px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.erling_tm_header.animate{
	background-color: #fff;
}
.erling_tm_header.animate .header_inner{
	padding: 20px 30px;
}
.erling_tm_header .logo img{
	max-width: 120px;
	max-height: 70px;
}
.erling_tm_header .menu{
	display: flex;
	align-items: center;
}
.erling_tm_header .list{
	position: relative;
}
.erling_tm_header .list ul{
	margin: 0px;
	list-style-type: none;
}
.erling_tm_header .list ul li{
	margin: 0px 20px 0px 0px;
	display: inline-block;
	list-style-type: none;
	opacity: 0;
	visibility: hidden;
	position: relative;
	left: 10px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.erling_tm_header .list ul li:last-child{
	margin-right: 0px;
}
.erling_tm_header .list ul li.opened{
	opacity: 1;
	visibility: visible;
	left: 0px;
}
.erling_tm_header .list ul li a{
	text-decoration: none;
	color: #868a9b;
	display: inline-block;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.erling_tm_header .list ul li.current a,
.erling_tm_header .list ul li a:hover{
	color: #000;
}
.erling_tm_header .trigger{
	line-height: 1;
	padding-left: 40px;
}
.trigger .hamburger-inner, 
.trigger .hamburger-inner:after, 
.trigger .hamburger-inner:before{
	height: 2px;
	width: 30px;
}
.trigger .hamburger{
	padding: 0px;
}

/*---------------------------------------------------*/
/*	04) ERLING HERO
/*---------------------------------------------------*/

.erling_tm_hero{
	width: 100%;
	min-height: 100vh;
	position: relative;
}
.erling_tm_hero .content{
	width: 100%;
	height: 100vh;
	position: relative;
	display: flex;
	align-items: center;
}
.erling_tm_hero .wrapper{
	display: flex;
	height: 100vh;
}
.erling_tm_hero .leftpart{
	width: 45%;
	position: relative;
}
.erling_tm_hero .wrapper .text{
	padding-left: 90px;
}
.erling_tm_hero .wrapper.textspacing .text h3:nth-child(2){
	padding-left: 80px;
}
.erling_tm_hero .wrapper.textspacing .job{
	margin-left: 185px;
}
.erling_tm_hero .leftpart .main{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.erling_tm_hero .rightpart{
	width: 55%;
	display: flex;
	align-items: center;
}


.erling_tm_about .image{
	position: relative;
	width: 450px;
	height: 450px;
}



.erling_tm_about .image .main{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-position:center;
	background-size: cover;
	animation: morph 8s ease-in-out infinite;
	background-blend-mode: multiply;
	-webkit-box-shadow: inset 0px 0px 0px 18px rgba(255,255,255,.8);
    -moz-box-shadow: inset 0px 0px 0px 18px rgba(255,255,255,.8);
    box-shadow: inset 0px 0px 0px 18px rgba(255,255,255,.8);
}



.erling_tm_about .image.rounded{
	width: 430px;
	height: 430px;
}




.erling_tm_about .image.rounded .main{
	animation: none;
	background-blend-mode: normal;
	box-shadow: none;
	border-radius: 100%;
}




.erling_tm_about .image.rounded .main:before{
	position: absolute;
	content: "";
	top: -20px;
	bottom: -20px;
	left: -20px;
	right: -20px;
	background-color: rgba(0,0,0,.1);
	border-radius: 100%;
	z-index: -1;
}



.erling_tm_about .details.square .image{
	width: 430px;
	height: 430px;
}
.erling_tm_about .details.square .image .main{
	animation: none;
	background-blend-mode: normal;
	box-shadow: none;
}




.erling_tm_about .details.square .image .main:before{
	position: absolute;
	content: "";
	top: -20px;
	bottom: -20px;
	left: -20px;
	right: -20px;
	background-color: rgba(0,0,0,.1);
	z-index: -1;
}

@keyframes morph {
	 0% {
		 border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
	}
	 50% {
		 border-radius: 30% 60% 70% 40% / 50% 60% 30% 60%;
	}
	 100% {
		 border-radius: 60% 40% 30% 70% / 60% 30% 70% 40%;
	}
}
.erling_tm_hero .details{
	display: flex;
	align-items: center;
}
.erling_tm_hero .text{
	padding-left: 70px;
}
.erling_tm_hero .details.square .text,
.erling_tm_hero .text.rounded{
	padding-left: 90px;
}
.erling_tm_hero .text .stroke{
	color: transparent;
	 -webkit-text-stroke: 1px #000;
}
.erling_tm_hero .text h3{
	font-size: 130px;
	font-weight: 800;
	line-height: 1.1;
	text-transform: uppercase;
	font-family: 'Archivo Black', sans-serif;
}
.erling_tm_hero .job{
	display: inline-block;
	background-color: #ffffff;
	padding: 15px 40px;
	margin-top: 30px;
}
.erling_tm_hero .job span{
	position: relative;
	display: inline-block;
	padding-right: 15px;
	margin-right: 10px;
}
.erling_tm_hero .job span:after{
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	background-color: rgba(0,0,0,.15);
	right: 0px;
	top: 50%;
	transform: translateY(-50%);
	border-radius: 100%;
}
.erling_tm_hero .job span:last-child{
	margin: 0px;
	padding: 0px;
}
.erling_tm_hero .job span:last-child:after{
	display: none;
}

/*---------------------------------------------------*/
/*	05) ERLING ABOUT
/*---------------------------------------------------*/

.erling_tm_about{
	width: 100%;
	background-color: #ffffff;
	padding: 143px 0px;
}
.erling_tm_about .about_inner{
	width: 100%;
	display: flex;
}
.erling_tm_about .left{
	width: 50%;
	padding-right: 50px;
}
.erling_tm_about .erling_tm_title{
	margin-bottom: 30px;
}
.erling_tm_title{
	width: 100%;
	margin-bottom: 70px;
}
.erling_tm_title h3{
	font-size: 45px;
	font-weight: 700;
}
.erling_tm_title span{
	display: inline-block;
	margin-bottom: 10px;
	text-transform: uppercase;
	position: relative;
	padding-left: 60px;
}
.erling_tm_title span:before{
	position: absolute;
	content: "";
	width: 40px;
	height: 1px;
	background-color: #868a9b;
	left: 0px;
	top: 50%;
	transform: translateY(-50%);
}
.erling_tm_about .text{
	width: 100%;
	margin-bottom: 40px;
}
.erling_tm_button{
	width: 100%;
}
.erling_tm_button a{
	color: #fff;
	display: inline-block;
	background-color: #000;
	padding: 20px 50px;
	position: relative;
	border: none;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
#send_message{
	color: #fff !important;
	display: inline-block !important;
	background-color: #000 !important;
	padding: 20px 50px !important;
	position: relative !important;
	border: none !important;
	cursor: pointer;
	font-size: 16px;
	font-family: var(--font-syne);
}
.erling_tm_button a:hover{
	background-color: #666;
}
.erling_tm_about .right{
	width: 50%;
	padding-left: 50px;
}
.erling_tm_about .right .list{
	width: 100%;
}
.accordion_wrap{
	width: 100%;
}
.accordion_wrap .accordion{
	width: 100%;
	margin-bottom: 10px;
}
.accordion_wrap.ready .active .accordion_content{
	display: block;
}
.accordion_wrap .accordion_header{
	width: 100%;
	background-color: #eaeaea;
	padding: 25px 40px;
	cursor: pointer;
}
.accordion_wrap .accordion_header h3{
	font-size: 17px;
	text-transform: uppercase;
}
.accordion_wrap .accordion_content{
	width: 100%;
	padding: 40px;
	background-color: #fff;
	display: none;
}
.accordion_wrap .info_list{
	width: 100%;
}
.accordion_wrap .info_list ul li{
	width: 100%;
	margin-bottom: 14px;
}
.accordion_wrap .info_list ul li:last-child{
	margin-bottom: 0px;
}
.accordion_wrap .info_list ul li span{
	display: inline-block;
}
.accordion_wrap .info_list ul li span:first-child{
	min-width: 135px;padding-right: 20px;
}
.accordion_wrap .info_list ul li a{
	color: #000;
}
.accordion_wrap .my_skills{
	width: 100%;
}
.accordion_wrap .my_skills ul li{
	width: 100%;
	margin-bottom: 14px;
	display: flex;
	align-items: center;
}
.accordion_wrap .my_skills .title{
	min-width: 135px;
}
.accordion_wrap .erling_progress{
	position: relative;
	width: 100%;
}
.accordion_wrap .progress_inner .background{
	background:rgba(0,0,0,.05);
	width:100%;
	min-width:100%;
	position:relative;
	height:8px;
}
.accordion_wrap .progress_inner .background .bar_in{
	height:100%;
	background:#d9d9d9;
	width:0px;
	overflow:hidden;
}
.accordion_wrap .progress_inner .background .bar{
	width:0px;
	height:100%;
}
.social{
	width: 100%;
	color: #000;
	margin-bottom:350px;
}
.social ul{
	display: flex;
	flex-wrap: wrap;
	margin-left: -20px;
}
.social li{
	width: 50%;
	margin-bottom: 14px;
	padding-left: 20px;
}
.social li:last-child{
	margin-bottom: 0px;
}
.social a{
	color: #000;
}
.accordion_wrap .my_map{
	width: 100%;
	filter: grayscale(100%);
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
}
.line_effect{
	text-decoration: none;
	color: #fff;
	display: inline-block;
	position: relative;
}
.line_effect:after{
	content: '';
    width: 0;
    height: 1px;
    position: absolute;
    left: auto;
    right: 0;
    bottom: 3px;
    transition: width .6s cubic-bezier(.25,.8,.25,1) 0s;
    background: currentColor;
}
.line_effect:hover:after{
	width:100%;
	left:0;
	right:auto;
}
.text_hover_effect{
	position: relative;
	display: inline;
	background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 1px;
    transition: background-size .5s;
}
.text_hover_effect:after{
	content: '';
	position: absolute;
	top: -5px;
	left: -5px;
	right: -5px;
	bottom: -5px;
}
.text_hover_effect:hover{
	background-size: 100% 1px;
}

/*---------------------------------------------------*/
/*	06) ERLING SERVICES
/*---------------------------------------------------*/

.erling_tm_service{
	width: 100%;
	padding: 143px 0px 110px 0px;
}
.erling_tm_service .service_list{
	width: 100%;
}
.erling_tm_service .service_list > ul{
	display: flex;
	flex-wrap: wrap;
	margin-left: -40px;
}
.erling_tm_service .service_list > ul > li{
	width: 33.3333%;
	padding-left: 40px;
	margin-bottom: 40px;
}
.erling_tm_service .service_list .list_inner{
	width: 100%;
	height: 100%;
	position: relative;
	background-color: #ffffff;
	padding: 70px 50px;
}
.erling_tm_service .service_list .list_inner .svg{
	width: 53px;
	height: 53px;
	color: #999;
	margin-bottom: 20px;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.erling_tm_service .service_list .list_inner:hover .svg{
	color: #000;
}
.erling_tm_service .service_list .title{
	font-size: 20px;
}
.erling_tm_service .service_list .list{
	width: 100%;
	border-top: 1px solid rgba(0,0,0,.1);
	margin-top: 30px;
	padding-top: 30px;
}
.erling_tm_service .service_list .list li{
	width: 100%;
	margin-bottom: 5px;
	position: relative;
	padding-left: 18px;
}
.erling_tm_service .service_list .list li:last-child{
	margin-bottom: 0px;
}
.erling_tm_service .service_list .list li:before{
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	background-color: rgba(0,0,0,.15);
	border-radius: 100%;
	left: 0px;
	top: 50%;
	transform: translateY(-50%);
}
.erling_tm_service .erling_progress{
	position: absolute;
	bottom: 0px;
	left: 0px;
	right: 0px;
}
.erling_tm_service .progress_inner .background{
	width:100%;
	min-width:100%;
	position:relative;
	height:8px;
}
.erling_tm_service .progress_inner .background .bar_in{
	height:100%;
	background:#d9d9d9;
	width:0px;
	overflow:hidden;
}
.erling_tm_service .progress_inner .background .bar{
	width:0px;
	height:100%;
}
.progress_inner .background .bar.open{
	-webkit-animation: wow 2s cubic-bezier(0.165, 0.840, 0.440, 1.000);  /* Safari 4+ */
	-moz-animation:    wow 2s cubic-bezier(0.165, 0.840, 0.440, 1.000);  /* Fx 5+ */
	animation:         wow 2s cubic-bezier(0.165, 0.840, 0.440, 1.000);  /* IE 10+ */
	width:100%;	
}

@-webkit-keyframes wow {0%{ width:0%; } 100%{ width:100%; }}
@-moz-keyframes wow {0%{ width:0%; } 100%{ width:100%; }}
@keyframes wow {0%{ width:0%; } 100%{ width:100%; }}

/*---------------------------------------------------*/
/*	07) ERLING PORTFOLIO
/*---------------------------------------------------*/



/*---------------------------------------------------*/
/*	08) ERLING EXPERIENCE
/*---------------------------------------------------*/

.erling_tm_experience{
	width: 100%;
	padding: 143px 0px 150px 0px;
	background-color: #ffffff;
}
.erling_tm_experience .experience_inner{
	width: 100%;
	display: flex;
}
.erling_tm_experience .left{
	width: 90%;
	padding-right: 20px;
}
.erling_tm_experience .box{
	width: 100%;
}
.erling_tm_experience .box .title{
	width: 100%;
	padding: 10px 40px;
	background-color: #333333;
	margin-bottom: 30px;
}
.erling_tm_experience .box .title h3{
	font-size: 20px;
	text-transform: uppercase;
	color:#ffffff;
}
.worksp{color:#000000;
}
.erling_tm_experience .list_wrap{
	width: 100%;
}
.erling_tm_experience .box ul{
	position: relative;
}
.erling_tm_experience .box ul li{
	width: 100%;
	margin-bottom: 10px;
}
.erling_tm_experience .box ul li:last-child{
	margin-bottom: 0px;
}
.erling_tm_experience .box ul li .list_inner{
	width: 100%;
	position: relative;
	display: flex;
	justify-content: space-between;
	background-color: #ffffff;
	padding: 10px 10px 10px 10px;
	border-left: 3px solid rgba(0,0,0,.1);
}
.erling_tm_experience .box .time{
	display: inline-block;
}
.erling_tm_experience .box .time span{
	display: inline-block;
	background-color: #fff;
	padding: 10px 10px;
}
.erling_tm_experience .box .occ{
	padding-right: 20px;
}
.erling_tm_experience .box .occ h3{
	font-size: 17px;
	margin-bottom: 2px;
}
.erling_tm_experience .right{
	width: 50%;
	padding-left: 20px;
}

/*---------------------------------------------------*/
/*	09) ERLING TESTIMONIALS
/*---------------------------------------------------*/

.erling_tm_testimonials{
	width: 100%;
	background-color: #ffffff;
	padding: 143px 0px 150px 0px;
}
.erling_tm_testimonials .wrapper{
	width: 100%;
	display: flex;
}
.erling_tm_testimonials .left{
	width: 60%;
	padding-right: 20px;
}
.erling_tm_testimonials .box{
	width: 100%;
	background-color: #fff;
	position: relative;
}
.erling_tm_testimonials .short{
	width: 100%;
    background-color: #eaeaea;
    padding: 25px 40px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.erling_tm_testimonials .short img{
	width: 60px;
	height: 60px;
	border-radius: 100%;
	object-fit: cover;
}
.erling_tm_testimonials .short h3{
	font-size: 17px;
	text-transform: uppercase;
}
.erling_tm_testimonials .desc{
	width: 100%;
	padding: 40px 40px 60px 40px;
}
.erling_tm_testimonials .sign{
	max-width: 200px;
	margin-top: 30px;
}
.erling_tm_testimonials .right{
	width: 40%;
	padding-left: 20px;
}
.erling_tm_testimonials .right .in{
	width: 100%;
	height: 100%;
	position: relative;
	background-color: #fff;
}
.erling_tm_testimonials .box .svg{
	position: absolute;
	bottom: -130px;
	right: -100px;
	width: 500px;
	height: 500px;
	opacity: .07;
}
.erling_tm_testimonials .rating{
	display: flex;
	margin-bottom: 20px;
}
.erling_tm_testimonials .rating li i{
	font-size: 18px;
}
.erling_tm_testimonials .desc p{
	position: relative;
	z-index: 1;
}

/*---------------------------------------------------*/
/*	10) ERLING NEWS
/*---------------------------------------------------*/

.erling_tm_news{
	width: 100%;
	padding: 143px 0px 110px 0px;
}
.erling_tm_news .news_list{
	width: 100%;
}
.erling_tm_news .news_list ul{
	margin: 0px 0px 0px -40px;
	display: flex;
	flex-wrap: wrap;
}
.erling_tm_news .news_list ul li{
	margin: 0px 0px 40px 0px;
	padding-left: 40px;
	width: 33.3333%;
}
.erling_tm_news .news_list ul li .list_inner{
	width: 100%;
	height: 100%;
	clear: both;
	position: relative;
}
.erling_tm_news .news_list ul li .image{
	position: relative;
	margin-bottom: 10px;
	overflow: hidden;
}
.erling_tm_news .news_list ul li .image img{
	position: relative;
	min-width: 100%;
	opacity: 0;
}
.erling_tm_news .news_list ul li .image .main{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	transform: scale(1) translateZ(0);
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.erling_tm_news .news_list ul li .image:hover .main{
	transform: scale(1.1) translateZ(0)
}
.erling_tm_news .news_list ul li .details{
	width: 100%;
	background-color: #ffffff;
}
.erling_tm_news .news_list ul li .meta{
	width: 100%;
	background-color: #eaeaea;
	padding: 15px 30px;
}
.erling_tm_news .news_list ul li .meta{
	display: flex;
	align-items: center;
}
.erling_tm_news .news_list ul li .meta span{
	position: relative;
	display: inline-block;
	padding-right: 15px;
	margin-right: 10px;
}
.erling_tm_news .news_list ul li .meta span:after{
	position: absolute;
	content: "";
	width: 6px;
	height: 6px;
	background-color: rgba(0,0,0,.15);
	right: 0px;
	top: 50%;
	transform: translateY(-50%);
	border-radius: 100%;
}
.erling_tm_news .news_list ul li .meta span:last-child{
	margin: 0px;
	padding: 0px;
}
.erling_tm_news .news_list ul li .meta span:last-child:after{
	display: none;
}
.erling_tm_news .news_list ul li .meta a{
	color: #000;
}
.erling_tm_news .news_list ul li .title{
	width: 100%;
	padding: 30px;
}
.erling_tm_news .news_list ul li .title h3{
	font-size: 20px;
}
.erling_tm_news .news_list ul li .title a{
	color: #000;
}
.erling_tm_news .news_list ul li .date{
	position: absolute;
	z-index: 1;
	top: 20px;
	left: 20px;
	background-color: #fff;
	display: inline-block;
	padding: 5px 20px;
}

/*---------------------------------------------------*/
/*	11) ERLING CONTACT
/*---------------------------------------------------*/

.erling_tm_contact{
	width: 100%;
	padding: 143px 0px 140px 0px;
	background-color: #ffffff;
}
.erling_tm_contact .contact_inner{
	width: 100%;
}
.erling_tm_contact .form_wrapper{
	width: 100%;
}
.erling_tm_contact .form_wrapper ul{
	display: flex;
	flex-wrap: wrap;
	margin-left: -10px;
}
.erling_tm_contact .form_wrapper ul li{
	width: 50%;
	padding-left: 10px;
	margin-bottom: 10px;
}
.erling_tm_contact .form_wrapper ul li input,
.erling_tm_contact .form_wrapper ul li select{
	width: 100%;
	height: 50px;
	padding: 5px 20px;
	background-color: #eaeaea;
	font-family: var(--font-syne);
	font-size: 16px;
	color: #868a9b;
}
.erling_tm_contact .form_wrapper ul li input:focus,
.erling_tm_contact .form_wrapper ul li select:focus,
.erling_tm_contact .form_wrapper textarea:focus,
.erling_tm_contact .enter_code input:focus{
	outline: none;
}
.erling_tm_contact .form_wrapper textarea{
	padding: 20px;
	height: 120px;
	background-color: #eaeaea;
	resize: none;
	font-family: var(--font-syne);
	font-size: 16px;
}
.erling_tm_contact #enter_code{
	width: 100%;
	display: flex;
	align-items: center;
	margin-bottom: 30px;
	margin-top: 2px;
}
.erling_tm_contact #enter_code span{
	display: inline-block;
	height: 50px;
	line-height: 50px;
	color: #fff;
	background-color: #000;
	padding: 0px 30px;
}
.erling_tm_contact #enter_code input{
	display: inline-block;
	height: 50px;
	line-height: 50px;
	background-color: #eaeaea;
	padding: 0px 20px;
	font-family: var(--font-syne);
	font-size: 16px;
}
.erling_tm_contact input::-webkit-outer-spin-button,
.erling_tm_contact input::-webkit-inner-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* Firefox */
.erling_tm_contact input[type=number] {
  -moz-appearance: textfield;
}

.error_box{
	width: 100%;
	background-color: #fce3e3;
	padding: 20px 10px;
	text-align: center;
	margin-bottom: 10px;
	display: none;
}
.error_box p{
	color: #721c24;
}
.success_box{
	width: 100%;
	display: none;
	background-color: #0ac083;
	padding: 20px 10px;
	text-align: center;
	margin-bottom: 10px;
}
.success_box p{
	color: #fff;
}
.error .cf-form-control {
	border-bottom: 2px solid red;
}
.error select {
	border-bottom: 2px solid red;
}
.success .cf-form-control {
	border-bottom: 2px solid green;
}
.success select {
	border-bottom: 2px solid green;
}
#text-area-w {
	width: 100%;
}

/*---------------------------------------------------*/
/*	12) ERLING COPYRIGHT
/*---------------------------------------------------*/

.erling_tm_copyright{
	width: 100%;
	background-color: #333;
	padding: 45px 0px;
}
.erling_tm_copyright .inner{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.erling_tm_copyright img{
	max-width: 140px;
	max-height: 70px;
}
.erling_tm_copyright p{
	color: #fff;
}
.erling_tm_copyright p a{
	color: #fff;
}

/*---------------------------------------------------*/
/*	13) ERLING TOTOP
/*---------------------------------------------------*/

.progressbar{
    position: fixed;
	height: 100px;
    width: 1px;
	bottom: 25px;
    right: -25px;
    background-color: rgba(0,0,0,.08);
    z-index: 10;
	
	-webkit-transition: all .3s ease;
	   -moz-transition: all .3s ease;
	    -ms-transition: all .3s ease;
	     -o-transition: all .3s ease;
	        transition: all .3s ease;
}
.progressbar.animate{
	right: 25px;
}
.progressbar .line {
	position: absolute;
    width: 1px;
	height: auto;
    background-color: rgba(0,0,0,.4);
}
.progressbar .text{
	position: absolute;
    bottom: 100px;
    left: 0px;
    font-size: 13px;
    transform: rotateZ(90deg);
    text-transform: uppercase;
    transform-origin: left;
    white-space: nowrap;
}
.progressbar a{
	text-decoration: none;
	color: #000;
}

/*---------------------------------------------------*/
/*	14) ERLING MEDIA QUERIES (FOR SMALL DEVICES)
/*---------------------------------------------------*/

@media (max-width: 1600px) {
	.container{max-width: 968px;}
	.erling_tm_sidebar_menu{width: 300px;}
	.erling_tm_mainpart{padding-left: 300px;}
	.erling_tm_sidebar_menu .sidebar_inner{padding: 0px 30px;}
	.erling_tm_sidebar_menu .menu ul li a{padding: 2px 0px;}
	.erling_tm_hero .image{width: 350px;height: 350px;}
	.erling_tm_hero .image.rounded{width: 330px;height: 330px;}
	.erling_tm_hero .details.square .image{width: 330px;height: 330px;}
	.erling_tm_hero .text h3{font-size: 85px;}
	.erling_tm_hero .wrapper .text h3{font-size: 75px;}
	.erling_tm_hero .wrapper .text{padding-left: 70px;}
	.erling_tm_hero .wrapper.textspacing .text h3:nth-child(2){padding-left: 55px;}
	.erling_tm_hero .wrapper.textspacing .job{margin-left: 140px;}
	.erling_tm_hero .job{margin-top: 20px;}
	.erling_tm_title h3{font-size: 35px;}
	.erling_tm_service .service_list .title{font-size: 18px;}
	.erling_tm_service .service_list .list_inner{padding: 65px 45px;}
	.erling_tm_news .news_list ul li .title h3{font-size: 18px;}
	.erling_tm_portfolio .portfolio_list .details h3{font-size: 18px;}
	.erling_tm_experience .box .occ h3{font-size: 16px;}
	
	.erling_tm_about .image{width: 350px;height: 350px;}
	.erling_tm_about .image.rounded{width: 330px;height: 330px;}
	.erling_tm_about .square .image{width: 330px;height: 330px;}
}
@media (max-width: 1040px) {
	.erling_tm_header{display: none;}
	.erling_tm_sidebar_menu{display: none;}
	.erling_tm_mobile_menu{display: block;}
	.erling_tm_mainpart{padding-left: 0px;}
	.erling_tm_hero .details{flex-direction: column;text-align: center;width: 100%;}
	.erling_tm_hero .image{width: 300px;height: 300px;margin-bottom: 40px;}
	.erling_tm_hero .image.rounded{width: 280px;height: 280px;margin-bottom: 40px;}
	.erling_tm_hero .details.square .image{width: 280px;height: 280px;margin-bottom: 40px;}
	.erling_tm_hero .text{padding-left: 0px;}
	.erling_tm_hero .text.rounded{padding-left: 0px;}
	.erling_tm_hero .details.square .text{padding-left: 0px;}
	.erling_tm_hero .text h3{font-size: 60px;}
	.erling_tm_hero .job{padding: 10px 25px;}
	.erling_tm_about .about_inner{flex-direction: column;}
	.erling_tm_about .left{width: 100%;padding-right: 0px;margin-bottom: 40px;}
	.erling_tm_about .right{width: 100%;padding-left: 0px;}
	.erling_tm_title h3{font-size: 32px;}
	.erling_tm_title span{font-size: 15px;}
	.erling_tm_title span:before{width: 30px;}
	.erling_tm_title span{padding-left: 45px;}
	.accordion_wrap .accordion_header h3{font-size: 16px;}
	.erling_tm_experience .box .title h3{font-size: 16px;}
	.erling_tm_testimonials .short h3{font-size: 16px;}
	.erling_tm_service .service_list > ul > li{width: 50%;}
	.erling_tm_service .service_list .title{font-size: 20px;}
	.erling_tm_service .service_list .list_inner .svg{width: 53px;height: 53px;}
	.erling_tm_swiper_progress .pagination_progress{width: 100px;}
	.erling_tm_experience .experience_inner{flex-direction: column;}
	.erling_tm_experience .left{width: 100%;padding-right: 0px;margin-bottom: 30px;}
	.erling_tm_experience .right{width: 100%;padding-left: 0px;}
	.erling_tm_experience .box .occ h3{font-size: 16px;}
	.erling_tm_news .news_list ul li{width: 50%;}

	.erling_tm_hero .wrapper{flex-direction: column;justify-content: center;}
	.erling_tm_hero .leftpart{width: 280px;height: 280px;margin: 0px auto;margin-bottom: 40px;}
	.erling_tm_hero .rightpart{width: 100%;}
	.erling_tm_hero .wrapper .text{padding: 0px;}
	.erling_tm_hero .wrapper .text h3{font-size: 60px;}
	.erling_tm_hero .wrapper.textspacing .text h3:nth-child(2){padding-left: 0px;}
	.erling_tm_hero .wrapper.textspacing .job{margin-left: 0px;}
	
	.erling_tm_about .image{width: 300px;height: 300px;margin-bottom: 40px;}
	.erling_tm_about .image.rounded{width: 280px;height: 280px;margin-bottom: 40px;}
	.erling_tm_about .square .image{width: 280px;height: 280px;margin-bottom: 40px;}
	
	
}
@media (max-width: 768px) {
	.erling_tm_service .service_list > ul{margin: 0px;}
	.erling_tm_service .service_list > ul > li{width: 100%;padding-left: 0px;}
	.erling_tm_news .news_list ul{margin: 0px;}
	.erling_tm_news .news_list ul li{width: 100%;padding-left: 0px;}
	.erling_tm_contact .form_wrapper ul{margin: 0px;}
	.erling_tm_contact .form_wrapper ul li{width: 100%;padding-left: 0px;}
	.erling_tm_contact .enter_code input{width: 100%;}
	.accordion_wrap .info_list ul li span:first-child{min-width: auto;}
	.erling_tm_copyright .inner{flex-direction: column;}
	.erling_tm_copyright .logo{margin-bottom: 15px;}
	.erling_tm_copyright .logo img{max-width: 110px;max-height: 70px;}
	.erling_tm_service .service_list .list_inner{padding: 60px 30px;}
	.erling_tm_experience .box ul li .list_inner{padding: 40px 35px 35px 35px;}
	.accordion_wrap .accordion_header{padding: 25px 30px;}
	.accordion_wrap .accordion_content{padding: 30px;}
	.erling_tm_testimonials .short{padding: 25px 30px;}
	.erling_tm_testimonials .desc{padding: 40px 30px 60px 30px}
	.erling_tm_experience .box .title{padding: 25px 30px;}
	.erling_tm_experience .box ul li .list_inner{padding: 40px 30px 35px 30px;}
}




.space{ margin-bottom: 100px;}




.content {width: 100%; padding:0;
	background:url("../img/piano22.jpg") no-repeat center center;
	background-size:contain;>
	
	


.workbox-a {
  background-color: red;
  height: 300px;
  width: 300px;
  flex: 1;
  color: blue;
  margin-right: 1rem;
}