@charset "utf-8";
/* CSS Document */

/*%%%%%%%%%%%%%%%%

SECTION INDEX
------------------
1. FONTS
2. COMMON STYLE
3. HEADER SECTION
4. BODY SECTOIN
5. FOOTER SECTION
6. INNER PAGES
7. MEDIA QUEARY

%%%%%%%%%%%%%%%%*/

/* 1

FONTS %%%%%*/

@font-face {
	font-family: 'barlowblack';
	src: url('fonts/Barlow-Black-webfont.eot');
	src: url('fonts/Barlow-Black-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/Barlow-Black-webfont.woff') format('woff'), url('fonts/Barlow-Black-webfont.ttf') format('truetype'), url('fonts/Barlow-Black-webfont.svg#barlowblack') format('svg');
	font-weight: normal;
	font-style: normal;
}
/*%%%%%*/

/* 
2

COMMON STYLE %%%%%*/
#preloader {
	position:fixed;
	display: table;
	width: 100%;
	height: 100%;
	min-height: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
	vertical-align: middle;
	background: #fff;
	z-index:11111111111!important;
}
.preloader-container {
	position: relative;
	display: table-cell;
	vertical-align: middle;
	z-index: 3;
	text-align:center;
	margin-left: -90px;
}
body {
	font-family: 'Barlow', sans-serif;
	background: #fff;
	color: #13426f;
}
h1, h2, h3, h4 {
	font-family: 'Barlow', sans-serif;
	font-weight: 900;
}
h5 {
	font-family: 'Barlow', sans-serif;
	font-weight: 600;
}
img {
	max-width: 100%;
}
.saparator-200, .saparator-100, .saparator-50, .saparator-25, .saparator-nav-space {
	display: block;
	width: 100%;
}
.saparator-200 {
	height: 200px;
}
.saparator-100 {
	height: 100px;
}
.saparator-50 {
	height: 50px;
}
.saparator-nav-space {
	height: 122px;
	transition: all 0.3s ease;
}
.top-nav-anim-body .saparator-nav-space {
	height: 90px;
	transition: all 0.3s ease;
}
.saparator-200::after, .saparator-100::after, .saparator-50::after, .saparator-25::after, .saparator-nav-space::after {
	display: block;
	clear: both;
	content: "";
}
.sub-head-color {
	color: #898c8c;
}
.font-w-light {
	font-weight: 300;
	color: #898c8c;
}
/*btn arrow*/
.btn-arrowm, .btn-arrow-w {
	position: relative;
}
.btn-arrow::after {
	content: "";
	background: url(../images/arrow-left-l.svg);
	opacity: 0;
	transition: all 0.3s ease;
	width:14px;
	height: 12px;
	display: inline-block;
}
.btn-arrow-w::after {
	content: "";
	background: url(../images/arrow-left-w.svg);
	background-size:cover;
	opacity: 0;
	transition: all 0.3s ease;
	width:20px;
	height: 15px;
	display: inline-block;
}
.btn-arrow:hover::after, .btn-arrow-w:hover::after {
	opacity: 1;
	margin-left: 5px;
}
/* / btn arrow*/
/* Hide scrollbar for Chrome, Safari and Opera */
::-webkit-scrollbar {
 display: none;
}
/* Hide scrollbar for IE and Edge */
body, .portfolio-for {
	-ms-overflow-style: none;
}
/*Verticle lines*/
.grid {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	margin: auto;
	height: 100%;
	z-index: -1;
}
.grid:after {
	content: "";
	display: table;
	clear: both;
}
.grid span {
	float: left;
	direction: ltr;
	width: 8.333333333333333%;
	height: 100%;
	padding: 0 !important;
	border-left: 1px solid rgba(0, 0, 0, .07);
	display: inline-block;
	min-height: 1px;
	box-sizing: border-box;
}
.grid span:last-of-type {
	border-right: 1px solid rgba(0, 0, 0, .07);
}
.grid span:nth-child(2), .grid span:nth-child(4), .grid span:nth-child(6), .grid span:nth-child(8), .grid span:nth-child(10), .grid span:last-of-type {
	border-left: 0;
}
/* / Verticle lines*/

/*plus symbols*/
.plussymb {
	font-weight: 200;
	color: #dcdcdc;
}
.plussymb span {
	padding-top: 5%;
	padding-bottom: 5%;
}
.plussymb span:first-child {
	margin-left: -5px;
}
.plussymb span:last-child {
	margin-right: -5px;
}
/* / plus symbols*/
/*Clock*/

 .clock {
	height: 60px;
	width: 60px;
	border-radius: 30px;
	display: flex;
	justify-content: center;
	position: relative;
	border: solid 2px #222;
}
.clock__second, .clock__minute, .clock__hour, .clock__indicator {
	position: absolute;
	left: calc(50% - 1px);
	width: 2px;
	background: #222;
	transform-origin: bottom center;
	z-index: 2;
	border-radius: 1px;
}
.clock__second {
	height: 25px;
	margin-top: 2px;
	background: #d9002b;
	animation: time 60s infinite steps(60);
	z-index: 3;
}
.clock__minute {
	height: 25px;
	margin-top: 2px;
	opacity: 0.75;
	animation: time 3600s linear infinite;
}
.clock__hour {
	height: 15px;
	margin-top: 12px;
	animation: time 43200s linear infinite;
}
.clock__indicator {
	height: 28px;
	border-top: 2px solid #d9002b;
	background: none;
}
.clock__indicator:nth-of-type(5n) {
	opacity: 1;
	height: 23px;
	border-top: 7px solid #222;
}
.clock__axis {
	background: #d9002b;
	width: 5px;
	height: 5px;
	border-radius: 3px;
	position: absolute;
	z-index: 4;
	top: 24px;
}
 @keyframes time {
 to {
 transform: rotateZ(360deg);
}
}
/* / Clock*/

/* / COMMON STYLE %%%%%*/

/*% 
3

HEADER SECTION %%%%%%*/
.section-banner h1, .section-head {
	/*font-family: "barlowblack";*/
	margin: 0;
}
.top-nav {
	padding-top: 1rem;
	padding-bottom: 1rem;
	position: relative;
	width: 100%;
}
.top-phone a {
	color: #06223c;
}
.top-phone a:hover {
	color: #d9002b;
}
.cachu__section {
	width: 100%!important;
}
.section-banner {
	color: #FFF;
}
.section-banner h1 {
	text-transform: uppercase;
}
.section-banner h1 span {
	float: left;
	display: inline-block;
	padding-right: 10px;
}
.section-banner a {
	text-transform: uppercase;
	transition: all 0.5s ease;
}
.section-banner a:hover {
	transition: all 0.5s ease;
}
.site-msg {
	padding-bottom: 4rem;
	color: #fff;
	margin-top: -5%;
}
/*.top-nav {
	padding-top: 1rem;
	padding-bottom: 1rem;
}*/
/*--*/



/* / HEADER SECTION %%%%%*/

/*% 
4

BODY SECTOIN %%%%%*/

/*Service section*/
.section-services {
	position: relative;/*overflow: hidden;*/
}
.services-head {
	padding-bottom: 3rem;
}
.section-services-sp-bg-blue, .section-services-sp-bg-black, .section-services-sp-bg-blue2, .section-services-sp-bg-black2, .section-services-sp-bg-blue3, .section-services-sp-bg-black3, .section-services-sp-bg-blue4, .section-services-sp-bg-black4, .section-services-sp-bg-blue5, .section-services-sp-bg-black5 {
	position: absolute;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 11;
	display:none;
}
.section-services-sp-bg-blue, .section-services-sp-bg-blue2, .section-services-sp-bg-blue3, .section-services-sp-bg-blue4, .section-services-sp-bg-blue5 {
	background: #0082a6;
	z-index: 1111;
}
.section-services-sp-bg-black, .section-services-sp-bg-black2, .section-services-sp-bg-black3, .section-services-sp-bg-black4, .section-services-sp-bg-black5 {
	background: #17212b;
	z-index: 1;
}
.section-services-sp-bg {
	-webkit-animation-name: section-services-sp-bg;
	animation-name: section-services-sp-bg;
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	animation-iteration-count: 1;
}
@-webkit-keyframes section-services-sp-bg {
 0% {
 transform: translateY(0);
}
 100% {
 transform: translateY(-100%);
}
}
@keyframes section-services-sp-bg {
 0% {
 transform: translateY(0);
}
 100% {
 transform: translateY(-100%);
}
}
.services-desc {
	font-weight: 300;
}
.btn-start-proj {
	text-transform: uppercase;
	border: solid 5px #13426f;
	display: inline-block;
	width: 100%;
	padding: 12%;
	transition: all 0.5s ease;
	color: #13426f;
}
.btn-start-proj:hover {
	border-color: #d9002b;
	background: #d9002b;
	color: #fff;
	transition: all 0.5s ease;
}
.img-service-design {
	margin-top: 10%;
}
.img-service-development {
	margin-top: 10%;
}
/* / Service section*/

/*Work section*/
.portfolio-for {
	color: #fff;
}
.section-work-for {
/*position: relative;
	overflow: hidden;*/
}
.work-area h4:last-child {
	padding-bottom: 0;
}
.portfolio-head {
	/*background: #233342;
	color: #fff;*/
	padding: 11.5% 10% 0 5%;
}
.portfolio-head a {
	color: #fff;
}
.portfolio-head a:hover {
	color: #00aad9;
}
.portfolio-head span {
	font-size: 16px;
	font-weight: 300;
}
.portfolio-body {
	/*background: rgb(226,226,226);
	background: linear-gradient(90deg, rgba(226,226,226,1) 33.3%, #233342 33.3%);*/
	padding: 5%;
}
.portfolio-foot {
	/*background: #233342;
	color: #fff;*/
	padding: 0 5% 5% 5%;
	text-transform: uppercase;
}
.work-item-name {
	padding-top: 13%;
}
.portfolio-nav p {
margin-top: .5rem;
margin-bottom: .5rem;
}
/*.portfolio-nav p a {
	color: #222;
}
.portfolio-nav .slick-current a, .portfolio-nav p a:hover {
	color: #d9002b;
}*/
.portfolio-nav p a:focus, .portfolio-nav p a:active {
	outline: 0;
}
/*Work section*/

/*Section mission*/
.section-mission {
	position: relative;/*overflow: hidden;*/
}
.class-mission-desc {
	text-transform: uppercase;
	color: #6f7882;
}
.class-mission-slogan {
	font-size: 5.5vw;
	text-transform: uppercase;
}
/* / Section mission*/

/*About us content*/
.section-about {
	position: relative;/*overflow: hidden;*/
}
.section-about .plussymb span {
	color: #898989;
}
.section-about .plussymb {
	z-index: 11;
}
.about-content {
	color: #fff;
}
.about-content .font-w-light { color: #fff;}
.about-desc {
	background: #fff;
	padding: 10% 15%;
	color: #111;
	z-index: 1111;
}
.about-desc h2 {
	color: #ba204b;
	font-size: 3vw;
	z-index: 111;
}
.about-desc p {
	font-size: 1rem;
}
/* / About us content*/

/*section-contacts*/
.section-contacts {
	position: relative;
	padding-top: 100px;/*overflow: hidden;*/
}
.contact-us-email a { color: #13426f;}
.contact-us-email a:hover { color: #d9002b;}
/* / section-contacts*/


/* / BODY SECTOIN %%%%%*/

/*% 
5

FOOTER SECTION %%%%%*/
.section-footer {
	overflow: hidden;
}
.copyright {
	font-style: italic;
	font-size: 1rem;
	padding-top: 1rem;
	padding-bottom: 1rem;
}
.contact-us a {
	color: #13426f;
}
.contact-us a:hover {
	color: #d9002b;
}
#svg-footer {
	position: absolute;
	bottom: -5px;
	left: 0;
}
#service-svg {
	position: absolute;
	top: 14rem;
	left: 0;
	transform: translateX(-40%);
}
.copyright { color: #898c8c;}
/* / FOOTER SECTION %%%%%*/

/*%
6

INNER PAGES %%%%%*/




/* / INNER PAGES %%%%%*/


/*%
7

MEDIA QUEARY %%%%%*/
@media (min-width: 768px) {
.workfor-desc {
	font-size: 1.5rem;
}
}
@media (min-width: 1200px) {
.section-banner h1, .section-head {
	font-size: 4.5vw;
}
.top-nav {
	padding-top: 2rem;
	padding-bottom: 2rem;
	transition: all 0.3s ease;
}
.top-nav.top-nav-anim {
	padding-top: 8px;
	padding-bottom: 8px;
	transition: all 0.8s ease;
}
.top-nav img {
	transition: all 0.8s ease;
	height: 48px;
}
.top-nav.top-nav-anim img {
	height: 30px;
	transition: all 0.8s ease;
}
.section-7 .saparator-100, .section-9 .saparator-100 {
	height: 50px;
}
}
@media (min-width: 1366px) {
.work-for-item h4 {
	padding-bottom: 25px;
}
}
@media (min-width: 1600px) {
.body-p {
	padding-left: 3rem;
	padding-right: 3rem;
}
.top-nav {
	width: calc(100% - 6rem);
}
}
@media (min-width: 1200px) and (max-width: 1599px) {
.section-mission {
	padding-left: 3rem;
	padding-right: 3rem;
}
}
@media (min-width: 1200px) and (max-width: 1440px) {
#banner-svg {
	transform: translate(10%, -40%)!important;
}
.site-msg {
	margin-top: -30%;
}
.work-item-name {
	padding-top: 8%;
}
.work-item-name .saparator-100 {
	height: 50px;
}
}
@media (min-width: 768px) and (max-width: 1199px) {
#banner-svg {
	transform: translate(-6%, -36%)!important;
}
.section-banner h1 {
	font-size: 4rem;
}
.site-msg {
	margin-top: -55%;
}
.services-head {
	padding-top: 2.5rem;
}
}
@media (max-width: 1199px) {
.grid, .dot {
	display: none;
}
.top-nav {
	padding-top: 10px;
	padding-bottom: 10px;
}
.navbar-brand {
	padding-top: 0;
	padding-bottom: 0;
}
.top-nav img {
	height: 30px;
}
.saparator-nav-space {
	height: 52.91px;
	display: none;
}
.section-1 .saparator-nav-space {
	display: block;
}
.section-banner {
	background-color: #06223c;
}
.img-service-design {
	width: 100%;
}
.section-3 .section-services, .section-work-for {
	background: #f2f2f3;
}
.services-design {
	padding-bottom: 100px;
	padding-top: 100px;
}
.img-service-design {
	margin-top: 0;
	margin-bottom: 100px;
}
.img-service-design.img-service-2 {
	margin-top: 10%;
}
.section.section-3 svg {
	display: none;
}
.section-work-for .plussymb {
	display: none;
}
.services-development {
	padding-top: 50px;
}
.section-work-for {
	padding-top: 100px;
	padding-bottom: 100px;
}
.work-for-head {
	padding-bottom: 60px;
}
.btn-start-proj {
	margin-top: 60px;
}
.section-6 .work-item-head + .saparator-100 {
	height: 50px;
}
.section-6 .workfor-desc br {
	display: none;
}
.work-item-name .workfor-desc + .saparator-100 {
	height: 70px;
}
.portfolio-head {
	padding-top: 100px;
	padding-left:8.3333%;
	padding-right:8.3333%;
}
.portfolio-body {
	padding-left: 8.3333%;
	padding-right: 8.3333%;
}
.portfolio-foot {
	padding-bottom: 90px;
	padding-left: 8.3333%;
	padding-right: 8.3333%;
}
.portfolio-nav {
	display: none;
}
.portfolio-for {
	background: #06223c;
}
.section-mission {
	padding-bottom: 100px;
}
.section-mission .saparator-100 {
	height: 50px;
}
.about-content {
	width: 100%;
	background-color: #2b2f67;
	background-image:url(../images/bg-about.jpg);
	background-repeat: no-repeat;
	background-position: right;
	background-size:cover;
}
.about-content .saparator-50 {
	display: none;
}
.about-desc .col-9 {
	flex: auto;
	max-width: 100%;
}
.contact-us-head {
	padding-top: 100px;
}
.section-footer .plussymb {
	display: none;
}
.copyright-hold {
	position: relative;
}
.copyright {
	padding-top: 130px;
	padding-bottom: 50px;
}
}
@media (max-width: 992px) {
.class-mission-slogan {
	font-size: 6.5vw;
}
}
@media (max-width: 767px) {
.section-banner h1 {
	font-size: 2.5rem;
}
svg {
	display: none;
}
.top-phone {
	font-size: 16px;
}
.section-banner {
	padding-top: 50px;
}
.site-msg {
	margin-top: 25px;
}
.services-desc {
	font-size: 1.5rem;
}
.class-mission-slogan {
	font-size: 11vw;
}
.about-desc h2 {
	font-size: 8vw;
}
.contact-us-email h2 {
	font-size: 1.65rem;
}
}
 @media (max-width: 575px) {
.contact-us-country-den address + .saparator-50, .contact-us-country-ind address + .saparator-50 {
	height: 10px;
}
.contact-us-country-den {
	padding-bottom: 50px;
	padding-top: 50px;
	border-bottom: solid 1px #eee;
	border-top: solid 1px #eee;
}
.contact-us-country-ind {
	padding-top: 50px;
	border-bottom: solid 1px #eee;
	padding-bottom: 50px;
}
.copyright {
	padding-top: 50px;
}
}
/* / MEDIA QUEARY %%%%%*/




/* Animation =======================================*/
@media (min-width: 1200px) {
.banner-background {
	transform: translateX(102%);
}
.current .banner-background {
	position: absolute;
	width: 100%;
	background-color: #06223c;
	animation: bannerBgAnim 750ms linear 250ms forwards 1;
	transition: all 0.3s ease;
}
@keyframes bannerBgAnim {
0% {
transform: translateX(102%);
height: 10px;
}
50% {
transform: translateX(0%);
height: 10px;
}
100% {
transform: translateX(0%);
height: 100%;
}
}
/*--*/
.about-background {
	transform: translateX(102%);
}
.current .about-background {
	position: absolute;
	width: 100%;
	background-color: #2b2f67;
	background-image:url(../images/bg-about.jpg);
	background-repeat: no-repeat;
	background-position: right;
	background-size:contain;
	animation: aboutBgAnim 750ms linear 750ms forwards 1;
	transition: all 0.3s ease;
}
@keyframes aboutBgAnim {
0% {
transform: translateX(102%);
height: 10px;
}
20% {
transform: translateX(0%);
height: 10px;
}
60% {
transform: translateX(0%);
height: 10px;
}
100% {
transform: translateX(0%);
height: 100%;
}
}
/*--*/
.current .folio-bg-anim {
	position: absolute;
	width: 100%;
	height: 100%;
	animation: folio-bg-anim 500ms linear 1000ms forwards 1;
	transform: translateY(102%);
}
@keyframes folio-bg-anim {
 0% {
bottom: 0px;
left: 0px;
width: 10px;
transform: translateY(102%);
background-color: #06223c;
}
 50% {
bottom: 0px;
left: 0;
top: 0;
width: 10px;
transform: translateY(0%);
background-color: #06223c;
}
 100% {
bottom: 0px;
left: 0;
top: 0;
right: 0;
width: 100%;
transform: translateY(0%);
background-color: #06223c;
}
}
/*--*/

.current .portfolio-for h2, .portfolio-body img, .current .portfolio-for .portfolio-foot p:first-child, .current .portfolio-for .portfolio-foot p:nth-child(2), .current .portfolio-for .portfolio-foot p:nth-child(3) {
	transform: translateX(150%);
	transition: all 0.3s ease;
}
.current .portfolio-for h2 {
	animation: folio-move-left 500ms linear 1250ms forwards 1;
}
.current .portfolio-for img {
	animation: folio-move-left 500ms linear 1500ms forwards 1;
}
.current .portfolio-for .portfolio-foot p:first-child {
	animation: folio-move-left 500ms linear 1750ms forwards 1;
}
.current .portfolio-for .portfolio-foot p:nth-child(2) {
	animation: folio-move-left 500ms linear 2000ms forwards 1;
}
.current .portfolio-for .portfolio-foot p:nth-child(3) {
	animation: folio-move-left 500ms linear 2250ms forwards 1;
}
 @keyframes folio-move-left {
 0% {
 transform: translateX(150%);
}
 100% {
 transform: translateX(0);
}
}
/*--*/


@keyframes fadeInUpSmall {
0% {
 opacity: 0;
 -webkit-transform: translate3d(0, 30px, 0);
 transform: translate3d(0, 30px, 0);
}
 70% {
 opacity: 1;
 -webkit-transform: translate3d(0, -8px, 0);
 transform: translate3d(0, -8px, 0);
}
 100% {
 opacity: 1;
 -webkit-transform: translate3d(0, 0, 0);
 transform: translate3d(0, 0, 0);
}
}
.section-banner h1, .site-msg, .services-head, .services-desc, .img-service-1, .services-design h3, .services-design p, .s-d-h-1, .s-d-h-2, .services-ux h3, .services-ux p, .s-u-1, .s-u-2, .s-u-3, .s-u-4, .img-service-2, .services-development h3, .services-development p, .s-dv-h-1, .s-dv-h-2, .img-service-development, .work-for-head, .work-for-item-1, .work-for-item-2, .work-for-item-3, .work-for-item-4, .work-for-item-5, .work-for-item-6, .work-for-item-7, .work-for-item-8, .work-for-button, .work-item-head, .workfor-desc, .portfolio-nav, .class-mission-desc, .mission-head, .about-head, .about-head-item, .about-head-desc, .about-desc, .contact-us-head, .contact-us-email, .contact-us-phone, .contact-us-country-den, .contact-us-country-ind, .copyright {
	opacity: 0;
}
.current .section-banner h1 {
	animation: fadeInUpSmall 500ms linear 1000ms forwards 1;
}
.current .site-msg {
	animation: fadeInUpSmall 500ms linear 2500ms forwards 1;
}
.current .services-head {
	animation: fadeInUpSmall 500ms linear 0ms forwards 1;
}
.current .services-desc {
	animation: fadeInUpSmall 500ms linear 250ms forwards 1;
}
.current .img-service-1 {
	animation: fadeInUpSmall 500ms linear 650ms forwards 1;
}
.current .services-design h3 {
	animation: fadeInUpSmall 500ms linear 150ms forwards 1;
}
.current .services-design p {
	animation: fadeInUpSmall 500ms linear 500ms forwards 1;
}
.current .s-d-h-1 {
	animation: fadeInUpSmall 500ms linear 750ms forwards 1;
}
.current .s-d-h-2 {
	animation: fadeInUpSmall 500ms linear 1000ms forwards 1;
}
.current .services-ux .services-ux-h {
	animation: fadeInUpSmall 500ms linear 1250ms forwards 1;
}
.current .services-ux p {
	animation: fadeInUpSmall 500ms linear 1500ms forwards 1;
}
.current .s-u-1 {
	animation: fadeInUpSmall 300ms linear 1750ms forwards 1;
}
.current .s-u-2 {
	animation: fadeInUpSmall 300ms linear 2000ms forwards 1;
}
.current .s-u-3 {
	animation: fadeInUpSmall 300ms linear 2250ms forwards 1;
}
.current .s-u-4 {
	animation: fadeInUpSmall 300ms linear 2500ms forwards 1;
}
.current .img-service-2 {
	animation: fadeInUpSmall 500ms linear 2750ms forwards 1;
}
.current .services-development h3 {
	animation: fadeInUpSmall 500ms linear 150ms forwards 1;
}
.current .services-development p {
	animation: fadeInUpSmall 500ms linear 400ms forwards 1;
}
.current .s-dv-h-1 {
	animation: fadeInUpSmall 500ms linear 650ms forwards 1;
}
.current .s-dv-h-2 {
	animation: fadeInUpSmall 500ms linear 1000ms forwards 1;
}
.current .img-service-development {
	animation: fadeInUpSmall 500ms linear 1500ms forwards 1;
}
.current .work-for-head {
	animation: fadeInUpSmall 500ms linear 150ms forwards 1;
}
.current .work-for-item-1 {
	animation: fadeInUpSmall 300ms linear 500ms forwards 1;
}
.current .work-for-item-2 {
	animation: fadeInUpSmall 300ms linear 650ms forwards 1;
}
.current .work-for-item-3 {
	animation: fadeInUpSmall 300ms linear 800ms forwards 1;
}
.current .work-for-item-4 {
	animation: fadeInUpSmall 300ms linear 950ms forwards 1;
}
.current .work-for-item-5 {
	animation: fadeInUpSmall 300ms linear 1100ms forwards 1;
}
.current .work-for-item-6 {
	animation: fadeInUpSmall 300ms linear 1250ms forwards 1;
}
.current .work-for-item-7 {
	animation: fadeInUpSmall 300ms linear 1400ms forwards 1;
}
.current .work-for-item-8 {
	animation: fadeInUpSmall 300ms linear 1550ms forwards 1;
}
.current .work-for-button {
	animation: fadeInUpSmall 500ms linear 2000ms forwards 1;
}
.current .work-item-head {
	animation: fadeInUpSmall 500ms linear 150ms forwards 1;
}
.current .workfor-desc {
	animation: fadeInUpSmall 500ms linear 400ms forwards 1;
}
.current .portfolio-nav {
	animation: fadeInUpSmall 500ms linear 750ms forwards 1;
}
.current .mission-head {
	animation: fadeInUpSmall 500ms linear 150ms forwards 1;
}
.current .class-mission-desc {
	animation: fadeInUpSmall 500ms linear 3000ms forwards 1;
}
.current .about-head {
	animation: fadeInUpSmall 500ms linear 150ms forwards 1;
}
.current .about-head-item {
	animation: fadeInUpSmall 500ms linear 1750ms forwards 1;
}
.current .about-head-desc {
	animation: fadeInUpSmall 500ms linear 2000ms forwards 1;
}
.current .about-desc {
	animation: fadeInUpSmall 500ms linear 2250ms forwards 1;
}
.current .contact-us-head {
	animation: fadeInUpSmall 500ms linear 150ms forwards 1;
}
.current .contact-us-email {
	animation: fadeInUpSmall 500ms linear 400ms forwards 1;
}
.current .contact-us-phone {
	animation: fadeInUpSmall 500ms linear 650ms forwards 1;
}
.current .contact-us-country-den {
	animation: fadeInUpSmall 500ms linear 1000ms forwards 1;
}
.current .contact-us-country-ind {
	animation: fadeInUpSmall 500ms linear 1250ms forwards 1;
}
.current .copyright {
	animation: fadeInUpSmall 500ms linear 3000ms forwards 1;
}
/* title styles */
:root {
 --bg-color: #fff;
}
.home-title {
	opacity: 0;
}
.current .home-title {
	opacity: 1;
}
.current .home-title span {
	position: relative;
	overflow: hidden;
	display: block;
	line-height: 1.2;
}
.current .home-title span::after {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: white;
	animation: a-ltr-after 2s cubic-bezier(0.77, 0, 0.18, 1) forwards;
	transform: translateX(-101%);
}
.current .home-title span::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	background: var(--bg-color);
	animation: a-ltr-before 2s cubic-bezier(0.77, 0, 0.18, 1) forwards;
	transform: translateX(0);
}
.current .home-title span:nth-of-type(1)::before, .current .home-title span:nth-of-type(1)::after {
	animation-delay: .25s;
}
.current .home-title span:nth-of-type(2)::before, .current .home-title span:nth-of-type(2)::after {
	animation-delay: .75s;
}
.current .home-title span:nth-of-type(3)::before, .current .home-title span:nth-of-type(3)::after {
	animation-delay: 1.25s;
}
 @keyframes a-ltr-after {
 0% {
 transform: translateX(-100%);
}
 100% {
 transform: translateX(101%);
}
}
 @keyframes a-ltr-before {
 0% {
 transform: translateX(0);
}
 100% {
 transform: translateX(200%);
}
}
/* / --*/



/*- banner SVG -*/
#banner-svg {
	transform: translate(24%, -20%);
}
.ZmkZcugp_0, .ZmkZcugp_1, .ZmkZcugp_2, .ZmkZcugp_3, .ZmkZcugp_4, .ZmkZcugp_5, .ZmkZcugp_6 {
	opacity: 0;
}
.current .ZmkZcugp_0 {
	stroke-dasharray:2504 2506;
	stroke-dashoffset:2505;
	animation: ZmkZcugp_draw 2000ms linear 800ms forwards 1;
}
.current .ZmkZcugp_1 {
	stroke-dasharray:2356 2358;
	stroke-dashoffset:2357;
	animation:ZmkZcugp_draw 2000ms linear 966ms forwards 1;
}
.current .ZmkZcugp_2 {
	stroke-dasharray:2220 2222;
	stroke-dashoffset:2221;
	animation:ZmkZcugp_draw 2000ms linear 1133ms forwards 1;
}
.current .ZmkZcugp_3 {
	stroke-dasharray:2090 2092;
	stroke-dashoffset:2091;
	animation:ZmkZcugp_draw 2000ms linear 1300ms forwards 1;
}
.current .ZmkZcugp_4 {
	stroke-dasharray:1962 1964;
	stroke-dashoffset:1963;
	animation:ZmkZcugp_draw 2000ms linear 1466ms forwards 1;
}
.current .ZmkZcugp_5 {
	stroke-dasharray:1851 1853;
	stroke-dashoffset:1852;
	animation:ZmkZcugp_draw 2000ms linear 1633ms forwards 1;
}
.current .ZmkZcugp_6 {
	stroke-dasharray:1730 1732;
	stroke-dashoffset:1731;
	animation:ZmkZcugp_draw 2000ms linear 800ms forwards 1;
}
/* / banner SVG --*/

/*Service SVG*/

/*--*/
.CioEmNLa0, .CioEmNLa1, .CioEmNLa2, .CioEmNLa3, .CioEmNLa4, .CioEmNLa5 {
	opacity: 0;
}
.current .CioEmNLa0 {
	stroke-dasharray:1714 1716;
	stroke-dashoffset:1715;
	animation: ZmkZcugp_draw 2000ms linear 5000ms forwards 1;
}
.current .CioEmNLa1 {
	stroke-dasharray:1700 1702;
	stroke-dashoffset:1701;
	animation: ZmkZcugp_draw 2000ms linear 5200ms forwards 1;
}
.current .CioEmNLa2 {
	stroke-dasharray:1689 1691;
	stroke-dashoffset:1690;
	animation: ZmkZcugp_draw 2000ms linear 5400ms forwards 1;
}
.current .CioEmNLa3 {
	stroke-dasharray:1688 1690;
	stroke-dashoffset:1689;
	animation: ZmkZcugp_draw 2000ms linear 5600ms forwards 1;
}
.current .CioEmNLa4 {
	stroke-dasharray:1695 1697;
	stroke-dashoffset:1696;
	animation: ZmkZcugp_draw 2000ms linear 5800ms forwards 1;
}
.current .CioEmNLa5 {
	stroke-dasharray:1711 1713;
	stroke-dashoffset:1712;
	animation: ZmkZcugp_draw 2000ms linear 6000ms forwards 1;
}
/*--*/
.CioEmNLa_0, .CioEmNLa_1, .CioEmNLa_2, .CioEmNLa_3, .CioEmNLa_4, .CioEmNLa_5 {
	opacity: 0;
}
.current .CioEmNLa_0 {
	stroke-dasharray:1714 1716;
	stroke-dashoffset:1715;
	animation: ZmkZcugp_draw 2000ms linear 2000ms forwards 1;
}
.current .CioEmNLa_1 {
	stroke-dasharray:1700 1702;
	stroke-dashoffset:1701;
	animation: ZmkZcugp_draw 2000ms linear 2200ms forwards 1;
}
.current .CioEmNLa_2 {
	stroke-dasharray:1689 1691;
	stroke-dashoffset:1690;
	animation: ZmkZcugp_draw 2000ms linear 2400ms forwards 1;
}
.current .CioEmNLa_3 {
	stroke-dasharray:1688 1690;
	stroke-dashoffset:1689;
	animation: ZmkZcugp_draw 2000ms linear 2600ms forwards 1;
}
.current .CioEmNLa_4 {
	stroke-dasharray:1695 1697;
	stroke-dashoffset:1696;
	animation: ZmkZcugp_draw 2000ms linear 2800ms forwards 1;
}
.current .CioEmNLa_5 {
	stroke-dasharray:1711 1713;
	stroke-dashoffset:1712;
	animation: ZmkZcugp_draw 2000ms linear 3000ms forwards 1;
}
 @keyframes ZmkZcugp_draw {
0% {
opacity: 0;
}
1% {
opacity: 1;
}
100% {
stroke-dashoffset:0;
opacity: 1;
}
}
/*Service SVG*/
}
/* / Animation =======================================*/
